@property --a{syntax:'<angle>';initial-value:0deg;inherits:false}
:root{
  --bg:#07040f; --violet:#7a2bff; --cyan:#12d6c8; --pink:#ff3d81; --amber:#e0a94e;
  --ink:#fff; --muted:rgba(255,255,255,.62); --faint:rgba(255,255,255,.38);
  --glass:rgba(255,255,255,.045); --glass2:rgba(255,255,255,.08); --line:rgba(255,255,255,.14);
  --grad:linear-gradient(120deg,var(--cyan),var(--violet) 55%,var(--pink));
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{background:var(--bg);color:var(--ink);font-family:"Spectral",Georgia,serif;line-height:1.6;min-height:100vh;overflow-x:hidden;position:relative}

/* ---------- ambient layers ---------- */
.aurora,.beams,.grid,.orbs,.grain,.scan{position:fixed;inset:0;pointer-events:none;z-index:0}
.aurora{filter:blur(90px);opacity:.75;
  background:
   radial-gradient(45vw 45vw at 18% 12%,var(--violet),transparent 60%),
   radial-gradient(40vw 40vw at 85% 18%,var(--cyan),transparent 60%),
   radial-gradient(50vw 50vw at 70% 92%,var(--pink),transparent 62%),
   radial-gradient(38vw 38vw at 15% 88%,#2a1a6b,transparent 60%);
  animation:drift 26s ease-in-out infinite alternate, hue 40s linear infinite}
@keyframes drift{from{transform:translate(-3%,-2%) scale(1)}to{transform:translate(4%,3%) scale(1.18)}}
@keyframes hue{to{filter:blur(90px) hue-rotate(360deg)}}
.beams{opacity:.22;mix-blend-mode:screen;
  background:conic-gradient(from 0deg at 50% 45%,transparent 0 8%,rgba(18,214,200,.5) 10%,transparent 14% 30%,rgba(122,43,255,.5) 33%,transparent 37% 62%,rgba(255,61,129,.45) 66%,transparent 70% 100%);
  animation:beamspin 60s linear infinite}
@keyframes beamspin{to{transform:rotate(360deg)}}
.grid{opacity:.16;
  background-image:linear-gradient(rgba(255,255,255,.5) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.5) 1px,transparent 1px);
  background-size:52px 52px;
  -webkit-mask:radial-gradient(120% 80% at 50% 0%,#000 20%,transparent 72%);mask:radial-gradient(120% 80% at 50% 0%,#000 20%,transparent 72%);
  transform:perspective(600px) rotateX(56deg) translateY(-8%);transform-origin:top;animation:gridpan 18s linear infinite}
@keyframes gridpan{to{background-position:0 52px}}
.orbs span{position:absolute;border-radius:50%;filter:blur(30px);opacity:.5;mix-blend-mode:screen}
.orbs span:nth-child(1){width:280px;height:280px;left:8%;top:22%;background:var(--cyan);animation:float1 19s ease-in-out infinite}
.orbs span:nth-child(2){width:220px;height:220px;right:10%;top:44%;background:var(--pink);animation:float2 23s ease-in-out infinite}
.orbs span:nth-child(3){width:340px;height:340px;left:40%;bottom:-6%;background:var(--violet);animation:float1 27s ease-in-out infinite reverse}
@keyframes float1{50%{transform:translate(30px,-40px) scale(1.1)}}
@keyframes float2{50%{transform:translate(-40px,30px) scale(1.14)}}
.grain{opacity:.28;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.55'/%3E%3C/svg%3E")}
.scan{opacity:.5;background:linear-gradient(180deg,transparent 0,rgba(18,214,200,.05) 46%,rgba(18,214,200,.1) 50%,rgba(18,214,200,.05) 54%,transparent 100%);height:180px;top:-180px;animation:scan 7s linear infinite}
@keyframes scan{to{transform:translateY(calc(100vh + 360px))}}

main{position:relative;z-index:2;max-width:820px;margin:0 auto;padding:clamp(28px,6vh,72px) 22px 60px}

/* ---------- type ---------- */
h1,h2,h3,.kicker,.kicker2,.card-tab,.seg-btn,.go,.add,.grp{font-family:"Archivo",sans-serif}
.kicker,.kicker2{font-family:"Space Mono",monospace;font-size:.72rem;letter-spacing:.28em;text-transform:uppercase;color:var(--cyan);display:inline-flex;align-items:center;gap:9px}
.rec{width:9px;height:9px;border-radius:50%;background:var(--pink);box-shadow:0 0 14px var(--pink);animation:blink 1.4s ease-in-out infinite}
@keyframes blink{50%{opacity:.25}}

/* ---------- hero ---------- */
.hero{text-align:center;padding:14px 0 30px;animation:rise .9s cubic-bezier(.2,.7,.2,1) both}
.title{font-weight:900;font-size:clamp(2.8rem,10vw,6rem);line-height:.92;letter-spacing:-.04em;margin:16px 0 0;
  text-shadow:0 0 60px rgba(122,43,255,.35)}
.title .g{background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent;background-size:200% auto;animation:sheen 6s linear infinite}
@keyframes sheen{to{background-position:200% center}}
.sub{color:var(--muted);font-size:clamp(1rem,1.9vw,1.2rem);max-width:56ch;margin:20px auto 0}
.eq{display:flex;align-items:flex-end;justify-content:center;gap:3px;height:60px;margin:26px auto 0;max-width:520px}
.eq i{flex:1;max-width:7px;border-radius:3px;background:var(--grad);opacity:.85;height:var(--h,30%);
  transform-origin:bottom;animation:bounce 1.1s ease-in-out infinite;animation-delay:var(--d,0s);box-shadow:0 0 10px rgba(18,214,200,.4)}
@keyframes bounce{0%,100%{transform:scaleY(.35)}50%{transform:scaleY(1)}}
.work-eq{height:40px;margin:18px 0 4px;max-width:none}
.work-eq i{animation-duration:.7s}

/* ---------- cards ---------- */
.card{position:relative;background:linear-gradient(180deg,var(--glass2),var(--glass));border:1px solid var(--line);border-radius:26px;
  padding:clamp(24px,4.4vw,40px);backdrop-filter:blur(18px);margin-top:22px;scroll-margin-top:34px;
  box-shadow:0 40px 120px rgba(0,0,0,.55),inset 0 1px 0 rgba(255,255,255,.06)}
.reveal{animation:rise .9s .1s cubic-bezier(.2,.7,.2,1) both}
@keyframes rise{from{opacity:0;transform:translateY(26px) scale(.99)}to{opacity:1;transform:none}}
.glow::before{content:"";position:absolute;inset:0;border-radius:inherit;padding:1.4px;pointer-events:none;
  background:conic-gradient(from var(--a),transparent 0 58%,var(--cyan) 70%,var(--violet) 82%,var(--pink) 92%,transparent 100%);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;
  animation:spin 8s linear infinite;opacity:.8}
@keyframes spin{to{--a:360deg}}
.card-tab{position:absolute;top:-11px;left:26px;font-family:"Space Mono",monospace;font-size:.62rem;letter-spacing:.18em;text-transform:uppercase;
  color:#07040f;background:var(--grad);padding:5px 12px;border-radius:100px;box-shadow:0 8px 24px rgba(122,43,255,.4)}
.done-tab{background:linear-gradient(120deg,var(--cyan),#26e0a0)}

/* ---------- segmented ---------- */
.seg{display:inline-flex;background:rgba(255,255,255,.05);border:1px solid var(--line);border-radius:100px;padding:4px;margin-bottom:24px}
.seg-btn{font-weight:700;font-size:.9rem;color:var(--muted);background:transparent;border:none;border-radius:100px;padding:10px 20px;cursor:pointer;transition:.25s}
.seg-btn.on{background:var(--grad);color:#07040f;box-shadow:0 8px 24px rgba(18,214,200,.35)}

/* ---------- fields ---------- */
.field{margin-bottom:20px}
.field>label{display:block;font-family:"Space Mono",monospace;font-size:.66rem;letter-spacing:.14em;text-transform:uppercase;color:var(--faint);margin-bottom:10px}
.opt{color:var(--faint);letter-spacing:.04em;text-transform:none}
input,textarea{width:100%;background:rgba(255,255,255,.04);border:1px solid var(--line);border-radius:15px;padding:15px 17px;color:#fff;font-family:"Spectral",serif;font-size:1rem;transition:.2s}
input:focus,textarea:focus{outline:none;border-color:var(--cyan);background:rgba(18,214,200,.06);box-shadow:0 0 0 4px rgba(18,214,200,.12)}
input::placeholder,textarea::placeholder{color:var(--faint)}
input[type=file]{padding:13px;font-family:"Space Mono",monospace;font-size:.8rem;cursor:pointer}
.mt{margin-top:10px}
.hint{color:var(--faint);font-size:.82rem;margin-top:8px}
.spk{display:flex;gap:8px;margin-bottom:8px}
.spk input{flex:1}
.spk .rm{flex:none;width:48px;border:1px solid var(--line);background:rgba(255,255,255,.03);color:var(--muted);border-radius:13px;cursor:pointer;font-size:1.2rem;transition:.2s}
.spk .rm:hover{color:var(--pink);border-color:var(--pink);background:rgba(255,61,129,.08)}
.add{background:transparent;border:1px dashed var(--line);color:var(--cyan);border-radius:13px;padding:11px 15px;font-family:"Space Mono",monospace;font-size:.7rem;letter-spacing:.08em;text-transform:uppercase;cursor:pointer;transition:.2s}
.add:hover{border-color:var(--cyan);background:rgba(18,214,200,.07);box-shadow:0 0 24px rgba(18,214,200,.18)}

/* ---------- dropzone ---------- */
.drop{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:5px;min-height:190px;padding:30px;border:2px dashed var(--line);border-radius:20px;cursor:pointer;background:rgba(255,255,255,.03);transition:.25s;overflow:hidden}
.drop::before{content:"";position:absolute;inset:0;background:radial-gradient(60% 60% at 50% 30%,rgba(18,214,200,.12),transparent 70%);opacity:0;transition:.25s}
.drop:hover{border-color:rgba(18,214,200,.5)}
.drop:hover::before,.drop.drag::before{opacity:1}
.drop.drag{border-color:var(--cyan);background:rgba(18,214,200,.08);box-shadow:inset 0 0 60px rgba(18,214,200,.25),0 0 0 4px rgba(18,214,200,.12)}
.drop-inner{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;gap:5px}
.drop-ico{color:var(--cyan);margin-bottom:6px;filter:drop-shadow(0 0 12px rgba(18,214,200,.55));animation:floaty 3s ease-in-out infinite}
@keyframes floaty{50%{transform:translateY(-7px)}}
.drop-title{font-family:"Archivo",sans-serif;font-weight:800;font-size:1.08rem}
.drop-sub{color:var(--muted);font-size:.9rem}
.drop-formats{font-family:"Space Mono",monospace;font-size:.6rem;letter-spacing:.14em;text-transform:uppercase;color:var(--faint);margin-top:10px}
.drop.has{border-style:solid;border-color:rgba(18,214,200,.45);cursor:default;min-height:0;padding:18px}
.drop.has .drop-inner{display:none}
.drop-file{position:relative;z-index:1;width:100%;display:flex;justify-content:center}
.fchip{display:flex;align-items:center;gap:12px;background:rgba(18,214,200,.1);border:1px solid rgba(18,214,200,.4);border-radius:14px;padding:12px 14px;max-width:100%}
.fchip .drop-check{color:var(--cyan);font-weight:900}
.fname{font-family:"Space Mono",monospace;font-size:.8rem;color:#fff;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:52vw}
.fsize{color:var(--muted);font-size:.72rem;font-family:"Space Mono",monospace;flex:none}
.fclear{border:none;background:rgba(255,255,255,.12);color:#fff;width:26px;height:26px;border-radius:50%;cursor:pointer;font-size:.95rem;flex:none;line-height:1}
.fclear:hover{background:var(--pink)}

/* ---------- video scanner (progress) ---------- */
.scanner{position:relative;margin:22px auto 6px;max-width:360px;border-radius:16px;overflow:hidden;border:1px solid var(--line);aspect-ratio:16/9;background:#0a0715;box-shadow:0 20px 60px rgba(0,0,0,.5)}
.scanner img{width:100%;height:100%;object-fit:cover;opacity:.92;filter:saturate(1.04);animation:scanzoom 16s ease-in-out infinite alternate}
@keyframes scanzoom{from{transform:scale(1.02)}to{transform:scale(1.1)}}
.scanner-grid{position:absolute;inset:0;pointer-events:none;background:radial-gradient(135% 95% at 50% 22%,transparent 46%,rgba(7,4,15,.62) 100%)}
.scanner-line{position:absolute;inset:0;pointer-events:none;mix-blend-mode:screen;
  background:linear-gradient(115deg,transparent 34%,rgba(255,255,255,.09) 47%,rgba(18,214,200,.13) 50%,rgba(122,43,255,.09) 53%,transparent 66%);
  transform:translateX(-46%);animation:sheenpass 5.5s ease-in-out infinite}
@keyframes sheenpass{0%{transform:translateX(-46%)}58%,100%{transform:translateX(46%)}}
.scanner-tag{position:absolute;left:12px;bottom:10px;font-family:"Space Mono",monospace;font-size:.6rem;letter-spacing:.14em;text-transform:uppercase;color:#fff;background:rgba(0,0,0,.42);border:1px solid rgba(255,255,255,.18);border-radius:100px;padding:5px 11px;backdrop-filter:blur(6px)}

/* ---------- on-brand waveform (single, calm flowing) ---------- */
.hero-eq{height:38px;gap:5px;max-width:400px;align-items:center;opacity:.7}
.hero-eq i{max-width:3px;transform-origin:center;background:linear-gradient(180deg,var(--cyan),var(--violet));box-shadow:none;
  animation-name:wave;animation-duration:3.4s;animation-iteration-count:infinite;animation-timing-function:ease-in-out}
@keyframes wave{0%,100%{transform:scaleY(.42)}50%{transform:scaleY(.85)}}

/* ---------- buttons ---------- */
.go{position:relative;width:100%;margin-top:10px;background:var(--grad);background-size:200% auto;color:#07040f;font-weight:800;font-size:1.08rem;
  border:none;border-radius:100px;padding:18px;cursor:pointer;overflow:hidden;text-decoration:none;display:block;text-align:center;
  box-shadow:0 16px 44px rgba(122,43,255,.42);transition:transform .2s,box-shadow .2s;animation:sheen 5s linear infinite}
.go span{position:relative;z-index:2}
.go::after{content:"";position:absolute;top:0;left:-60%;width:45%;height:100%;z-index:1;transform:skewX(-20deg);
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.55),transparent);animation:shimmer 3.4s ease-in-out infinite}
@keyframes shimmer{0%,60%{left:-60%}100%{left:130%}}
.go:hover{transform:translateY(-2px);box-shadow:0 22px 60px rgba(18,214,200,.5)}
.go[disabled]{opacity:.6;cursor:not-allowed;transform:none;animation:none}
.go[disabled]::after{display:none}
.go.dl{margin-top:18px;background:linear-gradient(120deg,#26e0a0,var(--cyan))}
.ghost{width:100%;margin-top:12px;background:transparent;border:1px solid var(--line);color:var(--muted);border-radius:100px;padding:13px;font-family:"Archivo",sans-serif;font-weight:700;cursor:pointer;transition:.2s}
.ghost:hover{color:#fff;background:rgba(255,255,255,.05)}
.err{color:var(--pink);font-size:.9rem;margin-top:12px;min-height:1em;text-align:center}
.hidden{display:none !important}

/* ---------- progress ---------- */
.orbit{position:relative;width:96px;height:96px;margin:8px auto 22px}
.orbit span{position:absolute;inset:0;border-radius:50%;border:1.5px solid transparent}
.orbit span:nth-child(1){border-top-color:var(--cyan);animation:spin2 1.3s linear infinite}
.orbit span:nth-child(2){inset:12px;border-right-color:var(--violet);animation:spin2 1.9s linear infinite reverse}
.orbit span:nth-child(3){inset:24px;border-bottom-color:var(--pink);animation:spin2 1.1s linear infinite}
@keyframes spin2{to{transform:rotate(360deg)}}
.orbit-core{position:absolute;inset:38px;border-radius:50%;background:var(--grad);filter:blur(2px);box-shadow:0 0 30px var(--cyan);animation:pulse 1.6s ease-in-out infinite}
@keyframes pulse{50%{transform:scale(1.25)}}
.chain{display:flex;justify-content:space-between;gap:6px;margin-bottom:22px;flex-wrap:wrap}
.node{flex:1;min-width:64px;text-align:center;opacity:.4;transition:opacity .4s}
.node i{display:block;width:14px;height:14px;border-radius:50%;margin:0 auto 8px;border:1.5px solid var(--line);background:rgba(255,255,255,.05);transition:.4s}
.node b{font-family:"Space Mono",monospace;font-size:.58rem;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);font-weight:400}
.node.lit{opacity:1}
.node.lit i{background:var(--grad);border-color:transparent;box-shadow:0 0 18px var(--cyan)}
.node.lit b{color:#fff}
.prog-now{text-align:center;font-family:"Archivo",sans-serif;font-weight:800;font-size:clamp(1.5rem,4.6vw,2.5rem);letter-spacing:-.02em;line-height:1.14;margin:4px 0 8px;min-height:1.3em;
  background:var(--grad);background-size:200% auto;-webkit-background-clip:text;background-clip:text;color:transparent;animation:sheen 5s linear infinite}
.prog-now.pop{animation:sheen 5s linear infinite,popin .5s cubic-bezier(.2,.8,.2,1)}
@keyframes popin{from{opacity:0;transform:translateY(10px) scale(.97)}to{opacity:1;transform:none}}
.prog-sub{text-align:center;margin-bottom:18px}
#progPct{font-family:"Space Mono",monospace;font-size:1.15rem;color:var(--cyan);font-weight:700;letter-spacing:.12em}
.bar{position:relative;height:12px;background:rgba(255,255,255,.08);border-radius:12px;overflow:hidden;border:1px solid var(--line)}
.bar i{display:block;height:100%;width:0;border-radius:12px;background:var(--grad);background-size:200% auto;box-shadow:0 0 24px rgba(18,214,200,.6);transition:width .6s cubic-bezier(.3,.8,.3,1);animation:sheen 3s linear infinite}
.bar i::after{content:"";position:absolute;inset:0;background-image:repeating-linear-gradient(45deg,rgba(255,255,255,.18) 0 10px,transparent 10px 20px);animation:stripes 1s linear infinite}
@keyframes stripes{to{background-position:28px 0}}
.log{margin-top:24px;font-family:"Space Mono",monospace;font-size:1.02rem;color:var(--muted);text-align:center;line-height:2.15;letter-spacing:.02em}
.log div:last-child{color:var(--cyan)}

/* ---------- results ---------- */
.res-head{margin-bottom:20px}
.res-head h2{font-size:clamp(1.6rem,4vw,2.1rem);font-weight:900;margin-top:8px;letter-spacing:-.02em}
.grp{display:flex;align-items:center;gap:12px;font-weight:800;font-size:1.05rem;margin:26px 0 14px}
.grp-n{width:28px;height:28px;border-radius:9px;background:var(--grad);color:#07040f;display:grid;place-items:center;font-size:.85rem;box-shadow:0 6px 18px rgba(122,43,255,.4)}
.takes{display:grid;gap:12px;grid-template-columns:repeat(3,minmax(0,1fr))}
@media(max-width:760px){.takes{grid-template-columns:1fr}}
#resCard{width:min(1040px,94vw);max-width:none;position:relative;left:50%;transform:translateX(-50%)}
@media(max-width:900px){#resCard{width:auto;left:auto;transform:none}}
.take-edit{width:100%;background:rgba(255,255,255,.03);border:1px solid var(--line);border-radius:12px;padding:11px 13px;color:#fff;font-family:"Spectral",serif;font-size:.9rem;line-height:1.5;margin-bottom:10px;resize:none;min-height:52px;overflow:hidden}
.take-edit:focus{outline:none;border-color:var(--cyan);background:rgba(18,214,200,.05)}
.take-regen{margin-top:10px;display:inline-flex;background:transparent;border:1px solid var(--cyan);color:var(--cyan);border-radius:100px;padding:9px 15px;font-family:"Archivo",sans-serif;font-weight:700;font-size:.8rem;cursor:pointer;transition:.2s;align-items:center;justify-content:center;width:100%}
.take-regen:hover{background:rgba(18,214,200,.1)}
/* rattrapage d'une voix manquante : ambre, pour ne pas se confondre avec la régénération après édition */
.take-fix{border-color:var(--amber);color:var(--amber)}
.take-fix:hover{background:rgba(224,169,78,.1)}
.take-regen[disabled]{opacity:.6;cursor:wait}
.eng-lab{font-family:"Space Mono",monospace;font-size:.56rem;letter-spacing:.14em;text-transform:uppercase;color:var(--faint);margin:10px 0 4px;display:flex;align-items:center;gap:6px}
.eng-lab::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--cyan)}
/* selectable voice version */
.ver{border:1px solid transparent;border-radius:14px;padding:8px 10px 6px;margin:6px 0;cursor:pointer;transition:.18s}
.ver:hover{background:rgba(255,255,255,.03);border-color:rgba(255,255,255,.12)}
.ver.vsel{border-color:var(--cyan);background:rgba(18,214,200,.07)}
.ver .eng-lab{margin:2px 0 6px;cursor:pointer}
.ver .eng-lab::before{display:none}
.ver.vsel .eng-lab{color:#fff}
.ver-dot{width:13px;height:13px;border-radius:50%;border:1.5px solid var(--line);flex:none;position:relative;transition:.2s}
.ver.vsel .ver-dot{background:var(--grad);border-color:transparent;box-shadow:0 0 10px var(--cyan)}
.ver.vsel .ver-dot::after{content:"✓";position:absolute;inset:0;display:grid;place-items:center;font-size:.5rem;color:#07040f;font-weight:900}
.cost-line{text-align:center;margin-top:16px;font-family:"Space Mono",monospace;font-size:.72rem;letter-spacing:.05em;color:var(--faint)}
/* case « inclure la pub » : étape 4 du formulaire, et anciens épisodes dans le panneau des coupes */
.promo-head{display:flex;gap:13px;align-items:flex-start;cursor:pointer;margin-bottom:12px}
.promo-head input{width:20px;height:20px;flex:none;margin-top:1px;accent-color:var(--cyan);cursor:pointer}
.promo-lab{font-weight:700;font-size:.95rem;display:flex;align-items:center;gap:9px;flex-wrap:wrap}
/* hauteur plancher en em : autoGrow mesure zéro tant que l'étape est masquée, et le champ restait
   écrasé sur une ligne avec le texte qui défilait. min-height l'emporte sur la hauteur en ligne. */
.open-edit{font-style:italic;line-height:1.6;resize:vertical;overflow:hidden;display:block;padding:14px 17px}
#wPromo{min-height:8.4em}
#wTagline{min-height:4.6em}
.open-edit:disabled{opacity:.4}
/* la version parlée de la pub : voir « the-artist-academy.fr » devenir « point F R » avant de payer la voix */
#wPromoSpoken{margin-top:7px;font-family:"Space Mono",monospace;font-size:.66rem;color:var(--muted);opacity:.75}
#wPromoSpoken b{color:var(--amber);font-weight:400}
.lc-status.gen{animation:genpulse 1.15s ease-in-out infinite}
@keyframes genpulse{0%,100%{opacity:.45}50%{opacity:1}}
/* karaoke word ticker under the video */
.karaoke{max-width:360px;margin:12px auto 0;display:flex;gap:9px;justify-content:center;align-items:baseline;flex-wrap:nowrap;white-space:nowrap;overflow:hidden;min-height:1.5em;font-family:"Space Mono",monospace;font-size:.82rem;letter-spacing:.01em}
.karaoke .kw{opacity:.5;color:var(--muted);transition:opacity .15s,transform .15s,color .15s}
.karaoke .kw-in{opacity:.85;color:#fff}
.karaoke .kw-out{opacity:.12}
.karaoke .kw-mid{opacity:1;color:var(--cyan);text-shadow:0 0 12px rgba(18,214,200,.55);transform:scale(1.08)}
.take{position:relative;min-width:0;border:1px solid var(--line);border-radius:18px;padding:18px;background:rgba(255,255,255,.03);cursor:pointer;transition:transform .2s,box-shadow .2s,border-color .2s;overflow:hidden}
.take::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--grad);opacity:0;transition:.25s}
.take:hover{transform:translateY(-2px);background:rgba(255,255,255,.055);border-color:rgba(255,255,255,.28)}
.take.sel{border-color:var(--cyan);box-shadow:0 0 0 1px var(--cyan),0 18px 44px rgba(18,214,200,.18)}
.take.sel::before{opacity:1}
.take-head{display:flex;align-items:center;gap:12px;margin-bottom:10px}
.take-dot{width:20px;height:20px;border-radius:50%;border:1.5px solid var(--line);flex:none;transition:.25s;position:relative}
.take.sel .take-dot{background:var(--grad);border-color:transparent;box-shadow:0 0 16px var(--cyan)}
.take.sel .take-dot::after{content:"✓";position:absolute;inset:0;display:grid;place-items:center;font-size:.7rem;color:#07040f;font-weight:900}
.take-name{font-weight:800;font-size:.95rem}
.take-txt{color:var(--muted);font-size:.92rem;margin-bottom:12px}
.take audio{width:100%;height:40px;filter:saturate(1.1)}

/* ---------- episode ---------- */
#epCard{text-align:center}
.ep-burst{position:absolute;inset:0;pointer-events:none;border-radius:inherit;overflow:hidden;background:radial-gradient(60% 60% at 50% 0%,rgba(18,214,200,.22),transparent 70%);animation:pulse 3s ease-in-out infinite}
/* produce more formats (video / shorts) */
.produce{margin-top:22px;padding:20px;border:1px solid var(--line);border-radius:18px;background:rgba(255,255,255,.03);text-align:left}
.produce-h{font-family:"Space Mono",monospace;font-size:.64rem;letter-spacing:.16em;text-transform:uppercase;color:var(--cyan);margin-bottom:14px}
.prod-opt{display:flex;gap:13px;align-items:flex-start;cursor:pointer;padding:12px;border:1px solid var(--line);border-radius:14px;background:rgba(255,255,255,.02);margin-bottom:10px;transition:.2s}
.prod-opt:hover{border-color:rgba(18,214,200,.4);background:rgba(18,214,200,.04)}
.prod-opt input{width:20px;height:20px;flex:none;margin-top:2px;accent-color:var(--cyan);cursor:pointer}
.prod-sub{margin-left:26px;padding:9px 12px;background:rgba(255,255,255,.015);border-style:dashed}
.prod-txt{display:flex;flex-direction:column;gap:3px}
.prod-txt b{font-family:"Archivo",sans-serif;font-weight:700;font-size:.98rem}
.prod-txt small{color:var(--muted);font-size:.82rem;line-height:1.45}
.prod-go{margin-top:6px}
#produceCard .produce{margin-top:0}
.produce-locked{padding:20px 22px;border:1px solid rgba(224,169,78,.45);border-radius:18px;background:rgba(224,169,78,.06);text-align:left}
.produce-locked b{font-family:"Archivo",sans-serif;font-weight:800;font-size:1rem;color:var(--amber)}
.produce-locked p{color:var(--muted);font-size:.9rem;line-height:1.5;margin-top:8px}
.prod-go.working{cursor:wait;filter:saturate(.85)}
.epm-redo{background:none;border:1px solid rgba(255,255,255,.14);color:var(--muted);border-radius:6px;padding:5px 10px;font-family:"Space Mono",monospace;font-size:.68rem;cursor:pointer;transition:border-color .18s,color .18s}
.epm-redo:hover{border-color:var(--amber);color:var(--amber)}
.epm-redo:disabled{opacity:.45;cursor:default}
.epm-redo-c{margin-left:7px;padding-left:7px;border-left:1px solid rgba(255,255,255,.14);color:var(--amber);opacity:.9}
.epm-break{margin-top:-4px;margin-bottom:8px;font-family:"Space Mono",monospace;font-size:.66rem;color:var(--muted);opacity:.75}
.prod-eta{margin-top:10px;font-family:"Space Mono",monospace;font-size:.72rem;color:var(--amber);opacity:.85;text-align:left}
.prod-status{margin-top:12px;font-family:"Space Mono",monospace;font-size:.76rem;line-height:1.7;color:var(--muted);text-align:left}
.prod-status a{color:var(--cyan)}
.prod-status .ok{color:#26e0a0}.prod-status .wait{color:var(--amber)}
.ep-title{font-size:clamp(1.8rem,5vw,2.6rem);font-weight:900;letter-spacing:-.02em;margin:10px 0 20px}
.ep-title .g{background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
#epAudio{width:100%;margin-top:6px}
.foot{text-align:center;color:var(--faint);font-family:"Space Mono",monospace;font-size:.66rem;letter-spacing:.14em;text-transform:uppercase;margin-top:40px}

/* ---------- on-brand audio player ---------- */
.player{display:flex;align-items:center;gap:12px;background:rgba(255,255,255,.04);border:1px solid var(--line);border-radius:14px;padding:10px 13px;transition:.2s}
.player.playing{border-color:rgba(18,214,200,.4);box-shadow:0 0 26px rgba(18,214,200,.12)}
.player audio{display:none}
.pp{flex:none;width:42px;height:42px;border-radius:50%;border:none;cursor:pointer;background:var(--grad);color:#07040f;display:grid;place-items:center;box-shadow:0 6px 20px rgba(122,43,255,.4);transition:transform .15s}
.pp:hover{transform:scale(1.06)}
.pp svg{width:16px;height:16px}
.pp-skip{position:relative;width:32px;height:32px;background:rgba(255,255,255,.05);color:var(--muted);box-shadow:none;border:1px solid var(--line)}
.pp-skip:hover{transform:none;color:#fff;border-color:var(--cyan);background:rgba(18,214,200,.08)}
.pp-skip svg{width:18px;height:18px}
.pp-skip .skip-n{position:absolute;top:52%;left:50%;transform:translate(-50%,-50%);font-family:"Space Mono",monospace;font-size:.42rem;font-weight:700;letter-spacing:-.02em;pointer-events:none}
.ep-player .pp-skip{width:38px;height:38px}
.ep-player .pp-skip svg{width:21px;height:21px}
.ep-player .pp-skip .skip-n{font-size:.48rem}
.wave{flex:1;display:flex;align-items:center;gap:2px;height:40px;cursor:pointer;min-width:0}
.wave i{flex:1;max-width:4px;border-radius:2px;height:var(--h,40%);background:rgba(255,255,255,.16);transition:background .12s,box-shadow .12s}
.wave i.on{background:linear-gradient(180deg,var(--cyan),var(--violet));box-shadow:0 0 6px rgba(18,214,200,.5)}
.ptime{flex:none;font-family:"Space Mono",monospace;font-size:.7rem;color:var(--muted);white-space:nowrap}
.pdl{flex:none;width:34px;height:34px;border-radius:10px;display:grid;place-items:center;color:var(--faint);border:1px solid var(--line);background:rgba(255,255,255,.03);transition:.18s;text-decoration:none}
.pdl:hover{color:var(--cyan);border-color:var(--cyan);background:rgba(18,214,200,.09);transform:translateY(-1px)}
.pdl svg{width:15px;height:15px}
.hostvoice{margin-top:28px;padding-top:22px;border-top:1px solid var(--line)}
.hostvoice .grp-n{background:linear-gradient(120deg,#e0a94e,var(--pink))}
.ep-wrap{margin-top:8px}
.ep-player{padding:14px 16px}
.ep-player .pp{width:52px;height:52px}
.ep-player .wave{height:52px;position:relative;gap:3px}
/* zoned episode waveform: Intro / Pub / Entretien / Conclusion */
.wave.zoned i{max-width:5px}
.wave.zoned i.z-intro{background:rgba(18,214,200,.22)}
.wave.zoned i.z-pub{background:rgba(224,169,78,.28)}
.wave.zoned i.z-talk{background:rgba(122,43,255,.22)}
.wave.zoned i.z-outro{background:rgba(255,61,129,.22)}
.wave.zoned i.z-intro.on{background:linear-gradient(180deg,var(--cyan),#0bbfae);box-shadow:0 0 7px rgba(18,214,200,.6)}
.wave.zoned i.z-pub.on{background:linear-gradient(180deg,#f0c674,var(--amber));box-shadow:0 0 7px rgba(224,169,78,.6)}
.wave.zoned i.z-talk.on{background:linear-gradient(180deg,#9a5bff,var(--violet));box-shadow:0 0 7px rgba(122,43,255,.55)}
.wave.zoned i.z-outro.on{background:linear-gradient(180deg,#ff5f97,var(--pink));box-shadow:0 0 7px rgba(255,61,129,.55)}
.z-div{position:absolute;top:3px;bottom:3px;width:1px;background:rgba(255,255,255,.32);pointer-events:none}
.ep-legend{display:flex;justify-content:center;gap:14px;flex-wrap:wrap;margin-top:13px}
.ep-legend .lg{display:inline-flex;align-items:center;gap:7px;font-family:"Space Mono",monospace;font-size:.64rem;letter-spacing:.09em;text-transform:uppercase;color:var(--muted);background:rgba(255,255,255,.04);border:1px solid var(--line);border-radius:100px;padding:7px 13px;cursor:pointer;transition:.18s}
.ep-legend .lg:hover{color:#fff;background:rgba(255,255,255,.09);transform:translateY(-1px)}
.ep-legend .lg-intro:hover{border-color:var(--cyan);box-shadow:0 0 18px rgba(18,214,200,.25)}
.ep-legend .lg-pub:hover{border-color:var(--amber);box-shadow:0 0 18px rgba(224,169,78,.28)}
.ep-legend .lg-talk:hover{border-color:var(--violet);box-shadow:0 0 18px rgba(122,43,255,.25)}
.ep-legend .lg-outro:hover{border-color:var(--pink);box-shadow:0 0 18px rgba(255,61,129,.25)}
.ep-legend .lg i{width:9px;height:9px;border-radius:50%}
.ep-legend .lg-intro i{background:var(--cyan)}
.ep-legend .lg-pub i{background:var(--amber)}
.ep-legend .lg-talk i{background:var(--violet)}
.ep-legend .lg-outro i{background:var(--pink)}
/* thin colored zone bar + ±15s skip buttons under the full episode video (Intro/Pub/Entretien/Conclusion) */
.vzone-wrap{display:flex;align-items:center;gap:10px;margin-top:10px}
.vzone-wrap .pp-skip{width:36px;height:36px}
.vzone-bar{position:relative;display:flex;flex:1;min-width:0;height:10px;border-radius:6px;overflow:hidden;cursor:pointer;background:rgba(255,255,255,.05)}
.vzone-bar i{height:100%;flex:none}
.vzone-bar i.z-intro{background:linear-gradient(180deg,var(--cyan),#0bbfae)}
.vzone-bar i.z-pub{background:linear-gradient(180deg,#f0c674,var(--amber))}
.vzone-bar i.z-talk{background:linear-gradient(180deg,#9a5bff,var(--violet))}
.vzone-bar i.z-outro{background:linear-gradient(180deg,#ff5f97,var(--pink))}
.vzone-play{position:absolute;top:-3px;bottom:-3px;width:2px;background:#fff;box-shadow:0 0 6px rgba(255,255,255,.8);pointer-events:none}
.ep-cut{margin:14px auto 0;text-align:center;font-family:"Space Mono",monospace;font-size:.72rem;letter-spacing:.04em;color:var(--faint)}
/* end-of-interview trimmer (auto-promo removal) */
.endcut{margin:22px 0 6px;padding:16px 18px;border:1px solid var(--line);border-radius:16px;background:rgba(255,255,255,.03)}
.endcut-top{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin-bottom:13px}
.endcut-lab{font-family:"Space Mono",monospace;font-size:.7rem;letter-spacing:.12em;text-transform:uppercase;color:var(--cyan)}
.endcut-read{font-family:"Space Mono",monospace;font-size:.78rem;color:#fff}
.endcut-note{color:var(--faint);font-size:.8rem;margin-top:11px}
/* waveform trimmer: full waveform + highlighted removed region + two handles */
.rng{position:relative;margin:16px 0 4px;height:72px}
/* each bar owns an exact 1/n slice of the track (width set inline as a %), so the row always spans 100% and
   bar centres line up with the handles, which are positioned on that same 0-100% scale. Sizing the bar with
   flex instead let a max-width cap leave dead space at the right end, so the handles drifted off the region. */
.rng-wave{display:flex;align-items:center;height:100%;width:100%}
.rng-wave i{flex:none;height:var(--h,40%);min-height:2px;background:linear-gradient(180deg,var(--cyan),var(--violet));opacity:.38;background-clip:content-box;border-left:1px solid transparent;border-right:1px solid transparent;border-radius:3px;transition:background .12s,opacity .12s,box-shadow .12s}
.rng-wave i.rm{background:linear-gradient(180deg,#ff6aa2,var(--pink));background-clip:content-box;opacity:1;box-shadow:0 0 7px rgba(255,61,129,.55)}
.rng-h{position:absolute;top:50%;width:22px;height:22px;border-radius:50%;background:#fff;transform:translate(-50%,-50%);cursor:grab;box-shadow:0 4px 14px rgba(0,0,0,.45);touch-action:none;z-index:3}
.rng-h::before{content:"";position:absolute;left:50%;top:-26px;width:2px;height:calc(72px/2 + 4px);background:rgba(255,255,255,.35);transform:translateX(-50%)}
.rng-h::after{content:"";position:absolute;inset:5px;border-radius:50%;background:currentColor;opacity:.9}
.rng-h:active{cursor:grabbing;transform:translate(-50%,-50%) scale(1.12)}
.rng-h-a{border:3px solid var(--cyan);color:var(--cyan)}
.rng-h-b{border:3px solid var(--pink);color:var(--pink)}
/* removed-part preview (listen + text) */
.cut-preview{margin-top:14px;padding-top:14px;border-top:1px dashed var(--line)}
.cut-listen{display:inline-flex;align-items:center;gap:9px;background:rgba(255,61,129,.08);border:1px solid rgba(255,61,129,.5);color:#fff;border-radius:100px;padding:10px 18px;font-family:"Archivo",sans-serif;font-weight:700;font-size:.82rem;cursor:pointer;transition:.2s}
.cut-listen:hover{background:rgba(255,61,129,.16);box-shadow:0 0 22px rgba(255,61,129,.25)}
.cut-listen.on{background:rgba(255,61,129,.22)}
.cut-listen .cl-ico{font-size:.72rem}
.cut-text{margin-top:12px;color:var(--faint);font-family:"Spectral",serif;font-size:.92rem;line-height:1.7;font-style:italic;max-height:170px;overflow:auto;user-select:none;-webkit-user-select:none;touch-action:none}
.cut-text .tok{cursor:ew-resize;border-radius:4px;padding:0 1px;transition:color .1s,background .1s}
.cut-text .tok:hover{background:rgba(255,255,255,.1);color:#fff}
.cut-text .tok.rmw{color:#ff86ac;background:rgba(255,61,129,.12);font-style:normal}
.cut-text .tok.rmw:hover{background:rgba(255,61,129,.24)}
/* word context strip above the zoomed timeline: shows exactly which gap between two words the handle lands in */
.cutwords{display:flex;align-items:baseline;gap:10px;min-height:30px;margin-top:10px;padding:0 2px}
.cutwords.hidden{display:none}
.cw-lab{flex:none;font-family:"Space Mono",monospace;font-size:.58rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase}
.cw-lab.a{color:#3ef0e2;text-shadow:0 0 10px rgba(18,214,200,.5)}
.cw-lab.b{color:#ff6da2;text-shadow:0 0 10px rgba(255,61,129,.5)}
.cw-txt{flex:1;min-width:0;font-family:"Spectral",serif;font-size:.9rem;font-style:italic;color:#e8e8ee;line-height:1.6;white-space:nowrap;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,#000 88%,transparent);mask-image:linear-gradient(90deg,#000 88%,transparent)}
.cw-caret{display:inline-block;width:2px;height:17px;margin:0 3px;vertical-align:-3px;background:var(--amber);border-radius:1px;box-shadow:0 0 7px rgba(224,169,78,.7);animation:cwblink 1.15s steps(2,start) infinite;color:transparent;overflow:hidden}
@keyframes cwblink{50%{opacity:.28}}
.cw-cut{color:#ff86ac;opacity:.5}
.cw-split{border-bottom:1px dashed var(--amber);font-style:normal}

/* ---------- full-screen assembly ---------- */
.asm-screen{position:fixed;inset:0;z-index:200;display:flex;align-items:center;justify-content:center;padding:24px;text-align:center;
  background:radial-gradient(50vw 50vw at 25% 20%,rgba(122,43,255,.5),transparent 60%),radial-gradient(46vw 46vw at 80% 80%,rgba(255,61,129,.42),transparent 60%),#06040d;animation:asmfade .5s ease both}
@keyframes asmfade{from{opacity:0}to{opacity:1}}
.asm-glow{position:absolute;inset:0;pointer-events:none;background:conic-gradient(from 0deg at 50% 50%,transparent,rgba(18,214,200,.14),transparent 30%,rgba(122,43,255,.14),transparent 60%,rgba(255,61,129,.12),transparent);animation:beamspin 30s linear infinite}
.asm-inner{position:relative;z-index:1;max-width:820px;width:100%}
.asm-title{font-family:"Archivo",sans-serif;font-weight:900;font-size:clamp(1.8rem,6vw,3.4rem);letter-spacing:-.03em;margin:14px 0 34px;line-height:1}
.asm-title .g{background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.asm{position:relative;display:flex;gap:12px;align-items:stretch;height:clamp(120px,26vh,190px)}
.asm-seg{flex:1;position:relative;display:flex;flex-direction:column;justify-content:flex-end;gap:10px;padding:16px;border-radius:18px;border:1px solid var(--line);background:rgba(255,255,255,.03);overflow:hidden;
  opacity:0;transform:translateY(24px) scale(.96);animation:asmseg .7s cubic-bezier(.2,.8,.2,1) forwards}
.asm-seg.s-mid{flex:1.8;animation-delay:.12s}
.asm-seg.s-outro{animation-delay:.24s}
@keyframes asmseg{to{opacity:1;transform:none}}
.asm-seg::before{content:"";position:absolute;inset:0;opacity:.14}
.s-intro::before{background:var(--cyan)}.s-mid::before{background:var(--violet)}.s-outro::before{background:var(--pink)}
.asm-lab{position:relative;z-index:1;font-family:"Space Mono",monospace;font-size:.62rem;letter-spacing:.16em;text-transform:uppercase;color:#fff}
.asm-wave{position:relative;z-index:1;display:flex;align-items:flex-end;gap:3px;height:100%}
.asm-wave i{flex:1;max-width:8px;border-radius:3px;height:var(--h,40%);transform-origin:bottom;animation:bounce .8s ease-in-out infinite;animation-delay:var(--d,0s)}
.s-intro .asm-wave i{background:var(--cyan);box-shadow:0 0 8px rgba(18,214,200,.5)}
.s-mid .asm-wave i{background:var(--violet);box-shadow:0 0 8px rgba(122,43,255,.5)}
.s-outro .asm-wave i{background:var(--pink);box-shadow:0 0 8px rgba(255,61,129,.5)}
.asm-head{position:absolute;top:-8px;bottom:-8px;width:3px;left:0;border-radius:3px;background:#fff;box-shadow:0 0 22px 4px rgba(255,255,255,.75),0 0 44px rgba(18,214,200,.8);animation:asmhead 3.2s cubic-bezier(.5,0,.5,1) infinite}
@keyframes asmhead{0%{left:0}100%{left:100%}}
.asm-status{margin-top:30px;font-family:"Space Mono",monospace;font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);display:flex;align-items:center;justify-content:center;gap:6px}
.asm-status span{width:7px;height:7px;border-radius:50%;background:var(--cyan);animation:dot 1.2s ease-in-out infinite}
.asm-status span:nth-child(2){animation-delay:.2s;background:var(--violet)}
.asm-status span:nth-child(3){animation-delay:.4s;background:var(--pink);margin-right:6px}
@keyframes dot{0%,100%{opacity:.3;transform:scale(.8)}50%{opacity:1;transform:scale(1.2)}}

/* ---------- full-screen production (video | shorts) ---------- */
.prod-screen{position:fixed;inset:0;z-index:200;display:flex;align-items:center;justify-content:center;padding:24px;overflow:auto;
  background:radial-gradient(50vw 50vw at 22% 18%,rgba(122,43,255,.5),transparent 60%),radial-gradient(46vw 46vw at 82% 82%,rgba(255,61,129,.42),transparent 60%),#06040d;animation:asmfade .5s ease both}
.ps-inner{position:relative;z-index:1;max-width:1080px;width:100%;text-align:center}
.ps-cols{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:12px;text-align:left}
.ps-col{background:linear-gradient(180deg,var(--glass2),var(--glass));border:1px solid var(--line);border-radius:22px;padding:22px 22px 20px;
  opacity:0;transform:translateY(20px) scale(.97);animation:asmseg .6s cubic-bezier(.2,.8,.2,1) forwards}
.ps-col:nth-child(2){animation-delay:.1s}
.ps-col-h{font-family:"Archivo",sans-serif;font-weight:800;font-size:1.15rem;letter-spacing:-.01em;margin-bottom:16px}
.ps-steps{display:flex;flex-direction:column;gap:11px;margin-bottom:16px}
.ps-step{display:flex;align-items:center;gap:11px;font-size:.95rem;color:var(--faint);transition:.3s}
.ps-step .ps-dot{width:22px;text-align:center;font-size:.9rem;flex:none}
.ps-step b{font-family:"Space Mono",monospace;font-size:.78rem;color:var(--cyan);margin-left:4px}
.ps-step.done{color:var(--ink)}.ps-step.done .ps-dot{color:#26e0a0;text-shadow:0 0 10px rgba(38,224,160,.6)}
.ps-step.now,.ps-step.running{color:#fff;font-weight:600}.ps-step.now .ps-dot,.ps-step.running .ps-dot{color:var(--cyan);animation:psblink 1.1s ease-in-out infinite}
.ps-step.err{color:var(--pink)}.ps-step.err .ps-dot{color:var(--pink)}
@keyframes psblink{0%,100%{opacity:.35;transform:scale(.85)}50%{opacity:1;transform:scale(1.15)}}
.ps-bar{height:8px;border-radius:100px;background:rgba(255,255,255,.09);overflow:hidden}
.ps-bar i{display:block;height:100%;width:3%;border-radius:100px;background:var(--grad);background-size:200% auto;animation:sheen 1.4s linear infinite;transition:width .5s cubic-bezier(.3,.8,.3,1)}
.ps-bar.err i{background:var(--pink);animation:none}
.ps-time{margin-top:9px;font-family:"Space Mono",monospace;font-size:.72rem;letter-spacing:.05em;color:var(--cyan);min-height:1em}
.ps-sub{margin-top:6px;font-family:"Space Mono",monospace;font-size:.72rem;letter-spacing:.04em;color:var(--muted);min-height:1em}
.ps-preview{margin-top:14px;display:flex;flex-direction:column;gap:9px;align-items:flex-start}
.ps-preview:empty{display:none}
.ps-vid{max-width:100%;border-radius:12px;border:1px solid var(--line);background:#000}
.ps-cells{display:grid;grid-template-columns:1fr 1fr;gap:10px;width:100%}
.ps-cell{margin:0;display:flex;flex-direction:column;gap:5px}
.ps-cell figcaption{font-family:"Space Mono",monospace;font-size:.62rem;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.ps-cell .ps-vid{width:100%}
.ps-vid.vert{width:100%;max-width:none;aspect-ratio:9/16;object-fit:cover}
.ps-shorts{display:grid;grid-template-columns:repeat(auto-fill,148px);justify-content:center;gap:10px;width:100%;max-height:420px;overflow-y:auto;padding-right:4px}
.ps-vid-pending{aspect-ratio:9/16;border-radius:12px;border:1px dashed var(--line);background:linear-gradient(120deg,rgba(255,255,255,.03),rgba(255,255,255,.07),rgba(255,255,255,.03));background-size:200% 100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:9px;animation:psPendingShimmer 1.6s linear infinite}
.ps-pending-dot{width:8px;height:8px;border-radius:50%;background:var(--pink);box-shadow:0 0 0 0 rgba(255,61,129,.6);animation:psPendingPulse 1.2s ease-out infinite}
.epm-eta{font-family:"Space Mono",monospace;font-size:.62rem;letter-spacing:.05em;color:var(--muted)}
.epm-short-pending .epm-title{color:var(--muted)}
/* pending short: a single pink beacon pulsing dead-center, with the user's prompt sitting under it. The card
   is the "nothing yet" state, so it stays quiet — one moving element, no competing text. */
/* max-height mirrors `.epm-short video.epm-media.vert` below: that rule only matches <video>, so without this
   the placeholder <div> ran the full 9:16 height and towered over the real cards next to it */
/* display:flex is restated because `.epm-media{display:block}` is declared later in this file at the same
   specificity and was overriding the flex centering, leaving the beacon stranded in the top-left corner.
   max-height mirrors `.epm-short video.epm-media.vert`: that rule only matches <video>, so without it the
   placeholder <div> ran the full 9:16 height and towered over the real cards beside it. */
.epm-short-pending .ps-vid-pending{display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative;gap:14px;padding:16px;height:340px;max-height:340px;aspect-ratio:auto}
.ps-beacon{position:relative;width:10px;height:10px;border-radius:50%;background:var(--pink);flex:none;box-shadow:0 0 14px 2px rgba(255,61,129,.55);animation:beaconCore 1.8s ease-in-out infinite}
/* two rings, offset half a cycle, so a wave is always expanding outward */
.ps-beacon::before,.ps-beacon::after{content:"";position:absolute;inset:0;border-radius:50%;border:1px solid rgba(255,61,129,.5);animation:beaconRing 1.8s ease-out infinite}
.ps-beacon::after{animation-delay:.9s}
@keyframes beaconCore{0%,100%{transform:scale(1);opacity:1}50%{transform:scale(.8);opacity:.75}}
@keyframes beaconRing{0%{transform:scale(1);opacity:.7}100%{transform:scale(3.6);opacity:0}}
.epm-short-guide{font-size:11.5px;line-height:1.4;color:var(--muted);font-style:italic;text-align:center;max-width:92%;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
@keyframes psPendingShimmer{0%{background-position:0% 0}100%{background-position:200% 0}}
@keyframes psPendingPulse{0%{box-shadow:0 0 0 0 rgba(255,61,129,.55)}70%{box-shadow:0 0 0 9px rgba(255,61,129,0)}100%{box-shadow:0 0 0 0 rgba(255,61,129,0)}}
.ps-chip{font-family:"Space Mono",monospace;font-size:.68rem;letter-spacing:.06em;color:var(--cyan);border:1px solid rgba(18,214,200,.4);background:rgba(18,214,200,.08);border-radius:100px;padding:5px 11px}
.ps-close{margin-top:28px;background:var(--grad);color:#07040f;border:none;border-radius:100px;padding:14px 30px;font-family:"Archivo",sans-serif;font-weight:800;font-size:1rem;cursor:pointer;box-shadow:0 10px 30px rgba(122,43,255,.4);transition:.2s;animation:asmseg .5s ease both}
.ps-close:hover{transform:translateY(-2px);box-shadow:0 14px 38px rgba(122,43,255,.55)}
/* arrêt d'urgence : discret et fantomatique, il ne doit pas rivaliser avec le bouton principal ni
   inviter au clic. Il ne prend sa couleur d'alerte qu'au survol, une fois l'intention formée. */
.ps-stop{margin-top:22px;background:transparent;border:1px solid rgba(255,61,129,.32);color:rgba(255,61,129,.85);
  border-radius:100px;padding:10px 22px;font-family:"Space Mono",monospace;font-size:.72rem;letter-spacing:.08em;
  cursor:pointer;transition:.2s}
.ps-stop:hover{background:rgba(255,61,129,.12);border-color:rgba(255,61,129,.6);color:#ff3d81}
.ps-stop:disabled{opacity:.45;cursor:default;background:transparent}
.ps-stop.hidden{display:none}
.ps-stop-note{margin-top:10px;font-family:"Space Mono",monospace;font-size:.66rem;letter-spacing:.05em;color:var(--amber)}
.ps-stop-note.hidden{display:none}
/* relance : ambre plutôt que rouge, c'est une réparation et non une destruction */
.ps-retry{margin-top:22px;margin-right:12px;background:rgba(224,169,78,.1);border:1px solid rgba(224,169,78,.45);color:var(--amber);
  border-radius:100px;padding:12px 26px;font-family:"Archivo",sans-serif;font-weight:700;font-size:.86rem;cursor:pointer;transition:.2s}
.ps-retry:hover{background:rgba(224,169,78,.2);transform:translateY(-2px)}
.ps-retry:disabled{opacity:.45;cursor:default;transform:none}
.ps-retry.hidden{display:none}
.ps-chip.warn{color:var(--amber);border-color:rgba(224,169,78,.42);background:rgba(224,169,78,.09)}

/* --- aperçu vidéo : rendu natif, puis upscale, puis l'épisode entier --- */
/* l'ordre suit la fabrication. Le 720p sort d'InfiniteTalk, le 1080p de l'upscaler, l'épisode du
   montage : montrer la vidéo finie en premier, en demi-colonne, racontait l'histoire à l'envers. */
.ps-rowlab{margin-top:6px;font-family:"Space Mono",monospace;font-size:.58rem;letter-spacing:.16em;text-transform:uppercase;color:var(--faint)}
.ps-rowlab:first-child{margin-top:0}
/* badge sur sa propre ligne, toujours : côte à côte, « Conclusion (avatar) » passait à la ligne et
   « Intro (avatar) » non, ce qui décalait les deux vidéos d'une hauteur de ligne */
.ps-cell figcaption{display:flex;flex-direction:column;align-items:flex-start;gap:5px}
.ps-cell figcaption .ps-badge{align-self:flex-start}
.ps-badge{font-family:"Space Mono",monospace;font-size:.55rem;letter-spacing:.09em;text-transform:uppercase;border-radius:100px;padding:3px 8px;border:1px solid currentColor;opacity:.9}
.ps-badge.amber{color:var(--amber)}
.ps-badge.cyan{color:var(--cyan)}
/* la pièce maîtresse : plus une vignette parmi d'autres, elle prend la colonne entière */
.ps-cell-full{width:100%}
.ps-vid-full{width:100%;aspect-ratio:16/9;object-fit:contain;box-shadow:0 20px 60px rgba(0,0,0,.55)}

/* --- état terminé : plus rien ne bouge --- */
/* tant que la barre balayait à 100%, l'écran continuait d'annoncer un chantier fini depuis dix minutes */
.ps-col.done .ps-bar{display:none}
.ps-col.done{border-color:rgba(38,224,160,.45);box-shadow:0 0 0 1px rgba(38,224,160,.18),0 24px 60px rgba(38,224,160,.10)}
.ps-col.done .ps-sub{display:none}
.ps-col.done .ps-time{color:#26e0a0}
.ps-done{display:inline-flex;align-items:center;gap:9px;font-family:"Space Mono",monospace;font-size:.72rem;letter-spacing:.05em;color:#26e0a0;
  animation:psDoneIn .5s cubic-bezier(.2,1.4,.4,1) both}
.ps-check{position:relative;width:20px;height:20px;flex:none;border-radius:50%;background:#26e0a0;box-shadow:0 0 16px rgba(38,224,160,.5)}
.ps-check::before{content:"";position:absolute;left:6px;top:3px;width:5px;height:10px;border:solid #07040f;border-width:0 2px 2px 0;transform:rotate(42deg)}
/* un seul anneau, une seule fois : une pulsation en boucle relancerait l'idée d'attente */
.ps-check::after{content:"";position:absolute;inset:-3px;border-radius:50%;border:1px solid rgba(38,224,160,.6);animation:psDoneRing .9s .15s ease-out both}
@keyframes psDoneIn{from{opacity:0;transform:scale(.6)}to{opacity:1;transform:none}}
@keyframes psDoneRing{from{transform:scale(1);opacity:.8}to{transform:scale(2.4);opacity:0}}
.ps-col.done .ps-step.done .ps-dot{animation:psDoneIn .4s cubic-bezier(.2,1.4,.4,1) both}
.ps-col.done .ps-step:nth-child(2) .ps-dot{animation-delay:.06s}
.ps-col.done .ps-step:nth-child(3) .ps-dot{animation-delay:.12s}
.ps-col.done .ps-step:nth-child(4) .ps-dot{animation-delay:.18s}
.ps-col.done .ps-step:nth-child(5) .ps-dot{animation-delay:.24s}
/* le fond entier se pose : le violet bascule au vert et la rotation passe de 30 s à 90 s */
.prod-screen.finished{background:radial-gradient(50vw 50vw at 22% 18%,rgba(38,224,160,.34),transparent 60%),radial-gradient(46vw 46vw at 82% 82%,rgba(18,214,200,.26),transparent 60%),#06040d;transition:background 1.2s ease}
.prod-screen.finished .asm-glow{animation-duration:90s;opacity:.5}
.prod-screen.finished .ps-close{animation-delay:.4s}
.prod-screen.halted .ps-col.failed{border-color:rgba(255,61,129,.45)}
@media(max-width:760px){.ps-cols{grid-template-columns:1fr}}

/* ---------- form wizard ---------- */
.wstep{display:none}
.wstep.on{display:block;animation:wstepin .45s cubic-bezier(.2,.7,.2,1) both}
@keyframes wstepin{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
.wq{font-family:"Archivo",sans-serif;font-weight:800;font-size:clamp(1.3rem,3.6vw,1.8rem);letter-spacing:-.01em;margin-bottom:4px}
.wqs{color:var(--muted);font-size:.92rem;margin-bottom:20px}
.opt-badge{font-family:"Space Mono",monospace;font-size:.58rem;letter-spacing:.14em;text-transform:uppercase;color:var(--cyan);border:1px solid rgba(18,214,200,.45);background:rgba(18,214,200,.1);border-radius:100px;padding:5px 12px;vertical-align:middle;margin-left:10px;white-space:nowrap}
.wnav{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-top:26px}
.wdots{display:flex;gap:7px;flex:1;justify-content:center}
.wdots i{width:8px;height:8px;border-radius:50%;background:rgba(255,255,255,.16);transition:.3s}
.wdots i.on{background:var(--grad);box-shadow:0 0 12px rgba(18,214,200,.5);transform:scale(1.2)}
.go.mini{width:auto;margin-top:0;padding:13px 24px;font-size:.95rem;flex:none;animation:none}
.go.mini::after{display:none}
.go.mini[disabled]{opacity:.6}
.wbtn.back{background:transparent;border:1px solid var(--line);color:var(--muted);border-radius:100px;padding:12px 20px;font-family:"Archivo",sans-serif;font-weight:700;cursor:pointer;flex:none;transition:.2s}
.wbtn.back:hover{color:#fff;background:rgba(255,255,255,.05)}
@media(max-width:520px){.wnav{flex-wrap:wrap}.wdots{order:-1;width:100%;margin-bottom:6px}}

/* source preview */
.srcprev{margin-bottom:18px}
.srcprev:empty{display:none}
.srcprev-load{display:flex;flex-direction:column;align-items:center;gap:12px;padding:24px;color:var(--muted);font-family:"Space Mono",monospace;font-size:.8rem;border:1px solid var(--line);border-radius:16px;background:rgba(255,255,255,.03)}
.srcprev-ok{padding:16px;text-align:center;color:var(--cyan);border:1px solid rgba(18,214,200,.4);border-radius:16px;background:rgba(18,214,200,.06);font-family:"Space Mono",monospace;font-size:.85rem}
.srcprev .scanner{margin:0}
.srcprev .orbit{width:64px;height:64px;margin:0}
.srcprev .orbit-core{inset:24px}

/* icon cycler */
.cycler{position:relative;height:40px;margin:-4px 0 8px}
.cycler span{position:absolute;left:0;right:0;text-align:center;font-size:1.7rem;opacity:0;animation:cyc 7.5s infinite}
.cycler span:nth-child(1){animation-delay:0s}
.cycler span:nth-child(2){animation-delay:1.5s}
.cycler span:nth-child(3){animation-delay:3s}
.cycler span:nth-child(4){animation-delay:4.5s}
.cycler span:nth-child(5){animation-delay:6s}
@keyframes cyc{0%{opacity:0;transform:translateY(8px) scale(.7)}4%,13%{opacity:1;transform:none}20%,100%{opacity:0;transform:translateY(-6px) scale(.9)}}

/* live reveal during processing */
.live{margin-top:20px;display:flex;flex-direction:column;gap:16px}
.live-lab{font-family:"Space Mono",monospace;font-size:.62rem;letter-spacing:.16em;text-transform:uppercase;color:var(--cyan);margin-bottom:8px}
.live-block,.live-grp{animation:wstepin .4s ease both}
.live-text{font-family:"Spectral",serif;color:var(--muted);font-size:.9rem;line-height:1.6;max-height:130px;overflow:hidden;
  -webkit-mask:linear-gradient(#000 62%,transparent);mask:linear-gradient(#000 62%,transparent)}
/* minmax(0,1fr) et pas 1fr : dès qu'une carte reçoit son lecteur audio, sa largeur minimale
   intrinsèque dépasse la part de grille et écrase les colonnes voisines. La carte encore en
   génération se retrouvait en bande étroite pendant que les deux autres s'élargissaient. */
.live-cols{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;align-items:stretch}
@media(max-width:760px){.live-cols{grid-template-columns:1fr}}
.live-card{display:flex;flex-direction:column;min-width:0;border:1px solid var(--line);border-radius:14px;padding:12px 14px;background:rgba(255,255,255,.03);transition:border-color .25s,box-shadow .25s}
/* hauteur réservée d'avance : la machine à écrire remplit un bloc déjà dimensionné au lieu de
   pousser la carte ligne après ligne. Le statut et le lecteur restent collés en bas. */
.live-card .lc-txt{font-family:"Spectral",serif;font-size:.85rem;line-height:1.55;color:#fff;min-height:168px;overflow-wrap:anywhere}
.live-card .lc-status{margin-top:10px;font-family:"Space Mono",monospace;font-size:.58rem;letter-spacing:.1em;text-transform:uppercase;color:var(--faint)}
.live-card .player{min-width:0;margin-top:10px;padding:8px 10px;gap:9px}
.live-card.ready{border-color:rgba(18,214,200,.4);box-shadow:0 0 20px rgba(18,214,200,.1)}
.live-card.ready .lc-status{color:var(--cyan)}
.caret{color:var(--cyan);font-weight:700;animation:blink 1s steps(1) infinite}

@media(prefers-reduced-motion:reduce){
  .aurora,.beams,.grid,.orbs span,.scan,.eq i,.go,.go::after,.bar i,.bar i::after,.orbit span,.orbit-core,.rec,.ep-burst,.glow::before{animation:none!important}
  .reveal,.hero{animation:none!important}
  /* l'écran de production oubliait tout ce bloc : barre, squelettes, balise, tuiles photo, pastille de fin */
  .ps-bar i,.ps-vid-pending,.ps-pending-dot,.ps-beacon,.ps-beacon::before,.ps-beacon::after,
  .ps-step.running .ps-dot,.ps-step.now .ps-dot,.hs-tile.pending,
  .ps-done,.ps-check::after,.ps-col.done .ps-step.done .ps-dot{animation:none!important}
}

/* history widget */
.hist-head{display:flex;align-items:center;justify-content:space-between;gap:12px}
.hist-refresh{background:none;border:1px solid rgba(255,255,255,.14);color:#999;border-radius:10px;width:34px;height:34px;cursor:pointer;font-size:15px;transition:.15s}
.hist-refresh:hover{color:#fff;border-color:rgba(255,87,131,.5)}
.hist-list{display:flex;flex-direction:column;gap:10px;margin-top:14px;max-height:360px;overflow-y:auto}
.hist-item{position:relative;display:flex;align-items:center;gap:14px;padding:10px 12px 16px;border:1px solid rgba(255,255,255,.08);border-radius:14px;background:rgba(255,255,255,.02);transition:.15s;cursor:pointer}
.hist-item:hover{border-color:rgba(255,87,131,.35);background:rgba(255,255,255,.04)}
.hist-thumb{width:64px;height:40px;border-radius:8px;object-fit:cover;flex:0 0 auto;background:#1a1a22}
.hist-thumb.ph{background:linear-gradient(135deg,#20202b,#15151d)}
.hist-meta{flex:1;min-width:0}
.hist-name{font-weight:600;color:#f4f4f6;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hist-sub{font-size:12px;color:#8a8a99;margin-top:3px;display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.hb{font-size:10px;text-transform:uppercase;letter-spacing:.08em;padding:2px 7px;border-radius:999px;background:#20202a;color:#9a9aa8}
.hb.ok{background:rgba(61,220,151,.14);color:#3ddc97}
.hist-acts{display:flex;align-items:center;gap:8px;flex:0 0 auto;flex-wrap:wrap;justify-content:flex-end}
.hist-open{background:linear-gradient(90deg,#ff5783,#8a5cff);border:none;color:#fff;font-weight:600;padding:8px 14px;border-radius:10px;cursor:pointer;font-size:13px;transition:.15s}
.hist-open:hover{filter:brightness(1.08)}
.hist-dl{color:#ff5783;text-decoration:none;font-size:13px;padding:8px 10px;border:1px solid rgba(255,87,131,.3);border-radius:10px;white-space:nowrap}
.hist-dl:hover{background:rgba(255,87,131,.1)}
.hist-wrap{display:flex;flex-direction:column}
.ha{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.12);color:#e8e8ee;font-weight:600;padding:8px 12px;border-radius:10px;cursor:pointer;font-size:13px;transition:.15s;white-space:nowrap}
.ha:hover{border-color:rgba(255,87,131,.5);background:rgba(255,87,131,.08)}
.ha.edit{background:linear-gradient(90deg,#ff5783,#8a5cff);border:none;color:#fff}
.ha.edit:hover{filter:brightness(1.08)}
.ha.main{padding:11px 18px;font-size:14px;border-radius:12px 0 0 12px;border-right:none}
.ha-split{display:inline-flex;align-items:stretch}
.ha-split:hover .ha.main{border-color:rgba(255,87,131,.5);background:rgba(255,87,131,.08)}
.ha-in-dl{display:inline-flex;align-items:center;padding:0 12px;color:#ff5783;text-decoration:none;font-weight:800;font-size:15px;border:1px solid rgba(255,255,255,.12);border-left:1px solid rgba(255,255,255,.08);border-radius:0 12px 12px 0;background:rgba(255,255,255,.05)}
.ha-in-dl:hover{background:rgba(255,87,131,.16);border-color:rgba(255,87,131,.5)}
.ha.ic{padding:10px 12px;font-size:15px;line-height:1}
.ha.ic.edit{background:linear-gradient(90deg,#ff5783,#8a5cff);border:none;color:#fff}
/* archive sits in the card's bottom-right corner, small and quiet: it's a rare, destructive-looking action */
.ha.ic.trash{position:absolute;right:8px;bottom:4px;padding:2px 5px;font-size:11px;border-radius:7px;color:#8a8a97;background:none;border:1px solid transparent;opacity:.5}
.hist-item:hover .ha.ic.trash{opacity:1}
.ha.ic.trash:hover{border-color:rgba(255,80,80,.5);background:rgba(255,80,80,.12);color:#ff7a7a}
.hist-media{width:100%;border-radius:12px;background:#000}
/* episode page (opened from history) */
.ep-back{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.14);color:#e8e8ee;font-weight:600;padding:9px 14px;border-radius:10px;cursor:pointer;font-size:13px;margin-bottom:16px;transition:.15s}
.ep-back:hover{border-color:rgba(255,87,131,.5);background:rgba(255,87,131,.08)}
.ep-media{margin-bottom:22px}
.epm-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:16px}
.epm-card{background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.08);border-radius:16px;padding:14px;display:flex;flex-direction:column;gap:10px}
.epm-title{font-weight:700;font-size:14px;color:#f4f4f6}
.epm-media{width:100%;border-radius:12px;background:#000;display:block}
audio.epm-media{height:44px}
video.epm-media{max-height:340px;object-fit:contain}
video.epm-media.vert{max-height:520px}
/* sectioned results page: Audio · Vidéo · Shorts */
.epm-sec{margin-bottom:30px}
.epm-sec-h{display:flex;align-items:center;gap:11px;margin:0 0 15px;padding-bottom:11px;border-bottom:1px solid rgba(255,255,255,.07)}
.epm-sec-h h3{font-family:"Archivo",sans-serif;font-weight:800;font-size:1.02rem;color:#f6f6fa;margin:0}
.epm-sec-h .epm-dot{width:9px;height:9px;border-radius:50%;flex:none}
.epm-sec-h .epm-sec-sub{margin-left:auto;font-family:"Space Mono",monospace;font-size:.62rem;letter-spacing:.07em;text-transform:uppercase;color:var(--muted)}
.epm-dot.dot-audio{background:var(--cyan);box-shadow:0 0 10px rgba(18,214,200,.6)}
.epm-dot.dot-video{background:var(--violet);box-shadow:0 0 10px rgba(122,43,255,.6)}
.epm-dot.dot-short{background:var(--pink);box-shadow:0 0 10px rgba(255,61,129,.6)}
.epm-vgrid{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:16px}
.epm-sgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:14px}
.epm-sub-lbl{font-family:"Space Mono",monospace;font-size:.62rem;letter-spacing:.09em;text-transform:uppercase;color:var(--muted);margin:4px 0 11px}
.epm-audio{gap:6px}
.epm-full{margin-bottom:4px}
video.epm-media.epm-wide{max-height:460px}
.epm-short video.epm-media.vert{max-height:340px}
@media(max-width:620px){.epm-vgrid{grid-template-columns:1fr}}
/* short card meta: durée + hook + raison du choix */
.epm-short .epm-title{display:flex;align-items:center;gap:8px;justify-content:space-between}
.epm-dur{font-family:"Space Mono",monospace;font-size:.58rem;letter-spacing:.04em;color:var(--muted);background:rgba(255,255,255,.05);border:1px solid var(--line);border-radius:100px;padding:2px 8px;white-space:nowrap;flex:none}
.epm-short .epm-hook{font-size:12.5px;line-height:1.35;color:#e8e8ee;font-style:italic}
.epm-short .epm-why{font-size:11.5px;line-height:1.4;color:var(--muted);display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
/* atelier "générer plus de shorts" */
.epm-more{margin-top:18px;padding:16px;border:1px dashed rgba(255,61,129,.35);border-radius:16px;background:rgba(255,61,129,.05);display:flex;flex-direction:column;gap:10px}
.epm-more-lbl{font-family:"Space Mono",monospace;font-size:.62rem;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.epm-more textarea{width:100%;resize:vertical;min-height:44px;background:rgba(0,0,0,.28);border:1px solid var(--line);border-radius:10px;color:#f4f4f6;font:inherit;font-size:13px;line-height:1.4;padding:10px 12px}
.epm-more textarea:focus{outline:none;border-color:rgba(255,61,129,.55)}
.epm-more-row{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.epm-more-n{font-size:12.5px;color:var(--muted);display:flex;align-items:center;gap:8px}
.epm-more-n input{width:64px;background:rgba(0,0,0,.28);border:1px solid var(--line);border-radius:8px;color:#f4f4f6;font:inherit;padding:7px 9px;text-align:center}
.go.sm{width:auto;margin-top:0;padding:12px 22px;font-size:.95rem;flex:none;animation:none}
.go.sm::after{display:none}
.go.sm[disabled]{opacity:.6}
.epm-dl{align-self:flex-start}
/* subtitle editor: correct burned-in caption text, re-burn without re-transcribing */
.epm-subedit-wrap{margin-top:8px}
.epm-subbtn,.epm-cutbtn{background:transparent;border:1px solid var(--line);color:var(--muted);border-radius:100px;padding:7px 13px;font-family:"Archivo",sans-serif;font-weight:700;font-size:.72rem;cursor:pointer;transition:.15s}
.epm-subbtn:hover{border-color:rgba(122,43,255,.5);color:#e8e8ee;background:rgba(122,43,255,.08)}
.epm-cutbtn:hover{border-color:rgba(224,169,78,.5);color:#e8e8ee;background:rgba(224,169,78,.08)}
.epm-subedit{margin-top:12px;padding:16px;border:1px dashed rgba(122,43,255,.35);border-radius:16px;background:rgba(122,43,255,.05);display:flex;flex-direction:column;gap:8px}
.epm-subedit.cutedit{border-color:rgba(224,169,78,.35);background:rgba(224,169,78,.05)}
.subedit-seg-label{font-family:"Space Mono",monospace;font-size:.6rem;letter-spacing:.08em;text-transform:uppercase;color:var(--violet);margin-top:6px}
.subedit-seg-label:first-child{margin-top:0}
.subedit-ta{width:100%;resize:vertical;background:rgba(0,0,0,.28);border:1px solid var(--line);border-radius:10px;color:#f4f4f6;font-family:"Spectral",serif;font-size:13px;line-height:1.5;padding:10px 12px}
.cutedit-read{font-family:"Space Mono",monospace;font-size:.78rem;color:#fff}
.subedit-ta:focus{outline:none;border-color:rgba(122,43,255,.55)}
.subedit-status,.cutedit-status{font-size:12.5px;color:var(--muted)}
.subedit-ta.bad{border-color:rgba(255,87,131,.75);background:rgba(255,87,131,.08)}
.subedit-hint{font-size:12px;color:var(--muted);margin:0}
.subedit-hint.warn{color:#ff8fae}
/* generation time + API cost, under the player. Deliberately quiet: it's a diagnostic, not a headline. */
.epm-meter{font-size:11px;letter-spacing:.02em;color:var(--muted);opacity:.75;font-variant-numeric:tabular-nums}
.epm-card:hover .epm-meter{opacity:1}
/* actions row on a media card: download pill + square Drive button (external-link arrow) */
.epm-acts{display:flex;align-items:stretch;gap:8px}
.epm-acts .epm-dl{align-self:auto}
.epm-drive{display:inline-flex;align-items:center;justify-content:center;width:36px;min-height:35px;color:#ff5783;text-decoration:none;border:1px solid rgba(255,87,131,.3);border-radius:10px;transition:.15s}
.epm-drive:hover{background:rgba(255,87,131,.1);border-color:rgba(255,87,131,.55)}
.epm-drive svg{width:15px;height:15px}
/* 🔗 copy the deep link to this media. Same square footprint as the Drive button, but quiet by
   default: it's a secondary action next to télécharger, it shouldn't compete for the eye. */
.epm-copy{display:inline-flex;align-items:center;justify-content:center;width:36px;min-height:35px;padding:0;font-size:13px;line-height:1;background:transparent;border:1px solid var(--line);border-radius:10px;color:var(--muted);cursor:pointer;opacity:.45;transition:.15s}
.epm-card:hover .epm-copy{opacity:.85}
.epm-copy:hover{opacity:1;border-color:rgba(255,255,255,.3);background:rgba(255,255,255,.05)}
.epm-copy.ok{opacity:1;color:#26e0a0;border-color:rgba(38,224,160,.5);background:rgba(38,224,160,.08)}
/* landing on a deep link: say which card you came for, then get out of the way */
.epm-hit{animation:epmHit 1.8s ease-out}
@keyframes epmHit{
  0%,55%{box-shadow:0 0 0 2px var(--cyan),0 0 26px rgba(18,214,200,.4)}
  100%{box-shadow:0 0 0 2px rgba(18,214,200,0),0 0 26px rgba(18,214,200,0)}
}
/* finished-episode card: big download button + square Drive button side by side */
.ep-dl-row{display:flex;gap:10px;align-items:stretch;margin-top:18px}
.ep-dl-row .go.dl{flex:1;margin-top:0}
.ep-dl-row .epm-drive{width:58px;border-radius:18px;border-color:rgba(255,255,255,.16);color:#26e0a0}
.ep-dl-row .epm-drive:hover{border-color:#26e0a0;background:rgba(38,224,160,.08)}
.ep-dl-row .epm-drive svg{width:20px;height:20px}
/* shorts gallery (produce panel) */
.shorts-gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:14px;margin-top:12px}
.short-card{background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.08);border-radius:14px;padding:10px;display:flex;flex-direction:column;gap:8px}
.short-vid{width:100%;aspect-ratio:9/16;border-radius:10px;background:#000;object-fit:cover}
.short-title{font-weight:600;font-size:13px;color:#f4f4f6;display:flex;align-items:center;gap:6px;justify-content:space-between}
.short-why{font-size:11.5px;color:#8a8a99;line-height:1.4}
.short-dl{padding:4px 8px;font-size:13px}
@media(max-width:640px){.hist-item{flex-wrap:wrap}.hist-acts{width:100%;justify-content:flex-start}}
/* ---- étape photo de plateau : trois propositions, une seule validée ---------
   L'avatar est animé à partir d'une seule image, donc ce choix décide de toute la
   moitié vidéo de l'épisode. Les tuiles sont larges volontairement : on doit pouvoir
   juger un visage, pas deviner une vignette. */
.host-shot{margin-top:18px;padding:18px;border:1px solid var(--line);border-radius:20px;background:rgba(255,255,255,.03);animation:rise .4s ease both}
.hs-h{font-weight:700;font-size:1rem;color:var(--ink);display:flex;flex-direction:column;gap:5px;margin-bottom:14px}
.hs-h small{font-weight:400;font-size:.8rem;color:var(--muted);line-height:1.45}
.hs-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.hs-tile{position:relative;padding:0;overflow:hidden;aspect-ratio:16/9;border:2px solid var(--line);border-radius:14px;background:rgba(0,0,0,.35);cursor:pointer;transition:.18s}
.hs-tile img{width:100%;height:100%;object-fit:cover;display:block}
.hs-tile:hover{border-color:rgba(255,255,255,.34);transform:translateY(-2px)}
.hs-tile.on{border-color:var(--cyan);box-shadow:0 0 0 3px rgba(18,214,200,.22),0 0 24px rgba(18,214,200,.28)}
/* squelette pendant la génération : ~20 s sans rien à montrer, l'attente doit rester vivante */
.hs-tile.pending{cursor:default;border-style:dashed;background:linear-gradient(100deg,rgba(255,255,255,.03) 30%,rgba(18,214,200,.10) 50%,rgba(255,255,255,.03) 70%);background-size:220% 100%;animation:hsWait 1.5s linear infinite}
@keyframes hsWait{to{background-position:-220% 0}}
.hs-err{font-size:.85rem;margin-top:10px}
/* consigne libre : quand les trois propositions tombent à côté, un tirage de plus ne suffit pas */
.hs-guide{display:flex;gap:10px;margin-top:14px;flex-wrap:wrap}
.hs-guide input{flex:1 1 260px;min-width:0;padding:11px 14px;border-radius:12px;border:1px solid var(--line);background:rgba(0,0,0,.28);color:var(--ink);font-family:"Spectral",Georgia,serif;font-size:.86rem}
.hs-guide input::placeholder{color:var(--faint)}
.hs-guide input:focus{outline:none;border-color:var(--cyan);box-shadow:0 0 0 3px rgba(18,214,200,.14)}
.hs-guide .ghost{flex:none;width:auto;margin-top:0;padding:11px 16px;font-size:.8rem;white-space:nowrap}
@media(max-width:640px){.hs-guide .ghost{flex:1 1 100%}}
.hs-acts{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-top:14px}
.hs-acts .go.hs-go{flex:1 1 100%;margin-top:0}
.hs-acts .ghost{flex:1 1 0;width:auto;min-width:0;margin-top:0}
.hs-acts .go.hs-go:disabled{opacity:.45;cursor:not-allowed}
@media(max-width:640px){.hs-grid{grid-template-columns:1fr}.hs-acts .go.hs-go{min-width:100%}}
/* aperçu au survol : les tuiles font ~200px de large, on ne juge pas un visage là-dedans.
   Au niveau du body, sinon le backdrop-filter de .card piège le position:fixed. */
.hs-zoom{position:fixed;inset:0;z-index:400;display:flex;align-items:center;justify-content:center;
  background:rgba(4,2,10,.72);backdrop-filter:blur(6px);pointer-events:none;animation:hsZoomIn .16s ease both}
.hs-zoom.hidden{display:none}
.hs-zoom img{max-width:min(62vw,760px);max-height:58vh;border-radius:16px;border:1px solid rgba(255,255,255,.18);box-shadow:0 30px 80px rgba(0,0,0,.6)}
@keyframes hsZoomIn{from{opacity:0;transform:scale(.985)}to{opacity:1;transform:none}}
/* photo de référence : d'où viennent les propositions, et où on la remplace */
.hs-base{display:flex;align-items:center;gap:13px;margin-top:16px;padding-top:15px;border-top:1px solid var(--line)}
.hs-base img{width:104px;aspect-ratio:16/9;object-fit:cover;border-radius:10px;border:1px solid var(--line);background:rgba(0,0,0,.35);cursor:zoom-in}
.hs-base-txt{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}
.hs-base-txt b{font-size:.86rem}
.hs-base-txt small{font-size:.76rem;color:var(--muted);line-height:1.4}
.hs-base-btn{flex:none;width:auto;margin-top:0;padding:9px 16px;font-size:.8rem;cursor:pointer}
@media(max-width:640px){.hs-base{flex-wrap:wrap}.hs-base-txt{flex-basis:100%;order:3}}
/* la même photo, atteinte depuis l'étape 3 du formulaire : pas de trait de séparation, elle vit
   déjà dans un .field qui a le sien */
.hs-base.wref{margin-top:0;padding-top:0;border-top:none}
.wref-msg{font-family:"Space Mono",monospace;font-size:.65rem;letter-spacing:.05em;color:var(--cyan);min-height:1em}
/* bibliothèque de décors : un plan large éloigne l'animatrice et masque le lipsync, un plan rapproché
   la montre. Le choix se fait par épisode, d'où une galerie et non un fichier unique.
   Même grammaire visuelle que .hs-tile : le cyan dit « sélectionné » partout dans cet écran. */
.setlib{margin-top:16px;padding-top:15px;border-top:1px solid var(--line)}
/* Sources remontées au-dessus des propositions : le trait de séparation appartient désormais au titre
   « Les propositions », pas aux blocs sources qui suivaient la grille. */
.hs-base.hs-src{margin-top:14px;padding-top:0;border-top:none}
.setlib.hs-src{margin-top:18px;padding-top:0;border-top:none}
.hs-sep{margin:20px 0 12px;padding-top:16px;border-top:1px solid var(--line);font-family:"Space Mono",monospace;font-size:.7rem;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
/* amorce : occupe la place de la grille tant qu'aucun tirage n'a eu lieu */
.hs-start{display:flex;flex-direction:column;align-items:center;gap:9px;padding:26px 18px;border:1px dashed var(--line);border-radius:14px;background:rgba(0,0,0,.18);text-align:center}
.hs-start.hidden{display:none}
.hs-start .go{margin-top:0;width:auto;padding:13px 26px}
.hs-start small{font-size:.74rem;color:var(--muted)}
.hs-grid.hidden{display:none}
.setlib-head{display:flex;align-items:center;gap:13px;margin-bottom:12px}
.setlib-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px}
.setlib-item{position:relative;aspect-ratio:16/9;border:2px solid var(--line);border-radius:12px;overflow:hidden;background:rgba(0,0,0,.35);cursor:pointer;transition:.18s}
.setlib-item img{width:100%;height:100%;object-fit:cover;display:block}
.setlib-item:hover{border-color:rgba(255,255,255,.34);transform:translateY(-2px)}
.setlib-item.on{border-color:var(--cyan);box-shadow:0 0 0 3px rgba(18,214,200,.22),0 0 24px rgba(18,214,200,.28);cursor:default}
.setlib-item.on:hover{transform:none}
.setlib-cap{position:absolute;left:0;right:0;bottom:0;padding:5px 8px;font-family:"Space Mono",monospace;font-size:.62rem;letter-spacing:.05em;color:#fff;background:linear-gradient(transparent,rgba(0,0,0,.78))}
/* la croix n'apparaît qu'au survol : elle supprime, elle n'a pas à s'offrir en permanence */
.setlib-x{position:absolute;top:5px;right:5px;width:22px;height:22px;padding:0;border:none;border-radius:50%;background:rgba(0,0,0,.6);color:#fff;font-size:.9rem;line-height:22px;text-align:center;cursor:pointer;opacity:0;transition:.15s}
.setlib-item:hover .setlib-x{opacity:1}
.setlib-x:hover{background:rgba(220,60,60,.85)}
/* téléchargement : même discrétion que la croix, à gauche pour ne pas se confondre avec elle */
.setlib-dl{position:absolute;top:5px;left:5px;width:22px;height:22px;border-radius:50%;background:rgba(0,0,0,.6);color:#fff;font-size:.8rem;line-height:22px;text-align:center;text-decoration:none;opacity:0;transition:.15s}
.setlib-item:hover .setlib-dl{opacity:1}
.setlib-dl:hover{background:var(--cyan);color:#07040f}
/* créer un décor en le décrivant */
.setgen{display:flex;gap:10px;margin-top:12px;flex-wrap:wrap}
.setgen input{flex:1 1 280px;min-width:0;padding:11px 14px;border-radius:12px;border:1px solid var(--line);background:rgba(0,0,0,.28);color:var(--ink);font-family:"Spectral",Georgia,serif;font-size:.86rem}
.setgen input::placeholder{color:var(--faint)}
.setgen input:focus{outline:none;border-color:var(--cyan);box-shadow:0 0 0 3px rgba(18,214,200,.14)}
.setgen input:disabled{opacity:.5}
.setgen .ghost{flex:none;width:auto;margin-top:0;padding:11px 18px;font-size:.8rem;white-space:nowrap}
@media(max-width:640px){.setgen .ghost{flex:1 1 100%}}
@media(max-width:640px){.setlib-head{flex-wrap:wrap}.setlib-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
