body:has(.clock-shell),body:has(.clock-login){background:#f0f5f3;color:#152e2b}header{max-width:1040px;margin:auto;box-sizing:border-box}main:has(.clock-shell),main:has(.clock-login){max-width:600px;padding:22px 16px 30px;margin:auto}h1{font-size:30px;letter-spacing:-1px;margin:10px 0 18px}.clock-login,.time-panel{background:white;border:1px solid #dce6e0;border-radius:24px;padding:28px;box-shadow:0 12px 40px #152e2b08}.eyebrow{font-size:11px;letter-spacing:2px;font-weight:800;color:#467461}.clock-login input,.clock-shell select{box-sizing:border-box;width:100%;font-size:17px;padding:15px;border:1px solid #bbcfc5;border-radius:12px;min-height:52px}.clock-login label,.clock-shell label{display:block;font-weight:600;margin:18px 0}.clock-primary,.clock-out{width:100%;border:0;border-radius:15px;padding:20px;font-size:20px;font-weight:700;cursor:pointer;background:#146b4c;color:white;min-height:66px}.clock-out{background:#f7e8e4;color:#862f24;margin-top:12px}button:disabled{opacity:.55;cursor:wait}.time-panel{text-align:center}.time-panel label{text-align:left}.elapsed{font-size:clamp(36px,10vw,58px);font-weight:700;font-variant-numeric:tabular-nums;letter-spacing:1px;margin:24px 0 6px}.status-dot{display:inline-block;background:#e6f2e9;color:#17633e;padding:8px 14px;border-radius:25px;font-size:14px;font-weight:700}.time-panel h2{font-size:22px}.clock-actions{margin-top:28px}.clock-nav{display:flex;gap:4px;padding:8px;background:white;border-radius:18px;margin-top:18px}.clock-nav button{flex:1;padding:14px 6px;background:transparent;border:0;border-radius:12px;color:#415b50;font-size:14px;min-height:48px}.clock-nav button[aria-current=page]{background:#e3f0e7;color:#135c3c;font-weight:700}.clock-record{text-align:left;padding:18px 0;border-bottom:1px solid #e3e9e6}.profile-link{display:block;text-align:center;padding:20px;color:#396652}#clockMessage{color:#864223;line-height:1.5;margin:12px 0;overflow-wrap:anywhere}.install-card{max-width:550px;margin:16px auto;padding:12px 20px;border-radius:14px}.install-card p{font-size:13px}.install-card strong{font-size:14px}.install-card .btn{font-size:13px}footer{padding:20px;font-size:12px}.clock-login details{margin-top:24px}input:focus,select:focus,button:focus-visible{outline:3px solid #70bc94;outline-offset:3px}@media(max-width:480px){.clock-login,.time-panel{padding:24px 20px}header{padding:18px 16px}.install-card{margin:12px 16px}header small{font-size:11px}}