/* Generated by tools/build_design_css.py from design/components.css: do not edit by hand. */
/* AIC Crisis Simulation interface: component classes of the charter. Every value comes from design/tokens.json
   through a variable (no literal colour); tools/build_design_css.py prefixes them --aic- in static/aic-components.css.
   Two themes from the same classes: All navy (default) and Light cards (account option).
   Prefix aic- so the classes can live beside the current page styles during the migration, screen by screen. */

.aic {
  font-family: var(--aic-font-sans);
  font-size: 13px;
  line-height: 20px;
  color: var(--aic-ink);
  background: var(--aic-ground);
}
.aic *,
.aic *::before,
.aic *::after {
  box-sizing: border-box;
}
.aic :focus-visible {
  outline: 2px solid var(--aic-focus);
  outline-offset: 2px;
}

/* ── Button ── */
.aic-btn {
  display: inline-flex;
  align-items: center;
  gap: var(--aic-space-1);
  min-height: 32px;
  padding: 0 var(--aic-space-3);
  border-radius: var(--aic-radius-sm);
  border: 1px solid var(--aic-line-strong);
  background: transparent;
  color: var(--aic-ink);
  font: 600 13px/18px var(--aic-font-sans);
  cursor: pointer;
  white-space: nowrap;
}
.aic-btn:hover {
  background: var(--aic-surface-sunk);
}
.aic-btn--primary {
  background: var(--aic-action);
  border-color: var(--aic-action);
  color: var(--aic-on-action);
}
.aic-btn--primary:hover {
  background: var(--aic-action);
  filter: brightness(1.08);
}
.aic-btn--quiet {
  border-color: transparent;
  color: var(--aic-ink-2);
}
.aic-btn--danger {
  border-color: transparent;
  color: var(--aic-late);
}
.aic-btn--warn {
  border-color: transparent;
  color: var(--aic-wait);
}
.aic-btn--add {
  background: var(--aic-gold);
  border-color: var(--aic-gold);
  color: var(--aic-navy);
}
.aic-btn--add:hover { /* the gold stays under the mouse (the plain hover painted it dark, its navy text unreadable) */
  background: var(--aic-gold);
  filter: brightness(1.08);
}
.aic-btn--large {
  min-height: 40px;
  padding: 0 26px;
  font-size: 14px;
}
.aic-btn:disabled {
  opacity: 0.45;
  cursor: default;
}

/* ── Tag: team, channel, state ── */
.aic-tag {
  display: inline-flex;
  align-items: center;
  gap: var(--aic-space-1);
  padding: 1px 8px;
  border-radius: var(--aic-radius-sm);
  font: 700 11px/16px var(--aic-font-sans);
  letter-spacing: 0.04em;
  white-space: nowrap;
}
.aic-tag--team {
  color: var(--aic-on-dark);
  background: var(--aic-team-1);
}
.aic-tag--email {
  color: var(--aic-email);
  background: var(--aic-email-bg);
}
.aic-tag--sms {
  color: var(--aic-sms);
  background: var(--aic-sms-bg);
}
.aic-tag--call {
  color: var(--aic-call);
  background: var(--aic-call-bg);
}
.aic-tag--meeting {
  color: var(--aic-meeting);
  background: var(--aic-meeting-bg);
}
.aic-tag--wait {
  color: var(--aic-wait);
  background: var(--aic-wait-bg);
}
.aic-tag--late {
  color: var(--aic-late);
  background: var(--aic-late-bg);
}
.aic-tag--ai {
  color: var(--aic-ai);
  background: var(--aic-ai-bg);
}
.aic-tag--done {
  color: var(--aic-reply);
  background: var(--aic-reply-bg);
}
.aic-tag--in {
  color: var(--aic-inject);
  background: var(--aic-inject-bg);
}
.aic-pill {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  height: 30px;
  padding: 0 12px;
  border-radius: var(--aic-radius-pill);
  border: 1px solid var(--aic-line-strong);
  background: transparent;
  color: var(--aic-ink-2);
  font: 600 12px/16px var(--aic-font-sans);
  cursor: pointer;
  white-space: nowrap;
}
.aic-pill[aria-pressed="true"] {
  border-color: var(--aic-ink-2);
  background: var(--aic-surface-raised);
  color: var(--aic-ink);
}
.aic-pill--warn {
  border-color: var(--aic-wait);
  background: var(--aic-wait-bg);
  color: var(--aic-wait);
}
.aic-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--aic-team-1-dot);
}
[data-aic-theme="light"] .aic-dot {
  background: var(--aic-team-1); /* the light dot was 1.7:1 on the paper */
}

/* ── Field ── */
.aic-field {
  display: flex;
  flex-direction: column;
  gap: var(--aic-space-1);
  min-width: 0;
}
.aic-field > label,
.aic-label {
  font: 700 11px/14px var(--aic-font-sans);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--aic-ink-3);
}
.aic-field .aic-hint {
  font: 400 12px/18px var(--aic-font-sans);
  color: var(--aic-ink-3);
}
.aic-input {
  width: 100%;
  min-height: 34px;
  padding: 6px var(--aic-space-3);
  border: 1px solid var(--aic-line-strong);
  border-radius: var(--aic-radius-sm);
  background: var(--aic-field);
  color: var(--aic-ink);
  font: 400 13px/20px var(--aic-font-sans);
}
textarea.aic-input {
  min-height: 64px;
  font-size: 14px;
  line-height: 22px;
  resize: vertical;
}
.aic-input:focus {
  outline: 2px solid var(--aic-focus);
  outline-offset: 0;
}
.aic-field--error .aic-input {
  border-color: var(--aic-late);
}
.aic-field--error .aic-hint {
  color: var(--aic-late);
}

/* ── Section (Frame and Scenario panels) ── */
.aic-section {
  background: var(--aic-surface);
  border: 1px solid var(--aic-line);
  border-radius: var(--aic-radius-lg);
  padding: var(--aic-space-5) 26px;
  display: flex;
  flex-direction: column;
  gap: var(--aic-space-4);
  box-shadow: var(--aic-shadow-1);
}
.aic-section__head {
  display: flex;
  align-items: center;
  gap: 14px;
  flex-wrap: wrap;
}
.aic-section__num {
  font: 600 26px/1 var(--aic-font-display);
  color: var(--aic-gold-ink);
}
.aic-section__title {
  margin: 0;
  font: 600 18px/24px var(--aic-font-sans);
}
.aic-section__sub {
  font: 400 13px/18px var(--aic-font-sans);
  color: var(--aic-ink-3);
}
.aic-section__acts {
  margin-left: auto;
  display: flex;
  gap: var(--aic-space-2);
  flex-wrap: wrap;
}

/* ── Cell card (Frame) ── */
.aic-cell {
  background: var(--aic-surface-raised);
  border: 1px solid var(--aic-line);
  border-radius: var(--aic-radius-md);
  padding: var(--aic-space-4);
  display: flex;
  flex-direction: column;
  gap: var(--aic-space-3);
  min-width: 0;
}
.aic-cell--instance {
  border-color: var(--aic-teal);
}
.aic-cell__name {
  height: 38px;
  font: 600 16px var(--aic-font-sans);
}
.aic-cell__code {
  font: 500 11px var(--aic-font-mono);
  color: var(--aic-ink-3);
}
.aic-well {
  padding: var(--aic-space-3);
  border-radius: 8px;
  background: var(--aic-surface-sunk);
  border: 1px solid var(--aic-line);
  display: flex;
  flex-direction: column;
  gap: var(--aic-space-2);
}
.aic-segmented {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: minmax(0, 1fr);
  border: 1px solid var(--aic-line-strong);
  border-radius: 6px;
  overflow: hidden;
}
.aic-segmented button {
  height: 32px;
  border: 0;
  background: transparent;
  color: var(--aic-ink-2);
  font: 600 13px var(--aic-font-sans);
  cursor: pointer;
}
.aic-segmented button[aria-pressed="true"] {
  background: var(--aic-action);
  color: var(--aic-on-action);
}

/* ── Sheet and detail panel (actor sheet, SharePoint document, Follow history) ── */
.aic-sheet {
  width: 420px;
  max-width: 100%;
  background: var(--aic-surface-sunk);
  border-left: 1px solid var(--aic-line);
  box-shadow: var(--aic-shadow-3);
  display: grid;
  grid-template-columns: minmax(0, 1fr); /* a long name without spaces stays inside the window */
  grid-template-rows: auto auto minmax(0, 1fr);
  min-height: 0;
}
.aic-sheet__head {
  padding: var(--aic-space-4) 20px var(--aic-space-3);
  display: flex;
  flex-direction: column;
  gap: var(--aic-space-2);
  border-bottom: 1px solid var(--aic-line);
}
.aic-sheet__title {
  margin: 0;
  font: 600 21px/26px var(--aic-font-display);
  overflow-wrap: anywhere;
}
.aic-sheet__body {
  padding: 14px 20px;
  display: flex;
  flex-direction: column;
  gap: var(--aic-space-3);
  overflow: auto;
}
.aic-msg--current {
  border: 2px solid var(--aic-gold);
}
.aic-msg--conv {
  border: 1px dashed var(--aic-gold);
}
/* « Ce poste s'appelle John ? », at the head of the reply (namecatch.js) */
.aic-nameask {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  width: fit-content;
  max-width: 100%;
  box-sizing: border-box;
  padding: 8px 14px;
  border: 1px dashed var(--aic-gold);
  border-radius: var(--aic-radius-md);
  background: var(--aic-surface-raised);
  font: 500 13px/20px var(--aic-font-sans);
  color: var(--aic-ink-2);
}

/* ── Popover and window (timeline card, gaps window, Templates menu) ── */
.aic-popover {
  width: 400px;
  max-width: calc(100vw - 32px);
  border-radius: 12px;
  background: var(--aic-surface);
  border: 1px solid var(--aic-line-strong);
  box-shadow: var(--aic-shadow-3);
  padding: 14px var(--aic-space-4);
  display: flex;
  flex-direction: column;
  gap: var(--aic-space-2);
}
.aic-popover--wait {
  border-color: var(--aic-wait);
}

/* ── Menu ── */
.aic-menu {
  min-width: 240px;
  background: var(--aic-surface-raised);
  border: 1px solid var(--aic-line);
  border-radius: var(--aic-radius-md);
  box-shadow: var(--aic-shadow-3);
  padding: var(--aic-space-1) 0;
}
.aic-menu__label {
  font: 700 11px/14px var(--aic-font-sans);
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--aic-ink-3);
  padding: var(--aic-space-2) var(--aic-space-4) var(--aic-space-1);
}
.aic-menu__item {
  display: block;
  width: 100%;
  text-align: left;
  padding: var(--aic-space-2) var(--aic-space-4);
  border: 0;
  background: none;
  font: 400 13px/20px var(--aic-font-sans);
  color: var(--aic-ink);
  cursor: pointer;
}
.aic-menu__item:hover {
  background: var(--aic-surface-sunk);
}
.aic-menu__item--danger {
  color: var(--aic-late);
}
.aic-menu hr {
  border: 0;
  border-top: 1px solid var(--aic-line);
  margin: var(--aic-space-1) 0;
}

/* ── Queue row (Run, "À traiter") ── */
.aic-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 46px;
  gap: var(--aic-space-3);
  padding: 13px 20px;
  border-bottom: 1px solid var(--aic-line);
  cursor: pointer;
}
.aic-row[aria-selected="true"] {
  background: var(--aic-surface-raised);
}
.aic-row__head {
  font: 700 11px/14px var(--aic-font-sans);
  letter-spacing: 0.08em;
  color: var(--aic-team-1-dot);
}
.aic-row__who {
  font: 600 14px/20px var(--aic-font-sans);
}
.aic-row__meta,
.aic-row__state {
  font: 400 12px/18px var(--aic-font-sans);
  color: var(--aic-ink-3);
}
.aic-row__preview {
  font: 400 12px/18px var(--aic-font-sans);
  color: var(--aic-ink-2);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.aic-ring {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
  font: 600 12px var(--aic-font-mono);
  color: var(--aic-ink-3);
}
.aic-row--wait .aic-ring {
  color: var(--aic-wait);
}
.aic-row--late .aic-ring {
  color: var(--aic-late);
}

/* ── Message and AI draft ── */
.aic-msg {
  max-width: 64%;
  padding: 11px 15px;
  border-radius: var(--aic-radius-md);
  font: 400 14px/22px var(--aic-font-sans);
  white-space: pre-wrap;
}
.aic-msg__meta {
  font: 400 12px/18px var(--aic-font-sans);
  color: var(--aic-ink-3);
  display: flex;
  flex-wrap: wrap;
  gap: 0 var(--aic-space-2);
  align-items: baseline;
  margin-bottom: 4px;
}
/* the time stays whole beside a long name (« 13:5 » then « 4 ») */
.aic-msg__meta > span {
  white-space: nowrap;
}
.aic-msg__meta b {
  color: var(--aic-ink);
  font-weight: 600;
}
.aic-msg--team {
  align-self: flex-end;
  background: var(--aic-reply-bg);
  border: 1px solid var(--aic-reply-line);
}
.aic-msg--facilitator {
  align-self: flex-start;
  background: var(--aic-surface-raised);
  border: 1px solid var(--aic-line);
}
.aic-draft {
  background: var(--aic-surface);
  border: 1px solid var(--aic-line);
  border-top: 2px solid var(--aic-gold);
  border-radius: 12px;
  box-shadow: var(--aic-shadow-2);
  padding: 12px var(--aic-space-4) 14px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  min-width: 0;
}
.aic-draft__options,
.aic-draft__acts {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
  min-width: 0;
}
.aic-draft__acts {
  padding-top: 10px;
  border-top: 1px solid var(--aic-line);
}
/* one height for the whole row: « Envoyer » stands out by its colour, not by its size */
body:not(.fphone) .aic-draft__acts > .aic-btn,
body:not(.fphone) .aic-draft__acts > #voice-btns > .aic-btn {
  min-height: 40px;
}

/* ── Timeline strip (Run: prepared injects) ── */
.aic-timeline {
  display: grid;
  grid-template-columns: 270px minmax(0, 1fr) 150px;
  align-items: center;
  gap: 18px;
  padding: 0 20px;
  min-height: 104px;
  background: var(--aic-surface-sunk);
  border-bottom: 1px solid var(--aic-gold);
}
.aic-timeline__track {
  position: relative;
  height: 104px;
}
.aic-timeline__marker {
  position: absolute;
  top: 10px;
  transform: translateX(-50%);
  display: inline-flex;
  align-items: center;
  gap: 6px;
  height: 28px;
  padding: 0 10px;
  border-radius: var(--aic-radius-pill);
  border: 1px solid var(--aic-line-strong);
  background: var(--aic-surface);
  color: var(--aic-ink);
  font: 600 12px var(--aic-font-sans);
  white-space: nowrap;
  cursor: pointer;
}
.aic-timeline__marker--ready {
  border: 2px solid var(--aic-wait);
  background: var(--aic-wait-bg);
}
.aic-timeline__now {
  position: absolute;
  top: 7px; /* as far above the « now » label (38-51) as below it, the times below stay readable */
  bottom: 22px;
  width: 2px;
  background: var(--aic-teal);
}

