:root{--bg:#070b1f;--bg2:#0c1230;--surface:#111a3d;--line:#223063;--text:#e8ecff;--muted:#8d97c2;--violet:#8b5cf6;--violet-d:#6d3fe0;--cyan:#22d3ee;--danger:#fb7185;--ok:#34d399;--warn:#fbbf24;--font:"Segoe UI Variable Display", "SF Pro Display", "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif}*{box-sizing:border-box}html,body,#root{height:100%}body{font-family:var(--font);color:var(--text);-webkit-font-smoothing:antialiased;background:radial-gradient(1100px 600px at 50% -10%, #1b1f5a 0%, transparent 60%) no-repeat fixed, var(--bg);margin:0}button{font:inherit;color:inherit;cursor:pointer}:focus-visible{outline:2px solid var(--cyan);outline-offset:3px}.app{max-width:560px;min-height:100%;padding:env(safe-area-inset-top) 20px env(safe-area-inset-bottom);flex-direction:column;margin:0 auto;display:flex}.top{padding:18px 0 4px}.logo{letter-spacing:-.02em;align-items:center;gap:10px;font-size:22px;font-weight:700;display:inline-flex}.banner{color:#ffd3de;background:#3b1d33;border:1px solid #6b2a4a;border-radius:12px;margin:8px 0;padding:10px 14px;font-size:14px}.screen{flex-direction:column;flex:1;gap:22px;padding-bottom:8px;display:flex}.screen.center{text-align:center;justify-content:center;align-items:center;gap:16px}h1{letter-spacing:-.02em;margin:0;font-size:28px}.muted{color:var(--muted);margin:0}.orb{aspect-ratio:1;max-width:100%;display:block;height:auto!important}.hero{flex-direction:column;align-items:center;margin-top:-6px;display:flex}.hero .orb{margin-bottom:-18px}.tagline{letter-spacing:-.025em;text-align:center;max-width:12em;margin:0;font-size:26px;font-weight:700;line-height:1.15}.group h2{color:var(--muted);margin:0 0 10px;font-size:15px;font-weight:600}.group h2 small{opacity:.7;margin-left:6px;font-weight:400}.chips{flex-wrap:wrap;gap:8px;display:flex}.chips.tags{justify-content:center}.chip,.tag{border:1px solid var(--line);color:var(--text);background:0 0;border-radius:999px;padding:9px 14px;font-size:14px}.chip{transition:background .15s,border-color .15s,box-shadow .15s}.chip:hover{border-color:#3a4a95}.chip[aria-pressed=true]{border-color:var(--violet);background:#8b5cf638;box-shadow:0 0 18px #8b5cf659}.tag{color:var(--muted);padding:6px 12px}.seg{background:var(--bg2);border:1px solid var(--line);border-radius:16px;grid-template-columns:repeat(3,1fr);gap:4px;padding:4px;display:grid}.seg button{background:0 0;border:0;border-radius:12px;padding:14px 8px;font-weight:600;transition:background .15s,box-shadow .15s}.seg button[aria-pressed=true]{background:linear-gradient(135deg, var(--violet), #5b8def);box-shadow:0 6px 24px #8b5cf673}.me{flex-wrap:wrap;align-items:center;gap:8px;margin-top:12px;display:flex}.me>span{color:var(--muted);margin-right:2px;font-size:14px}.me .chip{padding:6px 12px;font-size:13px}.dock{background:linear-gradient(to top, var(--bg) 70%, transparent);flex-direction:column;align-items:stretch;gap:12px;margin-top:auto;padding:16px 0 14px;display:flex;position:sticky;bottom:0}.age{color:var(--muted);align-items:center;gap:10px;font-size:14px;display:flex}.age input{width:18px;height:18px;accent-color:var(--violet)}.safety{color:var(--muted);text-align:center;margin:0;font-size:12.5px;line-height:1.45}.hint{color:var(--muted);text-align:center;margin:0;font-size:13px}.error{color:#ffc2cd;background:#3b1d33;border:1px solid #6b2a4a;border-radius:12px;margin:0;padding:10px 14px;font-size:14px}.cta{letter-spacing:-.01em;background:linear-gradient(135deg, var(--violet) 0%, #4f8cf0 60%, var(--cyan) 130%);border:0;border-radius:20px;padding:20px 28px;font-size:20px;font-weight:700;transition:transform .12s,box-shadow .2s,opacity .2s;box-shadow:0 10px 40px #6366f180}.cta:hover:not(:disabled){box-shadow:0 12px 52px #6366f1b3}.cta:active:not(:disabled){transform:scale(.98)}.cta:disabled{opacity:.4;cursor:not-allowed;box-shadow:none}.ghost{border:1px solid var(--line);color:var(--muted);background:0 0;border-radius:16px;padding:14px 26px}.link{color:var(--muted);text-underline-offset:3px;background:0 0;border:0;padding:6px;font-size:14px;text-decoration:underline}.danger{color:#ffb4c2;background:0 0;border:1px solid #6b2a4a;border-radius:12px;padding:10px 16px}.status{flex-wrap:wrap;justify-content:center;align-items:center;gap:10px;font-size:15px;display:flex}.dot{background:var(--warn);border-radius:50%;width:10px;height:10px}.dot.connected{background:var(--ok);box-shadow:0 0 10px var(--ok)}.dot.failed{background:var(--danger)}.timer{font-variant-numeric:tabular-nums;color:var(--muted)}.q{border:1px solid var(--line);border-radius:999px;padding:3px 10px;font-size:13px}.q.good{color:var(--ok)}.q.fair{color:var(--warn)}.q.poor{color:var(--danger)}.card{border:1px solid var(--line);background:#111a3dcc;border-radius:18px;flex-direction:column;gap:6px;width:100%;max-width:420px;padding:14px 18px;display:flex}.card small{color:var(--muted)}.card p{margin:0;font-size:18px;line-height:1.35}.panel{background:var(--surface);border:1px solid var(--line);border-radius:18px;flex-direction:column;align-items:center;gap:12px;width:100%;max-width:420px;padding:16px;display:flex}.panel h3{margin:0;font-size:15px}.controls{justify-content:center;align-items:center;gap:14px;width:100%;margin-top:6px;display:flex}.controls .next{flex:1;max-width:240px;padding:22px 20px;font-size:22px}.round{border:1px solid var(--line);background:var(--surface);border-radius:50%;place-items:center;width:64px;height:64px;transition:background .15s;display:grid}.round.off{color:#ffb4c2;background:#4a1d3a;border-color:#8a2d5c}.round.end{color:#ffb4c2}.round:hover{background:#18245a}@media (max-width:380px){.tagline{font-size:22px}.controls .next{font-size:19px}}@media (prefers-reduced-motion:reduce){*{transition:none!important}}