:root,
:root[data-theme="dark"] {
  color-scheme: dark;
  --swift-bg-top: #121217;
  --swift-bg-bottom: #08080f;
  --swift-card: #121212;
  --swift-elevated: #1c1c1c;
  --swift-text: #ffffff;
  --swift-secondary: #b3b3b3;
  --swift-muted: #737373;
  --swift-border: #1f1f1f;
  --swift-border-highlight: #333333;
  --swift-blue: #008cff;
  --swift-indigo: #5957d6;
  --swift-violet: #8a2be3;
  --workspace-bg: var(--swift-bg-bottom);
  --workspace-nav: #050508;
  --workspace-panel: var(--swift-card);
  --workspace-card: var(--swift-card);
  --workspace-elevated: var(--swift-elevated);
  --workspace-border: var(--swift-border);
  --workspace-text: var(--swift-text);
  --workspace-muted: var(--swift-secondary);
  --workspace-blue: var(--swift-blue);
  --workspace-purple: var(--swift-indigo);
  --workspace-violet: var(--swift-violet);
  --workspace-violet-text: #a99bff;
  --ink: var(--swift-text);
  --muted: var(--swift-secondary);
  --line: var(--swift-border);
  --cream: var(--swift-bg-top);
  --paper: var(--swift-card);
  --green: var(--swift-blue);
  --mint: color-mix(in srgb, var(--swift-blue) 18%, transparent);
  --gold: var(--swift-violet);
}
:root[data-theme="dusk"] {
  color-scheme: dark;
  --swift-bg-top: #131426;
  --swift-bg-bottom: #090a1a;
  --swift-card: #1a1c30;
  --swift-elevated: #242640;
  --swift-text: #ffffff;
  --swift-secondary: #b3b3b3;
  --swift-muted: #737373;
  --swift-border: #1f1f1f;
  --swift-border-highlight: #333333;
  --workspace-bg: var(--swift-bg-bottom);
  --workspace-nav: #090a1a;
  --workspace-panel: var(--swift-card);
  --workspace-card: var(--swift-card);
  --workspace-elevated: var(--swift-elevated);
  --workspace-border: var(--swift-border);
  --workspace-text: var(--swift-text);
  --workspace-muted: var(--swift-secondary);
}
:root[data-theme="light"] {
  color-scheme: light;
  --swift-bg-top: #f2f5fc;
  --swift-bg-bottom: #e3ebfa;
  --swift-card: #ffffff;
  --swift-elevated: #f7faff;
  --swift-text: #121726;
  --swift-secondary: #4a546b;
  --swift-muted: #788299;
  --swift-border: #d4dbea;
  --swift-border-highlight: #adbade;
  --workspace-bg: var(--swift-bg-bottom);
  --workspace-nav: #e8eef9;
  --workspace-panel: var(--swift-card);
  --workspace-card: var(--swift-card);
  --workspace-elevated: var(--swift-elevated);
  --workspace-border: var(--swift-border);
  --workspace-text: var(--swift-text);
  --workspace-muted: var(--swift-secondary);
  --workspace-violet-text: #6551c8;
}
html, body { background: linear-gradient(180deg, var(--swift-bg-top), var(--swift-bg-bottom)) fixed; color: var(--swift-text); }
.app-shell { background: linear-gradient(180deg, var(--swift-bg-top), var(--swift-bg-bottom)); }
aside { background: var(--swift-bg-bottom); color: var(--swift-text); border-right: 1px solid var(--swift-border); }
.brand>span, .stage-controls .play { background: linear-gradient(135deg, var(--swift-indigo), var(--swift-violet)); color: #fff; }
.brand small, nav button, .sidebar-note span { color: var(--swift-secondary); }
nav button.active, nav button:hover { background: linear-gradient(135deg, color-mix(in srgb, var(--swift-indigo) 70%, transparent), color-mix(in srgb, var(--swift-violet) 55%, transparent)); color: #fff; }
header { background: color-mix(in srgb, var(--swift-card) 92%, transparent); border-color: var(--swift-border); }
.panel, .metric, .song-card, .event-list article, .modal, .metadata-results button, .metadata-importer, input, select, textarea, .outline { background: var(--swift-card) !important; color: var(--swift-text) !important; border-color: var(--swift-border) !important; }
.hero, .event-feature, .stage { background: linear-gradient(135deg, var(--swift-blue), var(--swift-indigo) 58%, var(--swift-violet)) !important; color: #fff; }
.add, .hero button, .event-feature button, .insight button { background: linear-gradient(135deg, var(--swift-blue), var(--swift-indigo)); color: #fff; }
.cover, .timeline>span, .beat, .transposed, .analysis-stats span, .lab-empty, .metadata-results i, .close, .plan-item button, .check-row button, .rehearsal-row button { background: var(--swift-elevated); color: var(--swift-blue); }
.state, .ready, .offline-report .pass { background: color-mix(in srgb, var(--swift-blue) 16%, var(--swift-card)); color: var(--swift-blue); }
.pill, .eyebrow, .song-card p, .timeline p, .fine-print, .settings-grid p, .media-row small, .lab-copy, .scene-list small, .metadata-results small, .message-options label { color: var(--swift-secondary); }
.readiness i, .readiness-line i { background: var(--swift-elevated); }
.readiness i, .readiness-line b, .waveform i { background-color: var(--swift-blue); }
.waveform, .insight { background: var(--swift-elevated); border-color: var(--swift-border); }
.waveform>b { background: var(--swift-violet); }
.lab-tabs button.active, .modal-tabs button.active { color: var(--swift-blue); border-color: var(--swift-blue); }
.appearance-picker { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin-top: 14px; }
.appearance-picker button { display: grid; grid-template-columns: 24px 1fr; align-items: center; gap: 7px; padding: 9px; border: 1px solid var(--swift-border); border-radius: 8px; background: var(--swift-elevated); color: var(--swift-text); text-align: left; }
.appearance-picker button.active { border-color: var(--swift-blue); box-shadow: 0 0 0 2px color-mix(in srgb, var(--swift-blue) 20%, transparent); }
.theme-swatch { width: 22px; height: 22px; border-radius: 50%; border: 1px solid var(--swift-border-highlight); }
.theme-swatch.light { background: linear-gradient(#f2f5fc, #e3ebfa); }
.theme-swatch.dusk { background: linear-gradient(#131426, #090a1a); }
.theme-swatch.dark { background: linear-gradient(#121217, #08080f); }
.density-setting { display: grid; gap: 12px; margin-top: 18px; padding-top: 16px; border-top: 1px solid var(--swift-border); }
.density-setting>div:first-child { display: grid; gap: 4px; }
.density-setting>div:first-child>small { color: var(--swift-violet); font-size: 10px; font-weight: 800; letter-spacing: .11em; }
.density-setting>div:first-child>strong { font-size: 13px; }
.density-setting>div:first-child>p { color: var(--swift-secondary); font-size: 10px; line-height: 1.5; }
.density-picker { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.density-picker button { min-height: 58px; display: grid; grid-template-columns: 32px minmax(0,1fr); gap: 10px; align-items: center; padding: 10px 12px; border: 1px solid var(--swift-border); border-radius: 9px; background: var(--swift-elevated); color: var(--swift-text); text-align: left; }
.density-picker button.active { border-color: var(--swift-blue); box-shadow: 0 0 0 2px color-mix(in srgb, var(--swift-blue) 20%, transparent); }
.density-picker button>i { height: 28px; display: grid; align-content: center; gap: 4px; }
.density-picker button>i>b { height: 3px; border-radius: 3px; background: var(--swift-secondary); }
.density-picker button:first-child>i { gap: 6px; }
.density-picker button.active>i>b { background: var(--swift-blue); }
.density-picker button>span { display: grid; gap: 3px; }
.density-picker button>span>strong { font-size: 10px; }
.density-picker button>span>small { color: var(--swift-secondary); font-size: 10px; }
.density-setting>aside { display: flex; gap: 8px; align-items: center; padding: 9px 10px; border-radius: 8px; background: color-mix(in srgb, var(--swift-blue) 7%, var(--swift-card)); }
.density-setting>aside svg { width: 16px; color: var(--swift-blue); }
.density-setting>aside span { display: grid; gap: 2px; }
.density-setting>aside strong { font-size: 10px; }
.density-setting>aside small { color: var(--swift-secondary); font-size: 10px; }
.app-shell[data-density="performance"] .page { gap: 14px; padding-top: 22px; }
.app-shell[data-density="performance"] .panel { padding: 16px; border-radius: 12px; }
.app-shell[data-density="performance"] .columns { gap: 14px; }
.app-shell[data-density="performance"] .metrics { gap: 8px; }
.app-shell[data-density="performance"] .metric { padding: 14px 16px; }
.app-shell[data-density="performance"] .song-grid,
.app-shell[data-density="performance"] .team-grid { gap: 10px; }
.app-shell[data-density="performance"] .song-card,
.app-shell[data-density="performance"] .team-card { padding: 14px; }
.app-shell[data-density="performance"] .event-plan-row,
.app-shell[data-density="performance"] .dayof-running-row,
.app-shell[data-density="performance"] .dashboard-action-list>button,
.app-shell[data-density="performance"] .checklist-task-card { padding-top: 9px; padding-bottom: 9px; }
.app-shell[data-density="performance"] .event-workspace { gap: 14px; }
.app-shell[data-density="performance"] button,
.app-shell[data-density="performance"] input,
.app-shell[data-density="performance"] select { min-height: 44px; }
.app-shell[data-density="performance"] .stage button,
.app-shell[data-density="performance"] .stage input,
.app-shell[data-density="performance"] .stage select { min-height: revert; }
@media (max-width: 600px) { .appearance-picker { grid-template-columns: 1fr; } }
@media (max-width: 600px) { .density-picker { grid-template-columns: 1fr; } .app-shell[data-density="performance"] .page { padding-top: 14px; gap: 12px; } }