/* ===== Estúdio de aulas: camada sobre o vídeo (aluno) ===== */
.st-stage{position:relative;display:block;overflow:hidden;background:#000}
.st-stage:fullscreen{width:100vw;height:100vh;display:flex;align-items:center;justify-content:center}
.st-stage:fullscreen mux-player,.st-stage:fullscreen video{width:100%;height:100%}
.st-layer{position:absolute;inset:0;pointer-events:none;z-index:5;container-type:inline-size}
.st-dip{position:absolute;inset:0;opacity:0;transition:opacity .22s ease;pointer-events:none}
.st-dip.black{background:#000}.st-dip.white{background:#fff}.st-dip.blur{backdrop-filter:blur(18px) brightness(.7);-webkit-backdrop-filter:blur(18px) brightness(.7)}
.st-dip.on{opacity:1}
/* imagens e textos */
.st-ov{position:absolute;left:5%;right:5%;display:flex;flex-direction:column;align-items:center;gap:4px;opacity:0;transition:opacity .6s ease,transform .7s cubic-bezier(.2,.7,.2,1);text-align:center}
.st-ov.p-top{top:6%}.st-ov.p-center{top:50%;transform:translateY(-50%)}.st-ov.p-bottom{bottom:16%}
.st-ov.p-corner{right:4%;left:auto;top:5%;align-items:flex-end;text-align:right;max-width:40%}
.st-ov.a-zoom{transform:scale(.86)}.st-ov.a-zoom.p-center{transform:translateY(-50%) scale(.86)}
.st-ov.a-slide{transform:translateY(24px)}.st-ov.a-slide.p-center{transform:translateY(calc(-50% + 24px))}
.st-ov.on{opacity:1;transform:none}.st-ov.on.p-center{transform:translateY(-50%)}
.st-ov.text b{font:700 clamp(15px,4.6cqi,34px)/1.2 Georgia,"Times New Roman",serif;color:#fff;background:rgba(0,0,0,.55);border-left:3px solid #d4af37;padding:.3em .7em;border-radius:6px;text-shadow:0 2px 8px #000}
.st-ov.text small{font:600 clamp(11px,2.8cqi,20px)/1.3 system-ui;color:#f0d760;background:rgba(0,0,0,.5);padding:.2em .6em;border-radius:5px}
.st-ov.image img{max-width:min(46cqi,420px);max-height:40cqi;border-radius:12px;box-shadow:0 10px 30px rgba(0,0,0,.65);border:2px solid rgba(212,175,55,.7)}
.st-ov.p-corner.image img{max-width:30cqi}
.st-ov.image span{font:700 clamp(12px,3cqi,22px) Georgia,serif;color:#fff;background:rgba(0,0,0,.6);padding:.2em .6em;border-radius:6px}
/* abertura */
.st-open{position:absolute;inset:0;background:#000;display:flex;align-items:flex-end;justify-content:center;padding-bottom:9%;opacity:0;transition:opacity .7s ease;pointer-events:auto}
.st-open.in{opacity:1}.st-open.out{opacity:0;transition:opacity .85s ease}
.st-open img,.st-open video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transform:scale(1.12);transition:transform 6s cubic-bezier(.2,.6,.2,1);filter:brightness(.82)}
.st-open.in img{transform:scale(1)}
.st-open::after{content:"";position:absolute;inset:0;background:linear-gradient(transparent 45%,rgba(0,0,0,.85));pointer-events:none}
.st-open-tx{position:relative;z-index:1;text-align:center;display:flex;flex-direction:column;gap:6px;opacity:0;transform:translateY(16px);transition:opacity .9s ease .5s,transform 1s cubic-bezier(.2,.7,.2,1) .5s}
.st-open.in .st-open-tx{opacity:1;transform:none}
.st-open-tx b{font:700 clamp(20px,6cqi,52px)/1.1 Georgia,serif;color:#f0d760;letter-spacing:.04em;text-shadow:0 4px 24px rgba(0,0,0,.9)}
.st-open-tx small{font:600 clamp(12px,3cqi,22px) system-ui;color:#fff;letter-spacing:.14em;text-transform:uppercase;text-shadow:0 2px 12px #000}
.st-skip{position:absolute;right:12px;bottom:12px;background:rgba(0,0,0,.55);color:#fff;border:1px solid rgba(255,255,255,.35);border-radius:99px;padding:8px 14px;font:600 13px system-ui;min-height:38px}
/* encerramento */
.st-close{position:absolute;inset:0;background:radial-gradient(ellipse at 50% 30%,#1b1406,#030303 70%);opacity:0;transition:opacity .8s ease;pointer-events:auto;overflow:hidden}
.st-close.in{opacity:1}.st-close.out{opacity:0}
.st-roll{position:absolute;left:0;right:0;top:100%;text-align:center;animation:st-roll 9s linear forwards}
.st-close::after{content:"";position:absolute;inset:0;background:linear-gradient(#030303,transparent 18%,transparent 82%,#030303);pointer-events:none}
.st-close.next-on .st-roll{animation-play-state:paused;opacity:0;transition:opacity .6s ease}
@keyframes st-roll{from{top:100%;transform:translateY(0)}to{top:0;transform:translateY(-100%)}}
.st-roll p{margin:0 0 4cqi;display:flex;flex-direction:column}
.st-roll small{font:600 clamp(10px,2.4cqi,16px) system-ui;color:#b9a56a;letter-spacing:.16em;text-transform:uppercase}
.st-roll b{font:700 clamp(15px,4.4cqi,32px) Georgia,serif;color:#fff}
.st-thanks{font:italic clamp(14px,3.8cqi,26px)/1.35 Georgia,serif;color:#f0d760;padding:0 8%}
.st-next{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;padding:0 6%;text-align:center;opacity:0;transform:scale(.96);transition:opacity .7s ease,transform .8s cubic-bezier(.2,.7,.2,1);pointer-events:none}
.st-close.next-on .st-next{opacity:1;transform:none;pointer-events:auto}
.st-next small{font:600 clamp(11px,2.6cqi,18px) system-ui;color:#b9a56a;letter-spacing:.12em;text-transform:uppercase}
.st-next b{font:700 clamp(17px,5cqi,36px)/1.2 Georgia,serif;color:#fff}
.st-row{display:flex;gap:10px;margin-top:8px;flex-wrap:wrap;justify-content:center}
.st-go{background:linear-gradient(180deg,#f0d760,#d4af37);color:#140f02;border:0;border-radius:12px;padding:10px 18px;font:700 15px system-ui;min-height:44px}
.st-cd{display:inline-grid;place-items:center;min-width:1.6em;height:1.6em;border-radius:50%;background:rgba(0,0,0,.2);margin-left:6px}
.st-stay{background:rgba(255,255,255,.08);color:#eee;border:1px solid rgba(255,255,255,.25);border-radius:12px;padding:10px 16px;font:600 14px system-ui;min-height:44px}
@media (prefers-reduced-motion:reduce){.st-open img,.st-roll,.st-ov,.st-next{transition:none!important;animation:none!important}.st-roll{top:10%}}

/* ===== Estúdio no painel ADM ===== */
.sx{display:grid;gap:12px}
.sx-prev{position:relative;border-radius:12px;overflow:hidden;background:#000;aspect-ratio:16/9}
.sx-prev video{width:100%;height:100%;object-fit:contain;display:block}
.sx-tl{position:relative;height:58px;border-radius:10px;background:#0d0d0d;border:1px solid #2a2414;overflow:hidden;touch-action:none;cursor:pointer}
.sx-tl .lane{position:absolute;left:0;right:0;height:16px}
.sx-tl .l1{top:4px}.sx-tl .l2{top:21px}.sx-tl .l3{top:38px}
.sx-tl .blk{position:absolute;top:0;bottom:0;border-radius:4px;min-width:3px;opacity:.85}
.sx-tl .cut{background:repeating-linear-gradient(45deg,#e5533d 0 6px,#7a2116 6px 12px)}
.sx-tl .mute{background:#4aa8e0}.sx-tl .up{background:#9ccf3a}.sx-tl .down{background:#b07be8}
.sx-tl .ovl{background:#d4af37}.sx-tl .trim{background:rgba(0,0,0,.75);top:0;bottom:0;position:absolute;z-index:2}
.sx-tl .head{position:absolute;top:0;bottom:0;width:2px;background:#fff;box-shadow:0 0 6px #fff;z-index:3;pointer-events:none}
.sx-legend{display:flex;flex-wrap:wrap;gap:10px;font:12px system-ui;color:#aaa}.sx-legend i{display:inline-block;width:10px;height:10px;border-radius:2px;margin-right:4px;vertical-align:-1px}
.sx-marks{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:8px}
.sx-marks button{min-height:44px}
.sx-marks button.rec{background:#e5533d;color:#fff;border-color:#e5533d;animation:sx-blink 1s ease-in-out infinite}
@keyframes sx-blink{50%{opacity:.6}}
.sx-list{display:grid;gap:6px}
.sx-item{display:grid;grid-template-columns:auto 1fr auto;gap:8px;align-items:center;background:#0c0c0c;border:1px solid #222;border-radius:10px;padding:8px}
.sx-item input,.sx-item select{min-width:0;width:100%}
.sx-item .tm{display:flex;gap:4px;align-items:center;font:12px system-ui;color:#aaa}
.sx-item .tm input{width:74px}
.sx-dot{width:12px;height:12px;border-radius:3px}
.sx-sl{display:grid;grid-template-columns:130px 1fr 52px;gap:8px;align-items:center;font-size:14px}
.sx-sl output{text-align:right;color:#f0d760;font-variant-numeric:tabular-nums}
@media (max-width:520px){.sx-sl{grid-template-columns:1fr 52px}.sx-sl label{grid-column:1/-1}.sx-item{grid-template-columns:auto 1fr}.sx-item>:last-child{grid-column:1/-1}}