/* ── Top bar ── */
.aic-top {
  position: relative;
  height: 56px;
  display: flex;
  align-items: center;
  gap: 20px;
  padding: 0 20px;
  background: var(--aic-frame);
  color: var(--aic-on-dark);
  border-bottom: 1px solid var(--aic-gold);
}
.aic-top__brand {
  font: 700 11px/14px var(--aic-font-sans);
  letter-spacing: 0.22em;
  color: var(--aic-teal);
}
.aic-top__name {
  font: 600 17px/22px var(--aic-font-display);
  white-space: nowrap;
}
.aic-top__clock {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  height: 30px;
  padding: 0 12px;
  border-radius: var(--aic-radius-pill);
  border: 1px solid var(--aic-teal);
  font: 600 13px var(--aic-font-mono);
  color: var(--aic-teal);
}
.aic-top__day { /* the scenario's day of play, beside the clock */
  font: 600 12px var(--aic-font-sans);
  color: var(--aic-gold-ink);
  white-space: nowrap;
}
.aic-tabs {
  display: flex;
  gap: var(--aic-space-1);
  margin: 0 auto;
  height: 56px;
}
.aic-tab {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 0 14px;
  color: var(--aic-on-dark);
  opacity: 0.72;
  text-decoration: none;
  font: 600 13px var(--aic-font-sans);
  border-bottom: 2px solid transparent;
}
.aic-tab[aria-current="page"] {
  opacity: 1;
  border-bottom-color: var(--aic-teal);
}
.aic-tab__count {
  font: 700 11px/16px var(--aic-font-sans);
  padding: 0 7px;
  border-radius: var(--aic-radius-pill);
  background: var(--aic-teal);
  color: var(--aic-navy);
}
.aic-tab__count--late {
  background: var(--aic-late);
}

/* ══ Run screen (Piloter): timeline strip, À traiter column, conversation and draft ══ */
.aic-run.on {
  flex-direction: column;
  background: var(--aic-ground);
  color: var(--aic-ink);
}
.aic-run__body {
  flex: 1;
  min-height: 0;
  display: grid;
  grid-template-columns: var(--run-queue-w, 392px) minmax(0, 1fr);
}
.aic-run__queue {
  position: relative;
  display: flex;
  flex-direction: column;
  min-height: 0;
  background: var(--aic-surface-sunk);
  border-right: 1px solid var(--aic-line);
}
/* its right edge, moved with the mouse (pilot.js runQueueGrip) */
.aic-run__grip {
  position: absolute;
  top: 0;
  bottom: 0;
  right: -4px;
  width: 8px;
  cursor: col-resize;
  z-index: 3;
}
.aic-run__grip:hover,
.aic-run__grip.on {
  background: color-mix(in srgb, var(--aic-teal) 35%, transparent);
}
.fphone .aic-run__grip {
  display: none;
}
.aic-run__qhead {
  padding: 16px 20px 10px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.aic-run__switch { /* « À traiter » or « Mes acteurs » (actorlist.js); four views, each on one line */
  max-width: 100%;
  display: flex;
  flex-wrap: wrap;
}
.aic-run__switch button {
  flex: 1 1 auto;
  padding: 0 9px;
  white-space: nowrap;
}
.aic-run__count {
  font: 400 12px var(--aic-font-sans);
  color: var(--aic-ink-3);
}
.aic-run__pilot {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  font-size: 12px;
  color: var(--aic-ink-3);
}
.aic-run__keys {
  display: flex;
  gap: 14px;
  flex-wrap: wrap;
  font-size: 11px;
  color: var(--aic-ink-3);
}
.aic-run__keys kbd {
  font: 11px var(--aic-font-mono);
  padding: 1px 5px;
  border-radius: 3px;
  border: 1px solid var(--aic-line-strong);
}
.aic-run__list {
  flex: 1;
  min-height: 0;
  overflow-y: auto;
  border-top: 1px solid var(--aic-line);
}
.aic-run__empty {
  padding: 32px 20px;
  text-align: center;
  color: var(--aic-ink-3);
  line-height: 1.6;
  display: flex;
  flex-direction: column;
  gap: 12px;
  align-items: center;
}
.aic-run__work {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  grid-template-rows: auto auto minmax(0, 1fr) auto;
  min-height: 0;
  min-width: 0;
}
/* each part keeps its row, the « back » button being hidden on a computer: the thread scrolls,
   the reply stays visible below it */
.aic-run__work > .aic-run__whead {
  grid-row: 2;
}
.aic-run__work > .aic-thread {
  grid-row: 3;
}
.aic-run__work > .aic-draft {
  grid-row: 4;
}
/* On a wide screen the message one answers and
   the reply sit side by side — the conversation whole on the left, the reply with its full height on the right, its
   buttons always in view; the actor played and the team answered in one band across. Narrower, or on a phone: one
   under the other, as before. */
@media (min-width: 1200px) {
  body:not(.fphone) .aic-run__work:has(> .aic-draft) {
    grid-template-columns: minmax(0, 0.8fr) minmax(500px, 1.2fr);
    grid-template-rows: auto minmax(0, 1fr);
  }
  body:not(.fphone) .aic-run__work:has(> .aic-draft) > .aic-run__whead {
    grid-row: 1;
    grid-column: 1 / -1;
    padding: 18px 28px 20px;
    background: var(--aic-surface-sunk);
  }
  body:not(.fphone) .aic-run__work:has(> .aic-draft) > .aic-thread {
    grid-row: 2;
    grid-column: 1;
    padding: 22px 28px;
    gap: 16px;
  }
  body:not(.fphone) .aic-run__work:has(> .aic-draft) > .aic-thread .aic-msg {
    max-width: 100%;
    font-size: 14.5px;
    line-height: 1.6;
  }
  body:not(.fphone) .aic-run__work:has(> .aic-draft) > .aic-draft {
    grid-row: 2;
    grid-column: 2;
    margin: 14px 22px 14px 18px;
    min-height: 0;
    overflow-y: auto;
    gap: 8px;
  }
  body:not(.fphone) .aic-run__work:has(> .aic-draft) > .aic-draft > * {
    flex-shrink: 0;
  }
  body:not(.fphone) .aic-run__work:has(> .aic-draft) > .aic-draft > #draft-text {
    flex: 1 1 0;
    field-sizing: fixed;
    min-height: 80px;
    max-height: none;
    resize: none;
    font-size: 14.5px;
    line-height: 1.6;
  }
  body:not(.fphone) .aic-run__work:has(> .aic-draft) .aic-draft__acts .aic-btn {
    min-height: 34px;
    padding: 0 12px;
  }
  body:not(.fphone) .aic-run__work:has(> .aic-draft) .aic-draft__acts {
    padding-top: 8px;
    gap: 6px;
  }
  body:not(.fphone) .aic-run__work:has(> .aic-draft) .aic-draft__more-acts {
    gap: 4px;
  }
  body:not(.fphone) .aic-run__work:has(> .aic-draft) .aic-draft__more-acts .aic-btn {
    padding: 0 8px;
  }
}
/* the list of Piloter as cards, the one open outlined */
.aic-run__list .aic-row {
  margin: 5px 6px;
  padding: 13px 14px;
  border: 0;
  border-radius: 14px;
  background: var(--aic-surface);
}
.aic-run__list .aic-row[aria-selected="true"] {
  background: var(--aic-surface-raised);
  box-shadow: 0 0 0 1px var(--aic-teal), var(--aic-shadow-1);
}
/* an attachment in the thread reads on both backgrounds */
.aic-msg .att a {
  color: var(--aic-teal-ink);
}
.aic-run__whead {
  display: flex;
  align-items: center;
  gap: 12px 16px;
  flex-wrap: wrap;
  padding: 16px 28px;
  border-bottom: 1px solid var(--aic-line);
}
.aic-avatar {
  width: 52px;
  height: 52px;
  border-radius: 50%;
  border: 0;
  display: grid;
  place-items: center;
  font: 600 17px var(--aic-font-sans);
  color: var(--aic-on-dark);
  background: var(--aic-team-1);
  box-shadow: 0 0 0 3px var(--aic-ground), 0 0 0 4px var(--aic-gold);
  cursor: pointer;
  flex-shrink: 0;
}
.aic-run__name {
  margin: 0;
  font: 600 24px/30px var(--aic-font-display);
  color: var(--aic-ink);
  cursor: pointer;
}
.aic-run__role {
  font-size: 13px;
  color: var(--aic-ink-3);
}
.aic-run__role b {
  color: var(--aic-ink);
  font-weight: 600;
}
.aic-run__wtools {
  margin-left: auto;
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}
.aic-run__summary {
  padding: 10px 28px;
  font-size: 13px;
  color: var(--aic-ink-2);
  background: var(--aic-surface-sunk);
  border-bottom: 1px solid var(--aic-line);
}
.aic-run__summary b {
  color: var(--aic-ink);
}
.aic-thread {
  overflow-y: auto;
  min-height: 0;
  padding: 18px 44px 8px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.aic-slot {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-top: 8px;
  padding: 6px 10px;
  border-radius: 6px;
  background: var(--aic-surface-sunk);
  font-size: 13px;
}
.aic-rsvp {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
  align-items: center;
  margin-top: 8px;
  font-size: 12px;
  color: var(--aic-ink-3);
}
.aic-run .aic-draft {
  margin: 10px 28px 16px;
}
/* More room to read the AI proposal: the draft grows with its text, up to half the screen */
.aic-draft #draft-text {
  field-sizing: content;
  min-height: 9em;
  max-height: 50vh;
  resize: vertical;
  line-height: 1.55;
}
.aic-draft__head {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  font-size: 13px;
  color: var(--aic-ink-2);
}
.aic-draft__label {
  font: 700 11px var(--aic-font-sans);
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--aic-ai);
}
.aic-draft__state {
  font-size: 12px;
  color: var(--aic-ink-3);
}
.aic-draft__state--ready {
  color: var(--aic-teal-ink);
}
.aic-draft__state--error {
  color: var(--aic-late);
}
.aic-draft__state a {
  color: var(--aic-teal-ink);
}

/* incoming or ongoing live call: docked on top of the À traiter column in Run, floating bottom-left elsewhere */
.aic-call {
  position: fixed;
  left: 16px;
  bottom: 40px;
  z-index: 700;
  width: 360px;
  padding: 12px 14px;
  border-radius: 12px;
  background: var(--aic-frame);
  color: var(--aic-on-dark);
  border: 1px solid var(--aic-teal);
  box-shadow: var(--aic-shadow-3);
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.aic-call__label {
  font: 700 11px var(--aic-font-sans);
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--aic-teal);
}
.aic-call__who {
  font: 600 14px var(--aic-font-sans);
}
.aic-call__sub {
  font-size: 12px;
  color: var(--aic-ink-2);
}
.aic-call__tm {
  font: 600 12px var(--aic-font-mono);
  color: var(--aic-teal);
}
.aic-call__btns {
  display: flex;
  gap: 6px;
  margin-top: 4px;
}
/* the actor's brief at hand during the call, and a second call shown waiting */
.aic-call__brief {
  margin-top: 4px;
  padding: 6px 9px;
  border-radius: 8px;
  background: var(--aic-surface);
  color: var(--aic-ink-2);
  font-size: 12px;
  line-height: 1.45;
}
.aic-call__brief:empty {
  display: none;
}
.aic-call__brief b {
  color: var(--aic-ink);
  font-weight: 600;
}
.aic-call__wait {
  margin-top: 4px;
  padding: 5px 9px;
  border: 1px solid var(--aic-wait);
  border-radius: 8px;
  color: var(--aic-wait);
  font-size: 12px;
  line-height: 1.4;
}
/* on a phone the call takes the whole screen, like a phone call */
.aic-call.aic-call--full {
  position: fixed;
  inset: 0;
  width: auto;
  margin: 0;
  z-index: 900;
  padding: 28px 20px 24px;
  gap: 12px;
  border: none;
  border-radius: 0;
}
.aic-call--full .aic-call__label {
  margin-top: 8px;
  font: 600 24px/1.25 var(--aic-font-display);
  letter-spacing: 0;
  text-transform: none;
  text-align: center;
}
.aic-call--full .aic-call__who {
  font-size: 16px;
  text-align: center;
}
.aic-call--full .aic-call__sub,
.aic-call--full .aic-call__tm {
  text-align: center;
}
.aic-call--full .aic-call__tm {
  font-size: 22px;
}
.aic-call--full .aic-call__brief,
.aic-call--full .aic-call__wait {
  font-size: 14px;
}
.aic-call--full .aic-call__btns {
  margin-top: auto;
  justify-content: space-around;
}
.aic-call--full .aic-call__btns .aic-btn {
  padding: 14px 20px;
  font-size: 16px;
}

