.settings-page { background:radial-gradient(ellipse at 18% 18%,color-mix(in srgb,var(--accent) 7%,transparent),transparent 50%),var(--paper); }
body.settings-page[data-site-chrome="bluerabbit"]:not([data-lobby-layout]) > .settings-header.site-header { display:grid; grid-template-columns:minmax(0,1fr) auto 44px; align-items:center; min-height:60px; padding:8px max(20px,calc((100% - var(--site-width))/2)); gap:8px; }
.settings-header .brand { margin-inline-end:auto; }
body.settings-page[data-site-chrome="bluerabbit"] .settings-header .brand { gap:7px; }
body.settings-page[data-site-chrome="bluerabbit"] .settings-header .brand-logo { width:34px; height:34px; }
body.settings-page[data-site-chrome="bluerabbit"] .settings-header .brand > .lobby-brand-wordmark { font-size:17px; }
body.settings-page[data-site-chrome="bluerabbit"] .settings-header .brand > .lobby-brand-wordmark > span { font-size:13px; }
.settings-header .settings-back { min-height:44px; gap:6px; padding:8px 12px; }
.settings-header .sound-toggle { width:44px; height:44px; padding:10px; }
.settings-back > svg { flex:none; width:18px; height:18px; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
.settings-back > span { font-size:12px; line-height:1.4; }
.settings-main { position:relative; z-index:1; flex:1; width:min(100%,500px); margin:0 auto; padding:18px 16px 28px; }
.settings-card { display:grid; grid-template-columns:minmax(0,1fr) 150px; align-items:center; gap:12px 14px; min-width:0; padding:18px; border:1px solid var(--line); border-radius:16px; background:var(--surface); box-shadow:0 18px 42px var(--theme-shadow); }
.settings-heading { display:flex; align-items:center; gap:8px; min-width:0; margin:0; }
.settings-icon { display:grid; place-items:center; flex:none; width:30px; height:30px; border:1px solid color-mix(in srgb,var(--accent) 30%,transparent); border-radius:9px; background:color-mix(in srgb,var(--accent) 9%,transparent); color:var(--accent); }
.settings-icon svg { width:18px; height:18px; fill:none; stroke:currentColor; stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round; }
.settings-heading h1 { min-width:0; margin:0; font-size:22px; line-height:1.2; letter-spacing:-.4px; overflow-wrap:anywhere; }
.settings-language.language-control { display:flex; flex-direction:column; align-items:stretch; gap:4px; min-width:0; padding:0; border:0; }
.settings-language > label { min-width:0; color:var(--muted); font-size:11px; font-weight:600; line-height:1.3; overflow-wrap:anywhere; }
.settings-language > select { flex:auto; width:100%; max-width:100%; min-width:0; min-height:44px; padding:8px 10px; border:1px solid var(--line); border-radius:9px; background:var(--theme-field); color:var(--ink); font:16px/1.4 var(--body); cursor:pointer; }
.settings-language > select:focus-visible { outline:2px solid var(--accent); outline-offset:4px; }
.settings-page .streamer-display-panel { grid-column:1/-1; min-width:0; margin:0; padding-top:12px; }
.settings-page .streamer-display-panel h2 { font-size:13px; line-height:1.5; }
.settings-games { grid-column:1/-1; min-width:0; margin:0; padding-top:12px; border-top:1px solid var(--line); }
.settings-games > h2 { margin:0; font-size:14px; font-weight:600; line-height:1.5; }
.settings-games-description { margin:12px 0 0; color:var(--muted); font-size:12px; line-height:1.7; }
.settings-games .advanced-game-options { grid-template-columns:repeat(2,minmax(0,1fr)); margin-top:18px; }
.settings-games .advanced-game-option { border-color:var(--line); background:var(--theme-field); }
.settings-games .advanced-game-option:hover,.settings-games .advanced-game-option:has(input:checked) { border-color:color-mix(in srgb,var(--accent) 50%,var(--line)); background:color-mix(in srgb,var(--accent) 7%,var(--surface)); }
.settings-games .advanced-game-option:has(input:disabled) { grid-column:1/-1; }
html[dir="rtl"] .settings-back > svg { transform:scaleX(-1); }
@media(max-width:600px) {
  body.settings-page[data-site-chrome="bluerabbit"]:not([data-lobby-layout]) > .settings-header.site-header { padding:6px 12px; min-height:56px; }
  body.settings-page[data-site-chrome="bluerabbit"] .settings-header .brand-logo { width:30px; height:30px; }
  body.settings-page[data-site-chrome="bluerabbit"] .settings-header .settings-back { width:44px; height:44px; padding:10px; }
  .settings-back > span { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; border:0; }
  .settings-main { padding:12px 12px 24px; }
  .settings-card { grid-template-columns:minmax(0,1fr) 128px; gap:12px; padding:16px; border-radius:14px; }
  .settings-heading h1 { font-size:20px; }
  .settings-games .advanced-game-options { grid-template-columns:minmax(0,1fr); }
}
@media(max-width:380px) {
  .settings-card { grid-template-columns:minmax(0,1fr) 112px; gap:12px 10px; padding:14px; }
  .settings-icon { display:none; }
}

.streamer-platform-grid { display:grid; grid-template-columns:minmax(0,1fr); gap:0; margin-top:8px; border:1px solid var(--line); border-radius:10px; background:var(--theme-field,var(--paper)); overflow:hidden; }
.streamer-platform-card { min-width:0; padding:0 10px; border:0; border-radius:0; background:transparent; }
.streamer-platform-card + .streamer-platform-card { border-top:1px solid var(--line); }
.settings-page .streamer-platform-card .streamer-mode-option { display:flex; align-items:center; gap:10px; min-height:44px; margin:0; padding:2px 0; border:0; background:transparent; }
.streamer-platform-card[data-streamer-platform="twitch"] { --streamer-platform-color:#bc95ff; }
.streamer-platform-card[data-streamer-platform="youtube"] { --streamer-platform-color:#ff6970; }
.streamer-platform-card[data-streamer-platform="kick"] { --streamer-platform-color:#a1ed61; }
.streamer-setting-icon { display:grid; place-items:center; flex:none; width:20px; height:20px; color:var(--streamer-platform-color); }
.streamer-setting-icon svg { width:18px; height:18px; }
.streamer-platform-copy { display:grid; align-content:center; gap:2px; flex:1; min-width:0; }
.streamer-platform-card .streamer-mode-title { display:block; flex:none; font-size:13px; line-height:1.3; }
.settings-page .streamer-platform-card .streamer-mode-state { min-height:0; margin:0; color:var(--muted); font-size:10px; font-weight:400; line-height:1.35; }
.streamer-platform-card .streamer-mode-state:empty,.streamer-platform-card .streamer-mode-state[data-state="none"] { display:none; }
.settings-page .streamer-platform-card input.streamer-mode-switch { appearance:none; -webkit-appearance:none; position:relative; display:block; flex:none; width:36px; height:20px; min-width:36px; margin:0 0 0 auto; padding:0; border:1px solid var(--line); border-radius:999px; background:color-mix(in srgb,var(--muted) 22%,var(--surface)); cursor:pointer; transition:background .15s,border-color .15s; }
.settings-page .streamer-platform-card input.streamer-mode-switch::before { content:""; position:absolute; inset-inline-start:2px; top:2px; width:14px; height:14px; border-radius:50%; background:var(--ink); transition:transform .15s,background .15s; }
.settings-page .streamer-platform-card input.streamer-mode-switch:checked { border-color:var(--streamer-platform-color); background:var(--streamer-platform-color); }
.settings-page .streamer-platform-card input.streamer-mode-switch:checked::before { transform:translateX(16px); background:#101126; }
.settings-page .streamer-platform-card input.streamer-mode-switch:focus-visible { outline:2px solid var(--streamer-platform-color); outline-offset:3px; }
.settings-page .streamer-platform-card input.streamer-mode-switch:disabled { cursor:wait; opacity:.55; }
.settings-page .streamer-platform-card .streamer-request { display:flex; width:fit-content; max-width:calc(100% - 34px); min-height:36px; margin:0 0 2px 34px; padding:5px 6px; border:0; border-radius:6px; background:transparent; color:var(--streamer-platform-color); box-shadow:none; font-size:11px; line-height:1.35; white-space:normal; text-align:start; }
html[dir="rtl"] .settings-page .streamer-platform-card input.streamer-mode-switch { margin:0 auto 0 0; }
html[dir="rtl"] .settings-page .streamer-platform-card input.streamer-mode-switch:checked::before { transform:translateX(-16px); }
html[dir="rtl"] .settings-page .streamer-platform-card .streamer-request { margin:0 34px 2px 0; }
@media(prefers-reduced-motion:reduce) { .settings-page .streamer-platform-card input.streamer-mode-switch,.settings-page .streamer-platform-card input.streamer-mode-switch::before { transition:none; } }