/* 拉片深色模式 */
    .dark-editor {
      min-height: 100vh;
      padding: 22px 24px 38px;
      color: #eef0f8;
      background:
        radial-gradient(circle at 90% 0%, rgba(87, 91, 221, .17), transparent 28%),
        #161820;
    }

    .dark-editor .page-head p { color: #8f95a8; }
    .editor-toolbar {
      display: flex;
      align-items: center;
      gap: 10px;
    }

    .dark-button {
      padding: 8px 12px;
      border: 1px solid #383b49;
      border-radius: 9px;
      color: #dfe2ed;
      background: #22252f;
    }

    .pull-grid {
      display: grid;
      grid-template-columns: 320px minmax(320px, .9fr) minmax(390px, 1.15fr);
      gap: 14px;
    }

    .dark-card {
      border: 1px solid #2c303c;
      border-radius: 14px;
      background: #20232c;
      overflow: hidden;
    }

    .dark-card-head {
      display: flex;
      justify-content: space-between;
      align-items: center;
      padding: 13px 15px;
      border-bottom: 1px solid #2d303b;
    }

    .dark-card-head strong { font-size: 14px; }
    .dark-card-head span { color: #858b9d; font-size: 12px; }

    .video-box {
      position: relative;
      width: 210px;
      aspect-ratio: 9 / 16;
      display: grid;
      place-items: center;
      margin: 17px auto;
      border-radius: 13px;
      overflow: hidden;
      background:
        linear-gradient(180deg, transparent 60%, rgba(0,0,0,.72)),
        radial-gradient(circle at 58% 38%, #c8a88b 0 11%, transparent 12%),
        linear-gradient(150deg, #e9d9c7 0 36%, #8b6d55 37% 54%, #d9c3aa 55%);
      box-shadow: 0 12px 30px rgba(0,0,0,.25);
    }

    .video-box::after {
      content: "轻净 Pro 除螨仪";
      position: absolute;
      left: 12px;
      right: 12px;
      bottom: 15px;
      color: #fff;
      font-weight: 700;
      text-align: center;
    }

    .play {
      width: 52px;
      height: 52px;
      display: grid;
      place-items: center;
      border: 1px solid rgba(255,255,255,.42);
      border-radius: 50%;
      color: #fff;
      background: rgba(15,17,25,.45);
      font-size: 20px;
      backdrop-filter: blur(8px);
    }

    .video-controls { padding: 0 16px 16px; }
    .progress { height: 5px; border-radius: 99px; background: #373a46; overflow: hidden; }
    .progress span { display: block; width: 38%; height: 100%; background: #797cf4; }
    .time-row { display: flex; justify-content: space-between; margin-top: 7px; color: #858b9d; font-size: 11px; }

    .transcript {
      max-height: 490px;
      padding: 9px 15px 16px;
      overflow: auto;
    }

    .transcript-row {
      display: grid;
      grid-template-columns: 42px 1fr;
      gap: 9px;
      padding: 8px 0;
      color: #cbd0de;
      border-bottom: 1px solid #2b2e38;
    }

    .transcript-row span { color: #777e93; font-size: 11px; }
    .transcript-row.active { color: #fff; }
    .transcript-row.active span { color: #8c8fff; }

    .analysis-stack { display: grid; gap: 12px; }
    .analysis-body { padding: 14px 15px; color: #c8cdd9; }
    .analysis-body p { margin: 0 0 10px; }
    .tag-row { display: flex; flex-wrap: wrap; gap: 7px; }
    .dark-tag { padding: 5px 8px; border-radius: 7px; color: #bbbff9; background: #2a2d43; font-size: 11px; }

    .storyboard {
      grid-column: 1 / -1;
      padding-bottom: 15px;
    }

    .shot-strip {
      display: grid;
      grid-template-columns: repeat(6, minmax(150px, 1fr));
      gap: 10px;
      padding: 14px;
      overflow: auto;
    }

    .shot {
      min-width: 150px;
      border: 1px solid #303440;
      border-radius: 10px;
      overflow: hidden;
      background: #1b1e26;
    }

    .shot-img {
      height: 96px;
      display: flex;
      align-items: flex-end;
      padding: 8px;
      background: linear-gradient(145deg, #7f6754, #d6c1aa 48%, #6f7d89);
    }

    .shot:nth-child(2) .shot-img { background: linear-gradient(145deg, #675163, #c9a5b4 50%, #a98d77); }
    .shot:nth-child(3) .shot-img { background: linear-gradient(145deg, #426165, #91b7b2 50%, #d2cbbd); }
    .shot:nth-child(4) .shot-img { background: linear-gradient(145deg, #867452, #e0cd96 50%, #6e6254); }
    .shot:nth-child(5) .shot-img { background: linear-gradient(145deg, #635b7b, #aaa0cf 50%, #e0d9cd); }
    .shot:nth-child(6) .shot-img { background: linear-gradient(145deg, #715759, #c99b91 50%, #eee1cc); }
    .shot-img span { padding: 3px 6px; border-radius: 5px; color: white; background: rgba(0,0,0,.45); font-size: 10px; }
    .shot-body { padding: 9px; color: #b9bfce; font-size: 11px; }
    .shot-body strong { display: block; margin-bottom: 4px; color: #f0f1f5; font-size: 12px; }

    /* 通用业务页 */
    .metric-grid {
      display: grid;
      grid-template-columns: repeat(4, minmax(0, 1fr));
      gap: 13px;
      margin-bottom: 18px;
    }

    .metric-card {
      padding: 17px;
      border: 1px solid var(--line);
      border-radius: 14px;
      background: #fff;
    }

    .metric-card span { color: var(--muted); font-size: 12px; }
    .metric-card strong { display: block; margin: 7px 0 2px; font-size: 24px; }
    .metric-card small { color: var(--green); }

    .tabs {
      display: flex;
      align-items: center;
      gap: 4px;
      padding: 5px;
      border-radius: 11px;
      background: #edeef4;
    }

    .tab {
      padding: 7px 12px;
      border: 0;
      border-radius: 8px;
      color: #6c7182;
      background: transparent;
      font-weight: 650;
    }

    .tab.active { color: var(--brand-strong); background: #fff; box-shadow: 0 3px 10px rgba(39,43,70,.08); }

    .filter-bar {
      display: flex;
      align-items: center;
      gap: 10px;
      padding: 13px 15px;
      border-bottom: 1px solid var(--line);
    }

    .search {
      flex: 1;
      min-width: 180px;
      padding: 9px 11px;
      border: 1px solid var(--line);
      border-radius: 9px;
      outline: none;
    }

    .filter-select {
      padding: 9px 10px;
      border: 1px solid var(--line);
      border-radius: 9px;
      color: #555a6b;
      background: #fff;
    }

    .asset-grid {
      display: grid;
      grid-template-columns: repeat(4, minmax(0, 1fr));
      gap: 14px;
      padding: 16px;
    }

    .library-card {
      border: 1px solid var(--line);
      border-radius: 13px;
      overflow: hidden;
      background: #fff;
      transition: .2s ease;
    }

    .library-card:hover { transform: translateY(-2px); box-shadow: var(--shadow); }

    .library-cover {
      height: 120px;
      display: flex;
      align-items: flex-end;
      justify-content: space-between;
      padding: 12px;
      background:
        radial-gradient(circle at 72% 28%, rgba(255,255,255,.85), transparent 12%),
        linear-gradient(135deg, #e5e6ff, #ccebf0);
    }

    .library-card:nth-child(2) .library-cover { background: linear-gradient(135deg, #fde7d8, #f3c5c5); }
    .library-card:nth-child(3) .library-cover { background: linear-gradient(135deg, #d8f1df, #c6dfe8); }
    .library-card:nth-child(4) .library-cover { background: linear-gradient(135deg, #efe3ff, #d5d6f5); }
    .library-card:nth-child(5) .library-cover { background: linear-gradient(135deg, #dce9ff, #f4e4bc); }
    .library-card:nth-child(6) .library-cover { background: linear-gradient(135deg, #d5efe6, #f1ded4); }
    .library-card:nth-child(7) .library-cover { background: linear-gradient(135deg, #eadbff, #c9e7f0); }
    .library-card:nth-child(8) .library-cover { background: linear-gradient(135deg, #ffe1d6, #e9debd); }

    .cover-type {
      padding: 4px 7px;
      border-radius: 7px;
      color: #fff;
      background: rgba(43, 46, 70, .55);
      font-size: 10px;
    }

    .library-info { padding: 12px; }
    .library-info strong { display: block; margin-bottom: 5px; }
    .library-info p { min-height: 38px; margin: 0 0 9px; color: var(--muted); font-size: 12px; }

    .table-wrap { overflow: auto; }
    table { width: 100%; border-collapse: collapse; }
    th, td { padding: 13px 14px; border-bottom: 1px solid var(--line); text-align: left; white-space: nowrap; }
    th { color: #777c8e; background: #fafafe; font-size: 11px; letter-spacing: .2px; }
    td { color: #444858; font-size: 13px; }
    tr:hover td { background: #fcfcff; }

    .product-cell { display: flex; align-items: center; gap: 9px; }
    .mini-thumb {
      width: 38px;
      height: 38px;
      display: grid;
      place-items: center;
      border-radius: 9px;
      color: var(--brand-strong);
      background: var(--brand-soft);
      font-size: 12px;
      font-weight: 800;
    }

    .two-col {
      display: grid;
      grid-template-columns: minmax(0, 1.55fr) minmax(300px, .75fr);
      gap: 16px;
    }

    .todo-list { padding: 2px 15px 15px; }

    .todo {
      display: flex;
      align-items: flex-start;
      gap: 10px;
      padding: 12px 0;
      border-bottom: 1px solid var(--line);
    }

    .todo-dot {
      width: 9px;
      height: 9px;
      flex: 0 0 auto;
      margin-top: 6px;
      border-radius: 50%;
      background: var(--orange);
    }

    .todo strong { display: block; font-size: 13px; }
    .todo small { color: var(--muted); }

    .flow-card {
      display: grid;
      grid-template-columns: repeat(5, minmax(0, 1fr));
      gap: 8px;
      padding: 16px;
    }

    .flow-step {
      position: relative;
      padding: 14px 10px;
      border: 1px solid var(--line);
      border-radius: 11px;
      background: #fbfbfe;
      text-align: center;
    }

    .flow-step:not(:last-child)::after {
      content: "→";
      position: absolute;
      right: -9px;
      top: 50%;
      z-index: 2;
      color: #a7aabd;
      transform: translateY(-50%);
    }

    .flow-step b {
      width: 29px;
      height: 29px;
      display: grid;
      place-items: center;
      margin: 0 auto 7px;
      border-radius: 9px;
      color: var(--brand-strong);
      background: var(--brand-soft);
    }

    .flow-step strong { display: block; font-size: 12px; }
    .flow-step small { color: var(--muted); font-size: 10px; }

    .lead-score {
      width: 36px;
      height: 36px;
      display: grid;
      place-items: center;
      border-radius: 50%;
      color: #fff;
      background: var(--green);
      font-weight: 800;
    }

    /* 模态框和 Toast */
    .modal-backdrop {
      position: fixed;
      inset: 0;
      z-index: 80;
      display: none;
      align-items: center;
      justify-content: center;
      padding: 20px;
      background: rgba(20, 22, 35, .45);
      backdrop-filter: blur(4px);
    }

    .modal-backdrop.show { display: flex; }

    .modal {
      width: min(920px, 100%);
      height: min(820px, calc(100vh - 40px));
      max-height: calc(100vh - 40px);
      display: flex;
      flex-direction: column;
      overflow: hidden;
      border-radius: 18px;
      background: #fff;
      box-shadow: 0 24px 70px rgba(16, 18, 32, .24);
      animation: modalUp .22s ease;
    }

    @keyframes modalUp {
      from { opacity: 0; transform: translateY(10px) scale(.985); }
      to { opacity: 1; transform: translateY(0) scale(1); }
    }

    .modal-head, .modal-foot {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 12px;
      padding: 17px 20px;
    }

    .modal-head { flex: 0 0 auto; border-bottom: 1px solid var(--line); }
    .modal-foot { flex: 0 0 auto; border-top: 1px solid var(--line); background: #fff; }
    .modal-foot-actions { display: flex; align-items: center; gap: 10px; }
    .modal-head h3 { margin: 0; font-size: 17px; }

    .close-btn {
      width: 32px;
      height: 32px;
      border: 0;
      border-radius: 8px;
      color: #74798b;
      background: #f2f3f7;
    }

    .modal-body { min-height: 0; padding: 18px 22px 24px; overflow-y: auto; }
    .modal-intro { margin: 0 0 12px; color: var(--muted); line-height: 1.55; }
    .process-note {
      display: grid;
      grid-template-columns: 88px 1fr;
      gap: 10px;
      margin-bottom: 14px;
      padding: 10px 12px;
      border-radius: 10px;
      background: #f5f5ff;
      color: #555a6c;
      font-size: 12px;
      line-height: 1.5;
    }
    .process-note strong { color: #5b5ee2; }
    .form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
    .field.full { grid-column: 1 / -1; }
    .field label { display: block; margin-bottom: 6px; color: #555a6c; font-weight: 650; font-size: 12px; }
    .field input, .field select, .field textarea {
      width: 100%;
      padding: 10px 11px;
      border: 1px solid #dfe1e9;
      border-radius: 9px;
      outline: none;
      background: #fff;
    }
    .field input:focus, .field select:focus, .field textarea:focus { border-color: #9c9fef; box-shadow: 0 0 0 3px #eeeeff; }
    .field-hint { display: block; margin-top: 5px; color: #9195a3; font-size: 10px; line-height: 1.4; }
    .choice-row { display: flex; flex-wrap: wrap; gap: 7px; }
    .choice-chip { padding: 7px 9px; border: 1px solid #dfe1e9; border-radius: 8px; color: #5e6272; background: #fff; font-size: 11px; }
    .choice-chip.active { border-color: #a8abef; color: #5759d5; background: #f3f3ff; }
    .field textarea { min-height: 78px; resize: vertical; }
    .form-section {
      grid-column: 1 / -1;
      padding: 16px;
      border: 1px solid #ececf3;
      border-radius: 14px;
      background: #fcfcfe;
    }
    .form-section + .form-section { margin-top: 2px; }
    .form-section-head {
      display: flex;
      align-items: flex-start;
      justify-content: space-between;
      gap: 12px;
      margin-bottom: 13px;
    }
    .form-section-head strong { display: block; color: #343746; font-size: 13px; }
    .form-section-head small { display: block; margin-top: 3px; color: #969aa9; font-size: 10px; }
    .section-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
    .section-grid .full { grid-column: 1 / -1; }
    .field-label-row { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 6px; }
    .field-label-row label { margin: 0; }
    .text-action { border: 0; color: #6265df; background: transparent; font-size: 11px; }
    .smart-tip {
      display: flex;
      align-items: flex-start;
      gap: 9px;
      padding: 10px 12px;
      border-radius: 10px;
      color: #686c7c;
      background: #f3f3ff;
      font-size: 11px;
      line-height: 1.5;
    }
    .smart-tip strong { color: #5659d6; white-space: nowrap; }
    .upload-box {
      min-height: 92px;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      gap: 5px;
      padding: 16px;
      border: 1px dashed #cfd2e1;
      border-radius: 11px;
      color: #686c7d;
      background: #fff;
      text-align: center;
    }
    .upload-box strong { color: #4f5363; font-size: 12px; }
    .upload-box span { color: #999dab; font-size: 10px; }
    .input-with-unit { position: relative; }
    .input-with-unit input { padding-right: 46px; }
    .input-with-unit span {
      position: absolute;
      right: 12px;
      top: 50%;
      color: #8d91a0;
      font-size: 11px;
      transform: translateY(-50%);
    }
    .estimate-line { margin-top: 6px; color: #777c8c; font-size: 11px; }
    .material-summary {
      display: grid;
      grid-template-columns: 1fr auto;
      gap: 12px;
      align-items: center;
      padding: 12px 14px;
      border: 1px solid #dcdef3;
      border-radius: 11px;
      background: #f7f7ff;
    }
    .material-summary strong { display: block; color: #414558; font-size: 12px; }
    .material-summary small { display: block; margin-top: 4px; color: #7f8394; font-size: 10px; }
    .material-summary b { color: #5b5ee2; font-size: 18px; }
    .material-scope-detail { grid-column: 1 / -1; }
    .conditional-slot { display: none; }
    .conditional-slot.show { display: block; }
    .advanced-block {
      grid-column: 1 / -1;
      border-top: 1px solid #e8e9f0;
      padding-top: 12px;
    }
    .advanced-block summary { color: #6265db; cursor: pointer; font-size: 12px; font-weight: 650; }
    .advanced-content { margin-top: 13px; }
    .source-tabs {
      display: inline-flex;
      gap: 3px;
      padding: 3px;
      border-radius: 10px;
      background: #f0f1f5;
    }
    .source-tab {
      padding: 7px 12px;
      border: 0;
      border-radius: 8px;
      color: #747888;
      background: transparent;
      font-size: 11px;
    }
    .source-tab.active {
      color: #5457d7;
      background: #fff;
      box-shadow: 0 2px 8px rgba(34, 37, 54, .08);
    }
    .product-source-panel { grid-column: 1 / -1; }
    .inline-control {
      display: grid;
      grid-template-columns: 1fr auto;
      gap: 8px;
      align-items: center;
    }
    .inline-control .soft-btn { height: 40px; white-space: nowrap; }
    .inline-feedback {
      display: flex;
      align-items: flex-start;
      gap: 9px;
      margin-top: 9px;
      padding: 10px 12px;
      border: 1px solid #dfe1f4;
      border-radius: 10px;
      color: #666b7c;
      background: #f7f7ff;
      font-size: 11px;
      line-height: 1.5;
    }
    .inline-feedback.success { border-color: #ccebdc; color: #31765b; background: #f3fbf7; }
    .inline-feedback.error { border-color: #f4d0d0; color: #a64b4b; background: #fff6f6; }
    .quick-tags { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 7px; }
    .quick-tag {
      padding: 5px 8px;
      border: 1px solid #e0e2ea;
      border-radius: 7px;
      color: #6f7382;
      background: #fff;
      font-size: 10px;
    }
    .quick-tag.active { border-color: #aeb1ef; color: #575ad7; background: #f3f3ff; }
    .audience-box { display: flex; flex-wrap: wrap; gap: 7px; }
    .audience-chip {
      padding: 6px 9px;
      border: 1px solid #dfe1e9;
      border-radius: 8px;
      color: #626676;
      background: #fff;
      font-size: 10px;
    }
    .audience-chip.active { border-color: #a8abef; color: #5759d5; background: #f3f3ff; }
    .rewrite-audience-chip {
      padding: 7px 11px;
      border: 1px solid #dfe1e9;
      border-radius: 8px;
      color: #626676;
      background: #fff;
      font-size: 11px;
      cursor: pointer;
    }
    .rewrite-audience-chip:hover { border-color: #b9bbec; color: #5759d5; }
    .rewrite-audience-chip.active { border-color: #8e8fea; color: #5759d5; background: #f3f3ff; }
    .rewrite-audience-details { display: grid; gap: 9px; margin-top: 16px; }
    .rewrite-audience-details textarea { min-height: 74px; }
    .rewrite-strategy-title { display: flex; align-items: baseline; gap: 8px; margin-bottom: 14px; }
    .rewrite-strategy-title strong { font-size: 13px; color: #242735; }
    .rewrite-strategy-title span { font-size: 10px; color: #9a9dac; }
    .preset-row { display: grid; grid-template-columns: 1fr auto; gap: 8px; }
    .context-badge {
      display: inline-flex;
      align-items: center;
      gap: 6px;
      color: #31765b;
      font-size: 11px;
    }
    .context-badge::before {
      width: 7px;
      height: 7px;
      border-radius: 50%;
      background: #3cb981;
      content: "";
    }
    .field-validation {
      margin-top: 5px;
      color: #c44f4f;
      font-size: 10px;
    }
    .field.invalid input, .field.invalid select, .field.invalid textarea { border-color: #db7777; box-shadow: 0 0 0 3px #fff0f0; }
    .upload-box { cursor: pointer; transition: .18s ease; }
    .upload-box:hover { border-color: #aeb1ef; background: #f8f8ff; }
    .upload-box.selected { border-style: solid; border-color: #9ed7bb; color: #31765b; background: #f4fbf7; }
    button:disabled { cursor: not-allowed; opacity: .55; }

    @media (max-width: 720px) {
      .modal-backdrop { padding: 0; align-items: flex-end; }
      .modal { width: 100%; height: 94vh; max-height: 94vh; border-radius: 18px 18px 0 0; }
      .form-grid, .section-grid { grid-template-columns: 1fr; }
      .field.full, .section-grid .full { grid-column: 1; }
      .modal-foot { align-items: stretch; }
      .modal-foot-actions { margin-left: auto; }
    }

    .toast {
      position: fixed;
      left: 50%;
      bottom: 28px;
      z-index: 2200;
      padding: 11px 16px;
      border-radius: 10px;
      color: #fff;
      background: #242735;
      box-shadow: 0 12px 30px rgba(0,0,0,.2);
      opacity: 0;
      pointer-events: none;
      transform: translate(-50%, 12px);
      transition: .25s ease;
    }

    .toast.show { opacity: 1; transform: translate(-50%, 0); }
    .toast.has-action { display:flex; align-items:center; gap:14px; pointer-events:auto; }
    .toast.has-action button { padding:0; border:0; color:#b9b2ff; background:transparent; font:inherit; font-weight:700; cursor:pointer; }
    .toast.has-action button:hover { color:#fff; }

    .mobile-toggle { display: none; }