/* timeline of prepared injects */
/* a marker at either end opens towards the inside, so that it never covers the text beside the track */
.aic-timeline__marker--start {
  transform: none;
}
.aic-timeline__marker--end {
  transform: translateX(-100%);
}
.aic-timeline {
  position: relative;
  z-index: 5;
  flex-shrink: 0;
}
.aic-timeline__summary {
  display: flex;
  flex-direction: column;
  gap: 3px;
  min-width: 0;
}
.aic-timeline__eyebrow {
  font: 700 11px var(--aic-font-sans);
  letter-spacing: 0.14em;
  color: var(--aic-gold-ink);
}
.aic-timeline__next {
  font-size: 12px;
  color: var(--aic-ink-3);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.aic-timeline__next b {
  color: var(--aic-ink);
  font-weight: 600;
}
.aic-timeline__line {
  position: absolute;
  left: 0;
  right: 0;
  top: 46px;
  height: 2px;
  background: var(--aic-line-strong);
  opacity: 0.5;
}
.aic-timeline__sent {
  position: absolute;
  top: 41px;
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: var(--aic-teal);
  opacity: 0.6;
  transform: translateX(-50%);
}
.aic-timeline__tick {
  position: absolute;
  top: 84px;
  transform: translateX(-50%);
  font: 11px var(--aic-font-mono);
  color: var(--aic-ink-3);
  white-space: nowrap;
}
.aic-timeline__now-label {
  position: absolute;
  top: 38px; /* in the gap between the two rows of markers (10-38, 52-80); at 12 px a marker at the
                current time covered it */
  z-index: 1;
  transform: translateX(-50%);
  font: 700 11px var(--aic-font-sans);
  padding: 0 6px;
  border-radius: var(--aic-radius-sm);
  background: var(--aic-teal);
  color: var(--aic-navy);
}
.aic-timeline__marker--low {
  top: 52px;
}
.aic-timeline__marker--late {
  border-style: dashed;
}
.aic-timeline__links {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 6px;
}
.aic-timeline__links button {
  border: 0;
  background: none;
  color: var(--aic-teal-ink);
  font: 600 13px var(--aic-font-sans);
  cursor: pointer;
  text-align: right; /* on two lines in its column rather than over the track or past the screen's edge */
  padding: 0;
}
.aic-timeline__links button + button {
  color: var(--aic-ink-3);
  font-size: 12px;
  font-weight: 400;
}
.aic-timeline .aic-popover {
  position: absolute;
  top: 100px;
  transform: translateX(-50%);
  z-index: 20;
}
.aic-plan-list {
  position: absolute;
  right: 20px;
  top: 100px;
  z-index: 20;
  width: 820px;
  max-width: calc(100vw - 40px);
  max-height: 70vh;
  overflow-y: auto;
}
/* the title takes the width, its actions under it (with them beside it, it was hard to read) */
.aic-plan-row {
  display: grid;
  grid-template-columns: 96px minmax(0, 1fr);
  column-gap: 14px;
  row-gap: 8px;
  align-items: start;
  padding: 14px 0;
  border-top: 1px solid var(--aic-line);
  font-size: 13px;
  line-height: 1.45;
}
.aic-plan-row > :nth-child(3) {
  grid-column: 2;
  justify-content: flex-start !important;
}
.aic-plan-row__time {
  font: 600 12px var(--aic-font-mono);
  color: var(--aic-ink-3);
}
.aic-plan-row__sub {
  font-size: 12px;
  color: var(--aic-ink-3);
}
.aic-plan-menu {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 6px;
}

/* channel badges inside the Run screen (the badge markup is shared with the screens not migrated yet) */
.aic-run .chan,
.aic-follow .chan {
  display: inline-flex;
  align-items: center;
  padding: 1px 8px;
  border: 0;
  border-radius: var(--aic-radius-sm);
  font: 700 11px/16px var(--aic-font-sans);
  letter-spacing: 0.04em;
  white-space: nowrap;
  color: var(--aic-email);
  background: var(--aic-email-bg);
}
.aic-run .chan.sms,
.aic-follow .chan.sms {
  color: var(--aic-sms);
  background: var(--aic-sms-bg);
}
.aic-run .chan.appel,
.aic-follow .chan.appel {
  color: var(--aic-call);
  background: var(--aic-call-bg);
}
.aic-run .chan.invite,
.aic-follow .chan.invite {
  color: var(--aic-meeting);
  background: var(--aic-meeting-bg);
}
/* Teams, the fifth channel */
.aic-run .chan.chat,
.aic-follow .chan.chat {
  color: var(--aic-inject);
  background: var(--aic-inject-bg);
}
.aic-row__head {
  color: var(--aic-ink-2);
  text-transform: uppercase;
}
.aic-row {
  outline-offset: -2px;
}
.aic-row:hover {
  background: var(--aic-surface-raised);
}

/* ══ Top bar of an open exercise: same frame on every screen, all its functions kept ══ */
.aic-top {
  flex-shrink: 0;
  z-index: 5;
}
.aic-top__icon,
.aic-top__ghost {
  height: 32px;
  min-width: 32px;
  display: inline-grid;
  place-items: center;
  padding: 0 10px;
  border-radius: var(--aic-radius-sm);
  border: 1px solid var(--aic-line-strong);
  background: transparent;
  color: var(--aic-on-dark);
  font: 600 12px var(--aic-font-sans);
  cursor: pointer;
  white-space: nowrap;
}
.aic-top__icon {
  padding: 0;
  font-size: 14px;
}
.aic-top__icon:hover,
.aic-top__ghost:hover,
.aic-top__status:hover {
  background: var(--aic-navy-2);
}
.aic-top__rule {
  width: 1px;
  height: 22px;
  background: var(--aic-line-strong);
  flex-shrink: 0;
}
.aic-top__name {
  min-width: 0;
  flex: 0 1 auto;
  overflow: hidden;
  text-overflow: ellipsis;
}
.aic-top__clock {
  background: transparent;
  cursor: pointer;
  white-space: nowrap;
  flex-shrink: 0;
}
.aic-top__clock.paused {
  color: var(--aic-gold);
  border-color: var(--aic-gold);
  font-style: italic;
}
.aic-top .aic-tabs {
  flex-shrink: 0;
}
.aic-tabs__sep {
  width: 1px;
  margin: 18px 6px;
  background: var(--aic-line-strong);
}
.aic-tab {
  background: transparent;
  border-top: 0;
  border-left: 0;
  border-right: 0;
  cursor: pointer;
  white-space: nowrap;
}
.aic-tab:hover {
  opacity: 1;
}
.aic-tab__count.zero {
  display: none;
}
.aic-top__right {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-shrink: 0;
}
.aic-top__status {
  display: inline-flex;
  align-items: center;
  gap: 2px;
  height: 32px;
  padding: 0 8px;
  border: 0;
  border-radius: var(--aic-radius-sm);
  background: transparent;
  color: var(--aic-on-dark);
  font: 400 12px var(--aic-font-sans);
  cursor: pointer;
  min-width: 0;
}
.aic-top__status .dot {
  background: var(--aic-line-strong);
}
.aic-top__status .dot.on {
  background: var(--aic-teal);
}
.aic-top__ai {
  max-width: 170px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.aic-top__presence {
  font-size: 12px;
  color: var(--aic-on-dark);
  opacity: 0.8;
  max-width: 140px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.aic-top__avatar {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: var(--aic-teal);
  color: var(--aic-navy);
  font: 700 11px var(--aic-font-sans);
  flex-shrink: 0;
}
@media (max-width: 1280px) {
  .aic-top {
    gap: 12px;
    padding: 0 12px;
  }
  .aic-top__ai {
    display: none;
  }
  /* the facilitators online as a count, the names in its bubble */
  .aic-top__presence {
    font-size: 0;
    max-width: none;
    opacity: 1;
  }
  .aic-top__presence::before {
    content: "\1F465\00a0" attr(data-n);
    font-size: 12px;
    padding: 2px 8px;
    border-radius: 999px;
    border: 1px solid var(--aic-line-strong);
  }
  .aic-tab {
    padding: 0 10px;
  }
  .aic-follow__panel {
    width: 360px;
  }
}
/* 800 px window: the account button at the right stays fully in view */
@media (max-width: 880px) {
  .aic-top {
    gap: 6px;
    padding: 0 8px;
  }
  .aic-top__right {
    gap: 6px;
  }
  .aic-tab {
    padding: 0 7px;
  }
}
/* a computer's window between 760 and 1000 points (a Windows display at 125 or 150 %): the bar keeps every
   button in view — the brand and the scenario's day go, « + Ajouter » becomes « + » */
@media (max-width: 1000px) {
  .aic-top .aic-top__brand,
  .aic-top .aic-top__rule,
  .aic-top .aic-top__day {
    display: none;
  }
  .aic-top .aic-btn--add {
    padding: 2px 10px;
    font-size: 0;
  }
  .aic-top .aic-btn--add::before {
    content: "+";
    font-size: 20px;
    line-height: 1;
  }
}
/* narrower still, on a computer (a phone has its own layout, .fphone): the four screens and the menu stay */
@media (max-width: 760px) {
  body:not(.fphone) .aic-top__name,
  body:not(.fphone) .aic-top__presence {
    display: none;
  }
  body:not(.fphone) .aic-tab {
    padding: 0 5px;
    font-size: 13px;
  }
  body:not(.fphone) .aic-tabs__sep {
    margin: 18px 2px;
  }
}

/* ══ Follow screen (Suivre): team tracks on a common time axis, history in a panel on the right ══ */
.aic-follow.on {
  flex-direction: column;
  background: var(--aic-ground);
  color: var(--aic-ink);
  overflow-y: auto;
}
.aic-follow__bar,
.aic-follow__filters {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  padding: 10px 24px;
  border-bottom: 1px solid var(--aic-line);
  flex-shrink: 0;
}
/* « Filtrer les échanges »: a drop-down menu under its button (followsearch.js, followFiltersMenu) */
.aic-follow__filters {
  position: absolute;
  z-index: 40;
  flex-direction: column;
  align-items: flex-start;
  gap: 10px;
  padding: 12px 16px;
  border: 1px solid var(--aic-line);
  border-radius: var(--aic-radius-md);
  background: var(--aic-surface-raised);
  box-shadow: var(--aic-shadow-2);
}
.aic-follow__filters .aic-follow__sep {
  display: none;
}
.aic-follow__label,
.aic-follow__hint {
  font-size: 12px;
  color: var(--aic-ink-3);
}
.aic-follow__q {
  position: relative;
  display: inline-flex;
}
.aic-follow__q .aic-input {
  width: 190px;
  min-height: 30px;
  padding-right: 24px;
}
.aic-follow__q .aic-input::-webkit-search-cancel-button {
  display: none;
}
.aic-follow__qx {
  position: absolute;
  right: 4px;
  top: 50%;
  transform: translateY(-50%);
  border: 0;
  background: none;
  color: var(--aic-ink-2);
  font-size: 15px;
  cursor: pointer;
}
.aic-follow__chips {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
}
.aic-follow__chip {
  background: transparent; /* else the browser's button grey (dark grey on the navy ground) */
  display: inline-flex;
  align-items: center;
  gap: 8px;
  height: 30px;
  padding: 0 6px 0 12px;
  border-radius: var(--aic-radius-pill);
  border: 1px solid var(--aic-line-strong);
  color: var(--aic-ink-2);
  font: 600 12px var(--aic-font-sans);
  cursor: pointer;
  user-select: none;
  white-space: nowrap;
}
.aic-follow__chip[aria-pressed="true"] {
  background: var(--aic-surface-raised);
  color: var(--aic-ink);
}
.aic-follow__chipdot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
}
.aic-follow__chipsub {
  font-weight: 400;
  color: var(--aic-ink-3);
}
.aic-follow__pin {
  display: grid;
  place-items: center;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  border: 1px solid var(--aic-line-strong);
  color: var(--aic-ink-3);
}
.aic-follow__pin:hover {
  color: var(--aic-ink);
}
.aic-follow__pin--on {
  border-color: var(--aic-gold);
  background: var(--aic-gold);
  color: var(--aic-navy);
}
.aic-follow__sep {
  width: 1px;
  height: 22px;
  background: var(--aic-line);
}
.aic-follow__check {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 13px;
  color: var(--aic-ink-2);
  cursor: pointer;
  white-space: nowrap;
}
.aic-follow__check input[type="checkbox"] {
  accent-color: var(--aic-teal);
  margin: 0;
}
.aic-follow__check--warn {
  color: var(--aic-wait);
  font-weight: 600;
}
.aic-follow__num {
  width: 56px;
  height: 26px;
  padding: 0 6px;
}
.aic-follow__help {
  margin-left: auto;
}
/* the bar's four views, buttons seen at once (no more « Panneaux ▾ ») */
.aic-follow .aic-follow__views {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  padding-left: 12px;
  border-left: 1px solid var(--aic-line);
}
/* Mener › « Le web en direct »: its two parts, « Publier sur le web » and « Réactions aux équipes » */
.aic-media__sec {
  padding: 14px 20px 6px;
  font: 700 11px/1.3 var(--aic-font-sans);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--aic-ink-3);
}
/* « Publier sur le web »: what the facilitator does, set apart from the teams' posts below it */
.aic-wave__row {
  background: color-mix(in srgb, var(--aic-teal) 14%, transparent);
  box-shadow: inset 4px 0 0 var(--aic-teal);
}
.aic-wave__row:hover,
.aic-wave__row[aria-selected="true"] {
  background: color-mix(in srgb, var(--aic-teal) 24%, transparent);
}
/* what the teams do: a tint of their own, so that they read apart from « Filtrer les échanges » */
.aic-follow .aic-follow__views .aic-follow__pbtn {
  background: color-mix(in srgb, var(--aic-teal) 16%, transparent);
  border-color: color-mix(in srgb, var(--aic-teal) 55%, var(--aic-line));
  color: var(--aic-ink);
}
.aic-follow .aic-follow__views .aic-follow__pbtn:hover {
  background: color-mix(in srgb, var(--aic-teal) 28%, transparent);
}
.aic-follow .aic-follow__legend {
  gap: 6px 24px;
  flex-wrap: wrap;
  align-items: center;
  padding: 8px 24px;
  background: var(--aic-surface-sunk);
  border-bottom: 1px solid var(--aic-line);
  font-size: 12px;
  color: var(--aic-ink-3);
  flex-shrink: 0;
}
.aic-follow .aic-follow__legend span {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.aic-follow .aic-follow__legend .aic-follow__lg {
  gap: 12px;
  white-space: nowrap;
}
.aic-follow .aic-follow__legend .aic-follow__legend-text {
  display: block;
  flex-basis: 100%;
  line-height: 18px;
  color: var(--aic-ink-2);
}
.aic-follow__key {
  width: 6px;
  height: 16px;
  border-radius: 2px;
  display: inline-block;
}
.aic-follow__key--in {
  background: var(--aic-inject);
}
.aic-follow__key--wait {
  background: var(--aic-wait);
}
.aic-follow__key--ok {
  background: var(--aic-reply);
}
.aic-follow__key--late {
  background: var(--aic-late);
}
.aic-follow__key--int {
  background: var(--aic-internal);
}
.aic-follow__main {
  flex: 1 0 auto;
  height: 0;
  min-height: 340px;
  display: flex;
}
.aic-follow__lanes {
  flex: 1;
  min-width: 0;
  display: grid;
  overflow: auto;
  align-content: start;
  column-gap: 18px;
  padding: 0 22px 30px 0;
}
.aic-follow__panel {
  flex-shrink: 0;
  max-width: 46%;
}
/* « Poser une question »: the question and the AI's answer above the tracks (followask.js) */
.aic-follow__ai {
  padding: 10px 24px;
  border-bottom: 1px solid var(--aic-line);
  flex-shrink: 0;
}
.aic-follow__airow {
  display: flex;
  align-items: center;
  gap: 8px;
}
.aic-follow__airow .aic-input {
  flex: 1;
  min-width: 0;
  min-height: 30px;
}
.aic-follow__aiout {
  margin-top: 8px;
  max-height: 34vh;
  overflow-y: auto;
  font-size: 13px;
  color: var(--aic-ink);
}
.aic-follow__aiout:empty {
  display: none;
}
.aic-follow__aitext {
  white-space: pre-wrap;
}
.aic-follow__aihead {
  margin: 8px 0 2px;
  font-size: 12px;
  color: var(--aic-ink-3);
}
.aic-follow__aisrc {
  display: block;
  width: 100%;
  padding: 3px 0;
  border: 0;
  background: none;
  color: var(--aic-teal-ink);
  font: inherit;
  font-size: 12px;
  text-align: left;
  cursor: pointer;
}
.aic-follow__none {
  padding: 40px;
  color: var(--aic-ink-3);
  text-align: center;
}
.aic-follow__axhead {
  position: sticky;
  left: 0;
  top: 0;
  z-index: 3;
  background: var(--aic-ground);
}
.aic-follow__head {
  position: sticky;
  top: 0;
  z-index: 2;
  background: var(--aic-ground);
  padding: 8px 0 6px;
  display: flex;
  flex-direction: column;
  gap: 6px;
  min-width: 0;
}
.aic-follow__team {
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding-bottom: 5px;
  border-bottom: 2px solid var(--aic-line-strong);
}
.aic-follow__name {
  margin: 0;
  font: 600 17px/22px var(--aic-font-display);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.aic-follow__sub {
  font-size: 12px;
  color: var(--aic-ink-3);
}
.aic-follow__sub b {
  color: var(--aic-ink);
  font-weight: 600;
}
.aic-follow__online {
  color: var(--aic-reply);
}
.aic-follow__online--off {
  color: var(--aic-ink-3);
}
.aic-follow__kpis {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
}
.aic-follow__kpi {
  display: flex;
  align-items: baseline;
  gap: 5px;
  padding: 3px 8px;
  border-radius: 6px;
  border: 1px solid var(--aic-line);
  background: var(--aic-surface);
  min-width: 0;
}
.aic-follow__kpi--link {
  cursor: pointer;
}
.aic-follow__kpi--on,
.aic-btn--active {
  outline: 2px solid var(--aic-gold);
}
.aic-follow__kpi--link:hover {
  border-color: var(--aic-line-strong);
}
.aic-follow__v {
  font: 600 15px/1 var(--aic-font-display);
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
}
.aic-follow__l {
  font-size: 11px;
  line-height: 14px;
  white-space: nowrap;
  color: var(--aic-ink-2);
  min-width: 0;
}
.aic-follow__kpi--wait .aic-follow__v {
  color: var(--aic-wait);
}
.aic-follow__kpi--late {
  border-color: var(--aic-late);
}
.aic-follow__kpi--late .aic-follow__v {
  color: var(--aic-late);
}
.aic-follow__kpi--ok .aic-follow__v {
  color: var(--aic-reply);
}
.aic-follow__cols {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--aic-ink-3);
}
.aic-follow__cols span {
  min-width: 0;
}
.aic-follow__cols span:nth-child(2) {
  text-align: center;
  color: var(--aic-internal);
}
.aic-follow__cols span:nth-child(3) {
  text-align: right;
}
.aic-follow__axis {
  position: sticky;
  left: 0;
  z-index: 1;
  background: var(--aic-ground);
  border-right: 1px solid var(--aic-line);
}
.aic-follow__tick {
  position: absolute;
  left: 0;
  right: 10px;
  transform: translateY(-50%);
  white-space: pre;
  font: 400 12px/1.35 var(--aic-font-mono);
  color: var(--aic-ink-3);
  text-align: right;
}
.aic-follow__tick--cut {
  color: var(--aic-wait);
  font-family: var(--aic-font-sans);
  font-weight: 600;
}
.aic-follow__lane {
  position: relative;
  min-width: 0;
}
.aic-ev {
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr);
  gap: 2px 8px;
  align-items: baseline;
  width: 78%;
  padding: 7px 12px 7px 16px;
  border-radius: 8px;
  border: 1px solid var(--aic-line);
  box-shadow: inset 6px 0 0 var(--aic-line-strong);
  background: var(--aic-surface);
  font-size: 13px;
  cursor: pointer;
}
.aic-ev:hover {
  border-color: var(--aic-line-strong);
}
.aic-ev__t {
  font: 400 12px/1.35 var(--aic-font-mono);
  color: var(--aic-ink-3);
  white-space: pre; /* « 31 Oct » over the time, two short lines (monitor.js ovTStack) */
}
.aic-ev__w {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  line-height: 18px;
}
.aic-ev__w b {
  font-weight: 600;
}
.aic-ev__s {
  font-size: 12px;
  font-weight: 600;
  color: var(--aic-ink-3);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
/* the channel « TEAMS » before the relation of an internal exchange */
.aic-ev__s .chan {
  margin-right: 6px;
}
.aic-ev--in .aic-ev__s {
  color: var(--aic-inject);
}
.aic-ev--in {
  background: var(--aic-inject-bg);
  box-shadow: inset 6px 0 0 var(--aic-inject);
}
.aic-ev--late {
  background: var(--aic-late-bg);
  box-shadow: inset 6px 0 0 var(--aic-late);
}
.aic-ev--late .aic-ev__s {
  color: var(--aic-late);
}
.aic-ev--int {
  margin-left: 11%;
  background: var(--aic-internal-bg);
  border-color: var(--aic-internal-line);
  box-shadow: inset 6px 0 0 var(--aic-internal);
}
.aic-ev--int .aic-ev__s {
  color: var(--aic-internal);
}
.aic-ev--wait {
  margin-left: 22%;
  background: var(--aic-wait-bg);
  box-shadow: inset 6px 0 0 var(--aic-wait);
}
.aic-ev--wait .aic-ev__s {
  color: var(--aic-wait);
}
.aic-ev--ok {
  margin-left: 22%;
  background: var(--aic-reply-bg);
  box-shadow: inset 6px 0 0 var(--aic-reply);
}
.aic-ev--ok .aic-ev__s {
  color: var(--aic-reply);
}
/* one click on a row: its conversation stays forward, the rest of the tracks fades */
.aic-ev {
  transition: opacity 0.15s;
}
.aic-follow__lanes--focus .aic-ev:not(.aic-ev--conv):not(.aic-ev--sel) {
  opacity: 0.35;
}
.aic-ev--conv {
  outline: 2px dashed var(--aic-gold);
  outline-offset: 1px;
}
/* Suivre: on a computer each team in its own panel; its name, cell
   and people on one line, its figures as pills; each card reads whole (who writes to whom and the subject on up to
   two lines instead of one cut line). Same reading: received left, internal centre, sent right. Phone: as before. */
body:not(.fphone) .aic-follow__lanes {
  column-gap: 14px;
  padding-right: 14px;
}
body:not(.fphone) .aic-follow__head {
  background: var(--aic-surface);
  border-radius: 16px 16px 0 0;
  padding: 14px 10px 8px 12px;
  margin-top: 10px;
}
body:not(.fphone) .aic-follow__lane {
  background: var(--aic-surface);
  border-radius: 0 0 16px 16px;
  padding: 4px 10px 18px 12px;
  box-shadow: var(--aic-shadow-2);
}
body:not(.fphone) .aic-follow__team {
  flex-direction: row;
  flex-wrap: wrap; /* a narrow column: the people connected under the name, nothing over the next team */
  align-items: baseline;
  gap: 0 12px;
  border-bottom: 0;
  padding-bottom: 2px;
}
body:not(.fphone) .aic-follow__name {
  font-size: 22px;
  line-height: 28px;
  flex: 0 1 auto;
  min-width: 0;
  white-space: normal;
  overflow-wrap: anywhere;
}
body:not(.fphone) .aic-follow__online {
  white-space: nowrap;
}
body:not(.fphone) .aic-follow__head .aic-btn { /* a long team name stays inside its column */
  max-width: 100%;
  height: auto;
  white-space: normal;
  text-align: left;
}
body:not(.fphone) .aic-follow__kpis {
  gap: 6px;
}
body:not(.fphone) .aic-follow__kpi {
  border-color: transparent;
  border-radius: 999px;
  padding: 3px 10px;
  background: var(--aic-surface-raised);
  white-space: nowrap;
}
body:not(.fphone) .aic-follow__kpi--late {
  border-color: var(--aic-late);
  background: var(--aic-late-bg);
}
body:not(.fphone) .aic-follow__cols {
  padding-top: 8px;
  margin-top: 4px;
  border-top: 1px solid var(--aic-line);
  letter-spacing: 0.03em;
}
body:not(.fphone) .aic-ev {
  border: 0;
  border-radius: 12px;
  padding: 9px 14px 9px 16px;
  box-shadow: inset 4px 0 0 var(--aic-line-strong), var(--aic-shadow-1);
}
body:not(.fphone) .aic-ev--in {
  box-shadow: inset 4px 0 0 var(--aic-inject);
}
body:not(.fphone) .aic-ev--late {
  box-shadow: inset 4px 0 0 var(--aic-late);
}
body:not(.fphone) .aic-ev--int {
  box-shadow: inset 4px 0 0 var(--aic-internal);
}
body:not(.fphone) .aic-ev--wait {
  box-shadow: inset 4px 0 0 var(--aic-wait);
}
body:not(.fphone) .aic-ev--ok {
  box-shadow: inset 4px 0 0 var(--aic-reply);
}
body:not(.fphone) .aic-ev__w {
  white-space: normal;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  line-height: 19px;
}
body:not(.fphone) .aic-ev__s {
  white-space: normal;
}
body:not(.fphone) .aic-ev__rel {
  border-radius: 10px;
}
body:not(.fphone) .aic-follow__panel {
  border-radius: 16px 0 0 16px;
  box-shadow: var(--aic-shadow-3);
}
.aic-ev--sel {
  border-color: var(--aic-gold);
  outline: 2px solid var(--aic-gold);
  outline-offset: 0;
}
.aic-follow__gap {
  height: 16px;
  border-top: 1px dashed var(--aic-line-strong);
  text-align: center;
  font-size: 12px;
  color: var(--aic-wait);
}
.aic-follow__gap span {
  position: relative;
  top: -9px;
  padding: 0 8px;
  background: var(--aic-ground);
}
.aic-follow__now {
  position: relative;
  height: 14px;
  border-top: 2px solid var(--aic-gold);
}
.aic-follow__now span {
  position: absolute;
  right: 0;
  top: -11px;
  padding: 2px 8px;
  border-radius: var(--aic-radius-sm);
  background: var(--aic-gold);
  color: var(--aic-navy);
  font: 700 11px var(--aic-font-sans);
}
.aic-follow__empty {
  padding: 18px 0;
  color: var(--aic-ink-3);
  font-size: 12px;
  text-align: center;
}
.aic-follow__phead {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
.aic-follow__close {
  margin-left: auto;
  width: 30px;
  height: 30px;
  border: 0;
  border-radius: var(--aic-radius-sm);
  background: transparent;
  color: var(--aic-ink-2);
  font-size: 16px;
  cursor: pointer;
}
.aic-follow__close:hover {
  background: var(--aic-surface-raised);
}
.aic-follow__psub,
.aic-follow__chain {
  font-size: 12px;
  color: var(--aic-ink-3);
}
.aic-ev__play { /* ▶ hear a recorded call again, on its row */
  margin-left: 8px;
  border: 1px solid var(--aic-line-strong);
  border-radius: 999px;
  background: transparent;
  color: var(--aic-ink);
  font-size: 11px;
  padding: 1px 8px;
  cursor: pointer;
}
.aic-follow__to { /* the position an inject was sent to, under the title */
  font-size: 14px;
  color: var(--aic-ink);
}
.aic-follow__to b {
  color: var(--aic-teal-ink);
}
.aic-follow__more {
  align-self: flex-start;
  margin: 4px 0 8px;
}
.aic-follow__psub b,
.aic-follow__chain b {
  color: var(--aic-ink);
  font-weight: 600;
}
.aic-follow__chain--out {
  color: var(--aic-reply);
}
.aic-follow__obj {
  font-size: 13px;
  line-height: 19px;
  color: var(--aic-ai);
}
.aic-follow__pacts {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
  margin-top: 2px;
}
.aic-follow__hist {
  padding: 8px 20px;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.1em;
  color: var(--aic-ink-3);
  border-bottom: 1px solid var(--aic-line);
}
.aic-follow .aic-msg {
  max-width: 88%;
  font-size: 13px;
  line-height: 20px;
}
.aic-follow__live {
  font-size: 12px;
  color: var(--aic-ink-3);
}
.web-batch { background: var(--aic-surface-sunk); font-size: 12px; line-height: 1.5; padding: 10px 12px; }
.web-batch label { display: flex; align-items: center; gap: 8px; margin-top: 6px; font-weight: 600; }
.aic-rt table { border-collapse: collapse; width: 100%; margin: 6px 0 10px; }
.aic-rt th, .aic-rt td { border: 1px solid var(--aic-line); padding: 5px 8px; vertical-align: top; text-align: left; }
.aic-rt th { background: var(--aic-surface-sunk); }
.aic-follow__doc {
  white-space: pre-wrap;
  font-size: 13px;
  line-height: 21px;
}
.aic-follow__file {
  font-size: 12px;
  color: var(--aic-inject);
}
/* between whom an event is: with you (coloured by its state), inside the team (grey, in the middle), between teams (dashed) */
.aic-ev__rel {
  display: inline-block;
  margin-right: 8px;
  padding: 0 6px;
  border-radius: var(--aic-radius-sm);
  font: 700 11px/16px var(--aic-font-sans);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  vertical-align: 1px;
}
.aic-ev__rel--you {
  color: var(--aic-ink);
  border: 1px solid var(--aic-line-strong);
}
.aic-ev__rel--int {
  color: var(--aic-internal);
  background: var(--aic-internal-bg);
  border: 1px solid var(--aic-internal-line);
}
/* on an internal card the tag keeps its outline without laying the tint a second time (navy: 4.1:1); the
   time reads in the secondary grey */
.aic-ev--int .aic-ev__rel--int {
  background: transparent;
}
.aic-ev--int .aic-ev__t {
  color: var(--aic-ink-2);
}
.aic-ev__rel--teams {
  color: var(--aic-ink);
  border: 1px dashed var(--aic-line-strong);
}
.aic-ev--teams-in,
.aic-ev--teams-out {
  background: transparent;
  border-style: dashed;
  border-color: var(--aic-line-strong);
  box-shadow: none;
}
.aic-ev--teams-out {
  margin-left: 22%;
}
.aic-follow__key--teams {
  width: 14px;
  border: 1px dashed var(--aic-line-strong);
}

/* ══ Frame screen (Cadre): cells as cards, teams as cards, every function kept ══ */
.aic-frame.on {
  flex-direction: column;
  background: var(--aic-ground);
  color: var(--aic-ink);
}
.aic-frame__scroll {
  flex: 1;
  min-height: 0;
  overflow-y: auto;
  padding: var(--aic-space-5) 28px 48px;
  display: flex;
  flex-direction: column;
  gap: var(--aic-space-5);
}
.aic-frame .aic-hint {
  font: 400 12px/18px var(--aic-font-sans);
  color: var(--aic-ink-3);
  margin: 0;
}
.aic-frame__ro {
  padding: var(--aic-space-2) var(--aic-space-3);
  border-radius: var(--aic-radius-sm);
  background: var(--aic-wait-bg);
  color: var(--aic-wait);
  font-size: 13px;
}
.aic-frame__head {
  display: flex;
  align-items: flex-end;
  gap: var(--aic-space-4);
  flex-wrap: wrap;
}
.aic-frame__intro {
  flex: 1 1 420px;
  min-width: 0;
}
.aic-frame__eyebrow {
  font: 700 11px/14px var(--aic-font-sans);
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--aic-teal-ink);
}
.aic-frame__title {
  margin: 4px 0 6px;
  font: 600 28px/34px var(--aic-font-display);
}
.aic-frame__lead {
  margin: 0; /* no reading width: a one-sentence lead cut at 760 px on a wide screen looked cut short */
  font-size: 14px;
  line-height: 21px;
  color: var(--aic-ink-2);
}
.aic-frame__acts {
  display: flex;
  align-items: center;
  gap: var(--aic-space-2);
  flex-wrap: wrap;
}
.aic-frame__dirty {
  font-size: 13px;
  font-weight: 600;
  color: var(--aic-wait);
}
.aic-frame__secintro {
  min-width: 0;
}
.aic-frame__secintro .aic-section__sub {
  margin: 2px 0 0;
}
.aic-frame__menuwrap {
  position: relative;
}
.aic-frame .aic-frame__tplmenu {
  display: none;
  position: absolute;
  right: 0;
  top: 100%;
  margin-top: 6px;
  width: 280px;
  z-index: 30;
}
.aic-frame .aic-frame__tplmenu.open {
  display: flex;
}
.aic-frame__tplmenu .aic-btn {
  justify-content: flex-start;
  white-space: normal;
  text-align: left;
}
.aic-frame__menusep {
  border: 0;
  border-top: 1px solid var(--aic-line);
  margin: var(--aic-space-1) 0;
}
.aic-frame__file {
  position: relative;
}
.aic-frame__file input {
  position: absolute;
  inset: 0;
  opacity: 0;
  cursor: pointer;
}
.aic-frame__qhelp {
  width: 30px;
  height: 30px;
  border-radius: 50%;
  border: 1px solid var(--aic-line-strong);
  background: transparent;
  color: var(--aic-ink-2);
  font: 600 13px var(--aic-font-sans);
  cursor: help;
  display: inline-grid;
  place-items: center;
  flex-shrink: 0;
}
.aic-frame__help {
  padding: var(--aic-space-3) var(--aic-space-4);
  border-radius: var(--aic-radius-md);
  background: var(--aic-surface-sunk);
  border: 1px solid var(--aic-line);
  font-size: 13px;
  line-height: 20px;
  color: var(--aic-ink-2);
}
ul.aic-frame__help {
  margin: 0;
  padding-left: 34px;
}
.aic-frame__help li + li {
  margin-top: 4px;
}
.aic-frame__cells {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(100%, 520px), 1fr));
  gap: var(--aic-space-3);
}
.aic-frame__addcell {
  align-self: flex-start;
}
.aic-frame__status {
  font-size: 13px;
  color: var(--aic-ink-2);
  min-height: 18px;
}
.aic-cell__type {
  font: 700 11px/14px var(--aic-font-sans);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--aic-teal-ink);
}
.aic-cell__top {
  display: flex;
  align-items: flex-end;
  gap: var(--aic-space-3);
}
.aic-cell__namefield {
  flex: 1;
}
.aic-cell__namefield .aic-input {
  font: 600 16px/22px var(--aic-font-sans);
}
.aic-cell__code {
  padding-bottom: 9px;
  white-space: nowrap;
}
.aic-cell__code b {
  color: var(--aic-ink-2);
}
.aic-cell__grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: var(--aic-space-3);
}
.aic-cell__grid > :first-child {
  grid-column: 1 / -1;
}
.aic-cell__grid--three {
  grid-template-columns: 1fr 1fr 1fr;
}
.aic-cell__grid--three > :first-child {
  grid-column: auto;
}
.aic-cell__grid--pair > :first-child {
  grid-column: auto;
}
.aic-cell--players {
  background: var(--aic-reply-bg);
  border-color: var(--aic-reply-line);
}
.aic-cell--players .aic-cell__postes {
  background: var(--aic-surface);
}
.aic-cell .aic-segmented button {
  padding: 0 6px;
  font-size: 12px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  min-width: 0;
}
.aic-cell__postes {
  padding: var(--aic-space-3);
  border-radius: 8px;
  background: var(--aic-surface-sunk);
  border: 1px solid var(--aic-line);
  display: flex;
  flex-direction: column;
  gap: var(--aic-space-2);
}
.aic-cell__phead {
  display: flex;
  align-items: baseline;
  gap: var(--aic-space-2);
}
.aic-cell__pcount {
  font-size: 12px;
  color: var(--aic-ink-3);
}
.aic-cell__todo {
  color: var(--aic-late);
  font-weight: 600;
}
.aic-cell .pe-list {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
}
.aic-poste {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  height: 30px;
  padding: 0 4px 0 10px;
  border-radius: var(--aic-radius-pill);
  border: 1px solid var(--aic-line-strong);
  background: var(--aic-surface);
}
.aic-poste .pe-label {
  border: 0;
  background: transparent;
  color: var(--aic-ink);
  font: 500 13px var(--aic-font-sans);
  width: auto;
  min-width: 0;
  padding: 0;
}
.aic-poste .pe-label:focus {
  outline: none;
}
.aic-poste:focus-within {
  border-color: var(--aic-focus);
}
.aic-poste .pe-tag {
  font: 600 11px var(--aic-font-mono);
  color: var(--aic-ink-3);
}
.aic-poste .pe-tag--dup {
  color: var(--aic-late);
  font-family: var(--aic-font-sans);
}
.aic-poste__x {
  width: 22px;
  height: 22px;
  border: 0;
  border-radius: 50%;
  background: transparent;
  color: var(--aic-ink-3);
  font-size: 15px;
  cursor: pointer;
}
.aic-poste__x:hover {
  color: var(--aic-late);
}
/* the rights of a position (rights.js), a shield on its tag; a gold dot when they differ from AIC's values */
.aic-poste__r {
  position: relative;
  width: 22px;
  height: 22px;
  border: 0;
  border-radius: 50%;
  background: transparent;
  color: var(--aic-ink-3);
  cursor: pointer;
  padding: 3px;
}
.aic-poste__r svg {
  width: 15px;
  height: 15px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
}
.aic-poste__r:hover {
  color: var(--aic-ink);
}
.aic-poste__r.is-changed::after {
  content: "";
  position: absolute;
  top: 1px;
  right: 1px;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--aic-gold);
}
.aic-cell__foot {
  display: flex;
  align-items: center;
  gap: var(--aic-space-3);
  flex-wrap: wrap;
}
.aic-cell__check {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 13px;
  color: var(--aic-ink-2);
  cursor: pointer;
}
.aic-frame input[type="checkbox"],
.aic-frame input[type="radio"] {
  accent-color: var(--aic-teal);
  margin: 0;
}
.aic-cell__acts {
  margin-left: auto;
  display: flex;
  gap: var(--aic-space-1);
}
.aic-cell__remove {
  color: var(--aic-late);
}
.aic-frame__group {
  padding: var(--aic-space-3) var(--aic-space-4);
  border-radius: var(--aic-radius-md);
  border: 1px solid var(--aic-line);
  display: flex;
  flex-direction: column;
  gap: var(--aic-space-2);
}
.aic-frame__group--todo {
  border-color: var(--aic-wait);
  background: var(--aic-wait-bg);
}
.aic-frame__grouphead {
  font-size: 13px;
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
}
.aic-frame__group--todo .aic-frame__grouphead b {
  color: var(--aic-wait);
}
.aic-frame__team {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-weight: 600;
}
.aic-frame__choices {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: var(--aic-space-2);
}
.aic-frame__choice {
  display: flex;
  gap: var(--aic-space-2);
  align-items: flex-start;
  padding: var(--aic-space-2) var(--aic-space-3);
  border-radius: 8px;
  border: 1px solid var(--aic-line-strong);
  cursor: pointer;
  font-size: 13px;
}
.aic-frame__choice:has(input:checked) {
  border-color: var(--aic-teal);
  background: var(--aic-reply-bg);
}
.aic-frame__choice b {
  display: block;
  font-weight: 600;
}
.aic-frame__choice input {
  margin-top: 3px !important;
}
.aic-frame__settings { /* as many columns as the card holds: no half-empty card on a wide screen */
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(240px, 300px));
  align-items: end; /* a label on two lines never pushes its list below the others of the row */
  gap: var(--aic-space-4);
}
.aic-frame__settings .aic-input {
  max-width: 320px;
}
.aic-team {
  border: 1px solid var(--aic-line);
  border-radius: var(--aic-radius-md);
  background: var(--aic-surface-raised);
  padding: var(--aic-space-3) var(--aic-space-4);
  display: flex;
  flex-direction: column;
  gap: var(--aic-space-2);
}
.aic-team + .aic-team {
  margin-top: var(--aic-space-3);
}
.aic-team__head {
  display: flex;
  align-items: center;
  gap: var(--aic-space-2);
  flex-wrap: wrap;
}
.aic-team__name {
  margin: 0;
  font: 600 18px/24px var(--aic-font-display);
}
.aic-team__icon {
  width: 26px;
  height: 26px;
  border: 0;
  border-radius: var(--aic-radius-sm);
  background: transparent;
  color: var(--aic-ink-3);
  cursor: pointer;
}
.aic-team__icon:hover {
  color: var(--aic-ink);
  background: var(--aic-surface-sunk);
}
.aic-frame__right {
  margin-left: auto;
}
.aic-team__link {
  display: flex;
  align-items: center;
  gap: var(--aic-space-2);
  flex-wrap: wrap;
}
.aic-team__link .aic-input {
  flex: 1 1 260px;
  width: auto;
  font: 400 12px var(--aic-font-mono);
  color: var(--aic-ink-2);
}
.aic-team__row {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
}
.aic-team__row .aic-label {
  margin-right: 4px;
}
.aic-team__tz {
  width: auto;
  max-width: 320px;
}
.aic-frame__chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  height: 28px;
  padding: 0 10px;
  border-radius: var(--aic-radius-pill);
  border: 1px solid var(--aic-line-strong);
  font: 600 12px var(--aic-font-sans);
  color: var(--aic-ink-2);
  cursor: pointer;
}
.aic-frame__chip:has(input:checked) {
  border-color: var(--aic-teal);
  background: var(--aic-reply-bg);
  color: var(--aic-ink);
}
.aic-frame__chipsub {
  font-weight: 400;
  color: var(--aic-ink-3);
}
.aic-frame__block {
  margin-top: var(--aic-space-4);
  padding-top: var(--aic-space-4);
  border-top: 1px solid var(--aic-line);
  display: flex;
  flex-direction: column;
  gap: var(--aic-space-2);
}
.aic-frame__blockhead {
  display: flex;
  align-items: center;
  gap: var(--aic-space-2);
  flex-wrap: wrap;
}
.aic-frame__testline {
  display: flex;
  align-items: center;
  gap: var(--aic-space-2);
  flex-wrap: wrap;
  margin: var(--aic-space-2) 0 var(--aic-space-3);
}
.aic-frame__h3 {
  margin: 0;
  font: 600 15px/20px var(--aic-font-sans);
}
.aic-frame__mrow {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
  padding: 6px 0;
  border-bottom: 1px solid var(--aic-line);
  font-size: 13px;
}
.aic-frame__mwho {
  min-width: 200px;
}
.aic-frame__savebar {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  gap: var(--aic-space-3);
  flex-wrap: wrap;
  padding: var(--aic-space-3) 28px;
  background: var(--aic-surface-raised);
  border-top: 2px solid var(--aic-gold);
  box-shadow: var(--aic-shadow-2);
}
.aic-frame__savebar .aic-hint {
  flex: 1;
}

