/* Modal Styles
 * Styles for modal overlays and modal boxes
 * Enhanced with premium animations and refined design
 */

/* Ensure proper text flow and direction inside modal */
.modal-mask,
.modal-box,
.modal-box * {
    writing-mode: horizontal-tb !important;
    text-orientation: mixed !important;
}

/* Ensure modal box has proper layout */
.modal-box {
    min-width: 0;
}

/* Ensure grid layout works properly */
.modal-box .grid {
    display: grid;
}

.modal-box .grid-cols-3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.modal-box .grid-cols-2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

/* Ensure flex items have proper sizing */
.modal-box .flex > * {
    min-width: 0;
}

/* Specific styles for Export Modal to fix layout issues */
.modal-box .grid.grid-cols-3 {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
}

.modal-box .grid.grid-cols-2 {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
}

.modal-box .flex.flex-col {
    flex-direction: column;
}

.modal-box .flex.items-center {
    align-items: center;
}

.modal-box .flex.justify-between {
    justify-content: space-between;
}

.modal-box .gap-6 {
    gap: 1.5rem;
}

.modal-box .gap-3 {
    gap: 0.75rem;
}

.modal-box .gap-2 {
    gap: 0.5rem;
}

.modal-box .gap-2\.5 {
    gap: 0.625rem;
}

.modal-box .space-y-5 > * + * {
    margin-top: 1.25rem;
}

.modal-box .space-y-0\.5 > * + * {
    margin-top: 0.125rem;
}

.modal-box .text-center {
    text-align: center;
}

.modal-box .text-left {
    text-align: left;
}

.modal-box label {
    display: flex;
    align-items: center;
}

.modal-box label.flex-col {
    flex-direction: column;
}

/* Ensure export modal elements have proper width and don't collapse */
.modal-box .w-72 {
    width: 18rem;
}

.modal-box .flex-1 {
    flex: 1 1 0%;
}

.modal-box .shrink-0 {
    flex-shrink: 0;
}

.modal-box .min-w-0 {
    min-width: 0;
}

.modal-box .p-4 {
    padding: 1rem;
}

.modal-box .p-3 {
    padding: 0.75rem;
}

.modal-box .rounded-xl {
    border-radius: 0.75rem;
}

.modal-box .border {
    border-width: 1px;
}

.modal-box .text-xs {
    font-size: 0.75rem;
}

.modal-box .text-sm {
    font-size: 0.875rem;
}

.modal-box .font-medium {
    font-weight: 500;
}

.modal-box .uppercase {
    text-transform: uppercase;
}

.modal-box .tracking-wider {
    letter-spacing: 0.05em;
}

/* Ensure display properties work correctly */
.modal-box .flex {
    display: flex !important;
}

.modal-box .grid {
    display: grid !important;
}

.modal-box .hidden {
    display: none !important;
}

/* Audio Intelligence：阴影与 overflow 拆层，避免底边 box-shadow 被裁切 */
.audio-intel-modal-shell {
  position: relative;
  z-index: 10;
  width: 100%;
  max-width: 42rem; /* max-w-2xl */
  border-radius: 1rem;
  /* 深色遮罩上需偏黑、略大的阴影，否则底边几乎看不见 */
  box-shadow:
    0 4px 16px rgba(0, 0, 0, 0.22),
    0 18px 48px -8px rgba(0, 0, 0, 0.42),
    0 32px 72px -16px rgba(0, 0, 0, 0.35);
}
.audio-intel-modal-panel {
  position: relative;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  width: 100%;
  max-height: min(78vh, calc(100dvh - var(--app-header-offset, 90px) - 3.5rem));
  border-radius: 1rem;
}
body.app-theme-dark .audio-intel-modal-shell {
  box-shadow:
    0 4px 18px rgba(0, 0, 0, 0.45),
    0 22px 56px -8px rgba(0, 0, 0, 0.55),
    0 36px 80px -16px rgba(0, 0, 0, 0.4);
}

/* Teleport 挂载点：与内联 z-[100000] 同层，避免与 #app / main 内 stacking 竞争 */
#modal-root {
  position: relative;
  z-index: 100000;
  pointer-events: none;
}
#modal-root > * {
  pointer-events: auto;
}

/* Toast 全局层：必须高于 #modal-root，否则 Audio Intelligence 等全屏遮罩会盖住提示 */
#toast-root {
  position: relative;
  z-index: 100050;
  pointer-events: none;
}
#toast-root > * {
  pointer-events: auto;
}

.modal-box .block {
    display: block !important;
}

/* Modal overlay（须高于 .app-header 的 z-index: 11000，避免顶栏遮挡弹窗） */
.modal-mask {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.4);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 12000;
    animation: modalFadeIn 0.25s ease-out;
}

/* 导出主弹窗之上的二级说明（工程清单敬请期待） */
.export-manifest-soon-mask.modal-mask {
    z-index: 14000;
}

/* Phase2 启动前用户教育确认（盖在导出弹窗与工程清单之上） */
.export-phase2-preflight-mask.modal-mask {
    z-index: 15000;
}

@keyframes modalFadeIn {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}

/* Modal box */
.modal-box {
    background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
    border-radius: var(--orb-radius-xl, 1.25rem);
    max-width: 560px;
    width: 90%;
    max-height: 80vh;
    overflow-y: auto;
    box-shadow: var(--orb-shadow-lg, 0 18px 40px rgba(15, 23, 42, 0.16));
    animation: modalSlideIn 0.28s cubic-bezier(0.4, 0, 0.2, 1);
    position: relative;
    isolation: isolate;
}

/* 导出弹窗 v2：接近全宽面板、大留白 */
.modal-box.export-modal-shell {
    max-width: min(100vw - 0.5rem, 96rem);
    width: min(100vw - 0.5rem, 96rem);
    /* 勿设过高 min-height：会强迫整卡接近一屏高，用户只能长距离滚外层；高度随内容增长，由 max-height 封顶 */
    min-height: 0;
    max-height: 96vh;
    border-radius: 1.5rem;
    box-shadow: var(--orb-shadow-lg, 0 28px 90px rgba(15, 23, 42, 0.2)), 0 0 0 1px rgba(99, 102, 241, 0.06);
    display: flex;
    flex-direction: column;
}
.modal-box.export-modal-shell .export-modal-v2 { flex: 1; min-height: 0; display: flex; flex-direction: column; }
.modal-box.export-modal-shell .export-modal-body { flex: 1; min-height: 0; overflow-y: auto; }

 body.app-theme-dark .modal-box.export-modal-shell {
     box-shadow: 0 36px 120px rgba(0, 0, 0, 0.55), 0 0 0 1px rgba(255, 255, 255, 0.08);
 }

.export-modal-v2 .export-modal-header.modal-header {
    padding: 1.35rem 2rem 1.1rem;
    background: linear-gradient(180deg, rgba(99, 102, 241, 0.06) 0%, rgba(99, 102, 241, 0) 100%);
    border-bottom: 1px solid rgba(99, 102, 241, 0.1);
}
 body.app-theme-dark .export-modal-v2 .export-modal-header.modal-header {
     border-bottom-color: rgba(255, 255, 255, 0.08);
     background: linear-gradient(180deg, rgba(99, 102, 241, 0.1) 0%, transparent 100%);
 }
.export-modal-v2 .export-modal-title { font-size: 1.35rem; }
.export-modal-v2 .export-modal-sub { font-size: 0.88rem; margin-top: 0.35rem; }
.export-v2-rail-wrap { margin: 0 0 1.5rem; }
.export-v2-rail {
    display: flex; align-items: flex-start; justify-content: space-between; gap: 0.4rem; padding: 1rem 0.5rem 1.25rem;
    position: relative; border-bottom: 1px solid rgba(100, 116, 139, 0.15);
}
 body.app-theme-dark .export-v2-rail { border-bottom-color: rgba(255, 255, 255, 0.08); }
