/*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */
@layer properties;
@layer theme, base, components, utilities;
@layer theme {
  :root, :host {
    --font-sans: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', 'Noto Sans', Arial,
    sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji';
    --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, 'Liberation Mono', 'Courier New',
    monospace;
    --radius-lg: 0.5rem;
    --shadow-xs: 0 1px 2px 0 rgb(0 0 0 / 0.05);
    --shadow-sm: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);
    --shadow-lg: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
    --ease-in: cubic-bezier(0.4, 0, 1, 1);
    --ease-out: cubic-bezier(0, 0, 0.2, 1);
    --ease-in-out: cubic-bezier(0.4, 0, 0.2, 1);
    --default-transition-duration: 150ms;
    --default-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  }
}
@layer utilities {
  .\@container {
    container-type: inline-size;
  }
  .visible {
    visibility: visible;
  }
  .absolute {
    position: absolute;
  }
  .fixed {
    position: fixed;
  }
  .relative {
    position: relative;
  }
  .static {
    position: static;
  }
  .sticky {
    position: sticky;
  }
  .container {
    width: 100%;
    @media (width >= 1024px) {
      max-width: 1024px;
    }
    @media (width >= 40rem) {
      max-width: 40rem;
    }
    @media (width >= 48rem) {
      max-width: 48rem;
    }
    @media (width >= 80rem) {
      max-width: 80rem;
    }
    @media (width >= 96rem) {
      max-width: 96rem;
    }
  }
  .block {
    display: block;
  }
  .contents {
    display: contents;
  }
  .flex {
    display: flex;
  }
  .grid {
    display: grid;
  }
  .hidden {
    display: none;
  }
  .inline {
    display: inline;
  }
  .inline-block {
    display: inline-block;
  }
  .inline-flex {
    display: inline-flex;
  }
  .table {
    display: table;
  }
  .flex-shrink {
    flex-shrink: 1;
  }
  .shrink {
    flex-shrink: 1;
  }
  .grow {
    flex-grow: 1;
  }
  .border-collapse {
    border-collapse: collapse;
  }
  .transform {
    transform: var(--tw-rotate-x,) var(--tw-rotate-y,) var(--tw-rotate-z,) var(--tw-skew-x,) var(--tw-skew-y,);
  }
  .resize {
    resize: both;
  }
  .columns-3 {
    columns: 3;
  }
  .flex-wrap {
    flex-wrap: wrap;
  }
  .truncate {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .border {
    border-style: var(--tw-border-style);
    border-width: 1px;
  }
  .shadow {
    --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
  .ring {
    --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
  .outline {
    outline-style: var(--tw-outline-style);
    outline-width: 1px;
  }
  .blur {
    --tw-blur: blur(8px);
    filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,);
  }
  .invert {
    --tw-invert: invert(100%);
    filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,);
  }
  .filter {
    filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,);
  }
  .backdrop-filter {
    -webkit-backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);
    backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);
  }
  .transition {
    transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, display, content-visibility, overlay, pointer-events;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
  }
  .ease-in-out {
    --tw-ease: var(--ease-in-out);
    transition-timing-function: var(--ease-in-out);
  }
  .ease-out {
    --tw-ease: var(--ease-out);
    transition-timing-function: var(--ease-out);
  }
  .\[i\:a\] {
    i: a;
  }
  .\[i\:tts\] {
    i: tts;
  }
  @media (width >= 1024px) {
    .lg\:flex {
      display: flex;
    }
    .lg\:h-dvh {
      height: 100dvh;
    }
    .lg\:min-h-0 {
      min-height: 0px;
    }
    .lg\:flex-1 {
      flex: 1;
    }
    .lg\:flex-none {
      flex: none;
    }
    .lg\:flex-col {
      flex-direction: column;
    }
    .lg\:overflow-hidden {
      overflow: hidden;
    }
    .lg\:overflow-x-hidden {
      overflow-x: hidden;
    }
    .lg\:overflow-y-auto {
      overflow-y: auto;
    }
    .lg\:pb-0 {
      padding-bottom: 0px;
    }
  }
}
@layer components {
  /*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */
  @layer properties;
  @layer theme, base, components, utilities;
  @layer theme {
    :root, :host {
      --shadow-xs: 0 1px 2px 0 rgb(0 0 0 / 0.05);
      --shadow-sm: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);
      --shadow-lg: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
      --ease-in: cubic-bezier(0.4, 0, 1, 1);
      --ease-in-out: cubic-bezier(0.4, 0, 0.2, 1);
      --default-transition-duration: 150ms;
      --default-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    }
  }
  @layer utilities {
    .visible {
      visibility: visible;
    }
    .absolute {
      position: absolute;
    }
    .fixed {
      position: fixed;
    }
    .relative {
      position: relative;
    }
    .static {
      position: static;
    }
    .container {
      width: 100%;
      @media (width >= 1024px) {
        max-width: 1024px;
      }
      @media (width >= 40rem) {
        max-width: 40rem;
      }
      @media (width >= 48rem) {
        max-width: 48rem;
      }
      @media (width >= 80rem) {
        max-width: 80rem;
      }
      @media (width >= 96rem) {
        max-width: 96rem;
      }
    }
    .block {
      display: block;
    }
    .contents {
      display: contents;
    }
    .flex {
      display: flex;
    }
    .grid {
      display: grid;
    }
    .hidden {
      display: none;
    }
    .inline {
      display: inline;
    }
    .inline-block {
      display: inline-block;
    }
    .inline-flex {
      display: inline-flex;
    }
    .table {
      display: table;
    }
    .shrink {
      flex-shrink: 1;
    }
    .grow {
      flex-grow: 1;
    }
    .border-collapse {
      border-collapse: collapse;
    }
    .transform {
      transform: var(--tw-rotate-x,) var(--tw-rotate-y,) var(--tw-rotate-z,) var(--tw-skew-x,) var(--tw-skew-y,);
    }
    .resize {
      resize: both;
    }
    .flex-wrap {
      flex-wrap: wrap;
    }
    .truncate {
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }
    .border {
      border-style: var(--tw-border-style);
      border-width: 1px;
    }
    .shadow {
      --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
      box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    }
    .ring {
      --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
      box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    }
    .outline {
      outline-style: var(--tw-outline-style);
      outline-width: 1px;
    }
    .blur {
      --tw-blur: blur(8px);
      filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,);
    }
    .invert {
      --tw-invert: invert(100%);
      filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,);
    }
    .filter {
      filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,);
    }
    .backdrop-filter {
      -webkit-backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);
      backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);
    }
    .transition {
      transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, display, content-visibility, overlay, pointer-events;
      transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
      transition-duration: var(--tw-duration, var(--default-transition-duration));
    }
    .ease-in {
      --tw-ease: var(--ease-in);
      transition-timing-function: var(--ease-in);
    }
    .ease-in-out {
      --tw-ease: var(--ease-in-out);
      transition-timing-function: var(--ease-in-out);
    }
    .\[i\:a\] {
      i: a;
    }
    .\[i\:tts\] {
      i: tts;
    }
    @media (width >= 1024px) {
      .lg\:static {
        position: static;
      }
      .lg\:mb-0 {
        margin-bottom: 0px;
      }
      .lg\:flex {
        display: flex;
      }
      .lg\:h-dvh {
        height: 100dvh;
      }
      .lg\:max-h-full {
        max-height: 100%;
      }
      .lg\:min-h-0 {
        min-height: 0px;
      }
      .lg\:flex-1 {
        flex: 1;
      }
      .lg\:flex-none {
        flex: none;
      }
      .lg\:grid-rows-\[minmax\(0\,1fr\)\] {
        grid-template-rows: minmax(0,1fr);
      }
      .lg\:flex-col {
        flex-direction: column;
      }
      .lg\:items-stretch {
        align-items: stretch;
      }
      .lg\:self-stretch {
        align-self: stretch;
      }
      .lg\:overflow-hidden {
        overflow: hidden;
      }
      .lg\:overflow-x-hidden {
        overflow-x: hidden;
      }
      .lg\:overflow-y-auto {
        overflow-y: auto;
      }
      .lg\:pb-0 {
        padding-bottom: 0px;
      }
    }
  }
  @layer components {
    :root {
      --bg-0: #f3f6fa;
      --bg-1: #ffffff;
      --bg-2: #f4f7fb;
      --bg-3: #e9eff6;
      --bg-4: #dbe3ee;
      --bg: var(--bg-1);
      --glass-bg: rgba(255,255,255,.82);
      --glass-bg-hover: #f4f7fb;
      --topbar-bg: rgba(255,255,255,0.92);
      --glass-border: rgba(212,222,235,.72);
      --glass-border-strong: #cbd6e4;
      --line: #e6ecf3;
      --line-strong: #cbd6e4;
      --line-subtle: #f2f6fa;
      --card: var(--bg-1);
      --border: var(--line-strong);
      --t1: #1D2129;
      --t2: #4E5969;
      --t3: #86909C;
      --t-muted: #A9B2BF;
      --brand: #165DFF;
      --brand-text: #165DFF;
      --brand-text-strong: #0E42D2;
      --brand-soft: #4080FF;
      --brand-cyan: #165DFF;
      --brand-bg-soft: rgba(22,93,255,.08);
      --brand-bg-soft2: rgba(22,93,255,.12);
      --accent: #165DFF;
      --p: #165DFF;
      --info: #165DFF;
      --grad-brand: linear-gradient(135deg, #4080FF 0%, #165DFF 100%);
      --grad-warm: linear-gradient(135deg, #4080FF 0%, #165DFF 100%);
      --grad-aurora: radial-gradient(ellipse 60% 50% at 12% 8%, rgba(22,93,255,0.05), transparent 60%), radial-gradient(ellipse 50% 40% at 88% 92%, rgba(64,128,255,0.04), transparent 60%);
      --ok: #00B42A;
      --err: #F53F3F;
      --warn: #FF7D00;
      --r-xs: 2px;
      --r-sm: 4px;
      --r-md: 8px;
      --r-lg: 8px;
      --r-xl: 8px;
      --r-full: 999px;
      --shadow-xs: 0 1px 2px rgba(15,23,42,.05);
      --shadow-sm: 0 1px 3px rgba(15,23,42,.06);
      --shadow-card: 0 1px 3px rgba(15,23,42,.05), 0 1px 2px rgba(15,23,42,.03);
      --shadow-soft: 0 6px 18px rgba(15,23,42,.06), 0 1px 3px rgba(15,23,42,.03);
      --shadow-lg: 0 18px 44px rgba(15,23,42,.10), 0 4px 12px rgba(15,23,42,.04);
      --shadow-glow: 0 0 0 1px rgba(22,93,255,.10), 0 0 18px rgba(22,93,255,.16);
      --font-ui: -apple-system, BlinkMacSystemFont, 'PingFang SC', 'Segoe UI', 'Microsoft YaHei', 'Hiragino Sans GB', sans-serif;
      --font-display: -apple-system, BlinkMacSystemFont, 'PingFang SC', 'Segoe UI', 'Microsoft YaHei', sans-serif;
      --font-mono: 'SF Mono', 'JetBrains Mono', 'Menlo', monospace;
      --ease: cubic-bezier(.645, .045, .355, 1);
      --ease-bounce: cubic-bezier(.34, 1.56, .64, 1);
      --duration-fast: 0.15s;
      --duration-normal: 0.20s;
      --duration-slow: 0.30s;
      --sp-1: 4px;
      --sp-2: 8px;
      --sp-3: 12px;
      --sp-4: 16px;
      --sp-5: 20px;
      --sp-6: 24px;
      --sp-8: 32px;
      --sp-12: 48px;
      --space-frame: 14px;
      --space-section: 10px;
      --space-block: 8px;
      --space-tight: 6px;
      --z-base: 1;
      --z-sticky: 50;
      --z-step: 60;
      --z-toast: 80;
      --z-modal: 100;
      --z-tooltip: 120;
      --ring: 0 0 0 3px rgba(22,93,255,.12);
      --fs-scale: 1;
      --fs-display: calc(20px * var(--fs-scale));
      --fs-h1: calc(18px * var(--fs-scale));
      --fs-h2: calc(16px * var(--fs-scale));
      --fs-h3: calc(14px * var(--fs-scale));
      --fs-body: calc(14px * var(--fs-scale));
      --fs-small: calc(12px * var(--fs-scale));
      --fs-nano: calc(11px * var(--fs-scale));
      --fs-micro: calc(10px * var(--fs-scale));
      --container: 100%;
      --sidebar-w: clamp(210px, 17vw, 264px);
      --blur-sm: 8px;
      --blur-md: 12px;
      --blur-lg: 20px;
    }
    [data-theme="dark"] {
      --bg-0: #080c12;
      --bg-1: #0c1219;
      --bg-2: #101821;
      --bg-3: #17222e;
      --bg-4: #1f2c3b;
      --bg: var(--bg-1);
      --glass-bg: #0c1219;
      --glass-bg-hover: #131c26;
      --topbar-bg: rgba(8,12,18,0.94);
      --glass-border: #1d2836;
      --glass-border-strong: #2a3b4e;
      --line: #1d2836;
      --line-strong: #2a3b4e;
      --line-subtle: #141d28;
      --t1: #F7F7F8;
      --t2: #B8B8BA;
      --t3: #8D8D90;
      --t-muted: #5A5A5C;
      --brand: #4080FF;
      --brand-text: #4080FF;
      --brand-text-strong: #4080FF;
      --brand-soft: #4080FF;
      --brand-cyan: #165DFF;
      --brand-bg-soft: rgba(64,128,255,.12);
      --brand-bg-soft2: rgba(64,128,255,.16);
      --accent: #4080FF;
      --p: #4080FF;
      --info: #4080FF;
      --grad-brand: linear-gradient(135deg, #165DFF 0%, #4080FF 100%);
      --grad-warm: linear-gradient(135deg, #4080FF 0%, #165DFF 100%);
      --grad-aurora: radial-gradient(ellipse 60% 50% at 12% 8%, rgba(22,93,255,0.12), transparent 60%), radial-gradient(ellipse 50% 40% at 88% 92%, rgba(64,128,255,0.08), transparent 60%);
      --ok: #00B42A;
      --err: #F53F3F;
      --warn: #FF7D00;
      --shadow-xs: 0 1px 2px rgba(0,0,0,.30);
      --shadow-sm: 0 1px 3px rgba(0,0,0,.36);
      --shadow-card: 0 2px 10px rgba(0,0,0,.38);
      --shadow-soft: 0 4px 20px rgba(0,0,0,.42);
      --shadow-lg: 0 12px 40px rgba(0,0,0,.50);
      --shadow-glow: 0 0 0 rgba(0,0,0,0);
      --ring: 0 0 0 3px rgba(56,189,248,.30);
    }
    [data-theme="dark"] ::selection {
      background: rgba(22,93,255,.28);
      color: var(--t1);
    }
    [data-theme="dark"] .wizard::-webkit-scrollbar-track {
      background: rgba(255,255,255,.05);
    }
    [data-theme="dark"] .wizard::-webkit-scrollbar-thumb {
      background: rgba(22,93,255,.45);
    }
    [data-theme="dark"] .wizard::-webkit-scrollbar-thumb:hover {
      background: rgba(22,93,255,.65);
    }
    [data-theme="dark"] .wizard {
      scrollbar-color: rgba(22,93,255,.45) rgba(255,255,255,.05);
    }
    @media (min-width: 2560px) {
      :root {
        --fs-scale: 1.24;
      }
    }
    @media (min-width: 1920px) and (max-width: 2559.98px) {
      :root {
        --fs-scale: 1.14;
      }
    }
    @media (min-width: 1600px) and (max-width: 1919.98px) {
      :root {
        --fs-scale: 1.06;
      }
    }
    @media (max-width: 1280px) {
      :root {
        --fs-scale: 0.96;
      }
    }
    @media (max-width: 1024px) {
      :root {
        --fs-scale: 0.92;
      }
    }
    @media (max-width: 760px) {
      :root {
        --fs-scale: 0.90;
      }
    }
    [data-theme="dark"] #stepHero {
      background: linear-gradient(135deg, var(--bg-1) 0%, var(--bg-2) 100%);
    }
    [data-theme="dark"] #stepHero::before {
      background: var(--grad-brand);
    }
    [data-theme="dark"] .structure-notes {
      background: linear-gradient(180deg, rgba(22,93,255,.06), transparent 60%), var(--bg-1);
      border-left-color: var(--brand-text);
    }
    [data-theme="dark"] .structure-notes-body .sn-dim {
      color: var(--brand-text);
    }
    [data-theme="dark"] .free-upload-drop::before {
      background: radial-gradient(circle at 50% 30%, rgba(22,93,255,.10), transparent 60%);
    }
    [data-theme="dark"] .free-upload-icon {
      box-shadow: 0 4px 12px rgba(22,93,255,.35);
    }
    [data-theme="dark"] .free-upload-drop:hover .free-upload-icon {
      box-shadow: 0 6px 18px rgba(22,93,255,.45);
    }
    [data-theme="dark"] .btn.primary {
      background: var(--grad-brand);
      color: #0E42D2;
      box-shadow: 0 1px 2px rgba(22,93,255,.30), 0 4px 12px rgba(22,93,255,.22);
    }
    [data-theme="dark"] .btn.primary:hover {
      box-shadow: 0 1px 2px rgba(22,93,255,.40), 0 6px 20px rgba(22,93,255,.30);
    }
    [data-theme="dark"] .step-panel > .hint {
      background: var(--bg-2);
      border-left-color: var(--brand-soft);
    }
    [data-theme="dark"] {
      --bg-base: var(--bg-2);
      --bg-elevated: var(--bg-1);
      --text-primary: var(--t1);
      --text-secondary: var(--t2);
      --text-tertiary: var(--t3);
      --accent: var(--brand);
    }
    [data-theme="dark"] .demo-examples {
      background: linear-gradient(180deg, rgba(22,93,255,.04), transparent 70%), var(--bg-1);
      border-color: var(--line-subtle);
    }
    [data-theme="dark"] .demo-examples-head {
      color: var(--t2);
    }
    [data-theme="dark"] .demo-examples-head .hint-sub {
      color: var(--t3);
    }
    [data-theme="dark"] .demo-card {
      background: var(--bg-2);
      border-color: var(--line-subtle);
    }
    [data-theme="dark"] .demo-card:hover {
      border-color: var(--brand-text);
      box-shadow: 0 2px 12px rgba(22,93,255,.18);
    }
    [data-theme="dark"] .demo-card-thumb {
      background: var(--bg-3);
    }
    [data-theme="dark"] .demo-card-name {
      color: var(--t1);
    }
    [data-theme="dark"] .demo-card-desc {
      color: var(--t3);
    }
    [data-theme="dark"] .pc-panel {
      background: var(--bg-1);
    }
    [data-theme="dark"] .pc-title {
      color: var(--t2);
    }
    [data-theme="dark"] .pc-slide-all {
      color: var(--t3);
    }
    [data-theme="dark"] .pc-slide-all:hover {
      color: var(--t2);
    }
    [data-theme="dark"] .pc-card {
      background: var(--bg-1);
      border-color: var(--line);
    }
    [data-theme="dark"] .pc-card:hover {
      border-color: var(--brand-text);
      box-shadow: 0 2px 12px rgba(22,93,255,.18);
    }
    [data-theme="dark"] .pc-card.active {
      border-color: var(--brand-text);
      box-shadow: 0 0 0 2px rgba(22,93,255,.3);
    }
    [data-theme="dark"] .pc-card-name {
      color: var(--t1);
    }
    [data-theme="dark"] .pc-placeholder {
      border-color: var(--line-subtle);
    }
    [data-theme="dark"] .pc-card-new {
      border-color: var(--line-subtle);
    }
    [data-theme="dark"] .pc-new-plus {
      color: var(--t3);
    }
    [data-theme="dark"] .pc-card-new:hover {
      border-color: var(--brand-text);
      background: rgba(22,93,255,.08);
    }
    [data-theme="dark"] .pc-card-new:hover .pc-new-plus {
      color: var(--brand-text);
    }
    * {
      box-sizing: border-box;
    }
    html, body {
      margin: 0;
      padding: 0;
    }
    body {
      font-family: var(--font-ui);
      font-size: var(--fs-body);
      line-height: 1.6;
      letter-spacing: -0.003em;
      background: var(--bg-0);
      color: var(--t1);
      min-height: 100vh;
      padding-bottom: 88px;
      -webkit-font-smoothing: antialiased;
      -moz-osx-font-smoothing: grayscale;
      text-rendering: optimizeLegibility;
    }
    @keyframes fadeIn {
      from {
        opacity: 0;
      }
      to {
        opacity: 1;
      }
    }
    @keyframes blurIn {
      from {
        opacity: 0;
        filter: blur(8px);
        transform: translateY(8px);
      }
      to {
        opacity: 1;
        filter: blur(0);
        transform: translateY(0);
      }
    }
    @keyframes slideUp {
      from {
        opacity: 0;
        transform: translateY(16px);
      }
      to {
        opacity: 1;
        transform: translateY(0);
      }
    }
    @keyframes scaleIn {
      from {
        opacity: 0;
        transform: scale(0.96);
      }
      to {
        opacity: 1;
        transform: scale(1);
      }
    }
    @keyframes shimmer {
      0% {
        background-position: -200% 0;
      }
      100% {
        background-position: 200% 0;
      }
    }
    @keyframes float {
      0%, 100% {
        transform: translateY(0);
      }
      50% {
        transform: translateY(-6px);
      }
    }
    .animate-blur-in {
      animation: blurIn 0.5s var(--ease) forwards;
    }
    .animate-slide-up {
      animation: slideUp 0.4s var(--ease) forwards;
    }
    .animate-scale-in {
      animation: scaleIn 0.3s var(--ease) forwards;
    }
    .animate-fade-in {
      animation: fadeIn 0.25s var(--ease) forwards;
    }
    .hidden {
      display: none !important;
    }
    :focus-visible {
      outline: 2px solid var(--brand);
      outline-offset: 2px;
      border-radius: var(--r-sm);
    }
    ::selection {
      background: rgba(22,93,255,.35);
      color: #fff;
    }
    html {
      scroll-behavior: smooth;
    }
    .aurora {
      position: fixed;
      inset: 0;
      z-index: 0;
      overflow: hidden;
      pointer-events: none;
      background: var(--grad-aurora);
      transform: translateZ(0);
    }
    .aurora::before, .aurora::after {
      content: '';
      position: absolute;
      border-radius: 50%;
      filter: blur(28px);
      opacity: .10;
    }
    .aurora::before {
      width: 36vw;
      height: 36vw;
      left: -8vw;
      top: -12vw;
      background: radial-gradient(circle, rgba(22,93,255,0.18), transparent 65%);
    }
    .aurora::after {
      width: 32vw;
      height: 32vw;
      right: -6vw;
      bottom: -10vw;
      background: radial-gradient(circle, rgba(22,93,255,0.14), transparent 65%);
    }
    .topbar {
      position: sticky;
      top: 0;
      z-index: 30;
      display: flex;
      align-items: center;
      justify-content: space-between;
      padding: 10px 24px;
      background: var(--topbar-bg, rgba(255,255,255,0.94));
      border-bottom: 1px solid var(--glass-border);
      box-shadow: var(--shadow-xs);
    }
    .brand {
      display: flex;
      align-items: center;
      gap: 12px;
      min-width: 0;
      flex: 1 1 auto;
    }
    .brand > div {
      min-width: 0;
    }
    .logo {
      width: 36px;
      height: 36px;
      border-radius: var(--r-md);
      display: grid;
      place-items: center;
      font-size: var(--fs-h1);
      color: #fff;
      background: var(--grad-brand);
      box-shadow: var(--shadow-glow);
      flex-shrink: 0;
    }
    .brand-name {
      font-family: var(--font-display);
      font-weight:600;
      font-size: var(--fs-h2);
      letter-spacing: -0.01em;
      white-space: nowrap;
    }
    .brand-sub {
      display: inline-flex;
      align-items: center;
      font-size: var(--fs-small);
      font-weight: 500;
      color: var(--t3);
      padding-left: 9px;
      border-left: 1px solid var(--line-strong);
      letter-spacing: 0.03em;
      white-space: nowrap;
    }
    .step-indicator {
      font-size: var(--fs-small);
      color: var(--t2);
      border: 1px solid var(--line-strong);
      padding: 5px 12px;
      border-radius: var(--r-full);
      background: var(--bg-2);
      font-variant-numeric: tabular-nums;
      flex-shrink: 0;
      box-shadow: var(--shadow-xs);
    }
    .app-shell {
      position: relative;
      z-index: 10;
      width: 100%;
    }
    .sidebar {
      width: var(--sidebar-w);
      flex: 0 0 var(--sidebar-w); /* v60.21: 侧栏禁止压缩——窄视口不再被挤出重叠 */
      min-width: 0;
      background: var(--bg-1);
      border-right: 1px solid var(--line);
      display: flex;
      flex-direction: column;
      overflow: hidden;
    }
    .recent-strip {
      display: flex;
      align-items: stretch;
      gap: 0;
      padding: 0;
      flex-shrink: 0;
      background: var(--bg-1);
    }
    .recent-strip-grid {
      display: flex;
      gap:12px;
      flex: 1;
      flex-wrap: wrap;
    }
    .recent-strip-divider {
      width: 1px;
      height: 20px;
      background: var(--line);
      flex-shrink: 0;
    }
    .recent-strip-link {
      flex-shrink: 0;
      padding: 6px 8px;
      border-radius: 6px;
      color: var(--t3);
      text-decoration: none;
      cursor: pointer;
      transition: color .15s ease;
      display: flex;
      align-items: center;
    }
    .recent-strip-link:hover {
      color: var(--brand-soft);
    }
    .recent-strip-link i {
      width: 16px;
      height: 16px;
    }
    .recent-strip {
      align-items: flex-start;
      flex-wrap: nowrap;
      gap: 0;
      border-bottom: 1px solid var(--line);
    }
    .recent-demos {
      flex: 1 1 50%;
      min-width: 0;
      display: flex;
      flex-direction: column;
      padding: 10px 16px 10px 24px;
      border-right: 1px solid var(--line);
    }
    .recent-projects {
      flex: 1 1 50%;
      min-width: 0;
      display: flex;
      flex-direction: column;
      padding: 10px 24px 10px 16px;
    }
    .recent-block-head {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 8px;
      margin-bottom: 8px;
    }
    .recent-block-title {
      font-size: var(--fs-body);
      font-weight: 500;
      color: var(--t2);
    }
    .demo-examples.demo-examples-top {
      margin: 0;
      padding: 0;
      background: none;
      border: none;
    }
    .demo-examples-grid, .recent-strip-grid {
      display: flex;
      flex-wrap: nowrap;
      overflow-x: auto;
      gap:12px;
      padding-bottom: 6px;
      scrollbar-width: thin;
      flex: 0 1 auto;
      min-width: 0;
    }
    .demo-examples-grid .demo-card, .recent-strip-grid .demo-card {
      flex: 0 0 auto;
      width: 132px;
      padding: 6px;
      gap: 4px;
    }
    .demo-examples-grid .demo-card-thumb, .recent-strip-grid .demo-card-thumb {
      width: 100%;
      aspect-ratio: 16/9;
    }
    .demo-examples-grid .demo-card-name, .recent-strip-grid .demo-card-name {
      font-size: var(--fs-small);
      line-height: 1.3;
      width: 100%;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
      font-weight: 400;
    }
    .demo-examples-grid .demo-card-desc, .recent-strip-grid .demo-card-desc {
      display: none;
    }
    .recent-empty-card {
      flex: 0 0 auto;
      width: 132px;
      min-height: 76px;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      gap: 6px;
      padding: 8px;
      border: 1px dashed var(--line);
      border-radius: 8px;
      color: var(--t3);
      font-size: var(--fs-nano);
      text-align: center;
      cursor: pointer;
      background: var(--bg-2);
      transition: all .15s ease;
    }
    .recent-empty-card:hover {
      border-color: var(--brand-text);
      color: var(--brand-text);
      background: rgba(22,93,255,.06);
    }
    .recent-empty-card .recent-empty-icon {
      font-size: var(--fs-h1);
      opacity: .5;
    }
    @media (max-width: 1023px) {
      .recent-strip {
        flex-wrap: wrap;
      }
      .recent-demos, .recent-projects {
        flex: 1 1 100%;
        padding: 10px 16px;
        border-right: none;
      }
      .recent-demos + .recent-projects {
        border-top: 1px solid var(--line);
      }
    }
    .sidebar-steps {
      display: flex;
      flex-direction: column;
      padding: 8px 6px;
      gap: 2px;
    }
    .step-dot {
      display: flex;
      align-items: center;
      gap:12px;
      padding: 10px 12px;
      border-radius: var(--r-md);
      cursor: pointer;
      border: 1px solid transparent;
      background: transparent;
      font-size: var(--fs-body);
      color: var(--t2);
      transition: var(--duration-fast) var(--ease);
      user-select: none;
      font-weight: 500;
      text-align: left;
      width: 100%;
      position: relative;
    }
    .step-dot:hover {
      background: var(--bg-2);
      color: var(--t1);
    }
    .step-dot:focus-visible {
      outline: var(--ring);
    }
    .step-dot .num {
      width: 22px;
      height: 22px;
      border-radius: var(--r-xs);
      display: grid;
      place-items: center;
      font-size: var(--fs-small);
      font-weight: 600;
      background: var(--bg-2);
      border: 1px solid var(--line);
      color: var(--t3);
      transition: var(--duration-fast) var(--ease);
      font-family: var(--font-display);
      flex-shrink: 0;
    }
    .step-dot .label {
      flex: 1;
      min-width: 0;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }
    .step-dot.active {
      background: rgba(22,93,255,0.08);
      color: var(--brand-text);
      border-color: rgba(22,93,255,0.15);
      font-weight: 600;
    }
    .step-dot.active::before {
      content: '';
      position: absolute;
      left: 0;
      top: 8px;
      bottom: 8px;
      width: 3px;
      border-radius: 0 2px 2px 0;
      background: var(--brand);
    }
    .step-dot.active .num {
      background: var(--brand);
      color: #fff;
      border-color: transparent;
    }
    .step-dot.done {
      color: var(--t2);
    }
    .step-dot.done .num {
      background: var(--bg-2);
      border-color: var(--ok);
      color: var(--ok);
    }
    .step-dot.done .num::after {
      content: '✓';
    }
    .step-dot.done .num {
      font-size: 0;
    }
    .step-dot.done .num::after {
      font-size: var(--fs-body);
    }
    .step-dot.locked {
      cursor: not-allowed;
      color: var(--t3);
      opacity: 0.6;
    }
    .step-dot.locked:hover {
      background: transparent;
      color: var(--t3);
    }
    .step-dot.locked .num {
      background: var(--bg-2);
      border-color: var(--line);
      color: var(--t3);
    }
    .step-dot.locked .num svg {
      width: 12px;
      height: 12px;
    }
    /* v19.0.20: step 2/3 长面板底部加 sticky 操作条，避免按钮藏在很长的面板里 */
    .step-panel[data-step="2"] .step2-sticky-actions,
    .step-panel[data-step="3"] .step3-sticky-actions {
      position: sticky;
      bottom: 0;
      background: var(--bg-1);
      border-top: 1px solid rgba(63,98,133,.16);
      box-shadow: 0 -6px 16px rgba(0,0,0,.08);
      padding: 16px 0 8px;
      margin-top: 16px;
      z-index: 8;
      display: flex;
      gap: 12px;
      align-items: center;
    }
    /* 项目卡首字母 placeholder（v61.09：克制字号 + 浅色背景，不再喧宾夺主） */
    .pc-thumb-initial {
      color: rgba(255,255,255,.92);
      font-size:16px;
      font-weight: 600;
      font-family: var(--font-display);
      letter-spacing: -0.2px;
      /* 用「柔和色相+高亮叠加」替代满饱和 hsl——同一项目名仍可识别，但不再像 banner */
      box-shadow: inset 0 0 0 1px rgba(255,255,255,.12);
    }
    /* v19.0.20: 字段标签内的辅助说明（灰色小字） */
    .field-hint {
      color: var(--t3);
      font-size:12px;
      font-weight: 400;
      margin-left: 8px;
    }
    .sidebar-divider {
      height: 1px;
      background: var(--line);
      margin: 4px 12px;
    }
    .sidebar-recipe {
      flex: 1;
      min-height: 0;
      overflow-y: auto;
      padding: 10px 14px 16px;
    }
    .sidebar-agent {
      padding: 8px 12px 12px;
      max-height: 45vh;
      overflow-y: auto;
      flex-shrink: 0;
    }
    .sidebar-agent-head {
      display: flex;
      align-items: center;
      gap: 8px;
      margin-bottom: 2px;
    }
    .agent-dot {
      background: var(--brand) !important;
    }
    .sidebar-agent-sub {
      font-size: var(--fs-nano);
      color: var(--t3);
      margin-bottom: 8px;
      line-height: 1.4;
    }
    .admin-nav {
      display: flex;
      flex-direction: column;
      flex: 1;
      min-height: 0;
      overflow-y: auto;
      padding: 8px 6px;
      gap: 2px;
    }
    .admin-nav-section {
      display: flex;
      flex-direction: column;
      gap: 1px;
    }
    .admin-nav-label {
      font-size: var(--fs-micro);
      font-weight: 600;
      text-transform: uppercase;
      letter-spacing: 0.05em;
      color: var(--t3);
      padding: 8px 12px 4px;
    }
    .admin-nav-item {
      display: flex;
      align-items: center;
      gap:12px;
      padding: 9px 12px;
      border-radius: var(--r-md);
      border: none;
      background: transparent;
      color: var(--t2);
      font-size: var(--fs-body);
      font-weight: 400;
      cursor: pointer;
      transition: all .15s ease;
      width: 100%;
      text-align: left;
      font-family: inherit;
      position: relative;
    }
    .admin-nav-item:hover {
      background: rgba(22,93,255,.04);
      color: var(--brand-text);
    }
    .admin-nav-item.active {
      background: rgba(22,93,255,.08);
      color: var(--brand-text);
      font-weight: 600;
    }
    .admin-nav-item.active::before {
      content: '';
      position: absolute;
      left: 0;
      top: 8px;
      bottom: 8px;
      width: 3px;
      border-radius: 0 2px 2px 0;
      background: var(--brand);
    }
    .admin-nav-icon {
      width: 18px;
      height: 18px;
      flex-shrink: 0;
    }
    .admin-body {
      padding: 20px 24px;
    }
    .admin-panel {
      display: none;
    }
    .admin-panel.active {
      display: block;
    }
    .admin-section-head {
      margin-bottom: 16px;
    }
    .admin-section-head h2 {
      font-size: var(--fs-h2);
      font-weight: 700;
      color: var(--t1);
      margin: 0 0 4px;
      display: flex;
      align-items: center;
      gap: 8px;
    }
    .admin-section-head h2 i {
      color: var(--brand-text);
    }
    .admin-section-head p {
      font-size: var(--fs-small);
      color: var(--t2);
      margin: 0;
      line-height: 1.5;
    }
    @media (max-width: 1023px) {
      .admin-nav {
        flex-direction: row;
        overflow-x: auto;
        gap: 4px;
        padding: 8px 12px;
        flex: none;
      }
      .admin-nav-section {
        flex-direction: row;
      }
      .admin-nav-label {
        display: none;
      }
      .admin-nav-item {
        width: auto;
        flex-shrink: 0;
        padding: 6px 12px;
        font-size: var(--fs-small);
      }
      .admin-body {
        padding: 16px 14px;
      }
    }
    .sidebar-agent-list {
      display: flex;
      flex-direction: column;
      gap: 6px;
    }
    .sa-item {
      border: 1px solid var(--line);
      border-radius: 8px;
      overflow: hidden;
      transition: border-color .2s ease;
    }
    .sa-item.sa-active {
      border-color: var(--brand-text);
      box-shadow: 0 0 0 2px rgba(22,93,255,.12);
    }
    .sa-item.sa-done {
      border-color: rgba(0,180,42,.3);
    }
    .sa-item.sa-error {
      border-color: rgba(245,63,63,.3);
    }
    .sa-item-head {
      display: flex;
      align-items: center;
      gap: 6px;
      padding: 6px 8px;
      cursor: pointer;
      background: var(--bg-1);
    }
    .sa-item-head:hover {
      background: var(--bg-2);
    }
    .sa-item-icon {
      width: 24px;
      height: 24px;
      border-radius: 6px;
      display: grid;
      place-items: center;
      flex-shrink: 0;
      background: rgba(22,93,255,.1);
      color: var(--brand-text);
    }
    .sa-item-icon i {
      width: 14px;
      height: 14px;
    }
    .sa-item.sa-active .sa-item-icon {
      background: var(--grad-brand, linear-gradient(135deg,#165DFF,#165DFF));
      color: #fff;
    }
    .sa-item.sa-done .sa-item-icon {
      background: rgba(0,180,42,.15);
      color: #00B42A;
    }
    .sa-item.sa-error .sa-item-icon {
      background: rgba(245,63,63,.15);
      color: #F53F3F;
    }
    .sa-item-name {
      font-size: var(--fs-small);
      font-weight: 600;
      color: var(--t1);
      flex: 1;
      min-width: 0;
    }
    .sa-item-status {
      font-size: var(--fs-micro);
      color: var(--t3);
      flex-shrink: 0;
      display: flex;
      align-items: center;
      gap: 3px;
    }
    .sa-item.sa-active .sa-item-status {
      color: var(--brand-text);
    }
    .sa-item.sa-done .sa-item-status {
      color: #00B42A;
    }
    .sa-item.sa-error .sa-item-status {
      color: #F53F3F;
    }
    .sa-item-status .spinner {
      width: 10px;
      height: 10px;
      border-width: 1.5px;
    }
    .sa-item-body {
      display: none;
      padding: 8px;
      background: var(--bg-2);
      border-top: 1px solid var(--line);
    }
    .sa-item.expanded .sa-item-body {
      display: block;
    }
    .sa-skills {
      display: flex;
      flex-wrap: wrap;
      gap: 4px;
      margin-bottom: 6px;
    }
    .sa-skill-tag {
      font-size: var(--fs-micro);
      padding: 2px 6px;
      border-radius: 4px;
      background: var(--bg-1);
      border: 1px solid var(--line);
      color: var(--t2);
      display: inline-flex;
      align-items: center;
      gap: 3px;
    }
    .sa-skill-tag i {
      width: 10px;
      height: 10px;
      color: var(--brand-text);
    }
    .sa-skill-tag .default-mark {
      color: #FF7D00;
      font-weight: 700;
    }
    .sa-think {
      font-size: var(--fs-nano);
      color: var(--t2);
      line-height: 1.5;
      background: var(--bg-1);
      border-radius: 6px;
      padding: 6px 8px;
      border: 1px solid var(--line);
      max-height: 120px;
      overflow-y: auto;
      white-space: pre-wrap;
      word-break: break-all;
    }
    .sa-think-label {
      font-size: var(--fs-micro);
      color: var(--t3);
      margin-bottom: 3px;
      display: flex;
      align-items: center;
      gap: 3px;
    }
    .sa-think-label i {
      width: 10px;
      height: 10px;
    }
    .sa-meta {
      font-size: var(--fs-micro);
      color: var(--t3);
      margin-top: 4px;
      display: flex;
      gap: 8px;
      flex-wrap: wrap;
    }
    .sa-meta span {
      display: inline-flex;
      align-items: center;
      gap: 2px;
    }
    .sa-item.sa-producer {
      border-color: rgba(168, 85, 247, .35);
      background: linear-gradient(135deg, rgba(168,85,247,.04), rgba(22,93,255,.04));
    }
    .sa-item.sa-producer .sa-item-icon {
      background: linear-gradient(135deg, #4080FF, #165DFF);
      color: #fff;
    }
    .sa-auto-badge {
      display: inline-block;
      margin-left: 6px;
      padding: 1px 6px;
      font-size: var(--fs-micro);
      font-weight: 600;
      color: #4080FF;
      background: rgba(168,85,247,.12);
      border-radius: 4px;
      vertical-align: middle;
    }
    .main-area {
      background: var(--bg-0);
      min-width: 0;
    }
    .step-header {
      display: none;
      align-items: center;
      justify-content: space-between;
      gap: 16px;
      padding: 12px 24px;
      background: var(--bg-1);
      border-bottom: 1px solid var(--line);
      flex-shrink: 0;
    }
    .step-header-title {
      font-family: var(--font-display);
      font-size: var(--fs-h1);
      font-weight: 600;
      color: var(--t1);
      letter-spacing: -0.01em;
      line-height: 1.3;
    }
    .step-header-sub {
      font-size: var(--fs-small);
      color: var(--t3);
      margin-top: 2px;
      line-height: 1.4;
    }
    .step-body {
      padding: 20px 28px;
    }
    .step-footer {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 12px;
      padding: 10px 24px;
      background: var(--bg-1);
      border-top: 1px solid var(--line);
    }
    .stepper-wrap {
      display: none;
    }
    .step-panel {
      animation: blurIn 0.45s var(--ease);
      padding-bottom: 8px;
    }
    .step-panel[data-step="2"] {
      display: flex;
      flex-direction: column;
      min-height: 100%;
    }
    .step-panel[data-step="2"] > * {
      flex-shrink: 0;
    }
    /* v61.69 生成配置摘要：用户选择参数顶到生成区顶部, 与流水线融为一体 */
    .gen-config-bar {
      display: flex;
      flex-wrap: wrap;
      gap: 8px;
      align-items: center;
      margin: 10px 0 4px;
      padding: 10px 14px;
      background: var(--bg-2, #f5f6f8);
      border: 1px solid var(--line, #e3e3e8);
      border-radius: var(--r-md, 8px);
    }
    .gen-config-bar .gen-chip {
      font-size: 12px;
      font-weight: 600;
      color: var(--t1, #1a1f2e);
      background: var(--bg-1, #fff);
      border: 1px solid var(--line-strong, #d0d4dc);
      border-radius: 999px;
      padding: 3px 10px;
      white-space: nowrap;
    }
    .gen-action {
      margin-top: auto;
      padding-top: 12px;
      display: flex;
      flex-direction: column;
      gap: 2px;
    }
    .gen-action .stage-bar-wrap {
      margin: 4px 0 12px;
    }
    .gen-action .btn.big {
      margin-bottom: 0;
    }
    .gen-action .gen-progress {
      margin: 8px 0 4px;
    }
    .step-panel > .hint {
      margin: 6px 0 14px;
      padding: 8px 12px;
      background: var(--bg-2);
      border-radius: var(--r-sm);
      border-left: 2px solid var(--line-strong);
      color: var(--t2);
    }
    h2 {
      font-family: var(--font-display);
      font-size: var(--fs-h1);
      font-weight: 700;
      margin: 0 0 10px;
      letter-spacing: -0.015em;
      color: var(--t1);
    }
    .hint {
      color: var(--t3);
      font-size: var(--fs-small);
      margin: 0 0 10px;
      line-height: 1.6;
      max-width: 92ch;
    }
    .hint b {
      font-weight: 600;
      color: var(--t1);
    }
    .field {
      display: block;
      margin: 6px 0;
    }
    .field > span {
      display: block;
      font-size: var(--fs-small);
      color: var(--t2);
      margin-bottom: 6px;
      letter-spacing: .01em;
      font-weight: 500;
    }
    input[type="text"], textarea, select {
      width: 100%;
      padding: 8px 11px;
      border-radius: var(--r-md);
      background: var(--bg-1);
      border: 1px solid var(--line);
      color: var(--t1);
      font-size: var(--fs-body);
      font-family: inherit;
      resize: vertical;
      transition: var(--duration-fast) var(--ease);
    }
    input[type="text"]::placeholder, textarea::placeholder {
      color: var(--t-muted);
    }
    input[type="text"]:focus, textarea:focus, select:focus {
      outline: none;
      border-color: var(--brand-text);
      box-shadow: var(--ring);
      background: var(--bg-1);
    }
    input[type="text"]:hover, textarea:hover, select:hover {
      border-color: var(--line-strong);
    }
    select {
      appearance: none;
      background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%239ca3af' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
      background-repeat: no-repeat;
      background-position: right 10px center;
      padding-right: 32px;
      cursor: pointer;
    }
    .angle-slots {
      display: grid;
      grid-template-columns: repeat(6, 1fr);
      gap: 8px;
      margin-top: var(--space-block);
    }
    .upload-slot {
      cursor: pointer;
      display: block;
    }
    .upload-slot.drag .slot-inner {
      border-color: var(--brand-text);
      background: rgba(22,93,255,.10);
    }
    .slot-inner {
      position: relative;
      border: 1.5px dashed var(--line-strong);
      border-radius: var(--r-md);
      height: 64px;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      gap: 5px;
      background: var(--bg-1);
      transition: var(--duration-normal) var(--ease);
      overflow: hidden;
    }
    .upload-slot:hover .slot-inner {
      border-color: var(--brand-text);
      transform: translateY(-2px);
      z-index: 5;
      box-shadow: var(--shadow-card);
      background: var(--bg-2);
    }
    .slot-icon-badge {
      width: 20px;
      height: 20px;
      border-radius: 6px;
      display: grid;
      place-items: center;
      font-size: var(--fs-small);
      background: rgba(22,93,255,.14);
      border: 1px solid rgba(22,93,255,.25);
      color: var(--brand-soft);
    }
    .slot-label {
      font-size: var(--fs-micro);
      color: var(--t-muted);
      font-weight: 500;
    }
    .slot-thumb {
      position: absolute;
      inset: 0;
      background-size: cover;
      background-position: center;
    }
    .slot-remove {
      position: absolute;
      top: 6px;
      right: 6px;
      width: 22px;
      height: 22px;
      border-radius: 50%;
      border: none;
      cursor: pointer;
      background: rgba(0,0,0,.5);
      color: #fff;
      font-size: var(--fs-small);
      display: none;
      place-items: center;
      z-index: 3;
      transition: .15s;
    }
    /* v60.34: 用户决策——「智能起草/一键成片」CTA 条暂无存在价值，整条隐藏（逻辑与弹窗保留，改 1 行即可恢复） */
    .draft-cta { display: none !important; }
    .draft-cta {
      margin-top: var(--space-block);
      padding: 12px 14px;
      background: var(--bg-1);
      border: 1px solid var(--line);
      border-radius: var(--r-md);
    }
    .draft-mode-row {
      display: flex;
      gap: 8px;
    }
    .draft-mode-row .btn {
      flex: 1;
      padding: 9px 14px;
      font-size: var(--fs-body);
    }
    .draft-mode-row .btn:disabled, .draft-mode-row .btn[disabled] {
      opacity: .45;
      cursor: not-allowed;
      filter: none;
    }
    .draft-cta .hint.sm {
      margin: 8px 0 0;
      line-height: 1.55;
      font-size: var(--fs-nano);
      color: var(--t3);
    }
    .draft-cta .hint.sm b {
      color: var(--t2);
      font-weight: 600;
    }
    .draft-thinking {
      display: flex;
      align-items: center;
      gap: 8px;
      margin-top: 4px;
      padding: 6px 9px;
      border-radius: var(--r-sm);
      background: rgba(22,93,255,.08);
      border: 1px solid rgba(22,93,255,.22);
    }
    .draft-thinking.hidden {
      display: none;
    }
    .thinking-dots {
      display: flex;
      gap: 6px;
      flex-shrink: 0;
      align-items: center;
    }
    .thinking-dots span {
      width: 10px;
      height: 10px;
      border-radius: 50%;
      background: var(--brand);
      animation: thinkBounce 1.2s var(--ease) infinite;
    }
    .thinking-dots span:nth-child(2) {
      animation-delay: .15s;
    }
    .thinking-dots span:nth-child(3) {
      animation-delay: .3s;
    }
    @keyframes thinkBounce {
      0%, 60%, 100% {
        transform: scale(.5);
        opacity: .35;
      }
      30% {
        transform: scale(1);
        opacity: 1;
      }
    }
    .thinking-body {
      flex: 1;
      min-width: 0;
    }
    .thinking-status {
      font-size: var(--fs-body);
      color: var(--t1);
      font-weight: 600;
      line-height: 1.4;
    }
    .thinking-countdown {
      font-size: var(--fs-small);
      color: var(--t3);
      margin-top: 4px;
    }
    .thinking-countdown b {
      color: var(--brand-text);
      font-variant-numeric: tabular-nums;
      font-weight: 700;
    }
    .structure-notes {
      margin-top: 6px;
      background: linear-gradient(180deg, rgba(22,93,255,.025), transparent 60%), var(--bg-1);
      border: 1px solid var(--line);
      border-left: 3px solid var(--brand);
      border-radius: var(--r-md);
      padding: 14px 16px 14px 18px;
      box-shadow: var(--shadow-sm);
      animation: scaleIn 0.3s var(--ease);
    }
    .structure-notes-head {
      display: flex;
      gap:12px;
      align-items: center;
      justify-content: space-between;
      margin-bottom: 8px;
      padding-bottom: 8px;
      border-bottom: 1px dashed var(--line);
    }
    .structure-notes-head .btn {
      margin-left: auto;
      flex-shrink: 0;
    }
    .structure-notes .status {
      display: block;
      margin-top: 8px;
    }
    .structure-notes-head span:first-child {
      font-weight: 700;
      font-size: var(--fs-body);
      color: var(--t1);
      display: inline-flex;
      align-items: center;
      gap: 6px;
    }
    .structure-notes-head span:first-child i[data-lucide] {
      color: var(--brand-text);
      width: 16px;
      height: 16px;
    }
    .structure-notes-hint {
      font-size: var(--fs-nano);
      color: var(--t-muted);
      letter-spacing: .02em;
    }
    .structure-notes-body {
      font-size: var(--fs-body);
      color: var(--t2);
      line-height: 1.6;
      white-space: normal;
      min-width: 0;
    }
    /* vN9 结构定义：五维 → 响应式栅格卡片（全宽铺开，不再窄窄一列） */
    .structure-notes-body .sn-def-list {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(360px, 1fr));
      gap: 10px;
    }
    .structure-notes-body .sn-def-list .sn-row {
      display: flex;
      flex-direction: column;
      gap: 4px;
      padding: var(--sp-2) var(--sp-3);
      border: 1px solid var(--line-subtle);
      border-radius: var(--r-sm);
      background: var(--bg-2, var(--bg-1));
      min-width: 0;
    }
    .structure-notes-body .sn-def-list .sn-row:last-child {
      border: 1px solid var(--line-subtle);
    }
    .structure-notes-body .sn-def-list .sn-dim {
      display: inline-flex;
      align-items: center;
      width: fit-content;
      color: var(--brand-text);
      font-weight: 600;
      font-size: var(--fs-nano);
      text-transform: uppercase;
      letter-spacing: .03em;
      padding: 2px 8px;
      border-radius: var(--r-xs);
      background: rgba(22,93,255,.08);
      height: fit-content;
      white-space: nowrap;
    }
    .structure-notes-body .sn-def-list .sn-val {
      width: 100%;
      color: var(--t1);
      font-size: var(--fs-small,14px);
      line-height: 1.55;
      overflow-wrap: anywhere;
      word-break: break-word;
      max-height:none;
      overflow: visible !important;
    }
    .structure-notes-body .sn-plain {
      color: var(--t2);
      padding: 2px 0;
    }
    .structure-notes-body .sn-section-title {
      margin-top: 10px;
      margin-bottom: 4px;
      font-size: var(--fs-small);
      font-weight: 600;
      color: var(--t1);
      letter-spacing: .02em;
    }
    .structure-notes-body .sn-section-title:first-child {
      margin-top: 0;
    }
    .structure-notes-body .sn-proc {
      color: var(--t3);
      font-size: var(--fs-nano);
      line-height: 1.6;
      background: rgba(120,120,140,.06);
      border-left: 2px solid var(--line);
      padding: 6px 8px;
      border-radius: var(--r-xs);
      margin-bottom: 4px;
    }
    /* v61.68 富渲染：分块标题 + AI 分析过程折叠 + 产品视觉卡 7 字段网格 + 原始记录折叠 */
    .structure-notes-body .sn-p {
      color: var(--t2);
      font-size: var(--fs-small);
      line-height: 1.6;
      padding: 2px 0;
    }
    .structure-notes-body .sn-section {
      margin-top: 8px;
    }
    .structure-notes-body .sn-section:first-child {
      margin-top: 0;
    }
    .structure-notes-body .sn-section-h {
      display: flex;
      align-items: baseline;
      gap: 8px;
      padding: 0 2px 6px;
      border-bottom: 1px dashed var(--line);
      margin-bottom: 8px;
    }
    .structure-notes-body .sn-section-h-ico {
      font-size: 14px;
      line-height: 1;
    }
    .structure-notes-body .sn-section-h-title {
      font-size: var(--fs-small);
      font-weight: 600;
      color: var(--t1);
      letter-spacing: .02em;
    }
    .structure-notes-body .sn-section-h-sub {
      font-size: var(--fs-micro);
      color: var(--t3);
      letter-spacing: .02em;
    }
    .structure-notes-body .sn-def-list {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
      gap: var(--sp-2);
      align-items: stretch;
    }
    .structure-notes-body .sn-collapse {
      border: 1px solid var(--line);
      border-radius: var(--r-sm);
      background: var(--bg-2);
      padding: 0;
      margin-top: 8px;
      transition: border-color .15s ease;
    }
    .structure-notes-body .sn-collapse:first-child {
      margin-top: 0;
    }
    .structure-notes-body .sn-collapse:hover {
      border-color: var(--line-strong);
    }
    .structure-notes-body .sn-collapse > summary {
      list-style: none;
      cursor: pointer;
      user-select: none;
      padding: 6px 10px;
      display: flex;
      align-items: center;
      gap: 8px;
      font-size: var(--fs-small);
      color: var(--t2);
      border-radius: var(--r-sm);
      transition: background .15s ease;
    }
    .structure-notes-body .sn-collapse > summary::-webkit-details-marker {
      display: none;
    }
    .structure-notes-body .sn-collapse > summary::before {
      content: '▸';
      color: var(--brand-text);
      font-size:12px;
      line-height: 1;
      transition: transform .15s ease;
    }
    .structure-notes-body .sn-collapse[open] > summary::before {
      transform: rotate(90deg);
    }
    .structure-notes-body .sn-collapse > summary:hover {
      background: rgba(22,93,255,.04);
    }
    .structure-notes-body .sn-collapse-title {
      flex: 1;
      font-weight: 600;
      color: var(--t1);
    }
    .structure-notes-body .sn-collapse-meta {
      font-size: var(--fs-micro);
      color: var(--t3);
      letter-spacing: .02em;
      flex-shrink: 0;
    }
    .structure-notes-body .sn-collapse-body {
      padding: 4px 10px 10px;
      border-top: 1px dashed var(--line);
    }
    .structure-notes-body .sn-collapse-body.sn-proc {
      background: rgba(120,120,140,.06);
      color: var(--t3);
      font-size: var(--fs-nano);
      line-height: 1.65;
      white-space: pre-wrap;
      word-break: break-word;
      margin-bottom: 0;
      border-left: 2px solid var(--brand-soft, #4080FF);
      border-radius: 0 0 var(--r-xs) var(--r-xs);
      border-top: 0;
    }
    .structure-notes-body .sn-collapse-pre {
      max-height:none;
      overflow: auto;
      margin: 0;
      padding: 8px 10px;
      border-top: 1px dashed var(--line);
      background: var(--bg-1);
      color: var(--t2);
      font-size: var(--fs-nano);
      line-height: 1.55;
      white-space: pre-wrap;
      word-break: break-word;
      border-radius: 0 0 var(--r-sm) var(--r-sm);
      font-family: ui-monospace, 'SF Mono', Menlo, Consolas, monospace;
    }
    /* 产品视觉卡：7 字段网格（卡片化） */
    .structure-notes-body .sn-vcard-grid {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
      gap: 10px;
    }
    .structure-notes-body .sn-vcard-field {
      display: flex; flex-direction: column; gap: 8px; padding: 12px 14px;
      background: var(--bg-1,#fff); border: 1px solid var(--line,#e5e6eb);
      border-radius: 10px; transition: border-color .15s ease, box-shadow .15s ease;
    }
    .structure-notes-body .sn-vcard-field:hover { border-color: var(--brand-soft,#4080FF); box-shadow: 0 2px 8px rgba(22,93,255,.06); }
    .structure-notes-body .sn-vcard-field.is-empty { opacity: .5; }
    .structure-notes-body .sn-vcard-field-head { display: flex; align-items: center; gap: 8px; }
    .structure-notes-body .sn-vcard-icon {
      width: 22px; height: 22px; display: inline-flex; align-items: center; justify-content: center;
      flex-shrink: 0; color: #165DFF; background: rgba(22,93,255,.08); border-radius: 6px;
    }
    .structure-notes-body .sn-vcard-icon svg { width: 14px !important; height: 14px !important; }
    .structure-notes-body .sn-vcard-label { font-size: 13px; font-weight: 600; color: var(--t1,#1D2129); }
    .structure-notes-body .sn-vcard-key { display: none !important; }
    .structure-notes-body .sn-vcard-field-body {
      font-size: 13px; color: var(--t2,#4E5969); line-height: 1.5;
      white-space: normal; word-break: break-word; overflow-wrap: break-word;
    }
    .structure-notes-body .sn-vcard-field.is-empty .sn-vcard-field-body { color: var(--t3,#86909C); font-style: italic; }
    /* 暗色主题微调：折叠块内 monospace 区底色不要太黑 */
    [data-theme="dark"] .structure-notes-body .sn-collapse-pre {
      background: rgba(255,255,255,.02);
    }
    [data-theme="dark"] .structure-notes-body .sn-vcard-field {
      background: rgba(255,255,255,.02);
    }
    [data-theme="dark"] .structure-notes-body .sn-collapse-body.sn-proc {
      background: rgba(255,255,255,.03);
    }
    .structure-notes-body.loading {
      display: flex;
      align-items: center;
      justify-content: center;
      min-height: 120px;
      color: var(--t3);
    }
    .recognize-cta {
      display: flex;
      flex-wrap: wrap;
      align-items: center;
      gap: 8px;
      padding: 10px 12px;
      background: var(--bg-2);
      border: 1px solid var(--line);
      border-radius: var(--r-sm);
      transition: var(--duration-normal) var(--ease);
    }
    .recognize-cta:hover {
      border-color: var(--line-strong);
      box-shadow: var(--shadow-sm);
    }
    .recognize-hint {
      flex-basis: 100%;
      margin: 4px 0 0;
      line-height: 1.55;
      font-size: var(--fs-small);
      color: var(--t3);
    }
    .btn.outline {
      background: var(--bg-1);
      color: var(--p);
      border: 1px solid var(--brand-soft);
      box-shadow: var(--shadow-xs);
    }
    .btn.outline:hover {
      background: rgba(22,93,255,.06);
      border-color: var(--brand-text);
      box-shadow: var(--shadow-sm);
    }
    .btn.outline.loading {
      opacity: .6;
      pointer-events: none;
    }
    .recognize-cta .status {
      color: var(--brand-text);
      font-size: var(--fs-small);
      font-variant-numeric: tabular-nums;
      font-weight: 600;
    }
    .structure-notes .structure-notes-head span:first-child {
      font-size: var(--fs-body);
    }
    .structure-notes-body {
      min-height: 24px;
      white-space: normal;
      font-size: var(--fs-body);
      line-height: 1.6;
    }
    #consistencyPromptBox {
      background: rgba(0,180,42,.06);
      border-color: rgba(0,180,42,.25);
    }
    .cp-type {
      font-weight: 600;
      font-size: var(--fs-body);
      color: var(--t1);
      margin-bottom: 6px;
    }
    .cp-feats {
      margin: 0 0 8px;
      padding-left: 18px;
    }
    .cp-feats li {
      font-size: var(--fs-small);
      color: var(--t2);
      line-height: 1.5;
    }
    .cp-lock {
      font-size: var(--fs-small);
      color: var(--t3);
      line-height: 1.5;
      border-top: 1px dashed rgba(0,180,42,.25);
      padding-top: 6px;
    }
    .upload-grid {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 12px;
      margin: 10px 0;
    }
    .upload-grid .free-upload-section {
      margin-top: 0;
      padding-top: 0;
      border-top: none;
    }
    @media (max-width: 640px) {
      .upload-grid {
        grid-template-columns: 1fr;
      }
      .product-name-keywords-row {
        grid-template-columns: 1fr;
      }
    }
    .demo-examples {
      margin: 12px 0 16px;
      padding: 12px;
      background: var(--bg-elevated, #f8fafc);
      border: 1px solid var(--line-subtle, #e2e8f0);
      border-radius: 10px;
    }
    .demo-examples-head {
      display: flex;
      align-items: center;
      gap: 8px;
      font-size: var(--fs-body);
      font-weight: 600;
      color: var(--text-secondary, #475569);
      margin-bottom: 10px;
    }
    .demo-examples-head .hint-sub {
      font-weight: 400;
      color: var(--text-tertiary, #94a3b8);
      font-size: var(--fs-small);
    }
    .demo-examples-grid {
      display: flex;
      flex-wrap: nowrap;
      overflow-x: auto;
      gap:12px;
      padding-bottom: 6px;
      scrollbar-width: thin;
    }
    .demo-examples-grid .demo-card {
      flex: 0 0 auto;
      width: 132px;
    }
    .demo-card {
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 6px;
      padding: 8px;
      background: var(--bg-base, #fff);
      border: 1px solid var(--line-subtle, #e2e8f0);
      border-radius: 8px;
      cursor: pointer;
      transition: all .15s ease;
      text-align: center;
    }
    .demo-card:hover {
      border-color: var(--accent, #165DFF);
      box-shadow: 0 2px 8px rgba(22,93,255,.15);
      transform: translateY(-1px);
    }
    .demo-card-thumb {
      width: 100%;
      aspect-ratio: 1;
      object-fit: cover;
      border-radius: 6px;
      background: #f1f5f9;
    }
    .demo-card-name {
      font-size: var(--fs-small);
      font-weight: 600;
      color: var(--text-primary, #1e293b);
      line-height: 1.2;
    }
    .demo-card-desc {
      font-size: var(--fs-micro);
      color: var(--text-tertiary, #94a3b8);
      line-height: 1.2;
    }
    .project-cards-bar {
      display: flex;
      align-items: stretch;
      gap: 0;
      margin: 8px 22px 0; /* v60.35: 与下方 step0-cards 主内容卡左右对齐（实测 310/1058） */
      padding: 6px 10px;
      background: var(--bg-1);
      border: 1px solid var(--line);
      border-radius: 0;
      /* v60.12: 最外层硬裁剪——卡片行展开时任何情况下都不越出卡片条、不压到右侧栏 */
      overflow: hidden;
      position: relative;
      min-width: 0;
      box-sizing: border-box;
    }
    .pc-panel {
      flex: 1 1 0;
      min-width: 0;
      display: flex;
      flex-direction: column;
      background: transparent;
      border: none;
      border-radius: 0;
      overflow: hidden; /* v60.12: 面板级裁剪 */
    }
    .pc-panel.collapsed {
      flex: 0 0 auto;
    }
    .pc-panel[data-panel="demo"] {
      border-right: 1px solid var(--line);
      padding-right: 12px;
    }
    .pc-panel[data-panel="projects"] {
      padding-left: 12px;
    }
    .pc-panel-head {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 8px;
      padding: 4px 8px;
      min-height: 28px; /* v60.32: 标题行收紧 */
    }
    .pc-title {
      display: inline-flex;
      align-items: center;
      gap: 6px;
      font-size: var(--fs-body);
      font-weight: 500;
      color: var(--text-secondary, #475569);
      white-space: nowrap;
    }
    .pc-slide-all {
      margin-left: auto;
      font-size: var(--fs-nano);
      font-weight: 400;
      color: var(--text-tertiary, #94a3b8);
      cursor: pointer;
      user-select: none;
      padding: 2px 0;
      transition: color .15s ease, opacity .15s ease;
      /* v60.17: 窄面板下不竖排破字 */
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
      max-width: 9em;
    }
    .pc-slide-all::after {
      content: ' >';
    }
    .pc-slide-all:hover {
      color: var(--text-secondary, #475569);
    }
    .pc-panel.collapsed .pc-slide-all {
      display: none;
    }
    .pc-head-actions {
      display: flex;
      align-items: center;
      gap: 8px;
      margin-left: auto;
    }
    .pc-collapse-btn {
      font-size: var(--fs-nano);
      color: var(--text-tertiary, #94a3b8);
      background: transparent;
      border: 1px solid var(--line-subtle, #e2e8f0);
      padding: 3px 8px;
      cursor: pointer;
      user-select: none;
      transition: color .15s ease, border-color .15s ease, background .15s ease;
      white-space: nowrap;
    }
    .pc-collapse-btn:hover {
      color: var(--text-secondary, #475569);
      border-color: var(--line-strong, #cbd5e1);
      background: var(--bg-2, #f1f5f9);
    }
    .pc-panel.collapsed .pc-collapse-btn {
      color: var(--brand-text, #165DFF);
      border-color: var(--brand-soft, rgba(22,93,255,.25));
    }
    .pc-panel-body {
      padding: 0 12px;
      /* v60.7: 面板展开时不溢出卡片条（内部网格自行横向滚动） */
      overflow: hidden;
      min-height: 0;
    }
    .pc-panel.collapsed .pc-panel-body {
      display: none;
    }
    .pc-grid {
      display: flex;
      flex-wrap: nowrap;
      gap: 6px;
      overflow-x: auto;
      padding-bottom: 6px;
      scrollbar-width: thin;
      scroll-snap-type: x proximity;
    }
    .pc-grid > * {
      flex: 0 0 auto;
      scroll-snap-align: start;
    }
    /* v61.09 项目卡：稍宽稍高，容纳 name + last-updated */
    .pc-card {
      width: 108px;
      height: 132px;
      flex: 0 0 108px;
      display: flex;
      flex-direction: column;
      gap: 4px;
      padding: 6px 5px 5px;
      background: var(--bg-1);
      border: 1px solid var(--line);
      border-radius: 8px;
      cursor: pointer;
      text-align: center;
      transition: border-color .15s ease, box-shadow .15s ease, transform .15s ease;
    }
    .pc-card:hover {
      border-color: var(--accent, #165DFF);
      box-shadow: 0 3px 8px rgba(22,93,255,.12);
      transform: translateY(-1px);
    }
    .pc-card-thumb {
      flex: 1 1 auto;
      min-height: 0;
      background: var(--bg-1, #f8fafc);
      display: flex;
      align-items: center;
      justify-content: center;
      overflow: hidden;
      padding: 2px;
      border-radius: 6px;
    }
    .pc-card-thumb img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      border-radius: 5px;
    }
    .pc-thumb-placeholder {
      width: 100%;
      height: 100%;
      max-width: 56px;
      max-height: 56px;
      opacity: .8;
      border: 1.5px dashed var(--line-strong, #d0d4dc);
      background: var(--bg-2, #f7f8fa);
      border-radius: 4px;
    }
    .pc-card-name {
      flex: 0 0 auto;
      display: -webkit-box;
      -webkit-line-clamp: 2;
      -webkit-box-orient: vertical;
      font-size: 12px;
      font-weight: 600;
      color: var(--text-primary, #1e293b);
      white-space: normal;
      overflow: hidden;
      text-overflow: clip;
      line-height: 1.25;
      min-height: 2.5em;
      max-height: 2.5em;
      padding: 0 1px;
    }
    /* v61.09 项目卡底部：最后更新时间（小型灰色一行） */
    .pc-card-meta {
      flex: 0 0 auto;
      font-size: 9.5px;
      color: var(--t3, #94a3b8);
      letter-spacing: 0;
      line-height: 1.1;
      padding: 0 1px 1px;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
    }
    /* 当前激活项目：左侧细条标识（比 box-shadow 更克制） */
    .pc-card.active {
      border-color: var(--accent, #165DFF);
      box-shadow: inset 3px 0 0 0 var(--accent, #165DFF), 0 2px 6px rgba(22,93,255,.16);
    }
    .pc-card.active .pc-card-name { color: var(--accent, #165DFF); }
    /* v19.0.20: demo 卡允许名称 2 行展示，避免「LV Traine...」这种关键信息被截断 */
    .demo-pc-card .pc-card-name,
    .pc-card-new .pc-card-name {
      display: -webkit-box;
      -webkit-line-clamp: 2;
      -webkit-box-orient: vertical;
      white-space: normal;
      word-break: break-word;
      overflow: hidden;
      text-overflow: clip;
      line-height: 1.15;
      max-height: 2.3em;
    }
    .pc-card-new {
      background: var(--bg-1);
    }
    .pc-card-new .pc-card-thumb {
      background: transparent;
    }
    .pc-new-plus {
      font-size: var(--fs-display);
      font-weight: 300;
      color: var(--text-tertiary, #94a3b8);
      line-height: 1;
    }
    .pc-card-new:hover .pc-new-plus {
      color: var(--accent, #165DFF);
    }
    .pc-placeholder {
      width: 70px;
      height: 100px;
      border: none;
      border-radius: 0;
      background: transparent;
      flex: 0 0 auto;
    }
    @media (max-width: 760px) {
      .project-cards-bar {
        flex-direction: column;
      }
      .pc-panel, .pc-panel.collapsed {
        flex: 1 1 auto;
      }
      .pc-panel[data-panel="demo"] {
        border-right: none;
        border-bottom: 1px solid var(--line);
        padding-right: 0;
        padding-bottom: 12px;
      }
      .pc-panel[data-panel="projects"] {
        padding-left: 0;
        padding-top: 12px;
      }
    }
    .free-upload-section {
      margin-top: var(--space-section);
      padding-top: var(--space-section);
      border-top: 1px solid var(--line-subtle);
    }
    .free-upload-section:first-of-type {
      border-top: none;
      padding-top: 0;
    }
    .advanced-collapse {
      margin-top: 10px;
      border: 1px solid var(--line);
      border-radius: var(--r-md);
      background: var(--bg-1);
      overflow: hidden;
    }
    .advanced-collapse > summary {
      display: flex;
      align-items: center;
      gap:12px;
      padding: 10px 14px;
      cursor: pointer;
      user-select: none;
      list-style: none;
      transition: var(--duration-fast) var(--ease);
    }
    .advanced-collapse > summary::-webkit-details-marker {
      display: none;
    }
    .advanced-collapse > summary:hover {
      background: var(--bg-2);
    }
    .advanced-collapse .ac-title {
      font-weight: 600;
      font-size: var(--fs-body);
      color: var(--t1);
      display: inline-flex;
      align-items: center;
      gap: 6px;
      flex-shrink: 0;
    }
    .advanced-collapse .ac-title i[data-lucide] {
      width: 15px;
      height: 15px;
      color: var(--t3);
    }
    .advanced-collapse .ac-sub {
      font-size: var(--fs-small);
      color: var(--t3);
      flex: 1;
      min-width: 0;
    }
    .advanced-collapse .chev {
      color: var(--t3);
      font-size: var(--fs-small);
      transition: transform var(--duration-fast) var(--ease);
      flex-shrink: 0;
    }
    .advanced-collapse[open] .chev {
      transform: rotate(180deg);
    }
    .advanced-collapse-body {
      padding: 10px 14px 14px;
      border-top: 1px solid var(--line-subtle);
    }
    .advanced-collapse-body > * + * {
      margin-top: 10px;
    }
    .free-upload-head {
      display: flex;
      gap:12px;
      align-items: baseline;
      margin-bottom: 10px;
      flex-wrap: wrap;
    }
    .free-upload-head span:first-child {
      font-weight: 600;
      font-size: var(--fs-h3);
      color: var(--t1);
      display: inline-flex;
      align-items: center;
      gap: 6px;
    }
    .free-upload-head span:first-child i[data-lucide] {
      width: 16px;
      height: 16px;
      color: var(--brand-text);
    }
    .hint-sub {
      font-size: var(--fs-small);
      color: var(--t3);
      line-height: 1.5;
    }
    .free-upload-drop {
      display: block;
      position: relative;
      overflow: hidden;
      border-radius: var(--r-lg);
      padding: 32px 16px;
      text-align: center;
      cursor: pointer;
      background: var(--bg-1);
      border: 1.5px dashed var(--line-strong);
      transition: var(--duration-normal) var(--ease);
    }
    .free-upload-drop::before {
      content: '';
      position: absolute;
      inset: 0;
      background: radial-gradient(circle at 50% 30%, rgba(22,93,255,.06), transparent 60%);
      opacity: 0;
      transition: opacity var(--duration-normal) var(--ease);
      pointer-events: none;
    }
    .free-upload-drop:hover, .free-upload-drop.drag {
      border-color: var(--brand-text);
      border-style: solid;
      background: var(--bg-1);
      transform: translateY(-1px);
      box-shadow: var(--shadow-soft);
    }
    .free-upload-drop:hover::before, .free-upload-drop.drag::before {
      opacity: 1;
    }
    .free-upload-placeholder {
      display: flex;
      flex-direction: column;
      align-items: center;
      gap:12px;
      color: var(--t2);
      font-size: var(--fs-body);
      font-weight: 500;
      position: relative;
      z-index: 1;
    }
    .free-upload-icon {
      width: 40px;
      height: 40px;
      border-radius: 12px;
      display: grid;
      place-items: center;
      background: var(--grad-brand);
      color: #0E42D2;
      transition: var(--duration-normal) var(--ease);
      box-shadow: 0 4px 12px rgba(22,93,255,.25);
    }
    .free-upload-icon i[data-lucide] {
      width: 18px;
      height: 18px;
    }
    .free-upload-drop:hover .free-upload-icon {
      transform: scale(1.08) translateY(-2px);
      box-shadow: 0 6px 18px rgba(22,93,255,.35);
    }
    .free-grid {
      display: grid;
      grid-template-columns: repeat(auto-fill, minmax(108px, 1fr));
      gap: 8px;
      margin-top: 8px;
    }
    .free-grid-item {
      position: relative;
      aspect-ratio: 1;
      border-radius: var(--r-sm);
      overflow: hidden;
      border: 1px solid var(--line-strong);
      cursor: grab;
      background: var(--bg-1);
      transition: var(--duration-normal) var(--ease);
    }
    .free-grid-item:hover {
      border-color: var(--line-strong);
      transform: translateY(-2px);
      box-shadow: var(--shadow-sm);
    }
    .free-grid-item img {
      width: 100%;
      height: 100%;
      object-fit: cover;
    }
    .free-grid-item .free-ph {
      width: 100%;
      height: 100%;
    }
    .free-grid-item .free-remove {
      position: absolute;
      top: 4px;
      right: 4px;
      width: 22px;
      height: 22px;
      border-radius: 50%;
      border: none;
      cursor: pointer;
      background: rgba(0,0,0,.55);
      color: #fff;
      font-size: var(--fs-small);
      display: grid;
      place-items: center;
      z-index: 2;
      transition: .15s;
    }
    .free-grid-item .free-remove:hover {
      background: var(--err);
    }
    .free-loading, .free-error {
      width: 100%;
      height: 100%;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      gap: 4px;
      font-size: var(--fs-small);
    }
    .free-loading {
      background: rgba(22,93,255,.08);
      color: var(--brand-text);
    }
    .free-loading-text {
      font-size: var(--fs-nano);
    }
    .free-error {
      background: rgba(245,63,63,.08);
      color: var(--err);
    }
    .free-error span:first-child {
      font-size: var(--fs-h1);
    }
    .video-extract-progress {
      margin-top: 8px;
      padding: 10px 14px;
      background: var(--bg-2);
      border-radius: 10px;
      display: flex;
      align-items: center;
      gap: 12px;
    }
    .extract-bar {
      flex: 1;
      height: 6px;
      background: var(--bg-4);
      border-radius: 3px;
      overflow: hidden;
    }
    .extract-bar-fill {
      height: 100%;
      background: var(--brand);
      border-radius: 3px;
      transition: width 0.3s var(--ease-in-out);
      width: 0%;
    }
    .extract-status {
      font-size: var(--fs-body);
      color: var(--t2);
      white-space: nowrap;
      font-variant-numeric: tabular-nums;
    }
    .free-grid-item[data-from-video]::after {
      content: '视频帧';
      position: absolute;
      bottom: 2px;
      left: 2px;
      font-size: var(--fs-micro);
      padding: 1px 5px;
      background: rgba(22,93,255,.85);
      color: #fff;
      border-radius: 3px;
      pointer-events: none;
    }
    @media (max-width: 768px) {
      .free-grid {
        grid-template-columns: repeat(auto-fill, minmax(80px, 1fr));
      }
      .wizard {
        grid-template-columns: 1fr;
      }
      .wizard > aside {
        max-width: 520px;
      }
    }
    .upload-slot.filled .slot-remove {
      display: grid;
    }
    .slot-remove:hover {
      background: var(--err);
    }
    .upload-slot.filled .slot-inner {
      border-style: solid;
    }
    .upload-slot.filled .slot-icon-badge, .upload-slot.filled .slot-label {
      display: none;
    }
    .actions-row {
      display: flex;
      align-items: center;
      gap: var(--sp-2);
      margin: 4px 0 0;
      flex-wrap: wrap;
    }
    .qwen-ea-box {
      margin-top: var(--space-section);
      padding: 12px 14px;
      border: 1px solid var(--line-strong);
      border-radius: var(--r-md);
      background: var(--glass-bg);
      box-shadow: var(--shadow-xs);
    }
    .qwen-ea-head {
      display: flex;
      align-items: center;
      justify-content: space-between;
      margin-bottom: 8px;
    }
    .qwen-ea-title {
      font-weight: 700;
      font-size: var(--fs-body);
      display: inline-flex;
      align-items: center;
      gap: 6px;
    }
    .qwen-ea-title i[data-lucide] {
      color: var(--brand-soft);
    }
    .qwen-ea-head {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 12px;
      font-weight: 600;
      color: var(--t1);
    }
    .qwen-ea-head .hint-sub {
      margin-top: 4px;
    }
    .qwen-ea-title, .sn-title {
      display: inline-flex;
      align-items: center;
      gap: 7px;
    }
    .qwen-ea-title svg, .sn-title svg {
      width: 16px;
      height: 16px;
      color: var(--brand-text);
      flex-shrink: 0;
    }
    .sb-step-num svg {
      width: 15px;
      height: 15px;
    }
    #btnClearFree {
      margin-top: var(--space-block);
    }
    .status.err {
      color: var(--err);
    }
    .ap-title {
      display: inline-flex;
      align-items: center;
      gap: 7px;
    }
    .ap-title svg {
      width: 16px;
      height: 16px;
      color: var(--brand-text);
    }
    .free-loading svg, .free-error svg {
      width: 20px;
      height: 20px;
      display: block;
    }
    .switch {
      position: relative;
      display: inline-block;
      width: 46px;
      height: 26px;
      flex: 0 0 auto;
    }
    .switch.sm {
      width: 40px;
      height: 22px;
    }
    .switch input {
      opacity: 0;
      width: 0;
      height: 0;
    }
    .switch .slider {
      position: absolute;
      inset: 0;
      cursor: pointer;
      border-radius: var(--r-full);
      background: var(--bg-4);
      border: 1px solid var(--line);
      transition: .2s;
    }
    .switch .slider::before {
      content: '';
      position: absolute;
      height: 18px;
      width: 18px;
      left: 3px;
      top: 3px;
      background: #fff;
      border-radius: 50%;
      transition: .2s;
      box-shadow: 0 1px 3px rgba(0,0,0,.2);
    }
    .switch.sm .slider::before {
      height: 15px;
      width: 15px;
      left: 3px;
      top: 2.5px;
    }
    .switch input:checked + .slider {
      background: var(--grad-brand);
      border-color: transparent;
    }
    .switch input:checked + .slider::before {
      transform: translateX(20px);
    }
    .switch.sm input:checked + .slider::before {
      transform: translateX(18px);
    }
    .admin-wrap {
      max-width: 860px;
      margin: 0 auto;
      padding: 32px 20px 80px;
    }
    .admin-head {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 16px;
      margin-bottom: 28px;
    }
    .admin-brand {
      display: flex;
      align-items: center;
      gap:16px;
    }
    .admin-brand > i {
      width: 46px;
      height: 46px;
      display: grid;
      place-items: center;
      border-radius: var(--r-md);
      background: var(--grad-brand);
      color: #0E42D2;
      box-shadow: 0 4px 12px rgba(0,0,0,.22);
    }
    .admin-brand h1 {
      margin: 0;
      font-size: var(--fs-display);
      color: var(--t1);
      font-weight: 700;
    }
    .admin-brand p {
      margin: 4px 0 0;
      font-size: var(--fs-body);
      color: var(--t3);
    }
    .admin-main {
      display: flex;
      flex-direction: column;
      gap: 20px;
    }
    .admin-card {
      border: 1px solid var(--line);
      border-radius: var(--r-lg);
      background: var(--bg-1);
      overflow: hidden;
      box-shadow: var(--shadow-card);
    }
    .admin-card-head {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 16px;
      padding: 18px 22px;
      border-bottom: 1px solid var(--line);
      background: var(--bg-2);
    }
    .admin-card-title {
      display: flex;
      align-items: center;
      gap:16px;
    }
    .admin-card-title > i {
      width: 40px;
      height: 40px;
      display: grid;
      place-items: center;
      border-radius: var(--r-md);
      background: rgba(22,93,255,.14);
      color: var(--brand-text);
    }
    .admin-card-title h2 {
      margin: 0;
      font-size: var(--fs-h1);
      color: var(--t1);
      font-weight: 600;
    }
    .admin-sub {
      margin: 4px 0 0;
      font-size: var(--fs-body);
      color: var(--t3);
      max-width: 560px;
      line-height: 1.5;
    }
    .admin-card-body {
      padding: 18px 22px;
      display: flex;
      flex-direction: column;
      gap: 12px;
    }
    .kv {
      display: flex;
      align-items: center;
      justify-content: space-between;
      font-size: var(--fs-body);
      padding: 6px 0;
    }
    .kv > span {
      color: var(--t3);
    }
    .kv > b {
      color: var(--t1);
      font-weight: 600;
    }
    .kv > b.ok {
      color: var(--ok);
    }
    .kv > b.warn {
      color: var(--warn);
    }
    .admin-note {
      font-size: var(--fs-body);
      color: var(--t3);
      line-height: 1.6;
      margin: 4px 0 0;
    }
    .admin-actions {
      padding: 16px 22px;
      border-top: 1px solid var(--line);
      display: flex;
      align-items: center;
      gap:16px;
      background: var(--bg-2);
    }
    .admin-foot {
      font-size: var(--fs-small);
      color: var(--t-muted);
      text-align: center;
      margin-top: 8px;
    }
    .admin-foot code {
      background: var(--bg-2);
      padding: 3px 8px;
      border-radius: var(--r-xs);
      color: var(--t2);
      border: 1px solid var(--line);
    }
    .status {
      font-size: var(--fs-body);
      color: var(--ok);
      font-weight: 500;
    }
    .white-grid {
      display: grid;
      grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
      gap: 12px;
      margin-top: 16px;
    }
    .white-item {
      position: relative;
      background: var(--bg-2);
      border: 1px solid var(--line);
      border-radius: var(--r-sm);
      padding: 10px;
      overflow: hidden;
      box-shadow: var(--shadow-xs);
    }
    .white-cap {
      font-size: var(--fs-small);
      color: var(--t3);
      margin-bottom: 6px;
      display: flex;
      justify-content: space-between;
    }
    .white-cap .badge {
      color: var(--ok);
    }
    .white-canvas, .white-orig {
      width: 100%;
      border-radius: 8px;
      background: #fff;
      display: block;
      aspect-ratio: 1/1;
      object-fit: contain;
    }
    .white-orig {
      position: absolute;
      inset: 10px 10px 10px;
      opacity: 0;
      transition: .25s var(--ease);
    }
    .white-item:hover .white-orig {
      opacity: 1;
    }
    .white-hint {
      position: absolute;
      bottom: 12px;
      left: 0;
      right: 0;
      text-align: center;
      font-size: var(--fs-nano);
      color: var(--t1);
      opacity: 0;
      transition: .2s;
      pointer-events: none;
      background: rgba(0,0,0,.4);
    }
    .white-item:hover .white-hint {
      opacity: 1;
    }
    .asset-pack {
      margin-top: 22px;
      padding: 16px;
      border: 1px solid var(--line);
      border-radius: var(--r-md);
      background: var(--bg-2);
      box-shadow: var(--shadow-card);
    }
    .ap-head {
      display: flex;
      flex-direction: column;
      gap: 4px;
      margin-bottom: 12px;
    }
    .ap-head > span:first-child {
      font-size: var(--fs-body);
      font-weight: 700;
      color: var(--t1);
    }
    .ap-grid {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(130px, 1fr));
      gap: 12px;
    }
    .ap-cell {
      padding: 12px;
      border: 1px solid var(--line);
      border-radius: var(--r-sm);
      background: var(--bg-1);
      text-align: center;
      transition: var(--duration-fast) var(--ease);
    }
    .ap-cell:hover {
      transform: translateY(-2px);
      box-shadow: var(--shadow-sm);
    }
    .ap-val {
      font-size: var(--fs-h2);
      font-weight: 700;
      color: var(--t1);
      margin-bottom: 4px;
    }
    .ap-label {
      font-size: var(--fs-small);
      color: var(--t3);
    }
    .ap-cell.status-ok {
      border-color: rgba(0,180,42,.45);
      background: rgba(0,180,42,.08);
    }
    .ap-cell.status-ok .ap-val {
      color: var(--ok);
    }
    .ap-cell.status-warn {
      border-color: rgba(245,158,11,.45);
      background: rgba(245,158,11,.08);
    }
    .ap-cell.status-warn .ap-val {
      color: var(--warn);
    }
    .ap-cell.status-mute .ap-val {
      color: var(--t3);
    }
    .ap-lock {
      margin-top: 12px;
      padding: 10px 12px;
      border-radius: var(--r-sm);
      background: rgba(22,93,255,.08);
      border: 1px dashed var(--line-strong);
      font-size: var(--fs-small);
      color: var(--t1);
      line-height: 1.6;
    }
    @media (max-width: 640px) {
      .prep-grid {
        grid-template-columns: 1fr;
      }
      .field.span2 {
        grid-column: auto;
      }
    }
    .opt-grid {
      display: grid;
      grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));
      gap: 8px;
    }
    .opt-grid.compact {
      grid-template-columns: repeat(auto-fill, minmax(112px, 1fr));
      gap: 8px;
    }
    /* v20.0.71：推荐卡区（卖点/客群/风格）固定最多 5 列、宽度下限 128px，
       避免 auto-fill 在宽容器里排 8-10 列把卡片压成 66px 细条（用户反馈卡片排版不美观） */
    #pointOptions, #audienceOptions, #tonePresets {
      grid-template-columns: repeat(auto-fill, minmax(128px, 1fr));
      max-width: 720px;
    }
    /* v20.0.72：时长/比例/平台 —— 短选项 chip 模式：水平紧凑排列、无图标无描述、小 padding，
       卡片高度显著降低（用户反馈六类卡片整体偏大） */
    .chip-grid .opt-card {
      flex-direction: row;
      align-items: center;
      gap: 6px;
      padding: 5px 10px;
      min-height: 30px;
      border-radius: 8px;
    }
    .chip-grid .opt-card .opt-icon { display: none; }
    .chip-grid .opt-card .opt-sub { display: none; }
    .chip-grid .opt-card .opt-name {
      font-size: var(--fs-small);
      font-weight: 600;
      line-height: 1.2;
      -webkit-line-clamp: 1;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
    }
    .chip-grid .opt-card .opt-check {
      position: static;
      width: 14px;
      height: 14px;
      flex: 0 0 auto;
      margin-left: auto;
      opacity: 0;
      transform: scale(.5);
    }
    .chip-grid .opt-card.selected .opt-check {
      opacity: 1;
      transform: scale(1);
    }
    /* 卖点/客群/风格 —— 有描述的小卡：图标缩小、名称 1 行、描述 1 行超小号 */
    #pointOptions, #audienceOptions, #tonePresets .opt-card {
      padding: 6px 8px;
    }
    /* v20.0.72：卖点/客群/风格卡片隐藏占位图标（三个点/色块占 18px 高度收益低），
       改为名称+描述上下紧凑排列，与 chip 模式视觉统一 */
    #pointOptions .opt-card .opt-icon,
    #audienceOptions .opt-card .opt-icon,
    #tonePresets .opt-card .opt-icon { display: none; }
    #pointOptions .opt-card .opt-name,
    #audienceOptions .opt-card .opt-name,
    #tonePresets .opt-card .opt-name {
      font-size: var(--fs-small);
      font-weight: 600;
      line-height: 1.2;
      -webkit-line-clamp: 1;
    }
    #pointOptions .opt-card .opt-sub,
    #audienceOptions .opt-card .opt-sub,
    #tonePresets .opt-card .opt-desc {
      font-size:12px;
      line-height: 1.2;
      -webkit-line-clamp: 1;
      margin-top: 0;
    }
    /* 风格卡（tone）单列高度也收紧 */
    #tonePresets .opt-card {
      gap: 1px;
    }
    /* 平台 chip 行布局：让平台/时长/比例在宽容器里保持紧凑多行 */

    .tone-presets {
      display: grid;
      grid-template-columns: repeat(auto-fill, minmax(100px, 1fr));
      gap: 6px;
      margin-bottom: var(--space-block);
      max-width: 420px;
    }
    .tone-presets .opt-card {
      padding: 8px 10px;
      gap: 3px;
    }
    .opt-card {
      position: relative;
      text-align: left;
      cursor: pointer;
      padding: 9px 11px;
      border-radius: var(--r-md);
      background: var(--bg-1);
      border: 1px solid var(--line);
      color: var(--t1);
      display: flex;
      flex-direction: column;
      gap: 2px;
      transition: var(--duration-fast) var(--ease);
      font-family: inherit;
      animation: popIn .30s var(--ease) backwards;
      min-width: 0;
      overflow: hidden;
    }
    /* Agent 自动调用时，左侧候选 chips 的工作状态徽标（执行中/已完成/失败/待命） */
    .opt-card .agent-chip-status {
      position: absolute; top: 4px; right: 6px;
      font-size:12px; font-weight: 700; line-height: 1;
      padding: 2px 6px; border-radius: 999px;
      white-space: nowrap; pointer-events: none; z-index: 2;
    }
    .opt-card .agent-chip-status.st-active { color: #fff; background: rgba(22,93,255,.92); }
    .opt-card .agent-chip-status.st-done { color: #00B42A; background: rgba(0,180,42,.15); border: 1px solid rgba(0,180,42,.4); }
    .opt-card .agent-chip-status.st-error { color: #F53F3F; background: rgba(245,63,63,.12); border: 1px solid rgba(245,63,63,.35); }
    .opt-card .agent-chip-status.st-pending { color: #64748b; background: var(--bg-2); border: 1px solid var(--line); }
    .opt-card:nth-child(2) {
      animation-delay: .04s;
    }
    .opt-card:nth-child(3) {
      animation-delay: .08s;
    }
    .opt-card:nth-child(4) {
      animation-delay: .12s;
    }
    .opt-card:nth-child(5) {
      animation-delay: .16s;
    }
    .opt-card:nth-child(6) {
      animation-delay: .20s;
    }
    .opt-card:nth-child(7) {
      animation-delay: .24s;
    }
    .opt-card:nth-child(8) {
      animation-delay: .28s;
    }
    .opt-card:nth-child(9) {
      animation-delay: .32s;
    }
    .opt-card:nth-child(n+10) {
      animation-delay: .36s;
    }
    @keyframes popIn {
      from {
        opacity: 0;
        transform: translateY(10px) scale(.98);
      }
      to {
        opacity: 1;
        transform: none;
      }
    }
    .opt-card:hover {
      border-color: var(--brand-soft);
      background: var(--bg-2);
    }
    .opt-icon {
      width: 18px;
      height: 18px;
      border-radius: 5px;
      display: grid;
      place-items: center;
      font-size: var(--fs-micro);
      background: var(--bg-2);
      border: 1px solid var(--line);
      margin-bottom: 3px;
      transition: var(--duration-fast) var(--ease);
      color: var(--brand-soft);
    }
    .opt-card.selected {
      border-color: var(--brand-text);
      background: rgba(22,93,255,.06);
      box-shadow: var(--shadow-glow);
    }
    .opt-card.selected .opt-icon {
      background: var(--grad-brand);
      border-color: transparent;
      color: #fff;
    }
    .opt-name {
      font-size: var(--fs-small);
      font-weight: 600;
      font-family: var(--font-display);
      letter-spacing: -0.005em;
      line-height: 1.25;
      word-break: break-word;
      display: -webkit-box;
      -webkit-line-clamp: 2;
      -webkit-box-orient: vertical;
      overflow: hidden;
    }
    .opt-sub {
      font-size: var(--fs-micro);
      color: var(--t3);
      line-height: 1.3;
      word-break: break-word;
      display: -webkit-box;
      -webkit-line-clamp: 1;
      -webkit-box-orient: vertical;
      overflow: hidden;
    }
    .opt-card.selected .opt-sub {
      color: var(--t2);
    }
    .opt-desc {
      font-size: var(--fs-micro);
      color: var(--t-muted);
      line-height: 1.3;
      margin-top: 1px;
      display: -webkit-box;
      -webkit-line-clamp: 1;
      -webkit-box-orient: vertical;
      overflow: hidden;
    }
    .opt-check {
      position: absolute;
      bottom: 5px;
      right: 5px;
      width: 15px;
      height: 15px;
      border-radius: 50%;
      background: var(--grad-brand);
      display: grid;
      place-items: center;
      color: #fff;
      font-size:12px;
      opacity: 0;
      transform: scale(.5);
      transition: var(--duration-normal) var(--ease);
      box-shadow: 0 2px 6px rgba(22,93,255,.3);
      z-index: 1;
    }
    .opt-card.selected .opt-check {
      opacity: 1;
      transform: scale(1);
    }
    .opt-card.recommended {
      border-color: rgba(255,159,28,.55);
      background: rgba(255,159,28,.05);
      box-shadow: none;
    }
    .opt-card.recommended:hover {
      border-color: rgba(255,159,28,.8);
    }
    .opt-card.recommended.selected {
      border-color: var(--brand-text);
      background: rgba(22,93,255,.06);
      box-shadow: var(--shadow-glow);
    }
    /* v61.35：超出模型单段能力的镜头密度档位——置灰不可选（用户可见原因，不静默隐藏） */
    .opt-card.disabled {
      opacity: .45;
      cursor: not-allowed;
      filter: grayscale(.6);
    }
    .opt-card.disabled:hover {
      border-color: var(--line);
      background: var(--bg-1);
    }
    .opt-card.disabled.selected {
      border-color: var(--line);
      background: var(--bg-1);
      box-shadow: none;
    }
    .opt-rec-badge {
      position: absolute;
      top: 6px;
      right: 6px;
      font-size:12px;
      font-weight: 700;
      color: #7c4b00;
      background: linear-gradient(135deg, #ffd68a, #ffb74d);
      border-radius: 20px;
      padding: 0 6px;
      pointer-events: none;
      line-height: 1.5;
      z-index: 2;
    }
    .custom-recip-row {
      display: flex;
      gap: 6px;
      margin-top: 8px;
    }
    .custom-recip-row .brief-input {
      flex: 1;
    }
    .sel-count {
      font-size: var(--fs-small);
      color: var(--t3);
      margin: 4px 0 10px;
    }
    .sel-count b {
      color: var(--brand-text);
    }
    /* v61.70 修复摘要右边大面积空白: 单列kv中value短留白多 -> 改2列网格填满 */
    .summary {
      background: var(--bg-2);
      border: 1px solid var(--line);
      border-radius: var(--r-md);
      padding: 8px 14px;
      margin: 4px 0 6px;
      box-shadow: var(--shadow-xs);
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      column-gap: 24px;
    }
    .sum-row {
      display: flex;
      align-items: baseline;
      gap: 8px;
      padding: 7px 0;
      border-bottom: 1px solid var(--line);
      min-width: 0;
    }
    /* 2列末行: 去掉最后一项及倒数第二项的底边(避免最后一行残留分隔线) */
    .sum-row:nth-last-child(-n+2) {
      border-bottom: none;
    }
    .sum-k {
      color: var(--t3);
      font-size: var(--fs-small);
      flex-shrink: 0;
      min-width: 60px;
    }
    .sum-v {
      font-weight: 600;
      font-size: var(--fs-body);
      text-align: left;
      color: var(--t1);
      word-break: break-word;
      flex: 1;
      min-width: 0;
    }
    .btn {
      border: none;
      cursor: pointer;
      padding: 8px 14px;
      border-radius: var(--r-md);
      font-size: var(--fs-body);
      font-weight: 600;
      font-family: inherit;
      letter-spacing: -0.003em;
      transition: var(--duration-fast) var(--ease);
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 6px;
      white-space: nowrap;
    }
    /* v19.0.20: 按钮 disabled 全局统一视觉（之前 ghost 在 disabled 时仍像可点） */
    .btn:disabled,
    .btn[disabled] {
      opacity: 0.45;
      cursor: not-allowed;
      filter: grayscale(0.5);
      pointer-events: none;
    }
    .btn.sm {
      padding: 6px 11px;
      font-size: var(--fs-small);
      border-radius: var(--r-sm);
    }
    .btn.tiny {
      font-size: var(--fs-small);
      padding: 6px 10px;
      flex: 1;
    }
    .btn.block {
      width: 100%;
    }
    .btn:active {
      transform: scale(.98);
    }
    .btn.primary {
      background: var(--brand);
      color: #fff;
      box-shadow: 0 1px 2px rgba(22,93,255,.28), 0 4px 12px rgba(22,93,255,.20);
    }
    .btn.primary:hover {
      filter: brightness(1.06);
      box-shadow: 0 1px 2px rgba(22,93,255,.34), 0 6px 20px rgba(22,93,255,.28);
      transform: translateY(-1px);
    }
    .btn.primary:disabled {
      opacity: .5;
      cursor: not-allowed;
      filter: none;
      box-shadow: none;
      transform: none;
    }
    .btn.ghost {
      background: var(--bg-1);
      color: var(--t1);
      border: 1px solid var(--line);
      box-shadow: var(--shadow-xs);
    }
    .btn.ghost:hover {
      border-color: var(--line-strong);
      background: var(--bg-2);
      transform: translateY(-1px);
    }
    .btn.big {
      width: 100%;
      padding: 13px;
      font-size: var(--fs-h2);
      margin-bottom: 14px;
    }
    .spinner {
      width: 14px;
      height: 14px;
      border-radius: 50%;
      border: 2px solid currentColor;
      @supports (color: color-mix(in lab, red, red)) {
        border: 2px solid color-mix(in srgb, currentColor 35%, transparent);
      }
      border-top-color: currentColor;
      display: inline-block;
      animation: spin .7s linear infinite;
      flex: 0 0 auto;
    }
    @keyframes spin {
      to {
        transform: rotate(360deg);
      }
    }
    .mode-btn {
      flex: 1;
      min-width: 220px;
      cursor: pointer;
      padding: 14px 18px;
      border-radius: var(--r-md);
      background: var(--bg-2);
      border: 1.5px solid var(--line);
      color: var(--t3);
      font-size: var(--fs-body);
      font-weight: 600;
      font-family: inherit;
      transition: var(--duration-normal) var(--ease);
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 8px;
    }
    .mode-btn:hover {
      border-color: var(--line-strong);
      color: var(--t1);
      background: var(--bg-3);
    }
    .mode-btn.active {
      border-color: transparent;
      color: #fff;
      background: var(--grad-brand);
      box-shadow: 0 4px 14px rgba(0,0,0,.28);
    }
    .gen-error {
      background: rgba(245,63,63,.10);
      border: 1px solid var(--err);
      color: var(--err);
      border-radius: var(--r-md);
      padding: 14px 18px;
      margin-bottom: 18px;
      font-size: var(--fs-body);
      font-weight: 600;
    }
    .gen-error ul {
      margin: 8px 0 0;
      padding-left: 20px;
      font-weight: 500;
    }
    .gen-error-flash {
      animation: genErrorFlash 1.1s ease-out;
    }
    @keyframes genErrorFlash {
      0% {
        box-shadow: 0 0 0 3px rgba(245,63,63,.55);
        transform: translateY(-2px);
      }
      100% {
        box-shadow: 0 0 0 0 rgba(245,63,63,0);
        transform: none;
      }
    }
    .gen-progress {
      margin: 6px 0 18px;
    }
    .bar {
      height: 8px;
      background: var(--bg-3);
      border-radius: var(--r-full);
      overflow: hidden;
    }
    .bar-fill {
      height: 100%;
      width: 0%;
      background: var(--grad-brand);
      border-radius: var(--r-full);
      transition: width .2s var(--ease);
    }
    .gen-progress-text {
      font-size: var(--fs-body);
      color: var(--t3);
      margin-top: 8px;
    }
    .gen-elapsed {
      font-size: var(--fs-small);
      color: var(--t-muted);
      margin-top: 6px;
      opacity: .85;
    }
    .stage-bar-wrap {
      margin: 4px 0 16px;
    }
    .stage-bar-label {
      font-size: var(--fs-nano);
      text-transform: uppercase;
      letter-spacing: .08em;
      color: var(--t-muted);
      margin-bottom: 8px;
      font-weight: 600;
    }
    .stage-bar {
      display: flex;
      flex-wrap: wrap;
      gap: 8px;
    }
    .stage-chip {
      display: inline-flex;
      align-items: center;
      gap: 6px;
      padding: 6px 12px;
      border-radius: var(--r-full);
      font-size: var(--fs-small);
      font-weight: 600;
      background: var(--bg-2);
      border: 1px solid var(--line);
      color: var(--t3);
      transition: all .25s var(--ease);
    }
    .stage-chip .spin {
      width: 12px;
      height: 12px;
      border-radius: 50%;
      border: 2px solid rgba(255,255,255,.15);
      border-top-color: var(--brand-text);
      animation: spin .7s linear infinite;
    }
    .stage-chip.run {
      border-color: rgba(22,93,255,.35);
      color: var(--brand-text);
      background: rgba(22,93,255,.06);
    }
    .stage-chip.ok {
      border-color: rgba(0,180,42,.45);
      color: var(--ok);
      background: rgba(0,180,42,.08);
    }
    .stage-chip.warn {
      border-color: rgba(245,158,11,.45);
      color: var(--warn);
      background: rgba(245,158,11,.08);
    }
    .stage-eta {
      font-weight: 500;
      color: var(--t-muted);
      font-variant-numeric: tabular-nums;
    }
    .ai-status {
      margin: 6px 0 14px;
    }
    .ai-tasks {
      display: flex;
      flex-direction: column;
      gap: 8px;
    }
    .ai-task {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 12px;
      padding: 11px 14px;
      border-radius: var(--r-sm);
      font-size: var(--fs-body);
      background: var(--bg-2);
      border: 1px solid var(--line);
    }
    .ai-task .spin {
      width: 14px;
      height: 14px;
      border-radius: 50%;
      margin-right: 8px;
      border: 2px solid rgba(255,255,255,.12);
      border-top-color: var(--brand-text);
      display: inline-block;
      animation: spin .7s linear infinite;
      vertical-align: -2px;
    }
    @keyframes spin {
      to {
        transform: rotate(360deg);
      }
    }
    .ai-task.run {
      border-color: rgba(22,93,255,.35);
    }
    .ai-task.ok {
      border-color: rgba(0,180,42,.4);
      color: #bbf7d0;
    }
    .ai-task.ok .st {
      color: var(--ok);
    }
    .ai-task.bad {
      border-color: rgba(245,63,63,.4);
      color: #fecaca;
    }
    .ai-task .st {
      color: var(--t3);
      white-space: nowrap;
    }
    .clips-gallery {
      display: grid;
      grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
      gap: 12px;
      margin: 8px 0 14px;
    }
    .clip-item {
      background: var(--bg-2);
      border: 1px solid var(--line);
      border-radius: var(--r-md);
      padding: 10px;
      animation: popIn .35s var(--ease) backwards;
      transition: var(--duration-normal) var(--ease);
    }
    .clip-item:hover {
      box-shadow: var(--shadow-card);
      transform: translateY(-2px);
    }
    .clip-item video {
      width: 100%;
      aspect-ratio: 16 / 9;
      object-fit: contain;
      border-radius: 10px;
      background: #000;
      display: block;
    }
    .clip-cap {
      font-size: var(--fs-body);
      color: var(--t1);
      margin: 9px 0 6px;
      font-weight: 600;
      display: -webkit-box;
      -webkit-line-clamp: 2;
      -webkit-box-orient: vertical;
      overflow: hidden;
      line-height: 1.4;
    }
    .clip-dl {
      font-size: var(--fs-body);
      color: var(--brand-text);
      text-decoration: none;
    }
    .clip-dl:hover {
      text-decoration: underline;
    }
    .clip-actions {
      display: flex;
      align-items: center;
      gap: 12px;
      margin-top: 4px;
    }
    .clip-regen {
      font-size: var(--fs-body);
      color: var(--t1);
      background: var(--bg-3);
      border: 1px solid var(--line);
      border-radius: 999px;
      padding: 4px 12px;
      cursor: pointer;
      transition: var(--duration-normal) var(--ease);
    }
    .clip-regen:hover:not(:disabled) {
      border-color: var(--brand-text);
      color: var(--brand-text);
    }
    .clip-regen:disabled {
      opacity: .6;
      cursor: progress;
    }
    .video-wrap {
      margin-top: 12px;
      display: flex;
      flex-direction: column;
      gap: 12px;
      align-items: flex-start;
    }
    .video-card {
      width: 100%;
      max-width: 480px;
      border-radius: var(--r-lg);
      overflow: hidden;
      border: 1px solid var(--line-strong);
      background: var(--glass-bg);
      box-shadow: var(--shadow-soft);
    }
    .video-card video {
      width: 100%;
      display: block;
      background: #000;
    }
    .video-actions {
      display: flex;
      gap: 12px;
      flex-wrap: wrap;
    }
    #downloadLink {
      text-decoration: none;
    }
    .recipe {
      background: transparent;
      border: none;
      border-radius: 0;
      padding: 0;
      box-shadow: none;
      min-width: 0;
    }
    .sidebar-recipe::-webkit-scrollbar {
      width: 6px;
    }
    .sidebar-recipe::-webkit-scrollbar-track {
      background: transparent;
    }
    .sidebar-recipe::-webkit-scrollbar-thumb {
      background: rgba(22,93,255,.25);
      border-radius: var(--r-full);
    }
    .sidebar-recipe {
      scrollbar-color: rgba(22,93,255,.25) transparent;
      scrollbar-width: thin;
    }
    .recipe-head {
      display: flex;
      align-items: center;
      gap: 8px;
      margin-bottom: 4px;
    }
    .recipe-head .dot {
      width: 8px;
      height: 8px;
      border-radius: 50%;
      background: var(--grad-brand);
      box-shadow: 0 0 8px rgba(22,93,255,.45);
    }
    .recipe-title {
      font-family: var(--font-display);
      font-weight: 700;
      font-size: var(--fs-h1);
    }
    .recipe-sub {
      font-size: var(--fs-small);
      color: var(--t-muted);
      margin-bottom: 10px;
      line-height: 1.45;
    }
    .recipe-section {
      margin-bottom: 10px;
    }
    .recipe-section:not(:last-child) {
      padding-bottom: 10px;
      border-bottom: 1px solid var(--line-subtle);
    }
    .recipe-label {
      font-size: var(--fs-nano);
      text-transform: uppercase;
      letter-spacing: .08em;
      color: var(--t-muted);
      margin-bottom: 5px;
      font-weight: 700;
    }
    .recipe-empty {
      font-size: var(--fs-small);
      color: var(--t3);
      line-height: 1.5;
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 6px;
      text-align: center;
      padding: 10px 0;
    }
    .chips {
      display: flex;
      flex-wrap: wrap;
      gap: 6px;
    }
    .chip {
      display: inline-flex;
      align-items: center;
      gap: 5px;
      padding: 5px 10px;
      border-radius: var(--r-full);
      background: var(--bg-3);
      border: 1px solid var(--line);
      font-size: var(--fs-body);
      color: var(--t1);
      cursor: pointer;
      transition: var(--duration-fast) var(--ease);
      animation: popIn .3s var(--ease) backwards;
    }
    .chip:hover {
      border-color: var(--brand-text);
      background: rgba(22,93,255,.10);
      transform: translateY(-1px);
    }
    .chip .ci {
      font-size: var(--fs-small);
    }
    .chip .cx {
      color: var(--t-muted);
      font-size: var(--fs-small);
      margin-left: 2px;
    }
    .chip .cx:hover {
      color: var(--err);
    }
    .recipe-panel {
      margin-bottom: 10px;
      padding: 10px 12px;
      border: 1px solid var(--line);
      border-radius: var(--r-sm);
      background: var(--bg-2);
    }
    .recipe-panel:empty {
      display: none;
    }
    .recipe-panel-title {
      display: flex;
      align-items: center;
      gap: 6px;
      font-size: var(--fs-small);
      font-weight: 700;
      color: var(--t1);
      margin-bottom: 6px;
    }
    .recipe-panel-title .ci {
      color: var(--brand-text);
      display: inline-flex;
    }
    .advice-list {
      list-style: none;
      margin: 0;
      padding: 0;
      display: flex;
      flex-direction: column;
      gap: 6px;
    }
    .advice-item {
      display: flex;
      align-items: flex-start;
      gap: 8px;
      font-size: var(--fs-small);
      color: var(--t2);
      line-height: 1.55;
    }
    .advice-item .dot {
      flex: 0 0 auto;
      width: 6px;
      height: 6px;
      border-radius: 50%;
      background: var(--brand);
      margin-top: 6px;
    }
    .advice-item.ok {
      color: var(--ok);
    }
    .consist-row {
      display: flex;
      align-items: center;
      justify-content: space-between;
      font-size: var(--fs-small);
      color: var(--t3);
      margin-bottom: 4px;
    }
    .consist-bar {
      height: 5px;
      border-radius: 4px;
      background: var(--line);
      overflow: hidden;
      margin: 2px 0 6px;
    }
    .consist-bar > i {
      display: block;
      height: 100%;
      background: var(--grad-brand);
      border-radius: 4px;
      transition: width .3s var(--ease);
    }
    .recipe-consist-cta {
      margin-top: 8px;
    }
    .recipe-params-grid {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 6px 8px;
    }
    .recipe-params-grid .recipe-section {
      margin-bottom: 0;
      padding-bottom: 0;
      border-bottom: none;
      min-width: 0;
    }
    .recipe-params-grid .recipe-label {
      margin-bottom: 4px;
    }
    .recipe-params-grid .chips {
      display: block;
    }
    .param-chip {
      width: 100%;
      justify-content: flex-start;
      padding: 5px 8px;
      border-radius: var(--r-sm);
      background: var(--bg-2);
      border: 1px solid var(--line);
      box-shadow: var(--shadow-xs);
      gap: 6px;
      white-space: nowrap;
      overflow: hidden;
    }
    .param-chip:hover {
      background: rgba(22,93,255,.08);
      border-color: var(--brand-soft);
    }
    .param-chip .ci {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      flex-shrink: 0;
      color: var(--brand-text);
    }
    .param-chip .param-text {
      min-width: 0;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }
    .spin.sm {
      width: 14px;
      height: 14px;
      border: 2px solid var(--line-strong);
      border-top-color: var(--brand-text);
      border-radius: 50%;
      animation: spin .6s linear infinite;
    }
    @keyframes spin {
      to {
        transform: rotate(360deg);
      }
    }
    .nav-copy {
      font-size: var(--fs-micro);
      color: var(--t-muted);
      letter-spacing: .3px;
    }
    .nav-actions {
      display: flex;
      align-items: center;
      gap: 12px;
    }
    .nav-actions .btn {
      font-size: var(--fs-body);
      padding: 7px 16px;
    }
    .site-foot {
      text-align: center;
      font-size: var(--fs-small);
      color: var(--t-muted);
      padding: 18px 16px 26px;
      letter-spacing: .3px;
    }
    @media (max-width: 1023.98px) {
      .app-shell {
        flex-direction: column;
      }
      .sidebar {
        width: 100%;
        flex: none;
        border-right: none;
        border-bottom: 1px solid var(--line);
      }
      .sidebar-steps {
        flex-direction: row;
        padding: 8px 12px;
        gap: 6px;
        overflow-x: auto;
      }
      .sidebar-divider {
        display: none;
      }
      .sidebar-recipe {
        display: none;
      }
      /* v19.0.30 Bug O 修复：step-dot 紧凑到 ~150-180px，让 4 个 step 在 768px 视口都可见 */
      .step-dot {
        flex: 1 1 0;
        min-width: 0;
        flex-shrink: 1;
        padding: 7px 10px;
        border: 1px solid var(--line);
        border-radius: var(--r-full);
        font-size: var(--fs-small);
        gap: 6px;
        justify-content: center;
      }
      .step-dot.active::before {
        display: none;
      }
      .step-dot.active {
        border-color: var(--brand-text);
      }
      /* label 在窄屏隐藏溢出，用 num 编号 + 短 label */
      .step-dot .label {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        max-width: 110px;
      }
      .step-dot .num {
        width: 18px;
        height: 18px;
        font-size: var(--fs-micro);
        flex-shrink: 0;
      }
      .step-header {
        padding: 10px 16px;
      }
      .step-body {
        padding: 12px 16px;
      }
      .project-cards-bar {
        margin: 12px 16px 0;
      }
      .step-footer {
        padding: 8px 16px;
        flex-wrap: wrap;
        gap: 8px;
      }
      .nav-copy {
        width: 100%;
        order: 2;
        text-align: center;
      }
    }
    @media (max-width: 920px) {
      .angle-slots {
        grid-template-columns: repeat(3, 1fr);
      }
    }
    @media (max-width: 860px) {
      .brand {
        min-width: 0;
        flex: 0 1 auto;
      }
      .brand-name {
        font-size: var(--fs-h2);
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        max-width: 160px;
      }
      .brand-sub {
        font-size: var(--fs-micro);
        padding-left: 7px;
      }
      .lib-label {
        font-size: var(--fs-small);
      }
    }
    @media (max-width: 760px) {
      .topbar {
        padding: 8px 12px;
        gap: 8px;
      }
      .topbar-right {
        gap: 6px;
        flex-wrap: nowrap;
        overflow-x: auto;
        scrollbar-width: none;
      }
      .topbar-right::-webkit-scrollbar {
        display: none;
      }
      .lib-btn {
        padding: 7px 9px;
      }
      .lib-label {
        display: inline;
      }
    }
    @media (max-width: 640px) {
      :root {
        --space-frame: 10px;
        --space-section: 8px;
        --space-block: 6px;
      }
      .angle-slots {
        grid-template-columns: repeat(2, 1fr);
      }
      .step-dot .label {
        display: none;
      }
      .step-dot {
        padding: 7px 10px;
      }
      .topbar {
        padding: 8px 12px;
        gap: 8px;
      }
      .brand-name {
        font-size: var(--fs-body);
        max-width: 140px;
      }
      .logo {
        width: 34px;
        height: 34px;
        font-size: var(--fs-h2);
      }
      .topbar-right {
        gap: 6px;
      }
      .lib-btn {
        padding: 6px 9px;
        font-size: var(--fs-small);
        gap: 5px;
      }
      .lib-label {
        /* v9x P1b：移动端保留紧凑标签（截断），避免导航按钮变成空白方块 */
        display: inline-block;
        max-width: 64px;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
      }
      .step-footer {
        padding: 6px 12px 8px;
      }
      .nav-actions {
        gap: 8px;
      }
      .nav-actions .btn {
        font-size: var(--fs-small);
        padding: 6px 12px;
      }
    }
    @media (max-width: 420px) {
      .opt-grid {
        grid-template-columns: repeat(2, 1fr);
      }
      .opt-grid.compact {
        grid-template-columns: repeat(3, 1fr);
      }
      .tone-presets {
        grid-template-columns: repeat(2, 1fr);
      }
      .topbar {
        padding: 6px 10px;
        gap: 6px;
      }
      .topbar-right {
        gap: 4px;
        flex-shrink: 0;
      }
      .brand {
        gap: 8px;
        flex: 0 1 auto;
      }
      .lib-btn {
        padding: 6px;
      }
      .logo {
        width: 32px;
        height: 32px;
      }
      .brand-name {
        font-size: var(--fs-body);
        max-width: none;
      }
      #wikiBtn, #adminBtn {
        display: none;
      }
    }
    @media (min-width: 421px) and (max-width: 768px) {
      .opt-grid {
        grid-template-columns: repeat(3, 1fr);
      }
      .tone-presets {
        grid-template-columns: repeat(3, 1fr);
      }
    }
    .topbar-right {
      display: flex;
      align-items: center;
      gap: 8px;
    }
    .voice-toast {
      position: fixed;
      left: 50%;
      bottom: 96px;
      transform: translateX(-50%);
      z-index: var(--z-toast);
      display: flex;
      align-items: center;
      gap:12px;
      padding: 12px 20px;
      border-radius: var(--r-full);
      max-width: 86vw;
      background: var(--bg-2);
      border: 1px solid var(--line-strong);
      box-shadow: var(--shadow-soft);
      font-size: var(--fs-body);
      color: var(--t1);
      animation: popIn .25s var(--ease);
    }
    .voice-toast-ico {
      font-size: var(--fs-h2);
      color: var(--brand-text);
    }
    .voice-toast-text {
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
    }
    .advanced {
      margin: var(--space-section) 0 4px;
      border: 1px solid var(--line);
      border-radius: var(--r-md);
      background: var(--glass-bg);
      overflow: hidden;
    }
    .advanced-toggle {
      width: 100%;
      display: flex;
      align-items: center;
      gap:12px;
      cursor: pointer;
      padding: 11px 13px;
      background: transparent;
      border: 0;
      color: var(--t1);
      font-family: var(--font-display);
      font-size: var(--fs-body);
      font-weight: 600;
      text-align: left;
      border-radius: var(--r-md);
      transition: var(--duration-fast) var(--ease);
    }
    .advanced-toggle:hover {
      background: rgba(255,255,255,.04);
    }
    .advanced-toggle > span:first-child {
      display: inline-flex;
      align-items: center;
      gap: 7px;
    }
    .advanced-toggle > span:first-child i[data-lucide] {
      width: 18px;
      height: 18px;
      color: var(--brand-soft);
    }
    .adv-sub {
      font-size: var(--fs-nano);
      color: var(--t-muted);
      font-weight: 500;
      font-family: var(--font-ui);
      margin-left: 2px;
    }
    .opt-badge {
      display: inline-block;
      margin-left: 6px;
      font-size: var(--fs-micro);
      font-weight: 500;
      padding: 1px 6px;
      border-radius: var(--r-xs);
      background: var(--bg-2);
      color: var(--t3);
      border: 1px solid var(--line);
      font-family: var(--font-ui);
      vertical-align: middle;
    }
    .chev {
      margin-left: auto;
      color: var(--t3);
      transition: .2s var(--ease);
    }
    .advanced-body {
      max-height: 0;
      opacity: 0;
      overflow: hidden;
      transition: max-height .35s var(--ease), opacity .25s var(--ease);
      padding: 0 12px;
    }
    .advanced-body.open {
      max-height: 1600px;
      opacity: 1;
      padding: 4px 12px 12px;
    }
    .adv-group {
      margin-top: var(--space-block);
    }
    .adv-label {
      font-size: var(--fs-small);
      color: var(--t3);
      margin-bottom: 5px;
      font-weight: 600;
      display: flex;
      align-items: center;
      gap: 5px;
    }
    .opt-grid.compact {
      grid-template-columns: repeat(5, 1fr);
      gap: var(--sp-2);
    }
    .opt-grid.compact .opt-card {
      padding: 7px 9px;
      gap: 4px;
    }
    .opt-grid.compact .opt-name {
      font-size: var(--fs-small);
    }
    .opt-grid.compact .opt-sub {
      font-size: var(--fs-micro);
    }
    /* v20.0.72：chip-grid 高特异性覆盖——隐藏 compact 卡的 28px 大图标（chip 模式无图标） */
    .opt-grid.chip-grid .opt-card.compact .opt-icon,
    .opt-grid.chip-grid .opt-card .opt-icon {
      display: none;
    }
    .opt-card.compact .opt-icon {
      width: 28px;
      height: 28px;
      font-size: var(--fs-body);
      border-radius: 8px;
      display: grid;
      place-items: center;
      background: var(--bg-3);
      border: 1px solid var(--line);
      flex-shrink: 0;
    }
    .custom-add {
      border-style: dashed;
      color: var(--t3);
    }
    .custom-add:hover {
      border-color: var(--brand-text);
      color: var(--brand-soft);
      background: rgba(22,93,255,.06);
    }
    .custom-input {
      grid-column: span 2;
      min-width: 0;
      padding: 10px 12px;
      border-radius: var(--r-sm);
      background: var(--bg-2);
      border: 1px solid var(--brand);
      color: var(--t1);
      font-size: var(--fs-body);
      font-family: var(--font-ui);
      outline: none;
    }
    .batch-control {
      display: flex;
      align-items: center;
      gap:16px;
    }
    .batch-step {
      width: 36px;
      height: 36px;
      border-radius: var(--r-sm);
      font-size: var(--fs-display);
      line-height: 1;
      cursor: pointer;
      background: var(--bg-3);
      border: 1px solid var(--line);
      color: var(--t1);
      transition: var(--duration-fast) var(--ease);
    }
    .batch-step:hover {
      border-color: var(--brand-text);
      color: var(--brand-soft);
      background: var(--bg-4);
    }
    #batchRange {
      flex: 1;
      accent-color: var(--brand-text);
      height: 4px;
    }
    .batch-val {
      font-size: var(--fs-body);
      font-weight: 700;
      color: var(--t1);
      min-width: 46px;
      text-align: center;
    }
    .wizard::-webkit-scrollbar {
      width: 8px;
    }
    .wizard::-webkit-scrollbar-track {
      background: var(--line-subtle);
      border-radius: var(--r-full);
    }
    .wizard::-webkit-scrollbar-thumb {
      background: rgba(22,93,255,.35);
      border-radius: var(--r-full);
      transition: background .2s;
    }
    .wizard::-webkit-scrollbar-thumb:hover {
      background: rgba(22,93,255,.55);
    }
    .wizard {
      scrollbar-color: rgba(22,93,255,.35) var(--line-subtle);
    }
    .settings-card::-webkit-scrollbar, .popup-card::-webkit-scrollbar, .lib-modal::-webkit-scrollbar, .copy-text::-webkit-scrollbar, .advanced-body::-webkit-scrollbar, .tab-content::-webkit-scrollbar, .recipe::-webkit-scrollbar, .admin-card-body::-webkit-scrollbar {
      width: 6px;
    }
    .settings-card::-webkit-scrollbar-track, .popup-card::-webkit-scrollbar-track, .lib-modal::-webkit-scrollbar-track, .copy-text::-webkit-scrollbar-track, .advanced-body::-webkit-scrollbar-track, .tab-content::-webkit-scrollbar-track, .recipe::-webkit-scrollbar-track, .admin-card-body::-webkit-scrollbar-track {
      background: transparent;
    }
    .settings-card::-webkit-scrollbar-thumb, .popup-card::-webkit-scrollbar-thumb, .lib-modal::-webkit-scrollbar-thumb, .copy-text::-webkit-scrollbar-thumb, .advanced-body::-webkit-scrollbar-thumb, .tab-content::-webkit-scrollbar-thumb, .recipe::-webkit-scrollbar-thumb, .admin-card-body::-webkit-scrollbar-thumb {
      background: rgba(0,0,0,.12);
      border-radius: var(--r-full);
      transition: background .2s;
    }
    .settings-card::-webkit-scrollbar-thumb:hover, .popup-card::-webkit-scrollbar-thumb:hover, .lib-modal::-webkit-scrollbar-thumb:hover, .copy-text::-webkit-scrollbar-thumb:hover, .advanced-body::-webkit-scrollbar-thumb:hover, .tab-content::-webkit-scrollbar-thumb:hover, .recipe::-webkit-scrollbar-thumb:hover, .admin-card-body::-webkit-scrollbar-thumb:hover {
      background: rgba(0,0,0,.20);
    }
    .settings-card, .popup-card, .lib-modal, .copy-text, .advanced-body, .tab-content, .recipe, .admin-card-body {
      scrollbar-width: thin;
      scrollbar-color: rgba(0,0,0,.15) transparent;
    }
    .lib-btn {
      display: inline-flex;
      align-items: center;
      gap: 5px;
      cursor: pointer;
      padding: 5px 9px;
      border-radius: 7px;
      font-size: var(--fs-small);
      font-weight: 500;
      color: var(--t2);
      background: transparent;
      border: 1px solid transparent;
      transition: background .15s, color .15s, border-color .15s;
      text-decoration: none;
      letter-spacing: .01em;
    }
    .lib-btn:hover {
      color: var(--t1);
      background: var(--bg-2);
      border-color: var(--line);
    }
    /* v19.0.32 Bug T 修复：顶栏入口按钮（主题/WIKI/Agent/项目/资产）缺 focus ring，键盘可达性差 */
    .lib-btn:focus-visible {
      outline: 2px solid var(--brand, #165DFF);
      outline-offset: 2px;
    }
    .lib-btn:active {
      transform: translateY(0);
    }
    .lib-btn .lib-ico {
      font-size: var(--fs-body);
      color: inherit;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      width: 16px;
      height: 16px;
    }
    .lib-ico:empty, .chip-caret:empty {
      display: none;
    }
    .lib-dropdown {
      position: relative;
    }
    .lib-dropdown-menu {
      position: absolute;
      top: calc(100% + 8px);
      right: 0;
      z-index: 80;
      min-width: 200px;
      padding: 6px;
      border-radius: var(--r-md);
      background: var(--bg-2);
      border: 1px solid var(--line-strong);
      box-shadow: var(--shadow-soft);
      animation: popIn .18s var(--ease);
    }
    .lib-dropdown-menu.hidden {
      display: none;
    }
    .lib-dropdown-menu a {
      display: flex;
      align-items: center;
      gap: 8px;
      padding: 10px 12px;
      border-radius: var(--r-sm);
      font-size: var(--fs-body);
      color: var(--t1);
      text-decoration: none;
      transition: .12s;
    }
    .lib-dropdown-menu a:hover {
      background: rgba(22,93,255,.12);
      color: var(--brand-text);
    }
    .lib-dropdown-menu a i[data-lucide] {
      width: 15px;
      height: 15px;
    }
    svg.lucide {
      flex-shrink: 0;
    }
    [data-lucide] {
      stroke: currentColor;
    }
    .btn i[data-lucide], .mode-btn i[data-lucide], .lib-btn i[data-lucide], .adv-label i[data-lucide], .advanced-toggle i[data-lucide], .chip .ci i[data-lucide], .batch-head i[data-lucide], .banned-head i[data-lucide], .banned-ok i[data-lucide], .voice-toast-ico i[data-lucide], .btn.ghost i[data-lucide] {
      width: 1em;
      height: 1em;
      stroke-width: 2.2;
      vertical-align: -0.12em;
    }
    .logo i[data-lucide] {
      width: 22px;
      height: 22px;
    }
    .opt-icon i[data-lucide] {
      width: 18px;
      height: 18px;
      stroke-width: 2;
    }
    .opt-grid.compact .opt-icon i[data-lucide] {
      width: 15px;
      height: 15px;
    }
    .slot-icon-badge i[data-lucide] {
      width: 15px;
      height: 15px;
      stroke-width: 2;
    }
    .recipe-panel-title .ci i[data-lucide] {
      width: 15px;
      height: 15px;
    }
    .recipe-empty i[data-lucide] {
      width: 26px;
      height: 26px;
      opacity: .65;
      stroke-width: 1.8;
    }
    .opt-check i[data-lucide] {
      width: 14px;
      height: 14px;
    }
    .lib-ico i[data-lucide], .lib-btn i[data-lucide] {
      width: 14px;
      height: 14px;
      stroke-width: 1.8;
    }
    .voice-toast-ico i[data-lucide] {
      width: 16px;
      height: 16px;
    }
    .banned-box {
      margin-top: 12px;
      font-size: var(--fs-body);
      animation: blurIn .3s var(--ease);
    }
    .banned-box:empty {
      display: none;
    }
    .banned-head {
      display: flex;
      align-items: center;
      gap: 8px;
      font-size: var(--fs-body);
      color: var(--warn);
      font-weight: 700;
      margin-bottom: 10px;
    }
    .banned-head .bi, .banned-ok .bi {
      display: inline-flex;
    }
    .banned-words {
      display: flex;
      flex-wrap: wrap;
      gap: 8px;
      margin-bottom: 12px;
    }
    .banned-word {
      display: inline-flex;
      align-items: center;
      gap: 6px;
      padding: 5px 10px;
      border-radius: var(--r-sm);
      background: rgba(245,63,63,.10);
      border: 1px solid rgba(245,63,63,.35);
      color: #fecaca;
      font-size: var(--fs-small);
      font-weight: 700;
      line-height: 1;
    }
    .banned-sug {
      color: var(--warn);
      font-weight: 600;
      font-size: var(--fs-small);
    }
    .banned-n {
      color: var(--t3);
      font-size: var(--fs-nano);
      background: rgba(0,0,0,.2);
      padding: 1px 6px;
      border-radius: var(--r-full);
    }
    .banned-ok {
      display: flex;
      align-items: center;
      gap: 8px;
      padding: 10px 12px;
      border-radius: var(--r-sm);
      background: rgba(0,180,42,.10);
      border: 1px solid rgba(0,180,42,.35);
      color: #bbf7d0;
      font-size: var(--fs-body);
      font-weight: 600;
    }
    .banned-empty {
      color: var(--t3);
      font-size: var(--fs-small);
      padding: 8px 2px;
    }
    .copy-block {
      margin-top: var(--space-section);
      padding: 12px;
      border: 1px solid var(--line);
      border-radius: var(--r-md);
      background: rgba(22,93,255,.04);
    }
    .copy-block .adv-label {
      margin-bottom: 6px;
    }
    .copy-text {
      width: 100%;
      margin-top: 8px;
      resize: vertical;
      padding: 10px 12px;
      background: var(--bg-2);
      border: 1px solid var(--line);
      border-radius: var(--r-sm);
      color: var(--t1);
      font-family: inherit;
      font-size: var(--fs-body);
      line-height: 1.6;
    }
    .copy-text:focus {
      outline: none;
      border-color: var(--brand-text);
      box-shadow: var(--ring);
    }
    .copy-timeline {
      margin-top: 12px;
      padding: 14px;
      border: 1px solid var(--line);
      border-radius: var(--r-md);
      background: var(--bg-2);
    }
    .copy-timeline.hidden {
      display: none;
    }
    .ct-head {
      display: flex;
      align-items: center;
      gap: 6px;
      font-size: var(--fs-body);
      font-weight: 700;
      color: var(--t1);
      margin-bottom: 12px;
    }
    .ct-head i {
      width: 16px;
      height: 16px;
      color: var(--brand-text);
    }
    .ct-list {
      display: flex;
      flex-direction: column;
      gap: 0;
      position: relative;
      padding-left: 8px;
    }
    .ct-list::before {
      content: '';
      position: absolute;
      left: 52px;
      top: 8px;
      bottom: 8px;
      width: 2px;
      background: linear-gradient(180deg, var(--brand), rgba(22,93,255,.15));
      border-radius: 2px;
    }
    .ct-item {
      display: flex;
      align-items: flex-start;
      gap: 12px;
      padding: 8px 0;
      position: relative;
    }
    .ct-time {
      flex-shrink: 0;
      width: 44px;
      text-align: right;
      font-size: var(--fs-nano);
      font-weight: 700;
      color: var(--brand-text);
      font-variant-numeric: tabular-nums;
      padding-top: 2px;
    }
    .ct-dot {
      flex-shrink: 0;
      width: 10px;
      height: 10px;
      border-radius: 50%;
      background: var(--brand);
      border: 2px solid var(--bg-2);
      box-shadow: 0 0 0 2px var(--brand);
      margin-top: 5px;
      z-index: 1;
    }
    .ct-body {
      flex: 1;
      min-width: 0;
    }
    .ct-label {
      font-size: var(--fs-micro);
      font-weight: 600;
      color: var(--t3);
      text-transform: uppercase;
      letter-spacing: .5px;
      margin-bottom: 2px;
    }
    .ct-text {
      font-size: var(--fs-body);
      color: var(--t1);
      line-height: 1.55;
    }
    .agent-activity-panel, .agent-roster-details {
      margin-top: 12px;
      padding: 16px;
      border: 1px solid rgba(22,93,255,.25);
      border-radius: var(--r-md);
      background: linear-gradient(135deg, rgba(22,93,255,.06), rgba(14,165,239,.03));
      transition: opacity .3s ease;
    }
    .agent-roster-details.hidden {
      display: none;
    }
    .agent-roster-degraded {
      display: inline-flex;
      align-items: center;
      gap: 4px;
      margin-bottom: 10px;
      padding: 4px 10px;
      border-radius: var(--r-sm);
      background: rgba(245,63,63,.1);
      color: #F53F3F;
      font-size: var(--fs-small);
      font-weight: 500;
    }
    .agent-roster-progress[data-state="active"]::before {
      content: '';
      display: inline-block;
      width: 12px;
      height: 12px;
      margin-right: 6px;
      border: 2px solid var(--brand);
      border-top-color: transparent;
      border-radius: 50%;
      animation: spin 1s linear infinite;
      vertical-align: middle;
    }
    .agent-activity-header {
      display: flex;
      align-items: center;
      gap: 12px;
      margin-bottom: 14px;
    }
    .agent-activity-icon {
      width: 36px;
      height: 36px;
      border-radius: 10px;
      background: var(--grad-brand, linear-gradient(135deg, #165DFF, #165DFF));
      display: grid;
      place-items: center;
      color: #fff;
      flex-shrink: 0;
    }
    .agent-activity-icon i {
      width: 20px;
      height: 20px;
    }
    .agent-activity-title {
      font-size: var(--fs-body);
      font-weight: 700;
      color: var(--t1);
    }
    .agent-activity-sub {
      font-size: var(--fs-nano);
      color: var(--t3);
      margin-top: 2px;
    }
    .agent-activity-trail {
      display: grid;
      grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
      gap:12px;
    }
    .agent-activity-node {
      display: flex;
      gap: 12px;
      padding: 10px 12px;
      border-radius: var(--r-sm);
      border: 1px solid var(--line);
      background: var(--bg-1);
      transition: all .3s ease;
      opacity: .5;
      min-width: 0;
    }
    .agent-activity-node.agent-status-active {
      opacity: 1;
      border-color: var(--brand-text);
      box-shadow: 0 0 0 2px rgba(22,93,255,.15);
    }
    .agent-activity-node.agent-status-done {
      opacity: .8;
      border-color: rgba(0,180,42,.3);
    }
    .agent-activity-avatar {
      width: 36px;
      height: 36px;
      border-radius: 10px;
      background: rgba(22,93,255,.1);
      display: grid;
      place-items: center;
      color: var(--brand-text);
      flex-shrink: 0;
    }
    .agent-activity-avatar i {
      width: 20px;
      height: 20px;
    }
    .agent-activity-node.agent-status-active .agent-activity-avatar {
      background: var(--grad-brand, linear-gradient(135deg, #165DFF, #165DFF));
      color: #fff;
    }
    .agent-activity-node.agent-status-done .agent-activity-avatar {
      background: rgba(0,180,42,.15);
      color: #00B42A;
    }
    .agent-activity-node.agent-status-error {
      opacity: .8;
      border-color: rgba(245,63,63,.3);
    }
    .agent-activity-node.agent-status-error .agent-activity-avatar {
      background: rgba(245,63,63,.15);
      color: #F53F3F;
    }
    .agent-activity-status-text {
      font-size: var(--fs-nano);
      color: var(--t3);
      margin-top: 2px;
    }
    .agent-activity-node.agent-status-active .agent-activity-status-text {
      color: var(--brand-text);
      font-weight: 500;
    }
    .agent-activity-node.agent-status-done .agent-activity-status-text {
      color: #00B42A;
    }
    .agent-activity-node.agent-status-error .agent-activity-status-text {
      color: #F53F3F;
    }
    .agent-activity-spinner {
      margin-left: auto;
      display: flex;
      align-items: center;
    }
    .agent-activity-body {
      flex: 1;
      min-width: 0;
    }
    .agent-activity-name {
      font-size: var(--fs-body);
      font-weight: 600;
      color: var(--t1);
    }
    .agent-activity-role {
      font-size: var(--fs-nano);
      color: var(--t3);
      font-weight: 400;
      margin-left: 4px;
    }
    .agent-activity-skills {
      display: flex;
      flex-wrap: wrap;
      gap: 6px;
      margin-top: 8px;
    }
    .agent-activity-skill {
      display: inline-flex;
      align-items: center;
      gap: 4px;
      padding: 3px 8px;
      border-radius: 6px;
      background: var(--bg-2);
      border: 1px solid var(--line);
      font-size: var(--fs-nano);
      color: var(--t2);
    }
    .agent-activity-skill-icon {
      display: inline-flex;
      color: var(--brand-text);
    }
    .agent-activity-skill-icon i {
      width: 12px;
      height: 12px;
    }
    .agent-activity-prompt-count {
      font-size: var(--fs-micro);
      color: var(--t3);
    }
    .modal-overlay {
      position: fixed;
      inset: 0;
      z-index: 1000;
      display: flex;
      align-items: center;
      justify-content: center;
      background: rgba(15, 17, 23, .60);
      padding: 20px;
    }
    .modal-card {
      width: min(540px, 100%);
      max-height: 88vh;
      overflow: auto;
      background: var(--bg-1);
      border: 1px solid var(--line);
      border-radius: var(--r-xl);
      box-shadow: var(--shadow-lg);
      animation: scaleIn .22s var(--ease);
    }
    .modal-head {
      display: flex;
      align-items: center;
      justify-content: space-between;
      padding: 18px 20px;
      border-bottom: 1px solid var(--line);
      background: var(--bg-2);
    }
    .modal-title {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      font-weight: 700;
      font-size: var(--fs-h1);
      color: var(--t1);
    }
    .modal-close {
      width: 34px;
      height: 34px;
      border-radius: var(--r-sm);
      border: 1px solid var(--line);
      background: var(--bg-3);
      color: var(--t3);
      cursor: pointer;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      transition: var(--duration-fast) var(--ease);
    }
    .modal-close:hover {
      color: var(--t1);
      border-color: var(--accent);
      background: var(--bg-4);
    }
    .modal-body {
      padding: 18px 20px 22px;
    }
    .think-detail-card {
      max-height: min(78vh, 720px);
      width: min(720px, 92vw);
      display: flex;
      flex-direction: column;
      overflow: hidden;
    }
    .think-detail-body {
      flex: 1;
      overflow: auto;
      white-space: pre-wrap;
      word-break: break-word;
      font-size: var(--fs-small);
      line-height: 1.7;
      color: var(--t2);
      background: var(--bg-2);
      border: 1px solid var(--line);
      border-radius: var(--r-sm, 8px);
      padding: 14px 16px;
      margin: 0;
    }
    .agent-roster-think-detail {
      margin-left: auto;
      margin-right: 6px;
      padding: 1px 8px;
      font-size: var(--fs-nano, 11px);
      line-height: 1.6;
      color: var(--brand-text);
      background: var(--brand-bg-soft);
      border: 1px solid var(--brand-soft);
      border-radius: 999px;
      cursor: pointer;
    }
    .agent-roster-think-detail:hover {
      background: var(--brand-bg-soft2);
    }
    [data-theme="dark"] .agent-roster-think-detail {
      background: rgba(56,189,248,.12);
      border-color: rgba(56,189,248,.4);
      color: var(--brand-text);
    }
    /* v63.11.3 优化：Agent 思考「详情」按钮改柔和幽灵风格（原来蓝色药丸偏重） */
    .agent-roster-think-detail {
      margin-left: auto; margin-right: 6px;
      padding: 2px 7px; font-size: var(--fs-nano, 11px); line-height: 1.5;
      color: var(--t2, #64748b);
      background: transparent; border: 1px solid transparent;
      border-radius: 6px; cursor: pointer; transition: .15s; white-space: nowrap;
    }
    .agent-roster-think-detail:hover { color: var(--brand-text); background: var(--brand-bg-soft); border-color: var(--brand-soft); }
    [data-theme="dark"] .agent-roster-think-detail { color: var(--t2, #94a3b8); background: transparent; border-color: transparent; }
    [data-theme="dark"] .agent-roster-think-detail:hover { color: var(--brand-text); background: rgba(56,189,248,.12); border-color: rgba(56,189,248,.4); }

    /* ============ Agent 状态总览多列弹窗 (v63.11.3) ============ */
    .act-agent-roster-btn {
      padding: 2px 9px; font-size: var(--fs-nano, 11px); line-height: 1.5;
      color: var(--t2, #64748b); background: transparent;
      border: 1px solid var(--line-strong, #e2e8f0); border-radius: 999px;
      cursor: pointer; transition: .15s; white-space: nowrap;
    }
    .act-agent-roster-btn:hover { color: var(--brand-text); background: var(--brand-bg-soft); border-color: var(--brand-soft); }
    .agent-roster-modal-card { width: min(1000px, 94vw); max-width: 1000px; }
    .agent-roster-modal-body {
      display: flex; flex-direction: column; gap:16px;
      max-height: min(72vh, 720px); overflow: auto; padding: 4px 2px 8px;
    }
    .agent-rm-summary { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
    .agent-rm-chip { display: inline-flex; align-items: center; gap: 5px; font-size: var(--fs-small, 12px); color: var(--t2, #64748b); background: var(--bg-1); border: 1px solid var(--line, #e2e8f0); border-radius: 999px; padding: 3px 10px; }
    .agent-rm-dot { width: 8px; height: 8px; border-radius: 999px; display: inline-block; }
    .agent-rm-dot.d-done { background: #00B42A; }
    .agent-rm-dot.d-active { background: #165DFF; animation: pulse 1.2s ease-in-out infinite; }
    .agent-rm-dot.d-error { background: #F53F3F; }
    .agent-rm-dot.d-pending { background: #cbd5e1; }
    .agent-rm-group { display: flex; flex-direction: column; gap:16px; }
    .agent-rm-group-head { display: flex; align-items: center; gap: 8px; font-size: var(--fs-body, 14px); font-weight: 600; color: var(--t1); }
    .agent-rm-group-head i { width: 18px; height: 18px; color: var(--brand-text); }
    .agent-rm-group-sum { margin-left: auto; font-size: var(--fs-small, 12px); font-weight: 500; color: var(--t3, #94a3b8); }
    .agent-rm-grid { display: grid; grid-template-columns: 1fr; gap: 12px; }
    .agent-rm-col { display: flex; flex-direction: column; gap: 9px; border: 1px solid var(--line, #e2e8f0); background: var(--bg-1); border-radius: 12px; padding: 16px 18px; min-width: 0; }
    .agent-rm-col[data-status="active"] { border-color: var(--brand-soft, #4080FF); }
    .agent-rm-col[data-status="error"] { border-color: #fca5a5; }
    .agent-rm-head { display: flex; align-items: center; gap: 8px; }
    .agent-rm-avatar { width: 42px; height: 42px; flex: 0 0 auto; display: flex; align-items: center; justify-content: center; background: var(--bg-2, #f8fafc); border: 1px solid var(--line, #e2e8f0); border-radius: 10px; color: var(--brand-text); }
    .agent-rm-avatar i { width: 20px; height: 20px; }
    .agent-rm-id { min-width: 0; flex: 1; }
    .agent-rm-name { font-size: var(--fs-body, 15px); font-weight: 600; color: var(--t1); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
    .agent-rm-role { font-size: var(--fs-small, 12.5px); color: var(--t3, #94a3b8); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
    .agent-rm-status { flex: 0 0 auto; font-size: var(--fs-nano, 11px); font-weight: 600; padding: 2px 7px; border-radius: 999px; }
    .agent-rm-status[data-status="done"] { color: #00B42A; background: rgba(0,180,42,.12); }
    .agent-rm-status[data-status="active"] { color: #165DFF; background: rgba(22,93,255,.14); }
    .agent-rm-status[data-status="error"] { color: #F53F3F; background: rgba(245,63,63,.12); }
    .agent-rm-status[data-status="pending"] { color: var(--t3, #94a3b8); background: var(--bg-2, #f1f5f9); }
    .agent-rm-meta { display: flex; flex-wrap: wrap; gap: 6px; font-size: var(--fs-nano, 11px); color: var(--t2, #64748b); }
    .agent-rm-meta span { background: var(--bg-2, #f1f5f9); border-radius: 6px; padding: 1px 7px; }
    .agent-rm-out-wrap { min-height: 56px; max-height: 300px; overflow: auto; font-size:14px; line-height: 1.6; color: var(--t2); }
    .agent-rm-out { color: var(--t2, #475569); }
    .agent-rm-out-text { white-space: pre-wrap; color: var(--t2, #475569); }
    .agent-rm-err { color: #F53F3F; background: #fef2f2; border-radius: 6px; padding: 6px 8px; }
    .agent-rm-active { color: #165DFF; }
    .agent-rm-idle { color: var(--t3, #94a3b8); font-size: var(--fs-nano, 11px); }
    .agent-rm-detail { align-self: flex-end; padding: 2px 9px; font-size: var(--fs-nano, 11px); color: var(--brand-text); background: transparent; border: 1px solid var(--brand-soft); border-radius: 6px; cursor: pointer; transition: .15s; }
    .agent-rm-detail:hover { background: var(--brand-bg-soft); }
    [data-theme="dark"] .agent-rm-col { background: var(--bg-2, #1e293b); }
    [data-theme="dark"] .agent-rm-status[data-status="done"] { color: #00B42A; background: rgba(0,180,42,.16); }
    [data-theme="dark"] .agent-rm-status[data-status="active"] { color: #4080FF; background: rgba(22,93,255,.18); }
    [data-theme="dark"] .agent-rm-status[data-status="error"] { color: #F53F3F; background: rgba(245,63,63,.16); }
    @keyframes pulse { 0%,100% { opacity: 1; } 50% { opacity: .45; } }
    .settings-card {
      max-height: min(720px, 90vh);
      overflow: hidden;
      display: flex;
      flex-direction: column;
    }
    .settings-body {
      flex: 1;
      display: flex;
      flex-direction: column;
      overflow: hidden;
      padding: 0;
    }
    .tab-bar {
      display: flex;
      gap: 6px;
      padding: 14px 20px 12px;
      border-bottom: 1px solid var(--line);
      background: var(--bg-2);
      overflow-x: auto;
      scrollbar-width: none;
      -webkit-overflow-scrolling: touch;
    }
    .tab-bar::-webkit-scrollbar {
      display: none;
    }
    .tab-btn {
      display: inline-flex;
      align-items: center;
      gap: 6px;
      white-space: nowrap;
      padding: 8px 16px;
      border-radius: var(--r-full);
      border: 1px solid transparent;
      background: transparent;
      color: var(--t3);
      font-size: var(--fs-body);
      font-weight: 500;
      cursor: pointer;
      transition: all .15s ease;
    }
    .tab-btn:hover {
      background: var(--bg-3);
      color: var(--t1);
    }
    .tab-btn.active {
      background: var(--accent);
      color: #fff;
      border-color: var(--accent);
      box-shadow: 0 4px 12px rgba(22,93,255,.25);
    }
    .tab-btn i {
      width: 15px;
      height: 15px;
    }
    .tab-content {
      flex: 1;
      overflow-y: auto;
      padding: 16px 20px 22px;
    }
    .tab-pane {
      display: none;
      animation: fadeIn .2s ease;
    }
    .tab-pane.active {
      display: block;
    }
    .settings-row {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 12px;
      padding: 13px 0;
      border-bottom: 1px dashed var(--line);
    }
    .settings-row:last-of-type {
      border-bottom: none;
    }
    .settings-label {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      font-size: var(--fs-body);
      color: var(--t1);
      font-weight: 500;
    }
    .settings-label i {
      color: var(--accent);
    }
    .settings-input, .sel {
      flex: 1;
      max-width: 280px;
      padding: 8px 12px;
      font-size: var(--fs-body);
      border: 1px solid var(--line);
      border-radius: var(--r-sm);
      background: var(--bg-2);
      color: var(--t1);
    }
    .settings-input:focus, .sel:focus {
      outline: none;
      border-color: var(--accent);
      box-shadow: var(--ring);
    }
    .sel {
      appearance: none;
      background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%239ca3af' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
      background-repeat: no-repeat;
      background-position: right 10px center;
      padding-right: 32px;
      cursor: pointer;
    }
    .seg {
      display: inline-flex;
      border: 1px solid var(--line);
      border-radius: var(--r-sm);
      overflow: hidden;
      background: var(--bg-2);
    }
    .seg-btn {
      appearance: none;
      border: none;
      background: transparent;
      color: var(--t3);
      padding: 8px 16px;
      font-size: var(--fs-body);
      cursor: pointer;
      display: inline-flex;
      align-items: baseline;
      gap: 4px;
      transition: background .15s, color .15s;
    }
    .seg-btn + .seg-btn {
      border-left: 1px solid var(--line);
    }
    .seg-btn small {
      font-size: var(--fs-nano);
      opacity: .7;
      font-weight: 400;
    }
    .seg-btn:hover {
      background: var(--bg-3);
      color: var(--t1);
    }
    .seg-btn.active {
      background: var(--accent);
      color: #fff;
    }
    .seg-btn.active small {
      opacity: .85;
    }
    .settings-status {
      font-size: var(--fs-body);
      font-weight: 600;
      padding: 4px 12px;
      border-radius: var(--r-full);
    }
    .settings-status.ok {
      color: #00B42A;
      background: rgba(0,180,42,.12);
    }
    .settings-status.warn {
      color: #FF7D00;
      background: rgba(245,158,11,.12);
    }
    .settings-status.pending {
      color: var(--t3);
      background: var(--bg-2);
      border: 1px dashed var(--line);
    }
    .settings-tip {
      font-size: var(--fs-small);
      line-height: 1.6;
      color: var(--t3);
      margin: 12px 0 0;
    }
    .settings-tip code {
      background: var(--bg-3);
      padding: 2px 6px;
      border-radius: var(--r-xs);
      color: var(--accent);
      font-size: var(--fs-nano);
    }
    .popup-card {
      width: min(440px, 100%);
    }
    .popup-card .modal-body p {
      font-size: var(--fs-body);
      line-height: 1.7;
      color: var(--t1);
      margin: 0 0 10px;
    }
    .popup-actions {
      display: flex;
      justify-content: flex-end;
      margin-top: 8px;
    }
    .gen-key-hint {
      margin: 10px 0 4px;
      padding: 9px 12px;
      font-size: var(--fs-small);
      line-height: 1.55;
      color: var(--warn);
      background: rgba(245,158,11,.1);
      border: 1px solid rgba(245,158,11,.35);
      border-radius: var(--r-sm);
    }
    .step-panel h2 {
      font-family: var(--font-display);
      font-weight: 700;
      font-size: var(--fs-h1);
      letter-spacing: -0.015em;
      line-height: 1.3;
      margin: 0 0 8px;
      color: var(--t1);
    }
    .step-panel .hint {
      margin-bottom: 6px;
    }
    .adv-group {
      margin: var(--space-block) 0;
    }
    .custom-row {
      display: flex;
      align-items: center;
      gap: 8px;
      margin-top: 6px;
    }
    .custom-row input[type="text"] {
      flex: 1;
      padding: 8px 12px;
      font-size: var(--fs-body);
      border-radius: var(--r-sm);
      background: var(--bg-2);
      border: 1px solid var(--line);
      color: var(--t1);
      outline: none;
    }
    .custom-row input[type="text"]:focus {
      border-color: var(--brand-text);
      box-shadow: var(--ring);
    }
    .custom-row .btn.sm {
      white-space: nowrap;
    }
    .dur-presets {
      display: grid;
      grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
      gap: 12px;
    }
    .dur-presets .opt-card {
      flex-direction: row;
      align-items: center;
      gap:12px;
      padding: 14px 16px;
    }
    .dur-presets .opt-card .opt-icon {
      width: 26px;
      height: 26px;
      font-size: var(--fs-body);
      margin-bottom: 0;
    }
    .dur-presets .opt-card .opt-name {
      font-size: var(--fs-body);
    }
    #durationSlider {
      width: 100%;
      -webkit-appearance: none;
      appearance: none;
      height: 6px;
      border-radius: var(--r-full);
      outline: none;
      background: linear-gradient(90deg, var(--brand) var(--pct, 8%), rgba(255,255,255,.10) var(--pct, 8%));
    }
    #durationSlider::-webkit-slider-thumb {
      -webkit-appearance: none;
      appearance: none;
      width: 20px;
      height: 20px;
      border-radius: 50%;
      background: #fff;
      border: 3px solid var(--brand);
      box-shadow: 0 3px 10px rgba(22,93,255,.4);
      cursor: pointer;
      transition: .15s var(--ease);
    }
    #durationSlider::-webkit-slider-thumb:hover {
      transform: scale(1.12);
    }
    #durationSlider::-moz-range-thumb {
      width: 20px;
      height: 20px;
      border-radius: 50%;
      background: #fff;
      border: 3px solid var(--brand);
      box-shadow: 0 3px 10px rgba(22,93,255,.4);
      cursor: pointer;
    }
    #durationSlider::-moz-range-progress {
      background: var(--brand);
      height: 6px;
      border-radius: var(--r-full);
    }
    .vp-play {
      position: absolute;
      bottom: 12px;
      right: 12px;
      z-index: 3;
      width: 30px;
      height: 30px;
      border-radius: 50%;
      border: 1px solid var(--line-strong);
      background: rgba(22,93,255,.16);
      color: #fff;
      display: grid;
      place-items: center;
      cursor: pointer;
      transition: .18s var(--ease);
      padding: 0;
    }
    .vp-play:hover {
      background: var(--grad-brand);
      border-color: transparent;
      transform: scale(1.08);
    }
    .vp-play i[data-lucide] {
      width: 15px;
      height: 15px;
    }
    .check-row {
      display: flex;
      align-items: center;
      gap: 9px;
      margin: 14px 0 4px;
      font-size: var(--fs-body);
      color: var(--t1);
      cursor: pointer;
    }
    .check-row input {
      width: 17px;
      height: 17px;
      accent-color: var(--brand-text);
    }
    .scenario-scenes {
      margin-top: 12px;
      display: flex;
      flex-direction: column;
      gap: 12px;
    }
    .scenario-empty {
      font-size: var(--fs-body);
      color: var(--t3);
      padding: 18px;
      text-align: center;
      border: 1px dashed var(--line-strong);
      border-radius: var(--r-md);
      background: var(--glass-bg);
    }
    .scene-block {
      padding: 14px;
      border-radius: var(--r-md);
      background: var(--bg-2);
      border: 1px solid var(--line);
      box-shadow: var(--shadow-xs);
    }
    .scene-block-head {
      display: flex;
      align-items: center;
      justify-content: space-between;
      margin-bottom: 10px;
    }
    .scene-name {
      font-size: var(--fs-body);
      font-weight: 700;
      display: inline-flex;
      align-items: center;
      gap: 7px;
      color: var(--t1);
    }
    .scene-del {
      width: 28px;
      height: 28px;
      border-radius: 8px;
      border: 1px solid var(--line);
      background: var(--bg-3);
      color: var(--t2);
      cursor: pointer;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      transition: .16s var(--ease);
    }
    .scene-del:hover {
      border-color: var(--err);
      color: var(--err);
      background: rgba(245,63,63,.12);
    }
    .scene-tiles {
      display: grid;
      grid-template-columns: repeat(auto-fill, minmax(110px, 1fr));
      gap:12px;
    }
    .scene-tile {
      position: relative;
      aspect-ratio: 4/3;
      border-radius: var(--r-sm);
      overflow: hidden;
      cursor: pointer;
      border: 2px solid var(--line);
      background: var(--bg-3);
      padding: 0;
      transition: .16s var(--ease);
    }
    .scene-tile img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      display: block;
    }
    .scene-tile:hover {
      border-color: var(--line-strong);
      transform: translateY(-2px);
    }
    .scene-tile.selected {
      border-color: transparent;
      box-shadow: 0 0 0 2px var(--brand), var(--shadow-card);
    }
    .scene-tile-check {
      position: absolute;
      top: 7px;
      right: 7px;
      width: 20px;
      height: 20px;
      border-radius: 50%;
      background: var(--grad-brand);
      color: #0E42D2;
      display: grid;
      place-items: center;
      opacity: 0;
      transform: scale(.5);
      transition: .16s var(--ease);
      font-size: var(--fs-small);
    }
    .scene-tile.selected .scene-tile-check {
      opacity: 1;
      transform: scale(1);
    }
    .scene-tile-del {
      position: absolute;
      top: 7px;
      left: 7px;
      width: 20px;
      height: 20px;
      border-radius: 50%;
      background: rgba(15,17,23,.7);
      color: #fff;
      display: grid;
      place-items: center;
      font-size: var(--fs-body);
      line-height: 1;
      opacity: 0;
      transition: .16s var(--ease);
    }
    .scene-tile:hover .scene-tile-del {
      opacity: 1;
    }
    .scene-tile-del:hover {
      background: var(--err);
    }
    .xhs {
      margin-top: var(--space-section);
      padding: 14px 16px;
      border-radius: var(--r-lg);
      background: var(--glass-bg);
      border: 1px solid var(--line-strong);
      box-shadow: var(--shadow-soft);
    }
    .xhs .advanced-toggle {
      padding: 0;
      border: none;
      background: none;
      font-size: var(--fs-body);
    }
    .xhs .advanced-toggle:hover {
      background: none;
    }
    .xhs .advanced-toggle > span:first-child i[data-lucide] {
      color: var(--brand-soft);
    }
    .xhs .advanced-toggle .adv-sub {
      color: var(--t-muted);
      font-size: var(--fs-small);
    }
    .xhs .advanced-toggle .chev {
      color: var(--t-muted);
    }
    .xhs .advanced-body {
      padding: 0;
    }
    .xhs .advanced-body.open {
      padding: 12px 0 0;
    }
    .xhs .xhs-text {
      width: 100%;
      margin-top: 12px;
      min-height: 120px;
      resize: vertical;
      padding: 12px 14px;
      font-size: var(--fs-body);
      line-height: 1.7;
      border-radius: var(--r-sm);
      background: var(--bg-1);
      border: 1px solid var(--line);
      color: var(--t1);
      font-family: inherit;
      outline: none;
    }
    .xhs .xhs-text:focus {
      border-color: var(--brand-text);
      box-shadow: 0 0 0 3px rgba(22,93,255,.15);
    }
    .xhs .xhs-actions {
      display: flex;
      gap:12px;
      margin-top: 12px;
      flex-wrap: wrap;
    }
    .ref-video-section {
      margin-top: var(--space-block);
      padding: 12px 14px;
      border: 1px solid var(--line);
      border-radius: var(--r-md);
      background: var(--bg-1);
    }
    .step2-card-row {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 16px;
      margin-top: var(--space-block);
      align-items: stretch;
    }
    .step2-card-row > .ref-video-section, .step2-card-row > .digital-human-section {
      margin-top: 0;
      display: flex;
      flex-direction: column;
    }
    @media (max-width: 768px) {
      .step2-card-row {
        grid-template-columns: 1fr;
      }
    }
    .ref-video-head {
      display: flex;
      align-items: center;
      gap: 8px;
      margin-bottom: 6px;
    }
    .ref-video-head .rv-title {
      font-size: var(--fs-small);
      font-weight: 600;
      color: var(--t2);
      display: flex;
      align-items: center;
      gap: 4px;
    }
    .ref-video-head .rv-sub {
      font-size: var(--fs-nano);
      color: var(--t3);
    }
    .ref-video-section .ref-video-upload {
      margin-top: 0;
    }
    .ref-video-section .hint.sm {
      margin-top: 6px;
      line-height: 1.45;
    }
    .ref-video-upload {
      display: flex;
      align-items: center;
      gap:12px;
      flex-wrap: wrap;
      padding: 10px 12px;
      border-radius: var(--r-md);
      background: var(--bg-1);
      border: 1px dashed var(--line-strong);
      margin-top: 8px;
    }
    .ref-video-name {
      font-size: var(--fs-small);
      color: var(--t2);
      max-width: 220px;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }
    .ref-video-preview {
      width: 100%;
      max-height: 220px;
      border-radius: var(--r-md);
      margin-top: 12px;
      background: #000;
    }
    .ref-video-keyframes {
      margin-top: 10px;
    }
    .ref-kf-label {
      font-size: var(--fs-small);
      color: var(--t2);
      display: flex;
      align-items: center;
      gap: 5px;
      margin-bottom: 6px;
    }
    .ref-kf-strip {
      display: flex;
      gap: 8px;
      overflow-x: auto;
      padding-bottom: 4px;
    }
    .ref-kf-item {
      position: relative;
      flex-shrink: 0;
      border-radius: 6px;
      overflow: hidden;
      border: 1px solid var(--line-strong);
    }
    .ref-kf-item img {
      width: 96px;
      height: 54px;
      object-fit: cover;
      display: block;
    }
    .ref-kf-time {
      position: absolute;
      bottom: 2px;
      right: 2px;
      font-size: var(--fs-micro);
      padding: 1px 4px;
      background: rgba(0,0,0,.65);
      color: #fff;
      border-radius: 3px;
    }
    .ref-kf-loading {
      font-size: var(--fs-small);
      color: var(--t2);
      padding: 8px 0;
    }
    .digital-human-section {
      margin-top: 14px;
      padding: 14px;
      background: var(--bg-elev, rgba(255,255,255,0.02));
      border: 1px solid var(--border, #e5e7eb);
      border-radius: var(--r-md);
    }
    .product-context-collapse {
      margin-top: 12px;
      border: 1px solid var(--border, #e5e7eb);
      border-radius: var(--r-md);
      background: var(--bg-elev, rgba(255,255,255,0.02));
    }
    .product-context-collapse > summary {
      display: flex;
      align-items: center;
      gap: 8px;
      padding: 12px 14px;
      cursor: pointer;
      list-style: none;
      user-select: none;
    }
    .product-context-collapse > summary::-webkit-details-marker {
      display: none;
    }
    .product-context-collapse .pc-title {
      font-weight: 600;
      display: flex;
      align-items: center;
      gap: 6px;
    }
    .product-context-collapse .pc-sub {
      font-size: var(--fs-small);
      color: var(--t2);
      flex: 1;
    }
    .product-context-collapse .chev {
      transition: transform 0.2s;
    }
    .product-context-collapse[open] .chev {
      transform: rotate(180deg);
    }
    .product-context-body {
      padding: 0 14px 14px;
      display: flex;
      flex-direction: column;
      gap:12px;
    }
    .pc-url-row {
      display: flex;
      gap: 8px;
      align-items: center;
    }
    .pc-auto-pool {
      display: flex;
      align-items: center;
      gap: 4px;
      font-size: var(--fs-small);
      color: var(--color-text-muted);
      cursor: pointer;
      white-space: nowrap;
      user-select: none;
      margin-left: 4px;
    }
    .pc-auto-pool input[type="checkbox"] {
      width: 14px;
      height: 14px;
      accent-color: var(--brand-text);
      cursor: pointer;
    }
    .pc-url-row input {
      flex: 1;
      min-width: 0;
      padding: 8px 12px;
      border: 1px solid var(--border, #e5e7eb);
      border-radius: var(--r-sm);
      font-size: var(--fs-body);
      background: var(--bg, #fff);
      color: var(--t1);
    }
    .pc-dropzone {
      display: flex;
      align-items: center;
      gap: 8px;
      padding: 18px 14px;
      border: 1px dashed var(--border, #d1d5db);
      border-radius: var(--r-md);
      cursor: pointer;
      color: var(--t2);
      background: var(--bg, #fff);
      transition: all 0.15s;
    }
    .pc-dropzone.drag {
      border-color: var(--primary, #165DFF);
      background: rgba(64,128,255, 0.04);
    }
    .pc-drop-hint {
      font-size: var(--fs-body);
    }
    .pc-items {
      display: flex;
      flex-direction: column;
      gap: 6px;
    }
    .pc-item {
      display: flex;
      align-items: center;
      gap: 8px;
      padding: 8px 12px;
      background: var(--bg, #fff);
      border: 1px solid var(--border, #e5e7eb);
      border-radius: var(--r-sm);
      font-size: var(--fs-body);
    }
    .pc-item-name {
      flex: 1;
      min-width: 0;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }
    .pc-item-size {
      font-size: var(--fs-nano);
      color: var(--t2);
    }
    .pc-item-rm {
      border: none;
      background: transparent;
      color: var(--t2);
      cursor: pointer;
      padding: 2px 6px;
      border-radius: 4px;
      font-size: var(--fs-h2);
    }
    .pc-item-rm:hover {
      background: rgba(220, 38, 38, 0.08);
      color: #F53F3F;
    }
    .pc-summary {
      padding: 10px 12px;
      background: rgba(64,128,255, 0.04);
      border: 1px solid rgba(64,128,255, 0.2);
      border-radius: var(--r-sm);
    }
    .pc-summary-head {
      display: flex;
      align-items: center;
      gap: 6px;
      font-size: var(--fs-small);
      font-weight: 600;
      color: var(--primary, #165DFF);
      margin-bottom: 6px;
    }
    .pc-summary-body {
      font-size: var(--fs-body);
      line-height: 1.6;
      color: var(--t1);
      white-space: pre-wrap;
    }
    .sn-row.sn-error .sn-dim {
      color: #FF7D00;
    }
    .sn-row.sn-error .sn-val {
      color: #92400e;
      font-style: italic;
    }
    [hidden] {
      display: none !important;
    }
    .human-grid {
      display: grid;
      grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
      gap: 12px;
    }
    .human-thumb {
      width: 100%;
      aspect-ratio: 4/5;
      background: var(--bg-2, #f3f4f6);
      border-radius: 6px;
      overflow: hidden;
      display: flex;
      align-items: center;
      justify-content: center;
    }
    .human-thumb img {
      width: 100%;
      height: 100%;
      object-fit: cover;
    }
    .human-name {
      font-weight: 600;
      font-size: var(--fs-body);
    }
    .human-tags {
      display: flex;
      gap: 4px;
      flex-wrap: wrap;
    }
    .human-uri {
      font-family: ui-monospace, monospace;
      font-size: var(--fs-nano);
      color: var(--t-2, #6b7280);
    }
    .human-actions {
      display: flex;
      gap: 6px;
      margin-top: 4px;
    }
    .human-empty {
      padding: 24px;
      text-align: center;
      color: var(--t-2);
      font-size: var(--fs-body);
    }
    .human-form-mask {
      position: fixed;
      inset: 0;
      background: rgba(0,0,0,0.45);
      z-index: 90;
      display: flex;
      align-items: center;
      justify-content: center;
    }
    .human-form-card {
      background: var(--bg-1, #fff);
      width: 480px;
      max-width: 92vw;
      border-radius: 12px;
      box-shadow: 0 12px 40px rgba(0,0,0,0.2);
      display: flex;
      flex-direction: column;
      max-height: 90vh;
    }
    .human-form-head {
      padding: 14px 18px;
      border-bottom: 1px solid var(--border, #e5e7eb);
      display: flex;
      align-items: center;
      justify-content: space-between;
      font-weight: 600;
    }
    .human-form-head button {
      background: transparent;
      border: none;
      cursor: pointer;
      font-size: var(--fs-h1);
      color: var(--t-2);
    }
    .human-form-body {
      padding: 16px 18px;
      overflow-y: auto;
      display: flex;
      flex-direction: column;
      gap: 12px;
    }
    .human-form-foot {
      padding: 12px 18px;
      border-top: 1px solid var(--border, #e5e7eb);
      display: flex;
      gap: 8px;
      justify-content: flex-end;
    }
    .human-form label {
      display: flex;
      flex-direction: column;
      gap: 4px;
      font-size: var(--fs-small);
      color: var(--t-2);
    }
    .human-form label > span {
      font-weight: 600;
    }
    .human-form input, .human-form select {
      padding: 7px 10px;
      font-size: var(--fs-body);
      border: 1px solid var(--border, #e5e7eb);
      border-radius: 6px;
      background: var(--bg-1, #fff);
      color: var(--t-1);
    }
    .human-form .form-row {
      display: flex;
      gap:12px;
    }
    .human-form .form-row label {
      flex: 1;
    }
    .hf-scenes {
      display: flex;
      gap: 8px;
      flex-wrap: wrap;
    }
    .hf-scene-chip {
      display: inline-flex;
      align-items: center;
      gap: 4px;
      padding: 4px 8px;
      border: 1px solid var(--border, #e5e7eb);
      border-radius: 16px;
      cursor: pointer;
      font-weight: 400;
      color: var(--t-1);
    }
    .hf-scene-chip input {
      margin: 0;
    }
    .picker-mask {
      position: fixed;
      inset: 0;
      background: rgba(0,0,0,0.45);
      z-index: 65;
    }
    .picker-drawer {
      position: fixed;
      top: 0;
      right: 0;
      bottom: 0;
      width: 540px;
      max-width: 96vw;
      background: var(--bg-1, #fff);
      z-index: 66;
      display: flex;
      flex-direction: column;
      box-shadow: -8px 0 24px rgba(0,0,0,0.12);
    }
    .picker-head {
      padding: 14px 18px;
      border-bottom: 1px solid var(--border, #e5e7eb);
      display: flex;
      align-items: center;
      justify-content: space-between;
    }
    .picker-title {
      font-weight: 600;
      font-size: var(--fs-h2);
      display: inline-flex;
      align-items: center;
      gap: 6px;
    }
    .picker-close {
      background: transparent;
      border: none;
      cursor: pointer;
      color: var(--t-2);
    }
    .picker-filters {
      padding: 10px 18px;
      display: flex;
      gap: 6px;
      align-items: center;
      flex-wrap: wrap;
      border-bottom: 1px solid var(--border, #e5e7eb);
    }
    .picker-search {
      flex: 1;
      min-width: 140px;
      padding: 7px 10px;
      border: 1px solid var(--border, #e5e7eb);
      border-radius: 6px;
      font-size: var(--fs-body);
    }
    .picker-filters select {
      padding: 7px 10px;
      border: 1px solid var(--border, #e5e7eb);
      border-radius: 6px;
      font-size: var(--fs-body);
      background: var(--bg-1, #fff);
    }
    .picker-count {
      margin-left: auto;
      font-size: var(--fs-small);
      color: var(--t-2);
    }
    .picker-grid {
      flex: 1;
      overflow-y: auto;
      padding: 14px 18px;
      display: grid;
      grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
      gap:12px;
      align-content: start;
    }
    .picker-card {
      border: 1px solid var(--border, #e5e7eb);
      border-radius: 8px;
      padding: 8px;
      cursor: pointer;
      transition: transform 0.1s, border-color 0.1s;
      display: flex;
      flex-direction: column;
      gap: 4px;
    }
    .picker-card:hover {
      border-color: var(--primary, #165DFF);
      transform: translateY(-2px);
    }
    .picker-card-thumb {
      aspect-ratio: 4/5;
      background: var(--bg-2, #f3f4f6);
      border-radius: 6px;
      overflow: hidden;
      display: flex;
      align-items: center;
      justify-content: center;
    }
    .picker-card-thumb img {
      width: 100%;
      height: 100%;
      object-fit: cover;
    }
    .picker-card-name {
      font-size: var(--fs-body);
      font-weight: 600;
    }
    .picker-card-meta {
      font-size: var(--fs-nano);
      color: var(--t-2);
    }
    .picker-empty {
      grid-column: 1/-1;
      padding: 40px;
      text-align: center;
      color: var(--t-2);
    }
    .picker-smart-result {
      padding: 12px 18px;
      border-top: 1px solid var(--border, #e5e7eb);
      background: linear-gradient(180deg, #fafbff, #fff);
      max-height: 50%;
      overflow-y: auto;
    }
    .picker-smart-result.hidden {
      display: none;
    }
    .picker-smart-head {
      font-size: var(--fs-body);
      font-weight: 600;
      color: var(--primary, #165DFF);
      margin-bottom: 8px;
      display: flex;
      align-items: center;
      gap: 6px;
    }
    .picker-smart-row {
      display: flex;
      align-items: center;
      gap:12px;
      padding: 8px 10px;
      border: 1px solid var(--border, #e5e7eb);
      border-radius: 8px;
      margin-bottom: 6px;
      background: var(--bg, #fff);
      cursor: pointer;
      transition: all 0.1s;
    }
    .picker-smart-row:hover {
      border-color: var(--primary, #165DFF);
      background: #f5f7ff;
    }
    .picker-smart-rank {
      font-weight: 700;
      font-size: var(--fs-h2);
      color: var(--primary, #165DFF);
      min-width: 36px;
      text-align: center;
    }
    .picker-smart-info {
      flex: 1;
      min-width: 0;
    }
    .picker-smart-name {
      font-size: var(--fs-body);
      font-weight: 600;
    }
    .picker-smart-meta {
      font-size: var(--fs-nano);
      color: var(--t-2);
      margin-top: 2px;
    }
    .picker-smart-pick {
      padding: 4px 12px;
      border: 1px solid var(--primary, #165DFF);
      color: var(--primary, #165DFF);
      background: var(--bg, #fff);
      border-radius: 6px;
      cursor: pointer;
      font-size: var(--fs-small);
    }
    .picker-smart-pick:hover {
      background: var(--primary, #165DFF);
      color: #fff;
    }
    .picker-smart-loading {
      padding: 12px;
      text-align: center;
      color: var(--t-2);
      font-size: var(--fs-body);
    }
    .picker-card-matched {
      position: relative;
      border-color: var(--primary, #165DFF);
      background: linear-gradient(180deg, #f5f7ff, #fff);
    }
    .picker-card-score-tag {
      position: absolute;
      top: 4px;
      right: 4px;
      background: var(--primary, #165DFF);
      color: #fff;
      font-size: var(--fs-micro);
      font-weight: 700;
      padding: 2px 6px;
      border-radius: 10px;
    }
    .picker-card-fallback {
      font-size: var(--fs-display);
      font-weight: 700;
      color: var(--t-2);
    }
    .picker-smart {
      margin-left: auto;
    }
    .pc-images {
      display: grid;
      grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
      gap:12px;
    }
    .pc-img {
      display: flex;
      flex-direction: column;
      gap: 4px;
      padding: 6px;
      background: var(--bg, #fff);
      border: 1px solid var(--border, #e5e7eb);
      border-radius: var(--r-sm);
      font-size: var(--fs-nano);
    }
    .pc-img-thumb {
      width: 100%;
      aspect-ratio: 1;
      background: #f3f4f6;
      border-radius: 4px;
      overflow: hidden;
      display: flex;
      align-items: center;
      justify-content: center;
    }
    .pc-img-thumb img {
      width: 100%;
      height: 100%;
      object-fit: cover;
    }
    .pc-img-meta {
      display: flex;
      justify-content: space-between;
      align-items: center;
      padding: 0 2px;
    }
    .pc-img-source {
      color: var(--t2);
      font-size: var(--fs-micro);
    }
    .pc-img-added {
      color: #00B42A;
      font-weight: 600;
      font-size: var(--fs-micro);
    }
    .pc-img-actions {
      display: flex;
      gap: 4px;
    }
    .pc-btn-add {
      flex: 1;
      padding: 4px 8px;
      font-size: var(--fs-nano);
      background: var(--primary, #165DFF);
      color: #fff;
      border: none;
      border-radius: 4px;
      cursor: pointer;
    }
    .pc-btn-add:hover {
      background: #165DFF;
    }
    .pc-btn-rm {
      padding: 4px 8px;
      font-size: var(--fs-nano);
      background: transparent;
      color: var(--t2);
      border: 1px solid var(--border, #e5e7eb);
      border-radius: 4px;
      cursor: pointer;
    }
    .pc-btn-rm:hover {
      background: rgba(220, 38, 38, 0.08);
      color: #F53F3F;
    }
    .pc-item-meta {
      font-size: var(--fs-nano);
      color: var(--t2);
      margin-left: 4px;
    }
    .history-wrap {
      display: flex;
      flex-direction: column;
      min-height: 100vh;
    }
    .history-body {
      display: flex;
      flex: 1;
      min-height: 0;
    }
    .history-sidebar {
      width: 240px;
      border-right: 1px solid var(--border, #e5e7eb);
      padding: 12px;
      overflow-y: auto;
      background: var(--bg-elev, rgba(255,255,255,0.02));
      /* v60.11: 侧栏吸顶+限高，项目列表内部滚动——页面不再被拉成超长 */
      position: sticky;
      top: 0;
      align-self: flex-start;
      height: calc(100vh - 56px);
      font-size: 12px;
    }
    /* v60.11: 「全部项目」折叠开关 */
    .hs-toggle {
      background: transparent;
      border: none;
      cursor: pointer;
      color: var(--t2);
      font-size:12px;
      padding: 2px 4px;
      border-radius: 4px;
      display: inline-flex;
      align-items: center;
      gap: 3px;
    }
    .hs-toggle:hover { color: var(--t1); }
    .hs-toggle-chev { display: inline-block; transition: transform .15s; }
    .history-sidebar.proj-collapsed .hs-toggle-chev { transform: rotate(-90deg); }
    .history-sidebar.proj-collapsed .hs-proj-item { display: none; }
    .hs-section {
      margin-bottom: 24px;
    }
    .hs-head {
      display: flex;
      align-items: center;
      justify-content: space-between;
      font-size: var(--fs-small);
      font-weight: 600;
      color: var(--t2);
      margin-bottom: 6px;
      text-transform: uppercase;
      letter-spacing: 0.5px;
    }
    .hs-head span {
      display: flex;
      align-items: center;
      gap: 6px;
    }
    .hs-add {
      background: transparent;
      border: 1px solid var(--border, #e5e7eb);
      cursor: pointer;
      color: var(--t2);
      padding: 3px 10px;
      border-radius: 6px;
      font-size:12px;
      line-height: 1;
    }
    .hs-add:hover {
      background: var(--bg-elev, rgba(255,255,255,0.06));
      color: var(--t1);
      border-color: var(--brand-soft, rgba(22,93,255,0.4));
    }
    /* v60.20: 侧栏头部按钮组等高对齐（全部项目/操作 并排不参差） */
    .history-sidebar .hs-head {
      min-height: 26px;
      align-items: center;
      gap: 4px;
    }
    .history-sidebar .hs-head > span:first-child {
      flex: 1 1 auto;
      min-width: 0;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }
    .hs-list {
      list-style: none;
      padding: 0;
      margin: 0;
      display: flex;
      flex-direction: column;
      gap: 2px;
    }
    .hs-item {
      display: flex;
      align-items: center;
      gap: 8px;
      padding: 5px 8px;
      border-radius: 6px;
      cursor: pointer;
      font-size: 12px;
      color: var(--t1);
      transition: background 0.1s;
    }
    .hs-item:hover {
      background: var(--bg, #fff);
    }
    .hs-item.active {
      background: rgba(64,128,255, 0.1);
      color: var(--primary, #165DFF);
      font-weight: 600;
    }
    .hs-item.hs-empty {
      color: var(--t2);
      cursor: default;
      font-style: italic;
    }
    /* v61.56 侧栏「更多(N)」折叠项：弱化样式，提示可展开 */
    .hs-item.hs-more {
      color: var(--t3, #94a3b8);
      font-style: italic;
      cursor: pointer;
    }
    .hs-item.hs-more:hover { color: var(--t1, #0f172a); }
    .hs-item.hs-tag {
      color: var(--tag-color);
    }
    .hs-item.hs-tag.active {
      background: var(--tag-color);
      @supports (color: color-mix(in lab, red, red)) {
        background: color-mix(in srgb, var(--tag-color) 12%, transparent);
      }
    }
    .hs-item .hs-count {
      margin-left: auto;
      font-size: var(--fs-nano);
      color: var(--t2);
    }
    .hs-item .hs-del {
      margin-left: 4px;
      background: transparent;
      border: none;
      cursor: pointer;
      color: var(--t2);
      padding: 2px;
      border-radius: 3px;
      opacity: 0;
      transition: opacity 0.1s;
    }
    .hs-item:hover .hs-del {
      opacity: 1;
    }
    .hs-item .hs-del:hover {
      background: rgba(220, 38, 38, 0.08);
      color: #F53F3F;
    }
    .history-main {
      flex: 1;
      min-width: 0;
      padding: 20px;
      overflow-y: auto;
      display: flex;
      flex-direction: column;
      gap: 12px;
    }
    .history-toolbar {
      display: flex;
      flex-direction: column;
      gap: 8px;
    }
    .search-row {
      display: flex;
      gap: 6px;
      align-items: center;
    }
    .search-row input {
      flex: 1;
      padding: 8px 12px;
      border: 1px solid var(--border, #e5e7eb);
      border-radius: var(--r-sm);
      font-size: var(--fs-body);
      background: var(--bg, #fff);
      color: var(--t1);
    }
    .filter-row {
      display: flex;
      gap: 8px;
      align-items: center;
      flex-wrap: wrap;
    }
    .filter-row select, .filter-row input[type="date"] {
      padding: 6px 10px;
      border: 1px solid var(--border, #e5e7eb);
      border-radius: var(--r-sm);
      font-size: var(--fs-body);
      background: var(--bg, #fff);
      color: var(--t1);
    }
    .filter-sep {
      color: var(--t2);
    }
    .history-summary {
      font-size: var(--fs-small);
      color: var(--t2);
    }
    .history-grid {
      display: grid;
      grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
      gap:16px;
      flex: 1;
      min-height: 0;
      /* v60.3: auto 行被默认 align-content:stretch 平均撑满容器(任务卡 846px 高白卡) -> 行高按内容 */
      align-content: start;
      grid-auto-rows: min-content;
    }
    .history-empty {
      grid-column: 1 / -1;
      padding: 40px;
      text-align: center;
      color: var(--t2);
      font-size: var(--fs-body);
    }
    .task-card {
      background: var(--bg, #fff);
      border: 1px solid var(--border, #e5e7eb);
      border-radius: var(--r-md);
      overflow: hidden;
      cursor: pointer;
      transition: transform 0.15s, box-shadow 0.15s;
      display: flex;
      flex-direction: column;
    }
    .task-card:hover {
      transform: translateY(-2px);
      box-shadow: 0 4px 12px rgba(0,0,0,0.08);
    }
    .task-card-thumb {
      position: relative;
      aspect-ratio: 16/9;
      /* v48 修复：竖版海报（9:16）以 height:100% 进 flex 容器时，min-height:auto 会把缩略图按原图比例撑到 ~434px，
         历史任务卡被撑成整屏高白卡。min-height:0 + flex 收缩让 16/9 生效，图片 object-fit:cover 裁剪。 */
      min-height: 0;
      flex: 0 0 auto;
      height: auto;
      background: #0f172a;
      display: flex;
      align-items: center;
      justify-content: center;
      overflow: hidden;
    }
    .task-card-thumb img {
      width: 100%;
      height: 100%;
      object-fit: cover;
    }
    .task-thumb-empty {
      color: rgba(255,255,255,0.4);
    }
    .task-card-status {
      position: absolute;
      top: 6px;
      left: 6px;
      padding: 2px 8px;
      border-radius: 10px;
      font-size: var(--fs-nano);
      font-weight: 600;
      color: #fff;
    }
    .status-success {
      background: #00B42A;
    }
    .status-failed {
      background: #F53F3F;
    }
    .status-running {
      background: #FF7D00;
    }
    .task-card-body {
      padding: 10px 12px;
      display: flex;
      flex-direction: column;
      gap: 6px;
      flex: 1;
    }
    .task-card-title {
      font-size: var(--fs-body);
      font-weight: 600;
      color: var(--t1);
      min-width: 0;            /* K2 fix: 允许 flex 子项收缩，否则 no-wrap+ellipsis 失效导致文字溢出容器 */
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }
    .task-card-meta {
      display: flex;
      gap: 8px;
      flex-wrap: wrap;
      font-size: var(--fs-nano);
      color: var(--t2);
    }
    .task-card-meta span {
      display: flex;
      align-items: center;
      gap: 3px;
    }
    .task-card-foot {
      display: flex;
      justify-content: space-between;
      font-size: var(--fs-nano);
      color: var(--t2);
    }
    .task-card-cost {
      font-weight: 600;
      color: var(--t1);
    }
    .task-card-tags {
      display: flex;
      gap: 4px;
      flex-wrap: wrap;
      margin-top: 2px;
    }
    .task-chip {
      display: inline-flex;
      align-items: center;
      gap: 3px;
      padding: 1px 6px;
      border-radius: 8px;
      font-size: var(--fs-micro);
      background: rgba(148, 163, 184, 0.15);
      color: var(--t2);
    }
    .task-chip-project {
      background: rgba(64,128,255, 0.12);
      color: var(--primary, #165DFF);
    }
    .task-chip[style*="--tag-color"] {
      background: var(--tag-color);
      @supports (color: color-mix(in lab, red, red)) {
        background: color-mix(in srgb, var(--tag-color) 18%, transparent);
      }
      color: var(--tag-color);
    }
    .history-pager {
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 12px;
      padding: 12px 0;
    }
    .history-pager button:disabled {
      opacity: 0.4;
      cursor: not-allowed;
    }
    .task-drawer-mask {
      position: fixed;
      inset: 0;
      background: rgba(0,0,0,0.4);
      z-index: 50;
    }
    .task-drawer {
      position: fixed;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
      width: min(720px, 92vw);
      max-height: 90vh;
      background: var(--bg, #fff);
      z-index: 51;
      display: flex;
      flex-direction: column;
      border-radius: 16px;
      box-shadow: 0 24px 64px rgba(0,0,0,.24), 0 6px 18px rgba(0,0,0,.10);
      overflow: hidden;
    }
    .td-head {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 12px;
      padding: 14px 20px;
      border-bottom: 1px solid var(--border, #e5e7eb);
      font-weight: 600;
      font-size: var(--fs-h2);
      background: linear-gradient(180deg, var(--bg), var(--bg));
      flex: 0 0 auto;
    }
    .td-title { flex: 1; text-align: center; letter-spacing: .02em; }
    .td-close { font-size:14px; color: var(--t2); }
    .td-nav { display: flex; gap: 4px; }
    .td-nav-btn { padding: 4px 8px; }
    .td-close {
      background: transparent;
      border: none;
      cursor: pointer;
      color: var(--t2);
      padding: 4px;
      border-radius: 4px;
    }
    .td-close:hover {
      background: var(--bg-elev, rgba(0,0,0,0.05));
    }
    .td-body {
      padding: 18px;
      overflow-y: auto;
      flex: 1;
      display: flex;
      flex-direction: column;
      gap: 12px;
    }
    .td-cover {
      width: 100%;
      aspect-ratio: 16/9;
      background: #0f172a;
      border-radius: 8px;
      overflow: hidden;
      display: flex;
      align-items: center;
      justify-content: center;
    }
    .td-cover img {
      width: 100%;
      height: 100%;
      object-fit: cover;
    }
    .td-video {
      width: 100%;
      aspect-ratio: 16 / 9;
      height: auto;
      background: #0f172a;
      object-fit: contain;
      border-radius: 8px;
      display: block;
    }
    .td-h3 {
      font-size: var(--fs-h1);
      margin: 0;
    }
    /* 弹窗专业化：信息卡网格 2 列 + hero 媒体区 */
    .td-hero { position: relative; border-radius: 12px; overflow: hidden; background: #0f172a; }
    .td-hero .td-cover { border-radius: 12px; }
    .td-status-float { position: absolute; top: 10px; left: 10px; z-index: 2; }
    .td-info-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 8px; }
    .td-info-item { background: var(--bg-elev, rgba(0,0,0,0.02)); border: 1px solid var(--border, #e5e7eb); border-radius: 10px; padding: 8px 12px; }
    .td-info-k { font-size:12px; color: var(--t3); letter-spacing: .02em; }
    .td-info-v { font-size:14px; font-weight: 600; color: var(--t1); margin-top: 2px; word-break: break-word; }
    .td-meta-head { display: flex; align-items: center; gap:12px; flex-wrap: wrap; }
    .td-meta-head .td-h3 { flex: 1 1 auto; min-width: 0; }
    .td-row {
      display: flex;
      gap: 12px;
      font-size: var(--fs-body);
    }
    .td-k {
      color: var(--t2);
      min-width: 50px;
    }
    .td-cap {
      color: var(--t1);
      line-height: 1.6;
    }
    .td-section {
      padding: 12px;
      background: var(--bg-elev, rgba(0,0,0,0.02));
      border-radius: 8px;
    }
    .td-section-title {
      font-size: var(--fs-small);
      font-weight: 600;
      color: var(--t2);
      margin-bottom: 8px;
      text-transform: uppercase;
    }
    .td-edit-row {
      display: flex;
      align-items: center;
      gap: 8px;
      margin-bottom: 8px;
    }
    .td-edit-row select {
      padding: 4px 8px;
      border-radius: 4px;
      border: 1px solid var(--border, #e5e7eb);
      font-size: var(--fs-body);
    }
    .td-tags {
      display: flex;
      gap: 6px;
      flex-wrap: wrap;
    }
    .td-tag-opt {
      display: flex;
      align-items: center;
      gap: 4px;
      cursor: pointer;
      font-size: var(--fs-small);
    }
    .td-tag-opt span {
      padding: 2px 8px;
      border-radius: 10px;
      background: var(--tag-color);
      @supports (color: color-mix(in lab, red, red)) {
        background: color-mix(in srgb, var(--tag-color) 18%, transparent);
      }
      color: var(--tag-color);
    }
    .td-actions {
      display: flex;
      gap: 8px;
      flex-wrap: wrap;
      margin-top: 4px;
    }
    .td-actions .btn.danger {
      background: #F53F3F;
      color: #fff;
      border: none;
    }
    .td-actions .btn.danger:hover {
      background: #F53F3F;
    }
    .modal-mask {
      position: fixed;
      inset: 0;
      background: rgba(0,0,0,0.4);
      z-index: 60;
    }
    .modal-card {
      position: fixed;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
      width: 360px;
      max-width: 90vw;
      background: var(--bg, #fff);
      z-index: 61;
      border-radius: var(--r-md);
      box-shadow: 0 8px 32px rgba(0,0,0,0.15);
      display: flex;
      flex-direction: column;
    }
    .modal-head {
      display: flex;
      align-items: center;
      justify-content: space-between;
      padding: 14px 18px;
      border-bottom: 1px solid var(--border, #e5e7eb);
      font-weight: 600;
    }
    .modal-head button {
      background: transparent;
      border: none;
      cursor: pointer;
      color: var(--t2);
    }
    .modal-body {
      padding: 18px;
      display: flex;
      flex-direction: column;
      gap:12px;
    }
    .modal-label {
      display: flex;
      flex-direction: column;
      gap: 4px;
      font-size: var(--fs-body);
    }
    .modal-label input {
      padding: 8px 12px;
      border: 1px solid var(--border, #e5e7eb);
      border-radius: 4px;
      font-size: var(--fs-body);
    }
    .modal-label input[type="color"] {
      padding: 2px;
      height: 36px;
      cursor: pointer;
    }
    .modal-foot {
      display: flex;
      justify-content: flex-end;
      gap: 8px;
      padding: 12px 18px;
      border-top: 1px solid var(--border, #e5e7eb);
    }
    /* v61.39 删除：此处 .btn.primary/.danger 二次覆盖曾用硬编码 #165DFF/#F53F3F + 4px 圆角，
       与全局 .btn.primary(var(--grad-brand)+--r-md)/.btn.danger(var(--err)) 冲突。
       history/assets 弹窗主按钮统一回全局版（渐变、8px 圆角、蓝 glow）。 */
    .batch-gallery {
      display: grid;
      grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
      gap: 12px;
      margin-top: 14px;
    }
    .batch-card {
      background: var(--glass-bg);
      border: 1px solid var(--line-strong);
      border-radius: var(--r-md);
      padding: 12px;
      position: relative;
      overflow: hidden;
      animation: popIn .3s var(--ease) backwards;
      transition: .2s var(--ease);
      box-shadow: var(--shadow-soft);
    }
    .batch-card::before {
      content: '';
      position: absolute;
      inset: 0;
      border-radius: var(--r-md);
      padding: 1px;
      background: linear-gradient(135deg, rgba(22,93,255,.4), rgba(22,93,255,.18));
      -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
      -webkit-mask-composite: xor;
      mask-composite: exclude;
      opacity: 0;
      transition: .2s var(--ease);
      pointer-events: none;
    }
    .batch-card:hover {
      transform: translateY(-3px);
      box-shadow: var(--shadow-card);
    }
    .batch-card:hover::before {
      opacity: 1;
    }
    .batch-card video {
      width: 100%;
      border-radius: var(--r-sm);
      background: #000;
      margin-bottom: 10px;
      display: block;
    }
    .batch-no {
      position: absolute;
      top: 18px;
      left: 18px;
      z-index: 2;
      font-size: var(--fs-small);
      font-weight: 700;
      color: #fff;
      background: rgba(22,93,255,.92);
      padding: 3px 10px;
      border-radius: 999px;
      box-shadow: 0 2px 8px rgba(0,0,0,.3);
    }
    .batch-card .btn.block {
      margin-bottom: 0;
      font-size: var(--fs-small);
      padding: 9px;
    }
    .storyboard-actions {
      display: flex;
      flex-direction: column;
      gap: 12px;
      margin-top: 12px;
    }
    .sb-steps-grid {
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      gap:12px;
    }
    .sb-step-card {
      display: flex;
      flex-direction: column;
      align-items: flex-start;
      gap: 8px;
      padding: 14px 12px;
      background: var(--bg-card, #fff);
      border: 1px solid var(--line);
      border-radius: var(--r-lg, 12px);
      transition: border-color .2s, box-shadow .2s;
      position: relative;
    }
    .sb-step-card:hover {
      border-color: var(--brand-text);
      box-shadow: 0 2px 8px rgba(0,0,0,.06);
    }
    .sb-step-btn {
      width: 100%;
      justify-content: flex-start;
      padding: 8px 10px;
      font-size: var(--fs-body);
      white-space: normal;
      text-align: left;
      line-height: 1.35;
    }
    .sb-step-btn i {
      flex-shrink: 0;
    }
    .sb-step-num {
      flex-shrink: 0;
      display: grid;
      place-items: center;
      width: 26px;
      height: 26px;
      border-radius: 50%;
      background: var(--brand);
      color: #fff;
      font-size: var(--fs-small);
      font-weight: 700;
    }
    .sb-step-tip {
      font-size: var(--fs-nano);
      color: var(--t3);
      line-height: 1.5;
    }
    .sb-one-click-btn {
      display: flex;
      align-items: center;
      gap: 12px;
      width: 100%;
      padding: 14px 20px;
      justify-content: center;
      background: linear-gradient(135deg, var(--brand) 0%, var(--brand-2, #165DFF) 100%);
      border: none;
      border-radius: var(--r-lg, 12px);
      color: #fff;
      font-size: var(--fs-h2);
      font-weight: 700;
      cursor: pointer;
      transition: transform .15s, box-shadow .2s;
      box-shadow: 0 4px 14px rgba(22,93,255,.3);
    }
    .sb-one-click-btn:hover {
      transform: translateY(-1px);
      box-shadow: 0 6px 20px rgba(22,93,255,.4);
    }
    .sb-one-click-btn:disabled {
      opacity: .6;
      cursor: not-allowed;
      transform: none;
    }
    .sb-one-click-btn > i {
      width: 22px;
      height: 22px;
      flex-shrink: 0;
    }
    .sb-one-click-text {
      display: flex;
      flex-direction: column;
      align-items: flex-start;
      gap: 2px;
    }
    .sb-one-click-title {
      font-size: var(--fs-h2);
      font-weight: 700;
    }
    .sb-one-click-sub {
      font-size: var(--fs-small);
      font-weight: 400;
      opacity: .85;
    }
    @media (max-width: 860px) {
      .sb-steps-grid {
        grid-template-columns: repeat(2, 1fr);
      }
    }
    @media (max-width: 520px) {
      .sb-steps-grid {
        grid-template-columns: 1fr;
      }
    }
    .storyboard-divider {
      display: flex;
      align-items: center;
      gap:12px;
      margin: 0;
      color: var(--t3);
      font-size: var(--fs-small);
    }
    .storyboard-divider::before, .storyboard-divider::after {
      content: '';
      flex: 1;
      height: 1px;
      background: var(--line);
    }
    .storyboard-divider span {
      padding: 0 4px;
    }
    .storyboard-grid {
      display: grid;
      /* v61.16 用户反馈：改横向 → 单列全宽，卡片内部左图右文，内容完整显示 */
      grid-template-columns: minmax(0, 1fr);
      gap:16px;
      margin-top: 12px;
    }
    .storyboard-empty {
      color: var(--t2);
      font-size: var(--fs-body);
      padding: 18px 0;
    }
    .storyboard-card {
      background: var(--bg-1);
      border: 1px solid var(--line);
      border-radius: var(--r-md);
      overflow: hidden;
      /* v61.16 用户反馈：改横向 → 每镜卡片横向布局（左：首尾帧，右：文案/参数） */
      display: flex;
      flex-direction: row;
      align-items: stretch;
      transition: .2s var(--ease);
    }
    .storyboard-card.status-done {
      border-color: rgba(0,180,42,.5);
    }
    .storyboard-card.status-error {
      border-color: rgba(245,63,63,.5);
    }
    .storyboard-card.status-loading {
      border-color: rgba(22,93,255,.6);
    }
    .storyboard-img {
      aspect-ratio: 16/10;
      background: var(--bg-3);
      display: grid;
      place-items: center;
      overflow: hidden;
    }
    .storyboard-img img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      display: block;
    }
    .storyboard-ph {
      color: var(--t3);
    }
    .storyboard-ph i {
      width: 34px;
      height: 34px;
    }
    .storyboard-meta {
      padding: 12px 14px;
      min-width: 0;
    }
    .storyboard-shot {
      font-size: var(--fs-small);
      font-weight: 700;
      color: var(--brand-text);
      margin-bottom: 4px;
    }
    .storyboard-text {
      font-size: var(--fs-small);
      line-height: 1.5;
      color: var(--t1);
    }
    .storyboard-err {
      font-size: var(--fs-small);
      color: var(--err);
      margin-top: 6px;
    }
    .storyboard-btns {
      display: flex;
      gap: 8px;
      padding: 0 14px 12px;
    }
    .storyboard-btns .btn.tiny[disabled] {
      opacity: .55;
      cursor: not-allowed;
    }
    .storyboard-density {
      padding: 10px 12px;
      border-top: 1px solid var(--line);
      background: rgba(22,93,255,.05);
    }
    .sb-density-head {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 8px;
      margin-bottom: 8px;
    }
    .sb-density-head .opt-label {
      display: inline-flex;
      align-items: center;
      gap: 6px;
      font-size: var(--fs-small);
      font-weight: 700;
      color: var(--brand-text);
    }
    .sb-density-tip {
      font-size: var(--fs-small);
      color: var(--t2);
    }
    .storyboard-density .dur-presets {
      gap: 8px;
      /* auto-fit：密度卡伸展填满行宽（4 档时 4 列等宽，不再像 auto-fill 那样留出空列）；
         minmax(140px) 保证 613px 步进区（1280 视口）内 4 卡一行不换行 */
      grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
    }
    /* v61.35：镜头密度卡改纵向布局（名称在上、描述在下整块展示）——
       原横向布局把 图标+名称+描述 挤在一行，140px 卡宽内名称被截成「每 5...」（用户反馈显示不完整） */
    .storyboard-density .dur-presets .opt-card {
      flex-direction: column;
      align-items: flex-start;
      gap: 4px;
      padding: 10px 12px;
    }
    .storyboard-density .dur-presets .opt-card .opt-icon {
      width: 24px;
      height: 24px;
      margin-bottom: 1px;
    }
    .storyboard-density .dur-presets .opt-card .opt-name {
      font-size: var(--fs-body);
      font-weight: 600;
      -webkit-line-clamp: 1;
    }
    .storyboard-density .dur-presets .opt-card .opt-sub {
      font-size: var(--fs-micro);
      -webkit-line-clamp: 2;
    }
    .btn.tiny {
      font-size: var(--fs-small);
      padding: 7px 10px;
      flex: 1;
    }
    .shot-frames {
      padding: 10px 12px;
      display: flex;
      flex-direction: column;   /* v61.16 横向布局：左栏内首帧在上、尾帧在下 */
      gap:12px;
      background: rgba(22,93,255,.05);
      /* v61.16 横向布局：左栏固定宽度，内容完整显示 */
      flex: 0 0 300px;
      min-width: 300px;
      border-right: 1px solid var(--line);
    }
    .frame-cell {
      flex: 1;
      min-width: 0;
    }
    .frame-cell .frame-label {
      display: block;
      font-size: var(--fs-small);
      font-weight: 700;
      color: var(--brand-text);
      margin-bottom: 6px;
    }
    .frame-badge {
      display: inline-block;
      margin-left: 6px;
      font-size: var(--fs-micro);
      font-weight: 600;
      color: #fff;
      background: rgba(22,93,255,.8);
      border-radius: 4px;
      padding: 1px 5px;
      vertical-align: middle;
    }
    .frame-badge.shared {
      background: rgba(0,180,42,.92);
    }
    .frame-img-wrap {
      position: relative;
    }
    /* v61.37：.frame-img 就是 <img> 本身（见 frameImgEl 输出），
       约束必须写在它自身上 —— 旧 .frame-img img 嵌套选择器永远匹配不上，
       导致 object-fit 从未生效、首尾帧按固有尺寸(原图 2000px+)渲染，撑爆 300px 左栏与整张卡片。 */
    .frame-img {
      display: block;
      position: relative;
      width: 100%;
      max-width: 100%;
      aspect-ratio: 16/10;
      min-height: 120px;
      object-fit: contain;   /* 缩略图完整显示原图（竖图/方图不裁剪），点图/「预览」看大图 */
      background: var(--bg-3);
      border: 1px solid var(--line);
      border-radius: 8px;
      overflow: hidden;
      cursor: zoom-in;
      transition: border-color .2s, box-shadow .2s, filter .25s ease;
    }
    .frame-img:hover {
      border-color: rgba(22,93,255,.6);
      box-shadow: 0 2px 12px rgba(22,93,255,.15);
      filter: brightness(1.02);
    }
    .frame-zoom-btn {
      position: absolute;
      top: 6px;
      right: 6px;
      width: 28px;
      height: 28px;
      border: none;
      border-radius: 6px;
      background: rgba(0,0,0,.55);
      color: #fff;
      cursor: pointer;
      display: grid;
      place-items: center;
      opacity: 0;
      transition: opacity .2s, background .2s;
      z-index: 2;
      padding: 0;
    }
    .frame-zoom-btn i {
      width: 16px;
      height: 16px;
    }
    .frame-zoom-btn:hover {
      background: rgba(22,93,255,.85);
    }
    .frame-img-wrap:hover .frame-zoom-btn {
      opacity: 1;
    }
    .frame-zoom-overlay {
      position: fixed;
      inset: 0;
      z-index: 9999;
      background: rgba(0,0,0,.82);
      display: flex;
      align-items: center;
      justify-content: center;
      cursor: zoom-out;
      animation: fadeIn .18s ease;
    }
    .frame-zoom-overlay img {
      max-width: 92vw;
      max-height: 92vh;
      object-fit: contain;
      border-radius: 8px;
      box-shadow: 0 8px 40px rgba(0,0,0,.5);
    }
    .frame-zoom-overlay .zoom-close {
      position: absolute;
      top: 20px;
      right: 24px;
      color: #fff;
      font-size: var(--fs-display);
      cursor: pointer;
      opacity: .7;
      transition: opacity .2s;
      line-height: 1;
    }
    .frame-zoom-overlay .zoom-close:hover {
      opacity: 1;
    }
    @keyframes fadeIn {
      from {
        opacity: 0;
      }
      to {
        opacity: 1;
      }
    }
    .storyboard-note {
      margin-top: 12px;
      font-size: var(--fs-small);
      color: var(--t2);
    }
    .storyboard-refmode-notice {
      grid-column: 1 / -1;
      display: flex;
      align-items: flex-start;
      gap:12px;
      margin: 0 0 4px;
      padding: 10px 12px;
      font-size: var(--fs-small);
      line-height: 1.55;
      color: var(--t2);
      background: rgba(14, 165, 233, 0.08);
      border: 1px solid rgba(14, 165, 233, 0.22);
      border-left: 4px solid var(--info);
      border-radius: var(--r-md);
    }
    .storyboard-refmode-notice i[data-lucide] {
      flex: 0 0 auto;
      width: 16px;
      height: 16px;
      margin-top: 1px;
      color: var(--info);
    }
    .storyboard-card.drift {
      border-color: rgba(245,63,63,.7);
      box-shadow: 0 0 0 1px rgba(245,63,63,.4), 0 6px 18px rgba(245,63,63,.15);
    }
    .drift-badge {
      margin: 0 14px 4px;
      font-size: var(--fs-small);
      color: var(--err);
      background: rgba(245,63,63,.1);
      border-radius: 6px;
      padding: 4px 8px;
    }
    .storyboard-consistency-result {
      margin-top: 12px;
    }
    .svg-preview {
      display: flex;
      align-items: center;
      gap: 12px;
      margin: 12px 0;
      padding: 10px 12px;
      background: rgba(22,93,255,.06);
      border: 1px solid var(--line);
      border-radius: var(--r-md);
    }
    .svg-preview.hidden {
      display: none;
    }
    .svg-preview img {
      width: 64px;
      height: 64px;
      object-fit: contain;
      background: #fff;
      border-radius: 8px;
      border: 1px solid var(--line);
    }
    .svg-preview-meta {
      display: flex;
      flex-direction: column;
      gap: 6px;
    }
    .svg-preview-meta span {
      font-size: var(--fs-small);
      color: var(--t1);
      font-weight: 600;
    }
    .svg-anchor-opt {
      display: flex;
      align-items: center;
      gap: 6px;
      padding: 6px 14px;
      font-size: var(--fs-small);
      color: var(--t2);
    }
    .storyboard-info {
      flex: 1 1 auto;
      min-width: 0;
      display: flex;
      flex-direction: column;
    }
    .storyboard-info .storyboard-btns {
      margin-top: auto;
      padding-top: 10px;
    }
    .svg-anchor-opt input {
      width: 14px;
      height: 14px;
      accent-color: var(--brand-text);
    }
    .consistency-actions {
      display: flex;
      align-items: center;
      gap:12px;
      margin: 10px 0;
      flex-wrap: wrap;
    }
    .consistency-count {
      font-size: var(--fs-small);
      color: var(--t2);
    }
    .consistency-thumbs {
      display: flex;
      gap: 8px;
      flex-wrap: wrap;
      margin-bottom: 10px;
    }
    .consistency-thumb {
      position: relative;
      width: 64px;
      height: 64px;
      border-radius: 8px;
      overflow: hidden;
      border: 1px solid var(--line);
    }
    .consistency-thumb img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      display: block;
    }
    .consistency-thumb .ct-remove {
      position: absolute;
      top: 2px;
      right: 2px;
      width: 18px;
      height: 18px;
      border: none;
      border-radius: 50%;
      background: rgba(0,0,0,.55);
      color: #fff;
      font-size: var(--fs-small);
      line-height: 1;
      cursor: pointer;
    }
    .consistency-result {
      margin-top: 8px;
    }
    .consistency-score {
      font-size: var(--fs-body);
      padding: 8px 12px;
      border-radius: 8px;
      background: var(--bg-2);
    }
    .consistency-score.ok {
      color: var(--ok);
      background: rgba(0,180,42,.1);
    }
    .consistency-score.warn {
      color: var(--warn);
      background: rgba(245,158,11,.1);
    }
    .consistency-score.bad {
      color: var(--err);
      background: rgba(245,63,63,.1);
    }
    .consistency-warn {
      font-size: var(--fs-small);
      color: var(--warn);
      margin-top: 6px;
    }
    .consistency-matrix {
      margin-top: 10px;
      overflow-x: auto;
    }
    .consistency-matrix table {
      border-collapse: collapse;
      font-size: var(--fs-small);
    }
    .consistency-matrix th, .consistency-matrix td {
      border: 1px solid var(--line);
      padding: 4px 8px;
      text-align: center;
    }
    .consistency-matrix td.diag {
      background: var(--bg-3);
      color: var(--t3);
    }
    .consistency-matrix td.hi {
      color: var(--ok);
    }
    .consistency-matrix td.mid {
      color: var(--warn);
    }
    .consistency-matrix td.lo {
      color: var(--err);
      font-weight: 700;
    }
    .demo-gallery {
      margin-top: 14px;
      padding: 12px 14px;
      border-radius: var(--r-md);
      border: 1px solid var(--line-strong);
      background: var(--glass-bg);
      box-shadow: var(--shadow-soft);
    }
    .demo-gallery-head {
      display: flex;
      align-items: center;
      gap:12px;
      font-size: var(--fs-body);
      color: var(--t1);
      margin-bottom: 10px;
    }
    .demo-gallery-head strong {
      color: var(--brand-text);
    }
    .demo-gallery-head .hint {
      margin-left: auto;
    }
    .demo-gallery-grid {
      display: grid;
      grid-template-columns: repeat(auto-fill, minmax(110px, 1fr));
      gap: 8px;
    }
    .demo-thumb {
      position: relative;
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 4px;
      padding: 0;
      border: 1px solid var(--line);
      border-radius: var(--r-sm);
      background: var(--bg-2);
      cursor: pointer;
      overflow: hidden;
      transition: .15s var(--ease);
    }
    .demo-thumb:hover {
      border-color: var(--brand-text);
      transform: translateY(-1px);
      box-shadow: 0 4px 14px rgba(0,0,0,.35);
    }
    .demo-thumb img {
      width: 100%;
      height: 86px;
      object-fit: cover;
      display: block;
    }
    .demo-thumb span {
      font-size: var(--fs-micro);
      color: var(--t2);
      padding-bottom: 4px;
    }
  }
  @property --tw-rotate-x {
    syntax: "*";
    inherits: false;
  }
  @property --tw-rotate-y {
    syntax: "*";
    inherits: false;
  }
  @property --tw-rotate-z {
    syntax: "*";
    inherits: false;
  }
  @property --tw-skew-x {
    syntax: "*";
    inherits: false;
  }
  @property --tw-skew-y {
    syntax: "*";
    inherits: false;
  }
  @property --tw-border-style {
    syntax: "*";
    inherits: false;
    initial-value: solid;
  }
  @property --tw-shadow {
    syntax: "*";
    inherits: false;
    initial-value: 0 0 #0000;
  }
  @property --tw-shadow-color {
    syntax: "*";
    inherits: false;
  }
  @property --tw-shadow-alpha {
    syntax: "<percentage>";
    inherits: false;
    initial-value: 100%;
  }
  @property --tw-inset-shadow {
    syntax: "*";
    inherits: false;
    initial-value: 0 0 #0000;
  }
  @property --tw-inset-shadow-color {
    syntax: "*";
    inherits: false;
  }
  @property --tw-inset-shadow-alpha {
    syntax: "<percentage>";
    inherits: false;
    initial-value: 100%;
  }
  @property --tw-ring-color {
    syntax: "*";
    inherits: false;
  }
  @property --tw-ring-shadow {
    syntax: "*";
    inherits: false;
    initial-value: 0 0 #0000;
  }
  @property --tw-inset-ring-color {
    syntax: "*";
    inherits: false;
  }
  @property --tw-inset-ring-shadow {
    syntax: "*";
    inherits: false;
    initial-value: 0 0 #0000;
  }
  @property --tw-ring-inset {
    syntax: "*";
    inherits: false;
  }
  @property --tw-ring-offset-width {
    syntax: "<length>";
    inherits: false;
    initial-value: 0px;
  }
  @property --tw-ring-offset-color {
    syntax: "*";
    inherits: false;
    initial-value: #fff;
  }
  @property --tw-ring-offset-shadow {
    syntax: "*";
    inherits: false;
    initial-value: 0 0 #0000;
  }
  @property --tw-outline-style {
    syntax: "*";
    inherits: false;
    initial-value: solid;
  }
  @property --tw-blur {
    syntax: "*";
    inherits: false;
  }
  @property --tw-brightness {
    syntax: "*";
    inherits: false;
  }
  @property --tw-contrast {
    syntax: "*";
    inherits: false;
  }
  @property --tw-grayscale {
    syntax: "*";
    inherits: false;
  }
  @property --tw-hue-rotate {
    syntax: "*";
    inherits: false;
  }
  @property --tw-invert {
    syntax: "*";
    inherits: false;
  }
  @property --tw-opacity {
    syntax: "*";
    inherits: false;
  }
  @property --tw-saturate {
    syntax: "*";
    inherits: false;
  }
  @property --tw-sepia {
    syntax: "*";
    inherits: false;
  }
  @property --tw-drop-shadow {
    syntax: "*";
    inherits: false;
  }
  @property --tw-drop-shadow-color {
    syntax: "*";
    inherits: false;
  }
  @property --tw-drop-shadow-alpha {
    syntax: "<percentage>";
    inherits: false;
    initial-value: 100%;
  }
  @property --tw-drop-shadow-size {
    syntax: "*";
    inherits: false;
  }
  @property --tw-backdrop-blur {
    syntax: "*";
    inherits: false;
  }
  @property --tw-backdrop-brightness {
    syntax: "*";
    inherits: false;
  }
  @property --tw-backdrop-contrast {
    syntax: "*";
    inherits: false;
  }
  @property --tw-backdrop-grayscale {
    syntax: "*";
    inherits: false;
  }
  @property --tw-backdrop-hue-rotate {
    syntax: "*";
    inherits: false;
  }
  @property --tw-backdrop-invert {
    syntax: "*";
    inherits: false;
  }
  @property --tw-backdrop-opacity {
    syntax: "*";
    inherits: false;
  }
  @property --tw-backdrop-saturate {
    syntax: "*";
    inherits: false;
  }
  @property --tw-backdrop-sepia {
    syntax: "*";
    inherits: false;
  }
  @property --tw-ease {
    syntax: "*";
    inherits: false;
  }
  @keyframes spin {
    to {
      transform: rotate(360deg);
    }
  }
  @layer properties {
    @supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) {
      *, ::before, ::after, ::backdrop {
        --tw-rotate-x: initial;
        --tw-rotate-y: initial;
        --tw-rotate-z: initial;
        --tw-skew-x: initial;
        --tw-skew-y: initial;
        --tw-border-style: solid;
        --tw-shadow: 0 0 #0000;
        --tw-shadow-color: initial;
        --tw-shadow-alpha: 100%;
        --tw-inset-shadow: 0 0 #0000;
        --tw-inset-shadow-color: initial;
        --tw-inset-shadow-alpha: 100%;
        --tw-ring-color: initial;
        --tw-ring-shadow: 0 0 #0000;
        --tw-inset-ring-color: initial;
        --tw-inset-ring-shadow: 0 0 #0000;
        --tw-ring-inset: initial;
        --tw-ring-offset-width: 0px;
        --tw-ring-offset-color: #fff;
        --tw-ring-offset-shadow: 0 0 #0000;
        --tw-outline-style: solid;
        --tw-blur: initial;
        --tw-brightness: initial;
        --tw-contrast: initial;
        --tw-grayscale: initial;
        --tw-hue-rotate: initial;
        --tw-invert: initial;
        --tw-opacity: initial;
        --tw-saturate: initial;
        --tw-sepia: initial;
        --tw-drop-shadow: initial;
        --tw-drop-shadow-color: initial;
        --tw-drop-shadow-alpha: 100%;
        --tw-drop-shadow-size: initial;
        --tw-backdrop-blur: initial;
        --tw-backdrop-brightness: initial;
        --tw-backdrop-contrast: initial;
        --tw-backdrop-grayscale: initial;
        --tw-backdrop-hue-rotate: initial;
        --tw-backdrop-invert: initial;
        --tw-backdrop-opacity: initial;
        --tw-backdrop-saturate: initial;
        --tw-backdrop-sepia: initial;
        --tw-ease: initial;
      }
    }
  }
  @media (max-width: 768px) {
    html, body {
      overflow-x: hidden;
      max-width: 100vw;
    }
    .wiki-card:has(.wiki-table), .tbl, .table-wrap, .consistency-matrix, .demo-gallery, div:has(> table) {
      overflow-x: auto;
      max-width: 100%;
      -webkit-overflow-scrolling: touch;
    }
    table {
      min-width: 480px;
    }
    @supports not (selector(:has(*))) {
      .wiki-card, .tbl, .table-wrap, .consistency-matrix, .demo-gallery {
        overflow-x: auto;
        max-width: 100%;
      }
    }
    .lib-btn, .icon-btn, .theme-toggle, .modal-close, .wiki-copy-btn, .free-remove, .io-tab, button.btn.sm {
      min-width: 44px;
      min-height: 44px;
      display: inline-grid;
      place-items: center;
    }
    input[type="text"], input[type="number"], input[type="search"], input[type="email"], input[type="url"], textarea, select {
      font-size: var(--fs-h2);
    }
    body {
      touch-action: manipulation;
    }
    .brand-name {
      font-size: var(--fs-body);
      max-width: 160px;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }
    .brand-sub {
      display: inline-flex;
      align-items: center;
      font-size: var(--fs-nano);
      padding-left: 9px;
      border-left: 1px solid var(--line-strong);
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }
  }
  .multiview-box {
    margin-top: var(--space-section);
    padding: 12px 14px;
    border: 1px solid var(--line-strong);
    border-radius: var(--r-md);
    background: var(--glass-bg);
    box-shadow: var(--shadow-xs);
  }
  .multiview-head {
    display: flex;
    flex-direction: column;
    gap:12px;
    margin-bottom: 8px;
  }
  .mv-head-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
  }
  .mv-head-titles {
    display: flex;
    flex-direction: row;
    align-items: baseline;
    flex-wrap: wrap;
    gap:12px;
    min-width: 0;
  }
  .mv-head-controls {
    display: flex;
    align-items: center;
    gap:12px;
    flex-shrink: 0;
    margin-left: auto;
  }
  .mv-title {
    font-weight: 700;
    font-size: var(--fs-body);
    display: inline-flex;
    align-items: center;
    gap: 7px;
    color: var(--t1);
  }
  .mv-title svg {
    width: 16px;
    height: 16px;
    color: var(--brand-text);
    flex-shrink: 0;
  }
  .mv-sub {
    font-size: var(--fs-small);
    color: var(--t-muted);
    line-height: 1.5;
  }
  .multiview-grid {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 8px;
    margin-top: var(--space-block);
    align-items: start;
  }
  .mv-cell {
    position: relative;
    border: 1.5px solid var(--line-strong);
    border-radius: var(--r-md);
    aspect-ratio: 1 / 1;
    overflow: hidden;
    background: var(--bg-1);
    transition: var(--duration-normal) var(--ease);
    width: 100%;
    max-width: 200px;
    justify-self: center;
    display: flex;
    flex-direction: column;
  }
  .mv-cell.prompt-open {
    aspect-ratio: auto;
    height: auto;
    overflow: visible;
    max-width: 100%;
  }
  .mv-img {
    position: absolute;
    inset: 0;
    background-size: cover;
    background-position: center;
    background-color: #fff;
    cursor: zoom-in;
  }
  .mv-img.mv-placeholder {
    background: linear-gradient(110deg, var(--bg-2) 8%, var(--bg-3) 18%, var(--bg-2) 33%);
    background-size: 200% 100%;
    animation: mvShimmer 1.4s linear infinite;
  }
  @keyframes mvShimmer {
    to {
      background-position: -200% 0;
    }
  }
  .mv-label {
    position: absolute;
    left: 6px;
    bottom: 6px;
    padding: 2px 7px;
    background: rgba(0, 0, 0, .55);
    color: #fff;
    font-size: var(--fs-nano);
    font-weight: 600;
    border-radius: var(--r-sm);
    pointer-events: none;
  }
  .mv-btn {
    position: absolute;
    top: 6px;
    width: 24px;
    height: 24px;
    border-radius: 50%;
    border: none;
    cursor: pointer;
    background: rgba(0, 0, 0, .55);
    color: #fff;
    display: grid;
    place-items: center;
    z-index: 3;
    transition: .15s;
  }
  .mv-btn:hover {
    background: rgba(0, 0, 0, .8);
    transform: scale(1.08);
  }
  .mv-btn svg {
    width: 13px;
    height: 13px;
  }
  .mv-regen {
    right: 6px;
  }
  .mv-mark {
    right: 34px;
  }
  .mv-cell.marked .mv-mark {
    background: var(--err);
  }
  .mv-cell.prompt-open {
    aspect-ratio: auto;
    height: auto;
    overflow: visible;
    max-width: 100%;
  }
  .mv-cell.prompt-open .mv-img {
    position: relative;
    inset: auto;
    height: 120px;
    flex: 0 0 120px;
  }
  .mv-prompt {
    margin-top: 8px;
    display: flex;
    flex-direction: column;
    gap: 6px;
  }
  .mv-prompt[hidden] {
    display: none;
  }
  .mv-prompt-input {
    width: 100%;
    resize: vertical;
    min-height: 44px;
    padding: 7px 9px;
    border: 1px solid var(--line-strong);
    border-radius: var(--r-sm);
    font-size: var(--fs-small);
    line-height: 1.5;
    background: var(--bg-1);
    color: var(--t1);
  }
  .mv-prompt-input:focus {
    outline: 2px solid var(--brand);
    outline-offset: 0;
    border-color: var(--brand-text);
  }
  .mv-prompt-actions {
    display: flex;
    gap: 6px;
    justify-content: flex-end;
  }
  .multiview-refine {
    margin-top: 10px;
    padding: 10px 12px;
    background: var(--bg-1);
    border: 1px dashed var(--line-strong);
    border-radius: var(--r-sm);
  }
  .mv-refine-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap:12px;
    margin-bottom: 6px;
    font-size: var(--fs-small);
    font-weight: 600;
    color: var(--t2);
  }
  .mv-refine-head span:first-child {
    display: inline-flex;
    align-items: center;
    gap: 5px;
  }
  .mv-refine-head svg {
    width: 14px;
    height: 14px;
    color: var(--brand-soft);
  }
  .mv-refine-row {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
  }
  .mv-refine-names {
    font-size: var(--fs-small);
    color: var(--t-muted);
    line-height: 1.4;
  }
  .multiview-actions {
    display: flex;
    gap: 8px;
    margin-top: 10px;
    justify-content: flex-end;
    padding-top: 10px;
    border-top: 1px solid var(--line);
  }
  .multiview-actions .btn.confirmed {
    opacity: .6;
    pointer-events: none;
  }
  @media (max-width: 1024px) {
    .multiview-grid {
      grid-template-columns: repeat(4, minmax(0, 1fr));
    }
    .multiview-grid.mode-14 {
      grid-template-columns: repeat(5, minmax(0, 1fr));
    }
  }
  @media (max-width: 640px) {
    .multiview-grid {
      grid-template-columns: repeat(3, minmax(0, 1fr));
    }
    .multiview-grid.mode-14 {
      grid-template-columns: repeat(3, minmax(0, 1fr));
    }
  }
  .mv-lightbox {
    position: fixed;
    inset: 0;
    z-index: 120;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px;
  }
  .mv-lightbox[hidden] {
    display: none;
  }
  .mv-lightbox-backdrop {
    position: absolute;
    inset: 0;
    background: rgba(15, 23, 42, .82);
    backdrop-filter: blur(3px);
  }
  .mv-lightbox-inner {
    position: relative;
    z-index: 1;
    max-width: min(92vw, 900px);
    max-height: 88vh;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap:12px;
  }
  .mv-lightbox-inner img {
    max-width: 100%;
    max-height: 62vh;
    width: auto;
    height: auto;
    border-radius: 12px;
    box-shadow: 0 20px 60px rgba(0,0,0,.5);
    background: #fff;
    object-fit: contain;
  }
  .mv-lightbox-cap {
    color: #e2e8f0;
    font-size: var(--fs-body);
    font-weight: 600;
  }
  .mv-lightbox-close {
    position: absolute;
    top: -44px;
    right: 0;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    border: none;
    background: rgba(255,255,255,.15);
    color: #fff;
    display: grid;
    place-items: center;
    cursor: pointer;
  }
  .mv-lightbox-close:hover {
    background: rgba(255,255,255,.3);
  }
  .mv-lightbox-close svg {
    width: 18px;
    height: 18px;
  }
  .mv-lightbox-thumbs {
    display: flex;
    gap: 8px;
    flex-wrap: nowrap;
    overflow-x: auto;
    overflow-y: hidden;
    padding: 4px 0;
    margin-top: 4px;
    max-width: 100%;
    scroll-snap-type: x proximity;
    scrollbar-width: thin;
    scrollbar-color: rgba(255,255,255,.3) transparent;
  }
  .mv-lightbox-thumbs::-webkit-scrollbar {
    height: 6px;
  }
  .mv-lightbox-thumbs::-webkit-scrollbar-thumb {
    background: rgba(255,255,255,.25);
    border-radius: 3px;
  }
  .mv-lightbox-thumbs::-webkit-scrollbar-track {
    background: transparent;
  }
  .mv-lightbox-thumb {
    flex: 0 0 auto;
    width: 60px;
    height: 60px;
    padding: 0;
    border: 2px solid transparent;
    border-radius: 8px;
    background: rgba(255,255,255,.06);
    cursor: pointer;
    overflow: hidden;
    scroll-snap-align: start;
    transition: border-color .15s, transform .15s;
  }
  .mv-lightbox-thumb:hover {
    border-color: rgba(255,255,255,.6);
    transform: translateY(-1px);
  }
  .mv-lightbox-thumb.active {
    border-color: var(--brand-text, #165DFF);
    box-shadow: 0 0 0 2px rgba(22,93,255,.35);
  }
  .mv-lightbox-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
  }
  .mv-lightbox-arrow {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 40px;
    height: 40px;
    border-radius: 50%;
    border: none;
    background: rgba(255,255,255,.15);
    color: #fff;
    display: grid;
    place-items: center;
    cursor: pointer;
    z-index: 2;
    transition: background .15s;
  }
  .mv-lightbox-arrow:hover:not(:disabled) {
    background: rgba(255,255,255,.3);
  }
  .mv-lightbox-arrow:disabled {
    opacity: .3;
    cursor: not-allowed;
  }
  .mv-lightbox-arrow.prev {
    left: 24px;
  }
  .mv-lightbox-arrow.next {
    right: 24px;
  }
  .mv-lightbox-arrow svg {
    width: 20px;
    height: 20px;
  }
  @media (max-width: 720px) {
    .mv-lightbox-arrow.prev {
      left: 8px;
    }
    .mv-lightbox-arrow.next {
      right: 8px;
    }
  }
  .lb-strip {
    display: flex;
    gap: 8px;
    flex-wrap: nowrap;
    overflow-x: auto;
    overflow-y: hidden;
    padding: 4px 2px;
    margin-top: 6px;
    max-width: 100%;
    scroll-snap-type: x proximity;
    scrollbar-width: thin;
    scrollbar-color: rgba(255,255,255,.3) transparent;
  }
  .lb-strip[hidden] {
    display: none;
  }
  .lb-strip::-webkit-scrollbar {
    height: 6px;
  }
  .lb-strip::-webkit-scrollbar-thumb {
    background: rgba(255,255,255,.25);
    border-radius: 3px;
  }
  .lb-strip::-webkit-scrollbar-track {
    background: transparent;
  }
  .lb-thumb {
    flex: 0 0 auto;
    width: 56px;
    height: 56px;
    padding: 0;
    border: 2px solid transparent;
    border-radius: 8px;
    background: rgba(255,255,255,.06);
    cursor: pointer;
    overflow: hidden;
    scroll-snap-align: start;
    transition: border-color .15s, transform .15s;
  }
  .lb-thumb:hover {
    border-color: rgba(255,255,255,.6);
    transform: translateY(-1px);
  }
  .lb-thumb.active {
    border-color: var(--brand-text, #165DFF);
    box-shadow: 0 0 0 2px rgba(22,93,255,.35);
  }
  .lb-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
  }
  .lb-arrow {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 40px;
    height: 40px;
    border-radius: 50%;
    border: none;
    background: rgba(255,255,255,.15);
    color: #fff;
    display: grid;
    place-items: center;
    cursor: pointer;
    z-index: 3;
    transition: background .15s;
  }
  .lb-arrow:hover:not(:disabled) {
    background: rgba(255,255,255,.3);
  }
  .lb-arrow:disabled {
    opacity: .3;
    cursor: not-allowed;
  }
  .lb-arrow.prev {
    left: 12px;
  }
  .lb-arrow.next {
    right: 12px;
  }
  .lb-arrow svg {
    width: 20px;
    height: 20px;
  }
  .lb-cap {
    color: #e2e8f0;
    font-size: var(--fs-body);
    font-weight: 600;
  }
  .frame-zoom-inner {
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    cursor: default;
    max-width: 92vw;
  }
  .frame-zoom-inner img {
    max-width: 100%;
    max-height: 72vh;
    width: auto;
    height: auto;
    border-radius: 8px;
    box-shadow: 0 8px 40px rgba(0,0,0,.5);
    object-fit: contain;
  }
  @media (max-width: 720px) {
    .lb-arrow.prev {
      left: 6px;
    }
    .lb-arrow.next {
      right: 6px;
    }
  }
  .artbus-user-menu {
    display: inline-flex;
    align-items: center;
  }
  .artbus-user-trigger {
    gap: 8px !important;
  }
  .artbus-avatar {
    width: 26px;
    height: 26px;
    border-radius: var(--r-full);
    display: inline-grid;
    place-items: center;
    background: var(--grad-brand);
    color: #0E42D2;
    font-size: var(--fs-small);
    font-weight:600;
    flex-shrink: 0;
    box-shadow: var(--shadow-glow);
  }
  .artbus-avatar.lg {
    width: 36px;
    height: 36px;
    font-size: var(--fs-h2);
  }
  /* v61.73 加宽用户菜单, 修复 折合¥/已用总额/租户 长值断行换行 */
  .artbus-user-dropdown {
    min-width: 280px;
    width: 280px;
    white-space: nowrap;
  }
  .artbus-user-head {
    display: flex;
    align-items: center;
    gap:12px;
    padding: 8px 6px 10px;
    margin-bottom: 4px;
    border-bottom: 1px solid var(--line);
  }
  .artbus-user-head .artbus-user-name {
    font-size: var(--fs-body);
    font-weight: 600;
    color: var(--t1);
  }
  .artbus-user-head .artbus-user-role {
    font-size: var(--fs-small);
    color: var(--brand-text);
    margin-top: 2px;
  }
  .artbus-dropdown-divider {
    height: 1px;
    background: var(--line);
    margin: 4px 0;
  }
  .artbus-user-dropdown a, .artbus-user-dropdown button {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 9px 11px;
    width: 100%;
    border-radius: var(--r-sm);
    border: none;
    background: transparent;
    font-size: var(--fs-body);
    color: var(--t1);
    cursor: pointer;
    transition: var(--duration-fast) var(--ease);
    text-align: left;
  }
  .artbus-user-dropdown a:hover, .artbus-user-dropdown button:hover {
    background: var(--bg-3);
    color: var(--brand-text);
  }
  .artbus-user-dropdown svg {
    width: 14px;
    height: 14px;
    color: inherit;
  }
  .artbus-login-btn {
    color: var(--brand-text) !important;
    background: rgba(22,93,255, 0.08) !important;
    border-color: rgba(22,93,255, 0.18) !important;
  }
  .artbus-login-btn:hover {
    color: #fff !important;
    background: var(--grad-brand) !important;
    border-color: transparent !important;
    box-shadow: 0 2px 8px rgba(22,93,255, 0.28);
  }
  .artbus-credit-pill {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 2px 9px;
    margin-left: 2px;
    border-radius: var(--r-full);
    background: rgba(14, 165, 233, 0.12);
    color: #165DFF;
    font-size: var(--fs-small);
    font-weight:600;
    line-height: 1.5;
    border: 1px solid rgba(14, 165, 233, 0.26);
    white-space: nowrap;
  }
  [data-theme="dark"] .artbus-credit-pill {
    background: rgba(56, 189, 248, 0.14);
    color: #4080FF;
    border-color: rgba(56, 189, 248, 0.30);
  }
  .artbus-credit-pill svg {
    width: 12px;
    height: 12px;
  }
  .quota-pill {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 3px 10px;
    margin-left: 2px;
    border-radius: var(--r-full);
    background: rgba(14, 165, 233, 0.12);
    color: var(--brand-text);
    font-size: var(--fs-small);
    font-weight: 600;
    line-height: 1.4;
    border: 1px solid rgba(14, 165, 233, 0.22);
    white-space: nowrap;
    cursor: pointer;
    user-select: none;
  }
  [data-theme="dark"] .quota-pill {
    background: rgba(56, 189, 248, 0.14);
    border-color: rgba(56, 189, 248, 0.26);
  }
  .quota-pill svg {
    width: 12px;
    height: 12px;
  }
  .quota-pill b {
    font-weight: 700;
  }
  .quota-pill em {
    font-style: normal;
    opacity: 0.7;
    margin-left: 2px;
  }
  .quota-pill .quota-sep {
    opacity: 0.4;
    margin: 0 4px;
  }
  .quota-pill.quota-warn {
    background: rgba(245,63,63, 0.14);
    color: #F53F3F;
    border-color: rgba(245,63,63, 0.32);
  }
  .quota-pill.hidden {
    display: none;
  }
  .artbus-credit-card {
    margin: 6px 2px 8px;
    padding: 10px 11px;
    border-radius: var(--r-md);
    background: var(--bg-3);
    border: 1px solid var(--line);
  }
  /* v61.73 修复 已用/总额/折合人民币/租户 等长值断行换行 */
  .artbus-credit-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    font-size: var(--fs-small);
    color: var(--t2);
    white-space: nowrap;
  }
  .artbus-credit-row > span:first-child {
    flex: 1;
    min-width: 0;
  }
  .artbus-credit-row > span:last-child,
  .artbus-credit-row > b {
    flex: none;
    white-space: nowrap;
    font-variant-numeric: tabular-nums;
  }
  .artbus-credit-row + .artbus-credit-row {
    margin-top: 5px;
  }
  .artbus-credit-row.sub {
    font-size: var(--fs-small);
    color: var(--t3);
  }
  .artbus-credit-label {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    color: var(--t2);
  }
  .artbus-credit-label svg {
    width: 13px;
    height: 13px;
    color: #FF7D00;
  }
  .artbus-credit-num {
    font-size: var(--fs-h2);
    font-weight: 700;
    color: #FF7D00;
    font-variant-numeric: tabular-nums;
  }
  .auth-page {
    min-height: 100vh;
    display: grid;
    place-items: center;
    background: var(--bg-0);
    padding: 24px;
    position: relative;
    overflow: hidden;
  }
  .auth-page::before {
    content: '';
    position: absolute;
    inset: 0;
    background: var(--grad-aurora);
    pointer-events: none;
  }
  .auth-card {
    position: relative;
    z-index: 1;
    width: 100%;
    max-width: 380px;
    background: var(--bg-1);
    border: 1px solid var(--line-strong);
    border-radius: var(--r-xl);
    box-shadow: var(--shadow-lg);
    padding: 32px 28px;
  }
  .auth-brand {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 24px;
  }
  .auth-brand .logo {
    width: 40px;
    height: 40px;
    border-radius: var(--r-md);
    display: grid;
    place-items: center;
    color: #fff;
    font-size: var(--fs-h1);
    background: var(--grad-brand);
    box-shadow: var(--shadow-glow);
  }
  .auth-brand .name {
    font-weight: 700;
    font-size: var(--fs-h2);
    color: var(--t1);
    letter-spacing: .02em;
  }
  .auth-brand .sub {
    font-size: var(--fs-small);
    color: var(--t3);
    margin-top: 2px;
  }
  .auth-title {
    font-size: var(--fs-h1);
    font-weight:600;
    color: var(--t1);
    margin-bottom: 4px;
  }
  .auth-subtitle {
    font-size: var(--fs-small);
    color: var(--t3);
    margin-bottom: 24px;
  }
  .auth-form {
    display: flex;
    flex-direction: column;
    gap:16px;
  }
  .auth-field {
    display: flex;
    flex-direction: column;
    gap: 6px;
  }
  .auth-field label {
    font-size: var(--fs-small);
    font-weight: 600;
    color: var(--t2);
  }
  .auth-input {
    width: 100%;
    padding: 10px 12px;
    border-radius: var(--r-md);
    background: var(--bg-2);
    color: var(--t1);
    border: 1px solid var(--line-strong);
    font-size: var(--fs-body);
    font-family: inherit;
    transition: var(--duration-fast) var(--ease);
  }
  .auth-input:focus {
    outline: none;
    border-color: var(--brand-text);
    box-shadow: 0 0 0 3px rgba(22,93,255, 0.12);
    background: var(--bg-1);
  }
  .auth-input::placeholder {
    color: var(--t-muted);
  }
  .auth-actions {
    margin-top: 8px;
    display: flex;
    flex-direction: column;
    gap:12px;
  }
  .auth-btn {
    width: 100%;
    padding: 11px 16px;
    border-radius: var(--r-md);
    border: none;
    cursor: pointer;
    background: var(--brand);
    color: #fff;
    font-size: var(--fs-body);
    font-weight: 600;
    font-family: inherit;
    transition: var(--duration-fast) var(--ease);
    box-shadow: 0 2px 8px rgba(37, 99, 235, 0.25);
  }
  [data-theme="dark"] .auth-btn { background: var(--grad-brand); color: #fff; box-shadow: 0 2px 8px rgba(22,93,255,0.25); }
  .auth-btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 4px 14px rgba(22,93,255, 0.35);
  }
  .auth-btn:active {
    transform: translateY(0);
  }
  .auth-btn:disabled {
    opacity: .6;
    cursor: not-allowed;
    transform: none;
  }
  .auth-btn.secondary {
    background: var(--bg-2);
    color: var(--t2);
    border: 1px solid var(--line-strong);
    box-shadow: none;
  }
  .auth-btn.secondary:hover {
    background: var(--bg-3);
    color: var(--t1);
  }
  .auth-links {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    font-size: var(--fs-small);
  }
  .auth-links a {
    color: var(--t3);
    text-decoration: none;
    transition: color var(--duration-fast) var(--ease);
  }
  .auth-links a:hover {
    color: var(--brand-text);
  }
  .auth-error {
    padding: 9px 12px;
    border-radius: var(--r-sm);
    background: rgba(245,63,63, 0.08);
    color: var(--err);
    border: 1px solid rgba(245,63,63, 0.18);
    font-size: var(--fs-small);
    line-height: 1.5;
  }
  .auth-hint {
    margin-top: 18px;
    padding-top: 16px;
    border-top: 1px dashed var(--line);
    font-size: var(--fs-small);
    color: var(--t-muted);
    line-height: 1.6;
  }
  .auth-hint code {
    background: var(--bg-3);
    padding: 1px 6px;
    border-radius: var(--r-xs);
    font-family: var(--font-mono);
    font-size: var(--fs-nano);
    color: var(--brand-text);
  }
  .auth-divider {
    display: flex;
    align-items: center;
    gap: 12px;
    margin: 20px 0 12px;
  }
  .auth-divider::before, .auth-divider::after {
    content: '';
    flex: 1;
    height: 1px;
    background: var(--line);
  }
  .auth-divider span {
    font-size: var(--fs-small);
    color: var(--t-muted);
    white-space: nowrap;
  }
  .demo-accounts {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
  }
  .demo-chip {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 12px;
    border-radius: var(--r-md);
    border: 1px solid var(--line);
    background: var(--bg-2);
    cursor: pointer;
    transition: all .18s ease;
    text-align: left;
    color: var(--t1);
  }
  .demo-chip:hover {
    border-color: var(--brand-text);
    background: rgba(22,93,255,.08);
    transform: translateY(-1px);
    box-shadow: 0 3px 10px rgba(22,93,255,.15);
  }
  .demo-chip:active {
    transform: translateY(0);
  }
  .demo-chip.loading {
    opacity: .6;
    pointer-events: none;
  }
  .demo-chip svg {
    width: 18px;
    height: 18px;
    color: var(--brand-text);
    flex-shrink: 0;
  }
  .demo-chip .demo-info {
    display: flex;
    flex-direction: column;
    line-height: 1.3;
    min-width: 0;
  }
  .demo-chip .demo-info b {
    font-size: var(--fs-body);
    font-weight: 600;
  }
  .demo-chip .demo-info em {
    font-size: var(--fs-micro);
    color: var(--t-muted);
    font-style: normal;
    font-family: var(--font-mono);
  }
  .auth-theme-toggle {
    position: absolute;
    top: 18px;
    right: 18px;
    z-index: 2;
    width: 32px;
    height: 32px;
    padding: 7px;
    border-radius: var(--r-full);
    border: 1px solid transparent;
    background: transparent;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--t2);
    transition: var(--duration-fast) var(--ease);
  }
  .auth-theme-toggle:hover {
    background: var(--bg-2);
    border-color: var(--line);
    transform: rotate(15deg);
  }
  .users-wrap {
    min-height: 100vh;
    background: var(--bg-0);
  }
  .users-topbar {
    position: sticky;
    top: 0;
    z-index: 30;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px 24px;
    background: var(--glass-bg);
    backdrop-filter: saturate(180%) blur(14px);
    -webkit-backdrop-filter: saturate(180%) blur(14px);
    border-bottom: 1px solid var(--line);
  }
  .users-topbar .brand-block {
    display: flex;
    align-items: center;
    gap: 12px;
    min-width: 0;
  }
  .users-topbar .brand-block .logo {
    width: 36px;
    height: 36px;
    border-radius: var(--r-md);
    display: grid;
    place-items: center;
    color: #fff;
    font-size: var(--fs-h1);
    background: var(--grad-brand);
    box-shadow: var(--shadow-glow);
  }
  .users-topbar .brand-block .name {
    font-weight: 700;
    font-size: var(--fs-h2);
    color: var(--t1);
  }
  .users-topbar .brand-block .sub {
    font-size: var(--fs-small);
    color: var(--t3);
    margin-top: 1px;
  }
  .users-tabs {
    display: flex;
    gap: 4px;
    padding: 12px 24px 0;
    border-bottom: 1px solid var(--line);
    background: var(--bg-1);
    overflow-x: auto;
  }
  .users-tab {
    padding: 10px 18px;
    border: none;
    cursor: pointer;
    background: transparent;
    color: var(--t2);
    font-size: var(--fs-body);
    font-weight: 600;
    font-family: inherit;
    border-bottom: 2px solid transparent;
    transition: var(--duration-fast) var(--ease);
    white-space: nowrap;
    display: inline-flex;
    align-items: center;
    gap: 6px;
  }
  .users-tab:hover {
    color: var(--t1);
  }
  .users-tab.active {
    color: var(--brand-text);
    border-bottom-color: var(--brand-text);
  }
  .users-tab svg {
    width: 14px;
    height: 14px;
  }
  .users-main {
    padding: 20px 24px 60px;
    max-width: 1400px;
    margin: 0 auto;
  }
  .users-tab-pane {
    display: none;
  }
  .users-tab-pane.active {
    display: block;
    animation: fadeIn .18s var(--ease);
  }
  @keyframes fadeIn {
    from {
      opacity: 0;
      transform: translateY(4px);
    }
    to {
      opacity: 1;
      transform: none;
    }
  }
  .users-table-card {
    background: var(--bg-1);
    border: 1px solid var(--line);
    border-radius: var(--r-lg);
    box-shadow: var(--shadow-card);
    overflow: hidden;
  }
  .users-table-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 14px 16px;
    border-bottom: 1px solid var(--line);
    flex-wrap: wrap;
  }
  .users-table-toolbar h3 {
    font-size: var(--fs-body);
    font-weight:600;
    color: var(--t1);
    margin: 0;
    display: inline-flex;
    align-items: center;
    gap: 6px;
  }
  .users-table-toolbar h3 svg {
    width: 15px;
    height: 15px;
    color: var(--brand-text);
  }
  .users-table-toolbar .actions {
    display: flex;
    gap: 8px;
    align-items: center;
  }
  .users-search {
    padding: 7px 11px;
    border-radius: var(--r-sm);
    background: var(--bg-2);
    color: var(--t1);
    border: 1px solid var(--line-strong);
    font-size: var(--fs-body);
    width: 220px;
    font-family: inherit;
  }
  .users-search:focus {
    outline: none;
    border-color: var(--brand-text);
  }
  .users-btn {
    padding: 7px 12px;
    border-radius: var(--r-sm);
    cursor: pointer;
    border: 1px solid transparent;
    font-size: var(--fs-body);
    font-weight: 600;
    font-family: inherit;
    transition: var(--duration-fast) var(--ease);
    display: inline-flex;
    align-items: center;
    gap: 5px;
    /* v60.20: 工具栏被挤压时按钮不竖排破字 */
    white-space: nowrap;
    flex: 0 0 auto;
  }
  /* v60.20: 用户列表角色/状态徽章单行显示（不再竖排） */
  #panel-users [class*="badge"], #panel-users [class*="role"], #panel-users [class*="pill"] {
    white-space: nowrap;
  }
  .users-btn svg {
    width: 13px;
    height: 13px;
  }
  .users-btn.primary {
    background: var(--brand);
    color: #fff;
    box-shadow: 0 2px 6px rgba(37, 99, 235, 0.25);
  }
  [data-theme="dark"] .users-btn.primary { background: var(--grad-brand); color: #0E42D2; }
  .users-btn.primary:hover {
    transform: translateY(-1px);
    box-shadow: 0 4px 10px rgba(22,93,255, 0.35);
  }
  .users-btn.ghost {
    background: var(--bg-2);
    color: var(--t2);
    border: 1px solid var(--line-strong);
  }
  .users-btn.ghost:hover {
    background: var(--bg-3);
    color: var(--t1);
  }
  .users-btn.danger {
    background: var(--bg-2);
    color: var(--err);
    border: 1px solid rgba(245,63,63, 0.25);
  }
  .users-btn.danger:hover {
    background: rgba(245,63,63, 0.08);
  }
  .users-table {
    width: 100%;
    border-collapse: collapse;
    font-size: var(--fs-body);
  }
  .users-table th, .users-table td {
    padding: 11px 14px;
    text-align: left;
    border-bottom: 1px solid var(--line);
  }
  .users-table th {
    background: var(--bg-2);
    color: var(--t2);
    font-weight: 600;
    font-size: var(--fs-small);
    text-transform: none;
    letter-spacing: 0;
    position: sticky;
    top: 0;
  }
  .users-table tbody tr:hover {
    background: var(--bg-2);
  }
  .users-table td.username {
    font-weight: 600;
    color: var(--t1);
  }
  .users-table td.email {
    color: var(--t3);
    font-size: var(--fs-small);
  }
  .users-table td .row-actions {
    display: inline-flex;
    gap: 4px;
  }
  .users-table .role-tag {
    display: inline-block;
    padding: 2px 8px;
    border-radius: var(--r-full);
    font-size: var(--fs-small);
    font-weight: 600;
    background: rgba(22,93,255, 0.1);
    color: var(--brand-text);
    border: 1px solid rgba(22,93,255, 0.18);
  }
  .users-table .role-tag.admin {
    background: rgba(245,63,63, 0.1);
    color: var(--err);
    border-color: rgba(245,63,63, 0.18);
  }
  .users-table .role-tag.viewer {
    background: var(--bg-3);
    color: var(--t2);
    border-color: var(--line-strong);
  }
  .users-table .status-tag {
    display: inline-block;
    padding: 2px 8px;
    border-radius: var(--r-full);
    font-size: var(--fs-small);
    font-weight: 600;
  }
  .users-table .status-tag.active {
    background: rgba(16, 185, 129, 0.1);
    color: var(--ok);
    border: 1px solid rgba(16, 185, 129, 0.22);
  }
  .users-table .status-tag.inactive {
    background: rgba(107, 114, 128, 0.12);
    color: var(--t-muted);
    border: 1px solid var(--line-strong);
  }
  .users-table .token-cell {
    font-variant-numeric: tabular-nums;
    font-family: var(--font-mono);
    font-size: var(--fs-small);
  }
  .users-table .token-bar {
    width: 100px;
    height: 4px;
    background: var(--bg-3);
    border-radius: var(--r-full);
    margin-top: 4px;
    overflow: hidden;
  }
  .users-table .token-bar-fill {
    height: 100%;
    background: var(--grad-brand);
    transition: width .3s var(--ease);
  }
  .users-modal-mask {
    position: fixed;
    inset: 0;
    z-index: 100;
    background: rgba(0, 0, 0, 0.4);
    display: grid;
    place-items: center;
    padding: 24px;
    animation: fadeIn .15s var(--ease);
  }
  .users-modal {
    width: 100%;
    max-width: 480px;
    background: var(--bg-1);
    border: 1px solid var(--line-strong);
    border-radius: var(--r-lg);
    box-shadow: var(--shadow-lg);
    max-height: 90vh;
    overflow-y: auto;
  }
  .users-modal-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 16px 20px;
    border-bottom: 1px solid var(--line);
  }
  .users-modal-head h3 {
    font-size: var(--fs-h2);
    font-weight:600;
    color: var(--t1);
    margin: 0;
  }
  .users-modal-close {
    width: 28px;
    height: 28px;
    border-radius: var(--r-sm);
    background: transparent;
    border: none;
    cursor: pointer;
    color: var(--t2);
    display: grid;
    place-items: center;
  }
  .users-modal-close:hover {
    background: var(--bg-2);
    color: var(--t1);
  }
  .users-modal-body {
    padding: 18px 20px;
    display: flex;
    flex-direction: column;
    gap: 13px;
  }
  .users-modal-foot {
    padding: 12px 20px;
    border-top: 1px solid var(--line);
    display: flex;
    justify-content: flex-end;
    gap: 8px;
  }
  .perm-matrix {
    background: var(--bg-1);
    border: 1px solid var(--line);
    border-radius: var(--r-lg);
    overflow: hidden;
  }
  .perm-matrix-table {
    width: 100%;
    border-collapse: collapse;
    font-size: var(--fs-small);
  }
  .perm-matrix-table th, .perm-matrix-table td {
    padding: 10px 12px;
    text-align: center;
    border-bottom: 1px solid var(--line);
    border-right: 1px solid var(--line);
  }
  .perm-matrix-table th:last-child, .perm-matrix-table td:last-child {
    border-right: none;
  }
  .perm-matrix-table thead th {
    background: var(--bg-2);
    color: var(--t2);
    font-weight: 600;
    font-size: var(--fs-small);
    position: sticky;
    top: 0;
  }
  .perm-matrix-table tbody td:first-child {
    text-align: left;
    font-weight: 600;
    color: var(--t1);
    background: var(--bg-2);
  }
  .perm-matrix-table .perm-group-row td {
    background: var(--bg-3);
    color: var(--t2);
    font-weight: 700;
    font-size: var(--fs-small);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    text-align: left;
  }
  .perm-matrix-table input[type="checkbox"] {
    width: 16px;
    height: 16px;
    accent-color: var(--brand-text);
    cursor: pointer;
  }
  .usage-summary-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 12px;
    margin-bottom: 18px;
  }
  .usage-summary-card {
    background: var(--bg-1);
    border: 1px solid var(--line);
    border-radius: var(--r-md);
    padding: 14px 16px;
    box-shadow: var(--shadow-card);
  }
  .usage-summary-card .label {
    font-size: var(--fs-small);
    color: var(--t3);
    margin-bottom: 6px;
    display: flex;
    align-items: center;
    gap: 5px;
  }
  .usage-summary-card .label svg {
    width: 12px;
    height: 12px;
    color: var(--brand-soft);
  }
  .usage-summary-card .value {
    font-size: var(--fs-display);
    font-weight:600;
    color: var(--t1);
    font-variant-numeric: tabular-nums;
    font-family: var(--font-mono);
  }
  .usage-summary-card .value.cost {
    color: var(--accent);
  }
  .usage-summary-card .sub {
    font-size: var(--fs-nano);
    color: var(--t-muted);
    margin-top: 3px;
  }
  .usage-filters {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    align-items: center;
    margin-bottom: 12px;
  }
  .usage-filters select, .usage-filters input[type="date"], .usage-filters input[type="text"] {
    padding: 6px 10px;
    border-radius: var(--r-sm);
    background: var(--bg-2);
    color: var(--t1);
    border: 1px solid var(--line-strong);
    font-size: var(--fs-small);
    font-family: inherit;
  }
  .usage-chart {
    background: var(--bg-1);
    border: 1px solid var(--line);
    border-radius: var(--r-md);
    padding: 16px 18px;
    margin-bottom: 14px;
    box-shadow: var(--shadow-card);
  }
  .usage-chart h4 {
    font-size: var(--fs-body);
    font-weight:600;
    color: var(--t1);
    margin: 0 0 12px;
    display: flex;
    align-items: center;
    gap: 6px;
  }
  .usage-chart h4 svg {
    width: 14px;
    height: 14px;
    color: var(--brand-text);
  }
  .usage-bar-row {
    display: flex;
    align-items: center;
    gap:12px;
    margin: 6px 0;
    font-size: var(--fs-small);
  }
  .usage-bar-row .label {
    width: 120px;
    color: var(--t2);
    flex-shrink: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  .usage-bar-row .bar {
    flex: 1;
    height: 8px;
    background: var(--bg-3);
    border-radius: var(--r-full);
    overflow: hidden;
  }
  .usage-bar-row .bar-fill {
    height: 100%;
    background: var(--grad-brand);
    transition: width .4s var(--ease);
  }
  .usage-bar-row .value {
    width: 80px;
    text-align: right;
    font-variant-numeric: tabular-nums;
    font-family: var(--font-mono);
    color: var(--t1);
    flex-shrink: 0;
  }
  .empty-state {
    text-align: center;
    padding: 40px 20px;
    color: var(--t3);
    font-size: var(--fs-body);
  }
  .empty-state svg {
    width: 36px;
    height: 36px;
    color: var(--t-muted);
    margin-bottom: 8px;
  }
  @media (max-width: 480px) {
    .topbar {
      padding: 8px 10px;
      gap: 6px;
    }
    .brand {
      flex: 0 1 auto;
      gap: 8px;
      min-width: 0;
    }
    .brand > div {
      min-width: 0;
    }
    .brand-name {
      font-size: var(--fs-body);
      max-width: 130px;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }
    .brand-sub {
      font-size: var(--fs-micro);
      padding-left: 6px;
    }
    .logo {
      width: 32px;
      height: 32px;
      flex-shrink: 0;
    }
    .topbar-right {
      gap: 4px;
      flex-shrink: 0;
    }
    .lib-btn {
      padding: 6px;
    }
    #wikiBtn, #adminBtn {
      display: none !important;
    }
  }
  .asset-lib-card {
    max-width: 780px;
    width: calc(100vw - 32px);
  }
  .asset-lib-stats {
    flex: 1;
    font-size: var(--fs-nano, 11px);
    color: var(--t3, #94a3b8);
    text-align: right;
    padding-right: 8px;
  }
  .asset-lib-toolbar {
    display: flex;
    gap: 8px;
    align-items: center;
    margin-bottom: 12px;
    flex-wrap: wrap;
  }
  .asset-lib-search {
    flex: 1;
    min-width: 160px;
  }
  .asset-lib-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
    gap:12px;
    max-height: 460px;
    overflow-y: auto;
    padding: 4px;
    border: 2px dashed transparent;
    border-radius: var(--r-md, 8px);
    transition: border-color .15s, background .15s;
  }
  .asset-lib-grid.drag-over {
    border-color: var(--brand-text, #165DFF);
    background: rgba(22,93,255,.04);
  }
  .asset-card {
    border: 1px solid var(--line, #e2e8f0);
    border-radius: var(--r-md, 8px);
    overflow: hidden;
    display: flex;
    flex-direction: column;
    background: var(--bg-2, #f8fafc);
    transition: border-color .15s, box-shadow .15s;
  }
  .asset-card:hover {
    border-color: var(--brand-text, #165DFF);
    box-shadow: 0 2px 8px rgba(22,93,255,.1);
  }
  .asset-card-thumb {
    aspect-ratio: 1;
    background: linear-gradient(160deg, #2b3038, #1e232a);
    position: relative;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
  }
  .asset-card-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
  }
  .asset-card-thumb .asset-type-icon {
    color: #4080FF;
  }
  .asset-card-badge {
    position: absolute;
    top: 4px;
    left: 4px;
    background: rgba(0,0,0,.65);
    color: #fff;
    font-size: var(--fs-micro);
    padding: 1px 6px;
    border-radius: 4px;
    font-weight: 500;
  }
  .asset-card-duration {
    position: absolute;
    bottom: 4px;
    right: 4px;
    background: rgba(0,0,0,.7);
    color: #fff;
    font-size: var(--fs-micro);
    padding: 1px 5px;
    border-radius: 3px;
    font-variant-numeric: tabular-nums;
  }
  .asset-card-meta {
    padding: 6px 8px;
    font-size: var(--fs-nano);
  }
  .asset-card-name {
    font-weight: 600;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    color: var(--t1, #0f172a);
  }
  .asset-card-product {
    color: var(--t3, #64748b);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  .asset-card-size {
    color: var(--t3, #94a3b8);
  }
  .asset-card-actions {
    display: flex;
    gap: 4px;
    padding: 4px 8px 8px;
  }
  .asset-card-actions .btn {
    font-size: var(--fs-nano);
  }
  .asset-card-actions .btn i {
    width: 13px;
    height: 13px;
  }
  .asset-lib-empty {
    display: none;
    text-align: center;
    padding: 40px 0;
    color: var(--t3, #94a3b8);
  }
  .asset-lib-empty p {
    margin: 8px 0 0;
    font-size: var(--fs-small, 12.5px);
  }
  .asset-lib-empty-hint {
    font-size: var(--fs-nano, 11px) !important;
    opacity: .7;
  }
  .asset-uploading {
    grid-column: 1 / -1;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 16px;
    color: var(--t2, #475569);
    font-size: var(--fs-small, 12.5px);
  }
  #assetPreviewModal {
    z-index: 1100;
    background: rgba(0,0,0,.85);
  }
  .asset-preview-wrap {
    position: relative;
    max-width: 90vw;
    max-height: 90vh;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
  }
  .asset-preview-close {
    position: absolute;
    top: -40px;
    right: 0;
    background: rgba(255,255,255,.15);
    border: none;
    color: #fff;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    cursor: pointer;
    display: grid;
    place-items: center;
  }
  .asset-preview-close:hover {
    background: rgba(255,255,255,.25);
  }
  .asset-preview-content {
    max-width: 90vw;
    max-height: 75vh;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  .asset-preview-content img, .asset-preview-content video {
    max-width: 90vw;
    max-height: 75vh;
    border-radius: 8px;
    object-fit: contain;
  }
  .asset-preview-info {
    color: rgba(255,255,255,.8);
    font-size: var(--fs-small);
    text-align: center;
    max-width: 600px;
  }
  .asset-preview-info b {
    color: #fff;
  }
  @media (max-width: 640px) {
    .asset-lib-grid {
      grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));
      gap: 8px;
    }
    .asset-lib-stats {
      display: none;
    }
  }
  .mv-mode-toggle {
    display: inline-flex;
    gap: 0;
    margin-left: auto;
    border: 1px solid var(--line-strong);
    border-radius: var(--r-md);
    overflow: hidden;
    background: var(--bg-1);
  }
  .mv-mode-btn {
    appearance: none;
    border: none;
    background: transparent;
    padding: 5px 12px;
    font-size: var(--fs-small);
    font-weight: 500;
    color: var(--t-muted);
    cursor: pointer;
    transition: background 0.15s, color 0.15s;
  }
  .mv-mode-btn + .mv-mode-btn {
    border-left: 1px solid var(--line-strong);
  }
  .mv-mode-btn.active {
    background: var(--brand-1, #3f6285);
    color: #fff;
  }
  .mv-mode-btn:hover:not(.active) {
    background: var(--bg-2);
    color: var(--t-1);
  }
  .mv-speed-toggle {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-left: 8px;
    padding: 5px 10px;
    font-size: var(--fs-small);
    font-weight: 500;
    color: var(--t-muted);
    border: 1px solid var(--line-strong);
    border-radius: var(--r-md);
    background: var(--bg-1);
    cursor: pointer;
    user-select: none;
    white-space: nowrap;
  }
  .mv-speed-toggle input { accent-color: var(--brand-1, #3f6285); }
  .mv-speed-toggle:has(input:checked) { color: var(--brand-1, #3f6285); border-color: var(--brand-1, #3f6285); }
  .multiview-grid.mode-14 {
    grid-template-columns: repeat(7, minmax(0, 1fr));
    gap: 6px;
  }
  .multiview-grid.mode-14 .mv-label {
    font-size: var(--fs-micro);
    padding: 1px 5px;
  }
  .multiview-grid.mode-14 .mv-btn {
    width: 22px;
    height: 22px;
  }
  .agent-activity-live {
    margin-top: 8px;
    background: #0f172a;
    color: #dbe7f4;
    border-radius: 6px;
    padding: 7px 9px;
    font-size: var(--fs-nano);
    line-height: 1.5;
    max-height: 150px;
    overflow-y: auto;
    white-space: pre-wrap;
    word-break: break-all;
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  }
  .brief-card {
    border: 1px solid var(--line-strong);
    border-radius: 10px;
    padding: 12px 14px;
    background: var(--bg-1, #fff);
  }
  .brief-row {
    display: flex;
    gap:16px;
    flex-wrap: wrap;
    margin-top: 8px;
  }
  .brief-col {
    flex: 1 1 220px;
    min-width: 0;
  }
  .brief-col.full {
    flex-basis: 100%;
  }
  .brief-col-label {
    display: flex;
    align-items: center;
    gap: 5px;
    font-size: var(--fs-small);
    font-weight: 600;
    color: var(--t-1, #2c3e50);
    margin-bottom: 6px;
  }
  .brief-col-label i {
    font-size: var(--fs-body);
    color: var(--brand-text);
  }
  .brief-input {
    width: 100%;
    box-sizing: border-box;
    padding: 8px 10px;
    font-size: var(--fs-small);
    color: var(--t-1, #2c3e50);
    border: 1px solid var(--line-strong);
    border-radius: 8px;
    background: var(--bg-1, #fff);
    outline: none;
  }
  .brief-input:focus {
    border-color: var(--brand-text);
    box-shadow: 0 0 0 2px rgba(63,98,133,.15);
  }
  .opt-badge.req {
    color: #fff;
    background: #b1543f;
    border-color: #b1543f;
  }
  .brief-card .opt-grid {
    gap: 6px;
  }
  .brief-card .opt-card {
    padding: 7px 8px;
    font-size: var(--fs-small);
  }
  .brief-card .btn.block {
    margin-top: 10px;
  }
  .btn.xs {
    padding: 4px 10px;
    font-size: var(--fs-small);
    border-radius: 7px;
    border: 1px solid var(--line-strong);
    background: var(--bg-1, #fff);
    color: var(--t-1, #2c3e50);
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 4px;
  }
  .btn.xs:hover {
    border-color: var(--brand-text);
    color: var(--brand-text);
  }
  .btn.xs.loading {
    opacity: .6;
    pointer-events: none;
  }
  .structure-notes {
    max-height: none;
    overflow-y: visible;
    font-size: var(--fs-small);
    line-height: 1.6;
    color: var(--t1);
  }
  .structure-notes .sn-row {
    display: grid;
    grid-template-columns: minmax(80px, auto) 1fr;
    gap: 8px;
    padding: 6px 8px;
    border-radius: 6px;
    margin: 2px 0;
  }
  .structure-notes .sn-row:nth-child(odd) {
    background: var(--bg-2);
  }
  .structure-notes .sn-dim {
    color: var(--brand-text);
    font-weight: 600;
    font-size: var(--fs-small);
    white-space: nowrap;
  }
  .structure-notes .sn-val {
    color: var(--t1);
    word-break: break-word;
  }
  .structure-notes .sn-p {
    padding: 6px 10px;
    margin: 4px 0;
    background: var(--bg-2);
    border-radius: 6px;
    font-size: var(--fs-small);
    line-height: 1.65;
    color: var(--t2);
  }
  .structure-notes .sn-hidden {
    display: none;
  }
  .structure-notes.sn-expanded .sn-hidden {
    display: block;
  }
  .structure-notes .sn-toggle {
    text-align: center;
    padding: 6px;
    margin-top: 4px;
    cursor: pointer;
    font-size: var(--fs-nano);
    color: var(--brand-text);
    border-radius: 6px;
    background: transparent;
    transition: background .15s;
  }
  .structure-notes .sn-toggle:hover {
    background: var(--bg-2);
  }
  .multiview-grid .mv-cell {
    position: relative;
  }
  .mv-cell .mv-label {
    position: absolute;
    bottom: 6px;
    left: 50%;
    transform: translateX(-50%);
    padding: 2px 8px;
    background: rgba(15,23,42,0.55);
    color: #fff;
    font-size: var(--fs-nano);
    font-weight: 500;
    border-radius: 999px;
    letter-spacing: .05em;
    backdrop-filter: blur(4px);
    pointer-events: none;
    opacity: .85;
    transition: opacity .2s;
  }
  .mv-cell:hover .mv-label {
    opacity: 1;
  }
  .users-stats {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 20px;
  }
  .users-stat-card {
    background: var(--bg-1);
    border: 1px solid var(--line);
    border-radius: var(--r-lg);
    padding: 14px 16px;
    display: flex;
    align-items: center;
    gap: 12px;
    box-shadow: var(--shadow-card);
    position: relative;
    overflow: hidden;
    transition: all .18s var(--ease);
  }
  .users-stat-card::after {
    content: '';
    position: absolute;
    inset: 0 0 auto 0;
    height: 2px;
    background: var(--grad-brand);
    opacity: .55;
  }
  .users-stat-card:hover {
    transform: translateY(-1px);
    box-shadow: var(--shadow-soft);
    border-color: var(--brand-text);
  }
  .users-stat-icon {
    width: 38px;
    height: 38px;
    border-radius: 10px;
    display: grid;
    place-items: center;
    background: var(--grad-brand);
    color: #0E42D2;
    flex-shrink: 0;
    box-shadow: 0 4px 10px rgba(22,93,255, .22);
  }
  .users-stat-icon svg {
    width: 18px;
    height: 18px;
  }
  .users-stat-icon.warn {
    background: linear-gradient(135deg, #FF7D00, #FF9A2E);
    box-shadow: 0 4px 10px rgba(245, 158, 11, .22);
  }
  .users-stat-icon.ok {
    background: linear-gradient(135deg, #4d9e80, #3f8a70);
    box-shadow: 0 4px 10px rgba(16, 185, 129, .22);
  }
  .users-stat-icon.muted {
    background: linear-gradient(135deg, #6b7280, #4b5563);
    box-shadow: 0 4px 10px rgba(107, 114, 128, .22);
  }
  .users-stat-body {
    flex: 1;
    min-width: 0;
  }
  .users-stat-value {
    font-size: var(--fs-display);
    font-weight: 700;
    color: var(--t1);
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.01em;
  }
  .users-stat-label {
    font-size: var(--fs-small);
    color: var(--t3);
    margin-top: 2px;
  }
  .users-avatar {
    width: 34px;
    height: 34px;
    border-radius: 50%;
    background: var(--grad-brand);
    color: #0E42D2;
    display: grid;
    place-items: center;
    font-weight: 700;
    font-size: var(--fs-body);
    flex-shrink: 0;
    letter-spacing: -0.01em;
    text-transform: uppercase;
    box-shadow: 0 2px 6px rgba(22,93,255, .18);
  }
  .users-avatar.admin {
    background: linear-gradient(135deg, #F53F3F, #F53F3F);
    box-shadow: 0 2px 6px rgba(245,63,63, .2);
  }
  .users-avatar.creator {
    background: linear-gradient(135deg, #165DFF, #165DFF);
    box-shadow: 0 2px 6px rgba(22,93,255, .22);
  }
  .users-avatar.viewer {
    background: linear-gradient(135deg, #94a3b8, #cbd5e1);
    box-shadow: 0 2px 6px rgba(148, 163, 184, .2);
  }
  .users-user-cell {
    display: flex;
    align-items: center;
    gap:12px;
  }
  .users-user-name {
    font-weight: 600;
    color: var(--t1);
    display: inline-flex;
    align-items: center;
    gap: 6px;
  }
  .users-user-self {
    background: rgba(22,93,255, .12);
    color: var(--brand-text);
    font-size: var(--fs-micro);
    font-weight: 600;
    padding: 1px 6px;
    border-radius: var(--r-full);
  }
  .roles-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap:16px;
    margin-bottom: 22px;
  }
  .role-card {
    background: var(--bg-1);
    border: 1px solid var(--line);
    border-radius: var(--r-lg);
    padding: 16px 18px;
    position: relative;
    transition: all .2s var(--ease);
    cursor: default;
    box-shadow: var(--shadow-card);
    overflow: hidden;
  }
  .role-card::before {
    content: '';
    position: absolute;
    inset: 0 0 auto 0;
    height: 3px;
    opacity: .85;
  }
  .role-card[data-role="r_admin"]::before {
    background: linear-gradient(90deg, #F53F3F, #F53F3F);
  }
  .role-card[data-role="r_creator"]::before {
    background: linear-gradient(90deg, #165DFF, #165DFF);
  }
  .role-card[data-role="r_viewer"]::before {
    background: linear-gradient(90deg, #94a3b8, #cbd5e1);
  }
  .role-card:hover {
    transform: translateY(-2px);
    box-shadow: var(--shadow-soft);
    border-color: var(--brand-text);
  }
  .role-card.is-col-active {
    border-color: var(--brand-text);
    box-shadow: 0 4px 10px rgba(22,93,255, .12);
    transform: translateY(-2px);
  }
  .role-card-head {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    margin-bottom: 12px;
  }
  .role-card-icon {
    width: 40px;
    height: 40px;
    border-radius: 11px;
    display: grid;
    place-items: center;
    color: #fff;
    flex-shrink: 0;
    box-shadow: 0 4px 10px rgba(0, 0, 0, .12);
  }
  .role-card[data-role="r_admin"] .role-card-icon {
    background: linear-gradient(135deg, #F53F3F, #F53F3F);
  }
  .role-card[data-role="r_creator"] .role-card-icon {
    background: linear-gradient(135deg, #165DFF, #165DFF);
  }
  .role-card[data-role="r_viewer"] .role-card-icon {
    background: linear-gradient(135deg, #94a3b8, #cbd5e1);
  }
  .role-card-icon svg {
    width: 20px;
    height: 20px;
  }
  .role-card-info {
    flex: 1;
    min-width: 0;
  }
  .role-card-name {
    font-size: var(--fs-h2);
    font-weight: 700;
    color: var(--t1);
    display: flex;
    align-items: center;
    gap: 6px;
    margin-bottom: 2px;
  }
  .role-card-builtin {
    font-size: var(--fs-micro);
    background: var(--bg-3);
    color: var(--t2);
    padding: 1px 6px;
    border-radius: var(--r-full);
    font-weight: 500;
  }
  .role-card-id {
    font-family: var(--font-mono);
    font-size: var(--fs-nano);
    color: var(--t3);
    letter-spacing: 0;
  }
  .role-card-desc {
    font-size: var(--fs-small);
    color: var(--t2);
    line-height: 1.55;
    margin-bottom: 14px;
    min-height: 38px;
  }
  .role-card-foot {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding-top: 12px;
    border-top: 1px solid var(--line);
  }
  .role-card-badge {
    font-size: var(--fs-small);
    color: var(--t2);
    display: inline-flex;
    align-items: center;
    gap: 4px;
  }
  .role-card-badge strong {
    color: var(--t1);
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    font-size: var(--fs-body);
  }
  .role-card-actions {
    display: inline-flex;
    gap: 4px;
  }
  .perm-matrix-card {
    background: var(--bg-1);
    border: 1px solid var(--line);
    border-radius: var(--r-lg);
    overflow: hidden;
    box-shadow: var(--shadow-card);
  }
  .perm-matrix-table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    font-size: var(--fs-body);
  }
  .perm-matrix-table th, .perm-matrix-table td {
    padding: 11px 14px;
    text-align: center;
    border-bottom: 1px solid var(--line);
    transition: background .15s var(--ease), box-shadow .15s var(--ease);
  }
  .perm-matrix-table thead th {
    background: var(--bg-2);
    color: var(--t2);
    font-weight: 600;
    font-size: var(--fs-small);
    position: sticky;
    top: 0;
    z-index: 2;
    border-bottom: 2px solid var(--line-strong);
    padding: 14px 12px;
  }
  .perm-matrix-table thead th:first-child {
    border-top-left-radius: var(--r-lg);
  }
  .perm-matrix-table thead th:last-child {
    border-top-right-radius: var(--r-lg);
  }
  .perm-matrix-table thead th .col-role {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    flex-direction: column;
    cursor: default;
  }
  .perm-matrix-table thead th .col-role-name {
    font-weight: 700;
    color: var(--t1);
    font-size: var(--fs-body);
    display: inline-flex;
    align-items: center;
    gap: 4px;
  }
  .perm-matrix-table thead th .col-role-name::before {
    content: '';
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--brand);
    display: inline-block;
  }
  .perm-matrix-table thead th[data-col="r_admin"] .col-role-name::before {
    background: #F53F3F;
  }
  .perm-matrix-table thead th[data-col="r_creator"] .col-role-name::before {
    background: #165DFF;
  }
  .perm-matrix-table thead th[data-col="r_viewer"] .col-role-name::before {
    background: #94a3b8;
  }
  .perm-matrix-table thead th .col-role-id {
    font-family: var(--font-mono);
    font-size: var(--fs-micro);
    color: var(--t3);
    font-weight: 400;
  }
  .perm-matrix-table tbody td:first-child {
    text-align: left;
    font-weight: 600;
    color: var(--t1);
    background: var(--bg-1);
    position: sticky;
    left: 0;
    z-index: 1;
    font-size: var(--fs-small);
  }
  .perm-matrix-table tbody td:first-child code {
    font-family: var(--font-mono);
    font-size: var(--fs-micro);
    color: var(--t3);
    font-weight: 400;
    margin-left: 4px;
  }
  .perm-matrix-table tbody tr:not(.perm-group-row):hover td {
    background: var(--bg-2);
  }
  .perm-matrix-table tbody tr:not(.perm-group-row):hover td:first-child {
    background: var(--bg-2);
    color: var(--brand-text);
  }
  .perm-matrix-table.is-col-hovered td[data-col="active"], .perm-matrix-table thead th[data-col="active"] {
    background: rgba(22,93,255, .08);
    box-shadow: inset 0 0 0 1px rgba(22,93,255, .25);
  }
  .perm-matrix-table.is-col-hovered thead th[data-col="active"] {
    background: rgba(22,93,255, .14);
  }
  .perm-matrix-table .perm-group-row td {
    background: var(--bg-3);
    color: var(--t2);
    font-weight: 700;
    font-size: var(--fs-small);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    padding: 9px 14px;
    text-align: left;
    position: sticky;
    left: 0;
  }
  .perm-matrix-table .perm-group-row td .group-icon {
    display: inline-flex;
    align-items: center;
    gap: 6px;
  }
  .perm-matrix-table .perm-group-row td .group-icon svg {
    width: 13px;
    height: 13px;
    color: var(--brand-text);
  }
  .perm-toggle {
    position: relative;
    display: inline-block;
    width: 38px;
    height: 22px;
    vertical-align: middle;
  }
  .perm-toggle input {
    opacity: 0;
    width: 0;
    height: 0;
    position: absolute;
    margin: 0;
  }
  .perm-toggle .slider {
    position: absolute;
    inset: 0;
    background: var(--bg-3);
    border: 1px solid var(--line-strong);
    border-radius: 11px;
    transition: all .2s var(--ease);
    cursor: pointer;
  }
  .perm-toggle .slider::before {
    content: '';
    position: absolute;
    width: 16px;
    height: 16px;
    left: 2px;
    top: 50%;
    transform: translateY(-50%);
    background: #fff;
    border-radius: 50%;
    box-shadow: 0 1px 3px rgba(0,0,0,.22);
    transition: all .2s var(--ease);
  }
  .perm-toggle input:checked + .slider {
    background: var(--brand);
    border-color: var(--brand-text);
  }
  .perm-toggle input:checked + .slider::before {
    transform: translate(16px, -50%);
  }
  .perm-toggle input:disabled + .slider {
    opacity: .5;
    cursor: not-allowed;
  }
  .perm-toggle:hover .slider {
    box-shadow: 0 0 0 4px rgba(22,93,255, .1);
  }
  .usage-summary-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
    gap: 12px;
    margin-bottom: 18px;
  }
  .usage-summary-card {
    background: var(--bg-1);
    border: 1px solid var(--line);
    border-radius: var(--r-lg);
    padding: 16px 18px;
    position: relative;
    overflow: hidden;
    transition: all .18s var(--ease);
    box-shadow: var(--shadow-card);
  }
  .usage-summary-card::before {
    content: '';
    position: absolute;
    inset: 0 0 auto 0;
    height: 2px;
    background: var(--grad-brand);
    opacity: .6;
  }
  .usage-summary-card:hover {
    transform: translateY(-1px);
    box-shadow: var(--shadow-soft);
    border-color: var(--brand-text);
  }
  .usage-summary-card .label {
    font-size: var(--fs-small);
    color: var(--t2);
    display: inline-flex;
    align-items: center;
    gap: 5px;
    margin-bottom: 8px;
    text-transform: uppercase;
    letter-spacing: .04em;
    font-weight: 600;
  }
  .usage-summary-card .label svg {
    width: 13px;
    height: 13px;
    color: var(--brand-text);
  }
  .usage-summary-card .value {
    font-size: var(--fs-display);
    font-weight: 700;
    color: var(--t1);
    font-variant-numeric: tabular-nums;
    line-height: 1.2;
    letter-spacing: -0.01em;
  }
  .usage-summary-card .value.cost {
    color: var(--accent);
  }
  .usage-summary-card .sub {
    font-size: var(--fs-nano);
    color: var(--t3);
    margin-top: 4px;
  }
  .users-table-toolbar .meta-info {
    font-size: var(--fs-small);
    color: var(--t3);
    display: inline-flex;
    align-items: center;
    gap: 4px;
  }
  @media (max-width: 720px) {
    .users-stats {
      grid-template-columns: repeat(2, 1fr);
    }
    .roles-grid {
      grid-template-columns: 1fr;
    }
    .usage-summary-grid {
      grid-template-columns: repeat(2, 1fr);
    }
  }
  .usage-type-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 18px;
  }
  .usage-type-card {
    background: var(--bg-1);
    border: 1px solid var(--line);
    border-radius: var(--r-lg);
    padding: 16px 18px;
    position: relative;
    transition: background .15s var(--ease), border-color .15s var(--ease);
    box-shadow: var(--shadow-card);
    cursor: default;
  }
  .usage-type-card .type-head {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 12px;
  }
  .usage-type-card .type-icon {
    width: 28px;
    height: 28px;
    display: grid;
    place-items: center;
    color: var(--t3);
    flex-shrink: 0;
  }
  .usage-type-card .type-icon svg {
    width: 18px;
    height: 18px;
    stroke-width: 1.6;
  }
  .usage-type-card .type-name {
    font-size: var(--fs-small);
    font-weight: 600;
    color: var(--t2);
    letter-spacing: .02em;
    text-transform: uppercase;
  }
  .usage-type-card .type-count {
    font-size: var(--fs-nano);
    color: var(--t3);
    margin-top: 1px;
    font-variant-numeric: tabular-nums;
  }
  .usage-type-card .type-cost {
    font-size: var(--fs-display);
    font-weight: 700;
    color: var(--t1);
    font-variant-numeric: tabular-nums;
    line-height: 1.15;
    letter-spacing: -0.01em;
  }
  .usage-type-card .type-tokens {
    font-size: var(--fs-nano);
    color: var(--t3);
    margin-top: 4px;
    font-variant-numeric: tabular-nums;
  }
  .usage-type-card .type-foot {
    margin-top: 10px;
    padding-top: 10px;
    border-top: 1px solid var(--line);
    font-size: var(--fs-nano);
    color: var(--t3);
    display: flex;
    align-items: center;
    justify-content: space-between;
  }
  .usage-type-card .type-foot .type-credits {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    color: var(--t2);
  }
  .usage-type-card:hover {
    border-color: var(--line-strong);
    background: var(--bg-2);
  }
  .usage-type-card.is-empty {
    opacity: .55;
  }
  .usage-type-card.is-empty:hover {
    opacity: .85;
  }
  .usage-type-card.is-empty .type-cost {
    color: var(--t3);
  }
  @media (max-width: 900px) {
    .usage-type-grid {
      grid-template-columns: repeat(2, 1fr);
    }
  }
  .admin-topbar {
    position: sticky;
    top: 0;
    z-index: 30;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 14px 28px;
    background: rgba(255, 255, 255, 0.75);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border-bottom: 1px solid var(--line);
  }
  [data-theme="dark"] .admin-topbar {
    background: rgba(20, 23, 28, 0.7);
  }
  .admin-topbar .brand-block {
    display: flex;
    align-items: center;
    gap:16px;
    min-width: 0;
  }
  .admin-topbar .brand-block .logo {
    width: 42px;
    height: 42px;
    border-radius: var(--r-md);
    display: grid;
    place-items: center;
    color: #fff;
    font-size: var(--fs-display);
    background: var(--grad-brand);
    box-shadow: var(--shadow-glow);
    flex-shrink: 0;
  }
  .admin-topbar .brand-block .logo svg {
    width: 22px;
    height: 22px;
  }
  .admin-topbar .brand-block .name {
    font-weight: 700;
    font-size: var(--fs-h1);
    color: var(--t1);
    display: flex;
    align-items: center;
    gap: 8px;
  }
  .admin-topbar .brand-block .name .role-badge {
    font-size: var(--fs-micro);
    background: linear-gradient(135deg, #F53F3F, #F53F3F);
    color: #fff;
    padding: 2px 8px;
    border-radius: var(--r-full);
    font-weight: 600;
    letter-spacing: .04em;
  }
  .admin-topbar .brand-block .sub {
    font-size: var(--fs-small);
    color: var(--t3);
    margin-top: 1px;
  }
  .admin-topbar .topbar-right {
    display: flex;
    gap: 8px;
    align-items: center;
  }
  .admin-stats {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 12px;
    margin-bottom: 20px;
  }
  .dashboard-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 12px;
    margin-bottom: 20px;
  }
  @media (max-width: 900px) {
    .dashboard-grid {
      grid-template-columns: 1fr;
    }
  }
  .admin-card .admin-card-head h3 {
    font-size: var(--fs-h2);
    font-weight: 700;
    color: var(--t1);
    margin: 0;
    display: flex;
    align-items: center;
    gap: 8px;
    flex: 1;
    min-width: 0;
  }
  .admin-card .admin-card-head h3 i {
    color: var(--brand-text);
  }
  .admin-card-meta {
    font-size: var(--fs-small);
    color: var(--t3);
    white-space: nowrap;
  }
  .admin-card-link {
    font-size: var(--fs-small);
    color: var(--brand-text);
    text-decoration: none;
    white-space: nowrap;
    transition: opacity .15s var(--ease);
  }
  .admin-card-link:hover {
    opacity: 0.7;
  }
  .health-list {
    display: flex;
    flex-direction: column;
    gap:12px;
  }
  .health-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 8px 12px;
    background: var(--bg-2);
    border: 1px solid var(--line);
    border-radius: var(--r-md);
    font-size: var(--fs-body);
    color: var(--t1);
  }
  .health-item .health-name {
    display: flex;
    align-items: center;
    gap: 8px;
    font-weight: 500;
  }
  .health-item .health-name i {
    color: var(--brand-text);
    width: 16px;
    height: 16px;
  }
  .health-dot {
    display: inline-block;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: var(--t3);
    box-shadow: 0 0 0 3px rgba(0,0,0,0.04);
    flex-shrink: 0;
  }
  .health-dot.is-ok {
    background: #4d9e80;
    box-shadow: 0 0 0 3px rgba(0,180,42,.18);
  }
  .health-dot.is-warn {
    background: #FF7D00;
    box-shadow: 0 0 0 3px rgba(245,158,11,.18);
  }
  .health-dot.is-down {
    background: #F53F3F;
    box-shadow: 0 0 0 3px rgba(245,63,63,.18);
  }
  .health-dot.is-pending {
    background: var(--t3);
    animation: health-pulse 1.4s infinite;
  }
  @keyframes health-pulse {
    0%, 100% {
      opacity: 0.4;
    }
    50% {
      opacity: 1;
    }
  }
  .activity-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 4px;
    max-height: 240px;
    overflow-y: auto;
  }
  .activity-item {
    display: flex;
    align-items: center;
    gap:12px;
    padding: 8px 10px;
    border-radius: var(--r-md);
    font-size: var(--fs-small);
    color: var(--t1);
    transition: background .12s var(--ease);
  }
  .activity-item:hover {
    background: var(--bg-2);
  }
  .activity-item.activity-loading {
    color: var(--t3);
  }
  .activity-icon {
    width: 26px;
    height: 26px;
    border-radius: 7px;
    display: grid;
    place-items: center;
    background: var(--bg-2);
    color: var(--brand-text);
    flex-shrink: 0;
  }
  .activity-icon i {
    width: 14px;
    height: 14px;
  }
  .activity-icon.icon-ok {
    background: rgba(0,180,42,.1);
    color: #3f8a70;
  }
  .activity-icon.icon-warn {
    background: rgba(245,158,11,.1);
    color: #d97706;
  }
  .activity-icon.icon-err {
    background: rgba(245,63,63,.1);
    color: #F53F3F;
  }
  .activity-body {
    flex: 1;
    min-width: 0;
  }
  .activity-title {
    color: var(--t1);
    font-weight: 500;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .activity-meta {
    color: var(--t3);
    font-size: var(--fs-small);
    margin-top: 1px;
  }
  .activity-empty {
    padding: 20px;
    text-align: center;
    color: var(--t3);
    font-size: var(--fs-small);
  }
  .quick-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap:12px;
  }
  .quick-card {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 14px;
    background: var(--bg-2);
    border: 1px solid var(--line);
    border-radius: var(--r-md);
    text-decoration: none;
    color: var(--t1);
    transition: all .15s var(--ease);
  }
  .quick-card:hover {
    background: var(--bg-1);
    border-color: var(--brand-text);
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(22,93,255, .12);
  }
  .quick-icon {
    width: 36px;
    height: 36px;
    border-radius: 9px;
    display: grid;
    place-items: center;
    background: var(--grad-brand);
    color: #0E42D2;
    flex-shrink: 0;
    box-shadow: 0 4px 10px rgba(22,93,255, .22);
  }
  .quick-icon i {
    width: 18px;
    height: 18px;
  }
  .quick-meta {
    flex: 1;
    min-width: 0;
  }
  .quick-name {
    font-size: var(--fs-body);
    font-weight: 600;
    color: var(--t1);
    margin-bottom: 1px;
  }
  .quick-desc {
    font-size: var(--fs-small);
    color: var(--t3);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .model-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 12px;
    margin-top: 12px;
  }
  @media (max-width: 900px) {
    .model-grid {
      grid-template-columns: 1fr;
    }
  }
  .model-pick {
    background: var(--bg-2);
    border: 1px solid var(--line);
    border-radius: var(--r-md);
    padding: 12px 14px;
    display: flex;
    flex-direction: column;
    gap: 6px;
    transition: all .15s var(--ease);
  }
  .model-pick:hover {
    border-color: var(--brand-text);
    background: var(--bg-1);
  }
  .model-pick-head {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: var(--fs-small);
    font-weight: 600;
    color: var(--t1);
  }
  .model-pick-head .model-pick-icon {
    width: 26px;
    height: 26px;
    border-radius: 7px;
    display: grid;
    place-items: center;
    background: var(--grad-brand);
    color: #0E42D2;
    flex-shrink: 0;
  }
  .model-pick-head .model-pick-icon svg {
    width: 14px;
    height: 14px;
  }
  .model-pick-head .model-pick-icon.kind-image {
    background: linear-gradient(135deg, #165DFF, #4080FF);
  }
  .model-pick-head .model-pick-icon.kind-video {
    background: linear-gradient(135deg, #165DFF, #4080FF);
  }
  .model-pick-head .model-pick-icon.kind-3d {
    background: linear-gradient(135deg, #165DFF, #165DFF);
  }
  .model-pick-head .model-pick-icon.kind-llm {
    background: linear-gradient(135deg, #FF7D00, #FF7D00);
  }
  .model-pick .admin-select {
    font-size: var(--fs-small);
    padding: 8px 10px;
  }
  .model-pick .model-note {
    font-size: var(--fs-nano);
  }
  .demo-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
    gap:16px;
  }
  .demo-card {
    background: var(--bg-1);
    border: 1px solid var(--line);
    border-radius: var(--r-lg);
    overflow: hidden;
    position: relative;
    transition: all .2s var(--ease);
    box-shadow: var(--shadow-card);
    display: flex;
    flex-direction: column;
  }
  .demo-card:hover {
    transform: translateY(-2px);
    box-shadow: var(--shadow-soft);
    border-color: var(--brand-text);
  }
  .demo-card.is-disabled {
    opacity: .55;
    filter: grayscale(.4);
  }
  .demo-card-thumb {
    width: 100%;
    aspect-ratio: 16/9;
    background: var(--bg-2);
    display: grid;
    place-items: center;
    color: var(--t3);
    position: relative;
    overflow: hidden;
  }
  .demo-card-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
  .demo-card-thumb .demo-card-thumb-fallback {
    font-size: var(--fs-display);
    color: var(--t3);
  }
  .demo-card-thumb .demo-card-status {
    position: absolute;
    top: 8px;
    right: 8px;
    font-size: var(--fs-micro);
    font-weight: 600;
    padding: 3px 8px;
    border-radius: var(--r-full);
    background: rgba(16, 185, 129, 0.9);
    color: #fff;
    display: inline-flex;
    align-items: center;
    gap: 3px;
    backdrop-filter: blur(4px);
  }
  .demo-card.is-disabled .demo-card-status {
    background: rgba(107, 114, 128, 0.85);
  }
  .demo-card-thumb .demo-card-imgcount {
    position: absolute;
    bottom: 8px;
    left: 8px;
    font-size: var(--fs-micro);
    padding: 2px 7px;
    border-radius: var(--r-full);
    background: rgba(0, 0, 0, 0.5);
    color: #fff;
    backdrop-filter: blur(4px);
    display: inline-flex;
    align-items: center;
    gap: 3px;
  }
  .demo-card-body {
    padding: 12px 14px;
    display: flex;
    flex-direction: column;
    gap: 6px;
    flex: 1;
  }
  .demo-card-name {
    font-size: var(--fs-body);
    font-weight: 700;
    color: var(--t1);
    display: flex;
    align-items: center;
    gap: 6px;
  }
  .demo-card-pname {
    font-size: var(--fs-small);
    color: var(--t3);
    line-height: 1.4;
  }
  .demo-card-desc {
    font-size: var(--fs-small);
    color: var(--t2);
    line-height: 1.5;
    margin-top: 2px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
  }
  .demo-card-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    margin-top: 6px;
  }
  .demo-card-tags .tag {
    font-size: var(--fs-micro);
    padding: 2px 7px;
    background: var(--bg-2);
    color: var(--t2);
    border-radius: var(--r-full);
    border: 1px solid var(--line);
  }
  .demo-card-foot {
    padding: 10px 14px;
    border-top: 1px solid var(--line);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
  }
  .demo-card-id {
    font-family: var(--font-mono);
    font-size: var(--fs-micro);
    color: var(--t3);
  }
  .demo-card-actions {
    display: inline-flex;
    gap: 4px;
  }
  .demo-card-actions .btn {
    font-size: var(--fs-small);
    padding: 4px 10px;
  }
  .admin-section-divider {
    display: flex;
    align-items: center;
    gap: 12px;
    margin: 22px 0 14px;
    color: var(--t3);
    font-size: var(--fs-small);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .04em;
  }
  .admin-section-divider::before, .admin-section-divider::after {
    content: '';
    flex: 1;
    height: 1px;
    background: var(--line);
  }
  .admin-card-v2 {
    background: var(--bg-1);
    border: 1px solid var(--line);
    border-radius: var(--r-lg);
    box-shadow: var(--shadow-card);
    overflow: hidden;
    position: relative;
    transition: box-shadow .2s var(--ease);
  }
  .admin-card-v2:hover {
    box-shadow: var(--shadow-soft);
  }
  .admin-card-v2 .admin-card-head {
    padding: 16px 20px;
    border-bottom: 1px solid var(--line);
    display: flex;
    align-items: flex-start;
    gap:16px;
    position: relative;
  }
  .admin-card-v2 .admin-card-head::before {
    content: '';
    position: absolute;
    inset: 0 0 auto 0;
    height: 3px;
    background: var(--grad-brand);
    opacity: .8;
  }
  .admin-card-v2 .admin-card-icon {
    width: 38px;
    height: 38px;
    border-radius: 10px;
    display: grid;
    place-items: center;
    background: var(--grad-brand);
    color: #0E42D2;
    flex-shrink: 0;
    box-shadow: 0 3px 8px rgba(22,93,255, .22);
  }
  .admin-card-v2 .admin-card-icon svg {
    width: 18px;
    height: 18px;
  }
  .admin-card-v2 .admin-card-title {
    flex: 1;
    min-width: 0;
  }
  .admin-card-v2 .admin-card-title h2 {
    font-size: var(--fs-h2);
    font-weight: 700;
    color: var(--t1);
    margin: 0 0 2px;
    display: flex;
    align-items: center;
    gap: 8px;
  }
  .admin-card-v2 .admin-card-title p {
    font-size: var(--fs-small);
    color: var(--t2);
    margin: 0;
    line-height: 1.55;
  }
  .admin-card-v2 .admin-card-body {
    padding: 16px 20px;
  }
  .admin-card-v2 .admin-card-foot {
    padding: 12px 20px;
    border-top: 1px solid var(--line);
    display: flex;
    align-items: center;
    gap: 12px;
    background: var(--bg-2);
  }
  @media (max-width: 720px) {
    .demo-grid {
      grid-template-columns: 1fr;
    }
  }
  .admin-card {
    background: var(--bg-1);
    border: 1px solid var(--line);
    border-radius: var(--r-lg);
    box-shadow: var(--shadow-card);
    margin-bottom: 18px;
    overflow: hidden;
    position: relative;
  }
  .admin-card .admin-card-head {
    padding: 16px 20px;
    border-bottom: 1px solid var(--line);
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap:16px;
  }
  .admin-card .admin-card-title {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    flex: 1;
    min-width: 0;
  }
  .admin-card .admin-card-title > i {
    color: var(--brand-text);
    flex-shrink: 0;
    margin-top: 2px;
  }
  .admin-card .admin-card-title h2 {
    font-size: var(--fs-h2);
    font-weight: 700;
    color: var(--t1);
    margin: 0 0 2px;
  }
  .admin-card .admin-card-title p {
    font-size: var(--fs-small);
    color: var(--t2);
    margin: 0;
    line-height: 1.55;
  }
  .admin-card .admin-card-body {
    padding: 16px 20px;
  }
  .admin-card .admin-actions {
    padding: 12px 20px;
    border-top: 1px solid var(--line);
    display: flex;
    align-items: center;
    gap: 12px;
  }
  .admin-card .admin-actions .status {
    font-size: var(--fs-small);
    color: var(--t2);
  }
  .stage-bar-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 6px;
  }
  .stage-bar-progress-text {
    font-size: var(--fs-small);
    color: var(--t3);
  }
  .stage-bar-wrap .stage-bar {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-bottom: 4px;
  }
  .stage-bar-wrap .stage-chip {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 3px 10px;
    border-radius: 12px;
    font-size: var(--fs-small);
    background: #f1f5f9;
    color: var(--t2);
  }
  .stage-bar-wrap .stage-chip.run {
    background: #eef2ff;
    color: #165DFF;
  }
  .stage-bar-wrap .stage-chip.ok {
    background: #ecfdf5;
    color: #00B42A;
  }
  .stage-bar-wrap .stage-chip.warn {
    background: #fef3c7;
    color: #FF7D00;
  }
  .stage-bar-progress {
    margin-top: 6px;
    height: 4px;
  }
  .gen-progress-meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    margin-top: 6px;
    font-size: var(--fs-small);
    color: var(--t2);
  }
  .gen-progress-meta .gen-meta-item {
    display: inline-flex;
    align-items: center;
  }
  .gen-progress-meta .gen-meta-sep {
    color: var(--t3);
  }
  .gen-progress-meta.hidden {
    display: none;
  }
  .health-dot {
    position: fixed;
    right: 18px;
    bottom: 18px;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: #4d9e80;
    box-shadow: 0 0 0 4px rgba(0,180,42,.18);
    z-index: 50;
    transition: background .2s, box-shadow .2s;
  }
  .health-dot.on {
    animation: health-pulse 2s ease-in-out infinite;
  }
  .health-dot.off {
    background: #F53F3F;
    box-shadow: 0 0 0 4px rgba(245,63,63,.18);
    animation: none;
  }
  @keyframes health-pulse {
    0%,100% {
      box-shadow: 0 0 0 4px rgba(0,180,42,.18);
    }
    50% {
      box-shadow: 0 0 0 8px rgba(0,180,42,.08);
    }
  }
  .hs-stat-bar {
    display: flex;
    gap: 8px;
    align-items: stretch;
    flex-wrap: wrap;
  }
  .stat-pill {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 5px 10px;
    border-radius: 999px;
    background: var(--bg-elev, rgba(0,0,0,0.04));
    border: 1px solid var(--border, #e5e7eb);
    font-size: var(--fs-small);
    color: var(--t2);
    white-space: nowrap;
    transition: background .15s;
  }
  .stat-pill:hover {
    background: rgba(22,93,255,0.06);
  }
  .stat-pill i[data-lucide] {
    width: 14px;
    height: 14px;
  }
  .stat-pill .stat-k {
    color: var(--t2);
  }
  .stat-pill .stat-v {
    color: var(--t1);
    font-weight: 700;
    font-size: var(--fs-body);
    font-variant-numeric: tabular-nums;
  }
  .search-row {
    display: flex;
    gap: 8px;
    align-items: center;
    position: relative;
  }
  .search-ico {
    position: absolute;
    left: 10px;
    top: 50%;
    transform: translateY(-50%);
    color: var(--t2);
    display: flex;
  }
  .search-ico i[data-lucide] {
    width: 15px;
    height: 15px;
  }
  .search-row input[type="search"] {
    padding-left: 32px;
  }
  .toolbar-spacer {
    flex: 1;
  }
  .sort-select {
    padding: 6px 10px;
    border: 1px solid var(--border, #e5e7eb);
    border-radius: var(--r-sm);
    font-size: var(--fs-body);
    background: var(--bg, #fff);
    color: var(--t1);
  }
  .view-toggle {
    display: inline-flex;
    border: 1px solid var(--border, #e5e7eb);
    border-radius: var(--r-sm);
    overflow: hidden;
    background: var(--bg, #fff);
    /* v61.57 修复竖排：search-row 空间紧张时 view-toggle 被 flex 挤压，按钮文字换行竖着排 */
    flex: none;
    white-space: nowrap;
  }
  .vt-btn {
    background: transparent;
    border: none;
    padding: 6px 10px;
    cursor: pointer;
    color: var(--t2);
    display: flex;
    align-items: center;
    gap: 4px;
    /* v61.57：按钮不被压缩，文字保持横排（网格/列表/分组 两字整行） */
    flex: none;
    white-space: nowrap;
    transition: background .12s, color .12s;
  }
  .vt-btn:hover {
    background: var(--bg-elev, rgba(0,0,0,0.04));
    color: var(--t1);
  }
  .vt-btn.active {
    background: var(--primary-bg, #E8F3FF);
    color: #165DFF;
    border-radius: 6px;
  }
  .vt-btn i[data-lucide] {
    width: 15px;
    height: 15px;
  }
  /* v61.65：右上角工具按钮组——图标+文字统一间距，视觉不再破碎 */
  .toolbar-right-group { display: inline-flex; gap: 6px; align-items: center; flex: none; }
  .toolbar-right-group .btn svg { width: 14px; height: 14px; }
  .filter-bar {
    display: flex;
    gap: 6px;
    align-items: center;
    flex-wrap: wrap;
    padding: 4px 0;
  }
  .filter-chip {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 5px 10px;
    border: 1px solid var(--border, #e5e7eb);
    border-radius: 999px;
    background: var(--bg, #fff);
    font-size: var(--fs-small);
    color: var(--t2);
    cursor: pointer;
    transition: all .12s;
    user-select: none;
  }
  .filter-chip:hover {
    background: var(--bg-elev, rgba(0,0,0,0.04));
    color: var(--t1);
  }
  .filter-chip.chip-active {
    background: rgba(22,93,255,0.1);
    border-color: var(--primary, #165DFF);
    color: var(--primary, #165DFF);
    font-weight: 600;
  }
  .filter-chip i[data-lucide] {
    width: 13px;
    height: 13px;
  }
  .filter-chip .chip-label {
    font-size: var(--fs-small);
  }
  .filter-chip .chip-caret {
    width: 12px;
    height: 12px;
    opacity: 0.6;
  }
  .filter-date-group {
    display: inline-flex;
    align-items: center;
    gap: 6px;
  }
  .filter-date-group input[type="date"] {
    padding: 5px 8px;
    border: 1px solid var(--border, #e5e7eb);
    border-radius: var(--r-sm);
    font-size: var(--fs-small);
    background: var(--bg, #fff);
    color: var(--t1);
  }
  .filter-sep {
    color: var(--t2);
    font-size: var(--fs-small);
  }
  .active-filters {
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
    min-height: 4px;
  }
  .active-chip {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 3px 4px 3px 10px;
    border-radius: 999px;
    background: rgba(22,93,255,0.08);
    color: var(--primary, #165DFF);
    font-size: var(--fs-nano);
    font-weight: 500;
  }
  .active-chip .ac-k {
    color: var(--t2);
    font-weight: 400;
  }
  .active-chip .ac-x {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: transparent;
    border: none;
    cursor: pointer;
    color: var(--primary, #165DFF);
    padding: 2px;
    border-radius: 50%;
    line-height: 0;
  }
  .active-chip .ac-x:hover {
    background: rgba(22,93,255,0.18);
  }
  .active-chip .ac-x i[data-lucide] {
    width: 12px;
    height: 12px;
  }
  .batch-bar {
    display: flex;
    gap: 6px;
    align-items: center;
    flex-wrap: wrap;
    padding: 8px 12px;
    border-radius: var(--r-md);
    background: linear-gradient(135deg, rgba(22,93,255,0.08), rgba(22,93,255,0.08));
    border: 1px solid rgba(22,93,255,0.2);
    font-size: var(--fs-body);
    animation: popIn .25s var(--ease);
  }
  .batch-bar[hidden] {
    display: none;
  }
  .batch-count {
    color: var(--t1);
    font-weight: 600;
    display: inline-flex;
    align-items: center;
    gap: 4px;
  }
  .batch-count i[data-lucide] {
    width: 14px;
    height: 14px;
    color: var(--primary, #165DFF);
  }
  .batch-sep {
    width: 1px;
    height: 18px;
    background: var(--border, #e5e7eb);
    margin: 0 4px;
  }
  .batch-spacer {
    flex: 1;
  }
  .batch-bar .btn.sm {
    padding: 4px 8px;
    font-size: var(--fs-small);
  }
  .batch-bar .btn.danger.sm {
    background: #F53F3F;
    color: #fff;
    border: none;
  }
  .batch-bar .btn.danger.sm:hover {
    background: #F53F3F;
  }
  .batch-bar .btn.danger.sm:disabled {
    opacity: 0.4;
    cursor: not-allowed;
  }
  .task-card {
    position: relative;
  }
  .task-card-check {
    position: absolute;
    top: 6px;
    right: 6px;
    z-index: 5;
    opacity: 0;
    transition: opacity .15s;
  }
  .history-grid.batch-on .task-card-check {
    opacity: 1;
  }
  .history-grid.batch-on .task-card {
    cursor: default;
  }
  .task-card.is-selected {
    outline: 2px solid var(--primary, #165DFF);
    outline-offset: -2px;
  }
  .task-card-proj-bar {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    width: 3px;
    background: var(--proj-color, #165DFF);
    z-index: 2;
  }
  .task-card-ratio {
    position: absolute;
    bottom: 6px;
    right: 6px;
    padding: 2px 6px;
    border-radius: 4px;
    background: rgba(0,0,0,0.6);
    color: #fff;
    font-size: var(--fs-micro);
    font-weight: 600;
  }
  .task-card-status {
    left: auto;
    right: 6px;
    top: 6px;
  }
  .ck {
    display: inline-flex;
    align-items: center;
    cursor: pointer;
    user-select: none;
  }
  .ck input {
    width: 16px;
    height: 16px;
    accent-color: var(--primary, #165DFF);
    cursor: pointer;
  }
  .history-grid[data-mode="list"] {
    display: flex;
    flex-direction: column;
    gap: 6px;
  }
  .task-row {
    display: grid;
    grid-template-columns: auto 80px 1fr auto auto;
    gap: 12px;
    align-items: center;
    padding: 8px 10px;
    background: var(--bg, #fff);
    border: 1px solid var(--border, #e5e7eb);
    border-radius: var(--r-md);
    cursor: pointer;
    transition: all .12s;
  }
  .task-row:hover {
    background: var(--bg-elev, rgba(0,0,0,0.02));
    border-color: var(--primary, #165DFF);
  }
  .task-row.is-selected {
    background: rgba(22,93,255,0.06);
    border-color: var(--primary, #165DFF);
  }
  .task-row-thumb {
    width: 80px;
    height: 45px;
    background: #0f172a;
    border-radius: 4px;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  .task-row-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
  .task-row-main {
    min-width: 0;
  }
  .task-row-title {
    font-size: var(--fs-body);
    font-weight: 600;
    color: var(--t1);
    min-width: 0;            /* K2 fix: 允许 flex 子项收缩，修复文字溢出容器 */
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .task-row-sub {
    font-size: var(--fs-nano);
    color: var(--t2);
    margin-top: 2px;
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
  }
  .task-row-tags {
    display: flex;
    gap: 4px;
    flex-wrap: wrap;
    max-width: 240px;
  }
  .task-row-meta {
    display: flex;
    align-items: center;
    gap: 12px;
    font-size: var(--fs-nano);
    color: var(--t2);
  }
  .task-row-meta .task-card-status {
    position: static;
    padding: 2px 8px;
  }
  .task-row-cost {
    color: var(--t1);
    font-weight: 600;
  }
  .task-row-time {
    font-variant-numeric: tabular-nums;
  }
  .dd-panel {
    position: fixed;
    z-index: 70;
    background: var(--bg, #fff);
    border: 1px solid var(--border, #e5e7eb);
    border-radius: var(--r-md);
    box-shadow: 0 4px 10px rgba(0,0,0,.10);
    min-width: 200px;
    max-width: 280px;
    padding: 8px;
    display: flex;
    flex-direction: column;
    gap: 6px;
    animation: popIn .15s var(--ease);
  }
  .dd-panel[hidden] {
    display: none;
  }
  .dd-head {
    font-size: var(--fs-nano);
    font-weight: 600;
    color: var(--t2);
    padding: 4px 8px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
  }
  .dd-list {
    display: flex;
    flex-direction: column;
    gap: 2px;
    max-height: 320px;
    overflow-y: auto;
  }
  .dd-opt {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 5px 8px;
    border-radius: 4px;
    cursor: pointer;
    font-size: var(--fs-body);
    color: var(--t1);
    transition: background .1s;
  }
  .dd-opt:hover {
    background: var(--bg-elev, rgba(0,0,0,0.04));
  }
  .dd-opt input {
    width: 14px;
    height: 14px;
    accent-color: var(--primary, #165DFF);
    cursor: pointer;
  }
  .dd-count {
    margin-left: auto;
    font-size: var(--fs-micro);
    color: var(--t2);
    font-variant-numeric: tabular-nums;
  }
  .dd-foot, .dd-range-foot {
    display: flex;
    justify-content: flex-end;
    gap: 6px;
    padding: 6px 4px 2px;
    border-top: 1px solid var(--border, #e5e7eb);
    margin-top: 4px;
  }
  .dd-range {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 4px;
  }
  .dd-range label {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: var(--fs-body);
    color: var(--t1);
  }
  .dd-range input {
    width: 100%;
    padding: 4px 8px;
    border: 1px solid var(--border, #e5e7eb);
    border-radius: 4px;
    font-size: var(--fs-body);
  }
  .hs-section-help {
    margin-top: 12px;
  }
  .hs-help {
    padding: 10px 12px;
    border-radius: var(--r-md);
    background: var(--bg-elev, rgba(22,93,255,0.04));
    border: 1px dashed rgba(22,93,255,0.2);
  }
  .hs-help-title {
    display: flex;
    align-items: center;
    gap: 4px;
    font-size: var(--fs-nano);
    font-weight: 600;
    color: var(--primary, #165DFF);
    margin-bottom: 4px;
    text-transform: uppercase;
  }
  .hs-help-title i[data-lucide] {
    width: 12px;
    height: 12px;
  }
  .hs-help-body {
    font-size: var(--fs-nano);
    color: var(--t2);
    line-height: 1.7;
  }
  .hs-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--proj-color, #165DFF);
    flex-shrink: 0;
  }
  .hs-item[data-project-id] .hs-dot {
    margin-left: 0;
  }
  .td-head {
    display: flex;
    align-items: center;
    gap: 8px;
  }
  .td-nav {
    display: flex;
    gap: 2px;
  }
  .td-nav-btn {
    background: transparent;
    border: none;
    cursor: pointer;
    color: var(--t2);
    padding: 4px;
    border-radius: 4px;
    display: flex;
    align-items: center;
  }
  .td-nav-btn:hover {
    background: var(--bg-elev, rgba(0,0,0,0.05));
    color: var(--t1);
  }
  .td-nav-btn i[data-lucide] {
    width: 16px;
    height: 16px;
  }
  .td-title {
    flex: 1;
    font-weight: 600;
    font-size: var(--fs-h2);
  }
  @media (max-width: 1023px) {
    .hs-stat-bar {
      display: none;
    }
  }
  @media (max-width: 768px) {
    .task-row {
      grid-template-columns: auto 60px 1fr;
    }
    .task-row-tags, .task-row-meta {
      display: none;
    }
  }
  .topbar-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    gap: 16px;
  }
  .proj-switcher {
    position: relative;
    padding: 12px;
    border-bottom: 1px solid var(--line);
    flex-shrink: 0;
  }
  .proj-switcher-btn {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding: 8px 10px;
    border-radius: var(--r-md);
    border: 1px solid var(--line);
    background: var(--bg-2);
    color: var(--t1);
    cursor: pointer;
    font-family: inherit;
    transition: border-color .15s ease, background .15s ease;
  }
  .proj-switcher-btn:hover {
    border-color: var(--brand-soft);
    background: var(--bg-3);
  }
  .proj-switcher-info {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 2px;
    min-width: 0;
    flex: 1;
    text-align: left;
  }
  .proj-switcher-name {
    font-size: var(--fs-body);
    font-weight: 500;
    color: var(--t1);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    width: 100%;
  }
  .proj-switcher-status {
    font-size: var(--fs-nano);
    color: var(--t3);
  }
  .proj-switcher-caret {
    width: 14px;
    height: 14px;
    color: var(--t3);
    flex-shrink: 0;
  }
  .proj-switcher-menu {
    position: absolute;
    top: calc(100% - 2px);
    left: 12px;
    right: 12px;
    background: var(--bg-1);
    border: 1px solid var(--line);
    border-radius: var(--r-md);
    box-shadow: var(--shadow-lg);
    z-index: 50;
    padding: 6px;
    margin-top: 4px;
  }
  .proj-switcher-menu-head {
    padding: 6px 8px;
    font-size: var(--fs-nano);
    color: var(--t3);
    font-weight: 600;
  }
  .proj-switcher-list {
    display: flex;
    flex-direction: column;
    gap: 2px;
    max-height: 240px;
    overflow-y: auto;
  }
  .proj-switcher-all {
    display: block;
    padding: 8px;
    text-align: center;
    color: var(--brand-text);
    text-decoration: none;
    font-size: var(--fs-small);
    border-top: 1px solid var(--line);
    margin-top: 4px;
  }
  .proj-switcher-all:hover {
    color: var(--brand-soft);
  }
  .proj-item {
    display: flex;
    align-items: center;
    gap: 8px;
    width: 100%;
    padding: 7px 8px;
    border-radius: var(--r-sm);
    border: none;
    background: transparent;
    color: var(--t1);
    cursor: pointer;
    text-align: left;
    font-family: inherit;
    transition: background .15s ease;
  }
  .proj-item:hover {
    background: var(--bg-2);
  }
  .proj-item-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    flex-shrink: 0;
  }
  .proj-item-info {
    min-width: 0;
    flex: 1;
  }
  .proj-item-name {
    font-size: var(--fs-small);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  .proj-empty {
    padding: 8px;
    color: var(--t3);
    font-size: var(--fs-small);
  }
  .demo-examples-grid, .recent-strip-grid {
    padding: 2px 2px 6px;
  }
  .demo-examples-grid .demo-card-name, .recent-strip-grid .demo-card-name {
    font-weight: 400;
    justify-content: center;
    text-align: center;
  }
  .media-card {
    position: relative;
    padding: 0;
    display: flex;
    flex-direction: column;
    background: var(--bg-2, #fff);
    border: 1px solid var(--line, #e2e8f0);
    border-radius: var(--r-md, 10px);
    overflow: hidden;
    text-align: left;
    color: inherit;
    transition: border-color .15s, box-shadow .15s, transform .15s;
  }
  .media-card:hover {
    border-color: var(--brand-text, #165DFF);
    box-shadow: 0 4px 14px rgba(22,93,255,.12);
    transform: translateY(-1px);
  }
  .media-card-thumb {
    position: relative;
    aspect-ratio: 16 / 9;
    background: var(--bg-3, #f1f5f9);
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
  }
  .media-card-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
  }
  .media-card-thumb .media-card-type-icon {
    color: var(--t3, #94a3b8);
  }
  .media-card-badge {
    position: absolute;
    top: 6px;
    left: 6px;
    background: rgba(15,23,42,.72);
    color: #fff;
    font-size: var(--fs-micro);
    font-weight: 500;
    padding: 2px 7px;
    border-radius: 5px;
  }
  .media-card-duration {
    position: absolute;
    bottom: 6px;
    right: 6px;
    background: rgba(15,23,42,.78);
    color: #fff;
    font-size: var(--fs-micro);
    padding: 1px 6px;
    border-radius: 4px;
    font-variant-numeric: tabular-nums;
  }
  .media-card-check {
    position: absolute;
    top: 6px;
    right: 6px;
    width: 20px;
    height: 20px;
    border-radius: 6px;
    border: 2px solid #fff;
    background: rgba(15,23,42,.35);
    display: none;
    align-items: center;
    justify-content: center;
    color: #fff;
    cursor: pointer;
  }
  .media-card.selectable .media-card-check {
    display: flex;
  }
  .media-card.selected {
    border-color: var(--brand-text, #165DFF);
    box-shadow: 0 0 0 2px var(--brand, #165DFF);
  }
  .media-card.selected .media-card-check {
    background: var(--brand, #165DFF);
  }
  .media-card-body {
    padding: 8px 10px;
    display: flex;
    flex-direction: column;
    gap: 2px;
    flex: 1;
    min-width: 0;
  }
  .media-card-name {
    font-weight: 600;
    font-size: var(--fs-body);
    color: var(--t1, #0f172a);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  .media-card-sub {
    font-size: var(--fs-nano);
    color: var(--t3, #64748b);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  .media-card-meta {
    font-size: var(--fs-micro);
    color: var(--t3, #94a3b8);
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
  }
  .media-card-tags {
    display: flex;
    gap: 4px;
    flex-wrap: wrap;
    margin-top: 2px;
  }
  .media-card-tags .tag {
    font-size: var(--fs-micro);
    color: var(--brand-text, #165DFF);
    background: var(--brand-soft, rgba(22,93,255,.1));
    padding: 1px 6px;
    border-radius: 4px;
  }
  .media-card-actions {
    display: flex;
    gap: 4px;
    padding: 6px 8px 10px;
    margin-top: auto;
  }
  .media-card-actions .btn {
    font-size: var(--fs-nano);
    flex: 1;
    justify-content: center;
  }
  .media-card-actions .btn i {
    width: 13px;
    height: 13px;
  }
  .history-grid .media-card {
    width: 100%;
  }
  .recent-strip-grid .media-card {
    flex: 0 0 auto;
    width: 132px;
  }
  .recent-strip-grid .media-card-name {
    font-weight: 400;
    text-align: center;
  }
  [data-theme="dark"] .media-card {
    background: var(--bg-2, #1e293b);
    border-color: var(--line, #334155);
  }
  [data-theme="dark"] .media-card:hover {
    box-shadow: 0 4px 14px rgba(0,0,0,.4);
  }
  [data-theme="dark"] .media-card-thumb {
    background: var(--bg-3, #0f172a);
  }
  [data-theme="dark"] .media-card-name {
    color: var(--t1, #f1f5f9);
  }
  [data-theme="dark"] .media-card-sub {
    color: var(--t3, #94a3b8);
  }
  [data-theme="dark"] .media-card-tags .tag {
    background: var(--brand-soft, rgba(22,93,255,.18));
  }
  .is-broken {
    opacity: .55;
    filter: grayscale(.8);
    cursor: not-allowed;
  }
  .is-broken .media-card-thumb, .is-broken .asset-card-thumb, .is-broken .td-asset-thumb {
    cursor: not-allowed;
  }
  .is-broken .btn, .is-broken button {
    cursor: not-allowed;
  }
  .is-broken .btn:disabled, .is-broken button:disabled {
    opacity: .55;
  }
  .badge-broken {
    position: absolute;
    top: 6px;
    right: 6px;
    background: rgba(100, 116, 139, .9);
    color: #fff;
    font-size: var(--fs-micro);
    font-weight: 500;
    padding: 2px 7px;
    border-radius: 5px;
    line-height: 1.4;
    z-index: 3;
    pointer-events: none;
  }
  [data-theme="dark"] .badge-broken {
    background: rgba(148, 163, 184, .9);
  }
  .demo-card-thumb-placeholder {
    display: block;
    width: 100%;
    aspect-ratio: 16/9;
    background: linear-gradient(135deg, var(--bg-3) 0%, var(--bg-2) 100%);
    border-radius: 6px;
  }
  .demo-examples-grid .demo-card-name, .recent-strip-grid .demo-card-name {
    display: block;
    font-size: var(--fs-small);
    font-weight: 400;
    line-height: 1.3;
    text-align: center;
    width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .demo-filter-bar {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    gap:12px 14px;
    padding: 12px 16px;
    border-bottom: 1px solid var(--line);
    background: var(--bg-soft, var(--bg-1));
  }
  .demo-filter-item {
    display: flex;
    flex-direction: column;
    gap: 4px;
  }
  .demo-filter-item label {
    font-size: var(--fs-nano);
    color: var(--t3);
    font-weight: 600;
  }
  .demo-filter-item .admin-select, .demo-filter-item .admin-input {
    font-size: var(--fs-small);
    padding: 7px 10px;
    min-width: 130px;
    border-radius: var(--r-md, 8px);
  }
  .demo-filter-grow {
    flex: 1 1 180px;
  }
  .demo-filter-grow .admin-input {
    width: 100%;
    min-width: 0;
  }
  .demo-filter-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    max-width: 520px;
    max-height: 88px;
    overflow-y: auto;
    padding-right: 4px;
  }
  .demo-filter-tags::-webkit-scrollbar {
    width: 6px;
  }
  .demo-filter-tags::-webkit-scrollbar-thumb {
    background: var(--line-strong, #cbd5e1);
    border-radius: 3px;
  }
  .demo-filter-tag {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: var(--fs-small);
    padding: 4px 10px;
    border-radius: var(--r-full);
    border: 1px solid var(--line);
    background: var(--bg-1);
    color: var(--t2);
    cursor: pointer;
    user-select: none;
    transition: all .15s var(--ease);
  }
  .demo-filter-tag em {
    font-style: normal;
    font-size: var(--fs-micro);
    color: var(--t3);
    background: var(--bg-2);
    border-radius: var(--r-full);
    padding: 1px 6px;
  }
  .demo-filter-tag:hover {
    border-color: var(--brand-text);
    color: var(--t1);
  }
  .demo-filter-tag.is-on {
    background: var(--brand);
    border-color: var(--brand-text);
    color: #fff;
  }
  .demo-filter-tag.is-on em {
    background: rgba(255,255,255,.25);
    color: #fff;
  }
  .demo-filter-tags-empty {
    font-size: var(--fs-small);
    color: var(--t3);
  }
  .demo-card-cat {
    display: inline-flex;
    align-self: flex-start;
    font-size: var(--fs-micro);
    font-weight: 600;
    color: var(--brand-text);
    background: var(--brand-soft, rgba(22,93,255,.1));
    border: 1px solid var(--brand, #165DFF);
    border-radius: var(--r-full);
    padding: 2px 9px;
  }
  [data-theme="dark"] .demo-card-cat {
    color: #93c5fd;
    background: rgba(22,93,255,.16);
    border-color: rgba(22,93,255,.45);
  }
  .product-name-keywords-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap:16px;
    margin: 2px 0 6px;
  }
  .product-name-keywords-row .field {
    margin: 0;
  }
  .step0-meta-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
    align-items: stretch;
  }
  .step0-meta-card {
    background: var(--bg-1);
    border: 1px solid var(--line);
    padding: 16px 18px;
    display: flex;
    flex-direction: column;
    gap: 12px;
    min-width: 0;
  }
  .step0-meta-card > .field {
    margin: 0;
  }
  .step0-meta-card > .field > span {
    font-weight: 600;
    color: var(--t1);
  }
  .step0-meta-card .product-context-collapse {
    flex: 1;
    margin: 0;
    display: flex;
    flex-direction: column;
    background: transparent;
    border: none;
    border-radius: 0;
  }
  .step0-meta-card .product-context-collapse[open] {
    flex: 1;
  }
  .step0-meta-card .product-context-collapse > summary {
    padding: 0 0 12px 0;
  }
  .step0-meta-card .product-context-body {
    padding: 0;
    flex: 1;
  }
  @media (max-width: 1023px) {
    .step0-meta-grid {
      grid-template-columns: 1fr;
    }
  }
  .ai-analysis-panel {
    margin-top: 14px;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
    align-items: stretch;
  }
  .ai-col-left, .ai-col-right {
    display: flex;
    flex-direction: column;
    gap: 16px;
    min-width: 0;
  }
  .ai-card {
    display: flex;
    flex-direction: column;
    gap: 12px;
    background: var(--bg-1);
    border: 1px solid var(--line);
    border-radius: var(--r-md);
    padding: 16px 18px;
  }
  .ai-card-grow {
    flex: 1;
    min-height: 0;
  }
  .ai-card-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap:12px;
  }
  .ai-card-title {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: var(--fs-body);
    font-weight: 600;
    color: var(--t1);
  }
  .ai-card-title i[data-lucide] {
    width: 17px;
    height: 17px;
    color: var(--brand-text);
  }
  .ai-card-status {
    font-size: var(--fs-nano);
    color: var(--t3);
    padding: 2px 8px;
    border: 1px solid var(--line-subtle);
    border-radius: 20px;
  }
  .ai-card-desc {
    margin: 0;
    font-size: var(--fs-small);
    color: var(--t2);
    line-height: 1.5;
  }
  .ai-action-result {
    flex: 1;
    min-height: 80px;
    background: var(--bg-2);
    border: 1px solid var(--line-subtle);
    border-radius: var(--r-sm);
    padding: 11px 13px;
    max-height: 340px;
    overflow-y: auto;
  }
  .ai-action-result .structure-notes-body {
    font-size: var(--fs-small);
    line-height: 1.6;
    color: var(--t2);
  }
  .ai-analysis-panel .draft-thinking {
    grid-column: 1 / -1;
    width: 100%;
  }
  .analysis-card-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap:12px;
  }
  .analysis-card-title {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: var(--fs-body);
    font-weight: 500;
    color: var(--t1);
  }
  .analysis-card-title i[data-lucide] {
    width: 16px;
    height: 16px;
    color: var(--brand-text);
  }
  .analysis-card-status {
    font-size: var(--fs-small);
    color: var(--t3);
  }
  .analysis-card-desc {
    margin: 0;
    font-size: var(--fs-small);
    color: var(--t2);
    line-height: 1.5;
  }
  .ai-action-row > .btn {
    align-self: flex-start;
  }
  .ai-analysis-panel .draft-thinking {
    grid-column: 1 / -1;
  }
  .analysis-card .structure-notes-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap:12px;
    padding-bottom: 8px;
    margin-bottom: 8px;
    border-bottom: 1px dashed var(--line);
  }
  .analysis-card .structure-notes-head .sn-title {
    font-size: var(--fs-body);
    font-weight: 500;
    color: var(--t1);
  }
  .analysis-card .structure-notes-head .structure-notes-hint {
    font-size: var(--fs-nano);
    color: var(--t3);
  }
  .advanced-collapse {
    margin-top: 10px;
    background: var(--bg-1);
    border: 1px solid var(--line);
    border-radius: var(--r-md);
    overflow: hidden;
  }
  .advanced-collapse > summary {
    display: flex;
    align-items: center;
    gap:12px;
    padding: 12px 14px;
    cursor: pointer;
    list-style: none;
    user-select: none;
  }
  .advanced-collapse > summary::-webkit-details-marker {
    display: none;
  }
  .advanced-collapse > summary:hover {
    background: var(--bg-2);
  }
  .advanced-collapse .ac-title {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: var(--fs-body);
    font-weight: 500;
    color: var(--t1);
  }
  .advanced-collapse .ac-title i[data-lucide] {
    width: 16px;
    height: 16px;
    color: var(--brand-text);
  }
  .advanced-collapse .ac-sub {
    flex: 1;
    font-size: var(--fs-small);
    color: var(--t3);
    min-width: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  .advanced-collapse .chev {
    color: var(--t3);
    font-size: var(--fs-small);
    transition: transform .15s ease;
  }
  .advanced-collapse[open] .chev {
    transform: rotate(180deg);
  }
  .draft-cta {
    margin-top: 14px;
  }
  .draft-cards {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
  }
  .draft-card {
    display: flex;
    flex-direction: column;
    gap:12px;
    padding: 14px;
    background: var(--bg-1);
    border: 1px solid var(--line);
    border-radius: var(--r-md);
    transition: border-color .15s ease, box-shadow .15s ease;
  }
  .draft-card:hover {
    border-color: var(--brand-soft);
    box-shadow: var(--shadow-sm);
  }
  .draft-card-head {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: var(--fs-body);
    font-weight: 500;
    color: var(--t1);
  }
  .draft-card-head i[data-lucide] {
    width: 18px;
    height: 18px;
    color: var(--brand-text);
  }
  .draft-card-desc {
    margin: 0;
    flex: 1;
    font-size: var(--fs-small);
    color: var(--t2);
    line-height: 1.5;
  }
  .draft-card .btn {
    width: 100%;
    justify-content: center;
    padding: 8px;
    font-size: var(--fs-body);
  }
  .draft-card .btn:disabled {
    opacity: .5;
    cursor: not-allowed;
  }
  @media (max-width: 1023px) {
    .draft-cards {
      grid-template-columns: 1fr;
    }
  }
  .recent-strip-grid .media-card-thumb {
    background: linear-gradient(135deg, var(--bg-3) 0%, var(--bg-2) 100%);
  }
  .recent-strip-grid .media-card-type-icon {
    display: none;
  }
  .filter-chip.chip-filtered {
    border-color: var(--primary, #165DFF);
    color: var(--primary, #165DFF);
  }
  .dd-opt.dd-sel {
    color: var(--primary, #165DFF);
    font-weight: 600;
  }
  .activity-panel {
    background: var(--bg-1, #fff);
    border-top: 1px solid var(--line, #e2e8f0);
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 14px;
    overflow-y: auto;
    min-width: 0;
  }
  /* v60.21: 小屏（<1024 CSS px，如系统缩放 150% 的笔记本）隐藏右侧创作面板，
     主区独占宽度——从根上消除「面板挤压/卡片条盖住侧栏」这类重叠 */
  @media (max-width: 1023.98px) {
    .activity-panel { display: none; }
  }
  @media (min-width: 1024px) {
    .activity-panel {
      flex: 0 0 360px;
      width: 360px;
      border-top: none;
      border-left: 1px solid var(--line, #e2e8f0);
    }
  }
  .activity-section {
    background: var(--bg-2, #f8fafc);
    border: 1px solid var(--line, #e2e8f0);
    border-radius: var(--r-md, 10px);
    padding: 8px 10px;
  }
  .activity-section-head {
    font-size: var(--fs-body);
    font-weight: 600;
    color: var(--t1, #0f172a);
    margin-bottom: 6px;
    padding-bottom: 6px;
    border-bottom: 1px solid var(--line, #e2e8f0);
    display: flex;
    align-items: center;
    gap: 6px;
  }
  .activity-section-head-row .activity-section-head {
    margin-bottom: 0;
    padding-bottom: 0;
    border-bottom: none;
  }
  .activity-section-head-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 10px;
    padding-bottom: 8px;
    border-bottom: 1px solid var(--line, #e2e8f0);
  }
  .act-collapse-btn {
    flex-shrink: 0;
    width: 22px;
    height: 22px;
    border: none;
    border-radius: 4px;
    background: transparent;
    color: var(--t3, #94a3b8);
    font-size:12px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: transform .2s ease, color .15s ease;
    padding: 0;
    line-height: 1;
  }
  .act-collapse-btn:hover {
    color: var(--t1, #0f172a);
    background: var(--bg-2, #f1f5f9);
  }
  .activity-section.collapsed .act-collapse-btn {
    transform: rotate(-90deg);
  }
  .activity-section-body {
    overflow: hidden;
    transition: opacity .2s ease, max-height .25s ease;
    max-height: 2000px;
    opacity: 1;
  }
  /* v60.33: Agent 调用区内容自适应高度——卡片多高就多高，不留空白（面板层统一滚动） */
  #activityAgentBody { min-height: 0; max-height: none; }
  .agent-roster .agent-card, .agent-roster > div { min-height: 40px; }
  .activity-section.collapsed .activity-section-body {
    max-height: 0;
    opacity: 0;
    margin: 0;
    padding: 0;
  }
  .activity-section.collapsed {
    padding-bottom: 8px;
  }
  .activity-section-head[data-collapse-target], .activity-section-head-row[data-collapse-target] {
    cursor: pointer;
    user-select: none;
  }
  .activity-section-head[data-collapse-target]:hover .act-collapse-btn, .activity-section-head-row[data-collapse-target]:hover .act-collapse-btn {
    color: var(--t1, #0f172a);
  }
  .act-product-name {
    font-size: var(--fs-h2);
    font-weight: 600;
    color: var(--t1, #0f172a);
    line-height: 1.35;
    word-break: break-word;
  }
  /* v61.42 UI-5：badge 截断加省略号（原 container 过窄时文字被浏览器硬切无省略号） */
  .act-product-brand {
    font-size: var(--fs-small);
    color: var(--t3, #64748b);
    margin-top: 2px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 100%;
  }
  .act-kw-label {
    font-size: var(--fs-small);
    font-weight: 500;
    color: var(--t2, #334155);
    margin-top: 10px;
  }
  .act-kw-count {
    color: var(--brand-text, #165DFF);
    font-weight: 600;
  }
  .act-keywords {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    margin-top: 7px;
    max-height: 44px;
    overflow: hidden;
    position: relative;
  }
  .act-keywords.expanded {
    max-height: none;
  }
  .act-keywords .kw-tag, .act-keywords span:not(.act-empty) {
    font-size: var(--fs-nano);
    color: var(--t1, #0f172a);
    background: var(--bg-base, #fff);
    border: 1px solid var(--line-subtle, #e2e8f0);
    padding: 2px 8px;
    border-radius: 999px;
    line-height: 1.5;
  }
  .act-kw-toggle {
    margin-top: 5px;
    font-size: var(--fs-nano);
    color: var(--text-tertiary, #94a3b8);
    background: transparent;
    border: none;
    padding: 2px 0;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 4px;
  }
  .act-kw-toggle:hover {
    color: var(--accent, #165DFF);
  }
  .act-empty {
    color: var(--t3, #94a3b8);
    font-size: var(--fs-small);
  }
  /* v61.31 修复：原 .agent-roster 有孤儿属性（12678-12684 无选择器包裹），合并为完整规则 */
  .agent-roster {
    /* v60.33: 取消固定 280 高——7 位角色自然撑开，底部不再出现死白 */
    max-height: none;
    overflow-y: visible;
    padding-right: 2px;
    display: flex;
    flex-direction: column;
    gap: 6px;
    flex: 1 1 auto;
    min-height: 0;
  }
  .agent-roster-item {
    display: flex;
    align-items: center;
    gap:12px;
    font-size: var(--fs-small);
    padding: 5px 6px;
    border-radius: 10px;
    min-width: 0;
    transition: background .15s ease;
  }
  .agent-roster-item:hover {
    background: var(--bg-2, #f1f5f9);
  }
  .agent-roster-avatar {
    width: 32px;
    height: 32px;
    border-radius: 10px;
    background: linear-gradient(135deg, #6b8bb5, #5a7299);
    color: #fff;
    display: grid;
    place-items: center;
    flex-shrink: 0;
    box-shadow: 0 2px 5px rgba(90,114,153,.14);
  }
  .agent-roster-avatar i {
    width: 16px;
    height: 16px;
  }
  .agent-roster-name {
    color: var(--t1, #0f172a);
    font-weight: 500;
    flex: 1;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .agent-roster-status {
    font-size: var(--fs-micro);
    color: var(--t3, #94a3b8);
    padding: 2px 8px;
    border-radius: 999px;
    background: rgba(148,163,184,.16);
    flex-shrink: 0;
    font-weight: 500;
  }
  .agent-roster-status[data-status="active"] {
    color: #165DFF;
    font-weight: 600;
    background: rgba(148,163,184,.16);
  }
  .agent-roster-status[data-status="done"] {
    color: #00B42A;
    background: rgba(0,180,42,.12);
  }
  .agent-roster-status[data-status="error"] {
    color: #F53F3F;
    background: rgba(245,63,63,.12);
  }
  .agent-roster-item[data-agent-id="product_manager"] .agent-roster-avatar {
    background: linear-gradient(135deg, #6b8bb5, #5a7299);
    box-shadow: 0 2px 5px rgba(90,114,153,.14);
  }
  .agent-roster-item[data-agent-id="structural_engineer"] .agent-roster-avatar {
    background: linear-gradient(135deg, #6ba3b8, #55899e);
    box-shadow: 0 2px 5px rgba(85,137,158,.14);
  }
  .agent-roster-item[data-agent-id="creative_director"] .agent-roster-avatar {
    background: linear-gradient(135deg, #9b8fbf, #8a7eb0);
    box-shadow: 0 2px 5px rgba(138,126,176,.14);
  }
  .agent-roster-item[data-agent-id="video_producer"] .agent-roster-avatar {
    background: linear-gradient(135deg, #cf9fb0, #c792a0);
    box-shadow: 0 2px 5px rgba(199,146,160,.14);
  }
  .agent-roster-item[data-agent-id="marketing_expert"] .agent-roster-avatar {
    background: linear-gradient(135deg, #8fbba3, #79aa8e);
    box-shadow: 0 2px 5px rgba(121,170,142,.14);
  }
  .act-thinking-section {
    flex: 1;
    min-height: 0;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    background: var(--bg-1, #fff);
    border: 1px solid var(--line, #e2e8f0);
    border-radius: var(--r-sm, 8px);
  }
  .act-thinking-header {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 12px;
    background: var(--bg-2, #f8fafc);
    border-bottom: 1px solid var(--line, #e2e8f0);
    cursor: pointer;
    user-select: none;
  }
  .act-thinking-header i {
    width: 16px;
    height: 16px;
    color: var(--brand-text, #165DFF);
  }
  .act-thinking-title {
    font-size:14px;
    font-weight: 600;
    color: var(--text, #0f172a); /* v20.0.6 修复 2：主色 #t1 替代 #t2 灰色 */
  }
  .act-thinking-section.is-done .act-thinking-title {
    color: var(--ok, #00B42A); /* v20.0.6：完成时变绿 */
  }
  .act-thinking-status {
    margin-left: auto;
    font-size:12px;
    color: var(--t3, #94a3b8);
  }
  .act-thinking-section.is-done .act-thinking-status {
    color: var(--ok, #00B42A);
  }
  .act-thinking-section.is-running .act-thinking-status {
    color: var(--brand-text, #165DFF);
  }
  .act-thinking-body {
    padding: 10px 12px;
    overflow-y: auto;
    max-height: 280px;
    flex: 1;
  }
  .act-thinking-empty {
    font-size: 12px;
    color: var(--t3, #94a3b8);
    text-align: center;
    padding: 16px 8px;
  }
  .act-thinking-content {
    font-size: 12px;
    color: var(--text, #0f172a); /* v20.0.6 修复 2：主色 */
    line-height: 1.6;
  }
  .act-log-section {
    flex: 0 0 auto;
    display: flex;
    flex-direction: column;
  }
  .act-log-section .activity-section-body {
    max-height: 130px;
    overflow-y: auto;
    position: relative;
  }
  .act-log-section .activity-section-body::after {
    content: '';
    position: sticky;
    bottom: 0;
    left: 0;
    right: 0;
    height: 28px;
    background: linear-gradient(transparent, var(--bg-2, #f8fafc) 70%);
    pointer-events: none;
    opacity: 0;
    transition: opacity .2s ease;
  }
  .act-log-section.log-clamped .activity-section-body::after {
    opacity: 1;
  }
  .act-log-expand {
    display: none;
    font-size: var(--fs-nano, 11px);
    color: var(--brand-text, #165DFF);
    cursor: pointer;
    text-align: center;
    padding: 4px 0 2px;
    border-top: 1px solid var(--line, #e2e8f0);
    margin-top: 4px;
  }
  .act-log-expand:hover {
    text-decoration: underline;
  }
  .act-log-section.log-clamped .act-log-expand {
    display: block;
  }
  .act-log-section.log-expanded .activity-section-body {
    max-height: 260px;
  }
  .act-thinking {
    font-size: var(--fs-small);
    color: var(--t2, #334155);
    line-height: 1.55;
    overflow-y: auto;
    flex: 1;
    min-height: 0;
  }
  .act-timing {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: var(--fs-nano);
    color: var(--t3, #64748b);
    margin-bottom: 8px;
  }
  .act-timing-sep {
    opacity: .6;
  }
  .agent-think-list {
    display: flex;
    flex-direction: column;
    gap: 6px;
  }
  .agent-think-item {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 7px 9px;
    border: 1px solid var(--line, #e2e8f0);
    border-radius: 8px;
    background: var(--bg-1, #fff);
    font-size: var(--fs-small);
  }
  .agent-think-item[data-status="active"] {
    border-color: var(--brand-text, #165DFF);
    background: var(--brand-soft, rgba(22,93,255,.06));
  }
  .agent-think-item[data-status="done"] {
    border-color: rgba(0,180,42,.3);
  }
  .agent-think-item[data-status="error"] {
    border-color: rgba(245,63,63,.35);
  }
  .agent-think-icon {
    font-size: var(--fs-body);
    line-height: 1;
    flex-shrink: 0;
  }
  .agent-think-name {
    font-weight: 500;
    color: var(--t1, #0f172a);
    flex: 1;
    min-width: 0;
  }
  .agent-think-status {
    color: var(--t3, #94a3b8);
    font-size: var(--fs-nano);
    flex-shrink: 0;
    max-width: 55%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .think-done-summary {
    color: var(--t2, #334155);
  }
  [data-theme="dark"] .activity-panel {
    background: var(--bg-1, #0f172a);
    border-color: var(--line, #334155);
  }
  [data-theme="dark"] .activity-section {
    background: var(--bg-2, #1e293b);
    border-color: var(--line, #334155);
  }
  [data-theme="dark"] .activity-section-head {
    border-color: var(--line, #334155);
    color: var(--t1, #f1f5f9);
  }
  [data-theme="dark"] .act-product-name {
    color: var(--t1, #f1f5f9);
  }
  [data-theme="dark"] .act-keywords .kw-tag, [data-theme="dark"] .act-keywords span:not(.act-empty) {
    color: var(--t1, #f1f5f9);
    background: var(--bg-2, #1e293b);
    border-color: var(--line, #334155);
  }
  [data-theme="dark"] .act-kw-toggle {
    color: var(--t3, #94a3b8);
  }
  [data-theme="dark"] .act-kw-toggle:hover {
    color: var(--brand-text, #4080FF);
  }
  [data-theme="dark"] .agent-think-item {
    background: var(--bg-1, #0f172a);
    border-color: var(--line, #334155);
  }
  [data-theme="dark"] .agent-think-name {
    color: var(--t1, #f1f5f9);
  }
  [data-theme="dark"] .agent-roster-status {
    background: rgba(148,163,184,.2);
  }
  .sidebar-tip {
    margin: 4px 10px 8px;
    padding: 9px 11px;
    font-size: var(--fs-small);
    line-height: 1.5;
    color: var(--t2);
    background: var(--brand-soft, rgba(22,93,255,.07));
    border-left: 3px solid var(--brand, #165DFF);
    border-radius: 0 8px 8px 0;
  }
  .recent-strip-grid .media-card {
    flex: 0 0 auto;
    width: 132px;
    border-radius: var(--r-lg, 14px);
    box-shadow: var(--shadow-card);
    background: var(--bg-1);
  }
  .recent-strip-grid .media-card:hover {
    transform: translateY(-2px);
    box-shadow: var(--shadow-soft);
    border-color: var(--brand-text, #165DFF);
  }
  .recent-strip-grid .media-card-thumb {
    background: var(--bg-2);
  }
  .recent-strip-grid .media-card-body {
    padding: 12px 14px;
    gap: 6px;
  }
  .recent-strip-grid .media-card-name {
    font-weight: 400;
    font-size: var(--fs-small);
    text-align: center;
    display: block;
    width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .step-body {
    padding: 14px 22px;
  }
  .step-panel > .field {
    margin: 4px 0;
  }
  .upload-grid {
    gap:12px;
    margin: 8px 0;
  }
  .free-upload-drop {
    min-height: 92px;
  }
  .ai-analysis-panel {
    margin-top: 10px;
  }
  .ai-action-result {
    max-height: 280px;
  }
  .draft-cta {
    margin-top: 10px;
  }
  .draft-card {
    padding: 12px 13px;
    gap: 9px;
  }
  .step-header-sub:empty {
    display: none;
  }
  .activity-section-head {
    font-size: var(--fs-nano);
    text-transform: uppercase;
    letter-spacing: .06em;
    color: var(--t3, #64748b);
    font-weight: 600;
  }
  .activity-section .act-empty {
    display: inline-block;
    padding: 4px 10px;
    border: 1px dashed var(--line-strong, #cbd5e1);
    border-radius: 7px;
    color: var(--t3, #94a3b8);
    font-size: var(--fs-nano);
    background: transparent;
  }
  .recent-strip .demo-examples-grid, .recent-strip .recent-strip-grid {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    overflow: visible;
    gap: 8px;
    padding-bottom: 0;
    flex: initial;
  }
  .recent-strip .demo-card, .recent-strip .media-card {
    width: auto;
    flex: initial;
    min-width: 0;
    padding: 5px;
    gap: 3px;
  }
  .recent-strip .media-card-body {
    padding: 7px 6px;
    gap: 3px;
  }
  .recent-strip .demo-card-name, .recent-strip .media-card-name {
    font-size: var(--fs-nano);
  }
  .recent-strip .recent-empty-card {
    width: auto;
  }
  .pc-title > svg, .free-upload-head > svg, .analysis-card-title > svg, .ac-title > svg, .qwen-ea-title > svg, .step-optional-banner > svg, .rv-title > svg, .mv-title > svg, .adv-label > svg, .brief-col-label > svg, .advanced-toggle svg, .opt-label > svg, .pc-summary-head > svg, .ref-kf-label > svg, .ct-head > svg {
    display: none;
  }
  .substeps {
    display: flex;
    flex-direction: column;
    gap: 1px;
    margin: 2px 0 8px 30px;
    padding-left: 9px;
    border-left: 1px solid var(--line);
  }
  .substep {
    display: flex;
    align-items: center;
    gap: 7px;
    padding: 3px 0;
    font-size: var(--fs-small);
    color: var(--t3);
    line-height: 1.35;
  }
  .sub-dot {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    border: 1.5px solid var(--t3);
    flex: 0 0 auto;
    transition: all .15s ease;
    box-sizing: border-box;
  }
  .sub-txt {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .substep.done {
    color: var(--t2);
  }
  .substep.done .sub-dot {
    background: var(--brand);
    border-color: var(--brand-text);
  }
  .substep.active {
    color: var(--brand-text);
    font-weight: 600;
  }
  .substep.active .sub-dot {
    border-color: var(--brand-text);
    box-shadow: 0 0 0 3px var(--brand-soft);
  }
  .substep.optional {
    opacity: .65;
  }
  .substep.optional .sub-dot {
    border-style: dashed;
  }
  /* v61.36：步骤节点下方的「该步骤已选」摘要行 —— 与左侧创作概览同一数据源，点击 chip 跳回步骤 */
  .step-recap {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    margin: 0 0 6px 30px;
    padding-left: 9px;
    border-left: 1px solid var(--line);
  }
  .step-recap:not(.has) {
    display: none;
  }
  .step-recap .chip.mini {
    font-size: var(--fs-nano);
    padding: 2px 8px;
    gap: 3px;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .step-recap .chip.mini:hover {
    transform: none;
  }
  @media (max-width: 1023px) {
    .substeps {
      display: none;
    }
    .step-recap {
      display: none;
    }
  }
  .recent-strip .demo-card, .recent-strip .media-card, .recent-strip .recent-empty-card {
    flex: 0 0 132px;
    width: 132px;
    min-width: 0;
    padding: 6px;
    gap: 0;
    border: 1px solid var(--line, #e2e8f0);
    border-radius: 12px;
    background: var(--bg-1, #fff);
    box-shadow: 0 1px 2px rgba(15, 23, 42, .05);
    scroll-snap-align: start;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    text-align: center;
    cursor: pointer;
    transition: border-color .15s ease, box-shadow .15s ease, transform .15s ease;
  }
  .recent-strip .demo-card:hover, .recent-strip .media-card:hover, .recent-strip .recent-empty-card:hover {
    border-color: var(--brand-text, #165DFF);
    box-shadow: 0 4px 12px rgba(37, 99, 235, .10);
    transform: translateY(-1px);
  }
  .recent-strip .demo-card-thumb, .recent-strip .media-card-thumb, .recent-strip .recent-empty-thumb {
    width: 100%;
    height: 58px;
    border-radius: 8px;
    object-fit: contain;
    object-position: center;
    background: var(--bg-2, #f1f5f9);
    display: grid;
    place-items: center;
    overflow: hidden;
  }
  .recent-strip .demo-card-body, .recent-strip .media-card-body, .recent-strip .recent-empty-body {
    padding: 7px 2px 2px;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 22px;
  }
  .recent-strip .demo-card-name, .recent-strip .media-card-name, .recent-strip .recent-empty-name {
    display: block;
    width: 100%;
    padding: 0;
    margin: 0;
    font-size: var(--fs-small);
    font-weight: 400;
    line-height: 1.3;
    color: var(--t2, #334155);
    text-align: center;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .recent-strip .recent-empty-card {
    border-style: dashed;
    background: transparent;
  }
  .recent-strip .recent-empty-card:hover {
    background: var(--bg-1, #fff);
  }
  .recent-strip .recent-empty-thumb {
    color: var(--t3, #94a3b8);
    background: transparent;
  }
  .recent-strip .recent-empty-thumb i[data-lucide] {
    width: 20px;
    height: 20px;
  }
  .recent-strip .recent-empty-name {
    color: var(--t3, #94a3b8);
  }
  .recent-strip .demo-examples-grid, .recent-strip .recent-strip-grid {
    display: flex;
    flex-wrap: nowrap;
    gap:12px;
    overflow-x: auto;
    overflow-y: hidden;
    scroll-snap-type: x proximity;
    padding-bottom: 8px;
    flex: initial;
  }
  .recent-strip .demo-examples-grid::-webkit-scrollbar, .recent-strip .recent-strip-grid::-webkit-scrollbar {
    height: 6px;
  }
  .recent-strip .demo-examples-grid::-webkit-scrollbar-thumb, .recent-strip .recent-strip-grid::-webkit-scrollbar-thumb {
    background: var(--line-strong, #cbd5e1);
    border-radius: 3px;
  }
  .recent-strip .demo-examples-grid::-webkit-scrollbar-track, .recent-strip .recent-strip-grid::-webkit-scrollbar-track {
    background: transparent;
  }
  .sidebar-tip {
    background: var(--bg-2, #f1f5f9);
    border-left: 3px solid var(--line-strong, #cbd5e1);
    color: var(--t2, #334155);
  }
  .recent-block-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
  }
  .recent-scroll-hint {
    font-size: var(--fs-nano);
    color: var(--t3, #94a3b8);
    display: inline-flex;
    align-items: center;
    gap: 2px;
    white-space: nowrap;
  }
  .recent-scroll-hint .chev {
    animation: hintNudge 1.4s ease-in-out infinite;
  }
  @keyframes hintNudge {
    0%, 100% {
      transform: translateX(0);
      opacity: .7;
    }
    50% {
      transform: translateX(3px);
      opacity: 1;
    }
  }
  @media (prefers-reduced-motion: reduce) {
    .recent-scroll-hint .chev {
      animation: none;
    }
  }
  .lucide {
    stroke-width: 1.5;
  }
  .history-grid .media-card {
    border-radius: var(--r-lg, 12px);
    background: var(--bg-1, #fff);
  }
  .history-grid .media-card:hover {
    border-color: var(--line-strong, #d0d4dc);
    box-shadow: var(--shadow-soft, 0 4px 12px rgba(26,31,46,.08));
    transform: translateY(-2px);
  }
  .history-grid .media-card-body {
    padding: 10px 12px;
    gap: 4px;
  }
  .history-grid .media-card-name {
    font-weight: 500;
    font-size: var(--fs-small);
    line-height: 1.35;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    line-clamp: 2;
    white-space: normal;
    overflow: hidden;
  }
  .history-grid .media-card-sub {
    font-size: var(--fs-nano);
    color: var(--t3, #6b7280);
  }
  .history-grid .media-card-meta {
    font-size: var(--fs-micro);
    color: var(--t3, #6b7280);
  }
  .history-grid .media-card-tags .tag {
    color: var(--t3, #6b7280);
    background: var(--bg-3, #eef0f3);
    font-weight: 400;
  }
  [data-theme="dark"] .history-grid .media-card-tags .tag {
    background: var(--bg-3, #2b313b);
    color: var(--t3, #909baa);
  }
  .history-grid[data-mode="grid"] .media-card-actions {
    display: none;
  }
  .media-card-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(to top, rgba(15,23,42,.55) 0%, transparent 45%);
    display: flex;
    align-items: flex-end;
    justify-content: flex-end;
    gap: 6px;
    padding: 8px;
    opacity: 0;
    transition: opacity .15s ease;
    pointer-events: none;
  }
  .media-card:hover .media-card-overlay {
    opacity: 1;
    pointer-events: auto;
  }
  .media-card-overlay .mc-act {
    width: 28px;
    height: 28px;
    border-radius: var(--r-md, 8px);
    background: rgba(255,255,255,.92);
    color: var(--t2, #525866);
    border: none;
    display: grid;
    place-items: center;
    cursor: pointer;
    transition: background .15s, color .15s, transform .15s;
  }
  .media-card-overlay .mc-act:hover {
    background: #fff;
    color: var(--t1, #1a1f2e);
    transform: translateY(-1px);
  }
  .media-card-overlay .mc-act.danger:hover {
    color: var(--err, #F53F3F);
  }
  .media-card-overlay .mc-act i[data-lucide] {
    width: 14px;
    height: 14px;
  }
  .history-grid[data-mode="list"] .media-card-overlay {
    display: none;
  }
  .history-toolbar {
    gap: 12px;
  }
  .history-toolbar .filter-bar {
    gap: 8px;
    padding: 6px 0;
  }
  .history-toolbar .filter-bar .toolbar-spacer {
    margin-left: auto;
  }
  .history-toolbar .filter-chip {
    padding: 4px 10px;
    border-color: var(--line, #eef0f3);
    background: var(--bg-1, #fff);
  }
  .history-toolbar .filter-chip.chip-filtered {
    background: var(--brand-soft, rgba(22,93,255,.12));
    border-color: var(--brand-text, #165DFF);
    color: var(--brand-text, #165DFF);
  }
  .history-toolbar .filter-bar .btn.ghost.sm {
    padding: 4px 10px;
    border-color: transparent;
    background: transparent;
    color: var(--t3, #6b7280);
  }
  .history-toolbar .filter-bar .btn.ghost.sm:hover {
    color: var(--t1, #1a1f2e);
    background: var(--bg-2, #f5f6f8);
  }
  .history-summary {
    color: var(--t3, #6b7280);
    margin-top: 2px;
  }
  .history-grid {
    gap: 16px;
    grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
  }
  .vt-btn.active {
    background: var(--brand, #165DFF);
  }
  .agent-roster-progress {
    font-size: var(--fs-nano);
    color: var(--t3);
    padding: 4px 10px;
    border-radius: 999px;
    background: var(--bg-2, #f1f5f9);
    display: inline-block;
    transition: all .25s ease;
    flex-shrink: 0;
  }
  .agent-roster-progress[data-state="active"] {
    color: #165DFF;
    background: rgba(22,93,255,.18);
    font-weight: 600;
  }
  .agent-roster-progress[data-state="done"] {
    color: #00B42A;
    background: rgba(0,180,42,.18);
    font-weight: 600;
  }
  .agent-roster-progress[data-state="partial"] {
    color: #FF7D00;
    background: rgba(255,125,0,.18);
    font-weight: 600;
  }
  .agent-roster-list {
    display: flex;
    flex-direction: column;
    gap: 4px;
  }
  .agent-think-summary {
    margin-top: 8px;
  }
  .think-grid {
    display: flex;
    flex-direction: column;
    gap: 4px;
  }
  .think-row {
    display: flex;
    gap: 8px;
    font-size: var(--fs-nano);
    line-height: 1.45;
  }
  .think-key {
    flex: 0 0 64px;
    color: var(--brand-text, #165DFF);
    font-weight: 600;
  }
  .think-val {
    flex: 1;
    min-width: 0;
    color: var(--t2, #334155);
    white-space: pre-wrap;
    word-break: break-word;
  }
  .think-text {
    font-size: var(--fs-nano);
    color: var(--t2, #334155);
    white-space: pre-wrap;
    word-break: break-word;
    margin-top: 4px;
  }
  .think-empty {
    font-size: var(--fs-nano);
    color: var(--t3, #94a3b8);
  }
  .agent-raw-toggle {
    font-size: var(--fs-micro);
    color: var(--brand-text, #165DFF);
    cursor: pointer;
    margin-top: 6px;
    user-select: none;
  }
  .agent-raw-toggle:hover {
    text-decoration: underline;
  }
  .agent-activity-live.agent-raw-collapsed {
    display: none;
  }
  .agent-activity-live.agent-raw-error {
    border-color: rgba(245,63,63,.4);
  }
  .agent-activity-close {
    margin-left: auto;
    border: none;
    background: transparent;
    color: var(--t3, #94a3b8);
    font-size: var(--fs-body);
    line-height: 1;
    cursor: pointer;
    padding: 2px 6px;
    border-radius: 6px;
  }
  .agent-activity-close:hover {
    background: var(--bg-2, #f1f5f9);
    color: var(--t1, #0f172a);
  }
  .agent-activity-degraded {
    font-size: var(--fs-micro);
    color: #FF7D00;
    background: rgba(255,125,0,.14);
    padding: 2px 8px;
    border-radius: 999px;
    font-weight: 600;
    white-space: nowrap;
  }
  .asset-stats {
    display: inline-flex;
    align-items: center;
    gap: 16px;
    white-space: nowrap;
    padding-left: 6px;
  }
  .asset-stat {
    display: inline-flex;
    align-items: baseline;
    gap: 4px;
    font-size: var(--fs-small);
    color: var(--t2);
  }
  .asset-stat i[data-lucide] {
    width: 13px;
    height: 13px;
    color: var(--t3);
    align-self: center;
  }
  .asset-stat b {
    color: var(--t1);
    font-weight: 700;
    font-size: var(--fs-body);
    font-variant-numeric: tabular-nums;
    line-height: 1;
  }
  .asset-stat em {
    font-style: normal;
    color: var(--t2);
  }
  @media (max-width: 1024px) {
    .asset-stats {
      display: none;
    }
  }
  .task-drawer.td-think .td-nav {
    display: none;
  }
  .td-agent-block {
    margin: 10px 0;
    padding: 10px 12px;
    background: var(--color-bg-muted, #f8fafc);
    border: 1px solid var(--color-border, #e2e8f0);
    border-radius: 10px;
  }
  .td-agent-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    margin-bottom: 4px;
  }
  .td-agent-name {
    font-weight: 600;
    font-size: var(--fs-body);
    color: var(--color-text, #0f172a);
  }
  .td-agent-role {
    font-weight: 400;
    font-size: var(--fs-nano);
    color: var(--color-text-muted, #64748b);
    margin-left: 4px;
  }
  .td-agent-meta {
    font-size: var(--fs-nano);
    color: var(--color-text-muted, #64748b);
    margin-bottom: 6px;
  }
  .td-think-ref {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 8px 10px;
    margin: 6px 0;
    background: var(--color-bg-muted, #f8fafc);
    border: 1px solid var(--color-border, #e2e8f0);
    border-radius: 8px;
    font-size: var(--fs-small);
    color: var(--color-text, #0f172a);
  }
  .td-think-ref:hover {
    border-color: var(--brand-text, #165DFF);
  }
  .think-status {
    display: inline-block;
    padding: 2px 8px;
    border-radius: 10px;
    font-size: var(--fs-nano);
    font-weight: 600;
    color: #fff;
  }
  .think-degraded-badge {
    display: inline-block;
    padding: 2px 8px;
    border-radius: 10px;
    font-size: var(--fs-nano);
    font-weight: 600;
    color: #fff;
    background: #F53F3F;
  }
  .free-analysis {
    display: block;
    width: 100%;
    font-size: var(--fs-nano);
    line-height: 1.3;
    color: var(--text-tertiary, #94a3b8);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    margin-top: 4px;
  }
  .free-analysis.analyzing {
    color: var(--text-tertiary, #94a3b8);
  }
  .free-analysis.err {
    color: var(--err, #F53F3F);
  }
  .focus-cat-row {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: 10px;
    padding: 8px 10px;
    background: var(--bg-2, #f5f6f8);
    border: 1px solid var(--line, #eef0f3);
    border-radius: var(--r-sm, 6px);
  }
  .focus-cat-row[hidden] {
    display: none;
  }
  .focus-cat-label {
    font-size: var(--fs-small);
    font-weight: 600;
    color: var(--t1, #1a1f2e);
  }
  .focus-cat-select {
    flex: 1;
    min-width: 0;
    padding: 4px 8px;
    font-size: var(--fs-small);
    color: var(--t1, #1a1f2e);
    background: var(--bg, #fff);
    border: 1px solid var(--line, #eef0f3);
    border-radius: var(--r-sm, 6px);
  }
  .focus-cat-hint {
    font-size: var(--fs-nano);
    color: var(--text-tertiary, #94a3b8);
    white-space: nowrap;
  }
  .act-thinking-log {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    padding: 8px 10px;
    border-radius: 8px;
    background: var(--bg-2, #f1f5f9);
    color: var(--t2, #334155);
    font-size: var(--fs-small);
    line-height: 1.45;
    margin-bottom: 6px;
  }
  .act-thinking-log-time {
    font-variant-numeric: tabular-nums;
    color: var(--t3, #94a3b8);
    font-size: var(--fs-micro);
    flex-shrink: 0;
  }
  .act-thinking-log-text {
    word-break: break-word;
  }
  [data-theme="dark"] .act-thinking-log {
    background: var(--bg-2, #1e293b);
    color: var(--t2, #cbd5e1);
  }
  .admin-body {
    background: var(--bg-0);
    padding: 22px 26px 36px;
  }
  .admin-panel {
    animation: adminPanelIn .26s var(--ease);
  }
  @keyframes adminPanelIn {
    from {
      opacity: 0;
      transform: translateY(6px);
    }
    to {
      opacity: 1;
      transform: none;
    }
  }
  @media (prefers-reduced-motion: reduce) {
    .admin-panel {
      animation: none;
    }
  }
  .admin-topbar {
    box-shadow: 0 1px 0 var(--line);
  }
  .sidebar {
    background: var(--bg-1);
    border-right: 1px solid var(--line);
  }
  .sidebar .admin-nav-label {
    font-size: var(--fs-micro);
    letter-spacing: .08em;
    color: var(--t3);
    padding: 16px 16px 6px;
  }
  .sidebar .sidebar-divider {
    height: 1px;
    background: var(--line);
    margin: 12px 16px;
  }
  .sidebar .admin-nav-item {
    margin: 0 10px 2px;
    width: auto;
    padding: 10px 12px;
    border-radius: var(--r-md);
    font-size: var(--fs-body);
    color: var(--t2);
  }
  .sidebar .admin-nav-item:hover {
    background: var(--bg-2);
    color: var(--brand-text);
  }
  .sidebar .admin-nav-item.active {
    background: rgba(22,93,255,.10);
    color: var(--brand-text);
    font-weight: 600;
  }
  .sidebar .admin-nav-item.active::before {
    background: var(--grad-brand);
    top: 6px;
    bottom: 6px;
    width: 3px;
    border-radius: 0 3px 3px 0;
  }
  .sidebar .admin-nav-icon {
    width: 18px;
    height: 18px;
    color: var(--brand-text);
  }
  .sidebar .admin-nav-item.active .admin-nav-icon {
    color: var(--brand-text);
  }
  .admin-body .admin-section-head {
    margin-bottom: 18px;
  }
  .admin-body .admin-section-head h2 {
    font-size: var(--fs-h1);
    font-weight: 700;
    color: var(--t1);
    display: flex;
    align-items: center;
    gap: 8px;
  }
  .admin-body .admin-section-head h2 i {
    color: var(--brand-text);
    width: 20px;
    height: 20px;
  }
  .admin-body .admin-section-head p {
    color: var(--t3);
    font-size: var(--fs-small);
    margin-top: 5px;
    line-height: 1.5;
  }
  .admin-body .admin-card {
    background: var(--bg-1);
    border: 1px solid var(--line);
    border-radius: var(--r-lg);
    box-shadow: var(--shadow-card);
    margin-bottom: 18px;
    overflow: hidden;
  }
  .admin-body .admin-card .admin-card-head {
    padding: 16px 20px;
    border-bottom: 1px solid var(--line);
    position: relative;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap:16px;
  }
  .admin-body .admin-card .admin-card-head::before {
    content: '';
    position: absolute;
    inset: 0 0 auto 0;
    height: 3px;
    background: var(--grad-brand);
    opacity: .85;
  }
  .admin-body .admin-card .admin-card-head h2, .admin-body .admin-card .admin-card-head h3 {
    font-size: var(--fs-h2);
    font-weight: 700;
    color: var(--t1);
    margin: 0;
    display: flex;
    align-items: center;
    gap: 8px;
  }
  .admin-body .admin-card .admin-card-head h2 i, .admin-body .admin-card .admin-card-head h3 i {
    color: var(--brand-text);
  }
  .admin-body .admin-card .admin-card-body {
    padding: 18px 20px;
  }
  .admin-body .admin-card .admin-actions {
    padding: 12px 20px;
    border-top: 1px solid var(--line);
    display: flex;
    align-items: center;
    gap: 12px;
    background: var(--bg-2);
  }
  .admin-body .admin-stats {
    gap:16px;
    margin-bottom: 18px;
  }
  .admin-body .users-stat-card {
    background: var(--bg-1);
    border: 1px solid var(--line);
    border-radius: var(--r-lg);
    padding: 16px 18px;
    box-shadow: var(--shadow-card);
    position: relative;
    overflow: hidden;
    transition: all .18s var(--ease);
  }
  .admin-body .users-stat-card::after {
    opacity: .5;
  }
  .admin-body .users-stat-card:hover {
    transform: translateY(-2px);
    box-shadow: var(--shadow-soft);
    border-color: var(--brand-text);
  }
  .admin-body .users-stat-icon {
    width: 42px;
    height: 42px;
    border-radius: 12px;
  }
  .admin-body .users-stat-value {
    font-size: var(--fs-display);
  }
  .admin-body .users-stat-label {
    color: var(--t3);
  }
  .admin-body .health-list {
    gap: 12px;
  }
  .admin-body .health-item {
    background: var(--bg-2);
    border: 1px solid var(--line);
    border-radius: var(--r-md);
    padding: 11px 14px;
  }
  .admin-body .health-item .health-name i {
    color: var(--brand-text);
  }
  .admin-body .health-dot {
    width: 12px;
    height: 12px;
  }
  .admin-body .health-dot.is-ok {
    box-shadow: 0 0 0 4px rgba(0,180,42,.18);
  }
  .admin-body .health-dot.is-warn {
    box-shadow: 0 0 0 4px rgba(245,158,11,.18);
  }
  .admin-body .health-dot.is-down {
    box-shadow: 0 0 0 4px rgba(245,63,63,.18);
  }
  .admin-body .activity-item {
    padding: 10px 12px;
    border-radius: var(--r-md);
  }
  .admin-body .activity-icon {
    border-radius: 9px;
  }
  .admin-body .quick-grid {
    gap: 12px;
  }
  .admin-body .quick-card {
    border-radius: var(--r-md);
  }
  .admin-body .quick-icon {
    border-radius: 10px;
  }
  .admin-body .model-grid {
    gap:16px;
  }
  .admin-body .model-pick {
    border-radius: var(--r-md);
  }
  .admin-body .users-table-card {
    background: var(--bg-1);
    border: 1px solid var(--line);
    border-radius: var(--r-lg);
    box-shadow: var(--shadow-card);
    overflow: hidden;
    margin-bottom: 18px;
  }
  .admin-body .users-table-toolbar {
    padding: 14px 18px;
    border-bottom: 1px solid var(--line);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
  }
  .admin-body .users-table-toolbar h3 {
    font-size: var(--fs-body);
    font-weight: 700;
    color: var(--t1);
    display: flex;
    align-items: center;
    gap: 8px;
  }
  .admin-body .users-table {
    font-size: var(--fs-body);
  }
  .admin-body .users-table th {
    background: var(--bg-2);
    color: var(--t2);
    font-weight: 600;
    text-align: left;
    padding: 11px 14px;
    border-bottom: 1px solid var(--line);
    white-space: nowrap;
  }
  .admin-body .users-table td {
    padding: 11px 14px;
    border-bottom: 1px solid var(--line);
    color: var(--t1);
    vertical-align: middle;
  }
  .admin-body .users-table tbody tr:last-child td {
    border-bottom: none;
  }
  .admin-body .users-table tbody tr:hover {
    background: rgba(22,93,255,.04);
  }
  .admin-body .users-btn {
    border-radius: 999px;
    padding: 6px 13px;
    font-size: var(--fs-small);
    font-weight: 500;
  }
  .admin-body .users-btn svg {
    width: 14px;
    height: 14px;
  }
  .admin-body .users-btn.primary {
    background: var(--brand);
    color: #fff;
    border: none;
    box-shadow: 0 4px 10px rgba(22,93,255,.28);
  }
  [data-theme="dark"] .admin-body .users-btn.primary { background: var(--grad-brand); color: #0E42D2; }
  .admin-body .users-btn.primary:hover {
    transform: translateY(-1px);
    box-shadow: 0 6px 14px rgba(22,93,255,.36);
  }
  .admin-body .users-btn.ghost {
    background: var(--bg-2);
    border: 1px solid var(--line);
    color: var(--t2);
  }
  .admin-body .users-btn.ghost:hover {
    background: var(--bg-3);
    color: var(--t1);
  }
  .admin-body .users-btn.danger {
    background: rgba(245,63,63,.08);
    color: var(--err);
    border: 1px solid rgba(245,63,63,.18);
  }
  .admin-body .users-btn.danger:hover {
    background: rgba(245,63,63,.14);
  }
  #opsLogTable table {
    width: 100%;
    border-collapse: collapse;
    font-size: var(--fs-small) !important;
  }
  #opsLogTable table th {
    text-align: left !important;
    padding: 11px 14px !important;
    background: var(--bg-2) !important;
    color: var(--t2) !important;
    font-weight: 600 !important;
    border-bottom: 1px solid var(--line) !important;
    white-space: nowrap;
  }
  #opsLogTable table td {
    padding: 10px 14px !important;
    border-bottom: 1px solid var(--line) !important;
    color: var(--t1) !important;
    vertical-align: middle;
  }
  #opsLogTable table tbody tr:last-child td {
    border-bottom: none !important;
  }
  #opsLogTable table tbody tr:hover td {
    background: rgba(22,93,255,.04) !important;
  }
  .admin-body .admin-select, .admin-body .admin-input, .admin-body .admin-num {
    width: 100%;
    padding: 8px 12px;
    font-size: var(--fs-body);
    color: var(--t1);
    background: var(--bg-1);
    border: 1px solid var(--line-strong);
    border-radius: var(--r-md);
    transition: border-color .15s var(--ease), box-shadow .15s var(--ease);
    font-family: inherit;
  }
  .admin-body .admin-select:focus, .admin-body .admin-input:focus, .admin-body .admin-num:focus {
    outline: none;
    border-color: var(--brand-text);
    box-shadow: 0 0 0 3px rgba(22,93,255,.15);
  }
  .admin-body .admin-select {
    cursor: pointer;
  }
  .admin-body .seg {
    display: inline-flex;
    background: var(--bg-2);
    border: 1px solid var(--line);
    border-radius: var(--r-md);
    padding: 3px;
    gap: 3px;
  }
  .admin-body .seg-btn {
    border: none;
    background: transparent;
    color: var(--t2);
    padding: 7px 14px;
    border-radius: var(--r-sm);
    cursor: pointer;
    font-size: var(--fs-body);
    font-weight: 500;
    transition: all .15s var(--ease);
  }
  .admin-body .seg-btn small {
    opacity: .7;
    font-weight: 400;
  }
  .admin-body .seg-btn:hover {
    background: var(--bg-1);
    color: var(--t1);
  }
  .admin-body .seg-btn.active {
    background: var(--grad-brand);
    color: #0E42D2;
    box-shadow: 0 2px 8px rgba(22,93,255,.3);
  }
  .admin-body .seg-btn.active small {
    opacity: .85;
  }
  .admin-body .kv {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 0;
    border-bottom: 1px solid var(--line);
    font-size: var(--fs-body);
  }
  .admin-body .kv:last-child {
    border-bottom: none;
  }
  .admin-body .kv > span {
    color: var(--t2);
  }
  .admin-body .kv > b {
    color: var(--t1);
    font-weight: 600;
  }
  .admin-body .kv > b.ok {
    color: var(--ok);
  }
  .admin-body .kv > b.warn {
    color: var(--warn);
  }
  .admin-body .billing-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px,1fr));
    gap:16px;
  }
  .admin-body .billing-field {
    display: flex;
    flex-direction: column;
    gap: 6px;
  }
  .admin-body .billing-field label {
    font-size: var(--fs-small);
    font-weight: 600;
    color: var(--t2);
  }
  .admin-body .billing-hint {
    font-size: var(--fs-small);
    color: var(--t3);
  }
  .admin-body .billing-preview {
    margin-top: 12px;
    padding: 12px 14px;
    background: var(--bg-2);
    border: 1px solid var(--line);
    border-radius: var(--r-md);
    font-size: var(--fs-small);
    color: var(--t2);
    line-height: 1.6;
  }
  .admin-body .usage-type-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px,1fr));
    gap:16px;
    margin-bottom: 18px;
  }
  .admin-body .usage-type-card {
    background: var(--bg-1);
    border: 1px solid var(--line);
    border-radius: var(--r-lg);
    box-shadow: var(--shadow-card);
    padding: 16px 18px;
    position: relative;
    overflow: hidden;
    transition: all .2s var(--ease);
  }
  .admin-body .usage-type-card::before {
    content: '';
    position: absolute;
    inset: 0 0 auto 0;
    height: 3px;
    background: var(--grad-brand);
    opacity: .6;
  }
  .admin-body .usage-type-card:hover {
    transform: translateY(-2px);
    box-shadow: var(--shadow-soft);
    border-color: var(--brand-text);
  }
  .admin-body .usage-type-card .type-icon {
    width: 40px;
    height: 40px;
    border-radius: 12px;
    background: var(--grad-brand);
    color: #0E42D2;
    display: grid;
    place-items: center;
    box-shadow: 0 4px 10px rgba(22,93,255,.22);
  }
  .admin-body .usage-type-card .type-name {
    font-size: var(--fs-body);
    font-weight: 700;
    color: var(--t1);
  }
  .admin-body .usage-type-card .type-cost {
    font-size: var(--fs-display);
    font-weight: 700;
    color: var(--t1);
  }
  .admin-body .usage-chart {
    background: var(--bg-1);
    border: 1px solid var(--line);
    border-radius: var(--r-lg);
    padding: 16px 20px;
    margin-bottom: 18px;
    box-shadow: var(--shadow-card);
  }
  .admin-body .usage-chart h4 {
    font-size: var(--fs-body);
    font-weight: 700;
    color: var(--t1);
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 0 0 12px;
  }
  .admin-body .usage-chart h4 i {
    color: var(--brand-text);
  }
  .admin-body .usage-bar-row {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 10px;
  }
  .admin-body .usage-bar-row .label {
    flex: 0 0 140px;
    font-size: var(--fs-small);
    color: var(--t2);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .admin-body .usage-bar-row .bar {
    flex: 1;
    height: 10px;
    background: var(--bg-2);
    border-radius: 999px;
    overflow: hidden;
  }
  .admin-body .usage-bar-row .bar-fill {
    height: 100%;
    background: var(--grad-brand);
    border-radius: 999px;
    transition: width .4s var(--ease);
  }
  .admin-body .usage-bar-row .value {
    flex: 0 0 auto;
    font-size: var(--fs-small);
    color: var(--t1);
    text-align: right;
    font-variant-numeric: tabular-nums;
  }
  .admin-body .usage-filters {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap:12px;
    margin-bottom: 14px;
  }
  .admin-body .usage-filters select, .admin-body .usage-filters input[type=date] {
    padding: 7px 12px;
    border: 1px solid var(--line-strong);
    border-radius: var(--r-md);
    font-size: var(--fs-small);
    color: var(--t1);
    background: var(--bg-1);
    font-family: inherit;
  }
  .admin-body .usage-filters select:focus, .admin-body .usage-filters input:focus {
    outline: none;
    border-color: var(--brand-text);
    box-shadow: 0 0 0 3px rgba(22,93,255,.15);
  }
  .admin-body .demo-filter-bar {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    gap: 12px;
    margin-bottom: 14px;
  }
  .admin-body .demo-filter-item {
    display: flex;
    flex-direction: column;
    gap: 4px;
  }
  .admin-body .demo-filter-item label {
    font-size: var(--fs-small);
    font-weight: 600;
    color: var(--t2);
  }
  .admin-body .demo-filter-item .admin-select, .admin-body .demo-filter-item .admin-input {
    width: auto;
    min-width: 140px;
  }
  .admin-body .demo-filter-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    align-items: center;
  }
  .admin-body .demo-filter-tag {
    font-size: var(--fs-small);
    padding: 4px 10px;
    border-radius: 999px;
    background: var(--bg-2);
    border: 1px solid var(--line);
    color: var(--t2);
    cursor: pointer;
    transition: all .15s var(--ease);
  }
  .admin-body .demo-filter-tag em {
    font-style: normal;
    color: var(--t3);
    font-size: var(--fs-nano);
  }
  .admin-body .demo-filter-tag.is-on {
    background: rgba(22,93,255,.12);
    border-color: var(--brand-text);
    color: var(--brand-text);
    font-weight: 600;
  }
  .admin-body .demo-filter-tag:hover {
    border-color: var(--brand-text);
  }
  .admin-body .btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    border-radius: var(--r-md);
    font-weight: 500;
    cursor: pointer;
    font-size: var(--fs-small);
    padding: 6px 12px;
    transition: all .15s var(--ease);
    font-family: inherit;
    border: 1px solid transparent;
  }
  .admin-body .btn svg {
    width: 14px;
    height: 14px;
  }
  .admin-body .btn.primary {
    background: var(--brand);
    color: #fff;
    box-shadow: 0 4px 10px rgba(22,93,255,.28);
  }
  [data-theme="dark"] .admin-body .btn.primary { background: var(--grad-brand); color: #0E42D2; }
  .admin-body .btn.primary:hover {
    transform: translateY(-1px);
    box-shadow: 0 6px 14px rgba(22,93,255,.36);
  }
  .admin-body .btn.primary.sm {
    padding: 4px 10px;
    font-size: var(--fs-small);
  }
  .admin-body .btn.ghost {
    background: var(--bg-2);
    border-color: var(--line);
    color: var(--t2);
  }
  .admin-body .btn.ghost:hover {
    background: var(--bg-3);
    color: var(--t1);
  }
  .admin-body .users-modal {
    border-radius: var(--r-xl);
    box-shadow: 0 24px 60px rgba(15,23,42,.18);
  }
  .admin-body .auth-field label {
    font-size: var(--fs-small);
    font-weight: 600;
    color: var(--t2);
  }
  .admin-body .auth-input {
    padding: 8px 12px;
    border: 1px solid var(--line-strong);
    border-radius: var(--r-md);
    font-size: var(--fs-body);
    color: var(--t1);
    background: var(--bg-1);
    font-family: inherit;
    transition: border-color .15s var(--ease), box-shadow .15s var(--ease);
  }
  .admin-body .auth-input:focus {
    outline: none;
    border-color: var(--brand-text);
    box-shadow: 0 0 0 3px rgba(22,93,255,.15);
  }
  .admin-body .users-modal-foot {
    padding: 14px 20px;
    border-top: 1px solid var(--line);
    display: flex;
    gap:12px;
    justify-content: flex-end;
  }
  .admin-body #dcModal > div {
    background: var(--bg-1) !important;
    border-radius: var(--r-xl) !important;
    box-shadow: 0 24px 60px rgba(15,23,42,.18) !important;
    padding: 20px !important;
    border: 1px solid var(--line) !important;
  }
  .admin-body #dcModal h3 {
    font-size: var(--fs-h2) !important;
    font-weight: 700;
    color: var(--t1);
    margin: 0 0 14px !important;
  }
  .admin-body #dcModal label {
    font-size: var(--fs-small) !important;
    color: var(--t2) !important;
    margin: 8px 0 4px !important;
    display: block;
  }
  .admin-body #dcModal input, .admin-body #dcModal textarea {
    padding: 8px 10px !important;
    border: 1px solid var(--line-strong) !important;
    border-radius: var(--r-md) !important;
    font-size: var(--fs-small) !important;
    color: var(--t1) !important;
    background: var(--bg-1) !important;
    font-family: inherit !important;
  }
  .admin-body #dcModal input:focus, .admin-body #dcModal textarea:focus {
    outline: none !important;
    border-color: var(--brand-text) !important;
    box-shadow: 0 0 0 3px rgba(22,93,255,.15) !important;
  }
  .admin-body #dcModal button {
    background: var(--bg-2);
    color: var(--t1);
    border: 1px solid var(--line);
  }
  .admin-body #dcModal #btnSaveDC {
    background: var(--grad-brand);
    color: #0E42D2;
    border: none;
    box-shadow: 0 4px 10px rgba(22,93,255,.28);
  }
  .admin-body #dcModal #btnSaveDC:hover {
    transform: translateY(-1px);
    box-shadow: 0 6px 14px rgba(22,93,255,.36);
  }
  .cluster-view {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-top: 12px;
  }
  .cluster-view[hidden] {
    display: none;
  }
  /* v61.68 同行等高：grid 拉伸行高时, 卡片撑满行高且内部为 flex 列,
     让描述区(caption)占满剩余空间 → 拉大某卡描述区, 同行其他卡描述区同步等高 */
  .cluster-card {
    border: 1px solid var(--line, #e2e8f0);
    border-radius: var(--r-sm, 10px);
    background: var(--bg-2, #f8fafc);
    padding: 12px 14px;
    min-width: 0;
    box-shadow: 0 1px 3px rgba(0,0,0,.04);
    transition: border-color .15s ease, box-shadow .15s ease;
    display: flex;
    flex-direction: column;
    height: 100%;
  }
  .cluster-card .cluster-caption {
    flex: 1 1 auto;
  }
  .cluster-card:hover { border-color: var(--brand-soft, #4080FF); box-shadow: 0 4px 10px rgba(22,93,255,.08); }
  /* v61.14 修复：主轴/轴值/标签文字显示不全 → 允许换行 + 完整展示 */
  .cluster-card-head .cluster-label { font-size: var(--fs-small); font-weight: 600; white-space: normal; overflow-wrap: anywhere; }
  .cluster-card-meta { grid-template-columns: 72px 1fr; }
  .cluster-dim, .cluster-axis { width: 100%; min-width: 0; font-size: var(--fs-small); }
  .cluster-axis { white-space: normal; overflow-wrap: anywhere; }
  /* v20.0.1 修复：cluster-card-meta / cluster-card-head 此前无样式 → 子元素垂直堆叠 */
  .cluster-card-head {
    display: flex;
    gap: 8px;
    align-items: center;
  }
  .cluster-card-head .cluster-label { flex: 1; min-width: 0; }
  .cluster-card-meta {
    display: grid;
    grid-template-columns: 1fr 2fr;
    gap: 8px;
    align-items: center;
  }
  .cluster-dim, .cluster-axis { width: 100%; min-width: 0; }
  .cluster-card-actions { gap: 6px; }
  .cluster-flag { display: flex; align-items: center; gap: 6px; }
  /* v20.0.64：簇描述文字缩小到与左侧步骤/元信息一致(--fs-small=12px·随--fs-scale等比缩放)，
     默认显示 5 行(min-height≈80px)，用户无需展开即可读完要点；仍可垂直拖动加高 */
  .cluster-caption { min-height: 80px; resize: vertical; font-size: var(--fs-small); line-height: 1.6; }
  .cluster-card.focus {
    border-color: var(--t1, #165DFF);
    box-shadow: 0 0 0 2px var(--t1, #165DFF);
    @supports (color: color-mix(in lab, red, red)) {
      box-shadow: 0 0 0 2px color-mix(in srgb, var(--t1, #165DFF) 18%, transparent);
    }
  }
  .cluster-type {
    font-weight: 600;
    font-size: var(--fs-small);
    color: var(--text, #0f172a);
    margin-bottom: 6px;
    display: flex;
    align-items: center;
    gap: 8px;
  }
  .cluster-type .cluster-count {
    font-weight: 500;
    font-size: var(--fs-small);
    color: var(--text-tertiary, #94a3b8);
  }
  .cluster-thumbs {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin: 8px 0;
  }
  .cluster-uploadbtn {
    display: inline-flex; align-items: center; gap: 5px;
    margin: 2px 0 6px; padding: 4px 10px;
    border: 1px dashed var(--line-strong); border-radius: 6px;
    color: var(--t2); font-size:12px; font-weight: 600; cursor: pointer;
    transition: .15s; user-select: none;
  }
  .cluster-uploadbtn:hover { border-color: var(--brand-soft); color: var(--brand-text); background: rgba(22,93,255,.05); }
  .cluster-thumb {
    width: 46px;
    height: 46px;
    object-fit: cover;
    border-radius: 6px;
    border: 2px solid var(--brand-soft, #4080FF);
    background: var(--bg-1, #fff);
    box-shadow: 0 1px 3px rgba(0,0,0,.06);
  }
  .cluster-summary {
    font-size: var(--fs-small);
    line-height: 1.55;
    color: var(--text, #0f172a);
    margin: 6px 0;
  }
  .cluster-features {
    list-style: none;
    margin: 6px 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 4px;
  }
  .cluster-features li {
    font-size: var(--fs-small);
    line-height: 1.5;
    color: var(--text-secondary, #475569);
    padding-left: 16px;
    position: relative;
  }
  .cluster-features li::before {
    content: "•";
    position: absolute;
    left: 4px;
    color: var(--t1, #165DFF);
  }
  .cluster-analyzing {
    font-size: var(--fs-small);
    color: var(--text-tertiary, #94a3b8);
    display: flex;
    align-items: center;
    gap: 6px;
  }
  .cluster-analyzing::before {
    content: "";
    width: 12px;
    height: 12px;
    border: 2px solid var(--text-tertiary, #94a3b8);
    border-top-color: transparent;
    border-radius: 50%;
    animation: cluster-spin .7s linear infinite;
  }
  @keyframes cluster-spin {
    to {
      transform: rotate(360deg);
    }
  }
  .cluster-err {
    font-size: var(--fs-small);
    color: var(--err, #F53F3F);
  }
  .admin-body {
    position: relative;
  }
  #panel-agents {
    display: none;
  }
  #panel-agents.active {
    display: block;
    position: absolute;
    inset: 0;
    z-index: 2;
  }
  #panel-agents .agents-embed {
    position: absolute;
    inset: 0;
  }
  #panel-agents iframe {
    width: 100%;
    height: 100%;
    border: 0;
    display: block;
    background: var(--bg-0);
  }
  @media (max-width: 1023px) {
    #panel-agents.active {
      position: relative;
      inset: auto;
      min-height: 78vh;
    }
    #panel-agents .agents-embed {
      position: relative;
      min-height: 78vh;
    }
  }
  @media (prefers-reduced-motion: reduce) {
    #panel-agents {
      animation: none;
    }
  }
  .agent-roster-think {
    display: flex;
    flex-direction: column;
    gap: 6px;
    padding: 8px 10px;
    margin: 2px 0 4px;
    border: 1px solid var(--line, #e2e8f0);
    border-radius: 8px;
    background: var(--bg-1, #fff);
    font-size: var(--fs-small);
    color: var(--t2, #334155);
    line-height: 1.55;
    max-height: none;
    overflow: visible;
    min-width: 0;
    max-width: 100%;
    transition: opacity .2s ease;
  }
  .agent-roster-think.collapsed {
    display: none;
  }
  .agent-roster-think.active {
    border-color: var(--brand-text, #165DFF);
    background: none;
  }
  .agent-roster-think.done {
    border-color: rgba(0,180,42,.3);
  }
  .agent-roster-think.error {
    border-color: rgba(245,63,63,.35);
  }
  .agent-roster-think-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    font-size: var(--fs-small);
  }
  .agent-roster-think-name {
    font-weight: 600;
    color: var(--t1, #0f172a);
  }
  .agent-roster-think-status {
    color: var(--t3, #94a3b8);
    font-size: var(--fs-nano);
  }
  .agent-roster-think-body {
    white-space: pre-wrap;
    word-break: break-word;
    overflow-wrap: anywhere;
    max-width: 100%;
    max-height: 110px;
    overflow-y: auto;
    overflow-x: hidden;
  }
  .agent-roster-think.active .agent-roster-think-body {
    max-height: 280px;
  }
  .agent-roster-think-head {
    cursor: pointer;
    user-select: none;
  }
  .agent-roster-think-toggle {
    margin-left: 4px;
    color: var(--t3, #94a3b8);
    transition: transform .15s ease;
    display: inline-block;
  }
  .agent-roster-think.body-collapsed .agent-roster-think-toggle {
    transform: rotate(-90deg);
  }
  .agent-roster-think.body-collapsed .agent-roster-think-body {
    display: none;
  }
  .agent-roster-think-error {
    color: #F53F3F;
  }
  [data-theme="dark"] .agent-roster-think {
    background: var(--bg-1, #0f172a);
    border-color: var(--line, #334155);
  }
  [data-theme="dark"] .agent-roster-think-name {
    color: var(--t1, #f1f5f9);
  }
  .act-thinking-log-wrap {
    display: flex;
    flex-direction: column;
    gap: 0;
    margin-top: 8px;
    flex: 1;
    min-height: 0;
    max-height: none;
    overflow-y: auto;
    padding-right: 2px;
  }
  .act-thinking-log-wrap:empty::before {
    content: "暂无操作记录";
    display: block;
    font-size: var(--fs-small);
    color: var(--t3, #94a3b8);
    padding: 24px 2px;
    text-align: center;
  }
  [data-theme="dark"] .act-thinking-log-wrap:empty::before {
    color: var(--t3, #64748b);
  }
  #mediaUploadSection, #structureNotesBox {
    background: var(--bg-1);
    border: 1px solid var(--line);
    border-radius: 0;
    box-shadow: none;
    padding: 16px 18px;
  }
  #pcDemoPanel, #pcProjectsPanel {
    background: transparent;
    border: none;
    border-radius: 0;
    box-shadow: none;
  }
  #mediaUploadSection {
    padding: 16px 18px;
  }
  #structureNotesBox {
    padding: 16px 18px;
    background: var(--bg-1);
    border-left: 1px solid var(--line);
    border-radius: 0;
    animation: none;
  }
  #structureNotesBox .structure-notes-head span:first-child {
    font-size: var(--fs-h3);
    font-weight: 600;
  }
  .pc-title {
    color: var(--t1);
  }
  [data-theme="dark"] #pcDemoPanel, [data-theme="dark"] #pcProjectsPanel {
    background: transparent;
    border-color: transparent;
  }
  [data-theme="dark"] #mediaUploadSection, [data-theme="dark"] #structureNotesBox {
    background: var(--bg-1);
    border-color: var(--line);
    border-left-color: var(--line);
  }
  .step0-cards {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
    align-items: stretch;
  }
  .step0-cards > .step0-meta-card, .step0-cards > .free-upload-section, .step0-cards > .product-cluster-merged, .step0-cards > .structure-notes {
    background: var(--bg-1);
    border: 1px solid var(--line);
    border-radius: 0;
    padding: 16px 18px;
    margin: 0;
    box-shadow: none;
  }
  .step0-cards > .structure-notes {
    border-left: 1px solid var(--line);
    animation: none;
    display: flex;
    flex-direction: column;
    max-height: none;
    overflow: visible;
  }
  .step0-cards > .structure-notes .structure-notes-body {
    flex: 1 1 auto;
    min-height: 0;
    max-height:none;
    overflow-y: visible;
  }
  .step0-cards > .free-upload-section {
    display: flex;
    flex-direction: column;
    gap: 12px;
    min-width: 0;
    align-self: start; /* v63.11.4：结构分析卡(右列)很高时，grid align-items:stretch 会把左列图片卡拉到同高→下方大片空白；改为图片卡按自身内容高度 */
  }
  .step0-cards > .free-upload-section .free-upload-head {
    margin-bottom: 0;
  }
  /* v64.1 产品设置 4 卡 → 左右 2 卡：产品形象(左) / 产品资料库(右) */
  .step0-cards > .step0-col {
    background: var(--bg-1);
    border: 1px solid var(--line);
    padding: 16px 18px;
    margin: 0;
    box-shadow: none;
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
  }
  .step0-col-title {
    display: flex;
    align-items: baseline;
    gap: 8px;
    font-weight: 600;
    color: var(--t1);
    padding-bottom: 8px;
    margin-bottom: 4px;
    border-bottom: 1px solid var(--line-subtle);
  }
  .step0-col-hint {
    font-weight: 400;
    font-size: var(--fs-small);
    color: var(--t3);
  }
  .step0-cards > .step0-col > .step0-meta-card,
  .step0-cards > .step0-col > .free-upload-section {
    background: transparent;
    border: none;
    border-radius: 0;
    box-shadow: none;
    padding: 12px 0;
    margin: 0;
  }
  .step0-cards > .step0-col > .free-upload-section {
    border-top: 1px solid var(--line-subtle);
    margin-top: 4px;
  }
  .step0-cards > .step0-col > .step0-meta-card:first-of-type {
    padding-top: 0;
  }
  @media (max-width: 1023px) {
    .step0-cards {
      grid-template-columns: 1fr;
    }
  }
  .step0-bottom {
    display: grid;
    grid-template-columns: 1fr;
    gap: 16px;
    margin-top: 16px;
    align-items: start;
  }
  .step0-bottom > .draft-cta {
    margin-top: 0;
  }
  .opt-card.soon {
    opacity: .55;
    cursor: not-allowed;
    filter: grayscale(.4);
  }
  .opt-card.soon:hover {
    border-color: var(--color-border, #ddd);
  }
  .opt-card .soon-badge {
    display: inline-block;
    margin-left: 6px;
    padding: 1px 6px;
    font-size:12px;
    line-height: 1.6;
    border-radius: 6px;
    background: var(--color-bg-muted,#eee);
    color: var(--color-text-muted,#888);
  }
  .ref-upload-row {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 8px 0;
  }
  .ref-upload-btn {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 6px 12px;
    border: 1px solid var(--color-border,#ddd);
    border-radius: 8px;
    background: var(--color-bg,#fff);
    color: var(--color-text,#333);
    font-size:14px;
    cursor: pointer;
  }
  .ref-upload-btn:hover {
    border-color: var(--color-primary,#4f7cff);
    color: var(--color-primary,#4f7cff);
  }
  .ref-pool-list {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-top: 8px;
  }
  .ref-empty {
    color: var(--color-text-muted,#999);
    font-size: 12px;
  }
  .ref-kind {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px;
  }
  .ref-kind-label {
    font-size: 12px;
    color: var(--color-text-muted,#888);
    margin-right: 4px;
  }
  .ref-item {
    position: relative;
    display: inline-flex;
  }
  .ref-thumb {
    width: 48px;
    height: 48px;
    object-fit: cover;
    border-radius: 6px;
    border: 1px solid var(--color-border,#eee);
  }
  .ref-file {
    display: inline-flex;
    align-items: center;
    padding: 4px 8px;
    max-width: 120px;
    font-size: 12px;
    background: var(--color-bg-muted,#f3f4f6);
    border-radius: 6px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .ref-del {
    position: absolute;
    top: -6px;
    right: -6px;
    width: 18px;
    height: 18px;
    line-height: 16px;
    text-align: center;
    border: none;
    border-radius: 50%;
    background: #e5484d;
    color: #fff;
    font-size: 12px;
    cursor: pointer;
    padding: 0;
  }
  .ref-smart-hint {
    display: block;
    margin-top: 8px;
    font-size: 12px;
    color: var(--color-primary,#4f7cff);
  }
  .opt-grid.smart-forced {
    opacity: .45;
    filter: grayscale(.5);
  }
  .agent-roster-think-body {
    max-height: 110px;
    overflow-y: auto;
    overflow-x: hidden;
  }
  /* v61.68 Agent 思考过程美化：键值卡 + 列表 chip + 折叠原文轻量化 */
  .think-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 6px;
    margin-top: 6px;
  }
  .think-row {
    display: grid;
    grid-template-columns: 76px 1fr;
    gap: 8px;
    align-items: baseline;
    padding: 6px 8px;
    background: var(--bg-1);
    border: 1px solid var(--line);
    border-radius: var(--r-xs);
    transition: border-color .15s ease;
  }
  .think-row:hover {
    border-color: var(--brand-soft, #4080FF);
  }
  .think-key {
    font-size: var(--fs-micro);
    font-weight: 600;
    color: var(--brand-text);
    letter-spacing: .02em;
    text-transform: none;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    align-self: start;
    padding-top: 1px;
  }
  .think-val {
    font-size: var(--fs-small);
    line-height: 1.55;
    color: var(--t1);
    min-width: 0;
    overflow-wrap: anywhere;
  }
  .think-str {
    white-space: pre-wrap;
    word-break: break-word;
    line-height: 1.55;
  }
  .think-list {
    margin: 2px 0;
    padding: 0;
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 3px;
  }
  .think-list li {
    position: relative;
    padding: 3px 0 3px 14px;
    font-size: var(--fs-small);
    color: var(--t2);
    line-height: 1.55;
  }
  .think-list li::before {
    content: '•';
    position: absolute;
    left: 2px;
    top: 3px;
    color: var(--brand-text);
    font-size: 14px;
    line-height: 1.4;
  }
  .think-pre {
    white-space: pre-wrap;
    background: var(--bg-2);
    padding: 6px 8px;
    border-radius: 6px;
    font-size: var(--fs-nano);
    max-height: 200px;
    overflow: auto;
    margin: 2px 0;
    color: var(--t2);
    border: 1px solid var(--line);
  }
  .think-narrative {
    white-space: pre-wrap;
    word-break: break-word;
    line-height: 1.6;
    color: var(--t2);
    font-size: var(--fs-small);
    padding: 6px 8px;
    background: var(--bg-1);
    border-left: 3px solid var(--brand-soft, #4080FF);
    border-radius: 0 var(--r-xs) var(--r-xs) 0;
  }
  .think-raw-details {
    margin-top: 6px;
    font-size: var(--fs-micro);
  }
  .think-raw-details > summary {
    cursor: pointer;
    color: var(--brand-text);
    user-select: none;
    list-style: none;
    padding: 2px 6px;
    border-radius: 999px;
    background: rgba(22,93,255,.06);
    display: inline-flex;
    align-items: center;
    gap: 4px;
    transition: background .15s ease;
  }
  .think-raw-details > summary::-webkit-details-marker { display: none; }
  .think-raw-details > summary::before {
    content: '›';
    font-size:12px;
    line-height: 1;
    transition: transform .15s ease;
  }
  .think-raw-details[open] > summary::before { transform: rotate(90deg); }
  .think-raw-details > summary:hover {
    background: rgba(22,93,255,.12);
  }
  .think-raw-pre {
    white-space: pre-wrap;
    word-break: break-word;
    max-height: 240px;
    overflow: auto;
    background: var(--bg-2);
    padding: 8px 10px;
    border-radius: var(--r-xs);
    margin-top: 4px;
    font-size: var(--fs-nano);
    color: var(--t2);
    border: 1px dashed var(--line);
    font-family: ui-monospace, 'SF Mono', Menlo, Consolas, monospace;
  }
  .think-row .think-val .think-pre { font-size: var(--fs-micro); }
  .think-row .think-val .think-raw-details { margin-top: 4px; }
  .think-text {
    font-size: var(--fs-small);
    color: var(--t2);
    line-height: 1.55;
  }
  .think-empty {
    font-size: var(--fs-small);
    color: var(--t3);
    font-style: italic;
    padding: 4px 0;
  }
  /* 暗色模式微调 */
  [data-theme="dark"] .think-row {
    background: rgba(255,255,255,.02);
  }
  [data-theme="dark"] .think-narrative {
    background: rgba(255,255,255,.02);
  }
  [data-theme="dark"] .think-raw-pre {
    background: rgba(255,255,255,.02);
  }
  .cluster-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap:12px;
    margin-bottom: 8px;
    padding: 10px 12px;
    background: var(--bg-1);
    border: 1px solid var(--line);
    border-radius: 0;
  }
  .cluster-purpose {
    font-size: var(--fs-small);
    color: var(--t2,#334155);
    line-height: 1.5;
  }
  .cluster-count {
    font-size: var(--fs-small);
    color: var(--brand-text,#165DFF);
    font-weight: 600;
    white-space: nowrap;
    background: rgba(22,93,255,.08);
    padding: 2px 8px;
    border-radius: 999px;
  }
  .cluster-flow {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: var(--fs-xs,11px);
    color: var(--t3,#94a3b8);
    margin-bottom: 12px;
    padding: 0 4px;
  }
  .cf-step {
    padding: 2px 8px;
    border-radius: 4px;
    background: transparent;
  }
  .cf-step.cf-active {
    font-weight: 600;
    color: var(--t1,#1e293b);
    background: rgba(22,93,255,.08);
  }
  .cf-arrow {
    opacity: .5;
  }
  .flag-text {
    font-size: var(--fs-xs,11px);
    color: var(--t3,#94a3b8);
  }
  .cluster-card-actions .btn.outline {
    border-color: var(--line);
    color: var(--t2);
  }
  .cluster-card-actions .btn.outline:hover {
    border-color: var(--brand-text);
    color: var(--brand-text);
  }
  .cluster-header {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 6px;
  }
  .cluster-purpose {
    font-size: var(--fs-small);
    color: var(--t2,#334155);
    line-height: 1.6;
  }
  .cluster-stat {
    font-size: var(--fs-xs,11px);
    color: var(--t3,#94a3b8);
  }
  .cluster-stat .cp-ok {
    color: var(--brand-text,#165DFF);
    font-weight: 700;
  }
  .cluster-stat .cp-warn {
    color: #FF7D00;
    font-weight: 700;
  }
  /* v61.67 参考模式关闭引导条：分类簇头部醒目提示+开关（避免沉到分类簇底部才看到） */
  .cp-refoff {
    display: flex;
    align-items: center;
    gap:12px;
    flex-wrap: wrap;
    margin: 6px 0;
    padding: 10px 14px;
    background: rgba(22,93,255,.06);
    border: 1px solid rgba(22,93,255,.25);
    border-radius: 8px;
    color: var(--t2, #475569);
    font-size:14px;
  }
  .cp-refoff b { color: var(--brand-text, #165DFF); }
  .cp-refoff .btn { margin-left: auto; }
  .cf-step.cf-done {
    color: var(--brand-text,#165DFF);
    background: transparent;
  }
  .cluster-card.is-focus {
    border-color: var(--brand-text,#165DFF);
    box-shadow: inset 3px 0 0 var(--brand,#165DFF);
  }
  .cluster-card.is-off {
    background: var(--bg-1,#fff);
    border-style: dashed;
    border-color: var(--line,#e2e8f0);
    opacity: 1;
  }
  .cluster-focus-badge {
    flex: none;
    font-size: var(--fs-xs,11px);
    font-weight: 700;
    color: var(--brand-text,#165DFF);
    border: 1px solid var(--brand,#165DFF);
    padding: 1px 6px;
    white-space: nowrap;
  }
  .cluster-flag {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-top: 8px;
    cursor: pointer;
    user-select: none;
  }
  .cluster-flag input[type=checkbox] {
    accent-color: var(--brand-text,#165DFF);
    flex: none;
    margin: 0;
  }
  .cluster-flag input[type=checkbox]:disabled {
    cursor: not-allowed;
  }
  .cluster-card.is-off .flag-text {
    color: var(--t3,#94a3b8);
  }
  .cluster-card.is-off .cluster-noimg {
    color: var(--t3,#94a3b8);
  }
  .cluster-actions {
    margin-top: 12px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
    width: 100%;
    padding: 10px 12px;
    background: var(--bg-1);
    border: 1px solid var(--line);
  }
  .cluster-next-tip {
    font-size: var(--fs-xs,11px);
    color: var(--t2,#334155);
    line-height: 1.6;
  }
  .cluster-next-btns {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
  }
  .cluster-empty {
    color: var(--t3,#94a3b8);
    font-size: var(--fs-small);
    padding: 10px 12px;
    border: 1px dashed var(--line);
    line-height: 1.7;
  }
  .cluster-empty-sub {
    margin-top: 4px;
    font-size: var(--fs-xs,11px);
  }

  /* ===== 分类簇面板外壳 · 科技清爽 vA ===== */
  .cluster-panel-body {
    display: flex; flex-direction: column; gap: 12px;
    padding: 14px 16px; background: var(--bg-1);
    border: 1px solid var(--line); border-radius: var(--r-md, 10px);
    box-shadow: var(--shadow-xs);
  }
  .cluster-guide-top {
    margin-bottom: 4px; padding: 12px 14px;
    background: var(--brand-bg-soft); border: 1px solid var(--line-subtle);
    border-radius: var(--r-sm, 8px);
  }
  .cluster-guide-bottom {
    margin-top: 8px; padding-top: 6px; border-top: 1px solid var(--line-subtle);
  }
  .cluster-suggest {
    display: flex; flex-wrap: wrap; align-items: center; gap: 8px;
    padding: 10px 12px; background: var(--bg-2);
    border: 1px dashed var(--line-strong); border-radius: var(--r-sm, 8px);
    font-size: var(--fs-small); color: var(--t2);
  }
  .cluster-suggest b { color: var(--brand-text); font-weight: 600; }
  .part-card-btn { flex: none; }
  .part-card-btn:hover { border-color: var(--brand-text); color: var(--brand-text); }
  .part-gen-btn { flex: none; }
  [data-theme="dark"] .cluster-guide-top { background: rgba(56,189,248,.10); border-color: var(--line-subtle); }
  [data-theme="dark"] .cluster-suggest { background: var(--bg-2); border-color: var(--line-strong); }
  .sb-head {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    margin-bottom: 8px;
    padding-bottom: 8px;
    border-bottom: 1px solid var(--line);
  }
  .sb-tc {
    font-family: ui-monospace,SFMono-Regular,Menlo,monospace;
    font-size: var(--fs-small);
    font-weight: 700;
    color: var(--brand-text);
    letter-spacing: .02em;
    background: var(--bg-3);
    border: 1px solid var(--line);
    padding: 2px 7px;
  }
  .sb-no {
    font-size: var(--fs-xs,11px);
    font-weight: 700;
    color: var(--t1);
  }
  .sb-dur {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    font-size: var(--fs-xs,11px);
    color: var(--t2);
  }
  .sb-dur i {
    font-style: normal;
  }
  .sb-dur-input {
    width: 46px;
    padding: 2px 4px;
    font-size: var(--fs-xs,11px);
    text-align: center;
    border: 1px solid var(--line);
    background: var(--bg-0,#fff);
    color: var(--t1);
    font-family: inherit;
  }
  .sb-dur-input:focus {
    outline: none;
    border-color: var(--brand-text);
  }
  .sb-st {
    margin-left: auto;
    font-size: var(--fs-xs,11px);
    color: var(--t2);
  }
  .sb-st.done {
    color: var(--ok,#00B42A);
  }
  .sb-st.error {
    color: var(--err,#F53F3F);
  }
  .sb-st.loading {
    color: var(--brand-text);
  }
  /* v20.0.3 首尾帧图片加载失败占位 */
  .storyboard-img-wrap {
    position: relative;
    width: 100%;
    height: 100%;
  }
  .storyboard-ph-empty {
    color: var(--t3, #94a3b8);
    font-size:12px;
  }
  .storyboard-ph-err {
    position: absolute;
    inset: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 6px;
    background: var(--bg-1, #f8fafc);
    border: 1px dashed var(--warn, #FF7D00);
    border-radius: var(--r-xs, 4px);
    color: var(--warn, #FF7D00);
    font-size:12px;
    text-align: center;
    padding: 8px;
  }
  .storyboard-ph-err i {
    width: 24px;
    height: 24px;
  }
  .storyboard-ph-err .frame-retry-btn {
    margin-top: 4px;
  }
  .sb-row {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    margin-bottom: 6px;
  }
  .sb-row-3 {
    flex-wrap: wrap;
  }
  .sb-lb {
    flex: 0 0 auto;
    min-width: 28px;
    padding-top: 1px;
    font-size: var(--fs-xs,11px);
    font-weight: 600;
    color: var(--t3,#94a3b8);
    line-height: 1.7;
  }
  .sb-fval {
    flex: 1 1 auto;
    min-width: 0;
    padding: 2px 5px;
    margin: -2px -5px;
    font-size: var(--fs-small);
    line-height: 1.7;
    color: var(--t1);
    border: 1px solid transparent;
    white-space: pre-wrap;
    word-break: break-word;
    cursor: text;
    transition: border-color .15s ease,background .15s ease;
  }
  .sb-fval:hover {
    border-color: var(--line);
    background: var(--bg-3);
  }
  .sb-fval:focus {
    outline: none;
    border-color: var(--brand-text);
    background: var(--bg-0,#fff);
  }
  .sb-fval:empty::before {
    content: attr(data-ph);
    color: var(--t3,#94a3b8);
    font-style: italic;
  }
  .sb-row-3 .sb-fval {
    flex: 1 1 88px;
  }
  .top-item {
    position: relative;
  }
  .lib-btn.open {
    color: var(--t1);
    background: var(--bg-2);
    border-color: var(--line);
  }
  .top-dropdown {
    position: absolute;
    top: calc(100% + 8px);
    right: 0;
    z-index: 90;
    width: 320px;
    max-height: 72vh;
    overflow: auto;
    background: var(--bg-1, #fff);
    color: var(--t1);
    border: 1px solid var(--line, #e3e3e8);
    border-radius: 10px;
    box-shadow: 0 10px 30px rgba(0,0,0,.12);
    padding: 10px;
  }
  .top-dropdown[hidden] {
    display: none;
  }
  /* v68.2 顶部下拉遮罩: 打开项目/资产面板时压暗主内容, 避免大面板杂乱盖住页面 */
  .dd-backdrop { position: fixed; inset: 0; z-index: 89; background: rgba(10,20,35,.35); backdrop-filter: blur(2px); }
  .td-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 8px;
    flex-wrap: nowrap;
  }
  .td-title {
    font-size:14px;
    font-weight: 600;
    color: var(--t1);
    white-space: nowrap;
    flex: 1;
    min-width: 0;
  }
  .td-new {
    border: 1px solid var(--line);
    background: var(--bg-2);
    border-radius: 6px;
    padding: 3px 8px;
    font-size: 12px;
    cursor: pointer;
    color: var(--t1);
  }
  .td-new:hover {
    background: var(--t1);
    color: #fff;
    border-color: var(--t1);
  }
  .td-list {
    display: flex;
    flex-direction: column;
    gap: 4px;
  }
  .td-item {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 7px 8px;
    border: 1px solid transparent;
    border-radius: 7px;
    cursor: pointer;
    background: var(--bg-2, #f6f7f9);
  }
  .td-item:hover {
    border-color: var(--line);
  }
  .td-item.active {
    border-color: var(--t1);
    background: var(--t1);
    @supports (color: color-mix(in lab, red, red)) {
      background: color-mix(in srgb, var(--t1) 8%, var(--bg-1, #fff));
    }
  }
  .td-item-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--t1);
    flex: none;
  }
  .td-item-name {
    flex: 1;
    font-size:14px;
    color: var(--t1);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .td-item-actions {
    display: flex;
    gap: 4px;
  }
  .td-item-actions button {
    border: 1px solid var(--line);
    background: var(--bg-1);
    border-radius: 5px;
    width: 24px;
    height: 24px;
    cursor: pointer;
    color: var(--t2);
    font-size: 12px;
    line-height: 1;
  }
  .td-item-actions button:hover {
    color: var(--t1);
    border-color: var(--t1);
  }
  /* v19.0.29 Bug K 修复：viewer 看不到「+ 新建」/重命名/删除按钮（不仅 disabled，要完全隐藏） */
  .td-head .perm-denied { display: none !important; }
  .td-item-actions .perm-denied { display: none !important; }
  .td-empty {
    font-size: 12px;
    color: var(--t2);
    padding: 12px 4px;
    text-align: center;
  }
  .td-filter {
    border: 1px solid var(--line);
    border-radius: 6px;
    padding: 3px 6px;
    font-size: 12px;
    color: var(--t1);
    background: var(--bg-1);
  }
  .td-asset-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
  }
  /* v61.09 资产卡：稍宽一点，容纳名称 + meta + 时长角标 */
  .td-asset {
    border: 1px solid var(--line);
    border-radius: 8px;
    overflow: hidden;
    background: var(--bg-2);
    display: flex;
    flex-direction: column;
    transition: border-color .15s ease, box-shadow .15s ease;
  }
  .td-asset:hover { border-color: var(--accent, #165DFF); box-shadow: 0 2px 6px rgba(22,93,255,.12); }
  .td-asset-thumb {
    position: relative;
    aspect-ratio: 4/3;          /* v61.09: 16:9→4:3，给视频缩略图多一点垂直空间 */
    background: rgba(0,0,0,.04);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  .td-asset-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
  }
  /* v61.09 类型徽标：左上方，区分视频/图片/音频 */
  .td-asset-badge {
    position: absolute;
    left: 4px;
    top: 4px;
    z-index: 2;
    font-size:12px;
    padding: 1px 6px;
    background: rgba(15,23,42,.78);
    color: #fff;
    border-radius: 4px;
    backdrop-filter: blur(2px);
  }
  /* v61.09 时长角标：右下方（仅视频） */
  .td-asset-duration {
    position: absolute;
    right: 4px;
    bottom: 4px;
    z-index: 2;
    font-size:12px;
    padding: 1px 5px;
    background: rgba(0,0,0,.72);
    color: #fff;
    border-radius: 3px;
    font-variant-numeric: tabular-nums;
  }
  .td-asset-name {
    font-size:12px;
    padding: 4px 6px 1px;
    color: var(--t1);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-weight: 500;
  }
  /* v61.09 meta 行：类型·大小·日期（小灰字） */
  .td-asset-meta {
    font-size:12px;
    color: var(--t3, #94a3b8);
    padding: 0 6px 5px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  /* v61.09 操作区：主操作（蓝填充）+ 删除（小图标按钮），紧凑 */
  .td-asset-actions {
    display: flex;
    gap: 4px;
    padding: 4px 6px 6px;
    align-items: stretch;
  }
  .td-asset-actions button {
    flex: 1;
    border: 1px solid var(--line);
    background: var(--bg-1);
    border-radius: 5px;
    font-size:12px;
    padding: 4px 0;
    cursor: pointer;
    color: var(--t1);
    transition: border-color .12s ease;
  }
  .td-asset-actions button:hover {
    border-color: var(--accent, #165DFF);
    color: var(--accent, #165DFF);
  }
  .td-asset-actions button.primary {
    background: var(--accent, #165DFF);
    color: #fff;
    border-color: var(--accent, #165DFF);
  }
  .td-asset-actions button.primary:hover { opacity: .92; color: #fff; }
  /* 删除按钮：占右侧小区域，只显示图标 */
  .td-asset-actions .td-asset-del {
    flex: 0 0 26px;
    padding: 4px 0;
    color: var(--t3, #94a3b8);
    border-color: transparent;
    background: transparent;
  }
  .td-asset-actions .td-asset-del:hover { color: #F53F3F; border-color: #F53F3F; background: transparent; }
  .td-goto {
    display: block;
    width: 100%;
    text-align: center;
    border: 1px solid var(--line);
    border-radius: 7px;
    padding: 6px 0;
    margin-top: 8px;
    font-size: 12px;
    color: var(--t2);
    background: var(--bg-2);
    cursor: pointer;
    text-decoration: none;
  }
  .td-goto:hover {
    color: var(--t1);
    border-color: var(--t1);
  }
  .cluster-part-gen-row {
    margin-top: 8px;
  }
  .part-gen-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    width: 100%;
    box-sizing: border-box;
    border: 1px solid var(--line, #cbd5e1);
    border-radius: 0;
    background: var(--bg-2, #f1f5f9);
    color: var(--t1, #0f172a);
    font-size: 12px;
    padding: 6px 10px;
    cursor: pointer;
  }
  .part-gen-btn:hover {
    border-color: var(--t1, #0f172a);
  }
  .part-gen-btn:disabled {
    cursor: not-allowed;
    opacity: .65;
  }
  .part-gen-running {
    color: var(--t2, #334155);
    background: var(--bg-2, #f8fafc);
  }
  .part-gen-ok {
    border-color: #00B42A;
    color: #00B42A;
    background: #f0fdf4;
  }
  .part-gen-fail {
    border-color: #F53F3F;
    color: #F53F3F;
    background: #fef2f2;
  }
  .part-filter-row {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    margin: 8px 0;
  }
  .part-filter-label {
    font-size: 12px;
    color: var(--t2, #334155);
    flex: none;
  }
  .part-filter-chips {
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
  }
  .part-chip {
    border: 1px solid var(--line, #cbd5e1);
    border-radius: 0;
    background: var(--bg-1, #fff);
    color: var(--t2, #334155);
    font-size: 12px;
    padding: 3px 10px;
    cursor: pointer;
  }
  .part-chip:hover {
    border-color: var(--t1, #0f172a);
  }
  .part-chip.active {
    border-color: var(--t1, #0f172a);
    background: var(--t1, #0f172a);
    color: #fff;
  }
  .media-card-part {
    position: absolute;
    right: 4px;
    top: 4px;
    z-index: 2;
    font-size:12px;
    line-height: 1;
    padding: 2px 6px;
    border: 1px solid #0f172a;
    border-radius: 0;
    background: rgba(15, 23, 42, .82);
    color: #fff;
  }
  #creationPartSelect {
    max-width: 280px;
  }
  .part-entry-bar {
    border: 1px solid var(--line, #cbd5e1);
    border-radius: 0;
    background: var(--bg-2, #f8fafc);
    padding: 8px 10px;
    margin: 0 0 10px;
  }
  .part-entry-tip {
    font-size: 12px;
    line-height: 1.5;
    color: var(--t2, #334155);
    margin-bottom: 6px;
  }
  .part-entry-ctl {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
  }
  .part-entry-select {
    border: 1px solid var(--line, #cbd5e1);
    border-radius: 0;
    background: var(--bg-1, #fff);
    color: var(--t1, #0f172a);
    font-size: 12px;
    padding: 5px 8px;
    min-width: 120px;
    max-width: 200px;
    cursor: pointer;
  }
  .part-entry-select:hover {
    border-color: var(--t1, #0f172a);
  }
  .part-entry-bar .part-gen-btn {
    width: auto;
    flex: none;
    background: var(--bg-1, #fff);
  }
  .part-entry-bar .part-gen-btn:hover {
    background: var(--bg-2, #f1f5f9);
  }
  .mv-timer {
    position: absolute;
    left: 50%;
    bottom: 10px;
    transform: translateX(-50%);
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 5px 10px;
    background: rgba(15, 23, 42, 0.85);
    color: #fff;
    border-radius: 999px;
    font-size: var(--fs-nano, 11px);
    font-weight: 500;
    letter-spacing: 0.02em;
    pointer-events: auto;
    z-index: 5;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.25);
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
    white-space: nowrap;
    max-width: calc(100% - 24px);
    animation: mvTimerIn 0.2s ease-out;
  }
  @keyframes mvTimerIn {
    from {
      opacity: 0;
      transform: translate(-50%, 4px);
    }
    to {
      opacity: 1;
      transform: translate(-50%, 0);
    }
  }
  .mv-timer i[data-lucide] {
    width: 13px;
    height: 13px;
    flex: 0 0 auto;
    opacity: 0.85;
  }
  .mv-timer .mv-timer-text {
    font-variant-numeric: tabular-nums;
    font-feature-settings: "tnum";
    font-size:12px;
    line-height: 1;
  }
  .mv-timer .mv-cancel {
    appearance: none;
    -webkit-appearance: none;
    border: 0;
    padding: 0;
    width: 18px;
    height: 18px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.12);
    color: #fff;
    cursor: pointer;
    margin-left: 2px;
    flex: 0 0 auto;
    transition: 0.15s;
  }
  .mv-timer .mv-cancel:hover {
    background: rgba(255, 255, 255, 0.28);
    transform: scale(1.08);
  }
  .mv-timer .mv-cancel i[data-lucide] {
    width: 12px;
    height: 12px;
  }
  .mv-timer .mv-cancel:disabled {
    opacity: 0.4;
    cursor: not-allowed;
  }
  .mv-timer.is-done {
    background: rgba(22, 163, 74, 0.92);
    color: #fff;
    animation: mvTimerPulse 0.3s ease-out;
  }
  .mv-timer.is-err {
    background: rgba(220, 38, 38, 0.92);
    color: #fff;
    animation: mvTimerPulse 0.3s ease-out;
  }
  .mv-timer.is-cancel {
    background: rgba(71, 85, 105, 0.85);
    color: #fff;
  }
  @keyframes mvTimerPulse {
    0% {
      transform: translate(-50%, 0) scale(1);
    }
    50% {
      transform: translate(-50%, 0) scale(1.05);
    }
    100% {
      transform: translate(-50%, 0) scale(1);
    }
  }
  .mv-cell.filled .mv-timer {
    background: rgba(15, 23, 42, 0.78);
  }
  .mv-cell:not(.filled) .mv-timer {
    bottom: 14px;
  }
  .mv-timer.hidden {
    display: none;
  }
  .mv-progress {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin: 10px 0 8px;
    padding: 8px 12px;
    border: 1px solid var(--line-strong, rgba(15, 23, 42, 0.12));
    border-left: 3px solid var(--brand, #165DFF);
    border-radius: var(--r-sm, 6px);
    background: var(--bg-1, #f8fafc);
    font-size: var(--fs-small, 13px);
    color: var(--t2, #334155);
    animation: mvProgressIn 0.2s ease-out;
  }
  @keyframes mvProgressIn {
    from {
      opacity: 0;
      transform: translateY(-4px);
    }
    to {
      opacity: 1;
      transform: translateY(0);
    }
  }
  .mv-progress.is-done {
    border-left-color: #00B42A;
    opacity: 0.85;
  }
  .mv-progress.is-error {
    border-left-color: #F53F3F;
    opacity: 0.9;
  }
  .mv-progress.is-cancel {
    border-left-color: #64748b;
    opacity: 0.9;
  }
  .mv-progress.is-done .mv-progress-text, .mv-progress.is-error .mv-progress-text, .mv-progress.is-cancel .mv-progress-text {
    color: var(--t2);
  }
  .mv-progress.hidden {
    display: none;
  }
  .mv-progress-text {
    font-variant-numeric: tabular-nums;
    font-feature-settings: "tnum";
    flex: 1 1 auto;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  .mv-progress-cancel {
    appearance: none;
    -webkit-appearance: none;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    flex: 0 0 auto;
    padding: 4px 10px;
    font-size: 12px;
    line-height: 1.2;
    border: 1px solid var(--line-strong, rgba(15, 23, 42, 0.18));
    border-radius: var(--r-sm, 6px);
    background: var(--bg-2, #fff);
    color: var(--t2, #334155);
    cursor: pointer;
    transition: 0.15s;
    font-family: inherit;
  }
  .mv-progress-cancel:hover {
    background: rgba(220, 38, 38, 0.08);
    border-color: #F53F3F;
    color: #F53F3F;
  }
  .mv-progress-cancel:disabled {
    opacity: 0.5;
    cursor: not-allowed;
  }
  .mv-progress-cancel i[data-lucide] {
    width: 12px;
    height: 12px;
  }
  .multiview-grid.mode-14 .mv-timer {
    font-size:12px;
    padding: 4px 8px;
  }
  .multiview-grid.mode-14 .mv-timer .mv-timer-text {
    font-size:12px;
  }
  .sb-frame-timer {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: var(--fs-micro, 11px);
    font-weight: 700;
    color: #FF7D00;
    background: #fef3c7;
    border-radius: 6px;
    padding: 3px 8px;
    margin-bottom: 6px;
  }
  .sb-frame-timer::before {
    content: '';
    width: 9px;
    height: 9px;
    border-radius: 50%;
    border: 2px solid currentColor;
    border-top-color: transparent;
    animation: spin 0.8s linear infinite;
  }
  .frame-img {
    cursor: pointer;
  }
  .frame-up-btn {
    margin-left: 6px;
  }
  .parts-mgr-hint {
    font-size: 12px;
    color: var(--t3, #94a3b8);
    margin-bottom: 10px;
  }
  .parts-mgr-list {
    display: flex;
    flex-direction: column;
    gap: 6px;
    max-height: 360px;
    overflow-y: auto;
    padding: 4px 2px;
    border: 1px solid var(--line, #e2e8f0);
    border-radius: 8px;
    background: var(--bg-2, #f8fafc);
  }
  .parts-mgr-row {
    display: flex;
    align-items: center;
    gap:12px;
    padding: 8px 10px;
    border-radius: 6px;
    background: var(--bg-1, #fff);
    border: 1px solid var(--line, #e2e8f0);
  }
  .parts-mgr-row.builtin {
    opacity: 0.78;
  }
  .parts-mgr-row.custom {
    border-color: var(--brand-text, #165DFF);
  }
  .parts-mgr-name {
    flex: 1;
    font-size: 14px;
    color: var(--t1, #0f172a);
  }
  .parts-mgr-meta {
    font-size:12px;
    color: var(--t3, #94a3b8);
    font-style: normal;
    background: var(--bg-2, #f1f5f9);
    padding: 2px 8px;
    border-radius: 999px;
  }
  .parts-mgr-row.custom .parts-mgr-meta {
    color: var(--brand-text, #165DFF);
    background: rgba(22,93,255,.1);
  }
  .parts-mgr-del {
    width: 28px;
    height: 28px;
    border-radius: 6px;
    border: 1px solid var(--line, #e2e8f0);
    background: transparent;
    color: var(--t3, #94a3b8);
    cursor: pointer;
    display: grid;
    place-items: center;
  }
  .parts-mgr-del:hover {
    background: #fee2e2;
    color: #F53F3F;
    border-color: #fecaca;
  }
  .parts-mgr-empty {
    padding: 24px 20px;
    text-align: center;
    color: var(--t3, #94a3b8);
    font-size:14px;
    background: rgba(22,93,255,0.04);
    border-radius: 8px;
    border: 1px dashed var(--border, #e5e7eb);
  }
  .parts-mgr-empty-inner {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
  }
  .parts-mgr-empty-icon {
    width: 32px;
    height: 32px;
    color: var(--accent, #165DFF);
    opacity: 0.6;
  }
  .parts-mgr-empty-title {
    font-size: 14px;
    font-weight: 600;
    color: var(--t2, #475569);
  }
  .parts-mgr-empty-hint {
    font-size: 12px;
    color: var(--t3, #94a3b8);
    line-height: 1.6;
    max-width: 320px;
  }
  .parts-mgr-add {
    display: flex;
    gap: 8px;
    margin-top: 10px;
  }
  .parts-mgr-add input {
    flex: 1;
    padding: 7px 10px;
    font-size:14px;
    border: 1px solid var(--line, #e2e8f0);
    border-radius: 6px;
    background: var(--bg-1, #fff);
    color: var(--t1, #0f172a);
  }
  .pc-panel.pc-flash {
    animation: pcFlash 1.2s ease;
  }
  @keyframes pcFlash {
    0% {
      box-shadow: 0 0 0 3px var(--brand, #165DFF);
    }
    100% {
      box-shadow: 0 0 0 0 transparent;
    }
  }
  .users-avatar.admin {
    background: linear-gradient(135deg, #b18a8a, #977070);
    box-shadow: none;
  }
  .users-avatar.creator {
    background: linear-gradient(135deg, #8a9bb5, #7289a6);
    box-shadow: none;
  }
  .users-avatar.viewer {
    background: linear-gradient(135deg, #9aa3ad, #828b95);
    box-shadow: none;
  }
  .role-card[data-role="r_admin"]::before {
    background: linear-gradient(90deg, #c19a9a, #a97e7e);
  }
  .role-card[data-role="r_creator"]::before {
    background: linear-gradient(90deg, #9db0cc, #7f95b3);
  }
  .role-card[data-role="r_viewer"]::before {
    background: linear-gradient(90deg, #aab3bd, #8f98a2);
  }
  .role-card[data-role="r_admin"] .role-card-icon {
    background: linear-gradient(135deg, #b18a8a, #977070);
    box-shadow: none;
  }
  .role-card[data-role="r_creator"] .role-card-icon {
    background: linear-gradient(135deg, #8a9bb5, #7289a6);
    box-shadow: none;
  }
  .role-card[data-role="r_viewer"] .role-card-icon {
    background: linear-gradient(135deg, #9aa3ad, #828b95);
    box-shadow: none;
  }
  .users-stat-icon {
    box-shadow: none;
  }
  .users-stat-icon.warn {
    background: linear-gradient(135deg, #c4a06e, #ad8b57);
    box-shadow: none;
  }
  .users-stat-icon.ok {
    background: linear-gradient(135deg, #7fae97, #68917e);
    box-shadow: none;
  }
  .users-stat-icon.muted {
    background: linear-gradient(135deg, #9aa3ad, #828b95);
    box-shadow: none;
  }
  .users-table .role-tag.admin {
    background: rgba(177, 138, 138, 0.14);
    color: #977070;
    border-color: rgba(177, 138, 138, 0.25);
  }
  .demo-card-thumb .demo-card-status {
    background: rgba(15, 23, 42, 0.55);
    color: #fff;
    border: none;
  }
  .demo-card.is-disabled .demo-card-status {
    background: rgba(100, 116, 139, 0.6);
  }
  .dc-mask {
    position: fixed;
    inset: 0;
    z-index: 100;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(15, 23, 42, 0.45);
    backdrop-filter: blur(2px);
    padding: 20px;
  }
  .dc-modal {
    background: var(--bg-1);
    border: 1px solid var(--line);
    border-radius: var(--r-lg);
    width: min(560px, 94vw);
    max-height: 88vh;
    display: flex;
    flex-direction: column;
    box-shadow: var(--shadow-soft);
    overflow: hidden;
  }
  .dc-modal-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 16px 20px;
    border-bottom: 1px solid var(--line);
    background: var(--bg-2);
  }
  .dc-modal-title {
    font-size: var(--fs-h2);
    font-weight: 700;
    color: var(--t1);
  }
  .dc-modal-close {
    width: 28px;
    height: 28px;
    border-radius: var(--r-md);
    border: none;
    background: transparent;
    color: var(--t3);
    font-size:16px;
    line-height: 1;
    cursor: pointer;
    transition: all .15s ease;
    display: grid;
    place-items: center;
  }
  .dc-modal-close:hover {
    background: var(--bg-3);
    color: var(--t1);
  }
  .dc-modal-body {
    padding: 18px 20px;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    gap:16px;
  }
  .dc-form-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0 14px;
  }
  .dc-field {
    display: flex;
    flex-direction: column;
    gap: 6px;
  }
  .dc-field > label {
    font-size: var(--fs-small);
    color: var(--t2);
    font-weight: 600;
  }
  .dc-hint {
    font-weight: 400;
    color: var(--t3);
    font-size: var(--fs-nano);
  }
  .dc-req {
    color: var(--err);
  }
  .dc-upload {
    display: flex;
    align-items: center;
    gap: 8px;
  }
  .dc-upload input[type="file"] {
    flex: 1;
    font-size: var(--fs-small);
    color: var(--t2);
  }
  .dc-imgpreview {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 2px;
  }
  .dc-imgitem {
    position: relative;
    width: 84px;
    height: 84px;
    border-radius: var(--r-md);
    border: 1px solid var(--line);
    overflow: hidden;
    background: var(--bg-2);
  }
  .dc-imgitem img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
  }
  .dc-imgitem-del {
    position: absolute;
    top: 2px;
    right: 2px;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    border: none;
    background: rgba(15, 23, 42, 0.65);
    color: #fff;
    font-size:14px;
    line-height: 1;
    cursor: pointer;
    display: grid;
    place-items: center;
  }
  .dc-imgitem-del:hover {
    background: var(--err);
  }
  .dc-imgempty {
    font-size: var(--fs-small);
    color: var(--t3);
    padding: 18px 12px;
    border: 1px dashed var(--line-strong);
    border-radius: var(--r-md);
    width: 100%;
    text-align: center;
  }
  .dc-switch {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: var(--fs-small);
    color: var(--t2);
    cursor: pointer;
  }
  .dc-modal-foot {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    padding: 14px 20px;
    border-top: 1px solid var(--line);
    background: var(--bg-2);
  }
  @media (max-width: 560px) {
    .dc-form-grid {
      grid-template-columns: 1fr;
    }
    .dc-modal {
      width: 100%;
    }
  }
  .admin-nav {
    padding: 10px 8px;
  }
  .admin-nav-item {
    gap:12px;
    padding: 8px 12px;
    border-radius: 10px;
    font-size: var(--fs-small);
  }
  .admin-nav-item:hover {
    background: var(--bg-2);
    color: var(--brand-text);
  }
  .admin-nav-item.active {
    background: rgba(37, 99, 235, 0.08);
    color: var(--brand-text);
    font-weight: 600;
  }
  .admin-nav-item.active::before {
    width: 3px;
    border-radius: 0 2px 2px 0;
  }
  .admin-nav-icon {
    width: 17px;
    height: 17px;
    flex-shrink: 0;
    color: var(--t3);
    transition: color .15s ease;
  }
  .admin-nav-item:hover .admin-nav-icon, .admin-nav-item.active .admin-nav-icon {
    color: var(--brand-text);
  }
  .admin-nav-label {
    font-size:12px;
    font-weight: 700;
    letter-spacing: .08em;
    color: var(--t-muted, #94a3b8);
    padding: 14px 12px 6px;
  }
  .admin-section-head h2 {
    letter-spacing: -0.01em;
  }
  .admin-card-head {
    background: var(--bg-1);
  }
  .admin-card-title > i {
    background: rgba(37, 99, 235, 0.08);
    color: var(--brand-text);
  }
  .admin-card-body {
    padding: 16px 22px;
  }
  .users-table {
    border-collapse: separate;
    border-spacing: 0;
  }
  .users-table th {
    background: var(--bg-2);
    color: var(--t3);
    font-size: var(--fs-nano);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .05em;
    padding: 9px 12px;
    border-bottom: 1px solid var(--line);
    white-space: nowrap;
    text-align: left;
  }
  .users-table td {
    padding: 10px 12px;
    border-bottom: 1px solid var(--line);
    font-size: var(--fs-small);
    vertical-align: middle;
    color: var(--t2);
  }
  .users-table tbody tr:hover td {
    background: var(--bg-2);
  }
  #opsTbody td, #usageTbody td {
    border-bottom: 1px solid var(--line);
  }
  .admin-input, .admin-select {
    border: 1px solid var(--line-strong);
    border-radius: 8px;
    padding: 8px 10px;
    font-size: var(--fs-small);
    background: var(--bg-1);
    color: var(--t1);
    transition: border-color .15s ease, box-shadow .15s ease;
  }
  .admin-input:focus, .admin-select:focus {
    outline: none;
    border-color: var(--brand-text);
    box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.12);
  }
  .tag, .chip {
    font-size: var(--fs-micro);
    padding: 2px 8px;
    background: var(--bg-2);
    color: var(--t2);
    border: 1px solid var(--line);
    border-radius: 999px;
  }
  .users-stat-card {
    padding: 16px 18px;
  }
  .users-stat-card::after {
    height: 2px;
    opacity: .5;
  }
  .users-stat-value {
    font-size: var(--fs-h1);
  }
  .users-btn.primary {
    box-shadow: none;
  }
  .users-btn.primary:hover {
    box-shadow: 0 4px 12px rgba(37, 99, 235, 0.18);
  }
  .empty-state {
    padding: 32px 16px;
    font-size: var(--fs-small);
    color: var(--t3);
  }
  #opsTbody td, #usageTbody td, #usersTbody td {
    font-size:14px !important;
  }
  .users-btn {
    font-size: var(--fs-small);
    border-radius: 8px;
    padding: 6px 12px;
  }
  .admin-card {
    border-radius: 12px;
    border: 1px solid var(--line);
    box-shadow: var(--shadow-card);
  }
  .admin-card-head {
    padding: 13px 16px;
  }
  .admin-card-head + .admin-card-body, .admin-card-body {
    padding: 10px 16px 13px;
    gap: 4px;
  }
  .admin-card-title > i {
    width: 30px;
    height: 30px;
    border-radius: 8px;
    background: rgba(37, 99, 235, 0.07);
  }
  .admin-card-title h2 {
    font-size: var(--fs-h3);
    margin: 0;
  }
  .admin-sub {
    font-size: var(--fs-nano);
    color: var(--t3);
  }
  .kv {
    padding: 6px 0;
    font-size: var(--fs-small);
    border-bottom: 1px solid var(--line);
  }
  .kv:last-child {
    border-bottom: none;
  }
  .kv > span:first-child {
    color: var(--t3);
    font-size: var(--fs-small);
  }
  .users-stat-card::after {
    display: none;
  }
  .users-stat-card {
    padding: 14px 16px;
    gap: 12px;
  }
  .users-stat-icon {
    width: 34px;
    height: 34px;
    border-radius: 9px;
  }
  .users-stat-value {
    font-size: var(--fs-h2);
  }
  .users-stat-label {
    font-size: var(--fs-nano);
  }
  .role-card::before {
    display: none;
  }
  .role-card {
    padding: 14px 16px;
  }
  .role-card-icon {
    width: 34px;
    height: 34px;
    border-radius: 9px;
    box-shadow: none;
  }
  .role-card-name {
    font-size: var(--fs-h3);
  }
  .role-card-desc {
    font-size: var(--fs-nano);
    min-height: 0;
    margin-bottom: 10px;
  }
  .admin-card-body .auth-field {
    margin-bottom: 0;
  }
  .admin-card-body .auth-field + .auth-field {
    margin-top: 8px;
  }
  .users-stat-icon {
    width: 30px;
    height: 30px;
    border-radius: 8px;
    background: rgba(37, 99, 235, 0.08);
    color: var(--brand-text);
    box-shadow: none;
  }
  .users-stat-icon svg {
    width: 16px;
    height: 16px;
  }
  .users-stat-icon.ok {
    background: rgba(16, 185, 129, 0.08);
    color: #00B42A;
    box-shadow: none;
  }
  .users-stat-icon.warn {
    background: rgba(245, 158, 11, 0.10);
    color: #FF7D00;
    box-shadow: none;
  }
  .users-stat-icon.muted {
    background: rgba(107, 114, 128, 0.10);
    color: #475569;
    box-shadow: none;
  }
  .users-stat-card {
    padding: 12px 14px;
    gap:12px;
    border-radius: 12px;
  }
  .users-stat-value {
    font-size: var(--fs-h2);
    letter-spacing: -0.02em;
  }
  .users-stat-label {
    font-size: var(--fs-nano);
  }
  .admin-body .quick-card {
    padding: 10px 12px;
    background: var(--bg-1);
    border: 1px solid var(--line);
    border-radius: 10px;
    gap:12px;
  }
  .admin-body .quick-card:hover {
    background: var(--bg-2);
    border-color: var(--brand-text);
  }
  .admin-body .quick-icon {
    width: 30px;
    height: 30px;
    border-radius: 8px;
    background: rgba(37, 99, 235, 0.08);
    color: var(--brand-text);
    box-shadow: none;
  }
  .admin-body .quick-icon svg {
    width: 16px;
    height: 16px;
  }
  .quick-name {
    font-size: var(--fs-small);
    font-weight: 600;
  }
  .quick-desc {
    font-size: var(--fs-nano);
  }
  .role-card {
    padding: 12px 14px;
    border-radius: 12px;
  }
  .role-card-icon {
    width: 30px;
    height: 30px;
    border-radius: 8px;
    box-shadow: none;
  }
  .role-card[data-role="r_admin"] .role-card-icon {
    background: rgba(245,63,63, 0.08);
    color: #F53F3F;
  }
  .role-card[data-role="r_creator"] .role-card-icon {
    background: rgba(22,93,255, 0.08);
    color: var(--brand-text);
  }
  .role-card[data-role="r_viewer"] .role-card-icon {
    background: rgba(148, 163, 184, 0.12);
    color: #475569;
  }
  .role-card-name {
    font-size: var(--fs-h3);
  }
  .role-card-desc {
    font-size: var(--fs-nano);
    margin-bottom: 8px;
    min-height: 0;
  }
  .role-card-foot {
    padding-top: 8px;
  }
  .users-avatar {
    width: 30px;
    height: 30px;
    box-shadow: none;
    font-size: var(--fs-small);
  }
  .users-avatar.admin {
    background: rgba(245,63,63, 0.10);
    color: #F53F3F;
  }
  .users-avatar.creator {
    background: rgba(22,93,255, 0.10);
    color: var(--brand-text);
  }
  .users-avatar.viewer {
    background: rgba(148, 163, 184, 0.12);
    color: #475569;
  }
  .users-table .role-tag {
    font-size: var(--fs-micro);
    padding: 2px 7px;
    border-radius: 999px;
    border: 1px solid var(--line);
    background: var(--bg-2);
    color: var(--t2);
    font-weight: 500;
  }
  .users-table .role-tag.admin {
    background: rgba(245,63,63, 0.06);
    color: #F53F3F;
    border-color: rgba(245,63,63, 0.15);
  }
  .users-table .role-tag.creator {
    background: rgba(22,93,255, 0.06);
    color: var(--brand-text);
    border-color: rgba(22,93,255, 0.15);
  }
  .users-table .role-tag.viewer {
    background: rgba(148, 163, 184, 0.10);
    color: #475569;
    border-color: rgba(148, 163, 184, 0.20);
  }
  .users-table td {
    padding: 8px 12px;
  }
  .users-table th {
    padding: 8px 12px;
  }
  .demo-grid {
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: 12px;
  }
  .demo-card {
    border-radius: 12px;
  }
  .demo-card-thumb {
    aspect-ratio: 4/3;
    background: var(--bg-2);
  }
  .demo-card-thumb .demo-card-status {
    top: 8px;
    right: 8px;
    padding: 2px 7px;
    font-size: var(--fs-nano);
    font-weight: 500;
    background: rgba(16, 185, 129, 0.08);
    color: #00B42A;
    border: 1px solid rgba(16, 185, 129, 0.25);
    backdrop-filter: none;
  }
  .demo-card.is-disabled .demo-card-status {
    background: rgba(100, 116, 139, 0.06);
    color: #64748b;
    border-color: rgba(100, 116, 139, 0.15);
  }
  .demo-card-thumb .demo-card-imgcount {
    bottom: 8px;
    left: 8px;
    padding: 2px 7px;
    font-size: var(--fs-nano);
    background: rgba(255, 255, 255, 0.9);
    color: var(--t2);
    border: 1px solid var(--line);
    backdrop-filter: none;
  }
  .demo-card-body {
    padding: 10px 12px;
    gap: 4px;
  }
  .demo-card-cat {
    font-size: var(--fs-nano);
    color: var(--t3);
    background: transparent;
    padding: 0;
  }
  .demo-card-name {
    font-size: var(--fs-small);
    font-weight: 700;
  }
  .demo-card-pname {
    font-size: var(--fs-nano);
    color: var(--t3);
    line-height: 1.35;
  }
  .demo-card-desc {
    font-size: var(--fs-nano);
    color: var(--t2);
    line-height: 1.35;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
  }
  .demo-card-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    margin-top: 2px;
  }
  .demo-card-tags .tag {
    font-size: var(--fs-nano);
    padding: 1px 6px;
    border-radius: 999px;
    background: var(--bg-2);
    border: 1px solid var(--line);
    color: var(--t3);
  }
  .demo-card-foot {
    padding: 8px 12px;
    border-top: 1px solid var(--line);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
  }
  .demo-card-id {
    font-size: var(--fs-nano);
    color: var(--t3);
    font-family: var(--font-mono);
  }
  .demo-card-actions {
    display: flex;
    gap: 4px;
  }
  .demo-card-actions .btn.ghost {
    padding: 4px 8px;
    font-size: var(--fs-nano);
    border-radius: 6px;
    color: var(--t2);
  }
  .demo-card-actions .btn.ghost[data-del] {
    color: var(--err);
  }
  .demo-card-actions .btn.ghost:hover {
    background: var(--bg-2);
  }
  .settings-row {
    padding: 10px 0;
  }
  .settings-status {
    font-size: var(--fs-small);
    font-weight: 500;
    padding: 2px 8px;
    border: 1px solid;
  }
  .settings-status.ok {
    background: rgba(16, 185, 129, 0.06);
    color: #00B42A;
    border-color: rgba(16, 185, 129, 0.2);
  }
  .settings-status.warn {
    background: rgba(245, 158, 11, 0.06);
    color: #FF7D00;
    border-color: rgba(245, 158, 11, 0.2);
  }
  .settings-status.pending {
    background: var(--bg-2);
    color: var(--t3);
    border-style: dashed;
  }
  .kv > b {
    font-weight: 500;
  }
  .kv > b.ok, .kv > b.warn {
    padding: 2px 7px;
    border-radius: 999px;
    border: 1px solid;
    font-size: var(--fs-nano);
    font-weight: 500;
  }
  .kv > b.ok {
    background: rgba(16, 185, 129, 0.06);
    color: #00B42A;
    border-color: rgba(16, 185, 129, 0.2);
  }
  .kv > b.warn {
    background: rgba(245, 158, 11, 0.06);
    color: #FF7D00;
    border-color: rgba(245, 158, 11, 0.2);
  }
  .admin-body .health-item {
    padding: 9px 12px;
    border-radius: 8px;
    background: var(--bg-2);
    border: 1px solid var(--line);
  }
  .admin-body .health-name {
    font-size: var(--fs-small);
  }
  .admin-body .health-dot {
    width: 8px;
    height: 8px;
    box-shadow: none;
  }
  .admin-body .health-dot.is-ok {
    background: #4d9e80;
    box-shadow: none;
  }
  .admin-body .health-dot.is-warn {
    background: #FF7D00;
    box-shadow: none;
  }
  .admin-body .health-dot.is-down {
    background: #F53F3F;
    box-shadow: none;
  }
  .admin-body .activity-item {
    padding: 7px 10px;
    gap: 8px;
    font-size: var(--fs-small);
  }
  .admin-body .activity-icon {
    width: 24px;
    height: 24px;
    border-radius: 6px;
  }
  .admin-body .activity-icon svg {
    width: 13px;
    height: 13px;
  }
  .admin-card-head {
    padding: 12px 16px;
  }
  .admin-card-title > i {
    width: 26px;
    height: 26px;
    border-radius: 7px;
  }
  .admin-card-title h2 {
    font-size: var(--fs-h3);
  }
  .admin-card-body {
    padding: 10px 16px 12px;
    gap: 4px;
  }
  .admin-section-head h2 {
    font-size: var(--fs-h2);
    letter-spacing: -0.01em;
  }
  .admin-sub {
    font-size: var(--fs-nano);
  }
  .admin-body .demo-filter-tag {
    font-size: var(--fs-nano);
    padding: 3px 8px;
  }
  .admin-body .demo-filter-tag em {
    font-size: var(--fs-nano);
  }
  .model-pick-icon {
    width: 24px;
    height: 24px;
    border-radius: 6px;
    box-shadow: none;
  }
  .model-pick-head .model-pick-icon.kind-llm {
    background: rgba(245, 158, 11, 0.10);
    color: #FF7D00;
  }
  .model-pick-head .model-pick-icon.kind-video {
    background: rgba(22,93,255, 0.10);
    color: var(--brand-text);
  }
  .model-pick-head .model-pick-icon.kind-image {
    background: rgba(139, 92, 246, 0.10);
    color: #165DFF;
  }
  .model-pick-head .model-pick-icon svg {
    width: 13px;
    height: 13px;
  }
  .admin-body .btn.sm, .admin-body .btn.primary.sm {
    font-size: var(--fs-small);
    padding: 6px 12px;
    border-radius: 8px;
  }
  .users-btn.icon-only {
    padding: 6px;
    border-radius: 8px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
  }
  .users-btn.icon-only svg {
    width: 14px;
    height: 14px;
  }
  .users-table td .row-actions {
    gap: 6px;
  }
  .role-card-actions {
    gap: 6px;
  }
  .demo-card-actions .btn.ghost.icon-only {
    padding: 5px;
    border-radius: 6px;
  }
  .demo-card-actions .btn.ghost.icon-only svg {
    width: 14px;
    height: 14px;
  }
  .users-stat-label {
    font-size: var(--fs-small);
    color: var(--t2);
  }
  .pc-panel-backdrop {
    position: fixed;
    inset: 0;
    z-index: 9999;
    background: rgba(15, 23, 42, .45);
    display: flex;
    align-items: center;
    justify-content: center;
    backdrop-filter: blur(2px);
  }
  .pc-panel {
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 20px 60px rgba(0,0,0,.18);
    width: min(640px, 92vw);
    max-height: 86vh;
    overflow: auto;
    display: flex;
    flex-direction: column;
  }
  .pc-panel-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 14px 18px;
    border-bottom: 1px solid var(--b1, #e2e8f0);
  }
  .pc-panel-head h3 {
    margin: 0;
    font-size: 16px;
    font-weight: 600;
  }
  .pc-close {
    background: transparent;
    border: none;
    cursor: pointer;
    font-size: 16px;
    color: var(--t2, #64748b);
    padding: 4px 8px;
    border-radius: 6px;
  }
  .pc-close:hover {
    background: var(--b2, #f1f5f9);
  }
  .pc-panel-body {
    padding: 16px 18px;
    display: flex;
    flex-direction: column;
    gap: 12px;
  }
  .pc-panel-foot {
    display: flex;
    gap: 8px;
    justify-content: flex-end;
    padding: 12px 18px;
    border-top: 1px solid var(--b1, #e2e8f0);
  }
  .pc-row {
    display: flex;
    align-items: center;
    gap:12px;
    flex-wrap: wrap;
  }
  .pc-label {
    color: var(--t2, #64748b);
    font-size:14px;
    min-width: 64px;
  }
  .pc-value {
    color: var(--t1, #0f172a);
    font-size:14px;
    font-weight: 500;
  }
  .pc-seg {
    display: inline-flex;
    gap: 4px;
    flex-wrap: wrap;
  }
  .pc-seg-btn {
    background: #fff;
    border: 1px solid var(--b1, #e2e8f0);
    padding: 6px 12px;
    border-radius: 8px;
    cursor: pointer;
    font-size:14px;
    color: var(--t1, #0f172a);
    transition: background .15s, border-color .15s;
  }
  .pc-seg-btn:hover {
    background: var(--b2, #f8fafc);
  }
  .pc-seg-btn.on {
    background: var(--c-primary, #165DFF);
    border-color: var(--c-primary, #165DFF);
    color: #fff;
  }
  .pc-parts-box {
    padding: 8px 0 0 74px;
  }
  .pc-parts {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 6px;
  }
  .pc-part-chip {
    display: inline-flex;
    align-items: center;
    padding: 5px 10px;
    border-radius: 999px;
    border: 1px solid var(--b1, #e2e8f0);
    background: #fff;
    cursor: pointer;
    font-size: 12px;
    color: var(--t1, #0f172a);
    user-select: none;
  }
  .pc-part-chip:hover {
    background: var(--b2, #f8fafc);
  }
  .pc-part-chip.selected {
    background: var(--c-primary, #165DFF);
    border-color: var(--c-primary, #165DFF);
    color: #fff;
  }
  .pc-cost {
    font-size: 12px;
    padding: 6px 10px;
    border-radius: 6px;
    background: var(--b2, #f1f5f9);
    color: var(--t2, #64748b);
  }
  .pc-cost.free {
    background: #ecfdf5;
    color: #065f46;
  }
  .pc-cost.paid {
    background: #fef3c7;
    color: #92400e;
  }
  .pc-preview {
    min-height: 120px;
    max-height: 320px;
    overflow: auto;
    border: 1px dashed var(--b1, #e2e8f0);
    border-radius: 8px;
    padding: 12px;
    text-align: center;
    background: #fafafa;
  }
  .pc-empty {
    color: var(--t2, #94a3b8);
    font-size:14px;
    padding: 24px 0;
  }
  .pi-progress {
    grid-column: 1 / -1;
    padding: 10px 12px;
    margin-bottom: 8px;
    background: var(--b2, #f8fafc);
    border: 1px solid var(--b1, #e2e8f0);
    border-radius: 8px;
    font-size: 12px;
    color: var(--t1, #0f172a);
  }
  .pi-progress-label {
    display: flex;
    align-items: center;
    margin-bottom: 6px;
    color: var(--t2, #475569);
    font-weight: 500;
  }
  .pi-progress-track {
    width: 100%;
    height: 6px;
    background: var(--b1, #e2e8f0);
    border-radius: 3px;
    overflow: hidden;
  }
  .pi-progress-bar {
    height: 100%;
    background: linear-gradient(90deg, var(--c-primary, #165DFF), #4080FF);
    border-radius: 3px;
    transition: width .25s ease;
  }
  .tenants-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
    gap: 16px;
    padding: 16px 0;
  }
  .tenants-loading, .empty-state {
    padding: 32px;
    text-align: center;
    color: var(--t3);
  }
  .tenant-card {
    background: var(--bg-1);
    border: 1px solid var(--line);
    border-radius: 10px;
    padding: 16px;
  }
  .tenant-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 4px;
  }
  .tenant-name {
    font-size:16px;
    font-weight: 600;
    color: var(--t1);
  }
  .tenant-plan {
    padding: 2px 8px;
    border-radius: 4px;
    font-size:12px;
    font-weight: 700;
  }
  .tenant-plan.plan-free {
    background: rgba(148,163,184,0.15);
    color: #64748b;
  }
  .tenant-plan.plan-pro {
    background: rgba(22,93,255,0.15);
    color: #165DFF;
  }
  .tenant-plan.plan-enterprise {
    background: rgba(245,158,11,0.15);
    color: #d97706;
  }
  .tenant-slug {
    font-size:12px;
    color: var(--t3);
    margin-bottom: 12px;
    font-family: monospace;
  }
  .tenant-quotas {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-bottom: 12px;
  }
  .quota-row {
    display: grid;
    grid-template-columns: 80px 1fr 90px;
    gap: 8px;
    align-items: center;
    font-size: 12px;
  }
  .quota-label {
    color: var(--t2);
  }
  .quota-bar {
    height: 6px;
    background: var(--bg-2);
    border-radius: 3px;
    overflow: hidden;
  }
  .quota-fill {
    height: 100%;
    background: var(--brand);
    transition: width .3s;
  }
  .quota-bar.warn .quota-fill {
    background: #FF7D00;
  }
  .quota-bar.danger .quota-fill {
    background: #F53F3F;
  }
  .quota-val {
    color: var(--t1);
    font-size:12px;
    text-align: right;
  }
  .tenant-status.ok {
    color: #00B42A;
    font-size: 12px;
    margin-bottom: 8px;
  }
  .tenant-status.bad {
    color: #F53F3F;
    font-size: 12px;
    margin-bottom: 8px;
  }
  .tenant-actions {
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
  }
  .admin-btn.small {
    padding: 4px 10px;
    font-size: 12px;
  }
  .admin-btn.danger {
    color: #F53F3F;
    border-color: rgba(245,63,63,0.3);
  }
  .admin-btn.danger:hover {
    background: rgba(245,63,63,0.08);
  }
  .health-status {
    display: flex;
    align-items: center;
    gap: 8px;
  }
  .health-label {
    font-size: 12px;
    color: var(--t3);
  }
  .health-label.is-ok {
    color: #4d9e80;
  }
  .health-label.is-warn {
    color: #FF7D00;
  }
  .health-label.is-down {
    color: #F53F3F;
  }
  .health-label.is-pending {
    color: var(--t3);
  }
  .video-rating {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-left: auto;
    font-size:14px;
    color: var(--t3);
  }
  .video-rating-label {
    font-weight: 500;
    color: var(--t2);
  }
  .video-rating-stars {
    display: inline-flex;
    gap: 2px;
  }
  .video-rating-stars .rating-star {
    background: transparent;
    border: 0;
    padding: 2px 4px;
    font-size: 20px;
    line-height: 1;
    color: #d4d4d8;
    cursor: pointer;
    transition: color 0.15s ease, transform 0.1s ease;
  }
  .video-rating-stars .rating-star:hover {
    transform: scale(1.15);
  }
  .video-rating-stars .rating-star.is-active {
    color: #FF7D00;
  }
  .video-rating-stars .rating-star.is-rated {
    color: #FF7D00;
  }
  .video-rating-stars .rating-star.is-rated-readonly {
    cursor: default;
  }
  .video-rating-text {
    font-size: 12px;
    color: var(--t3);
    min-width: 72px;
  }
  .video-rating-text.is-rated {
    color: #FF7D00;
    font-weight: 600;
  }
}
@property --tw-rotate-x {
  syntax: "*";
  inherits: false;
}
@property --tw-rotate-y {
  syntax: "*";
  inherits: false;
}
@property --tw-rotate-z {
  syntax: "*";
  inherits: false;
}
@property --tw-skew-x {
  syntax: "*";
  inherits: false;
}
@property --tw-skew-y {
  syntax: "*";
  inherits: false;
}
@property --tw-border-style {
  syntax: "*";
  inherits: false;
  initial-value: solid;
}
@property --tw-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}
@property --tw-shadow-color {
  syntax: "*";
  inherits: false;
}
@property --tw-shadow-alpha {
  syntax: "<percentage>";
  inherits: false;
  initial-value: 100%;
}
@property --tw-inset-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}
@property --tw-inset-shadow-color {
  syntax: "*";
  inherits: false;
}
@property --tw-inset-shadow-alpha {
  syntax: "<percentage>";
  inherits: false;
  initial-value: 100%;
}
@property --tw-ring-color {
  syntax: "*";
  inherits: false;
}
@property --tw-ring-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}
@property --tw-inset-ring-color {
  syntax: "*";
  inherits: false;
}
@property --tw-inset-ring-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}
@property --tw-ring-inset {
  syntax: "*";
  inherits: false;
}
@property --tw-ring-offset-width {
  syntax: "<length>";
  inherits: false;
  initial-value: 0px;
}
@property --tw-ring-offset-color {
  syntax: "*";
  inherits: false;
  initial-value: #fff;
}
@property --tw-ring-offset-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}
@property --tw-outline-style {
  syntax: "*";
  inherits: false;
  initial-value: solid;
}
@property --tw-blur {
  syntax: "*";
  inherits: false;
}
@property --tw-brightness {
  syntax: "*";
  inherits: false;
}
@property --tw-contrast {
  syntax: "*";
  inherits: false;
}
@property --tw-grayscale {
  syntax: "*";
  inherits: false;
}
@property --tw-hue-rotate {
  syntax: "*";
  inherits: false;
}
@property --tw-invert {
  syntax: "*";
  inherits: false;
}
@property --tw-opacity {
  syntax: "*";
  inherits: false;
}
@property --tw-saturate {
  syntax: "*";
  inherits: false;
}
@property --tw-sepia {
  syntax: "*";
  inherits: false;
}
@property --tw-drop-shadow {
  syntax: "*";
  inherits: false;
}
@property --tw-drop-shadow-color {
  syntax: "*";
  inherits: false;
}
@property --tw-drop-shadow-alpha {
  syntax: "<percentage>";
  inherits: false;
  initial-value: 100%;
}
@property --tw-drop-shadow-size {
  syntax: "*";
  inherits: false;
}
@property --tw-backdrop-blur {
  syntax: "*";
  inherits: false;
}
@property --tw-backdrop-brightness {
  syntax: "*";
  inherits: false;
}
@property --tw-backdrop-contrast {
  syntax: "*";
  inherits: false;
}
@property --tw-backdrop-grayscale {
  syntax: "*";
  inherits: false;
}
@property --tw-backdrop-hue-rotate {
  syntax: "*";
  inherits: false;
}
@property --tw-backdrop-invert {
  syntax: "*";
  inherits: false;
}
@property --tw-backdrop-opacity {
  syntax: "*";
  inherits: false;
}
@property --tw-backdrop-saturate {
  syntax: "*";
  inherits: false;
}
@property --tw-backdrop-sepia {
  syntax: "*";
  inherits: false;
}
@property --tw-ease {
  syntax: "*";
  inherits: false;
}
@keyframes spin {
  to {
    transform: rotate(360deg);
  }
}
@layer properties {
  @supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) {
    *, ::before, ::after, ::backdrop {
      --tw-rotate-x: initial;
      --tw-rotate-y: initial;
      --tw-rotate-z: initial;
      --tw-skew-x: initial;
      --tw-skew-y: initial;
      --tw-border-style: solid;
      --tw-shadow: 0 0 #0000;
      --tw-shadow-color: initial;
      --tw-shadow-alpha: 100%;
      --tw-inset-shadow: 0 0 #0000;
      --tw-inset-shadow-color: initial;
      --tw-inset-shadow-alpha: 100%;
      --tw-ring-color: initial;
      --tw-ring-shadow: 0 0 #0000;
      --tw-inset-ring-color: initial;
      --tw-inset-ring-shadow: 0 0 #0000;
      --tw-ring-inset: initial;
      --tw-ring-offset-width: 0px;
      --tw-ring-offset-color: #fff;
      --tw-ring-offset-shadow: 0 0 #0000;
      --tw-outline-style: solid;
      --tw-blur: initial;
      --tw-brightness: initial;
      --tw-contrast: initial;
      --tw-grayscale: initial;
      --tw-hue-rotate: initial;
      --tw-invert: initial;
      --tw-opacity: initial;
      --tw-saturate: initial;
      --tw-sepia: initial;
      --tw-drop-shadow: initial;
      --tw-drop-shadow-color: initial;
      --tw-drop-shadow-alpha: 100%;
      --tw-drop-shadow-size: initial;
      --tw-backdrop-blur: initial;
      --tw-backdrop-brightness: initial;
      --tw-backdrop-contrast: initial;
      --tw-backdrop-grayscale: initial;
      --tw-backdrop-hue-rotate: initial;
      --tw-backdrop-invert: initial;
      --tw-backdrop-opacity: initial;
      --tw-backdrop-saturate: initial;
      --tw-backdrop-sepia: initial;
      --tw-ease: initial;
    }
  }
}

/* v19.0.35 调优工程师工作台 - 浮动可移动弹窗 */
.tuner-workbench {
  position: fixed;
  top: 80px;
  right: 24px;
  width: 720px;
  max-width: calc(100vw - 48px);
  height: 600px;
  max-height: calc(100vh - 96px);
  background: var(--bg-0, #ffffff);
  border: 1px solid var(--line, #d0d7e2);
  border-radius: 12px;
  box-shadow: 0 24px 64px rgba(0, 0, 0, 0.18), 0 4px 12px rgba(0, 0, 0, 0.06);
  display: flex;
  flex-direction: column;
  z-index: 9999;
  overflow: hidden;
  font-family: var(--font, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif);
}
.tuner-wb-head {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 16px;
  background: linear-gradient(135deg, rgba(22,93,255, 0.08), rgba(124, 92, 245, 0.08));
  border-bottom: 1px solid var(--line, #d0d7e2);
  user-select: none;
}
.tuner-wb-title {
  font-weight: 700;
  font-size: 14px;
  color: var(--t1, #1a1d24);
}
.tuner-wb-meta {
  font-size:12px;
  color: var(--t3, #8a94a6);
  margin-left: auto;
  margin-right: auto;
}
.tuner-wb-actions { display: flex; gap: 6px; }
.tuner-wb-btn {
  width: 28px; height: 28px;
  border: 1px solid var(--line, #d0d7e2);
  border-radius: 6px;
  background: var(--bg-1, #fff);
  cursor: pointer;
  font-size: 16px;
  line-height: 1;
  color: var(--t2, #525866);
}
.tuner-wb-btn:hover { background: var(--bg-2, #f7f8fa); color: var(--err, #F53F3F); }
.tuner-wb-tabs {
  display: flex;
  gap: 4px;
  padding: 8px 12px;
  border-bottom: 1px solid var(--line, #d0d7e2);
  background: var(--bg-1, #fff);
  overflow-x: auto;
}
.tuner-wb-tab {
  padding: 6px 12px;
  border: 1px solid transparent;
  border-radius: 6px;
  background: transparent;
  cursor: pointer;
  font-size:14px;
  color: var(--t2, #525866);
  white-space: nowrap;
  transition: all 0.15s;
}
.tuner-wb-tab:hover { background: var(--bg-2, #f7f8fa); }
.tuner-wb-tab.active {
  background: rgba(22,93,255, 0.12);
  color: var(--brand-text, #165DFF);
  border-color: rgba(22,93,255, 0.25);
  font-weight: 600;
}
.tuner-wb-body {
  flex: 1;
  overflow-y: auto;
  padding: 16px;
}
.tuner-wb-tip {
  font-size: 12px;
  color: var(--t3, #8a94a6);
  margin: 0 0 12px;
  line-height: 1.6;
}
.tuner-wb-tip.muted { color: var(--t3, #8a94a6); opacity: 0.8; }
.tuner-wb-grid {
  display: grid;
  grid-template-columns: 80px 1fr;
  gap: 8px 12px;
  align-items: start;
  margin-bottom: 12px;
}
.tuner-wb-grid > label {
  padding-top: 8px;
  font-size: 12px;
  font-weight: 600;
  color: var(--t2, #525866);
  text-align: right;
}
.tuner-wb-grid > input,
.tuner-wb-grid > textarea {
  padding: 8px 10px;
  border: 1px solid var(--line, #d0d7e2);
  border-radius: 6px;
  font-size:14px;
  font-family: inherit;
  resize: vertical;
  background: var(--bg-1, #fff);
  color: var(--t1, #1a1d24);
}
.tuner-wb-grid > input:focus,
.tuner-wb-grid > textarea:focus {
  outline: 2px solid rgba(22,93,255, 0.3);
  border-color: var(--brand-text, #165DFF);
}
.tuner-wb-prompts {
  display: grid;
  grid-template-columns: 100px 1fr;
  gap: 8px 12px;
  align-items: start;
  margin-bottom: 12px;
}
.tuner-wb-prompts > label {
  padding-top: 8px;
  font-size: 12px;
  font-weight: 600;
  color: var(--t2, #525866);
  text-align: right;
}
.tuner-wb-prompts > textarea {
  padding: 8px 10px;
  border: 1px solid var(--line, #d0d7e2);
  border-radius: 6px;
  font-family: ui-monospace, "SF Mono", monospace;
  font-size: 12px;
  line-height: 1.5;
  resize: vertical;
  background: var(--bg-1, #fff);
  color: var(--t1, #1a1d24);
}
.tuner-wb-foot {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  padding: 12px 16px;
  border-top: 1px solid var(--line, #d0d7e2);
  background: var(--bg-1, #fff);
}
.tuner-wb-foot .btn.sm { padding: 6px 12px; font-size: 12px; }
.tuner-wb-empty {
  padding: 32px 16px;
  text-align: center;
}
.tuner-wb-empty h3 {
  font-size: 16px;
  color: var(--t1, #1a1d24);
  margin: 0 0 12px;
}
.tuner-wb-empty p {
  font-size:14px;
  color: var(--t2, #525866);
  margin: 8px 0;
  line-height: 1.6;
}
.tuner-wb-empty ul {
  display: inline-block;
  text-align: left;
  font-size:14px;
  color: var(--t2, #525866);
  line-height: 1.8;
  margin: 12px 0;
}
.tuner-wb-empty .muted { opacity: 0.7; font-size: 12px; }

/* v19.0.36 P1 调优诊断 tab 样式 */
.tuner-wb-toolbar {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 8px 12px;
  background: var(--bg-1, #fff);
  border: 1px solid var(--line, #d0d7e2);
  border-radius: 6px;
  margin-bottom: 12px;
  flex-wrap: wrap;
}
.tuner-wb-toolbar > label {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  color: var(--t2, #525866);
}
.tuner-wb-toolbar > label > select {
  padding: 4px 8px;
  border: 1px solid var(--line, #d0d7e2);
  border-radius: 4px;
  font-size: 12px;
  background: var(--bg-0, #fff);
  color: var(--t1, #1a1d24);
}
.tuner-wb-loading {
  padding: 24px;
  text-align: center;
  font-size:14px;
  color: var(--t3, #8a94a6);
}
.tuner-wb-section {
  margin-bottom: 16px;
}
.tuner-wb-section h4 {
  margin: 0 0 8px;
  font-size: 12px;
  font-weight: 700;
  color: var(--t1, #1a1d24);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  padding-bottom: 4px;
  border-bottom: 1px solid var(--line, #d0d7e2);
}
.tuner-diag-list {
  list-style: none;
  margin: 0;
  padding: 0;
}
.tuner-diag-list li {
  padding: 6px 8px;
  font-size: 12px;
  line-height: 1.5;
  border-bottom: 1px solid var(--line, #d0d7e2);
  display: flex;
  gap: 8px;
  align-items: center;
  flex-wrap: wrap;
}
.tuner-diag-list li code {
  background: var(--bg-2, #f7f8fa);
  padding: 1px 6px;
  border-radius: 3px;
  font-size:12px;
  color: var(--brand-text, #165DFF);
  font-weight: 600;
}
.tuner-diag-list li .muted {
  color: var(--t3, #8a94a6);
  font-size:12px;
}
.tuner-diag-list li .err {
  color: var(--err, #F53F3F);
  font-weight: 700;
  font-size:12px;
  text-transform: uppercase;
}
.tuner-diag-list li .ok {
  color: var(--ok, #4d9e80);
  font-weight: 700;
  font-size:12px;
  text-transform: uppercase;
}

/* v20.0.2 文案反馈输入块 */
.copy-feedback-block {
  margin-top: 12px;
  padding: 10px 12px;
  border: 1px dashed var(--line, #e2e8f0);
  border-radius: var(--r-sm, 8px);
  background: var(--bg-2, #f8fafc);
}
.copy-feedback-label {
  display: block;
  font-size: 12px;
  color: var(--t2, #475569);
  font-weight: 500;
  margin-bottom: 6px;
}
.copy-feedback-text {
  width: 100%;
  padding: 8px 10px;
  border: 1px solid var(--line, #e2e8f0);
  border-radius: var(--r-sm, 6px);
  font-size: 12px;
  color: var(--t1, #0f172a);
  background: var(--bg-1, #fff);
  resize: vertical;
  font-family: inherit;
  line-height: 1.5;
  box-sizing: border-box;
}
.copy-feedback-text:focus {
  outline: 2px solid var(--brand, #165DFF);
  outline-offset: -1px;
  border-color: var(--brand-text, #165DFF);
}
.copy-feedback-actions {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-top: 8px;
}
.copy-feedback-hint {
  font-size:12px;
  color: var(--t3, #94a3b8);
}

/* v20.0.2 admin 用户管理增强：多维筛选 + 用户详情面板 */
.users-filter {
  padding: 6px 10px;
  border: 1px solid var(--line, #e2e8f0);
  border-radius: var(--r-xs, 4px);
  font-size: 12px;
  background: var(--bg-1, #fff);
  color: var(--t1, #0f172a);
  cursor: pointer;
  min-width: 110px;
}
.users-filter:focus {
  outline: 2px solid var(--brand, #165DFF);
  outline-offset: -1px;
}
.users-table-summary {
  font-size: 12px;
  color: var(--t3, #94a3b8);
  padding: 6px 0 10px;
}
.users-row-clickable:hover td {
  background: var(--bg-2, #f8fafc);
}
.user-detail-modal {
  position: fixed; inset: 0; z-index: 9999;
  display: flex; align-items: center; justify-content: center;
}
.user-detail-modal.hidden { display: none; }
.user-detail-mask {
  position: absolute; inset: 0;
  background: rgba(15,23,42,.5);
  backdrop-filter: blur(2px);
}
.user-detail-card {
  position: relative;
  background: var(--bg-1, #fff);
  border-radius: var(--r-lg, 14px);
  width: 720px;
  max-width: 92vw;
  max-height: 88vh;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  box-shadow: 0 24px 60px rgba(15,23,42,.2);
  z-index: 1;
}
.user-detail-head {
  padding: 20px 24px;
  border-bottom: 1px solid var(--line, #e2e8f0);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  background: var(--bg-2, #f8fafc);
}
.user-detail-title {
  display: flex; align-items: center; gap:16px;
}
.user-detail-title h3 {
  margin: 0; font-size:16px; color: var(--t1, #0f172a);
}
.user-detail-sub {
  font-size: 12px; color: var(--t3, #94a3b8); margin-top: 4px;
}
.user-detail-close {
  background: transparent; border: none; cursor: pointer;
  width: 32px; height: 32px; border-radius: 50%; color: var(--t2, #475569);
  display: flex; align-items: center; justify-content: center;
}
.user-detail-close:hover { background: var(--bg-1, #fff); color: var(--t1, #0f172a); }
.user-detail-body {
  padding: 20px 24px;
  overflow-y: auto;
  flex: 1;
}
.user-detail-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 12px;
  margin-bottom: 18px;
}
.user-detail-stat {
  padding: 10px 14px;
  background: var(--bg-2, #f8fafc);
  border-radius: var(--r-sm, 8px);
}
.user-detail-stat-label {
  font-size:12px;
  color: var(--t3, #94a3b8);
  text-transform: uppercase;
  letter-spacing: 0.3px;
  margin-bottom: 4px;
}
.user-detail-stat-value {
  font-size: 14px;
  color: var(--t1, #0f172a);
  font-weight: 500;
}
.user-detail-section {
  margin-bottom: 18px;
  padding-bottom: 14px;
  border-bottom: 1px solid var(--line, #e2e8f0);
}
.user-detail-section:last-child { border-bottom: none; }
.user-detail-section h4 {
  margin: 0 0 10px;
  font-size:14px;
  color: var(--t2, #475569);
  font-weight: 600;
}
.user-detail-credit {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
}
.user-detail-credit > div { display: flex; flex-direction: column; gap: 4px; }
.user-detail-credit-bar {
  grid-column: 1 / -1;
  height: 8px;
  background: var(--bg-1, #fff);
  border-radius: 4px;
  overflow: hidden;
  border: 1px solid var(--line, #e2e8f0);
  margin-top: 4px;
}
.user-detail-credit-bar > div {
  height: 100%;
  transition: width .3s ease;
}
.user-detail-usage {
  font-size: 12px;
  color: var(--t2, #475569);
}
.user-detail-usage-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap:12px;
}
.user-detail-usage-grid > div {
  padding: 8px 10px;
  background: var(--bg-2, #f8fafc);
  border-radius: var(--r-xs, 4px);
  display: flex; flex-direction: column; gap: 4px;
}
.user-detail-ops {
  width: 100%; border-collapse: collapse; font-size: 12px;
}
.user-detail-ops thead { background: var(--bg-2, #f8fafc); }
.user-detail-ops th {
  text-align: left; padding: 6px 8px; border-bottom: 1px solid var(--line, #e2e8f0);
  font-weight: 600; color: var(--t2, #475569); font-size:12px;
  text-transform: uppercase; letter-spacing: 0.3px;
}
.user-detail-ops td {
  padding: 6px 8px; border-bottom: 1px solid var(--line, #f0f1f3);
  color: var(--t1, #0f172a); vertical-align: middle;
}

/* v20.0.2 admin 租户详情面板 (类比用户详情) */
.tenant-detail-card {
  width: 760px;
}
.tenant-detail-icon {
  width: 48px;
  height: 48px;
  border-radius: var(--r-md, 10px);
  background: rgba(22,93,255,.14);
  color: var(--brand-text, #165DFF);
  display: grid;
  place-items: center;
}
.tenant-detail-icon .lucide {
  width: 24px;
  height: 24px;
}

/* v20.0.2 admin 角色权限矩阵：等级标签 + 搜索过滤 + 折叠 */
.role-card-level {
  display: inline-block;
  padding: 2px 8px;
  border-radius: var(--r-xs, 4px);
  font-size:12px;
  font-weight: 600;
}
.role-card-level.level-管理员级,
.role-card-level.level-高级 {
  background: rgba(22,93,255,.12);
  color: var(--brand-text, #165DFF);
}
.role-card-level.level-标准 {
  background: rgba(0,180,42,.12);
  color: var(--ok, #4d9e80);
}
.role-card-level.level-受限 {
  background: rgba(148,163,184,.16);
  color: var(--t2, #475569);
}
.perm-toolbar {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
}
.perm-search,
.perm-group-filter {
  padding: 5px 10px;
  border: 1px solid var(--line, #e2e8f0);
  border-radius: var(--r-xs, 4px);
  font-size: 12px;
  background: var(--bg-1, #fff);
  color: var(--t1, #0f172a);
}
.perm-search {
  min-width: 220px;
}
.perm-search:focus,
.perm-group-filter:focus {
  outline: 2px solid var(--brand, #165DFF);
  outline-offset: -1px;
  border-color: var(--brand-text, #165DFF);
}
.perm-only-writable {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  color: var(--t2, #475569);
  cursor: pointer;
}
.perm-matrix-scroll {
  overflow-x: auto;
  max-height: 600px;
  overflow-y: auto;
  border: 1px solid var(--line, #e2e8f0);
  border-radius: var(--r-sm, 8px);
}
.perm-group-row {
  background: var(--bg-2, #f8fafc);
  cursor: pointer;
}
.perm-group-row td {
  padding: 6px 12px;
  font-weight: 600;
  color: var(--t2, #475569);
  font-size: 12px;
  border-top: 1px solid var(--line, #e2e8f0);
  display: flex;
  align-items: center;
  gap:12px;
}
.perm-group-row .group-icon {
  flex: 1;
}
.perm-group-row .group-count {
  font-weight: 400;
  font-size:12px;
  color: var(--t3, #94a3b8);
}
.perm-group-toggle {
  padding: 2px 10px;
  border: 1px solid var(--line, #e2e8f0);
  border-radius: var(--r-xs, 4px);
  background: var(--bg-1, #fff);
  font-size:12px;
  color: var(--t2, #475569);
  cursor: pointer;
}
.perm-group-toggle:hover {
  border-color: var(--brand-text, #165DFF);
  color: var(--brand-text, #165DFF);
}
.perm-row.hidden {
  display: none;
}
.perm-empty {
  text-align: center;
  padding: 40px;
  color: var(--t3, #94a3b8);
  font-size:14px;
}
.perm-actions-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: 12px;
  flex-wrap: wrap;
  gap: 12px;
}
.perm-hint {
  font-size: 12px;
  color: var(--t3, #94a3b8);
}

/* v20.0.2 admin dashboard 重设计：使用过程统计 + 活动表格化 */
.users-stat-sub {
  font-size:12px;
  color: var(--t3, #94a3b8);
  margin-top: 4px;
}
.dashboard-stats-ready {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap:16px;
  margin-bottom: 14px;
}
.dashboard-stats-usage {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap:16px;
  margin-bottom: 18px;
}
@media (max-width: 1100px) {
  .dashboard-stats-ready,
  .dashboard-stats-usage {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (max-width: 600px) {
  .dashboard-stats-ready,
  .dashboard-stats-usage {
    grid-template-columns: 1fr;
  }
}
.users-stat-icon .lucide,
.quick-icon .lucide,
.admin-card-head .lucide {
  width: 18px;
  height: 18px;
}
.activity-toolbar {
  display: flex;
  align-items: center;
  gap: 12px;
}
.activity-filter {
  padding: 4px 10px;
  border: 1px solid var(--line, #e2e8f0);
  border-radius: var(--r-xs, 4px);
  font-size: 12px;
  background: var(--bg-1, #fff);
  color: var(--t1, #0f172a);
  cursor: pointer;
}
.activity-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 12px;
}
.activity-table thead {
  background: var(--bg-2, #f8fafc);
}
.activity-table th {
  text-align: left;
  padding: 8px 10px;
  border-bottom: 1px solid var(--line, #e2e8f0);
  font-weight: 600;
  color: var(--t2, #475569);
  font-size:12px;
  text-transform: uppercase;
  letter-spacing: 0.3px;
}
.activity-table td {
  padding: 8px 10px;
  border-bottom: 1px solid var(--line, #f0f1f3);
  color: var(--t1, #0f172a);
  vertical-align: middle;
}
.activity-row:hover td {
  background: var(--bg-2, #f8fafc);
}
.activity-time {
  white-space: nowrap;
  font-family: ui-monospace, monospace;
}
.time-date {
  color: var(--t3, #94a3b8);
  font-size:12px;
  margin-right: 4px;
}
.time-hhmm {
  font-weight: 600;
}
.activity-user {
  white-space: nowrap;
  max-width: 120px;
  overflow: hidden;
  text-overflow: ellipsis;
}
.activity-action code {
  background: var(--bg-2, #f8fafc);
  padding: 1px 6px;
  border-radius: var(--r-xs, 4px);
  font-size:12px;
  color: var(--brand-text, #165DFF);
  font-family: ui-monospace, monospace;
}
.activity-detail {
  color: var(--t2, #475569);
  max-width: 360px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.activity-status {
  font-weight: 700;
  font-size:14px;
}
.activity-status.is-ok { color: var(--ok, #4d9e80); }
.activity-status.is-err { color: var(--warn, #FF7D00); }
.activity-loading,
.activity-empty {
  text-align: center;
  color: var(--t3, #94a3b8);
  padding: 24px;
  font-size:14px;
}

/* v20.0.2 admin 模型供应商 (panel-providers) · provider-card / tabs / list 此前无样式 → 视觉错乱 */
.provider-tabs {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
  border-bottom: 1px solid var(--line, #e2e8f0);
  margin-bottom: 16px;
  padding-bottom: 12px;
}
.provider-tab {
  padding: 8px 14px;
  border-radius: var(--r-sm, 8px);
  border: 1px solid var(--line, #e2e8f0);
  background: var(--bg-2, #f8fafc);
  font-size: var(--fs-small, 13px);
  color: var(--t2, #475569);
  cursor: pointer;
  transition: all .15s ease;
}
.provider-tab:hover {
  border-color: var(--brand-text, #165DFF);
  color: var(--brand-text, #165DFF);
}
.provider-tab.active {
  background: var(--brand, #165DFF);
  color: #fff;
  border-color: var(--brand-text, #165DFF);
  box-shadow: 0 2px 8px rgba(22,93,255,.3);
}
.provider-list {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(380px, 1fr));
  gap:16px;
}
.provider-card {
  border: 1px solid var(--line, #e2e8f0);
  border-radius: var(--r-md, 12px);
  background: var(--bg-1, #fff);
  overflow: hidden;
  display: flex;
  flex-direction: column;
}
.provider-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 14px 16px;
  border-bottom: 1px solid var(--line, #e2e8f0);
  background: var(--bg-2, #f8fafc);
}
.provider-title {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  min-width: 0;
}
.provider-title strong {
  font-size: var(--fs-h2, 18px);
  color: var(--t1, #0f172a);
}
.provider-id {
  font-size:12px;
  padding: 2px 6px;
  border-radius: var(--r-xs, 4px);
  background: rgba(22,93,255,.1);
  color: var(--brand-text, #165DFF);
  font-family: ui-monospace, monospace;
}
.provider-toggle {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: var(--fs-small, 13px);
  cursor: pointer;
}
.provider-fields {
  padding: 14px 16px;
  display: flex;
  flex-direction: column;
  gap:12px;
}
.provider-fields label {
  display: flex;
  flex-direction: column;
  gap: 4px;
  font-size: var(--fs-small, 13px);
  color: var(--t2, #475569);
  font-weight: 500;
}
.provider-fields input {
  padding: 8px 10px;
  border: 1px solid var(--line, #e2e8f0);
  border-radius: var(--r-sm, 6px);
  font-family: ui-monospace, monospace;
  font-size: var(--fs-small, 13px);
  color: var(--t1, #0f172a);
  background: var(--bg-1, #fff);
}
.provider-fields input:focus {
  outline: 2px solid var(--brand, #165DFF);
  outline-offset: -1px;
  border-color: var(--brand-text, #165DFF);
}
.provider-key-hint {
  font-size:12px;
  color: var(--t3, #94a3b8);
}
.provider-key-warn {
  color: var(--warn, #FF7D00);
}
.provider-models {
  padding: 0 16px;
}
.provider-models summary {
  cursor: pointer;
  font-size: var(--fs-small, 13px);
  color: var(--t2, #475569);
  padding: 8px 0;
  border-top: 1px dashed var(--line, #e2e8f0);
  user-select: none;
}
.provider-models summary:hover { color: var(--brand-text, #165DFF); }
.provider-models ul {
  list-style: none;
  margin: 8px 0;
  padding: 0 0 12px 12px;
  max-height: 200px;
  overflow-y: auto;
}
.provider-models li {
  padding: 4px 0;
  font-size: 12px;
  color: var(--t1, #0f172a);
  line-height: 1.5;
}
.provider-models li code {
  background: var(--bg-2, #f8fafc);
  padding: 1px 5px;
  border-radius: var(--r-xs, 4px);
  font-size:12px;
  color: var(--brand-text, #165DFF);
}
.provider-models-tip {
  padding: 8px 0 12px;
  font-size:12px;
  color: var(--t3, #94a3b8);
}
.provider-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap:12px;
  padding: 12px 16px;
  border-top: 1px solid var(--line, #e2e8f0);
  background: var(--bg-2, #f8fafc);
}
.provider-empty {
  padding: 32px;
  text-align: center;
  color: var(--t3, #94a3b8);
  font-size: var(--fs-body, 14px);
}

.copy-gen-status{min-height:20px;font-size:14px;color:var(--t2);margin:6px 0 2px;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* ============================================================
   v20.0.72 · 创作简报卡片紧凑排版（时长/比例/平台/卖点/客群/风格）
   置于样式表末尾，保证最高优先级；用户反馈六类卡片整体偏大
   ============================================================ */
/* 时长/比例/平台 —— 短选项 chip 模式：水平紧凑、无图标、无描述 */
/* v20.0.78：每区域整齐两行——时长 3 列×2 行(6个)，比例/平台 4 列×2 行(4+3 共7个)；
   卡片高度拉高到 40px，名称允许 2 行换行，保证「竖屏 9:16」「超宽屏 21:9」等文字完整显示 */
.opt-grid.chip-grid {
  grid-template-columns: repeat(3, 1fr);
  gap: 6px;
}
#ratioOptions.opt-grid.chip-grid {
  grid-template-columns: repeat(4, 1fr);
}
/* v60.18: 平台选项不再逐字竖排——按可用宽度自动换行，且芯片内文字保持单行 */
#platformOptions.opt-grid.chip-grid {
  grid-template-columns: repeat(auto-fill, minmax(96px, 1fr));
}
#platformOptions.opt-grid.chip-grid .opt-card .opt-name {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  min-width: 0;
}
/* v20.0.78：chip 卡片高度拉高（40px 最小高，容纳 2 行文字），padding 略加；名称允许 2 行完整显示 */
.opt-grid.chip-grid .opt-card,
.opt-grid.chip-grid .opt-card.compact {
  flex-direction: row;
  align-items: center;
  justify-content: flex-start;
  gap: 4px;
  padding: 7px 9px;
  min-height: 40px;
  border-radius: 8px;
}
.opt-grid.chip-grid .opt-card .opt-icon,
.opt-grid.chip-grid .opt-card.compact .opt-icon {
  display: none !important;
}
.opt-grid.chip-grid .opt-card .opt-sub,
.opt-grid.chip-grid .opt-card.compact .opt-sub {
  display: none !important;
}
.opt-grid.chip-grid .opt-card .opt-name,
.opt-grid.chip-grid .opt-card.compact .opt-name {
  font-size: var(--fs-small);
  font-weight: 600;
  line-height: 1.2;
  /* v20.0.74：比例等长名称（如「竖屏 9:16」「超宽屏 21:9」）允许 2 行换行完整显示，
     不再单行截断成「竖屏...」(用户反馈信息显示不全)；短名称（如「15 秒」）自然 1 行 */
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  word-break: break-word;
  min-height: 0;
  max-width: 100%;
}
.opt-grid.chip-grid .opt-card .opt-check {
  position: static;
  width: 13px;
  height: 13px;
  flex: 0 0 auto;
  margin-left: auto;
  opacity: 0;
  transform: scale(.5);
}
.opt-grid.chip-grid .opt-card.selected .opt-check {
  opacity: 1;
  transform: scale(1);
}
/* 卖点/客群/风格 —— 紧凑小卡：无图标、名称 1 行、描述 1 行超小号 */
#pointOptions .opt-card,
#audienceOptions .opt-card {
  padding: 6px 8px;
}
#pointOptions .opt-card .opt-icon,
#audienceOptions .opt-card .opt-icon,
#tonePresets .opt-card .opt-icon {
  display: none !important;
}
#pointOptions .opt-card .opt-name,
#audienceOptions .opt-card .opt-name,
#tonePresets .opt-card .opt-name {
  font-size: var(--fs-small);
  font-weight: 600;
  line-height: 1.2;
  -webkit-line-clamp: 1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
#pointOptions .opt-card .opt-sub,
#audienceOptions .opt-card .opt-sub,
#tonePresets .opt-card .opt-desc {
  font-size:12px;
  line-height: 1.2;
  -webkit-line-clamp: 1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  margin-top: 0;
}
#tonePresets .opt-card {
  gap: 1px;
  padding: 6px 8px;
}


/* ============================================================
   v20.0.76 · 创作简报三列布局（视频计划/内容方向）
   时长·比例·平台 三列并排；关键词一行；卖点·客群·风格 三列并排
   ============================================================ */
/* 三列等宽 row（替代 brief-row 的 flex 换行） */
.brief-row-3.brief-row {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
  flex-wrap: nowrap;
}
.brief-row-3.brief-row .brief-col {
  flex: none;
  min-width: 0;
}
/* 三列下的卖点/客群/风格卡：网格自适应（每块约 1/3 宽，卡片 2 列或 3 列自适应） */
.brief-row-3 .opt-grid:not(.chip-grid),
.brief-row-3 .tone-presets {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(96px, 1fr));
  gap: 6px;
  max-width: none;
}
/* vN9 响应式：窄屏(<=860) 三列等宽挤成一列内换行，避免选项被裁/横滚 */
@media (max-width: 860px) {
  .brief-row-3.brief-row { grid-template-columns: 1fr; gap:12px; }
}
/* AI 自动补全按钮：始终可见（adv-label 右侧） */
.brief-card .adv-label #btnBriefAuto,
#btnBriefAuto {
  margin-left: auto;
  flex: 0 0 auto;
  white-space: nowrap;
  visibility: visible;
  display: inline-flex;
  align-items: center;
}
/* 关键词输入框占满一行（full）下的正常宽度 */
.brief-col.full .brief-input {
  max-width: none;
}
/* ============================================================
   v21.2 · 出镜人物 / 口播语言（创作简报中间新增）
   用户反馈：中间缺「人」与「语言」两块；紧凑网格避免卡片过高
   ============================================================ */
#presenterOptions.opt-grid,
#langOptions.opt-grid {
  grid-template-columns: repeat(auto-fill, minmax(96px, 1fr));
  gap: 6px;
}
#presenterOptions .opt-card,
#langOptions .opt-card {
  padding: 6px 8px;
  min-height: 40px;
  border-radius: 8px;
}
#presenterOptions .opt-card .opt-icon,
#langOptions .opt-card .opt-icon {
  display: none;
}
#presenterOptions .opt-card .opt-name,
#langOptions .opt-card .opt-name {
  font-size: var(--fs-small);
  font-weight: 600;
  line-height: 1.2;
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
  word-break: break-word;
}
#presenterOptions .opt-card .opt-sub,
#langOptions .opt-card .opt-sub {
  font-size: var(--fs-nano);
  color: var(--t3, #94a3b8);
  line-height: 1.3;
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
#presenterOptions .opt-card.custom-add,
#langOptions .opt-card.custom-add {
  border-style: dashed;
  color: var(--brand-text, #165DFF);
  text-align: center;
}

/* ============================================================
   v21.2 · 修复「竖.../横...」截断根因
   v20.0.78 后置规则设置 -webkit-line-clamp:2 但从未重置
   前序规则的 white-space:nowrap —— nowrap 下文字永不换行，
   line-clamp 形同虚设，仍被截成「竖...」。（云端实测复现）
   ============================================================ */
.opt-grid.chip-grid .opt-card .opt-name,
.opt-grid.chip-grid .opt-card.compact .opt-name {
  white-space: normal;
}

/* v21.2.4 中文翻译块（非中文口播时展示） */
.copy-translation {
  margin-top: 8px;
  padding: 8px 10px;
  border-left: 3px solid var(--brand, #165DFF);
  background: var(--bg-2, #f8fafc);
  border-radius: 0 8px 8px 0;
}
.copy-translation .copy-tr-label {
  font-size: var(--fs-nano);
  font-weight: 600;
  color: var(--brand-text, #165DFF);
  margin-bottom: 4px;
  letter-spacing: .04em;
}
.copy-translation .copy-tr-body {
  font-size: var(--fs-small);
  color: var(--t2, #334155);
  line-height: 1.55;
  white-space: pre-wrap;
  word-break: break-word;
}

/* ---------- v21.x：MiniMax 海螺每日配额提示 ---------- */
.mini-max-quota-hint {
  display: inline-block;
  margin-left: 10px;
  font-size: 12px;
  color: var(--muted, #8b93a7);
  vertical-align: middle;
  letter-spacing: .2px;
}
.mini-max-quota-hint.mm-quota-zero {
  color: var(--danger, #F53F3F);
  font-weight: 600;
}
.opt-card.mm-quota-zero .opt-sub {
  color: var(--danger, #F53F3F);
  font-weight: 600;
}

/* ---------- P1-6 文案工作台：合规/方法论/创意方向结构化折叠 ---------- */
.copy-method, .copy-context {
  margin-top: 10px;
  border: 1px solid rgba(63,98,133,.22);
  border-radius: 8px;
  background: var(--bg-2, #fff);
  padding: 4px 10px 10px;
}
.copy-method summary, .copy-context summary {
  cursor: pointer;
  font-size: var(--fs-body, 14px);
  font-weight: 600;
  color: var(--t1, #2c3e50);
  padding: 6px 0;
  user-select: none;
}
.copy-care { font-size:12px; color: var(--muted, #8b93a7); font-weight: 400; margin-left: 6px; }
.copy-method-body, .copy-context-body { margin-top: 6px; }
.cm-ctx { font-size:14px; color: var(--t2, #4b5563); margin: 2px 0; line-height: 1.5; }
.cm-tips { margin-top: 8px; display: flex; flex-direction: column; gap: 6px; }
.cm-tip { font-size:14px; color: var(--t2, #4b5563); line-height: 1.5; padding: 6px 8px; background: rgba(63,98,133,.05); border-radius: 6px; }
.cm-badge { display: inline-flex; align-items: center; justify-content: center; margin-right: 6px; width: 18px; height: 18px; border-radius: 50%; background: var(--brand, #165DFF); color: #fff; font-size:12px; }
.cc-sec { margin: 6px 0; }
.cc-sec-h { font-size: 12px; font-weight: 700; color: var(--t1, #2c3e50); margin-bottom: 4px; }

/* v60.19: Prompt 管理首屏骨架（异步加载 2-5s 不再白表） */
.pm-loading {
  text-align: center;
  color: var(--t2, #64748b);
  font-size:14px;
  padding: 18px 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
}
.pm-pulse {
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background: var(--brand, #165DFF);
  display: inline-block;
  animation: pmPulse 1s ease-in-out infinite;
}
@keyframes pmPulse {
  0%, 100% { opacity: 0.3; transform: scale(0.8); }
  50% { opacity: 1; transform: scale(1.15); }
}

/* v60.38: 顶部资产下拉——状态条/组头/草稿徽标/确认 */
.td-asset-statusbar { display: flex; gap: 6px; margin-bottom: 10px; }
.td-asset-statusbar .st-btn {
  border: 1px solid var(--border, #e2e8f0);
  background: transparent;
  color: var(--t2);
  border-radius: 8px;
  padding: 4px 12px;
  font-size: 12px;
  cursor: pointer;
}
.td-asset-statusbar .st-btn.st-active { background: var(--brand, #165DFF); color: #fff; border-color: var(--brand-text, #165DFF); }
[data-theme="dark"] .td-asset-statusbar .st-btn.st-active { color: #0E42D2; }
.td-group-head {
  font-size: 12px;
  font-weight: 600;
  color: var(--t2);
  margin: 10px 0 6px;
  padding-bottom: 4px;
  border-bottom: 1px solid var(--line, #eef2f7);
}
.td-asset-draft {
  position: absolute; top: 6px; left: 6px;
  padding: 2px 7px; border-radius: 7px;
  background: rgba(217, 119, 6, 0.92); color: #fff;
  font-size:12px; z-index: 2;
}
.st-confirm { background: #108050 !important; }

/* v60.37: 资产库分类分组视图 */
#assetGrid.is-grouped { display: block; }
.asset-group { margin-bottom: 18px; }
.asset-group-head {
  display: flex; align-items: baseline; gap: 8px;
  font-size:14px; font-weight: 600; color: var(--t1);
  padding: 6px 2px 8px;
}
.asset-group-head small { font-weight: 400; color: var(--t3); font-size: 12px; }
.asset-group-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  gap: 12px;
}
#btnGroupBy.active { background: var(--bg-elev, #eef2ff); color: var(--brand-text, #165DFF); }

/* v60.36: 草稿徽标 + 确认入资产按钮 */
.media-card-draft {
  position: absolute;
  top: 8px;
  left: 8px;
  padding: 2px 8px;
  border-radius: 8px;
  background: rgba(217, 119, 6, 0.92);
  color: #fff;
  font-size:12px;
  z-index: 3;
}
.mc-act.confirm {
  background: rgba(16, 126, 80, 0.92);
  color: #fff;
}
.mc-act.confirm:hover { background: #0f7a50; }

/* v60.29: 低质/空白画面标识（资产库） */
.media-card-lowblur .media-card-thumb::after {
  content: '画面平淡/模糊，建议重生成';
  position: absolute;
  left: 6px;
  bottom: 6px;
  padding: 2px 6px;
  border-radius: 6px;
  background: rgba(217, 119, 6, 0.9);
  color: #fff;
  font-size:12px;
  z-index: 3;
}

/* ---------- v21.x 屏幕与交互事实源（提示条 + 屏幕位置标注） ---------- */
.screen-fact-bar {
  margin-top: 10px;
  padding: 10px 12px;
  border: 1px dashed var(--accent, #165DFF);
  background: color-mix(in srgb, var(--accent, #165DFF) 6%, transparent);
  border-radius: 10px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.screen-fact-bar.hidden { display: none; }
.sf-title { font-weight: 600; font-size:14px; color: var(--text, #e8eaf0); }
.sf-text { font-size: 12px; color: var(--muted, #9aa3b5); line-height: 1.5; }
.sf-thumbs { display: flex; gap: 6px; flex-wrap: wrap; }
.sf-thumbs img { width: 64px; height: 44px; object-fit: cover; border-radius: 6px; border: 1px solid rgba(255,255,255,.12); }
.sf-actions { display: flex; gap: 8px; flex-wrap: wrap; }
.sf-rect-row { display: flex; align-items: center; gap: 4px; flex-wrap: wrap; font-size: 12px; color: var(--muted, #9aa3b5); }
.sf-rect-row.hidden { display: none; }
.sf-rect-label { margin-right: 4px; }
.sf-rect-input { width: 58px; padding: 3px 6px; border-radius: 6px; border: 1px solid rgba(255,255,255,.15); background: rgba(0,0,0,.25); color: var(--text); font-size: 12px; }

/* v60.78: 顶栏「项目」下拉 — 标签页 + 卡片网格（示范案例/我的项目） */
.top-dropdown.td-wide {
  /* 修复：项目下拉固定760px在窄视口下左边缘出屏被裁。改为响应式上限，网格auto-fill自动换行不横向溢出。 */
  width: min(760px, calc(100vw - 48px));
  max-width: calc(100vw - 48px);
}
.top-dropdown .td-tabs { display: flex; gap: 4px; margin-bottom: 8px; border-bottom: 1px solid var(--line, #e3e3e8); padding-bottom: 6px; }
.top-dropdown .td-tab { border: none; background: transparent; color: var(--text-secondary, #475569); font-size:14px; font-weight: 500; padding: 4px 10px; cursor: pointer; border-radius: 6px; }
.top-dropdown .td-tab:hover { background: var(--bg-2, #f1f5f9); }
.top-dropdown .td-tab.active { color: var(--brand-text, #165DFF); font-weight: 600; background: rgba(22,93,255,.08); }
.top-dropdown .td-pane.hidden { display: none !important; }
/* v61.42 BUG-7：demo 下拉 33 张卡横向 pc-grid(flex-nowrap) 只显示前 3 行 18 张且不滚动 →
    demo 面板改纵向网格换行（4 列 150px 卡），剩余卡片滚动可达 */
#demoPane .pc-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(148px, 1fr));
  gap:12px;
  max-height: 430px;
  overflow-y: auto;
  overflow-x: hidden;
  padding: 2px;
  scrollbar-width: thin;
  scroll-snap-type: y proximity;
}
#demoPane .pc-grid > * {
  scroll-snap-align: start;
}
#demoPane .pc-card {
  width: auto;
  height: auto;
  flex: none;
  min-height: 128px;
  padding: 8px;
  text-align: left;
}
#demoPane .pc-card-thumb {
  width: 100%;
  aspect-ratio: 16/10;
  flex: none;
}
#demoPane .pc-card-name {
  font-size: 12px;
  -webkit-line-clamp: 2;
  margin-top: 4px;
  text-align: left;
}
/* 让 demo 下拉与其他面板同宽（33 张卡需要更宽布局） */
#demoPane { min-width: 100%; }
.top-dropdown .td-pane .pc-grid { max-width: 100%; }


/* v60.79: 顶栏重排——我的项目, 资产, 示范案例, 主题, WIKI, Agent, 调优, 配额, 用户 */
.topbar-right #topItemProject { order: 1; }
.topbar-right #topItemAsset { order: 2; }
.topbar-right #topDemoBtn { order: 3; }
.topbar-right #themeToggle { order: 4; }
.topbar-right #wikiBtn { order: 5; }
.topbar-right #agentsBtn { order: 6; }
.topbar-right #tunerLaunchBtn { order: 7; }
.topbar-right #quotaPill { order: 8; }
.topbar-right .artbus-user-trigger, .topbar-right .artbus-login-btn { order: 9; }

/* v60.79 / v61.38: 资产下拉与「项目」下拉统一——td-wide 宽度、头部对齐、缩略图渐进加载、
   卡片尺寸保持一致（不再挤在 320px 窄面板、标题不再被截断） */
.td-asset-grid { grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap:12px; max-height: 470px; overflow-y: auto; padding: 2px; }
.td-group-head { grid-column: 1 / -1; font-size: 12px; font-weight: 600; color: var(--t2, #475569); padding: 4px 2px 6px; border-bottom: 1px solid var(--line-subtle, #e2e8f0); margin-bottom: 2px; }
.td-asset-thumb { aspect-ratio: 4 / 3; background: linear-gradient(135deg, var(--bg-3, #eef0f3), var(--bg-2, #f6f7f9)); }
/* v61.38 渐进加载占位：图片 decode 前显示缓入 + 图标，避免纯色块错觉 */
.td-asset-thumb::before {
  content: '🖼';
  font-size: 22px;
  opacity: .35;
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
}
.td-asset-thumb img { opacity: 0; transition: opacity .25s ease; position: relative; z-index: 1; }
.td-asset-thumb img.loaded { opacity: 1; }
.td-asset-thumb img.loaded + * { z-index: 2; }
.td-asset-name { font-size: 12px; padding: 6px 8px; }
.td-asset-meta { font-size:12px; }
.td-asset-actions { padding: 6px 8px 8px; }
.td-asset-actions button { font-size: 12px; padding: 5px 0; }
/* 与项目下拉头部统一：右侧操作区不挤压标题 */
.top-dropdown.td-wide .top-dropdown .td-head,
.top-dropdown .td-head { gap: 8px; }
.top-dropdown .td-head-right { flex: none; margin-left: auto; }
.top-dropdown .td-title { font-size:16px; }
/* v61.38：下拉只展示前 N 项时的提示行 */
.td-more-hint {
  grid-column: 1 / -1;
  margin-top: 4px;
  padding: 8px 10px;
  border: 1px dashed var(--line, #e3e3e8);
  border-radius: 8px;
  font-size: 12px;
  color: var(--t3, #94a3b8);
  text-align: center;
  background: var(--bg-2, #f6f7f9);
}

/* v61.14 step2：产品视觉卡编辑区（结构化视觉指纹） */
.visual-card-editor { margin-top: 10px; padding: 12px 14px; border: 1px solid var(--line, #e2e8f0); border-radius: 10px; background: var(--bg-2, #fff); }
.visual-card-editor-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 10px; }
.visual-card-editor-head .sn-title { font-size:14px; font-weight: 600; }
.visual-card-editor-hint { font-size:12px; color: var(--t3, #94a3b8); }
.visual-card-grid { display: grid; grid-template-columns: 88px 1fr; gap: 8px 10px; align-items: center; }
.visual-card-grid label { font-size: 12px; color: var(--t2, #475569); white-space: nowrap; }
.visual-card-grid input, .visual-card-grid textarea { width: 100%; padding: 6px 8px; font-size: 12px; border: 1px solid var(--line, #e2e8f0); border-radius: 6px; background: var(--bg-1, #f8fafc); color: var(--t1, #0f172a); }
.visual-card-grid textarea { resize: vertical; min-height: 36px; }
.visual-card-editor-foot { display: flex; gap: 8px; margin-top: 12px; }
.visual-card-editor-foot .btn { font-size: 12px; }



/* v61.16 分镜卡片窄屏兜底：侧栏收窄、左图右文在窄屏回落为上下布局，保证内容完整 */
@media (max-width: 720px) {
  .storyboard-card {
    flex-direction: column;
  }
  .shot-frames {
    flex: 1 1 auto;
    min-width: 0;
    border-right: none;
    border-bottom: 1px solid var(--line);
    flex-direction: row;   /* 窄屏两帧并排，省纵向空间 */
  }
  .shot-frames .frame-cell {
    flex: 1 1 0;
  }
}

/* v61.17 分镜「优化提示词」副按钮：主按钮下全宽 ghost，与主按钮留间距 */
.sb-step-card .sb-opt-btn {
  margin-top: 6px;
  width: 100%;
  font-size: var(--fs-body);
  color: var(--brand-text);
  border-color: var(--brand-text);
  background: rgba(22,93,255,.05);
}
.sb-step-card .sb-opt-btn:disabled {
  opacity: .55;
  cursor: not-allowed;
}

/* v61.17 分镜卡片「已优化提示词」标记 */
.sb-optimized-tag {
  padding: 0 14px 8px;
}
.sb-optimized-tag .frame-badge {
  background: rgba(0,180,42,.9);
}

/* v61.20 产品卡工作区（分类簇下方） */
.pcw-toolbar { display:flex; align-items:center; gap:12px; flex-wrap:wrap; padding:8px 0; }
.pcw-all { display:inline-flex; align-items:center; gap:6px; font-size:14px; color:var(--t1); cursor:pointer; }
.pcw-tip { font-size:12px; color:var(--t3,#94a3b8); }
.pcw-list { display:flex; flex-direction:column; gap:12px; }
.pcw-group { border:1px solid var(--line,#e3e3e8); border-radius:10px; padding:10px 12px; background:var(--bg-1,#fff); }
.pcw-row { display:flex; align-items:center; gap:12px; flex-wrap:wrap; }
.pcw-check { display:inline-flex; align-items:center; gap:8px; cursor:pointer; font-size:14px; }
.pcw-check input { width:15px; height:15px; accent-color: var(--brand-text); }
.pcw-dim { font-size:12px; color:var(--t3,#94a3b8); background:var(--bg-3,#eef0f3); border-radius:4px; padding:2px 6px; }
.pcw-vc { font-size:12px; color:var(--t2); display:inline-flex; align-items:center; gap:4px; margin-left:auto; }
.pcw-vc input { width:48px; padding:2px 4px; font-size:12px; border:1px solid var(--line); border-radius:4px; }
.pcw-stat { font-size:12px; color: var(--brand-text); }
.pcw-caption { font-size:12px; color:var(--t2); margin:6px 0; line-height:1.5; }
.pcw-preview { margin-top:8px; }
.pcw-card { display:flex; flex-direction:column; gap:8px; }
.pcw-imgs { display:flex; gap:6px; flex-wrap:wrap; }
.pcw-img { width:84px; height:84px; object-fit:cover; border-radius:6px; border:1px solid var(--line); }
/* v61.46 未生成占位：虚线框+提示，不再显示容易误解的代表图 */
.pcw-imgs.pcw-imgs-placeholder {
  display:grid; place-items:center; min-height:96px; padding:10px 12px;
  border:1px dashed var(--line-strong, #d0d4dc); border-radius:8px; background:var(--bg-2, #f5f6f8);
}
.pcw-imgs.pcw-imgs-placeholder .pcw-noimg { color:var(--t3, #94a3b8); font-size:12px; text-align:center; }
/* v61.43 组合卡拼图：拼图完成替换单张预览 → 整卡全宽展示 */
.pcw-imgs.pcw-imgs-collage { display:block; }
.pcw-imgs.pcw-imgs-collage .pcw-img,
.pcw-img.pcw-collage,
.pcw-imgs .pcw-img.pcw-collage { width:100%; height:auto; max-width:420px; border-radius:8px; }
.pcw-noimg { font-size:12px; color:var(--t3); }
.pcw-text { font-size:14px; color:var(--t1); line-height:1.55; }
.pcw-text b { color: var(--brand-text); }
.pcw-fp { font-size:12px; color:var(--t2); margin:2px 0; }
.pcw-actions { display:flex; gap:8px; flex-wrap:wrap; }
.pcw-actions .btn.tiny { flex:0 0 auto; }

/* v61.22 产品名称行：从资产库选产品按钮与输入框同行（输入框撑满，按钮在其右） */
.product-name-row { display: flex; gap: 8px; align-items: center; }
.product-name-row input { flex: 1; min-width: 0; }
.product-name-row .btn { flex: 0 0 auto; white-space: nowrap; }

/* v61.22 Agent 调用区：思考内容高度调大（原 110px 太小，下方留白大） */
.agent-roster-think-body { max-height: 380px; }
.activity-panel .act-thinking-body { max-height: 360px; }

/* ============================================================
   v61.23 项目下拉弹窗专业化重做（覆盖旧排版）
   问题：筛选条无排版、卡片单行横滚挤成一排、缩略图花哨渐变、弹窗无层次
   解法：筛选胶囊化、卡片改网格多列、缩略图中性化、弹窗加宽+阴影。
   全部限定在 .top-dropdown / #projectDropdown 作用域，不波及其他面板。
   ============================================================ */
.top-dropdown.td-wide {
  /* 修复：原 position:absolute; right:0 锚定在项目按钮，固定900px 面板在窄视口下左/右缘被裁。
     改为 position:fixed 视口水平居中 + 响应式宽度上限，保证面板两缘始终在视口内。 */
  position: fixed;
  top: 60px;
  left: 50%;
  transform: translateX(-50%);
  width: min(900px, calc(100vw - 32px));
  max-width: calc(100vw - 32px);
  right: auto;
  border-radius: 16px;
  box-shadow: 0 18px 60px rgba(15, 23, 42, .18), 0 4px 16px rgba(15, 23, 42, .08);
  background: var(--bg-1, #fff);
  border: 1px solid var(--line, #e2e8f0);
  overflow: hidden;
}
.top-dropdown .td-pane {
  padding: 18px 20px 16px;
}
.top-dropdown .td-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 14px;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--line, #eef0f3);
}
.top-dropdown .td-title {
  font-size: 16px;
  font-weight: 700;
  color: var(--t1, #1a1f2e);
  letter-spacing: .2px;
}
.top-dropdown .td-new {
  flex: 0 0 auto;
  background: var(--brand, #165DFF);
  color: #fff;
  border: none;
  border-radius: 8px;
  font-size:14px;
  font-weight: 600;
  padding: 7px 14px;
  cursor: pointer;
  transition: background .15s ease, transform .15s ease;
}
[data-theme="dark"] .top-dropdown .td-new { color: #0E42D2; }
.top-dropdown .td-new:hover {
  background: var(--brand-soft, #165DFF);
  box-shadow: 0 4px 12px rgba(22,93,255,.28);
  transform: translateY(-1px);
}
/* 筛选条：胶囊 + 下拉对齐，专业工具栏感 */
.top-dropdown .proj-filter {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  margin-bottom: 16px;
  padding: 8px 10px;
  background: var(--bg-2, #f7f8fa);
  border-radius: 12px;
}
.top-dropdown .proj-filter .pf {
  border: 1px solid var(--line, #e2e8f0);
  background: var(--bg-1, #fff);
  color: var(--t2, #525866);
  border-radius: 999px;
  font-size:14px;
  font-weight: 500;
  padding: 5px 14px;
  cursor: pointer;
  transition: all .15s ease;
}
.top-dropdown .proj-filter .pf:hover {
  border-color: var(--brand-text, #165DFF);
  color: var(--brand-text, #165DFF);
}
.top-dropdown .proj-filter .pf.active {
  background: var(--brand, #165DFF);
  color: #fff;
  border-color: var(--brand-text, #165DFF);
  box-shadow: 0 2px 8px rgba(22,93,255,.28);
}
.top-dropdown .proj-filter select {
  border: 1px solid var(--line, #e2e8f0);
  background: var(--bg-1, #fff);
  color: var(--t2, #525866);
  border-radius: 8px;
  font-size:14px;
  padding: 5px 10px;
  cursor: pointer;
}
.top-dropdown .proj-filter select:hover {
  border-color: var(--brand-text, #165DFF);
}
/* 卡片网格：单行横滚 → 多列自适应 wrap */
.top-dropdown .pc-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));
  gap: 12px;
  padding: 2px 2px 8px;
  max-height: 380px;
  overflow-y: auto;
  overflow-x: hidden;
}
.top-dropdown .pc-grid > * { flex: none; }
/* 卡片统一尺寸，网格对齐 */
.top-dropdown .pc-card {
  width: auto;
  height: auto;
  min-height: 128px;
  flex: none;
  border: 1px solid var(--line, #e2e8f0);
  border-radius: 12px;
  padding: 10px;
  background: var(--bg-1, #fff);
  gap: 8px;
  cursor: pointer;
  text-align: left;
  transition: border-color .15s ease, box-shadow .15s ease, transform .15s ease;
}
.top-dropdown .pc-card:hover {
  border-color: var(--brand-text, #165DFF);
  box-shadow: 0 4px 10px rgba(22,93,255,.12);
  transform: translateY(-3px);
}
.top-dropdown .pc-card.active {
  border-color: var(--brand-text, #165DFF);
  box-shadow: inset 0 0 0 1px var(--brand, #165DFF), 0 6px 18px rgba(22,93,255,.18);
}
.top-dropdown .pc-card.active .pc-card-name { color: var(--brand-text, #165DFF); }
/* 缩略图：统一中性浅底 + 居中，不再花哨渐变 */
.top-dropdown .pc-card-thumb {
  height: 68px;
  min-height: 0;
  background: var(--bg-3, #eef0f3);
  border-radius: 9px;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}
.top-dropdown .pc-thumb-placeholder,
.top-dropdown .pc-thumb-initial {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  max-width: none;
  max-height: none;
  border: none;
  border-radius: 9px;
  background: var(--brand-soft, #4080FF);
  color: #fff;
  font-size: 22px;
  font-weight: 700;
}
/* 名称/时间：清晰层次 */
.top-dropdown .pc-card-name {
  font-size:14px;
  font-weight: 600;
  color: var(--t1, #1a1f2e);
  line-height: 1.3;
  max-height: 2.6em;
  -webkit-line-clamp: 2;
}
.top-dropdown .pc-card-meta {
  font-size:12px;
  color: var(--t3, #94a3b8);
  line-height: 1.2;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
/* 新建项目卡 */
.top-dropdown .pc-card-new {
  background: var(--bg-2, #f7f8fa);
  border-style: dashed;
  border-color: var(--line-strong, #d0d4dc);
}
.top-dropdown .pc-card-new .pc-card-thumb {
  background: transparent;
}
.top-dropdown .pc-new-plus {
  color: var(--t3, #94a3b8);
}
/* 底部跳转 */
.top-dropdown .td-goto {
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px solid var(--line, #eef0f3);
  display: block;
  text-align: center;
  font-size:14px;
  color: var(--brand-text, #165DFF);
  font-weight: 600;
}

/* ============================================================
   v61.24 全局面板标题字体统一（用户反馈：产品名称/产品图片或视频等标题字号不一致）
   统一为 14px / 600 / --t1，让每个卡片/小节标题同级、专业。
   ============================================================ */
.step0-meta-card > .field > span,
.step0-meta-card .product-context-collapse .pc-title,
.step0-meta-card > .field > span:not(.field-hint),
.free-upload-head span:first-child,
.analysis-card .structure-notes-head .sn-title,
.analysis-card .pcm-head > span,
.analysis-card .pcm-cluster-head > span,
.visual-card-editor-head .sn-title {
  font-size: var(--fs-h3);
  font-weight: 600;
  color: var(--t1);
  letter-spacing: .01em;
}
/* 产品分析 / 分类簇 / 产品卡 标题（合并横卡里） */
.pcm-head > span,
.pcm-cluster-head > span {
  font-weight: 600;
  color: var(--t1);
}
/* 次级提示（hint-sub / field-hint）保持小字号，不参与统一 */
.hint-sub, .field-hint, .pc-sub, .cp-sub, .hint.sm { font-size: var(--fs-nano); }

/* v61.25 项目卡：分组名 + 状态徽标（筛选条已删，信息上卡） */
.top-dropdown .pc-card-status {
  position: absolute;
  top: 6px;
  right: 6px;
  z-index: 2;
  font-size:12px;
  font-weight: 600;
  padding: 2px 6px;
  border-radius: 999px;
  color: #fff;
  line-height: 1;
}
.top-dropdown .pc-card-status.done { background: rgba(0,180,42,.92); }
.top-dropdown .pc-card-status.running { background: rgba(22,93,255,.92); }
.top-dropdown .pc-card-thumb { position: relative; }
.top-dropdown .pc-card-group {
  font-weight: 600;
  color: var(--t2, #525866);
}

/* v61.31 Agent 调用区设计感增强（Sub Agent B 审计 B2/B4/B5） */
.agent-roster-item {
  border: 1px solid var(--line, #e2e8f0);
  background: var(--bg-1, #fff);
  padding: 8px 10px;
  border-radius: 8px;
}
.agent-roster-item:hover { background: var(--bg-2, #f1f5f9); }
.agent-roster-item[data-status="active"] {
  box-shadow: inset 3px 0 0 var(--brand, #165DFF);
  background: rgba(22,93,255,.04);
}
.agent-roster-status {
  font-size: var(--fs-nano, 11px);
}
.agent-roster-status[data-status="active"] {
  background: rgba(22,93,255,.14);
}
.agent-roster-status[data-status="idle"] {
  background: rgba(148,163,184,.12);
}
.agent-roster-avatar {
  font-weight: 700;
  font-size:14px;
}
.agent-roster-item[data-status="active"] .agent-roster-avatar {
  box-shadow: 0 0 0 3px rgba(22,93,255,.25);
}

/* v61.32 B-P1 A5/A7 分类簇卡片细节修复 */
/* A5: .cluster-card-actions 原无 display → 按钮竖排；改 flex 横排 + select 伸缩 */
.cluster-card-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  margin-top: 6px;
}
.cluster-card-actions .cluster-merge {
  flex: 1 1 100px;
  min-width: 0;
}
/* A7: .cluster-caption min-height:80px 固定 → 自适应(2行起步,可拖动加高) */
.cluster-caption {
  min-height: 44px;
}

/* v61.32 B-P1 C1/C3/C4 标题 token 统一（14px/600/--t1） */
.pc-title {
  font-size: var(--fs-h3);
  font-weight: 600;
}
.structure-notes-head > span:first-child,
.structure-notes-head .sn-title {
  font-size: var(--fs-h3);
  font-weight: 600;
}
.analysis-card .structure-notes-head .sn-title {
  font-size: var(--fs-h3);
  font-weight: 600;
}
.visual-card-editor-head .sn-title {
  font-size: var(--fs-h3);
  font-weight: 600;
}

/* v61.32 B-P2 E 产品卡工作区布局优化 */
.pcw-imgs .pcw-img {
  width: 112px;
  height: 112px;
}
.pcw-toolbar .pcw-tip {
  flex-basis: 100%;
  order: 10;
}
.pcw-actions .btn.primary {
  font-weight: 600;
}

/* v61.90 生成前调试卡排版优化: 分段卡片, 清晰易读 */
.gen-debug-card { border: 1px solid var(--line-strong, #d0d4dc); border-radius: 10px; background: var(--bg-1, #f8fafc); margin: 10px 0; overflow: hidden; }
.gen-debug-card > summary { cursor: pointer; padding: 10px 14px; font-weight: 600; font-size:14px; color: var(--t1, #1a1f2e); background: linear-gradient(90deg, rgba(22,93,255,.08), rgba(22,93,255,.02)); border-bottom: 1px solid var(--line, #e2e8f0); }
.gen-debug-card > summary:hover { background: rgba(22,93,255,.12); }
.gen-debug-body { padding: 10px 14px; }
.gen-debug-body .sn-dim { color: var(--t3, #64748b); font-size: 12px; margin-bottom: 8px; }
/* 调试卡内部细节块: 浅色卡片, 避免黑底刺眼 */
.gen-debug-body details { border: 1px solid var(--line, #e2e8f0); border-radius: 8px; margin: 6px 0; background: var(--bg-2, #f1f5f9); }
.gen-debug-body details > summary { cursor: pointer; font-size: 12px; color: var(--t1, #1a1f2e); padding: 6px 10px; font-weight: 600; }
.gen-debug-body details[open] > summary { border-bottom: 1px dashed var(--line, #d0d4dc); }
.gen-debug-body details pre { margin: 0; padding: 8px 12px; background: #fbfdff; color: #1e293b; font-size: 12px; line-height: 1.6; white-space: pre-wrap; word-break: break-all; max-height: 320px; overflow: auto; border-radius: 0 0 8px 8px; }
.gen-debug-body .dg-sec-h { font-size: 12px; font-weight: 700; color: var(--brand-text, #165DFF); margin: 10px 0 4px; padding-left: 8px; border-left: 3px solid var(--brand, #165DFF); }
.gen-debug-body .dg-kv { display: flex; flex-wrap: wrap; gap: 6px 18px; font-size: 12px; color: var(--t2, #475569); padding: 4px 8px; }
.gen-debug-body .dg-kv b { color: var(--t1, #1a1f2e); }


/* v3: 视频比例/选项卡防换行错乱（竖屏、超宽屏 等标签被挤成「屏、超」） */
.opt-card.opt-card .opt-name, .opt-card .opt-name { white-space: nowrap; }
/* v3: 平台/时长/比例等 chip 选项统一换行 flex，修复「>4 项渲染整行长条遮底」 */
.opt-grid.chip-grid { display: flex; flex-wrap: wrap; gap: 9px; align-items: center; }
.opt-grid.chip-grid .opt-card { flex: 0 0 auto; max-width: 100%; }
/* ===== v21.x B+C：Agent「调用面板」——阶段分组 + 统一线性图标 + 单组青色调 + 实时看板 ===== */
/* ① 阶段分组条（产品理解→结构→创意→视频导演→营销→制片汇总） */
.agent-board-group { display: flex; flex-direction: column; gap: 6px; margin-top: 8px; flex: 0 0 auto; }
.agent-board-group:first-child { margin-top: 0; }
.agent-board-group-head {
  display: flex; align-items: center; gap: 6px;
  font-size: var(--fs-small, 12px); font-weight: 600; color: var(--t1, #0f172a);
}
.agent-board-group-head i { width: 14px; height: 14px; color: var(--brand-text, #165DFF); flex-shrink: 0; }
.agent-board-group-name { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.agent-board-group-sum { font-size: var(--fs-micro, 11px); color: var(--t3, #94a3b8); font-weight: 500; white-space: nowrap; }
.agent-board-group-cards { display: flex; flex-direction: column; gap: 6px; }

/* ② 统一线性图标 + 单组青色调（取代五彩渐变，按组一个青系色调） */
#activityAgentRoster .agent-board-group .agent-roster-avatar,
.agent-board-group .agent-roster-avatar {
  width: 30px; height: 30px;
  border-radius: 8px;
  background: var(--grad-brand);
  color: #fff;
  box-shadow: 0 2px 5px rgba(2,132,199,.18);
}
#activityAgentRoster .agent-board-group .agent-roster-avatar i,
.agent-board-group .agent-roster-avatar i { width: 15px; height: 15px; }

/* ③ 卡片信息列：名称/角色/技能/耗时 */
.agent-roster-info { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.agent-roster-info .agent-roster-name { flex: none; width: 100%; font-weight: 600; font-size: var(--fs-h3, 14px); line-height: 1.3; color: var(--t1, #0f172a); }
.agent-roster-role { font-size: var(--fs-small, 12px); line-height: 1.35; color: var(--t3, #94a3b8); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.agent-roster-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 2px 8px; font-size: var(--fs-nano, 11px); line-height: 1.35; color: var(--t3, #94a3b8); min-width: 0; }
.agent-roster-skills { min-width: 0; white-space: normal; overflow-wrap: anywhere; word-break: break-word; max-width: 100%; }
.agent-roster-dur { color: var(--accent, #165DFF); font-weight: 600; flex-shrink: 0; }

/* ④ 状态流转：待命(灰点)→运行中(青圈 spinner)→已完成(绿点)/失败(红点) */
.agent-roster-status { display: inline-flex; align-items: center; gap: 5px; flex-shrink: 0; font-size: var(--fs-micro, 11px); padding: 2px 8px; border-radius: 999px; }
.agent-roster-dot { width: 7px; height: 7px; border-radius: 50%; background: #86909c; flex-shrink: 0; transition: background .18s ease; }
.agent-roster-status[data-status="active"] .agent-roster-dot {
  width: 10px; height: 10px; border: 2px solid #165DFF; border-top-color: transparent; background: transparent;
  animation: agentBoardSpin .8s linear infinite;
}
.agent-roster-status[data-status="active"] .agent-roster-status-text { color: #165DFF; font-weight: 600; }
.agent-roster-status[data-status="done"] .agent-roster-dot { background: #00B42A; }
.agent-roster-status[data-status="done"] .agent-roster-status-text { color: #00B42A; }
.agent-roster-status[data-status="error"] .agent-roster-dot { background: #F53F3F; }
.agent-roster-status[data-status="error"] .agent-roster-status-text { color: #F53F3F; font-weight: 600; }
.agent-roster-status[data-status="pending"] .agent-roster-status-text { color: var(--t3, #94a3b8); }
@keyframes agentBoardSpin { to { transform: rotate(360deg); } }

/* ⑤ 卡片整体状态高亮 */
.agent-roster-item[data-status="active"] { box-shadow: inset 3px 0 0 #165DFF; background: rgba(22,93,255,.05); }
.agent-roster-item[data-status="done"] { box-shadow: inset 3px 0 0 rgba(0,180,42,.35); }
.agent-roster-item[data-status="error"] { background: rgba(245,63,63,.04); box-shadow: inset 3px 0 0 rgba(245,63,63,.4); }

/* ⑥ 制片人汇总（unifiedPrompt / creativeBrief 突出展示） */
.prod-summary { margin-bottom: 8px; padding: 8px 10px; border-radius: 8px; background: rgba(22,93,255,.06); border: 1px solid rgba(22,93,255,.22); }
.prod-summary-title { font-size: var(--fs-small, 12px); font-weight: 600; color: #165DFF; margin-bottom: 4px; }
.prod-sum-row { display: flex; flex-direction: column; gap: 2px; margin: 4px 0; }
.prod-sum-key { font-size: var(--fs-micro, 11px); font-weight: 600; color: #165DFF; }
.prod-sum-val { font-size: var(--fs-small, 12px); color: var(--t2, #475569); white-space: pre-wrap; word-break: break-word; line-height: 1.5; max-height: 180px; overflow: auto; }

/* ⑦ 看板图例（待命/运行中/已完成/失败） */
.board-legend { display: flex; flex-wrap: wrap; gap: 8px 12px; margin: 0 0 6px; font-size: var(--fs-micro, 11px); color: var(--t3, #94a3b8); }
.board-legend .blg { display: inline-flex; align-items: center; gap: 4px; }
.board-legend .blg-dot { width: 8px; height: 8px; border-radius: 50%; background: #86909c; }
.board-legend .blg-dot.active { width: 10px; height: 10px; border: 2px solid #165DFF; border-top-color: transparent; background: transparent; animation: agentBoardSpin .8s linear infinite; }
.board-legend .blg-dot.done { background: #00B42A; }
.board-legend .blg-dot.error { background: #F53F3F; }

/* ⑧ 深色主题适配 */
[data-theme="dark"] .agent-roster-item[data-status="active"] { background: rgba(22,93,255,.10); }
[data-theme="dark"] .agent-roster-info .agent-roster-name { color: var(--t1, #f1f5f9); }
[data-theme="dark"] .prod-summary { background: rgba(22,93,255,.10); }
[data-theme="dark"] .agent-board-group-head { color: var(--t1, #f1f5f9); }

/* ⓐ vXX 修复：AGENT 调用面板可滚动 —— #activityAgentBody 改为弹性列容器，分组列表填充可用高度并内部滚动，
   不再被 .activity-section-body 的 overflow:hidden 截断（9 个 Agent 分组可滚动到「制片/视频导演/营销」最底）。
   仅调整滚动容器，不改变 分组/状态流转/实时看板 布局；滚动条细/克制（深空青 token）。 */
#activityAgentBody { display: flex; flex-direction: column; min-height: 0; }
#activityAgentRoster.agent-roster,
.agent-roster {
  overflow-y: auto;
  overflow-x: hidden;
  scrollbar-width: thin;
  scrollbar-color: rgba(13, 148, 136, .55) rgba(13, 148, 136, .08);
}
#activityAgentRoster.agent-roster::-webkit-scrollbar,
.agent-roster::-webkit-scrollbar { width: 6px; height: 6px; }
#activityAgentRoster.agent-roster::-webkit-scrollbar-track,
.agent-roster::-webkit-scrollbar-track { background: rgba(13, 148, 136, .08); border-radius: 999px; }
#activityAgentRoster.agent-roster::-webkit-scrollbar-thumb,
.agent-roster::-webkit-scrollbar-thumb {
  background: rgba(13, 148, 136, .5);
  border-radius: 999px;
  border: 1px solid transparent;
  background-clip: content-box;
}
#activityAgentRoster.agent-roster::-webkit-scrollbar-thumb:hover,
.agent-roster::-webkit-scrollbar-thumb:hover { background: rgba(13, 148, 136, .8); }

/* ⓑ vXX 修复：空闲 Agent 思考行的轻量占位文案（非空白）——点击「空闲中」Agent 不再出现空块 */
.agent-roster-think-idle { font-style: italic; opacity: .8; }
[data-theme="dark"] .agent-roster-think-idle { color: var(--t3, #94a3b8); }

.opt-grid { display: flex; flex-wrap: wrap; gap:12px; }

/* Phase 2 补图选择器：空维度占位卡片 + 图片挑选 modal 的轻量样式。
   整套风格延续 `.cluster-noimg` / `.obs-modal` 既有用法，不引入新设计 token。 */
.cluster-noimg-empty { flex-direction: column; align-items: flex-start; gap: 8px; padding: 12px; border: 1px dashed var(--line); border-radius: 8px; background: var(--bg-1); }
.cluster-noimg-empty > span { color: var(--t3,#94a3b8); font-size: 12px; }
.cluster-noimg-empty .btn { white-space: nowrap; }

/* ============================================================
 * 分镜（Storyboard）深度改造 · vNext
 * 目标：
 *   ① 卡片排版更专业清晰（统一网格、视觉层级、状态色）
 *   ② 每镜卡片可独立编辑（增/删/上移/下移/重排）
 *   ③ 编辑后标脏 + 顶部"需重新生成视频"提示
 *   ④ 空态/超时/失败态有专属样式
 * ============================================================ */

/* 卡片整体：更专业的间距 / 圆角 / 阴影 */
.storyboard-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap:16px;
  margin-top: 12px;
}

/* 单卡：左帧右文 + 顶部工具条 */
.storyboard-card {
  position: relative;
  background: var(--bg-1, #fff);
  border: 1px solid var(--line, #e3e3e8);
  border-radius: 12px;
  overflow: hidden;
  display: flex;
  flex-direction: row;
  align-items: stretch;
  transition: border-color .2s, box-shadow .2s, transform .15s;
}
.storyboard-card:hover {
  border-color: rgba(14, 165, 233, .45);
  box-shadow: 0 4px 16px rgba(14, 165, 233, .08);
}

/* 顶部状态色条：用左侧 3px 强调状态 */
.storyboard-card::before {
  content: "";
  position: absolute;
  left: 0; top: 0; bottom: 0;
  width: 3px;
  background: var(--line, #e3e3e8);
  pointer-events: none;
}
.storyboard-card.status-done::before  { background: rgba(34, 197, 94, .85); }
.storyboard-card.status-error::before { background: rgba(245,63,63, .85); }
.storyboard-card.status-loading::before { background: rgba(14, 165, 233, .85); }
.storyboard-card.status-idle::before   { background: var(--line, #e3e3e8); }

/* 编辑过（脏）：左上角细橙边 + 提示徽章 */
.storyboard-card.is-dirty {
  border-color: rgba(245, 158, 11, .55);
  box-shadow: 0 0 0 1px rgba(245, 158, 11, .22), 0 4px 14px rgba(245, 158, 11, .10);
}
.storyboard-card.is-dirty::before { background: rgba(245, 158, 11, .95); }

/* 新增的镜头（刚插入）：浅蓝虚线一闪而过 */
.storyboard-card.is-new {
  animation: sb-new-flash 1.2s ease-out 1;
}
@keyframes sb-new-flash {
  0%   { box-shadow: 0 0 0 2px rgba(22,93,255,.55), 0 6px 18px rgba(22,93,255,.25); }
  100% { box-shadow: 0 0 0 0 rgba(22,93,255,0); }
}

/* 顶部操作工具条（卡片内右上角 · 增/删/上下移） */
.sb-toolbar {
  position: absolute;
  top: 8px;
  right: 8px;
  display: flex;
  align-items: center;
  gap: 4px;
  padding: 3px 5px;
  background: rgba(255,255,255,.92);
  border: 1px solid var(--line, #e3e3e8);
  border-radius: 8px;
  box-shadow: 0 2px 8px rgba(0,0,0,.06);
  opacity: 0;
  transition: opacity .2s, transform .2s;
  z-index: 5;
}
[data-theme="dark"] .sb-toolbar {
  background: rgba(20,22,28,.92);
}
.storyboard-card:hover .sb-toolbar,
.sb-toolbar:focus-within,
.sb-toolbar.is-pinned {
  opacity: 1;
  transform: translateY(0);
}
.sb-tb-btn {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  padding: 4px 8px;
  font-size:12px;
  font-weight: 600;
  line-height: 1;
  color: var(--t2, #475569);
  background: transparent;
  border: 1px solid transparent;
  border-radius: 6px;
  cursor: pointer;
  transition: background .15s, color .15s, border-color .15s;
}
.sb-tb-btn:hover {
  background: var(--bg-3, #eef0f3);
  color: var(--t1, #0f172a);
  border-color: var(--line, #e3e3e8);
}
.sb-tb-btn[disabled] {
  opacity: .4;
  cursor: not-allowed;
  background: transparent;
  border-color: transparent;
}
.sb-tb-btn.sb-tb-danger:hover {
  background: rgba(245,63,63, .10);
  color: #F53F3F;
  border-color: rgba(245,63,63, .35);
}
.sb-tb-btn.sb-tb-primary:hover {
  background: rgba(14, 165, 233, .12);
  color: var(--brand-text, #0e7490);
  border-color: rgba(14, 165, 233, .45);
}
.sb-tb-btn i { width: 13px; height: 13px; }

/* 头部：镜头号角标 / 时长 / 状态 */
.sb-head {
  display: flex;
  align-items: center;
  gap:12px;
  flex-wrap: wrap;
  padding: 12px 14px 10px;
  border-bottom: 1px solid var(--line, #e3e3e8);
  margin: 0;
  background: linear-gradient(180deg, rgba(22,93,255,.04), transparent);
}
.sb-no {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 3px 10px;
  font-size: 12px;
  font-weight: 700;
  color: var(--brand-text, #0e7490);
  background: rgba(14, 165, 233, .10);
  border: 1px solid rgba(14, 165, 233, .30);
  border-radius: 999px;
  letter-spacing: .02em;
}
.sb-no::before {
  content: "🎬";
  font-size:12px;
  filter: grayscale(.2);
}
.sb-tc {
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size:12px;
  font-weight: 700;
  color: var(--t2, #475569);
  background: var(--bg-3, #eef0f3);
  border: 1px solid var(--line, #e3e3e8);
  padding: 2px 7px;
  border-radius: 6px;
  letter-spacing: .02em;
}
.sb-dur {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  font-size:12px;
  color: var(--t2, #475569);
}
.sb-dur-input {
  width: 50px;
  padding: 3px 5px;
  font-size: 12px;
  font-weight: 700;
  text-align: center;
  border: 1px solid var(--line, #e3e3e8);
  background: var(--bg-0, #fff);
  color: var(--t1, #0f172a);
  border-radius: 6px;
  font-family: inherit;
}
.sb-dur-input:focus {
  outline: none;
  border-color: var(--brand-text, #0e7490);
  box-shadow: 0 0 0 2px rgba(14, 165, 233, .18);
}
.sb-st {
  margin-left: auto;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 2px 8px;
  font-size:12px;
  font-weight: 600;
  border-radius: 999px;
  background: var(--bg-3, #eef0f3);
  color: var(--t2, #475569);
}
.sb-st::before {
  content: "";
  display: inline-block;
  width: 6px; height: 6px;
  border-radius: 50%;
  background: var(--t3, #94a3b8);
}
.sb-st.done    { background: rgba(0,180,42,.12); color: #00B42A; }
.sb-st.done::before    { background: #00B42A; }
.sb-st.error   { background: rgba(245,63,63,.12); color: #F53F3F; }
.sb-st.error::before   { background: #F53F3F; }
.sb-st.loading { background: rgba(22,93,255,.14); color: #165DFF; }
.sb-st.loading::before { background: #165DFF; animation: sb-st-pulse 1.2s ease-in-out infinite; }
@keyframes sb-st-pulse {
  0%,100% { opacity: .4; }
  50%     { opacity: 1; }
}

/* 已编辑脏标：在 sb-head 末位显示 */
.sb-dirty-badge {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  margin-left: 6px;
  padding: 2px 8px;
  font-size:12px;
  font-weight: 700;
  color: #FF7D00;
  background: rgba(245, 158, 11, .14);
  border: 1px solid rgba(245, 158, 11, .40);
  border-radius: 999px;
  letter-spacing: .02em;
}
.sb-dirty-badge i { width: 11px; height: 11px; }

/* 行内编辑字段（共用） */
.sb-row {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  margin: 6px 14px;
}
.sb-row-3 { flex-wrap: wrap; }
.sb-lb {
  flex: 0 0 auto;
  min-width: 30px;
  padding: 4px 0 0;
  font-size:12px;
  font-weight: 600;
  color: var(--t3, #94a3b8);
  line-height: 1.6;
  letter-spacing: .04em;
}
.sb-fval {
  flex: 1 1 auto;
  min-width: 0;
  padding: 4px 7px;
  margin: -1px -3px;
  font-size:14px;
  line-height: 1.6;
  color: var(--t1, #0f172a);
  background: transparent;
  border: 1px solid transparent;
  border-radius: 6px;
  white-space: pre-wrap;
  word-break: break-word;
  cursor: text;
  transition: border-color .15s ease, background .15s ease, box-shadow .15s ease;
}
.sb-fval:hover {
  border-color: var(--line, #e3e3e8);
  background: var(--bg-3, #eef0f3);
}
.sb-fval:focus {
  outline: none;
  border-color: var(--brand-text, #0e7490);
  background: var(--bg-0, #fff);
  box-shadow: 0 0 0 2px rgba(14, 165, 233, .14);
}
.sb-fval:empty::before {
  content: attr(data-ph);
  color: var(--t3, #94a3b8);
  font-style: italic;
}
.sb-row-3 .sb-fval {
  flex: 1 1 110px;
}

/* 转场下拉：与 contenteditable 风格一致 */
.sb-fval.sb-select {
  padding: 3px 6px;
  background: var(--bg-0, #fff);
  border-color: var(--line, #e3e3e8);
  cursor: pointer;
  appearance: none;
  -webkit-appearance: none;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'><path d='M1 1l4 4 4-4' fill='none' stroke='%2364748b' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/></svg>");
  background-repeat: no-repeat;
  background-position: right 6px center;
  padding-right: 20px;
}
.sb-fval.sb-select:hover { background-color: var(--bg-3, #eef0f3); }

/* 左栏：首尾帧并排（同卡片一致网格） */
.shot-frames {
  flex: 0 0 320px;
  min-width: 280px;
  padding: 14px 12px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap:12px;
  background: rgba(14, 165, 233, .04);
  border-right: 1px solid var(--line, #e3e3e8);
  align-content: start;
}
.frame-cell {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.frame-cell .frame-label {
  display: flex;
  align-items: center;
  gap: 5px;
  font-size:12px;
  font-weight: 700;
  color: var(--brand-text, #0e7490);
  text-transform: uppercase;
  letter-spacing: .04em;
}
.frame-cell .frame-label .frame-badge { margin-left: 0; }
.frame-cell .frame-label .frame-badge.shared { background: rgba(34, 197, 94, .92); }
.frame-cell .frame-label .frame-badge { background: rgba(14, 165, 233, .85); }

.frame-img-wrap {
  position: relative;
  border-radius: 8px;
  overflow: hidden;
}
.frame-img {
  display: block;
  width: 100%;
  max-width: 100%;
  aspect-ratio: 4/3;
  min-height: 110px;
  object-fit: cover;
  background: var(--bg-3, #eef0f3);
  border: 1px solid var(--line, #e3e3e8);
  border-radius: 8px;
  cursor: zoom-in;
  transition: border-color .2s, box-shadow .2s, transform .2s;
}
.frame-img:hover {
  border-color: rgba(14, 165, 233, .55);
  box-shadow: 0 2px 10px rgba(14, 165, 233, .18);
  transform: scale(1.01);
}

.frame-cell-actions {
  display: flex;
  gap: 4px;
  margin-top: 2px;
}
.frame-cell-actions .btn {
  font-size:12px;
  padding: 4px 6px;
  flex: 1;
}

/* 文案/元信息列 */
.storyboard-info {
  flex: 1 1 auto;
  min-width: 0;
  display: flex;
  flex-direction: column;
}
.storyboard-meta {
  padding: 4px 0 8px;
  min-width: 0;
  flex: 1 1 auto;
}
.storyboard-meta .sb-row:last-child { margin-bottom: 4px; }
.storyboard-btns {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  padding: 8px 14px 12px;
  border-top: 1px solid var(--line, #e3e3e8);
  background: rgba(14, 165, 233, .03);
}
.storyboard-btns .btn.tiny {
  font-size:12px;
  padding: 5px 9px;
  flex: 0 0 auto;
}
.storyboard-btns .btn.tiny[disabled] {
  opacity: .55;
  cursor: not-allowed;
}

/* 卡片底部加一行"插入新镜头"小按钮（停在两张卡之间） */
.sb-insert-row {
  display: flex;
  justify-content: center;
  margin: -6px 0;
}
.sb-insert-btn {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 4px 12px;
  font-size:12px;
  color: var(--t2, #475569);
  background: var(--bg-1, #fff);
  border: 1px dashed var(--line-strong, #cbd5e1);
  border-radius: 999px;
  cursor: pointer;
  opacity: 0;
  transition: opacity .2s, background .15s, color .15s, border-color .15s;
}
.storyboard-grid:hover .sb-insert-btn { opacity: 1; }
.sb-insert-btn:hover {
  background: rgba(14, 165, 233, .08);
  color: var(--brand-text, #0e7490);
  border-color: rgba(14, 165, 233, .55);
  border-style: solid;
}
.sb-insert-btn i { width: 12px; height: 12px; }

/* 空态：更友好的引导 */
.storyboard-empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap:12px;
  padding: 36px 16px;
  color: var(--t3, #94a3b8);
  font-size:14px;
  background: var(--bg-1, #fff);
  border: 1px dashed var(--line-strong, #cbd5e1);
  border-radius: 12px;
  text-align: center;
}
.storyboard-empty i {
  width: 32px; height: 32px;
  color: var(--t3, #94a3b8);
  opacity: .7;
}
.storyboard-empty .storyboard-empty-title {
  color: var(--t1, #0f172a);
  font-weight: 600;
  font-size: 14px;
}
.storyboard-empty .storyboard-empty-sub {
  color: var(--t2, #475569);
  font-size: 12px;
  max-width: 360px;
  line-height: 1.5;
}

/* 骨架屏：生成中 */
.storyboard-skeleton {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap:16px;
  margin-top: 12px;
}
.storyboard-skeleton-card {
  display: flex;
  flex-direction: row;
  gap: 12px;
  padding: 14px;
  border: 1px solid var(--line, #e3e3e8);
  border-radius: 12px;
  background: var(--bg-1, #fff);
}
.storyboard-skeleton-card .sk-thumb {
  flex: 0 0 320px;
  height: 160px;
  border-radius: 10px;
  background: linear-gradient(90deg, var(--bg-3,#eef0f3) 0%, #f8fafc 50%, var(--bg-3,#eef0f3) 100%);
  background-size: 200% 100%;
  animation: sk-shimmer 1.4s ease-in-out infinite;
}
.storyboard-skeleton-card .sk-body {
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  gap:12px;
}
.storyboard-skeleton-card .sk-line {
  height: 14px;
  border-radius: 6px;
  background: linear-gradient(90deg, var(--bg-3,#eef0f3) 0%, #f8fafc 50%, var(--bg-3,#eef0f3) 100%);
  background-size: 200% 100%;
  animation: sk-shimmer 1.4s ease-in-out infinite;
}
.storyboard-skeleton-card .sk-line:nth-child(1) { width: 35%; height: 18px; }
.storyboard-skeleton-card .sk-line:nth-child(2) { width: 85%; }
.storyboard-skeleton-card .sk-line:nth-child(3) { width: 70%; }
.storyboard-skeleton-card .sk-line:nth-child(4) { width: 60%; height: 30px; }
@keyframes sk-shimmer {
  0%   { background-position: 200% 0; }
  100% { background-position: -200% 0; }
}

/* 顶部"已编辑·需重新生成视频"提示条 */
.sb-regen-banner {
  display: none;
  align-items: center;
  gap:12px;
  margin: 8px 0 12px;
  padding: 10px 14px;
  border-radius: 10px;
  background: linear-gradient(90deg, rgba(245, 158, 11, .10), rgba(245, 158, 11, .04));
  border: 1px solid rgba(245, 158, 11, .35);
  border-left: 4px solid #FF7D00;
  font-size:14px;
  color: var(--t1, #0f172a);
  line-height: 1.5;
}
.sb-regen-banner.is-on { display: flex; }
.sb-regen-banner i {
  flex: 0 0 auto;
  width: 18px; height: 18px;
  color: #FF7D00;
}
.sb-regen-banner .sb-regen-text {
  flex: 1 1 auto;
  min-width: 0;
}
.sb-regen-banner .sb-regen-text b { color: #FF7D00; }
.sb-regen-banner .btn {
  flex: 0 0 auto;
}

/* "用分镜生成视频"按钮闪烁提示（脏状态下） */
.btn.sb-cta-pulse {
  position: relative;
  animation: sb-cta-pulse 1.6s ease-in-out infinite;
}
@keyframes sb-cta-pulse {
  0%,100% { box-shadow: 0 0 0 0 rgba(14, 165, 233, .0); }
  50%     { box-shadow: 0 0 0 6px rgba(14, 165, 233, .25); }
}

/* 响应式：窄屏两帧并排 + 工具条常驻 */
@media (max-width: 880px) {
  .storyboard-card { flex-direction: column; }
  .shot-frames {
    flex: 0 0 auto;
    border-right: none;
    border-bottom: 1px solid var(--line, #e3e3e8);
    grid-template-columns: 1fr 1fr;
    padding: 12px;
  }
  .sb-toolbar { opacity: 1; transform: translateY(0); }
}

/* ══ NC batch · UI 一致性修复 （2026-09-06）══ */
/* 1) 「识别分析」按钮不被裁切：head 允许换行 + 按钮不折行不换字 */
.structure-notes-head { flex-wrap: wrap; row-gap: 6px; }
.structure-notes-head .btn, .structure-notes-head .sn-title { white-space: nowrap; }
.structure-notes-head .btn { flex-shrink: 0; overflow: visible; }
/* 2) 产品资料卡（step0 左右两卡）标题/提示层级一致，避免排版混乱 */
.step0-col-title { align-items: baseline; line-height: 1.3; }
.step0-col-hint { letter-spacing: .01em; }
.step0-meta-card > .field > span:first-child,
.free-upload-head,
.product-context-collapse .pc-title { font-weight: 600; color: var(--t1); font-size: var(--fs-small); }
.step0-meta-card > .field > span .field-hint { font-weight: 400; color: var(--t3); }
/* 卡内分区统一顶部分隔 + 间距 */
.step0-col > .step0-meta-card + .free-upload-section { border-top: 1px solid var(--line-subtle); margin-top: 6px; }
.free-upload-drop { min-height: 88px; }

/* NC UI-04/05: Agent 卡元 Prompt 预览不截断 */
.agent-card .agent-prompt-preview { white-space: normal; overflow: visible; max-height: none; line-height: 1.4; }
.agent-card .skill-tag { white-space: normal; line-height: 1.2; }

/* ══ 分类簇/结构分析 UI 布局整理 （2026-09-06）══════════════════════
 * 目标：① 卡内间距统一（用 flex gap，取代零散 margin → 消除忽大忽小的留白）；
 *      ② 空维度占位（该维度暂无专属图·不灌全图 / 没有对应产品图）做成紧凑一致的胶囊条；
 *      ③ 去掉 guide-top 嵌套 header 的双层盒子，减少多余空白；
 *      ④ 产品图「维度识别」徽标行（待分析/分析中/视角·xN）改成一排紧凑胶囊，不再是无样式的长串；
 *      ⑤ 精简部件入口条的说明行与内边距。全部为纯样式叠加，不改任何 JS/DOM 语义。 */
.cluster-card { gap: 8px; }
.cluster-card > .cluster-thumbs { margin: 0; }
.cluster-card > .cluster-uploadbtn { margin: 0; }
.cluster-card > .cluster-flag { margin-top: 0; }
.cluster-card > .cluster-card-actions { margin-top: 0; }

/* 空/无图占位：紧凑一致的胶囊条（不灌全图 / 无专属图 / 无对应图） */
.cluster-card .cluster-noimg,
.cluster-card .cluster-noimg.cluster-noimg-empty {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  box-sizing: border-box;
  width: 100%;
  font-size: var(--fs-xs, 11px);
  line-height: 1.4;
  color: var(--t3, #94a3b8);
  padding: 4px 8px;
  border: 1px dashed var(--line, #e2e8f0);
  border-radius: 6px;
  background: var(--bg-1, #fff);
}
.cluster-card .cluster-noimg.cluster-noimg-empty {
  flex-direction: row;
  align-items: center;
  gap: 5px;
  padding: 4px 8px;
}

/* guide-top 内的 header 去掉自带的边框/底色/内边距（外层 guide-top 已是盒子），避免双层卡+额外留白 */
.cluster-guide-top .cluster-header {
  border: none;
  background: transparent;
  padding: 0 0 4px;
  margin-bottom: 0;
}
.cluster-guide-top .cluster-flow { margin-bottom: 2px; }

/* 部件入口条：与分类簇面板外层统一圆角 + 更紧凑的说明行 */
.part-entry-bar { border-radius: 8px; padding: 8px 10px; margin-bottom: 8px; }
.part-entry-tip { line-height: 1.4; margin-bottom: 4px; color: var(--t3, #5b6478); font-size:12px; }
.part-entry-ctl { gap: 6px; }

/* 产品图「维度识别」徽标行：待分析/分析中/分析失败/视角·xN 收敛为一排紧凑胶囊，避免长串裸文本 */
.pi-summary {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 4px 6px;
  margin-top: 6px;
}
.pi-summary-label { font-size:12px; color: var(--t3, #94a3b8); flex: none; }
.pi-badge,
.pi-summary .pi-badge {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size:12px;
  line-height: 1.4;
  color: var(--t2, #334155);
  background: var(--bg-2, #f8fafc);
  border: 1px solid var(--line, #e2e8f0);
  border-radius: 999px;
  padding: 2px 8px;
  white-space: nowrap;
}
.pi-badge.idle { color: var(--t3, #94a3b8); border-style: dashed; background: transparent; }
.pi-badge.pending { color: #FF7D00; background: rgba(245, 158, 11, .08); border-color: rgba(245, 158, 11, .25); }
.pi-badge.error { color: #F53F3F; background: rgba(245,63,63, .06); border-color: rgba(245,63,63, .25); cursor: pointer; }

/* 分类簇空态：紧凑单行（不再让空态与真实卡片等高造成大留白） */
.cluster-empty { padding: 8px 10px; font-size: var(--fs-small); line-height: 1.5; }
.cluster-empty-sub { margin-top: 2px; font-size: var(--fs-xs, 11px); }


/* ==== NC-batch2 产品卡证据级别 + 版本管理（仅追加，不改既有规则） ==== */
.pcw-ev-badge { display:inline-block; font-size:12px; line-height:1.4; padding:2px 8px; border-radius:999px; margin:4px 0 2px; }
.pcw-ev-mv { color:#165DFF; background:rgba(22,93,255,.10); border:1px solid rgba(22,93,255,.30); }
.pcw-ev-rep { color:#FF7D00; background:rgba(245,158,11,.10); border:1px solid rgba(245,158,11,.30); }
.pcw-imgs-textonly { align-items:center; justify-content:center; padding:8px 10px; background:var(--bg-2,#f8fafc); border:1px dashed var(--line,#e2e8f0); border-radius:8px; }
.pcw-imgs-textonly .pcw-noimg { font-size:12px; color:var(--t3,#94a3b8); }
.pcw-btn-disabled-reason { opacity:.6; cursor:not-allowed; }
.pcv-backdrop { position:fixed; inset:0; background:rgba(15,23,42,.55); z-index:10000; display:flex; align-items:center; justify-content:center; padding:20px; }
.pcv-panel { width:min(720px,94vw); max-height:82vh; background:#fff; border-radius:14px; box-shadow:0 20px 60px rgba(0,0,0,.28); display:flex; flex-direction:column; overflow:hidden; }
.pcv-head { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:14px 18px; border-bottom:1px solid var(--line,#e2e8f0); }
.pcv-head h3 { margin:0; font-size:16px; }
.pcv-close { border:none; background:transparent; font-size:16px; cursor:pointer; line-height:1; color:var(--t3,#94a3b8); }
.pcv-close:hover { color:#334155; }
.pcv-body { overflow:auto; padding:14px 18px; display:flex; flex-direction:column; gap:12px; }
.pcv-loading,.pcv-empty { color:var(--t3,#94a3b8); font-size:14px; padding:18px; text-align:center; }
.pcv-item { display:flex; align-items:center; gap:12px; padding:10px; border:1px solid var(--line,#e2e8f0); border-radius:10px; background:#fff; }
.pcv-item.pcv-current { border-color:#165DFF; background:rgba(22,93,255,.05); }
.pcv-thumb { width:64px; height:64px; flex:0 0 64px; border-radius:8px; overflow:hidden; background:var(--bg-2,#f8fafc); display:flex; align-items:center; justify-content:center; }
.pcv-thumb img { width:100%; height:100%; object-fit:cover; }
.pcv-thumb .pcv-noimg { font-size:12px; color:#94a3b8; }
.pcv-info { flex:1; min-width:0; }
.pcv-title { font-size:14px; font-weight:600; }
.pcv-badge { font-size:12px; color:#165DFF; background:rgba(22,93,255,.12); border:1px solid rgba(22,93,255,.35); border-radius:999px; padding:1px 6px; margin-left:4px; }
.pcv-meta { font-size:12px; color:var(--t3,#94a3b8); margin-top:3px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.pcv-actions { display:flex; gap:4px; flex:0 0 auto; }
.pcv-actions .btn { white-space:nowrap; }

/* ============================================================
 * NC-batch3 UI-16 · Agent 状态总览弹窗布局改版（仅追加，不改既有规则）
 * 目标：① 上排 Agent 卡片网格（状态/角色/耗时/动作 + 思考摘要，字号 12-14px 可读、不挤成小格）
 *       ② 下方独立「制片人聚合思考区」突出 unifiedPrompt / creativeBrief / 完整思考过程
 *       ③ 弹窗可纵向滚动、响应式自适应（窄屏单列，宽屏多列）
 * ============================================================ */

/* —— 弹窗主体：纵向滚动（内容多不溢出），留白稍大 —— */
.agent-roster-modal-body {
  max-height: min(74vh, 760px);
  overflow: auto;
  padding: 6px 4px 12px;
  gap:20px;
}

/* —— 顶部状态 chips：字号抬到 12-13px 更清晰 —— */
.agent-rm-summary { gap:12px; }
.agent-rm-chip { font-size:14px; padding: 4px 12px; }

/* —— Agent 卡片网格：宽屏多列排布，窄屏自动降为单列；卡片不再被挤成小格 —— */
.agent-rm-group { gap: 16px; }
.agent-rm-group-head { font-size:16px; gap:12px; }
.agent-rm-group-head i { width: 20px; height: 20px; }
.agent-rm-group-sum { font-size:14px; }
.agent-rm-grid {
  /* v92：每个 Agent 单独一列（占满一行），信息更全更舒展，避免多列挤压 */
  grid-template-columns: 1fr;
  gap: 14px;
}

/* —— 单卡片：更大留白、字号抬升、正文可读 —— */
.agent-rm-col { gap: 12px; padding: 18px 20px; border-radius: 14px; }
.agent-rm-head { gap:12px; }
.agent-rm-avatar { width: 46px; height: 46px; border-radius: 12px; }
.agent-rm-name { font-size:16px; }
.agent-rm-role { font-size:14px; }
.agent-rm-status { font-size: 12px; padding: 3px 9px; }
.agent-rm-meta { gap: 8px; font-size:14px; }
.agent-rm-meta span { padding: 2px 8px; }
.agent-rm-out-wrap {
  min-height: 64px;
  max-height: 240px;
  overflow: auto;
  font-size: 14px;
  line-height: 1.7;
}
.agent-rm-out-text { font-size: 14px; line-height: 1.7; color: var(--t2, #475569); }
.agent-rm-err { font-size:14px; }
.agent-rm-active { font-size:14px; }
.agent-rm-idle { font-size:14px; }
.agent-rm-detail { font-size: 12px; padding: 4px 10px; }

/* —— 制片人聚合思考区：与 Agent 卡片分离、独立成块、更突出 —— */
.agent-roster-producer {
  margin-top: 2px;
  border: 1px solid rgba(22,93,255,.34);
  background: var(--bg-1);
  border-radius: 14px;
  padding: 16px 20px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
[data-theme="dark"] .agent-roster-producer { background: var(--bg-2, #1e293b); }
.agent-roster-producer-head { display: flex; align-items: center; gap: 12px; }
.agent-roster-producer-icon {
  width: 42px; height: 42px; flex: 0 0 auto;
  display: flex; align-items: center; justify-content: center;
  background: rgba(22,93,255,.10);
  border: 1px solid rgba(22,93,255,.30);
  border-radius: 11px;
  color: #165DFF;
}
.agent-roster-producer-icon i { width: 20px; height: 20px; }
.agent-roster-producer-id { min-width: 0; flex: 1; }
.agent-roster-producer-name { font-size:16px; font-weight: 600; color: var(--t1); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.agent-roster-producer-role { font-size:14px; color: var(--t3, #94a3b8); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.agent-roster-producer-status { flex: 0 0 auto; font-size: 12px; font-weight: 600; padding: 3px 10px; border-radius: 999px; }
.agent-roster-producer-status[data-status="done"] { color: #00B42A; background: rgba(0,180,42,.12); }
.agent-roster-producer-status[data-status="active"] { color: #165DFF; background: rgba(22,93,255,.14); }
.agent-roster-producer-status[data-status="error"] { color: #F53F3F; background: rgba(245,63,63,.12); }
.agent-roster-producer-status[data-status="pending"] { color: var(--t3, #94a3b8); background: var(--bg-2, #f1f5f9); }
[data-theme="dark"] .agent-roster-producer-status[data-status="done"] { color: #00B42A; background: rgba(0,180,42,.16); }
[data-theme="dark"] .agent-roster-producer-status[data-status="active"] { color: #4080FF; background: rgba(22,93,255,.18); }
[data-theme="dark"] .agent-roster-producer-status[data-status="error"] { color: #F53F3F; background: rgba(245,63,63,.16); }

.agent-roster-producer-body { display: flex; flex-direction: column; gap: 12px; min-width: 0; }
.agent-roster-producer-meta { display: inline-flex; }
.agent-roster-producer-meta span { background: var(--bg-2, #f1f5f9); border-radius: 6px; padding: 2px 8px; font-size: 12px; color: var(--t2, #64748b); }
.agent-roster-producer-empty {
  font-size:14px; color: var(--t3, #94a3b8); line-height: 1.6;
  padding: 14px 16px; border: 1px dashed var(--line, #e2e8f0); border-radius: 10px; background: var(--bg-2, #f8fafc);
}
.agent-roster-producer-think {
  font-size: 14px; line-height: 1.7; color: var(--t2, #475569);
  max-height: 340px; overflow: auto;
  padding: 12px 14px; background: var(--bg-2, #f8fafc);
  border-radius: 10px; border: 1px solid var(--line, #e2e8f0);
}
.agent-rm-detail-p { align-self: flex-start; font-size: 12px; padding: 4px 10px; }

/* 制片人聚合区内，复用 renderProducerSummary 的 prod-summary 块：字号抬升、留白更大 */
.agent-roster-producer .prod-summary { margin: 0; padding: 12px 14px; background: rgba(22,93,255,.06); border: 1px solid rgba(22,93,255,.22); border-radius: 10px; }
.agent-roster-producer .prod-summary-title { font-size:14px; margin-bottom: 6px; }
.agent-roster-producer .prod-sum-row { margin: 6px 0; gap: 3px; }
.agent-roster-producer .prod-sum-key { font-size: 12px; }
.agent-roster-producer .prod-sum-val { font-size: 14px; line-height: 1.7; max-height: 260px; }

/* —— 响应式：窄屏（<640px）单列大卡片，卡片与制片人区不溢出 —— */
@media (max-width: 640px) {
  .agent-rm-grid { grid-template-columns: 1fr; }
  .agent-rm-col { padding: 16px 16px; }
  .agent-roster-producer { padding: 14px 14px; }
  .agent-roster-producer-head { flex-wrap: wrap; }
  .agent-roster-producer-status { margin-left: auto; }
}
@media (max-width: 420px) {
  .agent-rm-out-wrap { max-height: 200px; }
  .agent-roster-producer-think { max-height: 260px; }
}


/* ==== NC-batch4（批4 · UI 排版/清晰度收口）——仅追加，不改既有规则 ==== */

/* ---- N1：文案面板 tab 行 —— 选中/未选中高对比 + 排版清晰 ---- */
.copy-actions.copy-tabs {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin: 2px 0 2px;
}
.copy-actions.copy-tabs .btn.ghost.sm {
  flex: 0 0 auto;
  padding: 6px 12px;
  border-radius: var(--r-sm);
  font-weight: 500;
  color: var(--t2);
  background: var(--bg-1);
  border: 1px solid var(--line);
  box-shadow: var(--shadow-xs);
  transition: all .15s var(--ease);
}
.copy-actions.copy-tabs .btn.ghost.sm:hover {
  border-color: var(--brand-text);
  color: var(--brand-text);
  background: var(--brand-bg-soft);
}
/* 选中态：白色高对比文字 + 品牌深色实底，跨主题可读，未选中保持浅底灰字 */
.copy-actions.copy-tabs .btn.ghost.sm.is-active {
  color: #fff;
  background: #165DFF;
  border-color: #165DFF;
  font-weight: 600;
  box-shadow: 0 2px 10px rgba(2,132,199,.30);
  transform: none;
}
.copy-actions.copy-tabs .btn.ghost.sm.is-active:hover {
  background: #0369A1;
  border-color: #0369A1;
  color: #fff;
}
.copy-actions.copy-tabs .copy-actions-tip {
  margin-left: auto;
  font-size:12px;
  color: var(--t3);
  white-space: nowrap;
}

/* ---- N2：copyDirection 有语义可读结构（不再逐元素「查看原始 JSON」折叠） ---- */
.cd-wrap { display: flex; flex-direction: column; gap:12px; margin-top: 6px; }
.cd-block {
  padding: 10px 12px;
  background: var(--bg-1);
  border: 1px solid var(--line);
  border-left: 3px solid var(--brand-text);
  border-radius: var(--r-sm);
}
.cd-label {
  font-size:12px;
  font-weight: 700;
  letter-spacing: .05em;
  text-transform: uppercase;
  color: var(--t3);
  margin-bottom: 6px;
}
.cd-hook-text { font-size: var(--fs-body); color: var(--t1); font-weight: 600; line-height: 1.55; }
.cd-text { font-size: var(--fs-small); color: var(--t2); line-height: 1.6; }
.cd-block .think-list { margin: 0; }
.cd-points li, .cd-arc-list li {
  padding: 6px 8px 6px 18px;
  background: var(--bg-2);
  border: 1px solid var(--line);
  border-radius: var(--r-xs);
}
.cd-points li + li, .cd-arc-list li + li { margin-top: 4px; }
/* 数组内对象友好条目（标题 + 副文本），不再各带原始 JSON 折叠 */
.think-item { display: flex; flex-direction: column; gap: 2px; }
.think-item-name { font-weight: 600; color: var(--t1); }
.think-item-sub { font-size: var(--fs-micro); color: var(--t3); line-height: 1.5; }

/* ---- UI-06：结构定义区空态 + 维度识别逐维状态汇总 ---- */
.sn-empty {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 6px;
  padding: 14px 16px;
  background: var(--bg-1);
  border: 1px dashed var(--line);
  border-radius: var(--r-md);
}
.sn-empty-ico { font-size: 22px; line-height: 1; }
.sn-empty-title { font-weight: 700; font-size: var(--fs-body); color: var(--t1); }
.sn-empty-sub { font-size: var(--fs-small); color: var(--t2); line-height: 1.6; }
.sn-empty-sub b { color: var(--brand-text); }
.pi-summary-body { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 4px 6px; }
.pi-summary-empty { font-size:12px; color: var(--t3); }
.pi-badge.done { color: #165DFF; background: rgba(22,93,255,.10); border-color: rgba(22,93,255,.28); }

/* ---- UI-09：管理概览卡片栅格对齐 / 间距统一 / 层级清晰 ---- */
.admin-body .dashboard-stats-ready,
.admin-body .dashboard-stats-usage,
.admin-body .admin-stats { gap:16px; }
.admin-body .dashboard-stats-ready { margin-bottom: 18px; }
.admin-body .dashboard-stats-usage { margin-bottom: 18px; }
.admin-body .dashboard-grid {
  gap: 16px;
  margin-bottom: 18px;
  align-items: stretch;
}
.admin-body .dashboard-grid .admin-card { display: flex; flex-direction: column; min-height: 100%; height: auto; }
.admin-body .dashboard-grid .admin-card .admin-card-body { flex: 1; }
.admin-body .quick-grid { gap: 12px; }
.admin-body .quick-card { padding: 14px 16px; border-radius: var(--r-md); }
.admin-body #dashboardStatsReady .users-stat-card,
.admin-body #dashboardStatsUsage .users-stat-card { min-height: 96px; }

/* ============================================================
   NC-m3 · M3 深度质检面板（自生成/自校验/飞轮自转/视觉化）
   —— 只追加，不触碰既有样式；变量沿用项目设计系统 ——
   ============================================================ */
#panel-observability .nc-m3-toolbar { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 10px 0 4px; }
#panel-observability .nc-m3-select { height: 30px; padding: 0 8px; font-size: 12px; border: 1px solid var(--line); border-radius: 6px; background: var(--bg-1); color: var(--t2); }
#panel-observability .nc-m3-filter-note { font-size:12px; color: var(--t-muted); }
#panel-observability .nc-m3-batch { display: flex; align-items: center; gap: 8px; width: 240px; max-width: 100%; }
#panel-observability .nc-m3-batch .nc-m3-batch-bar { flex: 1; height: 8px; border-radius: 999px; background: var(--bg-3); overflow: hidden; }
#panel-observability .nc-m3-batch .nc-m3-batch-bar > i { display: block; height: 100%; border-radius: 999px; background: var(--grad-brand); transition: width .3s; }
#panel-observability .nc-m3-batch-txt { font-size:12px; color: var(--t2); white-space: nowrap; }

/* 详情内 M3 面板 */
.obs-modal .nc-m3-panel { margin: 12px 0 14px; }
.obs-modal .nc-m3-block { margin-bottom: 12px; }
.obs-modal .nc-m3-block .lbl { font-size:12px; font-weight: 700; color: var(--t2); margin-bottom: 6px; letter-spacing: .02em; }
.obs-modal .nc-m3-chips { display: flex; flex-wrap: wrap; gap: 6px; margin: 6px 0 10px; }
.obs-modal .nc-m3-chip { display: inline-flex; align-items: center; gap: 4px; font-size:12px; padding: 3px 9px; border-radius: 999px; background: var(--bg-3); color: var(--t2); }
.obs-modal .nc-m3-chip b { font-weight: 700; }
.obs-modal .nc-m3-chip.avg { background: rgba(22,93,255,.12); color: #165DFF; }
.obs-modal .nc-m3-chip.conf.h { background: rgba(0,180,42,.14); color: #00B42A; }
.obs-modal .nc-m3-chip.conf.m { background: rgba(245,158,11,.14); color: #FF7D00; }
.obs-modal .nc-m3-chip.conf.l { background: rgba(245,63,63,.14); color: #F53F3F; }
.obs-modal .nc-m3-chip.need-human { background: rgba(245,63,63,.16); color: #F53F3F; font-weight: 700; }

/* 维度评分 grid */
.obs-modal .nc-m3-dims { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 8px 16px; }
.obs-modal .nc-m3-dim { display: grid; grid-template-columns: 76px 1fr 24px; align-items: center; gap: 8px; min-width: 0; }
.obs-modal .nc-m3-dim .nm { font-size:12px; color: var(--t2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.obs-modal .nc-m3-dim .bar { height: 7px; border-radius: 999px; background: var(--bg-3); overflow: hidden; }
.obs-modal .nc-m3-dim .bar > i { display: block; height: 100%; border-radius: 999px; }
.obs-modal .nc-m3-dim .bar > i.pass { background: #00B42A; }
.obs-modal .nc-m3-dim .bar > i.warn { background: #FF7D00; }
.obs-modal .nc-m3-dim .bar > i.fail { background: #F53F3F; }
.obs-modal .nc-m3-dim .v { font-size: 12px; font-weight: 800; text-align: right; }
.obs-modal .nc-m3-dim .v.pass { color: #00B42A; }
.obs-modal .nc-m3-dim .v.warn { color: #FF7D00; }
.obs-modal .nc-m3-dim .v.fail { color: #F53F3F; }
.obs-modal .nc-m3-dim .v.na { color: var(--t-muted); }

/* 交叉校验 */
.obs-modal .nc-m3-cv { background: var(--bg-2); border: 1px solid var(--line); border-radius: 8px; padding: 10px 12px; margin-bottom: 12px; }
.obs-modal .nc-m3-cv .t { font-size:12px; font-weight: 700; color: var(--t2); margin-bottom: 4px; }
.obs-modal .nc-m3-cv .cv-meta { font-size:12px; color: var(--t3); margin-bottom: 8px; }
.obs-modal .nc-m3-cv .cv-row { display: grid; grid-template-columns: 96px 1fr; gap: 8px; font-size:12px; padding: 3px 0; border-top: 1px dashed var(--line); }
.obs-modal .nc-m3-cv .cv-row:first-of-type { border-top: 0; }
.obs-modal .nc-m3-cv .cv-row .k { color: var(--t2); font-weight: 600; }
.obs-modal .nc-m3-cv .cv-row.ok .d { color: #00B42A; }
.obs-modal .nc-m3-cv .cv-row.bad .d { color: #F53F3F; }

/* 缺陷 TOP3 */
.obs-modal .nc-m3-top { display: flex; flex-direction: column; gap: 8px; }
.obs-modal .nc-m3-def { border: 1px solid var(--line); border-left: 3px solid var(--t-muted); border-radius: 8px; padding: 10px 12px; background: var(--bg-1); }
.obs-modal .nc-m3-def.high { border-left-color: #F53F3F; }
.obs-modal .nc-m3-def.mid { border-left-color: #FF7D00; }
.obs-modal .nc-m3-def.low { border-left-color: #00B42A; }
.obs-modal .nc-m3-def .def-head { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin-bottom: 4px; }
.obs-modal .nc-m3-def .sev { font-size:12px; font-weight: 800; padding: 1px 8px; border-radius: 999px; color: #fff; }
.obs-modal .nc-m3-def .sev.high { background: #F53F3F; }
.obs-modal .nc-m3-def .sev.mid { background: #FF7D00; }
.obs-modal .nc-m3-def .sev.low { background: #00B42A; }
.obs-modal .nc-m3-def .stage, .obs-modal .nc-m3-def .dimension, .obs-modal .nc-m3-def .seg { font-size:12px; color: var(--t2); border: 1px solid var(--line); border-radius: 999px; padding: 1px 8px; background: var(--bg-2); }
.obs-modal .nc-m3-def .jmp { margin-left: auto; font-size:12px; padding: 2px 8px; cursor: pointer; }
.obs-modal .nc-m3-def .issue { font-size:14px; line-height: 1.5; color: var(--t1); margin-bottom: 3px; }
.obs-modal .nc-m3-def .evidence { font-size:12px; color: var(--t3); line-height: 1.5; }
.obs-modal .nc-m3-def .ev-box { margin-top: 8px; display: flex; flex-wrap: wrap; gap: 8px; align-items: flex-start; }
.obs-modal .nc-m3-def .ev-load { font-size:12px; color: var(--t-muted); font-style: italic; }
.obs-modal .nc-m3-def .ev-lab { width: 100%; font-size:12px; color: var(--t2); font-weight: 600; }
.obs-modal .nc-m3-def .ev-img { min-width: 0; max-width: 220px; }
.obs-modal .nc-m3-def .ev-img .cap { font-size: 10.5px; color: var(--t3); margin-bottom: 3px; }
.obs-modal .nc-m3-def .ev-img img { display: block; width: 100%; max-width: 220px; height: auto; border-radius: 6px; border: 1px solid var(--line); }
.obs-modal .nc-m3-def .ev-img.ref { max-width: 180px; }
.obs-modal .nc-m3-def .ev-img.ref img { max-width: 180px; }
.obs-modal .nc-m3-empty { font-size: 12px; color: var(--t-muted); padding: 6px 0; }

/* 进化双轴曲线 */
.obs-modal .nc-m3-curve svg { width: 100%; height: auto; }

/* 生成链修复方案（只读） */
.obs-modal .nc-m3-actions { display: flex; align-items: center; gap: 8px; margin: 4px 0 6px; }
.obs-modal .nc-m3-actions .nc-m3-genchain { font-size:12px; padding: 2px 10px; }
.obs-modal .nc-m3-genchain-note { font-size: 10.5px; color: var(--t-muted); }
.obs-modal .nc-m3-genchain-out { font-size:12px; }
.obs-modal .nc-m3-genchain-head { font-size:12px; font-weight: 700; color: var(--t2); margin: 6px 0 3px; }
.obs-modal .nc-m3-genchain-row { font-size:12px; color: var(--t2); padding: 2px 0; border-bottom: 1px dashed var(--line); }
.obs-modal .nc-m3-genchain-row:last-child { border-bottom: 0; }

/* ===== 统一 结构分析/产品分析/分类簇/产品卡 为一致卡片风格 ===== */
.product-cluster-merged > .structure-notes,
.product-cluster-merged > .pcm-images,
.product-cluster-merged > .pcm-clusters,
.product-cluster-merged > .advanced-collapse {
  border: 1px solid #eceef2 !important;
  border-left: 1px solid #eceef2 !important;
  border-radius: 12px !important;
  background: #fff !important;
  padding: 16px 18px !important;
  box-shadow: 0 1px 2px rgba(0,0,0,.04) !important;
  margin: 0 0 16px !important;
  animation: none !important;
}
/* 统一头部：标题左 + 副注/徽标右 + 底部分隔线 */
.product-cluster-merged > .structure-notes .structure-notes-head,
.product-cluster-merged > .pcm-images .pcm-head,
.product-cluster-merged > .pcm-clusters .pcm-cluster-head,
.product-cluster-merged > .advanced-collapse > summary {
  display: flex !important; align-items: baseline !important; gap:12px !important; flex-wrap: wrap !important;
  padding: 0 0 12px !important; margin-bottom: 12px !important; border-bottom: 1px solid #f1f3f7 !important;
}
.product-cluster-merged > .advanced-collapse > summary { list-style: none !important; cursor: pointer !important; }
.product-cluster-merged > .advanced-collapse > summary::-webkit-details-marker { display: none !important; }
/* 标题统一 */
.product-cluster-merged > .structure-notes .sn-title,
.product-cluster-merged > .pcm-images .pcm-head > span:first-child,
.product-cluster-merged > .pcm-clusters .pcm-cluster-head > span:first-child,
.product-cluster-merged > .advanced-collapse .ac-title {
  font-size: 14px !important; font-weight:600 !important; color: #111 !important; display: inline-flex !important; align-items: center !important; gap: 8px !important;
}
/* 徽标统一 */
.product-cluster-merged .opt-badge { font-size:12px !important; color: #165DFF !important; border: 1px solid #dbe3f0 !important; border-radius: 999px !important; padding: 1px 8px !important; font-weight: 500 !important; background: #f0f4ff !important; }
/* hint/副注统一小灰 */
.product-cluster-merged .hint-sub,
.product-cluster-merged .cp-sub,
.product-cluster-merged .structure-notes-hint { font-size: 12px !important; color: #999 !important; font-weight: 400 !important; }
/* 空态统一：不用 dashed，左对齐灰文（与卡片一致） */
.product-cluster-merged .pcm-empty { border: none !important; background: transparent !important; padding: 8px 0 4px !important; align-items: flex-start !important; gap: 3px !important; }
.product-cluster-merged .pcm-empty > span { font-size:14px !important; color: #4E5969 !important; }
.product-cluster-merged .pcm-empty .pcm-hint { font-size:12px !important; color: #999 !important; max-width: none !important; text-align: left !important; }
/* 按钮统一 */
.product-cluster-merged .btn, .product-cluster-merged .structure-notes-head .btn { border-radius: 8px !important; }

/* ===== 字体层级优化：标题/正文/标签/说明 分级（只改字号字重行高，不改颜色/边框/布局）===== */
body { font-size: 14px; line-height: 1.55; }
.step0-col-title, .admin-card h3, .obs-proj-row .pname { font-size:16px !important; font-weight:600 !important; }
.step0-col-title .step0-col-hint { font-size: 12px !important; font-weight: 400 !important; color: #98a3b6 !important; }
.step0-meta-card .field > span, .field > span { font-size:14px !important; color: #5a6679 !important; font-weight: 500 !important; }
.input-field span, .field-hint { font-size:12px !important; color: #98a3b6 !important; }
input, textarea, select { font-size: 14px !important; }
.sn-title, .pcm-head > span:first-child, .pcm-cluster-head > span:first-child, .structure-notes-hint { font-size:16px !important; font-weight:600 !important; color: #111 !important; }
.sn-title, .pcm-head > span:first-child, .pcm-cluster-head > span:first-child { font-size: 14px !important; }
.hint-sub, .cp-sub, .field-hint, .structure-notes-hint { font-size: 12px !important; color: #98a3b6 !important; font-weight: 400 !important; }
.sn-empty-title { font-size:14px !important; font-weight: 600 !important; color: #111 !important; }
.sn-empty-sub, .structure-notes-hint { font-size: 12px !important; color: #98a3b6 !important; }
.sn-dim { font-size:12px !important; }
.sn-val, .pcm-hint { font-size:14px !important; color: #5a6679 !important; }
.btn, button { font-size:14px !important; font-weight: 500 !important; }
.sn-empty-ico { color: #165DFF !important; }
.sn-empty-ico svg { width: 28px !important; height: 28px !important; }
/* 修复:下拉遮罩不拦截点击(穿透到下方卡片);点外部关闭走已有 outsideClick */
.dd-backdrop { pointer-events: none !important; }

/* 修复:历史任务详情视频被 .td-hero 裁成短条 -> 视频按16:9完整高度显示 */
.td-hero { height: auto !important; max-height: none !important; }
.td-video { width: 100% !important; aspect-ratio: 16 / 9 !important; height: auto !important; min-height: 200px !important; max-height: none !important; object-fit: contain !important; display: block !important; background: #0f172a !important; }

/* 修复:历史任务详情视频被 .td-hero 裁成短条 -> 让视频按16:9完整高度显示(hero不裁视频) */
.td-hero { height: auto !important; overflow: visible !important; }
.td-hero .td-status-float { z-index: 2; }
.td-video { width: 100% !important; height: auto !important; aspect-ratio: 16 / 9 !important; object-fit: contain !important; display: block !important; border-radius: 12px !important; background: #0f172a !important; }
/* 上传图灯箱 */
#imgLightbox button { position:absolute; background:rgba(255,255,255,.08); border:none; color:#fff; border-radius:50%; width:44px; height:44px; font-size:24px; line-height:1; cursor:pointer; display:flex; align-items:center; justify-content:center; transition:background .18s; }
#imgLightbox button:hover { background:rgba(255,255,255,.2); }
#imgLightbox .ilb-close { top:18px; right:22px; font-size:26px; }
#imgLightbox .ilb-prev { left:18px; top:50%; transform:translateY(-50%); }
#imgLightbox .ilb-next { right:18px; top:50%; transform:translateY(-50%); }
#imgLightbox .ilb-img { max-width:82vw; max-height:72vh; object-fit:contain; border-radius:10px; background:#000; box-shadow:0 8px 40px rgba(0,0,0,.5); }
#imgLightbox .ilb-thumbs { position:absolute; bottom:16px; left:50%; transform:translateX(-50%); display:flex; gap:8px; max-width:86vw; overflow-x:auto; padding:6px; background:rgba(255,255,255,.06); border-radius:10px; }
#imgLightbox .ilb-thumb { width:56px; height:56px; object-fit:cover; border-radius:6px; cursor:pointer; opacity:.5; border:2px solid transparent; flex:none; }
#imgLightbox .ilb-thumb.active { opacity:1; border-color:#165DFF; }
/* 了解产品整行按钮（产品形象+产品资料库 下方） */
.understand-full-row { grid-column: 1 / -1; display: flex; align-items: center; gap: 12px; margin-top: 16px; padding: 4px 2px; }
.understand-full-row .btn.primary { min-height: 42px; padding: 10px 22px; font-size: 14px; font-weight: 600; }
.understand-full-row .hint { font-size: 12px; color: #98a3b6; }

/* ===== 文案创作步骤顶部排版整洁：Agent协作banner + Agent卡 + 生成按钮 ===== */
@keyframes ds-spin { to { transform: rotate(360deg); } }
.step-busy-banner {
  display: flex !important; align-items: center !important; gap:12px !important;
  margin: 0 0 14px !important; padding: 10px 16px !important;
  background: rgba(64,128,255,.08) !important; border: 1px solid rgba(64,128,255,.22) !important;
  border-radius: 10px !important; font-size:14px !important; color: #2f5f9e !important; line-height: 1.5 !important;
}
.step-busy-spinner {
  width: 16px !important; height: 16px !important; flex: none !important;
  border: 2px solid rgba(64,128,255,.25) !important; border-top-color: #4080FF !important;
  border-radius: 50% !important; animation: ds-spin .7s linear infinite !important; display: inline-block !important;
}
/* Agent 卡（文案创作顶部一排）*/ 
.agent-roster { gap: 8px !important; }
.agent-roster .agent-card, .agent-roster > div { min-height: 38px !important; border-radius: 9px !important; padding: 6px 10px !important; }
.agent-rm-chip { border: 1px solid #e8ecf3 !important; background: #fff !important; border-radius: 20px !important; padding: 4px 10px !important; font-size: 12px !important; }
/* 生成文案 主按钮 区 */
#btnGenCopy { min-height: 44px !important; font-weight: 600 !important; }
/* 资产/参考缩略图失效占位（签名URL过期或加载失败） */
.pa-thumb { position: relative; display: inline-flex; align-items: center; justify-content: center; background: #f1f3f7; overflow: hidden; }
.pa-thumb.pa-thumb-failed img { display: none; }
.pa-thumb.pa-thumb-failed::after { content: '图片已失效'; font-size:12px; color: #9aa3b2; text-align: center; white-space: normal; line-height: 1.2; }

/* ===== nextcoder 扫修修复：B1(1024步骤0双卡挤压) + B3(深色主题白块) ===== */
/* B1: 中等宽度(768-1080)时步骤0双卡改单列或更宽，避免挤压断行 */
@media (max-width: 1080px) {
  .step0-cards { grid-template-columns: 1fr !important; }
  .step0-col-left, .step0-col-right { min-width: 0 !important; }
}
@media (min-width: 1081px) and (max-width: 1220px) {
  .step0-cards { grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 16px !important; }
  .step0-col-hint { white-space: normal !important; }
}
/* B3: 深色主题下「产品资料库」内层白底卡 跟随主题深色 */
[data-theme="dark"] .product-context-body,
[data-theme="dark"] .product-context-collapse,
[data-theme="dark"] .product-brief-card, [data-theme="dark"] .step0-meta-card,
[data-theme="dark"] .free-upload-section, [data-theme="dark"] .product-brief-files-list {
  background: var(--bg-1, #0f1723) !important; color: var(--t1) !important; border-color: var(--line-strong, #2a3548) !important;
}
[data-theme="dark"] .product-context-body input, [data-theme="dark"] .product-context-body textarea,
[data-theme="dark"] .product-brief-card textarea { background: var(--bg-2, #16202f) !important; color: var(--t1) !important; }

/* ===== nextcoder 扫修修复：响应式/移动端破版 (D1-D3/D5-D8/D10) ===== */
/* D2: users/统计大数字不溢出被裁 */
.users-stat-value, .stat-value, .gstat-num { overflow-wrap: anywhere !important; word-break: break-word !important; min-width: 0 !important; }
/* D3: users 用户表格容器横向可滚(非 hidden)，右侧列可达 */
.users-table-card { overflow-x: auto !important; -webkit-overflow-scrolling: touch !important; }
/* D1/D8: 标题不逐字竖排 */
.admin-panel-title, .panel-title { word-break: keep-all !important; white-space: normal !important; }
/* D5: 资产卡 名称+日期 不溢出 */
.asset-card .pa-name, .asset-card .pa-time { white-space: normal !important; overflow-wrap: anywhere !important; }
/* D6: index 顶栏品牌 390 不折叠成竖线 */
.brand-name { white-space: nowrap !important; }
/* D7: history 搜索+工具栏 横向可滚不裁 */
.toolbar, .search-bar, .history-toolbar { flex-wrap: wrap !important; }
.toolbar > *, .search-bar > * { min-width: 0 !important; }
@media (max-width: 640px) {
  .brand-name, .nav-name { white-space: nowrap !important; min-width: 0 !important; }
  .users-table-card, .asset-grid { overflow-x: auto !important; }
}
/* D10: 登录演示账号 chips 用 lucide 风格(去 emoji 花哨) —— 若为字符图标则改线性 */

/* ============================================================
   Really.Show 统一视觉规范 v1 · 设计令牌层（前后端共用）
   ============================================================ */
:root {
  --rs-bg: #F5F6F7; --rs-bg-2: #F9FAFB; --rs-card: #FFFFFF;
  --rs-line-04: rgba(0,0,0,.04); --rs-line-10: rgba(0,0,0,.10);
  --rs-line-12: rgba(0,0,0,.12); --rs-line-16: rgba(0,0,0,.16);
  --rs-t1: #1D2129; --rs-t2: #4E5969; --rs-t3: #86909C; --rs-t4: #C9CDD4;
  --rs-blue: #165DFF; --rs-blue-500: #4080FF; --rs-logo: #165DFF;
  --rs-ok: #00B42A; --rs-warn: #FF7D00; --rs-err: #F53F3F;
  --rs-radius: 8px; --rs-radius-s: 4px; --rs-radius-pill: 999px;
  --rs-shadow-2: 0 1px 2px rgba(0,0,0,.04);
  --rs-shadow-3: 0 8px 24px -6px rgba(15,23,42,.10);
  --rs-container: 1120px;
  --rs-font: inherit;
  --rs-ease: cubic-bezier(0.4,0,0.2,1);
  /* 字阶 */
  --rs-fs-h1: 24px; --rs-fs-h2: 20px; --rs-fs-card: 18px; --rs-fs-body: 14px; --rs-fs-label: 12px; --rs-fs-badge: 11px;
}

/* ============================================================
   Really.Show 统一视觉规范 v1 · 组件覆盖层（前后端共用）
   ============================================================ */
/* 1) 卡片/面板 surface：白卡 + 细边(0.12) + 圆角12 + 轻阴影，去掉粗边框/突兀色底 */
body .step0-col-left, body .step0-col-right, body .step0-meta-card, body .free-upload-section,
body .product-context-collapse, body .product-cluster-merged, body .structure-notes, body .pcm-images,
body .pcm-clusters, body .visual-card-editor, body .advanced-collapse,
#adminBody .admin-card, #adminBody .obs-card, #adminBody .users-stat-card, #adminBody .settings-card,
body .adv-group, body .brief-card, body .panel, body .card {
  background: var(--rs-card) !important;
  border: 1px solid var(--rs-line-12) !important;
  border-radius: var(--rs-radius) !important;
  box-shadow: var(--rs-shadow-2) !important;
}
body .step0-col-left, body .step0-col-right, body .free-upload-section, body .product-cluster-merged,
body .visual-card-editor, body .advanced-collapse, body .product-context-collapse { padding: 20px 22px !important; }
/* 去重投影/突兀色底（原样式可能带渐变顶条/色底） */
body .step0-col-left, body .step0-col-right, body .step0-meta-card, body .free-upload-section,
body .product-context-collapse, body .product-cluster-merged, body .structure-notes { box-shadow: var(--rs-shadow-2) !important; }
/* 2) 标题层级 */
body .step0-col-title, #adminBody .panel-title, #adminBody .admin-card h3, body .sn-title,
body .pcm-head > span:first-child, body .pcm-cluster-head > span:first-child {
  font-size:16px !important; font-weight:600 !important; color: var(--rs-t1) !important; letter-spacing: -.01em !important;
}
body .step0-col-title .step0-col-hint, body .hint-sub, body .cp-sub, body .structure-notes-hint { font-size: 12px !important; color: var(--rs-t3) !important; font-weight: 400 !important; }
/* 3) 输入/下拉/文本域 */
body input[type="text"], body input[type="url"], body select, body textarea, body input[type="number"], body input[type="password"] {
  border: 1px solid var(--rs-line-12) !important; border-radius: var(--rs-radius-s) !important;
  padding: 8px 12px !important; background: var(--rs-card) !important; color: var(--rs-t1) !important;
  font-size:14px !important; transition: border-color .12s var(--rs-ease), box-shadow .12s var(--rs-ease) !important;
}
body input:focus, body select:focus, body textarea:focus { border-color: var(--rs-blue) !important; box-shadow: 0 0 0 3px rgba(22,93,255,.14) !important; outline: none !important; }
/* 4) 按钮：胶囊/主蓝/次白细边/ghost */
body .btn, #adminBody .users-btn, #adminBody .act-agent-roster-btn, #adminBody .obs-filter-btn {
  border-radius: var(--rs-radius-pill) !important; padding: 8px 14px !important; font-size:14px !important; font-weight: 500 !important;
  transition: background .14s var(--rs-ease), border-color .14s var(--rs-ease) !important; text-transform: none !important;
}
body .btn.primary, body .btn-primary, #adminBody .btn.primary, #adminBody .users-btn.primary {
  background: var(--rs-blue) !important; color: #fff !important; border: 1px solid transparent !important;
}
body .btn.ghost, body .btn.outline, #adminBody .users-btn.ghost, #adminBody .users-btn.outline {
  background: var(--rs-card) !important; color: var(--rs-t1) !important; border: 1px solid var(--rs-line-12) !important;
}
/* 5) 统计大卡：标签→大数字→徽标 */
#adminBody .users-stat-card, #adminBody .gstat, #adminBody .obs-stat, #adminBody .kpi {
  background: var(--rs-card) !important; border: 1px solid var(--rs-line-12) !important; border-radius: var(--rs-radius) !important; padding: 18px 20px !important;
}
#adminBody .users-stat-value, #adminBody .gstat-num { font-size: 28px !important; font-weight: 700 !important; color: var(--rs-t1) !important; }
#adminBody .users-stat-label, #adminBody .gstat-label { font-size: 12px !important; color: var(--rs-t3) !important; }
/* 6) 表格 */
#adminBody .users-table-card, #adminBody .data-table-card, #adminBody .obs-table-card { border: 1px solid var(--rs-line-12) !important; border-radius: var(--rs-radius) !important; overflow-x: auto !important; }
#adminBody table th { font-size: 12px !important; font-weight: 500 !important; color: var(--rs-t3) !important; text-transform: uppercase !important; letter-spacing: .03em !important; background: var(--rs-bg-2) !important; }
#adminBody table td { font-size:14px !important; color: var(--rs-t1) !important; }
#adminBody table tr:hover td { background: rgba(0,0,0,.03) !important; }
/* 7) 主色强调归一到 rs-blue */
#adminBody { --brand: var(--rs-blue) !important; --brand-text: var(--rs-blue) !important; --accent: var(--rs-blue) !important; --ds-accent: var(--rs-blue) !important; }
body .btn.primary, body .btn-primary, body .understand-full-row .btn.primary { background: var(--rs-blue) !important; }
/* 产品资料文件 组件化 dropzone（替代原生file按钮） */
.brief-drop { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:6px; padding:16px; border:1.5px dashed var(--rs-line-16,#cbd2dc); border-radius:var(--rs-radius-s,8px); background:var(--rs-bg-2,#f9fafb); cursor:pointer; text-align:center; transition:border-color .14s var(--rs-ease), background .14s var(--rs-ease); }
.brief-drop:hover { border-color: var(--rs-blue,#165DFF); background: rgba(22,93,255,.03); }
.brief-drop i { color: var(--rs-blue,#165DFF); width:24px; height:24px; }
.brief-drop-main { font-size:14px; color: var(--rs-t1,#1D2129); font-weight:600; }
.brief-drop-sub { font-size:12px; color: var(--rs-t3,#86909C); }

/* ===== Really.Show 规范精修：左步骤条/子步骤 更简洁留白 ===== */
body .stepper-wrap { padding: 6px 0 !important; }
body .substeps { gap: 4px !important; margin: 6px 0 12px 30px !important; padding-left: 10px !important; border-left: 1px solid var(--rs-line-10, rgba(0,0,0,.10)) !important; }
body .substep { gap: 8px !important; padding: 4px 0 !important; font-size: 12px !important; color: var(--rs-t3, #86909C) !important; line-height: 1.5 !important; }
body .sub-dot { width: 6px !important; height: 6px !important; border-width: 1.5px !important; border-color: var(--rs-t4, #C9CDD4) !important; }
body .substep.active { color: var(--rs-t1, #1D2129) !important; font-weight: 600 !important; }
body .substep.active .sub-dot { border-color: var(--rs-blue, #165DFF) !important; box-shadow: 0 0 0 3px rgba(22,93,255,.12) !important; }
body .substep.done { color: var(--rs-t2, #4E5969) !important; }
body .substep.done .sub-dot { background: var(--rs-blue, #165DFF) !important; border-color: var(--rs-blue, #165DFF) !important; }
body .substep.optional { opacity: .6 !important; }
/* 顶部工具栏右侧按钮 更均匀 */
body .top-right, body .toolbar-right, body .top-links { gap:12px !important; }
body .lib-btn { padding: 6px 12px !important; border-radius: var(--rs-radius-pill, 18px) !important; font-size:14px !important; }


/* 上传区图标：干净圆形蓝徽标 + lucide 线性(若渲染) */
.free-upload-icon { width: 34px !important; height: 34px !important; color: #fff !important; background: linear-gradient(135deg,#4080FF,#165DFF) !important; border-radius: 50% !important; margin: 0 auto 8px !important; display: flex !important; align-items: center !important; justify-content: center !important; box-shadow: 0 2px 8px rgba(22,93,255,.25) !important; }
.free-upload-icon svg { width: 18px !important; height: 18px !important; }
/* 图片上传 dropzone 精修(Really.Show) */
.free-upload-drop { border: 1.5px dashed var(--rs-line-16,#cbd2dc) !important; padding: 34px 16px !important; background: var(--rs-bg-2,#f9fafb) !important; }
.free-upload-drop::before { display: none !important; }
.free-upload-icon { width: 34px !important; height: 34px !important; color: #fff !important; background: var(--rs-blue,#165DFF) !important; border-radius: 50% !important; margin: 0 auto 8px !important; display: flex !important; align-items: center !important; justify-content: center !important; }
.free-upload-main { font-size: 14px !important; color: var(--rs-t1,#1D2129) !important; font-weight: 600 !important; }
.free-upload-sub { display:block !important; font-size:12px !important; color: var(--rs-t3,#86909C) !important; margin-top: 3px !important; }

/* 参考资料 URL 行 精修(Really.Show) */
.pc-url-row { gap: 8px !important; }
.pc-url-row input { padding: 8px 12px !important; font-size:14px !important; }
.pc-url-row .btn.ghost { padding: 8px 14px !important; border: 1px solid var(--rs-line-12, rgba(0,0,0,.12)) !important; border-radius: var(--rs-radius-pill, 18px) !important; background: var(--rs-card,#fff) !important; color: var(--rs-t1,#1D2129) !important; }
.pc-auto-pool { font-size: 12px !important; color: var(--rs-t3,#86909C) !important; gap: 6px !important; }
.pc-auto-pool input[type="checkbox"] { width: 14px !important; height: 14px !important; accent-color: var(--rs-blue,#165DFF) !important; }
.pc-drop-hint { font-size: 12px !important; color: var(--rs-t3,#86909C) !important; }

/* ============================================================
   Really.Show 统一视觉规范 v2 · Arco Design 官方 token（基准）
   ============================================================ */
:root {
  --arco-color-primary: #165DFF; --arco-color-primary-hover: #4080FF; --arco-color-primary-press: #0E42D2; --arco-color-primary-bg: #E8F3FF;
  --arco-bg-layout: #f7f8fa; --arco-bg-container: #ffffff; --arco-bg-elevated: #ffffff;
  --arco-border-1: #e5e6eb; --arco-border-2: #f2f3f5; --arco-border-3: #f7f8fa;
  --arco-text-1: #1d2129; --arco-text-2: #4e5969; --arco-text-3: #86909c; --arco-text-4: #c9cdd4;
  --arco-success: #00b42a; --arco-warning: #ff7d00; --arco-danger: #f53f3f; --arco-link: #165DFF;
  --arco-radius: 4px; --arco-radius-lg: 8px; --arco-radius-sm: 2px;
  --arco-font-size: 14px; --arco-font-size-lg: 16px; --arco-font-size-sm: 12px;
  --arco-font-family: -apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,'Helvetica Neue',Arial,'PingFang SC','Microsoft YaHei',sans-serif;
  --arco-control-height: 32px; --arco-control-padding-h: 12px;
  --arco-shadow: 0 4px 10px rgba(0,0,0,.10);
  /* 本地别名 → arco */
  --rs-bg: var(--arco-bg-layout); --rs-bg-2: var(--arco-bg-container); --rs-card: var(--arco-bg-container);
  --rs-line-04: var(--arco-border-3); --rs-line-10: var(--arco-border-2); --rs-line-12: var(--arco-border-1); --rs-line-16: var(--arco-border-1);
  --rs-t1: var(--arco-text-1); --rs-t2: var(--arco-text-2); --rs-t3: var(--arco-text-3); --rs-t4: var(--arco-text-4);
  --rs-blue: var(--arco-color-primary); --rs-blue-500: var(--arco-color-primary); --rs-logo: var(--arco-color-primary);
  --rs-ok: var(--arco-success); --rs-warn: var(--arco-warning); --rs-err: var(--arco-danger);
  --rs-radius: var(--arco-radius-lg); --rs-radius-s: var(--arco-radius); --rs-radius-pill: var(--arco-radius);
  --rs-shadow-2: var(--arco-shadow); --rs-shadow-3: var(--arco-shadow);
  --rs-container: 1200px; --rs-font: var(--arco-font-family);
  --rs-ease: cubic-bezier(0.645,0.045,0.355,1);
  --rs-fs-h1: 24px; --rs-fs-h2: 20px; --rs-fs-card: 16px; --rs-fs-body: 14px; --rs-fs-label: 12px; --rs-fs-badge: 11px;
}
/* 组件对齐 Arco：按钮圆角矩形(4px) 非胶囊；主色 #165DFF */
body .btn, #adminBody .users-btn, #adminBody .act-agent-roster-btn, #adminBody .obs-filter-btn { border-radius: var(--arco-radius, 4px) !important; }
body .btn.primary, body .btn-primary, #adminBody .btn.primary, #adminBody .users-btn.primary,
body .understand-full-row .btn.primary { background: var(--arco-color-primary, #165DFF) !important; color: #fff !important; }
body .btn.ghost, body .btn.outline, #adminBody .users-btn.ghost, #adminBody .users-btn.outline { background: var(--arco-bg-container,#fff) !important; border: 1px solid var(--arco-border-1,#e5e6eb) !important; color: var(--arco-text-1,#1d2129) !important; }
body .brief-drop, .free-upload-drop { border-color: var(--arco-border-1,#e5e6eb) !important; }
body .brief-drop i, .free-upload-icon { color: var(--arco-color-primary,#165DFF) !important; }
.free-upload-icon { background: var(--arco-color-primary,#165DFF) !important; }

/* ===== Arco Design 深色 token 适配（前后端一致） ===== */
[data-theme="dark"] {
  --arco-bg-layout: #17171a; --arco-bg-container: #232324; --arco-bg-elevated: #2a2a2b;
  --arco-border-1: #484849; --arco-border-2: #3a3a3b; --arco-border-3: #2a2a2b;
  --arco-text-1: #f7f7f8; --arco-text-2: #b8b8ba; --arco-text-3: #8d8d90; --arco-text-4: #5a5a5c;
  --arco-color-primary: #4080FF; --arco-color-primary-hover: #4A8CFF;
  --rs-bg: var(--arco-bg-layout); --rs-bg-2: var(--arco-bg-container); --rs-card: var(--arco-bg-container);
  --rs-line-12: var(--arco-border-1); --rs-line-10: var(--arco-border-2); --rs-line-04: var(--arco-border-3);
  --rs-t1: var(--arco-text-1); --rs-t2: var(--arco-text-2); --rs-t3: var(--arco-text-3); --rs-t4: var(--arco-text-4);
  --rs-blue: var(--arco-color-primary);
}
[data-theme="dark"] body, [data-theme="dark"] #adminBody { background: var(--arco-bg-layout) !important; color: var(--arco-text-1) !important; }
[data-theme="dark"] body .step0-col-left, [data-theme="dark"] body .step0-col-right, [data-theme="dark"] body .step0-meta-card,
[data-theme="dark"] body .free-upload-section, [data-theme="dark"] body .product-context-collapse, [data-theme="dark"] body .product-context-body,
[data-theme="dark"] #adminBody .admin-card, [data-theme="dark"] #adminBody .obs-card, [data-theme="dark"] #adminBody .users-stat-card,
[data-theme="dark"] #adminBody .settings-card, [data-theme="dark"] body .card, [data-theme="dark"] body .panel {
  background: var(--arco-bg-container) !important; border-color: var(--arco-border-1) !important; color: var(--arco-text-1) !important;
}
[data-theme="dark"] body input, [data-theme="dark"] body select, [data-theme="dark"] body textarea { background: var(--arco-bg-elevated) !important; color: var(--arco-text-1) !important; border-color: var(--arco-border-1) !important; }
[data-theme="dark"] body .btn.ghost, [data-theme="dark"] body .btn.outline, [data-theme="dark"] #adminBody .users-btn.ghost { background: var(--arco-bg-container) !important; color: var(--arco-text-1) !important; border-color: var(--arco-border-1) !important; }
[data-theme="dark"] body .sider, [data-theme="dark"] #adminBody .sider, [data-theme="dark"] .admin-sider { background: var(--arco-bg-container) !important; }

/* ===== Arco 对账：选项卡/徽标/选择(文案/视频/结构分析步骤) ===== */
.opt-card { border: 1px solid var(--arco-border-1,#e5e6eb) !important; border-radius: var(--arco-radius,4px) !important; background: var(--arco-bg-container,#fff) !important; transition: border-color .14s, box-shadow .14s !important; }
.opt-card:hover { border-color: var(--arco-color-primary,#165DFF) !important; }
.opt-card.selected { border-color: var(--arco-color-primary,#165DFF) !important; background: var(--arco-color-primary-bg,#E8F3FF) !important; box-shadow: none !important; }
.opt-card .opt-name { font-size: 14px !important; font-weight: 500 !important; color: var(--arco-text-1,#1d2129) !important; }
.opt-card .opt-sub { font-size: 12px !important; color: var(--arco-text-3,#86909c) !important; }
.opt-badge { font-size:12px !important; color: var(--arco-color-primary,#165DFF) !important; background: var(--arco-color-primary-bg,#E8F3FF) !important; border: none !important; border-radius: var(--arco-radius,4px) !important; padding: 0 8px !important; font-weight: 500 !important; }
.opt-card.selected .opt-check { background: var(--arco-color-primary,#165DFF) !important; border-color: var(--arco-color-primary,#165DFF) !important; }
.opt-check { border: 1px solid var(--arco-border-1,#e5e6eb) !important; border-radius: 50% !important; }
.opt-card.selected { color: var(--arco-text-1,#1d2129) !important; }
.pc-drop-hint { color: var(--arco-text-3,#86909c) !important; }

/* ============================================================
   ✓✓ ARCO DESIGN SYSTEM — 完整组件库（全局 · 前后端共用）
   ------------------------------------------------------------
   token 精确对齐 Arco Design 官方：
   主 #165DFF / hover #4080FF / press #0E42D2 / 浅底 #E8F3FF
   底 #f7f8fa · 容器 #fff · 边框 #e5e6eb/#f2f3f5/#f7f8fa
   文字 #1d2129/#4e5969/#86909c/#c9cdd4
   成功 #00b42a · 警告 #ff7d00 · 错误 #f53f3f
   圆角 4/8 · 字号 14/16/12 · 控件高 32 · pad 0 12
   阴影 0 4px 10px rgba(0,0,0,.10) · 线性图标 1.5px
   追加于 styles.css 末尾（白名单：!important 兜底，不删任何板块/功能）
   ============================================================ */

/* ---------- 0. 基础 token（增强，末位覆盖同名） ---------- */
:root {
  --arco-color-primary: #165DFF;
  --arco-color-primary-hover: #4080FF;
  --arco-color-primary-press: #0E42D2;
  --arco-color-primary-bg: #E8F3FF;
  --arco-bg-layout: #f7f8fa;
  --arco-bg-container: #ffffff;
  --arco-bg-elevated: #ffffff;
  --arco-border-1: #e5e6eb;
  --arco-border-2: #f2f3f5;
  --arco-border-3: #f7f8fa;
  --arco-text-1: #1d2129;
  --arco-text-2: #4e5969;
  --arco-text-3: #86909c;
  --arco-text-4: #c9cdd4;
  --arco-success: #00b42a;
  --arco-warning: #ff7d00;
  --arco-danger: #f53f3f;
  --arco-link: #165DFF;
  --arco-radius: 4px;
  --arco-radius-lg: 8px;
  --arco-radius-sm: 2px;
  --arco-round: 999px;
  --arco-font-size: 14px;
  --arco-font-size-lg: 16px;
  --arco-font-size-sm: 12px;
  --arco-font-family: -apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,'Helvetica Neue',Arial,'PingFang SC','Microsoft YaHei',sans-serif;
  --arco-control-height: 32px;
  --arco-control-padding-h: 12px;
  --arco-shadow: 0 4px 10px rgba(0,0,0,.10);
  --arco-shadow-sm: 0 2px 6px rgba(0,0,0,.06);
  --arco-shadow-xs: 0 1px 2px rgba(0,0,0,.05);
  --arco-ease: cubic-bezier(.645,.045,.355,1);
  --arco-duration: .18s;
  --arco-icon-size: 1.5px; /* 线性图标描边单位 */
}

[data-theme="dark"] {
  --arco-bg-layout: #17171a;
  --arco-bg-container: #232324;
  --arco-bg-elevated: #2a2a2b;
  --arco-border-1: #484849;
  --arco-border-2: #3a3a3b;
  --arco-border-3: #2a2a2b;
  --arco-text-1: #f7f7f8;
  --arco-text-2: #b8b8ba;
  --arco-text-3: #8d8d90;
  --arco-text-4: #5a5a5c;
  --arco-color-primary: #4080FF;
  --arco-color-primary-hover: #4A8CFF;
  --arco-color-primary-press: #2b65d6;
  --arco-color-primary-bg: #1d3a5f;
}

/* 线性图标统一 1.5px（lucide 类 svg / .arco-icon） */
.arco-icon svg, .arco svg.lucide, svg.lucide {
  stroke-width: var(--arco-icon-size, 1.5px) !important;
}

/* ---------- 1. 基础容器字体 ---------- */
.arco {
  font-family: var(--arco-font-family);
  font-size: var(--arco-font-size);
  color: var(--arco-text-1);
  line-height: 1.5;
  box-sizing: border-box;
}
.arco *, .arco *::before, .arco *::after { box-sizing: border-box; }

/* ============================================================
   ============ 2. Button 按钮 ============
   圆角4 / 高32 / pad 0 16 / 主#165DFF
   态：normal/hover/active/focus/disabled/loading/size
   ============================================================ */
.arco-btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  height: var(--arco-control-height, 32px) !important;
  padding: 0 var(--arco-control-padding-h, 12px) !important;
  border-radius: var(--arco-radius, 4px) !important;
  font-size: var(--arco-font-size, 14px) !important;
  font-weight: 500 !important;
  font-family: inherit !important;
  line-height: 1 !important;
  border: 1px solid transparent !important;
  cursor: pointer !important;
  color: var(--arco-text-1, #1d2129) !important;
  background: var(--arco-bg-container, #fff) !important;
  transition: background var(--arco-duration) var(--arco-ease), border-color var(--arco-duration) var(--arco-ease), color var(--arco-duration) var(--arco-ease), box-shadow var(--arco-duration) var(--arco-ease) !important;
  white-space: nowrap !important;
  user-select: none !important;
  -webkit-user-select: none !important;
  position: relative !important;
}
.arco-btn svg { width: 16px !important; height: 16px !important; }

/* primary */
.arco-btn-primary {
  color: #fff !important;
  background: var(--arco-color-primary, #165DFF) !important;
  border-color: var(--arco-color-primary, #165DFF) !important;
}
.arco-btn-primary:hover { background: var(--arco-color-primary-hover, #4080FF) !important; border-color: var(--arco-color-primary-hover, #4080FF) !important; }
.arco-btn-primary:active { background: var(--arco-color-primary-press, #0E42D2) !important; border-color: var(--arco-color-primary-press, #0E42D2) !important; }
.arco-btn-primary:focus-visible { box-shadow: 0 0 0 2px #fff, 0 0 0 4px var(--arco-color-primary, #165DFF) !important; }

/* secondary */
.arco-btn-secondary { color: var(--arco-color-primary, #165DFF) !important; background: var(--arco-color-primary-bg, #E8F3FF) !important; border-color: transparent !important; }
.arco-btn-secondary:hover { background: var(--arco-color-primary-bg, #E8F3FF) !important; color: var(--arco-color-primary-hover, #4080FF) !important; }
.arco-btn-secondary:active { color: var(--arco-color-primary-press, #0E42D2) !important; }

/* outline */
.arco-btn-outline { color: var(--arco-color-primary, #165DFF) !important; background: var(--arco-bg-container, #fff) !important; border-color: var(--arco-color-primary, #165DFF) !important; }
.arco-btn-outline:hover { color: var(--arco-color-primary-hover, #4080FF) !important; border-color: var(--arco-color-primary-hover, #4080FF) !important; background: var(--arco-color-primary-bg, #E8F3FF) !important; }
.arco-btn-outline:active { color: var(--arco-color-primary-press, #0E42D2) !important; border-color: var(--arco-color-primary-press, #0E42D2) !important; background: var(--arco-color-primary-bg, #E8F3FF) !important; }
.arco-btn-outline:focus-visible { box-shadow: 0 0 0 2px var(--arco-color-primary-bg, #E8F3FF) !important; }

/* text */
.arco-btn-text { color: var(--arco-color-primary, #165DFF) !important; background: transparent !important; border-color: transparent !important; }
.arco-btn-text:hover { background: var(--arco-color-primary-bg, #E8F3FF) !important; color: var(--arco-color-primary-hover, #4080FF) !important; }
.arco-btn-text:active { color: var(--arco-color-primary-press, #0E42D2) !important; }

/* danger */
.arco-btn-danger { color: #fff !important; background: var(--arco-danger, #f53f3f) !important; border-color: var(--arco-danger, #f53f3f) !important; }
.arco-btn-danger:hover { background: #f76560 !important; border-color: #f76560 !important; }
.arco-btn-danger:active { background: #d92a21 !important; border-color: #d92a21 !important; }
.arco-btn-danger:focus-visible { box-shadow: 0 0 0 2px #fff, 0 0 0 4px var(--arco-danger, #f53f3f) !important; }
/* danger outline/text */
.arco-btn-danger.arco-btn-outline { color: var(--arco-danger, #f53f3f) !important; background: var(--arco-bg-container, #fff) !important; border-color: var(--arco-danger, #f53f3f) !important; }
.arco-btn-danger.arco-btn-outline:hover { background: #ffece8 !important; }
.arco-btn-danger.arco-btn-text { color: var(--arco-danger, #f53f3f) !important; background: transparent !important; }
.arco-btn-danger.arco-btn-text:hover { background: #ffece8 !important; }

/* neutral secondary (gray) */
.arco-btn-secondary-gray { color: var(--arco-text-1, #1d2129) !important; background: var(--arco-bg-2, #f2f3f5) !important; border-color: transparent !important; }
.arco-btn-secondary-gray:hover { background: var(--arco-border-2, #e5e6eb) !important; }

/* sizes */
.arco-btn-size-sm { height: 28px !important; padding: 0 10px !important; font-size: var(--arco-font-size-sm, 12px) !important; }
.arco-btn-size-lg { height: 40px !important; padding: 0 20px !important; font-size: var(--arco-font-size-lg, 16px) !important; }
.arco-btn-block { width: 100% !important; }

/* disabled */
.arco-btn-disabled, .arco-btn:disabled, .arco-btn[disabled], .arco-btn[aria-disabled="true"] {
  cursor: not-allowed !important;
  opacity: .55 !important;
  box-shadow: none !important;
  pointer-events: none !important;
  color: var(--arco-text-4, #c9cdd4) !important;
  background: var(--arco-border-3, #f7f8fa) !important;
  border-color: var(--arco-border-2, #e5e6eb) !important;
}

/* loading */
.arco-btn-loading { cursor: default !important; opacity: .8 !important; pointer-events: none !important; }
.arco-btn-loading::before {
  content: "" !important;
  width: 14px !important;
  height: 14px !important;
  border: 2px solid currentColor !important;
  border-right-color: transparent !important;
  border-radius: 50% !important;
  animation: arco-spin .7s linear infinite !important;
  display: inline-block !important;
  flex: 0 0 auto !important;
}
@keyframes arco-spin { to { transform: rotate(360deg) !important; } }

/* ============================================================
   ============ 3. Input / Textarea / Select / Number ============
   高32 / 圆角4 / 边框#e5e6eb / focus #165DFF+2px柔光 / disabled
   ============================================================ */
.arco-input {
  width: 100% !important;
  height: var(--arco-control-height, 32px) !important;
  padding: 0 var(--arco-control-padding-h, 12px) !important;
  border: 1px solid var(--arco-border-1, #e5e6eb) !important;
  border-radius: var(--arco-radius, 4px) !important;
  background: var(--arco-bg-container, #fff) !important;
  color: var(--arco-text-1, #1d2129) !important;
  font-size: var(--arco-font-size, 14px) !important;
  font-family: inherit !important;
  line-height: 1.4 !important;
  transition: border-color var(--arco-duration) var(--arco-ease), box-shadow var(--arco-duration) var(--arco-ease) !important;
  outline: none !important;
}
.arco-input::placeholder { color: var(--arco-text-4, #c9cdd4) !important; }
.arco-input:hover { border-color: var(--arco-color-primary, #165DFF) !important; }
.arco-input:focus, .arco-input:focus-visible { border-color: var(--arco-color-primary, #165DFF) !important; box-shadow: 0 0 0 2px var(--arco-color-primary-bg, #E8F3FF) !important; }
.arco-input:disabled, .arco-input[disabled], .arco-input[readonly] { background: var(--arco-border-3, #f7f8fa) !important; color: var(--arco-text-3, #86909c) !important; cursor: not-allowed !important; border-color: var(--arco-border-2, #e5e6eb) !important; }

/* textarea */
.arco-textarea { height: auto !important; min-height: 72px !important; padding: 8px var(--arco-control-padding-h, 12px) !important; line-height: 1.6 !important; resize: vertical !important; }
.arco-textarea:focus, .arco-textarea:focus-visible { border-color: var(--arco-color-primary, #165DFF) !important; box-shadow: 0 0 0 2px var(--arco-color-primary-bg, #E8F3FF) !important; }

/* select */
.arco-select { position: relative !important; display: inline-block !important; }
.arco-select select {
  appearance: none !important; -webkit-appearance: none !important;
  width: 100% !important; height: var(--arco-control-height, 32px) !important;
  padding: 0 30px 0 var(--arco-control-padding-h, 12px) !important;
  border: 1px solid var(--arco-border-1, #e5e6eb) !important;
  border-radius: var(--arco-radius, 4px) !important;
  background: var(--arco-bg-container, #fff) url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%2386909c' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E") no-repeat right 10px center/12px !important;
  color: var(--arco-text-1, #1d2129) !important; font-size: var(--arco-font-size, 14px) !important;
  outline: none !important; cursor: pointer !important;
  transition: border-color var(--arco-duration) var(--arco-ease), box-shadow var(--arco-duration) var(--arco-ease) !important;
}
.arco-select select:hover { border-color: var(--arco-color-primary, #165DFF) !important; }
.arco-select select:focus, .arco-select select:focus-visible { border-color: var(--arco-color-primary, #165DFF) !important; box-shadow: 0 0 0 2px var(--arco-color-primary-bg, #E8F3FF) !important; }
.arco-select select:disabled { background-color: var(--arco-border-3, #f7f8fa) !important; color: var(--arco-text-3, #86909c) !important; cursor: not-allowed !important; }

/* number */
.arco-input-number { width: 120px !important; }
.arco-input-number input { text-align: left !important; }
.arco-input-number input[type="number"] { -moz-appearance: textfield !important; }
.arco-input-number input[type="number"]::-webkit-outer-spin-button,
.arco-input-number input[type="number"]::-webkit-inner-spin-button { -webkit-appearance: none !important; margin: 0 !important; }

/* ============================================================
   ============ 4. Card 卡片 ============
   圆角8 / 细边#e5e6eb / 浅阴影 / 头脚分割
   ============================================================ */
.arco-card {
  background: var(--arco-bg-container, #fff) !important;
  border: 1px solid var(--arco-border-1, #e5e6eb) !important;
  border-radius: var(--arco-radius-lg, 8px) !important;
  box-shadow: var(--arco-shadow-sm, 0 2px 6px rgba(0,0,0,.06)) !important;
  overflow: hidden !important;
  transition: box-shadow var(--arco-duration) var(--arco-ease), border-color var(--arco-duration) var(--arco-ease) !important;
}
.arco-card-hover:hover { border-color: var(--arco-color-primary, #165DFF) !important; box-shadow: var(--arco-shadow, 0 4px 10px rgba(0,0,0,.10)) !important; }
.arco-card-head {
  display: flex !important; align-items: center !important; justify-content: space-between !important; gap: 12px !important;
  padding: 12px 16px !important; border-bottom: 1px solid var(--arco-border-2, #f2f3f5) !important;
  font-size: var(--arco-font-size, 14px) !important; font-weight: 600 !important; color: var(--arco-text-1, #1d2129) !important;
}
.arco-card-body { padding: 16px !important; color: var(--arco-text-1, #1d2129) !important; }
.arco-card-footer { padding: 12px 16px !important; border-top: 1px solid var(--arco-border-2, #f2f3f5) !important; background: var(--arco-bg-container, #fff) !important; }
.arco-card-title { font-size: var(--arco-font-size, 14px) !important; font-weight: 600 !important; }
.arco-card-extra { font-size: var(--arco-font-size-sm, 12px) !important; color: var(--arco-text-3, #86909c) !important; }

/* ============================================================
   ============ 5. Table 表格 ============
   表头 13px/500/Text-2 · 行高 44 · hover
   ============================================================ */
.arco-table { width: 100% !important; border-collapse: collapse !important; font-size: var(--arco-font-size, 14px) !important; border: 1px solid var(--arco-border-2, #f2f3f5) !important; border-radius: var(--arco-radius, 4px) !important; overflow: hidden !important; }
.arco-table thead th {
  text-align: left !important; font-size:14px !important; font-weight: 500 !important; color: var(--arco-text-2, #4e5969) !important;
  background: var(--arco-bg-layout, #f7f8fa) !important; padding: 10px 16px !important; border-bottom: 1px solid var(--arco-border-2, #f2f3f5) !important; white-space: nowrap !important;
}
.arco-table tbody td { padding: 11px 16px !important; min-height: 44px !important; color: var(--arco-text-1, #1d2129) !important; border-bottom: 1px solid var(--arco-border-3, #f7f8fa) !important; vertical-align: middle !important; }
.arco-table tbody tr:last-child td { border-bottom: none !important; }
.arco-table tbody tr { transition: background var(--arco-duration) var(--arco-ease) !important; }
.arco-table tbody tr:hover { background: var(--arco-color-primary-bg, #E8F3FF) !important; }
.arco-table-striped tbody tr:nth-child(odd) { background: var(--arco-bg-layout, #f7f8fa) !important; }
.arco-table-striped tbody tr:nth-child(odd):hover { background: var(--arco-color-primary-bg, #E8F3FF) !important; }
.arco-table-empty { text-align: center !important; padding: 32px 16px !important; color: var(--arco-text-3, #86909c) !important; font-size: var(--arco-font-size-sm, 12px) !important; }

/* ============================================================
   ============ 6. Statistic 统计 ============
   数字 26-30 / 700 + 标签 12 / Text-3
   ============================================================ */
.arco-statistic { display: inline-block !important; }
.arco-statistic-value { font-size: 28px !important; font-weight: 700 !important; color: var(--arco-text-1, #1d2129) !important; line-height: 1.15 !important; font-variant-numeric: tabular-nums !important; letter-spacing: -.5px !important; }
.arco-statistic-label { font-size: var(--arco-font-size-sm, 12px) !important; color: var(--arco-text-3, #86909c) !important; margin-top: 4px !important; }
.arco-statistic-prefix, .arco-statistic-suffix { font-size:16px !important; color: var(--arco-text-2, #4e5969) !important; }
.arco-statistic-trend-up { color: var(--arco-success, #00b42a) !important; }
.arco-statistic-trend-down { color: var(--arco-danger, #f53f3f) !important; }

/* ============================================================
   ============ 7. Form 表单 ============
   label 13 / sub 12 / 校验红
   ============================================================ */
.arco-form { display: flex !important; flex-direction: column !important; gap: 16px !important; }
.arco-form-item { display: flex !important; flex-direction: column !important; gap: 6px !important; }
.arco-form-label { font-size:14px !important; font-weight: 500 !important; color: var(--arco-text-1, #1d2129) !important; display: inline-flex !important; align-items: center !important; gap: 4px !important; }
.arco-form-label.required::before { content: '*' !important; color: var(--arco-danger, #f53f3f) !important; }
.arco-form-sub { font-size: var(--arco-font-size-sm, 12px) !important; color: var(--arco-text-3, #86909c) !important; }
.arco-form-error { font-size: var(--arco-font-size-sm, 12px) !important; color: var(--arco-danger, #f53f3f) !important; }
.arco-form-item.error .arco-input, .arco-form-item.error input, .arco-form-item.error select, .arco-form-item.error textarea { border-color: var(--arco-danger, #f53f3f) !important; }
.arco-form-item.error .arco-input:focus, .arco-form-item.error input:focus { box-shadow: 0 0 0 2px rgba(245,63,63,.12) !important; }

/* ============================================================
   ============ 8. Switch / Radio / Checkbox ============
   accent-color #165DFF
   ============================================================ */
.arco-switch, .arco-radio, .arco-checkbox { display: inline-flex !important; align-items: center !important; gap: 8px !important; cursor: pointer !important; font-size: var(--arco-font-size, 14px) !important; color: var(--arco-text-1, #1d2129) !important; user-select: none !important; -webkit-user-select: none !important; }
.arco-switch input[type="checkbox"], .arco-radio input[type="radio"], .arco-checkbox input[type="checkbox"] { width: 16px !important; height: 16px !important; margin: 0 !important; accent-color: var(--arco-color-primary, #165DFF) !important; flex: 0 0 auto !important; cursor: pointer !important; }
.arco-switch input:disabled, .arco-radio input:disabled, .arco-checkbox input:disabled { cursor: not-allowed !important; opacity: .5 !important; }
.arco-switch { position: relative !important; }
.arco-radio label, .arco-checkbox label { cursor: pointer !important; }

/* ============================================================
   ============ 9. Tabs 选项卡 ============
   激活下划线 #165DFF
   ============================================================ */
.arco-tabs { display: flex !important; flex-direction: column !important; }
.arco-tabs-nav { display: flex !important; align-items: center !important; gap: 4px !important; border-bottom: 1px solid var(--arco-border-2, #f2f3f5) !important; overflow-x: auto !important; }
.arco-tab { position: relative !important; padding: 10px 16px !important; font-size: var(--arco-font-size, 14px) !important; color: var(--arco-text-2, #4e5969) !important; cursor: pointer !important; background: none !important; border: none !important; white-space: nowrap !important; transition: color var(--arco-duration) var(--arco-ease) !important; font-family: inherit !important; }
.arco-tab:hover { color: var(--arco-color-primary, #165DFF) !important; }
.arco-tab-active { color: var(--arco-color-primary, #165DFF) !important; font-weight: 500 !important; }
.arco-tab-active::after { content: "" !important; position: absolute !important; left: 12px !important; right: 12px !important; bottom: -1px !important; height: 2px !important; background: var(--arco-color-primary, #165DFF) !important; border-radius: var(--arco-radius-sm, 2px) !important; }
.arco-tab-disabled { color: var(--arco-text-4, #c9cdd4) !important; cursor: not-allowed !important; }
.arco-tabs-content { padding-top: 12px !important; }

/* ============================================================
   ============ 10. Badge 徽标 / Tag 标签 ============
   浅底 + 字色
   ============================================================ */
.arco-badge { display: inline-flex !important; align-items: center !important; justify-content: center !important; min-width: 18px !important; height: 18px !important; padding: 0 6px !important; border-radius: var(--arco-round, 999px) !important; font-size:12px !important; font-weight: 600 !important; line-height: 1 !important; color: #fff !important; background: var(--arco-danger, #f53f3f) !important; box-sizing: border-box !important; }
.arco-badge-dot { min-width: 8px !important; width: 8px !important; height: 8px !important; padding: 0 !important; border-radius: 50% !important; }
.arco-tag { display: inline-flex !important; align-items: center !important; gap: 4px !important; height: 22px !important; padding: 0 8px !important; border-radius: var(--arco-radius, 4px) !important; font-size: var(--arco-font-size-sm, 12px) !important; line-height: 1 !important; color: var(--arco-text-2, #4e5969) !important; background: var(--arco-border-3, #f7f8fa) !important; border: 1px solid var(--arco-border-2, #e5e6eb) !important; white-space: nowrap !important; }
.arco-tag-primary { color: var(--arco-color-primary, #165DFF) !important; background: var(--arco-color-primary-bg, #E8F3FF) !important; border-color: transparent !important; }
.arco-tag-success { color: var(--arco-success, #00b42a) !important; background: #e8ffea !important; border-color: transparent !important; }
.arco-tag-warning { color: var(--arco-warning, #ff7d00) !important; background: #fff3e8 !important; border-color: transparent !important; }
.arco-tag-danger { color: var(--arco-danger, #f53f3f) !important; background: #ffece8 !important; border-color: transparent !important; }
.arco-tag-info { color: var(--arco-color-primary, #165DFF) !important; background: var(--arco-color-primary-bg, #E8F3FF) !important; border-color: transparent !important; }
.arco-tag-circle { border-radius: var(--arco-round, 999px) !important; }

/* ============================================================
   ============ 11. Upload 上传 (dropzone) ============
   1.5px dashed + 图标 + 主/副提示
   ============================================================ */
.arco-upload { display: block !important; }
.arco-upload-drop {
  display: flex !important; flex-direction: column !important; align-items: center !important; justify-content: center !important; gap: 6px !important;
  padding: 36px 16px !important; min-height: 160px !important;
  border: 1.5px dashed var(--arco-border-1, #e5e6eb) !important;
  border-radius: var(--arco-radius, 4px) !important;
  background: var(--arco-bg-layout, #f7f8fa) !important;
  text-align: center !important; cursor: pointer !important; color: var(--arco-text-1, #1d2129) !important;
  transition: border-color var(--arco-duration) var(--arco-ease), background var(--arco-duration) var(--arco-ease) !important;
}
.arco-upload-drop:hover, .arco-upload-drag-over { border-color: var(--arco-color-primary, #165DFF) !important; background: var(--arco-color-primary-bg, #E8F3FF) !important; }
.arco-upload-icon { width: 40px !important; height: 40px !important; border-radius: 50% !important; display: flex !important; align-items: center !important; justify-content: center !important; background: var(--arco-color-primary-bg, #E8F3FF) !important; color: var(--arco-color-primary, #165DFF) !important; }
.arco-upload-icon svg { width: 20px !important; height: 20px !important; }
.arco-upload-main { font-size: var(--arco-font-size, 14px) !important; font-weight: 500 !important; color: var(--arco-text-1, #1d2129) !important; }
.arco-upload-sub { font-size: var(--arco-font-size-sm, 12px) !important; color: var(--arco-text-3, #86909c) !important; }
.arco-upload-disabled { cursor: not-allowed !important; opacity: .55 !important; }

/* ============================================================
   ============ 12. Modal / Drawer / Message / Pagination / Dropdown ============
   ============================================================ */
/* Modal */
.arco-modal-overlay { position: fixed !important; inset: 0 !important; z-index: 1000 !important; background: rgba(0,0,0,.45) !important; display: flex !important; align-items: center !important; justify-content: center !important; padding: 24px !important; }
.arco-modal { width: 100% !important; max-width: 520px !important; background: var(--arco-bg-container, #fff) !important; border-radius: var(--arco-radius-lg, 8px) !important; box-shadow: 0 8px 24px rgba(0,0,0,.2) !important; overflow: hidden !important; display: flex !important; flex-direction: column !important; max-height: calc(100vh - 48px) !important; }
.arco-modal-head { display: flex !important; align-items: center !important; justify-content: space-between !important; gap: 12px !important; padding: 14px 20px !important; border-bottom: 1px solid var(--arco-border-2, #f2f3f5) !important; }
.arco-modal-title { font-size: var(--arco-font-size-lg, 16px) !important; font-weight: 600 !important; color: var(--arco-text-1, #1d2129) !important; }
.arco-modal-close { display: inline-flex !important; align-items: center !important; justify-content: center !important; width: 28px !important; height: 28px !important; border-radius: var(--arco-radius, 4px) !important; color: var(--arco-text-3, #86909c) !important; cursor: pointer !important; background: none !important; border: none !important; }
.arco-modal-close:hover { background: var(--arco-border-3, #f7f8fa) !important; color: var(--arco-text-1, #1d2129) !important; }
.arco-modal-body { padding: 20px !important; overflow-y: auto !important; color: var(--arco-text-1, #1d2129) !important; }
.arco-modal-foot { display: flex !important; align-items: center !important; justify-content: flex-end !important; gap:12px !important; padding: 12px 20px !important; border-top: 1px solid var(--arco-border-2, #f2f3f5) !important; }

/* Drawer */
.arco-drawer-overlay { position: fixed !important; inset: 0 !important; z-index: 1000 !important; background: rgba(0,0,0,.45) !important; }
.arco-drawer { position: fixed !important; top: 0 !important; bottom: 0 !important; right: 0 !important; z-index: 1001 !important; width: 100% !important; max-width: 360px !important; background: var(--arco-bg-container, #fff) !important; box-shadow: -4px 0 16px rgba(0,0,0,.12) !important; display: flex !important; flex-direction: column !important; }
.arco-drawer-left { right: auto !important; left: 0 !important; box-shadow: 4px 0 16px rgba(0,0,0,.12) !important; }
.arco-drawer-head { display: flex !important; align-items: center !important; justify-content: space-between !important; padding: 14px 20px !important; border-bottom: 1px solid var(--arco-border-2, #f2f3f5) !important; }
.arco-drawer-body { flex: 1 !important; padding: 20px !important; overflow-y: auto !important; }
.arco-drawer-foot { padding: 12px 20px !important; border-top: 1px solid var(--arco-border-2, #f2f3f5) !important; }

/* Message */
.arco-message { display: inline-flex !important; align-items: center !important; gap: 8px !important; padding: 9px 14px !important; border-radius: var(--arco-radius, 4px) !important; font-size: var(--arco-font-size, 14px) !important; background: var(--arco-bg-container, #fff) !important; box-shadow: var(--arco-shadow, 0 4px 10px rgba(0,0,0,.10)) !important; border: 1px solid var(--arco-border-2, #f2f3f5) !important; }
.arco-message-success { border-color: rgba(0,180,42,.3) !important; }
.arco-message-warning { border-color: rgba(255,125,0,.3) !important; }
.arco-message-error { border-color: rgba(245,63,63,.3) !important; }
.arco-message-info { border-color: rgba(22,93,255,.3) !important; }

/* Pagination */
.arco-pagination { display: inline-flex !important; align-items: center !important; gap: 6px !important; }
.arco-page-btn { display: inline-flex !important; align-items: center !important; justify-content: center !important; min-width: 32px !important; height: 32px !important; padding: 0 6px !important; border-radius: var(--arco-radius, 4px) !important; border: 1px solid var(--arco-border-1, #e5e6eb) !important; background: var(--arco-bg-container, #fff) !important; color: var(--arco-text-2, #4e5969) !important; font-size: var(--arco-font-size, 14px) !important; font-family: inherit !important; cursor: pointer !important; transition: all var(--arco-duration) var(--arco-ease) !important; }
.arco-page-btn:hover { color: var(--arco-color-primary, #165DFF) !important; border-color: var(--arco-color-primary, #165DFF) !important; }
.arco-page-active { color: #fff !important; background: var(--arco-color-primary, #165DFF) !important; border-color: var(--arco-color-primary, #165DFF) !important; }
.arco-page-disabled { color: var(--arco-text-4, #c9cdd4) !important; cursor: not-allowed !important; pointer-events: none !important; }
.arco-page-ellipsis { color: var(--arco-text-3, #86909c) !important; cursor: default !important; }

/* Dropdown menu */
.arco-dropdown { position: relative !important; display: inline-block !important; }
.arco-dropdown-menu { position: absolute !important; top: calc(100% + 4px) !important; left: 0 !important; min-width: 160px !important; background: var(--arco-bg-elevated, #fff) !important; border: 1px solid var(--arco-border-2, #f2f3f5) !important; border-radius: var(--arco-radius, 4px) !important; box-shadow: var(--arco-shadow, 0 4px 10px rgba(0,0,0,.10)) !important; padding: 4px !important; z-index: 100 !important; }
.arco-dropdown-item { display: flex !important; align-items: center !important; gap: 8px !important; padding: 8px 12px !important; font-size: var(--arco-font-size, 14px) !important; color: var(--arco-text-1, #1d2129) !important; cursor: pointer !important; border-radius: var(--arco-radius, 4px) !important; transition: background var(--arco-duration) var(--arco-ease) !important; }
.arco-dropdown-item:hover { background: var(--arco-color-primary-bg, #E8F3FF) !important; color: var(--arco-color-primary, #165DFF) !important; }
.arco-dropdown-item.disabled { color: var(--arco-text-4, #c9cdd4) !important; cursor: not-allowed !important; background: none !important; }
.arco-dropdown-divider { height: 1px !important; background: var(--arco-border-2, #f2f3f5) !important; margin: 4px 0 !important; }


/* ============================================================
   ✓✓ ARCO 对账：覆盖「现有应用类」→ Arco 视觉（前后端共用）
   仅在末尾 !important 兜底，不删除任何板块 / 功能。
   ============================================================ */

/* ---- Button（app 类 .btn / .admin-btn / .users-btn）---- */
body .btn, #adminBody .btn, #adminBody .admin-btn, #adminBody .users-btn, body .lib-btn {
  height: var(--arco-control-height, 32px) !important;
  padding: 0 var(--arco-control-padding-h, 12px) !important;
  border-radius: var(--arco-radius, 4px) !important;
  font-size: var(--arco-font-size, 14px) !important; font-weight: 500 !important; line-height: 1 !important;
  display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 6px !important;
  border: 1px solid var(--arco-border-1, #e5e6eb) !important; background: var(--arco-bg-container, #fff) !important;
  color: var(--arco-text-1, #1d2129) !important; cursor: pointer !important; white-space: nowrap !important;
  transition: background var(--arco-duration) var(--arco-ease), border-color var(--arco-duration) var(--arco-ease), color var(--arco-duration) var(--arco-ease), box-shadow var(--arco-duration) var(--arco-ease) !important;
}
body .btn:hover, #adminBody .btn:hover, #adminBody .admin-btn:hover, #adminBody .users-btn:hover, body .lib-btn:hover { border-color: var(--arco-color-primary, #165DFF) !important; color: var(--arco-color-primary, #165DFF) !important; }
body .btn:focus-visible, #adminBody .btn:focus-visible, #adminBody .users-btn:focus-visible { border-color: var(--arco-color-primary, #165DFF) !important; box-shadow: 0 0 0 2px var(--arco-color-primary-bg, #E8F3FF) !important; outline: none !important; }
body .btn.sm, #adminBody .btn.sm, #adminBody .users-btn.sm, body .lib-btn.sm { height: 28px !important; padding: 0 10px !important; font-size: var(--arco-font-size-sm, 12px) !important; }
body .btn.xs, #adminBody .btn.xs { height: 24px !important; padding: 0 8px !important; font-size: var(--arco-font-size-sm, 12px) !important; }
body .btn.big, #adminBody .btn.big, body .btn.lg, #adminBody .btn.lg { height: 40px !important; padding: 0 20px !important; font-size: var(--arco-font-size-lg, 16px) !important; }

/* primary */
body .btn.primary, #adminBody .btn.primary, #adminBody .admin-btn.primary, #adminBody .users-btn.primary,
body .btn-primary, #adminBody .btn-primary, body .understood-full-row .btn.primary {
  background: var(--arco-color-primary, #165DFF) !important; border-color: var(--arco-color-primary, #165DFF) !important; color: #fff !important;
}
body .btn.primary:hover, #adminBody .btn.primary:hover, #adminBody .admin-btn.primary:hover, #adminBody .users-btn.primary:hover, body .btn-primary:hover { background: var(--arco-color-primary-hover, #4080FF) !important; border-color: var(--arco-color-primary-hover, #4080FF) !important; color: #fff !important; }
body .btn.primary:active, #adminBody .btn.primary:active { background: var(--arco-color-primary-press, #0E42D2) !important; border-color: var(--arco-color-primary-press, #0E42D2) !important; }
body .btn.primary:focus-visible, #adminBody .btn.primary:focus-visible { box-shadow: 0 0 0 2px #fff, 0 0 0 4px var(--arco-color-primary, #165DFF) !important; }

/* outline / ghost → Arco 次级描边 */
body .btn.outline, #adminBody .btn.outline, #adminBody .users-btn.outline, body .btn.outline.primary,
body .btn.ghost, #adminBody .btn.ghost, #adminBody .users-btn.ghost {
  background: var(--arco-bg-container, #fff) !important; border: 1px solid var(--arco-border-1, #e5e6eb) !important; color: var(--arco-text-1, #1d2129) !important;
}
body .btn.outline:hover, #adminBody .btn.outline:hover, #adminBody .users-btn.outline:hover, body .btn.ghost:hover, #adminBody .btn.ghost:hover { border-color: var(--arco-color-primary, #165DFF) !important; color: var(--arco-color-primary, #165DFF) !important; background: var(--arco-bg-container, #fff) !important; }

/* danger */
body .btn.danger, #adminBody .btn.danger, #adminBody .users-btn.danger, body .btn-danger, #adminBody .btn-danger { background: var(--arco-danger, #f53f3f) !important; border-color: var(--arco-danger, #f53f3f) !important; color: #fff !important; }
body .btn.danger:hover, #adminBody .btn.danger:hover { background: #f76560 !important; border-color: #f76560 !important; color: #fff !important; }

/* disabled */
body .btn.disabled, #adminBody .btn.disabled, body .btn:disabled, #adminBody .btn:disabled, body .btn[disabled], #adminBody .btn[disabled], body .lib-btn:disabled {
  cursor: not-allowed !important; opacity: .55 !important; pointer-events: none !important; color: var(--arco-text-4, #c9cdd4) !important; background: var(--arco-border-3, #f7f8fa) !important; border-color: var(--arco-border-2, #e5e6eb) !important; box-shadow: none !important;
}
/* loading */
body .btn.loading, #adminBody .btn.loading { cursor: default !important; opacity: .8 !important; pointer-events: none !important; }
body .btn.loading::before, #adminBody .btn.loading::before { content: "" !important; width: 14px !important; height: 14px !important; border: 2px solid currentColor !important; border-right-color: transparent !important; border-radius: 50% !important; animation: arco-spin .7s linear infinite !important; }

/* ---- Input / select / textarea（app 类 + 元素级）---- */
body input[type="text"], body input[type="password"], body input[type="email"], body input[type="number"], body input[type="search"], body input[type="url"], body input[type="tel"],
#adminBody input[type="text"], #adminBody input[type="password"], #adminBody input[type="email"], #adminBody input[type="number"], #adminBody input[type="search"], #adminBody input[type="url"], #adminBody input[type="tel"] {
  height: var(--arco-control-height, 32px) !important; padding: 0 var(--arco-control-padding-h, 12px) !important; font-size: var(--arco-font-size, 14px) !important;
  border: 1px solid var(--arco-border-1, #e5e6eb) !important; border-radius: var(--arco-radius, 4px) !important; background: var(--arco-bg-container, #fff) !important;
  color: var(--arco-text-1, #1d2129) !important; transition: border-color var(--arco-duration) var(--arco-ease), box-shadow var(--arco-duration) var(--arco-ease) !important; outline: none !important;
}
body input[type="text"]::placeholder, body input[type="password"]::placeholder, #adminBody input[type="text"]::placeholder, #adminBody input[type="password"]::placeholder { color: var(--arco-text-4, #c9cdd4) !important; }
body input[type="text"]:hover, body input[type="password"]:hover, body input[type="number"]:hover, #adminBody input[type="text"]:hover, #adminBody input[type="password"]:hover, #adminBody input[type="number"]:hover { border-color: var(--arco-color-primary, #165DFF) !important; }
body input[type="text"]:focus, body input[type="password"]:focus, body input[type="number"]:focus, #adminBody input[type="text"]:focus, #adminBody input[type="password"]:focus, #adminBody input[type="number"]:focus { border-color: var(--arco-color-primary, #165DFF) !important; box-shadow: 0 0 0 2px var(--arco-color-primary-bg, #E8F3FF) !important; }
body input[type="text"]:disabled, body input[type="password"]:disabled, #adminBody input[type="text"]:disabled, #adminBody input[type="password"]:disabled { background: var(--arco-border-3, #f7f8fa) !important; color: var(--arco-text-3, #86909c) !important; cursor: not-allowed !important; }
body textarea, #adminBody textarea { border: 1px solid var(--arco-border-1, #e5e6eb) !important; border-radius: var(--arco-radius, 4px) !important; background: var(--arco-bg-container, #fff) !important; color: var(--arco-text-1, #1d2129) !important; font-size: var(--arco-font-size, 14px) !important; padding: 8px var(--arco-control-padding-h, 12px) !important; line-height: 1.6 !important; transition: border-color var(--arco-duration) var(--arco-ease), box-shadow var(--arco-duration) var(--arco-ease) !important; outline: none !important; }
body textarea:focus, #adminBody textarea:focus { border-color: var(--arco-color-primary, #165DFF) !important; box-shadow: 0 0 0 2px var(--arco-color-primary-bg, #E8F3FF) !important; }
body select, #adminBody select { height: var(--arco-control-height, 32px) !important; padding: 0 12px !important; font-size: var(--arco-font-size, 14px) !important; border: 1px solid var(--arco-border-1, #e5e6eb) !important; border-radius: var(--arco-radius, 4px) !important; background: var(--arco-bg-container, #fff) !important; color: var(--arco-text-1, #1d2129) !important; transition: border-color var(--arco-duration) var(--arco-ease), box-shadow var(--arco-duration) var(--arco-ease) !important; outline: none !important; }
body select:focus, #adminBody select:focus { border-color: var(--arco-color-primary, #165DFF) !important; box-shadow: 0 0 0 2px var(--arco-color-primary-bg, #E8F3FF) !important; }
/* app input 类 */
body .settings-input, body .brief-input, body .sf-rect-input, body .select-input input, #adminBody .settings-input,
body .search-input, #adminBody .search-input { height: var(--arco-control-height, 32px) !important; border-color: var(--arco-border-1, #e5e6eb) !important; border-radius: var(--arco-radius, 4px) !important; font-size: var(--arco-font-size, 14px) !important; }
body .settings-input:focus, body .brief-input:focus, #adminBody .settings-input:focus { border-color: var(--arco-color-primary, #165DFF) !important; box-shadow: 0 0 0 2px var(--arco-color-primary-bg, #E8F3FF) !important; }

/* ---- Card / Panel（app 类）---- */
body .card, #adminBody .card, body .panel, #adminBody .panel, body .brief-card, body .step0-meta-card,
#adminBody .admin-card, #adminBody .admin-panel, #adminBody .users-table-card, #adminBody .settings-card,
#adminBody .obs-card, body .quick-card, #adminBody .quick-card {
  background: var(--arco-bg-container, #fff) !important; border: 1px solid var(--arco-border-1, #e5e6eb) !important;
  border-radius: var(--arco-radius-lg, 8px) !important; box-shadow: var(--arco-shadow-sm, 0 2px 6px rgba(0,0,0,.06)) !important; color: var(--arco-text-1, #1d2129) !important;
}
#adminBody .admin-card:hover, #adminBody .admin-panel:hover { box-shadow: var(--arco-shadow, 0 4px 10px rgba(0,0,0,.10)) !important; }
#adminBody .admin-card-head, #adminBody .admin-panel-head {
  font-size: var(--arco-font-size, 14px) !important; font-weight: 600 !important; color: var(--arco-text-1, #1d2129) !important;
  border-bottom: 1px solid var(--arco-border-2, #f2f3f5) !important;
}

/* ---- Table（app 表 + 元素级）---- */
body table, #adminBody table, #adminBody .users-table-card table { border-collapse: collapse !important; font-size: var(--arco-font-size, 14px) !important; }
body table thead th, #adminBody table thead th { text-align: left !important; font-size:14px !important; font-weight: 500 !important; color: var(--arco-text-2, #4e5969) !important; background: var(--arco-bg-layout, #f7f8fa) !important; border-bottom: 1px solid var(--arco-border-2, #f2f3f5) !important; padding: 10px 16px !important; white-space: nowrap !important; }
body table tbody td, #adminBody table tbody td { padding: 11px 16px !important; color: var(--arco-text-1, #1d2129) !important; border-bottom: 1px solid var(--arco-border-3, #f7f8fa) !important; vertical-align: middle !important; }
body table tbody tr, #adminBody table tbody tr { transition: background var(--arco-duration) var(--arco-ease) !important; }
body table tbody tr:hover, #adminBody table tbody tr:hover { background: var(--arco-color-primary-bg, #E8F3FF) !important; }

/* ---- Statistic（app 统计卡）---- */
#adminBody .users-stat-value, #adminBody .stat-value, #adminBody .user-detail-stat-value, #adminBody .users-stat-value, body .stat-value, body .user-detail-stat-value {
  font-size: 28px !important; font-weight: 700 !important; color: var(--arco-text-1, #1d2129) !important; line-height: 1.15 !important; font-variant-numeric: tabular-nums !important; letter-spacing: -.5px !important;
}
#adminBody .users-stat-label, #adminBody .stat-label, #adminBody .user-detail-stat-label, body .stat-label {
  font-size: var(--arco-font-size-sm, 12px) !important; color: var(--arco-text-3, #86909c) !important;
}
#adminBody .users-stat-sub, #adminBody .stat-sub { font-size: var(--arco-font-size-sm, 12px) !important; color: var(--arco-text-3, #86909c) !important; }

/* ---- Tabs（app 类）---- */
body .tab-btn, #adminBody .tab-btn, #adminBody .provider-tab, body .tuner-wb-tab {
  padding: 10px 16px !important; font-size: var(--arco-font-size, 14px) !important; color: var(--arco-text-2, #4e5969) !important; background: none !important; border: none !important; cursor: pointer !important; white-space: nowrap !important; transition: color var(--arco-duration) var(--arco-ease) !important; position: relative !important; font-family: inherit !important;
}
body .tab-btn:hover, #adminBody .tab-btn:hover, #adminBody .provider-tab:hover, body .tuner-wb-tab:hover { color: var(--arco-color-primary, #165DFF) !important; }
body .tab-btn.active, #adminBody .tab-btn.active, #adminBody .provider-tab.active, body .tuner-wb-tab.active {
  color: var(--arco-color-primary, #165DFF) !important; font-weight: 500 !important;
}
body .tab-btn.active::after, #adminBody .tab-btn.active::after, #adminBody .provider-tab.active::after, body .tuner-wb-tab.active::after {
  content: "" !important; position: absolute !important; left: 12px !important; right: 12px !important; bottom: -1px !important; height: 2px !important; background: var(--arco-color-primary, #165DFF) !important; border-radius: var(--arco-radius-sm, 2px) !important;
}

/* ---- Badge / Tag（app 类）---- */
body .badge, #adminBody .badge, body .score-badge, #adminBody .score-badge, body .opt-badge, #adminBody .opt-badge, body .status-badge, #adminBody .status-badge, body .obs-status, #adminBody .obs-status {
  display: inline-flex !important; align-items: center !important; border-radius: var(--arco-radius, 4px) !important; font-weight: 500 !important; line-height: 1 !important; white-space: nowrap !important;
}
body .badge, #adminBody .badge, body .opt-badge, #adminBody .opt-badge { color: var(--arco-color-primary, #165DFF) !important; background: var(--arco-color-primary-bg, #E8F3FF) !important; padding: 3px 8px !important; font-size: var(--arco-font-size-sm, 12px) !important; }
body .score-badge, #adminBody .score-badge, body .status-badge, #adminBody .status-badge, body .obs-status, #adminBody .obs-status { padding: 2px 8px !important; font-size: var(--arco-font-size-sm, 12px) !important; color: var(--arco-text-2, #4e5969) !important; background: var(--arco-border-3, #f7f8fa) !important; }
body .tag, #adminBody .tag, body .arco-tag-app, #adminBody .arco-tag-app { display: inline-flex !important; align-items: center !important; gap: 4px !important; height: 22px !important; padding: 0 8px !important; border-radius: var(--arco-radius, 4px) !important; font-size: var(--arco-font-size-sm, 12px) !important; color: var(--arco-text-2, #4e5969) !important; background: var(--arco-border-3, #f7f8fa) !important; border: 1px solid var(--arco-border-2, #e5e6eb) !important; white-space: nowrap !important; }
body .tag.success, #adminBody .tag.success, body .status-ok, #adminBody .status-ok { color: var(--arco-success, #00b42a) !important; background: #e8ffea !important; border-color: transparent !important; }
body .tag.warning, body .tag.warn, #adminBody .tag.warn, body .status-warn, #adminBody .status-warn { color: var(--arco-warning, #ff7d00) !important; background: #fff3e8 !important; border-color: transparent !important; }
body .tag.danger, body .tag.error, #adminBody .tag.error, body .status-err, #adminBody .status-err { color: var(--arco-danger, #f53f3f) !important; background: #ffece8 !important; border-color: transparent !important; }

/* ---- Switch（app 类）---- */
body .switch, #adminBody .switch { cursor: pointer !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; }
body .switch input[type="checkbox"], #adminBody .switch input[type="checkbox"], body input[type="radio"], body input[type="checkbox"], #adminBody input[type="radio"], #adminBody input[type="checkbox"] { width: 16px !important; height: 16px !important; accent-color: var(--arco-color-primary, #165DFF) !important; cursor: pointer !important; }
body input[type="checkbox"]:disabled, body input[type="radio"]:disabled, #adminBody input[type="checkbox"]:disabled, #adminBody input[type="radio"]:disabled { cursor: not-allowed !important; opacity: .5 !important; }

/* ---- Upload dropzone（app 类）---- */
body .free-upload-drop, #adminBody .free-upload-drop, body .brief-drop, #adminBody .brief-drop {
  border: 1.5px dashed var(--arco-border-1, #e5e6eb) !important; border-radius: var(--arco-radius, 4px) !important;
  background: var(--arco-bg-layout, #f7f8fa) !important;
}
body .free-upload-drop:hover, #adminBody .free-upload-drop:hover, body .brief-drop:hover { border-color: var(--arco-color-primary, #165DFF) !important; background: var(--arco-color-primary-bg, #E8F3FF) !important; }
body .free-upload-icon, #adminBody .free-upload-icon { background: var(--arco-color-primary, #165DFF) !important; color: #fff !important; border-radius: 50% !important; }
body .free-upload-main, #adminBody .free-upload-main { font-size: var(--arco-font-size, 14px) !important; font-weight: 500 !important; color: var(--arco-text-1, #1d2129) !important; }
body .free-upload-sub, #adminBody .free-upload-sub { font-size: var(--arco-font-size-sm, 12px) !important; color: var(--arco-text-3, #86909c) !important; }

/* ---- Modal（app 类）---- */
body .modal-overlay, #adminBody .modal-overlay { background: rgba(0,0,0,.45) !important; }
body .modal-card, #adminBody .modal-card { background: var(--arco-bg-container, #fff) !important; border-radius: var(--arco-radius-lg, 8px) !important; box-shadow: 0 8px 24px rgba(0,0,0,.2) !important; border: none !important; }
body .modal-head, #adminBody .modal-head { border-bottom: 1px solid var(--arco-border-2, #f2f3f5) !important; }
body .modal-title, #adminBody .modal-title { font-size: var(--arco-font-size-lg, 16px) !important; font-weight: 600 !important; color: var(--arco-text-1, #1d2129) !important; }
body .modal-close, #adminBody .modal-close { color: var(--arco-text-3, #86909c) !important; border-radius: var(--arco-radius, 4px) !important; }
body .modal-close:hover, #adminBody .modal-close:hover { background: var(--arco-border-3, #f7f8fa) !important; color: var(--arco-text-1, #1d2129) !important; }
body .modal-foot, #adminBody .modal-foot { border-top: 1px solid var(--arco-border-2, #f2f3f5) !important; }

/* ---- Form label / sub（app 类）---- */
body label, #adminBody label { font-weight: 500 !important; }
body .form-label, body .auth-label, #adminBody .auth-label, body .step-label, body .adv-label { font-size:14px !important; font-weight: 500 !important; color: var(--arco-text-1, #1d2129) !important; }
body .form-sub, body .form-hint, #adminBody .form-hint, body .hint, #adminBody .hint { font-size: var(--arco-font-size-sm, 12px) !important; color: var(--arco-text-3, #86909c) !important; }
body .form-error, #adminBody .form-error, body .field-error, #adminBody .field-error { font-size: var(--arco-font-size-sm, 12px) !important; color: var(--arco-danger, #f53f3f) !important; }

/* ---- Pagination（app 类）---- */
body .pagination, body .pager, #adminBody .pagination {
  display: inline-flex !important; align-items: center !important; gap: 6px !important;
}
body .pagination button, body .pagination a, #adminBody .pagination button, #adminBody .pagination a {
  min-width: 32px !important; height: 32px !important; padding: 0 8px !important; border-radius: var(--arco-radius, 4px) !important; border: 1px solid var(--arco-border-1, #e5e6eb) !important; background: var(--arco-bg-container, #fff) !important; color: var(--arco-text-2, #4e5969) !important; font-size: var(--arco-font-size, 14px) !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; cursor: pointer !important; transition: all var(--arco-duration) var(--arco-ease) !important;
}
body .pagination button:hover, body .pagination a:hover, #adminBody .pagination button:hover { color: var(--arco-color-primary, #165DFF) !important; border-color: var(--arco-color-primary, #165DFF) !important; }
body .pagination .active, #adminBody .pagination .active { color: #fff !important; background: var(--arco-color-primary, #165DFF) !important; border-color: var(--arco-color-primary, #165DFF) !important; }

/* ---- Dropdown（app 类）---- */
body .dropdown-menu, #adminBody .dropdown-menu { background: var(--arco-bg-elevated, #fff) !important; border: 1px solid var(--arco-border-2, #f2f3f5) !important; border-radius: var(--arco-radius, 4px) !important; box-shadow: var(--arco-shadow, 0 4px 10px rgba(0,0,0,.10)) !important; }
body .dropdown-menu > *:hover, #adminBody .dropdown-menu > *:hover { background: var(--arco-color-primary-bg, #E8F3FF) !important; color: var(--arco-color-primary, #165DFF) !important; }

/* ---- Dark 主题对账（前后端） ---- */
[data-theme="dark"] .arco-card, [data-theme="dark"] body .card, [data-theme="dark"] body .panel, [data-theme="dark"] #adminBody .admin-card, [data-theme="dark"] #adminBody .admin-panel, [data-theme="dark"] #adminBody .modal-card { background: var(--arco-bg-container) !important; border-color: var(--arco-border-1) !important; color: var(--arco-text-1) !important; }
[data-theme="dark"] body .btn, [data-theme="dark"] #adminBody .btn, [data-theme="dark"] body .btn.ghost, [data-theme="dark"] body .btn.outline, [data-theme="dark"] #adminBody .users-btn.ghost { background: var(--arco-bg-container) !important; color: var(--arco-text-1) !important; border-color: var(--arco-border-1) !important; }
[data-theme="dark"] .arco-tag, [data-theme="dark"] body .tag, [data-theme="dark"] #adminBody .tag { color: var(--arco-text-2) !important; background: var(--arco-border-3) !important; border-color: var(--arco-border-2) !important; }

/* ===== Arco Layout/Sider/Menu/Header 结构层（工作台） ===== */
/* 左栏 = Arco Sider */
body .sidebar { width: 240px !important; background: var(--arco-bg-container,#fff) !important; border-right: 1px solid var(--arco-border-1,#e5e6eb) !important; padding: 16px 10px !important; flex-shrink: 0 !important; }
/* 步骤栏 = Arco Menu（去掉圆点，文字+激活高亮） */
body .step-dot { display: flex !important; align-items: center !important; gap:12px !important; padding: 9px 12px !important; border-radius: var(--arco-radius,4px) !important; color: var(--arco-text-2,#4e5969) !important; cursor: pointer !important; transition: background .14s !important; }
body .step-dot:hover { background: var(--arco-color-primary-bg,#E8F3FF) !important; color: var(--arco-color-primary,#165DFF) !important; }
body .step-dot.active { background: var(--arco-color-primary-bg,#E8F3FF) !important; color: var(--arco-color-primary,#165DFF) !important; font-weight: 600 !important; }
body .step-dot .num { font-size: 14px !important; font-weight: 600 !important; color: inherit !important; min-width: 22px !important; }
body .step-dot .label { font-size: 14px !important; color: inherit !important; }
/* 子步骤 = Arco Menu 次要项（轻量删除圆点, 缩进, 可省略） */
body .substeps { border-left: none !important; padding-left: 8px !important; margin: 2px 0 8px 34px !important; }
body .substep .sub-dot { display: none !important; }
body .substep { font-size: 12px !important; color: var(--arco-text-3,#86909c) !important; padding: 4px 0 !important; }
/* 顶栏 step-header = Arco 大标题+副标题 */
body .step-header { padding: 20px 28px !important; border-bottom: 1px solid var(--arco-border-1,#e5e6eb) !important; background: var(--arco-bg-container,#fff) !important; }
body .step-header-title { font-size: 20px !important; font-weight: 600 !important; color: var(--arco-text-1,#1d2129) !important; }
body .step-header-sub { font-size:14px !important; color: var(--arco-text-3,#86909c) !important; margin-top: 2px !important; }
/* 主区 body = Arco Content 留白 */
body .step-body { background: var(--arco-bg-layout,#f7f8fa) !important; padding: 28px !important; }
/* 左栏下方 recipe 建议区 */
body .sidebar-recipe { margin-top: 8px !important; }

/* ===== Arco 输入 focus 主蓝高亮环（真实交互测试发现的缺口） ===== */
input:focus, textarea:focus, select:focus, input[type="text"]:focus, input[type="url"]:focus, input[type="number"]:focus {
  border-color: var(--arco-color-primary,#165DFF) !important;
  box-shadow: 0 0 0 2px var(--arco-color-primary-bg,#E8F3FF) !important;
  outline: none !important;
  z-index: 1;
  position: relative;
}
.pc-url-row:focus-within, .product-name-row:focus-within, .step0-meta-card .field:focus-within { }
input[type="text"]:focus, input[type="url"]:focus, input[type="number"]:focus, textarea:focus { background: #fff !important; }

/* ===== 修复叠加框线：外层卡是唯一盒，内层sections去边框/背景/阴影 ===== */
body .step0-col-left .step0-meta-card, body .step0-col-right .step0-meta-card,
body .free-upload-section, body .product-context-collapse, body .product-brief-card,
body .step0-col-left > *, body .step0-col-right > * {
  border: none !important; background: transparent !important; box-shadow: none !important; border-radius: 0 !important; padding-left: 0 !important; padding-right: 0 !important;
}
/* 但保留外层卡自身的 card 样式 */
body .step0-col-left, body .step0-col-right {
  border: 1px solid var(--arco-border-1,#e5e6eb) !important; background: var(--arco-bg-container,#fff) !important; border-radius: 8px !important; box-shadow: var(--arco-shadow,0 4px 10px rgba(0,0,0,.10)) !important; padding: 20px 22px !important;
}
/* 卡内分区之间用细分隔线而非双盒 */
body .step0-col-left > .step0-meta-card, body .step0-col-right > .step0-meta-card,
body .free-upload-section { border-bottom: 1px solid var(--arco-border-2,#f2f3f5) !important; padding-bottom: 16px !important; margin-bottom: 16px !important; }

/* ===== 修复:末步下一步隐藏 + 选中卡Arco主蓝(真实交互测试发现) ===== */
/* 1) btnNext 被 Arco .btn display:inline-flex!important 覆盖 -> 内联 display:none 也强制隐藏 */
body .btn[style*="display: none"] { display: none !important; }
/* 2) 选中卡用 Arco #E8F3FF 底 + #165DFF, 覆盖 index.html 内联旧电光青 !important */
body .opt-card.selected { background: var(--arco-color-primary-bg,#E8F3FF) !important; }
body .opt-card.selected .opt-check { background: var(--arco-color-primary,#165DFF) !important; border-color: var(--arco-color-primary,#165DFF) !important; color: #fff !important; }
body .opt-check.checked, body .opt-card.selected .opt-check:checked { background: var(--arco-color-primary,#165DFF) !important; }

/* ===== 深度像素审阅第1轮修复：disabled按钮可读性 + 字距 ===== */
body .btn:disabled, body .btn[disabled], body .btn.disabled { color: #9aa3ae !important; background: #f2f3f5 !important; border-color: #e5e6eb !important; cursor: not-allowed !important; }
body .btn.primary:disabled, body .btn.primary[disabled] { background: #c9cdd4 !important; color: #fff !important; }
body .btn { letter-spacing: 0 !important; font-family: var(--arco-font-family, inherit) !important; }
/* 输入placeholder / secondary 可读性 */
body input::placeholder, body textarea::placeholder { color: var(--arco-text-3,#86909c) !important; opacity: 1 !important; }

/* ===== 第1轮深审修复②：右Agent面板 可读性/留白 ===== */
body .agent-activity-node { border: 1px solid var(--arco-border-1,#e5e6eb) !important; border-radius: 8px !important; background: var(--arco-bg-container,#fff) !important; padding: 12px 14px !important; margin-bottom: 8px !important; }
body .agent-activity-node .agent-activity-name, body .agent-roster .agent-rm-name { font-size:14px !important; font-weight: 500 !important; color: var(--arco-text-1,#1d2129) !important; }
body .agent-activity-node .agent-activity-role, body .agent-roster .agent-rm-role { font-size: 12px !important; color: var(--arco-text-3,#86909c) !important; }
body .sp-skills, body .agent-roster-skills { font-size:12px !important; color: var(--arco-text-2,#4e5969) !important; line-height: 1.5 !important; margin-top: 3px !important; }
body .agent-rm-chip, body .agent-call-card .agent-call-badge { border-radius: 12px !important; }

/* ===== 第2轮深审修复：侧栏导航项到 Arco Menu 字号 ===== */
.admin-nav-item { font-size: 14px !important; font-weight: 400 !important; color: var(--arco-text-2,#4e5969) !important; border-radius: var(--arco-radius,4px) !important; padding: 9px 14px !important; }
.admin-nav-item:hover { background: var(--arco-color-primary-bg,#E8F3FF) !important; color: var(--arco-color-primary,#165DFF) !important; }
.admin-nav-item.active { background: var(--arco-color-primary-bg,#E8F3FF) !important; color: var(--arco-color-primary,#165DFF) !important; font-weight: 500 !important; }

/* ===== 第3轮深审修复：统计大数字不换行破数(自适应缩小) ===== */
#adminBody .users-stat-value, #adminBody .users-stat-card .users-stat-value, #adminBody .gstat-num, #adminBody .stat-value, #adminBody .obs-stat .v {
  white-space: nowrap !important; font-size: clamp(18px, 1.7vw, 28px) !important; letter-spacing: -0.01em !important; overflow: hidden !important; text-overflow: ellipsis !important;
}
.auth-theme-toggle { display:inline-flex !important; align-items:center !important; justify-content:center !important; white-space:nowrap !important; }
.auth-theme-toggle svg { width:16px !important; height:16px !important; }
/* 资产网格主卡缩略图失败占位 */
.asset-card.thumb-failed, .product-asset-card.thumb-failed { background: var(--arco-bg-2,#f2f3f5) !important; }
.asset-card .asset-cover, .product-asset-card .pa-cover { position: relative; background: var(--arco-bg-2,#f2f3f5) !important; min-height: 120px !important; }
/* 统一上传图标: brief-drop 用与 free-upload 一致的圆形蓝徽标 */
.brief-drop .free-upload-icon, .brief-drop i.free-upload-icon { width:34px !important; height:34px !important; display:flex !important; align-items:center !important; justify-content:center !important; margin:0 auto 10px !important; }
.brief-drop .free-upload-icon svg { width:18px !important; height:18px !important; }

/* 暗色主题：品牌词名/副标题用亮色，避免黑字在深底看不清 */
[data-theme="dark"] .brand, [data-theme="dark"] .brand-name { color: #F7F7F8 !important; }
[data-theme="dark"] .brand-sub { color: #B8B8BA !important; }
[data-theme="dark"] .nav-link { color: #B8B8BA !important; }

/* 上传图标 v68.80：浅蓝底 + 主色蓝线框箭头（Arco 干净风），替代厚重的蓝色圆 */
.free-upload-icon, .free-upload-drop .free-upload-icon, .brief-drop .free-upload-icon, .pc-dropzone .free-upload-icon, body .free-upload-icon {
  width: 34px !important; height: 34px !important;
  color: #165DFF !important;
  background: rgba(22,93,255,.08) !important;
  border: 1px solid rgba(22,93,255,.18) !important;
  border-radius: 12px !important;
  margin: 0 auto 8px !important;
  display: flex !important; align-items: center !important; justify-content: center !important;
  box-shadow: none !important;
}
.free-upload-icon svg, .free-upload-drop .free-upload-icon svg, .brief-drop .free-upload-icon svg { width: 18px !important; height: 18px !important; }

/* v68.88 结构分析：section 头用干净 lucide 图标(替代高饱和 emoji)；内容区不强制滚动 */
.structure-notes-body .sn-section-h-ico { display:inline-flex; align-items:center; justify-content:center; width:20px; height:20px; border-radius:6px; background: rgba(22,93,255,.08); color:#165DFF; }
.structure-notes-body .sn-section-h-ico svg, .structure-notes-body .sn-h-lucide { width:14px !important; height:14px !important; }
.structure-notes-body .sn-collapse-title { display:inline-flex; align-items:center; gap:6px; }

/* v9x P1a：空态隐藏「清空」按钮（需 ID+class 提升优先级，压过 body .btn{display:inline-flex!important}） */
#btnClearFree.free-hidden { display: none !important; }

/* v9x P1c：产品名输入框占满整行，右侧按钮换行，避免占位符被截断 */
.product-name-row { flex-wrap: wrap; }
.product-name-row input { flex: 1 1 100%; min-width: 0; }
.product-name-row .btn { margin-left: 0; }

/* v92 Agent 状态总览·信息增强：每 Agent 一列，含职责/产出/技能 */
.agent-rm-desc { color: var(--t3, #94a3b8); font-size: 13px; line-height: 1.55; }
.agent-rm-meta { display: flex; flex-wrap: wrap; gap: 6px; padding: 2px 0; }
.agent-rm-meta .m { font-size: 12px; color: var(--t3, #94a3b8); background: var(--bg-2, #f1f5f9); border: 1px solid var(--line, #e2e8f0); border-radius: 6px; padding: 3px 8px; }
.agent-rm-meta .m b { color: var(--t2, #475569); font-weight: 600; }
.agent-rm-out-label { font-size: 12px; font-weight: 700; color: var(--t2, #475569); margin-bottom: 6px; }
.agent-out-kvs { display: flex; flex-direction: column; gap: 6px; }
.agent-out-kv { display: flex; gap: 8px; font-size: 13px; border-bottom: 1px dashed var(--line, #eef2f7); padding-bottom: 4px; }
.agent-out-kv b { flex: 0 0 auto; color: var(--brand-text, #165DFF); font-weight: 600; min-width: 90px; }
.agent-out-kv span { color: var(--t2, #475569); line-height: 1.5; }

/* v92 · 用户下拉菜单统一 ARCO 排版：字号层次一致，消除「有大小」 */
.artbus-user-head .artbus-user-name { font-size: 14px; font-weight: 600; color: var(--t1); }
.artbus-user-head .artbus-user-role { font-size: 12px; color: var(--t3); margin-top: 2px; }
.artbus-credit-card { padding: 12px 12px 10px; }
.artbus-credit-row, .artbus-credit-row.sub { font-size: 12.5px; line-height: 1.5; }
.artbus-credit-label { font-size: 12.5px; color: var(--t3); }
/* ARCO Statistic：主数值略大但稳定，不喧宾夺主 */
.artbus-credit-num { font-size: 17px; font-weight: 700; color: #FF7D00; font-variant-numeric: tabular-nums; line-height: 1.2; }
.artbus-user-dropdown a, .artbus-user-dropdown button { font-size: 14px; padding: 10px 12px; }
.artbus-user-dropdown a span, .artbus-user-dropdown button span { font-size: 14px; }