/* ══ Scenario screen (Scénario): cards 3 to 8 with the charter; the tables keep their content ══ */
.aic-section.collapsed > :not(.aic-section__head) {
  display: none;
}
.aic-prep__tools {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: var(--aic-space-2);
}
.aic-prep__teams {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
}
.aic-prep__progress {
  display: flex;
  align-items: center;
  gap: var(--aic-space-2);
  flex-wrap: wrap;
}
.aic-prep__step {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  height: 32px;
  padding: 0 12px 0 6px;
  border-radius: var(--aic-radius-pill);
  border: 1px solid var(--aic-line-strong);
  background: transparent;
  color: var(--aic-ink-2);
  font: 600 12px var(--aic-font-sans);
  cursor: pointer;
}
.aic-prep__stepnum {
  min-width: 22px;
  height: 22px;
  padding: 0 4px;
  border-radius: var(--aic-radius-pill);
  display: inline-grid;
  place-items: center;
  background: var(--aic-surface-raised);
  color: var(--aic-ink);
  font: 700 11px var(--aic-font-sans);
}
.aic-prep__step--done {
  border-color: var(--aic-reply-line);
  color: var(--aic-ink);
}
.aic-prep__step--done .aic-prep__stepnum {
  background: var(--aic-reply);
  color: var(--aic-ground); /* light on the deep green of the light theme, dark on the pale green of navy */
}
.aic-prep .aic-frame__menuwrap .aic-prep__gaps {
  position: absolute;
  right: 0;
  top: 100%;
  margin-top: 6px;
  width: 520px;
  z-index: 30;
}
.aic-prep__gap {
  display: flex;
  align-items: center;
  gap: var(--aic-space-2);
  flex-wrap: wrap;
  padding: var(--aic-space-2) 0;
  border-top: 1px solid var(--aic-line);
  font-size: 13px;
}
.aic-prep__gap span {
  flex: 1;
  min-width: 200px;
}
.aic-prep__preview {
  white-space: pre-line;
  max-height: 140px;
  overflow: hidden;
  padding: var(--aic-space-3);
  border-radius: 8px;
  background: var(--aic-surface-sunk);
  border: 1px solid var(--aic-line);
  font-size: 13px;
  line-height: 20px;
  color: var(--aic-ink-2);
}
.aic-prep__text {
  min-height: 180px;
  resize: vertical;
  line-height: 21px;
}
.aic-prep__ai {
  display: flex;
  align-items: center;
  gap: var(--aic-space-2);
  flex-wrap: wrap;
}
.aic-prep__real {
  margin-top: var(--aic-space-3);
}
.aic-prep__real > summary {
  cursor: pointer;
}
.aic-prep__realdate {
  display: flex;
  align-items: center;
  gap: var(--aic-space-2);
  margin: var(--aic-space-2) 0;
}
.aic-prep__auto {
  width: auto;
}
.aic-prep__grow {
  flex: 1;
  min-width: 220px;
}
.aic-prep__rule {
  margin: 0;
  padding: var(--aic-space-2) var(--aic-space-3);
  border-radius: var(--aic-radius-sm);
  background: var(--aic-wait-bg);
  color: var(--aic-ink);
  font-size: 13px;
}
.aic-prep__refbar {
  display: flex;
  align-items: flex-end;
  gap: var(--aic-space-3);
  flex-wrap: wrap;
}
.aic-prep__refbar .aic-input {
  width: 220px;
}
.aic-prep__kinds {
  display: flex;
  gap: var(--aic-space-2);
  flex-wrap: wrap;
}
.aic-prep__table {
  overflow-x: auto;
}
.aic-prep .ptab {
  width: 100%;
  border-collapse: collapse;
  font-size: 13px;
}
.aic-prep .ptab th {
  text-align: left;
  font: 700 11px/14px var(--aic-font-sans);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--aic-ink-3);
  padding: 8px;
  border-bottom: 1px solid var(--aic-line-strong);
  white-space: nowrap; /* every column title on one line, level with the others */
  vertical-align: bottom;
}
.aic-prep .ptab td {
  padding: 8px;
  border-bottom: 1px solid var(--aic-line);
  vertical-align: top;
  color: var(--aic-ink);
}
.aic-prep .ptab tr.grp td {
  background: var(--aic-surface-sunk);
  font: 700 12px var(--aic-font-sans);
  color: var(--aic-ink-2);
  border-top: 2px solid var(--aic-line-strong);
}
.aic-prep .ptab tr.grp--cat td { /* the category, once over its groups */
  background: transparent;
  border-top: 0;
  padding-top: 18px;
}
.aic-prep .ptab tr.new {
  background: var(--aic-reply-bg);
}
.aic-prep .ptab small {
  color: var(--aic-ink-2);
  font-size: 12px;
}
.aic-prep .ptab input,
.aic-prep .ptab select {
  background: var(--aic-field);
  color: var(--aic-ink);
  border: 1px solid var(--aic-line-strong);
  border-radius: var(--aic-radius-sm);
  padding: 4px 6px;
  font: 400 12px var(--aic-font-sans);
}
.aic-prep .ptab .minput {
  margin-bottom: 0;
}
/* Half-screen window: fields shrink (their inline widths are overridden) so the row and its pencil stay in view;
   below 900 px the table scrolls inside its own box, scrollbar always on screen. */
