@font-face{font-family:Montserrat;src:url('assets/ui/Montserrat.ttf') format('truetype');font-weight:100 900;font-display:swap}
:root{--ui-bg:#011627;--ui-surface:#0B2235;--ui-text:#F9F8F8;--ui-muted:#ADB8C6;--ui-border:#2C4053;--font-heading:Montserrat,sans-serif;--font-body:Montserrat,sans-serif;--gold-primary:#FF7477;--stone-border:#2C4053}
html[data-theme=light]{color-scheme:light;--ui-bg:#F9F8F8;--ui-surface:#FFFFFF;--ui-text:#011627;--ui-muted:#657080;--ui-border:#DDE1E6;--gold-primary:#D63B3B;--stone-border:#DDE1E6}html[data-theme=dark]{color-scheme:dark}*{font-family:Montserrat,'Segoe UI',sans-serif}body{background:var(--ui-bg)!important;color:var(--ui-text);height:auto;min-height:100vh;overflow:auto}.ancient-glow{display:none}[hidden]{display:none!important}button,a,input,select{outline-offset:4px}button:focus-visible,a:focus-visible{outline:2px solid #EE3034}.app-header{height:96px;background:var(--ui-surface);border-bottom:1px solid var(--ui-border);padding:0 4%;gap:20px;box-shadow:none}.ui-brand{display:flex;gap:14px;align-items:center;color:var(--ui-text);font-size:22px;font-weight:800;text-decoration:none}.ui-brand>span{font-size:13px;letter-spacing:.015em;line-height:1.3}.ui-brand small{display:block;font-size:8px;letter-spacing:.2em;margin-top:6px;color:var(--ui-muted)}.ui-nav{display:flex;gap:25px;margin-left:auto}.ui-nav button,.ui-header-actions button,.ui-tools button{background:none;color:var(--ui-text);border:0;padding:10px 5px;font-size:12px;cursor:pointer}.ui-header-actions button{border:1px solid var(--ui-border);padding:10px 12px}.page-intro{max-width:1450px;margin:auto;padding:32px 4% 25px;display:flex;justify-content:space-between;align-items:end;gap:25px}.page-intro h1{font-size:clamp(24px,3.2vw,40px);font-weight:650;line-height:1.25;letter-spacing:-.04em;color:var(--ui-text);margin:10px 0 0}.eyebrow{font-size:9px;letter-spacing:.13em;color:var(--ui-muted)}.page-intro>p{text-align:right;font-size:12px;line-height:1.8;color:var(--ui-text)}.page-intro>p span{color:var(--ui-muted)}.app-layout{display:block;height:auto;max-width:1450px;margin:auto;padding:0 4% 35px}.game-viewport-section{padding:0;gap:0;background:none;overflow:visible}.screen-frame{flex:none;width:100%;aspect-ratio:16/9;border:1px solid var(--ui-border);border-radius:0;box-shadow:none;max-height:calc(100dvh - 250px);min-height:260px}.screen-overlay{background:var(--ui-surface);backdrop-filter:none;color:var(--ui-text);padding:25px}.screen-overlay h2{font-size:clamp(20px,3vw,32px);font-weight:600;color:var(--ui-text);text-shadow:none}.screen-overlay .subtitle{font-size:12px;color:var(--ui-muted);max-width:540px;line-height:1.8}.eye-monolith{display:none}.btn{font-size:12px;min-height:44px;border-radius:2px;text-transform:none;letter-spacing:0;box-shadow:none}.btn-gold,.btn-crimson{background:#D63B3B;border:1px solid #D63B3B;color:white}.btn-gold:hover,.btn-crimson:hover{background:#EE3034;color:white;box-shadow:none;transform:none}.rom-detect-status{font-size:11px}.btn-subtle{color:var(--ui-muted);font-size:11px}.duel-toolbar{margin:0;background:var(--ui-surface);border:1px solid var(--ui-border);border-top:0;border-radius:0;padding:9px 16px;min-height:52px}.tool-btn{font-size:11px;color:var(--ui-text);padding:8px}.ui-tools{display:flex;gap:18px;margin-left:auto}.ui-tools button{font-size:11px}.toolbar-group:empty,.toolbar-center{display:none}.sidebar-section{position:fixed;inset:0 0 0 auto;width:500px;max-width:100%;height:100dvh;z-index:110;background:var(--ui-surface);border-left:1px solid var(--ui-border);overflow:auto;box-shadow:-10px 0 50px #0003}.ui-panel-heading{display:flex;align-items:center;justify-content:space-between;padding:25px}.ui-panel-heading h2{font-size:25px;font-weight:600}.ui-panel-heading button{font-size:25px;color:var(--ui-text);background:none;border:0;cursor:pointer;width:44px;height:44px}.sidebar-tabs{position:static;display:flex;background:none;border-color:var(--ui-border);padding:0 20px;overflow:auto;flex-shrink:0}.tab-btn{font-size:11px;color:var(--ui-muted);padding:14px 10px}.tab-btn.active{color:var(--ui-text);border-color:#EE3034;background:none}.tab-content{padding:25px;overflow:visible;flex:none}.tab-content h3,.tab-content h4{color:var(--ui-text);font-size:14px}.settings-group,.panel-card,.controls-guide,.keymap-table,.mod-field{background:none;border-color:var(--ui-border);box-shadow:none}.ctrl-tip,.ui-note,.setting-slider,.setting-toggle,.keymap-row,.mod-field label{color:var(--ui-muted);font-size:12px;line-height:1.8}.ui-note{margin-bottom:22px;padding:14px;background:var(--ui-bg);border-left:2px solid #657080}.tab-content input,.tab-content select{accent-color:#D63B3B}.tab-content select,.tab-content input[type=number],kbd{background:var(--ui-bg);color:var(--ui-text);border:1px solid var(--ui-border);padding:6px;border-radius:2px}.btn-stone{background:var(--ui-bg);color:var(--ui-text);border:1px solid var(--ui-border)}.ui-veil{position:fixed;inset:0;background:#01162799;z-index:100}.ui-roadmap{display:flex;align-items:center;justify-content:space-between;padding:30px 0 0;margin-top:32px;border-top:1px solid var(--ui-border);gap:25px}.ui-roadmap span{font-size:9px;letter-spacing:.1em;color:var(--ui-muted)}.ui-roadmap h2{font-size:23px;font-weight:600;margin:10px 0}.ui-roadmap p{font-size:12px;color:var(--ui-muted);line-height:1.8}.ui-tag{padding:8px 12px;border:1px solid var(--ui-border);white-space:nowrap}.ui-live{max-width:1450px;margin:0 auto;padding:0 4% 25px;font-size:11px;color:var(--ui-muted)}.game-running .page-intro{padding-top:20px;padding-bottom:18px}.game-running .page-intro h1{font-size:26px}.screen-frame:fullscreen{max-height:none;height:100%;width:100%;border:0}.screen-frame:fullscreen canvas{object-fit:contain!important}.sync-title{color:var(--ui-text)}.progress-bar-fill{background:#EE3034}
@media(max-width:760px){.app-header{height:auto;min-height:86px;padding:18px 5%;flex-wrap:wrap;gap:15px}.ui-brand{font-size:20px}.ui-brand>span{font-size:11px}.ui-nav{order:3;width:100%;justify-content:center;gap:30px}.ui-header-actions{margin-left:auto}.ui-header-actions button{font-size:10px}.page-intro{align-items:start;flex-direction:column;gap:12px;padding:24px 5%}.page-intro>p{text-align:left;font-size:11px}.app-layout{padding:0 5% 25px}.screen-frame{min-height:190px;max-height:none}.screen-overlay{padding:16px}.screen-overlay .subtitle{font-size:10px;margin:10px 0}.rom-detect-status{font-size:9px;margin:8px 0}.splash-buttons{margin:8px 0}.ui-tools{gap:8px}.ui-tools button{font-size:9px}.duel-toolbar{padding:8px}.tool-btn{font-size:9px}.ui-roadmap{align-items:start;flex-direction:column}.ui-panel-heading{padding:18px}.tab-content{padding:20px}}
:root{--font-ancient:Montserrat,sans-serif;--font-ui:Montserrat,sans-serif;--text-primary:var(--ui-text);--text-secondary:var(--ui-muted);--text-muted:var(--ui-muted);--bg-darkest:var(--ui-bg);--bg-surface:var(--ui-surface);--bg-surface-elevated:var(--ui-bg);--gold-light:var(--ui-text);--gold-dark:#D63B3B;--gold-glow:transparent;--crimson-primary:#D63B3B;--crimson-bright:#EE3034}.ui-brand:hover{color:var(--ui-text)}.game-running .ui-roadmap{display:none}.tab-content label{color:var(--ui-text)}.setting-slider input{min-width:70px}.screen-frame{flex-shrink:0}.sidebar-tabs .tab-btn{flex:1;white-space:nowrap}.screen-frame:fullscreen{max-height:none!important;min-height:0}.ui-header-actions button:hover,.ui-tools button:hover,.ui-nav button:hover{color:var(--gold-primary)}
/* Match the approved mockup rather than stretching the old splash screen. */
.app-header{position:relative;max-width:none;height:100px}.ui-brand{max-width:250px;font-size:22px}.ui-brand>span{max-width:150px;line-height:1.15}.page-intro{padding-top:38px;padding-bottom:28px;max-width:1536px}.app-layout{max-width:1536px;padding-bottom:50px}.approved-play-layout{display:grid;grid-template-columns:minmax(0,1fr) 310px;gap:28px;align-items:start}.screen-frame{max-height:none;min-height:0;aspect-ratio:16/9!important;border-top:0}.approved-game-top{display:flex;justify-content:space-between;gap:20px;padding:11px 16px;font-size:9px;letter-spacing:.08em;background:var(--ui-surface);border:1px solid var(--ui-border);border-bottom:0;color:var(--ui-muted)}.screen-overlay#start-screen{padding:0;background:#011627;overflow:hidden;border-radius:0}.approved-preview{position:absolute;max-width:none;width:148.83%;height:auto;left:-10.28%;top:-15.83%}.approved-preview-label{position:absolute;right:12px;top:12px;padding:5px 8px;font-size:9px;background:#011627d9;color:#F9F8F8}.approved-launch{background:var(--ui-surface);border:1px solid var(--ui-border);padding:23px}.approved-mode{display:flex;padding:3px;border:1px solid var(--ui-border);background:var(--ui-bg);margin-bottom:25px;align-items:center}.approved-mode>*{flex:1;text-align:center;font-size:11px;padding:9px 5px}.approved-mode>span{background:var(--ui-surface);color:var(--ui-text)}.approved-mode>button{background:none;color:var(--ui-muted);border:0;cursor:not-allowed}.approved-launch h2{font-size:28px;line-height:1.2;letter-spacing:-.035em;font-weight:600;margin:12px 0}.approved-description,.approved-session-note{font-size:12px;color:var(--ui-muted);line-height:1.8}.approved-launch #btn-play-solo{width:100%;margin:23px 0 0;padding:14px 17px;text-align:left;display:block;background:#D63B3B;color:white;border:1px solid #D63B3B;box-shadow:none;font-weight:600}.approved-launch #btn-play-solo:hover{background:#EE3034;transform:none}.approved-launch hr{margin:23px 0;border:0;border-top:1px solid var(--ui-border)}.approved-launch h3{font-size:12px;font-weight:600}.approved-launch dl{margin:10px 0 20px}.approved-launch dl>div{display:flex;justify-content:space-between;gap:10px;border-bottom:1px solid var(--ui-border);padding:9px 0;font-size:11px}.approved-launch dt{color:var(--ui-muted)}.approved-launch dd{margin:0}.approved-launch dd button{background:none;border:0;font:inherit;color:var(--ui-text);cursor:pointer}.approved-customize{width:100%;font-size:11px;color:var(--ui-text);background:none;border:1px solid var(--ui-border);padding:12px;cursor:pointer}.approved-disc-pick{display:block;margin:13px auto 0;font-size:10px!important;background:none;border:0;color:var(--ui-muted);cursor:pointer}.duel-toolbar{padding:9px 14px}.ui-tools{gap:12px}.approved-more{margin-top:42px}.approved-more>h2{font-size:26px;letter-spacing:-.035em;margin-bottom:20px;font-weight:600}.approved-tiles{display:grid;grid-template-columns:1fr 1fr;border:1px solid var(--ui-border)}.approved-tiles>button,.approved-tiles>div{position:relative;min-height:200px;padding:28px;background:var(--ui-surface);border:0;color:var(--ui-text);text-align:left;overflow:hidden}.approved-tiles>button{border-right:1px solid var(--ui-border);cursor:pointer}.approved-tiles h3{font-size:21px;font-weight:600;letter-spacing:-.035em;margin:10px 0}.approved-tiles p{font-size:11px;line-height:1.8;color:var(--ui-muted);max-width:235px}.approved-link{display:block;font-size:11px;color:var(--gold-primary);margin-top:18px}.approved-character>img{position:absolute;width:240px;right:-15px;bottom:-85px;pointer-events:none}.approved-character>h3,.approved-character>p,.approved-character>span,.approved-decks>h3,.approved-decks>p,.approved-decks>span{position:relative;z-index:1}.approved-cards{display:flex;gap:8px;position:absolute;right:-25px;bottom:30px;transform:rotate(-10deg);opacity:.55}.approved-cards img{width:78px;height:110px;object-fit:cover;border:4px solid #657080}.ui-live{padding-top:0}.game-running .page-intro{padding-top:38px;padding-bottom:28px}.game-running .page-intro h1{font-size:clamp(24px,3.2vw,40px)}.game-running .approved-more{display:block}.session-active .approved-session-note{padding-top:20px}.ui-nav{margin-left:0}.ui-header-actions{margin-left:0}
@media(min-width:1600px){.approved-play-layout{grid-template-columns:minmax(0,1fr) 345px}.approved-launch{padding:27px}.approved-character>img{right:10px}}
@media(max-width:1050px){.approved-play-layout{grid-template-columns:minmax(0,1fr) 275px;gap:20px}.approved-launch{padding:18px}.approved-tiles p{max-width:190px}.approved-character>img{right:-65px;opacity:.65}.approved-cards{right:-80px;opacity:.3}.ui-tools{gap:7px}.ui-tools button,.tool-btn{font-size:9px}}
@media(max-width:760px){.app-header{height:auto}.approved-play-layout{grid-template-columns:1fr;gap:24px}.approved-tiles{grid-template-columns:1fr}.approved-tiles>button{border-right:0;border-bottom:1px solid var(--ui-border)}.approved-character>img{right:-10px;opacity:1}.approved-launch{padding:22px}.page-intro,.game-running .page-intro{padding-top:26px;padding-bottom:24px}.approved-more{margin-top:30px}.approved-more>h2{font-size:23px}}
/* Refined invitation. Exact brand accents; no luminous shadows. */
:root{--brand-red:#EE3034;--brand-red-support:#D63B3B;--brand-petroleum:#011627;--brand-charcoal:#252525;--brand-gray:#657080;--brand-smoke:#F9F8F8;--gold-primary:#EE3034;--gold-light:var(--ui-text);--crimson-primary:#D63B3B;--crimson-bright:#EE3034;--ui-border:color-mix(in srgb,#657080 36%,#011627);--ui-muted:#AAB4C0}
html[data-theme=light]{--gold-primary:#D63B3B;--ui-muted:#657080;--ui-text:#252525;--ui-border:#DDE1E6;--ui-bg:#F9F8F8;--ui-surface:#FFFFFF}
#start-screen.screen-overlay{background:var(--brand-petroleum);border:0}.entry-invitation{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;width:100%;height:100%;padding:32px 24px;color:#F9F8F8;text-align:center}.entry-invitation:before{content:'';position:absolute;inset:16px;border:1px solid #65708035;pointer-events:none}.entry-kicker{display:flex;align-items:center;gap:10px;font-size:9px;letter-spacing:.22em;color:#AAB4C0;font-weight:500}.entry-kicker i{width:6px;height:6px;background:#EE3034;border-radius:50%}.entry-invitation h2{font-size:clamp(24px,3.1vw,44px);line-height:1.2;letter-spacing:-.04em;font-weight:650;color:#F9F8F8;margin:22px 0 14px;text-transform:none;text-shadow:none}.entry-invitation h2 span{font-weight:500}.entry-description{font-size:12px;line-height:1.8;color:#AAB4C0;max-width:370px}.entry-actions{display:flex;flex-direction:column;gap:11px;width:340px;max-width:100%;margin:28px 0 19px}.entry-actions button{display:flex!important;justify-content:space-between;align-items:center;gap:12px;width:100%;min-height:49px;padding:14px 19px;border-radius:3px;font-family:Montserrat,sans-serif;font-size:12px;font-weight:600;letter-spacing:0;cursor:pointer;box-shadow:none!important;filter:none!important;transition:background-color 180ms ease,border-color 180ms ease,transform 220ms cubic-bezier(.2,.7,.2,1)}.entry-actions #btn-play-solo{background:#D63B3B;border:1px solid #D63B3B;color:#FFFFFF;margin:0}.entry-actions #btn-play-solo:hover{background:#EE3034;border-color:#EE3034;transform:translateY(-2px)}.entry-actions #btn-play-solo>span{font-size:18px;line-height:1;transition:transform 220ms ease}.entry-actions #btn-play-solo:hover>span{transform:translateX(3px)}#entry-online{background:transparent;border:1px solid #65708080;color:#F9F8F8}#entry-online:hover{background:#65708016;border-color:#657080;transform:translateY(-2px)}#entry-online>span{font-size:9px;letter-spacing:.025em;font-weight:400;color:#AAB4C0}.entry-actions button:active{transform:translateY(0)!important}.entry-promise{font-size:10px;color:#AAB4C0;letter-spacing:.025em}.entry-promise>span{padding:0 8px;color:#657080}.entry-online-note{font-size:10px;line-height:1.8;color:#F9F8F8;margin-top:12px;max-width:340px}.approved-launch h2{font-size:24px}.approved-launch .approved-description{font-size:11px}.approved-customize{display:flex;align-items:center;justify-content:space-between;margin-top:9px;min-height:42px;border-radius:3px;transition:background-color 180ms ease,border-color 180ms ease,transform 220ms ease}.approved-customize:hover{background:color-mix(in srgb,var(--ui-muted) 8%,transparent);border-color:var(--brand-gray);transform:translateY(-1px)}.approved-customize span{transition:transform 220ms ease}.approved-customize:hover span{transform:translate(2px,-2px)}.ui-nav button,.ui-tools button,.ui-header-actions button,.tool-btn,.approved-launch dd button,.approved-disc-pick{transition:color 180ms ease,background-color 180ms ease,border-color 180ms ease;box-shadow:none!important;filter:none!important}.ui-nav button:hover,.ui-tools button:hover,.tool-btn:hover,.approved-launch dd button:hover,.approved-disc-pick:hover{color:#EE3034;background:none}.ui-header-actions button:hover{border-color:#657080;color:var(--ui-text);background:color-mix(in srgb,var(--ui-muted) 8%,transparent)}.approved-tiles>button{transition:background-color 220ms ease,transform 220ms ease;box-shadow:none!important}.approved-tiles>button:hover{background:color-mix(in srgb,var(--ui-surface) 94%,#657080);transform:none}.approved-character>img{transition:transform 350ms cubic-bezier(.2,.7,.2,1)}.approved-character:hover>img{transform:translateY(-4px)}.btn:hover{box-shadow:none!important}.approved-link{color:var(--ui-text)}.page-intro .eyebrow{color:var(--ui-muted)}.screen-frame,.approved-game-top,.approved-launch,.approved-tiles,.duel-toolbar{border-radius:3px}.entry-actions button:focus-visible{outline:2px solid #F9F8F8;outline-offset:4px}
html[data-theme=light] #start-screen.screen-overlay{background:#F9F8F8}html[data-theme=light] .entry-invitation,html[data-theme=light] .entry-invitation h2,html[data-theme=light] #entry-online,html[data-theme=light] .entry-online-note{color:#011627}html[data-theme=light] .entry-description,html[data-theme=light] .entry-kicker,html[data-theme=light] .entry-promise,html[data-theme=light] #entry-online>span{color:#657080}html[data-theme=light] .entry-actions button:focus-visible{outline-color:#011627}
@media(max-width:1050px){.entry-invitation{padding:25px 20px}.entry-invitation:before{inset:10px}.entry-invitation h2{font-size:25px;margin:14px 0 10px}.entry-kicker{font-size:8px}.entry-description{font-size:10px}.entry-actions{width:280px;margin:18px 0 13px;gap:8px}.entry-actions button{min-height:41px;padding:10px 14px;font-size:11px}.entry-promise{font-size:9px}.entry-online-note{font-size:9px;margin-top:7px}}
@media(max-width:760px){.screen-frame:has(#start-screen:not(.hidden)){aspect-ratio:auto!important;min-height:400px}.entry-invitation h2{font-size:30px;margin-top:22px}.entry-actions{margin-top:24px}.entry-actions button{min-height:47px}.entry-invitation:before{inset:12px}.entry-description{font-size:11px}.entry-kicker{font-size:9px}.approved-launch{padding:23px}.entry-promise{font-size:10px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation:none!important;transition:none!important}}
/* Reference layout: compact nav, ranking, central player and visible settings. */
body.reference-layout{background:var(--ui-bg)!important;background-image:radial-gradient(ellipse at 12% 20%,#65708018,transparent 45%),radial-gradient(ellipse at 85% 70%,#D63B3B08,transparent 50%)!important}.reference-layout .app-header{height:72px;padding:0 max(28px,calc((100vw - 1280px)/2));gap:24px;background:#01101D;border-color:#65708055}.reference-layout .ui-brand{max-width:none;gap:12px}.reference-logo{display:grid;place-items:center;width:37px;height:37px;border:1px solid #D63B3B;border-radius:11px;background:#252525;color:#F9F8F8;font-size:15px;font-weight:800}.reference-wordmark{font-size:20px!important;font-style:italic;font-weight:850;max-width:none!important;white-space:nowrap;color:#F9F8F8;letter-spacing:-.04em!important}.reference-wordmark b{color:#EE3034}.reference-wordmark small{font-size:7px!important;letter-spacing:.34em!important;font-style:normal;color:#ADB8C6;margin-top:5px}.reference-nav-info{display:flex;align-items:center;gap:22px;margin-left:auto;font-size:11px;color:#BDC4CC;white-space:nowrap}.reference-nav-info label{display:flex;align-items:center;gap:10px}.reference-nav-info select{border:1px solid #65708080;background:#011627;border-radius:8px;padding:9px 12px;color:#F9F8F8;font-size:11px;min-width:135px}.reference-device{display:flex;gap:9px;align-items:center}.reference-device i,.reference-status i{width:6px;height:6px;border-radius:50%;background:#EE3034;display:inline-block}.reference-layout .ui-header-actions button{border:1px solid #65708065;color:#BDC4CC;border-radius:7px;padding:9px 12px;font-size:10px}.reference-layout .app-layout{max-width:1850px;padding:40px 32px 30px}.reference-layout .approved-play-layout{display:grid;grid-template-columns:250px minmax(0,1fr) 370px;gap:20px;align-items:start}.reference-layout .game-viewport-section{min-width:0}.reference-layout .screen-frame{aspect-ratio:16/9!important;min-height:420px;background:#010E1A;border:1px solid #65708033;border-radius:14px;overflow:hidden}.reference-layout #start-screen{border-radius:14px;background:linear-gradient(150deg,#01101C,#011627 60%,#111820)!important}.reference-layout .entry-invitation:before{inset:16px;border-color:#65708020;border-radius:11px}.reference-layout .entry-invitation{padding:34px 25px}.reference-layout .entry-kicker{color:#EE3034;font-size:15px;letter-spacing:.3em;position:relative;width:min(500px,75%);justify-content:center}.reference-layout .entry-kicker:before,.reference-layout .entry-kicker:after{content:'';height:1px;flex:1;background:linear-gradient(90deg,transparent,#D63B3B70)}.reference-layout .entry-kicker:after{transform:rotate(180deg)}.reference-layout .entry-invitation h2{font-size:clamp(25px,2.1vw,34px);font-weight:750;letter-spacing:-.04em;line-height:1.25;margin:17px 0 11px}.reference-layout .entry-invitation h2>span{font-weight:750;display:block}.reference-layout .entry-description{font-size:13px;color:#C3CAD2}.reference-layout .entry-actions{width:360px;margin:28px 0 21px;gap:10px}.reference-layout .entry-actions button{justify-content:center;text-align:center;border-radius:8px;font-size:13px;min-height:49px;padding:13px 20px}.reference-layout #btn-play-solo{background:linear-gradient(110deg,#EE3034,#D63B3B)!important;border:1px solid #FF7D7F;color:white;box-shadow:inset 0 1px 0 #FFFFFF25!important}.reference-layout #btn-play-solo:hover{background:#EE3034!important;transform:translateY(-2px);border-color:#F9F8F8}.reference-layout #entry-online{background:#D63B3B12;border:1px solid #D63B3B8c;color:#F9F8F8}.reference-layout #entry-online:hover{background:#D63B3B29;border-color:#EE3034}.reference-layout .entry-promise{font-size:10px;color:#BCC4CE}.reference-controller-tip{display:flex;align-items:center;gap:14px;border:1px solid #D63B3B66;border-radius:9px;padding:14px 16px;margin-top:11px;background:linear-gradient(90deg,#D63B3B13,#011627);color:var(--ui-text)}.reference-controller-tip>span{font-size:23px;line-height:1;color:#EE3034}.reference-controller-tip p{font-size:11px;line-height:1.7;color:var(--ui-muted)}.reference-controller-tip strong{color:#FF8B8E;font-weight:650}.reference-status{display:flex;justify-content:space-between;padding:15px 2px 12px;font-size:10px;color:var(--ui-muted)}.reference-status>span{display:flex;align-items:center;gap:8px}.reference-layout .duel-toolbar{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;border:0;background:none;min-height:0;padding:0}.reference-layout .duel-toolbar>button{background:var(--ui-surface);border:1px solid #65708080;border-radius:8px;padding:12px 10px;color:var(--ui-text);font-size:11px;font-weight:500;min-height:40px;cursor:pointer;transition:border-color 180ms,background-color 180ms,transform 180ms}.reference-layout .duel-toolbar>button:hover{background:#D63B3B1A;border-color:#EE3034;transform:translateY(-1px)}.reference-layout .sidebar-section{position:static;inset:auto;width:auto;max-width:none;height:auto;max-height:720px;overflow:auto;border:1px solid #65708060;border-radius:14px;background:var(--ui-surface);box-shadow:none;z-index:auto;display:block}.reference-tabs{display:grid;grid-template-columns:repeat(3,1fr);border-bottom:1px solid var(--ui-border);background:#65708009;position:sticky;top:0;z-index:2;background:var(--ui-surface);border-radius:14px 14px 0 0}.reference-tab{color:var(--ui-muted);font-size:9px;font-weight:750;text-transform:uppercase;letter-spacing:.04em;padding:16px 7px;min-height:46px;border-right:1px solid #65708018;border-bottom:1px solid #65708018;position:relative;background:none;cursor:pointer}.reference-tab.active{color:var(--ui-text);background:#D63B3B0C}.reference-tab.active:after{content:'';position:absolute;height:2px;bottom:0;left:0;right:0;background:#EE3034}.reference-tab:hover{color:var(--ui-text);background:#D63B3B12}.reference-layout .tab-content{padding:20px 18px;min-height:330px;display:none}.reference-layout .tab-content.active{display:block}.reference-layout .tab-content h3{font-size:10px;letter-spacing:.09em;font-weight:700;margin:25px 0 15px;color:var(--ui-muted)}.reference-layout .settings-group{padding:0;border:0;margin:0 0 24px}.reference-layout .setting-slider{display:grid;grid-template-columns:1fr 120px 33px;gap:12px;align-items:center;margin:15px 0;padding-bottom:14px;border-bottom:1px solid var(--ui-border)}.reference-layout .setting-slider>span{font-size:11px;color:var(--ui-text)}.reference-layout input[type=range]{width:120px;accent-color:#EE3034}.reference-intro,.reference-help{font-size:11px;line-height:1.8;color:var(--ui-muted)}.reference-help{margin-top:15px}.reference-setting{display:flex;justify-content:space-between;padding:17px 0;border-bottom:1px solid var(--ui-border);font-size:11px}.reference-layout .setting-toggle{padding:13px 0;border-bottom:1px solid var(--ui-border);font-size:11px}.reference-layout input[type=checkbox]{accent-color:#EE3034;width:17px;height:17px}.reference-action,.reference-layout .btn-stone{background:#D63B3B;color:white;border:1px solid #D63B3B;border-radius:7px;padding:11px 14px;font-size:11px;cursor:pointer}.reference-action:hover,.reference-layout .btn-stone:hover{background:#EE3034;border-color:#EE3034}.reference-layout .save-buttons-row{gap:10px;flex-wrap:wrap}.reference-layout #btn-pick-custom-rom{display:block;font-size:11px!important;margin:0 0 22px;color:var(--ui-text);padding:11px 14px;border:1px solid #D63B3B;border-radius:7px;background:#D63B3B;cursor:pointer}.reference-chip{display:inline-block;padding:5px 8px;border:1px solid #D63B3B70;color:#FF8B8E;font-size:8px;border-radius:5px}.reference-ranking{padding:17px 14px 20px;border:1px solid #65708055;border-radius:13px;background:var(--ui-surface)}.reference-ranking h2{font-size:13px;line-height:1.35;font-weight:800;letter-spacing:.02em}.reference-ranking>p{font-size:10px;line-height:1.8;color:var(--ui-muted);margin-top:6px}.reference-period{display:flex;gap:6px;margin:14px 0 16px}.reference-period button{width:50%;padding:8px 5px;border:1px solid #65708075;border-radius:8px;font-size:10px;background:transparent;color:var(--ui-text);cursor:pointer;transition:background .18s,border-color .18s}.reference-period .selected{background:#EE3034;border-color:#EE3034;color:#FFFFFF}.reference-period button:hover{border-color:#EE3034}.reference-ranking table{width:100%;border-collapse:separate;border-spacing:0;border:1px solid var(--ui-border);border-radius:8px;font-size:9px;overflow:hidden}.reference-ranking th{font-size:9px;text-align:left;color:var(--ui-muted);background:#6570800D;padding:10px 6px}.reference-ranking td{padding:16px 8px;border-top:1px solid var(--ui-border);text-align:center;color:#FF8B8E;line-height:1.7}.reference-ranking .reference-help{font-size:9px;line-height:1.8;margin-top:12px}.reference-footer{display:flex;justify-content:center;align-items:center;gap:18px;margin:70px 0 10px;padding:25px;border-top:1px solid var(--ui-border);font-size:9px;color:var(--ui-muted)}.reference-footer strong{font-size:9px;letter-spacing:.05em}.reference-layout .keymap-row{font-size:10px}.reference-layout .tab-content .mod-field{font-size:11px}.reference-layout .tab-content .ctrl-tip{font-size:10px}.reference-layout .tab-content .ui-note{display:none}.reference-layout .ui-veil{display:none!important}
html[data-theme=light] .reference-layout .app-header{background:#FFFFFF}html[data-theme=light] .reference-wordmark{color:#011627}html[data-theme=light] .reference-nav-info,html[data-theme=light] .reference-device,html[data-theme=light] .reference-layout .ui-header-actions button{color:#657080}html[data-theme=light] .reference-nav-info select{background:#F9F8F8;color:#252525}html[data-theme=light] .reference-layout #start-screen{background:linear-gradient(145deg,#FFFFFF,#F9F8F8)!important}html[data-theme=light] .reference-layout .entry-description,html[data-theme=light] .reference-layout .entry-promise{color:#657080}html[data-theme=light] .reference-layout #entry-online{color:#011627}html[data-theme=light] .reference-controller-tip{background:#D63B3B08}html[data-theme=light] .reference-controller-tip strong,html[data-theme=light] .reference-ranking td,html[data-theme=light] .reference-chip{color:#D63B3B}
@media(max-width:1500px){.reference-layout .approved-play-layout{grid-template-columns:210px minmax(0,1fr) 330px;gap:16px}.reference-layout .app-layout{padding:32px 24px}.reference-layout .entry-invitation h2{font-size:28px}.reference-layout .screen-frame{min-height:390px}.reference-nav-info{gap:15px}.reference-layout .entry-actions{max-width:85%;width:320px}}
@media(max-width:1200px){.reference-layout .approved-play-layout{grid-template-columns:minmax(0,1fr) 320px}.reference-ranking{display:none}.reference-layout .screen-frame{min-height:380px}.reference-layout .app-header{padding:0 25px}.reference-layout .entry-invitation h2{font-size:27px}.reference-layout .entry-description{font-size:11px}.reference-layout .reference-device{font-size:10px}.reference-layout .tab-content{padding:18px 15px}}
@media(max-width:800px){.reference-layout .approved-play-layout{grid-template-columns:1fr}.reference-layout .app-layout{padding:22px 16px}.reference-layout .app-header{height:auto;min-height:76px;padding:15px 18px;flex-wrap:wrap;gap:14px}.reference-nav-info{gap:10px}.reference-nav-info label{display:none}.reference-wordmark{font-size:16px!important}.reference-layout .ui-header-actions button{font-size:9px;padding:8px}.reference-device{font-size:9px}.reference-layout .screen-frame,.reference-layout .screen-frame:has(#start-screen:not(.hidden)){min-height:360px;aspect-ratio:16/9!important}.reference-layout .entry-invitation h2{font-size:29px}.reference-layout .sidebar-section{max-height:650px}.reference-layout .entry-actions{width:320px;max-width:90%}.reference-layout .entry-actions button{min-height:47px}.reference-controller-tip p{font-size:10px}.reference-footer{margin-top:35px;flex-direction:column;gap:9px}.reference-layout .entry-invitation{padding:25px}.reference-layout .setting-slider{grid-template-columns:1fr 120px 33px}}
.reference-tab{border:0;border-right:1px solid #65708018;border-bottom:1px solid #65708018;outline-offset:-4px}.reference-tab:last-child{grid-column:1/-1;min-height:32px;padding:9px;color:var(--ui-text);background:#D63B3B08}.reference-tab:last-child.active{background:#D63B3B18}.reference-tab:focus-visible{outline:2px solid #EE3034}.reference-layout .setting-slider{grid-template-columns:minmax(70px,1fr) 120px 30px}.reference-layout .setting-slider input[type=range]{margin:0}.reference-layout .setting-slider #volume-val{font-size:10px}.reference-layout .reference-controller-tip>span{font-size:18px}.reference-layout .reference-action{transition:background .18s,transform .18s}.reference-layout .reference-action:hover{transform:translateY(-1px)}
/* Ambient light and proportional player fit. */
body.reference-layout{background-image:radial-gradient(ellipse at 12% 25%,#6570802B,transparent 48%),radial-gradient(ellipse at 77% 44%,#D63B3B17,transparent 48%),radial-gradient(ellipse at 50% 0%,#65708015,transparent 55%)!important}.reference-layout .reference-ranking,.reference-layout .sidebar-section{background:linear-gradient(140deg,color-mix(in srgb,var(--ui-surface) 94%,#F9F8F8),var(--ui-surface) 40%,color-mix(in srgb,var(--ui-surface) 98%,#D63B3B));box-shadow:inset 0 1px 0 #F9F8F80A,0 12px 35px #00000012}.reference-layout .screen-frame{box-shadow:0 16px 48px #00000035,inset 0 1px 0 #F9F8F808}.reference-layout #start-screen{background:radial-gradient(ellipse at 50% 48%,#65708022,transparent 65%),radial-gradient(ellipse at 50% 100%,#D63B3B15,transparent 65%),linear-gradient(150deg,#01101C,#011627)!important}.reference-layout #btn-play-solo{box-shadow:inset 0 1px 0 #FFFFFF45,0 5px 22px #EE303425!important}.reference-layout #btn-play-solo:hover{box-shadow:inset 0 1px 0 #FFFFFF55,0 7px 28px #EE30343D!important}.reference-layout #entry-online{background:linear-gradient(180deg,#F9F8F80A,#D63B3B08);box-shadow:inset 0 1px 0 #F9F8F80D!important}.reference-layout .reference-controller-tip{background:linear-gradient(110deg,#D63B3B18,#6570800B);box-shadow:inset 0 1px 0 #F9F8F80A}.reference-layout .duel-toolbar>button{background:linear-gradient(180deg,color-mix(in srgb,var(--ui-surface) 93%,#657080),var(--ui-surface));box-shadow:inset 0 1px 0 #F9F8F807!important}.reference-layout #canvas{object-fit:contain!important}.reference-layout.game-running .screen-frame{min-height:0;aspect-ratio:var(--player-aspect,16/9)!important}.reference-layout .screen-frame:fullscreen{aspect-ratio:auto!important;min-height:0;max-height:none;height:100dvh;width:100vw}html[data-theme=light] .reference-layout #start-screen{background:radial-gradient(ellipse at 50% 90%,#EE303409,transparent 60%),linear-gradient(145deg,#FFFFFF,#F9F8F8)!important}
.reference-layout .duel-toolbar>button{background:linear-gradient(110deg,#EE3034,#D63B3B);border:1px solid #EE3034;color:#FFFFFF;font-weight:600;box-shadow:inset 0 1px 0 #FFFFFF25,0 4px 16px #EE303414!important}.reference-layout .duel-toolbar>button:hover{background:#EE3034;border-color:#FF7D7F;color:#FFFFFF;box-shadow:0 6px 20px #EE30342B!important;transform:translateY(-1px)}.reference-layout .duel-toolbar>button:active{transform:translateY(0)}.reference-nav-info select{min-width:175px}.reference-nav-info label{display:flex!important}@media(max-width:800px){.reference-nav-info{order:3;width:100%;justify-content:space-between;margin:0}.reference-nav-info select{min-width:165px}.reference-layout .ui-header-actions{margin-left:auto}}
