:root{--bg:#0b1020;--card:#121a33;--line:#24305a;--t:#e8ecff;--m:#a3aed4;--a:#22d3ee;--b:#a78bfa;--g:#34d399;--y:#fbbf24;--r:#f87171}
*{box-sizing:border-box}html,body{margin:0;overflow-x:hidden}body{background:radial-gradient(1200px 600px at 80% -10%,#1d2a5a 0,transparent 60%),var(--bg);color:var(--t);font:16px/1.5 system-ui,-apple-system,Segoe UI,Roboto,sans-serif;padding-bottom:84px}
a{color:var(--a)}h1{font-size:clamp(26px,5vw,40px);margin:0 0 6px;line-height:1.1}h2{margin:0 0 6px;font-size:21px}h3{margin:0 0 6px}
.muted{color:var(--m)}.small{font-size:13px}.top{position:sticky;top:0;z-index:5;display:flex;align-items:center;gap:12px;padding:10px 16px;background:#0b1020cc;backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.brand{display:flex;align-items:center;gap:8px;font-size:19px}.tabs{display:none;gap:4px;margin-left:auto}.tabs button,.bnav button{background:none;border:0;color:var(--m);font:inherit;cursor:pointer}
.tabs button{padding:8px 12px;border-radius:10px}.tabs button:hover{background:#1a2448;color:var(--t)}.tabs button.on{background:#1f2b57;color:var(--t)}
#installBtn{margin-left:auto}.tabs~#installBtn{margin-left:8px}
.layout{max-width:1240px;margin:0 auto;padding:14px;display:grid;gap:14px}.view{display:none;animation:in .35s ease}.view.on{display:block}
@keyframes in{from{opacity:0;transform:translateY(8px)}}
.card{background:linear-gradient(180deg,#141d3a,#10172e);border:1px solid var(--line);border-radius:18px;padding:18px;margin-bottom:14px}
.glow{box-shadow:0 0 0 1px #22d3ee22,0 20px 60px -20px #22d3ee55}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;background:linear-gradient(90deg,var(--a),var(--b));color:#081022;border:0;border-radius:12px;padding:12px 16px;font:600 15px system-ui;cursor:pointer;text-decoration:none;transition:transform .15s,filter .15s;min-height:44px}
.btn:hover{filter:brightness(1.1);transform:translateY(-1px)}.btn:focus-visible,button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid var(--a);outline-offset:2px}
.btn.ghost{background:#1a2448;color:var(--t);border:1px solid var(--line)}.btn.small{padding:6px 10px;min-height:34px;font-size:13px}.btn.big{width:100%;font-size:18px;padding:16px;margin:8px 0 14px}.btn.x{background:#000;color:#fff;width:100%;border:1px solid #333}
.btn:disabled{opacity:.6}
.gauge{position:relative;max-width:340px;margin:10px auto 0;text-align:center}.gauge svg{width:100%}.g-bg,.g-fg{fill:none;stroke-width:14;stroke-linecap:round}.g-bg{stroke:#1d274b}.g-fg{stroke:url(#x);stroke:var(--a);stroke-dasharray:252;stroke-dashoffset:252;transition:stroke-dashoffset .25s}
.gnum{position:absolute;left:0;right:0;top:44%;font-size:44px;font-weight:800}.gnum small{font-size:14px;color:var(--m);margin-left:4px}
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.stats div{background:#0e1530;border:1px solid var(--line);border-radius:12px;padding:8px;text-align:center}.stats small{color:var(--m);font-size:12px;display:block}.stats b{font-size:17px}
.room-pick{display:flex;gap:8px;align-items:center;margin-top:12px;color:var(--m);font-size:14px}select,input{background:#0e1530;color:var(--t);border:1px solid var(--line);border-radius:10px;padding:10px;font:inherit;min-height:44px;min-width:0}
.row{display:flex;gap:8px;align-items:center}.row input{flex:1}.between{justify-content:space-between}.wrap{flex-wrap:wrap;margin-top:12px}
.uses{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px;margin-top:10px}.use{padding:10px;border-radius:12px;background:#0e1530;border:1px solid var(--line)}.use b{display:block}
.ok{color:var(--g)}.meh{color:var(--y)}.bad{color:var(--r)}
.rooms{display:grid;gap:8px;margin-top:12px;grid-template-columns:repeat(auto-fill,minmax(200px,1fr))}.room{border-radius:14px;padding:12px;border:1px solid var(--line);background:#0e1530;position:relative}.room .lvl{height:6px;border-radius:4px;background:#1d274b;margin:8px 0}.room .lvl i{display:block;height:100%;border-radius:4px}
.room .x{position:absolute;right:8px;top:6px;background:none;border:0;color:var(--m);font-size:18px;cursor:pointer;min-height:auto}
.q{margin:14px 0}.q p{margin:0 0 6px;font-weight:600}.chips{display:flex;flex-wrap:wrap;gap:6px}.chips label{cursor:pointer}.chips input{display:none}.chips span{display:inline-block;padding:9px 12px;border-radius:999px;border:1px solid var(--line);background:#0e1530;font-size:14px;transition:.15s}.chips input:checked+span{background:#22d3ee22;border-color:var(--a);color:#fff}.chips span:hover{border-color:var(--b)}
.bar{height:10px;background:#1d274b;border-radius:6px;overflow:hidden;margin:8px 0 12px}.bar i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--a),var(--g));transition:width .5s}
.pill{background:#1f2b57;border-radius:999px;padding:4px 10px;font-weight:700}
.plan{display:grid;gap:8px}.step{display:flex;gap:10px;padding:12px;border-radius:12px;background:#0e1530;border:1px solid var(--line);cursor:pointer;transition:.2s}.step:hover{border-color:var(--b)}.step input{width:22px;height:22px;min-height:auto;accent-color:var(--g);flex:none;margin-top:2px}.step.done{opacity:.6}.step.done b{text-decoration:line-through}.step .tag{font-size:11px;padding:2px 7px;border-radius:999px;background:#34d39922;color:var(--g);margin-left:6px}.step .tag.buy{background:#a78bfa22;color:var(--b)}
.gear{display:grid;gap:10px;grid-template-columns:repeat(auto-fill,minmax(230px,1fr))}.prod{padding:14px;border-radius:14px;background:#0e1530;border:1px solid var(--line);display:flex;flex-direction:column;gap:6px;transition:.2s}.prod:hover{transform:translateY(-2px);border-color:var(--a)}.prod .why{font-size:13px;color:var(--m);flex:1}.prod .btn{font-size:14px}
.disc{font-size:12px;color:var(--m);background:#0e1530;border-radius:8px;padding:6px 10px}
.ba{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:10px}.ba div{background:#0e1530;border-radius:12px;padding:10px;text-align:center;border:1px solid var(--line)}.ba b{font-size:24px;display:block}
#chart{width:100%;background:#0e1530;border-radius:12px}.hist{margin-top:12px;font-size:14px}.hist div{display:flex;justify-content:space-between;padding:6px 0;border-bottom:1px solid var(--line);gap:8px}
.score{font-size:64px;font-weight:900;line-height:1;background:linear-gradient(90deg,var(--a),var(--b));-webkit-background-clip:text;background-clip:text;color:transparent}
.follow .fh{display:flex;gap:10px;margin-bottom:10px}.follow p{margin:4px 0 0}
.foot{max-width:1240px;margin:0 auto;padding:10px 16px 20px;color:var(--m);font-size:13px;text-align:center}
.bnav{position:fixed;bottom:0;left:0;right:0;display:grid;grid-template-columns:repeat(5,1fr);background:#0b1020f2;backdrop-filter:blur(10px);border-top:1px solid var(--line);padding:6px 4px calc(6px + env(safe-area-inset-bottom));z-index:6}
.bnav button{display:flex;flex-direction:column;align-items:center;font-size:20px;padding:4px 0;border-radius:10px;min-height:52px}.bnav span{font-size:11px}.bnav button.on{color:var(--t);background:#1f2b57}
#toast{position:fixed;left:50%;bottom:96px;transform:translateX(-50%) translateY(20px);background:#1f2b57;padding:10px 16px;border-radius:12px;opacity:0;transition:.3s;pointer-events:none;z-index:9;max-width:90vw}#toast.on{opacity:1;transform:translateX(-50%)}
@media(min-width:768px){.layout{padding:20px}.rooms{grid-template-columns:repeat(3,1fr)}}
@media(min-width:1024px){body{padding-bottom:0}.bnav{display:none}.tabs{display:flex}.layout{grid-template-columns:minmax(0,1fr) 320px;align-items:start}.side{position:sticky;top:76px}.hero{display:grid;grid-template-columns:1fr 1fr;gap:10px 24px;align-items:center}.hero h1,.hero>p{grid-column:1/-1}.hero .gauge{grid-row:span 3}#toast{bottom:30px}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

.mt8{margin-top:8px}.page{padding:0}.page .layout{max-width:760px;display:block}
.h3{font-size:17px}