@media (max-width: 1280px) {
  .aic-prep .ptab input:not([type=checkbox]):not([type=number]),
  .aic-prep .ptab select,
  .aic-prep .ptab textarea {
    min-width: 84px !important;
    max-width: 100%;
    width: 100%;
    box-sizing: border-box;
  }
  .aic-prep .ptab select {
    max-width: 150px !important;
  }
  .aic-prep .ptab th,
  .aic-prep .ptab td {
    padding-left: 5px;
    padding-right: 5px;
  }
  .aic-prep .ptab th {
    white-space: normal;
  }
}
@media (max-width: 900px) {
  .aic-prep .ptab input:not([type=checkbox]):not([type=number]),
  .aic-prep .ptab select,
  .aic-prep .ptab textarea {
    min-width: 66px !important;
  }
  .aic-prep .ptab select {
    max-width: 104px !important;
  }
  .aic-prep .ptab th,
  .aic-prep .ptab td {
    padding-left: 3px;
    padding-right: 3px;
  }
  .aic-prep__table {
    max-height: 70vh;
    overflow: auto;
  }
}
/* The AI's proposals window: the list takes the height the window leaves under its title, the buttons stay in view,
   and the list alone scrolls; each proposal's text box grows with its text, never a scrollbar of its own. */
#prop-modal .modal {
  display: flex;
  flex-direction: column;
}
#prop-modal .modal > * {
  flex-shrink: 0;
}
#prop-modal .modal > #prop-scroll {
  flex: 1 1 auto;
  min-height: 0;
  overflow: auto;
}
#prop-body textarea {
  field-sizing: content;
  min-height: 2.8em;
  max-height: none;
  resize: vertical;
}
.aic-prep .tb {
  background: transparent;
  border: 1px solid var(--aic-line-strong);
  color: var(--aic-ink);
  border-radius: var(--aic-radius-sm);
  padding: 4px 10px;
  font: 600 12px var(--aic-font-sans);
  cursor: pointer;
}
.aic-prep .tb:hover {
  background: var(--aic-surface-sunk);
}
.aic-prep .tb.danger {
  border-color: transparent;
  color: var(--aic-late);
}
.aic-prep .star {
  color: var(--aic-line-strong);
  font-size: 15px;
  cursor: pointer;
}
.aic-prep .star.on {
  color: var(--aic-gold);
}
.aic-prep__gap--intended span:first-child {
  color: var(--aic-ink-3);
}
.aic-prep__ok {
  font-size: 12px;
  font-weight: 600;
  color: var(--aic-reply);
}
.aic-prep__fold {
  all: unset;
  cursor: pointer;
  display: block;
  width: 100%;
  color: var(--aic-ink-2);
  font: 700 12px var(--aic-font-sans);
}
.aic-prep__fold:focus-visible {
  outline: 2px solid var(--aic-focus);
  outline-offset: 2px;
}
.aic-prep__fold .aic-hint {
  font-weight: 400;
}

