html,body,#root{margin:0;min-height:100%;font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif}#root{min-height:100vh}*{box-sizing:border-box}.app{min-height:100vh;margin:0;padding:2rem 1rem 3rem;color:#eef2ff;background:radial-gradient(circle at 20% -10%,#334155,#0b1020 45%,#05070f)}.card{width:min(900px,100%);margin:0 auto;border:1px solid #263148;border-radius:18px;background:linear-gradient(180deg,#0f172af0,#070a14f5);box-shadow:0 24px 48px #02061773}.hero{padding:2rem;text-align:center}.eyebrow{margin:0;font-size:.8rem;letter-spacing:.16em;text-transform:uppercase;color:#93c5fd}.hero h1{margin:.8rem 0 0;font-size:clamp(1.6rem,4vw,2.6rem)}.hero p{margin:.85rem auto 0;max-width:640px;color:#c7d2fe}.trainer{margin-top:1rem;padding:1.2rem}.section-switcher{display:flex;gap:.6rem;align-items:end;flex-wrap:wrap}.lang-switch{margin-left:auto;display:grid;gap:.3rem;color:#bfdbfe;font-weight:600}.tab{background:#0f172a}.tab.active{border-color:#60a5fa;color:#bfdbfe}.row{display:flex;flex-wrap:wrap;justify-content:space-between;gap:.8rem;align-items:end}label{display:grid;gap:.45rem;font-weight:600;color:#bfdbfe}select{background:#111827;color:#f8fafc;border:1px solid #334155;border-radius:10px;padding:.55rem .7rem;min-width:230px}.score{font-weight:700;color:#86efac;background:#14532d40;border:1px solid #14532d;padding:.5rem .8rem;border-radius:999px}.random{align-self:end;background:#1e1b4b;border-color:#4338ca}.preset-list{margin-top:.9rem;display:flex;flex-wrap:wrap;gap:.5rem}.chip{padding:.35rem .65rem;border-radius:999px;font-size:.85rem;background:#0f172a}.chip.active{border-color:#60a5fa;color:#bfdbfe}.actions{display:flex;flex-wrap:wrap;gap:.6rem;margin-top:1rem}button{cursor:pointer;border:1px solid #334155;background:#172033;color:#f8fafc;border-radius:11px;padding:.55rem .85rem;font-weight:600}button:hover{border-color:#60a5fa}button:disabled{opacity:.6;cursor:wait}button.mic{background:#1e293b}button.mic.active{border-color:#ef4444;color:#fecaca}button.ghost{background:transparent}.target,.detected{margin:.9rem 0 0;color:#cbd5e1}.rules{margin:.45rem 0 0;color:#fcd34d;font-size:.92rem}.mic-error{margin:.7rem 0 0;color:#fda4af;font-weight:600}.success-banner{margin-top:1rem;padding:.8rem 1rem;border-radius:12px;border:1px solid #22c55e;background:#14532d59;color:#bbf7d0;font-weight:700}.levels-grid{margin-top:1rem;display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:.8rem}.level-card{border:1px solid #334155;border-radius:12px;background:#0f172ab3;padding:.9rem}.level-card h3{margin:0 0 .5rem}.level-card ul{margin:0;padding-left:1rem;color:#cbd5e1}.level-card button{margin-top:.8rem}.tones{margin-top:1rem;display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:.7rem}.tone{border-radius:12px;border:1px solid #334155;background:#0f172ab3;padding:.75rem;text-align:center}.tone span{display:block;font-size:1.2rem;font-weight:700}.tone small{color:#94a3b8}.tone.ok{border-color:#22c55e;background:#14532d59}.tone.ok small{color:#86efac}