:root{color-scheme:light;--teal: #0bb197;--teal-deep: #1a6b6c;--navy: #002f34;--bg: #f1f5f9;--card: #ffffff;--line: #e2e8f0;--muted: #64748b;--ok: #047857;--ok-bg: #d1fae5;--bad: #ff3d60;--bad-bg: #ffe8ee;--amber: #b45309;--amber-bg: #fef3c7;--shadow: 0 10px 30px rgba(15, 23, 42, .08);font-family:Segoe UI,Avenir Next,Nunito Sans,sans-serif}*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:var(--bg);color:var(--navy)}button,input,select,textarea{font:inherit;color:inherit}button{cursor:pointer}#app{min-height:100dvh;max-width:480px;margin:0 auto;padding:calc(16px + env(safe-area-inset-top)) 16px calc(96px + env(safe-area-inset-bottom))}#app.is-login{display:flex;flex-direction:column;padding-bottom:calc(12px + env(safe-area-inset-bottom))}.top{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:16px}.wordmark{display:block;width:min(280px,82%);height:auto;margin:28px auto 10px;border:0;background:transparent;box-shadow:none}.wordmark.header{width:auto;height:34px;max-width:168px;margin:0;object-fit:contain;object-position:left center}.who{margin:0;color:var(--teal-deep);font-weight:650;font-size:.95rem}.muted,.helper{margin:2px 0 0;color:var(--muted);font-size:.9rem}.helper.center{text-align:center;margin-top:4px}.login-screen{flex:1;display:flex;flex-direction:column;text-align:center;width:100%;min-height:calc(100dvh - 28px - env(safe-area-inset-top) - env(safe-area-inset-bottom))}.login-foot{margin-top:auto;padding-top:20px;padding-bottom:env(safe-area-inset-bottom)}.duty-line{margin:0 0 18px;color:var(--teal-deep);font-size:1rem}.tagline{margin:0;text-align:center;color:var(--teal-deep);font-weight:750}.secret{position:relative}.secret input{padding-right:52px}.eye{position:absolute;right:4px;top:50%;transform:translateY(-50%);width:44px;height:44px;margin:0;padding:0;border:0;border-radius:12px;background:transparent;color:var(--teal-deep);display:grid;place-items:center}.eye:focus-visible{outline:2px solid var(--teal);outline-offset:2px}.linkish{background:transparent;border:0;color:var(--teal-deep);padding:8px 0;min-height:48px;font-weight:700}.card{background:var(--card);border:1px solid var(--line);border-radius:20px;padding:16px;box-shadow:var(--shadow);text-align:left}label{display:block;margin:14px 0 6px;color:var(--navy);font-size:.92rem;font-weight:650}input,select,textarea{width:100%;border:1px solid var(--line);background:#f8fafc;border-radius:14px;padding:14px;min-height:52px}textarea{min-height:96px;resize:vertical}.primary,.ghost{width:100%;min-height:56px;border-radius:16px;border:0;margin-top:16px;font-weight:750;font-size:1.05rem}.primary{background:var(--teal);color:#fff}.primary:disabled{background:#94a3b8}.ghost{background:#fff;border:1px solid var(--line);color:var(--navy)}.banner{border-radius:16px;padding:12px 14px;margin:0 0 14px;line-height:1.35;text-align:left}.banner.error{background:var(--bad-bg);color:var(--bad)}.banner.ok{background:var(--ok-bg);color:var(--ok)}.banner.warn{background:var(--amber-bg);color:var(--amber)}.chip{display:inline-flex;align-items:center;border-radius:999px;padding:8px 12px;font-size:.84rem;font-weight:750;background:#e2e8f0;color:var(--navy);white-space:nowrap}.chip.in,.chip.approved{background:var(--ok-bg);color:var(--ok)}.chip.out,.chip.rejected{background:var(--bad-bg);color:var(--bad)}.chip.pending,.chip.missed{background:var(--amber-bg);color:var(--amber)}.zone-chip{margin-bottom:12px}.zone-map{background:#fff;border:1px solid var(--line);border-radius:20px;padding:16px;margin-bottom:16px;box-shadow:var(--shadow)}.ring{width:120px;height:120px;margin:0 auto 10px;border-radius:50%;border:10px solid #99f6e4;background:radial-gradient(circle at 50% 50%,var(--teal) 0 7px,transparent 8px),#f0fdfa;position:relative}.zone-map.outside .ring{border-color:#fcd34d;background:radial-gradient(circle at 70% 20%,#b45309 0 6px,transparent 7px),#fffbeb}.zone-map.inside .ring{border-color:#6ee7b7}.zone-map p{margin:0;text-align:center;color:var(--muted);line-height:1.4}.stage{display:flex;flex-direction:column;align-items:center;padding:6px 0 4px}.clock-in{margin:0 0 2px;font-size:.95rem;font-weight:700;color:var(--teal-deep);text-align:center}.elapsed{font-variant-numeric:tabular-nums;font-size:2.6rem;letter-spacing:.04em;margin:0;font-weight:750;color:var(--navy)}.elapsed.off{font-size:1.15rem;color:var(--muted);font-weight:650;letter-spacing:0;margin-bottom:6px}.elapsed-label{margin:2px 0 0;font-size:.92rem;font-weight:700;color:var(--muted)}.hours-note{margin:6px 0 2px;max-width:280px;text-align:center;color:var(--muted);font-size:.82rem;line-height:1.4}.break-state{margin:8px 0 0;font-weight:750;color:var(--amber);text-align:center}.break-countdown{margin:4px 0 0;font-weight:700;color:var(--muted);text-align:center;font-size:.9rem}.break-countdown.warn{color:var(--bad)}.break-btn{max-width:280px;margin-top:4px}.break-picker{width:100%;max-width:280px;margin:8px 0 4px;display:grid;gap:8px}.break-picker-title{margin:0;text-align:center;font-weight:750;color:var(--ink)}.break-type,.break-cancel{width:100%;text-transform:capitalize}.break-cancel{color:var(--muted)}.punch-wrap{width:220px;height:220px;display:grid;place-items:center;margin:6px 0 8px}.punch{width:196px;height:196px;border-radius:50%;border:0;background:var(--teal);color:#fff;font-size:1.35rem;font-weight:800;letter-spacing:.04em;box-shadow:0 16px 36px #0bb19752}.punch.out{background:var(--navy);box-shadow:0 16px 36px #0f172a47}.punch.locked,.punch:disabled{background:#cbd5e1;color:#475569;box-shadow:none}.hint{text-align:center;color:var(--muted);margin:4px 0 14px;line-height:1.45}.sites,.balances{display:flex;flex-direction:column;gap:10px}.sites{width:100%;margin:0 0 12px}.site,.balance,.row{background:#fff;border:1px solid var(--line);border-radius:18px;padding:14px;box-shadow:var(--shadow)}.site,.balance{display:flex;justify-content:space-between;gap:12px;align-items:center}.site h3,.row h3,.balance h3{margin:0 0 4px;font-size:1.02rem}.site p,.row p,.balance p{margin:0;color:var(--muted);font-size:.9rem}.row-list{display:flex;flex-direction:column;gap:10px;margin-top:12px}.row-top{display:flex;justify-content:space-between;gap:8px;align-items:flex-start}.tabs{position:fixed;left:50%;transform:translate(-50%);bottom:0;width:min(480px,100%);display:grid;grid-template-columns:repeat(4,1fr);gap:4px;padding:8px 8px calc(10px + env(safe-area-inset-bottom));background:#fffffff5;border-top:1px solid var(--line)}.tabs button{min-height:52px;border-radius:14px;border:0;background:transparent;color:var(--muted);font-size:.82rem;font-weight:650}.tabs button.active{background:#ccfbf1;color:var(--teal-deep)}.seg{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:8px}.seg button{min-height:48px;border-radius:14px;border:1px solid var(--line);background:#fff}.seg button.selected{border-color:var(--teal);color:var(--teal-deep);background:#f0fdfa;font-weight:750}.section-label{margin:18px 0 8px;font-size:.78rem;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);font-weight:750}.empty{color:var(--muted);text-align:center;padding:28px 8px}.profile-name{font-size:1.35rem;margin:0 0 4px}.app-version{margin:0;color:var(--muted);font-size:.75rem;font-weight:500;letter-spacing:.02em}.login-main .app-version{margin:-10px 0 14px}.about-card{margin-top:16px;padding:12px 14px;text-align:center;background:#fff;border:1px solid var(--line);border-radius:18px;box-shadow:var(--shadow)}.about-card .section-label{margin:0 0 4px}.about-card .app-version{font-size:.85rem}