:root {
  --vd-theme-manager-preview-height: 210px;
}
[data-reduced-motion="true"] *, [data-reduced-motion="true"] *::before, [data-reduced-motion="true"] *::after { animation-duration: .001ms !important; animation-iteration-count: 1 !important; transition-duration: .001ms !important; scroll-behavior: auto !important; }
[data-density="compact"] { --vd-control-height: 34px; --vd-content-gap: 10px; --vd-component-button-height: 34px; --vd-component-input-height: 36px; --vd-component-card-padding: 12px; }
[data-density="spacious"] { --vd-control-height: 46px; --vd-content-gap: 22px; --vd-component-button-height: 46px; --vd-component-input-height: 48px; --vd-component-card-padding: 22px; }
.vd-card { background: var(--vd-surface-raised); border: 1px solid var(--vd-line); border-radius: var(--vd-component-card-radius); padding: var(--vd-component-card-padding); box-shadow: var(--vd-shadow-soft); }
.vd-button { min-height: var(--vd-component-button-height); border-radius: var(--vd-component-button-radius); }
.setting-group input:not([type="checkbox"]):not([type="radio"]):not([type="range"]), .setting-group select, .vd-input { min-height: var(--vd-component-input-height); border-radius: var(--vd-component-input-radius); }
:where(button, a, input, select, textarea, [tabindex]):focus-visible { outline: var(--vd-component-focus-width) solid var(--vd-brand); outline-offset: 2px; }
.theme-manager-grid { display:grid; gap:16px; }
.theme-choice-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(145px,1fr)); gap:10px; }
.theme-choice { min-height:104px; display:grid; gap:8px; align-content:space-between; padding:12px; border:1px solid var(--vd-line); border-radius:var(--vd-component-card-radius); background:var(--vd-surface-raised); color:var(--vd-ink); text-align:left; cursor:pointer; }
.theme-choice:hover { border-color:var(--vd-brand); }
.theme-choice[aria-pressed="true"] { border-color:var(--vd-brand); box-shadow:0 0 0 3px var(--vd-focus); }
.theme-choice-swatches { display:flex; gap:5px; }
.theme-choice-swatches i { width:22px; height:22px; border-radius:50%; border:1px solid color-mix(in srgb, currentColor 18%, transparent); }
.theme-manager-toolbar { display:flex; flex-wrap:wrap; gap:8px; align-items:end; }
.theme-manager-toolbar .setting-group { min-width:170px; flex:1 1 170px; }
.theme-editor-layout { display:grid; grid-template-columns:minmax(0,1.3fr) minmax(260px,.7fr); gap:14px; }
.theme-token-groups { display:grid; gap:12px; max-height:620px; overflow:auto; padding-right:4px; }
.theme-token-group { border:1px solid var(--vd-line); border-radius:var(--vd-component-card-radius); overflow:hidden; }
.theme-token-group > h4 { margin:0; padding:10px 12px; background:var(--vd-surface-muted); font-size:12px; }
.theme-token-list { display:grid; grid-template-columns:repeat(auto-fit,minmax(210px,1fr)); gap:10px; padding:12px; }
.theme-token-field { display:grid; gap:5px; }
.theme-token-field label { font-size:11px; font-weight:700; }
.theme-color-control { display:grid; grid-template-columns:42px minmax(0,1fr); gap:7px; }
.theme-color-control input[type="color"] { width:42px; height:var(--vd-component-input-height); padding:3px; border:1px solid var(--vd-line); border-radius:var(--vd-component-input-radius); background:var(--vd-surface); }
.theme-preview { position:sticky; top:10px; display:grid; gap:12px; align-content:start; }
.theme-preview-stage { min-height:var(--vd-theme-manager-preview-height); display:grid; gap:10px; padding:16px; border:1px solid var(--vd-line); border-radius:var(--vd-component-card-radius); background:var(--vd-canvas); color:var(--vd-ink); }
.theme-preview-card { padding:12px; border:1px solid var(--vd-line); border-radius:var(--vd-component-card-radius); background:var(--vd-surface-raised); }
.theme-preview-actions { display:flex; gap:8px; flex-wrap:wrap; }
.theme-contrast-list { display:grid; gap:6px; }
.theme-contrast-row { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:10px; padding:7px 9px; border-radius:var(--vd-radius-sm); background:var(--vd-surface-muted); font-size:11px; }
.theme-contrast-row.is-ok strong { color:var(--vd-success); }
.theme-contrast-row.is-fail strong { color:var(--vd-danger); }
.theme-manager-status { min-height:22px; padding:8px 10px; border-radius:var(--vd-radius-sm); background:var(--vd-surface-muted); color:var(--vd-ink-secondary); font-size:11px; }
.theme-profile-list { display:grid; gap:8px; }
.theme-profile-row { display:flex; gap:8px; align-items:center; justify-content:space-between; padding:10px; border:1px solid var(--vd-line); border-radius:var(--vd-radius-sm); }
.theme-profile-row > div { min-width:0; }
.theme-profile-row small { color:var(--vd-ink-muted); }
.theme-admin-only.hidden { display:none !important; }
@media(max-width:900px){ .theme-editor-layout{grid-template-columns:1fr}.theme-preview{position:static}.theme-token-groups{max-height:none} }
@media(min-width:901px){ .settings-nav { grid-template-columns:repeat(5,minmax(0,1fr)); } }
.theme-manager-status[data-tone="success"] { color:var(--vd-success); background:var(--vd-success-soft); }
.theme-manager-status[data-tone="warning"] { color:var(--vd-warning); background:var(--vd-warning-soft); }
.theme-manager-status[data-tone="danger"] { color:var(--vd-danger); background:var(--vd-danger-soft); }
.theme-choice > span:last-child { display:grid; gap:2px; }
.theme-choice small { color:var(--vd-ink-muted); }