/*! tailwindcss v4.3.1 | MIT License | https://tailwindcss.com */
@layer properties;
@layer theme, base, components, utilities;
@layer theme {
  :root, :host {
    --font-sans: "Geist", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
    --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono",
      "Courier New", monospace;
    --color-red-50: oklch(97.1% 0.013 17.38);
    --color-red-100: oklch(93.6% 0.032 17.717);
    --color-red-600: oklch(57.7% 0.245 27.325);
    --color-red-700: oklch(50.5% 0.213 27.518);
    --color-amber-50: oklch(98.7% 0.022 95.277);
    --color-amber-100: oklch(96.2% 0.059 95.617);
    --color-amber-700: oklch(55.5% 0.163 48.998);
    --color-green-50: oklch(98.2% 0.018 155.826);
    --color-green-100: oklch(96.2% 0.044 156.743);
    --color-green-600: oklch(62.7% 0.194 149.214);
    --color-green-700: oklch(52.7% 0.154 150.069);
    --color-black: #000;
    --color-white: #fff;
    --spacing: 0.25rem;
    --container-xs: 20rem;
    --container-sm: 24rem;
    --container-md: 28rem;
    --container-xl: 36rem;
    --container-2xl: 42rem;
    --container-3xl: 48rem;
    --container-4xl: 56rem;
    --text-xs: 0.6875rem;
    --text-xs--line-height: calc(1 / 0.75);
    --text-sm: 0.75rem;
    --text-sm--line-height: calc(1.25 / 0.875);
    --text-base: 0.8125rem;
    --text-base--line-height: calc(1.5 / 1);
    --text-lg: 1rem;
    --text-lg--line-height: calc(1.75 / 1.125);
    --font-weight-normal: 400;
    --font-weight-medium: 500;
    --font-weight-semibold: 600;
    --font-weight-bold: 700;
    --tracking-normal: 0em;
    --tracking-wide: 0.025em;
    --leading-snug: 1.375;
    --leading-normal: 1.5;
    --leading-relaxed: 1.625;
    --radius-sm: 4px;
    --radius-md: 8px;
    --radius-lg: 0.5rem;
    --ease-out: cubic-bezier(0, 0, 0.2, 1);
    --animate-spin: spin 1s linear infinite;
    --animate-pulse: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
    --default-transition-duration: 150ms;
    --default-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    --default-font-family: var(--font-sans);
    --default-mono-font-family: var(--font-mono);
    --color-gray-1: var(--card);
    --color-gray-2: var(--paper);
    --color-gray-3: var(--paper-2);
    --color-gray-4: color-mix(in srgb, var(--paper-2) 55%, var(--line-2));
    --color-gray-5: var(--line);
    --color-gray-6: var(--line-2);
    --color-gray-7: color-mix(in srgb, var(--line-2) 50%, var(--ink-faint));
    --color-gray-8: var(--ink-faint);
    --color-gray-9: var(--ink-3);
    --color-gray-10: var(--ink-3);
    --color-gray-11: var(--ink-2);
    --color-gray-12: var(--ink);
    --color-accent-2: var(--paper-2);
    --color-accent-3: var(--paper-2);
    --color-accent-4: color-mix(in srgb, var(--paper-2) 55%, var(--line-2));
    --color-accent-5: var(--line);
    --color-accent-6: var(--line-2);
    --color-accent-7: var(--ink-faint);
    --color-accent-8: var(--ink-2);
    --color-accent-9: var(--ink);
    --color-accent-10: color-mix(in srgb, var(--ink) 84%, var(--paper));
    --color-accent-11: var(--ink);
    --color-accent-12: var(--ink);
    --color-star: var(--ink);
    --color-tag-red: var(--danger);
    --color-tag-orange: #f76b15;
    --color-tag-yellow: #ffc53d;
    --color-tag-green: #30a46c;
    --color-tag-sky: #7ce2fe;
    --color-tag-turquoise: #12a594;
    --color-tag-blue: #3e63dd;
    --color-tag-purple: #8e4ec6;
    --radius-pill: 999px;
  }
}
@layer base {
  *, ::after, ::before, ::backdrop, ::file-selector-button {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    border: 0 solid;
  }
  html, :host {
    line-height: 1.5;
    -webkit-text-size-adjust: 100%;
    tab-size: 4;
    font-family: var(--default-font-family, ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");
    font-feature-settings: var(--default-font-feature-settings, normal);
    font-variation-settings: var(--default-font-variation-settings, normal);
    -webkit-tap-highlight-color: transparent;
  }
  hr {
    height: 0;
    color: inherit;
    border-top-width: 1px;
  }
  abbr:where([title]) {
    -webkit-text-decoration: underline dotted;
    text-decoration: underline dotted;
  }
  h1, h2, h3, h4, h5, h6 {
    font-size: inherit;
    font-weight: inherit;
  }
  a {
    color: inherit;
    -webkit-text-decoration: inherit;
    text-decoration: inherit;
  }
  b, strong {
    font-weight: bolder;
  }
  code, kbd, samp, pre {
    font-family: var(--default-mono-font-family, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);
    font-feature-settings: var(--default-mono-font-feature-settings, normal);
    font-variation-settings: var(--default-mono-font-variation-settings, normal);
    font-size: 1em;
  }
  small {
    font-size: 80%;
  }
  sub, sup {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: baseline;
  }
  sub {
    bottom: -0.25em;
  }
  sup {
    top: -0.5em;
  }
  table {
    text-indent: 0;
    border-color: inherit;
    border-collapse: collapse;
  }
  :-moz-focusring {
    outline: auto;
  }
  progress {
    vertical-align: baseline;
  }
  summary {
    display: list-item;
  }
  ol, ul, menu {
    list-style: none;
  }
  img, svg, video, canvas, audio, iframe, embed, object {
    display: block;
    vertical-align: middle;
  }
  img, video {
    max-width: 100%;
    height: auto;
  }
  button, input, select, optgroup, textarea, ::file-selector-button {
    font: inherit;
    font-feature-settings: inherit;
    font-variation-settings: inherit;
    letter-spacing: inherit;
    color: inherit;
    border-radius: 0;
    background-color: transparent;
    opacity: 1;
  }
  :where(select:is([multiple], [size])) optgroup {
    font-weight: bolder;
  }
  :where(select:is([multiple], [size])) optgroup option {
    padding-inline-start: 20px;
  }
  ::file-selector-button {
    margin-inline-end: 4px;
  }
  ::placeholder {
    opacity: 1;
  }
  @supports (not (-webkit-appearance: -apple-pay-button))  or (contain-intrinsic-size: 1px) {
    ::placeholder {
      color: currentcolor;
      @supports (color: color-mix(in lab, red, red)) {
        color: color-mix(in oklab, currentcolor 50%, transparent);
      }
    }
  }
  textarea {
    resize: vertical;
  }
  ::-webkit-search-decoration {
    -webkit-appearance: none;
  }
  ::-webkit-date-and-time-value {
    min-height: 1lh;
    text-align: inherit;
  }
  ::-webkit-datetime-edit {
    display: inline-flex;
  }
  ::-webkit-datetime-edit-fields-wrapper {
    padding: 0;
  }
  ::-webkit-datetime-edit, ::-webkit-datetime-edit-year-field, ::-webkit-datetime-edit-month-field, ::-webkit-datetime-edit-day-field, ::-webkit-datetime-edit-hour-field, ::-webkit-datetime-edit-minute-field, ::-webkit-datetime-edit-second-field, ::-webkit-datetime-edit-millisecond-field, ::-webkit-datetime-edit-meridiem-field {
    padding-block: 0;
  }
  ::-webkit-calendar-picker-indicator {
    line-height: 1;
  }
  :-moz-ui-invalid {
    box-shadow: none;
  }
  button, input:where([type="button"], [type="reset"], [type="submit"]), ::file-selector-button {
    appearance: button;
  }
  ::-webkit-inner-spin-button, ::-webkit-outer-spin-button {
    height: auto;
  }
  [hidden]:where(:not([hidden="until-found"])) {
    display: none !important;
  }
}
@layer utilities {
  .\@container {
    container-type: inline-size;
  }
  .pointer-events-auto {
    pointer-events: auto;
  }
  .pointer-events-none {
    pointer-events: none;
  }
  .\!visible {
    visibility: visible !important;
  }
  .collapse {
    visibility: collapse;
  }
  .invisible {
    visibility: hidden;
  }
  .visible {
    visibility: visible;
  }
  .sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip-path: inset(50%);
    white-space: nowrap;
    border-width: 0;
  }
  .not-sr-only {
    position: static;
    width: auto;
    height: auto;
    padding: 0;
    margin: 0;
    overflow: visible;
    clip-path: none;
    white-space: normal;
  }
  .absolute {
    position: absolute;
  }
  .fixed {
    position: fixed;
  }
  .relative {
    position: relative;
  }
  .static {
    position: static;
  }
  .sticky {
    position: sticky;
  }
  .inset-0 {
    inset: 0;
  }
  .inset-x-0 {
    inset-inline: 0;
  }
  .inset-y-0 {
    inset-block: 0;
  }
  .-top-0\.5 {
    top: calc(var(--spacing) * -0.5);
  }
  .-top-\[5px\] {
    top: calc(5px * -1);
  }
  .top-0 {
    top: 0;
  }
  .top-1 {
    top: var(--spacing);
  }
  .top-1\.5 {
    top: calc(var(--spacing) * 1.5);
  }
  .top-1\/2 {
    top: calc(1 / 2 * 100%);
  }
  .top-2 {
    top: calc(var(--spacing) * 2);
  }
  .top-3 {
    top: calc(var(--spacing) * 3);
  }
  .top-6 {
    top: calc(var(--spacing) * 6);
  }
  .top-7 {
    top: calc(var(--spacing) * 7);
  }
  .top-8 {
    top: calc(var(--spacing) * 8);
  }
  .top-14 {
    top: calc(var(--spacing) * 14);
  }
  .top-\[14vh\] {
    top: 14vh;
  }
  .top-full {
    top: 100%;
  }
  .-right-0\.5 {
    right: calc(var(--spacing) * -0.5);
  }
  .-right-\[6px\] {
    right: calc(6px * -1);
  }
  .-right-px {
    right: -1px;
  }
  .right-0 {
    right: 0;
  }
  .right-1 {
    right: var(--spacing);
  }
  .right-1\.5 {
    right: calc(var(--spacing) * 1.5);
  }
  .right-2 {
    right: calc(var(--spacing) * 2);
  }
  .right-3 {
    right: calc(var(--spacing) * 3);
  }
  .right-4 {
    right: calc(var(--spacing) * 4);
  }
  .right-6 {
    right: calc(var(--spacing) * 6);
  }
  .right-full {
    right: 100%;
  }
  .-bottom-px {
    bottom: -1px;
  }
  .bottom-0 {
    bottom: 0;
  }
  .bottom-2 {
    bottom: calc(var(--spacing) * 2);
  }
  .bottom-3 {
    bottom: calc(var(--spacing) * 3);
  }
  .bottom-4 {
    bottom: calc(var(--spacing) * 4);
  }
  .bottom-5 {
    bottom: calc(var(--spacing) * 5);
  }
  .bottom-full {
    bottom: 100%;
  }
  .left-0 {
    left: 0;
  }
  .left-0\.5 {
    left: calc(var(--spacing) * 0.5);
  }
  .left-1\/2 {
    left: calc(1 / 2 * 100%);
  }
  .left-2 {
    left: calc(var(--spacing) * 2);
  }
  .left-2\.5 {
    left: calc(var(--spacing) * 2.5);
  }
  .left-3 {
    left: calc(var(--spacing) * 3);
  }
  .left-4 {
    left: calc(var(--spacing) * 4);
  }
  .left-5 {
    left: calc(var(--spacing) * 5);
  }
  .left-\[11px\] {
    left: 11px;
  }
  .left-full {
    left: 100%;
  }
  .isolate {
    isolation: isolate;
  }
  .isolation-auto {
    isolation: auto;
  }
  .z-0 {
    z-index: 0;
  }
  .z-10 {
    z-index: 10;
  }
  .z-20 {
    z-index: 20;
  }
  .z-30 {
    z-index: 30;
  }
  .z-40 {
    z-index: 40;
  }
  .z-50 {
    z-index: 50;
  }
  .z-\[60\] {
    z-index: 60;
  }
  .container {
    width: 100%;
    @media (width >= 40rem) {
      max-width: 40rem;
    }
    @media (width >= 48rem) {
      max-width: 48rem;
    }
    @media (width >= 64rem) {
      max-width: 64rem;
    }
    @media (width >= 80rem) {
      max-width: 80rem;
    }
    @media (width >= 96rem) {
      max-width: 96rem;
    }
  }
  .m-1 {
    margin: var(--spacing);
  }
  .m-2 {
    margin: calc(var(--spacing) * 2);
  }
  .m-4 {
    margin: calc(var(--spacing) * 4);
  }
  .m-6 {
    margin: calc(var(--spacing) * 6);
  }
  .-mx-1 {
    margin-inline: calc(var(--spacing) * -1);
  }
  .mx-1 {
    margin-inline: var(--spacing);
  }
  .mx-3 {
    margin-inline: calc(var(--spacing) * 3);
  }
  .mx-4 {
    margin-inline: calc(var(--spacing) * 4);
  }
  .mx-6 {
    margin-inline: calc(var(--spacing) * 6);
  }
  .mx-\[14px\] {
    margin-inline: 14px;
  }
  .mx-auto {
    margin-inline: auto;
  }
  .my-1 {
    margin-block: var(--spacing);
  }
  .-mt-1 {
    margin-top: calc(var(--spacing) * -1);
  }
  .-mt-2 {
    margin-top: calc(var(--spacing) * -2);
  }
  .mt-0\.5 {
    margin-top: calc(var(--spacing) * 0.5);
  }
  .mt-1 {
    margin-top: var(--spacing);
  }
  .mt-1\.5 {
    margin-top: calc(var(--spacing) * 1.5);
  }
  .mt-2 {
    margin-top: calc(var(--spacing) * 2);
  }
  .mt-2\.5 {
    margin-top: calc(var(--spacing) * 2.5);
  }
  .mt-3 {
    margin-top: calc(var(--spacing) * 3);
  }
  .mt-4 {
    margin-top: calc(var(--spacing) * 4);
  }
  .mt-5 {
    margin-top: calc(var(--spacing) * 5);
  }
  .mt-6 {
    margin-top: calc(var(--spacing) * 6);
  }
  .mt-\[10px\] {
    margin-top: 10px;
  }
  .mt-auto {
    margin-top: auto;
  }
  .mt-px {
    margin-top: 1px;
  }
  .-mr-1 {
    margin-right: calc(var(--spacing) * -1);
  }
  .mr-1 {
    margin-right: var(--spacing);
  }
  .-mb-px {
    margin-bottom: -1px;
  }
  .mb-0\.5 {
    margin-bottom: calc(var(--spacing) * 0.5);
  }
  .mb-1 {
    margin-bottom: var(--spacing);
  }
  .mb-1\.5 {
    margin-bottom: calc(var(--spacing) * 1.5);
  }
  .mb-2 {
    margin-bottom: calc(var(--spacing) * 2);
  }
  .mb-2\.5 {
    margin-bottom: calc(var(--spacing) * 2.5);
  }
  .mb-3 {
    margin-bottom: calc(var(--spacing) * 3);
  }
  .mb-4 {
    margin-bottom: calc(var(--spacing) * 4);
  }
  .mb-5 {
    margin-bottom: calc(var(--spacing) * 5);
  }
  .mb-6 {
    margin-bottom: calc(var(--spacing) * 6);
  }
  .ml-0\.5 {
    margin-left: calc(var(--spacing) * 0.5);
  }
  .ml-1 {
    margin-left: var(--spacing);
  }
  .ml-1\.5 {
    margin-left: calc(var(--spacing) * 1.5);
  }
  .ml-2 {
    margin-left: calc(var(--spacing) * 2);
  }
  .ml-3 {
    margin-left: calc(var(--spacing) * 3);
  }
  .ml-\[46px\] {
    margin-left: 46px;
  }
  .ml-auto {
    margin-left: auto;
  }
  .box-border {
    box-sizing: border-box;
  }
  .box-content {
    box-sizing: content-box;
  }
  .line-clamp-1 {
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
  }
  .line-clamp-2 {
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
  }
  .\!hidden {
    display: none !important;
  }
  .block {
    display: block;
  }
  .contents {
    display: contents;
  }
  .flex {
    display: flex;
  }
  .flow-root {
    display: flow-root;
  }
  .grid {
    display: grid;
  }
  .hidden {
    display: none;
  }
  .inline {
    display: inline;
  }
  .inline-block {
    display: inline-block;
  }
  .inline-flex {
    display: inline-flex;
  }
  .inline-grid {
    display: inline-grid;
  }
  .inline-table {
    display: inline-table;
  }
  .list-item {
    display: list-item;
  }
  .table {
    display: table;
  }
  .table-cell {
    display: table-cell;
  }
  .table-row {
    display: table-row;
  }
  .aspect-square {
    aspect-ratio: 1 / 1;
  }
  .size-4 {
    width: calc(var(--spacing) * 4);
    height: calc(var(--spacing) * 4);
  }
  .size-5 {
    width: calc(var(--spacing) * 5);
    height: calc(var(--spacing) * 5);
  }
  .size-6 {
    width: calc(var(--spacing) * 6);
    height: calc(var(--spacing) * 6);
  }
  .size-7 {
    width: calc(var(--spacing) * 7);
    height: calc(var(--spacing) * 7);
  }
  .size-12 {
    width: calc(var(--spacing) * 12);
    height: calc(var(--spacing) * 12);
  }
  .size-\[22px\] {
    width: 22px;
    height: 22px;
  }
  .size-\[30px\] {
    width: 30px;
    height: 30px;
  }
  .\!h-8 {
    height: calc(var(--spacing) * 8) !important;
  }
  .h-1\.5 {
    height: calc(var(--spacing) * 1.5);
  }
  .h-2 {
    height: calc(var(--spacing) * 2);
  }
  .h-2\.5 {
    height: calc(var(--spacing) * 2.5);
  }
  .h-3 {
    height: calc(var(--spacing) * 3);
  }
  .h-3\.5 {
    height: calc(var(--spacing) * 3.5);
  }
  .h-4 {
    height: calc(var(--spacing) * 4);
  }
  .h-5 {
    height: calc(var(--spacing) * 5);
  }
  .h-6 {
    height: calc(var(--spacing) * 6);
  }
  .h-7 {
    height: calc(var(--spacing) * 7);
  }
  .h-8 {
    height: calc(var(--spacing) * 8);
  }
  .h-9 {
    height: calc(var(--spacing) * 9);
  }
  .h-10 {
    height: calc(var(--spacing) * 10);
  }
  .h-11 {
    height: calc(var(--spacing) * 11);
  }
  .h-12 {
    height: calc(var(--spacing) * 12);
  }
  .h-14 {
    height: calc(var(--spacing) * 14);
  }
  .h-16 {
    height: calc(var(--spacing) * 16);
  }
  .h-20 {
    height: calc(var(--spacing) * 20);
  }
  .h-28 {
    height: calc(var(--spacing) * 28);
  }
  .h-80 {
    height: calc(var(--spacing) * 80);
  }
  .h-\[14px\] {
    height: 14px;
  }
  .h-\[15px\] {
    height: 15px;
  }
  .h-\[18px\] {
    height: 18px;
  }
  .h-\[22px\] {
    height: 22px;
  }
  .h-\[26px\] {
    height: 26px;
  }
  .h-\[30px\] {
    height: 30px;
  }
  .h-\[33px\] {
    height: 33px;
  }
  .h-\[34px\] {
    height: 34px;
  }
  .h-\[38px\] {
    height: 38px;
  }
  .h-\[39px\] {
    height: 39px;
  }
  .h-\[44px\] {
    height: 44px;
  }
  .h-\[46px\] {
    height: 46px;
  }
  .h-\[48px\] {
    height: 48px;
  }
  .h-\[52px\] {
    height: 52px;
  }
  .h-\[56px\] {
    height: 56px;
  }
  .h-\[86px\] {
    height: 86px;
  }
  .h-\[88px\] {
    height: 88px;
  }
  .h-\[130px\] {
    height: 130px;
  }
  .h-\[150px\] {
    height: 150px;
  }
  .h-\[calc\(100vh-7rem\)\] {
    height: calc(100vh - 7rem);
  }
  .h-full {
    height: 100%;
  }
  .h-px {
    height: 1px;
  }
  .h-screen {
    height: 100vh;
  }
  .max-h-24 {
    max-height: calc(var(--spacing) * 24);
  }
  .max-h-28 {
    max-height: calc(var(--spacing) * 28);
  }
  .max-h-32 {
    max-height: calc(var(--spacing) * 32);
  }
  .max-h-40 {
    max-height: calc(var(--spacing) * 40);
  }
  .max-h-48 {
    max-height: calc(var(--spacing) * 48);
  }
  .max-h-56 {
    max-height: calc(var(--spacing) * 56);
  }
  .max-h-64 {
    max-height: calc(var(--spacing) * 64);
  }
  .max-h-72 {
    max-height: calc(var(--spacing) * 72);
  }
  .max-h-80 {
    max-height: calc(var(--spacing) * 80);
  }
  .max-h-\[50vh\] {
    max-height: 50vh;
  }
  .max-h-\[60vh\] {
    max-height: 60vh;
  }
  .max-h-\[70vh\] {
    max-height: 70vh;
  }
  .max-h-\[78vh\] {
    max-height: 78vh;
  }
  .max-h-\[80vh\] {
    max-height: 80vh;
  }
  .max-h-\[82vh\] {
    max-height: 82vh;
  }
  .max-h-\[90vh\] {
    max-height: 90vh;
  }
  .max-h-\[200px\] {
    max-height: 200px;
  }
  .max-h-\[220px\] {
    max-height: 220px;
  }
  .max-h-\[240px\] {
    max-height: 240px;
  }
  .max-h-\[320px\] {
    max-height: 320px;
  }
  .max-h-\[calc\(100\%-1\.5rem\)\] {
    max-height: calc(100% - 1.5rem);
  }
  .max-h-\[calc\(100dvh-24px\)\] {
    max-height: calc(100dvh - 24px);
  }
  .max-h-\[calc\(100vh-7rem\)\] {
    max-height: calc(100vh - 7rem);
  }
  .max-h-full {
    max-height: 100%;
  }
  .min-h-0 {
    min-height: 0;
  }
  .min-h-8 {
    min-height: calc(var(--spacing) * 8);
  }
  .min-h-9 {
    min-height: calc(var(--spacing) * 9);
  }
  .min-h-11 {
    min-height: calc(var(--spacing) * 11);
  }
  .min-h-24 {
    min-height: calc(var(--spacing) * 24);
  }
  .min-h-36 {
    min-height: calc(var(--spacing) * 36);
  }
  .min-h-\[2\.4em\] {
    min-height: 2.4em;
  }
  .min-h-\[36px\] {
    min-height: 36px;
  }
  .min-h-\[60vh\] {
    min-height: 60vh;
  }
  .min-h-\[100px\] {
    min-height: 100px;
  }
  .min-h-\[180px\] {
    min-height: 180px;
  }
  .min-h-\[260px\] {
    min-height: 260px;
  }
  .min-h-\[440px\] {
    min-height: 440px;
  }
  .min-h-\[calc\(100vh-6rem\)\] {
    min-height: calc(100vh - 6rem);
  }
  .min-h-full {
    min-height: 100%;
  }
  .min-h-screen {
    min-height: 100vh;
  }
  .w-1 {
    width: var(--spacing);
  }
  .w-1\.5 {
    width: calc(var(--spacing) * 1.5);
  }
  .w-1\/3 {
    width: calc(1 / 3 * 100%);
  }
  .w-2 {
    width: calc(var(--spacing) * 2);
  }
  .w-2\.5 {
    width: calc(var(--spacing) * 2.5);
  }
  .w-3 {
    width: calc(var(--spacing) * 3);
  }
  .w-3\.5 {
    width: calc(var(--spacing) * 3.5);
  }
  .w-4 {
    width: calc(var(--spacing) * 4);
  }
  .w-5 {
    width: calc(var(--spacing) * 5);
  }
  .w-6 {
    width: calc(var(--spacing) * 6);
  }
  .w-7 {
    width: calc(var(--spacing) * 7);
  }
  .w-8 {
    width: calc(var(--spacing) * 8);
  }
  .w-9 {
    width: calc(var(--spacing) * 9);
  }
  .w-10 {
    width: calc(var(--spacing) * 10);
  }
  .w-11 {
    width: calc(var(--spacing) * 11);
  }
  .w-12 {
    width: calc(var(--spacing) * 12);
  }
  .w-14 {
    width: calc(var(--spacing) * 14);
  }
  .w-16 {
    width: calc(var(--spacing) * 16);
  }
  .w-20 {
    width: calc(var(--spacing) * 20);
  }
  .w-24 {
    width: calc(var(--spacing) * 24);
  }
  .w-28 {
    width: calc(var(--spacing) * 28);
  }
  .w-32 {
    width: calc(var(--spacing) * 32);
  }
  .w-36 {
    width: calc(var(--spacing) * 36);
  }
  .w-40 {
    width: calc(var(--spacing) * 40);
  }
  .w-48 {
    width: calc(var(--spacing) * 48);
  }
  .w-52 {
    width: calc(var(--spacing) * 52);
  }
  .w-56 {
    width: calc(var(--spacing) * 56);
  }
  .w-60 {
    width: calc(var(--spacing) * 60);
  }
  .w-64 {
    width: calc(var(--spacing) * 64);
  }
  .w-72 {
    width: calc(var(--spacing) * 72);
  }
  .w-80 {
    width: calc(var(--spacing) * 80);
  }
  .w-\[11px\] {
    width: 11px;
  }
  .w-\[14px\] {
    width: 14px;
  }
  .w-\[15px\] {
    width: 15px;
  }
  .w-\[18px\] {
    width: 18px;
  }
  .w-\[26px\] {
    width: 26px;
  }
  .w-\[28px\] {
    width: 28px;
  }
  .w-\[30px\] {
    width: 30px;
  }
  .w-\[34px\] {
    width: 34px;
  }
  .w-\[88px\] {
    width: 88px;
  }
  .w-\[106px\] {
    width: 106px;
  }
  .w-\[120px\] {
    width: 120px;
  }
  .w-\[130px\] {
    width: 130px;
  }
  .w-\[170px\] {
    width: 170px;
  }
  .w-\[180px\] {
    width: 180px;
  }
  .w-\[186px\] {
    width: 186px;
  }
  .w-\[200px\] {
    width: 200px;
  }
  .w-\[220px\] {
    width: 220px;
  }
  .w-\[230px\] {
    width: 230px;
  }
  .w-\[240px\] {
    width: 240px;
  }
  .w-\[244px\] {
    width: 244px;
  }
  .w-\[248px\] {
    width: 248px;
  }
  .w-\[250px\] {
    width: 250px;
  }
  .w-\[260px\] {
    width: 260px;
  }
  .w-\[280px\] {
    width: 280px;
  }
  .w-\[340px\] {
    width: 340px;
  }
  .w-\[360px\] {
    width: 360px;
  }
  .w-\[400px\] {
    width: 400px;
  }
  .w-\[420px\] {
    width: 420px;
  }
  .w-\[440px\] {
    width: 440px;
  }
  .w-\[500px\] {
    width: 500px;
  }
  .w-\[520px\] {
    width: 520px;
  }
  .w-\[560px\] {
    width: 560px;
  }
  .w-\[640px\] {
    width: 640px;
  }
  .w-\[680px\] {
    width: 680px;
  }
  .w-\[760px\] {
    width: 760px;
  }
  .w-\[900px\] {
    width: 900px;
  }
  .w-\[min\(470px\,34vw\)\] {
    width: min(470px, 34vw);
  }
  .w-\[min\(640px\,calc\(100vw-32px\)\)\] {
    width: min(640px, calc(100vw - 32px));
  }
  .w-\[min\(1100px\,92vw\)\] {
    width: min(1100px, 92vw);
  }
  .w-auto {
    width: auto;
  }
  .w-fit {
    width: fit-content;
  }
  .w-full {
    width: 100%;
  }
  .w-px {
    width: 1px;
  }
  .max-w-2xl {
    max-width: var(--container-2xl);
  }
  .max-w-3xl {
    max-width: var(--container-3xl);
  }
  .max-w-4xl {
    max-width: var(--container-4xl);
  }
  .max-w-40 {
    max-width: calc(var(--spacing) * 40);
  }
  .max-w-52 {
    max-width: calc(var(--spacing) * 52);
  }
  .max-w-\[8rem\] {
    max-width: 8rem;
  }
  .max-w-\[10rem\] {
    max-width: 10rem;
  }
  .max-w-\[12rem\] {
    max-width: 12rem;
  }
  .max-w-\[13rem\] {
    max-width: 13rem;
  }
  .max-w-\[14rem\] {
    max-width: 14rem;
  }
  .max-w-\[18rem\] {
    max-width: 18rem;
  }
  .max-w-\[24rem\] {
    max-width: 24rem;
  }
  .max-w-\[28rem\] {
    max-width: 28rem;
  }
  .max-w-\[50\%\] {
    max-width: 50%;
  }
  .max-w-\[85\%\] {
    max-width: 85%;
  }
  .max-w-\[90vw\] {
    max-width: 90vw;
  }
  .max-w-\[92vw\] {
    max-width: 92vw;
  }
  .max-w-\[120px\] {
    max-width: 120px;
  }
  .max-w-\[140px\] {
    max-width: 140px;
  }
  .max-w-\[150px\] {
    max-width: 150px;
  }
  .max-w-\[200px\] {
    max-width: 200px;
  }
  .max-w-\[220px\] {
    max-width: 220px;
  }
  .max-w-\[260px\] {
    max-width: 260px;
  }
  .max-w-\[280px\] {
    max-width: 280px;
  }
  .max-w-\[360px\] {
    max-width: 360px;
  }
  .max-w-\[400px\] {
    max-width: 400px;
  }
  .max-w-\[420px\] {
    max-width: 420px;
  }
  .max-w-\[480px\] {
    max-width: 480px;
  }
  .max-w-\[640px\] {
    max-width: 640px;
  }
  .max-w-\[660px\] {
    max-width: 660px;
  }
  .max-w-\[760px\] {
    max-width: 760px;
  }
  .max-w-\[1100px\] {
    max-width: 1100px;
  }
  .max-w-\[calc\(100vw-2rem\)\] {
    max-width: calc(100vw - 2rem);
  }
  .max-w-\[calc\(100vw-32px\)\] {
    max-width: calc(100vw - 32px);
  }
  .max-w-\[min\(560px\,72\%\)\] {
    max-width: min(560px, 72%);
  }
  .max-w-full {
    max-width: 100%;
  }
  .max-w-md {
    max-width: var(--container-md);
  }
  .max-w-sm {
    max-width: var(--container-sm);
  }
  .max-w-xl {
    max-width: var(--container-xl);
  }
  .max-w-xs {
    max-width: var(--container-xs);
  }
  .min-w-0 {
    min-width: 0;
  }
  .min-w-7 {
    min-width: calc(var(--spacing) * 7);
  }
  .min-w-40 {
    min-width: calc(var(--spacing) * 40);
  }
  .min-w-\[1\.4rem\] {
    min-width: 1.4rem;
  }
  .min-w-\[8rem\] {
    min-width: 8rem;
  }
  .min-w-\[12rem\] {
    min-width: 12rem;
  }
  .min-w-\[14px\] {
    min-width: 14px;
  }
  .min-w-\[14rem\] {
    min-width: 14rem;
  }
  .min-w-\[20px\] {
    min-width: 20px;
  }
  .min-w-\[120px\] {
    min-width: 120px;
  }
  .min-w-\[190px\] {
    min-width: 190px;
  }
  .min-w-\[200px\] {
    min-width: 200px;
  }
  .min-w-\[210px\] {
    min-width: 210px;
  }
  .min-w-\[260px\] {
    min-width: 260px;
  }
  .min-w-\[320px\] {
    min-width: 320px;
  }
  .min-w-\[340px\] {
    min-width: 340px;
  }
  .flex-1 {
    flex: 1;
  }
  .flex-none {
    flex: none;
  }
  .shrink {
    flex-shrink: 1;
  }
  .shrink-0 {
    flex-shrink: 0;
  }
  .flex-grow {
    flex-grow: 1;
  }
  .grow {
    flex-grow: 1;
  }
  .border-collapse {
    border-collapse: collapse;
  }
  .border-separate {
    border-collapse: separate;
  }
  .-translate-x-1\/2 {
    --tw-translate-x: calc(calc(1 / 2 * 100%) * -1);
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }
  .-translate-x-full {
    --tw-translate-x: -100%;
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }
  .translate-x-0 {
    --tw-translate-x: 0;
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }
  .translate-x-0\.5 {
    --tw-translate-x: calc(var(--spacing) * 0.5);
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }
  .translate-x-4 {
    --tw-translate-x: calc(var(--spacing) * 4);
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }
  .translate-x-\[2px\] {
    --tw-translate-x: 2px;
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }
  .translate-x-\[14px\] {
    --tw-translate-x: 14px;
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }
  .translate-x-\[15px\] {
    --tw-translate-x: 15px;
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }
  .-translate-y-1\/2 {
    --tw-translate-y: calc(calc(1 / 2 * 100%) * -1);
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }
  .transform {
    transform: var(--tw-rotate-x,) var(--tw-rotate-y,) var(--tw-rotate-z,) var(--tw-skew-x,) var(--tw-skew-y,);
  }
  .animate-pulse {
    animation: var(--animate-pulse);
  }
  .animate-spin {
    animation: var(--animate-spin);
  }
  .cursor-col-resize {
    cursor: col-resize;
  }
  .cursor-default {
    cursor: default;
  }
  .cursor-grab {
    cursor: grab;
  }
  .cursor-not-allowed {
    cursor: not-allowed;
  }
  .cursor-pointer {
    cursor: pointer;
  }
  .resize {
    resize: both;
  }
  .resize-none {
    resize: none;
  }
  .resize-x {
    resize: horizontal;
  }
  .resize-y {
    resize: vertical;
  }
  .list-decimal {
    list-style-type: decimal;
  }
  .list-disc {
    list-style-type: disc;
  }
  .list-none {
    list-style-type: none;
  }
  .appearance-none {
    appearance: none;
  }
  .\[grid-auto-rows\:88px\] {
    grid-auto-rows: 88px;
  }
  .\[grid-template-columns\:repeat\(12\,minmax\(0\,1fr\)\)\] {
    grid-template-columns: repeat(12,minmax(0,1fr));
  }
  .grid-cols-1 {
    grid-template-columns: repeat(1, minmax(0, 1fr));
  }
  .grid-cols-2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .grid-cols-3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .grid-cols-4 {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
  .grid-cols-7 {
    grid-template-columns: repeat(7, minmax(0, 1fr));
  }
  .grid-cols-12 {
    grid-template-columns: repeat(12, minmax(0, 1fr));
  }
  .grid-cols-\[1fr_1fr\] {
    grid-template-columns: 1fr 1fr;
  }
  .grid-cols-\[1fr_1fr_auto\] {
    grid-template-columns: 1fr 1fr auto;
  }
  .grid-cols-\[1fr_4rem_9rem\] {
    grid-template-columns: 1fr 4rem 9rem;
  }
  .grid-cols-\[1fr_9rem_auto\] {
    grid-template-columns: 1fr 9rem auto;
  }
  .grid-cols-\[1fr_auto\] {
    grid-template-columns: 1fr auto;
  }
  .grid-cols-\[1fr_auto_auto\] {
    grid-template-columns: 1fr auto auto;
  }
  .grid-cols-\[1fr_auto_auto_auto\] {
    grid-template-columns: 1fr auto auto auto;
  }
  .grid-cols-\[1fr_auto_auto_auto_auto\] {
    grid-template-columns: 1fr auto auto auto auto;
  }
  .grid-cols-\[16rem_1fr\] {
    grid-template-columns: 16rem 1fr;
  }
  .grid-cols-\[112px_minmax\(0\,1fr\)\] {
    grid-template-columns: 112px minmax(0,1fr);
  }
  .grid-cols-\[128px_minmax\(0\,1fr\)\] {
    grid-template-columns: 128px minmax(0,1fr);
  }
  .grid-cols-\[332px_1fr_auto\] {
    grid-template-columns: 332px 1fr auto;
  }
  .grid-cols-\[auto_1fr\] {
    grid-template-columns: auto 1fr;
  }
  .grid-cols-\[auto_1fr_auto_auto\] {
    grid-template-columns: auto 1fr auto auto;
  }
  .grid-cols-\[minmax\(0\,1fr\)_148px_148px_36px\] {
    grid-template-columns: minmax(0,1fr) 148px 148px 36px;
  }
  .grid-cols-\[minmax\(180px\,1fr\)_140px_80px_100px_36px\] {
    grid-template-columns: minmax(180px,1fr) 140px 80px 100px 36px;
  }
  .grid-cols-\[repeat\(auto-fill\,minmax\(11rem\,1fr\)\)\] {
    grid-template-columns: repeat(auto-fill,minmax(11rem,1fr));
  }
  .grid-rows-1 {
    grid-template-rows: repeat(1, minmax(0, 1fr));
  }
  .grid-rows-6 {
    grid-template-rows: repeat(6, minmax(0, 1fr));
  }
  .grid-rows-\[auto_1fr\] {
    grid-template-rows: auto 1fr;
  }
  .flex-col {
    flex-direction: column;
  }
  .flex-row {
    flex-direction: row;
  }
  .flex-wrap {
    flex-wrap: wrap;
  }
  .content-start {
    align-content: flex-start;
  }
  .items-baseline {
    align-items: baseline;
  }
  .items-center {
    align-items: center;
  }
  .items-end {
    align-items: flex-end;
  }
  .items-start {
    align-items: flex-start;
  }
  .items-stretch {
    align-items: stretch;
  }
  .justify-between {
    justify-content: space-between;
  }
  .justify-center {
    justify-content: center;
  }
  .justify-end {
    justify-content: flex-end;
  }
  .justify-start {
    justify-content: flex-start;
  }
  .justify-items-center {
    justify-items: center;
  }
  .gap-0 {
    gap: 0;
  }
  .gap-0\.5 {
    gap: calc(var(--spacing) * 0.5);
  }
  .gap-1 {
    gap: var(--spacing);
  }
  .gap-1\.5 {
    gap: calc(var(--spacing) * 1.5);
  }
  .gap-2 {
    gap: calc(var(--spacing) * 2);
  }
  .gap-2\.5 {
    gap: calc(var(--spacing) * 2.5);
  }
  .gap-3 {
    gap: calc(var(--spacing) * 3);
  }
  .gap-3\.5 {
    gap: calc(var(--spacing) * 3.5);
  }
  .gap-4 {
    gap: calc(var(--spacing) * 4);
  }
  .gap-5 {
    gap: calc(var(--spacing) * 5);
  }
  .gap-6 {
    gap: calc(var(--spacing) * 6);
  }
  .gap-8 {
    gap: calc(var(--spacing) * 8);
  }
  .gap-\[3px\] {
    gap: 3px;
  }
  .gap-\[7px\] {
    gap: 7px;
  }
  .gap-\[10px\] {
    gap: 10px;
  }
  .gap-px {
    gap: 1px;
  }
  .space-y-0\.5 {
    :where(& > :not(:last-child)) {
      --tw-space-y-reverse: 0;
      margin-block-start: calc(calc(var(--spacing) * 0.5) * var(--tw-space-y-reverse));
      margin-block-end: calc(calc(var(--spacing) * 0.5) * calc(1 - var(--tw-space-y-reverse)));
    }
  }
  .space-y-1 {
    :where(& > :not(:last-child)) {
      --tw-space-y-reverse: 0;
      margin-block-start: calc(var(--spacing) * var(--tw-space-y-reverse));
      margin-block-end: calc(var(--spacing) * calc(1 - var(--tw-space-y-reverse)));
    }
  }
  .space-y-1\.5 {
    :where(& > :not(:last-child)) {
      --tw-space-y-reverse: 0;
      margin-block-start: calc(calc(var(--spacing) * 1.5) * var(--tw-space-y-reverse));
      margin-block-end: calc(calc(var(--spacing) * 1.5) * calc(1 - var(--tw-space-y-reverse)));
    }
  }
  .space-y-2 {
    :where(& > :not(:last-child)) {
      --tw-space-y-reverse: 0;
      margin-block-start: calc(calc(var(--spacing) * 2) * var(--tw-space-y-reverse));
      margin-block-end: calc(calc(var(--spacing) * 2) * calc(1 - var(--tw-space-y-reverse)));
    }
  }
  .space-y-3 {
    :where(& > :not(:last-child)) {
      --tw-space-y-reverse: 0;
      margin-block-start: calc(calc(var(--spacing) * 3) * var(--tw-space-y-reverse));
      margin-block-end: calc(calc(var(--spacing) * 3) * calc(1 - var(--tw-space-y-reverse)));
    }
  }
  .space-y-4 {
    :where(& > :not(:last-child)) {
      --tw-space-y-reverse: 0;
      margin-block-start: calc(calc(var(--spacing) * 4) * var(--tw-space-y-reverse));
      margin-block-end: calc(calc(var(--spacing) * 4) * calc(1 - var(--tw-space-y-reverse)));
    }
  }
  .space-y-5 {
    :where(& > :not(:last-child)) {
      --tw-space-y-reverse: 0;
      margin-block-start: calc(calc(var(--spacing) * 5) * var(--tw-space-y-reverse));
      margin-block-end: calc(calc(var(--spacing) * 5) * calc(1 - var(--tw-space-y-reverse)));
    }
  }
  .space-y-6 {
    :where(& > :not(:last-child)) {
      --tw-space-y-reverse: 0;
      margin-block-start: calc(calc(var(--spacing) * 6) * var(--tw-space-y-reverse));
      margin-block-end: calc(calc(var(--spacing) * 6) * calc(1 - var(--tw-space-y-reverse)));
    }
  }
  .space-y-8 {
    :where(& > :not(:last-child)) {
      --tw-space-y-reverse: 0;
      margin-block-start: calc(calc(var(--spacing) * 8) * var(--tw-space-y-reverse));
      margin-block-end: calc(calc(var(--spacing) * 8) * calc(1 - var(--tw-space-y-reverse)));
    }
  }
  .gap-x-1\.5 {
    column-gap: calc(var(--spacing) * 1.5);
  }
  .gap-x-2 {
    column-gap: calc(var(--spacing) * 2);
  }
  .gap-x-3 {
    column-gap: calc(var(--spacing) * 3);
  }
  .gap-x-6 {
    column-gap: calc(var(--spacing) * 6);
  }
  .gap-x-8 {
    column-gap: calc(var(--spacing) * 8);
  }
  .gap-x-18 {
    column-gap: calc(var(--spacing) * 18);
  }
  .gap-y-0\.5 {
    row-gap: calc(var(--spacing) * 0.5);
  }
  .gap-y-1 {
    row-gap: var(--spacing);
  }
  .gap-y-2 {
    row-gap: calc(var(--spacing) * 2);
  }
  .gap-y-3 {
    row-gap: calc(var(--spacing) * 3);
  }
  .gap-y-12 {
    row-gap: calc(var(--spacing) * 12);
  }
  .divide-y {
    :where(& > :not(:last-child)) {
      --tw-divide-y-reverse: 0;
      border-bottom-style: var(--tw-border-style);
      border-top-style: var(--tw-border-style);
      border-top-width: calc(1px * var(--tw-divide-y-reverse));
      border-bottom-width: calc(1px * calc(1 - var(--tw-divide-y-reverse)));
    }
  }
  .divide-gray-3 {
    :where(& > :not(:last-child)) {
      border-color: var(--color-gray-3);
    }
  }
  .divide-gray-4 {
    :where(& > :not(:last-child)) {
      border-color: var(--color-gray-4);
    }
  }
  .divide-gray-5 {
    :where(& > :not(:last-child)) {
      border-color: var(--color-gray-5);
    }
  }
  .self-center {
    align-self: center;
  }
  .self-end {
    align-self: flex-end;
  }
  .self-start {
    align-self: flex-start;
  }
  .truncate {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .overflow-auto {
    overflow: auto;
  }
  .overflow-hidden {
    overflow: hidden;
  }
  .overflow-visible {
    overflow: visible;
  }
  .overflow-x-auto {
    overflow-x: auto;
  }
  .overflow-x-hidden {
    overflow-x: hidden;
  }
  .overflow-y-auto {
    overflow-y: auto;
  }
  .rounded {
    border-radius: 0.25rem;
  }
  .rounded-\[2px\] {
    border-radius: 2px;
  }
  .rounded-\[3px\] {
    border-radius: 3px;
  }
  .rounded-\[4px\] {
    border-radius: 4px;
  }
  .rounded-\[8px\] {
    border-radius: 8px;
  }
  .rounded-full {
    border-radius: calc(infinity * 1px);
  }
  .rounded-lg {
    border-radius: var(--radius-lg);
  }
  .rounded-md {
    border-radius: var(--radius-md);
  }
  .rounded-pill {
    border-radius: var(--radius-pill);
  }
  .rounded-sm {
    border-radius: var(--radius-sm);
  }
  .rounded-ss {
    border-start-start-radius: 0.25rem;
  }
  .rounded-se {
    border-start-end-radius: 0.25rem;
  }
  .rounded-ee {
    border-end-end-radius: 0.25rem;
  }
  .rounded-es {
    border-end-start-radius: 0.25rem;
  }
  .rounded-t {
    border-top-left-radius: 0.25rem;
    border-top-right-radius: 0.25rem;
  }
  .rounded-t-md {
    border-top-left-radius: var(--radius-md);
    border-top-right-radius: var(--radius-md);
  }
  .rounded-t-none {
    border-top-left-radius: 0;
    border-top-right-radius: 0;
  }
  .rounded-l {
    border-top-left-radius: 0.25rem;
    border-bottom-left-radius: 0.25rem;
  }
  .rounded-l-md {
    border-top-left-radius: var(--radius-md);
    border-bottom-left-radius: var(--radius-md);
  }
  .rounded-l-none {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
  }
  .rounded-l-sm {
    border-top-left-radius: var(--radius-sm);
    border-bottom-left-radius: var(--radius-sm);
  }
  .rounded-tl {
    border-top-left-radius: 0.25rem;
  }
  .rounded-tl-md {
    border-top-left-radius: var(--radius-md);
  }
  .rounded-r {
    border-top-right-radius: 0.25rem;
    border-bottom-right-radius: 0.25rem;
  }
  .rounded-r-md {
    border-top-right-radius: var(--radius-md);
    border-bottom-right-radius: var(--radius-md);
  }
  .rounded-r-none {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
  }
  .rounded-r-sm {
    border-top-right-radius: var(--radius-sm);
    border-bottom-right-radius: var(--radius-sm);
  }
  .rounded-tr {
    border-top-right-radius: 0.25rem;
  }
  .rounded-b {
    border-bottom-right-radius: 0.25rem;
    border-bottom-left-radius: 0.25rem;
  }
  .rounded-br {
    border-bottom-right-radius: 0.25rem;
  }
  .rounded-bl {
    border-bottom-left-radius: 0.25rem;
  }
  .border {
    border-style: var(--tw-border-style);
    border-width: 1px;
  }
  .border-0 {
    border-style: var(--tw-border-style);
    border-width: 0px;
  }
  .border-2 {
    border-style: var(--tw-border-style);
    border-width: 2px;
  }
  .border-t {
    border-top-style: var(--tw-border-style);
    border-top-width: 1px;
  }
  .border-t-2 {
    border-top-style: var(--tw-border-style);
    border-top-width: 2px;
  }
  .border-r {
    border-right-style: var(--tw-border-style);
    border-right-width: 1px;
  }
  .border-b {
    border-bottom-style: var(--tw-border-style);
    border-bottom-width: 1px;
  }
  .border-b-2 {
    border-bottom-style: var(--tw-border-style);
    border-bottom-width: 2px;
  }
  .border-l {
    border-left-style: var(--tw-border-style);
    border-left-width: 1px;
  }
  .border-l-0 {
    border-left-style: var(--tw-border-style);
    border-left-width: 0px;
  }
  .border-l-2 {
    border-left-style: var(--tw-border-style);
    border-left-width: 2px;
  }
  .border-dashed {
    --tw-border-style: dashed;
    border-style: dashed;
  }
  .border-\[var\(--tag-blue\)\] {
    border-color: var(--tag-blue);
  }
  .border-\[var\(--tag-orange\)\] {
    border-color: var(--tag-orange);
  }
  .border-\[var\(--tag-orange\)\]\/30 {
    border-color: var(--tag-orange);
    @supports (color: color-mix(in lab, red, red)) {
      border-color: color-mix(in oklab, var(--tag-orange) 30%, transparent);
    }
  }
  .border-\[var\(--tag-red\)\] {
    border-color: var(--tag-red);
  }
  .border-\[var\(--tag-red\)\]\/40 {
    border-color: var(--tag-red);
    @supports (color: color-mix(in lab, red, red)) {
      border-color: color-mix(in oklab, var(--tag-red) 40%, transparent);
    }
  }
  .border-\[var\(--tag-yellow\)\] {
    border-color: var(--tag-yellow);
  }
  .border-accent-5 {
    border-color: var(--color-accent-5);
  }
  .border-accent-6 {
    border-color: var(--color-accent-6);
  }
  .border-accent-6\/40 {
    border-color: color-mix(in srgb, #c1d0ff 40%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      border-color: color-mix(in oklab, var(--color-accent-6) 40%, transparent);
    }
  }
  .border-accent-6\/50 {
    border-color: color-mix(in srgb, #c1d0ff 50%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      border-color: color-mix(in oklab, var(--color-accent-6) 50%, transparent);
    }
  }
  .border-accent-7 {
    border-color: var(--color-accent-7);
  }
  .border-accent-8 {
    border-color: var(--color-accent-8);
  }
  .border-accent-9 {
    border-color: var(--color-accent-9);
  }
  .border-accent-10 {
    border-color: var(--color-accent-10);
  }
  .border-gray-3 {
    border-color: var(--color-gray-3);
  }
  .border-gray-4 {
    border-color: var(--color-gray-4);
  }
  .border-gray-5 {
    border-color: var(--color-gray-5);
  }
  .border-gray-6 {
    border-color: var(--color-gray-6);
  }
  .border-gray-7 {
    border-color: var(--color-gray-7);
  }
  .border-gray-12 {
    border-color: var(--color-gray-12);
  }
  .border-tag-green {
    border-color: var(--color-tag-green);
  }
  .border-tag-green\/40 {
    border-color: color-mix(in srgb, #30a46c 40%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      border-color: color-mix(in oklab, var(--color-tag-green) 40%, transparent);
    }
  }
  .border-tag-orange\/30 {
    border-color: color-mix(in srgb, #f76b15 30%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      border-color: color-mix(in oklab, var(--color-tag-orange) 30%, transparent);
    }
  }
  .border-tag-orange\/40 {
    border-color: color-mix(in srgb, #f76b15 40%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      border-color: color-mix(in oklab, var(--color-tag-orange) 40%, transparent);
    }
  }
  .border-tag-red {
    border-color: var(--color-tag-red);
  }
  .border-tag-red\/30 {
    border-color: color-mix(in srgb, #e5484d 30%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      border-color: color-mix(in oklab, var(--color-tag-red) 30%, transparent);
    }
  }
  .border-tag-red\/40 {
    border-color: color-mix(in srgb, #e5484d 40%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      border-color: color-mix(in oklab, var(--color-tag-red) 40%, transparent);
    }
  }
  .border-transparent {
    border-color: transparent;
  }
  .border-white\/30 {
    border-color: color-mix(in srgb, #fff 30%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      border-color: color-mix(in oklab, var(--color-white) 30%, transparent);
    }
  }
  .border-t-accent-9 {
    border-top-color: var(--color-accent-9);
  }
  .border-l-accent-9 {
    border-left-color: var(--color-accent-9);
  }
  .border-l-tag-green {
    border-left-color: var(--color-tag-green);
  }
  .border-l-tag-orange {
    border-left-color: var(--color-tag-orange);
  }
  .border-l-tag-red {
    border-left-color: var(--color-tag-red);
  }
  .border-l-transparent {
    border-left-color: transparent;
  }
  .bg-\[var\(--color-accent-9\)\] {
    background-color: var(--color-accent-9);
  }
  .bg-\[var\(--color-tag-red\)\]\/10 {
    background-color: color-mix(in srgb, #e5484d 10%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      background-color: color-mix(in oklab, var(--color-tag-red) 10%, transparent);
    }
  }
  .bg-\[var\(--color-tag-yellow\)\] {
    background-color: var(--color-tag-yellow);
  }
  .bg-\[var\(--tag-orange\)\]\/5 {
    background-color: var(--tag-orange);
    @supports (color: color-mix(in lab, red, red)) {
      background-color: color-mix(in oklab, var(--tag-orange) 5%, transparent);
    }
  }
  .bg-\[var\(--tag-red\)\]\/5 {
    background-color: var(--tag-red);
    @supports (color: color-mix(in lab, red, red)) {
      background-color: color-mix(in oklab, var(--tag-red) 5%, transparent);
    }
  }
  .bg-accent-2 {
    background-color: var(--color-accent-2);
  }
  .bg-accent-2\/40 {
    background-color: color-mix(in srgb, #f7f9ff 40%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      background-color: color-mix(in oklab, var(--color-accent-2) 40%, transparent);
    }
  }
  .bg-accent-3 {
    background-color: var(--color-accent-3);
  }
  .bg-accent-4 {
    background-color: var(--color-accent-4);
  }
  .bg-accent-9 {
    background-color: var(--color-accent-9);
  }
  .bg-accent-9\/60 {
    background-color: color-mix(in srgb, #3e63dd 60%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      background-color: color-mix(in oklab, var(--color-accent-9) 60%, transparent);
    }
  }
  .bg-amber-50 {
    background-color: var(--color-amber-50);
  }
  .bg-amber-100 {
    background-color: var(--color-amber-100);
  }
  .bg-black\/10 {
    background-color: color-mix(in srgb, #000 10%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      background-color: color-mix(in oklab, var(--color-black) 10%, transparent);
    }
  }
  .bg-black\/20 {
    background-color: color-mix(in srgb, #000 20%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      background-color: color-mix(in oklab, var(--color-black) 20%, transparent);
    }
  }
  .bg-black\/40 {
    background-color: color-mix(in srgb, #000 40%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      background-color: color-mix(in oklab, var(--color-black) 40%, transparent);
    }
  }
  .bg-black\/85 {
    background-color: color-mix(in srgb, #000 85%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      background-color: color-mix(in oklab, var(--color-black) 85%, transparent);
    }
  }
  .bg-gray-1 {
    background-color: var(--color-gray-1);
  }
  .bg-gray-1\/60 {
    background-color: color-mix(in srgb, #ffffff 60%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      background-color: color-mix(in oklab, var(--color-gray-1) 60%, transparent);
    }
  }
  .bg-gray-1\/90 {
    background-color: color-mix(in srgb, #ffffff 90%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      background-color: color-mix(in oklab, var(--color-gray-1) 90%, transparent);
    }
  }
  .bg-gray-1\/95 {
    background-color: color-mix(in srgb, #ffffff 95%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      background-color: color-mix(in oklab, var(--color-gray-1) 95%, transparent);
    }
  }
  .bg-gray-2 {
    background-color: var(--color-gray-2);
  }
  .bg-gray-2\/40 {
    background-color: color-mix(in srgb, #fcfcfc 40%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      background-color: color-mix(in oklab, var(--color-gray-2) 40%, transparent);
    }
  }
  .bg-gray-2\/60 {
    background-color: color-mix(in srgb, #fcfcfc 60%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      background-color: color-mix(in oklab, var(--color-gray-2) 60%, transparent);
    }
  }
  .bg-gray-3 {
    background-color: var(--color-gray-3);
  }
  .bg-gray-4 {
    background-color: var(--color-gray-4);
  }
  .bg-gray-5 {
    background-color: var(--color-gray-5);
  }
  .bg-gray-6 {
    background-color: var(--color-gray-6);
  }
  .bg-gray-8 {
    background-color: var(--color-gray-8);
  }
  .bg-gray-9 {
    background-color: var(--color-gray-9);
  }
  .bg-gray-12 {
    background-color: var(--color-gray-12);
  }
  .bg-green-50 {
    background-color: var(--color-green-50);
  }
  .bg-green-100 {
    background-color: var(--color-green-100);
  }
  .bg-red-50 {
    background-color: var(--color-red-50);
  }
  .bg-red-100 {
    background-color: var(--color-red-100);
  }
  .bg-tag-blue {
    background-color: var(--color-tag-blue);
  }
  .bg-tag-blue\/15 {
    background-color: color-mix(in srgb, #3e63dd 15%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      background-color: color-mix(in oklab, var(--color-tag-blue) 15%, transparent);
    }
  }
  .bg-tag-green {
    background-color: var(--color-tag-green);
  }
  .bg-tag-green\/10 {
    background-color: color-mix(in srgb, #30a46c 10%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      background-color: color-mix(in oklab, var(--color-tag-green) 10%, transparent);
    }
  }
  .bg-tag-green\/15 {
    background-color: color-mix(in srgb, #30a46c 15%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      background-color: color-mix(in oklab, var(--color-tag-green) 15%, transparent);
    }
  }
  .bg-tag-green\/20 {
    background-color: color-mix(in srgb, #30a46c 20%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      background-color: color-mix(in oklab, var(--color-tag-green) 20%, transparent);
    }
  }
  .bg-tag-orange {
    background-color: var(--color-tag-orange);
  }
  .bg-tag-orange\/5 {
    background-color: color-mix(in srgb, #f76b15 5%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      background-color: color-mix(in oklab, var(--color-tag-orange) 5%, transparent);
    }
  }
  .bg-tag-orange\/10 {
    background-color: color-mix(in srgb, #f76b15 10%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      background-color: color-mix(in oklab, var(--color-tag-orange) 10%, transparent);
    }
  }
  .bg-tag-orange\/15 {
    background-color: color-mix(in srgb, #f76b15 15%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      background-color: color-mix(in oklab, var(--color-tag-orange) 15%, transparent);
    }
  }
  .bg-tag-purple {
    background-color: var(--color-tag-purple);
  }
  .bg-tag-red {
    background-color: var(--color-tag-red);
  }
  .bg-tag-red\/5 {
    background-color: color-mix(in srgb, #e5484d 5%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      background-color: color-mix(in oklab, var(--color-tag-red) 5%, transparent);
    }
  }
  .bg-tag-red\/10 {
    background-color: color-mix(in srgb, #e5484d 10%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      background-color: color-mix(in oklab, var(--color-tag-red) 10%, transparent);
    }
  }
  .bg-tag-red\/15 {
    background-color: color-mix(in srgb, #e5484d 15%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      background-color: color-mix(in oklab, var(--color-tag-red) 15%, transparent);
    }
  }
  .bg-tag-red\/20 {
    background-color: color-mix(in srgb, #e5484d 20%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      background-color: color-mix(in oklab, var(--color-tag-red) 20%, transparent);
    }
  }
  .bg-tag-red\/\[0\.04\] {
    background-color: color-mix(in srgb, #e5484d 4%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      background-color: color-mix(in oklab, var(--color-tag-red) 4%, transparent);
    }
  }
  .bg-tag-sky {
    background-color: var(--color-tag-sky);
  }
  .bg-tag-turquoise {
    background-color: var(--color-tag-turquoise);
  }
  .bg-tag-turquoise\/15 {
    background-color: color-mix(in srgb, #12a594 15%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      background-color: color-mix(in oklab, var(--color-tag-turquoise) 15%, transparent);
    }
  }
  .bg-transparent {
    background-color: transparent;
  }
  .bg-white {
    background-color: var(--color-white);
  }
  .bg-white\/10 {
    background-color: color-mix(in srgb, #fff 10%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      background-color: color-mix(in oklab, var(--color-white) 10%, transparent);
    }
  }
  .bg-white\/20 {
    background-color: color-mix(in srgb, #fff 20%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      background-color: color-mix(in oklab, var(--color-white) 20%, transparent);
    }
  }
  .\[background-image\:radial-gradient\(var\(--color-gray-5\)_1px\,transparent_1px\)\] {
    background-image: radial-gradient(var(--color-gray-5) 1px,transparent 1px);
  }
  .\[background-size\:18px_18px\] {
    background-size: 18px 18px;
  }
  .object-contain {
    object-fit: contain;
  }
  .object-cover {
    object-fit: cover;
  }
  .object-top {
    object-position: top;
  }
  .p-0 {
    padding: 0;
  }
  .p-0\.5 {
    padding: calc(var(--spacing) * 0.5);
  }
  .p-1 {
    padding: var(--spacing);
  }
  .p-1\.5 {
    padding: calc(var(--spacing) * 1.5);
  }
  .p-2 {
    padding: calc(var(--spacing) * 2);
  }
  .p-2\.5 {
    padding: calc(var(--spacing) * 2.5);
  }
  .p-3 {
    padding: calc(var(--spacing) * 3);
  }
  .p-3\.5 {
    padding: calc(var(--spacing) * 3.5);
  }
  .p-4 {
    padding: calc(var(--spacing) * 4);
  }
  .p-5 {
    padding: calc(var(--spacing) * 5);
  }
  .p-6 {
    padding: calc(var(--spacing) * 6);
  }
  .p-8 {
    padding: calc(var(--spacing) * 8);
  }
  .p-10 {
    padding: calc(var(--spacing) * 10);
  }
  .p-\[3px\] {
    padding: 3px;
  }
  .px-0 {
    padding-inline: 0;
  }
  .px-0\.5 {
    padding-inline: calc(var(--spacing) * 0.5);
  }
  .px-1 {
    padding-inline: var(--spacing);
  }
  .px-1\.5 {
    padding-inline: calc(var(--spacing) * 1.5);
  }
  .px-2 {
    padding-inline: calc(var(--spacing) * 2);
  }
  .px-2\.5 {
    padding-inline: calc(var(--spacing) * 2.5);
  }
  .px-3 {
    padding-inline: calc(var(--spacing) * 3);
  }
  .px-3\.5 {
    padding-inline: calc(var(--spacing) * 3.5);
  }
  .px-4 {
    padding-inline: calc(var(--spacing) * 4);
  }
  .px-5 {
    padding-inline: calc(var(--spacing) * 5);
  }
  .px-6 {
    padding-inline: calc(var(--spacing) * 6);
  }
  .px-8 {
    padding-inline: calc(var(--spacing) * 8);
  }
  .px-18 {
    padding-inline: calc(var(--spacing) * 18);
  }
  .px-\[3px\] {
    padding-inline: 3px;
  }
  .px-\[7px\] {
    padding-inline: 7px;
  }
  .px-\[9px\] {
    padding-inline: 9px;
  }
  .px-\[14px\] {
    padding-inline: 14px;
  }
  .px-px {
    padding-inline: 1px;
  }
  .py-0\.5 {
    padding-block: calc(var(--spacing) * 0.5);
  }
  .py-1 {
    padding-block: var(--spacing);
  }
  .py-1\.5 {
    padding-block: calc(var(--spacing) * 1.5);
  }
  .py-2 {
    padding-block: calc(var(--spacing) * 2);
  }
  .py-2\.5 {
    padding-block: calc(var(--spacing) * 2.5);
  }
  .py-3 {
    padding-block: calc(var(--spacing) * 3);
  }
  .py-4 {
    padding-block: calc(var(--spacing) * 4);
  }
  .py-5 {
    padding-block: calc(var(--spacing) * 5);
  }
  .py-6 {
    padding-block: calc(var(--spacing) * 6);
  }
  .py-8 {
    padding-block: calc(var(--spacing) * 8);
  }
  .py-10 {
    padding-block: calc(var(--spacing) * 10);
  }
  .py-12 {
    padding-block: calc(var(--spacing) * 12);
  }
  .py-14 {
    padding-block: calc(var(--spacing) * 14);
  }
  .py-16 {
    padding-block: calc(var(--spacing) * 16);
  }
  .py-\[7px\] {
    padding-block: 7px;
  }
  .py-\[9px\] {
    padding-block: 9px;
  }
  .pt-0\.5 {
    padding-top: calc(var(--spacing) * 0.5);
  }
  .pt-1 {
    padding-top: var(--spacing);
  }
  .pt-1\.5 {
    padding-top: calc(var(--spacing) * 1.5);
  }
  .pt-2 {
    padding-top: calc(var(--spacing) * 2);
  }
  .pt-3 {
    padding-top: calc(var(--spacing) * 3);
  }
  .pt-3\.5 {
    padding-top: calc(var(--spacing) * 3.5);
  }
  .pt-4 {
    padding-top: calc(var(--spacing) * 4);
  }
  .pt-5 {
    padding-top: calc(var(--spacing) * 5);
  }
  .pt-6 {
    padding-top: calc(var(--spacing) * 6);
  }
  .pt-\[11px\] {
    padding-top: 11px;
  }
  .pr-0\.5 {
    padding-right: calc(var(--spacing) * 0.5);
  }
  .pr-1 {
    padding-right: var(--spacing);
  }
  .pr-1\.5 {
    padding-right: calc(var(--spacing) * 1.5);
  }
  .pr-2 {
    padding-right: calc(var(--spacing) * 2);
  }
  .pr-2\.5 {
    padding-right: calc(var(--spacing) * 2.5);
  }
  .pr-3 {
    padding-right: calc(var(--spacing) * 3);
  }
  .pr-4 {
    padding-right: calc(var(--spacing) * 4);
  }
  .pr-7 {
    padding-right: calc(var(--spacing) * 7);
  }
  .pr-8 {
    padding-right: calc(var(--spacing) * 8);
  }
  .pb-1 {
    padding-bottom: var(--spacing);
  }
  .pb-1\.5 {
    padding-bottom: calc(var(--spacing) * 1.5);
  }
  .pb-2 {
    padding-bottom: calc(var(--spacing) * 2);
  }
  .pb-2\.5 {
    padding-bottom: calc(var(--spacing) * 2.5);
  }
  .pb-3 {
    padding-bottom: calc(var(--spacing) * 3);
  }
  .pb-4 {
    padding-bottom: calc(var(--spacing) * 4);
  }
  .pb-6 {
    padding-bottom: calc(var(--spacing) * 6);
  }
  .pb-20 {
    padding-bottom: calc(var(--spacing) * 20);
  }
  .pl-0\.5 {
    padding-left: calc(var(--spacing) * 0.5);
  }
  .pl-1 {
    padding-left: var(--spacing);
  }
  .pl-1\.5 {
    padding-left: calc(var(--spacing) * 1.5);
  }
  .pl-2 {
    padding-left: calc(var(--spacing) * 2);
  }
  .pl-2\.5 {
    padding-left: calc(var(--spacing) * 2.5);
  }
  .pl-3 {
    padding-left: calc(var(--spacing) * 3);
  }
  .pl-4 {
    padding-left: calc(var(--spacing) * 4);
  }
  .pl-5 {
    padding-left: calc(var(--spacing) * 5);
  }
  .pl-6 {
    padding-left: calc(var(--spacing) * 6);
  }
  .pl-7 {
    padding-left: calc(var(--spacing) * 7);
  }
  .pl-8 {
    padding-left: calc(var(--spacing) * 8);
  }
  .pl-9 {
    padding-left: calc(var(--spacing) * 9);
  }
  .pl-12 {
    padding-left: calc(var(--spacing) * 12);
  }
  .pl-\[34px\] {
    padding-left: 34px;
  }
  .pl-\[46px\] {
    padding-left: 46px;
  }
  .pl-\[132px\] {
    padding-left: 132px;
  }
  .text-center {
    text-align: center;
  }
  .text-left {
    text-align: left;
  }
  .text-right {
    text-align: right;
  }
  .align-baseline {
    vertical-align: baseline;
  }
  .align-middle {
    vertical-align: middle;
  }
  .align-top {
    vertical-align: top;
  }
  .font-mono {
    font-family: var(--font-mono);
  }
  .font-sans {
    font-family: var(--font-sans);
  }
  .text-base {
    font-size: var(--text-base);
    line-height: var(--tw-leading, var(--text-base--line-height));
  }
  .text-lg {
    font-size: var(--text-lg);
    line-height: var(--tw-leading, var(--text-lg--line-height));
  }
  .text-sm {
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
  }
  .text-xs {
    font-size: var(--text-xs);
    line-height: var(--tw-leading, var(--text-xs--line-height));
  }
  .\[font-size\:10\.5px\] {
    font-size: 10.5px;
  }
  .\[font-size\:10px\] {
    font-size: 10px;
  }
  .\[font-size\:11\.5px\] {
    font-size: 11.5px;
  }
  .\[font-size\:11px\] {
    font-size: 11px;
  }
  .\[font-size\:12\.5px\] {
    font-size: 12.5px;
  }
  .\[font-size\:12px\] {
    font-size: 12px;
  }
  .\[font-size\:13px\] {
    font-size: 13px;
  }
  .\[font-size\:14px\] {
    font-size: 14px;
  }
  .\[font-size\:17px\] {
    font-size: 17px;
  }
  .text-\[0\.7rem\] {
    font-size: 0.7rem;
  }
  .text-\[0\.9rem\] {
    font-size: 0.9rem;
  }
  .text-\[0\.55rem\] {
    font-size: 0.55rem;
  }
  .text-\[0\.75rem\] {
    font-size: 0.75rem;
  }
  .text-\[0\.78rem\] {
    font-size: 0.78rem;
  }
  .text-\[0\.85em\] {
    font-size: 0.85em;
  }
  .text-\[0\.85rem\] {
    font-size: 0.85rem;
  }
  .text-\[0\.86rem\] {
    font-size: 0.86rem;
  }
  .text-\[0\.88rem\] {
    font-size: 0.88rem;
  }
  .text-\[0\.92rem\] {
    font-size: 0.92rem;
  }
  .text-\[0\.95rem\] {
    font-size: 0.95rem;
  }
  .text-\[0\.625rem\] {
    font-size: 0.625rem;
  }
  .text-\[0\.875rem\] {
    font-size: 0.875rem;
  }
  .text-\[0\.6875rem\] {
    font-size: 0.6875rem;
  }
  .text-\[0\.8125rem\] {
    font-size: 0.8125rem;
  }
  .text-\[0\.9375rem\] {
    font-size: 0.9375rem;
  }
  .text-\[1\.1rem\] {
    font-size: 1.1rem;
  }
  .text-\[1\.05rem\] {
    font-size: 1.05rem;
  }
  .text-\[1\.25rem\] {
    font-size: 1.25rem;
  }
  .text-\[1\.125rem\] {
    font-size: 1.125rem;
  }
  .text-\[1\.0625rem\] {
    font-size: 1.0625rem;
  }
  .text-\[1rem\] {
    font-size: 1rem;
  }
  .text-\[9px\] {
    font-size: 9px;
  }
  .text-\[10px\] {
    font-size: 10px;
  }
  .text-\[11px\] {
    font-size: 11px;
  }
  .text-\[12px\] {
    font-size: 12px;
  }
  .text-\[20px\] {
    font-size: 20px;
  }
  .text-\[24px\] {
    font-size: 24px;
  }
  .leading-4 {
    --tw-leading: calc(var(--spacing) * 4);
    line-height: calc(var(--spacing) * 4);
  }
  .leading-5 {
    --tw-leading: calc(var(--spacing) * 5);
    line-height: calc(var(--spacing) * 5);
  }
  .leading-\[1\.6\] {
    --tw-leading: 1.6;
    line-height: 1.6;
  }
  .leading-\[1\.35\] {
    --tw-leading: 1.35;
    line-height: 1.35;
  }
  .leading-\[1\.65\] {
    --tw-leading: 1.65;
    line-height: 1.65;
  }
  .leading-\[14px\] {
    --tw-leading: 14px;
    line-height: 14px;
  }
  .leading-none {
    --tw-leading: 1;
    line-height: 1;
  }
  .leading-normal {
    --tw-leading: var(--leading-normal);
    line-height: var(--leading-normal);
  }
  .leading-relaxed {
    --tw-leading: var(--leading-relaxed);
    line-height: var(--leading-relaxed);
  }
  .leading-snug {
    --tw-leading: var(--leading-snug);
    line-height: var(--leading-snug);
  }
  .font-bold {
    --tw-font-weight: var(--font-weight-bold);
    font-weight: var(--font-weight-bold);
  }
  .font-medium {
    --tw-font-weight: var(--font-weight-medium);
    font-weight: var(--font-weight-medium);
  }
  .font-normal {
    --tw-font-weight: var(--font-weight-normal);
    font-weight: var(--font-weight-normal);
  }
  .font-semibold {
    --tw-font-weight: var(--font-weight-semibold);
    font-weight: var(--font-weight-semibold);
  }
  .tracking-\[0\.3em\] {
    --tw-tracking: 0.3em;
    letter-spacing: 0.3em;
  }
  .tracking-\[0\.04em\] {
    --tw-tracking: 0.04em;
    letter-spacing: 0.04em;
  }
  .tracking-\[0\.06em\] {
    --tw-tracking: 0.06em;
    letter-spacing: 0.06em;
  }
  .tracking-wide {
    --tw-tracking: var(--tracking-wide);
    letter-spacing: var(--tracking-wide);
  }
  .break-words {
    overflow-wrap: break-word;
  }
  .break-all {
    word-break: break-all;
  }
  .whitespace-normal {
    white-space: normal;
  }
  .whitespace-nowrap {
    white-space: nowrap;
  }
  .whitespace-pre {
    white-space: pre;
  }
  .whitespace-pre-line {
    white-space: pre-line;
  }
  .whitespace-pre-wrap {
    white-space: pre-wrap;
  }
  .tab-1 {
    tab-size: 1;
  }
  .text-\[\#abc\] {
    color: #abc;
  }
  .text-\[var\(--tag-blue\)\] {
    color: var(--tag-blue);
  }
  .text-\[var\(--tag-green\)\] {
    color: var(--tag-green);
  }
  .text-\[var\(--tag-orange\)\] {
    color: var(--tag-orange);
  }
  .text-\[var\(--tag-red\)\] {
    color: var(--tag-red);
  }
  .text-\[var\(--tag-yellow\)\] {
    color: var(--tag-yellow);
  }
  .text-accent-6 {
    color: var(--color-accent-6);
  }
  .text-accent-8 {
    color: var(--color-accent-8);
  }
  .text-accent-9 {
    color: var(--color-accent-9);
  }
  .text-accent-10 {
    color: var(--color-accent-10);
  }
  .text-accent-11 {
    color: var(--color-accent-11);
  }
  .text-accent-12 {
    color: var(--color-accent-12);
  }
  .text-amber-700 {
    color: var(--color-amber-700);
  }
  .text-gray-1 {
    color: var(--color-gray-1);
  }
  .text-gray-5 {
    color: var(--color-gray-5);
  }
  .text-gray-6 {
    color: var(--color-gray-6);
  }
  .text-gray-7 {
    color: var(--color-gray-7);
  }
  .text-gray-8 {
    color: var(--color-gray-11);
  }
  .text-gray-9 {
    color: var(--color-gray-11);
  }
  .text-gray-10 {
    color: var(--color-gray-10);
  }
  .text-gray-11 {
    color: var(--color-gray-11);
  }
  .text-gray-12 {
    color: var(--color-gray-12);
  }
  .text-green-600 {
    color: var(--color-green-600);
  }
  .text-green-700 {
    color: var(--color-green-700);
  }
  .text-red-600 {
    color: var(--color-red-600);
  }
  .text-red-700 {
    color: var(--color-red-700);
  }
  .text-tag-blue {
    color: var(--color-tag-blue);
  }
  .text-tag-green {
    color: var(--color-tag-green);
  }
  .text-tag-orange {
    color: var(--color-tag-orange);
  }
  .text-tag-red {
    color: var(--color-tag-red);
  }
  .text-tag-turquoise {
    color: var(--color-tag-turquoise);
  }
  .text-tag-yellow {
    color: var(--color-tag-yellow);
  }
  .text-transparent {
    color: transparent;
  }
  .text-white {
    color: var(--color-white);
  }
  .text-white\/90 {
    color: color-mix(in srgb, #fff 90%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      color: color-mix(in oklab, var(--color-white) 90%, transparent);
    }
  }
  .capitalize {
    text-transform: capitalize;
  }
  .lowercase {
    text-transform: lowercase;
  }
  .normal-case {
    text-transform: none;
  }
  .uppercase {
    text-transform: uppercase;
  }
  .italic {
    font-style: italic;
  }
  .not-italic {
    font-style: normal;
  }
  .ordinal {
    --tw-ordinal: ordinal;
    font-variant-numeric: var(--tw-ordinal,) var(--tw-slashed-zero,) var(--tw-numeric-figure,) var(--tw-numeric-spacing,) var(--tw-numeric-fraction,);
  }
  .proportional-nums {
    --tw-numeric-spacing: proportional-nums;
    font-variant-numeric: var(--tw-ordinal,) var(--tw-slashed-zero,) var(--tw-numeric-figure,) var(--tw-numeric-spacing,) var(--tw-numeric-fraction,);
  }
  .slashed-zero {
    --tw-slashed-zero: slashed-zero;
    font-variant-numeric: var(--tw-ordinal,) var(--tw-slashed-zero,) var(--tw-numeric-figure,) var(--tw-numeric-spacing,) var(--tw-numeric-fraction,);
  }
  .tabular-nums {
    --tw-numeric-spacing: tabular-nums;
    font-variant-numeric: var(--tw-ordinal,) var(--tw-slashed-zero,) var(--tw-numeric-figure,) var(--tw-numeric-spacing,) var(--tw-numeric-fraction,);
  }
  .line-through {
    text-decoration-line: line-through;
  }
  .no-underline {
    text-decoration-line: none;
  }
  .overline {
    text-decoration-line: overline;
  }
  .underline {
    text-decoration-line: underline;
  }
  .decoration-dotted {
    text-decoration-style: dotted;
  }
  .underline-offset-2 {
    text-underline-offset: 2px;
  }
  .antialiased {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
  }
  .subpixel-antialiased {
    -webkit-font-smoothing: auto;
    -moz-osx-font-smoothing: auto;
  }
  .\[caret-color\:var\(--color-accent-9\)\] {
    caret-color: var(--color-accent-9);
  }
  .caret-accent-9 {
    caret-color: var(--color-accent-9);
  }
  .caret-transparent {
    caret-color: transparent;
  }
  .accent-accent-9 {
    accent-color: var(--color-accent-9);
  }
  .opacity-0 {
    opacity: 0%;
  }
  .opacity-30 {
    opacity: 30%;
  }
  .opacity-40 {
    opacity: 40%;
  }
  .opacity-50 {
    opacity: 50%;
  }
  .opacity-60 {
    opacity: 60%;
  }
  .opacity-70 {
    opacity: 70%;
  }
  .opacity-90 {
    opacity: 90%;
  }
  .opacity-100 {
    opacity: 100%;
  }
  .shadow {
    --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
  .shadow-\[-12px_0_36px_rgba\(0\,0\,0\,0\.12\)\] {
    --tw-shadow: -12px 0 36px var(--tw-shadow-color, rgba(0,0,0,0.12));
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
  .shadow-\[0_0_8px_rgba\(0\,0\,0\,0\.10\)\,0_8px_48px_rgba\(0\,0\,0\,0\.22\)\] {
    --tw-shadow: 0 0 8px var(--tw-shadow-color, rgba(0,0,0,0.10)), 0 8px 48px var(--tw-shadow-color, rgba(0,0,0,0.22));
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
  .shadow-\[0_1px_2px_rgba\(0\,0\,0\,0\.2\)\] {
    --tw-shadow: 0 1px 2px var(--tw-shadow-color, rgba(0,0,0,0.2));
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
  .shadow-\[0_1px_2px_rgba\(0\,0\,0\,0\.03\)\] {
    --tw-shadow: 0 1px 2px var(--tw-shadow-color, rgba(0,0,0,0.03));
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
  .shadow-\[0_1px_2px_rgba\(0\,0\,0\,0\.04\)\] {
    --tw-shadow: 0 1px 2px var(--tw-shadow-color, rgba(0,0,0,0.04));
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
  .shadow-\[0_1px_2px_rgba\(0\,0\,0\,0\.06\)\] {
    --tw-shadow: 0 1px 2px var(--tw-shadow-color, rgba(0,0,0,0.06));
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
  .shadow-\[0_1px_4px_rgba\(0\,0\,0\,0\.08\)\] {
    --tw-shadow: 0 1px 4px var(--tw-shadow-color, rgba(0,0,0,0.08));
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
  .shadow-\[0_2px_8px_rgba\(0\,0\,0\,0\.18\)\] {
    --tw-shadow: 0 2px 8px var(--tw-shadow-color, rgba(0,0,0,0.18));
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
  .shadow-\[0_4px_12px_rgba\(0\,0\,0\,0\.08\)\] {
    --tw-shadow: 0 4px 12px var(--tw-shadow-color, rgba(0,0,0,0.08));
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
  .shadow-\[0_4px_16px_rgba\(0\,0\,0\,0\.12\)\] {
    --tw-shadow: 0 4px 16px var(--tw-shadow-color, rgba(0,0,0,0.12));
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
  .shadow-\[0_8px_24px_rgba\(0\,0\,0\,0\.10\)\] {
    --tw-shadow: 0 8px 24px var(--tw-shadow-color, rgba(0,0,0,0.10));
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
  .shadow-\[0_8px_24px_rgba\(0\,0\,0\,0\.12\)\] {
    --tw-shadow: 0 8px 24px var(--tw-shadow-color, rgba(0,0,0,0.12));
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
  .shadow-\[0_8px_24px_rgba\(0\,0\,0\,0\.25\)\] {
    --tw-shadow: 0 8px 24px var(--tw-shadow-color, rgba(0,0,0,0.25));
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
  .shadow-\[0_12px_36px_rgba\(0\,0\,0\,0\.14\)\] {
    --tw-shadow: 0 12px 36px var(--tw-shadow-color, rgba(0,0,0,0.14));
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
  .shadow-\[0_12px_40px_rgba\(0\,0\,0\,0\.18\)\] {
    --tw-shadow: 0 12px 40px var(--tw-shadow-color, rgba(0,0,0,0.18));
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
  .shadow-\[0_12px_40px_rgba\(0\,0\,0\,0\.22\)\] {
    --tw-shadow: 0 12px 40px var(--tw-shadow-color, rgba(0,0,0,0.22));
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
  .shadow-\[0_16px_48px_rgba\(0\,0\,0\,0\.16\)\] {
    --tw-shadow: 0 16px 48px var(--tw-shadow-color, rgba(0,0,0,0.16));
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
  .shadow-\[0_16px_48px_rgba\(0\,0\,0\,0\.18\)\] {
    --tw-shadow: 0 16px 48px var(--tw-shadow-color, rgba(0,0,0,0.18));
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
  .shadow-\[inset_0_-2px_0_var\(--color-accent-9\)\] {
    --tw-shadow: inset 0 -2px 0 var(--tw-shadow-color, var(--color-accent-9));
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
  .shadow-lg {
    --tw-shadow: 0 10px 15px -3px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 4px 6px -4px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
  .shadow-md {
    --tw-shadow: 0 4px 6px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 2px 4px -2px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
  .shadow-sm {
    --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
  .shadow-strong {
    --tw-shadow: 2px 4px 16px 0px var(--tw-shadow-color, rgba(0, 0, 0, 0.161)), 0px 2px 4px 0px var(--tw-shadow-color, rgba(0, 0, 0, 0.078));
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
  .shadow-xl {
    --tw-shadow: 0 20px 25px -5px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 8px 10px -6px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
  .ring {
    --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
  .ring-0 {
    --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(0px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
  .ring-1 {
    --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
  .ring-2 {
    --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
  .ring-accent-8\/30 {
    --tw-ring-color: color-mix(in srgb, #8da4ef 30%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      --tw-ring-color: color-mix(in oklab, var(--color-accent-8) 30%, transparent);
    }
  }
  .ring-accent-8\/40 {
    --tw-ring-color: color-mix(in srgb, #8da4ef 40%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      --tw-ring-color: color-mix(in oklab, var(--color-accent-8) 40%, transparent);
    }
  }
  .ring-accent-9 {
    --tw-ring-color: var(--color-accent-9);
  }
  .ring-tag-orange\/50 {
    --tw-ring-color: color-mix(in srgb, #f76b15 50%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      --tw-ring-color: color-mix(in oklab, var(--color-tag-orange) 50%, transparent);
    }
  }
  .ring-tag-red\/50 {
    --tw-ring-color: color-mix(in srgb, #e5484d 50%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      --tw-ring-color: color-mix(in oklab, var(--color-tag-red) 50%, transparent);
    }
  }
  .outline {
    outline-style: var(--tw-outline-style);
    outline-width: 1px;
  }
  .blur {
    --tw-blur: blur(8px);
    filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,);
  }
  .invert {
    --tw-invert: invert(100%);
    filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,);
  }
  .\!filter {
    filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,) !important;
  }
  .filter {
    filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,);
  }
  .transition {
    transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, display, content-visibility, overlay, pointer-events;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
  }
  .transition-\[width\] {
    transition-property: width;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
  }
  .transition-all {
    transition-property: all;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
  }
  .transition-colors {
    transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
  }
  .transition-opacity {
    transition-property: opacity;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
  }
  .transition-transform {
    transition-property: transform, translate, scale, rotate;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
  }
  .transition-none {
    transition-property: none;
  }
  .delay-200 {
    transition-delay: 200ms;
  }
  .duration-100 {
    --tw-duration: 100ms;
    transition-duration: 100ms;
  }
  .duration-150 {
    --tw-duration: 150ms;
    transition-duration: 150ms;
  }
  .duration-300 {
    --tw-duration: 300ms;
    transition-duration: 300ms;
  }
  .ease-out {
    --tw-ease: var(--ease-out);
    transition-timing-function: var(--ease-out);
  }
  .will-change-transform {
    will-change: transform;
  }
  .outline-none {
    --tw-outline-style: none;
    outline-style: none;
  }
  .select-all {
    -webkit-user-select: all;
    user-select: all;
  }
  .select-none {
    -webkit-user-select: none;
    user-select: none;
  }
  .ring-inset {
    --tw-ring-inset: inset;
  }
  .group-open\/chm\:opacity-100 {
    &:is(:where(.group\/chm):is([open], :popover-open, :open) *) {
      opacity: 100%;
    }
  }
  .group-open\/folder\:rotate-90 {
    &:is(:where(.group\/folder):is([open], :popover-open, :open) *) {
      rotate: 90deg;
    }
  }
  .group-open\/icons\:border-accent-9 {
    &:is(:where(.group\/icons):is([open], :popover-open, :open) *) {
      border-color: var(--color-accent-9);
    }
  }
  .group-open\/section\:rotate-90 {
    &:is(:where(.group\/section):is([open], :popover-open, :open) *) {
      rotate: 90deg;
    }
  }
  .group-open\/sub\:rotate-90 {
    &:is(:where(.group\/sub):is([open], :popover-open, :open) *) {
      rotate: 90deg;
    }
  }
  .group-open\/theme\:rotate-90 {
    &:is(:where(.group\/theme):is([open], :popover-open, :open) *) {
      rotate: 90deg;
    }
  }
  .group-open\/tool\:rotate-90 {
    &:is(:where(.group\/tool):is([open], :popover-open, :open) *) {
      rotate: 90deg;
    }
  }
  .group-focus-within\/recherche\:flex {
    &:is(:where(.group\/recherche):focus-within *) {
      display: flex;
    }
  }
  .group-focus-within\/tooltip\:opacity-100 {
    &:is(:where(.group\/tooltip):focus-within *) {
      opacity: 100%;
    }
  }
  .group-hover\:flex {
    &:is(:where(.group):hover *) {
      @media (hover: hover) {
        display: flex;
      }
    }
  }
  .group-hover\:hidden {
    &:is(:where(.group):hover *) {
      @media (hover: hover) {
        display: none;
      }
    }
  }
  .group-hover\:bg-gray-4 {
    &:is(:where(.group):hover *) {
      @media (hover: hover) {
        background-color: var(--color-gray-4);
      }
    }
  }
  .group-hover\:text-gray-12 {
    &:is(:where(.group):hover *) {
      @media (hover: hover) {
        color: var(--color-gray-12);
      }
    }
  }
  .group-hover\:opacity-100 {
    &:is(:where(.group):hover *) {
      @media (hover: hover) {
        opacity: 100%;
      }
    }
  }
  .group-hover\/card\:h-\[61px\] {
    &:is(:where(.group\/card):hover *) {
      @media (hover: hover) {
        height: 61px;
      }
    }
  }
  .group-hover\/card\:text-\[22px\] {
    &:is(:where(.group\/card):hover *) {
      @media (hover: hover) {
        font-size: 22px;
      }
    }
  }
  .group-hover\/card\:opacity-100 {
    &:is(:where(.group\/card):hover *) {
      @media (hover: hover) {
        opacity: 100%;
      }
    }
  }
  .group-hover\/col\:opacity-100 {
    &:is(:where(.group\/col):hover *) {
      @media (hover: hover) {
        opacity: 100%;
      }
    }
  }
  .group-hover\/fav\:opacity-100 {
    &:is(:where(.group\/fav):hover *) {
      @media (hover: hover) {
        opacity: 100%;
      }
    }
  }
  .group-hover\/favrow\:opacity-100 {
    &:is(:where(.group\/favrow):hover *) {
      @media (hover: hover) {
        opacity: 100%;
      }
    }
  }
  .group-hover\/folder\:opacity-100 {
    &:is(:where(.group\/folder):hover *) {
      @media (hover: hover) {
        opacity: 100%;
      }
    }
  }
  .group-hover\/tooltip\:opacity-100 {
    &:is(:where(.group\/tooltip):hover *) {
      @media (hover: hover) {
        opacity: 100%;
      }
    }
  }
  .group-has-\[\.nv-cal\:checked\]\/nv\:flex {
    &:is(:where(.group\/nv):has(*:is(.nv-cal:checked)) *) {
      display: flex;
    }
  }
  .group-has-\[\.nv-kanban\:checked\]\/nv\:flex {
    &:is(:where(.group\/nv):has(*:is(.nv-kanban:checked)) *) {
      display: flex;
    }
  }
  .group-has-\[\.sel-box\:checked\]\/list\:block {
    &:is(:where(.group\/list):has(*:is(.sel-box:checked)) *) {
      display: block;
    }
  }
  .group-has-\[\.sel-box\:checked\]\/list\:hidden {
    &:is(:where(.group\/list):has(*:is(.sel-box:checked)) *) {
      display: none;
    }
  }
  .group-has-\[\.sel-box\:checked\]\/sel\:flex {
    &:is(:where(.group\/sel):has(*:is(.sel-box:checked)) *) {
      display: flex;
    }
  }
  .group-has-\[\.sel-row\:has\(\.sel-box\:checked\)\~\.sel-row\:has\(\.sel-box\:checked\)\]\/sel\:hidden {
    &:is(:where(.group\/sel):has(*:is(.sel-row:has(.sel-box:checked)~.sel-row:has(.sel-box:checked))) *) {
      display: none;
    }
  }
  .group-has-\[\.sel-row\:has\(\.sel-box\:checked\)\~\.sel-row\:has\(\.sel-box\:checked\)\]\/sel\:inline-flex {
    &:is(:where(.group\/sel):has(*:is(.sel-row:has(.sel-box:checked)~.sel-row:has(.sel-box:checked))) *) {
      display: inline-flex;
    }
  }
  .group-has-\[\:checked\]\:translate-x-3 {
    &:is(:where(.group):has(*:is(:checked)) *) {
      --tw-translate-x: calc(var(--spacing) * 3);
      translate: var(--tw-translate-x) var(--tw-translate-y);
    }
  }
  .group-has-\[\:checked\]\:translate-x-\[15px\] {
    &:is(:where(.group):has(*:is(:checked)) *) {
      --tw-translate-x: 15px;
      translate: var(--tw-translate-x) var(--tw-translate-y);
    }
  }
  .group-has-\[\:checked\]\:border-accent-9 {
    &:is(:where(.group):has(*:is(:checked)) *) {
      border-color: var(--color-accent-9);
    }
  }
  .group-has-\[\:checked\]\:bg-accent-9 {
    &:is(:where(.group):has(*:is(:checked)) *) {
      background-color: var(--color-accent-9);
    }
  }
  .group-has-\[\:checked\]\:text-accent-11 {
    &:is(:where(.group):has(*:is(:checked)) *) {
      color: var(--color-accent-11);
    }
  }
  .group-has-\[\:checked\]\:text-accent-12 {
    &:is(:where(.group):has(*:is(:checked)) *) {
      color: var(--color-accent-12);
    }
  }
  .group-has-\[\:checked\]\:text-white {
    &:is(:where(.group):has(*:is(:checked)) *) {
      color: var(--color-white);
    }
  }
  .group-has-\[\:checked\]\:opacity-100 {
    &:is(:where(.group):has(*:is(:checked)) *) {
      opacity: 100%;
    }
  }
  .group-has-\[\:focus-visible\]\:ring-2 {
    &:is(:where(.group):has(*:is(:focus-visible)) *) {
      --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
      box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    }
  }
  .group-has-\[\:focus-visible\]\:ring-accent-8\/40 {
    &:is(:where(.group):has(*:is(:focus-visible)) *) {
      --tw-ring-color: color-mix(in srgb, #8da4ef 40%, transparent);
      @supports (color: color-mix(in lab, red, red)) {
        --tw-ring-color: color-mix(in oklab, var(--color-accent-8) 40%, transparent);
      }
    }
  }
  .group-has-\[\:indeterminate\]\:border-accent-9 {
    &:is(:where(.group):has(*:is(:indeterminate)) *) {
      border-color: var(--color-accent-9);
    }
  }
  .group-has-\[\:indeterminate\]\:bg-accent-9 {
    &:is(:where(.group):has(*:is(:indeterminate)) *) {
      background-color: var(--color-accent-9);
    }
  }
  .group-has-\[\:indeterminate\]\:text-white {
    &:is(:where(.group):has(*:is(:indeterminate)) *) {
      color: var(--color-white);
    }
  }
  .group-has-\[\:indeterminate\]\:opacity-100 {
    &:is(:where(.group):has(*:is(:indeterminate)) *) {
      opacity: 100%;
    }
  }
  .peer-checked\:block {
    &:is(:where(.peer):checked ~ *) {
      display: block;
    }
  }
  .peer-checked\:hidden {
    &:is(:where(.peer):checked ~ *) {
      display: none;
    }
  }
  .peer-checked\:translate-x-0 {
    &:is(:where(.peer):checked ~ *) {
      --tw-translate-x: 0;
      translate: var(--tw-translate-x) var(--tw-translate-y);
    }
  }
  .peer-checked\:scale-110 {
    &:is(:where(.peer):checked ~ *) {
      --tw-scale-x: 110%;
      --tw-scale-y: 110%;
      --tw-scale-z: 110%;
      scale: var(--tw-scale-x) var(--tw-scale-y);
    }
  }
  .peer-checked\/vbs\:flex {
    &:is(:where(.peer\/vbs):checked ~ *) {
      display: flex;
    }
  }
  .peer-checked\/vbs\:hidden {
    &:is(:where(.peer\/vbs):checked ~ *) {
      display: none;
    }
  }
  .peer-focus\:hidden {
    &:is(:where(.peer):focus ~ *) {
      display: none;
    }
  }
  .file\:mr-2 {
    &::file-selector-button {
      margin-right: calc(var(--spacing) * 2);
    }
  }
  .file\:mr-3 {
    &::file-selector-button {
      margin-right: calc(var(--spacing) * 3);
    }
  }
  .file\:h-8 {
    &::file-selector-button {
      height: calc(var(--spacing) * 8);
    }
  }
  .file\:cursor-pointer {
    &::file-selector-button {
      cursor: pointer;
    }
  }
  .file\:rounded-sm {
    &::file-selector-button {
      border-radius: var(--radius-sm);
    }
  }
  .file\:border {
    &::file-selector-button {
      border-style: var(--tw-border-style);
      border-width: 1px;
    }
  }
  .file\:border-0 {
    &::file-selector-button {
      border-style: var(--tw-border-style);
      border-width: 0px;
    }
  }
  .file\:border-gray-5 {
    &::file-selector-button {
      border-color: var(--color-gray-5);
    }
  }
  .file\:border-gray-6 {
    &::file-selector-button {
      border-color: var(--color-gray-6);
    }
  }
  .file\:bg-gray-1 {
    &::file-selector-button {
      background-color: var(--color-gray-1);
    }
  }
  .file\:bg-gray-3 {
    &::file-selector-button {
      background-color: var(--color-gray-3);
    }
  }
  .file\:px-2 {
    &::file-selector-button {
      padding-inline: calc(var(--spacing) * 2);
    }
  }
  .file\:px-2\.5 {
    &::file-selector-button {
      padding-inline: calc(var(--spacing) * 2.5);
    }
  }
  .file\:px-3 {
    &::file-selector-button {
      padding-inline: calc(var(--spacing) * 3);
    }
  }
  .file\:py-1 {
    &::file-selector-button {
      padding-block: var(--spacing);
    }
  }
  .file\:py-1\.5 {
    &::file-selector-button {
      padding-block: calc(var(--spacing) * 1.5);
    }
  }
  .file\:text-\[0\.75rem\] {
    &::file-selector-button {
      font-size: 0.75rem;
    }
  }
  .file\:text-\[0\.8125rem\] {
    &::file-selector-button {
      font-size: 0.8125rem;
    }
  }
  .file\:font-medium {
    &::file-selector-button {
      --tw-font-weight: var(--font-weight-medium);
      font-weight: var(--font-weight-medium);
    }
  }
  .file\:text-gray-11 {
    &::file-selector-button {
      color: var(--color-gray-11);
    }
  }
  .file\:text-gray-12 {
    &::file-selector-button {
      color: var(--color-gray-12);
    }
  }
  .placeholder\:font-normal {
    &::placeholder {
      --tw-font-weight: var(--font-weight-normal);
      font-weight: var(--font-weight-normal);
    }
  }
  .placeholder\:tracking-normal {
    &::placeholder {
      --tw-tracking: var(--tracking-normal);
      letter-spacing: var(--tracking-normal);
    }
  }
  .placeholder\:text-gray-8 {
    &::placeholder {
      color: var(--color-gray-8);
    }
  }
  .placeholder\:text-gray-9 {
    &::placeholder {
      color: var(--color-gray-9);
    }
  }
  .first\:border-t-0 {
    &:first-child {
      border-top-style: var(--tw-border-style);
      border-top-width: 0px;
    }
  }
  .first\:pt-0 {
    &:first-child {
      padding-top: 0;
    }
  }
  .last\:mb-0 {
    &:last-child {
      margin-bottom: 0;
    }
  }
  .last\:border-0 {
    &:last-child {
      border-style: var(--tw-border-style);
      border-width: 0px;
    }
  }
  .last\:border-r-0 {
    &:last-child {
      border-right-style: var(--tw-border-style);
      border-right-width: 0px;
    }
  }
  .last\:border-b-0 {
    &:last-child {
      border-bottom-style: var(--tw-border-style);
      border-bottom-width: 0px;
    }
  }
  .checked\:opacity-100 {
    &:checked {
      opacity: 100%;
    }
  }
  .focus-within\:border-accent-8 {
    &:focus-within {
      border-color: var(--color-accent-8);
    }
  }
  .focus-within\:border-gray-7 {
    &:focus-within {
      border-color: var(--color-gray-7);
    }
  }
  .focus-within\:shadow-\[0_0_0_3px_var\(--color-accent-4\)\] {
    &:focus-within {
      --tw-shadow: 0 0 0 3px var(--tw-shadow-color, var(--color-accent-4));
      box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    }
  }
  .hover\:border-accent-8 {
    &:hover {
      @media (hover: hover) {
        border-color: var(--color-accent-8);
      }
    }
  }
  .hover\:border-accent-9 {
    &:hover {
      @media (hover: hover) {
        border-color: var(--color-accent-9);
      }
    }
  }
  .hover\:border-gray-5 {
    &:hover {
      @media (hover: hover) {
        border-color: var(--color-gray-5);
      }
    }
  }
  .hover\:border-gray-6 {
    &:hover {
      @media (hover: hover) {
        border-color: var(--color-gray-6);
      }
    }
  }
  .hover\:border-gray-7 {
    &:hover {
      @media (hover: hover) {
        border-color: var(--color-gray-7);
      }
    }
  }
  .hover\:border-gray-8 {
    &:hover {
      @media (hover: hover) {
        border-color: var(--color-gray-8);
      }
    }
  }
  .hover\:border-gray-9 {
    &:hover {
      @media (hover: hover) {
        border-color: var(--color-gray-9);
      }
    }
  }
  .hover\:bg-accent-3 {
    &:hover {
      @media (hover: hover) {
        background-color: var(--color-accent-3);
      }
    }
  }
  .hover\:bg-accent-7 {
    &:hover {
      @media (hover: hover) {
        background-color: var(--color-accent-7);
      }
    }
  }
  .hover\:bg-accent-8\/40 {
    &:hover {
      @media (hover: hover) {
        background-color: color-mix(in srgb, #8da4ef 40%, transparent);
        @supports (color: color-mix(in lab, red, red)) {
          background-color: color-mix(in oklab, var(--color-accent-8) 40%, transparent);
        }
      }
    }
  }
  .hover\:bg-accent-9 {
    &:hover {
      @media (hover: hover) {
        background-color: var(--color-accent-9);
      }
    }
  }
  .hover\:bg-accent-10 {
    &:hover {
      @media (hover: hover) {
        background-color: var(--color-accent-10);
      }
    }
  }
  .hover\:bg-gray-1 {
    &:hover {
      @media (hover: hover) {
        background-color: var(--color-gray-1);
      }
    }
  }
  .hover\:bg-gray-2 {
    &:hover {
      @media (hover: hover) {
        background-color: var(--color-gray-2);
      }
    }
  }
  .hover\:bg-gray-3 {
    &:hover {
      @media (hover: hover) {
        background-color: var(--color-gray-3);
      }
    }
  }
  .hover\:bg-gray-4 {
    &:hover {
      @media (hover: hover) {
        background-color: var(--color-gray-4);
      }
    }
  }
  .hover\:bg-gray-5 {
    &:hover {
      @media (hover: hover) {
        background-color: var(--color-gray-5);
      }
    }
  }
  .hover\:bg-gray-11 {
    &:hover {
      @media (hover: hover) {
        background-color: var(--color-gray-11);
      }
    }
  }
  .hover\:bg-tag-red\/10 {
    &:hover {
      @media (hover: hover) {
        background-color: color-mix(in srgb, #e5484d 10%, transparent);
        @supports (color: color-mix(in lab, red, red)) {
          background-color: color-mix(in oklab, var(--color-tag-red) 10%, transparent);
        }
      }
    }
  }
  .hover\:bg-tag-red\/90 {
    &:hover {
      @media (hover: hover) {
        background-color: color-mix(in srgb, #e5484d 90%, transparent);
        @supports (color: color-mix(in lab, red, red)) {
          background-color: color-mix(in oklab, var(--color-tag-red) 90%, transparent);
        }
      }
    }
  }
  .hover\:bg-white\/15 {
    &:hover {
      @media (hover: hover) {
        background-color: color-mix(in srgb, #fff 15%, transparent);
        @supports (color: color-mix(in lab, red, red)) {
          background-color: color-mix(in oklab, var(--color-white) 15%, transparent);
        }
      }
    }
  }
  .hover\:bg-white\/20 {
    &:hover {
      @media (hover: hover) {
        background-color: color-mix(in srgb, #fff 20%, transparent);
        @supports (color: color-mix(in lab, red, red)) {
          background-color: color-mix(in oklab, var(--color-white) 20%, transparent);
        }
      }
    }
  }
  .hover\:text-\[var\(--tag-red\)\] {
    &:hover {
      @media (hover: hover) {
        color: var(--tag-red);
      }
    }
  }
  .hover\:text-accent-9 {
    &:hover {
      @media (hover: hover) {
        color: var(--color-accent-9);
      }
    }
  }
  .hover\:text-accent-11 {
    &:hover {
      @media (hover: hover) {
        color: var(--color-accent-11);
      }
    }
  }
  .hover\:text-gray-6 {
    &:hover {
      @media (hover: hover) {
        color: var(--color-gray-6);
      }
    }
  }
  .hover\:text-gray-9 {
    &:hover {
      @media (hover: hover) {
        color: var(--color-gray-9);
      }
    }
  }
  .hover\:text-gray-11 {
    &:hover {
      @media (hover: hover) {
        color: var(--color-gray-11);
      }
    }
  }
  .hover\:text-gray-12 {
    &:hover {
      @media (hover: hover) {
        color: var(--color-gray-12);
      }
    }
  }
  .hover\:text-red-600 {
    &:hover {
      @media (hover: hover) {
        color: var(--color-red-600);
      }
    }
  }
  .hover\:text-tag-red {
    &:hover {
      @media (hover: hover) {
        color: var(--color-tag-red);
      }
    }
  }
  .hover\:underline {
    &:hover {
      @media (hover: hover) {
        text-decoration-line: underline;
      }
    }
  }
  .hover\:decoration-solid {
    &:hover {
      @media (hover: hover) {
        text-decoration-style: solid;
      }
    }
  }
  .hover\:opacity-80 {
    &:hover {
      @media (hover: hover) {
        opacity: 80%;
      }
    }
  }
  .hover\:opacity-90 {
    &:hover {
      @media (hover: hover) {
        opacity: 90%;
      }
    }
  }
  .hover\:opacity-100 {
    &:hover {
      @media (hover: hover) {
        opacity: 100%;
      }
    }
  }
  .hover\:ring-1 {
    &:hover {
      @media (hover: hover) {
        --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
        box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
      }
    }
  }
  .hover\:ring-gray-5 {
    &:hover {
      @media (hover: hover) {
        --tw-ring-color: var(--color-gray-5);
      }
    }
  }
  .hover\:brightness-95 {
    &:hover {
      @media (hover: hover) {
        --tw-brightness: brightness(95%);
        filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,);
      }
    }
  }
  .hover\:ring-inset {
    &:hover {
      @media (hover: hover) {
        --tw-ring-inset: inset;
      }
    }
  }
  .hover\:file\:bg-gray-3 {
    &:hover {
      @media (hover: hover) {
        &::file-selector-button {
          background-color: var(--color-gray-3);
        }
      }
    }
  }
  .focus\:border-accent-7 {
    &:focus {
      border-color: var(--color-accent-7);
    }
  }
  .focus\:border-accent-8 {
    &:focus {
      border-color: var(--color-accent-8);
    }
  }
  .focus\:border-accent-9 {
    &:focus {
      border-color: var(--color-accent-9);
    }
  }
  .focus\:border-tag-red {
    &:focus {
      border-color: var(--color-tag-red);
    }
  }
  .focus\:bg-accent-2 {
    &:focus {
      background-color: var(--color-accent-2);
    }
  }
  .focus\:bg-gray-1 {
    &:focus {
      background-color: var(--color-gray-1);
    }
  }
  .focus\:bg-gray-2 {
    &:focus {
      background-color: var(--color-gray-2);
    }
  }
  .focus\:bg-gray-3 {
    &:focus {
      background-color: var(--color-gray-3);
    }
  }
  .focus\:text-gray-12 {
    &:focus {
      color: var(--color-gray-12);
    }
  }
  .focus\:opacity-100 {
    &:focus {
      opacity: 100%;
    }
  }
  .focus\:ring-1 {
    &:focus {
      --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
      box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    }
  }
  .focus\:ring-2 {
    &:focus {
      --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
      box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    }
  }
  .focus\:ring-accent-4 {
    &:focus {
      --tw-ring-color: var(--color-accent-4);
    }
  }
  .focus\:ring-accent-7 {
    &:focus {
      --tw-ring-color: var(--color-accent-7);
    }
  }
  .focus\:ring-accent-8 {
    &:focus {
      --tw-ring-color: var(--color-accent-8);
    }
  }
  .focus\:ring-accent-8\/30 {
    &:focus {
      --tw-ring-color: color-mix(in srgb, #8da4ef 30%, transparent);
      @supports (color: color-mix(in lab, red, red)) {
        --tw-ring-color: color-mix(in oklab, var(--color-accent-8) 30%, transparent);
      }
    }
  }
  .focus\:ring-accent-8\/40 {
    &:focus {
      --tw-ring-color: color-mix(in srgb, #8da4ef 40%, transparent);
      @supports (color: color-mix(in lab, red, red)) {
        --tw-ring-color: color-mix(in oklab, var(--color-accent-8) 40%, transparent);
      }
    }
  }
  .focus\:ring-tag-red\/30 {
    &:focus {
      --tw-ring-color: color-mix(in srgb, #e5484d 30%, transparent);
      @supports (color: color-mix(in lab, red, red)) {
        --tw-ring-color: color-mix(in oklab, var(--color-tag-red) 30%, transparent);
      }
    }
  }
  .focus\:outline-none {
    &:focus {
      --tw-outline-style: none;
      outline-style: none;
    }
  }
  .focus\:ring-inset {
    &:focus {
      --tw-ring-inset: inset;
    }
  }
  .focus\:hover\:z-20 {
    &:focus {
      &:hover {
        @media (hover: hover) {
          z-index: 20;
        }
      }
    }
  }
  .hover\:focus\:z-10 {
    &:hover {
      @media (hover: hover) {
        &:focus {
          z-index: 10;
        }
      }
    }
  }
  .focus-visible\:bg-gray-3 {
    &:focus-visible {
      background-color: var(--color-gray-3);
    }
  }
  .focus-visible\:opacity-100 {
    &:focus-visible {
      opacity: 100%;
    }
  }
  .focus-visible\:ring-2 {
    &:focus-visible {
      --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
      box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    }
  }
  .focus-visible\:ring-accent-8\/30 {
    &:focus-visible {
      --tw-ring-color: color-mix(in srgb, #8da4ef 30%, transparent);
      @supports (color: color-mix(in lab, red, red)) {
        --tw-ring-color: color-mix(in oklab, var(--color-accent-8) 30%, transparent);
      }
    }
  }
  .focus-visible\:ring-accent-8\/40 {
    &:focus-visible {
      --tw-ring-color: color-mix(in srgb, #8da4ef 40%, transparent);
      @supports (color: color-mix(in lab, red, red)) {
        --tw-ring-color: color-mix(in oklab, var(--color-accent-8) 40%, transparent);
      }
    }
  }
  .focus-visible\:ring-white\/50 {
    &:focus-visible {
      --tw-ring-color: color-mix(in srgb, #fff 50%, transparent);
      @supports (color: color-mix(in lab, red, red)) {
        --tw-ring-color: color-mix(in oklab, var(--color-white) 50%, transparent);
      }
    }
  }
  .focus-visible\:outline-none {
    &:focus-visible {
      --tw-outline-style: none;
      outline-style: none;
    }
  }
  .focus-visible\:ring-inset {
    &:focus-visible {
      --tw-ring-inset: inset;
    }
  }
  .disabled\:pointer-events-none {
    &:disabled {
      pointer-events: none;
    }
  }
  .disabled\:cursor-not-allowed {
    &:disabled {
      cursor: not-allowed;
    }
  }
  .disabled\:border-gray-5 {
    &:disabled {
      border-color: var(--color-gray-5);
    }
  }
  .disabled\:opacity-30 {
    &:disabled {
      opacity: 30%;
    }
  }
  .disabled\:opacity-40 {
    &:disabled {
      opacity: 40%;
    }
  }
  .disabled\:opacity-50 {
    &:disabled {
      opacity: 50%;
    }
  }
  .disabled\:opacity-60 {
    &:disabled {
      opacity: 60%;
    }
  }
  .disabled\:hover\:bg-transparent {
    &:disabled {
      &:hover {
        @media (hover: hover) {
          background-color: transparent;
        }
      }
    }
  }
  .has-\[\:checked\]\:border-accent-8 {
    &:has(*:is(:checked)) {
      border-color: var(--color-accent-8);
    }
  }
  .has-\[\:checked\]\:border-accent-9 {
    &:has(*:is(:checked)) {
      border-color: var(--color-accent-9);
    }
  }
  .has-\[\:checked\]\:bg-accent-2 {
    &:has(*:is(:checked)) {
      background-color: var(--color-accent-2);
    }
  }
  .has-\[\:checked\]\:bg-accent-3 {
    &:has(*:is(:checked)) {
      background-color: var(--color-accent-3);
    }
  }
  .has-\[\:checked\]\:font-medium {
    &:has(*:is(:checked)) {
      --tw-font-weight: var(--font-weight-medium);
      font-weight: var(--font-weight-medium);
    }
  }
  .has-\[\:checked\]\:text-accent-11 {
    &:has(*:is(:checked)) {
      color: var(--color-accent-11);
    }
  }
  .has-\[\:checked\]\:text-accent-12 {
    &:has(*:is(:checked)) {
      color: var(--color-accent-12);
    }
  }
  .has-\[\:checked\]\:text-gray-12 {
    &:has(*:is(:checked)) {
      color: var(--color-gray-12);
    }
  }
  .has-\[\:disabled\]\:cursor-not-allowed {
    &:has(*:is(:disabled)) {
      cursor: not-allowed;
    }
  }
  .has-\[\:disabled\]\:opacity-50 {
    &:has(*:is(:disabled)) {
      opacity: 50%;
    }
  }
  .has-\[\:focus-visible\]\:ring-2 {
    &:has(*:is(:focus-visible)) {
      --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
      box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    }
  }
  .has-\[\:focus-visible\]\:ring-accent-8\/40 {
    &:has(*:is(:focus-visible)) {
      --tw-ring-color: color-mix(in srgb, #8da4ef 40%, transparent);
      @supports (color: color-mix(in lab, red, red)) {
        --tw-ring-color: color-mix(in oklab, var(--color-accent-8) 40%, transparent);
      }
    }
  }
  .aria-pressed\:bg-gray-4 {
    &[aria-pressed="true"] {
      background-color: var(--color-gray-4);
    }
  }
  .aria-pressed\:text-gray-12 {
    &[aria-pressed="true"] {
      color: var(--color-gray-12);
    }
  }
  .aria-selected\:border-gray-12 {
    &[aria-selected="true"] {
      border-color: var(--color-gray-12);
    }
  }
  .aria-selected\:bg-accent-3 {
    &[aria-selected="true"] {
      background-color: var(--color-accent-3);
    }
  }
  .aria-selected\:text-gray-12 {
    &[aria-selected="true"] {
      color: var(--color-gray-12);
    }
  }
  .sm\:block {
    @media (width >= 40rem) {
      display: block;
    }
  }
  .sm\:grid-cols-2 {
    @media (width >= 40rem) {
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }
  }
  .sm\:grid-cols-3 {
    @media (width >= 40rem) {
      grid-template-columns: repeat(3, minmax(0, 1fr));
    }
  }
  .sm\:grid-cols-\[5fr_2fr_3fr_1fr\] {
    @media (width >= 40rem) {
      grid-template-columns: 5fr 2fr 3fr 1fr;
    }
  }
  .sm\:flex-row {
    @media (width >= 40rem) {
      flex-direction: row;
    }
  }
  .sm\:items-center {
    @media (width >= 40rem) {
      align-items: center;
    }
  }
  .sm\:gap-4 {
    @media (width >= 40rem) {
      gap: calc(var(--spacing) * 4);
    }
  }
  .sm\:items-end {
    @media (width >= 40rem) {
      align-items: flex-end;
    }
  }
  .sm\:justify-between {
    @media (width >= 40rem) {
      justify-content: space-between;
    }
  }
  .sm\:px-8 {
    @media (width >= 40rem) {
      padding-inline: calc(var(--spacing) * 8);
    }
  }
  .sm\:pt-8 {
    @media (width >= 40rem) {
      padding-top: calc(var(--spacing) * 8);
    }
  }
  .md\:static {
    @media (width >= 48rem) {
      position: static;
    }
  }
  .md\:z-auto {
    @media (width >= 48rem) {
      z-index: auto;
    }
  }
  .md\:block {
    @media (width >= 48rem) {
      display: block;
    }
  }
  .md\:hidden {
    @media (width >= 48rem) {
      display: none;
    }
  }
  .md\:translate-x-0 {
    @media (width >= 48rem) {
      --tw-translate-x: 0;
      translate: var(--tw-translate-x) var(--tw-translate-y);
    }
  }
  .md\:grid-cols-2 {
    @media (width >= 48rem) {
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }
  }
  .md\:grid-cols-3 {
    @media (width >= 48rem) {
      grid-template-columns: repeat(3, minmax(0, 1fr));
    }
  }
  .md\:rounded-tl-\[16px\] {
    @media (width >= 48rem) {
      border-top-left-radius: 16px;
    }
  }
  .md\:border-0 {
    @media (width >= 48rem) {
      border-style: var(--tw-border-style);
      border-width: 0px;
    }
  }
  .md\:border-t {
    @media (width >= 48rem) {
      border-top-style: var(--tw-border-style);
      border-top-width: 1px;
    }
  }
  .md\:border-r {
    @media (width >= 48rem) {
      border-right-style: var(--tw-border-style);
      border-right-width: 1px;
    }
  }
  .md\:border-b-0 {
    @media (width >= 48rem) {
      border-bottom-style: var(--tw-border-style);
      border-bottom-width: 0px;
    }
  }
  .md\:border-l {
    @media (width >= 48rem) {
      border-left-style: var(--tw-border-style);
      border-left-width: 1px;
    }
  }
  .md\:border-gray-5 {
    @media (width >= 48rem) {
      border-color: var(--color-gray-5);
    }
  }
  .md\:shadow-none {
    @media (width >= 48rem) {
      --tw-shadow: 0 0 #0000;
      box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    }
  }
  .md\:peer-checked\:hidden {
    @media (width >= 48rem) {
      &:is(:where(.peer):checked ~ *) {
        display: none;
      }
    }
  }
  .lg\:w-\[380px\] {
    @media (width >= 64rem) {
      width: 380px;
    }
  }
  .lg\:flex-1 {
    @media (width >= 64rem) {
      flex: 1;
    }
  }
  .lg\:grid-cols-3 {
    @media (width >= 64rem) {
      grid-template-columns: repeat(3, minmax(0, 1fr));
    }
  }
  .lg\:flex-row {
    @media (width >= 64rem) {
      flex-direction: row;
    }
  }
  .lg\:overflow-hidden {
    @media (width >= 64rem) {
      overflow: hidden;
    }
  }
  .lg\:overflow-y-auto {
    @media (width >= 64rem) {
      overflow-y: auto;
    }
  }
  .lg\:border-r {
    @media (width >= 64rem) {
      border-right-style: var(--tw-border-style);
      border-right-width: 1px;
    }
  }
  .lg\:border-b-0 {
    @media (width >= 64rem) {
      border-bottom-style: var(--tw-border-style);
      border-bottom-width: 0px;
    }
  }
  .\@\[640px\]\/dash\:\[grid-template-columns\:repeat\(12\,minmax\(0\,1fr\)\)\] {
    @container dash (width >= 640px) {
      grid-template-columns: repeat(12,minmax(0,1fr));
    }
  }
  .dark\:block {
    &:where([data-theme="dark"], [data-theme="dark"] *) {
      display: block;
    }
  }
  .dark\:hidden {
    &:where([data-theme="dark"], [data-theme="dark"] *) {
      display: none;
    }
  }
  .dark\:border {
    &:where([data-theme="dark"], [data-theme="dark"] *) {
      border-style: var(--tw-border-style);
      border-width: 1px;
    }
  }
  .dark\:border-gray-6 {
    &:where([data-theme="dark"], [data-theme="dark"] *) {
      border-color: var(--color-gray-6);
    }
  }
  .dark\:bg-gray-3 {
    &:where([data-theme="dark"], [data-theme="dark"] *) {
      background-color: var(--color-gray-3);
    }
  }
  .dark\:text-accent-11 {
    &:where([data-theme="dark"], [data-theme="dark"] *) {
      color: var(--color-accent-11);
    }
  }
  .dark\:text-gray-12 {
    &:where([data-theme="dark"], [data-theme="dark"] *) {
      color: var(--color-gray-12);
    }
  }
  .dark\:hover\:text-gray-11 {
    &:where([data-theme="dark"], [data-theme="dark"] *) {
      &:hover {
        @media (hover: hover) {
          color: var(--color-gray-11);
        }
      }
    }
  }
  .\[\&\:\:-webkit-details-marker\]\:hidden {
    &::-webkit-details-marker {
      display: none;
    }
  }
  .\[\&\>\*\:first-child\:not\(\:last-child\)\]\:rounded-r-none {
    &>*:first-child:not(:last-child) {
      border-top-right-radius: 0;
      border-bottom-right-radius: 0;
    }
  }
  .\[\&\>\*\:focus-visible\]\:z-10 {
    &>*:focus-visible {
      z-index: 10;
    }
  }
  .\[\&\>\*\:hover\]\:z-10 {
    &>*:hover {
      z-index: 10;
    }
  }
  .\[\&\>\*\:last-child\:not\(\:first-child\)\]\:rounded-l-none {
    &>*:last-child:not(:first-child) {
      border-top-left-radius: 0;
      border-bottom-left-radius: 0;
    }
  }
  .\[\&\>\*\:not\(\:first-child\)\]\:-ml-0 {
    &>*:not(:first-child) {
      margin-left: 0;
    }
  }
  .\[\&\>\*\:not\(\:first-child\)\]\:-ml-px {
    &>*:not(:first-child) {
      margin-left: -1px;
    }
  }
  .\[\&\>\*\:not\(\:first-child\)\:not\(\:last-child\)\]\:rounded-none {
    &>*:not(:first-child):not(:last-child) {
      border-radius: 0;
    }
  }
  .\[canvas\:not\(\:empty\)\+\&\]\:hidden {
    canvas:not(:empty)+& {
      display: none;
    }
  }
}
[data-theme="dark"] {
  --color-gray-1: var(--card);
  --color-gray-2: var(--paper);
  --color-gray-3: var(--paper-2);
  --color-gray-4: color-mix(in srgb, var(--paper-2) 55%, var(--line-2));
  --color-gray-5: var(--line);
  --color-gray-6: var(--line-2);
  --color-gray-7: color-mix(in srgb, var(--line-2) 50%, var(--ink-faint));
  --color-gray-8: var(--ink-faint);
  --color-gray-9: var(--ink-3);
  --color-gray-10: var(--ink-3);
  --color-gray-11: var(--ink-2);
  --color-gray-12: var(--ink);
  --color-accent-1: var(--paper);
  --color-accent-2: var(--paper-2);
  --color-accent-3: var(--paper-2);
  --color-accent-4: color-mix(in srgb, var(--paper-2) 55%, var(--line-2));
  --color-accent-5: var(--line);
  --color-accent-6: var(--line-2);
  --color-accent-7: var(--ink-faint);
  --color-accent-8: var(--ink-2);
  --color-accent-9: var(--ink);
  --color-accent-10: color-mix(in srgb, var(--ink) 84%, var(--paper));
  --color-accent-11: var(--ink);
  --color-accent-12: var(--ink);
}
:root {
  --tag-gray: #8d8d8d;
  --tag-mauve: #8e8c99;
  --tag-slate: #8b8d98;
  --tag-sage: #7c8a82;
  --tag-olive: #82896f;
  --tag-sand: #8a8779;
  --tag-tomato: #e54d2e;
  --tag-red: #e5484d;
  --tag-ruby: #e54666;
  --tag-crimson: #e93d82;
  --tag-pink: #d6409f;
  --tag-plum: #ab4aba;
  --tag-purple: #8e4ec6;
  --tag-violet: #6e56cf;
  --tag-iris: #5b5bd6;
  --tag-cyan: #0c91b3;
  --tag-turquoise: #12a594;
  --tag-sky: #0c8bd0;
  --tag-blue: #3e63dd;
  --tag-jade: #1fa885;
  --tag-green: #30a46c;
  --tag-grass: #46a758;
  --tag-mint: #2bb39a;
  --tag-lime: #6fae1f;
  --tag-bronze: #a18072;
  --tag-gold: #93805d;
  --tag-brown: #ad7f58;
  --tag-orange: #f76b15;
  --tag-amber: #e08e0b;
  --tag-yellow: #c79a17;
}
:root {
  --obj-blue-bg: color(display-p3 0.831 0.87 1);
  --obj-blue-border: color(display-p3 0.767 0.814 0.995);
  --obj-blue-icon: color(display-p3 0.256 0.354 0.755);
  --obj-red-bg: color(display-p3 0.984 0.812 0.811);
  --obj-red-border: color(display-p3 0.955 0.751 0.749);
  --obj-red-icon: color(display-p3 0.744 0.234 0.222);
  --obj-turquoise-bg: color(display-p3 0.761 0.914 0.878);
  --obj-turquoise-border: color(display-p3 0.682 0.864 0.825);
  --obj-turquoise-icon: color(display-p3 0.08 0.5 0.43);
  --obj-purple-bg: color(display-p3 0.904 0.837 0.966);
  --obj-purple-border: color(display-p3 0.86 0.774 0.942);
  --obj-purple-icon: color(display-p3 0.473 0.281 0.687);
  --obj-pink-bg: color(display-p3 0.939 0.815 0.899);
  --obj-pink-border: color(display-p3 0.907 0.756 0.859);
  --obj-pink-icon: color(display-p3 0.698 0.219 0.528);
  --obj-orange-bg: color(display-p3 1 0.821 0.583);
  --obj-orange-border: color(display-p3 0.975 0.767 0.545);
  --obj-orange-icon: color(display-p3 0.76 0.34 0);
  --obj-green-bg: color(display-p3 0.796 0.907 0.826);
  --obj-green-border: color(display-p3 0.718 0.863 0.761);
  --obj-green-icon: color(display-p3 0.19 0.5 0.32);
  --obj-yellow-bg: color(display-p3 0.984 0.91 0.51);
  --obj-yellow-border: color(display-p3 0.934 0.847 0.474);
  --obj-yellow-icon: color(display-p3 0.6 0.44 0);
  --obj-sky-bg: color(display-p3 0.777 0.9 0.954);
  --obj-sky-border: color(display-p3 0.701 0.851 0.921);
  --obj-sky-icon: color(display-p3 0.193 0.448 0.605);
  --obj-violet-bg: color(display-p3 0.876 0.851 1);
  --obj-violet-border: color(display-p3 0.825 0.793 0.981);
  --obj-violet-icon: color(display-p3 0.383 0.317 0.702);
  --obj-gray-bg: var(--color-gray-5);
  --obj-gray-border: var(--color-gray-6);
  --obj-gray-icon: var(--color-gray-11);
}
[data-theme="dark"] {
  --obj-blue-bg: color(display-p3 0.163 0.22 0.439);
  --obj-blue-border: color(display-p3 0.203 0.262 0.5);
  --obj-blue-icon: color(display-p3 0.63 0.69 1);
  --obj-red-bg: color(display-p3 0.348 0.11 0.142);
  --obj-red-border: color(display-p3 0.414 0.16 0.183);
  --obj-red-icon: color(display-p3 1 0.57 0.55);
  --obj-turquoise-bg: color(display-p3 0.12 0.277 0.261);
  --obj-turquoise-border: color(display-p3 0.162 0.335 0.314);
  --obj-turquoise-icon: color(display-p3 0.388 0.835 0.719);
  --obj-purple-bg: color(display-p3 0.264 0.167 0.349);
  --obj-purple-border: color(display-p3 0.311 0.208 0.406);
  --obj-purple-icon: color(display-p3 0.8 0.62 1);
  --obj-pink-bg: color(display-p3 0.32 0.127 0.273);
  --obj-pink-border: color(display-p3 0.382 0.177 0.326);
  --obj-pink-icon: color(display-p3 1 0.535 0.78);
  --obj-orange-bg: color(display-p3 0.315 0.168 0.016);
  --obj-orange-border: color(display-p3 0.376 0.219 0.088);
  --obj-orange-icon: color(display-p3 1 0.63 0.38);
  --obj-green-bg: color(display-p3 0.147 0.282 0.206);
  --obj-green-border: color(display-p3 0.185 0.338 0.25);
  --obj-green-icon: color(display-p3 0.434 0.828 0.573);
  --obj-yellow-bg: color(display-p3 0.255 0.209 0);
  --obj-yellow-border: color(display-p3 0.31 0.261 0.07);
  --obj-yellow-icon: color(display-p3 0.948 0.885 0.392);
  --obj-sky-bg: color(display-p3 0.135 0.261 0.394);
  --obj-sky-border: color(display-p3 0.17 0.322 0.469);
  --obj-sky-icon: color(display-p3 0.536 0.772 0.924);
  --obj-violet-bg: color(display-p3 0.226 0.182 0.396);
  --obj-violet-border: color(display-p3 0.269 0.223 0.449);
  --obj-violet-icon: color(display-p3 0.72 0.65 1);
}
html, body {
  height: 100%;
}
body {
  background: var(--color-gray-1);
  color: var(--color-gray-12);
  font-family: var(--font-sans);
  font-size: 0.8125rem;
}
* {
  scrollbar-width: thin;
  scrollbar-color: var(--color-gray-6) transparent;
}
*::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}
*::-webkit-scrollbar-track {
  background: transparent;
}
*::-webkit-scrollbar-thumb {
  background-color: var(--color-gray-6);
  border-radius: var(--radius-sm);
  border: 2px solid transparent;
  background-clip: padding-box;
}
*::-webkit-scrollbar-thumb:hover {
  background-color: var(--color-gray-7);
}
*::-webkit-scrollbar-corner {
  background: transparent;
}
[cmdk-group-heading] {
  padding: 8px 8px 4px;
  font-size: 0.6875rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--color-gray-9);
}
[cmdk-item] {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px;
  border-radius: 6px;
  font-size: 0.8125rem;
  color: var(--color-gray-12);
  cursor: pointer;
}
[cmdk-item][data-selected="true"] {
  background: var(--color-gray-3);
}
.bn-root {
  --bn-side: var(--color-gray-7);
  --bn-hl-gray-text: #9b9a97;
  --bn-hl-gray-bg: #ebeced;
  --bn-hl-brown-text: #64473a;
  --bn-hl-brown-bg: #e9e5e3;
  --bn-hl-red-text: #e03e3e;
  --bn-hl-red-bg: #fbe4e4;
  --bn-hl-orange-text: #d9730d;
  --bn-hl-orange-bg: #f6e9d9;
  --bn-hl-yellow-text: #dfab01;
  --bn-hl-yellow-bg: #fbf3db;
  --bn-hl-green-text: #4d6461;
  --bn-hl-green-bg: #ddedea;
  --bn-hl-blue-text: #0b6e99;
  --bn-hl-blue-bg: #ddebf1;
  --bn-hl-purple-text: #6940a5;
  --bn-hl-purple-bg: #eae4f2;
  --bn-hl-pink-text: #ad1a72;
  --bn-hl-pink-bg: #f4dfeb;
}
[data-theme="dark"] .bn-root, [data-theme="dark"] .escouade-editor-popover {
  --bn-side: var(--color-gray-8);
  --bn-hl-gray-text: #bebdb8;
  --bn-hl-gray-bg: #9b9a97;
  --bn-hl-brown-text: #8e6552;
  --bn-hl-brown-bg: #64473a;
  --bn-hl-red-text: #ec4040;
  --bn-hl-red-bg: #be3434;
  --bn-hl-orange-text: #e3790d;
  --bn-hl-orange-bg: #b7600a;
  --bn-hl-yellow-text: #dfab01;
  --bn-hl-yellow-bg: #b58b00;
  --bn-hl-green-text: #6b8b87;
  --bn-hl-green-bg: #4d6461;
  --bn-hl-blue-text: #0e87bc;
  --bn-hl-blue-bg: #0b6e99;
  --bn-hl-purple-text: #8552d7;
  --bn-hl-purple-bg: #6940a5;
  --bn-hl-pink-text: #da208f;
  --bn-hl-pink-bg: #ad1a72;
}
.escouade-editor-popover {
  --bn-hl-gray-text: #9b9a97;
  --bn-hl-gray-bg: #ebeced;
  --bn-hl-brown-text: #64473a;
  --bn-hl-brown-bg: #e9e5e3;
  --bn-hl-red-text: #e03e3e;
  --bn-hl-red-bg: #fbe4e4;
  --bn-hl-orange-text: #d9730d;
  --bn-hl-orange-bg: #f6e9d9;
  --bn-hl-yellow-text: #dfab01;
  --bn-hl-yellow-bg: #fbf3db;
  --bn-hl-green-text: #4d6461;
  --bn-hl-green-bg: #ddedea;
  --bn-hl-blue-text: #0b6e99;
  --bn-hl-blue-bg: #ddebf1;
  --bn-hl-purple-text: #6940a5;
  --bn-hl-purple-bg: #eae4f2;
  --bn-hl-pink-text: #ad1a72;
  --bn-hl-pink-bg: #f4dfeb;
  position: fixed;
  z-index: 60;
}
.bn-editor {
  outline: none;
  padding-inline: 54px;
  font-size: 16px;
  line-height: 1.5;
  color: var(--color-gray-12);
  -webkit-font-smoothing: antialiased;
}
.bn-editor p, .bn-editor h1, .bn-editor h2, .bn-editor h3, .bn-editor h4, .bn-editor h5, .bn-editor h6, .bn-editor li {
  font-size: inherit;
  margin: 0;
  padding: 0;
  min-width: 2px;
}
.bn-block-outer {
  line-height: 1.5;
}
.bn-block {
  display: flex;
  flex-direction: column;
}
.bn-block-content {
  display: flex;
  width: 100%;
  padding: 3px 0;
  position: relative;
}
.bn-inline-content {
  position: relative;
  flex: 1;
  min-width: 0;
  white-space: pre-wrap;
  word-break: break-word;
}
.bn-block-group .bn-block-group {
  margin-left: 24px;
}
.bn-block-group .bn-block-group > .bn-block-outer {
  position: relative;
}
.bn-block-group .bn-block-group > .bn-block-outer::before {
  content: "";
  position: absolute;
  left: -20px;
  height: 100%;
  border-left: 1px solid var(--bn-side);
}
.bn-inline-content[data-placeholder]:has(> br:only-child)::before {
  content: attr(data-placeholder);
  position: absolute;
  left: 0;
  top: 0;
  color: var(--bn-side);
  font-style: italic;
  pointer-events: none;
  max-width: 100%;
  white-space: nowrap;
  overflow: hidden;
}
.bn-inline-content[data-placeholder-focus]:not(.bn-caret)::before {
  content: none;
}
[data-content-type="heading"] {
  padding-top: 18px;
}
[data-content-type="heading"] .bn-inline-content {
  font-weight: 700;
}
[data-content-type="heading"][data-level="1"] .bn-inline-content {
  font-size: 3em;
}
[data-content-type="heading"][data-level="2"] .bn-inline-content {
  font-size: 2em;
}
[data-content-type="heading"][data-level="3"] .bn-inline-content {
  font-size: 1.3em;
}
[data-content-type="heading"][data-level="4"] .bn-inline-content {
  font-size: 1em;
}
[data-content-type="heading"][data-level="5"] .bn-inline-content {
  font-size: 0.9em;
}
[data-content-type="heading"][data-level="6"] .bn-inline-content {
  font-size: 0.8em;
}
[data-content-type="quote"] blockquote {
  color: var(--color-gray-10);
  border-left: 2px solid var(--color-gray-8);
  margin: 0;
  padding-left: 1em;
}
[data-content-type="divider"] hr {
  border: none;
  border-top: 1px solid var(--color-gray-8);
  flex: 1;
  margin: 0.5em 0;
}
[data-content-type="pageBreak"] > div {
  border-top: 2px dotted var(--color-gray-8);
  width: 100%;
  height: 0;
  margin-block: 11px;
}
@media print {
  [data-content-type="pageBreak"] > div {
    page-break-after: always;
  }
}
.bn-block-content[data-content-type="numberedListItem"]::before, .bn-block-content[data-content-type="bulletListItem"]::before {
  display: flex;
  justify-content: center;
  min-width: 24px;
  padding-right: 4px;
}
.bn-block-content[data-content-type="numberedListItem"]::before {
  content: attr(data-index) ".";
}
.bn-block-content[data-content-type="bulletListItem"]::before {
  content: "•";
}
.bn-block-group .bn-block-group .bn-block-content[data-content-type="bulletListItem"]::before {
  content: "◦";
}
.bn-block-group .bn-block-group .bn-block-group .bn-block-content[data-content-type="bulletListItem"]::before {
  content: "▪︎";
}
[data-content-type="checkListItem"] > div {
  display: flex;
  align-items: flex-start;
  width: 100%;
}
[data-content-type="checkListItem"] > div > div {
  display: flex;
  align-items: center;
  height: 24px;
}
[data-content-type="checkListItem"] input {
  cursor: pointer;
  margin: 0 8px 0 4px;
  width: 12px;
  height: 24px;
  accent-color: var(--color-gray-12);
}
[data-content-type="checkListItem"][data-checked="true"] .bn-inline-content {
  text-decoration: line-through;
}
[data-content-type="toggleListItem"], [data-is-toggleable] {
  flex-wrap: wrap;
}
.bn-toggle-wrapper {
  display: flex;
  align-items: center;
  width: 100%;
}
.bn-toggle-button {
  display: flex;
  padding: 3px;
  border: 0;
  background: none;
  cursor: pointer;
  border-radius: 4px;
  color: var(--color-gray-12);
  transition: transform 0.15s;
}
.bn-toggle-button:hover {
  background: var(--color-gray-3);
}
.bn-toggle-button svg {
  width: 18px;
  height: 18px;
}
.bn-toggle-wrapper[data-show-children="true"] .bn-toggle-button {
  transform: rotate(90deg);
}
.bn-block:has(> .bn-block-content .bn-toggle-wrapper[data-show-children="false"]) > .bn-block-group {
  display: none;
}
.bn-toggle-add-block-button {
  margin-left: 22px;
  padding-inline: 2px;
  border: 0;
  background: none;
  cursor: pointer;
  color: var(--bn-side);
  font-size: 16px;
  border-radius: 4px;
}
.bn-toggle-add-block-button:hover {
  background: var(--color-gray-3);
}
[data-content-type="codeBlock"] {
  color: #fff;
  background: #161616;
  border-radius: 8px;
}
[data-content-type="codeBlock"] > pre {
  white-space: pre;
  tab-size: 2;
  width: 100%;
  margin: 0;
  padding: 24px;
  overflow-x: auto;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 0.875em;
}
[data-content-type="codeBlock"] > pre > code {
  display: block;
}
[data-content-type="codeBlock"] > div > select {
  position: absolute;
  top: 8px;
  left: 18px;
  appearance: none;
  opacity: 0;
  color: #fff;
  background: none;
  border: 0;
  font-size: 0.8em;
  cursor: pointer;
  outline: none;
  transition: opacity 0.3s 1s;
}
[data-content-type="codeBlock"]:hover > div > select, [data-content-type="codeBlock"] > div > select:focus {
  opacity: 0.5;
  transition-delay: 0.1s;
}
[data-content-type="codeBlock"] > div > select > option {
  color: #000;
}
.bn-inline-content code {
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  background: var(--color-gray-3);
  border-radius: 3px;
  padding: 0 3px;
  font-size: 0.9em;
}
.bn-editor a.bn-link {
  color: var(--color-accent-11);
  text-decoration: underline;
}
.bn-inline-content-section {
  white-space: nowrap;
}
[data-style-type="textColor"][data-value="gray"], [data-text-color="gray"] {
  color: var(--bn-hl-gray-text);
}
[data-style-type="textColor"][data-value="brown"], [data-text-color="brown"] {
  color: var(--bn-hl-brown-text);
}
[data-style-type="textColor"][data-value="red"], [data-text-color="red"] {
  color: var(--bn-hl-red-text);
}
[data-style-type="textColor"][data-value="orange"], [data-text-color="orange"] {
  color: var(--bn-hl-orange-text);
}
[data-style-type="textColor"][data-value="yellow"], [data-text-color="yellow"] {
  color: var(--bn-hl-yellow-text);
}
[data-style-type="textColor"][data-value="green"], [data-text-color="green"] {
  color: var(--bn-hl-green-text);
}
[data-style-type="textColor"][data-value="blue"], [data-text-color="blue"] {
  color: var(--bn-hl-blue-text);
}
[data-style-type="textColor"][data-value="purple"], [data-text-color="purple"] {
  color: var(--bn-hl-purple-text);
}
[data-style-type="textColor"][data-value="pink"], [data-text-color="pink"] {
  color: var(--bn-hl-pink-text);
}
[data-style-type="backgroundColor"][data-value="gray"], [data-background-color="gray"] {
  background-color: var(--bn-hl-gray-bg);
}
[data-style-type="backgroundColor"][data-value="brown"], [data-background-color="brown"] {
  background-color: var(--bn-hl-brown-bg);
}
[data-style-type="backgroundColor"][data-value="red"], [data-background-color="red"] {
  background-color: var(--bn-hl-red-bg);
}
[data-style-type="backgroundColor"][data-value="orange"], [data-background-color="orange"] {
  background-color: var(--bn-hl-orange-bg);
}
[data-style-type="backgroundColor"][data-value="yellow"], [data-background-color="yellow"] {
  background-color: var(--bn-hl-yellow-bg);
}
[data-style-type="backgroundColor"][data-value="green"], [data-background-color="green"] {
  background-color: var(--bn-hl-green-bg);
}
[data-style-type="backgroundColor"][data-value="blue"], [data-background-color="blue"] {
  background-color: var(--bn-hl-blue-bg);
}
[data-style-type="backgroundColor"][data-value="purple"], [data-background-color="purple"] {
  background-color: var(--bn-hl-purple-bg);
}
[data-style-type="backgroundColor"][data-value="pink"], [data-background-color="pink"] {
  background-color: var(--bn-hl-pink-bg);
}
.bn-color-icon[data-target="text"][data-color="gray"] {
  color: var(--bn-hl-gray-text);
}
.bn-color-icon[data-target="text"][data-color="brown"] {
  color: var(--bn-hl-brown-text);
}
.bn-color-icon[data-target="text"][data-color="red"] {
  color: var(--bn-hl-red-text);
}
.bn-color-icon[data-target="text"][data-color="orange"] {
  color: var(--bn-hl-orange-text);
}
.bn-color-icon[data-target="text"][data-color="yellow"] {
  color: var(--bn-hl-yellow-text);
}
.bn-color-icon[data-target="text"][data-color="green"] {
  color: var(--bn-hl-green-text);
}
.bn-color-icon[data-target="text"][data-color="blue"] {
  color: var(--bn-hl-blue-text);
}
.bn-color-icon[data-target="text"][data-color="purple"] {
  color: var(--bn-hl-purple-text);
}
.bn-color-icon[data-target="text"][data-color="pink"] {
  color: var(--bn-hl-pink-text);
}
.bn-color-icon[data-target="bg"][data-color="gray"] {
  background-color: var(--bn-hl-gray-bg);
}
.bn-color-icon[data-target="bg"][data-color="brown"] {
  background-color: var(--bn-hl-brown-bg);
}
.bn-color-icon[data-target="bg"][data-color="red"] {
  background-color: var(--bn-hl-red-bg);
}
.bn-color-icon[data-target="bg"][data-color="orange"] {
  background-color: var(--bn-hl-orange-bg);
}
.bn-color-icon[data-target="bg"][data-color="yellow"] {
  background-color: var(--bn-hl-yellow-bg);
}
.bn-color-icon[data-target="bg"][data-color="green"] {
  background-color: var(--bn-hl-green-bg);
}
.bn-color-icon[data-target="bg"][data-color="blue"] {
  background-color: var(--bn-hl-blue-bg);
}
.bn-color-icon[data-target="bg"][data-color="purple"] {
  background-color: var(--bn-hl-purple-bg);
}
.bn-color-icon[data-target="bg"][data-color="pink"] {
  background-color: var(--bn-hl-pink-bg);
}
[data-text-alignment="center"] {
  justify-content: center;
  text-align: center;
}
[data-text-alignment="right"] {
  justify-content: flex-end;
  text-align: right;
}
[data-text-alignment="justify"] {
  text-align: justify;
}
.bn-block-content.bn-selected > * {
  outline: 4px solid #64a0ff;
  border-radius: 4px;
}
[data-file-block] .bn-file-block-content-wrapper {
  display: flex;
  flex-direction: column;
  width: 100%;
  user-select: none;
}
[data-file-block] .bn-add-file-button {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px;
  border-radius: 4px;
  color: var(--color-gray-10);
  background: var(--color-gray-3);
  cursor: pointer;
}
[data-file-block] .bn-add-file-button:hover, [data-file-block] .bn-file-name-with-icon:hover {
  background: var(--color-gray-4);
}
[data-file-block] .bn-add-file-button-icon, [data-file-block] .bn-file-icon {
  width: 24px;
  height: 24px;
}
[data-file-block] .bn-add-file-button-text {
  font-size: 0.9rem;
}
[data-file-block] .bn-file-name-with-icon {
  display: flex;
  align-items: center;
  gap: 4px;
  padding: 4px;
  border-radius: 4px;
}
[data-file-block] .bn-file-caption {
  font-size: 0.8em;
  padding-block: 4px;
  word-break: break-word;
}
[data-file-block] .bn-visual-media-wrapper {
  display: flex;
  align-items: center;
  max-width: 100%;
  position: relative;
}
[data-file-block] .bn-visual-media {
  border-radius: 4px;
  width: 100%;
  max-width: 100%;
}
[data-file-block] .bn-audio {
  width: 100%;
}
.bn-unknown-block {
  font-size: 0.75rem;
  color: var(--color-gray-9);
  border: 1px dashed var(--color-gray-6);
  padding: 4px 8px;
  border-radius: 4px;
}
[data-content-type="table"] .tableWrapper {
  overflow-x: auto;
  width: 100%;
  padding: 4px 0;
}
.bn-editor table {
  border-collapse: collapse;
  table-layout: fixed;
  width: auto;
  word-break: break-word;
}
.bn-editor th, .bn-editor td {
  border: 1px solid var(--color-gray-6);
  padding: 5px 10px;
  vertical-align: top;
  min-width: 120px;
  position: relative;
  box-sizing: border-box;
}
.bn-editor th {
  text-align: left;
  font-weight: 700;
  background: var(--color-gray-2);
}
.bn-editor th > p, .bn-editor td > p {
  min-height: 1.5rem;
}
.bn-side-menu {
  user-select: none;
}
[data-editor-side-drag] {
  cursor: grab;
}
.bn-editor:focus-visible {
  outline: none;
}
@property --tw-translate-x {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}
@property --tw-translate-y {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}
@property --tw-translate-z {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}
@property --tw-rotate-x {
  syntax: "*";
  inherits: false;
}
@property --tw-rotate-y {
  syntax: "*";
  inherits: false;
}
@property --tw-rotate-z {
  syntax: "*";
  inherits: false;
}
@property --tw-skew-x {
  syntax: "*";
  inherits: false;
}
@property --tw-skew-y {
  syntax: "*";
  inherits: false;
}
@property --tw-space-y-reverse {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}
@property --tw-divide-y-reverse {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}
@property --tw-border-style {
  syntax: "*";
  inherits: false;
  initial-value: solid;
}
@property --tw-leading {
  syntax: "*";
  inherits: false;
}
@property --tw-font-weight {
  syntax: "*";
  inherits: false;
}
@property --tw-tracking {
  syntax: "*";
  inherits: false;
}
@property --tw-ordinal {
  syntax: "*";
  inherits: false;
}
@property --tw-slashed-zero {
  syntax: "*";
  inherits: false;
}
@property --tw-numeric-figure {
  syntax: "*";
  inherits: false;
}
@property --tw-numeric-spacing {
  syntax: "*";
  inherits: false;
}
@property --tw-numeric-fraction {
  syntax: "*";
  inherits: false;
}
@property --tw-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}
@property --tw-shadow-color {
  syntax: "*";
  inherits: false;
}
@property --tw-shadow-alpha {
  syntax: "<percentage>";
  inherits: false;
  initial-value: 100%;
}
@property --tw-inset-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}
@property --tw-inset-shadow-color {
  syntax: "*";
  inherits: false;
}
@property --tw-inset-shadow-alpha {
  syntax: "<percentage>";
  inherits: false;
  initial-value: 100%;
}
@property --tw-ring-color {
  syntax: "*";
  inherits: false;
}
@property --tw-ring-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}
@property --tw-inset-ring-color {
  syntax: "*";
  inherits: false;
}
@property --tw-inset-ring-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}
@property --tw-ring-inset {
  syntax: "*";
  inherits: false;
}
@property --tw-ring-offset-width {
  syntax: "<length>";
  inherits: false;
  initial-value: 0px;
}
@property --tw-ring-offset-color {
  syntax: "*";
  inherits: false;
  initial-value: #fff;
}
@property --tw-ring-offset-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}
@property --tw-outline-style {
  syntax: "*";
  inherits: false;
  initial-value: solid;
}
@property --tw-blur {
  syntax: "*";
  inherits: false;
}
@property --tw-brightness {
  syntax: "*";
  inherits: false;
}
@property --tw-contrast {
  syntax: "*";
  inherits: false;
}
@property --tw-grayscale {
  syntax: "*";
  inherits: false;
}
@property --tw-hue-rotate {
  syntax: "*";
  inherits: false;
}
@property --tw-invert {
  syntax: "*";
  inherits: false;
}
@property --tw-opacity {
  syntax: "*";
  inherits: false;
}
@property --tw-saturate {
  syntax: "*";
  inherits: false;
}
@property --tw-sepia {
  syntax: "*";
  inherits: false;
}
@property --tw-drop-shadow {
  syntax: "*";
  inherits: false;
}
@property --tw-drop-shadow-color {
  syntax: "*";
  inherits: false;
}
@property --tw-drop-shadow-alpha {
  syntax: "<percentage>";
  inherits: false;
  initial-value: 100%;
}
@property --tw-drop-shadow-size {
  syntax: "*";
  inherits: false;
}
@property --tw-duration {
  syntax: "*";
  inherits: false;
}
@property --tw-ease {
  syntax: "*";
  inherits: false;
}
@property --tw-scale-x {
  syntax: "*";
  inherits: false;
  initial-value: 1;
}
@property --tw-scale-y {
  syntax: "*";
  inherits: false;
  initial-value: 1;
}
@property --tw-scale-z {
  syntax: "*";
  inherits: false;
  initial-value: 1;
}
@keyframes spin {
  to {
    transform: rotate(360deg);
  }
}
@keyframes pulse {
  50% {
    opacity: 0.5;
  }
}
@layer properties {
  @supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) {
    *, ::before, ::after, ::backdrop {
      --tw-translate-x: 0;
      --tw-translate-y: 0;
      --tw-translate-z: 0;
      --tw-rotate-x: initial;
      --tw-rotate-y: initial;
      --tw-rotate-z: initial;
      --tw-skew-x: initial;
      --tw-skew-y: initial;
      --tw-space-y-reverse: 0;
      --tw-divide-y-reverse: 0;
      --tw-border-style: solid;
      --tw-leading: initial;
      --tw-font-weight: initial;
      --tw-tracking: initial;
      --tw-ordinal: initial;
      --tw-slashed-zero: initial;
      --tw-numeric-figure: initial;
      --tw-numeric-spacing: initial;
      --tw-numeric-fraction: initial;
      --tw-shadow: 0 0 #0000;
      --tw-shadow-color: initial;
      --tw-shadow-alpha: 100%;
      --tw-inset-shadow: 0 0 #0000;
      --tw-inset-shadow-color: initial;
      --tw-inset-shadow-alpha: 100%;
      --tw-ring-color: initial;
      --tw-ring-shadow: 0 0 #0000;
      --tw-inset-ring-color: initial;
      --tw-inset-ring-shadow: 0 0 #0000;
      --tw-ring-inset: initial;
      --tw-ring-offset-width: 0px;
      --tw-ring-offset-color: #fff;
      --tw-ring-offset-shadow: 0 0 #0000;
      --tw-outline-style: solid;
      --tw-blur: initial;
      --tw-brightness: initial;
      --tw-contrast: initial;
      --tw-grayscale: initial;
      --tw-hue-rotate: initial;
      --tw-invert: initial;
      --tw-opacity: initial;
      --tw-saturate: initial;
      --tw-sepia: initial;
      --tw-drop-shadow: initial;
      --tw-drop-shadow-color: initial;
      --tw-drop-shadow-alpha: 100%;
      --tw-drop-shadow-size: initial;
      --tw-duration: initial;
      --tw-ease: initial;
      --tw-scale-x: 1;
      --tw-scale-y: 1;
      --tw-scale-z: 1;
    }
  }
}

/* Escouade navigation: one visual language, independent of object tag colours. */
aside[data-nav-width] { border-right: 1px solid var(--color-gray-5); }
aside[data-nav-width] :is(a.group, details[data-nav-folder] > summary) {
  position: relative;
  min-height: 33px;
  height: auto;
  padding-block: 7px;
  border-radius: 5px;
  letter-spacing: -.01em;
  gap: 10px;
}
aside[data-nav-width] :is(a.group, details[data-nav-folder] > summary):hover {
  background: var(--color-gray-3);
}
aside[data-nav-width] span[style]:has(> svg) {
  color: inherit !important;
  background-color: transparent !important;
  border-color: transparent !important;
  border-radius: 0;
}
aside[data-nav-width] :is(a.group, details[data-nav-folder] > summary):focus-visible {
  outline: 2px solid var(--color-accent-9);
  outline-offset: 2px;
}
aside[data-nav-width] > .flex-1 { padding-inline: 12px; }
#app-main { border-top: 0; border-top-left-radius: 0; }

/* Anchor the grip and keep navigation menus above page toolbars, below modal overlays (50). */
@media (min-width: 48rem) {
  aside[data-nav-width] { position: relative; z-index: 40; }
}
[data-island="nav-resize"] { touch-action: none; }
[data-island="nav-resize"]:focus-visible {
  background: var(--color-accent-8);
  outline: 2px solid var(--color-accent-9);
}
aside[data-nav-resizing] { transition: none; }
body:has(aside[data-nav-resizing]) { cursor: col-resize; user-select: none; }
/* The 50px rail needs its own spacing: expanded padding squeezes the active item. */
aside[data-nav-width="50"] > .flex-1 { padding-inline: 5px; }
aside[data-nav-width="50"] a.group {
  width: 32px;
  height: 32px;
  min-height: 32px;
  margin-inline: auto;
  padding: 0;
  gap: 0;
  justify-content: center;
  border-radius: 8px;
}
aside[data-nav-width="50"] a.group.bg-gray-4 {
  box-shadow: none;
}
/* Identité B : l'action principale est à l'encre (--btn-bg), jamais verte ;
   son texte est le papier (--btn-ink), dans les deux thèmes. */
:is(button, a, input, [role="button"], [aria-disabled="true"]).bg-accent-9.text-white,
:is(button, a, input, [role="button"], [aria-disabled="true"]).bg-accent-9\/60.text-white {
  --color-accent-9: var(--btn-bg);
  --color-accent-10: color-mix(in srgb, var(--btn-bg) 84%, var(--paper));
  color: var(--btn-ink);
}
/* Object glyphs stand alone across page headers, lists and settings. */
[style*="--obj-"]:has(> svg) {
  background-color: transparent !important;
  border-color: transparent !important;
}
/* The model diagram is a workspace, rather than a narrow settings form. */
html, [class*="overflow-y-auto"], .ged-workbench, .settings-modal-scroll { scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) { html, [class*="overflow-y-auto"], .ged-workbench, .settings-modal-scroll { scroll-behavior: auto; } }
.sidebar-chat-entry { display: flex; min-height: 34px; align-items: center; gap: 8px; margin: 0; border-radius: 5px; padding: 0 8px; color: var(--color-gray-11); font-size: 13px; font-weight: 500; }
.sidebar-chat-entry:hover { background: var(--color-gray-3); color: var(--color-gray-12); }
.sidebar-chat-entry[aria-current="page"] { background: var(--color-gray-4); color: var(--color-gray-12); }
.sidebar-chat-entry.collapsed { justify-content: center; padding: 0; }
.sidebar-primary { margin-top: 0; }
aside[data-nav-width="50"] .sidebar-top-controls { padding-bottom: 4px; }
aside[data-nav-width="50"] .sidebar-chat-entry.collapsed { width: 32px; height: 32px; min-height: 32px; margin-inline: auto; border-radius: 8px; }
aside[data-nav-width="50"] .sidebar-primary { display: flex; flex-direction: column; gap: 4px; }
aside[data-nav-width="50"] .sidebar-primary a.group { height: 32px; min-height: 32px; padding-block: 0; border-radius: 8px; }
aside[data-nav-width="50"] [data-action="open-command-menu"] { margin-top: 12px; }
.sidebar-expanded-nav { margin-left: -2px; width: calc(100% + 2px); }
#app-main [data-action="toggle-nav"] { display: none; }
aside[data-nav-width] .sidebar-primary details[data-nav-folder] > summary { min-height: 36px; font-size: 13px; font-weight: 500; }
aside[data-nav-width] .sidebar-primary details[data-nav-folder] > summary.bg-gray-4 { background: var(--color-gray-4); color: var(--color-gray-12); box-shadow: none; }
aside[data-nav-width] .sidebar-primary details[data-nav-folder] > summary.bg-gray-4 svg { color: currentColor; }
aside[data-nav-width] .sidebar-primary a.group.bg-gray-4 { background: var(--color-gray-4); color: var(--color-gray-12); box-shadow: none; }
aside[data-nav-width] .sidebar-primary a.group.bg-gray-4 svg { color: currentColor; }
.sidebar-rail-section { display: flex; height: 36px; align-items: center; justify-content: center; margin: 8px 4px 0; border-radius: 8px; color: var(--color-gray-10); }
aside[data-nav-width="50"] .sidebar-rail-section { width: 32px; height: 32px; margin: 4px auto 0; }
aside[data-nav-width="50"] :is(.sidebar-top-controls, .sidebar-primary, .sidebar-rail-section) svg { transform: scale(1.1); }
aside[data-nav-width="50"] > nav { overflow: visible; }
aside[data-nav-width="50"] [data-tooltip] { position: relative; }
aside[data-nav-width="50"] [data-tooltip]::after {
  content: attr(data-tooltip);
  position: absolute;
  z-index: 60;
  top: 50%;
  left: calc(100% + 8px);
  transform: translateY(-50%);
  width: max-content;
  max-width: 240px;
  padding: 6px 9px;
  border: 1px solid var(--color-gray-5);
  border-radius: 8px;
  background: var(--color-gray-2);
  box-shadow: 0 5px 15px #0002;
  color: var(--color-gray-12);
  font-size: 12px;
  font-weight: 500;
  line-height: 1.25;
  opacity: 0;
  pointer-events: none;
  visibility: hidden;
  white-space: normal;
}
aside[data-nav-width="50"] [data-tooltip]:is(:hover, :focus-visible)::after { opacity: 1; visibility: visible; }
aside[data-nav-width="50"] .sidebar-account-trigger:hover { filter: brightness(.9); }
.sidebar-rail-section:hover { background: var(--color-gray-4); color: var(--color-gray-12); }
.workspace-section-heading { display: flex; min-height: 29px; align-items: center; gap: 4px; margin-top: 10px; padding: 0 8px; cursor: pointer; list-style: none; border-radius: 5px; color: var(--color-gray-9); font-size: 13px; font-weight: 600; }
.workspace-section-heading:hover, .workspace-section-heading:focus-visible { background: var(--color-gray-3); color: var(--color-gray-11); }
.workspace-section-heading::-webkit-details-marker { display: none; }
.workspace-section-caret { display: flex; opacity: 0; transition: transform .15s, opacity .15s; }
.workspace-section-heading:hover .workspace-section-caret, .workspace-section-heading:focus-visible .workspace-section-caret { opacity: 1; }
details[open] > .workspace-section-heading .workspace-section-caret { transform: rotate(90deg); }
.sidebar-chats { margin-top: 7px; }
.sidebar-chats-heading { display: flex; align-items: center; gap: 4px; min-height: 29px; padding: 0 8px; cursor: pointer; list-style: none; border-radius: 5px; color: var(--color-gray-9); font-size: 13px; font-weight: 600; }
.sidebar-chats-heading:hover, .sidebar-chats-heading:focus-visible { background: var(--color-gray-3); color: var(--color-gray-11); }
.sidebar-chats-heading::-webkit-details-marker, .sidebar-chats-more summary::-webkit-details-marker { display: none; }
.sidebar-chats-caret { display: flex; opacity: 0; transition: transform .15s, opacity .15s; }
.sidebar-chats-heading:hover .sidebar-chats-caret, .sidebar-chats-heading:focus-visible .sidebar-chats-caret { opacity: 1; }
.sidebar-chats[open] .sidebar-chats-caret { transform: rotate(90deg); }
.sidebar-chats-list { padding: 0 4px 10px; }
.sidebar-chat-row { position: relative; min-height: 32px; border-radius: 8px; }
.sidebar-chat-row:hover, .sidebar-chat-row:focus-within { background: var(--color-gray-4); }
.sidebar-chat-link { display: flex; min-width: 0; align-items: center; gap: 8px; padding: 7px 8px; border-radius: 8px; color: var(--color-gray-11); font-size: 12px; font-weight: 500; white-space: nowrap; }
.sidebar-chat-title { min-width: 0; flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sidebar-chat-pinned { display: inline-flex; flex: none; color: var(--color-gray-9); }
.sidebar-chat-origine { flex: none; max-width: 45%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--color-gray-9); font-size: 11px; font-weight: 400; }
.sidebar-chat-row:hover .sidebar-chat-link, .sidebar-chat-row:focus-within .sidebar-chat-link { padding-right: 61px; color: var(--color-gray-12); }
.sidebar-chat-actions { position: absolute; top: 3px; right: 4px; display: flex; gap: 2px; opacity: 0; pointer-events: none; }
.sidebar-chat-row:hover .sidebar-chat-actions, .sidebar-chat-row:focus-within .sidebar-chat-actions { opacity: 1; pointer-events: auto; }
.sidebar-chat-action { display: flex; width: 25px; height: 25px; align-items: center; justify-content: center; border-radius: 6px; color: var(--color-gray-9); }
.sidebar-chat-action:hover, .sidebar-chat-action:focus-visible { background: var(--color-gray-5); color: var(--color-gray-12); }
.sidebar-chat-action.pinned { color: var(--color-gray-11); }
.sidebar-chat-menu[popover] { position: fixed; inset: auto; z-index: 100; width: 240px; max-width: calc(100vw - 16px); margin: 0; padding: 7px; border: 1px solid var(--color-gray-5); border-radius: 14px; background: var(--color-gray-2); box-shadow: 0 14px 36px rgb(0 0 0 / 22%); color: var(--color-gray-12); }
.sidebar-chat-menu-item { display: flex; width: 100%; min-height: 33px; align-items: center; gap: 11px; border-radius: 7px; padding: 6px 9px; color: var(--color-gray-11); font-size: 13px; font-weight: 500; text-align: left; }
.sidebar-chat-menu-item:hover, .sidebar-chat-menu-item:focus-visible { background: var(--color-gray-4); color: var(--color-gray-12); }
.sidebar-chat-menu-item.danger { color: #d95358; }
.sidebar-chat-menu-separator { height: 1px; margin: 6px 4px; background: var(--color-gray-5); }
.sidebar-chat-rename summary { cursor: pointer; list-style: none; }
.sidebar-chat-rename summary::-webkit-details-marker { display: none; }
.sidebar-chat-rename-form { display: flex; gap: 5px; padding: 4px 7px 7px; }
.sidebar-chat-rename-form input { width: 0; min-width: 0; flex: 1; border: 1px solid var(--color-gray-6); border-radius: 6px; padding: 5px 7px; background: var(--color-gray-1); font-size: 12px; }
.sidebar-chat-rename-form button { border-radius: 6px; padding: 5px 8px; background: var(--color-gray-4); font-size: 12px; }
.sidebar-chat-tooltip { position: fixed; z-index: 101; max-width: min(420px, calc(100vw - 16px)); border: 1px solid var(--color-gray-5); border-radius: 7px; padding: 5px 8px; background: var(--color-gray-3); box-shadow: 0 6px 18px rgb(0 0 0 / 15%); color: var(--color-gray-12); font-size: 12px; white-space: nowrap; pointer-events: none; }
.sidebar-chats-empty { padding: 6px 8px; color: var(--color-gray-9); font-size: 12px; }
.sidebar-chats-more summary { padding: 8px; cursor: pointer; color: var(--color-gray-10); font-size: 12px; font-weight: 600; list-style: none; border-radius: 8px; }
.sidebar-chats-more summary:hover { color: var(--color-gray-12); background: var(--color-gray-4); }
.plugin-modal-layer { position: fixed; inset: 0; z-index: 60; display: grid; place-items: center; padding: 20px; pointer-events: none; }
.plugin-modal-backdrop { position: absolute; inset: 0; background: rgb(16 20 18 / 48%); backdrop-filter: blur(2px); pointer-events: auto; }
.plugin-modal-panel { position: relative; display: flex; width: min(1000px, 100%); height: min(760px, calc(100dvh - 40px)); min-height: 0; flex-direction: column; overflow: hidden; border: 1px solid var(--color-gray-5); border-radius: 22px; background: var(--color-gray-1); box-shadow: 0 24px 64px rgb(0 0 0 / 20%); pointer-events: auto; }
.plugin-modal-header { display: flex; min-height: 72px; align-items: center; gap: 12px; padding: 16px 26px; }
.plugin-tabs { display: flex; align-items: center; gap: 4px; margin-right: auto; }
.plugin-tabs a { border-radius: 100px; padding: 8px 14px; color: var(--color-gray-10); font-size: 14px; }
.plugin-tabs a:hover, .plugin-tabs a.active { background: var(--color-gray-4); color: var(--color-gray-12); }
.plugin-tabs a.active { font-weight: 600; }
.plugin-search { display: flex; width: 225px; height: 34px; align-items: center; gap: 8px; border: 1px solid var(--color-gray-5); border-radius: 100px; padding: 0 11px; color: var(--color-gray-9); }
.plugin-search:focus-within { border-color: var(--color-accent-8); }
.plugin-search input { width: 100%; min-width: 0; border: 0; outline: 0; background: transparent; color: var(--color-gray-12); font-size: 14px; }
.plugin-new-button, .plugin-primary-action { display: inline-flex; min-height: 34px; align-items: center; justify-content: center; border-radius: 100px; padding: 0 14px; background: var(--color-gray-12); color: var(--color-gray-1); font-size: 13px; font-weight: 600; white-space: nowrap; }
.plugin-new-button:hover, .plugin-primary-action:hover { opacity: .8; }
.plugin-modal-close { display: flex; width: 30px; height: 30px; align-items: center; justify-content: center; border-radius: 7px; color: var(--color-gray-10); }
.plugin-modal-close:hover { background: var(--color-gray-3); }
.plugin-modal-scroll { min-height: 0; flex: 1; overflow: auto; padding: 10px 30px 34px; scrollbar-gutter: stable; }
.plugin-modal-scroll h2 { margin: 12px 0 16px; font-size: 14px; font-weight: 650; color: var(--color-gray-12); }
.plugin-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px 28px; }
.plugin-row { display: flex; min-width: 0; min-height: 65px; align-items: center; gap: 12px; border-radius: 9px; padding: 8px 5px; color: var(--color-gray-12); }
[data-plugin-row][hidden] { display: none !important; }
.plugin-skill-row:hover { background: var(--color-gray-3); }
.plugin-icon { display: flex; width: 32px; height: 32px; flex: none; align-items: center; justify-content: center; color: var(--color-accent-11); }
.plugin-row-copy { display: flex; min-width: 0; flex: 1; flex-direction: column; gap: 3px; }
.plugin-row-copy strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 14px; font-weight: 600; }
.plugin-row-copy small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--color-gray-9); font-size: 13px; }
.plugin-row-action { flex: none; border-radius: 100px; background: var(--color-gray-3); padding: 5px 11px; color: var(--color-gray-12); font-size: 12px; font-weight: 600; }
.plugin-row-action:hover { background: var(--color-gray-4); }
.plugin-row-unavailable { color: var(--color-gray-8); font-size: 12px; }
.plugin-detail-layer { position: absolute; inset: 0; z-index: 2; display: grid; place-items: center; padding: 16px; pointer-events: none; }
.plugin-detail-backdrop { position: absolute; inset: 0; background: rgb(0 0 0 / 48%); backdrop-filter: blur(3px); pointer-events: auto; }
.plugin-detail-card { position: relative; width: min(510px, 100%); max-height: calc(100dvh - 48px); overflow: auto; border: 1px solid var(--color-gray-5); border-radius: 17px; background: var(--color-gray-1); padding: 20px; box-shadow: 0 20px 50px rgb(0 0 0 / 25%); pointer-events: auto; }
.plugin-detail-card > h2 { margin-bottom: 16px; font-size: 16px; font-weight: 600; }
.plugin-detail-header { display: flex; align-items: center; gap: 10px; }
.plugin-detail-description { margin: 18px 0; color: var(--color-gray-10); font-size: 14px; line-height: 1.5; }
.plugin-detail-info { display: grid; gap: 14px; border: 1px solid var(--color-gray-5); border-radius: 12px; padding: 16px; }
.plugin-detail-info > div { display: flex; align-items: flex-start; gap: 10px; color: var(--color-gray-10); font-size: 13px; line-height: 1.5; }
.plugin-detail-info svg { flex: none; color: var(--color-gray-11); }
.plugin-detail-close { display: inline-block; margin-top: 18px; color: var(--color-gray-10); font-size: 13px; text-decoration: underline; }
.plugin-picker { display: grid; gap: 6px; }
.plugin-picker a { display: flex; align-items: center; gap: 10px; border-radius: 8px; padding: 9px; font-size: 14px; }
.plugin-picker a:hover { background: var(--color-gray-3); }
@media (max-width: 700px) {
  .plugin-modal-layer { padding: 0; }
  .plugin-modal-panel { width: 100%; height: 100dvh; border: 0; border-radius: 0; }
  .plugin-modal-header { flex-wrap: wrap; gap: 8px; padding: 12px 16px; }
  .plugin-tabs { width: calc(100% - 40px); }
  .plugin-search { flex: 1; }
  .plugin-modal-close { order: 0; margin-left: auto; }
  .plugin-modal-scroll { padding: 8px 16px 24px; }
  .plugin-grid { grid-template-columns: 1fr; }
}
.settings-modal-layer { position: fixed; inset: 0; z-index: 60; display: grid; place-items: center; padding: 12px; pointer-events: none; }
.settings-modal-backdrop { position: absolute; inset: 0; background: rgb(20 24 22 / 45%); backdrop-filter: blur(2px); pointer-events: auto; }
.settings-modal-panel { position: relative; display: flex; width: min(1152px, 100%); height: min(880px, calc(100dvh - 24px)); min-height: 0; overflow: hidden; border: 1px solid var(--color-gray-5); border-radius: 14px; background: var(--color-gray-1); box-shadow: 0 20px 60px rgb(0 0 0 / 18%); pointer-events: auto; }
.settings-modal-sidebar { display: flex; width: 216px; min-width: 216px; flex-direction: column; overflow: hidden; border-right: 1px solid var(--color-gray-5); background: var(--color-gray-1); }
.settings-modal-search { display: flex; align-items: center; gap: 8px; height: 36px; margin: 14px 14px 12px; padding: 0 9px; border: 1px solid var(--color-gray-5); border-radius: 9px; color: var(--color-gray-9); }
.settings-modal-search:focus-within { border-color: var(--color-accent-8); }
.settings-modal-search-input { width: 100%; min-width: 0; border: 0; outline: 0; background: transparent; color: var(--color-gray-12); font-size: 14px; }
.settings-modal-content { display: flex; min-width: 0; flex: 1; flex-direction: column; overflow: hidden; background: var(--color-gray-1); }
.settings-modal-header { display: flex; height: 56px; min-height: 56px; align-items: center; justify-content: flex-end; padding: 0 16px; }
.settings-modal-close { display: flex; width: 30px; height: 30px; align-items: center; justify-content: center; border-radius: 7px; color: var(--color-gray-11); }
.settings-modal-close:hover { background: var(--color-gray-3); color: var(--color-gray-12); }
.settings-modal-scroll { min-height: 0; flex: 1; overflow: auto; overscroll-behavior: contain; scrollbar-gutter: stable; }
.settings-modal-scroll [data-settings-content] { max-width: none; padding-inline: 28px; }
[data-settings-nav-link][hidden], [data-settings-nav-group][hidden] { display: none !important; }
@media (max-width: 700px) {
  .settings-modal-layer { padding: 0; }
  .settings-modal-panel { width: 100%; height: 100dvh; flex-direction: column; border: 0; border-radius: 0; }
  .settings-modal-sidebar { width: 100%; min-width: 0; max-height: 200px; border-right: 0; border-bottom: 1px solid var(--color-gray-5); }
  .settings-modal-search { flex-shrink: 0; margin: 8px 12px; }
  .settings-modal-header { height: 44px; min-height: 44px; }
  .settings-modal-scroll [data-settings-content] { padding-inline: 16px; }
}
[data-settings-page="/settings/objects/overview"] [data-settings-scroll] { overflow: hidden; }
[data-settings-page="/settings/objects/overview"] [data-settings-content] {
  max-width: none; padding: 0; height: 100%;
}
[data-settings-page="/settings/objects/overview"] [data-settings-content] > .space-y-8 { height: 100%; }
.model-overview { display: flex; flex-direction: column; height: 100%; min-height: 0; }
.model-overview-toolbar {
  display: flex; align-items: center; justify-content: space-between; gap: 16px;
  padding: 12px 20px; border-bottom: 1px solid var(--color-gray-5); flex-shrink: 0;
  font-size: 13px; color: var(--color-gray-11);
}
/* Couleurs posées par escouade-b.css (principal à l'encre) : plus de citron ici. */
.model-overview-link { padding: 6px 12px; border-radius: 6px; font-weight: 600; }
.model-overview-directory { padding: 10px 20px; border-bottom: 1px solid var(--color-gray-5); flex-shrink: 0; font-size: 13px; }
.model-overview-directory summary { cursor: pointer; color: var(--color-gray-11); }
.model-overview-directory nav { display: flex; flex-wrap: wrap; gap: 6px; max-height: 140px; overflow: auto; padding-top: 10px; }
.model-overview-directory a { padding: 5px 10px; border: 1px solid var(--color-gray-5); border-radius: 6px; }
.model-overview-directory a:hover { background: var(--color-gray-3); }
.model-overview-viewport { flex: 1; min-height: 0; overflow: auto; overscroll-behavior: contain; scrollbar-gutter: stable; }
.model-overview-canvas { position: relative; margin-inline: auto; }
.model-object-card { scroll-margin: 24px; }
.model-object-card:target { outline: 3px solid var(--color-accent-8); outline-offset: 4px; }
.model-object-card > a:hover { background: var(--color-gray-3); color: var(--color-gray-12); }
.model-overview a:focus-visible, .model-overview summary:focus-visible, .model-overview-viewport:focus-visible { outline: 2px solid var(--color-accent-8); outline-offset: 2px; }
/* GED search workspace */
.ged-workbench{height:100%;min-height:0;overflow:auto;background:#f6f7f3;color:#20372e;padding:28px 30px;font-size:13px}
.ged-hero{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:24px}.ged-eyebrow{font-size:10px;font-weight:700;letter-spacing:.16em;color:#788373}.ged-hero h1{font-size:29px;font-weight:600;letter-spacing:-1px;line-height:1.3;margin:7px 0}.ged-hero p{color:#737c71;font-size:13px}
.ged-button{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:36px;border:1px solid #dbe0d2;border-radius:7px;background:#fff;padding:8px 12px;font-size:12px;font-weight:600;cursor:pointer;white-space:nowrap;color:#263d31}.ged-button:hover{background:#eef2e6}.ged-primary{background:#203d30;color:#fff;border-color:#203d30}.ged-primary:hover{background:#31543f;color:#fff}
.ged-query{display:flex;align-items:center;gap:14px;background:#fff;border:1px solid #d7ddcd;border-radius:12px;padding:10px 12px 10px 18px;box-shadow:0 3px 14px #263d3105;margin-bottom:26px}.ged-query>input{flex:1;min-width:0;border:0;background:none;font-size:15px;outline:none}.ged-query:focus-within{outline:2px solid #8ea65c;outline-offset:2px}.ged-query .ged-button{padding:11px 22px}
.ged-columns{display:grid;grid-template-columns:210px minmax(300px,1fr) 292px;gap:24px;align-items:start}.ged-section-heading{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:18px}.ged-section-heading h2{font-size:13px;font-weight:650}.ged-section-heading>span,.ged-section-heading>a{font-size:11px;color:#7b8476}.ged-filters{padding:7px 0}.ged-filters>label,.ged-chat-form label{display:block;font-size:11px;font-weight:600;margin:18px 0 7px;color:#66705f}.ged-filters select,.ged-chat-form select,.ged-chat-form input,.ged-chat-form textarea{display:block;width:100%;min-width:0;background:#fff;border:1px solid #dce1d4;border-radius:6px;padding:9px;font-size:12px;color:#263d31}.ged-filters>.ged-button{width:100%;margin-top:16px}.ged-filter-note{border-top:1px solid #dce1d4;margin-top:26px;padding-top:24px;color:#808975;line-height:1.7}.ged-filter-note h3{font-weight:600;color:#43513d;margin:9px 0}.ged-filter-note p{font-size:11px}.ged-filter-note a{display:block;margin-top:12px;font-size:11px;color:#375638}
.ged-results{min-width:0;padding-top:7px}.ged-bundle{display:flex;align-items:center;flex-wrap:wrap;gap:7px;margin-bottom:15px;padding:12px;background:#ecefe4;border-radius:8px}.ged-bundle p{width:100%;font-size:11px;color:#70785e}.ged-bundle .ged-button{font-size:10px;min-height:31px;padding:6px 9px}.ged-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,260px),1fr));gap:14px}.ged-card{display:flex;flex-direction:column;min-width:0;background:#fff;border:1px solid #e0e4d8;border-radius:10px;padding:18px;transition:box-shadow .15s,border-color .15s}.ged-card:hover{border-color:#aabd89;box-shadow:0 5px 18px #2f432a09}.ged-card:has(input:checked){border-color:#68893c;background:#fcfff5;box-shadow:0 0 0 1px #68893c}.ged-card-top{display:flex;align-items:center;gap:10px;margin-bottom:16px}.ged-file-icon{display:grid;place-items:center;width:38px;height:42px;border-radius:7px;background:#eff2e8;color:#63794f}.ged-tag{padding:3px 7px;border-radius:4px;background:#f0f3e9;font-size:10px;color:#65754f;max-width:70%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ged-check{margin-left:auto;display:grid;place-items:center;padding:5px}.ged-check input{width:15px;height:15px;accent-color:#526e33}.ged-card h3{font-size:14px;font-weight:600;line-height:1.5;overflow-wrap:anywhere}.ged-card h3 a:hover{text-decoration:underline}.ged-card-meta{display:flex;flex-wrap:wrap;gap:6px;color:#8c9283;font-size:10px;margin:8px 0 14px}.ged-excerpt{font-size:12px;line-height:1.75;color:#67715d;display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden;margin-bottom:18px}.ged-excerpt mark{background:#edf3bd;color:#3f512a}.ged-muted{color:#8b927e;font-size:11px;line-height:1.65}.ged-card footer{margin-top:auto;padding-top:13px;border-top:1px solid #edf0e7;display:flex;justify-content:space-between;gap:12px;font-size:11px;color:#56703f}.ged-error{padding:15px;border-radius:8px;border:1px solid #e5b7a8;background:#fff2ec;margin:15px 0}.ged-empty{padding:70px 20px;text-align:center;color:#7e886e}.ged-empty svg{margin:auto}.ged-empty h3{margin:14px;font-weight:600}
.ged-chat{border:1px solid #dce2d1;background:#fff;border-radius:12px;overflow:hidden;padding:19px;position:sticky;top:0}.ged-ai-badge{background:#eef4d6;padding:4px 7px;border-radius:4px;font-size:10px!important;color:#698045!important}.ged-chat-intro{margin-top:27px;color:#698055}.ged-chat-intro h3{font-size:14px;font-weight:600;margin:12px 0 8px;color:#304530}.ged-chat-intro p{font-size:12px;line-height:1.75;color:#8a917f}.ged-chat-form textarea{resize:vertical;line-height:1.6}.ged-analysis-settings{border:1px solid #e1e6d7;border-radius:7px;padding:10px;margin:14px 0}.ged-analysis-settings summary{cursor:pointer;font-size:11px;font-weight:600}.ged-analysis-settings a{display:block;font-size:11px;margin-top:12px;color:#5f783c}.ged-chat-form>.ged-button{width:100%;margin-top:12px}.ged-chat-footnote{font-size:10px;line-height:1.7;color:#939b86;border-top:1px solid #edf0e7;padding-top:17px;margin-top:20px}.ged-chat-answer{white-space:pre-wrap;font-size:12px;line-height:1.8;background:#f3f6eb;padding:12px;margin:14px 0;border-radius:8px;overflow-wrap:anywhere}.ged-answer-layout{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:20px;padding:24px;overflow:auto}.ged-answer-sources{min-width:0}
.ged-modal{position:fixed;inset:0;z-index:80;display:grid;place-items:center;padding:30px}.ged-modal-backdrop{position:absolute;inset:0;background:#14251b99;backdrop-filter:blur(3px)}.ged-modal-content{position:relative;display:flex;width:min(1120px,95vw);height:90vh;min-height:0;box-shadow:0 24px 80px #14251b40;border-radius:13px;overflow:hidden;background:#fff}.ged-modal-content [data-ged-preview]{width:100%;min-width:0;border:0}.ged-modal-content iframe{min-height:65vh;width:100%}.ged-modal-content [data-ged-preview]>header{padding:18px}.ged-workbench :is(a,button,input,select,textarea,summary):focus-visible{outline:2px solid #759648;outline-offset:3px}
@media(min-width:1600px){.ged-columns{grid-template-columns:220px minmax(300px,1fr) 320px;gap:28px}.ged-workbench{padding:34px 38px}.ged-cards{grid-template-columns:repeat(auto-fill,minmax(300px,1fr))}}
@media(max-width:1200px){.ged-columns{grid-template-columns:180px minmax(280px,1fr)}.ged-chat{grid-column:2;position:static}.ged-hero h1{font-size:25px}}
@media(max-width:760px){.ged-workbench{padding:18px 14px}.ged-hero{align-items:flex-start}.ged-hero h1{font-size:22px}.ged-hero> a{font-size:0;padding:9px}.ged-hero> a svg{width:17px}.ged-hero p{font-size:12px}.ged-columns{display:flex;flex-direction:column;gap:20px}.ged-filters,.ged-results,.ged-chat{width:100%}.ged-filters{display:grid;grid-template-columns:1fr 1fr;gap:8px 12px}.ged-filters>.ged-section-heading{grid-column:1/-1}.ged-filters>label{margin:0}.ged-filters>select{grid-column:2}.ged-filters>.ged-button{grid-column:1/-1;margin-top:4px}.ged-filter-note{display:none}.ged-query{gap:7px;padding-left:10px}.ged-query>input{font-size:12px}.ged-query .ged-button{padding:9px;font-size:11px}.ged-modal{padding:8px}.ged-modal-content{width:100%;height:96vh}.ged-answer-layout{grid-template-columns:1fr}}

.ged-workbench{width:100%;flex:1;min-width:0}.ged-card h3 button{text-align:left;cursor:pointer}.ged-card footer button{cursor:pointer}.ged-card h3 button:hover,.ged-card footer button:hover{text-decoration:underline}.ged-viewer-file{display:flex;flex:1;min-width:0}.ged-viewer-excerpts{display:flex;width:300px;border-left:1px solid #dfe4d5;min-height:0;overflow:auto}.ged-viewer-excerpts iframe{display:none}.ged-modal-backdrop:focus-visible{outline:0}.ged-chat-transcript{max-height:260px;overflow:auto;font-size:11px;line-height:1.6;color:#637255}.ged-chat-transcript p{padding:8px;border-radius:6px;background:#f4f6ef;margin:5px 0}
@media(max-width:760px){.ged-modal-content{flex-direction:column}.ged-viewer-file{min-height:0;flex:1}.ged-viewer-excerpts{width:100%;max-height:28vh;border-left:0;border-top:1px solid #dfe4d5}.ged-modal-content iframe{min-height:40vh}}

.ged-breadcrumb{display:flex;align-items:center;gap:8px;margin-bottom:13px;font-size:11px}.ged-bundle-settings{width:100%;font-size:11px;margin-top:4px}.ged-bundle-settings summary{cursor:pointer;color:#5c7046}.ged-bundle-settings label{display:block;margin:12px 0 6px}.ged-bundle-settings textarea,.ged-bundle-settings input{width:100%;border:1px solid #d7dfcc;border-radius:6px;background:#fff;padding:8px}.ged-bundle-settings .ged-muted{margin-top:8px}.ged-chat-question{margin:14px 0 7px;background:#eaf0dc;padding:10px;border-radius:8px;font-size:12px;line-height:1.6}


.ged-chat-answer{white-space:normal;overflow-x:auto}.ged-chat-answer table{font-size:11px;min-width:100%;border-collapse:collapse}.ged-chat-answer td,.ged-chat-answer th{border:1px solid #dce4ce;padding:6px}.ged-source-passages{font-size:11px;line-height:1.7;margin-bottom:16px;color:#67715d}.ged-source-passages summary{cursor:pointer;color:#58743e}.ged-source-passages p{margin:8px 0;padding:8px;border-left:2px solid #c9d8b3;background:#f7f9f1}

.ged-table-wrap{overflow-x:auto;border:1px solid #e0e4d8;border-radius:10px;background:#fff}
.ged-table{width:100%;border-collapse:collapse;font-size:12px;color:#263d31}
.ged-table thead th{text-align:left;font-size:10px;font-weight:650;letter-spacing:.04em;color:#66705f;padding:9px 12px;border-bottom:1px solid #dce1d4;white-space:nowrap}
.ged-table tbody td{padding:10px 12px;border-bottom:1px solid #edf0e7;vertical-align:middle}
.ged-table tbody tr:last-child td{border-bottom:0}
.ged-table tbody tr:hover{background:#f6f8f1}
.ged-table-check{width:36px}
.ged-table thead th.ged-table-date,.ged-table tbody td.ged-table-date{text-align:right;white-space:nowrap;color:#808975}
.ged-table-title{display:inline-flex;align-items:center;gap:8px;color:#263d31;font-weight:550;background:none;border:0;padding:0;cursor:pointer;font-size:inherit;text-align:left;min-width:0;max-width:100%}
.ged-table-title span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ged-table-title:hover{text-decoration:underline}
.ged-table-title svg{color:#63794f;flex-shrink:0}
.ged-table-muted{color:#808975}
.ged-table .ged-check{display:inline-grid;place-items:center;padding:0}
.ged-table .ged-check input{width:15px;height:15px}
.ged-pagination{display:flex;align-items:center;justify-content:flex-end;gap:12px;padding:14px 0 4px;flex-wrap:wrap}
.ged-pagination-info{font-size:11px;color:#7b8476}
.ged-pagination-disabled{font-size:11px;color:#c3c9b6;padding:8px 12px}
@media(max-width:760px){.ged-table thead th.ged-col-optional,.ged-table tbody td.ged-col-optional{display:none}.ged-table tbody td,.ged-table thead th{padding:9px 8px}.ged-table-title{gap:6px}.ged-pagination{justify-content:center}}

/* — Mise en page empilée : recherche arrondie → filtres → tableau pleine largeur → chat ouvrable — */
.ged-query{border-radius:999px;padding:6px 6px 6px 18px}
.ged-query .ged-button{border-radius:999px;padding:10px 20px}
.ged-filters-bar{display:flex;flex-wrap:wrap;gap:12px;align-items:flex-end;padding:14px 16px;background:#fff;border:1px solid #dce1d4;border-radius:12px;margin-bottom:20px}
.ged-filter-field{display:flex;flex-direction:column;gap:5px;min-width:0}
.ged-filter-field label{font-size:10px;font-weight:600;color:#66705f;white-space:nowrap}
.ged-filter-field select{background:#fff;border:1px solid #dce1d4;border-radius:8px;padding:8px 10px;font-size:12px;color:#263d31;min-width:0}
.ged-filters-bar>.ged-button{align-self:flex-end;margin-left:auto}
.ged-results{min-width:0;padding-top:0}
.ged-chat-details{border:1px solid #dce2d1;background:#fff;border-radius:12px;margin-top:20px;overflow:hidden}
.ged-chat-summary{display:flex;align-items:center;gap:10px;padding:15px 19px;cursor:pointer;list-style:none;font-size:13px;font-weight:650;color:#263d31}
.ged-chat-summary::-webkit-details-marker{display:none}
.ged-chat-summary svg{color:#698055;flex-shrink:0}
.ged-chat-summary .ged-ai-badge{margin-left:auto}
.ged-chat{position:static;border:0;border-radius:0;padding:19px;background:transparent}
.ged-chat-details[open] .ged-chat{border-top:1px solid #edf0e7;background:#fff}
@media(max-width:760px){.ged-query{padding:5px 5px 5px 12px}.ged-query .ged-button{padding:9px 14px}.ged-filters-bar{gap:8px;padding:10px}.ged-filter-field{flex:1 1 42%}.ged-filter-field select{max-width:none}}

/* — Compactage du haut de page + menu « Colonnes » — */
.ged-workbench{padding-top:16px}
.ged-hero{margin-bottom:10px}
.ged-hero .ged-breadcrumb{margin-bottom:0}
.ged-query{margin-bottom:10px}
.ged-filters-bar{padding:10px 14px;margin-bottom:14px}
.ged-section-heading{margin-bottom:12px}
.ged-cols{position:relative;align-self:flex-end}
.ged-cols-summary{display:inline-flex;align-items:center;gap:6px;height:34px;padding:0 12px;border:1px solid #dbe0d2;border-radius:7px;background:#fff;font-size:12px;font-weight:600;color:#263d31;cursor:pointer;list-style:none}
.ged-cols-summary::-webkit-details-marker{display:none}
.ged-cols-summary svg{color:#788373}
.ged-cols-menu{position:absolute;right:0;z-index:10;margin-top:6px;min-width:150px;padding:6px;border:1px solid #dce1d4;border-radius:8px;background:#fff;box-shadow:0 8px 24px #263d3110}
.ged-cols-item{display:flex;align-items:center;gap:8px;padding:7px 9px;border-radius:6px;font-size:12px;color:#263d31;white-space:nowrap}
.ged-cols-item:hover{background:#f0f3e9}
.ged-cols-mark{width:14px;font-size:11px;color:#68893c;flex-shrink:0}
.ged-cols-off .ged-cols-mark{color:transparent}

/* — Assistant documentaire en panneau droit — */
.ged-hero-actions{display:flex;align-items:center;gap:8px}
.ged-chat-panel{position:fixed;top:0;right:0;bottom:0;width:400px;max-width:94vw;background:#fff;border-left:1px solid #dce2d1;box-shadow:-12px 0 40px #263d3118;z-index:45;display:flex;flex-direction:column;overflow:hidden}
.ged-chat-panel-head{display:flex;align-items:center;gap:10px;padding:15px 18px;border-bottom:1px solid #edf0e7;flex-shrink:0}
.ged-chat-panel-title{display:flex;align-items:center;gap:10px;font-size:14px;font-weight:650;color:#263d31}
.ged-chat-panel-title svg{color:#698055}
.ged-chat-close{margin-left:auto;display:grid;place-items:center;width:28px;height:28px;border-radius:6px;color:#8b927e;font-size:14px;flex-shrink:0}
.ged-chat-close:hover{background:#f0f3e9;color:#263d31}
.ged-chat-panel .ged-chat{flex:1;min-height:0;overflow:auto;border:0;border-radius:0;padding:19px;background:#fff;position:static}
@media(max-width:760px){.ged-chat-panel{width:100vw;max-width:100vw}}

/* — Un seul scroll vertical + tableau sans débordement horizontal — */
html:has(.ged-workbench){overflow:hidden}
.ged-workbench{height:auto}
.ged-table{table-layout:fixed}
.ged-table .ged-table-check{width:40px}
.ged-table th.ged-col-optional,.ged-table td.ged-col-optional{max-width:140px}
.ged-table th.ged-table-date,.ged-table td.ged-table-date{width:100px}
.ged-table th,.ged-table td{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.ged-table .ged-table-title{max-width:100%}

/* Bibliothèque : navigation compacte, grille et liste des mêmes documents. */
.ged-workbench{max-width:none;margin:0;padding:0;background:var(--color-gray-1);color:var(--color-gray-12)}
.ged-workbench-inner{width:min(1180px,100%);margin:0 auto;padding:42px 34px 70px}
.ged-hero{display:flex;align-items:center;justify-content:space-between;gap:18px;margin:0 0 24px}
.ged-library-tabs{display:flex;align-items:center;gap:4px;min-width:0;overflow-x:auto;scrollbar-width:none}
.ged-library-tabs a{flex:none;padding:8px 13px;border-radius:999px;color:var(--color-gray-10);font-size:13px;white-space:nowrap}
.ged-library-tabs a:hover{background:var(--color-gray-3);color:var(--color-gray-12)}
.ged-library-tabs a.active{background:var(--color-gray-4);color:var(--color-gray-12);font-weight:650}
.ged-hero-actions{display:flex;align-items:center;gap:6px;flex:none}
.ged-toolbar-menu{position:relative}
.ged-toolbar-menu>summary{display:grid;place-items:center;width:32px;height:32px;border-radius:8px;list-style:none;cursor:pointer;color:var(--color-gray-10)}
.ged-toolbar-menu>summary::-webkit-details-marker{display:none}
.ged-toolbar-menu>summary:hover,.ged-toolbar-menu[open]>summary{background:var(--color-gray-3);color:var(--color-gray-12)}
.ged-search-menu .ged-query{position:absolute;top:39px;right:0;z-index:20;width:min(470px,80vw);margin:0;padding:7px;background:var(--color-gray-2);border:1px solid var(--color-gray-5);border-radius:12px;box-shadow:0 12px 36px #0002}
.ged-search-menu .ged-query>input{color:var(--color-gray-12);font-size:13px;padding:0 9px}
.ged-search-menu .ged-query .ged-button{padding:8px 12px}
.ged-header-search{display:flex;align-items:center;gap:7px;width:220px;min-height:33px;padding:4px 9px;border:1px solid var(--color-gray-5);border-radius:999px;background:var(--color-gray-1);color:var(--color-gray-9)}
.ged-header-search:focus-within{border-color:var(--color-accent-8);box-shadow:0 0 0 2px var(--color-accent-3)}
.ged-header-search input{flex:1;min-width:0;border:0;background:transparent;color:var(--color-gray-12);font-size:12px;outline:0}
.ged-header-search input::-webkit-search-cancel-button{display:none}.ged-header-search a{display:grid;place-items:center;color:var(--color-gray-9)}.ged-header-search a:hover{color:var(--color-gray-12)}
.ged-display-panel{position:absolute;top:39px;right:0;z-index:21;display:flex;flex-direction:column;min-width:190px;padding:8px;background:var(--color-gray-2);border:1px solid var(--color-gray-5);border-radius:12px;box-shadow:0 12px 36px #0002}
.ged-menu-caption{padding:7px 9px 3px;color:var(--color-gray-9);font-size:11px}
.ged-display-panel a{padding:7px 9px;border-radius:6px;color:var(--color-gray-12);font-size:12px;white-space:nowrap}
.ged-display-panel a:hover,.ged-display-panel a[aria-current=true]{background:var(--color-gray-4)}
.ged-upload-button{position:relative;display:inline-flex;align-items:center;justify-content:center;min-height:33px;padding:7px 14px;border-radius:999px;background:var(--color-gray-12);color:var(--color-gray-1);font-size:12px;font-weight:600;cursor:pointer;white-space:nowrap}
.ged-upload-button:hover{opacity:.88}.ged-upload-button input{position:absolute;inset:0;opacity:0;width:100%;height:100%;cursor:pointer}
.ged-upload-status{margin:0 0 12px;padding:9px 12px;background:var(--color-accent-3);color:var(--color-accent-11);border-radius:8px;font-size:12px}
.ged-advanced-filters{position:relative;flex:none;margin:0}.ged-advanced-filters>summary{display:grid;place-items:center;width:32px;height:32px;cursor:pointer;color:var(--color-gray-10);list-style:none;border-radius:8px}.ged-advanced-filters>summary:hover,.ged-advanced-filters[open]>summary{background:var(--color-gray-3);color:var(--color-gray-12)}.ged-advanced-filters>summary::-webkit-details-marker{display:none}.ged-advanced-filters>.ged-filters-bar{position:absolute;z-index:30;right:0;top:calc(100% + 8px);width:min(760px,calc(100vw - 300px));box-shadow:0 12px 30px #14251b24}.ged-advanced-filters:not([open])>.ged-filters-bar{display:none}
.ged-filters-bar{margin:0;padding:12px;background:var(--color-gray-2);border-color:var(--color-gray-5)}
.ged-filters-bar .ged-button{background:var(--color-gray-1);color:var(--color-gray-12);border-color:var(--color-gray-5)}
.ged-filters-bar select,.ged-filters-bar input{background:var(--color-gray-1);color:var(--color-gray-12);border-color:var(--color-gray-5)}
.ged-results{padding-top:0}.ged-section-heading{margin:0 0 16px;color:var(--color-gray-12)}.ged-section-heading h2{font-size:13px}.ged-section-heading>span{color:var(--color-gray-9)}
.ged-bundle{display:none}.ged-workbench:has(.ged-check input:checked) .ged-bundle{display:flex;background:var(--color-gray-3)}
.ged-cards{grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:20px 16px}
.ged-card{position:relative;display:flex;flex-direction:column;min-width:0;padding:0;background:transparent;border:0;border-radius:10px;box-shadow:none}
.ged-card:hover{box-shadow:none;border:0}.ged-card:has(input:checked){background:var(--color-accent-2);box-shadow:0 0 0 2px var(--color-accent-8)}
.ged-thumbnail{display:grid;place-items:center;width:100%;height:158px;border:1px solid var(--color-gray-5);border-radius:10px;background:var(--color-gray-3);color:var(--color-gray-8);overflow:hidden;cursor:pointer}
.ged-thumbnail:hover{border-color:var(--color-gray-7)}.ged-thumbnail img{width:100%;height:100%;object-fit:cover}
.ged-card-top{position:absolute;top:7px;right:7px;left:7px;justify-content:space-between;pointer-events:none}.ged-card-top .ged-file-icon{display:none}.ged-card-top .ged-tag{background:var(--color-gray-2);color:var(--color-gray-10);box-shadow:0 1px 4px #0002;max-width:75%}.ged-card-top .ged-check{pointer-events:auto;margin-left:auto;background:var(--color-gray-2);border-radius:6px}
.ged-card h3{padding:8px 4px 0;font-size:12px;line-height:1.35;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.ged-card h3 button{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ged-card-meta{padding:0 4px;margin:3px 0 0;color:var(--color-gray-9);font-size:10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.ged-card-meta span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ged-card-meta a:hover,.ged-project-link:hover{text-decoration:underline;color:var(--color-accent-11)}
.ged-card .ged-excerpt{padding:5px 4px;color:var(--color-gray-10);font-size:11px;line-height:1.4;margin-bottom:0}.ged-card footer{padding:4px;margin-top:auto;border:0;color:var(--color-gray-9)}.ged-card footer>button{font-size:10px}
.ged-projects{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:12px}.ged-project-card{display:flex;align-items:center;gap:12px;padding:15px;border:1px solid var(--color-gray-5);border-radius:10px;background:var(--color-gray-2);color:var(--color-gray-12);font-size:12px;min-width:0}.ged-project-card:hover{background:var(--color-gray-3)}.ged-project-card svg{flex:none;color:var(--color-gray-9)}.ged-project-card span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ged-list{display:flex;flex-direction:column}.ged-list-row{display:flex;align-items:center;gap:12px;min-height:66px;padding:8px 10px;border-bottom:1px solid var(--color-gray-4);border-radius:7px}.ged-list-row:hover{background:var(--color-gray-3)}.ged-list-row>.ged-check{margin:0}.ged-list-preview{display:grid;place-items:center;flex:none;width:43px;height:43px;border-radius:7px;background:var(--color-gray-3);color:var(--color-gray-9);overflow:hidden;cursor:pointer}.ged-list-preview img{width:100%;height:100%;object-fit:cover}.ged-list-copy{display:flex;flex-direction:column;gap:3px;min-width:0;flex:1}.ged-list-copy button{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:left;color:var(--color-gray-12);font-size:12px;font-weight:600;cursor:pointer}.ged-list-copy button:hover{text-decoration:underline}.ged-list-copy span{color:var(--color-gray-9);font-size:11px}
.ged-table-wrap{overflow:visible;background:var(--color-gray-1);border:0;border-radius:0}.ged-table{color:var(--color-gray-12)}.ged-table thead th{padding:10px 12px;color:var(--color-gray-9);border-bottom:1px solid var(--color-gray-5)}.ged-table tbody td{padding:7px 12px;color:var(--color-gray-10);border-bottom:1px solid var(--color-gray-4)}.ged-table tbody tr:hover{background:var(--color-gray-3)}.ged-table-title{color:var(--color-gray-12)}.ged-table-title img{width:32px;height:32px;object-fit:cover;border-radius:5px}.ged-table-title svg{color:var(--color-gray-9)}.ged-table th.ged-table-actions,.ged-table td.ged-table-actions{width:44px;overflow:visible;text-align:right}
.ged-file-menu{position:relative}.ged-file-menu>summary{display:grid;place-items:center;width:26px;height:26px;list-style:none;border-radius:7px;cursor:pointer;color:var(--color-gray-9)}.ged-file-menu>summary::-webkit-details-marker{display:none}.ged-file-menu>summary:hover,.ged-file-menu[open]>summary{background:var(--color-gray-4);color:var(--color-gray-12)}.ged-file-menu-panel{position:absolute;top:29px;right:0;z-index:30;min-width:170px;padding:6px;background:var(--color-gray-2);border:1px solid var(--color-gray-5);border-radius:10px;box-shadow:0 10px 30px #0003;text-align:left}.ged-file-menu-panel>a,.ged-delete-confirm>summary{display:flex;align-items:center;gap:9px;padding:8px;border-radius:6px;color:var(--color-gray-12);font-size:12px;white-space:nowrap;cursor:pointer}.ged-file-menu-panel>a:hover,.ged-delete-confirm>summary:hover{background:var(--color-gray-4)}.ged-delete-confirm>summary{color:var(--color-tag-red);list-style:none}.ged-delete-confirm>summary::-webkit-details-marker{display:none}.ged-delete-confirm form{padding:8px;font-size:11px}.ged-delete-confirm button{margin-top:8px;padding:5px 8px;border-radius:5px;background:var(--color-tag-red);color:white}
.ged-file-menu:not([open])>.ged-file-menu-panel,.ged-delete-confirm:not([open])>form,.ged-toolbar-menu:not([open])>.ged-display-panel{display:none}
.ged-rename-confirm>summary{display:flex;align-items:center;gap:9px;padding:8px;border-radius:6px;color:var(--color-gray-12);font-size:12px;list-style:none;cursor:pointer}.ged-rename-confirm>summary::-webkit-details-marker{display:none}.ged-rename-confirm>summary:hover{background:var(--color-gray-4)}.ged-rename-confirm:not([open])>form{display:none}.ged-rename-confirm form{padding:8px}.ged-rename-confirm label{display:grid;gap:5px;font-size:11px}.ged-rename-confirm input{width:210px;max-width:100%;padding:6px;border:1px solid var(--color-gray-6);border-radius:5px;background:var(--color-gray-1);color:var(--color-gray-12)}.ged-rename-confirm button{margin-top:8px;padding:5px 8px;border-radius:5px;background:var(--color-accent-9);color:white;font-size:11px}
@media(max-width:760px){.ged-workbench-inner{padding:18px 12px 40px}.ged-hero{flex-wrap:wrap}.ged-library-tabs{width:100%;order:2}.ged-cards{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 10px}.ged-thumbnail{height:120px}.ged-table th.ged-col-optional,.ged-table td.ged-col-optional{display:none}.ged-table th:nth-child(3),.ged-table td:nth-child(3){display:none}}
@media(max-width:760px){.ged-header-search{width:min(190px,45vw)}}
.automation-page{flex:1;min-width:0;min-height:0;height:100%;overflow:auto;background:var(--color-gray-1);color:var(--color-gray-12)}
.automation-content{width:min(1050px,100%);margin:0 auto;padding:54px 30px 80px}
.automation-top{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-bottom:24px}.automation-tabs{display:flex;align-items:center;gap:4px}.automation-tabs a{padding:9px 14px;border-radius:99px;color:var(--color-gray-10);font-size:13px}.automation-tabs a.active{background:var(--color-gray-4);color:var(--color-gray-12);font-weight:650}.automation-new{padding:10px 15px;border:1px solid var(--color-gray-5);border-radius:99px;background:var(--color-gray-12);color:var(--color-gray-1);font-size:12px;font-weight:650;white-space:nowrap}
.automation-history,.automation-list{border:1px solid var(--color-gray-5);border-radius:18px;background:var(--color-gray-2)}.automation-history{padding:20px 18px 14px;margin-bottom:22px}.automation-history header{display:flex;align-items:center;gap:10px;font-size:12px}.automation-history header strong{font-weight:700}.automation-history header>span{color:var(--color-gray-10)}.automation-history .automation-history-count{margin-left:auto}.automation-history-count span+span{margin-left:12px}.automation-bars{display:flex;align-items:end;gap:4px;height:82px;margin-top:22px}.automation-bars span{flex:1;min-width:0;height:var(--bar);max-height:100%;border-radius:3px 3px 0 0;background:var(--color-accent-9,#749366)}.automation-bars span.empty{background:var(--color-gray-6)}.automation-history-dates{display:flex;justify-content:space-between;margin-top:6px;color:var(--color-gray-9);font-size:10px}
.automation-list{min-height:120px;padding:8px 14px;margin-bottom:24px}.automation-empty{display:grid;min-height:104px;place-items:center;color:var(--color-gray-10);font-size:13px;text-align:center}.automation-list-head,.automation-list-row{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr) 135px;gap:16px;align-items:center;padding:10px 5px}.automation-list-head{color:var(--color-gray-10);font-size:11px}.automation-list-row{border-top:1px solid var(--color-gray-5);font-size:12px}.automation-list-row:hover{background:var(--color-gray-3)}.automation-list-row strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.automation-list-row>span:nth-child(2){color:var(--color-gray-10)}.automation-status{font-size:11px}.automation-status.active,.automation-status.completed{color:#438b5b}.automation-status.failed{color:#ca5656}.automation-error{margin-bottom:16px;color:#bf4e4e;font-size:12px}
.automation-templates-top{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:0 8px;margin-bottom:10px;font-size:13px}.automation-templates-top nav{display:flex;gap:4px;overflow:auto}.automation-templates-top a{padding:7px 10px;border-radius:99px;color:var(--color-gray-10);white-space:nowrap}.automation-templates-top a.active{background:var(--color-gray-4);color:var(--color-gray-12)}.automation-template-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:5px 20px}.automation-template{display:flex;align-items:center;gap:11px;min-width:0;padding:10px;border-radius:10px}.automation-template:hover{background:var(--color-gray-3)}.automation-template-icon{display:grid;place-items:center;flex:none;width:34px;height:34px;border-radius:9px;background:var(--color-gray-4)}.automation-template-text{display:grid;min-width:0;gap:2px}.automation-template-text strong,.automation-template-text small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.automation-template-text strong{font-size:12px}.automation-template-text small{color:var(--color-gray-10);font-size:11px}.automation-add{margin-left:auto;padding:5px 9px;border-radius:99px;background:var(--color-gray-4);font-size:11px}
.automation-overlay{position:fixed;inset:0;z-index:90;display:grid;place-items:center;padding:18px}.automation-backdrop{position:absolute;inset:0;background:#07100bb3;backdrop-filter:blur(4px)}.automation-modal{position:relative;z-index:1;width:min(560px,100%);max-height:calc(100dvh - 36px);overflow:auto;padding:20px;border:1px solid var(--color-gray-5);border-radius:18px;background:var(--color-gray-2);box-shadow:0 24px 70px #0004}.automation-modal header{display:flex;justify-content:space-between;align-items:center;margin-bottom:18px;font-size:14px}.automation-modal header a{color:var(--color-gray-10)}.automation-modal form{display:grid;gap:15px}.automation-name{display:flex;align-items:center;gap:10px}.automation-name>svg{flex:none}.automation-name input,.automation-field input,.automation-field select,.automation-field textarea{width:100%;min-width:0;border:1px solid var(--color-gray-5);border-radius:10px;background:var(--color-gray-1);color:var(--color-gray-12);padding:10px 12px;font-size:13px}.automation-field{display:grid;gap:7px}.automation-field>span{color:var(--color-gray-10);font-size:11px;font-weight:650}.automation-field textarea{resize:vertical;min-height:116px}.automation-modal-tools{display:flex;flex-wrap:wrap;gap:12px}.automation-modal-tools a{display:flex;align-items:center;gap:5px;color:var(--color-gray-10);font-size:12px}.automation-modal-tools a:hover{color:var(--color-gray-12)}.automation-modal-help{color:var(--color-gray-9);font-size:11px}.automation-modal footer{display:flex;justify-content:space-between;align-items:center;padding-top:10px}.automation-modal footer a,.automation-modal footer button{padding:8px 12px;border:1px solid var(--color-gray-5);border-radius:9px;font-size:12px}.automation-modal footer button{background:var(--color-gray-12);color:var(--color-gray-1)}
@media(max-width:760px){.automation-content{padding:24px 14px 50px}.automation-top{flex-wrap:wrap}.automation-template-grid{grid-template-columns:1fr}.automation-list-head,.automation-list-row{grid-template-columns:minmax(0,1fr) 100px}.automation-list-head span:nth-child(2),.automation-list-row>span:nth-child(2){display:none}}
/* View switcher (2026-09-25; 2026-10-13, 1.11.1) — plain text tabs. Ghislain: "remove the visual switch effect": no grey track, no pill, nothing slides between pages. The active tab is dark and underlined in ink, like a record's tab bar; the others stay quiet until hovered. */
@view-transition{navigation:auto}
::view-transition-old(root),::view-transition-new(root){animation:none;mix-blend-mode:normal}
.view-switch{display:flex;width:max-content;align-items:center;gap:18px;max-width:100%;overflow-x:auto;scrollbar-width:none;padding:0}
.view-switch::-webkit-scrollbar{display:none}
.view-switch--sub{gap:14px}
.view-switch-item{position:relative;flex:none;padding:4px 0 3px;border-bottom:2px solid transparent;color:var(--color-gray-9);font-size:12.5px;font-weight:500;line-height:18px;letter-spacing:.005em;white-space:nowrap;transition:color .15s ease,border-color .15s ease}
.view-switch--sub .view-switch-item{padding:3px 0 2px;font-size:12px}
.view-switch-item:hover{color:var(--color-gray-12)}
.view-switch-item:focus-visible{outline:2px solid var(--color-accent-9,#749366);outline-offset:2px;border-radius:2px}
.view-switch-item[aria-current=page]{color:var(--color-gray-12);font-weight:600;border-bottom-color:var(--color-gray-12)}
@media (prefers-reduced-motion:reduce){@view-transition{navigation:none}.view-switch-item{transition:none}}
/* Inbox label tree (2026-09-25): a parent label folds with a native <details>, instantly. */
.label-node>summary{list-style:none;cursor:pointer}
.label-node>summary::-webkit-details-marker{display:none}
.label-node>summary .label-chevron{transition:transform .15s ease}
.label-node[open]>summary .label-chevron{transform:rotate(90deg)}
/* Record viewer (2026-09-25): the document of a record (PDF or image of a FILES field, or the linked DMS PDF of an invoice), foldable with a native <details>, no script. */
.viewer-slot{padding:16px 24px 0}
.viewer{border:1px solid var(--color-gray-5);border-radius:8px;background:var(--color-gray-2);overflow:hidden}
.viewer>summary{list-style:none;cursor:pointer}
.viewer>summary::-webkit-details-marker{display:none}
.viewer-summary{display:flex;align-items:center;gap:8px;padding:9px 12px;font-size:13px;color:var(--color-gray-12)}
.viewer-summary:hover{background:var(--color-gray-3)}
.viewer-summary-title{font-weight:600}
.viewer-summary-name{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--color-gray-10)}
.viewer-bar{display:flex;flex-wrap:wrap;align-items:center;gap:8px;padding:6px 12px;border-top:1px solid var(--color-gray-5)}
.viewer-note{font-size:12px;color:var(--color-gray-10)}
.viewer-spacer{flex:1}
.viewer-action{display:inline-flex;align-items:center;gap:5px;height:28px;padding:0 10px;border:1px solid var(--color-gray-5);border-radius:4px;background:var(--color-gray-1);color:var(--color-gray-12);font-size:12.5px;white-space:nowrap}
.viewer-action:hover{background:var(--color-gray-3)}
.viewer-frame{height:70vh;min-height:320px;border-top:1px solid var(--color-gray-5);background:var(--color-gray-3)}
.viewer-pdf{display:block;width:100%;height:100%;border:0;background:#fff}
.viewer-img{display:block;width:100%;height:100%;object-fit:contain}
.viewer-others{border-top:1px solid var(--color-gray-5)}
.viewer-others>summary{cursor:pointer;padding:8px 12px;font-size:12.5px;color:var(--color-gray-10)}
.viewer-others>summary:hover{color:var(--color-gray-12)}
.viewer-list{margin:0;padding:0 8px 8px;list-style:none}
.viewer-list a{display:flex;align-items:center;gap:6px;padding:5px 6px;border-radius:4px;font-size:12.5px;color:var(--color-gray-12)}
.viewer-list a:hover{background:var(--color-gray-3)}
.viewer-list a span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
/* Fluidité (2026-09-25) — états d'interface basculés en CSS, sans rechargement ni script. */
.fl-sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
/* Composeur : les rangées Cc / Cci sont toujours rendues, une case sans nom les déplie. */
form:has(#fl-compose-cc:not(:checked)) .fl-compose-cc-row,form:has(#fl-compose-bcc:not(:checked)) .fl-compose-bcc-row{display:none}
form:has(#fl-compose-cc:checked) .fl-compose-cc-open,form:has(#fl-compose-bcc:checked) .fl-compose-bcc-open{display:none}
/* Boîte : le panneau des dossiers est toujours rendu ; le ☰ (un <label>) le replie. */
.fl-inbox:has(#fl-inbox-nav:not(:checked)) .fl-inbox-nav-panel{display:none}
.fl-inbox:has(#fl-inbox-nav:not(:checked)) .fl-inbox-nav-btn{background:var(--color-gray-4);color:var(--color-gray-12)}
/* Boîte : chaque message du fil est un <details> ; la ligne repliée s'efface une fois déplié. */
.fl-msg>summary{list-style:none;cursor:pointer}
.fl-msg>summary::-webkit-details-marker{display:none}
.fl-msg[open]>summary{display:none}
/* Boîte : recherche avancée, aide des raccourcis, fermeture du panneau latéral — des cases, pas des adresses. */
.fl-inbox:has(#fl-inbox-adv:not(:checked)) .fl-inbox-adv-panel{display:none}
.fl-inbox:has(#fl-inbox-adv:checked) .fl-quick-row{display:none!important}
.fl-inbox:has(#fl-shortcuts:not(:checked)) .fl-shortcuts{display:none}
.fl-inbox:has(#fl-inbox-panel:not(:checked)) .fl-inbox-panel{display:none}
.fl-inbox:has(#fl-inbox-panel:not(:checked)) .fl-rail-open{background:transparent;color:var(--color-gray-11)}
.fl-inbox:has(#fl-inbox-panel:not(:checked)) .fl-rail-collapse{pointer-events:none;color:var(--color-gray-7)}
/* Fiche, Chronologie : une puce par type du contexte, une case qui masque les événements du même data-tl-kind. */
.fl-tl-chip:has(input:not(:checked)){border-color:var(--color-gray-4);background:var(--color-gray-1);color:var(--color-gray-8)}
.fl-tl-chip:has(input:not(:checked)) .fl-tl-dot{opacity:.4}
.fl-tl-chip:has(input:focus-visible){outline:2px solid var(--color-accent-8);outline-offset:1px}
.fl-tl:has(input[data-kind=email]:not(:checked)) [data-tl-kind=email],.fl-tl:has(input[data-kind=document]:not(:checked)) [data-tl-kind=document],.fl-tl:has(input[data-kind=link]:not(:checked)) [data-tl-kind=link],.fl-tl:has(input[data-kind=proposal]:not(:checked)) [data-tl-kind=proposal],.fl-tl:has(input[data-kind=fact]:not(:checked)) [data-tl-kind=fact]{display:none}
/* Assistant IA : le mode (Instant / Modéré / Ultra) est un groupe de radios name="model" du composeur. */
.ai-mode-picker .fl-mode-name{display:none}
.ai-mode-picker:has(input[data-mode=instant]:checked) .fl-mode-name[data-mode=instant],.ai-mode-picker:has(input[data-mode=moderate]:checked) .fl-mode-name[data-mode=moderate],.ai-mode-picker:has(input[data-mode=reflection]:checked) .fl-mode-name[data-mode=reflection],.ai-mode-picker:has(input[data-mode=ultra]:checked) .fl-mode-name[data-mode=ultra],.ai-mode-picker:has(input[data-mode=named]:checked) .fl-mode-name[data-mode=named]{display:inline}
.ai-mode-steps .fl-mode-step{display:flex;flex-direction:column;align-items:center;gap:8px;padding:9px 3px;border-radius:13px;color:var(--color-gray-10);font-size:12px;text-align:center;cursor:pointer}
.ai-mode-steps .fl-mode-step:hover,.ai-mode-steps .fl-mode-step:has(input:checked){background:var(--color-gray-4);color:var(--color-gray-12)}
.ai-mode-steps .fl-mode-step:has(input:focus-visible){outline:2px solid var(--color-accent-8);outline-offset:1px}
.ai-mode-steps .fl-mode-step:has(input:checked) .ai-mode-dot{width:18px;height:18px;margin:-3px;background:var(--color-accent-9);box-shadow:0 0 0 4px var(--color-accent-3)}
/* Assistant IA, historique : onglets Chats / Médias et bascule « large », des cases lues par :has(). */
.fl-hist-tab{padding:7px 9px;border-radius:24px;color:var(--color-gray-10);font-size:13px;cursor:pointer}
.fl-hist:has(#fl-hist-chats:checked) .fl-hist-tab[data-tab=chats],.fl-hist:has(#fl-hist-media:checked) .fl-hist-tab[data-tab=media]{background:var(--color-gray-4);color:var(--color-gray-12);font-weight:600}
.fl-hist:has(#fl-hist-chats:checked) .fl-hist-pane[data-tab=media],.fl-hist:has(#fl-hist-media:checked) .fl-hist-pane[data-tab=chats]{display:none}
.fl-hist:has(#fl-hist-wide:checked){width:min(700px,calc(100vw - 32px))}
.fl-hist:has(#fl-hist-wide:checked) .ai-history-list{width:100%}
.fl-hist:has(#fl-hist-wide:checked) .ai-history-preview,.fl-hist:has(#fl-hist-wide:not(:checked)) .ai-history-wide-actions{display:none}
.fl-hist-wide-toggle{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;color:var(--color-gray-10);cursor:pointer}
.fl-hist-wide-toggle:hover{background:var(--color-gray-4);color:var(--color-gray-12)}
.fl-hist:has(#fl-hist-wide:checked) .fl-hist-when-narrow,.fl-hist:has(#fl-hist-wide:not(:checked)) .fl-hist-when-wide{display:none}
/* Workflow, panneau d'exécution : quatre onglets en radios, quatre corps rendus. */
.fl-rtab-pane{display:none}
.fl-rtab:has(input[data-rtab=output]:checked) .fl-rtab-pane[data-rtab=output],.fl-rtab:has(input[data-rtab=node]:checked) .fl-rtab-pane[data-rtab=node],.fl-rtab:has(input[data-rtab=input]:checked) .fl-rtab-pane[data-rtab=input],.fl-rtab:has(input[data-rtab=log]:checked) .fl-rtab-pane[data-rtab=log]{display:block}
.fl-rtab:has(input[data-rtab=output]:checked) .fl-rtab-tab[data-rtab=output],.fl-rtab:has(input[data-rtab=node]:checked) .fl-rtab-tab[data-rtab=node],.fl-rtab:has(input[data-rtab=input]:checked) .fl-rtab-tab[data-rtab=input],.fl-rtab:has(input[data-rtab=log]:checked) .fl-rtab-tab[data-rtab=log]{border-color:var(--color-gray-12);color:var(--color-gray-12)}
.fl-rtab:has(input:focus-visible) .fl-rtab-tab{outline-offset:2px}
/* Studio d'ingestion : « activer » et « enregistrer en modèle » sont toujours rendus, un groupe de radios choisit. */
:root:has(#fl-studio-activate:not(:checked)) .fl-studio-activate,:root:has(#fl-studio-template:not(:checked)) .fl-studio-template{display:none}
:root:has(#fl-studio-activate:checked) .fl-studio-test,:root:has(#fl-studio-template:checked) .fl-studio-test{display:none}
/* Confirmations légères : un <details> dont le <summary> est le bouton ; -pop pose le formulaire en surimpression. */
.fl-confirm>summary{list-style:none}
.fl-confirm>summary::-webkit-details-marker{display:none}
.fl-confirm-pop{position:relative}
.fl-confirm-pop>.fl-confirm-panel{position:absolute;right:0;top:calc(100% + 6px);z-index:30;min-width:220px;max-width:min(320px,80vw);padding:10px;border:1px solid var(--color-gray-5);border-radius:8px;background:var(--color-gray-1);box-shadow:0 10px 30px rgb(0 0 0/.18);text-align:left}
/* Prescriptio plugin (2026-09-25): settings page (/settings/plugins/prescriptio) and the company block. Hand-written: the Tailwind engine is frozen. */
.pxo-page{display:grid;gap:16px;max-width:860px}
.pxo-card{display:grid;gap:12px;padding:16px;border:1px solid var(--color-gray-6);border-radius:10px;background:var(--color-gray-1)}
.pxo-head{display:flex;align-items:flex-start;gap:12px}.pxo-logo{flex:none;border-radius:8px}
.pxo-actions{display:flex;flex-wrap:wrap;align-items:center;gap:10px}
.pxo-alert{padding:8px 10px;border:1px solid color-mix(in srgb,#ca5656 40%,transparent);border-radius:8px;color:#ca5656;font-size:13px}
.pxo-mapping select{min-width:220px}.pxo-mapping td{vertical-align:top}.pxo-mapping small{display:block;margin-top:4px;font-size:11px}
.pxo-missing{display:grid;gap:8px;padding:12px;border:1px dashed var(--color-gray-6);border-radius:8px}
.pxo-duplicate{display:grid;gap:8px;padding:10px 0;border-top:1px solid var(--color-gray-4)}
.pxo-block{display:grid;gap:6px;margin-top:12px;padding:12px;border:1px solid var(--color-gray-5);border-radius:10px;background:var(--color-gray-2);font-size:12px}
.pxo-block header{display:flex;align-items:center;gap:8px}.pxo-block header strong{font-size:13px;font-weight:650}
.pxo-block dl{display:grid;grid-template-columns:auto 1fr;gap:3px 10px;margin:0}.pxo-block dt{color:var(--color-gray-10)}.pxo-block dd{margin:0;min-width:0;overflow-wrap:anywhere}
.pxo-block a{color:var(--color-accent-11,#4d7c3a)}.pxo-block small{color:var(--color-gray-10)}
.pxo-state{display:inline-block;padding:1px 7px;border-radius:99px;font-size:11px;font-weight:600}.pxo-state.on{background:color-mix(in srgb,#438b5b 15%,transparent);color:#438b5b}.pxo-state.off{background:color-mix(in srgb,#ca5656 15%,transparent);color:#ca5656}
/* Comptabilité (2026-09-25) — vue d'ensemble, encours, marges, rapprochement, correspondance. Règles écrites à la main : le moteur Tailwind est parti, une classe utilitaire neuve serait inerte. */
.compta-page{display:flex;flex:1;flex-direction:column;min-width:0;min-height:0;height:100%;overflow:hidden;background:var(--color-gray-1);color:var(--color-gray-12)}
.compta-scroll{flex:1;min-height:0;overflow:auto}
.compta-content{width:min(1180px,100%);margin:0 auto;padding:22px 28px 70px;font-size:13px}
.compta-header-link{display:inline-flex;align-items:center;gap:6px;padding:5px 10px;border:1px solid var(--color-gray-5);border-radius:999px;color:var(--color-gray-11);font-size:12px}
.compta-header-link:hover{background:var(--color-gray-3);color:var(--color-gray-12)}
.compta-h2{margin:22px 0 10px;font-size:13px;font-weight:650;color:var(--color-gray-12)}
.compta-link{color:inherit;text-decoration:none;border-bottom:1px dotted var(--color-gray-7)}
.compta-link:hover{color:var(--color-accent-11);border-bottom-color:var(--color-accent-9)}
.compta-choices{display:flex;flex-wrap:wrap;align-items:center;gap:4px;margin:0 0 8px}
.compta-choices-label{margin-right:6px;color:var(--color-gray-9);font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.04em}
.compta-choice{padding:4px 11px;border-radius:999px;color:var(--color-gray-10);font-size:12px;white-space:nowrap}
.compta-choice:hover{background:var(--color-gray-3);color:var(--color-gray-12)}
.compta-choice[aria-current=page]{background:var(--color-gray-4);color:var(--color-gray-12);font-weight:600}
.compta-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:10px}
.compta-card{display:flex;flex-direction:column;gap:4px;min-width:0;padding:14px 16px;border:1px solid var(--color-gray-5);border-radius:12px;background:var(--color-gray-2)}
.compta-card--good{border-left:3px solid var(--color-green-600)}
.compta-card--bad{border-left:3px solid var(--color-red-600)}
.compta-card-label{color:var(--color-gray-10);font-size:11px;font-weight:600}
.compta-card-value{font-size:19px;font-weight:650;font-variant-numeric:tabular-nums;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.compta-card-hint{color:var(--color-gray-9);font-size:11px;line-height:1.35}
.compta-chart{height:280px;padding:12px;border:1px solid var(--color-gray-5);border-radius:12px;background:var(--color-gray-2)}
.compta-fold{margin:14px 0;border:1px solid var(--color-gray-5);border-radius:12px;background:var(--color-gray-2)}
.compta-fold>summary{display:flex;align-items:center;gap:8px;padding:11px 14px;cursor:pointer;font-weight:600;list-style:none}
.compta-fold>summary::-webkit-details-marker{display:none}
.compta-fold>summary::before{content:"▸";color:var(--color-gray-9);transition:transform .15s ease}
.compta-fold[open]>summary::before{transform:rotate(90deg)}
.compta-fold>:not(summary){margin-left:14px;margin-right:14px}
.compta-fold[open]{padding-bottom:10px}
.compta-table-wrap{overflow-x:auto;border:1px solid var(--color-gray-5);border-radius:12px}
.compta-table{width:100%;border-collapse:collapse;font-size:12px}
.compta-table th{padding:8px 10px;text-align:left;color:var(--color-gray-9);font-weight:600;border-bottom:1px solid var(--color-gray-5);white-space:nowrap}
.compta-table td{padding:7px 10px;border-bottom:1px solid var(--color-gray-4);vertical-align:top}
.compta-table tbody tr:hover{background:var(--color-gray-3)}
.compta-table .num{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
.compta-table--dense td,.compta-table--dense th{padding:5px 8px}
.compta-sort{color:inherit}.compta-sort:hover{color:var(--color-gray-12)}
.compta-flagged td:first-child{box-shadow:inset 3px 0 0 var(--color-red-600)}
.compta-bad{color:var(--color-red-700)}
.compta-flags{white-space:normal}
.compta-flag{display:inline-block;margin:0 4px 3px 0;padding:1px 7px;border-radius:999px;background:var(--color-red-50);color:var(--color-red-700);font-size:10.5px;white-space:nowrap}
.compta-summary{margin:12px 0 8px;color:var(--color-gray-10);font-size:12px}
.compta-empty{margin:10px 0;padding:12px 14px;border:1px dashed var(--color-gray-6);border-radius:10px;color:var(--color-gray-10)}
.compta-notes{margin:24px 0 0;padding:0 0 0 18px;color:var(--color-gray-9);font-size:11.5px;line-height:1.5;list-style:disc}
.compta-help{margin:6px 0 10px;color:var(--color-gray-10);font-size:12px;line-height:1.45}
.compta-more{margin:8px 0;color:var(--color-gray-10);font-size:12px}
.compta-mono{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:11px;color:var(--color-gray-10)}
.compta-section{margin-bottom:26px}
.compta-section-head{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:10px}
.compta-section-figures{color:var(--color-gray-10);font-size:12px}
.compta-aging{border:1px solid var(--color-gray-5);border-radius:12px;overflow-x:auto;background:var(--color-gray-2)}
.compta-aging-row{display:grid;grid-template-columns:minmax(180px,2.2fr) 70px repeat(7,minmax(88px,1fr));gap:8px;align-items:center;min-width:900px;padding:7px 12px;border-bottom:1px solid var(--color-gray-4);font-size:12px}
.compta-aging-row .num{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
.compta-aging-head{color:var(--color-gray-9);font-weight:600;border-bottom-color:var(--color-gray-5)}
.compta-aging-total{font-weight:650;background:var(--color-gray-3)}
.compta-aging-tier>summary{list-style:none;cursor:pointer}
.compta-aging-tier>summary::-webkit-details-marker{display:none}
.compta-aging-tier>summary:hover{background:var(--color-gray-3)}
.compta-aging-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.compta-aging-name::before{content:"▸";display:inline-block;margin-right:6px;color:var(--color-gray-9);transition:transform .15s ease}
.compta-aging-tier[open] .compta-aging-name::before{transform:rotate(90deg)}
.compta-aging-detail{min-width:900px;padding:6px 12px 12px 30px;background:var(--color-gray-1);border-bottom:1px solid var(--color-gray-4)}
.compta-reco-index{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:6px}
.compta-reco-chip{display:flex;flex-direction:column;gap:2px;min-width:150px;padding:10px 14px;border:1px solid var(--color-gray-5);border-radius:12px;background:var(--color-gray-2)}
.compta-reco-chip:hover{background:var(--color-gray-3)}
.compta-reco-chip span{color:var(--color-gray-10);font-size:11px}
.compta-reco-chip strong{font-size:17px;font-variant-numeric:tabular-nums}
.compta-reco-title{flex:1}
.compta-reco-count{font-variant-numeric:tabular-nums}
.compta-dup{margin:10px 0 14px}
.compta-dup-title{margin:0 0 4px;font-weight:600}
.compta-notice{margin:0 0 12px;padding:9px 12px;border-radius:8px;background:var(--color-accent-3);color:var(--color-accent-11)}
.compta-form{display:grid;gap:16px;max-width:860px}
.compta-fieldset{margin:0;padding:12px 16px 14px;border:1px solid var(--color-gray-5);border-radius:12px;background:var(--color-gray-2)}
.compta-fieldset legend{padding:0 6px;font-weight:650}
.compta-field{display:grid;grid-template-columns:200px minmax(0,1fr);gap:4px 14px;align-items:center;padding:8px 0;border-bottom:1px solid var(--color-gray-4)}
.compta-field:last-child{border-bottom:0}
.compta-field-label{font-weight:600;font-size:12px}
.compta-field-help,.compta-state{grid-column:2;color:var(--color-gray-9);font-size:11px}
.compta-state.compta-bad{color:var(--color-red-700)}
.compta-select,.compta-input{width:100%;min-width:0;padding:6px 9px;border:1px solid var(--color-gray-6);border-radius:8px;background:var(--color-gray-1);color:var(--color-gray-12);font-size:12px}
.compta-checks{display:flex;flex-wrap:wrap;gap:6px 16px;font-size:12px}
.compta-actions{display:flex;gap:10px}
.compta-button{padding:8px 14px;border:1px solid var(--color-gray-12);border-radius:999px;background:var(--color-gray-12);color:var(--color-gray-1);font-size:12px;font-weight:600;cursor:pointer}
.compta-button--ghost{background:transparent;color:var(--color-gray-12);border-color:var(--color-gray-6)}
@media(max-width:760px){.compta-content{padding:16px 12px 50px}.compta-field{grid-template-columns:1fr}.compta-field-help,.compta-state{grid-column:1}}
/* Record tabs (2026-09-25) — relation tabs, field tabs and their Disposition builder. Hand-written: the Tailwind engine is frozen. */
.rel-tabbar{overflow-x:auto;scrollbar-width:thin;white-space:nowrap}
.rel-tabbar>a{flex:none}
.rel-count{display:inline-flex;align-items:center;justify-content:center;min-width:18px;height:18px;padding:0 5px;border-radius:999px;background:var(--color-gray-4);color:var(--color-gray-11);font-size:11px;font-weight:500;line-height:1;font-variant-numeric:tabular-nums}
.rel-stack{display:grid;gap:20px}
.rel-panel{display:grid;gap:10px;min-width:0}
.rel-head{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px}
.rel-title{display:inline-flex;align-items:center;gap:6px;color:var(--color-gray-12);font-size:14px;font-weight:600}
.rel-actions{display:inline-flex;align-items:center;gap:6px;margin-left:auto}
.rel-inline{display:inline-flex;margin:0}
.rel-button{display:inline-flex;align-items:center;gap:5px;height:28px;padding:0 9px;border:1px solid var(--color-gray-6);border-radius:4px;background:var(--color-gray-1);color:var(--color-gray-12);font-size:12.5px;font-weight:500;white-space:nowrap;cursor:pointer}
.rel-button:hover{background:var(--color-gray-3)}
.rel-button-primary{border-color:transparent;background:var(--color-accent-9,#749366);color:#fff}
.rel-button-primary:hover{background:var(--color-accent-10,#658457)}
.rel-table{min-width:0;overflow-x:auto;border:1px solid var(--color-gray-5);border-radius:6px}
.rel-section{border:1px solid var(--color-gray-5);border-radius:6px;background:var(--color-gray-1)}
.rel-section>.rel-table{border:0;border-top:1px solid var(--color-gray-5);border-radius:0}
.rel-section-head{display:flex;flex-wrap:wrap;align-items:center;gap:8px;padding:8px 10px;list-style:none;cursor:pointer;color:var(--color-gray-12);font-size:13px}
.rel-section-head::-webkit-details-marker{display:none}
.rel-caret{flex:none;color:var(--color-gray-9);transition:transform .15s ease}
.rel-section[open]>.rel-section-head .rel-caret{transform:rotate(90deg)}
.rel-section-title{font-weight:600}
.rel-totals{display:flex;flex-wrap:wrap;gap:14px;font-size:12.5px}
.rel-total{color:var(--color-gray-12);font-variant-numeric:tabular-nums;white-space:nowrap}
.rel-total-label{color:var(--color-gray-9)}
.rel-empty{padding:10px;color:var(--color-gray-9);font-size:13px}
.rel-pager{display:flex;align-items:center;justify-content:flex-end;gap:8px;padding:6px 2px;color:var(--color-gray-9);font-size:12px;font-variant-numeric:tabular-nums}
.rel-section>.rel-pager{padding:6px 10px}
.rel-toolbar{display:flex;justify-content:flex-end;margin-bottom:6px}
.rel-fields{max-width:720px}
.rel-set-row{display:grid;gap:8px;padding:8px;border:1px solid var(--color-gray-5);border-radius:6px;background:var(--color-gray-2)}
.rel-set-line{display:flex;flex-wrap:wrap;align-items:center;gap:6px}
.rel-set-line>input[type=text],.rel-set-line>input:not([type]){flex:1 1 180px;width:auto}
.rel-set-line>.rel-set-icon{flex:0 1 150px}
.rel-set-check{display:inline-flex;align-items:center;gap:5px;color:var(--color-gray-11);font-size:12.5px;white-space:nowrap}
.rel-set-kind{flex:none;padding:2px 8px;border-radius:999px;background:var(--color-gray-4);color:var(--color-gray-11);font-size:11.5px;font-weight:500}
.rel-set-body{display:grid;gap:8px;padding-left:62px}
.rel-set-fields{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:4px 12px}
.rel-set-grid{grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}
.rel-set-field{display:grid;gap:3px;color:var(--color-gray-9);font-size:11.5px}
.rel-set-hint{grid-column:1/-1;margin:0;color:var(--color-gray-9);font-size:11.5px}
@media(max-width:760px){.rel-set-body{padding-left:0}.rel-actions{margin-left:0}}
.rel-default{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0;padding:0}
/* Le super planning (lot PLANNING, 2026-09-25) — Tailwind figé : règles à la main, préfixe .plan- */
.plan-page{display:flex;flex:1;flex-direction:column;min-width:0;min-height:0;height:100%;overflow:hidden;background:var(--color-gray-1);color:var(--color-gray-12)}
.plan-scroll{flex:1;min-height:0;overflow:auto}
.plan-content{width:min(1480px,100%);margin:0 auto;padding:18px 24px 70px;font-size:13px}
.plan-header-link{display:inline-flex;align-items:center;gap:6px;padding:5px 10px;border:1px solid var(--color-gray-5);border-radius:999px;color:var(--color-gray-11);font-size:12px}
.plan-header-link:hover{background:var(--color-gray-3);color:var(--color-gray-12)}
.plan-link{color:inherit;border-bottom:1px dotted var(--color-gray-7)}
.plan-toolbar{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px;margin:0 0 10px}
.plan-choices{display:flex;flex-wrap:wrap;gap:4px}
.plan-choice,.plan-step{padding:5px 12px;border-radius:999px;color:var(--color-gray-10);font-size:12px;white-space:nowrap}
.plan-choice:hover,.plan-step:hover{background:var(--color-gray-3);color:var(--color-gray-12)}
.plan-choice[aria-current=page]{background:var(--color-gray-12);color:var(--color-gray-1);font-weight:600}
.plan-step[aria-current=page]{background:var(--color-gray-4);color:var(--color-gray-12);font-weight:600}
.plan-period{display:flex;flex-wrap:wrap;align-items:center;gap:4px}
.plan-period-label{margin-left:8px;font-weight:650;font-size:13px}
.plan-filters{display:flex;flex-wrap:wrap;align-items:flex-end;gap:8px 12px;margin:0 0 12px;padding:10px 12px;border:1px solid var(--color-gray-5);border-radius:12px;background:var(--color-gray-2)}
.plan-filter{display:flex;flex-direction:column;gap:3px;font-size:11px;color:var(--color-gray-10)}
.plan-select,.plan-input{min-width:0;max-width:260px;padding:5px 8px;border:1px solid var(--color-gray-6);border-radius:8px;background:var(--color-gray-1);color:var(--color-gray-12);font-size:12px}
.plan-sources{position:relative;align-self:center}
.plan-sources>summary{cursor:pointer;padding:5px 10px;border:1px solid var(--color-gray-6);border-radius:8px;font-size:12px;list-style:none}
.plan-sources>summary::-webkit-details-marker{display:none}
.plan-sources-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:4px 14px;margin-top:8px;min-width:min(720px,80vw)}
.plan-source{display:flex;align-items:center;gap:6px;font-size:12px}
.plan-button{display:inline-block;padding:7px 14px;border:1px solid var(--color-gray-12);border-radius:999px;background:var(--color-gray-12);color:var(--color-gray-1);font-size:12px;font-weight:600;cursor:pointer}
.plan-button--ghost{background:transparent;color:var(--color-gray-12);border-color:var(--color-gray-6)}
.plan-reset{align-self:center;color:var(--color-gray-10);font-size:12px}
.plan-legend{display:flex;flex-wrap:wrap;gap:6px 14px;margin:0 0 10px;color:var(--color-gray-10);font-size:11.5px}
.plan-legend-item{display:inline-flex;align-items:center;gap:5px}
.plan-swatch{display:inline-block;flex:none;width:10px;height:10px;border-radius:3px}
.plan-swatch--late{background:transparent;border:2px solid #dc2626}
.plan-swatch--today{width:2px;height:12px;border-radius:0;background:#dc2626}
.plan-c-blue{background:#3b82f6;fill:#3b82f6}
.plan-c-sky{background:#0ea5e9;fill:#0ea5e9}
.plan-c-turquoise{background:#14b8a6;fill:#14b8a6}
.plan-c-green{background:#22c55e;fill:#22c55e}
.plan-c-yellow{background:#ca8a04;fill:#ca8a04}
.plan-c-orange{background:#f97316;fill:#f97316}
.plan-c-red{background:#ef4444;fill:#ef4444}
.plan-c-pink{background:#ec4899;fill:#ec4899}
.plan-c-purple{background:#8b5cf6;fill:#8b5cf6}
.plan-c-gray{background:#6b7280;fill:#6b7280}
.plan-gantt-wrap{overflow-x:auto;border:1px solid var(--color-gray-5);border-radius:12px;background:var(--color-gray-1)}
.plan-gantt{display:block;min-width:960px;font-size:11px}
.plan-row{fill:transparent}
.plan-row--alt{fill:var(--color-gray-2)}
.plan-grid-month{stroke:var(--color-gray-6);stroke-width:1}
.plan-grid-week{stroke:var(--color-gray-4);stroke-width:1}
.plan-axis{stroke:var(--color-gray-6);stroke-width:1}
.plan-axis-month{fill:var(--color-gray-11);font-size:11px;font-weight:600}
.plan-axis-week{fill:var(--color-gray-9);font-size:9.5px}
.plan-row-label{fill:var(--color-gray-12);font-size:11.5px}
a:hover>.plan-row-label{fill:var(--color-accent-11);text-decoration:underline}
.plan-row-label--none{fill:var(--color-gray-9);font-style:italic}
.plan-row-focus{fill:var(--color-gray-8);font-size:12px}
a:hover>.plan-row-focus{fill:var(--color-gray-12)}
.plan-bar{opacity:.88}
.plan-milestone{stroke:var(--color-gray-1);stroke-width:1}
a:hover>.plan-bar,a:hover>.plan-milestone{opacity:1;stroke:var(--color-gray-12);stroke-width:1.5}
.plan-bar.plan-late,.plan-milestone.plan-late{stroke:#dc2626;stroke-width:2.5;stroke-dasharray:4 2}
.plan-today-line{stroke:#dc2626;stroke-width:1.5}
.plan-today-label{fill:#dc2626;font-size:9.5px;font-weight:600}
.plan-weeks{display:grid;gap:10px}
.plan-week{overflow:hidden;border:1px solid var(--color-gray-5);border-radius:12px;background:var(--color-gray-1)}
.plan-week-head,.plan-week-cells,.plan-week-bars{display:grid;grid-template-columns:repeat(7,minmax(0,1fr))}
.plan-dayhead{padding:6px 8px;border-bottom:1px solid var(--color-gray-4);background:var(--color-gray-2);color:var(--color-gray-10);font-size:11px}
.plan-dayhead--today{background:#fee2e2;color:#991b1b;font-weight:650}
.plan-dayhead--out{opacity:.45}
.plan-daynum{font-weight:650;color:var(--color-gray-12)}
.plan-daymonth{color:var(--color-gray-9)}
.plan-week-bars{grid-auto-flow:row dense;gap:3px 0;padding:6px 0;border-bottom:1px solid var(--color-gray-4)}
.plan-span{overflow:hidden;margin:0 3px;padding:2px 7px;border-radius:6px;color:#fff;font-size:11px;line-height:1.35;white-space:nowrap;text-overflow:ellipsis}
.plan-span:hover{filter:brightness(1.1)}
.plan-span.plan-late,.plan-dot.plan-late{outline:2px dashed #dc2626;outline-offset:-1px}
.plan-week-cells{min-height:84px}
.plan-cell{display:flex;flex-direction:column;gap:3px;min-width:0;padding:5px 4px;border-right:1px solid var(--color-gray-4)}
.plan-cell:last-child{border-right:0}
.plan-cell--today{background:#fef2f2}
.plan-cell--out{background:var(--color-gray-2);opacity:.6}
.plan-dot{display:block;overflow:hidden;padding:2px 6px;border-radius:5px;color:#fff;font-size:10.5px;line-height:1.3;white-space:nowrap;text-overflow:ellipsis}
.plan-dot:hover{filter:brightness(1.1)}
.plan-more{margin:0 3px;padding:1px 6px;color:var(--color-gray-10);font-size:10.5px}
.plan-more:hover{color:var(--color-gray-12);text-decoration:underline}
.plan-load-wrap{overflow-x:auto;border:1px solid var(--color-gray-5);border-radius:12px}
.plan-load{width:100%;border-collapse:collapse;font-size:11.5px}
.plan-load th,.plan-load td{padding:6px;border-bottom:1px solid var(--color-gray-4);text-align:center;vertical-align:bottom}
.plan-load thead th{color:var(--color-gray-9);font-weight:600;white-space:nowrap}
.plan-load-week--now{background:#fef2f2;color:#991b1b}
.plan-load-date{font-weight:400;font-size:10px}
.plan-load .plan-load-name{min-width:190px;text-align:left;vertical-align:middle;font-weight:600;white-space:nowrap}
.plan-load-name .plan-swatch{margin-right:6px}
.plan-load-unit{display:block;margin-left:16px;color:var(--color-gray-9);font-size:10.5px;font-weight:400}
.plan-load-cell{min-width:54px}
.plan-load-link{display:block;color:inherit}
.plan-load-link:hover .plan-load-value{color:var(--color-accent-11);text-decoration:underline}
.plan-load-bar-box{display:flex;align-items:flex-end;justify-content:center;height:46px}
.plan-load-bar{display:block;width:70%;min-height:2px;border-radius:3px 3px 0 0}
.plan-load-value{display:block;margin-top:3px;font-variant-numeric:tabular-nums;white-space:nowrap}
.plan-load .plan-load-total{font-weight:650;white-space:nowrap;vertical-align:middle}
.plan-empty{margin:10px 0;padding:14px 16px;border:1px dashed var(--color-gray-6);border-radius:10px;color:var(--color-gray-10)}
.plan-notes{margin:20px 0 0;padding:0 0 0 18px;color:var(--color-gray-9);font-size:11.5px;line-height:1.5;list-style:disc}
.plan-help{margin:6px 0 10px;color:var(--color-gray-10);font-size:12px;line-height:1.45}
.plan-notice{margin:0 0 12px;padding:9px 12px;border-radius:8px;background:var(--color-accent-3);color:var(--color-accent-11)}
.plan-form{display:grid;gap:14px;max-width:920px}
.plan-fieldset{margin:0;padding:10px 16px 12px;border:1px solid var(--color-gray-5);border-radius:12px;background:var(--color-gray-2)}
.plan-fieldset--off{opacity:.7}
.plan-fieldset legend{display:inline-flex;align-items:center;gap:6px;padding:0 6px;font-weight:650}
.plan-key{margin-left:6px;color:var(--color-gray-9);font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:10.5px;font-weight:400}
.plan-field{display:grid;grid-template-columns:190px minmax(0,1fr);gap:3px 14px;align-items:center;padding:6px 0;border-bottom:1px solid var(--color-gray-4)}
.plan-field:last-child{border-bottom:0}
.plan-field .plan-select,.plan-field .plan-input{width:100%;max-width:none}
.plan-field-label{font-weight:600;font-size:12px}
.plan-field-help,.plan-state{grid-column:2;color:var(--color-gray-9);font-size:11px}
.plan-bad{color:var(--color-red-700)}
.plan-check{display:flex;align-items:center;gap:6px;font-size:12px}
.plan-actions{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
@media(max-width:760px){.plan-content{padding:14px 10px 50px}.plan-field{grid-template-columns:1fr}.plan-field-help,.plan-state{grid-column:1}}
/* Le planning qui se remplit seul (lot PLANNING-AUTO, 2026-09-30) : rond vert = propose par l'IA, carre = confirme */
.plan-prop{background:rgba(25,197,143,.12);color:var(--color-gray-12);outline:1.5px dashed #19c58f;outline-offset:-1.5px}
.plan-dot.plan-prop,.plan-span.plan-prop,.plan-mobile-item.plan-prop{position:relative;padding-left:15px}
.plan-dot.plan-prop::before,.plan-span.plan-prop::before,.plan-mobile-item.plan-prop::before{content:"";position:absolute;left:5px;top:50%;width:6px;height:6px;margin-top:-3px;border-radius:50%;background:#19c58f}
.plan-bar.plan-prop,.plan-milestone.plan-prop{fill:rgba(25,197,143,.25);stroke:#19c58f;stroke-width:1.5;stroke-dasharray:3 2}
.plan-band{background-image:repeating-linear-gradient(135deg,rgba(255,255,255,.18) 0 6px,transparent 6px 12px)}
.plan-band.plan-prop{background-color:rgba(25,197,143,.1);background-image:none}
.plan-dup{box-shadow:inset 0 0 0 2px #d97706}
.plan-bar.plan-dup,.plan-milestone.plan-dup{stroke:#d97706;stroke-width:2}
.plan-swatch--prop{background:rgba(25,197,143,.15);border:1.5px dashed #19c58f;border-radius:50%}
.plan-swatch--dup{background:transparent;box-shadow:inset 0 0 0 2px #d97706}
.plan-swatch--band{background:repeating-linear-gradient(135deg,var(--color-gray-8) 0 3px,var(--color-gray-4) 3px 6px)}
.plan-legend--auto{margin-top:-4px}
.plan-notice--bad{background:#fef2f2;color:#991b1b}
.plan-tray{margin:0 0 12px;padding:10px 14px;border:1px solid var(--color-gray-5);border-radius:12px;background:var(--color-gray-1)}
.plan-tray-head{display:flex;align-items:center;gap:8px;cursor:pointer;list-style:none;font-weight:650;font-size:13.5px}
.plan-tray-head::-webkit-details-marker{display:none}
.plan-tray-dot{display:inline-block;flex:none;width:9px;height:9px;border-radius:50%;background:#19c58f;box-shadow:0 0 0 3px rgba(25,197,143,.2)}
.plan-tray-count{display:inline-block;min-width:20px;padding:1px 7px;border-radius:999px;background:var(--color-gray-12);color:var(--color-gray-1);font-size:11px;font-weight:650;text-align:center;font-variant-numeric:tabular-nums}
.plan-tray-empty{margin:4px 0;color:var(--color-gray-10)}
.plan-tray-list{display:grid;gap:0;margin:0;padding:0;list-style:none}
.plan-conflicts{margin:0 0 12px;padding:10px 14px;border:1px solid #fecaca;border-radius:12px;background:#fef2f2;color:#7f1d1d}
.plan-conflicts-title{display:flex;align-items:center;gap:8px;margin:0 0 6px;font-size:13.5px;font-weight:650}
.plan-conflicts-mark{display:inline-grid;place-items:center;width:16px;height:16px;border-radius:50%;background:#dc2626;color:#fff;font-size:11px;font-weight:700}
.plan-conflicts-list{display:grid;gap:4px;margin:0;padding:0 0 0 18px;font-size:12.5px;line-height:1.45;list-style:disc}
.plan-conflicts .plan-link{color:inherit}
.plan-sites{overflow:hidden;border:1px solid var(--color-gray-5);border-radius:12px;background:var(--color-gray-1)}
.plan-sites-head,.plan-site{display:grid;grid-template-columns:minmax(150px,220px) minmax(0,1fr)}
.plan-sites-corner{padding:6px 10px;border-bottom:1px solid var(--color-gray-4);background:var(--color-gray-2);color:var(--color-gray-10);font-size:11px;font-weight:600}
.plan-site{border-bottom:1px solid var(--color-gray-4)}
.plan-site:last-child{border-bottom:0}
.plan-site:nth-child(odd){background:var(--color-gray-2)}
.plan-site--closed{opacity:.75}
.plan-site-name{display:flex;align-items:flex-start;gap:6px;min-width:0;padding:8px 10px;border-right:1px solid var(--color-gray-4);font-weight:600;font-size:12.5px}
.plan-site-link{overflow:hidden;min-width:0;color:var(--color-gray-12);text-overflow:ellipsis;white-space:nowrap}
.plan-site-link:hover{text-decoration:underline}
.plan-site-none{color:var(--color-gray-9);font-style:italic}
.plan-site-badge{flex:none;padding:0 6px;border-radius:999px;background:var(--color-gray-4);color:var(--color-gray-10);font-size:10.5px;font-weight:500}
.plan-site-focus{flex:none;margin-left:auto;color:var(--color-gray-8)}
.plan-site-focus:hover{color:var(--color-gray-12)}
.plan-site-days{min-width:0}
.plan-site-days .plan-week-bars{padding:5px 0 2px;border-bottom:0}
.plan-site-cells{min-height:38px}
.plan-mobile{display:none}
.plan-mobile-confirm{display:flex;align-items:center;gap:8px;margin:0 0 10px;padding:9px 12px;border:1.5px dashed #19c58f;border-radius:10px;background:rgba(25,197,143,.08);font-weight:600}
.plan-mobile-day{margin:0 0 12px}
.plan-mobile-title{margin:0 0 5px;color:var(--color-gray-10);font-size:11.5px;font-weight:650;letter-spacing:.04em;text-transform:uppercase}
.plan-mobile-list{display:grid;gap:5px;margin:0;padding:0;list-style:none}
.plan-mobile-item{display:block;overflow:hidden;padding:9px 11px;border-radius:9px;color:#fff;font-size:13px;line-height:1.3;text-overflow:ellipsis;white-space:nowrap}
.plan-mobile-item.plan-prop{color:var(--color-gray-12)}
.plan-conductors{width:100%;border-collapse:collapse;font-size:12.5px}
.plan-conductors th,.plan-conductors td{padding:7px 10px;border-bottom:1px solid var(--color-gray-4);text-align:left;vertical-align:middle}
.plan-conductors thead th{color:var(--color-gray-9);font-size:11px;font-weight:600}
.plan-conductors-status,.plan-conductors-hint{color:var(--color-gray-10);white-space:nowrap}
.plan-conductors-hint .plan-tray-dot{margin-right:6px}
.plan-conductors-form{display:grid;gap:12px}
.plan-conductors-guess{margin-top:16px}
@media(max-width:640px){.plan-desk{display:none}.plan-mobile{display:block}.plan-filters{padding:8px}.plan-period-label{flex-basis:100%;margin:4px 0 0}}
.dash-periods{display:flex;flex-wrap:wrap;align-items:center;gap:4px;margin:0 0 12px}
.dash-periods-label{margin-right:4px;color:var(--color-gray-9);font-size:11px;font-weight:600;letter-spacing:.04em;text-transform:uppercase}
.dash-periods-sep{width:1px;height:16px;margin:0 6px;background:var(--color-gray-5)}
.dash-chip{display:inline-flex;align-items:center;height:24px;padding:0 9px;border:1px solid var(--color-gray-5);border-radius:999px;background:var(--color-gray-1);color:var(--color-gray-11);font-size:12px;font-variant-numeric:tabular-nums;white-space:nowrap;text-decoration:none}
.dash-chip:hover{background:var(--color-gray-3);color:var(--color-gray-12)}
.dash-chip-on{border-color:transparent;background:var(--color-accent-9,#749366);color:#fff}
.dash-chip-on:hover{background:var(--color-accent-10,#658457);color:#fff}
.dash-nofilter{flex:none;margin-left:auto;padding:1px 6px;border-radius:999px;background:var(--color-gray-3);color:var(--color-gray-9);font-size:10.5px;white-space:nowrap;cursor:help}
.dash-kpi{container-type:inline-size;display:flex;height:100%;width:100%;flex-direction:column;align-items:center;justify-content:center;gap:4px;padding:0 4px;text-align:center}
.dash-kpi-value{max-width:100%;overflow:hidden;color:var(--color-gray-12);font-size:clamp(1.125rem,12cqw,2.25rem);font-weight:600;line-height:1.1;font-variant-numeric:tabular-nums;white-space:nowrap;text-overflow:ellipsis;cursor:default}
.dash-kpi-compare{display:flex;flex-wrap:wrap;justify-content:center;gap:2px 8px;color:var(--color-gray-9);font-size:12px;font-variant-numeric:tabular-nums;white-space:nowrap}
.dash-kpi-sub{max-width:100%;overflow:hidden;color:var(--color-gray-9);font-size:13px;font-weight:500;white-space:nowrap;text-overflow:ellipsis}
.dash-delta{font-weight:600;color:var(--color-gray-11)}
.dash-delta-up{color:var(--color-green-700,#15803d)}
.dash-delta-down{color:var(--color-red-700,#b91c1c)}
.dash-kpi-cover{max-width:100%;overflow:hidden;color:var(--color-amber-700,#a15c07);font-size:11.5px;white-space:nowrap;text-overflow:ellipsis;cursor:help}
/* La liste des tableaux de bord (D1) et leurs accès (D3). Feuille maison :
   le Tailwind est figé, une classe neuve dans un html! y serait inerte. */
.dl-page,.da-page{display:flex;flex-direction:column;gap:16px;padding:20px 24px;min-width:0}
.dl-head{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px}
.dl-h1{margin:0;color:var(--color-gray-12);font-size:20px;font-weight:600;letter-spacing:-.02em}
.dl-actions{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.dl-btn{display:inline-flex;align-items:center;gap:6px;height:30px;padding:0 12px;border:1px solid var(--color-gray-6);border-radius:8px;background:var(--color-gray-1);color:var(--color-gray-12);font-size:13px;font-weight:500;text-decoration:none;cursor:pointer;list-style:none}
.dl-btn::-webkit-details-marker{display:none}
.dl-btn:hover{background:var(--color-gray-3)}
.dl-btn-p{border-color:var(--color-gray-12);background:var(--color-gray-12);color:var(--color-gray-1)}
.dl-btn-p:hover{background:var(--color-gray-11)}
.dl-seg{display:inline-flex;border:1px solid var(--color-gray-6);border-radius:8px;overflow:hidden}
.dl-seg-b{height:28px;padding:0 12px;border:0;background:var(--color-gray-1);color:var(--color-gray-11);font-size:13px;cursor:pointer}
.dl-seg-on{background:var(--color-gray-12);color:var(--color-gray-1)}
.dl-new{position:relative}
.dl-new-form{position:absolute;right:0;z-index:30;display:flex;flex-direction:column;gap:8px;width:260px;margin-top:6px;padding:12px;border:1px solid var(--color-gray-5);border-radius:10px;background:var(--color-gray-1);box-shadow:0 12px 30px rgba(12,13,15,.12)}
.dl-new-form input{height:30px;padding:0 8px;border:1px solid var(--color-gray-6);border-radius:6px;background:var(--color-gray-1);color:var(--color-gray-12);font-size:13px}
.dl-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:14px}
.dl-card{display:flex;flex-direction:column;min-width:0;border:1px solid var(--color-gray-5);border-radius:12px;background:var(--color-gray-1);color:inherit;text-decoration:none;overflow:hidden}
.dl-card:hover{border-color:var(--color-gray-8)}
.dl-card:focus-visible{outline:2px solid var(--color-gray-12);outline-offset:2px}
.dl-thumb{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));grid-auto-rows:6px;gap:3px;height:96px;padding:10px;overflow:hidden;border-bottom:1px solid var(--color-gray-4);background:var(--color-gray-2)}
.dl-case{display:block;border:1px solid var(--color-gray-5);border-radius:3px;background:var(--color-gray-1)}
.dl-case-g{background:linear-gradient(to top,rgba(25,197,143,.18) 55%,var(--color-gray-1) 55%)}
.dl-meta{display:grid;gap:8px;padding:12px 14px}
.dl-title{margin:0;color:var(--color-gray-12);font-size:14.5px;font-weight:600;overflow-wrap:anywhere}
.dl-row{display:flex;flex-wrap:wrap;align-items:center;gap:6px;color:var(--color-gray-10);font-size:12.5px}
.dl-avatar{display:inline-grid;place-items:center;width:20px;height:20px;border:1px solid var(--color-gray-6);border-radius:50%;background:var(--color-gray-2);color:var(--color-gray-11);font-size:9.5px;font-weight:600}
.dl-chip{display:inline-flex;align-items:center;padding:3px 7px;border-radius:6px;background:var(--color-gray-3);color:var(--color-gray-11);font-size:11.5px;font-weight:500}
.dl-chip-lock{background:var(--color-amber-50);color:var(--color-amber-700)}
.dl-chip-access{background:var(--signal-soft,rgba(25,197,143,.14));color:var(--signal-text,#086648)}
.dl-empty{color:var(--color-gray-10);font-size:13px}
.dl-archives>summary{cursor:pointer;color:var(--color-gray-10);font-size:13px;font-weight:500;margin-bottom:12px}
.dl-table-wrap{overflow-x:auto;border:1px solid var(--color-gray-5);border-radius:10px;background:var(--color-gray-1)}
.dl-table{width:100%;border-collapse:collapse;font-size:13px}
.dl-table th{padding:9px 12px;border-bottom:1px solid var(--color-gray-5);background:var(--color-gray-2);color:var(--color-gray-10);font-size:11px;font-weight:500;letter-spacing:.05em;text-align:left;text-transform:uppercase;white-space:nowrap}
.dl-table td{padding:9px 12px;border-bottom:1px solid var(--color-gray-4);color:var(--color-gray-12);vertical-align:top}
.dl-table tr:last-child td{border-bottom:0}
.dl-table a{color:var(--color-gray-12);font-weight:500}
.dl-num{text-align:right;font-variant-numeric:tabular-nums}
.dl-sharebar{display:flex;justify-content:flex-end;padding:10px 24px 0}
.da-cols{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.3fr);gap:16px;align-items:start}
@media (max-width:900px){.da-cols{grid-template-columns:minmax(0,1fr)}}
.da-panel{display:flex;flex-direction:column;gap:10px;min-width:0;padding:16px;border:1px solid var(--color-gray-5);border-radius:12px;background:var(--color-gray-1)}
.da-panel fieldset{display:flex;flex-direction:column;gap:10px;margin:0;padding:0;border:0;min-width:0}
.da-h2{margin:0;color:var(--color-gray-12);font-size:15px;font-weight:600}
.da-h3{margin:6px 0 0;color:var(--color-gray-10);font-size:11px;font-weight:600;letter-spacing:.06em;text-transform:uppercase}
.da-muted{margin:0;color:var(--color-gray-10);font-size:12.5px}
.da-notice{margin:0;padding:8px 12px;border-radius:8px;background:var(--signal-soft,rgba(25,197,143,.12));color:var(--signal-text,#086648);font-size:13px}
.da-modes{gap:8px}
.da-mode,.da-check{display:flex;align-items:center;gap:8px;color:var(--color-gray-12);font-size:13px}
.da-checks{display:flex;flex-direction:column;gap:6px;max-height:220px;overflow:auto}
.da-cell{text-align:center;white-space:nowrap}
.da-dot{display:inline-block;width:10px;height:10px;border-radius:50%;background:var(--color-gray-6);vertical-align:middle}
.da-dot-ok{background:#19c58f}
.da-closed{margin-left:6px;color:var(--color-amber-700);font-size:11.5px}
.da-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
/* La grille d'un tableau de bord. L'enveloppe est le conteneur `dash` ; la
   grille garde ses douze colonnes au large (chaque tuile placée par sa boîte),
   passe à deux colonnes sous 640 px (un chiffre par demi-largeur, le reste en
   pleine largeur, dans l'ordre de lecture), puis à une seule sous 300 px. */
.dash-wrap{container:dash / inline-size}
.dash-grid{display:grid;gap:12px;grid-auto-rows:88px;grid-template-columns:repeat(12,minmax(0,1fr))}
.dash-cell{grid-column:var(--dash-col);grid-row:var(--dash-row);min-width:0}
@container dash (width < 640px){
.dash-grid{grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-flow:row dense}
.dash-cell{grid-column:span 2;grid-row:span var(--dash-h)}
.dash-cell-sm{grid-column:span 1}
}
@container dash (width < 300px){
.dash-grid{grid-template-columns:minmax(0,1fr)}
.dash-cell,.dash-cell-sm{grid-column:1 / -1}
}
/* La production d'atelier (studio Production, 2026-09-29) — Tailwind figé : règles à la main, préfixe .prod- */
.prod-page{display:flex;flex-direction:column;gap:22px}
.prod-muted{color:var(--color-gray-10);font-size:12px}
.prod-h2{margin:0;font-size:14px;font-weight:650;letter-spacing:-.01em;color:var(--color-gray-12)}
.prod-h3{margin:0 0 8px;font-size:12.5px;font-weight:650;color:var(--color-gray-12)}
.prod-count{display:inline-block;min-width:18px;padding:0 6px;border-radius:999px;background:var(--signal,#19c58f);color:#0c0d0f;font-size:11px;font-weight:650;text-align:center}
.prod-board{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;align-items:start}
.prod-col{display:flex;flex-direction:column;gap:8px;min-width:0;padding:10px;border-radius:12px;background:var(--color-gray-2);border:1px solid var(--color-gray-4)}
.prod-col-head{display:flex;align-items:center;gap:7px;font-size:12px;font-weight:650;color:var(--color-gray-11)}
.prod-col-title{flex:1;min-width:0}
.prod-col-count{padding:1px 7px;border-radius:999px;background:var(--color-gray-4);color:var(--color-gray-11);font-size:11px;font-variant-numeric:tabular-nums}
.prod-col-empty{margin:6px 2px;color:var(--color-gray-8);font-size:12px}
.prod-col-toggle{align-self:flex-start;color:var(--color-gray-10);font-size:12px;border-bottom:1px dotted var(--color-gray-7)}
.prod-col--folded{background:transparent;border-style:dashed}
.prod-dot{flex:none;width:8px;height:8px;border-radius:2px;background:var(--color-gray-12)}
.prod-dot--livre{border-radius:50%;background:var(--signal,#19c58f)}
.prod-card{display:flex;flex-direction:column;gap:6px;min-width:0;padding:10px;border-radius:10px;background:var(--color-gray-1);border:1px solid var(--color-gray-5);box-shadow:0 1px 2px rgba(12,13,15,.04)}
.prod-card--alert{border-color:#dc2626}
.prod-card-name{font-size:13px;font-weight:600;color:var(--color-gray-12);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.prod-card-name:hover{text-decoration:underline}
.prod-card-project{margin-top:-4px;color:var(--color-gray-10);font-size:12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.prod-card-meta{display:flex;flex-wrap:wrap;gap:4px}
.prod-element{padding:1px 6px;border-radius:4px;background:rgba(138,106,68,.13);color:#8a6a44;font-size:11px;font-weight:600}
.prod-week{padding:1px 6px;border-radius:4px;border:1px solid var(--color-gray-6);color:var(--color-gray-11);font-size:11px;font-variant-numeric:tabular-nums;white-space:nowrap}
.prod-card-trucks{display:flex;align-items:center;gap:6px;color:var(--color-gray-11);font-size:11.5px;font-variant-numeric:tabular-nums}
.prod-trucks{display:inline-flex;flex-wrap:wrap;gap:3px}
.prod-truck{display:inline-block;flex:none;width:14px;height:9px;border-radius:2px;border:1.5px solid var(--color-gray-12)}
.prod-truck--on{background:var(--color-gray-12)}
.prod-progress{height:4px;border-radius:999px;background:var(--color-gray-4);overflow:hidden}
.prod-progress-bar{display:block;height:100%;background:var(--color-gray-12)}
.prod-alert{display:flex;gap:6px;align-items:flex-start;margin:0;padding:5px 7px;border:1px solid #dc2626;border-radius:7px;background:rgba(220,38,38,.07);color:var(--danger,#b42318);font-size:11.5px}
.prod-alert::before{content:"!";flex:none;display:inline-grid;place-items:center;width:14px;height:14px;border-radius:50%;background:#dc2626;color:#fff;font-size:9px;font-weight:700}
.prod-next{margin:0}
.prod-next-button{width:100%;padding:6px 8px;border:1px solid var(--color-gray-6);border-radius:8px;background:transparent;color:var(--color-gray-12);font-size:12px;cursor:pointer;text-align:left}
.prod-next-button::before{content:"";display:inline-block;width:6px;height:6px;margin-right:6px;border-radius:50%;background:var(--signal,#19c58f);vertical-align:middle}
.prod-next-button:hover{background:var(--color-gray-3)}
.prod-next-button:focus-visible,.prod-rail-button:focus-visible,.prod-yes:focus-visible,.prod-no:focus-visible{outline:2px solid var(--color-gray-12);outline-offset:2px}
.prod-charge{padding:14px 16px;border:1px solid var(--color-gray-5);border-radius:12px;background:var(--color-gray-1)}
.prod-charge-head{display:flex;flex-wrap:wrap;align-items:center;gap:8px 14px;margin-bottom:14px}
.prod-charge-head .plan-header-link{margin-left:auto}
.prod-charge-chart{position:relative;display:grid;grid-auto-flow:column;grid-auto-columns:minmax(34px,1fr);gap:6px;align-items:end;height:150px;padding-top:16px;overflow-x:auto;border-bottom:1px solid var(--color-gray-6)}
.prod-charge-col{display:flex;flex-direction:column;justify-content:flex-end;align-items:stretch;height:100%;min-width:0}
.prod-charge-bar{position:relative;display:block;min-height:2px;border-radius:4px 4px 0 0;background:var(--color-gray-12)}
.prod-charge-bar b{position:absolute;top:-15px;left:0;right:0;text-align:center;font-size:10.5px;font-weight:650;color:var(--color-gray-12);font-variant-numeric:tabular-nums}
.prod-charge-bar--over{background:#dc2626}
.prod-charge-label{margin-top:4px;text-align:center;font-size:10px;color:var(--color-gray-9);font-variant-numeric:tabular-nums}
.prod-charge-col--now .prod-charge-label{color:var(--color-gray-12);font-weight:700}
.prod-charge-cap{position:absolute;left:0;right:0;border-top:1.5px dashed #dc2626;pointer-events:none;z-index:1}
.prod-charge-cap span{position:absolute;left:0;top:-15px;padding:0 4px;background:var(--color-gray-1);color:var(--danger,#b42318);font-size:10px}
.prod-cap-form{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:12px}
.prod-cap-input{width:80px}
.prod-record{display:flex;flex-direction:column;min-height:0;height:100%}
.prod-record-body{flex:1;min-height:0;display:flex;flex-direction:column}
.prod-sheet{flex:none;display:flex;flex-direction:column;gap:10px;margin:12px 16px 4px;padding:14px;border:1px solid var(--color-gray-5);border-radius:12px;background:var(--color-gray-1);font-size:13px;max-height:55vh;overflow:auto}
.prod-sheet-top{display:flex;flex-wrap:wrap;align-items:center;gap:10px 16px}
.prod-rail{display:flex;flex-wrap:wrap;gap:4px;margin:0;padding:0;list-style:none}
.prod-rail-step{display:flex}
.prod-rail-step form{margin:0}
.prod-rail-step>span,.prod-rail-button{display:inline-block;padding:4px 10px;border-radius:999px;border:1px solid var(--color-gray-6);background:transparent;color:var(--color-gray-10);font-size:12px;white-space:nowrap}
.prod-rail-button{cursor:pointer}
.prod-rail-button:hover{background:var(--color-gray-3);color:var(--color-gray-12)}
.prod-rail-step--done>span,.prod-rail-step--done .prod-rail-button{background:var(--color-gray-12);border-color:var(--color-gray-12);color:var(--color-gray-1)}
.prod-rail-step--now>span{border-color:var(--color-gray-12);color:var(--color-gray-12);font-weight:650;box-shadow:inset 0 -2px 0 var(--signal,#19c58f)}
.prod-sheet-facts{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px}
.prod-status{font-weight:600}
.prod-props{display:flex;flex-direction:column;gap:6px;padding:10px;border:1px dashed var(--signal,#19c58f);border-radius:10px;background:rgba(25,197,143,.08)}
.prod-prop{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.prod-prop-text{flex:1;min-width:200px;display:flex;flex-direction:column;gap:1px}
.prod-prop-actions{display:flex;gap:6px;margin:0}
.prod-yes,.prod-no{padding:5px 10px;border-radius:8px;font-size:12px;cursor:pointer}
.prod-yes{border:1px solid var(--color-gray-12);background:var(--color-gray-12);color:var(--color-gray-1)}
.prod-no{border:1px solid var(--color-gray-6);background:transparent;color:var(--color-gray-11)}
.prod-sheet-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.6fr);gap:12px}
.prod-panel{min-width:0;padding:10px;border:1px solid var(--color-gray-4);border-radius:10px;background:var(--color-gray-2)}
.prod-truck-row{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:8px;padding:5px 0;border-top:1px solid var(--color-gray-4);font-size:12px}
.prod-truck-text{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.prod-truck-text a{color:inherit;border-bottom:1px dotted var(--color-gray-7)}
.prod-truck-status{font-weight:600;font-size:11.5px}
.prod-slots{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.prod-slot{min-width:0;display:flex;flex-direction:column;gap:5px;padding:8px;border:1px solid var(--color-gray-5);border-radius:8px;background:var(--color-gray-1)}
.prod-slot-title{margin:0;font-size:10.5px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--color-gray-10)}
.prod-file{display:flex;align-items:center;gap:5px;min-width:0;font-size:12px}
.prod-file a,.prod-file>span:not([class]){min-width:0;flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:inherit}
.prod-file a:hover{text-decoration:underline}
.prod-file--old{opacity:.55}
.prod-file--old a,.prod-file--old>span:not([class]){text-decoration:line-through}
.prod-ext{flex:none;padding:0 4px;border-radius:3px;background:var(--color-gray-4);color:var(--color-gray-11);font:600 9.5px ui-monospace,monospace}
.prod-index{flex:none;font:600 10.5px ui-monospace,monospace;color:var(--color-gray-12)}
.prod-file-state{flex:none;font-size:10.5px;color:var(--color-gray-9)}
.prod-file:not(.prod-file--old) .prod-file-state{color:var(--color-gray-12);font-weight:600}
@media (max-width:1100px){.prod-board{grid-template-columns:repeat(5,minmax(220px,1fr));overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:6px}.prod-col{scroll-snap-align:start}}
@media (max-width:760px){
.prod-board{grid-template-columns:repeat(5,85vw);gap:8px}
.prod-sheet{margin:8px;max-height:none}
.prod-sheet-grid{grid-template-columns:minmax(0,1fr)}
.prod-slots{grid-template-columns:minmax(0,1fr)}
.prod-charge-head .plan-header-link{margin-left:0}
}
/* ==========================================================================
   P9 — les templates de page (lot 1, 2026-10-02) : la page composée, sa
   grille libre de 12 colonnes, et les trois blocs du socle (champs, onglets,
   texte riche). Classes ÉCRITES À LA MAIN : Tailwind est figé. Chaque
   famille de blocs a sa feuille, assets/b/tpl-<famille>.css.
   Gabarits : crates/web/src/templates/.
   ========================================================================== */
.tpl-page{display:flex;flex:1;flex-direction:column;min-width:0;min-height:0;height:100%;overflow:hidden;background:var(--paper);color:var(--ink)}
.tpl-scroll{flex:1;min-height:0;overflow:auto}
.tpl-content{width:min(1480px,100%);margin:0 auto;padding:20px 24px 72px;font-size:13px}
.tpl-deleted{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:8px 24px;border-bottom:1px solid var(--line);background:var(--paper-2);color:var(--ink);font-size:13px}
.tpl-head-btn{display:inline-flex;align-items:center;gap:6px;height:28px;padding:0 10px;border:1px solid var(--line-2);border-radius:6px;background:var(--card);color:var(--ink);font-size:13px;font-weight:500;text-decoration:none;cursor:pointer;white-space:nowrap}
.tpl-head-btn:hover{background:var(--paper-2)}
.tpl-head-btn-danger{color:var(--danger)}
/* Des ACCROCHES, sans règle à dessein — pour les tests, les scénarios et
   les attributs data-* qu'elles portent, jamais pour le style : .tpl-banner
   (l'enveloppe du bandeau ; .tpl-deleted le dessine), .tpl-root (la grille
   d'une fiche, data-template / data-variante), .tpl-texte-champ (le champ
   RICH_TEXT éditable du bloc texte riche), et dans l'en-tête de page
   (app_shell::page_header) .page-head-l, .page-head-ic, .page-head-a, que
   leurs utilitaires Tailwind mettent en page. Un style voulu sur l'une
   d'elles s'écrit ICI, à la main : Tailwind est figé. */
/* La grille : chaque cellule placée par son style (grid-column / grid-row). */
.tpl-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:16px;align-items:start}
.tpl-cell{min-width:0}
/* Au téléphone, une colonne : le flux HTML est déjà l'ordre de lecture (y, puis x). */
@media (max-width:767px){
.tpl-content{padding:14px 12px 56px}
.tpl-grid{display:flex;flex-direction:column;align-items:stretch;gap:12px}
.tpl-cell{grid-column:auto!important;grid-row:auto!important}
}
/* Le cadre commun d'un bloc */
.tpl-bloc{border:1px solid var(--line);border-radius:10px;background:var(--card);padding:14px 16px}
.tpl-bloc-t{margin:0 0 10px;font:600 13px/1.3 var(--font);color:var(--ink)}
.tpl-dash{color:var(--ink-3)}
.tpl-vide{margin:0;color:var(--ink-3)}
/* « champs » */
.tpl-champs-l{display:grid;grid-template-columns:repeat(var(--tpl-cols,1),minmax(0,1fr));column-gap:24px;margin:0}
.tpl-cols-1{--tpl-cols:1}
.tpl-cols-2{--tpl-cols:2}
.tpl-cols-3{--tpl-cols:3}
.tpl-champ{display:grid;grid-template-columns:minmax(110px,40%) minmax(0,1fr);align-items:center;min-height:34px;border-bottom:1px solid var(--line)}
.tpl-champ-k{display:flex;align-items:center;gap:8px;min-width:0;color:var(--ink-2);font-size:12px}
.tpl-champ-k svg{flex:none;color:var(--ink-3)}
.tpl-champ-k span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tpl-champ-v{min-width:0;margin:0;padding:4px 0;color:var(--ink);font-size:13px}
.tpl-champ-ed{display:flex;align-items:center;min-height:30px;margin:0 -6px;padding:0 6px;border-radius:6px;cursor:pointer;outline:none}
.tpl-champ-ed:hover{background:var(--paper-2)}
.tpl-champ-ed:focus{box-shadow:var(--ring-ink)}
.tpl-fiche-titre{margin:0 0 14px;min-width:0}
.tpl-fiche-titre-t{margin:0;color:var(--ink);font-size:20px;font-weight:600;line-height:1.3;overflow-wrap:anywhere}
.tpl-fiche-titre-ed{display:block;width:fit-content;max-width:100%;margin:0 -6px;padding:2px 6px;border-radius:6px;color:inherit;text-decoration:none;cursor:pointer;outline:none}
.tpl-fiche-titre-ed:hover{background:var(--paper-2)}
.tpl-fiche-titre-ed:focus{box-shadow:var(--ring-ink)}
@media (max-width:767px){.tpl-champs-l{grid-template-columns:minmax(0,1fr)}}
/* « onglets » : une barre de liens, puis la grille de l'onglet actif */
.tpl-bloc.tpl-onglets{padding:0}
.tpl-tabs{display:flex;gap:18px;overflow-x:auto;padding:0 16px;border-bottom:1px solid var(--line)}
.tpl-tab{display:inline-flex;align-items:center;gap:6px;padding:12px 0 10px;border-bottom:2px solid transparent;color:var(--ink-2);font-size:13px;font-weight:500;white-space:nowrap;text-decoration:none}
.tpl-tab:hover{color:var(--ink)}
.tpl-tab[aria-current=page]{border-bottom-color:var(--ink);color:var(--ink)}
.tpl-tab-n{display:inline-flex;align-items:center;justify-content:center;min-width:18px;height:18px;padding:0 5px;border-radius:999px;background:var(--paper-2);color:var(--ink-3);font-size:11px;font-weight:500;line-height:1;font-variant-numeric:tabular-nums}
.tpl-tab[aria-current=page] .tpl-tab-n{background:var(--line);color:var(--ink)}
.tpl-tab.is-empty{color:var(--ink-3)}
.tpl-tabpane{padding:16px}
/* « texte riche » */
.tpl-texte-md{color:var(--ink);font-size:13px;line-height:1.55}
[data-search-passage] mark,.enr-text mark{background:color-mix(in srgb,var(--ink) 8%,transparent);color:inherit;border-radius:2px}

/* ==========================================================================
   escouade-b.css — l'identité B d'Escouade, écrite à la main (lot 0, 2026-09-29)

   POURQUOI UNE FEUILLE À PART. `app.css` est la compilation Tailwind de
   `globals.css`, et le moteur n'est plus sur le poste (il vivait dans la
   source TypeScript, retirée le 2026-09-08) : une classe utilitaire NEUVE
   dans un `html!` serait inerte, sans le moindre avertissement. Les couleurs
   de l'ancien thème passent par des variables (`--color-gray-1…12`,
   `--color-accent-1…12`) : elles sont remappées sur les jetons ci-dessous
   dans `globals.css` ET `app.css`. Tout le reste — la police, les rayons, le
   focus à l'encre, le mouvement, le signal, les composants de base — est ici.

   ORDRE DE SERVICE (`crates/api/build.rs`, `pages/assets.rs`) : une
   seule réponse `/pkg/app.css` = `app.css`, puis CETTE feuille, puis les
   feuilles d'écran `assets/b/*.css` (nav, chat, cc, list, biblio, graphe,
   compta, auto, puis les autres par ordre alphabétique). Une règle d'écran
   gagne donc sur une règle d'ici à spécificité égale. Les règles de
   composants d'ici sont écrites bas (`:where()`) partout où un écran voudra
   les reprendre.

   Rien de tout cela n'est en `@layer` : une règle d'ici l'emporte sur TOUT
   utilitaire Tailwind (qui vit dans `@layer utilities`), quelle que soit la
   spécificité. C'est voulu pour les crochets `esc-*` ; c'est aussi pourquoi
   aucune règle d'ici ne vise un élément nu (`button { … }`).

   Référence : `_studio/escouade/tokens.css` (repris tels quels, noms compris),
   `kit-v2.html`, `kit/UI.html` — variantes retenues BTN-B, CHAMP-A, BADGE-A,
   VIDE-A, MODALE-B. La règle de fond : UNE couleur, le signal #19c58f,
   réservée à ce qui bouge — jamais en texte, jamais sur une source citée,
   jamais sur le fond de « Valider ».
   ========================================================================== */

/* ---- Geist, embarquée (licence OFL, assets/fonts/OFL.txt) -----------------
   Servie par l'origine (`/pkg/fonts/*`) : aucun appel à Google Fonts. Fonte
   variable ; les deux sous-ensembles sont ceux de Google Fonts. */
@font-face {
  font-family: "Geist";
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url("/pkg/fonts/geist-latin-ext.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: "Geist";
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url("/pkg/fonts/geist-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* ==========================================================================
   LES JETONS — `_studio/escouade/tokens.css` (v2, 28/09/2026), tels quels.
   Contrastes WCAG 2.1 notés à côté de chaque jeton.
   ========================================================================== */
:root {
  color-scheme: light;

  /* ---- Surfaces ---------------------------------------------------------- */
  --paper:        #fafaf8;   /* fond de page                                  */
  --paper-2:      #f2f2ef;   /* fond en retrait : puces, pistes, champs       */
  --card:         #ffffff;   /* cartes, fenêtres, menus                        */
  --line:         #e6e6e1;   /* filet par défaut (décor, 1,2:1)                */
  --line-2:       #d6d6d0;   /* filet appuyé : bouton fantôme, séparateur fort */

  /* ---- Encre (texte) ------------------------------------------------------ */
  --ink:          #0c0d0f;   /* texte principal · 18,6 sur papier              */
  --ink-2:        #565a63;   /* texte second · 6,6 sur papier, 6,2 sur paper-2 */
  --ink-3:        #6b6e76;   /* texte tertiaire · 4,9 sur papier, 4,6 sur paper-2 */
  --ink-faint:    #9a9ca3;   /* décor, désactivé, pictos secondaires. JAMAIS
                                de texte à lire (2,6:1)                        */

  /* ---- Le signal : la seule couleur -------------------------------------- */
  --signal:       #19c58f;   /* ce qui bouge. Jamais en texte sur clair (2,1)  */
  --signal-text:  #086648;   /* le vert en TEXTE sur clair · 6,7 sur papier    */
  --signal-soft:  rgba(25, 197, 143, .15);  /* halo d'un élément actif       */
  --signal-glow:  rgba(25, 197, 143, .24);  /* pulsation, lueur du noyau     */
  --on-signal:    #0c0d0f;   /* texte posé sur le signal · 8,7                 */

  /* ---- Nuit (bandes et scènes sombres, identiques dans les deux thèmes) ---- */
  --night:        #0c0d0f;
  --night-2:      #16181c;
  --night-line:   #26292f;
  --night-line-2: #3a3e45;
  --night-ink:    #ffffff;   /* 19,4 sur nuit                                  */
  --night-ink-2:  #8a8e97;   /* 5,9 sur nuit                                   */
  --night-danger: #f97066;   /* refus sur nuit (le --danger sombre) · 7,0      */

  /* ---- Rôles dérivés (à utiliser dans les composants) -------------------- */
  --bg:           var(--paper);
  --text:         var(--ink);
  --btn-bg:       var(--ink);     /* bouton principal : encre, jamais vert     */
  --btn-ink:      var(--paper);   /* 18,6                                      */
  --btn-dot:      var(--signal);  /* le point d'action du bouton principal     */
  --focus:        var(--ink);     /* contour de focus : encre, 2 px, décalé 3 px */
  --cite-bg:      var(--paper-2); /* appel de source : un CARRÉ, jamais vert    */
  --cite-ink:     var(--ink-2);
  --cite-bg-on:   var(--ink);     /* appel survolé ou actif                     */
  --cite-ink-on:  var(--paper);
  --danger:       #b42318;        /* erreur · 6,3 sur papier. Jamais le signal  */

  /* ---- Typographie : Geist, échelle retenue ------------------------------- */
  --font:         "Geist", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-features: "ss01", "tnum";
  /*                taille / interligne / approche / graisse                   */
  --t-display:    600 clamp(35px, 4.6vw, 58px)/1.04 var(--font);  /* ls -.045em · héros   */
  --t-h1:         600 34px/1.08 var(--font);                       /* ls -.035em · section */
  --t-h2:         600 22px/1.2  var(--font);                       /* ls -.02em            */
  --t-h3:         600 20px/1.25 var(--font);                       /* ls -.02em · titre de bloc */
  --t-lead:       400 17.5px/1.5 var(--font);                      /* ls -.005em · chapeau */
  --t-body:       400 15px/1.5 var(--font);
  --t-ui:         500 14px/1.4 var(--font);                        /* boutons, navigation  */
  --t-small:      400 13px/1.45 var(--font);
  --t-caption:    400 12px/1.4 var(--font);
  --t-label:      500 10.5px/1.2 var(--font);                      /* capitales, ls .06em  */
  --ls-display:   -.045em;
  --ls-h1:        -.035em;
  --ls-h2:        -.02em;
  --ls-tight:     -.01em;
  --ls-label:     .06em;

  /* ---- Rayons : carré = matière, rond = action ---------------------------- */
  --r-mark:       2px;    /* petit carré de matière (puce, légende)            */
  --r-cite:       4px;    /* appel de source                                    */
  --r-icon:       6px;    /* pastille d'icône de source                         */
  --r-sm:         8px;    /* petit bouton, champ, action secondaire            */
  --r-btn:        10px;   /* bouton                                             */
  --r:            12px;   /* carte, proposition                                 */
  --r-panel:      14px;   /* panneau                                            */
  --r-frame:      16px;   /* fenêtre produit, scène                             */
  --r-pill:       999px;  /* sur-titre, étiquette                               */
  --r-round:      50%;    /* LE ROND : agent, proposition, action en cours      */

  /* ---- Espacements (pas de 2, puis 4, puis 8) ----------------------------- */
  --s-1: 2px;  --s-2: 4px;  --s-3: 6px;  --s-4: 8px;  --s-5: 10px; --s-6: 12px;
  --s-7: 16px; --s-8: 20px; --s-9: 24px; --s-10: 32px; --s-11: 40px; --s-12: 48px;
  --s-13: 64px; --s-14: 88px;
  --page-max:     1328px;
  --gutter:       24px;

  /* ---- Ombres : discrètes, jamais de gros bloc ---------------------------- */
  --shadow-1:     0 1px 2px rgba(12, 13, 15, .04);                                  /* puce, carte posée */
  --shadow-frame: 0 1px 0 rgba(12, 13, 15, .02), 0 24px 60px -30px rgba(12, 13, 15, .18); /* fenêtre produit */
  --shadow-knob:  0 0 0 1px var(--line-2), 0 2px 6px rgba(12, 13, 15, .15);         /* curseur, poignée */
  --ring-ink:     0 0 0 3px rgba(12, 13, 15, .06);                                   /* carte de source active */
  --ring-signal:  0 0 0 4px var(--signal-soft);                                      /* élément qui bouge */

  /* ---- Mouvement ---------------------------------------------------------- */
  --ease:         cubic-bezier(.7, 0, .2, 1);    /* métamorphose : tracé, rond ↔ carré */
  --out:          cubic-bezier(.16, 1, .3, 1);   /* arrivée : ce qui entre et se pose  */
  --logo-ease:    cubic-bezier(.45, 0, .25, 1);  /* le logo animé (relais, signature)  */
  --d-hit:        150ms;   /* impact sur le noyau, lueur                      */
  --d-hover:      200ms;   /* couleur, filet au survol                        */
  --d-press:      320ms;   /* appui sur « Valider » avant l'application        */
  --d-morph:      500ms;   /* rond → carré dans l'interface (validé, appliqué) */
  --d-land:       600ms;   /* une ligne qui arrive (journal, notification)     */
  --d-enter:      900ms;   /* entrée d'un bloc, du signe                       */
  --d-draw:       1100ms;  /* un fil qui se trace                              */
  --d-pulse:      2200ms;  /* attente d'une validation (boucle)                */
  --d-relay-step: 1500ms;  /* relais du logo : 1,5 s par module (6 s le tour)  */
  --d-relay-turn: 360ms;   /* dont la bascule rond ↔ carré                      */
  --d-relay-load: 700ms;   /* relais d'un indicateur de chargement             */
  --d-signature:  3400ms;  /* signature du logo, une fois, après 400 ms        */
  --stagger-text: 110ms;   /* décalage entre lignes de titre                    */
  --stagger-item: 70ms;    /* décalage entre puces, fils                       */

  /* ---- Compléments du kit (kit/UI.html), dérivés des jetons -------------- */
  --shadow-pop:   0 1px 2px rgba(12, 13, 15, .06), 0 12px 32px -12px rgba(12, 13, 15, .28); /* menu, modale */
  --veil:         rgba(12, 13, 15, .32);                                           /* voile de modale */
  --scrim:        rgba(12, 13, 15, .07);                                           /* voile léger (historique du chat, CHAT.html) */
  --mono:         ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;        /* nom d'outil, code — jamais en vedette */
  --danger-soft:  color-mix(in srgb, var(--danger) 9%, var(--card));              /* fond d'un refus */
}

/* ---- Thème sombre : les mêmes rôles, redéfinis ------------------------------
   Le produit résout son thème côté serveur (`<html data-theme>`, toujours
   posé) ; le bloc `prefers-color-scheme` ne sert qu'aux pages qui n'en ont
   pas. */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    color-scheme: dark;
    --paper:       #0c0d0f;
    --paper-2:     #16181c;
    --card:        #121417;
    --line:        #26292f;
    --line-2:      #3a3e45;
    --ink:         #f4f4f1;   /* 17,6 sur papier sombre */
    --ink-2:       #a7abb3;   /* 8,4                    */
    --ink-3:       #8a8e97;   /* 5,9                    */
    --ink-faint:   #5d616a;   /* décor (3,1)            */
    --signal-text: #19c58f;   /* sur sombre, le signal se lit en texte · 8,7 */
    --signal-soft: rgba(25, 197, 143, .18);
    --on-signal:   #0c0d0f;
    --danger:      #f97066;   /* 7,0                     */
    --shadow-1:    0 1px 2px rgba(0, 0, 0, .3);
    --shadow-frame: 0 1px 0 rgba(0, 0, 0, .2), 0 24px 60px -30px rgba(0, 0, 0, .6);
    --ring-ink:    0 0 0 3px rgba(244, 244, 241, .08);
    --shadow-pop:  0 1px 2px rgba(0, 0, 0, .4), 0 12px 32px -12px rgba(0, 0, 0, .7);
    --veil:        rgba(0, 0, 0, .5);
    --scrim:       rgba(0, 0, 0, .45);
  }
}
:root[data-theme="dark"] {
  color-scheme: dark;
  --paper:       #0c0d0f;
  --paper-2:     #16181c;
  --card:        #121417;
  --line:        #26292f;
  --line-2:      #3a3e45;
  --ink:         #f4f4f1;
  --ink-2:       #a7abb3;
  --ink-3:       #8a8e97;
  --ink-faint:   #5d616a;
  --signal-text: #19c58f;
  --signal-soft: rgba(25, 197, 143, .18);
  --on-signal:   #0c0d0f;
  --danger:      #f97066;
  --shadow-1:    0 1px 2px rgba(0, 0, 0, .3);
  --shadow-frame: 0 1px 0 rgba(0, 0, 0, .2), 0 24px 60px -30px rgba(0, 0, 0, .6);
  --ring-ink:    0 0 0 3px rgba(244, 244, 241, .08);
  --shadow-pop:  0 1px 2px rgba(0, 0, 0, .4), 0 12px 32px -12px rgba(0, 0, 0, .7);
  --veil:        rgba(0, 0, 0, .5);
  --scrim:       rgba(0, 0, 0, .45);
}

/* ---- Le pont vers les variables de Tailwind --------------------------------
   `--font-sans` est remappé dans app.css ; `--font-inter` (la classe
   `font-inter` de l'enveloppe) n'a jamais été définie : elle l'est ici. Les
   transitions `transition-colors` du produit prennent la durée du survol.
   L'étoile de suivi (`--color-star`, boîte mail) est à l'encre : MAIL-A,
   `.star.on{color:var(--ink)}` — le jaune est exclu. */
:root {
  --font-inter: "Geist";
  --color-star: var(--ink);
  --default-transition-duration: var(--d-hover);
}

/* ==========================================================================
   BASE
   ========================================================================== */
html, body {
  font-family: var(--font);
  font-feature-settings: var(--font-features);
  -webkit-font-smoothing: antialiased;
}
::selection { background: color-mix(in srgb, var(--ink) 14%, transparent); }

/* Un déclencheur de menu et les entrées d'un menu sont des boutons, pas du
   texte (2026-10-21). `<button>` ne commence jamais une sélection ; `<summary>`
   et un lien, si : un double-clic sur « … » sélectionnait l'image de la cloche
   voisine, un glisser dans un menu ouvert ses libellés — et la sélection,
   teintée d'encre ci-dessus, s'y lisait comme un fond gris collé au texte et
   un carré gris autour de la cloche. Spécificité nulle : un écran la reprend. */
:where(details[data-dropdown] > summary, [role="menuitem"]) {
  -webkit-user-select: none;
  user-select: none;
}

/* Le focus clavier : l'encre, 2 px, décalé de 3 px — partout, même là où un
   utilitaire `focus:outline-none` l'avait éteint sans rien mettre à la place.
   Les champs de saisie en sont exclus : leur focus est le filet d'encre de
   CHAMP-A (plus bas). Spécificité nulle : un écran peut le redessiner. */
:where(:focus-visible):not(:where(input, textarea, select, [contenteditable="true"], [contenteditable=""])) {
  outline: 2px solid var(--focus);
  outline-offset: 3px;
}

/* L'encre claire du thème sombre : partout où le produit écrit en blanc sur
   le fond d'action (`bg-accent-9` / `bg-gray-9` + `text-white`, cases cochées
   comprises), le texte prend le papier. */
.bg-accent-9.text-white,
.bg-accent-9\/60.text-white,
.hover\:bg-accent-9:hover,
.group-has-\[\:checked\]\:text-white,
.group-has-\[\:indeterminate\]\:text-white {
  color: var(--btn-ink);
}
.bg-gray-9.text-white,
.bg-gray-12.text-white { color: var(--card); }

/* ==========================================================================
   MOUVEMENT — durées et courbes du kit v2
   ========================================================================== */
/* L'arrivée : ce qui entre se pose, du haut, sans rebond. */
@keyframes esc-land { from { opacity: 0; transform: translateY(-10px); } }
.esc-land { animation: esc-land var(--d-land) var(--out); }

/* L'attente : un rond qui attend une validation respire. */
@keyframes esc-pulse {
  0%   { box-shadow: 0 0 0 0 var(--signal-glow); }
  70%  { box-shadow: 0 0 0 9px transparent; }
  100% { box-shadow: 0 0 0 0 transparent; }
}
.esc-pulse { animation: esc-pulse var(--d-pulse) var(--out) infinite; }

/* Le passage : le rond validé redevient un carré de matière, à l'encre. */
.esc-dot {
  width: 10px; height: 10px; border-radius: var(--r-round); background: var(--signal);
  transition: border-radius var(--d-morph) var(--ease), background var(--d-morph) var(--ease);
}
.esc-dot.is-done { border-radius: var(--r-mark); background: var(--ink); }

/* Le chargement d'un bouton : le point d'action respire (BTN-B). */
@keyframes esc-breathe { 50% { transform: scale(.5); opacity: .55; } }

/* Mouvement réduit : rien ne bouge seul. Placé ici, il vaut aussi pour les
   feuilles d'écran servies après (même règle, même `!important`). */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation: none !important;
    transition: none !important;
  }
}

/* ==========================================================================
   LA MARQUE — ui/src/brand.rs (tuile, lockup, tuile éteinte)
   ========================================================================== */
.esc-mark { display: block; flex: none; }
.esc-mark .t { fill: var(--ink); }
/* Les modules de la tuile sont BLANCS (#fff, comme les fichiers de la
   marque), pas le papier cassé #fafaf8. En sombre la tuile s'inverse
   (tuile claire, modules d'encre de nuit) : les modules reprennent le papier. */
.esc-mark .m { fill: #fff; }
:root[data-theme="dark"] .esc-mark:not(.esc-mark--faded) .m { fill: var(--paper); }
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) .esc-mark:not(.esc-mark--faded) .m { fill: var(--paper); }
}
.esc-mark .o { fill: var(--signal); }
/* Les logos de la famille (`famille::logos`, 23/10) : la tuile, ses trois
   carrés et le signe de chaque application. `s` est un trait à la couleur de la
   tuile, sans remplissage : le rabat de l'enveloppe de Mail. */
.esc-mark .s { fill: none; stroke: var(--ink); }
/* VIDE-A : la tuile éteinte — au trait, les carrés en retrait, le rond en
   pointillé. Rien ne bouge ici, donc aucun signal. */
.esc-mark--faded { overflow: visible; }
.esc-mark--faded .t { fill: none; stroke: var(--line-2); stroke-width: 3; }
.esc-mark--faded .m { fill: var(--paper-2); stroke: var(--line-2); stroke-width: 3; }
.esc-mark--faded .o { fill: none; stroke: var(--ink-faint); stroke-width: 3; stroke-dasharray: 6 5; }

/* ==========================================================================
   BOUTONS — BTN-B « le point respire »
   ui/src/button.rs pose `esc-btn` + `esc-btn-{p,s,g,d}` ; les boutons
   principaux écrits à la main (`bg-accent-9 text-white hover:bg-accent-10`)
   sont pris aussi. Même géométrie (28 / 32 px), rayon 8 px, encre et papier.
   ========================================================================== */
.esc-btn,
:is(button, a).bg-accent-9.text-white.hover\:bg-accent-10,
:is(button, a).bg-tag-red.text-white {
  border-radius: var(--r-sm);
  transition: background-color var(--d-hover), color var(--d-hover),
    border-color var(--d-hover), box-shadow var(--d-hover), opacity var(--d-hover);
}
.esc-btn:focus-visible { outline: 2px solid var(--focus); outline-offset: 3px; }

/* Le point d'action : le rond signal devant le libellé du principal. */
.esc-btn-dot {
  flex: none;
  width: 7px;
  height: 7px;
  border-radius: var(--r-round);
  background: var(--btn-dot);
}
/* Les principaux écrits à la main, sans icône : le même point, en pseudo. */
:is(button, a).bg-accent-9.text-white.hover\:bg-accent-10:not(.esc-btn):not(:has(svg))::before {
  content: "";
  display: inline-block;
  flex: none;
  width: 7px;
  height: 7px;
  margin-right: 7px;
  vertical-align: 1px;
  border-radius: var(--r-round);
  background: var(--btn-dot);
}
:is(button, a).bg-accent-9.text-white.hover\:bg-accent-10[class*="gap-"]:not(.esc-btn):not(:has(svg))::before {
  margin-right: 0;
}

/* Principal : l'encre (le remappage de --color-accent-9 s'en charge), texte
   papier. Inerte : REDESSINÉ, pas délavé — fond en retrait, texte tertiaire,
   le point devient un rond creux (rien ne bouge). */
.esc-btn.esc-btn-p:disabled:not([aria-busy="true"]),
.esc-btn.esc-btn-p[aria-disabled="true"] {
  opacity: 1;
  background: var(--paper-2);
  border-color: var(--paper-2);
  color: var(--ink-3);
  cursor: not-allowed;
}
.esc-btn.esc-btn-p:disabled:not([aria-busy="true"]) .esc-btn-dot,
.esc-btn.esc-btn-p[aria-disabled="true"] .esc-btn-dot {
  background: transparent;
  box-shadow: inset 0 0 0 1.5px var(--ink-faint);
}
/* Chargement : le bouton garde son encre, et c'est le point qui respire. */
.esc-btn.esc-btn-p[aria-busy="true"] {
  opacity: 1;
  cursor: progress;
}
.esc-btn.esc-btn-p[aria-busy="true"] .esc-btn-dot {
  animation: esc-breathe 1.1s var(--ease) infinite;
}

/* Secondaire : la carte, un filet appuyé, l'ombre posée. */
.esc-btn.esc-btn-s {
  border-color: var(--line-2);
  box-shadow: var(--shadow-1);
}
.esc-btn.esc-btn-s:disabled:not([aria-busy="true"]),
.esc-btn.esc-btn-s[aria-disabled="true"] {
  opacity: 1;
  background: transparent;
  color: var(--ink-3);
  border-color: var(--line);
  box-shadow: none;
}

/* Discret : l'encre seconde, le papier en retrait au survol. */
.esc-btn.esc-btn-g { color: var(--ink-2); }
.esc-btn.esc-btn-g:hover { background: var(--paper-2); color: var(--ink); }
.esc-btn.esc-btn-g:disabled:not([aria-busy="true"]),
.esc-btn.esc-btn-g[aria-disabled="true"] {
  opacity: 1;
  background: transparent;
  color: var(--ink-faint);
}

/* Danger : RETENU. Il ne rougit qu'au survol et au focus. */
.esc-btn.esc-btn-d,
:is(button, a).bg-tag-red.text-white {
  background: var(--card);
  color: var(--ink-2);
  border-color: var(--line-2);
}
.esc-btn.esc-btn-d:hover,
.esc-btn.esc-btn-d:focus-visible,
:is(button, a).bg-tag-red.text-white:hover,
:is(button, a).bg-tag-red.text-white:focus-visible {
  color: var(--danger);
  border-color: var(--danger);
  background: var(--danger-soft);
  filter: none;
}
.esc-btn.esc-btn-d:disabled:not([aria-busy="true"]),
.esc-btn.esc-btn-d[aria-disabled="true"] {
  opacity: 1;
  background: transparent;
  color: var(--ink-3);
  border-color: var(--line);
}
/* Un secondaire, discret ou danger qui charge garde son rouet, en tertiaire. */
.esc-btn:not(.esc-btn-p)[aria-busy="true"] {
  opacity: 1;
  color: var(--ink-3);
  cursor: progress;
}

/* ==========================================================================
   CHAMPS — CHAMP-A « la boîte nette »
   ui/src/input.rs pose `esc-field`. Filet appuyé au repos, encre au
   survol, focus à l'encre avec un anneau léger (jamais l'accent), erreur en
   rouge avec son message sous le champ.
   ========================================================================== */
.esc-field {
  border-color: var(--line-2);
  border-radius: var(--r-sm);
  background: var(--card);
  color: var(--ink);
  transition: border-color var(--d-hover), box-shadow var(--d-hover), background-color var(--d-hover);
}
.esc-field::placeholder { color: var(--ink-3); }
.esc-field:hover:not(:focus):not(:disabled):not([aria-invalid="true"]) { border-color: var(--ink-3); }
.esc-field:focus {
  outline: none;
  border-color: var(--ink);
  box-shadow: var(--ring-ink);
}
.esc-field[aria-invalid="true"] {
  border-color: var(--danger);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--danger) 14%, transparent);
}
.esc-field:disabled,
.esc-field[aria-disabled="true"] {
  opacity: 1;
  background: var(--paper-2);
  color: var(--ink-3);
  border-color: var(--line);
  cursor: not-allowed;
}
/* Les champs écrits à la main sur le même patron (les `SELECT` / `TEXTAREA`
   des réglages, reconnus à leur anneau de focus) : même boîte, même focus. */
:where(input, select, textarea).focus\:ring-accent-8\/30 {
  border-color: var(--line-2);
  border-radius: var(--r-sm);
}
:where(input, select, textarea).focus\:ring-accent-8\/30:focus {
  border-color: var(--ink);
  box-shadow: var(--ring-ink);
}

/* ==========================================================================
   BADGES — BADGE-A « le carré d'état »
   ui/src/tag.rs (`esc-badge`), et ses copies à la lettre (la pastille
   d'option de `field.rs`, reconnue à ses classes et à sa teinte en ligne).
   Le client écarte le multicolore : fond en retrait, texte à l'encre, un petit
   carré de matière devant. La couleur reste une DONNÉE en base ; seul son
   rendu change. Le carré suit l'étape quand l'écran la donne (`data-g` :
   `amont` creux, `actif` gris, `clos` plein, `echec` creux cerné de
   `--danger`) ; sans étape, il est gris.
   `!important` : la teinte est en `style` ; `:where()` : un écran la reprend.
   ========================================================================== */
:where(.esc-badge, span.inline-flex.truncate.rounded-sm.font-medium[style*="var(--tag-"]) {
  gap: 6px;
  border-radius: var(--r-cite) !important;
  background-color: var(--paper-2) !important;
  color: var(--ink) !important;
}
:where(.esc-badge, span.inline-flex.truncate.rounded-sm.font-medium[style*="var(--tag-"])::before {
  content: "";
  flex: none;
  width: 6px;
  height: 6px;
  border-radius: var(--r-mark);
  background: var(--ink-2);
}
:where(.esc-badge)[data-g="amont"]::before { background: transparent; box-shadow: inset 0 0 0 1.5px var(--ink-3); }
:where(.esc-badge)[data-g="clos"]::before { background: var(--ink); }
:where(.esc-badge)[data-g="clos"] { color: var(--ink-2) !important; }
:where(.esc-badge)[data-g="echec"]::before { background: transparent; box-shadow: inset 0 0 0 1.5px var(--danger); }

/* ==========================================================================
   BANDEAUX — l'avis en ligne (feedback.rs `banner`, settings.rs `notice_banner`)
   `esc-banner` + `data-tone`. Info et « enregistré » : papier en retrait,
   filet, encre — un petit carré d'encre dit que c'est fait. Refus : rouge
   retenu. Le vert n'est JAMAIS du texte. `!important` : la teinte est en
   `style` pour le bandeau de feedback.rs.
   ========================================================================== */
:where(.esc-banner) { border-radius: var(--r-sm); }
:where(.esc-banner)[data-tone="info"],
:where(.esc-banner)[data-tone="done"] {
  color: var(--ink) !important;
  background-color: var(--paper-2) !important;
  border-color: var(--line) !important;
}
:where(.esc-banner)[data-tone="done"]::before {
  content: "";
  flex: none;
  width: 8px;
  height: 8px;
  border-radius: var(--r-mark);
  background: var(--ink);
}
/* L'avertissement (feedback.rs, `BannerVariant::Warning`) : plus d'orange.
   Le papier en retrait et l'encre, comme l'information, plus un liseré
   d'encre à gauche qui dit « à lire avant d'agir ». Son bouton d'action
   perd aussi sa teinte (en ligne). */
:where(.esc-banner)[data-tone="warning"] {
  color: var(--ink) !important;
  background-color: var(--paper-2) !important;
  border-color: var(--line-2) !important;
  box-shadow: inset 3px 0 0 var(--ink);
}
/* En bande pleine largeur (le bandeau d'impersonation, app_screens.rs) :
   pas de rayon, seul le filet du bas. */
.esc-banner.esc-banner--strip { border-radius: 0; }
:where(.esc-banner)[data-tone="warning"] :is(a, button)[style] {
  border-color: var(--line-2) !important;
  color: var(--ink);
}
:where(.esc-banner)[data-tone="danger"] {
  color: var(--danger) !important;
  background-color: var(--danger-soft) !important;
  border-color: color-mix(in srgb, var(--danger) 35%, transparent) !important;
}

/* ==========================================================================
   CE QUI BOUGE — le chargement (feedback.rs `loader`, `esc-loader`)
   Les trois points pulsent en signal : c'est ce qui bouge.
   ========================================================================== */
.esc-loader > span { background: var(--signal); }

/* ==========================================================================
   MENUS ET CONFIRMATIONS — MODALE-B
   dropdown.rs (`esc-menu`, `esc-menu-item`), menu_item.rs, modal.rs
   (`esc-dialog`, `esc-veil`). Le motif retenu est celui de la Bibliothèque :
   la confirmation se déplie DANS le menu (`esc-menu-confirm`, prêt pour les
   écrans) ; la modale centrée reste pour ce qui l'emploie déjà, redessinée.
   ========================================================================== */
:where(.esc-menu) {
  border-color: var(--line);
  border-radius: var(--r-sm);
  background: var(--card);
  box-shadow: var(--shadow-pop);
}
:where(.esc-menu-item) { border-radius: 6px; }
:where(.esc-menu-item):hover,
:where(.esc-menu-item):focus-visible { background: var(--paper-2); }
:where(.esc-menu-item).text-tag-red,
:where(.esc-menu-item) .text-tag-red { color: var(--danger); }
/* La confirmation sur place : « Supprimer ce document ? », puis Annuler /
   Confirmer, sans voile ni fenêtre. */
:where(.esc-menu-confirm) {
  margin: 2px;
  padding: 10px;
  border-radius: 6px;
  background: var(--danger-soft);
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--danger) 30%, transparent);
}
:where(.esc-menu-confirm) > p { margin: 0 0 8px; font-weight: 500; color: var(--ink); }

/* La modale : un panneau de carte, rayon 12 px, sur un voile d'encre. */
:where(.esc-dialog) {
  border-color: var(--line);
  border-radius: var(--r);
  background: var(--card);
  box-shadow: var(--shadow-pop);
}
:where(.esc-veil) { background: var(--veil); }
/* Le titre (`.dlg h4` du kit) et le pied sous son filet (`.dft`). */
:where(.esc-dialog-title) { font: 600 14.5px/1.3 var(--font); letter-spacing: -.01em; color: var(--ink); }
:where(.esc-dialog-ft) { margin-top: 16px; padding-top: 12px; border-top: 1px solid var(--line); }

/* ==========================================================================
   FENÊTRE ESCOUADE — D145 (TR-FENETRES, 2/11/2026)
   fenetre.rs (`ui`), fenetre_dom.rs (`islands`). LA
   confirmation de la famille, jamais la boîte du navigateur : un titre, une
   phrase, la conséquence, Annuler et le geste à droite. Les jetons font le
   clair et le sombre ; sur téléphone, une feuille qui monte du bas, les
   boutons empilés, le geste en tête. Mêmes noms que la salle de Meet
   (`esc-fenetre*`) et que la coquille de la famille (`esf-fenetre*`).
   ========================================================================== */
.esc-fenetre-voile {
  position: fixed; inset: 0; z-index: 70;
  display: grid; place-items: center; padding: 16px;
  background: var(--veil);
  animation: esc-fenetre-voile .14s var(--out);
}
.esc-fenetre {
  width: min(440px, 100%); max-height: calc(100dvh - 32px); overflow: auto;
  padding: 20px;
  background: var(--card); color: var(--ink);
  border: 1px solid var(--line); border-radius: var(--r-panel);
  box-shadow: var(--shadow-pop);
  font-family: var(--font);
  animation: esc-fenetre-monte .16s var(--out);
}
.esc-fenetre:focus { outline: none; }
.esc-fenetre-titre { margin: 0; font: 600 15px/1.35 var(--font); letter-spacing: -.01em; color: var(--ink); }
.esc-fenetre-texte { margin: 8px 0 0; font-size: 13.5px; line-height: 1.5; color: var(--ink-2); }
.esc-fenetre-consequence {
  display: flex; align-items: flex-start; gap: 8px;
  margin: 12px 0 0; padding: 10px 12px;
  border-radius: var(--r-sm); background: var(--danger-soft);
  font-size: 13px; line-height: 1.45; color: var(--ink);
}
.esc-fenetre-consequence svg { flex: none; margin-top: 1px; color: var(--danger); }
/* Ce que le geste demande encore : un rôle à choisir, une adresse à retaper. */
.esc-fenetre-contenu { display: grid; gap: 6px; margin-top: 14px; }
.esc-fenetre-boutons {
  display: flex; flex-wrap: wrap; justify-content: flex-end; align-items: center; gap: 8px;
  margin-top: 18px; padding-top: 14px; border-top: 1px solid var(--line);
}
.esc-fenetre-boutons > * { text-decoration: none; }
/* Le principal d'une fenêtre de suppression : rouge plein, toujours (lot de captures n° 1). */
.esc-btn.esc-btn-d.esc-fenetre-danger { background: var(--danger); color: #fff; border-color: var(--danger); }
.esc-btn.esc-btn-d.esc-fenetre-danger:hover,
.esc-btn.esc-btn-d.esc-fenetre-danger:focus-visible { background: color-mix(in srgb, var(--danger) 88%, #000); color: #fff; border-color: transparent; filter: none; }
@keyframes esc-fenetre-voile { from { opacity: 0; } }
@keyframes esc-fenetre-monte { from { opacity: 0; transform: translateY(6px) scale(.98); } }
@keyframes esc-fenetre-feuille { from { transform: translateY(100%); } }
@media (max-width: 520px) {
  .esc-fenetre-voile { place-items: end stretch; padding: 0; }
  .esc-fenetre {
    width: 100%; max-height: 85dvh;
    border-radius: var(--r-frame) var(--r-frame) 0 0; border-bottom: 0;
    padding: 10px 16px calc(16px + env(safe-area-inset-bottom));
    animation-name: esc-fenetre-feuille; animation-duration: .2s;
  }
  /* La poignée de la feuille : un trait, rien à saisir. */
  .esc-fenetre::before {
    content: ""; display: block; width: 36px; height: 4px; margin: 0 auto 14px;
    border-radius: var(--r-pill); background: var(--line-2);
  }
  .esc-fenetre-titre { font-size: 16px; }
  .esc-fenetre-texte { font-size: 14px; }
  .esc-fenetre-boutons { flex-direction: column-reverse; align-items: stretch; border-top: 0; padding-top: 0; }
  .esc-fenetre-boutons > * { width: 100%; min-height: 44px; font-size: 15px; }
}
@media (prefers-reduced-motion: reduce) {
  .esc-fenetre-voile, .esc-fenetre { animation: none; }
}

/* ==========================================================================
   NOTIFICATIONS — TOAST-B « la pilule d'encre »
   toast.rs (`esc-toast*`, `data-k`) : en bas au centre, sur la nuit. La
   marque de 9 px dit la nature — carré plein : fait ; carré creux rouge :
   échec ; carré creux gris : avertissement ; petit carré gris : information.
   Le rond signal qui bat reste à « en cours » (`data-k="busy"`, prêt pour
   l'îlot). Aucune teinte par variante ; la commande est soulignée.
   ========================================================================== */
.esc-toast-slot {
  position: fixed;
  left: 50%;
  bottom: 18px;
  z-index: 60;
  transform: translateX(-50%);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  width: max-content;
  max-width: calc(100vw - 32px);
  pointer-events: none;
}
.esc-toast {
  pointer-events: auto;
  display: flex;
  align-items: center;
  gap: 10px;
  max-width: 400px;
  padding: 9px 6px 9px 12px;
  border-radius: var(--r-btn);
  background: var(--night);
  color: var(--night-ink);
  box-shadow: var(--shadow-pop), inset 0 0 0 1px var(--night-line-2);
  font: var(--t-small);
  animation: esc-land var(--d-land) var(--out);
}
.esc-toast-mark {
  flex: none;
  width: 9px;
  height: 9px;
  border-radius: var(--r-mark);
  background: var(--night-ink);
}
.esc-toast[data-k="busy"] .esc-toast-mark { border-radius: var(--r-round); background: var(--signal); animation: esc-pulse var(--d-pulse) var(--out) infinite; }
.esc-toast[data-k="err"] .esc-toast-mark { background: transparent; box-shadow: inset 0 0 0 1.5px var(--night-danger); }
.esc-toast[data-k="warn"] .esc-toast-mark { background: transparent; box-shadow: inset 0 0 0 1.5px var(--night-ink-2); }
.esc-toast[data-k="info"] .esc-toast-mark { width: 7px; height: 7px; background: var(--night-ink-2); }
.esc-toast-body { min-width: 0; flex: 1; }
.esc-toast-msg { margin: 0; font-weight: 500; }
.esc-toast-desc { margin: 2px 0 0; color: var(--night-ink-2); }
.esc-toast-act,
.esc-toast-x {
  flex: none;
  border: 0;
  border-radius: var(--r-sm);
  background: transparent;
  font: inherit;
  cursor: pointer;
  transition: background-color var(--d-hover), color var(--d-hover);
}
.esc-toast-act {
  padding: 4px 8px;
  font-weight: 500;
  color: var(--night-ink);
  text-decoration: underline;
  text-underline-offset: 3px;
}
.esc-toast-x {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  color: var(--night-ink-2);
}
.esc-toast-act:hover,
.esc-toast-x:hover { background: var(--night-line); color: var(--night-ink); }
.esc-toast-act:focus-visible,
.esc-toast-x:focus-visible { outline: 2px solid var(--night-ink); outline-offset: 1px; }

/* ==========================================================================
   ÉTATS VIDES — VIDE-A « la tuile atténuée »
   placeholder.rs (`esc-empty`) : la tuile éteinte, le titre, une ligne,
   l'action.
   ========================================================================== */
:where(.esc-empty) { gap: 10px; }
:where(.esc-empty) .text-\[0\.9rem\] { font-size: 14px; letter-spacing: var(--ls-tight); }
:where(.esc-empty) p { color: var(--ink-3); font-size: 12.5px; max-width: 40ch; }

/* ==========================================================================
   RESTES DE L'ANCIEN THÈME, hors des écrans des lots
   Le lien principal de la vue d'ensemble du modèle (Réglages › Objets)
   portait le citron en dur dans app.css : c'est une action principale, donc
   l'encre et le papier.
   ========================================================================== */
.model-overview-link { background: var(--btn-bg); color: var(--btn-ink); }
.model-overview-link:hover { background: color-mix(in srgb, var(--btn-bg) 84%, var(--paper)); }

/* assets/b/nav.css */
/* ==========================================================================
   Escouade · identité B — la navigation (lot 1)
   Écrans : la barre latérale de toutes les pages (app), son rail replié, et
   l'en-tête de page commun (app_shell::page_header).
   Variantes votées (kit/NAV.html, 2026-09-29) :
     NAV-E     264 px, lignes aérées de 34 px, la recherche en première ligne
               (remontée en haut de barre, à gauche de « Replier », le
               2026-10-12), « Espace de travail | Chats » en deux onglets sous
               les modules ;
     tri       l'espace rangé par usage — Piloter · Relation · Chantiers ·
               Organisation · Gestion, Étiquettes à part (nav::order_by_usage) ;
     icônes    au trait, une seule encre, ni tuile ni teinte d'objet ;
     REPLI-A   libellés effacés d'abord (90 ms), puis la largeur se resserre
               (150 ms ease-out), icônes immobiles, info-bulles sur le rail ;
     en-tête   l'actuel (52 px, titre 13 px), seulement repeint aux jetons —
               les quatre HEAD ont été refusés.
   Règles : seulement les jetons d'escouade-b.css, aucune couleur en dur ; le
   vert signal n'apparaît pas ici (rien ne bouge dans une barre).
   Les classes `nav-*` sont posées par crates/web (sidebar.rs,
   app_shell.rs) ; le tempo du repli (`--nav-fade`, `--nav-dur`,
   `--nav-fade-in`) est LU par l'îlot (islands/nav_dom.rs) : il n'a
   qu'un lieu, ici. Les utilitaires Tailwind sont dans @layer utilities : ces
   règles, hors couche, les emportent.
   ========================================================================== */

/* ---- La barre ------------------------------------------------------------ */
aside[data-nav-width] {
  --nav-hover: var(--paper-2);
  --nav-active: var(--line);
  --nav-row: 34px;
  /* 8 px de marge + 9 px dans la ligne : l'icône (16 px) commence à 17 px,
     le centre exact du rail de 50 px. C'est ce qui la garde IMMOBILE pendant
     le repli. */
  --nav-pad: 8px;
  --nav-ipad: 9px;
  --nav-fade: 90ms;
  --nav-fade-in: 120ms;
  --nav-dur: 150ms;
  background: var(--paper);
  border-right: 1px solid var(--line);
  color: var(--ink);
  font-family: var(--font);
  transition: width var(--nav-dur) ease-out;
}
/* Pendant un glisser de la poignée, la largeur suit le pointeur, sans retard. */
aside[data-nav-width][data-nav-resizing] { transition: none; }

/* ---- Le haut : l'espace, puis Rechercher et Replier ---------------------- */
/* Serré depuis que la loupe y est revenue (2026-10-12) : à 252 px de barre, le
   nom de l'espace doit garder ses 46 px à côté des deux boutons. */
aside[data-nav-width] .nav-top {
  display: flex;
  flex: none;
  align-items: center;
  gap: 2px;
  height: 48px;
  padding: 0 6px 0 var(--nav-pad);
}
aside[data-nav-width] .nav-top.is-rail { justify-content: flex-start; }
aside[data-nav-width] .nav-top-ws {
  display: flex;
  flex: 1;
  min-width: 0;
  align-items: center;
  gap: 5px;
  height: 32px;
  padding: 0 2px 0 7px;
  border-radius: var(--r-sm);
  color: var(--ink);
  text-decoration: none;
  transition: background-color var(--d-hover);
}
aside[data-nav-width] .nav-top-ws:hover { background: var(--nav-hover); }
aside[data-nav-width] .nav-top-ws:focus-visible { outline: 2px solid var(--focus); outline-offset: -2px; }
aside[data-nav-width] .nav-top-av { display: inline-grid; flex: none; }
/* Le logo complet (lockup, 20 px) à la place de la pastille de l'espace, puis
   un filet avant le nom de l'espace. */
aside[data-nav-width] .nav-top-brand {
  display: inline-flex;
  flex: none;
  align-items: center;
  padding-right: 5px;
  border-right: 1px solid var(--line-2);
}
/* La pastille de l'espace : une initiale à l'encre sur papier, sans teinte. */
aside[data-nav-width] .nav-top-av > span[style] {
  border-radius: 5px;
  background-color: var(--paper-2) !important;
  box-shadow: inset 0 0 0 1px var(--line-2);
  color: var(--ink) !important;
  font-weight: 600;
}
aside[data-nav-width] .nav-top-av > img { border-radius: 5px; }
aside[data-nav-width] .nav-top-name {
  min-width: 0;
  overflow: hidden;
  font: 600 13px/1.2 var(--font);
  letter-spacing: var(--ls-tight);
  text-overflow: ellipsis;
  white-space: nowrap;
}
aside[data-nav-width] .nav-top :is([data-action="toggle-nav"], .nav-top-search) {
  display: grid;
  flex: none;
  place-items: center;
  width: 24px;
  height: 24px;
  border-radius: var(--r-sm);
  color: var(--ink-2);
  transition: background-color var(--d-hover), color var(--d-hover);
}
/* Replié, « Déplier » occupe la case d'une ligne : 34 px, calé comme elles. */
aside[data-nav-width] .nav-top.is-rail [data-action="toggle-nav"] { width: var(--nav-row); height: var(--nav-row); }
aside[data-nav-width] .nav-top :is([data-action="toggle-nav"], .nav-top-search):hover { background: var(--nav-hover); color: var(--ink); }
/* La loupe (2026-10-12) : à gauche de « Replier ». */
aside[data-nav-width] .nav-top-search { text-decoration: none; }
/* L'ancienne feuille grossissait les glyphes du rail (scale 1.1) : une icône
   qui change de taille au repli n'est plus immobile. */
aside[data-nav-width] .nav-top svg { transform: none; }
aside[data-nav-width] .nav-top :is([data-action="toggle-nav"], .nav-top-search):focus-visible { outline: 2px solid var(--focus); outline-offset: -2px; }

/* ---- Le corps ------------------------------------------------------------ */
aside[data-nav-width] .nav-body {
  display: flex;
  flex: 1;
  flex-direction: column;
  gap: 1px;
  width: auto;
  min-height: 0;
  margin: 0;
  padding: 2px var(--nav-pad) 8px;
  overflow-x: hidden;
  overflow-y: auto;
  border-bottom: 1px solid var(--line);
  scrollbar-width: thin;
}
/* Le rail laisse déborder ses info-bulles. */
aside[data-nav-width] .nav-body.is-rail { overflow: visible; }
aside[data-nav-width] :is(.nav-primary, .nav-ws, .nav-tabbed, .nav-rail-sections) {
  display: flex;
  flex-direction: column;
  gap: 1px;
}

/* ---- Une ligne : icône au trait, libellé -------------------------------- */
aside[data-nav-width] .nav-it {
  position: relative;
  display: flex;
  flex: none;
  box-sizing: border-box;
  align-items: center;
  gap: 10px;
  width: 100%;
  height: var(--nav-row);
  min-height: var(--nav-row);
  margin: 0;
  padding: 0 10px 0 var(--nav-ipad);
  border: 0;
  border-radius: var(--r-sm);
  background: transparent;
  box-shadow: none;
  color: var(--ink-2);
  font: 500 14px/1 var(--font);
  letter-spacing: normal;
  text-decoration: none;
  white-space: nowrap;
  transition: background-color var(--d-hover), color var(--d-hover);
}
aside[data-nav-width] .nav-it :is(.nav-ic, .nav-ic svg) {
  flex: none;
  color: inherit;
  transform: none;
}
aside[data-nav-width] .nav-it .nav-ic {
  display: grid;
  width: 16px;
  height: 16px;
  place-items: center;
  border-radius: 0;
  background: transparent;
}
aside[data-nav-width] .nav-it:hover { background: var(--nav-hover); color: var(--ink); }
aside[data-nav-width] :is(.nav-it.is-active, .nav-it[aria-current="page"]) {
  background: var(--nav-active);
  color: var(--ink);
  box-shadow: none;
}
aside[data-nav-width] .nav-it:focus-visible { outline: 2px solid var(--focus); outline-offset: -2px; }
aside[data-nav-width] .nav-label {
  flex: 1;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* ---- Le rail (REPLI-A) : les mêmes lignes, réduites à leur icône -------- */
aside[data-nav-width] .nav-body.is-rail .nav-it {
  justify-content: flex-start;
  gap: 0;
  width: var(--nav-row);
  padding: 0 var(--nav-ipad);
}
aside[data-nav-width] .nav-rail-sections {
  width: var(--nav-row);
  margin-top: 8px;
  padding-top: 8px;
  border-top: 1px solid var(--line);
}

/* Les info-bulles du rail : l'encre, le papier, un glissement de 4 px. */
aside[data-nav-width="50"] [data-tooltip] { position: relative; }
aside[data-nav-width="50"] [data-tooltip]::after {
  content: attr(data-tooltip);
  position: absolute;
  z-index: 60;
  top: 50%;
  left: calc(100% + 10px);
  width: max-content;
  max-width: 240px;
  padding: 6px 8px;
  border: 0;
  border-radius: 6px;
  background: var(--ink);
  box-shadow: none;
  color: var(--paper);
  font: 500 12px/1.2 var(--font);
  white-space: nowrap;
  opacity: 0;
  pointer-events: none;
  transform: translate(-4px, -50%);
  visibility: hidden;
  transition: opacity 120ms linear, transform 120ms var(--out), visibility 0s linear 120ms;
}
aside[data-nav-width="50"] [data-tooltip]:is(:hover, :focus-visible)::after {
  opacity: 1;
  transform: translate(0, -50%);
  visibility: visible;
  transition-delay: 0s;
}

/* Les boutons du rail (« Espace de travail », « Chats ») : des `button`
   natifs, rendus comme les liens voisins. */
aside[data-nav-width] button.nav-rail-section { cursor: pointer; appearance: none; }
aside[data-nav-width] .nav-body:has(#nav-fly-ws:popover-open) [popovertarget="nav-fly-ws"],
aside[data-nav-width] .nav-body:has(#nav-fly-chats:popover-open) [popovertarget="nav-fly-chats"] {
  background: var(--nav-active);
  color: var(--ink);
}

/* ---- Le panneau volant du rail (2026-09-29) ------------------------------
   Un `popover` natif, dans la couche supérieure : il s'ouvre à droite du rail
   (50 px), sur toute la hauteur, comme le volet d'Attio. Il reprend les
   lignes de la barre dépliée — d'où les règles qui défont, ici, la réduction
   du rail (`.is-rail .nav-it`) et ses info-bulles. */
.nav-fly[popover] {
  position: fixed;
  inset: 8px auto 8px 56px;
  box-sizing: border-box;
  width: 264px;
  max-height: calc(100vh - 16px);
  margin: 0;
  padding: 0;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--card);
  box-shadow: var(--shadow-pop);
  color: var(--ink);
  font-family: var(--font);
}
.nav-fly[popover]:popover-open { display: flex; flex-direction: column; }
.nav-fly-h {
  display: flex;
  flex: none;
  align-items: center;
  justify-content: space-between;
  height: 40px;
  padding: 0 8px 0 14px;
  border-bottom: 1px solid var(--line);
  color: var(--ink);
  font: 600 13px/1 var(--font);
}
.nav-fly-new {
  display: grid;
  width: 28px;
  height: 28px;
  place-items: center;
  border-radius: var(--r-sm);
  color: var(--ink-2);
}
.nav-fly-new:hover { background: var(--nav-hover); color: var(--ink); }
.nav-fly-b {
  flex: 1;
  min-height: 0;
  padding: 6px var(--nav-pad, 8px) 8px;
  overflow-y: auto;
  scrollbar-width: thin;
}
.nav-fly-foot {
  flex: none;
  padding: 10px 14px;
  border-top: 1px solid var(--line);
  color: var(--ink-3);
  font: 500 12.5px/1 var(--font);
  text-decoration: none;
}
.nav-fly-foot:hover { background: var(--nav-hover); color: var(--ink); }
.nav-fly :is(a, button):focus-visible { outline: 2px solid var(--focus); outline-offset: -2px; }
aside[data-nav-width] .nav-body.is-rail .nav-fly .nav-it {
  justify-content: flex-start;
  gap: 10px;
  width: 100%;
  padding: 0 10px 0 var(--nav-ipad);
}
aside[data-nav-width="50"] .nav-fly [data-tooltip]::after { content: none; display: none; }

/* ---- « Plus » et le mode édition (2026-10-20) ---------------------------
   « Comme dans Claude » : « Plus » au bas des entrées principales montre
   celles que le membre a masquées, puis « Modifier la barre latérale… ».
   Déplié c'est un <details> (la liste s'ouvre sous la ligne, filet à
   gauche) ; replié, un panneau volant comme ceux du rail. Le mode édition
   range la liste à la poignée (îlot `data-dnd`, envoi au serveur) ou aux
   boutons de chaque ligne (le repli sans script) ; la zone « Masquées »
   reçoit ce qu'on y glisse ; « Terminé » referme. Gabarit :
   crates/web/src/sidebar.rs (more_entry, edit_panel). */
aside[data-nav-width] :is(button.nav-it, summary.nav-it) {
  cursor: pointer;
  appearance: none;
  text-align: left;
}
aside[data-nav-width] summary.nav-it { list-style: none; }
aside[data-nav-width] summary.nav-it::-webkit-details-marker { display: none; }
aside[data-nav-width] .nav-more[open] > summary { color: var(--ink); }
aside[data-nav-width] .nav-more-menu {
  display: flex;
  flex-direction: column;
  gap: 1px;
  margin: 1px 0 2px 16px;
  padding-left: 4px;
  border-left: 1px solid var(--line);
}
aside[data-nav-width] .nav-fly .nav-more-menu { margin: 0; padding-left: var(--nav-pad, 8px); border-left: 0; }
aside[data-nav-width] .nav-more-form { display: contents; }
aside[data-nav-width] .nav-more-edit { color: var(--ink-3); }
aside[data-nav-width] .nav-body:has(#nav-fly-more:popover-open) [popovertarget="nav-fly-more"] {
  background: var(--nav-active);
  color: var(--ink);
}
aside[data-nav-width] :is(.nav-edit-form, .nav-edit-list) {
  display: flex;
  flex-direction: column;
  gap: 1px;
}
aside[data-nav-width] .nav-edit-row { padding-right: 4px; gap: 8px; cursor: default; }
aside[data-nav-width] .nav-edit-row:hover { background: var(--nav-hover); color: var(--ink); }
/* La ligne portée pendant un glisser (l'îlot ne pose `draggable` que le
   temps du geste). */
aside[data-nav-width] .nav-edit-row[draggable] { opacity: .55; }
aside[data-nav-width] .nav-edit-btns { display: inline-flex; flex: none; gap: 1px; }
aside[data-nav-width] :is(.nav-edit-btn, .nav-edit-grip, .nav-edit-lock) {
  display: grid;
  flex: none;
  place-items: center;
  width: 22px;
  height: 22px;
  padding: 0;
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: var(--ink-3);
}
aside[data-nav-width] .nav-edit-btn { cursor: pointer; appearance: none; }
aside[data-nav-width] .nav-edit-btn:hover { background: var(--line); color: var(--ink); }
aside[data-nav-width] .nav-edit-btn:focus-visible { outline: 2px solid var(--focus); outline-offset: -2px; }
aside[data-nav-width] .nav-edit-grip { cursor: grab; }
/* Q64 : une entrée obligatoire (réglée par l'organisation) ne se masque
   pas — un cadenas, toujours visible, à la place du bouton « Masquer ». */
aside[data-nav-width] .nav-edit-lock { cursor: default; }
/* Les boutons du repli restent au clavier (le focus les montre) et au
   toucher ; à la souris, ils paraissent au survol de leur ligne, comme les
   actions d'un fil de chat. */
@media (hover: hover) {
  aside[data-nav-width] .nav-edit-row:not(:hover, :focus-within) .nav-edit-btns { opacity: 0; }
}
aside[data-nav-width] .nav-edit-h {
  flex: none;
  padding: 12px 10px 5px var(--nav-ipad);
  color: var(--ink-3);
  font: 500 11.5px/1 var(--font);
}
aside[data-nav-width] .nav-edit-drop {
  min-height: var(--nav-row);
  padding: 2px;
  border: 1px dashed var(--line-2);
  border-radius: var(--r-sm);
}
aside[data-nav-width] .nav-edit-hint {
  margin: 0;
  padding: 9px var(--nav-ipad);
  color: var(--ink-3);
  font: 400 12.5px/1.2 var(--font);
  text-align: center;
}
aside[data-nav-width] .nav-edit-drop:has([data-dnd-item]) .nav-edit-hint { display: none; }
aside[data-nav-width] .nav-edit-reset {
  align-self: flex-start;
  margin: 8px 0 0;
  padding: 4px var(--nav-ipad);
  border: 0;
  background: transparent;
  color: var(--ink-3);
  font: 500 12px/1.2 var(--font);
  text-decoration: underline;
  cursor: pointer;
}
aside[data-nav-width] .nav-edit-reset:hover { color: var(--ink); }
aside[data-nav-width] .nav-edit-done {
  width: 100%;
  height: 30px;
  margin-top: 8px;
  border: 1px solid var(--line-2);
  border-radius: var(--r-sm);
  background: var(--card);
  color: var(--ink);
  font: 600 13px/1 var(--font);
  cursor: pointer;
}
aside[data-nav-width] .nav-edit-done:hover { background: var(--paper-2); }
aside[data-nav-width] :is(.nav-edit-reset, .nav-edit-done):focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; }

/* ---- Les favoris --------------------------------------------------------- */
aside[data-nav-width] .nav-favs { color: var(--ink-2); }
aside[data-nav-width] .nav-favs a {
  border-radius: var(--r-sm);
  color: var(--ink-2);
  transition: background-color var(--d-hover), color var(--d-hover);
}
aside[data-nav-width] .nav-favs a:hover { background: var(--nav-hover); color: var(--ink); }
aside[data-nav-width] .nav-favs a.bg-gray-4 { background: var(--nav-active); color: var(--ink); }
aside[data-nav-width] .nav-favs summary:hover { background: var(--nav-hover); }

/* ---- NAV-E : les deux onglets ------------------------------------------- */
/* Deux boutons radio, hors de la vue mais au clavier (flèches), et leurs
   <label>. Le volet de l'onglet non coché est retiré par la feuille seule. */
aside[data-nav-width] .nav-tab-input {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: 0;
  opacity: 0;
  pointer-events: none;
}
aside[data-nav-width] .nav-tabs {
  display: flex;
  flex: none;
  gap: 2px;
  margin: 10px 0 4px;
  padding: 2px;
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  background: var(--paper-2);
}
aside[data-nav-width] .nav-tab {
  display: block;
  flex: 1;
  min-width: 0;
  height: 26px;
  overflow: hidden;
  border-radius: 6px;
  color: var(--ink-2);
  cursor: pointer;
  font: 500 12.5px/26px var(--font);
  text-align: center;
  text-overflow: ellipsis;
  white-space: nowrap;
  transition: background-color var(--d-hover), color var(--d-hover);
}
aside[data-nav-width] .nav-tab:hover { color: var(--ink); }
aside[data-nav-width] #nav-tab-home:checked ~ .nav-tabs [for="nav-tab-home"],
aside[data-nav-width] #nav-tab-chat:checked ~ .nav-tabs [for="nav-tab-chat"] {
  background: var(--card);
  box-shadow: var(--shadow-1), 0 0 0 1px var(--line);
  color: var(--ink);
}
aside[data-nav-width] #nav-tab-home:focus-visible ~ .nav-tabs [for="nav-tab-home"],
aside[data-nav-width] #nav-tab-chat:focus-visible ~ .nav-tabs [for="nav-tab-chat"] {
  outline: 2px solid var(--focus);
  outline-offset: -2px;
}
aside[data-nav-width] #nav-tab-home:checked ~ .nav-pane-chat,
aside[data-nav-width] #nav-tab-chat:checked ~ .nav-pane-home { display: none; }
/* Aucun onglet coché (rendu abîmé) : l'espace de travail, jamais une barre vide. */
aside[data-nav-width] .nav-tabbed:not(:has(.nav-tab-input:checked)) .nav-pane-chat { display: none; }

/* ---- L'espace de travail rangé par usage -------------------------------- */
aside[data-nav-width] .nav-group-h {
  flex: none;
  padding: 12px 10px 5px var(--nav-ipad);
  overflow: hidden;
  color: var(--ink-3);
  font: 500 11.5px/1 var(--font);
  text-overflow: ellipsis;
  white-space: nowrap;
}
aside[data-nav-width] .nav-ws > .nav-group-h:first-child { padding-top: 6px; }
/* Étiquettes, à part : un filet, pas d'intitulé. */
aside[data-nav-width] .nav-group-sep {
  flex: none;
  height: 1px;
  margin: 6px 10px 5px var(--nav-ipad);
  background: var(--line);
}
aside[data-nav-width] .nav-empty {
  padding: 6px var(--nav-ipad);
  color: var(--ink-3);
  font: 400 13px/1.4 var(--font);
}

/* ---- Le volet Chats ------------------------------------------------------ */
aside[data-nav-width] .sidebar-chats { margin: 0; }
aside[data-nav-width] .sidebar-chats-list {
  display: flex;
  flex-direction: column;
  gap: 1px;
  padding: 0 0 10px;
}
aside[data-nav-width] .sidebar-chat-row { min-height: 30px; border-radius: var(--r-sm); }
aside[data-nav-width] .sidebar-chat-row:is(:hover, :focus-within) { background: var(--nav-hover); }
aside[data-nav-width] .sidebar-chat-link {
  height: 30px;
  padding: 0 8px 0 var(--nav-ipad);
  border-radius: var(--r-sm);
  color: var(--ink-2);
  font: 400 13px/1 var(--font);
}
aside[data-nav-width] .sidebar-chat-row:is(:hover, :focus-within) .sidebar-chat-link { color: var(--ink); }
aside[data-nav-width] .sidebar-chat-link:focus-visible { outline: 2px solid var(--focus); outline-offset: -2px; }
aside[data-nav-width] .sidebar-chat-pinned { color: var(--ink-3); }
aside[data-nav-width] .sidebar-chat-actions { top: 3px; }
aside[data-nav-width] .sidebar-chat-action {
  width: 24px;
  height: 24px;
  border-radius: 6px;
  color: var(--ink-2);
}
aside[data-nav-width] .sidebar-chat-action:is(:hover, :focus-visible) { background: var(--line); color: var(--ink); }
aside[data-nav-width] .sidebar-chat-action.pinned { color: var(--ink); }
aside[data-nav-width] .sidebar-chats-empty {
  padding: 6px var(--nav-ipad);
  color: var(--ink-3);
  font: 400 13px/1.4 var(--font);
}
aside[data-nav-width] .sidebar-chats-more summary {
  padding: 8px var(--nav-ipad);
  border-radius: var(--r-sm);
  color: var(--ink-3);
  font: 500 12px/1 var(--font);
}
aside[data-nav-width] .sidebar-chats-more summary:hover { background: var(--nav-hover); color: var(--ink); }
/* Le menu ⋮ d'un fil (popover, hors de la barre dans le rendu). */
.sidebar-chat-menu[popover] {
  padding: 4px;
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  background: var(--card);
  box-shadow: var(--shadow-pop);
  color: var(--ink);
}
.sidebar-chat-menu-item {
  border-radius: var(--r-sm);
  color: var(--ink-2);
  font: 500 13px/1.2 var(--font);
}
.sidebar-chat-menu-item:is(:hover, :focus-visible) { background: var(--paper-2); color: var(--ink); }
.sidebar-chat-menu-item.danger { color: var(--danger); }
.sidebar-chat-menu-separator { background: var(--line); }
.sidebar-chat-rename-form input {
  border-color: var(--line-2);
  border-radius: var(--r-sm);
  background: var(--card);
  color: var(--ink);
}
.sidebar-chat-rename-form button { border-radius: var(--r-sm); background: var(--paper-2); color: var(--ink); }
/* L'info-bulle d'un titre de fil coupé (îlot dom.rs). */
.sidebar-chat-tooltip {
  border: 0;
  border-radius: 6px;
  background: var(--ink);
  box-shadow: none;
  color: var(--paper);
  font: 500 12px/1.2 var(--font);
}

/* ---- Le pied : Plugins et le compte (le compte : sidebar::workspace_switcher) */
/* « Plugins » est une `.nav-it` (pages/app.rs), hors de `.nav-body` : on lui
   rend la marge du corps pour que son icône tombe au même aplomb (17 px). */
aside[data-nav-width] > .nav-it.nav-foot-it {
  width: auto;
  margin: 4px var(--nav-pad) 0;
}
aside[data-nav-width] > .nav-it.nav-foot-it.is-rail {
  gap: 0;
  width: var(--nav-row);
  padding: 0 var(--nav-ipad);
}
aside[data-nav-width] .nav-acct {
  border-radius: var(--r-sm);
  background: transparent;
  color: var(--ink);
  transition: background-color var(--d-hover);
}
aside[data-nav-width] .nav-acct:not(.is-rail) { height: 38px; padding: 0 6px 0 5px; }
aside[data-nav-width] .nav-acct:hover { background: var(--nav-hover); }
aside[data-nav-width] .nav-acct.is-rail:hover { filter: none; }
/* L'avatar du membre : une initiale sur papier, sans teinte. Une photo reste
   une photo. */
aside[data-nav-width] .nav-acct > span[style] {
  background-color: var(--paper-2) !important;
  box-shadow: inset 0 0 0 1px var(--line-2);
  color: var(--ink-2) !important;
  font-weight: 600;
}

/* ---- Le menu du compte « comme claude.ai » (23/10/2026) ----------------
   `sidebar::workspace_menu` : l'adresse, puis l'ESPACE ACTIF coché — une
   pastille aux initiales, le nom, la coche — avant Réglages, Utilisation,
   Langue, Aide… Classes écrites à la main : le CSS Tailwind est figé. */
.nav-menu-espace {
  display: flex;
  align-items: center;
  gap: 8px;
  height: 32px;
  padding: 0 8px;
  color: var(--ink);
  font: 500 13px/1.3 var(--font);
}
.nav-menu-espace-pastille {
  display: inline-grid;
  flex: none;
  place-items: center;
  width: 20px;
  height: 20px;
  border-radius: 6px;
  background: var(--paper-2);
  box-shadow: inset 0 0 0 1px var(--line-2);
  color: var(--ink-2);
  font: 600 10px/1 var(--font);
}
.nav-menu-espace-nom { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* ---- Le haut en ligne : le sélecteur de la famille (T3-08) -------------- */
/* Sélecteur allumé (`sidebar::sidebar_top_famille` : en ligne, ou sur une
   instance hub qui l'active) : celui de `famille` (classes `esf-*`, sa
   propre feuille servie à `/pkg/famille.css`) prend la place du logo et du
   nom de l'espace ; l'avatar du compte reste au pied (1.12.1). Ces règles ne
   font que le CALER dans la barre ; son dessin reste celui de la
   bibliothèque. Éteint, aucune de ces classes n'est rendue. */
aside[data-nav-width] .nav-top-famille { gap: 4px; }
aside[data-nav-width] .nav-famille {
  display: flex;
  flex: 1;
  min-width: 0;
  align-items: center;
}
/* Le menu s'ouvre sous la ligne du haut (48 px), pas sous les 56 px de la
   barre des autres applications. */
aside[data-nav-width] .nav-famille .esf-racine { --esf-haut: 48px; min-width: 0; }
aside[data-nav-width] .nav-famille .esf-declencheur { min-height: 32px; padding: 4px 6px; }
/* Replié : la pastille seule, sous « Déplier », au même aplomb que les icônes
   du rail. */
aside[data-nav-width] .nav-famille-rail {
  display: flex;
  flex: none;
  flex-direction: column;
  align-items: flex-start;
  gap: 4px;
  padding: 0 var(--nav-pad) 6px;
}
aside[data-nav-width] .nav-famille-rail .nav-famille { flex: none; }
aside[data-nav-width] .nav-famille-rail .esf-declencheur {
  justify-content: center;
  width: var(--nav-row);
  height: var(--nav-row);
  min-height: 0;
  padding: 0;
}
aside[data-nav-width] .nav-famille-rail .esf-declencheur :is(.esf-nom-app, .esf-chevron) { display: none; }

/* ---- Le haut d'un hub : le logo ouvre les applications (22/10/2026) ----- */
/* `sidebar::sidebar_top_applications` : la tête (`nav-top-ws`), posée dans le
   `<summary>` d'un menu déroulant au lieu d'un lien. Ces règles rendent au
   `<details>` la place du lien (toute la largeur libre), et dessinent les
   lignes du menu : le logo de l'application (26 px, 23/10), le nom, puis sa
   description en encre seconde. Replié, la tuile seule, dans la case d'une
   ligne du rail (`nav-famille-rail`). */
aside[data-nav-width] .nav-apps-haut { display: flex; flex: 1; min-width: 0; }
aside[data-nav-width] .nav-apps-haut > summary { display: flex; flex: 1; min-width: 0; }
aside[data-nav-width] .nav-apps > summary:focus-visible { outline: none; }
aside[data-nav-width] .nav-apps > summary:focus-visible > :is(.nav-top-ws, .nav-apps-tuile) {
  outline: 2px solid var(--focus);
  outline-offset: -2px;
}
aside[data-nav-width] .nav-apps[open] > summary > :is(.nav-top-ws, .nav-apps-tuile) { background: var(--nav-hover); }
aside[data-nav-width] .nav-apps-tuile {
  display: grid;
  place-items: center;
  width: var(--nav-row);
  height: var(--nav-row);
  border-radius: var(--r-sm);
  transition: background-color var(--d-hover);
}
aside[data-nav-width] .nav-apps-tuile:hover { background: var(--nav-hover); }
/* La tête déployée (23/10) : la tuile, « Escouade », puis le chevron du menu. */
aside[data-nav-width] .nav-apps-chevron { display: inline-grid; flex: none; color: var(--ink-2); }
aside[data-nav-width] .nav-apps-item {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 6px 8px;
  color: var(--ink);
  text-decoration: none;
}
aside[data-nav-width] .nav-apps-texte { display: flex; flex: 1; flex-direction: column; min-width: 0; }
aside[data-nav-width] .nav-apps-nom { font: 500 13px/1.3 var(--font); }
aside[data-nav-width] .nav-apps-ligne {
  overflow: hidden;
  color: var(--ink-2);
  font: 400 12px/1.3 var(--font);
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* ---- REPLI-A : les libellés s'effacent d'abord, reviennent en dernier --- */
/* `data-nav-labels="out"` est posé par l'îlot pendant le repli et le dépli ;
   l'aller dure --nav-fade, le retour --nav-fade-in. Seuls les libellés et ce
   qui ne vit pas dans le rail s'effacent : les icônes restent, à leur place. */
aside[data-nav-width] :is(.nav-lb, .nav-group-h, .nav-group-sep, .nav-pane, .nav-favs, .nav-top-av, .nav-top-brand,
  .nav-top:not(.is-rail) [data-action="toggle-nav"], .nav-top-search) {
  transition: opacity var(--nav-fade-in) linear;
}
aside[data-nav-labels="out"] :is(.nav-lb, .nav-group-h, .nav-group-sep, .nav-pane, .nav-favs, .nav-top-av, .nav-top-brand,
  .nav-top:not(.is-rail) [data-action="toggle-nav"], .nav-top-search) {
  opacity: 0;
  transition-duration: var(--nav-fade);
}

/* ---- L'en-tête UNIQUE des pages (P9, D3 — 2026-10-02) ------------------
   Liste, fiche, Planning, Production, Comptabilité : un seul composant
   (`app_shell::page_header`), un seul dessin — celui que l'en-tête des
   listes avait reçu à l'identité B (LIST-A, ex-`.b-ph` de list.css) :
   48 px, l'icône en encre seconde, le titre en 15 px. Un fil d'Ariane
   (la fiche) garde ses propres tailles. */
.page-head {
  height: 48px;
  padding: 0 10px 0 16px;
  border-bottom-color: var(--line);
  background: var(--card);
  color: var(--ink);
  font-family: var(--font);
}
.page-head svg { color: var(--ink-2); }
.page-head :is(h1, .page-title) {
  color: var(--ink);
  font: 600 15px/1.2 var(--font);
  letter-spacing: -.01em;
}

/* Le téléphone (LOT-1, défaut 6, 2/11/2026) : sous 768 px, la tuile flottante de la
   coquille (`app_shell`, 36 px à 8 px du bord, `md:hidden`) se posait sur le début de
   l'en-tête, et une fiche à barre d'actions (Suivre, Partager, Modifier la page…)
   poussait la cloche et le bouton du chat hors de l'écran, où rien ne s'ouvrait plus.
   L'en-tête réserve la place de la tuile ; ses actions défilent dans leur rangée, et
   la barre du haut (la cloche, le chat) reste collée à droite, toujours visible. */
@media (max-width: 767px) {
  .page-head { padding-left: 52px; }
  .page-head .page-head-l { flex: 1 1 0; min-width: 72px; }
  .page-head .page-head-a {
    flex: 0 1 auto; min-width: 0; max-width: calc(100% - 72px);
    overflow-x: auto; overscroll-behavior-x: contain; scrollbar-width: none;
  }
  .page-head .page-head-a::-webkit-scrollbar { display: none; }
  .page-head .page-head-a .tb-cluster {
    position: sticky; right: 0; z-index: 1; background: var(--card);
    box-shadow: -8px 0 8px -4px var(--card);
  }
}

/* ---- Mouvement réduit : rien ne glisse, rien ne s'efface --------------- */
@media (prefers-reduced-motion: reduce) {
  aside[data-nav-width] {
    --nav-fade: 0ms;
    --nav-fade-in: 0ms;
    --nav-dur: 0ms;
    transition: none;
  }
  aside[data-nav-width] *,
  aside[data-nav-width] *::after { transition: none !important; }
}

/* ---- La palette de recherche (Ctrl K) : un MODAL centré (2026-09-30) -----
   À la manière d'Attio : une boîte dans le tiers haut, sur un voile, le champ
   en tête, les résultats dessous, les touches rappelées au pied. Elle
   remplace le panneau latéral pleine hauteur du portage (F3b). Le gabarit
   est `web::command_menu` ; ses utilitaires Tailwind (repris du menu
   des raccourcis) ne servent que de repli, ces règles hors couche gagnent. */
.cmdk-veil { background: color-mix(in srgb, var(--ink) 22%, transparent); }
.cmdk {
  top: 14vh;
  width: min(640px, calc(100vw - 32px));
  max-width: none;
  max-height: min(560px, 72vh);
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--card);
  box-shadow: var(--shadow-pop);
  color: var(--ink);
  font-family: var(--font);
}
.cmdk-head {
  display: flex;
  flex: none;
  align-items: center;
  gap: 10px;
  height: 52px;
  padding: 0 12px 0 16px;
  border-bottom: 1px solid var(--line);
}
.cmdk-glyph { flex: none; color: var(--ink-3); }
.cmdk-input {
  flex: 1;
  min-width: 0;
  height: 100%;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--ink);
  font: 400 15px/1 var(--font);
  outline: none;
}
.cmdk-input::placeholder { color: var(--ink-3); }
.cmdk-esc, .cmdk-foot kbd {
  display: inline-grid;
  min-width: 20px;
  height: 20px;
  place-items: center;
  padding: 0 5px;
  border: 1px solid var(--line-2);
  border-radius: 5px;
  background: var(--paper);
  color: var(--ink-3);
  font: 500 11px/1 var(--font);
}
.cmdk-esc { flex: none; cursor: pointer; }
.cmdk-esc:hover { color: var(--ink); }
.cmdk-body {
  flex: 1;
  min-height: 0;
  padding: 6px;
  overflow-y: auto;
  scrollbar-width: thin;
}
.cmdk-body [data-cmd-item] { border-radius: 8px; }
.cmdk-body :is(a, button).min-h-11,
.cmdk-body [data-cmd-results-body] > a { min-height: 40px; border-radius: 8px; color: var(--ink); }
.cmdk-body :is(a, button):hover { background: var(--paper-2); }
/* L'entrée active au clavier (`palette.rs`) : le papier en retrait, un trait
   d'encre à gauche — jamais le vert, rien ne bouge ici. */
.cmdk-body [data-cmd-active] { background: var(--paper-2); box-shadow: inset 2px 0 0 var(--ink); }
/* Les résultats groupés par type (2026-10-01) : une rangée de pastilles —
   « Tout », puis chaque type et son compte —, et un en-tête par groupe dont
   « Tout voir » ouvre la liste du type. La pastille choisie est pleine. */
.cmdk-types {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  padding: 4px 4px 8px;
}
.cmdk-body .cmdk-chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  height: 26px;
  padding: 0 10px;
  border: 1px solid var(--line-2);
  border-radius: 999px;
  background: var(--card);
  color: var(--ink-2);
  font: 500 12px/1 var(--font);
  cursor: pointer;
}
.cmdk-body .cmdk-chip:hover { background: var(--paper-2); color: var(--ink); }
.cmdk-body .cmdk-chip[aria-pressed="true"] { border-color: var(--ink); background: var(--ink); color: var(--card); }
.cmdk-chip-count { color: var(--ink-3); font-variant-numeric: tabular-nums; }
/* La rangée des affaires : sous celle des types, les noms longs coupés. */
.cmdk-affaires { padding-top: 0; }
.cmdk-chip-label { max-width: 220px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cmdk-chip[aria-pressed="true"] .cmdk-chip-count { color: inherit; opacity: .7; }
.cmdk-type-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.cmdk-body .cmdk-see-all {
  padding: 2px 6px;
  border-radius: 6px;
  color: var(--ink-3);
  font: 500 11px/1.4 var(--font);
  letter-spacing: 0;
  text-transform: none;
  cursor: pointer;
}
.cmdk-body .cmdk-see-all:hover { color: var(--ink); }
.cmdk-foot {
  display: flex;
  flex: none;
  flex-wrap: wrap;
  gap: 6px 16px;
  padding: 8px 14px;
  border-top: 1px solid var(--line);
  background: var(--paper);
  color: var(--ink-3);
  font: 500 12px/1 var(--font);
}
.cmdk-foot span { display: inline-flex; align-items: center; gap: 4px; }
@media (max-width: 640px) {
  .cmdk { top: 8vh; max-height: 80vh; }
  .cmdk-foot { display: none; }
}

/* ---- D47 (31/10/2026) : les séparateurs réglables entre deux panneaux ----
   Un composant pour tous (`web::volet`) : la poignée est un élément
   SANS largeur posé entre les deux panneaux, hors de leur défilement ; son
   filet de 6 px (::before) déborde de part et d'autre. Le module de base la
   mène comme celle du menu : souris, flèches, Début, Fin. La largeur choisie
   arrive en `--volet-<clé>` sur l'enveloppe de la page. */
.volet-poignee {
  position: relative; z-index: 25; flex: none; align-self: stretch; width: 0; margin: 0; padding: 0;
  cursor: col-resize; touch-action: none; outline: none;
}
.volet-poignee::before {
  content: ""; position: absolute; top: 0; bottom: 0; left: -3px; width: 6px;
  background: transparent; transition: background-color var(--d-hover, .12s);
}
.volet-poignee:is(:hover, :active)::before { background: var(--line-2); }
.volet-poignee:focus-visible::before { background: var(--line-2); outline: 2px solid var(--focus); outline-offset: -2px; }
body:has([data-volet][data-nav-resizing]) { cursor: col-resize; user-select: none; }
body:has([data-volet][data-nav-resizing]) iframe { pointer-events: none; }
@media (prefers-reduced-motion: reduce) { .volet-poignee::before { transition: none; } }
@media (max-width: 767px) { .volet-poignee { display: none; } }
/* Emails : les dossiers, puis la liste quand un fil est ouvert. */
.b-mail-folders[data-volet] { width: var(--volet-emails-dossiers, 224px); }
[data-volet="emails-liste"] { width: var(--volet-emails-liste, min(470px, 34vw)); }
/* La fiche : son volet, à l'écran large seulement (en dessous, il passe
   au-dessus des onglets). */
@media (min-width: 1024px) { .b-aside[data-volet] { width: var(--volet-fiche-volet, 380px); } }
@media (max-width: 1023px) { .volet-poignee[data-resize-pane="fiche-volet"] { display: none; } }

/* ---- D57 (31/10/2026) : UN interrupteur pour tous les écrans ------------
   `ui::input::switch_track` : la piste et son rond, aux jetons de
   l'identité — les mêmes que les connecteurs (`.cnx-switch`). Allumé :
   piste à l'encre, rond à la carte ; éteint : piste au filet appuyé. Les
   deux thèmes se lisent, puisque l'encre et la carte s'inversent ensemble.
   L'état vient de `data-on` (connu du serveur) ou de la case cochée qui la
   précède ; désactivé, il pâlit ; le focus se voit sur la piste. */
.esc-switch {
  position: relative; display: inline-block; flex: none; width: 30px; height: 18px;
  border-radius: var(--r-pill, 999px); background: var(--line-2);
  transition: background-color var(--d-hover, .12s);
}
.esc-switch > i {
  position: absolute; top: 2px; left: 2px; width: 14px; height: 14px;
  border-radius: 50%; background: var(--card); box-shadow: var(--shadow-knob, 0 1px 2px rgb(0 0 0 / 25%));
  transition: transform var(--d-hover, .12s) var(--out, ease-out);
}
.esc-switch[data-on], input:checked ~ .esc-switch { background: var(--ink); }
.esc-switch[data-on] > i, input:checked ~ .esc-switch > i { transform: translateX(12px); }
:disabled > .esc-switch, input:disabled ~ .esc-switch { opacity: .5; }
:focus-visible > .esc-switch, input:focus-visible ~ .esc-switch { outline: 2px solid var(--focus); outline-offset: 2px; }
@media (prefers-reduced-motion: reduce) { .esc-switch, .esc-switch > i { transition: none; } }

/* ---- Les pastilles de la barre (D174) : le compte d'une entrée qui attend ----
   Une image que le serveur dessine (`crates/web/src/nav_badges.rs`). Dépliée, le
   nombre à droite du libellé ; repliée, sur le coin haut droit de l'icône.
   Une image vide (rien n'attend) mesure 0 × 0 et ne prend aucune place. */
aside[data-nav-width] .nav-it > .nav-bdg { flex: none; height: 16px; margin-left: auto; }
aside[data-nav-width] .nav-it:has(> .nav-bdg.is-rail) { position: relative; }
aside[data-nav-width] .nav-it > .nav-bdg.is-rail {
  position: absolute;
  top: 3px;
  left: calc(var(--nav-ipad) + 10px);
  height: auto;
  margin: 0;
  pointer-events: none;
}
/* Le réglage des pastilles, dans « Modifier la barre latérale ». */
aside[data-nav-width] .nav-bdg-form { margin-top: 8px; padding-top: 8px; border-top: 1px solid var(--line); }
aside[data-nav-width] .nav-bdg-row { display: flex; align-items: center; gap: 8px; min-height: 30px; padding: 0 6px 0 var(--nav-ipad); font: 500 13px/1 var(--font); color: var(--ink-2); }
aside[data-nav-width] .nav-bdg-select { flex: none; height: 26px; padding: 0 6px; border: 1px solid var(--line); border-radius: 6px; background: var(--paper, transparent); color: var(--ink); font: 500 12px/1 var(--font); }
aside[data-nav-width] .nav-bdg-select:focus-visible { outline: 2px solid var(--focus); outline-offset: 1px; }

/* ---- Le tiroir du téléphone (5/11) -------------------------------------- */
aside[data-nav-width] .nav-fermer { display: none; }
@media (max-width: 767.98px) {
  /* 100vh passe sous la barre d'adresse du navigateur mobile : la rangée suit
     la hauteur réellement visible, et le bas de chaque page reste atteignable. */
  .app-rangee { height: 100vh; height: 100dvh; }
  aside[data-nav-width] {
    --nav-row: 40px;
    max-width: calc(100vw - 48px);
    padding-bottom: env(safe-area-inset-bottom, 0px);
  }
  aside[data-nav-width] .nav-body { overscroll-behavior: contain; -webkit-overflow-scrolling: touch; }
  aside[data-nav-width] .nav-top [data-action="toggle-nav"][aria-expanded="true"] { display: none; }
  aside[data-nav-width] .nav-top .nav-top-search {
    width: 36px;
    height: 36px;
  }
  aside[data-nav-width] .nav-fermer {
    display: inline-flex;
    flex: none;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border-radius: 6px;
    color: var(--ink-2, var(--ink));
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
  }
  aside[data-nav-width] .nav-fermer:active { background: var(--nav-hover); }
}

/* assets/b/chat.css */
/* ==========================================================================
   Escouade · identité B — le chat (lot 2)
   Écrans : /chat (le fil, l'accueil, le composeur, l'attente), le chat
   latéral qui monte la même conversation, et la fenêtre d'historique
   (/chat?history=1).
   Variantes du kit (kit/CHAT.html) :
     CHAT-C    prose façon ChatGPT, colonne resserrée (660), bulle arrondie,
               « Fiches citées » en fin de réponse, actions atténuées ;
     VIDE-A    la salutation seule, centrée avec le champ ;
     COMP-A..D fusion : réglages à gauche (+, agent, mode), action à droite
               (jauge, Dicter, Envoyer), fichiers joints en carrés ;
     ATTENTE-C « Réflexion… » sans carte, les outils en ligne : rond qui
               respire tant qu'ils tournent, carré à l'encre une fois finis ;
     HIST-B    la palette : une colonne sous la recherche, groupée par
               récence, les actions sur la ligne choisie, l'aperçu masqué.
   Règles : seulement les jetons d'escouade-b.css, aucune couleur en dur ; le
   vert signal ne sert qu'à ce qui bouge (l'attente, la dictée, le point
   d'envoi) — jamais sur une fiche citée ni sur un bouton qui valide.
   ai-chat.css est chargée DANS la page, donc peut-être après cette feuille :
   chaque règle est préfixée de sa racine (.ai-conversation, .ai-page,
   .ai-history-backdrop) pour l'emporter quel que soit l'ordre.
   --mono et --scrim sont définis dans escouade-b.css ; --shadow-pop garde son repli.
   ========================================================================== */

@keyframes ai-b-pulse {
  0%   { box-shadow: 0 0 0 0 var(--signal-glow); }
  70%  { box-shadow: 0 0 0 7px transparent; }
  100% { box-shadow: 0 0 0 0 transparent; }
}
@keyframes ai-b-land { from { opacity: 0; transform: translateY(-6px); } }

/* ---- La page et son en-tête ------------------------------------------------ */
/* Le fond de page de la Bibliothèque (2026-10-21) ; la zone de saisie, les
   menus, les cartes gardent le leur (`--card`), la bulle le sien (`--paper-2`). */
.ai-page{background:var(--paper);color:var(--ink)}
.ai-page .ai-header{min-height:52px;padding:0 14px 0 22px;gap:10px;border-bottom:1px solid var(--line)}
.ai-page .ai-title{font:600 14.5px/1.2 var(--font);letter-spacing:var(--ls-tight,-.01em);color:var(--ink)}
.ai-page .ai-controls{gap:2px}
/* Les icônes d'une conversation vont à droite, juste avant la cloche, au lieu de flotter au milieu
   de la barre (Ghislain, 5/11) : le titre prend la place qui reste, à toutes les largeurs. */
.ai-page .ai-header:not(:has(select)){flex-wrap:nowrap;align-items:center;justify-content:flex-start}
.ai-page .ai-header:not(:has(select)) .ai-title{flex:1 1 0;width:auto;max-width:none;min-width:0}
.ai-page .ai-header:not(:has(select)) .ai-controls{flex:none;width:auto;flex-wrap:nowrap;justify-content:flex-end;margin-left:auto}
.ai-page .ai-header .tb-cluster{margin-left:0}
.ai-page .ai-header:not(:has(select)){gap:2px}
.ai-page .ai-header:not(:has(select)) .ai-title{margin-right:8px}
.ai-page .ai-header:not(:has(select)) .ai-icon-control{width:32px;min-width:32px;height:32px}
.ai-page .ai-control{border-radius:var(--r-sm);color:var(--ink-2);transition:background var(--d-hover),color var(--d-hover)}
.ai-page .ai-control:hover{background:var(--paper-2);color:var(--ink)}
.ai-page .ai-icon-control{width:28px;min-width:28px;height:28px;border-radius:var(--r-sm)}
.ai-page .ai-thread-menu[open]>summary{background:var(--paper-2);color:var(--ink)}

/* menus du fil et de la réponse : la carte de menu du kit */
.ai-page .ai-thread-menu-panel,.ai-conversation .ai-assistant-menu{width:auto;min-width:220px;padding:4px;gap:1px;border:1px solid var(--line);border-radius:var(--r-btn);background:var(--card);box-shadow:var(--shadow-pop,var(--shadow-frame))}
.ai-page .ai-thread-menu-item,.ai-conversation .ai-assistant-menu button{min-height:30px;padding:0 8px;gap:9px;border-radius:6px;color:var(--ink);font:400 13.5px/1.2 var(--font);white-space:nowrap}
.ai-page .ai-thread-menu-item svg{color:var(--ink-2)}
.ai-page .ai-thread-menu-item:hover,.ai-page .ai-thread-menu-item:focus-visible,.ai-conversation .ai-assistant-menu button:hover{background:var(--paper-2);color:var(--ink)}
.ai-page .ai-thread-menu-item.danger,.ai-page .ai-thread-menu-item.danger svg{color:var(--danger)}
.ai-page .ai-thread-menu-divider{margin:4px 2px;background:var(--line)}
.ai-page .ai-thread-rename-form input{border:1px solid var(--line-2);border-radius:var(--r-sm);background:var(--card);color:var(--ink)}
.ai-page .ai-thread-rename-form button{border-radius:var(--r-sm);background:var(--btn-bg);color:var(--btn-ink);font-weight:500}

/* fiches liées au fil : des puces au trait */
.ai-page .ai-linked-entities{max-width:none;margin:0;padding:8px 22px;border-bottom:1px solid var(--line)}
.ai-page .ai-entity-chip{height:24px;padding:0 9px;gap:6px;border:1px solid var(--line);border-radius:var(--r-pill);background:var(--card);color:var(--ink-2);font-size:12px}
.ai-page .ai-entity-chip:hover{border-color:var(--ink);background:var(--card);color:var(--ink)}

/* panneau « contexte du fil » */
.ai-page .ai-context-panel{border:1px solid var(--line);border-radius:var(--r-panel);background:var(--card);box-shadow:var(--shadow-pop,var(--shadow-frame))}
.ai-page .ai-context-panel>p{color:var(--ink-3)}
.ai-page .ai-context-panel-header a{border-radius:var(--r-sm);color:var(--ink-2)}
.ai-page .ai-context-panel-header a:hover{background:var(--paper-2);color:var(--ink)}
.ai-page :is(.ai-context-linked,.ai-context-objects a){border-color:var(--line);color:var(--ink-2)}
.ai-page :is(.ai-context-objects a:hover,.ai-context-objects a.selected){border-color:var(--ink);background:var(--card);color:var(--ink)}
.ai-page .ai-context-search input{border:1px solid var(--line-2);border-radius:var(--r-sm);background:var(--card);color:var(--ink)}
.ai-page .ai-context-search button{border-radius:var(--r-sm);background:var(--btn-bg);color:var(--btn-ink);font-weight:500}
.ai-page .ai-context-results button{color:var(--ink)}
.ai-page .ai-context-results button:hover{background:var(--paper-2)}

/* ---- VIDE-A : la salutation seule, au-dessus du champ ------------------------ */
.ai-conversation .ai-greeting{font:600 26px/1.2 var(--font);letter-spacing:var(--ls-h1,-.035em);color:var(--ink);text-wrap:balance}
/* Le salut, centré, sans logo (Ghislain, 5/11). */
.ai-conversation .ai-greeting,.ai-panneau-bonjour{display:flex;align-items:center;justify-content:center;gap:10px}
.ai-panneau-bonjour{justify-content:flex-start}
/* La rangée de l écran vide : l historique colle à la cloche, à droite. */
.ai-page>.tb-row .tb-cluster{margin-left:0}

/* ---- CHAT-C : le fil ------------------------------------------------------- */
.ai-conversation .ai-log [data-ai-list]{gap:22px}
/* la question : une bulle arrondie, sans pointe */
.ai-conversation .ai-user-message{gap:2px}
.ai-conversation .ai-user-bubble{max-width:85%;padding:10px 18px;border-radius:22px;background:var(--paper-2);color:var(--ink);font-size:14.5px;line-height:1.5}
/* la réponse : de la prose, plus grande, sans cadre */
.ai-conversation .ai-assistant-message{display:grid;gap:14px;padding:0}
.ai-conversation .ai-assistant-content>div{gap:10px;font-size:16px;line-height:1.72;color:var(--ink)}
.ai-conversation .ai-assistant-content p{margin:0}
.ai-conversation .ai-assistant-content strong{font-weight:600}
.ai-conversation .ai-assistant-content :is(h1,h2,h3){color:var(--ink);font-weight:600;letter-spacing:var(--ls-tight,-.01em)}
/* puces : de petits carrés de matière, pas des disques */
.ai-conversation .ai-assistant-content ul{display:grid;gap:8px;padding-left:0;list-style:none}
.ai-conversation .ai-assistant-content ul>li{position:relative;padding-left:18px}
.ai-conversation .ai-assistant-content ul>li::before{content:"";position:absolute;left:2px;top:.68em;width:5px;height:5px;border-radius:var(--r-mark);background:var(--ink-faint)}
.ai-conversation .ai-assistant-content ol{display:grid;gap:8px}
.ai-conversation .ai-assistant-content ol>li::marker{color:var(--ink-3);font-variant-numeric:tabular-nums}
.ai-conversation .ai-assistant-content blockquote{border-left-color:var(--line-2);color:var(--ink-2)}
.ai-conversation .ai-assistant-content code{font-family:var(--mono,ui-monospace,SFMono-Regular,Menlo,Consolas,monospace)}
/* les liens vers une fiche : l'encre, soulignés en pointillé ; jamais le vert */
.ai-conversation .ai-assistant-content a{color:var(--ink);text-decoration:underline;text-decoration-color:var(--ink-3);text-underline-offset:3px}
.ai-conversation .ai-assistant-content a[href^="/graph?neighbors="]{text-decoration-style:dotted}
/* CHAT-C2 : le numéro de source après une mention, discret, cliquable */
.ai-conversation .ai-assistant-content sup.ai-cite{margin-left:1px;font-size:10.5px;line-height:0}
.ai-conversation .ai-assistant-content sup.ai-cite>a{padding:0 1px;color:var(--ink-2);text-decoration:none;font-variant-numeric:tabular-nums}
.ai-conversation .ai-assistant-content sup.ai-cite>a:hover{color:var(--ink);text-decoration:underline}
.ai-conversation .ai-assistant-content a:hover{text-decoration-style:solid;text-decoration-color:var(--ink)}
/* une étape « Outil » repliable, au trait */
.ai-conversation .ai-assistant-content details{border:1px solid var(--line);border-radius:var(--r-sm);background:var(--paper);font-size:13px}
.ai-conversation .ai-assistant-content details>summary{padding:6px 9px;gap:7px;color:var(--ink-2)}
.ai-conversation .ai-assistant-content details>summary:hover{background:var(--paper-2)}
.ai-conversation .ai-assistant-content details>summary svg{color:var(--ink-3)}
/* un outil en échec garde sa marque : le rouge d'erreur, pas le gris */
.ai-conversation .ai-assistant-content details>summary svg.text-tag-red{color:var(--danger)}
.ai-conversation .ai-assistant-content details>summary>span:first-of-type{font:600 10px/1 var(--font);letter-spacing:.07em;color:var(--ink-3)}
.ai-conversation .ai-assistant-content details>summary>span:last-of-type{font:500 12px/1 var(--mono,ui-monospace,SFMono-Regular,Menlo,Consolas,monospace);color:var(--ink)}
.ai-conversation .ai-assistant-content details>div{border-top-color:var(--line)}
/* « Arguments », « Résultat » : le libellé du kit (.lab) */
.ai-conversation .ai-assistant-content details>div>div>div:first-child{font:600 10px/1 var(--font);letter-spacing:.07em;color:var(--ink-3)}
.ai-conversation .ai-assistant-content details pre{border:1px solid var(--line);border-radius:6px;background:var(--card);color:var(--ink);font-family:var(--mono,ui-monospace,SFMono-Regular,Menlo,Consolas,monospace)}

/* « Fiches citées » : la rangée de fin de réponse — un carré à l'encre, le nom */
.ai-conversation .ai-cited{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin-bottom:8px}
.ai-conversation .ai-cited-n{flex:none;color:var(--ink-3);font-size:11.5px;font-variant-numeric:tabular-nums}
.ai-conversation .ai-cited-label{margin-right:4px;font:500 12px/1 var(--font);color:var(--ink-3)}
.ai-conversation .ai-cited-chip{display:inline-flex;align-items:center;gap:6px;max-width:260px;height:26px;padding:0 9px 0 5px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--card);color:var(--ink);font-size:12.5px;text-decoration:none;transition:border-color var(--d-hover)}
.ai-conversation .ai-cited-chip:hover{border-color:var(--ink)}
.ai-conversation .ai-cited-chip:focus-visible{outline:2px solid var(--focus);outline-offset:2px}
.ai-conversation .ai-cited-sq{flex:none;width:16px;height:16px;border-radius:4px;background:var(--ink);display:grid;place-items:center}
/* le glyphe de l'objet, générique : une feuille au trait, dessinée en CSS */
.ai-conversation .ai-cited-sq::before{content:"";width:6px;height:8px;border:1.5px solid var(--card);border-radius:1.5px}
.ai-conversation .ai-cited-name{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* les actions sous les messages : des icônes carrées, atténuées jusqu'au survol */
.ai-conversation :is(.ai-user-actions,.ai-assistant-actions){gap:0;color:var(--ink-3)}
.ai-conversation .ai-assistant-actions{min-height:28px;margin-top:0;opacity:.55;transition:opacity var(--d-hover)}
.ai-conversation .ai-assistant-message:is(:hover,:focus-within) .ai-assistant-actions,.ai-conversation .ai-assistant-actions:has([open],[aria-pressed="true"]){opacity:1}
.ai-conversation :is(.ai-user-actions button,.ai-assistant-actions>button,.ai-assistant-more>summary){width:28px;height:28px;border-radius:var(--r-sm);color:var(--ink-2)}
.ai-conversation :is(.ai-user-actions button,.ai-assistant-actions>button,.ai-assistant-more>summary):hover,.ai-conversation .ai-assistant-actions button[aria-pressed="true"],.ai-conversation .ai-assistant-more[open]>summary{background:var(--paper-2);color:var(--ink)}
.ai-conversation :is(.ai-user-actions button,.ai-assistant-actions>button,.ai-assistant-more>summary):focus-visible{outline:2px solid var(--focus);outline-offset:2px}
.ai-conversation .ai-action-status{margin-left:6px;color:var(--ink-3)}
@media(hover:none){.ai-conversation .ai-assistant-actions{opacity:1}}

/* une décision d'agent : la carte ACT (kit ACT-A, libellés ACT-I). Un rond
   signal qui respire tant que la proposition attend ; « Valider » et
   « Rejeter » en secondaires BTN-B — le signal ne va jamais sur Valider, et
   Rejeter ne rougit qu'au survol ou au focus. */
.ai-conversation .ai-act{display:grid;overflow:hidden;border:1px solid var(--line);border-radius:var(--r);background:var(--card)}
.ai-conversation .ai-act-head{display:flex;flex-wrap:wrap;align-items:center;gap:8px 10px;padding:10px 12px}
.ai-conversation .ai-act-pend{flex:none;width:10px;height:10px;border-radius:var(--r-round,50%);background:var(--signal);animation:ai-b-pulse var(--d-pulse) var(--out) infinite}
.ai-conversation .ai-act-txt{display:flex;flex:1;align-items:center;gap:8px;min-width:160px}
.ai-conversation .ai-act-ty{font:var(--t-label);letter-spacing:var(--ls-label);text-transform:uppercase;color:var(--ink-2)}
.ai-conversation .ai-act-st{font:var(--t-caption);color:var(--ink-3)}
.ai-conversation .ai-agent-decisions{display:flex;flex-wrap:wrap;gap:6px;margin:0}
.ai-conversation .ai-agent-decisions button{display:inline-flex;align-items:center;gap:6px;height:30px;padding:0 12px;border:0;border-radius:var(--r-sm);background:var(--card);color:var(--ink);box-shadow:inset 0 0 0 1px var(--line-2),var(--shadow-1);font:500 13px/1 var(--font);cursor:pointer;transition:background var(--d-hover),color var(--d-hover),box-shadow var(--d-hover)}
.ai-conversation .ai-agent-decisions button svg{flex:none;color:var(--ink-2)}
.ai-conversation .ai-agent-decisions button:hover{background:var(--paper-2)}
.ai-conversation .ai-agent-decisions button:focus-visible{outline:2px solid var(--focus);outline-offset:2px}
.ai-conversation .ai-agent-decisions button:last-child:is(:hover,:focus-visible){background:var(--danger-soft);color:var(--danger);box-shadow:inset 0 0 0 1px var(--danger)}
.ai-conversation .ai-agent-decisions button:last-child:is(:hover,:focus-visible) svg{color:var(--danger)}

/* la carte de validation (2026-10-20) : la carte ACT qui porte une écriture
   préparée par l'IA — un courriel (De, À, Objet, corps) ou une autre écriture
   (l'outil et ses arguments) — et ses trois gestes : Envoyer (ou Valider),
   Modifier, Annuler. Ouverte (« Modifier »), elle montre ses champs à
   corriger ; servie, ses gestes s'effacent et son rond cesse de respirer.
   Écrite à la main : le CSS Tailwind est figé. */
.ai-conversation .ai-carte{max-width:640px}
.ai-conversation .ai-carte-champs{display:grid;grid-template-columns:max-content minmax(0,1fr);gap:4px 12px;margin:0;padding:0 12px 10px;font:400 13px/1.45 var(--font)}
.ai-conversation .ai-carte-champs>div{display:contents}
.ai-conversation .ai-carte-champs dt{color:var(--ink-3)}
.ai-conversation .ai-carte-champs dd{margin:0;min-width:0;overflow-wrap:anywhere;color:var(--ink)}
.ai-conversation :is(.ai-carte-corps,.ai-carte-json){margin:0 12px 10px;padding:10px 12px;max-height:320px;overflow:auto;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--paper-2);color:var(--ink);font:400 13.5px/1.5 var(--font);white-space:pre-wrap;overflow-wrap:anywhere}
.ai-conversation .ai-carte-json{font:400 12px/1.5 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}
.ai-conversation .ai-carte-alerte{margin:0 12px 10px;color:var(--danger);font:400 12.5px/1.45 var(--font)}
.ai-conversation .ai-carte-edition{display:grid;gap:8px;padding:0 12px 10px}
.ai-conversation .ai-carte-edition label{display:grid;gap:4px;font:400 12px/1.4 var(--font);color:var(--ink-3)}
.ai-conversation .ai-carte-edition :is(input[type=text],textarea){box-sizing:border-box;width:100%;padding:6px 8px;border:1px solid var(--line-2);border-radius:var(--r-sm);background:var(--card);color:var(--ink);font:400 13.5px/1.45 var(--font)}
.ai-conversation .ai-carte-edition textarea{min-height:140px;resize:vertical}
.ai-conversation .ai-carte-edition :is(input[type=text],textarea):focus-visible{outline:2px solid var(--focus);outline-offset:1px}
.ai-conversation .ai-carte-boites{display:grid;gap:4px;margin:0;padding:0;border:0}
.ai-conversation .ai-carte-boites legend{margin-bottom:2px;padding:0;font:400 12px/1.4 var(--font);color:var(--ink-3)}
.ai-conversation .ai-carte-boites label{display:flex;align-items:center;gap:8px;color:var(--ink);font-size:13px}
.ai-conversation .ai-carte-aide{margin:0;font:400 12px/1.4 var(--font);color:var(--ink-3)}
.ai-conversation .ai-carte-erreur{margin:0;color:var(--danger);font:400 12.5px/1.4 var(--font)}
.ai-conversation .ai-carte .ai-agent-decisions{padding:0 12px 12px}
.ai-conversation .ai-carte:not([data-ai-validation-editing]) .ai-carte-edition{display:none}
.ai-conversation .ai-carte[data-ai-validation-editing] :is(.ai-carte-champs,.ai-carte-corps,.ai-carte-alerte){display:none}
.ai-conversation .ai-carte[data-ai-validation-blocked]:not([data-ai-validation-editing]) [data-ai-validation-send],.ai-conversation .ai-carte[data-ai-validation-saving] [data-ai-validation-send]{opacity:.45;pointer-events:none}
.ai-conversation .ai-carte[data-ai-validation-done] .ai-agent-decisions{display:none}
.ai-conversation .ai-carte[data-ai-validation-done] .ai-act-pend{animation:none;background:var(--ink-3)}

/* ---- ATTENTE-C : les étapes qui se posent ---------------------------------- */
.ai-conversation .ai-thinking{display:grid;gap:4px;max-width:none;padding:0;border:0;border-radius:0;background:transparent}
.ai-conversation .ai-thinking-heading{display:flex;align-items:center;gap:10px;color:var(--ink);font-size:14.5px;font-weight:400}
.ai-conversation .ai-thinking-orb{flex:none;width:10px;height:10px;border-radius:var(--r-round,50%);background:var(--signal);animation:ai-b-pulse var(--d-pulse) var(--out) infinite}
.ai-conversation .ai-thinking-time{margin-left:auto;font-size:12px;color:var(--ink-3);font-variant-numeric:tabular-nums}
.ai-conversation .ai-thinking-hint{font-size:12.5px;line-height:1.5;color:var(--ink-3)}
/* dès qu'un outil tourne, c'est lui qui bouge : l'en-tête perd son rond */
.ai-conversation .ai-thinking:has(~ .ai-tool-activity:not([hidden])) .ai-thinking-orb{display:none}
/* la ligne des outils (le code la résume sur une ligne) : rond qui respire
   tant qu'ils tournent, carré à l'encre une fois finis — le passage rond →
   carré de la grammaire */
.ai-conversation .ai-tool-activity{position:relative;align-self:stretch;display:block;margin:0 0 0 4px;padding:5px 0 5px 14px;border-left:1px solid var(--line);font:400 12.5px/1.4 var(--font);color:var(--ink-3)}
.ai-conversation .ai-tool-activity::before{content:"";position:absolute;left:-5px;top:50%;width:9px;height:9px;margin-top:-4.5px;border-radius:var(--r-mark);background:var(--ink);transition:border-radius var(--d-morph) var(--ease),background var(--d-morph) var(--ease)}
.ai-conversation .ai-tool-activity[data-ai-active]::before{border-radius:var(--r-round,50%);background:var(--signal);animation:ai-b-pulse var(--d-pulse) var(--out) infinite}
.ai-conversation .ai-tool-activity:not([hidden]){animation:ai-b-land var(--d-land) var(--out)}
/* ATTENTE-C : une étape par ligne — ce que l'agent fait, puis ce qu'il cherche */
.ai-conversation .ai-tool-activity:has(.ai-steps)::before{display:none}
.ai-conversation .ai-steps{display:grid;gap:3px;margin:0;padding:0;list-style:none}
.ai-conversation .ai-step{position:relative;display:flex;gap:8px;min-width:0}
.ai-conversation .ai-step::before{content:"";position:absolute;left:-18px;top:.45em;width:7px;height:7px;border-radius:var(--r-mark);background:var(--ink)}
.ai-conversation .ai-step[data-ai-step-active]::before{border-radius:var(--r-round,50%);background:var(--signal);animation:ai-b-pulse var(--d-pulse) var(--out) infinite}
.ai-conversation .ai-step-name{flex:none;color:var(--ink-2);font-weight:500}
.ai-conversation .ai-step-detail{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ai-conversation .ai-step-duration{flex:none;margin-left:auto;color:var(--ink-3);font-variant-numeric:tabular-nums;font-size:11px}
.ai-conversation .ai-step[data-ai-step-failed] .ai-step-duration{color:var(--danger,var(--ink-2))}
/* D28 (31/10) : la phrase du serveur, dans la langue du membre ; la réponse
   arrivée, les étapes se replient sous « n étapes » (un clic les rouvre) */
.ai-conversation .ai-step-label{color:var(--ink-2)}
.ai-conversation .ai-steps-fold{margin:0}
.ai-conversation .ai-steps-summary{display:inline-flex;align-items:center;gap:6px;cursor:pointer;list-style:none;color:var(--ink-3);user-select:none}
.ai-conversation .ai-steps-summary::-webkit-details-marker{display:none}
.ai-conversation .ai-steps-summary::after{content:"";width:6px;height:6px;margin-top:-3px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(45deg);transition:transform var(--d-morph,.15s) var(--ease,ease)}
.ai-conversation .ai-steps-fold[open] > .ai-steps-summary::after{margin-top:3px;transform:rotate(-135deg)}
.ai-conversation .ai-steps-summary:hover{color:var(--ink-2)}
.ai-conversation .ai-steps-fold[open] > .ai-steps{margin-top:6px}
.ai-conversation .ai-tool-activity:has(.ai-steps-fold:not([open]))::before{display:block}

/* CHAT-C2 : le panneau d'extrait d'une source, à droite */
.ai-source-panel{position:fixed;top:0;right:0;bottom:0;z-index:60;display:flex;flex-direction:column;gap:12px;width:min(380px,100vw);padding:16px;overflow-y:auto;border-left:1px solid var(--line);background:var(--card);box-shadow:var(--shadow-1);color:var(--ink);font:400 13.5px/1.5 var(--font)}
.ai-source-panel[hidden]{display:none}
.ai-source-panel .ai-source-head{display:flex;align-items:flex-start;gap:8px}
.ai-source-panel .ai-source-n{flex:none;color:var(--ink-3);font-variant-numeric:tabular-nums}
.ai-source-panel .ai-source-title{flex:1;min-width:0;font-weight:600;overflow-wrap:anywhere}
.ai-source-panel .ai-source-close{flex:none;width:28px;height:28px;border-radius:var(--r-sm);color:var(--ink-2);font-size:18px;line-height:1}
.ai-source-panel .ai-source-close:hover{background:var(--paper-2);color:var(--ink)}
.ai-source-panel .ai-source-body{display:grid;gap:10px;color:var(--ink-2)}
.ai-source-panel .ai-source-kind{justify-self:start;padding:1px 7px;border:1px solid var(--line);border-radius:var(--r-sm);font-size:11.5px;color:var(--ink-3)}
.ai-source-panel .ai-source-excerpt{margin:0;padding:10px 12px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--paper);color:var(--ink);white-space:pre-wrap}
.ai-source-panel .ai-source-linked-label{font:600 10px/1 var(--font);letter-spacing:.07em;text-transform:uppercase;color:var(--ink-3)}
.ai-source-panel .ai-source-linked{display:grid;gap:4px;margin:0;padding:0;list-style:none}
.ai-source-panel a{color:var(--ink);text-decoration:underline;text-decoration-color:var(--ink-3);text-underline-offset:3px}
.ai-source-panel .ai-source-open{align-self:start;font-weight:500}
/* TOOLS-OUVRIR-DOCUMENT : un document cité s'ouvre dans Tools, à la page, le passage surligné. */
.ai-source-panel a.ai-source-tools{justify-self:start;display:inline-flex;align-items:center;min-height:32px;padding:4px 12px;border:1px solid var(--line-2);border-radius:var(--r-sm);background:var(--card);font-weight:500;text-decoration:none}
.ai-source-panel a.ai-source-tools:hover{background:var(--paper-2)}

/* ---- Le composeur : fusion COMP-A à D -------------------------------------- */
.ai-conversation .ai-composer{display:grid;gap:6px;padding:10px 10px 8px 14px;border:1px solid var(--line-2);border-radius:var(--r-frame);background:var(--card);box-shadow:var(--shadow-1);transition:border-color var(--d-hover),box-shadow var(--d-hover)}
.ai-conversation .ai-composer:focus-within{border-color:var(--ink);box-shadow:var(--ring-ink)}
.ai-conversation .ai-input{min-height:44px;padding:0;color:var(--ink);font:400 15px/1.5 var(--font);resize:none}
.ai-conversation .ai-input::placeholder{color:var(--ink-3)}
.ai-conversation .ai-input:read-only{color:var(--ink-2)}
.ai-conversation .ai-composer-toolbar{gap:4px;min-height:32px;color:var(--ink-2);font-size:13px}
/* le « + » : un rond au trait */
.ai-conversation .ai-attach-trigger{width:30px;height:30px;border-radius:var(--r-round,50%);color:var(--ink-2);box-shadow:inset 0 0 0 1px var(--line-2);transition:box-shadow var(--d-hover),color var(--d-hover)}
.ai-conversation .ai-attach-trigger:hover,.ai-conversation .ai-attach-menu[open] .ai-attach-trigger{background:transparent;color:var(--ink);box-shadow:inset 0 0 0 1px var(--ink)}
.ai-conversation .ai-attach-trigger:focus-visible{outline:2px solid var(--focus);outline-offset:2px}
/* son menu : la carte de menu ; vers le haut une fois le fil ouvert */
.ai-conversation .ai-attach-panel{width:auto;min-width:230px;max-height:min(320px,45dvh);padding:4px;border:1px solid var(--line);border-radius:var(--r-btn);background:var(--card);box-shadow:var(--shadow-pop,var(--shadow-frame))}
.ai-conversation:has([data-ai-list]) .ai-attach-panel{top:auto;bottom:calc(100% + 8px)}
.ai-conversation .ai-attach-item{min-height:30px;padding:0 8px;gap:9px;border-radius:6px;color:var(--ink);font:400 13.5px/1.2 var(--font)}
.ai-conversation .ai-attach-item>svg:first-child{color:var(--ink-2)}
.ai-conversation .ai-attach-item>svg:last-child:not(:first-child){color:var(--ink-3)}
.ai-conversation .ai-attach-item:hover{background:var(--paper-2)}
.ai-conversation .ai-attach-item.disabled{opacity:1;color:var(--ink-3)}
.ai-conversation .ai-attach-item.disabled:hover{background:transparent}
.ai-conversation .ai-attach-divider{margin:4px 2px;background:var(--line)}
.ai-conversation .ai-attach-item:has(.ai-file-input:focus-visible){outline:2px solid var(--focus);outline-offset:-2px}
/* agent et mode : à GAUCHE, deux sélecteurs sobres */
.ai-conversation .ai-model-picker{max-width:none;margin-left:0;gap:2px;order:0}
.ai-conversation .ai-model-picker select{height:28px;max-width:180px;padding:0 20px 0 8px;border-radius:var(--r-sm);background-color:transparent;color:var(--ink-2);font:400 12.5px/1 var(--font)}
.ai-conversation .ai-model-picker select:hover,.ai-conversation .ai-model-picker select:focus-visible{background-color:var(--paper-2);color:var(--ink)}
.ai-conversation .ai-mode-picker>summary{height:28px;padding:0 8px;gap:5px;border-radius:var(--r-sm);background:transparent;color:var(--ink-2);font-size:12.5px;white-space:nowrap}
.ai-conversation .ai-mode-picker>summary svg{color:var(--ink-3)}
.ai-conversation .ai-mode-picker>summary:hover,.ai-conversation .ai-mode-picker[open]>summary{background:var(--paper-2);color:var(--ink)}
.ai-conversation .ai-mode-picker>summary:focus-visible{outline:2px solid var(--focus);outline-offset:2px}
/* « Choisir le mode » : une liste, le choix marqué d'un point à l'encre */
.ai-conversation .ai-mode-panel{right:auto;left:0;width:auto;min-width:240px;padding:4px;border:1px solid var(--line);border-radius:var(--r-btn);background:var(--card);box-shadow:var(--shadow-pop,var(--shadow-frame))}
.ai-conversation .ai-mode-heading{margin:0;padding:6px 8px 4px;color:var(--ink-3);font-size:11.5px;font-weight:400}
.ai-conversation .ai-mode-steps{display:grid;grid-template-columns:1fr;gap:1px}
.ai-conversation .ai-mode-steps .fl-mode-step{flex-direction:row;align-items:center;gap:10px;height:34px;padding:0 8px;border-radius:6px;color:var(--ink);font-size:13.5px;text-align:left}
.ai-conversation .ai-mode-steps .fl-mode-step:hover,.ai-conversation .ai-mode-steps .fl-mode-step:has(input:checked){background:transparent;color:var(--ink)}
.ai-conversation .ai-mode-steps .fl-mode-step:hover{background:var(--paper-2)}
.ai-conversation .ai-mode-steps .fl-mode-step:has(input:focus-visible){outline:2px solid var(--focus);outline-offset:-2px}
.ai-conversation .ai-mode-steps .ai-mode-dot{flex:none;width:9px;height:9px;margin:0;border-radius:var(--r-round,50%);background:transparent;box-shadow:inset 0 0 0 1.5px var(--ink-3)}
.ai-conversation .ai-mode-steps .fl-mode-step:has(input:checked) .ai-mode-dot{width:9px;height:9px;margin:0;background:var(--ink);box-shadow:none}
.ai-conversation .ai-mode-settings{margin-top:4px;padding:6px 8px;border-top:1px solid var(--line);color:var(--ink-2);font-size:12.5px;text-align:left;text-decoration:underline;text-underline-offset:3px;text-decoration-color:var(--line-2)}
.ai-conversation .ai-mode-settings:hover{color:var(--ink)}
/* le choix de l'AGENT (AG-SELECTEUR, 2/11) : « Escouade », puis les agents qui répondent, chacun avec une ligne de ce qu'il fait */
.ai-conversation .ai-agent-current{display:block;max-width:150px;overflow:hidden;text-overflow:ellipsis}
.ai-conversation .ai-agent-panel{min-width:260px;max-width:min(340px,calc(100vw - 32px))}
.ai-conversation .ai-agent-options{display:flex;flex-direction:column;gap:1px;max-height:min(320px,50vh);overflow-y:auto}
.ai-conversation .ai-agent-option{display:flex;align-items:flex-start;gap:10px;padding:7px 8px;border-radius:6px;color:var(--ink);cursor:pointer}
.ai-conversation .ai-agent-option:hover{background:var(--paper-2)}
.ai-conversation .ai-agent-option:has(input:focus-visible){outline:2px solid var(--focus);outline-offset:-2px}
.ai-conversation .ai-agent-option .ai-mode-dot{flex:none;width:9px;height:9px;margin:5px 0 0;border-radius:var(--r-round,50%);background:transparent;box-shadow:inset 0 0 0 1.5px var(--ink-3)}
.ai-conversation .ai-agent-option:has(input:checked) .ai-mode-dot{background:var(--ink);box-shadow:none}
.ai-conversation .ai-agent-text{display:flex;flex-direction:column;gap:1px;min-width:0}
.ai-conversation .ai-agent-name{font-size:13.5px;line-height:1.35;overflow-wrap:anywhere}
.ai-conversation .ai-agent-desc{display:-webkit-box;overflow:hidden;color:var(--ink-3);font-size:12px;line-height:1.35;-webkit-box-orient:vertical;-webkit-line-clamp:2}
@media (max-width:560px){.ai-conversation .ai-agent-current{max-width:96px}}
/* le MODE D'ACTION (Q77, 28/10) : la même liste, à gauche du micro ; elle n'affiche que le nom court du mode coché, et le « i » entouré dit ce que fait ce mode, au survol comme au focus */
.ai-conversation .ai-action-mode{position:relative;display:inline-flex;align-items:center;flex:none}
.ai-conversation .ai-action-mode .ai-mode-panel{left:auto;right:0;min-width:180px}
.ai-conversation .ai-action-mode :is(.fl-mode-name,.ai-mode-tip>span){display:none}
.ai-conversation .ai-action-mode:has(input[data-chat-mode=normal]:checked) :is(.fl-mode-name,.ai-mode-tip>span)[data-chat-mode=normal],.ai-conversation .ai-action-mode:has(input[data-chat-mode=plan]:checked) :is(.fl-mode-name,.ai-mode-tip>span)[data-chat-mode=plan],.ai-conversation .ai-action-mode:has(input[data-chat-mode=auto]:checked) :is(.fl-mode-name,.ai-mode-tip>span)[data-chat-mode=auto]{display:inline}
.ai-conversation .ai-mode-info{position:relative;display:grid;place-items:center;width:22px;height:28px;flex:none;border-radius:var(--r-sm);color:var(--ink-3);cursor:help}
.ai-conversation .ai-mode-info:hover,.ai-conversation .ai-mode-info:focus-visible{color:var(--ink)}
.ai-conversation .ai-mode-info:focus-visible{outline:2px solid var(--focus);outline-offset:2px}
.ai-conversation .ai-mode-tip{position:absolute;z-index:49;right:0;bottom:calc(100% + 8px);width:max-content;max-width:min(260px,70vw);padding:6px 9px;border-radius:var(--r-sm);background:var(--ink);color:var(--paper);font:400 12px/1.4 var(--font);text-align:left;white-space:normal;opacity:0;pointer-events:none;transition:opacity var(--d-hover)}
.ai-conversation .ai-mode-info:is(:hover,:focus-visible) .ai-mode-tip{opacity:1}
/* l'état entre les deux groupes */
.ai-conversation .ai-status{color:var(--ink-3);font-size:11.5px}
.ai-conversation .ai-duration{color:var(--ink-3);font-size:11.5px}
.ai-conversation .ai-composer:is([data-ai-phase=thinking],[data-ai-phase=receiving],[data-ai-phase=saving]) .ai-status::before{content:"";flex:none;width:8px;height:8px;border-radius:var(--r-round,50%);background:var(--signal);animation:ai-b-pulse var(--d-pulse) var(--out) infinite}
/* la jauge : un anneau à l'encre, jamais vert */
.ai-conversation .ai-gauge-slot{display:inline-flex;align-items:center;margin-right:6px}
.ai-conversation .ai-gauge-slot[hidden]{display:none}
.ai-conversation .ai-gauge-slot [data-ai-context]{gap:6px;color:var(--ink-3);font-size:11.5px;font-variant-numeric:tabular-nums}
.ai-conversation .ai-gauge-slot circle:first-child{color:var(--line-2)}
.ai-conversation .ai-gauge-slot [data-ai-context-arc]{color:var(--ink-2)}
.ai-conversation .ai-gauge-slot [data-ai-context-arc].text-tag-red{color:var(--danger)}
/* Dicter : une icône carrée ; en cours, un rond signal qui respire */
.ai-conversation .ai-dictate{position:relative;width:30px;height:30px;border-radius:var(--r-sm);color:var(--ink-2)}
.ai-conversation .ai-dictate:hover{background:var(--paper-2);color:var(--ink)}
.ai-conversation .ai-dictate[aria-pressed="true"]{background:var(--paper-2);color:var(--ink)}
.ai-conversation .ai-dictate[aria-pressed="true"]::after{content:"";position:absolute;top:3px;right:3px;width:7px;height:7px;border-radius:var(--r-round,50%);background:var(--signal);animation:ai-b-pulse var(--d-pulse) var(--out) infinite}
.ai-conversation .ai-dictate:focus-visible{outline:2px solid var(--focus);outline-offset:2px}
/* Envoyer : le rond à l'encre et son point d'action */
.ai-conversation .ai-send{position:relative;width:32px;height:32px;margin-left:0;border-radius:var(--r-round,50%);background:var(--btn-bg);color:var(--btn-ink);transition:background var(--d-hover),color var(--d-hover)}
.ai-conversation .ai-send:hover{background:var(--btn-bg)}
.ai-conversation .ai-send::after{content:"";position:absolute;top:-1px;right:-1px;width:8px;height:8px;border-radius:var(--r-round,50%);background:var(--btn-dot);box-shadow:0 0 0 2px var(--card)}
.ai-conversation .ai-send:disabled{opacity:1;background:var(--paper-2);color:var(--ink-3)}
.ai-conversation .ai-send:disabled::after{display:none}
/* champ vide (VIDE-A) : Envoyer s'éteint, son point aussi — rien à envoyer, rien ne bouge */
.ai-conversation .ai-composer:has(.ai-input:placeholder-shown) .ai-send{background:var(--paper-2);color:var(--ink-3)}
.ai-conversation .ai-composer:has(.ai-input:placeholder-shown) .ai-send::after{display:none}
.ai-conversation .ai-send:focus-visible{outline:2px solid var(--focus);outline-offset:3px}
/* les fichiers joints : des carrés de matière (COMP-D) */
.ai-conversation .ai-files-selection{gap:6px;align-items:center}
/* sans fichier choisi, la rangée ne prend aucune place dans la grille */
.ai-conversation .ai-files-selection:not(:has(.ai-file-chip)){display:none}
.ai-conversation .ai-files-summary{display:flex;flex-wrap:wrap;gap:6px;min-width:0;padding:0}
.ai-conversation .ai-files-summary:not(:empty){padding:0}
.ai-conversation .ai-file-chip{display:inline-flex;align-items:center;gap:6px;max-width:100%;height:28px;padding:0 8px 0 4px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--paper);color:var(--ink);font-size:12.5px;text-decoration:none}
.ai-conversation a.ai-file-chip:hover{border-color:var(--ink)}
.ai-conversation .ai-file-name{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ai-conversation .ai-file-sq,.ai-history-backdrop .ai-file-sq{flex:none;width:20px;height:20px;border-radius:5px;background:var(--ink);color:var(--paper);display:grid;place-items:center}
.ai-conversation .ai-file-sq svg,.ai-history-backdrop .ai-file-sq svg{width:13px;height:13px}
/* posé par l'îlot, le carré est vide : une feuille au trait, dessinée en CSS */
.ai-conversation .ai-file-sq:empty::before{content:"";width:8px;height:10px;border:1.5px solid var(--paper);border-radius:1.5px}
.ai-conversation .ai-clear-files{margin:0;width:28px;height:28px;display:grid;place-items:center;border-radius:var(--r-sm);color:var(--ink-2)}
.ai-conversation .ai-clear-files:hover{background:var(--paper-2);color:var(--ink)}
.ai-conversation .ai-files-help{margin:0;color:var(--ink-3);font-size:11.5px}
/* la bannière de modification, l'erreur, l'aide */
.ai-conversation .ai-edit-banner{margin:0;padding:6px 8px;gap:10px;border-radius:var(--r-sm);background:var(--paper-2);color:var(--ink-2);font-size:12.5px}
.ai-conversation .ai-edit-banner button{margin-left:auto;color:var(--ink);font-weight:500;text-decoration:underline;text-underline-offset:3px}
.ai-conversation .ai-feedback{margin:0;border:1px solid var(--line);border-left:3px solid var(--danger);border-radius:var(--r-sm);background:var(--paper);color:var(--ink)}
.ai-conversation .ai-feedback .ai-control{border-color:var(--line-2);border-radius:var(--r-sm);color:var(--ink)}
.ai-conversation .ai-composer-help{margin-top:6px;color:var(--ink-3);font-size:11.5px}
.ai-conversation .ai-context-link{color:var(--ink-2)}
.ai-conversation .ai-context-link:hover{color:var(--ink)}
/* le focus au clavier : l'encre, partout */
.ai-page :is(.ai-control,.ai-clear-files,.ai-context-link,.ai-entity-chip):focus-visible{outline:2px solid var(--focus);outline-offset:3px}
/* au doigt : 16 px sur la saisie (sinon iOS zoome), des cibles plus grandes */
@media(pointer:coarse){
  .ai-conversation .ai-input{font-size:16px}
  .ai-conversation .ai-send{width:36px;height:36px}
  .ai-conversation :is(.ai-dictate,.ai-attach-trigger){width:34px;height:34px}
}
/* sur un écran étroit, les libellés d'agent et de mode se tassent */
@container aichat (max-width:560px){
  .ai-conversation .ai-model-picker select{max-width:120px}
  .ai-conversation .ai-gauge-slot{display:none}
}

/* ---- HIST-B : la palette ----------------------------------------------------- */
/* (:has pour l'emporter sur ai-chat.css à ordre égal) */
.ai-history-backdrop:has(.ai-history-dialog){place-items:start center;padding:48px 16px 16px}
.ai-history-backdrop .ai-history-scrim{background:var(--scrim,color-mix(in srgb,var(--night) 45%,transparent));backdrop-filter:none}
.ai-history-backdrop .ai-history-dialog{border:1px solid var(--line);border-radius:var(--r-frame);background:var(--card);color:var(--ink);box-shadow:var(--shadow-pop,var(--shadow-frame))}
/* décochée (défaut) : la palette, une colonne, l'aperçu masqué */
.ai-history-backdrop .ai-history-dialog.fl-hist:has(#fl-hist-wide:not(:checked)){width:min(640px,calc(100vw - 32px));height:auto;max-height:min(86dvh,760px)}
.ai-history-backdrop .ai-history-dialog.fl-hist:has(#fl-hist-wide:not(:checked)) .ai-history-list{width:100%;padding:6px 8px 8px}
.ai-history-backdrop .ai-history-dialog.fl-hist:has(#fl-hist-wide:not(:checked)) .ai-history-preview{display:none}
/* cochée : les deux volets, l'aperçu à droite */
.ai-history-backdrop .ai-history-dialog.fl-hist:has(#fl-hist-wide:checked){width:min(860px,calc(100vw - 32px));height:min(82dvh,720px)}
.ai-history-backdrop .ai-history-dialog.fl-hist:has(#fl-hist-wide:checked) .ai-history-list{width:300px;flex:none;padding:8px;border-right:1px solid var(--line)}
.ai-history-backdrop .ai-history-dialog.fl-hist:has(#fl-hist-wide:checked) .ai-history-preview{display:flex}
.ai-history-backdrop .ai-history-dialog.fl-hist:has(#fl-hist-wide:checked) .ai-history-row-actions{display:none}
.ai-history-backdrop .ai-history-content{min-height:0}
/* la tête : la recherche, les onglets, fermer */
.ai-history-backdrop .ai-history-top{min-height:0;gap:12px;padding:8px 10px 8px 14px;border-bottom:1px solid var(--line)}
.ai-history-backdrop .ai-history-search{gap:9px;color:var(--ink-3)}
.ai-history-backdrop .ai-history-search button{color:var(--ink-3)}
.ai-history-backdrop .ai-history-search button svg{width:18px;height:18px}
.ai-history-backdrop .ai-history-search input{color:var(--ink);font-size:15.5px}
.ai-history-backdrop .ai-history-search input::placeholder{color:var(--ink-3)}
.ai-history-backdrop .ai-history-tabs{gap:2px}
.ai-history-backdrop .fl-hist-tab{padding:4px 10px;border-radius:var(--r-sm);color:var(--ink-2);font-size:13px}
.ai-history-backdrop .fl-hist:has(#fl-hist-chats:checked) .fl-hist-tab[data-tab=chats],.ai-history-backdrop .fl-hist:has(#fl-hist-media:checked) .fl-hist-tab[data-tab=media]{background:var(--paper-2);color:var(--ink);font-weight:500}
.ai-history-backdrop .fl-hist:has(#fl-hist-chats:focus-visible) .fl-hist-tab[data-tab=chats],.ai-history-backdrop .fl-hist:has(#fl-hist-media:focus-visible) .fl-hist-tab[data-tab=media]{outline:2px solid var(--focus);outline-offset:1px}
.ai-history-backdrop .ai-history-close{width:28px;height:28px;margin-left:0;border-radius:var(--r-sm);color:var(--ink-2)}
.ai-history-backdrop .ai-history-close:hover{background:var(--paper-2);color:var(--ink)}
/* la liste */
.ai-history-backdrop .ai-history-list{gap:1px}
.ai-history-backdrop .ai-history-list-head{padding:4px 8px;justify-content:flex-end;font-size:12px}
.ai-history-backdrop .ai-history-list-head a{color:var(--ink-2);text-decoration:underline;text-underline-offset:3px}
.ai-history-backdrop .ai-history-list-head a:hover{color:var(--ink)}
.ai-history-backdrop .ai-history-new{height:34px;margin:0;padding:0 8px;gap:9px;border-radius:var(--r-sm);color:var(--ink);font-size:13.5px;font-weight:400}
.ai-history-backdrop .ai-history-new:hover{background:var(--paper-2)}
.ai-history-backdrop .ai-history-results{margin-top:0}
.ai-history-backdrop .ai-history-group-label{margin:0;padding:12px 8px 6px;color:var(--ink-3);font:600 10.5px/1 var(--font);letter-spacing:var(--ls-label,.06em);text-transform:uppercase}
.ai-history-backdrop .ai-history-row{position:relative;display:flex;align-items:center;gap:9px;min-height:34px;margin:0;padding:0 8px;border-radius:var(--r-sm);color:var(--ink);font-size:13.5px;text-decoration:none}
.ai-history-backdrop .ai-history-row:hover,.ai-history-backdrop .ai-history-row.selected{background:var(--paper-2)}
.ai-history-backdrop .ai-history-row-link{display:flex;flex:1;align-items:center;min-width:0;min-height:34px;color:inherit;text-decoration:none}
.ai-history-backdrop .ai-history-row-link:focus-visible{outline:2px solid var(--focus);outline-offset:1px;border-radius:var(--r-sm)}
.ai-history-backdrop .ai-history-row-copy{gap:0}
.ai-history-backdrop .ai-history-row-copy strong{font-size:13.5px;font-weight:500}
.ai-history-backdrop .ai-history-row-copy small{color:var(--ink-3);font-size:12px}
.ai-history-backdrop .ai-history-current{padding:1px 7px;border:1px solid var(--line-2);border-radius:var(--r-pill);color:var(--ink-2);font-size:11.5px}
.ai-history-backdrop .ai-history-when{flex:none;color:var(--ink-3);font-size:12px;font-variant-numeric:tabular-nums}
.ai-history-backdrop .ai-history-empty{padding:8px;color:var(--ink-3);font-size:13px}
/* les actions de la ligne choisie : Accéder, Modifier, Supprimer */
.ai-history-backdrop :is(.ai-history-row-actions,.ai-history-preview-actions){display:flex;flex:none;align-items:center;gap:4px}
.ai-history-backdrop .ai-history-preview-actions{justify-content:flex-end;min-height:0;padding:10px 16px;gap:8px;border-top:1px solid var(--line);font-size:13px;font-weight:500}
.ai-history-backdrop .ai-history-act{display:inline-flex;align-items:center;height:24px;padding:0 8px;border-radius:6px;background:var(--card);color:var(--ink);box-shadow:inset 0 0 0 1px var(--line-2);font:500 12.5px/1 var(--font);text-decoration:none;cursor:pointer;list-style:none;transition:box-shadow var(--d-hover),color var(--d-hover)}
.ai-history-backdrop .ai-history-act::-webkit-details-marker{display:none}
.ai-history-backdrop .ai-history-act:hover{color:var(--ink);box-shadow:inset 0 0 0 1px var(--ink)}
.ai-history-backdrop .ai-history-act.primary,.ai-history-backdrop .ai-history-act.primary:hover{background:var(--btn-bg);color:var(--btn-ink);box-shadow:none}
.ai-history-backdrop .ai-history-act.danger{color:var(--ink-2)}
.ai-history-backdrop .ai-history-act.danger:hover{color:var(--danger);box-shadow:inset 0 0 0 1px var(--danger)}
.ai-history-backdrop .ai-history-act:focus-visible{outline:2px solid var(--focus);outline-offset:2px}
.ai-history-backdrop .ai-history-preview-actions .ai-history-act{height:30px;padding:0 12px;border-radius:var(--r-sm);font-size:13px}
.ai-history-backdrop :is(.ai-history-row-actions,.ai-history-preview-actions) form{margin:0}
.ai-history-backdrop .ai-history-rename{position:relative}
.ai-history-backdrop .ai-history-rename form{position:absolute;z-index:5;top:calc(100% + 6px);right:0;display:flex;gap:6px;width:300px;padding:8px;border:1px solid var(--line);border-radius:var(--r-btn);background:var(--card);box-shadow:var(--shadow-pop,var(--shadow-frame))}
.ai-history-backdrop .ai-history-preview-actions .ai-history-rename form{top:auto;bottom:calc(100% + 6px)}
.ai-history-backdrop .ai-history-rename input{min-width:0;flex:1;height:30px;padding:0 8px;border:1px solid var(--line-2);border-radius:var(--r-sm);background:var(--card);color:var(--ink);font-size:13px}
.ai-history-backdrop .ai-history-rename input:focus-visible{outline:2px solid var(--focus);outline-offset:1px}
.ai-history-backdrop .ai-history-rename button{height:30px;padding:0 12px;border-radius:var(--r-sm);background:var(--btn-bg);color:var(--btn-ink);font:500 13px/1 var(--font);cursor:pointer}
/* l'aperçu, quand on le montre */
.ai-history-backdrop .ai-history-preview{border-left:0}
.ai-history-backdrop .ai-history-preview-messages{gap:14px;padding:24px 28px;color:var(--ink);font-size:13.5px;line-height:1.55}
.ai-history-backdrop .ai-history-preview-user{max-width:80%;padding:8px 12px;border-radius:14px;background:var(--paper-2)}
.ai-history-backdrop .ai-history-preview-empty{color:var(--ink-3);font-size:14px}
/* le pied : la bascule des aperçus */
.ai-history-backdrop .ai-history-footer{min-height:0;justify-content:flex-start;gap:8px;padding:4px 8px;border-top:1px solid var(--line);color:var(--ink-3);font-size:12px}
.ai-history-backdrop .fl-hist-wide-toggle{width:28px;height:28px;border-radius:var(--r-sm);color:var(--ink-2)}
.ai-history-backdrop .fl-hist-wide-toggle:hover{background:var(--paper-2);color:var(--ink)}
.ai-history-backdrop .ai-history-dialog:has(#fl-hist-wide:focus-visible) .fl-hist-wide-toggle{outline:2px solid var(--focus);outline-offset:2px}
@media(max-width:560px){
  .ai-history-backdrop:has(.ai-history-dialog){padding-top:16px}
  .ai-history-backdrop .ai-history-dialog.fl-hist:has(#fl-hist-wide:checked) .ai-history-preview{display:none}
  .ai-history-backdrop .ai-history-dialog.fl-hist:has(#fl-hist-wide:checked) .ai-history-list{width:100%;border-right:0}
  .ai-history-backdrop .ai-history-row-actions{flex-wrap:wrap;justify-content:flex-end}
}
@media(prefers-reduced-motion:no-preference){
  .ai-history-backdrop .ai-history-dialog{animation:ai-b-land var(--d-land) var(--out)}
}

/* ---- Mouvement réduit : rien ne bouge seul --------------------------------- */
@media(prefers-reduced-motion:reduce){
  .ai-conversation :is(.ai-thinking-orb,.ai-tool-activity,.ai-tool-activity::before,.ai-dictate::after,.ai-status::before,.ai-act-pend),
  .ai-history-backdrop .ai-history-dialog{animation:none!important;transition:none!important}
  .ai-conversation :is(.ai-composer,.ai-send,.ai-cited-chip,.ai-assistant-actions,.ai-attach-trigger,.ai-agent-decisions button){transition:none}
}

/* ---- Le « + » : ses sous-menus (Compétences, Connecteurs) --------------------
   Un <details> dans le menu : ouvert, il REMPLACE la liste (son résumé devient
   « ‹ Compétences », le retour). Rien ne ferme le menu quand on coche. */
.ai-conversation .ai-attach-item>.ai-attach-label{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis}
.ai-conversation .ai-attach-sub>summary{list-style:none}
.ai-conversation .ai-attach-sub>summary::-webkit-details-marker{display:none}
.ai-conversation .ai-attach-sub>summary:focus-visible{outline:2px solid var(--focus);outline-offset:-2px}
.ai-conversation .ai-attach-sub .ai-sub-back{display:none;color:var(--ink-3)}
.ai-conversation .ai-attach-sub .ai-sub-forward{display:inline-flex;color:var(--ink-3)}
.ai-conversation .ai-attach-sub[open]>summary{color:var(--ink-2);font-weight:500}
.ai-conversation .ai-attach-sub[open] .ai-sub-back{display:inline-flex}
.ai-conversation .ai-attach-sub[open] .ai-sub-forward{display:none}
.ai-conversation .ai-attach-panel:has(>.ai-attach-sub[open])>:not(.ai-attach-sub[open]){display:none}
.ai-conversation .ai-attach-count{flex:none;min-width:18px;height:18px;padding:0 5px;border-radius:9px;background:var(--ink);color:var(--paper);font:500 11px/18px var(--font);text-align:center;font-variant-numeric:tabular-nums}
.ai-conversation .ai-attach-count[hidden]{display:none}
.ai-conversation .ai-attach-subpanel{display:grid;gap:1px;padding-top:2px}
.ai-conversation .ai-attach-option{display:flex;align-items:flex-start;gap:9px;padding:7px 8px;border-radius:6px;color:var(--ink);cursor:pointer}
.ai-conversation .ai-attach-option:hover{background:var(--paper-2)}
.ai-conversation .ai-attach-option input{flex:none;margin-top:2px;accent-color:var(--ink)}
.ai-conversation .ai-attach-option:has(input:focus-visible){outline:2px solid var(--focus);outline-offset:-2px}
.ai-conversation .ai-attach-option-copy{display:grid;gap:2px;min-width:0}
.ai-conversation .ai-attach-option-copy strong{font:500 13px/1.3 var(--font)}
.ai-conversation .ai-attach-option-copy small{color:var(--ink-3);font-size:12px;line-height:1.35}
.ai-conversation .ai-attach-empty,.ai-conversation .ai-attach-note{margin:0;padding:6px 8px;color:var(--ink-3);font-size:12px;line-height:1.4;white-space:normal}
.ai-conversation .ai-attach-note[hidden]{display:none}
.ai-conversation .ai-attach-note[role=alert]:not([hidden]){color:var(--danger)}
.ai-conversation .ai-attach-panel{max-width:min(340px,calc(100vw - 32px))}
.ai-conversation .ai-attach-panel:has(>.ai-attach-sub[open]){width:min(340px,calc(100vw - 32px))}
/* un connecteur : son nom, son état, son interrupteur */
.ai-conversation .ai-connector{display:flex;align-items:center;gap:10px;padding:7px 8px;border-radius:6px}
.ai-conversation .ai-connector:hover{background:var(--paper-2)}
.ai-conversation .ai-connector-copy{display:grid;gap:2px;flex:1;min-width:0}
.ai-conversation .ai-connector-copy strong{overflow:hidden;font:500 13px/1.3 var(--font);text-overflow:ellipsis;white-space:nowrap}
.ai-conversation .ai-connector-copy small{color:var(--ink-3);font-size:12px}
.ai-conversation .ai-connector-kind{margin-left:4px;padding:0 5px;border:1px solid var(--line-2);border-radius:4px;color:var(--ink-3);font:500 10.5px/16px var(--font);vertical-align:1px}
.ai-conversation .ai-connector-configure{flex:none;color:var(--ink);font-size:12.5px;text-decoration:underline;text-underline-offset:3px;text-decoration-color:var(--line-2)}
.ai-conversation .ai-connector-switch{position:relative;flex:none;width:32px;height:18px;border-radius:9px;background:var(--line-2);cursor:pointer;transition:background var(--d-hover)}
.ai-conversation .ai-connector-switch .ai-switch-knob{position:absolute;top:2px;left:2px;width:14px;height:14px;border-radius:50%;background:var(--card);box-shadow:var(--shadow-1);transition:transform var(--d-hover)}
.ai-conversation .ai-connector-switch[aria-checked=true]{background:var(--ink)}
.ai-conversation .ai-connector-switch[aria-checked=true] .ai-switch-knob{transform:translateX(14px)}
.ai-conversation .ai-connector-switch[data-busy]{opacity:.6;cursor:progress}
.ai-conversation .ai-connector-switch:focus-visible{outline:2px solid var(--focus);outline-offset:2px}
/* les compétences choisies : des puces au-dessus du champ, qui se retirent */
.ai-conversation .ai-skill-chips{display:flex;flex-wrap:wrap;gap:6px}
.ai-conversation .ai-skill-chips:empty{display:none}
.ai-conversation .ai-skill-chip{display:inline-flex;align-items:center;gap:5px;height:26px;padding:0 6px 0 8px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--paper-2);color:var(--ink);font-size:12.5px;cursor:pointer}
.ai-conversation .ai-skill-chip svg{color:var(--ink-2)}
.ai-conversation .ai-skill-chip:hover{border-color:var(--ink)}
/* la croix d'un fichier choisi */
.ai-conversation .ai-file-remove{display:grid;place-items:center;width:18px;height:18px;margin-left:2px;border-radius:4px;color:var(--ink-3);font-size:15px;line-height:1;cursor:pointer}
.ai-conversation .ai-file-remove:hover{background:var(--paper-2);color:var(--ink)}
.ai-conversation .ai-file-remove:focus-visible{outline:2px solid var(--focus);outline-offset:1px}

/* ---- La Bibliothèque, dans le composeur ------------------------------------ */
.ai-conversation .ai-library-picker{display:grid;gap:8px;max-height:min(360px,50dvh);overflow:auto;margin:0;padding:10px;border:1px solid var(--line);border-radius:var(--r-btn);background:var(--paper)}
.ai-conversation .ai-library-picker[hidden]{display:none}
.ai-conversation .ai-library-header{display:flex;align-items:center;justify-content:space-between;gap:8px}
.ai-conversation .ai-library-header strong{display:inline-flex;align-items:center;gap:7px;font:500 13px/1 var(--font)}
.ai-conversation .ai-library-close{display:grid;place-items:center;width:26px;height:26px;border-radius:var(--r-sm);color:var(--ink-2)}
.ai-conversation .ai-library-close:hover{background:var(--paper-2);color:var(--ink)}
.ai-conversation .ai-library-search{display:flex;gap:6px}
.ai-conversation .ai-library-search input{flex:1;min-width:0;height:30px;padding:0 9px;border:1px solid var(--line-2);border-radius:var(--r-sm);background:var(--card);color:var(--ink);font:400 13px/1 var(--font)}
.ai-conversation .ai-library-search input:focus{outline:none;border-color:var(--ink)}
.ai-conversation .ai-library-search button{flex:none;height:30px;padding:0 10px;border-radius:var(--r-sm);background:var(--btn-bg);color:var(--btn-ink);font:500 12.5px/1 var(--font);cursor:pointer}
.ai-conversation .ai-library-results{display:grid;gap:2px;color:var(--ink-3);font-size:12.5px}
.ai-conversation .ai-library-empty{margin:0;padding:6px 2px}
.ai-conversation .ai-library-result{display:flex;align-items:center;gap:9px;width:100%;padding:7px 8px;border:1px solid transparent;border-radius:6px;background:transparent;color:var(--ink);font:inherit;text-align:left;cursor:pointer}
.ai-conversation .ai-library-result:hover{background:var(--paper-2)}
.ai-conversation .ai-library-result:focus-visible,.ai-conversation .ai-library-result:has(input:focus-visible){outline:2px solid var(--focus);outline-offset:-2px}
.ai-conversation .ai-library-result input{flex:none;accent-color:var(--ink)}
.ai-conversation .ai-library-result-icon{flex:none;display:grid;place-items:center;width:22px;height:22px;border-radius:5px;background:var(--ink);color:var(--paper)}
.ai-conversation .ai-library-result-icon:empty::before{content:"";width:8px;height:10px;border:1.5px solid var(--paper);border-radius:1.5px}
.ai-conversation .ai-library-result-icon svg{width:13px;height:13px}
.ai-conversation .ai-library-result-copy{display:grid;gap:2px;flex:1;min-width:0}
.ai-conversation .ai-library-result-copy strong{overflow:hidden;font:500 13px/1.3 var(--font);text-overflow:ellipsis;white-space:nowrap}
.ai-conversation .ai-library-result-copy small{overflow:hidden;color:var(--ink-3);font-size:12px;text-overflow:ellipsis;white-space:nowrap}
.ai-conversation .ai-library-result-state{display:none;flex:none;color:var(--ink-2);font-size:12px}
.ai-conversation .ai-library-result[aria-pressed=true]{border-color:var(--ink);background:var(--paper-2)}
.ai-conversation .ai-library-result[aria-pressed=true] .ai-library-result-state{display:inline}
.ai-conversation .ai-library-more{justify-self:start;color:var(--ink);font-size:12.5px;text-decoration:underline;text-underline-offset:3px}
.ai-conversation .ai-library-more[hidden]{display:none}
.ai-conversation .ai-library-help{margin:0;color:var(--ink-3);font-size:11.5px;line-height:1.4}
/* La page a changé entre deux tours (2026-10-21) : la conversation le dit, juste avant la question. */
.ai-conversation .ai-context-mark{align-self:center;display:flex;align-items:center;gap:8px;max-width:100%;margin:6px 0 0;color:var(--ink-3);font-size:11.5px;line-height:1.35;text-align:center;overflow-wrap:anywhere}
.ai-conversation .ai-context-mark::before,.ai-conversation .ai-context-mark::after{content:"";flex:1 1 16px;min-width:16px;height:1px;background:var(--line,currentColor);opacity:.35}
.ai-conversation .ai-droits{margin:6px auto 0;text-align:center;font-size:12px;color:var(--ink-3)}

/* assets/b/cc.css */
/* ==========================================================================
   Escouade · identité B — le Centre de contrôle (lot 3)
   Écran : /ingestion/control, la file des propositions et ses volets
   (web::ingestion_control, racine .cc).
   Variantes du kit (kit/CC.html), recommandations appliquées en attendant le
   vote du client : CC-C (file maître / détail), PROP-B (carte détaillée),
   DETAIL-B (volet latéral), FILTRE-CC-B (onglets comptés + menu), VIDE-CC-B
   (le carré posé et le bilan). Le rond d'attente devient carré à la
   validation.
   Règles : seulement les jetons d'escouade-b.css, aucune couleur en dur ;
   le vert signal ne marque QUE ce qui attend (le rond d'une proposition en
   attente) — jamais un texte, jamais « Valider » ; statuts et étapes sans
   couleur ; « Valider » et « Rejeter » ont le même poids : « Rejeter » est à
   l'encre au repos, et ne rougit qu'au survol, au focus et une fois son motif
   ouvert (où « Confirmer le rejet » est rouge d'emblée).
   ========================================================================== */

/* ---- La barre des filtres (FILTRE-CC-B) ----------------------------------- */
.cc-fbar{flex:none;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:0 16px;padding:6px 16px;border-bottom:1px solid var(--line);background:var(--card)}
.cc-tabs{display:flex;flex-wrap:wrap;align-items:center;gap:0 18px;min-width:0}
.cc-tab{display:inline-flex;align-items:center;gap:7px;height:34px;color:var(--ink-2);font-size:13.5px;font-weight:500;text-decoration:none;white-space:nowrap;box-shadow:inset 0 -2px 0 transparent;transition:color var(--d-hover),box-shadow var(--d-hover)}
.cc-tab:hover{color:var(--ink)}
.cc-tab[aria-current="page"]{color:var(--ink);box-shadow:inset 0 -2px 0 var(--ink)}
.cc-tab-n{font-size:12px;color:var(--ink-3);font-variant-numeric:tabular-nums}
.cc-tab[aria-current="page"] .cc-tab-n{color:var(--ink)}
.cc-tab:focus-visible{outline:2px solid var(--focus);outline-offset:2px;border-radius:var(--r-mark)}

/* le menu des équipes : un <details> natif */
.cc-dd{position:relative;padding:0}
.cc-ddb{display:inline-flex;align-items:center;gap:6px;height:28px;padding:0 9px;border-radius:var(--r-sm);background:var(--card);box-shadow:inset 0 0 0 1px var(--line-2);color:var(--ink-2);font-size:12.5px;font-weight:500;white-space:nowrap;cursor:pointer;list-style:none;transition:color var(--d-hover),box-shadow var(--d-hover)}
.cc-ddb::-webkit-details-marker{display:none}
.cc-ddb::marker{content:""}
.cc-ddb:hover{color:var(--ink);box-shadow:inset 0 0 0 1px var(--ink-3)}
.cc-ddb--set{color:var(--ink);box-shadow:inset 0 0 0 1px var(--ink)}
.cc-ddb:focus-visible{outline:2px solid var(--focus);outline-offset:1px}
.cc-ddb svg{flex:none;transition:transform var(--d-hover) var(--ease)}
.cc-dd[open]>.cc-ddb svg{transform:rotate(180deg)}
.cc-menu{position:absolute;top:calc(100% + 4px);right:0;z-index:30;min-width:220px;max-height:min(360px,60vh);overflow-y:auto;padding:4px;display:grid;gap:1px;background:var(--card);border:1px solid var(--line);border-radius:var(--r-btn);box-shadow:var(--shadow-pop)}
.cc-mi{display:flex;align-items:center;gap:8px;min-height:30px;padding:0 8px;border-radius:var(--r-icon);color:var(--ink);font-size:13px;text-decoration:none;white-space:nowrap}
.cc-mi:hover{background:var(--paper-2)}
.cc-mi[aria-current="true"]{font-weight:500}
.cc-mi[aria-current="true"]::after{content:"";margin-left:auto;width:7px;height:7px;flex:none;border-radius:var(--r-mark);background:var(--ink)}
.cc-mi:focus-visible{outline:2px solid var(--focus);outline-offset:-2px}

/* le bandeau ?notice= au-dessus du maître / détail */
.cc-notice{flex:none;padding:10px 16px 0}

/* ---- La grammaire rond / carré -------------------------------------------- */
/* Le rond attend (le signal, qui respire) ; le carré est posé : plein à
   l'encre quand la proposition est appliquée, au trait quand elle est
   annulée, barré quand elle est rejetée. */
.cc-dot{display:inline-block;flex:none;width:10px;height:10px;border-radius:50%;background:var(--signal);box-shadow:0 0 0 0 var(--signal-glow);transition:border-radius var(--d-morph) var(--ease),background-color var(--d-morph) var(--ease),box-shadow var(--d-morph) var(--ease)}
.cc-dot--live{animation:cc-ring var(--d-pulse) var(--out) infinite}
@keyframes cc-ring{0%{box-shadow:0 0 0 0 var(--signal-glow)}70%{box-shadow:0 0 0 8px transparent}100%{box-shadow:0 0 0 0 transparent}}
.cc-dot--done{border-radius:var(--r-mark);background:var(--ink);animation:none}
.cc-dot--off{border-radius:var(--r-mark);background:transparent;box-shadow:inset 0 0 0 1.5px var(--ink-3);animation:none}
.cc-dot--rej{position:relative;border-radius:var(--r-mark);background:transparent;box-shadow:inset 0 0 0 1.5px var(--ink-2);animation:none}
.cc-dot--rej::after{content:"";position:absolute;left:1px;right:1px;top:4px;height:1.5px;background:var(--ink-2);transform:rotate(-45deg)}

/* « à la validation » : l'appui sur Valider pose le carré, dans le volet ET
   dans la file, le temps que la page revienne. Le focus au clavier seul ne
   le pose pas (il n'est pas une décision) : seul l'appui, ou le focus laissé
   par un clic. */
.cc-md:has(.cc-decide button[value="approve"]:is(:active,:focus:not(:focus-visible))) :is(.cc-mdi[aria-current="true"],.cc-dp>.cc-bar) .cc-dot--live{border-radius:var(--r-mark);background:var(--ink);box-shadow:none;animation:none}

/* ---- Pastilles, étiquettes, âge (tout au neutre) --------------------------- */
.cc-chip{display:inline-flex;align-items:center;gap:5px;max-width:100%;height:20px;padding:0 6px;border:1px solid var(--line);border-radius:var(--r-icon);background:var(--card);color:var(--ink-2);font-size:11.5px;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cc-chip>i{flex:none;width:6px;height:6px;border-radius:var(--r-mark);background:var(--ink-3)}
.cc-chip--icon{padding:0 4px}
.cc-tlabel{color:var(--ink-3);font-size:10.5px;font-weight:600;letter-spacing:var(--ls-label);text-transform:uppercase;white-space:nowrap}
.cc-st{display:inline-flex;align-items:center;gap:6px;color:var(--ink-2);font-size:12px;font-weight:500;white-space:nowrap}
.cc-age{color:var(--ink-3);font-size:12px;white-space:nowrap}
.cc-num{font-variant-numeric:tabular-nums}
.cc-sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* ---- Le maître / détail (CC-C) --------------------------------------------- */
.cc-md{flex:1;min-height:0;display:flex}
/* `relative` : chaque volet qui défile est la référence de ses `.cc-sr` (en
   position absolue). Sans elle, ils sortaient du défilement et allongeaient le
   document — 9 828 px et une seconde barre sur À traiter › Propositions. */
.cc-md-list{position:relative;flex:none;width:var(--volet-cerveau-liste,380px);overflow-y:auto;border-right:1px solid var(--line);background:var(--card)}
.cc-md-pane{position:relative;flex:1;min-width:0;overflow-y:auto;padding:16px 20px 32px;background:var(--card)}

/* la tête d'un groupe : l'email (ou le document) dont le lot est issu */
.cc-mdh{position:sticky;top:0;z-index:1;display:flex;align-items:center;gap:8px;min-height:38px;padding:6px 10px 6px 12px;border-bottom:1px solid var(--line);background:var(--paper);color:var(--ink-3);font-size:12px}
.cc-md-group+.cc-md-group .cc-mdh{border-top:1px solid var(--line)}
.cc-mdh>svg{flex:none;color:var(--ink-3)}
.cc-mdh-t{flex:1;min-width:0;display:grid}
.cc-mdh-t b{overflow:hidden;color:var(--ink-2);font-weight:500;white-space:nowrap;text-overflow:ellipsis}
.cc-mdh-t small{overflow:hidden;font-size:11.5px;white-space:nowrap;text-overflow:ellipsis}
.cc-bulk{flex:none}

/* une proposition de la file : un lien, pas une décision */
.cc-mdi{display:grid;grid-template-columns:12px minmax(0,1fr);gap:4px 9px;padding:9px 12px;border-bottom:1px solid var(--line);color:var(--ink);text-decoration:none;transition:background-color var(--d-hover)}
.cc-mdi>.cc-dot{margin-top:5px}
.cc-mdi-s{display:-webkit-box;overflow:hidden;font-size:13px;line-height:1.4;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.cc-mdi-m{grid-column:2;display:flex;flex-wrap:wrap;align-items:center;gap:2px 8px;color:var(--ink-3);font-size:11.5px}
.cc-mdi:hover{background:color-mix(in srgb,var(--paper-2) 55%,transparent)}
.cc-mdi[aria-current="true"]{background:var(--paper-2);box-shadow:inset 2px 0 0 var(--ink)}
.cc-mdi:focus-visible{outline:2px solid var(--focus);outline-offset:-2px}

/* ---- Le volet de la proposition (DETAIL-B, PROP-B) ------------------------- */
.cc-dp{display:grid;gap:14px;max-width:760px;animation:cc-land var(--d-land) var(--out)}
@keyframes cc-land{from{opacity:0;transform:translateY(4px)}}
.cc-bar{display:flex;flex-wrap:wrap;align-items:center;gap:6px}
.cc-dp-title{margin:0;color:var(--ink);font-size:17.5px;font-weight:600;line-height:1.3;letter-spacing:-.015em}

/* les décisions : au même endroit d'une proposition à l'autre */
.cc-decide{display:flex;flex-wrap:wrap;align-items:flex-start;gap:6px}
/* « Rejeter » : à l'encre au repos ; le rouge seulement au survol, au focus
   et quand le motif est ouvert. */
.cc .cc-reject{color:var(--ink)}
.cc .cc-reject:is(:hover,:focus-visible){color:var(--danger);background:var(--danger-soft);box-shadow:inset 0 0 0 1px var(--danger)}
.cc-rejd[open]>summary.cc-reject{color:var(--danger);box-shadow:inset 0 0 0 1px var(--danger)}
.cc-rejp{display:grid;gap:6px;min-width:min(300px,100%);margin-top:6px}
/* « Confirmer le rejet », dans le motif déplié : rouge dès l'ouverture (kit btn-danger on) */
.cc .cc-rejp .cc-reject{color:var(--danger);background:var(--danger-soft);box-shadow:inset 0 0 0 1px var(--danger)}

/* ce qui sera fait */
.cc-sec{display:grid;gap:10px}
.cc-blk{display:grid;gap:4px}
.cc-dl{color:var(--ink-3);font-size:10.5px;font-weight:600;letter-spacing:var(--ls-label);text-transform:uppercase}
.cc-pairs{display:grid;gap:2px}
.cc-pairs>div{display:flex;flex-wrap:wrap;gap:2px 10px;font-size:13px;line-height:1.45}
.cc-pairs span{min-width:110px;color:var(--ink-3)}
.cc-pairs b{flex:1;min-width:0;color:var(--ink);font-weight:500;overflow-wrap:anywhere}
.cc-facts{display:grid;gap:5px}
.cc-fact{display:grid;gap:1px;padding:5px 9px;border-left:2px solid var(--ink-3);border-radius:var(--r-mark);background:var(--paper)}
.cc-fact-d{display:flex;flex-wrap:wrap;align-items:baseline;gap:8px;color:var(--ink-2);font-size:12px}
.cc-fact-d i{color:var(--ink-3)}
.cc-fact-t{color:var(--ink);font-size:13px;line-height:1.45}
.cc-fact-x{color:var(--ink-2);font-size:12px;line-height:1.45}
.cc-fact--inv{border-left-style:dashed}
.cc-fact--inv .cc-fact-t{text-decoration:line-through;text-decoration-color:var(--ink-3)}

/* pourquoi, confiance */
.cc-why{color:var(--ink-2);font-size:13px;line-height:1.5}
.cc-why--none{color:var(--ink-3);font-style:italic}
.cc-conf{display:flex;align-items:center;gap:8px;color:var(--ink-3);font-size:12px}
.cc-conf-track{width:96px;height:5px;overflow:hidden;border-radius:var(--r-mark);background:var(--line)}
.cc-conf-track>i{display:block;height:100%;background:var(--ink)}
.cc-conf b{color:var(--ink);font-weight:500;font-variant-numeric:tabular-nums}

/* la source déclenchante : une carte, jamais verte */
.cc-src{display:grid;gap:5px;padding:8px 10px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--paper)}
.cc-src-h{display:flex;align-items:center;gap:6px;min-width:0;color:var(--ink-3);font-size:12px}
.cc-src-h>svg{flex:none}
.cc-src-h b{overflow:hidden;color:var(--ink-2);font-weight:500;white-space:nowrap;text-overflow:ellipsis}
.cc-src-subj{color:var(--ink);font-size:13px;font-weight:500}
.cc-quote{margin:0;padding-left:10px;border-left:2px solid var(--line-2);color:var(--ink-2);font-size:12.5px;line-height:1.55}
.cc-lnk{display:inline-flex;align-items:center;gap:5px;color:var(--ink);font-size:12.5px;font-weight:500;text-decoration:underline;text-decoration-color:var(--line-2);text-underline-offset:3px;transition:text-decoration-color var(--d-hover)}
.cc-lnk:hover{text-decoration-color:var(--ink)}
.cc-lnk:focus-visible{outline:2px solid var(--focus);outline-offset:2px;border-radius:var(--r-mark)}

/* toujours appliquer, relier à */
.cc-aa{display:flex;flex-wrap:wrap;align-items:center;gap:8px;padding-top:10px;border-top:1px solid var(--line)}
.cc-hint{flex:1;min-width:220px;color:var(--ink-3);font-size:12px;line-height:1.45}
.cc-linker{display:grid;gap:6px;padding-top:10px;border-top:1px solid var(--line)}
.cc-linker-r{display:flex;flex-wrap:wrap;align-items:center;gap:5px;color:var(--ink-3);font-size:12px}
.cc-lo{display:inline-flex;align-items:center;gap:5px;height:24px;padding:0 8px;border:1px solid var(--line);border-radius:var(--r-icon);background:var(--card);color:var(--ink-2);font-size:12px;text-decoration:none;transition:background-color var(--d-hover),color var(--d-hover)}
.cc-lo:hover{background:var(--paper-2);color:var(--ink)}
.cc-lo[aria-current="true"]{border-color:var(--ink);color:var(--ink)}
.cc-lo:focus-visible{outline:2px solid var(--focus);outline-offset:1px}
.cc-pick{overflow:hidden;border:1px solid var(--line-2);border-radius:var(--r-sm);background:var(--card)}

/* ---- « Rien à traiter » (VIDE-CC-B) ---------------------------------------- */
.cc-empty{display:grid;justify-items:center;align-content:center;gap:10px;min-height:360px;padding:24px;text-align:center}
/* le rond qui attendait se pose en carré : la file est vide */
.cc-empty-sq{width:22px;height:22px;border-radius:var(--r-mark);background:var(--ink);animation:cc-settle var(--d-morph) var(--ease) both}
@keyframes cc-settle{from{border-radius:50%;background:var(--signal)}}
/* sans bilan (onglet vide, file jamais remplie) : rien ne s'est posé, une icône au trait (kit .empty .ic) */
.cc-empty-ic{display:grid;place-items:center;width:40px;height:40px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--card);color:var(--ink-2)}
/* les deux gestes de reprise (VIDE-CC-B) */
.cc-empty-acts{display:flex;flex-wrap:wrap;justify-content:center;gap:6px;margin-top:6px}
.cc-empty-h{color:var(--ink);font-size:15px;font-weight:600;letter-spacing:-.01em}
.cc-empty-t{max-width:46ch;color:var(--ink-2);font-size:13px}
.cc-stat3{display:grid;grid-template-columns:repeat(3,auto);justify-content:center;gap:4px 26px;margin-top:6px}
.cc-stat3>*{display:grid;padding:2px 4px;border-radius:var(--r-sm);color:var(--ink);text-align:left;text-decoration:none}
.cc-stat3 b{font-size:20px;font-weight:600;letter-spacing:-.03em}
.cc-stat3 small{color:var(--ink-3);font-size:12px}
.cc-stat3 a:hover small{color:var(--ink);text-decoration:underline;text-underline-offset:3px}
.cc-stat3 a:focus-visible{outline:2px solid var(--focus);outline-offset:2px}

/* ---- Une ligne de la relecture OCR (volet « Documents à relire ») ----------
   Deux hôtes : ce centre, et les options avancées de la bibliothèque, dont la
   colonne est plus étroite (l'arbre prend sa place). Quand le texte et les
   gestes ne tiennent plus côte à côte, les gestes passent DESSOUS au lieu
   d'écraser le texte : le texte garde 280 px, les gestes s'enroulent. */
.cc-doc{flex-wrap:wrap}
.cc-doc-text{flex:1 1 280px}
.cc-doc-acts{flex:0 1 auto;flex-wrap:wrap;max-width:100%}
.cc-doc-acts form{flex-wrap:wrap}

/* ==========================================================================
   Studio « Second cerveau » (2026-10-01) — la file par affaire (SC-02 B),
   la sélection et les lots (SC-04 B), le téléphone (SC-12 A).
   ========================================================================== */

/* ---- L'ordre et les équipes, à droite des onglets ------------------------- */
.cc-fbar-r{display:flex;flex-wrap:wrap;align-items:center;gap:6px}

/* ---- Une ligne de la file : la case, puis le lien ------------------------- */
.cc-mdr{display:flex;align-items:stretch;border-bottom:1px solid var(--line)}
.cc-mdr>.cc-mdi{flex:1;min-width:0;border-bottom:0}
.cc-cbl{flex:none;display:flex;align-items:flex-start;padding:11px 0 0 12px;cursor:pointer}
.cc-cb{width:14px;height:14px;margin:0;accent-color:var(--ink);cursor:pointer}
.cc-cb:focus-visible{outline:2px solid var(--focus);outline-offset:2px}
.cc-mdr:has(.cc-cb:checked)>.cc-mdi{background:var(--paper-2)}

/* ---- La tête d'une affaire, et la ligne de chaque mail dedans -------------- */
.cc-mdh-a{min-width:0;color:inherit;text-decoration:none}
.cc-mdh-a:hover b{color:var(--ink);text-decoration:underline;text-underline-offset:3px}
.cc-mdh-f{color:var(--ink-3);text-decoration:underline;text-decoration-color:var(--line-2);text-underline-offset:2px}
.cc-mdh-f:hover{color:var(--ink)}
.cc-bulk{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:4px}
.cc-mds{display:flex;align-items:center;gap:6px;min-width:0;padding:6px 12px 2px 14px;color:var(--ink-3);font-size:11.5px}
.cc-mds>svg{flex:none}
.cc-mds>span{overflow:hidden;color:var(--ink-2);white-space:nowrap;text-overflow:ellipsis}
.cc-mds small{flex:none;max-width:40%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}

/* ---- La barre de sélection : au pied de la file, visible dès qu'une case
   est cochée. Son nombre est un compteur CSS des cases cochées — il les
   SUIT dans le document, sinon il compterait zéro. ------------------------- */
.cc-md-list{counter-reset:ccsel}
.cc-cb:checked{counter-increment:ccsel}
.cc-selbar{position:sticky;bottom:0;z-index:2;display:none;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px;padding:8px 12px;border-top:1px solid var(--line);background:var(--card);box-shadow:var(--shadow-pop)}
.cc-md-list:has(.cc-cb:checked) .cc-selbar{display:flex}
.cc-selbar-n{color:var(--ink-2);font-size:12.5px;font-weight:500}
.cc-selbar-n::before{content:counter(ccsel) " ";color:var(--ink);font-variant-numeric:tabular-nums}
.cc-selbar-a{display:flex;flex-wrap:wrap;align-items:flex-start;gap:6px}

/* ---- La carte (SC-03 B) : l'effet d'abord, le pourquoi en une ligne -------- */
.cc-eff{padding:10px 12px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--paper)}
.cc-why1{display:-webkit-box;margin:0;overflow:hidden;color:var(--ink-2);font-size:13px;line-height:1.5;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.cc-why1-c{color:var(--ink-3);white-space:nowrap}
.cc-why1-c b{color:var(--ink);font-weight:500}
.cc-cite{display:inline-grid;place-items:center;min-width:16px;height:16px;padding:0 3px;border-radius:var(--r-mark);background:var(--cite-bg);color:var(--cite-ink);font-size:10.5px;font-weight:600;line-height:1;text-decoration:none;vertical-align:1px}
.cc-cite:hover,.cc-cite:focus-visible{background:var(--cite-bg-on);color:var(--cite-ink-on)}
.cc-diff{display:grid;grid-template-columns:minmax(90px,auto) minmax(0,1fr);gap:3px 12px;font-size:13px;line-height:1.45}
.cc-diff-k{color:var(--ink-3)}
.cc-diff-v{min-width:0;overflow-wrap:anywhere}
.cc-diff-v b{color:var(--ink);font-weight:500}
.cc-old{color:var(--ink-3);text-decoration:line-through;text-decoration-color:var(--ink-3)}

/* ---- Les doublons côte à côte (SC-07 B) : la preuve en tête --------------- */
.cc-proof{padding:7px 10px;border-left:2px solid var(--ink);background:var(--card);color:var(--ink-2);font-size:12.5px;line-height:1.5}
.cc-proof b{color:var(--ink);font-weight:600}
.cc-cmp{display:grid;grid-template-columns:minmax(80px,auto) repeat(var(--cc-cols,2),minmax(0,1fr));gap:1px;overflow-x:auto;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--line);font-size:12.5px}
.cc-cmp>span{min-width:0;padding:5px 8px;background:var(--card);overflow-wrap:anywhere}
.cc-cmp-h{display:grid;gap:1px;background:var(--paper)!important;font-weight:600}
.cc-cmp-h a{color:var(--ink);text-decoration:none}
.cc-cmp-h a:hover{text-decoration:underline;text-underline-offset:3px}
.cc-cmp-h small{color:var(--ink-3);font-weight:400}
.cc-cmp-h.is-keep{box-shadow:inset 0 2px 0 var(--ink)}
.cc-cmp-k{color:var(--ink-3)}
.cc-cmp-k.is-conflict{color:var(--ink);font-weight:500}
.cc-cmp-k.is-conflict::after{content:" ≠";color:var(--ink-3)}
.cc-cmp-v{color:var(--ink-2)}
.cc-cmp-v.is-win{color:var(--ink);font-weight:500;box-shadow:inset 2px 0 0 var(--ink)}
/* Le choix champ par champ : la valeur cochée est celle qui reste. */
.cc-cmp-c{display:flex;align-items:flex-start;gap:6px;cursor:pointer}
.cc-cmp-c input{flex:none;margin:2px 0 0;accent-color:var(--ink)}
.cc-cmp-c input:focus-visible{outline:2px solid var(--focus);outline-offset:2px}
.cc-cmp-v:has(.cc-cmp-c input:checked){color:var(--ink);font-weight:500;box-shadow:inset 2px 0 0 var(--ink)}
.cc-cmp-v:has(.cc-cmp-c input:not(:checked)){font-weight:400;box-shadow:none;color:var(--ink-2)}
.cc-merge-f{display:flex;flex-wrap:wrap;align-items:center;gap:8px}

/* ---- Ce qui se replie sous la carte : source, contexte, règle ------------- */
.cc-fold{border-top:1px solid var(--line);padding-top:8px}
.cc-fold>summary{display:flex;align-items:center;gap:6px;cursor:pointer;list-style:none}
.cc-fold>summary::-webkit-details-marker{display:none}
.cc-fold>summary::before{content:"";width:0;height:0;border-left:5px solid var(--ink-3);border-top:4px solid transparent;border-bottom:4px solid transparent;transition:transform var(--d-hover)}
.cc-fold[open]>summary::before{transform:rotate(90deg)}
.cc-fold>summary:focus-visible{outline:2px solid var(--focus);outline-offset:2px;border-radius:var(--r-mark)}
.cc-fold>:not(summary){margin-top:8px}
.cc-quote--body{white-space:pre-line}
/* La phrase dont l'IA s'est servie (SC-09 B) : un fond de matière et un
   trait d'encre — jamais le vert, qui ne marque que ce qui attend. */
.cc-hl{padding:0 2px;border-radius:var(--r-mark);background:var(--cite-bg);color:var(--ink);box-shadow:inset 0 -2px 0 var(--ink-3)}
.cc-quotes{display:grid;gap:4px}
.cc-quotes q{display:block;width:fit-content;font-size:12.5px;line-height:1.5}
.cc-src-pj{display:flex;flex-wrap:wrap;gap:4px}
.cc-src-l{display:flex;flex-wrap:wrap;gap:4px 14px}
.cc-ctx{display:grid;gap:12px}
.cc-ctx-h{color:var(--ink-2);font-size:12.5px;font-weight:500}
.cc-tl{display:grid;gap:3px;margin:0;padding:0;list-style:none}
.cc-tl>li{display:grid;grid-template-columns:76px 8px minmax(0,1fr);align-items:baseline;gap:8px;font-size:12.5px;line-height:1.45;color:var(--ink)}
.cc-tl-d{color:var(--ink-3)}
.cc-tl-p{width:7px;height:7px;border-radius:var(--r-mark);background:var(--ink-3)}
.cc-past{display:grid;gap:3px;margin:0;padding:0;list-style:none}
.cc-past>li{display:grid;grid-template-columns:12px minmax(0,1fr) auto;align-items:center;gap:8px;font-size:12.5px}
.cc-past a{overflow:hidden;color:var(--ink);text-decoration:none;white-space:nowrap;text-overflow:ellipsis}
.cc-past a:hover{text-decoration:underline;text-underline-offset:3px}

/* ---- « Toujours appliquer », quand c'est mérité (SC-06 B) ----------------- */
.cc-offer{display:grid;gap:6px;padding:10px 12px;border:1px solid var(--ink);border-radius:var(--r-sm);background:var(--card);font-size:13px;line-height:1.5}
.cc-offer p{margin:0;color:var(--ink-2)}
.cc-offer b{color:var(--ink);font-weight:500}
.cc-offer .cc-aa{padding-top:0;border-top:0}

/* ---- Le bandeau du jour (SC-10 B) : ce que l'IA a fait seule -------------- */
.cc-today{border-bottom:1px solid var(--line);background:var(--paper)}
.cc-today>summary{display:flex;align-items:center;gap:8px;min-height:38px;padding:6px 12px;color:var(--ink-2);font-size:12.5px;cursor:pointer;list-style:none}
.cc-today>summary::-webkit-details-marker{display:none}
.cc-today>summary b{flex:1;color:var(--ink);font-weight:500}
.cc-today>summary svg{flex:none;transition:transform var(--d-hover) var(--ease)}
.cc-today[open]>summary svg{transform:rotate(180deg)}
.cc-today>summary:focus-visible{outline:2px solid var(--focus);outline-offset:-2px}
.cc-today-l{display:grid;gap:2px;margin:0;padding:0 12px 10px 30px;list-style:none}
.cc-today-l>li{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:4px 10px;font-size:12px;color:var(--ink-2)}
.cc-today-x{flex:1;min-width:0}

/* ---- Après une décision : ce qui vient d'arriver, et « Annuler » ---------- */
.cc-toast{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;padding:8px 12px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--card);box-shadow:var(--shadow-1);font-size:13px}
.cc-toast-x{flex:1;min-width:0;color:var(--ink-2)}
.cc-toast-x b{color:var(--ink);font-weight:500}
.cc-toast-b{display:inline-flex;align-items:center;gap:6px;height:28px;padding:0 9px;border:0;border-radius:var(--r-sm);background:var(--paper-2);color:var(--ink);font:inherit;font-size:12.5px;font-weight:500;cursor:pointer}
.cc-toast-b:hover{background:var(--line)}
.cc-toast-b:focus-visible{outline:2px solid var(--focus);outline-offset:2px}
.cc-kbd{display:inline-grid;place-items:center;min-width:18px;height:18px;padding:0 4px;border:1px solid var(--line-2);border-radius:var(--r-mark);background:var(--card);color:var(--ink-2);font:600 10.5px/1 var(--f-mono,ui-monospace,monospace)}

/* ---- L'aide des touches (SC-05 B) ---------------------------------------- */
.cc-keys-m{min-width:260px;padding:10px 12px}
.cc-keys-m dl{display:grid;grid-template-columns:auto 1fr;align-items:center;gap:6px 10px;margin:6px 0 0}
.cc-keys-m dt{margin:0}
.cc-keys-m dd{margin:0;color:var(--ink-2);font-size:12.5px}

/* ---- La file vide (SC-11 B) : ce qui arrive ------------------------------- */
.cc-pulse{max-width:60ch;margin:0;color:var(--ink-3);font-size:12.5px}
.cc-recent{display:grid;gap:4px;min-width:min(420px,100%);margin-top:4px;padding:10px 12px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--paper);text-align:left}
.cc-recent-l{display:grid;grid-template-columns:12px auto minmax(0,1fr);align-items:center;gap:8px;color:var(--ink);font-size:12.5px;text-decoration:none}
.cc-recent-l>span:last-child{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.cc-recent-l .cc-num{color:var(--ink-3)}
.cc-recent-l:hover>span:last-child{text-decoration:underline;text-underline-offset:3px}

/* ---- La vue Faits (SC-08 B) : le choix de l'affaire, puis sa frise -------- */
.cc-facts-pick{display:flex;flex-wrap:wrap;align-items:flex-end;gap:8px}
.cc-facts-pick label{display:grid;gap:3px}
.cc-facts-h{display:grid;gap:4px;margin:0 0 16px}
.cc-facts-h a{color:var(--ink);text-decoration:none}
.cc-facts-h a:hover{text-decoration:underline;text-underline-offset:3px}
.cc-facts-tl{max-width:820px}
.fl-fact.is-replaced .fl-sq{background:transparent!important;box-shadow:inset 0 0 0 1.5px var(--ink-3)}
.fl-fact.is-replaced .fl-fact-t{color:var(--ink-3);text-decoration:line-through;text-decoration-color:var(--ink-3)}
.fl-fact-r{font-style:italic}
.fl-cite{display:inline-grid;place-items:center;height:16px;padding:0 4px;border-radius:var(--r-mark);background:var(--cite-bg);color:var(--cite-ink);font-size:10.5px;font-weight:600;line-height:1;text-decoration:none;vertical-align:1px}
.fl-cite:hover,.fl-cite:focus-visible{background:var(--cite-bg-on);color:var(--cite-ink-on)}

/* ---- Le retour à la file : seulement sur téléphone ------------------------ */
.cc-back{display:none;align-items:center;gap:6px;margin:0 0 12px;color:var(--ink-2);font-size:13px;font-weight:500;text-decoration:none}
.cc-back:hover{color:var(--ink)}

/* ---- Écran étroit (SC-12 A) : la file, PUIS la proposition en plein écran,
   ses décisions collées en bas, sous le pouce. Une seule moitié à la fois :
   l'adresse (`?item=`) dit laquelle. ------------------------------------------ */
@media (max-width:900px){
  .cc-md>.volet-poignee{display:none}
  .cc-md{flex-direction:column;overflow-y:auto}
  .cc-md-list{width:auto;overflow:visible;border-right:0}
  .cc-md-pane{flex:none;overflow:visible;padding:12px 16px 16px}
  .cc-md:not(.cc-md--item) .cc-md-pane{display:none}
  .cc-md--item .cc-md-list{display:none}
  .cc-md--item .cc-back{display:inline-flex}
  .cc-md--item .cc-decide{order:99;position:sticky;bottom:0;z-index:2;justify-content:space-between;margin:0 -16px;padding:10px 16px calc(10px + env(safe-area-inset-bottom,0px));border-top:1px solid var(--line);background:var(--card)}
  .cc-md--item .cc-decide .esc-btn{min-height:40px}
  .cc-mdh{position:static;flex-wrap:wrap}
  .cc-fbar{padding:6px 12px}
  .cc-tabs{gap:0 14px}
}

/* ---- Mouvement réduit : ni pulsation, ni métamorphose, ni arrivée ---------- */
@media (prefers-reduced-motion:reduce){
  .cc *,.cc *::before,.cc *::after{animation:none!important;transition:none!important}
}

/* assets/b/list.css */
/* ==========================================================================
   Escouade · identité B — les listes et les fiches (lot 4)
   Écrans : l'index d'un objet (/objects/{slug}) — en-tête, barre de vues,
   tableau, pied, état vide —, son kanban, et la fiche /objects/{slug}/{id}.
   Pour tous les objets : contacts, entreprises, opportunités, projets,
   chantiers, devis, lots de travaux, contrats de sous-traitance.
   Variantes votées (kit/LIST.html) :
     LIST-A    tableau dense, lignes de 32 px, en-têtes typés, pied réel ;
     STATUT-A  le carré qui se remplit, à l'encre, sans couleur par statut
               (dessiné par le serveur : record_table::status_mark) ;
     FILTRE-A  la barre du code, puces sous la barre, « Enregistrer la vue »
               à l'encre ;
     FICHE-A   deux colonnes, identité en ligne, champs 162 px / valeur.
   Règles : seulement les jetons d'escouade-b.css, aucune couleur en dur.
   Le vert signal n'apparaît nulle part ici : rien ne bouge dans une liste.
   Les classes `b-*` sont posées par crates/web (record_table.rs,
   record_board.rs, record_page.rs, view_bar.rs) ; les utilitaires Tailwind
   étant dans @layer utilities, ces règles hors couche les emportent.
   ========================================================================== */

/* ---- L'en-tête de page : depuis P9 (2026-10-02), l'en-tête UNIQUE de
   toutes les pages, dessiné par `.page-head` dans nav.css. ---------------- */

/* ---- FILTRE-A : la barre de vues ---------------------------------------- */
.b-vbar{border-bottom-color:var(--line);background:var(--card)}
.b-vbar-top{height:40px;padding:0 8px 0 10px;gap:2px}
.b-vpick{height:28px;padding:0 8px;border-radius:6px;color:var(--ink);font-size:13px;font-weight:500}
.b-vpick svg{color:var(--ink-2)}
.b-vpick:hover{background:var(--paper-2)}
.b-vpick .b-vpick-n{color:var(--ink-3);font-weight:400}
.b-vb{height:28px;padding:0 8px;border-radius:6px;color:var(--ink-2);font-size:13px;white-space:nowrap;transition:background var(--d-hover),color var(--d-hover)}
.b-vb:hover,details[open]>summary>.b-vb{background:var(--paper-2);color:var(--ink)}
.b-vsearch{height:28px;border-radius:6px;border-color:transparent;box-shadow:inset 0 0 0 1px var(--line-2);background:var(--card)}
.b-vsearch:focus-within{box-shadow:inset 0 0 0 1px var(--ink),var(--ring-ink)}
.b-vsearch input{color:var(--ink)}
.b-vsearch input::placeholder{color:var(--ink-3)}
.b-vsearch svg{color:var(--ink-3)}

/* La rangée des puces : sous la barre, son propre filet. */
.b-chips{padding:6px 10px 7px;border-top:1px solid var(--line);gap:6px}
.b-chip{display:inline-flex;align-items:center;min-height:24px;border:0;border-radius:6px;background:var(--paper-2);box-shadow:inset 0 0 0 1px var(--line);color:var(--ink);font-size:12.5px;white-space:nowrap}
.b-chip .b-chip-b{padding:0 6px 0 8px;border-radius:6px 0 0 6px;gap:6px}
.b-chip .b-chip-b:hover{background:var(--line)}
.b-chip .b-chip-k{color:var(--ink-2);font-weight:400}
.b-chip .b-chip-op{color:var(--ink-3)}
.b-chip .b-chip-v{color:var(--ink);font-weight:500}
.b-chip svg{color:var(--ink-2)}
.b-chip .b-chip-x{display:inline-grid;place-items:center;width:18px;height:18px;margin-right:3px;padding:0;border:0;border-radius:4px;color:var(--ink-3)}
.b-chip .b-chip-x:hover{background:var(--line);color:var(--ink)}
.b-chip-g{padding:0 4px 0 8px;gap:6px}
.b-lnk-s{display:inline-flex;align-items:center;gap:4px;padding:0 4px;font-size:12.5px;color:var(--ink-3)}
.b-lnk-s:hover{background:transparent;color:var(--ink)}

/* ---- Boutons propres à ces écrans (BTN-B du socle, redits ici) ---------- */
.b-btn-pri{border:0;border-radius:var(--r-sm);background:var(--btn-bg,var(--ink));color:var(--btn-ink,var(--paper));font-weight:500;transition:background var(--d-hover),box-shadow var(--d-hover)}
.b-btn-pri:hover{background:color-mix(in srgb,var(--ink) 86%,var(--paper))}
.b-btn-sec{border-color:transparent;border-radius:var(--r-sm);background:var(--card);color:var(--ink);box-shadow:inset 0 0 0 1px var(--line-2);transition:box-shadow var(--d-hover),background var(--d-hover)}
.b-btn-sec:hover{background:var(--card);box-shadow:inset 0 0 0 1px var(--ink)}
.b-btn-sec.b-btn-ic{color:var(--ink-2)}
.b-btn-sec.b-btn-danger{color:var(--danger)}
.b-btn-sec.b-btn-danger:hover{box-shadow:inset 0 0 0 1px var(--danger)}
.b-btn-gh{border-radius:var(--r-sm);color:var(--ink-2);background:transparent}
.b-btn-gh:hover{background:var(--paper-2);color:var(--ink)}
.b-btn-xs{height:24px;padding:0 8px;border-radius:6px;font-size:12.5px}

/* ---- LIST-A : le tableau dense ------------------------------------------ */
.b-grid{background:var(--card);color:var(--ink);font-size:13px;font-variant-numeric:tabular-nums}
.b-grid .b-grid-h{height:32px;border-bottom:1px solid var(--line);background:var(--card);color:var(--ink-3);font-size:12.5px;font-weight:500}
.b-grid .b-grid-th{background:var(--card);border-right-color:var(--line);padding:0 8px}
.b-grid .b-grid-th svg{color:var(--ink-3)}
.b-grid .b-grid-th [data-resize-grip]:hover{background:var(--line-2)}
.b-grid .b-grid-ck{border-right-color:var(--line)}
.b-grid .b-grid-tr{border-bottom-color:var(--line);background:var(--card)}
.b-grid .b-grid-tr:hover{background:var(--paper)}
.b-grid .b-grid-td{border-right-color:var(--line)}
.b-grid .b-grid-td:last-child{border-right:0}
.b-grid .b-cell{padding:0 8px;color:var(--ink);font-size:13px}
.b-grid .b-cell:hover{background:transparent}
/* HUB-DEFAUTS (D178) : une cellule à plusieurs valeurs montre la première puis « +N », sur une ligne */
.cell-multi{display:inline-flex;align-items:center;gap:4px;min-width:0;max-width:100%;overflow:hidden;white-space:nowrap;vertical-align:middle}
.cell-multi-first{display:inline-flex;min-width:0;overflow:hidden}
.cell-multi-first>*{max-width:100%}
.cell-more{flex:none;display:inline-flex;align-items:center;height:20px;padding:0 6px;border-radius:999px;border:1px solid var(--line);background:var(--paper-2);color:var(--ink-2);font-size:11.5px;font-weight:500;line-height:1;font-variant-numeric:tabular-nums;cursor:default}
.b-grid .b-grid-lbl a{padding:0 8px;color:var(--ink);font-weight:500}
/* Une cellule vide : le tiret en encre tertiaire (lisible, 4,9:1). */
.b-grid .b-cell .text-gray-8{color:var(--ink-3)}
/* La ligne sélectionnée : papier en retrait, un trait d'encre à gauche. La
   case cochée le dit aussi sans aller-retour (sélection de masse du F6c). */
.b-grid .b-grid-tr.b-sel,
.b-grid .b-grid-tr:has(.sel-box:checked){background:var(--paper-2)}
.b-grid .b-grid-tr.b-sel>.b-grid-ck,
.b-grid .b-grid-tr:has(.sel-box:checked)>.b-grid-ck{box-shadow:inset 2px 0 0 var(--ink)}
/* Case .cbx du kit (LIST.html, BIBLIO.html) : dessinée, pas la case du système — même rendu en sombre. */
.b-grid input[type="checkbox"],.b-kan .b-kc input[type="checkbox"]{-webkit-appearance:none;appearance:none;flex-shrink:0;width:14px;height:14px;margin:0;border:1px solid var(--line-2);border-radius:4px;background:var(--card);display:inline-grid;place-items:center;vertical-align:middle;cursor:pointer;transition:background-color var(--d-hover),border-color var(--d-hover)}
.b-grid input[type="checkbox"]:checked,.b-kan .b-kc input[type="checkbox"]:checked{background:var(--ink);border-color:var(--ink)}
.b-grid input[type="checkbox"]:checked::after,.b-kan .b-kc input[type="checkbox"]:checked::after{content:"";width:7px;height:4px;border-left:1.6px solid var(--paper);border-bottom:1.6px solid var(--paper);transform:rotate(-45deg) translate(1px,-1px)}
.b-grid input[type="checkbox"]:focus-visible,.b-kan .b-kc input[type="checkbox"]:focus-visible{outline:2px solid var(--focus);outline-offset:2px}
/* La case de la grille, au clavier : un cadre d'encre, jamais d'accent. */
.b-grid [data-grid-cell]:focus{outline:none;background:var(--paper-2);box-shadow:inset 0 0 0 1.5px var(--focus,var(--ink))}
.b-grid [data-grid-cell]:focus:not(:focus-visible){box-shadow:none}
.b-grid .b-peek{border-color:var(--line-2);border-radius:6px;background:var(--card);color:var(--ink-2)}
.b-grid .b-peek:hover{color:var(--ink)}
/* La largeur disponible : la DERNIÈRE colonne de chaque piste (en-tête,
   lignes, pied, pied de groupe) s'étire sur ce qui reste à droite — sa
   largeur choisie devient un minimum. Plus étroit que la somme des colonnes,
   c'est la grille (`overflow-auto`) qui défile, jamais la page. */
.b-grid .b-grid-h>:last-child,.b-grid .b-grid-tr>:last-child,.b-grid .b-grid-foot>:last-child,.b-grid .b-grid-gf>:last-child{flex-grow:1}
.b-grid{min-width:0;max-width:100%;overscroll-behavior-x:contain}
.b-grid .b-grid-more{height:32px;border-bottom-color:var(--line);color:var(--ink-3);font-size:12.5px}
.b-grid .b-grid-more:hover{background:var(--paper);color:var(--ink)}

/* Le tableau groupé : un en-tête par groupe, son compte en chiffres. */
.b-grid .b-grid-gh{height:34px;border-bottom-color:var(--line);background:var(--paper);color:var(--ink);font-weight:500}
.b-grid .b-grid-gh:hover{background:var(--paper-2)}
.b-grid .b-grid-gh svg{color:var(--ink-3)}
.b-grid .b-grid-gc{padding:0;background:transparent;color:var(--ink-3);font-size:12.5px;font-weight:400}
.b-grid .b-grid-gf{height:28px;border-bottom-color:var(--line);background:var(--card);color:var(--ink-3);font-size:12px}

/* Le pied : « Nombre » sous le libellé, « Calculer » effacé ailleurs. */
.b-grid .b-grid-foot{height:32px;border-top:1px solid var(--line-2);background:var(--paper);color:var(--ink-3);font-size:12.5px}
.b-grid .b-grid-fc{border-right-color:var(--line)}
.b-grid .b-grid-fc summary:hover{background:var(--paper-2)}
.b-grid .b-grid-gf>div{border-right-color:var(--line)}
.b-agg-op{color:var(--ink-3)}
.b-agg-val{margin-left:4px;color:var(--ink);font-weight:500;font-variant-numeric:tabular-nums}
.b-agg-none{color:var(--ink-3);opacity:.75}
.b-grid-count{border-top-color:var(--line);color:var(--ink-3);font-size:12.5px}

/* Les menus posés par ces écrans (pied, puces) : la carte flottante. */
.b-dd{border:1px solid var(--line);border-radius:10px;background:var(--card);box-shadow:var(--shadow-pop)}
.b-dd-s{color:var(--ink-3);font-size:11.5px;font-weight:500;letter-spacing:0;text-transform:none}

/* L'avatar neutre (record_table::neutral_avatar) : l'initiale à l'encre
   seconde sur le papier en retrait — le fond vient en style en ligne. */
.b-rav{display:inline-flex;flex:none}
.b-rav>span{border-radius:4px;box-shadow:inset 0 0 0 1px var(--line);color:var(--ink-2);font-weight:600}
.b-rav>img{border-radius:4px}

/* ---- L'état vide ---------------------------------------------------------- */
.b-empty{gap:8px;padding:64px 16px;color:var(--ink-3)}
.b-empty-ill{display:grid;grid-template-columns:repeat(2,12px);gap:4px;margin-bottom:6px}
.b-empty-ill i{display:block;width:12px;height:12px;border-radius:3px;background:var(--ink-faint);opacity:.55}
.b-empty-ill i.b-empty-o{background:transparent;opacity:1;box-shadow:inset 0 0 0 1.5px var(--ink-faint)}
.b-empty-t{color:var(--ink);font-size:14.5px;font-weight:600}
.b-empty .b-btn-sec{height:28px;margin-top:6px;padding:0 10px}

/* ---- STATUT-A : le carré qui se remplit ------------------------------------ */
.b-st{display:inline-flex;align-items:center;gap:7px;min-width:0;color:var(--ink);font-size:13px;white-space:nowrap}
.b-st-sq{width:11px;height:11px;flex:none;color:var(--ink)}
.b-st-sq.b-st-off{opacity:.5}
.b-st-hole{fill:var(--card)}
.b-st-l{overflow:hidden;text-overflow:ellipsis}
.b-grid .b-grid-tr.b-sel .b-st-hole,
.b-grid .b-grid-tr:has(.sel-box:checked) .b-st-hole{fill:var(--paper-2)}

/* ---- Le kanban (vue réelle, restylée aux jetons) --------------------------- */
.b-kan{background:var(--paper)}
.b-kan .b-kcol{width:212px;border:0;border-radius:0;background:transparent}
.b-kan .b-kh{height:30px;padding:0 4px;border-bottom:0;font-size:13px;font-weight:500;color:var(--ink)}
.b-kan .b-kh .b-kh-n{color:var(--ink-3);font-size:12.5px;font-weight:400}
.b-kan .b-kh summary{border-radius:6px;color:var(--ink-3)}
.b-kan .b-kh summary:hover{background:var(--paper-2);color:var(--ink)}
.b-kan .b-kc{border:1px solid var(--line);border-radius:10px;background:var(--card);box-shadow:none;padding:9px 10px;font-size:12.5px}
.b-kan .b-kc:hover{border-color:var(--line-2)}
.b-kan .b-kc:has(.sel-box:checked){box-shadow:inset 2px 0 0 var(--ink);border-color:var(--line-2)}
.b-kan .b-kc>div:first-child>a{color:var(--ink);font-weight:500;font-size:13px}
.b-kan .b-kagg{height:28px;border-top:0;justify-content:flex-start;padding:0 4px;color:var(--ink-3)}
/* OPP-05 (29/09) : le total d'une étape en tête de colonne, et l'échéance
   des sept prochains jours marquée sur la carte (un point signal : ce qui
   bouge — jamais de jaune, jamais de vert en texte). */
.b-kan .b-kh .b-kh-agg{color:var(--ink-2);font-size:12.5px;font-weight:500;white-space:nowrap}
.b-kan .b-soon{display:inline-flex;align-items:center;gap:5px;color:var(--ink);font-weight:500}
.b-kan .b-soon::before{content:"";width:6px;height:6px;border-radius:var(--r-round);background:var(--signal);flex:none}
/* Q28 lot C : avancement, alertes, etape suivante */
.b-kan .b-late{display:inline-flex;align-items:center;gap:5px;color:var(--danger);font-weight:500}
.b-kan .b-late::before{content:"";width:6px;height:6px;border-radius:var(--r-round);background:var(--danger);flex:none}
.b-kan .b-kc-late{border-color:var(--danger)}
.b-kan .b-kh-late{display:inline-flex;align-items:center;height:18px;padding:0 6px;border-radius:999px;background:var(--danger-soft);color:var(--danger);font-size:11px;font-weight:500;white-space:nowrap}
.b-kan .b-kc-pied{display:flex;align-items:center;gap:6px;margin-top:8px;min-width:0}
.b-kan .b-kc-avance{flex:1;min-width:24px;height:4px;border-radius:999px;background:var(--line);overflow:hidden}
.b-kan .b-kc-avance>span{display:block;height:100%;border-radius:999px;background:var(--signal)}
.b-kan .b-kc-alerte{display:inline-flex;align-items:center;gap:3px;color:var(--danger);font-size:11px;font-weight:500;white-space:nowrap}
.b-kan .b-kc-suivante{display:contents}
.b-kan .b-kc-suivante button{display:inline-flex;align-items:center;gap:3px;max-width:55%;height:22px;padding:0 6px;border:1px solid var(--line-2);border-radius:6px;background:var(--card);color:var(--ink-2);font:500 11px/1 var(--font);cursor:pointer}
.b-kan .b-kc-suivante button span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.b-kan .b-kc-suivante button:hover{background:var(--paper-2);color:var(--ink)}
.b-kan .b-kc-suivante button:focus-visible{outline:2px solid var(--focus);outline-offset:2px}

/* ---- FICHE-A : deux colonnes ------------------------------------------------ */
/* Q60 (22/10) : le fond --paper derrière les listes et les fiches d'objets,
   comme la Bibliothèque ; le tableau (.b-grid), les cartes (.b-kc, .b-widget),
   le volet de la fiche, ses onglets et la barre des vues gardent leur surface
   --card. Sur ce fond, un survol en --paper ne se verrait plus : il passe en
   --paper-2 (lisible sur le papier comme sur une carte). */
#app-main.bg-gray-1:has(.b-grid,.b-kan,.b-rec){background:var(--paper)}
#app-main:has(.b-grid,.b-kan,.b-rec) .hover\:bg-gray-2:hover{background-color:var(--paper-2)}
.b-rec,.b-rec.bg-gray-1{background:var(--paper);color:var(--ink)}
.b-rec .b-aside{border-color:var(--line);background:var(--card)}
@media (min-width:1024px){.b-rec .b-aside{width:404px}}
.b-rec .b-aside-top{padding:18px 18px 14px;border-bottom-color:var(--line)}
.b-rec .b-aside-body{padding:6px 18px 28px}
.b-rec .b-rank{color:var(--ink-3);font-size:12px}
/* L'identité en ligne : carré d'initiale 38 px à gauche, titre à droite. */
.b-rec .b-rid{flex-direction:row;align-items:center;gap:12px;text-align:left}
.b-rec .b-rid .b-rav>span{border-radius:9px;font-size:14px!important}
.b-rec .b-rid .b-rtitle{font-size:18px;font-weight:600;letter-spacing:-.02em;line-height:1.25;text-align:left;color:var(--ink)}
.b-rec .b-rid .b-rsub{margin-top:0;color:var(--ink-3);font-size:12px}
.b-rec .b-aside-actions{justify-content:flex-start;margin-top:14px;gap:6px}
.b-rec .b-aside-actions .b-btn-sec{height:28px;padding:0 10px;font-size:13px}

/* Les sections : un titre discret, des lignes libellé / valeur. */
.b-rec .b-sech-top,
.b-rec .b-sech{color:var(--ink-3);font-size:12px;font-weight:500;letter-spacing:0}
.b-rec .b-sech:hover{color:var(--ink)}
.b-rec .b-sech svg{color:var(--ink-3)}
.b-rec .b-sec{border-bottom-color:var(--line);padding:8px 0}
.b-rec .b-fr{grid-template-columns:162px minmax(0,1fr);gap:8px;min-height:30px;margin:0 -6px;padding:0 6px;border-radius:6px;font-size:13px}
.b-rec .b-fr:hover{background:var(--paper)}
.b-rec .b-fr .b-fl{min-height:30px;gap:7px;color:var(--ink-2);font-size:13px}
.b-rec .b-fr .b-fl svg{color:var(--ink-3)}
.b-rec .b-fr .b-fv{color:var(--ink);font-size:13px}
.b-rec .b-fr .b-fv>div,
.b-rec .b-fr .b-fv>[data-cell]{min-height:30px;padding-left:0;padding-right:0}
.b-rec .b-fr .b-fv [data-cell]:hover{background:transparent;text-decoration:underline;text-decoration-color:var(--line-2);text-underline-offset:3px}
.b-rec .b-fr .b-fv [data-cell]:focus-visible{outline:2px solid var(--focus,var(--ink));outline-offset:2px}
/* Un champ vide montre son propre libellé en encre tertiaire (lisible). */
.b-rec .b-fr .b-fv .text-gray-8{color:var(--ink-3)}
.b-rec .b-none,.b-rec .b-dash{color:var(--ink-3);font-size:13px}

/* Les relations : un titre de section, des puces fines. */
.b-rec .b-relsec{border-top-color:var(--line);padding-top:14px}
.b-rec .b-relsec h3.b-sech{font-size:12px}
.b-rec .b-rel{min-height:20px;padding:0 6px 0 3px;border:0;border-radius:5px;background:var(--card);box-shadow:inset 0 0 0 1px var(--line);color:var(--ink);font-size:12.5px}
.b-rec .b-rel .b-rav>span{border-radius:3px}
.b-rec .b-viewall{color:var(--ink-2);font-size:12px}
.b-rec .b-viewall:hover{color:var(--ink)}

/* Les onglets : 42 px, le trait d'encre sous l'actif. */
.b-rec .b-rtabs{padding:0 20px;border-bottom-color:var(--line);background:var(--card)}
.b-rec .b-rtabs .rel-tabbar{gap:18px;height:42px;align-items:stretch}
.b-rec .b-rtab{padding-bottom:0;border-bottom:0;box-shadow:inset 0 -2px 0 transparent;color:var(--ink-2);font-size:13px;font-weight:500;transition:color var(--d-hover),box-shadow var(--d-hover)}
.b-rec .b-rtab svg{color:var(--ink-3)}
.b-rec .b-rtab:hover{color:var(--ink)}
.b-rec .b-rtab.is-on{color:var(--ink);box-shadow:inset 0 -2px 0 var(--ink)}
.b-rec .b-rtab.is-on svg{color:var(--ink)}
.b-rec .b-rtab:focus-visible{outline:2px solid var(--focus,var(--ink));outline-offset:-2px;border-radius:4px}
.b-rec .rel-count{min-width:0;height:auto;padding:0;background:transparent;color:var(--ink-3);font-size:12px;font-weight:400}
.b-rec .b-pane{padding:18px 24px 28px}
.b-rec .b-widget{border-color:var(--line);border-radius:var(--r);background:var(--card)}
.b-rec .rel-button-primary{background:var(--btn-bg,var(--ink));color:var(--btn-ink,var(--paper))}
.b-rec .rel-button-primary:hover{background:color-mix(in srgb,var(--ink) 86%,var(--paper))}
.b-rec .rel-button{border-color:transparent;border-radius:var(--r-sm);box-shadow:inset 0 0 0 1px var(--line-2)}

/* ---- Mouvement ------------------------------------------------------------ */
@media (prefers-reduced-motion:reduce){
  .b-vb,.b-btn-pri,.b-btn-sec,.b-rec .b-rtab{transition:none}
}

/* FICHE-A (décision DA 5) : la proposition de l'IA sous le champ visé. Le
   rond signal dit qu'elle attend ; Valider à l'encre, Rejeter au rouge du
   texte seulement (le poids visuel des deux gestes reste le même). */
.b-fprop{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:6px 10px;margin:2px 0 6px 128px;padding:6px 8px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--card)}
.b-fprop-v{display:flex;align-items:center;gap:6px;min-width:0;font-size:12.5px}
.b-fprop-dot{width:7px;height:7px;flex:none;border-radius:var(--r-round);background:var(--signal)}
.b-fprop-k{color:var(--ink-3);flex:none}
.b-fprop-x{color:var(--ink);font-weight:500;overflow-wrap:anywhere}
.b-fprop-a{display:flex;gap:6px}
.b-fprop-btn{height:26px;padding:0 10px;border:0;border-radius:var(--r-sm);background:var(--card);color:var(--ink);font:500 12.5px/1 var(--font);box-shadow:inset 0 0 0 1px var(--line-2);cursor:pointer}
.b-fprop-btn:hover{box-shadow:inset 0 0 0 1px var(--ink)}
.b-fprop-rej{color:var(--danger)}
@media (max-width:640px){.b-fprop{margin-left:0}}

/* ---- FACT-A : le retard d'une facture ouverte ------------------------------
   Posé après l'échéance par la page (objects.rs, `Column.suffix`) : un carré
   à l'encre, pas de couleur — le rouge reste aux écrans comptables. */
.b-late{display:inline-flex;align-items:center;gap:4px;margin-left:6px;font-size:12px;font-weight:500;color:var(--ink-2);white-space:nowrap}
.b-late::before{content:"";width:6px;height:6px;border-radius:1px;background:var(--ink-3)}

/* ---- PIECE-A : le brouillon d'écriture proposé sur la fiche d'une facture -- */
.b-entry-help{font-size:12px;color:var(--ink-3)}
.b-entry .compta-table{width:100%;font-variant-numeric:tabular-nums}
.b-entry .compta-table .num{text-align:right}
.b-entry-total td{border-top:1px solid var(--line)}

/* ---- OPP-08 (29/09) : « pourquoi perdue ? », posée en tête de la fiche ------ */
.b-ask{display:flex;flex-direction:column;gap:8px;margin:16px 24px 0;padding:12px 14px;border:1px solid var(--line-2);border-radius:var(--r);background:var(--card)}
.b-ask-h{display:flex;align-items:center;gap:8px;font-size:14px;color:var(--ink)}
.b-ask-dot{width:7px;height:7px;flex:none;border-radius:var(--r-round);background:var(--signal)}
.b-ask-x{margin:0;font-size:13px;color:var(--ink-2)}
.b-ask-f{display:flex;flex-wrap:wrap;gap:10px 16px}
.b-ask-l{display:flex;flex-direction:column;gap:4px;min-width:min(100%,220px);font-size:12.5px;color:var(--ink-3)}
.b-ask-a{display:flex;align-items:center;gap:12px}
.b-ask-btn{display:inline-flex;align-items:center;gap:7px;height:32px;padding:0 12px;border:0;border-radius:var(--r-btn);background:var(--btn-bg);color:var(--btn-ink);font:var(--t-ui);cursor:pointer}
.b-ask-btn::before{content:"";width:6px;height:6px;border-radius:var(--r-round);background:var(--btn-dot)}
.b-ask-later{font-size:13px;color:var(--ink-2)}

/* ---- OPP-07 (29/09) : « À faire cette semaine » au-dessus des opportunités -- */
.b-agenda{margin:10px 12px 4px;padding:12px 14px;border:1px solid var(--line);border-radius:var(--r);background:var(--card)}
.b-agenda-h{margin:0 0 8px;font:var(--t-ui);color:var(--ink)}
.b-agenda-cols{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:10px 24px}
.b-agenda-col{display:flex;flex-direction:column;min-width:0}
.b-agenda-k{margin:0 0 4px;font:var(--t-label);letter-spacing:var(--ls-label);text-transform:uppercase;color:var(--ink-3)}
.b-agenda-row{display:flex;align-items:center;gap:8px;min-height:30px;border-top:1px solid var(--line);font-size:13px}
.b-agenda-dot{width:6px;height:6px;flex:none;border-radius:var(--r-round);background:var(--signal)}
.b-agenda-dot--o{background:transparent;box-shadow:inset 0 0 0 1.3px var(--ink-3)}
.b-agenda-name{flex:1;min-width:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;color:var(--ink);text-decoration:none}
.b-agenda-name:hover{text-decoration:underline}
.b-agenda-when{flex:none;color:var(--ink-2);font-variant-numeric:tabular-nums;white-space:nowrap}
.b-agenda-f{flex:none;margin:0}
.b-agenda-btn{height:24px;padding:0 8px;border:1px solid var(--line-2);border-radius:var(--r-sm);background:var(--card);color:var(--ink);font-size:12px;cursor:pointer}
.b-agenda-btn:hover{border-color:var(--ink)}
/* OPP-10 : « Mes remises » — le téléphone seulement. */
.b-agenda-mine{display:none}
.b-agenda-card{display:flex;flex-direction:column;gap:2px;padding:10px 0;border-top:1px solid var(--line);color:var(--ink);text-decoration:none}
.b-agenda-card-n{font-size:14px;font-weight:500}
.b-agenda-card-m{font-size:12.5px;color:var(--ink-2);font-variant-numeric:tabular-nums}
@media (max-width:640px){
  .b-agenda-mine{display:block;margin-bottom:12px}
  .b-agenda{margin:8px 0 4px;border-radius:0;border-left:0;border-right:0}
  .b-agenda-row{flex-wrap:wrap}
}

/* ---- LIST-PERF : les classes COMPOSÉES des lignes de la grille ------------
   PERF-LISTES (2026-10-09). Une cellule de la grille répétait ~330 octets de
   classes Tailwind : 1,4 Mo sur les 2,8 Mo de lignes d'une liste
   d'entreprises de 200 lignes. Chaque classe composée ci-dessous est la
   COPIE EXACTE des règles compilées d'`assets/app.css` pour les utilitaires
   que son commentaire nomme, dans l'ordre d'app.css et DANS la couche
   `utilities` : même couche, même spécificité, même ordre, donc la même
   cascade — les règles sans couche de ce fichier (`.b-grid .b-cell`…)
   l'emportent comme avant. Le CSS Tailwind est figé : ces règles ne se
   régénèrent pas, elles se recopient, et le test
   `les_classes_composees_copient_app_css` (pages/assets.rs) refuse toute
   dérive. */
@layer utilities {
  /* .b-gtr = flex border-b border-gray-4 */
  .b-gtr {
    display: flex;
  }
  .b-gtr {
    border-bottom-style: var(--tw-border-style);
    border-bottom-width: 1px;
  }
  .b-gtr {
    border-color: var(--color-gray-4);
  }
  /* .b-gck = flex shrink-0 items-center justify-center border-r border-gray-4 */
  .b-gck {
    display: flex;
  }
  .b-gck {
    flex-shrink: 0;
  }
  .b-gck {
    align-items: center;
  }
  .b-gck {
    justify-content: center;
  }
  .b-gck {
    border-right-style: var(--tw-border-style);
    border-right-width: 1px;
  }
  .b-gck {
    border-color: var(--color-gray-4);
  }
  /* .b-gtd = relative h-full shrink-0 border-r border-gray-4 last:border-r-0 */
  .b-gtd {
    position: relative;
  }
  .b-gtd {
    height: 100%;
  }
  .b-gtd {
    flex-shrink: 0;
  }
  .b-gtd {
    border-right-style: var(--tw-border-style);
    border-right-width: 1px;
  }
  .b-gtd {
    border-color: var(--color-gray-4);
  }
  .b-gtd {
    &:last-child {
      border-right-style: var(--tw-border-style);
      border-right-width: 0px;
    }
  }
  /* .b-gcl = flex h-full w-full items-center gap-1.5 truncate px-2 text-[0.8125rem] text-gray-11 outline-none focus:bg-accent-2 focus:ring-1 focus:ring-inset focus:ring-accent-8 */
  .b-gcl {
    display: flex;
  }
  .b-gcl {
    height: 100%;
  }
  .b-gcl {
    width: 100%;
  }
  .b-gcl {
    align-items: center;
  }
  .b-gcl {
    gap: calc(var(--spacing) * 1.5);
  }
  .b-gcl {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .b-gcl {
    padding-inline: calc(var(--spacing) * 2);
  }
  .b-gcl {
    font-size: 0.8125rem;
  }
  .b-gcl {
    color: var(--color-gray-11);
  }
  .b-gcl {
    --tw-outline-style: none;
    outline-style: none;
  }
  .b-gcl {
    &:focus {
      background-color: var(--color-accent-2);
    }
  }
  .b-gcl {
    &:focus {
      --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
      box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    }
  }
  .b-gcl {
    &:focus {
      --tw-ring-color: var(--color-accent-8);
    }
  }
  .b-gcl {
    &:focus {
      --tw-ring-inset: inset;
    }
  }
  /* .b-gce = flex h-full w-full cursor-pointer items-center gap-1.5 truncate px-2 text-[0.8125rem] text-gray-11 outline-none hover:bg-gray-3 focus:bg-accent-2 focus:ring-1 focus:ring-inset focus:ring-accent-8 */
  .b-gce {
    display: flex;
  }
  .b-gce {
    height: 100%;
  }
  .b-gce {
    width: 100%;
  }
  .b-gce {
    cursor: pointer;
  }
  .b-gce {
    align-items: center;
  }
  .b-gce {
    gap: calc(var(--spacing) * 1.5);
  }
  .b-gce {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .b-gce {
    padding-inline: calc(var(--spacing) * 2);
  }
  .b-gce {
    font-size: 0.8125rem;
  }
  .b-gce {
    color: var(--color-gray-11);
  }
  .b-gce {
    --tw-outline-style: none;
    outline-style: none;
  }
  .b-gce {
    &:hover {
      @media (hover: hover) {
        background-color: var(--color-gray-3);
      }
    }
  }
  .b-gce {
    &:focus {
      background-color: var(--color-accent-2);
    }
  }
  .b-gce {
    &:focus {
      --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
      box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    }
  }
  .b-gce {
    &:focus {
      --tw-ring-color: var(--color-accent-8);
    }
  }
  .b-gce {
    &:focus {
      --tw-ring-inset: inset;
    }
  }
  /* .b-gtl = relative flex h-full shrink-0 items-center border-r border-gray-4 */
  .b-gtl {
    position: relative;
  }
  .b-gtl {
    display: flex;
  }
  .b-gtl {
    height: 100%;
  }
  .b-gtl {
    flex-shrink: 0;
  }
  .b-gtl {
    align-items: center;
  }
  .b-gtl {
    border-right-style: var(--tw-border-style);
    border-right-width: 1px;
  }
  .b-gtl {
    border-color: var(--color-gray-4);
  }
  /* .b-gla = flex h-full w-full items-center gap-2 px-2 text-[0.8125rem] font-medium text-gray-12 hover:underline */
  .b-gla {
    display: flex;
  }
  .b-gla {
    height: 100%;
  }
  .b-gla {
    width: 100%;
  }
  .b-gla {
    align-items: center;
  }
  .b-gla {
    gap: calc(var(--spacing) * 2);
  }
  .b-gla {
    padding-inline: calc(var(--spacing) * 2);
  }
  .b-gla {
    font-size: 0.8125rem;
  }
  .b-gla {
    --tw-font-weight: var(--font-weight-medium);
    font-weight: var(--font-weight-medium);
  }
  .b-gla {
    color: var(--color-gray-12);
  }
  .b-gla {
    &:hover {
      @media (hover: hover) {
        text-decoration-line: underline;
      }
    }
  }
  /* .b-gpk = absolute right-1 top-1/2 hidden h-6 w-6 -translate-y-1/2 items-center justify-center rounded-sm border border-gray-5 bg-gray-1 text-gray-9 hover:text-gray-12 group-hover:flex */
  .b-gpk {
    position: absolute;
  }
  .b-gpk {
    top: calc(1 / 2 * 100%);
  }
  .b-gpk {
    right: var(--spacing);
  }
  .b-gpk {
    display: none;
  }
  .b-gpk {
    height: calc(var(--spacing) * 6);
  }
  .b-gpk {
    width: calc(var(--spacing) * 6);
  }
  .b-gpk {
    --tw-translate-y: calc(calc(1 / 2 * 100%) * -1);
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }
  .b-gpk {
    align-items: center;
  }
  .b-gpk {
    justify-content: center;
  }
  .b-gpk {
    border-radius: var(--radius-sm);
  }
  .b-gpk {
    border-style: var(--tw-border-style);
    border-width: 1px;
  }
  .b-gpk {
    border-color: var(--color-gray-5);
  }
  .b-gpk {
    background-color: var(--color-gray-1);
  }
  .b-gpk {
    color: var(--color-gray-11);
  }
  .b-gpk {
    &:is(:where(.group):hover *) {
      @media (hover: hover) {
        display: flex;
      }
    }
  }
  .b-gpk {
    &:hover {
      @media (hover: hover) {
        color: var(--color-gray-12);
      }
    }
  }
}

/* assets/b/biblio.css */
/* ==========================================================================
   Escouade · identité B · lot 5 — Bibliothèque et GED
   Écrans : /drive (ged_workbench.rs), la visionneuse (ged_preview.rs),
   la relecture OCR (ged_review.rs).
   Variantes votées (kit/BIBLIO.html) : BIBLIO-A (tableau dense, aperçu à
   droite), DEPOT-A (l'état du dépôt sur la liste), APERCU-A (onglets de la
   visionneuse), RECH-A (assistant à côté de la liste, citations numérotées),
   ETAT-DOC-A (une marque et un mot, sans couleur).

   Chargée APRÈS app.css : `ged-workbench.css` est compilé dans app.css, et
   ses règles (couleurs vertes de l'ancienne marque) sont réécrites ici avec
   la même spécificité, ou une de plus. Aucune couleur en dur : seulement les
   jetons de escouade-b.css (--paper, --paper-2, --card, --line, --line-2,
   --ink, --ink-2, --ink-3, --ink-faint, --signal, --signal-glow, --danger,
   --night, rayons, ombres, durées).
   Le vert signal ne sert qu'à ce qui bouge : le point du bouton qui lance
   un travail, la marque d'un travail en cours. Jamais en texte, jamais sur
   une source citée.
   ========================================================================== */

/* ---- Le cadre ---------------------------------------------------------- */
.ged-workbench{
  --ged-viewer-w:clamp(380px,40vw,640px);
  --ged-chat-w:400px;
  --ged-hover:color-mix(in srgb,var(--card) 55%,var(--paper-2));
  --ged-mark-bg:color-mix(in srgb,var(--ink) 9%,transparent);
  background:var(--paper);color:var(--ink);font-size:13px
}
.ged-workbench :is(a,button,input,select,textarea,summary,label):focus-visible{outline:2px solid var(--ink);outline-offset:2px}
.ged-workbench mark{background:var(--ged-mark-bg);color:inherit;border-radius:2px;box-shadow:inset 0 -1.5px 0 var(--ink);font-weight:inherit}

/* ---- En-tête : onglets soulignés, recherche, menus, import -------------- */
.ged-hero{margin:0 0 16px;border-bottom:1px solid var(--line);align-items:flex-end}
.ged-library-tabs{gap:16px}
.ged-library-tabs a{height:40px;display:inline-flex;align-items:center;padding:0;border-radius:0;background:transparent;color:var(--ink-2);font-size:13px;font-weight:500;box-shadow:inset 0 -2px 0 transparent;transition:color var(--d-hover),box-shadow var(--d-hover)}
.ged-library-tabs a:hover{background:transparent;color:var(--ink)}
.ged-library-tabs a.active{background:transparent;color:var(--ink);font-weight:500;box-shadow:inset 0 -2px 0 var(--ink)}
.ged-hero-actions{padding-bottom:6px;gap:4px}

.ged-header-search{width:240px;min-height:32px;height:32px;padding:0 10px;gap:8px;border:1px solid transparent;border-radius:var(--r-sm);background:var(--paper-2);color:var(--ink-3)}
.ged-header-search:focus-within{background:var(--card);border-color:var(--ink);box-shadow:var(--ring-ink)}
/* Le cadre porte le focus ; le champ à l'intérieur ne redessine pas le sien. */
.ged-workbench :is(.ged-header-search,.ged-query) :is(input,textarea):focus-visible,
:is(.ged-header-search,.ged-query) :is(input,textarea):focus-visible{outline:none}
.ged-header-search input{color:var(--ink);font-size:13px}
.ged-header-search input::placeholder{color:var(--ink-3)}
.ged-header-search a{color:var(--ink-3)}
.ged-header-search a:hover{color:var(--ink)}

.ged-toolbar-menu>summary,.ged-advanced-filters>summary{width:28px;height:28px;border-radius:var(--r-sm);color:var(--ink-2)}
.ged-toolbar-menu>summary:hover,.ged-toolbar-menu[open]>summary,
.ged-advanced-filters>summary:hover,.ged-advanced-filters[open]>summary{background:var(--paper-2);color:var(--ink)}

/* Les menus : une surface, un filet, une ombre discrète. */
.ged-display-panel,.ged-file-menu-panel,.ged-cols-menu,
.ged-advanced-filters>.ged-filters-bar,.ged-search-menu .ged-query{background:var(--card);border:1px solid var(--line);border-radius:var(--r-btn);box-shadow:var(--shadow-frame)}
.ged-display-panel{padding:4px;gap:1px;min-width:200px}
.ged-menu-caption{color:var(--ink-3);font-size:12px;padding:6px 8px 2px}
.ged-display-panel a{height:30px;display:flex;align-items:center;padding:0 8px;border-radius:6px;color:var(--ink);font-size:13px}
.ged-display-panel a:hover{background:var(--paper-2)}
.ged-display-panel a[aria-current=true]{background:var(--paper-2);font-weight:500}

/* Importer des fichiers : le bouton principal, à l'encre, et son point —
   le seul vert de l'en-tête, parce que ce bouton met un travail en route. */
.ged-upload-button{min-height:32px;height:32px;gap:7px;padding:0 12px;border-radius:var(--r-sm);background:var(--ink);color:var(--paper);font-size:13px;font-weight:500;transition:background var(--d-hover)}
.ged-upload-button::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--signal);flex:none}
.ged-upload-button:hover{opacity:1;background:color-mix(in srgb,var(--ink) 86%,var(--paper))}
.ged-upload-button:focus-within{outline:2px solid var(--ink);outline-offset:2px}

/* ---- DEPOT-A · ETAT-DOC-A : l'état du dépôt, une marque et un mot ------- */
.ged-upload-status{margin:0 0 12px;padding:0;background:transparent;color:var(--ink-2);font-size:12px;border-radius:0}
.ged-upload-status:not([hidden]){display:flex;align-items:center;gap:7px}

/* La marque d'état : un carré d'encre, « posé ». ETAT-DOC-A (une marque et
   un mot par document dans le tableau) n'est PAS émis : la page ne reçoit
   aucun statut d'indexation par document (ni `SearchHit`, ni `DocDto` n'en
   portent). Les marques « en cours », « à relire », « échec »… sont retirées
   tant que la donnée n'existe pas ; seule reste celle du dépôt terminé.
   Les lignes du dépôt en cours (DEPOT-A, plus bas) ont les leurs : là,
   l'état est connu, puisque c'est l'îlot qui envoie. */
.ged-mk{display:inline-block;width:10px;height:10px;flex:none;position:relative;vertical-align:-1px;border-radius:var(--r-mark)}
.ged-mk-done{background:var(--ink)}

/* DEPOT-A : on dépose sur la liste elle-même. La zone est la section des
   résultats ; le voile n'existe que pendant le survol d'un glisser de
   fichiers (`[data-ged-over]`, posé par l'îlot `depot_dom`) : papier, filet
   pointillé à l'encre, et il laisse passer le pointeur — il ne vole aucun
   clic à la liste. Sans wasm, il ne se montre jamais. */
.ged-results{position:relative}
.ged-drop-veil{display:none;position:absolute;inset:0;z-index:5;place-items:center;text-align:center;pointer-events:none;border:1.5px dashed var(--ink);border-radius:var(--r);background:color-mix(in srgb,var(--paper) 90%,transparent)}
.ged-results[data-ged-over] .ged-drop-veil{display:grid}
.ged-drop-veil>div{display:grid;justify-items:center;gap:6px;color:var(--ink)}
.ged-drop-veil b{font-size:15px;font-weight:600}
.ged-drop-veil span{font-size:12px;color:var(--ink-2)}

/* La file : une ligne par fichier, en tête de la liste. Nom à l'encre, une
   barre de progression — le seul vert, parce que c'est ce qui bouge — et un
   mot. Une fois importée, la ligne devient celle du document : son nom
   s'ouvre dans la visionneuse comme les autres. */
.ged-drop-queue{list-style:none;margin:0 0 10px;padding:0;border-top:1px solid var(--line)}
.ged-drop-queue[hidden]{display:none}
.ged-drop-row{display:grid;grid-template-columns:10px minmax(0,1fr) 120px auto;align-items:center;gap:10px;min-height:40px;padding:0 10px;border-bottom:1px solid var(--line);font-size:13px;color:var(--ink);animation:esc-land var(--d-land) var(--out)}
.ged-drop-name{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:500}
button.ged-drop-name{padding:0;border:0;background:none;color:var(--ink);font:inherit;font-weight:500;text-align:left;cursor:pointer}
button.ged-drop-name:hover{text-decoration:underline;text-underline-offset:3px}
.ged-drop-note{font-size:12px;color:var(--ink-3);white-space:nowrap}
.ged-drop-bar{width:100%;height:4px;border:0;border-radius:2px;background:var(--paper-2);overflow:hidden;appearance:none;-webkit-appearance:none}
.ged-drop-bar::-webkit-progress-bar{background:var(--paper-2);border-radius:2px}
.ged-drop-bar::-webkit-progress-value{background:var(--signal);border-radius:2px;transition:width var(--d-hover)}
.ged-drop-bar::-moz-progress-bar{background:var(--signal);border-radius:2px}
/* Fini ou refusé : la barre se tait, le mot reste. */
.ged-drop-row:is([data-state=done],[data-state=fail],[data-state=wait]) .ged-drop-bar{visibility:hidden}
.ged-drop-row[data-state=fail] .ged-drop-note{color:var(--ink)}
@media (max-width:640px){.ged-drop-row{grid-template-columns:10px minmax(0,1fr) auto}.ged-drop-bar{display:none}}

/* Les marques de la file : en attente (un rond vide), en cours (le rond
   signal qui respire), posé (le carré d'encre, plus haut), refusé (le carré
   barré). */
.ged-mk-wait{border-radius:50%;box-shadow:inset 0 0 0 1.5px var(--ink-3)}
.ged-mk-live{border-radius:50%;background:var(--signal);animation:esc-pulse var(--d-pulse) var(--out) infinite}
.ged-mk-fail{box-shadow:inset 0 0 0 1.5px var(--ink);background:linear-gradient(to top right,transparent calc(50% - .75px),var(--ink) calc(50% - .75px),var(--ink) calc(50% + .75px),transparent calc(50% + .75px))}

/* L'erreur se lit à la barre, pas au rouge. */
.ged-error{display:flex;align-items:center;gap:8px;padding:10px 12px;margin:0 0 12px;border:1px solid var(--line-2);border-radius:var(--r-btn);background:var(--card);color:var(--ink);font-size:13px}
.ged-error::before{content:"";width:10px;height:10px;flex:none;border-radius:var(--r-mark);box-shadow:inset 0 0 0 1.5px var(--ink);background:linear-gradient(to top right,transparent calc(50% - .75px),var(--ink) calc(50% - .75px),var(--ink) calc(50% + .75px),transparent calc(50% + .75px))}

/* ---- Filtres ------------------------------------------------------------ */
.ged-filters-bar{background:var(--card);border-color:var(--line);padding:12px;gap:10px}
.ged-filter-field label{color:var(--ink-3);font-size:12px;font-weight:500}
.ged-filter-field select,.ged-filters-bar select,.ged-filters-bar input{height:30px;padding:0 8px;background:var(--card);color:var(--ink);border:1px solid var(--line-2);border-radius:var(--r-sm);font-size:13px}
.ged-cols-summary{height:30px;border:0;border-radius:var(--r-sm);background:var(--card);color:var(--ink);box-shadow:inset 0 0 0 1px var(--line-2);font-size:13px;font-weight:500}
.ged-cols-summary svg{color:var(--ink-3)}
.ged-cols-menu{padding:4px}
.ged-cols-item{color:var(--ink);font-size:13px;border-radius:6px}
.ged-cols-item:hover{background:var(--paper-2)}
.ged-cols-mark{color:var(--ink)}

/* ---- Boutons ------------------------------------------------------------ */
.ged-button,.ged-filters-bar .ged-button{min-height:32px;padding:0 12px;gap:7px;border:0;border-radius:var(--r-sm);background:var(--card);color:var(--ink);box-shadow:inset 0 0 0 1px var(--line-2);font-size:13px;font-weight:500;transition:box-shadow var(--d-hover),background var(--d-hover)}
.ged-button:hover,.ged-filters-bar .ged-button:hover{background:var(--card);box-shadow:inset 0 0 0 1px var(--ink)}
.ged-primary,.ged-filters-bar .ged-primary{background:var(--ink);color:var(--paper);box-shadow:none}
.ged-primary:hover,.ged-filters-bar .ged-primary:hover{background:color-mix(in srgb,var(--ink) 86%,var(--paper));color:var(--paper);box-shadow:none}

/* ---- La liste ----------------------------------------------------------- */
.ged-section-heading{margin:0 0 10px;align-items:baseline;justify-content:flex-start;gap:10px}
.ged-section-heading h2{font-size:14px;font-weight:600;letter-spacing:-.01em;color:var(--ink)}
.ged-section-heading>span{font-size:12px;color:var(--ink-3)}

/* La liasse : n'apparaît qu'à la sélection (déjà le cas), comme une barre
   posée au-dessus de la liste. */
.ged-workbench:has(.ged-check input:checked) .ged-bundle{display:flex;align-items:center;gap:8px;margin:0 0 12px;padding:8px 10px;background:var(--card);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--shadow-frame)}
.ged-bundle p{width:auto;flex:1 1 auto;font-size:12px;color:var(--ink-3)}
.ged-bundle .ged-button{min-height:24px;height:24px;padding:0 8px;font-size:12px;border-radius:6px}
.ged-bundle-settings{font-size:12px}
.ged-bundle-settings summary{color:var(--ink-2)}
.ged-bundle-settings textarea,.ged-bundle-settings input{background:var(--card);border:1px solid var(--line-2);border-radius:var(--r-sm);color:var(--ink)}

.ged-check input{accent-color:var(--ink)}

/* BIBLIO-A : le tableau dense. Lignes de 40 px, en-tête de 32 px qui reste
   en haut, filets fins, le nom à l'encre, le reste en retrait. */
.ged-table-wrap{background:transparent;border:0;border-radius:0}
.ged-table{border-collapse:separate;border-spacing:0;font-size:13px;color:var(--ink)}
.ged-table thead th{position:sticky;top:0;z-index:1;height:32px;padding:0 10px;background:var(--paper);color:var(--ink-3);font-size:12px;font-weight:500;letter-spacing:0;border-bottom:1px solid var(--line)}
.ged-table tbody td{height:40px;padding:0 10px;color:var(--ink-2);border-bottom:1px solid var(--line)}
.ged-table tbody tr:last-child td{border-bottom:1px solid var(--line)}
.ged-table tbody tr:hover{background:transparent}
.ged-table tbody tr:hover td{background:var(--ged-hover)}
.ged-table tbody tr:has(.ged-check input:checked) td{background:var(--paper-2)}
.ged-table .ged-table-check{width:46px;padding-left:14px}
.ged-table th.ged-table-type,.ged-table td.ged-table-type{width:124px}
.ged-table th.ged-col-optional,.ged-table td.ged-col-optional{width:168px;max-width:none}
.ged-table th.ged-table-date,.ged-table td.ged-table-date{width:104px;text-align:left;color:var(--ink-3)}
.ged-table th.ged-table-date{color:var(--ink-3)}
.ged-table th.ged-table-actions,.ged-table td.ged-table-actions{width:48px;padding-right:12px}
.ged-table-title{gap:9px;color:var(--ink);font-weight:500}
.ged-table-title:hover{text-decoration:none}
.ged-table-title:hover span{text-decoration:underline;text-decoration-color:var(--line-2);text-underline-offset:3px}
.ged-table-title svg{color:var(--ink-3)}
.ged-table-title img{width:24px;height:24px;border-radius:var(--r-icon)}
.ged-table-muted{color:var(--ink-2)}
.ged-project-link{text-decoration:underline;text-decoration-color:var(--line-2);text-underline-offset:3px}
.ged-card-meta a:hover,.ged-project-link:hover{color:var(--ink);text-decoration-color:var(--ink)}

/* Les étiquettes de classe : sans couleur. */
.ged-tag{display:inline-flex;align-items:center;height:20px;padding:0 7px;border-radius:5px;background:var(--paper-2);color:var(--ink-2);font-size:12px;font-weight:500}
.ged-card-top .ged-tag{background:var(--card);color:var(--ink-2);box-shadow:0 0 0 1px var(--line)}

/* Le menu d'un document. */
.ged-file-menu>summary{width:28px;height:28px;border-radius:var(--r-sm);color:var(--ink-3)}
.ged-file-menu>summary:hover,.ged-file-menu[open]>summary{background:var(--paper-2);color:var(--ink)}
.ged-file-menu-panel{padding:4px;min-width:200px}
.ged-file-menu-panel>a,.ged-delete-confirm>summary,.ged-rename-confirm>summary{height:30px;padding:0 8px;border-radius:6px;color:var(--ink);font-size:13px}
.ged-file-menu-panel>a:hover,.ged-delete-confirm>summary:hover,.ged-rename-confirm>summary:hover{background:var(--paper-2)}
.ged-delete-confirm>summary{color:var(--danger)}
.ged-delete-confirm form,.ged-rename-confirm form{font-size:12px;color:var(--ink-2)}
.ged-delete-confirm button{padding:0 8px;height:24px;border-radius:6px;background:var(--card);color:var(--danger);box-shadow:inset 0 0 0 1px var(--line-2);font-size:12px;font-weight:500}
.ged-delete-confirm button:hover{box-shadow:inset 0 0 0 1px var(--danger)}
.ged-rename-confirm input{border:1px solid var(--line-2);border-radius:var(--r-sm);background:var(--card);color:var(--ink)}
.ged-rename-confirm button{padding:0 8px;height:24px;border-radius:6px;background:var(--ink);color:var(--paper);font-size:12px;font-weight:500}

/* La pagination. */
.ged-pagination{justify-content:space-between;gap:10px;padding:10px 0 4px;font-size:12px}
.ged-pagination-info{order:-1;color:var(--ink-3);font-size:12px}
.ged-pagination-disabled{color:var(--ink-faint);font-size:12px;padding:0 8px}
.ged-pagination .ged-button{min-height:24px;height:24px;padding:0 8px;font-size:12px;border-radius:6px;background:transparent;box-shadow:none;color:var(--ink-2)}
.ged-pagination .ged-button:hover{background:var(--paper-2);color:var(--ink);box-shadow:none}

/* Les autres affichages gardent leur forme, repeints aux jetons. */
.ged-thumbnail{border-color:var(--line);border-radius:var(--r);background:var(--paper-2);color:var(--ink-faint)}
.ged-thumbnail:hover{border-color:var(--line-2)}
.ged-card:has(input:checked){background:transparent;box-shadow:none}
.ged-card:has(input:checked) .ged-thumbnail{border-color:var(--ink);box-shadow:inset 0 0 0 1px var(--ink)}
.ged-card-top .ged-check{background:var(--card)}
.ged-card h3{font-size:13px;font-weight:500;color:var(--ink)}
.ged-card-meta{color:var(--ink-3);font-size:12px}
.ged-card .ged-excerpt{color:var(--ink-2);font-size:12px;line-height:1.5}
.ged-card footer{color:var(--ink-2)}
.ged-card footer>button{font-size:12px;font-weight:500}
.ged-card footer>button:hover{color:var(--ink);text-decoration:none}
.ged-list-row{border-bottom-color:var(--line);border-radius:0}
.ged-list-row:hover{background:var(--ged-hover)}
.ged-list-preview{background:var(--paper-2);color:var(--ink-3);border-radius:var(--r-sm)}
.ged-list-copy button{color:var(--ink);font-weight:500;font-size:13px}
.ged-list-copy span{color:var(--ink-3);font-size:12px}
.ged-project-card{border-color:var(--line);border-radius:var(--r-btn);background:var(--card);color:var(--ink);font-size:13px}
.ged-project-card:hover{background:var(--ged-hover);border-color:var(--line-2)}
.ged-project-card svg{color:var(--ink-3)}
.ged-empty{color:var(--ink-3)}
.ged-empty h3{color:var(--ink);font-weight:600}
.ged-muted{color:var(--ink-3)}

/* ---- RECH-A : l'assistant documentaire, à côté de la liste -------------- */
.ged-chat-panel{width:var(--ged-chat-w);background:var(--card);border-left:1px solid var(--line);box-shadow:none}
.ged-chat-panel-head{height:44px;padding:0 8px 0 14px;border-bottom:1px solid var(--line)}
.ged-chat-panel-title{gap:8px;font-size:13px;font-weight:600;color:var(--ink)}
.ged-chat-panel-title svg{color:var(--ink-3)}
.ged-ai-badge{background:transparent;padding:3px 5px;border-radius:4px;box-shadow:inset 0 0 0 1px var(--line-2);font-weight:600;letter-spacing:.04em;color:var(--ink-2)!important}
.ged-chat-close{width:28px;height:28px;border-radius:var(--r-sm);color:var(--ink-2)}
.ged-chat-close:hover{background:var(--paper-2);color:var(--ink)}
.ged-chat-panel .ged-chat{padding:14px;background:var(--card)}
.ged-chat-intro{margin-top:8px;color:var(--ink-3)}
.ged-chat-intro h3{color:var(--ink);font-size:14px;font-weight:600}
.ged-chat-intro p{color:var(--ink-2);font-size:13px;line-height:1.6}

/* La question, en bulle à droite ; la réponse, en texte plein. */
.ged-chat-question{width:fit-content;max-width:90%;margin:4px 0 12px auto;padding:8px 12px;border-radius:12px 12px 4px 12px;background:var(--paper-2);color:var(--ink);font-size:13px;line-height:1.5}
.ged-chat-answer{margin:0 0 8px;padding:0;background:transparent;border-radius:0;font-size:13px;line-height:1.62;color:var(--ink)}

/* L'appel de source : un carré numéroté, à l'encre, jamais vert. */
.ged-cite,.ged-num{display:inline-grid;place-items:center;height:17px;min-width:17px;padding:0 3px;border-radius:var(--r-cite);background:var(--paper-2);color:var(--ink-2);box-shadow:inset 0 0 0 1px var(--line);font-size:10.5px;font-weight:600;line-height:1;font-variant-numeric:tabular-nums}
.ged-cite{margin:0 1px;vertical-align:1px}
.ged-num{width:18px;height:18px;padding:0}
.ged-answer-meta{margin:0 0 12px;font-size:12px;color:var(--ink-3)}
.ged-sources-title{margin:0 0 8px;font-size:10.5px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-3)}
.ged-sources{display:grid;gap:8px;margin:0 0 14px}
.ged-source{display:grid;gap:6px;padding:9px 10px;border:1px solid var(--line);border-radius:var(--r-btn);background:var(--card)}
.ged-source-head{display:flex;align-items:center;gap:8px;min-width:0;font-size:13px;font-weight:500;color:var(--ink)}
.ged-source-head svg{flex:none;color:var(--ink-3)}
.ged-source-head span{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ged-source-head small{flex:none;font-size:12px;font-weight:400;color:var(--ink-3)}

/* Les passages sources, repliés — dans l'assistant ET sur une carte. */
.ged-source-passages{margin:0;font-size:12px;line-height:1.5;color:var(--ink-2)}
.ged-source-passages summary{color:var(--ink-2);text-decoration:underline;text-decoration-color:var(--line-2);text-underline-offset:3px}
.ged-source-passages summary:hover{color:var(--ink);text-decoration-color:var(--ink)}
.ged-source-passages p,.ged-source-passages p.ged-passage{display:grid;grid-template-columns:18px 1fr;gap:8px;align-items:start;margin:6px 0 0;padding:6px 8px;border:0;border-radius:var(--r-sm);background:transparent;color:var(--ink-2)}
.ged-source-passages p.ged-passage:hover{background:var(--paper-2);color:var(--ink)}
.ged-source-passages p.ged-passage>span:only-child{grid-column:1 / -1}

/* Le formulaire de l'assistant. */
.ged-chat-form label{color:var(--ink-3);font-size:12px;font-weight:500}
.ged-chat-form select,.ged-chat-form input,.ged-chat-form textarea{background:var(--card);color:var(--ink);border:1px solid var(--line-2);border-radius:var(--r-btn);font-size:13px}
.ged-chat-form :is(select,input,textarea):focus{outline:none;border-color:var(--ink);box-shadow:var(--ring-ink)}
.ged-analysis-settings{border:1px solid var(--line);border-radius:var(--r-sm)}
.ged-analysis-settings summary{color:var(--ink-2);font-size:12px;font-weight:500}
.ged-analysis-settings a{color:var(--ink-2)}
.ged-analysis-settings a:hover{color:var(--ink)}
.ged-chat-form>.ged-button.ged-primary::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--signal);flex:none}
.ged-chat-footnote{color:var(--ink-3);font-size:12px;border-top-color:var(--line)}
.ged-chat-transcript{color:var(--ink-2);font-size:12px}
.ged-chat-transcript p{background:var(--paper-2)}

/* À côté, pas par-dessus : sur un écran large la liste se resserre pour
   laisser sa place à l'assistant. */
@media (min-width:1100px){
  .ged-workbench:has(.ged-chat-panel){padding-right:var(--ged-chat-w)}
}

/* ---- BIBLIO-A · APERCU-A : la visionneuse, rangée à droite -------------- */
@media (min-width:900px){
  .ged-modal{top:0;right:0;bottom:0;left:auto;width:var(--ged-viewer-w);padding:0;display:flex;place-items:normal}
  .ged-modal-backdrop{display:none}
  .ged-modal-content{width:100%;height:100%;border-radius:0;background:var(--card);border-left:1px solid var(--line);box-shadow:var(--shadow-frame)}
  .ged-workbench:has(.ged-modal){padding-right:var(--ged-viewer-w)}
}
@media (max-width:899.98px){
  .ged-modal-backdrop{background:color-mix(in srgb,var(--night) 30%,transparent);backdrop-filter:none}
  .ged-modal-content{background:var(--card);border-radius:var(--r-frame);box-shadow:var(--shadow-frame)}
}
.ged-modal-content [data-ged-preview]{background:var(--card)}

/* Les onglets Page / Extraits : deux radios, aucune ligne de script. */
.ged-viewer-radio{position:absolute;width:1px;height:1px;margin:0;opacity:0;pointer-events:none}
.ged-viewer-tabs{display:flex;align-items:center;gap:14px;height:38px;padding:0 14px;flex:none;border-bottom:1px solid var(--line)}
.ged-viewer-tabs label{height:38px;display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:500;color:var(--ink-2);cursor:pointer;box-shadow:inset 0 -2px 0 transparent;transition:color var(--d-hover),box-shadow var(--d-hover)}
.ged-viewer-tabs label:hover{color:var(--ink)}
#ged-viewer-tab-page:checked~.ged-viewer-tabs label[for="ged-viewer-tab-page"],
#ged-viewer-tab-excerpts:checked~.ged-viewer-tabs label[for="ged-viewer-tab-excerpts"]{color:var(--ink);box-shadow:inset 0 -2px 0 var(--ink)}
#ged-viewer-tab-page:focus-visible~.ged-viewer-tabs label[for="ged-viewer-tab-page"],
#ged-viewer-tab-excerpts:focus-visible~.ged-viewer-tabs label[for="ged-viewer-tab-excerpts"]{outline:2px solid var(--ink);outline-offset:2px;border-radius:2px}
.ged-viewer-count{color:var(--ink-3);font-weight:400}
.ged-viewer-pane-excerpts{display:none}
#ged-viewer-tab-excerpts:checked~.ged-viewer-pane-page{display:none}
#ged-viewer-tab-excerpts:checked~.ged-viewer-pane-excerpts{display:block}
.ged-excerpt-card{background:var(--paper-2);border-color:var(--line);color:var(--ink-2)}
.ged-excerpt-card mark{background:var(--ged-mark-bg);color:inherit;border-radius:2px;box-shadow:inset 0 -1.5px 0 var(--ink)}

/* ---- La relecture OCR (écran réel « Vérifier le texte du document ») ---- */
.ged-review textarea{background:var(--card);color:var(--ink);border-color:var(--line-2);border-radius:var(--r-sm)}
.ged-review textarea:focus{outline:none;border-color:var(--ink);box-shadow:var(--ring-ink)}
.ged-review iframe{border-color:var(--line);border-radius:var(--r-sm);background:var(--paper-2)}
.ged-review input[type=checkbox]{accent-color:var(--ink)}
.ged-review-save{background:var(--ink);color:var(--paper);border-radius:var(--r-sm);font-size:13px;font-weight:500;transition:background var(--d-hover)}
.ged-review-save:hover{background:color-mix(in srgb,var(--ink) 86%,var(--paper))}
.ged-review-save:focus-visible{outline:2px solid var(--ink);outline-offset:2px}

/* ---- Restes verts de l'ancienne marque (lot de correction) -------------
   `ged-workbench.css` n'est pas servi : il est compilé dans app.css figé,
   où ces règles portent encore le vert forêt d'origine. On les recouvre ici,
   en jetons, avec la même spécificité (cette feuille vient après). */
/* la vignette porte le survol (.ged-thumbnail) ; la carte, rien */
.ged-card:hover{border-color:transparent;box-shadow:none}
.ged-file-icon{background:var(--paper-2);color:var(--ink-2)}
.ged-query:focus-within{outline:2px solid var(--focus);outline-offset:2px}
.ged-chat-answer td,.ged-chat-answer th{border:1px solid var(--line)}
.ged-chat-details{border:1px solid var(--line);background:var(--card)}
.ged-chat-details[open] .ged-chat{border-top:1px solid var(--line);background:var(--card)}
.ged-chat-summary{color:var(--ink)}
.ged-chat-summary svg{color:var(--ink-2)}
.ged-eyebrow{color:var(--ink-3)}
.ged-hero p{color:var(--ink-2)}
.ged-filters>label,.ged-chat-form label{color:var(--ink-3)}
.ged-filters select,.ged-chat-form select,.ged-chat-form input,.ged-chat-form textarea{background:var(--card);border:1px solid var(--line-2);color:var(--ink)}
.ged-filter-note{border-top:1px solid var(--line);color:var(--ink-3)}
.ged-filter-note h3{color:var(--ink)}
.ged-filter-note a{color:var(--ink)}
.ged-viewer-excerpts{border-color:var(--line)}

/* ---- Rien ne bouge seul quand on l'a demandé -------------------------- */
@media (prefers-reduced-motion:reduce){
  .ged-workbench *,.ged-workbench *::before,.ged-workbench *::after,
  .ged-review *{animation:none!important;transition:none!important}
}

/* assets/b/graphe.css */
/* ==========================================================================
   Lot 6 — Graphe. L'ancienne page centrée sur une fiche (/graph?rootId=…,
   rendue par web::graph::graph_page, en 3D seule) : restylée
   seulement, dans l'identité B. L'espace de travail (/graph) a sa propre
   feuille, /assets/graph-workspace.css, chargée par la page elle-même.
   Les tuiles des nœuds et les traits des liens (LIEN-B) sont dessinés par
   l'îlot WebGL, qui lit les mêmes jetons.
   Aucune couleur en dur : jetons d'escouade-b.css seulement.
   ========================================================================== */

.kg-legacy{background:var(--card);color:var(--ink)}
.kg-legacy-header{border-bottom-color:var(--line);min-height:48px}
.kg-legacy-header h1{font:600 15px/1.2 var(--font);letter-spacing:var(--ls-tight);color:var(--ink)}
.kg-legacy-stage{background-color:var(--card);background-image:radial-gradient(var(--line) 1px,transparent 1.3px);background-size:22px 22px}

/* Les puces de famille : l'icône au trait, jamais une pastille de couleur. */
.kg-legacy-chip{border-radius:var(--r-sm);border-color:var(--line);background:var(--card);color:var(--ink-2)}
.kg-legacy-chip[aria-pressed=true]{background:var(--paper-2);border-color:var(--line-2);color:var(--ink)}
.kg-legacy .kg-glyph{display:inline-flex;flex:none;color:var(--ink-2)}
.kg-legacy .kg-glyph svg{display:block;stroke-width:1.75}
.kg-legacy .kg-signal-dot{display:inline-block;flex:none;width:8px;height:8px;border-radius:var(--r-round);background:var(--signal)}

/* La légende flottante et la liste de repli. */
.kg-legacy-legend,.kg-legacy-list{background:var(--card);border-color:var(--line);border-radius:var(--r-sm);box-shadow:var(--shadow-1)}
.kg-legacy-legend a,.kg-legacy-list a{color:var(--ink-2)}
.kg-legacy-legend a:hover,.kg-legacy-list a:hover{background:var(--paper-2);color:var(--ink)}

/* Les états : l'analyse partielle sans ambre, l'erreur au seul rouge. */
.kg-legacy-badge{background:var(--paper-2);color:var(--ink);box-shadow:inset 0 0 0 1px var(--line-2);border-radius:var(--r-mark)}
.kg-legacy-empty{color:var(--ink-3);font:var(--t-body)}
.kg-legacy-error{color:var(--danger)}
.kg-legacy :focus-visible{outline:2px solid var(--focus);outline-offset:2px}

/* ==========================================================================
   GR-LIEN C (studio Graphe du 2026-10-01) — l'onglet « Liens » d'une affaire,
   d'une entreprise, d'un contact : une carte d'un niveau dessinée par le
   serveur (SVG), les familles comptées, et le chemin vers le graphe.
   La forme seule, aucune couleur par famille (GR-COUL A) ; le signal ne
   marque que ce qui attend.
   ========================================================================== */
.kg-links{display:flex;flex-direction:column;gap:14px;color:var(--ink)}
.kg-links-head{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}
.kg-links-head .kg-muted{margin:0;color:var(--ink-3);font:var(--t-small)}
.kg-links-wait{display:inline-flex;align-items:center;gap:5px;color:var(--ink-2)}
.kg-links-dot{display:inline-block;width:8px;height:8px;border-radius:var(--r-round);background:var(--signal)}
.kg-links-open{display:inline-flex;align-items:center;gap:6px;height:30px;padding:0 11px;border-radius:var(--r-sm);background:var(--ink);color:var(--card);font:500 12.5px/1 var(--font);text-decoration:none}
.kg-links-open:hover{opacity:.9}
.kg-links-open:focus-visible{outline:2px solid var(--focus);outline-offset:2px}
.kg-links-map{display:block;width:100%;max-width:520px;height:auto;border:1px solid var(--line);border-radius:var(--r);background-color:var(--card);background-image:radial-gradient(var(--line) 1px,transparent 1.3px);background-size:16px 16px}
.kg-links-edge{stroke:var(--line-2);stroke-width:1}
.kg-links-center{fill:var(--card);stroke:var(--ink);stroke-width:1.6}
.kg-links-family rect{fill:var(--card);stroke:var(--line-2);stroke-width:1.2}
.kg-links-count{font:600 8.5px var(--font);fill:var(--ink);font-variant-numeric:tabular-nums}
.kg-links-name{font:500 8px var(--font);fill:var(--ink-2)}
.kg-links-families{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,220px),1fr));gap:12px}
.kg-links-families h3{display:flex;align-items:center;gap:6px;margin:0 0 4px;font:var(--t-label);letter-spacing:var(--ls-label);text-transform:uppercase;color:var(--ink-3)}
.kg-links-families .kg-glyph{display:inline-flex;color:var(--ink-3)}
.kg-links-families .kg-n{margin-left:auto;font-variant-numeric:tabular-nums}
.kg-links-families ul{list-style:none;margin:0;padding:0}
.kg-links-families li a{display:block;padding:4px 0;border-bottom:1px solid var(--line);font:var(--t-small);color:var(--ink);text-decoration:none;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.kg-links-families li a:hover{text-decoration:underline}
.kg-links-families .kg-muted{margin:4px 0 0;font:var(--t-caption);color:var(--ink-3)}

/* ==========================================================================
   GR-TEMPS (studio Graphe du 2026-10-01) — la période libre. La frise
   partagée avec la fiche affaire (AFF-09) se tire : les points traversés
   s'encadrent, ceux de la période choisie restent marqués. Le même choix,
   sans îlot, vit dans la puce « Période » : deux dates et un bouton.
   ========================================================================== */
.kg-timeline-head{display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin:0 0 6px}
.kg-timeline-head .kg-timeline-title{margin:0}
.kg-timeline-period{font:500 12px/1.2 var(--font);color:var(--ink);font-variant-numeric:tabular-nums}
.kg-timeline-head .kg-button{height:24px;padding:0 8px;font:500 11.5px/1 var(--font)}
.kg-timeline-drag{display:none;font:var(--t-caption);color:var(--ink-3)}
.kg-workspace[data-graph-mounted] .kg-timeline-drag{display:inline}
.kg-timeline .aff-frise{user-select:none;-webkit-user-select:none}
.kg-workspace[data-graph-mounted] .kg-timeline .aff-ms[data-day]{cursor:ew-resize}
.kg-timeline .aff-ms.is-picked,.kg-timeline .aff-ms[data-span]{background:var(--paper-2);border-radius:var(--r-sm)}
.kg-timeline .aff-ms.is-picked .aff-ms-t{color:var(--ink);font-weight:500}
.kg-timeline .aff-frise[data-dragging] .aff-ms:not([data-span]){opacity:.55}
.kg-period-form{display:flex;flex-direction:column;gap:8px;margin:8px 0 0;padding:8px 0 0;border-top:1px solid var(--line)}
.kg-period-title{margin:0;font:var(--t-label);letter-spacing:var(--ls-label);text-transform:uppercase;color:var(--ink-3)}
.kg-period-fields{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.kg-period-fields label{display:flex;flex-direction:column;gap:3px;min-width:0;font:500 11.5px/1.2 var(--font);color:var(--ink-2)}
.kg-period-fields input{min-width:0;height:30px;padding:0 6px;border:1px solid var(--line-2);border-radius:var(--r-sm);background:var(--card);color:var(--ink);font:var(--t-small);font-variant-numeric:tabular-nums}
.kg-period-fields input:focus-visible{outline:2px solid var(--focus);outline-offset:1px}
.kg-period-error{margin:0;font:var(--t-caption);color:var(--danger)}
.kg-period-error[hidden]{display:none}
.kg-period-actions{display:flex;justify-content:flex-end}

/* assets/b/compta.css */
/* ==========================================================================
   Escouade · identité B — la Comptabilité (lot 7)
   Écrans : /comptabilite (vue d'ensemble), encours et balance âgée, marges
   par affaire, rapprochement, correspondance des champs ; plus la liste et la
   fiche des factures, par leur portée [data-edit-scope="invoice"].
   Variantes du kit (kit/COMPTA.html) : COMPTA-A, FACT-A, PIECE-A, RAPPRO-A
   (restyle de l'existant), CHANTIER-F-A pour ce qui existe.
   Règles : seulement les jetons d'escouade-b.css, aucune couleur en dur ;
   chiffres en chasse tabulaire ; statuts sans couleur (un carré qui se
   remplit) ; le seul rouge est un retard de plus de 60 jours, ou une marge
   négative ; le vert signal n'apparaît pas (ces écrans n'écrivent rien).
   Chargée APRÈS app.css : elle reprend les règles .compta-* de celle-ci, en
   les préfixant de .compta-page pour l'emporter quel que soit l'ordre.
   ========================================================================== */

/* ---- La page ------------------------------------------------------------- */
.compta-page{background:var(--paper);color:var(--ink);font-family:var(--font)}
.compta-page .compta-content{width:min(1180px,100%);padding:18px 20px 72px;display:grid;gap:16px;align-content:start;font-size:13px;font-variant-numeric:tabular-nums}
.compta-page .compta-content>*{min-width:0;margin-top:0;margin-bottom:0}

/* le lien « Correspondance » de l'en-tête : un bouton fantôme */
.compta-page .compta-header-link{height:28px;gap:7px;padding:0 10px;border:0;border-radius:var(--r-sm);color:var(--ink-2);font-size:13px;font-weight:500;transition:background var(--d-hover),color var(--d-hover)}
.compta-page .compta-header-link:hover{background:var(--paper-2);color:var(--ink)}

/* les liens : chaque chiffre en est un, souligné d'un filet discret */
.compta-page .compta-link{color:inherit;border-bottom:0;text-decoration:underline;text-decoration-color:var(--line-2);text-decoration-thickness:1px;text-underline-offset:3px;transition:text-decoration-color var(--d-hover)}
.compta-page .compta-link:hover{color:var(--ink);text-decoration-color:var(--ink)}

/* le focus clavier : l'encre, 2 px, décalé */
.compta-page a:focus-visible,
.compta-page summary:focus-visible,
.compta-page button:focus-visible,
.compta-page select:focus-visible,
.compta-page input:focus-visible{outline:2px solid var(--focus);outline-offset:2px;border-radius:var(--r-mark)}

.compta-page .compta-h2{margin:6px 0 0;font-size:14.5px;font-weight:600;letter-spacing:-.02em;color:var(--ink)}

/* ---- La barre : sélecteurs (exercice, statut) et note ------------------- */
.compta-page .compta-bar{display:flex;flex-wrap:wrap;align-items:center;gap:8px 18px}
.compta-page .compta-bar-title{margin:0 0 0 auto;font-size:12px;font-weight:400;color:var(--ink-3);letter-spacing:0}
.compta-page .compta-choices{margin:0;gap:6px}
.compta-page .compta-choices-label{margin-right:4px;font-size:10.5px;font-weight:500;letter-spacing:.06em;color:var(--ink-3)}
.compta-page .compta-choice{display:inline-flex;align-items:center;height:24px;padding:0 9px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--card);color:var(--ink-2);font-size:12px;font-weight:500;transition:border-color var(--d-hover),color var(--d-hover)}
.compta-page .compta-choice:hover{background:var(--card);border-color:var(--line-2);color:var(--ink)}
.compta-page .compta-choice[aria-current=page]{background:var(--card);border-color:var(--ink);box-shadow:inset 0 0 0 1px var(--ink);color:var(--ink);font-weight:500}

/* ---- COMPTA-A : les chiffres en bandes ---------------------------------- */
.compta-page .compta-bands{display:grid;gap:10px}
.compta-page .compta-band{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:1px;background:var(--line);border:1px solid var(--line);border-radius:var(--r);overflow:hidden}
.compta-page .compta-card,
.compta-page .compta-card--good,
.compta-page .compta-card--bad{gap:3px;padding:12px 14px;border:0;border-radius:0;background:var(--card)}
.compta-page .compta-card-label{font-size:12px;font-weight:400;color:var(--ink-3)}
.compta-page .compta-card-value{font-size:22px;font-weight:600;letter-spacing:-.03em;line-height:1.15;color:var(--ink);font-variant-numeric:tabular-nums}
.compta-page .compta-card-value .compta-link{text-decoration-color:transparent}
.compta-page .compta-card-value .compta-link:hover{text-decoration-color:var(--ink)}
.compta-page .compta-card-hint{font-size:12px;line-height:1.4;color:var(--ink-2)}

/* ---- Les panneaux (la courbe) ------------------------------------------- */
.compta-page .compta-panel{min-width:0;border:1px solid var(--line);border-radius:var(--r);background:var(--card)}
.compta-page .compta-panel-h{display:flex;flex-wrap:wrap;align-items:center;gap:6px 12px;min-height:40px;padding:8px 14px;border-bottom:1px solid var(--line)}
.compta-page .compta-panel-title{margin:0;font-size:13px;font-weight:600;letter-spacing:0;color:var(--ink)}
.compta-page .compta-panel-b{padding:12px 14px}
.compta-page .compta-legend{display:inline-flex;flex-wrap:wrap;gap:14px;margin-left:auto;font-size:12px;color:var(--ink-3)}
.compta-page .compta-legend-item{display:inline-flex;align-items:center;gap:6px}
.compta-page .compta-key{display:inline-block;width:9px;height:9px;border-radius:var(--r-mark)}
.compta-page .compta-key--sales{background:var(--ink)}
.compta-page .compta-key--purchases{background:var(--ink-3)}

/* la courbe à l'encre : les séries lisent SERIES_INKS (dashboard.rs), ventes
   à l'encre, achats en encre tertiaire — rien à surcharger ici, seulement la
   hauteur et le cadre */
.compta-page .compta-chart{height:260px;padding:0;border:0;border-radius:0;background:transparent}

/* ---- Les replis (chiffres du graphique, rapprochement) ------------------ */
.compta-page .compta-fold{margin:0;border:1px solid var(--line);border-radius:var(--r);background:var(--card);overflow:hidden}
.compta-page .compta-fold[open]{padding-bottom:0}
.compta-page .compta-fold>summary{min-height:40px;padding:8px 14px;gap:9px;font-size:13px;font-weight:600;color:var(--ink);transition:background var(--d-hover)}
.compta-page .compta-fold>summary:hover{background:var(--paper)}
.compta-page .compta-fold>summary::before,
.compta-page .compta-aging-name::before{content:"";flex:none;display:inline-block;width:6px;height:6px;margin-right:2px;border-right:1.5px solid var(--ink-3);border-bottom:1.5px solid var(--ink-3);transform:rotate(-45deg);transition:transform var(--d-hover) var(--ease)}
.compta-page .compta-fold[open]>summary::before,
.compta-page .compta-aging-tier[open] .compta-aging-name::before{transform:rotate(45deg)}
.compta-page .compta-fold[open]>summary{border-bottom:1px solid var(--line)}
.compta-page .compta-fold>:not(summary){margin-left:0;margin-right:0}
.compta-page .compta-fold>.compta-table,
.compta-page .compta-fold>.compta-dup .compta-table{border-radius:0}
.compta-page .compta-fold>p{padding-left:14px;padding-right:14px}

/* ---- Les tableaux : denses, filets, chiffres à droite ------------------- */
.compta-page .compta-table{border-collapse:separate;border-spacing:0;font-size:13px;background:var(--card);color:var(--ink)}
.compta-page .compta-table th{height:32px;padding:0 10px;font-size:12px;font-weight:500;color:var(--ink-3);border-bottom:1px solid var(--line);background:var(--card)}
.compta-page .compta-table td{height:34px;padding:0 10px;border-bottom:1px solid var(--line);vertical-align:middle}
.compta-page .compta-table tbody tr:last-child td{border-bottom:0}
.compta-page .compta-table tbody tr:hover td{background:var(--paper)}
.compta-page .compta-table tbody tr:hover{background:transparent}
.compta-page .compta-table .num{font-variant-numeric:tabular-nums}
.compta-page .compta-table--dense td{height:30px;padding:0 8px}
.compta-page .compta-table--dense th{height:30px;padding:0 8px}
.compta-page .compta-table-wrap{border:1px solid var(--line);border-radius:var(--r);background:var(--card)}
.compta-page .compta-sort{color:inherit;text-decoration:none}
.compta-page .compta-sort:hover{color:var(--ink)}
.compta-page .compta-mono{font-family:inherit;font-size:12px;color:var(--ink-3)}

/* le retard : à l'encre jusqu'à 60 jours, en rouge au-delà */
.compta-page .compta-late{display:inline-flex;align-items:center;gap:5px;font-size:12px;font-weight:600;color:var(--danger);white-space:nowrap}
.compta-page .compta-late::before{content:"";width:6px;height:6px;border-radius:1px;background:var(--danger)}
.compta-page .compta-late--soft{font-weight:500;color:var(--ink-2)}
.compta-page .compta-late--soft::before{background:var(--ink-3)}

/* ---- Marges par affaire : la ligne signalée, sans couleur --------------- */
.compta-page .compta-flagged td{background:var(--paper-2)}
.compta-page .compta-flagged td:first-child{box-shadow:inset 2px 0 0 var(--ink)}
.compta-page .compta-bad{color:var(--danger);font-weight:600}
.compta-page .compta-flag{display:inline-flex;align-items:center;height:20px;margin:0 4px 0 0;padding:0 7px;border:1px solid var(--line);border-radius:var(--r-mark);background:var(--card);color:var(--ink-2);font-size:12px;font-weight:500}
.compta-page .compta-summary{margin:0;font-size:12px;color:var(--ink-3)}

/* ---- Encours et balance âgée -------------------------------------------- */
.compta-page .compta-section{display:grid;gap:10px;margin:0}
.compta-page .compta-section-head .compta-h2{margin:0}
.compta-page .compta-section-figures{font-size:13px;color:var(--ink-3)}
.compta-page .compta-section-figures strong{font-weight:600;color:var(--ink)}
.compta-page .compta-aging{border:1px solid var(--line);border-radius:var(--r);background:var(--card)}
.compta-page .compta-aging-row{min-height:38px;padding:0 14px;border-bottom:1px solid var(--line);font-size:13px}
.compta-page .compta-aging-head{min-height:32px;font-size:12px;font-weight:500;color:var(--ink-3);border-bottom-color:var(--line)}
.compta-page .compta-aging-total{min-height:36px;font-weight:600;background:var(--card);border-bottom:1px solid var(--line-2)}
.compta-page .compta-aging-tier>summary:hover{background:var(--paper)}
.compta-page .compta-aging-tier[open]>summary{background:var(--paper)}
.compta-page .compta-aging-tier:last-child>summary{border-bottom:0}
.compta-page .compta-aging-name{font-weight:500}
.compta-page .compta-aging-name::before{margin-right:9px;vertical-align:2px}
.compta-page .compta-aging-late,
.compta-page .compta-aging-late .compta-link{color:var(--danger);font-weight:600}
.compta-page .compta-aging-detail{padding:4px 14px 12px 36px;background:var(--paper);border-bottom:1px solid var(--line)}
.compta-page .compta-aging-detail .compta-table{background:transparent}
.compta-page .compta-aging-detail .compta-table th{background:transparent}

/* ---- RAPPRO-A : le rapprochement réel, remis au propre ------------------ */
.compta-page .compta-reco-index{gap:6px;margin:0}
.compta-page .compta-reco-chip{flex-direction:row;align-items:center;gap:6px;min-width:0;height:24px;padding:0 9px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--card);transition:border-color var(--d-hover)}
.compta-page .compta-reco-chip:hover{background:var(--card);border-color:var(--ink)}
.compta-page .compta-reco-chip span{font-size:12px;font-weight:500;color:var(--ink-2)}
.compta-page .compta-reco-chip strong{font-size:12px;font-weight:600;color:var(--ink)}
.compta-page .compta-reco>summary{gap:8px}
.compta-page .compta-reco-count{font-weight:500;color:var(--ink-3)}
.compta-page .compta-reco .compta-help{margin:0;padding:8px 14px 10px;font-size:12px;color:var(--ink-3)}
.compta-page .compta-reco .compta-table th:first-child,
.compta-page .compta-reco .compta-table td:first-child{padding-left:14px}
.compta-page .compta-reco .compta-empty{margin:0 14px 12px}
.compta-page .compta-reco .compta-more{padding:0 14px}
.compta-page .compta-dup{margin:0 0 10px}
.compta-page .compta-dup-title{margin:0;padding:8px 14px 4px;font-size:13px;font-weight:600}

/* ---- Textes d'appoint --------------------------------------------------- */
.compta-page .compta-empty{margin:0;padding:12px 14px;border:1px dashed var(--line-2);border-radius:var(--r);color:var(--ink-3);font-size:12px}
.compta-page .compta-notes{margin:4px 0 0;padding:0 0 0 16px;font-size:12px;line-height:1.5;color:var(--ink-3)}
.compta-page .compta-help{color:var(--ink-3);font-size:12px}
.compta-page .compta-more{margin:0;font-size:12px;color:var(--ink-3)}
.compta-page .compta-notice{margin:0;padding:9px 12px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--paper-2);color:var(--ink)}

/* ---- La correspondance des champs --------------------------------------- */
.compta-page .compta-form{gap:14px}
.compta-page .compta-fieldset{padding:4px 14px 6px;border:1px solid var(--line);border-radius:var(--r);background:var(--card)}
.compta-page .compta-fieldset legend{padding:0 6px;font-size:13px;font-weight:600;color:var(--ink)}
.compta-page .compta-field{border-bottom:1px solid var(--line)}
.compta-page .compta-field-label{font-size:13px;font-weight:500;color:var(--ink)}
.compta-page .compta-field-help,
.compta-page .compta-state{font-size:12px;color:var(--ink-3)}
.compta-page .compta-state.compta-bad{color:var(--danger);font-weight:500}
.compta-page .compta-select,
.compta-page .compta-input{height:32px;padding:0 10px;border:1px solid var(--line-2);border-radius:var(--r-sm);background:var(--card);color:var(--ink);font:inherit;font-size:13px;transition:border-color var(--d-hover)}
.compta-page .compta-select:hover,
.compta-page .compta-input:hover{border-color:var(--ink-3)}
.compta-page .compta-select:focus-visible,
.compta-page .compta-input:focus-visible{outline:2px solid var(--focus);outline-offset:2px;border-color:var(--ink)}
.compta-page .compta-select:disabled,
.compta-page .compta-input:disabled{background:var(--paper-2);color:var(--ink-3)}
.compta-page .compta-checks{font-size:13px;color:var(--ink)}
.compta-page .compta-checks input{accent-color:var(--ink)}
.compta-page .compta-actions{gap:8px}
.compta-page .compta-button{display:inline-flex;align-items:center;height:32px;padding:0 12px;border:0;border-radius:var(--r-btn);background:var(--btn-bg,var(--ink));color:var(--btn-ink,var(--paper));font:inherit;font-size:13px;font-weight:500;transition:background var(--d-hover),color var(--d-hover),box-shadow var(--d-hover)}
.compta-page .compta-button:hover{background:color-mix(in srgb,var(--ink) 86%,var(--paper))}
.compta-page .compta-button--ghost{background:var(--card);color:var(--ink);box-shadow:inset 0 0 0 1px var(--line-2)}
.compta-page .compta-button--ghost:hover{background:var(--ink);color:var(--paper);box-shadow:inset 0 0 0 1px var(--ink)}

/* ---- FACT-A : la liste des factures, le carré de statut ----------------- */
/* Le carré qui se remplit est rendu par record_table::status_mark (`b-st`,
   SVG) : quarts et moitiés dans `special_glyph`, payée pleine, annulée
   barrée. Plus aucune règle ici (les anciens sélecteurs `data-option` ne
   s'appliquaient plus). */

/* ---- PIECE-A : la pièce à gauche, la fiche à droite --------------------- */
/* La fiche d'une facture qui a une pièce (visionneuse `record_viewer`) : sur
   grand écran, la colonne de la pièce passe à gauche et le résumé de la fiche
   à droite, sans toucher au balisage générique de `record_page`. */
@media (min-width:1024px){
  [data-edit-scope="invoice"] main:has(> .viewer-slot){order:-1;background:var(--paper)}
  [data-edit-scope="invoice"] :has(> main > .viewer-slot) > aside{border-right:0;border-left:1px solid var(--line)}
}
[data-edit-scope="invoice"] .viewer-slot{padding:18px 20px 0}
[data-edit-scope="invoice"] .viewer{border:1px solid var(--line);border-radius:var(--r-sm);background:var(--card);box-shadow:var(--shadow-1)}
[data-edit-scope="invoice"] .viewer-summary{font-size:12px;color:var(--ink-3)}
[data-edit-scope="invoice"] .viewer-summary-title{font-weight:500;color:var(--ink-2)}
[data-edit-scope="invoice"] .viewer-summary:hover{background:var(--paper)}
[data-edit-scope="invoice"] .viewer-bar,
[data-edit-scope="invoice"] .viewer-frame,
[data-edit-scope="invoice"] .viewer-others{border-top-color:var(--line)}
[data-edit-scope="invoice"] .viewer-frame{background:var(--paper-2)}
[data-edit-scope="invoice"] .viewer-action{height:24px;padding:0 8px;border:0;border-radius:var(--r-sm);background:transparent;color:var(--ink-2);font-size:12px;font-weight:500}
[data-edit-scope="invoice"] .viewer-action:hover{background:var(--paper-2);color:var(--ink)}
[data-edit-scope="invoice"] .viewer-action:focus-visible,
[data-edit-scope="invoice"] .viewer>summary:focus-visible{outline:2px solid var(--focus);outline-offset:2px}

/* ---- Petits écrans ------------------------------------------------------ */
@media (max-width:760px){
  .compta-page .compta-content{padding:14px 16px 48px}
  .compta-page .compta-bar-title{margin-left:0;width:100%}
  .compta-page .compta-band{grid-template-columns:repeat(auto-fit,minmax(140px,1fr))}
  .compta-page .compta-card-value{font-size:19px}
  .compta-page .compta-legend{margin-left:0}
}

/* ---- Mouvement réduit --------------------------------------------------- */
@media (prefers-reduced-motion:reduce){
  .compta-page *,
  .compta-page *::before,
  [data-edit-scope="invoice"] .viewer *{transition:none!important;animation:none!important}
}

/* ---- RAPPRO-A : l'affaire proposée, ligne à ligne ---------------------------
   Une proposition reste un rond jusqu'à sa validation (kit COMPTA). */
.compta-page .compta-proposal{display:inline-flex;align-items:center;gap:8px;flex-wrap:wrap}
.compta-page .compta-proposal-dot{width:8px;height:8px;border-radius:50%;border:1.5px solid var(--ink-3);flex:none}
.compta-page .compta-proposal-why{font-size:12px;color:var(--ink-3)}
.compta-page .compta-proposal-form{display:inline-flex;margin:0}

/* ---- Studio Comptabilité du 30/09 ---------------------------------------
   COMPTA-02 relances, COMPTA-04 échéancier et avis du conducteur, COMPTA-06
   encours par affaire, COMPTA-01 relevé bancaire, COMPTA-07 dossier du mois,
   COMPTA-10 téléphone. Mêmes règles : jetons seulement, statuts sans couleur,
   le rouge au seul retard de plus de 60 jours. */
.compta-page .compta-sub{margin:10px 0 4px;font-size:11px;font-weight:500;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-3)}
.compta-page .compta-projects{margin-bottom:6px}
.compta-page .compta-remind{display:grid;gap:8px;padding:12px 14px;border:1px solid var(--line);border-radius:var(--r);background:var(--card)}
.compta-page .compta-remind-h{display:flex;flex-wrap:wrap;align-items:center;gap:6px 14px}
.compta-page .compta-remind-client{font-size:14px;font-weight:600;letter-spacing:-.01em;color:var(--ink)}
.compta-page .compta-remind-total{font-weight:600;color:var(--ink)}
.compta-page .compta-remind-last{font-size:12px;color:var(--ink-3)}
/* FACT-ENCAISSER : l'échéancier des relances — le niveau, et s'il est dû. */
.compta-page .compta-remind-step{display:inline-flex;align-items:center;height:22px;padding:0 8px;border-radius:999px;font-size:12px;color:var(--ink-2);box-shadow:inset 0 0 0 1px var(--line-2)}
.compta-page .compta-remind-step--due{color:var(--ink);font-weight:600;box-shadow:inset 0 0 0 1.5px var(--ink)}
.compta-page .compta-remind-h .compta-button{margin-left:auto}
.compta-page .compta-remind-noemail{margin-left:auto;font-size:12px;color:var(--ink-3)}
.compta-page .compta-opinion{white-space:nowrap}
.compta-page .compta-opine{display:inline-flex;gap:4px;margin:0 0 0 6px}
.compta-page .compta-flag--check{border-color:var(--ink);color:var(--ink)}
.compta-page .compta-bank-form{max-width:640px}
.compta-page .compta-mobile{display:none}
@media (max-width:640px){
  .compta-page .compta-mobile{display:grid;gap:12px}
  .compta-page .compta-desk{display:none}
  .compta-page .compta-mobile-cards{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--line);border:1px solid var(--line);border-radius:var(--r);overflow:hidden}
  .compta-page .compta-mobile-late{display:grid;gap:8px;margin:0;padding:0;list-style:none}
  .compta-page .compta-mobile-late li{display:grid;grid-template-columns:1fr auto;gap:4px 10px;align-items:center;padding:10px 12px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--card)}
  .compta-page .compta-mobile-client{font-weight:600;color:var(--ink);min-width:0;overflow-wrap:anywhere}
  .compta-page .compta-mobile-amount{font-variant-numeric:tabular-nums;color:var(--ink-2)}
  .compta-page .compta-mobile-late .compta-button{grid-column:1/-1;justify-self:start}
}

/* FACT-ENCAISSER : les paiements d'une facture (bloc « paiements_facture ») et l'échéancier
   des relances (Comptabilité › Facturation). */
.compta-page .compta-pay-head{display:flex;align-items:center;gap:10px}
.compta-page .compta-pay-head .compta-h2{margin:0}
.compta-page .compta-pay-state{display:inline-flex;align-items:center;height:22px;padding:0 9px;border-radius:999px;font-size:12px;font-weight:600;color:var(--ink-2);box-shadow:inset 0 0 0 1px var(--line-2)}
.compta-page .compta-pay-state--partial{color:var(--ink);box-shadow:inset 0 0 0 1.5px var(--ink-2)}
.compta-page .compta-pay-state--paid{color:var(--paper);background:var(--ink);box-shadow:none}
.compta-page .compta-pay-figures{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:0}
.compta-page .compta-pay-figures>div{padding:10px 12px;border:1px solid var(--line);border-radius:var(--r);background:var(--card)}
.compta-page .compta-pay-figures dt{font-size:12px;color:var(--ink-3)}
.compta-page .compta-pay-figures dd{margin:2px 0 0;font-size:16px;font-weight:600;color:var(--ink);font-variant-numeric:tabular-nums}
.compta-page .compta-pay-rest dd{font-size:18px}
.compta-page .compta-pay-cancelled td{color:var(--ink-3);text-decoration:line-through}
.compta-page .compta-pay-cancelled td:last-child{text-decoration:none}
.compta-page .compta-pay-cancel-note{font-size:12px;color:var(--ink-3)}
.compta-page .compta-pay-cancel summary{cursor:pointer;font-size:12px;color:var(--ink-2)}
.compta-page .compta-pay-cancel-form{display:grid;gap:6px;margin-top:6px}
.compta-page .compta-pay-cancel-form label{display:grid;gap:2px;font-size:12px}
.compta-page .compta-pay-form{display:grid;gap:10px;padding:12px 14px;border:1px solid var(--line);border-radius:var(--r);background:var(--card)}
.compta-page .compta-pay-fields{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.compta-page .compta-pay-fields label,.compta-page .compta-pay-cancel-form label{display:grid;gap:4px;font-size:12px;color:var(--ink-3)}
.compta-page .compta-pay-fields input,.compta-page .compta-pay-fields select,.compta-page .compta-pay-cancel-form input{height:34px;padding:0 10px;border:1px solid var(--line-2);border-radius:var(--r-sm);background:var(--card);color:var(--ink);font:inherit;font-size:13px}
.compta-page .compta-pay-form .compta-button{justify-self:start}
.compta-page .compta-relance-niveau{display:grid;gap:8px;margin:0;padding:12px 14px;border:1px solid var(--line);border-radius:var(--r);background:var(--card)}
.compta-page .compta-relance-niveau legend{padding:0 6px;font-weight:600;color:var(--ink)}
.compta-page .compta-relance-niveau textarea{width:100%;min-height:180px;padding:8px 10px;border:1px solid var(--line-2);border-radius:var(--r-sm);background:var(--card);color:var(--ink);font:inherit;font-size:13px;line-height:1.5;resize:vertical}
@media (max-width:720px){
  .compta-page .compta-pay-figures{grid-template-columns:1fr 1fr}
  .compta-page .compta-pay-rest{grid-column:1/-1}
  .compta-page .compta-pay-fields{grid-template-columns:1fr}
  .compta-page .compta-pay-form .compta-button{justify-self:stretch}
}
.compta-page .compta-notice--error{border-color:var(--danger);color:var(--danger)}
.compta-page .compta-h3{margin:0;font-size:14px;font-weight:600;color:var(--ink)}

/* assets/b/auto.css */
/* ==========================================================================
   Escouade · identité B — automatisations et vues de travail (lot 8)
   Automatisations : liste et journal (/automatisations, RUN-A), éditeur
   (/objects/workflows/{id}, EDIT-A), fiche d'agent (/settings/ai?tab=agents,
   AGENT-A), règles « Toujours appliquer » (REGLE-A).
   Vues : tableaux de bord (DASH-B), boîte mail (MAIL-A), planning (PLAN-C),
   tâches et notes du panneau de la boîte (TACHE-C, NOTE-A).
   Règles : seulement les jetons d'escouade-b.css, aucune couleur en dur ;
   aucun multicolore (ni séries, ni libellés, ni sources, ni avatars) ; le vert
   signal ne marque que ce qui bouge (automatisation active, exécution en
   cours) ; le rouge (danger) ne dit qu'un échec ou un retard.
   La grammaire du kit AUTO :
     carré d'encre        fait, matière
     rond signal fixe     actif
     rond signal qui bat  en cours, en attente
     rond cerclé d'encre  s'applique seul, écrit SANS validation
     rond vide            à l'arrêt
     carré barré rouge    échec
   Chargée APRÈS app.css : chaque règle est préfixée par sa portée (classe
   racine de l'écran ou crochet `b-*`) pour l'emporter quel que soit l'ordre.
   ========================================================================== */

/* ---- Les formes (communes aux écrans du lot) ----------------------------- */
.b-dir{display:inline-block;flex:none;width:9px;height:9px;border-radius:50%;background:var(--ink);box-shadow:0 0 0 2px var(--card),0 0 0 3.25px var(--ink)}
.b-off{display:inline-block;flex:none;width:10px;height:10px;border-radius:50%;box-shadow:inset 0 0 0 1.5px var(--ink-faint)}
.b-state{display:inline-block;flex:none;width:10px;height:10px;border-radius:50%}
.b-state--on{background:var(--signal)}
.b-state--off{box-shadow:inset 0 0 0 1.5px var(--ink-faint)}
@keyframes b-auto-ring{0%{box-shadow:0 0 0 0 var(--signal-glow)}70%{box-shadow:0 0 0 8px transparent}100%{box-shadow:0 0 0 0 transparent}}

/* Le statut d'une étape dans le diagramme d'une exécution (RUN-A / RUN-B,
   workflow_diagram.rs) — hors de .automation-page, donc sans portée d'écran :
   succès = carré d'encre, échec = carré barré rouge, en cours = rond signal
   qui bat. */
.b-run-mark{display:inline-block;flex:none;width:10px;height:10px;position:relative;border-radius:var(--r-mark)}
.b-run-mark--done{background:var(--ink)}
.b-run-mark--failed{box-shadow:inset 0 0 0 1.5px var(--danger)}
.b-run-mark--failed::after{content:"";position:absolute;left:1px;right:1px;top:4.25px;height:1.5px;background:var(--danger);transform:rotate(-45deg)}
.b-run-mark--running{border-radius:50%;background:var(--signal);animation:b-auto-ring var(--d-pulse,2200ms) var(--out) infinite}

/* La marque « écrit sans validation » : encre, jamais vert, jamais rouge
   (ce n'est pas une erreur, c'est un accord donné d'avance). */
.b-nv{display:inline-flex;align-items:center;gap:7px;height:22px;padding:0 9px 0 7px;border-radius:var(--r-pill);box-shadow:inset 0 0 0 1px var(--ink);background:var(--card);color:var(--ink);font-size:12px;font-weight:600;white-space:nowrap}
.b-nv .b-dir{width:7px;height:7px;box-shadow:0 0 0 1.5px var(--card),0 0 0 2.5px var(--ink)}

/* ==========================================================================
   AUTOMATISATIONS — la liste et le journal (RUN-A)
   ========================================================================== */
.automation-page{background:var(--paper);color:var(--ink);font-family:var(--font)}
.automation-page .automation-content{padding:28px 24px 72px}

/* onglets : un soulignement d'encre, pas une pilule */
.automation-page .automation-top{margin-bottom:18px;border-bottom:1px solid var(--line)}
.automation-page .automation-tabs{gap:2px}
.automation-page .automation-tabs a{padding:10px 8px;margin-bottom:-1px;border-radius:0;border-bottom:1.5px solid transparent;color:var(--ink-2);font-size:13px;font-weight:500}
.automation-page .automation-tabs a:hover{color:var(--ink)}
.automation-page .automation-tabs a.active{background:transparent;color:var(--ink);border-bottom-color:var(--ink);font-weight:500}
.automation-page .automation-new{display:inline-flex;align-items:center;gap:7px;height:32px;padding:0 12px;margin-bottom:8px;border:0;border-radius:var(--r-sm);background:var(--btn-bg,var(--ink));color:var(--btn-ink,var(--paper));font-size:13px;font-weight:500}
.automation-page .automation-new::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--signal);flex:none}
.automation-page .automation-new:hover{background:color-mix(in srgb,var(--ink) 86%,var(--paper))}

/* l'historique : barres à l'encre, jours vides en filet */
.automation-page .automation-history,
.automation-page .automation-list{border:1px solid var(--line);border-radius:var(--r);background:var(--card)}
.automation-page .automation-history{padding:14px 16px 10px}
.automation-page .automation-history header{font-size:12.5px;color:var(--ink-2)}
.automation-page .automation-history header strong{font-weight:500;color:var(--ink)}
.automation-page .automation-history header>span{color:var(--ink-3)}
.automation-page .automation-history-count>span{display:inline-flex;align-items:center;gap:6px;color:var(--ink-2);font-variant-numeric:tabular-nums}
.automation-page .automation-bars{gap:3px;height:72px;margin-top:14px}
.automation-page .automation-bars span{border-radius:2px 2px 0 0;background:var(--ink)}
.automation-page .automation-bars span.empty{background:var(--line)}
.automation-page .automation-history-dates{color:var(--ink-3);font-size:11px}

/* la liste : un tableau dense, statuts en formes */
.automation-page .automation-list{padding:0}
.automation-page .automation-list-head,
.automation-page .automation-list-row{padding:0 14px;gap:14px}
.automation-page .automation-list-head{height:34px;color:var(--ink-3);font-size:13px;font-weight:500}
.automation-page .automation-list-row{height:42px;border-top:1px solid var(--line);font-size:14px;color:var(--ink)}
.automation-page .automation-list-row:hover{background:color-mix(in srgb,var(--card) 55%,var(--paper-2))}
.automation-page .automation-list-row strong{font-weight:500}
.automation-page .automation-list-row>span:nth-child(2){color:var(--ink-2);font-size:13px}
.automation-page .automation-list-row:focus-visible{outline:2px solid var(--focus);outline-offset:-2px}
.automation-page .automation-empty{color:var(--ink-3);font-size:13px}
.automation-page .automation-error{color:var(--danger);font-size:13px}

.automation-page .automation-status{display:inline-flex;align-items:center;gap:7px;font-size:13px;font-weight:500;color:var(--ink);white-space:nowrap}
.automation-page .b-shape{display:inline-block;flex:none;width:10px;height:10px;position:relative;border-radius:var(--r-mark);box-shadow:inset 0 0 0 1.5px var(--ink-3)}
/* active : rond signal fixe */
.automation-page .automation-status.active .b-shape{border-radius:50%;background:var(--signal);box-shadow:none}
/* succès : carré d'encre plein */
.automation-page .automation-status.completed .b-shape,
.automation-page .automation-history-count .completed .b-shape{background:var(--ink);box-shadow:none}
/* en cours, en file : rond signal qui bat */
.automation-page .automation-status.running .b-shape,
.automation-page .automation-status.enqueued .b-shape{border-radius:50%;background:var(--signal);box-shadow:none;animation:b-auto-ring var(--d-pulse,2200ms) var(--out) infinite}
/* échec : carré barré, le seul rouge */
.automation-page .automation-status.failed{color:var(--danger)}
.automation-page .automation-status.failed .b-shape,
.automation-page .automation-history-count .failed .b-shape{box-shadow:inset 0 0 0 1.5px var(--danger)}
.automation-page .automation-status.failed .b-shape::after,
.automation-page .automation-history-count .failed .b-shape::after{content:"";position:absolute;left:1px;right:1px;top:4.25px;height:1.5px;background:var(--danger);transform:rotate(-45deg)}
/* arrêtée : carré barré, en retrait */
.automation-page .automation-status.stopped,
.automation-page .automation-status.stopping{color:var(--ink-3)}
.automation-page .automation-status.stopped .b-shape::after,
.automation-page .automation-status.stopping .b-shape::after{content:"";position:absolute;left:1px;right:1px;top:4.25px;height:1.5px;background:var(--ink-3)}
/* désactivée : rond vide */
.automation-page .automation-status.deactivated{color:var(--ink-3)}
.automation-page .automation-status.deactivated .b-shape{border-radius:50%;box-shadow:inset 0 0 0 1.5px var(--ink-faint)}

/* les modèles */
.automation-page .automation-templates-top{font-size:13px;font-weight:500}
.automation-page .automation-templates-top a{border-radius:var(--r-sm);color:var(--ink-2)}
.automation-page .automation-templates-top a.active{background:var(--paper-2);color:var(--ink);font-weight:500}
.automation-page .automation-template{border-radius:var(--r-sm)}
.automation-page .automation-template:hover{background:var(--paper-2)}
.automation-page .automation-template:focus-visible{outline:2px solid var(--focus);outline-offset:2px}
.automation-page .automation-template-icon{border-radius:var(--r-icon);background:var(--paper-2);color:var(--ink-2)}
.automation-page .automation-template-text strong{font-size:13px;font-weight:500;color:var(--ink)}
.automation-page .automation-template-text small{font-size:12px;color:var(--ink-3)}
.automation-page .automation-add{border-radius:var(--r-sm);background:transparent;box-shadow:inset 0 0 0 1px var(--line-2);color:var(--ink);font-size:12px}

/* la modale « Nouvelle automatisation » */
.automation-page .automation-backdrop{background:color-mix(in srgb,var(--ink) 18%,transparent);backdrop-filter:none}
.automation-page .automation-modal{border:1px solid var(--line);border-radius:var(--r-panel);background:var(--card);box-shadow:var(--shadow-1),0 12px 32px -12px color-mix(in srgb,var(--ink) 22%,transparent)}
.automation-page .automation-modal header{font-size:14.5px;font-weight:600}
.automation-page .automation-name input,
.automation-page .automation-field input,
.automation-page .automation-field select,
.automation-page .automation-field textarea{border:1px solid var(--line-2);border-radius:var(--r-sm);background:var(--card);color:var(--ink);font-size:14px}
.automation-page .automation-field>span{color:var(--ink);font-size:13px;font-weight:500}
.automation-page .automation-modal-tools a{color:var(--ink-2)}
.automation-page .automation-modal-help{color:var(--ink-3);font-size:12px}
.automation-page .automation-modal footer a,
.automation-page .automation-modal footer button{border:0;border-radius:var(--r-sm);box-shadow:inset 0 0 0 1px var(--line-2);font-size:13px;font-weight:500}
.automation-page .automation-modal footer button{background:var(--btn-bg,var(--ink));color:var(--btn-ink,var(--paper));box-shadow:none}
.automation-page .automation-modal :is(a,button,input,select,textarea):focus-visible{outline:2px solid var(--focus);outline-offset:2px}

/* ==========================================================================
   AUTOMATISATIONS — l'éditeur (EDIT-A)
   ========================================================================== */
/* la barre en tête : compte « sans validation », puis Tester · Désactiver · Activer */
.b-wf-bar{min-height:48px;gap:10px;background:var(--card);border-color:var(--line)}
.b-wf-bar .b-wf-btn{height:28px;padding:0 10px;border-radius:var(--r-sm);font-size:13px;font-weight:500;gap:7px}
.b-wf-bar .b-wf-btn--ghost{background:transparent;color:var(--ink-2)}
.b-wf-bar .b-wf-btn--ghost:hover{background:var(--paper-2);color:var(--ink)}
.b-wf-bar .b-wf-btn--secondary{border:0;background:var(--card);color:var(--ink);box-shadow:inset 0 0 0 1px var(--line-2)}
.b-wf-bar .b-wf-btn--secondary:hover{box-shadow:inset 0 0 0 1px var(--ink)}
.b-wf-bar .b-wf-btn--primary{background:var(--btn-bg,var(--ink));color:var(--btn-ink,var(--paper))}
.b-wf-bar .b-wf-btn--primary:hover{background:color-mix(in srgb,var(--ink) 86%,var(--paper))}
.b-wf-bar .b-wf-dot{width:7px;height:7px;border-radius:50%;background:var(--signal);flex:none}
.b-wf-bar .b-wf-btn:focus-visible{outline:2px solid var(--focus);outline-offset:3px}

/* le canevas pointillé du kit, et les nœuds */
.b-wf-canvas>div{background-color:var(--paper);background-image:radial-gradient(var(--line-2) 1px,transparent 1px);background-size:16px 16px}
.b-wf-canvas a.absolute:not([href*="panel=select"]):not(.ring-1),
.b-wf-canvas button.absolute{border-radius:var(--r);border-color:var(--line-2);background:var(--card);box-shadow:var(--shadow-1)}
.b-wf-canvas a.absolute:not([href*="panel=select"]):not(.ring-1):hover{border-color:var(--ink-3)}
.b-wf-canvas a.absolute.ring-1{border-radius:var(--r);border-color:var(--ink);background:var(--card);box-shadow:inset 0 0 0 1px var(--ink)}
.b-wf-canvas a.absolute:focus-visible{outline:2px solid var(--focus);outline-offset:3px}
/* un nœud qui écrit sans validation : filet d'encre à gauche (le rond cerclé
   est dans le nœud, `.b-dir`) */
.b-wf-canvas a.absolute.b-wf-direct:not(.ring-1){box-shadow:inset 3px 0 0 var(--ink),var(--shadow-1)}
.b-wf-canvas a.absolute .b-dir{margin-right:2px}
/* le « + » sous le dernier nœud reste visible au clavier */
.b-wf-canvas a[href*="panel=select"]:focus-visible{opacity:1;outline:2px solid var(--focus);outline-offset:2px}

/* les réglages d'une étape, dans la modale du système */
.b-wf-modal{border-color:var(--line);border-radius:var(--r-panel);background:var(--card);max-height:86vh}
.b-wf-modal h2{font-size:14.5px;font-weight:600;letter-spacing:-.01em;color:var(--ink)}
.b-wf-modal .b-wf-modal-body{display:grid;gap:14px}
.b-wf-modal .b-wf-modal-body :is(input,select,textarea):focus-visible{outline:2px solid var(--focus);outline-offset:2px}

/* ==========================================================================
   AUTOMATISATIONS — la fiche d'un agent (AGENT-A)
   ========================================================================== */
.b-agent-row{border-color:var(--line);border-radius:var(--r);background:var(--card)}
.b-agent-row.is-sel{box-shadow:inset 2px 0 0 var(--ink);background:var(--paper-2)}
.b-agent-row .b-state{margin:0 2px}
/* AG-NOUVEL-AGENT (D118, 2/11) : la galerie des agents prêts à l'emploi — une grille qui se replie, des cartes
   lisibles : l'icône et le titre sur une ligne, le texte entier, « Activer » en bas. */
.b-galerie{display:flex;flex-direction:column;gap:6px;margin-top:16px}
.b-galerie-titre{color:var(--ink-2);font-size:12px;font-weight:500}
.b-galerie-grille{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,240px),1fr));gap:10px}
.b-galerie-carte{display:flex;flex-direction:column;gap:6px;min-width:0;margin:0;padding:12px;border:1px solid var(--line);border-radius:var(--r);background:var(--card)}
.b-galerie-tete{display:flex;align-items:center;gap:8px;min-width:0}
.b-galerie-ic{display:inline-flex;flex:none;color:var(--ink-3)}
.b-galerie-nom{min-width:0;overflow:hidden;color:var(--ink);font-size:13px;font-weight:600;text-overflow:ellipsis;white-space:nowrap}
.b-galerie-texte{flex:1 1 auto;margin:0;color:var(--ink-3);font-size:12px;line-height:1.45}
.b-galerie-pied{display:flex;margin-top:2px}
/* AG-SELECTEUR (2/11) : un agent actif qui ne répond pas — la cause, et le geste qui corrige */
.b-agent-muet{display:flex;flex-wrap:wrap;align-items:center;gap:4px 8px;margin-top:4px;color:var(--ink-2);font-size:12px;line-height:1.4}
.b-agent-muet svg{flex:none;color:var(--warn,var(--ink-3))}
.b-agent-muet-texte{min-width:0}
.b-agent-muet-geste{color:var(--ink);font-weight:600;text-decoration:underline;text-underline-offset:2px}
.b-agent-muet-geste:hover{color:var(--ink-2)}
/* D164 : les gestes de la fiche de l'agent — le désactiver, le supprimer */
.b-agent-gestes{display:flex;flex-wrap:wrap;gap:8px}
.b-agent-geste{margin:0}
.b-agent-geste-btn{display:inline-flex;align-items:center;gap:6px;min-height:30px;padding:0 10px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--card);color:var(--ink);font:500 12.5px var(--font);text-decoration:none;cursor:pointer}
.b-agent-geste-btn:hover{background:var(--paper-2)}
.b-agent-geste-btn:focus-visible{outline:2px solid var(--focus);outline-offset:2px}
.b-agent-geste-btn.is-danger{color:var(--danger)}
.b-agent-form{border-color:var(--line);border-radius:var(--r);background:var(--card);padding:18px 20px}
.b-agent-form label{color:var(--ink)}
.b-agent-form :is(input[type=text],select,textarea){border-color:var(--line-2);border-radius:var(--r-sm)}
/* « Actif » : la même case à cocher, dessinée en interrupteur */
.b-agent-form .b-switch{appearance:none;-webkit-appearance:none;position:relative;flex:none;width:28px;height:16px;margin:0;border-radius:var(--r-pill);background:var(--line-2);cursor:pointer;transition:background var(--d-hover,150ms)}
.b-agent-form .b-switch::after{content:"";position:absolute;left:2px;top:2px;width:12px;height:12px;border-radius:50%;background:var(--card);box-shadow:var(--shadow-1);transition:transform var(--d-hover,150ms) var(--ease)}
.b-agent-form .b-switch:checked{background:var(--ink)}
.b-agent-form .b-switch:checked::after{transform:translateX(12px)}
.b-agent-form .b-switch:focus-visible{outline:2px solid var(--focus);outline-offset:2px}
.b-agent-form .b-switch-label{gap:8px;padding-bottom:6px}

/* ==========================================================================
   AUTOMATISATIONS — les règles « Toujours appliquer » (REGLE-A)
   ========================================================================== */
.b-rules-page .b-rules-create{background:var(--card);color:var(--ink);box-shadow:inset 0 0 0 1px var(--line-2)}
/* le lien porte les classes du bouton principal : la règle de l'action
   (globals.css, `:is(button, a, …).bg-accent-9.text-white`, trois classes)
   lui rendait son texte papier — sur fond de carte, illisible dans les deux
   thèmes. L'encre seule passe par un sélecteur qui la dépasse. */
.b-rules-page a.b-rules-create.bg-accent-9.text-white{color:var(--ink)}
.b-rules-page .b-rules-create:hover{background:var(--card);box-shadow:inset 0 0 0 1px var(--ink)}
.b-rules-page .b-rules-create:focus-visible{outline:2px solid var(--focus);outline-offset:3px}
.b-rule{border-color:var(--line);border-radius:var(--r);background:var(--card);padding:12px 14px}
/* une règle active applique sans revue : le filet d'encre du kit */
.b-rule:not(.is-off){box-shadow:inset 3px 0 0 var(--ink)}
.b-rule.is-off{opacity:.62}
.b-rule .b-rule-mark{margin-top:5px}
.b-rule .b-rule-type{display:inline-flex;align-items:center;height:20px;padding:0 7px;border-radius:5px;background:var(--paper-2);color:var(--ink-2);font-size:12px;font-weight:500;white-space:nowrap}
.b-rule .b-rule-cond{height:24px;border-radius:var(--r-sm);background:var(--card);box-shadow:inset 0 0 0 1px var(--line);color:var(--ink-2);font-size:12.5px}
/* le domaine expéditeur au premier plan */
.b-rule .b-rule-value{color:var(--ink);font-weight:600;box-shadow:inset 0 -1.5px 0 var(--ink)}
/* l'interrupteur : encre, pas accent */
/* Le bouton n'a pas de fond : c'est `.esc-switch` qui dessine la piste. Un fond ici dépassait de ses coins. */
.b-rule [role=switch]{border:0;padding:0;background:none}
.b-rule :is(button,a):focus-visible{outline:2px solid var(--focus);outline-offset:2px}

/* ==========================================================================
   AUTOMATISATIONS — lot « auto » des choix du 29/09 (kit AUTO)
   EDIT-A : les outils d'écriture d'un agent en cases ; RUN-A : durée et
   écritures d'un passage ; RUN-B : la frise d'un passage et son annulation ;
   AGENT-A : le rôle et les portes ; REGLE-A : le compte des applications.
   ========================================================================== */
/* EDIT-A — les cases d'outils, dans la modale d'une étape Agent */
.b-toolpick{display:grid;gap:4px}
.b-toolpick-row{display:flex;align-items:center;gap:8px;min-height:30px;padding:0 10px;border-radius:var(--r-sm);box-shadow:inset 0 0 0 1px var(--line);background:var(--card);font-size:13px;color:var(--ink);cursor:pointer}
.b-toolpick-row:has(input:checked){box-shadow:inset 0 0 0 1px var(--ink)}
.b-toolpick-row input{accent-color:var(--ink);margin:0}
.b-toolpick-row code{font-family:var(--mono);font-size:12.5px}
.b-toolpick-note{margin-left:auto;color:var(--ink-3);font-size:12px}
.b-toolpick-help{color:var(--ink-3);font-size:12.5px}
.b-toolpick-row:focus-within{outline:2px solid var(--focus);outline-offset:2px}

/* RUN-A — cinq colonnes : la durée et les écritures du passage */
.automation-page .automation-list--runs .automation-list-head,
.automation-page .automation-list--runs .automation-list-row{grid-template-columns:minmax(0,1.5fr) minmax(0,1fr) 96px 170px 150px}
.automation-page .automation-run-duration{color:var(--ink-2);font-size:13px;font-variant-numeric:tabular-nums}
.automation-page .automation-run-writes{display:inline-flex;align-items:center;gap:12px;color:var(--ink-2);font-size:13px;font-variant-numeric:tabular-nums;white-space:nowrap}
.automation-page .automation-run-writes>span{display:inline-flex;align-items:center;gap:6px}
.automation-page .automation-run-awaiting{color:var(--ink);font-weight:500}
.automation-page .automation-run-none{color:var(--ink-3)}
@media(max-width:760px){
  .automation-page .automation-list--runs .automation-list-head,
  .automation-page .automation-list--runs .automation-list-row{grid-template-columns:minmax(0,1fr) 100px}
  .automation-page .automation-list--runs :is(.automation-list-head,.automation-list-row)>:is(:nth-child(3),:nth-child(4)){display:none}
}

/* RUN-B — la frise d'un passage : carré posé, rond qui bat en attente */
.b-run-frise{margin:20px 24px 0 48px;max-width:760px;padding:14px 16px;border:1px solid var(--line);border-radius:var(--r);background:var(--card);color:var(--ink);font-family:var(--font)}
.b-run-frise-title{font-size:13px;font-weight:600;color:var(--ink);margin-bottom:10px}
.b-run-frise-list{display:grid;gap:0;margin:0;padding:0;list-style:none}
.b-run-step{display:flex;gap:12px;padding:9px 0;border-top:1px solid var(--line)}
.b-run-step:first-child{border-top:0}
.b-run-step>.b-run-mark,.b-run-step>.b-off{margin-top:4px}
.b-run-step.is-wait{box-shadow:inset 2px 0 0 var(--ink);padding-left:10px;margin-left:-12px}
.b-run-step-body{display:grid;gap:3px;min-width:0}
.b-run-step-head{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px;font-size:13px}
.b-run-step-head b{font-weight:600}
.b-run-step-name{color:var(--ink-2)}
.b-run-step-wait{display:inline-flex;align-items:center;height:20px;padding:0 7px;border-radius:var(--r-pill);box-shadow:inset 0 0 0 1px var(--ink);font-size:11.5px;font-weight:600;color:var(--ink)}
.b-run-step-dim{color:var(--ink-3);font-size:12px}
.b-run-step-fact{font-size:13px;color:var(--ink)}
.b-run-step-sub{font-size:12px;color:var(--ink-3);overflow-wrap:anywhere}
.b-run-step-sub a{color:var(--ink);text-decoration:underline;text-underline-offset:2px}
.b-run-step-err{font-size:12px;color:var(--danger);overflow-wrap:anywhere}
.b-run-cancel{display:flex;flex-wrap:wrap;align-items:center;gap:10px 14px;margin-top:12px;padding-top:12px;border-top:1px solid var(--line)}
.b-run-cancel p{flex:1;min-width:220px;font-size:12.5px;color:var(--ink-2)}
.b-run-cancel-btn{display:inline-flex;align-items:center;gap:6px;height:28px;padding:0 10px;border:0;border-radius:var(--r-sm);background:var(--card);box-shadow:inset 0 0 0 1px var(--line-2);color:var(--ink);font-size:13px;font-weight:500;cursor:pointer}
.b-run-cancel-btn:hover{box-shadow:inset 0 0 0 1px var(--ink)}
.b-run-cancel-btn:focus-visible,.b-run-step-sub a:focus-visible{outline:2px solid var(--focus);outline-offset:2px}
@media(max-width:760px){.b-run-frise{margin:16px 16px 0}}

/* AGENT-A — le rôle et les portes d'écriture */
.b-agent-form .b-agent-help{color:var(--ink-3);font-size:12px}
.b-agent-form .b-agent-role-locked{min-height:32px;display:flex;align-items:center;padding:0 10px;border-radius:var(--r-sm);background:var(--paper-2);color:var(--ink-2);font-size:13px}
.b-agent-form .b-agent-doors{display:grid;gap:6px;padding:12px 14px;border-radius:var(--r-sm);box-shadow:inset 0 0 0 1px var(--line)}
.b-agent-form .b-agent-doors-title{font-size:12.5px;font-weight:600;color:var(--ink)}
.b-agent-form .b-agent-door{display:flex;align-items:flex-start;gap:9px;font-size:13px;color:var(--ink)}
.b-agent-form .b-agent-door>:first-child{margin-top:4px}
.b-agent-form .b-agent-uses{display:grid;gap:3px;margin:0;padding:0;list-style:none;font-size:13px}
.b-agent-form .b-agent-uses a{color:var(--ink);font-weight:500;text-decoration:underline;text-underline-offset:2px}
.b-agent-form .b-agent-uses code{font-family:var(--mono);font-size:12px;color:var(--ink-2)}
.b-agent-form .b-agent-uses a:focus-visible{outline:2px solid var(--focus);outline-offset:2px}

/* REGLE-A — ce qu'une règle a appliqué sans revue */
.b-rule .b-rule-count{margin-top:6px;font-size:12.5px;color:var(--ink-2);font-variant-numeric:tabular-nums}

/* ==========================================================================
   VUES — les tableaux de bord (DASH-B)
   ========================================================================== */
.b-dash{background:var(--paper)}
.b-dash .b-dash-card{border-color:var(--line);border-radius:var(--r);background:var(--card)}
.b-dash .b-dash-head{border-color:var(--line)}
.b-dash .b-dash-head>span:first-child{font-size:12.5px;font-weight:500;color:var(--ink-2)}
/* la tuile « Nombre » : une case de la bande de chiffres */
.b-dash .b-dash-card--num .b-dash-head{border-bottom:0;padding-bottom:0}
.b-dash .b-dash-card--num .b-dash-head>span:first-child{font-size:10.5px;font-weight:500;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-3)}
.b-dash .b-dash-card--num .dash-kpi{align-items:flex-start;justify-content:flex-start;gap:3px;padding:0;text-align:left}
.b-dash .b-dash-card--num .dash-kpi-value{color:var(--ink);font-size:clamp(1.125rem,10cqw,1.5rem);font-weight:600;letter-spacing:-.025em}
.b-dash .dash-kpi-compare{justify-content:flex-start;color:var(--ink-3);font-size:11.5px}
.b-dash .dash-kpi-sub{color:var(--ink-3);font-size:11.5px;font-weight:400}
/* la variation : encre, jamais vert ni rouge (ce n'est ni un succès ni une erreur) */
.b-dash .dash-delta{color:var(--ink-2)}
.b-dash .dash-delta-up{color:var(--ink)}
.b-dash .dash-delta-down{color:var(--ink-2)}
.b-dash .dash-nofilter{background:var(--paper-2);color:var(--ink-3)}
/* la période : la puce retenue est à l'encre */
.dash-chip{border-color:var(--line);border-radius:var(--r-sm);background:var(--card);color:var(--ink-2)}
.dash-chip:hover{background:var(--paper-2);color:var(--ink)}
.dash-chip-on,.dash-chip-on:hover{border-color:var(--ink);background:var(--ink);color:var(--paper)}
.dash-periods-label{color:var(--ink-3)}
.b-dash :is(a,button,input,select):focus-visible{outline:2px solid var(--focus);outline-offset:2px}

/* ==========================================================================
   VUES — la boîte mail, trois colonnes (MAIL-A)
   ========================================================================== */
.b-mail-folders{background:var(--paper);border-color:var(--line)}
.b-mail-folders a[aria-current=true]{background:var(--card);color:var(--ink);box-shadow:0 0 0 1px var(--line),var(--shadow-1)}
.b-mail-folders a[aria-current=true] *{color:var(--ink)}
.b-mail-list{background:var(--card)}
.b-mail-row{border-bottom-color:var(--line)}
.b-mail-row.is-open{background:var(--paper-2);border-left-color:var(--ink)}
.b-mail-row.is-open:hover{background:var(--paper-2)}
.b-mail-thread{background:var(--card)}
/* les libellés : à l'encre, un petit carré puis le nom */
.b-label{gap:5px;background:var(--card);box-shadow:inset 0 0 0 1px var(--line);color:var(--ink-2);font-weight:500}
.b-label::before{content:"";width:6px;height:6px;border-radius:1.5px;background:var(--ink-3);flex:none}
.b-label-glyph{color:var(--ink-3)}
/* les avatars : trois valeurs d'encre neutres, aucune teinte par personne */
.b-avatar{color:var(--ink)}
.b-avatar--1{background:var(--paper-2)}
.b-avatar--2{background:color-mix(in srgb,var(--ink) 10%,var(--card))}
.b-avatar--3{background:color-mix(in srgb,var(--ink) 18%,var(--card))}
/* l'analyse IA : un encart papier, filet discret, sans teinte d'accent */
.b-mail-ai{border-color:var(--line);background:var(--paper)}
.b-mail-ai>div:first-child{color:var(--ink-3)}
.b-mail-folders :is(a,summary,button):focus-visible,
.b-mail-list :is(a,button,input):focus-visible,
.b-mail-thread :is(a,button,summary):focus-visible{outline:2px solid var(--focus);outline-offset:-2px}

/* ==========================================================================
   VUES — tâches et notes, le panneau de la boîte (TACHE-C, NOTE-A)
   ========================================================================== */
.b-side-panel{background:var(--card);border-color:var(--line)}
.b-side-panel .b-task-add form{border-radius:var(--r-sm);border-color:var(--line-2);height:34px}
.b-side-panel .b-task-add form button{color:var(--ink)}
.b-side-panel .b-task-row{border-color:var(--line)}
/* la case : un carré qui se remplira */
.b-side-panel .b-task-check{border:1.5px solid var(--ink-3);border-radius:var(--r-mark);width:14px;height:14px;margin-top:3px}
.b-side-panel .b-task-check:hover{border-color:var(--ink);background:var(--ink);color:var(--paper)}
.b-side-panel .b-task-check:focus-visible{outline:2px solid var(--focus);outline-offset:2px}
.b-side-panel .b-task-due{color:var(--ink-3);font-variant-numeric:tabular-nums}
/* « En retard » : le seul rouge du panneau. Le groupe porte sa clé de
   libellé (pages/inbox.rs, `load_tasks` : isInPast → tasks.eyebrow). */
.b-side-panel .b-panel-group[data-group="inbox.panel.tasks.eyebrow"] .b-task-due{color:var(--danger)}
.b-side-panel .b-note-item{border-color:var(--line)}
.b-side-panel .b-note-item:hover{background:var(--paper-2)}
.b-side-panel .b-note-item>span:first-child{font-weight:600;color:var(--ink)}
.b-side-panel .b-note-item>span+span{color:var(--ink-3)}
.b-side-panel .b-note-item:focus-visible{outline:2px solid var(--focus);outline-offset:-2px}

/* ==========================================================================
   VUES — le planning, Gantt par affaire (PLAN-C)
   Plus une couleur par source : l'encre, en quatre valeurs, et la forme
   (barre pleine, contour) ; seul le retard prend le rouge d'alerte.
   ========================================================================== */
.plan-page{background:var(--paper);color:var(--ink)}
.plan-page .plan-choice[aria-current=page]{background:var(--ink);color:var(--paper)}
.plan-page .plan-step[aria-current=page]{background:var(--paper-2);color:var(--ink)}
.plan-page .plan-filters{border-color:var(--line);border-radius:var(--r);background:var(--card)}
.plan-page .plan-gantt-wrap{border-color:var(--line);border-radius:var(--r);background:var(--card)}
.plan-page .plan-row--alt{fill:var(--paper)}
.plan-page .plan-grid-month{stroke:var(--line-2)}
.plan-page .plan-grid-week{stroke:var(--line)}
.plan-page .plan-axis{stroke:var(--line-2)}
.plan-page .plan-axis-month{fill:var(--ink-2)}
.plan-page .plan-axis-week{fill:var(--ink-3)}
.plan-page .plan-row-label{fill:var(--ink);font-weight:500}
.plan-page a:hover>.plan-row-label{fill:var(--ink);text-decoration:underline}
.plan-page .plan-row-label--none{fill:var(--ink-3)}

/* les dix teintes de source deviennent quatre valeurs d'encre */
.plan-page :is(.plan-c-blue,.plan-c-red){background:var(--ink);fill:var(--ink);color:var(--paper)}
.plan-page :is(.plan-c-sky,.plan-c-purple,.plan-c-orange){background:var(--ink-2);fill:var(--ink-2);color:var(--paper)}
.plan-page :is(.plan-c-turquoise,.plan-c-green,.plan-c-pink){background:var(--card);fill:var(--card);color:var(--ink);stroke:var(--ink);stroke-width:1.25;box-shadow:inset 0 0 0 1.25px var(--ink)}
.plan-page :is(.plan-c-yellow,.plan-c-gray){background:var(--ink-faint);fill:var(--ink-faint);color:var(--ink)}
.plan-page .plan-bar{opacity:1}
.plan-page .plan-milestone{stroke:var(--card);stroke-width:1}
.plan-page :is(.plan-c-turquoise,.plan-c-green,.plan-c-pink).plan-milestone{stroke:var(--ink);stroke-width:1.5}
.plan-page a:hover>.plan-bar,.plan-page a:hover>.plan-milestone{stroke:var(--ink);stroke-width:1.5}
.plan-page a:focus-visible>:is(.plan-bar,.plan-milestone){stroke:var(--focus);stroke-width:2}
/* le retard, nommé en rouge : contour tireté */
.plan-page .plan-bar.plan-late,
.plan-page .plan-milestone.plan-late{stroke:var(--danger);stroke-width:2;stroke-dasharray:4 2}
.plan-page .plan-span.plan-late,
.plan-page .plan-dot.plan-late{outline:1.5px dashed var(--danger);outline-offset:-1px}
/* aujourd'hui : un trait d'encre, pas une alerte */
.plan-page .plan-today-line{stroke:var(--ink);stroke-width:1;stroke-dasharray:3 3}
.plan-page .plan-today-label{fill:var(--ink-2)}
.plan-page .plan-swatch{border-radius:var(--r-mark)}
.plan-page .plan-swatch--late{background:transparent;border:1.5px dashed var(--danger)}
.plan-page .plan-swatch--today{background:var(--ink)}
/* semaine et mois : mêmes valeurs d'encre */
.plan-page .plan-week{border-color:var(--line);border-radius:var(--r);background:var(--card)}
.plan-page .plan-dayhead{border-color:var(--line);background:var(--paper);color:var(--ink-3)}
.plan-page .plan-dayhead--today{background:var(--paper-2);color:var(--ink);box-shadow:inset 0 -1.5px 0 var(--ink)}
.plan-page .plan-cell{border-color:var(--line)}
.plan-page .plan-cell--today{background:var(--paper)}
.plan-page .plan-cell--out{background:var(--paper-2)}
.plan-page .plan-span,.plan-page .plan-dot{border-radius:var(--r-sm)}
.plan-page .plan-span:hover,.plan-page .plan-dot:hover{filter:none;box-shadow:inset 0 0 0 1.5px var(--ink)}
.plan-page .plan-load-wrap{border-color:var(--line);border-radius:var(--r)}
/* la semaine en cours : un trait d'encre, pas une alerte (app.css la rosit) */
.plan-page .plan-load-week--now{background:var(--paper-2);color:var(--ink);box-shadow:inset 0 -1.5px 0 var(--ink)}
.plan-page :is(a,button,summary,select,input):focus-visible{outline:2px solid var(--focus);outline-offset:2px}

/* ---- Le bac « À confirmer » : une carte par date (PLAN-C) -----------------
   En tête la date et ce qu'elle dit, sur toute la largeur ; dessous le
   chantier et la source citée ; le doublon possible en une ligne qu'on
   déplie ; puis la rangée de décision, toujours au même endroit : confirmer
   à gauche, écarter à droite. Aucun dégradé, aucune couleur en dur : le
   doublon se dit par un filet d'encre, comme la preuve du centre de
   contrôle (.cc-proof). */
.plan-page .plan-tray{margin:0 0 14px;padding:12px 16px 14px;border:1px solid var(--line);border-radius:var(--r);background:var(--card);box-shadow:var(--shadow-1)}
.plan-page .plan-tray-head{gap:8px;color:var(--ink);font-size:14px;font-weight:600}
.plan-page .plan-tray-dot{background:var(--signal);box-shadow:0 0 0 3px var(--signal-soft)}
.plan-page .plan-tray-count{background:var(--ink);color:var(--paper)}
.plan-page .plan-tray>.plan-help{max-width:72ch;margin:4px 0 12px;color:var(--ink-3);font-size:12.5px}
.plan-page .plan-tray-empty{color:var(--ink-3)}
.plan-page .plan-tray-list{display:grid;grid-template-columns:minmax(0,1fr);gap:8px}

.plan-page .plan-card{display:grid;grid-template-columns:minmax(0,1fr);gap:8px;min-width:0;padding:12px 14px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--card);scroll-margin-top:80px}
.plan-page .plan-card:target{border-color:var(--ink);box-shadow:var(--ring-ink)}

.plan-page .plan-card-head{display:flex;align-items:baseline;gap:6px 12px;min-width:0}
.plan-page .plan-card-when{flex:none;display:inline-flex;align-items:center;height:22px;padding:0 8px;border:1px solid var(--line-2);border-radius:var(--r-icon);background:var(--paper);color:var(--ink);font-size:12px;font-weight:600;font-variant-numeric:tabular-nums;white-space:nowrap}
/* la date floue : le pointillé des bandes du planning */
.plan-page .plan-card-when--vague{border-style:dashed}
.plan-page .plan-card-title{flex:1;min-width:0;margin:0;color:var(--ink);font-size:14px;font-weight:600;line-height:1.4;overflow-wrap:anywhere}

.plan-page .plan-card-meta{display:flex;flex-wrap:wrap;align-items:baseline;gap:2px 8px;margin:0;color:var(--ink-3);font-size:12.5px}
.plan-page .plan-card-site{color:var(--ink-2);font-weight:500;text-decoration:none;overflow-wrap:anywhere}
.plan-page a.plan-card-site:hover{color:var(--ink);text-decoration:underline}
.plan-page .plan-card-site--none{color:var(--ink-3);font-weight:400;font-style:italic}
.plan-page .plan-card-sep{color:var(--ink-faint)}
.plan-page .plan-card-src{color:var(--ink-2);text-decoration:none}
.plan-page a.plan-card-src{border-bottom:1px dotted var(--line-2)}
.plan-page a.plan-card-src:hover{color:var(--ink);border-bottom-color:var(--ink)}

/* le doublon possible : une ligne, qu'on déplie */
.plan-page .plan-card-dup{border-left:2px solid var(--ink);border-radius:0 var(--r-mark) var(--r-mark) 0;background:var(--paper);font-size:12.5px}
.plan-page .plan-card-dup-sum{display:flex;align-items:baseline;gap:8px;min-width:0;padding:6px 10px;color:var(--ink-2);cursor:pointer;list-style:none}
.plan-page .plan-card-dup-sum::-webkit-details-marker{display:none}
.plan-page .plan-card-dup-k{flex:none;color:var(--ink);font-weight:600}
.plan-page .plan-card-dup-first{flex:0 1 auto;min-width:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.plan-page .plan-card-dup-n{flex:none;color:var(--ink-3);font-variant-numeric:tabular-nums}
.plan-page .plan-card-dup-see{flex:none;margin-left:auto;padding-left:8px;color:var(--ink);text-decoration:underline;text-decoration-color:var(--line-2);text-underline-offset:2px}
.plan-page .plan-card-dup-see::after{content:" ▾";display:inline-block;margin-left:2px;text-decoration:none;transition:transform var(--d-hover)}
.plan-page .plan-card-dup[open] .plan-card-dup-see::after{transform:rotate(180deg)}
.plan-page .plan-card-dup-sum:hover .plan-card-dup-see{text-decoration-color:var(--ink)}
.plan-page .plan-card-dup-list{display:grid;gap:3px;margin:0;padding:0 10px 8px 10px;list-style:none;color:var(--ink-2)}
.plan-page .plan-card-dup-list li{min-width:0;overflow-wrap:anywhere}
.plan-page .plan-card-dup-list li::before{content:"";display:inline-block;width:5px;height:5px;margin:0 7px 1px 0;border-radius:var(--r-mark);background:var(--ink-faint);vertical-align:middle}
.plan-page .plan-card-dup-list .plan-link{color:var(--ink);border-bottom:1px dotted var(--line-2);text-decoration:none}
.plan-page .plan-card-dup-list .plan-link:hover{border-bottom-color:var(--ink)}

/* la rangée de décision : confirmer à gauche, écarter à droite */
.plan-page .plan-card-form{display:flex;flex-wrap:wrap;align-items:flex-start;gap:10px 32px;padding-top:10px;border-top:1px solid var(--line)}
.plan-page .plan-card-confirm,.plan-page .plan-card-dismiss{display:flex;flex-wrap:wrap;align-items:flex-start;gap:8px;min-width:0}
.plan-page .plan-card-dismiss{margin-left:auto}
.plan-page .plan-cf{display:grid;gap:4px;min-width:0}
.plan-page .plan-cf-k{display:block;height:14px;color:var(--ink-3);font-size:11.5px;font-weight:500;line-height:14px;white-space:nowrap}
.plan-page .plan-card-form :is(.plan-select,.plan-input){box-sizing:border-box;height:34px;max-width:none;padding:0 10px;border:1px solid var(--line-2);border-radius:var(--r-sm);background:var(--card);color:var(--ink);font-size:13px}
.plan-page .plan-card-form :is(.plan-select,.plan-input):hover{border-color:var(--ink-3)}
.plan-page .plan-cf--target .plan-select{width:clamp(200px,24vw,300px)}
.plan-page .plan-cf--day .plan-input{width:150px}
.plan-page .plan-cf--reason .plan-select{width:clamp(150px,16vw,200px)}
.plan-page .plan-cf-hint{max-width:150px;color:var(--ink-3);font-size:11.5px;line-height:1.35}
/* le bouton s'aligne sur les champs, sous leur étiquette (14 px + 4 px) */
.plan-page .plan-card-go{box-sizing:border-box;height:34px;margin-top:18px;padding:0 16px;border-radius:var(--r-sm);font-size:13px;font-weight:600;white-space:nowrap}
.plan-page .plan-card-form .plan-button{border:1px solid var(--ink);background:var(--ink);color:var(--paper)}
.plan-page .plan-card-form .plan-button--ghost{border-color:var(--line-2);background:var(--card);color:var(--ink)}
.plan-page .plan-card-form .plan-button--ghost:hover{border-color:var(--danger);color:var(--danger)}
.plan-page .plan-card-ro{margin:0;padding-top:10px;border-top:1px solid var(--line);color:var(--ink-3);font-size:12.5px}

/* le chantier d'une date qui n'en a pas : une rangée à part, au-dessus de la
   décision — le choix, la recherche quand la liste est longue, puis la
   raison du chantier proposé, en une ligne */
.plan-page .plan-card-pick{flex:1 1 100%;display:flex;flex-wrap:wrap;align-items:flex-start;gap:6px 8px;min-width:0}
.plan-page .plan-cf--site .plan-select{width:clamp(220px,30vw,380px)}
.plan-page .plan-card-find{display:flex;gap:6px}
.plan-page .plan-cf--find .plan-input{width:clamp(150px,16vw,220px)}
.plan-page .plan-card-find-go{box-sizing:border-box;height:34px;padding:0 12px;border:1px solid var(--line-2);border-radius:var(--r-sm);background:var(--card);color:var(--ink);font-size:13px;font-weight:500;white-space:nowrap;cursor:pointer}
.plan-page .plan-card-find-go:hover{border-color:var(--ink)}
.plan-page .plan-card-why,.plan-page .plan-card-note{flex:1 1 100%;margin:0;color:var(--ink-3);font-size:12px;line-height:1.4;overflow-wrap:anywhere}
.plan-page .plan-card-why{color:var(--ink-2)}
.plan-page .plan-card-why::before{content:"";display:inline-block;width:6px;height:6px;margin:0 7px 1px 0;border-radius:var(--r-mark);background:var(--signal);vertical-align:middle}
.plan-page .plan-card-findform{display:none}

/* sur téléphone : tout s'empile, les boutons sous le pouce, pleine largeur */
@media(max-width:640px){
  .plan-page .plan-tray{padding:10px 12px 12px}
  .plan-page .plan-card{padding:12px}
  .plan-page .plan-card-head{flex-direction:column;align-items:flex-start;gap:6px}
  .plan-page .plan-card-form{flex-direction:column;align-items:stretch;gap:14px}
  .plan-page .plan-card-confirm,.plan-page .plan-card-dismiss{flex-direction:column;align-items:stretch;margin-left:0}
  .plan-page .plan-card-confirm+.plan-card-dismiss{padding-top:12px;border-top:1px dashed var(--line)}
  .plan-page :is(.plan-cf--target,.plan-cf--day,.plan-cf--reason,.plan-cf--site,.plan-cf--find) :is(.plan-select,.plan-input){width:100%;height:40px}
  .plan-page .plan-card-pick{flex-direction:column;align-items:stretch}
  .plan-page .plan-card-find .plan-input{flex:1}
  .plan-page .plan-card-find-go{height:40px}
  .plan-page .plan-cf-hint{max-width:none}
  .plan-page .plan-card-go{width:100%;height:44px;margin-top:0}
}
@media (prefers-reduced-motion:reduce){.plan-page .plan-card-dup-see::after{transition:none}}

/* ---- Le mouvement --------------------------------------------------------- */
@media (prefers-reduced-motion:reduce){
  .automation-page .b-shape,
  .b-run-mark--running,
  .b-agent-form .b-switch,.b-agent-form .b-switch::after{animation:none!important;transition:none!important}
}

/* le compte des non-lus : une pastille d'encre — le rouge ne dit qu'un échec */
.b-unread{background:var(--ink);color:var(--paper)}

/* Studio automations: templates, schedule, last run and pending approvals. */
.au-page .au-hero{max-width:1060px;margin:36px auto}
.au-hero-title{margin:0 0 12px;font-size:clamp(24px,3vw,34px);font-weight:600;letter-spacing:-.025em;color:var(--ink)}
.au-hero-lede{max-width:640px;margin:0 0 28px;color:var(--ink-2);line-height:1.6}
.au-template-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:14px;padding:0;list-style:none}
.au-template{display:flex;flex-direction:column;gap:12px;padding:20px;border:1px solid var(--line);border-radius:var(--r-panel);background:var(--card)}
.au-template-head{display:flex;flex-direction:column;gap:5px}
.au-template-head strong{font-weight:600;font-size:15px;color:var(--ink)}
.au-template-when,.au-template-count{font-size:12px;color:var(--ink-3)}
.au-template-desc{flex:1;margin:0;color:var(--ink-2);font-size:13px;line-height:1.6}
.au-template-foot{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.au-hero-other{margin-top:22px;font-size:13px;color:var(--ink-2)}
.au-hero-other a{text-decoration:underline;text-underline-offset:3px}
.au-section-title{margin:32px 0 16px;font-size:16px;font-weight:600;color:var(--ink)}
.automation-page .au-row{display:grid;grid-template-columns:minmax(220px,1.6fr) minmax(150px,1.2fr) minmax(130px,1fr) 110px 32px;align-items:center;gap:16px}
.automation-page .automation-list-row.au-row{height:auto;min-height:66px;padding:12px 14px}
.au-name{display:flex;align-items:center;gap:9px;min-width:0;color:var(--ink);text-decoration:none}
.au-name strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.au-state{color:var(--ink-3);font-size:11px;white-space:nowrap}
.au-when{font-size:13px;color:var(--ink-2);line-height:1.5}
.au-last-link{display:flex;align-items:center;gap:7px;font-size:12px;color:var(--ink-2)}
.au-await-chip{display:inline-flex;align-items:center;min-height:30px;padding:3px 9px;border:1px solid var(--line-2);border-radius:var(--r-pill);color:var(--ink);font-size:12px;white-space:nowrap}
.au-menu{position:relative;justify-self:end}
.au-menu summary{display:flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:var(--r-sm);cursor:pointer;list-style:none;font-size:20px}
.au-menu summary::-webkit-details-marker{display:none}
.au-menu[open] summary,.au-menu summary:hover{background:var(--paper-2)}
.au-menu-list{position:absolute;right:0;top:36px;z-index:20;min-width:195px;padding:5px;border:1px solid var(--line);border-radius:var(--r-panel);background:var(--card);box-shadow:var(--shadow-1)}
.au-menu-list :is(a,button){display:block;width:100%;padding:9px 10px;border:0;background:none;text-align:left;font:inherit;font-size:13px;color:var(--ink);text-decoration:none;cursor:pointer}
.au-menu-list :is(a,button):hover{background:var(--paper-2);border-radius:var(--r-sm)}
.au-menu-list .au-menu-danger,.au-danger{color:var(--danger)}
.au-btn{display:inline-flex;align-items:center;justify-content:center;min-height:34px;padding:7px 12px;border:1px solid var(--line-2);border-radius:var(--r-sm);background:var(--card);color:var(--ink);font:inherit;font-size:13px;cursor:pointer}
.au-btn:hover{background:var(--paper-2)}
.au-page .au-modal{width:min(940px,calc(100vw - 32px));max-height:calc(100dvh - 40px);overflow:auto}
.au-doors{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:0 0 22px}
.au-door{display:flex;flex-direction:column;gap:7px;padding:16px;border:1px solid var(--line);border-radius:var(--r-panel);text-decoration:none;color:var(--ink)}
.au-door strong{font-size:14px;font-weight:600}
.au-door span{font-size:12px;line-height:1.5;color:var(--ink-3)}
.au-door.is-on{border-color:var(--ink);background:var(--paper-2)}
.au-when-pick{display:grid;grid-template-columns:repeat(2,1fr);gap:8px;margin:20px 0;padding:0;border:0}
.au-when-pick legend{margin-bottom:10px;font-size:13px;font-weight:600;color:var(--ink)}
.au-when-option{display:flex;align-items:center;gap:9px;min-height:42px;padding:10px;border:1px solid var(--line);border-radius:var(--r-sm);font-size:13px;cursor:pointer}
.au-when-option:has(input:checked){border-color:var(--ink);background:var(--paper-2)}
.au-when-option input{accent-color:var(--ink)}
.au-notice{padding:12px 15px;border:1px solid var(--line-2);border-radius:var(--r-sm);font-size:13px;color:var(--ink);background:var(--paper-2)}
.au-dialog-text{font-size:14px;line-height:1.6;color:var(--ink-2)}
.au-sr{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.au-page :is(a,button,summary,input,textarea,select):focus-visible{outline:2px solid var(--focus);outline-offset:3px}
@media(max-width:1000px){.au-name{flex-wrap:wrap}.au-state{flex-basis:100%;padding-left:20px}.automation-page .au-row{grid-template-columns:minmax(160px,1.4fr) minmax(130px,1fr) 120px 95px 30px;gap:9px}}
@media(max-width:760px){
 .au-desk{display:none!important}.au-page .automation-content{padding:18px 12px 48px}
 .au-page .au-hero{margin:20px 0}.au-template-grid{grid-template-columns:1fr}
 .automation-page .automation-list-head.au-row{display:none}
 .automation-page .automation-list-row.au-row{grid-template-columns:1fr auto;gap:9px;padding:15px 12px}
 .au-name{grid-column:1}.au-state{flex-basis:auto;padding-left:0}
 .au-when,.au-last{grid-column:1}.au-await{grid-column:2;grid-row:2 / span 2}.au-menu{grid-column:2;grid-row:1}
 /* app.css cache la 2e colonne de l'ancienne liste : ici c'est « Quand »,
    ce qu'on vient chercher au téléphone (AU-12 A). */
 .automation-page .automation-list-row.au-row>span.au-when{display:block}
 .au-page .au-modal{width:calc(100vw - 20px);max-height:calc(100dvh - 20px)}
 .au-doors,.au-when-pick{grid-template-columns:1fr}
}

.au-trial-summary,.au-agent-steps{display:grid;gap:.5rem;margin:1rem 0;padding-left:1.2rem}
.au-trial-report{display:grid;grid-template-columns:1fr auto;gap:.5rem 1rem;margin:1rem 0}
.au-trial-report dd{font-variant-numeric:tabular-nums;font-weight:600}
.au-rename{display:flex;align-items:center;gap:.5rem;min-width:0}
.au-rename input{min-width:0;width:16rem;border:1px solid var(--gray-5);border-radius:.25rem;padding:.25rem .5rem;background:var(--gray-1)}
@media(max-width:760px){.au-rename{display:none}}

.au-mobile{display:none}
@media(max-width:760px){.au-mobile{display:block;padding:1rem;color:var(--gray-10)}.b-wf-canvas.au-desk,.b-wf-modal.au-desk{display:none}}

.record-gantt{min-width:0;max-width:100%}.record-gantt .plan-toolbar{justify-content:flex-start}.record-gantt input[type=date]{max-width:100%;padding:6px;border:1px solid var(--line);border-radius:var(--r);background:var(--card)}.record-gantt .plan-gantt-wrap{max-width:100%}

/* ==========================================================================
   AUTOMATISATIONS — l'éditeur et le passage alignés sur le studio du 29/09
   AU-07 B (essai à blanc, puis « Activer » avec le résumé), AU-11 A (la
   modale complète, le nom en haut), AU-06 A (recherches puis réponse
   sourcée dans le déroulé), AU-12 A (suivre au téléphone).
   ========================================================================== */
/* la barre de l'éditeur : retour, nom, état, puis les seuls gestes utiles */
.au-editor-bar{display:flex;flex-wrap:wrap;align-items:center;gap:10px;min-height:52px;padding:8px 14px;border-bottom:1px solid var(--line);background:var(--card);color:var(--ink);font-family:var(--font)}
.au-back{display:inline-flex;align-items:center;gap:4px;color:var(--ink-2);font-size:13px;text-decoration:none}
.au-back:hover{color:var(--ink)}
.au-editor-bar .au-rename input{width:18rem;height:32px;padding:0 10px;border:1px solid var(--line-2);border-radius:var(--r-sm);background:var(--card);color:var(--ink);font-size:14px;font-weight:600}
.au-editor-name{font-size:14px;font-weight:600;color:var(--ink);min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.au-editor-name.au-phone{display:none}
/* l'état en mots et en forme, hors de la page liste : app.css le teinte en
   vert ; ici l'encre, le vert n'étant que dans la forme de ce qui tourne */
:is(.au-editor-bar,.au-run,[data-workflow-version]) .automation-status{display:inline-flex;align-items:center;gap:7px;font-size:12.5px;font-weight:500;white-space:nowrap;color:var(--ink)}
.au-editor-bar .b-shape,.au-run .b-shape,[data-workflow-version] .b-shape{display:inline-block;flex:none;width:10px;height:10px;position:relative;border-radius:var(--r-mark);box-shadow:inset 0 0 0 1.5px var(--ink-3)}
.au-editor-bar .automation-status.active .b-shape,.au-run .automation-status.active .b-shape,[data-workflow-version] .automation-status.active .b-shape{border-radius:50%;background:var(--signal);box-shadow:none}
.au-editor-bar .automation-status.deactivated .b-shape,[data-workflow-version] .automation-status.deactivated .b-shape{border-radius:50%;box-shadow:inset 0 0 0 1.5px var(--ink-faint)}
.au-run .automation-status.completed .b-shape{background:var(--ink);box-shadow:none}
.au-run .automation-status:is(.running,.enqueued,.not_started) .b-shape{border-radius:50%;background:var(--signal);box-shadow:none}
.au-run .automation-status.failed{color:var(--danger)}
.au-run .automation-status.failed .b-shape{box-shadow:inset 0 0 0 1.5px var(--danger)}
.au-unpublished{display:inline-flex;align-items:center;height:22px;padding:0 8px;border-radius:var(--r-pill);box-shadow:inset 0 0 0 1px var(--ink);font-size:12px;font-weight:500;color:var(--ink)}
.au-spacer{flex:1}
.au-editor-actions{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.au-btn--primary{border-color:transparent;background:var(--btn-bg,var(--ink));color:var(--btn-ink,var(--paper));font-weight:500;gap:7px}
.au-btn--primary::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--signal);flex:none}
.au-btn--primary:hover{background:color-mix(in srgb,var(--ink) 86%,var(--paper))}
.au-editor-notice{margin:10px 14px 0}
.au-canvas-hint{margin:0 auto 14px;max-width:420px;text-align:center;color:var(--ink-3);font-size:13px}
/* le « + » du bâtisseur reste visible : c'est LE geste de l'éditeur, et un
   écran tactile n'a pas de survol pour le révéler */
[data-workflow-builder] .fl-add{opacity:1}

/* la modale d'une étape : Supprimer et Dupliquer à gauche, Enregistrer à droite */
.au-modal-foot{display:flex;flex-wrap:wrap;align-items:center;gap:8px;padding-top:12px;border-top:1px solid var(--line)}
.au-modal-foot .au-save{order:3;margin-left:auto}
.au-advanced{border-top:1px solid var(--line);padding-top:10px}
.au-advanced>summary{cursor:pointer;color:var(--ink-2);font-size:13px}
.au-advanced[open]>summary{margin-bottom:10px}
.au-when-pick.au-when-pick--panel{margin:0}
.au-when-help{margin:-4px 0 0;color:var(--ink-3);font-size:12px}

/* le panneau « Vérifier avant d'activer » */
.au-activate{display:grid;gap:14px;color:var(--ink)}
.au-activate-lede{margin:0;font-size:14px;font-weight:500}
.au-summary{display:grid;gap:0;margin:0;border:1px solid var(--line);border-radius:var(--r);overflow:hidden}
.au-summary>div{display:grid;grid-template-columns:minmax(120px,160px) 1fr;gap:12px;padding:9px 12px;border-top:1px solid var(--line);font-size:13px}
.au-summary>div:first-child{border-top:0}
.au-summary dt{display:flex;align-items:center;gap:7px;color:var(--ink-3)}
.au-summary dd{margin:0;color:var(--ink)}
.au-summary .is-direct{box-shadow:inset 3px 0 0 var(--ink)}
.au-issues{padding:10px 12px;border:1px solid var(--danger);border-radius:var(--r);color:var(--danger);font-size:13px}
.au-issues ul{margin:6px 0 0;padding-left:18px}
.au-trial{display:grid;gap:8px;padding:12px;border-radius:var(--r);background:var(--paper-2)}
.au-trial-title{font-size:13px;font-weight:600}
.au-trial-line{margin:0;font-size:13px;color:var(--ink-2)}
.au-trial-answer{margin:0;padding:8px 10px;border-left:2px solid var(--line-2);color:var(--ink-2);font-size:13px;white-space:pre-wrap}
.au-trial .au-trial-report{margin:0;font-size:12.5px;color:var(--ink-2)}
.au-activate-actions{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:8px}

/* un passage : le déroulé d'abord ; au téléphone, lui seul (AU-12 A) */
.b-run-step-agent{margin-top:6px}
.b-run-step-agent .au-agent-steps{list-style:none;margin:0 0 8px;padding:0;gap:4px}
.b-run-step-agent .au-agent-steps li{display:flex;align-items:center;gap:8px;font-size:12.5px;color:var(--ink-2)}
.b-run-step-agent .ai-assistant-content{font-size:13px;color:var(--ink)}
@media(max-width:760px){
 .au-editor-bar{padding:8px 12px}
 .au-editor-name.au-phone{display:block;flex:1}
 .au-run .b-run-frise{margin:12px;max-width:none}
 .au-run-head{padding:10px 12px}
 .au-summary>div{grid-template-columns:1fr;gap:2px}
}

/* ==========================================================================
   Studio Automatisations, deuxième passe (01/10/2026) — AU-13 à AU-24.
   Mêmes jetons, même grammaire : encre pour ce qui est fait, signal pour ce
   qui bouge, rouge pour l'échec seulement.
   ========================================================================== */

/* AU-13 C : le compteur de « À valider » — une pastille d'encre */
.automation-page .automation-tabs a{display:inline-flex;align-items:center;gap:6px}
.au-tab-count{display:inline-flex;align-items:center;justify-content:center;min-width:18px;height:18px;padding:0 5px;border-radius:var(--r-pill);background:var(--ink);color:var(--paper);font-size:11px;font-weight:600;font-variant-numeric:tabular-nums}

/* AU-15 B : la semaine en une phrase */
.au-week{display:grid;gap:4px;margin:4px 0 18px}
.au-week-line{margin:0;font-size:15px;font-weight:500;color:var(--ink);letter-spacing:-.005em}
.au-week-next{margin:0;font-size:13px;color:var(--ink-3)}

/* AU-14 B : ce qu'Escouade fait déjà, en lecture seule */
.au-system{margin:0 0 18px;padding:12px 14px;border:1px solid var(--line);border-radius:var(--r);background:var(--card)}
.au-hero .au-system{max-width:640px;margin:0 0 28px}
.au-system-head{display:flex;align-items:center;gap:10px;margin-bottom:6px}
.au-system-head h2{margin:0;font-size:13.5px;font-weight:600;color:var(--ink)}
.au-lock{padding:0 6px;border:1px dashed var(--line-2);border-radius:var(--r-sm);font-size:11px;color:var(--ink-3)}
.au-system-list{margin:0;padding:0;list-style:none}
.au-system-row{display:flex;align-items:center;gap:9px;min-height:34px;border-top:1px solid var(--line);color:var(--ink);font-size:13px;text-decoration:none}
.au-system-list li:first-child .au-system-row{border-top:0}
.au-system-row:hover .au-system-name{text-decoration:underline;text-underline-offset:3px}
.au-system-name{flex:1;min-width:0}
.au-system-last{color:var(--ink-3);font-size:12px;white-space:nowrap}
.au-system-mark{display:inline-block;flex:none;width:7px;height:7px;border-radius:50%;background:var(--signal)}
.au-system-mark.is-busy{animation:b-auto-ring var(--d-pulse,2200ms) var(--out) infinite}
.au-system-mark.is-failing{border-radius:1.5px;background:transparent;box-shadow:inset 0 0 0 1.5px var(--danger)}

/* AU-21 C : ce qu'on valide, en lot, à cocher */
.au-empty-validate{max-width:560px;margin:40px auto;text-align:center}
.au-empty-title{margin:0 0 6px;font-size:16px;font-weight:600;color:var(--ink)}
.au-batch{margin:0 0 16px;border:1px solid var(--line);border-radius:var(--r-panel);background:var(--card)}
.au-batch-head{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 12px;padding:12px 14px 8px}
.au-batch-title{margin:0;font-size:15px;font-weight:600;color:var(--ink)}
.au-batch-meta{font-size:12.5px;color:var(--ink-3)}
.au-batch-meta a{color:var(--ink-2);text-decoration:underline;text-underline-offset:3px}
.au-batch-list{margin:0;padding:0;list-style:none}
.au-pending{border-top:1px solid var(--line)}
.au-pending-row{display:flex;align-items:center;gap:12px;padding:10px 14px}
.au-pending-check input{width:16px;height:16px;accent-color:var(--ink)}
.au-pending-text{display:grid;flex:1;min-width:0;gap:2px}
.au-pending-text strong{overflow:hidden;font-size:13.5px;font-weight:500;color:var(--ink);text-overflow:ellipsis;white-space:nowrap}
.au-pending-sub{margin:0;overflow:hidden;font-size:12px;color:var(--ink-3);text-overflow:ellipsis;white-space:nowrap}
.au-pending-actions{display:flex;flex:none;gap:6px}
.au-draft{padding:0 14px 10px 42px}
.au-draft>summary{cursor:pointer;color:var(--ink-2);font-size:12.5px}
.au-draft[open]>summary{margin-bottom:10px}
.au-draft-form{display:grid;gap:10px;max-width:720px}
.au-draft-form .automation-field{display:grid;gap:4px}
.au-draft-form .automation-field>span{font-size:12.5px;font-weight:500;color:var(--ink)}
.au-draft-form :is(input,textarea){width:100%;padding:7px 9px;border:1px solid var(--line-2);border-radius:var(--r-sm);background:var(--card);color:var(--ink);font:inherit;font-size:13px}
.au-draft-form .au-btn{justify-self:start}
.au-draft-body{margin:0;white-space:pre-wrap;font:inherit;font-size:13px;color:var(--ink-2)}
.au-batch-foot{display:flex;justify-content:flex-end;padding:10px 14px;border-top:1px solid var(--line)}

/* AU-13 C : l'onglet Agents */
.au-agents-head{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px}
.au-agents-lede{margin:0;max-width:620px;font-size:13px;color:var(--ink-2)}
.au-agent-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:12px;margin:0;padding:0;list-style:none}
.au-agent{display:grid;gap:6px;padding:14px;border:1px solid var(--line);border-radius:var(--r-panel);background:var(--card)}
.au-agent-head{display:flex;align-items:center;gap:8px}
.au-agent-head strong{font-size:14px;font-weight:600;color:var(--ink)}
.au-agent-desc,.au-agent-uses{margin:0;font-size:12.5px;color:var(--ink-2)}
.au-agent-uses a{color:var(--ink);text-decoration:underline;text-underline-offset:3px}

@media(max-width:760px){
 .au-pending-row{flex-wrap:wrap}
 .au-pending-actions{width:100%;justify-content:flex-end}
 .au-draft{padding-left:14px}
 .au-pending-text strong,.au-pending-sub{white-space:normal}
}

/* AU-16 B : « J'ai compris » — trois lignes, puis les précisions à un clic */
.au-understood{display:grid;gap:14px;color:var(--ink)}
.au-understood-ask{margin:0;padding:10px 12px;border-radius:var(--r);background:var(--paper-2);color:var(--ink-2);font-size:13.5px}
.au-understood-does{margin:0;padding-left:18px}
.au-understood-form{display:grid;gap:12px}
.au-precise{margin:0;padding:0;border:0}
.au-precise legend{margin-bottom:6px;font-size:13px;font-weight:600;color:var(--ink)}
.au-chips{display:flex;flex-wrap:wrap;gap:6px}
.au-chip{display:inline-flex;align-items:center;min-height:30px;padding:3px 11px;border:1px solid var(--line-2);border-radius:var(--r-pill);background:var(--card);color:var(--ink);font:inherit;font-size:12.5px;cursor:pointer}
.au-chip:hover{background:var(--paper-2)}
.au-chip.is-on{border-color:var(--ink);background:var(--ink);color:var(--paper)}

/* AU-17 B : l'éditeur en colonne de cartes, le diagramme à un clic */
.au-view-switch{display:inline-flex;gap:2px;margin:0 0 16px;padding:2px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--card)}
.au-view-switch a{padding:5px 12px;border-radius:calc(var(--r-sm) - 2px);color:var(--ink-2);font-size:12.5px;font-weight:500;text-decoration:none}
.au-view-switch a.is-on{background:var(--ink);color:var(--paper)}
.au-cards{display:flex;flex-direction:column;gap:0;max-width:560px;margin:0 auto;font-family:var(--font)}
.au-cards-flow{display:flex;flex-direction:column;align-items:stretch;padding-left:14px;border-left:1px solid var(--line-2);margin-left:14px}
.au-card{display:grid;gap:3px;padding:10px 12px;border:1px solid var(--line);border-radius:var(--r);background:var(--card);color:var(--ink);text-decoration:none}
.au-card:hover{border-color:var(--line-2)}
.au-card.is-selected{border-color:var(--ink);box-shadow:0 0 0 1px var(--ink)}
.au-card.is-direct{box-shadow:inset 3px 0 0 var(--ink)}
.au-card--when{background:var(--paper-2)}
.au-card-kicker{display:flex;align-items:center;gap:6px;font-size:11.5px;color:var(--ink-3)}
.au-card-title{font-size:13.5px;font-weight:600}
.au-card-detail{font-size:12.5px;color:var(--ink-2)}
.au-card-change{margin-left:auto;padding:0 7px;border-radius:var(--r-pill);box-shadow:inset 0 0 0 1px var(--ink);color:var(--ink);font-size:11px;font-weight:500}
.au-card-nest{display:flex;flex-direction:column;margin:6px 0 0 18px;padding-left:12px;border-left:1px dashed var(--line-2)}
.au-card-branch{margin:2px 0 6px;font-size:11.5px;font-weight:600;color:var(--ink-2)}
.au-card-plus{display:flex;align-items:center;justify-content:center;align-self:center;width:24px;height:24px;margin:6px 0;border:1px solid var(--line-2);border-radius:50%;background:var(--card);color:var(--ink-2);font-size:15px;line-height:1;text-decoration:none}
.au-card-plus:hover{border-color:var(--ink);color:var(--ink)}
.au-cards-orphans{margin-top:22px;padding-top:12px;border-top:1px dashed var(--line-2)}
.au-cards-orphans h3{margin:0 0 4px;font-size:13px;font-weight:600;color:var(--ink)}
.au-cards-orphans p{margin:0 0 8px;font-size:12.5px;color:var(--ink-3)}
.au-cards-orphans .au-card{margin-bottom:8px}

/* AU-18 B : les pastilles nommées, et la liste rangée par étape */
.au-pill{display:inline-flex;align-items:center;gap:4px;padding:1px 6px;border-radius:4px;background:var(--signal-soft);color:var(--ink);font-size:12px;white-space:nowrap}
.au-pill.is-unknown{background:var(--danger-soft);color:var(--danger)}
.au-pill-x{border:0;background:none;color:inherit;font:inherit;line-height:1;cursor:pointer}
.au-var-list{position:absolute;right:0;z-index:20;display:grid;width:300px;max-height:320px;margin-top:4px;padding:4px;overflow:auto;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--card);box-shadow:var(--shadow-1)}
.au-var{display:block;width:100%;padding:6px 8px 6px 18px;border:0;border-radius:4px;background:none;color:var(--ink-2);font:inherit;font-size:12.5px;text-align:left;cursor:pointer}
.au-var:hover{background:var(--paper-2);color:var(--ink)}
.au-var-group{margin-top:4px;padding-left:8px;color:var(--ink);font-weight:600}
.au-var-empty{padding:6px 8px;font-size:12.5px;color:var(--ink-3)}
.au-tokens-switch{margin:0 0 10px;text-align:right;font-size:12px}
.au-tokens-switch a{color:var(--ink-2);text-decoration:underline;text-underline-offset:3px}

/* AU-22 C : un passage, une phrase, puis le fil replié */
.au-run-summary{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px;max-width:760px;margin:24px auto 12px;padding:14px 16px;border:1px solid var(--line);border-radius:var(--r-panel);background:var(--card);font-family:var(--font)}
.au-run-sentence{margin:0;font-size:15px;font-weight:500;color:var(--ink)}
.au-run-detail{max-width:760px;margin:0 auto 24px;font-family:var(--font)}
.au-run-detail>summary{cursor:pointer;padding:6px 2px;color:var(--ink-2);font-size:13px}
.au-run-detail .b-run-frise{margin-left:0;margin-right:0}

/* AU-23 B : une erreur, une phrase, sa fiche, son geste */
.au-run-failure{display:grid;gap:8px;max-width:760px;margin:24px auto 0;padding:14px 16px;border:1px solid var(--danger);border-radius:var(--r-panel);background:var(--danger-soft);color:var(--ink);font-family:var(--font)}
.au-run-failure-head{margin:0;font-size:15px;font-weight:600;color:var(--danger)}
.au-run-failure-advice{margin:0;font-size:13.5px;color:var(--ink)}
.au-run-failure-actions{display:flex;flex-wrap:wrap;gap:8px}
.au-run-failure-meta{margin:0;font-size:12px;color:var(--ink-3)}
.au-run-failure-cause>summary{cursor:pointer;font-size:12px;color:var(--ink-3)}
.au-run-failure-cause pre{margin:6px 0 0;padding:8px;border-radius:var(--r-sm);background:var(--card);font-family:var(--mono);font-size:11.5px;white-space:pre-wrap;word-break:break-word;color:var(--danger)}
@media(max-width:760px){.au-run-summary,.au-run-failure,.au-run-detail{margin-left:12px;margin-right:12px}}

/* AU-20 B / AU-24 C : où arrive ce que l'agent rédige, et ce que l'IA coûte */
.au-ai{display:block;margin-top:2px;font-size:11.5px;color:var(--ink-3)}
.au-settings{display:grid;gap:18px;color:var(--ink)}
.au-settings-block{display:grid;gap:8px}
.au-settings-block h3{margin:0;font-size:13.5px;font-weight:600}
.au-settings-block .automation-field{display:grid;gap:4px;max-width:260px}
.au-settings-block .automation-field>span{font-size:12.5px;font-weight:500}
.au-settings-block input[type=number],.au-settings-block input[type=text]{padding:7px 9px;border:1px solid var(--line-2);border-radius:var(--r-sm);background:var(--card);color:var(--ink);font:inherit;font-size:13px}
.au-settings-block .automation-field:has(input[type=text]){max-width:420px}
.au-settings-recipients{display:grid;gap:6px;min-width:0;margin:0;padding:0;border:0}
.au-settings-recipients legend{margin-bottom:4px;padding:0;font-size:12.5px;font-weight:500;color:var(--ink-2)}
.au-check{display:flex;align-items:center;gap:8px;font-size:13.5px}
.au-check input{width:16px;height:16px;accent-color:var(--ink)}
.au-settings-spent{margin:0;font-size:13px;color:var(--ink-2);font-variant-numeric:tabular-nums}
.au-meter{height:6px;max-width:260px;border-radius:var(--r-pill);background:var(--line)}
.au-meter span{display:block;width:var(--pct);height:100%;border-radius:var(--r-pill);background:var(--ink)}
.au-link{color:var(--ink);text-decoration:underline;text-underline-offset:3px;font-size:13px}
/* AU-21 complet : chaque brouillon s'enregistre, un envoi raté dit sa cause */
.au-draft-actions{display:flex;flex-wrap:wrap;gap:8px}
.au-pending-error{font-size:12px;color:var(--danger)}
/* AU-20 complet : « Vos automatisations » sur l'accueil du chat */
.au-home{width:100%;max-width:640px;margin:20px auto 0;text-align:left;font-family:var(--font)}
.au-home-head{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin-bottom:8px}
.au-home-head h2{margin:0;font-size:13px;font-weight:600;color:var(--ink-2)}
.au-home-list{display:grid;gap:6px;margin:0;padding:0;list-style:none}
.au-home-row{display:grid;gap:2px;padding:10px 12px;border:1px solid var(--line);border-radius:var(--r-panel);background:var(--card);color:var(--ink);text-decoration:none}
.au-home-row:hover{border-color:var(--line-2)}
.au-home-row.is-unread{border-color:var(--signal)}
.au-home-name{display:flex;align-items:center;gap:8px;font-size:13.5px;font-weight:500}
.au-home-unread{padding:1px 7px;border-radius:var(--r-pill);background:var(--signal-soft);color:var(--signal-text);font-size:11px;font-weight:600}
.au-home-excerpt{overflow:hidden;font-size:12.5px;color:var(--ink-2);text-overflow:ellipsis;white-space:nowrap}
.au-home-at{font-size:11.5px;color:var(--ink-3)}
/* T-05 (studio Cohérence) : la vue restreinte à une affaire, et la section de sa fiche */
.au-filter{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin:8px 0 4px}
.au-filter-pill{display:inline-flex;align-items:center;gap:6px;padding:3px 6px 3px 10px;border:1px solid var(--line-2);border-radius:var(--r-pill);background:var(--card);font-size:12.5px;color:var(--ink)}
.au-filter-clear{display:inline-flex;align-items:center;justify-content:center;width:18px;height:18px;border-radius:var(--r-pill);color:var(--ink-3);text-decoration:none}
.au-filter-clear:hover{background:var(--line);color:var(--ink)}
.au-affaire{display:grid;gap:10px;margin-top:20px;padding:14px 16px;border:1px solid var(--line);border-radius:var(--r-panel);background:var(--card);font-family:var(--font)}
.au-affaire-head{display:flex;align-items:baseline;justify-content:space-between;gap:12px}
.au-affaire-head h2{margin:0;font-size:13.5px;font-weight:600;color:var(--ink)}
.au-affaire-awaiting{justify-self:start}
.au-affaire-empty{margin:0;font-size:13px;color:var(--ink-3)}
.au-affaire-runs{display:grid;gap:2px;margin:0;padding:0;list-style:none}
.au-affaire-run{display:flex;align-items:center;gap:8px;padding:6px 4px;border-radius:var(--r-sm);color:var(--ink);text-decoration:none;font-size:13px}
.au-affaire-run:hover{background:var(--line)}
.au-affaire-dot{flex:none;width:8px;height:8px;border-radius:var(--r-pill);background:var(--ink-3)}
.au-affaire-dot.is-completed{background:var(--ink)}
.au-affaire-dot.is-failed{background:var(--danger)}
.au-affaire-dot.is-running{background:var(--signal)}
.au-affaire-name{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.au-affaire-meta{flex:none;font-size:12px;color:var(--ink-3)}
.au-affaire-listening{margin:0;font-size:12.5px;color:var(--ink-2)}
.au-affaire-listening a{color:var(--ink)}
/* Le dernier compte rendu de vérification de contexte (05/10/2026) : lu par
   tout lecteur de l'affaire, replié dans la section. */
.au-affaire-check{display:grid;gap:6px;padding:8px 10px;border:1px solid var(--line);border-radius:var(--r-sm)}
.au-affaire-check-head{display:flex;align-items:baseline;gap:8px;margin:0;font-size:13px}
.au-affaire-check-head .au-affaire-name{color:var(--ink);font-weight:600;text-decoration:none}
.au-affaire-check-body summary{cursor:pointer;font-size:12.5px;color:var(--ink-2)}
.au-affaire-check-text{display:grid;gap:8px;margin-top:8px;font-size:13px;line-height:1.5;color:var(--ink);overflow-wrap:anywhere}
.au-affaire-check-page{max-width:880px;margin:20px auto}
/* Studio Cohérence, parcours d : l'automatisation en échec, carte typée de « À traiter » */
.cc-auto-failure{display:grid;gap:6px;padding-left:10px;border-left:2px solid var(--danger)}
.cc-auto-failure-head{margin:0;font-size:13.5px;font-weight:600;color:var(--danger)}
.cc-auto-failure-actions{display:flex;flex-wrap:wrap;gap:12px}
.cc-link{color:var(--ink);font-size:13px;text-decoration:underline;text-underline-offset:3px}

/* Le mini-agenda du panneau de la boîte (D576) */
.b-ag-nav{display:flex;flex:none;align-items:center;gap:4px;padding:8px 14px;border-bottom:1px solid var(--line)}
.b-ag-fleche{display:inline-flex;flex:none;width:26px;height:26px;align-items:center;justify-content:center;border-radius:var(--r-sm);color:var(--ink-2)}
.b-ag-fleche:hover{background:var(--paper-2);color:var(--ink)}
.b-ag-jour{min-width:84px;text-align:center;font-size:13px;font-weight:500;color:var(--ink);white-space:nowrap}
.b-ag-auj{margin-left:auto;padding:3px 10px;border:1px solid var(--line-2);border-radius:var(--r-sm);font-size:12px;color:var(--ink);white-space:nowrap}
.b-ag-auj:hover{background:var(--paper-2)}
.b-ag-auj.is-off{border-color:var(--line);color:var(--ink-3);cursor:default}
.b-ag-auj.is-off:hover{background:none}
.b-ag-ligne{display:flex;align-items:flex-start;gap:8px;padding:8px 14px;color:var(--ink);text-decoration:none}
a.b-ag-ligne:hover{background:var(--paper-2)}
.b-ag-teinte{flex:none;width:8px;height:8px;margin-top:5px;border-radius:2px;background:var(--ag-c,var(--ink-3))}
.b-ag-heure{flex:none;width:86px;font-size:12px;line-height:18px;color:var(--ink-2);font-variant-numeric:tabular-nums}
.b-ag-case{flex:none;width:14px;height:14px;margin-top:2px;border:1px solid var(--line-2);border-radius:3px}
.b-ag-texte{display:flex;flex:1;flex-direction:column;min-width:0}
.b-ag-titre{font-size:13px;line-height:18px;overflow-wrap:anywhere}
.b-ag-detail{overflow:hidden;font-size:11.5px;color:var(--ink-3);text-overflow:ellipsis;white-space:nowrap}
.b-ag-note{display:flex;flex:none;flex-direction:column;align-items:flex-start;gap:8px;margin:0 14px 10px;padding:10px 12px;border-radius:10px;background:var(--paper-2);font-size:12.5px;color:var(--ink-2)}
.b-ag-pied{display:flex;flex:none;flex-direction:column;gap:6px;padding:10px 14px 14px;border-top:1px solid var(--line)}
.b-ag-creer,.b-ag-ouvrir{display:inline-flex;align-items:center;justify-content:center;gap:7px;height:32px;padding:0 12px;border-radius:var(--r-sm);font-size:12.5px;font-weight:500;text-decoration:none;white-space:nowrap}
.b-ag-creer{background:var(--ink);color:var(--paper)}
.b-ag-creer:hover{opacity:.88}
.b-ag-point{flex:none;width:7px;height:7px;border-radius:50%;background:var(--btn-dot,#19C58F)}
.b-ag-ouvrir{border:1px solid var(--line-2);background:var(--card);color:var(--ink)}
.b-ag-ouvrir:hover{background:var(--paper-2)}

/* La tuile d'un agent (studio Agents) : grise, avec ses initiales */
.b-agent-tuile{display:inline-flex;flex:none;width:28px;height:28px;align-items:center;justify-content:center;border:1px solid var(--line);border-radius:8px;background:var(--paper-2);color:var(--ink-2);font-size:10.5px;font-weight:600;object-fit:cover}

/* L'application Agents (4/11, D590) : une ligne dense par agent, tuiles grises. */
.ag-page{display:flex;flex-direction:column;gap:14px;padding:18px 22px;max-width:1240px;margin:0 auto;width:100%;box-sizing:border-box}
.ag-tete{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.ag-tete h1{margin:0;font-size:20px;font-weight:600;color:var(--ink)}
.ag-sp{flex:1}
.ag-muet{color:var(--ink-2);font-size:12.5px}
.ag-erreur{color:var(--danger,#b4231a)}
.ag-tuile{display:inline-flex;align-items:center;justify-content:center;flex:none;width:32px;height:32px;border-radius:8px;background:var(--paper-2);border:1px solid var(--line);color:var(--ink-2);font-size:12px;font-weight:600}
img.ag-tuile{object-fit:cover}
.ag-t{display:flex;flex-direction:column;min-width:0;flex:1 1 280px}
.ag-t a{color:var(--ink);text-decoration:none}
.ag-t span{color:var(--ink-2);font-size:12.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ag-ariane{font-size:12px;color:var(--ink-2)}
.ag-ariane a{color:var(--ink-2)}
.ag-bilan{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:10px}
.ag-bilan>*{display:flex;flex-direction:column;gap:2px;padding:12px 14px;border:1px solid var(--line);border-radius:10px;text-decoration:none;color:inherit;background:var(--paper)}
.ag-bilan a:hover{background:var(--paper-2)}
.ag-bilan .l{font-size:12px;color:var(--ink-2)}
.ag-bilan .v{font-size:22px;font-weight:600;color:var(--ink);font-variant-numeric:tabular-nums}
.ag-bilan .d{font-size:12px;color:var(--ink-2)}
.ag-onglets{display:flex;gap:4px;flex-wrap:wrap;border-bottom:1px solid var(--line)}
.ag-onglets a{padding:7px 10px;font-size:13px;color:var(--ink-2);text-decoration:none;border-bottom:2px solid transparent;margin-bottom:-1px}
.ag-onglets a.on{color:var(--ink);border-bottom-color:var(--ink);font-weight:500}
.ag-onglets .n{margin-left:6px;font-size:11.5px;color:var(--ink-2);font-variant-numeric:tabular-nums}
.ag-liste,.ag-table{border:1px solid var(--line);border-radius:10px;overflow:auto;background:var(--paper);flex-shrink:0}
.ag-liste ul{list-style:none;margin:0;padding:0}
.ag-ligne{display:grid;grid-template-columns:minmax(170px,2fr) 124px minmax(100px,1fr) minmax(96px,1fr) 130px minmax(120px,auto);gap:12px;align-items:center;padding:9px 14px;border-top:1px solid var(--line);font-size:13px}
.ag-liste ul .ag-ligne:hover{background:var(--paper-2)}
.ag-entete{border-top:0;font-size:12px;color:var(--ink-2);padding-block:7px}
.ag-c-agent{display:flex;align-items:center;gap:10px;min-width:0}
.ag-c-etat,.ag-c-der,.ag-c-mois{display:flex;flex-direction:column;gap:3px;min-width:0}
.ag-ligne small{font-size:11.5px;color:var(--ink-2)}
.ag-c-act{display:flex;justify-content:flex-end;gap:6px}
.ag-etat{font-size:12.5px;color:var(--ink-2)}
.ag-etat--travail{color:var(--ink)}
.ag-etat--accord{color:var(--ink);font-weight:500}
.ag-etat--corriger{color:var(--danger,#b4231a);font-weight:500}
.ag-jauge{display:block;height:5px;border-radius:3px;background:var(--line);overflow:hidden}
.ag-jauge i{display:block;height:100%;background:var(--ink-2)}
.ag-jauge--plein i{background:var(--danger,#b4231a)}
.ag-btn-sm{min-height:28px;padding:4px 10px;font-size:12.5px}
.ag-geste{display:inline-flex;margin:0}
.ag-vide{padding:36px;border:1px dashed var(--line-2);border-radius:10px;text-align:center}
.ag-vide h2{margin:0 0 6px;font-size:16px}
.ag-vide-filtre{padding:18px 14px;margin:0;color:var(--ink-2);font-size:13px}
.ag-accords{display:flex;flex-direction:column;gap:8px}
.ag-accords header{display:flex;align-items:center;gap:10px;flex-wrap:wrap;font-size:13px}
.ag-accord{border:1px solid var(--line);border-radius:10px;padding:12px 14px;background:var(--paper);display:flex;flex-direction:column;gap:10px}
.ag-accord-corps{font-size:13px;white-space:pre-wrap;overflow-wrap:anywhere}
.ag-accord-pied{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.ag-table table{width:100%;border-collapse:collapse;font-size:13px}
.ag-table th{text-align:left;font-weight:400;font-size:12px;color:var(--ink-2);padding:8px 12px}
.ag-table td{padding:9px 12px;border-top:1px solid var(--line);vertical-align:top}
.ag-deux{display:grid;grid-template-columns:minmax(0,2fr) minmax(260px,1fr);gap:14px;align-items:start}
.ag-pile{display:flex;flex-direction:column;gap:12px}
.ag-panneau{border:1px solid var(--line);border-radius:10px;padding:14px 16px;background:var(--paper);display:flex;flex-direction:column;gap:8px;font-size:13px}
.ag-panneau h2{margin:0;font-size:14px;font-weight:600}
.ag-panneau p{margin:0}
.ag-panneau--attend,.ag-panneau--corriger{flex-direction:row;align-items:center;justify-content:space-between}
.ag-panneau--corriger{background:color-mix(in srgb,var(--danger) 10%,var(--paper));border-color:transparent}.ag-panneau--corriger p{color:var(--ink)}.ag-panneau--corriger p::before{content:"";display:inline-block;width:7px;height:7px;margin-right:8px;vertical-align:1px;border-radius:50%;background:var(--danger)}
.ag-page [aria-busy="true"]{pointer-events:none;opacity:.7}
.ag-tete>a.au-btn:last-child{margin-left:auto}.ag-tete .ag-t>span.ag-muet{display:block;font-size:13px}
.ag-etat::before{content:"";display:inline-block;width:7px;height:7px;margin-right:6px;vertical-align:1px;border-radius:2px;box-shadow:inset 0 0 0 1.5px var(--ink-2)}.ag-etat--travail::before{background:var(--ink);box-shadow:none}.ag-etat--accord::before{background:var(--signal);box-shadow:none;border-radius:50%}.ag-etat--corriger::before{background:var(--danger);box-shadow:none;border-radius:50%}
.ag-essai-accord{border-left:3px solid var(--ink);border-radius:4px;background:var(--paper-2)}
.ag-panneau>a:not(.au-btn),.ag-kv a,.ag-rang>a:not(.au-btn){text-decoration:underline;text-underline-offset:3px;align-self:flex-start}
.ag-attend li{align-items:center}.ag-attend li>span{display:flex;flex-direction:column;gap:2px}
.ag-verrou{flex-direction:row;gap:24px;padding:22px}.ag-verrou>.ag-pile{flex:1 1 0;min-width:0;gap:10px}.ag-verrou h2{font-size:20px}.ag-verrou-apercu{flex:1 1 0;min-width:0;border:1px dashed var(--line);border-radius:10px;padding:14px;display:flex;flex-direction:column;gap:10px}.ag-verrou-apercu p{color:var(--ink-3,var(--ink-2))}@media(max-width:720px){.ag-verrou{flex-direction:column}}
.ag-panneau label{display:flex;flex-direction:column;gap:4px;font-size:12.5px;color:var(--ink-2)}
.ag-panneau input:not([type=radio]),.ag-panneau select,.ag-panneau textarea{border:1px solid var(--line-2);border-radius:6px;padding:7px 9px;background:var(--paper);color:var(--ink);font:inherit;font-size:13px;width:100%;box-sizing:border-box}
.ag-editeur{min-height:280px;line-height:1.55}
.ag-coche{display:flex!important;flex-direction:row!important;align-items:center;gap:8px;text-align:left}
.ag-rang{display:flex;align-items:flex-end;gap:10px;flex-wrap:wrap}
.ag-rang label{flex:1;min-width:150px}
.ag-rangs{list-style:none;margin:0;padding:0;display:flex;flex-direction:column}
.ag-rangs li{display:flex;align-items:baseline;gap:10px;padding:6px 0;border-top:1px solid var(--line);flex-wrap:wrap}
.ag-rangs li:first-child{border-top:0}
.ag-rangs li>span{flex:1 1 240px;min-width:0;color:var(--ink-2)}
.ag-eteint{opacity:.55}
.ag-kv{display:grid;grid-template-columns:auto 1fr;gap:6px 14px;margin:0}
.ag-kv dt{color:var(--ink-2)}
.ag-kv dd{margin:0}
.ag-aide{margin:0;padding-left:18px;line-height:1.65;color:var(--ink-2);list-style:disc}.ag-aide li{display:list-item;list-style:disc}
.ag-autonomies{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:10px}
.ag-autonomies form{margin:0}
.ag-autonomies button{width:100%;height:100%;display:flex;flex-direction:column;gap:4px;text-align:left;padding:12px 14px;border:1px solid var(--line);border-radius:10px;background:var(--paper);color:var(--ink);font:inherit;font-size:13px;cursor:pointer}
.ag-autonomies .on button{border-color:var(--ink)}
.ag-autonomies span{color:var(--ink-2);font-size:12.5px}
.ag-barres{display:flex;align-items:flex-end;gap:3px;height:110px;border-bottom:1px solid var(--line)}
.ag-barres i{flex:1;min-height:1px;background:var(--ink-2);border-radius:2px 2px 0 0}
.ag-etapes{list-style:none;display:flex;gap:14px;flex-wrap:wrap;margin:0;padding:0;font-size:13px;color:var(--ink-2)}
.ag-etapes li{display:flex;align-items:center;gap:6px}
.ag-etapes i{display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;border-radius:50%;border:1px solid var(--line-2);font-style:normal;font-size:11.5px}
.ag-etapes .on{color:var(--ink);font-weight:500}
.ag-etapes .on i{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.ag-galerie{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:10px}
.ag-modele{display:flex;flex-direction:column;gap:6px;align-items:flex-start;padding:12px 14px;border:1px solid var(--line);border-radius:10px;background:var(--paper);color:inherit;text-decoration:none;font-size:13px}
.ag-modele span,.ag-modele small{color:var(--ink-2)}
.ag-choix{display:flex;flex-direction:row!important;align-items:baseline;gap:8px;padding:5px 0}
.ag-panneau fieldset{border:0;margin:0;padding:0}
.ag-panneau legend{font-size:12.5px;color:var(--ink-2);padding:0}
@media(max-width:900px){.ag-deux{grid-template-columns:minmax(0,1fr)}.ag-entete{display:none}.ag-ligne{grid-template-columns:minmax(0,1fr) auto}.ag-c-der,.ag-c-pro,.ag-c-mois{display:none}.ag-page{padding:14px 16px}}
.ag-filtres{display:inline-flex;gap:2px;border:1px solid var(--line);border-radius:8px;padding:2px}
.ag-filtres a{padding:3px 9px;border-radius:6px;font-size:12.5px;color:var(--ink-2);text-decoration:none}
.ag-filtres a.on{background:var(--ink);color:var(--paper)}
.ag-jours{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:8px}
.ag-jours div{display:flex;flex-direction:column;gap:3px;font-size:12px;min-width:0}
.ag-jours span{color:var(--ink-2);background:var(--paper-2,rgba(0,0,0,.04));border-radius:6px;padding:3px 6px;white-space:normal;overflow-wrap:anywhere;word-break:break-word;hyphens:auto}
.ag-titre2{margin:0;font-size:14px;font-weight:600}
.ag-refus[open]{flex-basis:100%}
.ag-refus summary{list-style:none;cursor:pointer;display:inline-flex}
.ag-refus form{margin-top:8px}
.ag-refus input{flex:1;min-width:200px;border:1px solid var(--line-2);border-radius:6px;padding:5px 8px;background:var(--paper);color:var(--ink);font:inherit;font-size:13px}

.ag-accord-tete{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.ag-accord-tete b{font-size:14px;font-weight:600}
.ag-pastille{font-size:11.5px;padding:2px 9px;border-radius:999px;border:1px solid var(--line-2);color:var(--ink-2);white-space:nowrap}
.ag-fait{white-space:normal;max-width:46ch;overflow-wrap:anywhere}
.ag-panneau .ag-coche input[type=checkbox]{width:auto;flex:none;padding:0;margin:0}
@media(max-width:700px){.ag-table--exec th:nth-child(2),.ag-table--exec td:nth-child(2),.ag-table--exec th:nth-child(3),.ag-table--exec td:nth-child(3),.ag-table--exec th:nth-child(6),.ag-table--exec td:nth-child(6){display:none}.ag-table--exec .ag-fait{min-width:150px}.ag-table--exec td,.ag-table--exec th{padding:8px}}
/* Le carnet de règles : une phrase par règle (studio, `regles`). */
.b-rule-phrase{margin:0;font-size:13.5px;line-height:1.45;color:var(--ink);font-weight:500}
.b-rule-section{margin:14px 0 6px;font-size:13px;font-weight:600;color:var(--ink)}
.b-rule-section small{margin-left:8px;font-weight:400;color:var(--ink-3)}
.b-rule-quiet{color:var(--ink-3);text-decoration:underline;text-underline-offset:2px;font-size:12.5px;background:none;border:0;padding:0;cursor:pointer}
[data-rule-sentence] .bv-actions{flex-wrap:nowrap;margin-top:6px}
[data-rule-sentence] .bv-actions .bv-champ{flex:1 1 auto;min-width:0}
[data-rule-sentence] .bv-actions .bv-btn{flex:none;white-space:nowrap}
@media (max-width:600px){[data-rule-sentence] .bv-actions{flex-wrap:wrap}}

/* Fiche d'agent, comparée au studio le 5/11 */
.ag-t-nom{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.ag-t-nom .ag-etat{white-space:nowrap}.ag-tete .ag-t>span.ag-muet{white-space:normal}
.ag-menu{position:relative}.ag-menu>summary{list-style:none;cursor:pointer;letter-spacing:1px;font-weight:700}.ag-menu>summary::-webkit-details-marker{display:none}
.ag-menu-liste{position:absolute;right:0;top:calc(100% + 4px);z-index:20;min-width:170px;display:flex;flex-direction:column;background:var(--paper);border:1px solid var(--line);border-radius:8px;padding:4px;box-shadow:0 6px 18px rgba(0,0,0,.08)}
.ag-menu-liste form{margin:0;display:flex}.ag-menu-ligne{display:block;width:100%;text-align:left;background:none;border:0;padding:7px 10px;border-radius:6px;font:inherit;font-size:13px;color:var(--ink);text-decoration:none;cursor:pointer}.ag-menu-ligne:hover{background:var(--paper-2,rgba(0,0,0,.04))}
.ag-nom-desc{display:grid;grid-template-columns:minmax(0,220px) minmax(0,1fr);gap:8px}
.ag-rang:has(>.ag-seg),.ag-rang:has(>.ag-modele){align-items:center}
.ag-rang>h2+.ag-muet{font-size:12.5px}
.ag-seg{display:inline-flex;gap:2px;border:1px solid var(--line);border-radius:8px;padding:2px}.ag-seg label{display:block;cursor:pointer}.ag-seg input{position:absolute;opacity:0;width:0;height:0}.ag-seg span{display:block;padding:3px 9px;border-radius:6px;font-size:12px;color:var(--ink-2)}.ag-seg input:checked+span{background:var(--ink);color:var(--paper)}.ag-seg input:focus-visible+span{outline:2px solid var(--ink);outline-offset:1px}
.ag-panneau label.ag-modele{flex-direction:row;align-items:center;gap:6px;font-size:12px}.ag-panneau label.ag-modele input{width:170px;padding:4px 7px;font-size:12px}
.ag-aide--num,.ag-aide--num li{list-style:decimal}.ag-aide--num b{color:var(--ink);font-weight:600}.ag-petit{font-size:12px}
.ag-exemples{display:flex;flex-direction:column;gap:8px}.ag-exemple{display:flex;flex-direction:column;gap:5px;align-items:flex-start;border:1px solid var(--line);border-radius:8px;padding:10px 12px}.ag-exemple span{color:var(--ink-2);font-size:12.5px}.ag-exemple form{margin:0}
.ag-panneau--table{padding:0;gap:0;overflow:visible}.ag-panneau--table>.ag-table-tete{padding:12px 14px 8px;align-items:center}
.ag-capg{padding:8px 14px 5px;font-size:11px;letter-spacing:.05em;text-transform:uppercase;color:var(--ink-2);background:var(--paper-2,rgba(0,0,0,.03));border-top:1px solid var(--line)}.ag-capg:first-child{border-top:0;border-radius:10px 10px 0 0}
.ag-cap{display:grid;grid-template-columns:minmax(0,1fr) 140px 130px;gap:10px;align-items:center;padding:9px 14px;border-top:1px solid var(--line);font-size:13px;color:var(--ink)}.ag-cap small{display:block;color:var(--ink-2);font-size:12px;margin-top:1px}.ag-capg+.ag-cap{border-top:0}.ag-cap a{text-decoration:underline;text-underline-offset:3px}
.ag-table-tete+.ag-cap{border-top:0}
.ag-puce{display:inline-block;padding:2px 9px;border-radius:999px;background:var(--paper-2,rgba(0,0,0,.05));color:var(--ink-2);font-size:12px;text-decoration:none}.ag-puce--on{color:var(--ink);font-weight:500}.ag-puce--on::before{content:"";display:inline-block;width:6px;height:6px;margin-right:6px;vertical-align:1px;border-radius:50%;background:var(--ink)}.ag-puce--ink{background:var(--ink);color:var(--paper);font-weight:500}.ag-puce--attend{color:var(--ink)}
.ag-changer>summary{list-style:none;cursor:pointer;display:inline-block}.ag-changer>summary::-webkit-details-marker{display:none}.ag-changer form{margin-top:8px}
.ag-deux--egal{grid-template-columns:minmax(0,1fr) minmax(0,.72fr)}
.ag-autonomies b{font-size:14.5px}.ag-autonomies .on button{border-width:2px;padding:11px 13px}
.ag-ajout{display:contents}.ag-ajout>summary{list-style:none;cursor:pointer}.ag-ajout>summary::-webkit-details-marker{display:none}.ag-ajout>form{flex:1 0 100%;margin-top:8px;padding-top:10px;border-top:1px solid var(--line)}
.ag-trig{display:grid;grid-template-columns:28px minmax(0,1fr) auto;gap:12px;align-items:center;padding:11px 14px;border-top:1px solid var(--line)}.ag-table-tete+.ag-trig{border-top:0}
.ag-trig-k{width:28px;height:28px;border-radius:7px;display:flex;align-items:center;justify-content:center;background:var(--paper-2,rgba(0,0,0,.05));color:var(--ink)}
.ag-trig-t{display:flex;flex-direction:column;gap:2px;min-width:0}.ag-trig-t b{font-size:13.5px;font-weight:600}.ag-trig-t small{color:var(--ink-2);font-size:12px}.ag-trig-t small.ag-erreur{color:var(--danger,#b4231a)}
.ag-trig-g{display:flex;gap:6px;align-items:center}.ag-trig-g form{margin:0}.ag-btn-nu{border-color:transparent;background:none}
.ag-panneau .ag-jours{grid-template-columns:repeat(7,minmax(0,1fr))}.ag-jours div{border:1px solid var(--line);border-radius:8px;padding:8px;min-height:62px}.ag-jours span{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
@media (max-width:760px){.ag-cap{grid-template-columns:minmax(0,1fr) auto}.ag-cap>.ag-muet:empty{display:none}.ag-cap>.ag-petit{grid-row:2;grid-column:1/-1}.ag-nom-desc{grid-template-columns:1fr}.ag-trig{grid-template-columns:28px minmax(0,1fr)}.ag-trig-g{grid-column:2;flex-wrap:wrap}.ag-panneau .ag-jours{grid-template-columns:1fr 1fr}.ag-deux--egal{grid-template-columns:minmax(0,1fr)}}

/* Le rail de l'application Agents */
.ag-rail{display:flex;flex-direction:column;gap:1px;padding:4px 8px}
.ag-rail-l{display:flex;align-items:center;gap:9px;min-height:30px;padding:4px 8px;border-radius:7px;font-size:13.5px;color:var(--ink-2);text-decoration:none}.ag-rail-l:hover{background:var(--paper-2,rgba(0,0,0,.04));color:var(--ink)}.ag-rail-l.on{background:var(--paper);color:var(--ink);font-weight:500;box-shadow:0 0 0 1px var(--line)}.ag-rail-l .nav-lb{flex:1;min-width:0}
.ag-rail-n{font-size:11.5px;color:var(--ink-2);background:var(--paper-2,rgba(0,0,0,.05));border-radius:999px;padding:0 7px;min-width:20px;text-align:center}.ag-rail-n--ink{background:var(--ink);color:var(--paper)}
.ag-rail-t .ag-tuile{width:18px;height:18px;border-radius:5px;font-size:8.5px}
.ag-rail-p{flex:none;width:6px;height:6px;border-radius:50%;background:var(--ink)}
@media (min-width:761px){.ag-onglets--app{display:none}}

/* Plafonds et alertes */
.ag-nom-desc--egal{grid-template-columns:1fr 1fr}
.ag-bascule{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding:4px 0;margin:0;font-size:12.5px;color:var(--ink)}.ag-bascule small{font-size:12px}
.ag-sw{flex:none;position:relative;display:inline-block;width:30px;height:18px;border:0;border-radius:999px;background:var(--line-2);padding:0;cursor:pointer}.ag-sw i{position:absolute;top:2px;left:2px;width:14px;height:14px;border-radius:50%;background:var(--paper)}.ag-sw--on{background:var(--ink)}.ag-sw--on i{left:14px}.ag-sw--fixe{opacity:.5;cursor:default}.ag-sw:disabled{cursor:default;opacity:.6}
.ag-lien{list-style:none;cursor:pointer;font-size:13px;text-decoration:underline;text-underline-offset:3px;color:var(--ink)}.ag-lien::-webkit-details-marker{display:none}

/* Paramètres, IA, Agents : le tableau */
.ag-reg-bandeau{display:flex;align-items:center;gap:10px;padding:10px 14px;border:1px solid var(--line);border-radius:10px;background:var(--paper-2);font-size:13px;color:var(--ink)}.ag-reg-bandeau>div{flex:1;min-width:0}.ag-reg-point{flex:none;width:7px;height:7px;border-radius:50%;background:var(--ink-2)}
.ag-reg-cadre{border:1px solid var(--line);border-radius:10px;background:var(--paper);overflow-x:auto}
table.ag-reg{width:100%;border-collapse:collapse;font-size:13px}.ag-reg th{padding:9px 12px;text-align:left;font-size:12px;font-weight:500;color:var(--ink-2);border-bottom:1px solid var(--line)}.ag-reg td{padding:8px 12px;border-top:1px solid var(--line);vertical-align:middle}.ag-reg tbody tr:first-child td{border-top:0}
.ag-reg td a:not(.au-btn):not([aria-label]){color:var(--ink);text-decoration:underline;text-decoration-color:var(--line-2);text-underline-offset:3px}
.ag-reg .b-agent-row{border:0;background:none}.ag-reg .b-agent-row.is-sel td{background:var(--paper-2)}
.ag-reg-nom{display:flex;align-items:center;gap:8px;font-weight:500}.ag-reg-nom .ag-tuile{width:20px;height:20px;border-radius:5px;font-size:9px}
.ag-reg-g{display:flex;align-items:center;gap:4px;justify-content:flex-end}
@media (max-width:760px){.ag-reg .hm{display:none}}

.ag-prochaine{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-start;gap:4px 10px}.ag-prochaine>span:not(.ag-trig-i){flex:1 1 180px;min-width:0}.ag-trig-i{display:inline-flex;align-items:center;flex:none}.ag-prochaine>span:not(.ag-trig-i){font-size:12px}

/* Corrections vues au banc, 5/11 */
.ag-seg{flex:none;width:auto}.ag-panneau .ag-seg label{display:block;flex:none;min-width:0}
.ag-panneau .ag-rang>label.ag-modele{flex:none;min-width:0;display:inline-flex;flex-direction:row;align-items:center;gap:6px;white-space:nowrap;border:0;padding:0;background:none}.ag-panneau label.ag-modele input{width:170px;flex:none}
.ag-bilan .v.v--mot{font-size:15px;line-height:30px}
.ag-hbarres{display:flex;flex-direction:column;gap:7px}.ag-hb{display:grid;grid-template-columns:minmax(0,170px) minmax(0,1fr) 42px;gap:10px;align-items:center;font-size:12.5px}.ag-hb-t{height:6px;border-radius:3px;background:var(--paper-2,rgba(0,0,0,.05));overflow:hidden}.ag-hb-t i{display:block;height:100%;background:var(--ink-2)}.ag-hb-v{text-align:right;color:var(--ink-2);font-variant-numeric:tabular-nums}
.ag-ligne{grid-template-columns:minmax(170px,2fr) 124px minmax(100px,1fr) minmax(96px,1fr) 130px 164px}.ag-ligne>:last-child{justify-self:end}
@media(max-width:900px){.ag-ligne{grid-template-columns:minmax(0,1fr) auto}}
@media(max-width:560px){.ag-ligne>:last-child{grid-column:1/-1;justify-self:stretch}.ag-bilan{grid-template-columns:1fr 1fr}}
/* Comparaison au studio, 5/11 : Prochaines sur une ligne, Dernières actions, colonne Pour, Prêts à activer, corps de carte, conversations, propositions d'essai. */
.ag-rangs li.ag-prochaine{flex-wrap:nowrap;align-items:center;gap:10px;padding:9px 0}.ag-rangs li.ag-prochaine>b{flex:none}.ag-rangs li.ag-prochaine>span:not(.ag-trig-i){flex:1 1 0;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:12px}.ag-rangs li.ag-prochaine>small{flex:none}.ag-rangs li.ag-prochaine>.ag-geste{flex:none}
.ag-rangs li.ag-action{align-items:center;flex-wrap:nowrap;padding:9px 0}.ag-rangs li.ag-action>span:nth-child(2){flex:1 1 0;color:var(--ink);overflow-wrap:anywhere}.ag-rangs li.ag-action>small{flex:none;font-size:11.5px}.ag-rangs li.ag-action>.ag-action-point{flex:none;width:6px;height:6px;border-radius:50%;background:var(--ink-2)}
.ag-ligne{grid-template-columns:minmax(170px,2fr) 124px minmax(120px,1.4fr) minmax(96px,1fr) 130px 40px 236px}.ag-c-der .ag-der-t{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.ag-c-act{align-items:center}.ag-c-pour{display:flex;gap:2px}.ag-mandant{display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;border-radius:50%;background:var(--paper-2);border:1px solid var(--line);font-size:10px;font-weight:600;color:var(--ink-2)}.ag-btn-icone{display:inline-flex;align-items:center;padding-inline:7px}
@media(max-width:900px){.ag-ligne{grid-template-columns:minmax(0,1fr) auto}.ag-c-pour{display:none}.ag-rangs li.ag-prochaine{flex-wrap:wrap}.ag-rangs li.ag-prochaine>span:not(.ag-trig-i){flex:1 1 100%;white-space:normal}.ag-rangs li.ag-action{flex-wrap:wrap}}
.ag-prets{list-style:none;margin:0;padding:0;border:1px solid var(--line);border-radius:10px;background:var(--paper)}.ag-pret{display:flex;align-items:center;gap:10px;padding:9px 14px;border-top:1px solid var(--line);font-size:13px}.ag-pret:first-child{border-top:0}.ag-pret>.ag-t{flex:1 1 0;min-width:0}.ag-pret>small{flex:none;font-size:11.5px}
@media(max-width:560px){.ag-pret{flex-wrap:wrap}.ag-pret>.ag-t{flex:1 1 calc(100% - 44px)}.ag-pret>small{flex:1 1 auto}}
.ag-accord-corps{background:var(--paper-2);border-radius:8px;padding:10px 12px;margin:6px 0}
.ag-panneau--table{padding:0;overflow:hidden}.ag-table{width:100%;border-collapse:collapse;font-size:13px}.ag-table th{text-align:left;font-size:11.5px;font-weight:500;color:var(--ink-2);padding:9px 14px}.ag-table td{padding:9px 14px;border-top:1px solid var(--line)}.ag-table .ag-num{text-align:right;width:80px}.ag-table .ag-fin{text-align:right;width:80px}.ag-btn-large{justify-content:flex-start;width:100%;box-sizing:border-box}
.ag-puces{flex-wrap:wrap;gap:6px}.ag-puce-d{font-size:12px;padding:3px 10px;border-radius:999px;background:var(--paper-2);color:var(--ink);text-decoration:none}.ag-puce-d.on{background:var(--ink);color:var(--paper)}
.ag-rangs li.ag-prochaine>.ag-trig-i{flex:none}.ag-ligne{grid-template-columns:minmax(170px,2fr) 124px minmax(120px,1.4fr) 124px 130px 40px 236px}.ag-accord-corps{white-space:normal}.ag-accord-corps>:first-child{margin-top:0}.ag-accord-corps>:last-child{margin-bottom:0}.ag-accord-corps ul{margin:0;padding-left:18px}
@media(max-width:900px){.ag-ligne{grid-template-columns:minmax(0,1fr) auto}}
.ag-table-ex td .ag-etat,td .ag-etat{white-space:nowrap;display:inline-flex;align-items:center;gap:6px}

/* assets/b/appel.css */
/* ==========================================================================
   L'APPEL ENTRANT (D925, 5/11 ; appel_dom.rs) : la
   fenêtre posée dans <body> sur n'importe quelle page. Le CSS Tailwind est
   figé : tout est ici, sous le préfixe `appel-entrant`, avec les seuls jetons
   de l'identité B. Le bouton principal est à l'encre, avec son point vert.
   ========================================================================== */
.appel-entrant {
  position: fixed; top: 16px; right: 16px; z-index: 1000;
  width: 300px; max-width: calc(100vw - 32px); padding: 16px;
  border: 1px solid var(--line); border-radius: var(--r-md, 12px);
  background: var(--card); color: var(--ink);
  box-shadow: 0 8px 28px rgba(0, 0, 0, .18);
}
.appel-entrant-titre { margin: 0; font-size: 12px; color: var(--ink-3, var(--ink-2)); }
.appel-entrant-nom { margin: 4px 0 14px; font-size: 16px; font-weight: 600; overflow-wrap: anywhere; }
.appel-entrant-gestes { display: flex; justify-content: flex-end; gap: 8px; }
.appel-entrant-gestes button {
  display: inline-flex; align-items: center; gap: 6px; height: 34px; padding: 0 14px;
  border: 1px solid var(--line); border-radius: var(--r-sm, 8px);
  background: var(--card); color: var(--ink); font: inherit; font-size: 13px; font-weight: 500; cursor: pointer;
}
.appel-entrant-gestes button:hover { background: var(--paper-2); }
.appel-entrant-gestes button:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; }
.appel-entrant-gestes .appel-entrant-accepter { border-color: var(--ink); background: var(--ink); color: var(--card); }
.appel-entrant-gestes .appel-entrant-accepter:hover { background: var(--ink-2); }
.appel-entrant-accepter::before {
  content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--signal, #12B76A);
}

/* assets/b/affaire.css */
/* ==========================================================================
   assets/b/affaire.css — l'AFFAIRE (studio « Escouade - Affaires », décisions
   AFF-01 à AFF-10 du 2026-09-30). Écrite à la main : le moteur Tailwind n'est
   plus là, une classe utilitaire neuve serait inerte. Tout est préfixé
   `aff-` ; les jetons sont ceux de `escouade-b.css`.

   Le signal (#19c58f) ne marque que ce qui BOUGE : l'étape « En cours », le
   prochain jalon, une date proposée qui attend. Un retard est au rouge du
   texte (`--danger`), jamais au vert. Les carrés sont la matière (jalons
   passés, alertes), le rond est ce qui bouge.
   ========================================================================== */

/* ---- AFF-01 : le haut de fiche ----------------------------------------- */
.aff-band{display:flex;flex-direction:column;gap:10px;padding:16px 24px 14px;border-bottom:1px solid var(--line);background:var(--card)}
.aff-band-id,.aff-band-parties{display:flex;flex-wrap:wrap;align-items:center;gap:6px 16px;min-width:0}
.aff-status{display:inline-flex;align-items:center;gap:6px;height:22px;padding:0 9px;border-radius:var(--r-pill);background:var(--paper-2);color:var(--ink-2);font:500 12px/1 var(--font)}
.aff-status::before{content:"";width:6px;height:6px;border-radius:var(--r-mark);background:var(--ink-3)}
.aff-status.is-on{background:var(--signal-soft);color:var(--signal-text)}
.aff-status.is-on::before{border-radius:var(--r-round);background:var(--signal)}
.aff-fact,.aff-party{display:inline-flex;align-items:baseline;gap:6px;min-width:0;font-size:13px}
.aff-fact-k{color:var(--ink-3);font-size:12px;white-space:nowrap}
.aff-fact-v,.aff-party-v{color:var(--ink);font-weight:500;overflow-wrap:anywhere}
a.aff-party-v:hover{text-decoration:underline;text-underline-offset:3px}
.aff-kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;max-width:760px}
.aff-kpi{display:flex;flex-direction:column;gap:2px;min-width:0;padding:8px 10px;border-radius:var(--r-sm);box-shadow:inset 0 0 0 1px var(--line);background:var(--card)}
.aff-kpi-k{color:var(--ink-3);font-size:11.5px}
.aff-kpi-v{color:var(--ink);font:600 16px/1.2 var(--font);letter-spacing:-.01em;font-variant-numeric:tabular-nums;white-space:nowrap}
.aff-kpi-s{color:var(--ink-3);font-size:11.5px;font-variant-numeric:tabular-nums}
.aff-kpi.is-alert .aff-kpi-v{color:var(--danger)}
.aff-next{display:flex;flex-wrap:wrap;align-items:center;gap:6px 8px;font-size:13px}
.aff-next-dot{width:7px;height:7px;flex:none;border-radius:var(--r-round);background:var(--signal)}
.aff-next-v{color:var(--ink)}
a.aff-next-v:hover{text-decoration:underline;text-underline-offset:3px}
.aff-next-kind{color:var(--ink-2);font-weight:500}
.aff-next-rel{margin-left:6px;color:var(--ink-3)}

/* ---- AFF-02 : le point d'affaire ---------------------------------------- */
.aff-point{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-bottom:14px}
.aff-card{display:flex;flex-direction:column;gap:8px;min-width:0;padding:12px 14px;border-radius:var(--r);box-shadow:inset 0 0 0 1px var(--line);background:var(--card)}
.aff-card-h{display:flex;align-items:baseline;justify-content:space-between;gap:8px}
.aff-card-t{margin:0;color:var(--ink-3);font:var(--t-label);letter-spacing:var(--ls-label);text-transform:uppercase}
.aff-card-more{color:var(--ink-2);font-size:12px}
.aff-card-more:hover{color:var(--ink)}
.aff-summary{margin:0;color:var(--ink);font-size:13.5px;line-height:1.55;white-space:pre-line}
.aff-quiet{margin:0;color:var(--ink-3);font-size:13px}
.aff-ex{display:flex;flex-direction:column;margin:0;padding:0;list-style:none}
.aff-ex-r{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:baseline;gap:8px;padding:5px 0;border-bottom:1px solid var(--line);font-size:13px}
.aff-ex-r:last-child{border-bottom:0}
.aff-ex-k{color:var(--ink-3);font-size:12px}
.aff-ex-t{overflow:hidden;color:var(--ink);text-overflow:ellipsis;white-space:nowrap}
a.aff-ex-t:hover{text-decoration:underline;text-underline-offset:3px}
.aff-ex-d{color:var(--ink-3);font-size:12px;font-variant-numeric:tabular-nums}

/* ---- AFF-03 : à surveiller ---------------------------------------------- */
.aff-alerts{display:flex;flex-direction:column;gap:6px;margin:0;padding:0;list-style:none}
.aff-alert{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 8px;font-size:13px}
.aff-alert-m{width:7px;height:7px;flex:none;border-radius:var(--r-mark);background:var(--ink-3);transform:translateY(-1px)}
.aff-alert.is-high .aff-alert-m{background:var(--danger)}
.aff-alert-x{flex:1 1 180px;color:var(--ink)}
.aff-alert-p{color:var(--ink-2);font-size:12px;text-decoration:underline;text-decoration-color:var(--line-2);text-underline-offset:3px;white-space:nowrap}
.aff-alert-p:hover{color:var(--ink)}

/* ---- AFF-09 : la frise des jalons --------------------------------------- */
.aff-frise-wrap{display:flex;flex-direction:column;gap:8px;min-width:0}
.aff-frise{display:flex;margin:0;padding:4px 0 2px;overflow-x:auto;list-style:none;scrollbar-width:thin}
.aff-ms{position:relative;display:flex;flex:1 0 96px;flex-direction:column;align-items:center;gap:3px;min-width:96px;padding:0 4px;text-align:center}
.aff-ms::before{content:"";position:absolute;top:5px;right:50%;left:-50%;height:2px;background:var(--ink-2)}
.aff-ms:first-child::before{display:none}
.aff-ms:not(.is-done)::before{background:var(--line-2)}
.aff-ms-d{position:relative;z-index:1;width:12px;height:12px;border-radius:var(--r-mark);background:var(--ink-2)}
.aff-ms:not(.is-done) .aff-ms-d{border-radius:var(--r-round);background:var(--card);box-shadow:inset 0 0 0 1.5px var(--line-2)}
.aff-ms.is-next .aff-ms-d{background:var(--signal);box-shadow:var(--ring-signal)}
.aff-ms.is-late .aff-ms-d{background:var(--card);box-shadow:inset 0 0 0 2px var(--danger)}
.aff-ms-l{color:var(--ink);font-size:12px;font-weight:500;line-height:1.25}
.aff-ms-t{color:var(--ink-3);font-size:11.5px;font-variant-numeric:tabular-nums}
.aff-ms-n{color:var(--ink-3);font-size:11px}
.aff-ms.is-late .aff-ms-n,.aff-ms.is-late .aff-ms-l{color:var(--danger)}
.aff-frise-tab{margin-bottom:16px;padding:12px 14px;border-radius:var(--r);box-shadow:inset 0 0 0 1px var(--line);background:var(--card)}
.aff-props{display:flex;flex-direction:column;gap:6px;padding-top:6px;border-top:1px solid var(--line)}
.aff-props-t{margin:0;color:var(--ink-3);font-size:12px;font-weight:500}
.aff-prop{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:6px 10px;padding:6px 8px;border-radius:var(--r-sm);box-shadow:inset 0 0 0 1px var(--line);background:var(--card)}
.aff-prop-v{display:flex;flex-wrap:wrap;align-items:center;gap:6px;min-width:0;font-size:12.5px}
.aff-prop.is-band{background:repeating-linear-gradient(135deg,var(--card),var(--card) 6px,var(--paper-2) 6px,var(--paper-2) 9px)}
.aff-prop-dot{width:7px;height:7px;flex:none;border-radius:var(--r-round);background:var(--signal)}
.aff-prop-x{color:var(--ink);overflow-wrap:anywhere}
.aff-prop-a{display:flex;flex-wrap:wrap;align-items:center;gap:6px}
.aff-prop-f{display:inline-flex;align-items:center;gap:6px}
.aff-prop select,.aff-prop input[type=date]{height:26px;padding:0 6px;border:0;border-radius:var(--r-sm);background:var(--card);color:var(--ink);font:400 12.5px/1 var(--font);box-shadow:inset 0 0 0 1px var(--line-2)}

/* ---- AFF-02 : les champs sous le point d'affaire ------------------------ */
.aff-fields{border-top:1px solid var(--line);padding-top:10px}
.aff-fields-s{display:flex;align-items:center;gap:6px;padding:4px 0;color:var(--ink-2);font-size:13px;font-weight:500;cursor:pointer;list-style:none}
.aff-fields-s::-webkit-details-marker{display:none}
.aff-fields-s:hover{color:var(--ink)}
.aff-fields-c{color:var(--ink-3);transition:transform var(--d-hover)}
.aff-fields[open] .aff-fields-c{transform:rotate(90deg)}
.aff-fields-b{padding-top:6px}

/* ---- AFF-04 : un onglet vide passe en retrait ---------------------------- */
.b-rec .b-rtab.is-empty{color:var(--ink-faint)}
.b-rec .b-rtab.is-empty svg{color:var(--ink-faint)}
.b-rec .b-rtab.is-empty:hover{color:var(--ink-2)}

/* ---- AFF-05 : les onglets par étape de la liste ------------------------- */
.aff-stages{display:flex;gap:4px;padding:8px 12px;overflow-x:auto;border-bottom:1px solid var(--line);background:var(--card);scrollbar-width:thin}
.aff-stage{display:inline-flex;flex:none;align-items:center;gap:6px;height:28px;padding:0 10px;border-radius:var(--r-sm);color:var(--ink-2);font:500 13px/1 var(--font);white-space:nowrap}
.aff-stage:hover{background:var(--paper);color:var(--ink)}
.aff-stage.is-on{background:var(--ink);color:var(--paper)}
.aff-stage-n{color:var(--ink-3);font-size:12px;font-weight:400;font-variant-numeric:tabular-nums}
.aff-stage.is-on .aff-stage-n{color:color-mix(in srgb,var(--paper) 70%,transparent)}
.aff-stage:focus-visible{outline:2px solid var(--focus,var(--ink));outline-offset:2px}

/* ---- AFF-06 : l'avancement et l'alerte d'une ligne ---------------------- */
.aff-trail{display:inline-flex;flex:none;align-items:center;gap:6px;padding-right:32px}
.aff-prog{display:block;width:44px;height:5px;overflow:hidden;border-radius:3px;background:var(--paper-2)}
.aff-prog i{display:block;height:100%;background:var(--ink-2)}
.aff-pill{display:inline-grid;place-items:center;min-width:18px;height:18px;padding:0 5px;border-radius:var(--r-pill);background:var(--paper-2);color:var(--ink-2);font:600 11px/1 var(--font);font-variant-numeric:tabular-nums}
.aff-pill.is-high{background:color-mix(in srgb,var(--danger) 12%,var(--card));color:var(--danger)}

/* ---- AFF-10 : sur le téléphone, la fiche bien mise en page -------------- */
@media (max-width:1023px){
  /* La colonne de gauche s'efface au profit de ses deux moitiés : le titre
     et les actions EN HAUT, le haut de fiche et les onglets ensuite, les
     relations EN BAS — au lieu de 80 champs avant le moindre onglet. */
  .b-rec.is-affaire .b-aside{display:contents}
  .b-rec.is-affaire .b-aside-top{order:0;border-bottom:1px solid var(--line)}
  .b-rec.is-affaire main{order:1}
  .b-rec.is-affaire .b-aside-body{order:2;border-top:1px solid var(--line)}
}
@media (max-width:640px){
  .aff-band{padding:12px 16px}
  .aff-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}
  .aff-point{grid-template-columns:minmax(0,1fr)}
  .b-rec.is-affaire .b-pane{padding:14px 16px 24px}
  .b-rec.is-affaire .b-rtabs{padding:0 12px}
  .aff-ex-r{grid-template-columns:minmax(0,1fr) auto}
  .aff-ex-k{display:none}
}
@media (prefers-reduced-motion:reduce){
  .aff-fields-c{transition:none}
}

/* Le filtre d'entrée rend la vue modifiée : garder ses actions accessibles. */
@media(max-width:640px){
 .b-vbar:has(+ .aff-stages) .b-chips{flex-wrap:wrap}
}

/* assets/b/agenda.css */
/* ==========================================================================
   AGENDA (2026-10-28, C45 — Q83 ; web/src/agenda.rs) — l'agenda de la
   personne, à côté de la Boîte mail : la semaine et le jour en grille horaire,
   la liste des trente jours qui viennent, le panneau d'un événement à droite.
   Le CSS Tailwind est figé : tout ce que l'écran dessine de propre est ici,
   sous le préfixe `ag-`, avec les seuls jetons de l'identité B (aucune couleur
   en dur). La hauteur d'une heure (48 px) est celle de `agenda::HOUR_PX`.
   ========================================================================== */

/* ---- La page ------------------------------------------------------------ */
.ag-page { display: flex; flex: 1 1 0; flex-direction: column; min-width: 0; min-height: 0; height: 100%; background: var(--paper); color: var(--ink); font-family: var(--font); }
.ag-bar { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; padding: 8px 16px; border-bottom: 1px solid var(--line); }
.ag-title { display: inline-flex; align-items: center; gap: 6px; margin: 0 8px 0 0; font-size: 14px; font-weight: 600; }
.ag-period { margin-left: 4px; font-size: 14px; font-weight: 600; white-space: nowrap; }
.ag-spacer { flex: 1 1 auto; }
.ag-btn {
  display: inline-flex; flex: none; align-items: center; gap: 6px; height: 30px; padding: 0 10px;
  border: 1px solid var(--line); border-radius: var(--r-sm); background: var(--card); color: var(--ink);
  font: inherit; font-size: 13px; text-decoration: none; cursor: pointer;
}
.ag-btn:hover { background: var(--paper-2); }
.ag-btn:focus-visible { outline: none; box-shadow: var(--focus); }
.ag-btn-icon { justify-content: center; width: 30px; padding: 0; }
.ag-btn-primary { border-color: var(--ink); background: var(--ink); color: var(--paper); }
.ag-btn-primary:hover { background: var(--ink); opacity: .9; }
.ag-btn-danger { border-color: var(--danger); color: var(--danger); }
/* MEET-RDV : la prise de rendez-vous d'Escouade Meet, en tête de l'agenda. */
.ag-btn-booking svg { color: var(--signal-text); }
.ag-views { display: inline-flex; overflow: hidden; border: 1px solid var(--line); border-radius: var(--r-sm); }
.ag-view { padding: 5px 10px; color: var(--ink-2); font-size: 13px; text-decoration: none; }
.ag-view + .ag-view { border-left: 1px solid var(--line); }
.ag-view[aria-current=page] { background: var(--paper-2); color: var(--ink); font-weight: 600; }
.ag-banner { margin: 10px 16px 0; padding: 8px 12px; border: 1px solid var(--line); border-radius: var(--r-sm); background: var(--paper-2); color: var(--ink-2); font-size: 13px; }
.ag-banner-error { border-color: var(--danger); color: var(--danger); }
.ag-legend { display: flex; flex-wrap: wrap; gap: 6px; padding: 8px 16px 0; }
.ag-legend-item { padding: 2px 8px; border-radius: 999px; background: var(--paper-2); color: var(--ink-2); font-size: 12px; }
.ag-legend-item.is-mine { background: var(--signal-soft); color: var(--ink); }
.ag-body { display: flex; flex: 1 1 0; min-height: 0; }
.ag-main { display: flex; flex: 1 1 0; flex-direction: column; min-width: 0; min-height: 0; }
.ag-side { flex: none; width: 360px; overflow-y: auto; padding: 16px; border-left: 1px solid var(--line); background: var(--card); }
@media (max-width: 900px) {
  .ag-body { flex-direction: column; }
  .ag-side { width: auto; border-top: 1px solid var(--line); border-left: 0; }
}

/* ---- La grille ---------------------------------------------------------- */
.ag-head, .ag-allday, .ag-grid { display: grid; grid-template-columns: 56px repeat(var(--ag-cols, 7), minmax(0, 1fr)); }
.ag-head { border-bottom: 1px solid var(--line); }
.ag-head-day { display: flex; align-items: baseline; gap: 6px; padding: 6px 8px; border-left: 1px solid var(--line); color: var(--ink-2); font-size: 12px; text-decoration: none; }
.ag-head-day:hover { background: var(--paper-2); }
.ag-head-n { color: var(--ink); font-size: 16px; font-weight: 600; }
.ag-head-day.is-today .ag-head-n { color: var(--signal-text); }
.ag-gutter { min-width: 0; }
.ag-gutter-label { padding: 6px 6px 0 0; color: var(--ink-3); font-size: 11px; text-align: right; }
.ag-allday { min-height: 30px; border-bottom: 1px solid var(--line); }
.ag-allday-cell { display: flex; flex-direction: column; gap: 2px; min-width: 0; padding: 2px; border-left: 1px solid var(--line); }
.ag-scroll { flex: 1 1 0; min-height: 0; overflow-y: auto; }
.ag-hours { display: flex; flex-direction: column; }
.ag-hour { height: 48px; padding: 0 6px; color: var(--ink-3); font-size: 11px; text-align: right; transform: translateY(-7px); }
.ag-col {
  position: relative; height: 1152px; border-left: 1px solid var(--line);
  background-image: repeating-linear-gradient(to bottom, var(--line) 0, var(--line) 1px, transparent 1px, transparent 48px);
}
.ag-col.is-today { background-color: var(--paper-2); }
.ag-slot { position: absolute; right: 0; left: 0; height: 48px; }
.ag-slot:hover { background: var(--paper-2); }
.ag-evt {
  position: absolute; z-index: 1; display: flex; flex-direction: column; overflow: hidden; padding: 2px 6px;
  border-left: 3px solid var(--signal-text); border-radius: var(--r-sm); background: var(--signal-soft);
  color: var(--ink); font-size: 12px; line-height: 1.3; text-decoration: none;
}
.ag-evt:hover { box-shadow: var(--shadow-1); }
.ag-chip {
  display: flex; flex-direction: column; overflow: hidden; padding: 1px 6px; border-left: 3px solid var(--signal-text);
  border-radius: var(--r-sm); background: var(--signal-soft); color: var(--ink); font-size: 12px; text-decoration: none;
}
.ag-evt.is-other, .ag-chip.is-other, .ag-list-row.is-other { border-left-color: var(--ink-3); background: var(--paper-2); }
.ag-evt.is-masked, .ag-chip.is-masked, .ag-list-row.is-masked {
  background: repeating-linear-gradient(45deg, var(--paper-2), var(--paper-2) 4px, var(--card) 4px, var(--card) 8px);
  color: var(--ink-2);
}
.ag-evt.is-pending, .ag-chip.is-pending, .ag-list-row.is-pending { border-left-style: dashed; }
.ag-chip.is-deadline, .ag-list-row.is-deadline { border-left-color: var(--danger); background: var(--card); }
.ag-evt-t { overflow: hidden; font-weight: 600; text-overflow: ellipsis; white-space: nowrap; }
.ag-evt-h { overflow: hidden; color: var(--ink-2); text-overflow: ellipsis; white-space: nowrap; }
.ag-evt-who { overflow: hidden; color: var(--ink-3); font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }

/* ---- La liste ----------------------------------------------------------- */
.ag-list { padding: 8px 16px 24px; }
.ag-empty { margin: 32px 0; color: var(--ink-3); font-size: 13px; text-align: center; }
.ag-list-day { margin-top: 12px; }
.ag-list-date { margin: 0 0 6px; color: var(--ink-2); font-size: 13px; font-weight: 600; }
.ag-list-date.is-today { color: var(--signal-text); }
.ag-list-items { display: flex; flex-direction: column; gap: 4px; margin: 0; padding: 0; list-style: none; }
.ag-list-row {
  display: grid; grid-template-columns: 110px minmax(0, 1fr) auto; align-items: center; gap: 10px; padding: 6px 10px;
  border: 1px solid var(--line); border-left: 3px solid var(--signal-text); border-radius: var(--r-sm);
  background: var(--card); color: var(--ink); font-size: 13px; text-decoration: none;
}
.ag-list-row:hover { background: var(--paper-2); }
.ag-list-h { color: var(--ink-2); font-variant-numeric: tabular-nums; }
.ag-list-t { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* ---- Le panneau --------------------------------------------------------- */
.ag-panel { display: flex; flex-direction: column; gap: 10px; }
.ag-panel-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 8px; }
.ag-panel-title { margin: 0; font-size: 15px; font-weight: 600; }
.ag-subtitle { margin: 8px 0 0; color: var(--ink-2); font-size: 12px; font-weight: 600; text-transform: uppercase; letter-spacing: .03em; }
.ag-sync, .ag-hint { margin: 0; color: var(--ink-3); font-size: 12px; }
.ag-detail { margin: 0; color: var(--ink); font-size: 13px; }
.ag-detail a, .ag-links a { color: inherit; text-decoration: underline; }
.ag-pre { white-space: pre-wrap; }
.ag-form { display: flex; flex-direction: column; gap: 10px; }
.ag-row { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.ag-field { display: flex; flex-direction: column; gap: 4px; min-width: 0; color: var(--ink-2); font-size: 12px; }
.ag-field input, .ag-field textarea, .ag-field select {
  width: 100%; min-width: 0; padding: 6px 8px; border: 1px solid var(--line); border-radius: var(--r-sm);
  background: var(--paper); color: var(--ink); font: inherit; font-size: 13px;
}
.ag-field input:focus, .ag-field textarea:focus, .ag-field select:focus { outline: none; box-shadow: var(--focus); }
.ag-check { display: inline-flex; align-items: center; gap: 6px; color: var(--ink); font-size: 13px; }
.ag-actions { display: flex; gap: 8px; }
.ag-links { display: flex; flex-direction: column; gap: 4px; margin: 0; padding: 0; list-style: none; font-size: 13px; }
.ag-share-row { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.ag-share-row form { margin: 0; }
.ag-danger { margin-top: 8px; }
.ag-danger summary { list-style: none; }
.ag-danger summary::-webkit-details-marker { display: none; }
.ag-danger form { display: flex; flex-direction: column; gap: 8px; margin-top: 8px; }

/* ==========================================================================
   L'AGENDA QUI REÇOIT TOUT (2026-10-31, D39) — la liste des agendas à gauche,
   leurs teintes, la vue Mois, le retard. Les dix teintes sont celles du
   Planning (liste blanche, `agenda::COULEURS`) : une classe `ag-c-*` pose
   `--ag-c`, que la puce, le bloc et la ligne reprennent. Deux jeux de valeurs,
   lisibles sur papier clair et sur papier sombre.
   ========================================================================== */
.ag-page, .b-side-panel {
  --ag-blue: #3e63dd; --ag-sky: #0284c7; --ag-turquoise: #0d9488; --ag-green: #15803d; --ag-yellow: #a16207;
  --ag-orange: #c2410c; --ag-red: #b42318; --ag-pink: #be185d; --ag-purple: #7c3aed; --ag-gray: #6b7280;
}
:root[data-theme="dark"] .ag-page, :root[data-theme="dark"] .b-side-panel {
  --ag-blue: #8da4ef; --ag-sky: #7dd3fc; --ag-turquoise: #5eead4; --ag-green: #86efac; --ag-yellow: #fde047;
  --ag-orange: #fdba74; --ag-red: #fca5a5; --ag-pink: #f9a8d4; --ag-purple: #c4b5fd; --ag-gray: #a7abb3;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) .ag-page, :root:not([data-theme="light"]) .b-side-panel {
    --ag-blue: #8da4ef; --ag-sky: #7dd3fc; --ag-turquoise: #5eead4; --ag-green: #86efac; --ag-yellow: #fde047;
    --ag-orange: #fdba74; --ag-red: #fca5a5; --ag-pink: #f9a8d4; --ag-purple: #c4b5fd; --ag-gray: #a7abb3;
  }
}
.ag-c-blue { --ag-c: var(--ag-blue); } .ag-c-sky { --ag-c: var(--ag-sky); } .ag-c-turquoise { --ag-c: var(--ag-turquoise); }
.ag-c-green { --ag-c: var(--ag-green); } .ag-c-yellow { --ag-c: var(--ag-yellow); } .ag-c-orange { --ag-c: var(--ag-orange); }
.ag-c-red { --ag-c: var(--ag-red); } .ag-c-pink { --ag-c: var(--ag-pink); } .ag-c-purple { --ag-c: var(--ag-purple); }
.ag-c-gray { --ag-c: var(--ag-gray); }

/* Les éléments prennent la teinte de leur agenda. */
.ag-evt[class*="ag-c-"], .ag-chip[class*="ag-c-"] {
  border-left-color: var(--ag-c); background: color-mix(in srgb, var(--ag-c) 16%, var(--card));
}
.ag-list-row[class*="ag-c-"] { border-left-color: var(--ag-c); }
.ag-evt.is-other[class*="ag-c-"], .ag-chip.is-other[class*="ag-c-"] { background: color-mix(in srgb, var(--ag-c) 8%, var(--card)); }
.ag-evt.is-masked, .ag-chip.is-masked, .ag-list-row.is-masked {
  background: repeating-linear-gradient(45deg, var(--paper-2), var(--paper-2) 4px, var(--card) 4px, var(--card) 8px);
}
.ag-evt.is-late, .ag-chip.is-late, .ag-list-row.is-late { box-shadow: inset 0 0 0 1px var(--danger); }
.ag-late { color: var(--danger); }
.ag-evt-at { color: var(--ink-2); font-weight: 500; font-variant-numeric: tabular-nums; }
.ag-list-meta { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; }

/* ---- La liste des agendas ------------------------------------------------ */
.ag-cals-wrap { flex: none; width: 240px; overflow-y: auto; border-right: 1px solid var(--line); background: var(--card); }
.ag-cals-toggle { display: none; }
.ag-cals { display: flex; flex-direction: column; gap: 12px; padding: 12px 10px 24px 12px; }
.ag-cals-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.ag-cals-title { margin: 0; font-size: 13px; font-weight: 600; }
.ag-cals-sub { margin: 0 0 4px; color: var(--ink-3); font-size: 11px; font-weight: 600; text-transform: uppercase; letter-spacing: .03em; }
.ag-cals-list { display: flex; flex-direction: column; gap: 1px; margin: 0; padding: 0; list-style: none; }
.ag-cal { position: relative; display: flex; align-items: center; gap: 2px; border-radius: var(--r-sm); }
.ag-cal:hover { background: var(--paper-2); }
.ag-cal-form { display: contents; margin: 0; }
.ag-cal-toggle {
  display: flex; flex: 1 1 auto; align-items: flex-start; gap: 8px; min-width: 0; padding: 5px 6px;
  border: 0; background: none; color: var(--ink); font: inherit; font-size: 13px; text-align: left; cursor: pointer;
}
.ag-cal-toggle:focus-visible, .ag-cal-more:focus-visible, .ag-swatch:focus-visible, .ag-menu-item:focus-visible { outline: none; box-shadow: var(--focus); border-radius: var(--r-sm); }
.ag-cal-box {
  display: inline-flex; flex: none; align-items: center; justify-content: center; width: 16px; height: 16px; margin-top: 1px;
  border: 2px solid var(--ag-c); border-radius: 4px; background: var(--ag-c); color: var(--card);
}
.ag-cal.is-off .ag-cal-box { background: transparent; }
.ag-cal.is-off .ag-cal-name { color: var(--ink-2); }
.ag-cal-text { display: flex; flex-direction: column; min-width: 0; }
.ag-cal-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ag-cal-detail { overflow: hidden; color: var(--ink-3); font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.ag-cal-detail.is-error { color: var(--danger); }
.ag-cal-menu { flex: none; }
.ag-cal-more {
  display: inline-flex; align-items: center; justify-content: center; width: 26px; height: 26px; border-radius: var(--r-sm);
  color: var(--ink-3); list-style: none; cursor: pointer; opacity: 0;
}
.ag-cal-more::-webkit-details-marker { display: none; }
.ag-cal:hover .ag-cal-more, .ag-cal-menu[open] .ag-cal-more, .ag-cal-more:focus-visible { opacity: 1; }
@media (hover: none) { .ag-cal-more { opacity: 1; } }
.ag-cal-pop {
  position: absolute; z-index: 20; top: 100%; right: 0; display: flex; flex-direction: column; gap: 2px; width: 196px; padding: 6px;
  border: 1px solid var(--line); border-radius: var(--r-sm); background: var(--card); box-shadow: var(--shadow-pop);
}
.ag-menu-item {
  display: flex; align-items: center; gap: 6px; width: 100%; padding: 6px 8px; border: 0; border-radius: var(--r-sm);
  background: none; color: var(--ink); font: inherit; font-size: 13px; text-align: left; cursor: pointer;
}
.ag-menu-item:hover { background: var(--paper-2); }
.ag-swatches { display: grid; grid-template-columns: repeat(5, 1fr); gap: 6px; padding: 6px 4px 2px; border-top: 1px solid var(--line); }
.ag-swatch { width: 24px; height: 24px; padding: 0; border: 2px solid var(--card); border-radius: 50%; background: var(--ag-c); cursor: pointer; }
.ag-swatch.is-current { box-shadow: 0 0 0 2px var(--ink); }
.ag-link-btn { padding: 0; border: 0; background: none; color: var(--ink-2); font: inherit; font-size: 12px; text-decoration: underline; cursor: pointer; }

/* ---- Le mois ------------------------------------------------------------- */
.ag-month { display: flex; flex-direction: column; }
.ag-month-head, .ag-month-grid { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); }
.ag-month-head { border-bottom: 1px solid var(--line); }
.ag-month-wd { padding: 6px 8px; color: var(--ink-2); font-size: 12px; }
.ag-month-grid { flex: 1 1 auto; grid-auto-rows: minmax(110px, 1fr); }
.ag-month-cell { display: flex; flex-direction: column; gap: 2px; min-width: 0; padding: 4px; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.ag-month-cell.is-out { background: var(--paper-2); }
.ag-month-cell.is-out .ag-month-n { color: var(--ink-3); }
.ag-month-n { align-self: flex-start; min-width: 22px; padding: 1px 5px; border-radius: 999px; color: var(--ink); font-size: 12px; font-weight: 600; text-align: center; text-decoration: none; }
.ag-month-n:hover { background: var(--paper-2); }
.ag-month-cell.is-today .ag-month-n { background: var(--signal-text); color: var(--on-signal); }
.ag-month-cell .ag-chip { flex-direction: row; gap: 4px; }
.ag-month-cell .ag-chip .ag-evt-who { display: none; }
.ag-month-more { padding: 0 6px; color: var(--ink-2); font-size: 11px; text-decoration: none; }
.ag-month-more:hover { text-decoration: underline; }

@media (max-width: 900px) {
  .ag-cals-wrap { width: auto; border-right: 0; border-bottom: 1px solid var(--line); }
  .ag-cals-toggle { display: flex; align-items: center; gap: 6px; padding: 8px 16px; font-size: 13px; font-weight: 600; cursor: pointer; }
  .ag-cals { padding-top: 0; }
  .ag-cals-head { display: none; }
  .ag-month-grid { grid-auto-rows: minmax(72px, auto); }
  .ag-month-cell .ag-chip .ag-evt-at { display: none; }
  .ag-list-row { grid-template-columns: 80px minmax(0, 1fr); }
  .ag-list-meta { grid-column: 2; justify-content: flex-start; }
}

/* D80 (31/10/2026) : un compte Google qui ne liste pas ses sous-agendas invite à élargir
   son accès, sous son nom, sans rien bloquer. */
.ag-cal { flex-wrap: wrap; }
.ag-cal-invite {
  order: 3; flex-basis: 100%; margin: 0 0 4px 30px; color: var(--ink-2); font-size: 11px;
  text-decoration: underline; text-underline-offset: 2px;
}
.ag-cal-invite:hover { color: var(--ink); }
.ag-cal-invite:focus-visible { outline: none; box-shadow: var(--focus); border-radius: var(--r-sm); }

/* Le plan et le trajet d'un rendez-vous */
.ag-trajet { display: flex; flex-direction: column; gap: 8px; margin: 10px 0; }
.ag-plan { display: block; width: 100%; height: auto; border-radius: 10px; border: 1px solid var(--line); background: var(--paper-2); }
.ag-trajet-depart { display: flex; gap: 8px; align-items: flex-end; }
.ag-trajet-depart label { flex: 1; min-width: 0; }
.ag-trajet-depart .ag-btn { flex: none; width: auto; }

/* assets/b/aide.css */
/* ==========================================================================
   Escouade · identité B — l'Aide (C04, décision Q90). Écrans : /help,
   /help/articles/{slug}, /help/support, /help/tickets
   (web/src/aide.rs).

   Feuille MAISON : le CSS Tailwind est figé, aucune classe utilitaire neuve
   n'aurait d'effet. Seulement les jetons de escouade-b.css. Le vert signal
   ne marque que le geste principal (« Écrire au support ») et un service
   qui va bien ; jamais en texte.
   ========================================================================== */

.aid{display:flex;flex-direction:column;gap:20px;max-width:760px;margin:0 auto;padding:24px 20px 48px;color:var(--ink);font-size:13px}
.aid :is(a,button,input,textarea,select):focus-visible{outline:2px solid var(--ink);outline-offset:2px}
.aid-h2{margin:0;font:600 15px/1.3 var(--font);letter-spacing:-.01em}
.aid-muted{margin:0;color:var(--ink-2);font-size:13px}
.aid-lead{margin:0;color:var(--ink-2);font-size:14px;line-height:1.5}
.aid-empty{margin:0;padding:20px;border:1px dashed var(--line-2);border-radius:var(--r);color:var(--ink-2);text-align:center}
.aid-error{margin:0;padding:10px 12px;border:1px solid var(--danger);border-radius:var(--r);background:var(--danger-soft);color:var(--danger)}
.aid-section{display:flex;flex-direction:column;gap:10px}
.aid-card{display:flex;flex-direction:column;gap:10px;padding:16px;border:1px solid var(--line);border-radius:var(--r);background:var(--card)}
.aid-head{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px}

/* ---- Boutons ------------------------------------------------------------ */
.aid-btn{display:inline-flex;align-items:center;gap:6px;height:30px;padding:0 11px;border:1px solid var(--line-2);border-radius:var(--r-btn);background:var(--card);color:var(--ink);font:500 13px/1 var(--font);cursor:pointer;text-decoration:none;white-space:nowrap}
.aid-btn:hover{border-color:var(--ink-3)}
.aid-btn.aid-primary{background:var(--ink);border-color:var(--ink);color:var(--paper)}
.aid-btn.aid-primary::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--signal)}

/* ---- Recherche et articles ---------------------------------------------- */
.aid-search{display:flex;gap:8px}
.aid-search input{flex:1 1 auto;min-width:0;height:34px;padding:0 12px;border:1px solid var(--line-2);border-radius:var(--r-btn);background:var(--card);color:var(--ink);font:400 14px/1 var(--font)}
.aid-list{display:flex;flex-direction:column;margin:0;padding:0;list-style:none;border:1px solid var(--line);border-radius:var(--r);background:var(--card)}
.aid-list li+li{border-top:1px solid var(--line)}
.aid-item{display:flex;flex-direction:column;gap:3px;padding:12px 14px;color:inherit;text-decoration:none}
.aid-item:hover{background:var(--paper-2)}
.aid-item-t{font-weight:600}
.aid-article h2,.aid-article h3{margin:12px 0 0;font:600 15px/1.3 var(--font)}
.aid-article ul{margin:0;padding-left:20px}

/* ---- État des services --------------------------------------------------- */
.aid-services{display:flex;flex-direction:column;gap:6px;margin:0;padding:0;list-style:none}
.aid-service{display:flex;align-items:center;justify-content:space-between;gap:8px}
.aid-dot{display:inline-flex;align-items:center;gap:6px;color:var(--ink-2);white-space:nowrap}
.aid-dot::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--ink-3)}
.aid-dot[data-etat="ok"]::before{background:var(--signal)}
.aid-dot[data-etat="degraded"]::before{background:#d99a00}
.aid-dot[data-etat="down"]::before{background:var(--danger)}

/* ---- Formulaire et demandes ---------------------------------------------- */
.aid-form{display:flex;flex-direction:column;gap:14px}
.aid-field{display:flex;flex-direction:column;gap:6px;font-weight:500}
.aid-field :is(input[type="text"],textarea){padding:8px 10px;border:1px solid var(--line-2);border-radius:var(--r-btn);background:var(--card);color:var(--ink);font:400 13px/1.5 var(--font)}
.aid-field textarea{resize:vertical;min-height:140px}
.aid-meta{display:grid;grid-template-columns:max-content 1fr;gap:4px 12px;margin:0;color:var(--ink-2)}
.aid-meta dd{margin:0;overflow-wrap:anywhere;color:var(--ink)}
.aid-table{width:100%;border-collapse:collapse;border:1px solid var(--line);border-radius:var(--r);background:var(--card)}
.aid-table :is(th,td){padding:9px 12px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}
.aid-table th{color:var(--ink-2);font-weight:500}
.aid-table tr:last-child td{border-bottom:0}
@media (max-width:640px){.aid{padding:16px}.aid-search{flex-direction:column}}
/* HUB-AIDE-SUPPORT : le glossaire des réglages, et l'encart de l'article
   « application de confiance ». */
.aid-glossaire{display:flex;flex-direction:column;gap:8px;padding-top:12px;border-top:1px solid var(--line);scroll-margin-top:16px}
.aid-glossaire:target{outline:2px solid var(--signal);outline-offset:6px;border-radius:var(--r)}
.aid-glossaire-options{display:flex;flex-direction:column;gap:8px;margin:0}
.aid-glossaire-options dt{font-weight:600}
.aid-glossaire-options dd{margin:0;color:var(--ink-2)}
.aid-encart{display:flex;flex-direction:column;gap:6px;padding:12px 14px;border:1px solid var(--line-2);border-radius:var(--r);background:var(--paper-2)}
.aid-encart code{font:500 13px/1.4 var(--mono,ui-monospace,monospace);word-break:break-all;user-select:all}

/* assets/b/artefacts.css */
/* ==========================================================================
   LES ARTEFACTS (P11, lot 1 — 2026-10-12 ; web/src/artefacts.rs).
   La galerie `/artifacts`, la page d'un artefact, sa visionneuse en cadre
   isolé, son partage, et sa place dans une conversation (la carte d'une
   réponse, le volet à côté du fil).
   Le CSS Tailwind est figé : tout ce que ces écrans dessinent de propre est
   ici, sous le préfixe `af-`, avec les jetons de l'identité B.
   ========================================================================== */

.af-page {
  display: flex;
  flex-direction: column;
  gap: 16px;
  height: 100%;
  min-height: 0;
  overflow-y: auto;
  padding: 22px 26px 40px;
  /* Le fond de page de la Bibliothèque (2026-10-21) ; les cartes, les
     formulaires et les menus gardent le leur (`--card`). */
  background: var(--paper);
  color: var(--ink);
  font-family: var(--font);
}
.af-page-fiche { gap: 12px; }

/* ---- En-tête ------------------------------------------------------------ */
.af-head { display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; gap: 12px 20px; }
.af-head-text { display: flex; flex-direction: column; gap: 4px; min-width: 0; flex: 1 1 320px; }
.af-h1 { margin: 0; font: 600 20px/1.25 var(--font); letter-spacing: var(--ls-h2, -.02em); overflow-wrap: anywhere; }
.af-h2 { margin: 0; font: 600 14.5px/1.3 var(--font); letter-spacing: var(--ls-tight, -.01em); }
.af-sub { margin: 0; max-width: 72ch; color: var(--ink-2); font-size: 13px; line-height: 1.5; }
.af-back { display: inline-flex; align-items: center; gap: 5px; width: fit-content; color: var(--ink-2); font-size: 12.5px; text-decoration: none; }
.af-back:hover { color: var(--ink); }
.af-title-row { display: flex; align-items: center; gap: 9px; min-width: 0; }
.af-kind { display: inline-grid; place-items: center; flex: 0 0 auto; width: 28px; height: 28px; border: 1px solid var(--line); border-radius: var(--r-sm); background: var(--paper-2); color: var(--ink-2); }
.af-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 12px; margin: 0; color: var(--ink-3); font-size: 12.5px; }
.af-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.af-actions form { display: contents; }

/* ---- Boutons ------------------------------------------------------------- */
.af-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 6px; height: 30px; padding: 0 11px;
  border: 1px solid transparent; border-radius: var(--r-sm); background: transparent; color: var(--ink);
  font: 500 13px/1 var(--font); text-decoration: none; white-space: nowrap; cursor: pointer;
  transition: background var(--d-hover), border-color var(--d-hover), color var(--d-hover);
}
.af-btn-primary { border-color: var(--btn-bg); background: var(--btn-bg); color: var(--btn-ink); }
.af-btn-primary:hover { opacity: .9; }
.af-btn-ghost { border-color: var(--line-2); background: var(--card); color: var(--ink); }
.af-btn-ghost:hover { border-color: var(--ink); }
.af-icon-btn {
  display: inline-grid; place-items: center; width: 28px; height: 28px; border: 0; border-radius: var(--r-sm);
  background: transparent; color: var(--ink-2); cursor: pointer; list-style: none;
}
.af-icon-btn:hover { background: var(--paper-2); color: var(--ink); }
.af-btn:focus-visible, .af-icon-btn:focus-visible, .af-card:focus-visible, .af-tab:focus-visible, .af-chip:focus-visible {
  outline: 2px solid var(--focus, var(--ink)); outline-offset: 2px;
}
.af-danger { color: var(--danger); }

/* ---- Bandeaux, étiquettes ------------------------------------------------ */
.af-banner {
  display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; margin: 0; padding: 9px 12px;
  border: 1px solid var(--line); border-radius: var(--r-sm); background: var(--paper-2); color: var(--ink); font-size: 13px;
}
.af-banner form { display: contents; }
.af-banner-error { border-color: var(--danger); background: var(--danger-soft); color: var(--danger); }
.af-banner-version { justify-content: flex-start; }
/* Le bandeau d'accord du pont (F4, 1.11.1) : caché tant que l'îlot ne le montre
   pas — `display: flex` l'emporterait sur l'attribut `hidden`. */
.af-pont[hidden] { display: none; }
.af-pont { margin: 0 0 8px; }
.af-pont > span { display: inline-flex; align-items: center; gap: 6px; flex: 1 1 260px; }
.af-badge {
  display: inline-flex; align-items: center; gap: 4px; min-height: 20px; padding: 0 8px; border: 1px solid var(--line-2);
  border-radius: var(--r-pill); color: var(--ink-2); font-size: 11.5px; font-weight: 500; white-space: nowrap;
}
.af-badge-shared { border-color: transparent; background: var(--signal-soft); color: var(--signal-text); }
.af-note { display: flex; align-items: flex-start; gap: 7px; margin: 0; color: var(--ink-2); font-size: 12.5px; line-height: 1.45; }
.af-note svg { flex: 0 0 auto; margin-top: 1px; }
.af-note-quiet { color: var(--ink-3); font-size: 12px; }
.af-empty { margin: 0; padding: 28px 16px; border: 1px dashed var(--line-2); border-radius: var(--r-panel); color: var(--ink-2); font-size: 13.5px; text-align: center; }
.af-empty-small { padding: 12px; text-align: left; font-size: 13px; }

/* ---- Galerie -------------------------------------------------------------- */
.af-toolbar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px; }
.af-tabs { display: flex; flex-wrap: wrap; gap: 6px; }
.af-tab {
  display: inline-flex; align-items: center; height: 28px; padding: 0 12px; border: 1px solid var(--line);
  border-radius: var(--r-pill); background: var(--card); color: var(--ink-2); font-size: 12.5px; text-decoration: none;
}
.af-tab:hover { border-color: var(--line-2); color: var(--ink); }
.af-tab[aria-current="page"] { border-color: var(--ink); background: var(--ink); color: var(--paper); }
.af-search { display: flex; align-items: center; gap: 6px; }
.af-search input {
  width: min(280px, 60vw); height: 30px; padding: 0 10px; border: 1px solid var(--line-2); border-radius: var(--r-sm);
  background: var(--card); color: var(--ink); font: 400 13px/1 var(--font);
}
.af-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: 12px; }
.af-card {
  display: flex; flex-direction: column; gap: 7px; min-height: 132px; padding: 13px 14px; border: 1px solid var(--line);
  border-radius: var(--r-panel); background: var(--card); color: var(--ink); text-decoration: none;
  box-shadow: var(--shadow-1); transition: border-color var(--d-hover), transform var(--d-hover);
}
.af-card:hover { border-color: var(--ink); }
.af-card-kind { display: inline-flex; align-items: center; gap: 6px; color: var(--ink-3); font-size: 11.5px; font-weight: 500; }
.af-card-title { font: 600 14px/1.3 var(--font); letter-spacing: var(--ls-tight, -.01em); overflow-wrap: anywhere; }
.af-card-excerpt {
  display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden;
  color: var(--ink-2); font-size: 12.5px; line-height: 1.45; overflow-wrap: anywhere;
}
.af-card-foot { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; margin-top: auto; color: var(--ink-3); font-size: 11.5px; }

/* ---- Formulaires ---------------------------------------------------------- */
.af-form { display: flex; flex-direction: column; gap: 12px; padding: 16px; border: 1px solid var(--line); border-radius: var(--r-panel); background: var(--card); }
.af-form-row { display: flex; flex-wrap: wrap; gap: 12px; }
.af-field { display: flex; flex-direction: column; gap: 5px; min-width: 180px; color: var(--ink-2); font-size: 12px; font-weight: 500; }
.af-field-wide { width: 100%; }
.af-field-grow { flex: 1 1 260px; }
.af-field :is(input, select, textarea) {
  padding: 7px 10px; border: 1px solid var(--line-2); border-radius: var(--r-sm); background: var(--card);
  color: var(--ink); font: 400 13.5px/1.4 var(--font);
}
.af-field textarea { min-height: 220px; resize: vertical; font: 400 12.5px/1.5 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; tab-size: 2; }
.af-field small { color: var(--ink-3); font-weight: 400; }
.af-form-actions { display: flex; justify-content: flex-end; gap: 8px; }

/* ---- Menus (versions, autres gestes) -------------------------------------- */
.af-menu { position: relative; }
.af-menu > summary { list-style: none; }
.af-menu > summary::-webkit-details-marker { display: none; }
.af-menu-panel {
  position: absolute; z-index: 40; top: calc(100% + 6px); right: 0; display: flex; flex-direction: column; gap: 2px;
  min-width: 250px; max-height: min(420px, 70vh); overflow-y: auto; padding: 6px; border: 1px solid var(--line);
  border-radius: var(--r-btn); background: var(--card); box-shadow: var(--shadow-pop, var(--shadow-frame));
}
.af-menu-title { padding: 4px 8px; color: var(--ink-3); font-size: 11px; font-weight: 600; letter-spacing: var(--ls-label, .06em); text-transform: uppercase; }
.af-menu-item {
  display: flex; align-items: center; gap: 9px; width: 100%; min-height: 32px; padding: 0 8px; border: 0; border-radius: 6px;
  background: transparent; color: var(--ink); font: 400 13.5px/1.2 var(--font); text-align: left; text-decoration: none; cursor: pointer;
}
.af-menu-item:hover { background: var(--paper-2); }
.af-menu-item.af-danger { color: var(--danger); }
.af-menu-panel form { display: contents; }
.af-rename { display: flex !important; flex-direction: column; gap: 6px; padding: 6px 8px 8px; border-bottom: 1px solid var(--line); }
.af-rename label { display: flex; flex-direction: column; gap: 4px; color: var(--ink-3); font-size: 11.5px; }
.af-rename input { height: 30px; padding: 0 9px; border: 1px solid var(--line-2); border-radius: var(--r-sm); background: var(--card); color: var(--ink); font: 400 13px/1 var(--font); }
.af-version { display: flex; flex-direction: column; gap: 2px; padding: 6px 8px; border-radius: 6px; color: var(--ink); text-decoration: none; }
.af-version:hover { background: var(--paper-2); }
.af-version[aria-current="true"] { background: var(--paper-2); }
.af-version-n { font-size: 13px; font-weight: 500; }
.af-version-meta { color: var(--ink-3); font-size: 11.5px; }
.af-version-note { color: var(--ink-2); font-size: 12px; overflow-wrap: anywhere; }

/* ---- Partage --------------------------------------------------------------- */
.af-share { display: flex; flex-direction: column; gap: 10px; padding: 14px 16px; border: 1px solid var(--line); border-radius: var(--r-panel); background: var(--card); }
.af-share-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.af-share-form { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.af-share-form select { flex: 1 1 240px; min-width: 0; height: 30px; padding: 0 9px; border: 1px solid var(--line-2); border-radius: var(--r-sm); background: var(--card); color: var(--ink); font: 400 13px/1 var(--font); }
.af-share-list { display: flex; flex-direction: column; gap: 4px; margin: 0; padding: 0; list-style: none; }
.af-share-list li { display: flex; align-items: center; gap: 8px; padding: 5px 8px; border: 1px solid var(--line); border-radius: var(--r-sm); }
.af-share-list form { display: contents; }
.af-share-name { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 13px; }
.af-share-list .af-icon-btn { margin-left: auto; }

/* ---- La visionneuse --------------------------------------------------------- */
.af-body { display: flex; flex: 1 1 auto; flex-direction: column; gap: 10px; min-height: 0; }
/* Un seul ascenseur pour lire (Ghislain, 5/11 : « la roulette dans artefact est buguée ») : le cadre
   prend la hauteur qui reste et ne pousse plus la page. À 480 px, une fenêtre basse défilait deux
   fois : le cadre d'abord, puis la page d'un saut une fois le cadre au bout. */
.af-frame {
  flex: 1 1 0; min-height: 200px; overflow: hidden; border: 1px solid var(--line); border-radius: var(--r-panel);
  background: #fff;
}
.af-frame iframe { display: block; width: 100%; height: 100%; min-height: 0; border: 0; background: #fff; }
.af-doc { max-width: 78ch; padding: 4px 2px 24px; font-size: 14.5px; line-height: 1.6; overflow-wrap: anywhere; }
.af-doc > div { gap: 12px; font-size: inherit; }
.af-code {
  position: relative; flex: 1 1 auto; margin: 0; padding: 14px 16px; overflow: auto; border: 1px solid var(--line);
  border-radius: var(--r-panel); background: var(--paper-2); color: var(--ink);
  font: 400 12.5px/1.55 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; tab-size: 2; white-space: pre;
}
.af-code-lang { position: sticky; left: 0; display: block; margin-bottom: 8px; color: var(--ink-3); font: 600 11px/1 var(--font); letter-spacing: var(--ls-label, .06em); text-transform: uppercase; }

/* ---- Dans une conversation --------------------------------------------------- */
/* La carte d'un artefact dans une réponse : un lien qui ouvre le volet. */
.af-chip {
  display: inline-flex; align-items: center; gap: 7px; max-width: 100%; padding: 3px 10px 3px 8px; border: 1px solid var(--line-2);
  border-radius: var(--r-sm); background: var(--card); color: var(--ink); font-weight: 500; text-decoration: none;
  vertical-align: baseline; transition: border-color var(--d-hover);
}
.af-chip::before { content: ""; flex: 0 0 auto; width: 9px; height: 9px; border-radius: var(--r-mark, 2px); background: var(--ink); }
.af-chip:hover { border-color: var(--ink); }

/* Le volet : la conversation à gauche, l'artefact à droite. */
.af-split { display: flex; flex: 1 1 auto; min-width: 0; min-height: 0; }
.af-split > .ai-page-body { flex: 1 1 0; min-width: 0; margin: 0; }
.af-split > .af-volet { flex: 1.15 1 0; }
.af-volet { display: flex; flex-direction: column; min-width: 0; min-height: 0; border-left: 1px solid var(--line); background: var(--card); color: var(--ink); font-family: var(--font); }
.af-volet-head { display: flex; align-items: center; gap: 8px; min-height: 48px; padding: 8px 12px; border-bottom: 1px solid var(--line); }
.af-volet-title { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font: 600 14px/1.2 var(--font); }
.af-volet-body { display: flex; flex: 1 1 auto; flex-direction: column; gap: 8px; min-height: 0; padding: 12px; overflow-y: auto; }
.af-volet-body .af-frame { min-height: 0; }
.af-volet-body .af-frame iframe { min-height: 0; }

/* D27 (31/10) : le VOLET DE PAGE — une page de l'instance, ouverte à droite
   par un lien d'une réponse ; la page se rend sans sa coquille dans le cadre. */
.ai-volet-body { display: flex; flex: 1 1 auto; min-height: 0; background: var(--bg, var(--card)); }
.ai-volet-frame { flex: 1 1 auto; width: 100%; height: 100%; min-height: 0; border: 0; background: var(--bg, var(--card)); }
/* dans le cadre : la visionneuse d'un document occupe tout le volet */
[data-frame-shell] .gd-viewer-layer { padding: 0; background: none; }
[data-frame-shell] .gd-viewer { border: 0; border-radius: 0; box-shadow: none; }

@media (max-width: 960px) {
  .af-split { flex-direction: column; }
  .af-split > .af-volet { flex: 1 1 55%; border-left: 0; border-top: 1px solid var(--line); }
}
@media (max-width: 767px) {
  /* la tuile flottante de la coquille (36 px, à 8 px du bord) recouvre le
     début de l'en-tête : sa première ligne se décale. */
  .af-head-text > :first-child { margin-left: 38px; }
}
@media (max-width: 640px) {
  .af-page { padding: 16px 14px 32px; }
  .af-menu-panel { right: auto; left: 0; }
}

/* Les invitations extérieures (F3, 2026-11-03) : une adresse, une échéance, un journal. */
.af-invite { display: flex; flex-direction: column; gap: 8px; padding-top: 10px; border-top: 1px solid var(--line); }
.af-h3 { display: flex; align-items: center; gap: 6px; margin: 0; font: 600 13.5px/1.3 var(--font); }
.af-share-form input[type="email"] { flex: 1 1 240px; min-width: 0; height: 30px; padding: 0 9px; border: 1px solid var(--line-2); border-radius: var(--r-sm); background: var(--card); color: var(--ink); font: 400 13px/1 var(--font); }
.af-invite-list li { flex-direction: column; align-items: stretch; gap: 4px; }
.af-invite-main { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.af-invite-main form { display: contents; }
.af-invite-meta { color: var(--ink-3); font-size: 12px; }
.af-invite-active { border-color: transparent; background: var(--signal-soft); color: var(--signal-text); }
.af-invite-expired { color: var(--ink-3); }
.af-invite-revoked { border-color: transparent; background: var(--danger-soft); color: var(--danger); }
.af-btn-danger { color: var(--danger); }
.af-invite-journal summary { cursor: pointer; color: var(--ink-2); font-size: 12px; }
.af-invite-journal ol { margin: 4px 0 0; padding-left: 18px; color: var(--ink-2); font-size: 12px; line-height: 1.6; }
.af-invite-journal time { font-variant-numeric: tabular-nums; }
@media (max-width: 560px) {
  .af-invite-main .af-share-name { flex-basis: 100%; }
}

/* ---- Plein écran et onglet (HUB-DEFAUTS, D191) -------------------------------
   « Plein écran » est une ancre (#plein-ecran, #artefact-plein-ecran) : la page
   ou le volet ciblé prend toute la fenêtre, sans script ; la touche F y mène,
   Échap en sort (îlot plein_dom). La barre latérale et l'en-tête restent
   dessous, recouverts. */
.af-plein-bar { display: none; align-items: center; gap: 8px; min-height: 44px; padding: 6px 10px 6px 14px; border-bottom: 1px solid var(--line); background: var(--card); color: var(--ink); }
.af-plein-title { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font: 600 14px/1.2 var(--font); }
.af-plein-sortir { display: none; }
.af-page-fiche:target, .af-volet:target {
  position: fixed; inset: 0; z-index: 900; display: flex; flex-direction: column; gap: 0; margin: 0; padding: 0;
  max-width: none; width: auto; height: auto; border: 0; border-radius: 0; background: var(--paper, var(--card)); overflow: hidden;
}
.af-page-fiche:target > :not(.af-plein-bar):not(.af-body) { display: none; }
.af-page-fiche:target > .af-plein-bar { display: flex; }
.af-page-fiche:target > .af-body { flex: 1 1 auto; min-height: 0; padding: 0; overflow: auto; }
.af-page-fiche:target .af-frame, .af-volet:target .af-frame { min-height: 0; border: 0; border-radius: 0; }
.af-page-fiche:target .af-frame iframe, .af-volet:target .af-frame iframe { min-height: 0; height: 100%; }
.af-page-fiche:target .af-doc { margin: 0 auto; padding: 24px 20px 40px; }
.af-page-fiche:target .af-code, .af-volet:target .af-code { border: 0; border-radius: 0; }
.af-page-fiche:target .af-plein-entrer, .af-volet:target .af-plein-entrer { display: none; }
.af-page-fiche:target .af-plein-sortir, .af-volet:target .af-plein-sortir { display: inline-flex; }
.af-volet:target .af-volet-body { padding: 0; }
.af-page-plein { display: flex; flex: 1 1 auto; flex-direction: column; height: 100%; min-height: 0; gap: 0; padding: 0; max-width: none; overflow: auto; }
.af-page-plein > .af-plein-bar { display: flex; position: sticky; top: 0; z-index: 2; }
.af-page-plein > .af-body { flex: 1 1 auto; min-height: 0; }
.af-page-plein .af-frame { min-height: 0; border: 0; border-radius: 0; }
.af-page-plein .af-frame iframe { min-height: calc(100dvh - 45px); height: 100%; }
.af-page-plein .af-doc { margin: 0 auto; padding: 24px 20px 40px; }
.af-page-plein .af-code { border: 0; border-radius: 0; }
@media (max-width: 640px) {
  .af-actions .af-plein-entrer span, .af-actions .af-plein-sortir span { display: none; }
  .af-plein-bar { padding: 6px 8px; }
  .af-page-plein .af-plein-bar .af-btn span { display: none; }
}

/* assets/b/auth.css */
/* ==========================================================================
   Escouade · identité B — lot 9 : les écrans d'authentification
   (`web/src/auth.rs`, portée `.esc-auth` posée par `auth_layout`).

   Les écrans d'auth.rs passent par `CARD`, `AUTH_FIELD`, `AUTH_SUBMIT` et
   `notice()` (déjà en identité B). Cette feuille rattrape ce qui serait écrit
   à la main dans la portée — la connexion par mot de passe et la page du code
   reçu par e-mail (branche `feat/password-login-email-2fa`), écrites depuis
   `main` : les avis `bg-red-50 / bg-amber-50 / bg-green-50`, un champ sans
   `esc-field`, un bouton d'encre sans `esc-btn`. Aucune couleur en dur.
   ========================================================================== */

.esc-auth { background: var(--paper); }

/* ---- Les avis écrits à l'ancienne : le bandeau esc-banner ---------------- */
.esc-auth :is(.bg-red-50, .bg-amber-50, .bg-green-50) {
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  background-color: var(--paper-2);
  color: var(--ink);
}
.esc-auth .bg-red-50 {
  border-color: color-mix(in srgb, var(--danger) 35%, transparent);
  background-color: var(--danger-soft);
  color: var(--danger);
}
.esc-auth .bg-amber-50 {
  border-color: var(--line-2);
  box-shadow: inset 3px 0 0 var(--ink);
}
.esc-auth :is(.text-red-600, .text-red-700) { color: var(--danger); }
.esc-auth :is(.text-amber-700, .text-green-700) { color: var(--ink); }

/* ---- Un champ sans esc-field : CHAMP-A ----------------------------------- */
.esc-auth input:is([type="text"], [type="email"], [type="password"], [type="tel"], [inputmode="numeric"], :not([type])):not(.esc-field) {
  border: 1px solid var(--line-2);
  border-radius: var(--r-sm);
  background: var(--card);
  color: var(--ink);
  transition: border-color var(--d-hover), box-shadow var(--d-hover);
}
.esc-auth input:not(.esc-field)::placeholder { color: var(--ink-3); }
.esc-auth input:is([type="text"], [type="email"], [type="password"], [type="tel"], [inputmode="numeric"], :not([type])):not(.esc-field):focus {
  outline: none;
  border-color: var(--ink);
  box-shadow: var(--ring-ink);
}

/* ---- Un bouton d'encre sans esc-btn : BTN-B ------------------------------ */
.esc-auth :is(button, a).bg-gray-12:not(.esc-btn) {
  border-radius: var(--r-sm);
  background: var(--btn-bg);
  color: var(--btn-ink);
}
.esc-auth :is(button, a):focus-visible { outline: 2px solid var(--focus); outline-offset: 3px; }

/* ---- Les liens des écrans : l'encre soulignée, jamais l'accent ----------- */
.esc-auth :is(a, button).text-accent-11 { color: var(--ink); text-decoration: underline; text-underline-offset: 2px; }
.esc-auth :is(a, button).text-accent-11:hover { text-decoration-thickness: 2px; }

/* ---- « Faire confiance à cet appareil » : la case à l'encre -------------- */
.esc-auth input[type="checkbox"] { accent-color: var(--ink); width: 15px; height: 15px; }

/* ---- La carte : posée, pas flottante (Attio : clair et doux) ------------- */
.esc-auth .shadow-strong {
  border-color: var(--line);
  border-radius: var(--r-panel);
  box-shadow: var(--shadow-1);
}

/* assets/b/bienvenue.css */
/* ==========================================================================
   L'ACCUEIL GUIDÉ (2026-10-29, P17 — Q116 ; api/src/pages/bienvenue/) —
   la conversation des six étapes, la fin, la fiche courte d'un membre, le
   guide de démarrage, le parcours d'un connecteur MCP, Réglages › Fiche de
   l'entreprise, la visite en trois bulles et l'encart du guide.
   Le CSS Tailwind est figé : tout ce que l'écran dessine de propre est ici,
   sous le préfixe `bv-`, avec les seuls jetons de l'identité B.
   ========================================================================== */

/* ---- La page et l'en-tête ------------------------------------------------ */
.bv-page { width: 100%; max-width: 760px; margin: 0 auto; padding: 24px 16px 96px; color: var(--ink); font-family: var(--font); }
/* La coquille pose `tb-page` en colonne de hauteur fixe, sous un `main` qui coupe : la page défile ici. Le repère
   `position: relative` retient les `bv-sr` absolus, qui sinon rallongent le document et décalent toute la fenêtre. */
.tb-page:has(> .bv-page) { position: relative; overflow-y: auto; }
.bv-top { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; margin-bottom: 20px; }
.bv-titre { display: inline-flex; align-items: center; gap: 8px; font-size: 16px; font-weight: 600; }
.bv-marque, .bv-avatar { display: inline-flex; align-items: center; justify-content: center; width: 28px; height: 28px; border-radius: 999px; background: var(--signal-soft); color: var(--signal-text); font-size: 14px; }
.bv-etapes { display: inline-flex; flex: 1 1 200px; align-items: center; gap: 10px; color: var(--ink-2); font-size: 13px; }
.bv-etape { white-space: nowrap; }
.bv-barre { position: relative; display: inline-block; flex: 1 1 auto; min-width: 80px; height: 6px; overflow: hidden; border-radius: 999px; background: var(--paper-2); }
.bv-barre-pleine { position: absolute; inset: 0 auto 0 0; border-radius: 999px; background: var(--signal); }
.bv-sorties { display: inline-flex; flex-wrap: wrap; gap: 6px; margin-left: auto; }

/* ---- Le fil ------------------------------------------------------------- */
.bv-fil { display: flex; flex-direction: column; gap: 14px; }
.bv-msg { display: flex; align-items: flex-start; gap: 10px; }
.bv-msg-corps { flex: 1 1 auto; min-width: 0; font-size: 14px; line-height: 1.55; }
.bv-msg-corps p { margin: 0 0 6px; }
.bv-msg-moi { align-self: flex-end; max-width: 80%; padding: 8px 12px; border-radius: 14px 14px 4px 14px; background: var(--paper-2); color: var(--ink); font-size: 14px; }
.bv-avis { margin: 0 0 12px; padding: 8px 12px; border: 1px solid var(--line); border-radius: var(--r-sm); background: var(--paper-2); color: var(--ink-2); font-size: 13px; }
.bv-note { color: var(--ink-2); font-size: 12px; }
.bv-ok { color: var(--signal-text); }
.bv-erreur { color: var(--danger); }
.bv-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* ---- Les cartes et les formulaires --------------------------------------- */
.bv-carte { padding: 16px; border: 1px solid var(--line); border-radius: var(--r-sm); background: var(--card); box-shadow: var(--shadow-1); }
.bv-carte h2, .bv-carte h3 { margin: 0 0 10px; font-size: 16px; font-weight: 600; }
.bv-carte h4 { margin: 10px 0 6px; font-size: 13px; font-weight: 600; color: var(--ink-2); }
.bv-carte h4:first-child { margin-top: 0; }
.bv-faits { display: grid; grid-template-columns: max-content 1fr; gap: 4px 14px; margin: 0 0 8px; font-size: 13px; }
.bv-faits dt { color: var(--ink-2); }
.bv-faits dd { margin: 0; }
.bv-form { display: flex; flex-direction: column; gap: 10px; }
.bv-form label, .bv-form-ligne { display: flex; flex-direction: column; gap: 4px; font-size: 13px; }
.bv-form label > span, .bv-form-ligne > span { color: var(--ink-2); }
.bv-champ { width: 100%; padding: 8px 10px; border: 1px solid var(--line); border-radius: var(--r-sm); background: var(--paper); color: var(--ink); font: inherit; font-size: 14px; }
.bv-champ:focus-visible { outline: none; box-shadow: var(--focus); }
.bv-question { margin: 0; padding: 0; border: 0; }
.bv-question legend { margin-bottom: 6px; font-size: 14px; font-weight: 600; }
.bv-radio { display: flex; align-items: flex-start; gap: 8px; padding: 4px 0; font-size: 14px; }
.bv-libre { display: flex; gap: 8px; align-items: flex-end; }
.bv-libre textarea, .bv-libre input { flex: 1 1 auto; padding: 10px 12px; border: 1px solid var(--line); border-radius: var(--r-sm); background: var(--card); color: var(--ink); font: inherit; font-size: 14px; resize: vertical; }
.bv-apercu { margin: 8px 0 0; padding: 10px; overflow-x: auto; border-radius: var(--r-sm); background: var(--paper-2); font-family: var(--mono); font-size: 12px; white-space: pre-wrap; }

/* ---- Les boutons -------------------------------------------------------- */
.bv-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.bv-inline { display: inline-flex; margin: 0; }
.bv-btn {
  display: inline-flex; align-items: center; justify-content: center; min-height: 34px; padding: 0 14px;
  border: 1px solid var(--line); border-radius: 999px; background: var(--card); color: var(--ink);
  font: inherit; font-size: 13px; text-decoration: none; cursor: pointer;
}
.bv-btn:hover { background: var(--paper-2); }
.bv-btn:focus-visible, .bv-btn-lien:focus-visible { outline: none; box-shadow: var(--focus); }
.bv-btn-primaire { border-color: var(--ink); background: var(--ink); color: var(--paper); }
.bv-btn-primaire:hover { background: var(--ink); opacity: .9; }
.bv-btn-lien { padding: 0 4px; border: 0; background: none; color: var(--ink-2); font: inherit; font-size: 12px; text-decoration: underline; cursor: pointer; }

/* ---- Les listes --------------------------------------------------------- */
.bv-choix, .bv-liste, .bv-taches { margin: 0; padding: 0; list-style: none; }
.bv-choix li { padding: 6px 0; font-size: 14px; }
.bv-choix label { display: flex; align-items: flex-start; gap: 8px; cursor: pointer; }
.bv-colonnes { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 0 16px; }
.bv-liste li { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 6px; padding: 5px 0; border-bottom: 1px solid var(--line-2); font-size: 13px; }
.bv-liste li:last-child { border-bottom: 0; }
.bv-tag { margin-left: 6px; padding: 1px 6px; border-radius: 999px; background: var(--paper-2); color: var(--ink-2); font-size: 11px; }
.bv-objectifs { display: flex; flex-wrap: wrap; gap: 8px; }
.bv-grille { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 12px; }
.bv-ajout { display: flex; gap: 6px; margin-top: 10px; }
.bv-suggestions { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin-top: 8px; }

/* ---- Le guide ----------------------------------------------------------- */
.bv-guide .bv-carte + .bv-carte { margin-top: 14px; }
.bv-progression { display: flex; align-items: center; gap: 10px; margin: 8px 0 14px; font-size: 13px; }
.bv-tache { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; padding: 8px 0; border-bottom: 1px solid var(--line-2); font-size: 14px; }
.bv-tache:last-child { border-bottom: 0; }
.bv-tache-texte { flex: 1 1 auto; }
.bv-tache-texte a { color: var(--ink); }
.bv-tache.is-faite .bv-tache-texte a { color: var(--ink-2); text-decoration: line-through; }
.bv-tache.is-ignoree { opacity: .6; }
.bv-coche { width: 18px; color: var(--signal-text); text-align: center; }
.bv-reglages { display: flex; flex-direction: column; gap: 14px; }

/* ---- La visite et l'encart (sur toutes les pages, jamais ensemble) -------- */
.bv-bulle {
  position: fixed; bottom: 24px; left: 50%; z-index: 60; width: min(360px, calc(100vw - 32px)); transform: translateX(-50%);
  padding: 14px 16px; border: 1px solid var(--line); border-radius: var(--r-sm); background: var(--card); color: var(--ink);
  box-shadow: var(--shadow-pop); font-size: 14px;
}
.bv-bulle p { margin: 0 0 6px; }
.bv-encart {
  position: fixed; bottom: 16px; left: 16px; z-index: 50; display: flex; flex-direction: column; gap: 6px; width: 220px;
  padding: 10px 12px; border: 1px solid var(--line); border-radius: var(--r-sm); background: var(--card); color: var(--ink);
  box-shadow: var(--shadow-pop); font-size: 13px; text-decoration: none;
}
.bv-encart:hover { background: var(--paper-2); }
@media (max-width: 640px) {
  .bv-libre { flex-direction: column; align-items: stretch; }
  .bv-sorties { margin-left: 0; }
  .bv-encart { right: 16px; width: auto; }
}

/* assets/b/champ-liste.css */
/* Le champ à liste (champ_liste.rs) : des noms, jamais un identifiant. La liste est
   dessinée par l'îlot de la saisie ; sans lui, c'est la liste native du navigateur. */
.cl { position: relative; display: block; min-width: 0; }
.cl > input[type=text] { width: 100%; box-sizing: border-box; }
.cl-liste {
  position: absolute; z-index: 40; top: calc(100% + 4px); left: 0; right: 0;
  max-height: 240px; margin: 0; padding: 4px; overflow-y: auto; list-style: none;
  border: 1px solid var(--line); border-radius: var(--r-sm); background: var(--card); color: var(--ink);
  box-shadow: 0 8px 24px rgba(0, 0, 0, .12);
}
.cl-liste[hidden] { display: none; }
.cl-option { padding: 6px 8px; border-radius: var(--r-sm); font-size: 13px; font-weight: 400; line-height: 18px; cursor: pointer; overflow-wrap: anywhere; }
.cl-option:hover, .cl-option[aria-selected=true] { background: var(--paper-2); }
.cl-vide { padding: 6px 8px; font-size: 13px; color: var(--ink-2); }
@media (max-width: 480px) { .cl-option, .cl-vide { padding: 10px 8px; font-size: 14px; } }

/* assets/b/chat-lateral.css */
/* ==========================================================================
   LA BARRE DU HAUT ET LE CHAT LATÉRAL (2026-10-20 ; web/src/chat_lateral.rs,
   notifications.rs, app_shell.rs).
   En haut à droite de chaque page : la cloche des notifications (et le petit
   panneau de ses dernières), puis le bouton du chat latéral ; à droite de la
   zone principale, le panneau du chat, vide et masqué tant qu'on ne l'ouvre pas.
   Le CSS Tailwind est figé : tout ce que ces éléments dessinent de propre est
   ici, sous les préfixes `tb-` (la barre) et `sc-` (le panneau), avec les
   jetons de l'identité B.
   ========================================================================== */

/* ---- La barre du haut --------------------------------------------------- */
.tb-cluster { display: flex; flex: none; align-items: center; gap: 2px; margin-left: auto; }
.page-head .tb-cluster, .ai-header .tb-cluster { margin-left: 4px; }
/* L'emplacement qu'une page déclare au bout de sa barre (`app_shell::top_bar_slot`,
   2026-10-21) : la coquille remplit le premier ; un autre, resté vide, ne prend
   aucune place — ni sa marge, ni l'écart de la barre. */
[data-topbar-slot]:empty { display: none; }
/* Une page sans en-tête : sa propre rangée, en tête, à droite ; la page, dessous,
   dans une colonne qui prend la hauteur restante (`height: 100%` s'y résout). */
.tb-row {
  display: flex; flex: none; align-items: center; justify-content: flex-end;
  height: 44px; padding: 0 12px; background: var(--card);
}
.tb-page { display: flex; flex: 1 1 0; flex-direction: column; min-width: 0; min-height: 0; }
/* HUB-ENTETE-UNIQUE (D351, 2/11) : une page qui a son en-tête (l'Agenda, la
   Bibliothèque, l'ingestion…) y porte la cloche et le chat, au bout de ses
   actions — plus de barre vide au-dessus. L'emplacement s'efface
   (`display: contents`) : la grappe est un élément de plus de l'en-tête, poussée
   à droite (`margin-left: auto`). */
.tb-slot { display: contents; }
/* L'Agenda : sa barre retourne à la ligne ; au téléphone, la grappe reste sur la
   PREMIÈRE ligne, à droite du titre. */
@media (max-width: 767px) {
  /* La tuile flottante de la coquille (36 px à 8 px du bord) se posait sur le
     début de la barre du haut ; c'est l'en-tête de la page qui lui laisse sa
     place, comme `.page-head` (`b/nav.css`). */
  header:has(.tb-slot > .tb-cluster), .ag-bar:has(> .tb-slot > .tb-cluster) { padding-left: 52px; }
  .ag-bar > .ag-title { order: -2; }
  .ag-bar > .tb-slot > .tb-cluster { order: -1; }
}
.tb-btn {
  display: inline-flex; flex: none; align-items: center; justify-content: center;
  width: 32px; height: 32px; padding: 0; border: 0; border-radius: var(--r-sm);
  background: transparent; color: var(--ink-2); cursor: pointer; text-decoration: none;
  transition: background var(--d-hover, .12s), color var(--d-hover, .12s);
}
.tb-btn:hover, .tb-btn[aria-expanded="true"], .tb-pop-wrap[open] > .tb-btn { background: var(--paper-2); color: var(--ink); }
.tb-btn:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; }
.tb-chat[aria-expanded="true"] { color: var(--signal-text, var(--ink)); }

/* ---- Le panneau de la cloche -------------------------------------------- */
.tb-pop-wrap { position: relative; display: inline-flex; }
.tb-pop-wrap > summary { list-style: none; }
.tb-pop-wrap > summary::-webkit-details-marker { display: none; }
.tb-pop {
  position: absolute; top: calc(100% + 6px); right: 0; z-index: 60;
  display: flex; flex-direction: column; width: min(360px, calc(100vw - 24px)); max-height: min(460px, 70vh);
  overflow: hidden; border: 1px solid var(--line); border-radius: var(--r-panel, 12px);
  background: var(--card); color: var(--ink); box-shadow: var(--shadow-pop); font-family: var(--font);
}
/* Écran étroit (31/10, vu à 390 px sur Agenda et l'Ordre de fabrication) : calé sur
   la droite de la cloche, le panneau sortait de 4 à 16 px à gauche dès qu'un bouton
   suivait la cloche. Il prend alors la largeur de l'écran, 12 px de chaque côté ;
   sans `top`, il garde sa hauteur dans la barre (le haut de la cloche), et la marge
   le pose sous elle — quelle que soit la hauteur de l'en-tête de la page. */
@media (max-width: 640px) {
  .tb-pop { position: fixed; top: auto; right: 12px; left: 12px; width: auto; margin-top: 38px; }
}
.tb-pop-head {
  display: flex; flex: none; align-items: center; justify-content: space-between; gap: 8px;
  padding: 10px 12px; border-bottom: 1px solid var(--line);
}
.tb-pop-title { font: 600 13px/1.3 var(--font); }
.tb-pop-link { color: var(--ink-2); font-size: 12.5px; text-decoration: none; }
.tb-pop-link:hover { color: var(--ink); text-decoration: underline; }
.tb-pop-body { min-height: 0; overflow-y: auto; }
.tb-pop-count, .tb-pop-empty { margin: 0; padding: 10px 12px; font-size: 12.5px; }
.tb-pop-count { padding-bottom: 4px; color: var(--ink-3); }
.tb-pop-empty { color: var(--ink-2); }
.tb-nt-list { margin: 0; padding: 4px; list-style: none; }
.tb-nt form { margin: 0; }
.tb-nt-open {
  display: grid; grid-template-columns: 1fr auto; gap: 2px 10px; width: 100%; padding: 8px;
  border: 0; border-radius: var(--r-sm); background: transparent; color: var(--ink);
  font: inherit; text-align: left; cursor: pointer;
}
.tb-nt-open:hover { background: var(--paper-2); }
.tb-nt-open:focus-visible { outline: 2px solid var(--focus); outline-offset: -2px; }
.tb-nt-kind { grid-column: 1; color: var(--ink-3); font-size: 11.5px; }
.tb-nt-when { grid-column: 2; grid-row: 1; color: var(--ink-3); font-size: 11.5px; white-space: nowrap; }
.tb-nt-phrase { grid-column: 1 / -1; font-size: 13px; line-height: 1.4; overflow-wrap: anywhere; }
.tb-nt[data-unread] .tb-nt-phrase { font-weight: 600; }
/* Le second lien d'une notification (D19, 30/10/2026) : discret, sous la phrase. */
.tb-nt .tb-nt-second { padding: 0 8px 6px; }
.tb-nt-second-open {
  padding: 0; border: 0; background: transparent; color: var(--ink-2);
  font: inherit; font-size: 12px; text-decoration: underline; cursor: pointer;
}
.tb-nt-second-open:hover { color: var(--ink); }
.tb-nt-second-open:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; }
.tb-nt[data-unread] .tb-nt-kind::before {
  content: ""; display: inline-block; width: 6px; height: 6px; margin-right: 6px;
  border-radius: 50%; background: var(--signal); vertical-align: 1px;
}

/* ---- Le chat latéral ---------------------------------------------------- */
/* Sa largeur, `--sc-w`, se règle à la poignée (C31, 1.13.25) : la coquille la
   rend sur sa RANGÉE depuis la préférence du membre (`profile.sideChatWidth`,
   320 à 720 px), et le module de base l'y réécrit pendant le geste — le code
   de la poignée de la barre de gauche (`nav_dom`), pas un second. Le panneau,
   la fenêtre des réglages et la visionneuse de la Bibliothèque la lisent
   donc tous ; 420 px, celle d'origine, quand rien ne la pose. Elle n'est pas
   déclarée sur le panneau : elle y masquerait celle de la rangée. */
/* Écran large : dans la rangée de la coquille, il pousse la page. */
.sc-panel {
  position: relative;
  display: flex; flex: 0 0 var(--sc-w, 420px); flex-direction: column; width: var(--sc-w, 420px); min-width: 0; height: 100%;
  overflow: hidden; border-left: 1px solid var(--line); background: var(--card); color: var(--ink);
  font-family: var(--font);
}
.sc-panel[hidden] { display: none; }
/* La poignée de largeur, sur son bord gauche — un filet qu'on glisse, et qui
   prend le focus au clavier. Pendant le geste (`data-nav-resizing`, posé par
   le module de base comme sur la barre de gauche, dont `app.css` coupe déjà
   la sélection et pose le curseur), les cadres de la page (un artefact) ne
   prennent pas le pointeur. */
.sc-resize {
  position: absolute; top: 0; bottom: 0; left: 0; z-index: 25; width: 5px; margin: 0; padding: 0;
  background: transparent; cursor: col-resize; touch-action: none; transition: background-color var(--d-hover, .12s);
}
.sc-resize:hover, .sc-panel[data-nav-resizing] .sc-resize { background: var(--line-2); }
.sc-resize:focus-visible { outline: 2px solid var(--focus); outline-offset: -2px; background: var(--line-2); }
body:has(.sc-panel[data-nav-resizing]) iframe { pointer-events: none; }
@media (prefers-reduced-motion: reduce) {
  .sc-resize { transition: none; }
}
/* Écran étroit : par-dessus la page, comme le tiroir de gauche — sans poignée. */
@media (max-width: 1023px) {
  .sc-panel { position: fixed; top: 0; right: 0; bottom: 0; z-index: 70; width: min(100vw, var(--sc-w, 420px)); box-shadow: var(--shadow-pop); }
  .sc-resize { display: none; }
}
/* Les réglages s'ouvrent en fenêtre par-dessus tout : elle laisse la place au panneau. */
@media (min-width: 1024px) {
  .flex:has(> .sc-panel:not([hidden])) :is(.settings-modal-layer, .gd-viewer-layer) { right: var(--sc-w, 420px); }
}
.sc-body, .sc-content { display: flex; flex: 1; flex-direction: column; min-height: 0; }
.sc-head {
  display: flex; flex: none; align-items: center; justify-content: space-between; gap: 8px;
  height: 52px; padding: 0 8px 0 14px; border-bottom: 1px solid var(--line);
}
.sc-head-l { display: flex; flex-direction: column; min-width: 0; }
.sc-head-a { display: flex; flex: none; align-items: center; gap: 2px; }
.sc-title { overflow: hidden; font: 600 13.5px/1.3 var(--font); white-space: nowrap; text-overflow: ellipsis; }
.sc-about { overflow: hidden; color: var(--ink-3); font-size: 12px; line-height: 1.35; white-space: nowrap; text-overflow: ellipsis; }
.sc-status { margin: 0; padding: 16px 14px; color: var(--ink-3); font-size: 13px; }

/* La conversation de `/chat`, à la largeur du panneau. */
.sc-panel .ai-conversation { flex: 1; min-height: 0; }
.sc-panel .ai-log { padding: 12px; }
.sc-panel .ai-empty { padding: 16px 0; }
.sc-panel .ai-greeting { font-size: 17px; }
.sc-panel .ai-composer-wrap { padding: 4px 10px 10px; }
.sc-panel .ai-composer { padding: 9px; }
.sc-panel .ai-composer-help { font-size: 10px; }
/* L'écriture du panneau, un cran sous la page du chat (Ghislain, 22/10 :
   « l'écriture est trop grande ») : la bulle, la prose, la saisie et les
   fiches citées y descendent d'un pas — la page entière `/chat` ne change
   pas, ces règles ne vivent que sous `.sc-panel`. */
.sc-panel .ai-user-bubble { font-size: 13px; padding: 8px 14px; }
.sc-panel .ai-assistant-content > div { font-size: 14px; line-height: 1.6; }
.sc-panel .ai-input { font-size: 13.5px; min-height: 36px; }
.sc-panel .ai-composer-toolbar { font-size: 12px; }
.sc-panel .ai-cited-chip { height: 24px; font-size: 11.5px; }
.sc-panel .ai-cited-n { font-size: 10.5px; }
/* Le mode vocal finit sur la page du chat : pas dans le panneau. */
.sc-panel [data-voice-action] { display: none; }

/* L'historique du panneau (22/10/2026) : les fils de conversation de l'espace, ceux du Chat
   d'Escouade — chacun se reprend dans le panneau, la page ouverte s'ajoute à sa suite. */
.sc-history { display: flex; flex: 1; flex-direction: column; min-height: 0; overflow-y: auto; padding: 6px; }
.sc-history-row {
  display: flex; flex-direction: column; gap: 2px; width: 100%; margin: 0; padding: 8px 10px;
  border: 0; border-radius: var(--r-sm); background: transparent; color: var(--ink);
  font-family: var(--font); text-align: left; cursor: pointer;
  transition: background var(--d-hover, .12s);
}
.sc-history-row:hover { background: var(--paper-2); }
.sc-history-row:focus-visible { outline: 2px solid var(--focus); outline-offset: -2px; }
.sc-history-t { overflow: hidden; font: 500 13px/1.35 var(--font); white-space: nowrap; text-overflow: ellipsis; }
.sc-history-p { overflow: hidden; color: var(--ink-3); font-size: 11.5px; line-height: 1.3; white-space: nowrap; text-overflow: ellipsis; }

/* assets/b/connecteurs.css */
/* ==========================================================================
   Escouade · identité B — les connecteurs (`/plugins/mcp`, 2026-10-29)
   `pages::plugins_mcp`, sur le modèle des connecteurs de Claude : la liste
   (deux onglets, une recherche, un filtre, « Ajouter », un tableau sobre) et
   la fiche d'une connexion (en-tête, menu « … », suggestions, autorisations
   des outils en trio Toujours · Demander · Bloqué).

   Règles de l'identité : seulement les jetons d'escouade-b.css ; pas de
   multicolore. « Tout va bien » est une coche d'encre ; un état à reprendre,
   un triangle d'encre seconde ; un refus, le rouge du thème (--danger). Le
   vert signal ne marque que l'interrupteur allumé et le mode choisi : ce
   qui est « en marche ». Les classes sont préfixées `cnx-` ; les boutons
   sont ceux de la fenêtre Connecteurs (`plugin-primary-action`,
   `plugin-row-action`, `param.css`).
   ========================================================================== */

.cnx-page {
  display: flex;
  flex-direction: column;
  gap: 20px;
  width: 100%;
  max-width: 960px;
  margin: 0 auto;
  padding: 28px 24px 48px;
  color: var(--ink);
}
.cnx-page summary { list-style: none; cursor: pointer; }
.cnx-page summary::-webkit-details-marker { display: none; }
.cnx-page button.plugin-primary-action,
.cnx-page button.plugin-row-action,
.cnx-page summary.plugin-row-action { border: 0; font-family: inherit; cursor: pointer; }
.cnx-page .plugin-row-action { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; font-weight: 600; white-space: nowrap; }
.cnx-page form { margin: 0; }

/* ---- L'en-tête et les onglets ------------------------------------------ */
.cnx-tete { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.cnx-tete h1, .cnx-fiche-tete h1 { margin: 0; font: var(--t-h2); letter-spacing: var(--ls-h2); }
.cnx-ajouter > summary { gap: 6px; }
.cnx-ajouter > summary::before { display: none; }
.cnx-onglets { display: flex; gap: 4px; border-bottom: 1px solid var(--line); }
.cnx-onglets a {
  display: inline-flex;
  align-items: baseline;
  gap: 6px;
  margin-bottom: -1px;
  padding: 8px 12px;
  border-bottom: 2px solid transparent;
  color: var(--ink-2);
  font: var(--t-ui);
}
.cnx-onglets a:hover { color: var(--ink); }
.cnx-onglets a[aria-current="page"] { border-bottom-color: var(--ink); color: var(--ink); font-weight: 600; }

/* ---- L'avis du dernier geste ------------------------------------------- */
.cnx-avis {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 10px 16px;
  margin: 0;
  padding: 12px 14px;
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  background: var(--card);
  font: var(--t-small);
}
.cnx-avis > p { margin: 0; }
.cnx-avis[data-ton="refus"] { border-color: color-mix(in srgb, var(--danger) 35%, var(--line)); background: var(--danger-soft); color: var(--danger); }

/* ---- La barre : recherche et filtre ------------------------------------ */
.cnx-barre { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.cnx-recherche { width: min(300px, 100%); }
.cnx-recherche svg { flex: none; }

/* ---- Les menus déroulants (« Ajouter », filtre, « … », Connecter) ------- */
.cnx-menu { position: relative; flex: none; }
.cnx-menu-bouton {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  border-radius: var(--r-sm);
  color: var(--ink-2);
}
.cnx-menu-bouton:hover, .cnx-menu[open] > .cnx-menu-bouton { background: var(--paper-2); color: var(--ink); }
.cnx-menu-liste {
  position: absolute;
  top: calc(100% + 4px);
  right: 0;
  z-index: 30;
  display: grid;
  min-width: 220px;
  padding: 4px;
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  background: var(--card);
  box-shadow: var(--shadow-pop);
}
.cnx-filtre .cnx-menu-liste { right: auto; left: 0; }
.cnx-menu-liste > a,
.cnx-menu-liste button:not(.plugin-primary-action) {
  display: block;
  width: 100%;
  padding: 8px 10px;
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: var(--ink);
  font: var(--t-small);
  text-align: left;
  cursor: pointer;
}
.cnx-menu-liste > a:hover,
.cnx-menu-liste button:not(.plugin-primary-action):hover,
.cnx-menu-liste > a[aria-current] { background: var(--paper-2); }
.cnx-menu-liste > a[aria-current] { font-weight: 600; }

/* ---- Le tableau de « Les vôtres » --------------------------------------- */
.cnx-table { width: 100%; border-collapse: separate; border-spacing: 0; border: 1px solid var(--line); border-radius: var(--r); background: var(--card); font: var(--t-small); }
.cnx-table th {
  padding: 10px 14px;
  border-bottom: 1px solid var(--line);
  color: var(--ink-3);
  font: var(--t-caption);
  font-weight: 500;
  text-align: left;
}
.cnx-table td { padding: 10px 14px; border-bottom: 1px solid var(--line); vertical-align: middle; }
.cnx-table tbody tr:last-child td { border-bottom: 0; }
.cnx-ligne { position: relative; }
.cnx-ligne:hover td { background: var(--paper); }
.cnx-ligne:target td { background: var(--paper-2); }
.cnx-nom { display: flex; align-items: center; gap: 10px; min-width: 0; }
.cnx-lien-ligne { color: var(--ink); font: var(--t-ui); font-weight: 600; }
/* La ligne entière mène à la fiche ; les gestes du statut restent au-dessus. */
.cnx-lien-ligne::after { content: ""; position: absolute; inset: 0; }
.cnx-col-statut { width: 1%; white-space: nowrap; }
.cnx-col-statut form, .cnx-col-statut a { position: relative; z-index: 1; }
.cnx-col-statut { text-align: right; }
.cnx-statut { display: inline-flex; align-items: center; justify-content: flex-end; gap: 10px; }
.cnx-col-type { color: var(--ink-2); }
.cnx-etiquette {
  display: inline-block;
  margin-left: 6px;
  padding: 1px 7px;
  border-radius: var(--r-pill);
  background: var(--paper-2);
  color: var(--ink-2);
  font: var(--t-caption);
}
.cnx-ok { display: inline-flex; color: var(--ink); }
.cnx-alerte { display: inline-flex; color: var(--ink-2); }
.cnx-alerte[data-ton="refus"] { color: var(--danger); }

/* ---- La marque ---------------------------------------------------------- */
.cnx-marque {
  display: inline-flex;
  flex: none;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  background: var(--card);
}
.cnx-marque img { object-fit: contain; }

/* ---- Vide, rien ne correspond ------------------------------------------ */
.cnx-vide {
  display: grid;
  justify-items: center;
  gap: 10px;
  margin: 0;
  padding: 24px 18px;
  border: 1px dashed var(--line-2);
  border-radius: var(--r);
  color: var(--ink-2);
  font: var(--t-small);
  text-align: center;
}
.cnx-vide p { margin: 0; }
.cnx-vide a:not(.plugin-row-action) { color: var(--ink); text-decoration: underline; }
.cnx-aucun { display: none; }
.cnx-filtrable:not(:has([data-plugin-row]:not([hidden]))) .cnx-aucun { display: block; }
.cnx-filtrable:not(:has([data-plugin-row]:not([hidden]))) .cnx-table { display: none; }
.cnx-famille:not(:has([data-plugin-row]:not([hidden]))) { display: none; }

/* ---- Les sections ------------------------------------------------------ */
.cnx-section { display: grid; gap: 12px; }
.cnx-titre { margin: 0; font: var(--t-ui); font-size: 15px; font-weight: 600; letter-spacing: var(--ls-tight); color: var(--ink); }
.cnx-note { margin: 0; font: var(--t-small); color: var(--ink-2); }
.cnx-note[data-ton="refus"] { color: var(--danger); }
.cnx-lien { color: var(--ink-2); font: var(--t-small); text-decoration: underline; text-underline-offset: 2px; }
.cnx-lien:hover { color: var(--ink); }

/* ---- « Découvrir » : une ligne par entrée ------------------------------ */
.cnx-famille { display: grid; gap: 8px; }
.cnx-famille h3 { margin: 8px 0 0; font: var(--t-label); letter-spacing: var(--ls-label); text-transform: uppercase; color: var(--ink-3); }
.cnx-cat-liste { display: grid; margin: 0; padding: 0; border: 1px solid var(--line); border-radius: var(--r); background: var(--card); list-style: none; }
.cnx-cat { display: flex; align-items: center; gap: 12px; min-width: 0; padding: 10px 14px; border-bottom: 1px solid var(--line); }
.cnx-cat:last-child { border-bottom: 0; }
.cnx-cat:target { background: var(--paper-2); }
.cnx-cat-copie { display: grid; flex: 1; gap: 1px; min-width: 0; }
.cnx-cat-copie strong { font: var(--t-ui); font-weight: 600; }
.cnx-cat-copie > span { overflow: hidden; color: var(--ink-2); font: var(--t-small); text-overflow: ellipsis; white-space: nowrap; }
.cnx-cat-gestes { display: flex; flex: none; align-items: center; gap: 10px; }
.cnx-indispo { color: var(--ink-3); font: var(--t-caption); cursor: help; }
.cnx-completer .cnx-menu-liste { width: min(320px, 80vw); padding: 12px; gap: 10px; }

/* ---- L'interrupteur « Ouvert aux membres » ------------------------------ */
.cnx-switch {
  position: relative;
  flex: none;
  width: 34px;
  height: 20px;
  padding: 0;
  border: 0;
  border-radius: var(--r-pill);
  background: var(--line-2);
  cursor: pointer;
  transition: background var(--d-hover);
}
.cnx-switch-rond {
  position: absolute;
  top: 2px;
  left: 2px;
  width: 16px;
  height: 16px;
  border-radius: var(--r-round);
  background: var(--card);
  box-shadow: var(--shadow-knob);
  transition: transform var(--d-hover) var(--out);
}
.cnx-switch[aria-checked="true"] { background: var(--ink); }
.cnx-switch[aria-checked="true"] .cnx-switch-rond { transform: translateX(14px); }
.cnx-switch:disabled { opacity: .5; cursor: not-allowed; }
.cnx-ouverture {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 12px 14px;
  border: 1px solid var(--line);
  border-radius: var(--r);
  background: var(--card);
}
.cnx-ouverture-texte { display: grid; gap: 2px; font: var(--t-small); }

/* ---- La fiche ----------------------------------------------------------- */
.cnx-retour { align-self: flex-start; color: var(--ink-2); font: var(--t-small); }
.cnx-retour:hover { color: var(--ink); }
.cnx-fiche-tete { display: flex; align-items: center; gap: 12px; }
.cnx-fiche-tete .cnx-marque { width: 44px; height: 44px; border-radius: var(--r-btn); }
.cnx-fiche-tete h1 { flex: 1; min-width: 0; overflow-wrap: anywhere; }
.cnx-gestes { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.cnx-description { margin: 0; max-width: 680px; color: var(--ink-2); font: var(--t-body); }
.cnx-rappel {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 10px 16px;
  padding: 12px 14px;
  border-radius: var(--r-sm);
  background: var(--paper-2);
}
.cnx-rappel > p { flex: 1 1 280px; margin: 0; font: var(--t-small); }
.cnx-rappel[data-ton="refus"] { background: var(--danger-soft); }
.cnx-rappel[data-ton="refus"] > p { color: var(--danger); }
.cnx-pastilles { display: flex; flex-wrap: wrap; gap: 8px; }
.cnx-pastille {
  padding: 7px 12px;
  border: 1px solid var(--line-2);
  border-radius: var(--r-pill);
  background: var(--card);
  color: var(--ink);
  font: var(--t-small);
}
.cnx-pastille:hover { background: var(--paper-2); }

/* Les autorisations : deux groupes repliables, un trio par outil. */
.cnx-groupe { position: relative; border: 1px solid var(--line); border-radius: var(--r); background: var(--card); }
.cnx-groupe > summary {
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 48px;
  padding: 0 14px;
  font: var(--t-ui);
  font-weight: 600;
}
.cnx-groupe > summary::before,
.cnx-replie > summary::before,
.cnx-detail > summary::before {
  content: "";
  flex: none;
  width: 6px;
  height: 6px;
  border-right: 1.5px solid currentColor;
  border-bottom: 1.5px solid currentColor;
  transform: rotate(-45deg);
  transition: transform var(--d-hover) var(--out);
}
.cnx-groupe[open] > summary::before,
.cnx-replie[open] > summary::before,
.cnx-detail[open] > summary::before { transform: rotate(45deg); }
/* Le sélecteur du groupe se loge à droite de son titre. */
.cnx-segments { position: absolute; top: 9px; right: 10px; display: inline-flex; padding: 2px; border-radius: var(--r-sm); background: var(--paper-2); }
.cnx-segment {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 4px 8px;
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: var(--ink-2);
  font: var(--t-caption);
  cursor: pointer;
}
.cnx-segment[aria-pressed="true"] { background: var(--card); color: var(--ink); box-shadow: var(--shadow-1); font-weight: 600; }
.cnx-segment:disabled, .cnx-trio-bouton:disabled { opacity: .35; cursor: not-allowed; }
.cnx-outils { display: grid; margin: 0; padding: 0; border-top: 1px solid var(--line); list-style: none; }
.cnx-outil { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 8px 14px; border-bottom: 1px solid var(--line); }
.cnx-outil:last-child { border-bottom: 0; }
.cnx-outil-nom { min-width: 0; font: var(--t-small); overflow-wrap: anywhere; }
.cnx-trio { display: inline-flex; flex: none; gap: 2px; }
.cnx-trio-bouton {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 28px;
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: var(--ink-3);
  cursor: pointer;
}
.cnx-trio-bouton:hover:not(:disabled) { background: var(--paper-2); color: var(--ink); }
.cnx-trio-bouton[aria-pressed="true"] { background: var(--paper-2); color: var(--ink); box-shadow: inset 0 0 0 1px var(--line-2); }
.cnx-trio-bouton[data-mode="blocked"][aria-pressed="true"] { color: var(--danger); }

/* Les blocs repliés : détails techniques, ajout, « Avancé ». */
.cnx-replie { padding: 12px 14px; border: 1px solid var(--line); border-radius: var(--r); background: var(--card); }
.cnx-replie > summary { display: flex; align-items: center; gap: 8px; }
.cnx-replie[open] > summary { margin-bottom: 12px; }
.cnx-replie > * + * { margin-top: 12px; }
.cnx-replie > summary + * { margin-top: 0; }
.cnx-detail > summary { display: flex; align-items: center; gap: 8px; color: var(--ink-2); font: var(--t-small); font-weight: 500; }
.cnx-detail[open] > summary { margin-bottom: 10px; color: var(--ink); }
.cnx-infos { display: grid; grid-template-columns: max-content 1fr; gap: 6px 16px; margin: 0; font: var(--t-small); }
.cnx-infos dt { color: var(--ink-3); }
.cnx-infos dd { margin: 0; min-width: 0; }
.cnx-url { font-family: var(--mono); font-size: 12px; overflow-wrap: anywhere; }
.cnx-ajout-tete { display: flex; align-items: center; justify-content: space-between; gap: 12px; }

/* Les formulaires. */
.cnx-form { display: grid; gap: 12px; }
.cnx-champ-ligne { display: grid; gap: 5px; color: var(--ink-2); font: var(--t-small); }
.cnx-champ {
  width: 100%;
  min-width: 0;
  padding: 8px 10px;
  border: 1px solid var(--line-2);
  border-radius: var(--r-sm);
  background: var(--card);
  color: var(--ink);
  font: var(--t-small);
}
.cnx-champ:focus { border-color: var(--ink); outline: none; box-shadow: var(--ring-ink); }
.cnx-case { display: flex; align-items: flex-start; gap: 8px; font: var(--t-small); cursor: pointer; }
.cnx-case input { flex: none; margin-top: 3px; accent-color: var(--ink); }
.cnx-autorises { margin: 0; padding-left: 18px; color: var(--ink-2); font: var(--t-small); }
.cnx-page code { font-family: var(--mono); font-size: 12px; overflow-wrap: anywhere; }

/* ---- Clavier ------------------------------------------------------------ */
:is(.cnx-page summary, .cnx-onglets a, .cnx-retour, .cnx-lien, .cnx-lien-ligne, .cnx-menu-liste > a, .cnx-menu-liste button,
  .cnx-switch, .cnx-segment, .cnx-trio-bouton, .cnx-pastille, .cnx-vide a):focus-visible {
  outline: 2px solid var(--focus);
  outline-offset: 2px;
  border-radius: var(--r-sm);
}

/* ---- Téléphone ---------------------------------------------------------- */
@media (max-width: 640px) {
  .cnx-page { gap: 16px; padding: 18px 16px 36px; }
  .cnx-recherche { flex: 1; width: auto; }
  .cnx-col-type { display: none; }
  .cnx-table th, .cnx-table td { padding: 10px; }
  .cnx-cat { flex-wrap: wrap; }
  .cnx-cat-copie { flex-basis: calc(100% - 48px); }
  .cnx-cat-copie > span { white-space: normal; }
  .cnx-cat-gestes { width: 100%; justify-content: flex-end; }
  .cnx-fiche-tete { flex-wrap: wrap; }
  .cnx-fiche-tete .cnx-gestes { width: 100%; }
  .cnx-segments { position: static; margin: 0 14px 10px; }
  .cnx-segment span { display: none; }
  .cnx-infos { grid-template-columns: 1fr; gap: 2px; }
  .cnx-infos dd { margin-bottom: 6px; }
}

@media (prefers-reduced-motion: reduce) {
  .cnx-switch, .cnx-switch-rond,
  .cnx-groupe > summary::before, .cnx-replie > summary::before, .cnx-detail > summary::before { transition: none; }
}

/* assets/b/contacts.css */
/* ==========================================================================
   Escouade · identité B — la fiche d'un CONTACT (studio Contacts, 2026-09-29)
   Posées par crates/api/src/pages/contact_brief.rs et
   crates/web/src/record_relations.rs (le rôle sur une affaire) :
     CT-FICHE  une ligne « En bref » sous l'identité : dernier échange,
               affaires, réunion ;
     CT-MOB    sur téléphone, trois gestes en tête : Appeler (le bouton
               principal, à l'encre et au point signal), Écrire, Ajouter une
               note ; ils disparaissent sur grand écran ;
     CT-AFF    le rôle de l'entreprise sur chaque affaire, en pastille.
   Seulement les jetons d'escouade-b.css ; aucune couleur en dur. Le CSS
   Tailwind étant figé, tout le neuf de ce lot vit ici.
   ========================================================================== */

.b-cbrief{display:flex;flex-direction:column;gap:10px;margin-top:14px}

/* ---- CT-MOB : les trois gestes, téléphone seulement --------------------- */
.b-cmob{display:none;gap:8px}
@media (max-width:1023px){.b-cmob{display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}}
.b-cact{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:40px;padding:0 10px;border-radius:var(--r-sm);box-shadow:inset 0 0 0 1px var(--line-2);background:var(--card);color:var(--ink);font-size:13px;font-weight:500;text-decoration:none;white-space:nowrap;transition:background var(--d-hover)}
.b-cact:hover{background:var(--paper-2)}
.b-cact.is-main{background:var(--ink);color:var(--card);box-shadow:none}
.b-cact.is-main::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--btn-dot)}
.b-cact.is-off{color:var(--ink-3);cursor:not-allowed;background:transparent}
.b-cact:focus-visible{outline:none;box-shadow:inset 0 0 0 1px var(--ink),var(--focus)}

/* ---- CT-FICHE : la ligne « En bref » ------------------------------------- */
.b-cbrief-l{display:flex;flex-wrap:wrap;justify-content:center;gap:4px 14px;margin:0;padding:0;list-style:none;font-size:12.5px;color:var(--ink-2)}
.b-cbrief-l li{display:inline-flex;align-items:baseline;gap:6px;min-width:0;max-width:100%}
.b-cbrief-l a{color:var(--ink);text-decoration:none;white-space:nowrap}
.b-cbrief-l a:hover{text-decoration:underline}
.b-cbrief-s{color:var(--ink-3);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:22ch}
.b-cbrief-m{color:var(--ink-3)}
@media (max-width:1023px){.b-cbrief-l{justify-content:flex-start;flex-direction:column;gap:4px}}

/* ---- CT-AFF : le rôle sur une affaire ------------------------------------ */
.b-crole{flex:none;max-width:40%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;border-radius:999px;padding:1px 8px;background:var(--paper-2);color:var(--ink-2);font-size:11.5px}

/* assets/b/document.css */
/* ===================================================================   Escouade · identité B — ce qu'un DOCUMENT montre quand on l'ouvre
   (web/src/document_read.rs) : l'aperçu de la Bibliothèque et la
   fiche /objects/documents/<id> dessinent les mêmes blocs.

   Feuille MAISON (le CSS Tailwind est figé) ; jetons de escouade-b.css
   seulement. Le vert ne marque que ce qui attend un geste.
   ========================================================================== */

.dv-muted{margin:0;color:var(--ink-3);font-size:12.5px;line-height:1.5}
.dv-cap{display:flex;align-items:center;gap:6px;margin:0 0 8px;font:500 10.5px/1.2 var(--font);letter-spacing:.06em;text-transform:uppercase;color:var(--ink-3)}
.dv-cap svg{color:var(--ink-3)}
.dv-btn{display:inline-flex;align-items:center;gap:6px;height:28px;padding:0 10px;border:1px solid var(--line-2);border-radius:var(--r-sm);background:var(--card);color:var(--ink);font:500 12.5px/1 var(--font);text-decoration:none;white-space:nowrap}
.dv-btn:hover{border-color:var(--ink-3)}

/* Aperçu indisponible : la raison en une phrase, puis le texte lu. */
.dv-unavail{display:flex;flex-direction:column;gap:12px;padding:12px}
.dv-unavail-head{display:flex;flex-wrap:wrap;align-items:flex-start;gap:10px;padding:10px 12px;border:1px solid var(--line);border-radius:var(--r);background:var(--paper)}
.dv-unavail-ic{display:inline-grid;place-items:center;width:30px;height:30px;flex:none;border-radius:var(--r-icon);background:var(--paper-2);color:var(--ink-2);box-shadow:inset 0 0 0 1px var(--line)}
.dv-unavail-text{flex:1 1 180px;min-width:0;display:flex;flex-direction:column;gap:2px;font-size:13px;line-height:1.45}
.dv-unavail-text b{font-weight:600;color:var(--ink)}
.dv-unavail-text span{color:var(--ink-2)}
.dv-unavail-head .dv-btn{align-self:center;flex:none}
.gd-preview-page .dv-unavail{cursor:default}
.gd-preview-page>.gd-photo+.dv-unavail{position:relative;clear:both;background:var(--paper)}
.dv-text-body{display:flex;flex-direction:column;gap:8px;max-height:min(70vh,640px);overflow:auto;padding:12px 14px;border:1px solid var(--line);border-radius:var(--r);background:var(--card)}
.dv-text-body p{margin:0;font-size:13px;line-height:1.55;color:var(--ink);overflow-wrap:anywhere;white-space:pre-line}
.dv-text .dv-muted{margin-top:6px}

/* Un son (2026-11-03, D413) : le lecteur à la place de « Aperçu indisponible »,
   puis la transcription. */
.dv-audio{display:flex;flex-direction:column;gap:12px;padding:12px}
.dv-audio-head{display:flex;align-items:center;gap:10px;padding:10px 12px;border:1px solid var(--line);border-radius:var(--r);background:var(--paper)}
.dv-audio-head b{flex:1;min-width:0;font-size:13px;font-weight:600;color:var(--ink)}
.dv-audio-player{display:block;width:100%;min-height:40px}

/* D'où vient le document : son courriel porteur, son Drive, son enregistrement. */
.dv-prov{display:flex;flex-direction:column;gap:6px;margin:0;padding:0;list-style:none}
.dv-prov li{display:flex;align-items:flex-start;gap:8px;font-size:13px;line-height:1.45;color:var(--ink)}
.dv-prov li svg{flex:none;margin-top:2px;color:var(--ink-3)}
.dv-prov .dv-prov-meta{display:block;color:var(--ink-2);font-size:12.5px}
.dv-prov a{color:inherit;text-decoration:underline;text-underline-offset:2px}

/* La visionneuse de la fiche : l'état indisponible prend la place du cadre. */
.viewer .viewer-unavailable{border-top:1px solid var(--line)}

/* Ce qu'Escouade a lu : les éléments extraits, leur source en petit. */
.dv-page{display:flex;flex-direction:column;gap:16px;padding:16px 24px 0}
.dv-page .viewer{margin:0}
.dv-page-piece{border:1px solid var(--line);border-radius:var(--r);background:var(--card)}
.dv-read{display:flex;flex-direction:column;gap:10px;padding:12px 14px;border:1px solid var(--line);border-radius:var(--r);background:var(--card);box-shadow:var(--shadow-1)}
.dv-read .dv-cap{margin:0}
.dv-read-source{margin:-4px 0 0;font-size:12.5px;color:var(--ink-3)}
.dv-facts{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:10px 18px;margin:0}
.dv-fact{min-width:0;display:flex;flex-direction:column;gap:2px}
.dv-fact dt{font-size:11.5px;color:var(--ink-3)}
.dv-fact dd{margin:0;display:flex;flex-direction:column;gap:1px;min-width:0;font-size:13.5px;font-weight:500;color:var(--ink);overflow-wrap:anywhere}
.dv-fact dd a{color:var(--ink);text-decoration:underline;text-decoration-color:var(--line-2);text-underline-offset:3px}
.dv-fact dd small{font-size:11.5px;font-weight:400;color:var(--ink-3);line-height:1.35}
.dv-fact.is-warn dd small{color:var(--danger)}
.dv-sub{margin:4px 0 6px;font:500 12px/1.3 var(--font);color:var(--ink-2)}
.dv-lines table{width:100%;border-collapse:collapse;font-size:13px}
.dv-lines td{padding:6px 0;border-top:1px solid var(--line);vertical-align:top;color:var(--ink)}
.dv-lines td small{display:block;font-size:11.5px;color:var(--ink-3)}
.dv-num{text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums;padding-left:12px!important}
.dv-status{display:flex;align-items:center;gap:8px;margin:0 0 6px;font-weight:600;font-size:13px;color:var(--ink)}
.dv-status-dot{width:8px;height:8px;border-radius:50%;background:var(--ink);flex:none}
.dv-steps{list-style:none;margin:0;padding:0 0 0 4px;border-left:1px solid var(--line-2);display:flex;flex-direction:column;gap:10px}
.dv-steps li{position:relative;display:grid;grid-template-columns:96px minmax(0,1fr);gap:10px;padding-left:12px;font-size:13px}
.dv-steps li::before{content:"";position:absolute;left:-4.5px;top:6px;width:8px;height:8px;border-radius:50%;background:var(--card);box-shadow:inset 0 0 0 1.5px var(--ink-3)}
.dv-steps li:first-child::before{background:var(--ink);box-shadow:none}
.dv-step-date{color:var(--ink-3);font-variant-numeric:tabular-nums;font-size:12px;padding-top:1px}
.dv-step-body{display:flex;flex-direction:column;gap:1px;min-width:0}
.dv-step-body b{font-weight:500;color:var(--ink)}
.dv-step-who{font-size:12px;color:var(--ink-2)}
.dv-step-body q{font-size:12.5px;color:var(--ink-2);quotes:"« " " »"}
.dv-related{display:flex;flex-direction:column;gap:4px}
.dv-rel{display:flex;align-items:center;gap:8px;min-width:0;padding:5px 8px;border-radius:var(--r-sm);color:var(--ink);text-decoration:none;font-size:13px}
.dv-rel:hover{background:var(--paper-2)}
.dv-rel svg{flex:none;color:var(--ink-3)}
.dv-rel span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dv-rel small{margin-left:auto;flex:none;font-size:11.5px;color:var(--ink-3)}
.gd-preview .dv-read{box-shadow:none;padding:10px 12px}
.gd-preview .dv-facts{grid-template-columns:repeat(auto-fill,minmax(140px,1fr))}
.gd-preview .dv-steps li{grid-template-columns:80px minmax(0,1fr)}

/* Technique : repliée, lisible. */
.dv-tech{border-top:1px solid var(--line);padding-top:8px;font-size:13px}
.dv-tech>summary{display:flex;align-items:center;gap:7px;cursor:pointer;list-style:none;padding:4px 0;font-weight:600;font-size:13px;color:var(--ink-2)}
.dv-tech>summary::-webkit-details-marker{display:none}
.dv-tech>summary:hover{color:var(--ink)}
.dv-tech-caret{margin-left:auto;color:var(--ink-3);transition:transform var(--d-hover,.15s)}
.dv-tech[open] .dv-tech-caret{transform:rotate(90deg)}
.dv-tech dl{display:flex;flex-direction:column;gap:8px;margin:8px 0 4px}
.dv-tech dl>div{display:grid;grid-template-columns:128px minmax(0,1fr);gap:10px}
.dv-tech dt{font-size:12px;color:var(--ink-3)}
.dv-tech dd{margin:0;color:var(--ink);overflow-wrap:anywhere;font-size:12.5px;line-height:1.45}
.dv-tech dd a{color:var(--ink);text-decoration:underline;text-decoration-color:var(--line-2);text-underline-offset:3px}
@media (max-width:900px){.dv-page{padding:12px 12px 0}.dv-steps li{grid-template-columns:minmax(0,1fr)}}

/* Demander à l'assistant : des questions prêtes, le document en contexte. */
.dv-ask{display:flex;flex-direction:column;gap:8px;padding:10px 12px;border:1px solid var(--line);border-radius:var(--r);background:var(--paper)}
.dv-ask-head{display:flex;flex-direction:column;gap:2px}
.dv-ask-main{display:inline-flex;align-items:center;gap:8px;align-self:flex-start;font:600 13px/1.3 var(--font);color:var(--ink);text-decoration:none}
.dv-ask-main:hover{text-decoration:underline;text-underline-offset:3px}
.dv-ask-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:2px}
.dv-ask-list a{display:flex;align-items:flex-start;gap:8px;padding:5px 8px;border-radius:var(--r-sm);color:var(--ink-2);text-decoration:none;font-size:13px;line-height:1.4}
.dv-ask-list a:hover{background:var(--card);color:var(--ink)}
.dv-ask-list svg{flex:none;margin-top:2px;color:var(--ink-3)}
.dv-rawhint{padding:14px}

/* Le visionneur commun (studio Visionneurs, 4/11) : le bouton qui nomme l'outil, partout le même.
   Bouton principal encre avec le point vert (kit v4). Le téléphone n'édite pas : « Continuer sur ordinateur ». */
.dv-video{display:flex;flex-direction:column;gap:12px;padding:12px}
.dv-video-player{width:100%;max-height:70vh;border-radius:var(--r-sm);background:#0c0d0f}
.dv-rendu{display:flex;flex-direction:column;gap:8px;height:100%;min-height:520px}
.dv-rendu-page{flex:1;width:100%;min-height:480px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--card)}
.gd-preview-head .vw-edit,.gd-viewer-head .vw-edit{flex:none}
.dv-page-edit{display:flex;justify-content:flex-end}
.vw-edit{display:inline-flex;position:relative;align-items:center}
.vw-edit-desk{display:inline-flex;align-items:center;gap:1px}
.vw-btn{display:inline-flex;align-items:center;gap:6px;height:30px;padding:0 11px;border:1px solid var(--line-2);border-radius:var(--r-sm);background:var(--card);color:var(--ink);font:500 13px/1 var(--font);cursor:pointer;text-decoration:none;white-space:nowrap;list-style:none}
.vw-btn::-webkit-details-marker{display:none}
.vw-btn.vw-primary{background:var(--ink);border-color:var(--ink);color:var(--paper)}
.vw-caret{padding:0 8px}
.vw-dot{width:6px;height:6px;border-radius:50%;background:var(--signal);flex:none}
.vw-more{position:relative}
.vw-pop{position:absolute;z-index:30;top:calc(100% + 4px);right:0;min-width:220px;display:flex;flex-direction:column;padding:4px;background:var(--card);border:1px solid var(--line-2);border-radius:var(--r-sm);box-shadow:0 8px 24px rgba(0,0,0,.12)}
.vw-pop-item{display:block;padding:7px 9px;border-radius:var(--r-sm);color:var(--ink);font-size:13px;text-decoration:none}
.vw-pop-item:hover{background:var(--line)}
.vw-pop-cap{margin:6px 9px 2px;color:var(--ink-3,#6b6e76);font-size:12px}
.vw-pop-note{margin:0;padding:10px 12px;font-size:13px;line-height:1.45;color:var(--ink);white-space:normal;width:260px}
.vw-continue{display:none;position:relative}
.vw-readonly{display:inline-flex;align-items:center;height:30px;padding:0 11px;border:1px solid var(--line-2);border-radius:var(--r-sm);color:var(--ink-3,#6b6e76);font-size:13px;white-space:nowrap}
@media (max-width:640px) and (pointer:coarse){.vw-edit-desk{display:none}.vw-continue{display:block}}

/* Le visionneur commun : la vignette, le panneau, la page (studio Visionneurs, 4/11/2026). */
.vw-thumbs{display:flex;flex-wrap:wrap;gap:8px;margin:8px 0}
.vw-piece{position:static;display:inline-block;min-width:0;max-width:100%}
.vw-inline{display:inline}
.vw-piece-open{list-style:none;cursor:pointer;min-width:0}
.vw-piece-open::-webkit-details-marker{display:none}
.vw-card>.vw-piece-open{display:flex;flex-direction:column;width:136px;overflow:hidden;border:1px solid var(--line-2);border-radius:var(--r-sm);background:var(--card)}
.vw-card>.vw-piece-open:hover{border-color:var(--ink-3,#6b6e76)}
.vw-vocal{display:flex;flex-direction:column;gap:4px;width:280px;max-width:100%;padding:8px;border:1px solid var(--line-2);border-radius:var(--r-sm);background:var(--card)}
.vw-vocal audio{display:block;width:100%;height:36px}
.vw-thumb-sur{position:absolute;inset:0;object-fit:contain}
.vw-thumb{position:relative;display:flex;align-items:center;justify-content:center;width:100%;height:92px;overflow:hidden;background:var(--paper-2,var(--line))}
.vw-thumb-media{width:100%;height:100%;object-fit:cover;pointer-events:none;border:0}
.vw-thumb-name{display:block;padding:6px 8px;overflow:hidden;font-size:12px;line-height:1.3;color:var(--ink);text-overflow:ellipsis;white-space:nowrap}
.vw-link{color:var(--ink);font-size:13px;text-decoration:underline;text-underline-offset:2px}
.vw-tile{display:inline-flex;align-items:center;justify-content:center;flex:none;min-width:34px;height:34px;padding:0 6px;border:1px solid var(--line-2);border-radius:var(--r-sm);background:var(--card);color:var(--ink);font:600 11px/1 var(--font);letter-spacing:.02em}
.vw-piece[open]>.vw-piece-open::before{content:"";position:fixed;inset:0;z-index:70;background:rgba(0,0,0,.28);cursor:default}
.vw-piece[open]>.vw-piece-open::after{content:"\00d7";position:fixed;z-index:72;top:12px;right:12px;width:30px;height:30px;border:1px solid var(--line-2);border-radius:var(--r-sm);background:var(--card);color:var(--ink);font:400 20px/28px var(--font);text-align:center}
.vw-panel{position:fixed;z-index:71;top:0;right:0;bottom:0;width:min(720px,100vw);background:var(--card);border-left:1px solid var(--line-2);box-shadow:-12px 0 32px rgba(0,0,0,.14)}
.vw-panel-frame{display:block;width:100%;height:100%;border:0}
.vw-page{display:flex;flex-direction:column;min-height:100%;height:100vh;background:var(--paper);color:var(--ink)}
.vw-page-full{position:fixed;inset:0;z-index:60}
.vw-page-nu{position:fixed;inset:0;z-index:60;height:auto;min-height:0}
.vw-head{display:flex;flex:none;align-items:center;gap:8px;height:52px;padding:0 54px 0 12px;border-bottom:1px solid var(--line);background:var(--card)}
.vw-page-full .vw-head{padding-right:12px}
.vw-head-name{flex:1;min-width:0}
.vw-head-name h1{margin:0;overflow:hidden;font-size:14px;font-weight:500;text-overflow:ellipsis;white-space:nowrap}
.vw-head-name span{display:block;color:var(--ink-3,#6b6e76);font-size:12px}
.vw-body{display:flex;flex:1;flex-direction:column;min-height:0;overflow:auto}
.vw-frame{flex:1;width:100%;min-height:360px;border:0;background:#fff}
.vw-frame-plein{position:fixed;inset:0;z-index:1000;width:100vw;height:100dvh}
.vw-note{flex:none;margin:0;padding:6px 12px;color:var(--ink-3,#6b6e76);font-size:12px}
.vw-open-pdf{display:none;flex:none;padding:10px 12px;color:var(--ink);font-size:13px}
.vw-zoom{display:flex;flex:1;align-items:center;justify-content:center;min-height:0;overflow:auto;padding:16px;cursor:zoom-in}
.vw-zoom-toggle{position:absolute;opacity:0;width:0;height:0}
.vw-image{max-width:100%;max-height:100%;object-fit:contain}
.vw-zoom:has(.vw-zoom-toggle:checked){display:block;cursor:zoom-out}
.vw-zoom-toggle:checked+.vw-image{max-width:none;max-height:none}
.vw-state{display:flex;flex-direction:column;align-items:center;gap:8px;margin:auto;padding:32px 24px;max-width:44ch;text-align:center}
.vw-state b{font-size:15px;font-weight:600}
.vw-state span:not(.vw-tile){color:var(--ink-3,#6b6e76);font-size:13px}
@media (max-width:640px){.vw-panel{width:100vw;border-left:0}.vw-open-pdf{display:block}.vw-grow{display:none}}
.vw-files{display:flex;flex-wrap:wrap;gap:10px}
.vw-file{display:flex;flex-direction:column;gap:4px;width:136px}
.vw-file:has(.vw-vocal){width:280px}
.vw-file-foot{display:flex;flex-wrap:wrap;align-items:center;gap:4px;min-height:24px}
.vw-gallery{display:flex;flex:none;align-items:center;justify-content:center;gap:8px;padding:6px 10px;border-bottom:1px solid var(--line);background:var(--card)}
.vw-gallery-count{min-width:64px;color:var(--ink-3,#6b6e76);font-size:13px;text-align:center}
.vw-pop-left{right:auto;left:0;max-height:320px;overflow:auto}
.vw-compare{display:grid;flex:1;grid-template-columns:1fr 1fr;gap:2px;min-height:0;background:var(--line)}
.vw-compare figure{display:flex;flex-direction:column;min-width:0;min-height:0;margin:0;background:var(--paper)}
.vw-compare img{flex:1;width:100%;min-height:0;object-fit:contain}
.vw-compare figcaption{flex:none;padding:6px 10px;overflow:hidden;color:var(--ink-3,#6b6e76);font-size:12px;text-overflow:ellipsis;white-space:nowrap}
@media (max-width:640px){.vw-compare{grid-template-columns:1fr;grid-template-rows:1fr 1fr}}
.vw-thumbs-end{justify-content:flex-end}
.vw-block{display:block}
.vw-block>.vw-piece-open{display:flex;flex-direction:column}
.vw-archive{padding:12px 16px}
.vw-archive ul{margin:0;padding:0;list-style:none}
.vw-archive li{display:flex;justify-content:space-between;gap:12px;padding:5px 0;border-bottom:1px solid var(--line);font-size:13px}
.vw-archive-path{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.vw-archive-size{flex:none;color:var(--ink-3,#6b6e76);font-size:12px}
.vw-mail{padding:16px 18px;font-size:14px;line-height:1.55}
.vw-review-frame{display:block;width:100%;height:720px;border:0}
.vw-sign-frame{display:block;width:100%;height:560px;margin-top:10px;border:1px solid var(--line);border-radius:var(--r-sm)}
.vw-shelf{padding:12px}
.vw-shelf h3{margin:0 0 8px;font-size:13px;font-weight:600}
.vw-thumb-mini{display:flex;align-items:center;justify-content:center;width:40px;height:40px;overflow:hidden;border:1px solid var(--line-2);border-radius:var(--r-sm);background:var(--paper-2,var(--line))}
.vw-mail-pieces{margin:4px 0 0;padding:0;list-style:none;font-size:13px}
.vw-mail-pieces a{color:inherit;text-decoration:underline}
.enr-voices{display:flex;gap:1px;height:22px;margin:8px 0;overflow:hidden;border-radius:var(--r-sm);background:var(--line)}
.enr-voice{flex:1 1 0;min-width:2px;background:var(--ink);opacity:.85}
.enr-voice:hover{opacity:1}
.enr-voice-1{opacity:.62}.enr-voice-2{opacity:.44}.enr-voice-3{opacity:.3}.enr-voice-4{background:var(--signal)}.enr-voice-5{background:var(--signal);opacity:.55}
.gd-viewer:has(.vw-gallery) .gd-viewer-page{touch-action:pan-y pinch-zoom}
.vw-file-pick{max-width:640px;margin:0 auto;padding:20px 16px}
.vw-file-pick h1{margin:0 0 4px;font-size:16px;font-weight:600}
.vw-file-pick h2{margin:16px 0 6px;font-size:13px;font-weight:600}
.vw-file-pick ul{margin:0;padding:0;list-style:none}
.vw-file-pick li{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:6px 0;border-bottom:1px solid var(--line);font-size:13px}
.vw-file-pick li span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.vw-file-rights{margin:10px 0;padding:10px 12px;border:1px solid var(--line-2);border-radius:var(--r-sm);font-size:13px;line-height:1.45}
.vw-file-search{display:flex;gap:8px}
.vw-file-search input{flex:1;min-width:0;height:30px;padding:0 10px;border:1px solid var(--line-2);border-radius:var(--r-sm);background:var(--card);color:var(--ink);font:400 13px/1 var(--font)}
.vw-compare-docs{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:12px}
.vw-compare-docs iframe{width:100%;height:70vh;border:1px solid var(--line);border-radius:var(--r-sm)}
.vw-sign-marks{margin:8px 0 0;padding:0;list-style:none;font-size:13px}
.vw-sign-marks li{padding:3px 0}
@media (max-width:640px){.vw-compare-docs{grid-template-columns:1fr}}
.bn-media-open{display:inline-block;margin-top:4px;color:var(--ink-2);font-size:12px;text-decoration:underline;text-underline-offset:2px}

.vw-reponse{margin:0;padding:16px 18px;font-size:14px;line-height:1.5}
.vw-reponse dt{margin-top:12px;color:var(--ink-3,#6b6e76);font-size:12px}
.vw-reponse dd{margin:2px 0 0;white-space:pre-wrap}
.vw-on-page{margin-left:6px;font-size:12px;white-space:nowrap}
.vw-side-by-side{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:16px;align-items:start}
.vw-side-by-side>iframe{position:sticky;top:8px;width:100%;height:80vh;border:1px solid var(--line);border-radius:var(--r-sm)}
.vw-search-doc{display:flex;gap:8px;margin:8px 0}
.vw-search-doc input{flex:1;min-width:0;height:30px;padding:0 10px;border:1px solid var(--line-2);border-radius:var(--r-sm);background:var(--card);color:var(--ink);font:400 13px/1 var(--font)}
.dv-page-piece>.vw-engine{display:block;width:100%;height:80vh;border:0}
@media (max-width:760px){.vw-side-by-side{grid-template-columns:1fr}.vw-side-by-side>iframe{position:static;height:60vh}}
.enr-voices{position:relative}
.enr-voices[data-onde="1"]{height:56px}
.enr-voices[data-onde="1"] .enr-voice{opacity:.16}
.enr-voices[data-onde="1"] .enr-voice:hover{opacity:.34}
.enr-wave{position:absolute;inset:0;display:flex;align-items:center;gap:1px;pointer-events:none}
.enr-wave i{flex:1 1 0;min-width:1px;background:var(--ink);border-radius:1px}
@media (max-width:520px){.vw-head{flex-wrap:wrap;height:auto;min-height:52px;padding:6px 12px;row-gap:6px}.vw-head-name{flex:1 1 calc(100% - 64px)}.vw-head>.vw-btn:first-of-type{margin-left:auto}}

/* assets/b/drive.css */
/* ==========================================================================
   Escouade · identité B — la Bibliothèque façon Drive (choix du 29/09/2026,
   studio « Escouade - Bibliothèque »). Écran : /drive
   (web/src/ged_drive.rs).

   Trois colonnes : l'arbre des dossiers, le dossier (fil d'Ariane,
   sous-dossiers, fichiers en liste ou en grille), l'aperçu. Sous 900 px, une
   seule colonne ; l'aperçu couvre l'écran.

   Feuille MAISON : le CSS Tailwind est figé, aucune classe utilitaire neuve
   n'aurait d'effet. Seulement les jetons de escouade-b.css. Le vert signal
   ne marque que ce qui attend un geste : le point de « Demander à
   l'assistant », celui d'une suggestion de l'IA, celui du bouton principal.
   Jamais en texte.
   ========================================================================== */

.gd{
  --gd-tree:var(--volet-biblio-arbre,236px);
  --gd-pv:var(--volet-biblio-apercu,clamp(360px,34vw,560px));
  --gd-hover:color-mix(in srgb,var(--card) 55%,var(--paper-2));
  display:grid;grid-template-columns:var(--gd-tree) minmax(0,1fr);grid-template-rows:minmax(0,1fr);gap:0;
  /* La coquille (`#app-main`) est une colonne flexible qui ne défile pas :
     la bibliothèque prend sa hauteur et CHAQUE colonne défile pour elle —
     l'arbre, le dossier, l'aperçu. Sans cela, une grille plus haute que
     l'écran était coupée net, sans barre de défilement. */
  flex:1 1 auto;min-height:0;height:100%;overflow:hidden;background:var(--paper);color:var(--ink);font-size:13px
}
.gd:has(.gd-preview){grid-template-columns:var(--gd-tree) minmax(0,1fr) var(--gd-pv)}
.gd :is(a,button,input,select,textarea,summary,label):focus-visible{outline:2px solid var(--ink);outline-offset:2px}
.gd mark{background:color-mix(in srgb,var(--ink) 9%,transparent);color:inherit;border-radius:2px;box-shadow:inset 0 -1.5px 0 var(--ink)}
.gd .sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.gd-muted{color:var(--ink-3)}

/* ---- Boutons et menus -------------------------------------------------- */
.gd-btn{display:inline-flex;align-items:center;gap:6px;height:30px;padding:0 11px;border:1px solid var(--line-2);border-radius:var(--r-sm);background:var(--card);color:var(--ink);font:500 13px/1 var(--font);cursor:pointer;text-decoration:none;white-space:nowrap}
.gd-btn:hover{border-color:var(--ink-3)}
.gd-btn.gd-primary{background:var(--ink);border-color:var(--ink);color:var(--paper)}
.gd-btn.gd-primary::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--signal)}
.gd-btn.gd-ghost{border-color:transparent;background:transparent;color:var(--ink-2)}
.gd-btn.gd-danger{color:var(--danger)}
.gd-btn.gd-disabled{opacity:.45;cursor:default}
.gd summary{list-style:none;cursor:pointer}
.gd summary::-webkit-details-marker{display:none}
.gd-iconbtn{display:inline-grid;place-items:center;width:30px;height:30px;border-radius:var(--r-sm);color:var(--ink-2);border:1px solid transparent;background:transparent}
.gd-iconbtn:hover{background:var(--paper-2);color:var(--ink)}
.gd-new,.gd-advanced,.gd-menu,.gd-sort{position:relative}
.gd-pop{position:absolute;z-index:20;top:calc(100% + 4px);left:0;min-width:220px;display:flex;flex-direction:column;padding:4px;background:var(--card);border:1px solid var(--line-2);border-radius:var(--r);box-shadow:var(--shadow-pop,var(--shadow-frame))}
.gd-pop-right{left:auto;right:0}
.gd-pop-up{top:auto;bottom:calc(100% + 4px)}
.gd-pop hr{border:0;border-top:1px solid var(--line);margin:4px 2px}
.gd-pop form{margin:0}
.gd-pop-item{display:flex;align-items:center;gap:8px;width:100%;min-height:30px;padding:4px 8px;border:0;border-radius:6px;background:transparent;color:var(--ink);font:400 13px/1.3 var(--font);text-align:left;text-decoration:none;cursor:pointer;white-space:nowrap}
.gd-pop-item:hover,.gd-pop-item[aria-current]{background:var(--paper-2)}
.gd-pop-item svg{color:var(--ink-3);flex:none}
.gd-pop-item.gd-danger,.gd-pop-item.gd-danger svg{color:var(--danger)}
.gd-pop-cap{margin:4px 8px 2px;font:500 10.5px/1.2 var(--font);letter-spacing:.06em;text-transform:uppercase;color:var(--ink-3)}
.gd-pop-note{margin:6px 8px 4px;font-size:12px;color:var(--ink-3);white-space:normal;max-width:260px}
.gd-pop-sub>.gd-form{padding:6px 8px 8px}
.gd-dot{width:7px;height:7px;border-radius:50%;background:var(--signal);flex:none;display:inline-block}
.gd-ask{font-weight:500}
.gd-menu .gd-pop{min-width:236px}

/* ---- L'arbre ----------------------------------------------------------- */
.gd-tree-wrap{min-height:0;overflow:auto;overscroll-behavior:contain;border-right:1px solid var(--line);padding:10px 8px 24px}
.gd-tree-toggle{display:none}
.gd-tree ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:1px}
.gd-node{--d:0;display:flex;align-items:center;gap:7px;min-height:30px;padding:4px 8px 4px calc(8px + var(--d) * 14px);border-radius:7px;color:var(--ink-2);text-decoration:none;font-size:13px}
.gd-node:hover{background:var(--gd-hover);color:var(--ink)}
.gd-node svg{flex:none;color:var(--ink-3)}
.gd-node.gd-current{background:var(--paper-2);color:var(--ink);font-weight:500}
.gd-node.gd-current svg{color:var(--ink)}
.gd-node-label{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.gd-node-count{font-size:11px;color:var(--ink-3);font-variant-numeric:tabular-nums}
/* Les fichiers arrivés dans un drive depuis la dernière visite (Drive Escouade,
   Google Drive — 2026-10-22) : une pastille au signal, devant le compte. */
.gd-node-new{flex:none;min-width:18px;padding:0 5px;border-radius:var(--r-round);background:var(--signal-soft);box-shadow:inset 0 0 0 1px var(--signal);color:var(--ink);font:600 10.5px/16px var(--font);text-align:center;font-variant-numeric:tabular-nums}
.gd-more{color:var(--ink-3);font-size:12px}
.gd-tree-cap{margin:14px 8px 4px;font:500 10.5px/1.2 var(--font);letter-spacing:.06em;text-transform:uppercase;color:var(--ink-3)}
.gd-tree-foot{margin-top:14px;padding-top:8px;border-top:1px solid var(--line)}

/* ---- Le dossier -------------------------------------------------------- */
.gd-main{min-width:0;min-height:0;overflow-y:auto;overscroll-behavior:contain;padding:12px 20px 40px;display:flex;flex-direction:column;gap:10px}
/* La colonne DÉFILE : aucune de ses rangées ne se tasse. Sans cela, une
   liste plus haute que l'écran faisait rétrécir chaque rangée vers son
   `min-height` explicite — l'en-tête (`.gd-head`, 34 px) passé sur deux
   lignes quand l'aperçu est ouvert gardait 34 px, et sa seconde ligne (le
   filtre « Tous les types ») recouvrait le titre « Fichiers » (22/10). */
.gd-main>*{flex-shrink:0}
.gd-bar{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.gd-search{flex:1;min-width:220px;max-width:640px;height:34px;display:flex;align-items:center;gap:8px;padding:0 10px;border:1px solid var(--line-2);border-radius:var(--r-sm);background:var(--card);color:var(--ink-3)}
/* UN seul indicateur de focus pour un champ dans un cadre : l'anneau
   arrondi du CADRE (`:focus-within`), jamais le contour propre du champ à
   l'intérieur (le rectangle noir anguleux qui doublait le cadre). */
.gd-search:focus-within,.gd-folderfilter:focus-within{border-color:var(--ink);box-shadow:0 0 0 1px var(--ink),var(--ring-ink)}
.gd :is(.gd-search,.gd-folderfilter) input:focus-visible{outline:none}
.gd-search input{flex:1;min-width:0;border:0;background:transparent;color:var(--ink);font:400 13.5px/1 var(--font);outline:none}
.gd-search a{color:var(--ink-3);display:inline-flex}
.gd-actions{display:flex;align-items:center;gap:6px;margin-left:auto}
.gd-viewtoggle{display:inline-flex;border:1px solid var(--line-2);border-radius:var(--r-sm);overflow:hidden;background:var(--card)}
.gd-viewtoggle button{display:inline-grid;place-items:center;width:32px;height:30px;border:0;background:transparent;color:var(--ink-3);cursor:pointer}
.gd-viewtoggle button[aria-pressed=true]{background:var(--paper-2);color:var(--ink)}
.gd-new .ged-upload-button{position:relative;overflow:hidden}
.gd-new .ged-upload-button input{position:absolute;inset:0;opacity:0;cursor:pointer}
/* Rattacher les fichiers déposés à un contact, à une affaire (2026-10-20). */
.gd-new .ged-attach-form{padding:2px 8px 6px}
.gd-new .ged-attach-form .gd-btn{margin-top:0}
.ged-attach-chosen{flex-wrap:wrap;white-space:normal;cursor:default}
.ged-attach-chosen:hover{background:transparent}
.ged-attach-chosen b{font-weight:500}
.ged-attach-chosen a{margin-left:auto;font-size:12px;color:var(--ink-3)}
.ged-attach-active a{margin-left:6px;color:inherit;text-decoration:underline}
.gd-head{display:flex;align-items:center;gap:12px;flex-wrap:wrap;justify-content:space-between;min-height:34px}
.gd-crumbs{display:flex;align-items:center;gap:4px;min-width:0;flex-wrap:wrap;font-size:14px;color:var(--ink-3)}
.gd-crumbs a{color:var(--ink-2);text-decoration:none;border-radius:5px;padding:2px 4px}
.gd-crumbs a:hover{background:var(--paper-2);color:var(--ink)}
.gd-crumbs span[aria-current]{color:var(--ink);font-weight:600;padding:2px 4px;font-size:15px;letter-spacing:-.01em}
.gd-crumbs svg{color:var(--ink-faint)}
.gd-filters{display:flex;align-items:center;gap:6px;flex-wrap:wrap;min-width:0}
.gd-typefilter{display:flex;align-items:center;gap:6px;flex-wrap:wrap;min-width:0}
.gd-typefilter select{height:30px;max-width:220px;min-width:0;border:1px solid var(--line-2);border-radius:var(--r-sm);background:var(--card);color:var(--ink);font:400 13px/1 var(--font);padding:0 8px}
.gd-notice,.gd-error{margin:0;padding:8px 12px;border-radius:var(--r-sm);font-size:13px;background:var(--card);border:1px solid var(--line)}
.gd-error{border-color:var(--danger);color:var(--danger)}
.gd-notice[hidden]{display:none}
.gd-results{position:relative;display:flex;flex-direction:column;gap:18px;min-height:240px}
.gd-section-head{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;margin-bottom:8px}
.gd-section-head h2{margin:0;font:600 13px/1.3 var(--font);color:var(--ink)}
.gd-folderfilter{margin-left:auto;display:flex;align-items:center;gap:6px;height:30px;padding:0 8px;border:1px solid var(--line-2);border-radius:var(--r-sm);background:var(--card);color:var(--ink-3)}
.gd-folderfilter input{border:0;background:transparent;color:var(--ink);font:400 13px/1 var(--font);outline:none;width:180px}

/* Les dossiers : des tuiles basses, carré = matière. */
.gd-folder-grid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:8px}
.gd-folder{display:flex;align-items:center;gap:9px;min-height:44px;padding:8px 12px;border:1px solid var(--line);border-radius:var(--r);background:var(--card);color:var(--ink);text-decoration:none;box-shadow:var(--shadow-1)}
.gd-folder:hover{border-color:var(--line-2);background:var(--gd-hover)}
.gd-folder svg{color:var(--ink-2);flex:none}
.gd-folder-label{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:500}
.gd-folder-count{font-size:12px;color:var(--ink-3);font-variant-numeric:tabular-nums}
.gd-folder-manual{border-style:dashed}
/* Un dossier du Drive Escouade porte son menu ⋯ sur sa tuile (2026-10-22) —
   sans transformation : le menu ouvert reste au-dessus des tuiles voisines. */
.gd-folder-item{position:relative}
.gd-folder-item>.gd-folder{padding-right:42px}
.gd-folder-item>.gd-menu{position:absolute;top:7px;right:6px}

/* Les fichiers : la liste. */
/* La largeur de la liste se lit sur la LISTE, pas sur l'écran : l'arbre, la
   barre latérale, le chat et l'aperçu (jusqu'à 560 px) la rognent sans que
   la fenêtre change. Avec `table-layout:fixed`, le nom est la seule colonne
   sans largeur : il reçoit ce qui reste après la case, la date, « De », la
   taille et le menu (546 px avec leurs marges) — et, sous ce seuil, RIEN.
   Le 22/10, aperçu ouvert dans une fenêtre de 1 900 px : plus de nom, et
   l'en-tête « Nom » débordait sur « Date ». D'où trois gestes : la liste
   est un conteneur, « De » puis « Date » se retirent quand la place manque
   (plus bas), et la table ne descend pas sous 320 px — au-delà, elle défile
   de côté plutôt que d'écraser le nom. */
.gd-table-wrap{overflow-x:auto;border-top:1px solid var(--line);container:gd-list/inline-size}
.gd-table{width:100%;min-width:320px;table-layout:fixed;border-collapse:collapse;font-size:13px}
.gd-table thead th{height:32px;padding:0 10px;text-align:left;font-weight:500;font-size:12px;color:var(--ink-3);border-bottom:1px solid var(--line);white-space:nowrap}
.gd-table tbody td{padding:6px 10px;border-bottom:1px solid var(--line);color:var(--ink-2);vertical-align:middle}
.gd-table tbody tr:hover td{background:var(--gd-hover)}
.gd-table tbody tr:has(.ged-check input:checked) td{background:var(--paper-2)}
.gd-col-check{width:36px}
.gd-col-name{min-width:0;width:auto;overflow:hidden}
.gd-table th.gd-col-name{text-overflow:ellipsis}
.gd-col-date{width:110px;white-space:nowrap;font-variant-numeric:tabular-nums;color:var(--ink)}
.gd-col-from{width:180px;max-width:220px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.gd-col-size{width:80px;text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums}
.gd-table th.gd-col-size{text-align:right}
.gd-col-act{width:40px;text-align:right}
.gd-arrival{color:var(--ink-3)!important}
.gd-name{display:inline-flex;align-items:center;gap:9px;max-width:100%;padding:0;border:0;background:transparent;color:var(--ink);font:500 13px/1.35 var(--font);text-align:left;cursor:pointer}
.gd-title{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.gd-name:hover .gd-title{text-decoration:underline;text-decoration-color:var(--line-2);text-underline-offset:3px}
.gd-kind{display:inline-grid;place-items:center;width:26px;height:26px;flex:none;border-radius:var(--r-icon);background:var(--paper-2);color:var(--ink-2);box-shadow:inset 0 0 0 1px var(--line)}
.gd-kind-lg{width:64px;height:64px;border-radius:var(--r)}
.gd-place{display:block;margin:2px 0 0 35px;font-size:12px;color:var(--ink-3);text-decoration:none}
.gd-place:hover{color:var(--ink);text-decoration:underline}
.gd-excerpts{margin:4px 0 0 35px;display:flex;flex-direction:column;gap:2px}
.gd-excerpts p{margin:0;font-size:12px;color:var(--ink-2);line-height:1.45;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.ged-check input{accent-color:var(--ink)}
/* Le nom garde toujours ~180 px : « De » part sous 780 px de liste, la date
   sous 560, la taille d'un fichier sous 420 (le compte de la table des
   sources, lui, reste). L'en-tête et les cellules portent la même classe :
   la colonne part en entier. */
@container gd-list (max-width:780px){.gd-table .gd-col-from{display:none}}
@container gd-list (max-width:560px){.gd-table .gd-col-date{display:none}}
@container gd-list (max-width:420px){.gd-table:not(.gl-sources-table) .gd-col-size{display:none}}
.gd-folder-table .gd-col-count{width:110px;text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
.gd-folder-table .gd-col-date{width:130px}
.gd-folder-table .gd-col-act{width:44px;text-align:right}
.gd-folder-table thead th a.gd-sort-head{display:inline-flex;align-items:center;gap:4px;color:inherit;text-decoration:none}
.gd-folder-table thead th a.gd-sort-head:hover,.gd-folder-table thead th[aria-sort] a.gd-sort-head{color:var(--ink)}
.gd-folder-table thead th a.gd-sort-head:focus-visible{outline:2px solid var(--accent,currentColor);outline-offset:2px;border-radius:4px}
.gd-folder-table th.gd-col-count a.gd-sort-head{flex-direction:row-reverse}
.gd-folder-link{display:flex;align-items:center;gap:8px;min-width:0;color:var(--ink);text-decoration:none;font-weight:500}
.gd-folder-link .gd-folder-label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.gd-folder-link:hover .gd-folder-label{text-decoration:underline}
.gd-folder-link svg{flex:none;color:var(--ink-3)}
.gd-folder-table tr.gd-folder-manual .gd-folder-link svg{color:var(--accent,var(--ink-3))}
@container gd-list (max-width:560px){.gd-folder-table .gd-col-date{display:table-cell;width:96px}.gd-folder-table .gd-col-count{width:72px}}

/* Les fichiers : la grille. */
.gd-grid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:10px}
.gd-card{display:flex;flex-direction:column;border:1px solid var(--line);border-radius:var(--r);background:var(--card);overflow:visible;box-shadow:var(--shadow-1)}
.gd-card:has(.ged-check input:checked){border-color:var(--ink)}
.gd-thumb{display:grid;place-items:center;height:120px;padding:0;border:0;border-bottom:1px solid var(--line);border-radius:var(--r) var(--r) 0 0;background:var(--paper-2);cursor:pointer;overflow:hidden}
.gd-thumb{position:relative}
.gd-thumb-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;background:transparent}
.gd-thumb-type{position:absolute;left:8px;bottom:6px;font:500 10.5px/1.2 var(--font);letter-spacing:.04em;text-transform:uppercase;color:var(--ink-3)}
.gd-thumb-page{object-position:top;background:#fff}
.gd-thumb-img~.gd-thumb-type{padding:1px 5px;border-radius:var(--r-sm);background:var(--card);box-shadow:var(--shadow-1)}
.gd-card-foot{display:flex;align-items:center;gap:6px;padding:6px 6px 6px 10px;min-width:0}
.gd-card-text{flex:1;min-width:0;display:flex;flex-direction:column;gap:1px}
.gd-card-text .gd-name{font-size:12.5px;align-items:flex-start;max-width:100%}
/* Un nom de grille tient sur DEUX lignes avant de se couper, et se lit en
   entier au survol (`title`) : « Données structu… » ne disait rien. */
.gd-card-text .gd-title{white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;overflow-wrap:anywhere;line-height:1.3}
.gd-card-text .gd-muted{font-size:11.5px}

/* Sélection, pages, état vide. */
.gd-selection{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:0 0 10px;padding:8px 10px;background:var(--card);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--shadow-frame)}
.gd-selection b{font-weight:600;margin-right:4px}
.gd-pager{display:flex;align-items:center;justify-content:center;gap:12px;margin-top:14px}
.gd-empty{display:grid;justify-items:center;gap:6px;padding:48px 16px;text-align:center;color:var(--ink-3);border:1px dashed var(--line-2);border-radius:var(--r)}
.gd-empty h3{margin:0;font:600 14px/1.3 var(--font);color:var(--ink)}
.gd-empty p{margin:0;font-size:13px;max-width:46ch}

/* ---- L'aperçu ---------------------------------------------------------- */
.gd-preview-host:not(:has(.gd-preview)){display:none}
.gd-preview-host{min-height:0;overflow:hidden}
.gd-preview{height:100%;min-height:0;display:flex;flex-direction:column;background:var(--card);border-left:1px solid var(--line)}
.gd-preview-head{display:flex;align-items:center;gap:9px;min-height:52px;padding:8px 10px 8px 14px;border-bottom:1px solid var(--line)}
.gd-preview-head h2{flex:1;min-width:0;margin:0;font:600 14px/1.3 var(--font);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.gd-preview-body{flex:1;min-height:0;overflow:auto;padding:14px;display:flex;flex-direction:column;gap:14px}
/* Le volet DÉFILE, ses blocs ne rétrécissent pas : sans cela, la page (son
   overflow:hidden met son min-height à 0) s'écrasait à quelques pixels dès
   que « Ce qu'Escouade a lu » et les informations dépassaient la hauteur. */
.gd-preview-body>*{flex-shrink:0}
.gd-preview-page{border:1px solid var(--line);border-radius:var(--r);background:var(--paper);overflow:hidden}
.gd-preview-page>*{max-width:100%}
/* La page se lit à la largeur du volet, au format A4 ; le volet défile. */
.gd-preview-page>iframe{height:auto!important;aspect-ratio:210/297;min-height:360px}
.gd-preview-page{cursor:zoom-in}
.gd-preview-page :is(a,button){cursor:pointer}
/* « Ouvrir en grand » : la visionneuse modale, la même page sur toute la
   zone de contenu ; la place du chat latéral reste libre (chat-lateral.css). */
.gd-viewer-layer{position:fixed;inset:0;z-index:60;display:flex;padding:12px;background:rgb(0 0 0/.45)}
.gd-viewer{flex:1;min-width:0;min-height:0;display:flex;flex-direction:column;background:var(--card);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--shadow-frame);overflow:hidden}
.gd-viewer-head{display:flex;align-items:center;gap:9px;min-height:52px;padding:8px 10px 8px 14px;border-bottom:1px solid var(--line)}
.gd-viewer-head h2{flex:1;min-width:0;margin:0;font:600 14px/1.3 var(--font);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
@media (max-width:520px){.gd-viewer-head{flex-wrap:wrap;row-gap:6px}.gd-viewer-head h2{flex:1 1 calc(100% - 50px)}.gd-viewer-head>.gd-btn:first-of-type{margin-left:auto}}
.gd-viewer-page{flex:1;min-height:0;display:flex;flex-direction:column;overflow:auto;background:var(--paper-2)}
.gd-viewer-page>iframe{flex:1 1 0;width:100%;height:auto!important;min-height:0;border:0;background:var(--paper)}
.gd-viewer-page>img{flex:1 1 0;min-height:0;width:100%;height:100%;max-height:none!important;object-fit:contain}
.gd-viewer-page>:not(iframe):not(img){margin:auto}
@media (max-width:640px){.gd-viewer-layer{padding:0}.gd-viewer{border:0;border-radius:0}}
/* La proposition : une ligne, ses gestes ; le reste sous « Détails ». */
.gd-suggestion-line{display:flex;align-items:center;gap:6px;min-width:0}
.gd-suggestion-text{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:13px}
.gd-suggestion-more summary{cursor:pointer;font-size:12px;color:var(--ink-3)}
.gd-suggestion-more p{margin:6px 0 0;font-size:12.5px;line-height:1.45}
.gd-photo{display:block;width:100%;height:auto;max-height:560px;object-fit:contain;background:var(--paper-2)}
.gd-frame{display:block;width:100%;height:520px;border:0;background:var(--paper)}
.gd-noprev{display:grid;justify-items:center;gap:8px;padding:36px 16px;text-align:center;color:var(--ink-3)}
.gd-noprev p{margin:0;max-width:34ch;font-size:13px}
.gd-info{display:grid;grid-template-columns:auto minmax(0,1fr);gap:7px 14px;margin:0;font-size:13px}
.gd-info dt{color:var(--ink-3)}
.gd-info dd{margin:0;color:var(--ink);min-width:0;overflow-wrap:anywhere}
.gd-info dd a{color:var(--ink)}
.gd-tag{display:inline-flex;align-items:center;height:20px;padding:0 8px;border-radius:var(--r-pill);background:var(--paper-2);color:var(--ink-2);font-size:12px}
.gd-chips{display:flex;flex-wrap:wrap;gap:4px;list-style:none;margin:0;padding:0}
.gd-chip{display:inline-flex;align-items:center;height:22px;padding:0 9px;border:1px solid var(--line-2);border-radius:var(--r-pill);color:var(--ink);text-decoration:none;font-size:12px;background:var(--card)}
.gd-chip:hover{border-color:var(--ink)}
.gd-suggestion{margin:0;padding:10px 12px;border:1px solid var(--line-2);border-radius:var(--r);background:var(--paper);display:flex;flex-direction:column;gap:6px}
.gd-suggestion p{margin:0;font-size:13px;display:flex;align-items:baseline;gap:6px;flex-wrap:wrap}
.gd-suggestion .gd-dot{align-self:center}
.gd-row-actions{display:flex;gap:6px}
.gd-preview-excerpts h3,.gd-panel h3{margin:0 0 6px;font:500 10.5px/1.2 var(--font);letter-spacing:.06em;text-transform:uppercase;color:var(--ink-3)}
.gd-preview-excerpts p{margin:0 0 6px;padding:8px 10px;border-radius:var(--r-sm);background:var(--paper-2);font-size:12.5px;line-height:1.5;color:var(--ink-2)}
.gd-panel{padding:12px;border:1px solid var(--line-2);border-radius:var(--r);background:var(--card)}
.gd-panel-head{display:flex;align-items:center;justify-content:space-between}
.gd-form{display:flex;flex-direction:column;gap:6px}
.gd-form label{font-size:12px;color:var(--ink-2)}
.gd-form input[type=text],.gd-form select{height:32px;border:1px solid var(--line-2);border-radius:var(--r-sm);background:var(--card);color:var(--ink);font:400 13px/1 var(--font);padding:0 9px}
.gd-form input[type=file]{font-size:12px}
.gd-form p{margin:0;font-size:12px}
.gd-form .gd-btn{align-self:flex-start;margin-top:4px}
.gd-versions{list-style:none;margin:0 0 10px;padding:0;display:flex;flex-direction:column;gap:6px}
.gd-versions li{display:flex;align-items:center;gap:8px;font-size:13px}
.gd-preview-foot{display:flex;align-items:center;gap:6px;flex-wrap:wrap;padding:10px 14px;border-top:1px solid var(--line)}
.gd-preview-foot .gd-menu{margin-left:auto}
.gd-mail dl{display:grid;grid-template-columns:auto 1fr;gap:4px 12px;margin:0 0 12px;font-size:13px}

/* ---- Les options avancées (AVANCE-B) -----------------------------------
   /drive/options : les écrans techniques des administrateurs, DANS
   le cadre de la bibliothèque (ged_drive::render_options). Les onglets
   soulignés à l'encre, comme partout ; aucune couleur. Les volets empruntés
   au Centre de contrôle gardent leur dessin (jetons remappés) : on ne règle
   ici que leur mesure, pour qu'ils tiennent dans la colonne du dossier. */
.gd-advanced>summary[aria-current]{background:var(--paper-2);color:var(--ink)}
.gd-opt-tabs{display:flex;align-items:flex-end;gap:18px;flex-wrap:wrap;border-bottom:1px solid var(--line);margin-top:-2px}
.gd-opt-tab{display:inline-flex;align-items:center;gap:7px;height:38px;color:var(--ink-2);text-decoration:none;font:500 13px/1 var(--font);box-shadow:inset 0 -2px 0 transparent;transition:color var(--d-hover),box-shadow var(--d-hover)}
.gd-opt-tab svg{color:var(--ink-3)}
.gd-opt-tab:hover{color:var(--ink)}
.gd-opt-tab[aria-current]{color:var(--ink);box-shadow:inset 0 -2px 0 var(--ink)}
.gd-opt-tab[aria-current] svg{color:var(--ink)}
.gd-opt-n{display:inline-grid;place-items:center;min-width:20px;height:18px;padding:0 6px;border-radius:var(--r-pill);background:var(--paper-2);color:var(--ink-2);font-size:11px;font-variant-numeric:tabular-nums}
.gd-opt-notice>*{margin:0}
.gd-opt-body{max-width:1080px;font-size:13px}
.gd-opt-hint{margin:0 0 12px;font-size:13px;line-height:1.5;color:var(--ink-3);max-width:72ch}

/* Les sources : une ligne par provenance, le compte à droite. */
.gd-source-list{list-style:none;margin:0 0 12px;padding:0;border:1px solid var(--line);border-radius:var(--r);background:var(--card);box-shadow:var(--shadow-1)}
.gd-source{display:grid;grid-template-columns:36px minmax(0,1fr) auto;grid-template-areas:"ic text n" "ic links links";gap:4px 12px;align-items:center;padding:12px 14px;border-top:1px solid var(--line)}
.gd-source:first-child{border-top:0}
.gd-source-ic{grid-area:ic;align-self:start;display:inline-grid;place-items:center;width:32px;height:32px;border-radius:var(--r-icon);background:var(--paper-2);color:var(--ink-2);box-shadow:inset 0 0 0 1px var(--line)}
.gd-source-text{grid-area:text;display:flex;flex-direction:column;gap:2px;min-width:0}
.gd-source-text b{font-weight:600;color:var(--ink)}
.gd-source-text .gd-muted{font-size:12.5px;line-height:1.45}
.gd-source-n{grid-area:n;font-variant-numeric:tabular-nums;color:var(--ink);font-weight:500;white-space:nowrap}
.gd-source-links{grid-area:links;display:flex;flex-wrap:wrap;gap:6px}
.gd-source-links:empty{display:none}
.gd-source-registry a{color:var(--ink);text-decoration:underline;text-decoration-color:var(--line-2);text-underline-offset:3px}

/* ---- Téléphone et petites largeurs ------------------------------------- */
@media (min-width:901px) and (max-width:1200px){
  .gd:has(.gd-preview){grid-template-columns:var(--gd-tree) minmax(0,1fr)}
  .gd-preview-host:has(.gd-preview){position:fixed;inset:0 0 0 auto;width:min(480px,100vw);z-index:60;background:var(--card);box-shadow:var(--shadow-frame)}
  .gd-preview{position:static;height:100%}
}
@media (max-width:900px){
  .gd,.gd:has(.gd-preview){grid-template-columns:minmax(0,1fr);grid-template-rows:none;grid-auto-rows:max-content;align-content:start;overflow-y:auto}
  .gd-tree-wrap{overflow:visible;border-right:0;border-bottom:1px solid var(--line);padding:8px 12px}
  .gd-main{overflow:visible}
  .gd-tree-toggle{display:flex;align-items:center;gap:8px;min-height:36px;font-weight:500;color:var(--ink)}
  .gd-tree{max-height:46vh;overflow:auto}
  .gd-main{padding:10px 12px 32px}
  .gd-actions{margin-left:0}
  .gd-search{min-width:0;max-width:none;flex-basis:100%}
  .gd-col-from,.gd-col-size{display:none}
  .gd-col-date{width:88px}
  .gd-folder-grid{grid-template-columns:repeat(auto-fill,minmax(150px,1fr))}
  .gd-grid{grid-template-columns:repeat(auto-fill,minmax(140px,1fr))}
  .gd-preview-host:has(.gd-preview){position:fixed;inset:0;z-index:60;background:var(--card)}
  .gd-preview{position:static;height:100%;border-left:0}
  .gd-folderfilter{margin-left:0;width:100%}
  .gd-folderfilter input{width:100%}
  .gd-opt-tabs{gap:14px;overflow-x:auto;flex-wrap:nowrap}
  .gd-opt-tab{flex:none}
  .gd-source{grid-template-columns:32px minmax(0,1fr);grid-template-areas:"ic text" "ic n" "ic links"}
}
/* Le logo de l'application est posé en haut à gauche sous 768 px : le titre du volet se décale pour ne pas passer dessous (4/11, Voix). */
@media (max-width:767px){.gd-tree-toggle{padding-left:44px}}
@media (prefers-reduced-motion:reduce){.gd *{transition:none!important;animation:none!important}}

/* ==========================================================================
   Studio Bibliothèque du 01/10/2026 (web/src/ged_library.rs) :
   promesse, affaires actives, puces de recherche, réponse sourcée, groupes,
   courriels et pièces, planche « Photos à relier », preuves, sources,
   partage. Feuille MAISON (le CSS Tailwind est figé) ; jetons de
   escouade-b.css seulement. Le vert ne marque que ce qui attend un geste.
   ========================================================================== */

/* La promesse (PROMESSE-A). */
.gl-promise h1{margin:2px 0 2px;font:600 22px/1.2 var(--font);letter-spacing:var(--ls-h2);color:var(--ink)}
.gl-promise p{margin:0;max-width:72ch;font-size:14px;line-height:1.5;color:var(--ink-2)}

/* Les affaires actives (ACCUEIL-B) : des cartes basses, carré = matière. */
.gl-more{margin-left:auto;font-size:12.5px;color:var(--ink-2);text-decoration:none}
.gl-more:hover{color:var(--ink);text-decoration:underline}
.gl-cards{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:8px}
.gl-card{display:flex;flex-direction:column;gap:4px;min-height:78px;padding:10px 12px;border:1px solid var(--line);border-radius:var(--r);background:var(--card);color:var(--ink);text-decoration:none;box-shadow:var(--shadow-1)}
.gl-card:hover{border-color:var(--line-2);background:var(--gd-hover)}
.gl-card-title{display:flex;align-items:center;gap:8px;font-weight:600;min-width:0}
.gl-card-title span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.gl-card-title svg{flex:none;color:var(--ink-2)}
.gl-card .gd-muted{font-size:12px}
.gl-card-new{display:inline-flex;align-items:center;gap:6px;font-size:12px;color:var(--ink-2)}

/* Les puces de la recherche (FILTRES-A) : la grammaire des pastilles de la palette. */
.gl-chips{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin-top:-4px}
.gl-chip{position:relative}
.gl-chip>summary,.gl-chip-toggle{display:inline-flex;align-items:center;gap:5px;height:26px;padding:0 10px;border:1px solid var(--line-2);border-radius:var(--r-pill);background:var(--card);color:var(--ink-2);font:500 12.5px/1 var(--font);text-decoration:none;cursor:pointer;white-space:nowrap}
.gl-chip>summary:hover,.gl-chip-toggle:hover{border-color:var(--ink-3);color:var(--ink)}
.gl-chip-on>summary,.gl-chip-toggle.gl-chip-on{border-color:var(--ink);color:var(--ink);background:var(--paper-2)}
.gl-chip-k{color:var(--ink-3)}
.gl-chip>summary svg{color:var(--ink-3)}
.gl-chip-pop{min-width:240px;max-height:320px;overflow:auto}
.gl-chip-pop .gd-form{padding:6px 8px 8px}
.gl-chip-v{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis}
.gl-chip-toggle svg{color:var(--ink-3)}

/* La réponse sourcée (RECHERCHE-C) : un bloc calme, la source en carré. */
.gl-answer{padding:12px 14px;border:1px solid var(--line-2);border-radius:var(--r);background:var(--card);box-shadow:var(--shadow-1)}
.gl-answer-text{margin:0 0 8px;font-size:14px;line-height:1.55;color:var(--ink);white-space:pre-wrap}
.gl-answer-sources{margin:0 0 6px;padding-left:20px;font-size:12.5px;color:var(--ink-2)}
.gl-answer-sources li::marker{color:var(--ink-3);font-variant-numeric:tabular-nums}
.gl-answer-sources a{color:var(--ink);text-decoration:underline;text-decoration-color:var(--line-2);text-underline-offset:3px}
.gl-answer-foot{margin:0;font-size:12px}
.gl-answer-foot a{color:var(--ink)}

/* Les résultats : le passage et sa page (RESULTAT-B), les groupes. */
.gl-page{display:inline-flex;align-items:center;height:18px;padding:0 6px;border-radius:var(--r-cite);background:var(--cite-bg);color:var(--cite-ink);font-size:11px;font-variant-numeric:tabular-nums;white-space:nowrap}
.gl-group{display:flex;flex-direction:column;gap:4px}
.gl-group+.gl-group{margin-top:10px}
.gl-group-head{margin:0;font:600 13px/1.3 var(--font);color:var(--ink)}
.gl-group-head a{color:var(--ink);text-decoration:none}
.gl-group-head a:hover{text-decoration:underline}

/* Un courriel, ses pièces en retrait (MAILS-B). */
.gd-table tr.gd-att td{background:color-mix(in srgb,var(--paper-2) 45%,transparent)}
.gd-table tr.gd-att .gd-col-name{padding-left:34px}
.gd-table tr.gd-att .gd-name{font-weight:400}
.gl-att-n{margin-left:8px;gap:3px;height:18px;font-size:11px;vertical-align:middle}
.gd-table tr.gl-dragging td{opacity:.5}
.gd-node.gl-drop-over{outline:1.5px dashed var(--ink);outline-offset:-1px;background:var(--paper-2);color:var(--ink)}

/* La planche « Photos à relier » (PHOTOS-B). */
.gl-photos{display:flex;flex-direction:column;gap:10px}
.gl-shoot{display:flex;flex-direction:column;gap:8px;padding:12px;border:1px solid var(--line);border-radius:var(--r);background:var(--card);box-shadow:var(--shadow-1)}
.gl-shoot-head{display:flex;flex-wrap:wrap;align-items:baseline;gap:8px}
.gl-shoot-head .gd-muted{font-size:12.5px}
.gl-thumbs{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(84px,1fr));gap:6px}
.gl-thumb{position:relative;display:grid;place-items:center;width:100%;aspect-ratio:1;padding:0;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--paper-2);color:var(--ink-3);overflow:hidden;cursor:pointer}
.gl-thumb img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.gl-thumb-more{display:grid;place-items:center;aspect-ratio:1;border:1px dashed var(--line-2);border-radius:var(--r-sm);color:var(--ink-2);font-size:13px;font-variant-numeric:tabular-nums}
.gl-proof{margin:0;display:flex;align-items:center;gap:7px;font-size:12.5px;color:var(--ink-2)}
.gl-shoot-actions{display:flex;flex-wrap:wrap;align-items:flex-start;gap:6px}
.gl-shoot-actions form{margin:0}
.gl-other{position:relative}
.gl-other>.gd-form{position:absolute;z-index:20;top:calc(100% + 4px);left:0;min-width:260px;padding:10px;background:var(--card);border:1px solid var(--line-2);border-radius:var(--r);box-shadow:var(--shadow-pop,var(--shadow-frame))}

/* Les preuves d'un rattachement (RATTACHER-B). */
.gl-hints{display:flex;flex-direction:column;gap:6px;margin-bottom:10px}
.gl-hint{display:flex;align-items:center;gap:10px;margin:0;padding:8px 10px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--paper)}
.gl-hint-text{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.gl-hint-text .gd-muted{font-size:12px;line-height:1.4}

/* Les sources (VIDE-C). */
.gl-src-name{display:inline-flex;align-items:center;gap:8px;min-width:0}
.gl-src-name svg{flex:none;color:var(--ink-3)}
.gl-src-name a{color:var(--ink);text-decoration:none}
.gl-src-name a:hover{text-decoration:underline}
.gl-state{display:inline-flex;align-items:center;gap:7px;color:var(--ink-2)}
.gl-state::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--ink-3)}
.gl-state[data-state=warn]{color:var(--danger)}
.gl-state[data-state=warn]::before{background:var(--danger)}
.gl-state[data-state=idle]::before{background:transparent;box-shadow:inset 0 0 0 1.5px var(--ink-faint)}

/* Le partage (PARTAGE-B et C). */
.gl-share{display:flex;flex-direction:column;gap:12px}
.gl-share-block{display:flex;flex-direction:column;gap:6px}
.gl-share-block .gd-pop-cap{margin:0}
.gl-grants,.gl-links{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:4px}
.gl-grants li{display:flex;align-items:center;gap:8px;font-size:13px}
.gl-grants li span:first-child{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis}
.gl-grants form{margin:0}
.gl-share-add select{height:32px;border:1px solid var(--line-2);border-radius:var(--r-sm);background:var(--card);color:var(--ink);font:400 13px/1 var(--font);padding:0 8px}
.gl-link{display:flex;align-items:center;gap:8px;padding:8px 10px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--paper)}
.gl-link-off{opacity:.65}
.gl-link-text{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px;font-size:13px}
.gl-link-text .gd-muted{font-size:12px}
.gl-link form{margin:0}
.gl-share-pop{min-width:300px;padding:10px}
.gl-created{max-width:640px;display:flex;flex-direction:column;gap:10px;padding:16px;border:1px solid var(--line-2);border-radius:var(--r);background:var(--card);box-shadow:var(--shadow-1)}
.gl-created h2{margin:0;font:600 16px/1.3 var(--font)}
.gl-created p{margin:0;font-size:13px}
.gl-created-url{height:36px;border:1px solid var(--line-2);border-radius:var(--r-sm);background:var(--paper);color:var(--ink);font:400 13px/1 ui-monospace,SFMono-Regular,Menlo,monospace;padding:0 10px}

/* Les réglages de la bibliothèque (options avancées). */
.gl-settings{display:flex;flex-direction:column;gap:18px;max-width:720px}
.gl-settings section{display:flex;flex-direction:column;gap:8px;padding:14px;border:1px solid var(--line);border-radius:var(--r);background:var(--card)}
.gl-settings h3{margin:0;font:600 14px/1.3 var(--font)}
.gl-settings textarea,.gl-settings input[type=text],.gl-settings select{border:1px solid var(--line-2);border-radius:var(--r-sm);background:var(--card);color:var(--ink);font:400 13px/1.4 var(--font);padding:6px 9px}
.gl-settings .gl-check{display:flex;align-items:center;gap:8px;font-size:13px}

@media (max-width:900px){
  .gl-cards{grid-template-columns:repeat(auto-fill,minmax(160px,1fr))}
  .gl-chips{gap:5px}
  .gl-chip-pop{left:0;right:auto;min-width:min(280px,calc(100vw - 32px))}
  .gl-thumbs{grid-template-columns:repeat(auto-fill,minmax(64px,1fr))}
  .gl-hint{flex-wrap:wrap}
  .gd-table tr.gd-att .gd-col-name{padding-left:22px}
  .gl-other>.gd-form{min-width:min(260px,calc(100vw - 40px))}
  .gl-share-pop{min-width:min(300px,calc(100vw - 32px))}
}
/* D47 : l'arbre et l'aperçu se règlent — deux calques de la grille, hors des
   défilements de ses colonnes (`--gd-tree`, `--gd-pv` lisent la largeur du
   membre). L'aperçu passé par-dessus (901–1200 px) et la colonne unique du
   téléphone n'en ont pas. */
.gd{position:relative}
.gd>.volet-poignee{position:absolute;top:0;bottom:0;left:var(--gd-tree)}
.gd-preview-host{position:relative}
.gd-preview-host>.volet-poignee{position:absolute;top:0;bottom:0;left:0}
.gd-preview-host>.volet-poignee::before{left:0}
@media (max-width:1200px){.gd-preview-host>.volet-poignee{display:none}}
@media (max-width:900px){.gd>.volet-poignee{display:none}}

/* assets/b/drives-stockage.css */
/* ==========================================================================
   LE STOCKAGE DE L'ESPACE ET DES DRIVE ESCOUADE (2026-10-31, D59 ;
   web/src/settings_drives.rs, api/src/pages/drive_demande.rs) —
   le volume et sa répartition, les plafonds personnels, les demandes des
   membres. Préfixe `sd-`, jetons de l'identité B seulement : les deux thèmes
   suivent les jetons.
   ========================================================================== */

.sd-barre { position: relative; display: block; height: 6px; min-width: 80px; overflow: hidden; border-radius: 999px; background: var(--paper-2); }
.sd-barre-pleine { position: absolute; inset: 0 auto 0 0; border-radius: 999px; background: var(--signal); }

.sd-stockage { display: flex; flex-direction: column; gap: 12px; }
.sd-total { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 6px; font-size: 15px; }
.sd-total strong { font-size: 20px; font-weight: 600; }
.sd-total .sd-barre { flex: 1 1 100%; height: 8px; margin-top: 6px; }
.sd-parts { display: flex; flex-direction: column; gap: 8px; margin: 0; padding: 0; list-style: none; font-size: 13px; }
.sd-parts li { display: grid; grid-template-columns: minmax(140px, 220px) 1fr auto; align-items: center; gap: 12px; }
.sd-part-nom { color: var(--ink); }
.sd-part-taille { color: var(--ink-2); text-align: right; }

.sd-choix { padding: 4px 8px; border: 1px solid var(--line); border-radius: var(--r-sm); background: var(--card); color: var(--ink); font: inherit; font-size: 13px; }
.sd-choix:focus-visible { outline: none; box-shadow: var(--focus); }

.sd-demande {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px;
  padding: 10px 12px; border: 1px solid var(--line); border-radius: var(--r-sm); background: var(--card);
}
.sd-demande-page .bv-carte + .bv-carte { margin-top: 14px; }

@media (max-width: 640px) {
  .sd-parts li { grid-template-columns: 1fr auto; }
  .sd-parts li .sd-barre { grid-column: 1 / -1; }
}

/* assets/b/enregistrement.css */
/* ==========================================================================
   Escouade · identité B — l'enregistrement (Plaud natif, 1.13.8)
   Écrans : la fiche d'un enregistrement (web::recording, racine .enr,
   en tête de la fiche générique, .enr-record) ; son entrée dans la
   chronologie d'une fiche (web::record_activity, .enr-tl).
   Règles : seulement les jetons d'escouade-b.css, aucune couleur en dur ; le
   passage sur lequel le lecteur est calé se marque au halo du signal, jamais
   en texte vert. Au téléphone : une colonne, le lecteur pleine largeur.
   ========================================================================== */

.enr-cadre{display:flex;flex-direction:column;min-height:0;flex:1}
.enr-cadre>.enr-record,.enr-cadre .enr-record-body{display:contents}
.enr-cadre>.page-head,.enr-cadre .enr-record-body>.page-head{order:-3}
.enr-cadre>.enr-demandes{order:-2}
.enr-cadre .enr{order:-1}
/* Studio h-reunion : la fiche technique sous le compte rendu s'efface hors édition ; « Modifier » y mène. */
.enr-cadre-lecture .b-aside>:not(.b-aside-top){display:none}
.enr-cadre-lecture .b-aside .b-rid{display:none}
.enr-demandes .scv-demandes{margin:12px 24px 0}
@media (max-width:767px){.enr-demandes .scv-demandes{margin:12px 16px 0}}
.enr-record{display:flex;flex-direction:column;min-height:0}
.enr-record-body{flex:1;min-height:0;display:flex;flex-direction:column}

.enr{display:flex;flex-direction:column;gap:16px;width:100%;max-width:1200px;padding:16px 24px 8px;color:var(--ink);font:var(--t-small);box-sizing:border-box}
.enr a{color:inherit}

/* ---- L'en-tête ------------------------------------------------------------ */
.enr-head{display:flex;align-items:flex-start;gap:12px;flex-wrap:wrap}
.enr-ico{display:inline-flex;align-items:center;justify-content:center;flex:none;width:36px;height:36px;border-radius:var(--r-sm);background:var(--paper-2);color:var(--ink-2)}
.enr-head-main{flex:1 1 280px;min-width:0;display:flex;flex-direction:column;gap:2px}
.enr-kicker{font:var(--t-label);letter-spacing:var(--ls-label);text-transform:uppercase;color:var(--ink-3)}
.enr-title{margin:0;font:var(--t-h3);letter-spacing:var(--ls-tight);overflow-wrap:anywhere}
.enr-meta{color:var(--ink-2)}
.enr-meta-k{color:var(--ink-3)}
.enr-head-actions{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.enr-btn{display:inline-flex;align-items:center;gap:6px;height:30px;padding:0 12px;border:1px solid var(--line-2);border-radius:var(--r-sm);background:var(--card);font:var(--t-ui);font-size:13px;text-decoration:none;white-space:nowrap;box-shadow:var(--shadow-1);transition:border-color var(--d-hover)}
.enr-btn:hover{border-color:var(--ink-3)}
.enr-btn:focus-visible{outline:2px solid var(--focus);outline-offset:2px}
.enr-btn svg{flex:none;color:var(--ink-3)}

/* ---- Le lecteur ----------------------------------------------------------- */
.enr-player{position:sticky;top:0;z-index:2;display:flex;flex-direction:column;gap:6px;padding:10px 12px;border:1px solid var(--line);border-radius:var(--r);background:var(--card);scroll-margin-top:16px}
.enr-audio{display:block;width:100%;height:40px}
.enr-cue{margin:0;color:var(--ink-2)}
.enr-note{margin:0;padding:12px;border:1px dashed var(--line-2);border-radius:var(--r);color:var(--ink-2)}
.enr-player .enr-note{border:0;padding:0}

/* ---- La transcription et le compte rendu ---------------------------------- */
.enr-grid{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(0,1fr);gap:16px;align-items:start}
.enr-h{margin:0 0 8px;font:var(--t-label);letter-spacing:var(--ls-label);text-transform:uppercase;color:var(--ink-3)}
.enr-transcript{min-width:0;padding:12px;border:1px solid var(--line);border-radius:var(--r);background:var(--card)}
.enr-segs{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:2px}
.enr-seg{padding:4px 6px;border-radius:var(--r-sm)}
.enr-seg--cue{background:var(--signal-soft);box-shadow:var(--ring-signal)}
.enr-spk{margin-top:8px;font:var(--t-ui);font-size:13px;color:var(--ink)}
.enr-seg:first-child .enr-spk{margin-top:0}
.enr-seg-row{display:flex;gap:10px;align-items:baseline}
.enr-time{flex:none;font-family:var(--mono);font-size:12px;color:var(--ink-3);text-decoration:none;font-variant-numeric:tabular-nums}
.enr-time:hover{color:var(--ink);text-decoration:underline}
.enr-time:focus-visible{outline:2px solid var(--focus);outline-offset:2px;border-radius:2px}
.enr-text{margin:0;min-width:0;color:var(--ink);line-height:1.5;overflow-wrap:anywhere}
.enr-side{min-width:0;display:flex;flex-direction:column;gap:12px}
.enr-block{padding:12px;border:1px solid var(--line);border-radius:var(--r);background:var(--card)}
.enr-summary{color:var(--ink);overflow-wrap:anywhere}
.enr-list{margin:0;padding-left:18px;display:flex;flex-direction:column;gap:6px}
.enr-strong{font-weight:500}
.enr-sub{margin:2px 0 0;color:var(--ink-2)}

/* ---- Dans la chronologie d'une fiche -------------------------------------- */
.enr-tl-ico{display:inline-flex;align-items:center;justify-content:center;width:18px;height:18px;margin-top:-1px;border-radius:var(--r-sm);background:var(--paper-2);color:var(--ink-2)}
.enr-tl-link{color:var(--ink);text-decoration:none}
.enr-tl-link:hover{text-decoration:underline}
/* La puce « Enregistrement » masque ses entrées, comme les autres types. */
.fl-tl:has(input[data-kind=recording]:not(:checked)) [data-tl-kind=recording]{display:none}

@media (max-width:820px){
  .enr{padding:12px 16px 8px}
  .enr-grid{grid-template-columns:minmax(0,1fr)}
  .enr-player{position:static}
}
.enr-privee{display:inline-flex;align-items:center;gap:4px;margin-left:8px;padding:1px 8px;border:1px solid var(--line);border-radius:999px;font-size:12px;color:var(--ink);text-transform:none;letter-spacing:0}
.enr-reliee-geste{display:inline-flex;margin-top:8px}

/* assets/b/entreprise.css */
/* ==========================================================================
   Escouade · identité B — la fiche ENTREPRISE (studio du 29/09/2026)
   Le bandeau de synthèse (ENT-02, ENT-03, ENT-04, ENT-07), l'onglet
   Factures (ENT-05) et l'ordre de la fiche sur téléphone (ENT-10).
   Classes posées par crates/web/src/company_panel.rs.
   Règles : seulement les jetons d'escouade-b.css, aucune couleur en dur.
   Le vert signal ne marque que ce qui attend un geste (le doublon à
   trancher) ; le retard de paiement est au rouge du texte seulement.
   ========================================================================== */

.b-co{display:flex;flex-direction:column;gap:12px;padding:16px 20px;border-bottom:1px solid var(--line);background:var(--card)}
.b-co-top{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px}
.b-co-roles{display:flex;flex-wrap:wrap;align-items:center;gap:6px;min-width:0}
.b-co-role{display:inline-flex;align-items:center;gap:6px;height:24px;padding:0 9px;border-radius:var(--r-pill);background:var(--paper-2);color:var(--ink);font-size:12.5px;font-weight:500;white-space:nowrap}
.b-co-role-n{color:var(--ink-3);font-weight:400;font-size:12px;font-variant-numeric:tabular-nums;margin-left:6px}
.b-co-role .b-co-role-n{margin-left:0}
.b-co-late{display:inline-flex;align-items:center;gap:6px;color:var(--danger);font-size:12.5px;font-weight:500;margin:0}
.b-co-late-dot{width:7px;height:7px;flex:none;border-radius:var(--r-round);background:var(--danger)}
.b-co-late-n{color:var(--danger);font-size:12px;white-space:nowrap}
.b-co-acts{display:flex;flex-wrap:wrap;gap:6px}
.b-co-act{display:inline-flex;align-items:center;gap:6px;height:30px;padding:0 11px;border-radius:var(--r-sm);box-shadow:inset 0 0 0 1px var(--line-2);background:var(--card);color:var(--ink);font-size:13px;font-weight:500;text-decoration:none;white-space:nowrap}
.b-co-act:hover{box-shadow:inset 0 0 0 1px var(--ink)}
.b-co-act svg{color:var(--ink-2)}
.b-co-kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:8px;margin:0}
.b-co-kpi{min-width:0;padding:8px 10px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--card)}
.b-co-kpi dt{color:var(--ink-3);font-size:11.5px;letter-spacing:.02em}
.b-co-kpi dd{margin:2px 0 0;color:var(--ink);font-size:14px;font-weight:600;overflow-wrap:anywhere}
.b-co-kpi dd a{color:var(--ink);text-decoration:none}
.b-co-kpi dd a:hover{text-decoration:underline}
.b-co-kpi-wide{grid-column:span 2}
.b-co-sub{color:var(--ink-3);font-size:12.5px;font-weight:400}
.b-co-num{font-variant-numeric:tabular-nums}
.b-co-none{color:var(--ink-3);font-size:12.5px;font-weight:400}
.b-co-label{color:var(--ink-3);font-size:11.5px;letter-spacing:.02em}
.b-co-compta{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px}
.b-co-tier{display:inline-flex;flex-wrap:wrap;align-items:center;gap:4px 10px;padding:4px 9px;border-radius:var(--r-sm);box-shadow:inset 0 0 0 1px var(--line);color:var(--ink-2);font-size:12.5px;text-decoration:none}
.b-co-tier strong{color:var(--ink);font-weight:500}
.b-co-tier:hover{box-shadow:inset 0 0 0 1px var(--ink-3)}
.b-co-dup{display:flex;flex-direction:column;gap:6px;padding:10px 12px;border:1px solid var(--line-2);border-radius:var(--r-sm);background:var(--card)}
.b-co-dup-t{display:flex;flex-wrap:wrap;align-items:center;gap:4px;margin:0;color:var(--ink);font-size:13px;font-weight:500}
.b-co-dup-t a{color:var(--ink)}
.b-co-dup-dot{width:7px;height:7px;flex:none;margin-right:4px;border-radius:var(--r-round);background:var(--signal)}
.b-co-dup-f{display:flex;flex-wrap:wrap;align-items:center;gap:6px}
.b-co-dup-c{display:inline-flex;align-items:center;gap:6px;margin-right:4px;color:var(--ink-2);font-size:12.5px}
.b-co-dup .b-co-sub{margin:0}
.b-co-btn{height:28px;padding:0 10px;border:0;border-radius:var(--r-sm);background:var(--card);color:var(--ink);font:500 12.5px/1 var(--font);box-shadow:inset 0 0 0 1px var(--line-2);cursor:pointer}
.b-co-btn:hover{box-shadow:inset 0 0 0 1px var(--ink)}
.b-co-btn-q{color:var(--ink-2)}

/* ---- L'onglet Factures -------------------------------------------------- */
.b-inv{display:flex;flex-direction:column;gap:18px}
.b-inv-kpis{margin-bottom:2px}
.b-inv-sec{display:flex;flex-direction:column;gap:8px}
.b-inv-h{display:flex;align-items:baseline;gap:8px;margin:0;color:var(--ink);font-size:14px;font-weight:600}
.b-inv-scroll{overflow-x:auto}
.b-inv-t{width:100%;border-collapse:collapse;font-size:13px}
.b-inv-t th{padding:6px 8px;border-bottom:1px solid var(--line);color:var(--ink-3);font-size:11.5px;font-weight:500;text-align:left;white-space:nowrap}
.b-inv-t td{padding:6px 8px;border-bottom:1px solid var(--line);color:var(--ink);white-space:nowrap}
.b-inv-t td a{color:var(--ink)}
.b-inv-r{text-align:right}
.b-inv-pages{display:flex;gap:14px;font-size:12.5px}
.b-inv-pages a{color:var(--ink-2)}

/* ---- ENT-10 : sur téléphone, l'en-tête, les gestes, puis les affaires et
   les contacts ; les champs de la fiche passent en bas. L'aside se défait
   (display:contents) pour que son haut et son corps se rangent autour de
   la colonne principale. ---------------------------------------------- */
@media (max-width:1023px){
  .b-rec-co .b-aside{display:contents}
  .b-rec-co .b-aside-top{order:0;border-bottom:0}
  .b-rec-co main{order:1}
  .b-rec-co .b-aside-body{order:2;border-top:1px solid var(--line)}
  .b-rec-co .b-aside-body:has(form[action$="/update"]){order:0;flex:none;border-top:0}
  .b-co{padding:12px 16px}
  .b-co-top{flex-direction:column;align-items:stretch}
  .b-co-acts .b-co-act{flex:1;justify-content:center}
  .b-co-kpi-wide{grid-column:auto}
}
@media (prefers-reduced-motion:reduce){.b-co-act,.b-co-btn,.b-co-tier{transition:none}}
.b-co-notice{padding:12px 20px 0;background:var(--card)}
.b-co-notice .esc-banner{margin-bottom:0}

/* ---- ENT-09 : les vues de la liste des entreprises en onglets ----------- */
.b-vtabs{padding:0 10px 6px}
.b-vtabs .view-switch{margin-top:0}

/* assets/b/exclusions.css */
/* ==========================================================================
   LES EXPÉDITEURS EXCLUS D'UNE BOÎTE (HUB-D22, 2026-11-02 ;
   web/src/exclusions_expediteurs.rs) — le bloc d'une boîte, servi à l'étape 3
   des premiers pas du Second cerveau et dans l'onglet Filtres des réglages
   d'Emails. Ses classes seules (`excl-`), les jetons de l'identité B : les
   deux thèmes suivent. Sur téléphone, le champ et son bouton passent l'un
   sous l'autre, et les gestes d'une ligne sous l'expéditeur.
   ========================================================================== */

.excl {
  display: grid; gap: 10px; padding: 16px; border: 1px solid var(--line); border-radius: var(--r-sm);
  background: var(--card); box-shadow: var(--shadow-1); color: var(--ink); scroll-margin-top: 72px;
}
.excl + .excl { margin-top: 12px; }

/* ---- La tête : l'icône, le titre, la boîte --------------------------------- */
.excl-tete { display: flex; align-items: flex-start; gap: 10px; min-width: 0; }
.excl-icone {
  display: inline-flex; flex: 0 0 auto; align-items: center; justify-content: center; width: 30px; height: 30px;
  border-radius: 8px; background: var(--signal-soft); color: var(--signal-text);
}
.excl-tete-texte { min-width: 0; flex: 1 1 auto; }
.excl-titre { margin: 0; font-size: 14px; font-weight: 600; line-height: 1.3; }
.excl-boite { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 6px; margin: 2px 0 0; color: var(--ink-2); font-size: 12px; }
.excl-adresse { min-width: 0; max-width: 100%; overflow: hidden; color: var(--ink); text-overflow: ellipsis; white-space: nowrap; }
.excl-badge {
  display: inline-flex; align-items: center; padding: 1px 7px; border: 1px solid var(--line); border-radius: 999px;
  background: var(--paper-2); color: var(--ink-2); font-size: 11px; font-weight: 500;
}

/* ---- L'aide, les notes, l'avis --------------------------------------------- */
.excl-aide { margin: 0; color: var(--ink-2); font-size: 13px; line-height: 1.5; }
.excl-note { margin: 0; color: var(--ink-2); font-size: 12px; line-height: 1.45; }
.excl-note.is-erreur { color: var(--danger); }
.excl-lecture { display: flex; align-items: flex-start; gap: 6px; }
.excl-lecture svg { flex: 0 0 auto; margin-top: 2px; }
.excl-avis {
  display: flex; align-items: flex-start; gap: 8px; margin: 0; padding: 8px 10px; border: 1px solid var(--line);
  border-radius: var(--r-sm); background: var(--paper-2); color: var(--ink); font-size: 13px; line-height: 1.45;
}
.excl-avis svg { flex: 0 0 auto; margin-top: 2px; color: var(--signal-text); }
.excl-avis.is-erreur { border-color: var(--danger); color: var(--danger); }
.excl-avis.is-erreur svg { color: var(--danger); }

/* ---- L'ajout ---------------------------------------------------------------- */
.excl-ajout { display: grid; gap: 6px; margin: 0; }
.excl-label { font-size: 12px; font-weight: 600; color: var(--ink-2); }
.excl-ligne { display: flex; align-items: stretch; gap: 8px; }
.excl-champ {
  flex: 1 1 auto; min-width: 0; height: 32px; padding: 0 10px; border: 1px solid var(--line); border-radius: var(--r-sm);
  background: var(--paper); color: var(--ink); font: inherit; font-size: 13px;
}
.excl-champ::placeholder { color: var(--ink-3, var(--ink-2)); }
.excl-champ:focus-visible { outline: none; box-shadow: var(--focus); }
.excl-bouton { flex: 0 0 auto; white-space: nowrap; }

/* ---- La liste --------------------------------------------------------------- */
.excl-vide {
  margin: 0; padding: 14px 12px; border: 1px dashed var(--line); border-radius: var(--r-sm);
  color: var(--ink-2); font-size: 13px; text-align: center;
}
.excl-compte { margin: 2px 0 0; color: var(--ink-2); font-size: 12px; font-weight: 500; }
.excl-liste { display: grid; gap: 6px; margin: 0; padding: 0; list-style: none; max-height: 360px; overflow-y: auto; }
.excl-item {
  display: flex; align-items: center; gap: 10px; min-width: 0; padding: 6px 8px 6px 10px; border: 1px solid var(--line);
  border-radius: var(--r-sm); background: var(--paper);
}
.excl-motif { display: inline-flex; align-items: center; gap: 6px; flex: 1 1 auto; min-width: 0; font-size: 13px; }
.excl-motif svg { flex: 0 0 auto; color: var(--ink-2); }
.excl-motif-texte { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.excl-depuis { flex: 0 0 auto; color: var(--ink-2); font-size: 12px; white-space: nowrap; }
.excl-gestes { display: inline-flex; flex: 0 0 auto; align-items: center; gap: 4px; }
.excl-form-ligne { display: inline-flex; margin: 0; }
.excl-lien {
  display: inline-flex; align-items: center; gap: 4px; height: 28px; padding: 0 8px; border-radius: var(--r-sm);
  color: var(--ink-2); font-size: 12px; text-decoration: none; white-space: nowrap;
}
.excl-lien:hover { background: var(--paper-2); color: var(--ink); }
.excl-lien:focus-visible { outline: none; box-shadow: var(--focus); }

/* ---- Le journal -------------------------------------------------------------- */
.excl-journal { border-top: 1px solid var(--line); padding-top: 8px; }
.excl-journal summary {
  display: inline-flex; align-items: center; gap: 6px; color: var(--ink-2); font-size: 12px; font-weight: 500;
  cursor: pointer; list-style: none;
}
.excl-journal summary::-webkit-details-marker { display: none; }
.excl-journal summary:focus-visible { outline: none; box-shadow: var(--focus); border-radius: var(--r-sm); }
.excl-journal[open] summary { margin-bottom: 6px; color: var(--ink); }
.excl-journal-liste { display: grid; gap: 4px; margin: 0; padding: 0; list-style: none; font-size: 12px; line-height: 1.45; }
.excl-journal-liste li { display: flex; flex-wrap: wrap; gap: 2px 8px; color: var(--ink); overflow-wrap: anywhere; }
.excl-journal-quand { color: var(--ink-2); white-space: nowrap; font-variant-numeric: tabular-nums; }

/* ---- Les réglages d'Emails : la section sous les filtres ------------------- */
.excl-section { display: grid; gap: 10px; margin-top: 22px; }
.excl-section-titre { margin: 0; font-size: 13px; font-weight: 600; color: var(--ink); }

/* ---- La fenêtre « Filtrer les messages similaires » : exclure, en bas ---- */
.excl-filtre { display: grid; gap: 4px; justify-items: start; margin: 12px 0 0; padding-top: 10px; border-top: 1px solid var(--line); }
.excl-filtre .excl-lien { border: 0; background: transparent; font: inherit; font-size: 12px; cursor: pointer; }

/* ---- Téléphone --------------------------------------------------------------- */
@media (max-width: 640px) {
  .excl { padding: 12px; }
  .excl-ligne { flex-direction: column; }
  .excl-bouton { width: 100%; }
  .excl-item { flex-wrap: wrap; row-gap: 4px; }
  .excl-motif { flex-basis: 100%; }
  .excl-depuis { flex: 1 1 auto; }
  .excl-liste { max-height: none; }
}

/* assets/b/ingestion-alertes.css */
/* ==========================================================================
   L'INGESTION EN CASCADE — l'onglet « Alertes » et la cloche (2026-10-06,
   INGESTION.md § 29.8 ; web/src/ingestion_alerts.rs).
   Le CSS Tailwind est figé : tout ce que cet écran dessine de propre est ici,
   sous le préfixe `ia-`, avec les jetons de l'identité B.
   ========================================================================== */

.ia-tab {
  --ia-warn: #b45309;
  --ia-warn-soft: color-mix(in oklab, #f59e0b 14%, transparent);
  --ia-info: #2563eb;
  --ia-info-soft: color-mix(in oklab, #3b82f6 12%, transparent);
  display: flex;
  flex-direction: column;
  gap: 28px;
  padding: 16px 20px 40px;
  color: var(--ink);
  font-family: var(--font);
}
:root[data-theme="dark"] .ia-tab { --ia-warn: #f5a524; --ia-info: #7aa7ff; }
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) .ia-tab { --ia-warn: #f5a524; --ia-info: #7aa7ff; }
}

.ia-section { display: flex; flex-direction: column; gap: 10px; }
.ia-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px; }
.ia-h2 { margin: 0; font: 600 15px/1.3 var(--font); letter-spacing: -.01em; }
.ia-h3 { margin: 0; font: 600 13px/1.3 var(--font); }
.ia-muted { margin: 0; color: var(--ink-2); font-size: 13px; }
.ia-empty { margin: 0; padding: 14px; border: 1px dashed var(--line-2); border-radius: var(--r-sm); color: var(--ink-2); font-size: 13px; }
.ia-hint { display: block; margin-top: 4px; color: var(--ink-3); font-size: 12px; }
.ia-warn { color: var(--ia-warn); }

/* ---- Gravité ----------------------------------------------------------- */
.ia-counts { display: flex; flex-wrap: wrap; gap: 6px; }
.ia-sev {
  display: inline-flex; align-items: center; gap: 5px; min-height: 20px; padding: 0 7px;
  border-radius: var(--r-pill); font-size: 11.5px; font-weight: 600; white-space: nowrap;
}
.ia-sev:empty { min-height: 8px; width: 8px; padding: 0; vertical-align: middle; }
.ia-sev-critical { background: var(--danger-soft); color: var(--danger); }
.ia-sev-critical:empty { background: var(--danger); }
.ia-sev-warning { background: var(--ia-warn-soft); color: var(--ia-warn); }
.ia-sev-warning:empty { background: var(--ia-warn); }
.ia-sev-info { background: var(--ia-info-soft); color: var(--ia-info); }
.ia-sev-info:empty { background: var(--ia-info); }

/* ---- Filtres ----------------------------------------------------------- */
.ia-filters { display: flex; flex-wrap: wrap; gap: 6px; }
.ia-filter {
  display: inline-flex; align-items: center; gap: 4px; height: 26px; padding: 0 10px;
  border: 1px solid var(--line); border-radius: var(--r-pill); background: var(--card);
  color: var(--ink-2); font-size: 12.5px; text-decoration: none;
}
.ia-filter:hover { color: var(--ink); border-color: var(--line-2); }
.ia-filter[aria-current="page"] { background: var(--ink); border-color: var(--ink); color: var(--paper); }
.ia-filter-kind { border-style: dashed; }

/* ---- Les alertes --------------------------------------------------------- */
.ia-list { display: flex; flex-direction: column; gap: 8px; margin: 0; padding: 0; list-style: none; }
.ia-card {
  display: flex; flex-direction: column; gap: 6px; padding: 12px 14px;
  border: 1px solid var(--line); border-radius: var(--r-sm); background: var(--card);
}
.ia-card[data-status="RESOLVED"] { opacity: .72; }
.ia-device { border-left-width: 1px; }
.ia-card-head { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; font-size: 13px; }
.ia-kind { color: var(--ink); font-weight: 600; text-decoration: none; }
.ia-kind:hover { text-decoration: underline; }
.ia-status {
  padding: 0 6px; border: 1px solid var(--line-2); border-radius: var(--r-pill);
  color: var(--ink-2); font-size: 11.5px;
}
.ia-message { margin: 0; font-size: 14px; line-height: 1.45; }
.ia-meta { display: flex; flex-wrap: wrap; gap: 4px 14px; margin: 0; color: var(--ink-3); font-size: 12px; }
.ia-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-top: 2px; }
.ia-link { display: inline-flex; align-items: center; gap: 4px; color: var(--ink-2); font-size: 12.5px; text-decoration: none; }
.ia-link:hover { color: var(--ink); text-decoration: underline; }
.ia-ack { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 6px; margin-left: auto; }

/* ---- Les réglages ------------------------------------------------------ */
.ia-recipients { display: flex; flex-direction: column; gap: 4px; }
.ia-people { display: flex; flex-wrap: wrap; gap: 6px; margin: 0; padding: 0; list-style: none; font-size: 12.5px; }
.ia-people li { padding: 2px 8px; border: 1px solid var(--line); border-radius: var(--r-pill); background: var(--card); }
.ia-form { margin: 0; }
.ia-fieldset { display: flex; flex-direction: column; gap: 14px; min-width: 0; margin: 0; padding: 0; border: 0; }
.ia-fieldset:disabled { opacity: .8; }
.ia-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 14px; }
.ia-field { display: flex; flex-direction: column; gap: 4px; font-size: 13px; }
.ia-label { font-weight: 600; font-size: 12.5px; }
.ia-input {
  height: 28px; padding: 0 8px; border: 1px solid var(--line-2); border-radius: var(--r-sm);
  background: var(--card); color: var(--ink); font: 13px var(--font);
}
.ia-input:focus-visible { outline: 2px solid var(--focus); outline-offset: 1px; }
.ia-num { width: 76px; text-align: right; font-variant-numeric: tabular-nums; }
.ia-unit { color: var(--ink-3); font-size: 12px; }
.ia-check { display: inline-flex; align-items: center; gap: 5px; font-size: 12.5px; cursor: pointer; }
.ia-table-wrap { overflow-x: auto; border: 1px solid var(--line); border-radius: var(--r-sm); background: var(--card); }
.ia-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.ia-table th, .ia-table td { padding: 8px 10px; border-bottom: 1px solid var(--line); text-align: left; vertical-align: top; }
.ia-table thead th { color: var(--ink-2); font-size: 12px; font-weight: 600; white-space: nowrap; }
.ia-table tbody tr:last-child th, .ia-table tbody tr:last-child td { border-bottom: 0; }
.ia-table tbody th { font-weight: 500; }
.ia-table-simple tbody td { vertical-align: middle; }
.ia-table-simple .ia-num { width: 72px; }
.ia-table-simple tbody td { white-space: nowrap; }
@media (max-width: 640px) {
  .ia-table-simple thead { display: none; }
  .ia-table-simple tbody tr { display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px 10px; padding: 10px; border-bottom: 1px solid var(--line); }
  .ia-table-simple tbody tr:last-child { border-bottom: 0; }
  .ia-table-simple tbody th, .ia-table-simple tbody td { padding: 0; border: 0; }
  .ia-table-simple tbody th, .ia-table-simple tbody td:not([data-l]) { grid-column: 1 / -1; }
  .ia-table-simple tbody td[data-l] { display: flex; align-items: center; gap: 6px; font-size: 12px; color: var(--ink-2); }
  .ia-table-simple tbody td[data-l]::before { content: attr(data-l); order: 2; }
}
.ia-channels { display: flex; flex-wrap: wrap; gap: 4px 10px; }
.ia-submit { display: flex; justify-content: flex-end; }

/* ---- La cloche (dans l'en-tête des pages) ------------------------------ */
.ia-bell { display: inline-flex; flex: none; align-items: center; justify-content: center; border-radius: var(--r-sm); }
.ia-bell:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; }
.ia-bell-img { display: block; }

/* Santé, au studio : une seule liste de lignes, le geste à droite, le rang écrit sans pastille. */
.ia-h2 { font-size: 18px; }
.ia-card .ia-sev { padding: 0; background: none; color: var(--ink-3); font-weight: 400; font-size: 12px; }
@media (min-width: 761px) {
  .ia-list { gap: 0; border: 1px solid var(--line); border-radius: var(--r-sm); background: var(--card); overflow: hidden; }
  .ia-card { display: grid; grid-template-columns: minmax(0, 1fr) auto; column-gap: 16px; row-gap: 2px; border: 0; border-radius: 0; border-bottom: 1px solid var(--line-2); background: none; }
  .ia-card:last-child { border-bottom: 0; }
  .ia-card > * { grid-column: 1; }
  .ia-card > .ia-actions { grid-column: 2; grid-row: 1 / span 3; align-self: center; margin: 0; }
}

/* assets/b/mail.css */
/* ==========================================================================
   BOÎTE MAIL — le volet de lecture (« Escouade - Lecture des mails »,
   décisions du 29/09/2026). Le mail d'abord : fiches liées et propositions
   repliées sous l'objet, résumé IA de deux lignes, colonne d'environ
   70 caractères, lecture plein écran.
   Feuille maison : le CSS Tailwind est figé, une classe neuve dans un
   `html!` n'y existe pas. Tout ce qui est neuf dans le volet vit ici.
   ========================================================================== */

/* --- le défilement : objet, fiches, propositions et messages ensemble --- */
.b-mail-read{display:flex;flex-direction:column;min-width:0}
.b-mail-read h2{text-wrap:balance}

/* --- la ligne des fiches liées ([fiches] A) ----------------------------- */
.b-mail-context{display:flex;flex-direction:column;gap:6px;padding:0 24px 10px}
.b-mail-links{border:1px solid var(--line);border-radius:var(--r-sm);background:var(--card)}
.b-mail-links[open]{background:var(--paper)}
.b-mail-links-sum{display:flex;align-items:center;gap:8px;min-width:0;padding:6px 10px;list-style:none;cursor:pointer;font:var(--t-caption);color:var(--ink-2);border-radius:var(--r-sm)}
.b-mail-links-sum::-webkit-details-marker{display:none}
.b-mail-links-sum:hover{color:var(--ink)}
.b-mail-links-sum:focus-visible{outline:2px solid var(--focus);outline-offset:-2px}
.b-mail-links-sum svg{flex:none;color:var(--ink-3)}
.b-mail-links-count{flex:none;font-weight:600;color:var(--ink)}
.b-mail-links-names{flex:1 1 auto;min-width:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.b-mail-links-add{flex:none;margin-left:auto;color:var(--ink-2);font-weight:500}
.b-mail-links-caret{flex:none;display:inline-flex;transition:transform .15s ease}
.b-mail-links[open] .b-mail-links-caret{transform:rotate(180deg)}
.b-mail-links-body{display:flex;flex-wrap:wrap;align-items:center;gap:6px;padding:8px 10px;border-top:1px solid var(--line)}
.b-mail-links-body>span{display:inline-flex;align-items:center;gap:4px;height:22px;padding:0 8px;border-radius:var(--r-pill);background:var(--card);box-shadow:inset 0 0 0 1px var(--line-2);color:var(--ink);font-size:11.5px}
.b-mail-links-body>span button{display:inline-flex;color:var(--ink-3)}
.b-mail-links-body>span button:hover{color:var(--ink)}
.b-mail-link-to{display:inline-flex;align-items:center;height:22px;padding:0 8px;border-radius:var(--r-pill);border:1px dashed var(--line-2);color:var(--ink-3);font-size:11.5px;text-decoration:none}
.b-mail-link-to:hover{border-color:var(--ink-3);color:var(--ink)}
.b-mail-links-body form button{display:inline-flex;align-items:center;gap:6px;height:24px;padding:0 8px;border-radius:var(--r-sm);border:1px solid var(--line-2);background:var(--card);color:var(--ink);font-size:12px}
.b-mail-links-body form button:hover{background:var(--paper-2)}
.b-mail-links>div:last-child:not(.b-mail-links-body){margin:0 10px 10px}

/* --- les propositions de l'IA, une ligne chacune ([propositions] A) ------ */
.b-mail-props{display:flex;flex-direction:column;gap:4px;margin:0;padding:0;list-style:none}
.b-mail-props>li{display:flex;align-items:center;gap:8px;min-width:0;padding:4px 6px 4px 10px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--card)}
.b-mail-props>li>span:nth-child(2){flex:none;font-size:11.5px;font-weight:600;color:var(--ink)}
.b-mail-props>li>span:nth-child(3){flex:1 1 auto;min-width:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-size:12.5px;color:var(--ink)}
.b-mail-props>li form{display:flex;gap:2px}
.b-mail-props>li form button{display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;border-radius:var(--r-sm);color:var(--ink-2)}
.b-mail-props>li form button:hover{background:var(--paper-2);color:var(--ink)}
.b-mail-props>li form button[value=reject]:hover{color:var(--danger)}
.b-mail-props-all{display:flex;justify-content:flex-end}

/* --- le résumé IA : deux lignes au plus, sans étiquettes ([resume] C) ---- */
.b-mail-ai{margin:10px 0 0 46px;padding:6px 10px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--paper);max-width:72ch}
.b-mail-ai>div:first-child{display:flex;align-items:center;gap:6px;margin-bottom:2px;font-size:10.5px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-3)}
.b-mail-ai-sum{margin:0;font-size:12.5px;line-height:1.45;color:var(--ink);display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;line-clamp:2;overflow:hidden}

/* --- la colonne de lecture, environ 70 caractères ([colonne] A) ---------- */
.b-mail-text{max-width:calc(72ch + 46px);padding-left:46px;padding-top:12px;font-size:14px;line-height:1.65;color:var(--ink)}
.b-mail-frame{max-width:calc(760px + 46px);padding-left:46px;padding-top:12px}
.b-mail-frame iframe{display:block;width:100%;border:1px solid var(--line);border-radius:var(--r-sm)}

/* --- les pièces jointes : compteur dans l'en-tête ([pieces] C) ----------- */
.b-mail-pj-count{display:inline-flex;align-items:center;gap:4px;height:24px;padding:0 6px;border-radius:var(--r-sm);color:var(--ink-2);font-size:11.5px;text-decoration:none;white-space:nowrap}
.b-mail-pj-count:hover{background:var(--paper-2);color:var(--ink)}
.b-mail-pj{padding-left:46px;scroll-margin-top:12px}

/* --- l'en-tête d'un message : le nom ne se coupe jamais ------------------ */
.b-mail-from{min-width:0;overflow:hidden}
.b-mail-sender{white-space:nowrap}
.b-mail-from>span:not(.b-mail-sender){min-width:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}

/* --- la lecture plein écran ([plein-ecran] A) --------------------------- */
.b-mail-focus .fl-inbox-nav-panel{display:none}
.b-mail-focus .b-mail-read{width:100%;max-width:880px;margin-inline:auto}

@media (max-width:1100px){
  .b-mail-context{padding-inline:16px}
  /* L'adresse de l'expéditeur reste visible : sous le nom, sur sa ligne. */
  .b-mail-from{flex-wrap:wrap;row-gap:0}
  .b-mail-from>span:not(.b-mail-sender){flex-basis:100%}
  .b-mail-pj-count{padding:0 4px}
  .b-mail-ai{margin-left:0}
  .b-mail-text,.b-mail-frame,.b-mail-pj{padding-left:0}
}
@media (prefers-reduced-motion:reduce){.b-mail-links-caret{transition:none}}

/* La recherche de la boîte : le cadre porte l'anneau de focus
   (`focus-within`), le champ à l'intérieur ne redessine pas le sien. */
.b-mail-list [data-inbox-search]:focus-visible,[data-inbox-search]:focus-visible{outline:none}

/* D44 (31/10, vérificateur produit) : la boîte sur un téléphone (≤ 767 px).
   Trois volets côte à côte ne tiennent pas dans 390 px : un seul à la fois.
   - Les dossiers deviennent un tiroir par-dessus la liste, ouvert et fermé par
     le bouton ☰ (la case `#fl-inbox-nav`) ;
   - un fil ouvert prend toute la largeur, la liste se retire (le bouton
     « Retour » du fil y ramène) ;
   - le rail des panneaux et son panneau se retirent ;
   - un menu déroulant ne sort jamais de l'écran. */
@media (max-width:767px){
  .fl-inbox .fl-inbox-nav-panel .b-mail-folders{position:absolute;inset:0 auto 0 0;z-index:30;width:min(280px,86vw);background:var(--color-gray-2);box-shadow:var(--shadow-frame,0 8px 24px rgba(0,0,0,.18))}
  .fl-inbox .volet-poignee,.fl-inbox [data-volet="emails-liste"]{display:none}
  .fl-inbox nav[aria-label].w-12,.fl-inbox .fl-inbox-panel{display:none}
  .fl-inbox details>div.absolute{max-width:calc(100vw - 24px)}
  .fl-inbox .b-mail-list{min-width:0}
}
/* La fenêtre « Nouveau message » sur un téléphone : toute la largeur, jamais
   hors de l'écran (vérificateur produit, 31/10 : elle sortait de 194 px). */
@media (max-width:767px){
  .b-mail-fenetre[data-inbox-composer]{left:0;right:0;width:auto;max-width:100vw;border-radius:0}
}

/* --- le corps d'un courriel, comme chez Gmail (HUB-EMAILS, 2/11/2026) ----
   La carte du courriel reste claire en thème sombre (sa mise en page est
   faite pour un fond blanc) ; l'îlot lui donne la hauteur du courriel. Le
   réglage « Assombrir les courriels » inverse le corps : la carte suit. */
.b-mail-frame iframe{background:#fff;transition:height .12s ease}
.b-mail-frame-sombre iframe{background:#fff}
[data-theme="dark"] .b-mail-frame-sombre iframe{background:#000;border-color:var(--line)}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]):not([data-theme="dark"]) .b-mail-frame-sombre iframe{background:#000}
}
@media (prefers-reduced-motion:reduce){.b-mail-frame iframe{transition:none}}

/* Le bandeau des images masquées (« Demander avant d'afficher ») : caché
   tant que l'îlot n'a pas lu dans le corps que des images y sont masquées. */
.b-mail-images{display:flex;flex-wrap:wrap;align-items:center;gap:6px 12px;margin:0 0 8px;padding:8px 12px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--paper);color:var(--ink-2);font-size:12.5px;line-height:1.4}
.b-mail-images[hidden]{display:none}
.b-mail-images>svg{flex:none;color:var(--ink-3)}
.b-mail-images-texte{flex:1 1 220px;min-width:0}
.b-mail-images a,.b-mail-images button{display:inline-flex;align-items:center;height:26px;padding:0 10px;border-radius:var(--r-sm);border:1px solid var(--line-2);background:var(--card);color:var(--ink);font-size:12px;font-weight:500;text-decoration:none;white-space:nowrap;cursor:pointer}
.b-mail-images a:hover,.b-mail-images button:hover{background:var(--paper-2)}
.b-mail-images a:focus-visible,.b-mail-images button:focus-visible{outline:2px solid var(--focus);outline-offset:1px}
.b-mail-images form{display:contents}
.b-mail-images button{max-width:100%;overflow:hidden;text-overflow:ellipsis}

/* Réglages › Affichage des courriels : un titre et son explication. */
.b-mail-pref{display:flex;flex-direction:column;gap:2px;min-width:0;flex:1 1 auto}
.b-mail-pref-titre{margin:0;font-size:13px;color:var(--ink)}
.b-mail-pref-aide{margin:0;font-size:12px;line-height:1.45;color:var(--ink-3)}
.b-mail-confiance{display:flex;flex-direction:column;gap:6px;margin-top:6px;padding:10px 12px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--paper)}
.b-mail-confiance ul{display:flex;flex-direction:column;gap:2px;margin:0;padding:0;list-style:none;max-height:240px;overflow-y:auto}
.b-mail-confiance li{display:flex;align-items:center;gap:8px;min-width:0;padding:2px 0;font-size:12.5px;color:var(--ink)}
.b-mail-confiance li>span{flex:1 1 auto;min-width:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.b-mail-confiance li form{display:contents}
.b-mail-confiance li button{display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;border-radius:var(--r-sm);color:var(--ink-3)}
.b-mail-confiance li button:hover{background:var(--paper-2);color:var(--danger)}

@media (max-width:767px){
  .b-mail-images{margin-inline:0}
  .b-mail-images a,.b-mail-images button{flex:1 1 auto;justify-content:center}
}

/* --- Répondre, comme chez Gmail (D349, 2/11/2026) -------------------------
   La réponse s'ouvre DANS le fil, sous le dernier message ; un message neuf
   (ou une réponse agrandie) est la fenêtre du bas à droite. Les boutons sont
   ceux du socle (`esc-btn*`). */
.b-mail-repondre{display:flex;flex-wrap:wrap;align-items:center;gap:8px;padding:16px 24px 28px 70px}
.b-mail-fenetre{position:fixed;bottom:0;right:24px;z-index:40;display:flex;flex-direction:column;width:560px;max-height:calc(100dvh - 24px);overflow:hidden;border:1px solid var(--line-2);border-bottom:0;border-radius:var(--r-md,10px) var(--r-md,10px) 0 0;background:var(--card);box-shadow:var(--shadow-pop)}
.b-mail-reponse{margin:12px 24px 28px 70px;border:1px solid var(--line-2);border-radius:var(--r-md,10px);background:var(--card);box-shadow:var(--shadow-1);scroll-margin-bottom:24px}
.b-mail-reponse:focus-within{border-color:var(--ink-3)}
.b-mail-composeur{display:flex;min-height:0;flex-direction:column}
.b-mail-composeur-tete{display:flex;align-items:center;gap:4px;height:40px;flex:none;padding:0 8px 0 14px;border-bottom:1px solid var(--line)}
.b-mail-fenetre .b-mail-composeur-tete{background:var(--paper-2)}
.b-mail-composeur-titre{flex:1 1 auto;min-width:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-size:13px;font-weight:600;color:var(--ink)}
.b-mail-composeur-erreur{margin:0;padding:8px 14px;border-bottom:1px solid var(--line);background:var(--danger-soft);color:var(--danger);font-size:13px}
.b-mail-dest{display:flex;align-items:flex-start;gap:8px;min-height:38px;padding:6px 14px;border-bottom:1px solid var(--line)}
.b-mail-dest-nom{flex:none;width:34px;padding-top:4px;font-size:12px;color:var(--ink-3)}
.b-mail-dest-champs{display:flex;flex:1 1 auto;flex-wrap:wrap;align-items:center;gap:4px 6px;min-width:0}
.b-mail-dest-saisie{flex:1 1 140px;min-width:120px;height:26px}
.b-mail-dest-ouvrir{flex:none;cursor:pointer;padding:2px 4px;border-radius:var(--r-sm);font-size:12px;color:var(--ink-2)}
.b-mail-dest-ouvrir:hover{background:var(--paper-2);color:var(--ink)}
.b-mail-puce{display:inline-flex;align-items:center;gap:4px;max-width:100%;height:24px;padding:0 4px 0 9px;border-radius:var(--r-pill);background:var(--paper-2);box-shadow:inset 0 0 0 1px var(--line);color:var(--ink);font-size:12px}
.b-mail-puce-invalide{background:var(--danger-soft);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--danger) 40%,transparent);color:var(--danger)}
.b-mail-puce-case{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}
.b-mail-puce:has(.b-mail-puce-case:not(:checked)){display:none}
.b-mail-puce-texte{min-width:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.b-mail-puce-x{display:inline-flex;align-items:center;justify-content:center;width:18px;height:18px;flex:none;cursor:pointer;border-radius:var(--r-round);color:var(--ink-3)}
.b-mail-puce-x:hover{background:var(--line);color:var(--ink)}
.b-mail-objet{display:flex;align-items:center;min-height:38px;padding:0 14px;border-bottom:1px solid var(--line)}
.b-mail-piece-produite{margin:0;padding:8px 14px;border-bottom:1px solid var(--line);font-size:13px;color:var(--ink-2)}
.b-mail-piece-produite strong{font-weight:500;color:var(--ink)}
.b-mail-texte-zone{position:relative;display:flex;min-height:0;flex:1 1 auto;flex-direction:column;gap:8px;overflow-y:auto;padding:12px 14px}
.b-mail-texte{min-height:160px}
.b-mail-fenetre .b-mail-texte{min-height:250px}
.b-mail-pieces{display:flex;flex-wrap:wrap;gap:6px}
.b-mail-pieces:empty{display:none}
.b-mail-piece{display:inline-flex;align-items:center;gap:6px;max-width:100%;height:28px;padding:0 4px 0 10px;border:1px solid var(--line-2);border-radius:var(--r-sm);background:var(--paper);font-size:12px;color:var(--ink)}
.b-mail-piece-nom{min-width:0;max-width:220px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-weight:500}
.b-mail-piece-poids{flex:none;color:var(--ink-3)}
.b-mail-piece-x{display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;border-radius:var(--r-round);font-size:15px;line-height:1;color:var(--ink-3)}
.b-mail-piece-x:hover{background:var(--line);color:var(--ink)}
.b-mail-depot{position:absolute;inset:6px;display:none;align-items:center;justify-content:center;gap:8px;border:1.5px dashed var(--ink-3);border-radius:var(--r-sm);background:color-mix(in srgb,var(--card) 88%,transparent);font-size:13px;color:var(--ink-2);pointer-events:none}
.b-mail-glisse .b-mail-depot{display:flex}
.b-mail-proposer{display:flex;flex:none;flex-wrap:wrap;align-items:center;gap:6px;padding:6px 14px 0}
html:not([data-mail-module]) .b-mail-proposer{display:none}
.b-mail-proposer-retouches{display:inline-flex;flex-wrap:wrap;gap:6px}
.b-mail-proposer-retouches[hidden]{display:none}
.b-mail-proposer-etat{color:var(--ink-3);font-size:12px}
.b-mail-composeur-pied{display:flex;flex:none;align-items:center;gap:6px;height:52px;padding:0 10px 0 14px;border-top:1px solid var(--line)}
/* Le principal sans point (D349 : le point ne dit rien ici). */
.esc-btn-sans-point .esc-btn-dot{display:none}
/* « Envoyer ▾ » : le bouton divisé, deux moitiés du même principal. */
.b-mail-envoyer{display:inline-flex;align-items:stretch;height:32px}
.b-mail-envoyer>.esc-btn{border-top-right-radius:0;border-bottom-right-radius:0}
.b-mail-envoyer-seul>.esc-btn{border-radius:var(--r-sm)}
.b-mail-programmer{position:relative;display:flex}
.b-mail-programmer-ouvrir{display:inline-flex;align-items:center;justify-content:center;width:28px;cursor:pointer;list-style:none;border-left:1px solid color-mix(in srgb,var(--paper) 30%,transparent);border-radius:0 var(--r-sm) var(--r-sm) 0;background:var(--color-accent-9,var(--ink));color:#fff;transition:background-color var(--d-hover)}
.b-mail-programmer-ouvrir::-webkit-details-marker{display:none}
.b-mail-programmer-ouvrir:hover{background:var(--color-accent-10,var(--ink))}
.b-mail-programmer-ouvrir:focus-visible{outline:2px solid var(--focus);outline-offset:2px}
.b-mail-joindre{position:relative;cursor:pointer}
/* Le champ natif : caché dès que l'îlot dessine les pastilles. */
[data-ilots] .b-mail-fichier{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer}
html:not([data-ilots]) .b-mail-fichier{max-width:200px;font-size:12px}
@media (max-width:767px){
  .b-mail-repondre{padding:12px 16px 24px}
  .b-mail-reponse{margin:8px 12px 20px}
  .b-mail-dest-nom{width:28px}
}

/* Aucun défilement horizontal dans le fil (D172, D349, D350) : ce qui est
   plus large que le volet se replie ou se coupe, le volet ne défile qu'en
   hauteur. */
.b-mail-defile{overflow-x:hidden}
.b-mail-text{overflow-wrap:anywhere}
.b-mail-frame iframe{max-width:100%}

/* D51 (la boîte à 390 px) : sur un téléphone, le tiroir des dossiers est
   FERMÉ à l'ouverture d'un fil ; le bouton ☰ l'ouvre (la même case
   `#fl-inbox-nav`, lue à l'envers : cochée = fermé). */
@media (max-width:767px){
  .fl-inbox:has(#fl-inbox-nav:checked) .fl-inbox-nav-panel{display:none}
  .fl-inbox:has(#fl-inbox-nav:not(:checked)) .fl-inbox-nav-panel{display:contents}
  .fl-inbox:has(#fl-inbox-nav:not(:checked)) .fl-inbox-nav-btn{background:transparent}
}
/* D6 : pourquoi le Second cerveau n'a rien rangé d'un fil. */
.b-mail-outside{margin:0 24px 10px;padding:8px 10px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--card);font:var(--t-caption);color:var(--ink-3)}
.b-mail-outside b{display:block;font-weight:600;color:var(--ink)}
.b-mail-outside p{margin:2px 0 4px}
.b-mail-outside a{color:inherit;text-decoration:underline;text-underline-offset:2px}
@media (max-width:760px){.b-mail-outside{margin-inline:16px}}
/* Studio h-courriel : à côté du courriel, ce qu'il en a compris. Sous l'objet tant que la place manque. */
.b-mail-context-t{font-size:13px;font-weight:600;color:var(--ink);margin:6px 0 0}
/* Ce qu'il en a compris : une ligne par type de fiche, le repli reste pour le reste. */
.b-mail-compris{display:flex;flex-direction:column;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--card)}
.b-mail-compris-l{display:flex;align-items:center;gap:8px;min-width:0;padding:6px 10px}
.b-mail-compris-l+.b-mail-compris-l{border-top:1px solid var(--line)}
.b-mail-compris-t{flex:1 1 auto;min-width:0;display:flex;flex-direction:column;gap:1px}
.b-mail-compris-t small{font:var(--t-caption);color:var(--ink-3)}
.b-mail-compris-t a{color:var(--ink);text-decoration:none;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.b-mail-compris-t a:hover{text-decoration:underline}
.b-mail-compris-t b{font-weight:500;font-size:13px}
.b-mail-compris-c{flex:none;font:var(--t-caption);color:var(--ink-2);text-decoration:none}
.b-mail-compris-c:hover{color:var(--ink);text-decoration:underline}
.b-mail-top-aide{display:contents}
/* Téléphone : la barre garde ses gestes, jamais un bouton coupé au bord. */
@media (max-width:640px){
  span.b-mail-top-opt,.b-mail-top-aide,.b-mail-top-lab{display:none}
  .b-mail-top-new{padding-inline:8px}
  .b-mail-objet{flex-wrap:wrap;padding-inline:16px}
  .b-mail-objet>h2{flex-basis:100%}
}
.b-mail-context-n{font-size:12px;color:var(--ink-2,#6b6b66);margin:0}
/* La colonne à côté seulement quand le volet a la place (plein écran de lecture) : à 1 440, liste ouverte, il fait 430 px. */
.b-mail-defile{container-type:inline-size}
@container (min-width:860px){
  .b-mail-read{display:grid;grid-template-columns:minmax(0,1fr) 280px;align-items:start}
  .b-mail-read>*{grid-column:1;min-width:0}
  .b-mail-read>.b-mail-context{grid-column:2;grid-row:1 / span 40;position:sticky;top:12px;padding:16px 16px 10px 0}
}

/* assets/b/messages.css */
/* ==========================================================================
   MESSAGES (2026-10-20 ; web/src/messages.rs) — la messagerie
   d'équipe, « comme dans Teams » : la liste des conversations à gauche (les
   canaux, les messages directs, leurs non-lus en gras et comptés), le fil et
   le composeur à droite.
   Le CSS Tailwind est figé : tout ce que l'écran dessine de propre est ici,
   sous le préfixe `msg-`, avec les seuls jetons de l'identité B (aucune
   couleur en dur). Le vert signal ne sert qu'à ce qui bouge : le compte des
   non-lus, la mention de soi, le séparateur « Nouveaux messages ».
   ========================================================================== */

/* ---- La page ------------------------------------------------------------ */
/* Le fond de page de la Bibliothèque (2026-10-21) ; le composeur, la conversation
   ouverte de la liste, les menus gardent le leur (`--card`). */
.msg-page { display: flex; flex: 1 1 0; flex-direction: column; min-width: 0; min-height: 0; height: 100%; background: var(--paper); color: var(--ink); font-family: var(--font); }
.msg-body { display: flex; flex: 1 1 0; min-height: 0; }
.msg-inline { display: inline-flex; margin: 0; }
.msg-banner { margin: 10px 16px 0; padding: 8px 12px; border: 1px solid var(--line); border-radius: var(--r-sm); background: var(--paper-2); color: var(--ink-2); font-size: 13px; }
.msg-banner-error { border-color: var(--danger); background: var(--danger-soft, var(--paper-2)); color: var(--danger); }
.msg-banner a { color: inherit; font-weight: 600; text-decoration: underline; }
.msg-tag { flex: none; padding: 1px 5px; border-radius: var(--r-sm); background: var(--paper-2); color: var(--ink-3); font-size: 10.5px; font-weight: 500; white-space: nowrap; }
/* L'agent membre (2026-10-22) : son portrait, son étiquette « Agent » — on ne
   le confond jamais avec un humain —, et pour qui il a écrit. */
.msg-tag-agent { border: 1px solid var(--line); background: var(--card); color: var(--ink-2); font-weight: 600; }
.msg-portrait { flex: none; border-radius: 999px; object-fit: cover; background: var(--paper-2); }
.msg-on-behalf { color: var(--ink-3); font-size: 11px; white-space: nowrap; }

/* ---- Les boutons -------------------------------------------------------- */
.msg-btn {
  display: inline-flex; flex: none; align-items: center; gap: 6px; height: 30px; padding: 0 10px;
  border: 1px solid var(--line); border-radius: var(--r-btn, var(--r-sm)); background: var(--card); color: var(--ink);
  font: 500 12.5px/1 var(--font); text-decoration: none; cursor: pointer; list-style: none;
  transition: background var(--d-hover, .12s), border-color var(--d-hover, .12s);
}
.msg-btn::-webkit-details-marker { display: none; }
.msg-btn:hover { background: var(--paper-2); }
.msg-btn:focus-visible, .msg-icon-btn:focus-visible, .msg-row:focus-visible, .msg-send:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; }
.msg-btn-primary { border-color: var(--ink); background: var(--ink); color: var(--card); }
.msg-btn-primary:hover { background: var(--ink-2); }
.msg-icon-btn {
  display: inline-flex; flex: none; align-items: center; justify-content: center; width: 24px; height: 24px; padding: 0;
  border: 0; border-radius: var(--r-sm); background: transparent; color: var(--ink-3); cursor: pointer; text-decoration: none;
}
.msg-icon-btn:hover { background: var(--paper-2); color: var(--ink); }

/* ---- La liste des conversations ----------------------------------------- */
.msg-rail { display: flex; flex: none; flex-direction: column; width: var(--volet-messages-canaux, 280px); min-height: 0; border-right: 1px solid var(--line); background: var(--paper); }
.msg-rail-scroll { flex: 1 1 0; min-height: 0; overflow-y: auto; padding: 10px 8px; }
/* D51 (31/10) : le filtre d'origine — toutes, Escouade, agents, un compte branché */
.msg-origines { display: flex; flex-wrap: wrap; gap: 4px; padding: 10px 8px 0; }
.msg-origine { display: inline-flex; align-items: center; max-width: 100%; height: 24px; padding: 0 9px; overflow: hidden; border: 1px solid var(--line); border-radius: 999px; color: var(--ink-2); font-size: 12px; text-overflow: ellipsis; white-space: nowrap; text-decoration: none; }
.msg-origine:hover { background: var(--paper-2); }
.msg-origine.is-active { border-color: var(--ink); background: var(--ink); color: var(--paper); }
.msg-rail-foot { flex: none; padding: 6px 8px 10px; border-top: 1px solid var(--line); }
.msg-section-head { display: flex; align-items: center; gap: 4px; padding: 10px 6px 4px; }
.msg-section-head:first-child { padding-top: 2px; }
.msg-section-label { flex: 1; min-width: 0; color: var(--ink-3); font-size: 11px; font-weight: 600; letter-spacing: var(--ls-label, .04em); text-transform: uppercase; }
.msg-rail-empty { margin: 0; padding: 2px 8px 6px; color: var(--ink-3); font-size: 12px; line-height: 1.4; }
.msg-row {
  display: flex; align-items: center; gap: 8px; min-height: 32px; padding: 4px 8px;
  border-radius: var(--r-sm); color: var(--ink-2); font-size: 13px; text-decoration: none;
}
.msg-row:hover { background: var(--paper-2); color: var(--ink); }
.msg-row.is-active { background: var(--card); box-shadow: var(--shadow-1); color: var(--ink); }
.msg-row.is-unread { color: var(--ink); font-weight: 600; }
.msg-row-ic { display: inline-flex; flex: none; align-items: center; justify-content: center; width: 22px; height: 22px; color: var(--ink-3); }
.msg-row-name { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.msg-row-n {
  flex: none; min-width: 18px; padding: 1px 6px; border-radius: var(--r-pill, 999px);
  background: var(--signal-soft); color: var(--signal-text); font-size: 11px; font-weight: 600; text-align: center;
}

/* ---- Le volet ----------------------------------------------------------- */
.msg-pane { display: flex; flex: 1 1 0; flex-direction: column; min-width: 0; min-height: 0; }
.msg-empty { display: flex; flex-direction: column; align-items: center; gap: 4px; margin: auto auto 12px; padding: 32px 24px 0; text-align: center; }
.msg-empty-ic { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; border-radius: 999px; background: var(--paper-2); color: var(--ink-3); }
.msg-empty-title { margin: 8px 0 0; font-weight: 600; font-size: 14px; }
.msg-empty-text { margin: 0; max-width: 380px; color: var(--ink-3); font-size: 13px; line-height: 1.45; }
.msg-empty-actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; margin: 0 auto auto; padding-bottom: 32px; }

/* ---- L'en-tête d'une conversation --------------------------------------- */
.msg-conv-head { display: flex; flex: none; align-items: center; gap: 12px; min-height: 56px; padding: 8px 16px; border-bottom: 1px solid var(--line); }
.msg-conv-title { display: flex; flex: 1; align-items: center; gap: 10px; min-width: 0; }
.msg-conv-names { display: flex; flex-direction: column; min-width: 0; }
.msg-conv-name { margin: 0; overflow: hidden; font-size: 15px; font-weight: 600; text-overflow: ellipsis; white-space: nowrap; }
.msg-conv-sub { display: flex; align-items: center; gap: 6px; min-width: 0; color: var(--ink-3); font-size: 12px; }
.msg-conv-desc { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.msg-conv-actions { display: flex; flex: none; align-items: center; gap: 6px; }

/* ---- Les menus (<details>) ---------------------------------------------- */
.msg-menu { position: relative; }
.msg-menu > summary { list-style: none; }
.msg-menu-pop {
  position: absolute; top: calc(100% + 6px); right: 0; z-index: 40; width: 280px; max-height: 70vh; overflow-y: auto; padding: 8px;
  border: 1px solid var(--line); border-radius: var(--r-panel, 12px); background: var(--card); box-shadow: var(--shadow-pop);
}
.msg-menu-wide { width: 320px; }
.msg-menu-note { margin: 0; padding: 4px; color: var(--ink-3); font-size: 12.5px; line-height: 1.45; }
.msg-menu-item {
  display: flex; align-items: center; gap: 8px; width: 100%; min-height: 32px; padding: 0 8px;
  border: 0; border-radius: var(--r-sm); background: transparent; color: var(--ink); font: 13px var(--font); text-align: left; cursor: pointer;
}
.msg-menu-item:hover { background: var(--paper-2); }
.msg-menu-item.is-danger { color: var(--danger); }
/* AG-SELECTEUR (D164) : « Réglages de l'agent » et « Supprimer » sont des liens du menu */
a.msg-menu-item { box-sizing: border-box; text-decoration: none; }
.msg-menu-item:focus-visible { outline: 2px solid var(--focus); outline-offset: -2px; }
.msg-menu-sep { height: 1px; margin: 6px 0; background: var(--line); }
.msg-menu-sep:first-child { display: none; }
.msg-menu-label { margin: 4px 0; padding: 0 8px; color: var(--ink-3); font-size: 11px; font-weight: 600; text-transform: uppercase; }
.msg-member-list { margin: 0; padding: 0; list-style: none; }
.msg-member { display: flex; align-items: center; gap: 6px; min-height: 28px; padding: 0 8px; font-size: 13px; }
.msg-member-name { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* ---- Les formulaires ---------------------------------------------------- */
.msg-form { display: flex; flex-direction: column; gap: 10px; margin: 0; }
.msg-field { display: flex; flex-direction: column; gap: 4px; color: var(--ink-2); font-size: 12px; font-weight: 500; }
.msg-field input {
  height: 32px; padding: 0 10px; border: 1px solid var(--line); border-radius: var(--r-sm);
  background: var(--card); color: var(--ink); font: 13px var(--font);
}
.msg-field input:focus { border-color: var(--ink-3); outline: none; }
.msg-checks { display: flex; flex-direction: column; max-height: 240px; overflow-y: auto; }
.msg-check { display: flex; align-items: center; gap: 8px; padding: 4px; border-radius: var(--r-sm); font-size: 13px; cursor: pointer; }
.msg-check:hover { background: var(--paper-2); }
.msg-form-wrap { display: flex; flex: 1 1 0; justify-content: center; min-height: 0; overflow-y: auto; padding: 32px 16px; }
.msg-card { width: 100%; max-width: 440px; height: fit-content; padding: 20px; border: 1px solid var(--line); border-radius: var(--r-panel, 12px); background: var(--card); }
.msg-card-title { margin: 0 0 4px; font-size: 15px; font-weight: 600; }
.msg-fieldset { margin: 0; padding: 0; border: 0; }
.msg-fieldset legend { padding-bottom: 4px; color: var(--ink-2); font-size: 12px; font-weight: 500; }
.msg-form-actions { display: flex; justify-content: flex-end; gap: 8px; }
.msg-field-hint { color: var(--ink-3); font-size: 11.5px; font-weight: 400; line-height: 1.4; }
.msg-field textarea {
  width: 100%; box-sizing: border-box; min-height: 96px; padding: 8px 10px; border: 1px solid var(--line); border-radius: var(--r-sm);
  background: var(--card); color: var(--ink); font: 13px/1.45 var(--font); resize: vertical;
}
.msg-field textarea:focus { border-color: var(--ink-3); outline: none; }
/* AG-NOUVEL-AGENT (D118) : « Nouvel agent » prend la largeur du panneau — une colonne, le formulaire puis la galerie,
   bornée à une lecture confortable sur un grand écran ; les champs à pleine largeur, alignés. */
.msg-agent-new { flex-direction: column; align-items: stretch; justify-content: flex-start; gap: 16px; }
.msg-agent-new > .msg-card { max-width: 960px; margin: 0 auto; box-sizing: border-box; }
.msg-agent-new .msg-field input, .msg-agent-new .msg-field textarea { width: 100%; box-sizing: border-box; }
.msg-agent-galerie .b-galerie { margin-top: 0; }
@media (max-width: 480px) { .msg-agent-new { padding: 16px 12px; } .msg-agent-new > .msg-card { padding: 16px; } }
.msg-list-wrap { flex: 1 1 0; min-height: 0; overflow-y: auto; padding: 20px 24px; }
.msg-list { margin: 12px 0 0; padding: 0; list-style: none; }
.msg-list-row { display: flex; align-items: center; gap: 10px; padding: 10px 4px; border-bottom: 1px solid var(--line); }
.msg-list-text { display: flex; flex: 1; flex-direction: column; min-width: 0; }
.msg-list-name { font-size: 13.5px; font-weight: 600; }
.msg-list-sub { overflow: hidden; color: var(--ink-3); font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }

/* ---- Le fil ------------------------------------------------------------- */
.msg-thread { display: flex; flex: 1 1 0; flex-direction: column; gap: 12px; min-height: 0; overflow-y: auto; padding: 16px 20px; }
.msg-older { align-self: center; color: var(--ink-3); font-size: 12px; }
.msg-older:hover { color: var(--ink); }
.msg-new-sep { display: flex; align-items: center; gap: 8px; color: var(--signal-text); font-size: 11px; font-weight: 600; text-transform: uppercase; }
.msg-new-sep::before, .msg-new-sep::after { content: ""; flex: 1; height: 1px; background: var(--signal-soft); }
.msg-item { display: flex; align-items: flex-start; gap: 10px; max-width: min(720px, 86%); }
.msg-item.is-mine { align-self: flex-end; flex-direction: row-reverse; }
.msg-col { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.msg-item.is-mine .msg-col { align-items: flex-end; }
.msg-meta { display: flex; align-items: baseline; gap: 6px; padding: 0 2px; }
.msg-author { color: var(--ink-2); font-size: 12px; font-weight: 600; }
.msg-time { color: var(--ink-3); font-size: 11px; }
.msg-bubble {
  padding: 8px 12px; border-radius: 12px; background: var(--paper-2); color: var(--ink);
  font-size: 13.5px; line-height: 1.45; white-space: pre-wrap; overflow-wrap: anywhere;
}
.msg-item.is-mine .msg-bubble { background: var(--ink); color: var(--card); }
.msg-mention { border-radius: 4px; color: var(--ink); font-weight: 600; }
.msg-mention.is-me { padding: 0 2px; background: var(--signal-soft); color: var(--signal-text); }
.msg-item.is-mine .msg-mention { color: var(--card); }
/* Un chemin de l'application dans le texte d'un agent (31/10, D30) : il se clique. */
.msg-lien { color: var(--signal-text); text-decoration: underline; text-underline-offset: 2px; word-break: break-all; }
.msg-files { display: flex; flex-wrap: wrap; gap: 6px; }
.msg-item.is-mine .msg-files { justify-content: flex-end; }
.msg-image { display: block; overflow: hidden; border: 1px solid var(--line); border-radius: var(--r-sm); }
.msg-image img { display: block; max-width: 280px; max-height: 220px; object-fit: cover; }
.msg-file {
  display: inline-flex; align-items: center; gap: 6px; max-width: 280px; padding: 6px 10px;
  border: 1px solid var(--line); border-radius: var(--r-sm); background: var(--card); color: var(--ink); font-size: 12.5px; text-decoration: none;
}
.msg-file:hover { background: var(--paper-2); }
.msg-file-name { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.msg-file-size { flex: none; color: var(--ink-3); }
/* Une salle de visio d'Escouade Meet dans un message (« Appeler », 1.13.10) :
   une carte, reconnue par l'adresse de la salle. */
.msg-call {
  display: inline-flex; align-items: center; gap: 8px; margin: 4px 0; padding: 6px 12px 6px 6px; vertical-align: middle;
  border: 1px solid var(--line); border-radius: var(--r-sm); background: var(--card); color: var(--ink);
  font-size: 13px; line-height: 1.3; text-decoration: none; white-space: nowrap;
}
.msg-call:hover { background: var(--paper-2); }
.msg-call:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; }
.msg-call-ic {
  display: inline-flex; flex: none; align-items: center; justify-content: center; width: 28px; height: 28px;
  border-radius: 999px; background: var(--signal-soft); color: var(--signal-text);
}
.msg-call-state { font-weight: 600; }
.msg-call-join { color: var(--signal-text); font-weight: 600; }
/* « Appeler » dans l'en-tête de la conversation, et sa case « Enregistrer l'appel ». */
.msg-call-form { display: inline-flex; align-items: center; gap: 8px; margin: 0; }
.msg-call-rec { display: inline-flex; align-items: center; gap: 4px; color: var(--ink-3); font-size: 12px; cursor: pointer; white-space: nowrap; }
/* La conversation d'un agent supprimé (D578) : le bandeau à la place de la zone
   d'écriture, le bandeau fort juste après le geste, la ligne aux archives. */
.msg-agent-mort { flex: none; display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin: 0 20px 16px; padding: 12px 14px; border: 1px solid var(--line-2); border-radius: 12px; background: var(--paper-2); color: var(--ink); font-size: 13px; }
.msg-agent-fait { flex: none; display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin: 12px 20px 0; padding: 11px 12px 11px 14px; border-radius: 10px; background: var(--ink); color: var(--paper); font-size: 13px; }
.msg-agent-fait .msg-btn { border-color: var(--paper); background: var(--paper); color: var(--ink); }
.msg-agent-fait .msg-btn:hover { border-color: var(--paper-2); background: var(--paper-2); color: var(--ink); }
.msg-agent-carre { flex: none; width: 8px; height: 8px; border-radius: 2px; box-shadow: inset 0 0 0 1.5px currentColor; opacity: .7; }
.msg-agent-texte { flex: 1 1 240px; min-width: 0; }
.msg-agent-texte b { font-weight: 600; }
.msg-agent-lien { color: inherit; font-size: 12.5px; text-decoration: underline; text-decoration-color: var(--line-2); text-underline-offset: 3px; }
.msg-agent-lien:hover { text-decoration-color: currentColor; }
.msg-row-mort { min-height: 44px; }
.msg-row-text { display: flex; flex: 1; flex-direction: column; min-width: 0; }
.msg-row-sub { overflow: hidden; color: var(--ink-3); font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.msg-row-count { flex: none; color: var(--ink-3); font-size: 12px; font-variant-numeric: tabular-nums; }
.msg-archived { flex: none; margin: 0 20px 16px; padding: 10px 12px; border-radius: var(--r-sm); background: var(--paper-2); color: var(--ink-3); font-size: 12.5px; }

/* ---- Le composeur ------------------------------------------------------- */
.msg-composer { position: relative; flex: none; margin: 0 20px 16px; border: 1px solid var(--line); border-radius: 12px; background: var(--card); box-shadow: var(--shadow-1); }
.msg-composer:focus-within { border-color: var(--ink-3); }
.msg-composer textarea {
  display: block; width: 100%; min-height: 44px; max-height: 220px; padding: 10px 14px 4px; resize: vertical;
  border: 0; background: transparent; color: var(--ink); font: 13.5px/1.45 var(--font); outline: none;
}
.msg-composer-bar { display: flex; align-items: center; gap: 6px; padding: 4px 8px 8px; }
.msg-attach { position: relative; overflow: hidden; }
.msg-file-input { position: absolute; inset: 0; opacity: 0; cursor: pointer; }
.msg-chosen { min-width: 0; overflow: hidden; color: var(--ink-3); font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.msg-spacer { flex: 1; }
.msg-send {
  display: inline-flex; flex: none; align-items: center; justify-content: center; width: 32px; height: 32px;
  border: 0; border-radius: var(--r-sm); background: var(--ink); color: var(--card); cursor: pointer;
}
.msg-send:hover { background: var(--ink-2); }
/* Les membres que propose `@` (l'îlot les écrit). */
.msg-suggest {
  position: absolute; bottom: calc(100% + 6px); left: 10px; z-index: 30; width: 260px; margin: 0; padding: 4px; list-style: none;
  border: 1px solid var(--line); border-radius: var(--r-sm); background: var(--card); box-shadow: var(--shadow-pop);
}
.msg-suggest-item { padding: 6px 8px; border-radius: var(--r-sm); font-size: 13px; cursor: pointer; }
.msg-suggest-item:hover, .msg-suggest-item.is-active { background: var(--paper-2); }

/* ---- Écran étroit : la liste au-dessus, repliable par l'adresse --------- */
@media (max-width: 767px) {
  .msg-body { flex-direction: column; }
  .msg-rail { width: auto; max-height: 46vh; border-right: 0; border-bottom: 1px solid var(--line); }
  /* La liste au-dessus prend la hauteur de son contenu, jusqu'au plafond du
     volet : une base nulle (`flex: 1 1 0`) n'y comptait pour rien, et le
     volet se réduisait au filtre et au pied — sans canal ni agent (lot de
     captures n° 1, Messages › Agents à 390 px). */
  .msg-rail-scroll { flex: 1 1 auto; }
  .msg-rail-foot { display: flex; flex-wrap: wrap; gap: 0 8px; padding: 4px 8px 6px; }
  .msg-rail-foot .msg-row { flex: 1 1 auto; min-height: 30px; }
  .msg-page[data-messages-open]:not([data-messages-open=""]) .msg-rail { display: none; }
  .msg-hide-narrow { display: none; }
  .msg-item { max-width: 100%; }
  .msg-thread { padding: 12px; }
  .msg-composer { margin: 0 12px 12px; }
}
/* La carte de validation d'une écriture d'un agent (v71, Q79 lot B). */
.msg-validation { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 6px; }
.msg-card-why { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; flex-basis: 100%; font-size: 12px; color: var(--ink-3); }
.msg-card-why label { flex-basis: 100%; }
.msg-card-why input[name="raison"] { flex: 1 1 200px; min-width: 0; padding: 4px 8px; border: 1px solid var(--line); border-radius: var(--r-sm); background: var(--card); color: var(--ink); font: inherit; }
.msg-card-actions { display: inline-flex; align-items: center; gap: 6px; margin: 0; }
.msg-card-ok, .msg-card-no { padding: 3px 10px; border-radius: var(--r-sm); border: 1px solid var(--line); background: var(--card); color: var(--ink-2); font-size: 12px; font-weight: 600; cursor: pointer; }
.msg-card-ok { background: var(--ink); border-color: var(--ink); color: var(--card); }
.msg-card-ok:hover, .msg-card-no:hover { filter: brightness(0.95); }
.msg-card-ok:focus-visible, .msg-card-no:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; }
.msg-card-state { color: var(--ink-3); font-size: 11.5px; font-weight: 500; }
.msg-card-state.is-ok { color: var(--signal-text); }
.msg-card-state.is-no { color: var(--ink-3); text-decoration: line-through; }

/* D50 (31/10) : « Escouade Meet vient dans cette réunion ? » — les cartes des
   réunions à confirmer, groupées par jour, en tête du volet. */
.msg-reunions { margin: 16px; padding: 14px 16px; border: 1px solid var(--line); border-radius: var(--r, 8px); background: var(--card); }
.msg-reunions-titre { display: flex; align-items: center; gap: 8px; margin: 0; font-size: 14px; font-weight: 600; color: var(--ink); }
.msg-reunions-question { margin: 4px 0 8px; font-size: 13px; color: var(--ink-3); }
.msg-reunions-jour { margin: 12px 0 6px; font-size: 11px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--ink-3); }
.msg-reunion { padding: 10px 0; border-top: 1px solid var(--line); }
.msg-reunion-tete { display: flex; align-items: baseline; gap: 10px; font-size: 13.5px; }
.msg-reunion-tete strong { min-width: 0; flex: 1; font-weight: 600; color: var(--ink); }
.msg-reunion-heures { flex: none; font-variant-numeric: tabular-nums; font-size: 12px; color: var(--ink-2); }
.msg-reunion-orga { margin: 2px 0 0; font-size: 12px; color: var(--ink-3); }
.msg-reunion-gestes { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin-top: 8px; }
.msg-reunion-lien { margin-left: auto; font-size: 12px; color: var(--ink-2); }

/* 2026-11-02 (D120) : le message d'un agent rend son Markdown (le moteur Markdown du produit) —
   le texte garde la bulle ; titres, listes, code et tableaux y tiennent, sans
   déborder à 390 px. */
.msg-bubble.msg-md { white-space: normal; }
.msg-md > div { gap: 6px; color: inherit; font-size: inherit; line-height: inherit; }
.msg-md p, .msg-md ul, .msg-md ol, .msg-md blockquote, .msg-md h1, .msg-md h2, .msg-md h3, .msg-md h4 { margin: 0; }
.msg-md h1, .msg-md h2, .msg-md h3, .msg-md h4 { font-size: 14px; font-weight: 600; color: var(--ink); }
.msg-md ul, .msg-md ol { padding-left: 18px; }
.msg-md ul { list-style: disc; }
.msg-md ol { list-style: decimal; }
.msg-md li + li { margin-top: 2px; }
.msg-md strong { font-weight: 600; }
.msg-md code { padding: 0 3px; border-radius: 4px; background: var(--card); font-size: 12.5px; }
.msg-md pre { max-width: 100%; overflow-x: auto; padding: 8px; border-radius: var(--r-sm); background: var(--card); white-space: pre; }
.msg-md table { display: block; max-width: 100%; overflow-x: auto; border-collapse: collapse; font-size: 12.5px; }
.msg-md th, .msg-md td { padding: 3px 8px; border: 1px solid var(--line); text-align: left; }
.msg-md blockquote { padding-left: 8px; border-left: 2px solid var(--line); color: var(--ink-2); }
.msg-md a { color: var(--signal-text); text-decoration: underline; text-underline-offset: 2px; }

/* 2026-11-02 (D120, D121) : Messages › Agents — les agents de l'espace (le
   Paramétreur en tête) et les agents de base prêts, à activer d'un clic. */
.msg-agents { margin-top: 4px; }
.msg-agent { display: flex; align-items: center; gap: 8px; margin: 0; padding: 6px; border-radius: var(--r-sm); color: var(--ink-2); font-size: 13px; }
.msg-agent:hover { background: var(--paper-2); }
.msg-agent.is-ready { border: 1px dashed var(--line); margin: 4px 0; }
.msg-agent-ic { display: inline-flex; flex: none; align-items: center; justify-content: center; width: 26px; height: 26px; border-radius: 999px; background: var(--paper-2); color: var(--ink-3); }
.msg-agent-text { display: flex; flex: 1; flex-direction: column; min-width: 0; }
.msg-agent-name { display: flex; align-items: center; gap: 4px; min-width: 0; overflow: hidden; color: var(--ink); font-weight: 600; text-overflow: ellipsis; white-space: nowrap; }
.msg-agent-desc { overflow: hidden; color: var(--ink-3); font-size: 11.5px; line-height: 1.35; text-overflow: ellipsis; white-space: nowrap; }
.msg-agent-btn { flex: none; height: 26px; padding: 0 8px; font-size: 12px; }
.msg-agent-note { margin: 0; padding: 0 6px 4px; color: var(--ink-3); font-size: 11.5px; line-height: 1.4; }

/* Sous le message d'un agent : ses liens internes et « Répondre » (studio Notifications). */
.msg-agent-actions{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px}
.msg-agent-actions:empty{display:none}
.msg-agent-action{display:inline-flex;align-items:center;padding:3px 10px;border:1px solid var(--line,#e6e6e1);border-radius:7px;font-size:12.5px;line-height:18px;color:inherit;text-decoration:none}
.msg-agent-action:hover{background:var(--hover,rgba(0,0,0,.04))}

/* L'agent sollicité, de l'envoi à sa réponse. Le fil ne se relit qu'au signal d'un message : passé deux minutes sans rien, la feuille change seule de phrase. */
.msg-passage { display: flex; align-items: center; gap: 8px; align-self: flex-start; padding: 4px 2px; color: var(--ink-3); font-size: 13px; }
.msg-passage-points { display: inline-flex; gap: 3px; }
.msg-passage-points span { width: 5px; height: 5px; border-radius: 50%; background: currentColor; animation: msg-passage-point 1.2s ease-in-out infinite; }
.msg-passage-points span:nth-child(2) { animation-delay: .2s; }
.msg-passage-points span:nth-child(3) { animation-delay: .4s; }
.msg-passage-mots { display: inline-grid; }
.msg-passage-mots > span { grid-area: 1 / 1; }
.msg-passage-tot { animation: msg-passage-sort 0s 120s forwards; }
.msg-passage-lent { visibility: hidden; animation: msg-passage-entre 0s 120s forwards; }
@keyframes msg-passage-point { 0%, 80%, 100% { opacity: .3; } 40% { opacity: 1; } }
@keyframes msg-passage-sort { to { visibility: hidden; } }
@keyframes msg-passage-entre { to { visibility: visible; } }
@media (prefers-reduced-motion: reduce) { .msg-passage-points span { animation: none; opacity: .6; } }
/* Le vocal (D495) : joué dans le fil, enregistré depuis le composeur. */
.msg-audio{display:block;width:320px;max-width:100%;height:36px}
.msg-vocal[aria-pressed="true"]{color:var(--danger,#c62828)}

/* assets/b/mural.css */
/* ==========================================================================
   L'ÉCRAN MURAL (Q28 du plan, 2026-10-14) — une page du constructeur de vue
   sur un écran d'atelier : la coquille pose le thème sombre, cette feuille
   ôte tout ce qui sert à naviguer et grossit ce qui se lit de loin.
   web/src/mural.rs ; le préfixe `mural-`.
   ========================================================================== */

.mural {
  /* Le corps défile : il est la référence de ses éléments en position
     absolue (un `sr-only` qui s'en échapperait ajouterait une barre). */
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 16px;
  min-height: 100vh;
  padding-block: 20px 24px;
  padding-left: max(24px, env(safe-area-inset-left, 0px));
  padding-right: max(24px, env(safe-area-inset-right, 0px));
  background: var(--bg);
  color: var(--ink);
  font-family: var(--font);
}
.mural-tete { display: flex; flex-wrap: wrap; align-items: baseline; gap: 8px 18px; }
.mural-titre { margin: 0; font-size: 28px; font-weight: 600; letter-spacing: -.01em; }
.mural-heure { color: var(--ink-3); font-size: 15px; font-variant-numeric: tabular-nums; }
.mural-sortie { margin-left: auto; color: var(--ink-3); font-size: 13px; }
.mural-sortie:hover { color: var(--ink); }
/* Lisible à quelques mètres : la grille de la page, agrandie d'un quart. */
.mural-corps { position: relative; flex: 1; min-width: 0; zoom: 1.25; }

/* assets/b/notifications.css */
/* ==========================================================================
   LES NOTIFICATIONS (studio Notifications, 4/11/2026, D539) : la cloche, la
   page, Paramètres › Notifications, Mes abonnements, Notifications de l'espace.
   web/src/notifications.rs, préfixe `nt-`. Kit produit v4 : l'encre et le gris,
   le rouge seulement pour une erreur, le vert seulement pour le point.
   ========================================================================== */

/* La cloche */
.tb-pop-foot { padding: 8px 12px; border-top: 1px solid var(--line); }
.nt-compte { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.nt-compte form { margin: 0; }
.nt-lien { padding: 0; border: 0; background: none; color: var(--ink-2); font: inherit; font-size: 12.5px; cursor: pointer; text-decoration: underline; text-underline-offset: 2px; }
.nt-lien:hover { color: var(--ink); }
.nt-groupe { display: block; padding: 10px 8px 4px; font: 600 11px/1 var(--font); letter-spacing: .06em; text-transform: uppercase; color: var(--ink-3); list-style: none; }
.nt-vide { display: flex; flex-direction: column; gap: 4px; padding: 28px 18px; text-align: center; }
.nt-vide b { color: var(--ink); font-weight: 600; }
.tb-pop-err { display: flex; flex-direction: column; align-items: flex-start; gap: 8px; padding: 24px 18px; }
.nt-squelette { margin: 0; padding: 10px 12px 0; list-style: none; }
.nt-squelette li { display: flex; flex-direction: column; gap: 6px; padding: 8px 0; }
.nt-squelette span { display: block; height: 10px; border-radius: 4px; background: var(--paper-2); }
.nt-squelette span:first-child { width: 72%; }
.nt-squelette span:last-child { width: 44%; }
.tb-nt[data-unread] .tb-nt-phrase { font-weight: 600; }

/* La page */
.nt-page { display: flex; flex-direction: column; gap: 12px; }
.nt-tete { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 8px; font-size: 13px; }
.nt-onglets { display: flex; gap: 4px; overflow-x: auto; scrollbar-width: none; border-bottom: 1px solid var(--line); }
.nt-onglets::-webkit-scrollbar { display: none; }
.nt-onglet { padding: 8px 12px; color: var(--ink-2); font-size: 13.5px; white-space: nowrap; text-decoration: none; border-bottom: 2px solid transparent; margin-bottom: -1px; }
.nt-onglet b { font-weight: 500; color: var(--ink-3); }
.nt-onglet:hover { color: var(--ink); }
.nt-onglet[aria-current="page"] { color: var(--ink); font-weight: 600; border-bottom-color: var(--ink); }
.nt-liste { margin: 0; padding: 0; list-style: none; border: 1px solid var(--line); border-radius: 12px; background: var(--card); overflow: hidden; }
.nt-liste .nt-groupe { padding: 12px 16px 6px; background: var(--paper); }
.nt-tete-gestes { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; }
.nt-tete-gestes form { margin: 0; }
.nt-avatar { display: flex; align-items: center; justify-content: center; width: 32px; height: 32px; border: 1px solid var(--line); border-radius: 8px; background: var(--paper); color: var(--ink-2); font-size: 12px; font-weight: 600; }
.nt-ligne { display: grid; grid-template-columns: 32px 1fr auto; gap: 10px; padding: 12px 16px; border-top: 1px solid var(--line); }
.nt-ligne[data-unread] { background: var(--paper-2); }
.nt-corps { min-width: 0; }
.nt-phrase { margin: 0; font-size: 13.5px; line-height: 1.35; font-weight: 500; overflow-wrap: anywhere; }
.nt-ligne[data-unread] .nt-phrase { font-weight: 600; }
.nt-phrase a { color: inherit; text-decoration: none; }
.nt-phrase a:hover { text-decoration: underline; }
.nt-detail { margin: 2px 0 0; color: var(--ink-2); font-size: 13px; line-height: 1.4; white-space: pre-line; overflow-wrap: anywhere; }
.nt-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 4px 0 0; color: var(--ink-3); font-size: 11.5px; }
.nt-point { width: 7px; height: 7px; border-radius: 50%; background: var(--ink-3); }
[data-priorite="urgent"] .nt-point { background: var(--danger); }
.nt-compteur { padding: 1px 7px; border-radius: 999px; background: var(--paper-2); color: var(--ink-2); font-weight: 600; }
.nt-gestes { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.nt-gestes form { margin: 0; }
.nt-quand { color: var(--ink-3); font-size: 11.5px; white-space: nowrap; }
.nt-vide-page { display: flex; flex-direction: column; gap: 4px; padding: 36px 18px; border: 1px dashed var(--line); border-radius: 12px; text-align: center; color: var(--ink-2); font-size: 13.5px; }
.nt-vide-page b { color: var(--ink); font-weight: 600; }
.nt-pages { display: flex; align-items: center; justify-content: center; gap: 12px; font-size: 13px; }

/* Paramètres › Notifications */
.nt-reglages { display: flex; flex-direction: column; gap: 14px; }
.nt-entete { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 12px 20px; margin: 12px 0; }
.nt-groupe-seg { margin: 0; padding: 0; border: 0; min-width: 0; }
.nt-groupe-seg legend { padding: 0; margin: 0 0 4px; color: var(--ink-3); font-size: 11.5px; }
.nt-segs { display: inline-flex; flex-wrap: wrap; border: 1px solid var(--line); border-radius: 8px; overflow: hidden; background: var(--card); }
.nt-seg { position: relative; cursor: pointer; font-size: 12.5px; }
.nt-seg input { position: absolute; inset: 0; margin: 0; opacity: 0; cursor: pointer; }
.nt-seg span { display: block; padding: 5px 10px; color: var(--ink-2); white-space: nowrap; border-right: 1px solid var(--line); }
.nt-seg:last-child span { border-right: 0; }
.nt-seg input:checked + span { background: var(--ink); color: var(--paper); }
.nt-seg input:focus-visible + span { outline: 2px solid var(--focus); outline-offset: -2px; }
.nt-calmes { display: none; gap: 10px; margin-top: 6px; font-size: 12.5px; color: var(--ink-2); }
.nt-groupe-seg:has(input[value="calme"]:checked) .nt-calmes { display: flex; }
.nt-retablir { margin-left: auto; }
.nt-permission { align-self: flex-start; padding: 5px 10px; border: 1px solid var(--line); border-radius: 8px; background: var(--card); color: var(--ink); font-size: 12.5px; cursor: pointer; }
.nt-matrice { width: 100%; overflow-x: auto; }
.nt-table { width: 100%; border-collapse: collapse; font-size: 13.5px; }
.nt-table th, .nt-table td { padding: 9px 8px; border-bottom: 1px solid var(--line); text-align: center; font-weight: 400; white-space: nowrap; }
.nt-table thead th { color: var(--ink-3); font-size: 12px; font-weight: 500; }
.nt-table thead th:first-child, .nt-table tbody th { text-align: left; }
.nt-table tbody th { width: 100%; min-width: 180px; white-space: normal; }
.nt-app th { padding-top: 16px; font-weight: 600 !important; color: var(--ink-2); font-size: 13px; }
.nt-puce { display: inline-block; padding: 0 7px; border: 1px solid var(--line); border-radius: 999px; color: var(--ink-3); font-size: 11.5px; line-height: 18px; }
.nt-bascule { display: inline-flex; align-items: center; gap: 8px; cursor: pointer; }
.nt-bascule input { position: absolute; width: 32px; height: 18px; margin: 0; opacity: 0; cursor: pointer; }
.nt-tg { position: relative; display: inline-block; width: 32px; height: 18px; border-radius: 9px; background: var(--line-2, var(--line)); }
.nt-tg::after { content: ""; position: absolute; top: 2px; left: 2px; width: 14px; height: 14px; border-radius: 50%; background: var(--paper); transition: left .15s; }
.nt-bascule input:checked + .nt-tg { background: var(--ink); }
.nt-bascule input:checked + .nt-tg::after { left: 16px; }
.nt-bascule input:disabled, .nt-bascule input:disabled + .nt-tg { opacity: .55; cursor: not-allowed; }
.nt-bascule input:focus-visible + .nt-tg { outline: 2px solid var(--focus); outline-offset: 2px; }
.nt-tg-texte { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.nt-enregistre { position: sticky; bottom: 8px; width: fit-content; min-height: 0; margin: 0; padding: 0; font-size: 12.5px; color: var(--ink-2); }
.nt-enregistre:not(:empty) { padding: 5px 10px; border: 1px solid var(--line); border-radius: 8px; background: var(--card); }
.nt-enregistre[data-etat="ko"] { color: var(--danger); }
.nt-liens { display: flex; flex-wrap: wrap; gap: 8px; }
.nt-pour { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.nt-lecture { margin: 0; padding: 10px 12px; border: 1px solid var(--line); border-radius: 10px; background: var(--paper-2); font-size: 13px; }
html[data-ilots] .nt-sans-ilot { display: none; }

/* Mes abonnements */
.nt-panneau { padding: 14px 16px; border: 1px solid var(--line); border-radius: 12px; background: var(--card); }
.nt-panneau h3 { margin: 0 0 8px; font: 600 14px/1.3 var(--font); }
.nt-suivis { margin: 0; padding: 0; list-style: none; }
.nt-suivis li { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 8px 0; border-top: 1px solid var(--line); font-size: 13.5px; }
.nt-suivis li:first-child { border-top: 0; }
.nt-suivis small { display: block; color: var(--ink-3); font-size: 12px; }
.nt-suivis a { color: inherit; }
.nt-suivis form { margin: 0; flex: none; }
.nt-evenements { display: flex; flex-wrap: wrap; gap: 10px 20px; font-size: 13.5px; }
.nt-evenements .nt-tg-texte { position: static; width: auto; height: auto; clip-path: none; }

/* Largeur étroite : une carte par événement, intitulés entiers. */
@media (max-width: 640px) {
  .nt-ligne { grid-template-columns: 32px 1fr; }
  .nt-quand { grid-column: 2; order: -1; }
  .nt-avatar { grid-row: 1 / span 2; }
  .nt-retablir { margin-left: 0; }
  .nt-segs { display: flex; }
  .nt-table, .nt-table tbody, .nt-table tr, .nt-table th, .nt-table td { display: block; white-space: normal; }
  .nt-table thead { display: none; }
  .nt-table tr[data-genre] { display: grid; grid-template-columns: 1fr 1fr; gap: 8px 12px; margin: 0 0 8px; padding: 10px 12px; border: 1px solid var(--line); border-radius: 12px; background: var(--card); }
  .nt-table tr[data-genre] th { grid-column: 1 / -1; border: 0; padding: 0; font-weight: 500; }
  .nt-table tr[data-genre] td { border: 0; padding: 0; text-align: left; font-size: 12.5px; color: var(--ink-2); }
  .nt-table .nt-tg-texte { position: static; width: auto; height: auto; clip-path: none; }
  .nt-app th { border: 0; padding: 12px 6px 6px; }
  .nt-table-espace tr[data-genre] td:last-child { grid-column: 1 / -1; }
}

/* La composition d'une règle tient sur une ligne (studio Notifications, Mes abonnements). */
.nt-regle-ligne{display:flex;flex-wrap:wrap;align-items:flex-end;gap:8px 12px}
.nt-regle-ligne>form{margin:0}
.nt-regle-ligne .ia-channels,.nt-regle-ligne .ia-fieldset{display:flex;flex-wrap:wrap;align-items:flex-end;gap:8px 12px;border:0;padding:0;margin:0}
.nt-regle-ligne .ia-field{margin:0;min-width:140px}
.nt-regle-ligne .ia-field .ia-hint{display:none}
.nt-regle-ligne .ia-submit{margin:0}
@media (max-width:640px){.nt-regle-ligne,.nt-regle-ligne .ia-fieldset{flex-direction:column;align-items:stretch}}

/* La cloche et le tableau de l'espace, relus sur le studio (4/11). */
.tb-nt { display: grid; grid-template-columns: 32px minmax(0, 1fr); gap: 8px; padding: 4px 8px; }
.tb-nt .nt-avatar { margin-top: 6px; }
.tb-nt-texte { min-width: 0; }
.tb-nt-corps { grid-column: 1 / -1; color: var(--ink-2); font-size: 12.5px; line-height: 1.4; overflow-wrap: anywhere; }
.tb-nt-gestes { display: flex; flex-wrap: wrap; gap: 6px; padding: 2px 8px 8px; }
.tb-nt-gestes form { margin: 0; }
.tb-nt .tb-nt-second { padding: 0; }
.tb-nt[data-priorite="urgent"][data-unread] .tb-nt-kind::before { background: var(--danger, #b42318); }
.nt-table-espace th, .nt-table-espace td { padding: 9px 6px; font-size: 13px; }
.nt-table-espace tbody th { width: auto; min-width: 170px; }
.nt-table-espace select { max-width: 112px; }
/* Matrice de l'espace dans la fenêtre des réglages (5/11) : la colonne Fréquence reste visible sans défilement. */
.nt-table-espace thead th { white-space: normal; line-height: 1.2; }
.nt-table-espace thead th:not(:first-child) { max-width: 74px; }
.nt-table-espace th, .nt-table-espace td { padding: 8px 4px; }
.nt-table-espace tbody th { min-width: 140px; }
.nt-table-espace select { max-width: 104px; padding-inline: 6px; }
.nt-bascule input[type="checkbox"]:disabled { position: absolute; opacity: 0; width: 0; height: 0; margin: 0; pointer-events: none; }

/* La case reste posée sur l'interrupteur : la règle commune des interrupteurs (`second-cerveau.css`), plus forte, la remettait dans le flux, 40 px de décalage sur chaque ligne non verrouillée. */
.nt-bascule { position: relative; }
.nt-bascule input[type="checkbox"][role="switch"] { position: absolute; width: 32px; height: 18px; margin: 0; opacity: 0; }
.nt-bascule input[type="checkbox"][role="switch"]:disabled { width: 0; height: 0; }

/* assets/b/param.css */
/* ==========================================================================
   Escouade · identité B — lot de correction : les écrans orphelins
   Réglages (/settings/*, settings*.rs, et tout ce qui se rend dans la fenêtre
   des réglages : applications, Yooz, plugins), la frise d'activité de la
   fiche, les restes de l'ancien thème hors des écrans des lots.

   Règles : seulement les jetons d'escouade-b.css, aucune couleur en dur ;
   pas de multicolore (ni étiquette, ni type, ni statut) ; le vert signal ne
   marque que ce qui bouge, jamais du texte ; le rouge (--danger) reste le
   seul ton d'erreur — `text-tag-red`, `bg-tag-red…`, `border-tag-red…` ne
   sont PAS touchés ici.

   Les classes des écrans sont des utilitaires Tailwind figés dans app.css
   (@layer utilities) : ces règles, hors couche, l'emportent. Chaque règle
   est préfixée par sa portée — `.settings-modal-panel` (la fenêtre des
   réglages entière, barre comprise, sous /settings/*) ou
   `.settings-modal-content` (une page de réglages rendue hors de la fenêtre,
   comme /yooz) — pour ne rien toucher ailleurs.
   ========================================================================== */

/* ---- Réglages : le texte à l'encre, jamais en vert ni en orange ----------- */
:is(.settings-modal-panel, .settings-modal-content) :is(.text-tag-green, .text-tag-orange, .text-tag-blue,
  .text-tag-turquoise, .text-tag-yellow, .text-tag-purple, .text-tag-sky,
  .text-amber-700, .text-green-700) {
  color: var(--ink);
}
/* `text-amber-11` n'existe pas dans app.css (il rend l'encre héritée) :
   nommé ici pour que le jour où il existerait, il reste à l'encre. */
:is(.settings-modal-panel, .settings-modal-content) .text-amber-11 { color: var(--ink); }

/* ---- Réglages : les fonds teintés deviennent le papier en retrait -------- */
:is(.settings-modal-panel, .settings-modal-content) :is(.bg-tag-green\/10, .bg-tag-green\/15, .bg-tag-green\/20,
  .bg-tag-orange\/5, .bg-tag-orange\/10, .bg-tag-orange\/15,
  .bg-tag-turquoise\/15, .bg-tag-blue\/15,
  .bg-amber-2, .bg-amber-50, .bg-amber-100, .bg-green-100) {
  background-color: var(--paper-2);
}

/* ---- Réglages : les filets teintés deviennent le filet appuyé ------------ */
:is(.settings-modal-panel, .settings-modal-content) :is(.border-tag-green, .border-tag-green\/40,
  .border-tag-orange\/30, .border-tag-orange\/40, .border-amber-6) {
  border-color: var(--line-2);
}

/* ---- Réglages : les pastilles d'état ------------------------------------
   Actif, configuré : le carré plein d'encre (fait, posé). Suspendu, en
   attente : creux. Les pastilles sont des ronds de 6 px : on les équarrit. */
:is(.settings-modal-panel, .settings-modal-content) .bg-tag-green {
  background-color: var(--ink);
  border-radius: var(--r-mark);
}
:is(.settings-modal-panel, .settings-modal-content) :is(.bg-tag-orange, .bg-tag-blue) {
  background-color: transparent;
  border-radius: var(--r-mark);
  box-shadow: inset 0 0 0 1.5px var(--ink-3);
}
/* Les badges de méthode HTTP (settings_api.rs : GET, POST, PATCH) : une
   étiquette neutre, le mot suffit. DELETE reste rouge : c'est la suppression. */
:is(.settings-modal-panel, .settings-modal-content) :is(.bg-tag-green, .bg-tag-orange, .bg-tag-blue).text-white {
  background-color: var(--paper-2);
  color: var(--ink);
  border-radius: var(--r-cite);
  box-shadow: inset 0 0 0 1px var(--line-2);
}

/* ---- Réglages : les icônes d'objet et d'équipe, au trait ----------------
   La tuile teintée de l'objet (`object_tile_style`, `--obj-*`) perd déjà
   son fond et son filet (app.css) ; son glyphe perd sa teinte ici. Même
   chose pour l'icône d'un objet (settings_object.rs, `color: …`) et
   l'icône d'une équipe (settings_members.rs, `color:…;border-color:…`).
   La couleur reste une DONNÉE : les nuanciers qui la choisissent ne sont
   pas touchés (ce sont des `label`, sans glyphe). */
:is(.settings-modal-panel, .settings-modal-content) [style*="--obj-"]:has(> svg),
:is(.settings-modal-panel, .settings-modal-content) span[style^="color"]:has(> svg) {
  color: var(--ink-2) !important;
}
:is(.settings-modal-panel, .settings-modal-content) span[style^="color"][style*="border-color"]:has(> svg) {
  border-color: var(--line-2) !important;
}

/* ---- La frise d'activité de la fiche (record_activity.rs) ----------------
   Des carrés d'encre, plus des ronds de couleur : `fl-sq` équarrit la
   pastille, la teinte vient de `bg-gray-12` (l'audit) ou `bg-gray-9` (le
   contexte). */
.fl-sq { border-radius: var(--r-mark); }

/* ---- Restes de l'ancien thème, hors des écrans des lots ------------------ */
/* L'état d'un plugin Prescriptio (plugins_prescriptio.rs) : plus de vert ni
   de rouge pour « activé / désactivé » — ce n'est pas une erreur. */
.pxo-state.on {
  background: var(--paper-2);
  color: var(--ink);
  box-shadow: inset 0 0 0 1px var(--line-2);
}
.pxo-state.off {
  background: transparent;
  color: var(--ink-3);
  box-shadow: inset 0 0 0 1px var(--line);
}
/* Le sélecteur de vue (view_switch.rs) : le focus à l'encre du thème, sans
   le repli vert de l'ancienne feuille. */
.view-switch-item:focus-visible { outline-color: var(--focus); }

/* ==========================================================================
   Lot PARAM (décision 9) — audit A n° 4 à 10, PARAM-B et PLUG-B
   Les règles héritées d'app.css (voiles, rayons, ombres, focus) sont
   surchargées ici : cette feuille arrive après app.css et escouade-b.css.
   ========================================================================== */

/* ---- Voiles : plus de teinte verte (n° 4 et 5) ---------------------------
   `/plugins` n'est pas sous la fenêtre des réglages : ses voiles sont nommés
   sans le préfixe `.settings-modal-*`. */
.settings-modal-backdrop,
.plugin-modal-backdrop,
.plugin-detail-backdrop { background: var(--veil); }

/* ---- Les réglages s'ouvrent dans une FENÊTRE (2026-10-02) ----------------
   PARAM-B (n° 7) en avait fait une page pleine, sans voile ni ombre. Ghislain,
   le 2026-10-02 : « je préférais quand Paramètres était dans un modal ». La
   fenêtre revient : centrée, l'application voilée derrière, l'ombre
   `--shadow-pop`. Sous 700 px, la règle d'app.css la remet plein écran. */
.settings-modal-layer { padding: 24px; }
.settings-modal-layer .settings-modal-panel {
  width: min(1240px, 100%);
  height: min(920px, calc(100dvh - 48px));
  border: 1px solid var(--line);
  border-radius: 14px;
  box-shadow: var(--shadow-pop);
  background: var(--paper);
}
@media (max-width: 700px) {
  .settings-modal-layer { padding: 0; }
  .settings-modal-layer .settings-modal-panel { width: 100%; height: 100dvh; border: 0; border-radius: 0; box-shadow: none; }
}
.settings-modal-sidebar {
  /* D47 : la largeur du membre, que la poignée règle. */
  width: var(--volet-reglages-sommaire, 240px);
  min-width: var(--volet-reglages-sommaire, 240px);
  border-right-color: var(--line);
  background: var(--paper);
}
.settings-modal-content { background: var(--paper); }
/* La colonne de lecture : une page pleine ne s'étale pas sur tout l'écran.
   La vue d'ensemble du modèle (un diagramme) garde toute la largeur. */
.settings-modal-panel [data-settings-page]:not([data-settings-page="/settings/objects/overview"]) [data-settings-content] {
  max-width: 960px;
  padding-inline: 40px;
}
/* Les sous-entrées d'une section fermée sont dans la page pour que la
   recherche les trouve ; elles restent repliées tant que la recherche est
   vide (`:placeholder-shown`), sans une ligne de script. */
.settings-modal-sidebar:has([data-settings-search]:placeholder-shown) [data-settings-nav-children]:not([data-open]) {
  display: none;
}
.settings-modal-sidebar [data-settings-nav-link]:focus-visible {
  outline: 2px solid var(--focus);
  outline-offset: -2px;
}
.settings-modal-close:focus-visible { outline: 2px solid var(--focus); outline-offset: 3px; }

/* ---- La croix de la fenêtre (2026-10-23) ---------------------------------
   « Comme claude.ai » : UN moyen d'en sortir, la croix en haut à droite —
   posée par la FENÊTRE (`settings::settings_modal`), qui seule sait où
   ramener ; Échap la suit (l'îlot). Le bandeau de la page garde sa hauteur :
   la croix s'y loge. Plus de carte d'espace ni de « Retour à l'application »
   dans la barre : ils sont au menu du compte. */
.settings-modal-panel > .settings-modal-close {
  position: absolute;
  top: 13px;
  right: 16px;
  z-index: 2;
}
@media (max-width: 700px) {
  .settings-modal-sidebar { width: 100%; min-width: 0; border-right: 0; border-bottom: 1px solid var(--line); }
  .settings-modal-panel > .volet-poignee { display: none; }
  .settings-modal-panel [data-settings-page]:not([data-settings-page="/settings/objects/overview"]) [data-settings-content] {
    padding-inline: 16px;
  }
  /* La barre passe au-dessus du contenu : la croix ne couvre pas la recherche. */
  .settings-modal-panel > .settings-modal-close { top: 9px; right: 8px; }
  .settings-modal-search { margin-right: 48px; }
}

/* ---- Le gabarit d'une page de réglages (2026-10-23) ----------------------
   Des groupes titrés (`settings::groupe`), une ligne par réglage
   (`settings::ligne`) : le libellé à gauche, l'aide en gris dessous, la
   commande alignée à droite — pas de cartes empilées. Classes écrites à la
   main : le CSS Tailwind est figé. */
.settings-group-title { margin: 0 0 2px; color: var(--ink); font-size: 0.9375rem; font-weight: 600; }
.settings-group-description { margin: 0 0 4px; color: var(--ink-3); font-size: 0.8125rem; line-height: 1.45; }
.settings-group-rows .settings-row-block + .settings-row-block { border-top: 1px solid var(--line); }
.settings-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  min-width: 0;
  padding: 14px 0;
}
.settings-row-text { display: flex; flex: 1 1 auto; flex-direction: column; gap: 2px; min-width: 0; }
.settings-row-label { color: var(--ink); font-size: 0.875rem; font-weight: 500; }
.settings-row-help { color: var(--ink-3); font-size: 0.8125rem; line-height: 1.45; }
.settings-row-control {
  display: flex;
  flex: 0 1 auto;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  max-width: 60%;
  min-width: 0;
}
.settings-row-below { padding: 0 0 16px; }
.settings-row-save { display: flex; justify-content: flex-end; padding: 4px 0 8px; }
[data-ilots] [data-sans-ilot] { display: none; }
/* La liste déroulante d'une ligne, à droite. */
.settings-select {
  height: 32px;
  min-width: 180px;
  max-width: 280px;
  padding: 0 10px;
  border: 1px solid var(--line-2);
  border-radius: var(--r-sm);
  background: var(--card);
  color: var(--ink);
  font-size: 0.8125rem;
}
.settings-select:focus-visible { outline: 2px solid var(--focus); outline-offset: 1px; }
/* Le bouton d'une ligne (« Modifier », « Configurer », « Enregistrer ») : un
   bouton secondaire, à l'encre. */
.settings-row-button {
  display: inline-flex;
  align-items: center;
  height: 32px;
  padding: 0 12px;
  border: 1px solid var(--line-2);
  border-radius: var(--r-sm);
  background: var(--card);
  color: var(--ink);
  font-size: 0.8125rem;
  font-weight: 500;
  white-space: nowrap;
  cursor: pointer;
  transition: background-color var(--d-hover);
}
.settings-row-button:hover { background: var(--paper-2); }
.settings-row-button:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; }
/* La ligne qui se déplie : son `<summary>` est la ligne elle-même. */
.settings-row-fold > summary { list-style: none; cursor: pointer; }
.settings-row-fold > summary::-webkit-details-marker { display: none; }
.settings-row-fold > summary:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; border-radius: var(--r-sm); }
.settings-row-fold[open] > summary .settings-row-button { background: var(--paper-2); }
/* Le thème en trois icônes : système, clair, sombre. */
.settings-theme {
  display: inline-flex;
  gap: 2px;
  padding: 2px;
  border: 1px solid var(--line-2);
  border-radius: var(--r-sm);
  background: var(--card);
}
.settings-theme-choice {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 28px;
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: var(--ink-3);
  cursor: pointer;
  transition: background-color var(--d-hover), color var(--d-hover);
}
.settings-theme-choice:hover { background: var(--paper-2); color: var(--ink); }
.settings-theme-choice[aria-checked="true"] { background: var(--paper-2); color: var(--ink); box-shadow: inset 0 0 0 1px var(--line-2); }
.settings-theme-choice:focus-visible { outline: 2px solid var(--focus); outline-offset: 1px; }
/* L'avatar d'une ligne (Compte › Photo), et la valeur en lecture seule. */
.settings-row-avatar { width: 40px; height: 40px; flex: none; border-radius: 999px; object-fit: cover; box-shadow: inset 0 0 0 1px var(--line-2); }
.settings-row-avatar-vide { display: inline-flex; align-items: center; justify-content: center; background: var(--paper-2); color: var(--ink-3); }
.settings-row-value { overflow: hidden; color: var(--ink-2); font-size: 0.8125rem; text-overflow: ellipsis; white-space: nowrap; }
.settings-row-fields { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 8px; }
.settings-row-fields input[type="text"] { width: 150px; }
.settings-row-fields input[type="file"] { max-width: 200px; color: var(--ink-3); font-size: 0.75rem; }
[data-settings-content] .settings-row-block[id] { scroll-margin-top: 16px; }
[data-settings-content] .settings-row-block[id]:target {
  border-radius: var(--r-sm);
  animation: esc-setting-found 1.8s var(--out) both;
}
@media (prefers-reduced-motion: reduce) {
  [data-settings-content] .settings-row-block[id]:target { animation: none; background: var(--paper-2); }
}
@media (max-width: 700px) {
  .settings-row { flex-direction: column; align-items: stretch; gap: 8px; }
  .settings-row-control { justify-content: flex-start; max-width: none; }
  .settings-row-fields { justify-content: flex-start; }
}

/* ---- La recherche des réglages : CHAMP-A (n° 8) ------------------------- */
.settings-modal-search {
  border-color: var(--line-2);
  border-radius: var(--r-sm);
  color: var(--ink-3);
  transition: border-color var(--d-hover), box-shadow var(--d-hover);
}
.settings-modal-search:focus-within {
  border-color: var(--ink);
  box-shadow: var(--ring-ink);
}

/* ---- /plugins passe à l'identité B (n° 6) ------------------------------ */
.plugin-modal-panel {
  border-color: var(--line);
  border-radius: var(--r-panel);
  background: var(--card);
  box-shadow: var(--shadow-pop);
}
.plugin-detail-card {
  border-color: var(--line);
  border-radius: var(--r);
  background: var(--card);
  box-shadow: var(--shadow-pop);
}
.plugin-detail-info { border-color: var(--line); border-radius: var(--r-sm); }
.plugin-detail-description,
.plugin-detail-info > div,
.plugin-detail-close { color: var(--ink-2); }
.plugin-detail-info svg { color: var(--ink-2); }
.plugin-tabs a { border-radius: var(--r-sm); color: var(--ink-2); }
.plugin-tabs a:hover,
.plugin-tabs a.active { background: var(--paper-2); color: var(--ink); }
.plugin-search {
  border-color: var(--line-2);
  border-radius: var(--r-sm);
  color: var(--ink-3);
}
.plugin-search:focus-within { border-color: var(--ink); box-shadow: var(--ring-ink); }
/* Les principaux : BTN-B, encre, rayon 8 px et le point d'action. */
.plugin-new-button,
.plugin-primary-action {
  gap: 7px;
  border-radius: var(--r-sm);
  background: var(--btn-bg);
  color: var(--btn-ink);
}
.plugin-new-button::before,
.plugin-primary-action::before {
  content: "";
  flex: none;
  width: 7px;
  height: 7px;
  border-radius: var(--r-round);
  background: var(--btn-dot);
}
/* Le secondaire d'une ligne : BTN-B fantôme, filet appuyé. */
.plugin-row-action {
  border-radius: var(--r-sm);
  background: transparent;
  box-shadow: inset 0 0 0 1px var(--line-2);
  color: var(--ink);
}
.plugin-row-action:hover { background: var(--paper-2); }
.plugin-row-unavailable { color: var(--ink-3); }
.plugin-icon { color: var(--ink-2); }
.plugin-row-copy small { color: var(--ink-3); }
.plugin-skill-row:hover,
.plugin-picker a:hover,
.plugin-modal-close:hover { background: var(--paper-2); }
.plugin-picker a { border-radius: var(--r-sm); }
:is(.plugin-tabs a, .plugin-new-button, .plugin-primary-action, .plugin-row-action,
  .plugin-skill-row, .plugin-picker a, .plugin-modal-close, .plugin-detail-close):focus-visible {
  outline: 2px solid var(--focus);
  outline-offset: 3px;
}

/* ---- PLUG-B : connectés, à connecter, bientôt ----------------------------
   Chaque section a son titre et son compte ; une ligne est une carte. L'état
   « connecté » est le carré plein d'encre (fait, posé) — jamais le signal,
   qui ne marquerait qu'une synchronisation EN COURS. */
.plugin-section + .plugin-section { margin-top: 18px; }
.plugin-section h2 { display: flex; align-items: baseline; gap: 8px; color: var(--ink); }
.plugin-count { color: var(--ink-3); font-weight: 400; font-variant-numeric: tabular-nums; }
.plugin-empty { margin: 0 0 8px; color: var(--ink-3); font-size: 13px; }
.plugin-section .plugin-grid { gap: 8px 12px; }
.plugin-section .plugin-row {
  border: 1px solid var(--line);
  border-radius: var(--r);
  padding: 10px 12px;
  background: var(--card);
}
.plugin-state { display: inline-flex; align-items: center; gap: 6px; color: var(--ink); }
.plugin-state::before {
  content: "";
  flex: none;
  width: 6px;
  height: 6px;
  border-radius: var(--r-mark);
  background: var(--ink);
}
/* La recherche (îlot `data-plugin-search`) cache les lignes ; une section
   dont plus aucune ligne n'est visible se retire tant qu'on cherche. */
.plugin-modal-panel:has([data-plugin-search]:not(:placeholder-shown)) .plugin-section:not(:has([data-plugin-row]:not([hidden]))) {
  display: none;
}

/* ---- Les connecteurs MCP officiels dans la fenêtre (2026-10-28) ----------
   Les filtres par famille sont des pastilles comme les onglets de la fenêtre ;
   la pagination, des liens numérotés ; une tuile garde le format des autres
   lignes, ses gestes groupés à droite. Une marque absente de la table devient
   l'initiale du nom dans une pastille (`marque_mcp`). */
.plugin-mcp-familles { display: flex; flex-wrap: wrap; gap: 4px; margin: 0 0 12px; }
.plugin-mcp-familles a {
  border-radius: var(--r-sm);
  padding: 5px 10px;
  color: var(--ink-2);
  font-size: 13px;
}
.plugin-mcp-familles a:hover,
.plugin-mcp-familles a.active { background: var(--paper-2); color: var(--ink); }
.plugin-mcp-familles a.active { font-weight: 600; }
.plugin-mcp-pages { display: flex; flex-wrap: wrap; align-items: center; gap: 4px; margin-top: 12px; font-size: 13px; }
.plugin-mcp-pages a,
.plugin-mcp-pages span { min-width: 28px; border-radius: var(--r-sm); padding: 4px 8px; text-align: center; color: var(--ink-2); }
.plugin-mcp-pages a:hover { background: var(--paper-2); color: var(--ink); }
.plugin-mcp-pages span[aria-current] { background: var(--paper-2); color: var(--ink); font-weight: 600; }
.plugin-mcp-gestes { display: flex; flex: none; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 6px; }
.plugin-mcp-gestes form { margin: 0; }
.plugin-mcp-gestes button.plugin-row-action { border: 0; font: inherit; font-size: 12px; font-weight: 600; cursor: pointer; }
.plugin-row-copy small.plugin-mcp-ouverture { font-size: 12px; }
/* The maker's mark on a white plate, in both themes (2026-10-31): a black mark
   (Notion, GitHub, Vercel) stays legible on the dark paper. */
img.plugin-marque {
  box-sizing: border-box;
  flex: none;
  border-radius: var(--r-sm);
  padding: 2px;
  background: #fff;
  box-shadow: 0 0 0 1px var(--line);
}
.plugin-monogramme {
  display: inline-flex;
  flex: none;
  align-items: center;
  justify-content: center;
  border-radius: var(--r-sm);
  background: var(--paper-2);
  color: var(--ink-2);
  font-size: 12px;
  font-weight: 600;
  line-height: 1;
}
:is(.plugin-mcp-familles a, .plugin-mcp-pages a):focus-visible {
  outline: 2px solid var(--focus);
  outline-offset: 3px;
}

/* ---- /settings/plugins : une carte par plugin (2026-10-04) --------------
   La marque dans sa tuile, le nom, sa ligne, l'état, une action à droite :
   Yooz et Prescriptio se lisent pareil (`plugins_yooz::card`). L'état
   « connecté » est le carré plein d'encre de PLUG-B, « non connecté » le
   carré vide ; les boutons sont ceux du catalogue `/plugins`. */
.plg-list { display: grid; gap: 12px; max-width: 760px; }
.plg-card {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 16px 18px;
  border: 1px solid var(--line);
  border-radius: var(--r);
  background: var(--card);
  box-shadow: var(--shadow-1);
}
.plg-mark {
  display: flex;
  flex: none;
  align-self: flex-start;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  border: 1px solid var(--line);
  border-radius: var(--r-btn);
  background: var(--card);
}
.plg-mark img { width: 28px; height: 28px; object-fit: contain; }
.plg-copy { display: grid; flex: 1; gap: 3px; min-width: 0; }
.plg-copy h2 { margin: 0; font: var(--t-ui); font-weight: 600; letter-spacing: var(--ls-tight); color: var(--ink); }
.plg-copy p { margin: 0; font: var(--t-small); color: var(--ink-2); }
.plg-copy .plg-state {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  margin-top: 5px;
  font: var(--t-caption);
  color: var(--ink-3);
}
.plg-copy .plg-state::before {
  content: "";
  flex: none;
  width: 6px;
  height: 6px;
  border-radius: var(--r-mark);
  box-shadow: inset 0 0 0 1px var(--ink-3);
}
.plg-copy .plg-state.on { color: var(--ink); }
.plg-copy .plg-state.on::before { background: var(--ink); box-shadow: none; }
.plg-card > .plugin-row-action { padding: 6px 12px; font-size: 13px; }
@media (max-width: 560px) {
  .plg-card { flex-wrap: wrap; row-gap: 12px; }
  .plg-copy { flex-basis: calc(100% - 64px); }
  .plg-card > a { margin-left: 64px; }
}

/* ---- Réglages › Ma suite (ADR-2026-10-19 b, `pages::suite`) -----------------
   Les cartes de /settings/plugins (`plg-card`), une application par carte ;
   le titre de rubrique (Applications, Données du bâti) et, à droite, les
   gestes : les réglages de la connexion, puis Ouvrir ou S'abonner. */
.suite-titre { margin: 10px 0 -2px; font: var(--t-caption); font-weight: 600; color: var(--ink-3); }
.suite-titre:first-child { margin-top: 0; }
.suite-gestes { display: flex; flex: none; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 8px; }
.suite-gestes > a { padding: 6px 12px; font-size: 13px; }
.plg-mark svg { color: var(--ink-2); }
@media (max-width: 560px) {
  .plg-card > .suite-gestes { margin-left: 64px; justify-content: flex-start; }
}

/* ---- Réglages › Applications, relue le 23/10/2026 (« tout ça il faut que ce
   soit plus clair ») : une carte d'abonnement, puis une ligne par application —
   signe, nom et description, l'état de l'assistant, une pastille de ce qui est
   inclus, l'interrupteur « Dans le menu » et un seul bouton. */
.plg-card.suite-abonnement { flex-direction: column; align-items: stretch; gap: 10px; }
.suite-abonnement-tete { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px 16px; }
.suite-abonnement-qui { display: grid; gap: 2px; min-width: 0; }
.suite-taille { font-size: 20px; font-weight: 700; color: var(--ink); }
.suite-organisation { font-size: 14px; color: var(--ink-2); }
.suite-abonnement-etat { margin: 0; font-size: 13px; color: var(--ink-2); }
.suite-abonnement-pied { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 12px; font-size: 12.5px; color: var(--ink-3); }
.suite-detacher { margin: 0; }
.suite-lien { padding: 0; border: 0; background: none; font: inherit; color: var(--ink-3); text-decoration: underline; cursor: pointer; }
.suite-lien:hover { color: var(--ink); }
.suite-apps { display: grid; border: 1px solid var(--line); border-radius: 12px; overflow: hidden; }
.suite-app { display: grid; grid-template-columns: 32px minmax(0, 1fr) auto auto auto; align-items: center; gap: 8px 16px; padding: 14px 16px; }
.suite-app + .suite-app { border-top: 1px solid var(--line); }
.suite-app-mark { display: inline-flex; align-items: center; justify-content: center; width: 32px; height: 32px; border-radius: 8px; box-shadow: inset 0 0 0 1px var(--line-2); color: var(--ink-2); }
.suite-app-texte { min-width: 0; }
.suite-app-texte h2 { margin: 0; font-size: 14px; font-weight: 600; color: var(--ink); }
.suite-app-ligne { margin: 2px 0 0; font-size: 13px; color: var(--ink-3); }
.suite-app-assistant { margin: 4px 0 0; font-size: 12.5px; color: var(--ink-2); }
.suite-app-assistant a { color: var(--ink); text-decoration: underline; }
.suite-pastille { display: inline-flex; align-items: center; padding: 2px 8px; border-radius: 999px; box-shadow: inset 0 0 0 1px var(--line-2); font-size: 12px; color: var(--ink-3); white-space: nowrap; }
.suite-pastille.on { color: var(--ink); }
.suite-app-menu { display: flex; align-items: center; }
.suite-app-action .plugin-primary-action { padding: 6px 12px; font-size: 13px; }
.suite-options { grid-column: 2 / -1; font-size: 13px; color: var(--ink-2); }
.suite-options > summary { cursor: pointer; color: var(--ink-2); }
@media (max-width: 640px) {
  .suite-app { grid-template-columns: 32px minmax(0, 1fr); }
  .suite-app-inclus, .suite-app-menu, .suite-app-action { grid-column: 2; }
}

/* ---- Le statut du domaine personnalisé (settings_workspace.rs, n° 57) ----
   VERIFIED et en attente passent par BADGE-A (`esc-badge`) ; l'échec garde
   le rouge, c'est une erreur. */
.esc-domain-failed {
  border-radius: var(--r-cite);
  background: var(--danger-soft);
  color: var(--danger);
}

/* ---- Prescriptio : l'alerte au rouge du thème (n° 9) -------------------- */
.pxo-alert {
  border-color: color-mix(in srgb, var(--danger) 35%, transparent);
  border-radius: var(--r-sm);
  color: var(--danger);
}

/* ---- La frise d'activité : un texte lisible, un focus d'encre (n° 10) --- */
.fl-tl-chip:has(input:not(:checked)) { color: var(--ink-3); }
.fl-tl-chip:has(input:focus-visible) { outline: 2px solid var(--focus); outline-offset: 3px; }

/* ==========================================================================
   Lot 9 — MEMBRES-B, MODULES-B, IA-B, SECU-B (décision 9)
   ========================================================================== */

/* ---- La table des réglages (`esc-table`) : une boîte, un en-tête en
   petites capitales, des lignes qui s'allument au survol. Membres, carte des
   flux IA. */
.esc-table {
  border-color: var(--line);
  border-radius: var(--r);
  background: var(--card);
}
.esc-table-h {
  font: var(--t-label);
  letter-spacing: var(--ls-label);
  text-transform: uppercase;
  color: var(--ink-3);
  background: var(--paper);
  border-color: var(--line);
}
.esc-table-r { transition: background-color var(--d-hover); }
.esc-table-r:hover { background: var(--paper); }
.esc-table .divide-y > * + * { border-color: var(--line); }

/* MEMBRES-B : la personne est un lien vers ses droits ; le rôle, une étiquette
   BADGE-A qu'on déroule. */
.esc-person { color: var(--ink); text-decoration: none; }
.esc-person:hover { text-decoration: underline; text-underline-offset: 2px; }
.esc-person:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; }
.esc-role-select {
  border-radius: var(--r-cite);
  background-color: var(--paper-2);
  color: var(--ink);
  box-shadow: inset 0 0 0 1px var(--line);
}
.esc-role-select:hover { box-shadow: inset 0 0 0 1px var(--line-2); }
.esc-role-select:focus { box-shadow: inset 0 0 0 1px var(--ink), var(--ring-ink); }

/* IA-B : la carte des flux — traitement, modèle, où ça tourne, qui l'a
   choisi, et « Modifier » sur la ligne. */
.esc-flow :is(.esc-table-h, .esc-table-r) {
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.5fr) minmax(0, 1fr) minmax(0, 1fr) auto;
}
@media (max-width: 700px) {
  .esc-flow :is(.esc-table-h, .esc-table-r) { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto; }
  .esc-flow .esc-table-r > :nth-child(3),
  .esc-flow .esc-table-r > :nth-child(4),
  .esc-flow .esc-table-h > :nth-child(3),
  .esc-flow .esc-table-h > :nth-child(4) { display: none; }
}

/* ---- MODULES-B : une seule liste, une ligne par module ------------------ */
.esc-flag-list {
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: var(--r);
  background: var(--card);
}
.esc-flag-list > * { margin: 0; }
.esc-flag-list > * + * { border-top: 1px solid var(--line); }
/* Un module en service est un LIEN vers sa confirmation (2026-09-29), un
   module éteint un bouton : les deux se dessinent pareil. */
.esc-flag-list :is(button, a)[role="switch"] { text-decoration: none; color: inherit; }
.esc-flag-list button[role="switch"] {
  border: 0;
  border-radius: 0;
  background: transparent;
}
.esc-flag-list :is(button, a)[role="switch"] { border: 0; border-radius: 0; background: transparent; }
.esc-flag-list :is(button, a)[role="switch"]:hover { background: var(--paper); }
.esc-flag-list :is(button, a)[role="switch"]:focus-visible { outline: 2px solid var(--focus); outline-offset: -2px; }
/* Un module en pause : son libellé passe au second plan. */
.esc-flag-list [role="switch"][aria-checked="false"] .text-gray-12 { color: var(--ink-2); }

/* MEMBRES-B : huit colonnes — la personne, le rôle, ses équipes, la double
   authentification, la dernière connexion, puis les trois gestes. Sur un
   écran étroit, les trois colonnes d'information se retirent. */
/* 2026-10-02 : sept colonnes — les équipes sont sous la personne, et la colonne
   du nom garde 12rem au moins, sans quoi la fenêtre des réglages l'écrasait. */
/* Des largeurs FIXES hors de la colonne du nom : l'en-tête et chaque ligne sont
   des grilles distinctes, et des colonnes « auto » s'y calculaient chacune de leur
   côté — « Rôle » tombait au-dessus de la double authentification (2026-10-02). */
/* D444 (3/11/2026) : le tableau tient dans la fenêtre des réglages à TOUTES les
   largeurs. Les colonnes se replient selon la largeur du tableau lui-même (requête
   de conteneur), pas celle de l'écran : la fenêtre des réglages est bien plus
   étroite que l'écran, et c'est elle qui débordait (corbeille coupée à droite).
   Cinq colonnes nommées : la personne, le rôle, la double authentification, la
   dernière connexion, et le menu « … » qui porte les trois gestes. Sous 45rem la
   double authentification se replie, sous 37rem la dernière connexion, sous 28rem
   le rôle passe sous la personne. Aucune cellule ne passe sur deux lignes.
   Mesuré sur la fenêtre : 880 px de tableau à 1 440 et 1 280 px d'écran (55rem,
   tout se montre), 644 px à 1 024 (40rem, sans la double authentification),
   358 px à 390 (22rem, le rôle sous la personne). */
.esc-members { container-type: inline-size; container-name: membres; }
.esc-members .esc-table-h { border-radius: var(--r) var(--r) 0 0; }
.esc-members .divide-y > :last-child { border-radius: 0 0 var(--r) var(--r); }
.esc-members-grid {
  display: grid;
  grid-template-columns: minmax(10rem, 1fr) 15rem 6.5rem 7rem 2rem;
  grid-template-areas: "p r f l a";
}
.esc-m-person { grid-area: p; min-width: 0; }
.esc-m-role { grid-area: r; min-width: 0; }
.esc-m-2fa { grid-area: f; min-width: 0; white-space: nowrap; }
.esc-m-last { grid-area: l; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.esc-m-actions { grid-area: a; justify-self: end; }
.esc-members-grid > span { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.esc-members .esc-role-select { width: 100%; min-width: 0; }
.esc-members .esc-m-role button { flex: none; white-space: nowrap; }
@container membres (max-width: 45rem) {
  .esc-members-grid { grid-template-columns: minmax(9rem, 1fr) 15rem 7rem 2rem; grid-template-areas: "p r l a"; }
  .esc-m-2fa { display: none; }
}
@container membres (max-width: 37rem) {
  .esc-members-grid { grid-template-columns: minmax(8rem, 1fr) minmax(0, 15rem) 2rem; grid-template-areas: "p r a"; }
  .esc-m-last { display: none; }
}
@container membres (max-width: 28rem) {
  .esc-members-grid { grid-template-columns: minmax(0, 1fr) 2rem; grid-template-areas: "p a" "r r"; row-gap: .5rem; }
  .esc-table-h .esc-m-role { display: none; }
}

/* Le menu « … » d'une ligne : sans script (`details`), ouvert sous le bouton, à
   droite ; sur les deux dernières lignes d'une longue liste, au-dessus. */
.esc-member-menu { position: relative; }
.esc-member-menu > summary { list-style: none; }
.esc-member-menu > summary::-webkit-details-marker { display: none; }
.esc-member-more {
  display: inline-grid; place-items: center; width: 2rem; height: 1.75rem;
  border-radius: var(--r-sm); color: var(--ink-2); cursor: pointer;
}
.esc-member-more:hover, .esc-member-menu[open] > .esc-member-more { background: var(--paper-2); color: var(--ink); }
.esc-member-more:focus-visible { outline: 2px solid var(--focus); outline-offset: 1px; }
.esc-member-pop {
  position: absolute; z-index: 30; top: calc(100% + 4px); right: 0; min-width: 13rem;
  display: flex; flex-direction: column; padding: 4px;
  background: var(--card); border: 1px solid var(--line-2); border-radius: var(--r);
  box-shadow: var(--shadow-pop, var(--shadow-frame));
}
.esc-members .esc-table-r:nth-last-child(-n+2):not(:nth-child(-n+2)) .esc-member-pop { top: auto; bottom: calc(100% + 4px); }
.esc-member-pop form { margin: 0; }
.esc-member-item {
  display: flex; align-items: center; gap: 8px; width: 100%; min-height: 30px; padding: 4px 8px;
  border: 0; border-radius: 6px; background: transparent; color: var(--ink);
  font-size: 13px; line-height: 1.3; text-align: left; text-decoration: none; cursor: pointer; white-space: nowrap;
}
.esc-member-item:hover { background: var(--paper-2); }
.esc-member-item svg { color: var(--ink-3); flex: none; }
.esc-member-item:disabled, .esc-member-item[aria-disabled="true"] { color: var(--ink-3); cursor: not-allowed; background: transparent; }
.esc-member-danger, .esc-member-danger svg { color: var(--danger); }

/* SECU-B : les assistants et les clés — l'accès, le rôle porté, le dernier
   accès, « Gérer ». Sur un écran étroit, le rôle se retire. */
.esc-holders-grid { grid-template-columns: minmax(0, 1fr) minmax(0, 11rem) 8.5rem auto; }
@media (max-width: 700px) {
  .esc-holders-grid { grid-template-columns: minmax(0, 1fr) 8.5rem auto; }
  .esc-holders-opt { display: none; }
}
[data-holder][data-active="false"] { opacity: .6; }

/* ---- Nouveautés : le point du sommaire ----------------------------------
   Une version parue depuis la dernière lecture : le rond signal, ce qui
   bouge — jamais un texte, jamais un compteur. */
.settings-nav-new {
  flex: none;
  width: 7px;
  height: 7px;
  border-radius: var(--r-round);
  background: var(--signal);
}

/* ---- Une table de réglages trop large pour un téléphone -----------------
   Elle défile dans sa boîte (`overflow-x-auto` sur le parent) au lieu de
   couper ses colonnes. */
.esc-wide-table { min-width: 560px; }

/* ---- Outil maison MCP : liste ou compteur -------------------------------
   Les deux blocs sont rendus ; on montre celui de l'intention cochée. */
form:has(input[name="kind"][value="count"]:checked) [data-kind-list],
form:has(input[name="kind"][value="list"]:checked) [data-kind-count] { display: none; }

/* ---- Éditeur « Fiche » : l'icône d'un onglet (D14) ----------------------
   Le catalogue d'icônes en radios, replié dans un <details> dont le
   sommaire montre l'icône retenue — zéro script. */
.fiche-icon { position: relative; flex: none; }
.fiche-icon > summary {
  list-style: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  background: var(--card);
  color: var(--ink-2);
  cursor: pointer;
}
.fiche-icon > summary::-webkit-details-marker { display: none; }
.fiche-icon > summary:focus-visible { outline: 2px solid var(--focus); outline-offset: 1px; }
.fiche-icon-grid {
  position: absolute;
  z-index: 30;
  top: 36px;
  left: 0;
  display: grid;
  grid-template-columns: repeat(8, 30px);
  gap: 2px;
  max-height: 232px;
  overflow-y: auto;
  padding: 6px;
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  background: var(--card);
  box-shadow: var(--shadow-pop);
}
.fiche-icon-grid label {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  border: 1px solid transparent;
  border-radius: var(--r-sm);
  color: var(--ink-2);
  cursor: pointer;
}
.fiche-icon-grid label:hover { background: var(--paper-2); }
.fiche-icon-grid label:has(input:checked) { border-color: var(--ink); color: var(--ink); background: var(--paper-2); }
.fiche-icon-grid label:has(input:focus-visible) { outline: 2px solid var(--focus); }
.fiche-icon-grid input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.fiche-icon-none { color: var(--ink-3); font-size: 13px; line-height: 1; }
.fiche-home-icon { display: inline-flex; width: 32px; justify-content: center; color: var(--ink-2); }
/* Les valeurs retenues d'un filtre : des cases, sur toute la largeur. */
.fiche-values { grid-column: 1 / -1; display: flex; flex-wrap: wrap; gap: 4px 14px; margin: 0; padding: 0; border: 0; min-width: 0; }
.fiche-values > legend { float: left; width: 100%; margin-bottom: 3px; padding: 0; }
/* ---- MEMBRES-B : les équipes d'une personne -----------------------------
   Des étiquettes au trait, pas des pastilles d'état : une équipe n'est pas
   un statut. */
@media (min-width: 701px) {
  .esc-member-teams { display: flex; flex-wrap: wrap; gap: 4px; min-width: 0; }
}
.esc-team-tag {
  display: inline-block;
  max-width: 100%;
  overflow: hidden;
  padding: 1px 7px;
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  color: var(--ink-2);
  font-size: 0.75rem;
  line-height: 1.4;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* ---- MODULES-B : qui voit un module ------------------------------------ */
.esc-module-seen { flex: none; max-width: 15rem; text-align: right; }
@media (max-width: 700px) { .esc-module-seen { display: none; } }

/* ---- PARAM-B : la recherche trouve un réglage et l'allume ----------------
   Les réglages précis du sommaire (`data-settings-hit`) n'existent que pour
   la recherche : repliés tant qu'elle est vide. Le bloc visé (`#r-…`)
   s'allume à l'arrivée, puis s'éteint — ce qui bouge, le temps de le voir. */
.settings-modal-sidebar:has([data-settings-search]:placeholder-shown) [data-settings-hit] { display: none; }
[data-settings-content] section[id] { scroll-margin-top: 16px; }
[data-settings-content] section[id]:target {
  border-radius: var(--r-sm);
  animation: esc-setting-found 1.8s var(--out) both;
}
@keyframes esc-setting-found {
  0%, 45% { background: var(--paper-2); box-shadow: 0 0 0 8px var(--paper-2), 0 0 0 9px var(--ink); }
  100% { background: transparent; box-shadow: 0 0 0 8px transparent, 0 0 0 9px transparent; }
}
@media (prefers-reduced-motion: reduce) {
  [data-settings-content] section[id]:target {
    animation: none;
    background: var(--paper-2);
    box-shadow: 0 0 0 8px var(--paper-2);
  }
}

/* ---- Réglages > Expérience : la barre de l'ESPACE, réglée par l'Admin ------
   (2026-10-05, `web::settings_nav_bar`). La carte « Ordre du menu »
   garde ses lignes ; l'Admin y gagne un en-tête, trois outils par ligne
   (renommer, ranger, masquer), les entrées rangées en retrait sous leur
   parent et les masquées à part. Le Tailwind est figé : tout le neuf est ici,
   `nbar-`. */
.nbar-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 12px;
  border-bottom: 1px solid var(--line);
}
.nbar-hint { margin: 0; font-size: 0.75rem; line-height: 1.45; color: var(--ink-3); }
/* Trois boutons de 24 px et leurs écarts (le nom, le rangement, le masquage) :
   les outils d'une ligne, ou leur place vide sur une ligne de module, pour
   que les flèches restent en colonne. `.nbar-arrows` tient la place des
   flèches sur une ligne rangée. */
.nbar-tools { display: flex; align-items: center; justify-content: flex-end; gap: 2px; width: 76px; flex-shrink: 0; }
.nbar-arrows { display: block; width: 50px; flex-shrink: 0; }
/* Le panneau « Ranger » : assez large pour « Rangement par défaut — sous
   Comptabilité » sans couper. */
.nbar-place > .fl-confirm-panel { width: 360px; max-width: min(360px, 90vw); }
.nbar-select {
  height: 32px;
  width: 100%;
  padding: 0 8px;
  border: 1px solid var(--line-2);
  border-radius: 8px;
  background: var(--card);
  color: var(--ink);
  font-size: 0.8125rem;
}
.nbar-select:focus { outline: none; border-color: var(--ink); }
/* Une entrée rangée : en retrait, reliée à son parent par un coude. */
.nbar-child { position: relative; padding-left: 34px; }
.nbar-child::before {
  content: "";
  position: absolute;
  left: 15px;
  top: 0;
  height: 50%;
  width: 10px;
  border-left: 1px solid var(--line-2);
  border-bottom: 1px solid var(--line-2);
  border-bottom-left-radius: 4px;
}
/* Les masquées : à part, sous un filet, grisées. */
.nbar-group {
  margin: 8px 8px 4px;
  padding-top: 10px;
  border-top: 1px solid var(--line);
  font-size: 0.6875rem;
  font-weight: 500;
  letter-spacing: var(--ls-label);
  text-transform: uppercase;
  color: var(--ink-3);
}
.nbar-hidden > span:first-child,
.nbar-hidden > .truncate { opacity: .5; }
.nbar-show {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  height: 24px;
  padding: 0 8px;
  border-radius: 6px;
  color: var(--ink-2);
  font-size: 0.75rem;
}
.nbar-show:hover { background: var(--paper-2); color: var(--ink); }

/* ---- /plugins : partagés, personnels (2026-10-13) ----------------------- */
/* La phrase sous le titre d'une section. */
.plugin-hint { margin: -4px 0 10px; color: var(--ink-3); font-size: 13px; line-height: 1.45; }
/* La fiche d'un connecteur partagé : « Qui gère ce connecteur ». */
.plugin-gestion { margin: 16px 0 4px; padding-top: 14px; border-top: 1px solid var(--line); }
.plugin-gestion h3 { margin: 0 0 6px; color: var(--ink); font-size: 14px; font-weight: 600; }
.plugin-gestion p { margin: 0 0 10px; color: var(--ink-2); font-size: 13px; line-height: 1.5; }
.plugin-gestion form { display: flex; flex-direction: column; align-items: flex-start; gap: 6px; }
.plugin-gestion form button { margin-top: 8px; }
.plugin-gestion-role { display: flex; align-items: center; gap: 8px; color: var(--ink); font-size: 14px; }
.plugin-gestion-role small { color: var(--ink-3); font-size: 12px; }
.plugin-gestion-note { margin: 12px 0 0; color: var(--ink-2); font-size: 13px; }
.plugin-gestion-erreur { color: var(--danger); }
/* La fiche « Google Drive de l'espace » : chacun de ses Drive, et
   « Débrancher » pour qui gère le connecteur. */
.plugin-drives { margin: 16px 0 4px; padding-top: 14px; border-top: 1px solid var(--line); }
.plugin-drives h3 { margin: 0 0 6px; color: var(--ink); font-size: 14px; font-weight: 600; }
.plugin-drives > p { margin: 0; color: var(--ink-3); font-size: 13px; }
.plugin-drives ul { display: flex; flex-direction: column; gap: 10px; margin: 0; padding: 0; list-style: none; }
.plugin-drive { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.plugin-drive .plugin-row-copy { min-width: 0; }
.plugin-drive strong { color: var(--ink); font-size: 14px; font-weight: 600; overflow-wrap: anywhere; }
.plugin-drive form { flex: none; margin: 0; }
.plugin-drive button.plugin-row-action { border: 0; font: inherit; font-size: 12px; font-weight: 600; cursor: pointer; }
.plugin-drive-alerte { color: var(--danger); }

/* ---- Réglages › Utilisation : « Votre utilisation », comme dans Claude --
   D21 (31/10/2026) : une ligne par fenêtre — son nom et sa remise à zéro à
   gauche, une barre fine arrondie, « X % utilisés » à droite, le détail des
   deux compteurs dessous. La barre est à l'encre ; pleine, au rouge du refus. */
.usage-lead { margin: 0 0 4px; color: var(--ink); font-size: 14px; line-height: 1.45; }
.usage-note { margin: 0; color: var(--ink-3); font-size: 13px; line-height: 1.45; }
.usage-rows { display: flex; flex-direction: column; margin-top: 8px; }
.usage-row { padding: 14px 0; }
.usage-row + .usage-row { border-top: 1px solid var(--line); }
.usage-row-head { display: flex; align-items: center; gap: 24px; }
.usage-row-name { flex: 0 0 200px; min-width: 0; }
.usage-row-label { color: var(--ink); font-size: 14px; font-weight: 500; }
.usage-row-reset { margin-top: 2px; color: var(--ink-3); font-size: 12.5px; line-height: 1.4; }
.usage-row-meter { display: flex; flex: 1 1 auto; align-items: center; gap: 14px; min-width: 0; }
.usage-bar { position: relative; flex: 1 1 auto; height: 8px; overflow: hidden; border-radius: var(--r-pill); background: var(--paper-2); box-shadow: inset 0 0 0 1px var(--line); }
.usage-bar > i { position: absolute; inset: 0 auto 0 0; border-radius: var(--r-pill); background: var(--ink); }
.usage-bar > i.is-full { background: var(--danger); }
.usage-row-pct { flex: none; min-width: 92px; color: var(--ink-2); font-size: 13px; text-align: right; font-variant-numeric: tabular-nums; }
.usage-row-pct a { color: var(--ink); font-weight: 500; text-decoration: underline; text-underline-offset: 2px; }
.usage-row-detail { margin: 6px 0 0 224px; color: var(--ink-3); font-size: 12.5px; font-variant-numeric: tabular-nums; }
.usage-row-exempt { display: inline-block; margin-left: 8px; padding: 1px 8px; border-radius: var(--r-pill); background: var(--paper-2); color: var(--ink-2); font-size: 11.5px; font-weight: 500; }
@media (max-width: 640px) {
  .usage-row-head { flex-direction: column; align-items: stretch; gap: 8px; }
  .usage-row-name { flex: none; }
  .usage-row-detail { margin-left: 0; }
}

/* D26 (2026-10-31) : « Branchés » en tête, court — des pastilles qui mènent
   à chaque connexion — puis la tête de l'annuaire, ses familles tout de suite. */
.plugin-branches { display: flex; flex-wrap: wrap; gap: 8px; }
.plugin-branche {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
  max-width: 100%;
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  padding: 6px 10px 6px 6px;
  color: var(--ink);
  text-decoration: none;
}
.plugin-branche:hover { background: var(--paper-2); }
.plugin-branche:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; }
.plugin-branche .plugin-icon { width: 24px; height: 24px; }
.plugin-branche-copie { display: flex; min-width: 0; flex-direction: column; line-height: 1.2; }
.plugin-branche-copie strong { overflow: hidden; font-size: 13px; font-weight: 600; text-overflow: ellipsis; white-space: nowrap; }
.plugin-branche-copie small { color: var(--ink-3); font-size: 11px; }
.plugin-annuaire-tete { margin: 8px 0 4px; }
.plugin-annuaire-tete h2 { color: var(--ink); }
.plugin-skill-scope {
  margin-left: 4px;
  border-radius: 999px;
  background: var(--paper-2);
  padding: 1px 7px;
  color: var(--ink-2);
  font-size: 11px;
  font-weight: 500;
}
.plugin-mcp-panne { color: var(--danger, #b42318); font-weight: 600; }
.plugin-row-copy small.plugin-mcp-pourquoi { font-size: 12px; }

/* Réglages › Modèle de données › la liste : les métiers par groupe, le système replié (D188). */
.b-dm-groupe{padding:14px 8px 4px;font-size:12px;font-weight:600;color:var(--ink-3)}
.b-dm-systeme{margin-top:12px;border:1px solid var(--line);border-radius:var(--r-sm)}
.b-dm-systeme>summary{display:flex;align-items:center;gap:8px;min-height:40px;padding:0 12px;cursor:pointer;list-style:none;font-size:13px;font-weight:500;color:var(--ink-2)}
.b-dm-systeme>summary::-webkit-details-marker{display:none}
.b-dm-systeme>summary svg{flex:none;transition:transform .12s ease}
.b-dm-systeme[open]>summary svg{transform:rotate(90deg)}
.b-dm-systeme-compte{font-weight:400;color:var(--ink-3);font-variant-numeric:tabular-nums}

/* Réglages › Modèle de données › le schéma (D188, D189) : cartes compactes par groupe, un objet
   centré avec ses voisins, zoom. Aucun script : l'état vit dans l'adresse. Sur téléphone, le
   canevas laisse la place à des listes. */
.settings-modal-panel [data-settings-page="/settings/objects/overview"] [data-settings-content]{padding-inline:32px}
.settings-modal-panel .model-overview{height:auto}
.b-sch-barre{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;padding:0 0 12px;flex:none}
.b-sch-filtres{display:inline-flex;gap:2px;padding:2px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--paper-2)}
.b-sch-filtre{display:inline-flex;align-items:center;gap:6px;height:26px;padding:0 10px;border-radius:calc(var(--r-sm) - 2px);font-size:12.5px;font-weight:500;color:var(--ink-2);white-space:nowrap}
.b-sch-filtre:hover{color:var(--ink)}
.b-sch-filtre[aria-current]{background:var(--paper);color:var(--ink);box-shadow:0 0 0 1px var(--line)}
.b-sch-filtre-compte{font-size:11.5px;font-weight:400;color:var(--ink-3);font-variant-numeric:tabular-nums}
.b-sch-cherche{flex:1 1 180px;min-width:0;display:flex;align-items:center;gap:6px;height:32px;padding:0 10px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--paper);color:var(--ink-3)}
.b-sch-cherche:focus-within{border-color:var(--ink-3)}
.b-sch-cherche svg{flex:none}
.b-sch-cherche input{flex:1;min-width:0;border:0;outline:0;background:transparent;font-size:13px;color:var(--ink)}
.b-sch-cherche input::placeholder{color:var(--ink-3)}
.b-sch-zoom{display:inline-flex;align-items:center;height:32px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--paper)}
.b-sch-zoom-pas{display:inline-flex;align-items:center;justify-content:center;width:30px;height:100%;color:var(--ink-2)}
a.b-sch-zoom-pas:hover{color:var(--ink);background:var(--paper-2)}
.b-sch-zoom-pas[data-inactif]{color:var(--line-2)}
.b-sch-zoom-valeur{min-width:56px;padding:0 4px;text-align:center;font-size:12px;color:var(--ink-2);font-variant-numeric:tabular-nums;white-space:nowrap}
.b-sch-zoom-valeur:hover{color:var(--ink)}
.b-sch-lien{display:inline-flex;align-items:center;height:32px;padding:0 10px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--paper);font-size:12.5px;font-weight:500;color:var(--ink-2);white-space:nowrap}
.b-sch-lien:hover{color:var(--ink);background:var(--paper-2)}
.b-sch-resume{flex:none;margin:0 0 10px;font-size:12.5px;line-height:18px;color:var(--ink-3)}
.b-sch-retour{display:inline-flex;align-items:center;gap:4px;font-size:12.5px;font-weight:500;color:var(--ink-2);vertical-align:bottom}
.b-sch-retour:hover{color:var(--ink);text-decoration:underline}
.b-sch-vide{display:flex;flex-direction:column;align-items:center;gap:12px;padding:48px 16px;border:1px dashed var(--line-2);border-radius:var(--r-sm);font-size:13px;color:var(--ink-3)}
.model-overview-viewport.b-sch-boite{container:sch/inline-size;flex:none;border:1px solid var(--line);border-radius:var(--r-sm);background-color:var(--paper-2);background-image:radial-gradient(var(--line) 1px,transparent 1px);background-size:16px 16px;scrollbar-gutter:auto}
.b-sch-toile{position:relative;margin-inline:auto}
.b-sch-courbes{position:absolute;inset:0;z-index:0;overflow:visible;pointer-events:none}
.b-sch-courbes path{fill:none;stroke:var(--line-2);stroke-width:1.25;pointer-events:stroke}
.b-sch-courbes path:hover{stroke:var(--ink-2);stroke-width:2}
.b-sch-courbes text{font-size:12px;fill:var(--ink-2);paint-order:stroke;stroke:var(--paper-2);stroke-width:4px;stroke-linejoin:round}
.b-sch-groupe{position:absolute;z-index:1;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-size:12px;font-weight:600;line-height:20px;color:var(--ink-2)}
.b-sch-carte{position:absolute;z-index:1;box-sizing:border-box;display:flex;align-items:center;gap:8px;padding:0 10px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--paper);color:var(--ink);transition:border-color .12s ease}
.b-sch-carte:hover{border-color:var(--ink-3)}
.b-sch-tuile{flex:none;display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;border:1px solid;border-radius:6px}
.b-sch-carte-texte{min-width:0;display:flex;flex-direction:column;gap:1px}
.b-sch-carte-nom{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-size:13px;font-weight:500;line-height:17px;color:var(--ink)}
.b-sch-carte-compte{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-size:11.5px;line-height:15px;color:var(--ink-3);font-variant-numeric:tabular-nums}
.b-sch-centre{position:absolute;z-index:2;box-sizing:border-box;display:flex;flex-direction:column;justify-content:center;gap:6px;padding:12px 14px;border:1.5px solid var(--ink);border-radius:var(--r-sm);background:var(--paper)}
.b-sch-centre-tete{display:flex;align-items:center;gap:8px;min-width:0}
.b-sch-centre-nom{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-size:14.5px;font-weight:600;color:var(--ink)}
.b-sch-champs{flex:none;margin-top:16px}
.b-sch-groupe-titre{margin:0 0 8px;font-size:12.5px;font-weight:600;color:var(--ink-2)}
.b-sch-sans-lien{margin:0 0 8px;font-size:13px;color:var(--ink-3)}
.b-sch-champs-grille{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:2px 16px}
.b-sch-champ{display:flex;align-items:center;gap:8px;min-width:0;height:26px;font-size:12.5px;color:var(--ink-2)}
.b-sch-champ svg{flex:none;color:var(--ink-3)}
.b-sch-champ-nom{min-width:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.b-sch-listes{display:none}
@container sch (max-width:1160px){.b-sch-ajuste-6{zoom:.9}}
@container sch (max-width:1040px){.b-sch-ajuste-6{zoom:.85}}
@container sch (max-width:980px){.b-sch-ajuste-centre{zoom:.95}}
@container sch (max-width:960px){.b-sch-ajuste-6{zoom:.8}.b-sch-ajuste-5{zoom:.95}}
@container sch (max-width:880px){.b-sch-ajuste-6{zoom:.74}.b-sch-ajuste-5{zoom:.88}.b-sch-ajuste-centre{zoom:.88}}
@container sch (max-width:780px){.b-sch-ajuste-6{zoom:.66}.b-sch-ajuste-5{zoom:.78}.b-sch-ajuste-4{zoom:.98}.b-sch-ajuste-centre{zoom:.78}}
@media (max-width:700px){
  .model-overview-viewport.b-sch-boite,.b-sch-zoom{display:none}
  .b-sch-listes{display:flex;flex-direction:column;gap:16px}
  .settings-modal-panel [data-settings-page="/settings/objects/overview"] [data-settings-content]{padding-inline:16px}
  .b-sch-barre{gap:8px}
  .b-sch-filtres{flex:1 1 100%}
  .b-sch-filtre{flex:1;justify-content:center;height:32px}
  .b-sch-cherche{flex:1 1 0;height:36px}
  .b-sch-lien{height:36px}
  .b-sch-ligne{display:flex;align-items:center;gap:10px;min-height:48px;padding:6px 2px;border-bottom:1px solid var(--line)}
  .b-sch-ligne:last-child{border-bottom:0}
  .b-sch-ligne .b-sch-carte-texte{flex:1}
  .b-sch-ligne-suite{flex:none;display:inline-flex;color:var(--ink-3)}
  .b-sch-centre-liste{display:flex;flex-direction:column;gap:6px;padding:12px 14px;border:1.5px solid var(--ink);border-radius:var(--r-sm);background:var(--paper)}
  .b-sch-champs-grille{grid-template-columns:1fr 1fr}
}

/* ---- Les tuiles du catalogue MCP, lisibles (HUB-CONNECTEURS, D112, 2/11/2026) ----------
   Le modèle de l'annuaire de claude.ai : la marque, le nom et AU PLUS une pastille, une
   ligne de description qui passe à la ligne au lieu de se tronquer (aucun « … » au repos,
   de 360 à 1 920 px), le geste à droite ; pour l'administrateur l'interrupteur « Membres »
   et, pour une panne, sa cause en mots simples. Les entrées pas encore disponibles se
   replient sous la grille (« Pas encore disponibles »). */
.plugin-mcp-tuile { align-items: flex-start; }
.plugin-mcp-tuile .plugin-icon { margin-top: 1px; }
.plugin-mcp-copie { gap: 4px; }
.plugin-mcp-tete { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; min-width: 0; }
.plugin-mcp-tuile .plugin-mcp-tete strong { overflow: visible; white-space: normal; overflow-wrap: anywhere; color: var(--ink); }
.plugin-mcp-pastille {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  border-radius: 999px;
  padding: 1px 8px;
  background: var(--paper-2);
  color: var(--ink-2);
  font-size: 11px;
  font-weight: 600;
  line-height: 18px;
  white-space: nowrap;
}
.plugin-mcp-pastille[data-pastille="connected"]::before {
  content: "";
  flex: none;
  width: 6px;
  height: 6px;
  border-radius: var(--r-mark);
  background: var(--ink);
}
.plugin-mcp-pastille[data-pastille="down"] { color: var(--danger, #b42318); }
.plugin-mcp-desc,
.plugin-mcp-pourquoi { display: block; overflow-wrap: anywhere; white-space: normal; font-size: 13px; line-height: 1.45; }
.plugin-mcp-desc { color: var(--ink-3); }
.plugin-mcp-pourquoi { color: var(--ink-2); font-size: 12px; }
.plugin-mcp-tuile .plugin-mcp-gestes { align-self: center; }
.plugin-membres { margin: 0; }
.plugin-membres-bouton {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  border: 0;
  border-radius: var(--r-sm);
  padding: 4px 6px;
  background: transparent;
  color: var(--ink-2);
  font: inherit;
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
}
.plugin-membres-bouton:hover:not(:disabled) { background: var(--paper-2); color: var(--ink); }
.plugin-membres-bouton:disabled { cursor: not-allowed; opacity: .6; }
.plugin-membres-bouton:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; }
.plugin-membres-piste {
  position: relative;
  flex: none;
  width: 28px;
  height: 16px;
  border-radius: 999px;
  background: var(--line-2);
  transition: background-color .15s ease;
}
.plugin-membres-bille {
  position: absolute;
  top: 2px;
  left: 2px;
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: var(--card);
  box-shadow: 0 1px 2px rgba(12, 13, 15, .25);
  transition: transform .15s ease;
}
.plugin-membres-bouton[aria-checked="true"] .plugin-membres-piste { background: var(--ink); }
.plugin-membres-bouton[aria-checked="true"] .plugin-membres-bille { transform: translateX(12px); }
.plugin-mcp-pli { margin-top: 14px; border-top: 1px solid var(--line); padding-top: 10px; }
.plugin-mcp-pli > summary { cursor: pointer; color: var(--ink-2); font-size: 13px; font-weight: 600; }
.plugin-mcp-pli > summary:focus-visible { outline: 2px solid var(--focus); outline-offset: 3px; }
.plugin-mcp-pli > .plugin-hint { margin: 8px 0 10px; }
@media (max-width: 560px) {
  .plugin-mcp-tuile { flex-wrap: wrap; }
  .plugin-mcp-tuile .plugin-mcp-copie { flex-basis: calc(100% - 44px); }
  .plugin-mcp-tuile .plugin-mcp-gestes { width: 100%; justify-content: flex-start; padding-left: 44px; }
}
@media (prefers-reduced-motion: reduce) {
  .plugin-membres-piste, .plugin-membres-bille { transition: none; }
}

/* HUB-AIDE-SUPPORT (H19, 2026-11-03) : le « ? » du glossaire à côté du titre
   d'une page de réglages. `<details>` : s'ouvre sans JavaScript ; le panneau
   se pose sous la ligne du titre, à sa largeur au plus. */
.reg-aide-titre-ligne { position: relative; display: flex; align-items: center; gap: 6px; }
.reg-aide { flex: none; }
.reg-aide-bouton { display: inline-flex; align-items: center; justify-content: center; width: 26px; height: 26px; border-radius: 50%; color: var(--ink-3); cursor: pointer; list-style: none; }
.reg-aide-bouton::-webkit-details-marker { display: none; }
.reg-aide-bouton:hover, .reg-aide[open] .reg-aide-bouton { color: var(--ink); background: var(--paper-2); }
.reg-aide-bouton:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; }
.reg-aide-panneau { position: absolute; top: calc(100% + 6px); left: 0; z-index: 20; display: flex; flex-direction: column; gap: 10px; width: min(460px, 100%); max-height: 60vh; overflow-y: auto; padding: 14px 16px; border: 1px solid var(--line); border-radius: var(--r); background: var(--card); box-shadow: var(--shadow-pop); color: var(--ink); font-size: 13px; line-height: 1.5; }
.reg-aide-titre { margin: 0; font-weight: 600; }
.reg-aide-resume { margin: 0; color: var(--ink-2); }
.reg-aide-options { display: flex; flex-direction: column; gap: 8px; margin: 0; }
.reg-aide-options dt { font-weight: 500; }
.reg-aide-options dd { margin: 0; color: var(--ink-2); }
.reg-aide-liens { display: flex; flex-wrap: wrap; gap: 6px 16px; margin: 0; padding-top: 8px; border-top: 1px solid var(--line); }
.reg-aide-liens a { color: var(--ink); text-decoration: underline; text-underline-offset: 2px; }

/* assets/b/premiers-pas.css */
/* ==========================================================================
   LES PREMIERS PAS DU SECOND CERVEAU (2026-10-31, D22 ;
   api/src/pages/second_brain_start.rs) — le parcours en six étapes et
   le bandeau en tête des pages du module. Il reprend les briques de l'accueil
   guidé (`bv-`, bienvenue.css, servie avant) et n'ajoute que les siennes,
   sous le préfixe `sbs-`, avec les seuls jetons de l'identité B : les deux
   thèmes suivent les jetons. Aucune animation sans `prefers-reduced-motion`.
   ========================================================================== */

/* ---- La page --------------------------------------------------------------- */
.sbs-page { max-width: 880px; padding-top: 20px; }
.sbs-page > .bv-carte, .sbs-page > form.bv-carte, .sbs-page > .bv-grille, .sbs-page > .sbs-cartes,
.sbs-page > .bv-actions { margin-top: 14px; }
.sbs-pied { margin-top: 22px; padding-top: 14px; border-top: 1px solid var(--line-2); }

/* ---- La tête et le pas à pas, sur UNE ligne -------------------------------- */
.sbs-tete { display: flex; align-items: center; gap: 12px; margin-bottom: 14px; }
.sbs-tete .bv-titre { flex: 1 1 auto; min-width: 0; }
.sbs-tete-n { white-space: nowrap; }
.sbs-tete .bv-btn { white-space: nowrap; }
.sbs-pas { margin: 0 0 22px; }
.sbs-pas ol { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); margin: 0; padding: 0; list-style: none; }
.sbs-pas-i { position: relative; min-width: 0; }
/* Le trait qui relie un pas au suivant. */
.sbs-pas-i + .sbs-pas-i::before {
  content: ""; position: absolute; top: 13px; right: calc(50% + 16px); left: calc(-50% + 16px);
  height: 2px; border-radius: 2px; background: var(--line);
}
.sbs-pas-i.is-fait + .sbs-pas-i::before, .sbs-pas-i.is-fait + .sbs-pas-i.is-actif::before { background: var(--signal); }
.sbs-pas-i a { display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 0 2px; color: var(--ink-2); text-decoration: none; }
.sbs-pas-i a:focus-visible { outline: none; }
.sbs-pas-i a:focus-visible .sbs-pas-rond { box-shadow: var(--focus); }
.sbs-pas-rond {
  position: relative; z-index: 1; display: inline-flex; align-items: center; justify-content: center;
  width: 28px; height: 28px; border: 2px solid var(--line); border-radius: 999px; background: var(--card);
  color: var(--ink-2); font-size: 12px; font-weight: 600;
}
.sbs-pas-texte { max-width: 100%; overflow: hidden; font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.sbs-pas-i.is-fait .sbs-pas-rond { border-color: var(--signal); background: var(--signal); color: var(--on-signal, var(--paper)); }
.sbs-pas-i.is-actif .sbs-pas-rond { border-color: var(--ink); background: var(--ink); color: var(--paper); }
.sbs-pas-i.is-actif .sbs-pas-texte { color: var(--ink); font-weight: 600; }
.sbs-pas-i a:hover .sbs-pas-texte { color: var(--ink); }

/* ---- Le titre de l'étape et son illustration ------------------------------- */
.sbs-titre { display: flex; align-items: center; gap: 12px; margin: 0 0 14px; }
.sbs-titre h2 { margin: 0; font-size: 22px; font-weight: 600; letter-spacing: var(--ls-tight, -0.01em); }
.sbs-titre-icone {
  display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto; width: 44px; height: 44px;
  border-radius: 12px; background: var(--signal-soft); color: var(--signal-text);
}

/* ---- Qui voit quoi --------------------------------------------------------- */
.sbs-qui { margin-top: 14px; }
.sbs-regles { margin: 0; padding: 0 0 0 18px; list-style: disc; font-size: 13px; line-height: 1.55; }
.sbs-regles li { margin: 0 0 8px; }
.sbs-regles li:last-child { margin-bottom: 0; }
.sbs-regles strong { font-weight: 600; }

/* ---- Les cartes des sources ---------------------------------------------- */
.sbs-cartes { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 12px; margin-bottom: 12px; }
.sbs-carte { display: flex; flex-direction: column; gap: 8px; }
.sbs-carte .bv-note { margin: 0; }
.sbs-carte .bv-actions { margin-top: auto; padding-top: 4px; }
.sbs-carte-tete { display: flex; align-items: center; gap: 8px; }
.sbs-carte-tete h3 { flex: 1 1 auto; min-width: 0; margin: 0; font-size: 15px; }
.sbs-carte-icone {
  display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto; width: 30px; height: 30px;
  border-radius: 8px; background: var(--paper-2); color: var(--ink-2);
}
.sbs-etat {
  display: inline-flex; align-items: center; gap: 6px; flex: 0 0 auto; padding: 2px 8px; border-radius: 999px;
  background: var(--paper-2); color: var(--ink-2); font-size: 11px; font-weight: 600; white-space: nowrap;
}
.sbs-etat.is-ok, .sbs-etat.is-direct { background: var(--signal-soft); color: var(--signal-text); }
.sbs-etat.is-alerte { background: var(--danger-soft); color: var(--danger); }
.sbs-pouls { width: 7px; height: 7px; border-radius: 999px; background: var(--signal); }

/* ---- Jusqu'où, et quoi exclure ------------------------------------------- */
.sbs-boite h3 { word-break: break-word; }
.sbs-boite select.bv-champ { max-width: 220px; }
.sbs-boite select.bv-champ:disabled { opacity: .6; }

/* ---- Ça se remplit --------------------------------------------------------- */
.sbs-sources { display: flex; flex-direction: column; gap: 14px; margin: 12px 0 0; padding: 0; list-style: none; }
.sbs-source { display: flex; align-items: flex-start; gap: 10px; }
.sbs-source-corps { display: flex; flex: 1 1 auto; flex-direction: column; gap: 6px; min-width: 0; }
.sbs-source-ligne { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 4px 12px; }
.sbs-source-nom { min-width: 0; overflow: hidden; font-size: 14px; font-weight: 600; text-overflow: ellipsis; white-space: nowrap; }
.sbs-jauge { position: relative; display: block; height: 8px; overflow: hidden; border-radius: 999px; background: var(--paper-2); }
.sbs-jauge-pleine { position: absolute; inset: 0 auto 0 0; border-radius: 999px; background: var(--signal); transition: width .6s var(--ease, ease); }
.sbs-jauge.is-indeterminee .sbs-jauge-pleine { width: 35%; }
.sbs-propositions { display: flex; flex-direction: column; margin: 10px 0; padding: 0; list-style: none; }
.sbs-proposition { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px; padding: 12px 0; border-bottom: 1px solid var(--line-2); }
.sbs-proposition:last-child { border-bottom: 0; }
.sbs-proposition-corps { display: flex; flex: 1 1 320px; flex-direction: column; gap: 3px; min-width: 0; font-size: 14px; }
.sbs-raison { color: var(--ink-2); font-size: 12px; }
.sbs-proposition-gestes { flex: 0 0 auto; }

/* ---- Demandez-lui ---------------------------------------------------------- */
.sbs-question h3 { margin: 0 0 10px; }
.sbs-questions { display: flex; flex-direction: column; gap: 8px; margin-bottom: 14px; }
.sbs-question-choix { margin: 0; }
.sbs-question-bouton {
  display: flex; align-items: center; justify-content: space-between; gap: 12px; width: 100%; padding: 12px 14px;
  border: 1px solid var(--line); border-radius: var(--r-sm); background: var(--card); color: var(--ink);
  font: inherit; font-size: 14px; text-align: left; cursor: pointer;
}
.sbs-question-bouton:hover { border-color: var(--ink-3, var(--ink-2)); background: var(--paper-2); }
.sbs-question-bouton:focus-visible { outline: none; box-shadow: var(--focus); }
.sbs-question-fleche { display: inline-flex; flex: 0 0 auto; color: var(--ink-2); }
.sbs-question-libre { margin-bottom: 8px; }

/* ---- La fin -------------------------------------------------------------- */
.sbs-fin { display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 28px 16px; text-align: center; }
.sbs-fin h3 { margin: 4px 0 0; font-size: 20px; }
.sbs-fin p { margin: 0; color: var(--ink-2); }
.sbs-fin-icone {
  display: inline-flex; align-items: center; justify-content: center; width: 72px; height: 72px;
  border-radius: 999px; background: var(--signal-soft); color: var(--signal-text);
}
.sbs-suite { margin-top: 14px; }
.sbs-suite-liens { display: flex; flex-direction: column; gap: 6px; }
.sbs-suite-lien {
  display: flex; align-items: center; gap: 8px; padding: 8px 10px; border-radius: var(--r-sm);
  color: var(--ink); font-size: 14px; text-decoration: none;
}
.sbs-suite-lien:hover { background: var(--paper-2); }

/* ---- Le bandeau, en tête des pages du module ----------------------------- */
.sbs-bandeau {
  display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin: 12px 16px; padding: 8px 12px;
  border: 1px solid var(--line); border-radius: var(--r-sm); background: var(--card); color: var(--ink);
  box-shadow: var(--shadow-1); font-size: 13px;
}
.sbs-bandeau-marque {
  display: inline-flex; align-items: center; justify-content: center; width: 22px; height: 22px;
  border-radius: 999px; background: var(--signal-soft); color: var(--signal-text); font-size: 12px;
}
.sbs-bandeau-texte { flex: 1 1 240px; }
.sbs-bandeau-barre { flex: 0 0 120px; }

/* ---- Le mouvement, pour qui l'accepte ------------------------------------- */
@media (prefers-reduced-motion: no-preference) {
  .sbs-pouls { animation: sbs-pouls 1.6s ease-in-out infinite; }
  .sbs-jauge.is-indeterminee .sbs-jauge-pleine { animation: sbs-glisse 1.4s ease-in-out infinite; }
}
@keyframes sbs-pouls { 0%, 100% { opacity: 1; } 50% { opacity: .35; } }
@keyframes sbs-glisse { 0% { left: -35%; } 100% { left: 100%; } }

/* ---- Le téléphone ----------------------------------------------------------- */
@media (max-width: 640px) {
  .sbs-page { padding-top: 12px; }
  .sbs-tete-n { display: none; }
  .sbs-pas-texte { display: none; }
  .sbs-pas-i.is-actif .sbs-pas-texte { display: none; }
  .sbs-titre h2 { font-size: 19px; }
  .sbs-titre-icone { width: 38px; height: 38px; }
  .sbs-bandeau-barre { flex-basis: 80px; }
  .sbs-proposition-gestes { width: 100%; }
}

/* B5 : la colonne d'étapes, une chose à la fois. */
@media (min-width: 761px) {
  .sbs-page[data-premiers-pas-etape] { display: grid; grid-template-columns: 230px minmax(0, 1fr); column-gap: 32px; align-items: start; }
  .sbs-page[data-premiers-pas-etape] > * { grid-column: 2; }
  .sbs-page[data-premiers-pas-etape] > .sbs-tete { grid-column: 1 / -1; }
  .sbs-page[data-premiers-pas-etape] > .sbs-pas { grid-column: 1; grid-row: 2 / span 30; margin: 0; }
  .sbs-page[data-premiers-pas-etape] .sbs-pas ol { display: flex; flex-direction: column; gap: 2px; }
  .sbs-page[data-premiers-pas-etape] .sbs-pas-i + .sbs-pas-i::before { display: none; }
  .sbs-page[data-premiers-pas-etape] .sbs-pas-i a { flex-direction: row; align-items: center; gap: 10px; padding: 7px 4px; }
  .sbs-page[data-premiers-pas-etape] .sbs-pas-texte { flex: 1; white-space: normal; font-size: 13px; }
}
.sbs-pas-duree { font-size: 11px; color: var(--ink-faint); white-space: nowrap; }
@media (max-width: 760px) {
  .sbs-page[data-premiers-pas-etape] .sbs-pas ol { display: flex; overflow-x: auto; gap: 6px; }
  .sbs-page[data-premiers-pas-etape] .sbs-pas-i:not(.is-actif) .sbs-pas-texte, .sbs-page[data-premiers-pas-etape] .sbs-pas-duree { display: none; }
  .sbs-page[data-premiers-pas-etape] .sbs-pas-i.is-actif { flex: 1; }
  .sbs-page[data-premiers-pas-etape] .sbs-pas-i + .sbs-pas-i::before { display: none; }
}

/* Le chapeau de la première étape : la phrase, en clair, sans bulle. */
.sbs-chapeau { margin: 0 0 14px; font-size: 15px; line-height: 1.55; color: var(--ink-2); max-width: 62ch; }

/* Le pied reste sous la main : Continuer se voit sans faire défiler. */
.sbs-pied { position: sticky; bottom: 0; z-index: 2; justify-content: flex-end; padding-block: 12px; background: var(--card); }

.sbs-trois { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin-top: 14px; }
.sbs-trois h3 { margin: 0 0 4px; font-size: 14px; font-weight: 600; }
.sbs-trois .bv-note { margin: 0; }
@media (max-width: 760px) { .sbs-trois { grid-template-columns: minmax(0, 1fr); } }

/* Le rail du guide au téléphone : six ronds réguliers, sans trou autour de l'étape en cours. */
@media (max-width: 640px) {
  .sbs-page[data-premiers-pas-etape] .sbs-pas ol { justify-content: space-between; }
  .sbs-page[data-premiers-pas-etape] .sbs-pas-i.is-actif { flex: none; }
}

/* assets/b/restes.css */
/* ==========================================================================
   Escouade · identité B — lot 9 : les classes mortes de l'ancienne palette

   Écrites après la dernière compilation Tailwind, ces classes n'existent pas
   dans app.css : elles ne rendaient RIEN (texte hérité, pas de fond). On leur
   donne le seul sens que l'identité B connaît : le refus au rouge retenu
   (--danger), l'avertissement à l'encre, le reste neutre. Inventaire du
   29/09 : yooz*.rs, settings_members.rs, workflow_conditions.rs,
   settings_api.rs (points de méthode), dashboard.rs, ged_search.rs.
   ========================================================================== */
:is(.text-red-9, .text-red-10, .text-red-11) { color: var(--danger); }
.bg-red-2 { background-color: var(--danger-soft); }
.border-red-6 { border-color: color-mix(in srgb, var(--danger) 35%, transparent); }
.bg-red-9 { background-color: var(--danger); }
.text-amber-11 { color: var(--ink); }
.bg-amber-2 { background-color: var(--paper-2); }
.border-amber-6 { border-color: var(--line-2); }
:is(.bg-green-9, .bg-blue-9, .bg-amber-9) { background-color: var(--ink-2); }

/* assets/b/second-cerveau.css */
/* ==========================================================================
   Escouade · identité B — le cadre du module « Second cerveau »
   (proposition A « Le fil du courriel », lot 1 : la charpente, 2026-10-12)
   Gabarit : web::second_cerveau::barre, posé par la coquille au-dessus
   de toute page du module.
     header.page-head            (le titre « Second cerveau », sans icône)
     div.cc-fbar.sc-tabs         (les onglets du fil, Réglages à droite)
     [div.sc-subbar]             (les écrans de l'onglet ouvert, s'il en a plusieurs)
     …le corps de l'écran, rendu par son module, avec son propre défilement.
   Tout le reste vient du produit : page-head (nav.css), cc-fbar / cc-tabs /
   cc-tab-n (cc.css), view-switch (app.css).
   Règles : seulement les jetons d'escouade-b.css, aucune couleur en dur ;
   l'onglet courant se souligne à l'encre, aucun ne prend de couleur.
   ========================================================================== */

/* ---- La barre des onglets : la cc-fbar de l'écran Ingestion, dans l'ordre
   du fil. Entre deux étapes du fil, un chevron ; un filet sépare la vue
   d'ensemble et la santé du fil lui-même. ---------------------------------- */
.sc-tabs .cc-tabs{flex-wrap:nowrap}
.sc-tabs .cc-tab{position:relative}
.sc-tabs .sc-f+.sc-f::before{content:"";position:absolute;left:-12px;top:50%;width:5px;height:5px;border-top:1.5px solid var(--ink-faint);border-right:1.5px solid var(--ink-faint);transform:translateY(-50%) rotate(45deg)}
.sc-sep{flex:none;width:1px;height:16px;background:var(--line-2)}

/* ---- La sous-barre d'un onglet : ses écrans, en pastilles ---------------- */
.sc-subbar{flex:none;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:6px 12px;padding:8px 16px;border-bottom:1px solid var(--line);background:var(--card)}

/* ---- Arrivée : les sources, en deux familles (Escouade, Plugins) ---------
   Un tableau par famille ; une source qui demande quelqu'un porte
   data-alert, sa pastille prend l'encre d'alerte. Le tableau défile seul
   sur un écran étroit. -------------------------------------------------- */
.sc-src-wrap{overflow-x:auto}
.sc-src{width:100%;border-collapse:collapse;font-size:13px}
.sc-src th{padding:6px 12px;border-top:1px solid var(--line);text-align:left;font-size:11px;font-weight:500;text-transform:none;color:var(--ink-3);white-space:nowrap}
.sc-src td{padding:8px 12px;border-top:1px solid var(--line);vertical-align:middle;color:var(--ink)}
.sc-src .n{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
.sc-src-n{display:block;font-weight:500;color:var(--ink)}
.sc-src-n:hover{text-decoration:underline}
.sc-src-k{display:block;font-size:12px;color:var(--ink-3)}
.sc-src-m{color:var(--ink-2);white-space:nowrap}
.sc-src tr[data-alert] .cc-chip{border-color:var(--danger);color:var(--danger)}
.sc-src tr[data-alert] .cc-chip>i{background:var(--danger)}

/* ---- La ligne du menu : le compte de la file, à droite du libellé -------- */
aside[data-nav-width] .sc-menu-n{flex:none;height:16px;margin-left:auto}

@media (max-width:767px){
  /* la tuile flottante de la coquille (36 px, à 8 px du bord) recouvre le
     début de l'en-tête : le titre se décale. */
  .page-head:has(+.sc-tabs){padding-left:52px}
  /* une rangée qui défile, l'onglet courant en tête, Réglages réduit à son
     icône */
  .sc-tabs{flex-wrap:nowrap;padding:4px 0 4px 12px}
  .sc-tabs .cc-tabs{flex:1;min-width:0;overflow-x:auto;scrollbar-width:none;gap:0 16px;padding-right:12px}
  .sc-tabs .cc-tabs::-webkit-scrollbar{display:none}
  .sc-tabs .cc-tab[aria-current="page"]{order:-1}
  .sc-tabs .sc-sep,.sc-tabs .sc-f+.sc-f::before{display:none}
  .sc-tabs .cc-fbar-r{flex:none;padding:0 10px;border-left:1px solid var(--line)}
  .sc-tabs .cc-fbar-r .sc-lb{display:none}
  .sc-subbar{padding:8px 12px}
}

/* ==========================================================================
   L'ACCUEIL ET LES ÉCRANS DE COMPRÉHENSION (studio du 4/11/2026, D627 ;
   api/src/pages/second_brain_accueil.rs). Préfixe `scv-`. La grammaire du kit :
   le rond attend, le carré est fait, la case vide est le reste. Pas de vert plein,
   pas de texte vert ; le rouge seulement pour une erreur.
   ========================================================================== */
.scv-page>*{flex-shrink:0}
.scv-page{display:flex;flex-direction:column;gap:14px;padding:18px 20px 72px;color:var(--ink);font-size:14px;overflow-y:auto;min-height:0;flex:1}
.scv-page h2{margin:0;font-size:20px;font-weight:600;line-height:1.25}
.scv-page h3{margin:0;font-size:15px;font-weight:600}
.scv-page p{margin:0}
.scv-h{font-size:22px}
.scv-p-chapeau{color:var(--ink-2);max-width:70ch}
.scv-moyen{display:flex;flex-direction:column;gap:14px;max-width:880px;margin-inline:auto;width:100%}
.scv-sous{margin-top:4px!important;color:var(--ink-2)}
.scv-p{display:inline-block;flex:none;width:10px;height:10px;vertical-align:baseline;box-sizing:border-box}
.scv-p-ron{border-radius:50%;background:var(--signal)}
.scv-p-car{border-radius:2px;background:var(--ink)}
.scv-p-vid{border-radius:2px;border:1.5px solid var(--line-2)}
.scv-p-err{border-radius:50%;background:var(--danger)}
.scv-d{display:inline-block;width:7px;height:7px;margin-right:7px;border-radius:50%;background:var(--signal)}
.scv-txt{flex:1;min-width:0;display:flex;flex-direction:column;gap:1px}
.scv-txt small{color:var(--ink-2);font-size:12px}
.scv-txt b{font-weight:500}
.scv-entre{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px}
.scv-titre{display:flex;flex-wrap:wrap;align-items:flex-start;justify-content:space-between;gap:10px}
.scv-titre p{margin-top:2px;color:var(--ink-2);max-width:74ch}
.scv-titre-p{margin-top:2px;color:var(--ink-2);max-width:74ch}
.scv-bande,.scv-alerte{display:flex;flex-wrap:wrap;align-items:center;gap:12px;padding:14px 16px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--card)}
.scv-bande h2{font-size:18px}
.scv-bande p{color:var(--ink-2);font-size:13px}
.scv-alerte{border-color:var(--danger)}
.scv-alerte.calme{border-color:var(--line-2)}
.scv-tuiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px}
.scv-tuile{display:flex;flex-direction:column;gap:2px;padding:12px 14px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--card);color:inherit;text-decoration:none}
.scv-tuile:hover{background:var(--paper-2)}
.scv-tuile-v{font-size:22px;font-weight:600;font-variant-numeric:tabular-nums}
.scv-tuile-l{color:var(--ink-2);font-size:13px}
.scv-deux{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,1fr);gap:14px;align-items:start}
.scv-deux-egal{grid-template-columns:repeat(2,minmax(0,1fr))}
.scv-pile{display:flex;flex-direction:column;gap:14px;min-width:0}
.scv-t{padding:0;overflow:hidden}
.scv-carte-h{display:flex;align-items:center;gap:8px;justify-content:space-between;padding:12px 16px;border-bottom:1px solid var(--line)}
.scv-carte-h + .bv-note { padding: 10px 16px; margin: 0; }
.scv-carte-h>.scv-p+h3,.scv-carte-h>.scv-p+b{margin-right:auto}
.b-rule-tete{justify-content:flex-start;flex-wrap:wrap}
.b-rule-tete>.scv-p+b{margin-right:0}
.b-rule-tete small{color:var(--ink-2);font-size:12px}
.b-rule-pile{display:flex;flex-direction:column;gap:12px}
.b-rule-gestes{display:flex;align-items:center;gap:8px;flex:none;flex-wrap:wrap}
.b-rule-detail .b-rule-gestes{margin-top:6px}
.b-rule.is-off .scv-txt{opacity:.72}
.scv-rangee{display:flex;align-items:center;gap:10px;padding:9px 16px;border-top:1px solid var(--line)}
.scv-carte-h+.scv-rangee{border-top:0}
.scv-rien{padding:12px 16px;color:var(--ink-2);font-size:13px}
.scv-vide{display:flex;flex-direction:column;align-items:center;gap:8px;padding:44px 16px;text-align:center}
.scv-vide p{color:var(--ink-2);max-width:56ch}
/* À traiter : une seule liste (B11) */
.scv-dec{display:flex;align-items:flex-start;gap:10px;padding:10px 16px;border-top:1px solid var(--line)}
.scv-carte-h+.scv-dec{border-top:0}
.scv-dec>.scv-p{margin-top:7px}
.scv-dec-t{flex:1 1 320px;min-width:0;display:flex;flex-direction:column;gap:1px}
.scv-dec-t small{color:var(--ink-3);font-size:12.5px;line-height:1.4}
.scv-dec-t b,.scv-dec-n{font-weight:500;color:var(--ink);text-decoration:none}
.scv-dec-n:hover{text-decoration:underline}
.scv-dec-a{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.scv-dec-a form{display:contents}
.scv-dec-a .bv-btn{padding:4px 10px;font-size:13px}
.scv-dec-autre[open]{flex-basis:100%}
.scv-dec-plus{padding:8px 16px;border-top:1px solid var(--line)}
.scv-carte-h .scv-fin{margin-left:auto;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.scv-derniere{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}
.scv-derniere small{color:var(--ink-3)}
.scv-liens{display:flex;gap:16px;flex-wrap:wrap;font-size:13px}
@media (max-width:640px){.scv-dec{flex-wrap:wrap}.scv-dec-t{flex-basis:calc(100% - 30px)}.scv-dec-a{flex:1 1 100%;padding-left:20px}}
/* Le fil : ce qui se passe, ligne à ligne, et les trois relectures (B2) */
.scv-res{display:flex;gap:8px;align-items:flex-start;margin-top:6px;font-size:13.5px}
.scv-res>.scv-p{margin-top:5px}
.scv-compris{padding:6px 10px;background:var(--paper-2);border-radius:var(--r-sm);margin-bottom:6px}
.scv-trois{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px}
.scv-vote{padding:2px 8px;border:1px solid var(--line-2);border-radius:var(--r-sm);font-size:12px;background:var(--paper)}
/* Comment il décide */
.scv-decide{display:flex;flex-direction:column;gap:12px;margin-bottom:14px;color:var(--ink);font-size:14px}
.scv-decide h2{margin:0;font-size:20px;font-weight:600}
.scv-decide .scv-titre p{margin:2px 0 0}
.scv-cent{display:flex;gap:3px;border-radius:9px;overflow:hidden}
.scv-cent span{min-width:0;padding:7px 9px;display:flex;flex-direction:column;line-height:1.2;background:var(--paper-2)}
.scv-cent b{font-weight:600;font-size:15px}
.scv-cent small{font-size:12px;color:var(--ink-2);overflow:hidden;text-overflow:ellipsis}
.scv-cent span[data-stage=VOTE]{background:var(--line)}
.scv-cent span[data-stage=HUMAN]{background:var(--ink);color:var(--paper)}
.scv-cent span[data-stage=HUMAN] small{color:var(--paper);opacity:.8}
.scv-tuiles-d{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:10px}
.scv-tuile-d{display:flex;flex-direction:column;gap:2px}
.scv-tuile-d b{font-size:22px;font-weight:600;font-variant-numeric:tabular-nums}
.scv-tuile-d small{font-size:13px;color:var(--ink-2);line-height:1.35}
.scv-seg{display:inline-flex;padding:2px;border-radius:10px;background:var(--paper-2);gap:2px}
.scv-seg button{all:unset;cursor:pointer;padding:4px 10px;border-radius:8px;font-size:13px;font-weight:500;color:var(--ink-2);white-space:nowrap}
.scv-seg button.is-on{background:var(--card);color:var(--ink);box-shadow:0 0 0 1px var(--line)}
.scv-seg button:focus-visible{outline:2px solid var(--ink);outline-offset:1px}
.scv-repli{margin-top:12px;border:1px solid var(--line);border-radius:var(--r-md,10px);padding:10px 14px;background:var(--card);font-size:14px}
.scv-repli>summary{cursor:pointer;font-weight:500}
.scv-repli>summary>a{color:inherit;text-decoration:none}
.scv-repli>:not(summary){margin-top:10px}
.scv-zones{display:flex;height:26px;border-radius:7px;overflow:hidden;margin-top:6px;font-size:12px;font-weight:500}
.scv-zones span{display:grid;place-items:center;white-space:nowrap;overflow:hidden;background:var(--paper-2);color:var(--ink-2)}
.scv-zones span:nth-child(2){background:var(--line)}
.scv-zones span:nth-child(3){background:var(--ink);color:var(--paper)}
.scv-deux{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:10px;margin-top:12px;align-items:start}
.scv-deux h3{margin:0;font-size:15px;font-weight:600}
@media (max-width:640px){.scv-cent{flex-direction:column;gap:2px}.scv-cent span{flex:none!important;flex-direction:row-reverse;justify-content:space-between;align-items:baseline;padding:7px 10px}.scv-cent b{font-size:13.5px}}
/* Le voyant et ses trois signes (E8) */
.scv-voyant-c{padding:12px 16px;border-bottom:1px solid var(--line)}
.scv-voyant-h{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.scv-voyant-h>.scv-p{width:14px;height:14px}
.scv-voyant-h>.scv-txt{flex:1 1 220px;min-width:0}
.scv-voyant-h>.scv-txt b{font-size:15px;font-weight:600}
.scv-signes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:12px}
.scv-signe{display:flex;gap:8px;align-items:flex-start}
.scv-signe>.scv-p{margin-top:5px}
.scv-signe b{display:block;font-weight:500}
.scv-signe small{display:block;font-size:12.5px;line-height:1.35;color:var(--ink-3)}
@media (max-width:640px){.scv-signes{grid-template-columns:minmax(0,1fr)}}
.scv-chiffres{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:12px;padding:12px 16px}
.scv-chiffres div{display:flex;flex-direction:column}
.scv-chiffres b{font-size:18px;font-weight:600}
.scv-chiffres small{color:var(--ink-2);font-size:12px}
.scv-g3{grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}
.scv-mini{display:block;color:inherit;text-decoration:none}
.scv-mini:hover{background:var(--paper-2)}
.scv-mini-l{display:flex;flex-wrap:wrap;gap:4px 12px;margin-top:8px;font-size:13px}
.scv-mini-l span{display:inline-flex;align-items:center;gap:5px}
.scv-chips{display:flex;flex-wrap:wrap;gap:6px}
.scv-chip{display:inline-flex;align-items:center;min-height:30px;padding:0 12px;border:1px solid var(--line);border-radius:999px;background:var(--card);color:var(--ink);font-size:13px;text-decoration:none}
.scv-chip:hover{background:var(--paper-2)}
.scv-chip.is-on{border-color:var(--ink);box-shadow:inset 0 0 0 1px var(--ink)}
.scv-puce{display:inline-flex;align-items:center;gap:4px;padding:2px 8px;border:1px solid var(--line);border-radius:999px;color:var(--ink-2);font-size:12px;white-space:nowrap}
.scv-position{display:flex;flex-wrap:wrap;gap:4px 12px;color:var(--ink-2);font-size:13px}
.scv-position span{display:inline-flex;align-items:center;gap:5px}
.scv-position .is-ici{color:var(--ink);font-weight:600}
.scv-citation{margin:8px 0 0;padding:6px 12px;border-left:2px solid var(--line-2);font-size:15px}
.scv-res{display:flex;gap:8px;align-items:baseline;padding:3px 0;font-size:13px}
.scv-trois{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;align-items:start}
.scv-tb{width:100%;border-collapse:collapse;font-size:13px}
.scv-tb th{padding:9px 16px;text-align:left;color:var(--ink-2);font-weight:500;border-bottom:1px solid var(--line)}
.scv-tb td{padding:9px 16px;border-top:1px solid var(--line);vertical-align:top}
/* Le fil : six étapes sur une ligne, un élément qui avance. */
.scv-fil{display:flex;flex-direction:column;gap:14px}
.scv-fil .bv-carte p{margin-top:8px}
.scv-rail{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));grid-auto-rows:minmax(0,auto);gap:6px 14px;margin:0;padding:0;list-style:none}
.scv-rail li{align-self:center}
.scv-c1{grid-column:1;grid-row:1/3}.scv-c2{grid-column:2;grid-row:1/3}.scv-c3{grid-column:3}.scv-r1{grid-row:1}.scv-r2{grid-row:2}.scv-c4{grid-column:4}.scv-c5{grid-column:5;grid-row:1/3}
.scv-rail a{display:flex;flex-direction:column;gap:6px;padding:10px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--card);color:inherit;text-decoration:none;height:100%;box-sizing:border-box}
.scv-rail a:hover{background:var(--paper-2)}
.scv-rail-p{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:50%;background:var(--paper-2);color:var(--ink-2)}
.scv-rail-t{display:flex;flex-direction:column;gap:1px}
.scv-rail-t b{font-size:13px;font-weight:600}
.scv-rail-t small{color:var(--ink-2);font-size:12px}
.scv-rail .is-fait .scv-rail-p,.scv-rail .is-ici .scv-rail-p{background:var(--ink);color:var(--paper)}
.scv-rail .is-ici a,.scv-rail .is-attend a{border-color:var(--ink);box-shadow:inset 0 0 0 1px var(--ink)}
.scv-rail .is-attend .scv-rail-p{background:var(--signal);color:var(--ink)}
.scv-rail .is-non a{opacity:.45}
.scv-jamais{display:flex;flex-wrap:wrap;gap:6px 14px;align-items:center;padding:10px 14px;border:1px solid var(--line);border-radius:var(--r-sm);font-size:13px;color:var(--ink-2)}
.scv-jamais b{color:var(--ink);font-weight:600}
/* L'aide sur cet écran (V9) : un panneau, sans script. */
.scv-aide{position:relative;flex:none}
.scv-aide>summary{display:inline-flex;align-items:center;gap:6px;min-height:30px;padding:0 10px;color:var(--ink-2);font-size:13px;cursor:pointer;list-style:none;white-space:nowrap}
.scv-aide>summary::-webkit-details-marker{display:none}
.scv-aide>summary:hover{color:var(--ink)}
.scv-aide-p{position:absolute;right:0;top:calc(100% + 4px);z-index:30;width:min(340px,calc(100vw - 32px));padding:14px 16px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--card);box-shadow:var(--shadow-1);font-size:14px;color:var(--ink)}
.scv-aide-p h4{margin:10px 0 2px;color:var(--ink-2);font-size:12px;font-weight:500}
.scv-aide-p h4:first-child{margin-top:0}
.scv-aide-p p{margin:0}
.scv-aide-p a{display:inline-block;margin-top:10px;font-size:13px}
@media (max-width:767px){
  .scv-page{padding:14px 12px 72px}
  .scv-deux,.scv-deux-egal,.scv-trois{grid-template-columns:minmax(0,1fr)}
  .scv-tuiles{grid-template-columns:repeat(2,minmax(0,1fr))}
  .scv-rail{grid-template-columns:minmax(0,1fr)}
  .scv-rail a{flex-direction:row;align-items:center}
  .scv-tb thead{display:none}
  .scv-tb tr{display:block;padding:8px 16px;border-top:1px solid var(--line)}
  .scv-tb td{display:block;padding:2px 0;border:0}
  .scv-tb td::before{content:attr(data-l);display:block;color:var(--ink-2);font-size:12px}
}
.scv-phrase{margin:0;padding:8px 16px;color:var(--ink-2);font-size:13px}
.scv-phrase-t{margin:0;font-size:16px;max-width:72ch}
.scv-mot{display:inline-block;vertical-align:baseline;position:relative}
.scv-mot>summary{display:inline-block;cursor:help;list-style:none;border-bottom:1px dotted var(--ink-2)}
.scv-mot>summary::-webkit-details-marker{display:none}
.scv-mot-b{position:absolute;left:0;top:calc(100% + 4px);z-index:30;display:flex;flex-direction:column;gap:6px;width:min(320px,calc(100vw - 32px));padding:12px 14px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--card);box-shadow:var(--shadow-1);font-size:13px;font-weight:400}
.scv-mot-b small{color:var(--ink-2);font-size:12px}
.scv-pj{display:flex;align-items:center;gap:6px;color:var(--ink-2);font-size:13px}
.scv-echelle{display:flex;flex-direction:column;gap:4px;margin-top:8px}
.scv-ech{display:flex;flex-direction:column;padding:6px 10px;border:1px solid var(--line);border-radius:var(--r-sm)}
.scv-ech b{font-size:13px;font-weight:600}
.scv-ech small{color:var(--ink-2);font-size:12px}
.scv-ech.is-oui{border-color:var(--ink);box-shadow:inset 0 0 0 1px var(--ink)}
.scv-ech.is-rien{opacity:.55}
.scv-cinq{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px}
.scv-lien{color:inherit;text-decoration:none;border:1px solid var(--line);border-radius:var(--r-sm)}
.scv-lien:hover{background:var(--paper-2)}
@media (max-width:767px){
  .scv-c1,.scv-c2,.scv-c3,.scv-c4,.scv-c5,.scv-r1,.scv-r2{grid-column:1;grid-row:auto}
  .scv-cinq{grid-template-columns:minmax(0,1fr)}
}
.scv-rangee2{display:flex;flex-wrap:wrap;gap:6px;padding:8px 16px;border-bottom:1px solid var(--line)}
.scv-demande{display:flex;flex-direction:column;gap:6px}
.scv-demande label{font-size:13px;color:var(--ink-2)}
.scv-demande-l{display:flex;gap:8px;align-items:center;padding:6px 6px 6px 8px;background:var(--card);border-radius:12px;box-shadow:0 0 0 1px var(--line-2)}
.scv-demande-l:focus-within{box-shadow:0 0 0 1.5px var(--ink)}
.scv-demande-l input{all:unset;flex:1;min-width:0;font-size:15px;padding:4px 2px}
.scv-demande-i{width:26px;height:26px;border-radius:8px;display:inline-grid;place-items:center;background:var(--paper-2);color:var(--ink-2);flex:none}
.scv-bascule,input[type=checkbox][role=switch]{appearance:none;-webkit-appearance:none;margin:0;display:inline-block;cursor:pointer;width:32px;height:18px;border-radius:9px;background:var(--line-2);position:relative;flex:none;transition:background .2s}
.scv-bascule::after,input[type=checkbox][role=switch]::after{content:"";position:absolute;width:14px;height:14px;border-radius:50%;left:2px;top:2px;background:var(--card);transition:left .2s}
.scv-bascule:checked,input[type=checkbox][role=switch]:checked{background:var(--ink)}
.scv-bascule:checked::after,input[type=checkbox][role=switch]:checked::after{left:16px}
.scv-bascule:focus-visible,input[type=checkbox][role=switch]:focus-visible{outline:2px solid var(--ink);outline-offset:2px}
.scv-page .bv-champ,.scv-moyen .bv-champ{background:var(--card)}
.scv-choix{display:inline-flex;flex-wrap:wrap;gap:2px;padding:2px;border-radius:10px;background:var(--paper-2);width:fit-content}
.scv-choix label{cursor:pointer;padding:4px 10px;border-radius:8px;font-size:13px;color:var(--ink-2)}
.scv-choix input{position:absolute;opacity:0;width:0;height:0}
.scv-choix label:has(input:checked){background:var(--card);color:var(--ink);font-weight:500;box-shadow:0 0 0 1px var(--line)}
.scv-choix label:has(input:disabled){cursor:default;opacity:.65}
.scv-choix label:has(input:focus-visible){outline:2px solid var(--ink);outline-offset:1px}
.scv-nom{display:flex;gap:8px;align-items:center}
.scv-nom .bv-champ{flex:1;min-width:0}
.scv-nom-exemple{margin:4px 0 0;font-size:11.5px;color:var(--ink-3)}
.scv-nom-pied{padding:12px 14px}
.scv-nom-aide{padding:10px 14px 2px;font-size:12px;color:var(--ink-2)}
/* Le titre tombe au même endroit sur tous les écrans du module : le conteneur porte déjà la marge. */
.px-4>.scv-page{padding-inline:0}
.px-4>h1.mb-3.text-lg{margin-bottom:2px;font-size:20px;line-height:1.25}
.b-rules-page .bv-champ{background:var(--card)}
form[action*="scenario"] h3{margin:0;font-size:15px;font-weight:600}
[data-noms] td .bv-champ{width:100%;box-sizing:border-box}
label.scv-rangee{cursor:pointer}
.scv-seg{align-self:flex-start;width:fit-content}
.scv-tit-t{margin-top:4px;gap:12px;flex-wrap:wrap}
.scv-tit-t .scv-sous,.scv-tit-t .bv-note{margin:0}
.scv-chiffres-l{margin:-4px 0 0}
.scv-chiffres-l a{color:inherit;text-decoration:underline;text-underline-offset:2px}

/* « D'où ça vient » : le panneau commun (B9, D1), sans script. */
.scv-panneau{display:inline-block}
.scv-panneau>summary{list-style:none;cursor:pointer}
.scv-panneau>summary::-webkit-details-marker{display:none}
.scv-panneau-lien{color:var(--ink-2);text-decoration:underline;text-underline-offset:2px;font-size:13px}
.scv-panneau-tete{display:none}
.scv-panneau[open]>summary{position:fixed;inset:0;z-index:60;background:color-mix(in srgb,var(--ink) 18%,transparent)}
.scv-panneau[open] .scv-panneau-lien{display:none}
.scv-panneau[open] .scv-panneau-tete{display:flex;position:fixed;top:0;right:0;width:min(480px,100vw);height:48px;align-items:center;justify-content:space-between;padding:0 16px;background:var(--card);border-left:1px solid var(--line);border-bottom:1px solid var(--line)}
.scv-panneau-x{font-size:13px;text-decoration:underline;text-underline-offset:2px}
.scv-panneau-c{position:fixed;top:48px;right:0;bottom:0;width:min(480px,100vw);z-index:61;background:var(--card);border-left:1px solid var(--line)}
.scv-panneau-c iframe{width:100%;height:100%;border:0;display:block}
.scv-chaine-mini{display:flex;flex-wrap:wrap;gap:6px 12px;margin-bottom:12px;font-size:12px;color:var(--ink-3)}
.scv-chaine-mini span{display:inline-flex;align-items:center;gap:5px}
.scv-chaine-mini .is-ici{color:var(--ink);font-weight:600}
.scv-support{margin-top:6px;font-size:13px}
.scv-tech{font-size:12px;white-space:pre-wrap;margin:6px 0}
.scv-corr{display:flex;flex-direction:column;gap:12px;max-width:640px;margin-inline:auto;width:100%}
.scv-puces{display:flex;flex-wrap:wrap;gap:8px}
.scv-puce.is-on{background:var(--ink);color:var(--card)}
.scv-liste{margin:0;padding-left:18px;display:flex;flex-direction:column;gap:6px;font-size:14px}
.scv-seg{display:inline-flex;gap:2px;padding:2px;margin-bottom:14px;border:1px solid var(--line);border-radius:var(--r-sm);max-width:100%;overflow-x:auto}
.scv-seg a{padding:5px 12px;font-size:13px;color:var(--ink-2);text-decoration:none;border-radius:var(--r-sm);white-space:nowrap}
.scv-seg a.is-on{background:var(--paper-2);color:var(--ink);font-weight:600}
.scv-table{width:100%;border-collapse:collapse;font-size:13px}
.scv-table th{text-align:left;font-weight:500;color:var(--ink-3);padding:8px 12px;border-bottom:1px solid var(--line)}
.scv-table td{padding:9px 12px;border-bottom:1px solid var(--line);vertical-align:top;color:var(--ink-2)}
.scv-table td:first-child{color:var(--ink)}
.scv-trois{grid-template-columns:repeat(3,minmax(0,1fr))}
@media (max-width:760px){.scv-trois{grid-template-columns:1fr}.scv-table thead{display:none}.scv-table tr{display:block;padding:8px 0;border-bottom:1px solid var(--line)}.scv-table td{display:block;border:0;padding:3px 12px}.scv-table td::before{content:attr(data-l) " : ";color:var(--ink-3)}.scv-table td:first-child::before{content:none}}

.scv-barre{height:6px;border-radius:3px;background:var(--line,#e6e4df);overflow:hidden;margin:8px 0}
.scv-barre>i{display:block;height:100%;background:var(--ink,#1f1f1c)}
.ai-cited-chip.is-missing,sup a.is-missing{opacity:.55;text-decoration:line-through}
.scv-panneau-fiche{margin:8px 16px}
.scv-fiche-muet{display:flex;flex-wrap:wrap;align-items:baseline;gap:2px 10px;padding-block:8px}
.scv-fiche-muet h3{margin:0;font-size:13px}
.scv-fiche-muet p{margin:0}
.scv-demandes{margin-bottom:8px}
.scv-sur-fiche>.bv-carte{margin:8px 0}
/* Sur téléphone : le texte d'abord, ses gestes dessous ; une question proposée se lit en entier. */
@media (max-width:767px){
  .scv-rangee{flex-wrap:wrap}
  .scv-rangee>.scv-txt{flex:1 1 calc(100% - 30px);min-width:0}
  .scv-chip{white-space:normal;max-width:100%;padding-block:4px}
}
/* Formulaires des réglages (studio contexte, consignes) */
.scv-etiquette{display:block;font-weight:500;font-size:13px;margin-bottom:6px}
.scv-page textarea.bv-champ{min-height:110px;resize:vertical}
.scv-table-defile{overflow-x:auto}
.scv-seg-form{margin-top:10px}
/* Sous-barre du studio (.sous) : le choix actif est une pastille, pas un soulignement */
.sc-subbar{padding:7px 20px}
.sc-subbar .view-switch{display:flex;flex-wrap:wrap;gap:2px;margin:0;border:0;padding:0;background:none}
.sc-subbar .view-switch-item{padding:3px 9px;border:0;border-radius:7px;background:none;font-size:13px;font-weight:500;color:var(--ink-2);white-space:nowrap;text-decoration:none}
.sc-subbar .view-switch-item::after{display:none}
.sc-subbar .view-switch-item:hover{background:var(--paper-2);color:var(--ink)}
.sc-subbar .view-switch-item[aria-current="page"]{background:var(--card);color:var(--ink);box-shadow:0 0 0 1px var(--line),var(--shadow-1)}
.ia-support{margin-top:6px;border:0;padding:0;background:none;font-size:13px;color:var(--ink-3,inherit)}
.ia-support>summary{font-weight:400}
.scv-sous-titre{margin:0 0 12px;font-size:.8125rem;color:var(--ink-2)}
.b-rule-pile .b-rule:not(.is-off){box-shadow:none}
.scv-deux.scv-deux-egal{grid-template-columns:repeat(2,minmax(0,1fr))}
@media (max-width:760px){.scv-deux.scv-deux-egal{grid-template-columns:minmax(0,1fr)}}
.scv-titre h2{margin:0;font-size:20px;font-weight:600;line-height:1.25}
.scv-moyen-marge{padding:18px 20px 0}
.scv-lien-carte{display:flex;flex-direction:column;gap:2px;text-decoration:none;color:inherit}
.scv-lien-carte small{color:var(--ink-2);font-size:12px}
[data-deja-la]{margin-bottom:12px}

/* Comment ça marche : le fil dessiné, comme au studio. Vignettes à plat, traits derrière, fourche visible. */
.scv-seg{display:inline-flex;align-self:flex-start;gap:2px;padding:2px;border-radius:10px;background:var(--paper-2)}
.scv-seg .scv-chip{min-height:26px;padding:0 10px;border:0;border-radius:8px;background:none;color:var(--ink-2);box-shadow:none}
.scv-seg .scv-chip.is-on{background:var(--card);color:var(--ink);box-shadow:0 0 0 1px var(--line)}
.scv-rail-b{position:relative}
.scv-rail-l{display:none}
@media (min-width:761px){
  .scv-rail-l{display:block;position:absolute;inset:0;width:100%;height:100%;pointer-events:none;overflow:visible}
  .scv-rail-l path{fill:none;stroke:var(--line-2);stroke-width:2;vector-effect:non-scaling-stroke}
  .scv-rail-l path.is-on{stroke:var(--ink)}
  .scv-rail{position:relative;gap:8px 20px}
  .scv-rail a{flex-direction:row;align-items:center;gap:9px;padding:7px 10px}
  .scv-rail-p{flex:none;border-radius:8px}
}
.scv-rail .is-attend .scv-rail-p{border-radius:50%}
.scv-rail .is-non a{background:var(--card)}
.scv-reprendre h3{margin:0 0 8px;font-size:14px;font-weight:600}
/* Téléphone, tout le domaine (5/11) : les onglets gardent la place, rien ne sort de l'écran. */
@media (max-width:767px){
  .scv-aide-l{display:none}
  .scv-aide>summary{padding:0 6px}
}
@media (max-width:640px){
  .scv-puces{min-width:0;max-width:100%}
  .scv-puces .bv-inline{max-width:100%;min-width:0}
  .scv-puce{max-width:100%;white-space:normal;text-align:left;height:auto;padding-block:5px}
  .sc-src-wrap{overflow-x:visible}
  .sc-src,.sc-src tbody{display:block}
  .sc-src thead{display:none}
  .sc-src tr{display:flex;flex-wrap:wrap;align-items:center;gap:4px 12px;padding:8px 12px;border-top:1px solid var(--line)}
  .sc-src td{padding:0;border:0}
  .sc-src td:first-child{flex:1 1 100%}
  .sc-src td.n{display:none}
}
/* La recherche (47, studio h-recherche) */
.rch-page{display:flex;flex-direction:column;gap:12px;width:100%;max-width:760px;margin:0 auto;padding:28px 20px}
.rch-titre{font-size:20px;font-weight:600;margin:0}
.rch-champ{display:flex;align-items:center;gap:8px;position:relative}
.rch-champ input{flex:1;min-width:0;height:38px;padding:0 12px 0 34px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--card);color:inherit;font:inherit}
.rch-champ input:focus{outline:none;border-color:var(--ink-2)}
.rch-loupe{position:absolute;left:10px;top:50%;transform:translateY(-50%);color:var(--ink-2);display:flex}
.rch-note{color:var(--ink-2);font-size:13px;margin:0}
.rch-liste{list-style:none;margin:0}
.rch-ligne{display:flex;align-items:flex-start;gap:10px;padding:11px 16px;border-top:1px solid var(--line)}
.rch-ligne:first-child{border-top:0}
.rch-ic{flex:none;display:flex;margin-top:2px;color:var(--ink-2)}
.rch-lien{color:inherit;font-weight:500;text-decoration:none;overflow-wrap:anywhere}
.rch-lien:hover{text-decoration:underline}
.rch-passage{margin-top:2px}
.rch-page mark{background:color-mix(in srgb,var(--signal) 26%,transparent);color:inherit;border-radius:2px;padding:0 1px}
.rch-ouvrir{flex:none;padding:4px 10px;font-size:13px}
.rch-question{display:flex;align-items:center;gap:10px;color:inherit;text-decoration:none}
.rch-question:hover{background:var(--paper-2)}
.rch-vide{display:flex;flex-direction:column;align-items:center;gap:8px;padding:36px 16px;text-align:center}
.rch-vide p{color:var(--ink-2);max-width:56ch;margin:0}
.rch-gestes{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin-top:6px}
@media (max-width:640px){.rch-page{padding:16px}.rch-champ button{display:none}}
/* L'histoire d'un courriel (24, studio historique, un élément) */
.trc-etapes{list-style:none;margin:0;padding:0}
.trc-etapes .trc-etape{align-items:flex-start}
.trc-etapes .trc-etape:first-child{border-top:0}
.trc-etape>.scv-p{margin-top:5px}
.trc-etape .trc-step-meta{color:var(--ink-2);margin-top:2px}
.trc-histoire .trc-run{margin:0;padding:10px 16px 2px;font-size:13px;font-weight:500;color:var(--ink-2)}
.trc-support-etapes{margin-top:12px;color:var(--ink-2)}
.ai-sans-boite{margin:0 0 12px;padding:8px 12px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--paper-2);color:var(--ink-2);font-size:13px}
.dv-changer{display:inline-block;margin-left:8px;font-size:12px;font-weight:400;color:var(--ink-2);text-decoration:underline}
/* La fiche : le chat à portée, comme au studio (40, 41, 42) */
.scv-sur-fiche>.bv-carte{position:relative}
.scv-fiche-demander{float:right;margin-left:12px;font-size:13px;color:inherit;text-decoration:underline}
.scv-fiche-muet .scv-fiche-demander{float:none;order:3;margin-left:auto}
/* Documents à relire (32) : le motif seulement quand on met de côté */
.cc-doc-cote{position:relative}
.cc-doc-cote-s{cursor:pointer;list-style:none;font-size:13px;color:var(--ink-2);padding:4px 6px}
.cc-doc-cote-s::-webkit-details-marker{display:none}
.cc-doc-cote[open]{flex-basis:100%}
.cc-doc-acts{flex-wrap:wrap;justify-content:flex-end}
[data-scenario-preview] [data-rule-trial]{margin-top:8px}
.ai-cited-chip.is-missing{text-decoration:none;cursor:default}
.ai-cited-note{margin:4px 0 8px;color:var(--ink-2);font-size:13px}
.ai-feedback a.ai-control{display:inline-flex;width:auto;margin-top:4px}
.ai-ne-sait-pas{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:8px}
.ai-ne-sait-pas p{flex-basis:100%;margin:0;color:var(--ink-2);font-size:13px}

/* assets/b/tpl-affaire.css */
/* P9 — templates de page, famille « affaire » : le CSS de ses blocs.
   Classes tpl-affaire-* écrites à la main (Tailwind est figé). Jetons
   d'escouade-b.css seulement (--ink, --line, --card, --paper-2…).

   Les pièces intérieures gardent le dessin de l'affaire (aff-*,
   assets/b/affaire.css) et des automatisations (au-affaire-*,
   assets/b/auto.css) ; ici, seulement ce que le cadre d'un bloc
   (.tpl-bloc) change : plus de filet ni de marge propres, la largeur de
   la cellule de grille au lieu de celle de la page. */

/* « bandeau » (« affaire_bandeau » jusqu'au lot F) — le haut de fiche dans une cellule */
.tpl-affaire-band{display:flex;flex-direction:column;gap:10px;min-width:0}
.tpl-affaire-band .aff-band-id,.tpl-affaire-band .aff-band-parties{min-width:0}

/* « affaire_marges » — les chiffres prennent la largeur de la cellule */
.tpl-affaire-kpis{grid-template-columns:repeat(auto-fit,minmax(132px,1fr));max-width:none}

/* « affaire_point » — les cartes, sans la marge du point d'affaire codé */
.tpl-affaire-cartes{margin-bottom:0}

/* « automatisations » (« affaire_automatisations » jusqu'au lot F) — la section T-05, dans le cadre du bloc */
.tpl-affaire-auto-b{display:grid;gap:10px;font-size:13px}
.tpl-affaire-auto-b .au-link{justify-self:start;color:var(--ink-2);font-size:12px}
.tpl-affaire-auto-b .au-link:hover{color:var(--ink)}

@media (max-width:640px){
  .tpl-affaire-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}
}

/* assets/b/tpl-comptabilite.css */
/* P9, lot 6 — la famille « comptabilite » : les écrans de la Comptabilité
   devenus blocs de template (décision Q23 du 2026-10-02).
   Un bloc rend le marquage de l'écran d'avant dans une enveloppe
   .compta-page.tpl-compta : la portée .compta-page rend leurs règles aux
   classes .compta-* (assets/b/compta.css), et les règles ci-dessous la
   ramènent à la taille d'une cellule — la page d'avant occupait l'écran
   (hauteur 100 %, défilement propre, fond de page). Le rythme vertical et la
   chasse tabulaire sont ceux de .compta-content, que la cellule n'a pas.
   Classes écrites à la main (Tailwind est figé), jetons d'escouade-b.css. */
.tpl-compta.compta-page{display:grid;flex:none;gap:16px;align-content:start;height:auto;min-height:0;overflow:visible;background:transparent;font-size:13px;font-variant-numeric:tabular-nums}
.tpl-compta.compta-page>*{min-width:0;margin-top:0;margin-bottom:0}
.tpl-compta.compta-page .compta-desk{display:grid;gap:16px;min-width:0}
.tpl-compta.compta-page .compta-desk>*{min-width:0;margin-top:0;margin-bottom:0}
/* Le lien de la correspondance, à droite de sa rangée. */
.tpl-compta-reglages.compta-page{display:flex;justify-content:flex-end;align-items:center}
/* COMPTA-10 : au téléphone, un bloc « bureau seulement » efface sa cellule
   entière — la vue téléphone est « quatre chiffres, puis les retards ». */
@media (max-width:640px){
  .tpl-cell:has(>.tpl-compta--desk){display:none}
  .tpl-compta.compta-page .compta-desk{display:none}
}

/* assets/b/tpl-constructeur.css */
/* ==========================================================================
   Le CONSTRUCTEUR DE PAGES EN PLACE (Q28, lot A) — la barre d'édition, les
   outils d'une carte, son tiroir. Classes ÉCRITES À LA MAIN, préfixe cp- :
   Tailwind est figé. Gabarits : crates/web/src/templates/constructeur.rs.
   ========================================================================== */

/* Le conteneur qui défile garde ce qui s'y positionne. */
.tpl-scroll:has(.cp-barre){position:relative}

/* ---- La barre, sous l'en-tête ------------------------------------------- */
.cp-barre{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px 16px;margin:0 0 14px;padding:10px 12px;border:1px solid var(--line-2);border-radius:10px;background:var(--paper-2);font-size:13px}
.cp-barre-l{display:flex;align-items:center;gap:10px;min-width:0}
.cp-barre-l strong{font-weight:600;color:var(--ink)}
.cp-etat{color:var(--ink-2)}
.cp-pastille{display:inline-flex;align-items:center;height:20px;padding:0 8px;border-radius:999px;background:var(--signal-soft);color:var(--signal-text);font-size:12px;font-weight:500}
.cp-barre-palette{display:flex;flex-wrap:wrap;align-items:flex-end;gap:8px}
.cp-barre-r{display:flex;align-items:center;gap:8px}
.cp-lbl{display:flex;flex-direction:column;gap:2px;font-size:11px;color:var(--ink-3)}
.cp-lbl select{height:28px;max-width:240px;padding:0 6px;border:1px solid var(--line-2);border-radius:6px;background:var(--card);color:var(--ink);font-size:13px}
.cp-btn-texte{display:inline-flex;align-items:center;gap:6px;height:28px;padding:0 10px;border:1px solid var(--line-2);border-radius:6px;background:var(--card);color:var(--ink);font:500 13px/1 var(--font);text-decoration:none;white-space:nowrap;cursor:pointer}
.cp-btn-texte:hover{background:var(--paper)}
.cp-btn-texte.is-primaire{border-color:var(--btn-bg);background:var(--btn-bg);color:var(--btn-ink)}
.cp-btn-texte.is-primaire:hover{opacity:.9}
.cp-btn{display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;padding:0;border:0;border-radius:5px;background:transparent;color:var(--ink-2);cursor:pointer}
.cp-btn:hover{background:var(--paper-2);color:var(--ink)}
.cp-btn:focus-visible,.cp-btn-texte:focus-visible{outline:2px solid var(--focus);outline-offset:2px}
.cp-refus{margin:0 0 14px;padding:10px 12px;border:1px solid var(--danger);border-radius:10px;background:var(--danger-soft);color:var(--ink);font-size:13px}
.cp-refus strong{color:var(--danger)}
.cp-refus ul{margin:6px 0 0;padding-left:18px}
.cp-refus code,.cp-erreurs code{font-size:11px;color:var(--ink-3)}

/* ---- Une carte en édition ----------------------------------------------- */
.cp-carte{position:relative;border:1px dashed var(--line-2);border-radius:12px;padding:4px;background:var(--paper)}
.cp-carte.is-ouverte{border:2px solid var(--ink)}
.cp-carte.is-refusee{border-color:var(--danger)}
.cp-outils{display:flex;flex-wrap:wrap;align-items:center;gap:2px;padding:2px 4px 6px}
.cp-nom{flex:1;min-width:80px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:12px;font-weight:600;color:var(--ink-2)}
.cp-w{min-width:34px;text-align:center;font-size:11px;font-variant-numeric:tabular-nums;color:var(--ink-3)}
/* L'aperçu est inerte : un lien ferait quitter le brouillon. Les outils des
   cartes imbriquées et les onglets (des boutons du constructeur) restent
   actifs. */
.cp-apercu{pointer-events:none}
.cp-apercu .cp-carte,.cp-apercu .cp-outils,.cp-apercu .cp-onglet{pointer-events:auto}
.cp-absente{color:var(--danger);font-size:13px}
.cp-absente p{margin:0}
.cp-vide{margin:0;padding:24px;border:1px dashed var(--line-2);border-radius:10px;color:var(--ink-3);text-align:center}
.tpl-tab.cp-onglet{border:0;border-bottom:2px solid transparent;background:none;font:inherit;font-size:13px;font-weight:500;cursor:pointer}
.tpl-tab.cp-onglet[aria-current=page]{border-bottom-color:var(--ink)}

/* ---- Le tiroir ---------------------------------------------------------- */
.cp-tiroir{position:fixed;top:0;right:0;bottom:0;z-index:60;display:flex;flex-direction:column;width:min(420px,100vw);border-left:1px solid var(--line-2);background:var(--card);box-shadow:-12px 0 32px rgba(12,13,15,.10);font-size:13px;color:var(--ink)}
.cp-tiroir-h{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;padding:14px 16px;border-bottom:1px solid var(--line)}
.cp-tiroir-h div{display:flex;flex-direction:column;gap:2px;min-width:0}
.cp-tiroir-h strong{font-size:14px;font-weight:600}
.cp-tiroir-h code{font-size:11px;color:var(--ink-3)}
.cp-tiroir-corps{flex:1;min-height:0;overflow:auto;display:flex;flex-direction:column;gap:12px;padding:14px 16px}
.cp-tiroir-pied{display:flex;justify-content:flex-end;gap:8px;padding:12px 16px;border-top:1px solid var(--line)}
.cp-aide{margin:0;color:var(--ink-3);font-size:12px;line-height:1.45}
.cp-erreurs{margin:0;padding:8px 10px 8px 26px;border:1px solid var(--danger);border-radius:8px;background:var(--danger-soft);font-size:12px}
.cp-champ{display:flex;flex-direction:column;gap:4px}
.cp-champ-l{font-size:12px;font-weight:500;color:var(--ink-2)}
.cp-champ input[type=text],.cp-champ input[type=number],.cp-champ select,.cp-champ textarea{width:100%;min-height:30px;padding:4px 8px;border:1px solid var(--line-2);border-radius:6px;background:var(--card);color:var(--ink);font:400 13px/1.4 var(--font)}
.cp-champ textarea{resize:vertical}
.cp-champ--court{flex:1;min-width:0}
.cp-champ--case label{display:flex;align-items:center;gap:8px;font-weight:500}
.cp-couleur{display:flex;align-items:center;gap:8px}
.cp-nuance{flex:none;width:22px;height:22px;border:1px solid var(--line-2);border-radius:5px;background:var(--paper-2)}
.cp-json{font-family:ui-monospace,SFMono-Regular,Menlo,monospace!important;font-size:12px!important}
.cp-liste{display:flex;flex-direction:column;gap:10px;margin:0;padding:10px;border:1px solid var(--line);border-radius:8px}
.cp-liste legend{padding:0 4px;font-size:12px;font-weight:600;color:var(--ink-2)}
.cp-element{display:flex;flex-direction:column;gap:8px;padding:8px;border-radius:6px;background:var(--paper)}
.cp-element-h{display:flex;align-items:center;gap:2px}
.cp-element-h span{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:12px;font-weight:600}
.cp-place{display:flex;gap:8px;margin:0;padding:10px;border:1px solid var(--line);border-radius:8px}
.cp-place legend{padding:0 4px;font-size:12px;font-weight:600;color:var(--ink-2)}

/* ---- Le panneau des ACCÈS d'une page (Q28, lot D) ------------------------
   Le même tiroir, plus large : qui voit la page, puis l'aperçu carte par
   carte. Les conteneurs qui défilent sont relatifs (la case lue par un
   lecteur d'écran, .da-sr, s'y positionne). */
.cp-acces{width:min(560px,100vw)}
.cp-acces .cp-tiroir-corps{position:relative}
.cp-acces-modes{display:flex;flex-direction:column;gap:6px;margin:0;padding:0;border:0}
.cp-acces-modes legend{margin-bottom:4px}
.cp-acces .da-checks{position:relative}
.cp-acces-apercu{position:relative}

@media (max-width:767px){
.cp-barre{flex-direction:column;align-items:stretch}
.cp-barre-palette,.cp-barre-r{justify-content:flex-start}
.cp-lbl select{max-width:none}
.cp-tiroir{width:100vw;border-left:0}
}

/* HUB-VUES : les cartes propres à une vue, au-dessus d'elle. */
.tpl-vue-cartes { margin: 0 0 12px; }
/* Le reglage de la vue dans le constructeur (HUB-VUES) */
.cp-vue{width:min(500px,100vw)}
.cp-vue-section{display:flex;flex-direction:column;gap:8px;margin:0;padding:10px;border:1px solid var(--line);border-radius:8px;min-width:0}
.cp-vue-section legend{padding:0 4px;font-size:12px;font-weight:600;color:var(--ink-2)}
.cp-vue-ligne{display:flex;align-items:center;gap:4px;min-height:30px;padding:2px 4px;border-radius:6px;background:var(--paper)}
.cp-vue-ligne>span{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cp-vue-ligne input[type=number]{width:76px;min-height:26px;padding:2px 6px;border:1px solid var(--line-2);border-radius:6px;background:var(--card);color:var(--ink);font:400 12px/1.4 var(--font)}
.cp-vue-muet{color:var(--ink-3);background:transparent}
.cp-vue-ajout{display:flex;flex-wrap:wrap;align-items:flex-end;gap:6px}
.cp-vue-ajout .cp-champ--court{min-width:120px}
.cp-vue-case{display:flex;align-items:center;gap:8px;font-weight:500}
.cp-vue-refus{display:inline-flex;align-items:center;height:18px;padding:0 6px;border-radius:999px;background:var(--danger-soft);color:var(--danger);font-size:11px}
.cp-btn:disabled,.cp-btn-texte:disabled{opacity:.45;cursor:not-allowed}

/* assets/b/tpl-donnees.css */
/* P9 — templates de page, famille « donnees » : le CSS de ses blocs.
   Classes tpl-donnees-* écrites à la main (Tailwind est figé). Jetons
   d'escouade-b.css seulement (--ink, --line, --card, --paper-2…).

   Les corps des notes, tâches, fichiers, mails, calendrier et factures sont
   les composants des onglets de la fiche : leurs classes existent déjà.
   Seule la chronologie a ici sa barre de filtres, ses encarts et ses états
   vides. Le masquage d'un type du contexte reste celui de la fiche
   (.fl-tl:has(input[data-kind=…]:not(:checked)), assets/app.css). */

.tpl-donnees-tl{display:flex;flex-direction:column;gap:14px;min-width:0}

.tpl-donnees-surtitre{display:flex;align-items:center;gap:6px;margin-bottom:6px;color:var(--ink-3);font:500 11px/1.3 var(--font);letter-spacing:.04em;text-transform:uppercase}
.tpl-donnees-synthese{padding:10px 12px;border:1px solid var(--line-2);border-radius:8px;background:var(--paper-2)}
.tpl-donnees-synthese p{margin:0;color:var(--ink);font-size:13px;line-height:1.55}
.tpl-donnees-avenir{padding:10px 12px;border:1px solid var(--line);border-radius:8px;background:var(--paper)}
.tpl-donnees-avenir ul{display:flex;flex-direction:column;gap:4px;margin:0;padding:0;list-style:none}
.tpl-donnees-avenir li{display:flex;align-items:baseline;gap:8px;min-width:0;color:var(--ink);font-size:12px}
.tpl-donnees-avenir-d{flex:none;color:var(--ink-2);font-weight:500}

.tpl-donnees-filtres{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px}
.tpl-donnees-puces{display:flex;flex-wrap:wrap;align-items:center;gap:6px}
.tpl-donnees-puce{display:inline-flex;align-items:center;gap:6px;height:24px;padding:0 10px;border:1px solid var(--line-2);border-radius:999px;background:var(--paper-2);color:var(--ink);font-size:12px;font-weight:500;text-decoration:none;cursor:pointer;white-space:nowrap}
.tpl-donnees-puce:hover{background:var(--card)}
.tpl-donnees-puce[data-masque]{border-color:var(--line);background:var(--card);color:var(--ink-3)}
.tpl-donnees-puce[data-masque] .tpl-donnees-dot{opacity:.4}
.tpl-donnees-dot{flex:none;width:8px;height:8px}
.tpl-donnees-dates{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.tpl-donnees-dates label{display:inline-flex;align-items:center;gap:6px;color:var(--ink-3);font-size:12px}
.tpl-donnees-dates input{height:28px;padding:0 6px;border:1px solid var(--line-2);border-radius:6px;background:var(--card);color:var(--ink);font:12px var(--font)}
.tpl-donnees-dates input:focus{outline:none;box-shadow:var(--ring-ink)}

.tpl-donnees-btn{display:inline-flex;align-items:center;gap:6px;height:28px;padding:0 10px;border:1px solid var(--line-2);border-radius:6px;background:var(--card);color:var(--ink);font:500 12px var(--font);text-decoration:none;cursor:pointer;white-space:nowrap}
.tpl-donnees-btn:hover{background:var(--paper-2)}
.tpl-donnees-lien{display:inline-flex;align-items:center;gap:4px;height:24px;padding:0 6px;border-radius:6px;color:var(--ink-2);font-size:12px;font-weight:500;text-decoration:none}
.tpl-donnees-lien:hover{background:var(--paper-2);color:var(--ink)}

.tpl-donnees-vide{display:flex;flex-direction:column;align-items:center;gap:8px;padding:24px 12px;color:var(--ink-3);font-size:13px;text-align:center}
.tpl-donnees-vide-t{color:var(--ink);font-weight:600}
.tpl-donnees-suite{display:flex;justify-content:center}

/* Notes et tâches : leur composant porte son en-tête (le h3 « Notes » ou
   « Tâches », et « Ajouter »). Un titre de template le remplace : le h2 du
   bloc dit le titre, le h3 s'efface, « Ajouter » reste — un titre, pas deux.
   La structure suivie est celle de notes_card / tasks_card
   (section > header > h3, web record_activity.rs). Sans « Ajouter »
   ("create": false, ou sans le droit), l'en-tête vidé s'efface aussi. */
.tpl-donnees-titre>section>header{justify-content:flex-end}
.tpl-donnees-titre>section>header>h3{display:none}
.tpl-donnees-titre>section>header:not(:has(>details)){display:none}

@media (max-width:767px){
.tpl-donnees-filtres{flex-direction:column;align-items:stretch}
.tpl-donnees-dates{justify-content:flex-start}
}

/* assets/b/tpl-fiches.css */
/* P9 — templates de page, famille « fiches » : le CSS de ses blocs.
   Classes tpl-fiches-* écrites à la main (Tailwind est figé). Jetons
   d'escouade-b.css seulement (--ink, --line, --card, --paper-2…).

   Les panneaux que ces blocs réutilisent (bandeau d'entreprise, bloc
   Prescriptio, « En bref », visionneuse, lecture d'un document, versions,
   carte des liens, éditeur) gardent leurs propres classes, déjà dans la
   feuille ; posés DANS le cadre d'un bloc (.tpl-bloc), ils perdent ici
   leur bordure, leur fond ou leur marge d'origine : le cadre les porte. */

/* synthese_entreprise */
.tpl-fiches-entreprise .b-co{padding:0;border-bottom:0;background:none}
.tpl-fiches-entreprise .b-co-notice{margin:0 0 10px}

/* prescriptio */
.tpl-fiches-prescriptio .pxo-block{margin-top:0}

/* en_bref */
.tpl-fiches-bref .b-cbrief{margin-top:0}

/* visionneuse */
.tpl-fiches-visionneuse .viewer{margin:0}
.tpl-fiches-visionneuse .dv-page-piece{margin:0}

/* lecture_document */
.tpl-fiches-lecture{display:flex;flex-direction:column;gap:12px}
.tpl-fiches-lecture .tpl-bloc-t{margin:0}
.tpl-fiches-lecture .dv-read{box-shadow:none}

/* versions_document : la section d'origine ouvre sur un filet, inutile
   sous le titre du cadre. */
.tpl-fiches-versions>section{border-top:0;padding-top:0}

/* resume_ia */
.tpl-fiches-resume-t{display:flex;align-items:center;gap:6px;margin:0 0 6px;color:var(--ink-2);font:600 11px/1.3 var(--font);letter-spacing:.04em;text-transform:uppercase}
.tpl-fiches-resume-t svg{flex:none;color:var(--ink-3)}
.tpl-fiches-resume-p{margin:0;color:var(--ink);font-size:13px;line-height:1.55;white-space:pre-line}

/* graphe_liens */
.tpl-fiches-liens .kg-links{gap:10px}

/* corps_activite : l'éditeur toujours ouvert, sans bordure. */
.tpl-fiches-corps-ed{min-height:120px;margin:0 -4px}
/* Une cellule sans contenu (Prescriptio pas branché) ne laisse ni carte vide ni trou : sa voisine prend la place. */
.tpl-cell:empty{display:none}
@media (min-width:768px){.tpl-cell[data-bloc="prescriptio"]:empty+.tpl-cell{grid-column:6 / span 7 !important}}

/* assets/b/tpl-generiques_a.css */
/* P9 — templates de page, famille « generiques_a » : le CSS de ses blocs.
   Classes tpl-generiques_a-* écrites à la main (Tailwind est figé). Jetons
   d'escouade-b.css seulement (--ink, --line, --card, --paper-2…).

   La grammaire est celle de l'affaire (assets/b/affaire.css) : le signal ne
   marque que ce qui BOUGE (l'étape courante), un retard ou une alerte
   critique est au rouge du texte (--danger), jamais au vert ; les carrés sont
   la matière (étapes faites), le rond est ce qui bouge. */

/* ---- « indicateurs » : des tuiles ------------------------------------------ */
.tpl-generiques_a-tuiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:8px;margin:0;padding:0;list-style:none}
.tpl-generiques_a-tuile{display:flex;flex-direction:column;gap:2px;min-width:0;padding:8px 10px;border-radius:var(--r-sm);box-shadow:inset 0 0 0 1px var(--line);background:var(--card)}
.tpl-generiques_a-tuile-k{display:flex;align-items:center;gap:6px;min-width:0;color:var(--ink-3);font-size:11.5px}
.tpl-generiques_a-tuile-k svg{flex:none}
.tpl-generiques_a-tuile-k span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tpl-generiques_a-tuile-v{min-width:0;color:var(--ink);font:600 16px/1.25 var(--font);letter-spacing:-.01em;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.tpl-generiques_a-tuile-s{color:var(--ink-3);font-size:11.5px;font-variant-numeric:tabular-nums}

/* ---- « etapes » : le parcours ---------------------------------------------- */
.tpl-generiques_a-parcours{display:flex;margin:0;padding:4px 0 2px;overflow-x:auto;list-style:none;scrollbar-width:thin}
.tpl-generiques_a-etape{position:relative;display:flex;flex:1 0 96px;flex-direction:column;align-items:center;gap:3px;min-width:96px;padding:0 4px;text-align:center}
.tpl-generiques_a-etape::before{content:"";position:absolute;top:5px;right:50%;left:-50%;height:2px;background:var(--line-2)}
.tpl-generiques_a-etape:first-child::before{display:none}
.tpl-generiques_a-etape.is-done::before,.tpl-generiques_a-etape.is-current::before{background:var(--ink-2)}
.tpl-generiques_a-etape-m{position:relative;z-index:1;width:12px;height:12px;border-radius:var(--r-round);background:var(--card);box-shadow:inset 0 0 0 1.5px var(--line-2)}
.tpl-generiques_a-etape.is-done .tpl-generiques_a-etape-m{border-radius:var(--r-mark);background:var(--ink-2);box-shadow:none}
.tpl-generiques_a-etape.is-current .tpl-generiques_a-etape-m{background:var(--signal);box-shadow:var(--ring-signal)}
.tpl-generiques_a-etape.is-late .tpl-generiques_a-etape-m{box-shadow:inset 0 0 0 2px var(--danger)}
.tpl-generiques_a-etape-l{color:var(--ink-2);font-size:12px;font-weight:500;line-height:1.25}
.tpl-generiques_a-etape.is-done .tpl-generiques_a-etape-l,.tpl-generiques_a-etape.is-current .tpl-generiques_a-etape-l{color:var(--ink)}
.tpl-generiques_a-etape.is-late .tpl-generiques_a-etape-l{color:var(--danger)}
.tpl-generiques_a-etape-d{color:var(--ink-3);font-size:11.5px;font-variant-numeric:tabular-nums}
.tpl-generiques_a-etape-r{color:var(--danger);font-size:11px;font-variant-numeric:tabular-nums}
.tpl-generiques_a-hors{margin:8px 0 0;color:var(--ink-2);font-size:12px}

/* ---- « alertes » ------------------------------------------------------------ */
.tpl-generiques_a-liste{display:flex;flex-direction:column;gap:6px;margin:0;padding:0;list-style:none}
.tpl-generiques_a-alerte{display:flex;align-items:flex-start;gap:8px;font-size:13px;line-height:1.4}
.tpl-generiques_a-alerte svg{flex:none;margin-top:1px;color:var(--ink-3)}
.tpl-generiques_a-alerte.is-warning svg{color:var(--ink)}
.tpl-generiques_a-alerte.is-critical svg{color:var(--danger)}
.tpl-generiques_a-alerte-x{flex:1;min-width:0;color:var(--ink);overflow-wrap:anywhere}
.tpl-generiques_a-alerte.is-critical .tpl-generiques_a-alerte-x{color:var(--danger);font-weight:500}
.tpl-generiques_a-alerte.is-info .tpl-generiques_a-alerte-x{color:var(--ink-2)}

/* assets/b/tpl-generiques_b.css */
/* P9 — templates de page, famille « generiques_b » : le CSS de ses blocs.
   Classes tpl-generiques_b-* écrites à la main (Tailwind est figé). Jetons
   d'escouade-b.css seulement (--ink, --line, --card, --paper-2…).
   Gabarits : crates/web/src/templates/generiques_b.rs. Le bloc
   « atelier » reprend en plus les classes .prod-* d'assets/app.css. */

/* ---- communs : un compte, un lien, « +N » ------------------------------- */
.tpl-generiques_b-count{display:inline-flex;align-items:center;justify-content:center;min-width:20px;height:18px;padding:0 6px;border-radius:9px;background:var(--paper-2);color:var(--ink-2);font:500 11.5px/1 var(--font);font-variant-numeric:tabular-nums}
.tpl-generiques_b-link{display:inline-flex;align-items:center;gap:4px;color:var(--ink-2);font-size:12px;text-decoration:none}
.tpl-generiques_b-link:hover{color:var(--ink);text-decoration:underline;text-underline-offset:3px}
.tpl-generiques_b-link svg{flex:none;color:var(--ink-3)}
.tpl-generiques_b-more{margin:6px 0 0;color:var(--ink-3);font-size:12px;font-variant-numeric:tabular-nums}
.tpl-generiques_b-more a{color:var(--ink-2);text-decoration:none}
.tpl-generiques_b-more a:hover{color:var(--ink);text-decoration:underline;text-underline-offset:3px}

/* ---- documents_classe : des groupes, des cartes ------------------------- */
.tpl-generiques_b-groups{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:14px}
.tpl-generiques_b-group{min-width:0}
.tpl-generiques_b-group-t{display:flex;align-items:center;gap:6px;margin:0 0 8px;color:var(--ink-2);font:600 12px/1.3 var(--font)}
.tpl-generiques_b-group-t svg{flex:none;color:var(--ink-3)}
.tpl-generiques_b-group-t span:first-of-type{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tpl-generiques_b-cards{display:flex;flex-direction:column;gap:6px;margin:0;padding:0;list-style:none}
.tpl-generiques_b-card{display:flex;align-items:flex-start;gap:8px;min-width:0;padding:7px 9px;border:1px solid var(--line);border-radius:8px;background:var(--card)}
.tpl-generiques_b-card:hover{border-color:var(--line-2)}
.tpl-generiques_b-card--old{background:var(--paper-2)}
.tpl-generiques_b-card--old .tpl-generiques_b-card-t{color:var(--ink-3);text-decoration:line-through}
.tpl-generiques_b-ext{flex:none;min-width:34px;padding:2px 4px;border-radius:4px;background:var(--paper-2);color:var(--ink-2);font:600 10px/1.4 var(--font);letter-spacing:.02em;text-align:center}
.tpl-generiques_b-card-body{display:flex;flex-direction:column;gap:2px;min-width:0}
.tpl-generiques_b-card-t{overflow:hidden;color:var(--ink);font-size:13px;text-decoration:none;text-overflow:ellipsis;white-space:nowrap}
a.tpl-generiques_b-card-t:hover{text-decoration:underline;text-underline-offset:3px}
.tpl-generiques_b-card-meta{display:flex;flex-wrap:wrap;gap:4px 8px;color:var(--ink-3);font-size:11.5px}
.tpl-generiques_b-old{color:var(--ink-2);font-weight:500}
.tpl-generiques_b-cur{color:var(--ink-2)}

/* ---- liste_liee : un tableau court -------------------------------------- */
.tpl-generiques_b-bar{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:0 0 8px}
.tpl-generiques_b-scroll{overflow-x:auto;margin:0 -4px}
.tpl-generiques_b-table{width:100%;border-collapse:collapse;font-size:13px}
.tpl-generiques_b-table th,.tpl-generiques_b-table td{padding:7px 8px;border-bottom:1px solid var(--line);text-align:left;vertical-align:middle;white-space:nowrap}
.tpl-generiques_b-table thead th{color:var(--ink-3);font:500 11.5px/1.3 var(--font)}
.tpl-generiques_b-table tbody th{max-width:280px;overflow:hidden;font-weight:500;text-overflow:ellipsis}
.tpl-generiques_b-table tbody th a{color:var(--ink);text-decoration:none}
.tpl-generiques_b-table tbody th a:hover{text-decoration:underline;text-underline-offset:3px}
.tpl-generiques_b-table tbody tr:last-child th,.tpl-generiques_b-table tbody tr:last-child td{border-bottom:0}
.tpl-generiques_b-table td{color:var(--ink-2)}

/* ---- actions : un bouton = un formulaire --------------------------------- */
.tpl-generiques_b-acts{display:flex;flex-direction:column;gap:8px}
.tpl-generiques_b-act{display:flex;flex-wrap:wrap;align-items:center;gap:6px 12px;min-width:0}
.tpl-generiques_b-form{margin:0}
/* L'aperçu relu avant le geste (l'écriture proposée) prend toute la ligne. */
.tpl-generiques_b-apercu{flex:1 1 100%;min-width:0;overflow-x:auto}
.tpl-generiques_b-apercu .b-entry{border-top:0;padding-top:0}
.tpl-generiques_b-apercu form{margin:8px 0 0}
.tpl-generiques_b-btn{display:inline-flex;align-items:center;height:30px;padding:0 12px;border:1px solid var(--line-2);border-radius:6px;background:var(--card);color:var(--ink);font:500 13px/1 var(--font);cursor:pointer;white-space:nowrap;text-decoration:none}
.tpl-generiques_b-btn:hover{background:var(--paper-2)}
.tpl-generiques_b-btn:focus-visible{outline:none;box-shadow:var(--ring-ink)}
.tpl-generiques_b-done{display:inline-flex;align-items:center;gap:6px;height:30px;padding:0 10px;border-radius:6px;background:var(--paper-2);color:var(--ink-2);font:500 13px/1 var(--font)}
.tpl-generiques_b-done svg{flex:none;color:var(--ink-3)}
.tpl-generiques_b-note{display:inline-flex;flex-wrap:wrap;align-items:baseline;gap:4px 10px;min-width:0;color:var(--ink-3);font-size:12px}
.tpl-generiques_b-note a{color:var(--ink);font-weight:500;text-decoration:none}
.tpl-generiques_b-note a:hover{text-decoration:underline;text-underline-offset:3px}

/* ---- atelier : les classes .prod-* d'app.css, posées dans un bloc ------- */
.tpl-generiques_b-atelier{display:flex;flex-direction:column;gap:12px}
.tpl-generiques_b-atelier .prod-alert{margin:0}
.tpl-generiques_b-rail{margin:0}
.tpl-generiques_b-facts{margin:0}
.tpl-generiques_b-trucks{display:flex;flex-direction:column;gap:6px;min-width:0}

@media (max-width:767px){
.tpl-generiques_b-groups{grid-template-columns:minmax(0,1fr)}
.tpl-generiques_b-table tbody th{max-width:180px}
}
.tpl-generiques_b-card>.vw-inline{display:block;flex:none;width:40px;height:40px}.tpl-generiques_b-card>.vw-inline>.vw-piece-open{display:block}

/* assets/b/tpl-listes.css */
/* ==========================================================================
   P9, lots 5 et 7 — les PAGES DE LISTE composées (index d'un objet, Planning,
   Production) et la famille de blocs « listes ». Classes ÉCRITES À LA MAIN :
   Tailwind est figé. Gabarits : crates/web/src/templates/listes.rs.
   ========================================================================== */

/* L'index d'un objet prend toute la largeur, comme l'index hérité. */
.tpl-liste .tpl-content{width:100%;padding:16px 20px 32px}
.tpl-liste .tpl-grid{gap:14px}

/* « vue » : la barre de vues et la table (ou le kanban, ou le calendrier)
   dans un cadre ; la table et le kanban gardent leur défilement propre — et
   leur en-tête de colonnes collant — sur la hauteur de l'écran. */
.tpl-vue{display:flex;flex-direction:column;min-width:0;border:1px solid var(--line);border-radius:10px;background:var(--card);overflow:hidden}
.tpl-vue .b-grid{max-height:calc(100vh - 190px);max-height:calc(100dvh - 190px);min-height:240px}
.tpl-vue .b-kan{height:calc(100vh - 210px);height:calc(100dvh - 210px);min-height:320px}

/* « planning » : l'écran du planning garde ses règles (.plan-page …), sans
   la mise en page pleine hauteur de l'ancienne page. */
.tpl-planning.plan-page{display:block;flex:none;height:auto;min-height:0;min-width:0;overflow:visible}

/* « tableaux_de_bord » et « tableaux_acces » (2026-10-14) : la liste des
   tableaux de bord et la matrice des accès gardent leurs règles (.dl-*,
   .da-*, assets/app.css), sans la marge de leur ancienne page — la grille
   de l'index porte la sienne. Le choix cartes / table et les rapports
   s'alignent à droite, sous l'en-tête unique. */
.tpl-tableaux.dl-page,.tpl-tableaux.da-page{padding:0}
.tpl-tableaux>.dl-actions{justify-content:flex-end}

@media (max-width:767px){
.tpl-liste .tpl-content{padding:12px 8px 24px}
.tpl-vue .b-grid{max-height:calc(100dvh - 150px)}
.tpl-vue .b-kan{height:calc(100dvh - 170px)}
}

/* assets/b/tpl-structure.css */
/* P9 — templates de page, famille « structure » : le CSS de ses blocs.
   Classes tpl-structure-* écrites à la main (Tailwind est figé). Jetons
   d'escouade-b.css seulement (--ink, --line, --card, --paper-2…). Les lignes
   de champs reprennent celles du socle (.tpl-champs-l, .tpl-champ…).

   Quatre classes posées par les gabarits n'ont VOLONTAIREMENT aucune règle :
   ce sont des CROCHETS (pour un test, un sélecteur, une retouche future),
   le rendu tient par les classes du socle et de la famille —
   .tpl-structure-section, .tpl-structure-relation, .tpl-structure-iframe
   (la classe de bloc passée à `cadre`, à côté de .tpl-bloc) et
   .tpl-structure-encadre-d (le <details> d'un encadré repliable). */

/* Le chevron d'un <details> : il tourne quand le groupe s'ouvre. */
.tpl-structure-chev{flex:none;color:var(--ink-3);transition:transform .15s ease}
details[open]>summary .tpl-structure-chev{transform:rotate(90deg)}

/* « section » — des groupes de champs, repliables. */
.tpl-structure-grp+.tpl-structure-grp{margin-top:12px}
.tpl-structure-grp-t{display:flex;align-items:center;gap:6px;margin:0 0 4px;padding:4px 0;color:var(--ink);font:600 12px/1.3 var(--font);list-style:none;cursor:default}
summary.tpl-structure-grp-t{cursor:pointer;border-radius:6px;outline:none}
summary.tpl-structure-grp-t::-webkit-details-marker{display:none}
summary.tpl-structure-grp-t:hover{color:var(--ink)}
summary.tpl-structure-grp-t:focus-visible{box-shadow:var(--ring-ink)}
.tpl-structure-grp-n{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
/* Un groupe que le template nomme et que la disposition n'a pas. */
.tpl-structure-introuvable{flex:none;color:var(--danger);font-weight:500;font-size:11px}
.tpl-structure-compte{margin-left:auto;color:var(--ink-3);font-weight:500;font-size:11px}

/* « encadre » — un texte du template, avec un ton. */
.tpl-structure-encadre{display:flex;gap:10px;align-items:flex-start}
.tpl-structure-encadre-i{display:inline-flex;flex:none;margin-top:1px;color:var(--ink-2)}
.tpl-structure-encadre-c{flex:1;min-width:0}
.tpl-structure-encadre-t{display:flex;align-items:center;gap:6px;margin:0 0 6px;color:var(--ink);font:600 13px/1.3 var(--font);list-style:none}
summary.tpl-structure-encadre-t{cursor:pointer;border-radius:6px;outline:none}
summary.tpl-structure-encadre-t::-webkit-details-marker{display:none}
summary.tpl-structure-encadre-t:focus-visible{box-shadow:var(--ring-ink)}
.tpl-structure-ton-neutre{background:var(--paper-2)}
.tpl-structure-ton-signal{border-color:var(--signal);background:var(--signal-soft)}
.tpl-structure-ton-signal .tpl-structure-encadre-i{color:var(--ink)}
.tpl-structure-ton-alerte{border-color:var(--danger);background:var(--danger-soft)}
.tpl-structure-ton-alerte .tpl-structure-encadre-i{color:var(--danger)}

/* « iframe » — un composant d'application, une page tierce. */
.tpl-structure-frame{display:block;width:100%;border:1px solid var(--line);border-radius:8px;background:var(--card)}

/* « relation » — la fiche liée, les fiches liées, le sélecteur. */
.tpl-structure-rel-un{display:flex;align-items:center;min-height:30px}
.tpl-structure-resume{margin-top:8px}
.tpl-structure-rel-l{display:flex;flex-direction:column;gap:2px;margin:0;padding:0;list-style:none}
.tpl-structure-rel-i{display:flex;align-items:center;gap:8px;min-height:32px;border-bottom:1px solid var(--line)}
.tpl-structure-rel-i:last-child{border-bottom:0}
.tpl-structure-rel-a{display:inline-flex;flex:1;align-items:center;gap:8px;min-width:0;color:var(--ink);font-size:13px;text-decoration:none}
.tpl-structure-rel-a span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tpl-structure-rel-a:hover span{text-decoration:underline}
.tpl-structure-rel-tw{overflow-x:auto}
.tpl-structure-rel-t{width:100%;border-collapse:collapse;font-size:13px}
.tpl-structure-rel-t th{padding:6px 8px;border-bottom:1px solid var(--line-2);color:var(--ink-2);font-size:12px;font-weight:500;text-align:left;white-space:nowrap}
.tpl-structure-rel-t td{padding:6px 8px;border-bottom:1px solid var(--line);color:var(--ink);vertical-align:middle}
.tpl-structure-rel-t tr:last-child td{border-bottom:0}
.tpl-structure-rel-x{width:1%;text-align:right}
.tpl-structure-voir{display:inline-block;margin-top:8px;color:var(--ink-2);font-size:12px;font-weight:500;text-decoration:none}
.tpl-structure-voir:hover{color:var(--ink);text-decoration:underline}
.tpl-structure-geste{display:inline-flex;margin:0}
.tpl-structure-x{display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;padding:0;border:0;border-radius:4px;background:transparent;color:var(--ink-3);cursor:pointer}
.tpl-structure-x:hover{background:var(--paper-2);color:var(--ink)}
.tpl-structure-x:focus-visible{outline:none;box-shadow:var(--ring-ink)}

.tpl-structure-sel{margin-top:10px;border-top:1px solid var(--line);padding-top:8px}
.tpl-structure-sel-s{display:inline-flex;align-items:center;gap:6px;padding:2px 6px;border-radius:6px;color:var(--ink-2);font-size:12px;font-weight:500;list-style:none;cursor:pointer;outline:none}
.tpl-structure-sel-s::-webkit-details-marker{display:none}
.tpl-structure-sel-s:hover{background:var(--paper-2);color:var(--ink)}
.tpl-structure-sel-s:focus-visible{box-shadow:var(--ring-ink)}
.tpl-structure-sel-p{display:flex;flex-direction:column;gap:2px;margin-top:8px;padding:6px;border:1px solid var(--line-2);border-radius:8px;background:var(--card)}
.tpl-structure-sel-f{display:flex;align-items:center;gap:8px;margin:0 0 4px;padding:4px 6px;border-bottom:1px solid var(--line);color:var(--ink-3)}
.tpl-structure-sel-f input{flex:1;min-width:0;border:0;background:transparent;color:var(--ink);font:400 13px/1.4 var(--font);outline:none}
.tpl-structure-sel-b{flex:none;height:24px;padding:0 8px;border:1px solid var(--line-2);border-radius:6px;background:var(--card);color:var(--ink);font-size:12px;cursor:pointer}
.tpl-structure-sel-b:hover{background:var(--paper-2)}
.tpl-structure-sel-h{margin:0;padding:8px 6px;color:var(--ink-3);font-size:12px;text-align:center}
.tpl-structure-hit{display:flex;align-items:center;gap:8px;width:100%;padding:6px;border:0;border-radius:6px;background:transparent;color:var(--ink);font:400 13px/1.3 var(--font);text-align:left;cursor:pointer}
.tpl-structure-hit:hover{background:var(--paper-2)}
.tpl-structure-hit:focus-visible{outline:none;box-shadow:var(--ring-ink)}
.tpl-structure-hit-l{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
/* Un résultat sans geste : une fiche rattachée à une autre. */
.tpl-structure-hit-off{color:var(--ink-3);cursor:default}
.tpl-structure-hit-off:hover{background:transparent}
.tpl-structure-lie{flex:none;color:var(--ink-3);font-size:11px}
.tpl-structure-new{color:var(--ink-2)}
.tpl-structure-sel-p .tpl-structure-geste{display:flex}


/* assets/b/tpl-tableaux.css */
/* P9, lot 7 — la famille « tableaux » : les tuiles d'un tableau de bord et
   son sélecteur de période, blocs d'un template de page.
   Classes tpl-tableaux-* écrites à la main (Tailwind est figé). Une tuile
   prend la hauteur de SA cellule : --tpl-h (ses lignes, posé par la grille)
   fois la ligne de 88 px du tableau de bord, plus les gouttières de la
   grille des templates (16 px) — au téléphone aussi, où la grille s'empile. */
.tpl-tableaux-tuile{height:calc(var(--tpl-h,2) * 88px + (var(--tpl-h,2) - 1) * 16px);min-height:88px;background:transparent}
.tpl-tableaux-tuile>.b-dash-card{height:100%}
.tpl-tableaux-periode{background:transparent}
.tpl-tableaux-periode .dash-periods{margin:0}

/* assets/b/tpl-temps.css */
/* ==========================================================================
   Lot B (2026-10-14) — les CARTES DE TEMPS du constructeur de vue : gantt,
   charge, dates à confirmer, posables sur n'importe quel objet. Leurs corps
   reprennent les règles du planning (.plan-*, assets/b/auto.css et
   assets/app.css) et de la charge d'atelier (.prod-charge-*) ; ce fichier ne
   règle que leur cadre. Classes ÉCRITES À LA MAIN : Tailwind est figé.
   Gabarits : crates/web/src/templates/temps.rs.
   ========================================================================== */

/* Une carte tient dans sa cellule : jamais plus large que la grille. */
.tpl-temps{min-width:0}
.tpl-temps .tpl-planning.plan-page{min-width:0}

/* Le Gantt défile dans sa cellule, jamais au-delà (le conteneur qui défile,
   `.plan-gantt-wrap`, est celui du planning). */
.tpl-temps .plan-gantt-wrap{position:relative;max-width:100%;border-color:var(--line);background:var(--card)}

/* La série face au plafond : son cadre est celui de la carte. */
.tpl-temps .prod-charge{margin:0}

/* Le titre d'une charge par source ou par statut, au-dessus du tableau. */
.tpl-temps .prod-h2{margin-bottom:8px}

/* Deux cartes d'un même onglet (le bac, puis le Gantt) se suivent sans se
   coller. */
.tpl-temps + .tpl-temps{margin-top:4px}

/* assets/b/tpl-travail.css */
/* Q28, lot E1 — la famille « travail » : les cartes de travail du
   constructeur de vue (liste de travail, ancienneté, échéancier, tableau
   croisé). Classes tpl-travail-* écrites à la main (Tailwind est figé),
   jetons d'escouade-b.css seulement. Gabarits :
   crates/web/src/templates/travail.rs.

   Une table dense, chasse tabulaire pour les chiffres ; un retard est au
   rouge du texte (--danger), jamais au vert ; les saisies en place ont la
   taille d'une cellule. */

/* ---- le commun --------------------------------------------------------------- */
.tpl-travail{min-width:0;font-size:13px}
.tpl-travail-scroll{min-width:0;max-width:100%;overflow-x:auto;scrollbar-width:thin}
.tpl-travail-table{width:100%;border-collapse:collapse;font-size:13px;line-height:1.35}
.tpl-travail-table th,.tpl-travail-table td{padding:6px 8px;border-bottom:1px solid var(--line);text-align:left;vertical-align:middle}
.tpl-travail-table thead th{position:sticky;top:0;z-index:1;background:var(--card);color:var(--ink-3);font-size:11.5px;font-weight:500;white-space:nowrap}
.tpl-travail-table tbody th{font-weight:500;color:var(--ink)}
.tpl-travail-table a{color:inherit;text-decoration:none}
.tpl-travail-table a:hover{text-decoration:underline}
.tpl-travail-table tfoot th,.tpl-travail-table tfoot td{border-top:1px solid var(--line-2);border-bottom:0;font-weight:600;color:var(--ink)}
.tpl-travail-table--chiffres td{white-space:nowrap}
.tpl-travail-num{text-align:right!important;font-variant-numeric:tabular-nums;white-space:nowrap}
.tpl-travail-total{font-weight:600;color:var(--ink)}
.tpl-travail-aide{margin:8px 0 0;color:var(--ink-3);font-size:12px;line-height:1.4}
.tpl-travail-aide a{color:var(--ink-2)}
.tpl-travail-notice{margin:0 0 8px;padding:6px 10px;border-radius:6px;background:var(--paper-2);color:var(--ink);font-size:12.5px}
.tpl-travail-notice--bad{background:var(--danger-soft);color:var(--danger)}
.tpl-travail-section{margin:12px 0 6px;color:var(--ink-2);font:600 12.5px/1.3 var(--font)}
.tpl-travail-section:first-child{margin-top:0}

/* ---- les boutons ------------------------------------------------------------- */
.tpl-travail-btn{display:inline-flex;align-items:center;height:28px;padding:0 12px;border:1px solid var(--btn-bg);border-radius:6px;background:var(--btn-bg);color:var(--btn-ink);font:500 12.5px/1 var(--font);cursor:pointer}
.tpl-travail-btn:hover{filter:brightness(1.08)}
.tpl-travail-btn--discret{border-color:var(--line-2);background:var(--card);color:var(--ink)}
.tpl-travail-btn--discret:hover{background:var(--paper-2);filter:none}
.tpl-travail-btn--petit{height:24px;padding:0 8px;font-size:12px}
.tpl-travail-pied{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:10px}
.tpl-travail-pied .tpl-travail-aide{margin:0}
.tpl-travail-form{display:none}

/* ---- « liste_de_travail » ---------------------------------------------------- */
.tpl-travail-groupe th{padding-top:10px;background:var(--paper-2);color:var(--ink-2);font-size:12px;font-weight:600}
.tpl-travail-saisie{width:100%;min-width:96px;max-width:240px;height:26px;padding:0 6px;border:1px solid var(--line-2);border-radius:5px;background:var(--card);color:var(--ink);font:13px/1 var(--font)}
.tpl-travail-saisie:focus{outline:none;box-shadow:var(--ring-ink)}
.tpl-travail-saisie:disabled{border-color:transparent;background:transparent;color:var(--ink-2)}
.tpl-travail-saisie--nombre{max-width:120px;text-align:right;font-variant-numeric:tabular-nums}
.tpl-travail-propose{display:block;margin-top:2px;color:var(--ink-3);font-size:11.5px}
.tpl-travail-actions{width:1%;white-space:nowrap}
.tpl-travail-act{display:inline-flex;align-items:center;gap:6px;margin:0}
.tpl-travail-note{color:var(--ink-3);font-size:11.5px}
.tpl-travail-fait{color:var(--ink-3);font-size:12px}

/* ---- « anciennete » ---------------------------------------------------------- */
.tpl-travail-sous th{padding-left:26px;font-weight:400;color:var(--ink-2)}
.tpl-travail-sous td{color:var(--ink-2)}
.tpl-travail-deplier{display:inline-block;width:16px;margin-right:4px;color:var(--ink-3);text-align:center}

/* ---- « echeancier » ---------------------------------------------------------- */
.tpl-travail-bascule{display:inline-flex;gap:2px;margin-bottom:10px;padding:2px;border-radius:7px;background:var(--paper-2)}
.tpl-travail-bascule a{padding:3px 10px;border-radius:5px;color:var(--ink-2);font-size:12px;text-decoration:none}
.tpl-travail-bascule a[aria-current="page"]{background:var(--card);color:var(--ink);box-shadow:inset 0 0 0 1px var(--line)}
.tpl-travail-seaux{display:grid;gap:12px}
.tpl-travail-seau{min-width:0}
.tpl-travail-seau-t{display:flex;align-items:baseline;gap:8px;margin-bottom:4px;font-weight:600;color:var(--ink)}
.tpl-travail-seau-t a{color:inherit;text-decoration:none}
.tpl-travail-seau-t a:hover{text-decoration:underline}
.tpl-travail-seau-t .tpl-travail-total{margin-left:auto}
.tpl-travail-seau--retard .tpl-travail-seau-t,.tpl-travail-seau--retard .tpl-travail-seau-t a{color:var(--danger)}
.tpl-travail-compte{min-width:18px;padding:0 6px;border-radius:9px;background:var(--paper-2);color:var(--ink-2);font-size:11.5px;font-weight:500;text-align:center;font-variant-numeric:tabular-nums}

@media (max-width:767px){
.tpl-travail-table th,.tpl-travail-table td{padding:5px 6px}
.tpl-travail-saisie{min-width:80px}
}

/* assets/b/trace.css */
/* ==========================================================================
   Escouade · identité B — la trace d'un courriel (ingestion en cascade, F3)
   Écrans : /ingestion/traces (la recherche) et /ingestion/traces/{messageId}
   (web::ingestion_trace, racine .trc), dans le cadre de l'écran
   « Ingestion » ; le lien « Trace » d'un courriel dans la boîte (.trc-link).
   Règles : seulement les jetons d'escouade-b.css, aucune couleur en dur ;
   statuts en esc-badge (data-g), sans couleur ; le danger ne marque qu'un
   échec. Au téléphone : une colonne, les tableaux défilent dans leur carte,
   jamais la page.
   ========================================================================== */

.trc{display:flex;flex-direction:column;gap:16px;width:100%;max-width:1100px;padding:16px 0 48px;color:var(--ink);font:var(--t-small);box-sizing:border-box}
.trc a{color:inherit}
.trc-muted{color:var(--ink-3)}
.trc-intro{margin:0;color:var(--ink-2);max-width:72ch}
.trc-code{font-family:var(--font-mono, ui-monospace, SFMono-Regular, Menlo, monospace);font-size:12px;color:var(--ink-2);overflow-wrap:anywhere}
.trc-nowrap{white-space:nowrap}
.trc-num{text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums}
.trc-empty{margin:0;padding:24px 16px;border:1px dashed var(--line-2);border-radius:var(--r);color:var(--ink-2);text-align:center}
.trc-foot{margin:0}

/* ---- Les boutons et les puces --------------------------------------------- */
.trc-btn{display:inline-flex;align-items:center;gap:6px;height:30px;padding:0 12px;border:1px solid var(--line-2);border-radius:var(--r-sm);background:var(--card);color:var(--ink);font:var(--t-ui);font-size:13px;text-decoration:none;white-space:nowrap;cursor:pointer;box-shadow:var(--shadow-1);transition:border-color var(--d-hover),background-color var(--d-hover)}
.trc-btn:hover{border-color:var(--ink-3)}
.trc-btn:focus-visible{outline:2px solid var(--focus);outline-offset:2px}
.trc-btn--p{background:var(--btn-bg);border-color:var(--btn-bg);color:var(--btn-ink)}
.trc-btn--p:hover{border-color:var(--btn-bg);opacity:.92}
.trc-btn--danger{background:var(--danger);border-color:var(--danger);color:#fff}
.trc-btn--danger:hover{border-color:var(--danger);opacity:.92}
.trc-purge{margin-top:16px;border-color:var(--danger-soft)}
.trc-purge-form{display:flex;flex-wrap:wrap;align-items:flex-end;gap:10px}
.trc-pill{display:inline-flex;align-items:center;max-width:100%;padding:2px 6px;font-size:12px;font-weight:500;line-height:1.3;white-space:nowrap}
.trc-stage{display:inline-flex;align-items:center;gap:5px;white-space:nowrap}
.trc-stage svg{flex:none;color:var(--ink-3)}

/* ---- Les filtres ---------------------------------------------------------- */
.trc-filters{display:flex;flex-wrap:wrap;align-items:flex-end;gap:10px 12px;padding:12px;border:1px solid var(--line);border-radius:var(--r);background:var(--card)}
.trc-field{display:flex;flex-direction:column;gap:4px;min-width:140px}
.trc-field--grow{flex:1 1 220px}
.trc-field>span{font:var(--t-label);letter-spacing:var(--ls-label);text-transform:uppercase;color:var(--ink-3)}
.trc-input{height:30px;padding:0 8px;border:1px solid var(--line-2);border-radius:var(--r-sm);background:var(--card);color:var(--ink);font:var(--t-small);box-sizing:border-box;width:100%}
.trc-input:hover{border-color:var(--ink-3)}
.trc-input:focus{outline:2px solid var(--focus);outline-offset:1px}
.trc-actions{display:flex;gap:8px;align-items:center}
.trc-chips{display:flex;flex-wrap:wrap;gap:6px}
.trc-chip{display:inline-flex;align-items:center;gap:6px;max-width:100%;padding:2px 4px 2px 8px;border-radius:var(--r-pill);background:var(--paper-2);font-size:12px}
.trc-chip-k{color:var(--ink-3)}
.trc-chip-v{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:40ch}
.trc-chip-x{display:inline-flex;align-items:center;justify-content:center;width:18px;height:18px;border-radius:var(--r-round);color:var(--ink-2);text-decoration:none}
.trc-chip-x:hover{background:var(--line);color:var(--ink)}

/* ---- La liste ------------------------------------------------------------- */
.trc-scroll{max-width:100%;overflow-x:auto;border:1px solid var(--line);border-radius:var(--r);background:var(--card)}
.trc-plus{align-self:center}
.trc-plus summary{cursor:pointer;font-size:13px;color:var(--ink-2)}
.trc-plus-c{display:flex;flex-wrap:wrap;gap:10px 12px;margin-top:8px}
.trc-table{width:100%;border-collapse:collapse;font-size:13px}
.trc-table th{padding:8px 12px;border-bottom:1px solid var(--line);color:var(--ink-3);font:500 12px/1.3 var(--font);text-align:left;white-space:nowrap}
.trc-table td{padding:8px 12px;border-bottom:1px solid var(--line);vertical-align:middle}
.trc-table tbody tr:last-child td{border-bottom:0}
.trc-table tbody tr:hover td{background:var(--paper)}
.trc-subject{min-width:220px;max-width:420px}
.trc-subject a{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:500;text-decoration:none}
.trc-subject a:hover{text-decoration:underline}
.trc-pager{display:flex;align-items:center;justify-content:center;gap:12px}

/* ---- Une trace ------------------------------------------------------------ */
.trc-back{display:inline-flex;align-items:center;gap:6px;align-self:flex-start;color:var(--ink-2) !important;text-decoration:none;font:var(--t-caption)}
.trc-back:hover{color:var(--ink) !important}
.trc-head{display:flex;flex-wrap:wrap;align-items:flex-start;justify-content:space-between;gap:8px 16px}
.trc-head-l{min-width:0;flex:1 1 320px}
.trc-title{margin:0;font:var(--t-h3);letter-spacing:var(--ls-h2);overflow-wrap:anywhere}
.trc-sub{margin:4px 0 0;color:var(--ink-3);font:var(--t-caption)}
.trc-card{display:flex;flex-direction:column;gap:10px;padding:14px 16px;border:1px solid var(--line);border-radius:var(--r);background:var(--card)}
.trc-card .trc-scroll{border:0;border-radius:0}
.trc-h2{margin:0;font:600 14px/1.3 var(--font)}
.trc-empty-card{align-items:flex-start}

.trc-facts{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1px;margin:0;border:1px solid var(--line);border-radius:var(--r);background:var(--line);overflow:hidden}
.trc-fact{display:flex;flex-direction:column;gap:4px;min-width:0;padding:10px 12px;background:var(--card)}
.trc-fact dt{color:var(--ink-3);font:var(--t-label);letter-spacing:var(--ls-label);text-transform:uppercase}
.trc-fact dd{margin:0;min-width:0;overflow-wrap:anywhere}

/* le chemin : une ligne par étage, l'icône sur un fil */
.trc-run{margin:6px 0 0;color:var(--ink-2);font:var(--t-label);letter-spacing:var(--ls-label);text-transform:uppercase}
.trc-steps{list-style:none;margin:0;padding:0;display:flex;flex-direction:column}
.trc-step{position:relative;display:flex;gap:12px;padding:0 0 14px}
.trc-step:not(:last-child)::before{content:"";position:absolute;left:13px;top:28px;bottom:0;width:1px;background:var(--line-2)}
.trc-step-ic{flex:none;display:inline-flex;align-items:center;justify-content:center;width:27px;height:27px;border-radius:var(--r-icon);background:var(--paper-2);color:var(--ink-2)}
.trc-step[data-stage="OUTCOME"] .trc-step-ic{background:var(--ink);color:var(--paper)}
.trc-step-b{min-width:0;flex:1;display:flex;flex-direction:column;gap:4px;padding-top:3px}
.trc-step-h{display:flex;flex-wrap:wrap;align-items:center;gap:4px 10px}
.trc-step-n{font-weight:600}
.trc-step-q{min-width:0;overflow-wrap:anywhere}
.trc-step-t{margin-left:auto;color:var(--ink-3);font:var(--t-caption);white-space:nowrap}
.trc-step-note{margin:0;color:var(--ink-2)}
.trc-step-meta{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:3px;font-size:12.5px}
.trc-step-meta li{display:flex;flex-wrap:wrap;align-items:center;gap:4px 6px;min-width:0}
.trc-step-meta svg{flex:none;color:var(--ink-3)}

/* ---- Le lien « Trace » de la boîte de réception --------------------------- */
.trc-link{display:inline-flex;align-items:center;gap:4px;height:24px;padding:0 6px;border-radius:var(--r-sm);color:var(--ink-2);font-size:11px;font-weight:500;text-decoration:none;white-space:nowrap}
.trc-link:hover{background:var(--paper-2);color:var(--ink)}
.trc-link:focus-visible{outline:2px solid var(--focus);outline-offset:1px}

@media (max-width:767px){
  /* La liste de l'historique : sur téléphone, chaque élément se lit d'un bloc, sans défilement de côté. */
  .trc-table--empile,.trc-table--empile tbody{display:block}
  .trc-table--empile thead{display:none}
  .trc-table--empile tr{display:grid;grid-template-columns:1fr auto;gap:4px 8px;padding:10px 12px;border-bottom:1px solid var(--line)}
  .trc-table--empile td{padding:0;border-bottom:0}
  .trc-table--empile .trc-subject{grid-column:1/-1;min-width:0;max-width:none}
.trc{padding:12px 16px 40px}
.trc-facts{grid-template-columns:repeat(2,minmax(0,1fr))}
.trc-step-t{margin-left:0}
.trc-filters .trc-field{flex:1 1 100%}
}

/* assets/b/urbanisme.css */
/* ==========================================================================
   L'URBANISME (Luxembourg, lot 1 — 2026-10-20 ; api/src/pages/urbanism.rs).
   La carte `/urbanism` : MapLibre à gauche, le panneau à droite (recherche
   d'adresse, fiche du point cliqué, couches, légende des zones), empilés sur
   un écran étroit. Le CSS Tailwind est figé : tout ce que cet écran dessine
   est ici, sous le préfixe `urb-`, avec les jetons de l'identité B. La feuille
   de MapLibre (`/pkg/maplibre-gl.css`) arrive avec lui, posée par l'îlot.
   ========================================================================== */

.urb-page {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 360px;
  height: 100%;
  min-height: 0;
  /* Le fond de page de la Bibliothèque (2026-10-21). */
  background: var(--paper);
  color: var(--ink);
  font-family: var(--font);
}

/* ---- La carte ------------------------------------------------------------ */
.urb-map-wrap { position: relative; min-height: 0; border-right: 1px solid var(--line); }
.urb-map { position: absolute; inset: 0; background: var(--paper-2); }
.urb-map-fallback { margin: 0; padding: 24px; color: var(--ink-3); font-size: 13px; }

/* ---- Le panneau ---------------------------------------------------------- */
.urb-panel { display: flex; flex-direction: column; gap: 18px; min-height: 0; overflow-y: auto; padding: 20px 20px 32px; }
.urb-head { display: flex; flex-direction: column; gap: 4px; }
.urb-h1 { margin: 0; font: 600 20px/1.25 var(--font); letter-spacing: var(--ls-h2, -.02em); }
.urb-h2 { margin: 0 0 8px; font: 600 14px/1.3 var(--font); letter-spacing: var(--ls-tight, -.01em); }
.urb-sub { margin: 0; color: var(--ink-2); font-size: 13px; line-height: 1.5; }
.urb-muted { margin: 0; color: var(--ink-3); font-size: 13px; line-height: 1.5; }
.urb-small { font-size: 12px; }
.urb-attr { margin: auto 0 0; color: var(--ink-3); font-size: 11.5px; }

/* ---- La recherche d'adresse ---------------------------------------------- */
.urb-search { display: flex; flex-direction: column; gap: 6px; }
.urb-label { color: var(--ink-2); font-size: 12.5px; font-weight: 500; }
.urb-input {
  height: 34px; padding: 0 10px; border: 1px solid var(--line-2); border-radius: var(--r-sm);
  background: var(--card); color: var(--ink); font: 400 13px/1 var(--font);
}
.urb-input:focus-visible { outline: 2px solid var(--focus, var(--ink)); outline-offset: 1px; }
.urb-results {
  display: flex; flex-direction: column; gap: 2px; max-height: 280px; overflow-y: auto; padding: 4px;
  border: 1px solid var(--line); border-radius: var(--r-sm); background: var(--card); box-shadow: var(--shadow-pop);
}
.urb-results[hidden] { display: none; }
.urb-result {
  display: block; width: 100%; padding: 6px 8px; border: 0; border-radius: var(--r-sm); background: transparent;
  color: var(--ink); font: 400 13px/1.35 var(--font); text-align: left; cursor: pointer;
}
.urb-result:hover, .urb-result:focus-visible { background: var(--paper-2); outline: none; }

/* ---- La fiche du point --------------------------------------------------- */
.urb-zone { padding: 12px; border: 1px solid var(--line); border-radius: var(--r); background: var(--paper); }
.urb-card { display: flex; flex-direction: column; gap: 8px; }
.urb-card .urb-h2 { margin: 0; }
.urb-zone-card {
  padding: 10px 12px; border: 1px solid var(--urb-c, var(--line)); border-left-width: 4px; border-radius: var(--r-sm);
  background: color-mix(in srgb, var(--urb-c, transparent) 18%, var(--card));
}
.urb-zone-code { margin: 2px 0; font: 600 14px/1.35 var(--font); }
.urb-block { display: flex; flex-direction: column; gap: 4px; }
.urb-block-title {
  margin: 0; color: var(--ink-3); font-size: 11.5px; font-weight: 600;
  letter-spacing: var(--ls-label, .02em); text-transform: uppercase;
}
.urb-list { margin: 0; padding-left: 16px; font-size: 13px; line-height: 1.45; overflow-wrap: anywhere; }
.urb-empty { margin: 0; color: var(--ink); font-size: 13px; }
.urb-error { margin: 0; color: var(--danger); font-size: 13px; }

/* ---- Les couches --------------------------------------------------------- */
.urb-section { display: flex; flex-direction: column; gap: 6px; }
.urb-fieldset { display: flex; flex-direction: column; gap: 5px; margin: 0 0 8px; padding: 0; border: 0; }
.urb-fs-title { margin-bottom: 2px; padding: 0; color: var(--ink-2); font-size: 12px; font-weight: 600; }
.urb-check { display: flex; align-items: center; gap: 8px; font-size: 13px; cursor: pointer; }
.urb-check input { margin: 0; accent-color: var(--signal, var(--ink)); }
.urb-check-label { flex: 1 1 auto; min-width: 0; }
.urb-zoom { color: var(--ink-3); font-size: 11.5px; white-space: nowrap; }

/* ---- La légende ---------------------------------------------------------- */
.urb-swatch {
  display: inline-block; flex: 0 0 auto; width: 12px; height: 12px; border-radius: 3px;
  border: 1px solid color-mix(in srgb, var(--urb-c, var(--line)) 70%, var(--ink));
  background: var(--urb-c, var(--line));
}
.urb-swatch-line { border: 2px solid var(--urb-c, var(--line)); background: transparent; }
.urb-family { display: flex; flex-direction: column; gap: 4px; margin-top: 6px; }
.urb-family-name { margin: 0; color: var(--ink-2); font-size: 12px; font-weight: 600; }
.urb-cats { display: flex; flex-wrap: wrap; gap: 4px 10px; margin: 0; padding: 0; list-style: none; }
.urb-cat { display: inline-flex; align-items: center; gap: 5px; font-size: 12px; }
.urb-code { font-weight: 600; font-variant-numeric: tabular-nums; }
.urb-cat-label { color: var(--ink-2); }

/* ---- Le panneau de la parcelle, les PAP, la visionneuse (lots 2 et 3) ---- */
.urb-link { color: var(--ink); text-decoration: underline; text-underline-offset: 2px; overflow-wrap: anywhere; }
.urb-link:hover { color: var(--ink-2); }
.urb-parcel-slot { margin-top: 10px; }
.urb-parcel { display: flex; flex-direction: column; gap: 8px; padding-top: 10px; border-top: 1px solid var(--line); }
.urb-section-fold { border-top: 1px solid var(--line); padding-top: 6px; }
.urb-section-fold > summary { cursor: pointer; list-style: revert; }
.urb-doc { margin: 4px 0; padding: 6px 8px; border: 1px solid var(--line); border-radius: var(--r-sm); background: var(--card); }
.urb-doc-sum { cursor: pointer; font-size: 13px; }
.urb-doc-type { color: var(--ink-3); font-size: 11px; font-weight: 600; text-transform: uppercase; letter-spacing: .02em; }
.urb-passages { margin: 6px 0 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 8px; }
.urb-passage-head { margin: 0; color: var(--ink-2); font-size: 12px; font-weight: 600; }
.urb-passage { margin: 2px 0 0; font-size: 13px; line-height: 1.45; overflow-wrap: anywhere; }
.urb-pre { white-space: pre-wrap; }
.urb-paps { display: flex; flex-direction: column; gap: 6px; margin-top: 8px; }
.urb-docpage { display: flex; flex-direction: column; gap: 10px; max-width: 1100px; padding: 16px; }
.urb-pdf { width: 100%; height: 75vh; border: 1px solid var(--line); border-radius: var(--r-sm); background: var(--paper-2); }

/* ---- Écran étroit : la carte au-dessus, le panneau dessous --------------- */
@media (max-width: 900px) {
  .urb-page { grid-template-columns: minmax(0, 1fr); grid-template-rows: 55vh auto; height: auto; }
  .urb-map-wrap { min-height: 55vh; border-right: 0; border-bottom: 1px solid var(--line); }
  .urb-panel { overflow: visible; }
}