:root{--bg:#14151a;--fg:#f2f2f5;--mut:#9a9cab;--card:#23252e;--acc:#ffb703;--ok:#2ecc71;--bad:#ef476f;color-scheme:dark light}
@media(prefers-color-scheme:light){:root{--bg:#f6f6f9;--fg:#16171d;--mut:#666877;--card:#fff;--acc:#e08a00}}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--fg);font:16px/1.4 system-ui,-apple-system,Segoe UI,Roboto,sans-serif;-webkit-tap-highlight-color:transparent}
main{max-width:460px;margin:0 auto;padding:12px 14px calc(24px + env(safe-area-inset-bottom))}
header{display:flex;align-items:center;justify-content:space-between;gap:8px}
h1{margin:0;font-size:1.6rem;letter-spacing:.04em;color:var(--acc)}
.modes button{background:none;border:0;color:var(--mut);font:inherit;padding:6px 8px;cursor:pointer;border-bottom:2px solid transparent}
.modes button.on{color:var(--fg);border-color:var(--acc)}
.how{color:var(--mut);font-size:.9rem;margin:6px 0}
.how summary{cursor:pointer;width:max-content}
.how ul{margin:6px 0;padding-left:18px}
.target{text-align:center;margin:10px 0 14px}
.target span{display:block;color:var(--mut);font-size:.8rem;text-transform:uppercase;letter-spacing:.12em}
.target .level{display:block;font-style:normal;color:var(--mut);font-size:.85rem;margin-top:4px}
.target strong{font-size:4rem;line-height:1;font-variant-numeric:tabular-nums}
.tiles{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.tile{background:var(--card);border:2px solid transparent;border-radius:14px;color:var(--fg);font:700 1.7rem/1 system-ui;min-height:68px;cursor:pointer;font-variant-numeric:tabular-nums;box-shadow:0 1px 3px #0003}
.tile.sel{border-color:var(--acc);transform:translateY(-2px)}
.tile.new{outline:2px dashed var(--mut)}
.tile.hit{background:var(--ok);color:#06210f}
.tile[disabled]{opacity:.35;cursor:default}
.ops{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin:14px 0}
.ops button{background:var(--card);border:2px solid transparent;border-radius:14px;color:var(--fg);font:700 1.8rem/1 system-ui;min-height:56px;cursor:pointer}
.ops button.sel{border-color:var(--acc);color:var(--acc)}
.history{min-height:1.4em;color:var(--mut);font-variant-numeric:tabular-nums;font-size:.95rem;display:grid;gap:2px;text-align:center}
.actions{display:flex;gap:8px;justify-content:center;margin:12px 0}
.actions button,.result button{background:none;border:1px solid var(--mut);border-radius:999px;color:var(--fg);font:inherit;padding:8px 14px;cursor:pointer}
.result{background:var(--card);border-radius:14px;padding:14px;text-align:center;display:grid;gap:8px}
.result h2{margin:0;font-size:1.3rem}
.result .primary{background:var(--acc);color:#111;border-color:var(--acc);font-weight:700}
.result .bars{display:grid;gap:3px;text-align:left;font-size:.85rem;color:var(--mut)}
.result .bar{display:flex;gap:6px;align-items:center}
.result .bar i{display:block;height:10px;background:var(--acc);border-radius:3px;min-width:2px}
.sol{font-variant-numeric:tabular-nums;font-size:.9rem;color:var(--mut);display:grid;gap:2px}
footer{display:flex;flex-wrap:wrap;gap:6px 14px;justify-content:center;margin-top:22px;font-size:.85rem}
footer a{color:var(--mut)}footer a[aria-current]{color:var(--fg);font-weight:600}
[hidden]{display:none!important}
.doc{max-width:640px}
.doc .brand{font-size:1.6rem;font-weight:700;letter-spacing:.04em;color:var(--acc);text-decoration:none}
.doc h1{font-size:1.7rem;line-height:1.2;margin:18px 0 10px;letter-spacing:0}
.doc h2{font-size:1.2rem;margin:22px 0 6px}
.doc h3{font-size:1rem;margin:14px 0 2px}
.doc p,.doc li{color:var(--fg)}
.doc li{margin:4px 0}
.doc .cta{display:inline-block;background:var(--acc);color:#111;font-weight:700;padding:10px 18px;border-radius:999px;text-decoration:none}
.icon{background:none;border:0;font-size:1.3rem;cursor:pointer;padding:4px 6px}
.stats{background:var(--card);color:var(--fg);border:0;border-radius:14px;padding:16px;width:min(92vw,380px)}
.stats::backdrop{background:#000a}
.stats h2{margin:0 0 10px;font-size:1.2rem}.stats h3{margin:12px 0 4px;font-size:.9rem;color:var(--mut)}
.stats .bars{display:grid;gap:3px;font-size:.85rem;color:var(--mut)}
.stats .bar{display:flex;gap:6px;align-items:center}.stats .bar i{display:block;height:10px;background:var(--acc);border-radius:3px;min-width:2px}
.stats .primary{margin-top:14px;width:100%;background:var(--acc);color:#111;border:0;border-radius:999px;font:700 1rem system-ui;padding:9px;cursor:pointer}
.kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;text-align:center}
.kpis strong{display:block;font-size:1.6rem}.kpis span{font-size:.7rem;color:var(--mut)}

.banner{background:var(--card);border-radius:12px;padding:10px 12px;display:flex;flex-wrap:wrap;gap:8px;align-items:center;justify-content:center;text-align:center;font-size:.9rem}
.banner[hidden]{display:none}
#risk{border:1px solid var(--acc);color:var(--acc);font-weight:600}
.banner button{background:none;border:1px solid var(--mut);border-radius:999px;color:var(--fg);font:inherit;padding:6px 12px;cursor:pointer}
.banner .primary{background:var(--acc);color:#111;border-color:var(--acc);font-weight:700}
.next strong{font-variant-numeric:tabular-nums;font-size:1.2rem}
#stats-body .shield{margin:.8rem 0 0;font-weight:600}#stats-body .shield small{display:block;font-weight:400;opacity:.7}