@font-face{font-family:"Endboss Display";src:url("anton.ttf") format("truetype");font-style:normal;font-weight:900;font-display:swap}
/* Three visual skins share the same markup, wording, controls and game rules. */
.audio-controls .theme-setting{display:flex;align-items:center;gap:10px;margin:0;flex:0 0 224px;width:224px;max-width:100%;min-height:44px;padding:0 10px;border:1px solid var(--line);border-radius:8px;background:var(--p);font-size:12px;color:var(--txt)}
.audio-controls .theme-setting label{font-size:inherit;font-weight:700;min-height:0;flex:0 0 auto}
.theme-setting #visualTheme{flex:1;min-width:0;width:100%;height:42px;min-height:42px;padding:7px 4px;background:transparent;color:inherit;border:0;border-radius:0;font:inherit;cursor:pointer}
.theme-setting:focus-within{outline:2px solid var(--cyan);outline-offset:2px}
.theme-setting #visualTheme:focus-visible{outline:none}
.audio-controls #audioMute{min-height:44px}
#lobbyPresentation .audio-controls .theme-setting{grid-column:1 / -1}
body.playing .lobby-presentation .audio-controls{justify-content:flex-start;padding:12px 0;gap:10px 16px}
@media(max-width:650px){.audio-controls .theme-setting{width:100%;flex-basis:100%}}
@media(min-width:651px){body:not(.match-live) #lobbyPresentation .audio-controls{display:flex;align-items:center}body:not(.match-live) #lobbyPresentation .audio-controls label:has(input[type=range]){flex:0 1 230px}body:not(.match-live) #lobbyPresentation .audio-controls input[type=range]{width:90px}}
html[data-theme="arcade"]{color-scheme:light;--bg:#eeeadd;--p:#f7f3e8;--line:#b7b4a5;--txt:#20211e;--dim:#5c6055;--cyan:#435d12;--red:#b93826}
html[data-theme="endboss"]{color-scheme:dark;--bg:#160d20;--p:#24132d;--line:#614268;--txt:#f3efe4;--dim:#c3b2c9;--cyan:#e4ff39;--red:#ff758e}
html[data-theme="arcade"] body,html[data-theme="arcade"] body.arena-theme{background:radial-gradient(#20211e0b .7px,transparent .7px),#eeeadd;background-size:6px 6px;color:var(--txt)}
html[data-theme="arcade"] body::before,html[data-theme="arcade"] body::after{display:none}
html[data-theme="arcade"] header{border-bottom:2px solid #20211e}
html[data-theme="arcade"] h1,html[data-theme="arcade"] .landing header h1{font-family:'Arial Black',Arial,sans-serif;font-style:normal;letter-spacing:-.05em}
html[data-theme="arcade"] .hero-copy h2{font-style:normal;font-weight:950;letter-spacing:-.06em;text-shadow:none}
html[data-theme="arcade"] .hero-copy h2 em{display:inline-block;background:#fb572d;color:#fff7e9;padding:0 8px;transform:rotate(-2deg);text-shadow:none}
html[data-theme="arcade"] .hero-kicker{color:#7d321f}
html[data-theme="arcade"] :is(button,.hero-play,.mode-link,.page-nav a){border-radius:3px;border:1px solid #20211e;box-shadow:3px 3px 0 #20211e;font-weight:850}
html[data-theme="arcade"] button:not(:disabled),html[data-theme="arcade"] .hero-play{background:#20211e;color:#e3f291}
html[data-theme="arcade"] :is(.multiplayer-play,.mode-link,.page-nav a){background:#f7f3e8!important;color:#20211e!important}
html[data-theme="arcade"] :is(.landing .mode-cards section,.connect,.solo-card,.roomline,.room-roster,.roster-seat,.round-summary,.host-dialog,.quick-guide,.lobby-presentation,.home-learn,.home-name,.host-settings,.public-rooms,.room-row){background:#f7f3e8;border-color:var(--line);border-radius:4px;color:var(--txt);box-shadow:none}
html[data-theme="arcade"] :is(input,select){background:#fffdf6;color:#20211e;border-color:#86887c;border-radius:3px}
html[data-theme="arcade"] :is(.status,.roomline #connection,.creator-support span,.hero-description,.host-dialog p){color:var(--dim)}
html[data-theme="arcade"] :is(.check,.effects-setting,.solo-options label,.typing-settings,.join-code-panel){background:#e7e3d7;border-color:var(--line);color:var(--txt)}
html[data-theme="arcade"] .round-metrics>div{background:#e7e3d7}
html[data-theme="arcade"] .round-outcome.victory{background:#d6f26755;border-color:#758342;color:#354b0a}
html[data-theme="arcade"] .showcase-room strong{color:#6b351f}
/* Keep the battlefield dark so white, red and orange retain their meaning. */
html[data-theme="arcade"] :is(.field,.home-preview,.core-panel){--txt:#f3f5e8;--dim:#bbc4ae;--cyan:#d6f267;--line:#5c6851;background:#1c231a;color:var(--txt);border-color:#657451;border-radius:4px}
html[data-theme="arcade"] :is(.field .word,.preview-words .word){color:#f3f5e8;background:#33402b;border-color:#7d8d6c}
html[data-theme="arcade"] :is(.field .word.red,.preview-words .word.red){color:#ffc0b0;background:#572c27;border-color:#ff886a}
html[data-theme="arcade"] :is(.field .word.counterwave-word,.preview-words .word.counterwave-word){color:#ffe3ac;background:#654321;border-color:#ffb861}
html[data-theme="endboss"] body,html[data-theme="endboss"] body.arena-theme{background:radial-gradient(ellipse at 80% 15%,#62283a66,transparent 50%),repeating-linear-gradient(0deg,transparent 0 3px,#ffffff03 4px),#160d20;color:var(--txt)}
html[data-theme="endboss"] body::before{opacity:.25}html[data-theme="endboss"] body::after{opacity:.35;filter:hue-rotate(105deg)}
html[data-theme="endboss"] :is(h1,.landing header h1,.hero-copy h2){font-family:'Endboss Display',Impact,'Arial Black',system-ui,sans-serif;font-style:italic;text-transform:uppercase;letter-spacing:-.025em}
html[data-theme="endboss"] .hero-copy h2{font-size:clamp(50px,6.2vw,88px);line-height:.95;text-shadow:3px 3px 0 #160d20}
html[data-theme="endboss"] .hero-copy h2 em{color:#e4ff39;text-shadow:3px 4px 0 #160d20,5px 6px 0 #737e22}
html[data-theme="endboss"] :is(button,.hero-play,.mode-link,.page-nav a){border-radius:2px;border:1px solid #83628c;box-shadow:3px 3px 0 #100819}
html[data-theme="endboss"] button:not(:disabled),html[data-theme="endboss"] .hero-play{background:#e4ff39;color:#160d20}
html[data-theme="endboss"] :is(.multiplayer-play,.mode-link,.page-nav a){background:#321a3c!important;color:#f3efe4!important;border-color:#a56383!important}
html[data-theme="endboss"] :is(.landing .mode-cards section,.connect,.solo-card,.roomline,.room-roster,.roster-seat,.round-summary,.host-dialog,.quick-guide,.lobby-presentation,.home-learn,.home-name,.host-settings,.public-rooms,.room-row){background:#24132d;border-color:#614268;border-radius:3px}
html[data-theme="endboss"] :is(input,select){background:#1b1025;color:#f3efe4;border-color:#82618c;border-radius:2px}
html[data-theme="endboss"] :is(.field,.home-preview,.core-panel){background:linear-gradient(140deg,#301734,#190f25);border-color:#88506c;border-radius:3px}
html[data-theme="endboss"] .round-metrics>div{background:#190f25}
html[data-theme="endboss"] .hero-actions .hero-play:first-child{box-shadow:4px 4px 0 #ff3a56}
html[data-theme="endboss"] .home-hero{position:relative;isolation:isolate}
html[data-theme="endboss"] .home-preview{position:relative;z-index:1;background:#24132deb;box-shadow:8px 8px 0 #100819;border-top:3px solid #ff3a56}
html[data-theme="endboss"] .hero-copy{position:relative;z-index:2}

@media(prefers-reduced-motion:reduce){html[data-theme] :is(button,.hero-play){transition:none}}
/* Keep alternate skins complete without changing gameplay contrast or selection cues. */
html[data-theme="arcade"] :is(.preview-field,.preview-input){background:#182016;border-color:#657451;border-radius:2px}
html[data-theme="arcade"] .model-word{background:#33402b;border-color:#7d8d6c;color:#f3f5e8;border-radius:2px}
html[data-theme="arcade"] .model-word.demo-attack,html[data-theme="arcade"] .model-word.demo-defend{background:#572c27;color:#ffc0b0;border-color:#ff886a}
html[data-theme="arcade"] :is(.preview-tokens span,.model-notice){background:#293323;border-color:#657451;color:#e3f291}
html[data-theme="arcade"] :is(.inventory,.typing,.help,.round-summary .round-focus,.creator-support a){background:#e7e3d7;color:#20211e;border-color:#b7b4a5}
html[data-theme="arcade"] :is(.mode-buttons,.preview-modes,#targetButtons) button[aria-pressed="false"]{background:#f7f3e8;color:#20211e}
html[data-theme="arcade"] :is(.mode-buttons,.preview-modes,#targetButtons) button[aria-pressed="true"]{background:#d6f267;color:#20211e;border:2px solid #20211e;box-shadow:2px 2px 0 #20211e}
html[data-theme="arcade"] :is(button,a,input,select,summary):focus-visible{outline:3px solid #b93826;outline-offset:3px}
html[data-theme="arcade"] body.contrast-words .field .word{background:#07111e;border-color:#b7c9dd;color:white}
html[data-theme="arcade"] body.contrast-words .field .word.red{background:#301020;border-color:#ffa5b5;color:white}
html[data-theme="arcade"] body.contrast-words .field .word.red.counterwave-word{background:#351d08;border-color:#ffc37d;color:white;border-style:dashed}
html[data-theme="endboss"] :is(.preview-field,.preview-input,.model-notice){background:#1b1025;border-color:#704379;border-radius:2px}
html[data-theme="endboss"] .preview-tokens span{background:#382141;border-color:#88506c}
html[data-theme="endboss"] :is(.mode-buttons,.preview-modes,#targetButtons) button[aria-pressed="false"]{background:#321a3c;color:#f3efe4}
html[data-theme="endboss"] :is(.mode-buttons,.preview-modes,#targetButtons) button[aria-pressed="true"]{background:#e4ff39;color:#160d20;border:2px solid #ff3a56}
html[data-theme="arcade"] body #lobbyPresentation,html[data-theme="arcade"] body #connect .lobby-section{background:#f7f3e8;color:#20211e;border-color:#b7b4a5}
html[data-theme="arcade"] body #connect #lobbyDescription{color:#5c6055}
html[data-theme="arcade"] body #lobbyPresentation :is(.effects-setting,.typing-settings){background:#e7e3d7;color:#20211e;border-color:#b7b4a5}
html[data-theme="arcade"] .lobby-heading h3,html[data-theme="arcade"] .preferences-summary,html[data-theme="arcade"] .timer{color:#20211e}
html[data-theme="endboss"] body #lobbyPresentation,html[data-theme="endboss"] body #connect .lobby-section{background:#24132d;color:#f3efe4;border-color:#614268}
html[data-theme="endboss"] body #lobbyPresentation :is(.effects-setting,.typing-settings){background:#321a3c;border-color:#614268}
@media(max-width:700px){html[data-theme="endboss"] .hero-copy h2{font-size:clamp(44px,11vw,68px)}.theme-setting{max-width:none}}

html[data-theme="arcade"] .mode-tag{color:#5c6055}
/* Spectators and eliminated players use their own browser's skin, including
   secondary boards, watch controls, overlays and post-match reports. */
html[data-theme="arcade"]{--selected-target-bg:#d6f267;--watch-glow:#435d1255;--result-scrim:#182016ed}
html[data-theme="endboss"]{--selected-target-bg:#e4ff39;--watch-glow:#e4ff3955;--result-scrim:#190f25ed}
html[data-theme="arcade"] .field.enemy{border-color:#93614f}
html[data-theme="endboss"] .field.enemy{border-color:#a56383}
html:is([data-theme="arcade"],[data-theme="endboss"]) .field.watch-selectable:hover{box-shadow:0 0 0 1px var(--watch-glow)}
html:is([data-theme="arcade"],[data-theme="endboss"]) .match-result{background:var(--result-scrim)}
html:is([data-theme="arcade"],[data-theme="endboss"]) .match-result.defeat strong{color:var(--red)}
html:is([data-theme="arcade"],[data-theme="endboss"]) .fieldtitle small{color:var(--dim)}
html[data-theme="arcade"] .round-outcome.eliminated{color:#98351f;border-color:#b9382680;background:#b9382610}
html[data-theme="endboss"] .round-outcome.victory{color:#e4ff39;border-color:#e4ff3980;background:#e4ff3910}
html[data-theme="endboss"] .round-outcome.eliminated{color:#ff9caf;border-color:#ff758e80;background:#ff758e10}
html[data-theme="arcade"] .hp{background:#d1d0c2}
html[data-theme="arcade"] .blue{background:linear-gradient(90deg,#7f9b32,#435d12)}
html[data-theme="endboss"] .hp{background:#54395e}
html[data-theme="endboss"] .blue{background:linear-gradient(90deg,#aabb27,#e4ff39)}
html[data-theme="arcade"] body.mobile-game.match-live.match-settings #lobbyPresentation[open]{background:#f7f3e8;color:#20211e;border-color:#b7b4a5}
html[data-theme="endboss"] body.mobile-game.match-live.match-settings #lobbyPresentation[open]{background:#24132d;color:#f3efe4;border-color:#614268}
html[data-theme="arcade"] #targetButtons button[aria-pressed="true"]{background:#d6f267;color:#20211e}
html[data-theme="endboss"] #targetButtons button[aria-pressed="true"]{background:#e4ff39;color:#160d20}
html[data-theme="arcade"] #gameSettings{background:#e7e3d7;color:#20211e;border-color:#86887c}
html[data-theme="endboss"] #gameSettings{background:#321a3c;color:#f3efe4;border-color:#82618c}
html[data-theme="endboss"] .timer{color:#f3efe4}
html[data-theme="arcade"] .audio-controls .theme-setting{border-radius:3px}
html[data-theme="endboss"] .audio-controls .theme-setting{border-radius:2px}
/* Shared component palette: each skin owns surfaces and interaction states. */
html[data-theme="arcade"]{--skin-panel:#f7f3e8;--skin-inset:#e7e3d7;--skin-edge:#b7b4a5;--skin-ink:#20211e;--skin-muted:#5c6055;--skin-disabled:#dedbce;--skin-radius:3px;--skin-accent:#435d12;--skin-danger:#98351f;--skin-scrim:#20211e99;--skin-success:#edf2d5}
html[data-theme="endboss"]{--skin-panel:#24132d;--skin-inset:#321a3c;--skin-edge:#614268;--skin-ink:#f3efe4;--skin-muted:#c3b2c9;--skin-disabled:#45304e;--skin-radius:2px;--skin-accent:#e4ff39;--skin-danger:#ff9caf;--skin-scrim:#100819cc;--skin-success:#343c19}
html:is([data-theme="arcade"],[data-theme="endboss"]) body :is(.quick-guide,.solo-sound,.host-settings,.typing-settings,.effects-setting,.solo-options label,.solo-basics span,.host-format-hint,.typing-info p,.stats-info){background:var(--skin-panel);color:var(--skin-ink);border-color:var(--skin-edge);border-radius:var(--skin-radius)}
html:is([data-theme="arcade"],[data-theme="endboss"]) body.room-waiting .host-settings{background:var(--skin-panel)}
html:is([data-theme="arcade"],[data-theme="endboss"]) :is(.typing-info>summary,.stats-info-button)::before{background:var(--skin-inset);border-color:var(--skin-edge)}
html:is([data-theme="arcade"],[data-theme="endboss"]) .typing-info p{color:var(--skin-muted)}
html:is([data-theme="arcade"],[data-theme="endboss"]) body :is(.host-dialog-heading button,.lobby-heading-actions .secondary-action,.lobby-help button,.lobby-help a,.audio-controls button){background:var(--skin-inset);color:var(--skin-accent);border-color:var(--skin-edge);border-radius:var(--skin-radius)}
html:is([data-theme="arcade"],[data-theme="endboss"]) body button:disabled{background:var(--skin-disabled);color:var(--skin-muted);border-color:var(--skin-edge);box-shadow:none}
html:is([data-theme="arcade"],[data-theme="endboss"]) body .shell :is(button,input,select,.check,.roster-seat,.room-roster,.round-summary,.round-metrics>div,.round-outcome,.room-row,.public-rooms,.host-dialog,.solo-card,.core-panel,.solo-basics span,.token){border-radius:var(--skin-radius)}
html:is([data-theme="arcade"],[data-theme="endboss"]) input{accent-color:var(--skin-accent)}
html:is([data-theme="arcade"],[data-theme="endboss"]) .roster-seat{background:var(--skin-panel);border-color:var(--skin-edge)}
html:is([data-theme="arcade"],[data-theme="endboss"]) .roster-seat.ready{border-color:var(--skin-accent)}
html:is([data-theme="arcade"],[data-theme="endboss"]) :is(.token,.counterwave-control,.counter-track){background:var(--skin-inset);color:var(--skin-ink);border-color:var(--skin-edge)}
html:is([data-theme="arcade"],[data-theme="endboss"]) .token.blank{color:var(--skin-muted)}
html:is([data-theme="arcade"],[data-theme="endboss"]) .keyboard-row button:not(:disabled){background:var(--skin-inset);color:var(--skin-ink);border-color:var(--skin-edge)}
html:is([data-theme="arcade"],[data-theme="endboss"]) .keyboard-row button:not(:disabled):active{background:var(--skin-accent);color:var(--bg)}
html:is([data-theme="arcade"],[data-theme="endboss"]) :is(.lobby-error,.roster-kick){color:var(--skin-danger)}
html:is([data-theme="arcade"],[data-theme="endboss"]) .solo-card .record-banner{background:var(--skin-success);color:var(--skin-accent);border-color:var(--skin-accent);border-radius:var(--skin-radius)}
html:is([data-theme="arcade"],[data-theme="endboss"]) .core-panel progress{accent-color:var(--skin-accent)}
html:is([data-theme="arcade"],[data-theme="endboss"]) .core-art i{box-shadow:none}
html:is([data-theme="arcade"],[data-theme="endboss"]) .core-art i:nth-child(2){border-color:var(--red)}
html:is([data-theme="arcade"],[data-theme="endboss"]) .solo-backdrop:not([hidden]),html:is([data-theme="arcade"],[data-theme="endboss"]) .host-dialog::backdrop{background:var(--skin-scrim)}
html:is([data-theme="arcade"],[data-theme="endboss"]) :is(button,a,input,select,summary):focus-visible{outline-color:var(--skin-accent)}
html:is([data-theme="arcade"],[data-theme="endboss"]) :is(.hero-play,.mode-link,.page-nav a,.lobby-help a):hover{border-color:var(--skin-accent)}
/* Neon: cyan leads; violet, pink and amber add restrained interface accents.
   Word colors and danger/attack cues deliberately retain their gameplay meaning. */
html[data-theme="classic"]{--neon-violet:#bdabff;--neon-pink:#ff9bc7;--neon-amber:#ffd38a}
html[data-theme="classic"] .hero-play.multiplayer-play{border-color:#ad6596;background:linear-gradient(135deg,#30213d,#17283d)}
html[data-theme="classic"] .hero-play.multiplayer-play>span:first-child{color:var(--neon-pink)}
html[data-theme="classic"] .solo-mode-card h3{color:var(--neon-violet)}
html[data-theme="classic"] .duel-mode-card h3{color:var(--neon-pink)}
html[data-theme="classic"] .solo-mode-card .mode-link{border-color:#7965ab}
html[data-theme="classic"] .duel-mode-card .mode-link{border-color:#a35c87}
html[data-theme="classic"] .home-learn{border-color:#977d4f;background:linear-gradient(110deg,#30271955,#0b172a)}
html[data-theme="classic"] .home-learn strong,html[data-theme="classic"] .home-learn a{color:var(--neon-amber)}
html[data-theme="classic"] :is(.home-settings,.solo-sound,#lobbyPresentation){box-shadow:inset 3px 0 0 #a98bff80}
html[data-theme="classic"] #musicVolume{accent-color:var(--neon-violet)}
html[data-theme="classic"] .theme-setting{border-color:#78659e}
html[data-theme="classic"] .room-row.showcase-room{border-color:#7965ab;background:linear-gradient(120deg,#24203d,#102737)}
html[data-theme="classic"] .showcase-room strong{color:var(--neon-violet)}
html[data-theme="classic"] .round-metrics>div:nth-child(1) strong{color:var(--neon-violet)}
html[data-theme="classic"] .round-metrics>div:nth-child(3) strong{color:var(--neon-amber)}
html[data-theme="classic"] .solo-basics span:nth-child(2) b{color:var(--neon-violet)}
html[data-theme="classic"] .solo-basics span:nth-child(3) b{color:var(--neon-pink)}
/* Carry the Neon palette into hosted rooms, with cyan reserved for readiness. */
html[data-theme="classic"] .roomline{border-color:#665486;background-image:linear-gradient(115deg,#201d36,#152238 62%,#22203a)}
html[data-theme="classic"] #roomBadge{color:var(--neon-violet)}
html[data-theme="classic"] #copy{background:#332a50;color:#e0d5ff;border:1px solid #8d77b6}
html[data-theme="classic"] #copyInvite{background:#40243b;color:#ffd4e8;border:1px solid #ad6596}
html[data-theme="classic"] #leave{background:#332435;color:#ffc0d3;border:1px solid #a5607f}
html[data-theme="classic"] #hostSettings>b{color:var(--neon-amber)}
html[data-theme="classic"] #roomRoster{border-color:#69578e;background:linear-gradient(135deg,#1c1b32,#0b172a 70%)}
html[data-theme="classic"] .roster-seat{border-color:#766096;background:linear-gradient(125deg,#252139,#152238)}
html[data-theme="classic"] .roster-seat strong{color:#dfd3ff}
html[data-theme="classic"] .roster-seat.open{border-color:#87734f;background:linear-gradient(125deg,#28251e77,#0b172a)}
html[data-theme="classic"] .roster-seat.open strong{color:var(--neon-amber)}
html[data-theme="classic"] .roster-seat.ready{border-color:var(--cyan)}
html[data-theme="classic"] .roster-seat.ready strong{color:var(--cyan)}
html[data-theme="classic"] :is(.seat-actions,.roster-controls) button:not(:disabled):not(.roster-kick){background:#393050;color:#e0d5ff;border:1px solid #9279ba}
html[data-theme="classic"] .seat-actions select{border-color:#887448}
html[data-theme="classic"] .roster-kick{background:#40243b;color:#ffd4e8;border-color:#ad6596}
/* Match Royale's new panel to each skin's existing corner treatment. */
html[data-theme="arcade"] .royale-panel{border-radius:3px}
html[data-theme="endboss"] .royale-panel{border-radius:2px}
/* Shared arcade surfaces across the menu, lobby, Solo and Word Relay. */
:root{--arena-radius:14px;--arena-space:20px}
.mode-header{gap:20px}
.mode-header .sub{line-height:1.6}
.landing .mode-cards section,.connect,.solo-card,.city-game,.host-dialog{border-radius:var(--arena-radius);border-color:var(--line);background:var(--p);color:var(--txt)}
.landing .mode-cards section{box-shadow:inset 0 3px 0 color-mix(in srgb,var(--cyan) 65%,transparent),0 12px 32px #0002}
.landing .mode-cards .duel-mode-card{box-shadow:inset 0 3px 0 var(--red),0 12px 32px #0002}
.menu-primary{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:15px 18px;min-height:50px;margin-top:18px;background:var(--cyan);border:1px solid var(--cyan);border-radius:8px;color:var(--bg);font-size:14px;font-weight:900;text-decoration:none;box-shadow:0 0 22px color-mix(in srgb,var(--cyan) 18%,transparent)}
.menu-primary.multiplayer-primary{background:color-mix(in srgb,var(--cyan) 10%,var(--p));color:var(--cyan)}
.menu-primary:hover{filter:brightness(1.12)}
.menu-primary:focus-visible{outline:3px solid var(--txt);outline-offset:4px}
.landing .mode-cards a.menu-primary{color:var(--bg)}
.landing .mode-cards a.multiplayer-primary{color:var(--cyan)}
.landing .home-hero>.home-preview{box-shadow:0 0 34px color-mix(in srgb,var(--cyan) 10%,transparent);border-color:color-mix(in srgb,var(--cyan) 45%,var(--line))}
.city-game{background:var(--p);color:var(--txt);box-shadow:inset 0 3px 0 var(--cyan),0 14px 40px #0002}
.relay-heading{display:flex;justify-content:space-between;align-items:center;gap:16px;border-bottom:1px solid var(--line);padding-bottom:18px;margin-bottom:18px}
.relay-heading h2{margin:6px 0 0;font-size:28px;letter-spacing:-.03em}
.relay-heading .mode-tag{font-size:10px;letter-spacing:.13em;color:var(--cyan)}
.relay-mark{font-size:22px;font-weight:900;color:var(--cyan);white-space:nowrap}
.relay-players{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0 20px}
.relay-player{padding:8px 10px;border:1px solid var(--line);border-radius:7px;font-size:11px;color:var(--dim);overflow-wrap:anywhere;max-width:100%}
.relay-player.active{border-color:var(--cyan);color:var(--cyan);background:color-mix(in srgb,var(--cyan) 10%,var(--p))}
.relay-player.eliminated{text-decoration:line-through;opacity:.6}
.city-prompt{color:var(--cyan);letter-spacing:-.025em;line-height:1.2;margin:26px 0}
#cityClock{font-variant-numeric:tabular-nums;font-weight:700}
#cityForm label{font-size:12px;color:var(--dim)}
#cityAnswer{background:var(--bg);color:var(--txt);border-color:var(--line);text-transform:none}
#cityAnswer:focus{outline:2px solid var(--cyan);outline-offset:2px}
#cityError{color:var(--red)}
#chainFairPlayNote{border-left:2px solid var(--cyan);padding:8px 12px;line-height:1.6;color:var(--dim)}
#hostSettings label:has(select),#hostSettings label:has(input[type=number]){display:flex;gap:8px;align-items:center;flex-wrap:wrap}
#hostSettings select,#hostSettings input[type=number]{max-width:200px;font-size:12px;padding:8px}
.solo-card h2,.connect h2{letter-spacing:-.025em}
.solo-card #startSolo{min-height:48px;box-shadow:0 0 20px color-mix(in srgb,var(--cyan) 15%,transparent)}
@media(max-width:650px){.relay-heading h2{font-size:24px}.relay-mark{font-size:18px}.city-game{padding:18px 14px}.city-prompt{font-size:clamp(24px,7vw,36px)}.mode-header{gap:12px}.menu-primary{padding:13px 15px}}