:root{--bg:#12170f;--bg2:#1a2416;--surface:#202a1c;--surface2:#2a3524;--line:#35422c;--gold:#c9a86a;--gold-soft:#e8d5a3;--cream:#f2ede0;--muted:#b9b09a;--green:#7da05c;--red:#d97a6a;--radius:16px;--tap:56px}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{margin:0;padding:0;background:var(--bg);color:var(--cream);font-family:-apple-system,BlinkMacSystemFont,SF Pro Text,Inter,system-ui,sans-serif;-webkit-font-smoothing:antialiased}body{max-width:560px;margin:0 auto;min-height:100dvh;display:flex;flex-direction:column;background:radial-gradient(120% 60% at 50% 0%,#223018 0%,var(--bg) 60%)}header{position:sticky;top:0;z-index:20;display:flex;align-items:center;justify-content:space-between;padding:calc(10px + env(safe-area-inset-top)) 16px 10px;background:#12170feb;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}.brand{display:flex;align-items:center;gap:10px;font-weight:800;letter-spacing:.14em}.brand .cross{color:var(--gold);font-size:18px}.brand small{display:block;font-weight:500;letter-spacing:.04em;color:var(--muted);font-size:11px}.iconbtn{background:var(--surface);border:1px solid var(--line);color:var(--cream);width:44px;height:44px;border-radius:12px;font-size:19px;cursor:pointer}main{flex:1;padding:16px 14px calc(96px + env(safe-area-inset-bottom))}.card{background:linear-gradient(180deg,var(--surface),var(--bg2));border:1px solid var(--line);border-radius:var(--radius);padding:16px;margin-bottom:12px;box-shadow:0 8px 24px #00000040}.hero{text-align:center;padding:22px 16px}.hero .label{color:var(--muted);letter-spacing:.22em;font-size:11px}.hero .total{font-size:52px;font-weight:800;color:var(--gold-soft);margin:6px 0;line-height:1}.hero .sub{color:var(--muted);font-size:13px}.progress{height:10px;background:#0f140c;border:1px solid var(--line);border-radius:99px;overflow:hidden;margin:12px 0 6px}.progress>div{height:100%;background:linear-gradient(90deg,var(--gold),var(--gold-soft));transition:width .4s}.row{display:flex;gap:10px}.row>*{flex:1}.grid2{display:grid;grid-template-columns:1fr 1fr;gap:10px}.stat{background:#141b11;border:1px solid var(--line);border-radius:12px;padding:10px}.stat .k{font-size:11px;color:var(--muted);letter-spacing:.08em;text-transform:uppercase}.stat .v{font-size:19px;font-weight:700;margin-top:2px}.btn{display:flex;align-items:center;justify-content:center;min-height:var(--tap);border-radius:14px;border:1px solid var(--line);background:var(--surface2);color:var(--cream);font-weight:800;font-size:17px;letter-spacing:.04em;cursor:pointer;padding:12px;width:100%;margin-top:10px}.btn:active{transform:scale(.99)}.btn.primary{background:linear-gradient(180deg,#d8b878,var(--gold));color:#1c1a10;border:none}.btn.ghost{background:transparent}.btn.danger{border-color:#5a2f28;color:#f0a596;background:#231512}.btn.small{min-height:44px;font-size:15px}.timer{font-variant-numeric:tabular-nums}.big-timer{font-size:44px;font-weight:800;font-variant-numeric:tabular-nums;text-align:center;margin:8px 0}.status-pill{display:inline-block;padding:6px 12px;border-radius:99px;font-size:12px;font-weight:800;letter-spacing:.12em}.st-work{background:#223a1e;color:#a8d18a;border:1px solid #3a5a34}.st-lunch{background:#3a2f16;color:var(--gold-soft);border:1px solid #6a5426}.st-break{background:#1e3340;color:#9fd0e8;border:1px solid #2f546a}.st-off{background:#222;color:var(--muted);border:1px solid var(--line)}nav{position:fixed;bottom:0;left:50%;transform:translate(-50%);width:100%;max-width:560px;display:flex;background:#141b11f5;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-top:1px solid var(--line);padding:8px 6px calc(10px + env(safe-area-inset-bottom));z-index:20}nav button{flex:1;background:none;border:none;color:var(--muted);font-size:11px;font-weight:700;letter-spacing:.08em;display:flex;flex-direction:column;align-items:center;gap:3px;padding:8px 4px;border-radius:10px;cursor:pointer}nav button .dot{width:8px;height:8px;border-radius:99px;background:transparent}nav button.active{color:var(--gold-soft)}nav button .ico{font-size:20px}.dot.working{background:var(--green)}.dot.lunch{background:var(--gold)}.dot.break{background:#6ec1e4}label.f{display:block;font-size:12px;color:var(--muted);margin:12px 0 4px;letter-spacing:.06em;text-transform:uppercase}input,select,textarea{width:100%;background:#10150d;border:1px solid var(--line);color:var(--cream);border-radius:12px;padding:12px;font-size:16px}input:focus,select:focus{outline:2px solid var(--gold)}.modal{position:fixed;top:0;right:0;bottom:0;left:0;background:#0009;display:flex;align-items:flex-end;justify-content:center;z-index:50}.modal .sheet{background:var(--bg2);border:1px solid var(--line);border-radius:20px 20px 0 0;width:100%;max-width:560px;max-height:88dvh;overflow:auto;padding:18px 16px calc(24px + env(safe-area-inset-bottom))}.toast{position:fixed;top:calc(12px + env(safe-area-inset-top));left:50%;transform:translate(-50%);background:#0f140c;border:1px solid var(--gold);color:var(--gold-soft);padding:12px 16px;border-radius:12px;z-index:99;font-size:14px;max-width:92vw;box-shadow:0 10px 30px #00000080}.banner{background:#2a2111;border:1px solid var(--gold);color:var(--gold-soft);padding:10px 12px;border-radius:12px;margin-bottom:12px;font-size:14px}.muted{color:var(--muted);font-size:13px}.mono{font-variant-numeric:tabular-nums}hr{border:none;border-top:1px solid var(--line);margin:14px 0}h2{margin:6px 0 10px;font-size:20px}h3{margin:14px 0 6px;font-size:15px;color:var(--gold-soft)}.shiftrow{display:flex;justify-content:space-between;align-items:center;padding:12px;border:1px solid var(--line);border-radius:12px;margin-bottom:8px;background:#141b11;cursor:pointer;width:100%;color:var(--cream);text-align:left}.weekhead{display:flex;justify-content:space-between;align-items:center;margin:18px 0 8px}.milestone{text-align:center;border:1px solid var(--gold);border-radius:14px;padding:14px;margin:12px 0;background:#211b0e}.motto{text-align:center;color:var(--muted);letter-spacing:.3em;font-size:10px;margin:18px 0 6px}@media(min-width:700px){body{border-left:1px solid var(--line);border-right:1px solid var(--line)}.modal{align-items:center}.modal .sheet{border-radius:20px}}@media(prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}
