:root { color-scheme: dark; }
:root.light {
  color-scheme: light;
  --ink: #20291f;
  --muted: #5c6858;
  --line: #d5ddcf;
  --panel: #ffffff;
  --deep: #f7f9f5;
  --violet: #6951b8;
  --danger: #b82e25;
}
.light body {
  background: radial-gradient(950px 480px at 15% -10%, #e4edda 0%, transparent 58%), var(--deep);
}
.light .workspace { background: var(--panel); box-shadow: 0 28px 70px #24351b14; }
.light .stage { background: #f1f5ed; }
.light .empty { background: radial-gradient(ellipse at center, #ffffff 0%, #eef3e8 63%); }
.light .empty .glyph { background: #e6eedf; border-color: #c4d1b9; color: #426c20; }
.light :is(.stage-title, .panel-label, .privacy b, .draw, .range-summary, .track-times) { color: var(--ink); }
.light .small-button { background: #eef2e9; border-color: #c7d2be; }
.light .region-list [aria-pressed=true] { color: #426c20; border-color: #426c20; background: #e4edda; }
.light .draw { border-color: #87997b; }
.light .note { color: var(--muted); }
.light .run:disabled { color: #6b7665; background: #dce4d5; }
.light .privacy .lock { color: #426c20; }
.light .step { background: #d5ddcf; }
.light .step.active { background: #426c20; }
.light .track-ruler { border-color: #c7d2be; }
.light .track-row.selected { background: #426c2010; }
.light .track-lane { background: repeating-linear-gradient(90deg, #426c2014 0 1px, transparent 1px 10%), #e4eadf; }
.light .track-label { color: #37472c; }
.light .track-playhead { background: #20291f; }
.light :is(.track-clip, .time-handle):focus-visible { outline-color: #20291f; }
.light .result-panel { border-color: #a0b68b; }
.light .toast { color: #294416; background: #edf6e5; border-color: #a0b68b; box-shadow: 0 12px 30px #24351b20; }
.light #accessWall a:not(.choose) { color: #426c20; }

html.embedded .shell { min-height: 0; padding-bottom: 24px; }

/* Keep the actual video canvas and selection colours identical in both modes. */
#accessWall { padding: 18px; border: 1px solid #719b42; border-radius: 12px; background: var(--panel); }
#accessWall p { margin: 0 0 16px; color: var(--ink); }
#accessWall a { display: inline-block; margin: 4px 12px 4px 0; color: var(--lime); }
#accessWall a.choose { color: #101510; text-decoration: none; }
.choose:disabled { opacity: .45; cursor: not-allowed; }
.light #accessWall { border-color: #a0b68b; }