/* Quiet, Linear-inspired working interface. Media remains on warm beige. */
:root{--ui:-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif;--serif:var(--ui);--condensed:var(--ui);--ink:#26272b;--paper:#fafafa;--gold:#777980;--red:#777980;--muted:#777980;--rule:#e7e7ea}
body{font-family:var(--ui);font-size:14px;line-height:1.6;-webkit-font-smoothing:antialiased;background:#fafafa;color:#38393e}
h1,h2,h3,h4,p,button,input,select,textarea,span,strong{font-family:var(--ui)}
h1,h2,h3,h4{color:#24252a;font-weight:600;letter-spacing:-.025em}
h2,.control-heading h2,.call-record h2,.summary-title h2{font-size:22px;line-height:1.3}
button,input,select,textarea{font-size:13px;line-height:1.5;font-weight:400;letter-spacing:0;text-transform:none;border-radius:6px}
button{padding:7px 11px;background:#fff;border:1px solid #dddde2;color:#45464d;transition:background .15s,border-color .15s}
button:hover{background:#f2f2f5;border-color:#c6c6ce}
button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:2px solid #9294d5;outline-offset:2px}
button.primary,.file-button{background:#6265ad;border:1px solid #6265ad;color:white;font-weight:500}
button.primary:hover{background:#535698;border-color:#535698}
input,select,textarea{background:#fff;border:1px solid #dedee4;padding:9px 11px;min-width:0;box-shadow:0 1px 2px #00000003}
textarea::placeholder{color:#9899a0;font-size:13px}select{text-transform:lowercase}
.masthead{background:#fff;color:#38393e;padding:22px clamp(24px,5vw,72px) 26px;border-bottom:1px solid var(--rule)}
.masthead-rule{border:0;padding:0;color:#83848b;font-size:11px;font-weight:500;letter-spacing:.02em}
.hero-copy{display:block;margin:30px 0 24px}.hero-copy h1{font:600 clamp(25px,3vw,34px)/1.25 var(--ui);letter-spacing:-.035em;margin:6px 0 12px}
.kicker,.section-label{font:500 11px/1.4 var(--ui);letter-spacing:.015em;color:#878991;text-transform:none}
.dek{font-size:14px;line-height:1.6;color:#777980;max-width:760px;margin:0}
.hero-status{border-color:var(--rule)}.hero-status div{border-color:var(--rule);padding:14px 18px}.hero-status div:first-child{padding-left:0}
.hero-status span{font:400 11px var(--ui);letter-spacing:0;text-transform:none;color:#92939b}.hero-status strong{font:500 12px/1.5 var(--ui);letter-spacing:0;color:#565860}.hero-status .not-approved{color:#8a7852;font-size:11px;font-weight:500}
main{max-width:1500px;padding:0 clamp(20px,4vw,60px)}
.intro-playback{position:relative;display:flex;align-items:center;justify-content:center;padding:112px 32px 60px;margin:24px auto;background:#eee9e1;border:1px solid #dedbd5;border-radius:12px}
.intro-playback-copy{position:absolute;top:32px;left:32px;max-width:235px}
.intro-playback-copy h2{font:500 13px/1.4 var(--ui);letter-spacing:.01em;color:#74747d;margin:0 0 8px}
.intro-playback-copy p{font:400 12px/1.55 var(--ui);color:#9a9aa2;margin:0}
.intro-comparison{display:grid;grid-template-columns:minmax(0,1fr);gap:64px;align-items:start;justify-content:center;width:min(100%,760px)}
.intro-player{margin:0;min-width:0}.intro-player figcaption{font:400 11px/1.5 var(--ui);color:#8f9098;margin:0 0 8px}
.intro-player video{display:block;width:100%;object-fit:contain;border-radius:8px;background:#e5e1da}
.intro-player-current{width:min(100%,450px);justify-self:center}.intro-player-current video{aspect-ratio:9/16;max-height:720px}.intro-player-reference{width:100%;justify-self:center;padding-top:32px;border-top:1px solid #d8d3ca}.intro-player-reference video{aspect-ratio:16/9}
@media(max-width:980px){.intro-playback{display:grid;gap:24px;padding:22px}.intro-playback-copy{position:static;max-width:300px}.intro-comparison{width:min(100%,680px);gap:44px}.intro-player-reference{padding-top:24px}.intro-player video{margin-inline:auto}}
.beat-preview-dialog{width:min(780px,94vw);max-height:94vh;padding:22px;background:#f8f8f9;border:1px solid #dedee3;border-radius:12px}
.beat-preview-head{display:flex;align-items:flex-start;justify-content:space-between;gap:24px;padding-bottom:16px;border-bottom:1px solid #e5e5e8}
.beat-preview-head h2{font:600 19px/1.35 var(--ui);letter-spacing:-.025em;margin:6px 0 3px}
.beat-preview-head form{margin:0}.beat-preview-time{font:400 11px/1.5 var(--ui);color:#96979f;margin:0}
.beat-preview-stage{display:flex;justify-content:center;padding:22px;background:#eee9e1}
.beat-preview-stage video{display:block;width:min(420px,100%);max-height:72vh;aspect-ratio:9/16;object-fit:contain;background:#eee9e1;border-radius:7px}
.beat-preview-foot{display:flex;align-items:center;justify-content:space-between;gap:18px;padding-top:14px}
.beat-preview-foot span{font:400 11px/1.5 var(--ui);color:#a0a1a8;text-align:right}
@media(max-width:620px){.beat-preview-dialog{padding:14px}.beat-preview-stage{padding:14px}.beat-preview-stage video{max-height:68vh}.beat-preview-foot{align-items:flex-start;flex-direction:column}.beat-preview-foot span{text-align:left}}
.principle{padding:32px 0;gap:28px}.principle p:not(.section-label){font-size:14px;line-height:1.7;color:#6b6d75;margin-bottom:0}
.call-record{padding:30px 0;gap:26px;border-color:var(--rule)}.call-record h2{font-size:18px}.record-note{font-size:12px;color:#8c8e96}.call-record li{font-size:13px;line-height:1.6;padding-bottom:9px}.call-settings span{font:500 11px var(--ui);letter-spacing:0;color:#8c8e96}.call-settings strong{font:400 13px/1.6 var(--ui)}
.control-room{background:#fff;border:1px solid var(--rule);border-radius:9px;margin:28px 0;padding:24px}.control-heading h2{font-size:18px;margin-top:6px}.autosave{font:400 11px var(--ui);letter-spacing:0;color:#8b8d96}
.approval-grid{gap:16px;margin-top:20px}.approval-grid label span,.beat-controls label span,.notes-label span{font:500 12px var(--ui);letter-spacing:0;text-transform:none;color:#7e8089}
.gate{border:0;border-radius:6px;font:400 12px/1.6 var(--ui);color:#82848d;background:#f6f6f8;padding:10px 12px;margin-top:16px}
.editorial-summary{border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);padding:24px 0;align-items:center}.summary-title h2{font-size:18px;margin-top:6px}.summary-stat strong{font:500 28px/1.3 var(--ui);letter-spacing:-.025em}.summary-stat span{font:400 11px var(--ui);letter-spacing:0;text-transform:none;color:#8a8c95}.summary-note{font-size:12px;color:#8a8c95;line-height:1.6;margin-top:16px;padding-top:16px}
.sequence{padding:34px 0}.sequence-heading h2{font-size:21px;margin-top:6px}.sequence-heading p:not(.section-label){font-size:12px;color:#8a8c95}.toolbar{max-width:420px;gap:6px}
.sequence-strip{border:1px solid #e5e5e9;border-radius:7px;background:#fafafbf2;backdrop-filter:blur(12px);box-shadow:0 2px 8px #00000004;margin:22px 0;top:8px;padding:4px;gap:3px}
.sequence-strip button{color:#80828b;background:transparent;border:0;border-radius:4px;font-size:11px;min-width:40px;padding:7px 10px}.sequence-strip button:hover,.sequence-strip button.active{background:#ededf3;color:#53559a}
.cards{gap:22px}.beat-card{border:1px solid #e3e3e8;border-radius:9px;overflow:hidden;box-shadow:0 2px 4px #00000002;grid-template-columns:62px minmax(320px,1fr) minmax(360px,1.15fr);scroll-margin-top:62px}
.beat-index{padding:22px 8px;background:#fff;border-color:#ececf0;gap:16px}.drag-handle{font:500 16px var(--ui);color:#8c8e98}.timecode{font:400 10px var(--ui);letter-spacing:.015em;color:#adaeb5;font-variant-numeric:tabular-nums}
.beat-media{background:#ece8e0;padding:24px 28px 36px}.beat-copy{padding:30px}
.frame-group{margin-top:16px;padding-top:14px;border-top:1px solid #d8d3ca}
.frame-group-head{display:flex;justify-content:space-between;gap:16px;margin-bottom:9px;color:#8d8982;font-size:10px;line-height:1.4}
.frame-group-head span:first-child{font-weight:500;color:#6f6b65}
.frame-count{font-variant-numeric:tabular-nums;text-align:right}
.frame-reel{display:flex;gap:8px;overflow-x:auto;overscroll-behavior-inline:contain;padding:1px 1px 9px;scroll-snap-type:x proximity;scrollbar-width:thin;scrollbar-color:#c7c1b8 transparent}
.frame-thumb{flex:0 0 70px;padding:3px;background:#f6f3ee;border:1px solid #d6d0c7;border-radius:5px;scroll-snap-align:start;color:#8a867f}
.frame-thumb:hover{background:#fff;border-color:#aaa49b}.frame-thumb.selected{border-color:#6265ad;box-shadow:0 0 0 1px #6265ad;background:#fff}
.frame-thumb img{display:block;width:100%;aspect-ratio:9/16;object-fit:cover;border-radius:2px;background:#ece8e0}
.frame-thumb span{display:block;padding:4px 1px 1px;font-size:9px;line-height:1;font-variant-numeric:tabular-nums}
.current-poster,.frame-group{position:relative}
.beat-card.is-replaced .current-poster::after,.beat-card.is-replaced .frame-group::after{content:"";position:absolute;inset:0;z-index:3;background:#e7e3dc;opacity:.75;pointer-events:none;border-radius:3px}
.beat-card.is-replaced .current-video{opacity:.25}
.replacement-poster.frame-stack{display:grid;grid-template-columns:repeat(auto-fit,minmax(105px,1fr));gap:10px;align-items:start;justify-content:center}
.replacement-poster.frame-stack .story-frame{display:block;width:100%;max-width:none}
.replacement-poster.frame-stack[data-count="1"]{grid-template-columns:minmax(0,360px)}
.replacement-selection-hero{margin-bottom:20px}.replacement-selection-label,.replacement-options-label{margin:0 0 9px;font:500 10px/1.4 var(--ui);color:#797a82}
.replacement-selection-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;justify-content:center}.replacement-selection-grid[data-count="1"]{grid-template-columns:minmax(0,440px)}
.replacement-selection-frame{margin:0;min-width:0}.replacement-selection-frame .replacement-crop-viewport{box-shadow:0 0 0 2px #6265ad,0 12px 28px #6265ad1f;border-radius:4px}
.replacement-selection-frame figcaption{margin-top:8px;font:500 11px/1.4 var(--ui);color:#6265ad}.replacement-selection-frame>.replacement-frame-controls{margin-top:8px}
.replacement-frame-tile{min-width:0}.replacement-frame-tile[hidden]{display:none!important}.replacement-frame-visual{position:relative}.replacement-frame-controls{display:flex;align-items:center;gap:6px;margin-top:7px}
.replacement-frame-visual{border-radius:3px}.replacement-frame-visual:hover{outline-color:#6265ad66}.replacement-frame-visual:focus-visible{outline-color:#6265ad}
.replacement-frame-tile.selected .replacement-frame-visual{outline-color:#6265ad;box-shadow:0 0 0 1px #fff,0 7px 22px #6265ad26}
.replacement-frame-tile.selected .frame-selected-badge{background:#6265ad;color:#fff;border-radius:4px;font-weight:500;letter-spacing:.04em;text-transform:none}
.replacement-frame-controls .select-frame{border-color:#c9c9df;color:#6265ad}.replacement-frame-tile.selected .select-frame{background:#6265ad;border-color:#6265ad;color:#fff}
.selected-frame-controls .select-frame{background:#6265ad;border-color:#6265ad;color:#fff}
.exclude-frame{flex:0 0 auto;padding:4px 7px;font-size:10px;color:#777980}.exclusion-reason{width:100%;padding:4px 6px;font-size:10px}
.frame-exclusion-veil{display:none;position:absolute;inset:0;z-index:2;align-items:center;justify-content:center;flex-direction:column;gap:5px;padding:12px;text-align:center;background:rgba(231,227,220,.78);color:#55565c;pointer-events:none}
.frame-exclusion-veil strong{font-size:12px;font-weight:600}.frame-exclusion-veil span{font-size:9px;line-height:1.35}.replacement-frame-tile.excluded .frame-exclusion-veil{display:flex}.replacement-frame-tile.excluded .exclude-frame{color:#6265ad;border-color:#b8b9db}
@media(max-width:620px){.replacement-poster.frame-stack{grid-template-columns:repeat(2,minmax(0,1fr))}.replacement-poster.frame-stack[data-count="1"]{grid-template-columns:minmax(0,330px)}}
.media-label{font:500 10px var(--ui);letter-spacing:.01em;text-transform:none;color:#98948e;margin-bottom:18px}.media-label button{font:400 11px var(--ui);letter-spacing:0;padding:3px 5px;background:transparent;color:#7c7974}
.role{font:500 11px/1.4 var(--ui);color:#92939c;letter-spacing:0;text-transform:none}
.title{font:600 21px/1.3 var(--ui);letter-spacing:-.025em;margin:8px 0 12px}
.score-line{gap:10px}.score{font:400 12px var(--ui);color:#92939b}.decision-pill{border-radius:4px;background:#edf2ee;color:#63736a;font:500 10px/1.4 var(--ui);letter-spacing:.025em;padding:3px 6px}.decision-pill.replace,.decision-pill.remove{background:#efedf8;color:#797394}.decision-pill.hold{background:#f5f1e9;color:#95805b}
.assessment{font:400 14px/1.75 var(--ui);color:#646670;margin:20px 0}.source-line,.replacement-source{font:400 11px/1.7 var(--ui);color:#a0a1a9;letter-spacing:0}
.action-box{border-color:#ededf0;padding:18px 0;margin:22px 0}.action-box span{font:500 11px var(--ui);letter-spacing:0;text-transform:none;color:#92939c}.action-box p{font:400 14px/1.7 var(--ui);color:#555761;margin:7px 0 0}
.beat-controls{gap:12px;grid-template-columns:minmax(0,1fr) 100px auto}.order-buttons{gap:5px}.order-buttons button{width:32px;padding:9px 4px}.change-buttons{gap:8px;margin:14px 0 20px;flex-wrap:wrap}.notes-label{gap:8px}.notes-label textarea{min-height:88px}.replacement-preview{border-top:0;border-bottom:1px solid #d4cfc6;padding-top:0;padding-bottom:20px;margin-top:0;margin-bottom:24px}.replacement-preview .media-label{color:#8f8980}
.preview-segment{background:#eeeefa;border-color:#d1d2eb;color:#5558a2;font-weight:500}.preview-segment:hover{background:#e4e5f6;border-color:#bfc1e1;color:#484b93}
.direct-upload{display:inline-flex;align-items:center;padding:7px 11px;background:#fff;border:1px solid #dddde2;border-radius:6px;color:#45464d;font-size:13px;line-height:1.5;cursor:pointer;transition:background .15s,border-color .15s}
.direct-upload:hover{background:#f2f2f5;border-color:#c6c6ce}.direct-upload.working{color:#8b8d96;pointer-events:none}.direct-upload input{display:none}
dialog{border:1px solid #e2e2e8;border-radius:12px;background:#fafafa;padding:26px;box-shadow:0 24px 80px #0003}dialog::backdrop{background:#20212a66;backdrop-filter:blur(3px)}.dialog-head{border-color:var(--rule)}.dialog-head h2{font-size:24px}.dialog-note{font-size:12px;color:#8b8d97}.alternative-grid{gap:18px}.alternative{border:1px solid #e4e4e9;border-radius:8px;background:#fff;padding:18px}.alternative h3{font:600 16px/1.4 var(--ui);margin-top:16px}.alternative .alt-role{font:500 10px/1.6 var(--ui);letter-spacing:0;color:#92949d}.alternative p{font-size:12px;color:#767984}.alternative .alt-source{font:400 11px/1.6 var(--ui);color:#92949d}
.manual-source{border-color:var(--rule)}.manual-source h3{font:600 18px var(--ui)}.manual-source p{font-size:12px;color:#92949d}.file-button{font:500 12px var(--ui);letter-spacing:0;text-transform:none;border-radius:6px}.handoff{border-top:1px solid var(--rule);padding:28px 0 50px}.handoff h3{font:600 16px var(--ui)}.handoff p{font:400 12px/1.7 var(--ui);color:#888a94}.handoff article>span{font:400 11px var(--ui);color:#b0b1ba}
@media(max-width:1000px){.beat-card{grid-template-columns:48px minmax(0,1fr)}.beat-copy{grid-column:2}.hero-status div{border-color:var(--rule)}}
@media(max-width:620px){.masthead{padding:20px}.hero-copy{margin:22px 0}.hero-copy h1{font-size:25px}.title{font-size:19px}.beat-copy{padding:22px}.control-room{margin:24px 0;padding:18px}.beat-media{padding:18px 10px 28px}.beat-controls{grid-template-columns:minmax(0,1fr) 85px}.order-buttons{grid-column:1/-1;justify-content:center}.change-buttons{align-items:stretch}.change-buttons>button,.change-buttons>.direct-upload{box-sizing:border-box;width:100%;justify-content:center;text-align:center}.sequence-strip{top:0}.toolbar{justify-content:center}.summary-stat strong{font-size:25px}.handoff article{padding:16px}.hero-status div:first-child{padding-left:18px}}

/* Render timing controls */
.beat-controls{grid-template-columns:minmax(0,1fr) 145px 105px auto}
.timing-hint{margin-top:1px;color:#9a9ca4;font-size:10px}
@media(max-width:620px){.beat-controls{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.beat-controls label:first-child{grid-column:1/-1}}
@media print{.beat-card{border:1px solid #ddd;box-shadow:none}.hero-copy h1{font-size:28px}.masthead{background:white;color:#26272b}.sequence-strip{display:none}}
.replacement-crop-viewport{position:relative;overflow:hidden;aspect-ratio:9/16;width:100%;background:#ece8df}
.replacement-crop-viewport>img{display:block;width:100%;height:100%;object-fit:cover;margin:0;border:0}
.replacement-poster.frame-stack .replacement-crop-viewport>.story-frame{width:100%;height:100%;border:0;margin:0}
.replacement-frame-controls{flex-wrap:wrap}
.replacement-frame-controls button{box-sizing:border-box;min-height:34px;padding:6px 10px;font-size:12px;line-height:1.4;font-weight:400}
.replacement-frame-controls .crop-frame{color:#6260a8}
.crop-dialog{width:min(640px,calc(100vw - 24px));max-height:94dvh;overflow:auto;box-sizing:border-box}
.crop-head{display:flex;justify-content:space-between;gap:16px;align-items:start}
.crop-head h2{font-size:16px;font-weight:500;line-height:1.4;margin:6px 0;color:#303138}
.crop-head .section-label{font-size:11px;letter-spacing:.02em;color:#85858e}
.crop-help{font-size:12px;line-height:1.6;color:#74747e;margin:12px 0}
.crop-stage{background:#ece8df;display:flex;justify-content:center;padding:12px;border-radius:6px}
#cropViewport{width:min(100%,280px,34vh);cursor:grab;touch-action:none;outline-offset:3px}
#cropViewport:active{cursor:grabbing}
#cropImage{user-select:none;pointer-events:none}
.crop-grid{position:absolute;inset:0;pointer-events:none;background:linear-gradient(to right,transparent 33.1%,#ffffff70 33.1%,#ffffff70 33.4%,transparent 33.4%,transparent 66.4%,#ffffff70 66.4%,#ffffff70 66.7%,transparent 66.7%),linear-gradient(to bottom,transparent 33.1%,#ffffff70 33.1%,#ffffff70 33.4%,transparent 33.4%,transparent 66.4%,#ffffff70 66.4%,#ffffff70 66.7%,transparent 66.7%)}
.crop-zoom{display:flex;align-items:center;gap:12px;font-size:12px;margin:16px 0;color:#62626e}
.crop-zoom input{flex:1;min-width:60px;accent-color:#6562ad;padding:0}
.crop-zoom output{min-width:40px;font-variant-numeric:tabular-nums}
.crop-footer{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:8px}
.crop-footer button{font-size:12px}
.crop-footer button:disabled{opacity:.4;cursor:default}
.inventory-tools{display:grid;grid-template-columns:minmax(240px,1fr) auto;gap:8px;margin-top:20px}.inventory-tools input{min-width:0}.inventory-status{margin:12px 0 0;font:400 11px/1.5 var(--ui);color:#8d8e96}
.inventory-grid{margin-top:18px}.inventory-artwork img{height:260px;object-fit:contain;background:#f0ede7}.inventory-artwork .alt-role{margin-top:12px}.inventory-artwork h3{margin-bottom:8px}.inventory-artwork button{margin-top:10px}
@media(max-width:620px){.inventory-tools{grid-template-columns:1fr}.inventory-artwork img{height:240px}}