/* Open Design Application / Bugatti — bindings from tokens.css and components.html.
 * The packages' DESIGN.md descriptions conflict with their actual fixtures.
 * The matching tokens + component fixtures are authoritative for this implementation.
 * Existing typography is retained. Paper exports keep their own palette.
 */
@media screen {
body.theme-light {
 --rl-canvas:#f6f7f9;
 --rl-canvas-2:#eef4ff;
 --rl-panel:#ffffff;
 --rl-panel-soft:#eef4ff;
 --rl-ink:#172033;
 --rl-muted:#3b4658;
 --rl-faint:#3b4658;
 --rl-line:#d8dee8;
 --rl-line-soft:#edf1f6;
 --rl-purple:#2563eb;
 --rl-purple-soft:#eef4ff;
 --rl-blue:#2563eb;
 --rl-blue-soft:#eef4ff;
 --rl-orange:#2563eb;
 --rl-orange-soft:#eef4ff;
 --rl-green:#16a34a;
 --rl-green-soft:#eef4ff;
 --rl-yellow:#f59e0b;
 --rl-danger:#dc2626;
 --rl-stroke:1px;
 --rl-shadow-sm:0 16px 40px rgba(23, 32, 51, 0.10);
 --rl-shadow-md:0 16px 40px rgba(23, 32, 51, 0.10);
 --rl-shadow-lg:0 16px 40px rgba(23, 32, 51, 0.10);
 --rl-focus:0 0 0 4px rgba(37, 99, 235, 0.22);
 --rl-radius-xs:8px;
 --rl-radius-sm:8px;
 --rl-radius-md:12px;
 --rl-radius-lg:18px;
 --rl-radius-xl:18px;
 --bg:#f6f7f9;
 --surface:#ffffff;
 --surface-2:#eef4ff;
 --surface-alt:#eef4ff;
 --glass:#ffffff;
 --border:#d8dee8;
 --border-strong:#d8dee8;
 --text:#172033;
 --text-secondary:#3b4658;
 --text-muted:#3b4658;
 --muted:#3b4658;
 --accent:#2563eb;
 --accent-2:#2563eb;
 --accent-text:#ffffff;
 --primary:#2563eb;
 --primary-fg:#ffffff;
 --danger:#dc2626;
 --input-bg:#ffffff;
 --hover:#eef4ff;
 --selected:#eef4ff;
 --selected-border:#2563eb;
 --table-head-bg:#eef4ff;
 --table-cell-bg:#ffffff;
 --table-wrap-bg:#f6f7f9;
 --table-cell-hover:#eef4ff;
 --table-border:#edf1f6;
 --shadow:0 16px 40px rgba(23, 32, 51, 0.10);
 --radius:12px;
 --radius-lg:18px;
 --ui-control-line:#6b7689;
 --ui-fill:#2563eb;
 --ui-on-fill:#ffffff;
 --ui-tint:#eef4ff;
 --ui-tint-ink:#3b4658;
 --ui-control-radius:8px;
 --ui-button-radius:12px;
 --ui-panel-radius:18px;
 --ui-focus:#2563eb;
 --ui-warning-bg:#fffbeb;
 --ui-warning-ink:#854d0e;
 --ui-danger-bg:#fef2f2;
 --ui-danger-ink:#b91c1c;
 --ui-hover-fill:#225bd8;
 --ui-active-fill:#1f55ca;
 --ui-success:#16a34a;
 --ui-canvas-gradient:linear-gradient(135deg, #f6f7f9 0%, #eef4ff 100%);
 --gradient:linear-gradient(135deg,#2563eb,#eef4ff); --gradient-soft:linear-gradient(135deg,#f6f7f9,#eef4ff); --aurora:none; --chrome-top:#ffffff; --chrome-top-2:#eef4ff; color-scheme:light;
}
body.theme-dark {
 --rl-canvas:#07111f;
 --rl-canvas-2:#16283f;
 --rl-panel:#101d2f;
 --rl-panel-soft:#16283f;
 --rl-ink:#f7fbff;
 --rl-muted:#d6e0ee;
 --rl-faint:#d6e0ee;
 --rl-line:#2c405c;
 --rl-line-soft:#1c2d44;
 --rl-purple:#1b4d8f;
 --rl-purple-soft:#16283f;
 --rl-blue:#1b4d8f;
 --rl-blue-soft:#16283f;
 --rl-orange:#1b4d8f;
 --rl-orange-soft:#16283f;
 --rl-green:#2fbf71;
 --rl-green-soft:#16283f;
 --rl-yellow:#d9b45f;
 --rl-danger:#c1121f;
 --rl-stroke:1px;
 --rl-shadow-sm:0 28px 86px rgba(0, 0, 0, 0.46);
 --rl-shadow-md:0 28px 86px rgba(0, 0, 0, 0.46);
 --rl-shadow-lg:0 28px 86px rgba(0, 0, 0, 0.46);
 --rl-focus:0 0 0 4px rgba(183, 199, 217, 0.28);
 --rl-radius-xs:8px;
 --rl-radius-sm:8px;
 --rl-radius-md:14px;
 --rl-radius-lg:22px;
 --rl-radius-xl:22px;
 --bg:#07111f;
 --surface:#101d2f;
 --surface-2:#16283f;
 --surface-alt:#16283f;
 --glass:#101d2f;
 --border:#2c405c;
 --border-strong:#2c405c;
 --text:#f7fbff;
 --text-secondary:#d6e0ee;
 --text-muted:#d6e0ee;
 --muted:#d6e0ee;
 --accent:#1b4d8f;
 --accent-2:#b7c7d9;
 --accent-text:#ffffff;
 --primary:#1b4d8f;
 --primary-fg:#ffffff;
 --danger:#c1121f;
 --input-bg:#101d2f;
 --hover:#16283f;
 --selected:#16283f;
 --selected-border:#b7c7d9;
 --table-head-bg:#16283f;
 --table-cell-bg:#101d2f;
 --table-wrap-bg:#07111f;
 --table-cell-hover:#16283f;
 --table-border:#1c2d44;
 --shadow:0 28px 86px rgba(0, 0, 0, 0.46);
 --radius:14px;
 --radius-lg:22px;
 --ui-control-line:#8fa1b7;
 --ui-fill:#1b4d8f;
 --ui-on-fill:#ffffff;
 --ui-tint:#16283f;
 --ui-tint-ink:#d6e0ee;
 --ui-control-radius:8px;
 --ui-button-radius:14px;
 --ui-panel-radius:22px;
 --ui-focus:#b7c7d9;
 --ui-warning-bg:#16283f;
 --ui-warning-ink:#d9b45f;
 --ui-danger-bg:#c1121f;
 --ui-danger-ink:#ffffff;
 --ui-hover-fill:#184580;
 --ui-active-fill:#17427b;
 --ui-success:#2fbf71;
 --ui-canvas-gradient:radial-gradient(circle at 72% 16%, rgba(183,199,217,.20), transparent 34%), linear-gradient(135deg, #07111f 0%, #16283f 100%);
 --gradient:linear-gradient(135deg,#1b4d8f,#16283f); --gradient-soft:linear-gradient(135deg,#07111f,#16283f); --aurora:none; --chrome-top:#101d2f; --chrome-top-2:#16283f; color-scheme:dark;
}
/* The export document is an independent, light paper surface. Never reset it. */
body:is(.theme-light,.theme-dark) { background:var(--rl-canvas); color:var(--rl-ink); }
body:is(.theme-light,.theme-dark) :where(*):not(:where(.call-sheet-document,.call-sheet-document *,.callsheet-document,.callsheet-document *)) {
 border-color:var(--rl-line-soft) !important;
 box-shadow:none !important;
 text-shadow:none !important;
}
body:is(.theme-light,.theme-dark) :where(*):not(:where(.call-sheet-document,.call-sheet-document *,.callsheet-document,.callsheet-document *,img,video,canvas,svg,svg *)) {
 color:inherit;
}

body :is(.splash,.table-wrap,.storyboard-view,.storyboard-stage,.shooting-plan-wrapper,.schedule-view,.callsheet-wizard,.cs-preview-stage,.schedule-container,.calendar-grid,.day-planner) {
 background:var(--rl-canvas) !important;
 background-image:none !important;
 color:var(--rl-ink) !important;
}
body::before,body::after,body .home-hero::before,body .home-hero::after,body .activity-panel::before { display:none !important; }
body :is(.topbar,.toolbar,.statusbar,.storyboard-status,.cs-day-toolbar,.calendar-header,.day-planner-header) {
 background:var(--rl-panel) !important; color:var(--rl-ink) !important;
 border-radius:0; border-width:0 0 1px; backdrop-filter:none; -webkit-backdrop-filter:none;
}
body :is(.topbar,.toolbar) { padding-block:12px; gap:16px; }
body .steps { padding:4px; gap:4px; border:0; background:var(--rl-panel-soft) !important; border-radius:var(--ui-control-radius); }
body .step-sep { display:none; }
body .step { padding:9px 16px; border:1px solid transparent; border-radius:var(--ui-control-radius); }

/* Layered surfaces, panel radii and elevation from the reference components. */
body :is(.home-hero,.activity-panel,.shot-pool-panel,.scene-groups-panel,.callsheet-editor-card,.cs-side-summary,.frame-lib-modal,.report-modal,.camera-remove-dialog,.dropdown,.panel) {
 background:var(--rl-panel) !important; color:var(--rl-ink) !important;
 border:1px solid var(--rl-line-soft); border-radius:var(--ui-panel-radius);
}
body :is(.home-hero,.activity-panel,.shot-pool-panel,.scene-groups-panel,.callsheet-editor-card,.cs-side-summary,.frame-lib-modal,.report-modal,.dropdown) { box-shadow:var(--rl-shadow-md) !important; }
body .home-shell { gap:32px; }
body .home-hero { padding:48px; }
body .activity-panel { padding:28px; }
body .home-session { padding:20px; background:var(--ui-tint) !important; color:var(--ui-tint-ink) !important; border:1px solid var(--rl-line-soft); border-radius:var(--ui-control-radius); }
body :is(.activity-item.project-card,.shot-card,.scene-shot-card-full,.scene-group,.cs-subsection,.cs-scene-plan,.cs-crew-row,.cs-arrival-batch,.cs-person-card,.cs-location-card,.cs-template-picker label,.cs-rundown-slider,.cs-rundown-option,.camera-lane,.cs-day-column,.cs-day-scene,.frame-lib-card,.calendar-day,.timeline-item,.shot-pool-item,.report-body,.cs-export-days,.cs-export-day-options label) {
 background:var(--rl-panel) !important; color:var(--rl-ink) !important;
 border:1px solid var(--rl-line-soft); border-radius:var(--ui-control-radius);
}
body :is(.activity-item.project-card,.shot-card,.scene-shot-card-full,.frame-lib-card,.calendar-day,.timeline-item,.shot-pool-item):hover {
 transform:none !important; border-color:var(--accent) !important; background:var(--rl-panel-soft) !important;
}
body :is(.panel-header,.scene-group-header,.cs-section-heading,.frame-lib-head,.report-head,.cs-preview-day-heading) {
 background:var(--rl-panel-soft) !important; color:var(--rl-ink) !important;
 border-width:0 0 1px; border-radius:var(--ui-control-radius) var(--ui-control-radius) 0 0;
}
body .project-card-rail { background:var(--rl-panel-soft) !important; border-left-width:1px; }
body :is(.tag,.count,.file-badge,.shot-num,.day-badge,.shot-chip,.cs-scene-order,.brand) {
 background:var(--ui-tint) !important; color:var(--ui-tint-ink) !important;
 border:1px solid var(--rl-line-soft); border-radius:var(--ui-control-radius);
}
body .brand { background:var(--ui-fill) !important; color:var(--ui-on-fill) !important; border:0; }
body .file-badge { border-radius:9999px; }

/* All control states have explicit foreground/background pairs. */
body :is(.btn,.btn-icon,.icon-btn,.cs-chip,.step,.storyboard-view-switch button,.storyboard-play-btn,.storyboard-fields-menu summary,.remove-btn-full,.camera-board button,.camera-scene-source,.dropdown button) {
 background:var(--rl-panel) !important; color:var(--rl-ink) !important;
 border-color:var(--ui-control-line) !important; border-width:1px; border-radius:var(--ui-control-radius); transform:none !important;
 transition:background-color 180ms ease,color 180ms ease,border-color 180ms ease;
}
body :is(.btn,.icon-btn,.step,.storyboard-play-btn) { min-height:36px; }
body :is(.btn,.btn-icon,.icon-btn,.cs-chip,.step,.storyboard-view-switch button,.storyboard-play-btn,.storyboard-fields-menu summary,.remove-btn-full,.camera-board button,.dropdown button):not(:disabled):hover {
 background:var(--ui-tint) !important; color:var(--ui-tint-ink) !important; border-color:var(--accent) !important;
}
body :is(.btn.primary,.btn.accent,.step.active,.cs-chip.accent,.storyboard-view-switch button.active) {
 background:var(--ui-fill) !important; color:var(--ui-on-fill) !important; border-color:var(--ui-fill) !important;
}
body :is(.btn.primary,.btn.accent):not(:disabled):hover { background:var(--ui-hover-fill) !important; color:var(--ui-on-fill) !important; }
body :is(.btn,.step,.cs-chip,.storyboard-view-switch button) :is(span,b,small) { color:inherit !important; }
body :is(.btn.danger,.danger-outline) { background:var(--ui-danger-bg) !important; color:var(--ui-danger-ink) !important; }
body :is(.btn,.btn-icon,.icon-btn,.step,.cs-chip,.camera-board button):disabled { opacity:1 !important; color:var(--rl-muted) !important; background:var(--rl-panel-soft) !important; border-style:dashed; cursor:not-allowed; }

body :is(input,select,textarea):not(:where(.call-sheet-document *)):not([type=checkbox]):not([type=radio]):not([type=range]) {
 color:var(--rl-ink) !important; background:var(--rl-panel) !important; border-color:var(--ui-control-line) !important; border-width:1px; border-radius:var(--ui-control-radius);
}
body :is(input,textarea)::placeholder { color:var(--rl-muted) !important; opacity:1; }
body :is(input,select,textarea,button,summary,[tabindex]):not(:where(.call-sheet-document *)):focus-visible {
 outline:2px solid var(--ui-focus) !important; outline-offset:2px; border-color:var(--ui-focus) !important;
}
body :is(input[type=checkbox],input[type=radio]) { accent-color:var(--ui-fill); }
body :is(.theme-switch-track,.storyboard-info-switch .switch-track) { background:var(--rl-panel-soft) !important; border:1px solid var(--rl-line) !important; border-radius:9999px; }
body .theme-switch-knob { background:var(--ui-fill) !important; color:var(--ui-on-fill) !important; border:0; border-radius:9999px; }
body .theme-switch-knob-text { color:inherit !important; }
body .storyboard-info-switch input:checked + .switch-track { background:var(--ui-fill) !important; }
body .storyboard-info-switch .switch-track::after { background:var(--rl-ink); }
body .storyboard-info-switch input:checked + .switch-track::after { background:var(--ui-on-fill); }
body .size-slider { background:var(--rl-line-soft) !important; }
body .size-slider::-webkit-slider-thumb { background:var(--ui-fill); border:0; box-shadow:none; }

/* Dense work areas use fine dividers, not bright column blocks or graph paper. */
body .shot-table { background:var(--rl-panel) !important; border:1px solid var(--rl-line-soft); border-radius:var(--ui-control-radius); }
body .shot-table thead th { background:var(--rl-panel-soft) !important; color:var(--rl-ink) !important; border-width:0 1px 1px 0; }
body .shot-table tbody td { background:var(--rl-panel) !important; color:var(--rl-ink) !important; border-width:0 1px 1px 0; }
body .shot-table tbody tr:hover td { background:var(--rl-panel-soft) !important; }
body .shot-table tbody tr.selected td { background:var(--ui-tint) !important; border-block-color:var(--accent) !important; }
body .shot-table tbody tr.selected td:first-child { border-left:3px solid var(--accent) !important; }
body :is(.storyboard-view-switch,.shooting-plan-size-control) { background:var(--rl-panel) !important; border:1px solid var(--rl-line-soft); border-radius:var(--ui-control-radius); }
body .sb-card { background:var(--rl-panel) !important; color:var(--rl-ink) !important; border:1px solid var(--rl-line-soft); border-radius:var(--ui-control-radius); }
body .sb-card:hover { transform:none !important; border-color:var(--accent) !important; }
body :is(.sb-card-info,.sb-card-text,.sb-card-meta) { color:var(--rl-ink) !important; background:var(--rl-panel) !important; }
body .sb-card-no { color:#000 !important; background:#fff !important; border:1px solid #999 !important; border-radius:6px; }
body :is(.scene-group-drop-zone,.cs-drop-placeholder,.cs-empty,.cs-preset-bar,.cs-available-scenes,.cs-role-palette,.cs-timeline-summary) {
 background:var(--rl-panel-soft) !important; color:var(--rl-muted) !important; border:1px dashed var(--rl-line-soft); border-radius:var(--ui-control-radius);
}
body :is(.scene-group.drag-target,.scene-group-drop-zone.drag-over,.cs-arrival-batch.drag-over,.cs-template-picker label.selected,.cs-day-column.is-active,.cs-day-column.is-dragover,.camera-drop-active) {
 background:var(--ui-tint) !important; border-color:var(--accent) !important; outline:1px solid var(--ui-focus); outline-offset:-1px;
}
body :is(.cs-warning,.cs-warning-block,.toast) { background:var(--ui-warning-bg) !important; color:var(--ui-warning-ink) !important; border:1px solid var(--rl-line-soft); border-left:3px solid var(--ui-warning-ink) !important; border-radius:var(--ui-control-radius); }
body :is(.cs-camera-preview-label,.cs-preview-day-heading) { color:var(--rl-ink) !important; }
body :is(.cs-time-origin,.cs-day-help,.cs-day-empty,.cs-day-scene small,.cs-step-hint,.step-desc,.cs-preset-label,.callsheet-field label,.cs-scene-shots,.cs-time-result span,.cs-total-duration span,.cs-location-card label span,.splash-desc,.activity-sub,.home-primary-meta,.activity-empty,.shot-card-meta,.shot-card-content,.scene-shot-duration,.scene-shot-content,.frame-lib-sub,.frame-lib-hint,.frame-lib-empty,.statusbar,.shot-count,.app-version,.column-hint,.camera-lane-empty,.camera-board-header > span,.camera-lane-header > span) {
 color:var(--rl-muted) !important; opacity:1;
}
body :is(.cs-kicker,.scene-shot-meta,.link-btn,.dirty-dot) { color:var(--ui-tint-ink) !important; }
body .modal-backdrop { background:rgba(0,0,0,.6) !important; backdrop-filter:none; -webkit-backdrop-filter:none; }
body .storyboard-status i { background:var(--ui-success) !important; }

/* Secondary controls and metadata must not inherit old dark-only literals. */
body :is(.combo-pick-menu,.storyboard-fields-panel,.image-actions-bar,.cs-shot-timing-panel,.cs-timing-defaults,.cs-print-options,.callsheet-scene-item,.schedule-time-row) {
 background:var(--rl-panel) !important; color:var(--rl-ink) !important; border:1px solid var(--rl-line-soft); border-radius:var(--ui-control-radius);
}
body :is(.combo-pick-item,.frame-lib-hide,.frame-lib-use,.rail-btn,.image-actions-bar button,.image-add-more) {
 background:var(--rl-panel) !important; color:var(--rl-ink) !important; border-color:var(--rl-line-soft) !important; border-radius:var(--ui-control-radius);
}
body :is(.combo-pick-item,.frame-lib-use,.rail-btn,.image-actions-bar button):hover {
 background:var(--ui-tint) !important; color:var(--ui-tint-ink) !important; border-color:var(--accent) !important;
}
body :is(.cs-time-result b,.cs-total-duration b,.cs-timeline-summary b,.cs-person-drag,.storyboard-fields-panel strong,.storyboard-fields-panel > label,.size-value,.scene-group-index,.scene-group-handle,.sb-card-ph) {
 color:var(--rl-ink) !important;
}
body :is(.storyboard-cols-label,.storyboard-size-label,.storyboard-info-switch,.empty-pool,.empty-groups,.drop-hint,.shot-placeholder,.scene-insert-slot) { color:var(--rl-muted) !important; }
body .activity-item .warn-line { color:var(--ui-warning-ink) !important; }
body .image-actions button { color:#fff !important; background:#000 !important; border:1px solid #999 !important; }
body.theme-dark :is(.clip-tl-in,.clip-tl-out,.clip-tl-play,.clip-tl-hover-in,.clip-tl-hover-out) { color:#000 !important; background:#fff !important; }
body.theme-dark :is(.clip-tl-selection,.clip-tl-range) { border-color:#fff !important; }


body #app, body .splash { background:var(--ui-canvas-gradient) !important; }
body :is(.btn,.step,.storyboard-view-switch button) { border-radius:var(--ui-button-radius); }
body :is(.btn.primary,.btn.accent):not(:disabled):active { background:var(--ui-active-fill) !important; color:var(--ui-on-fill) !important; }
body :is(.home-session,.shot-card,.scene-shot-card-full,.cs-subsection,.cs-person-card,.cs-location-card,.cs-day-scene) { background:var(--rl-panel-soft) !important; border-radius:var(--rl-radius-md); }
body :is(.callsheet-editor-card,.home-hero,.activity-panel,.scene-groups-panel,.shot-pool-panel,.frame-lib-modal,.report-modal) { border-color:var(--rl-line) !important; }
body .home-session { color:var(--rl-ink) !important; }
body .cs-kicker { color:var(--ui-focus) !important; }
@media (max-width:800px) {
 body .home-shell { gap:16px; }
 body :is(.home-hero,.activity-panel) { padding:24px; }
 body :is(.topbar,.toolbar) { gap:8px; }
 body .step { padding-inline:10px; }
}
@media (prefers-reduced-motion:reduce) { body :is(.btn,.step,.cs-chip) { transition:none; } }
}

/* Keep document rendering independent of workspace theme. */
.call-sheet-document {
  --rl-canvas: #f2f0ea;
  --rl-canvas-2: #e7e5df;
  --rl-panel: #fffef9;
  --rl-panel-soft: #f8f6ef;
  --rl-ink: #141414;
  --rl-muted: #686868;
  --rl-faint: #8d8d8d;
  --rl-line: #171717;
  --rl-line-soft: rgba(20, 20, 20, 0.24);
  --rl-purple: #9854f4;
  --rl-purple-soft: #e7d3ff;
  --rl-blue: #59c6f2;
  --rl-blue-soft: #d6f3ff;
  --rl-orange: #f15a2b;
  --rl-orange-soft: #ffd8c9;
  --rl-green: #63cf83;
  --rl-green-soft: #d8f5de;
  --rl-yellow: #f5cc46;
  --rl-danger: #d92d20;
  --rl-radius-xs: 8px;
  --rl-radius-sm: 12px;
  --rl-radius-md: 18px;
  --rl-radius-lg: 26px;
  --rl-radius-xl: 34px;
  --rl-stroke: 2px;
  --rl-shadow-sm: 3px 3px 0 var(--rl-line);
  --rl-shadow-md: 6px 6px 0 var(--rl-line);
  --rl-shadow-lg: 10px 10px 0 var(--rl-line);
  --rl-focus: 0 0 0 4px rgba(152, 84, 244, 0.25);
  --rl-motion: 160ms cubic-bezier(.2, .8, .2, 1);
}

/* Workbench interaction and density. Screen-only, never applied to output paper. */
@media screen {
 body.theme-light { --editor-hover:#e4efff; --editor-selected:#cfe4ff; --editor-selection-line:#2563eb; --editor-drag:#fff0c2; --editor-drag-line:#854d0e; }
 body.theme-dark { --editor-hover:#1e3652; --editor-selected:#234f78; --editor-selection-line:#b7c7d9; --editor-drag:#493b20; --editor-drag-line:#d9b45f; }
 #editorView #shotTable { zoom:var(--editor-scale,1); }
 #editorView .image-box { width:var(--editor-image-width,100%); min-width:min(64px,100%); max-width:100%; flex-shrink:1; }
 #editorView .image-box.is-paste-target { outline:3px solid var(--editor-drag-line); outline-offset:2px; }
 #editorView .cell-textarea { max-width:100%; overflow-wrap:anywhere; white-space:pre-wrap; }
 #editorView .cell-input { max-width:100%; min-width:0; }
 #editorView .shot-table tbody tr:hover td { background:var(--editor-hover) !important; box-shadow:inset 0 1px var(--editor-selection-line),inset 0 -1px var(--editor-selection-line) !important; }
 #editorView .shot-table tbody tr.selected td { background:var(--editor-selected) !important; box-shadow:inset 0 2px var(--editor-selection-line),inset 0 -2px var(--editor-selection-line) !important; }
 #editorView .shot-table tbody tr.selected td:first-child { border-left:3px solid var(--editor-selection-line) !important; }
 #editorView .shot-table tbody tr.sortable-ghost { opacity:1; }
 #editorView .shot-table tbody tr:is(.sortable-chosen,.sortable-ghost,.sortable-drag) td { background:var(--editor-drag) !important; box-shadow:inset 0 2px var(--editor-drag-line),inset 0 -2px var(--editor-drag-line) !important; }
 #editorView .shot-table tbody tr:is(:hover,.selected,.sortable-chosen,.sortable-ghost) :is(input,textarea) { background:transparent !important; }
 .editor-scale-controls { display:flex; flex-wrap:wrap; gap:8px 16px; align-items:center; }
 .editor-scale-controls label { display:flex; align-items:center; gap:6px; white-space:nowrap; }
 .editor-scale-controls input { width:84px; min-width:60px; accent-color:var(--accent); }
 .editor-scale-controls output { min-width:4ch; text-align:right; font-variant-numeric:tabular-nums; }
 body .scene-group-header .scene-group-name { flex:1; width:0; min-width:80px; background:transparent !important; border-color:transparent !important; padding:6px 8px; }
 body .scene-group-header .scene-group-name:is(:hover,:focus) { background:var(--rl-panel) !important; border-color:var(--ui-control-line) !important; }
 .camera-board .camera-chip-title { width:100%; }
 .callsheet-view .cs-timing-workspace { max-width:none; min-width:0; }
 .callsheet-view .cs-timing-workspace .cs-schedule-scroll { overflow-x:auto; }
 .callsheet-view .cs-timing-workspace :is(.cs-schedule-head,.cs-scene-plan) { grid-template-columns:44px minmax(160px,1.1fr) 88px 110px 88px 112px 190px 140px minmax(180px,1fr) 32px; gap:8px; padding:10px 12px; border:1px solid transparent; align-items:start; box-sizing:border-box; }
 .callsheet-view .cs-timing-workspace :is(.cs-schedule-head,.cs-scene-plan-list) { min-width:1360px; }
 .callsheet-view .cs-timing-workspace .cs-scene-plan > * { min-width:0; }
 .callsheet-view .cs-timing-workspace input { max-width:100%; min-width:0; }
 .callsheet-view .cs-time-input input { flex:1; width:110px; }
 .callsheet-view .cs-time-input select { flex:0 0 66px; width:66px; }
 .callsheet-view .cs-time-origin { white-space:normal; overflow-wrap:anywhere; }
 .callsheet-view .cs-scene-note-controls > span { flex-wrap:wrap; }
 .callsheet-view .cs-arrival-board { grid-template-columns:repeat(auto-fit,minmax(min(100%,440px),1fr)); gap:16px; }
 .callsheet-view .cs-arrival-batch > header { grid-template-columns:auto 110px minmax(0,1fr) 32px; gap:8px; }
 .callsheet-view .cs-person-card { grid-template-columns:20px minmax(0,1fr) minmax(0,1fr) 32px; gap:8px; padding:12px; overflow:visible; }
 .callsheet-view .cs-person-card > .cs-person-drag { grid-column:1; grid-row:1 / span 3; cursor:grab; }
 .callsheet-view .cs-person-card > input:nth-of-type(1) { grid-column:2; grid-row:1; }
 .callsheet-view .cs-person-card > input:nth-of-type(2) { grid-column:3; grid-row:1; }
 .callsheet-view .cs-person-card > input:nth-of-type(3) { grid-column:2; grid-row:2; }
 .callsheet-view .cs-person-card > input:nth-of-type(4) { grid-column:3; grid-row:2; }
 .callsheet-view .cs-person-card > select { grid-column:2 / span 2; grid-row:3; }
 .callsheet-view .cs-person-card > button { grid-column:4; grid-row:1; }
 .callsheet-view .cs-person-card :is(input,select) { width:100%; min-width:0; min-height:34px; }
 .callsheet-view .cs-role-people { display:flex; flex-wrap:wrap; gap:8px; margin-bottom:12px; }
 .callsheet-view :is(.cs-role-palette,.cs-role-people) button { cursor:grab; }
 .callsheet-view .cs-role-palette button[aria-pressed=true] { outline:2px solid var(--ui-focus); }
 .callsheet-view .cs-arrival-batch.drag-over { outline:2px solid var(--ui-focus); outline-offset:2px; }
 .callsheet-view .cs-layout-drawer { margin:24px 0; border:1px solid var(--rl-line); border-radius:var(--ui-panel-radius); background:var(--rl-panel); padding:16px; }
 .callsheet-view .cs-layout-drawer > summary { cursor:pointer; padding:4px; color:var(--rl-ink); }
 .callsheet-view .cs-layout-drawer[open] > summary { margin-bottom:16px; }
 .callsheet-view .cs-layout-drawer :is(.cs-document-controls,.cs-rundown-controls) { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr)); align-items:stretch; gap:12px; }
 .callsheet-view .cs-layout-group { min-width:0; flex-wrap:wrap; }
 .callsheet-view .cs-rundown-slider { min-width:0; }
 .callsheet-view .cs-rundown-slider input { max-width:100%; width:100%; }
 .callsheet-view .cs-preview-stage { min-width:0; max-height:none; overflow-x:auto; }
}

/* One shell, one theme: splash is a sibling of #app, not its child. */
@media screen {
 html[data-theme="light"] { background:#f6f7f9; color-scheme:light; }
 html[data-theme="dark"] { background:#07111f; color-scheme:dark; }
 body:is(.theme-light,.theme-dark) { --cell-text:var(--rl-ink); --table-cell-alt:var(--rl-panel-soft); --row-alt:var(--rl-panel-soft); }
 body #splash { background:var(--ui-canvas-gradient) !important; color:var(--rl-ink) !important; }
 body #splash :is(.home-hero,.activity-panel) { background:var(--rl-panel) !important; color:var(--rl-ink) !important; }
 body #splash :is(.splash-brand,.activity-head strong) { color:var(--rl-ink) !important; }
 .home-theme-control { position:absolute; top:20px; right:var(--grid-margin,24px); z-index:1; }
 body #splash { padding-top:80px; }
 html { scrollbar-gutter:stable; }
 body .topbar { display:grid; grid-template-columns:minmax(0,1fr) auto minmax(0,1fr); align-items:center; gap:16px; }
 body .topbar-left { min-width:0; overflow:hidden; }
 body .topbar-left .project-title { min-width:0; width:150px; flex:1 1 150px; }
 body .topbar-left :is(.brand,.back-btn) { flex-shrink:0; }
 body .topbar-left .file-badge { max-width:90px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
 body .topbar-right { justify-self:end; margin:0; width:auto; flex-wrap:nowrap; overflow:visible; }
 body .topbar > .steps { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); width:408px; max-width:100%; height:44px; gap:4px; padding:2px; margin:0; order:0; overflow:visible; background:transparent !important; border:0; border-radius:0; }
 body .topbar .steps .step { position:relative; height:40px; min-height:40px; margin:0; padding:8px 12px; border:0 !important; border-radius:8px; background:transparent !important; color:var(--rl-muted) !important; transform:none !important; }
 body .topbar .steps .step:hover { background:var(--rl-panel-soft) !important; color:var(--rl-ink) !important; }
 body .topbar .steps .step.active { background:var(--rl-panel-soft) !important; color:var(--ui-focus) !important; }
 body .topbar .steps .step.active::after { display:block; content:""; position:absolute; width:24px; height:2px; bottom:3px; left:calc(50% - 12px); background:var(--ui-focus); border-radius:2px; }
 @media (max-width:1180px) {
  body .topbar { grid-template-columns:minmax(0,1fr) auto; position:sticky; }
  body .topbar > .steps { grid-column:1 / -1; grid-row:2; justify-self:center; width:min(100%,440px); }
  body .topbar-left { grid-column:1; grid-row:1; }
  body .topbar-right { grid-column:2; grid-row:1; }
 }
 @media (max-width:650px) {
  body .topbar { gap:8px; padding-inline:12px; }
  body .topbar-left :is(.file-badge,.brand) { display:none; }
  body .topbar-left .project-title { width:80px; }
  body .topbar-right { gap:4px; }
  body .topbar-right .btn { padding-inline:8px; }
  body .topbar .steps .step { padding-inline:4px; }
 }
}

/* All four call-sheet editing steps share the first step's panel shell. */
@media screen {
 body #callsheetContainer { width:100%; min-width:0; }
 body #callsheetContainer > :is(.callsheet-pro-shell,.callsheet-step) { width:min(1368px,100%); max-width:1368px; margin-inline:auto; }
 body #callsheetContainer .callsheet-editor-card { min-width:0; padding:24px; background:var(--rl-panel) !important; color:var(--rl-ink) !important; border:1px solid var(--rl-line) !important; border-radius:var(--ui-panel-radius); box-shadow:var(--rl-shadow-md) !important; }
 body #callsheetContainer .callsheet-editor-card > .cs-section-heading { margin:-24px -24px 24px; padding:20px 24px; min-width:0; border-bottom:1px solid var(--rl-line-soft) !important; border-radius:var(--ui-panel-radius) var(--ui-panel-radius) 0 0; background:var(--rl-panel-soft) !important; align-items:center; flex-wrap:wrap; gap:12px; }
 body #callsheetContainer .cs-subsection > .cs-section-heading { margin:0 0 16px; padding:0 0 12px; border-radius:0; background:transparent !important; flex-wrap:wrap; }
 body #callsheetContainer .cs-subsection { padding:20px; margin-top:24px; }
 body #callsheetContainer .cs-timing-workspace > [data-camera-board] { padding:12px 0; }
 body #callsheetContainer .cs-timeline-summary { margin:20px -24px -24px; padding:16px 24px; border-width:1px 0 0; border-style:solid; border-radius:0 0 var(--ui-panel-radius) var(--ui-panel-radius); background:var(--rl-panel-soft) !important; }
 body #callsheetContainer .cs-timeline-summary:has(~ .cs-warning-block) { margin-bottom:0; border-radius:0; }
 body #callsheetContainer .cs-preview-stage { width:100%; padding:20px; margin:0; border:1px solid var(--rl-line) !important; border-radius:var(--ui-control-radius); background:var(--rl-canvas) !important; }
 body #callsheetContainer .cs-export-days { margin:0 0 20px; }
 body #callsheetContainer .cs-layout-drawer { margin-bottom:0; }
 body #callsheetContainer .cs-role-people:empty { display:none; }
 body #callsheetContainer .cs-arrival-batch > header { padding-bottom:12px; border-bottom:1px solid var(--rl-line-soft); }
 @media (max-width:650px) {
  body #callsheetContainer .callsheet-editor-card { padding:16px; }
  body #callsheetContainer .callsheet-editor-card > .cs-section-heading { margin:-16px -16px 16px; padding:16px; }
  body #callsheetContainer .cs-timeline-summary { margin:16px -16px -16px; padding:16px; }
  body #callsheetContainer .cs-preview-stage { padding:12px; }
 }
}
@media screen {
 body .cs-day-toolbar { justify-content:center; }
 body #callsheetContainer .cs-export-day-options { justify-content:center; }
 body #callsheetContainer .cs-export-days { text-align:center; }
 body #callsheetContainer .cs-layout-drawer { margin:0 0 20px; }
 .cs-batch-people { position:relative; }
 .cs-person-card { position:relative; }
 .cs-person-card.crew-insert-before::before { content:""; position:absolute; top:-5px; left:0; right:0; height:3px; background:var(--ui-focus); }
 .cs-batch-people.crew-insert-end::after { content:""; display:block; height:3px; background:var(--ui-focus); }
}
/* Stable, print-friendly Application palette for preview, PDF and printed paper. */
.call-sheet-document { color:#172033; background:#fff; }
.call-sheet-document :is(.cs-doc-info-grid > div,.cs-doc-hero > div,.cs-doc-bulletin,.cs-rundown-scene-header,.cs-rundown-scene-meta) { background:#eef4ff !important; color:#172033 !important; border-color:#d8dee8 !important; }
.call-sheet-document :is(.cs-doc-table,.cs-shot-script-table) th { background:#eef4ff !important; color:#172033 !important; border-color:#d8dee8 !important; }
.call-sheet-document :is(.cs-doc-table,.cs-shot-script-table) td { background:#fff !important; color:#172033 !important; border-color:#d8dee8 !important; }
.call-sheet-document :is(.cs-doc-table,.cs-shot-script-table) tr:nth-child(even) td { background:#f6f7f9 !important; }
.call-sheet-document :is(h1,h2,h3,.cs-doc-title,.cs-page-num-only,.cs-rundown-column-head b,.cs-script-shot-no,.cs-doc-bulletin b) { color:#2563eb !important; border-color:#2563eb !important; }
.call-sheet-document :is(.cs-doc-page-title,.cs-camera-page-title,.cs-rundown-scene,.cs-doc-shot-card,.cs-doc-shot-mini,footer) { border-color:#d8dee8 !important; }

/* Time choices stay beside their value; native scrolling keeps trackpad momentum. */
@media screen {
 html { scroll-behavior:smooth; overscroll-behavior-y:auto; }
 body { overscroll-behavior-y:auto; }
 body .cs-time-control { display:inline-flex; align-items:center; justify-content:flex-start; width:max-content; max-width:100%; gap:2px; min-width:0; }
 body .cs-time-control input[type=time] { width:82px !important; min-width:74px; padding-inline:6px; }
 body .cs-time-control input[type=time]::-webkit-calendar-picker-indicator { display:none; }
 body .cs-number-unit:has(.cs-time-control) { display:flex; align-items:center; gap:3px; }
 body .cs-number-unit:has(.cs-time-control) em { position:static; transform:none; flex-shrink:0; }
 body .cs-time-control input[type=number] { padding-inline:5px; width:64px !important; min-width:48px; }
 body .cs-time-control input[type=number]::-webkit-inner-spin-button { appearance:none; }
 body .cs-time-trigger { flex:0 0 24px; width:24px; height:30px; padding:0; border:1px solid var(--rl-line); border-radius:6px; color:var(--ui-focus); background:var(--rl-panel-soft); cursor:pointer; }
 body .cs-work-duration { display:grid; gap:4px; align-content:start; }
 body .cs-work-duration > .cs-chip { justify-self:start; padding:3px 5px;  }
 body .cs-time-picker { position:fixed; z-index:10000; box-sizing:border-box; width:240px; padding:14px; border:1px solid var(--rl-line); border-radius:var(--ui-panel-radius); background:var(--rl-panel); color:var(--rl-ink); box-shadow:var(--rl-shadow-md); animation:cs-picker-in 220ms cubic-bezier(.2,.9,.3,1.16); }
 .cs-time-picker > strong { display:block;  margin-bottom:10px; }
 .cs-picker-wheels { display:flex; gap:8px; }
 .cs-picker-wheel { flex:1; height:180px; padding-block:72px; box-sizing:border-box; overflow-y:auto; overscroll-behavior:contain; scroll-snap-type:y mandatory; scrollbar-width:none; border:1px solid var(--rl-line-soft); border-radius:8px; background:var(--rl-panel-soft); }
 .cs-picker-wheel::-webkit-scrollbar { display:none; }
 body .cs-picker-option { display:block; width:100%; height:36px; min-height:36px; padding:0; border:0; border-radius:6px; scroll-snap-align:center; color:var(--rl-muted); background:transparent; font:inherit;  font-variant-numeric:tabular-nums; cursor:pointer; }
 body .cs-picker-option[aria-selected=true] { color:var(--ui-focus); background:var(--rl-panel);  }
 .cs-picker-actions { display:flex; justify-content:flex-end; gap:8px; padding-top:12px; }
 body #callsheetContainer .cs-arrival-board { display:grid; grid-template-columns:minmax(0,1fr); gap:16px; }
 body #callsheetContainer .cs-arrival-batch { padding:0; overflow:hidden; border:1px solid var(--rl-line) !important; border-radius:var(--ui-panel-radius); background:var(--rl-panel) !important; }
 body #callsheetContainer .cs-arrival-batch > header { margin:0; padding:12px 16px; display:flex; align-items:center; flex-wrap:wrap; gap:8px; background:var(--rl-panel-soft) !important; border-bottom:1px solid var(--rl-line) !important; }
 body #callsheetContainer .cs-arrival-batch > header > input { width:160px; flex:0 1 160px; }
 body #callsheetContainer .cs-arrival-batch > header > button { margin-left:auto; }
 body #callsheetContainer .cs-batch-people { padding:8px 12px; gap:4px; overflow-x:auto; }
 body #callsheetContainer .cs-person-card { grid-template-columns:22px minmax(100px,1fr) minmax(100px,1fr) minmax(140px,1.2fr) 30px; gap:8px; padding:6px; min-width:470px; border:0 !important; border-radius:6px; background:var(--rl-panel) !important; }
 body #callsheetContainer .cs-person-card:nth-child(even) { background:var(--rl-panel-soft) !important; }
 body #callsheetContainer .cs-person-card > * { grid-column:auto; grid-row:1; }
 body #callsheetContainer .cs-person-card > input { min-height:32px;  }
 body #callsheetContainer .cs-person-drag { color:var(--rl-muted); }
 @keyframes cs-picker-in { from {opacity:0;transform:translateY(5px) scale(.98);} to {opacity:1;transform:translateY(0) scale(1);} }
 @media (prefers-reduced-motion:reduce) { html {scroll-behavior:auto;} body .cs-time-picker {animation:none;} }
}
@media screen {
 body .cs-timing-workspace :is(.cs-schedule-head,.cs-scene-plan) { grid-template-columns:48px minmax(150px,1.05fr) 82px 140px 82px 114px 190px 125px minmax(150px,1fr) 28px; }
 body .cs-timing-workspace :is(.cs-schedule-head,.cs-scene-plan-list) { min-width:1285px; }
}
@media screen {
 body .cs-time-picker .cs-picker-direct { width:100%; box-sizing:border-box; margin-top:10px; padding:6px 8px; color:var(--rl-ink); background:var(--rl-panel-soft); border:1px solid var(--ui-control-line); border-radius:8px; font:inherit; }
}
@media screen {
 .cs-time-date { position:relative; align-self:center; }
 .cs-time-date > summary { cursor:pointer; white-space:nowrap; color:var(--rl-muted); }
 .cs-time-date .cs-date-options { display:grid; gap:8px; padding:8px; border:1px solid var(--rl-line); border-radius:8px; background:var(--rl-panel); }
 .cs-time-date[open] { min-width:100px; }
 .cs-time-date .cs-date-options select { width:100%; }
}

/* Submenus: preserve short labels and keep controls inside their padded bounds. */
@media screen {
 body :is(.dropdown,.storyboard-fields-panel,.cs-time-picker,.cs-date-options) { box-sizing:border-box; max-width:calc(100vw - 24px); }
 body .dropdown.panel { width:340px; min-width:min(280px,calc(100vw - 24px)); }
 body :is(.dropdown,.storyboard-fields-panel,.cs-time-picker,.cs-date-options) :is(input,select,textarea,button) { box-sizing:border-box; min-width:0; max-width:100%; }
 body .dropdown :is(.panel-head,.panel-row-top) { min-width:0; gap:8px; }
 body .dropdown :is(.panel-head,.panel-row-top) > button { width:auto; flex:0 0 auto; padding:6px 8px; white-space:nowrap; }
 body .dropdown .panel-row > span { flex:0 0 auto; white-space:nowrap; }
 body .dropdown .panel-row:not(.panel-row-stack) > :is(select,input:not([type=checkbox]):not([type=radio])) { flex:1 1 0; width:0; min-width:0; }
 body .dropdown .panel-row-stack > :is(input,select,textarea) { width:100%; min-width:0; }
 body .dropdown :is(.toggle-inline,.panel-row-top > span,.panel-head > strong) { white-space:nowrap; flex-shrink:0; }
 body .storyboard-fields-panel { width:210px; }
 body .storyboard-fields-panel > label { min-width:0; }
 body .storyboard-fields-panel input[type=checkbox] { flex:0 0 auto; }
 body :is(.dropdown,.storyboard-fields-panel) :is(.column-hint,p) { overflow-wrap:anywhere; }
 body .cs-time-input { flex-wrap:wrap; align-items:flex-start; }
 body .cs-time-date { max-width:100%; min-width:0; }
 body .cs-time-date[open] { width:150px; min-width:0; }
 body .cs-time-date :is(summary,small) { white-space:nowrap; }
 body .cs-time-date .cs-date-options { width:100%; min-width:0; }
 body .cs-time-date .cs-date-options select { width:100%; min-width:0; }
 body .cs-timing-default-fields { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,170px),1fr)); }
 body .cs-timing-default-fields label { min-width:0; }
 body .cs-timing-default-fields :is(input,select) { box-sizing:border-box; max-width:100%; min-width:0; }
 body .cs-picker-actions { flex-wrap:wrap; }
 body .cs-picker-actions button { white-space:nowrap; }
}
@media screen {
 body .dropdown .panel-row > .theme-switch { width:44px !important; min-width:44px; max-width:44px; flex:0 0 44px; padding:0 !important; border:0 !important; background:transparent !important; box-shadow:none !important; }
 body .dropdown .panel-row { min-width:0; box-sizing:border-box; }
 body .dropdown .panel-row > select { max-width:calc(100% - 84px); }
 body .dropdown .panel-row-stack > select { max-width:100%; }
}
@media screen {
 body #columnSettings { width:380px; max-width:calc(100vw - 24px); }
 body #columnList .column-item { display:grid; grid-template-columns:16px 30px minmax(0,1fr); grid-template-rows:auto 32px; align-items:center; gap:4px 8px; padding:10px 6px; }
 body #columnList .col-name-editor { display:contents; }
 body #columnList .col-default-name { grid-column:3 / -1; grid-row:1; }
 body #columnList .grip { grid-column:1; grid-row:2; }
 body #columnList .eye { grid-column:2; grid-row:2; width:30px; height:30px; padding:4px; }
 body #columnList .col-name-input { grid-column:3; grid-row:2; width:100%; height:32px; box-sizing:border-box; }
 body #columnList .col-name-reset { grid-column:4; grid-row:2; width:42px !important; height:30px; padding:4px !important; white-space:nowrap; }
 body #columnList .col-status { grid-column:5; grid-row:2; white-space:nowrap; text-align:right; }
}