:root{--brand:#1f6feb;--brand-ink:#fff;--bg:#ebe8e1;--paper:#f8f6f1;--ink:#16181b;--soft:#6b6f75;--rule:#d9d5cc;--warn:#b4560a;--bad:#b42318;--good:#1e7a46;--display:"Space Grotesk", system-ui, sans-serif;--body:Inter, system-ui, sans-serif;--mono:"Share Tech Mono", ui-monospace, monospace}:root[data-theme=dark]{--bg:#0d0f11;--paper:#17191c;--ink:#f1f1ef;--soft:#8b9096;--rule:#2c2f33;--warn:#f0a24a;--bad:#f87171;--good:#4ade80}*{box-sizing:border-box}html,body{background:var(--bg);color:var(--ink);font-family:var(--body);-webkit-text-size-adjust:100%;margin:0}body{min-height:100dvh}button{font:inherit;color:inherit}#root{flex-direction:column;max-width:480px;min-height:100dvh;margin:0 auto;display:flex}.band{background:var(--brand);color:var(--brand-ink);padding:calc(14px + env(safe-area-inset-top)) 20px 14px;z-index:5;align-items:center;gap:12px;min-height:64px;display:flex;position:sticky;top:0}.band img{object-fit:contain;max-width:150px;max-height:38px;display:block}.band .name{font-family:var(--display);font-size:18px;font-weight:700;line-height:1.15}.band .spacer{flex:1}.lang{opacity:.9;border:1px solid;border-radius:6px;display:flex;overflow:hidden}.lang button{font-family:var(--mono);letter-spacing:1px;cursor:pointer;background:0 0;border:0;padding:4px 9px;font-size:12px}.lang button[aria-pressed=true]{background:var(--brand-ink);color:var(--brand)}.page{padding:22px 18px calc(32px + env(safe-area-inset-bottom));flex-direction:column;flex:1;gap:18px;display:flex}.label{font-family:var(--mono);letter-spacing:1.8px;text-transform:uppercase;color:var(--soft);font-size:11px}h1{font-family:var(--display);letter-spacing:-.3px;margin:4px 0 0;font-size:28px;font-weight:700;line-height:1.1}p{margin:0;line-height:1.55}.muted{color:var(--soft)}.field{flex-direction:column;gap:6px;display:flex}.input{width:100%;font-family:var(--mono);border:1.5px solid var(--rule);background:var(--paper);color:var(--ink);letter-spacing:1px;border-radius:12px;outline:none;padding:14px 16px;font-size:24px}.input:focus{border-color:var(--brand)}.input.code{text-align:center;letter-spacing:12px;padding-left:28px;font-size:30px}.input.small{font-family:var(--body);letter-spacing:0;resize:vertical;flex:1;min-width:0;padding:12px 14px;font-size:16px}.banner{background:var(--paper);border:1.5px solid;border-radius:12px;padding:12px 14px;font-size:14px;line-height:1.45}.banner.good{color:var(--good)}.banner.bad{color:var(--bad)}.banner.warn{color:var(--warn)}.place{background:var(--paper);border-radius:14px;flex-direction:column;gap:3px;padding:14px 18px;font-size:14px;display:flex}.place .name{font-family:var(--display);font-size:16px;font-weight:600}.place .links{gap:18px;margin-top:6px;display:flex}.place .links a{color:var(--ink);text-underline-offset:3px}.err{color:var(--bad);font-size:14px;line-height:1.45}.btn{appearance:none;cursor:pointer;border:0;border-radius:12px;justify-content:center;align-items:center;gap:8px;width:100%;min-height:54px;padding:16px 18px;font-size:16px;font-weight:600;display:inline-flex}.btn.primary{background:var(--brand);color:var(--brand-ink)}.btn.quiet{border:1.5px solid var(--rule);color:var(--ink);background:0 0}.btn.danger{background:var(--bad);color:#fff}.btn:disabled{opacity:.5;cursor:default}.link{color:var(--soft);text-underline-offset:3px;cursor:pointer;background:0 0;border:0;padding:6px 0;font-size:14px;text-decoration:underline}.pass{background:var(--paper);box-shadow:0 1px 0 var(--rule), 0 18px 40px #0000001f;border-radius:18px;overflow:hidden}.pass .head{padding:20px 20px 16px}.pass .plan{font-family:var(--display);margin-top:4px;font-size:30px;font-weight:700;line-height:1.05}.pass .sub{color:var(--soft);margin-top:6px;font-size:15px}.pass .tag{font-family:var(--mono);letter-spacing:1.6px;text-transform:uppercase;border:1px solid;border-radius:4px;padding:3px 8px;font-size:11px;display:inline-block}.pass .tag.good{color:var(--good)}.pass .tag.warn{color:var(--warn)}.pass .tag.bad{color:var(--bad)}.pass .tag.soft{color:var(--soft)}.pass .pin{border:1.5px solid var(--rule);border-radius:12px;justify-content:space-between;align-items:center;gap:12px;margin:0 20px 18px;padding:12px 16px;display:flex}.pass .pin .hint{color:var(--soft);margin-top:3px;font-size:13px}.pass .pin .digits{font-family:var(--mono);letter-spacing:6px;color:var(--ink);white-space:nowrap;margin-right:-6px;font-size:34px}.pass .car{justify-content:space-between;align-items:baseline;gap:10px;margin-top:12px;font-size:14px;display:flex}.pass .inc{border-top:1px solid var(--rule);margin-top:14px;padding-top:12px}.pass .inc ul{margin:6px 0 0;padding-left:18px;font-size:14px;line-height:1.6}.pass .inc .bal{justify-content:space-between;align-items:baseline;margin-top:10px;font-size:14px;display:flex}.pass .inc .bal strong{font-family:var(--mono);font-size:16px;font-weight:400}.pass .inc .hint{color:var(--soft);margin-top:4px;font-size:13px}.picks{flex-direction:column;gap:8px;max-height:38vh;display:flex;overflow-y:auto}.pick{text-align:left;border:1.5px solid var(--rule);cursor:pointer;color:var(--ink);background:0 0;border-radius:12px;grid-template-columns:1fr auto;gap:2px 10px;padding:12px 14px;display:grid}.pick[aria-pressed=true]{border-color:var(--brand);box-shadow:inset 0 0 0 1px var(--brand)}.pick .nm{font-family:var(--display);font-size:16px;font-weight:600}.pick .pr{font-family:var(--mono);font-size:15px}.pick small{color:var(--soft);grid-column:1/-1;font-size:13px;line-height:1.4}.sheet{max-height:92dvh;overflow-y:auto}.pass .punches{flex-wrap:wrap;gap:8px;margin-top:14px;display:flex}.pass .punches span{border:2px dashed var(--rule);border-radius:50%;width:26px;height:26px}.pass .punches span.on{border:2px solid var(--brand);background:var(--brand);box-shadow:inset 0 0 0 3px var(--paper)}.pass .bar{background:var(--rule);border-radius:5px;height:10px;margin-top:14px;overflow:hidden}.pass .bar span{background:var(--brand);height:100%;display:block}select.input.small{appearance:auto}.perf{border-top:2px dashed var(--rule);height:0;margin:0 16px;position:relative}.perf:before,.perf:after{content:"";background:var(--bg);border-radius:50%;width:20px;height:20px;position:absolute;top:-10px}.perf:before{left:-26px}.perf:after{right:-26px}.pass .stub{grid-template-columns:1fr 1fr;gap:14px 16px;padding:14px 20px 18px;display:grid}.pass .stub .v{font-family:var(--mono);margin-top:3px;font-size:16px}.pass .note{padding:0 20px 18px;font-size:14px;line-height:1.5}.pass .note.warn{color:var(--warn)}.pass .note.bad{color:var(--bad)}.roll{background:var(--paper);border-radius:14px;padding:6px 18px}.roll .row{border-bottom:1px dotted var(--rule);font-family:var(--mono);align-items:baseline;gap:8px;padding:11px 0;font-size:14px;display:flex}.roll .row:last-child{border-bottom:0}.roll .row .when{white-space:nowrap}.roll .row .lead{border-bottom:1px dotted var(--soft);opacity:.35;flex:1;min-width:12px;transform:translateY(-4px)}.roll .row .what{text-align:right;text-overflow:ellipsis;white-space:nowrap;max-width:60%;overflow:hidden}.roll .row .what small{color:var(--soft);font-size:12px;display:block}.roll .row.dim{color:var(--soft)}.roll .empty{color:var(--soft);padding:14px 0;font-size:14px}.actions{flex-direction:column;gap:10px;display:flex}.foot{text-align:center;font-family:var(--mono);letter-spacing:1.6px;text-transform:uppercase;color:var(--soft);margin-top:auto;padding-top:18px;font-size:10px}.scrim{z-index:20;background:#00000073;justify-content:center;align-items:flex-end;animation:.15s fade;display:flex;position:fixed;inset:0}.sheet{background:var(--paper);width:100%;max-width:480px;padding:22px 18px calc(22px + env(safe-area-inset-bottom));border-radius:20px 20px 0 0;flex-direction:column;gap:16px;animation:.2s rise;display:flex}.sheet h2{font-family:var(--display);margin:0;font-size:22px}.chips{grid-template-columns:repeat(3,1fr);gap:8px;display:grid}.chip{border:1.5px solid var(--rule);font-family:var(--mono);cursor:pointer;color:var(--ink);background:0 0;border-radius:10px;padding:12px 6px;font-size:15px}.chip[aria-pressed=true]{border-color:var(--brand);background:var(--brand);color:var(--brand-ink)}@keyframes fade{0%{opacity:0}}@keyframes rise{0%{opacity:0;transform:translateY(40px)}}.center{text-align:center;flex-direction:column;flex:1;justify-content:center;gap:10px;padding:40px 24px;display:flex}.spinner{border:3px solid var(--rule);border-top-color:var(--brand);border-radius:50%;width:26px;height:26px;margin:0 auto;animation:.8s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}
