/* ROTOSCOPE: brand layer over style.css / hero2.css (the original site's styles, recoloured). The studio dialog,
   the contract bar, the style/format pickers, the token card, "My reels", the toast, and the hero polish. */

[hidden]{display:none!important}
:root{--bg:#060607;--s1:#0f0f11;--s2:#17171a;--grad:linear-gradient(90deg,#FFD23F,#FFA51F);--glow:rgba(255,210,63,.26);--tint:rgba(255,210,63,.07);--tint2:rgba(255,165,31,.05);--up:#FFD23F}
.logo-word{letter-spacing:.02em}
.logo .mark{width:32px;height:32px;flex-basis:32px}
.logo .mark svg{filter:drop-shadow(0 0 10px rgba(255,210,63,.35))}
.live-pill{margin-left:2px}

/* ---------- hero polish ---------- */
.hero2 .copy h1 em{background:linear-gradient(92deg,#FFE27A,#FFD23F 40%,#FFA51F);-webkit-background-clip:text;background-clip:text;color:transparent;padding-right:.06em}
.hero2 .copy .sub{max-width:640px}
.composer .st-pick{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}
.fmtset{display:inline-flex;gap:4px;padding:3px;border:1px solid var(--line);border-radius:11px;background:rgba(255,255,255,.02)}
.fmt{display:inline-flex;align-items:center;gap:7px;font:600 12px/1 'JetBrains Mono',monospace;padding:7px 10px;border-radius:8px;border:0;background:transparent;color:var(--dim);cursor:pointer;transition:background .15s,color .15s}
.fmt:hover{color:var(--text)}
.fmt.on{background:rgba(255,210,63,.13);color:var(--acc1)}
.fmt .r{display:inline-block;border:1.6px solid currentColor;border-radius:2px}
.fmt .r.v{width:8px;height:13px}
.fmt .r.h{width:14px;height:8px}
.gen{background:var(--grad);color:var(--on-acc);box-shadow:0 10px 30px var(--glow)}
.examples .ex-note{margin-left:auto}
@media (max-width:720px){.examples .ex-note{display:none}.composer .st-pick{justify-content:flex-start}}

/* ---------- contract bar ---------- */
.cabar{position:relative;z-index:2;border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:linear-gradient(90deg,rgba(255,210,63,.05),rgba(255,165,31,.02) 50%,rgba(255,210,63,.05)),#09090a}
.cabar-in{display:flex;align-items:center;gap:14px 18px;padding-top:14px;padding-bottom:14px;flex-wrap:wrap}
.cab-t{display:inline-flex;align-items:center;gap:9px;font-size:14px;letter-spacing:.02em}
.cab-t b{color:var(--acc1)}
.cab-dot{width:8px;height:8px;border-radius:50%;background:var(--acc1);box-shadow:0 0 0 4px rgba(255,210,63,.14),0 0 14px var(--acc1);animation:cab 2.2s ease-in-out infinite}
@keyframes cab{50%{box-shadow:0 0 0 8px rgba(255,210,63,0),0 0 14px var(--acc1)}}
.cab-ca{flex:1 1 320px;min-width:0;font-size:13px;color:var(--dim);overflow-wrap:anywhere}
.cabar.has-ca .cab-ca{color:var(--text);font-size:14px;letter-spacing:.01em}
.cab-acts{display:flex;gap:8px;flex-wrap:wrap}
.cab-acts .btn{margin:0}
.cab-x svg,.rt-acts svg{width:14px;height:14px;fill:currentColor}
.ca-pill{display:inline-flex;align-items:center;gap:2px;cursor:pointer;background:rgba(255,210,63,.08);color:var(--text)}
.ca-pill i{font-style:normal;color:var(--dim)}
.soc{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:50%;border:1px solid var(--line2);color:var(--text)}
.soc svg{width:15px;height:15px;fill:currentColor}
.soc:hover{border-color:var(--acc1)}
.nav-make .l-short{display:none}
@media (max-width:640px){.nav-make .l-long{display:none}.nav-make .l-short{display:inline}.ca-pill{display:none}}
@media (max-width:480px){.nav .logo .logo-word{display:inline;font-size:17px}.nav .nav-make{min-height:40px}}

/* ---------- free + token ---------- */
.free-cards{grid-template-columns:1fr 1.6fr}
.free-cards .price.director{grid-column:auto;grid-template-columns:1fr 1fr}
.free-cards .btn{width:100%;margin-top:auto}
@media (max-width:980px){.free-cards{grid-template-columns:1fr}.free-cards .price.director{grid-template-columns:1fr}}
.rt-ca b{overflow-wrap:anywhere;max-width:70%}
.rt-acts{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px}
.rt-acts .btn{margin:0}
.foot-ca{font-size:12px;color:var(--dim);margin-top:8px}
.foot-ca .linkbtn{font-size:12px;overflow-wrap:anywhere}
.gal-empty .grid-gal::before{content:"The gallery is being re-cut. Paste a link above and make your own.";color:var(--dim);font-size:14px}
.gal-empty .gal-more-wrap{display:none}

/* ---------- gallery player ---------- */
.pl-stage video.v{width:auto;height:min(72vh,720px);max-width:100%;aspect-ratio:9/16}
.pl-stage video.h{width:100%;aspect-ratio:16/9}

/* ---------- studio ---------- */
.modal.studio{max-width:min(1180px,calc(100vw - 24px));max-height:calc(100dvh - 24px)}
.studio .modal-in{padding:22px 24px 24px;display:flex;flex-direction:column;gap:16px;max-height:calc(100dvh - 24px);overflow:auto}
.st-head{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;flex-wrap:wrap;padding-right:44px}
.st-titles h3{margin:10px 0 4px}
.st-url{font-size:12px;color:var(--dim);margin:0;overflow-wrap:anywhere}
.st-crew{display:flex;gap:6px;list-style:none;margin:6px 0 0;padding:0;flex-wrap:wrap}
.st-crew li{display:grid;grid-template-columns:auto 1fr;column-gap:7px;align-items:center;padding:7px 11px;border-radius:12px;border:1px solid var(--line);background:rgba(255,255,255,.02);min-width:104px;transition:border-color .3s,background .3s}
.st-crew li i{grid-row:span 2;width:8px;height:8px;border-radius:50%;background:#3a3a3e}
.st-crew li b{font-size:12.5px;font-weight:700}
.st-crew li span{font:500 10.5px/1.3 'JetBrains Mono',monospace;color:var(--dim)}
.st-crew li.working{border-color:var(--c);background:color-mix(in srgb,var(--c) 8%,transparent)}
.st-crew li.working i{background:var(--c);box-shadow:0 0 0 0 var(--c);animation:stpulse 1.2s ease-out infinite}
.st-crew li.done i{background:var(--c)}
.st-crew li.done span{color:var(--soft)}
.st-crew li.error{border-color:#ff6b6b}
.st-crew li.error i{background:#ff6b6b}
@keyframes stpulse{0%{box-shadow:0 0 0 0 color-mix(in srgb,var(--c) 70%,transparent)}100%{box-shadow:0 0 0 9px transparent}}
.st-body{display:grid;grid-template-columns:minmax(0,1fr) minmax(320px,420px);gap:22px;align-items:start}
.st-stage{position:sticky;top:0;display:flex;flex-direction:column;gap:10px;align-items:center}
.st-screen{position:relative;border-radius:16px;overflow:hidden;background:#000;border:1px solid var(--line);box-shadow:0 30px 80px rgba(0,0,0,.5)}
.st-screen[data-fmt="9:16"]{aspect-ratio:9/16;height:min(70dvh,680px);max-width:100%}
.st-screen[data-fmt="16:9"]{aspect-ratio:16/9;width:100%}
.st-screen canvas,.st-screen video{position:absolute;inset:0;width:100%;height:100%;display:block;object-fit:contain;background:#000}
.st-scan{position:absolute;inset:0;display:grid;place-items:center;text-align:center;padding:24px;
  background:radial-gradient(60% 50% at 50% 40%,rgba(255,210,63,.12),transparent 70%),repeating-linear-gradient(0deg,rgba(255,255,255,.025) 0 1px,transparent 1px 4px),#070708}
.st-scan::after{content:"";position:absolute;left:0;right:0;height:22%;top:-22%;background:linear-gradient(transparent,rgba(255,210,63,.12),transparent);animation:rscan 2.4s linear infinite}
@keyframes rscan{to{top:100%}}
.st-scan-in p{margin:14px 0 0;color:var(--soft);font-size:14px}
.st-timer{font-size:12px;color:var(--dim)!important;margin-top:6px!important}
.st-ring{width:74px;height:74px;margin:0 auto;animation:rpulse 1.6s ease-in-out infinite}
.st-ring svg{width:100%;height:100%;filter:drop-shadow(0 0 18px rgba(255,210,63,.45))}
@keyframes rpulse{50%{transform:scale(.9);opacity:.55}}
.st-ctrl{display:flex;align-items:center;gap:10px;width:100%;max-width:620px}
.st-ib{flex:0 0 36px;width:36px;height:36px;border-radius:50%;border:1px solid var(--line2);background:rgba(255,255,255,.03);color:var(--text);display:grid;place-items:center;cursor:pointer}
.st-ib:disabled{opacity:.35;cursor:default}
.st-ib svg{width:16px;height:16px;fill:currentColor;stroke:currentColor;stroke-width:0}
.st-ib .i-play{display:none}
.st-ib.paused .i-play{display:block}
.st-ib.paused .i-pause{display:none}
[data-st-sound] svg path:not(:first-child){fill:none;stroke-width:1.8;stroke-linecap:round}
[data-st-sound] .i-on{display:none}
[data-st-sound][aria-pressed="true"] .i-on{display:block}
[data-st-sound][aria-pressed="true"] .i-off{display:none}
.st-seek{flex:1;accent-color:var(--acc1)}
.st-time{font-size:11.5px;color:var(--dim);min-width:84px;text-align:right}
.st-side{display:flex;flex-direction:column;gap:14px;min-width:0}
.st-log{font-size:12px;line-height:1.5;color:var(--soft);max-height:170px;overflow:auto;border:1px solid var(--line);border-radius:12px;padding:10px 12px;background:#08080a}
.st-log:empty{display:none}
.st-log p{margin:0 0 5px;padding-left:12px;position:relative}
.st-log p::before{content:"";position:absolute;left:0;top:.55em;width:6px;height:6px;border-radius:50%;background:var(--c)}
.st-log b{color:var(--text);font-weight:600}
.st-log .sw{display:inline-block;width:10px;height:10px;border-radius:3px;vertical-align:-1px;margin:0 4px 0 2px}
.st-panel{display:flex;flex-direction:column;gap:14px}
.st-row{display:flex;gap:16px;flex-wrap:wrap}
.st-field{display:flex;flex-direction:column;gap:7px}
.st-lbl{font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--dim)}
.st-acc{display:inline-flex;align-items:center;gap:8px;cursor:pointer;font-size:12px;color:var(--soft)}
.st-acc input{width:34px;height:30px;border:1px solid var(--line2);border-radius:8px;background:transparent;padding:2px;cursor:pointer}
.st-script{border:1px solid var(--line);border-radius:14px;background:rgba(255,255,255,.015)}
.st-script summary{cursor:pointer;padding:12px 14px;font-weight:700;font-size:14px;display:flex;justify-content:space-between;gap:10px}
.st-script summary span{font-size:11px;color:var(--dim);font-weight:500}
.st-fields{display:flex;flex-direction:column;gap:10px;padding:0 14px 14px;max-height:42dvh;overflow:auto}
.st-f{display:flex;flex-direction:column;gap:5px;min-width:0;flex:1}
.st-f span{font-size:11.5px;color:var(--dim)}
.st-f input,.st-f textarea,.st-f select{width:100%;font:500 14px/1.4 Inter,sans-serif;color:var(--text);background:#0a0a0c;border:1px solid var(--line);border-radius:9px;padding:9px 10px;outline:0;resize:vertical}
.st-f input.mono{font-family:'JetBrains Mono',monospace;font-size:12.5px}
.st-f input:focus,.st-f textarea:focus,.st-f select:focus{border-color:var(--acc1)}
.st-f.sm{flex:0 0 120px}
.st-grp{display:flex;flex-direction:column;gap:8px;padding-top:8px;border-top:1px dashed var(--line)}
.st-grp>b{font-size:12.5px}
.st-grp small{color:var(--dim);font-weight:400;font-size:11px}
.st-pair{display:flex;gap:8px}
.st-go{display:flex;flex-direction:column;gap:6px}
.st-export{width:100%;padding:15px 20px;font-size:16px;background:var(--grad)}
.st-big{font-size:20px;font-weight:800;letter-spacing:-.01em;margin:0}
.st-qa{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px;max-height:300px;overflow:auto}
.st-qa li{display:grid;grid-template-columns:18px 1fr;column-gap:8px;font-size:13px;padding:7px 10px;border-radius:10px;background:rgba(255,255,255,.025);border:1px solid var(--line)}
.st-qa li::before{content:"✓";grid-row:span 2;color:#5ee0a0;font-weight:800}
.st-qa li.no::before{content:"!";color:#ff8a8a}
.st-qa li span{color:var(--dim);font:500 11.5px/1.4 'JetBrains Mono',monospace}
.st-acts{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.st-acts .btn{margin:0}
.studio .fine{margin:0}
@media (max-width:900px){
  .st-body{grid-template-columns:1fr}
  .st-stage{position:static}
  .st-screen[data-fmt="9:16"]{height:min(62dvh,560px)}
  .st-crew li{min-width:0;padding:6px 9px}
  .st-crew li span{display:none}
  .st-crew li i{grid-row:auto}
  .st-fields{max-height:none}
}
@media (max-width:520px){.studio .modal-in{padding:16px}.st-head{padding-right:40px}.st-pair{flex-direction:column}.st-f.sm{flex-basis:auto}}

/* ---------- my reels ---------- */
.modal.lib{max-width:min(860px,calc(100vw - 24px))}
.lib-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:14px;margin-top:14px;max-height:66dvh;overflow:auto}
.lib-item{border:1px solid var(--line);border-radius:14px;overflow:hidden;background:var(--s2)}
.lib-media{position:relative;background:#000;cursor:pointer;aspect-ratio:9/16}
.lib-item.h .lib-media{aspect-ratio:16/9}
.lib-media img,.lib-media video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.lib-media video{object-fit:contain}
.lib-body{display:flex;flex-direction:column;gap:4px;padding:10px 12px 12px;font-size:13px}
.lib-body span{font-size:10.5px;color:var(--dim)}
.lib-acts{display:flex;gap:10px;align-items:center;margin-top:6px}
.lib-acts .btn{margin:0}

/* ---------- toast ---------- */
.toast{position:fixed;left:50%;bottom:26px;transform:translate(-50%,20px);z-index:200;padding:11px 18px;border-radius:999px;background:#18181b;border:1px solid rgba(255,210,63,.4);color:var(--text);font-size:14px;box-shadow:0 20px 50px rgba(0,0,0,.6);opacity:0;transition:opacity .25s,transform .25s var(--ease)}
.toast.on{opacity:1;transform:translate(-50%,0)}
