/* Énoncé structuré d'un exercice d'atelier : une seule fois en tête de l'exercice, puis un bandeau « Revoir l'énoncé ».
   Jetons du thème (design-tokens.css) ; figures SVG colorées par classes, lisibles au vidéoprojecteur. */
.ast { --ast-accent: var(--teal-700, #0f766e); --ast-ink: var(--ink, #14213d); --ast-soft: var(--teal-50, #ecfdf5);
  display: grid; gap: 16px; padding: 20px 22px; border: 1px solid var(--line, #e3e7ee); border-radius: var(--r-lg, 16px);
  background: var(--paper, #fff); color: var(--ast-ink); box-shadow: 0 1px 2px rgba(16, 32, 58, .04), 0 8px 24px -16px rgba(16, 32, 58, .18); }
.ast.is-sheet { padding: 0; border: 0; box-shadow: none; }
.ast-head { display: grid; gap: 4px; }
.ast-kicker { margin: 0; font: 700 12px/1.2 var(--font-sans, Inter, sans-serif); letter-spacing: .04em; text-transform: uppercase; color: var(--ast-accent); }
.ast-title { margin: 0; font: 800 clamp(20px, 2.4vw, 26px)/1.2 var(--font-sans, Inter, sans-serif); text-wrap: balance; }
.ast-lead { margin: 2px 0 0; color: var(--ink-700, #334155); font-size: 15px; line-height: 1.5; }
/* Téléphone : contexte, figure, formules, données. Grand écran : la figure à droite, sur toute la hauteur. */
.ast-grid { display: grid; gap: 14px; align-items: start; }
.ast-ctx { display: grid; gap: 10px; min-width: 0; }
.ast-grid > * { min-width: 0; }
@media (min-width: 720px) {
  .ast-grid.has-fig { grid-template-columns: minmax(0, 1fr) minmax(220px, 300px); grid-template-areas: "ctx fig" "formulas fig" "data fig"; column-gap: 20px; }
  .ast-grid.has-fig > .ast-ctx { grid-area: ctx; } .ast-grid.has-fig > .ast-fig { grid-area: fig; align-self: start; }
  .ast-grid.has-fig > .ast-formulas { grid-area: formulas; } .ast-grid.has-fig > .ast-table-wrap { grid-area: data; }
}
.ast-p { margin: 0; font-size: 15.5px; line-height: 1.6; max-width: 70ch; }

/* Formules : la notation de l'énoncé, en grand. */
.ast-formulas { display: grid; gap: 8px; }
.ast-formula { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 14px; padding: 12px 16px; border-radius: 12px; background: var(--ast-soft); border: 1px solid color-mix(in srgb, var(--ast-accent) 22%, transparent); }
.ast-flabel { font: 600 13px/1.3 var(--font-sans, Inter, sans-serif); color: var(--ast-accent); }
.ast-fexpr { font: 500 21px/1.5 "Cambria Math", "STIX Two Math", "Latin Modern Math", Cambria, Georgia, serif; color: var(--ast-ink); letter-spacing: .01em; }
.ast-fexpr sup, .ast-fexpr sub, .ast-table sup, .ast-table sub, .ast-p sup, .ast-p sub { font-size: .7em; line-height: 0; }
.ast-frac { display: inline-flex; flex-direction: column; vertical-align: middle; text-align: center; margin: 0 .15em; }
.ast-num { padding: 0 .2em; border-bottom: 1.5px solid currentColor; }
.ast-den { padding: 0 .2em; }
.ast-sqrt .ast-rad { border-top: 1.5px solid currentColor; padding: 0 .12em; }

/* Données. */
.ast-table-wrap { overflow-x: auto; border: 1px solid var(--line, #e3e7ee); border-radius: 12px; }
.ast-table { width: 100%; border-collapse: collapse; font-size: 14.5px; }
.ast-table th, .ast-table td { padding: 8px 12px; text-align: left; vertical-align: top; border-bottom: 1px solid var(--line, #e3e7ee); }
.ast-table tr:last-child > * { border-bottom: 0; }
.ast-table thead th { background: var(--bg-sunken, #f4f6f9); font: 700 12px/1.3 var(--font-sans, Inter, sans-serif); text-transform: uppercase; letter-spacing: .03em; color: var(--ink-700, #334155); }
.ast-sym { font: 600 15px/1.4 "Cambria Math", Cambria, Georgia, serif; white-space: nowrap; color: var(--ast-accent); }

/* Figure. */
.ast-fig { margin: 0; display: grid; gap: 6px; justify-items: center; padding: 12px; border-radius: 14px; background: var(--bg-sunken, #f4f6f9); }
.ast-fig svg { width: 100%; max-width: 300px; height: auto; overflow: visible; }
.ast-fig figcaption { font-size: 13px; color: var(--ink-700, #334155); text-align: center; line-height: 1.4; }
.ast-f-shape { fill: var(--paper, #fff); stroke: var(--ast-ink); stroke-width: 2; stroke-linejoin: round; }
.ast-f-shape.is-top { fill: color-mix(in srgb, var(--ast-accent) 10%, var(--paper, #fff)); }
.ast-f-shape.is-a { fill: color-mix(in srgb, var(--ast-ink) 12%, var(--paper, #fff)); }
.ast-f-shape.is-b { fill: color-mix(in srgb, var(--blue-600, #2563eb) 22%, var(--paper, #fff)); }
.ast-f-thin { fill: none; stroke: var(--ast-ink); stroke-width: 1.4; }
.ast-f-thin.is-dashed { stroke-dasharray: 5 4; opacity: .7; }
.ast-f-thin.is-steam { stroke: color-mix(in srgb, #ef4444 60%, var(--paper, #fff)); stroke-linecap: round; }
.ast-f-dim { fill: none; stroke: var(--ink-700, #334155); stroke-width: 1.4; }
.ast-f-dim.is-accent, .ast-f-force { stroke: var(--ast-accent); stroke-width: 2.2; fill: none; }
.ast-f-force.is-cold { stroke: var(--blue-600, #2563eb); }
.ast-f-force.is-hot { stroke: #dc2626; }
.ast-f-head { fill: context-stroke; }
.ast-f-dot { fill: var(--ast-ink); }
.ast-f-plate { fill: color-mix(in srgb, var(--ast-ink) 70%, var(--paper, #fff)); stroke: var(--ast-ink); stroke-width: 1.2; stroke-linejoin: round; }
.ast-f-diel { fill: color-mix(in srgb, var(--ast-accent) 18%, var(--paper, #fff)); stroke: none; }
.ast-f-water { fill: color-mix(in srgb, var(--blue-600, #2563eb) 20%, var(--paper, #fff)); }
.ast-f-bolt { fill: #f59e0b; stroke: #b45309; stroke-width: 1; stroke-linejoin: round; }
.ast-f-label { font: 700 18px "Cambria Math", Cambria, Georgia, serif; fill: var(--ast-ink); }
.ast-f-label.is-accent { fill: var(--ast-accent); }
.ast-f-label.is-in { font-size: 16px; }
.ast-f-note { font: 600 13px var(--font-sans, Inter, sans-serif); fill: var(--ink-700, #334155); }

/* Travail demandé, NB, exemple. */
.ast-h { margin: 0 0 6px; font: 800 13px/1.3 var(--font-sans, Inter, sans-serif); letter-spacing: .04em; text-transform: uppercase; color: var(--ast-accent); }
.ast-task { padding: 14px 16px; border-radius: 12px; background: color-mix(in srgb, var(--ast-accent) 7%, var(--paper, #fff)); border: 1.5px solid color-mix(in srgb, var(--ast-accent) 35%, transparent); }
.ast-task p { margin: 0; font-size: 16px; line-height: 1.55; font-weight: 500; }
.ast-notes { margin: 0; padding: 0; list-style: none; display: grid; gap: 6px; }
.ast-notes li { padding: 9px 12px; border-radius: 10px; background: var(--amber-50, #fffbeb); color: var(--ink-800, #1f2937); font-size: 14.5px; line-height: 1.5; }
.ast-notes li b { margin-right: 6px; color: var(--amber-700, #b45309); }
.ast-console { margin: 0; padding: 12px 14px; border-radius: 10px; background: #1e1b3a; color: #e7e5ff; font: 500 13.5px/1.6 var(--font-mono, ui-monospace, monospace); white-space: pre-wrap; overflow-x: auto; }

/* Bandeau replié et bouton « Énoncé ». */
.ast-compact { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 12px; padding: 10px 14px; border: 1px solid var(--line, #e3e7ee); border-radius: 14px; background: var(--paper, #fff); }
.ast-compact-t { font-size: 14.5px; color: var(--ink-700, #334155); min-width: 0; }
.ast-compact-t b { color: var(--ast-accent, #0f766e); }
.ast-open { display: inline-flex; align-items: center; gap: 6px; min-height: 40px; padding: 0 14px; border-radius: 10px; border: 1.5px solid var(--teal-700, #0f766e); background: var(--paper, #fff); color: var(--teal-700, #0f766e); font: 700 14px var(--font-sans, Inter, sans-serif); cursor: pointer; }
.ast-open:hover { background: var(--teal-50, #ecfdf5); }
.ast-open:focus-visible { outline: 3px solid var(--focus-color, #2563eb); outline-offset: 2px; }
.ex-head[data-ast-compact="1"] > .ast { display: none; }
.ex-head[data-ast-compact="0"] > .ast-compact { display: none; }

/* Atelier dans l'espace de travail unifié : l'en-tête d'exercice (masqué ailleurs) porte l'énoncé. */
#app:has(.learning-workspace[data-learning-workspace="unified"]) .learning-card > .ex-head:has([data-atelier-statement]) { display: grid !important; gap: 12px; padding: 0 0 14px; border: 0; background: transparent; }
@media (max-width: 600px) { .ast { padding: 16px 14px; } .ast-fexpr { font-size: 19px; } }
@media print { .ast-compact, .ast-open { display: none !important; } .ex-head > .ast { display: grid !important; } }
/* Panneau « Énoncé » : au-dessus de l'en-tête collant de l'exercice (et de la barre de projection). */
.ux-drawer-backdrop:has(.ast) { z-index: 1300; }
.ux-drawer:has(> * .ast), .ux-drawer:has(.ast) { max-width: min(980px, 100vw); }
.ast.is-sheet .ast-kicker, .ast.is-sheet .ast-title { display: none; }
