body { font-family: var(--font-body); background: var(--off); color: var(--ink); min-height: 100vh; display: flex; }

    .page-body { padding: 24px; width: 100%; transition: max-width var(--composer-transition); max-width: none; box-sizing: border-box; }
    body.sidebar-collapsed .page-body { max-width: none; }
    body.composer-has-content { overflow: hidden; }
    body.composer-has-content .main { height: 100vh; overflow: hidden; }
    body.composer-has-content .page-body {
      height: calc(100vh - 42px);
      padding: 8px 12px 10px;
      display: flex;
      min-height: 0;
    }
    .composer-help-modal { position: fixed; inset: 0; z-index: 80; display: none; align-items: center; justify-content: center; padding: 24px; background: rgba(15, 23, 42, .35); backdrop-filter: blur(4px); }
    .composer-help-modal.active { display: flex; }
    .composer-help-card { width: min(460px, 100%); background: var(--white); border: 1px solid var(--gray-100); border-radius: 18px; box-shadow: var(--shadow-lg); padding: 22px; }
    .composer-help-card h2 { margin: 0 0 8px; font-family: var(--font-display); font-size: 22px; color: var(--ink); }
    .composer-help-card p { margin: 0 0 14px; color: var(--gray-500); font-size: 13px; line-height: 1.65; }
    .composer-help-card ul { margin: 0 0 18px 18px; padding: 0; color: var(--gray-500); font-size: 13px; line-height: 1.65; }
    .composer-help-card button { height: 36px; padding: 0 16px; border: 0; border-radius: 10px; background: var(--ink); color: #fff; font-family: var(--font-body); font-weight: 700; cursor: pointer; }
    .composer-schedule-modal { position: fixed; inset: 0; z-index: 120; display: none; align-items: center; justify-content: center; padding: 18px; background: rgba(15, 23, 42, .42); backdrop-filter: blur(8px); }
    .composer-schedule-modal.open { display: flex; }
    .composer-schedule-card { width: min(520px, 100%); max-height: calc(100vh - 36px); display: flex; flex-direction: column; overflow: hidden; background: var(--white); border: 1px solid var(--gray-100); border-radius: 14px; box-shadow: 0 24px 70px rgba(15, 23, 42, .24); }
    .composer-schedule-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; padding: 18px 20px 14px; border-bottom: 1px solid var(--gray-100); }
    .composer-schedule-title { margin: 0 0 3px; font-family: var(--font-display); font-size: 18px; line-height: 1.2; color: var(--ink); }
    .composer-schedule-sub { margin: 0; color: var(--gray-500); font-size: 12px; line-height: 1.45; }
    .composer-schedule-close { width: 30px; height: 30px; display: inline-flex; align-items: center; justify-content: center; border: 0; border-radius: 8px; background: transparent; color: var(--gray-400); font-family: var(--font-body); font-size: 18px; line-height: 1; cursor: pointer; flex: 0 0 auto; }
    .composer-schedule-close:hover { background: var(--gray-50); color: var(--ink); }
    .composer-schedule-body { padding: 18px 20px; overflow: auto; }
    .composer-schedule-modal #dpDateSection { padding: 0; }
    .composer-schedule-modal .dp-schedule-row { display: grid; grid-template-columns: minmax(0, 170px) minmax(0, 1fr); gap: 16px; align-items: start; }
    .composer-schedule-modal #dpDateSection .dp-label { font-size: 10px; margin-bottom: 6px; line-height: 1; }
    .composer-schedule-modal #dpDateSection .dp-datetime { width: 100%; min-height: 38px; padding: 8px 10px; font-size: 13px; border-radius: 9px; }
    .composer-schedule-modal .dp-slot-field { flex: 1 1 auto; }
    .composer-schedule-modal .dp-slot-pills { gap: 8px; }
    .composer-schedule-modal .dp-slot-pill { min-height: 38px; padding: 7px 12px; }
    .composer-schedule-modal .dp-slot-time { font-size: 12px; }
    .composer-schedule-modal .dp-slot-label { font-size: 10px; }
    .composer-schedule-actions { display: flex; justify-content: flex-end; gap: 8px; padding: 14px 20px 18px; border-top: 1px solid var(--gray-100); }
    .composer-schedule-actions .btn { min-height: 34px; padding: 0 14px !important; font-size: 12px !important; }
    @media (max-width: 620px) {
      .composer-schedule-modal .dp-schedule-row { grid-template-columns: 1fr; }
      .composer-schedule-card { max-height: calc(100vh - 20px); }
    }
    .composer-web-preview-modal { position:fixed; inset:0; z-index:95; display:none; background:rgba(7,14,27,.58); backdrop-filter:blur(5px); padding:18px; box-sizing:border-box; }
    .composer-web-preview-modal.open { display:flex; flex-direction:column; }
    .composer-web-preview-head { height:42px; flex:0 0 auto; display:flex; align-items:center; justify-content:space-between; gap:12px; padding:0 4px 10px; color:#fff; }
    .composer-web-preview-title-wrap { display:flex; align-items:center; gap:12px; min-width:0; flex:1 1 auto; }
    .composer-web-preview-title { font-size:13px; font-weight:900; letter-spacing:.02em; white-space:nowrap; }
    .composer-preview-card-style { display:flex; flex-direction:column; align-items:stretch; gap:5px; width:100%; box-sizing:border-box; padding:5px 5px 6px; border:0; border-radius:8px; background:#f8fbff; }
    .composer-preview-card-style-label { color:#64748b; font-size:10px; font-weight:900; letter-spacing:.07em; text-transform:uppercase; white-space:nowrap; }
    .composer-card-style-options { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:3px; }
    .composer-card-style-option { height:28px; padding:0 6px; border:1px solid #bfdbfe; border-radius:7px; background:#fff; color:#1e3a8a; font-family:var(--font-body); font-size:10px; font-weight:850; cursor:pointer; }
    .composer-card-style-option.active { background:#eef2ff; border-color:#7c8cff; color:#4f46e5; }
    .composer-card-style-option:hover:not(.active) { background:#eff6ff; color:#1d4ed8; }
    .composer-preview-mode-toggle { display:inline-flex; align-items:center; gap:3px; margin-left:auto; padding:3px; border:1px solid rgba(255,255,255,.2); border-radius:999px; background:rgba(255,255,255,.08); }
    .composer-preview-mode-toggle button { height:24px; padding:0 10px; border:0; border-radius:999px; background:transparent; color:rgba(255,255,255,.72); font-family:var(--font-body); font-size:11px; font-weight:850; cursor:pointer; }
    .composer-preview-mode-toggle button.active { background:#fff; color:#1e3a8a; }
    .composer-web-preview-actions { display:flex; align-items:center; gap:8px; }
    .composer-web-preview-actions button { height:30px; padding:0 12px; border-radius:999px; border:1px solid rgba(255,255,255,.22); background:rgba(255,255,255,.08); color:#fff; font-family:var(--font-body); font-size:12px; font-weight:800; cursor:pointer; }
    .composer-web-preview-actions button:hover { background:rgba(255,255,255,.16); }
    .composer-web-preview-frame { flex:1 1 auto; min-height:0; width:100%; border:0; border-radius:12px; background:#081421; box-shadow:0 22px 80px rgba(0,0,0,.35); }
    .composer-web-preview-frame.hidden { display:none; }
    .composer-crawler-preview-pane { flex:1 1 auto; min-height:0; overflow:auto; border-radius:12px; background:#f8fbff; box-shadow:0 22px 80px rgba(0,0,0,.35); padding:16px; box-sizing:border-box; }
    .composer-crawler-preview-pane.hidden { display:none; }
    .composer-crawler-preview-pane .dp-preview-card { max-width:860px; margin:0 auto; }

    /* ── Composer card ───────────────────────────────── */
    .composer-card { background: var(--white); border: 1px solid var(--gray-100); border-radius: var(--radius-lg); box-shadow: var(--shadow-sm); display: flex; flex-direction: column; }
    body.composer-has-content .composer-card { flex: 1; min-height: 0; height: 100%; }
    .composer-header { padding: 18px 20px 14px; border-bottom: 1px solid var(--border); display: flex; align-items: flex-start; gap: 10px; flex-wrap: wrap; }
    .composer-topic { font-family: var(--font-display); font-size: 15px; font-weight: 700; color: var(--ink); flex: 1; line-height: 1.35; border-radius: 6px; padding: 2px 5px; margin: -2px -5px; outline: none; cursor: text; min-width: 200px; }
    .composer-topic:hover { background: var(--surface-2, rgba(0,0,0,0.04)); }
    .composer-topic:focus { background: var(--surface-2, rgba(0,0,0,0.06)); box-shadow: 0 0 0 2px var(--oracle-cyan, #06b6d4); }
    .composer-context-panel { background: #f0f9ff; border: 1px solid #bfdbfe; border-radius: 8px; padding: 12px 14px; margin-top: 12px; font-size: 12px; width: 100%; box-sizing: border-box; }
    .composer-ai-controls-panel { background: #eef6ff; padding: 10px 12px; }
    .dp-tray-inner.composer-ai-controls-panel { border-bottom: 1px solid var(--border, #e8e6e0); }
    .composer-ai-controls-panel .dp-agent-grid { width: 100%; }
    .context-panel-item { margin-bottom: 12px; display: flex; flex-direction: column; gap: 4px; align-items: flex-start; }
    .context-panel-item:last-child { margin-bottom: 0; }
    .context-panel-label { font-weight: 600; color: #1e40af; font-size: 11px; }
    .context-panel-value { color: #1e3a8a; flex: 1; }
    .context-panel-value.with-icon { display: inline-flex; align-items: flex-start; gap: 9px; min-width:0; max-width:100%; font-size:13px; font-weight:600; line-height:1.45; }
    .context-panel-value.with-icon span { white-space: normal; overflow-wrap: anywhere; word-break: break-word; }
    .context-panel-icon { width: 17px; height: 17px; flex: 0 0 auto; color: #1e40af; margin-top:1px; }
    .context-label-row { display:flex; align-items:center; gap:7px; flex-wrap:wrap; }
    .context-category-pill { display:inline-flex; align-items:center; padding:2px 8px; border-radius:999px; background:rgba(6,182,212,0.15); color:#0891b2; font-size:11px; font-weight:700; line-height:1.35; }
    .context-items-list { display: flex; gap: 6px; flex-wrap: wrap; }
    .context-item-badge { display: inline-flex; align-items: center; padding: 3px 8px; background: #dbeafe; color: #0369a1; border-radius: 12px; font-size: 11px; font-weight: 600; }
    a.context-item-badge { text-decoration: none; }
    a.context-item-badge:hover { background: #bfdbfe; color: #075985; }
    /* Context box */
    .composer-context-box { background: #f0f9ff; border: 1px solid #bfdbfe; border-radius: 8px; padding: 12px 14px; margin-top: 12px; font-size: 12px; }

    .composer-back { background: none; border: none; cursor: pointer; color: var(--gray-400); padding: 2px 6px; font-size: 13px; font-weight: 600; font-family: var(--font-body); display: flex; align-items: center; gap: 4px; border-radius: 6px; transition: all .15s; }
    .composer-back:hover { color: var(--ink); background: var(--gray-50); }
    .composer-body { padding: 20px; display: flex; flex-direction: column; gap: 0; }
    body.composer-has-content .composer-body { flex: 1; min-height: 0; padding: 10px 12px; }
    .composer-footer { padding: 14px 20px; border-top: 1px solid var(--border); display: flex; gap: 8px; align-items: center; }
    body.composer-has-content .composer-footer { flex-shrink: 0; padding: 10px 12px; }

    /* ── Status badge ────────────────────────────────── */
    .post-status { font-size: 11px; font-weight: 700; border-radius: 100px; padding: 2px 9px; }
    .post-content-type, .post-slop-score, .post-geo-score { font-size: 11px; font-weight: 800; border-radius: 100px; padding: 2px 9px; border: 1px solid var(--border); }
    .post-content-type { background: #f0f9ff; color: #0369a1; }
    .post-slop-score { background: #eef2ff; color: var(--accent); }
    .post-geo-score { background:#ecfdf5; color:#047857; border-color:#bbf7d0; }
    .status-scheduled  { background: var(--accent-lt); color: var(--accent); }
    .status-draft      { background: #fef3c7; color: #92400e; }
    .status-published  { background: var(--green-lt); color: #16a34a; }
    .status-failed     { background: var(--red-lt); color: var(--red); }

    /* ── Three-column layout with trending panel ── */
/* ── Detail panel sections (reused from schedule.html) ── */
    .dp-section { background: var(--gray-50, #f5f5f5); border-radius: var(--radius-md); padding: 12px 14px; margin-bottom: 0; }
    .dp-section.content-editor-card {
      padding:0;
      overflow:hidden;
      border:1px solid var(--border);
      background:var(--white);
      box-shadow:0 1px 2px rgba(15,23,42,.04);
      display:flex;
      flex-direction:column;
      min-height:0;
    }
    body.composer-has-content .dp-section.content-editor-card { flex: 1; min-height: 0; }
    .dp-section.dp-spaced { margin-bottom: 16px; }
    .dp-label { font-size: 11px; font-weight: 700; color: var(--text-3); text-transform: uppercase; letter-spacing: .07em; margin-bottom: 7px; }
    .content-editor-head {
      order: 1;
      min-height:34px;
      padding:6px 10px;
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:12px;
      border-bottom:1px solid var(--border);
      background:#f8fbff;
    }
    .content-editor-title {
      display:flex;
      align-items:center;
      gap:0;
      color:var(--gray-600);
      font-size:11px;
      font-weight:800;
      letter-spacing:.08em;
      text-transform:uppercase;
      white-space:nowrap;
    }
    .content-label-left { display:inline-flex; align-items:center; gap:8px; min-width:0; }
    .content-text-label {
      order: 3;
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:10px;
      min-height:26px;
      padding: 7px 14px 5px;
      border-top: 1px solid #bfdbfe;
      border-bottom: 1px solid #dbeafe;
      background: #eef6ff;
      color: #1e40af;
      font-size: 11px;
      font-weight: 800;
      letter-spacing: .08em;
      line-height: 1;
      text-transform: uppercase;
      flex: 0 0 auto;
      position: relative;
      z-index: 1;
    }
    .dp-richbar { display:flex; align-items:center; gap:3px; text-transform:none; letter-spacing:0; flex-wrap:wrap; }
    .dp-rich-btn { display:inline-flex; align-items:center; justify-content:center; min-width:26px; height:24px; padding:0 7px; border-radius:6px; border:1px solid #bfdbfe; background:#fff; color:#1e40af; font-family:var(--font-body); font-size:11px; font-weight:800; line-height:1; cursor:pointer; transition:background .15s, border-color .15s, color .15s; }
    .dp-rich-btn:hover { background:#dbeafe; border-color:#93c5fd; color:#1d4ed8; }
    .dp-rich-btn[data-tip] { position:relative; }
    .dp-rich-btn[data-tip]::after { content:attr(data-tip); position:absolute; bottom:calc(100% + 7px); left:50%; transform:translateX(-50%); background:var(--ink,#18181a); color:#fff; font-size:10px; font-weight:700; padding:4px 7px; border-radius:6px; white-space:nowrap; opacity:0; pointer-events:none; z-index:220; transition:opacity .15s; }
    .dp-rich-btn[data-tip]:hover::after { opacity:1; }
    .dp-ai-rewrite-popover {
      position: fixed;
      z-index: 2600;
      display: none;
      width: min(360px, calc(100vw - 24px));
      padding: 8px;
      border: 1px solid #bfdbfe;
      border-radius: 10px;
      background: #fff;
      box-shadow: 0 18px 48px rgba(15,23,42,.18);
      color: #0f172a;
    }
    .dp-ai-rewrite-popover.open { display: block; }
    .dp-ai-rewrite-row { display:flex; align-items:center; gap:6px; }
    .dp-ai-rewrite-btn,
    .dp-ai-rewrite-mode,
    .dp-ai-rewrite-action {
      border: 1px solid #bfdbfe;
      border-radius: 8px;
      background: #eff6ff;
      color: #1d4ed8;
      font-family: var(--font-body);
      font-size: 11px;
      font-weight: 900;
      cursor: pointer;
      white-space: nowrap;
    }
    .dp-ai-rewrite-btn { height: 30px; padding: 0 11px; display:inline-flex; align-items:center; gap:6px; }
    .dp-ai-rewrite-btn:hover,
    .dp-ai-rewrite-mode:hover,
    .dp-ai-rewrite-action:hover { background:#dbeafe; border-color:#93c5fd; }
    .dp-ai-rewrite-mode { height:30px; padding:0 9px; min-width:112px; }
    .dp-ai-rewrite-btn.loading { opacity:.68; cursor:wait; }
    .dp-ai-rewrite-preview { display:none; margin-top:8px; padding-top:8px; border-top:1px solid #dbeafe; }
    .dp-ai-rewrite-preview.show { display:block; }
    .dp-ai-rewrite-text {
      max-height:190px;
      overflow:auto;
      padding:9px 10px;
      border-radius:8px;
      background:#f8fbff;
      color:#1e293b;
      font-size:12px;
      line-height:1.45;
      white-space:pre-wrap;
    }
    .dp-ai-rewrite-choice {
      display:block;
      width:100%;
      padding:8px 9px;
      border:1px solid #dbeafe;
      border-radius:8px;
      background:#fff;
      color:#0f172a;
      font-family:var(--font-body);
      font-size:12px;
      font-weight:800;
      line-height:1.35;
      text-align:left;
      cursor:pointer;
      white-space:normal;
    }
    .dp-ai-rewrite-choice + .dp-ai-rewrite-choice { margin-top:6px; }
    .dp-ai-rewrite-choice:hover { border-color:#93c5fd; background:#eff6ff; color:#1d4ed8; }
    .dp-ai-rewrite-actions { display:flex; align-items:center; justify-content:flex-end; gap:6px; margin-top:8px; }
    .dp-ai-rewrite-action { height:28px; padding:0 9px; }
    .dp-ai-rewrite-action.primary { color:#fff; background:linear-gradient(135deg,#5b7cff,#06b6d4); border-color:transparent; }
    .dp-ai-rewrite-error { display:none; margin-top:7px; color:#dc2626; font-size:11px; font-weight:800; line-height:1.35; }
    .dp-ai-rewrite-error.show { display:block; }
    .content-editor-head-left { display:flex; align-items:center; gap:10px; min-width:0; }
    .content-editor-head-right { display:flex; align-items:center; gap:8px; flex-shrink:0; }

    /* ── Detail panel toolbar ── */
    .dp-toolbar { display: flex; align-items: center; gap: 3px; }
    .dp-tbtn { display: flex; align-items: center; justify-content: center; width: 28px; height: 28px; border-radius: 8px; border: 1px solid transparent; background: none; cursor: pointer; color: var(--text-3, #888); transition: all .15s; position: relative; flex-shrink: 0; }
    .dp-tbtn:hover { background: var(--gray-50, #f5f5f5); color: var(--ink, #18181a); }
    .dp-tbtn.active { background: var(--accent-lt, #ede9ff); color: var(--accent, #5b47ff); border-color:rgba(91,124,255,.24); }
    .dp-tbtn .dp-dot { display: none; width: 5px; height: 5px; border-radius: 50%; background: var(--accent, #5b47ff); position: absolute; bottom: 4px; left: 50%; transform: translateX(-50%); }
    .dp-tbtn.has-val .dp-dot { display: block; }
    .dp-tbtn[data-tip]::after { content: attr(data-tip); position: absolute; bottom: calc(100% + 8px); left: 50%; transform: translateX(-50%); background: var(--ink, #18181a); color: #fff; font-size: 11px; font-weight: 600; padding: 4px 8px; border-radius: 6px; white-space: nowrap; opacity: 0; pointer-events: none; transition: opacity .15s; z-index: 200; }
    .dp-tbtn[data-tip]:hover::after { opacity: 1; }
    .dp-preview-menu-wrap { position:relative; display:flex; align-items:center; }
    .dp-preview-menu { position:absolute; top:calc(100% + 6px); right:0; z-index:260; min-width:210px; display:none; padding:5px; border:1px solid #bfdbfe; border-radius:9px; background:#fff; box-shadow:0 12px 30px rgba(15,23,42,.16); }
    .dp-preview-menu.open { display:block; }
    .composer-footer .dp-preview-menu-wrap { display:inline-flex; }
    .composer-footer .dp-preview-menu { top:auto; bottom:calc(100% + 7px); }
    .dp-preview-menu button { width:100%; height:30px; display:flex; align-items:center; justify-content:flex-end; padding:0 9px; border:0; border-radius:7px; background:transparent; color:#1e3a8a; font-family:var(--font-body); font-size:11px; font-weight:850; text-align:right; cursor:pointer; }
    .dp-preview-menu button:hover { background:#eff6ff; color:var(--accent); }
    .dp-preview-menu .composer-card-style-option { height:28px; justify-content:center; padding:0 6px; border:1px solid #bfdbfe; border-radius:7px; background:#fff; color:#1e3a8a; font-size:10px; text-align:center; }
    .dp-preview-menu .composer-card-style-option.active { background:#eef2ff; border-color:#7c8cff; color:#4f46e5; }
    .dp-preview-menu .composer-card-style-option:hover:not(.active) { background:#eff6ff; color:#1d4ed8; }
    .dp-preview-menu-divider { display:block; height:1px; margin:5px 2px; background:#dbeafe; }
    .composer-publish-wrap { position: relative; display: inline-flex; }
    .composer-publish-menu { position: absolute; right: 0; bottom: calc(100% + 7px); z-index: 300; width: 190px; display: none; padding: 6px; border: 1px solid #bfdbfe; border-radius: 9px; background: #fff; box-shadow: 0 16px 38px rgba(15,23,42,.18); }
    .composer-publish-menu.open { display: block; }
    .composer-publish-menu button { width: 100%; min-height: 34px; display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 0 10px; border: 0; border-radius: 7px; background: transparent; color: #1e3a8a; font-family: var(--font-body); font-size: 12px; font-weight: 850; cursor: pointer; text-align: left; }
    .composer-publish-menu button:hover { background: #eff6ff; color: var(--accent); }
    .composer-publish-menu span { color: #64748b; font-size: 10px; font-weight: 900; letter-spacing: .03em; }
    .dp-tray { order: 2; overflow: hidden; max-height: 0; opacity: 0; transition: max-height .28s cubic-bezier(.4,0,.2,1), opacity .2s ease; min-height:0; flex:0 0 auto; }
    .dp-tray.open { max-height: 260px; opacity: 1; overflow-y: auto; overflow-x:hidden; }
    #dpTrayAgent.open { overflow: visible; }
    #dpTrayAgent.has-progress.open { max-height: 210px; }
    #dpTrayEnhance.open { max-height:min(54vh, 430px); }
    #dpTrayCite.open { max-height:min(62vh, 560px); }
    .dp-tray-inner { width:100%; min-width:0; box-sizing:border-box; overflow-x:hidden; padding: 10px 12px; background: #f3f8ff; border-bottom: 1px solid var(--border, #e8e6e0); border-radius: 0; }
    .dp-enhance-panel { display:grid; grid-template-columns:minmax(0, 210px) minmax(0, 1fr); gap:10px; align-items:start; }
    .dp-enhance-field { min-width:0; }
    .dp-enhance-scope-row { display:flex; align-items:center; gap:6px; margin-bottom:7px; }
    .dp-enhance-scope-label { color:#64748b; font-size:10px; font-weight:900; letter-spacing:.07em; text-transform:uppercase; white-space:nowrap; }
    .dp-enhance-scope {
      min-height:28px;
      padding:4px 9px;
      border:1.5px solid #dbeafe;
      border-radius:8px;
      background:#fff;
      color:#1e40af;
      font-family:var(--font-body);
      font-size:11px;
      font-weight:850;
      outline:none;
    }
    .dp-enhance-mode { display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:5px; }
    .dp-enhance-chip { min-height:28px; padding:5px 8px; border:1.5px solid var(--gray-200); border-radius:8px; background:#fff; color:#334155; font-family:var(--font-body); font-size:11px; font-weight:800; cursor:pointer; text-align:left; }
    .dp-enhance-chip:hover { border-color:#93c5fd; background:#eff6ff; color:#1d4ed8; }
    .dp-enhance-chip.active { border-color:var(--accent); background:var(--accent-lt); color:var(--accent); }
    .dp-enhance-variants { display:inline-flex; align-items:center; flex:0 0 auto; flex-wrap:nowrap; gap:5px; min-width:max-content; }
    .dp-enhance-platform-label { color:#64748b; font-size:11px; font-weight:900; letter-spacing:.02em; white-space:nowrap; }
    .dp-enhance-variant { flex:0 0 auto; min-height:28px; padding:4px 10px; border:1px solid #dbeafe; border-radius:999px; background:#fff; color:#1e40af; font-family:var(--font-body); font-size:11px; font-weight:900; cursor:pointer; white-space:nowrap; }
    .dp-enhance-variant:hover { background:#eff6ff; border-color:#93c5fd; }
    .dp-enhance-variant.active { background:#eef2ff; border-color:var(--accent); color:var(--accent); }
    .dp-enhance-note { width:100%; min-height:66px; max-height:120px; resize:vertical; box-sizing:border-box; padding:8px 9px; border:1.5px solid var(--gray-200); border-radius:8px; background:#fff; color:#0f172a; font-family:var(--font-body); font-size:12px; line-height:1.45; outline:none; }
    .dp-enhance-note:focus { border-color:var(--accent); box-shadow:0 0 0 3px var(--accent-lt); }
    .dp-enhance-toggle { display:inline-flex; align-items:center; gap:7px; margin:0 0 7px; color:#334155; font-size:11px; font-weight:850; cursor:pointer; user-select:none; }
    .dp-enhance-toggle input { width:14px; height:14px; margin:0; accent-color:var(--accent); }
    .dp-enhance-actions { grid-column:1 / -1; display:flex; flex-direction:row; flex-wrap:nowrap; gap:7px; align-items:center; min-width:0; overflow-x:auto; padding-bottom:1px; }
    .dp-enhance-note-actions { display:flex; justify-content:flex-end; align-items:center; gap:7px; margin-top:7px; }
    .dp-enhance-note-actions .dp-ai-run-btn { min-height:30px; justify-content:center; padding:7px 13px; }
    .dp-enhance-secondary { flex:0 0 auto; min-height:28px; padding:0 10px; border:1.5px solid #dbeafe; border-radius:999px; background:#fff; color:#1e40af; font-family:var(--font-body); font-size:11px; font-weight:850; cursor:pointer; white-space:nowrap; }
    .dp-enhance-secondary:hover { background:#eff6ff; }
    .dp-enhance-secondary:disabled { opacity:.52; cursor:not-allowed; background:#f8fafc; color:#94a3b8; }
    .dp-enhance-preview { grid-column:1 / -1; display:none; padding:10px; border:1px solid #dbeafe; border-radius:10px; background:rgba(255,255,255,.76); }
    .dp-enhance-preview.show { display:block; }
    .dp-enhance-preview-head { display:flex; align-items:center; justify-content:space-between; gap:10px; margin-bottom:8px; }
    .dp-enhance-preview-title { font-size:10px; font-weight:900; color:#475569; letter-spacing:.07em; text-transform:uppercase; }
    .dp-enhance-preview-meta { display:flex; align-items:center; justify-content:flex-end; gap:6px; flex-wrap:wrap; }
    .dp-enhance-score { font-size:11px; font-weight:900; color:var(--accent); padding:2px 8px; border:1px solid #dbeafe; border-radius:999px; background:#eef2ff; white-space:nowrap; }
    .dp-enhance-save-status { display:none; font-size:11px; font-weight:900; padding:2px 8px; border-radius:999px; border:1px solid #e5e7eb; background:#fff; color:#64748b; white-space:nowrap; }
    .dp-enhance-save-status.show { display:inline-flex; }
    .dp-enhance-save-status.saving { background:#eef2ff; color:var(--accent); border-color:#dbeafe; }
    .dp-enhance-save-status.saved { background:#ecfdf5; color:#047857; border-color:#bbf7d0; }
    .dp-enhance-save-status.error { background:#fef2f2; color:#dc2626; border-color:#fecaca; }
    .dp-enhance-why { margin-bottom:8px; padding:8px 10px; border:1px solid #e0f2fe; border-radius:8px; background:#f0f9ff; color:#0f172a; font-size:12px; line-height:1.45; }
    .dp-enhance-why strong { color:#075985; font-weight:900; }
    .dp-enhance-quality { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:6px; margin-bottom:8px; }
    .dp-enhance-quality-chip { min-width:0; padding:7px 8px; border:1px solid #dbeafe; border-radius:8px; background:#f8fbff; }
    .dp-enhance-quality-chip span { display:block; color:#64748b; font-size:9px; font-weight:900; letter-spacing:.06em; text-transform:uppercase; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
    .dp-enhance-quality-chip strong { display:block; margin-top:3px; color:#0f172a; font-size:11px; font-weight:900; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
    .dp-enhance-compare { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
    .dp-enhance-col { min-width:0; }
    .dp-enhance-col-label { margin:0 0 5px; color:#64748b; font-size:10px; font-weight:900; letter-spacing:.07em; text-transform:uppercase; }
    .dp-enhance-text { max-height:210px; overflow:auto; padding:10px; border-radius:8px; background:#f8fbff; color:#0f172a; font-size:12px; line-height:1.55; white-space:pre-wrap; }
    .dp-enhance-text.before { background:#fff; color:#475569; border:1px solid #e5e7eb; }
    .dp-enhance-hooks { grid-column:1 / -1; display:none; padding:10px; border:1px solid #dbeafe; border-radius:10px; background:#fff; }
    .dp-enhance-hooks.show { display:block; }
    .dp-enhance-hook-list { display:grid; gap:6px; margin-top:7px; }
    .dp-enhance-hook-choice { width:100%; padding:8px 9px; border:1px solid #dbeafe; border-radius:8px; background:#f8fbff; color:#0f172a; font-family:var(--font-body); font-size:12px; font-weight:850; line-height:1.35; text-align:left; cursor:pointer; }
    .dp-enhance-hook-choice:hover { border-color:#93c5fd; background:#eff6ff; color:#1d4ed8; }
    .dp-enhance-error { grid-column:1 / -1; display:none; color:#dc2626; font-size:11px; font-weight:800; line-height:1.35; }
    .dp-enhance-error.show { display:block; }

    /* ── Content textarea ── */
    .dp-ta { order: 4; width: 100%; box-sizing: border-box; flex:1 1 auto; min-height: 360px; padding: 14px; border: 0; border-radius: 0; font-family: var(--font-body); font-size: 13px; color: #0f172a !important; -webkit-text-fill-color: #0f172a; caret-color: #0f172a; resize: none; outline: none; line-height: 1.65; transition: box-shadow .15s, height .22s ease, min-height .22s ease; background: #fff !important; display:block; overflow-y:auto; }
    body.composer-has-content .dp-ta { flex:1 1 0; min-height:0; height:auto; }
    .dp-ta:focus { box-shadow: inset 0 0 0 2px rgba(91,124,255,.22); }
    .dp-ta.overlimit { border-color: var(--red) !important; }
    .dp-ta.rich-source { display:none !important; min-height:0; height:0; padding:0; overflow:hidden; }
    .dp-rich-editor {
      order:4;
      width:100%;
      box-sizing:border-box;
      flex:1 1 auto;
      min-height:360px;
      padding:16px 18px;
      border:0;
      border-radius:0;
      outline:none;
      background:#fff;
      color:#0f172a;
      font-family:var(--font-body);
      font-size:14px;
      line-height:1.7;
      overflow-y:auto;
      overflow-x:hidden;
      transition:box-shadow .15s, height .22s ease, min-height .22s ease;
      white-space:normal;
    }
    body.composer-has-content .dp-rich-editor { flex:1 1 0; min-height:0; height:auto; }
    body.composer-has-content .content-editor-card.tool-panel-open .dp-ta,
    body.composer-has-content .content-editor-card.tool-panel-open .dp-rich-editor {
      flex:1 1 0;
      min-height:0;
      height:auto;
    }
    .dp-rich-editor:focus { box-shadow: inset 0 0 0 2px rgba(91,124,255,.22); }
    .dp-rich-editor.overlimit { box-shadow: inset 0 0 0 2px rgba(220,38,38,.35); }
    .dp-rich-editor:empty::before { content:attr(data-placeholder); color:#94a3b8; pointer-events:none; }
    .dp-rich-editor p { margin:0 0 14px; }
    .dp-rich-editor p:last-child { margin-bottom:0; }
    .dp-rich-editor h2 { margin:20px 0 10px; font-family:var(--font-display); font-size:20px; line-height:1.28; color:#0f172a; }
    .dp-rich-editor h3 { margin:16px 0 8px; font-family:var(--font-display); font-size:16px; line-height:1.35; color:#0f172a; }
    .dp-rich-editor ul,
    .dp-rich-editor ol { margin:0 0 14px 22px; padding:0; }
    .dp-rich-editor blockquote { margin:0 0 14px; padding:8px 12px; border-left:3px solid #93c5fd; background:#f8fbff; color:#334155; }
    .dp-rich-editor a { color:#0284c7; text-decoration:underline; text-decoration-thickness:1px; text-underline-offset:2px; }
    .dp-rich-editor img,
    .dp-rich-editor video { display:block; max-width:100%; height:auto; box-sizing:border-box; object-fit:contain; }
    .dp-rich-editor figure { margin:16px 0; padding:0; width:100%; max-width:100%; min-width:0; position:relative; overflow:hidden; box-sizing:border-box; clear:both; }
    .dp-rich-editor figure img,
    .dp-rich-editor figure video { display:block; width:100%; max-width:100%; height:auto; max-height:min(42vh, 360px); object-fit:contain; border-radius:8px; background:#020617; border:1px solid #dbeafe; box-sizing:border-box; }
    .dp-rich-editor figure figcaption { margin-top:6px; color:#64748b; font-size:12px; line-height:1.45; }
    .dp-inline-media-remove { position:absolute; top:8px; right:8px; z-index:4; width:24px; height:24px; border:0; border-radius:999px; background:rgba(15,23,42,.78); color:#fff; font-size:16px; font-weight:900; line-height:1; cursor:pointer; display:inline-flex; align-items:center; justify-content:center; box-shadow:0 6px 14px rgba(15,23,42,.22); opacity:.86; }
    .dp-inline-media-remove:hover { opacity:1; background:#dc2626; }
    .dp-cc-row { display: none; }
    .dp-blocks-btn { display:none; align-items:center; gap:6px; padding:5px 12px; border-radius:6px; border:1.5px solid var(--accent); background:var(--accent-lt); color:var(--accent); font-size:11px; font-weight:700; cursor:pointer; font-family:var(--font-body); white-space:nowrap; transition:all .15s; }
    .dp-blocks-btn:hover { background:var(--accent); color:#fff; }
    .dp-blocks-btn.visible { display:flex; }
    .dp-blocks-btn.loading { opacity:.6; pointer-events:none; }
    .dp-blocks-panel {
      order:2;
      max-height:0;
      opacity:0;
      margin-top:0;
      border:1.5px solid var(--border);
      border-left:0;
      border-right:0;
      border-radius:0;
      overflow:hidden;
      transition:max-height 0.3s ease, opacity 0.3s ease, margin-top 0.3s ease;
      pointer-events:none;
      flex:0 0 auto;
    }
    .dp-blocks-panel.visible {
      max-height:min(62vh, 560px);
      opacity:1;
      pointer-events:auto;
      overflow-y:auto;
      overflow-x:hidden;
    }
    .dp-blocks-header { padding:10px 14px; background:var(--bg); border-bottom:1px solid var(--border); display:flex; align-items:center; justify-content:space-between; }
    .dp-blocks-header-label { font-size:11px; font-weight:700; color:var(--text-3); text-transform:uppercase; letter-spacing:.07em; }
    .dp-blocks-header-count { font-size:11px; color:var(--text-3); }
    #dpBlocksList { min-width:0; overflow-x:hidden; }
    .dp-block-item { min-width:0; padding:10px 14px; border-bottom:1px solid var(--border); display:flex; align-items:flex-start; gap:10px; }
    .dp-block-item:last-child { border-bottom:none; }
    .dp-block-badge { flex-shrink:0; min-width:34px; text-align:center; padding:2px 7px; border-radius:4px; font-size:10px; font-weight:700; text-transform:uppercase; letter-spacing:.05em; }
    .dp-block-badge.hero     { background:#ede9fe; color:#6d28d9; }
    .dp-block-badge.stat     { background:#dcfce7; color:#15803d; }
    .dp-block-badge.claim    { background:#fef9c3; color:#854d0e; }
    .dp-block-badge.evidence { background:#dbeafe; color:#1d4ed8; }
    .dp-block-badge.source   { background:#f3f4f6; color:#374151; }
    .dp-block-badge.cta      { background:#fce7f3; color:#9d174d; }
    .dp-block-badge.answer   { background:#ccfbf1; color:#0f766e; }
    .dp-block-badge.section  { background:#e0f2fe; color:#0369a1; }
    .dp-block-badge.faq      { background:#fae8ff; color:#86198f; }
    .dp-block-badge.citation { background:#ffedd5; color:#9a3412; }
    .dp-block-content { flex:1; min-width:0; max-width:100%; font-size:12px; color:var(--ink); line-height:1.45; overflow-wrap:anywhere; word-break:break-word; }
    .dp-block-stat-summary { display:grid; grid-template-columns:minmax(0,max-content) minmax(0,1fr); column-gap:6px; row-gap:3px; align-items:baseline; min-width:0; max-width:100%; }
    .dp-block-stat-value { min-width:0; font-weight:800; color:var(--ink); white-space:normal; overflow-wrap:anywhere; }
    .dp-block-stat-label { min-width:0; color:var(--ink); overflow-wrap:anywhere; white-space:normal; }
    .dp-block-stat-context { grid-column:1 / -1; color:var(--text-3); font-size:11px; line-height:1.35; }
    .dp-seo-panel,
    .dp-preview-panel {
      order:2;
      max-height:0;
      opacity:0;
      border:1.5px solid var(--border);
      border-left:0;
      border-right:0;
      border-radius:0;
      overflow:hidden;
      transition:max-height .3s ease, opacity .3s ease;
      pointer-events:none;
      flex:0 0 auto;
      background:#fff;
    }
    .dp-seo-panel.visible,
    .dp-preview-panel.visible {
      max-height:min(62vh, 560px);
      opacity:1;
      pointer-events:auto;
      overflow-y:auto;
      overflow-x:hidden;
    }
    .dp-seo-inner { padding:8px 12px; }
    .dp-preview-inner { padding:12px 14px; }
    .dp-seo-head,
    .dp-preview-head { display:flex; align-items:center; justify-content:space-between; gap:10px; margin-bottom:10px; }
    .dp-seo-head { margin-bottom:6px; }
    .dp-seo-head-right { display:flex; align-items:center; justify-content:flex-end; gap:10px; margin-left:auto; min-width:0; }
    .dp-seo-title,
    .dp-preview-title { font-size:11px; font-weight:900; color:var(--text-3); text-transform:uppercase; letter-spacing:.07em; }
    .dp-seo-score-pill { display:inline-flex; align-items:center; justify-content:center; min-width:42px; height:22px; padding:0 9px; border-radius:999px; background:#eef2ff; color:var(--accent); font-size:12px; font-weight:900; border:1px solid #dbeafe; }
    .dp-seo-score-pill.strong { background:#ecfdf5; color:#047857; border-color:#bbf7d0; }
    .dp-seo-score-pill.usable { background:#fffbeb; color:#b45309; border-color:#fde68a; }
    .dp-seo-score-pill.needs-work { background:#fef2f2; color:#dc2626; border-color:#fecaca; }
    .dp-seo-strip { display:flex; align-items:center; flex-wrap:wrap; gap:6px; }
    .dp-seo-chip { display:inline-flex; align-items:center; gap:4px; min-height:22px; padding:3px 8px; border:1px solid #e5e7eb; border-radius:999px; background:#f8fafc; color:#334155; font-size:11px; font-weight:800; line-height:1; }
    .dp-seo-chip b { color:#0f172a; font-weight:900; }
    .dp-seo-head-status { margin-left:auto; color:#047857; font-size:11px; font-weight:800; white-space:nowrap; }
    .dp-seo-warnings { display:flex; flex-direction:column; gap:4px; margin-top:6px; }
    .dp-seo-warning { padding:5px 7px; border-radius:6px; background:#fff7ed; border:1px solid #fed7aa; color:#9a3412; font-size:11px; font-weight:700; line-height:1.25; }
    .dp-seo-warning.good { background:#ecfdf5; border-color:#bbf7d0; color:#047857; }
    .dp-seo-dims { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:6px; margin-top:8px; }
    .dp-seo-dim { min-width:0; padding:7px 8px; border:1px solid #e5e7eb; border-radius:7px; background:#f8fafc; }
    .dp-seo-dim-top { display:flex; align-items:center; justify-content:space-between; gap:8px; margin-bottom:5px; font-size:10px; font-weight:900; color:#334155; text-transform:uppercase; letter-spacing:.04em; }
    .dp-seo-dim-score { color:#0f172a; font-size:11px; letter-spacing:0; }
    .dp-seo-dim-track { height:4px; border-radius:999px; background:#e2e8f0; overflow:hidden; }
    .dp-seo-dim-fill { height:100%; border-radius:999px; background:linear-gradient(135deg,var(--accent-mid),var(--teal)); }
    .dp-seo-method { margin-top:7px; color:#64748b; font-size:10px; font-weight:700; line-height:1.35; }
    .dp-preview-card { border:1px solid #e5e7eb; border-radius:10px; background:#fff; padding:16px; color:#0f172a; }
    .dp-preview-card h1 { margin:0 0 8px; font-family:var(--font-display); font-size:24px; line-height:1.2; color:#0f172a; }
    .dp-preview-meta { color:#64748b; font-size:12px; margin-bottom:12px; }
    .dp-preview-answer { padding:10px 12px; border-left:3px solid #0ea5e9; background:#f0f9ff; border-radius:8px; font-size:13px; line-height:1.55; margin-bottom:12px; }
    .dp-preview-body { font-size:14px; line-height:1.65; }
    .dp-preview-body p { margin:0 0 10px; }
    .dp-preview-body h2 { font-size:18px; margin:16px 0 8px; }
    .dp-preview-body h3 { font-size:15px; margin:14px 0 7px; }
    .dp-preview-sources { margin-top:14px; padding-top:12px; border-top:1px solid #e5e7eb; }
    .dp-preview-sources-title { font-size:12px; font-weight:900; color:#334155; margin-bottom:6px; }
    .dp-preview-source { display:block; color:#0369a1; font-size:12px; line-height:1.45; text-decoration:none; overflow-wrap:anywhere; margin-bottom:4px; }
    .dp-preview-empty { padding:14px; border:1px dashed #cbd5e1; border-radius:8px; color:#64748b; font-size:12px; background:#f8fafc; }
    .dp-cc { font-size: 11px; color: var(--text-3); white-space:nowrap; }
    .dp-cc.warn { color: #d97706; }
    .dp-cc.over { color: var(--red); font-weight: 700; }
    .dp-thread-banner { display: none; align-items: center; gap: 5px; font-size: 11px; color: var(--red); font-weight: 700; }
    .dp-thread-banner.show { display: flex; }

    /* ── Cite tray ── */
    .cite-list { min-width:0; display: flex; flex-direction: column; gap: 5px; overflow-x:hidden; }
    .cite-item { min-width:0; display: flex; align-items: center; gap: 8px; padding: 6px 8px; background: var(--white); border: 1px solid var(--border); border-radius: 7px; }
    .cite-item-body { flex: 1; min-width: 0; }
    .cite-item-title { font-size: 12px; font-weight: 600; color: var(--ink); line-height: 1.4; margin-bottom: 2px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
    .cite-item-meta { font-size: 10px; color: var(--text-3); }
    .cite-btn { flex-shrink: 0; padding: 4px 10px; border-radius: 6px; border: 1.5px solid var(--accent); background: var(--accent-lt); color: var(--accent); font-size: 11px; font-weight: 700; cursor: pointer; font-family: var(--font-body); white-space: nowrap; transition: all .15s; }
    .cite-btn:hover { background: var(--accent); color: #fff; }
    .cite-btn.secondary { border-color: var(--gray-200); background: var(--white); color: var(--ink); }
    .cite-btn.secondary:hover { background: var(--gray-50); color: var(--ink); }
    .cite-empty { font-size: 12px; color: var(--text-3); text-align: center; padding: 12px 0; }
    .cite-loading { font-size: 12px; color: var(--text-3); text-align: center; padding: 12px 0; }
    .source-section-title { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:6px 10px; margin:6px 0 5px; font-size:10px; font-weight:800; color:var(--text-3); letter-spacing:.07em; text-transform:uppercase; }
    .source-count { font-size:10px; font-weight:700; color:var(--accent); text-transform:none; letter-spacing:0; }
    .source-chip-row { display:flex; flex-wrap:wrap; gap:5px; margin:0 0 6px; }
    .source-chip { display:inline-flex; align-items:center; gap:6px; max-width:100%; padding:4px 8px; border-radius:999px; border:1px solid var(--border); background:var(--white); color:var(--ink); font-size:11px; font-weight:700; }
    .source-chip span { max-width:170px; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; }
    .source-chip button { border:0; background:transparent; color:var(--text-3); cursor:pointer; padding:0; font-size:12px; line-height:1; }
    .source-library { display:flex; flex-direction:column; gap:6px; margin-bottom:8px; }
    .source-import-row { display:flex; align-items:center; gap:6px; }
    .source-import-input { flex:1; min-width:0; height:30px; box-sizing:border-box; padding:6px 9px; border:1px solid #bfdbfe; border-radius:7px; background:#fff; color:#0f172a; font-family:var(--font-body); font-size:12px; outline:none; }
    .source-import-input:focus { border-color:var(--accent); box-shadow:0 0 0 3px rgba(91,124,255,.12); }
    .source-import-btn { height:30px; padding:0 11px; border-radius:7px; border:1.5px solid var(--accent); background:var(--accent-lt); color:var(--accent); font-family:var(--font-body); font-size:11px; font-weight:800; cursor:pointer; white-space:nowrap; }
    .source-import-btn:hover { background:var(--accent); color:#fff; }
    .source-import-btn:disabled { opacity:.55; cursor:not-allowed; }
    .source-library-list { display:flex; flex-direction:column; gap:5px; max-height:180px; overflow-y:auto; overflow-x:hidden; padding-right:2px; }
    .source-library-row { min-width:0; display:grid; grid-template-columns:minmax(0,1fr) max-content; gap:8px; align-items:center; padding:7px 8px; border:1px solid var(--border); border-radius:8px; background:#fff; }
    .source-library-main { min-width:0; display:flex; flex-direction:column; gap:2px; }
    .source-library-title { font-size:12px; font-weight:800; color:var(--ink); line-height:1.25; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
    .source-library-meta { font-size:10px; color:var(--text-3); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
    .source-library-actions { min-width:0; display:flex; align-items:center; justify-content:flex-end; flex-wrap:wrap; gap:5px; }
    .source-mini-btn { height:24px; padding:0 8px; border-radius:6px; border:1px solid #dbeafe; background:#f8fbff; color:#1e40af; font-family:var(--font-body); font-size:10px; font-weight:800; cursor:pointer; }
    .source-mini-btn:hover { background:#dbeafe; }
    .source-mini-btn.danger { border-color:#fecaca; background:#fff5f5; color:#dc2626; }
    .source-mini-btn.danger:hover { background:#fee2e2; }
    .source-library-empty { padding:7px 0; color:var(--text-3); font-size:12px; }

    /* ── AI pills ── */
    .dp-ai-tb-label { font-size: 10px; font-weight: 700; color: var(--gray-400); text-transform: uppercase; letter-spacing: .07em; margin-bottom: 6px; display: flex; align-items: center; gap: 5px; }
    .dp-ai-pills { display: flex; flex-wrap: wrap; gap: 5px; margin-bottom: 0; }
    #dpVoicePills { display:flex; flex-wrap:wrap; gap:5px; }
    #dpPresetPills { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 5px; }
    .dp-ai-pill { font-size: 11px; font-weight: 600; min-height:24px; padding: 4px 10px; border: 1.5px solid var(--gray-200, #e0e0de); background: var(--white); color: var(--gray-600, #5c5c58); cursor: pointer; transition: all .15s; white-space: nowrap; font-family: var(--font-body); display: flex; align-items: center; justify-content:center; gap: 4px; overflow:hidden; text-overflow:ellipsis; }
    .dp-ai-pill.agent-pill { border-radius: 7px; }
    .dp-ai-pill.fmt-pill { border-radius: 100px; }
    .dp-ai-pill:hover { border-color: var(--gray-400, #9b9b97); color: var(--ink); background: var(--gray-50); }
    .dp-ai-pill.agent-pill.sel { border-color: var(--accent); background: var(--accent-lt); color: var(--accent); font-weight: 700; }
    .dp-ai-pill.agent-pill:disabled { opacity: 0.35; cursor: not-allowed; pointer-events: none; }
    .dp-ai-pill.fmt-pill.sel { border-color: #0d9488; background: #ccfbf1; color: #0d9488; }
    .dp-ai-pill.tpl-pill.sel { border-color: #8B5CF6; background: rgba(139,92,246,0.1); color: #8B5CF6; font-weight: 700; }
    .dp-url-row { display: none; margin-top: 8px; }
    .dp-url-row.show { display: block; }
    .dp-url-input { width: 100%; box-sizing: border-box; padding: 8px 10px; border: 1.5px solid var(--border); border-radius: 8px; background: var(--white); color: var(--ink); font-family: var(--font-body); font-size: 12px; outline: none; }
    .dp-url-input:focus { border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-lt); }
    .dp-compact-select {
      width: 100%;
      max-width: 100%;
      min-width: 0;
      min-height: 32px;
      padding: 6px 30px 6px 10px;
      border: 1.5px solid var(--gray-200, #e0e0de);
      border-radius: 8px;
      background: var(--white);
      color: var(--ink);
      font-family: var(--font-body);
      font-size: 12px;
      font-weight: 700;
      outline: none;
      cursor: pointer;
      appearance: auto;
    }
    .dp-compact-select:focus { border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-lt); }
    .dp-compact-select:disabled { opacity: .58; cursor: not-allowed; background: #f8fafc; color: var(--text-3); }
    #dpAgentSelect { width: 132px; }
    #dpFormatSelect { width: 132px; }
    #dpVoiceSelect { width: 100%; }
    .dp-select-row { display:block; }
    .dp-ai-run-btn { width: auto; min-height:32px; display: inline-flex; padding: 7px 16px; border-radius: 100px; background: linear-gradient(135deg,var(--accent-mid),var(--teal)); color: #fff; border: none; font-size: 11px; font-weight: 800; cursor: pointer; align-items: center; justify-content: center; gap: 6px; transition: opacity .15s; font-family: var(--font-body); box-shadow:0 8px 18px rgba(91,124,255,.18); white-space:nowrap; }
    .dp-ai-run-btn:hover { opacity: .88; }
    .dp-ai-run-btn.loading { opacity: .6; pointer-events: none; }
    .dp-ai-run-btn.loading svg { animation: spin .8s linear infinite; }
    .dp-agent-grid { display: flex; align-items: flex-end; flex-wrap: wrap; gap: 10px 14px; }
    .dp-agent-group { flex: 0 0 auto; min-width: 0; }
    .dp-agent-group.voice-group { flex: 1 1 220px; max-width: 360px; }
    .dp-agent-group .dp-ai-tb-label { margin-bottom: 5px; }
    .dp-agent-grid .dp-url-row { flex: 1 0 100%; margin-top: 0; }
    .dp-agent-actions { flex: 0 0 auto; display: flex; justify-content: flex-start; align-self:flex-end; }
    .dp-agent-actions .dp-ai-run-btn { margin-top: 0; }
    @media (max-width: 780px) {
      .dp-enhance-panel { grid-template-columns:1fr; }
      .dp-enhance-compare { grid-template-columns:1fr; }
      .dp-enhance-quality { grid-template-columns:repeat(2,minmax(0,1fr)); }
      .dp-enhance-actions { flex-direction:row; flex-wrap:nowrap; }
      .dp-enhance-note-actions { justify-content:flex-end; }
      .dp-enhance-secondary { flex:1 1 auto; }
    }
    .dp-ai-progress { flex: 1 0 100%; display: none; margin-top: 2px; padding: 9px 10px; border: 1px solid var(--border); border-radius: 10px; background: rgba(255,255,255,.72); }
    .dp-ai-progress.show { display: block; }
    .dp-ai-progress-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 7px; font-size: 11px; font-weight: 800; color: var(--ink); }
    .dp-ai-progress-meta { display: flex; align-items: center; justify-content: flex-end; gap: 8px; min-width: 0; }
    .dp-ai-progress-status { color: var(--accent); white-space: nowrap; }
    .dp-ai-progress-status.is-generating-pulse {
      animation: dp-generate-text-pulse 1.1s ease-in-out infinite;
    }
    .dp-ai-score { display: none; padding: 2px 7px; border-radius: 999px; background: #eef2ff; color: var(--accent); border: 1px solid var(--border); white-space: nowrap; }
    .dp-ai-score.show { display: inline-flex; }
    .dp-ai-score.warn { background: #fffbeb; border-color: #fcd34d; color: #b45309; }
    .dp-ai-progress-track { height: 6px; border-radius: 999px; background: var(--gray-100, #eef2ff); overflow: hidden; }
    .dp-ai-progress-fill { width: 0%; height: 100%; border-radius: inherit; background: linear-gradient(135deg,var(--accent-mid),var(--teal)); transition: width .24s ease; }
    .dp-ai-progress-steps { display: grid; grid-template-columns: repeat(var(--dp-ai-step-count, 5), minmax(0, 1fr)); gap: 6px; margin-top: 8px; }
    .dp-ai-step { display: flex; align-items: center; gap: 5px; min-width: 0; color: var(--text-3); font-size: 10px; font-weight: 700; white-space: nowrap; }
    .dp-ai-step-dot { width: 13px; height: 13px; flex: 0 0 13px; border-radius: 50%; background: var(--gray-200); display: inline-flex; align-items: center; justify-content: center; color: #fff; font-size: 9px; font-weight: 900; line-height: 1; }
    .dp-ai-step.active { color: var(--accent); }
    .dp-ai-step.active .dp-ai-step-dot { background: var(--accent); box-shadow: 0 0 0 3px var(--accent-lt); }
    #dpAiProgress .dp-ai-step[data-step="generate"].active {
      animation: dp-generate-text-pulse 1.1s ease-in-out infinite;
    }
    #dpAiProgress .dp-ai-step[data-step="generate"].active .dp-ai-step-dot {
      animation: dp-generate-dot-pulse 1.1s ease-in-out infinite;
    }
    body.composer-create-autogen .dp-tray {
      display:none !important;
    }
    @keyframes dp-generate-text-pulse {
      0%, 100% { opacity: 1; }
      50% { opacity: .58; }
    }
    @keyframes dp-generate-dot-pulse {
      0%, 100% { box-shadow:0 0 0 3px var(--accent-lt); transform:scale(1); }
      50% { box-shadow:0 0 0 7px rgba(91,71,255,.14); transform:scale(1.08); }
    }
    .dp-ai-step.done { color: var(--ink); }
    .dp-ai-step.done .dp-ai-step-dot { background: #0d9488; }
    .dp-ai-step.done .dp-ai-step-dot::after { content: "\2713"; }
    .dp-ai-step.warn { color: #b45309; }
    .dp-ai-step.warn .dp-ai-step-dot { background: #f59e0b; }
    .dp-ai-step.error { color: var(--red); }
    .dp-ai-step.error .dp-ai-step-dot { background: var(--red); }
    .dp-info { position: relative; display: inline-flex; align-items: center; justify-content: center; width: 16px; height: 16px; border: 1px solid var(--gray-200); border-radius: 50%; background: var(--white); color: var(--gray-400); font-size: 10px; font-weight: 800; line-height: 1; cursor: help; padding: 0; font-family: var(--font-body); }
    .dp-info:hover, .dp-info:focus-visible { color: var(--accent); border-color: var(--accent); outline: none; }
    .dp-info-pop { position: absolute; left: 50%; top: calc(100% + 7px); transform: translateX(-50%); width: 260px; padding: 9px 10px; border: 1px solid var(--gray-200); border-radius: 8px; background: var(--white); box-shadow: 0 12px 30px rgba(17,24,39,.12); color: var(--gray-600); font-size: 11px; font-weight: 500; line-height: 1.45; letter-spacing: 0; text-transform: none; text-align: left; opacity: 0; pointer-events: none; z-index: 20; transition: opacity .12s ease, transform .12s ease; }
    .dp-info-pop b { color: var(--ink); font-weight: 800; }
    .dp-info:hover .dp-info-pop, .dp-info:focus-visible .dp-info-pop { opacity: 1; transform: translateX(-50%) translateY(2px); }
    .dp-agent-group:last-child .dp-info-pop { left: auto; right: 0; transform: none; }
    .dp-agent-group:last-child .dp-info:hover .dp-info-pop, .dp-agent-group:last-child .dp-info:focus-visible .dp-info-pop { transform: translateY(2px); }
    @keyframes spin { to { transform: rotate(360deg); } }

    /* ── Platform + voice pills ── */
    .dp-plat-pills { display: flex; gap: 6px; flex-wrap: wrap; }
    .dp-plat-pill { font-size: 12px; font-weight: 600; padding: 5px 12px; border-radius: 100px; border: 1.5px solid var(--border); background: var(--white); color: var(--text-3); cursor: pointer; transition: all .15s; }
    .dp-plat-pill.sel { border-color: var(--accent); background: var(--accent-lt); color: var(--accent); }
    .dp-plat-pill:hover:not(.sel):not(.disabled) { border-color: var(--accent); color: var(--accent); }
    .dp-plat-pill.disabled { opacity: .4; cursor: not-allowed; pointer-events: none; }

    /* ── Schedule date/slots ── */
    .dp-datetime { width: auto; box-sizing: border-box; padding: 7px 10px; border: 1.5px solid var(--border); border-radius: var(--radius-md); font-family: var(--font-body); font-size: 12px; color: var(--ink); outline: none; transition: border-color .15s; background: var(--white); }
    .dp-datetime:focus { border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-lt); }
    #dpDateSection { padding: 8px 10px; }
    .dp-schedule-row { display:flex; align-items:flex-end; gap:10px; flex-wrap:wrap; }
    .dp-schedule-date { display:flex; flex-direction:column; gap:4px; flex:0 0 auto; }
    #dpDateSection .dp-label { font-size: 9px; margin-bottom: 0; line-height:1; }
    #dpDateSection .dp-datetime { width:150px; min-height: 30px; padding: 5px 9px; border-radius: 8px; font-size: 12px; }
    .dp-slot-field { display:flex; flex-direction:column; gap:5px; min-width:0; flex:1 1 360px; }
    .dp-slot-pills { display:flex; align-items:center; flex-wrap:wrap; gap:6px; margin-top:0; }
    .dp-slot-pill { display: inline-flex; align-items: center; justify-content: center; gap:5px; min-height: 30px; padding: 5px 10px; border: 1.5px solid var(--border); border-radius: 999px; background: var(--white); cursor: pointer; font-family: var(--font-body); transition: all .15s; white-space:nowrap; }
    .dp-slot-pill:hover { border-color: var(--accent); background: var(--accent-lt); }
    .dp-slot-pill.active { border-color: var(--accent); background: var(--accent-lt); }
    .dp-slot-time { font-size: 11px; line-height: 1; font-weight: 800; color: var(--accent); }
    .dp-slot-label { font-size: 10px; line-height: 1; color: var(--text-3); margin-top: 0; }

    /* ── Media upload ── */
    .dp-media-section { padding: 7px 10px; }
    .dp-media-row { display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
    .dp-media-head { display:flex; align-items:center; gap:8px; min-width:0; flex:0 0 auto; }
    .dp-media-section .dp-label { margin-bottom: 0; font-size:9px; line-height:1; flex:0 0 auto; }
    .dp-media-drop { display:flex; align-items:center; justify-content:center; gap:8px; min-height:30px; border: 1.5px dashed var(--gray-200); border-radius: 999px; padding: 4px 12px; text-align: center; cursor: pointer; transition: all .15s; background: var(--white); position: relative; flex:0 0 auto; }
    .dp-media-drop:hover, .dp-media-drop.drag-over { border-color: var(--accent); background: var(--accent-lt); }
    .dp-media-drop input[type=file] { position: absolute; inset: 0; opacity: 0; cursor: pointer; width: 100%; height: 100%; }
    .dp-media-drop-icon { display:none; }
    .dp-media-drop-txt { font-size: 11px; color: var(--gray-400); line-height:1; }
    .dp-media-drop-txt strong { color: var(--accent); }
    .dp-media-preview { display: none; position: relative; border-radius: var(--radius-md); overflow: hidden; background: #000; }
    .dp-media-preview.show { display: block; flex:0 0 auto; }
    .dp-media-preview img, .dp-media-preview video { width: auto; max-width:160px; max-height: 44px; object-fit: contain; display: block; }
    .dp-media-thumb { position:absolute; top:5px; right:5px; height:22px; padding:0 8px; border:0; border-radius:999px; background:rgba(91,71,255,.92); color:#fff; font-family:var(--font-body); font-size:10px; font-weight:900; cursor:pointer; line-height:1; }
    .dp-media-thumb:hover { background:var(--accent); }
    .dp-media-remove { position:absolute; top:5px; left:5px; width:22px; height:22px; border:0; border-radius:999px; background:rgba(15,23,42,.78); color:#fff; font-family:var(--font-body); font-size:14px; font-weight:900; line-height:1; cursor:pointer; display:inline-flex; align-items:center; justify-content:center; }
    .dp-media-remove:hover { background:#dc2626; }
    .dp-media-uploading { font-size: 11px; color: var(--accent); text-align: center; padding: 0; display: none; }
    .dp-media-uploading.show { display: block; }

    /* ── Inline image picker ── */
    .ip-wrap { margin-top: 0; display:contents; }
    .ip-tabs { display: inline-flex; gap:4px; border-bottom:0; margin-bottom: 0; padding:2px; border:1px solid var(--border); border-radius:999px; background:var(--white); }
    .ip-tab { flex: 0 0 auto; padding: 4px 10px; background: none; border: none; border-radius:999px; font-family: var(--font-body); font-size: 10px; font-weight: 800; color: var(--gray-400); cursor: pointer; transition: all .15s; }
    .ip-tab.active { color: var(--accent); background: var(--accent-lt); }
    .ip-pane { padding-top: 0; min-width:0; flex:1 1 100%; width:100%; }
    .ip-gen-bar { display: flex; align-items: center; justify-content: flex-start; gap:8px; margin-bottom: 0; }
    .ip-gen-hint { font-size: 10px; color: var(--gray-400); }
    .ip-gen-btn { display: inline-flex; align-items: center; gap: 5px; padding: 4px 10px; border-radius: 999px; border: 1.5px solid var(--gray-200); background: transparent; font-family: var(--font-body); font-size: 10px; font-weight: 800; color: var(--gray-600); cursor: pointer; transition: all .18s; }
    .ip-gen-btn:hover:not(:disabled) { background: var(--accent-lt); color: var(--accent); border-color: var(--accent); }
    .ip-gen-btn:disabled { opacity: .55; cursor: not-allowed; }
    .ip-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; margin-top:6px; width:100%; }
    .ip-gen-result { margin-top: 0; display:inline-flex; vertical-align:middle; }
    .ip-gen-result .ip-cell { aspect-ratio: 16/9; width: min(180px, 100%); }
    .ip-generated-choice { display:inline-flex; flex-direction:column; gap:6px; align-items:flex-start; margin-top:6px; max-width:220px; position:relative; }
    .ip-generated-choice .ip-cell,
    .ip-generated-choice .ip-vid-cell { width: min(220px, 100%); cursor:default; }
    .ip-generated-choice .ip-cell:hover,
    .ip-generated-choice .ip-vid-cell:hover { transform:none; }
    .ip-generated-actions { position:absolute; top:6px; right:6px; z-index:4; display:flex; gap:5px; flex-wrap:nowrap; }
    .ip-generated-actions button { width:28px; height:28px; padding:0; border:1px solid rgba(255,255,255,.65); border-radius:999px; background:rgba(15,23,42,.82); color:#fff; font-family:var(--font-body); font-size:0; font-weight:900; cursor:pointer; display:inline-flex; align-items:center; justify-content:center; box-shadow:0 8px 18px rgba(15,23,42,.22); }
    .ip-generated-actions button:hover { background:var(--accent); border-color:rgba(255,255,255,.88); color:#fff; }
    .ip-generated-actions button svg { width:15px; height:15px; display:block; }
    .ip-cell { aspect-ratio: 16/9; border-radius: 6px; overflow: hidden; cursor: pointer; border: 2px solid transparent; transition: all .2s; background: var(--gray-100); display: flex; align-items: center; justify-content: center; }
    .ip-cell:hover { border-color: var(--accent); transform: scale(1.02); box-shadow: 0 4px 14px rgba(91,71,255,.2); }
    .ip-cell img { width: 100%; height: 100%; object-fit: cover; display: block; }
    .ip-cell .ip-spin { font-size: 16px; opacity: .35; animation: ip-spin .9s linear infinite; }
    @keyframes ip-spin { to { transform: rotate(360deg); } }
    .ip-status { font-size: 10px; color: var(--gray-400); text-align: left; padding: 0; grid-column: span 2; line-height: 1.2; }
    .ip-credit { grid-column: span 2; font-size: 10px; color: var(--gray-400); padding-top: 4px; }
    .ip-credit a { color: var(--gray-400); text-decoration: none; }
    .dp-media-url-row { display:grid; grid-template-columns:minmax(160px,1fr) 94px minmax(120px,.7fr) auto; gap:6px; align-items:center; width:100%; }
    .dp-media-url-row input,
    .dp-media-url-row select { height:30px; min-width:0; border:1px solid #bfdbfe; border-radius:7px; background:#fff; color:#0f172a; font-family:var(--font-body); font-size:12px; padding:0 9px; outline:none; }
    .dp-media-url-row input:focus,
    .dp-media-url-row select:focus { border-color:var(--accent); box-shadow:0 0 0 3px rgba(91,124,255,.12); }
    .dp-media-url-row button,
    .dp-media-card-actions button { height:30px; padding:0 10px; border:1.5px solid var(--accent); border-radius:7px; background:var(--accent-lt); color:var(--accent); font-family:var(--font-body); font-size:11px; font-weight:800; cursor:pointer; white-space:nowrap; }
    .dp-media-url-row button:hover,
    .dp-media-card-actions button:hover { background:var(--accent); color:#fff; }
    .dp-media-prompt-row { display:grid; grid-template-columns:minmax(220px,1fr) 150px auto; gap:6px; align-items:start; width:100%; }
    .dp-media-prompt-row textarea,
    .dp-media-prompt-row select { min-width:0; border:1px solid #bfdbfe; border-radius:7px; background:#fff; color:#0f172a; font-family:var(--font-body); font-size:12px; padding:8px 9px; outline:none; }
    .dp-media-prompt-row textarea { height:58px; resize:vertical; line-height:1.35; }
    .dp-media-prompt-row select,
    .dp-media-prompt-row button { height:34px; }
    .dp-media-prompt-row textarea:focus,
    .dp-media-prompt-row select:focus { border-color:var(--accent); box-shadow:0 0 0 3px rgba(91,124,255,.12); }
    .dp-media-prompt-row button { padding:0 12px; border:1.5px solid var(--accent); border-radius:7px; background:var(--accent); color:#fff; font-family:var(--font-body); font-size:11px; font-weight:900; cursor:pointer; white-space:nowrap; }
    .dp-media-prompt-row button:hover:not(:disabled) { background:#4d39e8; }
    .dp-media-prompt-row button:disabled { opacity:.55; cursor:not-allowed; }
    .dp-media-library-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:7px; width:100%; margin-top:6px; }
    .dp-media-card { position:relative; min-width:0; aspect-ratio:16/9; border-radius:7px; overflow:hidden; background:#0f172a; border:1.5px solid transparent; cursor:pointer; }
    .dp-media-card:hover { border-color:var(--accent); box-shadow:0 4px 14px rgba(91,71,255,.18); }
    .dp-media-card img,
    .dp-media-card video { width:100%; height:100%; object-fit:cover; display:block; }
    .dp-media-card-meta { position:absolute; left:0; right:0; bottom:0; padding:14px 6px 5px; color:#fff; font-size:10px; font-weight:800; background:linear-gradient(transparent,rgba(0,0,0,.72)); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
    .dp-media-card-source { opacity:.82; font-size:9px; font-weight:700; }
    .dp-media-card-thumb { position:absolute; top:5px; right:5px; height:20px; padding:0 7px; border:0; border-radius:999px; background:rgba(91,71,255,.92); color:#fff; font-family:var(--font-body); font-size:9px; font-weight:900; cursor:pointer; line-height:1; }
    .dp-media-card-thumb:hover { background:var(--accent); }
    .dp-media-card-delete { position:absolute; top:5px; left:5px; width:20px; height:20px; border:0; border-radius:999px; background:rgba(15,23,42,.78); color:#fff; font-family:var(--font-body); font-size:13px; font-weight:900; line-height:1; cursor:pointer; display:inline-flex; align-items:center; justify-content:center; }
    .dp-media-card-delete:hover { background:#dc2626; }
    .dp-media-card-actions { display:flex; gap:6px; align-items:center; margin-top:6px; }
    .dp-media-muted { font-size:10px; color:var(--gray-400); line-height:1.3; }
    .dp-media-library-head { width:100%; display:flex; align-items:center; justify-content:space-between; gap:10px; margin:4px 0 2px; }
    .dp-media-library-title { font-size:10px; font-weight:900; color:var(--gray-500); text-transform:uppercase; letter-spacing:.06em; }
    .dp-media-create-link { height:30px; display:inline-flex; align-items:center; justify-content:center; padding:0 11px; border-radius:999px; border:1.5px solid var(--accent); background:var(--accent-lt); color:var(--accent); font-family:var(--font-body); font-size:11px; font-weight:900; text-decoration:none; white-space:nowrap; }
    .dp-media-create-link:hover { background:var(--accent); color:#fff; }
    .ip-vid-cell { aspect-ratio: 16/9; border-radius: 6px; overflow: hidden; cursor: pointer; border: 2px solid transparent; transition: all .2s; background: #000; position: relative; display: flex; align-items: center; justify-content: center; }
    .ip-vid-cell:hover { border-color: var(--accent); transform: scale(1.02); box-shadow: 0 4px 14px rgba(91,71,255,.2); }
    .ip-vid-cell video { width: 100%; height: 100%; object-fit: cover; display: block; }
    .ip-vid-overlay { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; font-size: 22px; color: rgba(255,255,255,.85); pointer-events: none; transition: opacity .2s; }
    .ip-vid-progress { display: flex; align-items: center; gap: 8px; grid-column: span 2; padding: 14px 0; color: var(--gray-400); font-size: 11px; }
    .ip-vid-spinner { width: 14px; height: 14px; border: 2px solid var(--gray-100); border-top-color: var(--accent); border-radius: 50%; animation: ip-spin .7s linear infinite; flex-shrink: 0; }

    /* ── Loading / error states ── */
    .composer-loading { display: flex; align-items: center; justify-content: center; min-height: 300px; font-size: 14px; color: var(--gray-400); }
    .composer-error { padding: 40px 24px; text-align: center; }
    .composer-error-title { font-size: 16px; font-weight: 700; color: var(--ink); margin-bottom: 8px; }
    .composer-error-sub { font-size: 13px; color: var(--gray-400); line-height: 1.6; }

    @media (max-width: 700px) {
      .page-body { padding: 16px; }
      body.composer-has-content .content-editor-card.tool-panel-open .dp-ta,
      body.composer-has-content .content-editor-card.tool-panel-open .dp-rich-editor {
        flex:1 1 0;
        min-height:0;
        height:auto;
      }
      #dpTrayCite.open,
      .dp-blocks-panel.visible { max-height:min(68vh, 620px); }
      .dp-media-url-row { grid-template-columns:1fr; }
      .dp-media-prompt-row { grid-template-columns:1fr; }
      .dp-media-library-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
      .source-library-row { grid-template-columns:1fr; align-items:start; }
      .source-library-actions { justify-content:flex-start; }
      .cite-item { align-items:flex-start; flex-wrap:wrap; }
      .cite-item-body { flex-basis:100%; }
      .dp-block-item { flex-wrap:wrap; }
      .dp-agent-grid { align-items: stretch; gap: 8px; }
      .dp-agent-group,
      .dp-agent-group.voice-group,
      .dp-agent-actions { flex: 1 1 100%; max-width: none; }
      .dp-compact-select,
      #dpAgentSelect,
      #dpFormatSelect,
      #dpVoiceSelect { width: 100% !important; }
      .dp-select-row { grid-template-columns: minmax(0,1fr); }
      .dp-ai-progress-steps { grid-template-columns: 1fr; }
    }