@import "https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800;900&display=swap";:root{--bg:#191c45;--bg2:#20234f;--card:#292963;--line:#ffffff14;--line2:#ffffff25;--text:#fff;--text2:#dce8f7;--muted:#a9b5ce;--faint:#7a86a3;--accent:#237ec6;--accent-light:#84c1f1;--accent-soft:#237ec624;--good:#3ddc97;--bad:#ff6b7a;--gold:#ffd166;--radius:18px;--glow:inset 0 1px 0 #ffffff38, 0 10px 30px -10px #237ec68c;color:var(--text);background:var(--bg);-webkit-tap-highlight-color:transparent;font-family:Inter,system-ui,sans-serif}*{box-sizing:border-box}html,body,#root{min-height:100%;margin:0}body{background:radial-gradient(900px 600px at 85% -5%, var(--accent-soft), transparent 60%), radial-gradient(700px 500px at 0% 30%, #29296399, transparent 55%), var(--bg);background-attachment:fixed;min-height:100dvh;overflow-x:hidden}button{font:inherit;color:inherit;cursor:pointer;touch-action:manipulation;-webkit-user-select:none;user-select:none;background:0 0;border:0}.app{max-width:560px;margin:0 auto;padding:12px 16px 104px}.hud{-webkit-backdrop-filter:blur(14px)saturate(140%);backdrop-filter:blur(14px)saturate(140%);border:1px solid var(--line2);border-radius:var(--radius);z-index:5;background:#292963cc;align-items:center;gap:12px;padding:10px 14px;display:flex;position:sticky;top:8px}.avatar{background:linear-gradient(135deg, var(--accent), #292963);width:48px;height:48px;box-shadow:var(--glow);border-radius:14px;flex:none;place-items:center;font-size:26px;display:grid}.avatar.lg{border-radius:24px;width:84px;height:84px;margin:0 auto;font-size:46px}.hud-name{font-weight:700}.hud-title{color:var(--accent-light);font-size:13px}.lvl{text-align:right;margin-left:auto}.lvl-num{color:var(--muted);letter-spacing:.06em;font-size:13px;font-weight:900}.lvl-num b{color:var(--text);font-size:22px}.xpbar{background:#dce8f712;border-radius:99px;width:110px;height:8px;margin-top:6px;overflow:hidden}.xpbar>i{background:linear-gradient(90deg, var(--accent), var(--accent-light));border-radius:99px;height:100%;display:block}h1{letter-spacing:-.02em;margin:22px 0 6px;font-size:28px;font-weight:800}h2{margin:22px 0 8px;font-size:19px;font-weight:700}.sub{color:var(--muted);margin:0 0 14px;line-height:1.45}.kicker{letter-spacing:.14em;text-transform:uppercase;color:var(--accent-light);font-size:12px;font-weight:700}.path{padding-left:4px;position:relative}.path:before{content:"";background:linear-gradient(var(--accent), transparent);opacity:.5;border-radius:3px;width:3px;position:absolute;top:40px;bottom:40px;left:31px}.zone{text-align:left;border:1px solid var(--line2);border-radius:var(--radius);background:#292963cc;align-items:center;gap:14px;width:100%;margin:12px 0;padding:14px;display:flex;position:relative}.zone-dot{color:#fff;border-radius:50%;flex:none;place-items:center;width:56px;height:56px;font-size:22px;font-weight:900;display:grid}.zone.locked{filter:saturate(.2);opacity:.55}.zone small{color:var(--muted);margin-top:3px;display:block}.zone .prog{color:var(--accent-light);margin-left:auto;font-size:13px;font-weight:700}.card{border:1px solid var(--line2);border-radius:var(--radius);background:#292963cc;margin:12px 0;padding:16px}.row{align-items:center;gap:10px;display:flex}.stars{color:var(--gold);letter-spacing:1px;margin-left:auto;font-size:14px}.btn{background:var(--accent);color:#fff;width:100%;box-shadow:var(--glow), 0 4px 0 #165a91;border-radius:14px;justify-content:center;align-items:center;gap:8px;margin:10px 0;padding:15px 18px;font-size:16px;font-weight:700;display:flex}.btn.secondary{background:var(--bg2);border:1px solid var(--line2);box-shadow:0 4px #11133a}.btn:disabled{opacity:.45}.back{color:var(--muted);margin-top:4px;padding:8px 0}ul.points{margin:0;padding-left:18px}ul.points li{color:var(--text2);margin:9px 0;line-height:1.5}.mic-wrap{place-items:center;margin:18px 0 8px;display:grid;position:relative}.mic{background:radial-gradient(circle at 32% 28%, var(--accent-light), var(--accent) 60%, #155d96);width:116px;height:116px;box-shadow:var(--glow), 0 8px 0 #11467a;z-index:1;border-radius:50%;place-items:center;display:grid;position:relative}.mic svg{width:46px;height:46px}.mic.on{background:radial-gradient(circle at 32% 28%,#ff9aa5,#e2384d 60%,#9c1b2c);box-shadow:0 8px #6d1220}.ring{border:3px solid var(--bad);border-radius:50%;width:116px;height:116px;position:absolute}.transcript{border:1px solid var(--line);min-height:72px;color:var(--text2);background:#0f113099;border-radius:14px;padding:14px;line-height:1.55}.transcript.empty{color:var(--faint);font-style:italic}.hint{text-align:center;color:var(--muted);font-size:14px}.fb{border-radius:12px;gap:10px;margin:8px 0;padding:11px 13px;line-height:1.45;display:flex}.fb.good{background:#3ddc971a;border:1px solid #3ddc9759}.fb.bad{background:#ff6b7a14;border:1px solid #ff6b7a4d}.score{text-align:center;letter-spacing:-.03em;background:linear-gradient(180deg, #fff, var(--accent-light));color:#0000;-webkit-background-clip:text;background-clip:text;margin:4px 0;font-size:64px;font-weight:900}.xp-gain{text-align:center;color:var(--gold);font-size:18px;font-weight:800}.opt{text-align:left;background:var(--bg2);border:1px solid var(--line2);border-radius:14px;width:100%;margin:8px 0;padding:14px;line-height:1.4;display:block}.opt.right{border-color:var(--good);background:#3ddc9724}.opt.wrong{border-color:var(--bad);background:#ff6b7a1f}.qbar{gap:4px;margin:10px 0 4px;display:flex}.qbar i{background:var(--line2);border-radius:3px;flex:1;height:5px}.qbar i.done{background:var(--accent-light)}.chat{flex-direction:column;gap:10px;margin:12px 0;display:flex}.bubble{border-radius:16px;max-width:86%;padding:12px 14px;line-height:1.45}.bubble.client{background:var(--bg2);border:1px solid var(--line2);border-bottom-left-radius:4px;align-self:flex-start}.bubble.seller{background:var(--accent);border-bottom-right-radius:4px;align-self:flex-end}.who{color:var(--muted);margin-bottom:3px;font-size:12px}.bubble.seller .who{color:#d6ebff}.typing span{background:var(--muted);border-radius:50%;width:7px;height:7px;margin:0 2px;animation:1.2s infinite blink;display:inline-block}.typing span:nth-child(2){animation-delay:.2s}.typing span:nth-child(3){animation-delay:.4s}@keyframes blink{0%,80%,to{opacity:.25}40%{opacity:1}}.nav{border-top:1px solid var(--line2);padding:6px 8px calc(6px + env(safe-area-inset-bottom));-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);z-index:10;background:#191c45eb;justify-content:center;display:flex;position:fixed;bottom:0;left:0;right:0}.nav-inner{width:100%;max-width:560px;display:flex}.nav button{color:var(--faint);flex-direction:column;flex:1;align-items:center;gap:3px;padding:6px 0;font-size:12px;display:flex;position:relative}.nav button svg{width:24px;height:24px}.nav button.active{color:var(--accent-light)}.nav .pill{background:var(--accent-soft);z-index:-1;border-radius:12px;position:absolute;inset:0 12%}.lb-row{border-bottom:1px solid var(--line);align-items:center;gap:12px;padding:10px 8px;display:flex}.lb-row:last-child{border:0}.lb-rank{width:30px;color:var(--muted);text-align:center;font-weight:900}.lb-row.me{background:var(--accent-soft);border-radius:12px}.lb-row .avatar{border-radius:12px;width:40px;height:40px;font-size:22px}.badges{grid-template-columns:repeat(3,1fr);gap:8px;display:grid}.badge{text-align:center;background:var(--bg2);border:1px solid var(--line2);color:var(--text2);border-radius:14px;flex-direction:column;align-items:center;gap:4px;padding:12px 6px;font-size:12px;display:flex}.badge b{font-size:28px}.badge.off{opacity:.35;filter:grayscale()}.modal{z-index:50;background:#0a0c24d1;place-items:center;padding:16px;display:grid;position:fixed;inset:0}.modal .card{text-align:center;width:100%;max-width:420px;position:relative;overflow:hidden}.input{width:100%;font:inherit;border:1px solid var(--line2);color:var(--text);background:#0f113099;border-radius:14px;outline:none;padding:14px;font-size:17px}.input:focus{border-color:var(--accent)}.avatars{grid-template-columns:repeat(4,1fr);gap:8px;margin:12px 0;display:grid}.avatars button{aspect-ratio:1;background:var(--bg2);border:2px solid var(--line2);border-radius:14px;font-size:30px}.avatars button.sel{border-color:var(--accent-light);box-shadow:var(--glow)}.tag{background:var(--bg2);border:1px solid var(--line2);color:var(--muted);border-radius:99px;padding:3px 9px;font-size:12px;display:inline-block}.tag.lock{color:var(--gold)}.demo-note{color:var(--faint);text-align:center;margin-top:8px;font-size:13px}.confetti{pointer-events:none;border-radius:2px;width:8px;height:14px;position:absolute;top:40%;left:50%}@media (prefers-reduced-motion:reduce){*{animation:none!important}}