:root{--bg: #0E1416;--surface: #172124;--raised: #1D2A2E;--border: #243236;--fg: #EAF2F3;--fg-2: #9FB3B7;--fg-3: #6F8A8F;--teal: #3FB6C4;--teal-2: #7FC8D2;--teal-ink: #06171A;--good: #4ADE80;--bad: #F87171;--hot: #FF8A3D;--display: "Bricolage Grotesque", Inter, system-ui, sans-serif;--ease: cubic-bezier(.32, .72, 0, 1);--vh: 100dvh;color-scheme:dark}*,*:before,*:after{box-sizing:border-box}[hidden]{display:none!important}html,body{margin:0;background:var(--bg);color:var(--fg)}body{font:15px/1.4 Inter,system-ui,-apple-system,Segoe UI,sans-serif;font-variant-numeric:tabular-nums;-webkit-tap-highlight-color:transparent;overscroll-behavior:none}button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer}a{color:inherit;text-decoration:none}:focus-visible{outline:2px solid var(--teal);outline-offset:2px;border-radius:10px}.app{max-width:480px;margin:0 auto;height:var(--vh);display:flex;flex-direction:column;padding:env(safe-area-inset-top,0) 0 0}.hdr{flex:none;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:6px 8px 4px}.iconbtn{width:44px;height:44px;display:flex;align-items:center;justify-content:center;border-radius:50%}.mark{display:flex;align-items:center;gap:8px;font-size:15px;font-weight:700}.logo{width:24px;height:24px;border-radius:7px;background:#0f6f7c;color:#fff;display:flex;align-items:center;justify-content:center}.hdr-r{display:flex;justify-content:flex-end;padding-right:8px}.streak{display:inline-flex;align-items:center;gap:4px;height:30px;padding:0 10px;border-radius:999px;background:var(--surface);border:1px solid var(--border);color:var(--hot);font-weight:700;font-size:14px}.streak span{color:var(--fg)}.eyebrow{font-size:12px;font-weight:700;letter-spacing:.14em;color:var(--teal-2)}.good{color:var(--good)}.bad{color:var(--bad)}.dim{color:var(--fg-2)}.intro{flex:1;display:flex;flex-direction:column;padding:20px 20px max(24px,env(safe-area-inset-bottom));gap:24px}.intro-c{flex:1;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:14px;text-align:center}.bigdate{margin:0;font:800 clamp(32px,10.6vw,54px)/1 var(--display);letter-spacing:-.04em;white-space:nowrap}.lead{margin:0;font-size:17px;font-weight:600}.rules{display:flex;flex-direction:column;gap:8px;margin-top:10px;padding:14px 16px;border-radius:14px;background:var(--surface);border:1px solid var(--border);text-align:left;font-size:14px;align-self:stretch}.rules span{display:flex;gap:10px;align-items:center}.rules b{flex:none;min-width:34px;font-weight:800}.primary{flex:none;height:56px;border-radius:16px;background:var(--teal);color:var(--teal-ink);font:800 18px var(--display);transition:transform .12s var(--ease),opacity .2s}.primary:disabled{opacity:.5;cursor:default}.primary:active:not(:disabled),.add:active,.tile:active{transform:scale(.97)}.play{flex:1;min-height:0;display:flex;flex-direction:column;padding:4px 20px 0;gap:14px}.playtop{display:flex;align-items:flex-end;justify-content:space-between}.on{display:flex;flex-direction:column;gap:2px}.playdate{font:800 clamp(24px,7.6vw,30px)/1 var(--display);letter-spacing:-.03em}.clock{display:flex;flex-direction:column;align-items:flex-end;gap:2px;color:var(--teal)}.clock span{font:800 40px/1 var(--display);letter-spacing:-.03em}.clock small{font-size:12px;color:var(--fg-2)}.clock.hot{color:var(--hot)}.bar{height:6px;border-radius:3px;background:var(--border);overflow:hidden}.bar i{display:block;height:100%;width:100%;border-radius:3px;background:var(--teal);transform-origin:left}.clock.hot+.bar i,.bar.hot i{background:var(--hot)}.tiles{display:flex;gap:8px}.tile{flex:1;padding:10px 12px;border-radius:12px;background:var(--surface);display:flex;flex-direction:column}.tile small{font-size:11px;font-weight:700;letter-spacing:.1em;color:var(--fg-2)}.tile b{font:800 24px var(--display)}.list{flex:1;min-height:0;overflow-y:auto;display:flex;flex-direction:column;gap:8px;padding-bottom:12px;-webkit-overflow-scrolling:touch}.empty{margin:16px 0 0;text-align:center;font-size:14px;color:var(--fg-2)}.row{display:flex;align-items:center;gap:12px;padding:10px 14px;border-radius:12px;background:var(--surface);animation:pop .22s ease-out both}.row .tag{flex:none;min-width:34px;height:28px;border-radius:8px;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:14px}.row .tag.g{background:#4ade8029;color:var(--good)}.row .tag.b{background:#f8717129;color:var(--bad)}.row .who{flex:1;min-width:0;display:flex;flex-direction:column;gap:1px}.row .who b{font-size:15px;font-weight:700}.row .who small{font-size:12px;color:var(--fg-2)}@keyframes pop{0%{opacity:0;transform:translateY(-6px) scale(.98)}to{opacity:1;transform:none}}.entry{flex:none;padding:10px 16px max(14px,env(safe-area-inset-bottom));display:flex;flex-direction:column;gap:6px;border-top:1px solid var(--border);background:var(--bg)}.entry label{font-size:12px;font-weight:600;color:var(--fg-2);min-height:16px}.entry label.badmsg{color:var(--bad)}.entry label.goodmsg{color:var(--good)}.entryrow{display:flex;gap:8px}.entry input{flex:1;min-width:0;height:50px;padding:0 16px;border-radius:14px;border:1.5px solid #2E3F44;background:var(--surface);color:var(--fg);font:600 17px Inter,sans-serif;outline:none}.entry input:focus{border-color:var(--teal)}.add{flex:none;height:50px;padding:0 18px;border-radius:14px;background:var(--teal);color:var(--teal-ink);font:800 16px Inter,sans-serif;transition:transform .12s var(--ease)}.early{align-self:center;min-height:36px;color:var(--fg-2);font-size:13px;font-weight:600}.result{flex:1;min-height:0;overflow-y:auto;padding:8px 20px max(28px,env(safe-area-inset-bottom));display:flex;flex-direction:column;gap:16px}.score{display:flex;flex-direction:column;align-items:center;gap:6px;text-align:center;padding-top:6px}.bigscore{margin:0;font:800 72px/1 var(--display);letter-spacing:-.04em}.resline{margin:0;font-size:15px;font-weight:600}.respct{margin:0;font-size:14px;color:var(--teal-2);font-weight:600}.box{background:var(--surface);border:1px solid var(--border);border-radius:14px;padding:14px 16px;display:flex;flex-direction:column;gap:8px}.boxh{font-size:11px;font-weight:700;letter-spacing:.1em;color:var(--fg-2)}.box p{margin:0;font-size:14px;line-height:1.5}.box .ln{font-size:14px;display:flex;gap:8px;align-items:baseline}.box .ln i{flex:none;width:8px;height:8px;border-radius:50%;transform:translateY(-1px)}.box .ln i.g{background:var(--good)}.box .ln i.b{background:var(--bad)}.box .ln small{color:var(--fg-2)}.context{margin:0;text-align:center;font-size:13px;color:var(--fg-3)}.toast{position:fixed;left:50%;bottom:calc(24px + env(safe-area-inset-bottom));transform:translate(-50%,20px);opacity:0;padding:10px 16px;border-radius:999px;background:var(--fg);color:var(--bg);font-size:14px;font-weight:700;pointer-events:none;transition:opacity .2s,transform .2s var(--ease);z-index:20}.toast.on{opacity:1;transform:translate(-50%)}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}