/* Cinema Black. This skin never touches the artist's video/text style values. */
html:root[data-editor-skin=cinema-black][data-theme]{--bg:#080909;--panel:#0d0e0e;--panel2:#151616;--line:#303132;--line-soft:#222324;--text:#f2f2f0;--muted:#aaa9ad;--accent:#a28ae6;--brand-purple:#a28ae6;--brand-yellow:#f3f3ef;--ui-well:#101111;--ui-raised:#171818;--ui-hover:#222225;--ui-selected:#28203e;--ui-radius:7px;color-scheme:dark;--ui-font:'DM Sans',Arial,sans-serif}
html:root[data-editor-skin=cinema-black] :is(body,.app-shell){background:#080909!important;color:var(--text)}
html:root[data-editor-skin=cinema-black] body{background-image:none!important}
html:root[data-editor-skin=cinema-black] .topbar{display:flex!important;flex:0 0 auto!important;align-items:center!important;gap:20px!important;height:66px!important;min-height:66px!important;background:#0c0d0d!important;border-bottom:1px solid var(--line)!important;padding:0 24px!important;box-shadow:none!important}
html:root[data-editor-skin=cinema-black] .topbar .brand{display:flex!important;align-items:center;gap:10px;min-width:0!important;width:auto!important;flex-shrink:0}
.cinema-wordmark{display:none}
html:root[data-editor-skin=cinema-black] .cinema-wordmark{display:inline;font:700 20px/1 'DM Sans',sans-serif;letter-spacing:-.055em;color:var(--text)}
html:root[data-editor-skin=cinema-black] .topbar .brand-symbol{width:46px!important;height:28px!important}
html:root[data-editor-skin=cinema-black] .project-heading{display:flex!important;align-items:center;gap:8px;min-width:120px;flex:1;max-width:330px}
html:root[data-editor-skin=cinema-black] .project-title{background:transparent!important;border:0!important;box-shadow:none!important;font-size:12px!important;padding:4px 0!important;color:var(--text)!important;min-width:70px;width:145px;text-overflow:ellipsis}
html:root[data-editor-skin=cinema-black] #saveState{font-size:10px!important;white-space:nowrap;color:var(--muted)!important}
html:root[data-editor-skin=cinema-black] .topbar #projectTitle{color:#f2f2f0!important}
html:root[data-editor-skin=cinema-black] .topbar #saveState{color:#aaa9ad!important}
html:root[data-editor-skin=cinema-black] .top-actions{display:flex!important;margin-left:auto;gap:8px!important;width:auto;align-items:center;flex-wrap:nowrap!important}
html:root[data-editor-skin=cinema-black] :is(button,summary,input,select,textarea){font-family:'DM Sans',Arial,sans-serif}
html:root[data-editor-skin=cinema-black] :is(.ghost-button,.top-select,.icon-button,.topbar summary,#toggleTimelineWeb){background:#101111!important;border:1px solid var(--line)!important;color:var(--text)!important;border-radius:7px!important;box-shadow:none!important}
html:root[data-editor-skin=cinema-black] :is(.ghost-button,.topbar summary):hover{background:#1c1d1e!important;border-color:#555459!important}
html:root[data-editor-skin=cinema-black] :is(.export-button,.primary-wide,#autoBatch15,#exportVariants15){background:#f3f3ef!important;color:#141415!important;border:1px solid #f3f3ef!important;border-radius:7px!important;box-shadow:none!important;font-weight:650}
html:root[data-editor-skin=cinema-black] :is(button,summary,a,input,select,textarea):focus-visible{outline:2px solid #a28ae6!important;outline-offset:3px}
html:root[data-editor-skin=cinema-black] .wf4-mode{order:0;background:#090a0a!important;border:1px solid var(--line)!important;border-radius:8px!important;padding:3px!important;margin:0 6px!important;color:var(--text)}
html:root[data-editor-skin=cinema-black] .wf4-mode button{background:transparent!important;color:var(--muted)!important;border:0!important;border-radius:5px!important;min-height:29px;padding:6px 14px!important}
html:root[data-editor-skin=cinema-black] .wf4-mode button[aria-pressed=true]{background:#28203e!important;color:#f4f0ff!important;box-shadow:inset 0 0 0 1px #a28ae630}
html:root[data-editor-skin=cinema-black] .top-actions>:is(.wf4-mode,.ux-save34,#exportBtn,#projectMenu,#editMenu,#settingsBtn){display:initial!important}
html:root[data-editor-skin=cinema-black] .top-actions>.wf4-mode{display:inline-flex!important}
html:root[data-editor-skin=cinema-black][data-ui-mode=guided] .top-actions>:is(#editMenu,#settingsBtn,#duoBtn,#qualitySelect){display:none!important}
html:root[data-editor-skin=cinema-black] .topbar :is(button,summary,select){font-size:12px!important;white-space:nowrap}
html:root[data-editor-skin=cinema-black] .topbar .menu-popover{background:#121313!important;border-color:var(--line)!important}
html:root[data-editor-skin=cinema-black] .topbar .menu-popover button{background:transparent!important}
html:root[data-editor-skin=cinema-black] .workspace{background:#080909!important}
html:root[data-editor-skin=cinema-black][data-focus-workspace=true] .tool-drawer{background:#0d0e0e!important;border-radius:0!important;border-color:var(--line)!important;border-width:0 1px 0 0!important}
html:root[data-editor-skin=cinema-black] .tool-drawer-heading{padding:14px 16px!important;background:#0d0e0e!important;border-color:var(--line)!important;flex-wrap:wrap;gap:6px}
html:root[data-editor-skin=cinema-black] .tool-drawer-heading h2{font-size:18px!important;letter-spacing:-.03em}
html:root[data-editor-skin=cinema-black] .tool-drawer-heading>button:first-child{font-size:11px!important;padding:5px 7px!important}
html:root[data-editor-skin=cinema-black] .tool-drawer-body{padding:12px!important;scrollbar-color:#444247 #0d0e0e}
html:root[data-editor-skin=cinema-black] :is(.media-panel,.style-panel){background:#0d0e0e!important;color:var(--text)!important}
html:root[data-editor-skin=cinema-black] :is(.media-panel,.style-panel) .panel-heading{position:static!important;background:transparent!important;color:var(--text)!important;box-shadow:none!important}
html:root[data-editor-skin=cinema-black] :is(.media-panel,.style-panel) :is(input:not([type=range]):not([type=checkbox]):not([type=color]),select,textarea){background:#161717!important;color:var(--text)!important;border-color:#353638!important;border-radius:6px!important}
html:root[data-editor-skin=cinema-black] :is(.manual-box,.advanced-section,.auto-song17,.auto-clip15,.auto-batch15,.ux-results34,.variant-row15,.video-row,.style-controls,.range-box,.auto-controls15){background:#111212!important;border-color:var(--line)!important;box-shadow:none!important}
html:root[data-editor-skin=cinema-black] :is(.section-title,.eyebrow,.helper,.gallery-hint){color:var(--muted)}
html:root[data-editor-skin=cinema-black] .studio-nav-v2 button{background:#141515!important;border-color:var(--line)!important;color:var(--text)!important}
html:root[data-editor-skin=cinema-black] .studio-nav-v2 button[aria-pressed=true]{background:#252031!important;border-color:#77619d!important}
html:root[data-editor-skin=cinema-black] .asset-library{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:6px!important}
html:root[data-editor-skin=cinema-black] #assetLibrary{background:#0d0e0e!important;border-color:var(--line)!important}
html:root[data-editor-skin=cinema-black] .media-group-label{grid-column:1/-1;color:var(--muted)!important;padding:10px 3px 5px;font-size:11px}
html:root[data-editor-skin=cinema-black] .ux-asset-actions34{display:grid;grid-template-columns:1fr 1fr;gap:3px}
html:root[data-editor-skin=cinema-black] .ux-asset-actions34 button{padding:5px 2px!important;font-size:10px!important;min-height:28px!important}
html:root[data-editor-skin=cinema-black] .asset-card{padding:3px!important;border-radius:6px!important;background:transparent!important}
html:root[data-editor-skin=cinema-black] .asset-card.selected{border-color:#9a7ad6!important}
html:root[data-editor-skin=cinema-black] .asset-thumb{border-radius:4px!important;aspect-ratio:4/5!important;background-color:#171819!important}
html:root[data-editor-skin=cinema-black] .asset-copy strong{font-size:11px!important}
html:root[data-editor-skin=cinema-black] :is(.mode-switch,.segmented){background:#0b0c0c!important;border-color:var(--line)!important;border-radius:6px!important}
html:root[data-editor-skin=cinema-black] :is(.mode-switch,.segmented) button.active{background:#29213e!important;color:var(--text)!important}
html:root[data-editor-skin=cinema-black] .preview-column{background:#090a0a!important;border-radius:0!important;border:0!important;box-shadow:none!important}
html:root[data-editor-skin=cinema-black] .preview-toolbar{background:#0d0e0e!important;border-color:var(--line)!important;padding:10px 16px!important}
html:root[data-editor-skin=cinema-black] .stage-wrap{background:#090a0a!important;background-image:none!important}
html:root[data-editor-skin=cinema-black] .stage{border:1px solid #2d2e30!important;border-radius:3px!important;box-shadow:none!important}
html:root[data-editor-skin=cinema-black] .transport{background:#0c0d0d!important;border-color:var(--line)!important}
html:root[data-editor-skin=cinema-black] .play-button{background:#efefeb!important;color:#111!important}
html:root[data-editor-skin=cinema-black] input[type=range]{accent-color:#a48bdf!important}
html:root[data-editor-skin=cinema-black] .timeline-panel{background:#0c0d0d!important;border:1px solid var(--line)!important;border-radius:0!important;margin:0!important}
html:root[data-editor-skin=cinema-black] .timeline-head{background:#111212!important;color:var(--text)!important;border-color:var(--line)!important;border-radius:0!important;padding:9px 16px!important}
html:root[data-editor-skin=cinema-black] .timeline-head strong{font-size:14px!important;font-weight:600!important}
html:root[data-editor-skin=cinema-black] :is(.track-label,.track-canvas,.track-toolbar,.range-toolbar,.range-strip15,.new-layer-drop,.time-ruler){background-color:#0d0e0f!important;border-color:#27282b!important;color:var(--muted)}
html:root[data-editor-skin=cinema-black] :is(.timeline-scroll,.extra-lane,.track-lane,.track-canvas.video-track,.track-canvas.lyric-track,.workspace-resizer){background-color:#101112!important;border-color:#27282b!important}
html:root[data-editor-skin=cinema-black] .notice{background:#171619!important;border-color:#39363e!important;color:#ccc7d3!important}
html:root[data-editor-skin=cinema-black] .timeline-panel :is(input:not([type=range]):not([type=checkbox]),select){background:#161717!important;color:#e4e1e9!important;border-color:#38363b!important}
html:root[data-editor-skin=cinema-black] :is(.lyric-segment,.lyric-block){background:#6d50cd!important;border-color:#a68be6!important}
html:root[data-editor-skin=cinema-black] :is(.settings-dialog,.duo-dialog){background:#111212!important;color:var(--text)!important;border:1px solid #37363b!important;box-shadow:0 30px 100px #0009}
html:root[data-editor-skin=cinema-black] dialog::backdrop{background:#000b;backdrop-filter:blur(6px)}
.cinema-tool-rail{display:none}
@media(min-width:1001px){
 html:root[data-editor-skin=cinema-black][data-focus-workspace=true][data-theme] .app-shell>.workspace{margin:0!important;gap:0!important;grid-template-columns:78px var(--tool-drawer-width,360px) minmax(240px,1fr)!important}
 html:root[data-editor-skin=cinema-black][data-focus-workspace=true][data-theme][data-drawer-collapsed=true] .app-shell>.workspace{grid-template-columns:78px 46px minmax(240px,1fr)!important}
 html:root[data-editor-skin=cinema-black][data-focus-workspace=true] .workspace>.tool-drawer{grid-column:2!important}
 html:root[data-editor-skin=cinema-black][data-focus-workspace=true] .workspace>.preview-column{grid-column:3!important}
 html:root[data-editor-skin=cinema-black] .cinema-tool-rail{grid-column:1;grid-row:1;display:flex;flex-direction:column;gap:5px;padding:12px 6px;border-right:1px solid var(--line);overflow-y:auto;scrollbar-width:none}
 html:root[data-editor-skin=cinema-black] .cinema-tool-rail button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;min-height:65px;flex:0 0 auto;background:transparent;border:1px solid transparent;border-radius:6px;color:#aaa9ad;padding:8px 2px;font-size:11px;line-height:1.3}
 html:root[data-editor-skin=cinema-black] .cinema-tool-rail button svg{width:20px;height:20px}
 html:root[data-editor-skin=cinema-black] .cinema-tool-rail button[aria-pressed=true]{color:#f3f0fa;background:#241e30;border-color:#a28ae633;box-shadow:inset 2px 0 #a28ae6}
 html:root[data-editor-skin=cinema-black] .cinema-tool-rail button:hover{background:#1b1a20;color:white}
}
/* Guided uses the same materials, with a spacious page rather than editor panels. */
html:root[data-editor-skin=cinema-black][data-ui-mode=guided] .guided-studio{background:#090a0a!important;color:var(--text)!important;padding:46px 5vw 48px;--gs-line:#353638;--gs-muted:#afadb3}
html:root[data-editor-skin=cinema-black][data-ui-mode=guided] .app-shell{background:#090a0a!important}
html:root[data-editor-skin=cinema-black] :is(.gs-content,.gs-message,.gs-legal){width:min(100%,1160px)}
html:root[data-editor-skin=cinema-black] .gs-section-top{margin-bottom:22px}
html:root[data-editor-skin=cinema-black] .gs-eyebrow{font-size:10px;font-weight:500;color:#aaa7ad;letter-spacing:.2em}
html:root[data-editor-skin=cinema-black] .guided-studio h1{font-size:clamp(28px,3.2vw,42px);font-weight:650;letter-spacing:-.045em;margin-bottom:8px}
html:root[data-editor-skin=cinema-black] .gs-intro{font-size:15px;margin:0 0 28px;color:#b5b3b7}
html:root[data-editor-skin=cinema-black] .gs-mode-grid{grid-template-columns:1.05fr 1fr;grid-template-rows:repeat(3,minmax(120px,1fr));gap:13px}
html:root[data-editor-skin=cinema-black] .gs-choice{position:relative;background:#0e0f0f;color:var(--text);border:1px solid #3a3b3d;border-radius:11px;padding:0;gap:0;overflow:hidden;transition:border-color .15s ease,background .15s ease;min-height:120px}
html:root[data-editor-skin=cinema-black] .gs-choice:hover{background:#151416;border-color:#8b779f}
html:root[data-editor-skin=cinema-black] .gs-choice .gs-art{border:0;border-radius:0;background:#111;min-height:0!important;padding:0;display:block;overflow:hidden}
.gs-art img{display:block;width:100%;height:100%;object-fit:cover}
html:root[data-editor-skin=cinema-black] .gs-mode-grid>.gs-choice:not(.gs-recommended){display:grid;grid-template-columns:40% 1fr 44px;align-items:center;text-align:left}
html:root[data-editor-skin=cinema-black] .gs-mode-grid>.gs-choice:not(.gs-recommended) .gs-art{height:100%;align-self:stretch;position:relative}
html:root[data-editor-skin=cinema-black] .gs-choice-copy{padding:18px}
html:root[data-editor-skin=cinema-black] .gs-choice strong{display:block;font-size:21px;letter-spacing:-.03em;line-height:1.15}
html:root[data-editor-skin=cinema-black] .gs-choice p{font-size:13px;line-height:1.45;margin-top:7px;color:#bdbbc0;max-width:30ch}
.gs-choice-arrow{display:grid;place-items:center;align-self:center;justify-self:start;width:30px;height:30px;border-radius:50%;border:1px solid #fff1;background:#fff1;font-size:20px;line-height:1}
html:root[data-editor-skin=cinema-black] .gs-mode-grid .gs-recommended{grid-row:span 3;min-height:410px;justify-content:flex-end;display:flex;flex-direction:column;align-items:flex-start;padding:25px}
html:root[data-editor-skin=cinema-black] .gs-recommended .gs-art{position:absolute;inset:0;z-index:0}
html:root[data-editor-skin=cinema-black] .gs-recommended .gs-art::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,#0002 30%,#000c)}
html:root[data-editor-skin=cinema-black] .gs-recommended .gs-choice-copy{position:relative;padding:0 0 16px;z-index:1}
html:root[data-editor-skin=cinema-black] .gs-recommended strong{font-size:35px}
html:root[data-editor-skin=cinema-black] .gs-recommended p{max-width:34ch;color:#dfdce1}
html:root[data-editor-skin=cinema-black] .gs-recommended .gs-choice-arrow{position:relative;background:#f4f4f0;color:#111;z-index:1;width:34px;height:34px}
html:root[data-editor-skin=cinema-black] .gs-recommended .gs-choice-arrow{align-self:flex-start}
html:root[data-editor-skin=cinema-black] .gs-badge{position:absolute;z-index:2;left:24px;top:23px;color:#c5a8ff;border:1px solid #ad8ce977;background:#0c0b13cc;font-size:9px;padding:5px 10px}
html:root[data-editor-skin=cinema-black] .gs-glitch::after{content:'';position:absolute;left:0;top:0;width:40%;height:100%;background:url('/media/neon/rooftop.png') 45% center/cover;clip-path:polygon(0 22%,100% 22%,100% 32%,0 32%,0 53%,100% 53%,100% 59%,0 59%,0 76%,100% 76%,100% 84%,0 84%);transform:translateX(9px);opacity:.7;filter:hue-rotate(55deg);pointer-events:none}
html:root[data-editor-skin=cinema-black] .gs-kind-switch{display:flex;gap:4px;margin:0 0 20px}
.gs-kind{padding:7px 12px;background:transparent;border:1px solid var(--gs-line);border-radius:6px;color:inherit;font-size:11px;cursor:pointer}
.gs-kind[aria-pressed=true]{background:#28203e;color:#f5efff;border-color:#77619d}
html:root[data-editor-skin=cinema-black] .gs-choice-grid .gs-choice .gs-art{height:180px}
html:root[data-editor-skin=cinema-black] .gs-choice-grid .gs-choice-arrow{margin:0 18px 18px}
html:root[data-editor-skin=cinema-black] :is(.gs-panel,.gs-template,.gs-result){background:#101111;color:var(--text);border-color:var(--gs-line);border-radius:10px}
html:root[data-editor-skin=cinema-black] .guided-studio :is(input,select){background:#171818;color:var(--text);border-color:var(--gs-line);border-radius:6px}
html:root[data-editor-skin=cinema-black] .gs-button{color:#e4e2e8;background:#141515;border:1px solid #404144;border-radius:7px;font-size:12px;letter-spacing:-.01em;padding:11px 18px}
html:root[data-editor-skin=cinema-black] .gs-button:hover{background:#202122;border-color:#77717d}
html:root[data-editor-skin=cinema-black] .gs-primary{background:#f3f3ef;color:#141415;border-color:#f3f3ef}
html:root[data-editor-skin=cinema-black] .gs-primary:hover{background:#dcdce0}
html:root[data-editor-skin=cinema-black] .gs-quiet{background:transparent;border-color:#343538}
html:root[data-editor-skin=cinema-black] .gs-progress [aria-current=step]{color:#f5f3f8}
html:root[data-editor-skin=cinema-black] .gs-upload{color:#eee;background:#131414;border-color:#68636e}
html:root[data-editor-skin=cinema-black] .gs-template[aria-pressed=true]{border-color:#a28ae6;box-shadow:inset 0 0 0 1px #a28ae6}
html:root[data-editor-skin=cinema-black] .gs-message{color:#eaa3ab}
/* Every variant is present in one grid. No pagination or single-result carousel. */
.gs-results-grid{grid-template-columns:repeat(auto-fill,minmax(215px,1fr));gap:20px;align-items:start}
.gs-result{padding:6px;gap:0;cursor:default}
.gs-result-open{position:relative;display:block;width:100%;padding:0;border:0;background:#090a0b;border-radius:6px;overflow:hidden;cursor:pointer}
.gs-result-open canvas{display:block;width:100%;height:auto;aspect-ratio:9/14;object-fit:contain;background:#090a0b;border-radius:0}
.gs-result-play{position:absolute;inset:0;margin:auto;width:42px;height:42px;display:grid;place-items:center;border-radius:50%;background:#0008;color:#fff;border:1px solid #fff4;opacity:0;transition:opacity .15s ease}
.gs-result-open:hover .gs-result-play,.gs-result-open:focus-visible .gs-result-play{opacity:1}
.gs-result-caption{padding:12px 6px 8px;display:grid;gap:7px}
.gs-result-caption label{display:flex;align-items:center;gap:8px;cursor:pointer}
.gs-result-caption strong{font-size:13px;overflow-wrap:anywhere}
.gs-result-caption small{margin-left:26px;font-size:11px}
.gs-result-caption input{margin:0}
.gs-result:has(input:checked){border-color:#9275c6}
.gs-preview-dialog{background:#101111;color:#eee;border:1px solid #47454b;border-radius:12px;padding:16px;width:min(850px,92vw);max-width:92vw;max-height:94dvh;overflow:auto}
.gs-preview-dialog::backdrop{background:#000b;backdrop-filter:blur(6px)}
.gs-modal-head{display:flex;justify-content:space-between;gap:20px;align-items:center;margin-bottom:12px}
.gs-modal-head h2{font-size:18px;margin:0;font-weight:600}
.gs-modal-preview .preview-column{height:min(66dvh,650px)!important;max-height:none;border-radius:4px!important}
.gs-modal-preview .stage-wrap{min-height:0!important;padding:12px}
.gs-modal-preview :is(.shortcut-hint,#notice,.preview-toolbar){display:none!important}
.gs-modal-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:12px}
@media(max-width:1000px){
 html:root[data-editor-skin=cinema-black] .topbar{height:auto!important;min-height:66px!important;flex-wrap:wrap!important;padding:14px 18px!important;gap:10px!important}
 html:root[data-editor-skin=cinema-black] .top-actions{width:100%;justify-content:flex-start;flex-wrap:wrap!important;gap:6px!important}
 html:root[data-editor-skin=cinema-black] .top-actions>.wf4-mode{margin:0 auto 0 0!important}
 html:root[data-editor-skin=cinema-black] .project-heading{max-width:none;margin-left:auto;flex:0 1 auto}
 html:root[data-editor-skin=cinema-black] #saveState{display:none}
 html:root[data-editor-skin=cinema-black] .workspace>.cinema-tool-rail{display:none}
}
@media(max-width:700px){
 html:root[data-editor-skin=cinema-black][data-ui-mode=guided] .guided-studio{padding:26px 18px 40px}
 html:root[data-editor-skin=cinema-black] .gs-mode-grid{grid-template-columns:1fr;grid-template-rows:auto}
 html:root[data-editor-skin=cinema-black] .gs-mode-grid .gs-recommended{grid-row:auto;min-height:330px}
 html:root[data-editor-skin=cinema-black] .gs-choice strong{font-size:19px}
 html:root[data-editor-skin=cinema-black] .gs-recommended strong{font-size:30px}
 html:root[data-editor-skin=cinema-black] .gs-choice-copy{padding:14px}
 .gs-results-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
 .gs-result-open canvas{aspect-ratio:9/13}
 .gs-result-actions{gap:8px}.gs-result-actions .gs-button{padding:9px 11px;font-size:11px}
 .gs-modal-actions{flex-wrap:wrap}.gs-modal-head .gs-button{padding:8px 12px}
}
@media(prefers-reduced-motion:reduce){.gs-choice,.gs-result-play{transition:none!important}}
