:root {
  --fond: #0f1220; --panneau: #181c2e; --ligne: #2b3050; --texte: #e9ecf8; --discret: #9aa1c4;
  --accent: #5b8cff; --alerte: #ffb454; --erreur: #ff6b6b; --ok: #46d39a;
  color-scheme: dark;
}
* { box-sizing: border-box; }
body { margin: 0; background: var(--fond); color: var(--texte); font: 15px/1.5 system-ui, -apple-system, "Segoe UI", sans-serif; }
.entete { display: flex; flex-wrap: wrap; align-items: center; gap: 16px; padding: 12px 16px; border-bottom: 1px solid var(--ligne); }
.entete h1 { margin: 0; font-size: 18px; }
.onglets { display: flex; gap: 6px; }
.onglets button { background: transparent; color: var(--discret); border: 1px solid transparent; border-radius: 8px; padding: 6px 12px; cursor: pointer; }
.onglets button[aria-selected="true"] { color: var(--texte); border-color: var(--ligne); background: var(--panneau); }
main { padding: 16px; }
.vue { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 16px; }
.vue[hidden] { display: none; }
.panneau { background: var(--panneau); border: 1px solid var(--ligne); border-radius: 12px; padding: 14px; min-width: 0; }
.sortie { position: sticky; top: 12px; align-self: start; max-height: calc(100vh - 24px); overflow: auto; }
fieldset { border: 1px solid var(--ligne); border-radius: 10px; margin: 0 0 12px; padding: 10px 12px 12px; }
legend { padding: 0 6px; color: var(--discret); font-size: 13px; text-transform: uppercase; letter-spacing: .05em; }
label { display: block; font-size: 13px; color: var(--discret); margin-bottom: 8px; }
input, select, textarea { width: 100%; margin-top: 3px; background: #11152a; color: var(--texte); border: 1px solid var(--ligne); border-radius: 8px; padding: 7px 9px; font: inherit; }
input:focus, select:focus, textarea:focus { outline: 2px solid var(--accent); outline-offset: 0; }
textarea { resize: vertical; }
.grille { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 0 10px; }
.grille .large { grid-column: 1 / -1; }
.barre { display: flex; flex-wrap: wrap; align-items: end; gap: 8px; margin-bottom: 12px; }
.barre label { margin: 0; flex: 1 1 200px; }
button { background: var(--accent); color: #fff; border: 0; border-radius: 8px; padding: 8px 14px; font: inherit; cursor: pointer; }
button.secondaire { background: #262b4a; color: var(--texte); }
button.ajout { background: transparent; border: 1px dashed var(--ligne); color: var(--discret); width: 100%; }
button.retirer { background: transparent; color: var(--erreur); padding: 4px 8px; }
.interrupteur { display: flex; align-items: center; gap: 6px; flex: 0 0 auto; }
.interrupteur input { width: auto; margin: 0; }
.ligne { display: grid; grid-template-columns: repeat(auto-fit, minmax(120px, 1fr)) auto; gap: 8px; align-items: end; margin-bottom: 8px; padding-bottom: 8px; border-bottom: 1px dashed var(--ligne); }
.ligne label { margin: 0; }
.cases { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 4px 12px; }
.cases label { display: flex; align-items: center; gap: 6px; margin: 0; color: var(--texte); }
.cases input { width: auto; margin: 0; }
.feuille { margin: 0; padding: 14px; background: #fff; color: #14161f; border-radius: 8px; white-space: pre-wrap; word-wrap: break-word; font: 14px/1.55 "Georgia", "Times New Roman", serif; min-height: 120px; }
.avertissements { display: grid; gap: 6px; margin-bottom: 10px; }
.avertissements div { padding: 6px 10px; border-radius: 8px; font-size: 13px; border: 1px solid var(--ligne); }
.avertissements .attention { border-color: var(--alerte); color: var(--alerte); }
.avertissements .erreur { border-color: var(--erreur); color: var(--erreur); }
.avertissements .ok { border-color: var(--ok); color: var(--ok); }
.discret { color: var(--discret); font-size: 13px; }
.pied { padding: 0 16px 24px; max-width: 900px; }
ins { background: #cdeed9; color: #0a3d22; text-decoration: none; border-radius: 3px; }
del { background: #ffd3d3; color: #5a1010; border-radius: 3px; }
@media (max-width: 900px) { .vue { grid-template-columns: 1fr; } .sortie { position: static; max-height: none; } }
@media print {
  body { background: #fff; }
  .entete, .vue > :not(.sortie), .sortie .barre, .avertissements, #resume-corrections, .pied { display: none !important; }
  .vue { display: block; } .sortie { border: 0; padding: 0; position: static; max-height: none; }
  .feuille { font-size: 12pt; padding: 0; }
}