:root {
  --bg: #f7f7f4;
  --panel: #ffffff;
  --text: #202522;
  --muted: #6b746f;
  --line: #d9ddd7;
  --accent: #276f68;
  --accent-soft: #e3f1ee;
  --blue: #2c5f83;
  --blue-soft: #e6eef4;
  --pink: #9f5475;
  --pink-soft: #f6e9ef;
  --warning: #8b5e24;
  --warning-soft: #f3ebdd;
  --pod: #7a5bb0;
  --pod-soft: #efe9f7;
  --gold: #a5842f;
  --gold-soft: #f3edda;
  --onboarding: #4f7f57;
  --onboarding-soft: #e8f2e9;
  --yt: #b0453e;
  --yt-soft: #f6e6e4;
  --ig: #b06a8f;
  --ig-soft: #f6e9f0;

  /* Geometrie unique des zones atelier.
     Toute surface atelier consomme ces variables. Ne pas redefinir une
     largeur, un rail ou un gap d'atelier en dur dans une feuille de page:
     c'est ce qui avait produit trois geometries concurrentes (conteneurs
     1680/1760/1280px, rails 30%/380px/300px). */
  --workshop-max-width: 1760px;
  --workshop-padding: 22px 24px;
  --workshop-gap: 16px;
  --workshop-rail-min: 340px;
  --workshop-rail-max: 380px;
  --workshop-collapse: 980px;

  /* Taille unique du corps de texte des zones atelier (T1, 2026-08-14).
     Valeur MESUREE, pas estimee : `node tools/measure-font-size.mjs` donne 15px
     sur le select Statut (.workshop-status-field .workshop-status-select) et sur
     le bouton Historique (.agentic-version-button). Le corps de l'editeur doit
     valoir la meme chose sur TOUTES les zones atelier.
     Avant ce reglage : 16px herite du navigateur sur l'atelier de lancement et
     sur le texte nu de la base de connaissances, 15px seulement sur les <p>.
     Ne jamais redefinir une taille de corps d'editeur atelier dans une feuille
     de page : consommer cette variable. */
  --workshop-editor-font-size: 15px;
  --workshop-editor-line-height: 1.68;
}

/* Final cascade for the compact launch workspace accordion. */
.launch-detail .work-step-block > .work-stage { display: none; }
.launch-detail .work-step-block[open] > .work-stage { display: grid; }
.launch-detail .work-step-heading { grid-template-columns: minmax(0, 1fr) auto 18px; border-bottom: 0; cursor: pointer; }
.launch-detail .work-step-chev,
.launch-detail .work-chev { display: inline-block; }
.launch-detail .work-chantier { overflow: visible; margin-bottom: 12px; border: 0; border-radius: 0; background: transparent; }
.launch-detail .work-chantier-head { grid-template-columns: 24px minmax(0, 1fr) auto 18px; min-height: 36px; padding: 4px 0 7px; cursor: pointer; }
.launch-detail .work-chantier-body,
.launch-detail .work-chantier.is-locked .work-chantier-body { display: none; padding: 0 0 4px; }
.launch-detail .work-chantier[open] > .work-chantier-body { display: grid; }
.launch-detail .work-lot-add { position: static; grid-column: 5; grid-row: 1; align-self: center; width: 24px; height: 24px; line-height: 22px; }
.launch-detail .work-complete-mark { grid-column: 4; justify-self: end; width: 20px; height: 20px; border-radius: 999px; background: var(--accent-soft); color: var(--accent); font-size: 10px; line-height: 20px; text-align: center; }
.launch-detail .work-mini-progress { grid-column: 3; }
.launch-detail .work-count { grid-column: 4; }
.launch-detail .work-zone-dashboard { margin-bottom: 2px; padding-bottom: 9px; }
.launch-detail .work-step-heading { min-height: 44px; padding: 9px 0 5px; }
.launch-detail .work-step-pip { top: 9px; }
.launch-detail .work-stage { padding: 0 0 9px; }
.launch-detail .work-chantier { margin-bottom: 5px; }
.launch-detail .work-step-block.is-complete .work-chantier,
.launch-detail .work-step-block.is-complete .work-chantier[open] { border-color: transparent; background: transparent; }
.launch-detail .work-chantier-head { min-height: 31px; padding-top: 2px; padding-bottom: 4px; }
.launch-detail .work-doc-card { min-height: 38px; padding-top: 8px; padding-bottom: 8px; margin-bottom: 2px; }
.launch-detail .work-task-stack,
.launch-detail .work-done-fold { margin-top: 1px; }
.launch-detail .work-done-fold summary { padding-top: 3px; padding-bottom: 3px; }
.launch-detail .work-step-summary-state,
.launch-detail .work-chantier-state { color: var(--muted); font-size: 11.5px; font-weight: 800; white-space: nowrap; }
.launch-detail .work-step-summary-state:first-letter { text-transform: uppercase; }
.launch-detail .work-chantier-state.done { color: var(--accent); }
.launch-detail .work-step-block.is-complete:not([open]) { padding-bottom: 1px; }
.launch-detail .work-step-block.is-complete:not([open]) .work-step-heading { min-height: 42px; padding-bottom: 8px; }
.launch-detail .work-step-block[open] .work-step-chev::before,
.launch-detail .work-chantier[open] .work-chev::before,
.launch-detail .work-deliverables-index[open] .work-step-chev::before { content: "⌃"; }
.launch-detail .work-step-block:not([open]) .work-step-chev::before,
.launch-detail .work-chantier:not([open]) .work-chev::before,
.launch-detail .work-deliverables-index:not([open]) .work-step-chev::before { content: "⌄"; }

.work-deliverables-index { margin: 18px 0 4px; border: 1px solid var(--line); border-radius: 9px; background: #fff; }
.work-deliverables-index > summary { display: grid; grid-template-columns: 24px minmax(0, 1fr) 18px; gap: 10px; align-items: center; padding: 12px 13px; list-style: none; cursor: pointer; }
.work-deliverables-index > summary::-webkit-details-marker { display: none; }
.work-deliverables-index > summary strong { display: block; font-size: 13px; }
.work-deliverables-index > summary small { display: block; margin-top: 2px; color: var(--muted); font-size: 11px; }
.work-deliverables-heading-icon,
.work-deliverable-icon { display: flex !important; flex: 0 0 auto; align-items: center; justify-content: center; padding: 0; border-radius: 7px; background: var(--accent-soft); color: var(--accent); }
.work-deliverables-heading-icon { width: 24px; height: 24px; }
.work-deliverable-icon { width: 28px; height: 28px; }
.work-deliverables-heading-icon svg { display: block; width: 13px; height: 13px; margin: 0; }
.work-deliverable-icon svg { display: block; flex: 0 0 15px; width: 15px; height: 15px; margin: 0; }
.work-doc-card .work-deliverable-icon { margin-top: 0; overflow: visible; color: var(--accent); }
.work-doc-card .work-deliverable-icon svg { overflow: visible; }
.work-deliverables-index-list { display: grid; gap: 4px; padding: 0 12px 12px; }
.work-deliverables-index-list > a,
.work-deliverables-index-list > div { display: grid; grid-template-columns: 28px minmax(0, 1fr) auto; gap: 10px; align-items: center; padding: 8px 10px; border: 1px solid #e6e8e3; border-radius: 7px; background: #fff; color: inherit; text-decoration: none; }
.work-deliverables-index-list small { display: block; color: var(--muted); font-size: 10px; font-weight: 800; text-transform: uppercase; }
.work-deliverables-index-list strong { display: block; margin-top: 1px; font-size: 12.5px; }
.work-index-done { color: var(--accent); font-size: 10.5px; font-weight: 850; }

@media (max-width: 899px) {
  .launch-detail .work-chantier-head { grid-template-columns: 24px minmax(0, 1fr) auto 18px; }
  .launch-detail .work-mini-progress { display: none; }
  .launch-detail .work-count,
  .launch-detail .work-complete-mark { grid-column: 3; }
  .launch-detail .work-lot-add { grid-column: 4; }
  .launch-detail .work-checks li,
  .launch-detail .work-checks .work-task-row { grid-template-columns: 16px minmax(0, 1fr); }
  .launch-detail .work-task-side { grid-column: 2; grid-template-columns: minmax(0, 1fr) auto; max-width: 280px; }
  .work-deliverables-index { margin-left: 0; }
}

/* Standard workshop surfaces */
.workshop-bar {
  position: sticky;
  top: var(--topbar-height, 0);
  z-index: 30;
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 42px;
  padding: 0 22px;
  border-bottom: 1px solid var(--line);
  border-radius: 12px 12px 0 0;
  background: color-mix(in srgb, var(--bg) 55%, var(--panel));
}

.workshop-bar.stuck { border-radius: 0; box-shadow: 0 2px 8px rgba(32, 37, 34, .06); }
.workshop-bar-mode { display: flex; align-items: center; gap: 9px; color: var(--muted); font-size: 11px; font-weight: 700; letter-spacing: .13em; text-transform: uppercase; white-space: nowrap; }
.workshop-bar-mode b { color: var(--text); font-weight: 700; }
.workshop-bar-mode-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--accent); box-shadow: 0 0 0 3px var(--accent-soft); }
.workshop-bar-steps { position: absolute; left: 50%; display: flex; align-items: center; gap: 5px; transform: translateX(-50%); }
.workshop-bar-step { padding: 3px 10px; border: 0; border-radius: 999px; background: transparent; color: var(--muted); font: inherit; font-size: 11.5px; font-weight: 600; white-space: nowrap; cursor: pointer; }
.workshop-bar-step:hover:not(:disabled) { background: color-mix(in srgb, var(--panel) 70%, var(--bg)); }
.workshop-bar-step.done { color: var(--text); }
.workshop-bar-step.done::before { color: var(--accent); content: "✓ "; font-weight: 700; }
.workshop-bar-step.active { background: var(--accent-soft); color: var(--accent); font-weight: 700; }
.workshop-bar-step:disabled { cursor: default; }
.workshop-bar-step-separator { color: var(--line); font-size: 11px; user-select: none; }
.workshop-bar-steps-compact { display: none; position: absolute; left: 50%; transform: translateX(-50%); }
.workshop-bar-steps-compact > summary { padding: 3px 12px; border-radius: 999px; background: var(--accent-soft); color: var(--accent); cursor: pointer; font-size: 11.5px; font-weight: 700; list-style: none; white-space: nowrap; }
.workshop-bar-steps-compact > div { position: absolute; top: calc(100% + 7px); left: 50%; display: grid; min-width: 210px; padding: 6px; border: 1px solid var(--line); border-radius: 9px; background: var(--panel); box-shadow: 0 8px 20px rgba(32,37,34,.12); transform: translateX(-50%); }
.workshop-bar-steps-compact .workshop-bar-step-separator { display: none; }
.workshop-bar-save { display: inline-flex; align-items: center; justify-content: flex-end; gap: 7px; min-width: 190px; padding: 0; border: 0; background: transparent; color: var(--muted); font: inherit; font-size: 12px; }
.workshop-bar-save-dot { width: 6px; height: 6px; border-radius: 50%; background: var(--accent); }
.workshop-bar-save[data-save-status="saving"] .workshop-bar-save-dot,
.workshop-bar-save[data-save-status="dirty"] .workshop-bar-save-dot { background: var(--warning); animation: workshop-save-pulse 1s infinite; }
.workshop-bar-save[data-save-status="error"] .workshop-bar-save-dot,
.workshop-bar-save[data-save-status="conflict"] .workshop-bar-save-dot { background: var(--warning); }
.workshop-bar-save:not(:disabled) { cursor: pointer; }
@keyframes workshop-save-pulse { 50% { opacity: .35; } }

@media (max-width: 1240px) {
  .workshop-bar-steps { display: none; }
  .workshop-bar-steps-compact { display: block; }
}

@media (max-width: 760px) {
  .workshop-bar { padding: 0 14px; }
  .workshop-bar-mode { letter-spacing: .08em; }
  .workshop-bar-save { min-width: 0; }
  .workshop-bar-save [data-workshop-save-label] { max-width: 106px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
}

.strategy-workflow-gate { display: flex; align-items: center; justify-content: space-between; gap: 18px; margin: 18px 22px 0; padding: 13px 14px; border: 1px solid var(--line); border-radius: 9px; background: var(--accent-soft); }
.strategy-workflow-gate strong { color: var(--accent); font-size: 13px; }
.strategy-workflow-gate p,.strategy-workflow-note { margin: 3px 0 0; color: var(--muted); font-size: 12px; }
.strategy-workflow-brainstorm { margin: 18px 22px 0; border: 1px solid var(--line); border-radius: 9px; background: var(--panel); }
.strategy-workflow-brainstorm > summary { padding: 10px 13px; color: var(--accent); cursor: pointer; font-size: 12px; font-weight: 800; }
.strategy-workflow-brainstorm > .doc-read { max-height: 380px; overflow: auto; padding: 0 14px 14px; }
.strategy-workflow-note { margin: 10px 22px 0; }
@media (max-width: 760px) { .strategy-workflow-gate { align-items: stretch; flex-direction: column; margin-right: 14px; margin-left: 14px; } }

.standard-workshop-head {
  align-items: flex-end;
}

.standard-workshop-head > div:first-child {
  flex: 1 1 min(860px, 100%);
  min-width: 0;
}

.standard-workshop-head .header-actions {
  flex: 0 0 auto;
}

.standard-workshop-head p {
  margin: 0 0 6px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 850;
  letter-spacing: 0.04em;
  line-height: 1.25;
  text-transform: uppercase;
}

/* Le titre Atelier est une propriete editable, pas un grand titre de page. */
.standard-workshop-title-input {
  box-sizing: border-box;
  width: 100%;
  min-width: 0;
  min-height: 40px;
  padding: 9px 11px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  color: var(--text);
  font: inherit;
  font-size: 17px;
  text-transform: none;
  font-weight: 820;
  line-height: 1.2;
  outline: none;
}

.standard-workshop-title-input:focus {
  color: var(--accent);
}

.standard-workshop-role-input {
  width: min(760px, 100%);
  min-width: 0;
  margin-top: 8px;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--muted);
  font: inherit;
  font-size: 14px;
  line-height: 1.45;
  resize: vertical;
  outline: none;
}

.standard-workshop-role-input:focus {
  color: var(--text);
}

.standard-workshop-main {
  min-width: 0;
}

.shell:has(.standard-workshop-frame),
.shell:has([data-standard-workshop-meta]),
.shell:has(.email-layout) {
  width: 100%;
  max-width: var(--workshop-max-width);
  margin-right: auto;
  margin-left: auto;
  padding: var(--workshop-padding);
}

.standard-workshop-frame {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(var(--workshop-rail-min), var(--workshop-rail-max));
  gap: var(--workshop-gap);
  align-items: start;
}

/* Shared add-source panel, inline host (creation modal).
   The rail hides its in-panel mirrors because chips live under the composer.
   An inline host has no composer, so it carries its own chip destination and
   must hide the mirrors the same way; otherwise the two surfaces diverge. */
.workshop-agent-context-menu.has-inline-sources .is-source-panel-mirror,
.workshop-agent-context-menu.has-inline-sources .is-source-panel-mirror[hidden] {
  display: none;
}

.workshop-inline-composer-sources {
  display: grid;
  gap: 7px;
  min-width: 0;
  margin-top: 10px;
}

/* Zone de proprietes d'une zone atelier.
   Le rail est reserve a l'agent: les informations metier de l'objet
   travaille vivent ici, sous la ligne Titre / Statut / Versions. */
.workshop-properties {
  display: grid;
  gap: 10px;
  margin-top: var(--workshop-gap);
}

.workshop-property-field {
  display: grid;
  width: min(320px, 100%);
  gap: 6px;
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
}

.workshop-property-field select {
  width: 100%;
  min-width: 0;
  min-height: 40px;
  padding: 9px 32px 9px 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  color: var(--text);
  font: inherit;
  font-size: 13px;
  font-weight: 650;
  text-transform: none;
}

.workshop-property-field select:focus {
  border-color: #b8c8bd;
  box-shadow: 0 0 0 3px rgba(39, 111, 104, 0.08);
  outline: none;
}

.workshop-properties-block {
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel);
}

.workshop-properties-block > summary {
  padding: 12px 14px;
  color: var(--text);
  font-size: 13px;
  font-weight: 800;
  cursor: pointer;
  list-style: none;
}

.workshop-properties-block > summary::-webkit-details-marker {
  display: none;
}

.workshop-properties-block > summary::after {
  float: right;
  color: var(--muted);
  content: "▾";
  transition: transform 120ms ease;
}

.workshop-properties-block[open] > summary::after {
  transform: rotate(180deg);
}

.workshop-properties-body {
  padding: 0 14px 14px;
}

.workshop-properties-body > h2,
.workshop-properties-body > h3 {
  margin-top: 0;
}

.workshop-inline-composer-sources[hidden] {
  display: none;
}

.standard-workshop-work-area {
  display: grid;
  min-width: 0;
  gap: 16px;
}

.standard-workshop-rail,
.doc-workbench-rail {
  display: grid;
  gap: 14px;
  min-width: 0;
}

.standard-workshop-rail,
.doc-workbench-rail {
  position: sticky;
  top: 18px;
  height: var(--standard-workshop-rail-height, calc(100vh - 36px));
  min-height: min(560px, var(--standard-workshop-rail-height, calc(100vh - 36px)));
  max-height: var(--standard-workshop-rail-height, calc(100vh - 36px));
  overflow: hidden;
  align-self: start;
}

.standard-workshop-rail > .agentic-mission-panel,
.doc-workbench-rail > .agentic-mission-panel,
.standard-workshop-rail > .workbench-agent-panel,
.doc-workbench-rail > .workbench-agent-panel {
  display: flex;
  min-height: 100%;
  flex-direction: column;
}

.initial-request-view { display: grid; gap: 14px; }
.initial-request-token-hero { display: grid; gap: 7px; padding: 16px; border: 1px solid #b7d7d1; border-radius: 8px; background: var(--accent-soft); }
.initial-request-token-hero p, .initial-request-token-hero span { margin: 0; }
.initial-request-token-hero p { font-size: 14px; }
.initial-request-token-hero p strong { font-size: 22px; }
.initial-request-token-hero span { color: var(--muted); font-size: 11.5px; }
.initial-request-token-hero .agentic-gauge { height: 7px; overflow: hidden; border-radius: 999px; background: #dce8e5; }
.initial-request-token-hero .agentic-gauge i { display: block; height: 100%; border-radius: inherit; background: var(--accent); }
.initial-request-meta { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.initial-request-meta article { display: grid; gap: 3px; padding: 10px 12px; border: 1px solid var(--line); border-radius: 8px; background: #fff; }
.initial-request-meta span, .initial-request-prompt > span { color: var(--muted); font-size: 10px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.initial-request-meta strong { overflow-wrap: anywhere; font-size: 12px; }
.initial-request-prompt { display: grid; gap: 7px; }
.initial-request-prompt p { max-height: 260px; margin: 0; overflow: auto; padding: 12px; border: 1px solid var(--line); border-radius: 8px; background: #fafaf8; font-size: 12px; line-height: 1.5; white-space: pre-wrap; }
.initial-request-sources { border-top: 1px solid var(--line); }
.initial-request-sources header { display: flex; justify-content: space-between; padding: 11px 0 8px; font-size: 12px; }
.initial-request-source em { padding: 3px 6px; border-radius: 999px; font-size: 9px; font-style: normal; font-weight: 800; }
.initial-request-source em.loaded { background: var(--accent-soft); color: var(--accent); }

.initial-request-notes {
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #fff;
}

.initial-request-notes header {
  margin-bottom: 8px;
}

.initial-request-notes ul {
  display: grid;
  gap: 6px;
  margin: 0;
  padding-left: 18px;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.45;
}

.initial-request-notes.warning {
  border-color: #ead8ae;
  background: #fffaf0;
}
.initial-request-source em.metadata { background: #f0efec; color: var(--muted); }
@media (max-width: 640px) { .initial-request-meta { grid-template-columns: 1fr; } }

@media (max-width: 980px) {
  .standard-workshop-frame {
    grid-template-columns: minmax(0, 1fr);
  }

  .standard-workshop-rail,
  .doc-workbench-rail {
    position: static;
    height: auto;
    min-height: 0;
    max-height: none;
    overflow: visible;
  }
}

/* Launch deliverable workshop */
.launch-workshop {
  max-width: var(--workshop-max-width);
}

.shell.launch-workshop {
  max-width: var(--workshop-max-width);
}

.button.danger,
.btn.danger {
  border-color: #d9b7b0;
  color: #9d3f33;
}

.button.danger:hover,
.btn.danger:hover {
  border-color: #c98d83;
  background: #fff3f1;
  color: #843226;
}

.launch-workshop-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(var(--workshop-rail-min), var(--workshop-rail-max));
  gap: var(--workshop-gap);
  align-items: start;
}

.launch-workshop-editor,
.launch-workshop-rail .jb-section {
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel);
}

.launch-workshop-toolbar {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 14px;
  align-items: end;
  padding: 14px;
  border-bottom: 1px solid var(--line);
}

.workshop-meta-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(130px, 150px) minmax(132px, auto);
  gap: 12px;
  align-items: end;
  width: 100%;
}

.workshop-meta-grid .email-field {
  margin-bottom: 0;
}

.workshop-activity-field {
  display: grid;
  gap: 11px;
  justify-items: stretch;
}

.workshop-activity-spacer {
  display: block;
  height: 13px;
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
  line-height: 13px;
  text-transform: uppercase;
}

.workshop-activity-button-wrap {
  min-width: 138px;
}

.workshop-title-field,
.workshop-status-field,
.agent-scope,
.ai-model-picker,
.ai-thinking-picker {
  display: grid;
  gap: 6px;
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
}

.workshop-status-field select,
.agent-scope select,
.ai-model-picker select,
.ai-thinking-picker select,
.workshop-agent textarea,
.workshop-editor-text {
  width: 100%;
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  color: var(--text);
  font: inherit;
}

.ai-model-picker small:empty,
.model-note:empty {
  display: none;
}

/* Ne jamais styler le titre atelier via `.workshop-title-field input` : ce
 * selecteur (0,1,1) bat `.standard-workshop-title-input` (0,1,0) et ecrasait
 * silencieusement la taille du titre. C'etait la cause des regressions repetees
 * sur la taille des titres de zone atelier (diagnostic 2026-08-14).
 * Le seul input de ce conteneur EST le titre canonique : styler la classe. */

.workshop-status-field select,
.workshop-status-select,
.agent-scope select,
.ai-model-picker select,
.ai-thinking-picker select {
  min-height: 40px;
  padding: 9px 10px;
  font-size: 13px;
  text-transform: none;
}

.workshop-status-control {
  --workshop-status-color: var(--muted);
  --workshop-status-bg: #fff;
  position: relative;
  display: inline-flex;
  width: 100%;
  min-width: 130px;
  align-items: center;
}

.workshop-status-dot {
  position: absolute;
  left: 13px;
  z-index: 1;
  width: 10px;
  height: 10px;
  border-radius: 999px;
  background: var(--workshop-status-color);
  box-shadow: 0 0 0 3px var(--workshop-status-bg);
  pointer-events: none;
}

.workshop-status-select {
  --workshop-status-color: var(--muted);
  --workshop-status-bg: #fff;
  border-color: color-mix(in srgb, var(--workshop-status-color) 34%, var(--line));
  background: var(--workshop-status-bg);
  color: var(--workshop-status-color);
}

.workshop-status-field .workshop-status-select {
  min-height: 40px;
  min-width: 130px;
  padding: 9px 30px 9px 32px;
  font-size: 15px;
  font-weight: 760;
  line-height: 1.2;
}

body:has(.standard-workshop-rail .agentic-mission-panel) .agent-floating-button {
  display: none;
}

.workshop-status-control[data-workshop-status="in-progress"],
.workshop-status-select[data-workshop-status="in-progress"] {
  --workshop-status-color: #b42318;
  --workshop-status-bg: #fff4f2;
}

.workshop-status-control[data-workshop-status="review"],
.workshop-status-control[data-workshop-status="a-revoir"],
.workshop-status-select[data-workshop-status="review"],
.workshop-status-select[data-workshop-status="a-revoir"] {
  --workshop-status-color: #b45309;
  --workshop-status-bg: #fff7ed;
}

.workshop-status-control[data-workshop-status="done"],
.workshop-status-control[data-workshop-status="valide"],
.workshop-status-select[data-workshop-status="done"],
.workshop-status-select[data-workshop-status="valide"] {
  --workshop-status-color: #15803d;
  --workshop-status-bg: #f0fdf4;
}

.workshop-status-control[data-workshop-status="archived"],
.workshop-status-select[data-workshop-status="archived"] {
  --workshop-status-color: #991b1b;
  --workshop-status-bg: #fef2f2;
}

.launch-workshop-editor .jb-section-body {
  padding: 22px;
}

.workshop-editor-shell {
  display: grid;
}

.workshop-editor-toolbar {
  position: sticky;
  top: 0;
  z-index: 2;
}

.workshop-editor-text {
  min-height: 68vh;
  padding: 18px;
  resize: vertical;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace;
  /* T1 : meme taille de corps que Statut/Historique sur toutes les zones. */
  font-size: var(--workshop-editor-font-size);
  line-height: var(--workshop-editor-line-height);
}

.workshop-rich-editor {
  min-height: 68vh;
  padding: 20px;
  border: 1px solid var(--line);
  border-radius: 0 0 8px 8px;
  background: #fff;
  color: var(--text);
  /* T1 : l'atelier de lancement heritait 16px du navigateur, faute de
     declaration. Mesure : `node tools/measure-font-size.mjs atelier:editeur-riche-reel`. */
  font-size: var(--workshop-editor-font-size);
  line-height: var(--workshop-editor-line-height);
  outline: none;
}

.workshop-rich-editor:focus {
  border-color: #b8c8bd;
  box-shadow: 0 0 0 3px rgba(39, 111, 104, 0.08);
}

.workshop-rich-editor p,
.workshop-rich-editor ul,
.workshop-rich-editor ol,
.workshop-rich-editor blockquote {
  margin: 0 0 14px;
}

.workshop-rich-editor h2,
.workshop-rich-editor h3 {
  margin: 22px 0 10px;
}

.workshop-rich-editor blockquote {
  padding-left: 14px;
  border-left: 3px solid #d5ded8;
  color: var(--muted);
}

.launch-workshop-rail {
  display: grid;
  gap: 14px;
}

.launch-workshop-rail .jb-section-header {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 10px;
  padding: 13px 14px;
  border-bottom: 1px solid var(--line);
}

.launch-workshop-rail .jb-section-header h2 {
  margin: 0;
  font-size: 14px;
}

.launch-workshop-rail .jb-section-header span {
  color: var(--muted);
  font-size: 12px;
}

.launch-workshop-rail .jb-section-body {
  display: grid;
  gap: 10px;
  padding: 14px;
}

.workshop-agent textarea {
  padding: 10px;
  resize: vertical;
  font-size: 13px;
  line-height: 1.45;
}

.workshop-agent-inputs {
  display: grid;
  grid-template-columns: 38px minmax(0, 1fr);
  gap: 10px;
  align-items: center;
}

.workshop-voice-button {
  width: 38px;
  height: 38px;
  border: 1px solid #d6c5bf;
  border-radius: 999px;
  background: #fff;
  color: #a44135;
  font: inherit;
  font-size: 17px;
  cursor: pointer;
}

.workshop-voice-button.recording {
  border-color: #a44135;
  background: #fff3f1;
  color: #843226;
}

.workshop-voice-status {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.workshop-voice-status strong {
  color: var(--text);
  font-size: 13px;
}

.workshop-voice-status span {
  color: var(--muted);
  font-size: 12px;
  line-height: 1.35;
}

.workshop-agent-subsection {
  display: grid;
  gap: 10px;
  padding-top: 12px;
  border-top: 1px solid var(--line);
}

.workshop-agent-subsection-title,
.workshop-history-head,
.workshop-history-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 10px;
  align-items: baseline;
  justify-content: space-between;
}

.workshop-agent-subsection-title strong,
.workshop-history-head strong {
  color: var(--text);
  font-size: 13px;
}

.workshop-agent-subsection-title span,
.workshop-history-head span,
.workshop-history-meta span {
  color: var(--muted);
  font-size: 12px;
}

.workshop-agent-note {
  margin: -2px 0 0;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.35;
}

.workshop-source-row,
.workshop-trace-row,
.agent-patch-card,
.workshop-context-doc,
.workshop-history-card {
  display: grid;
  gap: 4px;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fbfbf8;
}

.workshop-source-row strong,
.workshop-trace-row strong,
.agent-patch-card strong,
.workshop-context-doc strong,
.workshop-history-card strong {
  font-size: 13px;
}

.workshop-source-row span,
.workshop-source-row small,
.workshop-trace-row span,
.workshop-trace-row small,
.agent-patch-card span,
.agent-patch-card p,
.workshop-context-doc small,
.workshop-history-card p,
.workshop-history-card small {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
}

.workshop-context-search {
  width: 100%;
  min-width: 0;
  padding: 9px 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  color: var(--text);
  font: inherit;
  font-size: 13px;
}

.workshop-context-doc.selected {
  border-color: #9fb9ad;
  background: #f2f7f3;
}

.workshop-context-doc label {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 8px;
  align-items: start;
  cursor: pointer;
}

.workshop-context-doc label span {
  display: grid;
  gap: 3px;
}

.workshop-context-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.button.tiny {
  min-height: 26px;
  padding: 0 8px;
  font-size: 11px;
}

.workshop-trace-details summary {
  cursor: pointer;
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
}

.workshop-history-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 6px 10px;
  align-items: center;
  width: 100%;
  padding: 8px 9px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fbfbf8;
  color: inherit;
  cursor: pointer;
  text-align: left;
}

.workshop-history-row:hover {
  border-color: #b8c8bd;
  background: #fff;
}

.workshop-history-row-main {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.workshop-history-row-main strong {
  overflow: hidden;
  color: var(--text);
  font-size: 12.5px;
  font-weight: 800;
  line-height: 1.25;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.workshop-history-row-main span {
  color: var(--muted);
  font-size: 11px;
  line-height: 1.2;
}

.agent-history-user-pill {
  max-width: 132px;
  overflow: hidden;
  padding: 3px 7px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: #fff;
  color: var(--muted);
  font-size: 11px;
  font-weight: 700;
  line-height: 1.2;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.workshop-history-sources {
  display: grid;
  gap: 6px;
  margin-top: 8px;
}

.workshop-history-sources .dashboard-context-card-link { color: inherit; text-decoration: none; }

.workshop-history-sources .dashboard-context-card-link:hover .dashboard-context-card {
  border-color: #b8c8bd;
  background: #f6faf7;
}


.agent-history-backdrop {
  position: fixed;
  inset: 0;
  z-index: 80;
  background: rgba(15, 23, 42, 0.24);
  opacity: 0;
  pointer-events: none;
  transition: opacity .16s ease;
}

.agent-history-modal {
  position: fixed;
  top: 50%;
  left: 50%;
  z-index: 81;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  gap: 0;
  width: min(620px, calc(100vw - 28px));
  max-height: min(760px, calc(100dvh - 48px));
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: #fff;
  box-shadow: 0 24px 70px rgba(20, 26, 24, 0.24);
  opacity: 0;
  pointer-events: none;
  transform: translate(-50%, -48%) scale(.98);
  transition: opacity .16s ease, transform .16s ease;
}

.agent-history-backdrop.open,
.agent-history-modal.open {
  opacity: 1;
  pointer-events: auto;
}

.agent-history-modal.open {
  transform: translate(-50%, -50%) scale(1);
}

.agent-history-modal-head {
  display: flex;
  gap: 12px;
  align-items: flex-start;
  justify-content: space-between;
  padding: 14px 16px;
  border-bottom: 1px solid var(--line);
}

.agent-history-modal-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 8px;
}

.agent-history-modal-head span,
.agent-history-detail-block > span,
.agent-history-fields span {
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0;
  text-transform: uppercase;
}

.agent-history-modal-head h2 {
  margin: 2px 0 0;
  color: var(--text);
  font-size: 17px;
  line-height: 1.25;
}

.agent-history-modal-body {
  display: grid;
  gap: 12px;
  min-height: 0;
  overflow-y: auto;
  overscroll-behavior: contain;
  padding: 14px 16px 24px;
  scrollbar-gutter: stable;
}

.agent-history-fields {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.agent-history-fields-secondary {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.agent-history-fields article,
.agent-history-detail-block {
  display: grid;
  gap: 5px;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fbfbf8;
}

.agent-history-fields strong,
.agent-history-detail-block p {
  margin: 0;
  color: var(--text);
  font-size: 12.5px;
  line-height: 1.45;
}

.agent-history-detail-block p {
  white-space: pre-wrap;
}

.agent-history-raw summary {
  cursor: pointer;
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
}

.agent-history-raw pre {
  max-height: 280px;
  overflow: auto;
  margin: 8px 0 0;
  padding: 10px;
  border-radius: 7px;
  background: #f4f5f1;
  color: var(--text);
  font-size: 11.5px;
  line-height: 1.45;
  white-space: pre-wrap;
  word-break: break-word;
}

@media (max-width: 680px) {
  .agent-history-modal {
    width: calc(100vw - 20px);
    max-height: calc(100dvh - 32px);
  }

  .agent-history-fields {
    grid-template-columns: 1fr;
  }

  .agent-history-user-pill {
    max-width: 96px;
  }
}

.workshop-trace-compact {
  display: grid;
  gap: 8px;
  margin-top: 10px;
}

.agent-patch-card pre {
  overflow: auto;
  max-height: 180px;
  margin: 4px 0;
  padding: 10px;
  border-radius: 8px;
  background: #f1f3ef;
  color: var(--text);
  white-space: pre-wrap;
}

.agent-patch-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}

@media (max-width: 980px) {
  .launch-workshop-layout,
  .launch-workshop-toolbar,
  .workshop-meta-grid {
    grid-template-columns: 1fr;
  }

  .launch-workshop-rail {
    order: -1;
  }

  .workshop-editor-text,
  .workshop-rich-editor {
    min-height: 50vh;
  }
}

/* Content V2 editable runtime */
.content-headline {
  margin: 0;
  color: var(--muted);
  font-size: 13px;
  white-space: nowrap;
}

.content-toolbar-primary {
  display: grid;
  align-content: center;
  gap: 5px;
  min-width: 0;
  width: max-content;
  max-width: 100%;
}

/* The shared sidebar turns the module into a grid item. Its legacy auto
   margins otherwise let the shell keep its intrinsic desktop width on small
   screens instead of shrinking to the mobile grid track. */
.app-frame > .content-module {
  width: 100%;
  min-width: 0;
}

.content-module .content-database-toolbar .module-select-filters {
  grid-template-columns: minmax(154px, 1.25fr) repeat(3, minmax(118px, 1fr));
}

.content-format {
  display: block;
  margin-top: 5px;
  color: var(--muted);
  font-size: 11px;
}

.content-status.idea,
.content-status.archived {
  background: #f0eeea;
  color: var(--muted);
}

.content-status.preparation,
.content-status.production,
.content-status.processing {
  background: var(--warning-soft);
  color: var(--warning);
}

.content-status.review {
  background: var(--pink-soft);
  color: var(--pink);
}

.content-status.ready,
.content-status.scheduled {
  background: var(--blue-soft);
  color: var(--blue);
}

.content-status.published {
  background: var(--accent-soft);
  color: var(--accent);
}

.content-quality {
  display: inline-flex;
  align-items: center;
  min-height: 22px;
  padding: 2px 9px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 800;
  white-space: nowrap;
}

.content-quality.ready {
  background: var(--accent-soft);
  color: var(--accent);
}

.content-quality.incomplete {
  background: var(--warning-soft);
  color: var(--warning);
}

.content-quality.relations-to-resolve {
  background: var(--pink-soft);
  color: var(--pink);
}

.content-column-empty,
.empty-note {
  margin: 8px 0;
  color: var(--muted);
  font-size: 12px;
}

.content-calendar-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.content-calendar-card {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 6px 10px;
  padding: 13px;
  border: 1px solid var(--line);
  border-radius: 9px;
  background: var(--panel);
  color: var(--text);
  font: inherit;
  text-align: left;
  cursor: pointer;
}

.content-calendar-card:hover {
  border-color: var(--accent);
}

.content-calendar-card time,
.content-calendar-card > span:last-child {
  color: var(--muted);
  font-size: 12px;
}

.content-calendar-card strong,
.content-calendar-card > span:last-child {
  grid-column: 1 / -1;
}

.breadcrumb-link {
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--accent);
  font: inherit;
  cursor: pointer;
}

.content-readonly-notice,
.content-conflict,
.content-error,
.content-loading {
  margin-bottom: 16px;
  padding: 13px 15px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--panel);
}

.content-readonly-notice {
  border-color: #d9b56d;
  background: var(--warning-soft);
  color: var(--warning);
  font-weight: 750;
}

.content-conflict {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  border-color: #d5a3a3;
  background: #fff4f2;
  color: #8c3434;
}

.content-conflict div,
.content-error {
  display: grid;
  gap: 4px;
}

.content-conflict span,
.content-error span {
  font-size: 13px;
}

.content-edit-grid,
.content-create-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 13px;
}

.content-field {
  display: grid;
  min-width: 0;
  gap: 6px;
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.03em;
  text-transform: uppercase;
}

.content-field-wide {
  grid-column: 1 / -1;
}

.content-field input,
.content-field select,
.content-field textarea {
  width: 100%;
  min-width: 0;
  padding: 9px 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  color: var(--text);
  font: inherit;
  font-size: 13px;
  font-weight: 500;
  letter-spacing: normal;
  text-transform: none;
}

.content-field select[multiple] {
  min-height: 116px;
}

.content-field textarea {
  line-height: 1.5;
  resize: vertical;
}

.content-field input:focus-visible,
.content-field select:focus-visible,
.content-field textarea:focus-visible,
.content-module button:focus-visible,
.content-table tr:focus-visible {
  outline: 3px solid rgba(39, 111, 104, 0.25);
  outline-offset: 2px;
}

.content-relation-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  gap: 12px;
  align-items: center;
  padding: 10px 0;
  border-bottom: 1px solid var(--line);
}

.content-relation-row:last-child {
  border-bottom: 0;
}

.content-relation-row div {
  display: grid;
  min-width: 0;
  gap: 3px;
}

.content-relation-row strong,
.content-relation-row span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.content-relation-row span,
.content-relation-row small,
.content-relation-row label {
  color: var(--muted);
  font-size: 11px;
}

.content-relation-add {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 160px auto;
  gap: 10px;
  align-items: end;
  margin-top: 14px;
  padding-top: 14px;
  border-top: 1px solid var(--line);
}

.content-readonly-section {
  margin-bottom: 10px;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--panel);
}

.content-readonly-section > header {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 11px 14px;
  border-bottom: 1px solid var(--line);
}

.content-readonly-section h2 {
  margin: 0;
  font-size: 14px;
}

.content-readonly-section header b {
  display: grid;
  min-width: 22px;
  height: 22px;
  place-items: center;
  border-radius: 999px;
  background: var(--accent-soft);
  color: var(--accent);
  font-size: 11px;
}

.content-readonly-section header span {
  margin-left: auto;
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
}

.content-readonly-section > div {
  padding: 6px 14px;
}

.content-structured-row {
  display: grid;
  gap: 3px;
  padding: 9px 0;
  border-bottom: 1px solid var(--line);
  color: inherit;
  font-size: 13px;
  text-decoration: none;
}

.content-structured-row:last-child {
  border-bottom: 0;
}

a.content-structured-row:hover strong {
  color: var(--accent);
}

.content-structured-row span,
.content-structured-row small {
  color: var(--muted);
  font-size: 11px;
  overflow-wrap: anywhere;
}

.content-structured-row details {
  margin-top: 4px;
}

.content-structured-row pre {
  max-height: 220px;
  overflow: auto;
  white-space: pre-wrap;
}

.content-provenance {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 5px 8px;
  margin: 0;
  font-size: 12px;
}

.content-provenance dt {
  color: var(--muted);
}

.content-provenance dd {
  margin: 0;
  overflow-wrap: anywhere;
}

.content-revision {
  display: block;
  overflow: hidden;
  color: var(--muted);
  font-size: 10px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.content-history-event {
  display: grid;
  gap: 2px;
  margin-bottom: 8px;
  padding: 9px;
  border: 1px solid var(--line);
  border-radius: 8px;
  font-size: 12px;
}

.content-history-event time,
.content-history-event span {
  color: var(--muted);
  font-size: 10px;
}

.content-form-error {
  grid-column: 1 / -1;
  margin: 0;
  padding: 10px;
  border-radius: 8px;
  background: #fff4f2;
  color: #8c3434;
  font-size: 12px;
}

.toast[data-kind="error"] {
  background: #8c3434;
}

@media (max-width: 1080px) {
  .content-module .content-database-toolbar .module-select-filters {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .content-calendar-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 720px) {
  .content-module .content-database-toolbar .module-select-filters,
  .content-edit-grid,
  .content-create-grid,
  .content-calendar-grid,
  .content-detail-head,
  .content-detail-layout,
  .content-relation-add {
    grid-template-columns: minmax(0, 1fr);
  }

  .content-channel-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .content-field-wide {
    grid-column: auto;
  }

  .content-detail-head {
    align-items: start;
  }

  .content-detail-head .header-actions {
    width: 100%;
  }

  .content-detail-head .header-actions .button {
    flex: 1;
  }

  .content-rail {
    position: static;
  }

  .content-relation-row {
    grid-template-columns: minmax(0, 1fr) auto;
  }

  .content-relation-row small {
    grid-column: 1;
  }

  .content-conflict {
    align-items: stretch;
    flex-direction: column;
  }
}

@media (max-width: 430px) {
  .shell {
    padding: 16px;
  }

  .content-channel-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .content-table {
    min-width: 720px;
  }

  .modal {
    width: calc(100vw - 20px);
    max-height: calc(100vh - 20px);
  }

  .modal-head,
  .modal-body,
  .modal-foot {
    padding-right: 15px;
    padding-left: 15px;
  }
}

* {
  box-sizing: border-box;
}

body {
  margin: 0;
  background: var(--bg);
  color: var(--text);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

body.runtime-readonly {
  padding-top: 38px;
}

.app-frame {
  display: grid;
  grid-template-columns: 248px minmax(0, 1fr);
  grid-template-rows: auto minmax(0, 1fr);
  min-height: 100vh;
}

.app-sidebar {
  position: sticky;
  top: 0;
  z-index: 80;
  grid-row: 1 / span 2;
  display: flex;
  height: 100vh;
  min-width: 0;
  flex-direction: column;
  border-right: 1px solid var(--line);
  background: #fbfbf8;
}

.app-frame > main,
.app-frame > .shell,
.app-frame > .content-module,
.app-frame > .dashboard-shell,
.app-frame > .module-shell {
  grid-column: 2;
  grid-row: 2;
  min-width: 0;
}

.dashboard-internal-tabs {
  position: sticky;
  top: 0;
  z-index: 70;
  grid-column: 2;
  grid-row: 1;
  min-width: 0;
  border-bottom: 1px solid var(--line);
  background: rgba(251, 251, 248, 0.96);
  backdrop-filter: blur(12px);
}

body.runtime-readonly .dashboard-internal-tabs {
  top: 38px;
}

.dashboard-internal-tabs[hidden] {
  display: none;
}

.internal-tabs-list {
  display: flex;
  gap: 6px;
  min-width: 0;
  overflow-x: auto;
  padding: 8px 12px;
}

.internal-tab {
  display: inline-grid;
  grid-template-columns: minmax(0, 1fr) 20px;
  align-items: center;
  width: min(220px, 44vw);
  min-width: 128px;
  min-height: 34px;
  gap: 6px;
  padding: 5px 5px 5px 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  color: var(--muted);
  font-size: 12.5px;
  font-weight: 850;
  text-decoration: none;
}

.internal-tab:hover,
.internal-tab.active {
  border-color: var(--accent);
  background: var(--accent-soft);
  color: var(--accent);
}

.internal-tab span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.internal-tab-close {
  display: grid;
  width: 20px;
  height: 20px;
  place-items: center;
  padding: 0;
  border-radius: 6px;
  color: inherit;
  font-size: 16px;
  line-height: 1;
  cursor: pointer;
}

.internal-tab-close:hover {
  background: rgba(32, 37, 34, 0.1);
}

.dashboard-link-context-menu {
  position: fixed;
  z-index: 1600;
  display: grid;
  min-width: 244px;
  padding: 5px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 18px 48px rgba(32, 37, 34, 0.2);
}

.dashboard-link-context-menu[hidden] {
  display: none;
}

.dashboard-link-context-menu button {
  min-height: 34px;
  padding: 0 10px;
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: var(--text);
  font: inherit;
  font-size: 13px;
  font-weight: 800;
  text-align: left;
  cursor: pointer;
}

.dashboard-link-context-menu button:hover {
  background: var(--accent-soft);
  color: var(--accent);
}

body.runtime-readonly .app-sidebar {
  top: 38px;
  height: calc(100vh - 38px);
}

.sidebar-brand {
  display: flex;
  min-height: 62px;
  align-items: center;
  gap: 8px;
  padding: 12px 12px 10px;
  border-bottom: 1px solid var(--line);
}

.sidebar-home-link {
  display: flex;
  min-width: 0;
  flex: 1;
  align-items: center;
  gap: 9px;
  color: var(--text);
  text-decoration: none;
}

.sidebar-home-link span {
  display: grid;
  width: 30px;
  height: 30px;
  flex: 0 0 auto;
  place-items: center;
  border-radius: 8px;
  background: var(--accent);
  color: #fff;
  font-size: 12px;
  font-weight: 900;
}

.sidebar-home-link strong {
  min-width: 0;
  overflow: hidden;
  font-size: 14px;
  font-weight: 900;
  line-height: 1.1;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.sidebar-toggle {
  display: grid;
  width: 32px;
  min-width: 32px;
  height: 32px;
  min-height: 32px;
  place-items: center;
  padding: 0;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel);
  color: var(--muted);
  font-size: 21px;
  line-height: 1;
}

.sidebar-toggle:hover {
  border-color: var(--accent);
  color: var(--accent);
}

.sidebar-nav {
  display: grid;
  gap: 12px;
  overflow-y: auto;
  padding: 8px 12px 12px;
}

.sidebar-command-button {
  display: grid;
  grid-template-columns: 24px minmax(0, 1fr) auto;
  gap: 9px;
  align-items: center;
  min-height: 38px;
  margin: 10px 12px 4px;
  padding: 7px 8px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel);
  color: var(--muted);
  font: inherit;
  font-size: 13px;
  font-weight: 800;
  text-align: left;
  cursor: pointer;
}

.sidebar-command-button:hover {
  border-color: var(--accent);
  background: var(--accent-soft);
  color: var(--accent);
}

.sidebar-command-button kbd {
  padding: 2px 5px;
  border: 1px solid var(--line);
  border-radius: 5px;
  background: #f7f7f4;
  color: var(--muted);
  font: inherit;
  font-size: 10px;
  font-weight: 900;
}

.sidebar-section {
  display: grid;
  gap: 3px;
}

.sidebar-section > span {
  padding: 8px 8px 4px;
  color: var(--muted);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.sidebar-private-section {
  margin-top: 3px;
  padding: 6px;
  border: 1px solid color-mix(in srgb, var(--accent) 38%, var(--line));
  border-radius: 11px;
  background: linear-gradient(145deg, color-mix(in srgb, var(--accent-soft) 70%, transparent), transparent);
}

.sidebar-private-section > span { color: var(--accent); }
.sidebar-private-pages { display: grid; gap: 1px; }
.sidebar-private-page { display: grid; grid-template-columns: 12px minmax(0,1fr); gap: 4px; padding: 4px 8px 4px 12px; border-radius: 7px; color: var(--muted); font-size: 11px; text-decoration: none; }
.sidebar-private-page span:last-child { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sidebar-private-page:hover,.sidebar-private-page.active { background: var(--panel); color: var(--accent); }
.sidebar-link {
  display: grid;
  grid-template-columns: 24px minmax(0, 1fr) auto;
  min-height: 38px;
  align-items: center;
  gap: 9px;
  padding: 7px 8px;
  border: 1px solid transparent;
  border-radius: 8px;
  background: transparent;
  color: var(--text);
  font: inherit;
  font-size: 13px;
  font-weight: 800;
  text-align: left;
  text-decoration: none;
  cursor: pointer;
}

.sidebar-link:hover,
.sidebar-link.active {
  border-color: var(--line);
  background: var(--panel);
}

.sidebar-link.active {
  color: var(--accent);
}

.sidebar-link.disabled {
  color: var(--muted);
  cursor: not-allowed;
  opacity: 0.68;
}

.sidebar-link-icon {
  display: grid;
  width: 24px;
  height: 24px;
  place-items: center;
  color: inherit;
}

.sidebar-link-icon svg {
  width: 18px;
  height: 18px;
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.8;
}

.sidebar-link-text {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.sidebar-link small {
  max-width: 74px;
  overflow: hidden;
  color: var(--muted);
  font-size: 10px;
  font-weight: 850;
  text-overflow: ellipsis;
  text-transform: uppercase;
  white-space: nowrap;
}

.sidebar-profile {
  position: relative;
  margin-top: auto;
  padding: 10px 12px 14px;
  border-top: 1px solid var(--line);
}

.sidebar-profile-button {
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr);
  gap: 9px;
  align-items: center;
  width: 100%;
  min-height: 40px;
  padding: 6px 8px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel);
  color: var(--text);
  font: inherit;
  text-align: left;
  cursor: pointer;
}

.sidebar-profile-button:hover,
.sidebar-profile-button[aria-expanded="true"] {
  border-color: var(--accent);
  background: var(--accent-soft);
}

.sidebar-profile-button .sidebar-profile-avatar {
  display: grid;
  place-items: center;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: var(--accent);
  color: #fff;
  font-size: 12px;
  font-weight: 900;
  overflow: hidden;
}

.sidebar-profile-button .sidebar-profile-avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.sidebar-profile-button strong {
  overflow: hidden;
  font-size: 13px;
  font-weight: 850;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.sidebar-profile-menu {
  position: absolute;
  z-index: 40;
  right: 12px;
  bottom: calc(100% - 6px);
  left: 12px;
  display: none;
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 18px 44px rgba(32, 37, 34, 0.16);
}

.sidebar-profile-menu.open {
  display: grid;
  gap: 8px;
}

.sidebar-profile-menu button,
.sidebar-profile-menu a {
  display: flex;
  min-height: 34px;
  align-items: center;
  padding: 0 9px;
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: var(--text);
  font: inherit;
  font-size: 13px;
  font-weight: 800;
  text-align: left;
  text-decoration: none;
  cursor: pointer;
}

.sidebar-profile-menu button:hover,
.sidebar-profile-menu button.active,
.sidebar-profile-menu a:hover {
  background: var(--accent-soft);
  color: var(--accent);
}

.profile-view-toggle {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 5px;
  padding: 4px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fbfbfa;
}

.sidebar-profile-menu .profile-view-toggle button {
  justify-content: center;
  min-height: 30px;
  padding: 0 7px;
  font-size: 12px;
  white-space: nowrap;
}

.profile-menu-note {
  padding: 2px 9px 4px;
  color: var(--muted);
  font-size: 11.5px;
  line-height: 1.35;
}

.sidebar-collapsed {
  grid-template-columns: 72px minmax(0, 1fr);
}

.sidebar-collapsed .app-sidebar {
  align-items: stretch;
}

.sidebar-collapsed .sidebar-brand {
  justify-content: center;
  padding-right: 8px;
  padding-left: 8px;
}

.sidebar-collapsed .sidebar-home-link {
  flex: 0 0 auto;
}

.sidebar-collapsed .sidebar-home-link strong,
.sidebar-collapsed .sidebar-section > span,
.sidebar-collapsed .sidebar-link-text,
.sidebar-collapsed .sidebar-link small,
.sidebar-collapsed .sidebar-command-button kbd,
.sidebar-collapsed .sidebar-profile-button strong {
  display: none;
}

.sidebar-collapsed .sidebar-private-pages { display: none; }
.sidebar-collapsed .sidebar-private-section { padding: 2px; }

.sidebar-collapsed .sidebar-toggle {
  position: absolute;
  top: 15px;
  right: -16px;
  background: var(--panel);
  box-shadow: 0 8px 18px rgba(32, 37, 34, 0.12);
  transform: rotate(180deg);
}

.sidebar-collapsed .sidebar-nav {
  padding: 12px 9px;
}

.sidebar-collapsed .sidebar-link {
  grid-template-columns: 1fr;
  justify-items: center;
  padding: 7px;
}

.sidebar-collapsed .sidebar-command-button,
.sidebar-collapsed .sidebar-profile-button {
  grid-template-columns: 1fr;
  justify-items: center;
  padding: 7px;
}

.command-palette-backdrop {
  position: fixed;
  z-index: 1300;
  inset: 0;
  display: grid;
  place-items: start center;
  padding: 9vh 18px 18px;
  background: rgba(32, 37, 34, 0.28);
}

.command-palette-backdrop[hidden] {
  display: none;
}

.command-palette {
  display: grid;
  width: min(680px, 100%);
  max-height: min(620px, 82vh);
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 24px 70px rgba(32, 37, 34, 0.24);
}

.command-palette header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 14px 16px;
  border-bottom: 1px solid var(--line);
}

.command-palette header p,
.command-palette header h2 {
  margin: 0;
}

.command-palette header p {
  color: var(--muted);
  font-size: 11px;
  font-weight: 850;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.command-palette header h2 {
  margin-top: 2px;
  font-size: 18px;
}

.command-palette header kbd {
  padding: 3px 7px;
  border: 1px solid var(--line);
  border-radius: 6px;
  color: var(--muted);
  font: inherit;
  font-size: 11px;
  font-weight: 900;
}

.command-palette input {
  width: calc(100% - 32px);
  margin: 14px 16px 8px;
  padding: 12px 13px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  color: var(--text);
  font: inherit;
  font-size: 15px;
}

.command-palette-list {
  display: grid;
  gap: 4px;
  overflow-y: auto;
  padding: 0 8px 10px;
}

.command-palette-item {
  display: grid;
  grid-template-columns: 24px minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  min-height: 44px;
  padding: 8px 10px;
  border-radius: 8px;
  color: var(--text);
  text-decoration: none;
}

.command-palette-item:hover {
  background: var(--accent-soft);
  color: var(--accent);
}

.command-palette-item strong,
.command-palette-item small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.command-palette-item > span:not(.sidebar-link-icon) {
  display: grid;
  min-width: 0;
  gap: 2px;
}

.command-palette-item em {
  overflow: hidden;
  color: var(--muted);
  font-size: 12px;
  font-style: normal;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.command-palette-item small {
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
}

.runtime-source-banner {
  position: fixed;
  z-index: 1000;
  top: 0;
  right: 0;
  left: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 38px;
  padding: 8px 14px;
  border-bottom: 1px solid #cfbd93;
  background: #f7efd9;
  color: #664815;
  font-size: 13px;
  font-weight: 800;
}

body.runtime-readonly button:disabled {
  cursor: not-allowed;
  opacity: 0.58;
}

.hidden {
  display: none !important;
}

.shell {
  max-width: 1120px;
  margin: 0 auto;
  padding: 34px;
}

.topbar {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 18px;
  margin-bottom: 24px;
  padding-bottom: 18px;
  border-bottom: 1px solid var(--line);
}

.breadcrumb {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 22px;
  color: var(--muted);
  font-size: 14px;
}

.breadcrumb a {
  color: var(--accent);
  font-weight: 800;
  text-decoration: none;
}

.breadcrumb a:hover {
  text-decoration: underline;
}

.topbar p,
.modules span,
.page-header p,
.module-header p,
.section-title p,
.metric span {
  margin: 0 0 6px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.topbar span {
  display: inline-flex;
  margin-top: 12px;
  padding: 7px 10px;
  border-radius: 999px;
  background: var(--accent-soft);
  color: var(--accent);
  font-size: 13px;
  font-weight: 800;
}

h1,
h2,
h3 {
  margin: 0;
  letter-spacing: 0;
}

h1 {
  font-size: 38px;
}

h2 {
  font-size: 24px;
  line-height: 1.15;
}

h3 {
  font-size: 18px;
}

.intro {
  max-width: 760px;
  margin: 0 0 24px;
}

.intro p {
  margin: 12px 0 0;
  color: var(--muted);
  font-size: 16px;
  line-height: 1.55;
}

.page-header,
.module-header {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 20px;
  margin-bottom: 22px;
  padding-bottom: 18px;
  border-bottom: 1px solid var(--line);
}

.page-header span {
  display: inline-flex;
  margin-top: 12px;
  padding: 7px 10px;
  border-radius: 999px;
  background: var(--accent-soft);
  color: var(--accent);
  font-size: 13px;
  font-weight: 800;
}

.module-header {
  min-height: 58px;
}

.module-header h1 {
  line-height: 1.04;
}

.module-toolbar {
  position: sticky;
  z-index: 20;
  top: 0;
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 18px;
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.96);
  box-shadow: 0 8px 18px rgba(32, 37, 34, 0.05);
  flex-wrap: wrap;
}

body.runtime-readonly .module-toolbar {
  top: 38px;
}

.module-toolbar input,
.module-toolbar select {
  min-height: 36px;
  padding: 7px 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  color: var(--text);
  font: inherit;
}

.module-toolbar input {
  flex: 1;
  min-width: min(280px, 100%);
}

.module-toolbar .module-search {
  display: flex;
  flex: 1 1 260px;
  min-width: min(260px, 100%);
}

.module-toolbar .module-search input {
  width: 100%;
}

.module-toolbar .module-select-filters,
.module-toolbar .module-filter-pills,
.module-toolbar .module-view-switch {
  display: flex;
  align-items: center;
  gap: 6px;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  flex-wrap: wrap;
}

.module-toolbar button {
  min-height: 34px;
  padding: 0 12px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: #fff;
  color: var(--muted);
  font: inherit;
  font-size: 13px;
  font-weight: 800;
  cursor: pointer;
}

.module-toolbar button:hover,
.module-toolbar button.active {
  border-color: var(--accent);
  background: var(--accent-soft);
  color: var(--accent);
}

.stat-strip {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
  gap: 10px;
  margin-bottom: 18px;
}

.stat-strip > article {
  padding: 14px 15px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel);
}

.stat-strip > article > span,
.stat-strip .k-label {
  display: block;
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.stat-strip > article > strong,
.stat-strip .k-value {
  display: block;
  margin: 7px 0 2px;
  color: var(--text);
  font-size: 24px;
  font-weight: 800;
  line-height: 1.05;
}

.stat-strip > article > p,
.stat-strip .k-note {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.4;
}

.launch-hero span {
  background: var(--pink-soft);
  color: var(--pink);
}

.header-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: flex-end;
}

.button {
  display: inline-flex;
  min-height: 40px;
  align-items: center;
  justify-content: center;
  padding: 0 14px;
  border: 1px solid var(--accent);
  border-radius: 8px;
  background: var(--accent);
  color: #fff;
  font-size: 14px;
  font-weight: 800;
  text-decoration: none;
}

.button.ghost {
  background: var(--panel);
  color: var(--accent);
}

.button.small {
  min-height: 34px;
  padding: 0 11px;
  font-size: 13px;
}

.modules {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: 12px;
}

.modules a {
  display: flex;
  min-height: 210px;
  flex-direction: column;
  justify-content: space-between;
  padding: 18px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel);
  color: inherit;
  text-decoration: none;
}

.modules a:hover {
  border-color: var(--accent);
}

.modules strong {
  display: block;
  margin-top: auto;
  font-size: 18px;
}

.modules p {
  margin: 10px 0 0;
  color: var(--muted);
  line-height: 1.45;
}

.modules span {
  display: block;
  color: var(--accent);
}

/* Home cockpit */
.home-shell {
  max-width: 1160px;
}

.home-topbar {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 18px;
  margin-bottom: 18px;
}

.home-actions {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: flex-end;
}

.agent-button {
  border-color: #1f7a4d;
  background: #1f7a4d;
}

.agent-floating-button {
  position: fixed;
  right: 22px;
  bottom: 22px;
  z-index: 1080;
  display: grid;
  place-items: center;
  width: 64px;
  height: 64px;
  border: 1px solid #17613d;
  border-radius: 50%;
  background: #1f7a4d;
  color: #fff;
  box-shadow: 0 14px 34px rgba(31, 122, 77, 0.34);
  font: inherit;
  font-size: 16px;
  font-weight: 900;
  text-decoration: none;
  cursor: pointer;
}

.agent-floating-button:hover,
.agent-floating-link:hover {
  background: #17613d;
}

.home-topbar p {
  margin: 0 0 6px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.home-topbar span {
  display: inline-flex;
  margin-top: 12px;
  padding: 7px 10px;
  border-radius: 999px;
  background: var(--accent-soft);
  color: var(--accent);
  font-size: 13px;
  font-weight: 800;
}

.role-pill-wrap {
  position: relative;
  display: inline-flex;
  margin-top: 12px;
}

.role-pill {
  min-height: 31px;
  padding: 0 28px 0 11px;
  border: 1px solid transparent;
  border-radius: 999px;
  background: var(--accent-soft);
  color: var(--accent);
  font: inherit;
  font-size: 13px;
  font-weight: 800;
  cursor: pointer;
}

.role-pill::after {
  content: "⌄";
  position: absolute;
  right: 11px;
  top: 4px;
  font-size: 15px;
}

.role-menu {
  position: absolute;
  z-index: 20;
  top: calc(100% + 6px);
  left: 0;
  display: none;
  min-width: 170px;
  padding: 6px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 18px 40px rgba(32, 37, 34, 0.14);
}

.role-menu.open {
  display: grid;
  gap: 3px;
}

.role-menu button {
  min-height: 34px;
  padding: 0 10px;
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: var(--text);
  font: inherit;
  font-size: 13px;
  font-weight: 800;
  text-align: left;
  cursor: pointer;
}

.role-menu button:hover,
.role-menu button.active {
  background: var(--accent-soft);
  color: var(--accent);
}

.role-switcher {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 24px;
  padding: 10px 14px;
  border: 1px dashed var(--line);
  border-radius: 10px;
  background: var(--panel);
  color: var(--muted);
  font-size: 13px;
  flex-wrap: wrap;
}

.profile-menu-wrap {
  position: relative;
  display: inline-flex;
}

.profile-button {
  display: inline-flex;
  min-height: 40px;
  align-items: center;
  gap: 9px;
  padding: 0 10px 0 8px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel);
  color: var(--text);
  font: inherit;
  cursor: pointer;
}

.profile-button:hover,
.profile-button[aria-expanded="true"] {
  border-color: var(--accent);
  background: var(--accent-soft);
}

.profile-button span {
  display: grid;
  place-items: center;
  width: 26px;
  height: 26px;
  margin: 0;
  padding: 0;
  border-radius: 50%;
  background: var(--accent);
  color: #fff;
  font-size: 12px;
  font-weight: 900;
}

.profile-button strong {
  max-width: 150px;
  overflow: hidden;
  color: inherit;
  font-size: 13px;
  font-weight: 850;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.profile-menu {
  position: absolute;
  z-index: 30;
  top: calc(100% + 8px);
  right: 0;
  display: none;
  width: min(280px, calc(100vw - 34px));
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 18px 44px rgba(32, 37, 34, 0.16);
}

.profile-menu.open {
  display: grid;
  gap: 8px;
}

.profile-menu-head {
  padding: 8px 9px 10px;
  border-bottom: 1px solid var(--line);
}

.profile-menu-head strong,
.profile-menu-head span {
  display: block;
  margin: 0;
  padding: 0;
  background: transparent;
  color: var(--text);
}

.profile-menu-head strong {
  font-size: 14px;
  font-weight: 900;
}

.profile-menu-head span {
  margin-top: 3px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
}

.profile-menu-section {
  display: grid;
  gap: 3px;
}

.profile-menu-section > span {
  margin: 0;
  padding: 4px 9px 3px;
  background: transparent;
  color: var(--muted);
  font-size: 11px;
  font-weight: 850;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.profile-menu button,
.profile-menu a {
  display: flex;
  min-height: 34px;
  align-items: center;
  padding: 0 9px;
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: var(--text);
  font: inherit;
  font-size: 13px;
  font-weight: 800;
  text-align: left;
  text-decoration: none;
  cursor: pointer;
}

.profile-menu button:hover,
.profile-menu button.active,
.profile-menu a:hover {
  background: var(--accent-soft);
  color: var(--accent);
}

.profile-menu button:disabled {
  color: var(--muted);
  cursor: not-allowed;
  opacity: 0.58;
}

.agent-panel {
  position: fixed;
  z-index: 1100;
  right: 22px;
  bottom: 96px;
  display: none;
  width: min(430px, calc(100vw - 32px));
  max-height: min(760px, calc(100vh - 124px));
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 24px 70px rgba(32, 37, 34, 0.22);
}

.agent-panel.open {
  display: flex;
  flex-direction: column;
}

.agent-panel-head,
.agent-panel-foot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 16px;
  border-bottom: 1px solid var(--line);
}

.agent-panel-head {
  align-items: flex-start;
}

.agent-panel-foot {
  border-top: 1px solid var(--line);
  border-bottom: 0;
}

.agent-panel-head p {
  margin: 0 0 5px;
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.agent-panel-head h2 {
  font-size: 20px;
}

.shared-agent-panel .agent-panel-head {
  padding: 14px 16px;
}

.shared-agent-panel .agent-panel-foot {
  padding: 10px 16px;
}

.agent-back-button {
  flex: 0 0 auto;
}

.icon-button {
  width: 34px;
  height: 34px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  color: var(--text);
  font-size: 22px;
  line-height: 1;
  cursor: pointer;
}

.agent-panel-body {
  flex: 1;
  overflow: auto;
  padding: 16px;
}

.agent-panel.conversation-mode .agent-panel-body {
  display: flex;
  flex-direction: column;
}

.agent-panel:not(.conversation-mode) .agent-step,
.agent-panel.conversation-mode .agent-home-step,
.agent-panel.conversation-mode .agent-history-step {
  display: none;
}

.agent-panel.conversation-mode .agent-conversation-step {
  order: 1;
  padding-top: 0;
  border-bottom: 1px solid var(--line);
}

.agent-panel.conversation-mode .agent-request-step {
  order: 2;
  padding-top: 12px;
  border-bottom: 0;
}

.agent-panel.conversation-mode .agent-request-step textarea {
  min-height: 72px;
}

.agent-panel.conversation-mode .agent-context-details {
  order: 3;
}

.agent-step {
  padding: 0 0 16px;
  border-bottom: 1px solid var(--line);
}

.agent-home-step {
  display: grid;
  gap: 14px;
}

.agent-home-actions {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 8px;
}

.agent-home-actions .button {
  min-width: 0;
  justify-content: center;
  text-align: center;
}

.agent-mission-list-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.agent-mission-list-head strong {
  font-size: 13px;
  font-weight: 900;
}

.agent-mission-card {
  position: relative;
  display: grid;
  gap: 5px;
  min-height: 74px;
  padding: 10px 76px 10px 10px;
}

.agent-mission-card em {
  position: absolute;
  top: 10px;
  right: 10px;
  padding: 2px 7px;
  border: 1px solid #e0d3b4;
  border-radius: 999px;
  background: #f3ebdd;
  color: #6f5618;
  font-size: 10px;
  font-style: normal;
  font-weight: 900;
}

.agent-mission-card.has-pending-action {
  border-color: #e0d3b4;
  background: #fffdf6;
}

.agent-step + .agent-step {
  padding-top: 16px;
}

.agent-step:last-child {
  border-bottom: 0;
}

.agent-step-label {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 10px;
  color: var(--text);
  font-size: 13px;
  font-weight: 900;
}

.agent-step-label span {
  width: 24px;
  height: 24px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: var(--accent-soft);
  color: var(--accent);
  font-size: 12px;
}

.voice-recorder {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 10px;
  flex-wrap: wrap;
}

.record-button {
  display: inline-flex;
  width: auto;
  height: auto;
  flex: 0 1 auto;
  align-items: center;
  justify-content: center;
  min-height: 38px;
  padding: 0 13px;
  border: 1px solid var(--pink);
  border-radius: 8px;
  background: var(--pink-soft);
  color: var(--pink);
  font: inherit;
  font-size: 13px;
  font-weight: 800;
  cursor: pointer;
}

.voice-recorder .record-button::before {
  display: none;
}

.voice-recorder span,
.agent-panel-foot span {
  color: var(--muted);
  font-size: 12px;
  line-height: 1.4;
}

.voice-preview {
  width: 100%;
  margin: 0 0 10px;
}

.agent-step textarea {
  width: 100%;
  padding: 10px 11px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  color: var(--text);
  font: inherit;
  line-height: 1.5;
  resize: vertical;
}

.agent-composer-row {
  display: grid;
  gap: 8px;
}

.agent-composer-actions {
  display: flex;
  align-items: center;
  gap: 8px;
  justify-content: space-between;
}

.agent-record-button,
.agent-send-inline {
  min-height: 34px;
}

.agent-send-inline {
  flex: 0 0 auto;
}

.shared-agent-panel .agent-panel-foot #saveAgentRequest {
  display: none;
}

.agent-page-context {
  margin: 0;
  padding: 10px 11px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fbfbf9;
  color: var(--muted);
  font-size: 13px;
  font-weight: 750;
}

.agent-context-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.agent-context-grid label {
  display: grid;
  gap: 6px;
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
}

.agent-context-grid select {
  width: 100%;
  min-height: 112px;
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  color: var(--text);
  font: inherit;
  font-size: 13px;
  text-transform: none;
}

.voice-note-list {
  display: grid;
  gap: 8px;
}

.voice-note-item {
  width: 100%;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fbfbf9;
  font: inherit;
  text-align: left;
}

.thread-history-item {
  cursor: pointer;
}

.thread-history-item:hover {
  border-color: #bfd9d2;
  background: var(--accent-soft);
}

.voice-note-item strong {
  display: block;
  overflow: hidden;
  color: var(--text);
  font-size: 13px;
  font-weight: 800;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.voice-note-item span,
.voice-note-item small,
.empty-note {
  display: block;
  margin: 4px 0 0;
  color: var(--muted);
  font-size: 12px;
}

.voice-note-item small {
  line-height: 1.35;
  white-space: normal;
}

.agent-messages {
  display: grid;
  max-height: min(360px, 42vh);
  overflow: auto;
  gap: 10px;
}

.agent-message {
  display: block;
  max-width: none;
  margin-bottom: 9px;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
}

.agent-message.user {
  text-align: right;
}

.agent-message.assistant {
  text-align: left;
}

.agent-message.system {
  display: block;
  margin: 11px auto;
  max-width: 86%;
  padding: 5px 10px;
  border-color: transparent;
  border-radius: 999px;
  background: #f1f2ef;
  color: var(--muted);
  text-align: center;
}

.agent-message > span {
  display: block;
  max-width: 86%;
  margin: 0 0 3px;
  color: var(--muted);
  font-size: 10px;
  font-weight: 900;
  text-transform: uppercase;
}

.agent-message.user > span {
  margin-left: auto;
}

.agent-message > div {
  display: inline-block;
  max-width: 86%;
  padding: 8px 11px;
  border-radius: 12px;
  border-bottom-left-radius: 4px;
  background: #e3f1ee;
  color: var(--text);
  font-size: 12.5px;
  line-height: 1.5;
  text-align: left;
}

.agent-message.user > div {
  border-bottom-right-radius: 4px;
  border-bottom-left-radius: 12px;
  background: #e6eef4;
  color: #243f52;
}

.agent-message.system > div {
  display: block;
  max-width: none;
  padding: 0;
  border-radius: 0;
  background: transparent;
  color: var(--muted);
  font-size: 11.5px;
  font-weight: 750;
  text-align: center;
}

.agent-message-usage {
  display: block;
  max-width: 86%;
  margin-top: 4px;
  color: var(--muted);
  font-size: 10.5px;
  font-weight: 750;
}

.agent-message.user .agent-message-usage {
  margin-left: auto;
  text-align: right;
}

.agent-actions-preview {
  display: flex;
  gap: 6px;
  margin-top: 10px;
  flex-wrap: wrap;
}

.agent-actions-preview button {
  min-height: 30px;
  padding: 0 9px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #f4f4f1;
  color: var(--muted);
  font: inherit;
  font-size: 12px;
  font-weight: 800;
}

.agent-actions-preview span {
  min-height: 30px;
  padding: 7px 9px;
  border: 1px dashed var(--line);
  border-radius: 8px;
  background: #f4f4f1;
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
}

.agent-thread-controls {
  display: flex;
  gap: 8px;
  justify-content: flex-end;
}

.agent-thread-controls button {
  min-height: 34px;
  padding: 0 11px;
  border: 1px solid var(--accent);
  border-radius: 8px;
  background: #fff;
  color: var(--accent);
  font: inherit;
  font-size: 12px;
  font-weight: 900;
  cursor: pointer;
}

.agent-thread-controls button:disabled {
  border-color: var(--line);
  color: var(--muted);
  cursor: default;
}

.agent-context-details {
  padding-bottom: 0;
}

.agent-context-details > summary {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 4px 10px;
  align-items: center;
  padding: 10px 0 0;
  color: var(--text);
  cursor: pointer;
  list-style: none;
}

.agent-context-details > summary::-webkit-details-marker {
  display: none;
}

.agent-context-details > summary::after {
  grid-row: 1 / span 2;
  grid-column: 2;
  color: var(--muted);
  content: "⌄";
  font-size: 14px;
  font-weight: 900;
}

.agent-context-details[open] > summary::after {
  transform: rotate(180deg);
}

.agent-context-details > summary span,
.agent-context-details > summary small {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.agent-context-details > summary span {
  font-size: 13px;
  font-weight: 900;
}

.agent-context-details > summary small {
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
}

.agent-context-details-body {
  display: grid;
  gap: 14px;
  padding: 12px 0 2px;
}

.shared-agent-panel {
  width: min(404px, calc(100vw - 32px));
  height: min(760px, calc(100vh - 112px));
  max-height: none;
  border-color: #b7d7d1;
  border-radius: 12px;
  box-shadow: 0 18px 45px rgba(32, 37, 34, 0.18);
}

.shared-agent-panel.expanded {
  width: min(700px, calc(100vw - 32px));
}

.shared-agent-panel .agent-panel-head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px 12px;
  align-items: center;
  flex: 0 0 64px;
  min-height: 64px;
  padding: 10px 10px 9px 14px;
  border-bottom-color: #b7d7d1;
  background: #e3f1ee;
}

.agent-panel-title-block {
  min-width: 0;
}

.agent-panel-title-block h2 {
  margin: 0;
  color: var(--accent);
  font-size: 16px;
  font-weight: 900;
  letter-spacing: 0;
}

.agent-panel-title-block p {
  margin: 3px 0 0;
  overflow: hidden;
  color: var(--muted);
  font-size: 11.5px;
  font-weight: 800;
  letter-spacing: 0;
  text-overflow: ellipsis;
  text-transform: none;
  white-space: nowrap;
}

.agent-telegram-pill {
  display: block;
  grid-column: 1 / -1;
  justify-self: start;
  max-width: 100%;
  overflow: hidden;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: var(--muted);
  font-size: 11px;
  font-weight: 850;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.agent-panel-head-actions {
  grid-column: 2;
  grid-row: 1;
  display: flex;
  gap: 3px;
  align-items: center;
}

.shared-agent-panel .icon-button {
  display: grid;
  place-items: center;
  width: 28px;
  height: 28px;
  min-width: 28px;
  padding: 0;
  border-radius: 6px;
  font-size: 14px;
  font-weight: 850;
}

.shared-agent-panel .agent-panel-body {
  position: relative;
  display: grid;
  flex: 1;
  grid-template-rows: minmax(0, 1fr) 32px;
  min-height: 0;
  overflow: hidden;
  padding: 0;
}

.agent-thread-drawer {
  position: absolute;
  z-index: 2;
  inset: 0;
  display: none;
  max-height: none;
  overflow: auto;
  padding: 12px;
  border-bottom: 1px solid var(--line);
  background: #fff;
  box-shadow: 0 18px 32px rgba(32, 37, 34, 0.12);
}

.agent-panel.agent-list-open .agent-thread-drawer {
  display: grid;
  gap: 12px;
}

.shared-agent-panel .agent-conversation-step {
  position: relative;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  gap: 10px;
  min-height: 0;
  padding: 12px 11px;
  border-bottom: 1px solid var(--line);
}

.shared-agent-panel .agent-page-context {
  display: none;
}

.shared-agent-panel .agent-messages {
  display: block;
  max-height: none;
  min-height: 260px;
  overflow: auto;
  padding-right: 2px;
}

.agent-thread-status-strip {
  display: grid;
  gap: 2px;
  padding: 10px 12px;
  border: 1px solid #b7d7d1;
  border-radius: 8px;
  background: #e3f1ee;
}

.agent-thread-status-strip[hidden] {
  display: none;
}

.agent-thread-status-strip strong {
  min-width: 0;
  overflow: hidden;
  color: var(--accent);
  font-size: 13px;
  font-weight: 900;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.agent-thread-status-strip span {
  min-width: 0;
  overflow: hidden;
  color: var(--muted);
  font-size: 12px;
  font-weight: 750;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.agent-context-bar {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  width: 100%;
  height: 32px;
  padding: 0 11px;
  border: 0;
  border-bottom: 1px solid var(--line);
  background: #fbfbf9;
  color: var(--text);
  font: inherit;
  text-align: left;
  cursor: pointer;
}

.agent-context-bar span {
  display: block;
  min-width: 0;
  gap: 2px;
}

.agent-context-bar strong {
  display: inline;
  font-size: 11px;
  font-weight: 900;
}

.agent-context-bar small,
.agent-context-cache-note,
.agent-model-cache-note {
  overflow: hidden;
  color: var(--muted);
  font-size: 11px;
  font-weight: 700;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.agent-context-bar i {
  font-style: normal;
  font-weight: 900;
}

.agent-context-bar[aria-expanded="true"] i {
  transform: rotate(180deg);
}

.shared-agent-panel .agent-context-details {
  position: absolute;
  z-index: 3;
  left: 0;
  right: 0;
  bottom: 32px;
  display: none;
  max-height: calc(100% - 32px);
  overflow: auto;
  padding: 12px 14px;
  border-bottom: 1px solid var(--line);
}

.agent-panel.agent-context-open .agent-context-details {
  display: block;
}

.shared-agent-panel .agent-panel-foot {
  display: grid;
  flex: 0 0 112px;
  gap: 8px;
  min-height: 112px;
  padding: 8px 11px;
  border-top: 0;
}

.shared-agent-panel .agent-panel-foot textarea {
  width: 100%;
  min-height: 42px;
  max-height: 42px;
  padding: 9px 12px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: #fff;
  color: var(--text);
  font: inherit;
  font-size: 12.5px;
  line-height: 1.45;
  resize: none;
}

.shared-agent-panel .agent-composer-actions {
  display: grid;
  grid-template-columns: minmax(118px, 1fr) auto auto;
  gap: 6px;
  align-items: center;
}

.shared-agent-panel .agent-model-cache-note {
  display: none;
}

.shared-agent-panel .agent-model-picker {
  min-width: 0;
}

.shared-agent-panel .agent-model-picker .ai-model-selector {
  margin-top: 0;
}

.shared-agent-panel .agent-model-picker .ai-model-selector > summary {
  min-height: 28px;
  padding: 6px 8px;
  font-size: 11px;
}

.shared-agent-panel .agent-record-button {
  border-color: #ecd6de;
  background: #fff7fa;
  color: var(--pink);
  font-size: 13px;
}

.shared-agent-panel .agent-send-inline {
  min-height: 30px;
  padding: 0 11px;
  border-radius: 999px;
}

.agent-pending-action-pip {
  position: absolute;
  right: 12px;
  bottom: 10px;
  z-index: 2;
  padding: 5px 10px;
  border: 1px solid #e0d3b4;
  border-radius: 999px;
  background: #f3ebdd;
  color: #6f5618;
  font: inherit;
  font-size: 11px;
  font-weight: 900;
  box-shadow: 0 10px 24px rgba(32, 37, 34, 0.16);
  cursor: pointer;
}

.agent-pending-action-pip[hidden] {
  display: none;
}

.agent-action-cards {
  display: grid;
  gap: 8px;
  margin-top: 10px;
  max-width: min(94%, 360px);
}

.agent-action-card {
  display: grid;
  gap: 8px;
  padding: 12px;
  border: 1px solid #d9c78e;
  border-left: 0;
  border-radius: 8px;
  background: #fbf3d8;
  box-shadow: 0 8px 22px rgba(51, 44, 26, 0.06);
}

.agent-action-card > div:first-child {
  display: flex;
  gap: 8px;
  align-items: center;
  justify-content: space-between;
}

.agent-action-card strong {
  min-width: 0;
  overflow: hidden;
  color: #59430e;
  font-size: 13px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.agent-action-card span {
  flex: 0 0 auto;
  padding: 2px 6px;
  border-radius: 999px;
  background: #f5ecd2;
  color: #755a14;
  font-size: 11px;
  font-weight: 900;
}

.agent-action-card p {
  margin: 0;
  color: #6c5110;
  font-size: 12px;
  line-height: 1.4;
}

.agent-action-card details {
  border-top: 1px solid rgba(209, 188, 121, 0.65);
  padding-top: 7px;
}

.agent-action-card summary {
  color: #6c5110;
  cursor: pointer;
  font-size: 12px;
  font-weight: 850;
}

.agent-action-detail {
  display: grid;
  gap: 5px;
  margin-top: 6px;
  color: #6c5110;
  font-size: 12px;
  line-height: 1.45;
}

.agent-action-detail ul {
  margin: 0;
  padding-left: 18px;
}

.agent-action-buttons {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
}

.agent-action-buttons button {
  min-height: 30px;
  padding: 0 9px;
  border: 1px solid #d1bc79;
  border-radius: 8px;
  background: #fff;
  color: #6c5110;
  font: inherit;
  font-size: 12px;
  font-weight: 850;
}

.agent-action-buttons button:first-child {
  border-color: #9dcac1;
  background: #e3f1ee;
  color: #276f68;
}

.agent-action-buttons button:disabled {
  opacity: 0.65;
  cursor: not-allowed;
}

.agent-action-result {
  min-height: 24px;
  padding: 4px 0;
  color: #6c5110;
  font-size: 12px;
  font-weight: 850;
}

.agent-action-card[data-agent-action-state="accepted"],
.agent-action-card[data-agent-action-state="done"] {
  border-color: #b7d7d1;
  border-left-color: #70aaa0;
  background: #f6fbfa;
}

.agent-action-card[data-agent-action-state="accepted"] strong,
.agent-action-card[data-agent-action-state="accepted"] span,
.agent-action-card[data-agent-action-state="accepted"] p,
.agent-action-card[data-agent-action-state="done"] strong,
.agent-action-card[data-agent-action-state="done"] span,
.agent-action-card[data-agent-action-state="done"] p {
  color: #276f68;
}

.agent-action-card[data-agent-action-state="dismissed"] {
  border-color: #d9ddd7;
  border-left-color: #b7beb9;
  background: #f7f7f4;
}

.agent-action-card[data-agent-action-state="dismissed"] strong,
.agent-action-card[data-agent-action-state="dismissed"] span,
.agent-action-card[data-agent-action-state="dismissed"] p {
  color: #6b746f;
}

.agent-action-card[data-agent-action-state="failed"] {
  border-color: #e0b9b3;
  border-left-color: #c87468;
  background: #fbeae7;
}

.agent-summary-card {
  display: grid;
  gap: 10px;
  padding: 13px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
}

.agent-summary-card > span {
  width: fit-content;
  padding: 4px 8px;
  border-radius: 999px;
  background: var(--accent-soft);
  color: var(--accent);
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
}

.agent-summary-card h3 {
  margin: 0;
  font-size: 16px;
}

.agent-summary-card p {
  margin: 0;
  color: var(--text);
  font-size: 13px;
  line-height: 1.5;
}

.agent-summary-actions {
  display: grid;
  gap: 6px;
  padding-top: 8px;
  border-top: 1px solid var(--line);
}

.agent-summary-actions strong {
  font-size: 12px;
  text-transform: uppercase;
}

.agent-summary-actions ul {
  margin: 0;
  padding-left: 18px;
}

.agent-summary-actions li {
  margin: 4px 0;
  color: var(--text);
  font-size: 13px;
}

.agent-summary-card button {
  justify-self: flex-start;
  min-height: 34px;
  padding: 0 11px;
  border: 1px solid var(--accent);
  border-radius: 8px;
  background: #fff;
  color: var(--accent);
  font: inherit;
  font-size: 12px;
  font-weight: 900;
  cursor: pointer;
}

.role-switcher strong {
  color: var(--text);
}

.role-buttons {
  display: flex;
  gap: 5px;
  flex-wrap: wrap;
}

.role-buttons button {
  min-height: 32px;
  padding: 0 12px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: #fff;
  color: var(--muted);
  font: inherit;
  font-size: 12px;
  font-weight: 800;
}

.role-buttons button.active,
.role-buttons button:hover {
  border-color: var(--accent);
  background: var(--accent-soft);
  color: var(--accent);
}

.home-section {
  margin-bottom: 30px;
}

.home-topbar + .home-section {
  padding-top: 4px;
}

.home-section-label {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 14px;
}

.home-section-label span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  white-space: nowrap;
}

.home-section-label::after {
  content: "";
  flex: 1;
  height: 1px;
  background: var(--line);
}

.for-you-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 10px;
}

.for-you-card {
  display: block;
  min-height: 126px;
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel);
  color: inherit;
  cursor: pointer;
  font: inherit;
  text-align: left;
  text-decoration: none;
}

.for-you-card:hover {
  border-color: var(--accent);
}

.for-you-card span {
  display: block;
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.for-you-card strong {
  display: block;
  margin: 9px 0 4px;
  font-size: 23px;
  line-height: 1.08;
}

.for-you-card small {
  display: block;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.4;
}

.for-you-card.hot {
  border-color: #ead0dc;
  background: var(--pink-soft);
}

.for-you-card.hot strong {
  color: var(--pink);
}

.for-you-card.gold {
  border-color: #e6dcc0;
  background: #f3edda;
}

.for-you-card.gold strong {
  color: #a5842f;
}

.module-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
}

.module-card {
  position: relative;
  display: block;
  min-height: 174px;
  padding: 20px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: var(--panel);
  color: inherit;
  text-align: left;
  text-decoration: none;
  transition: transform 140ms ease, box-shadow 140ms ease, border-color 140ms ease;
}

.module-card:hover {
  transform: translateY(-3px);
  border-color: var(--accent);
  box-shadow: 0 10px 26px rgb(0 0 0 / 6%);
}

.module-card.highlight {
  border-color: #c7d8d3;
}

.module-card.disabled {
  background: #fbfbfa;
  cursor: not-allowed;
}

.module-card.disabled:hover {
  transform: translateY(-2px);
  border-color: #c8ccc6;
  box-shadow: 0 8px 20px rgb(0 0 0 / 4%);
}

.module-card-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 15px;
}

.module-icon {
  width: 38px;
  height: 38px;
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  border-radius: 11px;
  background: var(--accent-soft);
  color: var(--accent);
}

.module-icon svg {
  width: 21px;
  height: 21px;
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 2;
}

.module-card.disabled .module-icon {
  background: #edede9;
  color: #9aa19c;
}

.module-status {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  padding: 4px 10px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.02em;
}

.module-status.soon {
  background: #edede9;
  color: var(--muted);
}

.module-status.pending {
  background: var(--gold-soft);
  color: var(--gold);
}

.module-status.ok {
  background: var(--accent-soft);
  color: var(--accent);
}

.module-status.attention {
  background: var(--pink-soft);
  color: var(--pink);
}

.module-status.locked {
  background: #edede9;
  color: var(--muted);
}

.module-card strong {
  display: block;
  margin: 0 0 6px;
  font-size: 18px;
  font-weight: 700;
  line-height: 1.2;
}

.module-card.disabled strong {
  color: #7d857f;
}

.module-card p {
  margin: 0;
  color: var(--muted);
  font-size: 13.5px;
  line-height: 1.5;
}

/* Graphisme */
.graphisme-module {
  max-width: 1200px;
}

.graphic-tabs {
  display: flex;
  gap: 24px;
  margin: 6px 0 22px;
  border-bottom: 1px solid var(--line);
}

.graphic-tab {
  position: relative;
  min-height: 42px;
  padding: 0 0 12px;
  border: 0;
  background: transparent;
  color: var(--muted);
  font: inherit;
  font-size: 14px;
  font-weight: 800;
  cursor: pointer;
}

.graphic-tab span {
  margin-left: 5px;
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
}

.graphic-tab.active {
  color: var(--text);
}

.graphic-tab.active::after {
  content: "";
  position: absolute;
  right: 0;
  bottom: -1px;
  left: 0;
  height: 2px;
  border-radius: 999px;
  background: var(--accent);
}

.graphic-toolbar-compact {
  align-items: center;
}

.graphic-card-section {
  margin-bottom: 34px;
}

.graphic-card-section > .section-title {
  margin-bottom: 14px;
}

.graphic-card-section > .section-title h2 {
  font-size: 30px;
  line-height: 1.08;
}

.graphic-product-sections {
  display: grid;
  gap: 24px;
}

.graphic-product-section {
  display: grid;
  gap: 12px;
}

.graphic-product-section h3 {
  margin: 0;
  color: var(--text);
  font-size: 19px;
  line-height: 1.25;
}

.graphic-card-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(190px, 1fr));
  gap: 14px;
}

.graphic-card {
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel);
  cursor: pointer;
  transition: border-color 0.16s ease, box-shadow 0.16s ease, transform 0.16s ease;
}

.graphic-card:hover {
  transform: translateY(-2px);
  border-color: var(--accent);
  box-shadow: 0 12px 28px rgb(0 0 0 / 7%);
}

.graphic-card-cover {
  position: relative;
  display: grid;
  aspect-ratio: 4 / 3;
  place-items: center;
  overflow: hidden;
  background: var(--accent-soft);
  color: var(--accent);
}

.graphic-card-cover img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.graphic-card-cover span {
  font-size: 32px;
  font-weight: 900;
}

.graphic-card-cover.tone-brand {
  background: linear-gradient(135deg, #ead0dc, #c9d8d4);
  color: var(--accent);
}

.graphic-card-cover.tone-green {
  background: linear-gradient(135deg, #c7d8d3, #8fb3a4);
  color: #ffffff;
}

.graphic-card-cover.tone-blue {
  background: linear-gradient(135deg, #c7d7e2, #82a8bf);
  color: #ffffff;
}

.graphic-card-cover.tone-pink {
  background: linear-gradient(135deg, #ead0dc, #ce8fac);
  color: #ffffff;
}

.graphic-card-cover.tone-gold {
  background: linear-gradient(135deg, #eadfc1, #c9ad7a);
  color: #ffffff;
}

.graphic-card-cover.tone-pod {
  background: linear-gradient(135deg, #ded4ed, #aa93ca);
  color: #ffffff;
}

.graphic-card-body {
  display: grid;
  min-height: 62px;
  align-items: center;
  padding: 12px 13px;
}

.graphic-card h2 {
  margin: 0;
  font-size: 15px;
  line-height: 1.25;
}

.graphic-archive-summary {
  display: grid;
  grid-template-columns: minmax(170px, 240px) 1fr;
  gap: 16px;
  align-items: center;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel);
  cursor: pointer;
  transition: border-color 0.16s ease, box-shadow 0.16s ease, transform 0.16s ease;
}

.graphic-archive-summary:hover {
  transform: translateY(-2px);
  border-color: var(--accent);
  box-shadow: 0 12px 28px rgb(0 0 0 / 7%);
}

.graphic-archive-summary h3 {
  margin: 0 0 5px;
  font-size: 17px;
  line-height: 1.2;
}

.graphic-archive-summary p {
  margin: 0;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.45;
}

.graphic-archive-preview {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 5px;
}

.graphic-archive-preview img {
  width: 100%;
  aspect-ratio: 1;
  border-radius: 7px;
  object-fit: cover;
  background: var(--accent-soft);
}

.graphic-bank {
  display: grid;
  gap: 16px;
}

.graphic-bank-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 18px;
  padding: 18px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel);
}

.graphic-bank-head h2,
.graphic-generated-empty h2 {
  margin: 0 0 6px;
  font-size: 20px;
}

.graphic-bank-head p,
.graphic-generated-empty p,
.graphic-bank-count {
  margin: 0;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.45;
}

.graphic-bank-facets {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}

.graphic-bank-facets .spacer {
  flex: 1;
}

.chipf span {
  font-size: 11px;
  opacity: 0.75;
}

.selectf {
  min-height: 34px;
  padding: 0 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel);
  color: var(--muted);
  font: inherit;
  font-size: 13px;
  font-weight: 800;
}

.graphic-media-grid {
  column-count: 4;
  column-gap: 12px;
}

.graphic-media-card {
  display: inline-block;
  width: 100%;
  margin: 0 0 12px;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel);
  break-inside: avoid;
}

.graphic-bank-media-card {
  overflow: visible;
  border: 0;
  background: transparent;
}

.graphic-media-thumb {
  position: relative;
  display: block;
  width: 100%;
  min-height: 132px;
  overflow: hidden;
  padding: 0;
  border: 0;
  background: var(--accent-soft);
  color: inherit;
  cursor: pointer;
  font: inherit;
}

.graphic-bank-media-card .graphic-media-thumb,
.graphic-bank-media-card .graphic-media-thumb img {
  border-radius: 8px;
}

.graphic-media-thumb img {
  display: block;
  width: 100%;
  min-height: 132px;
  max-height: 300px;
  object-fit: cover;
}

.graphic-media-badge,
.graphic-media-play {
  position: absolute;
  z-index: 1;
  border-radius: 999px;
  font-size: 10px;
  font-weight: 900;
}

.graphic-media-badge {
  top: 8px;
  left: 8px;
  padding: 3px 8px;
  background: rgb(255 255 255 / 88%);
  color: var(--text);
}

.graphic-media-play {
  top: 8px;
  right: 8px;
  padding: 3px 7px;
  background: rgb(32 37 34 / 76%);
  color: #ffffff;
}

.graphic-media-info {
  padding: 10px 11px 8px;
}

.graphic-bank-media-card .graphic-media-info {
  padding: 7px 2px 0;
}

.graphic-media-info strong,
.graphic-media-info small {
  display: block;
}

.graphic-media-info strong {
  overflow-wrap: anywhere;
  font-size: 12.5px;
  line-height: 1.35;
}

.graphic-media-info small {
  margin-top: 4px;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.35;
}

.graphic-media-tags {
  display: flex;
  gap: 5px;
  flex-wrap: wrap;
  margin-top: 7px;
}

.graphic-media-tags span {
  max-width: 100%;
  overflow-wrap: anywhere;
  padding: 3px 6px;
  border-radius: 999px;
  background: var(--accent-soft);
  color: var(--accent);
  font-size: 10.5px;
  font-weight: 850;
  line-height: 1.15;
}

.graphic-media-tags-primary {
  margin-top: 0;
}

.graphic-media-tags-primary span {
  border: 1px solid var(--line);
  background: #fff;
  color: var(--text);
}

.graphic-media-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  justify-content: flex-end;
  padding: 8px 11px 10px;
  border-top: 1px solid var(--line);
}

.graphic-media-actions a,
.graphic-media-actions button {
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--accent);
  cursor: pointer;
  font: inherit;
  font-size: 12px;
  font-weight: 900;
  text-decoration: none;
}

.graphic-generated-empty {
  padding: 18px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel);
}

.graphic-generated-empty .button {
  margin-top: 14px;
}

.graphic-second-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 18px;
  margin-bottom: 16px;
}

.graphic-second-head h1 {
  margin: 0;
  font-size: 26px;
  line-height: 1.12;
}

.graphic-second-head p {
  max-width: 720px;
  margin: 8px 0 0;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.45;
}

.graphic-second-meta {
  display: flex;
  align-items: center;
  gap: 9px;
  flex-wrap: wrap;
  margin-top: 8px;
}

.graphic-second-meta span {
  display: inline-flex;
  padding: 4px 10px;
  border-radius: 999px;
  background: var(--pink-soft);
  color: var(--pink);
  font-size: 11.5px;
  font-weight: 900;
}

.graphic-second-meta small {
  color: var(--muted);
  font-size: 12.5px;
  font-weight: 700;
}

.graphic-props {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 10px;
  margin-bottom: 18px;
}

.graphic-props article {
  min-height: 78px;
  padding: 13px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel);
}

.graphic-props span,
.graphic-props small {
  display: block;
  color: var(--muted);
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.graphic-props strong {
  display: block;
  margin-top: 7px;
  font-size: 14px;
  line-height: 1.25;
}

.graphic-props small {
  margin-top: 4px;
  letter-spacing: 0;
  text-transform: none;
}

.graphic-second-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 300px;
  gap: 18px;
  align-items: start;
}

.graphic-second-main {
  min-width: 0;
}

.graphic-detail-card,
.graphic-studio-card,
.graphic-visual-board,
.graphic-rail-card {
  margin-bottom: 14px;
  padding: 18px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel);
}

.graphic-studio-card {
  border-color: #c9e5df;
  background: var(--accent-soft);
}

.graphic-visual-board {
  padding: 16px;
}

.graphic-visual-hero {
  column-count: 3;
  column-gap: 10px;
  margin-bottom: 18px;
}

.graphic-visual-asset {
  display: inline-block;
  width: 100%;
  margin: 0 0 10px;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fcfcfb;
  color: inherit;
  text-decoration: none;
  break-inside: avoid;
}

.graphic-visual-asset > a,
.graphic-visual-pick {
  display: block;
  width: 100%;
  padding: 0;
  border: 0;
  background: transparent;
  color: inherit;
  cursor: pointer;
  font: inherit;
  text-decoration: none;
}

.graphic-visual-asset:hover {
  border-color: var(--accent);
}

.graphic-visual-pick:focus-visible {
  outline: 3px solid rgba(39, 111, 104, 0.24);
  outline-offset: -3px;
}

.graphic-visual-asset.is-overridden {
  border-color: #c9ad7a;
}

.graphic-visual-image {
  position: relative;
  display: block;
  min-height: 104px;
  background: var(--accent-soft);
}

.graphic-visual-image img {
  display: block;
  width: 100%;
  min-height: 104px;
  max-height: 360px;
  object-fit: cover;
}

.graphic-visual-image em {
  position: absolute;
  top: 8px;
  right: 8px;
  padding: 3px 8px;
  border-radius: 999px;
  background: rgb(32 37 34 / 76%);
  color: #ffffff;
  font-size: 10px;
  font-style: normal;
  font-weight: 900;
}

.graphic-visual-asset strong {
  display: block;
  overflow: hidden;
  padding: 8px 9px;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.25;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.graphic-asset-tags {
  display: flex;
  gap: 5px;
  padding: 0 8px 8px;
  flex-wrap: wrap;
}

.graphic-asset-tags span {
  display: inline-flex;
  min-height: 20px;
  align-items: center;
  padding: 0 7px;
  border-radius: 999px;
  background: #efefeb;
  color: var(--muted);
  font-size: 10px;
  font-weight: 900;
}

.graphic-tag-edit {
  width: calc(100% - 16px);
  min-height: 28px;
  margin: 0 8px 8px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: #fff;
  color: var(--accent);
  font: inherit;
  font-size: 11px;
  font-weight: 900;
  cursor: pointer;
}

.graphic-tag-edit:hover {
  border-color: var(--accent);
  background: var(--accent-soft);
}

.graphic-visual-sections {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.graphic-visual-sections section {
  min-width: 0;
}

.graphic-visual-sections h3 {
  margin: 0 0 8px;
  color: var(--muted);
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.graphic-visual-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(112px, 1fr));
  gap: 8px;
}

.graphic-visual-grid .graphic-visual-asset {
  display: block;
  margin: 0;
}

.graphic-visual-grid .graphic-visual-image {
  height: 92px;
}

.graphic-visual-grid .graphic-visual-image img {
  height: 100%;
  min-height: 0;
  max-height: none;
}

.graphic-purpose-docs {
  margin-top: 12px;
}

.graphic-section-nav {
  position: sticky;
  z-index: 10;
  top: 10px;
  display: flex;
  gap: 7px;
  margin-bottom: 14px;
  padding: 8px;
  overflow-x: auto;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.96);
}

.graphic-second-layout > .graphic-section-nav {
  grid-column: 1 / -1;
  margin-bottom: 0;
}

body.runtime-readonly .graphic-section-nav {
  top: 48px;
}

.graphic-section-nav button {
  display: inline-flex;
  min-height: 32px;
  align-items: center;
  gap: 6px;
  padding: 0 10px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: #fff;
  color: var(--muted);
  cursor: pointer;
  font: inherit;
  font-size: 12px;
  font-weight: 900;
  text-decoration: none;
  white-space: nowrap;
}

.graphic-section-nav button:hover {
  border-color: var(--accent);
  color: var(--accent);
}

.graphic-section-nav span {
  color: inherit;
  font-size: 10px;
  opacity: 0.75;
}

.graphic-tag-section {
  scroll-margin-top: 76px;
}

.graphic-tag-section .graphic-detail-card-head {
  align-items: flex-start;
}

.graphic-tag-section .graphic-detail-card-head p {
  margin: 5px 0 0;
  color: var(--muted);
  font-size: 12.5px;
  line-height: 1.4;
}

.graphic-section-more {
  margin-top: 12px;
}

.graphic-section-more summary {
  display: inline-flex;
  min-height: 34px;
  align-items: center;
  padding: 0 11px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  color: var(--accent);
  font-size: 12px;
  font-weight: 900;
  cursor: pointer;
}

.graphic-section-more .graphic-visual-grid {
  margin-top: 10px;
}

.graphic-tag-dialog {
  width: min(860px, calc(100vw - 28px));
  max-height: min(92vh, 860px);
  border: 1px solid var(--line);
  border-radius: 10px;
  background: #fff;
  color: var(--text);
  box-shadow: 0 24px 70px rgba(32, 37, 34, 0.22);
  overflow: auto;
}

.graphic-tag-dialog::backdrop {
  background: rgb(32 37 34 / 36%);
}

.graphic-tag-dialog form {
  display: grid;
  gap: 14px;
}

.graphic-tag-dialog-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}

.graphic-tag-dialog h2 {
  font-size: 18px;
}

.graphic-tag-preview {
  display: grid;
  min-height: 340px;
  max-height: 58vh;
  place-items: center;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 9px;
  background: var(--bg);
}

.graphic-tag-preview img {
  display: block;
  width: 100%;
  max-height: 58vh;
  object-fit: contain;
}

.graphic-tag-dialog label {
  display: grid;
  gap: 6px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 500;
}

.graphic-tag-dialog select,
.graphic-tag-dialog input,
.graphic-tag-dialog textarea {
  width: 100%;
  padding: 9px 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  color: var(--text);
  font: inherit;
  font-size: 13px;
}

.graphic-tag-source {
  margin: -4px 0 0;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.35;
}

.graphic-tag-check {
  grid-template-columns: 18px 1fr;
  align-items: center;
  color: var(--text) !important;
}

.graphic-tag-check input {
  width: 16px;
  height: 16px;
}

.graphic-tag-dialog-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
  flex-wrap: wrap;
}

.graphic-tag-dialog-actions a {
  margin-right: auto;
  text-decoration: none;
}

.graphic-tag-dialog-actions .graphic-drive-button {
  background: var(--accent);
  color: #fff;
}

.graphic-detail-card-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 14px;
}

.graphic-detail-card-head h2 {
  margin: 0;
  font-size: 16px;
}

.graphic-detail-card-head span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
}

.graphic-detail-card-head button {
  min-height: 30px;
  padding: 0 10px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--panel);
  color: var(--muted);
  font: inherit;
  font-size: 12px;
  font-weight: 800;
  cursor: pointer;
}

.graphic-studio-card p {
  margin: 0 0 13px;
  color: #33564f;
  font-size: 13px;
  line-height: 1.45;
}

.graphic-studio-actions {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}

.graphic-studio-actions button {
  min-height: 34px;
  padding: 0 12px;
  border: 1px solid #bcdcd5;
  border-radius: 999px;
  background: var(--panel);
  color: var(--accent);
  font: inherit;
  font-size: 12px;
  font-weight: 900;
  cursor: pointer;
}

.graphic-block-label {
  margin: 18px 0 9px;
  color: var(--muted);
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.graphic-block-label:first-of-type {
  margin-top: 0;
}

.graphic-logo-slots {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(128px, 1fr));
  gap: 10px;
}

.graphic-logo-slot {
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fcfcfb;
  color: inherit;
  text-decoration: none;
}

.graphic-logo-slot span {
  display: block;
  height: 82px;
  background: var(--accent-soft);
}

.graphic-logo-slot img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.graphic-logo-slot strong {
  display: block;
  overflow: hidden;
  padding: 8px;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.25;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.graphic-empty-context {
  display: grid;
  gap: 4px;
  padding: 13px;
  border: 1px dashed var(--line);
  border-radius: 8px;
  background: #fcfcfb;
}

.graphic-empty-context strong {
  font-size: 13px;
}

.graphic-empty-context span {
  color: var(--muted);
  font-size: 12px;
}

.graphic-swatches {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(112px, 1fr));
  gap: 9px;
}

.graphic-swatches span {
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel);
}

.graphic-swatches i {
  display: block;
  height: 48px;
}

.graphic-swatches strong {
  display: block;
  padding: 7px 8px;
  color: var(--muted);
  font-size: 11px;
}

.graphic-color-cards {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 9px;
}

.graphic-color-cards article {
  display: grid;
  min-height: 102px;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fcfcfb;
}

.graphic-color-cards i {
  display: block;
  height: 54px;
  border-bottom: 1px solid var(--line);
}

.graphic-color-cards strong,
.graphic-color-cards span {
  display: block;
  padding: 0 8px;
}

.graphic-color-cards strong {
  padding-top: 7px;
  color: var(--text);
  font-size: 12px;
  font-weight: 800;
  line-height: 1.25;
}

.graphic-color-cards span {
  padding-bottom: 8px;
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
}

.graphic-context-sources {
  display: grid;
  gap: 8px;
  margin-top: 9px;
}

.graphic-context-sources-compact {
  display: block;
  padding-top: 2px;
}

.graphic-context-sources-compact summary {
  color: var(--muted);
  cursor: pointer;
  font-size: 11.5px;
  font-weight: 800;
}

.graphic-context-sources-compact a:first-of-type {
  margin-top: 8px;
}

.graphic-context-sources a {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 2px 9px;
  align-items: center;
  padding: 9px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fcfcfb;
  color: inherit;
  text-decoration: none;
}

.graphic-context-sources i {
  grid-row: span 2;
  width: 34px;
  height: 34px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background:
    linear-gradient(135deg, #e7b3be 0 24%, #d28696 24% 48%, #f0d6d2 48% 72%, #b95f7b 72%);
}

.graphic-context-sources span {
  overflow-wrap: anywhere;
  font-size: 12.5px;
  font-weight: 800;
  line-height: 1.25;
}

.graphic-context-sources small {
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
}

.graphic-type-visuals {
  display: grid;
  gap: 9px;
  margin-bottom: 9px;
}

.graphic-type-visuals a {
  display: block;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fcfcfb;
  color: inherit;
  text-decoration: none;
}

.graphic-type-visuals img {
  display: block;
  width: 100%;
  aspect-ratio: 1.8;
  object-fit: contain;
  background: #fff;
}

.graphic-type-visuals span {
  display: block;
  padding: 7px 9px;
  border-top: 1px solid var(--line);
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
}

.graphic-type-list {
  display: grid;
  gap: 8px;
}

.graphic-type-list article {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 11px 13px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fcfcfb;
}

.graphic-type-list strong {
  overflow-wrap: anywhere;
  font-size: 13px;
}

.graphic-type-list span {
  color: var(--muted);
  font-size: 12px;
  text-align: right;
}

.graphic-type-list a {
  color: var(--accent);
  text-decoration: none;
}

.graphic-mood-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(104px, 1fr));
  gap: 8px;
  margin-bottom: 14px;
}

.graphic-mood-grid a {
  display: block;
  overflow: hidden;
  height: 84px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--accent-soft);
}

.graphic-mood-grid img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.graphic-detail-rows {
  display: grid;
  gap: 8px;
}

.graphic-detail-rows div,
.graphic-rail-links a {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fcfcfb;
}

.graphic-detail-rows strong,
.graphic-rail-links span {
  font-size: 13px;
}

.graphic-detail-rows span,
.graphic-rail-links small {
  color: var(--muted);
  font-size: 11.5px;
  font-weight: 800;
}

.graphic-detail-rail {
  position: sticky;
  top: 18px;
}

.graphic-rail-card h3 {
  margin: 0 0 12px;
  color: var(--muted);
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.graphic-rail-card .drive-file-row {
  padding: 8px;
}

.graphic-rail-card .drive-file-type {
  display: none;
}

.graphic-rail-links {
  display: grid;
  gap: 7px;
}

.graphic-rail-links a {
  color: inherit;
  text-decoration: none;
}

.graphic-detail-head {
  margin-top: 4px;
}

.graphic-logo {
  background: var(--accent-soft);
  color: var(--accent);
}

.graphic-logo span {
  display: grid;
  width: 100%;
  height: 100%;
  place-items: center;
  font-weight: 900;
}

.graphic-context-list {
  display: grid;
  gap: 8px;
}

.graphic-context-list > span {
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.graphic-context-list > strong {
  display: flex;
  align-items: center;
  gap: 7px;
  flex-wrap: wrap;
  color: var(--text);
  font-size: 13px;
  line-height: 1.35;
}

.graphic-context-list i {
  display: inline-flex;
  width: 16px;
  height: 16px;
  border: 1px solid var(--line);
  border-radius: 999px;
}

.graphic-purpose-card > p {
  margin: -4px 0 14px;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.45;
}

.graphic-preview-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(112px, 1fr));
  gap: 8px;
}

.graphic-preview-grid a {
  display: block;
  overflow: hidden;
  height: 92px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--accent-soft);
}

.graphic-preview-grid img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* Finance */

.readonly-badge {
  display: inline-flex;
  align-items: center;
  min-height: 32px;
  padding: 0 11px;
  border: 1px solid #d9cba8;
  border-radius: 999px;
  background: var(--gold-soft);
  color: var(--gold);
  font-size: 12px;
  font-weight: 800;
}

.finance-access-switch {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 3px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #f1f3ef;
}

.finance-access-switch[hidden] {
  display: none;
}

.finance-access-switch button {
  min-height: 30px;
  padding: 0 10px;
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: var(--muted);
  font: inherit;
  font-size: 12px;
  font-weight: 800;
  cursor: pointer;
}

.finance-access-switch button.active {
  background: var(--panel);
  color: var(--ink);
  box-shadow: 0 8px 20px rgba(32, 37, 34, 0.08);
}

.finance-module {
  max-width: 1240px;
  --finance-rev: #2b8a6a;
  --finance-rev-soft: #e4f3ec;
  --finance-profit: #1a6b4f;
  --finance-profit-soft: #dff0e7;
  --finance-expense: #b5695e;
  --finance-expense-soft: #f7ebe8;
  --finance-loss: #b02f24;
  --finance-loss-soft: #fae7e4;
  --finance-dividend: #7a5bb0;
  --finance-dividend-soft: #efe9f7;
  --finance-neutral: #8d968f;
}

.finance-toolbar {
  align-items: center;
  justify-content: flex-start;
}

.finance-toolbar select {
  flex: 0 0 auto;
  min-width: 120px;
}

.finance-toolbar.overview-only {
  justify-content: flex-start;
}

.finance-view-switch {
  flex: 1 1 auto;
  width: 100%;
}

.finance-view-switch .finance-treasury-tab {
  margin-left: auto;
  border-color: #d8cee8;
  background: #fbf8ff;
  color: var(--finance-dividend);
}

.finance-view-switch .finance-treasury-tab:hover,
.finance-view-switch .finance-treasury-tab.active {
  border-color: var(--finance-dividend);
  background: var(--finance-dividend-soft);
  color: var(--finance-dividend);
}

.finance-filter-controls {
  margin-left: auto;
  justify-content: flex-end;
}

.finance-subnav {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 8px;
  margin: 0 0 18px;
}

.finance-subnav button {
  min-height: 32px;
  padding: 0 12px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--panel);
  color: var(--muted);
  font: inherit;
  font-size: 12.5px;
  font-weight: 750;
  cursor: pointer;
}

.finance-subnav button.active,
.finance-subnav button:hover {
  border-color: var(--accent);
  background: var(--accent-soft);
  color: var(--accent);
}

.finance-source-note {
  display: none;
}

.finance-kpis {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 16px;
  margin-bottom: 16px;
}

.finance-kpi,
.finance-card {
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel);
}

.finance-kpi {
  position: relative;
  overflow: hidden;
  min-height: 112px;
  padding: 15px 16px;
}

.finance-kpi::before,
.finance-card::before {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  width: 4px;
  background: transparent;
}

.finance-kpi.highlight {
  border-color: #c9e5df;
  background: var(--accent-soft);
}

.finance-kpi.revenue {
  border-color: #b9ded6;
  background: #f4faf8;
}

.finance-kpi.revenue::before {
  background: var(--finance-rev);
}

.finance-kpi.expense {
  border-color: #e5c4bd;
  background: var(--finance-expense-soft);
}

.finance-kpi.expense::before {
  background: var(--finance-expense);
}

.finance-kpi.profit,
.finance-kpi.highlight {
  border-color: #b9d9ca;
  background: var(--finance-profit-soft);
}

.finance-kpi.profit::before,
.finance-kpi.highlight::before {
  background: var(--finance-profit);
}

.finance-kpi.profit.negative,
.finance-kpi.margin.negative {
  border-color: #edc1ba;
  background: var(--finance-loss-soft);
}

.finance-kpi.profit.negative::before,
.finance-kpi.margin.negative::before {
  background: var(--finance-loss);
}

.finance-kpi.margin::before {
  background: var(--finance-neutral);
}

.finance-kpi.dividend {
  border-color: #d8cee8;
  background: var(--finance-dividend-soft);
}

.finance-kpi.dividend::before {
  background: var(--finance-dividend);
}

.finance-kpi span {
  display: block;
  color: var(--muted);
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

.finance-kpi strong {
  display: block;
  margin-top: 8px;
  font-size: 24px;
  line-height: 1.1;
  font-weight: 900;
  font-variant-numeric: tabular-nums;
}

.finance-kpi.revenue strong,
.finance-revenue-text {
  color: var(--finance-rev);
}

.finance-kpi.expense strong,
.finance-expense-text {
  color: var(--finance-expense);
}

.finance-expense-muted-text {
  color: #9a5a51;
}

.finance-kpi.profit strong,
.finance-kpi.highlight strong,
.finance-profit-text {
  color: var(--finance-profit);
}

.finance-kpi.profit.negative strong,
.finance-kpi.margin.negative strong,
.finance-loss-text {
  color: var(--finance-loss);
}

.finance-kpi.dividend strong,
.finance-dividend-text {
  color: var(--finance-dividend);
}

.finance-kpi small {
  display: block;
  min-height: 18px;
  margin-top: 7px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 750;
}

.finance-kpi .up,
.finance-table .up {
  color: var(--finance-profit);
}

.finance-kpi .down,
.finance-table .down {
  color: var(--finance-loss);
}

.finance-card {
  position: relative;
  overflow: hidden;
  margin-bottom: 14px;
  padding: 17px 18px;
}

.finance-card.wide {
  overflow: hidden;
}

.finance-grid-2 .finance-card.wide {
  min-width: 0;
}

.finance-card-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 14px;
}

.finance-card-head h2 {
  font-size: 18px;
  font-weight: 900;
  line-height: 1.2;
}

.finance-card-head span {
  display: none;
}

.finance-grid-2 {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.finance-table-wrap {
  overflow-x: auto;
}

.finance-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 13.5px;
}

.finance-table th {
  padding: 0 10px 9px;
  border-bottom: 1px solid var(--line);
  color: var(--muted);
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 0.04em;
  text-align: right;
  text-transform: uppercase;
  white-space: nowrap;
}

.finance-table th:first-child {
  text-align: left;
}

.finance-table td {
  padding: 9px 10px;
  border-bottom: 1px solid #f1f1ed;
  text-align: right;
  white-space: nowrap;
}

.finance-table td:first-child {
  max-width: 360px;
  overflow: hidden;
  text-align: left;
  text-overflow: ellipsis;
}

.finance-table td small {
  display: block;
  margin-top: 3px;
  color: var(--muted);
  font-size: 11px;
  font-weight: 500;
  line-height: 1.35;
}

.finance-entity-link {
  color: var(--ink);
  font-weight: 800;
  text-decoration: none;
}

.finance-entity-link:hover {
  color: var(--accent);
  text-decoration: underline;
  text-underline-offset: 3px;
}

.finance-launch-table th:first-child,
.finance-launch-table td:first-child,
.finance-product-table th:first-child,
.finance-product-table td:first-child {
  min-width: 220px;
}

.finance-launch-table td {
  vertical-align: top;
}

.finance-table tr.total td {
  border-top: 1px solid var(--line);
  border-bottom: 0;
  background: #fbfbfa;
  font-weight: 900;
}

.finance-table tr.finance-section-row td {
  padding-top: 18px;
  border-bottom: 1px solid var(--line);
  color: var(--muted);
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 0;
  text-align: left;
  text-transform: uppercase;
}

.finance-table tr.finance-subtotal-row td {
  border-top: 1px solid #ecece6;
  background: #fbfbfa;
  color: var(--ink);
  font-weight: 900;
}

.finance-table tfoot td {
  border-top: 1px solid var(--line);
  border-bottom: 0;
  background: #fbfbfa;
  font-weight: 900;
}

.finance-category-card.revenue .finance-table tfoot td {
  background: #f4faf8;
}

.finance-category-card.expense .finance-table tfoot td {
  background: var(--finance-expense-soft);
}

.finance-win-row:hover td {
  background: var(--finance-profit-soft);
}

.finance-loss-row:hover td {
  background: var(--finance-loss-soft);
}

.finance-click-row {
  cursor: pointer;
}

.finance-click-row:hover td,
.finance-click-row.active td {
  background: #f3f8f6;
}

.finance-pill {
  display: inline-flex;
  margin-left: 6px;
  padding: 2px 7px;
  border-radius: 999px;
  background: #f3edda;
  color: #7d641f;
  font-size: 10.5px;
  font-weight: 900;
  vertical-align: 1px;
}

.finance-status-pill {
  display: inline-flex;
  min-width: 48px;
  justify-content: center;
  padding: 2px 8px;
  border-radius: 999px;
  font-size: 10.5px;
  font-weight: 900;
}

.finance-status-pill.ok {
  background: var(--finance-profit-soft);
  color: var(--finance-profit);
}

.finance-status-pill.no {
  background: var(--finance-loss-soft);
  color: var(--finance-loss);
}

.finance-status-pill.review {
  background: #fbf7ec;
  color: #7d641f;
}

.finance-table .num {
  font-variant-numeric: tabular-nums;
}

.finance-bar {
  display: inline-block;
  height: 7px;
  border-radius: 999px;
  background: var(--finance-rev);
  vertical-align: middle;
}

.finance-bar.expense {
  background: var(--finance-expense);
}

.finance-bar.salary {
  background: var(--finance-dividend);
}

.finance-month-chart {
  display: grid;
  grid-template-columns: repeat(12, minmax(34px, 1fr));
  gap: 10px;
  height: 230px;
  padding-top: 12px;
}

.finance-month-bar {
  display: grid;
  grid-template-rows: 1fr 20px;
  min-width: 34px;
  align-items: end;
}

.finance-bars {
  display: flex;
  align-items: end;
  justify-content: center;
  gap: 3px;
  height: 190px;
  border-bottom: 1px solid var(--line);
}

.finance-bars span {
  width: 12px;
  min-height: 2px;
  border-radius: 3px 3px 0 0;
}

.finance-bars .revenue,
.finance-legend .revenue {
  background: var(--finance-rev);
}

.finance-bars .expense,
.finance-legend .expense {
  background: var(--finance-expense);
}

.finance-month-bar small {
  align-self: end;
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
  text-align: center;
}

.finance-legend {
  display: flex;
  gap: 16px;
  margin-top: 10px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
}

.finance-legend i {
  display: inline-block;
  width: 10px;
  height: 10px;
  margin-right: 6px;
  border-radius: 3px;
  vertical-align: -1px;
}

.finance-line-chart {
  display: block;
  width: 100%;
  height: 300px;
  overflow: visible;
}

.finance-line-chart polyline {
  fill: none;
  stroke-width: 3;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.finance-line-chart polyline.revenue,
.finance-line-chart polyline.expense,
.finance-line-chart polyline.profit,
.finance-line-chart polyline.result,
.finance-line-chart polyline.dividend,
.finance-line-chart polyline.total {
  fill: none;
}

.finance-line-chart circle {
  stroke: var(--panel);
  stroke-width: 2;
}

.finance-line-chart .revenue,
.finance-legend .revenue {
  stroke: var(--finance-rev);
  fill: var(--finance-rev);
  background: var(--finance-rev);
}

.finance-line-chart .expense,
.finance-legend .expense {
  stroke: var(--finance-expense);
  fill: var(--finance-expense);
  background: var(--finance-expense);
}

.finance-line-chart .profit,
.finance-legend .profit {
  stroke: var(--finance-profit);
  fill: var(--finance-profit);
  background: var(--finance-profit);
}

.finance-line-chart .result,
.finance-legend .result {
  stroke: var(--blue);
  fill: var(--blue);
  background: var(--blue);
}

.finance-line-chart .total,
.finance-legend .total {
  stroke: var(--finance-dividend);
  fill: var(--finance-dividend);
  background: var(--finance-dividend);
}

.finance-line-chart .dividend,
.finance-legend .dividend {
  stroke: var(--finance-dividend);
  fill: var(--finance-dividend);
  background: var(--finance-dividend);
}

.finance-line-chart .loss,
.finance-legend .loss {
  stroke: var(--finance-loss);
  fill: var(--finance-loss);
  background: var(--finance-loss);
}

.finance-line-chart .neutral,
.finance-legend .neutral {
  stroke: var(--finance-neutral);
  fill: var(--finance-neutral);
  background: var(--finance-neutral);
}

.finance-line-chart polyline.revenue,
.finance-line-chart polyline.expense,
.finance-line-chart polyline.profit,
.finance-line-chart polyline.result,
.finance-line-chart polyline.dividend,
.finance-line-chart polyline.total,
.finance-line-chart polyline.loss,
.finance-line-chart polyline.neutral {
  fill: none;
}

.finance-line-chart .dashed {
  stroke-dasharray: 5 4;
  stroke-width: 2;
}

.finance-chart-grid {
  stroke: #ecece8;
  stroke-width: 1;
}

.finance-chart-grid.zero {
  stroke: #b9bfba;
  stroke-width: 1.5;
}

.finance-chart-axis {
  stroke: var(--line);
  stroke-width: 1.5;
}

.finance-chart-label {
  fill: var(--muted);
  font-size: 12px;
  font-weight: 800;
}

.finance-chart-value {
  fill: var(--muted);
  font-size: 11px;
  font-weight: 900;
}

.finance-svg-revenue {
  fill: var(--finance-rev);
}

.finance-svg-expense,
.finance-waterfall .expense {
  fill: var(--finance-expense);
}

.finance-waterfall .revenue {
  fill: var(--finance-rev);
}

.finance-waterfall .profit,
.finance-waterfall .final {
  fill: var(--finance-profit);
}

.finance-waterfall .dividend {
  fill: var(--finance-dividend);
}

.finance-waterfall .loss {
  fill: var(--finance-loss);
}

.finance-annual-trajectory .partial {
  opacity: 0.48;
}

.finance-break-even {
  stroke: var(--finance-neutral);
  stroke-width: 1.5;
  stroke-dasharray: 6 4;
}

.finance-month-rhythm .profit-zone {
  fill: var(--finance-profit);
  opacity: 0.1;
}

.finance-month-rhythm .loss-zone {
  fill: var(--finance-loss);
  opacity: 0.12;
}

.finance-line-swatch {
  height: 2px !important;
  width: 16px !important;
  border-radius: 0 !important;
  vertical-align: 3px !important;
}

.finance-note {
  margin: 11px 0 0;
  padding-top: 10px;
  border-top: 1px solid #f2f2ee;
  color: var(--muted);
  font-size: 11.5px;
  font-weight: 750;
}

.finance-palette {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  margin: 0 0 16px;
  padding: 11px 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel);
  color: var(--muted);
  font-size: 11.5px;
  font-weight: 800;
}

.finance-palette span {
  display: inline-flex;
  align-items: center;
  gap: 7px;
}

.finance-palette i {
  display: inline-block;
  width: 11px;
  height: 11px;
  border-radius: 3px;
}

.finance-palette .revenue {
  background: var(--finance-rev);
}

.finance-palette .profit {
  background: var(--finance-profit);
}

.finance-palette .expense {
  background: var(--finance-expense);
}

.finance-palette .loss {
  background: var(--finance-loss);
}

.finance-palette .dividend {
  background: var(--finance-dividend);
}

.finance-palette .neutral {
  background: var(--finance-neutral);
}

.finance-category-card.revenue {
  background: #f4faf8;
}

.finance-category-card.expense {
  background: var(--finance-expense-soft);
}

.finance-annual-table tbody td:not(:first-child) {
  font-weight: 850;
}

.finance-matrix-table tbody td:not(:first-child) {
  font-weight: 500;
}

.finance-matrix-table tbody td:nth-last-child(2),
.finance-matrix-table tbody td:last-child {
  font-weight: 850;
}

.finance-matrix-table .finance-row-total {
  font-weight: 850;
}

.finance-matrix-table .finance-subcategory {
  padding-left: 24px;
  color: var(--muted);
  font-size: 12.5px;
  font-weight: 500;
}

.finance-matrix-table tbody tr:has(.finance-subcategory) td {
  color: var(--muted);
  font-size: 12.5px;
}

.finance-tension-bars {
  display: grid;
  gap: 18px;
}

.finance-tension-bars > div > span {
  display: block;
  margin-bottom: 6px;
  color: var(--muted);
  font-size: 11.5px;
  font-weight: 900;
  text-transform: uppercase;
}

.finance-tension-track {
  position: relative;
  display: flex;
  align-items: center;
  min-height: 32px;
  border-bottom: 1px solid var(--line);
}

.finance-tension-track i {
  display: block;
  height: 28px;
}

.finance-tension-track i.revenue {
  border-radius: 4px;
  background: var(--finance-rev);
}

.finance-tension-track i.loss {
  border-radius: 4px 0 0 4px;
  background: var(--finance-loss);
}

.finance-tension-track i.expense {
  border-radius: 0 4px 4px 0;
  background: var(--finance-expense);
}

.finance-tension-track b {
  margin-left: 8px;
  color: var(--text);
  font-size: 13px;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}

.finance-month-summary {
  margin-top: -2px;
}

.finance-month-kpis {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}

.finance-month-kpis .finance-kpi {
  min-height: 94px;
}

.finance-salary-summary {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  margin-bottom: 14px;
}

.finance-salary-summary .finance-kpi {
  min-height: 88px;
}

.finance-salary-layout {
  display: grid;
  grid-template-columns: minmax(180px, 260px) minmax(0, 1fr);
  gap: 18px;
  align-items: start;
}

.finance-salary-layout .finance-salary-summary {
  grid-template-columns: 1fr;
  margin-bottom: 0;
}

.finance-salary-layout .finance-kpi {
  min-height: 82px;
}

.finance-salary-table tr.total + tr:not(.total) td {
  border-top: 1px solid var(--line);
}

.finance-salary-table tr.salary-total td,
.finance-salary-table tr.dividend-row td {
  padding-top: 16px;
}

.finance-salary-table tr.salary-total td:first-child,
.finance-salary-table tr.dividend-row td:first-child {
  position: relative;
}

.finance-salary-table tr.salary-total td:first-child::before,
.finance-salary-table tr.dividend-row td:first-child::before {
  content: "";
  position: absolute;
  top: 7px;
  left: 10px;
  right: 10px;
  height: 1px;
  background: var(--line);
}

.finance-salary-table tr.salary-total td {
  border-top: 2px solid var(--line);
}

.finance-detail-groups,
.finance-breakdown-list {
  display: grid;
  gap: 8px;
}

.finance-detail-group {
  border: 1px solid #efefea;
  border-radius: 8px;
  background: #fff;
}

.finance-detail-group summary {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto auto;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  cursor: pointer;
  list-style: none;
}

.finance-detail-group summary::-webkit-details-marker {
  display: none;
}

.finance-detail-group summary::before {
  content: "+";
  grid-column: 1;
  width: 18px;
  height: 18px;
  border-radius: 999px;
  background: #f3f3ef;
  color: var(--muted);
  font-size: 13px;
  font-weight: 900;
  line-height: 18px;
  text-align: center;
}

.finance-detail-group[open] summary::before {
  content: "-";
}

.finance-detail-group summary span {
  grid-column: 2;
  min-width: 0;
  overflow: hidden;
  font-weight: 900;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.finance-detail-group summary small {
  color: var(--muted);
  font-size: 11.5px;
  font-weight: 800;
  white-space: nowrap;
}

.finance-detail-group summary b,
.finance-group-total b {
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}

.finance-detail-group.revenue summary b {
  color: var(--finance-rev);
}

.finance-detail-group.expense summary b {
  color: var(--finance-expense);
}

.finance-detail-table {
  font-size: 12.5px;
}

.finance-detail-table th {
  padding-top: 0;
}

.finance-detail-table td:first-child {
  max-width: 300px;
}

.finance-month-line-table tr.total td {
  border-top: 2px solid var(--line);
}

.finance-group-total {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-top: 10px;
  padding: 11px 12px;
  border-top: 1px solid var(--line);
  background: #fbfbfa;
  font-weight: 900;
}

.finance-breakdown-list > div {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 8px 12px;
}

.finance-breakdown-list span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 900;
}

.finance-breakdown-list b {
  font-variant-numeric: tabular-nums;
}

.finance-breakdown-list i {
  grid-column: 1 / -1;
  display: block;
  height: 8px;
  border-radius: 999px;
}

.finance-breakdown-list i.expense {
  background: var(--finance-expense);
}

.finance-breakdown-list i.revenue {
  background: var(--finance-rev);
}

.finance-breakdown-list i.dividend {
  background: var(--finance-dividend);
}

.finance-breakdown-list i.neutral {
  background: var(--finance-neutral);
}

.finance-pie-block {
  margin-top: 18px;
  padding-top: 18px;
  border-top: 1px solid #ecece6;
}

.finance-pie-block h3 {
  margin: 0 0 12px;
  color: var(--muted);
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  text-align: center;
}

.finance-pie-layout {
  display: flex;
  justify-content: center;
  min-width: 0;
}

.finance-pie-chart {
  display: block;
  width: min(230px, 100%);
  max-width: 100%;
  height: auto;
  aspect-ratio: 1;
}

.finance-pie-bg {
  fill: none;
  stroke: #eeeeea;
  stroke-width: 24;
}

.finance-pie-segment {
  fill: none;
  cursor: pointer;
  outline: none;
  stroke-width: 24;
  transition: opacity 140ms ease, stroke-width 140ms ease;
}

.finance-pie-segment:hover,
.finance-pie-segment:focus-visible {
  opacity: 0.84;
  stroke-width: 28;
}

.finance-pie-segment.revenue,
.finance-pie-legend i.revenue {
  stroke: var(--finance-rev);
  background: var(--finance-rev);
}

.finance-pie-segment.expense,
.finance-pie-legend i.expense {
  stroke: var(--finance-expense);
  background: var(--finance-expense);
}

.finance-pie-segment.profit,
.finance-pie-legend i.profit {
  stroke: var(--finance-profit);
  background: var(--finance-profit);
}

.finance-pie-segment.dividend,
.finance-pie-legend i.dividend {
  stroke: var(--finance-dividend);
  background: var(--finance-dividend);
}

.finance-pie-segment.total,
.finance-pie-legend i.total {
  stroke: var(--blue);
  background: var(--blue);
}

.finance-pie-segment.neutral,
.finance-pie-legend i.neutral {
  stroke: var(--finance-neutral);
  background: var(--finance-neutral);
}

.finance-pie-segment.loss,
.finance-pie-legend i.loss {
  stroke: var(--finance-loss);
  background: var(--finance-loss);
}

.finance-pie-segment.revenue-soft,
.finance-pie-legend i.revenue-soft {
  stroke: #8fcabd;
  background: #8fcabd;
}

.finance-pie-total {
  fill: var(--text);
  font-size: 12px;
  font-weight: 900;
}

.finance-pie-caption {
  fill: var(--muted);
  font-size: 8.5px;
  font-weight: 900;
  text-transform: uppercase;
}

.finance-pie-legend {
  display: grid;
  gap: 7px;
  min-width: 0;
}

.finance-pie-legend span {
  display: grid;
  grid-template-columns: 10px minmax(0, 1fr) auto;
  align-items: center;
  gap: 7px;
  color: var(--muted);
  font-size: 12px;
}

.finance-pie-legend i {
  width: 10px;
  height: 10px;
  border-radius: 3px;
}

.finance-pie-legend b {
  min-width: 0;
  overflow: hidden;
  color: var(--text);
  font-weight: 800;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.finance-pie-legend em {
  color: var(--muted);
  font-style: normal;
  font-variant-numeric: tabular-nums;
  font-weight: 900;
}

.finance-treasury-table {
  table-layout: fixed;
  font-size: 12.5px;
}

.finance-treasury-table th,
.finance-treasury-table td {
  padding-right: 6px;
  padding-left: 6px;
}

.finance-treasury-table th:first-child,
.finance-treasury-table td:first-child {
  width: 24%;
  min-width: 0;
}

.finance-treasury-table th:nth-child(2),
.finance-treasury-table td:nth-child(2) {
  width: 18%;
}

.finance-treasury-table th:nth-child(3),
.finance-treasury-table td:nth-child(3) {
  width: 12%;
}

.finance-treasury-table th:nth-child(4),
.finance-treasury-table td:nth-child(4) {
  width: 17%;
}

.finance-treasury-table th:nth-child(5),
.finance-treasury-table td:nth-child(5) {
  width: 18%;
}

.finance-treasury-table th:nth-child(6),
.finance-treasury-table td:nth-child(6) {
  width: 11%;
}

.finance-treasury-table .finance-crypto-row td {
  background: #fcfbff;
}

.finance-attention {
  display: grid;
  gap: 8px;
}

.finance-attention p {
  margin: 0;
  padding: 10px 12px;
  border: 1px solid #eadfbe;
  border-radius: 8px;
  background: #fbf7ec;
  color: #6f5420;
  font-size: 13px;
  font-weight: 750;
}

@media (max-width: 980px) {
  .finance-kpis,
  .finance-grid-2,
  .finance-month-kpis,
  .finance-salary-summary,
  .finance-salary-layout {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .finance-view-switch {
    width: 100%;
    margin-left: 0;
  }

  .finance-view-switch .finance-treasury-tab {
    margin-left: 0;
  }
}

@media (max-width: 640px) {
  .finance-kpis,
  .finance-grid-2,
  .finance-month-kpis,
  .finance-salary-summary,
  .finance-salary-layout {
    grid-template-columns: 1fr;
  }

  .finance-line-chart {
    min-width: 700px;
  }

  .finance-card.wide {
    overflow-x: auto;
  }

  .finance-month-chart {
    grid-template-columns: repeat(6, minmax(34px, 1fr));
    height: auto;
  }

  .finance-bars {
    height: 120px;
  }
}

@media (max-width: 980px) {
  .graphic-media-grid {
    column-count: 3;
  }
}

@media (max-width: 720px) {
  .graphic-tabs {
    gap: 14px;
    overflow-x: auto;
  }

  .graphic-archive-summary {
    grid-template-columns: 1fr;
  }

  .graphic-bank-head {
    display: grid;
  }

  .graphic-second-head,
  .graphic-second-layout {
    grid-template-columns: 1fr;
  }

  .graphic-second-head {
    display: grid;
  }

  .graphic-detail-rail {
    position: static;
  }

  .graphic-media-grid {
    column-count: 2;
  }

  .graphic-visual-hero {
    column-count: 2;
  }

  .graphic-visual-sections {
    grid-template-columns: 1fr;
  }
}

/* OpenClaw pipeline */
.openclaw-module {
  max-width: 1180px;
}

.openclaw-summary {
  margin-bottom: 28px;
}

.openclaw-status-summary {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.openclaw-nav-summary {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  margin-top: 12px;
}

.openclaw-stat {
  min-height: 126px;
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel);
}

.openclaw-nav-stat {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  gap: 8px 14px;
  align-items: center;
  min-height: 72px;
  padding: 13px 15px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel);
  color: inherit;
  text-decoration: none;
}

.openclaw-nav-stat:hover {
  border-color: var(--accent);
  box-shadow: 0 0 0 3px var(--accent-soft);
}

.openclaw-nav-stat span,
.openclaw-nav-stat small {
  display: block;
  grid-column: 1;
}

.openclaw-nav-stat span {
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.openclaw-nav-stat strong {
  grid-column: 2;
  grid-row: 1 / span 2;
  color: var(--accent);
  font-size: 22px;
}

.openclaw-nav-stat small {
  color: var(--muted);
  font-size: 12px;
}

.openclaw-nav-stat b {
  grid-column: 3;
  grid-row: 1 / span 2;
  color: var(--accent);
  font-size: 18px;
}

.openclaw-stat span,
.openclaw-stat small {
  display: block;
}

.openclaw-stat span {
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.openclaw-stat strong {
  display: block;
  margin: 9px 0 4px;
  color: var(--text);
  font-size: 24px;
  line-height: 1.08;
}

.openclaw-stat small {
  color: var(--muted);
  font-size: 12px;
  line-height: 1.4;
}

.openclaw-stat.gold {
  border-color: #e6dcc0;
  background: var(--gold-soft);
}

.openclaw-stat.gold strong {
  color: var(--gold);
}

.openclaw-stat.green {
  border-color: #c7d8d3;
  background: var(--accent-soft);
}

.openclaw-stat.green strong {
  color: var(--accent);
}

.openclaw-stat.pink {
  border-color: #ead0dc;
  background: var(--pink-soft);
}

.openclaw-stat.pink strong {
  color: var(--pink);
}

.openclaw-stat.pending {
  border-color: #efd1cc;
  background: #fff7f5;
}

.openclaw-stat.pending strong {
  color: #9a3428;
}

.openclaw-stat.running {
  border-color: #efd8b8;
  background: #fff8ed;
}

.openclaw-stat.running strong {
  color: #a65f16;
}

.openclaw-stat.completed {
  border-color: #c7d8d3;
  background: var(--accent-soft);
}

.openclaw-stat.completed strong {
  color: var(--accent);
}

.openclaw-stat.failed {
  border-color: #ead0dc;
  background: var(--pink-soft);
}

.openclaw-stat.failed strong {
  color: var(--pink);
}

.openclaw-board-section {
  margin-bottom: 28px;
}

.openclaw-status-section {
  margin-bottom: 28px;
}

.openclaw-status-grid {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 22px;
  padding: 12px 16px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--panel);
}

.openclaw-status-card {
  min-height: 126px;
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: var(--panel);
}

.openclaw-status-card.online {
  border-color: #c7d8d3;
  background: var(--accent-soft);
}

.openclaw-status-card.offline {
  border-color: #ead0dc;
  background: var(--pink-soft);
}

.openclaw-status-card.pending {
  border-color: #e6dcc0;
  background: var(--gold-soft);
}

.openclaw-status-top {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 12px;
}

.openclaw-status-dot {
  width: 9px;
  height: 9px;
  border-radius: 999px;
  background: var(--muted);
}

.openclaw-status-dot.online {
  background: var(--accent);
  box-shadow: 0 0 0 4px var(--accent-soft);
}

.openclaw-status-dot.pending {
  background: var(--gold);
  box-shadow: 0 0 0 4px var(--gold-soft);
}

.openclaw-status-card.online .openclaw-status-dot {
  background: var(--accent);
}

.openclaw-status-card.offline .openclaw-status-dot {
  background: var(--pink);
}

.openclaw-status-card.pending .openclaw-status-dot {
  background: var(--gold);
}

.openclaw-status-card small {
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.openclaw-status-card strong {
  display: block;
  margin-bottom: 6px;
  color: var(--text);
  font-size: 22px;
  line-height: 1.1;
}

.openclaw-status-card.online strong {
  color: var(--accent);
}

.openclaw-status-card.offline strong {
  color: var(--pink);
}

.openclaw-status-card.pending strong {
  color: var(--gold);
}

.openclaw-status-card p {
  margin: 0;
  color: var(--muted);
  font-size: 12.5px;
  line-height: 1.4;
}

.openclaw-board {
  display: block;
}

.openclaw-column {
  min-height: 360px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: #fbfbfa;
}

.openclaw-column header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 12px;
}

.openclaw-column h2 {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin: 0;
  font-size: 15px;
}

.openclaw-column-dot {
  display: inline-block;
  width: 9px;
  height: 9px;
  flex: 0 0 auto;
  border-radius: 999px;
  background: var(--muted);
}

.openclaw-column header span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 28px;
  height: 24px;
  padding: 0 8px;
  border-radius: 999px;
  background: var(--panel);
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
}

.openclaw-column.pending {
  border-color: #efd1cc;
}

.openclaw-column.pending .openclaw-column-dot {
  background: #9a3428;
}

.openclaw-column.pending header span {
  background: #fae9e7;
  color: #9a3428;
}

.openclaw-column.running {
  border-color: #efd8b8;
}

.openclaw-column.running .openclaw-column-dot {
  background: #c46b12;
}

.openclaw-column.running header span {
  background: #fff0d8;
  color: #a65f16;
}

.openclaw-column.completed {
  border-color: #c7d8d3;
}

.openclaw-column.completed .openclaw-column-dot {
  background: var(--accent);
}

.openclaw-column.completed header span {
  background: var(--accent-soft);
  color: var(--accent);
}

.openclaw-jobs {
  display: flex;
  flex-direction: column;
  gap: 9px;
}

.openclaw-job {
  width: 100%;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--panel);
  color: inherit;
  cursor: pointer;
  font: inherit;
  text-align: left;
}

.openclaw-job:hover {
  border-color: var(--accent);
}

.openclaw-job-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 6px;
}

.openclaw-job-head strong {
  margin-bottom: 0;
}

.openclaw-job-status {
  flex: 0 0 auto;
  padding: 4px 7px;
  border-radius: 999px;
  background: #f3f1ea;
  color: var(--muted);
  font-size: 10.5px;
  font-weight: 900;
  line-height: 1;
  white-space: nowrap;
}

.openclaw-job-status.pending {
  background: #fae9e7;
  color: #9a3428;
}

.openclaw-job-status.running {
  background: #fff0d8;
  color: #a65f16;
}

.openclaw-job-status.completed {
  background: var(--accent-soft);
  color: var(--accent);
}

.openclaw-job-status.failed {
  background: var(--pink-soft);
  color: var(--pink);
}

.openclaw-job-status.online {
  background: var(--accent-soft);
  color: var(--accent);
}

.openclaw-job-status.offline {
  background: var(--pink-soft);
  color: var(--pink);
}

.openclaw-job.problem {
  border-color: #ead0dc;
  background: #fff8fa;
}

.openclaw-job strong,
.openclaw-job span,
.openclaw-job small {
  display: block;
}

.openclaw-job strong {
  margin-bottom: 4px;
  font-size: 13.5px;
  line-height: 1.25;
}

.openclaw-job span,
.openclaw-job p,
.openclaw-job small {
  color: var(--muted);
  font-size: 12px;
  line-height: 1.35;
}

.openclaw-job p {
  margin: 10px 0;
}

.openclaw-job small {
  margin-top: 9px;
}

.openclaw-job time {
  display: block;
  margin-top: 8px;
  color: var(--muted);
  font-size: 11px;
}

.openclaw-history-link {
  display: flex;
  min-height: 38px;
  align-items: center;
  justify-content: center;
  margin-top: 10px;
  border: 1px dashed var(--line);
  border-radius: 8px;
  color: var(--accent);
  font-size: 12.5px;
  font-weight: 800;
  text-decoration: none;
}

.openclaw-history-link:hover {
  border-color: var(--accent);
  background: var(--accent-soft);
}

.openclaw-history-board {
  display: block;
}

.openclaw-history-board .openclaw-column {
  min-height: 0;
}

.openclaw-history-board .openclaw-jobs {
  display: block;
}

.openclaw-alert {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto auto;
  gap: 12px;
  align-items: center;
  margin-bottom: 16px;
  padding: 13px 16px;
  border: 1px solid #ead0dc;
  border-left: 4px solid var(--pink);
  border-radius: 10px;
  background: var(--pink-soft);
}

.openclaw-alert strong {
  display: block;
  font-size: 15px;
}

.openclaw-alert p {
  margin: 3px 0 0;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.4;
}

.openclaw-vital {
  display: flex;
  align-items: center;
  gap: 8px;
  color: var(--text);
  font-size: 13.5px;
}

.openclaw-vital b {
  font-weight: 800;
}

.openclaw-vital b.danger {
  color: var(--pink);
}

.openclaw-vital small {
  color: var(--muted);
}

.openclaw-vital-sep {
  width: 1px;
  height: 20px;
  background: var(--line);
}

.openclaw-header-signal {
  align-self: center;
  color: var(--muted);
  font-size: 12.5px;
  font-weight: 800;
  white-space: nowrap;
}

.openclaw-header-signal.online {
  color: var(--accent);
}

.openclaw-header-signal.pending {
  color: var(--gold);
}

.openclaw-toolbar {
  align-items: stretch;
  margin-bottom: 18px;
}

.openclaw-toolbar input {
  flex: 1 1 280px;
  min-width: min(280px, 100%);
}

.openclaw-toolbar select {
  min-height: 42px;
  min-width: 150px;
  padding: 8px 32px 8px 11px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  color: var(--text);
  font: inherit;
  font-size: 13px;
}

.openclaw-toolbar .openclaw-status-grid {
  flex: 0 0 auto;
  min-height: 42px;
  padding: 8px 12px;
  border-radius: 999px;
}

.openclaw-filter-count {
  margin-left: 5px;
  opacity: 0.65;
}

.openclaw-day {
  margin-bottom: 20px;
}

.openclaw-day-label {
  margin: 0 0 8px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.openclaw-feed {
  display: grid;
  gap: 8px;
}

.openclaw-run {
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--panel);
}

.openclaw-run.live {
  border-color: #c7d8d3;
  box-shadow: 0 0 0 3px var(--accent-soft);
}

.openclaw-run.problem {
  border-color: #ead0dc;
  background: #fff8fa;
}

.openclaw-run-head {
  display: flex;
  align-items: center;
  gap: 12px;
  width: 100%;
  padding: 14px 16px;
  border: 0;
  border-radius: 10px;
  background: none;
  color: inherit;
  cursor: pointer;
  font: inherit;
  text-align: left;
}

.openclaw-run-head:hover {
  background: #fbfbf9;
}

.openclaw-mark {
  flex: none;
  width: 16px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 900;
  text-align: center;
}

.openclaw-mark.completed {
  color: var(--accent);
}

.openclaw-mark.failed {
  color: var(--pink);
}

.openclaw-mark.running {
  color: var(--blue);
}

.openclaw-mark.pending {
  color: var(--gold);
}

.openclaw-run-title {
  flex: 1;
  min-width: 0;
}

.openclaw-run-title strong,
.openclaw-run-title span,
.openclaw-run-head time {
  display: block;
}

.openclaw-run-title strong {
  margin: 0;
  font-size: 15px;
  font-weight: 800;
  line-height: 1.25;
}

.openclaw-run-title span {
  margin-top: 3px;
  color: var(--muted);
  font-size: 12.5px;
}

.openclaw-run-title .openclaw-run-meta-row {
  display: block;
  margin-top: 2px;
}

.openclaw-run-title .openclaw-run-meta-row b {
  color: var(--text);
  font-weight: 800;
}

.openclaw-run-title .openclaw-run-meta-row a {
  color: var(--accent);
  font-weight: 800;
  text-decoration: none;
}

.openclaw-run-title .openclaw-run-meta-row a:hover {
  text-decoration: underline;
}

.openclaw-run-head time {
  color: var(--muted);
  font-size: 12px;
  white-space: nowrap;
}

.openclaw-run-message {
  margin: -4px 16px 14px 44px;
  color: var(--muted);
  font-size: 12.5px;
  line-height: 1.45;
}

.openclaw-run-progress {
  display: flex;
  flex: 0 0 96px;
  gap: 2px;
}

.openclaw-run-progress i {
  height: 5px;
  flex: 1;
  border-radius: 2px;
  background: var(--accent);
}

.openclaw-run-progress i.failed {
  background: var(--pink);
}

.openclaw-run-progress i.running {
  background: var(--blue);
  animation: openclaw-pulse 1.1s ease-in-out infinite;
}

.openclaw-run-progress i.todo {
  background: var(--line);
}

@keyframes openclaw-pulse {
  50% {
    opacity: 0.35;
  }
}

@media (prefers-reduced-motion: reduce) {
  .openclaw-run-progress i.running {
    animation: none;
  }
}

.openclaw-detail-backdrop {
  position: fixed;
  inset: 0;
  z-index: 1200;
  display: grid;
  place-items: center;
  padding: 24px;
  background: rgba(32, 37, 34, 0.36);
}

.openclaw-detail-backdrop[hidden] {
  display: none;
}

.openclaw-detail-card {
  position: relative;
  width: min(720px, 100%);
  max-height: min(760px, 92vh);
  overflow: auto;
  padding: 22px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--panel);
  box-shadow: 0 24px 70px rgba(32, 37, 34, 0.22);
}

.openclaw-detail-close {
  position: absolute;
  top: 12px;
  right: 12px;
  display: grid;
  width: 34px;
  height: 34px;
  place-items: center;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: #fff;
  color: var(--muted);
  cursor: pointer;
  font: inherit;
  font-size: 22px;
  line-height: 1;
}

.openclaw-detail-close:hover {
  border-color: var(--accent);
  color: var(--accent);
}

.openclaw-detail-head {
  padding-right: 42px;
  margin-bottom: 18px;
}

.openclaw-detail-head h2 {
  margin: 10px 0 5px;
  font-size: 24px;
  line-height: 1.18;
}

.openclaw-detail-head p {
  margin: 0;
  color: var(--muted);
  font-size: 13px;
}

.openclaw-detail-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  margin-bottom: 16px;
}

.openclaw-detail-row,
.openclaw-detail-section {
  padding: 11px 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fbfbfa;
}

.openclaw-detail-row span,
.openclaw-detail-section span {
  display: block;
  margin-bottom: 4px;
  color: var(--muted);
  font-size: 10.5px;
  font-weight: 900;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.openclaw-detail-row strong {
  display: block;
  font-size: 13px;
  line-height: 1.35;
}

.openclaw-detail-section {
  margin-bottom: 10px;
}

.openclaw-detail-section p {
  margin: 0;
  color: var(--text);
  font-size: 13px;
  line-height: 1.5;
  white-space: pre-wrap;
}

.openclaw-detail-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 16px;
}

.openclaw-launch-search {
  width: 100%;
  min-height: 42px;
  margin: 0 0 10px;
  padding: 9px 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  color: var(--text);
  font: inherit;
}

.openclaw-launcher-link {
  display: flex;
  min-height: 38px;
  align-items: center;
  justify-content: center;
  margin-bottom: 14px;
  border: 1px dashed var(--line);
  border-radius: 8px;
  color: var(--accent);
  font-size: 13px;
  font-weight: 800;
  text-decoration: none;
}

.openclaw-launcher-link:hover {
  border-color: var(--accent);
  background: var(--accent-soft);
}

.openclaw-launch-group {
  margin-top: 16px;
}

.openclaw-launch-group > b {
  display: block;
  margin-bottom: 7px;
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.openclaw-launch-item {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  margin-bottom: 7px;
  padding: 11px 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fcfcfb;
}

.openclaw-launch-item strong,
.openclaw-launch-item small {
  display: block;
}

.openclaw-launch-item strong {
  font-size: 14px;
}

.openclaw-launch-item small {
  margin-top: 3px;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.35;
}

.openclaw-inline-link {
  display: inline-flex;
  margin-top: 10px;
  color: var(--accent);
  font-size: 12px;
  font-weight: 800;
  text-decoration: none;
}

.openclaw-empty {
  margin: 0;
  padding: 12px;
  border: 1px dashed var(--line);
  border-radius: 8px;
  color: var(--muted);
  font-size: 12.5px;
  line-height: 1.4;
}

.openclaw-progress {
  height: 7px;
  overflow: hidden;
  border-radius: 999px;
  background: #ecece7;
}

.openclaw-progress i {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: var(--accent);
}

.openclaw-actions-section {
  margin-top: 0;
}

.openclaw-panel {
  padding: 18px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: var(--panel);
}

.openclaw-panel-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
  margin-bottom: 14px;
}

.openclaw-panel-head h2 {
  margin: 0;
  font-size: 18px;
}

.openclaw-panel-head span {
  color: var(--muted);
  font-size: 12px;
}

.openclaw-panel-head a {
  color: var(--accent);
  font-size: 12px;
  font-weight: 800;
  text-decoration: none;
}

.openclaw-action-group {
  margin-top: 18px;
}

.openclaw-action-group:first-child {
  margin-top: 0;
}

.openclaw-action-group h2 {
  margin: 0 0 10px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.openclaw-history,
.openclaw-monitor {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.openclaw-history article {
  display: grid;
  grid-template-columns: 72px minmax(0, 1fr) 44px;
  gap: 12px;
  align-items: start;
  padding: 11px 0;
  border-top: 1px solid var(--line);
}

.openclaw-history article:first-child {
  border-top: 0;
}

.openclaw-history span {
  display: inline-flex;
  justify-content: center;
  padding: 4px 8px;
  border-radius: 999px;
  background: var(--accent-soft);
  color: var(--accent);
  font-size: 11px;
  font-weight: 800;
}

.openclaw-history span.incident {
  background: var(--pink-soft);
  color: var(--pink);
}

.openclaw-history strong,
.openclaw-history small,
.openclaw-history time,
.openclaw-monitor span,
.openclaw-monitor strong,
.openclaw-monitor small {
  display: block;
}

.openclaw-history strong {
  font-size: 13.5px;
}

.openclaw-history small,
.openclaw-history time {
  color: var(--muted);
  font-size: 12px;
}

.openclaw-monitor article {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 4px 12px;
  align-items: center;
  padding: 13px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: #fcfcfb;
}

.openclaw-monitor article.openclaw-action-card {
  cursor: pointer;
}

.openclaw-monitor article.openclaw-action-card:hover {
  border-color: var(--accent);
  background: var(--accent-soft);
}

.openclaw-monitor article.openclaw-action-card:focus-visible {
  outline: 3px solid var(--accent-soft);
  outline-offset: 2px;
}

.openclaw-monitor span {
  grid-column: 1;
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.openclaw-monitor strong {
  grid-column: 1;
  margin: 6px 0 4px;
  color: var(--accent);
  font-size: 16px;
}

.openclaw-monitor small {
  grid-column: 1;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.4;
}

.openclaw-monitor .button {
  grid-column: 2;
  grid-row: 1 / span 3;
}

.openclaw-monitor article > b {
  grid-column: 2;
  grid-row: 1 / span 3;
  color: var(--accent);
  font-size: 18px;
}

.openclaw-placement-list {
  display: grid;
  gap: 8px;
}

.openclaw-tools-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.openclaw-tool-card {
  position: relative;
  display: grid;
  gap: 8px;
  min-height: 168px;
  padding: 15px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel);
  cursor: pointer;
}

.openclaw-tool-card:hover {
  border-color: var(--accent);
  box-shadow: 0 0 0 3px var(--accent-soft);
}

.openclaw-tool-card:focus-visible {
  outline: 3px solid var(--accent-soft);
  outline-offset: 2px;
}

.openclaw-tool-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.openclaw-tool-head small,
.openclaw-tool-card > small {
  color: var(--muted);
  font-size: 12px;
  line-height: 1.4;
}

.openclaw-tool-card strong {
  color: var(--text);
  font-size: 18px;
  line-height: 1.2;
}

.openclaw-tool-card p {
  margin: 0;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.45;
}

.openclaw-tool-card > b {
  position: absolute;
  right: 14px;
  bottom: 12px;
  color: var(--accent);
  font-size: 18px;
}

.openclaw-capability-list {
  display: grid;
  gap: 8px;
}

.openclaw-capability {
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fcfcfb;
}

.openclaw-capability strong,
.openclaw-capability small {
  display: block;
}

.openclaw-capability strong {
  margin-bottom: 4px;
  color: var(--text);
  font-size: 13px;
}

.openclaw-capability small {
  color: var(--muted);
  font-size: 12px;
  line-height: 1.35;
}

.openclaw-placement {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 4px 12px;
  padding: 10px 11px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  color: inherit;
  text-decoration: none;
}

.openclaw-placement:hover {
  border-color: var(--accent);
  background: var(--accent-soft);
}

.openclaw-placement span,
.openclaw-placement strong,
.openclaw-placement small {
  display: block;
  grid-column: 1;
}

.openclaw-placement span {
  color: var(--muted);
  font-size: 10.5px;
  font-weight: 900;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.openclaw-placement strong {
  font-size: 13px;
}

.openclaw-placement small {
  color: var(--muted);
  font-size: 11.5px;
}

.openclaw-placement b {
  grid-column: 2;
  grid-row: 1 / span 3;
  align-self: center;
  color: var(--accent);
}

.openclaw-action-timeline {
  display: grid;
  gap: 7px;
}

.openclaw-action-timeline button {
  display: grid;
  grid-template-columns: 22px minmax(0, 1fr);
  gap: 8px;
  align-items: center;
  width: 100%;
  padding: 9px 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  color: inherit;
  cursor: pointer;
  font: inherit;
  text-align: left;
}

.openclaw-action-timeline button:hover {
  border-color: var(--accent);
  background: var(--accent-soft);
}

.openclaw-action-timeline strong,
.openclaw-action-timeline small {
  display: block;
}

.openclaw-action-timeline strong {
  font-size: 12.5px;
}

.openclaw-action-timeline small {
  color: var(--muted);
  font-size: 11.5px;
}

.openclaw-row-actions {
  grid-column: 2;
  grid-row: 1 / span 3;
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 6px;
}

.openclaw-monitor .openclaw-row-actions .button {
  grid-column: auto;
  grid-row: auto;
}

.resources-toolbar {
  display: grid;
  grid-template-columns: minmax(220px, 360px) minmax(0, 1fr);
  gap: 12px;
  align-items: center;
}

.resources-toolbar input {
  width: 100%;
  min-width: 0;
  padding: 10px 11px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  color: var(--text);
  font: inherit;
}

.resources-list {
  display: grid;
  gap: 8px;
}

.resource-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 14px;
  align-items: center;
  padding: 13px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel);
}

.resource-row span,
.resource-row strong,
.resource-row small {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.resource-row span {
  color: var(--muted);
  font-size: 11px;
  font-weight: 850;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.resource-row strong {
  margin: 4px 0;
  color: var(--text);
  font-size: 14px;
}

.resource-row small {
  color: var(--muted);
  font-size: 12px;
}

.resource-row-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 6px;
}

@media (max-width: 760px) {
  .resources-toolbar,
  .resource-row {
    grid-template-columns: 1fr;
  }

  .resource-row-actions {
    justify-content: flex-start;
  }
}

.week-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.week-column {
  min-height: 160px;
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel);
}

.week-column h2 {
  margin-bottom: 12px;
  color: var(--muted);
  font-size: 13px;
  letter-spacing: 0.03em;
  text-transform: uppercase;
}

.week-item {
  display: flex;
  align-items: flex-start;
  gap: 9px;
  padding: 9px 0;
  border-top: 1px solid var(--line);
  color: inherit;
  font-size: 13px;
  text-decoration: none;
}

.week-item:first-child {
  border-top: 0;
}

.week-item strong,
.week-item small {
  display: block;
}

.week-item small {
  margin-top: 2px;
  color: var(--muted);
}

.week-dot {
  width: 8px;
  height: 8px;
  flex: 0 0 8px;
  margin-top: 5px;
  border-radius: 50%;
  background: var(--accent);
}

.muted-week {
  color: var(--muted);
}

.muted-week .week-dot {
  background: var(--line);
}

/* Products module */
.products-head {
  align-items: end;
}

.products-table tbody tr {
  cursor: pointer;
}

.products-table tbody tr:hover {
  background: #fbfbf9;
}

.products-table .product-index-title .product-title-cell {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  max-width: 460px;
  color: inherit;
  font-size: inherit;
}

.products-table .product-index-title .product-title-cell strong {
  display: inline;
  min-width: 0;
  overflow: hidden;
  color: var(--ink);
  font-size: 15px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.products-table .product-index-title .product-title-cell .product-logo {
  display: inline-flex;
  flex: 0 0 34px;
}

.product-title-cell {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
  white-space: nowrap;
}

.product-logo {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  flex: 0 0 34px;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: #f7f3ec;
}

.product-logo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.product-logo.large {
  width: 58px;
  height: 58px;
  flex-basis: 58px;
}

.products-table .product-index-price {
  color: var(--ink);
  font-weight: 800;
  white-space: nowrap;
}

.table-sort {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 0;
  border: 0;
  background: transparent;
  color: inherit;
  font: inherit;
  font-weight: 800;
  text-align: left;
  cursor: pointer;
}

.table-sort span {
  min-width: 10px;
  color: var(--accent);
  font-size: 13px;
  line-height: 1;
}

.table-sort.active {
  color: var(--accent);
}

.type-chip {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  padding: 3px 9px;
  border-radius: 999px;
  background: var(--blue-soft);
  color: var(--blue);
  font-size: 11px;
  font-weight: 800;
  white-space: nowrap;
}

.pill-edit {
  width: calc((var(--pill-ch, 12) * 1ch) + 24px);
  max-width: 100%;
  box-sizing: border-box;
  border: 0;
  outline: 0;
  cursor: pointer;
  appearance: none;
}

.pill-edit:focus {
  box-shadow: 0 0 0 2px var(--accent-soft);
}

.type-chip.subscription {
  background: var(--pod-soft);
  color: var(--pod);
}

.type-chip.meditation {
  background: var(--warning-soft);
  color: var(--warning);
}

.type-chip.workshop {
  background: var(--gold-soft);
  color: var(--gold);
}

.type-chip.oracle {
  background: var(--accent-soft);
  color: var(--accent);
}

.type-chip.tunnel {
  background: #edf0ed;
  color: var(--muted);
}

.type-chip.archive {
  background: #f0eeea;
  color: var(--muted);
}

.type-chip.challenge {
  background: var(--pink-soft);
  color: var(--pink);
}

.product-status {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  padding: 3px 9px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 800;
  white-space: nowrap;
}

.product-status.active {
  background: var(--accent-soft);
  color: var(--accent);
}

.product-status.creation {
  background: var(--warning-soft);
  color: var(--warning);
}

.product-status.archive {
  background: #f0eeea;
  color: var(--muted);
}

.product-status.large {
  min-height: 30px;
  padding: 5px 12px;
  font-size: 12px;
}

.product-detail-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 16px;
  padding-bottom: 14px;
  border-bottom: 1px solid var(--line);
}

.product-detail-identity {
  display: flex;
  align-items: center;
  gap: 14px;
  min-width: 0;
}

.product-detail-head p {
  margin: 0 0 6px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.product-detail-head h1 {
  font-size: 30px;
  line-height: 1.15;
}

.editable-product-title {
  display: flex;
  align-items: center;
  gap: 8px;
}

.editable-product-title h1 {
  min-width: 0;
  padding: 2px 4px;
  border-radius: 6px;
  outline: 0;
}

.editable-product-title h1:focus {
  background: #fff;
  box-shadow: 0 0 0 2px var(--accent-soft);
}

.editable-product-title button {
  width: 32px;
  height: 32px;
  flex: 0 0 32px;
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: var(--accent);
  font-size: 15px;
  font-weight: 900;
  cursor: pointer;
}

.editable-product-title button:hover {
  background: var(--accent-soft);
}

.product-status-row {
  display: flex;
  gap: 8px;
  margin-top: 10px;
  flex-wrap: wrap;
}

.product-detail-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 300px;
  gap: 18px;
  align-items: start;
}

.product-props-strip {
  display: grid;
  grid-column: 1 / -1;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 10px;
  margin-bottom: 6px;
}

.product-prop-box {
  min-width: 0;
  padding: 12px 14px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--panel);
}

.product-prop-box label {
  display: block;
  margin-bottom: 6px;
  color: var(--muted);
  font-size: 11.5px;
  font-weight: 750;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

.product-prop-box label.offer-label-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

.product-prop-box label.offer-label-row span {
  min-width: 0;
}

.product-prop-box select,
.product-prop-box input {
  width: 100%;
  min-height: 30px;
  border: 0;
  background: transparent;
  color: var(--text);
  font: inherit;
  font-size: 14px;
  font-weight: 550;
  outline: 0;
}

.product-prop-box select {
  padding: 0 18px 0 0;
  cursor: pointer;
}

.product-prop-box select:focus,
.product-prop-box input:focus {
  border-radius: 6px;
  box-shadow: 0 0 0 2px var(--accent-soft);
}

.product-prop-box .pill-edit {
  width: 100%;
  min-height: 30px;
  padding: 0;
  border-radius: 0;
  background: transparent;
  color: var(--text);
  font-size: 14px;
  font-weight: 550;
}

.status-select-shell {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  max-width: 100%;
  min-height: 30px;
  padding: 5px 10px;
  border-radius: 999px;
  background: var(--accent-soft);
  color: var(--accent);
}

.status-select-shell > span {
  width: 6px;
  height: 6px;
  flex: 0 0 6px;
  border-radius: 50%;
  background: currentColor;
}

.status-select-shell.creation {
  background: var(--warning-soft);
  color: var(--warning);
}

.status-select-shell.archive {
  background: #f0eeea;
  color: var(--muted);
}

.status-select-shell .pill-edit {
  min-width: 0;
  color: currentColor;
  font-size: 12.5px;
  font-weight: 600;
}

.product-prop-box.price {
  padding-bottom: 10px;
}

.product-prop-price-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.price-mini-field {
  min-width: 0;
}

.price-mini-field b,
.price-mini-field em {
  display: block;
  color: var(--muted);
  font-size: 11px;
  font-style: normal;
  font-weight: 500;
  line-height: 1.25;
}

.price-mini-field .money-input {
  margin-top: 2px;
}

.price-mini-field .money-input input {
  min-height: 28px;
  padding-right: 20px;
  border-bottom: 1px solid var(--line);
  font-size: 14px;
}

.price-mini-field .money-input i {
  position: absolute;
  right: 3px;
  top: 50%;
  color: var(--muted);
  font-size: 12px;
  font-style: normal;
  transform: translateY(-50%);
}

.price-mini-field em {
  margin-top: 3px;
  white-space: nowrap;
}

.product-edit-card .product-card-head span {
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
}

.product-edit-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.product-description-lead {
  display: grid;
  gap: 0;
  margin-bottom: 0;
}

.product-information-card .product-edit-card h3 {
  margin: 0 0 8px;
  color: var(--muted);
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.product-detail-main > .content-card {
  margin-bottom: 18px;
}

.product-detail-main > .content-card:last-child {
  margin-bottom: 0;
}

.product-field {
  display: grid;
  gap: 6px;
}

.product-field-wide {
  grid-column: 1 / -1;
}

.product-field span {
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
}

.product-field input,
.product-field select,
.product-field textarea {
  width: 100%;
  min-height: 38px;
  padding: 8px 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  color: var(--ink);
  font: inherit;
}

.product-field.readonly input {
  background: #f1f2ef;
  color: var(--muted);
  cursor: not-allowed;
}

.product-price-box {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 8px;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fbfbf9;
}

.product-price-grid {
  display: grid;
  grid-column: 1 / -1;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.money-input {
  position: relative;
  display: block;
}

.product-field .money-input input {
  padding-right: 32px;
}

.product-field .money-input b {
  position: absolute;
  right: 11px;
  top: 50%;
  color: var(--muted);
  font-size: 13px;
  font-weight: 800;
  transform: translateY(-50%);
}

.product-field textarea {
  resize: vertical;
  line-height: 1.45;
}

.product-create-modal {
  width: min(720px, 94vw);
}

.product-create-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.product-create-grid textarea {
  min-height: 110px;
}

.inline-edit-text {
  min-height: 88px;
  padding: 0;
  border: 1px solid transparent;
  border-radius: 0;
  background: #fff;
  color: var(--ink);
  line-height: 1.55;
  outline: 0;
  white-space: pre-wrap;
}

.inline-edit-text:focus {
  padding: 10px 11px;
  border-color: var(--accent);
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 0 0 2px var(--accent-soft);
}

.inline-edit-text.empty {
  color: var(--muted);
}

.pages-editor,
.relation-editor,
.relation-list,
.custom-pages {
  display: grid;
  gap: 10px;
}

.product-info-grid .product-description-lead {
  margin-bottom: 0;
}

.subsection-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 8px;
}

.subsection-head h3 {
  margin: 0;
}

.subsection-head.inline {
  margin: 0;
}

.compact-relations {
  gap: 8px;
}

.relation-row {
  display: grid;
  grid-template-columns: minmax(110px, 150px) minmax(0, 1fr);
  gap: 10px;
  align-items: center;
}

.relation-row > span {
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
}

.relation-row select {
  width: min(100%, 290px);
  min-height: 32px;
  padding: 6px 9px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  color: var(--ink);
  font: inherit;
  font-size: 13px;
}

.included-product-rows {
  display: grid;
  gap: 6px;
}

.relation-control {
  display: flex;
  align-items: start;
  gap: 8px;
  min-width: 0;
}

.relation-product-row {
  display: block;
}

.custom-page-row {
  display: grid;
  grid-template-columns: minmax(150px, 220px) minmax(0, 1fr);
  gap: 10px;
}

.relation-list > span {
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
}

.post-purchase-flow {
  display: flex;
  align-items: flex-start;
  flex-wrap: wrap;
  gap: 8px;
}

.post-purchase-group {
  width: min(100%, 360px);
  flex: 0 1 360px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
}

.post-purchase-group summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-height: 34px;
  padding: 8px 10px;
  color: var(--muted);
  cursor: pointer;
  font-size: 11px;
  font-weight: 900;
  letter-spacing: .08em;
  list-style: none;
  text-transform: uppercase;
}

.post-purchase-group summary::-webkit-details-marker {
  display: none;
}

.post-purchase-group summary::after {
  color: var(--muted);
  content: "+";
  font-size: 15px;
  line-height: 1;
}

.post-purchase-group[open] summary::after {
  content: "−";
}

.post-purchase-group summary small {
  margin-left: auto;
  color: var(--muted);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0;
  text-transform: none;
}

.post-purchase-timeline {
  display: grid;
  gap: 0;
  padding: 2px 10px 12px;
}

.post-purchase-step {
  position: relative;
  display: grid;
  grid-template-columns: 22px minmax(0, 1fr);
  gap: 8px;
  padding: 8px 0;
  background: #fff;
}

.post-purchase-step:not(:last-child)::before {
  position: absolute;
  top: 25px;
  bottom: -5px;
  left: 7px;
  width: 2px;
  background: #deded8;
  content: "";
}

.post-purchase-dot {
  position: relative;
  z-index: 1;
  width: 16px;
  height: 16px;
  margin-top: 1px;
  border: 4px solid #2f7f78;
  border-radius: 999px;
  background: #fff;
}

.post-purchase-step-main {
  display: grid;
  min-width: 0;
  gap: 3px;
}

.post-purchase-step-title {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
  flex-wrap: wrap;
}

.post-purchase-step strong {
  color: var(--text);
  font-size: 13px;
  line-height: 1.25;
}

.post-purchase-step em {
  display: inline-flex;
  align-items: center;
  min-height: 21px;
  padding: 2px 8px;
  border-radius: 999px;
  background: var(--accent-soft);
  color: var(--accent);
  font-size: 10px;
  font-style: normal;
  font-weight: 900;
  letter-spacing: .06em;
  line-height: 1;
  text-transform: uppercase;
}

.post-purchase-step-body {
  display: flex;
  align-items: center;
  gap: 6px;
  min-width: 0;
  flex-wrap: wrap;
}

.post-purchase-step a,
.post-purchase-step span,
.post-purchase-step input {
  min-width: 0;
  color: var(--muted);
  font: inherit;
  font-size: 12px;
  line-height: 1.25;
}

.post-purchase-step a {
  color: var(--accent);
  font-weight: 700;
  overflow-wrap: anywhere;
  text-decoration: none;
}

.post-purchase-step a:hover {
  text-decoration: underline;
}

.post-purchase-step input {
  width: min(100%, 360px);
  min-height: 27px;
  padding: 4px 7px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #fff;
}

.post-purchase-step small {
  color: #2f7f78;
  font-size: 12px;
  font-weight: 800;
}

.post-purchase-step.payment .post-purchase-dot {
  border-color: #a88520;
}

.post-purchase-step.confirmation .post-purchase-dot {
  border-color: #2f6f9c;
}

.post-purchase-step.automation .post-purchase-dot {
  border-color: #8b62bc;
  background: #8b62bc;
}

.post-purchase-step.email .post-purchase-dot {
  border-color: #ad5779;
  background: #ad5779;
}

.post-purchase-step.payment em {
  background: var(--gold-soft);
  color: #8a6b13;
}

.post-purchase-step.confirmation em {
  background: #e7f0f7;
  color: #2f5f84;
}

.post-purchase-step.automation em {
  background: #eee7f7;
  color: #7652a6;
}

.post-purchase-step.email em {
  background: var(--pink-soft);
  color: #a34b6f;
}

.product-props article strong a {
  color: var(--accent);
  text-decoration: none;
}

.product-props article strong a:hover {
  text-decoration: underline;
}

.product-price-row {
  display: grid;
  grid-template-columns: 100px minmax(120px, 1fr) minmax(100px, auto);
  gap: 12px;
  align-items: baseline;
  padding: 10px 0;
  border-bottom: 1px solid var(--line);
}

.product-price-row:last-of-type {
  border-bottom: 0;
}

.product-price-row span {
  width: fit-content;
  padding: 3px 9px;
  border-radius: 999px;
  background: var(--accent-soft);
  color: var(--accent);
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
}

.product-price-row strong {
  font-size: 24px;
}

.product-price-row small {
  color: var(--muted);
  font-size: 13px;
}

.product-note {
  margin: 12px 0 0;
  padding: 11px 13px;
  border: 1px dashed var(--line);
  border-radius: 8px;
  background: var(--bg);
  color: var(--muted);
  font-size: 12px;
  line-height: 1.5;
}

.product-relations {
  display: grid;
  gap: 8px;
}

.product-post-purchase {
  display: grid;
  gap: 8px;
  margin-top: 6px;
}

.product-relation {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 11px;
  border: 1px solid var(--line);
  border-radius: 8px;
  color: inherit;
  text-decoration: none;
}

.product-relation:hover {
  border-color: var(--accent);
}

.product-relation span {
  padding: 2px 8px;
  border-radius: 999px;
  background: var(--gold-soft);
  color: var(--warning);
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
}

.product-relation b {
  margin-left: auto;
  color: var(--accent);
}

.product-link-list {
  display: grid;
  gap: 0;
  margin: 0;
  padding: 0;
  list-style: none;
}

.product-link-list li {
  display: grid;
  grid-template-columns: 150px minmax(0, 1fr);
  gap: 12px;
  padding: 9px 0;
  border-top: 1px solid var(--line);
}

.product-link-list li:first-child {
  border-top: 0;
}

.product-link-list span {
  color: var(--muted);
  font-size: 13px;
  font-weight: 800;
}

.product-link-list a {
  overflow-wrap: anywhere;
}

.product-card-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 12px;
}

.product-card-head h2 {
  font-size: 24px;
  line-height: 1.15;
  font-weight: 650;
}

.product-detail-main .product-card-head h2 {
  font-size: 20px;
  line-height: 1.2;
}

.product-summary-card {
  border-color: #c9e5df;
  background: var(--accent-soft);
}

.product-summary-card p {
  margin: 0;
  color: #3f6f68;
  font-size: 13.5px;
  line-height: 1.55;
}

.product-summary-card .button.ghost,
.launch-detail .result-review-card .button.ghost {
  border-color: var(--accent);
  background: var(--accent);
  color: #fff;
}

.product-summary-card .button.ghost:hover,
.launch-detail .result-review-card .button.ghost:hover {
  background: #155f43;
  color: #fff;
}

.product-list-badges {
  display: grid;
  gap: 6px;
  margin: 0 0 12px;
  padding: 0;
  list-style: none;
}

.product-list-badges li {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 14px;
}

.product-list-badges span {
  padding: 2px 8px;
  border-radius: 999px;
  background: var(--blue-soft);
  color: var(--blue);
  font-size: 11px;
  font-weight: 800;
}

.product-email-preview {
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--bg);
  color: var(--muted);
  font-size: 13px;
  line-height: 1.55;
}

.product-unit-meta {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 12px;
  flex-wrap: wrap;
}

.product-unit-meta strong {
  font-size: 13px;
}

.product-unit-meta span {
  flex: 1;
  min-width: 120px;
  height: 7px;
  overflow: hidden;
  border-radius: 999px;
  background: var(--line);
}

.product-unit-meta i {
  display: block;
  height: 100%;
  background: var(--accent);
}

.product-units {
  display: grid;
  gap: 7px;
}

.product-unit {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  padding: 11px 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
}

.product-unit > b {
  width: 26px;
  height: 26px;
  display: grid;
  place-items: center;
  border-radius: 7px;
  background: var(--accent-soft);
  color: var(--accent);
  font-size: 13px;
}

.product-unit div > strong,
.product-unit div > span {
  display: block;
}

.product-unit div > span {
  margin-top: 2px;
  color: var(--muted);
  font-size: 13px;
  font-style: italic;
}

.unit-file-links {
  display: flex;
  gap: 6px;
  justify-content: flex-end;
  flex-wrap: wrap;
}

.unit-file-links a {
  padding: 3px 8px;
  border-radius: 999px;
  background: var(--accent-soft);
  color: var(--accent);
  font-size: 11px;
  font-weight: 800;
  text-decoration: none;
}

.product-resource-summary {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 8px;
  margin-bottom: 16px;
}

.product-resource-summary article {
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--bg);
}

.product-resource-summary span,
.product-resource-card span,
.product-editor-actions span {
  display: block;
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
}

.product-resource-summary strong {
  display: block;
  margin-top: 4px;
  font-size: 20px;
}

.resource-note {
  margin: 0 0 12px;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.5;
}

.product-resource-group {
  display: grid;
  gap: 8px;
  margin-top: 14px;
}

.product-resource-group h3 {
  font-size: 13px;
  color: var(--ink);
}

.product-resource-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  padding: 11px 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
}

.product-resource-link {
  color: inherit;
  text-decoration: none;
}

.product-resource-link:hover {
  border-color: var(--accent);
}

.product-resource-link b {
  color: var(--accent);
  font-size: 13px;
}

.product-resource-card strong,
.product-resource-card small {
  display: block;
}

.product-resource-card strong {
  margin-top: 3px;
  font-size: 14px;
}

.product-resource-card small {
  margin-top: 4px;
  color: var(--muted);
  line-height: 1.45;
}

.product-drive-note {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 12px;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--bg);
}

.product-drive-note strong,
.product-drive-note span {
  display: block;
}

.product-drive-note strong {
  font-size: 13px;
}

.product-drive-note span {
  margin-top: 3px;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.4;
}

.drive-folder-link {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  flex: 0 0 auto;
  padding: 6px 10px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: #fff;
  color: var(--accent);
  font-size: 12px;
  font-weight: 800;
  text-decoration: none;
}

.drive-folder-link.compact {
  padding: 5px 9px;
  font-size: 12px;
}

.drive-folder-link:hover {
  border-color: var(--accent);
}

.drive-folder-link.external-drive-link {
  border-color: #2f8a61;
  background: #2f8a61;
  color: #fff;
}

.drive-folder-link.external-drive-link:hover {
  border-color: #26734f;
  background: #26734f;
}

.drive-card-head {
  align-items: center;
}

.drive-card-actions {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  margin-left: auto;
}

.drive-sync-control {
  display: inline-grid;
  gap: 3px;
  justify-items: end;
}

.drive-sync-button {
  flex: 0 0 auto;
  display: inline-flex;
  min-height: 30px;
  align-items: center;
  justify-content: center;
  gap: 5px;
  padding: 5px 9px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: #fff;
  color: var(--accent);
  font: inherit;
  font-size: 12px;
  font-weight: 800;
  cursor: pointer;
  white-space: nowrap;
}

.drive-sync-button:hover {
  border-color: var(--accent);
}

.drive-sync-button:disabled {
  cursor: wait;
  opacity: .65;
}

.drive-sync-button.is-syncing {
  background: var(--accent-soft);
  border-color: var(--accent-soft);
}

.drive-sync-status {
  display: inline-flex;
  align-items: center;
  color: var(--muted);
  font-size: 11px;
  font-weight: 500;
  white-space: nowrap;
}

.drive-sync-status.pending,
.drive-sync-status.running {
  color: var(--muted);
}

.drive-sync-status.completed {
  color: var(--muted);
}

.drive-sync-status.failed {
  color: #9b2f22;
}

.product-drive-structure {
  display: grid;
  gap: 8px;
  margin: 14px 0;
}

.product-drive-structure h3 {
  font-size: 13px;
}

.product-drive-structure > div {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.product-drive-structure article {
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
}

.product-drive-structure strong,
.product-drive-structure span,
.product-drive-warning strong,
.product-drive-warning span {
  display: block;
}

.product-drive-structure strong {
  font-size: 12px;
}

.product-drive-structure span {
  margin-top: 4px;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.4;
}

.product-drive-warning {
  display: grid;
  gap: 5px;
  margin: 12px 0;
  padding: 10px 12px;
  border: 1px solid #fed7aa;
  border-radius: 8px;
  background: #fff7ed;
  color: #9a3412;
  font-size: 12px;
  line-height: 1.45;
}

.drive-tabs {
  display: grid;
  gap: 10px;
  margin-top: 14px;
}

.drive-tab-list {
  display: flex;
  gap: 6px;
  overflow-x: auto;
  padding-bottom: 2px;
}

.drive-tab-list button {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  min-height: 34px;
  padding: 7px 10px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: #fff;
  color: var(--muted);
  font: inherit;
  font-size: 12px;
  font-weight: 800;
  cursor: pointer;
}

.drive-tab-list button span {
  display: inline-grid;
  min-width: 20px;
  height: 20px;
  place-items: center;
  border-radius: 999px;
  background: var(--bg);
  color: var(--ink);
  font-size: 11px;
}

.drive-tab-list button.active {
  border-color: var(--accent);
  background: var(--accent-soft);
  color: var(--accent);
}

.drive-tab-list button.active span {
  background: #fff;
  color: var(--accent);
}

.drive-tab-panel {
  display: none;
  gap: 7px;
}

.drive-tab-panel.active {
  display: grid;
}

.drive-tab-panel > p {
  margin: 0 0 4px;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.45;
}

.drive-file-row {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr) auto;
  gap: 8px;
  align-items: center;
  min-height: 34px;
  padding: 5px 8px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  color: inherit;
  text-decoration: none;
}

.drive-file-row:hover {
  border-color: var(--accent);
}

.drive-file-type {
  display: inline-grid;
  min-width: 34px;
  height: 22px;
  place-items: center;
  border-radius: 6px;
  background: var(--bg);
  color: var(--muted);
  font-size: 9px;
  font-weight: 800;
  letter-spacing: 0;
}

.drive-file-main {
  min-width: 0;
}

.drive-file-main strong {
  display: block;
  min-width: 0;
  overflow: hidden;
  color: var(--text);
  font-size: 13px;
  font-weight: 400;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.drive-file-open {
  color: var(--accent);
  font-size: 11px;
  font-weight: 650;
}

.drive-file-more {
  display: grid;
  gap: 7px;
}

.drive-file-more summary {
  width: 100%;
  padding: 4px 8px;
  border: 1px dashed var(--line);
  border-radius: 8px;
  color: var(--muted);
  cursor: pointer;
  font-size: 15px;
  font-weight: 700;
  line-height: 1;
  text-align: center;
  list-style: none;
}

.drive-file-more summary::-webkit-details-marker {
  display: none;
}

.drive-file-type.audio {
  background: #ecfdf5;
  color: #047857;
}

.drive-file-type.video,
.drive-file-type.image {
  background: #eef2ff;
  color: #4338ca;
}

.drive-file-type.pdf {
  background: #fff1f2;
  color: #be123c;
}

.drive-file-type.source {
  background: #eff6ff;
  color: #1d4ed8;
}

.drive-file-type.archive {
  background: #fff7ed;
  color: #c2410c;
}

.drive-file-main {
  min-width: 0;
}

.drive-file-main strong {
  display: block;
}

.drive-file-main strong {
  overflow: hidden;
  color: var(--ink);
  font-size: 13px;
  font-weight: 400;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.drive-file-open {
  color: var(--accent);
  font-size: 11px;
  font-weight: 650;
}

.visual-identity-preview {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: 10px;
}

.visual-identity-preview figure,
.visual-identity-preview a {
  display: grid;
  gap: 8px;
  align-content: start;
  min-height: 104px;
  margin: 0;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--bg);
  color: inherit;
  text-decoration: none;
}

.visual-identity-preview img {
  width: 100%;
  max-height: 112px;
  object-fit: contain;
  border-radius: 6px;
  background: #fff;
}

.visual-identity-preview figcaption,
.visual-identity-preview strong {
  color: var(--muted);
  font-size: 12px;
  line-height: 1.35;
}

.product-context-preview {
  display: grid;
  gap: 10px;
}

.product-context-preview a {
  display: grid;
  gap: 7px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--bg);
  color: inherit;
  text-decoration: none;
}

.product-context-preview a:hover {
  border-color: var(--accent);
}

.product-context-preview strong,
.product-context-preview small {
  display: block;
}

.product-context-preview strong {
  color: var(--ink);
  font-size: 14px;
}

.product-context-preview small {
  color: var(--muted);
  font-size: 12px;
  line-height: 1.4;
}

.doc-kind-pill {
  width: fit-content;
  padding: 4px 8px;
  border-radius: 999px;
  background: #eff6ff;
  color: #1d4ed8;
  font-size: 11px;
  font-weight: 900;
}

.pages-library-panel,
.pages-library-list {
  display: grid;
  gap: 10px;
}

.product-page-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
  align-items: center;
  padding: 0;
  border: 0;
  background: transparent;
}

.product-page-read {
  min-width: 0;
}

.product-page-card .page-edit-slot {
  grid-column: 1 / -1;
  min-width: 0;
  width: 100%;
}

.product-page-read span,
.page-directory-card span {
  color: var(--muted);
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
}

.product-page-read a,
.page-directory-card a {
  color: var(--text);
  font-size: 14px;
  font-weight: 500;
  overflow-wrap: anywhere;
}

.product-page-read small,
.page-directory-card small {
  color: var(--muted);
  font-size: 12px;
  overflow-wrap: anywhere;
}

.product-page-actions,
.page-inline-actions {
  display: flex;
  gap: 6px;
  justify-content: flex-end;
}

.product-page-card:not(.is-editing) .page-delete-action {
  display: none;
}

.small-icon {
  width: 30px;
  height: 30px;
  font-size: 15px;
  border: 0;
  background: transparent;
}

.small-icon:hover {
  background: var(--accent-soft);
}

.add-page-icon {
  color: var(--accent);
  font-size: 18px;
}

.small-icon.danger {
  color: #9d3328;
}

.page-inline-editor {
  display: grid;
  grid-template-columns: minmax(130px, 0.55fr) minmax(170px, 1fr);
  gap: 10px;
}

.page-inline-editor .product-field-wide,
.page-inline-actions {
  grid-column: 1 / -1;
}

.pages-summary {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin-bottom: 18px;
}

.pages-summary article {
  padding: 13px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
}

.pages-summary span {
  display: block;
  color: var(--muted);
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
}

.pages-summary strong {
  display: block;
  margin-top: 5px;
  color: var(--text);
  font-size: 24px;
}

.pages-directory,
.pages-product-group {
  display: grid;
  gap: 14px;
}

.pages-product-group {
  padding-top: 16px;
  border-top: 1px solid var(--line);
}

.pages-product-group h2 {
  margin: 0;
  font-size: 18px;
}

.pages-card-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 10px;
}

.page-directory-card {
  display: grid;
  gap: 5px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
}

.page-directory-card b {
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
}

.product-resource-editor {
  margin-top: 16px;
  padding-top: 16px;
  border-top: 1px solid var(--line);
}

.product-resource-editor textarea {
  width: 100%;
  min-height: 280px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--bg);
  color: var(--ink);
  font: 13px/1.55 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  resize: vertical;
}

.product-editor-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-top: 10px;
}

.linked-product-resources {
  display: grid;
  gap: 8px;
  margin-top: 18px;
  padding-top: 14px;
  border-top: 1px solid var(--line);
}

.linked-product-resources h3 {
  font-size: 13px;
}

.linked-product-resources.compact {
  margin-top: 10px;
  padding-top: 0;
  border-top: 0;
}

.linked-product-resource {
  display: block;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--bg);
  color: inherit;
  text-decoration: none;
}

.linked-product-resource span,
.linked-product-resource strong {
  display: block;
}

.linked-product-resource span {
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
}

.linked-product-resource strong {
  margin-top: 3px;
  font-size: 13px;
}

.important-link-list {
  display: grid;
  gap: 5px;
}

.important-link-list.compact {
  margin-top: 10px;
}

.important-link-item {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
  align-items: center;
}

.important-link-item .page-edit-slot {
  grid-column: 1 / -1;
}

.important-link-row {
  display: grid;
  grid-template-columns: max-content auto minmax(0, 1fr);
  align-items: baseline;
  gap: 6px;
  min-width: 0;
  padding: 6px 0;
  border-bottom: 0;
  color: inherit;
  text-decoration: none;
}

.important-link-row:hover strong,
.important-link-row:hover code {
  color: var(--accent);
}

.important-link-row strong {
  min-width: 0;
  font-size: 13px;
  font-weight: 500;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.important-link-row span {
  color: var(--muted);
  font-size: 13px;
}

.important-link-row code {
  min-width: 0;
  color: var(--muted);
  font-family: inherit;
  font-size: 12px;
  line-height: 1.4;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.product-marketing-cockpit {
  display: grid;
  gap: 12px;
}

.ai-analysis-box {
  display: grid;
  gap: 10px;
  padding: 14px;
  border: 1px solid #d8e4dc;
  border-radius: 8px;
  background: #f5faf6;
}

.ai-analysis-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.ai-analysis-head h3 {
  margin: 0;
  color: var(--ink);
  font-size: 15px;
  font-weight: 750;
  line-height: 1.25;
}

.ai-analysis-box p {
  margin: 0;
  color: var(--ink);
  font-size: 14px;
  line-height: 1.5;
}

.product-content-summary-box {
  margin: 0 0 14px;
}

.product-ai-context-section {
  display: grid;
  gap: 14px;
}

.product-ai-context-badge {
  display: inline-flex;
  align-items: center;
  width: fit-content;
  min-height: 24px;
  padding: 0 9px;
  border: 1px solid #d8e4dc;
  border-radius: 999px;
  background: #f5faf6;
  color: #2e6f5d;
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
}

.product-ai-context-badge.loading {
  color: var(--muted);
}

.product-ai-context-badge.error {
  border-color: #f1c6c0;
  background: #fff5f3;
  color: #a14135;
}

.product-ai-context-summary {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.product-ai-context-summary article {
  display: grid;
  gap: 5px;
  min-width: 0;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
}

.product-ai-context-summary span,
.product-ai-pack-mode {
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0;
  text-transform: uppercase;
}

.product-ai-context-summary strong {
  min-width: 0;
  color: var(--ink);
  font-size: 15px;
  line-height: 1.25;
  overflow-wrap: anywhere;
}

.product-ai-context-summary small {
  color: var(--muted);
  font-size: 12px;
  line-height: 1.35;
}

.product-ai-context-note,
.product-marketing-context-note {
  margin: 0;
  padding: 10px 12px;
  border: 1px solid #e1e7dc;
  border-radius: 8px;
  background: #fbfcf8;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.45;
}

.product-ai-pack-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  align-items: stretch;
}

.product-ai-pack-card {
  display: grid;
  grid-template-rows: minmax(112px, 1fr) auto auto;
  align-content: stretch;
  gap: 10px;
  min-width: 0;
  min-height: 190px;
  padding: 13px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  color: inherit;
  text-decoration: none;
}

a.product-ai-pack-card {
  cursor: pointer;
}

a.product-ai-pack-card:hover {
  border-color: var(--accent);
  box-shadow: 0 8px 18px rgba(20, 26, 24, 0.06);
}

.product-ai-pack-card.ready {
  border-color: #cfe3d7;
}

.product-ai-pack-card.incomplete,
.product-ai-pack-card.to_create {
  border-color: #eadfb9;
  background: #fffdf6;
}

.product-ai-pack-card.error {
  border-color: #f1c6c0;
  background: #fff8f7;
}

.product-ai-pack-main {
  display: grid;
  gap: 5px;
  min-width: 0;
}

.product-ai-pack-main .product-ai-pack-status {
  display: inline-flex;
  align-items: center;
  width: fit-content;
  min-height: 22px;
  padding: 0 7px;
  border: 1px solid #e2e8df;
  border-radius: 999px;
  background: #f8faf7;
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
  line-height: 1.2;
}

.product-ai-pack-main strong {
  color: var(--ink);
  font-size: 15px;
  line-height: 1.25;
}

.product-ai-pack-main p,
.product-ai-pack-rule {
  margin: 0;
  color: var(--muted);
  font-size: 12.5px;
  line-height: 1.4;
  min-height: 36px;
}

.product-ai-pack-meta {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  flex-wrap: wrap;
  gap: 6px;
}

.product-ai-pack-meta span {
  display: inline-flex;
  align-items: center;
  min-height: 22px;
  padding: 0 7px;
  border: 1px solid #e2e8df;
  border-radius: 999px;
  background: #f8faf7;
  color: var(--muted);
  font-size: 11.5px;
  font-weight: 650;
  line-height: 1.2;
}

.product-context-workshop-main {
  width: 100%;
}

.product-context-meta {
  margin: 12px 0 0;
}

.product-context-property-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin: 12px 0 0;
}

.product-context-module #productContextDocs {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 8px;
}

.product-context-property-grid article {
  display: grid;
  gap: 5px;
  min-width: 0;
  padding: 10px 11px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
}

.product-context-property-grid span {
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0;
  text-transform: uppercase;
}

.product-context-property-grid strong {
  min-width: 0;
  color: var(--ink);
  font-size: 13px;
  line-height: 1.3;
  overflow-wrap: anywhere;
}

.product-context-list-row {
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
}

.product-context-list-main {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 10px;
  align-items: center;
  width: 100%;
  min-height: 58px;
  padding: 10px 12px;
  border: 0;
  background: transparent;
  color: inherit;
  cursor: pointer;
  text-align: left;
}

.product-context-list-main > span:last-child {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.product-context-list-main strong,
.product-context-list-main small {
  display: block;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.product-context-list-main strong {
  color: var(--ink);
  font-size: 13.5px;
  line-height: 1.25;
}

.product-context-list-main small {
  color: var(--muted);
  font-size: 12px;
  line-height: 1.25;
}

.product-context-list-row:hover {
  border-color: color-mix(in srgb, var(--accent) 36%, var(--line));
  box-shadow: 0 8px 18px rgba(20, 26, 24, 0.06);
}

.product-ai-pack-status.ready {
  border-color: #cfe3d7;
  background: #f1faf5;
  color: #2e6f5d;
}

.product-ai-pack-status.incomplete,
.product-ai-pack-status.to_create {
  border-color: #eadfb9;
  background: #fff8dd;
  color: #8a6b16;
}

.product-ai-pack-status.error {
  border-color: #f1c6c0;
  background: #fff5f3;
  color: #a14135;
}

.product-ai-pack-open {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  justify-self: end;
  width: 26px;
  height: 26px;
  border: 1px solid var(--line);
  border-radius: 999px;
  color: var(--accent);
  font-size: 15px;
  font-weight: 750;
  line-height: 1;
}

.product-ai-pack-open-spacer {
  display: block;
  justify-self: end;
  width: 26px;
  height: 26px;
}

.product-ai-pack-documents {
  min-width: 0;
}

.product-ai-pack-documents summary {
  cursor: pointer;
  color: var(--ink);
  font-size: 12.5px;
  font-weight: 700;
}

.product-ai-pack-doc-list {
  display: grid;
  gap: 6px;
  margin-top: 8px;
}

.product-ai-pack-doc {
  display: grid;
  gap: 3px;
  min-width: 0;
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: 8px;
  color: inherit;
  text-decoration: none;
}

.product-ai-pack-doc:hover {
  border-color: var(--accent);
}

.product-ai-pack-doc span {
  min-width: 0;
  color: var(--ink);
  font-size: 12.5px;
  font-weight: 650;
  line-height: 1.25;
  overflow-wrap: anywhere;
}

.product-ai-pack-doc em {
  color: var(--muted);
  font-size: 11.5px;
  font-style: normal;
  line-height: 1.25;
}

.ai-analysis-head span {
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
}

.content-summary-points {
  display: grid;
  gap: 6px;
  margin: 0;
  padding-left: 18px;
}

.content-summary-points li {
  color: var(--muted);
  font-size: 13px;
  line-height: 1.45;
}

.email-ai-analysis {
  margin: 0 0 16px;
}

.email-index-analysis {
  display: grid;
  gap: 10px;
  margin: 0 0 16px;
  padding: 14px;
  border: 1px solid #d8e4dc;
  border-radius: 8px;
  background: #f5faf6;
}

.email-index-analysis-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.email-index-analysis-head h3 {
  margin: 0;
  color: var(--ink);
  font-size: 15px;
  font-weight: 750;
  line-height: 1.25;
}

.email-index-analysis-head span,
.email-index-analysis-meta span,
.email-index-issues span {
  display: inline-flex;
  align-items: center;
  width: fit-content;
  min-height: 24px;
  padding: 4px 8px;
  border: 1px solid #d8e4dc;
  border-radius: 7px;
  background: #fff;
  color: #415149;
  font-size: 11px;
  font-weight: 800;
  line-height: 1.2;
}

.email-index-analysis p {
  margin: 0;
  color: var(--ink);
  font-size: 14px;
  line-height: 1.5;
}

.email-index-analysis-meta,
.email-index-issues {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.email-index-issues span {
  border-color: #eadcc0;
  background: #fff8ec;
  color: #7b5a23;
}

.email-index-issues a {
  display: inline-flex;
  align-items: center;
  width: fit-content;
  min-height: 24px;
  padding: 4px 8px;
  border: 1px solid #d8e4dc;
  border-radius: 7px;
  background: #fff;
  color: #146f65;
  font-size: 11px;
  font-weight: 800;
  line-height: 1.2;
  text-decoration: none;
}

.email-index-issues a:hover {
  border-color: rgba(20, 111, 101, 0.36);
  background: #eefaf7;
}

.email-sequence-index-analysis.a-verifier,
.email-sequence-index-analysis.incoherent,
.email-collection-index-analysis.a-verifier,
.email-collection-index-analysis.incoherent {
  border-color: #eadcc0;
  background: #fffaf2;
}

.email-sequence-index-analysis.incoherent {
  border-color: #efc4bc;
  background: #fff7f5;
}

.product-marketing-summary {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 14px;
  align-items: start;
  padding: 13px 14px;
  border: 1px solid #dfe7e2;
  border-radius: 8px;
  background: #fbfcfa;
}

.product-marketing-kicker {
  display: block;
  margin-bottom: 5px;
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

.product-marketing-summary p {
  margin: 0;
  color: var(--ink);
  font-size: 14px;
  line-height: 1.45;
}

.product-marketing-maturity {
  display: inline-flex;
  min-height: 30px;
  align-items: center;
  padding: 6px 10px;
  border-radius: 999px;
  background: #e6f4ee;
  color: #1d7365;
  font-size: 12px;
  font-weight: 800;
  white-space: nowrap;
}

.product-marketing-funnel {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 8px;
}

.product-marketing-funnel span {
  display: grid;
  min-width: 0;
  gap: 4px;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
}

.product-marketing-funnel i {
  width: 8px;
  height: 8px;
  border-radius: 999px;
  background: #9aa39d;
}

.product-marketing-funnel .present i,
.product-marketing-funnel .present-hors-bibliotheque-email i {
  background: #1d7365;
}

.product-marketing-funnel .a-verifier i,
.product-marketing-funnel .a-reconstruire i,
.product-marketing-funnel .a-construire i {
  background: #b78a18;
}

.product-marketing-funnel .manquant i {
  background: #b75c4a;
}

.product-marketing-funnel b {
  min-width: 0;
  color: var(--ink);
  font-size: 12.5px;
  font-weight: 750;
  line-height: 1.2;
}

.product-marketing-funnel em {
  min-width: 0;
  color: var(--muted);
  font-size: 11.5px;
  font-style: normal;
  font-weight: 650;
  line-height: 1.2;
}

.product-marketing-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 10px;
}

.product-marketing-card {
  display: flex;
  min-height: 116px;
  flex-direction: column;
  justify-content: space-between;
  gap: 8px;
  padding: 13px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #ffffff;
  box-shadow: 0 8px 18px rgba(22, 44, 34, 0.035);
  color: inherit;
  cursor: pointer;
  font: inherit;
  text-align: left;
  text-decoration: none;
}

.product-marketing-card:hover {
  border-color: var(--accent);
  box-shadow: 0 10px 22px rgba(22, 44, 34, 0.07);
  transform: translateY(-1px);
}

.product-marketing-card strong {
  display: block;
  min-width: 0;
}

.product-marketing-card small {
  display: block;
  min-width: 0;
  color: var(--muted);
  font-size: 11.5px;
  font-weight: 650;
  line-height: 1.25;
}

.product-marketing-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  min-width: 0;
}

.product-marketing-icon {
  flex: 0 0 auto;
  display: inline-grid;
  width: 32px;
  height: 32px;
  place-items: center;
  border-radius: 8px;
  background: #e6f4ee;
  color: #1d7365;
}

.product-marketing-card.pages .product-marketing-icon {
  background: #eaf2f7;
  color: #2f6f8f;
}

.product-marketing-card.ads .product-marketing-icon {
  background: #f4efd6;
  color: #9c7a1d;
}

.product-marketing-card.content .product-marketing-icon {
  background: #f0eafa;
  color: #7557b3;
}

.product-marketing-card.design .product-marketing-icon {
  background: #f8eaf0;
  color: #b15c7d;
}

.product-marketing-icon svg {
  width: 16px;
  height: 16px;
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.8;
}

.product-marketing-count {
  display: inline-flex;
  min-width: 0;
  height: auto;
  align-items: baseline;
  border-radius: 0;
  background: transparent;
  color: var(--text);
  font-size: 18px;
  font-style: normal;
  font-weight: 650;
  line-height: 1;
}

.product-marketing-card.pages .product-marketing-count {
  background: transparent;
  color: var(--text);
}

.product-marketing-card.ads .product-marketing-count {
  background: transparent;
  color: var(--text);
}

.product-marketing-card.content .product-marketing-count {
  background: transparent;
  color: var(--text);
}

.product-marketing-card.design .product-marketing-count {
  background: transparent;
  color: var(--text);
}

.product-marketing-card strong {
  font-size: 14px;
  font-weight: 600;
  line-height: 1.25;
}

.product-marketing-action {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: var(--muted);
  font-size: 12.5px;
  font-weight: 600;
  line-height: 1.2;
}

.product-marketing-priorities {
  display: grid;
  gap: 8px;
  padding: 12px 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
}

.product-marketing-priorities > strong {
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

.product-marketing-priorities ol {
  display: grid;
  gap: 6px;
  margin: 0;
  padding-left: 18px;
}

.product-marketing-priorities li {
  color: var(--ink);
  font-size: 13px;
  line-height: 1.35;
}

.resource-archive {
  margin-top: 14px;
  padding: 11px 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--bg);
}

.resource-archive summary {
  color: var(--muted);
  cursor: pointer;
  font-size: 12px;
  font-weight: 800;
  text-transform: uppercase;
}

.product-angle-list {
  margin: 0;
  padding-left: 20px;
  line-height: 1.7;
}

.product-rail {
  position: sticky;
  top: 20px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.product-rail-card {
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--panel);
}

.product-rail-card h3 {
  margin: 0 0 12px;
  color: var(--muted);
  font-size: 13px;
  font-weight: 750;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.product-rail-resource {
  display: grid;
  width: 100%;
  gap: 7px;
  padding: 0;
  border: 0;
  background: transparent;
  color: inherit;
  font: inherit;
  text-align: left;
  text-decoration: none;
  cursor: pointer;
}

.product-rail-resource:hover strong {
  color: var(--accent);
}

.product-rail-resource strong,
.product-rail-resource small {
  display: block;
}

.product-rail-resource strong {
  font-size: 13.5px;
  font-weight: 600;
}

.product-rail-resource small {
  color: var(--muted);
  font-size: 12px;
  line-height: 1.35;
}

.rail-visual-strip {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 6px;
  min-height: 74px;
}

.rail-visual-strip img,
.rail-visual-thumb,
.rail-visual-strip i {
  display: grid;
  width: 100%;
  height: 74px;
  place-items: center;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fcfcfb;
  object-fit: contain;
}

.rail-visual-thumb {
  place-items: center;
  color: var(--accent);
  font-size: 11px;
  font-weight: 750;
}

.rail-visual-strip i {
  grid-column: 1 / -1;
  color: var(--muted);
  font-size: 12px;
  font-style: normal;
  font-weight: 600;
}

.product-metric {
  margin-bottom: 14px;
  padding: 14px;
  border-radius: 10px;
}

.product-ca {
  border: 1px solid #e6dcc0;
  background: var(--gold-soft);
}

.product-clients {
  border: 1px solid #f0c195;
  background: #fff1df;
}

.product-cart {
  border: 1px solid #ead0dc;
  background: var(--pink-soft);
}

.product-conversion {
  border: 1px solid #bfd8ec;
  background: var(--blue-soft);
}

.product-metric span,
.product-metric small {
  display: block;
}

.product-metric span {
  color: var(--warning);
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
}

.product-metric strong {
  display: block;
  margin-top: 6px;
  color: var(--warning);
  font-size: 24px;
}

.product-metric small {
  margin-top: 3px;
  color: var(--muted);
}

.product-clients span,
.product-clients strong {
  color: #b75516;
}

.product-cart span,
.product-cart strong {
  color: #a43c68;
}

.product-conversion span,
.product-conversion strong {
  color: var(--blue);
}

.product-rail .product-metric {
  margin-bottom: 14px;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
}

.product-rail .product-metric span {
  margin-top: 2px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 400;
  text-transform: none;
}

.product-rail .product-metric strong {
  margin-top: 0;
  color: var(--text);
  font-size: 22px;
  line-height: 1.1;
  font-weight: 650;
}

.product-rail .product-metric small {
  margin-top: 3px;
  color: var(--gold);
  font-size: 11px;
}

.product-pivot-group {
  display: flex;
  flex-direction: column;
  gap: 7px;
}

.product-pivot-group h3 {
  margin-bottom: 8px;
  color: var(--muted);
  font-size: 11px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.product-pivot-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 7px 9px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: #fcfcfb;
  color: inherit;
  font-size: 13px;
  text-decoration: none;
}

.product-pivot-item:hover {
  border-color: var(--accent);
}

.product-pivot-item strong {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 13px;
  font-weight: 500;
}

.product-pivot-item span {
  flex-shrink: 0;
  color: var(--muted);
  font-size: 11.5px;
}

/* Email module */
.email-head {
  align-items: end;
}

.email-view-switch {
  display: flex;
  gap: 5px;
  margin-bottom: 16px;
  flex-wrap: wrap;
}

.email-view-switch button {
  min-height: 36px;
  padding: 0 14px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--panel);
  color: var(--muted);
  font: inherit;
  font-size: 13px;
  font-weight: 800;
  cursor: pointer;
}

.email-view-switch button:hover,
.email-view-switch button.active {
  border-color: var(--accent);
  background: var(--accent-soft);
  color: var(--accent);
}

.email-filters {
  margin-bottom: 14px;
}

.email-decision-stats {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 10px;
  margin: 12px 0 14px;
}

.email-decision-stats span {
  display: grid;
  gap: 2px;
  min-height: 64px;
  align-content: center;
  padding: 12px 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel);
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
}

.email-decision-stats strong {
  color: var(--text);
  font-size: 20px;
  line-height: 1;
}

.email-decision-toolbar {
  grid-template-columns: repeat(3, minmax(180px, 1fr));
  margin-bottom: 14px;
}

.email-decision-list {
  display: grid;
  gap: 12px;
}

.email-decision-card {
  display: grid;
  gap: 14px;
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel);
}

.email-decision-card-head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 14px;
  align-items: start;
}

.email-decision-card h2 {
  margin: 8px 0 0;
  color: var(--text);
  font-size: 16px;
  line-height: 1.35;
}

.email-decision-badges {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 6px;
}

.email-decision-badges span {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  padding: 3px 8px;
  border-radius: 999px;
  background: #f0eeea;
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
  white-space: nowrap;
}

.email-decision-reasons {
  display: grid;
  gap: 6px;
  margin: 0;
  padding-left: 18px;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.45;
}

.email-decision-entities {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 8px;
}

.email-decision-entity {
  display: grid;
  gap: 3px;
  min-width: 0;
  padding: 10px 11px;
  border: 1px solid #ece9e4;
  border-radius: 8px;
  background: #fbfbf9;
  color: inherit;
  font: inherit;
  text-align: left;
  text-decoration: none;
}

button.email-decision-entity {
  cursor: pointer;
}

.email-decision-entity:hover {
  border-color: var(--accent);
}

.email-decision-entity strong {
  overflow: hidden;
  color: var(--text);
  font-size: 13px;
  line-height: 1.3;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.email-decision-entity span {
  overflow: hidden;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.35;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.email-decision-entity.unresolved {
  border-style: dashed;
}

.email-product-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.email-product-card {
  display: grid;
  min-height: 178px;
  align-content: start;
  gap: 10px;
  padding: 18px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel);
  color: inherit;
  cursor: pointer;
}

.email-product-card:hover {
  border-color: var(--accent);
}

.email-product-card span {
  color: var(--muted);
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

.email-product-card h2 {
  font-size: 20px;
  line-height: 1.15;
}

.email-product-card p {
  margin: 0;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.4;
}

.email-product-stats {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.5;
}

.email-product-stats strong {
  color: var(--accent);
}

.email-category-stack {
  display: grid;
  gap: 18px;
}

.email-sequence-directory {
  display: grid;
  gap: 14px;
  margin-top: 22px;
}

.email-directory-head {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 12px;
  padding-top: 18px;
  border-top: 1px solid var(--line);
}

.email-directory-head h2 {
  margin: 0;
  font-size: 20px;
}

.email-directory-head span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
}

.email-category-band {
  padding-top: 2px;
}

.email-category-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 10px;
  padding-bottom: 8px;
  border-bottom: 1px solid var(--line);
}

.email-category-head h2 {
  font-size: 21px;
}

.email-category-head span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
}

.email-sequence-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.email-sequence-card {
  min-height: 172px;
  padding: 18px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel);
  color: inherit;
  cursor: pointer;
}

.email-sequence-card:hover {
  border-color: var(--accent);
}

.email-sequence-card h3 {
  margin-bottom: 4px;
  font-size: 17px;
  line-height: 1.2;
}

.email-sequence-sub,
.email-sequence-used {
  color: var(--muted);
  font-size: 13px;
}

.email-sequence-sub strong {
  color: var(--text);
  font-weight: 900;
}

.email-sequence-meta {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 12px;
  flex-wrap: wrap;
}

.email-sequence-meta span:last-child {
  color: var(--accent);
  font-size: 12px;
  font-weight: 800;
}

.email-sequence-mini {
  display: flex;
  gap: 4px;
  margin-top: 12px;
}

.email-sequence-dot {
  height: 5px;
  flex: 1;
  border-radius: 999px;
  background: var(--line);
}

.email-chip {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  padding: 3px 9px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 800;
  white-space: nowrap;
}

.email-chip.lancement,
.email-sequence-dot.lancement {
  background: var(--pink-soft);
  color: var(--pink);
}

.email-sequence-dot.lancement {
  background: var(--pink);
}

.email-chip.livraison,
.email-sequence-dot.livraison {
  background: var(--accent-soft);
  color: var(--accent);
}

.email-sequence-dot.livraison {
  background: var(--accent);
}

.email-chip.onboarding,
.email-sequence-dot.onboarding {
  background: var(--onboarding-soft);
  color: var(--onboarding);
}

.email-sequence-dot.onboarding {
  background: var(--onboarding);
}

.email-chip.nurture,
.email-sequence-dot.nurture {
  background: var(--blue-soft);
  color: var(--blue);
}

.email-sequence-dot.nurture {
  background: var(--blue);
}

.email-chip.acquisition,
.email-sequence-dot.acquisition {
  background: var(--pod-soft);
  color: var(--pod);
}

.email-sequence-dot.acquisition {
  background: var(--pod);
}

.email-chip.feedback,
.email-sequence-dot.feedback {
  background: var(--warning-soft);
  color: var(--warning);
}

.email-sequence-dot.feedback {
  background: var(--warning);
}

.email-chip.transactionnel,
.email-sequence-dot.transactionnel {
  background: var(--gold-soft);
  color: var(--warning);
}

.email-sequence-dot.transactionnel {
  background: var(--warning);
}

.email-chip.a-trier,
.email-sequence-dot.a-trier {
  background: #f0eeea;
  color: var(--muted);
}

.email-sequence-dot.a-trier {
  background: var(--muted);
}

.email-chip.client-update,
.email-sequence-dot.client-update {
  background: var(--blue-soft);
  color: var(--blue);
}

.email-sequence-dot.client-update {
  background: var(--blue);
}

.email-chip.standalone-campaign,
.email-sequence-dot.standalone-campaign {
  background: #f1ecff;
  color: #5b3b93;
}

.email-chip.content-broadcast,
.email-sequence-dot.content-broadcast {
  background: #e9f6f1;
  color: #16745a;
}

.email-chip.reconnect-community,
.email-sequence-dot.reconnect-community {
  background: #f3e9ef;
  color: #8b3d66;
}

.email-chip.english-hold,
.email-sequence-dot.english-hold {
  background: #eaf1f8;
  color: #2c628d;
}

.email-chip.archive-ac,
.email-sequence-dot.archive-ac {
  background: #ecebea;
  color: #6d6761;
}

.email-phase-chip {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  padding: 3px 8px;
  border-radius: 999px;
  background: #f0eeea;
  color: var(--muted);
  font-size: 11px;
  font-weight: 700;
  white-space: nowrap;
}

.email-table tbody tr {
  cursor: pointer;
}

.email-table tbody tr:hover {
  background: #fbfbf9;
}

.email-detail-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 16px;
  padding-bottom: 14px;
  border-bottom: 1px solid var(--line);
}

.email-detail-head p {
  margin: 0 0 6px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.email-detail-head h1 {
  font-size: 30px;
  line-height: 1.15;
}

.email-detail-head.module-header {
  margin-bottom: 22px;
  padding-bottom: 18px;
}

.email-detail-head.module-header h1 {
  font-size: 38px;
  line-height: 1.04;
}

.email-detail-sub {
  margin-top: 6px;
  color: var(--muted);
  font-size: 14px;
}

.email-timeline {
  display: grid;
  gap: 8px;
}

.email-product-strategy {
  display: grid;
  gap: 14px;
  margin: 0 0 18px;
}

.email-product-strategy-head {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(280px, 0.8fr);
  gap: 16px;
  align-items: start;
  padding: 18px 0;
  border-bottom: 1px solid var(--line);
}

.email-product-strategy-head h2,
.email-strategy-panel-head h2,
.email-sequence-analysis h3 {
  margin: 0;
  font-size: 18px;
  line-height: 1.2;
}

.email-product-strategy-head p,
.email-sequence-analysis-head p {
  margin: 6px 0 0;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.5;
}

.email-strategy-stats {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 8px;
}

.email-strategy-stats span {
  display: grid;
  min-height: 62px;
  align-content: center;
  gap: 3px;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fbfbf9;
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
}

.email-strategy-stats strong {
  color: var(--text);
  font-size: 19px;
  line-height: 1;
}

.email-strategy-panel {
  display: grid;
  gap: 12px;
  padding: 16px 0;
  border-bottom: 1px solid var(--line);
}

.email-strategy-panel.warning {
  border-color: #ead8a2;
}

.email-strategy-panel-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
}

.email-strategy-panel-head span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
}

.email-marketing-map {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.email-map-step {
  display: grid;
  min-height: 132px;
  align-content: start;
  gap: 7px;
  padding: 13px;
  border: 1px solid var(--line);
  border-left: 4px solid var(--muted);
  border-radius: 8px;
  background: var(--panel);
}

.email-map-step.present,
.email-map-step.present-hors-bibliotheque-email {
  border-left-color: var(--accent);
}

.email-map-step.a-verifier,
.email-map-step.a-reconstruire,
.email-map-step.a-construire {
  border-left-color: var(--warning);
}

.email-map-step.manquant {
  border-left-color: var(--danger);
}

.email-map-step span {
  color: var(--muted);
  font-size: 10.5px;
  font-weight: 900;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

.email-map-step strong {
  color: var(--text);
  font-size: 14px;
  line-height: 1.2;
}

.email-map-step p,
.email-related-sequences p,
.email-missing-launches p,
.email-missing-launches small {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.45;
}

.email-strategy-list {
  display: grid;
  gap: 7px;
  margin: 0;
  padding-left: 18px;
  color: var(--text);
  font-size: 13px;
  line-height: 1.45;
}

.email-missing-launches,
.email-related-sequences {
  display: grid;
  gap: 8px;
}

.email-missing-launches article,
.email-related-sequences article {
  display: grid;
  gap: 5px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fbfbf9;
}

.email-missing-launches article {
  border-color: #ead8a2;
  background: #fffaf0;
}

.email-missing-launches strong,
.email-related-sequences strong {
  color: var(--text);
  font-size: 14px;
}

.email-missing-launches span,
.email-related-sequences span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
}

.email-sequence-analysis {
  display: grid;
  gap: 12px;
  padding: 14px;
  border-bottom: 1px solid var(--line);
  background: #fbfbf9;
}

.email-sequence-analysis-head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: start;
}

.email-sequence-analysis-head > span {
  display: inline-flex;
  align-items: center;
  min-height: 32px;
  padding: 4px 10px;
  border-radius: 999px;
  background: var(--accent-soft);
  color: var(--accent);
  font-size: 12px;
  font-weight: 900;
}

.email-analysis-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}

.email-analysis-grid div,
.email-analysis-columns div {
  min-width: 0;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel);
}

.email-analysis-grid strong,
.email-analysis-columns strong {
  display: block;
  margin-bottom: 4px;
  color: var(--text);
  font-size: 12px;
}

.email-analysis-grid p {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.45;
}

.email-analysis-columns {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.email-analysis-columns ul {
  display: grid;
  gap: 5px;
  margin: 0;
  padding-left: 16px;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.4;
}

.email-sequence-accordion-list {
  display: grid;
  gap: 10px;
}

.email-sequence-accordion {
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--panel);
}

.email-sequence-accordion > summary {
  display: grid;
  grid-template-columns: auto auto minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  min-height: 58px;
  padding: 12px 14px;
  cursor: pointer;
  list-style: none;
}

.email-sequence-accordion > summary::-webkit-details-marker,
.email-message-accordion > summary::-webkit-details-marker {
  display: none;
}

.email-sequence-accordion[open] > summary {
  border-bottom: 1px solid var(--line);
  background: #fbfbf9;
}

.email-sequence-caret {
  color: var(--muted);
  font-size: 14px;
  font-weight: 900;
  transform: rotate(-90deg);
  transition: transform 0.16s ease;
}

.email-sequence-accordion[open] .email-sequence-caret {
  transform: rotate(0deg);
}

.email-sequence-title {
  min-width: 0;
}

.email-sequence-title strong {
  display: block;
  overflow: hidden;
  color: var(--text);
  font-size: 14px;
  font-weight: 800;
  line-height: 1.25;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.email-sequence-title small {
  display: block;
  overflow: hidden;
  margin-top: 2px;
  color: var(--muted);
  font-size: 12px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.email-sequence-pill,
.email-sequence-count,
.email-message-phase {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  padding: 3px 8px;
  border-radius: 999px;
  background: #f0eeea;
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
  white-space: nowrap;
}

.email-sequence-count {
  min-height: auto;
  padding: 0;
  border-radius: 0;
  background: transparent;
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
}

.email-message-stack {
  display: grid;
  gap: 0;
}

.email-message-accordion {
  border-top: 1px solid #eef0ec;
}

.email-message-accordion:first-child {
  border-top: 0;
}

.email-message-accordion > summary {
  display: grid;
  grid-template-columns: 72px minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  padding: 11px 14px;
  cursor: pointer;
  list-style: none;
}

.email-message-accordion > summary:hover {
  background: var(--accent-soft);
}

.email-message-day {
  color: var(--accent);
  font-size: 12px;
  font-weight: 900;
}

.email-message-main {
  min-width: 0;
}

.email-message-main strong {
  display: block;
  overflow: hidden;
  font-size: 13px;
  line-height: 1.25;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.email-message-main small {
  display: block;
  overflow: hidden;
  margin-top: 2px;
  color: var(--muted);
  font-size: 11.5px;
  line-height: 1.35;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.email-message-body {
  padding: 0 14px 14px 98px;
}

.email-message-body p {
  max-width: 760px;
  margin: 0 0 10px;
  color: #3d4540;
  font-size: 13.5px;
  line-height: 1.65;
}

.email-message-link {
  display: grid;
  width: 100%;
  grid-template-columns: 72px minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  padding: 11px 14px;
  border: 0;
  border-top: 1px solid #eef0ec;
  background: transparent;
  color: var(--text);
  font: inherit;
  text-align: left;
  cursor: pointer;
}

.email-message-link:first-child {
  border-top: 0;
}

.email-message-link:hover {
  background: var(--accent-soft);
}

.email-step {
  display: grid;
  grid-template-columns: 72px minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  padding: 12px 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel);
  cursor: pointer;
}

.email-step:hover {
  border-color: var(--accent);
}

.email-step-day {
  color: var(--accent);
  font-size: 13px;
  font-weight: 800;
}

.email-step-body {
  min-width: 0;
}

.email-step-subject {
  font-size: 14px;
  font-weight: 800;
}

.email-step-preview {
  margin-top: 3px;
  overflow: hidden;
  color: var(--muted);
  font-size: 13px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.email-step-open {
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
}

.email-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(var(--workshop-rail-min), var(--workshop-rail-max));
  gap: var(--workshop-gap);
  align-items: start;
}

.email-card,
.email-rail {
  padding: 18px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--panel);
}

.email-card-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin: 14px 0 8px;
}

.email-card-head h2,
.email-rail h2 {
  font-size: 16px;
}

.email-field {
  margin-bottom: 12px;
}

.email-field label,
.email-rail-field label {
  display: block;
  margin-bottom: 5px;
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.03em;
  text-transform: uppercase;
}

.email-field input,
.email-rail-field select {
  width: 100%;
  min-height: 38px;
  padding: 8px 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  color: var(--text);
  font: inherit;
}

.email-body-edit {
  width: 100%;
  min-height: 440px;
  padding: 13px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--bg);
  color: var(--text);
  font: 13px/1.6 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  resize: vertical;
}

.email-editor-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  padding: 8px;
  border: 1px solid var(--line);
  border-bottom: 0;
  border-radius: 8px 8px 0 0;
  background: #fff;
}

.email-editor-format {
  min-height: 30px;
  max-width: 148px;
  padding: 5px 28px 5px 9px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: #fff;
  color: var(--text);
  font: 700 12px/1 Inter, ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
}

.email-toolbar-separator {
  width: 1px;
  height: 22px;
  margin: 0 2px;
  background: var(--line);
}

.email-tool-button {
  display: inline-grid;
  place-items: center;
  min-width: 32px;
  height: 30px;
  padding: 0 8px;
  border: 1px solid transparent;
  border-radius: 7px;
  background: transparent;
  color: var(--text);
  font: 700 13px/1 Inter, ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
  cursor: pointer;
}

.email-tool-button:hover {
  border-color: var(--line);
  background: var(--bg);
}

.email-writing-note {
  margin: -2px 0 10px;
  color: var(--muted);
  font-size: 12.5px;
  line-height: 1.45;
}

.email-body-writing {
  min-height: 560px;
  padding: 22px;
  border-radius: 0 0 8px 8px;
  background: #fff;
  font: 15px/1.75 Inter, ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
}

.email-rich-editor {
  overflow: auto;
  outline: 0;
  white-space: normal;
}

.email-rich-editor > * {
  width: auto !important;
  max-width: none !important;
}

.email-rich-editor:focus-visible {
  border-color: var(--accent);
  box-shadow: 0 0 0 3px var(--accent-soft);
}

.email-rich-editor p,
.email-rich-editor ul,
.email-rich-editor ol,
.email-rich-editor h2,
.email-rich-editor h3 {
  max-width: none;
}

.email-rich-editor p {
  margin: 0 0 18px;
}

.email-rich-editor h2,
.email-rich-editor h3 {
  margin: 28px 0 12px;
  color: var(--text);
  line-height: 1.25;
}

.email-rich-editor h2 {
  font-size: 22px;
}

.email-rich-editor h3 {
  font-size: 18px;
}

.email-rich-editor ul,
.email-rich-editor ol {
  display: grid;
  gap: 8px;
  margin: 0 0 18px;
  padding-left: 24px;
}

.email-rich-editor hr {
  margin: 26px 0;
  border: 0;
  border-top: 1px solid var(--line);
}

.email-rich-editor li {
  padding-left: 2px;
}

.email-rich-editor a {
  color: var(--accent);
  font-weight: 750;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.email-rich-editor blockquote {
  margin: 0 0 18px;
  padding: 4px 0 4px 16px;
  border-left: 3px solid var(--accent);
  color: #3d4742;
}

.email-rich-editor blockquote p:last-child {
  margin-bottom: 0;
}

.email-rich-editor code {
  padding: 2px 5px;
  border-radius: 5px;
  background: var(--bg);
  color: var(--text);
  font-size: 0.9em;
}

.email-rail {
  position: sticky;
  top: 20px;
}

.email-rail-field {
  margin-bottom: 12px;
}

.email-rail-field strong {
  font-size: 13px;
}

.email-used-list {
  display: grid;
  gap: 7px;
  margin-top: 10px;
}

.email-used-item {
  display: grid;
  gap: 5px;
  padding: 9px 11px;
  border: 1px solid var(--line);
  border-radius: 8px;
  color: inherit;
  font-size: 13px;
  text-decoration: none;
}

.email-used-item .email-chip {
  justify-self: start;
}

.email-used-item span {
  display: block;
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
}

.email-used-item strong {
  display: block;
  margin-top: 3px;
  font-size: 13px;
}

.email-used-item:hover {
  border-color: var(--accent);
}

.email-rail-note {
  margin: 12px 0 0;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.5;
}

.email-ac-panel {
  display: grid;
  gap: 10px;
  margin-top: 18px;
  padding-top: 16px;
  border-top: 1px solid var(--line);
}

.email-ac-panel h2 {
  margin: 0;
}

.email-ac-summary {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.email-ac-summary span {
  display: inline-flex;
  width: fit-content;
  min-height: 24px;
  padding: 4px 8px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--bg);
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
}

.email-ac-usage-list {
  display: grid;
  gap: 8px;
}

.email-ac-usage-details {
  display: grid;
  gap: 8px;
}

.email-ac-usage-details > summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 9px 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  color: var(--text);
  font-size: 12px;
  font-weight: 850;
  cursor: pointer;
}

.email-ac-usage-details > summary::-webkit-details-marker {
  display: none;
}

.email-ac-usage-details > summary::after {
  content: "Ouvrir";
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
}

.email-ac-usage-details[open] > summary::after {
  content: "Fermer";
}

.email-ac-audience-summary {
  display: grid;
  gap: 5px;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--bg);
}

.email-ac-audience-summary strong {
  color: var(--text);
  font-size: 13px;
}

.email-ac-audience-summary small {
  color: var(--muted);
  font-size: 11.5px;
  font-weight: 700;
  line-height: 1.35;
}

.email-sequence-audience-strategy {
  margin: 18px 0;
  padding: 20px;
  border: 1px solid var(--border-soft, #e7e1d8);
  border-radius: 18px;
  background: #fffdf9;
}

.email-sequence-audience-head,
.email-ac-targeting-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
}

.email-sequence-audience-head p,
.email-sequence-audience-head h2,
.email-sequence-audience-phases p,
.email-ac-segment-rule p {
  margin: 0;
}

.email-sequence-audience-head p {
  color: var(--text-muted, #746f68);
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: .06em;
}

.email-sequence-audience-summary {
  max-width: 920px;
  margin: 14px 0 16px;
  line-height: 1.55;
}

.email-sequence-audience-counts {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin: 14px 0;
}

.email-sequence-audience-counts span,
.email-sequence-audience-phases article,
.email-ac-targeting-detail {
  padding: 12px;
  border: 1px solid #ebe4da;
  border-radius: 12px;
  background: #fff;
}

.email-sequence-audience-counts strong {
  display: block;
  margin-bottom: 3px;
  font-size: 20px;
}

.email-sequence-audience-phases {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin-top: 16px;
}

.email-sequence-audience-phases p,
.email-ac-segment-rule p {
  margin-top: 6px;
  color: var(--text-muted, #746f68);
  line-height: 1.45;
}

.email-sequence-audience-limitations {
  margin-top: 14px;
}

.email-sequence-audience-limitations li {
  margin: 7px 0;
}

.email-ac-targeting-detail {
  margin-top: 10px;
  background: #fcfaf6;
}

.email-ac-targeting-status {
  padding: 4px 8px;
  border-radius: 999px;
  font-size: 11px;
  white-space: nowrap;
}

.email-ac-targeting-status.is-confirmed {
  color: #2d6a4f;
  background: #e8f5ed;
}

.email-ac-targeting-status.is-partial {
  color: #8a5b16;
  background: #fff2d8;
}

.email-ac-segment-rule,
.email-ac-targeting-source {
  margin-top: 10px;
}

.email-ac-segment-rule small,
.email-ac-targeting-source > small {
  display: block;
  margin-top: 4px;
  color: var(--text-muted, #746f68);
}

@media (max-width: 760px) {
  .email-sequence-audience-counts,
  .email-sequence-audience-phases {
    grid-template-columns: 1fr;
  }

  .email-sequence-audience-head,
  .email-ac-targeting-head {
    align-items: stretch;
    flex-direction: column;
  }
}

.email-ac-chip-group {
  display: grid;
  gap: 6px;
}

.email-ac-chip-label {
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
}

.email-ac-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
}

.email-ac-chips span,
.email-ac-more summary {
  display: inline-flex;
  width: fit-content;
  max-width: 100%;
  padding: 4px 7px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: #fff;
  color: #45534d;
  font-size: 11px;
  font-weight: 750;
  line-height: 1.25;
}

.email-ac-more {
  display: grid;
  gap: 6px;
}

.email-ac-more summary {
  cursor: pointer;
}

.email-ac-more[open] summary {
  margin-bottom: 6px;
}

.email-ac-usage {
  display: grid;
  gap: 5px;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
}

.email-ac-usage strong {
  color: var(--text);
  font-size: 13px;
  line-height: 1.3;
}

.email-ac-usage span,
.email-ac-usage small {
  color: var(--muted);
  font-size: 11.5px;
  font-weight: 700;
  line-height: 1.35;
}

.email-ac-stats {
  display: grid;
  gap: 5px;
  margin: 4px 0 0;
}

.email-ac-stats div {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  font-size: 11.5px;
  line-height: 1.3;
}

.email-ac-stats dt,
.email-ac-stats dd {
  margin: 0;
}

.email-ac-stats dt {
  color: var(--muted);
}

.email-ac-stats dd {
  color: var(--text);
  font-weight: 800;
  text-align: right;
}

/* Library directory redesign */
.email-module,
.pages-module {
  max-width: 1280px;
}

.module-subtitle {
  max-width: 660px;
  margin-top: 8px;
  color: var(--muted);
  font-size: 15px;
  line-height: 1.45;
}

.segmented-control {
  display: inline-flex;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--panel);
}

.segmented-control button {
  min-height: 36px;
  border: 0;
  border-right: 1px solid var(--line);
  border-radius: 0;
  background: transparent;
  color: var(--muted);
}

.segmented-control button:last-child {
  border-right: 0;
}

.segmented-control button.active {
  background: var(--text);
  color: #fff;
}

.library-chips {
  display: flex;
  gap: 8px;
  margin: -5px 0 16px;
  flex-wrap: wrap;
}

.library-chip {
  display: inline-flex;
  min-height: 32px;
  align-items: center;
  gap: 7px;
  padding: 0 12px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--panel);
  color: var(--text);
  font: inherit;
  font-size: 12.5px;
  font-weight: 800;
  cursor: pointer;
}

.library-chip[aria-pressed="false"] {
  opacity: 0.42;
}

.library-chip i {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--chip-color, var(--muted));
}

.library-chip span {
  color: var(--muted);
  font-variant-numeric: tabular-nums;
}

.library-chip-all {
  border-color: var(--text);
  background: var(--text);
  color: #fff;
}

.library-chip-all span {
  color: rgba(255, 255, 255, 0.7);
}

.library-chip.lancement,
.library-group.lancement,
.page-type-sales {
  --chip-color: var(--pink);
  --group-color: var(--pink);
  --group-soft: var(--pink-soft);
}

.library-chip.livraison,
.library-group.livraison,
.page-type-delivery {
  --chip-color: var(--gold);
  --group-color: var(--gold);
  --group-soft: var(--gold-soft);
}

.library-chip.onboarding,
.library-group.onboarding,
.page-type-confirmation {
  --chip-color: var(--onboarding);
  --group-color: var(--onboarding);
  --group-soft: var(--onboarding-soft);
}

.library-chip.acquisition,
.library-group.acquisition,
.page-type-checkout {
  --chip-color: var(--accent);
  --group-color: var(--accent);
  --group-soft: var(--accent-soft);
}

.library-chip.nurture,
.library-group.nurture,
.page-type-other,
.page-type-blog,
.page-space-blog {
  --chip-color: var(--pod);
  --group-color: var(--pod);
  --group-soft: var(--pod-soft);
}

.library-chip.client-update,
.library-group.client-update {
  --chip-color: var(--blue);
  --group-color: var(--blue);
  --group-soft: var(--blue-soft);
}

.library-chip.english-hold,
.library-group.english-hold {
  --chip-color: var(--accent);
  --group-color: var(--accent);
  --group-soft: var(--accent-soft);
}

.library-chip.archive-ac,
.library-group.archive-ac {
  --chip-color: var(--muted);
  --group-color: var(--muted);
  --group-soft: #eceeea;
}

.library-chip.feedback,
.library-group.feedback,
.page-type-custom,
.page-type-bonus,
.page-space-bonus {
  --chip-color: var(--warning);
  --group-color: var(--warning);
  --group-soft: var(--warning-soft);
}

.page-type-capture,
.page-type-funnel,
.page-space-free {
  --chip-color: var(--accent);
  --group-color: var(--accent);
  --group-soft: var(--accent-soft);
}

.page-type-site,
.page-space-site {
  --chip-color: var(--blue);
  --group-color: var(--blue);
  --group-soft: var(--blue-soft);
}

.page-type-legal,
.page-space-legal,
.page-space-triage {
  --chip-color: var(--muted);
  --group-color: var(--muted);
  --group-soft: #eceeea;
}

.page-space-paid {
  --chip-color: var(--pink);
  --group-color: var(--pink);
  --group-soft: var(--pink-soft);
}

.page-space-external {
  --chip-color: var(--gold);
  --group-color: var(--gold);
  --group-soft: var(--gold-soft);
}

.page-type-resource {
  --chip-color: var(--gold);
  --group-color: var(--gold);
  --group-soft: var(--gold-soft);
}

.page-type-reference {
  --chip-color: var(--pod);
  --group-color: var(--pod);
  --group-soft: var(--pod-soft);
}

.page-type-affiliate {
  --chip-color: var(--launch);
  --group-color: var(--launch);
  --group-soft: var(--launch-soft);
}

.page-type-redirect {
  --chip-color: var(--muted);
  --group-color: var(--muted);
  --group-soft: #f0f1ee;
}

.library-chip.transactionnel,
.library-chip.a-trier,
.library-group.transactionnel,
.library-group.a-trier,
.library-group.email-product-view {
  --chip-color: var(--muted);
  --group-color: var(--muted);
  --group-soft: #eceeea;
}

.email-summary,
.pages-summary {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin-bottom: 22px;
}

.email-sequence-directory,
.pages-directory {
  display: grid;
  gap: 14px;
  margin-top: 0;
}

.library-card-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.library-directory-section {
  display: grid;
  gap: 10px;
}

.library-section-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  margin: 20px 0 10px;
}

.library-section-head h2 {
  font-size: 18px;
  line-height: 1.2;
}

.library-section-head span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
}

.archive-section-head {
  margin-top: 26px;
}

.archive-entry-card {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  padding: 15px 16px;
  border: 1px solid var(--line);
  border-left: 4px solid var(--accent);
  border-radius: 8px;
  background: var(--panel);
  color: var(--text);
  text-decoration: none;
}

.archive-entry-card:hover {
  background: var(--accent-soft);
}

.archive-entry-card span {
  display: grid;
  min-width: 0;
  gap: 3px;
}

.archive-entry-card strong {
  font-size: 14px;
}

.archive-entry-card small {
  overflow: hidden;
  color: var(--muted);
  font-size: 12px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.archive-entry-card b {
  color: var(--accent);
  font-size: 12px;
  font-weight: 900;
  white-space: nowrap;
}

.library-group {
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--panel);
}

.library-group-head {
  display: flex;
  align-items: center;
  gap: 11px;
  padding: 13px 16px;
  border-left: 4px solid var(--group-color, var(--line));
  cursor: pointer;
}

.library-group-head:hover {
  background: #fbfbf9;
}

.library-navigation-card {
  cursor: pointer;
}

.library-navigation-card .library-group-head {
  min-height: 58px;
}

.library-card-arrow {
  color: var(--group-color, var(--muted));
  font-size: 17px;
  font-weight: 900;
  line-height: 1;
}

.library-group-subtitle {
  margin: -6px 16px 14px 42px;
  color: var(--muted);
  font-size: 12.5px;
  line-height: 1.4;
}

.library-caret {
  color: var(--muted);
  font-weight: 900;
  transition: transform 0.16s ease;
}

.library-group.collapsed .library-caret {
  transform: rotate(-90deg);
}

.library-group-head h2 {
  flex: 1;
  min-width: 0;
  font-size: 16px;
  line-height: 1.18;
}

.library-group-meta {
  color: var(--muted);
  font-size: 11.5px;
  font-weight: 800;
  white-space: nowrap;
}

.library-group-count {
  padding: 3px 9px;
  border-radius: 999px;
  background: var(--group-soft, #eceeea);
  color: var(--group-color, var(--muted));
  font-size: 11.5px;
  font-weight: 900;
  white-space: nowrap;
}

.library-group.collapsed .library-group-body {
  display: none;
}

.library-lane-label {
  padding: 10px 16px 5px;
  color: var(--muted);
  font-size: 10.5px;
  font-weight: 900;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

.email-sequence-rows {
  display: grid;
}

.email-sequence-row {
  display: grid;
  min-height: auto;
  grid-template-columns: 136px minmax(0, 1fr) auto;
  align-items: center;
  gap: 18px;
  padding: 11px 16px;
  border: 0;
  border-top: 1px solid #eef0ec;
  border-radius: 0;
  box-shadow: none;
}

.email-sequence-row:hover {
  background: var(--accent-soft);
}

.official-sequence-link {
  color: inherit;
  text-decoration: none;
}

.official-sequence-link.a-verifier,
.official-sequence-link.incoherent {
  background: #fffaf2;
}

.official-sequence-link.incoherent {
  background: #fff7f5;
}

.email-sequence-main {
  min-width: 0;
}

.email-sequence-row h3 {
  margin: 0;
  font-size: 13px;
  line-height: 1.25;
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* Contacts library */
.contacts-module {
  max-width: 1180px;
}

.contacts-sync-badge {
  display: inline-flex;
  min-height: 34px;
  align-items: center;
  gap: 7px;
  padding: 0 12px;
  border-radius: 999px;
  background: #e9ecff;
  color: #3d5afe;
  font-size: 12px;
  font-weight: 900;
  white-space: nowrap;
}

.contacts-sync-badge::before {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #3d5afe;
  content: "";
}

.contacts-kpis {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  margin-bottom: 16px;
}

.contacts-kpi {
  padding: 14px 16px;
  border: 1px solid var(--line);
  border-left: 4px solid var(--accent);
  border-radius: 8px;
  background: var(--panel);
}

.contacts-kpi.blue {
  border-left-color: var(--blue);
}

.contacts-kpi.gold {
  border-left-color: var(--gold);
}

.contacts-kpi.pink {
  border-left-color: var(--pink);
}

.contacts-kpi span {
  display: block;
  color: var(--muted);
  font-size: 10.5px;
  font-weight: 900;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

.contacts-kpi strong {
  display: block;
  margin: 7px 0 2px;
  color: var(--text);
  font-size: 25px;
  font-weight: 900;
  line-height: 1;
}

.contacts-kpi small {
  color: var(--muted);
  font-size: 12px;
}

.contacts-toolbar {
  align-items: stretch;
}

.contacts-view-switch {
  overflow-x: auto;
}

.contacts-tab {
  display: none;
}

.contacts-tab.active {
  display: block;
}

.contacts-overview-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.18fr) minmax(320px, 0.82fr);
  gap: 14px;
}

.contacts-card {
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--panel);
}

.contacts-card-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 18px;
}

.contacts-card-head h2 {
  margin: 0;
  font-size: 21px;
  font-weight: 850;
  line-height: 1.2;
}

.contacts-card-head span {
  color: var(--muted);
  font-size: 11.5px;
  font-weight: 800;
}

.contacts-group-list,
.contacts-overlap-preview,
.contacts-overlap-list,
.contacts-cleanup-timeline,
.contacts-sample-list {
  display: grid;
  gap: 8px;
}

.contacts-group-row,
.contacts-overlap-row,
.contacts-cleanup-row,
.contacts-sample-row {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px 12px;
  align-items: center;
  overflow: hidden;
  padding: 11px 12px;
  border: 1px solid #edf0eb;
  border-radius: 8px;
  background: #fbfbfa;
}

.contacts-group-row div,
.contacts-overlap-row div,
.contacts-cleanup-row div,
.contacts-sample-row {
  min-width: 0;
}

.contacts-group-row strong,
.contacts-overlap-row strong,
.contacts-cleanup-row strong,
.contacts-sample-row strong {
  display: block;
  overflow: hidden;
  font-size: 13px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.contacts-group-row span,
.contacts-overlap-row span,
.contacts-cleanup-row span,
.contacts-sample-row span,
.contacts-sample-row small {
  display: block;
  overflow: hidden;
  color: var(--muted);
  font-size: 11.5px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.contacts-group-row b,
.contacts-overlap-row b {
  color: var(--accent);
  font-size: 13px;
  font-weight: 900;
  white-space: nowrap;
}

.contacts-overlap-row small {
  grid-column: 2;
  color: var(--muted);
  font-size: 11px;
  text-align: right;
}

.contacts-group-row > i,
.contacts-cleanup-row > i,
.contacts-tag > i,
.contacts-pair-card > i {
  position: absolute;
  right: auto;
  bottom: 0;
  left: 0;
  display: block;
  max-width: 100%;
  height: 3px;
  border-radius: 0 4px 4px 0;
  background: var(--accent);
}

.contacts-cleanup-row {
  grid-template-columns: 68px minmax(0, 1fr);
}

.contacts-cleanup-row time {
  color: var(--accent);
  font-size: 12px;
  font-weight: 900;
  white-space: nowrap;
}

.contacts-sample-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
}

.contacts-challenge-hero {
  margin-bottom: 14px;
}

.contacts-challenge-total {
  display: flex;
  min-height: 154px;
  flex-direction: column;
  justify-content: space-between;
  padding: 18px;
  border: 1px solid var(--line);
  border-left: 4px solid var(--accent);
  border-radius: 8px;
  background: var(--panel);
}

.contacts-challenge-total span,
.contacts-challenge-kpis span {
  display: block;
  color: var(--muted);
  font-size: 10.5px;
  font-weight: 900;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

.contacts-challenge-total strong {
  display: block;
  margin-top: 8px;
  color: var(--accent);
  font-size: 36px;
  font-weight: 950;
  line-height: 1;
}

.contacts-challenge-total small {
  display: block;
  margin-top: 9px;
  color: var(--muted);
  font-size: 12px;
}

.contacts-challenge-evidence {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
}

.contacts-challenge-evidence b {
  display: inline-flex;
  min-height: 25px;
  align-items: center;
  padding: 0 9px;
  border-radius: 999px;
  background: var(--accent-soft);
  color: var(--accent);
  font-size: 11px;
  font-weight: 900;
}

.contacts-challenge-kpis {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.contacts-challenge-kpis-main {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.contacts-challenge-kpis article {
  padding: 14px 15px;
  border: 1px solid var(--line);
  border-left: 4px solid var(--accent);
  border-radius: 8px;
  background: var(--panel);
}

.contacts-challenge-kpis article.blue {
  border-left-color: var(--blue);
}

.contacts-challenge-kpis article.pink {
  border-left-color: var(--pink);
}

.contacts-challenge-kpis strong {
  display: block;
  margin: 7px 0 2px;
  color: var(--text);
  font-size: 22px;
  font-weight: 950;
  line-height: 1;
}

.contacts-challenge-kpis small {
  display: block;
  margin-bottom: 10px;
  color: var(--muted);
  font-size: 11.5px;
}

.contacts-challenge-list,
.contacts-challenge-side,
.contacts-legacy-grid,
.contacts-challenge-unified-list {
  display: grid;
  gap: 8px;
}

.contacts-challenge-section-title {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 2px 3px;
  border-top: 1px solid #eef0ec;
}

.contacts-challenge-section-title:first-child {
  padding-top: 0;
  border-top: 0;
}

.contacts-challenge-section-title strong {
  font-size: 12px;
  font-weight: 950;
  text-transform: uppercase;
}

.contacts-challenge-section-title span {
  color: var(--muted);
  font-size: 11px;
  font-weight: 900;
  white-space: nowrap;
}

.contacts-challenge-unified-row {
  position: relative;
  display: grid;
  grid-template-columns: minmax(250px, 1fr) repeat(3, minmax(94px, 0.34fr)) auto;
  gap: 10px;
  align-items: center;
  overflow: hidden;
  min-height: 58px;
  padding: 10px 12px;
  border: 1px solid #edf0eb;
  border-radius: 8px;
  background: #fbfbfa;
}

.contacts-challenge-unified-row > div:first-child {
  min-width: 0;
}

.contacts-challenge-unified-row strong,
.contacts-challenge-status {
  display: block;
  overflow: hidden;
  font-size: 13px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.contacts-challenge-unified-row span {
  display: block;
  overflow: hidden;
  color: var(--muted);
  font-size: 11.5px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.contacts-challenge-metric {
  padding: 7px 8px;
  border-radius: 7px;
  background: #fff;
  text-align: right;
}

.contacts-challenge-metric span {
  color: var(--muted);
  font-size: 9.5px;
  font-weight: 950;
  letter-spacing: 0.03em;
  text-transform: uppercase;
}

.contacts-challenge-metric strong {
  margin-top: 2px;
  font-size: 14px;
  font-weight: 950;
}

.contacts-challenge-unified-row > i {
  position: absolute;
  bottom: 0;
  left: 0;
  display: block;
  max-width: 100%;
  height: 3px;
  border-radius: 0 4px 4px 0;
  background: var(--accent);
}

.contacts-challenge-unified-row.is-unattributed .contacts-challenge-metric strong {
  color: var(--pink);
}

.contacts-challenge-status {
  display: inline-flex;
  min-height: 24px;
  align-items: center;
  justify-content: flex-start;
  padding: 0 9px;
  border-radius: 999px;
  background: var(--gold-soft);
  color: var(--gold);
  font-size: 11px;
  font-weight: 900;
}

.contacts-muted-cell {
  color: var(--muted);
  font-size: 12px;
  text-align: center;
}

.contacts-challenge-row {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(250px, 0.88fr) auto;
  gap: 12px;
  align-items: center;
  overflow: hidden;
  padding: 12px;
  border: 1px solid #edf0eb;
  border-radius: 8px;
  background: #fbfbfa;
}

.contacts-challenge-row strong,
.contacts-unattributed-row strong,
.contacts-legacy-card-row strong {
  display: block;
  overflow: hidden;
  font-size: 13px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.contacts-challenge-row span,
.contacts-challenge-row small,
.contacts-unattributed-row span,
.contacts-unattributed-row small,
.contacts-legacy-card-row span,
.contacts-legacy-card-row small {
  display: block;
  overflow: hidden;
  color: var(--muted);
  font-size: 11.5px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.contacts-challenge-row small {
  margin-top: 2px;
  color: var(--accent);
  font-weight: 800;
}

.contacts-challenge-row dl {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  margin: 0;
}

.contacts-csv-link {
  display: inline-flex;
  min-height: 28px;
  align-items: center;
  justify-content: center;
  padding: 0 10px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: #fff;
  color: var(--accent);
  font-size: 11.5px;
  font-weight: 900;
  text-decoration: none;
  white-space: nowrap;
}

.contacts-csv-link:hover {
  border-color: var(--accent);
}

.contacts-challenge-row dl div {
  padding: 8px;
  border-radius: 8px;
  background: #fff;
}

.contacts-challenge-row dt {
  color: var(--muted);
  font-size: 10px;
  font-weight: 900;
  text-transform: uppercase;
}

.contacts-challenge-row dd {
  margin: 3px 0 0;
  color: var(--text);
  font-size: 14px;
  font-weight: 950;
}

.contacts-challenge-row > i {
  position: absolute;
  bottom: 0;
  left: 0;
  display: block;
  max-width: 100%;
  height: 3px;
  border-radius: 0 4px 4px 0;
  background: var(--accent);
}

.contacts-unattributed-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  padding: 12px;
  border: 1px solid #edf0eb;
  border-radius: 8px;
  background: #fbfbfa;
}

.contacts-unattributed-row b {
  color: var(--pink);
  font-size: 15px;
  font-weight: 950;
  white-space: nowrap;
}

.contacts-challenge-legacy-card {
  margin-top: 14px;
}

.contacts-legacy-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.contacts-legacy-card-row {
  padding: 12px;
  border: 1px solid #edf0eb;
  border-radius: 8px;
  background: #fbfbfa;
}

.contacts-legacy-card-row b {
  display: inline-flex;
  min-height: 24px;
  align-items: center;
  margin: 8px 0 5px;
  padding: 0 9px;
  border-radius: 999px;
  background: var(--gold-soft);
  color: var(--gold);
  font-size: 11px;
  font-weight: 900;
}

.contacts-table-wrap {
  overflow-x: auto;
}

.contacts-table {
  width: 100%;
  min-width: 820px;
  border-collapse: collapse;
  font-size: 13px;
}

.contacts-table th {
  padding: 0 9px 9px;
  border-bottom: 1px solid var(--line);
  color: var(--muted);
  font-size: 10.5px;
  font-weight: 900;
  letter-spacing: 0.04em;
  text-align: right;
  text-transform: uppercase;
  white-space: nowrap;
}

.contacts-table th:first-child,
.contacts-table td:first-child {
  text-align: left;
}

.contacts-table td {
  padding: 10px 9px;
  border-bottom: 1px solid #eff1ed;
  font-variant-numeric: tabular-nums;
  text-align: right;
  white-space: nowrap;
}

.contacts-table tbody tr:hover {
  background: #fbfbfa;
}

.contacts-table td strong,
.contacts-table td small {
  display: block;
  max-width: 380px;
  overflow: hidden;
  text-overflow: ellipsis;
}

.contacts-table td small {
  margin-top: 2px;
  color: var(--muted);
  font-size: 11px;
}

.contacts-list-sections {
  display: grid;
  gap: 22px;
}

.contacts-list-columns {
  display: grid;
  grid-template-columns: minmax(280px, 1fr) 170px 110px 120px;
  gap: 12px;
  padding: 0 11px 2px;
  color: var(--muted);
  font-size: 10.5px;
  font-weight: 950;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.contacts-list-columns span:not(:first-child) {
  text-align: right;
}

.contacts-list-section {
  display: grid;
  gap: 10px;
}

.contacts-list-section-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  padding-bottom: 8px;
  border-bottom: 1px solid var(--line);
}

.contacts-list-section-head h3 {
  margin: 0;
  color: var(--text);
  font-size: 18px;
  font-weight: 850;
  line-height: 1.2;
}

.contacts-list-section-head span {
  color: var(--muted);
  font-size: 11.5px;
  font-weight: 850;
}

.contacts-list-rows {
  display: grid;
  gap: 6px;
}

.contacts-list-row {
  display: grid;
  grid-template-columns: minmax(280px, 1fr) 170px 110px 120px;
  gap: 12px;
  align-items: center;
  min-height: 48px;
  padding: 10px 11px;
  border: 1px solid #edf0eb;
  border-radius: 8px;
  background: #fbfbfa;
  font-variant-numeric: tabular-nums;
}

.contacts-list-row > div {
  min-width: 0;
}

.contacts-list-row strong {
  display: block;
  overflow: hidden;
  font-size: 14.5px;
  font-weight: 500;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.contacts-list-row > span {
  color: var(--text);
  font-size: 12.5px;
  text-align: right;
  white-space: nowrap;
}

.contacts-pill {
  display: inline-flex;
  align-items: center;
  min-height: 23px;
  padding: 0 9px;
  border-radius: 999px;
  background: var(--blue-soft);
  color: var(--blue);
  font-size: 11px;
  font-weight: 850;
}

.contacts-bar-cell {
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
}

.contacts-bar-cell i {
  display: inline-block;
  height: 7px;
  border-radius: 999px;
  background: var(--accent);
}

.contacts-health {
  display: inline-flex;
  align-items: center;
  gap: 7px;
}

.contacts-health i {
  display: inline-block;
  overflow: hidden;
  width: 42px;
  height: 6px;
  border-radius: 999px;
  background: #eceeea;
}

.contacts-health b {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: var(--accent);
}

.contacts-pair-card {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
  gap: 12px;
  align-items: center;
  overflow: hidden;
  padding: 12px;
  border: 1px solid #edf0eb;
  border-radius: 8px;
  background: #fbfbfa;
}

.contacts-pair-card strong,
.contacts-pair-card span {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.contacts-pair-card span {
  color: var(--muted);
  font-size: 11.5px;
}

.contacts-pair-card b {
  display: grid;
  min-width: 72px;
  height: 34px;
  place-items: center;
  border-radius: 999px;
  background: var(--accent-soft);
  color: var(--accent);
  font-size: 13px;
  font-weight: 900;
}

.contacts-tag-cloud {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 9px;
}

.contacts-tag {
  position: relative;
  overflow: hidden;
  padding: 11px 12px;
  border: 1px solid #edf0eb;
  border-radius: 8px;
  background: #fbfbfa;
}

.contacts-tag span,
.contacts-tag strong {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.contacts-tag span {
  color: var(--blue);
  font-size: 12px;
  font-weight: 850;
}

.contacts-tag strong {
  margin-top: 3px;
  font-size: 14px;
}

@media (max-width: 900px) {
  .contacts-kpis,
  .contacts-overview-grid,
  .contacts-tag-cloud,
  .contacts-challenge-hero,
  .contacts-challenge-kpis-main,
  .contacts-legacy-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 640px) {
  .contacts-kpis,
  .contacts-overview-grid,
  .contacts-tag-cloud,
  .contacts-pair-card,
  .contacts-challenge-hero,
  .contacts-challenge-kpis,
  .contacts-challenge-kpis-main,
  .contacts-challenge-row,
  .contacts-challenge-unified-row,
  .contacts-challenge-row dl,
  .contacts-legacy-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .contacts-challenge-metric {
    text-align: left;
  }

  .contacts-challenge-unified-row .contacts-csv-link {
    width: 100%;
  }

  .contacts-head {
    align-items: flex-start;
    flex-direction: column;
  }

  .contacts-sync-badge,
  .contacts-head .header-actions {
    width: 100%;
  }

  .contacts-head .header-actions .button {
    flex: 1;
  }

  .contacts-list-row {
    grid-template-columns: minmax(0, 1fr);
  }

  .contacts-list-columns {
    display: none;
  }

  .contacts-list-row > span,
  .contacts-list-row .contacts-bar-cell,
  .contacts-list-row .contacts-health {
    justify-content: flex-start;
    text-align: left;
  }
}

.email-sequence-row .email-sequence-sub {
  overflow: hidden;
  margin-top: 2px;
  font-size: 11.5px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.email-sequence-row .email-sequence-sub strong {
  color: var(--text);
  font-weight: 900;
}

.email-sequence-row .email-sequence-meta {
  justify-content: flex-end;
  margin: 0;
}

.email-sequence-row .email-sequence-meta > span {
  color: var(--muted);
  font-size: 11.5px;
  font-weight: 900;
  white-space: nowrap;
}

.email-subgroup {
  display: grid;
  gap: 0;
  padding: 7px 0 3px;
  border-top: 1px solid #f0f1ee;
}

.email-subgroup:first-child {
  border-top: 0;
}

.email-subgroup h3 {
  padding: 7px 18px 5px;
  color: var(--text);
  font-size: 14px;
  font-weight: 900;
}

.pages-product-group {
  padding-top: 0;
  border-top: 0;
}

.pages-product-group .pages-card-grid {
  padding: 6px 0 10px;
  border-top: 1px solid #eef0ec;
  column-width: 360px;
  column-gap: 0;
  display: block;
}

.pages-product-group .page-directory-card {
  display: block;
  break-inside: avoid;
  padding: 8px 16px 8px 20px;
  border: 0;
  border-left: 4px solid transparent;
  border-radius: 0;
}

.pages-product-group .page-directory-card:hover {
  border-left-color: var(--group-color, var(--accent));
  background: var(--accent-soft);
}

.pages-product-group .page-directory-card span {
  display: block;
  color: var(--text);
  font-size: 13px;
  font-weight: 900;
  line-height: 1.3;
}

.pages-product-group .page-directory-card a {
  display: block;
  overflow: hidden;
  margin-top: 2px;
  color: var(--muted);
  font-size: 12px;
  text-decoration: none;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.pages-product-group .page-directory-card a:hover {
  color: var(--accent);
  text-decoration: underline;
}

.pages-product-group .page-directory-card small {
  display: block;
  overflow: hidden;
  margin-top: 2px;
  color: var(--muted);
  font-size: 10.5px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.pages-product-group .page-directory-card b {
  display: none;
}

.page-card-meta {
  display: flex;
  gap: 5px;
  margin-top: 6px;
  flex-wrap: wrap;
}

.pages-product-group .page-directory-card .page-card-meta b {
  display: inline-flex;
  padding: 2px 7px;
  border-radius: 999px;
  background: #f0eeea;
  color: var(--muted);
  font-size: 10px;
  font-weight: 900;
  line-height: 1.2;
}

.pages-filters {
  grid-template-columns: minmax(0, 1fr) auto;
  margin-bottom: 18px;
}

.pages-simple-list {
  display: grid;
  gap: 0;
  padding: 8px 0 10px;
  border-top: 1px solid #eef0ec;
}

.page-subgroup {
  display: grid;
  gap: 0;
  padding: 7px 0 3px;
  border-top: 1px solid #f0f1ee;
}

.page-subgroup:first-child {
  border-top: 0;
}

.page-subgroup h3 {
  padding: 7px 18px 5px;
  color: var(--text);
  font-size: 14px;
  font-weight: 900;
}

.page-link-list {
  display: grid;
  gap: 0;
  margin: 0;
  padding: 0;
  list-style: none;
}

.page-link-row {
  display: grid;
  grid-template-columns: max-content minmax(0, 1fr);
  gap: 10px;
  align-items: baseline;
  padding: 6px 18px;
  border-left: 4px solid transparent;
  line-height: 1.35;
}

.page-link-row.reorderable {
  grid-template-columns: 52px max-content minmax(0, 1fr);
  align-items: center;
}

.page-link-row:hover {
  border-left-color: var(--group-color, var(--accent));
  background: var(--accent-soft);
}

.page-order-controls {
  display: inline-flex;
  gap: 4px;
}

.page-order-controls button {
  display: inline-grid;
  width: 22px;
  height: 22px;
  place-items: center;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #fff;
  color: var(--muted);
  cursor: pointer;
  font: 900 12px/1 Inter, ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
}

.page-order-controls button:hover:not(:disabled) {
  border-color: var(--group-color, var(--accent));
  color: var(--text);
}

.page-order-controls button:disabled {
  opacity: 0.35;
  cursor: default;
}

.page-link-row strong {
  min-width: 0;
  color: var(--muted);
  font-size: 12.5px;
  font-weight: 600;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.page-link-row a {
  min-width: 0;
  overflow: hidden;
  color: var(--muted);
  font-size: 12.5px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.page-link-row small {
  display: block;
  margin-top: 2px;
  color: var(--muted);
  font-size: 11px;
}

.page-type-redirect .library-group-head,
.page-type-redirect .pages-simple-list {
  background: #f8f8f6;
}

.page-type-redirect .page-link-row {
  opacity: 0.82;
}

.page-link-row a:hover {
  color: var(--accent);
}

.archive-directory .pages-simple-list {
  padding: 0;
}

.archive-page-row {
  border-top: 1px solid #eef0ec;
}

.archive-page-row:first-child {
  border-top: 0;
}

.archive-page-row summary {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 14px;
  padding: 10px 18px;
  border-left: 4px solid transparent;
  cursor: pointer;
  list-style: none;
}

.archive-page-row summary::-webkit-details-marker {
  display: none;
}

.archive-page-row summary:hover {
  border-left-color: var(--group-color, var(--accent));
  background: var(--accent-soft);
}

.archive-page-row summary span {
  display: grid;
  min-width: 0;
  gap: 2px;
}

.archive-page-row summary strong {
  overflow: hidden;
  color: var(--text);
  font-size: 13px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.archive-page-row summary small,
.archive-page-row summary em {
  color: var(--muted);
  font-size: 11.5px;
  font-style: normal;
  font-weight: 800;
}

.archive-page-detail {
  display: grid;
  gap: 10px;
  padding: 2px 18px 14px 22px;
  background: #fbfbf9;
}

.archive-page-detail p {
  margin: 0;
  color: var(--muted);
  font-size: 12.5px;
  line-height: 1.45;
}

.archive-page-detail > small {
  color: var(--muted);
  font-size: 11px;
}

.archive-url-list {
  display: grid;
  gap: 4px;
}

.archive-url-list a {
  overflow: hidden;
  color: var(--muted);
  font-size: 12px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.archive-page-detail pre {
  max-height: 420px;
  overflow: auto;
  margin: 0;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #ffffff;
  color: var(--text);
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 11.5px;
  line-height: 1.45;
  white-space: pre-wrap;
}

.page-form-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.ai-btn {
  display: inline-flex;
  min-height: 30px;
  align-items: center;
  padding: 0 11px;
  border: 1px solid var(--blue);
  border-radius: 999px;
  background: #fff;
  color: var(--blue);
  font: inherit;
  font-size: 12px;
  font-weight: 800;
  cursor: pointer;
}

.ai-btn:hover {
  background: var(--blue-soft);
}

/* Docs module */
.docs-module {
  max-width: var(--workshop-max-width);
}

.docs-head {
  align-items: end;
}

.docs-toolbar {
  display: grid;
  grid-template-columns: minmax(260px, 1fr) auto;
  gap: 10px 12px;
  margin-bottom: 22px;
  align-items: start;
}

.docs-toolbar input,
.docs-toolbar select {
  min-height: 38px;
  padding: 8px 11px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  color: var(--text);
  font: inherit;
}

.docs-toolbar input {
  flex: 1;
  min-width: 260px;
}

.docs-toolbar select {
  display: none;
}

.doc-type-pills {
  display: flex;
  grid-column: 1 / -1;
  flex-wrap: wrap;
  gap: 7px;
}

.doc-type-pill {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  min-height: 32px;
  padding: 6px 10px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: #fff;
  color: var(--muted);
  cursor: pointer;
  font: inherit;
  font-size: 12px;
  font-weight: 800;
}

.doc-type-pill strong {
  min-width: 20px;
  padding: 1px 6px;
  border-radius: 999px;
  background: var(--bg);
  color: var(--muted);
  font-size: 11px;
  text-align: center;
}

.doc-type-pill:hover,
.doc-type-pill.active {
  border-color: var(--accent);
  background: var(--accent-soft);
  color: var(--accent);
}

.doc-type-pill.active strong {
  background: #fff;
  color: var(--accent);
}

.docs-section {
  margin-bottom: 28px;
}

.doc-role-section.is-featured {
  margin-bottom: 22px;
}

.featured-doc-grid {
  display: grid;
}

.featured-doc-card {
  display: grid;
  width: 100%;
  border: 1px solid color-mix(in srgb, var(--accent) 32%, var(--line));
  border-radius: 8px;
  background: color-mix(in srgb, var(--accent-soft) 72%, #fff);
}

.featured-doc-main {
  display: grid;
  gap: 6px;
  width: 100%;
  padding: 16px 18px;
  border: 0;
  background: transparent;
  color: inherit;
  text-align: left;
  font: inherit;
  cursor: pointer;
}

.featured-doc-label {
  display: block;
  color: var(--accent);
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
}

.featured-doc-main strong {
  display: block;
  font-size: 19px;
  line-height: 1.2;
}

.featured-doc-main p {
  max-width: 860px;
  margin: 0;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.45;
}

.featured-doc-main small {
  width: fit-content;
  padding: 4px 8px;
  border-radius: 999px;
  background: #fff;
  color: var(--accent);
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
}

.doc-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(245px, 1fr));
  gap: 12px;
}

.doc-section-stack {
  grid-template-columns: 1fr;
}

.doc-role-section {
  display: grid;
  gap: 10px;
  margin-bottom: 18px;
  min-width: 0;
}

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

.home-section-label.compact {
  margin-bottom: 0;
}

.doc-role-section .home-section-label.compact {
  gap: 14px;
  margin-bottom: 2px;
}

.doc-role-section .home-section-label.compact span {
  color: var(--text);
  font-size: 18px;
  line-height: 1.2;
  letter-spacing: 0;
  text-transform: none;
}

.doc-role-section .home-section-label.compact strong {
  display: inline-flex;
  min-width: 26px;
  min-height: 24px;
  align-items: center;
  justify-content: center;
  padding: 2px 8px;
  border-radius: 999px;
  background: var(--bg);
  color: var(--muted);
  font-size: 12px;
  font-weight: 850;
}

.doc-role-grid {
  width: 100%;
  grid-template-columns: repeat(auto-fill, minmax(245px, 1fr));
}

.dated-doc-grid {
  grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
}

.archive-section {
  padding-top: 6px;
}

.doc-archive-details {
  border-top: 1px solid var(--line);
  padding-top: 10px;
}

.doc-archive-details summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  min-height: 42px;
  padding: 10px 0;
  color: var(--muted);
  cursor: pointer;
  font-size: 13px;
  font-weight: 850;
}

.doc-archive-details summary strong {
  color: var(--muted);
  font-size: 12px;
}

.archive-doc-grid {
  padding-top: 10px;
}

.doc-nav-actions {
  display: inline-flex;
  gap: 6px;
  align-items: center;
}

.doc-nav-button {
  width: 34px;
  min-width: 34px;
  padding: 0;
  font-size: 17px;
  line-height: 1;
}

.doc-nav-button:disabled {
  opacity: 0.38;
  cursor: not-allowed;
}

.doc-card {
  position: relative;
  display: flex;
  min-height: 150px;
  flex-direction: column;
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel);
  color: inherit;
  text-align: left;
  font: inherit;
  cursor: pointer;
}

.doc-card:hover {
  border-color: var(--accent);
}

.doc-card[draggable="true"] {
  cursor: grab;
}

.doc-card.is-dragging {
  opacity: 0.58;
  cursor: grabbing;
}

.doc-card.is-drop-target {
  border-color: var(--accent);
  box-shadow: inset 0 0 0 2px color-mix(in srgb, var(--accent) 28%, transparent);
}

.doc-card.is-archived {
  border-color: color-mix(in srgb, #dc2626 22%, var(--line));
  background: color-mix(in srgb, #dc2626 5%, var(--panel));
}

.doc-card-number {
  position: absolute;
  top: 12px;
  right: 12px;
  display: inline-flex;
  min-width: 34px;
  height: 24px;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: #fff;
  color: var(--muted);
  font-size: 11px;
  font-weight: 850;
  line-height: 1;
  pointer-events: none;
}

.doc-card-main {
  display: grid;
  gap: 9px;
  flex: 1;
  align-content: start;
  width: 100%;
  min-width: 0;
  padding: 0;
  border: 0;
  background: transparent;
  color: inherit;
  text-align: left;
  cursor: pointer;
  font: inherit;
}

.doc-card-main .doc-status-pill {
  max-width: calc(100% - 44px);
}

.doc-card-main .doc-kind {
  justify-self: start;
  margin: 0;
}

.doc-status-pill {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  justify-self: start;
  min-height: 24px;
  padding: 3px 8px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 850;
  white-space: nowrap;
}

.doc-status-pill span {
  display: inline-flex;
  width: 14px;
  height: 14px;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  background: #fff;
  font-size: 10px;
  line-height: 1;
}

.doc-status-pill.in-progress,
.doc-status-pill.archived {
  background: color-mix(in srgb, #dc2626 14%, #fff);
  color: #9f1d1d;
}

.doc-status-pill.review {
  background: color-mix(in srgb, #d97706 16%, #fff);
  color: #9a4f00;
}

.doc-status-pill.done,
.doc-status-pill.active {
  background: color-mix(in srgb, #22a06b 15%, #fff);
  color: #16724d;
}

.doc-card-actions {
  display: flex;
  justify-content: flex-start;
  margin-top: 14px;
}

.doc-card-action {
  min-height: 30px;
  padding: 0 10px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: #fff;
  color: var(--muted);
  cursor: pointer;
  font: inherit;
  font-size: 12px;
  font-weight: 750;
}

.doc-card-action:hover {
  border-color: var(--accent);
  color: var(--accent);
}

.doc-kind {
  width: fit-content;
  margin-bottom: 12px;
  padding: 4px 9px;
  border-radius: 999px;
  background: var(--accent-soft);
  color: var(--accent);
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
}

.doc-kind.procedure {
  background: var(--blue-soft);
  color: var(--blue);
}

.doc-card strong {
  font-size: 18px;
  line-height: 1.2;
}

.doc-card p {
  margin: 8px 0 0;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.45;
  display: -webkit-box;
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  line-clamp: 3;
}

.doc-card-size {
  display: block;
  justify-self: start;
  margin-top: 3px;
  color: color-mix(in srgb, var(--muted) 82%, transparent);
  font-size: 10px;
  font-weight: 650;
  letter-spacing: 0.025em;
  line-height: 1.35;
}

.doc-linked-action-field {
  display: grid;
  gap: 2px;
  min-height: 38px;
  padding: 8px 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
}

.doc-linked-action-field strong,
.doc-linked-action-field small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.doc-linked-action-field strong {
  color: var(--text);
  font-size: 13px;
  line-height: 1.2;
}

.doc-linked-action-field small {
  color: var(--muted);
  font-size: 11px;
}

.doc-detail-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 18px;
  margin-bottom: 14px;
  padding-bottom: 16px;
  border-bottom: 1px solid var(--line);
}

.doc-detail-head p {
  margin: 0 0 6px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.doc-detail-head h1 {
  font-size: 32px;
  line-height: 1.12;
}

.doc-detail-meta {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin: 0 0 12px;
}

.doc-secondary-meta {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.doc-detail-meta article {
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
}

.doc-detail-meta span,
.doc-detail-meta strong {
  display: block;
}

.doc-detail-meta span {
  margin-bottom: 4px;
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.doc-detail-meta strong {
  overflow-wrap: anywhere;
  font-size: 13px;
}

.doc-detail-meta select {
  width: 100%;
  min-height: 38px;
  padding: 8px 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  color: var(--text);
  font: inherit;
  font-size: 13px;
}

.doc-workbench-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(var(--workshop-rail-min), var(--workshop-rail-max));
  gap: var(--workshop-gap);
  align-items: start;
}

.doc-workshop-head > div:first-child {
  flex: 1 1 auto;
  min-width: 0;
}

.doc-workshop-main {
  display: grid;
  gap: 0;
}

/*
 * 2026-08-14 — variante de titre supprimee (decision Paul : 32px partout).
 *
 * Ce bloc habillait le champ titre de la base de connaissances differemment
 * des deux autres zones atelier : 20px au lieu de 32px, plus un encadre.
 * Resultat : le meme composant partage n'avait pas la meme apparence selon
 * la page, alors que la structure HTML etait identique.
 *
 * Le champ titre appartient au noyau partage (`workshopMetaGridHtml`).
 * Sa taille, sa graisse et son encadre sont definis une seule fois, dans
 * `.standard-workshop-title-input` (voir plus haut dans ce fichier).
 * Aucune page ne doit les redefinir : c'est verifie par
 * `scripts/audit-workshop-css.mjs`.
 *
 * `.standard-workshop-role-input` reste habille ici : ce champ est propre a
 * la base de connaissances, il n'appartient pas au noyau partage.
 */
.doc-workshop-main .standard-workshop-role-input {
  min-height: 38px;
  padding: 8px 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
}

.doc-workshop-main .standard-workshop-role-input {
  margin-top: 0;
  min-height: 74px;
  color: var(--text);
  resize: vertical;
}

.doc-body-field {
  margin-bottom: 0;
}

.doc-agent-work-status {
  margin: 0 0 8px;
  padding: 9px 10px;
  border: 1px solid color-mix(in srgb, var(--accent) 26%, var(--line));
  border-radius: 8px;
  background: var(--accent-soft);
  color: var(--accent);
  font-size: 12px;
  font-weight: 800;
}

.doc-read.is-agent-updating {
  opacity: 0.58;
  pointer-events: none;
  position: relative;
}

.standard-rich-editor-shell {
  display: grid;
  min-width: 0;
}

.standard-workbench-toolbar {
  border: 1px solid var(--line);
  border-bottom: 0;
  border-radius: 10px 10px 0 0;
  background: #fbfbf8;
}

/* Ne doit PAS s'appliquer au corps du rail agent standardise.
   .agentic-v2-rail-body est en flex-column avec flex:1 pour que le fil de
   discussion se dilate et que le composer reste colle en bas. Ce selecteur a
   2 classes (0,2,0) battait la regle standardisee (0,1,0) et forcait un
   display:grid : les enfants du rail devenaient des grid items dimensionnes
   au contenu, le fil ne se dilatait plus. Cassait docs ET atelier-agentique. */
.workbench-agent-panel .jb-section-body:not(.agentic-v2-rail-body) {
  display: grid;
  gap: 12px;
}

.workbench-segment {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  width: 100%;
  margin-bottom: 0;
}

.workbench-segment button {
  cursor: pointer;
  font: inherit;
  font-size: 12.5px;
  font-weight: 750;
}

.workbench-selection-preview {
  padding: 8px 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--bg);
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
}

.workbench-selection-preview.hidden {
  display: none;
}

.workbench-input-card {
  display: grid;
  gap: 8px;
}

.workbench-input-card textarea,
.workbench-context-picker input {
  width: 100%;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  color: var(--text);
  font: inherit;
}

.workbench-input-card textarea {
  min-height: 112px;
  padding: 10px 11px;
  resize: vertical;
}

.workbench-context-picker {
  display: grid;
  gap: 8px;
  position: relative;
}

.workbench-context-picker label {
  display: grid;
  gap: 6px;
}

.workbench-context-picker label span,
.agent-scope.ai-model-picker > span {
  color: var(--muted);
  font-size: 11px;
  font-weight: 850;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.workbench-context-picker input {
  min-height: 36px;
  padding: 8px 10px;
}

.dashboard-context-locked {
  display: grid;
  gap: 7px;
  padding: 9px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface-soft);
}

.dashboard-context-locked-label {
  color: var(--muted);
  font-size: 11px;
  font-weight: 850;
  letter-spacing: 0.04em;
  line-height: 1.2;
  text-transform: uppercase;
}

.dashboard-context-locked article {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.dashboard-context-locked strong,
.dashboard-context-locked span {
  min-width: 0;
  overflow: hidden;
  line-height: 1.25;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.dashboard-context-locked strong {
  color: var(--text);
  font-size: 12.5px;
  font-weight: 800;
}

.dashboard-context-locked span {
  color: var(--muted);
  font-size: 11.5px;
}

.workbench-context-results,
.workbench-context-selected {
  display: grid;
  gap: 7px;
}

.workbench-agent-panel .workbench-context-results {
  display: none;
  position: absolute;
  top: 62px;
  right: 0;
  left: 0;
  z-index: 30;
  max-height: 214px;
  overflow: auto;
  padding: 6px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 14px 32px rgba(44, 40, 32, 0.14);
}

.workbench-agent-panel .workbench-context-results.open {
  display: grid;
}

.workbench-context-option,
.workbench-context-chip,
.workbench-voice-link {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  min-height: 32px;
  padding: 7px 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  color: var(--text);
  cursor: pointer;
  font: inherit;
  font-size: 12.5px;
  text-align: left;
}

.workbench-voice-link::before {
  content: "";
  width: 14px;
  height: 14px;
  flex: 0 0 14px;
  background: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Crect x='9' y='4' width='6' height='10' rx='3' fill='black'/%3E%3Cpath d='M6 11a6 6 0 0 0 12 0M12 17v3M9 20h6' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Crect x='9' y='4' width='6' height='10' rx='3' fill='black'/%3E%3Cpath d='M6 11a6 6 0 0 0 12 0M12 17v3M9 20h6' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
}

.workbench-context-option {
  display: block;
  min-height: 28px;
  padding: 5px 8px;
}

.workbench-context-group-label {
  position: sticky;
  top: -6px;
  z-index: 1;
  margin: 2px 0 3px;
  padding: 5px 6px 4px;
  background: #fff;
  color: var(--accent);
  font-size: 10.5px;
  font-weight: 900;
  letter-spacing: 0.04em;
  line-height: 1.2;
  text-transform: uppercase;
}

.dashboard-context-origin {
  display: inline-flex;
  width: fit-content;
  max-width: 100%;
  margin: 0 0 3px;
  padding: 2px 6px;
  border-radius: 999px;
  background: #eef4f1;
  color: #426458;
  font-size: 10px;
  font-style: normal;
  font-weight: 850;
  line-height: 1.1;
  text-transform: uppercase;
}

.dashboard-context-card-main {
  display: grid;
  min-width: 0;
  gap: 3px;
}

.dashboard-context-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  align-items: center;
  gap: 8px;
  width: 100%;
  min-width: 0;
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #faf8f2;
  color: var(--text);
  text-align: left;
}

.dashboard-context-card-head {
  display: flex;
  min-width: 0;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
}

.dashboard-context-card-head .dashboard-context-origin {
  margin: 0;
}

.dashboard-context-token-estimate {
  flex: 0 0 auto;
  color: var(--muted);
  font-size: 10px;
  font-weight: 800;
  line-height: 1.2;
  white-space: nowrap;
}

.dashboard-context-card-main > strong {
  min-width: 0;
  overflow: hidden;
  color: var(--text);
  font-size: 12px;
  line-height: 1.25;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.dashboard-context-card-pack {
  min-width: 0;
  overflow: hidden;
  color: var(--muted);
  font-size: 10.5px;
  line-height: 1.25;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.dashboard-context-kind-filters {
  position: sticky;
  top: 0;
  z-index: 2;
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  padding: 8px;
  border-bottom: 1px solid var(--line);
  background: #fff;
}

.dashboard-context-kind-filter {
  padding: 5px 9px;
  border: 1px solid #d8ded9;
  border-radius: 999px;
  background: #f7f8f6;
  color: #5c655f;
  font: inherit;
  font-size: 11px;
  font-weight: 750;
  cursor: pointer;
}

.dashboard-context-kind-filter:hover,
.dashboard-context-kind-filter.active {
  border-color: #8ebcb4;
  background: #eaf5f2;
  color: var(--accent);
}

.dashboard-context-origin[data-dashboard-context-kind="product"] {
  background: #f0f3ff;
  color: #3f5196;
}

.dashboard-context-origin[data-dashboard-context-kind="contextDoc"] {
  background: #eef4f1;
  color: #426458;
}

.dashboard-context-origin[data-dashboard-context-kind="productContextDoc"] {
  background: #fff0f5;
  color: #91405f;
}

/* Un pack de contexte partage la couleur de son objet source : un pack de
   lancement EST un lancement, il n'a pas de badge distinct. */
.dashboard-context-origin[data-dashboard-context-kind="launch"],
.dashboard-context-origin[data-dashboard-context-kind="launchContextPack"] {
  background: #fff1e2;
  color: #86551d;
}

.dashboard-context-origin[data-dashboard-context-kind="emailSequence"],
.dashboard-context-origin[data-dashboard-context-kind="sequenceContextPack"] {
  background: #f3edff;
  color: #65419a;
}

.dashboard-context-origin[data-dashboard-context-kind="page"] {
  background: #edf7fb;
  color: #32677a;
}

.dashboard-context-origin[data-dashboard-context-kind="content"] {
  background: #fff7df;
  color: #7d6118;
}

.dashboard-context-origin[data-dashboard-context-kind="financeLaunch"] {
  background: #eff8ea;
  color: #49702d;
}

.workbench-context-chip .dashboard-context-origin {
  margin: 0;
  background: rgba(255, 255, 255, 0.64);
}

.workbench-context-option strong {
  display: block;
  min-width: 0;
  overflow: hidden;
  line-height: 1.25;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.workbench-context-option small {
  display: block;
  margin-top: 3px;
  overflow: hidden;
  color: var(--muted);
  font-size: 11.5px;
  line-height: 1.25;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.workbench-context-option:hover,
.workbench-context-chip:hover,
.workbench-voice-link:hover {
  border-color: var(--accent);
  color: var(--accent);
}

.workbench-voice-link.recording {
  border-color: #a44135;
  background: #fff3f1;
  color: #843226;
}

.workbench-context-chip {
  background: #faf8f2;
  color: var(--accent);
  font-weight: 750;
}

.workbench-context-chip:not(:disabled)::after {
  content: "×";
  display: inline-grid;
  width: 14px;
  height: 14px;
  margin-left: 2px;
  place-items: center;
  border-radius: 50%;
  color: currentColor;
  font-size: 14px;
  font-weight: 900;
  line-height: 1;
}

.workbench-context-chip:disabled {
  cursor: default;
  opacity: 0.75;
}

.workbench-context-chip.is-locked,
.dashboard-context-chip.is-locked {
  border-color: color-mix(in srgb, var(--accent) 36%, var(--line));
  background: #faf8f2;
  color: var(--accent);
  opacity: 1;
}

.workbench-context-chip.is-locked::after,
.dashboard-context-chip.is-locked::after {
  content: "verrouillé";
  width: auto;
  height: auto;
  margin-left: 4px;
  color: var(--muted);
  font-size: 10px;
  font-weight: 800;
}

.dashboard-product-context-chip {
  position: relative;
  display: inline-grid;
  grid-template-columns: minmax(0, auto) auto auto;
  gap: 5px;
  align-items: center;
  max-width: 100%;
  padding: 5px 6px 5px 9px;
}

.dashboard-context-chip {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  width: 100%;
  max-width: 100%;
}

.dashboard-product-context-chip {
  grid-template-columns: minmax(0, 1fr) auto auto;
}

.dashboard-context-chip::after,
.dashboard-product-context-chip::after {
  content: none !important;
  display: none !important;
}

article.workbench-context-chip::after,
.workbench-context-chip.is-inactive::after {
  content: none;
}

.dashboard-context-chip.is-inactive,
.agent-context-chip.is-inactive {
  border-color: var(--line);
  background: #faf8f2;
  color: var(--muted);
}

.dashboard-context-active-toggle {
  min-height: 20px;
  padding: 0 7px;
  border: 1px solid color-mix(in srgb, currentColor 24%, transparent);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.72);
  color: currentColor;
  cursor: pointer;
  font: inherit;
  font-size: 10px;
  font-weight: 850;
  line-height: 1;
}

.dashboard-product-context-label {
  display: grid;
  min-width: 0;
  gap: 3px;
}

.dashboard-context-chip:not(.dashboard-product-context-chip) > span {
  display: grid;
  min-width: 0;
  gap: 3px;
}

.dashboard-context-option.dashboard-context-card {
  grid-template-columns: minmax(0, 1fr);
  width: 100%;
  text-align: left;
}

.initial-request-source.dashboard-context-card {
  grid-template-columns: minmax(0, 1fr) auto;
}

.dashboard-product-context-label strong {
  min-width: 0;
  overflow: hidden;
  color: inherit;
  font-size: 11.5px;
  font-weight: 800;
  line-height: 1.2;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.dashboard-product-context-label small {
  flex: 0 0 auto;
  color: inherit;
  font-size: 10.5px;
  font-weight: 850;
  opacity: 0.72;
}

.dashboard-product-context-toggle-button,
.dashboard-product-context-remove {
  display: inline-grid;
  width: 20px;
  height: 20px;
  place-items: center;
  border: 0;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.62);
  color: currentColor;
  cursor: pointer;
  font: inherit;
  font-size: 13px;
  font-weight: 900;
  line-height: 1;
}

.dashboard-product-context-toggle-button[aria-expanded="true"] {
  transform: rotate(180deg);
}

.dashboard-product-context-remove:disabled {
  cursor: default;
  opacity: 0.45;
}

.dashboard-product-context-menu {
  display: none;
  grid-column: 1 / -1;
  min-width: min(245px, 88vw);
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 4px;
  margin-top: 2px;
  padding: 6px;
  border: 1px solid color-mix(in srgb, var(--accent) 22%, var(--line));
  border-radius: 8px;
  background: #fff;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.55);
}

.dashboard-product-context-menu.open {
  display: grid;
}

.dashboard-product-context-menu button {
  min-width: 0;
  min-height: 30px;
  padding: 5px 7px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: #fff;
  color: var(--muted);
  cursor: pointer;
  font: inherit;
  font-size: 11px;
  font-weight: 800;
  line-height: 1.15;
}

.dashboard-product-context-menu button.active {
  border-color: var(--accent);
  background: var(--accent-soft);
  color: var(--accent);
}

.dashboard-product-context-docs {
  display: grid;
  grid-column: 1 / -1;
  max-height: 190px;
  overflow: auto;
  gap: 4px;
  padding-top: 4px;
  border-top: 1px solid var(--line);
}

.dashboard-product-context-docs > span {
  color: var(--muted);
  font-size: 10.5px;
  font-weight: 800;
}

.dashboard-product-context-docs label {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 2px 6px;
  align-items: center;
  padding: 5px 6px;
  border: 1px solid transparent;
  border-radius: 7px;
  color: var(--text);
  font-size: 11px;
  line-height: 1.2;
}

.dashboard-product-context-docs label:hover {
  border-color: var(--line);
  background: #fafbf9;
}

.dashboard-product-context-docs input {
  grid-row: 1 / span 2;
}

.dashboard-product-context-docs strong,
.dashboard-product-context-docs small {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.dashboard-product-context-docs small {
  color: var(--muted);
  font-size: 10px;
}

.work-modal-context-picker .workbench-context-selected,
.work-modal-context-picker .workbench-context-results {
  overflow: auto;
  padding-right: 2px;
}

.work-modal-context-picker .workbench-context-selected {
  max-height: 156px;
}

.work-modal-context-picker .workbench-context-results {
  display: none;
  position: absolute;
  top: 62px;
  right: 0;
  left: 0;
  z-index: 35;
  padding: 6px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 14px 32px rgba(44, 40, 32, 0.14);
  max-height: min(320px, 42vh);
}

.work-modal-context-picker .workbench-context-results.open {
  display: grid;
}

.work-context-doc-option {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 9px;
  align-items: start;
  min-height: 42px;
  padding: 8px 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  cursor: pointer;
}

.work-context-doc-option input {
  margin-top: 3px;
}

.work-context-doc-option span {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.work-context-doc-option strong {
  color: var(--text);
  font-size: 12.5px;
  line-height: 1.25;
}

.work-context-doc-option small {
  color: var(--muted);
  font-size: 11.5px;
  line-height: 1.3;
}

.workbench-context-selected > span,
.workbench-voice-status {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
}

.agent-scope.ai-model-picker {
  display: grid;
  gap: 6px;
}

.agent-scope.ai-model-picker small {
  color: var(--muted);
  font-size: 11.5px;
}

.workbench-history {
  display: grid;
  gap: 8px;
  padding-top: 2px;
}

.doc-workbench-history {
  padding-top: 0;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel);
}

.workbench-history .jb-section-header {
  padding: 0;
  border: 0;
}

.workbench-history .jb-section-body {
  padding: 0;
}

.doc-workbench-history .jb-section-header {
  padding: 13px 14px;
  border-bottom: 1px solid var(--line);
}

.doc-workbench-history .jb-section-body {
  display: grid;
  gap: 8px;
  padding: 14px;
}

.workbench-history-entry {
  padding: 9px 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
}

.workbench-history-entry summary {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 4px 8px;
  align-items: baseline;
  cursor: pointer;
  list-style: none;
}

.workbench-history-entry summary span:last-child {
  grid-column: 1 / -1;
}

.workbench-history-entry summary::-webkit-details-marker {
  display: none;
}

.workbench-history-entry summary span,
.workbench-history-entry p {
  color: var(--muted);
  font-size: 12px;
}

.doc-read {
  padding: 22px;
  border: 1px solid var(--line);
  border-radius: 0 0 10px 10px;
  background: var(--panel);
  min-height: 68vh;
  outline: none;
  /* T1 : taille du corps alignee sur Statut/Historique. Geometrie inchangee. */
  font-size: var(--workshop-editor-font-size);
  line-height: var(--workshop-editor-line-height);
}

.doc-read:focus {
  border-color: #b8c8bd;
  box-shadow: 0 0 0 3px rgba(39, 111, 104, 0.08);
}

.doc-read h2,
.doc-read h3 {
  margin: 22px 0 8px;
}

.doc-read h2:first-child,
.doc-read h3:first-child {
  margin-top: 0;
}

.doc-read p,
.doc-read li {
  color: var(--text);
  /* T1 : ne pas redeclarer une taille ici, elle est heritee de `.doc-read`
     qui consomme `--workshop-editor-font-size`. Une valeur en dur a cet
     endroit desynchronise le texte nu (herite) du texte en paragraphes. */
  font-size: inherit;
  line-height: inherit;
}

.doc-read p {
  margin: 0 0 10px;
}

.doc-read ul {
  margin: 0 0 12px;
  padding-left: 20px;
}

.doc-read code {
  padding: 1px 5px;
  border-radius: 5px;
  background: var(--bg);
}

.doc-read a {
  color: var(--accent);
  font-weight: 700;
}

.doc-read .rich-markdown-table-wrap,
.jb-rich-text .rich-markdown-table-wrap {
  max-width: 100%;
  margin: 14px 0;
  overflow-x: auto;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel);
}

.doc-read .rich-markdown-table,
.jb-rich-text .rich-markdown-table {
  width: 100%;
  min-width: 520px;
  border-collapse: collapse;
  font-size: 13px;
  line-height: 1.45;
}

.doc-read .rich-markdown-table th,
.doc-read .rich-markdown-table td,
.jb-rich-text .rich-markdown-table th,
.jb-rich-text .rich-markdown-table td {
  padding: 9px 11px;
  border-bottom: 1px solid var(--line);
  color: var(--text);
  text-align: left;
  vertical-align: top;
}

.doc-read .rich-markdown-table th,
.jb-rich-text .rich-markdown-table th {
  background: var(--surface-soft);
  color: var(--muted);
  font-size: 11px;
  font-weight: 850;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.doc-read .rich-markdown-table tr:last-child td,
.jb-rich-text .rich-markdown-table tr:last-child td {
  border-bottom: 0;
}

.doc-read .rich-markdown-table .align-center,
.jb-rich-text .rich-markdown-table .align-center {
  text-align: center;
}

.doc-read .rich-markdown-table .align-right,
.jb-rich-text .rich-markdown-table .align-right {
  text-align: right;
}

.doc-editor-shell {
  display: grid;
  gap: 10px;
}

.doc-editor {
  min-height: 62vh;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  color: var(--text);
  font: 14px/1.55 ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  resize: vertical;
}

/* Content module */
.content-module .content-head {
  align-items: end;
}

.content-channel-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
  margin-bottom: 18px;
}

.content-channel-card {
  position: relative;
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr) 26px;
  gap: 14px;
  min-height: 74px;
  align-items: center;
  padding: 15px 16px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel);
  color: var(--text);
  font: inherit;
  text-align: left;
  cursor: pointer;
  transition: border-color 160ms ease, box-shadow 160ms ease, transform 160ms ease;
}

.content-channel-card:hover {
  border-color: rgba(39, 111, 104, 0.45);
  box-shadow: 0 10px 26px rgba(32, 37, 34, 0.07);
  transform: translateY(-1px);
}

.content-channel-card.active {
  border-color: rgba(39, 111, 104, 0.58);
  background: linear-gradient(180deg, #ffffff 0%, #f4faf8 100%);
  box-shadow: inset 0 0 0 1px rgba(39, 111, 104, 0.08);
}

.content-channel-card.disabled {
  color: #9ba19d;
  cursor: not-allowed;
}

.content-channel-card.disabled:hover {
  border-color: var(--line);
  box-shadow: none;
  transform: none;
}

.content-channel-icon {
  display: grid;
  width: 44px;
  height: 44px;
  place-items: center;
  border-radius: 8px;
  color: #fff;
}

.content-channel-icon svg {
  width: 25px;
  height: 25px;
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 2;
}

.content-channel-card.youtube .content-channel-icon svg {
  fill: currentColor;
  stroke: none;
}

.content-channel-card.instagram .content-channel-icon {
  background: linear-gradient(135deg, #e5508c 0%, #f0a33b 52%, #8b5ce0 100%);
}

.content-channel-card.youtube .content-channel-icon {
  background: #e62117;
}

.content-channel-card.podcast .content-channel-icon {
  background: linear-gradient(135deg, #bd4ee4 0%, #6e52cc 100%);
}

.content-channel-card.blog .content-channel-icon {
  background: #e7e9e6;
  color: #9ba19d;
}

.content-channel-copy {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.content-channel-copy strong {
  overflow: hidden;
  font-size: 15px;
  font-weight: 850;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.content-channel-copy em {
  overflow: hidden;
  color: var(--muted);
  font-size: 13px;
  font-style: normal;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.content-channel-state {
  position: relative;
  display: grid;
  width: 24px;
  height: 24px;
  place-items: center;
  border-radius: 50%;
  font-size: 0;
}

.content-channel-card.active .content-channel-state {
  background: var(--accent);
  color: #fff;
}

.content-channel-card.active .content-channel-state::before {
  content: "✓";
  font-size: 14px;
  font-weight: 900;
  line-height: 1;
}

.content-channel-card.disabled .content-channel-state {
  color: #a7aca8;
}

.content-channel-card.disabled .content-channel-state::before {
  content: "";
  width: 10px;
  height: 8px;
  margin-top: 5px;
  border: 2px solid currentColor;
  border-radius: 2px;
}

.content-channel-card.disabled .content-channel-state::after {
  content: "";
  position: absolute;
  top: 4px;
  left: 7px;
  width: 10px;
  height: 9px;
  border: 2px solid currentColor;
  border-bottom: 0;
  border-radius: 8px 8px 0 0;
}

.worker-bar {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 18px;
  padding: 10px 14px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--panel);
  font-size: 13px;
  flex-wrap: wrap;
}

.worker-dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: var(--accent);
}

.worker-dot.off {
  background: var(--warning);
}

.worker-queue {
  margin-left: auto;
  color: var(--muted);
}

.view-switch,
.content-filters {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 14px;
}

.view-switch button {
  min-height: 36px;
  padding: 0 14px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--panel);
  color: var(--muted);
  font: inherit;
  font-size: 13px;
  font-weight: 800;
  cursor: pointer;
}

.view-switch button.active,
.view-switch button:hover {
  border-color: var(--accent);
  background: var(--accent-soft);
  color: var(--accent);
}

.content-filters input,
.content-filters select {
  min-height: 36px;
  padding: 7px 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  color: var(--text);
  font: inherit;
}

.content-filters input {
  flex: 1;
  min-width: 180px;
}

.content-database-toolbar,
.module-toolbar.content-filters,
.module-toolbar.docs-toolbar,
.module-toolbar.calendar-toolbar,
.module-toolbar.launch-list-head {
  margin-bottom: 18px;
}

.content-database-toolbar {
  align-items: stretch;
}

.content-module .content-database-toolbar {
  display: grid;
  grid-template-columns: auto minmax(260px, 1fr) minmax(430px, auto);
  align-items: stretch;
  gap: 8px;
}

/* Content adopts the shared surface classes without changing the validated
   alignment of its module header and database toolbar. */
.content-module .content-head.jb-page-header {
  align-items: flex-end;
}

.content-module .content-database-toolbar.jb-toolbar {
  align-items: stretch;
}

.content-database-toolbar .module-view-switch {
  flex: 0 0 auto;
}

.content-module .content-database-toolbar .module-view-switch {
  flex-wrap: nowrap;
}

.content-database-toolbar .module-select-filters {
  flex: 1 1 360px;
  justify-content: flex-end;
}

.content-module .content-database-toolbar .module-select-filters {
  display: grid;
  grid-template-columns: repeat(3, minmax(132px, 1fr));
  gap: 8px;
  min-width: 0;
}

.content-database-toolbar select {
  flex: 0 1 170px;
}

.content-module .content-database-toolbar select {
  width: 100%;
  min-width: 0;
}

.module-toolbar.content-filters input,
.module-toolbar.docs-toolbar input {
  flex: 1 1 260px;
}

.content-table-wrap {
  overflow-x: auto;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel);
  box-shadow: 0 8px 22px rgba(32, 37, 34, 0.04);
}

.content-table {
  width: 100%;
  min-width: 860px;
  border-collapse: collapse;
  font-size: 14px;
}

.content-table th {
  padding: 11px 12px;
  border-bottom: 1px solid var(--line);
  background: #fafaf8;
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.04em;
  text-align: left;
  text-transform: uppercase;
}

.content-table td {
  padding: 14px 12px;
  border-bottom: 1px solid var(--line);
  vertical-align: middle;
}

.content-table tr:last-child td {
  border-bottom: 0;
}

.content-table tbody tr {
  cursor: pointer;
}

.content-table tbody tr:hover {
  background: #fbfbf8;
}

.content-title strong {
  display: block;
  max-width: 460px;
  overflow: hidden;
  font-weight: 850;
  line-height: 1.3;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.content-title span {
  display: block;
  max-width: 460px;
  overflow: hidden;
  color: var(--muted);
  font-size: 12px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.content-channel,
.content-status,
.liv-state {
  display: inline-flex;
  align-items: center;
  min-height: 22px;
  padding: 2px 9px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 800;
  white-space: nowrap;
}

.content-channel.podcast {
  background: var(--pod-soft);
  color: var(--pod);
}

.content-channel.youtube {
  background: var(--yt-soft);
  color: var(--yt);
}

.content-channel.instagram {
  background: var(--ig-soft);
  color: var(--ig);
}

.content-channel.blog {
  background: var(--gold-soft);
  color: var(--gold);
}

.content-status.idee {
  background: #f0eeea;
  color: var(--muted);
}

.content-status.en-production {
  background: var(--warning-soft);
  color: var(--warning);
}

.content-status.traitement-ia,
.liv-state.proposition {
  background: var(--pod-soft);
  color: var(--pod);
}

.content-status.a-valider {
  background: var(--pink-soft);
  color: var(--pink);
}

.content-status.programme {
  background: var(--blue-soft);
  color: var(--blue);
}

.content-status.publie,
.liv-state.valide {
  background: var(--accent-soft);
  color: var(--accent);
}

.liv-state.vide {
  background: #f0eeea;
  color: var(--muted);
}

.muted,
.empty-row {
  color: var(--muted);
}

.content-kanban {
  display: block;
  min-width: 0;
}

.content-kanban-grid {
  display: grid;
  grid-template-columns: repeat(9, minmax(160px, 1fr));
  gap: 10px;
  overflow-x: auto;
  padding-bottom: 6px;
}

.content-kcol {
  min-width: 160px;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--panel);
}

.content-kcol h2 {
  display: flex;
  justify-content: space-between;
  margin-bottom: 10px;
  color: var(--muted);
  font-size: 12px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.content-kcol h2 b {
  color: var(--text);
}

.content-kcard {
  display: grid;
  width: 100%;
  gap: 7px;
  margin-bottom: 8px;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  color: var(--text);
  font: inherit;
  text-align: left;
  cursor: pointer;
}

.content-kcard:hover {
  border-color: var(--accent);
}

.content-kcard strong {
  font-size: 13px;
  line-height: 1.3;
}

.content-kcard span:last-child {
  color: var(--muted);
  font-size: 11px;
}

.calendar-placeholder {
  display: grid;
  gap: 7px;
  padding: 34px;
  border: 1px dashed var(--line);
  border-radius: 10px;
  background: var(--panel);
  color: var(--muted);
  text-align: center;
}

.calendar-placeholder strong {
  color: var(--text);
}

.content-detail-head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 16px;
  align-items: end;
  margin-bottom: 14px;
  padding-bottom: 14px;
  border-bottom: 1px solid var(--line);
}

.content-detail-head p {
  margin: 0 0 6px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.content-detail-head h1 {
  font-size: 30px;
  line-height: 1.15;
}

.content-validation {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 16px;
  padding: 11px 14px;
  border-radius: 10px;
  font-size: 13px;
  font-weight: 800;
}

.content-validation.wait {
  background: var(--warning-soft);
  color: var(--warning);
}

.content-validation.ok {
  background: var(--accent-soft);
  color: var(--accent);
}

.content-validation button {
  margin-left: auto;
  padding: 5px 11px;
  border: 1px solid currentColor;
  border-radius: 7px;
  background: transparent;
  color: inherit;
  font: inherit;
  font-size: 12px;
  font-weight: 800;
  cursor: pointer;
}

.content-detail-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 300px;
  gap: 18px;
  align-items: start;
}

.content-props {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.content-props article,
.content-card,
.content-livrable,
.content-rail {
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--panel);
}

.content-props article {
  padding: 10px;
}

.content-props span {
  display: block;
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
}

.content-props strong {
  display: block;
  margin-top: 5px;
  font-size: 14px;
}

.content-card {
  padding: 16px;
}

.content-video,
.content-video-placeholder {
  width: 100%;
  aspect-ratio: 16 / 9;
  margin-bottom: 10px;
  border: 0;
  border-radius: 8px;
  background: #1f1717;
}

.content-video-placeholder {
  display: grid;
  place-items: center;
  color: #fff;
  font-weight: 800;
  text-align: center;
}

.content-video-placeholder span {
  display: block;
  margin-top: 4px;
  color: #d8c8c8;
  font-size: 12px;
  font-weight: 650;
}

.content-drive-file {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  margin-bottom: 8px;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  color: inherit;
  text-decoration: none;
}

.content-drive-file:hover {
  border-color: var(--accent);
}

.content-drive-file span {
  display: grid;
  width: 32px;
  height: 32px;
  place-items: center;
  border-radius: 7px;
  background: var(--pod-soft);
  color: var(--pod);
  font-weight: 900;
}

.content-drive-file em {
  color: var(--muted);
  font-size: 12px;
  font-style: normal;
}

.content-small-title {
  margin: 14px 0 8px;
  font-size: 14px;
}

.content-script {
  max-height: 170px;
  overflow: hidden;
  padding: 13px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--bg);
  font-size: 13px;
  line-height: 1.55;
  -webkit-mask-image: linear-gradient(#000 68%, transparent);
  mask-image: linear-gradient(#000 68%, transparent);
}

.content-livrable {
  overflow: hidden;
  margin-bottom: 10px;
}

.content-livrable header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 12px 15px;
}

.content-livrable header div {
  display: flex;
  align-items: center;
  gap: 9px;
}

.content-livrable-body,
.content-options {
  padding: 12px 15px 15px;
  border-top: 1px solid var(--line);
  font-size: 14px;
  line-height: 1.55;
}

.content-options {
  display: grid;
  gap: 7px;
}

.content-options label {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
}

.content-email-link {
  display: inline-flex;
  margin: 0 15px 15px;
  padding: 8px 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  color: var(--accent);
  font-size: 13px;
  font-weight: 800;
  text-decoration: none;
}

.content-rail {
  position: sticky;
  top: 20px;
  padding: 18px;
}

.content-rail h2 {
  margin: 0 0 10px;
  font-size: 15px;
}

.content-rail h2:not(:first-child) {
  margin-top: 16px;
}

.content-brief {
  padding: 12px;
  border: 1px solid #cfe0ec;
  border-radius: 8px;
  background: var(--blue-soft);
  font-size: 13px;
  line-height: 1.55;
}

.content-context {
  display: grid;
  gap: 2px;
  margin-bottom: 8px;
  padding: 10px 11px;
  border: 1px solid var(--line);
  border-radius: 8px;
}

.content-context span,
.rail-note {
  color: var(--muted);
  font-size: 12px;
}

.content-checklist {
  display: grid;
  gap: 6px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.content-checklist li {
  display: grid;
  grid-template-columns: 18px minmax(0, 1fr) auto;
  gap: 9px;
  align-items: center;
  padding: 8px 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  font-size: 13px;
}

.content-checklist li span {
  display: grid;
  width: 16px;
  height: 16px;
  place-items: center;
  border: 1px solid var(--line);
  border-radius: 4px;
  font-size: 11px;
  font-weight: 900;
}

.content-checklist .done {
  border-color: var(--accent);
  background: var(--accent-soft);
  color: var(--accent);
}

.content-checklist .running {
  border-color: var(--pod);
  background: var(--pod-soft);
  color: var(--pod);
}

.content-checklist em {
  color: var(--muted);
  font-size: 11px;
  font-style: normal;
  font-weight: 800;
}

.channel-choice {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.channel-choice button {
  min-height: 52px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: #fff;
  color: var(--text);
  font: inherit;
  font-weight: 800;
  cursor: pointer;
}

.channel-choice button:hover {
  border-color: var(--accent);
}

.file-pick {
  display: grid;
  gap: 7px;
}

.file-pick label {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 11px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  font-size: 13px;
}

.file-pick label.dashed {
  border-style: dashed;
}

.file-pick span {
  margin-left: auto;
  color: var(--muted);
  font-size: 12px;
}

.brief-input {
  display: flex;
  gap: 10px;
  align-items: flex-start;
}

.brief-text {
  flex: 1;
  min-height: 88px;
  padding: 11px;
  border: 1px solid var(--line);
  border-radius: 8px;
  color: var(--text);
  font: inherit;
  font-size: 13px;
  line-height: 1.5;
  resize: vertical;
}

.brief-hint {
  margin: 8px 0 0;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.5;
}

.overview-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  margin-bottom: 18px;
}

.metric {
  min-height: 150px;
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel);
}

.metric strong {
  display: block;
  margin: 12px 0 8px;
  font-size: 26px;
  line-height: 1;
}

.metric p,
.muted {
  color: var(--muted);
}

.metric p {
  margin: 0;
  line-height: 1.45;
}

.workspace-layout {
  display: grid;
  grid-template-columns: minmax(250px, 0.34fr) minmax(0, 1fr);
  gap: 16px;
  align-items: start;
}

.side-panel,
.content-panel {
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel);
}

.side-panel {
  padding: 18px;
}

.side-panel h2 {
  margin: 0 0 12px;
  font-size: 18px;
}

.side-panel h2 + p {
  margin-top: 0;
  line-height: 1.5;
}

.content-panel {
  padding: 20px;
}

.section-title {
  margin-bottom: 16px;
}

.section-title.compact {
  margin: 28px 0 12px;
}

.stack-list {
  display: grid;
  gap: 12px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.stack-list li {
  padding-top: 12px;
  border-top: 1px solid var(--line);
}

.stack-list li:first-child {
  padding-top: 0;
  border-top: 0;
}

.stack-list strong,
.stack-list span {
  display: block;
}

.stack-list span {
  margin-top: 4px;
  color: var(--muted);
  line-height: 1.4;
}

.launch-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(280px, 0.42fr);
  gap: 18px;
  padding: 18px;
  border: 1px solid var(--line);
  border-radius: 8px;
  color: inherit;
  text-decoration: none;
}

.launch-row:hover {
  border-color: var(--accent);
}

.launch-row p {
  margin: 8px 0 0;
  color: var(--muted);
  line-height: 1.45;
}

.launch-row dl {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin: 0;
}

.launch-row dt {
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
  text-transform: uppercase;
}

.launch-row dd {
  margin: 5px 0 0;
  font-weight: 800;
}

.status {
  display: inline-flex;
  margin-bottom: 10px;
  padding: 5px 8px;
  border-radius: 999px;
  background: var(--blue-soft);
  color: var(--blue);
  font-size: 12px;
  font-weight: 800;
}

.status.done {
  background: var(--accent-soft);
  color: var(--accent);
}

.launch-kpis .metric:nth-child(3) {
  border-color: #ead0dc;
  background: var(--pink-soft);
}

.drive-path {
  overflow-wrap: anywhere;
  margin: 12px 0 22px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--bg);
  color: var(--muted);
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 12px;
  line-height: 1.45;
}

.tag-list {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.tag-list li {
  padding: 6px 9px;
  border-radius: 999px;
  background: var(--blue-soft);
  color: var(--blue);
  font-size: 13px;
  font-weight: 800;
}

.summary-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.summary-grid article {
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--bg);
}

.summary-grid p {
  margin: 8px 0 0;
  color: var(--muted);
  line-height: 1.5;
}

.timeline ol {
  display: grid;
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.timeline li,
.sequence-row,
.doc-row {
  display: grid;
  grid-template-columns: 150px minmax(0, 1fr);
  gap: 12px;
  align-items: start;
  padding: 12px 0;
  border-top: 1px solid var(--line);
}

.timeline li:first-child,
.sequence-row:first-of-type,
.doc-row:first-of-type {
  border-top: 0;
}

.timeline span,
.sequence-row span {
  color: var(--muted);
  font-size: 13px;
  font-weight: 800;
}

.doc-row strong,
.sequence-row strong {
  font-size: 16px;
}

.doc-row span,
.sequence-row p {
  margin: 0;
  color: var(--muted);
  line-height: 1.45;
}

.launch-workspace {
  max-width: 1180px;
}

.launch-header:not(.module-header) {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 18px;
  align-items: end;
  margin-bottom: 18px;
  padding-bottom: 16px;
  border-bottom: 1px solid var(--line);
}

.launch-title-block {
  min-width: 0;
}

.launch-title-block p,
.drive-reference span {
  margin: 0 0 6px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

#launchTitle {
  cursor: text;
}

.launch-actions,
.card-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: flex-end;
}

.launch-actions button,
.card-actions button {
  min-height: 36px;
  padding: 7px 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel);
  color: var(--text);
  font-weight: 800;
}

.launch-properties {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin-bottom: 12px;
}

.launch-properties label {
  display: grid;
  gap: 5px;
  min-width: 0;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel);
}

.launch-properties span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
  text-transform: uppercase;
}

.launch-properties input,
.launch-properties select,
.section-title-input,
.section-editor {
  width: 100%;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  color: var(--text);
  font: inherit;
}

.launch-properties input,
.launch-properties select,
.section-title-input {
  min-height: 38px;
  padding: 8px 10px;
}

.launch-product-link {
  width: fit-content;
  color: var(--accent);
  font-size: 12px;
  font-weight: 800;
  text-decoration: none;
}

.launch-product-link:hover {
  text-decoration: underline;
}

.drive-reference {
  display: grid;
  gap: 5px;
  margin-bottom: 18px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel);
}

.drive-reference code {
  overflow-wrap: anywhere;
  color: var(--muted);
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 12px;
}

.launch-sections {
  display: grid;
  gap: 12px;
}

.launch-edit-card {
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel);
}

.launch-edit-card:hover {
  border-color: #b6c2bc;
}

.launch-card-heading {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  margin-bottom: 12px;
}

.launch-card-heading h2 {
  cursor: text;
  font-size: 24px;
  line-height: 1.15;
}

.section-view {
  cursor: text;
}

.section-view h3 {
  margin: 16px 0 8px;
  font-size: 16px;
}

.section-view h3:first-child {
  margin-top: 0;
}

.section-view p,
.section-view li {
  line-height: 1.5;
}

.section-view p {
  margin: 0 0 8px;
}

.launch-md-list {
  display: grid;
  gap: 6px;
  margin: 0;
  padding-left: 20px;
}

.subpage-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin-top: 14px;
}

.subpage-grid a {
  display: grid;
  gap: 5px;
  min-height: 76px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  color: inherit;
  text-decoration: none;
}

.subpage-grid a:hover {
  border-color: var(--accent);
}

.subpage-grid span {
  color: var(--muted);
  font-size: 13px;
  line-height: 1.4;
}

.task-line {
  display: flex;
  gap: 8px;
  align-items: flex-start;
  list-style: none;
}

.task-box {
  display: inline-grid;
  width: 18px;
  height: 18px;
  flex: 0 0 18px;
  place-items: center;
  border: 1px solid var(--line);
  border-radius: 4px;
  color: var(--accent);
  font-size: 12px;
  font-weight: 900;
}

.task-box.checked {
  border-color: var(--accent);
  background: var(--accent-soft);
}

.section-editor {
  min-height: 230px;
  padding: 12px;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 13px;
  line-height: 1.55;
}

.launch-index {
  box-sizing: border-box;
  width: min(1320px, calc(100vw - 48px));
  max-width: none;
}

.launch-index-head:not(.module-header) {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 18px;
  align-items: end;
  margin-bottom: 20px;
  padding-bottom: 16px;
  border-bottom: 1px solid var(--line);
}

.launch-index-head p {
  margin: 0 0 6px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.launch-cockpit-cell.next {
  border-color: #ead0dc;
  background: var(--pink-soft);
}

.launch-cockpit-cell.next strong {
  color: var(--pink);
}

.launch-cockpit-cell small {
  display: inline-block;
  margin-left: 4px;
  padding: 2px 6px;
  border-radius: 999px;
  background: var(--warning-soft);
  color: var(--warning);
  font-size: 10px;
  font-weight: 800;
  text-transform: uppercase;
  vertical-align: middle;
}

.launch-index-layout {
  display: block;
}

.launch-list-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 14px;
}

.launch-list-head h2 {
  margin: 0;
  color: var(--muted);
  font-size: 15px;
  letter-spacing: 0.03em;
  text-transform: uppercase;
}

.year-switch {
  display: inline-flex;
  align-items: center;
  gap: 2px;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel);
}

.year-switch button {
  width: 34px;
  height: 34px;
  border: 0;
  background: transparent;
  color: var(--accent);
  cursor: pointer;
  font-size: 18px;
  font-weight: 800;
}

.year-switch button:hover {
  background: var(--accent-soft);
}

.year-switch button:disabled {
  background: transparent;
  color: var(--line);
  cursor: default;
}

.year-switch span {
  min-width: 66px;
  text-align: center;
  font-size: 15px;
  font-weight: 800;
}

.launch-list {
  display: grid;
  gap: 8px;
}

.launch-item {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 14px;
  align-items: center;
  padding: 15px 16px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel);
  color: inherit;
  text-decoration: none;
}

.launch-item:hover {
  border-color: var(--accent);
}

.status-dot {
  width: 11px;
  height: 11px;
  border-radius: 50%;
}

.status-dot.todo {
  background: #d64b4b;
}

.status-dot.doing {
  background: #e88a2a;
}

.status-dot.done {
  background: #2f9b65;
}

.status-dot.cancelled {
  background: var(--warning);
}

.li-main {
  min-width: 0;
}

.li-main strong,
.li-main span {
  display: block;
}

.li-main strong {
  font-size: 16px;
}

.li-main span {
  margin-top: 3px;
  color: var(--muted);
  font-size: 13px;
}

.li-right {
  display: grid;
  min-width: 116px;
  gap: 5px;
  justify-items: end;
  padding: 9px 12px;
  border: 1px solid var(--accent-soft);
  border-radius: 8px;
  background: #f4faf8;
  text-align: right;
}

.li-status {
  font-size: 12px;
  font-weight: 800;
}

.li-status.todo {
  color: #b93232;
}

.li-status.doing {
  color: #b76312;
}

.li-status.done {
  color: #23784e;
}

.li-status.cancelled {
  color: var(--warning);
}

.li-result-label {
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.li-result-value {
  color: var(--accent);
  font-size: 15px;
  font-weight: 850;
}

.year-empty {
  padding: 26px 16px;
  border: 1px dashed var(--line);
  border-radius: 8px;
  background: var(--panel);
  color: var(--muted);
  text-align: center;
}

.launch-add-row {
  margin-top: 10px;
}

.launch-add-row button,
.context-add {
  width: 100%;
  padding: 12px;
  border: 1px dashed var(--line);
  border-radius: 8px;
  background: var(--panel);
  color: var(--muted);
  cursor: pointer;
  font: inherit;
  font-weight: 800;
}

.launch-add-row button:hover {
  border-color: var(--pink);
  color: var(--pink);
}

.brand-context-box {
  position: sticky;
  top: 20px;
  padding: 18px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel);
}

.brand-context-box h2 {
  margin: 0 0 6px;
  font-size: 16px;
}

.brand-context-box p {
  margin: 0 0 14px;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.5;
}

.brand-context-list {
  display: grid;
  gap: 8px;
}

.brand-context-doc {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 4px 8px;
  align-items: center;
  padding: 11px 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel);
  color: inherit;
  cursor: pointer;
  font: inherit;
  text-align: left;
}

.brand-context-doc:hover {
  border-color: var(--accent);
}

.brand-context-doc strong {
  font-size: 13px;
}

.brand-context-doc small {
  grid-column: 1;
  color: var(--muted);
  font-size: 11px;
}

.context-state {
  justify-self: end;
  padding: 2px 8px;
  border-radius: 999px;
  font-size: 10px;
  font-weight: 800;
  text-transform: uppercase;
}

.context-state.vide {
  background: #f0eeea;
  color: var(--muted);
}

.context-state.partiel {
  background: var(--warning-soft);
  color: var(--warning);
}

.context-state.ok {
  background: var(--accent-soft);
  color: var(--accent);
}

.context-add {
  margin-top: 10px;
  padding: 10px;
  background: transparent;
  font-size: 12px;
}

.context-add:hover {
  border-color: var(--accent);
  color: var(--accent);
}

.modal-backdrop {
  position: fixed;
  inset: 0;
  z-index: 30;
  background: rgba(20, 26, 24, 0.4);
  opacity: 0;
  pointer-events: none;
  transition: opacity 160ms ease;
}

.modal-backdrop.open {
  opacity: 1;
  pointer-events: auto;
}

.launch-modal {
  position: fixed;
  top: 50%;
  left: 50%;
  z-index: 31;
  width: min(620px, 94vw);
  max-height: 88vh;
  overflow-y: auto;
  border-radius: 14px;
  background: var(--panel);
  box-shadow: 0 24px 60px rgba(20, 26, 24, 0.24);
  opacity: 0;
  pointer-events: none;
  transform: translate(-50%, -48%);
  transition: opacity 160ms ease, transform 160ms ease;
}

.launch-modal.open {
  opacity: 1;
  pointer-events: auto;
  transform: translate(-50%, -50%);
}

.launch-modal-head {
  padding: 20px 22px 14px;
  border-bottom: 1px solid var(--line);
}

.launch-modal-head h2 {
  margin: 0 0 5px;
  font-size: 20px;
}

.launch-modal-head p {
  margin: 0;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.45;
}

.launch-modal-body {
  padding: 18px 22px;
}

.modal-step {
  margin-bottom: 20px;
}

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

.modal-step-label {
  display: flex;
  align-items: center;
  gap: 9px;
  margin-bottom: 10px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.modal-step-label span {
  display: inline-grid;
  width: 22px;
  height: 22px;
  flex: 0 0 22px;
  place-items: center;
  border-radius: 50%;
  background: var(--accent);
  color: #fff;
  font-size: 12px;
}

.record-box {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 16px;
  border: 1px dashed var(--line);
  border-radius: 8px;
  background: var(--bg);
}

.record-box .record-button {
  display: grid;
  width: 46px;
  height: 46px;
  flex: 0 0 46px;
  place-items: center;
  border: 0;
  border-radius: 50%;
  background: var(--pink);
  cursor: pointer;
}

.record-box .record-button::before {
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background: #fff;
  content: "";
}

.record-box .record-button.recording {
  background: #c0392b;
}

.record-box .record-button.recording::before {
  border-radius: 2px;
}

.record-box strong,
.record-box span {
  display: block;
}

.record-box span {
  margin-top: 3px;
  color: var(--muted);
  font-size: 12px;
}

.launch-strategy-input .record-box {
  color: var(--text);
  letter-spacing: 0;
  text-transform: none;
}

.transcript {
  margin: 10px 0 0;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  font-size: 13px;
  line-height: 1.5;
}

.transcript.empty {
  color: var(--muted);
  font-style: italic;
}

.launch-basic-form {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.launch-basic-form label,
.launch-basic-toggle {
  display: grid;
  gap: 6px;
  min-width: 0;
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.launch-basic-form input,
.launch-basic-form select,
.launch-basic-form textarea,
.launch-basic-textarea {
  width: 100%;
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  color: var(--text);
  font: inherit;
  font-size: 14px;
  font-weight: 500;
  letter-spacing: 0;
  text-transform: none;
}

.launch-basic-form input,
.launch-basic-form select {
  min-height: 38px;
  padding: 8px 10px;
}

.launch-basic-form textarea,
.launch-basic-textarea {
  resize: vertical;
  padding: 10px;
  line-height: 1.45;
}

.launch-basic-wide {
  grid-column: 1 / -1;
}

.launch-basic-toggle {
  display: flex;
  min-height: 38px;
  align-items: center;
  gap: 8px;
  padding: 8px 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
}

.launch-basic-toggle input {
  width: 17px;
  min-height: 17px;
  padding: 0;
  accent-color: var(--accent);
}

.context-checks,
.example-picks {
  display: grid;
  gap: 8px;
}

.context-checks label,
.example-pick {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  cursor: pointer;
  font-size: 13px;
}

.context-checks input,
.example-pick input {
  width: 17px;
  height: 17px;
  accent-color: var(--accent);
}

.context-checks strong,
.example-pick small {
  margin-left: auto;
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
}

.context-checks strong.partiel {
  color: var(--warning);
}

.launch-modal-foot {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 16px 22px;
  border-top: 1px solid var(--line);
}

.launch-modal-foot span {
  margin-right: auto;
  color: var(--warning);
  font-size: 12px;
  font-weight: 700;
}

.launch-detail {
  max-width: var(--workshop-max-width);
}

.launch-detail-head h1 {
  max-width: 760px;
  font-size: 26px;
  font-weight: 600;
  letter-spacing: 0;
}

.launch-status-select {
  width: 100%;
  border: 1px solid transparent;
  outline: 0;
  cursor: pointer;
  appearance: none;
}

.launch-status-select:focus {
  box-shadow: 0 0 0 2px var(--accent-soft);
}

.launch-status-select.a-faire {
  background: #fdebea;
  color: #b93232;
}

.launch-status-select.en-cours {
  background: #fbf0df;
  color: #b76312;
}

.launch-status-select.termine {
  background: #e6f5ee;
  color: #23784e;
}

.launch-status-select.annule {
  background: #ecefed;
  color: #4f5752;
}

.launch-detail-header.module-header {
  align-items: flex-end;
  flex-direction: row;
  gap: 18px;
}

.launch-title-block {
  flex: 1 1 auto;
  min-width: 0;
}

.launch-detail-header .launch-title-block h1 {
  max-width: none;
}

.launch-detail-header .launch-actions {
  flex: 0 0 auto;
  justify-content: flex-end;
}

.launch-detail-header:not(.module-header) {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 18px;
  align-items: end;
  margin-bottom: 18px;
  padding-bottom: 16px;
  border-bottom: 1px solid var(--line);
}

.launch-detail-header p {
  margin: 0 0 6px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.status-pill {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  margin-top: 10px;
  padding: 5px 10px;
  border-radius: 999px;
  background: var(--accent-soft);
  color: var(--accent);
  font-size: 12px;
  font-weight: 800;
}

.status-pill::before {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  content: "";
}

.status-pill.a-faire {
  background: #fdebea;
  color: #b93232;
}

.status-pill.a-faire::before {
  background: #d64b4b;
}

.status-pill.en-cours {
  background: #fbf0df;
  color: #b76312;
}

.status-pill.en-cours::before {
  background: #e88a2a;
}

.status-pill.termine {
  background: #e6f5ee;
  color: #23784e;
}

.status-pill.termine::before {
  background: #2f9b65;
}

.status-pill.annule {
  background: #ecefed;
  color: #4f5752;
}

.status-pill.annule::before {
  background: #5f6762;
}

.props {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  align-items: stretch;
  gap: 10px;
  margin-bottom: 24px;
}

.props .prop {
  display: grid;
  gap: 8px;
  align-content: stretch;
  min-width: 0;
  min-height: 86px;
  padding: 12px 14px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--panel);
}

.props span,
.prop-label {
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.props select,
.props input {
  height: 32px;
  min-height: 0;
  width: 100%;
  padding: 0;
  border: 1px solid transparent;
  border-radius: 6px;
  background: transparent;
  color: var(--text);
  font: inherit;
  font-size: 14.5px;
  font-weight: 500;
  line-height: 1.2;
}

.props select {
  cursor: pointer;
  appearance: none;
}

.props select:hover,
.props input:not([readonly]):hover {
  border-color: var(--line);
  background: #fcfcfb;
}

.props select:focus,
.props input:focus {
  border-color: var(--accent);
  outline: none;
  background: #fff;
  box-shadow: 0 0 0 2px var(--accent-soft);
}

.props .launch-status-select.a-faire {
  background: #fdebea;
  color: #b93232;
}

.props .launch-status-select.en-cours {
  background: #fbf0df;
  color: #b76312;
}

.props .launch-status-select.termine {
  background: #e6f5ee;
  color: #23784e;
}

.props .launch-status-select.annule {
  background: #ecefed;
  color: #4f5752;
}

.status-select-wrap {
  position: relative;
  display: block;
}

.status-select-wrap select {
  padding-left: 28px;
}

.status-select-dot {
  position: absolute;
  top: 50%;
  left: 10px;
  z-index: 1;
  width: 9px;
  height: 9px;
  border-radius: 50%;
  pointer-events: none;
  transform: translateY(-50%);
}

.status-select-dot.a-faire {
  background: #d64b4b;
}

.status-select-dot.en-cours {
  background: #e88a2a;
}

.status-select-dot.termine {
  background: #2f9b65;
}

.status-select-dot.annule {
  background: #5f6762;
}

.props input[readonly] {
  color: var(--text);
  cursor: default;
}

.status-product-prop {
  gap: 8px;
}

.prop-field {
  display: grid;
  gap: 6px;
  align-content: start;
  min-width: 0;
}

.prop-field span {
  font-size: 10px;
}

.prop-field > select {
  margin-top: 2px;
}

.launch-product-hub {
  display: inline-flex;
  width: fit-content;
  align-items: center;
  margin-top: -2px;
  color: var(--accent);
  font-size: 12.5px;
  font-weight: 500;
  letter-spacing: 0;
  text-decoration: none;
  text-transform: none;
}

.launch-product-hub:hover {
  text-decoration: underline;
}

.prod-link {
  display: inline-flex;
  min-height: 36px;
  align-items: center;
  gap: 6px;
  padding: 7px 9px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--accent-soft);
  color: var(--accent);
  font-size: 14px;
  font-weight: 800;
  text-decoration: none;
}

.period-dates {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
  height: 100%;
  gap: 6px 8px;
}

.period-range {
  display: block;
  margin: 2px 0 5px;
  color: var(--text);
  font-size: 17px;
  line-height: 1.2;
  font-weight: 700;
}

.period-dates span {
  display: grid;
  align-items: center;
  gap: 5px;
  min-width: 0;
  padding: 5px 8px;
  border-radius: 7px;
  background: transparent;
}

.period-dates > span:first-child {
  grid-column: 1 / -1;
  padding: 0;
  background: transparent;
}

.period-arrow {
  align-self: center;
  justify-self: center;
  color: var(--muted);
  font-size: 15px;
  font-weight: 500;
}

.period-dates b {
  color: var(--text);
  font-size: 12px;
  font-weight: 800;
}

.period-dates input {
  min-height: 28px;
  width: 100%;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--text);
  font-size: 13.5px;
  font-weight: 500;
}

.period-dates input::-webkit-calendar-picker-indicator {
  width: 0;
  margin: 0;
  padding: 0;
  opacity: 0;
}

.period-input {
  align-content: center;
}

.period-dates input:focus {
  outline: 1px solid var(--accent);
  outline-offset: 3px;
}

.inline-editor {
  display: grid;
  gap: 10px;
}

.inline-editor .section-editor {
  min-height: 260px;
}

.price-stack {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  height: 100%;
  gap: 8px;
}

.props .price-field {
  display: grid;
  gap: 5px;
  align-content: center;
  min-width: 0;
  min-height: 0;
  padding: 0;
  border: 0;
  border-radius: 7px;
  background: transparent;
}

.price-heading {
  display: flex;
  align-items: center;
  gap: 7px;
  flex-wrap: wrap;
}

.props .price-field span {
  font-size: 10px;
}

.price-prop {
  align-content: stretch;
}

.price-prop .price-mini-field .money-input input {
  width: 7ch;
  max-width: 100%;
  min-height: 28px;
  padding-right: 13px;
  border: 0;
  border-bottom: 1px solid var(--line);
  border-radius: 0;
  background: transparent;
  font-size: 14px;
}

.price-prop .price-mini-field .money-input i {
  right: 0;
}

.offer-label-row {
  display: flex;
  min-width: 0;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

.price-base {
  color: var(--muted);
  font-size: 14px;
  font-weight: 700;
  text-decoration: line-through;
}

.price-applied {
  font-size: 15px;
  font-weight: 800;
}

.promo-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 18px;
  padding: 2px 7px;
  border-radius: 999px;
  background: var(--pink-soft);
  color: var(--pink);
  font-size: 10px;
  font-weight: 800;
  text-transform: uppercase;
}

.launch-detail .button.small,
.launch-detail .button.ghost.small,
.launch-detail .ai-btn {
  min-height: 32px;
  border-radius: 8px;
  font-size: 13px;
  font-weight: 600;
}

.launch-options {
  position: relative;
}

.launch-options-menu {
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  z-index: 12;
  display: grid;
  min-width: 190px;
  gap: 4px;
  padding: 6px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel);
  box-shadow: 0 14px 34px rgba(20, 26, 24, 0.16);
}

.launch-options-menu[hidden] {
  display: none;
}

.launch-options-menu button {
  min-height: 34px;
  border: 0;
  border-radius: 7px;
  background: transparent;
  color: var(--text);
  cursor: pointer;
  font: inherit;
  font-size: 13px;
  font-weight: 700;
  text-align: left;
}

.launch-options-menu button:hover {
  background: var(--accent-soft);
}

.launch-options-menu .danger {
  color: #b93232;
}

.launch-options-menu .danger:hover {
  background: #fdebea;
}

.launch-detail #saveMeta {
  border-color: var(--accent);
  background: var(--accent);
  color: #fff;
}

.launch-detail #saveMeta:hover {
  filter: brightness(0.96);
}

.detail-zone {
  margin-bottom: 34px;
}

.launch-detail-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 316px;
  gap: 20px;
  align-items: start;
}

.launch-detail-main > .detail-card {
  margin-bottom: 14px;
}

.launch-detail-main > .detail-card:last-child {
  margin-bottom: 0;
}

.launch-results-rail {
  position: sticky;
  top: 18px;
}

.launch-results-box {
  margin: 0;
}

.launch-results-box h3 {
  margin: 0 0 12px;
  color: var(--muted);
  font-size: 13px;
  font-weight: 750;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.launch-finance-metrics {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 10px;
}

.launch-finance-metrics .product-metric {
  margin-bottom: 0;
}

.product-rail .launch-finance-metrics .product-metric {
  padding: 14px;
  border-radius: 10px;
}

.product-rail .launch-finance-metrics .product-ca {
  border: 1px solid #e6dcc0;
  background: var(--gold-soft);
}

.product-rail .launch-finance-metrics .product-clients {
  border: 1px solid #f0c195;
  background: #fff1df;
}

.product-rail .launch-finance-metrics .product-cart {
  border: 1px solid #ead0dc;
  background: var(--pink-soft);
}

.product-rail .launch-finance-metrics .product-conversion {
  border: 1px solid #bfd8ec;
  background: var(--blue-soft);
}

.product-rail .launch-finance-metrics .product-metric span {
  color: var(--warning);
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
}

.product-rail .launch-finance-metrics .product-metric strong {
  margin-top: 6px;
  color: var(--warning);
  font-size: 24px;
  font-weight: 800;
}

.product-rail .launch-finance-metrics .product-metric small {
  color: var(--muted);
  font-size: 12px;
}

.product-rail .launch-finance-metrics .product-clients span,
.product-rail .launch-finance-metrics .product-clients strong {
  color: #b75516;
}

.product-rail .launch-finance-metrics .product-cart span,
.product-rail .launch-finance-metrics .product-cart strong {
  color: #a43c68;
}

.product-rail .launch-finance-metrics .product-conversion span,
.product-rail .launch-finance-metrics .product-conversion strong {
  color: var(--blue);
}

.result-review-card {
  padding: 18px;
  border-color: #c9e5df;
  background: var(--accent-soft);
}

.zone-label {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 0 0 16px;
}

.zone-label span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  white-space: nowrap;
}

.zone-label::after {
  height: 1px;
  flex: 1;
  background: var(--line);
  content: "";
}

.detail-card {
  margin-bottom: 14px;
  padding: 18px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--panel);
}

.launch-main-boxes .detail-card {
  padding: 20px;
}

.results-card .kpi-strip {
  margin-bottom: 16px;
}

.result-review {
  padding-top: 14px;
  border-top: 1px solid var(--line);
}

.result-review-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 10px;
}

.result-review-head h2,
.result-review-head h3 {
  margin: 0;
  color: var(--text);
  font-size: 20px;
  line-height: 1.15;
  font-weight: 600;
  letter-spacing: 0;
  text-transform: none;
}

.detail-card.synthese {
  border-color: #cfe0ec;
  background: var(--blue-soft);
}

.launch-detail .result-review-card {
  border-color: #c9e5df;
  background: var(--accent-soft);
}

.launch-detail .result-review-card .button.ghost {
  border-color: var(--accent);
  background: var(--accent);
  color: #fff;
}

.detail-card-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 12px;
}

.detail-card-head h2 {
  margin: 0;
  font-size: 20px;
  line-height: 1.2;
  font-weight: 650;
}

.detail-card h3 {
  margin: 16px 0 8px;
  color: var(--muted);
  font-size: 14px;
  font-weight: 650;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

#informationContent,
#resourcesContent,
#planContent {
  cursor: text;
}

.launch-info-grid {
  display: grid;
  gap: 14px;
}

.product-info-grid {
  gap: 18px;
}

.launch-info-section {
  padding: 0;
}

.launch-info-section + .launch-info-section {
  padding-top: 0;
  border-top: 0;
}

.launch-info-subhead {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin: 0 0 8px;
}

.launch-info-subhead h3,
.launch-info-section .linked-product-resources > h3,
.launch-info-section > .subsection-head h3,
.launch-info-section > h3 {
  margin: 0;
  color: var(--muted);
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.launch-info-section .linked-product-resources {
  margin-top: 0;
  padding-top: 0;
  border-top: 0;
}

.launch-info-section.important-links-box {
  padding-top: 0;
}

.launch-info-section > .markdown-body {
  font-size: 13px;
}

.launch-info-timeline {
  display: grid;
  gap: 5px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.launch-info-timeline li {
  display: grid;
  grid-template-columns: minmax(82px, 118px) minmax(0, 1fr);
  gap: 12px;
  margin: 0;
  padding: 2px 0;
  border-bottom: 0;
  color: #3a423e;
  font-size: 13px;
  line-height: 1.45;
}

.launch-info-timeline li:last-child {
  border-bottom: 0;
}

.launch-info-date {
  color: var(--accent);
  font-weight: 600;
}

.launch-info-timeline li.period-date .launch-info-date {
  color: var(--accent);
}

.launch-segmentation-list {
  display: grid;
  gap: 7px;
}

.launch-segmentation-item {
  display: grid;
  grid-template-columns: 78px minmax(0, 1fr);
  align-items: start;
  gap: 10px;
  color: #3a423e;
  font-size: 13px;
  line-height: 1.45;
}

.launch-segmentation-tag {
  display: inline-flex;
  justify-content: center;
  width: 78px;
  padding: 2px 8px;
  border-radius: 999px;
  font-size: 11.5px;
  font-weight: 700;
  line-height: 1.4;
}

.launch-segmentation-item.include .launch-segmentation-tag {
  background: var(--accent-soft);
  color: var(--accent);
}

.launch-segmentation-item.exclude .launch-segmentation-tag {
  background: var(--pink-soft);
  color: var(--pink);
}

.launch-info-editor {
  display: grid;
  gap: 10px;
}

.launch-info-editor .section-editor {
  min-height: 150px;
}

.structured-info-rows {
  display: grid;
  gap: 8px;
}

.structured-info-row {
  display: grid;
  grid-template-columns: minmax(96px, 132px) minmax(0, 1fr) 32px;
  gap: 8px;
  align-items: center;
}

.structured-info-row input,
.structured-info-row select {
  width: 100%;
  min-height: 34px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: #fff;
  color: var(--text);
  font: inherit;
  font-size: 13.5px;
}

.structured-info-row input {
  padding: 7px 9px;
}

.structured-info-row.locked-row {
  grid-template-columns: minmax(96px, 132px) minmax(0, 1fr) auto;
}

.structured-info-row.locked-row input {
  background: #f6f7f4;
  color: var(--muted);
}

.locked-hint {
  color: var(--muted);
  font-size: 12px;
  white-space: nowrap;
}

.structured-info-row select {
  padding: 6px 8px;
}

.detail-card p {
  margin: 0 0 10px;
  color: #3a423e;
  font-size: 14px;
  line-height: 1.55;
}

.detail-card li {
  margin-bottom: 4px;
  color: #3a423e;
  font-size: 14px;
  line-height: 1.6;
}

.detail-card li.md-depth-1 {
  margin-left: 18px;
}

.detail-card li.md-depth-2,
.detail-card li.md-depth-3 {
  margin-left: 34px;
}

.related-launches {
  margin-top: 0;
  margin-bottom: 18px;
  padding-top: 0;
  padding-bottom: 0;
  border-top: 0;
  border-bottom: 0;
}

.context-documents {
  margin-top: 0;
  padding-top: 0;
  border-top: 0;
}

.ai-btn {
  display: inline-flex;
  min-height: 32px;
  align-items: center;
  gap: 6px;
  padding: 0 11px;
  border: 1px solid var(--blue);
  border-radius: 999px;
  background: #fff;
  color: var(--blue);
  cursor: pointer;
  font-size: 12px;
  font-weight: 800;
}

.k-value small {
  display: inline-block;
  margin-left: 5px;
  padding: 2px 6px;
  border-radius: 999px;
  background: var(--warning-soft);
  color: var(--warning);
  font-size: 10px;
  text-transform: uppercase;
  vertical-align: middle;
}

.k-note,
.synth-empty {
  color: var(--muted);
  font-size: 12px;
}

.synth-empty {
  font-style: italic;
  line-height: 1.55;
}

.tl-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  margin: 2px 0 20px;
}

.tl-legend span {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
}

.dot,
.tl-mark {
  display: inline-block;
  border-radius: 50%;
}

.dot {
  width: 11px;
  height: 11px;
}

.dot.email,
.tl-mark.email {
  background: var(--blue);
}

.dot.sale,
.tl-mark.sale {
  background: var(--pink);
}

.dot.contenu,
.tl-mark.contenu {
  background: var(--accent);
}

.tl-lane-label {
  margin-bottom: 20px;
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.tl-axis {
  position: relative;
  height: 2px;
  margin: 0 6px 30px;
  background: var(--line);
}

.tl-mark {
  position: absolute;
  top: 50%;
  width: 12px;
  height: 12px;
  border: 2px solid #fff;
  transform: translate(-50%, -50%);
}

.tl-scale {
  position: relative;
  height: 16px;
  margin: 0 6px;
}

.tl-scale span {
  position: absolute;
  color: var(--muted);
  font-size: 10px;
  font-weight: 700;
  transform: translateX(-50%);
}

.tl-note {
  margin-top: 14px;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.5;
}

.ws-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin-bottom: 12px;
}

.ws-card {
  display: grid;
  gap: 4px;
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--bg);
  color: inherit;
  cursor: pointer;
  font: inherit;
  text-align: left;
  text-decoration: none;
}

.ws-card:hover {
  border-color: var(--accent);
}

.ws-sub {
  color: var(--muted);
  font-size: 13px;
}

.ws-state {
  margin-top: 6px;
  font-size: 12px;
  font-weight: 800;
}

.ws-state.filled {
  color: var(--accent);
}

.ws-state.empty {
  color: var(--muted);
}

.ws-create {
  display: flex;
  width: 100%;
  align-items: center;
  justify-content: center;
  padding: 13px;
  border: 1px dashed var(--line);
  border-radius: 10px;
  background: var(--panel);
  color: var(--pink);
  cursor: pointer;
  font: inherit;
  font-weight: 800;
}

.plan-progress {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 14px;
}

.plan-bar {
  overflow: hidden;
  flex: 1;
  height: 8px;
  border-radius: 999px;
  background: var(--line);
}

.plan-bar i {
  display: block;
  height: 100%;
  border-radius: 999px;
  background: var(--accent);
  transition: width 200ms ease;
}

.plan-count {
  color: var(--muted);
  font-size: 13px;
  font-weight: 800;
  white-space: nowrap;
}

.plan-grp {
  margin: 14px 0 0;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  overflow: hidden;
}

.plan-grp-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 12px 14px;
  color: var(--muted);
  cursor: pointer;
  list-style: none;
}

.plan-grp-head::-webkit-details-marker {
  display: none;
}

.plan-grp-head::before {
  content: "▸";
  width: 14px;
  flex: 0 0 14px;
  color: var(--accent);
  font-size: 13px;
  font-weight: 900;
  transition: transform 160ms ease;
}

.plan-grp[open] .plan-grp-head::before {
  transform: rotate(90deg);
}

.plan-grp-title {
  flex: 1;
  color: var(--ink);
  font-size: 15px;
  font-weight: 800;
}

.plan-grp-meta {
  flex: 0 0 auto;
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
}

.plan-list {
  display: grid;
  gap: 7px;
  margin: 0;
  padding: 0 12px 12px;
  list-style: none;
}

.plan-item {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  padding: 9px 11px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface);
  cursor: pointer;
}

.plan-item.plan-depth-1 {
  margin-left: 18px;
}

.plan-item.plan-depth-2,
.plan-item.plan-depth-3 {
  margin-left: 34px;
}

.pbox {
  display: inline-grid;
  width: 18px;
  height: 18px;
  flex: 0 0 18px;
  place-items: center;
  border: 1px solid var(--line);
  border-radius: 4px;
  color: var(--accent);
  font-size: 12px;
  font-weight: 900;
}

.pbox.on {
  border-color: var(--accent);
  background: var(--accent-soft);
}

.plan-item.done .p-txt {
  color: var(--muted);
  text-decoration: line-through;
}

.plan-item-meta {
  display: block;
  margin-top: 4px;
  color: var(--muted);
  font-size: 11px;
  font-weight: 750;
  line-height: 1.35;
  text-decoration: none;
}

.drive-idea-tag {
  padding: 2px 8px;
  border-radius: 999px;
  background: var(--warning-soft);
  color: var(--warning);
  font-size: 10px;
  font-weight: 800;
  text-transform: uppercase;
}

.drive-files {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.drive-files a {
  display: grid;
  gap: 3px;
  padding: 11px;
  border: 1px solid var(--line);
  border-radius: 8px;
  color: inherit;
  text-decoration: none;
}

.drive-files span {
  color: var(--muted);
  font-size: 12px;
}

.backdrop {
  position: fixed;
  inset: 0;
  z-index: 30;
  background: rgba(20, 26, 24, 0.4);
  opacity: 0;
  pointer-events: none;
  transition: opacity 160ms ease;
}

.backdrop.open {
  opacity: 1;
  pointer-events: auto;
}

.modal {
  position: fixed;
  top: 50%;
  left: 50%;
  z-index: 31;
  width: min(600px, 94vw);
  max-height: 88vh;
  overflow-y: auto;
  border-radius: 14px;
  background: var(--panel);
  box-shadow: 0 24px 60px rgba(20, 26, 24, 0.24);
  opacity: 0;
  pointer-events: none;
  transform: translate(-50%, -48%);
  transition: opacity 160ms ease, transform 160ms ease;
}

.modal.open {
  opacity: 1;
  pointer-events: auto;
  transform: translate(-50%, -50%);
}

.work-create-modal {
  width: min(720px, 94vw);
}

body.launch-create-modal-standard-pilot .work-create-modal {
  width: min(820px, 94vw);
  max-height: min(820px, 92vh);
  overflow-x: hidden;
}

body.launch-create-modal-standard-pilot .work-create-modal .modal-head {
  padding-block: 12px;
}

body.launch-create-modal-standard-pilot .work-create-modal .modal-body {
  padding-block: 12px;
}

body.launch-create-modal-standard-pilot .work-create-modal .step {
  margin-bottom: 12px;
}

body.launch-create-modal-standard-pilot .work-create-modal .step-help {
  max-width: none;
  margin-bottom: 5px;
  line-height: 1.35;
}

body.launch-create-modal-standard-pilot .work-create-modal .transcript:empty,
body.launch-create-modal-standard-pilot .work-create-modal .workbench-voice-status:empty {
  display: none !important;
}

body.launch-create-modal-standard-pilot .work-create-modal .work-brief-text {
  min-height: 78px;
  margin-top: 0;
}

body.launch-create-modal-standard-pilot #ctxStep {
  display: none;
}

body.launch-create-modal-standard-pilot #dashboardContextSearch {
  height: 42px;
}

body.launch-create-modal-standard-pilot #fileStep {
  grid-template-columns: 150px minmax(0, 1fr);
  align-items: center;
  gap: 10px;
}

body.launch-create-modal-standard-pilot #fileStep h3 {
  font-size: 13px;
}

body.launch-create-modal-standard-pilot #fileStep .work-file-list {
  grid-column: 1 / -1;
  width: 100%;
  margin-top: 0;
}

body.launch-create-modal-standard-pilot #modelStep .ai-thinking-picker,
body.launch-create-modal-standard-pilot #modelStep > .model-note {
  display: none;
}

body.launch-create-modal-standard-pilot #modelStep .step-label {
  margin-bottom: 6px;
}

body.launch-create-modal-standard-pilot .context-preview-step {
  margin-bottom: 0;
}

body.launch-create-modal-standard-pilot .context-preview-step > .step-label {
  margin-bottom: 5px;
  font-size: 13px;
}

body.launch-create-modal-standard-pilot .context-preview-panel {
  max-height: 280px;
  overflow: auto;
  margin-bottom: 0;
  padding: 8px;
}

.launch-source-panel.workshop-agent-context-menu {
  height: auto;
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  overflow: visible;
}

body.launch-create-modal-standard-pilot .launch-source-panel.workshop-agent-context-menu {
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
}

.launch-source-panel .workbench-context-results {
  z-index: 80;
}

.launch-source-panel .workbench-context-selected {
  max-height: none;
  overflow: visible;
}

body.launch-create-modal-standard-pilot #modelStep .agentic-model-trigger {
  display: block;
  position: relative;
  width: 100%;
  max-width: none;
  height: auto;
}

body.launch-create-modal-standard-pilot #modelStep .agentic-model-trigger .ai-model-selector > summary {
  min-height: 52px;
  padding: 9px 14px;
}

body.launch-create-modal-standard-pilot #modelStep .agentic-model-trigger .ai-model-selector > summary span {
  display: block;
}

body.launch-create-modal-standard-pilot #modelStep .agentic-model-trigger .ai-model-menu {
  position: absolute;
  top: calc(100% + 6px);
  right: 0;
  bottom: auto;
  left: 0;
  width: 100%;
  height: auto;
  max-height: min(520px, 62vh);
  border-radius: 10px;
  box-shadow: 0 18px 44px rgba(20, 26, 24, 0.18);
  overflow: auto;
  z-index: 90;
}

body.launch-create-modal-standard-pilot .launch-source-panel .agentic-source-item[data-agentic-source-kind="file"] {
  grid-template-columns: 1fr;
}

body.launch-create-modal-standard-pilot #fileStep.agentic-source-item {
  grid-template-columns: 1fr;
}

body.launch-create-modal-standard-pilot .launch-source-panel .work-file-drop {
  width: 100%;
}

body.launch-create-modal-standard-pilot .launch-source-panel .work-file-list {
  grid-column: auto;
  width: 100%;
  margin-top: 0;
}

body.launch-create-modal-standard-pilot .launch-source-panel .work-file-list > p {
  width: 100%;
  margin-top: 2px;
}

body.launch-create-modal-standard-pilot .dashboard-product-context-remove:disabled {
  width: 28px;
  opacity: 0.8;
  background: transparent;
  font-size: 12px;
}

body.launch-create-modal-standard-pilot .dashboard-product-context-remove:disabled svg {
  width: 14px;
  height: 14px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
}

body.launch-create-modal-standard-pilot .context-preview-panel,
body.launch-create-modal-standard-pilot .context-preview-sources {
  max-height: none;
  overflow: visible;
}

body.launch-create-modal-standard-pilot #genBtn:disabled {
  border-color: var(--line);
  background: #ecefeb;
  color: #8a918d;
  cursor: not-allowed;
  opacity: 1;
}

body.launch-create-modal-standard-pilot .work-create-modal .modal-foot {
  position: sticky;
  bottom: 0;
  z-index: 95;
  background: var(--panel);
}

body.launch-create-modal-standard-pilot .work-create-modal .modal-foot .note {
  display: none;
}

body.launch-create-modal-standard-pilot #genBtn.modal-primary-action {
  min-height: 46px;
  padding-inline: 22px;
  font-size: 14px;
  font-weight: 850;
}

.launch-generation-divider {
  height: 1px;
  margin: 18px -22px;
  background: var(--line);
}

.launch-generation-section { display: grid; gap: 10px; }
.launch-generation-section #refreshContextPreview,
.launch-generation-section #genBtn { justify-self: start; }

.modal-head,
.modal-foot {
  padding: 18px 22px;
  border-bottom: 1px solid var(--line);
}

.modal-head {
  display: grid;
  justify-items: center;
  gap: 6px;
  text-align: center;
}

.modal-eyebrow {
  color: var(--text);
  font-size: 13px;
  font-weight: 850;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.modal-head h2 {
  margin: 0;
  font-size: 28px;
  line-height: 1.15;
}

.modal-head p {
  max-width: 520px;
  margin: 2px 0 0;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.45;
}

.modal-body {
  padding: 18px 22px;
}

.step {
  margin-bottom: 20px;
}

.step-label {
  display: flex;
  align-items: center;
  gap: 9px;
  margin-bottom: 10px;
  color: var(--text);
  font-size: 16px;
  font-weight: 800;
  letter-spacing: 0;
  text-transform: none;
}

.step-help {
  max-width: 620px;
  margin: -2px 0 12px;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.5;
}

.step-num {
  display: inline-grid;
  width: 22px;
  height: 22px;
  place-items: center;
  border-radius: 50%;
  background: var(--accent);
  color: #fff;
}

.type-choice {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.type-choice button {
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: #fff;
  cursor: pointer;
  font: inherit;
  font-weight: 800;
  text-align: left;
}

.type-choice span {
  display: block;
  margin-top: 3px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 600;
}

.rec {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 15px;
  border: 1px dashed var(--line);
  border-radius: 10px;
  background: var(--bg);
}

.rec-btn {
  display: grid;
  width: 44px;
  height: 44px;
  flex: 0 0 44px;
  place-items: center;
  border: 0;
  border-radius: 50%;
  background: var(--pink);
  color: #fff;
  cursor: pointer;
  font-size: 19px;
}

.rec-txt strong,
.rec-txt span {
  display: block;
}

.rec-txt span {
  color: var(--muted);
  font-size: 12px;
}

.transcript {
  margin-top: 10px;
  padding: 11px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  font-size: 13px;
  line-height: 1.5;
}

.transcript.empty {
  color: var(--muted);
  font-style: italic;
}

.work-brief-text {
  width: 100%;
  min-height: 110px;
  margin-top: 10px;
  padding: 11px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  color: var(--text);
  font: inherit;
  font-size: 13px;
  line-height: 1.5;
  resize: vertical;
}

.work-file-drop {
  display: grid;
  gap: 4px;
  padding: 14px;
  border: 1px dashed var(--line);
  border-radius: 8px;
  background: #fff;
  cursor: pointer;
}

.work-context-substeps {
  display: grid;
  gap: 14px;
}

.work-context-substep {
  display: grid;
  gap: 8px;
}

.work-context-substep h3 {
  margin: 0;
  color: var(--text);
  font-size: 16px;
  font-weight: 850;
  line-height: 1.25;
}

.work-context-step.is-preloaded-only {
  margin-top: -2px;
  margin-bottom: 18px;
}

.work-context-step.is-preloaded-only > .step-label {
  display: none;
}

.work-file-drop input {
  max-width: 100%;
}

.work-file-drop strong {
  color: var(--text);
  font-size: 13px;
}

.work-file-drop span {
  color: var(--muted);
  font-size: 12px;
}

.work-file-list {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  margin-top: 8px;
}

.work-file-list span,
.work-file-list p,
.work-option-separator {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
}

.work-file-list span {
  padding: 5px 8px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: #fff;
}

.work-file-list small {
  color: var(--muted);
}

.work-file-list .work-file-chip {
  align-items: flex-start;
  flex-direction: column;
  gap: 2px;
  border-radius: 8px;
  line-height: 1.25;
}

.context-preview-step {
  margin-top: -2px;
}

.context-preview-panel {
  display: grid;
  gap: 10px;
  margin-bottom: 9px;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
}

.context-preview-panel.is-stale {
  border-color: color-mix(in srgb, var(--accent) 45%, var(--line));
}

.context-preview-summary {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.context-preview-summary span {
  display: grid;
  gap: 2px;
  min-width: 0;
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface-soft);
}

.context-preview-summary strong {
  color: var(--text);
  font-size: 14px;
  line-height: 1.2;
}

.context-preview-summary small,
.context-preview-sources small {
  color: var(--muted);
  font-size: 11px;
  line-height: 1.25;
}

.context-preview-warning {
  margin: 0;
  color: #8a5a16;
  font-size: 12px;
  font-weight: 750;
  line-height: 1.35;
}

.context-budget-bar {
  overflow: hidden;
  height: 7px;
  border-radius: 999px;
  background: var(--surface-soft);
}

.context-budget-bar span {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: #3f7d5d;
}

.context-budget-bar[data-budget-status="near"] span {
  background: #b7791f;
}

.context-budget-bar[data-budget-status="over"] span {
  background: #b3453d;
}

.context-budget-note {
  margin: -3px 0 0;
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
  line-height: 1.35;
}

.context-preview-sources {
  display: grid;
  gap: 6px;
  max-height: 220px;
  overflow: auto;
  padding-right: 2px;
}

.context-preview-sources article.context-preview-source-child {
  margin-left: 20px;
}

.model-note {
  margin: 7px 0 0;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.45;
}

.ai-thinking-picker {
  margin-top: 12px;
}

.work-option-separator {
  padding: 4px 1px 1px;
  font-weight: 800;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.work-auto-context {
  display: grid;
  gap: 8px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  font-size: 13px;
}

.work-auto-context strong {
  color: var(--text);
}

.work-auto-context p,
.work-auto-context ul {
  margin: 0;
  color: var(--muted);
}

.work-auto-context ul {
  padding-left: 18px;
}

.opt-list {
  display: grid;
  gap: 7px;
}

.opt-list label {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 9px 11px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  cursor: pointer;
  font-size: 13px;
}

.opt-list input {
  width: 16px;
  height: 16px;
  accent-color: var(--accent);
}

.opt-list .workbench-context-picker label {
  display: grid;
  gap: 6px;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  cursor: default;
}

.opt-list .workbench-context-picker input {
  width: 100%;
  height: auto;
  min-height: 36px;
  padding: 8px 10px;
  accent-color: auto;
}

.o-tag,
.o-meta {
  margin-left: auto;
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
}

.o-tag.type {
  color: var(--blue);
}

.o-tag.partiel {
  color: var(--warning);
}

.modal-foot {
  display: flex;
  align-items: center;
  gap: 10px;
  border-top: 1px solid var(--line);
  border-bottom: 0;
}

.modal-foot .note {
  margin-right: auto;
  color: var(--warning);
  font-size: 12px;
  font-weight: 700;
}

/* Zone de travail — modal de génération */
#genBrief {
  width: 100%;
  padding: 9px 11px;
  border: 1px solid var(--line);
  border-radius: 8px;
  font-size: 13px;
  resize: vertical;
  min-height: 64px;
  box-sizing: border-box;
  font-family: inherit;
}

.gen-doc-search {
  width: 100%;
  padding: 7px 11px;
  border: 1px solid var(--line);
  border-radius: 8px;
  font-size: 13px;
  margin-bottom: 8px;
  box-sizing: border-box;
}

.gen-doc-list {
  display: grid;
  gap: 6px;
  max-height: 220px;
  overflow-y: auto;
}

.gen-selected-docs {
  margin: 8px 0;
}

.gen-doc-option {
  width: 100%;
  text-align: left;
}

.gen-selected-doc {
  max-width: 100%;
}

.gen-doc-item {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 11px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  cursor: pointer;
  font-size: 13px;
}

.gen-doc-item.preselected {
  border-color: var(--accent);
  background: color-mix(in srgb, var(--accent) 6%, #fff);
}

.gen-doc-label {
  flex: 1;
  line-height: 1.3;
}

.opt-empty {
  color: var(--text-muted, #888);
  font-size: 13px;
  padding: 8px 0;
}

.step-count {
  margin-left: 8px;
  font-size: 11px;
  font-weight: 600;
  color: var(--accent);
  background: color-mix(in srgb, var(--accent) 12%, transparent);
  padding: 2px 7px;
  border-radius: 99px;
}

.work-page {
  max-width: 860px;
}

.work-header:not(.module-header) {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 18px;
  align-items: end;
  margin-bottom: 16px;
  padding-bottom: 16px;
  border-bottom: 1px solid var(--line);
}

.eyebrow {
  margin: 0 0 6px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.work-actions,
.toolbar-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: flex-end;
}

.type-switch {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  margin-bottom: 22px;
}

.type-switch a {
  padding: 8px 13px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--panel);
  color: var(--muted);
  font-size: 13px;
  font-weight: 800;
  text-decoration: none;
}

.type-switch a:hover {
  border-color: var(--accent);
  color: var(--text);
}

.type-switch a.active {
  border-color: var(--accent);
  background: var(--accent-soft);
  color: var(--accent);
}

.work-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 300px;
  gap: 18px;
  align-items: start;
}

.work-toolbar {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 14px;
}

.filters {
  display: inline-flex;
  overflow: hidden;
  gap: 3px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel);
}

.filters button {
  padding: 7px 12px;
  border: 0;
  background: transparent;
  color: var(--muted);
  cursor: pointer;
  font: inherit;
  font-size: 13px;
  font-weight: 800;
}

.filters button:hover {
  color: var(--text);
}

.filters button.active {
  background: var(--accent-soft);
  color: var(--accent);
}

.module-toolbar.work-toolbar {
  margin-bottom: 18px;
}

.module-toolbar .filters {
  border: 0;
  background: transparent;
}

.module-toolbar .filters button {
  border: 1px solid var(--line);
  border-radius: 999px;
  background: #fff;
}

.pieces {
  display: grid;
  gap: 10px;
}

.piece {
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--panel);
}

.piece-head {
  display: grid;
  width: 100%;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  padding: 13px 15px;
  border: 0;
  background: transparent;
  color: inherit;
  cursor: pointer;
  font: inherit;
  text-align: left;
}

.piece-head:hover {
  background: #fbfbf9;
}

.piece-meta {
  display: flex;
  min-width: 0;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}

.status-pill.archive {
  background: #f0eeea;
  color: var(--muted);
}

.status-pill.valide {
  background: var(--accent-soft);
  color: var(--accent);
}

.status-pill.draft {
  background: var(--pink-soft);
  color: var(--pink);
}

.status-pill.linked {
  background: var(--accent-soft);
  color: var(--accent);
}

.piece-meta .status-pill {
  margin-top: 0;
}

.chip {
  padding: 3px 8px;
  border-radius: 999px;
  background: var(--blue-soft);
  color: var(--blue);
  font-size: 11px;
  font-weight: 800;
  white-space: nowrap;
}

.piece-title {
  overflow: hidden;
  font-size: 15px;
  font-weight: 800;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.piece-toggle {
  color: var(--muted);
  font-size: 13px;
  font-weight: 800;
}

.piece-body {
  padding: 0 15px 15px;
  border-top: 1px solid var(--line);
}

.piece-preview {
  padding-top: 13px;
  color: var(--text);
  font-size: 14px;
  line-height: 1.55;
}

.piece-preview .subj {
  margin-bottom: 4px;
  font-weight: 800;
}

.piece-preview .pre {
  margin-bottom: 10px;
  color: var(--muted);
  font-size: 13px;
}

.piece-summary {
  display: grid;
  gap: 7px;
  margin: 0 0 13px;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fbfbf9;
}

.piece-summary div {
  display: grid;
  grid-template-columns: 92px minmax(0, 1fr);
  gap: 8px;
}

.piece-summary dt {
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
}

.piece-summary dd {
  min-width: 0;
  margin: 0;
  color: var(--text);
  font-size: 13px;
  font-weight: 650;
}

.piece-editor {
  width: 100%;
  min-height: 220px;
  margin-top: 13px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  color: var(--text);
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 13px;
  line-height: 1.55;
}

.piece-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 12px;
}

.central-sequence {
  border-color: color-mix(in srgb, var(--accent) 32%, var(--line));
  background: #fffdfa;
}

.sequence-head {
  cursor: default;
}

.sequence-head:hover {
  background: transparent;
}

.sequence-summary {
  padding-top: 13px;
}

.sequence-summary .pre {
  margin-bottom: 10px;
  color: var(--muted);
  font-size: 13px;
}

.sequence-email-list {
  display: grid;
  gap: 6px;
}

.sequence-email-list a {
  display: grid;
  grid-template-columns: 72px minmax(0, 1fr);
  gap: 10px;
  align-items: center;
  padding: 8px 10px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: #fff;
  color: inherit;
  text-decoration: none;
}

.sequence-email-list a:hover {
  border-color: var(--accent);
}

.sequence-email-list span {
  color: var(--accent);
  font-size: 12px;
  font-weight: 850;
}

.sequence-email-list strong {
  overflow: hidden;
  font-size: 13px;
  font-weight: 750;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.mini-btn {
  min-height: 32px;
  padding: 6px 11px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: #fff;
  color: var(--text);
  cursor: pointer;
  font: inherit;
  font-size: 13px;
  font-weight: 800;
}

.mini-btn:hover {
  border-color: var(--accent);
}

.mini-btn.accent {
  border-color: var(--accent);
  background: var(--accent);
  color: #fff;
}

.mini-btn.blue {
  border-color: var(--blue);
  color: var(--blue);
}

.mini-btn.blue:hover {
  background: var(--blue-soft);
}

.empty-state {
  padding: 30px 18px;
  border: 1px dashed var(--line);
  border-radius: 10px;
  background: var(--panel);
  color: var(--muted);
  text-align: center;
}

.empty-state strong {
  display: block;
  margin-bottom: 6px;
  color: var(--text);
}

.rail {
  position: sticky;
  top: 20px;
  padding: 18px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--panel);
}

.rail h2 {
  margin: 0 0 4px;
  font-size: 15px;
}

.rail-lead,
.rail-hint {
  color: var(--muted);
  font-size: 12px;
  line-height: 1.5;
}

.rail-lead {
  margin: 0 0 14px;
}

.rail-hint {
  margin: 12px 0 0;
}

.rail-group {
  margin-bottom: 14px;
}

.rail-group-title {
  margin-bottom: 8px;
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.ctx-doc {
  display: grid;
  width: 100%;
  grid-template-columns: 1fr auto;
  gap: 3px 8px;
  align-items: center;
  margin-bottom: 7px;
  padding: 9px 11px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  color: inherit;
  cursor: pointer;
  font: inherit;
  text-align: left;
  text-decoration: none;
}

.ctx-doc:hover {
  border-color: var(--accent);
}

.ctx-doc strong {
  font-size: 13px;
}

.state {
  justify-self: end;
  padding: 2px 7px;
  border-radius: 999px;
  font-size: 10px;
  font-weight: 800;
  text-transform: uppercase;
}

.state.vide {
  background: #f0eeea;
  color: var(--muted);
}

.state.partiel {
  background: var(--warning-soft);
  color: var(--warning);
}

.state.type {
  background: var(--blue-soft);
  color: var(--blue);
}

.ref-item {
  margin-bottom: 7px;
  padding: 8px 11px;
  border: 1px solid var(--line);
  border-radius: 8px;
  font-size: 12px;
}

.ref-item .r-meta {
  color: var(--muted);
}

.rail-gen {
  width: 100%;
}

.work-fusion-card {
  padding: 22px 24px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: var(--panel);
}

.work-zone-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 4px;
}

.work-zone-head h2 {
  margin: 0;
  font-size: 19px;
  font-weight: 650;
}

.work-zone-head p {
  margin: 4px 0 0;
  color: var(--muted);
  font-size: 12.5px;
  line-height: 1.45;
}

.work-product-chip {
  max-width: 260px;
  padding: 5px 11px;
  border-radius: 999px;
  background: var(--accent-soft);
  color: var(--accent);
  font-size: 12px;
  font-weight: 800;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.work-progress-wrap {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 16px 0 22px;
}

.work-progress-bar {
  flex: 1;
  height: 8px;
  border-radius: 999px;
  background: #ecece7;
  overflow: hidden;
}

.work-progress-bar > i {
  display: block;
  height: 100%;
  border-radius: 999px;
  background: var(--accent);
}

.work-progress-wrap span {
  color: var(--muted);
  font-size: 13px;
  font-weight: 750;
  white-space: nowrap;
}

.work-chantiers {
  display: grid;
  gap: 10px;
}

.work-step-block {
  display: grid;
  gap: 10px;
  margin-top: 20px;
}

.work-step-block:first-of-type {
  margin-top: 12px;
}

.work-step-heading {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
}

.work-step-heading h3 {
  margin: 0;
  font-size: 19px;
  font-weight: 760;
  line-height: 1.2;
}

.work-step-heading p {
  margin: 4px 0 0;
  color: var(--muted);
  font-size: 14px;
  line-height: 1.45;
}

.work-stage {
  display: grid;
  gap: 12px;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: #fcfcfb;
}

.work-stage.is-complete {
  border-color: #d7dfd9;
  background: #fcfcfb;
}

.work-stage.is-locked,
.work-chantier.is-locked {
  background: #f2f2ef;
  color: var(--muted);
  opacity: 0.72;
}

.work-chantier.is-locked .work-chantier-body {
  display: none;
}

.work-focus-panel.is-locked .work-chantier-body {
  display: block;
}

.work-stage-head {
  display: flex;
  align-items: center;
  gap: 12px;
}

.work-stage-body {
  display: grid;
  gap: 10px;
  padding-left: 58px;
}

.work-stage-body.no-indent {
  padding-left: 0;
}

.work-stage-chantiers {
  padding-left: 0;
}

.work-step-badge {
  display: inline-flex;
  align-items: center;
  min-height: 22px;
  padding: 3px 8px;
  border-radius: 999px;
  background: #eef0ec;
  color: var(--muted);
  font-size: 10.5px;
  font-weight: 900;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  white-space: nowrap;
}

.work-anchor-switch {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  margin-bottom: 18px;
}

.work-anchor-switch a {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 36px;
  padding: 7px 12px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--panel);
  color: var(--muted);
  font-size: 13px;
  font-weight: 650;
  text-decoration: none;
}

.work-anchor-switch a:hover {
  border-color: #c4cbc7;
  color: var(--text);
}

.work-anchor-switch a.is-locked {
  border-color: #e0ded7;
  background: #f4f3ef;
  color: #9b968d;
}

.work-anchor-switch a.is-locked:hover {
  border-color: #d4d0c8;
  color: #777168;
}

.work-anchor-switch a.active {
  border-color: var(--accent);
  background: var(--accent);
  color: #fff;
}

.work-anchor-switch a span {
  padding: 1px 7px;
  border-radius: 999px;
  background: #edede9;
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
}

.work-anchor-switch a.active span {
  background: rgba(255, 255, 255, 0.22);
  color: #fff;
}

.work-chantier {
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 11px;
  background: #fcfcfb;
}

.work-focus-panel {
  border: 0;
  border-radius: 0;
  background: transparent;
}

.work-chantier[open] {
  border-color: #c9d6d2;
  background: var(--panel);
}

.work-chantier-head {
  display: flex;
  align-items: center;
  gap: 13px;
  padding: 14px 15px;
  list-style: none;
  cursor: pointer;
}

.work-focus-panel .work-chantier-head {
  padding: 0 0 14px;
  cursor: default;
}

.work-chantier-head::-webkit-details-marker {
  display: none;
}

.work-ico {
  width: 36px;
  height: 36px;
  flex: 0 0 36px;
  display: grid;
  place-items: center;
  border-radius: 9px;
  background: var(--accent-soft);
  color: var(--accent);
}

.work-ico svg {
  width: 18px;
  height: 18px;
}

.work-chantier-main {
  min-width: 0;
  flex: 1;
}

.work-chantier-main strong {
  display: block;
  font-size: 15px;
  font-weight: 700;
  line-height: 1.2;
}

.work-chantier-main small {
  display: block;
  margin-top: 4px;
  color: var(--muted);
  font-size: 13px;
  font-weight: 600;
  line-height: 1.35;
}

.work-status {
  padding: 3px 9px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 800;
  white-space: nowrap;
}

.work-status.todo {
  background: #fde8e8;
  color: #b42318;
}

.work-status.wip {
  background: #fff1d6;
  color: #b45309;
}

.work-status.ready {
  background: #e5f6ed;
  color: #087443;
}

.work-status.locked {
  background: #e7e5df;
  color: #7b7469;
}

.work-count {
  min-width: 42px;
  color: var(--muted);
  font-size: 12.5px;
  font-weight: 800;
  text-align: right;
  white-space: nowrap;
}

.work-chev {
  color: var(--muted);
  font-size: 16px;
  transition: transform 0.15s ease;
}

.work-focus-progress {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 18px;
}

.work-focus-progress .work-progress-bar {
  max-width: 150px;
  height: 6px;
}

.work-focus-progress > span:last-child {
  color: var(--muted);
  font-size: 12px;
  font-weight: 650;
  white-space: nowrap;
}

.work-chantier[open] .work-chev {
  transform: rotate(90deg);
}

.work-chantier-body {
  padding: 4px 15px 18px 64px;
}

.work-focus-panel .work-chantier-body {
  padding: 0;
}

.work-body-label {
  margin: 12px 0 7px;
  color: var(--muted);
  font-size: 10.5px;
  font-weight: 800;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

.work-body-label span {
  color: var(--muted);
  font-weight: 500;
  letter-spacing: 0;
  text-transform: none;
}

.work-archives {
  margin-top: 22px;
  border-top: 1px solid rgba(100, 116, 139, 0.16);
  color: #8a919c;
}

.work-archives-global {
  margin-top: 28px;
}

.work-doc-archives-global {
  margin-top: 24px;
}

.work-doc-archives-global > summary {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: 13.5px;
}

.work-doc-archives-global > summary svg {
  width: 1em;
  height: 1em;
  flex: 0 0 auto;
}

.work-archives summary {
  width: fit-content;
  padding: 12px 2px 0;
  cursor: pointer;
  font-size: 0.78rem;
  list-style: none;
}

.work-archives summary::-webkit-details-marker { display: none; }
.work-archives summary span { margin-left: 4px; opacity: 0.72; }

.work-archive-list {
  display: grid;
  gap: 6px;
  padding-top: 9px;
}

.work-archive-list a {
  display: flex;
  justify-content: space-between;
  gap: 14px;
  padding: 8px 10px;
  border-radius: 8px;
  color: #69717d;
  background: rgba(100, 116, 139, 0.05);
  text-decoration: none;
}

.work-archive-list a:hover { background: rgba(100, 116, 139, 0.1); }
.work-archive-list small { color: #949ba5; white-space: nowrap; }

.work-plan-backlink {
  display: inline-flex;
  margin-bottom: 10px;
  color: var(--accent);
  font-size: 12.5px;
  font-weight: 800;
  text-decoration: none;
}

.work-doc-grid {
  display: grid;
  gap: 8px;
}

.work-doc-card {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 10px;
  min-height: 54px;
  width: 100%;
  padding: 12px 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  color: inherit;
  text-align: left;
  text-decoration: none;
}

.work-doc-card div {
  flex: 1;
  min-width: 0;
}

.work-doc-card strong {
  display: block;
  overflow: hidden;
  color: var(--text);
  font-size: 13.5px;
  font-weight: 650;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.work-doc-card span {
  display: block;
  margin-top: 2px;
  overflow: hidden;
  color: var(--muted);
  font-size: 12px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.work-doc-card .work-status {
  display: inline-flex;
  flex: 0 0 auto;
  margin-top: 0;
  overflow: visible;
  font-size: 11px;
  text-overflow: clip;
}

.work-doc-card-active,
.work-plan-open {
  justify-content: space-between;
}

.work-doc-card-active strong,
.work-plan-open strong {
  font-size: 15px;
  font-weight: 750;
}

.work-doc-history {
  margin-top: 8px;
}

.work-doc-history > summary {
  cursor: pointer;
  color: var(--muted);
  font-size: 12.5px;
  font-weight: 750;
  list-style: none;
}

.work-doc-history > summary::-webkit-details-marker {
  display: none;
}

.work-doc-history .work-doc-grid {
  margin-top: 8px;
}

.work-doc-card-archived {
  background: #f4f3ef;
}

.work-doc-card:hover {
  border-color: #c4cbc7;
  background: #fff;
}

.work-doc-details {
  display: block;
}

.work-doc-details summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  list-style: none;
  cursor: pointer;
}

.work-doc-details summary::-webkit-details-marker {
  display: none;
}

.work-doc-preview {
  margin-top: 10px;
  padding-top: 10px;
  border-top: 1px solid var(--line);
}

.work-doc-preview h3 {
  margin: 10px 0 5px;
  font-size: 13px;
}

.work-doc-preview p,
.work-doc-preview li {
  font-size: 12.5px;
}

.work-doc-files {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 10px;
}

.work-doc-files span {
  width: auto;
  margin: 0;
  padding: 4px 8px;
  border-radius: 999px;
  background: var(--accent-soft);
  color: var(--accent);
  font-size: 11px;
  font-weight: 750;
}

.work-doc-card.empty {
  width: 100%;
  justify-content: flex-start;
  border-style: dashed;
  cursor: pointer;
  font: inherit;
}

.work-doc-card.is-disabled,
.work-doc-card:disabled {
  cursor: not-allowed;
  opacity: 0.75;
}

.work-plan-generate {
  cursor: pointer;
  font: inherit;
  justify-content: flex-start;
}

.work-doc-card.empty.compact {
  min-height: 46px;
}

.work-validation-check {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 10px;
  align-items: start;
  padding: 11px 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  cursor: pointer;
}

.work-validation-check input {
  width: 18px;
  height: 18px;
  margin-top: 2px;
  accent-color: var(--accent);
}

.work-validation-check strong {
  display: block;
  font-size: 14px;
  font-weight: 750;
}

.work-validation-check small {
  display: block;
  margin-top: 2px;
  color: var(--muted);
  font-size: 12.5px;
  line-height: 1.35;
}

.work-validation-check.is-disabled {
  cursor: not-allowed;
  opacity: 0.7;
}

.work-doc-plus {
  width: auto;
  height: auto;
  flex: 0 0 auto;
  display: grid;
  place-items: center;
  color: var(--accent);
  font-size: 22px;
  font-weight: 800;
  line-height: 1;
}

.work-linked-preview {
  display: grid;
  gap: 5px;
  margin: -1px 0 5px 10px;
  padding-left: 10px;
  border-left: 2px solid var(--accent-soft);
}

.work-linked-preview a {
  display: grid;
  grid-template-columns: 52px minmax(0, 1fr);
  gap: 8px;
  align-items: center;
  color: inherit;
  font-size: 12px;
  text-decoration: none;
}

.work-linked-preview span {
  color: var(--accent);
  font-weight: 800;
}

.work-linked-preview strong {
  overflow: hidden;
  font-weight: 600;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.work-empty {
  padding: 10px 11px;
  border: 1px dashed var(--line);
  border-radius: 8px;
  background: #fbfbf9;
  color: var(--muted);
  font-size: 13px;
}

.work-empty.small {
  padding: 9px 11px;
}

.work-empty-state {
  display: grid;
  justify-items: center;
  padding: 28px 22px;
  border: 1px dashed var(--line);
  border-radius: 12px;
  background: #fcfcfb;
  text-align: center;
}

.work-empty-icon {
  width: 42px;
  height: 42px;
  display: grid;
  place-items: center;
  margin-bottom: 12px;
  border-radius: 11px;
  background: var(--accent-soft);
  color: var(--accent);
}

.work-empty-icon svg {
  width: 21px;
  height: 21px;
}

.work-empty-state strong {
  font-size: 15px;
  font-weight: 700;
}

.work-empty-state p {
  max-width: 360px;
  margin: 5px 0 16px;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.45;
}

.work-empty-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 9px;
  justify-content: center;
}

.work-gen-row {
  display: flex;
  flex-wrap: wrap;
  gap: 9px;
  margin: 12px 0 4px;
}

.work-gen,
.work-agent-mini {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  min-height: 34px;
  border-radius: 8px;
  cursor: pointer;
  font: inherit;
  font-size: 13px;
  font-weight: 650;
}

.work-gen {
  padding: 8px 15px;
  border: 0;
  background: var(--accent);
  color: #fff;
}

.work-agent-mini {
  padding: 8px 11px;
  border: 1px solid var(--line);
  background: var(--panel);
  color: var(--muted);
}

.work-agent-mini:hover {
  border-color: var(--accent);
  color: var(--accent);
}

.work-checks {
  display: grid;
  gap: 3px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.work-checks li {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 8px;
  min-width: 0;
  min-height: 30px;
  padding: 3px 7px;
  border: 1px solid transparent;
  border-radius: 6px;
  font-size: 14.5px;
  line-height: 1.25;
}

.work-checks-unified li:hover {
  border-color: var(--line);
  background: #fbfbf9;
}

.work-checks li.done {
  color: var(--muted);
}

.work-task-row.depth-1 {
  margin-left: 18px;
}

.work-task-row.depth-2 {
  margin-left: 36px;
}

.work-task-copy {
  min-width: 0;
  display: block;
}

.work-task-copy > span:first-child {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.work-task-meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 5px;
  margin-top: 0;
}

.work-owner-pill {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  min-height: 22px;
  max-width: 180px;
  width: fit-content;
  padding: 3px 8px;
  border-radius: 999px;
  background: #eaf2ff;
  color: #1d4f91;
  font-size: 11.5px;
  font-weight: 800;
  line-height: 1.25;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.work-owner-pill::before {
  content: "";
  width: 5px;
  height: 5px;
  border-radius: 999px;
  background: currentColor;
}

.work-owner-select {
  position: relative;
  max-width: 180px;
  padding-right: 20px;
  cursor: pointer;
}

.work-owner-select::after {
  content: "⌄";
  position: absolute;
  right: 8px;
  top: 50%;
  transform: translateY(-55%);
  color: currentColor;
  font-size: 12px;
  pointer-events: none;
}

.work-owner-select select {
  max-width: 150px;
  min-width: 0;
  width: 100%;
  border: 0;
  background: transparent;
  color: inherit;
  font: inherit;
  font-size: inherit;
  font-weight: inherit;
  line-height: inherit;
  outline: 0;
  appearance: none;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  cursor: pointer;
}

.work-owner-select:focus-within {
  box-shadow: 0 0 0 2px color-mix(in srgb, currentColor 18%, transparent);
}

.work-check {
  width: 16px;
  height: 16px;
  flex: 0 0 16px;
  margin-top: 2px;
  display: grid;
  place-items: center;
  border: 1.5px solid var(--line);
  border-radius: 5px;
  color: #fff;
  font-size: 10px;
  font-weight: 900;
}

button.work-check {
  padding: 0;
  cursor: pointer;
}

button.work-check:disabled {
  cursor: default;
}

.work-check.on {
  border-color: var(--accent);
  background: var(--accent);
}

.work-complete-mark {
  width: 24px;
  height: 24px;
  flex: 0 0 24px;
  display: inline-grid;
  place-items: center;
  border: 1px solid #b7dfc7;
  border-radius: 999px;
  background: #e5f6ed;
  color: #087443;
  font-size: 13px;
  font-weight: 950;
  line-height: 1;
}

.work-subsection {
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px dashed var(--line);
}

.work-review-grid {
  display: grid;
  gap: 10px;
}

.work-review-grid label {
  display: grid;
  gap: 6px;
}

.work-review-grid span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
}

.work-review-grid textarea {
  width: 100%;
  min-height: 78px;
  padding: 10px 11px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  color: var(--text);
  font: inherit;
  font-size: 13px;
  line-height: 1.45;
  resize: vertical;
}

.work-review-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.work-review-output {
  padding-top: 12px;
  border-top: 1px solid var(--line);
}

.work-review-output p,
.work-review-output li {
  line-height: 1.5;
}

.work-task-stack {
  margin-top: 26px;
}

.work-done-fold {
  margin-top: 12px;
}

.work-done-fold summary {
  width: fit-content;
  color: var(--muted);
  cursor: pointer;
  font-size: 12.5px;
  font-weight: 650;
  list-style: none;
}

.work-done-fold summary::-webkit-details-marker {
  display: none;
}

/* Fiche lancement — zone de travail lisible sans accordéons */
.work-step-block > .work-stage {
  display: grid;
}

.work-step-heading {
  grid-template-columns: minmax(0, 1fr) auto;
  border-bottom: 0;
  cursor: default;
}

.work-step-block.is-complete .work-stage {
  padding-top: 4px;
}

.work-step-chev,
.work-chev {
  display: none;
}

.work-chantier {
  overflow: visible;
  margin-bottom: 12px;
  border: 0;
  border-radius: 0;
  background: transparent;
}

.work-chantier-head {
  position: relative;
  grid-template-columns: 24px minmax(0, 1fr) 54px 34px 28px;
  min-height: 36px;
  padding: 4px 0 7px;
  cursor: default;
}

.work-chantier.is-locked .work-chantier-body {
  display: grid;
}

.work-chantier-body {
  padding: 0 0 4px;
}

.work-lot-add {
  position: static;
  grid-column: 5;
  grid-row: 1;
  align-self: center;
  width: 24px;
  height: 24px;
  line-height: 22px;
}

.work-complete-mark {
  grid-column: 4;
  justify-self: end;
  width: 20px;
  height: 20px;
  border-radius: 999px;
  background: var(--accent-soft);
  color: var(--accent);
  font-size: 10px;
  line-height: 20px;
  text-align: center;
}

.work-mini-progress {
  grid-column: 3;
}

.work-count {
  grid-column: 4;
}

.work-doc-card,
.work-plan-open {
  border-left: 3px solid #c3ad6a;
}

.work-doc-card-active.state-done,
.work-plan-open .work-status.ready {
  border-left-color: var(--accent);
}

.work-doc-card-active.state-draft,
.work-doc-card-active.state-in-progress,
.work-doc-card-active.state-review,
.work-doc-card-active.state-ready {
  border-left-color: #c3ad6a;
}

.work-doc-card small {
  display: block;
  margin-top: 2px;
  color: var(--muted);
  font-size: 11.5px;
  font-weight: 600;
}

.work-doc-missing {
  position: relative;
  width: 100%;
  min-height: 48px;
  border: 1px dashed #dfe3de;
  border-left: 3px dashed #dfe3de;
  background: #fcfcfb;
  color: #9aa39d;
  text-align: left;
  cursor: pointer;
}

.work-doc-missing:hover {
  border-color: #b7d7d1;
}

.work-doc-create-link {
  position: absolute;
  top: 12px;
  right: 11px;
  color: var(--accent);
  font-size: 11.5px;
  font-weight: 850;
}

.work-done-fold {
  margin-top: 4px;
}

.work-done-fold summary {
  padding: 6px 2px 6px 28px;
  color: #9aa39d;
  font-size: 11px;
  font-weight: 850;
}

.work-fold-chevron {
  display: inline-block;
  width: 15px;
  margin-left: -15px;
}

.work-done-fold[open] .work-fold-chevron {
  transform: rotate(180deg);
}

@media (max-width: 899px) {
  .work-chantier-head {
    grid-template-columns: 24px minmax(0, 1fr) 34px 28px;
  }

  .work-mini-progress {
    display: none;
  }

  .work-count,
  .work-complete-mark {
    grid-column: 3;
  }

  .work-lot-add {
    grid-column: 4;
  }

  .work-checks li,
  .work-checks .work-task-row {
    grid-template-columns: 16px minmax(0, 1fr);
  }

  .work-task-side {
    grid-column: 2;
    grid-template-columns: minmax(0, 1fr) auto;
    max-width: 280px;
  }
}

/* Zone de travail lancement — timeline compacte */
.work-fiche-shell {
  display: block;
}

.work-zone-dashboard {
  position: relative;
  margin: 6px 0 8px;
  padding: 4px 0 14px;
  border-bottom: 1px solid var(--line);
}

.work-zone-filters {
  position: absolute;
  right: 0;
  top: -40px;
  display: flex;
  gap: 6px;
}

.work-zone-filters button {
  min-height: 29px;
  padding: 5px 11px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: #fff;
  color: var(--muted);
  font: inherit;
  font-size: 11.5px;
  font-weight: 850;
  cursor: pointer;
}

.work-zone-filters button.on {
  border-color: #b7d7d1;
  background: var(--accent-soft);
  color: var(--accent);
}

.work-zone-dashboard .work-progress-bar {
  height: 6px;
  background: #eceee9;
}

.work-stats-line {
  margin-top: 8px;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.35;
}

.work-stats-line b {
  color: var(--text);
  font-weight: 850;
}

.work-stats-line .late {
  color: #9d3f33;
  font-weight: 850;
}

.work-stats-line .mine {
  color: var(--accent);
  font-weight: 850;
}

.work-step-block {
  position: relative;
  display: block;
  margin: 0;
  padding-left: 34px;
}

.work-step-block::before {
  content: "";
  position: absolute;
  left: 11px;
  top: 0;
  bottom: 0;
  width: 2px;
  background: #e6e8e3;
}

.work-step-block:last-child::before {
  bottom: auto;
  height: 26px;
}

.work-step-block > summary {
  list-style: none;
}

.work-step-block > summary::-webkit-details-marker {
  display: none;
}

.work-step-heading {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto 18px;
  gap: 10px;
  align-items: center;
  width: 100%;
  min-height: 54px;
  padding: 14px 0;
  border-bottom: 1px solid #eceee9;
  cursor: pointer;
}

.work-step-pip {
  position: absolute;
  left: -34px;
  top: 14px;
  z-index: 1;
  width: 24px;
  height: 24px;
  border: 2px solid #fff;
  border-radius: 999px;
  background: #cfd4cd;
  color: #fff;
  font-size: 11px;
  font-weight: 900;
  line-height: 20px;
  text-align: center;
}

.work-step-pip.done {
  background: var(--accent);
}

.work-step-pip.live {
  border-color: var(--accent);
  background: #fff;
  color: var(--accent);
}

.work-step-title {
  min-width: 0;
}

.work-step-badge {
  display: block;
  min-height: 0;
  padding: 0;
  border-radius: 0;
  background: transparent;
  color: #9aa39d;
  font-size: 10.5px;
  font-weight: 900;
  letter-spacing: 0.08em;
}

.work-step-heading h3 {
  margin-top: 2px;
  font-size: 14.5px;
  font-weight: 850;
  line-height: 1.25;
}

.work-step-block.is-complete .work-step-heading h3 {
  color: var(--muted);
  font-weight: 760;
}

.work-step-block.is-complete .work-step-heading {
  border-bottom-color: #dcebe2;
}

.work-step-block.is-complete .work-stage {
  padding-top: 8px;
}

.work-step-block.is-complete .work-doc-card-active,
.work-step-block.is-complete .work-plan-open {
  border-color: #cfe5d7;
  background: #f3faf5;
}

.work-step-block.is-complete .work-doc-card-active:hover,
.work-step-block.is-complete .work-plan-open:hover {
  border-color: #9fc9ad;
  background: #edf8f0;
}

.work-step-meta {
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
  white-space: nowrap;
}

.work-step-chev::before {
  color: #9aa39d;
  content: "⌄";
  font-size: 13px;
  font-weight: 900;
}

.work-step-block[open] .work-step-chev::before {
  content: "⌃";
}

.work-stage {
  display: none;
  gap: 0;
  padding: 4px 0 18px;
  border: 0;
  border-radius: 0;
  background: transparent;
}

.work-step-block[open] > .work-stage {
  display: grid;
}

.work-stage.is-locked,
.work-chantier.is-locked {
  background: transparent;
  opacity: 0.64;
}

.work-stage-body,
.work-stage-body.no-indent,
.work-stage-chantiers {
  padding-left: 0;
}

.work-chantiers {
  gap: 8px;
}

.work-chantier {
  position: relative;
  overflow: hidden;
  border: 1px solid #e6e8e3;
  border-radius: 9px;
  background: #fff;
}

.work-chantier[open] {
  border-color: var(--line);
  background: #fff;
}

.work-chantier-head {
  display: grid;
  grid-template-columns: 24px minmax(0, 1fr) 54px 42px 18px;
  gap: 9px;
  align-items: center;
  min-height: 46px;
  padding: 10px 46px 10px 11px;
}

.work-chantier[open] .work-chantier-head {
  border-bottom: 1px solid #eceee9;
}

.work-ico {
  width: 24px;
  height: 24px;
  border-radius: 7px;
}

.work-ico svg {
  width: 13px;
  height: 13px;
}

.work-chantier-main strong {
  font-size: 13.5px;
  font-weight: 850;
}

.work-mini-progress {
  width: 54px;
  height: 5px;
  overflow: hidden;
  border-radius: 999px;
  background: #eceee9;
}

.work-mini-progress i {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: var(--accent);
}

.work-count {
  min-width: 0;
  font-size: 12px;
}

.work-chev {
  transform: none;
}

.work-chev::before {
  content: "⌄";
}

.work-chantier[open] .work-chev {
  transform: none;
}

.work-chantier[open] .work-chev::before {
  content: "⌃";
}

.work-lot-add {
  position: absolute;
  top: 10px;
  right: 10px;
  width: 26px;
  height: 26px;
  padding: 0;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: #fff;
  color: var(--muted);
  font: inherit;
  font-size: 15px;
  font-weight: 800;
  line-height: 24px;
  text-align: center;
  cursor: pointer;
}

.work-lot-add:hover {
  border-color: var(--accent);
  color: var(--accent);
}

.work-chantier-body {
  display: grid;
  gap: 8px;
  padding: 2px 12px 8px;
}

.work-doc-grid {
  gap: 6px;
}

.work-doc-card {
  min-height: 42px;
  padding: 10px 130px 10px 12px;
  border-color: #e6e8e3;
  border-radius: 8px;
}

.work-doc-card-active,
.work-plan-open {
  position: relative;
  justify-content: flex-start;
}

.work-doc-card .work-status {
  position: absolute;
  top: 9px;
  right: 10px;
}

.work-doc-card strong,
.work-doc-card-active strong,
.work-plan-open strong {
  font-size: 13px;
  font-weight: 780;
}

.work-status {
  padding: 2px 8px;
  font-size: 10.5px;
  font-weight: 900;
}

.work-task-stack {
  margin-top: 4px;
}

.work-checks {
  gap: 0;
}

.work-checks li,
.work-checks .work-task-row {
  position: relative;
  display: grid;
  grid-template-columns: 16px minmax(0, 1fr) 190px;
  gap: 10px;
  min-height: 34px;
  padding: 8px 0;
  border: 0;
  border-bottom: 1px solid #f1f2ef;
  border-radius: 0;
  font-size: 13.5px;
}

.work-checks li:last-child,
.work-checks .work-task-row:last-child {
  border-bottom: 0;
}

.work-checks-unified li:hover {
  border-color: #f1f2ef;
  background: #fbfbfa;
}

.work-task-row.depth-1 {
  margin-left: 22px;
}

.work-task-row.depth-2 {
  margin-left: 44px;
}

.work-task-copy > span:first-child {
  white-space: normal;
}

.work-checks li.done .work-task-copy {
  color: #9aa39d;
  text-decoration: line-through;
  text-decoration-color: #d0d5cf;
}

.work-task-side {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 72px;
  gap: 8px;
  align-items: center;
  min-width: 0;
}

.work-owner-pill {
  max-width: 118px;
  min-height: 22px;
  padding: 0;
  border-radius: 0;
  background: transparent;
  color: var(--muted);
  font-size: 11.5px;
  font-weight: 800;
}

.work-owner-pill::before {
  display: none;
}

.work-owner-avatar {
  display: inline-grid;
  width: 19px;
  height: 19px;
  flex: 0 0 19px;
  place-items: center;
  border-radius: 999px;
  background: var(--blue-soft);
  color: var(--blue);
  font-size: 9.5px;
  font-weight: 900;
  line-height: 1;
}

.work-owner-avatar.p2 {
  background: var(--pink-soft);
  color: var(--pink);
}

.work-owner-avatar.p3 {
  background: var(--gold-soft);
  color: var(--gold);
}

.work-owner-avatar.p4 {
  background: var(--accent-soft);
  color: var(--accent);
}

.work-owner-avatar.p0 {
  background: #eceee9;
  color: var(--muted);
}

.work-owner-select {
  max-width: 118px;
  padding-right: 14px;
}

.work-owner-select::after {
  right: 0;
  font-size: 10px;
}

.work-owner-select select {
  max-width: 84px;
}

.work-task-date-wrap {
  position: relative;
  display: inline-flex;
  justify-content: flex-end;
  min-width: 0;
}

.work-task-date-popover {
  position: absolute;
  top: calc(100% + 6px);
  right: 0;
  z-index: 20;
  padding: 6px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel);
  box-shadow: 0 12px 28px rgba(32, 37, 34, 0.14);
}

.work-task-date-popover input {
  width: 134px;
  height: 30px;
  padding: 3px 7px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: #fff;
  color: var(--ink);
  font-size: 12px;
  font-weight: 750;
}

.work-task-date {
  display: block;
  max-width: 72px;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--muted);
  font-size: 11.5px;
  font-weight: 800;
  text-align: right;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
  cursor: pointer;
}

.work-task-date-wrap.late .work-task-date {
  color: #9d3f33;
  font-weight: 900;
}

.work-task-date-wrap.soon .work-task-date {
  color: var(--warning);
  font-weight: 900;
}

.work-check {
  margin-top: 0;
  background: #fff;
}

.work-complete-mark {
  width: 22px;
  height: 22px;
}

.calendar-summary {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  margin-bottom: 20px;
}

.calendar-summary article {
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel);
}

.calendar-summary span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
  text-transform: uppercase;
}

.calendar-summary strong {
  display: block;
  margin: 10px 0 6px;
  font-size: 28px;
}

.calendar-summary p {
  margin: 0;
  color: var(--muted);
  line-height: 1.45;
}

.calendar-board {
  padding: 18px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel);
}

.calendar-toolbar {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
  margin-bottom: 12px;
}

.calendar-controls {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.calendar-controls button {
  min-height: 36px;
  padding: 7px 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel);
  color: var(--text);
  font-weight: 800;
}

.calendar-source-filters {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0 0 12px;
}

.calendar-source-filter {
  display: inline-flex;
  min-height: 32px;
  align-items: center;
  gap: 8px;
  padding: 5px 10px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--panel);
  color: var(--muted);
  font: inherit;
  font-size: 12px;
  font-weight: 850;
  cursor: pointer;
}

.calendar-source-filter span {
  color: inherit;
  font-variant-numeric: tabular-nums;
  opacity: 0.72;
}

.calendar-source-filter.active {
  border-color: var(--text);
  background: var(--text);
  color: #fff;
}

.calendar-source-filter.source-lancements.active,
.calendar-event.source-lancements {
  border-color: var(--pink);
}

.calendar-source-filter.source-contenu.active,
.calendar-event.source-contenu {
  border-color: var(--blue);
}

.calendar-source-filter.source-projets.active,
.calendar-event.source-projets {
  border-color: var(--gold);
}

.calendar-weekdays,
.calendar-grid {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
}

.calendar-weekdays {
  border: 1px solid var(--line);
  border-bottom: 0;
  border-radius: 8px 8px 0 0;
  background: var(--bg);
}

.calendar-weekdays span {
  padding: 9px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 900;
  text-align: center;
  text-transform: uppercase;
}

.calendar-grid {
  overflow: hidden;
  margin-bottom: 18px;
  border: 1px solid var(--line);
  border-radius: 0 0 8px 8px;
}

.calendar-day {
  min-height: 116px;
  padding: 8px;
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  background: #fff;
}

.calendar-day:nth-child(7n) {
  border-right: 0;
}

.calendar-day:nth-last-child(-n + 7) {
  border-bottom: 0;
}

.calendar-day > strong {
  display: inline-flex;
  margin-bottom: 6px;
  color: var(--text);
  font-size: 13px;
}

.muted-day {
  background: #f2f3ef;
}

.muted-day > strong {
  color: #a3aaa6;
}

.day-events {
  display: grid;
  gap: 4px;
}

.day-event,
.more-events {
  overflow: hidden;
  padding: 4px 6px;
  border-radius: 6px;
  background: var(--accent-soft);
  color: var(--accent);
  font-size: 12px;
  font-weight: 800;
  line-height: 1.25;
}

.day-event.range-start {
  border-radius: 6px 2px 2px 6px;
  background: var(--accent);
  color: #fff;
}

.day-event.range-middle {
  border-radius: 2px;
  background: #d9eadf;
}

.day-event.range-end {
  border-radius: 2px 6px 6px 2px;
  background: #d9eadf;
}

.day-event.source-lancements {
  background: var(--pink-soft);
  color: var(--pink);
}

.day-event.source-lancements.range-start {
  background: var(--pink);
  color: #fff;
}

.day-event.source-lancements.range-middle,
.day-event.source-lancements.range-end {
  background: #efd5e0;
}

.day-event.source-contenu {
  background: var(--blue-soft);
  color: var(--blue);
}

.day-event.source-contenu.range-start {
  background: var(--blue);
  color: #fff;
}

.day-event.source-contenu.range-middle,
.day-event.source-contenu.range-end {
  background: #d2e0ea;
}

.day-event.source-projets {
  background: var(--gold-soft);
  color: var(--gold);
}

.day-event.source-projets.range-start {
  background: var(--gold);
  color: #fff;
}

.day-event.source-projets.range-middle,
.day-event.source-projets.range-end {
  background: #eadfbf;
}

.day-event a,
.day-event span {
  color: inherit;
  text-decoration: none;
}

.calendar-list {
  display: grid;
  gap: 8px;
}

.calendar-event {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 120px;
  gap: 12px;
  align-items: center;
  padding: 10px 0;
  border-top: 1px solid var(--line);
  border-left: 3px solid transparent;
  padding-left: 10px;
}

.calendar-event:first-child {
  border-top: 0;
}

.calendar-event span {
  display: block;
  margin-bottom: 3px;
  color: var(--muted);
  font-size: 13px;
  font-weight: 800;
}

.calendar-event a,
.calendar-event strong {
  color: var(--text);
  font-size: 15px;
}

.calendar-event a {
  text-decoration-color: var(--accent);
}

.calendar-event p {
  margin: 0;
  color: var(--muted);
  font-size: 13px;
  text-align: right;
}

.toast {
  position: fixed;
  left: 50%;
  bottom: 22px;
  z-index: 20;
  transform: translateX(-50%);
  padding: 10px 14px;
  border-radius: 8px;
  background: #18211f;
  color: #fff;
  opacity: 0;
  pointer-events: none;
  transition: opacity 160ms ease;
}

.toast.show {
  opacity: 1;
}

.toast.finance-tooltip {
  bottom: auto;
  max-width: min(320px, calc(100vw - 28px));
  transform: translate(-50%, -100%);
  text-align: center;
  white-space: normal;
}

.openclaw-mini {
  position: fixed;
  left: 22px;
  bottom: 22px;
  z-index: 1080;
}

.openclaw-mini-button {
  display: grid;
  place-items: center;
  width: 54px;
  height: 54px;
  border: 1px solid #17613d;
  border-radius: 50%;
  background: #1f7a4d;
  color: #fff;
  box-shadow: 0 14px 34px rgba(31, 122, 77, 0.25);
  font: inherit;
  font-size: 13px;
  font-weight: 900;
  cursor: pointer;
}

.openclaw-mini-card {
  display: none;
  width: min(360px, calc(100vw - 44px));
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel);
  box-shadow: 0 18px 45px rgba(26, 31, 30, 0.16);
}

.openclaw-mini.is-open .openclaw-mini-button {
  display: none;
}

.openclaw-mini.is-open .openclaw-mini-card {
  display: grid;
  gap: 10px;
}

.openclaw-mini-card header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.openclaw-mini-card header strong,
.openclaw-mini-card #openclawMiniBody > strong,
.openclaw-mini-card #openclawMiniBody > small,
.openclaw-mini-card #openclawMiniBody > p {
  display: block;
}

.openclaw-mini-card header button {
  display: grid;
  place-items: center;
  width: 26px;
  height: 26px;
  border: 1px solid var(--line);
  border-radius: 50%;
  background: #fff;
  color: var(--muted);
  font: inherit;
  font-weight: 900;
  cursor: pointer;
}

.openclaw-mini-status {
  display: inline-flex;
  width: fit-content;
  margin-bottom: 8px;
  padding: 5px 8px;
  border-radius: 999px;
  background: #f3f1ea;
  color: var(--muted);
  font-size: 11px;
  font-weight: 900;
}

.openclaw-mini-status.pending {
  background: #fae9e7;
  color: #9a3428;
}

.openclaw-mini-status.running {
  background: #fff0d8;
  color: #a65f16;
}

.openclaw-mini-status.completed {
  background: var(--accent-soft);
  color: var(--accent);
}

.openclaw-mini-status.failed {
  background: var(--pink-soft);
  color: var(--pink);
}

.openclaw-mini-card #openclawMiniBody > strong {
  font-size: 14px;
  line-height: 1.25;
}

.openclaw-mini-card #openclawMiniBody > small {
  margin-top: 5px;
  color: var(--muted);
  font-size: 12px;
}

.openclaw-mini-card #openclawMiniBody > p {
  margin: 9px 0 0;
  color: var(--muted);
  font-size: 12.5px;
  line-height: 1.4;
}

.openclaw-mini-card > a {
  display: inline-flex;
  width: fit-content;
  color: var(--accent);
  font-size: 12px;
  font-weight: 900;
  text-decoration: none;
}

@media (max-width: 980px) {
  .product-ai-context-summary {
    grid-template-columns: 1fr;
  }

  .product-ai-pack-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .app-frame,
  .sidebar-collapsed {
    grid-template-columns: minmax(0, 1fr);
  }

  .app-frame > main,
  .app-frame > .shell,
  .app-frame > .content-module,
  .app-frame > .dashboard-shell,
  .app-frame > .module-shell,
  .dashboard-internal-tabs {
    grid-column: 1;
  }

  .app-sidebar,
  body.runtime-readonly .app-sidebar {
    position: sticky;
    top: 0;
    grid-row: auto;
    height: auto;
    max-height: 58vh;
    border-right: 0;
    border-bottom: 1px solid var(--line);
  }

  .dashboard-internal-tabs {
    top: 0;
  }

  body.runtime-readonly .dashboard-internal-tabs {
    top: 38px;
  }

  .internal-tabs-list {
    padding: 7px 10px;
  }

  .internal-tab {
    width: min(196px, 68vw);
  }

  body.runtime-readonly .app-sidebar {
    top: 38px;
  }

  .sidebar-brand {
    min-height: 54px;
  }

  .sidebar-toggle {
    display: none;
  }

  .sidebar-nav {
    display: flex;
    gap: 8px;
    overflow-x: auto;
    overflow-y: hidden;
    padding: 8px 12px 10px;
  }

  .sidebar-command-button {
    display: flex;
    flex: 0 0 auto;
    margin: 8px 12px 0;
  }

  .sidebar-profile {
    display: none;
  }

  .sidebar-section {
    display: flex;
    flex: 0 0 auto;
    gap: 6px;
  }

  .sidebar-section > span {
    display: none;
  }

  .sidebar-link {
    grid-template-columns: 22px auto;
    min-height: 36px;
    white-space: nowrap;
  }

  .sidebar-link small {
    display: none;
  }

  .sidebar-collapsed .sidebar-home-link strong,
  .sidebar-collapsed .sidebar-link-text {
    display: block;
  }

  .sidebar-collapsed .sidebar-link {
    grid-template-columns: 22px auto;
    justify-items: start;
    padding: 7px 8px;
  }

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

  .module-grid,
  .week-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .openclaw-summary,
  .openclaw-status-summary,
  .openclaw-nav-summary,
  .openclaw-status-grid,
  .openclaw-tools-grid,
  .openclaw-board {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .openclaw-history-board .openclaw-jobs,
  .openclaw-detail-grid {
    grid-template-columns: 1fr;
  }

  .overview-grid,
  .summary-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .workspace-layout,
  .work-layout,
  .launch-index-head,
  .launch-index-layout,
  .launch-detail-header,
  .work-header,
  .launch-row,
  .launch-header,
  .launch-card-heading {
    grid-template-columns: 1fr;
  }

  .launch-cockpit {
    grid-template-columns: 1fr;
  }

  .brand-context-box {
    position: static;
  }

  .launch-actions,
  .work-actions,
  .toolbar-actions,
  .card-actions {
    justify-content: flex-start;
  }

  .rail {
    position: static;
  }

  .product-detail-layout {
    grid-template-columns: 1fr;
  }

  .product-props-strip {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .product-prop-box.price {
    grid-column: 1 / -1;
  }

  .launch-detail-layout {
    grid-template-columns: 1fr;
  }

  .work-stage-head,
  .work-step-heading,
  .work-chantier-head {
    align-items: flex-start;
  }

  .work-step-heading {
    grid-template-columns: minmax(0, 1fr) auto 18px;
  }

  .work-step-heading .work-status {
    width: fit-content;
  }

  .work-stage-body {
    padding-left: 0;
  }

  .work-zone-filters {
    position: static;
    margin-bottom: 10px;
  }

  .work-checks li,
  .work-checks .work-task-row {
    grid-template-columns: 16px minmax(0, 1fr);
  }

  .work-task-side {
    grid-column: 2;
    grid-template-columns: minmax(0, 1fr) auto;
    max-width: 260px;
  }

  .doc-workbench-layout {
    grid-template-columns: 1fr;
  }

  .doc-agent-panel,
  .doc-workbench-rail,
  .standard-workshop-rail {
    position: static;
    max-height: none;
    overflow: visible;
  }

  .launch-workshop-rail {
    position: static;
  }

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

  .product-edit-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .product-marketing-funnel {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .product-marketing-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .product-rail,
  .email-rail {
    position: static;
  }

  .email-layout,
  .email-product-grid,
  .email-sequence-grid,
  .email-decision-stats,
  .email-decision-toolbar,
  .library-card-grid,
  .email-summary,
  .pages-summary {
    grid-template-columns: 1fr;
  }

  .content-module .content-database-toolbar {
    grid-template-columns: auto minmax(260px, 1fr);
  }

  .content-module .content-database-toolbar .module-select-filters {
    grid-column: 1 / -1;
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 720px) {
  .product-ai-pack-grid {
    grid-template-columns: 1fr;
  }

  .shell {
    padding: 20px;
  }

  .agent-panel {
    right: 10px;
    bottom: 82px;
    width: calc(100vw - 20px);
    max-height: calc(100vh - 96px);
  }

  .agent-floating-button {
    right: 14px;
    bottom: 14px;
    width: 56px;
    height: 56px;
  }

  .topbar {
    align-items: flex-start;
    flex-direction: column;
  }

  .home-topbar {
    align-items: flex-start;
    flex-direction: column;
  }

  .page-header {
    align-items: flex-start;
    flex-direction: column;
  }

  .header-actions {
    justify-content: flex-start;
  }

  h1 {
    font-size: 32px;
  }

  .docs-toolbar input {
    min-width: 0;
  }

  .doc-grid {
    grid-template-columns: 1fr;
  }

  .doc-detail-head {
    align-items: flex-start;
    flex-direction: column;
  }

  .doc-detail-head h1 {
    font-size: 28px;
  }

  .doc-detail-meta {
    grid-template-columns: 1fr;
  }

  .modules,
  .module-grid,
  .week-grid,
  .openclaw-summary,
  .openclaw-status-summary,
  .openclaw-nav-summary,
  .openclaw-status-grid,
  .openclaw-tools-grid,
  .openclaw-board,
  .overview-grid,
  .summary-grid,
  .resource-grid,
  .subpage-grid,
  .calendar-summary,
  .launch-cockpit,
  .props,
  .kpi-strip,
  .ws-grid,
  .email-product-grid,
  .drive-files,
  .launch-row dl,
  .launch-properties {
    grid-template-columns: 1fr;
  }

  .product-edit-grid {
    grid-template-columns: 1fr;
  }

  .product-marketing-summary {
    grid-template-columns: 1fr;
  }

  .product-marketing-funnel {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .product-marketing-grid {
    grid-template-columns: 1fr;
  }

  .product-props-strip {
    grid-template-columns: 1fr;
  }

  .product-price-grid,
  .custom-page-row {
    grid-template-columns: 1fr;
  }

  .launch-list-head {
    align-items: flex-start;
    flex-direction: column;
  }

  .launch-item {
    grid-template-columns: auto minmax(0, 1fr);
  }

  .li-right {
    grid-column: 2;
    justify-items: start;
    text-align: left;
  }

  .timeline li,
  .sequence-row,
  .doc-row,
  .openclaw-history article,
  .calendar-event {
    grid-template-columns: 1fr;
    gap: 4px;
  }

  .calendar-toolbar {
    display: grid;
  }

  .content-module .content-database-toolbar {
    grid-template-columns: 1fr;
  }

  .content-module .content-database-toolbar .module-view-switch,
  .content-module .content-database-toolbar .content-toolbar-primary,
  .content-module .content-database-toolbar .module-search,
  .content-module .content-database-toolbar .module-select-filters {
    width: 100%;
  }

  .content-module .content-database-toolbar .module-view-switch {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .content-module .content-headline {
    white-space: normal;
  }

  .content-module .content-database-toolbar .module-select-filters {
    grid-template-columns: 1fr;
  }

  .pages-filters,
  .page-link-row,
  .important-link-row,
  .page-form-grid {
    grid-template-columns: 1fr;
  }

  .page-link-row,
  .important-link-row {
    gap: 2px;
  }

  .type-choice {
    grid-template-columns: 1fr;
  }

  .calendar-weekdays {
    display: none;
  }

  .calendar-grid {
    grid-template-columns: 1fr;
    border-radius: 8px;
  }

  .calendar-day {
    min-height: auto;
    border-right: 0;
  }

  .calendar-event p {
    text-align: left;
  }

  .product-detail-head {
    align-items: flex-start;
    flex-direction: column;
  }

  .email-detail-head {
    align-items: flex-start;
    flex-direction: column;
  }

  .email-product-strategy-head,
  .email-marketing-map,
  .email-analysis-grid,
  .email-analysis-columns {
    grid-template-columns: 1fr;
  }

  .email-strategy-stats {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .email-sequence-analysis-head {
    grid-template-columns: 1fr;
  }

  .email-sequence-analysis-head > span {
    justify-self: start;
  }

  .email-step {
    grid-template-columns: 54px minmax(0, 1fr);
  }

  .email-sequence-accordion > summary {
    grid-template-columns: auto minmax(0, 1fr);
  }

  .email-sequence-accordion > summary .email-chip,
  .email-sequence-count {
    grid-column: 2;
    justify-self: start;
  }

  .email-message-accordion > summary {
    grid-template-columns: 54px minmax(0, 1fr);
  }

  .email-message-link {
    grid-template-columns: 54px minmax(0, 1fr);
  }

  .email-message-phase {
    grid-column: 2;
    justify-self: start;
  }

  .email-message-body {
    padding-left: 68px;
  }

  .email-step-open {
    grid-column: 2;
  }

  .product-price-row,
  .product-link-list li,
  .product-unit,
  .product-resource-summary,
  .product-resource-card {
    grid-template-columns: 1fr;
  }

  .page-inline-editor,
  .email-summary,
  .pages-summary {
    grid-template-columns: 1fr;
  }

  .email-sequence-row {
    grid-template-columns: 120px minmax(0, 1fr);
  }

  .email-sequence-row .email-sequence-meta {
    grid-column: 2;
    justify-content: flex-start;
  }

  .email-sequence-row .email-sequence-mini {
    display: none;
  }

  .library-group-head {
    align-items: flex-start;
  }

  .library-group-meta {
    display: none;
  }

  .unit-file-links {
    justify-content: flex-start;
  }
}

/* Late responsive overrides for Content V2 (after the legacy Content block). */
.content-module .content-database-toolbar .module-select-filters {
  grid-template-columns: minmax(154px, 1.25fr) repeat(3, minmax(118px, 1fr));
}

@media (max-width: 1080px) {
  .content-module .content-database-toolbar .module-select-filters {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 720px) {
  .content-module .content-database-toolbar .module-select-filters,
  .content-edit-grid,
  .content-create-grid,
  .content-calendar-grid,
  .content-detail-head,
  .content-detail-layout,
  .content-relation-add {
    grid-template-columns: minmax(0, 1fr);
  }

  .content-channel-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .content-rail {
    position: static;
  }
}

@media (max-width: 430px) {
  .content-channel-grid {
    grid-template-columns: minmax(0, 1fr);
  }
}

/* Content V3 — métier visible, infrastructure progressive */
.content-v3-head {
  align-items: center;
  margin-bottom: 12px;
}

.content-v3-head-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  margin-top: 10px;
  color: var(--muted);
  font-size: 12px;
}

.content-v3-head .header-actions {
  flex-wrap: wrap;
}

.content-v3-head .header-actions b {
  display: inline-grid;
  min-width: 19px;
  height: 19px;
  place-items: center;
  margin-left: 4px;
  border-radius: 999px;
  background: var(--accent-soft);
  color: var(--accent);
  font-size: 10px;
}

.content-v3-next,
.content-v3-blocked {
  display: flex;
  gap: 12px;
  align-items: center;
  margin-bottom: 14px;
  padding: 12px 14px;
  border: 1px solid #c9ddd8;
  border-radius: 10px;
  background: linear-gradient(135deg, #edf7f4, #f8fbfa);
}

.content-v3-next > span,
.content-v3-blocked small {
  color: var(--accent);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.content-v3-next strong {
  font-size: 14px;
}

.content-v3-next small {
  margin-left: auto;
  color: var(--muted);
}

.content-v3-blocked {
  align-items: flex-end;
  justify-content: space-between;
  border-color: #d6a693;
  background: #fff5ef;
  color: #843d26;
}

.content-v3-blocked div {
  display: grid;
  gap: 4px;
}

.content-v3-blocked small,
.content-v3-blocked span {
  color: #9a5a43;
}

.content-v3-blocked span {
  font-size: 12px;
}

.content-v3-tabs {
  display: flex;
  gap: 4px;
  margin-bottom: 16px;
  padding: 4px;
  overflow-x: auto;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: #efefeb;
}

.content-v3-tabs button {
  flex: 1 0 auto;
  min-height: 38px;
  padding: 8px 14px;
  border: 0;
  border-radius: 7px;
  background: transparent;
  color: var(--muted);
  font: inherit;
  font-size: 13px;
  font-weight: 850;
  cursor: pointer;
}

.content-v3-tabs button.active {
  background: var(--panel);
  color: var(--text);
  box-shadow: 0 2px 8px rgba(32, 37, 34, 0.08);
}

.content-v3-tab {
  min-width: 0;
}

.content-v3-overview-grid,
.content-v3-links-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.45fr) minmax(320px, 0.8fr);
  gap: 16px;
  align-items: stretch;
  margin-bottom: 20px;
}

.content-v3-overview-grid > div,
.content-v3-essential {
  min-width: 0;
}

.content-v3-preview {
  height: 100%;
  min-height: 300px;
  overflow: hidden;
  border-radius: 12px;
  background: #151716;
}

.content-v3-preview iframe {
  display: block;
  width: 100%;
  aspect-ratio: 16 / 9;
  border: 0;
}

.content-v3-preview > a {
  display: block;
  padding: 11px 14px;
  color: #fff;
  font-size: 12px;
  font-weight: 800;
  text-decoration: none;
}

.content-v3-audio {
  display: grid;
  grid-template-columns: 58px minmax(0, 1fr);
  gap: 14px;
  min-height: 220px;
  place-content: center;
  padding: 28px;
  background: linear-gradient(145deg, #2b2040, #6b4b8a);
  color: #fff;
}

.content-v3-audio > span {
  display: grid;
  width: 58px;
  height: 58px;
  place-items: center;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.14);
  font-size: 22px;
}

.content-v3-audio div {
  display: grid;
  gap: 5px;
  align-content: center;
}

.content-v3-audio small {
  color: #ddd2e7;
}

.content-v3-audio audio {
  grid-column: 1 / -1;
  width: 100%;
  margin-top: 12px;
}

.content-v3-preview-placeholder {
  display: grid;
  min-height: 300px;
  place-items: center;
  align-content: center;
  gap: 8px;
  padding: 28px;
  border-radius: 12px;
  background: linear-gradient(145deg, #2c2428, #785268);
  color: #fff;
  text-align: center;
}

.content-v3-preview-placeholder.vertical {
  width: min(100%, 300px);
  min-height: 430px;
  margin-inline: auto;
  border-radius: 18px;
}

.content-v3-preview-placeholder > span {
  display: grid;
  width: 58px;
  height: 58px;
  place-items: center;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.14);
  font-size: 22px;
}

.content-v3-preview-placeholder small {
  color: #e4d8de;
}

.content-v3-essential {
  display: grid;
  align-content: start;
  gap: 14px;
}

.content-v3-essential > header,
.content-v3-workshop-head,
.content-v3-workshop-card > header,
.content-v3-handoff {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
}

.content-v3-essential h2,
.content-v3-section-head h2,
.content-v3-workshop-head h2,
.content-v3-handoff h2 {
  margin: 2px 0 0;
  font-size: 18px;
}

.content-v3-essential header small,
.content-v3-section-head small,
.content-v3-workshop-head small,
.content-v3-handoff small {
  color: var(--accent);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: 0.07em;
  text-transform: uppercase;
}

.content-v3-essential .content-props {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.content-v3-edit,
.content-v3-relation-editor {
  border-top: 1px solid var(--line);
}

.content-v3-edit > summary,
.content-v3-relation-editor > summary {
  padding: 13px 0 0;
  color: var(--accent);
  font-size: 12px;
  font-weight: 850;
  cursor: pointer;
}

.content-v3-edit[open] > summary,
.content-v3-relation-editor[open] > summary {
  margin-bottom: 14px;
}

.content-v3-section-head {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 12px;
  margin: 22px 0 10px;
}

.content-v3-section-head.compact {
  margin: 0 0 12px;
}

.content-v3-section-head > span {
  color: var(--muted);
  font-size: 12px;
}

.content-v3-workflow {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 8px;
  margin: 0 0 18px;
  padding: 0;
  list-style: none;
}

.content-v3-workflow li {
  display: grid;
  grid-template-columns: 26px minmax(0, 1fr);
  gap: 9px;
  align-items: center;
  min-width: 0;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 9px;
  background: var(--panel);
}

.content-v3-workflow li > span {
  display: grid;
  width: 24px;
  height: 24px;
  place-items: center;
  border: 1px solid var(--line);
  border-radius: 50%;
  font-size: 11px;
  font-weight: 900;
}

.content-v3-workflow li.done > span {
  border-color: var(--accent);
  background: var(--accent-soft);
  color: var(--accent);
}

.content-v3-workflow li.running > span {
  border-color: var(--pod);
  background: var(--pod-soft);
  color: var(--pod);
}

.content-v3-workflow li.blocked > span {
  border-color: #b76b4c;
  background: #fff1e9;
  color: #8b452d;
}

.content-v3-workflow li div {
  display: grid;
  min-width: 0;
  gap: 3px;
}

.content-v3-workflow strong,
.content-v3-workflow small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.content-v3-workflow strong {
  font-size: 12px;
}

.content-v3-workflow small {
  color: var(--muted);
  font-size: 10px;
}

.content-v3-deliverables {
  display: grid;
  gap: 9px;
}

.content-v3-deliverable {
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--panel);
}

.content-v3-deliverable > summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 12px 14px;
  cursor: pointer;
  list-style: none;
}

.content-v3-deliverable > summary::-webkit-details-marker {
  display: none;
}

.content-v3-deliverable > summary > div {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 4px 9px;
  min-width: 0;
  align-items: center;
}

.content-v3-deliverable > summary strong {
  font-size: 14px;
}

.content-v3-deliverable > summary small {
  grid-column: 2;
  overflow: hidden;
  color: var(--muted);
  font-size: 11px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.content-v3-deliverable[open] > summary > span {
  transform: rotate(180deg);
}

.content-v3-deliverable-body {
  padding: 12px 14px 14px;
  border-top: 1px solid var(--line);
}

.content-v3-state {
  display: inline-flex;
  width: max-content;
  min-height: 21px;
  align-items: center;
  padding: 2px 8px;
  border-radius: 999px;
  background: #efefeb;
  color: var(--muted);
  font-size: 9px;
  font-weight: 900;
  text-transform: uppercase;
}

.content-v3-state.validated {
  background: var(--accent-soft);
  color: var(--accent);
}

.content-v3-state.ready,
.content-v3-state.running {
  background: var(--pod-soft);
  color: var(--pod);
}

.content-v3-state.changes,
.content-v3-state.error {
  background: #fff0e9;
  color: #91492e;
}

.content-v3-state.draft {
  background: var(--blue-soft);
  color: var(--blue);
}

.content-v3-file,
.content-v3-relation,
.content-v3-version {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 0;
  border-bottom: 1px solid var(--line);
}

.content-v3-file:last-child,
.content-v3-relation:last-child,
.content-v3-version:last-child {
  border-bottom: 0;
}

.content-v3-file > div:first-child,
.content-v3-relation > div {
  display: grid;
  min-width: 0;
  gap: 3px;
}

.content-v3-file strong,
.content-v3-file span,
.content-v3-relation strong,
.content-v3-relation span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.content-v3-file span,
.content-v3-relation span,
.content-v3-relation small {
  color: var(--muted);
  font-size: 11px;
}

.content-v3-inline-actions,
.content-v3-action-row {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  justify-content: flex-end;
}

.content-v3-action-row {
  margin-top: 11px;
}

.content-v3-version {
  display: block;
}

.content-v3-version header {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  color: var(--muted);
  font-size: 11px;
}

.content-v3-output {
  max-height: 280px;
  margin-top: 8px;
  overflow: auto;
  color: var(--text);
  font-size: 13px;
  line-height: 1.55;
}

.content-v3-workshop-head,
.content-v3-instruction,
.content-v3-handoff {
  margin-bottom: 12px;
}

.content-v3-workshop-head p {
  max-width: 720px;
  margin: 7px 0 0;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.5;
}

.content-v3-contexts {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.content-v3-context {
  display: inline-flex;
  gap: 7px;
  align-items: center;
  padding: 7px 10px;
  border: 1px solid #cbded9;
  border-radius: 999px;
  background: #f3f9f7;
  color: var(--accent);
  font-size: 12px;
  font-weight: 750;
}

.content-v3-context small {
  color: var(--muted);
  font-size: 9px;
  font-weight: 900;
  text-transform: uppercase;
}

.content-v3-workshop-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  margin: 12px 0;
}

.content-v3-workshop-card {
  display: grid;
  align-content: start;
  min-width: 0;
}

.content-v3-workshop-card h3 {
  margin: 7px 0 2px;
  font-size: 15px;
}

.content-v3-workshop-card header small,
.content-v3-workshop-card p {
  color: var(--muted);
  font-size: 12px;
}

.content-v3-workshop-card p {
  min-height: 38px;
  overflow-wrap: anywhere;
  line-height: 1.5;
}

.content-v3-handoff {
  align-items: center;
  margin-top: 16px;
  padding: 18px;
  border-color: #c9ddd8;
  background: linear-gradient(135deg, #f2f9f7, #fff);
}

.content-v3-handoff ul {
  margin: 8px 0 0;
  padding-left: 18px;
  color: var(--muted);
  font-size: 12px;
}

.content-v3-links-grid {
  grid-template-columns: minmax(0, 1.2fr) minmax(300px, 0.8fr);
}

.content-v3-relation-editor {
  margin-top: 14px;
}

.content-v3-relation-editor #contentRelationRows {
  margin-top: 14px;
  padding-top: 8px;
  border-top: 1px solid var(--line);
}

.content-v3-drawer-backdrop {
  position: fixed;
  z-index: 1090;
  inset: 0;
  display: none;
  background: rgba(25, 31, 28, 0.38);
}

.content-v3-drawer-backdrop.open {
  display: block;
}

.content-v3-drawer {
  position: fixed;
  z-index: 1100;
  top: 0;
  right: 0;
  width: min(440px, 92vw);
  height: 100vh;
  padding: 20px;
  overflow-y: auto;
  border-left: 1px solid var(--line);
  background: var(--panel);
  box-shadow: -18px 0 40px rgba(32, 37, 34, 0.15);
  transform: translateX(102%);
  transition: transform 180ms ease;
}

.content-v3-drawer.open {
  transform: translateX(0);
}

.content-v3-drawer > header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 18px;
  padding-bottom: 14px;
  border-bottom: 1px solid var(--line);
}

.content-v3-drawer h2 {
  margin: 2px 0 0;
}

.content-v3-drawer header small {
  color: var(--accent);
  font-size: 10px;
  font-weight: 900;
  text-transform: uppercase;
}

.content-v3-activity {
  display: grid;
  gap: 12px;
}

.content-v3-activity article {
  display: grid;
  grid-template-columns: 12px minmax(0, 1fr);
  gap: 10px;
}

.content-v3-activity article > span {
  width: 10px;
  height: 10px;
  margin-top: 4px;
  border-radius: 50%;
  background: var(--accent);
  box-shadow: 0 0 0 4px var(--accent-soft);
}

.content-v3-activity article > span.task {
  background: var(--pod);
  box-shadow: 0 0 0 4px var(--pod-soft);
}

.content-v3-activity article > span.publication {
  background: var(--blue);
  box-shadow: 0 0 0 4px var(--blue-soft);
}

.content-v3-activity article div {
  display: grid;
  gap: 3px;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--line);
}

.content-v3-activity p {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
}

.content-v3-activity small {
  color: var(--muted);
  font-size: 10px;
}

.content-v3-tab .button:disabled,
.content-v3-blocked .button:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

@media (max-width: 920px) {
  .content-v3-overview-grid,
  .content-v3-links-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .content-v3-workshop-grid {
    grid-template-columns: minmax(0, 1fr);
  }
}

@media (max-width: 720px) {
  .content-v3-head .header-actions,
  .content-v3-next,
  .content-v3-blocked,
  .content-v3-workshop-head,
  .content-v3-handoff {
    align-items: stretch;
    flex-direction: column;
  }

  .content-v3-head .header-actions .button,
  .content-v3-workshop-head > .button,
  .content-v3-handoff > .button {
    width: 100%;
  }

  .content-v3-next small {
    margin-left: 0;
  }

  .content-v3-preview,
  .content-v3-preview-placeholder {
    min-height: 220px;
  }

  .content-v3-audio {
    grid-template-columns: 48px minmax(0, 1fr);
    padding: 20px;
  }

  .content-v3-audio > span {
    width: 48px;
    height: 48px;
  }

  .content-v3-file,
  .content-v3-relation {
    align-items: stretch;
    flex-direction: column;
  }

  .content-v3-inline-actions,
  .content-v3-action-row {
    justify-content: flex-start;
  }
}

@media (max-width: 430px) {
  .content-v3-tabs {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    margin-inline: -6px;
  }

  .content-v3-tabs button {
    min-width: 0;
    padding-inline: 5px;
    font-size: 12px;
  }

  .content-v3-essential .content-props {
    grid-template-columns: minmax(0, 1fr);
  }

  .content-v3-workflow {
    grid-template-columns: minmax(0, 1fr);
  }

  .content-v3-deliverable > summary > div {
    grid-template-columns: minmax(0, 1fr);
  }

  .content-v3-deliverable > summary small {
    grid-column: 1;
  }

  .content-v3-action-row .button,
  .content-v3-inline-actions .button {
    flex: 1 1 auto;
  }
}

/* Shared normalized dashboard surfaces. New modules should extend these
   classes before adding module-specific visual variants. */
.jb-page {
  min-width: 0;
}

.jb-page-header,
.jb-toolbar,
.jb-section-header,
.jb-section-actions {
  align-items: center;
  display: flex;
  gap: 10px;
}

.jb-page-header,
.jb-toolbar {
  justify-content: space-between;
}

.jb-section {
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: 8px;
  box-shadow: 0 14px 30px rgba(32, 37, 34, 0.06);
  min-width: 0;
}

.jb-section-header {
  border-bottom: 1px solid var(--line);
  justify-content: space-between;
  padding: 14px 16px;
}

/* A standard workshop header is a full-width grid. Keep this rule after the
   generic flex header so module styles cannot silently shrink the meta row. */
.jb-section-header.launch-workshop-toolbar,
.jb-section-header:has(> [data-standard-workshop-meta]) {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  width: 100%;
}

.jb-section-header > [data-standard-workshop-meta] {
  width: 100%;
  min-width: 0;
}

.jb-section-header h2,
.jb-section-header h3 {
  font-size: 15px;
  letter-spacing: 0;
  margin: 0;
}

.jb-section-body {
  min-width: 0;
  padding: 16px;
}

.jb-section-actions {
  justify-content: flex-end;
}

.jb-rich-text {
  color: var(--text);
  line-height: 1.62;
}

.jb-rich-text > *:first-child {
  margin-top: 0;
}

.jb-rich-text > *:last-child {
  margin-bottom: 0;
}

/* Content common workflow + editorial review loop. */
.content-qualification-tray {
  min-width: 0;
  margin-bottom: 10px;
  padding: 12px;
  border: 1px dashed color-mix(in srgb, var(--warning) 42%, var(--line));
  border-radius: 10px;
  background: color-mix(in srgb, var(--warning-soft) 54%, white);
}

.content-qualification-tray > header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
  margin-bottom: 10px;
}

.content-qualification-tray > header div {
  display: grid;
  gap: 2px;
}

.content-qualification-tray > header span {
  color: var(--warning);
  font-size: 10px;
  font-weight: 850;
  letter-spacing: 0.07em;
  text-transform: uppercase;
}

.content-qualification-tray > header h2 {
  margin: 0;
  color: var(--text);
  font-size: 14px;
}

.content-qualification-tray > header p {
  margin: 0;
  color: var(--muted);
  font-size: 11px;
}

.content-qualification-tray > header b {
  display: grid;
  min-width: 26px;
  height: 26px;
  place-items: center;
  border-radius: 999px;
  background: var(--warning-soft);
  color: var(--warning);
  font-size: 12px;
}

.content-qualification-cards {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
  gap: 8px;
}

.content-qualification-card {
  margin-bottom: 0;
  border-style: dashed;
}

.content-status-stack {
  display: inline-grid;
  justify-items: start;
  gap: 5px;
}

.content-review-state {
  display: inline-flex;
  align-items: center;
  width: max-content;
  max-width: 100%;
  min-height: 20px;
  padding: 2px 8px;
  border-radius: 999px;
  background: var(--pink-soft);
  color: var(--pink);
  font-size: 10px;
  font-weight: 850;
  line-height: 1.25;
  white-space: normal;
}

.content-review-state.changes-requested {
  background: var(--warning-soft);
  color: var(--warning);
}

.content-review-state.revalidation {
  background: var(--blue-soft);
  color: var(--blue);
}

.content-kcard > .content-review-state,
.content-calendar-card > .content-review-state {
  align-self: flex-start;
}

.content-review-panel {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  margin: 0 0 16px;
  padding: 12px 14px;
  border: 1px solid color-mix(in srgb, var(--pink) 28%, var(--line));
  border-left: 3px solid var(--pink);
  border-radius: 10px;
  background: color-mix(in srgb, var(--pink-soft) 52%, white);
}

.content-review-panel.entry,
.content-review-panel.revalidation {
  border-color: color-mix(in srgb, var(--blue) 28%, var(--line));
  border-left-color: var(--blue);
  background: color-mix(in srgb, var(--blue-soft) 52%, white);
}

.content-review-panel.changes-requested {
  border-color: color-mix(in srgb, var(--warning) 28%, var(--line));
  border-left-color: var(--warning);
  background: color-mix(in srgb, var(--warning-soft) 56%, white);
}

.content-review-copy {
  display: grid;
  min-width: 0;
  gap: 2px;
}

.content-review-copy > span {
  color: var(--muted);
  font-size: 10px;
  font-weight: 850;
  letter-spacing: 0.07em;
  text-transform: uppercase;
}

.content-review-copy > strong {
  color: var(--text);
  font-size: 14px;
}

.content-review-copy > small {
  color: var(--muted);
  font-size: 11px;
  line-height: 1.4;
}

.content-review-feedback {
  display: grid;
  gap: 4px;
  max-width: 720px;
  margin: 7px 0 5px;
  padding: 9px 11px;
  border: 1px solid color-mix(in srgb, var(--warning) 24%, var(--line));
  border-radius: 8px;
  background: color-mix(in srgb, var(--panel) 82%, var(--warning-soft));
}

.content-review-feedback > span {
  color: var(--warning);
  font-size: 10px;
  font-weight: 850;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

.content-review-feedback > p,
.history-item.review-comment > p {
  margin: 0;
  color: var(--text);
  font-size: 12px;
  line-height: 1.5;
  overflow-wrap: anywhere;
  white-space: pre-wrap;
}

.content-review-feedback > small {
  color: var(--muted);
  font-size: 10.5px;
  line-height: 1.4;
}

.history-item.review-comment {
  gap: 5px;
  padding-left: 10px;
  border-left: 3px solid var(--warning);
}

.content-review-actions {
  display: flex;
  flex: 0 0 auto;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
}

.content-review-request {
  position: relative;
}

.content-review-request > summary {
  min-height: 36px;
  padding: 8px 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel);
  color: var(--text);
  font-size: 12px;
  font-weight: 800;
  cursor: pointer;
  list-style: none;
}

.content-review-request > summary::-webkit-details-marker {
  display: none;
}

.content-review-request[open] > summary {
  border-color: var(--pink);
}

.content-review-request form {
  position: absolute;
  z-index: 12;
  top: calc(100% + 8px);
  right: 0;
  display: grid;
  width: min(430px, calc(100vw - 48px));
  gap: 10px;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--panel);
  box-shadow: 0 18px 40px rgba(32, 37, 34, 0.16);
}

.content-review-request label {
  display: grid;
  gap: 5px;
  color: var(--text);
  font-size: 11px;
  font-weight: 800;
}

.content-review-request textarea,
.content-review-request select {
  width: 100%;
  min-height: 38px;
  padding: 8px 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  color: var(--text);
  font: inherit;
  font-size: 13px;
  resize: vertical;
}

.content-review-request textarea:focus,
.content-review-request select:focus,
.content-review-request > summary:focus-visible {
  outline: 2px solid color-mix(in srgb, var(--pink) 60%, white);
  outline-offset: 2px;
}

@media (max-width: 720px) {
  .content-review-panel {
    align-items: stretch;
    flex-direction: column;
    gap: 10px;
  }

  .content-review-actions {
    justify-content: stretch;
  }

  .content-review-actions > .btn,
  .content-review-request,
  .content-review-request > summary {
    width: 100%;
  }

  .content-review-request form {
    position: static;
    width: 100%;
    margin-top: 8px;
  }
}

.jb-todo-list {
  display: grid;
  gap: 8px;
}

.jb-table {
  border-collapse: collapse;
  width: 100%;
}

.jb-table th,
.jb-table td {
  border-bottom: 1px solid var(--line);
  padding: 10px 12px;
  text-align: left;
  vertical-align: top;
}

.jb-kanban {
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
}

.jb-timeline,
.jb-activity-history,
.jb-comments {
  display: grid;
  gap: 10px;
}

.jb-file-links,
.jb-validation-queue,
.jb-agent-context {
  display: grid;
  gap: 12px;
}

.jb-save-status {
  color: var(--muted);
  font-size: 12px;
  min-height: 18px;
}

.jb-save-status[data-save-status="saving"] {
  color: var(--accent);
}

.jb-save-status[data-save-status="error"],
.jb-save-status[data-save-status="conflict"] {
  color: var(--yt);
}

.activity-history-card {
  margin-top: 14px;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel);
}

.activity-trigger-button {
  width: 34px;
  min-width: 34px;
  height: 34px;
  padding: 0;
  display: inline-grid;
  place-items: center;
}

.activity-trigger-button svg {
  width: 16px;
  height: 16px;
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.9;
}

.activity-history-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 10px;
}

.activity-history-head h3 {
  margin: 0;
  color: var(--text);
  font-size: 20px;
  line-height: 1.2;
}

.activity-history-list {
  display: grid;
  gap: 8px;
}

.activity-history-footer {
  display: flex;
  justify-content: flex-start;
  margin-top: 10px;
}

.activity-history-footer:empty {
  display: none;
}

.launch-results-rail .activity-history-card {
  padding: 16px;
  border-radius: 12px;
}

.launch-results-rail .activity-history-head {
  margin-bottom: 8px;
  padding: 0;
  border-bottom: 0;
}

.launch-results-rail .activity-history-head h3 {
  color: var(--muted);
  font-size: 13px;
  font-weight: 750;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.launch-results-rail [data-activity-history-status] {
  display: none;
}

.activity-history-item {
  display: grid;
  gap: 3px;
  padding: 9px 0;
  border-top: 1px solid var(--line);
}

.activity-history-button {
  width: 100%;
  min-width: 0;
  padding: 0;
  border-right: 0;
  border-bottom: 0;
  border-left: 0;
  background: transparent;
  color: inherit;
  font: inherit;
  text-align: left;
  cursor: pointer;
}

.activity-history-button:hover,
.activity-history-button:focus-visible {
  background: #f8faf7;
}

.activity-history-item:first-child {
  border-top: 0;
}

.activity-history-item strong {
  color: var(--text);
  font-size: 13px;
  line-height: 1.25;
}

.activity-history-item span {
  color: var(--muted);
  font-size: 12px;
  line-height: 1.3;
}

.page-activity-body h3 {
  margin: 0 0 8px;
  color: var(--text);
  font-size: 14px;
}

.page-activity-item {
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: start;
  gap: 12px;
}

.page-activity-item > div,
.page-activity-detail-button > div {
  display: grid;
  gap: 3px;
}

.page-activity-detail-button,
.activity-history-inline-detail {
  padding: 0;
  border-top: 0;
}

.activity-history-inline-item {
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: start;
  gap: 10px;
}

.activity-history-row-main {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.activity-restore-button {
  align-self: start;
  white-space: nowrap;
}

.versioning-backdrop {
  position: fixed;
  inset: 0;
  z-index: 80;
  background: rgba(15, 23, 42, 0.35);
  opacity: 0;
  pointer-events: none;
  transition: opacity 160ms ease;
}

.versioning-backdrop.open {
  opacity: 1;
  pointer-events: auto;
}

.versioning-panel {
  position: fixed;
  top: 0;
  right: 0;
  z-index: 90;
  display: grid;
  grid-template-rows: auto 1fr;
  width: min(560px, 100vw);
  height: 100vh;
  background: var(--panel);
  border-left: 1px solid var(--line);
  box-shadow: -18px 0 50px rgba(15, 23, 42, 0.18);
  transform: translateX(100%);
  transition: transform 180ms ease;
}

.versioning-panel.open {
  transform: translateX(0);
}

.versioning-panel-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  padding: 18px;
  border-bottom: 1px solid var(--line);
}

.versioning-panel-head span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
}

.versioning-panel-head h2 {
  margin: 4px 0 0;
  font-size: 20px;
}

.versioning-panel-body {
  display: grid;
  align-content: start;
  gap: 12px;
  overflow: auto;
  padding: 18px;
}

.versioning-item {
  display: grid;
  gap: 10px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--bg);
}

.versioning-item-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}

.versioning-item-head div {
  display: grid;
  gap: 3px;
}

.versioning-item-head strong {
  color: var(--text);
  font-size: 14px;
}

.versioning-item-head span {
  color: var(--muted);
  font-size: 12px;
}

.versioning-item pre {
  overflow: auto;
  max-height: 220px;
  margin: 0;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 6px;
  color: var(--text);
  background: var(--panel);
  font: 12px/1.45 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  white-space: pre-wrap;
}

.jb-comms-dock {
  position: fixed;
  left: 18px;
  bottom: 18px;
  z-index: 70;
  display: inline-flex;
  gap: 8px;
  padding: 6px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.96);
  box-shadow: 0 14px 36px rgba(15, 23, 42, 0.16);
}

.jb-comms-dock-button {
  position: relative;
  display: inline-grid;
  width: 38px;
  height: 38px;
  place-items: center;
  border: 1px solid transparent;
  border-radius: 8px;
  color: var(--text);
  text-decoration: none;
}

.jb-comms-dock-button:hover {
  border-color: var(--accent);
  background: var(--accent-soft);
  color: var(--accent);
}

.jb-comms-dock-button svg {
  width: 18px;
  height: 18px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.jb-comms-dock-button span {
  position: absolute;
  top: -5px;
  right: -5px;
  display: inline-grid;
  min-width: 18px;
  height: 18px;
  place-items: center;
  padding: 0 4px;
  border-radius: 999px;
  background: var(--pink);
  color: white;
  font-size: 11px;
  font-weight: 800;
}

@media (max-width: 760px) {
  .jb-comms-dock {
    left: 12px;
    bottom: 12px;
  }
}

.action-plan-workshop {
  max-width: var(--workshop-max-width);
}

.action-plan-header {
  align-items: flex-end;
}

.action-plan-layout {
  margin-top: 16px;
}

.action-plan-main {
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel);
}

.action-plan-toolbar {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 14px;
  align-items: stretch;
  justify-content: stretch;
  padding: 14px;
  border-bottom: 1px solid var(--line);
}

.action-plan-tools {
  display: flex;
  gap: 10px;
  align-items: end;
  width: 100%;
}

.action-plan-tools label {
  position: relative;
  display: grid;
  flex: 1;
  gap: 5px;
}

.action-plan-tools span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
}

.action-plan-tools input,
.action-plan-todo input,
.action-plan-todo select {
  width: 100%;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--bg);
  color: var(--text);
  font: inherit;
}

.action-plan-tools input,
.action-plan-todo input,
.action-plan-todo select {
  min-height: 38px;
  padding: 8px 10px;
}

.task-search-menu {
  position: absolute;
  z-index: 30;
  top: calc(100% + 6px);
  right: 0;
  left: 0;
  display: grid;
  gap: 6px;
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel);
  box-shadow: 0 16px 36px rgba(32, 37, 34, 0.14);
}

.task-search-menu[hidden] {
  display: none;
}

.task-search-menu-head {
  padding: 2px 4px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
}

.task-search-menu-list {
  display: grid;
  gap: 4px;
}

.task-search-menu-list button {
  width: 100%;
  min-height: 32px;
  padding: 6px 8px;
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: var(--text);
  font: inherit;
  font-size: 13px;
  font-weight: 750;
  text-align: left;
  cursor: pointer;
}

.task-search-menu-list button:hover,
.task-search-menu-list button:focus-visible {
  background: var(--accent-soft);
  color: var(--accent);
}

.action-plan-timeline {
  position: relative;
  display: grid;
}

.action-plan-timeline-line {
  position: absolute;
  top: 15px;
  bottom: 18px;
  left: 14px;
  width: 2px;
  background: var(--line);
}

.action-plan-board {
  display: grid;
  gap: 18px;
  min-width: 0;
}

.action-plan-group {
  position: relative;
  display: grid;
  gap: 10px;
  padding-left: 34px;
  border-radius: 8px;
}

.action-plan-group.is-drop-target {
  background: color-mix(in srgb, var(--accent-soft) 30%, transparent);
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--accent) 28%, transparent);
}

.action-plan-group header {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  min-height: 34px;
}

.action-plan-group-title {
  display: flex;
  min-width: 0;
  align-items: center;
  gap: 10px;
}

.timeline-dot {
  position: absolute;
  top: 8px;
  left: 6px;
  width: 18px;
  height: 18px;
  border: 3px solid var(--panel);
  border-radius: 999px;
  background: var(--accent);
  box-shadow: 0 0 0 1px var(--line);
}

.action-plan-group h2 {
  flex: 0 0 auto;
  margin: 0;
  font-size: 17px;
  line-height: 1.2;
}

.action-plan-group-meta {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 8px;
}

.action-plan-count {
  display: inline-grid;
  min-width: 42px;
  height: 28px;
  place-items: center;
  border-radius: 999px;
  background: var(--accent-soft);
  color: var(--accent);
  font-size: 12px;
  font-weight: 800;
}

.action-plan-todos {
  display: grid;
  gap: 1px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.action-plan-add-inline {
  justify-self: start;
  display: inline-grid;
  width: 30px;
  height: 30px;
  place-items: center;
  margin-top: 4px;
  border: 1px dashed var(--line-strong, var(--line));
  border-radius: 999px;
  background: transparent;
  color: var(--muted);
  font-size: 18px;
  font-weight: 700;
  line-height: 1;
  cursor: pointer;
}

.action-plan-add-inline:hover,
.action-plan-add-inline:focus-visible {
  border-color: var(--accent);
  background: var(--accent-soft);
  color: var(--accent);
}

.todo-date {
  min-width: 0;
  height: 34px;
  padding: 5px 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel);
  color: var(--ink);
  font: inherit;
  font-size: 12.5px;
  font-weight: 750;
}

.todo-date:focus {
  border-color: var(--accent);
  outline: 2px solid color-mix(in srgb, var(--accent) 18%, transparent);
  outline-offset: 1px;
}

.action-plan-todo {
  display: grid;
  min-width: 0;
  padding: 2px 0;
  border: 0;
  border-radius: 6px;
  background: transparent;
  transition: border-color 0.15s ease, background 0.15s ease, box-shadow 0.15s ease;
}

.action-plan-todo:hover,
.action-plan-todo:focus-within {
  background: color-mix(in srgb, var(--accent-soft) 34%, transparent);
  box-shadow: none;
}

.action-plan-todo.is-dragging {
  opacity: 0.6;
}

.action-plan-todo.is-drop-target {
  border-color: var(--accent);
  box-shadow: inset 0 0 0 1px var(--accent);
}

.action-plan-todo.depth-1 {
  margin-left: 26px;
}

.action-plan-todo.depth-2 {
  margin-left: 52px;
}

.todo-main {
  display: grid;
  grid-template-columns: 22px 26px minmax(220px, 1fr) minmax(150px, 190px) minmax(130px, 150px) 30px;
  align-items: center;
  gap: 10px;
  min-width: 0;
  min-height: 42px;
}

.todo-delete {
  display: inline-grid;
  width: 30px;
  height: 30px;
  place-items: center;
  border: 1px solid transparent;
  border-radius: 7px;
  background: transparent;
  color: var(--muted);
  font: inherit;
  font-size: 18px;
  line-height: 1;
  cursor: pointer;
  border-color: #ead2cd;
  background: #fff8f7;
  color: #9d3f33;
  opacity: 1;
}

.action-plan-todo:hover .todo-delete,
.action-plan-todo:focus-within .todo-delete,
.todo-delete:focus-visible {
  opacity: 1;
}

.todo-delete:hover,
.todo-delete:focus-visible {
  border-color: #d9b7b0;
  background: #fff3f1;
  color: #9d3f33;
}

.todo-check {
  display: inline-grid;
  place-items: center;
  width: 26px;
  height: 26px;
  cursor: pointer;
}

.todo-check input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.todo-check span {
  width: 18px;
  height: 18px;
  border: 1px solid var(--line-strong, var(--line));
  border-radius: 5px;
  background: var(--panel);
}

.todo-check input:checked + span {
  border-color: var(--accent);
  background: var(--accent);
}

.todo-check input:checked + span::after {
  content: "✓";
  display: grid;
  place-items: center;
  color: white;
  font-size: 13px;
  font-weight: 900;
  line-height: 18px;
}

.todo-title {
  min-width: 0;
  min-height: 38px;
  padding: 7px 8px;
  border-color: transparent;
  background: transparent;
  box-shadow: none;
  font-size: 15.5px;
  font-weight: 650;
  line-height: 1.3;
}

.todo-title:focus {
  border-color: transparent;
  outline: 2px solid color-mix(in srgb, var(--accent) 24%, transparent);
  outline-offset: 2px;
}

.action-plan-todo.is-done .todo-title {
  color: var(--muted);
  text-decoration: line-through;
}

.todo-owner {
  width: 100%;
  min-width: 150px;
  max-width: none;
  min-height: 34px;
  padding: 5px 28px 5px 12px;
  border-color: color-mix(in srgb, var(--accent) 16%, var(--accent-soft));
  border-radius: 999px;
  background: var(--accent-soft);
  color: var(--accent);
  font-size: 12.5px;
  font-weight: 800;
}

.todo-drag {
  width: 22px;
  height: 34px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--panel);
  color: var(--muted);
  font-weight: 800;
}

.todo-drag {
  cursor: grab;
  opacity: 0;
}

.action-plan-todo:hover .todo-drag,
.action-plan-todo:focus-within .todo-drag {
  opacity: 1;
}

.action-plan-review-list {
  display: grid;
  gap: 10px;
}

.action-plan-review-list h3 {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
  text-transform: uppercase;
}

.action-plan-review-list ul {
  display: grid;
  gap: 6px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.action-plan-review-list li {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  padding: 8px 0;
  border-bottom: 1px solid var(--line);
  font-size: 13px;
}

.agent-quick-actions {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.agent-quick-actions button {
  min-height: 34px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--bg);
  color: var(--text);
  font-weight: 700;
}

.action-plan-rail {
  --standard-workshop-rail-height: calc(100vh - 224px);
  width: 100%;
  max-width: none;
}

.launch-workshop-rail .agentic-v2-rail-body {
  display: flex;
  gap: 0;
  padding: 0;
}

.agentic-request-box .workbench-voice-status:empty {
  display: none;
}

@media (max-width: 1320px) {
  .action-plan-workshop .todo-main {
    grid-template-columns: 20px 24px minmax(0, 1fr) minmax(112px, 126px) 30px;
    gap: 6px 8px;
  }

  .action-plan-workshop .todo-title {
    grid-column: 3 / 5;
    font-size: 14px;
  }

  .action-plan-workshop .todo-owner {
    grid-column: 3;
    min-width: 120px;
    padding-right: 24px;
    padding-left: 10px;
    font-size: 12px;
  }

  .action-plan-workshop .todo-date {
    grid-column: 4;
    padding-right: 6px;
    padding-left: 8px;
    font-size: 12px;
  }

  .action-plan-workshop .todo-delete {
    grid-column: 5;
    grid-row: 1 / 3;
    opacity: 1;
  }
}

.action-plan-confirm-backdrop {
  position: fixed;
  inset: 0;
  z-index: 130;
  display: grid;
  place-items: center;
  padding: 18px;
  background: rgba(20, 24, 22, 0.34);
}

.action-plan-confirm-backdrop[hidden] {
  display: none;
}

.action-plan-confirm {
  width: min(460px, 100%);
  padding: 24px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--panel);
  box-shadow: 0 22px 60px rgba(20, 24, 22, 0.22);
  text-align: center;
}

.action-plan-confirm h2 {
  margin: 6px 0 10px;
  color: var(--text);
  font-size: 23px;
  line-height: 1.15;
}

.action-plan-confirm p:not(.modal-eyebrow) {
  margin: 0;
  color: var(--muted);
  font-size: 14px;
  line-height: 1.55;
}

.action-plan-confirm-actions {
  display: flex;
  justify-content: center;
  gap: 10px;
  margin-top: 20px;
}

@media (max-width: 980px) {
  .action-plan-layout {
    grid-template-columns: 1fr;
  }

  .action-plan-rail {
    max-width: none;
    position: static;
  }

  .action-plan-tools,
  .todo-main {
    display: grid;
    grid-template-columns: 22px 28px minmax(0, 1fr);
  }

  .todo-owner,
  .todo-date {
    grid-column: 3;
  }

  .action-plan-todo.depth-1,
  .action-plan-todo.depth-2 {
    margin-left: 0;
    padding-left: 0;
  }

  .todo-drag {
    opacity: 1;
  }

  .action-plan-group header {
    align-items: start;
  }

  .action-plan-group-title {
    align-items: flex-start;
    flex-direction: column;
  }

  .action-plan-group-meta {
    justify-content: flex-start;
  }
}

/* --- Rendu markdown partage : blocs de code et listes de taches --- */

.doc-read .rich-markdown-code,
.jb-rich-text .rich-markdown-code {
  margin: 14px 0;
  padding: 12px 14px;
  border: 1px solid var(--line);
  border-left: 3px solid var(--accent);
  border-radius: 9px;
  background: var(--surface-soft, #f6f8f5);
  font-size: 12.5px;
  line-height: 1.55;
  white-space: pre-wrap;
  word-break: break-word;
  overflow-x: auto;
}

.doc-read .rich-markdown-code code,
.jb-rich-text .rich-markdown-code code {
  padding: 0;
  border: 0;
  background: none;
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: inherit;
  color: var(--text);
}

.doc-read .rich-markdown-task-list,
.jb-rich-text .rich-markdown-task-list {
  margin: 12px 0;
  padding-left: 0;
  list-style: none;
  display: grid;
  gap: 6px;
}

.doc-read .rich-markdown-task,
.jb-rich-text .rich-markdown-task {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 9px;
  align-items: start;
  padding: 6px 9px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel);
  line-height: 1.5;
}

.doc-read .rich-markdown-task input[type="checkbox"],
.jb-rich-text .rich-markdown-task input[type="checkbox"] {
  margin: 3px 0 0;
  width: 14px;
  height: 14px;
  accent-color: var(--accent);
}

.doc-read .rich-markdown-task.checked span,
.jb-rich-text .rich-markdown-task.checked span {
  color: var(--muted);
  text-decoration: line-through;
}