:root{--bg:#f4f6fb;--card:#fff;--tx:#14213d;--mu:#6b7690;--ac:#1d4ed8;--acf:#fff;--ok:#15803d;--okb:#dcfce7;--bad:#b91c1c;--badb:#fee2e2;--bd:#e3e8f2;color-scheme:light}
@media (prefers-color-scheme:dark){:root{--bg:#0e1424;--card:#172036;--tx:#e8edf8;--mu:#93a0bd;--ac:#6b9bff;--acf:#0e1424;--ok:#4ade80;--okb:#12351f;--bad:#f87171;--badb:#3d1717;--bd:#26314d;color-scheme:dark}}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--tx);font:15px/1.45 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;padding:env(safe-area-inset-top) 0 90px}
#app{max-width:560px;margin:0 auto;padding:14px}
h1{font-size:20px;margin:4px 0 2px}
.mu{color:var(--mu);font-size:13px}
.card{background:var(--card);border:1px solid var(--bd);border-radius:14px;padding:14px;margin:10px 0}
.hero{background:var(--ac);color:var(--acf);border:0}.hero .big{font-size:30px;font-weight:700;margin:2px 0}
.row{display:flex;align-items:center;gap:10px}.sp{justify-content:space-between}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.in{color:var(--ok)}.out{color:var(--bad)}
.chip{font-size:12px;padding:2px 9px;border-radius:99px;font-weight:600;white-space:nowrap}
.chip.ok{background:var(--okb);color:var(--ok)}.chip.no{background:var(--badb);color:var(--bad)}
.item{display:flex;align-items:center;gap:10px;padding:11px 4px;border-bottom:1px solid var(--bd)}.item:last-child{border-bottom:0}
.item .nm{flex:1;min-width:0}.item .nm b{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.num{width:26px;color:var(--mu);font-size:13px}
button{font:inherit;border:0;border-radius:10px;padding:10px 14px;background:var(--ac);color:var(--acf);font-weight:600;cursor:pointer}
button.gh{background:transparent;color:var(--ac);border:1px solid var(--bd)}
button.dg{background:var(--badb);color:var(--bad)}button.sm{padding:6px 10px;font-size:13px}
input,select,textarea{font:inherit;width:100%;padding:10px;border-radius:10px;border:1px solid var(--bd);background:var(--bg);color:var(--tx);margin:4px 0 10px}
label{font-size:13px;color:var(--mu)}
.bar{height:8px;border-radius:9px;background:var(--bd);overflow:hidden;margin:8px 0}.bar i{display:block;height:100%;background:var(--ok)}
nav{position:fixed;left:0;right:0;bottom:0;background:var(--card);border-top:1px solid var(--bd);display:flex;padding-bottom:env(safe-area-inset-bottom);z-index:5}
nav button{flex:1;background:none;color:var(--mu);border-radius:0;padding:12px 4px;font-size:12px}nav button.on{color:var(--ac)}
#modal{position:fixed;inset:0;background:rgba(0,0,0,.5);display:none;align-items:flex-end;justify-content:center;z-index:9}#modal.show{display:flex}
#sheet{background:var(--card);width:100%;max-width:560px;border-radius:18px 18px 0 0;padding:16px 16px calc(16px + env(safe-area-inset-bottom));max-height:90vh;overflow:auto}
#toast{position:fixed;left:50%;transform:translateX(-50%);bottom:100px;background:var(--tx);color:var(--bg);padding:9px 14px;border-radius:99px;font-size:13px;display:none;z-index:10}
.pill{display:inline-block;background:var(--badb);color:var(--bad);border-radius:99px;padding:2px 9px;font-size:12px;margin:2px 3px 2px 0}
#inst{position:fixed;left:10px;right:10px;top:calc(10px + env(safe-area-inset-top));max-width:540px;margin:0 auto;background:var(--card);border:1px solid var(--ac);border-radius:14px;padding:12px;display:none;z-index:20;box-shadow:0 6px 24px rgba(0,0,0,.25)}
#inst.show{display:block}
