:root{font-family:Inter,Segoe UI,Arial,sans-serif;color:#202a3a;background:#f7f6f2;font-synthesis:none}*{box-sizing:border-box}body{margin:0}button,input,textarea{font:inherit}button{cursor:pointer}button:focus-visible,input:focus-visible,textarea:focus-visible{outline:3px solid #bf9539;outline-offset:4px}button{color:inherit}header{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:22px 4%;background:#fff;border-bottom:1px solid #e3e5e7}.brand{text-decoration:none;font-size:11px;letter-spacing:1.5px;font-weight:750;color:#243044}.brand span{color:#8a919a;margin-left:14px}.tools{display:flex;align-items:center;gap:8px}.tools button{border:1px solid #dfe2e6;background:white;border-radius:7px;padding:9px 13px;font-size:12px}.tools button:hover{background:#f2f3f4}#status{font-size:12px;color:#567663;margin-right:14px;max-width:290px}#status.error{color:#a63e32}main{max-width:1280px;margin:auto;padding:48px 32px}.intro{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin-bottom:38px}.eyebrow{font-size:10px;letter-spacing:2px;font-weight:750;color:#96752f;margin:0 0 12px}#title{border:0;background:transparent;font-family:Georgia,serif;font-size:35px;color:#202a3a;width:min(690px,65vw);padding:3px 0}.hint{font-size:14px;color:#737b87;margin:12px 0 0}#stats{font-size:12px;color:#6f7885;white-space:nowrap;padding-bottom:5px}.column-head,.row{display:grid;grid-template-columns:128px minmax(0,1fr) 310px}.column-head{padding:0 24px 13px;font-size:10px;letter-spacing:1.5px;color:#7e8792;font-weight:700}.column-head small{font-weight:400;letter-spacing:0;color:#9298a0;margin-left:12px}.row{position:relative;background:white;border:1px solid #e0e3e5;border-radius:13px;padding:24px;margin-bottom:14px;box-shadow:0 3px 12px #24304404;transition:border-color .15s}.row:hover{border-color:#bbc2ca}.voice{display:flex;align-items:center;flex-direction:column;padding-right:22px;position:relative}.speaker-button{border:0;background:transparent;padding:0;position:relative;width:84px;height:84px;overflow:hidden;border-radius:16px}.speaker-button img{width:110px;height:110px;position:absolute;left:-13px;top:-13px;pointer-events:none}.voice-name{font-size:11px;color:#737b87;margin-top:9px;text-align:center}.row-number{font-size:10px;color:#a4aab2;margin-top:9px;font-variant-numeric:tabular-nums}.row-actions{display:flex;gap:2px;margin-top:0;margin-bottom:14px}.row-actions button{background:none;border:0;border-radius:4px;padding:4px 6px;color:#86909c}.row-actions button:hover{background:#f0f2f5;color:#263448}.row-actions button:disabled{opacity:.25;cursor:default}.handle{cursor:grab!important;touch-action:none}.handle:active{cursor:grabbing!important}.script-cell{padding:1px 30px 12px 7px}.script-text,.description{display:block;width:100%;border:1px solid transparent;background:transparent;resize:none;overflow:hidden;border-radius:6px;padding:8px;line-height:1.65;color:#293347}.script-text{font-size:17px;min-height:160px}.script-text:hover,.description:hover{background:#fafaf8}.script-text:focus,.description:focus{background:#fffcf4;border-color:#e9d7ad;outline:none}.script-text::placeholder,.description::placeholder{color:#a1a7af}.visual-cell{border-left:1px solid #edf0f2;padding-left:24px}.image-zone{aspect-ratio:16/9;border:1px dashed #d5dbe1;border-radius:8px;background:#fafbfc;display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden}.image-zone.over{border-color:#ab802c;background:#fff4d9}.image-zone img{width:100%;height:100%;object-fit:contain}.image-add{border:0;background:none;color:#929ba6;display:flex;flex-direction:column;align-items:center;gap:7px;width:100%;height:100%;justify-content:center;font-size:12px}.image-add span{font-size:25px}.image-add small{font-size:10px}.image-controls{display:flex;gap:8px;margin:6px 0}.image-controls button{border:0;background:none;padding:2px 0;font-size:10px;color:#78828e}.image-controls button:hover{color:#a63737}.description{font-size:12px;padding:0;min-height:0;line-height:1.5;margin-top:6px}.description:placeholder-shown{height:20px}.description:focus{padding-left:7px}.add-row{width:100%;border:1px dashed #b8bec6;background:transparent;border-radius:11px;padding:18px;color:#5c6876;font-size:14px;display:flex;align-items:center;justify-content:center;gap:10px;margin-top:22px}.add-row:hover{background:#fff;border-color:#927233}.add-row span{font-size:23px;color:#a17e31}.footer-note{text-align:center;color:#959ca5;font-size:11px;margin-top:20px}#empty{text-align:center;padding:35px 0 30px;color:#838d99}#empty h2{font:24px Georgia,serif;color:#485464}#empty p{font-size:13px}.empty-mark{font-size:40px;color:#bda36a}.dragging{opacity:.4}.drop-before{box-shadow:0 -4px #bb923a}.drop-after{box-shadow:0 4px #bb923a}dialog{border:1px solid #e1e4e8;border-radius:18px;padding:30px;width:min(720px,92vw);box-shadow:0 24px 100px #15203133}dialog::backdrop{background:#15203166;backdrop-filter:blur(4px)}.dialog-top{display:flex;justify-content:space-between;align-items:flex-start}.dialog-top h2{font:28px Georgia,serif;margin:0 0 24px}.close{background:transparent;border:0;color:#8c949f;font-size:28px}#speakers{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.choice{display:flex;flex-direction:column;align-items:center;border:1px solid #e5e7eb;background:#fff;border-radius:12px;padding:10px;font-size:12px;gap:6px}.choice img{width:95px;height:95px}.choice:hover{border-color:#b79243;background:#fffcf4;transform:translateY(-2px)}#toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);padding:14px 20px;background:#263448;color:white;border-radius:10px;font-size:13px;box-shadow:0 5px 30px #0002;z-index:5}#toast button{margin-left:22px;background:transparent;color:#f1d68c;border:0}button[hidden],div[hidden]{display:none!important}@media(max-width:850px){header{flex-wrap:wrap;padding:18px 22px}.brand span{display:none}main{padding:30px 18px}.intro{display:block}#title{font-size:28px;width:100%}#stats{margin-top:18px}.column-head,.row{grid-template-columns:100px minmax(0,1fr) 230px}.row{padding:18px 12px}.column-head{padding-left:12px;padding-right:12px}.script-cell{padding:0 14px 0 0}.visual-cell{padding-left:14px}.voice{padding-right:12px}.column-head small{display:none}}@media(max-width:600px){.tools{flex-wrap:wrap}#status{width:100%;max-width:none}.column-head{display:none}.row{grid-template-columns:78px minmax(0,1fr)}.voice{grid-row:1/3;padding-right:10px}.speaker-button{width:64px;height:64px}.speaker-button img{width:84px;height:84px;left:-10px;top:-10px}.script-cell{padding:0}.script-text{font-size:16px;min-height:120px}.visual-cell{grid-column:2;border:0;padding:12px 7px 0}.row-actions{gap:0;flex-wrap:wrap;justify-content:center}#speakers{grid-template-columns:repeat(3,1fr)}.choice img{width:70px;height:70px}dialog{padding:20px}}@media print{body{background:white}header,.add-row,.footer-note,.row-actions,.image-controls,.image-add,#toast,#empty,.hint,#status{display:none!important}main{padding:0;max-width:none}.intro{margin-bottom:20px}#title{font-size:25px;width:100%}.row{break-inside:avoid;box-shadow:none;grid-template-columns:85px minmax(0,1fr) 220px;padding:12px}.column-head{grid-template-columns:85px minmax(0,1fr) 220px}.script-text{font-size:12px}.script-cell{padding-right:15px}.speaker-button{width:60px;height:60px}.speaker-button img{width:80px;height:80px;left:-10px;top:-10px}.visual-cell{padding-left:12px}.description{font-size:10px}.image-zone{border:0}.voice{padding-right:12px}.row-number{display:none}}

.crest-banner{display:flex;justify-content:center;margin:-20px 0 28px}.crest-banner img{display:block;width:220px;max-width:55vw;height:auto}@media(max-width:600px){.crest-banner{margin:0 0 24px}.crest-banner img{width:170px}}@media print{.crest-banner{margin:0 0 15px}.crest-banner img{width:100px}}

@media print{.description:placeholder-shown{display:none}}

.back-link{font-size:13px;color:#5c6876;text-decoration:none}.back-link:hover{text-decoration:underline}.history-main{max-width:1100px}.history-main h1{font:36px Georgia,serif;margin:0 0 12px}.history-help{font-size:14px;color:#737b87;line-height:1.6}.history-meta{display:flex;justify-content:space-between;color:#87909b;font-size:12px;margin:30px 0 12px}.version-item{display:grid;grid-template-columns:165px minmax(0,1fr) 130px;gap:24px;padding:24px;background:white;border:1px solid #e0e3e5;border-radius:12px;text-decoration:none;color:inherit;margin-bottom:12px;align-items:center}.version-item:hover{border-color:#b79a60;background:#fffefa}.version-item time{display:flex;flex-direction:column;gap:7px;font-size:13px;color:#5c6876}.version-item time strong{color:#293347;font-weight:600}.version-body h2{font-size:16px;margin:0 0 7px;font-weight:600}.version-meta{font-size:11px;color:#87909b;margin:0}.version-excerpt{font-size:13px;color:#6d7886;margin:12px 0 0;line-height:1.5;overflow-wrap:anywhere}.version-open{font-size:12px;color:#98772f;text-align:right}#more-versions{display:block;margin:24px auto;border:1px solid #cdd3da;border-radius:8px;background:white;padding:12px 22px}#history-error{color:#a63e32}#version-notice{background:#fff9e9;border:1px solid #e9d7ad;border-radius:8px;padding:12px 16px;font-size:13px;margin:0 0 22px;color:#846726}[hidden]{display:none!important}@media(max-width:600px){.version-item{grid-template-columns:110px minmax(0,1fr);gap:12px;padding:16px}.version-open{grid-column:2;text-align:left}.version-item time{font-size:11px}.history-meta{gap:15px}.history-main h1{font-size:30px}}@media print{#version-notice{display:none}}

/* The controls form a tab joined to the row, with a clear gap above it. */
#rows .row{margin-top:40px;margin-bottom:0}
#rows .row:first-child{margin-top:28px}
.voice{position:static}
.row-actions{position:absolute;top:-29px;left:24px;transform:none;z-index:2;width:112px;height:30px;display:flex;flex-wrap:nowrap;align-items:center;justify-content:center;gap:2px;margin:0;padding:2px 3px;background:#fff;border:1px solid #e0e3e5;border-bottom:0;border-radius:9px 9px 0 0;box-shadow:none}
.row-actions::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:2px;background:#fff;pointer-events:none}
.row-actions button{width:24px;height:26px;padding:0;display:flex;align-items:center;justify-content:center;font-size:14px;flex-shrink:0}
.row:hover .row-actions{border-color:#bbc2ca}
@media(max-width:850px){.row-actions{left:12px;width:100px;gap:1px}.row-actions button{width:22px}}
@media(max-width:600px){.row-actions{left:12px;width:100px}}
@media print{#rows .row,#rows .row:first-child{margin-top:14px}}

.description{text-align:center}

.view-tabs{display:flex;justify-content:center;gap:0;margin:-8px auto 28px;width:fit-content;max-width:100%;border-bottom:1px solid #cbd1d7}
.view-tabs button{border:1px solid transparent;border-bottom:0;border-radius:9px 9px 0 0;background:transparent;padding:12px 22px;font-size:13px;color:#7c8591;white-space:nowrap}
.view-tabs button:hover{background:#eeece5;color:#293347}
.view-tabs button[aria-selected="true"]{background:#fff;border-color:#cbd1d7;color:#293347;box-shadow:0 1px #fff;font-weight:600}
#reading-rows{background:#fff}
.reading-row{display:grid;grid-template-columns:40px minmax(0,1fr);gap:0;margin:0;padding:0;border:0;border-bottom:1px solid #e0e3e5;align-items:start}
.reading-row:first-child{border-top:1px solid #e0e3e5}
.reading-voice{position:relative;width:40px;height:40px;overflow:hidden;border-radius:7px;margin:0;padding:0}
.reading-voice img{position:absolute;width:52px;height:52px;left:-6px;top:-6px}
.reading-script{font-size:16px;line-height:1.35;white-space:pre-wrap;overflow-wrap:anywhere;min-width:0;margin:0;padding:0}
.with-visuals .reading-row{grid-template-columns:40px minmax(0,1fr) 250px}
.reading-visual{min-width:0;margin:0;padding:0}
.reading-visual img{display:block;width:100%;height:auto;max-height:180px;object-fit:contain;margin:0}
.reading-caption{font-size:12px;line-height:1.35;white-space:pre-wrap;overflow-wrap:anywhere;text-align:center;margin:0;padding:0}
#reading-empty{color:#7c8591;font-size:14px;text-align:center}
@media(max-width:600px){.view-tabs button{padding:10px 11px;font-size:11px}.reading-script{font-size:14px}.with-visuals .reading-row{grid-template-columns:40px minmax(0,1fr) minmax(80px,28%)}.reading-caption{font-size:11px}}
@media print{.view-tabs{display:none}}

/* Give the reading views a little breathing room while keeping rows together. */
.reading-row{padding:8px 10px;column-gap:12px;align-items:center}
.reading-script{line-height:1.45;padding:8px 10px}
@media(max-width:600px){.reading-row{padding:7px 8px;column-gap:8px}}

/* Slightly larger reading icons and a little more room around each cell. */
.reading-row{grid-template-columns:46px minmax(0,1fr);padding:10px 12px;column-gap:14px}
.with-visuals .reading-row{grid-template-columns:46px minmax(0,1fr) 250px}
.reading-voice{width:46px;height:46px;border-radius:8px}
.reading-voice img{width:60px;height:60px;left:-7px;top:-7px}
@media(max-width:600px){.reading-row{padding:9px 10px;column-gap:10px}.with-visuals .reading-row{grid-template-columns:46px minmax(0,1fr) minmax(80px,28%)}}

/* Timing sits in separate rails to the left and right of the row content. */
main:not(.history-main){max-width:1480px;padding-left:124px;padding-right:124px}
.runtime-total{text-align:center;font-size:12px;color:#7c8591;margin:-10px 0 24px;font-variant-numeric:tabular-nums}
.reading-row{position:relative}
.timecode-rail,.seconds-rail{position:absolute;top:50%;transform:translateY(-50%);width:88px;text-align:center;font-variant-numeric:tabular-nums}
.timecode-rail{left:-106px;display:flex;flex-direction:column;gap:3px;color:#687583}
.time-start{font-size:16px;font-weight:600}.time-end{font-size:10px;color:#8b95a0}
.seconds-rail{right:-106px;display:flex;flex-direction:column;align-items:center;gap:1px;background:transparent;border:1px solid transparent;border-radius:8px;padding:4px;color:#65717f}
.seconds-rail:hover{background:#fff;border-color:#d7dce2}
.seconds-label{font-size:9px;letter-spacing:1px}.seconds-value{font-size:18px;font-weight:600;line-height:1.15}.seconds-mode{font-size:9px;color:#969da6}
#duration-dialog{width:min(430px,92vw)}#duration-dialog h2{font:25px Georgia,serif;margin:0 0 12px}#duration-estimate{font-size:13px;color:#78828e;line-height:1.5}
.duration-stepper{display:flex;align-items:center;justify-content:center;gap:12px;margin:25px 0}
.duration-stepper button{width:40px;height:40px;border:1px solid #d7dce2;border-radius:8px;background:#f7f6f2;font-size:22px}
#duration-input{width:108px;text-align:center;font-size:25px;padding:9px;border:1px solid #cbd1d7;border-radius:8px;appearance:textfield}#duration-input::-webkit-inner-spin-button{appearance:none}
.duration-buttons{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.duration-buttons button{border:1px solid #d7dce2;border-radius:7px;background:#fff;padding:9px 12px;font-size:12px}#duration-auto{margin-right:auto;font-size:11px}.duration-buttons .duration-save{background:#293347;color:white;border-color:#293347}
@media(max-width:850px) and (min-width:601px){main:not(.history-main){padding-left:85px;padding-right:85px}.column-head,.row{grid-template-columns:82px minmax(0,1fr) 170px}.timecode-rail{left:-77px;width:68px}.seconds-rail{right:-77px;width:68px}.with-visuals .reading-row{grid-template-columns:46px minmax(0,1fr) 150px}}
@media(max-width:600px){main:not(.history-main){padding-left:18px;padding-right:18px}#rows .row{padding-top:58px}.timecode-rail,.seconds-rail{top:10px;transform:none;width:auto}.timecode-rail{left:12px;flex-direction:row;align-items:baseline;gap:5px}.seconds-rail{right:12px;flex-direction:row;gap:5px;padding:0 4px}.seconds-label{font-size:8px}.seconds-value{font-size:16px}.seconds-mode{font-size:8px}.time-start{font-size:14px}.reading-row{padding-top:40px}.reading-row .timecode-rail,.reading-row .seconds-rail{top:8px}}
@media print{main:not(.history-main){padding-left:65px;padding-right:65px}.timecode-rail{left:-63px;width:60px}.seconds-rail{right:-63px;width:60px}.seconds-mode{display:none}}

.column-head,.timing-head{position:relative}
.timing-head{height:25px}
.timing-heading{position:absolute;top:0;width:88px;text-align:center;font-size:10px;letter-spacing:1px;color:#7e8792;font-weight:600}
.heading-time{left:-106px}.heading-seconds{right:-106px}
@media(max-width:850px) and (min-width:601px){.timing-heading{width:68px}.heading-time{left:-77px}.heading-seconds{right:-77px}}
@media(max-width:600px){.column-head{display:block;height:15px;padding:0}.column-head>span:not(.timing-heading){display:none}.timing-heading{width:auto}.heading-time{left:12px}.heading-seconds{right:12px}}
@media print{.timing-heading{width:60px}.heading-time{left:-63px}.heading-seconds{right:-63px}}

.timing-heading{font-size:13px;font-weight:800;letter-spacing:.8px;color:#384552}
.time-start,.time-end,.seconds-value{color:#24553b}
@media(max-width:600px){.timing-heading{font-size:12px}}

.runtime-total{font-size:18px;line-height:1.5}.runtime-total strong{font-size:21px;font-weight:800;color:#24553b;margin-left:5px}

.runtime-total{font-size:clamp(24px,3vw,36px);line-height:1.2;margin:8px 0 36px}.runtime-total strong{font-size:clamp(30px,3.5vw,42px);display:inline-block;margin-left:10px}

.column-head>span:nth-child(-n+3){text-align:center}
.column-head>span:nth-child(1){padding-right:22px}
.column-head>span:nth-child(2){padding-left:7px;padding-right:30px}
.column-head>span:nth-child(3){padding-left:24px}
@media(max-width:850px){.column-head>span:nth-child(1){padding-right:12px}.column-head>span:nth-child(2){padding-left:0;padding-right:14px}.column-head>span:nth-child(3){padding-left:14px}}

/* Keep script-only reading to a comfortable paragraph width. */
#reading-panel:has(#reading-rows:not(.with-visuals)){max-width:920px;margin-left:auto;margin-right:auto}

.reading-row{grid-template-columns:92px minmax(0,1fr)}
.with-visuals .reading-row{grid-template-columns:92px minmax(0,1fr) 250px}
.reading-voice{width:92px;height:92px;border-radius:16px}
.reading-voice img{width:120px;height:120px;left:-14px;top:-14px}
@media(max-width:850px) and (min-width:601px){.with-visuals .reading-row{grid-template-columns:92px minmax(0,1fr) 150px}}
@media(max-width:600px){.with-visuals .reading-row{grid-template-columns:92px minmax(0,1fr) minmax(80px,28%)}}

.script-cell{display:flex;flex-direction:column}
.audio-panel{margin-top:auto;padding-top:18px}
.audio-note{margin-top:7px;font-size:11px;color:#879184;min-height:14px}
.audio-note.audio-error{color:#ac4534}
@media print{.audio-panel{display:none}}

/* Clip length stays between independent before/after silence steppers. */
.seconds-rail{width:124px;right:-132px;display:flex;flex-direction:row;justify-content:center;align-items:flex-start;gap:3px;padding:0;border:0;background:transparent}
.seconds-rail:hover{background:transparent;border:0}
.duration-value-button{border:0;background:transparent;border-radius:6px;min-width:50px;min-height:28px;padding:3px 0;color:#24553b}
.duration-value-button:not(:disabled):hover{background:#edf3e9}
.duration-value-button:disabled{opacity:1;cursor:default}
.silence-control{display:flex;flex-direction:column;align-items:center;gap:3px;width:30px;flex-shrink:0}
.silence-control button{width:28px;height:28px;line-height:24px;padding:0;border:1px solid #d4ddd3;border-radius:6px;background:#fff;color:#24553b;font-size:19px;font-weight:600}
.silence-control button:hover{background:#eaf1e6}
.silence-count{font-size:12px;font-weight:700;color:#24553b;line-height:1.1}
.heading-seconds{right:-132px;width:124px}
.seconds-value{font-size:17px;white-space:nowrap}
.time-start{font-variant-numeric:tabular-nums;white-space:nowrap}
.play-all-bar{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:12px;margin:-16px 0 30px;min-height:36px}
body[data-view="edit"] .play-all-bar{display:none}
#play-all,.reading-listen{background:#24553b;color:#fff;border:1px solid #24553b;border-radius:7px;font-family:inherit;font-weight:600;cursor:pointer}
#play-all{padding:10px 20px;font-size:15px}
#play-all:disabled{opacity:.5;cursor:default}
#play-all-status{font-size:13px;color:#657363;font-variant-numeric:tabular-nums}
.reading-listen{display:block;padding:5px 10px;font-size:12px;line-height:1.3;margin-top:8px;white-space:normal}
#play-all:hover,.reading-listen:hover{background:#193e2a}
.row.is-playing,.reading-row.is-playing{background:#fff1a8!important;border-color:#dbbd49;box-shadow:inset 4px 0 #dba900}
.is-playing .timecode-rail,.is-playing .seconds-rail{color:#24553b}
@media(min-width:851px){main:not(.history-main){padding-left:140px;padding-right:140px}}
@media(max-width:850px) and (min-width:601px){main:not(.history-main){padding-right:132px}.seconds-rail,.heading-seconds{right:-124px;width:118px}.seconds-value{font-size:15px}.duration-value-button{min-width:46px}}
@media(max-width:600px){#rows .row{padding-top:108px}.seconds-rail{right:12px;top:8px;width:124px;transform:none}.heading-seconds{right:12px;width:124px}.reading-row .seconds-rail{width:auto}.reading-row .duration-value-button{min-height:24px;padding:0}.play-all-bar{margin-top:-16px;gap:8px}#play-all-status{width:100%;text-align:center}}
@media print{.play-all-bar,.reading-listen,.silence-control{display:none!important}.seconds-rail,.heading-seconds{right:-63px;width:60px}.row.is-playing,.reading-row.is-playing{background:white!important;box-shadow:none}}
/* Edit timing: count above each stepper, clip length centered, total at far right. */
.row .seconds-rail{align-items:center}
.row .silence-control{position:relative;display:grid;grid-template-rows:28px 28px;justify-items:center;align-items:center;gap:3px;height:59px}
.row .silence-count{position:absolute;bottom:calc(100% + 3px);line-height:18px;white-space:nowrap}
.row .duration-value-button{display:flex;align-items:center;justify-content:center}
.row-total-seconds{position:absolute;left:132px;top:50%;transform:translateY(-50%);width:48px;height:48px;display:flex;align-items:center;justify-content:center;border:2px solid #24553b;border-radius:50%;background:#f2f7ee;color:#24553b;font-size:16px;font-weight:700;font-variant-numeric:tabular-nums}
@media(min-width:851px){body[data-view="edit"] main:not(.history-main){padding-right:196px}}
@media(max-width:850px) and (min-width:601px){body[data-view="edit"] main:not(.history-main){padding-right:188px}.row-total-seconds{left:124px}}
@media(max-width:600px){.row .seconds-rail{right:68px}.row-total-seconds{left:132px}body[data-view="edit"] .heading-seconds{right:68px}}
@media print{.row-total-seconds{display:none!important}}
/* Reading playback: pre-roll, clip, and post-roll each have their own indicator. */
.reading-row .seconds-rail{align-items:center;gap:6px}
.reading-row .duration-value-button{display:flex;align-items:center;justify-content:center;width:54px;height:54px;min-width:54px;min-height:54px;flex-shrink:0;border:2px solid #24553b;border-radius:50%;padding:0;background:#f2f7ee}
.reading-row .seconds-value{font-size:22px;font-weight:750}
.pause-circle{display:flex;align-items:center;justify-content:center;width:29px;height:29px;flex-shrink:0;border:1px solid #8ba391;border-radius:50%;background:#f7faf5;color:#24553b;font-size:13px;font-weight:700;font-variant-numeric:tabular-nums}
.reading-row .phase-playing{background:#ffda35!important;border-color:#a67800;box-shadow:0 0 0 3px #ffda3540;color:#493900}
#play-all{min-width:116px;flex-shrink:0}
#play-all-status{width:370px;max-width:100%;text-align:left}
@media(max-width:600px){.reading-row{padding-top:74px}.reading-row .seconds-rail{width:124px}.reading-row .duration-value-button{min-height:54px}#play-all-status{width:100%;text-align:center}}
@media print{.pause-circle{display:none}.reading-row .phase-playing{background:#f2f7ee!important;box-shadow:none}}

/* With no pause, only the plus remains, centered beside the clip length. */
.row .silence-control:not(.has-silence){height:28px;grid-template-rows:28px}
/* Keep playback centered, with a stable status line underneath. */
.play-all-bar{flex-direction:column;align-items:center;gap:0}
#play-all-status{width:100%;max-width:100%;min-height:22px;text-align:center;line-height:22px}





.play-primary{display:grid;grid-template-columns:minmax(0,1fr) 250px minmax(0,1fr);align-items:center;gap:14px;width:100%}
.play-primary #play-all{grid-column:2}
.music-options{grid-column:3;justify-self:start;display:flex;flex-direction:column;align-items:flex-start;gap:4px;max-width:100%;font-size:12px;color:#49664f}
.music-options label{display:flex;align-items:center;gap:7px;cursor:pointer;white-space:nowrap}
#background-music{accent-color:#24553b;width:16px;height:16px;margin:0;flex-shrink:0}
#upload-music{border:0;padding:0;background:transparent;color:#806322;text-decoration:underline;font-size:11px}
#music-track-status{font-size:10px;color:#7b8579;max-width:230px;overflow-wrap:anywhere}
@media(max-width:900px){.play-primary{display:flex;flex-direction:column;gap:0}.music-options{align-items:center;margin:0 0 10px;text-align:center}#music-track-status{max-width:100%}}
@media print{.music-options{display:none!important}}

/* Simple, matching audio controls. */
.audio-buttons{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;align-items:center}
.audio-buttons button,#play-all,#edit-upload-music,.reading-listen{border:1px solid #b8bcc2;border-radius:6px;background:#e4e6e9;color:#17191c;padding:11px 16px;font-family:inherit;font-size:14px;font-weight:600;line-height:1.25;min-height:42px;cursor:pointer}
.audio-buttons button{width:100%;min-width:0}
.audio-buttons .audio-listen{grid-column:1 / -1}
.audio-buttons button:hover,#play-all:hover,#edit-upload-music:hover,.reading-listen:hover{background:#d5d8dd;border-color:#9ba1aa}
.audio-buttons button:disabled,#play-all:disabled,#edit-upload-music:disabled{opacity:.55;cursor:default}
.audio-buttons button:focus-visible,#play-all:focus-visible,#edit-upload-music:focus-visible,.reading-listen:focus-visible{outline:2px solid #444;outline-offset:3px}
.audio-buttons button[hidden]{display:none}
#play-all{width:150px;min-width:150px}
.play-all-bar{gap:10px}
.edit-music-upload{display:none;text-align:center;margin:-12px 0 24px}
body[data-view="edit"] .edit-music-upload{display:block}
#edit-upload-music{display:inline-block;min-width:150px}
@media(max-width:600px){.audio-buttons{gap:6px}.audio-buttons button{padding:10px 6px;font-size:13px}}
@media print{.edit-music-upload{display:none!important}}

/* Artwork is reserved for the full-script Listen / Pause control. */
#play-all{position:relative;width:250px;min-width:250px;height:83.333px;padding:0;border:0;border-radius:16px;background:transparent;overflow:hidden;line-height:0;mix-blend-mode:multiply}
#play-all:hover{background:transparent;filter:brightness(1.05)}
#play-all-art{display:block;width:100%;height:100%;object-fit:contain}
.edit-music-upload #music-track-status:not(:empty){display:block;margin:8px auto 0;max-width:400px}

.reading-row{cursor:default}
.reading-text-play[role="button"]{cursor:pointer}
.reading-text-play:focus-visible{outline:3px solid #bf9539;outline-offset:3px;border-radius:2px}
.reading-row:focus-visible{outline:2px solid #24553b;outline-offset:2px}

#audio-versions-dialog{width:min(650px,94vw);max-height:80vh;overflow-y:auto}
#audio-versions-title{margin-bottom:4px}
.audio-versions-order{font-size:11px;color:#7a818a;margin:0 0 16px}
#audio-versions-status{font-size:13px;color:#526454}
#audio-versions-status:empty{display:none}
.audio-version{display:grid;grid-template-columns:82px minmax(0,1fr) 94px;align-items:center;gap:14px;padding:13px 0;border-top:1px solid #e2e4e7}
.audio-version.is-selected{background:#eff5ee}
.audio-version button{white-space:nowrap;padding:9px 8px;border:1px solid #b8bcc2;border-radius:6px;background:#e4e6e9;color:#17191c;font-size:13px;font-weight:600}
.audio-version button:hover{background:#d5d8dd}
.audio-version button:disabled{opacity:.6;cursor:default}
.audio-version-name{font-size:14px;font-weight:600}
.audio-version-detail{font-size:10px;color:#777e86;margin-top:4px;line-height:1.4}
.audio-version-text{font-size:11px;color:#636b75;margin-top:5px;line-height:1.4;white-space:pre-wrap;max-height:65px;overflow:auto}
@media(max-width:600px){.audio-buttons{grid-template-columns:repeat(2,minmax(0,1fr))}.audio-version{gap:8px;grid-template-columns:70px minmax(0,1fr) 84px}}

/* Reading pause numbers add a second; their small minus controls remove one. */
.reading-pause-control{display:flex;align-items:center;gap:3px;height:29px;flex-shrink:0}
.reading-pause-control .pause-circle{padding:0;cursor:pointer}
.reading-speaker{display:contents}
.reading-pause-control .pause-circle{touch-action:pan-y;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}
.reading-pause-control .pause-circle.is-holding{box-shadow:0 0 0 3px #bf953959}
.reading-pause-control .pause-circle:hover{background:#e5eddf;border-color:#24553b}
.reading-pause-minus{display:flex;align-items:center;justify-content:center;width:20px;height:20px;padding:0;border:1px solid #c7d3c8;border-radius:4px;background:#fff;color:#24553b;font-size:16px;line-height:1;cursor:pointer}
.reading-row .seconds-rail,#reading-panel .heading-seconds{width:170px;right:-178px}
@media(min-width:601px){body:not([data-view="edit"]) main:not(.history-main){padding-right:186px}}
@media(max-width:600px){.reading-row .seconds-rail,#reading-panel .heading-seconds{right:12px}}
.reading-pause-minus:hover{background:#e5eddf}
@media print{.reading-pause-control{display:none}}

#audio-editor-dialog{width:min(960px,96vw);max-height:92vh;overflow-y:auto}
#audio-editor-title{margin-bottom:8px}
#audio-editor-duration,.audio-editor-help{font-size:13px;color:#66716b;line-height:1.5}
#audio-editor-duration{margin:0 0 12px}
.audio-editor-help{margin:8px 0 26px}
#audio-editor-play{display:block;width:100%;margin:4px 0 16px;padding:14px 20px;border:1px solid #24553b;border-radius:6px;background:#24553b;color:#fff;font-size:16px;font-weight:700;letter-spacing:.04em;cursor:pointer}
#audio-editor-play:hover{background:#1b412d}
#audio-editor-play:disabled{opacity:.45;cursor:default}
#audio-editor-wave{position:relative;height:180px;background:#f3f6f3;border:1px solid #c7d2ca;border-radius:6px;cursor:crosshair;touch-action:none;user-select:none}
#audio-editor-wave[aria-disabled="true"]{opacity:.5;pointer-events:none}
#audio-editor-canvas{display:block;width:100%;height:180px}
#audio-editor-selection{position:absolute;top:0;bottom:0;background:#ffd34855;pointer-events:none}
.audio-editor-handle{position:absolute;top:0;bottom:0;width:16px;transform:translateX(-50%);cursor:ew-resize;z-index:2}
.audio-editor-handle::before{content:'';position:absolute;top:0;bottom:0;left:7px;width:2px;background:#a77700;pointer-events:none}
.audio-editor-handle span{position:absolute;top:-22px;left:7px;padding:3px 5px;background:#a77700;color:#fff;border-radius:3px;font-size:11px;pointer-events:none}
#audio-editor-out-handle span{left:auto;right:14px}
#audio-editor-playhead{position:absolute;top:0;bottom:0;border-left:2px solid #cc402b;pointer-events:none;z-index:3}
#audio-editor-cursor{position:absolute;top:0;bottom:0;border-left:2px solid #a77700;pointer-events:none;z-index:2}
#audio-editor-cursor span{position:absolute;top:0;left:0;transform:translateX(-50%);padding:3px 5px;background:#a77700;color:white;border-radius:3px;font-size:11px;white-space:nowrap}
#audio-editor-axis{display:flex;justify-content:space-between;font-size:10px;color:#768078;margin-top:6px;font-variant-numeric:tabular-nums}
.audio-editor-selection-controls{display:flex;align-items:center;flex-wrap:wrap;gap:16px;margin:20px 0;font-size:13px}
.audio-editor-selection-controls label{display:flex;align-items:center;gap:6px}
.audio-editor-selection-controls input{width:100px;padding:7px;border:1px solid #b8c1ba;border-radius:5px;font-variant-numeric:tabular-nums}
#audio-editor-selection-info{color:#747a74;font-size:12px}
.audio-editor-actions{display:flex;flex-wrap:wrap;gap:8px}
.audio-editor-actions button,#audio-editor-discard button,#audio-editor-silence{padding:10px 16px;border:1px solid #b8bcc2;border-radius:6px;background:#e4e6e9;color:#17191c;font-size:13px;font-weight:600}
.audio-editor-actions button:hover,#audio-editor-discard button:hover,#audio-editor-silence:hover{background:#d5d8dd}
.audio-editor-actions button:disabled,#audio-editor-silence:disabled{opacity:.45;cursor:default}
#audio-editor-save{margin-left:auto;background:#24553b;color:#fff;border-color:#24553b}
#audio-editor-save:hover{background:#193e2a}
#audio-editor-status{font-size:13px;line-height:1.4;color:#4e6654;margin:14px 0 0;min-height:18px}
#audio-editor-discard{padding:12px;margin-top:12px;background:#fff4de;border-radius:6px;font-size:13px}
@media(max-width:600px){#audio-editor-save{margin-left:0}.audio-editor-actions button{flex:1 1 auto}}

#audio-editor-silence{display:block;margin:16px 0 0}
/* Mobile reading: speaker first, timing tucked beneath the icon. */
@media screen and (max-width:600px){
 .reading-row,.with-visuals .reading-row{grid-template-columns:96px minmax(0,1fr);align-items:start;padding-top:34px;column-gap:12px}
 .reading-speaker{display:flex;flex-direction:column;align-items:center;gap:10px;grid-column:1;grid-row:1 / span 2;min-width:0}
 .reading-speaker .reading-voice{width:80px;height:80px;border-radius:14px;flex-shrink:0}
 .reading-speaker .reading-voice img{width:104px;height:104px;left:-12px;top:-12px}
 .reading-row .reading-speaker .seconds-rail{position:static;transform:none;width:100%;padding:0;gap:4px;justify-content:center}
 .reading-speaker .reading-pause-control{height:24px}
 .reading-speaker .pause-circle{width:24px;height:24px;font-size:12px}
 .reading-speaker .duration-value-button{width:40px;height:40px;min-width:40px;min-height:40px}
 .reading-speaker .seconds-value{font-size:18px}
 .reading-row .reading-script{grid-column:2;grid-row:1}
 .reading-row .reading-visual{grid-column:2;grid-row:2;margin-top:10px}
 #reading-panel .heading-seconds{display:none}
}
/* Keep adding a row within reach, with room to scroll the final row clear. */
#edit-panel{padding-bottom:90px}
.add-row{position:fixed;bottom:calc(14px + env(safe-area-inset-bottom,0px));left:50%;transform:translateX(-50%);z-index:10;width:min(420px,calc(100% - 36px));min-height:52px;margin:0;padding:14px 24px;border:1px solid #d4d7da;border-bottom:3px solid #c5c9ce;border-radius:12px;background:linear-gradient(#fff,#f5f5f5);color:#28313e;font-size:17px;font-weight:650;box-shadow:0 4px 12px #202a3a20,inset 0 1px #fff}
.add-row:hover{background:#fff;border-color:#b9bec5;box-shadow:0 5px 15px #202a3a28,inset 0 1px #fff}
.add-row:active{transform:translateX(-50%) translateY(2px);box-shadow:0 2px 5px #202a3a20;border-bottom-width:1px}

.text-tabs{display:flex;gap:6px;margin:0 0 6px 8px}.text-tabs button{border:1px solid #dfe3e7;background:#f5f6f7;color:#707987;border-radius:6px;padding:4px 10px;font-size:11px}.text-tabs button.active{background:#fff;border-color:#b79243;color:#263448;font-weight:700}.phonix-text{background:#fffaf0}.script-text[hidden]{display:none!important}
.audio-tag-picker{position:fixed;z-index:1000;overflow:auto;padding:14px;border:1px solid #cbd2d7;border-radius:12px;background:#fff;box-shadow:0 12px 40px #202a3a30;font-size:14px}
.audio-tag-header{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:10px}
.audio-tag-close{display:flex;align-items:center;justify-content:center;width:34px;height:34px;border:0;border-radius:6px;background:#fff0f0;color:#b52626;font-size:26px;line-height:1}
.audio-tag-tabs{display:flex;flex-wrap:wrap;gap:5px;border-bottom:1px solid #e0e3e5;padding-bottom:10px;margin-bottom:12px}
.audio-tag-tabs button{border:1px solid #d4d9de;border-radius:6px;background:#f4f5f6;padding:8px 10px;font-size:12px}
.audio-tag-tabs button[aria-selected="true"]{background:#24583e;border-color:#24583e;color:#fff}
.audio-tag-options{display:flex;flex-wrap:wrap;gap:8px}
.audio-tag-options button{border:1px solid #d4d9de;border-radius:7px;background:#f8faf9;padding:9px 12px;color:#244e39;min-height:38px}
.audio-tag-options button:hover{background:#e9f3ec;border-color:#7b9e88}
.text-tabs .audio-tag-trigger{background:#24583e;border-color:#24583e;color:#fff}.text-tabs .audio-tag-trigger:hover{background:#193f2c;border-color:#193f2c}
.text-tabs{flex-wrap:wrap}.text-tabs .audio-tag-clear{background:#b52c32;border-color:#b52c32;color:#fff}.text-tabs .audio-tag-clear:hover{background:#8c2025;border-color:#8c2025}
.audio-tag-group{display:flex;flex-wrap:wrap;gap:8px;width:100%;margin:0 0 6px}.audio-tag-group h3{width:100%;margin:0 0 1px;font-size:12px;font-weight:650;color:#67756e}
/* The speaker icon lifts a reading row; the green slot shows its destination. */
#reading-rows .reading-voice{cursor:grab;touch-action:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}
#reading-rows .reading-voice img{pointer-events:none;user-select:none;-webkit-user-drag:none}
.reading-voice:focus-visible{outline:3px solid #9aad28;outline-offset:4px}
.reading-voice.reading-drag-hold{outline:3px solid #d4df62;outline-offset:3px}
body.is-reading-reordering{user-select:none;-webkit-user-select:none;cursor:grabbing}
.reading-row.reading-drag-source{opacity:.3;background:#e0e5de!important;outline:3px solid #d3df50;outline-offset:-3px}
.reading-drag-source .timecode-rail,.reading-drag-source .seconds-rail{visibility:hidden}
.reading-row.reading-drag-ghost{position:fixed;z-index:2000;margin:0;pointer-events:none;background:#e7ece4eb!important;border:2px solid #80ad37;border-radius:10px;outline:3px solid #dce769;outline-offset:2px;opacity:.9;box-shadow:0 18px 36px #132c373b;transform:scale(1.02);transform-origin:center;overflow:visible}
.reading-drop-marker{position:fixed;z-index:1999;height:16px;border:4px solid #278050;border-radius:6px;background:#c8edbc;box-shadow:0 0 0 2px #ffffffc9;pointer-events:none}
.reading-reorder-status{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
@media print{.reading-drag-ghost,.reading-drop-marker,.reading-reorder-status{display:none!important}}
/* Scriptinator masthead shared by the editor and version history. */
header.scriptinator-header{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;padding:14px 0 16px}
.scriptinator-brand{display:block;width:80%;max-width:1000px;line-height:0}
.scriptinator-brand img{display:block;width:100%;height:auto;max-height:230px;object-fit:contain}
.scriptinator-header .tools{display:flex;flex-direction:column-reverse;justify-content:center;align-items:center;gap:7px;text-align:center}
.scriptinator-header #status{margin:0;max-width:90vw;font-size:11px}
.scriptinator-header .back-link{margin-top:4px}
@media(max-width:600px){header.scriptinator-header{padding:12px 0;gap:6px}.scriptinator-header .tools{flex-wrap:nowrap}.scriptinator-header #status{width:auto}}

/* Script controls remain together above the script while scrolling. */
header.script-controls-header{position:sticky;top:0;z-index:20;padding:4px 16px 10px;gap:0;box-shadow:0 3px 12px #20352a12}
.script-controls-header .scriptinator-brand{border:0;background:transparent;padding:0;width:min(560px,85vw);border-radius:8px}
.script-controls-header .scriptinator-brand img{max-height:150px}
.script-controls-header .view-tabs{margin:0 auto 2px}
.script-controls-header .view-tabs button{padding:9px 16px}
.script-controls-header .play-all-bar{display:flex;margin:0;min-height:0;gap:0}
.script-controls-header #play-all{width:210px;min-width:210px;height:70px}
.script-controls-header .runtime-music{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:8px 22px}
.script-controls-header .runtime-total{margin:0;font-size:16px;line-height:1.4;white-space:nowrap}
.script-controls-header .runtime-total strong{font-size:20px;margin-left:5px}
.script-controls-header .music-options{margin:0;font-size:13px;align-items:center}
.script-controls-header #play-all-status{font-size:11px;line-height:16px;min-height:0;margin-top:3px}
.script-controls-header #play-all-status:empty,.script-controls-header #status[hidden]{display:none}
.script-controls-header #status.error{margin:5px 0 0;font-size:12px}
@media(max-width:600px){header.script-controls-header{padding:4px 8px 8px}.script-controls-header .scriptinator-brand img{max-height:110px}.script-controls-header .view-tabs button{padding:8px 10px}.script-controls-header #play-all{width:180px;min-width:180px;height:60px}.script-controls-header .runtime-music{gap:5px 14px}.script-controls-header .runtime-total{font-size:14px}.script-controls-header .runtime-total strong{font-size:18px}.script-controls-header .music-options{font-size:12px}}
@media print{header.script-controls-header{display:none!important}}
body[data-view="edit"] .script-controls-header .play-all-bar{display:flex}

/* Script View follows each playing row beneath the pinned controls. */
body[data-view="script"] #play-all-status{display:none}
body[data-view="script"] .reading-row.is-playing:last-child::after{content:"";position:absolute;left:-1px;right:-1px;top:100%;height:var(--playback-tail,0px);background:#fff1a8;box-shadow:inset 4px 0 #dba900;pointer-events:none}
@media print{body[data-view="script"] .reading-row.is-playing:last-child::after{display:none}}

/* Prevent scroll anchoring from counteracting the masthead shrinking. */
body:has(.script-controls-header){overflow-anchor:none}
.script-controls-header .scriptinator-brand img{max-height:var(--logo-height,150px)}
@media(max-width:600px){.script-controls-header .scriptinator-brand img{max-height:var(--logo-height,110px)}}

/* Full-width view navigation and a plain, single-column print document. */
.script-controls-header .view-tabs{width:calc(100% + 32px);max-width:none;flex-shrink:0}
.script-controls-header .scriptinator-brand{min-width:0;min-height:0;overflow:hidden}
body[data-view="print"] .crest-banner,body[data-view="print"] .play-all-bar,body[data-view="print"] .runtime-music,body[data-view="print"] #play-all-status,body[data-view="print"] #version-notice{display:none!important}
#print-panel[hidden]{display:none!important}
.print-document{max-width:816px;margin:0 auto;padding:56px 64px;background:#fff;color:#202020;box-shadow:0 2px 14px #00000012;font:17px/1.65 Georgia,'Times New Roman',serif}
.print-segment{display:block;margin:0 0 26px}
.print-segment:last-child{margin-bottom:0}
.print-segment h2{font:700 18px/1.5 Georgia,'Times New Roman',serif;margin:0 0 6px;break-after:avoid}
.print-segment p{margin:0 0 0 28px;white-space:pre-wrap;overflow-wrap:anywhere;orphans:3;widows:3}
@media(max-width:600px){.script-controls-header .view-tabs{width:calc(100% + 16px)}body[data-view="print"] main{padding:20px 12px}.print-document{padding:28px 22px;font-size:16px}.print-segment p{margin-left:20px}}
@media print{body[data-view="print"] main{padding:0;margin:0;max-width:none}.print-document{padding:0;max-width:none;box-shadow:none;font-size:12pt}.print-segment h2{font-size:12pt}.print-segment{margin-bottom:18pt}}

.script-controls-header .view-tabs{margin:0 -16px 2px}
.script-controls-header .playback-controls,body[data-view="edit"] .script-controls-header .playback-controls{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,210px) minmax(0,1fr);align-items:center;gap:12px;width:min(100%,560px)}
.script-controls-header .playback-controls .runtime-total{justify-self:end;font-size:14px}
.script-controls-header .playback-controls .runtime-total strong{font-size:18px}
.script-controls-header .playback-controls #play-all{width:100%;min-width:0;height:auto;aspect-ratio:3/1;min-height:0}
.script-controls-header .playback-controls .music-options{justify-self:start}
@media(max-width:600px){.script-controls-header .view-tabs{margin-left:-8px;margin-right:-8px}.script-controls-header .playback-controls,body[data-view="edit"] .script-controls-header .playback-controls{grid-template-columns:auto minmax(0,180px) auto;gap:5px;width:min(100%,390px)}.script-controls-header .playback-controls .runtime-total{font-size:12px}.script-controls-header .playback-controls .runtime-total strong{font-size:14px;margin-left:2px}.script-controls-header .playback-controls .music-options{font-size:12px}.script-controls-header .playback-controls .music-options label{gap:4px}}

/* Edit keeps only navigation above the editor. */
body[data-view="edit"] .script-controls-header .playback-controls,body[data-view="edit"] .crest-banner,body[data-view="edit"] #play-all-status{display:none!important}
.print-runtime{text-align:center;color:#526454;font-size:18px;margin:0 auto 24px;font-variant-numeric:tabular-nums}
.print-runtime strong{color:#24553b;margin-left:6px}
#playback-time{display:none}
body[data-view="script"] .script-controls-header #playback-time:not([hidden]){display:block;margin:0;font-size:17px;line-height:1.1;font-variant-numeric:tabular-nums}
.reading-speaker{display:flex;flex-direction:column;align-items:center;gap:8px;min-width:0}
.reading-speaker .timecode-rail{position:static;transform:none;width:100%;display:flex;justify-content:center;align-items:center;text-align:center}
#reading-panel .heading-time{display:none}
@media(max-width:600px){.reading-row,.with-visuals .reading-row{padding-top:12px}.reading-speaker .timecode-rail{gap:0}.reading-speaker .time-start{width:100%;text-align:center}}

/* Project views and compact timing labels. */
[hidden]{display:none!important}
body:is([data-view="projects"],[data-view="new-project"]) :is(.crest-banner,.playback-controls,#play-all-status,.edit-music-upload,#version-notice){display:none!important}
body[data-view="visual"] :is(.crest-banner,.playback-controls,#play-all-status,.edit-music-upload,#version-notice){display:none!important}

body[data-view="visual"] main:not(.history-main){max-width:956px;width:100%;padding:18px 18px 0;margin-inline:auto}
#visual-panel{width:100%;max-width:920px;margin-inline:auto;display:grid;grid-template-columns:minmax(0,1fr) minmax(64px,12%);gap:12px;align-items:start}
#visual-panel .visual-screen{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:contain;background:#dedede}
.visual-player{min-width:0}
.visual-screen-frame{width:100%;aspect-ratio:16/9;overflow:hidden;background:#dedede}
.image-keyframe-editor{display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin:10px 0}
.image-keyframe-line{position:relative;flex:1;min-width:100px;padding-bottom:14px}
.image-keyframe-line input{display:block;width:100%;margin:0;accent-color:#24583c}
.image-keyframe-marks{position:absolute;left:7px;right:7px;bottom:0;height:14px}
.image-keyframe-marks button{position:absolute;transform:translateX(-50%);border:0;padding:0 5px;background:transparent;color:#21874e;font-size:15px;line-height:18px;touch-action:none;cursor:ew-resize;user-select:none}
.image-keyframe-add,.image-keyframe-delete{border:1px solid #b5c9bd;border-radius:4px;background:#edf5ef;color:#24583c;min-height:32px;padding:4px 9px}
.image-keyframe-time{width:100%;text-align:center;font-size:11px;color:#536759;font-variant-numeric:tabular-nums}
.image-keyframe-overlay{position:absolute;right:8px;bottom:8px;z-index:3;display:flex;gap:6px;padding:5px;border-radius:6px;background:#111b;cursor:default;touch-action:manipulation}
.image-keyframe-overlay button{min-width:44px;min-height:36px;margin:0;background:#f1f7f3;color:#24583c;font-size:15px}
.image-keyframe-overlay button:disabled{opacity:.45;cursor:default}
.image-audio-waveform{width:100%;margin:5px 0 10px}
.image-wave-plot{position:relative;height:64px;background:#f3f7f4;border:1px solid #c8d7ce;border-radius:4px;overflow:hidden}
.image-wave-plot canvas{display:block;width:100%;height:100%}
.image-wave-before,.image-wave-after{position:absolute;top:2px;text-align:center;font-size:9px;color:#63776b;overflow:hidden;white-space:nowrap;pointer-events:none}
.image-wave-before{left:0}.image-wave-after{right:0}
.image-wave-playhead{position:absolute;top:0;bottom:0;width:2px;background:#dc3345;transform:translateX(-1px);pointer-events:none}
.image-wave-playhead:before{content:'';position:absolute;top:0;left:-3px;width:8px;height:7px;background:#dc3345;clip-path:polygon(0 0,100% 0,50% 100%)}
.image-wave-axis{min-height:12px;display:flex;justify-content:space-between;font-size:10px;color:#75877c;margin-top:3px;font-variant-numeric:tabular-nums}
.image-wave-message{position:absolute;inset:0;display:grid;place-content:center;color:#63776b;font-size:12px;pointer-events:none}
.segment-image-editor .image-transform-stage{position:relative;overflow:hidden;background:#dedede;touch-action:none;cursor:grab;border:0}
.segment-image-editor .image-transform-stage:active{cursor:grabbing}
.segment-image-editor .image-transform-stage img{position:absolute;inset:0;width:100%;height:100%;max-height:none;transform-origin:center;user-select:none;pointer-events:none}
.image-transform-controls{margin:10px 0;display:grid;gap:7px}
.image-transform-controls p{margin:0 0 3px;text-align:center;font-size:12px;color:#536759}
.image-transform-controls label{display:grid;grid-template-columns:80px minmax(0,1fr) 45px;align-items:center;gap:8px;font-size:12px}
.image-transform-controls input{width:100%;min-width:0;accent-color:#24583c}
.image-transform-controls output{text-align:right;font-variant-numeric:tabular-nums}
.image-transform-controls>button{justify-self:center;background:transparent;border:0;color:#24583c;text-decoration:underline;font-size:12px}
.video-export-panel{display:none;border-top:1px solid #d5dfd8;margin:28px auto 0;padding:18px;text-align:center;max-width:956px}
body[data-view="visual"] .video-export-panel{display:block}
.video-export-options{display:flex;justify-content:center;align-items:center;gap:20px;margin-bottom:12px;font-size:14px}
.video-export-options select{padding:6px;border:1px solid #b5c9bd;border-radius:5px;background:white}
#export-video{display:block;width:min(100%,305px);min-height:42px;margin:auto;background:#24583c;color:white;border:0;border-radius:6px;font-weight:700}
#export-video:disabled{opacity:.65;cursor:wait}
#export-video-status{font-size:13px;color:#536759;margin:10px 0}
.video-export-again{border:0;background:transparent;text-decoration:underline;color:#24583c;font-size:13px}
.segment-image-timeline{position:relative;display:flex;width:100%;height:64px;margin:10px 0 8px;background:#e1e9e4;border-radius:5px}
.segment-image-tile{position:relative;min-width:0;padding:0;border:2px solid transparent;overflow:hidden;background:#ddd;border-radius:3px}
.segment-image-tile.selected{border-color:#219653}
.segment-image-tile img{width:100%;height:100%;object-fit:cover;display:block}
.segment-image-tile span{position:absolute;bottom:0;left:0;right:0;background:#173b2bdd;color:white;font-size:11px;white-space:nowrap;text-align:center}
.segment-image-cut{position:absolute;top:0;bottom:0;width:14px;transform:translateX(-50%);cursor:ew-resize;touch-action:none;z-index:2}
.segment-image-cut:after{content:'';position:absolute;left:5px;top:10px;bottom:10px;width:4px;border-radius:3px;background:#fff;box-shadow:0 0 2px #123}
.segment-image-cut:focus-visible{outline:2px solid #219653}
.segment-image-timing{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:8px;font-size:12px;color:#fff;margin-bottom:6px;padding:9px 12px;border-radius:6px;background:linear-gradient(180deg,#393939 0%,#151515 50%,#050505 100%);box-shadow:inset 0 1px 0 #ffffff20}
.segment-image-timing input{width:72px;padding:5px;border:1px solid #cbd5ce;border-radius:4px;background:#fff;color:#202a3a}
.segment-image-remove{display:flex;justify-content:flex-end;min-height:24px}
.segment-image-remove button{width:100%;min-height:42px;color:#d5283b;background:#fff5f6;border:1px solid #efb2bc;border-radius:4px;font-size:14px;font-weight:600;line-height:22px;padding:8px;margin-bottom:6px}
.segment-image-add{display:block;width:100%;margin-top:8px;border:1px solid #b5c9bd;border-radius:5px;color:#24583c;background:#edf5ef;font-size:16px;font-weight:600;min-height:42px;padding:6px 15px}
.segment-image-tile{touch-action:none;user-select:none;-webkit-touch-callout:none}
.segment-image-tile.image-holding{filter:brightness(.9)}
.segment-image-tile.image-drag-source{opacity:.3}
.image-drag-ghost{position:fixed!important;z-index:10001;pointer-events:none;transform:scale(1.08);box-shadow:0 8px 22px #10281b55;border:2px solid #219653!important;margin:0!important}
.image-insert-marker{position:fixed;width:4px;background:#219653;border-radius:3px;z-index:10002;pointer-events:none;box-shadow:0 0 0 2px white}
.segment-image-editor .image-zone{min-height:0;aspect-ratio:16/9}
.segment-image-editor .image-zone img{width:100%;height:100%;object-fit:contain}
.row-media-dialog.image-editor-mode>.dialog-top,.row-media-dialog.image-editor-mode>.row-text-editor,.row-media-dialog.image-editor-mode>.row-media-audio,.image-editor-mode .editor-visual-buttons,.image-editor-mode .visual-cell>.description{display:none!important}
.segment-image-footer{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:8px}
.segment-image-footer button{width:100%;min-height:42px;margin:0;padding:6px;border:1px solid #b5c9bd;border-radius:5px;background:#edf5ef;color:#24583c;font-size:14px;font-weight:600}
.segment-image-footer .segment-image-play{background:#24583c;color:white}
.segment-image-footer button:disabled{opacity:.5}
.visual-progress{display:flex;align-items:center;gap:12px;width:100%;min-height:30px;margin-top:6px}
.visual-progress-track{position:relative;flex:1;min-width:0;height:5px;margin-inline:6px;background:#cbd5ce;border-radius:99px}
.visual-progress-fill{height:100%;width:0;background:#219653;border-radius:inherit}
.visual-progress-dot{position:absolute;top:50%;left:0;width:12px;height:12px;border-radius:50%;background:#219653;transform:translate(-50%,-50%);box-shadow:0 0 0 2px #fff}
.visual-progress-time{flex:none;color:#24583c;font:500 12px system-ui;font-variant-numeric:tabular-nums;white-space:nowrap}
.visual-play-toggle{display:block;width:100%;margin-top:10px;min-height:44px;border:0;border-radius:6px;background:#24583c;color:white;font:600 16px system-ui;cursor:pointer}
.visual-play-toggle:disabled{opacity:.55;cursor:wait}
.visual-frames{display:flex;flex-direction:column;justify-content:space-between;gap:7px;align-self:stretch}
.visual-frame-rail{position:relative;align-self:stretch;min-height:0}
.visual-frame-rail .visual-frames{position:absolute;inset:28px 0;min-height:0}
.visual-frame-rail .visual-frame{min-height:0;flex-shrink:1}
.visual-frame-arrow{position:absolute;left:0;right:0;width:100%;height:22px;padding:0;border:1px solid #bfd0c5;border-radius:4px;background:#e8f0eb;color:#24583c;font-size:12px;line-height:20px}
.visual-frame-arrow:disabled{opacity:.35;cursor:default}
.frame-up{top:0}.frame-down{bottom:0}
.visual-frame-number{position:absolute;top:0;left:0;background:#173b2bdd;color:#fff;padding:1px 4px;font:600 10px system-ui;border-radius:0 0 3px 0}
.visual-frame{position:relative;display:block;width:100%;padding:0;aspect-ratio:16/9;border:3px solid transparent;border-radius:4px;background:#ddd;overflow:hidden;cursor:pointer}
#visual-panel .visual-frame img{display:block;width:100%;height:100%;object-fit:contain}
.visual-frame.is-active{border-color:#219653;box-shadow:0 0 0 1px #219653}
.visual-frame:focus-visible,.visual-play-toggle:focus-visible{outline:3px solid #219653;outline-offset:3px}
@media(max-width:600px){#visual-panel{gap:7px;grid-template-columns:minmax(0,1fr) 64px}.visual-frames{gap:4px}.visual-frame{border-width:2px}}
.image-zone .image-add{width:100%;padding:0;display:block;overflow:hidden}
.image-zone .image-add img{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:contain}
#projects-panel,#new-project-panel{max-width:780px;margin:auto}
#projects-panel h1,#project-form h1{font-size:28px;margin:0 0 24px}
#project-list{display:grid;gap:14px}
.project-card{display:flex;align-items:center;gap:22px;width:100%;padding:18px 22px;background:#fff;border:1px solid #d9dfdb;border-radius:14px;text-align:left;box-shadow:0 3px 12px #10281b08}
.project-card:hover{border-color:#24553b;box-shadow:0 5px 18px #10281b16}.project-card[aria-current]{border-color:#24553b}
.project-card-logo{display:flex;align-items:center;justify-content:center;flex-shrink:0;width:88px;height:88px;border-radius:10px;background:#f5f6f2;color:#24553b;font-size:30px}.project-card-logo img{width:100%;height:100%;object-fit:contain}
.project-card strong{font-size:18px;overflow-wrap:anywhere}.project-card-arrow{margin-left:auto;color:#24553b;font-size:24px}
#project-form{background:white;border:1px solid #dfe3df;border-radius:16px;padding:28px;display:flex;flex-direction:column;gap:12px}
#project-form>label:not(.project-logo-upload){font-weight:600}#project-name{width:100%;padding:12px;border:1px solid #bdc6bf;border-radius:7px;margin-bottom:12px}
.project-logo-upload{display:flex;align-items:center;justify-content:center;flex-direction:column;gap:10px;min-height:170px;padding:18px;border:2px dashed #ccd7ce;border-radius:10px;background:#f9faf8;color:#24553b;cursor:pointer}.project-logo-upload img{width:130px;height:130px;object-fit:contain}
.project-file-input{width:100%;font-size:13px}#project-form small{color:#748179}.project-form-actions{display:flex;justify-content:flex-end;gap:10px}.project-form-actions button,#projects-retry{padding:11px 18px;border:1px solid #c4cbc6;border-radius:7px;background:#f0f2ef}#project-create{background:#24553b;color:white;border-color:#24553b}
#project-form-status,#projects-status{font-size:14px;color:#506457;line-height:1.5}
.add-row-backdrop{position:fixed;bottom:0;left:0;right:0;height:calc(82px + env(safe-area-inset-bottom,0px));background:rgba(0,0,0,.8);z-index:9;pointer-events:none}
.reading-speaker .seconds-value{font-size:16px}.reading-speaker .pause-circle{font-size:12px;min-width:29px;width:29px;height:29px}.reading-speaker .seconds-rail{gap:4px}
@media(max-width:600px){.script-controls-header .view-tabs button{padding:9px 8px;font-size:13px}.reading-speaker .seconds-value{font-size:16px}.reading-speaker .pause-circle{min-width:25px;width:25px;height:25px;font-size:11px}.reading-speaker .reading-pause-control{height:25px}.reading-speaker .seconds-rail{gap:2px!important}.project-card{padding:14px;gap:14px}.project-card-logo{width:65px;height:65px}.project-card strong{font-size:16px}#project-form{padding:20px}.project-form-actions button{padding:11px 13px}}
@media print{.add-row-backdrop{display:none!important}}

/* The same pre-roll / clip / post-roll controls in both editing and reading. */
.speaker-timing .duration-value-button{display:flex;align-items:center;justify-content:center;width:54px;height:54px;min-width:54px;min-height:54px;flex-shrink:0;border:2px solid #24553b;border-radius:50%;padding:0;background:#f2f7ee}
.speaker-timing .seconds-value{font-size:16px;font-weight:750}
.speaker-timing .pause-circle{width:29px;min-width:29px;height:29px;font-size:12px}
.speaker-timing .phase-playing{background:#ffda35!important;border-color:#a67800;box-shadow:0 0 0 3px #ffda3540;color:#493900}
#rows .voice{padding-right:0;gap:8px;min-width:0;align-self:start}
#rows .voice .timecode-rail{position:static;transform:none;width:100%;display:flex;justify-content:center;text-align:center}
#rows .voice .speaker-timing{position:static;transform:none;width:100%;padding:0;gap:4px;align-items:center;justify-content:center}
#rows .voice .row-number{margin-top:0}
#edit-panel .timing-heading{display:none}
@media(min-width:601px){body[data-view="edit"] main:not(.history-main){padding-left:32px;padding-right:32px}.row,.column-head{grid-template-columns:128px minmax(0,1fr) 230px}.row .script-cell{padding-left:18px}}
@media(min-width:601px) and (max-width:850px){.row,.column-head{grid-template-columns:128px minmax(0,1fr) 170px}.row .script-cell{padding-left:12px;padding-right:12px}}
@media(max-width:600px){
 #rows .row{grid-template-columns:96px minmax(0,1fr);column-gap:12px;align-items:start;padding-top:18px}
 #edit-panel .column-head{display:none}
 #rows .voice .speaker-button{width:80px;height:80px;border-radius:14px}
 #rows .voice .speaker-button img{width:104px;height:104px;left:-12px;top:-12px}
 .speaker-timing .duration-value-button{width:40px;height:40px;min-width:40px;min-height:40px}
 .speaker-timing .pause-circle{width:25px;min-width:25px;height:25px;font-size:11px}
#rows .voice .speaker-timing{gap:2px}
}

/* Expand Phonix into the speaker space; keep media tools in a focused dialog. */
#rows .row{--speaker-column:128px;grid-template-columns:var(--speaker-column) minmax(0,1fr);column-gap:18px;align-items:start;transition:grid-template-columns .45s ease-in-out,column-gap .45s ease-in-out,border-color .15s}
#rows .row>.voice{grid-column:1;grid-row:1;width:var(--speaker-column);max-height:400px;opacity:1;transform:translateX(0);clip-path:inset(-5px);visibility:visible;transition:transform .45s ease-in-out,opacity .3s ease-in-out,clip-path .45s ease-in-out,max-height .45s ease-in-out,visibility 0s}
#rows .row>.script-cell{grid-column:2;grid-row:1;min-width:0;padding:0}
#rows .row.phonix-expanded{grid-template-columns:0px minmax(0,1fr);column-gap:0}
#rows .row.phonix-expanded>.voice{max-height:0;opacity:0;transform:translateX(-28px);clip-path:inset(0 100% 0 0);visibility:hidden;transition:transform .45s ease-in-out,opacity .3s ease-in-out,clip-path .45s ease-in-out,max-height .45s ease-in-out,visibility 0s .45s}
#edit-panel .column-head{grid-template-columns:128px minmax(0,1fr);column-gap:18px}
#edit-panel .column-head>span:nth-child(3){display:none}
#edit-panel .column-head>span{padding:0}
.script-footer{display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin-top:12px}
.script-footer button,#rows .voice .audio-listen{border:1px solid #b8bcc2;border-radius:6px;background:#e4e6e9;color:#17191c;padding:9px 13px;font-size:13px;font-weight:600;line-height:1.25;min-height:36px}
.script-footer button:hover{background:#d5d8dd}
.script-footer .phonix-generate,#rows .voice .audio-listen{background:#24553b;border-color:#24553b;color:#fff}
.script-footer .phonix-generate:hover,#rows .voice .audio-listen:hover{background:#193f2b}
#rows .voice .audio-listen{width:100%;padding:7px 5px}
.script-footer button:disabled,#rows .voice .audio-listen:disabled{opacity:.5;cursor:default}
.quick-audio-status{font-size:12px;color:#8a3932;line-height:1.5;margin-top:8px}
.quick-audio-status:empty{display:none}
.row-media-dialog{width:min(680px,calc(100vw - 24px));max-height:calc(100dvh - 32px);padding:24px;overflow:auto;color:#202a3a}
.row-media-dialog .dialog-top{gap:16px;align-items:center;margin-bottom:20px}
.row-media-dialog .dialog-top h2{margin:0;font-size:23px}
.row-media-close{border:0;border-radius:6px;background:#f5eded;color:#a33939;font-size:26px;line-height:1;width:36px;height:36px;flex-shrink:0}
.row-media-close:hover{background:#f1dcdc}
.row-media-dialog .audio-panel{margin:0 0 20px;padding:0}
.row-media-dialog .visual-cell{grid-column:auto;border:0;padding:0}
.row-media-dialog .description{min-height:64px;padding:12px;text-align:left;border:1px solid #d5dbe1;margin-top:12px;font-size:15px}
.row-media-dialog .image-controls button{padding:8px 4px;font-size:13px}
.row-media-dialog .image-add{min-height:100px}
@media(max-width:600px){
 #rows .row{--speaker-column:96px;column-gap:12px}
 #edit-panel .column-head{display:none}
 .script-footer button{padding:8px 10px;font-size:12px}
 .row-media-dialog{padding:18px}
 .row-media-dialog .dialog-top h2{font-size:20px}
}
@media(prefers-reduced-motion:reduce){#rows .row,#rows .row>.voice,#rows .row.phonix-expanded>.voice{transition:none}}

.crest-banner{flex-direction:column;align-items:center;gap:10px}
#project-script-title{display:none;margin:0;font-size:12px;line-height:1.4;color:#858b8b;text-align:center;max-width:100%;overflow-wrap:anywhere}
body[data-view="script"] #project-script-title{display:block}
#project-list{gap:24px}
.project-entry{min-width:0;padding-top:30px;position:relative}
.project-card-tabs{position:absolute;top:0;left:18px;display:flex;gap:4px;height:31px;z-index:1}
.project-card-tabs button{border:1px solid #d9dfdb;border-bottom:0;border-radius:8px 8px 0 0;background:white;padding:6px 13px;color:#24553b;font-size:12px;font-weight:600}
.project-card-tabs button:hover{background:#eef4ed}
.project-card-tabs .project-delete{color:#a33939}
.project-card-tabs .project-delete:hover{background:#fff0ee}
.project-card-tabs button:disabled{opacity:.55;cursor:wait}
.project-entry .project-card{position:relative}
.project-card-label{display:flex;flex-direction:column;gap:5px;min-width:0}
.project-card-label small{font-size:11px;font-weight:400;color:#7c867f}
.project-delete-dialog{max-width:470px}
.project-delete-dialog h2{font:600 23px/1.3 Georgia,serif;margin:0 0 14px}
.project-delete-dialog p{font-size:14px;line-height:1.6;overflow-wrap:anywhere}
.project-delete-dialog [role="alert"]{color:#a33939}
.project-confirm-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:22px}
.project-confirm-actions button{border:1px solid #b8c3bb;background:#fff;border-radius:7px;padding:10px 24px}
.project-confirm-actions .project-delete-yes{background:#a33939;color:white;border-color:#a33939}
.project-confirm-actions button:disabled{opacity:.5;cursor:wait}

.audio-export-panel{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;gap:14px;margin:34px 0 8px;padding:24px 16px;background:#f7f6f2;border-top:1px solid #dce2da}
#export-audio{width:min(100%,380px);border:1px solid #24553b;border-radius:8px;padding:14px 22px;background:#24553b;color:white;font-size:15px;font-weight:700;letter-spacing:.4px;box-shadow:0 3px 8px #17372122}
#export-audio:hover{background:#193f2b}
#export-audio:disabled{opacity:.6;cursor:wait}
.export-format{display:flex;align-items:center;gap:8px;font-size:14px;color:#526454;cursor:pointer}
.export-format input{width:17px;height:17px;accent-color:#24553b}
#export-audio-status{margin:0;max-width:560px;font-size:13px;line-height:1.5;text-align:center;color:#526454}
#export-audio-status:empty{display:none}
#export-audio-download{color:#24553b;font-size:14px;overflow-wrap:anywhere;text-align:center}
@media print{.audio-export-panel{display:none!important}}
.row-layout-bar{display:flex;justify-content:flex-start;border-bottom:1px solid #cbd1d7;margin:0 0 18px}
.row-layout-toggle{display:flex;align-items:center;gap:8px;border:1px solid #cbd1d7;border-bottom:0;border-radius:8px 8px 0 0;background:#fff;color:#24553b;padding:10px 15px;font-family:inherit;font-size:14px;font-weight:600;cursor:pointer}
.row-layout-toggle svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2}
.row-layout-toggle:not([data-layout="text"]){background:#24553b;color:white}
.row-layout-toggle:focus-visible{outline:3px solid #9aad28;outline-offset:3px}
.has-icon-grid>.timing-head,.has-icon-grid>.column-head{display:none}
#reading-rows.is-icon-grid,#rows.is-icon-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:18px;background:transparent}
#reading-rows.is-icon-grid>.reading-row,#rows.is-icon-grid>.row,.icon-grid-ghost{display:flex;align-items:center;justify-content:center;padding:12px;margin:0;border:1px solid #dce3da;border-radius:14px;background:white;aspect-ratio:1;min-width:0;box-shadow:0 3px 9px #1738200d}
#reading-rows.is-icon-grid .reading-script,#reading-rows.is-icon-grid .timecode-rail,#reading-rows.is-icon-grid .seconds-rail,#rows.is-icon-grid .row-actions,#rows.is-icon-grid .script-cell,#rows.is-icon-grid .row-number,#rows.is-icon-grid .timecode-rail,#rows.is-icon-grid .seconds-rail,.icon-grid-ghost .reading-script,.icon-grid-ghost .timecode-rail,.icon-grid-ghost .seconds-rail,.icon-grid-ghost .row-actions,.icon-grid-ghost .script-cell,.icon-grid-ghost .row-number{display:none!important}
#reading-rows.is-icon-grid .reading-speaker,#rows.is-icon-grid .voice,.icon-grid-ghost .voice,.icon-grid-ghost .reading-speaker{display:flex;align-items:center;justify-content:center;padding:0;width:100%;height:100%;gap:0}
#reading-rows.is-icon-grid .reading-voice,#rows.is-icon-grid .speaker-button,.icon-grid-ghost .reading-voice,.icon-grid-ghost .speaker-button{display:block;position:relative;flex:none;width:100%;height:auto;max-width:110px;aspect-ratio:1;border:0;border-radius:16%;margin:0;padding:0;overflow:hidden;background:transparent;touch-action:none;cursor:grab;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}
#reading-rows.is-icon-grid .reading-voice img,#rows.is-icon-grid .speaker-button img,.icon-grid-ghost .reading-voice img,.icon-grid-ghost .speaker-button img{position:absolute;width:130%;height:130%;left:-15%;top:-15%;max-width:none;pointer-events:none}
#rows.is-icon-grid .reading-drag-source,#reading-rows.is-icon-grid .reading-drag-source{opacity:.3;background:#c1e8bd!important;outline:3px solid #79b839}
.icon-grid-ghost{position:fixed!important;z-index:2000;pointer-events:none;box-sizing:border-box;background:#cce9c2ed!important;border:3px solid #329357!important;outline:2px solid #cbdf58;box-shadow:0 18px 35px #153d3440;opacity:.92;transform:scale(1.04)}
#reading-rows.is-icon-grid>.reading-row::after{display:none!important}
@media(max-width:1000px){#reading-rows.is-icon-grid,#rows.is-icon-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}}
@media(max-width:600px){#reading-rows.is-icon-grid,#rows.is-icon-grid{gap:9px}#reading-rows.is-icon-grid>.reading-row,#rows.is-icon-grid>.row{padding:7px;border-radius:10px}}
@media(max-width:350px){#reading-rows.is-icon-grid,#rows.is-icon-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media print{.row-layout-bar{display:none!important}}
#rows.is-icon-grid .audio-listen,.icon-grid-ghost .audio-listen{display:none!important}
#rows.is-icon-grid .row>.voice,#rows.is-icon-grid .row.phonix-expanded>.voice,.icon-grid-ghost.row>.voice{width:100%;max-height:none;opacity:1;transform:none;clip-path:none;visibility:visible;transition:none}
.row-list-preview{display:none}
.has-compact-list>.timing-head,.has-compact-list>.column-head{display:none}
#reading-rows.is-compact-list,#rows.is-compact-list{display:block;background:#fff}
#reading-rows.is-compact-list>.reading-row,#rows.is-compact-list>.row,.compact-list-ghost{display:grid;grid-template-columns:52px minmax(0,1fr)!important;align-items:center;gap:14px;padding:6px 10px;margin:0;min-height:64px;aspect-ratio:auto;border:0;border-bottom:1px solid #e0e3e5;border-radius:0;box-shadow:none}
#reading-rows.is-compact-list .reading-script,#reading-rows.is-compact-list .timecode-rail,#reading-rows.is-compact-list .seconds-rail,#rows.is-compact-list .row-actions,#rows.is-compact-list .script-cell,#rows.is-compact-list .row-number,#rows.is-compact-list .timecode-rail,#rows.is-compact-list .seconds-rail,#rows.is-compact-list .audio-listen,.compact-list-ghost .reading-script,.compact-list-ghost .timecode-rail,.compact-list-ghost .seconds-rail,.compact-list-ghost .row-actions,.compact-list-ghost .script-cell,.compact-list-ghost .row-number,.compact-list-ghost .audio-listen{display:none!important}
#reading-rows.is-compact-list .reading-speaker,#rows.is-compact-list .row>.voice,.compact-list-ghost .reading-speaker,.compact-list-ghost.row>.voice{display:flex;align-items:center;justify-content:center;grid-column:1;grid-row:1;width:52px;height:52px;padding:0;gap:0;max-height:none;opacity:1;transform:none;clip-path:none;visibility:visible;transition:none}
#reading-rows.is-compact-list .reading-voice,#rows.is-compact-list .speaker-button,.compact-list-ghost .reading-voice,.compact-list-ghost .speaker-button{position:relative;width:52px;height:52px;margin:0;padding:0;border:0;border-radius:9px;overflow:hidden;flex:none;touch-action:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;cursor:grab}
#reading-rows.is-compact-list .reading-voice img,#rows.is-compact-list .speaker-button img,.compact-list-ghost .reading-voice img,.compact-list-ghost .speaker-button img{position:absolute;width:68px;height:68px;left:-8px;top:-8px;max-width:none;pointer-events:none}
.is-compact-list .row-list-preview,.compact-list-ghost .row-list-preview{display:block;grid-column:2;grid-row:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:14px;line-height:1.4;color:#293347}
.is-compact-list .row-list-preview span,.compact-list-ghost .row-list-preview span{white-space:nowrap}
.compact-list-ghost{position:fixed!important;z-index:2000;box-sizing:border-box;pointer-events:none;background:#e7ece4eb!important;border:2px solid #80ad37;outline:2px solid #dce769;box-shadow:0 12px 28px #153d3440;opacity:.92}
#reading-rows.is-compact-list>.reading-row::after{display:none!important}
@media(max-width:600px){#reading-rows.is-compact-list>.reading-row,#rows.is-compact-list>.row,.compact-list-ghost{gap:10px;padding:5px 8px;min-height:62px}}
#row-delete-dialog{position:fixed;width:min(430px,calc(100vw - 32px));padding:42px 26px 26px;border-radius:14px}
#row-delete-title{font:600 20px/1.45 Inter,Segoe UI,Arial,sans-serif;margin:0 0 24px;padding-right:14px}
#row-delete-close{position:absolute;top:8px;right:9px;width:32px;height:32px;border:1px solid #d1d7dc;border-radius:5px;background:#fff;color:#6d7780;font-size:24px;line-height:1}
.row-delete-actions{display:flex;justify-content:flex-end;gap:12px}
.row-delete-actions button{min-width:78px;padding:10px 20px;border:1px solid #bcc7be;border-radius:7px;background:#fff}
#row-delete-yes{background:#a33939;border-color:#a33939;color:#fff}
body[data-view="edit"] #toast{bottom:calc(90px + env(safe-area-inset-bottom,0px));z-index:60;max-width:calc(100vw - 32px);white-space:nowrap}

/* Three numeric circles fit the speaker icon, with equal breathing room. */
#reading-rows .reading-speaker{--timing-width:92px;--timing-clip:40px;--timing-pause:22px}
#rows .voice{--timing-width:84px;--timing-clip:36px;--timing-pause:20px}
:is(#rows,#reading-rows) .speaker-timing{width:var(--timing-width)!important;min-width:var(--timing-width);padding:0;border:0;gap:4px!important;justify-content:center;-webkit-text-size-adjust:none;text-size-adjust:none}
:is(#rows,#reading-rows) .speaker-timing .duration-value-button{width:var(--timing-clip);height:var(--timing-clip);min-width:var(--timing-clip);min-height:var(--timing-clip)}
:is(#rows,#reading-rows) .speaker-timing .seconds-value{font:600 10px/1 Arial,sans-serif;letter-spacing:0}
:is(#rows,#reading-rows) .speaker-timing .pause-circle{width:var(--timing-pause);height:var(--timing-pause);min-width:var(--timing-pause);font:500 9px/1 Arial,sans-serif;letter-spacing:0;display:flex;align-items:center;justify-content:center}
@media(max-width:600px){
 #reading-rows .reading-speaker,#rows .voice{--timing-width:80px;--timing-clip:32px;--timing-pause:20px}
}
/* The row is a preview; all editing happens in the top-aligned dialog. */
#rows .row-script-preview{white-space:pre-wrap;overflow-wrap:anywhere;line-height:1.65;font-size:17px;padding:8px 0 8px 7px;align-self:start}
#rows .row-script-column{padding:0;align-self:stretch;min-width:0;display:flex;flex-direction:column}
#rows .row-script-preview{cursor:pointer}
#rows .row-script-preview:focus-visible{outline:2px solid #bf9539;outline-offset:3px;border-radius:4px}
#rows .row-edit-controls{display:flex;align-items:center;gap:8px;margin: auto 0 0 7px;padding-top:14px}
#rows .row-edit-controls button{height:40px;min-height:40px;padding:8px;border:1px solid #bfcbd2;border-radius:5px;background:#f5f7f8;display:flex;align-items:center;justify-content:center}
#rows .row-edit-controls .audio-listen{flex:1;min-width:0}
#rows .row-edit-controls .row-media-trigger{flex:0 0 40px;width:40px}
#rows .row-edit-controls svg{width:20px;height:20px;fill:currentColor;pointer-events:none}
#rows .row-edit-controls .row-media-trigger svg{fill:none;stroke:currentColor;stroke-width:1.7;stroke-linejoin:round}
#rows .row-edit-controls .audio-listen{background:#24553b;border-color:#24553b;color:white;font-weight:600}
#rows .row-edit-controls .audio-listen:hover{background:#193f2b}
#rows .row-edit-controls button:disabled{opacity:.5;cursor:default}
@media(max-width:600px){#rows .row-edit-controls{margin-left:0}}
dialog.row-media-dialog,dialog.voice-recorder-dialog{position:fixed;inset:10px 0 auto;margin:0 auto;width:min(640px,calc(100vw - 20px));max-height:calc(100dvh - 20px);padding:18px;border:1px solid #cbd3d9;border-radius:14px;box-shadow:0 12px 45px #0005;overflow:auto;overscroll-behavior:contain}
dialog.row-media-dialog::backdrop,dialog.voice-recorder-dialog::backdrop{background:#0006}
.row-media-dialog .dialog-top{margin-bottom:12px}
.row-media-dialog .dialog-top h2{font-size:21px}
.row-media-dialog .row-media-close{color:#e53b48;background:#fff;border:1px solid #ffc6cc;box-shadow:0 2px 8px #e53b4822}
.row-text-editor .text-tabs{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 10px}
.row-text-editor .text-tabs button{padding:7px 12px;min-height:34px;border:1px solid #d2dbe4;border-radius:6px;background:#edf1f5;font-size:13px;color:#182d43}
.row-text-editor .text-tabs button.active{background:#fffaec;border-color:#e8a728}
.row-text-editor .text-tabs .audio-tag-trigger{background:#e4f1ed;border-color:#bcdfd3;color:#165d45}
.row-text-editor .text-tabs .audio-tag-clear{background:#ef5765;border-color:#ef5765;color:white}
.row-media-dialog .row-text-editor .script-text{min-height:124px;max-height:36dvh;overflow-y:auto;border:1px solid #d0d9e5;background:#fafbfd;padding:12px 14px;font-size:16px;line-height:1.5}
.row-media-dialog .row-text-editor .script-text[hidden]{display:none}
.editor-character-count{text-align:right;font-size:11px;color:#718299;margin:4px 2px 10px}
.row-media-dialog .audio-panel{margin:0 0 8px}
.editor-audio-primary{display:grid;grid-template-columns:1.65fr 1fr;gap:10px;margin-bottom:8px}
.row-media-dialog .editor-audio-primary button{padding:9px 8px;min-height:40px;border:0;border-radius:6px;color:#fff;font-weight:600;background:#137450}
.row-media-dialog .editor-audio-primary .editor-listen{background:#2877c6}
.row-media-dialog .audio-buttons{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin:0}
.row-media-dialog .audio-buttons button,.editor-visual-buttons button{min-width:0;padding:9px 4px;border:1px solid #cbd6e1;border-radius:6px;background:#edf1f5;font-size:13px}
.editor-visual-buttons{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:8px}
.row-media-dialog button:disabled{opacity:.45;cursor:default}
.row-media-dialog .visual-cell .description[hidden],.row-media-dialog .editor-image-section[hidden]{display:none}
.voice-recorder-dialog .dialog-top{display:flex;justify-content:space-between;align-items:center}
.voice-recorder-dialog h2{font-size:21px;margin:0}
.voice-recorder-dialog audio{width:100%;margin-bottom:14px}
.wave-editor-top{display:flex;align-items:center;gap:10px;margin-bottom:28px}
.wave-editor-top #audio-editor-play{flex:1;margin:0;min-width:0}
#audio-editor-close{flex:0 0 40px;width:40px;height:40px;border:1px solid #ffc6cc;border-radius:6px;color:#e53b48;background:white;line-height:1}
#audio-editor-dialog .audio-editor-selection-controls{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:12px}
#audio-editor-dialog .audio-editor-selection-controls label{min-width:0}
#audio-editor-dialog .audio-editor-selection-controls input{width:100%;min-width:0;flex:1}
#audio-editor-discard{width:min(400px,calc(100vw - 32px));margin:auto;padding:22px;background:#fffaf0}
#audio-editor-discard p{margin-top:0}
#audio-editor-discard button{margin:4px 4px 0 0}
#audio-editor-status:empty{display:none}
@media(max-width:600px){#rows .row-script-preview{font-size:16px;padding-left:0}dialog.row-media-dialog{padding:14px}.row-text-editor .text-tabs{gap:6px}.row-text-editor .text-tabs button{padding:7px 10px}.row-media-dialog .audio-buttons{gap:5px}.row-media-dialog .audio-buttons button{font-size:12px}}

/* Folder tabs join the selected script editor; tag tools belong only to Phonix. */
.row-text-editor .text-tabs{align-items:flex-end;margin:0;gap:6px;padding-top:4px;flex-wrap:nowrap}
.row-text-editor .text-tabs .editor-folder-tab{position:relative;flex-shrink:0;margin-bottom:-1px;padding:10px 14px;border-radius:9px 9px 0 0;border-color:#d0d9e5;background:#e3e7ec;color:#7a8592;z-index:1}
.row-text-editor .text-tabs .editor-folder-tab.active{padding-top:13px;background:#fafbfd;border-color:#d0d9e5;border-bottom-color:#fafbfd;color:#182d43;font-weight:700;z-index:2}
.row-text-editor .text-tabs .audio-tag-trigger,.row-text-editor .text-tabs .audio-tag-clear{margin-bottom:6px;padding:7px 10px;min-height:32px;white-space:nowrap}
.row-text-editor .text-tabs button[hidden]{display:none!important}
.row-media-dialog .row-text-editor .script-text{border-top-left-radius:0}
@media(max-width:380px){.row-text-editor .text-tabs{gap:4px}.row-text-editor .text-tabs .editor-folder-tab{padding-left:10px;padding-right:10px}.row-text-editor .text-tabs .audio-tag-trigger,.row-text-editor .text-tabs .audio-tag-clear{padding-left:7px;padding-right:7px;font-size:12px}}

.audio-emotion-headings{display:flex;align-items:center;flex-wrap:wrap;gap:3px 7px;width:100%;color:#96a099}
.audio-tag-options .audio-emotion-headings button{border:0;border-radius:0;background:transparent;min-height:32px;padding:3px 0;font-size:13px;font-weight:650;color:#67756e}
.audio-tag-options .audio-emotion-headings button:hover,.audio-tag-options .audio-emotion-headings button[aria-expanded="true"]{background:transparent;color:#24583e;text-decoration:underline;text-underline-offset:4px}
.audio-tag-group[hidden]{display:none!important}

.row-media-dialog .editor-icon-button{display:flex;align-items:center;justify-content:center;min-height:42px}
.row-media-dialog .editor-icon-button svg{width:22px;height:22px;flex:none;pointer-events:none}
.row-media-dialog .editor-audio-primary .editor-icon-button svg{width:24px;height:24px}
/* Downward-facing layout tabs and the full-width film timeline share the sticky header. */
.layout-tabs{display:flex;justify-content:center;align-self:stretch;margin:-2px -16px 6px;border-top:1px solid #cbd1d7}
.layout-tabs[hidden],.script-filmstrip[hidden]{display:none}
.layout-tabs button{border:1px solid transparent;border-top:0;border-radius:0 0 9px 9px;background:transparent;padding:9px 16px;color:#7c8591;font:inherit;font-size:13px;white-space:nowrap}
.layout-tabs button:hover{background:#eeece5;color:#293347}
.layout-tabs button[aria-selected="true"]{background:#fff;border-color:#cbd1d7;color:#293347;font-weight:600;box-shadow:0 -1px #fff}
.script-filmstrip{align-self:stretch;margin:0 -16px 5px;padding:5px 8px 0;background:#f6f7f5}
.film-track{position:relative;height:66px;background:#dce3df;border:1px solid #bac9c0}
.film-frames{display:flex;width:100%;height:100%;overflow:hidden}
.film-frame{flex-shrink:0;min-width:0;height:100%;border-right:1px solid #fff;box-sizing:border-box;overflow:hidden;position:relative}
.film-frame img{width:100%;height:100%;object-fit:cover;display:block}
.film-frame.is-current:after{content:'';position:absolute;inset:0;border:2px solid #16984d;pointer-events:none}
.film-playhead{position:absolute;top:-4px;bottom:-4px;width:2px;background:#e32f45;transform:translateX(-1px);z-index:2;pointer-events:none}
.film-playhead:before{content:'';position:absolute;top:0;left:-4px;border-left:5px solid transparent;border-right:5px solid transparent;border-top:7px solid #e32f45}
.film-axis{display:flex;justify-content:space-between;font-size:10px;line-height:16px;color:#536759;font-variant-numeric:tabular-nums}
@media(max-width:600px){.layout-tabs{margin-left:-8px;margin-right:-8px}.layout-tabs button{padding:8px 11px;font-size:12px}.script-filmstrip{margin-left:-8px;margin-right:-8px}.film-track{height:50px}}
@media print{.layout-tabs,.script-filmstrip{display:none!important}}

.film-track{height:132px}
.visual-frame-rail .visual-frames{justify-content:flex-start;gap:0}
.visual-frame-rail .visual-frame{flex-shrink:0;box-sizing:border-box}
.visual-player-actions{display:flex;gap:8px;margin-top:10px}
.visual-player-actions .visual-play-toggle{flex:1;width:auto;margin-top:0}
.visual-export-open{display:flex;align-items:center;justify-content:center;gap:7px;padding:0 15px;border:1px solid #bfc5c7;border-radius:6px;background:#e4e7e8;color:#344047;font:600 14px system-ui;min-height:44px}
.video-export-dialog{width:min(420px,calc(100vw - 32px));box-sizing:border-box;border:1px solid #cbd1d7;border-radius:12px;padding:20px}
.video-export-dialog::backdrop{background:#0007}
.video-export-dialog .video-export-panel{display:block;border:0;margin:0;padding:12px 0 0}
.video-export-dialog h2{font-size:20px;margin:0}
@media(max-width:600px){.film-track{height:100px}.visual-export-open{padding:0 10px;font-size:12px;gap:5px}}

/* Compact player and a contiguous thumbnail rail. Image gestures remain custom. */
html{touch-action:pan-x pan-y}
.visual-frame-rail{display:flex;flex-direction:column;align-items:stretch}
.visual-frame-rail .visual-frames{position:static;flex:none}
.visual-frame-rail .visual-frame-arrow{position:static;flex:none;background:#24583c;color:#fff;border-color:#24583c;border-radius:0}
.visual-frame-rail .visual-frame-arrow:disabled{opacity:1;background:#688b77;border-color:#688b77;color:#fff}
@media(max-width:600px){
 body[data-view="visual"] main:not(.history-main){padding:0;max-width:none}
 body[data-view="visual"] .script-controls-header{padding-bottom:0}
 body[data-view="visual"] .script-filmstrip{margin-bottom:0}
 #visual-panel{gap:0;max-width:none}
 .visual-player-actions{margin-top:0}
 .visual-progress{margin-top:0;min-height:26px}
}

.project-card-media{display:flex;flex-direction:column;align-items:center;gap:7px;min-width:0}.project-storage-size{font-size:12px;color:#536759;white-space:nowrap;font-variant-numeric:tabular-nums}#projects-total-size{text-align:center;color:#24583c;font-weight:600;margin:0 0 24px}

.script-filmstrip{background:#000}
.film-axis{color:#fff}
.visual-frame-rail{overflow:hidden}
.visual-frame-rail .visual-frames{flex:1;min-height:0;overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain;touch-action:pan-y;-webkit-overflow-scrolling:touch;scrollbar-width:none}
.visual-frame-rail .visual-frames::-webkit-scrollbar{display:none}
.visual-frame-rail .visual-frame{height:var(--frame-height);min-height:var(--frame-height);aspect-ratio:auto}
.visual-frame-rail .visual-frame img{pointer-events:none}

.film-runtime{text-align:center;background:#000;color:#fff;padding:6px 0 9px;font-size:14px;font-weight:600;font-variant-numeric:tabular-nums}
body[data-script-layout="film"] #runtime-label,body[data-script-layout="film"] #runtime-value{display:none}
body[data-script-layout="film"] main:not(.history-main){padding-left:0;padding-right:0;max-width:none}
body[data-script-layout="film"] .playback-controls{align-items:center;margin-inline:auto}
body[data-script-layout="film"] .script-controls-header .runtime-total{align-self:center}
body[data-script-layout="film"] main:not(.history-main){overflow-x:clip}

/* One playback layout across every Script subview. */
body[data-view="script"] #runtime-label,body[data-view="script"] #runtime-value{display:none}
body[data-view="script"] .script-controls-header .playback-controls{margin-inline:auto;align-items:center;grid-template-columns:minmax(0,1fr) minmax(0,210px) minmax(0,1fr)}
body[data-view="script"] .script-controls-header .runtime-total{align-self:center}
@media(max-width:600px){body[data-view="script"] .script-controls-header .playback-controls{grid-template-columns:minmax(0,1fr) minmax(0,180px) minmax(0,1fr)}}

body[data-view="script"]:is([data-script-layout="script"],[data-script-layout="list"]) main:not(.history-main){padding-left:0;padding-right:0;max-width:none;overflow-x:clip}

.visual-player-actions{gap:0}
.visual-player-actions .visual-play-toggle,.visual-export-open{border-radius:0}
.visual-export-open{width:100px;flex:none;padding-inline:8px}
.visual-progress{gap:0}
.visual-progress-time{width:100px;text-align:center;padding-inline:3px;font-size:11px}
.film-heading{position:relative;background:#000;min-height:36px}
.film-heading .film-runtime{padding-inline:65px}
.film-zoom{position:absolute;right:0;top:3px;background:#252525;color:#fff;border:1px solid #777;border-radius:4px;padding:4px 8px;font-size:12px;min-width:52px;min-height:28px}
.film-track{overflow:hidden;touch-action:none}
.film-frames{will-change:transform;transform-origin:left center}
.film-frames{position:relative}
.film-cut{display:none;position:absolute;top:0;bottom:0;width:14px;transform:translateX(-50%);cursor:ew-resize;touch-action:none;z-index:3}
body[data-view="visual"] .film-cut{display:block}
.film-cut:after{content:'';position:absolute;left:5px;top:9px;bottom:9px;width:4px;border-radius:3px;background:#fff;box-shadow:0 0 3px #123}
.film-cut:focus-visible{outline:2px solid #168eea}
.film-frame:focus-visible{outline:2px solid #168eea;outline-offset:-3px}
.film-frame.image-drag-source{opacity:.3}
body[data-view="visual"] .film-frame{cursor:grab}

.segment-image-editor>.image-keyframe-time{display:block;text-align:center;margin:7px 0;font-size:12px}
.image-keyframe-actions{display:flex;align-items:center;gap:7px;width:100%}
.image-keyframe-actions .image-controls-toggle{margin-right:auto;border:1px solid #b5c9bd;border-radius:4px;background:#edf5ef;color:#24583c;padding:7px 10px;min-height:36px;font-size:13px}
.image-keyframe-actions .image-keyframe-add,.image-keyframe-actions .image-keyframe-delete{min-width:48px;min-height:36px}
.image-keyframe-actions button:disabled{opacity:.45}

.segment-image-editor>.segment-image-play{display:block;width:100%;min-height:42px;margin:8px 0 0;border:1px solid #24583c;border-radius:4px;background:#24583c;color:white;font-weight:600}
.image-keyframe-actions .image-controls-toggle{flex:1;margin-right:0}
.segment-image-editor .segment-image-footer{grid-template-columns:minmax(0,1fr) auto}
.segment-image-footer .segment-image-close{min-width:90px}

body[data-view="script"] #reading-panel{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}

#rows .row-text-editor .editor-timing{position:static;transform:none;display:flex!important;align-items:center;justify-content:center;width:100%!important;margin:10px auto 4px;gap:8px!important;visibility:visible;opacity:1}
#rows .row-text-editor .editor-timing .duration-value-button{width:44px;height:44px;min-width:44px;min-height:44px}
#rows .row-text-editor .editor-timing .seconds-value{font-size:17px}
#rows .row-text-editor .editor-timing .pause-circle{width:28px;height:28px;min-width:28px;font-size:12px}

body[data-view="script"] #reading-panel,body[data-view="script"] #reading-panel *{-webkit-user-select:none!important;user-select:none!important;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent}
/* Keep the shared editor in its original row while exposing its modal from Story and Visual. */
body:is([data-view="script"],[data-view="visual"]) #edit-panel:has(.row-media-dialog[open]){display:block!important;height:0}
body:is([data-view="script"],[data-view="visual"]) #edit-panel> :not(#rows){display:none!important}
body:is([data-view="script"],[data-view="visual"]) #rows>.row{display:none!important}
body:is([data-view="script"],[data-view="visual"]) #rows>.row:has(.row-media-dialog[open]){display:block!important;height:0;margin:0;padding:0;border:0}
body:is([data-view="script"],[data-view="visual"]) #rows>.row:has(.row-media-dialog[open])>:not(.row-media-dialog){display:none!important}

.image-keyframe-auto{display:flex;align-items:center;gap:3px;white-space:nowrap;font-size:12px;color:#24583c}.image-keyframe-auto input{accent-color:#24583c}
.image-keyframe-clear{min-height:36px;min-width:34px;border:1px solid #d9b5b5;border-radius:4px;background:#fff5f5;color:#a52b36}
.keyframe-clear-dialog{max-width:calc(100vw - 32px);width:360px;border:1px solid #cbd3d9;border-radius:10px;padding:20px;text-align:center}.keyframe-clear-dialog::backdrop{background:#0007}.keyframe-clear-dialog button{padding:8px 24px;margin:5px;border:1px solid #b5c9bd;background:#edf5ef;border-radius:4px}
@media(max-width:600px){.image-keyframe-actions{gap:4px}.image-keyframe-actions .image-controls-toggle{padding:6px;font-size:12px}.image-keyframe-actions .image-keyframe-add,.image-keyframe-actions .image-keyframe-delete{min-width:34px;padding:4px}.image-keyframe-auto{font-size:11px}}

/* Unified image animation toolbar. */
.image-keyframe-actions{display:grid;grid-template-columns:minmax(0,1.8fr) repeat(2,minmax(0,.7fr)) minmax(0,1.15fr) minmax(0,.65fr);gap:5px;align-items:stretch}
.image-keyframe-actions .image-controls-toggle,.image-keyframe-actions .image-keyframe-add,.image-keyframe-actions .image-keyframe-delete,.image-keyframe-actions .image-keyframe-auto,.image-keyframe-actions .image-keyframe-clear{display:flex;align-items:center;justify-content:center;box-sizing:border-box;min-width:0;width:100%;height:40px;min-height:40px;margin:0;padding:0 4px;border:1px solid #bed0c5;border-radius:5px;background:#edf5ef;color:#28583f;font:500 12px/1.1 system-ui;white-space:nowrap;gap:3px}
.image-keyframe-actions .image-keyframe-auto{position:relative;cursor:pointer;user-select:none}
.image-keyframe-auto input{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:pointer}
.image-keyframe-actions .image-keyframe-auto:has(input:checked){background:#24583c;border-color:#24583c;color:#fff}
.image-keyframe-actions .image-keyframe-auto:focus-within{outline:2px solid #bf9539;outline-offset:2px}
.image-keyframe-actions button:hover,.image-keyframe-actions .image-keyframe-auto:hover{border-color:#7ea58d}
.image-keyframe-actions button:disabled{opacity:.45;cursor:default}
@media(max-width:380px){.image-keyframe-actions{gap:3px}.image-keyframe-actions .image-controls-toggle{font-size:11px}}