.room-page{min-height:100dvh;background:radial-gradient(1200px 600px at 50% -10%,#260408,#09090b 60%);color:#f5f5f5;padding:16px 14px 40px;box-sizing:border-box}.room-wrap{width:min(920px,100%);margin:0 auto;display:grid;gap:16px}.room-head{display:flex;flex-wrap:wrap;gap:12px;align-items:center;background:#111116;border:1px solid #2a2a34;border-radius:16px;padding:14px 16px}.room-code-box,.room-pw{display:flex;flex-direction:column;gap:2px}.room-code-box span,.room-pw span{font-size:10px;letter-spacing:.14em;color:#888;font-weight:800}.room-code-box b{font-size:26px;letter-spacing:.12em}.room-pw{flex-direction:row;align-items:center;gap:8px;flex-wrap:wrap}.room-pw span{width:100%}.room-pw b{font-size:18px;letter-spacing:.08em}.room-head .primary{margin-left:auto}.room-btn{background:#181822;border:1px solid #333342;color:#ddd;border-radius:10px;padding:9px 14px;font-weight:700;font-size:13px;cursor:pointer;transition:.2s}.room-btn:hover{border-color:#e11d2e;color:#fff}.room-btn.sm{padding:5px 10px;font-size:12px}.room-btn.primary{background:#e11d2e;border-color:#e11d2e;color:#fff}.room-card{background:#111116;border:1px solid #2a2a34;border-radius:16px;padding:18px}.room-card h3{margin:0 0 12px;font-size:16px}.room-banner{border-radius:10px;padding:9px 14px;font-size:13px;font-weight:600}.room-banner.warn{background:#f5b8001f;border:1px solid #f5b800;color:#ffd043}.room-banner.err{background:#e11d2e26;border:1px solid #e11d2e;color:#ff4d5a}.room-banner.info{background:#788cff1a;border:1px solid #4a5ac8;color:#b8c2ff;margin:6px 12px 0}.room-players{list-style:none;margin:0;padding:0;display:grid;gap:8px}.room-players li{display:flex;align-items:center;gap:10px;background:#0d0d12;border:1px solid #2a2a34;border-radius:12px;padding:10px 12px}.room-players li.me{border-color:#555;background:#15151d}.room-seat{width:18px;text-align:center;color:#555}.room-seat.in{color:#22c55e}.room-pname{flex:1;font-weight:700;font-size:14px;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.room-dot{width:9px;height:9px;border-radius:50%}.room-dot.on{background:#22c55e;box-shadow:0 0 8px #22c55e}.room-dot.off{background:#666}.room-pctl{display:flex;gap:6px}.room-pctl button{background:#181822;border:1px solid #333342;color:#ccc;border-radius:8px;padding:4px 9px;cursor:pointer;font-size:12px}.room-pctl button:hover:not(:disabled){border-color:#f5b800}.room-pctl button.danger:hover{border-color:#e11d2e;color:#ff4d5a}.room-pctl button:disabled{opacity:.35;cursor:default}.room-hint{margin:12px 0 0;font-size:12px;color:#888;line-height:1.5}.room-games{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px}.room-game{display:flex;flex-direction:column;align-items:flex-start;gap:3px;text-align:left;background:#0d0d12;border:1px solid #2a2a34;border-radius:12px;padding:12px;color:#fff;cursor:pointer;transition:.2s}.room-game:disabled{cursor:default;opacity:.75}.room-game:hover:not(:disabled){border-color:#e11d2e}.room-game.sel{border-color:#e11d2e;background:#1c0f12;box-shadow:0 0 16px #e11d2e40;opacity:1}.rg-icon{font-size:24px}.room-game small{color:#888;font-size:11px}.room-start{width:100%;margin-top:16px;padding:14px}.room-start:disabled{opacity:.45;cursor:not-allowed;transform:none}.room-wait{margin-top:16px;text-align:center;padding:16px;background:#0d0d12;border:1px dashed #333;border-radius:12px;color:#aaa;font-size:14px}.room-game-page{min-height:100dvh;background:#09090b}.room-bar{position:sticky;top:0;z-index:40;display:flex;align-items:center;gap:10px;padding:8px 12px;background:#0a0a0eeb;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:1px solid #22222a}.room-bar-title{display:flex;flex-direction:column;line-height:1.2;min-width:0}.room-bar-title b{font-size:13px;color:#fff}.room-bar-title span{font-size:11px;color:#888}.room-bar-players{margin-left:auto;display:flex;gap:6px;overflow-x:auto;max-width:55%}.room-chip{white-space:nowrap;font-size:11px;font-weight:700;padding:3px 9px;border-radius:12px;background:#181822;border:1px solid #333342;color:#ccc}.room-chip.me{border-color:#e11d2e;color:#fff}.room-chip.off{opacity:.4;text-decoration:line-through}@media(max-width:520px){.room-head .primary{margin-left:0;width:100%}.room-bar-players{display:none}}:root{--bg: #070709;--card: #111116;--card-hover: #16161d;--line: #22222a;--line-strong: #333340;--text: #f4f4f7;--muted: #8c8c9a;--red: #e11d2e;--red-glow: rgba(225, 29, 46, .45);--gutter: clamp(16px, 4vw, 42px);font-family:Inter,system-ui,-apple-system,sans-serif;color:var(--text);background:var(--bg);color-scheme:dark}body{margin:0;min-height:100dvh;background:var(--bg);overflow-x:hidden;overscroll-behavior:none;-webkit-tap-highlight-color:transparent}*{box-sizing:border-box}html{-webkit-text-size-adjust:100%}body{margin:0;min-height:100dvh;background:var(--bg);overflow-x:hidden}a{color:inherit;text-decoration:none}button{font:inherit}.wrap{width:min(1140px,100% - 2 * var(--gutter));margin-inline:auto}.route-page{animation:page-in .3s cubic-bezier(.16,1,.3,1) both}@keyframes page-in{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}.arcade-nav{position:sticky;top:0;z-index:50;background:#070709d9;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}.arcade-nav-inner{height:64px;display:flex;align-items:center;justify-content:space-between}.arcade-brand{display:flex;align-items:center;gap:10px}.brand-badge{width:32px;height:32px;border-radius:8px;background:linear-gradient(135deg,var(--red),#800f19);display:grid;place-items:center;font-size:16px;box-shadow:0 0 12px var(--red-glow)}.brand-text{font-size:15px;font-weight:900;letter-spacing:.08em}.brand-text span{color:var(--red)}.live-pill{display:flex;align-items:center;gap:7px;font-size:11px;font-weight:800;letter-spacing:.06em;padding:5px 12px;border-radius:20px;background:#15151c;border:1px solid var(--line-strong);color:#ddd}.ping-dot{width:7px;height:7px;border-radius:50%;background:#22c55e;box-shadow:0 0 8px #22c55e;animation:ping 1.8s infinite}@keyframes ping{50%{opacity:.3}}.arcade-hero{padding:clamp(38px,7vw,70px) 0 clamp(24px,4vw,40px);text-align:center;display:flex;flex-direction:column;align-items:center;position:relative}.arcade-hero:before{content:"";position:absolute;top:-100px;width:500px;height:300px;background:radial-gradient(circle,rgba(225,29,46,.15) 0%,transparent 70%);pointer-events:none}.hero-kicker{display:flex;align-items:center;gap:12px;font-size:11px;font-weight:800;letter-spacing:.24em;color:var(--red);margin-bottom:12px}.kicker-line{width:32px;height:1px;background:var(--red);opacity:.6}.hero-heading{margin:0 0 12px;font-size:clamp(30px,6vw,56px);font-weight:900;letter-spacing:-.02em;line-height:1.05}.hero-heading span{color:var(--red);text-shadow:0 0 30px rgba(225,29,46,.4)}.hero-subtext{margin:0 auto 28px;max-width:540px;color:var(--muted);font-size:15px;line-height:1.6}.hero-stats{display:inline-flex;align-items:center;gap:20px;padding:10px 24px;background:#111116;border:1px solid var(--line);border-radius:40px}.stat-unit{display:flex;flex-direction:column;align-items:center}.stat-unit strong{font-size:18px;color:#fff;font-weight:800}.stat-unit span{font-size:10px;color:var(--muted);text-transform:uppercase;letter-spacing:.06em}.stat-divider{width:1px;height:22px;background:var(--line-strong)}.arcade-toolbar{display:flex;align-items:center;justify-content:space-between;margin-bottom:24px;flex-wrap:wrap;gap:14px}.filter-pill-group{display:flex;gap:8px;background:#111116;padding:4px;border-radius:12px;border:1px solid var(--line);overflow-x:auto}.filter-pill{background:transparent;border:0;color:var(--muted);padding:8px 16px;border-radius:8px;font-weight:700;font-size:13px;cursor:pointer;transition:all .2s ease;white-space:nowrap}.filter-pill.active{background:var(--red);color:#fff}.filter-pill:hover:not(.active){color:#fff}.games-counter{font-size:13px;color:var(--muted);font-weight:600}.arcade-game-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,320px),1fr));gap:18px;padding-bottom:60px}.arcade-card{position:relative;background:var(--card);border:1px solid var(--line);border-radius:18px;padding:22px;display:flex;flex-direction:column;gap:16px;overflow:hidden;transition:transform .25s ease,border-color .25s ease,background .25s ease;opacity:0;animation:card-appear .4s ease-out forwards;animation-delay:calc(var(--card-i) * 55ms)}@keyframes card-appear{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}.arcade-card:hover{transform:translateY(-4px);border-color:var(--red);background:var(--card-hover);box-shadow:0 16px 36px #0009,0 0 20px #e11d2e26}.card-top{display:flex;align-items:center;justify-content:space-between}.card-icon-frame{width:58px;height:58px;border-radius:14px;background:#171720;border:1px solid var(--line-strong);display:grid;place-items:center;font-size:28px;transition:transform .25s cubic-bezier(.34,1.56,.64,1)}.arcade-card:hover .card-icon-frame{transform:scale(1.1) rotate(-4deg)}.card-badges{display:flex;gap:6px}.badge-new{font-size:10px;font-weight:900;letter-spacing:.06em;padding:4px 8px;border-radius:6px;background:var(--red);color:#fff}.badge-cat{font-size:11px;font-weight:700;padding:4px 10px;border-radius:6px;background:#191922;color:var(--muted);border:1px solid var(--line)}.card-content{flex:1}.card-title{margin:0 0 6px;font-size:19px;font-weight:800;letter-spacing:-.01em}.card-tagline{margin:0;font-size:13px;color:var(--muted);line-height:1.5}.card-footer{display:flex;align-items:center;justify-content:space-between;border-top:1px solid var(--line);padding-top:14px}.card-players{display:flex;align-items:center;gap:6px;font-size:12px;color:#a0a0ae;font-weight:600}.card-btn{font-size:12px;font-weight:800;color:#fff;background:#1d1d26;border:1px solid var(--line-strong);padding:6px 12px;border-radius:8px;transition:.2s}.arcade-card:hover .card-btn{background:var(--red);border-color:var(--red)}.arcade-footer{border-top:1px solid var(--line);padding:24px 0;color:var(--muted);font-size:13px;text-align:center}.loader{min-height:100dvh;display:grid;place-items:center;background:var(--bg)}.loader-die{width:56px;height:56px;background:#fff;border-radius:14px;padding:9px;display:grid;grid-template:repeat(3,1fr) / repeat(3,1fr);animation:die-spin 1s ease-in-out infinite}.loader-die span{margin:auto;width:60%;height:60%;border-radius:50%}.loader-die span:nth-child(odd){background:#111}@keyframes die-spin{to{transform:rotate(360deg)}}@media(max-width:600px){.arcade-hero{padding:30px 0 20px}.hero-stats{gap:14px;padding:8px 16px}.arcade-toolbar{flex-direction:column;align-items:stretch}.games-counter{text-align:right}}.arcade-brand{display:flex;align-items:center;text-decoration:none}.brand-logo{height:38px;width:auto;object-fit:contain;display:block;transition:transform .2s ease,filter .2s ease}.arcade-brand:hover .brand-logo{transform:scale(1.03);filter:drop-shadow(0 0 10px rgba(225,29,46,.35))}.hero-logo{max-width:min(85vw,420px);height:auto;object-fit:contain;margin-bottom:14px}.demo-ribbon{position:fixed;top:18px;right:-36px;width:140px;background:#e11d2e;color:#fff;text-align:center;font-size:10px;font-weight:900;letter-spacing:.12em;padding:4px 0;transform:rotate(45deg);z-index:999;box-shadow:0 4px 14px #e11d2e80;pointer-events:none;-webkit-user-select:none;user-select:none}.demo-notice-bar{display:flex;align-items:center;gap:12px;background:#141419;border:1px dashed rgba(225,29,46,.45);border-radius:12px;padding:10px 16px;margin-bottom:32px;font-size:13px;color:#ccc}.demo-badge-pill{background:#e11d2e2e;border:1px solid #e11d2e;color:#ff4d5a;font-size:10px;font-weight:800;letter-spacing:.08em;padding:3px 8px;border-radius:6px;white-space:nowrap}.demo-notice-text{flex:1;line-height:1.4}.hero-cta-group{display:flex;gap:12px;justify-content:center;margin-top:12px}.feedback-cta-btn{background:#181820;border:1px solid #333342;color:#fff;padding:10px 20px;border-radius:20px;font-weight:700;font-size:13px;cursor:pointer;transition:all .2s ease}.feedback-cta-btn:hover{border-color:#e11d2e;background:#20202c;transform:translateY(-1px)}.section-head{display:flex;align-items:flex-end;justify-content:space-between;margin-bottom:20px}.section-title{margin:0;font-size:22px;font-weight:800;letter-spacing:-.01em}.section-count{font-size:12px;color:var(--muted);font-weight:600}.roadmap-section{padding-top:20px;margin-bottom:48px}.roadmap-kicker{font-size:11px;font-weight:800;letter-spacing:.2em;color:#e11d2e;text-transform:uppercase}.roadmap-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,250px),1fr));gap:16px}.roadmap-card{background:#111116;border:1px solid var(--line);border-radius:14px;padding:20px;display:flex;flex-direction:column;gap:8px;transition:border-color .2s ease}.roadmap-card:hover{border-color:#383848}.roadmap-icon{font-size:26px;margin-bottom:4px}.roadmap-card h3{margin:0;font-size:16px;font-weight:700}.roadmap-card p{margin:0;font-size:13px;color:var(--muted);line-height:1.5;flex:1}.roadmap-badge{align-self:flex-start;font-size:10px;font-weight:800;padding:3px 8px;border-radius:6px;text-transform:uppercase;margin-top:8px}.roadmap-badge.in-progress{background:#f5b80026;color:#f5b800;border:1px solid rgba(245,184,0,.4)}.roadmap-badge.planned{background:#8c8c9a26;color:#aaa;border:1px solid rgba(140,140,154,.3)}.review-banner{background:linear-gradient(135deg,#181216,#111116);border:1px solid #332026;border-radius:16px;padding:28px;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:16px;margin-bottom:48px}.review-banner-text h3{margin:0 0 6px;font-size:18px;font-weight:800}.review-banner-text p{margin:0;color:var(--muted);font-size:14px}.arcade-btn-primary{background:var(--red);color:#fff;border:0;border-radius:10px;padding:12px 22px;font-weight:800;font-size:14px;cursor:pointer;transition:all .2s ease}.arcade-btn-primary:hover{background:#ff2a3d;transform:translateY(-1px)}.btn-secondary{background:#181822;border:1px solid #323242;color:#ccc;border-radius:10px;padding:12px 20px;font-weight:700;font-size:13px;cursor:pointer}.modal-backdrop{position:fixed;inset:0;background:#000c;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;z-index:1000;padding:16px}.modal-card{background:#13131a;border:1px solid #2d2d3a;border-radius:18px;width:min(94vw,520px);max-height:90vh;overflow-y:auto;padding:24px;box-shadow:0 24px 60px #000c;animation:page-in .25s ease-out}.modal-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:18px}.modal-title{margin:0 0 4px;font-size:20px;font-weight:800}.modal-subtitle{margin:0;font-size:13px;color:var(--muted)}.modal-close{background:transparent;border:0;color:var(--muted);font-size:18px;cursor:pointer;padding:4px}.modal-close:hover{color:#fff}.review-form{display:flex;flex-direction:column;gap:14px}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}@media(max-width:500px){.form-row{grid-template-columns:1fr}}.form-group{display:flex;flex-direction:column;gap:6px}.form-group label{font-size:12px;font-weight:700;color:#ccc}.form-group input,.form-group select,.form-group textarea{background:#0d0d12;border:1px solid #2d2d3a;border-radius:10px;padding:10px 12px;color:#fff;font-family:inherit;font-size:13px;outline:none;transition:border-color .2s}.form-group input:focus,.form-group select:focus,.form-group textarea:focus{border-color:var(--red)}.form-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:10px}.modal-success{text-align:center;padding:24px 12px;display:flex;flex-direction:column;align-items:center;gap:12px}.success-icon{width:48px;height:48px;border-radius:50%;background:#22c55e33;border:2px solid #22c55e;color:#22c55e;display:grid;place-items:center;font-size:24px}.modal-success h4{margin:0;font-size:18px}.modal-success p{margin:0 0 12px;color:var(--muted);font-size:14px;line-height:1.5}.arcade-nav-actions{display:flex;align-items:center;gap:10px}.nav-btn-link{background:transparent;border:1px solid var(--line);color:#ddd;font-size:12px;font-weight:700;padding:6px 14px;border-radius:8px;cursor:pointer;transition:all .2s ease}.nav-btn-link:hover{border-color:#555;color:#fff}.nav-btn-highlight{background:var(--red);border:1px solid var(--red);color:#fff;font-size:12px;font-weight:800;padding:6px 14px;border-radius:8px;cursor:pointer;transition:all .2s ease}.nav-btn-highlight:hover{background:#ff2a3d}.hero-quick-links{margin-top:10px}.pill-action-btn{background:#141419;border:1px solid #2d2d38;color:#ddd;font-size:13px;font-weight:700;padding:8px 18px;border-radius:20px;cursor:pointer;transition:all .2s ease}.pill-action-btn:hover{border-color:var(--red);color:#fff}.modal-backdrop{position:fixed;inset:0;width:100vw;height:100vh;background:#000000d9;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;z-index:99999;padding:16px;box-sizing:border-box}.modal-card{background:#13131a;border:1px solid #2d2d3a;border-radius:18px;width:min(94vw,540px);max-height:90vh;overflow-y:auto;padding:24px;box-shadow:0 24px 60px #000000e6;animation:page-in .2s ease-out;box-sizing:border-box}.roadmap-modal-card{width:min(94vw,680px)}.modal-footer-btn{display:flex;justify-content:flex-end;margin-top:20px}.lobby-backdrop{position:fixed;inset:0;background:#000000d9;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;z-index:99999;padding:16px;box-sizing:border-box}.lobby-card{background:#111116;border:2px solid #2d2d3a;border-radius:18px;box-sizing:border-box;width:min(94vw,420px);padding:24px;box-shadow:0 24px 60px #000000e6;animation:page-in .2s ease-out}.lobby-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.lobby-title{margin:0;font-size:20px;font-weight:800;color:#fff}.lobby-close{background:none;border:0;color:#888;font-size:18px;cursor:pointer;padding:4px}.lobby-close:hover{color:#e11d2e}.lobby-tabs{display:flex;background:#181822;border-radius:12px;padding:4px;margin-bottom:20px}.lobby-tabs button{flex:1;background:transparent;border:0;color:#888;font-weight:700;padding:10px;border-radius:10px;cursor:pointer;transition:.2s}.lobby-tabs button.active{background:#2d2d3a;color:#fff;box-shadow:0 4px 10px #0000004d}.lobby-form{display:flex;flex-direction:column;gap:16px}.lobby-group{display:flex;flex-direction:column;gap:6px}.lobby-label{font-size:12px;font-weight:700;color:#aaa;text-transform:uppercase;letter-spacing:.05em;display:block;margin-bottom:4px}.lobby-input{background:#0d0d12;border:1px solid #333342;border-radius:10px;padding:12px 14px;color:#fff;font-size:15px;font-weight:700;outline:none;transition:.2s;width:100%;box-sizing:border-box}.lobby-input:focus{border-color:var(--red);box-shadow:0 0 0 2px #e11d2e33}.lobby-code-row{display:flex;gap:10px}.lobby-code-row input{flex:1;text-transform:uppercase;font-size:18px;letter-spacing:.1em}.lobby-error{background:#e11d2e26;color:#ff4d5a;border:1px solid #e11d2e;padding:10px;border-radius:10px;font-size:13px;font-weight:600;text-align:center;margin-bottom:16px}.staging-header{display:flex;justify-content:space-between;align-items:center;background:#1a1a24;padding:12px 16px;border-radius:12px;margin-bottom:20px;border:1px solid #333342}.staging-code{font-size:14px;color:#ccc}.staging-code b{font-size:18px;color:#fff;letter-spacing:.1em;margin-left:6px}.host-badge{background:#f5b80026;color:#f5b800;border:1px solid #f5b800;font-size:10px;font-weight:800;padding:4px 8px;border-radius:6px;text-transform:uppercase}.player-list{list-style:none;padding:0;margin:0 0 20px;display:flex;flex-direction:column;gap:8px}.player-list li{background:#0d0d12;border:1px solid #2d2d3a;padding:12px 16px;border-radius:10px;display:flex;justify-content:space-between;align-items:center;font-size:14px;font-weight:600}.player-list li.is-me{border-color:#555;background:#181822}.transfer-host-btn{background:transparent;border:1px solid #444;color:#aaa;border-radius:6px;padding:4px 10px;font-size:11px;font-weight:700;cursor:pointer;transition:.2s}.transfer-host-btn:hover{border-color:#f5b800;color:#f5b800}.staging-waiting{text-align:center;padding:24px;background:#0d0d12;border:1px dashed #333;border-radius:12px;color:#888;font-size:13px;font-weight:600;line-height:1.5}