/* ── Window: a dialog that follows the charter, first the inject window ── */
.modal.aic-window {
  padding: 0;
  background: var(--aic-surface);
  color: var(--aic-ink);
  border: 1px solid var(--aic-line);
  border-radius: var(--aic-radius-md);
  box-shadow: var(--aic-shadow-3);
  display: flex;
  flex-direction: column;
}
.aic-window__head {
  padding: var(--aic-space-4) var(--aic-space-5) var(--aic-space-3);
  border-bottom: 1px solid var(--aic-line);
}
.aic-window__title {
  margin: 0;
  font: 600 21px/26px var(--aic-font-display);
  color: var(--aic-ink);
}
.aic-window__foot {
  display: flex;
  gap: var(--aic-space-2);
  flex-wrap: wrap;
  padding: var(--aic-space-3) var(--aic-space-5) var(--aic-space-4);
  border-top: 1px solid var(--aic-line);
}
.modal.aic-inj {
  width: min(980px, 96vw);
}
.aic-inj__grid {
  display: grid;
  grid-template-columns: minmax(260px, 1fr) minmax(0, 1.4fr);
  gap: var(--aic-space-5);
  padding: var(--aic-space-4) var(--aic-space-5);
}
.aic-inj__side,
.aic-inj__compose {
  display: flex;
  flex-direction: column;
  gap: var(--aic-space-4);
  min-width: 0;
}
.aic-inj__warn {
  color: var(--aic-late);
}
.aic-inj__warn:empty {
  display: none;
}
/* each channel with its icon above its name, so that the five read apart at a glance */
.aic-inj__channels {
  border-radius: 10px;
}
.aic-inj__channels button {
  height: auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  padding: 8px 4px;
  font-size: 12px;
  line-height: 1.2;
}
.aic-inj__chi {
  width: 20px;
  height: 20px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.aic-inj__voice {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: var(--aic-space-3);
}
.aic-inj__roles {
  display: flex;
  flex-wrap: wrap;
  gap: var(--aic-space-2);
  font: 400 13px var(--aic-font-sans);
  color: var(--aic-ink-2);
}
.aic-inj__roles label {
  white-space: nowrap;
}
.aic-inj__check {
  font: 400 13px var(--aic-font-sans);
  color: var(--aic-ink-2);
}
.aic-inj__more {
  align-self: flex-start;
}
.aic-inj__debrief {
  display: flex;
  flex-direction: column;
  gap: var(--aic-space-3);
}
.aic-inj__debrief.hidden {
  display: none;
}
.aic-inj__inv {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--aic-space-2);
}
.aic-inj__inv.hidden {
  display: none;
}
.aic-inj__loc {
  grid-column: 1 / -1;
}
.aic-inj__body {
  min-height: 180px;
}
.aic-inj__count {
  align-self: flex-end;
}
.aic-inj__tools {
  display: flex;
  flex-wrap: wrap;
  gap: var(--aic-space-2);
  align-items: center;
}
.aic-inj__attach {
  display: contents;
}
.aic-inj__attach.hidden {
  display: none;
}
.aic-inj__files {
  font-size: 12px;
  color: var(--aic-inject);
}
.aic-inj__live {
  all: unset;
  cursor: pointer;
  align-self: center;
  font: 400 12px var(--aic-font-sans);
  color: var(--aic-teal-ink);
  text-decoration: underline;
}
.aic-inj__live:focus-visible {
  outline: 2px solid var(--aic-focus);
}
.aic-inj__phonehead {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
  padding-bottom: var(--aic-space-2);
  border-bottom: 1px solid var(--aic-line);
}
.aic-inj__phonehead.hidden {
  display: none;
}
.aic-inj__avatar {
  width: 48px;
  height: 48px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font: 700 15px var(--aic-font-sans);
}
/* SMS and call: the right part becomes a phone */
.aic-inj[data-ch="sms"] .aic-inj__compose,
.aic-inj[data-ch="appel"] .aic-inj__compose {
  justify-self: center;
  width: min(340px, 100%);
  padding: 22px 16px 18px;
  border: 1px solid var(--aic-line-strong);
  border-radius: 30px;
  background: var(--aic-surface-sunk);
}
.aic-inj[data-ch="sms"] .aic-inj__avatar {
  background: var(--aic-sms-bg);
  color: var(--aic-sms);
}
.aic-inj[data-ch="appel"] .aic-inj__avatar {
  background: var(--aic-call-bg);
  color: var(--aic-call);
  width: 64px;
  height: 64px;
}
.aic-inj[data-ch="sms"] .aic-inj__body {
  min-height: 120px;
  border-radius: 16px 16px 16px 4px;
  background: var(--aic-sms-bg);
}
.aic-inj[data-ch="appel"] .aic-inj__body {
  min-height: 110px;
}
@media (max-width: 760px) {
  .aic-inj__grid {
    grid-template-columns: minmax(0, 1fr);
  }
}
/* the prepared inject sheet (Scenario) uses the same compose part; its old field styles are overridden inside */
.aic-inj--sheet {
  background: transparent;
}
.sh-body .aic-inj--sheet[data-ch="email"] .aic-inj__compose {
  gap: 10px;
}
.sh-body .aic-inj--sheet[data-ch="sms"] input,
.sh-body .aic-inj--sheet[data-ch="sms"] textarea,
.sh-body .aic-inj--sheet[data-ch="appel"] input,
.sh-body .aic-inj--sheet[data-ch="appel"] textarea {
  background: var(--aic-field);
  color: var(--aic-ink);
  border-color: var(--aic-line-strong);
}
.sh-body .aic-inj--sheet[data-ch="sms"] label,
.sh-body .aic-inj--sheet[data-ch="appel"] label,
.sh-body .aic-inj--sheet[data-ch="sms"] .aic-inj__phonehead b,
.sh-body .aic-inj--sheet[data-ch="appel"] .aic-inj__phonehead b {
  color: var(--aic-ink-2);
}
.sh-body .aic-inj--sheet[data-ch="sms"] textarea {
  background: var(--aic-sms-bg);
  border-radius: 16px 16px 16px 4px;
}
.aic-inj--sheet .hidden {
  display: none;
}
.aic-inj--sheet .aic-inj__bodyfield {
  display: flex;
  flex-direction: column;
}

/* ── Actor sheet: the side panel at the charter while it shows an actor ── */
.sheet.aic-sheetwin {
  background: var(--aic-surface);
  color: var(--aic-ink);
  border-left: 1px solid var(--aic-line);
  box-shadow: var(--aic-shadow-3);
}
.aic-sheetwin .sh-hdr {
  background: var(--aic-frame);
  color: var(--aic-on-dark); /* the frame is dark in both themes; ink was dark on dark in the light one */
  font: 600 18px/24px var(--aic-font-display);
  border-bottom: 1px solid var(--aic-line);
}
.aic-sheetwin .sh-hdr button {
  color: var(--aic-on-dark);
}
.aic-sheetwin .sh-foot {
  background: var(--aic-surface-sunk);
  border-top: 1px solid var(--aic-line);
}
.aic-sheetwin .sh-body { /* air between the parts of a sheet, which read squashed */
  gap: var(--aic-space-5);
  padding: 20px 24px;
}
/* three sizes, read in order: the section's title, then a field's label, then the content */
.aic-sheetwin .sh-body .aic-psheet__sum {
  font: 600 15px/20px var(--aic-font-sans);
  color: var(--aic-ink);
}
.aic-sheetwin .sh-body label {
  font: 700 12px/16px var(--aic-font-sans);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--aic-ink-2);
  margin-bottom: var(--aic-space-2);
}
/* the attachment buttons of a prepared inject's sheet stay buttons, side by side */
.aic-sheetwin .sh-body .aic-inj__sheetatt {
  display: flex;
  flex-wrap: wrap;
  gap: var(--aic-space-2);
  align-items: center;
}
.aic-sheetwin .sh-body label.aic-btn {
  display: inline-flex;
  margin: 0 0 var(--aic-space-2);
  color: var(--aic-ink);
  font: 600 13px/18px var(--aic-font-sans);
  letter-spacing: 0;
  text-transform: none;
}
.aic-sheetwin .sh-body input:not([type="checkbox"]),
.aic-sheetwin .sh-body textarea,
.aic-sheetwin .sh-body select {
  background: var(--aic-field);
  color: var(--aic-ink);
  border: 1px solid var(--aic-line-strong);
  border-radius: var(--aic-radius-sm);
  font: 400 13px/20px var(--aic-font-sans);
}
.aic-sheetwin .sh-body textarea#ps-sheet {
  font-size: 14px;
  line-height: 22px;
}
.aic-sheetwin .sh-sec {
  border-top: 1px solid var(--aic-line);
  padding: var(--aic-space-4) 0 var(--aic-space-2); /* a folded part breathes like a section */
}
.aic-sheetwin .sh-sec[open] > *:not(summary) {
  margin-top: var(--aic-space-4);
}
.aic-sheetwin .memo {
  background: var(--aic-surface-sunk);
  color: var(--aic-ink-2);
}
.aic-psheet__sec {
  display: flex;
  flex-direction: column;
  gap: var(--aic-space-4); /* air between the fields, which were squashed */
  margin-bottom: var(--aic-space-2);
}
.aic-psheet__h {
  display: flex;
  align-items: center;
  gap: var(--aic-space-2);
  margin: 0;
  font: 600 15px var(--aic-font-sans);
  color: var(--aic-ink);
}
.aic-psheet__acts {
  margin-left: auto;
  display: flex;
  gap: var(--aic-space-2);
  align-items: center;
}
.aic-psheet__btns {
  display: flex;
  flex-wrap: wrap;
  gap: var(--aic-space-2);
}
.aic-psheet__row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: var(--aic-space-4);
}
.aic-psheet__row--one {
  grid-template-columns: minmax(0, 1fr);
  gap: 10px;
}
.aic-psheet__chips {
  display: flex;
  flex-wrap: wrap;
  gap: var(--aic-space-2);
}
/* the positions an actor writes to, team by team: the team's name on its own line, its positions under it */
.ps-to-team {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--aic-space-2);
  margin: 0 0 var(--aic-space-4);
}
.ps-who-mode {
  margin-bottom: var(--aic-space-3);
}
.ps-to-fold > summary {
  cursor: pointer;
  margin: var(--aic-space-3) 0 var(--aic-space-2);
  font: 600 13px/18px var(--aic-font-sans);
  color: var(--aic-teal-ink);
}
.ps-to-name {
  flex-basis: 100%;
}
.aic-sheetwin .aic-psheet__chips label,
.aic-sheetwin #ps-to-wrap label {
  display: inline-flex !important;
  align-items: center;
  gap: 5px;
  padding: 3px 10px !important;
  border-radius: var(--aic-radius-pill) !important;
  border: 1px solid var(--aic-line-strong) !important;
  background: transparent !important;
  color: var(--aic-ink) !important;
  font: 500 13px var(--aic-font-sans) !important;
  text-transform: none !important;
  letter-spacing: 0 !important;
}
.aic-psheet__warn {
  color: var(--aic-late);
}
.aic-psheet__check {
  display: flex !important;
  align-items: center;
  gap: 8px;
  margin: 2px 0;
  text-transform: none !important;
  letter-spacing: 0 !important;
  font: 600 13px var(--aic-font-sans) !important;
  color: var(--aic-ink) !important;
}
.aic-sheetwin .aic-psheet__check input {
  width: auto;
  flex-shrink: 0;
  margin: 0;
}
.aic-psheet__indent {
  margin-left: 24px;
}
.aic-psheet__sum {
  cursor: pointer;
}
.aic-psheet__origin {
  margin: 0;
}
.aic-psheet__right {
  margin-left: auto;
}
.aic-sheetwin .hidden {
  display: none;
}
.aic-sheetwin .aic-hint {
  margin: 0;
  font: 400 12px/18px var(--aic-font-sans);
  color: var(--aic-ink-3);
}
.aic-sheetwin .aic-psheet__warn {
  color: var(--aic-late);
}

/* ── The facilitator on a phone: Run and Follow only, one column (static/facilitator/mobile.js) ── */
.aic-run__back {
  display: none;
}
.fphone .aic-top {
  gap: 6px;
  padding-left: 8px;
  padding-right: 8px;
}
.fphone .aic-top .aic-top__brand,
.fphone .aic-top .aic-top__rule,
.fphone .aic-top .aic-top__name,
.fphone .aic-top .aic-tab[data-s="frame"],
.fphone .aic-top .aic-tab[data-s="prep"],
.fphone .aic-top .aic-tabs__sep,
.fphone .aic-top .aic-top__status,
.fphone .aic-top .aic-top__presence,
.fphone .aic-top .aic-top__ghost,
.fphone .aic-top .aic-top__avatar {
  display: none;
}
.fphone .aic-top .aic-btn--add {
  padding: 2px 12px;
  font-size: 0;
}
.fphone .aic-top .aic-btn--add::before {
  content: "+";
  font-size: 22px;
  line-height: 1;
}
.fphone .aic-top [data-h="openHelp"] {
  display: none;
}
.aic-run__next {
  padding: 10px 12px;
  border-bottom: 1px solid var(--aic-line);
}
.fphone #run-timeline,
.fphone .aic-run__keys {
  display: none;
}
.fphone .aic-run__body {
  grid-template-columns: minmax(0, 1fr);
}
.fphone .aic-run__work,
.fphone.fwork-open .aic-run__queue {
  display: none;
}
.fphone.fwork-open .aic-run__work {
  display: block;
  overflow-y: auto;
}
.fphone .aic-run__whead,
.fphone .aic-run__summary {
  padding: 12px 16px;
}
.fphone .aic-thread {
  padding: 12px 14px 8px;
}
.fphone .aic-abox {
  padding: 12px 16px 20px;
}
.fphone .aic-run .aic-draft {
  margin-left: 10px;
  margin-right: 10px;
}
.fphone .aic-run__back {
  display: flex;
  align-items: center;
  gap: 6px;
  width: 100%;
  padding: 12px 16px;
  border: none;
  border-bottom: 1px solid var(--aic-line);
  background: var(--aic-surface-sunk);
  color: var(--aic-ink);
  font: 600 15px var(--aic-font-sans);
  text-align: left;
  cursor: pointer;
}
.fphone .aic-follow__pin,
.fphone .aic-follow__label,
.fphone .aic-follow__hint,
.fphone .aic-follow__help,
.fphone .aic-follow__legend,
.fphone .aic-follow__cols {
  display: none;
}
.fphone .aic-follow__bar {
  flex-wrap: wrap;
  gap: 8px;
  padding: 10px 12px;
}
.fphone .aic-follow__lanes {
  column-gap: 8px;
  padding: 0 10px 24px 0;
}

