html { color-scheme: light; }
/* Store preferences build on the same semantic tokens as the application. */
html[data-font="system"] { --font: 'Segoe UI', 'Malgun Gothic', system-ui, sans-serif; }
html[data-font="serif"] { --font: Georgia, 'Batang', 'Times New Roman', serif; }
html[lang="ko"][data-font="inter"] { --font: 'Inter', 'Malgun Gothic', 'Apple SD Gothic Neo', sans-serif; }
.sidebar { height: 100dvh; min-height: 0; overflow: hidden; }
.sidebar > .brand, .sidebar > .nav-label, .sidebar > .sidebar-foot { flex-shrink: 0; }
.sidebar > .nav { min-height: 0; overflow-y: auto; overscroll-behavior: contain; scrollbar-width: thin; scrollbar-color: var(--side-muted) var(--side-bg); }
.sidebar > .nav > * { flex-shrink: 0; }
.settings-form-card { max-width: 760px; }
.settings-form-card .card-body { padding: 24px; gap: 20px; }
.settings-form-actions { display: flex; justify-content: flex-end; padding-top: 4px; }
.confirm-action-modal { max-width: 460px; }
.confirm-action-modal .modal-foot { background: var(--surface); }
.topbar-preference-form { display: inline-flex; margin: 0; }
.topbar-preference-form .btn { min-width: 44px; min-height: 44px; }

.language-switch { position: relative; isolation: isolate; display: grid; grid-template-columns: 1fr 1fr; align-items: center; width: 112px; min-height: 44px; padding: 4px; border: 1px solid var(--border); border-radius: 24px; background: var(--surface-2); color: var(--muted); font: inherit; font-size: 12px; font-weight: 600; cursor: pointer; }
.language-switch::before { content: ''; position: absolute; z-index: -1; inset: 4px auto 4px 4px; width: calc(50% - 4px); border-radius: 20px; background: var(--surface); box-shadow: 0 1px 3px rgba(0,0,0,.16); transition: transform 160ms ease-out; }
.language-switch[data-language="ko"]::before { transform: translateX(100%); }
.language-switch[data-language="en"] [lang="en"], .language-switch[data-language="ko"] [lang="ko"] { color: var(--text); }
.language-switch:hover { border-color: var(--border-strong); }
@media (prefers-reduced-motion: reduce) { .language-switch::before { transition: none; } }