.export-v2-rail-seg { flex: 1; min-width: 0; text-align: center; position: relative; z-index: 1; }
.export-v2-rail-node {
    width: 2.75rem; height: 2.75rem; border-radius: 50%; margin: 0 auto 0.4rem; display: flex; align-items: center; justify-content: center;
    font-size: 0.8rem; font-weight: 800; font-variant-numeric: tabular-nums; transition: background 0.2s, color 0.2s, box-shadow 0.2s;
    background: #e2e8f0; color: #64748b; box-shadow: inset 0 0 0 1px rgba(15, 23, 42, 0.08);
}
 body.app-theme-dark .export-v2-rail-node { background: rgba(255,255,255,0.08); color: #94a3b8; }
.export-v2-rail--completed .export-v2-rail-node { background: linear-gradient(135deg, #10b981, #14b8a6); color: #fff; box-shadow: 0 6px 18px rgba(16, 185, 129, 0.35); }
.export-v2-rail--running .export-v2-rail-node { background: linear-gradient(135deg, #6366f1, #7c3aed); color: #fff; box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.25), 0 8px 22px rgba(99, 102, 241, 0.35); animation: exportV2NodePulse 2s ease-in-out infinite; }
.export-v2-rail--failed .export-v2-rail-node { background: linear-gradient(135deg, #f43f5e, #e11d48); color: #fff; }
.export-v2-rail--paused .export-v2-rail-node { background: linear-gradient(135deg, #f59e0b, #ea580c); color: #fff; box-shadow: 0 6px 18px rgba(245, 158, 11, 0.35); }
.export-v2-rail--paused .export-v2-rail-lbl { color: #c2410c; }
body.app-theme-dark .export-v2-rail--paused .export-v2-rail-lbl { color: #fcd34d; }
.export-v2-rail--pending .export-v2-rail-node { background: #e2e8f0; color: #94a3b8; }
 body.app-theme-dark .export-v2-rail--pending .export-v2-rail-node { background: rgba(255,255,255,0.06); }
.export-v2-rail--pending .export-v2-rail-lbl { color: #94a3b8; }
.export-v2-rail-lbl { font-size: 0.7rem; font-weight: 700; color: #0f172a; letter-spacing: 0.02em; }
 body.app-theme-dark .export-v2-rail-lbl { color: #e2e8f0; }
.export-v2-rail-subbar {
    margin: 0.35rem auto 0;
    max-width: 4.5rem;
    height: 0.22rem;
    border-radius: 9999px;
    background: rgba(148, 163, 184, 0.28);
    overflow: hidden;
}
body.app-theme-dark .export-v2-rail-subbar { background: rgba(255, 255, 255, 0.1); }
.export-v2-rail-subbar > div {
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, #6366f1, #22d3ee);
    transition: width 0.45s ease;
}
.export-v2-phase-hint {
    margin: 0.45rem 0 0;
    font-size: 0.72rem;
    font-weight: 600;
    color: #6366f1;
}
.export-v2-phase-hint-sub {
    display: block;
    margin-top: 0.15rem;
    font-size: 0.65rem;
    font-weight: 500;
    opacity: 0.85;
}
body.app-theme-dark .export-v2-phase-hint { color: #a5b4fc; }
.export-v2-rail--running .export-v2-rail-lbl { color: #4f46e5; }
 body.app-theme-dark .export-v2-rail--running .export-v2-rail-lbl { color: #a5b4fc; }
.export-v2-rail--completed .export-v2-rail-lbl { color: #047857; }
 body.app-theme-dark .export-v2-rail--completed .export-v2-rail-lbl { color: #6ee7b7; }
.export-v2-rail-connector { display: none; }
.export-v2-totalbar-outer { margin-top: 0.35rem; display: flex; align-items: center; gap: 0.9rem; }
.export-v2-totalbar { flex: 1; height: 0.5rem; border-radius: 9999px; background: rgba(148, 163, 184, 0.3); overflow: hidden; }
 body.app-theme-dark .export-v2-totalbar { background: rgba(255,255,255,0.1); }
.export-v2-totalbar > div { height: 100%; background: linear-gradient(90deg, #6366f1, #22d3ee); border-radius: 9999px; transition: width 0.45s ease; }
.export-v2-totalbar--active > div { animation: exportBarGlow 1.4s ease-in-out infinite; }
@keyframes exportBarGlow { 0%, 100% { filter: brightness(1); } 50% { filter: brightness(1.18); } }
.export-v2-totalbar-pct { font-size: 0.8rem; font-weight: 800; font-variant-numeric: tabular-nums; color: #4f46e5; min-width: 2.5rem; text-align: right; }
 body.app-theme-dark .export-v2-totalbar-pct { color: #a5b4fc; }
.export-gpu-hint { margin-top: 0.4rem; font-size: 0.72rem; line-height: 1.4; color: #64748b; width: 100%; }
 body.app-theme-dark .export-gpu-hint { color: #94a3b8; }
.export-gpu-hint .export-gpu-name { font-weight: 600; color: #475569; }
 body.app-theme-dark .export-gpu-hint .export-gpu-name { color: #cbd5e1; }
.export-gpu-hint .export-gpu-util { font-variant-numeric: tabular-nums; }
@keyframes exportV2NodePulse { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.04); } }
.export-v2-cols {
  display: grid;
  gap: 1.25rem;
  align-items: start;
}
@media (min-width: 960px) {
  .export-v2-cols--split {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 1.5rem;
    align-items: stretch;
  }
}
.export-v2-cols--done {
  max-width: 40rem;
  margin: 0 auto;
  grid-template-columns: 1fr;
}
.export-v2-pipeline,
.export-v2-bundle { min-width: 0; }
.export-v2-pipeline {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  height: 100%;
}
.export-v2-pipeline .export-pipeline-card {
  flex: 1;
  box-shadow: 0 10px 40px rgba(15, 23, 42, 0.08);
}
body.app-theme-dark .export-v2-pipeline .export-pipeline-card {
  box-shadow: 0 16px 50px rgba(0, 0, 0, 0.4);
}
.export-v2-bundle {
  display: flex;
  flex-direction: column;
  gap: 0.85rem;
  height: 100%;
  padding: 1.1rem 1.2rem 1.15rem;
  border-radius: 1.25rem;
  border: 1px solid rgba(148, 163, 184, 0.28);
  background:
    linear-gradient(180deg, rgba(248, 250, 252, 0.95) 0%, rgba(255, 255, 255, 0.92) 100%);
  box-shadow: 0 10px 40px rgba(15, 23, 42, 0.06);
}
body.app-theme-dark .export-v2-bundle {
  border-color: rgba(255, 255, 255, 0.1);
  background:
    linear-gradient(180deg, rgba(15, 23, 42, 0.72) 0%, rgba(2, 6, 23, 0.55) 100%);
  box-shadow: 0 16px 50px rgba(0, 0, 0, 0.35);
}
.export-v2-sidecap {
  font-size: 0.7rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.14em;
  color: #64748b;
  margin: 0 0 0.35rem;
}
body.app-theme-dark .export-v2-sidecap { color: #94a3b8; }
.export-v2-cols--split .export-tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (max-width: 640px) {
  .export-v2-cols--split .export-tiles { grid-template-columns: 1fr; }
  .export-v2-bundle { padding: 0.95rem 0.9rem 1rem; }
}
.export-v2-cta-wrap {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 0.75rem;
}
.export-bundle-cta {
  margin-top: auto;
  padding-top: 0.85rem;
  border-top: 1px solid rgba(148, 163, 184, 0.22);
}
body.app-theme-dark .export-bundle-cta {
  border-top-color: rgba(255, 255, 255, 0.08);
}
.export-v2-cta-wrap .export-cta {
  max-width: none;
  flex: 1 1 auto;
  width: 100%;
  margin: 0;
}
.export-v2-cta-wrap .modal-btn-secondary { min-width: 5.5rem; }

/* 主操作行：打包 CTA + 取消/暂停 */
.export-cta-primary-row {
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
  gap: 0.55rem;
}
.export-cta-primary-row .export-cta {
  flex: 1 1 12rem;
  min-height: 3.1rem;
  padding: 0.85rem 1.35rem;
  font-size: 0.98rem;
  border-radius: 0.85rem;
}
.export-cta-side-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.4rem;
  flex: 0 0 auto;
}
.export-cta-cancel {
  min-height: 2.55rem;
  padding: 0.55rem 1rem;
  font-size: 0.8rem;
  white-space: nowrap;
}
@media (min-width: 420px) {
  .export-cta-side-actions {
    align-self: center;
  }
}

/* 重跑：说明 + 短按钮 */
.export-cta-rerun {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.65rem 0.85rem;
  padding: 0.7rem 0.85rem;
  border-radius: 0.75rem;
  border: 1px solid rgba(167, 139, 250, 0.45);
  background: rgba(245, 243, 255, 0.85);
}
body.app-theme-dark .export-cta-rerun {
  border-color: rgba(139, 92, 246, 0.35);
  background: rgba(46, 16, 101, 0.28);
}
.export-cta-rerun-copy {
  flex: 1 1 12rem;
  min-width: 0;
}
.export-cta-rerun-title {
  margin: 0;
  font-size: 0.78rem;
  font-weight: 650;
  color: #5b21b6;
  line-height: 1.35;
}
body.app-theme-dark .export-cta-rerun-title { color: #ddd6fe; }
.export-cta-rerun-body {
  margin: 0.2rem 0 0;
  font-size: 0.7rem;
  line-height: 1.45;
  color: #6d28d9;
  opacity: 0.88;
}
body.app-theme-dark .export-cta-rerun-body { color: #c4b5fd; opacity: 0.95; }
.export-cta-rerun-btn {
  flex: 0 0 auto;
  margin-left: auto;
  padding: 0.45rem 0.85rem;
  border-radius: 0.55rem;
  font-size: 0.72rem;
  font-weight: 650;
  color: #5b21b6;
  background: rgba(255, 255, 255, 0.75);
  border: 1px solid rgba(139, 92, 246, 0.55);
  cursor: pointer;
  white-space: nowrap;
  transition: background 0.15s, border-color 0.15s;
}
body.app-theme-dark .export-cta-rerun-btn {
  color: #e9d5ff;
  background: rgba(76, 29, 149, 0.35);
  border-color: rgba(167, 139, 250, 0.45);
}
.export-cta-rerun-btn:hover:not(:disabled) {
  background: rgba(139, 92, 246, 0.12);
  border-color: rgba(109, 40, 217, 0.7);
}
.export-cta-rerun-btn:disabled {
  opacity: 0.45;
  cursor: not-allowed;
}

/* 偏好开关网格 */
.export-cta-prefs {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.5rem;
}
.export-cta-prefs--single {
  grid-template-columns: 1fr;
}
@media (max-width: 520px) {
  .export-cta-prefs { grid-template-columns: 1fr; }
}
.export-cta-pref {
  display: flex;
  align-items: flex-start;
  gap: 0.45rem;
  margin: 0;
  padding: 0.55rem 0.65rem;
  border-radius: 0.65rem;
  font-size: 0.72rem;
  line-height: 1.45;
  cursor: pointer;
  border: 1px solid rgba(203, 213, 225, 0.95);
  color: #475569;
  background: rgba(248, 250, 252, 0.9);
  min-width: 0;
}
body.app-theme-dark .export-cta-pref {
  border-color: rgba(255, 255, 255, 0.12);
  color: #94a3b8;
  background: rgba(15, 23, 42, 0.35);
}
.export-cta-pref--on {
  border-color: rgba(99, 102, 241, 0.45);
  color: #334155;
  background: rgba(238, 242, 255, 0.75);
}
body.app-theme-dark .export-cta-pref--on {
  border-color: rgba(129, 140, 248, 0.45);
  color: #cbd5e1;
  background: rgba(49, 46, 129, 0.28);
}
.export-cta-pref--zip.export-cta-pref--on {
  border-color: rgba(16, 185, 129, 0.55);
  color: #047857;
  background: rgba(16, 185, 129, 0.09);
}
body.app-theme-dark .export-cta-pref--zip.export-cta-pref--on {
  border-color: rgba(52, 211, 153, 0.5);
  color: #6ee7b7;
  background: rgba(16, 185, 129, 0.14);
}
.export-cta-pref-cb {
  margin-top: 0.1rem;
  flex-shrink: 0;
  accent-color: #6366f1;
}
.export-cta-pref--zip .export-cta-pref-cb { accent-color: #10b981; }
.export-cta-pref-text { min-width: 0; word-break: break-word; }
.export-cta-pref-email {
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 0.68rem;
  color: #5b21b6;
  word-break: break-all;
}
body.app-theme-dark .export-cta-pref-email { color: #c4b5fd; }

.export-cta-support {
  margin: 0;
  padding-top: 0.55rem;
  border-top: 1px solid rgba(148, 163, 184, 0.22);
  text-align: center;
}
body.app-theme-dark .export-cta-support {
  border-top-color: rgba(255, 255, 255, 0.08);
}
.export-cta-support-link {
  font-size: 0.8rem;
  font-weight: 600;
  color: #0369a1;
  text-decoration: none;
}
.export-cta-support-link:hover { color: #0c4a6e; text-decoration: underline; }
body.app-theme-dark .export-cta-support-link { color: #38bdf8; }
body.app-theme-dark .export-cta-support-link:hover { color: #7dd3fc; }

/* 主操作：右侧「下载与格式」栏，字幕格式 / ZIP / 音频选项下方（与旧底栏对齐） */
.export-bundle-cta.export-v2-cta-wrap { justify-content: flex-start; }

.export-modal-header.modal-header {
    padding: 1.25rem 1.75rem 1rem;
    align-items: flex-start;
    gap: 0.75rem;
}
.export-modal-hero-titles { flex: 1; min-width: 0; }
.export-modal-title-row { flex-wrap: wrap; align-items: flex-start; }
.export-modal-hero-txt { min-width: 0; }

.export-modal-title-ico {
    border-radius: 0.75rem;
    background: linear-gradient(135deg, #6366f1 0%, #7c3aed 55%, #a855f7 100%);
    box-shadow: 0 6px 20px rgba(99, 102, 241, 0.35);
}

.export-modal-title {
    font-size: 1.2rem;
    font-weight: 700;
    letter-spacing: -0.02em;
    color: #0f172a;
    line-height:1.2;
}
 body.app-theme-dark .export-modal-title {
     color: rgba(248, 250, 252, 0.95);
 }
.export-modal-sub {
    font-size: 0.8rem;
    color: #64748b;
    margin-top: 0.2rem;
    font-weight: 500;
}
 body.app-theme-dark .export-modal-sub {
     color: rgba(148, 163, 184, 0.9);
 }
.export-modal-body {
    padding: 0.75rem 1.75rem 1.5rem;
}
.export-modal-v2 .export-modal-body {
    padding: 1.1rem 2rem 1.5rem;
}
@media (max-width: 640px) {
  .export-modal-v2 .export-modal-body { padding: 0.9rem 1rem 1.1rem; }
}
.export-hero {
    position: relative;
    border-radius: 1.25rem;
    padding: 1.25rem 1.5rem;
    overflow: hidden;
    border: 1px solid rgba(16, 185, 129, 0.25);
    background: linear-gradient(130deg, rgba(16, 185, 129, 0.1) 0%, rgba(45, 212, 191, 0.08) 45%, rgba(99, 102, 241, 0.06) 100%);
}
 body.app-theme-dark .export-hero {
     border-color: rgba(52, 211, 153, 0.28);
     background:
         radial-gradient(520px 200px at 10% 0%, rgba(52, 211, 153, 0.18), transparent 60%),
         linear-gradient(145deg, rgba(2, 6, 23, 0.55) 0%, rgba(2, 6, 23, 0.35) 100%);
 }

/* 完成态就绪条：替代厚重 export-hero + 合规嵌套卡 */
.export-ready-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.85rem 1.25rem;
  flex-wrap: wrap;
  padding: 0.7rem 0.95rem;
  border-radius: 0.75rem;
  border: 1px solid rgba(15, 23, 42, 0.08);
  background: rgba(248, 250, 252, 0.92);
}
body.app-theme-dark .export-ready-bar {
  border-color: rgba(148, 163, 184, 0.18);
  background: rgba(15, 23, 42, 0.55);
}
.export-ready-bar-main {
  display: flex;
  align-items: flex-start;
  gap: 0.7rem;
  min-width: 0;
  flex: 1 1 14rem;
}
.export-ready-bar-mark {
  width: 1.75rem;
  height: 1.75rem;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  margin-top: 0.05rem;
  color: #0f766e;
  background: rgba(45, 212, 191, 0.18);
}
body.app-theme-dark .export-ready-bar-mark {
  color: #5eead4;
  background: rgba(45, 212, 191, 0.14);
}
.export-ready-bar-title {
  font-size: 0.92rem;
  font-weight: 650;
  letter-spacing: -0.01em;
  color: #0f172a;
  line-height: 1.3;
}
body.app-theme-dark .export-ready-bar-title { color: #f1f5f9; }
.export-ready-bar-hint {
  margin: 0.2rem 0 0;
  font-size: 0.75rem;
  line-height: 1.45;
  color: #64748b;
}
body.app-theme-dark .export-ready-bar-hint { color: #94a3b8; }
.export-ready-bar-note {
  margin: 0.35rem 0 0;
  font-size: 0.72rem;
  line-height: 1.45;
  color: #92400e;
}
body.app-theme-dark .export-ready-bar-note { color: #fcd34d; }
.export-ready-bar-remix {
  appearance: none;
  border: 1px solid rgba(15, 23, 42, 0.1);
  background: #fff;
  color: #334155;
  font-size: 0.72rem;
  font-weight: 560;
  line-height: 1.2;
  padding: 0.45rem 0.75rem;
  border-radius: 999px;
  cursor: pointer;
  white-space: nowrap;
  flex-shrink: 0;
}
.export-ready-bar-remix:hover:not(:disabled) {
  border-color: rgba(15, 23, 42, 0.18);
  background: #f8fafc;
}
.export-ready-bar-remix:disabled {
  opacity: 0.55;
  cursor: not-allowed;
}
body.app-theme-dark .export-ready-bar-remix {
  background: rgba(30, 41, 59, 0.85);
  border-color: rgba(148, 163, 184, 0.22);
  color: #e2e8f0;
}
body.app-theme-dark .export-ready-bar-remix:hover:not(:disabled) {
  background: rgba(51, 65, 85, 0.9);
}
.export-hero-glow {
    position: absolute;
    inset: -40% 40% auto -20%;
    height: 200px;
    background: radial-gradient(circle, rgba(16, 185, 129, 0.22) 0%, transparent 70%);
    pointer-events: none;
}
.export-hero-row { display: flex; gap: 1rem; align-items: flex-start; position: relative; z-index: 1; }
.export-hero-icon {
    width: 3.25rem;
    height: 3.25rem;
    border-radius: 1rem;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(16, 185, 129, 0.2);
    color: #059669;
    flex-shrink: 0;
}
 body.app-theme-dark .export-hero-icon { color: #6ee7b7; }
.export-hero-h { font-size: 1.1rem; font-weight: 700; color: #064e3b; margin: 0; }
 body.app-theme-dark .export-hero-h { color: rgba(209, 250, 229, 0.95); }
.export-hero-p { font-size: 0.8rem; color: #0f766e; margin: 0.4rem 0 0; line-height: 1.5; }
 body.app-theme-dark .export-hero-p { color: rgba(204, 251, 241, 0.85); }
.export-hero-hint { font-size: 0.72rem; color: #64748b; margin: 0.75rem 0 0; line-height: 1.45; }
 body.app-theme-dark .export-hero-hint { color: rgba(148, 163, 184, 0.9); }
.export-hero-bullets { list-style: none; padding: 0; margin: 0.5rem 0 0; }
.export-hero-langguide {
    margin-top: 0.85rem;
    padding: 0.75rem 0.9rem;
    border-radius: 0.75rem;
    background: rgba(99, 102, 241, 0.08);
    border: 1px solid rgba(99, 102, 241, 0.22);
}
 body.app-theme-dark .export-hero-langguide {
    background: rgba(99, 102, 241, 0.12);
    border-color: rgba(129, 140, 248, 0.28);
}
.export-hero-langguide-cap { font-size: 0.65rem; font-weight: 800; letter-spacing: 0.12em; text-transform: uppercase; color: #6366f1; margin-bottom: 0.35rem; }
 body.app-theme-dark .export-hero-langguide-cap { color: #a5b4fc; }
.export-hero-langguide-p { font-size: 0.8rem; line-height: 1.45; color: #334155; margin: 0.25rem 0 0; }
 body.app-theme-dark .export-hero-langguide-p { color: #e2e8f0; }

/* 合规提示样式 */
.export-compliance-hint {
    margin-top: 0.75rem;
    padding: 0.75rem 1rem;
    border-radius: 0.5rem;
    font-size: 0.8rem;
    line-height: 1.5;
}
.export-compliance-hint--info {
    background: rgba(34, 197, 94, 0.08);
    border: 1px solid rgba(34, 197, 94, 0.25);
    color: #166534;
}
body.app-theme-dark .export-compliance-hint--info {
    background: rgba(34, 197, 94, 0.1);
    border-color: rgba(34, 197, 94, 0.3);
    color: #86efac;
}
.export-compliance-hint--warning {
    background: rgba(234, 179, 8, 0.08);
    border: 1px solid rgba(234, 179, 8, 0.3);
    color: #854d0e;
}
body.app-theme-dark .export-compliance-hint--warning {
    background: rgba(234, 179, 8, 0.1);
    border-color: rgba(234, 179, 8, 0.35);
    color: #fde047;
}
.export-compliance-hint-header {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 0.35rem;
}
.export-compliance-hint-icon { font-size: 1rem; }
.export-compliance-hint-title {
    font-weight: 600;
    font-size: 0.85rem;
}
.export-compliance-hint-content { margin: 0.25rem 0 0; }
.export-compliance-hint-suggestion {
    margin: 0.4rem 0 0;
    font-size: 0.75rem;
    opacity: 0.85;
}
.export-compliance-copy-btn {
    padding: 0.3rem 0.75rem;
    border-radius: 0.4rem;
    font-size: 0.75rem;
    font-weight: 500;
    border: 1px solid currentColor;
    background: transparent;
    cursor: pointer;
    opacity: 0.8;
    transition: opacity 0.2s;
}
.export-compliance-copy-btn:hover { opacity: 1; }

.export-bundle-topnote {
    font-size: 0.75rem;
    line-height: 1.45;
    color: #64748b;
    margin: 0 0 0.75rem;
    padding: 0.5rem 0.65rem;
    border-radius: 0.5rem;
    background: rgba(148, 163, 184, 0.12);
}
 body.app-theme-dark .export-bundle-topnote { color: #94a3b8; background: rgba(255,255,255,0.04); }
.export-remix-btn {
    margin-top: 0.9rem;
    width: 100%;
    max-width: 20rem;
    padding: 0.55rem 1rem;
    border-radius: 0.75rem;
    font-size: 0.8rem;
    font-weight: 600;
    border: 1px solid rgba(15, 23, 42, 0.12);
    background: rgba(255, 255, 255, 0.75);
    color: #0f172a;
    cursor: pointer;
    transition: background 0.2s, box-shadow 0.2s;
}
 body.app-theme-dark .export-remix-btn {
     background: rgba(2, 6, 23, 0.45);
     border-color: rgba(255, 255, 255, 0.12);
     color: #e2e8f0;
 }
.export-remix-btn:hover:not(:disabled) { box-shadow: 0 4px 16px rgba(0,0,0,0.08); }
.export-remix-btn:disabled { opacity: 0.55; cursor: not-allowed; }

.export-result-preview-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 0.5rem 1rem;
    border-radius: 0.75rem;
    font-size: 0.8rem;
    font-weight: 600;
    border: 1px solid rgba(99, 102, 241, 0.35);
    background: rgba(99, 102, 241, 0.08);
    color: #4338ca;
    cursor: pointer;
    transition: all 0.15s;
}
.export-result-preview-btn:hover {
    background: rgba(99, 102, 241, 0.14);
    border-color: rgba(99, 102, 241, 0.50);
}
body.app-theme-dark .export-result-preview-btn {
    color: #a5b4fc;
    background: rgba(99, 102, 241, 0.12);
    border-color: rgba(99, 102, 241, 0.30);
}
body.app-theme-dark .export-result-preview-btn:hover {
    background: rgba(99, 102, 241, 0.20);
}

.export-modal-grid {
    display: grid;
    gap: 1.5rem;
    align-items: start;
}
@media (min-width: 1024px) {
    .export-modal-grid:not(.export-modal-grid--single) {
        grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr);
        gap: 2rem;
    }
    .export-modal-grid--single {
        grid-template-columns: minmax(0, 1fr);
        max-width: 36rem;
        margin-left: auto;
        margin-right: auto;
    }
}
.export-now-what {
    margin-top: 0.9rem;
    padding: 0.75rem 0.9rem;
    border-radius: 0.75rem;
    background: rgba(99, 102, 241, 0.06);
    border: 1px solid rgba(99, 102, 241, 0.12);
}
 body.app-theme-dark .export-now-what {
     background: rgba(99, 102, 241, 0.1);
     border-color: rgba(99, 102, 241, 0.18);
 }
.export-now-what-lab { font-size: 0.68rem; text-transform: uppercase; letter-spacing: 0.1em; color: #4f46e5; font-weight: 700; }
 body.app-theme-dark .export-now-what-lab { color: #a5b4fc; }
.export-now-what-txt { font-size: 0.8rem; color: #0f172a; margin: 0.2rem 0 0; line-height: 1.45; }
 body.app-theme-dark .export-now-what-txt { color: #e2e8f0; }
.export-now-what-hint { font-size: 0.72rem; color: #64748b; margin: 0.5rem 0 0; line-height: 1.45; }
 body.app-theme-dark .export-now-what-hint { color: rgba(148, 163, 184, 0.9); }
.export-artifact-hint { margin-top: 0.75rem; font-size: 0.72rem; line-height: 1.4; color: #475569; }
 body.app-theme-dark .export-artifact-hint { color: #94a3b8; }
.export-artifact-path { font-family: ui-monospace, monospace; font-size: 0.7rem; word-break: break-all; display: block; }

.export-pipeline-card {
    border-radius: 1.25rem;
    border: 1px solid rgba(99, 102, 241, 0.12);
    background: linear-gradient(180deg, rgba(248, 250, 252, 0.9) 0%, rgba(241, 245, 249, 0.5) 100%);
    padding: 1.15rem 1.2rem 1.25rem;
    box-shadow: 0 8px 32px rgba(15, 23, 42, 0.04);
    display: flex;
    flex-direction: column;
    min-height: min(34vh, 24rem);
}
body.app-theme-dark .export-pipeline-card {
    background:
        linear-gradient(180deg, rgba(2, 6, 23, 0.55) 0%, rgba(2, 6, 23, 0.35) 100%);
    border-color: rgba(255, 255, 255, 0.1);
    box-shadow: 0 16px 50px rgba(0, 0, 0, 0.3);
}
.export-pipeline-head { margin-bottom: 0.15rem; }
.export-pipeline-eyebrow { font-size: 0.65rem; text-transform: uppercase; letter-spacing: 0.12em; color: #64748b; font-weight: 600; margin: 0; }
body.app-theme-dark .export-pipeline-eyebrow { color: rgba(148, 163, 184, 0.8); }
.export-pipeline-top { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; }
.export-pipeline-status { font-size: 0.84rem; font-weight: 600; color: #0f172a; margin: 0.15rem 0 0; line-height: 1.45; }
body.app-theme-dark .export-pipeline-status { color: #e2e8f0; }
.export-pipeline-status-sub { color: #64748b; font-weight: 500; }
body.app-theme-dark .export-pipeline-status-sub { color: #94a3b8; }
.export-pipeline-policy {
  margin: 0.55rem 0 0;
  font-size: 0.72rem;
  line-height: 1.45;
  color: #92400e;
}
body.app-theme-dark .export-pipeline-policy { color: rgba(253, 230, 138, 0.9); }
.export-pipeline-policy--info { color: #4338ca; }
body.app-theme-dark .export-pipeline-policy--info { color: rgba(165, 180, 252, 0.95); }
.export-pipeline-policy--muted { color: #64748b; font-size: 0.68rem; }
body.app-theme-dark .export-pipeline-policy--muted { color: #94a3b8; }
.export-log-wrap { margin-top: auto; }
.export-pct-ring {
    position: relative;
    width: 3.1rem;
    height: 3.1rem;
    border-radius: 50%;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 3px;
    background: conic-gradient(
        from -90deg,
        #6366f1 0deg,
        #22d3ee calc(var(--export-pct, 0) * 3.6deg),
        rgba(148, 163, 184, 0.22) calc(var(--export-pct, 0) * 3.6deg),
        rgba(148, 163, 184, 0.22) 360deg
    );
    box-shadow: 0 4px 16px rgba(99, 102, 241, 0.35);
    transition: background 0.45s ease;
}
body.app-theme-dark .export-pct-ring {
    background: conic-gradient(
        from -90deg,
        #6366f1 0deg,
        #22d3ee calc(var(--export-pct, 0) * 3.6deg),
        rgba(255, 255, 255, 0.12) calc(var(--export-pct, 0) * 3.6deg),
        rgba(255, 255, 255, 0.12) 360deg
    );
}
.export-pct-num {
    min-width: 0;
    width: 100%;
    height: 100%;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #fff;
    font-size: 0.8rem;
    font-weight: 800;
    color: #4f46e5;
    font-variant-numeric: tabular-nums;
    box-shadow: inset 0 0 0 1px rgba(99, 102, 241, 0.12);
    line-height: 1;
}
 body.app-theme-dark .export-pct-num {
     background: #0f172a;
     color: #a5b4fc;
     box-shadow: inset 0 0 0 1px rgba(99, 102, 241, 0.3);
 }
.export-pct-sym { font-size: 0.45rem; font-weight: 700; opacity: 0.75; margin-left: 0.08rem; align-self: flex-start; margin-top: 0.15rem; }

.export-pipeline-bar { height: 0.4rem; border-radius: 9999px; background: rgba(148, 163, 184, 0.3); margin-top: 1rem; overflow: hidden; }
 body.app-theme-dark .export-pipeline-bar { background: rgba(255, 255, 255, 0.08); }
.export-pipeline-bar-fill {
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, #6366f1, #8b5cf6, #22d3ee);
    transition: width 0.45s ease;
    box-shadow: 0 0 16px rgba(99, 102, 241, 0.4);
}

.export-timeline { list-style: none; margin: 1.25rem 0 0; padding: 0; display: flex; flex-direction: column; gap: 0; }
.export-timeline-item { display: flex; gap: 0.65rem; padding: 0.45rem 0; position: relative; }
.export-timeline-item::before {
    content: '';
    position: absolute;
    left: 0.4rem; top: 1.4rem; bottom: -0.3rem; width: 2px;
    background: linear-gradient(180deg, rgba(99, 102, 241, 0.35), rgba(99, 102, 241, 0.05));
    border-radius: 2px;
}
.export-timeline-item:last-child::before { display: none; }
.export-timeline-dot {
    width: 0.85rem; height: 0.85rem; border-radius: 50%; margin-top: 0.2rem; flex-shrink: 0;
    background: #cbd5e1; border: 2px solid #e2e8f0; z-index: 1;
}
.export-timeline-item[data-state="running"] .export-timeline-dot {
    background: #6366f1; border-color: #c7d2fe; box-shadow: 0 0 0 4px rgba(99, 102, 241, 0.2);
    animation: exportDotPulse 1.4s ease-in-out infinite;
}
.export-timeline-item[data-state="completed"] .export-timeline-dot { background: #10b981; border-color: #6ee7b7; }
.export-timeline-item[data-state="failed"] .export-timeline-dot { background: #ef4444; border-color: #fecaca; }
@keyframes exportDotPulse { 0%, 100% { box-shadow: 0 0 0 0 rgba(99, 102, 241, 0.35); } 50% { box-shadow: 0 0 0 6px rgba(99, 102, 241, 0.12); } }

.export-timeline-title { font-size: 0.8rem; font-weight: 600; color: #334155; }
 body.app-theme-dark .export-timeline-title { color: #e2e8f0; }
.export-timeline-msg { font-size: 0.72rem; color: #64748b; margin-top: 0.15rem; line-height: 1.4; max-height: 7em; overflow-y: auto; }
 body.app-theme-dark .export-timeline-msg { color: #94a3b8; }

.export-hint-below { font-size: 0.7rem; color: #94a3b8; line-height: 1.5; margin: 0.75rem 0 0; }
 body.app-theme-dark .export-hint-below { color: #64748b; }

.export-log-h { font-size: 0.65rem; text-transform: uppercase; letter-spacing: 0.1em; color: #94a3b8; font-weight: 600; margin: 1.1rem 0 0.4rem; }
.export-log-box {
    font-family: ui-monospace, 'JetBrains Mono', 'Cascadia Code', Consolas, monospace;
    font-size: 0.72rem;
    line-height: 1.6;
    min-height: 10rem;
    max-height: min(46vh, 30rem);
    overflow-y: auto;
    padding: 0.65rem 0.85rem;
    border-radius: 0.65rem;
    background: #0b1220;
    border: 1px solid rgba(99, 102, 241, 0.2);
    box-shadow: inset 0 0 0 1px rgba(0,0,0,0.2);
}
 body.app-theme-light .export-log-box {
     background: #f1f5f9;
     border-color: rgba(15, 23, 42, 0.1);
 }
.export-log-line { white-space: pre-wrap; word-break: break-word; }
.export-log-line--ok { color: #34d399; }
.export-log-line--err { color: #f87171; }
.export-log-line--dim { color: #94a3b8; }
 body.app-theme-light .export-log-line--dim { color: #64748b; }
 body.app-theme-light .export-log-line--ok { color: #047857; }

.export-alert { display: flex; gap: 0.75rem; padding: 0.9rem 1rem; border-radius: 1rem; margin-bottom: 1rem; }
.export-alert--danger { background: rgba(254, 226, 226, 0.85); border: 1px solid rgba(248, 113, 113, 0.4); }
 body.app-theme-dark .export-alert--danger { background: rgba(127, 29, 29, 0.3); border-color: rgba(248, 113, 113, 0.32); }
.export-alert--warn { background: rgba(254, 243, 199, 0.85); border: 1px solid rgba(251, 191, 36, 0.45); }
 body.app-theme-dark .export-alert--warn { background: rgba(120, 53, 15, 0.35); border-color: rgba(251, 191, 36, 0.28); }
.export-alert-ico { flex-shrink: 0; }
.export-alert--danger .export-alert-ico { color: #dc2626; }
.export-alert--warn .export-alert-ico { color: #d97706; }
.export-alert-title { font-size: 0.8rem; font-weight: 700; color: #0f172a; }
 body.app-theme-dark .export-alert-title { color: #f1f5f9; }
.export-alert-msg { font-size: 0.75rem; margin: 0.2rem 0 0; color: #334155; line-height: 1.45; }
 body.app-theme-dark .export-alert-msg { color: #cbd5e1; }
.export-alert-btn {
    margin-top: 0.5rem; padding: 0.4rem 0.9rem; font-size: 0.75rem; font-weight: 600; border-radius: 0.5rem;
    border: none; background: #dc2626; color: #fff; cursor: pointer;
}
.export-alert-btn:disabled { opacity: 0.55; cursor: not-allowed; }
.export-alert-btn--secondary {
    background: #fff; color: #b45309; border: 1px solid #fbbf24;
}
body.app-theme-dark .export-alert-btn--secondary {
    background: rgba(0,0,0,0.25); color: #fcd34d; border-color: rgba(251, 191, 36, 0.45);
}

.export-live { margin-top: 1rem; }
.export-live-h { font-size: 0.65rem; text-transform: uppercase; letter-spacing: 0.08em; color: #94a3b8; font-weight: 600; margin: 0 0 0.4rem; }
.export-live-scroll { max-height: 7rem; overflow-y: auto; display: flex; flex-direction: column; gap: 0.5rem; }
.export-live-block { border-radius: 0.5rem; padding: 0.4rem 0.5rem; background: rgba(2, 6, 23, 0.04); border: 1px solid rgba(148, 163, 184, 0.2); }
 body.app-theme-dark .export-live-block { background: rgba(0,0,0,0.2); }
.export-live-meta { display: flex; justify-content: space-between; gap: 0.5rem; font-size: 0.65rem; font-weight: 600; color: #334155; }
 body.app-theme-dark .export-live-meta { color: #e2e8f0; }
.export-live-time { color: #64748b; font-variant-numeric: tabular-nums; margin-right: 0.4rem; flex-shrink: 0; }
.export-live-row {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    gap: 0.15rem 0.35rem;
    margin-top: 0.25rem;
}
.export-live-text { font-size: 0.7rem; color: #475569; flex: 1 1 8rem; min-width: 0; display: -webkit-box; -webkit-line-clamp: 5; line-clamp: 5; -webkit-box-orient: vertical; overflow: hidden; line-height: 1.45; }
 body.app-theme-dark .export-live-text { color: #cbd5e1; }
.export-live-row--leak .export-live-text {
    color: #a16207;
    font-style: italic;
    opacity: 0.95;
}
 body.app-theme-dark .export-live-row--leak .export-live-text { color: #fbbf24; }
.export-live-leak {
    display: inline-flex;
    align-items: center;
    flex-shrink: 0;
    font-size: 0.55rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    padding: 0.1rem 0.28rem;
    border-radius: 0.25rem;
    margin-left: 0.25rem;
    vertical-align: middle;
    color: #92400e;
    background: rgba(245, 158, 11, 0.22);
    border: 1px solid rgba(180, 83, 9, 0.35);
}
 body.app-theme-dark .export-live-leak {
     color: #fef3c7;
     background: rgba(120, 53, 15, 0.55);
     border-color: rgba(251, 191, 36, 0.4);
 }
.export-live-row--leak { align-items: flex-start; }
.export-audio-chips { display: flex; flex-wrap: wrap; gap: 0.35rem; }
.export-audio-chip { display: inline-flex; align-items: center; gap: 0.4rem; font-size: 0.68rem; padding: 0.3rem 0.55rem; border-radius: 0.4rem; background: rgba(99, 102, 241, 0.1); color: #4338ca; max-width: 100%; }
 body.app-theme-dark .export-audio-chip { color: #c7d2fe; background: rgba(99, 102, 241, 0.2); }
.export-audio-pulse { width: 0.4rem; height: 0.4rem; border-radius: 50%; background: #22d3ee; animation: exportAudioPulse 1.2s ease-in-out infinite; }
@keyframes exportAudioPulse { 0%, 100% { opacity: 0.3; } 50% { opacity: 1; } }

.export-langs { display: flex; flex-wrap: wrap; gap: 0.35rem; margin-top: 0.75rem; }
.export-langs--tight { margin-top: 0; gap: 0.28rem; }
.export-lang-pill { font-size: 0.65rem; padding: 0.2rem 0.55rem; border-radius: 9999px; background: rgba(16, 185, 129, 0.12); color: #047857; font-weight: 600; }
body.app-theme-dark .export-lang-pill { color: #6ee7b7; }

/* 流水线卡片：语种 / 音频 — 外层卡片 + 双列 + 内层卡片 + 可滚动 */
.export-pl-wrap { margin-top: 0.85rem; }
.export-pl-cap-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  margin-bottom: 0.35rem;
}
.export-pl-cap-row .export-pl-cap { margin-bottom: 0; }
.export-pl-lang-select {
  font-size: 0.65rem;
  font-weight: 600;
  padding: 0.28rem 0.5rem;
  border-radius: 0.45rem;
  border: 1px solid rgba(148, 163, 184, 0.45);
  background: rgba(255, 255, 255, 0.95);
  color: #334155;
  max-width: 100%;
  min-width: min(100%, 11rem);
  cursor: pointer;
}
body.app-theme-dark .export-pl-lang-select {
  border-color: rgba(71, 85, 105, 0.75);
  background: rgba(30, 41, 59, 0.88);
  color: #e2e8f0;
}
.export-pl-card--flat { padding: 0.4rem 0.55rem; }
.export-pl-cap {
  font-size: 0.65rem;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: #94a3b8;
  font-weight: 600;
  margin: 0 0 0.35rem;
}
body.app-theme-dark .export-pl-cap { color: #94a3b8; }
.export-pl-card {
  border-radius: 0.65rem;
  border: 1px solid rgba(148, 163, 184, 0.35);
  background: rgba(248, 250, 252, 0.75);
  padding: 0.45rem 0.5rem;
}
body.app-theme-dark .export-pl-card {
  border-color: rgba(71, 85, 105, 0.55);
  background: rgba(15, 23, 42, 0.35);
}
.export-pl-scroll {
  max-height: min(44vh, 24rem);
  overflow-y: auto;
  overscroll-behavior: contain;
  padding: 0.1rem 0.05rem;
}
.export-pl-scroll--subtitle {
  max-height: min(52vh, 28rem);
}
.export-pl-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.45rem;
  align-items: start;
}
@media (max-width: 520px) {
  .export-pl-grid { grid-template-columns: 1fr; }
}
.export-pl-cell-inner {
  border-radius: 0.5rem;
  border: 1px solid rgba(148, 163, 184, 0.28);
  background: rgba(255, 255, 255, 0.92);
  padding: 0.35rem 0.4rem;
  min-width: 0;
}
body.app-theme-dark .export-pl-cell-inner {
  border-color: rgba(51, 65, 85, 0.65);
  background: rgba(30, 41, 59, 0.55);
}
.export-pl-cell-head {
  display: flex;
  align-items: flex-start;
  gap: 0.35rem;
  cursor: pointer;
  font-size: 0.65rem;
  font-weight: 600;
  color: #334155;
  min-width: 0;
}
body.app-theme-dark .export-pl-cell-head { color: #e2e8f0; }
.export-pl-cell-head--static { cursor: default; }
.export-pl-cb {
  width: 0.85rem;
  height: 0.85rem;
  margin-top: 0.08rem;
  flex-shrink: 0;
  accent-color: #6366f1;
  cursor: pointer;
}
.export-pl-cell-titles {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.1rem;
  min-width: 0;
  flex: 1 1 auto;
}
.export-pl-cell-titles .export-live-name { font-size: 0.62rem; font-weight: 600; color: #475569; }
body.app-theme-dark .export-pl-cell-titles .export-live-name { color: #cbd5e1; }
.export-pl-cell-titles .export-live-lang {
  font-size: 0.58rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: #64748b;
}
body.app-theme-dark .export-pl-cell-titles .export-live-lang { color: #94a3b8; }
.export-pl-audio-row {
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  gap: 0.35rem;
  width: 100%;
}
.export-pl-cell-body {
  margin-top: 0.35rem;
  /* 原 5.5rem≈88px 过矮，实时字幕多行易被裁切；略增高便于扫读 */
  max-height: min(14rem, 42vh);
  overflow-y: auto;
  overscroll-behavior: contain;
  padding-top: 0.25rem;
  border-top: 1px solid rgba(148, 163, 184, 0.2);
}
/* 实时字幕：全部段落在卡片内展示，由外层 .export-pl-scroll 统一滚动 */
.export-pl-subtitle-list {
  max-height: none;
  overflow: visible;
  padding-top: 0.35rem;
}
.export-pl-subtitle-list .export-live-row {
  padding: 0.2rem 0;
  border-bottom: 1px solid rgba(148, 163, 184, 0.12);
}
.export-pl-subtitle-list .export-live-row:last-child {
  border-bottom: none;
}
.export-pl-subtitle-list .export-live-text {
  display: block;
  overflow: visible;
  -webkit-line-clamp: unset;
  line-clamp: unset;
  white-space: pre-wrap;
  word-break: break-word;
}
body.app-theme-dark .export-pl-subtitle-list .export-live-row {
  border-bottom-color: rgba(51, 65, 85, 0.45);
}
body.app-theme-dark .export-pl-cell-body { border-top-color: rgba(51, 65, 85, 0.55); }
.export-pl-audio-sub { max-height: none; border-top: none; padding-top: 0.15rem; }
.export-pl-done-cell {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  gap: 0.35rem;
  border-radius: 0.5rem;
  border: 1px solid rgba(16, 185, 129, 0.28);
  background: rgba(16, 185, 129, 0.06);
  padding: 0.35rem 0.45rem;
  cursor: pointer;
  min-width: 0;
  font-size: 0.68rem;
  font-weight: 600;
  color: #047857;
}
body.app-theme-dark .export-pl-done-cell {
  border-color: rgba(52, 211, 153, 0.35);
  background: rgba(6, 78, 59, 0.25);
  color: #6ee7b7;
}
.export-pl-done-cell .export-pl-cb { margin-top: 0.06rem; }
.export-pl-done-stack { display: flex; flex-direction: column; gap: 0.08rem; min-width: 0; flex: 1; }
.export-pl-done-lab { line-height: 1.2; }
.export-pl-done-hint {
  font-size: 0.55rem;
  font-weight: 500;
  color: #64748b;
  line-height: 1.25;
}
body.app-theme-dark .export-pl-done-hint { color: #94a3b8; }

/* 进行中弱化打包选项区；勿对整个栏 pointer-events:none（会误伤「暂停克隆 / 停止并关闭」） */
.export-col--bundle.is-busy { opacity: 0.92; filter: grayscale(0.06); }
/* 底栏主操作行保持清晰对比，避免与上方发灰区混成一片 */
.export-col--bundle.is-busy .export-bundle-cta {
  filter: none;
  opacity: 1;
}
/* 「工程/清单」仅为说明入口，导出进行中也应可点开敬请期待弹窗 */
.export-col--bundle.is-busy .export-tiles .export-tile--project {
    pointer-events: auto;
    opacity: 1;
    filter: none;
}
.export-col--bundle.is-busy .export-tiles,
.export-col--bundle.is-busy .export-tile-extras,
.export-col--bundle.is-busy .export-lang-pick,
.export-col--bundle.is-busy .export-subgrid,
.export-col--bundle.is-busy .export-audio-row,
.export-col--bundle.is-busy .export-zip,
.export-col--bundle.is-busy .export-cta-prefs,
.export-col--bundle.is-busy .export-cta-rerun,
.export-col--bundle.is-busy .export-regen-advanced,
.export-col--bundle.is-busy .export-bundle-topnote {
  pointer-events: none;
  opacity: 0.58;
}
/* 导出「本次打包包含的语言」：每栏标题固定、列表区内滚动；外层灰卡不强行限高以免裁切「主轴」说明行 */
.export-lang-pick-card {
  min-height: 0;
  display: flex;
  flex-direction: column;
  overflow: visible;
}
.export-lang-pick-card > .export-lang-split-wrap {
  flex: 1 1 0%;
  min-height: 0;
  max-height: min(56vh, 30rem);
  overflow: hidden;
  display: flex;
  flex-direction: column;
}
.export-lang-split {
  min-height: 0;
  display: grid;
  grid-template-columns: 1fr;
  gap: 0.75rem;
  align-items: stretch;
}
@media (min-width: 640px) {
  .export-lang-split {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: stretch;
  }
}
.export-lang-col-panel {
  display: flex;
  flex-direction: column;
  min-height: 0;
  min-width: 0;
  max-height: min(48vh, 26rem);
  overflow: hidden;
}
@media (min-width: 640px) {
  .export-lang-col-panel {
    max-height: min(52vh, 28rem);
  }
}
.export-lang-col-panel .export-lang-col-scroll {
  flex: 1 1 0%;
  min-height: 0;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
}
/* 暂停克隆：在 is-busy 时打包区发灰，此按钮仍须显得「可点」 */
.export-pause-clone-btn {
    border: 1px solid rgba(245, 158, 11, 0.95);
    background: linear-gradient(180deg, rgba(254, 243, 199, 0.95), rgba(253, 230, 138, 0.75));
    color: #78350f;
    font-weight: 600;
    box-shadow: 0 1px 3px rgba(180, 83, 9, 0.15);
}
body.app-theme-dark .export-pause-clone-btn {
    border-color: rgba(251, 191, 36, 0.65);
    background: linear-gradient(180deg, rgba(120, 53, 15, 0.55), rgba(69, 26, 3, 0.55));
    color: #fde68a;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.35);
}
.export-pause-clone-btn:hover {
    filter: brightness(1.03);
}
/* 底栏：暂停克隆与「取消」同用 modal-btn 基类，统一高度；宽度随文案 */
.export-v2-cta-wrap .modal-btn.export-pause-clone-btn {
    min-width: 6.25rem;
}
/* 导出进行中：取消变为「停止并关闭」，玫瑰色边以区别于中性取消与主操作 */
.export-modal-cancel--stop {
    border-color: rgba(244, 63, 94, 0.55) !important;
    color: #be123c !important;
    background: rgba(255, 241, 242, 0.98) !important;
    font-weight: 600;
}
body.app-theme-dark .export-modal-cancel--stop {
    border-color: rgba(251, 113, 133, 0.42) !important;
    color: #fda4af !important;
    background: rgba(136, 19, 55, 0.38) !important;
}
.export-modal-cancel--stop:hover {
    border-color: rgba(225, 29, 72, 0.75) !important;
    background: rgba(254, 205, 211, 0.55) !important;
    color: #9f1239 !important;
}
body.app-theme-dark .export-modal-cancel--stop:hover {
    background: rgba(190, 18, 60, 0.42) !important;
    border-color: rgba(251, 113, 133, 0.6) !important;
    color: #fecdd3 !important;
}
.export-bundle-eyebrow {
  font-size: 0.7rem;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  font-weight: 700;
  color: #64748b;
  margin: 0;
}
body.app-theme-dark .export-bundle-eyebrow { color: #94a3b8; }
.export-bundle-tiles-wrap {
  display: flex;
  flex-direction: column;
  gap: 0.65rem;
}
.export-pack-hero {
  display: flex;
  align-items: flex-start;
  gap: 0.75rem;
  padding: 0.85rem 0.95rem;
  border-radius: 0.85rem;
  border: 1px solid rgba(99, 102, 241, 0.35);
  background: rgba(99, 102, 241, 0.08);
}
body.app-theme-dark .export-pack-hero {
  border-color: rgba(129, 140, 248, 0.35);
  background: rgba(99, 102, 241, 0.12);
}
.export-pack-hero-ico {
  flex-shrink: 0;
  width: 2.25rem;
  height: 2.25rem;
  border-radius: 0.65rem;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #4f46e5;
  background: rgba(255, 255, 255, 0.7);
}
body.app-theme-dark .export-pack-hero-ico {
  color: #a5b4fc;
  background: rgba(15, 23, 42, 0.55);
}
.export-pack-hero-title {
  font-size: 0.92rem;
  font-weight: 650;
  color: #0f172a;
  line-height: 1.25;
}
body.app-theme-dark .export-pack-hero-title { color: #f1f5f9; }
.export-pack-hero-desc {
  margin: 0.2rem 0 0;
  font-size: 0.72rem;
  line-height: 1.45;
  color: #64748b;
}
body.app-theme-dark .export-pack-hero-desc { color: #94a3b8; }
.export-pack-lines {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
}
.export-pack-line {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.45rem 0.65rem;
  border-radius: 0.65rem;
  border: 1px solid rgba(148, 163, 184, 0.28);
  background: rgba(255, 255, 255, 0.75);
  font-size: 0.78rem;
  color: #334155;
}
body.app-theme-dark .export-pack-line {
  background: rgba(15, 23, 42, 0.4);
  border-color: rgba(255, 255, 255, 0.08);
  color: #e2e8f0;
}
.export-pack-line--on {
  border-color: rgba(99, 102, 241, 0.4);
}
.export-pack-line--pending {
  opacity: 0.55;
}
.export-pack-line-dot {
  width: 0.45rem;
  height: 0.45rem;
  border-radius: 999px;
  background: #6366f1;
  flex-shrink: 0;
}
.export-pack-line--pending .export-pack-line-dot {
  background: #94a3b8;
}
.export-tiles {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.65rem;
  align-items: stretch;
}
@media (max-width: 520px) { .export-tiles { grid-template-columns: 1fr; } }
.export-tile-extras {
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
  padding: 0.55rem 0.7rem;
  border-radius: 0.75rem;
  background: rgba(241, 245, 249, 0.7);
  border: 1px solid rgba(148, 163, 184, 0.22);
}
body.app-theme-dark .export-tile-extras {
  background: rgba(15, 23, 42, 0.45);
  border-color: rgba(255, 255, 255, 0.08);
}
.export-tile-extra {
  display: flex;
  align-items: flex-start;
  gap: 0.45rem;
  font-size: 0.72rem;
  line-height: 1.4;
  color: #475569;
  cursor: pointer;
}
body.app-theme-dark .export-tile-extra { color: #cbd5e1; }
.export-tile-extra input { margin-top: 0.15rem; flex-shrink: 0; }
.export-tile {
    position: relative;
    display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; gap: 0.4rem;
    min-height: 6.4rem;
    padding: 0.85rem 0.55rem; border-radius: 1rem; cursor: pointer;
    border: 1.5px solid #e2e8f0; background: #fff; transition: transform 0.15s, box-shadow 0.2s, border-color 0.2s;
}
 body.app-theme-dark .export-tile {
     border-color: rgba(255, 255, 255, 0.1);
     background: rgba(2, 6, 23, 0.4);
 }
.export-tile-input { position: absolute; opacity: 0; width: 0; height: 0; }
.export-tile--on {
    border-color: #6366f1;
    box-shadow: 0 8px 28px rgba(99, 102, 241, 0.2);
    background: linear-gradient(180deg, rgba(99, 102, 241, 0.1) 0%, rgba(255,255,255,0) 100%);
}
 body.app-theme-dark .export-tile--on {
     box-shadow: 0 6px 28px rgba(0, 0, 0, 0.45);
     background: linear-gradient(180deg, rgba(99, 102, 241, 0.2) 0%, rgba(2, 6, 23, 0.3) 100%);
 }
/* 与上传页「可选槽未提供」对齐：无对应素材时弱化整块，禁用勾选避免空包 */
.export-tile.export-tile--asset-missing {
    opacity: 0.55;
    cursor: not-allowed;
}
 body.app-theme-dark .export-tile.export-tile--asset-missing {
     opacity: 0.5;
 }
.export-tile.export-tile--asset-missing:hover { transform: none; }
.export-tile.export-tile--asset-missing .export-tile-ico { opacity: 0.7; }
.export-tile.export-tile--pending {
  opacity: 0.78;
  cursor: not-allowed;
  border-style: dashed;
}
.export-tile.export-tile--pending:hover { transform: none; }
.export-tile.export-tile--pending .export-tile-desc {
  color: #b45309;
}
body.app-theme-dark .export-tile.export-tile--pending .export-tile-desc {
  color: #fbbf24;
}
/* 外挂字幕未上传：仍可导出流水线字幕，仅略灰 + 副文案提示 */
.export-tile.export-tile--user-asset-missing:not(.export-tile--on) { opacity: 0.88; }
 body.app-theme-dark .export-tile.export-tile--user-asset-missing:not(.export-tile--on) { opacity: 0.85; }
.export-tile:hover { transform: translateY(-2px); }
.export-tile-ico { width: 2.5rem; height: 2.5rem; border-radius: 0.7rem; display: flex; align-items: center; justify-content: center; }
.export-tile-ico--a { color: #4f46e5; background: linear-gradient(135deg, rgba(99, 102, 241, 0.2), rgba(99, 102, 241, 0.05)); }
.export-tile-ico--s { color: #7c3aed; background: linear-gradient(135deg, rgba(168, 85, 247, 0.2), rgba(168, 85, 247, 0.05)); }
.export-tile-ico--v { color: #0ea5e9; background: linear-gradient(135deg, rgba(14, 165, 233, 0.2), rgba(14, 165, 233, 0.05)); }
.export-tile-ico--sh { color: #e11d48; background: linear-gradient(135deg, rgba(244, 63, 94, 0.2), rgba(244, 63, 94, 0.05)); }
.export-tile-ico--p { color: #db2777; background: linear-gradient(135deg, rgba(236, 72, 153, 0.2), rgba(236, 72, 153, 0.05)); }
.export-shorts-opts {
  background: rgba(248, 250, 252, 0.65);
}
body.app-theme-dark .export-shorts-opts {
  background: rgba(15, 23, 42, 0.35);
}
.export-modal-preparing {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin: 0 1rem 0.5rem;
  padding: 0.45rem 0.65rem;
  border-radius: 0.5rem;
  font-size: 0.75rem;
  color: #475569;
  background: rgba(99, 102, 241, 0.08);
  border: 1px solid rgba(99, 102, 241, 0.18);
}
body.app-theme-dark .export-modal-preparing {
  color: #cbd5e1;
  background: rgba(99, 102, 241, 0.12);
}
.export-modal-preparing-dot {
  width: 0.45rem;
  height: 0.45rem;
  border-radius: 999px;
  background: #6366f1;
  animation: export-preparing-pulse 1s ease-in-out infinite;
}
@keyframes export-preparing-pulse {
  0%, 100% { opacity: 0.35; transform: scale(0.9); }
  50% { opacity: 1; transform: scale(1); }
}
.export-tile-txt { display: flex; flex-direction: column; align-items: center; gap: 0.1rem; }
.export-tile-name { font-size: 0.8rem; font-weight: 700; color: #0f172a; display: block; }
 body.app-theme-dark .export-tile-name { color: #f1f5f9; }
.export-tile-desc { font-size: 0.62rem; color: #64748b; }
.export-tile-asset-missing { display: block; font-size: 0.58rem; color: #94a3b8; margin-top: 0.2rem; }
body.app-theme-dark .export-tile-asset-missing { color: #64748b; }
.export-subgrid {
  margin-top: 0.15rem;
  padding-top: 0.75rem;
  border-top: 1px solid rgba(148, 163, 184, 0.18);
}
body.app-theme-dark .export-subgrid {
  border-top-color: rgba(255, 255, 255, 0.08);
}
.export-sub-eyebrow { font-size: 0.65rem; color: #64748b; font-weight: 600; margin: 0 0 0.4rem; }
.export-subgrid-hint {
  margin: 0.5rem 0 0;
  font-size: 0.65rem;
  line-height: 1.4;
  color: #64748b;
}
body.app-theme-dark .export-subgrid-hint { color: #94a3b8; }
.export-format-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 0.4rem; }
.export-format {
    position: relative; display: block; padding: 0.55rem 0.6rem; border-radius: 0.6rem; cursor: pointer;
    border: 1px solid #e2e8f0; background: rgba(248, 250, 252, 0.6); transition: border-color 0.15s, background 0.15s;
}
 body.app-theme-dark .export-format { border-color: rgba(255, 255, 255, 0.1); background: rgba(0,0,0,0.2); }
.export-format--on {
    border-color: #6366f1; background: rgba(99, 102, 241, 0.08);
}
.export-format-id { font-size: 0.75rem; font-weight: 700; color: #1e293b; display: block; }
 body.app-theme-dark .export-format-id { color: #e2e8f0; }
.export-format-d { font-size: 0.6rem; color: #94a3b8; }
.export-audio-row { display: flex; flex-wrap: wrap; gap: 0.4rem; }
.export-chip { font-size: 0.72rem; padding: 0.35rem 0.6rem; border-radius: 9999px; border: 1px solid #e2e8f0; cursor: pointer; }
 body.app-theme-dark .export-chip { border-color: rgba(255, 255, 255, 0.12); color: #cbd5e1; }
.export-chip--on { border-color: #6366f1; color: #4f46e5; background: rgba(99, 102, 241, 0.1); }
 body.app-theme-dark .export-chip--on { color: #c7d2fe; }
.export-chip--readonly { cursor: default; pointer-events: none; }
.export-chip input { margin-right: 0.2rem; vertical-align: middle; }
/* 偏好开关（旧类名保留，供其它入口复用；CTA 栏已改用 .export-cta-pref） */
.export-zip { display: flex; align-items: center; gap: 0.5rem; margin-top: 0.9rem; padding: 0.5rem 0.65rem; border-radius: 0.65rem; font-size: 0.75rem; cursor: pointer; border: 1px dashed #cbd5e1; color: #64748b; background: transparent; }
 body.app-theme-dark .export-zip { border-color: rgba(255, 255, 255, 0.14); color: #94a3b8; }
.export-zip--on { border-style: solid; border-color: #10b981; color: #047857; background: rgba(16, 185, 129, 0.09); }
 body.app-theme-dark .export-zip--on { border-color: rgba(52, 211, 153, 0.55); color: #6ee7b7; background: rgba(16, 185, 129, 0.14); }
.export-zip-cb { accent-color: #10b981; }

.export-modal-footer.modal-footer { padding: 1rem 1.5rem 1.25rem; border-top: 1px solid rgba(99, 102, 241, 0.1); }
 body.app-theme-dark .export-modal-footer.modal-footer { border-top-color: rgba(255, 255, 255, 0.08); }
.export-v2-footer.modal-footer { padding: 1.1rem 1.75rem 1.35rem; }
.export-v2-footer .export-v2-cta-wrap { justify-content: flex-start; }
@media (min-width: 640px) {
  .export-v2-footer .export-v2-cta-wrap { max-width: 100%; padding: 0 0.25rem; }
}
.export-cta {
    /* [r11-ui] 用户反馈「确认并开始翻译」按钮不够大；加大 padding/font-size 让 CTA
       在导出模态底部更醒目（现代 saas 风格：渐变 + 阴影 + 大圆角）。 */
    position: relative; overflow: hidden; flex: 1; max-width: 28rem; margin: 0 auto;
    padding: 1.1rem 2rem; border: none; border-radius: 1rem;
    font-size: 1.05rem; font-weight: 700; color: #fff; cursor: pointer; letter-spacing: 0.02em;
    background: linear-gradient(120deg, #4f46e5 0%, #7c3aed 50%, #6366f1 100%);
    box-shadow: 0 8px 28px rgba(79, 70, 229, 0.45), 0 0 0 1px rgba(255, 255, 255, 0.12) inset;
    transition: transform 0.15s, box-shadow 0.2s;
}
 body.app-theme-dark .export-cta { box-shadow: 0 10px 40px rgba(0, 0, 0, 0.4), 0 0 0 1px rgba(255, 255, 255, 0.1) inset; }
.export-cta-shine { position: absolute; inset: 0; pointer-events: none; background: linear-gradient(105deg, transparent 0%, rgba(255, 255, 255, 0.18) 50%, transparent 100%); transform: translateX(-60%); }
.export-cta:hover:not(:disabled) { transform: translateY(-1px); box-shadow: 0 10px 32px rgba(99, 102, 241, 0.45); }
.export-cta:disabled { cursor: not-allowed; }
.export-cta:disabled .export-cta-shine { display: none; }
/* 进行中：明显变暗、去高光，避免与可点状态混淆 */
.export-cta.export-cta--busy:disabled,
.export-cta[aria-busy="true"] {
  opacity: 0.55;
  filter: grayscale(0.12) brightness(0.95);
  box-shadow: 0 2px 10px rgba(15, 23, 42, 0.12) !important;
  background: linear-gradient(120deg, #64748b 0%, #525f7a 50%, #64748b 100%) !important;
  transform: none;
  pointer-events: none;
}
 body.app-theme-dark .export-cta.export-cta--busy:disabled,
 body.app-theme-dark .export-cta[aria-busy="true"] {
   background: linear-gradient(120deg, #334155 0%, #1e293b 100%) !important;
   box-shadow: 0 2px 12px rgba(0, 0, 0, 0.4) !important;
   filter: grayscale(0.2) brightness(0.9);
   opacity: 0.7;
 }
/* 等待 AI 检查：仅视觉提示，按钮仍可点击（勿加 pointer-events:none） */
.export-cta.export-cta--hold:not(.export-cta--busy):not([aria-busy="true"]) {
  opacity: 0.88;
  filter: grayscale(0.04);
  transform: none;
  background: linear-gradient(120deg, #6366f1 0%, #7c3aed 50%, #6366f1 100%) !important;
  box-shadow: 0 6px 22px rgba(99, 102, 241, 0.32) !important;
}
 body.app-theme-dark .export-cta.export-cta--hold:not(.export-cta--busy):not([aria-busy="true"]) {
  background: linear-gradient(120deg, #4f46e5 0%, #6d28d9 52%, #4f46e5 100%) !important;
  box-shadow: 0 6px 24px rgba(0, 0, 0, 0.38) !important;
  filter: grayscale(0.08);
  opacity: 0.9;
}
.export-cta-label { position: relative; z-index: 1; }

@media (prefers-reduced-motion: reduce) {
  .export-timeline-item[data-state="running"] .export-timeline-dot,
  .export-audio-pulse,
  .export-cta .export-cta-shine,
  .export-v2-rail--running .export-v2-rail-node { animation: none !important; }
}

.modal-box > * {
    position: relative;
    z-index: 2;
}

 body.app-theme-dark .modal-box {
     background:
         radial-gradient(820px 340px at 18% 0%, rgba(99, 102, 241, 0.14), transparent 62%),
         radial-gradient(780px 360px at 90% 20%, rgba(14, 165, 233, 0.10), transparent 64%),
         linear-gradient(180deg, rgba(15, 23, 42, 0.72) 0%, rgba(2, 6, 23, 0.78) 100%);
     border: 1px solid var(--orb-glass-border, rgba(255, 255, 255, 0.12));
     box-shadow: var(--orb-shadow-lg, 0 36px 140px rgba(0, 0, 0, 0.58));
 }

@keyframes modalSlideIn {
    from {
        opacity: 0;
        transform: translateY(20px) scale(0.98);
    }
    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

/* Modal header */
.modal-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1.25rem 1.5rem;
    border-bottom: 1px solid rgba(99, 102, 241, 0.08);
    background: linear-gradient(135deg, rgba(99, 102, 241, 0.03) 0%, rgba(168, 85, 247, 0.02) 100%);
}

 body.app-theme-dark .modal-header {
     border-bottom-color: rgba(255, 255, 255, 0.10);
     background:
         radial-gradient(640px 220px at 16% 0%, rgba(99, 102, 241, 0.14), transparent 62%),
         linear-gradient(135deg, rgba(2, 6, 23, 0.40), rgba(2, 6, 23, 0.20));
 }

.modal-title {
    font-size: 1.125rem;
    font-weight: 600;
    color: #0f172a;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

 body.app-theme-dark .modal-title {
     color: rgba(226, 232, 240, 0.92);
 }

.modal-title-icon {
    width: 32px;
    height: 32px;
    background: linear-gradient(135deg, #6366f1, #a855f7);
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.modal-title-icon svg {
    width: 18px;
    height: 18px;
    color: white;
}

.modal-close {
    width: 36px;
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: transparent;
    border: none;
    color: #94a3b8;
    cursor: pointer;
    transition: all 0.2s ease;
}

 body.app-theme-dark .modal-close {
     color: rgba(148, 163, 184, 0.78);
 }

.modal-close:hover {
    background: rgba(99, 102, 241, 0.1);
    color: #6366f1;
}

 body.app-theme-dark .modal-close:hover {
     background: rgba(99, 102, 241, 0.14);
     color: rgba(199, 210, 254, 0.95);
 }

.modal-close svg {
    width: 20px;
    height: 20px;
}

/* Modal body */
.modal-body {
    padding: 1.5rem;
}

/* Modal footer */
.modal-footer {
    display: flex;
    justify-content: flex-end;
    gap: 0.75rem;
    padding: 1.25rem 1.5rem;
    border-top: 1px solid rgba(99, 102, 241, 0.08);
    background: rgba(248, 250, 252, 0.5);
}

 body.app-theme-dark .modal-footer {
     border-top-color: rgba(255, 255, 255, 0.10);
     background: rgba(2, 6, 23, 0.34);
 }

/* Modal section */
.modal-section {
    margin-bottom: 1.5rem;
}

.modal-section:last-child {
    margin-bottom: 0;
}

.modal-section-title {
    font-size: 0.75rem;
    font-weight: 500;
    color: #64748b;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin-bottom: 0.75rem;
}

 body.app-theme-dark .modal-section-title {
     color: rgba(148, 163, 184, 0.78);
 }

/* Modal card option */
.modal-option-card {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5rem;
    padding: 1rem;
    border-radius: 1rem;
    border: 2px solid #e2e8f0;
    background: white;
    cursor: pointer;
    transition: all 0.25s ease;
}

 body.app-theme-dark .modal-option-card {
     border-color: rgba(255, 255, 255, 0.10);
     background: rgba(2, 6, 23, 0.38);
 }

.modal-option-card:hover {
    border-color: rgba(99, 102, 241, 0.3);
    background: rgba(99, 102, 241, 0.02);
    transform: translateY(-2px);
}

 body.app-theme-dark .modal-option-card:hover {
     border-color: rgba(129, 140, 248, 0.30);
     background: rgba(99, 102, 241, 0.10);
 }

.modal-option-card.selected {
    border-color: #6366f1;
    background: linear-gradient(135deg, rgba(99, 102, 241, 0.08) 0%, rgba(168, 85, 247, 0.05) 100%);
    box-shadow: 0 4px 12px rgba(99, 102, 241, 0.15);
}

 body.app-theme-dark .modal-option-card.selected {
     border-color: rgba(129, 140, 248, 0.62);
     background:
         radial-gradient(420px 160px at 20% 0%, rgba(99, 102, 241, 0.18), transparent 60%),
         rgba(2, 6, 23, 0.44);
     box-shadow:
         0 18px 70px rgba(0, 0, 0, 0.35),
         0 0 0 1px rgba(129, 140, 248, 0.12);
 }

.modal-option-icon {
    width: 40px;
    height: 40px;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.modal-option-icon.audio {
    background: linear-gradient(135deg, rgba(99, 102, 241, 0.15), rgba(99, 102, 241, 0.05));
    color: #6366f1;
}

 body.app-theme-dark .modal-option-icon.audio {
     background: linear-gradient(135deg, rgba(99, 102, 241, 0.22), rgba(2, 6, 23, 0.20));
     color: rgba(199, 210, 254, 0.95);
 }

.modal-option-icon.subtitles {
    background: linear-gradient(135deg, rgba(168, 85, 247, 0.15), rgba(168, 85, 247, 0.05));
    color: #a855f7;
}

 body.app-theme-dark .modal-option-icon.subtitles {
     background: linear-gradient(135deg, rgba(168, 85, 247, 0.22), rgba(2, 6, 23, 0.20));
     color: rgba(233, 213, 255, 0.95);
 }

.modal-option-icon.project {
    background: linear-gradient(135deg, rgba(236, 72, 153, 0.15), rgba(236, 72, 153, 0.05));
    color: #ec4899;
}

 body.app-theme-dark .modal-option-icon.project {
     background: linear-gradient(135deg, rgba(236, 72, 153, 0.20), rgba(2, 6, 23, 0.20));
     color: rgba(251, 207, 232, 0.95);
 }

.modal-option-label {
    font-size: 0.75rem;
    font-weight: 500;
    color: #475569;
}

 body.app-theme-dark .modal-option-label {
     color: rgba(226, 232, 240, 0.86);
 }

/* Progress container */
.modal-progress-container {
    background: linear-gradient(180deg, #f8fafc 0%, #f1f5f9 100%);
    border-radius: 1rem;
    padding: 1.25rem;
    border: 1px solid rgba(99, 102, 241, 0.1);
}

.modal-progress-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 0.75rem;
}

.modal-progress-title {
    font-size: 0.875rem;
    font-weight: 600;
    color: #0f172a;
}

.modal-progress-percent {
    font-size: 0.875rem;
    font-weight: 500;
    color: #6366f1;
}

.modal-progress-bar {
    height: 8px;
    background: #e2e8f0;
    border-radius: 4px;
    overflow: hidden;
}

.modal-progress-fill {
    height: 100%;
    background: linear-gradient(90deg, #6366f1, #a855f7);
    border-radius: 4px;
    transition: width 0.5s ease;
    position: relative;
}

.modal-progress-fill::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.3), transparent);
    animation: progressShine 2s ease-in-out infinite;
}

@keyframes progressShine {
    0% { transform: translateX(-100%); }
    100% { transform: translateX(100%); }
}

/* Log container */
.modal-log-container {
    height: 12rem;
    border-radius: 0.75rem;
    background: #0f172a;
    border: 1px solid rgba(99, 102, 241, 0.2);
    overflow-y: auto;
    padding: 0.75rem;
    font-family: 'JetBrains Mono', 'Consolas', monospace;
    font-size: 0.75rem;
    line-height: 1.6;
}

.modal-log-container::-webkit-scrollbar {
    width: 4px;
}

.modal-log-container::-webkit-scrollbar-track {
    background: transparent;
}

.modal-log-container::-webkit-scrollbar-thumb {
    background: rgba(99, 102, 241, 0.3);
    border-radius: 2px;
}

.modal-log-line {
    color: #94a3b8;
    white-space: nowrap;
}

.modal-log-line.success {
    color: #34d399;
}

.modal-log-line.error {
    color: #f87171;
}

.modal-log-line.info {
    color: #60a5fa;
}

body.app-theme-light .modal-log-container {
    background: #f1f5f9;
    border-color: rgba(15, 23, 42, 0.1);
}

body.app-theme-light .modal-log-line {
    color: #475569;
}

/* Loading overlay */
.modal-loading-overlay {
    position: absolute;
    inset: 0;
    background: rgba(255, 255, 255, 0.95);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    border-radius: inherit;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 1.25rem;
    z-index: 10;
    animation: fadeIn 0.2s ease;
}

 body.app-theme-dark .modal-loading-overlay {
     background: rgba(2, 6, 23, 0.82);
     border: 1px solid rgba(255, 255, 255, 0.08);
 }

@keyframes fadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}

.modal-loading-spinner {
    width: 48px;
    height: 48px;
    border: 3px solid #e2e8f0;
    border-top-color: #6366f1;
    border-radius: 50%;
    animation: spin 1s linear infinite;
}

@keyframes spin {
    to { transform: rotate(360deg); }
}

.modal-loading-text {
    font-size: 1rem;
    font-weight: 500;
    color: #0f172a;
}

 body.app-theme-dark .modal-loading-text {
     color: rgba(226, 232, 240, 0.92);
 }

/* Success state */
.modal-success-badge {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 1rem;
    background: linear-gradient(135deg, rgba(16, 185, 129, 0.1), rgba(16, 185, 129, 0.05));
    border: 1px solid rgba(16, 185, 129, 0.3);
    border-radius: 2rem;
    font-size: 0.875rem;
    color: #059669;
}

.modal-success-badge svg {
    width: 16px;
    height: 16px;
}

/* Language tags */
.modal-lang-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    justify-content: center;
    margin-top: 0.75rem;
}

.modal-lang-tag {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0.25rem 0.75rem;
    background: linear-gradient(135deg, rgba(16, 185, 129, 0.1), rgba(16, 185, 129, 0.05));
    border: 1px solid rgba(16, 185, 129, 0.2);
    border-radius: 1rem;
    font-size: 0.75rem;
    color: #059669;
    animation: popIn 0.3s ease;
}

@keyframes popIn {
    0% {
        opacity: 0;
        transform: scale(0.8);
    }
    100% {
        opacity: 1;
        transform: scale(1);
    }
}

/* Completion summary */
.modal-completion-summary {
    margin-top: 0.75rem;
    padding: 0.75rem;
    background: linear-gradient(135deg, rgba(16, 185, 129, 0.08), rgba(16, 185, 129, 0.03));
    border: 1px solid rgba(16, 185, 129, 0.2);
    border-radius: 0.75rem;
    text-align: left;
}

.modal-completion-title {
    font-size: 0.875rem;
    font-weight: 500;
    color: #059669;
    margin-bottom: 0.5rem;
}

.modal-completion-item {
    font-size: 0.75rem;
    color: #475569;
    line-height: 1.6;
}

.modal-completion-item.success {
    color: #059669;
}

.modal-completion-item.warning {
    color: #d97706;
}

.modal-completion-item.error {
    color: #dc2626;
}

/* Button styles in modal */
.modal-btn {
    padding: 0.625rem 1.25rem;
    border-radius: 0.75rem;
    font-size: 0.875rem;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.25s ease;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

.modal-btn-secondary {
    background: white;
    border: 1px solid #e2e8f0;
    color: #64748b;
}

 body.app-theme-dark .modal-btn-secondary {
     background: rgba(2, 6, 23, 0.46);
     border-color: rgba(255, 255, 255, 0.10);
     color: rgba(226, 232, 240, 0.78);
 }

.modal-btn-secondary:hover {
    background: #f8fafc;
    border-color: #cbd5e1;
    color: #475569;
}

 body.app-theme-dark .modal-btn-secondary:hover {
     background: rgba(15, 23, 42, 0.56);
     border-color: rgba(129, 140, 248, 0.22);
     color: rgba(226, 232, 240, 0.88);
 }

.modal-btn-primary {
    background: linear-gradient(135deg, #6366f1, #a855f7);
    border: none;
    color: white;
    box-shadow: 0 4px 12px rgba(99, 102, 241, 0.25);
}

.modal-btn-primary:hover {
    transform: translateY(-1px);
    box-shadow: 0 6px 20px rgba(99, 102, 241, 0.35);
}

.modal-btn-primary:active {
    transform: translateY(0);
}

.modal-btn-primary:disabled {
    opacity: 0.6;
    cursor: not-allowed;
    transform: none;
}

/* Responsive */
@media (max-width: 640px) {
    .modal-box {
        width: 96%;
        max-height: 90vh;
        border-radius: var(--orb-radius-lg, 1rem);
    }
    
    .modal-header,
    .modal-body,
    .modal-footer {
        padding: 1rem;
    }
}

/* ========================================
   Accessibility: Reduced Motion
   ======================================== */
@media (prefers-reduced-motion: reduce) {
    .modal-mask,
    .modal-box,
    .modal-option-card,
    .modal-btn,
    .modal-progress-fill {
        animation: none !important;
        transition: none !important;
    }
    
    .modal-progress-fill::after {
        animation: none;
    }
}

/* ========================================
   Accessibility: Focus States
   ======================================== */
.modal-close:focus-visible,
.modal-btn:focus-visible,
.modal-option-card:focus-visible {
    outline: 2px solid var(--orb-primary, #6366f1);
    outline-offset: 2px;
}

/* ========================================
   Mobile: Safe Area Support
   ======================================== */
@supports (padding: env(safe-area-inset-bottom)) {
    .modal-box {
        max-height: calc(80vh - env(safe-area-inset-bottom));
    }
    
    .modal-footer {
        padding-bottom: calc(1.25rem + env(safe-area-inset-bottom));
    }
    
    @media (max-width: 640px) {
        .modal-box {
            max-height: calc(90vh - env(safe-area-inset-bottom));
        }
    }
}