/* Personal immersive skins. Layout, photos and game state are never changed. */
:root[data-palette=vice]{--bg:#100f20;--panel:#1e1b33;--panel2:#2d2746;--input:#151426;--line:#51416c;--accent:#79e2db;--accentInk:#102f33;--yellow:#f8b7d5;--yellowInk:#3d1935;--ink:#fbf5ff;--muted:#c7b7d3;--radius:22px;--premium-art:url('themes/vice-city.svg');--premium-glow:#c95c9f}
:root[data-palette=throne]{--bg:#101921;--panel:#1c2933;--panel2:#2b3b47;--input:#14212b;--line:#4c5d65;--accent:#d4be85;--accentInk:#302612;--yellow:#b9d7e1;--yellowInk:#1d3035;--ink:#f2f2ed;--muted:#b7c1c6;--radius:9px;--premium-art:url('themes/throne.svg');--premium-glow:#8daebd}
:root[data-palette=shinobi]{--bg:#151e2a;--panel:#202938;--panel2:#303c4c;--input:#192230;--line:#4b5766;--accent:#efb181;--accentInk:#392619;--yellow:#e9c47b;--yellowInk:#342818;--ink:#f8f1e8;--muted:#bfc7d8;--radius:16px;--premium-art:url('themes/shinobi.svg');--premium-glow:#d88746}
:root[data-theme=light][data-palette=vice]{--bg:#f5eff7;--panel:#fffbff;--panel2:#f0e2f2;--input:#f8f1fa;--line:#d7c3df;--accent:#236c70;--accentInk:#fff;--yellow:#eec0d9;--yellowInk:#4b2039;--ink:#34233b;--muted:#6f5b79}
:root[data-theme=light][data-palette=throne]{--bg:#e9eef0;--panel:#fafbfc;--panel2:#dfe7eb;--input:#eff3f5;--line:#bccbd0;--accent:#705b2b;--accentInk:#fff;--yellow:#d9bf85;--yellowInk:#382a15;--ink:#243540;--muted:#596976}
:root[data-theme=light][data-palette=shinobi]{--bg:#f5eee4;--panel:#fffcf6;--panel2:#efe2d1;--input:#faf3e9;--line:#dcc7ac;--accent:#965522;--accentInk:#fff;--yellow:#e6b96c;--yellowInk:#3e2b15;--ink:#31271e;--muted:#6f5945}
:root[data-theme-tier=premium] body{isolation:isolate;background:radial-gradient(ellipse at 85% 0%,color-mix(in srgb,var(--premium-glow) 17%,transparent),transparent 55%),var(--bg)}
:root[data-theme-tier=premium] body:before{position:fixed;inset:0 0 auto;height:100vh;height:100lvh;background-image:var(--premium-art);background-position:center bottom;background-size:cover;background-repeat:no-repeat;opacity:.9;pointer-events:none;z-index:-1}
:root[data-theme=light][data-theme-tier=premium] body:before{opacity:.35}
:root[data-theme-tier=premium] .panel,:root[data-theme-tier=premium] dialog,:root[data-theme-tier=premium] #lobby .lobby-layout{background:linear-gradient(155deg,color-mix(in srgb,var(--premium-glow) 7%,var(--panel)),var(--panel) 65%);border-color:color-mix(in srgb,var(--accent) 31%,var(--line));box-shadow:0 14px 45px #0002}
:root[data-theme-tier=premium] .home-play,:root[data-theme-tier=premium] .home-how{background:linear-gradient(150deg,color-mix(in srgb,var(--premium-glow) 10%,var(--panel)),var(--panel) 78%)}
:root[data-theme-tier=premium] #lobby .lobby-people,:root[data-theme-tier=premium] #lobby .lobby-options{background:transparent;box-shadow:none}
:root[data-theme-tier=premium] .room-mode-card,:root[data-theme-tier=premium] .v36-pace-buttons{border-color:color-mix(in srgb,var(--accent) 21%,var(--line))}
:root[data-theme-tier=premium] .room-mode-card.selected{background:linear-gradient(145deg,color-mix(in srgb,var(--accent) 13%,var(--input)),var(--input));box-shadow:inset 0 0 0 1px var(--accent-soft)}
:root[data-theme-tier=premium] .eyebrow{color:var(--accent);letter-spacing:2px}
/* Vice City: tropical neon and rounded two-tone frames. */
:root[data-palette=vice] .button.primary{background:linear-gradient(110deg,#fac6df,#e6bbf6);color:var(--yellowInk);box-shadow:0 3px 0 #8d517f,0 5px 18px #ed8ccb14}
:root[data-palette=vice] .button.accent{background:linear-gradient(110deg,#79e2db,#b7efe5);color:#102f33;box-shadow:0 3px 0 #367f82}
:root[data-palette=vice] .topbar{border-bottom:1px solid color-mix(in srgb,var(--accent) 14%,transparent)}
:root[data-palette=vice] .home-title>.eyebrow{letter-spacing:3px}
:root[data-palette=vice] .profile-picker{border-color:#f1a1d0;box-shadow:0 0 0 5px #ee91cd14,0 0 24px #86e0dd18}
:root[data-palette=vice] #lobby .lobby-layout{border-radius:22px}
:root[data-palette=vice] .room-mode-card.selected{border-color:#8ee7e0}
/* Trono de Gelo: engraved borders and restrained fantasy headings. */
:root[data-palette=throne] :is(.panel-title h2,.heading h1,.home-how h2,.device-setup-head h1,#themeDialog h2){font-family:Georgia,'Times New Roman',serif!important;font-weight:700;letter-spacing:.01em}
:root[data-palette=throne] .button{border-radius:7px;border:1px solid color-mix(in srgb,var(--accent) 35%,var(--line));box-shadow:inset 0 1px 0 #fff2,0 3px 0 #0003}
:root[data-palette=throne] .button.primary{background:linear-gradient(145deg,var(--yellow),color-mix(in srgb,var(--yellow) 84%,var(--accent)));color:var(--yellowInk)}
:root[data-palette=throne] .topbar{border-bottom:1px solid color-mix(in srgb,var(--accent) 27%,transparent)}
:root[data-palette=throne] #lobby .lobby-layout,:root[data-palette=throne] .home-play,:root[data-palette=throne] .home-how{border-radius:10px;box-shadow:inset 0 0 0 3px var(--panel),inset 0 0 0 4px color-mix(in srgb,var(--accent) 12%,transparent),0 14px 45px #0002}
:root[data-palette=throne] .room-mode-card,:root[data-palette=throne] .universe-trigger{border-radius:7px}
/* Vila Shinobi: ink frames and a static warm sunset. */
:root[data-palette=shinobi] .button.primary{border-radius:10px;background:linear-gradient(125deg,var(--yellow),color-mix(in srgb,var(--yellow) 68%,var(--accent)));color:var(--yellowInk);box-shadow:0 3px 0 color-mix(in srgb,var(--yellowInk) 58%,var(--bg))}
:root[data-palette=shinobi] .button.accent{box-shadow:0 3px 0 color-mix(in srgb,var(--accentInk) 75%,var(--bg))}
:root[data-palette=shinobi] .home-play,:root[data-palette=shinobi] .home-how,:root[data-palette=shinobi] #lobby .lobby-layout{border-width:2px;border-color:color-mix(in srgb,var(--accent) 30%,var(--line));box-shadow:4px 5px 0 #0002}
:root[data-palette=shinobi] .eyebrow{font-weight:900;letter-spacing:2.5px}
:root[data-palette=shinobi] .room-mode-card.selected{border-color:var(--accent);box-shadow:inset 0 -3px var(--accent)}
/* Theme browser: grouped choices, an accessible modal, personal persistence. */
body #themeDialog{box-sizing:border-box;width:min(800px,calc(100% - 28px));max-height:calc(100dvh - 28px);padding:24px;border-radius:20px;overflow:hidden}
body #themeDialog[open]{display:flex;flex-direction:column}
body #themeDialog .dialog-top{flex:none;display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:17px}
body #themeDialog .dialog-top h2{font-size:25px;line-height:1.25;margin:0}
body #closeThemes{position:static;flex:0 0 36px;width:36px;height:36px;padding:7px}
.theme-tabs{flex:none;display:grid;grid-template-columns:1fr 1fr;gap:4px;border:1px solid var(--line);border-radius:12px;background:var(--input);padding:4px}
.theme-tabs button{display:flex;align-items:center;justify-content:center;gap:7px;min-height:39px;border:1px solid transparent;border-radius:8px;background:none;color:var(--muted);font:800 14px Nunito,sans-serif;cursor:pointer}
.theme-tabs button .ui-icon{width:16px;height:16px}.theme-tabs button[aria-selected=true]{color:var(--ink);border-color:var(--line);background:var(--panel2)}
.theme-category-description{flex:none;font-size:13px;line-height:1.5;color:var(--muted);margin:12px 1px 15px}
body #themeChoices{flex:0 1 auto;min-height:0;overflow-y:auto;overscroll-behavior:contain;scrollbar-gutter:stable;max-height:54dvh;padding:3px}
body #themeChoices[data-category=premium]{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
body #themeChoices .theme-choice{min-width:0;box-sizing:border-box}
/* Keep the header divider away from all controls, including the home-only bar. */
:root[data-theme-tier=premium] body.intui-ui .topbar{padding-bottom:16px;margin-bottom:12px}
/* A single clean symbol per preview: the former accent stroke crossed the icon. */
body #themeChoices .palette-swatch:before{display:none}
body #themeChoices .theme-symbol{box-sizing:border-box;flex:none;align-self:center}
body #themeChoices .theme-symbol svg{display:block;flex:none;overflow:visible}
body #themeChoices .theme-mini{min-width:0;box-sizing:border-box}
body #themeChoices .theme-choice strong{gap:7px;font-size:14px;line-height:1.35;min-height:22px}
body #themeChoices .theme-choice strong:after{flex:0 0 18px}
body #themeChoices .theme-choice small{font-size:11px;line-height:1.5}
body #themeChoices .theme-choice[data-theme-group=premium] .palette-swatch{height:138px;grid-template-columns:1fr;padding:14px;background-position:center;background-size:cover}
body #themeChoices .theme-choice[data-theme-group=premium] .theme-symbol{width:34px;height:34px;border-radius:10px;position:absolute;top:12px;left:12px}
body #themeChoices .theme-choice[data-theme-group=premium] .theme-symbol svg{width:23px;height:23px}
body #themeChoices .theme-choice[data-theme-group=premium] .theme-mini{width:62%;max-width:115px;position:absolute;right:12px;bottom:15px}
.swatch-vice{--preview-bg:#181529;--preview-panel:#28223b;--preview-accent:#79e2db;--preview-gold:#f8b7d5;background-image:linear-gradient(180deg,#a65d9940,#17142a00),url('themes/vice-city.svg')!important}
.swatch-throne{--preview-bg:#14212c;--preview-panel:#263641;--preview-accent:#d4be85;--preview-gold:#b9d7e1;background-image:url('themes/throne.svg')!important}
.swatch-shinobi{--preview-bg:#192230;--preview-panel:#2b3542;--preview-accent:#efb181;--preview-gold:#e9c47b;background-image:url('themes/shinobi.svg')!important}
:root[data-theme=light] .swatch-vice{--preview-bg:#f5eff7;--preview-panel:#fffbff;--preview-accent:#236c70;--preview-gold:#eec0d9}
:root[data-theme=light] .swatch-throne{--preview-bg:#e9eef0;--preview-panel:#fafbfc;--preview-accent:#705b2b;--preview-gold:#d9bf85}
:root[data-theme=light] .swatch-shinobi{--preview-bg:#f5eee4;--preview-panel:#fffcf6;--preview-accent:#965522;--preview-gold:#e6b96c}
.theme-footer{flex:none;display:flex;align-items:center;justify-content:space-between;gap:15px;padding-top:16px;margin-top:15px;border-top:1px solid var(--line)}
body #themeDialog .theme-footer .check-line{margin:0;min-width:0;display:flex;gap:8px;align-items:center;font-size:13px;line-height:1.5}
body #themeDialog .theme-footer>.button{min-height:39px;padding:8px 19px;font-size:13px;flex:none}
body #themeDialog>.fine-print{flex:none;font-size:11px;line-height:1.6;margin:12px 0 0;color:var(--muted)}
/* Persistent avatar entry: updates only the authenticated player's profile. */
body #lobby .lobby-avatar-button{display:inline-flex;align-items:center;justify-content:center;gap:6px;flex:none;min-height:33px;padding:4px 7px;border:1px solid var(--line);border-radius:10px;background:var(--input);color:var(--muted);font:750 12px Nunito,sans-serif;cursor:pointer}
body #lobby .lobby-avatar-button:hover:not(:disabled){border-color:var(--accent);color:var(--ink)}
body #lobbyAvatarPreview{display:block;flex:none;width:21px;height:23px;line-height:1}
body #lobbyAvatarPreview>.portrait-wrap{width:100%;height:100%;border-radius:5px}
body #lobby #lobbyCount{flex:none}
@media(max-width:600px){
 body #themeDialog{padding:18px;width:calc(100% - 24px);max-height:calc(100dvh - 24px);border-radius:17px}
 body #themeDialog .dialog-top{margin-bottom:14px}body #themeDialog .dialog-top h2{font-size:23px}
 body #themeChoices[data-category=premium]{grid-template-columns:1fr;gap:10px}
 body #themeChoices [data-theme-group=premium]{display:grid;grid-template-columns:112px minmax(0,1fr);grid-template-rows:auto auto;gap:0 12px;padding:9px}
 body #themeChoices .theme-choice[data-theme-group=premium] .palette-swatch{grid-row:1/3;grid-column:1;height:92px!important;padding:9px}
 body #themeChoices [data-theme-group=premium] strong{grid-column:2;grid-row:1;margin:4px 0 3px;align-self:end}
 body #themeChoices [data-theme-group=premium] small{grid-column:2;grid-row:2;margin:0 0 4px;align-self:start}
 body #themeChoices .theme-choice[data-theme-group=premium] .theme-mini{width:62%;right:8px;bottom:9px;padding:7px;gap:4px}
 body #themeChoices .theme-choice[data-theme-group=premium] .theme-symbol{width:25px;height:25px;left:8px;top:8px;border-radius:7px}
 body #themeChoices .theme-choice[data-theme-group=premium] .theme-symbol svg{width:18px;height:18px}
 .theme-category-description{font-size:12px;margin:10px 0 12px}.theme-footer{gap:10px;margin-top:12px;padding-top:12px}
 body #themeDialog>.fine-print{font-size:11px;margin-top:10px}
 :root[data-theme-tier=premium] body:before{background-size:auto 100lvh;background-position:center bottom;opacity:.65}
 :root[data-palette=vice] body:before{background-position:82% bottom}
 body #themeChoices [data-theme-group=clean] .palette-swatch{grid-template-columns:36px minmax(0,1fr);gap:8px;padding:14px 9px;height:92px!important}
 body #themeChoices [data-theme-group=clean] .theme-symbol{width:36px;height:36px;border-radius:10px}
 body #themeChoices [data-theme-group=clean] .theme-mini{padding:6px;gap:4px}
 :root[data-theme=light][data-theme-tier=premium] body:before{opacity:.24}
}
@media(max-width:360px){body #lobby .panel-title{gap:7px}body #lobby .lobby-avatar-button{padding:4px 6px}body #lobby .lobby-avatar-button>span:last-child{display:none}body #themeChoices [data-theme-group=premium]{grid-template-columns:90px minmax(0,1fr);gap:0 9px}}
@media(prefers-reduced-motion:reduce){:root[data-theme-tier=premium] *,#themeDialog *{scroll-behavior:auto!important}}