:root{--ink:#202d27;--muted:#59685e;--green:#28634e;--forest:#193d32;--sage:#e3ebdd;--paper:#f7f6f0;--line:#dde2d7;--card:#fffefa}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font:16px/1.5 -apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif}button,input,select,textarea{font:inherit}button{cursor:pointer}button:disabled{opacity:.5;cursor:wait}[hidden]{display:none!important}.app{max-width:580px;margin:auto;padding:env(safe-area-inset-top) 22px calc(115px + env(safe-area-inset-bottom))}header{display:flex;align-items:center;justify-content:space-between;padding:24px 0 16px}.brand{display:flex;gap:10px;align-items:center;text-decoration:none;color:var(--ink);font-weight:700;font-size:20px}.brand img{border-radius:9px}.brand small{display:block;font-size:8px;letter-spacing:1.8px;color:var(--muted);font-weight:500}.icon{background:transparent;border:1px solid var(--line);border-radius:50%;width:44px;height:44px;font-size:26px;color:var(--green)}.connection{font-size:12px;color:var(--muted);border-top:1px solid var(--line);padding:9px 0 18px}.connection.offline{color:#825c20}.eyebrow{font-size:10px;letter-spacing:1.5px;font-weight:650;color:var(--muted);margin:0 0 8px}h1{font-size:36px;letter-spacing:-1.5px;line-height:1.12;font-weight:650;margin:6px 0 26px}h2{font-size:18px;letter-spacing:-.4px;margin:0 0 10px}.session,.panel{background:var(--card);border:1px solid var(--line);border-radius:18px;padding:22px;margin:0 0 18px}.session-top,.row{display:flex;align-items:center;justify-content:space-between;gap:8px}.badge{color:var(--green);background:var(--sage);padding:5px 11px;border-radius:20px;font-size:12px;font-weight:600}.ring{--progress:0deg;width:230px;height:230px;margin:22px auto;background:conic-gradient(var(--green) var(--progress),#e8ede4 0);border-radius:50%;padding:7px}.ring>div{height:100%;background:var(--card);border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center}.timer{font-size:37px;font-weight:650;font-variant-numeric:tabular-nums;letter-spacing:-1.5px;line-height:1;margin:0 0 7px}.ring p+p{font-size:12px;margin:0}.primary,.secondary{display:block;min-height:52px;width:100%;border-radius:10px;padding:12px 16px;font-weight:600;border:1px solid var(--green);margin-top:12px}.primary{background:var(--green);color:white}.secondary{background:transparent;color:var(--green);border-color:var(--line)}button:hover{filter:brightness(.95)}button:active{filter:brightness(.87)}:focus-visible{outline:3px solid #a47b38;outline-offset:3px}.actions{display:flex;gap:10px}.actions .primary{flex:2}.actions .secondary{flex:1}.muted{color:var(--muted)}.fine{font-size:12px}.center{text-align:center}.stats{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin:25px 0}.stats article+article{border-left:1px solid var(--line);padding-left:20px}.stats strong{font-size:28px;letter-spacing:-1px;font-variant-numeric:tabular-nums}.stats p{margin-bottom:4px}.week-bars{display:flex;gap:8px;height:130px;align-items:end;padding-top:20px}.bar-day{flex:1;text-align:center;font-size:10px;color:var(--muted)}.bar-track{height:72px;display:flex;align-items:end;justify-content:center}.bar{background:#afc5a6;border-radius:4px 4px 0 0;width:65%;min-height:3px}.bar-day.today .bar{background:var(--green)}.bar-day strong{display:block;font-size:9px;font-weight:500;white-space:nowrap}.text-button{background:none;border:none;color:var(--green);padding:10px;min-height:44px;font-size:14px}nav{position:fixed;bottom:0;left:50%;transform:translateX(-50%);width:min(100%,580px);background:var(--forest);display:flex;padding:8px 8px calc(8px + env(safe-area-inset-bottom));border-radius:20px 20px 0 0;z-index:10}nav button{flex:1;border:0;background:transparent;color:#c7d7cb;border-radius:12px;font-size:24px;min-height:58px}nav button span{display:block;font-size:10px;letter-spacing:.3px}nav button.active{background:#365a49;color:white}label{display:block;font-size:13px;font-weight:600;margin:18px 0 7px}input,select,textarea{width:100%;min-width:0;min-height:48px;border:1px solid #8b9b8e;border-radius:8px;padding:10px;background:var(--card);color:var(--ink)}textarea{resize:vertical}.entry{display:flex;justify-content:space-between;border-bottom:1px solid var(--line);padding:13px 0}.entry time{font-variant-numeric:tabular-nums;font-weight:600}#message{position:fixed;bottom:calc(96px + env(safe-area-inset-bottom));left:50%;transform:translateX(-50%);width:min(90%,520px);padding:14px 18px;border-radius:10px;background:#fff3d9;color:#5e4216;box-shadow:0 4px 20px #0002;z-index:20;white-space:pre-line;font-size:14px}.document{display:block;text-decoration:none;color:var(--ink);overflow-wrap:anywhere}.document span{color:var(--green);font-size:13px}dialog{width:min(95%,540px);max-height:85dvh;overflow:auto;background:var(--paper);border:1px solid var(--line);border-radius:16px;padding:22px;color:var(--ink)}dialog::backdrop{background:#14271b88}.edit-row{display:grid;grid-template-columns:1fr 1fr 44px;gap:7px;margin:12px 0}.edit-row button{border:1px solid var(--line);background:transparent;border-radius:8px;color:#a32d20}#entries:empty:after{content:'No punches recorded for this day.';display:block;color:var(--muted);padding:14px 0}@media(min-width:650px){.app{padding-top:24px}h1{font-size:42px}.session{padding:28px}.ring{width:250px;height:250px}}@media(prefers-reduced-motion:no-preference){button{transition:filter .12s ease}}

.action-icon{width:20px;height:20px;vertical-align:middle;margin-right:4px;flex-shrink:0}.actions button{display:flex;align-items:center;justify-content:center;gap:4px;padding:12px 8px}.actions .secondary{flex:0.8}

/* Keep navigation outside the scrolling content, including iOS dynamic toolbars. */
.app{height:100vh;height:100dvh;display:flex;flex-direction:column;padding:env(safe-area-inset-top) 22px 0;overflow:hidden}
header,.connection{flex-shrink:0}
#workspace,#login{flex:1;min-height:0;overflow-y:auto;overscroll-behavior-y:contain;-webkit-overflow-scrolling:touch;padding-bottom:24px;scroll-padding:16px}
#navigation{position:relative;left:auto;bottom:auto;transform:none;width:calc(100% + 44px);margin:0 -22px;flex-shrink:0}
#workspace:focus-visible{outline-offset:-3px}
h1{font-size:32px;margin-bottom:18px}
.stats{margin:12px 0 20px}
.ring{width:200px;height:200px;margin:16px auto}
.session{padding:18px}

.legacy-login{margin:22px 0;color:var(--muted);font-size:14px}.legacy-login summary{cursor:pointer;padding:10px 0;min-height:44px}
/* iPhone SE through Pro Max: content remains scrollable when browser chrome or keyboard changes. */
html,body{height:100%;overflow:hidden}
.app{height:var(--app-height,100dvh);padding-left:max(16px,env(safe-area-inset-left));padding-right:max(16px,env(safe-area-inset-right));width:100%}
header{gap:12px;padding-top:clamp(12px,3vh,24px)}
.brand{min-width:0;font-size:clamp(17px,4.8vw,20px)}
.brand small{font-size:clamp(7px,1.9vw,8px);letter-spacing:1.4px}
h1{font-size:clamp(27px,7.6vw,36px);overflow-wrap:break-word}
.stats{gap:12px}.stats article+article{padding-left:12px}.stats strong{font-size:clamp(23px,6.8vw,30px);white-space:nowrap}
.session,.panel{padding:clamp(14px,4.6vw,22px)}
.ring{width:min(210px,100%);height:auto;aspect-ratio:1}.timer{font-size:clamp(30px,8.8vw,38px)}
#navigation{width:auto;margin-left:calc(-1 * max(16px,env(safe-area-inset-left)));margin-right:calc(-1 * max(16px,env(safe-area-inset-right)));padding-left:max(8px,env(safe-area-inset-left));padding-right:max(8px,env(safe-area-inset-right));padding-bottom:max(8px,env(safe-area-inset-bottom))}
nav button{min-width:44px;min-height:52px}button,input,select,textarea{touch-action:manipulation}
input,select,textarea{font-size:16px}input[type=file]{font-size:14px;overflow:hidden}
#workspace{padding-right:1px}#message{max-height:35dvh;overflow:auto}
.edit-row{grid-template-columns:minmax(0,1fr) minmax(0,1fr) 44px}.edit-row select,.edit-row input{padding:8px 4px}
@media(max-width:350px){.actions{gap:6px}.actions button{font-size:14px}.action-icon{width:16px;height:16px;margin-right:0}.brand img{width:30px;height:30px}.connection{font-size:11px}.week-bars{gap:4px}}
@media(orientation:landscape) and (max-height:500px){header{padding:7px 0}.connection{padding:4px 0 7px}header .icon{height:36px;width:36px}.brand small{display:none}nav button{min-height:44px;font-size:20px}nav button span{font-size:9px}.session{display:grid;grid-template-columns:minmax(130px,1fr) minmax(130px,1fr);gap:8px}.session-top,.session>.center{grid-column:1/-1}.ring{width:150px;margin:4px auto}.timer{font-size:28px}.actions{flex-direction:column}.actions button{margin-top:4px}.stats{margin:8px 0 14px}h1{font-size:26px}.session>.center{margin:4px 0}.page{padding-bottom:8px}}
@media(orientation:landscape) and (max-height:500px){.app{max-width:960px}.page{max-width:800px;margin:auto;width:100%}header .icon{height:44px;width:44px}}

#invitation-page{flex:1;min-height:0;overflow-y:auto;padding-bottom:24px}.invite-heading{margin-top:24px}.invitation-row{display:flex;align-items:center;justify-content:space-between;gap:8px;border-top:1px solid var(--line);padding:10px 0}.invitation-row>div{min-width:0;overflow-wrap:anywhere}.invitation-row small{display:block;color:var(--muted);font-size:12px}#invite-result{margin:16px 0;padding:14px;background:var(--sage);border-radius:10px}#invite-link{font-size:13px}

#signup-page{flex:1;min-height:0;overflow-y:auto;padding-bottom:24px}.bot-field{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}