:root{--background:#f7f1e5;--surface:#fffdf7;--surface-alt:#eef5f1;--text:#172a2f;--muted:#5e6d70;--border:#c7d2ce;--primary:#176b55;--primary-dark:#10513f;--secondary:#d98b20;--danger:#b83b33;--sidebar:#173238;--focus:#f0b429;font-family:Arial,Helvetica,system-ui,sans-serif;color-scheme:light}
@media(prefers-color-scheme:dark){html[data-theme=system]{--background:#162126;--surface:#213037;--surface-alt:#2b3a40;--text:#f3f3ed;--muted:#b8c2c1;--border:#52656b;color-scheme:dark}}
html[data-theme=dark]{--background:#162126;--surface:#213037;--surface-alt:#2b3a40;--text:#f3f3ed;--muted:#b8c2c1;--border:#52656b;color-scheme:dark}
*{box-sizing:border-box}html{background:var(--background);color:var(--text)}body{margin:0;background:var(--background);min-height:100vh}button,input,a{font:inherit}button,a{touch-action:manipulation}:focus-visible{outline:4px solid var(--focus);outline-offset:3px}.demo-banner{background:#ffe49b;color:#362800;text-align:center;font-weight:700;padding:.55rem}.shell{min-height:100vh}.sidebar{position:fixed;inset:0 auto 0 0;width:240px;background:var(--sidebar);color:#fff;padding:1.25rem;display:flex;flex-direction:column;z-index:2}.brand{display:flex;align-items:center;gap:.7rem;color:#fff;text-decoration:none;font-weight:700;font-size:1.15rem;margin-bottom:2rem}.mark{display:inline-grid;place-items:center;width:36px;height:36px;border-radius:50%;background:#fff;color:var(--sidebar);font-weight:900}.mark.large{width:64px;height:64px;font-size:1.4rem;margin:auto}.sidebar nav{display:grid;gap:.35rem}.sidebar nav a,.nav-button{display:flex;gap:.75rem;color:#edf5f2;text-decoration:none;padding:.85rem;border-radius:8px;border:0;background:transparent}.sidebar nav a:hover,.sidebar nav a:focus-visible{background:#294950}.sidebar form{margin-top:auto}.nav-button{cursor:pointer;width:100%}main{margin-left:240px;padding:clamp(1rem,3vw,2.5rem);max-width:1500px}.page-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1.25rem}.page-header h1{margin:.2rem 0;font-size:clamp(1.6rem,4vw,2.4rem)}.eyebrow{color:var(--muted);margin:0}.status-label{display:inline-flex;gap:.3rem;border:1px solid var(--border);background:var(--surface);border-radius:7px;padding:.4rem .65rem;font-weight:700}.clock-panel{background:var(--surface);border:2px solid var(--border);border-radius:12px;padding:clamp(1rem,3vw,2rem);text-align:center;box-shadow:0 4px 12px #102a2217}.clock-status{font-weight:700;margin:.2rem}.worked span{display:block;font-size:clamp(2.5rem,8vw,5.5rem);font-weight:800;font-variant-numeric:tabular-nums;letter-spacing:-.04em}.worked small,.location-note{color:var(--muted)}.location-note{font-size:.9rem}.clock-button{width:min(100%,820px);min-height:150px;margin:.8rem auto 0;display:grid;place-content:center;gap:.15rem;border:0;border-bottom:8px solid var(--primary-dark);border-radius:14px;background:var(--primary);color:#fff;cursor:pointer}.clock-panel[data-state=working] .clock-button,.clock-panel[data-state=break] .clock-button{background:var(--danger);border-color:#7f2823}.clock-button:active{transform:translateY(4px);border-bottom-width:4px}.clock-button:disabled{opacity:.7;cursor:wait}.clock-button strong{font-size:clamp(1.8rem,5vw,2.8rem)}.clock-button small{font-size:1rem}.clock-icon{font-size:2rem}.break-button{display:none;margin:.8rem auto;background:var(--secondary);color:#241500;border:2px solid #9c5e0e;border-radius:9px;padding:.85rem 1.5rem;font-weight:800;min-height:48px}.clock-panel[data-state=working] .break-button,.clock-panel[data-state=break] .break-button{display:block}.summaries{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;margin:1rem 0}.summary,.panel{background:var(--surface);border:1px solid var(--border);border-radius:11px;padding:1.2rem}.summary h2{font-size:1rem;margin:0 0 .7rem}.summary strong{font-size:1.35rem}.summary.warning{border-left:5px solid var(--secondary)}.progress{height:9px;background:var(--surface-alt);border-radius:5px;margin-top:.8rem;overflow:hidden}.progress span{display:block;height:100%;background:var(--primary)}.link-button{display:block;border:0;background:transparent;color:var(--primary);text-decoration:underline;padding:.5rem 0}.empty{text-align:center;color:var(--muted);padding:2rem}.button{display:inline-flex;justify-content:center;border:0;border-radius:8px;padding:.85rem 1.2rem;text-decoration:none}.primary{background:var(--primary);color:#fff;font-weight:700}.auth{max-width:440px;margin:8vh auto;text-align:center}.auth h1{margin-bottom:.25rem}.tagline{color:var(--muted);margin-top:0}.auth form{text-align:left;display:grid;gap:.6rem}.auth input{width:100%;min-height:48px;border:2px solid var(--border);border-radius:7px;padding:.7rem;background:var(--surface);color:var(--text)}.error{border-left:5px solid var(--danger);padding:.8rem;background:#ffe8e6;color:#4a1814}.bottom-nav{display:none}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media(max-width:760px){.sidebar{display:none}main{margin:0;padding:1rem 1rem calc(6.5rem + env(safe-area-inset-bottom))}.page-header{margin-bottom:.7rem}.page-header h1{font-size:1.45rem}.clock-panel{padding:.8rem}.worked span{font-size:3rem}.clock-button{min-height:174px}.summaries{grid-template-columns:1fr}.bottom-nav{position:fixed;display:grid;grid-template-columns:repeat(5,1fr);align-items:end;inset:auto 0 0;background:var(--surface);border-top:1px solid var(--border);padding:.5rem .25rem max(.5rem,env(safe-area-inset-bottom));z-index:5}.bottom-nav a{text-align:center;text-decoration:none;color:var(--text);font-size:.75rem;padding:.45rem .1rem}.clock-shortcut{display:grid;place-items:center;margin-top:-1.4rem}.clock-shortcut:first-line{font-size:1.8rem}.records{margin-top:1rem}.auth{margin:4vh auto}}
@media(max-width:340px){.worked span{font-size:2.5rem}.clock-button{min-height:165px}.location-note{font-size:.78rem}}
@media(prefers-reduced-motion:no-preference){button{transition:transform .08s,background-color .15s}}
.notice{background:var(--surface-alt);border:2px solid var(--primary);border-radius:8px;padding:.8rem;margin-bottom:1rem}.warning-box{background:#fff4c7;color:#382900;border:2px solid var(--secondary);border-radius:8px;padding:1rem;margin-bottom:1rem}.danger{background:var(--danger);color:#fff}.danger-area{border:2px solid var(--danger)}.session-row,.record-row{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1rem 0;border-bottom:1px solid var(--border)}.session-row p,.record-row p{color:var(--muted);margin:.35rem 0}.narrow{max-width:680px}.form-grid input,.form-grid select,.form-grid textarea{width:100%;min-height:48px;border:2px solid var(--border);border-radius:7px;padding:.7rem;background:var(--surface);color:var(--text)}details summary{cursor:pointer;font-weight:700;padding:.5rem}html.large-text{font-size:118%}html.dyslexia{font-family:Verdana,Arial,sans-serif;letter-spacing:.02em;word-spacing:.08em}
