/* Shared RoyalRaket theme. Presentation only: preserve layout, hidden states,
   pointer capture, progress values and the established controller bindings. */
:root{
 --rr-font:'Segoe UI',Arial,sans-serif;
 --rr-heading:'Arial Rounded MT Bold','Segoe UI',Arial,sans-serif;
 --rr-text:#f5fbff;--rr-muted:#c0e6ff;--rr-cyan:#47d3ff;--rr-gold:#ffdf28;
 --rr-edge:#69d6ff88;--rr-surface:linear-gradient(135deg,#005789f5,#00335bf5);
 --rr-button:linear-gradient(#09bdf2,#0872da);
 --rr-primary:linear-gradient(#ffe345,#ff9e19);
 --rr-shadow:inset 0 1px 0 #c2f2ff55,0 8px 24px #00274455;
 --ink:var(--rr-text);--muted:var(--rr-muted);--cyan:var(--rr-cyan);
 --lime:var(--rr-gold);--navy:#00335b;--line:var(--rr-edge);--panel:#003f68eb;
 font-family:var(--rr-font);
}
body,button,input,select,textarea{font-family:var(--rr-font)}
button,input,select,textarea{box-sizing:border-box}
:is(button,a,input,select,textarea):focus-visible{outline:3px solid var(--rr-gold);outline-offset:3px}
button:disabled{cursor:not-allowed;filter:saturate(.45);opacity:.5}
kbd{border:1px solid #90dcff88;border-bottom-width:2px;border-radius:6px;background:#00649c;color:white;font-family:var(--rr-font)}

/* In-game panels stay compact and avoid backdrop filters on the render loop. */
:is(.round-readout,.kills-readout,.player-panel,.power-panel,.objective-panel,.settings-button){
 background:var(--rr-surface);border:1px solid var(--rr-edge);border-radius:16px;
 color:var(--rr-text);box-shadow:var(--rr-shadow);
}
:is(.round-readout,.kills-readout) strong{color:var(--rr-gold);font-family:var(--rr-heading);font-weight:900}
:is(.panel-label,.ability-label,.power-panel>span,.eyebrow,.objective-panel>span,.controls-panel){color:var(--rr-muted)}
:is(.player-panel strong,.power-panel strong,.objective-panel strong){color:var(--rr-text);font-weight:800}
.ability-icon{background:linear-gradient(145deg,#09bdf2,#0665bf);border:1px solid var(--rr-edge);border-radius:12px;color:var(--rr-gold)}
.health-track,.power-track{background:#002b4e;border-radius:10px;box-shadow:inset 0 1px 3px #001b3888}
#healthBar{background:linear-gradient(90deg,#23c981,#a6f67a);border-radius:10px}
.power-track>div{background:linear-gradient(90deg,#08c5ff,#a3efff);border-radius:10px}
.health-track.regenerating #healthBar{background:linear-gradient(90deg,#21cba5,#a0ffce)!important}
.controls-panel kbd{font-size:inherit}
#recoveryText{font-family:var(--rr-font);color:#b8edff}
.island-readout{color:#e6f7ff}.island-readout b{color:#fff}
.settings-button:hover{background:var(--rr-button)}

/* Inventory colors remain semantic: no palette override of racket types. */
.racket-slot{border-radius:14px;background:var(--rr-surface);border-color:#73d6ff88;border-bottom-color:var(--racket-color);box-shadow:var(--rr-shadow)}
.racket-slot.selected{background:linear-gradient(145deg,#087aadf5,#004778f5);border-color:var(--racket-color);box-shadow:0 0 0 2px #e2faff,0 0 13px color-mix(in srgb,var(--racket-color) 45%,transparent)}
.racket-slot kbd{padding:1px 4px;background:#003b66;border-radius:5px;font-family:var(--rr-font)}
.racket-slot span{font-family:var(--rr-font);font-weight:800}
#racketStaminaRing .track{stroke:#00365ddd}
.nametag{background:#003758e8;color:#fff;border:1px solid #73d6ff66;border-radius:8px;font-family:var(--rr-font)}
.nametag i{background:#8cec8b}.nametag.regenerating i{background:#a1ffd2}
#spectatorHint,#connectionBadge{background:var(--rr-surface);border:1px solid var(--rr-edge);border-radius:14px;color:var(--rr-text);font-family:var(--rr-font);box-shadow:var(--rr-shadow)}
.event-feed .event{background:linear-gradient(120deg,#004e7bf5,#00345af5);border:1px solid #64d7ff;border-left:4px solid var(--rr-gold);border-radius:14px;color:#fff;font-family:var(--rr-font);font-weight:800;letter-spacing:.025em;box-shadow:0 5px 18px #00264266}
.event-feed .event.danger{border-color:#ff737e;border-left-color:#ff5366;color:#ffcbd0;background:linear-gradient(120deg,#543449f5,#073653f5)}
.event-feed .event.good{border-color:#62edbc;border-left-color:#70f5a9;color:#caffdf}

/* Shared dialog / pause / result surface, matching the main menu's footer. */
:is(#pauseHint,#settingsPanel,#endScreen,#authDialog,#mapDialog,#onlineLobby){
 color:var(--rr-text);background:var(--rr-surface);border:2px solid var(--rr-cyan);
 border-radius:24px;box-shadow:inset 0 2px 12px #22c9ff33,0 18px 65px #001e4a88;
 font-family:var(--rr-font);box-sizing:border-box;scrollbar-width:thin;scrollbar-color:#46c7f3 #00365c;
}
:is(#authDialog,#mapDialog,#onlineLobby)::backdrop{background:#001d43b8;backdrop-filter:blur(4px)}
:is(#pauseHint,#settingsPanel,#endScreen,#authDialog,#mapDialog,#onlineLobby) :is(h2,h3){font-family:var(--rr-heading);font-weight:900;color:white;letter-spacing:-.025em}
:is(#authDialog,#mapDialog,#onlineLobby) h2{font-size:clamp(24px,3vw,34px);text-shadow:0 3px 0 #004679}
:is(#pauseHint,#settingsPanel,#endScreen,#authDialog,#mapDialog,#onlineLobby) :is(p,label,small){color:var(--rr-muted)}
#pauseHint>strong{font-family:var(--rr-heading);color:var(--rr-gold);font-size:clamp(22px,3vw,32px);font-weight:900;text-shadow:0 2px #b87113}
#pauseHint>span{color:var(--rr-muted)}
:is(#pauseHint,#settingsPanel,#endScreen,#authDialog,#mapDialog,#onlineLobby) button{
 background:var(--rr-button);color:white;border:1px solid #8aebff;border-radius:12px;
 box-shadow:inset 0 2px 5px #ffffff44,0 3px 8px #002b5855;
 font-family:var(--rr-font);font-size:13px;font-weight:800;letter-spacing:.025em;
 cursor:pointer;transition:filter .15s,transform .15s;
}
:is(#pauseHint,#settingsPanel,#endScreen,#authDialog,#mapDialog,#onlineLobby) button:hover:not(:disabled){filter:brightness(1.12);transform:translateY(-1px)}
:is(#pauseHint,#settingsPanel,#endScreen,#authDialog,#mapDialog,#onlineLobby) button:active:not(:disabled){transform:translateY(1px)}
#pauseHint #resumeButton,#endScreen #restartButton,#authDialog #authSubmit,#mapDialog #applyMapStyle,#onlineLobby #createRoom,#onlineLobby #startOnlineMatch{
 color:#14344a;background:var(--rr-primary);border:2px solid #fff49c;
 box-shadow:inset 0 2px 6px #ffffff77,0 4px 10px #002b5877;font-weight:900;
}
#pauseHint #quitMatchButton,#onlineLobby #leaveRoom{background:linear-gradient(#66445b,#41334c);color:#ffdae0;border:1px solid #ff8c9a}
#endScreen #changeCharacterButton{background:var(--rr-button);color:white;border:1px solid #8aebff;font-weight:800}
#endScreen .result-actions{gap:24px;border-top-color:var(--rr-edge)}
#authDialog #authSwitch,#authDialog #authGuest,#onlineLobby #refreshRooms{background:#005789;color:#d9f3ff;border:1px solid #76cbef66;box-shadow:none}
:is(#settingsPanel,#authDialog,#mapDialog,#onlineLobby) input:not([type=range]):not([type=checkbox]):not([type=radio]),#settingsPanel select{
 color:white;background:#004773;border:1px solid #8bdcfa99;border-radius:10px;
 font-family:var(--rr-font);box-shadow:inset 0 2px 5px #00274466;
}
:is(#settingsPanel,#authDialog,#mapDialog,#onlineLobby) input::placeholder{color:#b4dcf3;opacity:1}
#settingsPanel select option{background:#004773;color:white}
#settingsPanel input:is([type=range],[type=checkbox]){accent-color:var(--rr-gold)}
#authDialog #authMessage{color:#ffd1d7}
.auth-heading>span,.map-dialog-top small,#roomCountdown{color:var(--rr-gold);font-weight:800}
#settingsPanel .credits-link{color:#a4eaff;text-decoration-color:#47d3ff}

/* Map destinations retain biome-specific accents and previews. */
.map-style-card{border:1px solid #80d4ff88;border-radius:18px;background:#004570}
.map-style-card:hover{box-shadow:0 4px 14px #002a4f66}
.map-style-card:has(input:checked){border-color:#fff3a1;box-shadow:0 0 0 2px var(--rr-gold),0 0 16px #ffbf3544}
.map-card-number{background:#004778d9;border:1px solid #9ce9ff77;border-radius:12px;padding:5px 9px}
.map-card-copy{background:linear-gradient(#005789,#003e69)}
.map-card-copy strong{font-family:var(--rr-heading);font-weight:900;color:#fff}
.map-card-copy>span{color:var(--rr-muted)}
.map-card-copy b{border-top-color:#77d8ff44}
#mapPreviewNote,#onlineLobby #roomMapInfo,#onlineLobby #onlineMapChoice{color:#c7eaff}
#onlineLobby #roomTitle{color:var(--rr-gold);letter-spacing:.06em}
#onlineLobby #roomMembers li{border:1px solid #6bcaf966;border-left:4px solid var(--rr-cyan);border-radius:12px;background:#00629677;color:white}
#onlineLobby #availableRooms button{width:100%;text-align:left;line-height:1.5;overflow-wrap:anywhere}
#onlineLobby #onlineStatus{color:#d7f2ff;padding:10px 12px;border-radius:12px;background:#002f5477}

/* Results: gold placement, blue statistics, readable opaque sticky headers. */
#endScreen .result-brand{font-family:var(--rr-heading);color:white;font-weight:900}
#endScreen .court-badge{color:#173747;background:var(--rr-gold);border:1px solid #fff49c;border-radius:14px;padding:6px 12px}
#endScreen #endTitle{color:var(--rr-gold);font-size:clamp(28px,4vw,52px);text-shadow:0 3px #b7740e;overflow-wrap:anywhere}
#endScreen .final-score{background:#00679a66;border:1px solid #7be1ff77;border-radius:14px}
#endScreen .final-score:first-child{background:#ffd42718;border-color:#ffe777}
#endScreen .final-score:first-child strong{color:var(--rr-gold)}
#endScreen .final-score span,#endScreen .ranking-rule{color:var(--rr-muted)}
#endScreen .ranking-scroll{border:1px solid #77d7ff88;border-radius:14px}
#endScreen .ranking-table th{background:#00547d;color:#d5f3ff;font-weight:800}
#endScreen .ranking-table td{color:#e0f3ff;border-top-color:#82ceff22}
#endScreen .ranking-table .is-you{background:#ffd52718}
#endScreen .ranking-table .is-you td{color:#fff3a3}
#endScreen .ranking-table .is-you td:first-child{box-shadow:inset 4px 0 var(--rr-gold)}

/* Runtime-created loading / graphics failure surfaces. */
#worldLoading{background:radial-gradient(ellipse at top,#087babf5,#00345af5)!important;color:#fff!important;font-family:var(--rr-heading)!important;text-shadow:0 2px 3px #003757;text-align:center;padding:24px}
#graphicsNotice{background:var(--rr-surface)!important;border:2px solid var(--rr-cyan)!important;border-radius:24px!important;box-shadow:var(--rr-shadow);font-family:var(--rr-font)}
#graphicsNotice button{padding:14px 20px;background:var(--rr-primary);color:#173747;border:2px solid #fff49c;border-radius:12px;font-weight:900;cursor:pointer}
#performanceHUD{background:#003657f2!important;color:#d2f4ff!important;border:1px solid var(--rr-edge);border-radius:12px}

@media(max-width:600px){
 :is(#authDialog,#onlineLobby,#mapDialog){max-width:calc(100vw - 24px);padding:18px;border-radius:18px}
 #endScreen .result-actions{gap:16px}
 #onlineLobby .room-actions button{min-height:44px}
}
@media(prefers-reduced-motion:reduce){
 :is(#pauseHint,#settingsPanel,#endScreen,#authDialog,#mapDialog,#onlineLobby) button,.map-style-card{transition:none;transform:none!important}
}

/* Local elimination notice: same bold display face and outlined depth as the HUD. */
#deathMessage{display:none;position:fixed;inset:0;z-index:100;place-items:center;pointer-events:none;padding:20px;box-sizing:border-box;color:#ff454f;font-family:var(--rr-heading);font-size:clamp(36px,7vw,90px);font-weight:900;line-height:1.1;text-align:center;letter-spacing:-.025em;-webkit-text-stroke:1.5px #60172a;paint-order:stroke fill;text-shadow:0 4px 0 #56152b,0 7px 20px #001a32cc}
#deathMessage.show{display:grid;animation:death-message-in .18s ease-out}
@keyframes death-message-in{from{opacity:0;scale:.94}to{opacity:1;scale:1}}
@media(prefers-reduced-motion:reduce){#deathMessage.show{animation:none}}