.fphone .aic-follow__panel {
  position: fixed;
  inset: 0;
  z-index: 500;
  max-width: none;
  width: auto;
  display: none;
}
.fphone.fpanel-open .aic-follow__panel:not(.hidden) {
  display: grid;
}
.aic-follow__convbar {
  position: fixed;
  left: 8px;
  right: 8px;
  bottom: 8px;
  z-index: 400;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  border-radius: 12px;
  border: 1px solid var(--aic-gold);
  background: var(--aic-surface-raised);
  color: var(--aic-ink);
  font-size: 14px;
  box-shadow: var(--aic-shadow-3);
}
.aic-follow__convbar span {
  flex: 1;
  font-weight: 600;
}
.aic-follow__convbar.hidden {
  display: none;
}
.fphone .aic-follow__lanes {
  padding-bottom: 80px;
}
.fphone .aic-window__foot {
  position: sticky;
  bottom: calc(-1 * var(--aic-space-4));
  z-index: 2;
  background: var(--aic-surface);
}
.fphone .aic-window {
  width: calc(100vw - 12px);
  max-height: calc(100dvh - 24px);
}
.fphone .aic-draft__acts {
  position: sticky;
  bottom: 0;
  z-index: 2;
  flex-wrap: nowrap;
  overflow-x: auto;
  padding-top: 8px;
  padding-bottom: 8px;
  background: var(--aic-surface-raised);
}
.fphone .aic-draft__acts > * {
  flex-shrink: 0;
  white-space: nowrap;
}
.fphone .aic-draft__acts .aic-btn--large {
  padding-top: 8px;
  padding-bottom: 8px;
}
.fphone #draft-text {
  min-height: 200px;
}
/* the warning « on a phone, X will not see this » above the window's actions */
.aic-inj__phonewarn {
  margin: 0 var(--aic-space-5) var(--aic-space-2);
  padding: 8px 12px;
  border-radius: 8px;
  background: var(--aic-wait-bg);
  color: var(--aic-wait);
  font-size: 13px;
  line-height: 1.45;
}
/* Follow on a phone: a support, not the control room — one team, a compact head, a packed feed */
.fphone .aic-follow__axhead,
.fphone .aic-follow__axis {
  display: none;
}
.fphone .aic-follow__lanes {
  padding-left: 10px;
}
.fphone .aic-follow__head {
  position: static;
}
.fphone .aic-follow__kpis {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.fphone .aic-follow__kpi:nth-child(3) {
  display: none; /* « injects followed up » serves the debrief, not the round between the groups */
}
.fphone .aic-follow__kpi {
  padding: 4px 9px;
  gap: 5px;
  border-radius: 8px;
  min-height: 0;
}
.fphone .aic-follow__v {
  font-size: 14px;
}
.fphone .aic-follow__l {
  font-size: 11px;
}
.fphone .aic-follow__lanes .aic-ev {
  display: block;
  width: 86%;
  margin-left: 0;
  padding: 7px 10px 7px 14px;
}
.aic-evp__top {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 11px;
  color: var(--aic-ink-3);
}
.aic-evp__st {
  margin-left: auto;
  font-weight: 600;
  text-align: right;
}
.aic-evp__who {
  display: block;
  margin-top: 2px;
  font-size: 13.5px;
  line-height: 1.35;
  color: var(--aic-ink);
}
.aic-evp__who b {
  font-weight: 600;
}
.aic-evp__subj {
  display: block;
  font-size: 12.5px;
  line-height: 1.35;
  color: var(--aic-ink-2);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.aic-ev--in .aic-evp__st {
  color: var(--aic-inject);
}
.aic-ev--late .aic-evp__st {
  color: var(--aic-late);
}
.aic-ev--int .aic-evp__st {
  color: var(--aic-internal);
}
.aic-ev--wait .aic-evp__st {
  color: var(--aic-wait);
}
.aic-ev--ok .aic-evp__st {
  color: var(--aic-reply);
}
.fphone .aic-follow__lanes .aic-ev--int {
  margin-left: 7%;
}
.fphone .aic-follow__lanes .aic-ev--wait,
.fphone .aic-follow__lanes .aic-ev--ok,
.fphone .aic-follow__lanes .aic-ev--teams-out {
  margin-left: 14%;
}

/* a word that opens something, inside a sentence (« 2 remaining ») */
.aic-link {
  background: none;
  border: 0;
  padding: 0;
  font: inherit;
  color: var(--aic-teal-ink);
  text-decoration: underline;
  cursor: pointer;
}


/* Run: « You play » the actor → « you answer » the team, two balanced blocks around a round arrow; the « To » line;
   Options and … */
.aic-run__whead--play { /* the two eyebrows and the two names on the same lines */
  align-items: flex-start;
  gap: 14px 24px;
  container-type: inline-size;
}
@container (max-width: 640px) { /* a narrow band: « you answer » under the actor played, in line with its name */
  .aic-run__whead--play > .aic-run__arrow {
    display: none;
  }
  .aic-run__whead--play > .aic-run__to {
    flex-basis: 100%;
    padding-left: 76px;
  }
}
.aic-run__who {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 0;
  flex: 1 1 0;
}
.aic-run__who > .aic-run__name { /* the same type as the person answered opposite */
  font: 600 20px/26px var(--aic-font-display);
  overflow-wrap: break-word;
}
.aic-run__who > .aic-run__wtools {
  margin: 6px 0 0;
}
.aic-run__eyebrow {
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 20px; /* with or without its tag, the names below start on the same line */
  font: 700 11px var(--aic-font-sans);
  letter-spacing: 0.1em;
  text-transform: uppercase;
  white-space: nowrap;
  color: var(--aic-ink-3);
}
.aic-run__rolelbl {
  font: 400 15px var(--aic-font-sans);
  color: var(--aic-ink-2);
}
.aic-run__arrow { /* who you play → whom you answer */
  flex: none;
  align-self: center;
  display: grid;
  place-items: center;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  border: 1px solid var(--aic-line-strong);
  color: var(--aic-ink-2);
}
.aic-run__toname {
  font: 600 20px/26px var(--aic-font-display);
  color: var(--aic-ink);
  max-width: 100%;
  overflow-wrap: anywhere;
}
.aic-run__toname > .aic-dot {
  display: inline-block;
  margin: 0 10px 3px 0;
  vertical-align: middle;
}
.aic-run__toperson {
  display: inline-block; /* the name goes to the next line whole; longer than the column, it wraps there */
  max-width: 100%;
  font: 400 15px var(--aic-font-sans);
  color: var(--aic-ink-2);
}
.aic-run__to {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 4px;
  min-width: 0;
  flex: 1 1 0; /* as wide as the actor played: the two sides balance, the long names wrap */
}
.aic-run__copy {
  font-size: 12px;
  color: var(--aic-ink-2);
}
.aic-btn--small {
  padding: 3px 10px;
  font-size: 12px;
  min-height: 0;
}
.aic-draft__to {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  margin: 6px 0;
}
.aic-draft__tolbl {
  color: var(--aic-ink-2);
  font-size: 13px;
}
.aic-chip {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 2px 10px;
  border-radius: 999px;
  border: 1px solid var(--aic-line);
  font-size: 13px;
}
.aic-chip button {
  border: 0;
  background: transparent;
  color: inherit;
  cursor: pointer;
  font-size: 14px;
}
.aic-draft__chan {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  flex: 1 1 100%;
  min-width: 0;
}
.aic-draft__chan .aic-inj__channels {
  flex: 1 1 100%;
  min-width: 0;
}
.aic-draft__chan .aic-inj__channels button {
  flex-direction: row;
  justify-content: center;
  gap: 5px;
  padding: 5px 4px;
  min-width: 0;
}
.aic-draft__chan .aic-inj__channels span {
  text-align: left;
}
.aic-draft__chan input {
  flex: 1;
  min-width: 120px;
}
.aic-draft__more summary {
  cursor: pointer;
  list-style: none;
  font-size: 13px;
  color: var(--aic-ink-2);
}
.aic-draft__more summary::-webkit-details-marker {
  display: none;
}
.aic-draft__more summary::after {
  content: " \25BE";
}

/* Light theme only (it lacked contrast between zones): each zone of Run has its own ground —
   the timeline a toolbar, the queue a quiet column with the selected row raised and marked, the header and the reply
   white, the thread on the page ground so its bubbles stand out */
.aic-run[data-aic-theme="light"] .aic-timeline {
  border-bottom: 1px solid var(--aic-line-strong);
  box-shadow: inset 0 -1px 0 var(--aic-gold);
}
.aic-run[data-aic-theme="light"] .aic-run__queue {
  border-right: 1px solid var(--aic-line-strong);
}
.aic-run[data-aic-theme="light"] .aic-row[aria-selected="true"] {
  background: var(--aic-surface-raised);
  box-shadow: inset 4px 0 0 var(--aic-teal-ink);
}
.aic-run[data-aic-theme="light"] .aic-run__work {
  background: var(--aic-ground);
}
.aic-run[data-aic-theme="light"] .aic-run__whead {
  background: var(--aic-surface-raised);
  border-bottom: 1px solid var(--aic-line-strong);
}
.aic-run[data-aic-theme="light"] .aic-msg {
  box-shadow: var(--aic-shadow-1);
}
.aic-run[data-aic-theme="light"] .aic-draft {
  background: var(--aic-surface-raised);
}

/* Regenerate, Write myself and « Handled, no reply » visible, on the right of Send and Call */
.aic-draft__more-acts {
  margin-left: auto;
  display: inline-flex;
  flex-wrap: wrap;
  gap: var(--aic-space-2);
}

/* The box of the actor played, in Run beside « Mes acteurs » —
   who it is and who plays it, then four tabs (Reçus, Agenda, Documents, Mémoire); read only */
.aic-abox {
  grid-row: 1 / -1;
  min-height: 0;
  overflow-y: auto;
  padding: 16px 28px 24px;
  display: flex;
  flex-direction: column;
  gap: var(--aic-space-3);
}
.aic-abox__head {
  display: flex;
  align-items: center;
  gap: 12px 16px;
  flex-wrap: wrap;
}
.aic-abox__who {
  display: flex;
  flex-direction: column;
  min-width: 0;
  flex: 1 1 200px;
}
.aic-abox__acts {
  display: flex;
  align-items: center;
  gap: var(--aic-space-2);
  flex-wrap: wrap;
}
.aic-abox__h {
  font: 700 11px/14px var(--aic-font-sans);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--aic-ink-3);
  margin: var(--aic-space-3) 0 var(--aic-space-1);
}
.aic-abox__gone a { /* a deposit the team deleted, kept for the facilitators */
  color: var(--aic-ink-3);
  text-decoration: line-through;
}
/* The files of an actor's box (« Documents »): one row each as in the tool's other lists — its type, its name and,
   under it, where and when; its actions on the right; air between the rows and between the two parts */
.aic-abox__add {
  margin: var(--aic-space-2) 0 var(--aic-space-3);
}
.aic-abox__add > .pk-btn,
.aic-abox__add > select {
  flex: 1 1 240px;
  min-width: 0;
}
.aic-abox__h--next {
  margin-top: var(--aic-space-5);
}
.aic-afiles {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: var(--aic-space-2);
}
.aic-afile {
  display: flex;
  align-items: center;
  gap: var(--aic-space-3);
  padding: var(--aic-space-2) var(--aic-space-3);
  border: 1px solid var(--aic-line);
  border-radius: var(--aic-radius-md);
  background: var(--aic-surface-raised);
}
.aic-afile__ext {
  flex: none;
  min-width: 44px;
  padding: 4px 6px;
  border-radius: var(--aic-radius-sm);
  background: var(--aic-surface-sunk);
  color: var(--aic-ink-2);
  font: 700 11px/14px var(--aic-font-sans);
  letter-spacing: 0.04em;
  text-align: center;
}
.aic-afile__txt {
  flex: 1 1 auto;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.aic-afile__name {
  font: 600 14px/20px var(--aic-font-sans);
  color: var(--aic-ink);
  overflow-wrap: anywhere;
}
.aic-afile__name a {
  color: var(--aic-ink);
  text-decoration: none;
}
.aic-afile__name a:hover {
  color: var(--aic-teal-ink);
  text-decoration: underline;
}
.aic-afile__txt small {
  font-size: 12px;
  color: var(--aic-ink-3);
}
.aic-abox__line {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--aic-space-3);
}
.aic-subtabs {
  display: flex;
  gap: var(--aic-space-4);
  border-bottom: 1px solid var(--aic-line);
  overflow-x: auto;
}
.aic-subtabs button {
  border: 0;
  border-bottom: 2px solid transparent;
  background: transparent;
  padding: 8px 0;
  color: var(--aic-ink-3);
  font: 600 13px var(--aic-font-sans);
  cursor: pointer;
  white-space: nowrap;
}
.aic-subtabs button[aria-selected="true"] {
  color: var(--aic-ink);
  border-bottom-color: var(--aic-teal);
}
/* « Mes acteurs »: the actors by who plays them, the number of conversations waiting for each */
.aic-alist__group { /* the kind of entity on its own line, then its name as written, then the count at the right */
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  column-gap: var(--aic-space-2);
  row-gap: 6px;
  padding: 20px 20px 8px;
  font: 600 13px/18px var(--aic-font-sans);
  color: var(--aic-ink-2);
}
.aic-alist__cat { /* the category, once over its groups (« Structure de crise », « Externe · parle aux équipes ») */
  padding: 24px 20px 0;
}
.aic-alist__cat + .aic-alist__group {
  padding-top: 10px;
}
.aic-alist__gname {
  flex: 1 1 0;
  min-width: 0;
}
.aic-alist__gcount {
  font: 600 12px/18px var(--aic-font-sans);
  color: var(--aic-ink-3);
}
.aic-alist__none {
  padding: 4px 20px 10px;
  font-size: 12px;
  color: var(--aic-ink-3);
}
.aic-alist__row {
  grid-template-columns: auto minmax(0, 1fr) 24px auto 30px;
  align-items: center;
  padding: 9px 10px 9px 16px;
}
/* « Jouer », compact: the name takes the room */
.aic-alist__row [data-h="actorPlay"] {
  padding: 0 8px;
}
.aic-alist__played { /* the state of an actor one plays, in the place of « Jouer »: a mark, not a button */
  font: 600 12px/16px var(--aic-font-sans);
  color: var(--aic-ink-3);
  white-space: nowrap;
  padding: 0 8px;
}
.aic-alist__row > .aic-btn--small { /* « Jouer » and « ⋯ » of a row: one height */
  min-height: 30px;
}
.aic-alist__txt {
  display: flex;
  flex-direction: column;
  min-width: 0;
}
.aic-alist__txt > span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
/* « Mes acteurs » and a row of the tool's own words: read in full, on two lines when needed; the other lists keep
   their one line */
.aic-alist__txt--actor > span,
.aic-alist__txt--wrap > span {
  white-space: normal;
  overflow-wrap: anywhere;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}
.aic-alist__count {
  font: 700 11px/18px var(--aic-font-sans);
  min-width: 18px;
  padding: 0 6px;
  text-align: center;
  border-radius: var(--aic-radius-pill);
  background: var(--aic-teal);
  color: var(--aic-navy);
}
.aic-avatar--small {
  width: 30px;
  height: 30px;
  font-size: 11px;
  box-shadow: none;
}
.aic-aspace__teams {
  display: flex;
  flex-wrap: wrap;
  gap: var(--aic-space-2);
}
.aic-aspace__sec {
  border: 1px solid var(--aic-line);
  border-radius: var(--aic-radius-md);
  padding: var(--aic-space-3) var(--aic-space-4);
  background: var(--aic-surface-raised);
}
.aic-aspace__ai {
  border-left: 4px solid var(--aic-ai);
}
.aic-aspace__sec h3 {
  font: 600 15px/20px var(--aic-font-sans);
  margin: 0 0 var(--aic-space-2);
}
.aic-aspace__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 6px;
  font-size: 13px;
  line-height: 1.45;
}
.aic-aspace__when {
  display: block;
  font-size: 11px;
  color: var(--aic-ink-3);
}
.aic-aspace__memo {
  white-space: pre-wrap;
  font-size: 13px;
  line-height: 1.5;
  margin: 0;
}
.aic-aspace__docs {
  display: flex;
  flex-wrap: wrap;
  gap: var(--aic-space-2);
  margin-top: var(--aic-space-2);
}
.aic-aspace__docs a {
  color: var(--aic-teal-ink);
}

/* The rhythm band of each team above the columns — received in blue, internal in green, sent in
   orange, the silences dotted; the key moments as ★; a moment in three cards */
