*{box-sizing:border-box;margin:0;padding:0}:root{--bg: #05070d;--bg2: #0a0e18;--panel: #0d1420;--panel2: #131b2a;--line: #1e2a3d;--text: #eaf2ff;--muted: #7d8ba3;--cyan: #2fd0ff;--cyan-dim: #1b7fa3;--magenta: #ff2fd0;--gold: #ffce4d;--danger: #ff3d5c;--ok: #39ff8f;--radius: 14px;--clip: 10px;--shadow: 0 20px 50px rgba(0, 0, 0, .5);--font-display: "Orbitron", "Segoe UI", sans-serif;--font-body: "Rajdhani", "Segoe UI", sans-serif}html,body{height:100%}body{min-height:100vh;overflow-x:hidden;font-family:var(--font-body);font-size:16px;background:radial-gradient(circle at 12% 8%,rgba(47,208,255,.12),transparent 32%),radial-gradient(circle at 88% 92%,rgba(255,47,208,.1),transparent 34%),var(--bg);color:var(--text)}#app{position:relative;min-height:100vh}.screen{min-height:100vh;padding:28px 20px 60px;position:relative}.screen[hidden]{display:none}.conn{position:fixed;top:14px;left:50%;transform:translate(-50%);z-index:200;display:flex;align-items:center;gap:8px;padding:7px 14px;border-radius:999px;font-size:12px;font-weight:600;background:#0d1420e6;border:1px solid var(--line);color:var(--muted);backdrop-filter:blur(6px)}.conn .dot{width:8px;height:8px;border-radius:50%;background:var(--danger)}.conn.ok .dot{background:var(--ok)}.conn.ok{color:var(--ok);border-color:#39ff8f66}.btn-chrono{font-family:var(--font-display);font-weight:700;font-size:13px;letter-spacing:.06em;text-transform:uppercase;color:var(--text);background:var(--panel2);border:1px solid var(--line);clip-path:polygon(var(--clip) 0,100% 0,100% calc(100% - var(--clip)),calc(100% - var(--clip)) 100%,0 100%,0 var(--clip));padding:12px 20px;cursor:pointer;transition:transform .15s ease,box-shadow .2s ease,border-color .2s ease,background .2s ease,opacity .15s ease}.btn-chrono:hover:not(:disabled){transform:translateY(-2px);border-color:var(--cyan)}.btn-chrono:active:not(:disabled){transform:translateY(0)}.btn-chrono:disabled{opacity:.35;cursor:not-allowed}.btn-chrono--primary{background:linear-gradient(160deg,#6fe6ff,var(--cyan) 55%,#0f8fc4);color:#04141c;border-color:transparent;box-shadow:0 0 22px -4px #2fd0ff99}.btn-chrono--secondary{background:linear-gradient(160deg,#ff8ae9,var(--magenta) 60%,#a3159c);color:#1c0418;border-color:transparent;box-shadow:0 0 22px -4px #ff2fd08c}.btn-chrono--gold{background:linear-gradient(160deg,#ffe9b0,var(--gold) 55%,#d98f12);color:#241500;border-color:transparent;box-shadow:0 0 22px -4px #ffce4d99}.btn-chrono--ghost{background:transparent}.btn-chrono--small{padding:8px 14px;font-size:11px}.btn-chrono--big{padding:16px 34px;font-size:15px}.btn-chrono--block{width:100%;display:block;text-align:center;margin-top:10px}.btn-chrono.is-ready{background:linear-gradient(160deg,#b6ffce,var(--ok) 55%,#0f9c50);color:#032411;border-color:transparent}.btn-icon{width:34px;height:34px;border-radius:50%;border:1px solid var(--line);background:var(--panel2);color:var(--text);cursor:pointer;font-size:14px}.btn-icon:hover{border-color:var(--cyan)}.panel{background:#0d1420d9;border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:22px}.panel-title{font-family:var(--font-display);font-size:13px;letter-spacing:.1em;text-transform:uppercase;color:var(--cyan);margin-bottom:14px}.field{display:block;margin-bottom:14px}.field-label{display:block;font-size:12px;color:var(--muted);text-transform:uppercase;letter-spacing:.08em;margin-bottom:6px}.input{width:100%;padding:12px 14px;border-radius:8px;border:1px solid var(--line);background:var(--bg2);color:var(--text);font-family:var(--font-body);font-size:15px;font-weight:600}.input:focus{outline:none;border-color:var(--cyan);box-shadow:0 0 0 3px #2fd0ff2e}.input-code{text-align:center;letter-spacing:.3em;text-transform:uppercase;font-family:var(--font-display);max-width:140px}.join-row{display:flex;gap:10px}.join-row .input{flex:1}.menu-hint{margin-top:10px;font-size:12.5px;color:var(--muted)}.screen-menu{display:flex;align-items:center;justify-content:center}.menu-glow{position:absolute;inset:0;pointer-events:none;z-index:0;background:radial-gradient(600px 340px at 50% 10%,rgba(47,208,255,.16),transparent 60%),radial-gradient(500px 300px at 85% 80%,rgba(255,47,208,.12),transparent 60%)}.menu-screen{position:relative;z-index:1;width:min(980px,100%);margin:0 auto;text-align:center}.menu-hero{margin-bottom:34px}.menu-hero__mark{width:clamp(160px,26vw,220px);margin:0 auto 6px;filter:drop-shadow(0 0 20px rgba(47,208,255,.35))}.logo-mark{width:100%;height:auto;overflow:visible}.logo-axle{fill:var(--magenta);filter:drop-shadow(0 0 8px rgba(255,47,208,.7))}.logo-wheel circle:first-child{fill:none;stroke:var(--cyan);stroke-width:4;filter:drop-shadow(0 0 6px rgba(47,208,255,.8))}.logo-wheel .logo-hub{fill:var(--cyan);stroke:none}.logo-wheel line{stroke:var(--cyan);stroke-width:2.4;opacity:.85}.logo-wheel{transform-box:fill-box;transform-origin:center;animation:logo-spin 7s linear infinite}.logo-speedlines line{stroke:var(--muted);stroke-width:3;opacity:.5}@keyframes logo-spin{to{transform:rotate(360deg)}}@media (prefers-reduced-motion: reduce){.logo-wheel{animation:none}}.menu-title{font-family:var(--font-display);font-weight:900;letter-spacing:.04em;font-size:clamp(38px,7vw,66px);line-height:1;color:var(--text);text-shadow:0 0 18px rgba(47,208,255,.35)}.menu-title span{display:block;background:linear-gradient(120deg,var(--magenta),var(--gold) 60%,var(--cyan));-webkit-background-clip:text;background-clip:text;color:transparent;text-shadow:none;filter:drop-shadow(0 0 16px rgba(255,47,208,.35))}.menu-tagline{margin-top:14px;color:var(--muted);font-size:15px;letter-spacing:.03em}.rejoin-banner{margin:0 auto 22px;max-width:420px;text-align:left}.rejoin-actions{display:flex;gap:10px;margin-top:12px}.menu-actions{display:grid;grid-template-columns:1fr 1px 1fr;gap:26px;align-items:start;text-align:left}.menu-divider{background:linear-gradient(180deg,transparent,var(--line),transparent)}.menu-panel{display:flex;flex-direction:column}.menu-footer{margin-top:40px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;text-align:left}.menu-feature{padding:14px 16px;border:1px solid var(--line);border-radius:10px;background:#131b2a99;font-size:13px;color:var(--muted)}.menu-feature__tag{display:inline-block;font-family:var(--font-display);font-size:11px;letter-spacing:.08em;color:var(--cyan);text-transform:uppercase;margin-right:8px}@media (max-width: 760px){.menu-actions{grid-template-columns:1fr}.menu-divider{display:none}.menu-footer{grid-template-columns:1fr}}.topbar{display:flex;align-items:center;justify-content:space-between;gap:12px;max-width:1100px;margin:0 auto 22px}.topbar-title{font-family:var(--font-display);font-size:16px;letter-spacing:.06em;text-transform:uppercase;color:var(--text)}.code-badge{font-family:var(--font-display);font-size:13px;letter-spacing:.05em;color:var(--muted);display:flex;align-items:center;gap:8px;background:var(--panel2);border:1px solid var(--line);border-radius:999px;padding:8px 16px}.code-badge strong{color:var(--cyan);letter-spacing:.15em}.lobby-list{max-width:1100px;margin:0 auto;display:flex;flex-direction:column;gap:10px}.lobby-row{display:flex;align-items:center;justify-content:space-between;padding:16px 20px}.lobby-row__main{display:flex;flex-direction:column;gap:4px}.lobby-row__code{font-family:var(--font-display);font-size:18px;letter-spacing:.1em;color:var(--cyan)}.lobby-row__meta{font-size:13px;color:var(--muted)}.empty-hint{text-align:center;color:var(--muted);padding:40px 0}.mode-tabs,.seg{display:flex;gap:6px;background:var(--panel2);border:1px solid var(--line);border-radius:999px;padding:4px}.seg-btn{font-family:var(--font-display);font-size:11px;letter-spacing:.06em;text-transform:uppercase;padding:8px 14px;border-radius:999px;border:none;background:transparent;color:var(--muted);cursor:pointer}.seg-btn.active{background:linear-gradient(160deg,#6fe6ff,var(--cyan) 70%);color:#04141c}.seg-btn:disabled{cursor:not-allowed;opacity:.5}.lobby-grid{display:grid;grid-template-columns:1fr 300px;gap:22px;max-width:1200px;margin:0 auto;align-items:start}.lanes-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px}.lobby-sidebar{display:flex;flex-direction:column;gap:16px}.lane-card{border-left:4px solid var(--cyan);position:relative}.lane-card--black{border-left-color:#1a1d24;box-shadow:var(--shadow),0 0 0 1px #1a1d24 inset}.lane-card--white{border-left-color:#f0f3fa}.lane-card--silver{border-left-color:#9aa4b5}.lane-card--blue{border-left-color:#2f6fed}.lane-card--green{border-left-color:#2ecc71}.lane-card--red{border-left-color:#f44}.lane-card__head{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:12px}.lane-card__title{font-family:var(--font-display);font-size:13px;letter-spacing:.05em;text-transform:uppercase}.lane-card__color-name{font-size:12px;color:var(--muted)}.color-picker{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:14px}.swatch{width:26px;height:26px;border-radius:50%;border:2px solid var(--line);cursor:pointer;background:var(--sw);position:relative}.swatch.active{border-color:var(--cyan);box-shadow:0 0 10px #2fd0ffb3}.swatch:disabled{opacity:.25;cursor:not-allowed}.color-picker--lane{margin-bottom:12px}.rim-dot{width:14px;height:14px;border-radius:50%;background:var(--sw);display:inline-block;border:1px solid rgba(255,255,255,.25)}.seat-list{display:flex;flex-direction:column;gap:6px}.seat-row{display:flex;align-items:center;gap:8px;padding:9px 10px;border-radius:8px;background:#ffffff08;border:1px solid transparent;font-size:13px}.seat-row--empty{border:1px dashed var(--line);cursor:pointer;color:var(--muted);background:none;width:100%;font-family:var(--font-body)}.seat-row--empty:hover{border-color:var(--cyan);color:var(--cyan)}.seat-row--mine{border-color:var(--cyan);background:#2fd0ff14}.seat-role{font-family:var(--font-display);font-size:10px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);min-width:64px}.seat-name{flex:1;font-weight:600}.seat-empty-label{flex:1;text-align:left}.seat-ready{font-size:11px;color:var(--muted);text-transform:uppercase}.seat-ready.is-ready{color:var(--ok)}.lobby-footer{display:flex;flex-direction:column;align-items:center;gap:10px;margin-top:30px}.start-hint{color:var(--muted);font-size:13px}@media (max-width: 900px){.lobby-grid{grid-template-columns:1fr}}.screen-matchend{display:flex;align-items:center;justify-content:center}.matchend-panel{width:min(520px,100%);text-align:center}.matchend-title{font-family:var(--font-display);font-size:36px;color:var(--gold);text-shadow:0 0 20px rgba(255,206,77,.5);margin-bottom:20px}.matchend-results{display:flex;flex-direction:column;gap:8px;margin-bottom:24px}.matchend-row{display:flex;justify-content:space-between;padding:10px 14px;border-radius:8px;background:#ffffff0a;font-family:var(--font-display);font-size:13px}.matchend-row--first{background:#ffce4d24;color:var(--gold)}.matchend-place{width:50px;text-align:left}.matchend-lane{flex:1;text-align:left}.screen-game{padding:0}.game-mount{position:absolute;inset:0}.game-hud{position:absolute;inset:0;pointer-events:none;z-index:10}.hud-countdown{position:absolute;top:38%;left:50%;transform:translate(-50%,-50%);font-family:var(--font-display);font-size:110px;font-weight:900;color:var(--cyan);text-shadow:0 0 40px rgba(47,208,255,.8)}.hud-finish-place{position:absolute;top:30%;left:50%;transform:translate(-50%,-50%);display:flex;flex-direction:column;align-items:center;gap:4px;animation:finish-pop .4s cubic-bezier(.2,1.4,.4,1)}.hud-finish-place__label{font-family:var(--font-display);font-size:22px;font-weight:700;letter-spacing:.3em;color:var(--muted);text-transform:uppercase}.hud-finish-place__num{font-family:var(--font-display);font-size:150px;font-weight:900;line-height:1;color:var(--gold);text-shadow:0 0 50px rgba(255,206,77,.85)}@keyframes finish-pop{0%{transform:translate(-50%,-50%) scale(.6);opacity:0}to{transform:translate(-50%,-50%) scale(1);opacity:1}}.hud-top{position:absolute;top:16px;left:16px;right:16px;display:flex;align-items:flex-start;justify-content:space-between;gap:10px}.hud-top__left{display:flex;gap:8px;pointer-events:none}.hud-chip{font-family:var(--font-display);font-size:13px;letter-spacing:.05em;text-transform:uppercase;background:#0d1420d9;border:1px solid var(--line);border-radius:999px;padding:8px 16px;color:var(--text)}.hud-bottom{position:absolute;bottom:20px;left:50%;transform:translate(-50%);display:flex;flex-direction:column;align-items:center;gap:10px;width:min(420px,92vw)}.hud-thrust{display:flex;gap:10px;width:100%;justify-content:center}.thrust-bar{display:flex;flex-direction:column;align-items:center;gap:4px;min-width:70px}.thrust-bar__label{font-family:var(--font-display);font-size:10px;color:var(--muted);letter-spacing:.06em}.thrust-bar__track{position:relative;width:100%;height:10px;background:var(--bg2);border:1px solid var(--line);border-radius:6px;overflow:hidden}.thrust-bar__fill{position:absolute;top:0;height:100%;background:var(--cyan);box-shadow:0 0 8px #2fd0ffcc}.thrust-bar__fill.neg{background:var(--danger);box-shadow:0 0 8px #ff3d5ccc}.boost-meter{width:100%;display:flex;flex-direction:column;align-items:center;gap:4px}.boost-meter__label{font-family:var(--font-display);font-size:10px;color:var(--gold);letter-spacing:.06em;text-transform:uppercase}.boost-meter.empty .boost-meter__label{color:var(--muted)}.boost-meter__track{position:relative;width:100%;max-width:260px;height:12px;background:var(--bg2);border:1px solid var(--line);border-radius:7px;overflow:hidden}.boost-meter__fill{position:absolute;left:0;top:0;height:100%;background:linear-gradient(90deg,#ffb020,var(--gold));box-shadow:0 0 10px #ffce4db3;transition:width .1s linear}.toasts{position:fixed;bottom:20px;left:50%;transform:translate(-50%);z-index:300;display:flex;flex-direction:column;gap:8px;align-items:center}.toast{font-family:var(--font-display);font-size:12px;letter-spacing:.04em;padding:10px 18px;border-radius:999px;background:#0d1420f2;border:1px solid var(--line);color:var(--text);opacity:0;transform:translateY(10px);transition:opacity .25s ease,transform .25s ease}.toast.show{opacity:1;transform:translateY(0)}.toast-error{border-color:var(--danger);color:#ffb3c0;box-shadow:0 0 16px #ff3d5c59}.toast-ok{border-color:var(--ok);color:#b8ffd4;box-shadow:0 0 16px #39ff8f59}