:root { --settings-surface:#000; }
#settingsToggle { display:grid; place-items:center; width:44px; height:44px; padding:0; border:0; border-radius:8px; background:transparent; color:var(--xepy-blue); cursor:pointer; }
#settingsToggle:hover { background:var(--xepy-hover); color:white; }
#settingsToggle svg { display:block; width:22px; height:22px; pointer-events:none; }
.settings-backdrop { position:fixed; inset:0; z-index:11000; background:#0008; opacity:0; visibility:hidden; transition:opacity .28s ease, visibility .28s; }
.settings-backdrop.open { opacity:1; visibility:visible; }
.settings-sidebar { position:fixed; z-index:11001; inset:0 0 0 auto; width:min(360px,calc(100vw - 48px)); box-sizing:border-box; padding:24px 18px; background:var(--settings-surface); color:#fff; border-left:1px solid var(--xepy-primary); transform:translateX(calc(100% + 42px)); visibility:hidden; transition:transform .32s ease-out, visibility 0s linear .32s; display:flex; flex-direction:column; gap:22px; text-align:left; }
.settings-sidebar.open { transform:translateX(0); visibility:visible; transition-delay:0s; }
.settings-sidebar h2 { margin:0; color:var(--xepy-blue); font-size:20px; }
.settings-sidebar h3 { margin:0 0 12px; font-size:14px; }
#closeSettings { position:absolute; top:25px; left:-37px; width:37px; height:48px; border:1px solid var(--xepy-primary); border-right:0; border-radius:9px 0 0 9px; background:var(--settings-surface); color:var(--xepy-blue); font-size:26px; cursor:pointer; }
.theme-options { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.theme-options button { padding:14px 8px; font:inherit; color:#fff; background:transparent; border:1px solid var(--xepy-border); border-radius:8px; cursor:pointer; }
.theme-options button[aria-pressed="true"] { background:var(--xepy-hover); border-color:var(--xepy-blue); }
.settings-sidebar .language-switcher { display:flex; flex-direction:column; align-items:stretch; min-height:0; padding:0; border:0; background:none; box-shadow:none; }
.settings-sidebar #extraLanguageList { max-height:none; min-height:0; }
.settings-sidebar :focus-visible, #settingsToggle:focus-visible { outline:2px solid var(--xepy-blue); outline-offset:2px; }
@media(prefers-reduced-motion:reduce) { .settings-sidebar, .settings-backdrop { transition:none; } }

.theme-options button[data-theme-choice="auto"] { grid-column:1 / -1; padding:9px; font-size:13px; border-radius:3px; }
.theme-options button { border-radius:3px; }
.theme-options button.theme-auto { display:flex; align-items:center; gap:12px; padding:12px; text-align:left; }
.theme-auto > svg { flex-shrink:0; color:var(--xepy-blue); }
.theme-auto-copy { display:grid; gap:5px; min-width:0; overflow-wrap:anywhere; }
.theme-auto-copy strong { font-size:13px; }
.theme-auto-copy small { color:var(--xepy-muted); font-size:11px; line-height:1.5; }
.theme-auto-check { margin-left:auto; width:18px; height:18px; flex-shrink:0; border:1px solid var(--xepy-border); border-radius:2px; display:grid; place-items:center; }
.theme-auto[aria-pressed="true"] .theme-auto-check { border-color:var(--xepy-blue); background:var(--xepy-primary); }
.theme-auto[aria-pressed="true"] .theme-auto-check::before { content:'✓'; }
.theme-auto[aria-pressed="true"] > svg { color:#fff; }