/* Caption Studio — vivid workspace. Functional layout rules remain in style.css. */
:root {
  color-scheme:light;
  --bg:#f0f1f8; --panel:#fff; --panel2:#f3f3fb; --line:#c8cee0;
  --ink:#17213c; --muted:#536079; --silver:#5132b6; --good:#08734e;
  --bad:#b42336; --radius:18px; --accent:#6539d4; --focus:#164eb6;
  font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;
}
body {background:radial-gradient(ellipse at 85% 0,#e9e3ff 0,transparent 42%),var(--bg);color:var(--ink)}
h1 {font-size:clamp(30px,3vw,44px);letter-spacing:-1.6px;font-weight:800;line-height:1.12}
h2 {font-size:20px;font-weight:750;color:var(--ink)}
h3 {font-weight:700}
.eyebrow {color:#635583;font-size:11px;letter-spacing:.14em;font-weight:800}
.small {color:var(--muted);font-size:14px}
.page-description {font-size:16px;color:#58617b;margin:12px 0 0;line-height:1.5}
button,.button {min-height:42px;border-radius:10px;background:#fff;border-color:#9ca8c1;color:#273451;font-size:14px;font-weight:700;transition:background .18s,border-color .18s,box-shadow .18s,transform .18s}
button:hover,.button:hover {background:#f1edff;border-color:#7451c4;color:#422385;box-shadow:0 3px 10px #3728680a}
button:active:not(:disabled) {transform:translateY(1px)}
button:disabled {opacity:1;color:#737c91;background:#e8ebf2;border-color:#c6ccda;box-shadow:none}
.primary {background:#6335cc;color:#fff;border-color:#6335cc;box-shadow:0 5px 14px #6335cc22}
.primary:hover:not(:disabled) {background:#4e23ab;border-color:#4e23ab;color:#fff;box-shadow:0 6px 20px #6335cc30}
.secondary {background:#f0eaff;color:#50299b;border-color:#b5a1df}
.quiet {background:transparent;color:#485570;border-color:#aeb9cc}
.link {min-height:32px;background:transparent;color:#5830af;font-size:13px;border:0;box-shadow:none}
.link:hover {background:transparent;color:#341878;text-decoration:underline;box-shadow:none}
.icon {min-width:36px;min-height:36px;padding:3px 8px}
:focus-visible {outline:3px solid var(--focus);outline-offset:3px}
button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,a:focus-visible,summary:focus-visible,[tabindex]:focus-visible {outline:3px solid var(--focus);outline-offset:3px}
.skip-link {position:fixed;top:10px;left:12px;z-index:1000;background:#fff;color:#17213c;padding:12px 20px;border-radius:8px;transform:translateY(-160%)}
.skip-link:focus {transform:translateY(0)}
#studio {grid-template-columns:238px minmax(0,1fr)}
.sidebar {background:radial-gradient(ellipse at top left,#292146,transparent 55%),#121a2e;border-color:#26334d;padding:29px 19px;color:#f7f8ff;overflow-y:auto;scrollbar-width:thin;scrollbar-color:#7d75a1 #121a2e}
.brand {margin:0 4px 39px;gap:11px;font-size:12px;letter-spacing:.13em;color:#fff}
.brand img {width:48px;height:48px;border:1px solid #566282;box-shadow:0 4px 14px #0004}
.brand b {font-size:10px;color:#b7add8;letter-spacing:.17em}
.sidebar .eyebrow {color:#b2bfd9;font-size:10px}
.sidebar nav {gap:7px}
.nav {min-height:47px;padding:11px 13px;border-radius:11px;color:#c0cbe3;background:transparent;border-color:transparent;font-weight:650}
.nav:hover {color:#fff;background:#263047;border-color:#4a5270;box-shadow:none}
.nav.active {background:#7045d8;color:#fff;border-color:#9872eb;box-shadow:0 4px 16px #08081542,inset 3px 0 #d6c5ff}
.nav span {font-size:12px;font-weight:700;color:inherit;min-width:25px;padding:3px 6px;background:#ffffff13;border-radius:6px;text-align:center}
.sidebar .icon {color:#d6caf7;background:#263047;border-color:#4c526e}
.sidebar-rule {background:#35415a;margin:26px 0 17px}
.character {color:#dae3f7;border-radius:10px;background:transparent;border-color:transparent;min-height:59px}
.character:hover,.character.active {color:#fff;background:#29324b;border-color:#63708f;box-shadow:none}
.character-name {font-size:14px}
.character small {color:#b9c5dd}
.avatar {background:#c7b5ff;color:#36206c;width:35px;height:35px;box-shadow:0 2px 7px #0002}
.sidebar-bottom {color:#b8c6dd;font-size:12px;padding-top:24px}
.status-dot {width:7px;height:7px;background:#19b983;box-shadow:0 0 0 3px #19b98318}
main {padding:28px 32px 64px;max-width:2000px}
main>header {margin:22px 0 28px;align-items:center}
.header-right {gap:10px;flex-wrap:wrap;justify-content:flex-end}
#storage-status {color:#526078;background:#fff;border-color:#c2ccde;white-space:normal;max-width:210px;font-size:12px}
.pill {color:#493779;background:#eee8fa;border-color:#c6b6e5;font-weight:650}
.workspace-links {margin:0 0 18px;border-bottom:1px solid #ced2e1;padding:0 0 12px}
.workspace-links>summary {display:flex;align-items:center;justify-content:space-between;gap:12px;cursor:pointer;list-style:none;font-size:12px;color:#52607d;font-weight:650;padding:4px 0}
.workspace-links>summary::-webkit-details-marker {display:none}
.workspace-links>summary>span {color:#65419b}
.workspace-links[open] .grid-tiers {margin-top:14px;margin-bottom:0}
.grid-tiers {background:#181b32;border-color:#565476}
.grid-tier {min-height:44px}
.grid-tier:hover {color:#fff}
.workflow-strip {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;border:0;padding:0;margin:0 0 24px}
.workflow-strip button {min-width:0;min-height:78px;justify-content:flex-start;text-align:left;background:#fff;border:1px solid #c5cce0;padding:15px 17px;gap:13px;border-radius:14px;box-shadow:0 3px 10px #18264705}
.workflow-strip b {display:grid;place-items:center;flex-shrink:0;width:36px;height:36px;border:0;border-radius:10px;margin:0;padding:0;color:#5735ac;background:#ece5ff;font-size:13px}
.workflow-strip button:nth-child(2) b {background:#d9f1f5;color:#066478}
.workflow-strip button:nth-child(3) b {background:#e0f3e9;color:#146348}
.workflow-strip span {font-size:14px;font-weight:750;color:#253352;min-width:0}
.workflow-strip small {display:block;font-size:12px;color:#67718a;font-weight:450;margin-top:3px}
.workflow-strip i {margin-left:auto;color:#8490a7;font-style:normal}
.workflow-strip button:hover {border-color:#805bcd;transform:translateY(-2px)}
.panel {background:#fff;border:1px solid #c7cee0;border-radius:var(--radius);box-shadow:0 4px 16px #17264705;padding:23px}
.section-title {gap:14px;margin-bottom:22px}
.section-title .eyebrow {color:#5834a5;background:#eee8fb;padding:5px 8px;border-radius:6px}
.editor-grid {grid-template-columns:minmax(260px,1fr) minmax(280px,1.16fr) minmax(270px,1fr);gap:22px;align-items:start}
.source-panel,.settings-panel,#batch-panel {scroll-margin-top:24px}
label {font-size:13px;color:#37445d;font-weight:700;margin-bottom:18px;line-height:1.5}
input:not([type=checkbox]):not([type=range]):not([type=color]),select,textarea {background:#f9faff;color:#15223c;border:1px solid #7f8fab;border-radius:9px;min-height:44px;padding:11px 12px;font-size:14px;box-shadow:inset 0 1px 2px #1d2b4503}
select {padding-right:28px}
input:not([type=checkbox]):not([type=range]):not([type=color]):hover,select:hover,textarea:hover {border-color:#665187}
textarea::placeholder,input::placeholder {color:#63708a;opacity:1}
input[type=color] {background:#f7f8fd;border-color:#8e9bb5;height:44px}
input[type=range] {accent-color:#6335cc;height:20px;cursor:pointer}
input[type=checkbox] {accent-color:#6335cc;width:19px;height:19px;cursor:pointer}
output {font-size:12px;font-weight:750;color:#532ba3;background:#f0eaff;border-radius:5px;padding:1px 6px}
.font-sample {background:#f1edfa;border-color:#d1c6e8;color:#43218c;border-radius:12px;padding:15px 18px}
.font-sample span {color:#5d4c7b;font-weight:600}
.upload-box {background:linear-gradient(135deg,#f1edff,#faf9ff);border:1.5px dashed #8b72bc;border-radius:14px;padding:26px 18px;gap:7px;transition:background .18s,border-color .18s}
.upload-box:hover,.drop-zone.dragging {background:#e9dfff;border-color:#5e31b7}
.upload-box strong {color:#39236c;font-size:16px;font-weight:750}
.upload-box span:not(.upload-symbol) {color:#615375;font-size:13px}
.upload-symbol {width:47px;height:47px;border-radius:13px;background:#6539ca;color:#fff;font-size:27px;margin-bottom:7px;box-shadow:0 5px 14px #6539ca23}
.video-meta {color:#59667d;font-size:13px;padding:9px 0}
.divider {background:#d5dae8;margin:22px 0}
.preview-column {position:sticky;top:22px;min-width:0;padding:17px;background:#182239;border:1px solid #334262;border-radius:22px;box-shadow:0 12px 30px #17213c20}
.preview-top .eyebrow {color:#d1c1ff;font-size:10px}
.preview-top .small {color:#bfcde6;font-size:11px}
.preview-top {padding:0 2px 13px}
.preview-stage {background:radial-gradient(ellipse at top,#354665,#0c1426 80%);border:1px solid #5d6b87;border-radius:14px;max-height:600px;box-shadow:0 7px 20px #03091730}
#preview-empty {background-image:linear-gradient(#ffffff07 1px,transparent 1px),linear-gradient(90deg,#ffffff07 1px,transparent 1px);background-size:34px 34px}
#preview-empty p {color:#fff}
#preview-empty span {color:#c1cce1}
.preview-foot {color:#c6d4e9;padding:14px 3px 0;font-size:11px;line-height:1.5;align-items:flex-start}
.sound-settings {margin:0 -4px}
.sound-settings>summary {cursor:pointer;display:flex;align-items:center;justify-content:space-between;list-style:none;gap:12px;padding:14px;border-radius:11px;background:#eaf4f7;border:1px solid #aec8d0;color:#144e5b}
.sound-settings>summary::-webkit-details-marker {display:none}
.sound-settings summary strong {display:block;font-size:15px}
.sound-settings summary small {display:block;font-size:12px;color:#466975;font-weight:450;margin-top:3px}
.sound-settings summary>span:last-child {font-size:22px;transition:transform .2s}
.sound-settings[open] summary>span:last-child {transform:rotate(45deg)}
.sound-settings-body {padding:18px 4px 0}
.audio-picks {border:1px solid #c2cbdd;background:#f7f9fd;border-radius:9px;padding:10px;max-height:180px}
.audio-picks:empty {display:none}
.audio-picks label {padding:5px;border-radius:6px;font-size:13px}
.audio-picks label:has(input:checked) {background:#eae2ff;color:#46218c}
#editor-caption-scope,#caption-scope-note,#audio-scope-note {padding:11px 13px;background:#f0ebfb;border-left:3px solid #855bd2;border-radius:0 8px 8px 0;color:#503579;font-size:13px}
.batch-panel {margin-top:28px;border-top:4px solid #7144c8;padding-top:24px}
.passes {gap:13px}
.pass-card {background:#f8f9fd;border-color:#acb9d1;min-height:127px;border-radius:12px;padding:18px 15px;transition:background .18s,border-color .18s}
.pass-card:has(input:checked) {background:#f0eafa;border-color:#8a66c6;box-shadow:inset 0 0 0 1px #b6a0da}
.pass-card strong {color:#342452;font-size:15px}
.pass-card span span {color:#5d5871;font-size:13px}
.pass-card small {color:#696179;font-size:12px}
.pass-card>b {color:#6032b2;font-size:25px;font-weight:800}
.telegram-posting {background:#eef6fc;border-color:#aac4d9;box-shadow:none;margin:22px 0 0;padding:20px}
.telegram-posting .eyebrow {color:#205d84;background:transparent;padding:0}
.telegram-posting h2 {color:#1d4c6f;font-size:17px}
.telegram-posting .pill {background:#e0effb;border-color:#a1bfd4;color:#235571;font-size:11px}
.telegram-batch {grid-template-columns:minmax(190px,1fr) minmax(170px,1fr) auto;gap:20px}
.telegram-route strong {color:#1d405b}
.batch-bottom {border-color:#ccd1e0;padding-top:23px;gap:20px}
.batch-estimate strong {color:#5824ad;font-size:44px;font-weight:800;letter-spacing:-2px}
.batch-estimate span {font-size:12px}
#create-batch {min-height:51px;min-width:185px;font-size:15px}
#batch-message:not(:empty) {padding:12px;background:#f3f0f9;border-radius:8px;color:#534167}
.caption-organization {background:#f5f6fc;padding:17px;border:1px solid #ced5e5;border-radius:12px;gap:13px}
.caption-organization>label {min-width:160px;flex:1;margin:0}
.caption-organization .actions {justify-content:flex-start;gap:9px}
.caption-list {gap:10px;margin-top:18px}
.caption-row {padding:18px;border:1px solid #c8d1e1;border-radius:12px;background:#fff;gap:13px}
.caption-row:has(input:checked),.sound-card:has(input:checked) {background:#f1ebff;border-color:#8a64cf;box-shadow:inset 3px 0 #7140c5}
.caption-content p {color:#27324b;font-size:16px}
.caption-content small {color:#63718a}
.caption-row button {min-height:38px;font-size:12px;padding:8px 10px}
.caption-row .actions {flex-wrap:wrap;gap:7px;justify-content:flex-end}
#caption-selection-count:not(:empty),#audio-selection-count:not(:empty),#mp4-selection-count:not(:empty) {font-size:13px;font-weight:700;color:#59389d}
.sound-card {background:#fff;border-color:#b8c4d9;box-shadow:0 3px 14px #18213b07;border-radius:13px}
.sound-card h3 {font-size:16px;color:#263552}
.audio-selection-bar {padding:12px 0;justify-content:flex-start;gap:8px}
.empty {background:#f7f8fc;border-color:#b5c1d5;padding:45px 22px;color:#65718a}
.empty strong {color:#2e3c59;font-size:19px}
.job-status {color:#4c5874;font-weight:700;background:#eef0f7;border:1px solid #bbc6d8;padding:5px 10px;border-radius:6px}
.job.complete .job-status {background:#e1f3e9;color:#096340;border-color:#7db89f}
.job.failed .job-status {background:#fbe8ec;color:#a12238;border-color:#d996a2}
.job-files a {background:#f6f3ff;border-color:#b9a5de;color:#4c2694;padding:9px 12px;border-radius:8px}
.telegram-delivery {background:#eef5fc;border-color:#adbfdb}
.form-message:not(:empty),.access-note {background:#edf3ff;border:1px solid #aebfdd;color:#334e77}
.form-message.error {background:#fff0f2;color:#a12238;border-color:#d792a0}
progress {height:9px;accent-color:#7445ce}
.planner-hero {background:radial-gradient(ellipse at 95% 10%,#61528c,transparent 55%),#222641;border-color:#454963;color:#fff;padding:30px 34px}
.planner-hero h2 {color:#fff}
.planner-hero p,.planner-hero .eyebrow {color:#d1cde4}
.planner-goal {color:#fff}
.planner-goal strong {color:#d3bbff}
.planner-goal>span,.planner-goal small {color:#ded7ef}
.planner-kpis {background:#fff;border-color:#c8d0e2;border-radius:16px}
.planner-kpi {background:transparent;border-color:#d5dbe8}
.planner-kpi>span,.planner-kpi small {color:#5b6680}
.planner-kpi strong {color:#422975}
.planner-kpi:nth-child(3) strong {color:#10654d}
.planner-kpi:nth-child(4) strong {color:#275e9c}
.planner-progress {background:#fff;border-color:#c5cee0}
.planner-progress progress,.planner-progress progress::-webkit-progress-bar {background:#e4e7f0}
.planner-progress progress::-webkit-progress-value {background:linear-gradient(90deg,#7041d1,#ae85ed)}
.planner-progress progress::-moz-progress-bar {background:#7041d1}
.planner-column {background:#e6eaf4;border-color:#c3cddd;border-radius:14px;min-width:0}
.planner-column-empty {color:#63728c}
.planner-card {background:#fff;border-color:#aebbd3;box-shadow:0 2px 7px #14253e08}
.planner-card:hover {border-color:#795caa;background:#fdfbff}
.planner-card h3,.planner-card strong {color:#26334e}
.planner-card p,.planner-card small,.planner-card-meta {color:#5c6680}
.planner-card a {color:#542da5}
.planner-card .pill {background:#f0e9ff;color:#503091;border-color:#b8a4d8}
.planner-accounts summary {color:#273755}
.planner-account-row {border-color:#d5daea}
.planner-account-row strong {color:#29374e}
.planner-account-row small {color:#5c6b84}
.planner-account-form {background:#f3f5fa;border-color:#bec8da}
.planner-account-form input {background:#fff}
.planner-setup {background:#f4f0ff;border-color:#b8a3dc;color:#422a74}
.planner-setup p {color:#615478}
dialog {background:#fff;color:var(--ink);border:1px solid #8594b0;border-radius:20px;padding:28px;max-height:calc(100dvh - 40px);box-shadow:0 25px 90px #0b122d60}
dialog::backdrop {background:#151d3c8c;backdrop-filter:blur(5px)}
dialog h2 {font-size:23px;color:#28304e}
dialog>.actions {margin-top:22px;justify-content:flex-end}
.login {background:radial-gradient(ellipse at 65% 10%,#514077,transparent 60%),#11182b}
.login form {border-top:4px solid #956aed;box-shadow:0 20px 80px #0004;border-radius:20px;width:440px}
.login h1 {font-size:30px}
#login-error {color:#a32138}
.toast {background:#202a43;color:#fff;border:1px solid #647294;border-radius:12px;box-shadow:0 12px 40px #17234430}
.view {animation:studio-enter .24s ease-out}
@keyframes studio-enter {from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:translateY(0)}}
/* Shared dialogs and populated planner cards. */
.import-preview {background:#f5f3fc;color:#27324b;border-color:#afb8ce}
#randomize-audio[aria-pressed=true] {background:#d9f3e6;color:#0d5b40;border-color:#649d84;box-shadow:inset 3px 0 #1b855e}
.invite-create {background:#f3f0fb;border-color:#b9accf}
.access-note strong {color:#243e63}
.planner-date-label,.planner-account-count {color:#55647e}
.planner-column-heading h3 {color:#34405b}
.planner-column-count {background:#fff;color:#3d4660;border:1px solid #b1bed3}
.planner-column-empty strong {color:#4d5c78;font-weight:650}
.planner-card-account,.planner-card-account small {color:#5d6b85}
.planner-card h4 {color:#253450}
.planner-card-caption,.planner-card-notes {color:#5b657f}
.planner-card-notes {border-color:#cbd1df}
.planner-delete {color:#a12c46;font-weight:650;min-height:32px}
.planner-idea {border-top:4px solid #8052c8}
.planner-draft {border-top:4px solid #bc7a22}
.planner-ready {border-top:4px solid #28886c}
.planner-published {border-top:4px solid #4385c5}
.planner-progress {padding:20px;border:1px solid #c7d0e1;border-radius:12px;margin:16px 0}
@media(min-width:1700px) {.editor-grid{grid-template-columns:1fr 1.14fr 1fr;gap:28px}.preview-stage{max-height:680px}main{padding:32px 44px 70px}}
@media(max-width:1180px) {#studio{grid-template-columns:215px minmax(0,1fr)}.sidebar{padding:25px 14px}main{padding:25px 24px 50px}.editor-grid{grid-template-columns:minmax(235px,1fr) minmax(270px,1.1fr)}.source-panel{grid-column:1;grid-row:1/3}.preview-column{grid-column:2;grid-row:1;position:relative;top:auto}.settings-panel{grid-column:2;grid-row:2;display:block}.preview-stage{max-height:510px}.workflow-strip button{padding:13px;gap:9px}.workflow-strip small{font-size:11px}.workflow-strip i{display:none}.passes{grid-template-columns:repeat(3,minmax(0,1fr))}.pass-card{flex-wrap:wrap}.pass-card>b{font-size:22px}.pass-card span span,.pass-card small{display:block;margin:4px 0 0}}
@media(max-width:1050px) {.header-right{max-width:220px}.workflow-strip small{display:none}.workflow-strip button{min-height:62px}.workflow-strip span{font-size:12px}.workflow-strip b{width:28px;height:28px;font-size:11px}.passes{grid-template-columns:1fr}.pass-card{min-height:90px;flex-wrap:nowrap}.telegram-batch{grid-template-columns:1fr 1fr}.telegram-route-actions{grid-column:1/-1;display:flex;flex-wrap:wrap}.planner-board{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:760px) {#studio{display:block}.sidebar{position:relative;height:auto;padding:18px 18px 14px;border-right:0;border-bottom:1px solid #3f4965;overflow:visible}.brand{margin:0 0 18px;font-size:13px}.brand img{width:40px;height:40px}.brand b{display:block;font-size:10px}.sidebar nav{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:7px;margin:0}.nav{min-height:46px;padding:10px 8px;justify-content:center;text-align:center;font-size:12px}.nav span{display:none}.sidebar>.eyebrow,.sidebar-rule,.sidebar-bottom{display:none}.sidebar>.row{margin-top:15px}.sidebar>.row .eyebrow{display:block}#characters{display:flex;gap:9px;overflow:auto;padding-bottom:2px}.character{min-width:150px;max-width:220px;flex-shrink:0;margin:0}.sidebar .row{margin-bottom:6px}main{padding:18px 17px 40px}main>header{margin:20px 0 25px;gap:16px}.header-right{max-width:none;width:100%;justify-content:flex-start;gap:9px}.header-right #logout{margin-left:auto}.page-description{font-size:14px}h1{font-size:34px}.workflow-strip{gap:7px;margin-bottom:17px}.workflow-strip button{padding:11px 7px;min-height:74px;flex-direction:column;gap:7px;text-align:center}.workflow-strip span{font-size:11px}.workflow-strip b{display:grid}.editor-grid{display:flex;flex-direction:column;gap:18px}.source-panel,.preview-column,.settings-panel{width:100%}.preview-column{order:1;padding:15px}.source-panel{order:0}.settings-panel{order:2;display:block}.preview-stage{max-height:460px;max-width:360px;margin:auto}.panel{padding:20px;border-radius:15px}.batch-panel{margin-top:20px}.section-title{flex-wrap:wrap;gap:15px}.section-title>.actions{justify-content:flex-start}.telegram-posting{padding:17px}.telegram-batch{display:block}.telegram-route{margin:15px 0}.telegram-route-actions{gap:12px}.batch-bottom{gap:18px}.batch-bottom label{width:100%;max-width:none}.batch-estimate{margin-left:0;flex:1}.batch-bottom .primary{width:100%;min-height:50px}.caption-organization{padding:14px}.caption-organization>label{min-width:100%;width:100%}.caption-row{flex-wrap:wrap;padding:15px}.caption-content{flex-basis:calc(100% - 40px)}.caption-row .actions{margin-left:30px;justify-content:flex-start;width:100%}.caption-row button,button,.button{min-height:44px}.sound-card .actions,.audio-selection-bar{justify-content:flex-start}.planner-hero{padding:24px}.planner-goal{padding-top:8px}.planner-toolbar .actions button{font-size:12px}.planner-kpi small{font-size:12px}.planner-card button{min-height:40px}.job-footer{flex-wrap:wrap}.job .row{flex-wrap:wrap}.telegram-grid{display:block}.telegram-grid>.panel{margin-bottom:18px}.workspace-links>summary{font-size:11px}.grid-tiers{padding:12px}.grid-tiers-list{flex-wrap:wrap;overflow:visible}.grid-tier{white-space:normal}.grid-tier-name{font-size:12px}.login form{padding:27px}}
@media(max-width:480px) {.sidebar nav{grid-template-columns:repeat(3,minmax(0,1fr))}.planner-board{grid-template-columns:1fr}.planner-kpis{grid-template-columns:1fr 1fr}.studio-sharing{flex:none}.studio-sharing button{padding:9px 11px}.header-right #logout{padding:9px;font-size:12px}.workflow-strip span{font-size:10px}.workflow-strip button{padding:10px 4px}.panel{padding:17px}.audio-list{grid-template-columns:minmax(0,1fr)}dialog{padding:22px;max-width:calc(100vw - 24px)}.two-cols{gap:10px}}
@media(prefers-reduced-motion:reduce) {*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.workflow-strip button:hover{transform:none}}

/* Clear selection states, with native keyboard and touch controls. */
select {appearance:none;-webkit-appearance:none;padding-right:42px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3E%3Cpath d='m4 6 4 4 4-4' fill='none' stroke='%236335cc' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"),linear-gradient(135deg,#fff,#f1edff);background-repeat:no-repeat;background-position:right 14px center,center;background-size:16px,100%;border-color:#a69aca;font-weight:650;transition:border-color .16s,box-shadow .16s,background-color .16s}
select:not(:has(option:checked[value=""])) {border-color:#9473d4;color:#3f207b;box-shadow:inset 3px 0 #8051d8,0 2px 6px #6133b20a}
select:hover:not(:disabled),select:focus {border-color:#7742d1;box-shadow:0 0 0 3px #8051d821,0 4px 12px #6133b210}
select option {background:#fff;color:#19243c;font-weight:500}
select option:checked {background:#6335cc;color:#fff}
input[type=checkbox] {appearance:none;-webkit-appearance:none;display:inline-block;width:22px;height:22px;min-width:22px;flex-shrink:0;vertical-align:middle;margin:0;border:2px solid #8d94ae;border-radius:7px;background:#fff;box-shadow:inset 0 1px 2px #14234808;transition:background-color .16s,border-color .16s,box-shadow .16s}
input[type=checkbox]:checked {border-color:#6834c4;background-color:#743bd2;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 18 18'%3E%3Cpath d='m4 9 3.2 3.2L14 5.5' fill='none' stroke='white' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");background-position:center;background-repeat:no-repeat;box-shadow:0 2px 6px #6d34bb38}
input[type=checkbox]:hover:not(:disabled) {border-color:#743bd2;box-shadow:0 0 0 3px #8051d821}
input[type=checkbox]:disabled {cursor:default;opacity:.65}
input[type=checkbox]:indeterminate {background:#743bd2;border-color:#6834c4;background-image:linear-gradient(#fff,#fff);background-size:10px 2px;background-position:center;background-repeat:no-repeat}
.audio-picks label,.pass-card,.caption-row,.sound-card {transition:border-color .18s,background-color .18s,box-shadow .18s}
.audio-picks label:has(input:checked) {background:linear-gradient(130deg,#eee4ff,#f5efff);color:#3f1f7a;border-color:#9c75da;box-shadow:inset 3px 0 #8145d5,0 3px 9px #6133b211;font-weight:650}
.pass-card:has(input:checked) {background:linear-gradient(135deg,#e8dbff,#f7f2ff);border-color:#8954cd;box-shadow:inset 0 0 0 1px #b994e2,0 5px 14px #7041b81a}
.caption-row:has(input:checked),.sound-card:has(input:checked) {background:linear-gradient(120deg,#f0e6ff,#fff);border-color:#a072d7;box-shadow:inset 4px 0 #7b42c9,0 3px 10px #6133b20c}
button[aria-pressed=true] {background:linear-gradient(135deg,#7440d2,#5323aa);border-color:#7541c7;color:#fff;box-shadow:0 3px 10px #5a2cad32}
.selection-feedback {animation:studio-selection .3s ease-out}
@keyframes studio-selection {0%{box-shadow:0 0 0 5px #9a68e350}100%{box-shadow:0 0 0 0 #9a68e300}}
button.danger-outline {color:#a52643;border:1px solid #d9a5b2;background:#fff7f9;font-weight:650}
button.danger-outline:hover:not(:disabled) {color:#8b1632;background:#ffe8ee;border-color:#bc647c}
button.danger-solid {background:#b12749;color:#fff;border:1px solid #a21c3d;font-weight:700}
button.danger-solid:hover:not(:disabled) {background:#941c3a;border-color:#941c3a}
.collection-delete-dialog {width:460px;max-width:calc(100vw - 32px);border:1px solid #d2c5e5;border-radius:20px;padding:28px;box-shadow:0 28px 90px #131b4259}
.collection-delete-dialog::backdrop {background:#151b3b88;backdrop-filter:blur(5px)}
.collection-delete-dialog .eyebrow {color:#9a2342;font-size:11px;letter-spacing:.12em}
.collection-delete-dialog h2 {margin:12px 0;font-size:28px;letter-spacing:-.7px}
.collection-delete-dialog .collection-delete-name {font-weight:700;font-size:17px;color:#2c2342;overflow-wrap:anywhere}
.collection-delete-dialog p {line-height:1.6;color:#565269}
.collection-delete-dialog .actions {margin-top:24px;gap:12px;justify-content:flex-end}
.collection-delete-dialog .actions button {min-width:110px;min-height:44px}
.collection-delete-dialog .form-message:empty {display:none}
@media(forced-colors:active) {input[type=checkbox],select{appearance:auto;-webkit-appearance:auto;background-image:none}}

/* Niche delivery folders and listen-before-select controls. */
.telegram-destination-panel {grid-column:1/-1}
.telegram-folders {display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:12px;margin:20px 0 26px}
.telegram-folder-card {display:flex;flex-direction:column;align-items:flex-start;text-align:left;gap:7px;min-height:118px;padding:17px;background:linear-gradient(135deg,#fff,#f2edfc);border:1px solid #c7b6e4;border-radius:14px;color:#3c2860;transition:transform .16s,box-shadow .16s}
.telegram-folder-card:hover {transform:translateY(-2px);box-shadow:0 7px 20px #5f349520}
.telegram-folder-card strong {overflow-wrap:anywhere}
.telegram-folder-card small {font-size:12px;color:inherit;opacity:.88}
.telegram-folder-symbol {font-size:25px;line-height:1;color:#8551c8}
.telegram-folder-card[aria-pressed=true] .telegram-folder-symbol {color:#eee3ff}
.telegram-selection-toolbar {display:flex;align-items:center;flex-wrap:wrap;gap:10px;padding:13px;background:#f1edf9;border:1px solid #d1c4e6;border-radius:12px;margin-bottom:14px}
.telegram-selection-toolbar>span {margin-right:auto;font-weight:700;color:#553484}
.telegram-destination-row {gap:14px}
.telegram-destination-row:has(input:checked) {border-color:#a77bd5;background:#f4ecff;box-shadow:inset 3px 0 #8950c5}
.telegram-folder-label {color:#684298!important;font-weight:650}
.telegram-distribution {padding:16px;margin:14px 0;background:linear-gradient(135deg,#f3ecff,#f7fbff);border:1px solid #c7b5e3;border-radius:13px}
.telegram-distribution>strong {color:#52307e}
.telegram-distribution p:last-child {margin-bottom:0}
.telegram-recipient-chips {display:flex;flex-wrap:wrap;gap:7px}
.telegram-recipient-chips>span {background:#fff;border:1px solid #d2c5e7;border-radius:7px;padding:5px 9px;font-size:12px;font-weight:650;color:#513575;overflow-wrap:anywhere}
#audio-picks {max-height:420px;padding:8px}
.audio-choice {border:1px solid #d4cbe4;border-radius:11px;background:#fff;padding:10px;margin:0 0 10px;min-width:0}
.audio-choice:last-child {margin-bottom:0}
.audio-choice:has(input:checked) {background:#f4edff;border-color:#a881d4}
.audio-choice .check {overflow-wrap:anywhere;font-weight:650;margin:0 0 9px}
.audio-choice audio {display:block;width:100%;max-width:100%;height:38px}
.audio-choice>span {display:block;font-size:11px;margin:7px 2px 0}
@media(max-width:760px) {.telegram-folders{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.telegram-folder-card{padding:13px;min-height:105px}.telegram-destination-row{flex-wrap:wrap}.telegram-destination-row .team-row-info{flex:1;min-width:0}.telegram-distribution{padding:12px}.telegram-selection-toolbar button{font-size:12px}}

/* Spoken openings paired with supporting footage. */
.clip-mode {padding:22px;margin-bottom:22px;border:1px solid #c8b6e6;border-radius:18px;background:linear-gradient(115deg,#f4efff,#fff);display:flex;gap:24px;align-items:center;justify-content:space-between}
.clip-mode h2 {margin:0 0 6px}.clip-mode p {margin:0}.clip-mode-options {display:grid;grid-template-columns:1fr 1fr;gap:10px;flex:0 1 560px}.clip-mode-options button {text-align:left;padding:17px;border-radius:12px;border:1px solid #bba6d8;background:#fff;color:#493763}.clip-mode-options strong,.clip-mode-options span {display:block}.clip-mode-options span {font-size:12px;line-height:1.4;margin-top:5px;opacity:.9}
.clip-mode-options button[aria-pressed=true] {background:linear-gradient(135deg,#7440d2,#5323aa);color:#fff;box-shadow:0 6px 16px #7346bb30}
.hook-panel {border-top:1px solid #d9d0e7;margin-top:22px;padding-top:20px}.hook-panel .section-title {align-items:start;flex-wrap:wrap;gap:10px}.hook-panel h2 {font-size:18px}.hook-list {display:grid;gap:12px;max-height:700px;overflow:auto}.hook-choice {border:1px solid #d4c4e9;border-radius:12px;background:#fff;padding:12px;min-width:0}.hook-choice:has(input[type=checkbox]:checked) {background:#f3eaff;border-color:#9b6ed0;box-shadow:inset 3px 0 #8644c9}.hook-choice .check {font-weight:650;overflow-wrap:anywhere}.hook-choice video {width:100%;max-height:180px;display:block;background:#121223;border-radius:8px;margin:12px 0}.hook-choice label {font-size:12px}.hook-choice input[type=number] {min-width:0;width:100%}.hook-choice p:last-child {margin-bottom:0}
.hook-settings {padding:22px;border:1px solid #c8b8e4;border-radius:15px;background:linear-gradient(135deg,#f3edff,#f7faff);margin:20px 0}.hook-settings-grid {display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}.hook-settings-grid label {margin:0}.hook-settings-grid label .small {display:block;font-weight:400;line-height:1.6;margin-top:8px}.hook-count-summary {padding:18px;border:1px solid #d3bbed;background:#fff;border-radius:12px;margin-top:20px}.hook-count-summary strong {font-size:19px;color:#573186}.hook-count-summary p {margin-bottom:0}.hook-export-preview {display:block;max-width:100%;width:360px;max-height:500px;background:#111;border-radius:12px}
@media(max-width:1050px) {.clip-mode{align-items:stretch;flex-direction:column;gap:16px}.clip-mode-options{flex:auto}.hook-settings-grid{grid-template-columns:1fr 1fr}}
@media(max-width:760px) {.clip-mode,.hook-settings{padding:17px}.clip-mode-options{gap:8px}.clip-mode-options button{padding:13px}.hook-settings-grid{grid-template-columns:1fr}.hook-count-summary strong{font-size:17px}.hook-list{max-height:650px}.batch-bottom #render-hook-sample{width:100%}}

.job-files:has(.hook-export-preview){align-items:flex-start}