.aic-rhythm-wrap {
  padding: var(--aic-space-2) var(--aic-space-5) 0;
  display: flex;
  flex-direction: column;
  gap: var(--aic-space-3);
}
.aic-rhythm-wrap:empty {
  display: none;
}
.aic-rhythm {
  border: 1px solid var(--aic-line);
  border-radius: var(--aic-radius-md);
  background: var(--aic-surface);
  padding: var(--aic-space-2) var(--aic-space-3);
}
.aic-report__rhythm .aic-rhythm + .aic-rhythm {
  margin-top: var(--aic-space-3);
}
.aic-rhythm__head {
  display: flex;
  align-items: center;
  gap: var(--aic-space-2);
  font-size: 13px;
}
.aic-rhythm__keys {
  position: relative;
  height: 22px;
  margin-left: 70px;
}
.aic-rhythm__key {
  position: absolute;
  top: 0;
  transform: translateX(-50%);
  border: 0;
  background: none;
  color: var(--aic-gold-ink); /* the deeper gold on light grounds, read at 2.3:1 before */
  font-size: 16px;
  line-height: 20px;
  cursor: pointer;
  padding: 0 2px;
}
.aic-rhythm__key.is-on {
  outline: 2px solid var(--aic-focus);
  border-radius: var(--aic-radius-sm);
}
/* the facilitators' notes (facnotes.js): apart from the team's work — a band in the team's head, a ✎ on the rhythm */
.aic-rhythm__fnote {
  position: absolute;
  top: 0;
  transform: translateX(-50%);
  border: 0;
  background: none;
  color: var(--aic-teal-ink);
  font-size: 15px;
  line-height: 20px;
  cursor: pointer;
  padding: 0 2px;
}
.aic-report .aic-rhythm__fnote {
  pointer-events: none;
}
.aic-follow__notes {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: var(--aic-space-2);
  min-width: 0;
  padding: 6px 12px;
  border: 0;
  border-left: 3px solid var(--aic-teal-ink);
  border-radius: var(--aic-radius-sm);
  background: var(--aic-surface-sunk);
  color: var(--aic-ink);
  font: inherit;
  font-size: 13px;
  text-align: left;
  cursor: pointer;
}
.aic-follow__notes:hover {
  background: var(--aic-surface-raised);
}
.aic-follow__notes-t {
  flex: none;
  font-weight: 600;
  color: var(--aic-teal-ink);
}
.aic-follow__notes-more {
  font-size: 12px;
  color: var(--aic-teal-ink);
}
.aic-follow__notes-last {
  min-width: 0;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  color: var(--aic-ink-2);
}
.aic-fnote {
  padding: 10px 14px;
  margin-top: var(--aic-space-2);
  border-left: 3px solid var(--aic-teal-ink);
  border-radius: var(--aic-radius-sm);
  background: var(--aic-surface-sunk);
}
.aic-fnote__meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--aic-space-2);
  font-size: 12px;
  color: var(--aic-ink-3);
}
.aic-fnote__text {
  margin: 4px 0 0;
  white-space: pre-wrap;
}
.aic-rhythm__row {
  display: flex;
  align-items: flex-end;
  gap: var(--aic-space-2);
  height: 30px;
}
.aic-rhythm__lbl {
  width: 62px;
  flex: 0 0 62px;
  font-size: 11px;
  color: var(--aic-ink-3);
  align-self: center;
}
.aic-rhythm__bars {
  flex: 1;
  display: flex;
  align-items: flex-end;
  gap: 2px;
  height: 28px;
  border-bottom: 1px solid var(--aic-line);
}
.aic-rhythm__bar {
  flex: 1;
  min-width: 2px;
  border-radius: 2px 2px 0 0;
  cursor: pointer;
}
.aic-rhythm__row--in .aic-rhythm__bar {
  background: var(--aic-inject);
}
/* one set of meaning colours in Monitor (rule 22): received blue, internal sand, sent green — as its columns */
.aic-rhythm__row--mid .aic-rhythm__bar {
  background: var(--aic-internal);
}
.aic-rhythm__row--out .aic-rhythm__bar {
  background: var(--aic-reply);
}
.aic-rhythm__bar.is-silent {
  border-bottom: 2px dotted var(--aic-line-strong);
}
.aic-rhythm__toggle {
  align-self: flex-start;
  border: 1px solid var(--aic-line);
  border-radius: var(--aic-radius-md);
  background: var(--aic-surface);
  color: var(--aic-ink);
  font: inherit;
  font-size: 13px;
  font-weight: 600;
  padding: 3px 10px;
  cursor: pointer;
}
.aic-rhythm__count {
  color: var(--aic-gold-ink);
  font-weight: 400;
}
.aic-rhythm__legend {
  font-size: 11px;
  color: var(--aic-ink-3);
  margin: 0;
}
.aic-rhythm__moment {
  margin-top: var(--aic-space-3);
  border-top: 1px solid var(--aic-line);
  padding-top: var(--aic-space-3);
}
.aic-rhythm__mhead {
  display: flex;
  align-items: baseline;
  gap: var(--aic-space-2);
  flex-wrap: wrap;
  font-size: 13px;
}
.aic-rhythm__mhead span {
  color: var(--aic-ink-3);
  font-size: 12px;
}
.aic-rhythm__mhead button {
  margin-left: auto;
}
.aic-rhythm__cards {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); /* the three cards side by side, never two and one alone */
  gap: var(--aic-space-3);
  margin-top: var(--aic-space-2);
}
.aic-rhythm__card {
  border: 1px solid var(--aic-line);
  border-radius: var(--aic-radius-md);
  background: var(--aic-surface-raised);
  padding: var(--aic-space-3);
  font-size: 13px;
  line-height: 1.45;
}
.aic-rhythm__card h4 {
  font: 700 11px/14px var(--aic-font-sans);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--aic-ink-3);
  margin: 0 0 var(--aic-space-2);
}
.aic-rhythm__card p {
  margin: 0 0 var(--aic-space-2);
}
.aic-rhythm__card ul,
.aic-rhythm__card ol {
  margin: 0;
  padding-left: 18px;
}
.aic-rhythm__card li span {
  color: var(--aic-ink-3);
  font-size: 12px;
}
.aic-rhythm__card li.is-this {
  font-weight: 500;
  color: var(--aic-ink);
}
.aic-rhythm__card i {
  font-style: normal;
  color: var(--aic-ink-3);
}
.aic-rhythm__bench {
  color: var(--aic-ai);
}

/* The debrief report in the order of Follow — frame, rhythm, key moments with questions */
.aic-report {
  display: flex;
  flex-direction: column;
  gap: var(--aic-space-3);
  background: var(--aic-ground);
  color: var(--aic-ink);
  padding: var(--aic-space-3);
  border-radius: var(--aic-radius-md);
}
.aic-report:empty {
  display: none;
}
.aic-report__sec h3 {
  font: 600 19px/26px var(--aic-font-display);
  margin: 0 0 var(--aic-space-3);
}
.aic-report__sec + .aic-report__sec {
  border-top: 1px solid var(--aic-line);
  padding-top: var(--aic-space-4);
}
.aic-report__sec p {
  margin: 0;
  font-size: 13px;
}
.aic-report__team {
  display: flex;
  align-items: center;
  gap: var(--aic-space-2);
  font: 600 15px/20px var(--aic-font-sans);
  margin: var(--aic-space-3) 0 var(--aic-space-2);
}
.aic-report__moment {
  border: 1px solid var(--aic-line);
  border-radius: var(--aic-radius-md);
  background: var(--aic-surface);
  padding: var(--aic-space-3);
  margin-bottom: var(--aic-space-3);
  break-inside: avoid;
}
.aic-report__qlbl {
  display: flex;
  flex-direction: column;
  gap: var(--aic-space-1);
  margin-top: var(--aic-space-3);
  font-size: 12px;
  font-weight: 600;
  color: var(--aic-ink-2);
}
.aic-report__q {
  font-weight: 400;
  white-space: pre-wrap;
  color: var(--aic-ink);
}
.aic-report .aic-rhythm__key,
.aic-report .aic-rhythm__bar {
  pointer-events: none;
}
/* who joined a team, shown as a button with its number, easy to find on the team's card */
.aic-team__people > summary {
  display: inline-flex;
  align-items: center;
  gap: var(--aic-space-2);
  min-height: 32px;
  padding: 0 var(--aic-space-3);
  border-radius: var(--aic-radius-sm);
  border: 1px solid var(--aic-line-strong);
  color: var(--aic-ink);
  font: 600 13px/18px var(--aic-font-sans);
  cursor: pointer;
}
.aic-team__people > summary:hover {
  border-color: var(--aic-gold);
}
.aic-team__people[open] > summary {
  margin-bottom: var(--aic-space-2);
}
.aic-team__pn {
  min-width: 20px;
  padding: 0 6px;
  border-radius: 999px;
  background: var(--aic-gold);
  color: var(--aic-navy);
  text-align: center;
  font-size: 12px;
}

/* « Envoi dans 5 s… Annuler », « Appel coupé… Rappeler » (core.js, actionBar) */
.aic-undo{position:fixed;left:16px;bottom:24px;z-index:900;display:flex;gap:14px;align-items:center;background:var(--aic-navy);color:var(--aic-on-dark);padding:10px 14px;border-radius:8px;box-shadow:var(--aic-shadow-3);font-size:13px;}
.aic-undo button{border:0;background:transparent;color:var(--aic-gold);font:inherit;font-weight:700;cursor:pointer;}

/* Entry page, Cadre and Scénario.
   The list of exercises: wider, each exercise a card of the tool, its name and state readable at a glance */
body:not(.fphone) #dash-screen .dash-body {
  max-width: 1120px;
  margin-top: 40px;
}
body:not(.fphone) #dash-screen .dash-title {
  font-size: 34px;
  line-height: 42px;
}
body:not(.fphone) #dash-screen .client-label {
  font-size: 12px;
  letter-spacing: 0.14em;
  margin: 26px 0 12px;
}
body:not(.fphone) #dash-screen .sess-card {
  border-radius: 16px;
  padding: 20px 24px;
  margin-bottom: 12px;
  align-items: center;
}
body:not(.fphone) #dash-screen .sess-name {
  font: 600 22px/28px var(--aic-font-display);
  margin-bottom: 6px;
}
body:not(.fphone) #dash-screen .sess-name span {
  display: inline-block;
  vertical-align: middle;
  font-family: var(--aic-font-sans);
  font-size: 12px !important;
  padding: 2px 10px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--aic-gold) 15%, transparent);
}
body:not(.fphone) #dash-screen .sess-meta {
  font-size: 13.5px;
}
body:not(.fphone) #dash-screen .sess-btns .sbtn {
  border-radius: 10px;
  padding: 9px 18px;
  font-size: 13.5px;
}
body:not(.fphone) #dash-screen.navy .sess-card {
  background: var(--aic-surface);
  color: var(--aic-ink);
  border-color: var(--aic-line);
  box-shadow: var(--aic-shadow-2);
}
body:not(.fphone) #dash-screen.navy .sess-card:hover {
  border-color: var(--aic-teal);
}
body:not(.fphone) #dash-screen.navy .sess-name {
  color: var(--aic-ink);
}
body:not(.fphone) #dash-screen.navy .sess-meta,
body:not(.fphone) #dash-screen.navy .client-label {
  color: var(--aic-ink-2);
}
body:not(.fphone) #dash-screen.navy .sess-btns .sbtn.primary {
  background: var(--aic-action);
  color: var(--aic-on-action);
  border-color: var(--aic-action);
}
body:not(.fphone) #dash-screen.navy .sess-more summary.sbtn {
  background: transparent;
  color: var(--aic-ink);
  border-color: var(--aic-line-strong);
}
body:not(.fphone) #dash-screen.navy .dash-hdr .sbtn.primary {
  background: var(--aic-gold);
  color: var(--aic-ground);
  border: 0;
  border-radius: 12px;
  padding: 10px 18px !important;
  font-weight: 600;
}
/* Cadre: a single cell fills the width (several: side by side as before); the teams side by side on a wide screen,
   each invitation link whole on its own line */
.aic-frame__cells {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 520px), 1fr));
}
.aic-cell,
.aic-team {
  border-radius: 16px;
}
.aic-section {
  border-radius: 20px;
}
#tm-body {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 560px), 1fr));
  gap: 14px;
}
#tm-body > :not(.aic-team) {
  grid-column: 1 / -1;
}
#tm-body > .aic-team {
  margin: 0;
  align-self: start;
}
#tm-body .aic-team__link {
  flex-wrap: wrap;
}
#tm-body .aic-team__link > .aic-input {
  flex: 1 1 100%;
  min-width: 0;
}
/* Scénario: the scenario text gets the room it deserves */
#sc-text {
  min-height: 220px;
  font-size: 14.5px;
  line-height: 1.6;
}
/* The facilitator's windows.
   ⋯ menu: the chosen theme and size in the tool's green, not a pale blue */
body .fmenu .fm-pair button.on {
  background: var(--aic-action);
  border-color: var(--aic-action);
  color: var(--aic-on-action);
}
/* Nouvel inject: the positions as chips with their tick, as in the Cadre */
.aic-inj__roles label {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 14px 6px 10px;
  border: 1px solid var(--aic-line-strong);
  border-radius: 999px;
  color: var(--aic-ink);
  cursor: pointer;
}
.aic-inj__roles label:has(input:checked) {
  border-color: var(--aic-teal);
  background: color-mix(in srgb, var(--aic-teal) 14%, transparent);
}
.aic-inj__roles input,
.aic-inj__check input {
  accent-color: var(--aic-teal);
  margin: 0;
}
/* Nouvel exercice: « Reprendre un fichier (zip) » in the tool's palette */
.modal label.tb.primary {
  background: var(--aic-surface-raised);
  color: var(--aic-ink);
  border: 1px solid var(--aic-line-strong);
  border-radius: 10px;
  padding: 7px 14px;
  font-weight: 600;
}
/* the quick choices beside a moment typed during play, and the scenario's moment it gives */
.aic-when {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--aic-space-2);
  margin: var(--aic-space-2) 0;
}
.aic-when__btns {
  display: inline-flex;
  flex-wrap: wrap;
  gap: 6px;
}
.aic-when .aic-hint {
  font: 400 12px/18px var(--aic-font-sans);
  color: var(--aic-ink-2);
}
.aic-when .aic-hint:empty {
  display: none; /* no empty line under the quick times */
}
/* a required field left empty, in red with its sentence (util.js fieldError) */
.aic-field-bad {
  border-color: var(--aic-late) !important;
  box-shadow: 0 0 0 1px var(--aic-late);
}
.aic-field-msg {
  margin: 4px 0 8px;
  font: 600 12px/18px var(--aic-font-sans);
  color: var(--aic-late);
}
/* an alert that stays at the top of the page until it is closed (core.js facAlert) */
/* notices at the bottom right, over no heading nor field the facilitator is reading */
.aic-alerts {
  position: fixed;
  bottom: 20px;
  right: 20px;
  z-index: 800;
  display: flex;
  flex-direction: column;
  gap: var(--aic-space-2);
  width: min(520px, calc(100vw - 32px));
}
.aic-prop-reopen {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--aic-space-2);
  margin: var(--aic-space-2) 0 var(--aic-space-3);
  padding: 8px 12px;
  border-radius: var(--aic-radius-sm);
  background: var(--aic-surface-sunk);
  font-size: 13px;
  color: var(--aic-ink-2);
}
.aic-prop-reopen > span {
  margin-right: auto;
}
.aic-alert {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--aic-space-2);
  background: var(--aic-surface-raised);
  color: var(--aic-ink);
  border: 1px solid var(--aic-line-strong);
  border-left: 4px solid var(--aic-wait);
  border-radius: 10px;
  padding: 12px 14px;
  box-shadow: var(--aic-shadow-3);
  font: 600 14px/20px var(--aic-font-sans);
}
.aic-alert__text {
  flex: 1 1 260px;
}
/* in a card (SimSearch: sources without a record), not floating */
.aic-alert.web-missing {
  box-shadow: none;
  margin: 0 0 10px;
}
.aic-alert__x {
  background: transparent;
  border: 0;
  color: var(--aic-ink-3);
  font-size: 20px;
  line-height: 1;
  cursor: pointer;
}
/* a live call large in the middle of the screen, as a Teams call window */
.aic-call.aic-call--stage {
  left: 50%;
  top: 72px;
  bottom: auto;
  transform: translateX(-50%);
  width: min(520px, calc(100vw - 32px));
  padding: 20px 22px;
  gap: 8px;
  z-index: 750;
}
.aic-call--stage .aic-call__label {
  font: 600 20px/1.3 var(--aic-font-display);
  letter-spacing: 0;
  text-transform: none;
}
.aic-call--stage .aic-call__who {
  font-size: 16px;
}
.aic-call--stage .aic-call__sub {
  font-size: 14px;
}
.aic-call--stage .aic-call__tm {
  font-size: 18px;
}
.aic-call--stage.ring {
  animation: aic-call-ring 1.2s ease-in-out infinite;
}
@keyframes aic-call-ring {
  50% {
    box-shadow: 0 0 0 6px var(--aic-teal), var(--aic-shadow-3);
  }
}
/* the results of a search in an actor's memory, apart from the sections, the word highlighted */
.aic-abox__found {
  margin: var(--aic-space-2) 0 var(--aic-space-4);
  padding: var(--aic-space-2) var(--aic-space-3);
  border: 1px solid var(--aic-line-strong);
  border-radius: 10px;
  background: var(--aic-surface-sunk);
}
.aic-abox__found mark {
  background: var(--aic-mark-bg);
  color: var(--aic-mark-ink);
  border-radius: 3px;
  padding: 0 2px;
}

/* a file's name, however long, breaks inside its frame (a link to an attachment, a list of attachments) */
.aic a[href*="/api/attachment/"],
.aic-msg,
.aic-follow__file {
  overflow-wrap: anywhere;
}