/* «استودیوی دوبله» (۱۴۰۵/۰۸/۱۰) — static/js/env_dub.js */
.dub{ --dub-a: var(--env-family-accent, #DC2626); width:min(1180px, calc(100vw - 20px)); height:min(900px, calc(100dvh - 20px)); max-height:none; padding:0; border:0;
  border-radius:22px; background: var(--env-paper, #fff); color: var(--env-ink, #1a1a1a); box-shadow:0 30px 90px rgba(0,0,0,.4); overflow:hidden; direction:rtl; }
.dub[open]{ display:flex; flex-direction:column; }
.dub::backdrop{ background: rgba(10,8,20,.65); }
.dub [hidden]{ display:none !important; }
.dub-h, .dub-f2{ flex:none; display:flex; align-items:center; gap:10px; padding:12px 18px; border-bottom:1px solid var(--env-border, #e5e5e5); }
.dub-h{ justify-content:space-between; }
.dub-h div{ display:flex; flex-direction:column; gap:2px; }
.dub-h b{ font-size:1.02rem; } .dub-h span{ font-size:.75rem; color: var(--env-ink-muted, #666); }
.dub-f2{ border-bottom:0; border-top:1px solid var(--env-border, #e5e5e5); flex-wrap:wrap; }
.dub-f2 .dub-hint{ flex:1; min-width:220px; }
.dub-save{ font-size:.72rem; color: var(--env-ink-muted, #666); min-width:60px; }
.dub-x{ width:36px; height:36px; border-radius:50%; border:1px solid var(--env-border, #e5e5e5); background: var(--env-paper, #fff); color: inherit; cursor:pointer; flex:none; }
.dub-body{ flex:1; min-height:0; display:grid; grid-template-columns: 320px minmax(0, 1fr); }
.dub-side{ padding:14px; border-left:1px solid var(--env-border, #e5e5e5); display:flex; flex-direction:column; gap:10px; overflow-y:auto; }
.dub-side video{ width:100%; max-height:52dvh; border-radius:14px; background:#000; }
.dub-vinfo{ font-size:.78rem; color: var(--env-ink-muted, #666); }
.dub-steps{ font-size:.74rem; color: var(--env-ink-muted, #666); line-height:1.9; padding:10px 12px; border-radius:12px; background: var(--env-paper-2, rgba(0,0,0,.03)); }
.dub-steps b{ color: var(--env-ink, #1a1a1a); } .dub-steps ol{ margin:4px 0 0; padding-inline-start:18px; }
.dub-main{ min-width:0; overflow-y:auto; padding:14px 18px 24px; }
.dub-sec{ display:flex; flex-direction:column; gap:10px; margin-bottom:18px; }
.dub-sec h4{ margin:0; font-size:.95rem; } .dub-sec h4 small{ font-weight:500; color: var(--env-ink-muted, #666); }
.dub-sh{ display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:8px; }
.dub-btn{ font:inherit; font-size:.8rem; font-weight:700; cursor:pointer; padding:8px 13px; border-radius:11px; border:1px solid var(--env-border, #e5e5e5);
  background: var(--env-paper, #fff); color: inherit; text-decoration:none; display:inline-flex; align-items:center; gap:6px; white-space:nowrap; }
.dub-btn:hover{ border-color: var(--dub-a); }
.dub-btn--pri{ background: var(--dub-a); border-color: var(--dub-a); color:#fff; padding:10px 20px; font-size:.88rem; }
.dub-btn--acc{ color: var(--dub-a); border-color: color-mix(in srgb, var(--dub-a) 40%, var(--env-border, #e5e5e5)); }
.dub-btn--sm{ padding:5px 10px; font-size:.74rem; }
.dub-btn:disabled{ opacity:.6; cursor:wait; }
.dub-icon{ width:30px; height:30px; flex:none; border-radius:9px; border:1px solid var(--env-border, #e5e5e5); background: var(--env-paper, #fff); color: inherit; cursor:pointer; font-size:.85rem; display:inline-grid; place-items:center; }
.dub-hint{ font-size:.74rem; color: var(--env-ink-muted, #666); line-height:1.8; margin:0; }
/* شخصیت‌ها */
.dub-cast{ display:grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 260px), 1fr)); gap:10px; }
.dub-char{ display:flex; flex-direction:column; gap:8px; padding:10px; border-radius:14px; border:1px solid var(--env-border, #e5e5e5); background: var(--env-paper-2, var(--env-paper, #fff)); }
.dub-char-h{ display:flex; align-items:center; gap:8px; }
.dub-char-h small{ font-size:.7rem; color: var(--env-ink-muted, #666); white-space:nowrap; }
.dub-name{ flex:1; min-width:0; font:inherit; font-weight:800; font-size:.9rem; border:1px solid transparent; border-radius:9px; padding:5px 7px; background:transparent; color: inherit; }
.dub-name:hover, .dub-name:focus{ border-color: var(--env-border, #e5e5e5); background: var(--env-paper, #fff); }
.dub-vrow{ display:flex; align-items:center; gap:8px; }
.dub-voice{ flex:1; min-width:0; font:inherit; color: inherit; cursor:pointer; display:flex; align-items:center; gap:8px; text-align:right; padding:7px 10px; border-radius:11px;
  border:2px solid color-mix(in srgb, var(--dub-a) 35%, var(--env-border, #e5e5e5)); background: var(--env-paper, #fff); }
.dub-voice span{ flex:1; min-width:0; display:flex; flex-direction:column; }
.dub-voice b{ font-size:.85rem; } .dub-voice small{ font-size:.68rem; color: var(--env-ink-muted, #666); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.dub-voice i{ font-style:normal; font-size:.68rem; color: var(--dub-a); white-space:nowrap; }
.dub-pv{ flex:none; width:32px; height:32px; border-radius:50%; border:0; cursor:pointer; display:inline-grid; place-items:center; font-size:.72rem; padding-left:2px;
  background: color-mix(in srgb, var(--dub-a) 14%, var(--env-paper, #fff)); color: var(--dub-a); }
.dub-pv.is-on{ background: var(--dub-a); color:#fff; }
.dub-pv--off{ cursor:default; }
.dub-picker{ display:flex; flex-direction:column; gap:6px; padding:8px; border-radius:12px; background: var(--env-paper, #fff); border:1px solid var(--env-border, #e5e5e5); max-height:360px; overflow-y:auto; }
.dub-picker h5{ margin:6px 0 0; font-size:.78rem; } .dub-picker h5 small{ font-weight:500; color: var(--env-ink-muted, #666); }
.dub-vlist{ display:grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap:6px; }
.dub-vopt{ display:flex; align-items:center; gap:6px; padding:4px 6px; border-radius:10px; border:2px solid var(--env-border, #e5e5e5); min-width:0; }
.dub-vopt[data-sel="true"]{ border-color: var(--dub-a); background: color-mix(in srgb, var(--dub-a) 9%, var(--env-paper, #fff)); }
.dub-vpick{ flex:1; min-width:0; font:inherit; color: inherit; background:none; border:0; cursor:pointer; text-align:right; display:flex; flex-direction:column; padding:2px; }
.dub-vpick b{ font-size:.76rem; } .dub-vpick b small{ font-weight:500; color: var(--env-ink-muted, #666); font-size:.64rem; }
.dub-vpick span{ font-size:.64rem; color: var(--env-ink-muted, #666); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.dub-f{ display:flex; flex-direction:column; gap:5px; font-size:.74rem; font-weight:700; color: var(--env-ink-muted, #666); min-width:0; }
.dub-f small{ font-weight:500; }
.dub select, .dub textarea, .dub-name-row input{ font:inherit; font-size:.84rem; color: var(--env-ink, #1a1a1a); background: var(--env-paper, #fff); border:1px solid var(--env-border, #e5e5e5); border-radius:10px; padding:6px 9px; }
.dub input[type=range]{ accent-color: var(--dub-a); }
/* جمله‌ها */
.dub-lines{ display:flex; flex-direction:column; gap:8px; }
.dub-line{ display:flex; flex-direction:column; gap:7px; padding:10px; border-radius:14px; border:1px solid var(--env-border, #e5e5e5); background: var(--env-paper, #fff); }
.dub-line.is-bad{ border-color:#ea580c; }
.dub-lt, .dub-lb{ display:flex; flex-wrap:wrap; align-items:center; gap:8px; }
.dub-num{ width:24px; height:24px; border-radius:50%; display:inline-grid; place-items:center; font-size:.72rem; font-weight:800; background: var(--env-paper-2, rgba(0,0,0,.05)); }
.dub-time{ display:inline-flex; align-items:center; gap:3px; direction:ltr; }
.dub-time .dub-icon{ width:26px; height:26px; }
.dub-tbtn{ font:inherit; font-size:.8rem; font-weight:800; cursor:pointer; border:1px solid var(--env-border, #e5e5e5); background: var(--env-paper-2, rgba(0,0,0,.03)); color: inherit; border-radius:8px; padding:3px 8px; min-width:62px; }
.dub-spk{ font-weight:800; border-color: var(--c) !important; color: var(--c) !important; }
.dub-del{ margin-inline-start:auto; }
.dub-line textarea{ width:100%; resize:none; line-height:1.9; font-size:.92rem; overflow:hidden; }
.dub-lb label{ display:inline-flex; align-items:center; gap:5px; font-size:.72rem; color: var(--env-ink-muted, #666); }
.dub-pvinfo{ font-size:.7rem; color: var(--env-ink-muted, #666); } .dub-pvinfo.is-warn{ color:#c2410c; }
.dub-qc{ font-size:.74rem; padding:5px 9px; border-radius:9px; line-height:1.8; }
.dub-qc.is-ok{ color:#15803d; background: rgba(22,163,74,.08); } .dub-qc.is-bad{ color:#c2410c; background: rgba(234,88,12,.1); }
.dub-more summary{ cursor:pointer; font-weight:800; font-size:.92rem; } .dub-more summary small{ font-weight:500; color: var(--env-ink-muted, #666); }
.dub-more[open]{ gap:8px; }
.dub-name-row{ display:flex; gap:6px; margin-bottom:6px; } .dub-name-row input{ flex:1; min-width:0; }
.dub-bg{ display:flex; flex-direction:column; gap:6px; }
.dub-radio{ display:flex; align-items:center; gap:8px; font-size:.82rem; cursor:pointer; }
.dub-radio input{ accent-color: var(--dub-a); width:16px; height:16px; } .dub-radio small{ color: var(--env-ink-muted, #666); }
.dub-row{ display:grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap:10px; }
/* انتظار و نتیجه */
.dub-wait{ display:flex; flex-direction:column; align-items:center; gap:10px; padding:60px 20px; text-align:center; }
.dub-wait--in{ padding:20px; }
.dub-wait i{ display:block; width:min(340px, 100%); height:8px; border-radius:99px; background: var(--env-border, #e5e5e5); overflow:hidden; }
.dub-wait em{ display:block; height:100%; width:0; background: var(--dub-a); transition: width .4s; }
.dub-wait small{ font-size:.75rem; color: var(--env-ink-muted, #666); }
.dub-spin{ width:30px; height:30px; border-radius:50%; border:3px solid var(--env-border, #e5e5e5); border-top-color: var(--dub-a); animation: dubSpin .8s linear infinite; }
@keyframes dubSpin{ to{ transform: rotate(360deg); } }
.dub-res{ padding:14px; border-radius:16px; border:2px solid color-mix(in srgb, var(--dub-a) 30%, var(--env-border, #e5e5e5)); display:flex; flex-direction:column; gap:10px; align-items:center; }
.dub-res h4{ margin:0; } .dub-res video{ width:100%; max-height:50dvh; border-radius:14px; background:#000; }
.dub-qcsum{ font-size:.8rem; padding:7px 11px; border-radius:10px; line-height:1.8; width:100%; }
.dub-qcsum.is-ok{ color:#15803d; background: rgba(22,163,74,.08); } .dub-qcsum.is-bad{ color:#c2410c; background: rgba(234,88,12,.1); }
.dub-acts{ display:flex; flex-wrap:wrap; gap:8px; justify-content:center; }
.dub-btn:focus-visible, .dub-icon:focus-visible, .dub-pv:focus-visible, .dub-voice:focus-visible, .dub-vpick:focus-visible, .dub-tbtn:focus-visible, .dub-x:focus-visible{
  outline:3px solid color-mix(in srgb, var(--dub-a) 55%, transparent); outline-offset:2px; }
@media (max-width: 860px){
  .dub{ width:100vw; height:100dvh; border-radius:0; }
  .dub-body{ grid-template-columns: 1fr; overflow-y:auto; }
  .dub-side{ border-left:0; border-bottom:1px solid var(--env-border, #e5e5e5); overflow:visible; }
  .dub-side video{ max-height:34dvh; }
  .dub-steps{ display:none; }
  .dub-main{ overflow:visible; }
}
@media (prefers-reduced-motion: reduce){ .dub-spin{ animation:none; } .dub-wait em{ transition:none; } }
.dub-steps ol{ list-style: persian; }