/* geometrie.css — styles communs à toutes les pages de l'entrée Géométrie.
   Chargé APRÈS ../styles.css (racine du site) : on neutralise ici les règles
   globales de la racine qui gênent (button bleu avec marge, section en carte
   blanche...) uniquement sur les éléments marqués des classes ci-dessous. */

[hidden] { display: none !important; }

/* ── Structure de page ─────────────────────────────────────────────── */
.geo-wrap { max-width: 980px; margin: 20px auto; padding: 0 14px; width: 100%; box-sizing: border-box; }
.geo-wrap.wide { max-width: 1300px; }

.geo-header { padding: 18px 0; background: #14532d; text-align: center; }
.geo-header h1 { color: #fff; margin: 0 0 6px; font-size: 1.5rem; }
.geo-header p { color: #d1fae5; margin: 0; font-size: .92rem; }
.geo-nav { display: flex; justify-content: center; gap: 10px; margin-top: 14px; flex-wrap: wrap; }
.geo-nav a {
  padding: 8px 12px; background: #166534; color: #fff; border-radius: 6px;
  text-decoration: none; font-size: .88rem;
}
.geo-nav a:hover { background: #15803d; }

.geo-intro { color: #475569; text-align: center; max-width: 720px; margin: 10px auto 0; }

/* ── Cartes d'accueil ──────────────────────────────────────────────── */
.geo-block-title { font-size: 1.1rem; color: #14532d; margin: 28px 0 4px; border-bottom: 2px solid #bbf7d0; padding-bottom: 4px; }
.domain-grid {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 16px; margin: 14px 0;
}
.domain-card {
  display: block; background: #fff; border: 2px solid #cbd5e1; border-radius: 12px;
  padding: 22px 18px; text-align: center; text-decoration: none; color: inherit;
  transition: border-color .15s, transform .15s; position: relative;
}
.domain-card:hover { border-color: #16a34a; transform: translateY(-2px); }
.domain-card.soon { opacity: .55; pointer-events: none; border-style: dashed; }
button.domain-card { font: inherit; width: 100%; cursor: pointer; }
.domain-card.brique-prog { background: #fefce8; border-color: #fde68a; }
.prog-modale { width: min(900px, calc(100vw - 32px)); max-height: calc(100vh - 48px); padding: 0; border: none; border-radius: 14px; box-shadow: 0 20px 60px rgba(0, 0, 0, .3); }
.prog-modale::backdrop { background: rgba(15, 23, 42, .45); }
.prog-modale[open] { display: flex; flex-direction: column; }
.prog-modale-tete { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 18px; border-bottom: 2px solid #dcfce7; background: #f0fdf4; }
.prog-modale-tete h2 { margin: 0; font-size: 1.15rem; color: #14532d; }
.prog-fermer { margin: 0; border: 1px solid #cbd5e1; background: #fff; color: #334155; border-radius: 8px; width: 36px; height: 36px; font: 700 1.5rem/1 Arial, sans-serif; cursor: pointer; flex: none; }
.prog-fermer:hover { background: #fee2e2; border-color: #fca5a5; }
.prog-modale-corps { overflow-y: auto; padding: 4px 18px 16px; }
.domain-icon { font-size: 2.2rem; margin-bottom: 8px; }
.domain-title { font-size: 1.1rem; font-weight: 700; color: #166534; margin-bottom: 6px; }
.domain-desc { color: #64748b; font-size: .88rem; }
.domain-levels { margin-top: 8px; font-size: .75rem; font-weight: 700; color: #0f766e; letter-spacing: .03em; }
.badge-soon {
  position: absolute; top: 8px; right: 8px; font-size: .68rem; font-weight: 700;
  background: #fef3c7; color: #92400e; border-radius: 10px; padding: 2px 8px;
}
.fmt-badge { display: inline-block; background: #ecfdf5; color: #166534; border-radius: 10px; padding: 1px 8px; margin-right: 4px; }

/* ── Page d'entrée : onglets, vue par thème ─────────────────────────── */
.geo-tabs { display: flex; flex-wrap: wrap; gap: 6px; justify-content: center; margin: 0 0 16px; }
.geo-tabs a {
  padding: 8px 14px; border-radius: 999px; border: 2px solid #bbf7d0; background: #fff;
  color: #14532d; font-weight: 700; font-size: .92rem; text-decoration: none;
}
.geo-tabs a:hover { border-color: #16a34a; }
.geo-tabs a.active { background: #16a34a; border-color: #16a34a; color: #fff; }
.fil-lien { float: right; font-size: .8rem; font-weight: 600; color: #0f766e; text-decoration: none; margin-top: 4px; }
.fil-lien:hover { text-decoration: underline; }
.fil-niv { background: #fff; border: 2px solid #dcfce7; border-radius: 12px; margin: 12px 0; padding: 10px 14px; }
.fil-niv > h3 { margin: 0 0 6px; color: #14532d; font-size: 1.15rem; }
.fil-cols { display: grid; grid-template-columns: minmax(0, 1fr) 230px; gap: 16px; }
.fil-prog h4, .fil-acts h4 { margin: 6px 0 4px; font-size: .78rem; text-transform: uppercase; letter-spacing: .04em; color: #475569; }
.fil-prog ul { margin: 0 0 6px; padding-left: 20px; font-size: .9rem; color: #1e293b; }
.fil-prog li { margin: 3px 0; }
.fil-prog details { margin-top: 4px; }
.fil-prog summary { cursor: pointer; font-size: .85rem; font-weight: 700; color: #0f766e; }
.fil-prog details ul { color: #475569; }
.fil-palier { font-size: .78rem; color: #64748b; font-style: italic; }
.fil-vide { font-size: .85rem; color: #94a3b8; margin: 4px 0; }
.fil-acts { border-left: 2px dashed #dcfce7; padding-left: 12px; }
.fil-act {
  display: block; margin: 4px 0; padding: 6px 10px; border-radius: 8px; background: #f0fdf4;
  color: #14532d; font-weight: 600; font-size: .88rem; text-decoration: none; border: 1px solid #bbf7d0;
}
.fil-act:hover { border-color: #16a34a; }
.fil-act.soon { background: #f8fafc; color: #94a3b8; border-style: dashed; }
.fil-act.soon em { font-size: .75rem; }
.fil-fmt { display: block; font-size: .7rem; font-weight: 700; color: #0f766e; margin: 1px 0 0 22px; }
@media (max-width: 700px) {
  .fil-cols { grid-template-columns: 1fr; }
  .fil-acts { border-left: none; padding-left: 0; border-top: 2px dashed #dcfce7; }
  .fil-lien { float: none; display: block; }
}

/* ── Boutons ───────────────────────────────────────────────────────── */
.gbtn {
  margin: 0; padding: 9px 15px; border-radius: 8px; font-weight: 600;
  display: inline-block; cursor: pointer; border: none; font-size: .92rem;
  font-family: inherit; text-decoration: none; line-height: 1.3;
}
.gbtn-primary { background: #16a34a; color: #fff; }
.gbtn-primary:hover { background: #15803d; }
.gbtn-secondary { background: #f3f4f6; color: #374151; border: 1px solid #d1d5db; }
.gbtn-secondary:hover { background: #e5e7eb; }
.gbtn-big { font-size: 1.1rem; padding: 12px 22px; }
.gbtn[disabled] { opacity: .45; cursor: default; }

/* ── Panneau de réglages ───────────────────────────────────────────── */
.geo-settings {
  background: #f0fdf4; border: 2px solid #bbf7d0; border-radius: 10px;
  padding: 14px 16px; margin: 16px 0;
}
.param-row { display: flex; gap: 18px; flex-wrap: wrap; }
.param-group { flex: 1 1 200px; min-width: 180px; margin-bottom: 8px; }
.param-title {
  display: block; font-size: .78rem; font-weight: 700; color: #475569;
  text-transform: uppercase; letter-spacing: .03em; margin-bottom: 6px;
}
.pill-select { display: flex; gap: 4px; flex-wrap: wrap; }
.pill-btn {
  margin: 0; padding: 5px 10px; border-radius: 16px; border: 1px solid #86efac;
  background: #fff; cursor: pointer; font-size: .82rem; font-weight: 700;
  color: #166534; font-family: inherit; line-height: 1.3;
}
.pill-btn:hover { border-color: #16a34a; background: #fff; }
.pill-btn.active { background: #16a34a; color: #fff; border-color: #16a34a; }

/* ── Scène projetable ──────────────────────────────────────────────── */
.geo-stage {
  position: relative; background: #fff; border: 2px solid #dcfce7; border-radius: 12px;
  padding: 24px 18px; margin: 16px 0; min-height: 380px;
  display: flex; flex-direction: column; align-items: center; justify-content: flex-start;
}
.geo-stage:fullscreen { border: none; border-radius: 0; padding: 48px 32px; justify-content: center; font-size: 1.35em; }
.geo-stage .stage-fs {
  position: absolute; top: 10px; right: 10px; margin: 0; padding: 6px 10px;
  background: #f3f4f6; color: #374151; border: 1px solid #d1d5db; border-radius: 6px;
  font-size: .8rem; cursor: pointer;
}
.stage-counter { color: #64748b; font-size: .9rem; font-weight: 600; margin-bottom: 8px; }
.stage-actions { display: flex; justify-content: center; gap: 10px; margin-top: 18px; flex-wrap: wrap; }
.stage-placeholder { color: #94a3b8; text-align: center; margin: auto; font-size: 1.05rem; }

/* Qui suis-je */
.clue-list { list-style: none; padding: 0; margin: 8px 0; width: 100%; max-width: 760px; }
.clue-list li {
  background: #f8fafc; border-left: 6px solid #16a34a; border-radius: 6px;
  padding: 10px 14px; margin: 8px 0; font-size: 1.25em; font-weight: 600; color: #1e293b;
  animation: geoIn .25s ease-out;
}
.clue-list li .clue-num { color: #16a34a; margin-right: 8px; }
.answer-box { text-align: center; margin-top: 10px; animation: geoIn .3s ease-out; }
.answer-name { font-size: 1.8em; font-weight: 800; color: #166534; margin-top: 6px; }
.answer-note { color: #475569; font-size: .95em; max-width: 640px; margin: 6px auto 0; }
.qsj-candidats { width: 100%; max-width: 980px; margin-top: 14px; border-top: 2px dashed #dcfce7; padding-top: 10px; }
.qsj-reste { text-align: center; color: #64748b; font-weight: 700; font-size: .95em; margin-bottom: 8px; }
.qsj-grille { display: grid; grid-template-columns: repeat(auto-fill, minmax(104px, 1fr)); gap: 8px; }
.qsj-carte {
  position: relative; margin: 0; padding: 6px 4px; background: #fff; border: 2px solid #e2e8f0; border-radius: 10px;
  cursor: pointer; display: flex; flex-direction: column; align-items: center; gap: 2px;
  font-family: inherit; font-size: .8em; font-weight: 700; color: #1e293b; line-height: 1.15;
  transition: opacity .3s, filter .3s, border-color .15s;
}
.qsj-carte:hover { border-color: #86efac; background: #fff; }
.qsj-carte svg { width: 78px; height: 78px; }
.qsj-carte.elimine { border-color: #f1f5f9; }
.qsj-carte.elimine > * { opacity: .25; filter: grayscale(1); }
.qsj-groupe { grid-column: 1 / -1; font-size: .8em; font-weight: 700; color: #475569; text-transform: uppercase; letter-spacing: .03em; margin-top: 4px; }
.qsj-carte.elimine::after {
  content: ""; position: absolute; inset: 8px; pointer-events: none; opacity: .75;
  background: linear-gradient(to top right, transparent calc(50% - 2px), #dc2626 calc(50% - 2px), #dc2626 calc(50% + 2px), transparent calc(50% + 2px));
}
.qsj-carte.trouve > * { opacity: 1; filter: none; }
.qsj-carte.trouve { border-color: #16a34a; background: #f0fdf4; box-shadow: 0 0 0 3px #bbf7d0; }
.qsj-carte.trouve::after { content: none; }
.geo-stage:fullscreen .qsj-carte svg { width: 96px; height: 96px; }

/* Vrai / faux */
.vf-statement {
  font-size: 1.7em; font-weight: 700; text-align: center; color: #1e293b;
  max-width: 820px; margin: 18px auto 6px; line-height: 1.35;
}
.vf-figure { margin: 6px 0; }
.vf-verdict { font-size: 1.6em; font-weight: 800; margin-top: 10px; text-align: center; animation: geoIn .25s ease-out; }
.vf-verdict.vrai { color: #16a34a; }
.vf-verdict.faux { color: #dc2626; }
.vf-why { text-align: center; color: #334155; max-width: 720px; margin: 6px auto 0; font-size: 1.05em; }

/* Quadrillage (symétrie, géométrie flash) */
.grid-svg { width: 100%; max-width: 640px; height: auto; display: block; margin: 0 auto; }
.geo-timer { font-size: 2.6em; font-weight: 800; color: #16a34a; text-align: center; min-height: 1.3em; }

/* Choix (maternelle) */
.choice-row { display: flex; gap: 18px; justify-content: center; flex-wrap: wrap; margin-top: 10px; }
.choice-card {
  margin: 0; background: #fff; border: 3px solid #e2e8f0; border-radius: 14px; padding: 10px;
  cursor: pointer; transition: border-color .15s, transform .15s;
}
.choice-card:hover { border-color: #86efac; background: #fff; transform: translateY(-2px); }
.choice-card.good { border-color: #16a34a; background: #f0fdf4; }
.choice-card.bad { border-color: #dc2626; background: #fef2f2; }

/* L'intrus */
.intrus-row { display: grid; grid-template-columns: repeat(4, minmax(0, 190px)); gap: 14px; justify-content: center; width: 100%; margin-top: 6px; }
.intrus-carte { position: relative; display: flex; flex-direction: column; align-items: center; font-family: inherit; }
.intrus-carte svg { width: 100%; max-width: 150px; height: auto; }
.intrus-lettre {
  position: absolute; top: 6px; left: 8px; width: 30px; height: 30px; border-radius: 50%;
  background: #166534; color: #fff; font-weight: 800; font-size: 1.05em; line-height: 30px; text-align: center;
}
.intrus-nom { font-weight: 700; color: #1e293b; font-size: .95em; margin-top: 2px; min-height: 1.2em; }
.intrus-carte.choisie { border-color: #2563eb; background: #eff6ff; }
.choice-card.possible { border-color: #f59e0b; background: #fffbeb; }
.intrus-verdict { font-size: 1.5em; font-weight: 800; color: #166534; text-align: center; margin-top: 14px; animation: geoIn .25s ease-out; }
.intrus-autres { text-align: center; color: #92400e; max-width: 720px; margin: 8px auto 0; font-size: .98em; }
@media (max-width: 640px) { .intrus-row { grid-template-columns: repeat(2, minmax(0, 170px)); } }

/* ── Programmation ─────────────────────────────────────────────────── */
.prog-level { background: #fff; border-radius: 10px; border: 1px solid #e2e8f0; margin: 16px 0; overflow: hidden; padding: 0; }
.prog-level > h2 { margin: 0; padding: 10px 16px; background: #166534; color: #fff; font-size: 1.15rem; }
.prog-level > h2 small { font-weight: 400; color: #bbf7d0; font-size: .8rem; margin-left: 8px; }
.prog-domains { display: grid; grid-template-columns: repeat(auto-fit, minmax(270px, 1fr)); gap: 0; }
.prog-domain { padding: 12px 16px; border-right: 1px solid #f1f5f9; border-bottom: 1px solid #f1f5f9; }
.prog-domain h3 { margin: 0 0 6px; font-size: .95rem; color: #0f766e; }
.prog-domain ul { margin: 0; padding-left: 18px; }
.prog-domain li { margin: 4px 0; font-size: .9rem; color: #1e293b; list-style: disc; }
.prog-ex { color: #64748b; font-size: .82rem; display: block; }
.prog-links { margin-top: 8px; display: flex; gap: 6px; flex-wrap: wrap; }
.prog-link {
  font-size: .75rem; font-weight: 700; background: #dcfce7; color: #166534; border-radius: 12px;
  padding: 2px 9px; text-decoration: none;
}
.prog-link:hover { background: #bbf7d0; }
.prog-source { font-size: .8rem; color: #64748b; text-align: center; margin: 18px 0; }

/* ── Outils de manipulation ────────────────────────────────────────── */
.manip-app {
  display: grid; grid-template-columns: 230px 1fr; gap: 12px;
  max-width: 1400px; width: 100%; margin: 14px auto; padding: 0 12px; box-sizing: border-box;
}
.manip-side {
  background: #fff; border: 2px solid #dcfce7; border-radius: 12px; padding: 10px;
  max-height: calc(100vh - 150px); overflow-y: auto;
}
.manip-side h3 { margin: 10px 4px 6px; font-size: .78rem; text-transform: uppercase; letter-spacing: .04em; color: #475569; }
.manip-side h3:first-child { margin-top: 2px; }
.palette { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; }
.palette.deux { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.pal-item {
  margin: 0; padding: 4px; background: #f8fafc; border: 1px solid #e2e8f0; border-radius: 8px;
  cursor: grab; display: flex; flex-direction: column; align-items: center; justify-content: center;
  font-size: .68rem; color: #334155; line-height: 1.15; min-height: 58px; touch-action: none;
  min-width: 0; overflow-wrap: anywhere; text-align: center;
}
.pal-item:hover { background: #f0fdf4; border-color: #86efac; }
.pal-item.active { background: #dcfce7; border-color: #16a34a; }
.pal-item svg { display: block; }
.manip-main { display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.manip-toolbar {
  display: flex; flex-wrap: wrap; gap: 6px; align-items: center;
  background: #fff; border: 2px solid #dcfce7; border-radius: 12px; padding: 8px 10px;
}
.manip-toolbar .sep { width: 1px; height: 26px; background: #e2e8f0; margin: 0 4px; }
.tbtn {
  margin: 0; padding: 6px 10px; border-radius: 8px; border: 1px solid #d1d5db; background: #f9fafb;
  color: #1f2937; font-size: .85rem; font-weight: 600; cursor: pointer; font-family: inherit; line-height: 1.2;
}
.tbtn:hover { background: #ecfdf5; border-color: #86efac; color: #14532d; }
.tbtn.active { background: #16a34a; border-color: #16a34a; color: #fff; }
.tbtn[disabled] { opacity: .4; cursor: default; }
.tselect {
  margin: 0; padding: 6px 8px; border-radius: 8px; border: 1px solid #d1d5db; background: #f9fafb;
  color: #1f2937; font-size: .85rem; font-weight: 600; font-family: inherit; cursor: pointer;
}
.tselect:focus { outline: 2px solid #86efac; }
.tlabel { font-size: .75rem; font-weight: 700; color: #64748b; text-transform: uppercase; letter-spacing: .03em; }
.swatch { margin: 0; width: 24px; height: 24px; border-radius: 50%; border: 2px solid #fff; box-shadow: 0 0 0 1px #cbd5e1; cursor: pointer; padding: 0; }
.swatch.active { box-shadow: 0 0 0 3px #16a34a; }
.manip-stage {
  position: relative; background: #fff; border: 2px solid #dcfce7; border-radius: 12px; overflow: hidden;
  height: calc(100vh - 230px); min-height: 420px; touch-action: none; user-select: none;
}
.manip-stage:fullscreen { border: none; border-radius: 0; height: 100vh; }
.manip-stage > svg { width: 100%; height: 100%; display: block; }
.manip-stage .stage-fs { position: absolute; top: 8px; right: 8px; margin: 0; padding: 6px 10px; background: #f3f4f6; color: #374151; border: 1px solid #d1d5db; border-radius: 6px; font-size: .8rem; cursor: pointer; z-index: 2; }
.manip-stage .stage-outils { right: 128px; }
/* zoom des scènes (commun.js : Geo.boutonsZoom) */
.zoom-flottant { position: absolute; right: 10px; bottom: 10px; display: flex; gap: 4px; align-items: center; background: rgba(255,255,255,.92); border: 1px solid #e2e8f0; border-radius: 10px; padding: 4px; z-index: 2; }
.zoom-flottant .tbtn { min-width: 40px; height: 40px; font-size: 1.3rem; padding: 0 8px; }
.zoom-flottant .zoom-pct, .zoom-flottant #bZoomInit { font-size: .85rem; min-width: 62px; }
/* plein écran de toute l'application (menus compris), outils masquables (commun.js) */
.manip-app:fullscreen { max-width: none; margin: 0; padding: 10px; background: #f0fdf4; grid-template-rows: 100%; overflow: hidden; }
.manip-app:fullscreen .manip-side { max-height: none; }
.manip-app:fullscreen .manip-main { min-height: 0; }
.manip-app:fullscreen .manip-stage { flex: 1; height: auto; min-height: 0; }
.manip-app:fullscreen .manip-hint { display: none; }
.manip-app.sans-outils { grid-template-columns: 1fr; }
.manip-app.sans-outils .manip-side, .manip-app.sans-outils .manip-toolbar { display: none; }
.manip-info {
  position: absolute; left: 10px; bottom: 10px; background: rgba(255,255,255,.92); border: 1px solid #e2e8f0;
  border-radius: 10px; padding: 8px 12px; max-width: 420px; font-size: .9rem; color: #1e293b; pointer-events: none;
}
.manip-info b { color: #166534; }
.manip-hint { font-size: .82rem; color: #64748b; padding: 0 4px; }
.slider { accent-color: #16a34a; width: 160px; }
@media (max-width: 760px) {
  .manip-app { grid-template-columns: 1fr; }
  .manip-side { max-height: none; }
  .palette { grid-template-columns: repeat(6, minmax(0, 1fr)); }
  .manip-stage { height: 70vh; }
}

@keyframes geoIn { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }

/* ── Fiche imprimable ──────────────────────────────────────────────── */
.print-sheet { display: none; }
@media print {
  @page { size: A4; margin: 12mm; }
  body > *:not(.print-sheet) { display: none !important; }
  body { display: block; background: #fff; }
  .print-sheet { display: block; font-family: Arial, sans-serif; color: #000; }
  .print-sheet h2 { font-size: 15pt; margin: 0 0 4mm; }
  .print-sheet .sheet-head { display: flex; justify-content: space-between; font-size: 10pt; margin-bottom: 4mm; }
  .print-sheet .sheet-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 6mm; }
  .print-sheet .sheet-item { break-inside: avoid; }
  .print-sheet .sheet-item .num { font-weight: 700; font-size: 10pt; }
  .print-sheet .sheet-item svg { width: 100%; height: auto; }
  .print-sheet .page-break { break-before: page; }
}

/* ── Aperçu A4 imprimable (fiches, matériel) ───────────────────────────
   L'aperçu est la fiche elle-même : ce qu'on voit est ce qui s'imprime.
   Les tailles sont en mm (carreaux de 1 cm, patrons à monter...). */
.print-sheet.apercu { display: block; padding: 0 16px 30px; overflow-x: auto; }
.apercu .page {
  background: #fff; width: 210mm; min-height: 297mm; box-sizing: border-box; padding: 12mm;
  margin: 0 auto 18px; box-shadow: 0 2px 12px rgba(0, 0, 0, .18);
  font-family: Arial, sans-serif; color: #000; font-size: 11pt;
}
.apercu .page-tete { display: flex; justify-content: space-between; font-size: 10pt; margin-bottom: 3mm; }
.apercu .page h2 { font-size: 15pt; margin: 0 0 4mm; color: #000; text-align: left; }
.apercu .page h3 { font-size: 11pt; margin: 0 0 2mm; color: #000; font-weight: 700; }
.apercu svg { display: block; }
.fiche-liste { display: flex; flex-direction: column; gap: 5mm; }
.fiche-deux { display: grid; grid-template-columns: 1fr 1fr; gap: 6mm 5mm; }
.fiche-exo { break-inside: avoid; }
.fiche-paire { display: flex; gap: 6mm; align-items: flex-start; }
.fiche-code { font-size: 17pt; letter-spacing: 1.5mm; margin: 1mm 0 2mm; font-weight: 700; }
.fiche-lignes { font-size: 11pt; line-height: 2; margin-top: 2mm; }
.fiche-corrige { color: #b91c1c; font-weight: 700; }
.mat-note { font-size: 10pt; margin: 0 0 4mm; color: #000; text-align: left; }
.mat-alerte { font-size: 10pt; margin: 0 0 4mm; color: #b91c1c; font-weight: 700; text-align: left; }
.mat-mesures { display: flex; flex-wrap: wrap; gap: 6px 14px; align-items: center; }
.mat-mesures .param-title { width: 100%; }
.mat-champ { font-size: .88rem; font-weight: 600; color: #166534; white-space: nowrap; }
.mat-champ input {
  width: 4.5em; margin: 0 2px; padding: 4px 6px; border: 1px solid #86efac; border-radius: 6px;
  font: inherit; text-align: right;
}
.mat-champ input.mat-erreur { border-color: #dc2626; background: #fef2f2; }
.mat-centre { display: flex; justify-content: center; }
.mat-pile { flex-direction: column; align-items: center; gap: 8mm; }
.mat-cartes { display: grid; grid-template-columns: repeat(4, 42mm); grid-auto-rows: 42mm; justify-content: center; }
.mat-carte {
  border: 0.3mm solid #888; margin: -0.15mm; display: flex; align-items: center; justify-content: center;
  text-align: center; box-sizing: border-box; padding: 2mm;
}
.mat-nom { font-size: 13pt; font-weight: 700; line-height: 1.15; }
.mat-dominos { display: grid; grid-template-columns: repeat(2, 84mm); grid-auto-rows: 34mm; gap: 3mm 6mm; justify-content: center; }
.mat-domino { border: 0.4mm solid #000; border-radius: 3mm; display: grid; grid-template-columns: 1fr 1fr; overflow: hidden; }
.mat-domino > div { display: flex; align-items: center; justify-content: center; text-align: center; padding: 1mm; }
.mat-domino > div:first-child { border-right: 0.3mm dashed #000; }
.mat-bandes { display: flex; flex-direction: column; gap: 6mm; }
.mat-bande { border: 0.4mm solid #000; border-radius: 3mm; display: flex; align-items: center; gap: 6mm; padding: 4mm 6mm; height: 56mm; box-sizing: border-box; }
.mat-bande-nom { font-size: 24pt; font-weight: 700; }
.mat-bande-desc { font-size: 12pt; margin-top: 2mm; }
@media screen { .ecran-cache { display: none !important; } }
.cf-vide { width: 320px; height: 320px; max-width: 100%; margin: 0 auto; border: 2px dashed #cbd5e1; border-radius: 10px; background: #fff; }
.geo-stage svg[viewBox="-125 -125 250 250"] { max-width: 100%; height: auto; border: 1px solid #e2e8f0; }
.cf-planche { display: grid; grid-template-columns: repeat(2, 85mm); grid-auto-rows: 58mm; gap: 4mm 8mm; justify-content: center; }
.cf-carte { border: 0.3mm solid #000; display: flex; align-items: center; justify-content: center; overflow: hidden; }
.cf-carte svg { width: 52mm; height: 52mm; }
.ft-etapes li { font-size: 1.1em; }
.ft-figure { width: 100%; display: flex; justify-content: center; margin-top: 10px; }
.ft-figure svg { max-width: 100%; height: auto; }
.ft-lignes div { border-bottom: 0.3mm dotted #666; height: 8mm; }
.ft-lignes { margin-bottom: 6mm; }
.ft-prog { font-size: 10.5pt; margin: 0 0 3mm; padding-left: 6mm; }
.apercu-bar { display: flex; gap: 10px; justify-content: center; flex-wrap: wrap; margin: 6px 0 16px; }
@media print {
  .print-sheet.apercu { padding: 0; overflow: visible; }
  .apercu .page { width: auto; min-height: 0; padding: 0; margin: 0; box-shadow: none; break-after: page; }
  .apercu .page:last-child { break-after: auto; }
}