/* Studio creation: a short setup, followed by the real console unfolding. */
.tvs-setup { z-index:325; padding:24px; box-sizing:border-box; background:rgba(3,6,12,.78); backdrop-filter:blur(18px); color:var(--sv-text); color-scheme:dark; font-family:var(--font-body,system-ui,sans-serif); animation:tvs-setup-backdrop .35s ease-out both; }
.tvs-setup * { box-sizing:border-box; }
.tvs-setup button { font:inherit; cursor:pointer; }
.tvs-setup button:disabled { cursor:default; }
.tvs-setup :is(button,input,select,textarea):focus-visible { outline:2px solid #b6caff; outline-offset:3px; }
.tvs-setup-shell { display:flex; flex-direction:column; width:min(1000px,100%); max-height:calc(100dvh - 48px); min-height:600px; overflow:hidden; border:1px solid rgba(195,210,244,.2); border-radius:24px; background:#0d111a; box-shadow:0 40px 140px #0009,0 0 90px #7a92ef0c; outline:0; animation:tvs-setup-arrive .6s cubic-bezier(.16,1,.3,1) both; }
.tvs-setup-head { flex:none; display:flex; align-items:center; justify-content:space-between; padding:22px 28px; border-bottom:1px solid #c3d2f014; }
.tvs-setup-brand { display:flex; align-items:center; gap:10px; font-size:13px; letter-spacing:.04em; font-weight:600; }
.tvs-setup-brand .tvs-logo { width:32px; height:23px; background:linear-gradient(130deg,#bfd1ff,#b4a0f7); color:#111725; border:0; font-size:11px; }
.tvs-setup-brand small { padding-left:14px; margin-left:6px; border-left:1px solid #c3d2f02b; color:#8793a9; font:9px/1.5 ui-monospace,monospace; letter-spacing:.16em; }
.tvs-setup-cancel { display:grid; place-items:center; width:30px; height:30px; padding:0; border:0; border-radius:50%; background:transparent; color:#8f9db4; font-size:25px!important; }
.tvs-setup-cancel:hover { background:#c3d2f014; color:#fff; }
.tvs-setup-main { display:grid; grid-template-columns:38% minmax(0,1fr); flex:1; min-height:0; overflow:auto; overscroll-behavior:contain; }
.tvs-setup-scene { position:relative; display:flex; flex-direction:column; align-items:center; justify-content:center; min-width:0; padding:32px 25px; overflow:hidden; border-right:1px solid #c3d2f014; background:radial-gradient(ellipse at 30% 30%,#738dff1e,transparent 65%),radial-gradient(ellipse at 80% 90%,#a688e51c,transparent 60%),#0b101b; }
.tvs-setup-scene::before { content:''; position:absolute; inset:0; pointer-events:none; background-image:radial-gradient(#a6bae81c .6px,transparent .6px); background-size:19px 19px; mask-image:linear-gradient(transparent,#000 35%,transparent); }
.tvs-setup-kicker { position:absolute; top:32px; font:8px/1.5 ui-monospace,monospace; color:#8b9abb; letter-spacing:.2em; }
.tvs-setup-orbit { position:relative; display:grid; place-items:center; width:204px; height:204px; margin:0 0 8px; }
.tvs-setup-orbit > i { position:absolute; inset:12px; border:1px solid #9eb9ff24; border-radius:50%; transform:rotateX(58deg) rotate(-28deg); }
.tvs-setup-orbit > i:nth-child(2) { inset:0; transform:rotateY(55deg) rotate(36deg); border-color:#baa0ff2e; }
.tvs-setup-orbit > i::after { content:''; position:absolute; top:15px; left:22px; width:5px; height:5px; border-radius:50%; background:#c3ceff; box-shadow:0 0 14px #b4c7ff; }
.tvs-setup-orbit > span { display:flex; flex-direction:column; align-items:center; gap:12px; font:500 64px/1 system-ui,sans-serif; letter-spacing:-6px; color:#d5dfff; text-shadow:0 0 45px #8aabff65; }
.tvs-setup-orbit small { color:#8799bb; font:8px/1 ui-monospace,monospace; letter-spacing:.17em; }
.tvs-setup-mini { position:relative; display:grid; grid-template-columns:.8fr 1fr .8fr; gap:4px; width:100%; height:108px; padding:8px; border:1px solid #c3d2f02b; border-radius:9px; background:#141d2cc4; box-shadow:0 12px 40px #0004; transform:perspective(600px) rotateY(9deg) rotateX(8deg); }
.tvs-setup-mini > div { min-width:0; padding:6px; border:1px solid #c3d2f012; border-radius:4px; color:#93a4c2; background:#0d1423; font-size:8px; }
.tvs-setup-mini i { display:block; height:3px; margin-top:7px; border-radius:2px; background:#a6b8e32e; }
.tvs-setup-mini > div:first-child i:nth-child(3) { width:70%; }
.tvs-setup-mini > div:first-child b { display:block; height:16px; margin-top:12px; border:1px solid #b5caff26; border-radius:3px; }
.tvs-setup-mini > div:nth-child(2) span { display:grid; grid-template-columns:1fr 1fr; gap:4px; margin-top:6px; }
.tvs-setup-mini > div:nth-child(2) i { height:25px; margin:0; border:1px solid #c3d2f021; background:linear-gradient(145deg,#7693bb24,#9986ce30); }
.tvs-setup-mini > div:last-child b { display:grid; place-items:center; height:37px; margin-top:6px; border-radius:3px; color:#bdc9eb; background:linear-gradient(140deg,#657fa531,#978bb029); font-size:16px; }
.tvs-setup-mini > div:last-child i { height:6px; margin-top:4px; background:#a1abdb42; }
.tvs-setup-scene p { position:relative; margin:27px 0 10px; color:#c8d2e7; font-size:16px; letter-spacing:.06em; }
.tvs-setup-scene-note { position:relative; color:#71819e; font-size:9px; letter-spacing:.08em; }
.tvs-setup-content { min-width:0; padding:28px 36px 30px; }
.tvs-setup-steps { display:flex; align-items:center; gap:20px; margin-bottom:32px; }
.tvs-setup-steps button { display:flex; align-items:center; gap:7px; padding:0; border:0; background:transparent; color:#a1b0cb; font-size:10px; white-space:nowrap; }
.tvs-setup-steps button:disabled { color:#59677e; }
.tvs-setup-steps button > span { display:grid; place-items:center; width:23px; height:23px; border:1px solid #c3d2f023; border-radius:50%; font:9px/1 ui-monospace,monospace; }
.tvs-setup-steps button[aria-current=step] { color:#d7e2fb; }
.tvs-setup-steps button[aria-current=step] > span { border-color:#aabdff; background:#94aaff15; box-shadow:0 0 16px #91abff16; }
.tvs-setup-page { animation:tvs-setup-page .35s ease-out both; }
.tvs-setup-index { font:10px/1.5 ui-monospace,monospace; letter-spacing:.16em; color:#8396ba; }
.tvs-setup-page h2 { margin:10px 0; color:#eef2fc; font-size:25px; font-weight:550; line-height:1.4; letter-spacing:-.03em; }
.tvs-setup-page > p { margin:0 0 25px; color:#8e9cb4; font-size:12px; line-height:1.8; }
.tvs-setup-fields { min-width:0; }
.tvs-setup-fields .tvs-quick { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; }
.tvs-setup-fields .tvs-quick-item { display:flex; flex-direction:column; align-items:stretch; gap:8px; color:#b5c1d8; font-size:11px; }
.tvs-setup-fields :is(.tvs-quick-item > select,.film-generation-settings select) { width:100%; max-width:none; min-width:0; height:38px; padding:0 10px; border:1px solid #bdcff72b; border-radius:8px; background:#161e2c; color:#e3eafb; font-family:inherit; font-size:12px; line-height:1.5; cursor:pointer; }
.tvs-setup-fields .sb-vdur { max-width:none; gap:7px; }
.tvs-setup-fields .sb-vdur input { width:100%; height:38px; padding:0 8px; border-color:#bdcff72b; border-radius:8px; background:#161e2c; color:#e3eafb; font-size:12px; }
.tvs-setup-custom { display:flex; flex-direction:column; gap:8px; margin-top:18px; color:#b5c1d8; font-size:11px; }
.tvs-setup-style { width:100%; min-height:67px; max-height:130px; resize:vertical; padding:10px 12px; border:1px solid #bdcff72b; border-radius:8px; background:#161e2c; color:#e3eafb; font-family:inherit; font-size:12px; line-height:1.7; }
.tvs-setup-style::placeholder { color:#63718b; }
.tvs-setup-fields .film-generation-settings fieldset { grid-template-columns:minmax(0,1fr) 100px; gap:20px 14px; }
.tvs-setup-fields .film-generation-settings label { gap:9px; color:#b5c1d8; }
.tvs-setup-fields :is(.tvs-setup-segment,.tvs-setup-assembly) { grid-column:1/-1; }
.tvs-setup-fields .tvs-setup-segment { padding:16px 0; border-top:1px solid #c3d2f014; border-bottom:1px solid #c3d2f014; }
.tvs-setup-segment small { display:block; margin-top:6px; color:#7889a5; font-size:11px; }
.tvs-setup-fields input.sb-segment-mode { appearance:none; position:relative; width:34px; height:20px; border:1px solid #9bafd24d; border-radius:20px; background:#2c3546; transition:background .2s; }
.tvs-setup-fields input.sb-segment-mode::after { content:''; position:absolute; top:3px; left:3px; width:12px; height:12px; border-radius:50%; background:#abb8ce; transition:transform .2s; }
.tvs-setup-fields input.sb-segment-mode:checked { background:#a6baff; border-color:#a6baff; }
.tvs-setup-fields input.sb-segment-mode:checked::after { background:#18213b; transform:translateX(14px); }
.tvs-setup-model-note { margin:20px 0 0; color:#7e8faa; font-size:11px; line-height:1.8; }
.tvs-setup-footer { flex:none; display:flex; justify-content:space-between; align-items:center; gap:16px; padding:18px 28px; border-top:1px solid #c3d2f014; background:#0b1019; }
.tvs-setup-footer > div { display:flex; align-items:center; gap:12px; }
.tvs-setup-footer button { min-height:38px; padding:0 14px; border:1px solid transparent; border-radius:8px; color:#a3b1cb; background:transparent; font-size:12px; white-space:nowrap; }
.tvs-setup-footer button:hover { color:#edf2ff; background:#c3d2f012; }
.tvs-setup-footer .tvs-setup-skip { padding:0; color:#8796b0; }
.tvs-setup-footer .tvs-setup-next { display:flex; align-items:center; justify-content:center; gap:24px; min-width:130px; padding:0 18px; border-color:#c3d2ff60; background:linear-gradient(115deg,#b5caff,#c9bbf5); color:#111a2c; font-weight:600; box-shadow:0 4px 22px #9bafff12; }
.tvs-setup-footer .tvs-setup-next:hover { background:#d3dfff; color:#111a2c; }
.tvs-setup-progress { display:flex; gap:5px; margin-right:auto; }
.tvs-setup-progress i { display:block; width:18px; height:2px; border-radius:2px; background:#c3d2f01a; }
.tvs-setup-progress i.on { background:#a5b9ee; }
.tvs-setup.is-launching { pointer-events:none; animation:tvs-setup-depart .46s ease-in both; }
.tvs-setup.is-launching .tvs-setup-shell { animation:tvs-setup-lift .46s cubic-bezier(.4,0,1,1) both; }
.tvs-entering { transform-origin:center; animation:tvs-studio-enter 1.35s cubic-bezier(.16,1,.3,1) both; }
.tvs-entering .tvs-top { animation:tvs-studio-bar .65s .12s both; }
.tvs-entering .tvs-left { animation:tvs-studio-pane .8s .22s both; }
.tvs-entering .tvs-mid { animation:tvs-studio-pane .8s .34s both; }
.tvs-entering .tvs-right { animation:tvs-studio-pane .8s .46s both; }
.tvs-entering .tvs-timeline { animation:tvs-studio-bar .7s .6s both; }
@keyframes tvs-setup-backdrop { from { opacity:0; } }
@keyframes tvs-setup-arrive { from { opacity:0; transform:translateY(22px) scale(.96); } }
@keyframes tvs-setup-page { from { opacity:0; transform:translateX(12px); } }
@keyframes tvs-setup-depart { to { opacity:0; backdrop-filter:blur(0); } }
@keyframes tvs-setup-lift { to { opacity:0; transform:translateY(-24px) scale(1.06); filter:blur(5px); } }
@keyframes tvs-studio-enter { from { opacity:0; transform:perspective(1200px) rotateX(6deg) scale(.94); filter:blur(3px); } to { opacity:1; transform:none; filter:none; } }
@keyframes tvs-studio-pane { from { opacity:0; transform:translateY(22px) scaleX(.94); } to { opacity:1; transform:none; } }
@keyframes tvs-studio-bar { from { opacity:0; transform:translateY(10px); } to { opacity:1; transform:none; } }
@media (max-width:760px) {
  .tvs-setup { padding:16px; }
  .tvs-setup-shell { min-height:0; max-height:calc(100dvh - 32px); }
  .tvs-setup-main { display:block; }
  .tvs-setup-scene { display:none; }
  .tvs-setup-content { padding:24px; }
  .tvs-setup-steps { margin-bottom:26px; justify-content:space-between; gap:8px; }
  .tvs-setup-head { padding:16px 24px; }
  .tvs-setup-footer { padding:16px 24px; }
}
@media (max-width:420px) {
  .tvs-setup { padding:10px; }
  .tvs-setup-shell { max-height:calc(100dvh - 20px); border-radius:16px; }
  .tvs-setup-content { padding:20px 16px; }
  .tvs-setup-head,.tvs-setup-footer { padding:14px 16px; }
  .tvs-setup-brand small,.tvs-setup-progress { display:none; }
  .tvs-setup-page h2 { font-size:21px; }
  .tvs-setup-fields .tvs-quick { gap:16px 12px; }
  .tvs-setup-fields .film-generation-settings fieldset { grid-template-columns:minmax(0,1fr); }
  .tvs-setup-footer { gap:8px; }
  .tvs-setup-footer > div { gap:4px; }
  .tvs-setup-footer button { padding:0 9px; font-size:11px; }
  .tvs-setup-footer .tvs-setup-next { min-width:108px; gap:12px; padding:0 12px; }
}
@media (max-height:720px) and (min-width:761px) {
  .tvs-setup-shell { min-height:0; }
  .tvs-setup-content { padding:20px 28px; }
  .tvs-setup-steps { margin-bottom:20px; }
  .tvs-setup-page > p { margin-bottom:18px; }
}
@media (prefers-reduced-motion:reduce) {
  .tvs-setup,.tvs-setup *,.tvs-entering,.tvs-entering * { animation:none!important; transition:none!important; }
}
