:root{--color-bg:#07070f;--color-bg-soft:#0c0c1a;--color-surface:#1618349e;--color-surface-strong:#1e2042c7;--color-surface-muted:#96a0eb0f;--color-border:#8c96eb29;--color-border-strong:#96a0f052;--color-primary:#6f6cf2;--color-primary-hover:#2dd4ee;--color-primary-contrast:#f7f8ff;--color-secondary:#34e6a8;--color-danger:#f0607a;--color-warning:#f4c945;--color-success:#46e6ac;--color-text:#eceef9;--color-muted:#9296c0;--color-muted-strong:#c9cdf0;--color-accent-cyan:#2dd4ee;--color-accent-magenta:#c265f5;--color-board-bg:#090912;--color-board-glow:#6f6cf273;--radius-card:14px;--radius-control:10px;--shadow-card:0 24px 60px #00000080;--shadow-glow:0 0 0 1px #8c96eb29, 0 18px 50px #6f6cf238;--font-display:"Chakra Petch", "Segoe UI", "Microsoft YaHei", system-ui, sans-serif;--font-body:"Outfit", Inter, "Segoe UI", "Microsoft YaHei", system-ui, -apple-system, sans-serif;--space-1:4px;--space-1-5:6px;--space-2:8px;--space-2-5:10px;--space-3:12px;--space-3-5:14px;--space-4:16px;--space-4-5:18px;--space-5:20px;--space-6:24px;--space-8:32px;color:var(--color-text);background:var(--color-bg);font-family:var(--font-body);font-synthesis:none;text-rendering:optimizelegibility}*{box-sizing:border-box}html,body,#root{min-width:320px;min-height:100%}body{min-height:100vh;color:var(--color-text);overscroll-behavior:none;touch-action:manipulation;background:radial-gradient(120% 80% at 18% -8%,#6f6cf233,#0000 55%),radial-gradient(120% 80% at 88% 108%,#2dd4ee24,#0000 55%),radial-gradient(90% 70% at 92% 4%,#c265f51f,#0000 50%),linear-gradient(#0a0a16 0%,#07070f 100%);margin:0;overflow-x:hidden}body.game-lock{touch-action:manipulation}a{color:inherit}button{font:inherit;-webkit-tap-highlight-color:transparent}@media (prefers-reduced-motion:no-preference){button,a,input,select{transition:background-color .16s,border-color .16s,box-shadow .16s,color .16s,opacity .16s,transform .16s}}.page-shell{place-items:center;min-height:100vh;padding:24px;display:grid}.hero,.panel{border:1px solid var(--color-border);border-radius:var(--radius-card);background:var(--color-surface);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);width:min(100%,720px);box-shadow:var(--shadow-card);padding:32px}.visually-hidden{clip:rect(0 0 0 0);white-space:nowrap;width:1px;height:1px;margin:-1px;position:absolute;overflow:hidden}.home-hero{width:min(100%,920px)}.home-top{justify-content:space-between;align-items:start;gap:20px;display:flex}.home-top-actions{justify-items:end;gap:10px;min-width:180px;display:grid}.settings-link,.link-button{justify-content:center;align-items:center;min-height:38px;padding:0 14px;text-decoration:none;display:inline-flex}.home-intro{max-width:680px}.eyebrow{color:var(--color-secondary);margin-bottom:8px;font-size:13px;font-weight:800}h1,h2,p{margin-top:0}h1{margin-bottom:12px;font-size:40px;line-height:1.1}p{max-width:58ch;line-height:1.7}.actions{flex-wrap:wrap;gap:12px;margin-top:24px;display:flex}.language-switcher{justify-content:flex-end;margin-bottom:16px;display:flex}.language-switcher label{color:var(--color-muted-strong);align-items:center;gap:8px;font-size:13px;font-weight:700;display:inline-flex}.language-switcher select{border:1px solid var(--color-border-strong);background:var(--color-surface);min-height:36px;color:var(--color-text);border-radius:8px;padding:0 10px}.build-info{color:var(--color-muted);margin:18px 0 0;font-size:12px;line-height:1.5}.settings-panel{width:min(100%,960px)}.settings-header{justify-content:space-between;align-items:start;gap:18px;display:flex}.settings-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:22px;display:grid}.settings-card,.settings-help article{border:1px solid var(--color-border);background:var(--color-surface-muted);border-radius:8px;min-width:0;padding:14px}.settings-card h2,.settings-help h2,.settings-help h3{margin-bottom:10px}.settings-field{color:var(--color-muted-strong);gap:8px;font-weight:700;display:grid}.settings-field select{border:1px solid var(--color-border-strong);background:var(--color-surface);min-width:0;min-height:42px;color:var(--color-text);border-radius:8px;padding:0 10px}.settings-card p{color:var(--color-muted);margin:10px 0 0;font-size:13px}.settings-card-experimental{border-color:#f4c94566}.experimental-flag{color:var(--color-warning);letter-spacing:.5px;background:#f4c9451f;border:1px solid #f4c94566;border-radius:999px;align-self:flex-start;align-items:center;margin-bottom:8px;padding:3px 10px;font-size:11px;font-weight:600;display:inline-flex}.settings-toggle{color:var(--color-muted-strong);align-items:center;gap:8px;margin-top:10px;font-weight:600;display:inline-flex}.settings-help{margin-top:22px}.settings-help-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;display:grid}.settings-help dl{gap:8px;margin:0;display:grid}.help-row{background:var(--color-surface);border-radius:8px;grid-template-columns:minmax(96px,.8fr) minmax(0,1.2fr);gap:10px;padding:10px;display:grid}.help-row dt{color:var(--color-text);font-weight:800}.help-row dd{color:var(--color-muted);margin:0}.home-grid{grid-template-columns:minmax(220px,.9fr) repeat(2,minmax(220px,1fr));align-items:stretch;gap:12px;margin-top:24px;display:grid}.home-profile-card,.home-action-card{border:1px solid var(--color-border);background:var(--color-surface-muted);border-radius:8px;align-content:start;gap:10px;min-width:0;padding:14px;display:grid}.home-profile-card h2,.home-action-card h2{margin-bottom:6px;font-size:20px}.home-profile-card p,.home-action-card p{color:var(--color-muted);margin:0;font-size:13px;line-height:1.5}.home-action-card-primary{border-color:var(--color-border-strong);background:var(--color-surface-muted);grid-column:span 2}.home-action-card-primary button{min-height:52px;font-size:16px;font-weight:800}.home-action-card a,.home-action-card button,.actions a,.actions button,.join-form button,.panel a,.game-over-panel button{justify-content:center;align-items:center;min-height:44px;padding:0 18px;text-decoration:none;display:inline-flex}.quick-match-status{border:1px solid var(--color-border-strong);background:var(--color-surface-muted);width:min(100%,320px);color:var(--color-muted-strong);border-radius:8px;gap:8px;padding:12px;display:grid}.quick-match-status p{margin:0;font-weight:700}.quick-match-status small{color:var(--color-muted)}.quick-match-status.quick-match-error{color:var(--color-danger);background:#f0607a1a;border-color:#f0607a66}.quick-match-status.quick-match-error code{color:var(--color-danger);font-size:12px}.join-form{flex-wrap:wrap;gap:8px;display:flex}.home-action-card.join-form{flex-wrap:initial;display:grid}.join-form input,.nickname-field input{border:1px solid var(--color-border-strong);border-radius:8px;min-width:140px;min-height:44px;padding:0 12px}.nickname-field{color:var(--color-muted-strong);gap:4px;display:grid}.nickname-field span{font-size:13px;font-weight:700}.nickname-field small{color:var(--color-muted);font-size:12px}.status,.hint{color:var(--color-muted);font-size:14px}.play-shell{touch-action:manipulation;grid-template-rows:1fr auto;gap:18px;min-height:100dvh;padding:18px;display:grid}.game-layout{grid-template-columns:minmax(280px,360px) minmax(220px,1fr);align-items:start;gap:18px;width:min(100%,960px);margin:0 auto;display:grid}.board-panel{border-radius:8px;justify-items:center;display:grid;position:relative}.game-canvas{aspect-ratio:1/2;border:2px solid var(--color-muted-strong);width:min(100%,360px);height:auto;max-height:calc(100vh - 190px);image-rendering:crisp-edges;touch-action:none;-webkit-user-select:none;user-select:none;background:#0f172a;border-radius:8px}.game-over-panel{color:#fff;text-align:center;background:#0f172ad1;border-radius:8px;place-content:center;gap:12px;display:grid;position:absolute;inset:18px}.side-panel{border:1px solid var(--color-border);background:var(--color-surface);border-radius:8px;gap:12px;padding:20px;display:grid;box-shadow:0 18px 40px #27615d14}.stat-row,.preview-panel{border-bottom:1px solid var(--color-surface-muted);justify-content:space-between;align-items:center;gap:12px;min-height:48px;display:flex}.preview-panel{min-height:76px}.mini-grid{background:var(--color-surface-muted);border-radius:8px;grid-template-rows:repeat(4,1fr);grid-template-columns:repeat(4,1fr);gap:2px;width:64px;height:64px;padding:4px;display:grid}.mini-grid i{background:linear-gradient(158deg, #ffffff47, #0000002e), var(--color-primary);border-radius:3px;box-shadow:inset 0 1px 1px #ffffff40,inset 0 0 0 1px #0000002e}.mobile-controls{width:min(100%,720px);padding-bottom:max(0px, env(safe-area-inset-bottom));touch-action:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;grid-template-columns:repeat(4,minmax(0,1fr));grid-template-areas:"hold rotate-ccw rotate hard""left soft soft right";gap:10px;margin:0 auto;display:grid}.mobile-controls button{border:1px solid var(--color-border-strong);border-radius:var(--radius-control);min-height:58px;color:var(--color-text);touch-action:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;background:linear-gradient(160deg,#22244ac7,#12142cd9);font-weight:700;box-shadow:inset 0 1px #ffffff1f,0 6px 14px #0006}.mobile-controls button:active,.mobile-controls button.is-pressed{filter:brightness(1.25);transform:translateY(1px)}.mobile-controls button:disabled{cursor:not-allowed;opacity:.45}.mobile-controls .move-left{grid-area:left}.mobile-controls .move-right{grid-area:right}.mobile-controls .rotate{background:linear-gradient(160deg,#7b78ff,#5a57e0);border-color:#7b78ff99;grid-area:rotate;min-height:64px}.mobile-controls .rotate-ccw{background:linear-gradient(160deg,#c265f5,#8d3fc0);border-color:#c265f599;grid-area:rotate-ccw;min-height:64px}.mobile-controls .soft-drop{grid-area:soft}.mobile-controls .hard-drop{background:linear-gradient(160deg, var(--color-danger), #a91f42);border-color:#f0607a99;grid-area:hard}.mobile-controls .hold{background:linear-gradient(160deg, var(--color-secondary), #147a6d);border-color:#34e6a880;grid-area:hold}.duel-shell{background:var(--color-surface-muted);overscroll-behavior:none;min-height:100dvh;padding:18px}.duel-header{border:1px solid var(--color-border);background:var(--color-surface);border-radius:8px;justify-content:space-between;align-items:end;gap:18px;width:min(100%,1180px);margin:0 auto 16px;padding:18px;display:flex;box-shadow:0 18px 40px #27615d14}.duel-header h1,.duel-header p{margin-bottom:0}.duel-summary{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;min-width:320px;display:grid}.duel-summary button,.debug-panel button,.duel-result-panel button{min-height:40px}.duel-grid{grid-template-columns:minmax(260px,1fr) minmax(220px,280px) minmax(260px,1fr);align-items:start;gap:14px;width:min(100%,1180px);margin:0 auto;display:grid}.online-match-grid{grid-template-columns:minmax(260px,1fr) minmax(220px,260px) minmax(260px,1fr);align-items:start;gap:14px;margin-top:16px;display:grid}.duel-player-panel,.debug-panel,.duel-result-panel{border:1px solid var(--color-border);border-radius:var(--radius-card);background:var(--color-surface);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);box-shadow:var(--shadow-glow);padding:14px}.duel-player-panel.panel-primary{border-color:var(--color-border-strong);box-shadow:var(--shadow-glow), 0 0 28px var(--color-board-glow)}.room-shell{background:var(--color-surface-muted);min-height:100dvh;padding:24px}.room-panel{border:1px solid var(--color-border);background:var(--color-surface);border-radius:8px;width:min(100%,920px);margin:0 auto;padding:20px;box-shadow:0 18px 40px #27615d14}.room-header{justify-content:space-between;align-items:start;gap:16px;display:flex}.room-header h1,.room-header p{margin-bottom:0}.room-header a,.room-header .link-button,.room-actions a,.room-actions button{justify-content:center;align-items:center;min-height:40px;padding:0 14px;text-decoration:none;display:inline-flex}.room-actions{flex-wrap:wrap;gap:10px;margin:18px 0;display:flex}.room-error{color:var(--color-danger);background:#f0607a1f;border-radius:8px;gap:10px;margin-top:16px;padding:12px;display:grid}.room-error strong{font-size:20px;display:block}.room-error code{background:#9b1c311a;border-radius:8px;width:fit-content;padding:4px 8px}.room-error-actions{flex-wrap:wrap;gap:8px;display:flex}.room-error a,.room-error button,.result-actions a,.result-actions button,.rematch-panel button{justify-content:center;align-items:center;min-height:40px;padding:0 14px;text-decoration:none;display:inline-flex}.room-feedback{color:var(--color-secondary);margin:-6px 0 14px;font-weight:700}.room-feedback.error{color:var(--color-danger);overflow-wrap:anywhere}.countdown-overlay{z-index:20;color:#fff;pointer-events:none;background:#0f172a6b;place-items:center;font-size:96px;font-weight:800;display:grid;position:fixed;inset:0}.connection-pill{font-weight:700}.connection-pill.connected{color:var(--color-secondary)}.connection-pill.closed,.connection-pill.error{color:var(--color-danger)}.room-state-card{border:1px solid var(--color-surface-muted);border-radius:8px;padding:14px}.room-status-banner,.room-ready-panel,.room-players-card{margin-top:16px}.room-status-banner{grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:10px 16px;display:grid}.room-status-banner h2,.room-ready-panel h2,.room-invite-card h2{margin-bottom:6px;font-size:22px}.room-invite-card{background:var(--color-surface-muted);grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:12px;margin-top:16px;display:grid}.room-id-line{margin:0 0 8px}.room-invite-card code{overflow-wrap:anywhere;color:var(--color-muted-strong);margin-top:6px;display:block}.invite-link-input{border:1px solid var(--color-border-strong);background:var(--color-surface);width:min(100%,520px);min-width:0;min-height:42px;color:var(--color-text);border-radius:8px;padding:0 12px}.room-card-label{color:var(--color-muted);font-size:13px;font-weight:700}.room-invite-actions{justify-items:end;gap:8px;display:grid}.room-invite-actions button{justify-content:center;align-items:center;min-height:40px;padding:0 14px;display:inline-flex}.room-state-card h2{font-size:22px}.room-ready-panel{background:var(--color-surface-muted);grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:12px;display:grid}.room-ready-panel .room-actions{justify-content:end;margin:0}.room-section-heading{justify-content:space-between;align-items:center;gap:12px;margin-bottom:10px;display:flex}.room-players{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;display:grid}.room-player-card{border:1px solid var(--color-surface-muted);border-radius:8px;padding:14px}.room-player-card h3{margin-top:0}.room-player-card-header{justify-content:space-between;align-items:start;gap:10px;display:flex}.room-player-card-header span{background:var(--color-surface-muted);color:var(--color-secondary);border-radius:999px;padding:2px 8px;font-size:12px;font-weight:800}.room-player-card code{overflow-wrap:anywhere}.duel-player-panel h2,.debug-panel h2,.duel-result-panel h2{margin-bottom:12px;font-size:22px}.duel-canvas{aspect-ratio:1/2;border:2px solid var(--color-muted-strong);width:min(100%,264px);height:auto;image-rendering:crisp-edges;touch-action:none;-webkit-user-select:none;user-select:none;background:#0f172a;border-radius:8px;margin:0 auto 12px;display:block}.duel-stats{grid-template-columns:repeat(2,minmax(0,1fr));gap:6px 12px;display:grid}.duel-stats .stat-row,.duel-summary .stat-row{min-height:36px}.clear-event-badge{color:var(--color-success);letter-spacing:0;background:#46e6ac1f;border:1px solid #46e6ac66;border-radius:8px;justify-content:space-between;align-items:center;gap:8px;margin-top:10px;padding:8px 10px;font-size:13px;font-weight:800;display:flex}.duel-previews{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:12px;display:grid}.debug-buttons{gap:8px;display:grid}.debug-buttons.compact{grid-template-columns:repeat(2,minmax(0,1fr));margin-top:14px}.debug-panel button:active,.duel-summary button:active,.duel-result-panel button:active{background:var(--color-primary);transform:translateY(1px)}.duel-result-panel{z-index:10;width:min(94vw,860px);max-height:min(88vh,760px);position:fixed;top:50%;left:50%;overflow:auto;transform:translate(-50%,-50%)}.result-layout{text-align:left;grid-template-columns:minmax(220px,.8fr) minmax(0,1.2fr);gap:14px;display:grid}.result-summary,.rematch-panel,.result-stats-section{border:1px solid var(--color-surface-muted);background:var(--color-surface-muted);border-radius:8px;min-width:0;padding:14px}.result-summary{align-content:start;gap:8px;display:grid}.result-summary h2{color:var(--color-text);font-family:var(--font-display);letter-spacing:2px;margin-bottom:4px;font-size:32px}.result-summary [data-outcome=win]{color:var(--color-success);text-shadow:0 0 24px #46e6ac8c}.result-summary [data-outcome=lose]{color:var(--color-danger);text-shadow:0 0 24px #f0607a80}.result-summary p,.rematch-panel p{margin:0}.result-stats-section{grid-row:span 2}.result-stats-section h3,.rematch-panel h3{margin-top:0;margin-bottom:10px;font-size:20px}.result-stats-scroll{max-width:100%;overflow:hidden}.result-stats-table{border-collapse:collapse;table-layout:fixed;width:100%;font-size:14px}.result-stats-table th,.result-stats-table td{border-bottom:1px solid var(--color-surface-muted);text-align:left;overflow-wrap:anywhere;padding:9px 6px}.result-stats-table thead th{color:var(--color-muted);font-size:12px}.result-stats-table tbody tr[data-is-self=true]{background:var(--color-surface-muted)}.result-stats-table tbody tr[data-is-winner=true] th{color:var(--color-success)}.result-stats-table th span{color:var(--color-muted);font-size:12px;font-weight:700;display:block}.rematch-panel{gap:12px;display:grid}.rematch-status-grid{gap:8px;display:grid}.rematch-status-grid span{background:var(--color-surface);color:var(--color-muted-strong);border-radius:8px;padding:8px 10px;font-weight:700}.rematch-status-grid span[data-requested=true]{color:var(--color-success);background:#46e6ac1a}.result-grid{text-align:left;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:12px 0;display:grid}.result-actions{justify-content:center;gap:10px;margin-top:14px;display:flex}.local-duel-mobile-controls{width:min(100%,720px);margin:16px auto 0}.board-frame{aspect-ratio:1/2;background:var(--color-board-bg);max-width:100%;max-height:100%;box-shadow:inset 0 0 0 1px var(--color-border-strong), inset 0 0 40px #0009, 0 18px 50px #00000080, 0 0 30px var(--color-board-glow);border-radius:12px;place-items:stretch stretch;display:grid;overflow:hidden}.board-frame--opponent{box-shadow:inset 0 0 0 1px var(--color-border), inset 0 0 24px #0000008c}.board-frame canvas{width:100%;max-width:none;height:100%;max-height:none}.online-playing-layout{gap:14px;margin-top:16px;display:grid}.online-playing-layout.desktop,.online-playing-layout.tablet{grid-template-columns:minmax(240px,1fr) minmax(220px,260px);align-items:start;overflow:visible}.online-playing-layout.desktop .online-boards-area,.online-playing-layout.tablet .online-boards-area{grid-template-columns:minmax(0,1fr) minmax(150px,240px);place-items:start center;gap:18px;display:grid}.board-rails{grid-template-columns:auto minmax(0,1fr) auto;place-items:stretch center;gap:10px;width:100%;display:grid}.board-rails.with-gauge{grid-template-columns:auto auto minmax(0,1fr) auto}.board-area{justify-content:center;align-items:center;display:flex;position:relative}.board-area--with-gauge{gap:6px}.garbage-gauge{border:1px solid var(--color-border-strong);background:#030a188c;border-radius:4px;flex-direction:column-reverse;flex:none;align-self:stretch;gap:2px;width:14px;min-height:60px;padding:2px;display:flex}.garbage-gauge--full{width:14px}.garbage-gauge--compact{border-radius:3px;gap:1px;width:8px}.garbage-seg{background:#96a0eb29;border-radius:1px;flex:1;box-shadow:inset 0 0 0 1px #96a0eb14}.garbage-seg-filled{background:linear-gradient(180deg, var(--color-danger), #a91f42);box-shadow:0 0 6px #f0607a99}.knockout-overlay{border-radius:var(--radius-card);color:var(--color-danger);letter-spacing:.12em;text-shadow:0 0 18px #ff5d7d99;pointer-events:none;background:#0409129e;place-items:center;font-size:clamp(28px,8vw,56px);font-weight:900;display:grid;position:absolute;inset:0}.combo-badge{border-radius:var(--radius-control);color:var(--color-warning);pointer-events:none;background:#f4b94f29;border:1px solid #f4b94f80;justify-items:center;gap:2px;padding:4px 8px;font-weight:800;line-height:1.05;display:grid;position:absolute;top:6px;left:6px}.combo-badge span{letter-spacing:.08em;font-size:10px}.combo-badge strong{font-size:18px}.play-page{grid-template-rows:auto 1fr auto}.solo-topbar{grid-template-columns:1fr auto 1fr;align-items:center;gap:12px;width:min(100%,760px);margin:0 auto;display:grid}.solo-topbar-home{justify-self:start}.solo-topbar-title{text-align:center;flex-direction:column;align-items:center;gap:2px;display:flex}.solo-topbar-name{font-family:var(--font-display);letter-spacing:.5px;color:var(--color-text);font-weight:600}.solo-topbar-status{font-family:var(--font-display);color:var(--color-accent-cyan);text-shadow:0 0 10px #2dd4ee80;font-size:12px}.solo-topbar-actions{justify-self:end;align-items:center;gap:8px;display:flex}.solo-pause-button,.solo-tilt-permission-button{border:1px solid var(--color-border-strong);border-radius:var(--radius-control);background:var(--color-surface);min-height:40px;color:var(--color-primary-hover);cursor:pointer;padding:0 16px;font-weight:600}.solo-tilt-permission-button{color:var(--color-accent-magenta)}.solo-pause-button:disabled{opacity:.45;cursor:not-allowed}.solo-pause-overlay{z-index:20;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#0707109e;justify-content:center;align-items:center;padding:24px;display:flex;position:absolute;inset:0}.solo-pause-card{border:1px solid var(--color-border-strong);border-radius:var(--radius-card);width:min(100%,300px);box-shadow:var(--shadow-card), 0 0 40px #6f6cf233;text-align:center;background:linear-gradient(165deg,#1c1e40eb,#101228f0);flex-direction:column;gap:10px;padding:24px;display:flex}.solo-pause-card h2{font-family:var(--font-display);letter-spacing:1px;margin:0 0 6px}.solo-pause-card button,.solo-pause-card .link-button{border:1px solid var(--color-border-strong);border-radius:var(--radius-control);background:var(--color-surface);min-height:46px;color:var(--color-text);cursor:pointer;font-weight:600}.solo-pause-card button:first-of-type{color:var(--color-primary-contrast);background:linear-gradient(160deg,#7b78ff,#5a57e0);border-color:#0000}.solo-board-area{flex-direction:column;align-items:center;gap:12px;width:min(100%,760px);min-height:0;margin:0 auto;display:flex}.solo-board-area .board-rails{flex:1;grid-template-rows:minmax(0,1fr);align-items:stretch;min-height:0}.solo-board-area .board-area{justify-self:stretch;width:100%;min-width:0;height:100%;min-height:0}.solo-stats{flex-wrap:wrap;justify-content:center;align-items:center;gap:14px;display:flex}@media (width<=760px){.solo-board-area{gap:8px;width:100%}.solo-board-area .board-rails{gap:6px}.solo-board-area .rail-label{display:none}.solo-board-area .hold-rail .mini-grid,.solo-board-area .next-rail .mini-grid{width:24px;height:24px}.solo-board-area .next-rail .preview-panel-compact:nth-child(n+5){display:none}.solo-stats{gap:10px;font-size:13px}}.hold-rail,.next-rail{flex-direction:column;align-items:center;gap:8px;display:flex}.rail-label{letter-spacing:.08em;color:var(--color-muted);font-size:12px;font-weight:800}.preview-panel-compact{justify-items:center;display:grid}.preview-panel-compact .mini-grid{width:44px;height:44px}.online-playing-layout.mobilePortrait,.online-playing-layout.mobileLandscape{max-width:100%;min-height:0;overflow:hidden}.online-playing-header{display:none}.online-playing-layout.mobilePortrait .online-playing-header,.online-playing-layout.mobileLandscape .online-playing-header{border:1px solid var(--color-border);background:var(--color-surface);min-height:32px;font-family:var(--font-display);color:var(--color-accent-cyan);border-radius:999px;justify-content:space-between;align-items:center;gap:8px;padding:6px 12px;font-size:12px;font-weight:700;display:flex}.online-playing-layout.mobilePortrait{height:100%;padding-bottom:calc(132px + env(safe-area-inset-bottom));grid-template-rows:auto minmax(0,1fr) auto;gap:8px;margin-top:0}.online-playing-layout.mobilePortrait .online-boards-area{grid-template-rows:auto minmax(0,1fr);justify-items:center;gap:8px;min-height:0;display:grid;overflow:hidden}.online-playing-layout.mobilePortrait .opponent-panel{order:0;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:8px;width:100%;min-width:0;padding:6px 8px;display:grid}.online-playing-layout.mobilePortrait .self-panel{order:1;align-content:center;justify-items:center;width:100%;min-width:0;min-height:0;display:grid;overflow:hidden}.online-playing-layout.mobilePortrait .self-panel .board-frame,.online-playing-layout.mobilePortrait .opponent-panel .board-frame,.online-playing-layout.mobileLandscape .self-panel .board-frame,.online-playing-layout.mobileLandscape .opponent-panel .board-frame{max-width:100%}.online-playing-layout.mobilePortrait .self-panel .duel-stats{grid-template-columns:repeat(5,minmax(0,1fr));gap:4px;font-size:11px}.online-playing-layout.mobilePortrait .self-panel .duel-stats .stat-row{text-align:center;justify-items:center;gap:2px;min-height:30px;display:grid}.online-playing-layout.mobilePortrait .opponent-panel .duel-stats,.online-playing-layout.mobilePortrait .self-panel>h2,.online-playing-layout.mobilePortrait .self-panel .clear-event-badge,.online-playing-layout.mobilePortrait .self-panel .duel-stats{display:none}.online-playing-layout.mobilePortrait .self-panel .board-rails{gap:6px}.online-playing-layout.mobilePortrait .hold-rail .mini-grid,.online-playing-layout.mobilePortrait .next-rail .mini-grid{width:26px;height:26px}.online-playing-layout.mobilePortrait .rail-label{font-size:10px}.online-playing-layout.mobilePortrait .next-rail .preview-panel-compact:nth-child(n+5){display:none}.online-playing-layout.mobilePortrait .online-controls-panel,.online-playing-layout.mobileLandscape .online-controls-panel{z-index:30;box-shadow:none;background:0 0;border:0;padding:0}.online-playing-layout.mobilePortrait .online-controls-panel h2,.online-playing-layout.mobilePortrait .online-controls-panel .stat-row,.online-playing-layout.mobileLandscape .online-controls-panel h2,.online-playing-layout.mobileLandscape .online-controls-panel .stat-row{display:none}.online-playing-layout.mobilePortrait .online-controls-panel{padding-bottom:max(10px, env(safe-area-inset-bottom));position:fixed;bottom:0;left:8px;right:8px}.online-playing-layout.mobilePortrait .online-controls-panel .mobile-controls{width:min(100%,520px)}.online-playing-layout.mobileLandscape{grid-template-rows:auto minmax(0,1fr);gap:6px;height:100%;margin-top:0;padding-right:clamp(220px,34vw,292px)}.online-playing-layout.mobileLandscape .online-boards-area{grid-template-columns:minmax(82px,.42fr) minmax(120px,.58fr);align-items:center;gap:8px;min-width:0;min-height:0;display:grid;overflow:hidden}.online-playing-layout.mobileLandscape .self-panel,.online-playing-layout.mobileLandscape .opponent-panel{justify-items:center;min-width:0;min-height:0;display:grid;overflow:hidden}.online-playing-layout.mobileLandscape .self-panel{order:2}.online-playing-layout.mobileLandscape .opponent-panel{order:1;padding:6px}.online-playing-layout.mobileLandscape .self-panel .duel-stats,.online-playing-layout.mobileLandscape .opponent-panel .duel-stats,.online-playing-layout.mobileLandscape .duel-previews{display:none}.online-playing-layout.mobileLandscape .online-controls-panel{top:max(8px, env(safe-area-inset-top));right:max(8px, env(safe-area-inset-right));bottom:max(8px, env(safe-area-inset-bottom));align-content:center;width:clamp(204px,32vw,276px);display:grid;position:fixed}.online-playing-layout.mobileLandscape .mobile-controls{grid-template-columns:repeat(2,minmax(0,1fr));grid-template-areas:"rotate-ccw rotate""hold hard""left right""soft soft";gap:8px;width:100%;padding-bottom:0}.online-playing-layout.mobileLandscape .mobile-controls button,.online-playing-layout.mobileLandscape .mobile-controls .rotate{min-height:clamp(42px,15dvh,54px)}.page-shell,.room-shell,.duel-shell,.play-shell{background:0 0}.hero,.panel,.side-panel,.duel-header,.duel-player-panel,.debug-panel,.duel-result-panel,.room-panel,.room-state-card,.home-profile-card,.home-action-card,.settings-card,.settings-help article,.result-summary,.rematch-panel,.result-stats-section{border:1px solid var(--color-border);border-radius:var(--radius-card);background:linear-gradient(180deg, #ffffff0d, #ffffff05), var(--color-surface);color:var(--color-text);box-shadow:var(--shadow-card)}.hero,.panel,.room-panel,.duel-header,.duel-result-panel{box-shadow:var(--shadow-card), var(--shadow-glow)}.home-action-card-primary{border-color:var(--color-border-strong);background:linear-gradient(135deg, #2d8cff33, #22c7a91a), var(--color-surface-strong)}.eyebrow,.connection-pill.connected,.room-feedback,.result-summary [data-outcome=win],.result-stats-table tbody tr[data-is-winner=true] th{color:var(--color-success)}.status,.hint,.build-info,.home-profile-card p,.home-action-card p,.settings-card p,.help-row dd,.room-card-label,.result-stats-table thead th,.result-stats-table th span,.quick-match-status small,.nickname-field small{color:var(--color-muted)}h1,h2,h3,.help-row dt,.result-summary h2{color:var(--color-text)}.actions a,.actions button,.join-form button,.panel a,.game-over-panel button,.home-action-card a,.home-action-card button,.room-header a,.room-header .link-button,.room-actions a,.room-actions button,.room-error a,.room-error button,.result-actions a,.result-actions button,.rematch-panel button,.room-invite-actions button,.settings-link,.link-button,.duel-summary button,.debug-panel button,.duel-result-panel button{border-radius:var(--radius-control);background:linear-gradient(135deg, var(--color-primary), #1d5fd8);color:var(--color-primary-contrast);border:1px solid #ffffff1a;font-weight:800;box-shadow:0 10px 24px #2d8cff38}.actions a:hover,.actions button:hover,.join-form button:hover,.panel a:hover,.game-over-panel button:hover,.home-action-card a:hover,.home-action-card button:hover,.room-header a:hover,.room-header .link-button:hover,.room-actions a:hover,.room-actions button:hover,.room-error a:hover,.room-error button:hover,.result-actions a:hover,.result-actions button:hover,.rematch-panel button:hover,.room-invite-actions button:hover,.settings-link:hover,.link-button:hover,.duel-summary button:hover,.debug-panel button:hover,.duel-result-panel button:hover{background:linear-gradient(135deg, var(--color-primary-hover), var(--color-primary));transform:translateY(-1px)}button:disabled,.home-action-card button:disabled,.actions button:disabled,.room-actions button:disabled,.rematch-panel button:disabled{cursor:not-allowed;opacity:.52;transform:none}.join-form input,.nickname-field input,.invite-link-input,.language-switcher select,.settings-field select{border:1px solid var(--color-border);border-radius:var(--radius-control);color:var(--color-text);background:#030a1880;box-shadow:inset 0 1px #ffffff0a}.join-form input:focus,.nickname-field input:focus,.invite-link-input:focus,.language-switcher select:focus,.settings-field select:focus{border-color:var(--color-primary-hover);outline:none;box-shadow:0 0 0 3px #54d6ff29}.language-switcher label,.settings-field,.nickname-field,.connection-pill,.quick-match-status p{color:var(--color-muted-strong)}.quick-match-status,.room-status-banner,.room-ready-panel,.room-invite-card,.room-player-card,.help-row,.rematch-status-grid span,.result-stats-table tbody tr[data-is-self=true]{border:1px solid var(--color-border);background:var(--color-surface-muted)}.room-error{color:#f0607a24;background:#ff5d7d1f;border:1px solid #ff5d7d61}.room-error strong,.room-feedback.error,.connection-pill.closed,.connection-pill.error,.result-summary [data-outcome=lose]{color:var(--color-danger)}.connection-pill.connecting,.connection-pill.idle{color:var(--color-warning)}.countdown-overlay{color:var(--color-primary-hover);text-shadow:0 0 26px #54d6ff73;background:#0409129e}.game-canvas,.duel-canvas{background:#070d17;border-color:#54d6ff99;box-shadow:0 0 0 1px #ffffff14,0 20px 42px #0000005c}.board-panel:before,.self-panel:before,.opponent-panel:before{content:"";border-radius:var(--radius-card);pointer-events:none;background:linear-gradient(135deg,#54d6ff14,#0000 48%);position:absolute;inset:0}.duel-player-panel,.board-panel{position:relative;overflow:hidden}.duel-player-panel>*,.board-panel>*{z-index:1;position:relative}.mini-grid{background:#030a1873}.clear-event-badge{color:#46e6ac1f;background:#5ce0a01f;border-color:#5ce0a070}.clear-event-badge strong{color:var(--color-success)}.mobile-controls{display:none}.online-playing-layout.playing-controls-mobile .mobile-controls{display:grid}.online-playing-layout.playing-controls-desktop .mobile-controls{display:none}.mobile-controls button{background:linear-gradient(#1b2944,#101a2d);border:1px solid #ffffff1a;box-shadow:0 10px 22px #0000003d}.mobile-controls button:active,.mobile-controls button.is-pressed{background:linear-gradient(180deg, var(--color-primary-hover), var(--color-primary))}.mobile-controls .rotate{background:linear-gradient(180deg, var(--color-primary), #1d5fd8)}.mobile-controls .hard-drop{background:linear-gradient(180deg, var(--color-danger), #a91f42)}.mobile-controls .hold{background:linear-gradient(180deg, var(--color-secondary), #147a6d)}.keyboard-hints{gap:var(--space-2);margin-top:var(--space-2);display:grid}.keyboard-hint{justify-content:space-between;align-items:center;gap:var(--space-3);border:1px solid var(--color-border);border-radius:var(--radius-control);background:var(--color-surface-muted);min-height:38px;color:var(--color-muted-strong);padding:8px 10px;display:flex}.keyboard-hint strong{color:var(--color-text);text-align:right}@media (width<=760px){body.game-lock{touch-action:none;overflow:hidden}.play-shell{height:100dvh;min-height:100dvh;max-height:100dvh;padding:max(8px, env(safe-area-inset-top)) 10px max(10px, env(safe-area-inset-bottom));touch-action:none;grid-template-rows:minmax(0,1fr) auto;gap:8px;overflow:hidden}.play-page{flex-direction:column;display:flex}.play-page-layout{flex-direction:column;flex:auto;gap:8px;min-height:0;display:flex;overflow:hidden}.solo-board-area{flex:auto;justify-content:center;align-items:center;min-height:0;display:flex;overflow:hidden}.solo-info-panel{flex:none;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px 10px;max-height:162px;padding:8px 10px;overflow:hidden}.solo-info-panel h1{grid-column:1/-1;margin-bottom:0;font-size:20px}.solo-info-panel .hint{display:none}.solo-info-panel .stat-row,.solo-info-panel .preview-panel{border-bottom:0;min-height:34px;font-size:13px}.board-shell--solo{width:min(82vw, calc((100dvh - 232px - env(safe-area-inset-bottom)) / 2));max-width:min(100%,360px);height:auto;max-height:calc(100dvh - 232px - env(safe-area-inset-bottom))}.game-over-panel{inset:8px}.mini-grid{width:36px;height:36px;padding:3px}.mobile-controls{width:100%;padding-bottom:max(10px, env(safe-area-inset-bottom));flex:none;grid-template-columns:repeat(4,minmax(0,1fr));grid-template-areas:"hold rotate-ccw rotate hard""left soft soft right";gap:8px;display:grid}.mobile-controls button,.mobile-controls .rotate{min-height:54px}.duel-shell{height:100dvh;min-height:100dvh;max-height:100dvh;padding:max(8px, env(safe-area-inset-top)) 10px max(10px, env(safe-area-inset-bottom));touch-action:none;overflow:hidden}.duel-header{flex-direction:column;align-items:stretch;gap:8px;margin-bottom:8px;padding:10px}.duel-header h1{margin-bottom:4px;font-size:20px}.duel-header p{display:none}.duel-summary{grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;min-width:0}.duel-grid,.online-match-grid{grid-template-columns:1fr}.duel-grid{gap:8px;max-height:calc(100dvh - 236px);overflow:hidden}.debug-panel{order:3}.duel-canvas{width:auto;max-width:min(100%,42dvh);height:clamp(260px,44dvh,480px);margin-bottom:8px}.duel-player-panel{padding:8px}.duel-player-panel h2,.debug-panel h2,.duel-result-panel h2{margin-bottom:6px;font-size:18px}.duel-result-panel{width:min(94vw,420px);max-height:calc(100dvh - 24px);padding:12px}.result-layout{grid-template-columns:1fr;gap:10px}.result-summary,.rematch-panel,.result-stats-section{padding:12px}.result-summary h2{font-size:28px}.result-stats-table{font-size:12px}.result-stats-table thead{display:none}.result-stats-table,.result-stats-table tbody,.result-stats-table tr,.result-stats-table th,.result-stats-table td{display:block}.result-stats-table tr{border:1px solid var(--color-surface-muted);border-radius:8px;padding:8px}.result-stats-table tr+tr{margin-top:8px}.result-stats-table th,.result-stats-table td{border-bottom:0;padding:3px 0}.rematch-panel button,.result-actions button{width:100%}.duel-player-panel:not(.self-panel,.opponent-panel):last-child{display:none}.duel-stats{gap:4px 8px;font-size:12px}.duel-stats .stat-row,.duel-summary .stat-row{min-height:28px}.duel-previews{display:none}.local-duel-mobile-controls{margin-top:8px}.room-shell{padding:10px}.room-panel{padding:12px}.home-grid{grid-template-columns:1fr}.home-top{display:grid}.home-top-actions{justify-items:stretch;min-width:0}.language-switcher{justify-content:start;margin-bottom:0}.settings-header,.settings-grid,.settings-help-grid{grid-template-columns:1fr}.settings-header{display:grid}.settings-link,.link-button{width:100%}.help-row{grid-template-columns:1fr}.home-profile-card,.home-action-card{padding:12px}.home-action-card-primary{grid-column:span 1}.room-invite-card{grid-template-columns:1fr}.room-invite-actions{justify-items:start}.room-status-banner,.room-ready-panel{grid-template-columns:1fr}.room-ready-panel .room-actions{justify-content:start}.room-ready-panel .room-actions a,.room-ready-panel .room-actions button,.room-invite-actions button{width:100%}.room-shell-playing{height:100dvh;max-height:100dvh;padding:max(6px, env(safe-area-inset-top)) 8px max(8px, env(safe-area-inset-bottom));touch-action:none;overflow:hidden}.room-panel-playing{grid-template-rows:auto minmax(0,1fr);height:100%;min-height:0;padding:8px;display:grid;overflow:hidden}.room-panel-playing .room-header,.room-panel-playing .room-actions,.room-panel-playing .room-state-summary,.room-panel-playing .waiting-card,.room-panel-playing .room-players{display:none}.online-match-grid{grid-template-rows:auto minmax(0,1fr) auto;gap:6px;min-height:0;margin-top:0;display:grid;overflow:hidden}.online-match-grid .opponent-panel{order:1;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:8px;padding:6px 8px;display:grid}.online-match-grid .opponent-panel .duel-canvas{width:auto;max-width:75px;height:clamp(96px,18dvh,150px);margin:0}.online-match-grid .opponent-panel .duel-stats,.online-match-grid .opponent-panel .duel-previews{display:none}.online-match-grid .self-panel{order:2;grid-template-rows:auto minmax(0,1fr) auto;align-content:center;min-height:0;display:grid}.online-match-grid .self-panel .duel-canvas{width:auto;max-width:min(100%,44dvh);height:min(44dvh,100dvh - 318px);min-height:230px;max-height:480px}.online-match-grid .self-panel .duel-stats{grid-template-columns:repeat(5,minmax(0,1fr));gap:4px;font-size:11px}.online-match-grid .self-panel .duel-stats .stat-row{text-align:center;justify-items:center;gap:2px;min-height:32px;display:grid}.online-controls-panel{z-index:20;box-shadow:none;background:0 0;border:0;order:3;padding:0}.online-controls-panel .mobile-controls{padding-bottom:max(10px, env(safe-area-inset-bottom))}.online-controls-panel h2,.online-controls-panel .stat-row{display:none}.room-header{flex-direction:column}.room-players{grid-template-columns:1fr}}@media (width<=760px) and (height<=680px){.play-shell{gap:6px;padding-inline:8px}.game-layout{gap:6px}.board-shell--solo{width:min(82vw, calc((100dvh - 204px - env(safe-area-inset-bottom)) / 2));max-height:calc(100dvh - 204px - env(safe-area-inset-bottom))}.side-panel{max-height:132px;padding:6px 8px}.solo-info-panel h1{font-size:18px}.solo-info-panel .stat-row,.solo-info-panel .preview-panel{min-height:28px;font-size:12px}.mini-grid{width:30px;height:30px}.mobile-controls{gap:6px}.mobile-controls button,.mobile-controls .rotate{min-height:48px}.duel-header{padding:8px}.duel-grid{max-height:calc(100dvh - 204px)}.duel-canvas{max-width:min(100%,39dvh);height:clamp(220px,40dvh,420px)}.online-match-grid .self-panel .duel-canvas{height:min(41dvh,100dvh - 286px);min-height:210px}.online-match-grid .opponent-panel .duel-canvas{height:clamp(82px,15dvh,130px)}}.board-frame>canvas.game-canvas,.board-frame>canvas.duel-canvas{width:100%;max-width:none;height:100%;max-height:none;margin:0}@media (width>=769px){body.game-lock{touch-action:manipulation;overflow:auto}.room-shell-playing,.room-panel-playing{overflow:visible}.room-panel-playing{width:min(100%,1240px)}}