/* GÉNÉRÉ par tools/illu-build.mjs depuis _sources/illu/illu.css : ne pas éditer. */
.illu { display: block; width: 100%; height: auto; aspect-ratio: 2 / 1; max-width: 100%; background-image: radial-gradient(circle at 2px 2px, var(--illu-grid) 1px, transparent 1.3px); background-size: 16px 16px; }
.illu
.frame { fill: var(--illu-surface); stroke: var(--illu-line); stroke-width: 1.5; }
.illu
.line { fill: none; stroke: var(--illu-line); stroke-width: 1.2; stroke-linecap: round; stroke-linejoin: round; }
.illu
.wire { fill: none; stroke: var(--illu-muted); stroke-width: 1.4; stroke-dasharray: 3 4; stroke-linecap: round; }
.illu
.knot { fill: var(--illu-surface); stroke: var(--illu-line); stroke-width: 1.5; }
.illu
.dot { fill: var(--illu-line); }
.illu
.soft { fill: none; stroke: var(--illu-soft); stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.illu
.head-n { fill: var(--illu-muted); }
.illu
.node { fill: var(--illu-surface); stroke: var(--illu-accent); stroke-width: 2; }
.illu
.hl { fill: var(--illu-surface); stroke: var(--illu-accent); stroke-width: 2.2; }
.illu
.curve { fill: none; stroke: var(--illu-accent); stroke-width: 2.4; stroke-linecap: round; stroke-linejoin: round; }
.illu .pt,
.illu .head,
.illu .acc,
.illu
.solid { fill: var(--illu-accent); }
.illu
.zone { fill: var(--illu-accent); opacity: .08; }
.illu .zone2 { fill: var(--illu-accent); opacity: .18; }
.illu
.txt { font-family: var(--illu-mono, ui-monospace, 'Cascadia Mono', Consolas, monospace); font-size: 10px; fill: var(--illu-soft); }
.illu .txt.big { font-size: 12px; font-weight: 500; }
.illu .txt.ink { fill: var(--illu-ink); }
.illu .txt.acc { fill: var(--illu-accent); }
.illu .txt.on { fill: var(--illu-on); }
.illu tspan.acc { fill: var(--illu-accent); } @media (prefers-reduced-motion: no-preference) { .illu-host:hover
.illu .curve[pathLength="1"], .illu-host:focus-visible
.illu .curve[pathLength="1"] { stroke-dasharray: 1; animation: illu-draw 1.1s ease-out; } } @keyframes illu-draw { from { stroke-dashoffset: 1; } to { stroke-dashoffset: 0; } }
.card, .illu-fig { --illu-accent: var(--amber); --illu-surface: var(--panel); --illu-line: var(--line-hi); --illu-muted: var(--faint); --illu-soft: var(--muted); --illu-ink: var(--paper); --illu-grid: rgba(var(--line-rgb), .55); --illu-on: var(--ink); --illu-mono: var(--mono, 'IBM Plex Mono', ui-monospace, monospace); }
.card-art { display: block; width: calc(100% + 40px); margin: -20px -20px 16px; border-bottom: 1px solid var(--line); background: var(--panel2); }
.card-art .illu { background-color: var(--panel2); }
.card.todo .card-art { opacity: .75; }
.illu-fig { max-width: 440px; margin: 18px auto; border: 1px solid var(--line); border-radius: var(--r-lg); overflow: hidden; background: var(--panel2); }
.illu-fig .illu { background-color: var(--panel2); }