/* Atelier Excel en ligne — maquette. Style Academy : sobre, fiches ; bleu du logo Digibus (#0B5FFF).
   Règle : aucun défilement de la PAGE ; seuls la grille, les listes d'aide et les tableaux défilent dans leur cadre. */
:root {
  --bleu: #0B5FFF; --bleu-ink: #0A3FA8; --bleu-soft: #E8F0FF; --bleu-line: #BFD3FF;
  --ink: #0F1B3C; --n7: #41505F; --n5: #5D6A7E; --n4: #8A93A6; --n3: #B9C0CB; --n2: #DDE3EC; --n1: #EDF0F5; --n0: #F7F9FC;
  --paper: #F3F5F9; --surface: #fff;
  --ok: #0F7A55; --ok-soft: #E3F4EC; --ko: #B3261E; --ko-soft: #FBE9E7; --warn: #8D6708; --warn-soft: #FBF3DC;
  --or: #E0A800; --r: 10px; --sh: 0 1px 2px rgba(15,27,60,.06), 0 4px 14px rgba(15,27,60,.06);
  --f-ui: 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif; --f-mono: 'IBM Plex Mono', ui-monospace, 'Cascadia Mono', Consolas, monospace;
  --row: 30px; --top: 52px; --cible: #FFFBEA; --cible2: #FFF3C4;
}
*, *::before, *::after { box-sizing: border-box; }
html, body { height: 100%; margin: 0; overscroll-behavior: none; -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
body { font: 400 14px/1.5 var(--f-ui); color: var(--ink); background: var(--paper); overflow: hidden; -webkit-font-smoothing: antialiased; }
h1, h2, h3 { margin: 0; line-height: 1.2; letter-spacing: -.01em; }
h1 { font-size: 1.15rem; font-weight: 700; } h2 { font-size: 1rem; font-weight: 650; } h3 { font-size: .92rem; font-weight: 650; }
p { margin: 0 0 .6em; } ul, ol { margin: 0 0 .6em; padding-inline-start: 1.2em; } li { margin-bottom: .25em; }
code { font: 500 .86em var(--f-mono); background: var(--n1); padding: 1px 5px; border-radius: 5px; color: var(--ink); word-break: break-word; }
kbd { font: 600 .72rem var(--f-mono); padding: 2px 6px; border-radius: 6px; border: 1px solid var(--n2); background: var(--n0); }
a { color: var(--bleu-ink); }
.sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
.petit { font-size: .82rem; color: var(--n5); } .muted { color: var(--n5); }
:focus-visible { outline: 3px solid var(--bleu); outline-offset: 2px; }
button { font: inherit; color: inherit; }

/* ---------- Boutons (cible tactile ≥ 44 px) ---------- */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 44px; padding: 0 16px; border-radius: 10px; border: 1px solid var(--n3); background: var(--surface); color: var(--ink); font-weight: 600; cursor: pointer; text-decoration: none; white-space: nowrap; }
.btn:hover { border-color: var(--bleu); background: var(--bleu-soft); }
.btn.prim { background: var(--bleu); border-color: var(--bleu); color: #fff; }
.btn.prim:hover { background: var(--bleu-ink); border-color: var(--bleu-ink); }
.btn.doux { background: var(--bleu-soft); border-color: var(--bleu-line); color: var(--bleu-ink); }
.btn[disabled], .btn[aria-disabled=true] { opacity: .5; cursor: not-allowed; }
.btn.mini { min-height: 44px; min-width: 44px; padding: 0 10px; }
.ico { width: 18px; height: 18px; flex: none; }

/* ---------- En-tête ---------- */
.top { height: var(--top); display: flex; align-items: center; gap: 10px; padding: 0 12px; background: var(--surface); border-bottom: 1px solid var(--n2); position: relative; z-index: 30; }
.marque { display: flex; align-items: center; gap: 9px; text-decoration: none; color: var(--ink); font-weight: 700; min-height: 44px; }
.marque img { width: 30px; height: 30px; border-radius: 7px; }
.marque small { display: block; font-weight: 500; font-size: .7rem; color: var(--n5); line-height: 1.1; }
.etiq-maq { font: 600 .68rem var(--f-mono); text-transform: uppercase; letter-spacing: .06em; background: var(--warn-soft); color: var(--warn); border-radius: 999px; padding: 3px 9px; }
.sp { flex: 1 1 auto; }
.chips { display: flex; gap: 6px; }
.chip-ex { display: inline-flex; align-items: center; justify-content: center; min-width: 44px; min-height: 44px; border-radius: 10px; border: 1px solid var(--n3); background: var(--surface); text-decoration: none; font-weight: 700; color: var(--ink); position: relative; }
.chip-ex[aria-current=page] { background: var(--bleu); border-color: var(--bleu); color: #fff; }
.chip-ex.fait::after { content: ''; position: absolute; top: 4px; inset-inline-end: 4px; width: 9px; height: 9px; border-radius: 50%; background: var(--ok); box-shadow: 0 0 0 2px var(--surface); }
.lang { position: relative; }
.lang summary { list-style: none; cursor: pointer; display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 0 12px; border: 1px solid var(--n3); border-radius: 10px; font-weight: 600; background: var(--surface); }
.lang summary::-webkit-details-marker { display: none; }
.lang ul { position: absolute; inset-inline-end: 0; top: 48px; list-style: none; margin: 0; padding: 6px; background: var(--surface); border: 1px solid var(--n2); border-radius: 12px; box-shadow: var(--sh); min-width: 190px; z-index: 50; }
.lang li { margin: 0; } .lang li button { all: unset; box-sizing: border-box; width: 100%; min-height: 44px; display: flex; align-items: center; gap: 10px; padding: 0 10px; border-radius: 8px; cursor: pointer; }
.lang li button[aria-pressed=true] { background: var(--bleu-soft); font-weight: 700; } .lang li button[disabled] { opacity: .55; cursor: not-allowed; }
.lang li small { margin-inline-start: auto; color: var(--n5); font-size: .72rem; }
.flag { width: 22px; height: 15px; border-radius: 3px; box-shadow: 0 0 0 1px rgba(0,0,0,.18); flex: none; }
.tabsbar { display: none; }

/* ---------- Page : cadre plein écran ---------- */
.page { height: 100vh; height: 100dvh; height: var(--vvh, 100dvh); padding: env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left); display: flex; flex-direction: column; }
.corps { flex: 1 1 auto; min-height: 0; padding: 10px; }
.carte { background: var(--surface); border: 1px solid var(--n2); border-radius: 14px; box-shadow: var(--sh); min-height: 0; }

/* ---------- Écran d'exercice : 3 zones ---------- */
.kicker { font: 600 .68rem var(--f-mono); letter-spacing: .08em; text-transform: uppercase; color: var(--bleu-ink); }

/* zone 1 : énoncé */
.enonce-corps { flex: 1 1 auto; min-height: 0; overflow: auto; padding: 12px 14px; }
.enonce-corps h2 { margin-bottom: 8px; }
.regle { background: var(--bleu-soft); border-inline-start: 4px solid var(--bleu); border-radius: 8px; padding: 8px 12px; font-weight: 600; }
.pager { display: flex; align-items: center; gap: 8px; padding: 8px 10px; border-top: 1px solid var(--n1); }
.points { display: flex; gap: 6px; flex: 1; justify-content: center; }
.points button { all: unset; box-sizing: border-box; width: 26px; height: 44px; display: grid; place-items: center; cursor: pointer; }
.points button i { width: 10px; height: 10px; border-radius: 50%; background: var(--n3); display: block; }
.points button[aria-current=true] i { background: var(--bleu); width: 14px; height: 14px; }
.cibles { padding: 8px 12px 10px; border-top: 1px solid var(--n1); background: var(--n0); }
.cibles h3 { font-size: .78rem; color: var(--n5); text-transform: uppercase; letter-spacing: .05em; margin-bottom: 6px; }
.cibles-liste { display: flex; flex-wrap: wrap; gap: 6px; }
.cible-lien { all: unset; box-sizing: border-box; cursor: pointer; display: inline-flex; align-items: center; min-height: 36px; padding: 0 10px; border-radius: 8px; background: var(--surface); border: 1px solid var(--bleu-line); font: 600 .75rem var(--f-mono); color: var(--bleu-ink); }
.cible-lien:hover { background: var(--bleu-soft); }

/* zone 2 : feuille */
.feuille-barre { display: flex; align-items: center; gap: 8px; padding: 6px 8px; border-bottom: 1px solid var(--n1); flex-wrap: wrap; }
.formule { display: flex; align-items: center; gap: 6px; padding: 6px 8px; border-bottom: 1px solid var(--n1); background: var(--n0); }
.formule .nom { width: 62px; min-height: 36px; display: grid; place-items: center; border: 1px solid var(--n3); border-radius: 8px; font: 600 .8rem var(--f-mono); background: var(--surface); flex: none; }
.formule .fx { font: italic 700 .9rem Georgia, serif; color: var(--n5); flex: none; }
.formule input { flex: 1 1 auto; min-width: 0; min-height: 36px; border: 1px solid var(--n3); border-radius: 8px; padding: 0 10px; font: 500 .85rem var(--f-mono); background: var(--surface); color: var(--ink); }
.formule input[readonly] { background: var(--n1); color: var(--n5); }
.formule .btn { min-height: 36px; min-width: 36px; padding: 0 8px; }
.touches { display: none; gap: 6px; padding: 6px 8px; overflow-x: auto; border-bottom: 1px solid var(--n1); background: var(--n0); white-space: nowrap; scrollbar-width: thin; }
.touches button { min-width: 44px; min-height: 44px; padding: 0 10px; border-radius: 8px; border: 1px solid var(--n3); background: var(--surface); font: 600 .9rem var(--f-mono); cursor: pointer; }
.touches button.sug { background: var(--bleu-soft); border-color: var(--bleu-line); color: var(--bleu-ink); }
.grille-cadre { flex: 1 1 auto; min-height: 0; overflow: auto; position: relative; background: var(--surface); outline-offset: -3px; }
table.grille { border-collapse: separate; border-spacing: 0; table-layout: fixed; font: 400 .82rem var(--f-ui); }
.grille th, .grille td { height: var(--row); padding: 0 8px; border-right: 1px solid var(--n2); border-bottom: 1px solid var(--n2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; background: var(--surface); }
.grille thead th { position: sticky; top: 0; z-index: 3; background: var(--n1); color: var(--n7); font-weight: 600; text-align: center; font-size: .72rem; height: 26px; }
.grille tbody th { position: sticky; left: 0; z-index: 2; background: var(--n1); color: var(--n7); font-weight: 600; text-align: center; font-size: .72rem; padding: 0; }
.grille thead th:first-child { left: 0; z-index: 4; }
.grille td.t { text-align: left; } .grille td.n { text-align: right; font-variant-numeric: tabular-nums; } .grille td.e { text-align: center; color: var(--ko); font-weight: 600; }
.grille td.titre { font-weight: 700; } .grille td.entete { background: var(--bleu-soft); font-weight: 650; color: var(--bleu-ink); }
.grille td.deborde { overflow: visible; text-overflow: clip; z-index: 1; }
.grille td.cible { background: var(--cible); cursor: cell; }
.grille td.cible.vide { background: repeating-linear-gradient(135deg, var(--cible), var(--cible) 6px, var(--cible2) 6px, var(--cible2) 12px); }
.grille td.verrou { color: var(--n7); }
.grille td.sel { outline: 2px solid var(--bleu); outline-offset: -2px; z-index: 2; }
.grille td.plage { background: var(--bleu-soft); }
.grille td.pointe { outline: 2px dashed var(--ok); outline-offset: -2px; }
.grille td.ok { box-shadow: inset 0 0 0 2px var(--ok); background: var(--ok-soft); }
.grille td.ko { box-shadow: inset 0 0 0 2px var(--ko); background: var(--ko-soft); }
.onglets-feuilles { display: flex; gap: 4px; padding: 4px 6px; border-top: 1px solid var(--n2); background: var(--n1); overflow-x: auto; scrollbar-width: thin; }
.onglets-feuilles button { flex: none; min-height: 44px; max-width: 210px; padding: 0 12px; border: 1px solid transparent; border-radius: 8px 8px 0 0; background: transparent; cursor: pointer; font: 600 .78rem var(--f-ui); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--n7); }
.onglets-feuilles button[aria-selected=true] { background: var(--surface); border-color: var(--n3); border-bottom-color: var(--surface); color: var(--bleu-ink); }
.onglets-feuilles button.cible-feuille::after { content: ' ●'; color: var(--or); }
.pied-feuille { display: flex; align-items: center; gap: 8px; padding: 6px 8px; border-top: 1px solid var(--n2); flex-wrap: wrap; }
.progres { margin-inline-start: auto; font-size: .78rem; color: var(--n5); font-weight: 600; }

/* zone 3 : aide */
.aide-onglets { display: flex; border-bottom: 1px solid var(--n2); }
.aide-onglets button { flex: 1; min-height: 44px; border: 0; background: transparent; font-weight: 650; cursor: pointer; border-bottom: 3px solid transparent; color: var(--n5); }
.aide-onglets button[aria-selected=true] { color: var(--bleu-ink); border-bottom-color: var(--bleu); }
.aide-corps { flex: 1 1 auto; min-height: 0; overflow: auto; padding: 10px 12px; }
.fn-carte { border: 1px solid var(--n2); border-radius: 10px; padding: 8px 10px; margin-bottom: 8px; background: var(--surface); }
.fn-carte.rel { border-color: var(--bleu-line); background: var(--bleu-soft); }
.fn-carte b { color: var(--bleu-ink); }
.fn-carte code { display: block; margin-top: 4px; white-space: pre-wrap; }
.fn-carte .rem { font-size: .78rem; color: var(--n5); margin-top: 4px; }
.fiche-nav { display: flex; gap: 6px; align-items: center; margin-bottom: 8px; }
.fiche-nav select { flex: 1; min-height: 44px; border-radius: 8px; border: 1px solid var(--n3); padding: 0 8px; background: var(--surface); font: inherit; min-width: 0; }
.indices { border-top: 1px solid var(--n2); padding: 8px 12px 10px; background: var(--n0); }
.indices h3 { font-size: .78rem; text-transform: uppercase; letter-spacing: .05em; color: var(--n5); margin-bottom: 6px; display: flex; justify-content: space-between; }
.indices-btns { display: flex; gap: 6px; }
.indices-btns .btn { flex: 1; padding: 0 6px; font-size: .8rem; flex-direction: column; gap: 0; line-height: 1.15; }
.indices-btns .btn small { font-weight: 500; opacity: .8; }
.indice-texte { margin-top: 8px; max-height: 110px; overflow: auto; font-size: .84rem; }
.indice-texte .un { border-inline-start: 3px solid var(--or); padding: 2px 0 2px 8px; margin-bottom: 6px; }

/* ---------- Fenêtre de résultat ---------- */
.voile { position: fixed; top: 0; right: 0; bottom: 0; left: 0; inset: 0; background: rgba(15,27,60,.5); display: none; align-items: center; justify-content: center; padding: 12px; z-index: 100; }
.voile.ouvert { display: flex; }
.fenetre { width: min(560px, 100%); max-height: calc(100dvh - 24px); display: flex; flex-direction: column; background: var(--surface); border-radius: 16px; box-shadow: 0 24px 48px rgba(15,27,60,.3); overflow: hidden; }
.fenetre header { padding: 14px 16px 10px; display: flex; gap: 12px; align-items: center; }
.fenetre .corps-f { padding: 0 16px 8px; overflow: auto; min-height: 0; }
.fenetre footer { padding: 10px 16px 14px; display: flex; gap: 8px; justify-content: flex-end; flex-wrap: wrap; }
.anneau { --p: 0; width: 64px; height: 64px; border-radius: 50%; background: var(--n2); background: conic-gradient(var(--c, var(--bleu)) calc(var(--p) * 1%), var(--n2) 0); display: grid; place-items: center; flex: none; }
.anneau span { width: 48px; height: 48px; border-radius: 50%; background: var(--surface); display: grid; place-items: center; font-weight: 800; font-size: .95rem; }
.retours { list-style: none; margin: 0; padding: 0; }
.retours li { display: flex; gap: 8px; align-items: flex-start; padding: 6px 0; border-bottom: 1px solid var(--n1); font-size: .86rem; margin: 0; }
.retours .b { flex: none; width: 22px; height: 22px; border-radius: 50%; display: grid; place-items: center; color: #fff; font-weight: 800; font-size: .8rem; }
.retours .b.ok { background: var(--ok); } .retours .b.ko { background: var(--ko); }
.attendus { background: var(--warn-soft); border-radius: 8px; padding: 8px 10px; font-size: .84rem; margin-top: 8px; }
.etoiles { display: inline-flex; gap: 2px; } .etoiles svg { width: 22px; height: 22px; } .etoiles .plein { fill: var(--or); stroke: #B8860B; } .etoiles .creux { fill: var(--n1); stroke: var(--n3); }
.etoiles.grand svg { width: 40px; height: 40px; }

/* ---------- Accueil, bilan, formateur ---------- */
.accueil { height: 100%; display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); gap: 12px; }
.heros { padding: 20px 22px; display: flex; flex-direction: column; gap: 10px; background: linear-gradient(160deg, #0B5FFF 0%, #0A3FA8 100%); color: #fff; border: 0; overflow: hidden; }
.heros h1 { font-size: clamp(1.25rem, 1rem + 1.2vw, 1.9rem); color: #fff; }
.heros p { color: #E2EBFF; } .heros .kicker { color: #BFD3FF; }
.heros .badge-niveau { margin-top: auto; background: rgba(255,255,255,.14); border-radius: 14px; padding: 10px 14px; display: flex; align-items: center; gap: 12px; }
.heros .btn.prim { background: #fff; color: var(--bleu-ink); border-color: #fff; }
.liste-ex { display: grid; grid-template-rows: repeat(4, minmax(0, 1fr)); gap: 8px; min-height: 0; }
.ex-carte { display: flex; align-items: center; gap: 12px; padding: 8px 14px; text-decoration: none; color: inherit; min-height: 56px; }
.ex-carte:hover { border-color: var(--bleu); }
.ex-num { width: 40px; height: 40px; border-radius: 10px; background: var(--bleu-soft); color: var(--bleu-ink); display: grid; place-items: center; font-weight: 800; flex: none; }
.ex-carte .t { min-width: 0; flex: 1; } .ex-carte .t b { display: block; font-size: .95rem; } .ex-carte .t span { font-size: .78rem; color: var(--n5); }
.bilan { height: 100%; display: grid; grid-template-columns: 300px minmax(0, 1fr); gap: 12px; }
.bilan-gauche { padding: 18px; display: flex; flex-direction: column; align-items: center; gap: 10px; text-align: center; }
.bilan-droite { padding: 14px 16px; display: flex; flex-direction: column; min-height: 0; }
.tableau-cadre { flex: 1 1 auto; min-height: 0; overflow: auto; border: 1px solid var(--n2); border-radius: 10px; }
table.tab { border-collapse: collapse; width: 100%; font-size: .85rem; }
.tab th, .tab td { padding: 8px 10px; border-bottom: 1px solid var(--n1); text-align: start; white-space: nowrap; }
.tab thead th { position: sticky; top: 0; background: var(--n1); font-size: .74rem; text-transform: uppercase; letter-spacing: .04em; color: var(--n7); z-index: 1; }
.tab td.c, .tab th.c { text-align: center; }
.tab tr.moi td { background: var(--bleu-soft); font-weight: 600; }
.puce { display: inline-block; padding: 2px 9px; border-radius: 999px; font-size: .74rem; font-weight: 700; }
.puce.ok { background: var(--ok-soft); color: var(--ok); } .puce.cours { background: var(--warn-soft); color: var(--warn); } .puce.non { background: var(--n1); color: var(--n5); } .puce.ko { background: var(--ko-soft); color: var(--ko); }
.kpis { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; margin-bottom: 10px; }
.kpi { padding: 10px 14px; } .kpi b { display: block; font-size: 1.35rem; } .kpi span { font-size: .76rem; color: var(--n5); }
.barre { height: 8px; border-radius: 99px; background: var(--n1); overflow: hidden; margin-top: 6px; } .barre i { display: block; height: 100%; background: var(--bleu); }
.formateur { height: 100%; display: flex; flex-direction: column; min-height: 0; }
.formateur .tableau-cadre { background: var(--surface); }
.barre-outils { display: flex; gap: 8px; align-items: center; margin-bottom: 10px; flex-wrap: wrap; }
.nom-champ { min-height: 44px; border: 1px solid var(--n3); border-radius: 10px; padding: 0 12px; font: inherit; min-width: 0; width: 100%; }

/* ---------- Grand écran moyen : 2 colonnes, aide en tiroir ---------- */
.btn-aide { display: none; }
@media (max-width: 1179px) and (min-width: 761px) and (min-height: 561px) {
  .kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* ---------- Mode onglets : téléphone (portrait) et paysage bas ---------- */
@media (max-width: 760px), (max-height: 560px) {
  :root { --row: 34px; }
  .tabsbar { display: flex; gap: 4px; }
  .tabsbar button { min-height: 44px; padding: 0 12px; border: 1px solid var(--n3); border-radius: 10px; background: var(--surface); font-weight: 650; cursor: pointer; }
  .tabsbar button[aria-selected=true] { background: var(--bleu); border-color: var(--bleu); color: #fff; }
  .corps { padding: 6px; }
  .btn-aide { display: none; }
  .touches { display: flex; }
  .accueil, .bilan { grid-template-columns: 1fr; grid-template-rows: auto minmax(0, 1fr); }
  .kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 760px) {
  .top { height: auto; flex-wrap: wrap; padding: 6px 8px; gap: 6px; }
  .page { --top: 100px; }
  .marque small, .marque span.nom { display: none; }
  .tabsbar { order: 10; width: 100%; } .tabsbar button { flex: 1; }
  .chip-ex { min-width: 44px; }

  .etiq-maq { display: none; }
}
@media (max-height: 560px) {
  .top { --top: 52px; height: 52px; padding: 0 8px; gap: 6px; }
  .tabsbar button { padding: 0 10px; }
  .touches { display: none; }
  .enonce-corps { padding: 8px 12px; }
  .formule { padding: 3px 8px; } .formule .nom, .formule input, .formule .btn { min-height: 32px; }
  .pied-feuille { padding: 3px 8px; flex-wrap: nowrap; } .onglets-feuilles { padding: 2px 6px 0; }
  .btn { min-height: 44px; }
  .accueil { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); grid-template-rows: none; }
  .heros { padding: 12px 14px; gap: 6px; } .heros p.long { display: none; }
  .ex-carte { padding: 4px 10px; min-height: 44px; } .ex-num { width: 32px; height: 32px; }
  .bilan { grid-template-columns: 220px minmax(0, 1fr); grid-template-rows: none; } .bilan-gauche { padding: 8px; gap: 4px; }
  .kpis { grid-template-columns: repeat(4, minmax(0, 1fr)); margin-bottom: 6px; } .kpi { padding: 4px 8px; } .kpi b { font-size: 1rem; }
}
@media (max-width: 760px) and (min-height: 561px) {
  .heros { padding: 12px 14px; gap: 6px; } .heros p.long { display: none; }
  .liste-ex { gap: 6px; } .ex-carte { padding: 4px 10px; }
  .bilan-gauche { padding: 10px; gap: 6px; flex-direction: row; flex-wrap: wrap; justify-content: center; }
  .kpi span { font-size: .7rem; } .kpi b { font-size: 1.1rem; } .kpi { padding: 6px 8px; }
}

/* ---------- Impression du bilan ---------- */
@media print {
  @page { size: A4 portrait; margin: 14mm; }
  html, body { height: auto; overflow: visible; background: #fff; }
  .top, .no-print, .tabsbar { display: none !important; }
  .page { height: auto; display: block; } .corps { padding: 0; }
  .bilan { display: block; height: auto; } .carte { box-shadow: none; border: 1px solid #999; margin-bottom: 10px; }
  .tableau-cadre { overflow: visible; border: 0; }
  .imprimer-entete { display: block !important; }
}
.imprimer-entete { display: none; margin-bottom: 8px; }
@media (prefers-reduced-motion: reduce) { * { transition: none !important; } }

/* ---------- Compléments ---------- */
.puce.doux { background: var(--bleu-soft); color: var(--bleu-ink); }
.aide-x { display: none; }
@media (max-width: 1179px) and (min-width: 761px) and (min-height: 561px) { .aide-x { display: block; } }
@media (max-width: 760px), (max-height: 560px) {
  .formateur .taux, .formateur .rare, .formateur .grp, .formateur .erreurs { display: none; }
  .barre-outils { margin-bottom: 6px; } .barre-outils h1 { font-size: .95rem; }
  .barre-outils .etiq-maq { display: none; }
  .tab th, .tab td { padding: 5px 8px; }
}
@media (max-width: 760px) { .top .chips .btn.mini { padding: 0 8px; min-width: 44px; } .zones .zone > header h1 { font-size: 1rem; } .tab td.c .petit { display: none; } }
.tab td.c .etoiles svg { width: 16px; height: 16px; }
.feuilles-hero { list-style: none; margin: 8px 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 6px; }
.feuilles-hero li { margin: 0; padding: 4px 10px; border-radius: 8px; background: rgba(255,255,255,.14); font: 500 .74rem var(--f-mono); }
@media (max-height: 560px), (max-width: 760px) { .heros .long { display: none; } }
.onglets-feuilles button { line-height: 1.8; }

/* ---------- Ajustements : cibles 44 px, bilan, paysage bas ---------- */
.cible-lien { min-height: 44px; }
.points button { width: 44px; }
.formule { padding: 6px 8px; }
.formule .nom, .formule input, .formule .btn { min-height: 44px; }
.formule .btn { min-width: 44px; }
.bilan > *, .accueil > *, .zones > * { min-width: 0; }
#zFeuille { position: relative; }
#statut:empty { display: none; }
.pied-feuille #statut { flex-basis: 100%; }
@media (max-width: 760px) {
  #bMsg, #bSeuils, #lienDemo { display: none; }
  .bilan-gauche .etoiles.grand svg { width: 30px; height: 30px; }
  .bilan-gauche h1 { font-size: 1.15rem !important; } #bTotal { font-size: 1.3rem !important; }
  .bilan-gauche > * { margin: 0; } .bilan-gauche { gap: 6px; }
}
@media (max-height: 560px) {
  .formule { padding: 3px 8px; }
  .formule .nom, .formule input, .formule .btn { min-height: 44px; }
  .bas-wrap { display: flex; align-items: center; border-top: 1px solid var(--n2); background: var(--n1); }
  .bas-wrap .onglets-feuilles { flex: 1 1 auto; min-width: 0; border-top: 0; }
  .bas-wrap .pied-feuille { flex: none; border-top: 0; padding: 0 6px; gap: 4px; flex-wrap: nowrap; background: transparent; }
  .pied-feuille .lib:not(.vf), .pied-feuille .progres { display: none; }
  .pied-feuille .btn { padding: 0 12px; }
  .pied-feuille #statut { position: absolute; inset-inline: 8px; bottom: 52px; padding: 6px 10px; background: var(--surface); border: 1px solid var(--n3); border-radius: 8px; box-shadow: var(--sh); z-index: 6; flex: none; pointer-events: none; }
  #bMsg, #bSeuils, #lienDemo, .bilan-gauche label { display: none; }
  .bilan-gauche .etoiles.grand svg { width: 28px; height: 28px; } .bilan-gauche h1 { font-size: 1.1rem !important; } #bTotal { font-size: 1.3rem !important; }
  .bilan-gauche .no-print { flex-direction: column; width: 100%; } .bilan-gauche .no-print .btn { width: 100%; padding: 0 8px; }
}
#enNum { white-space: nowrap; }
.tab td:first-child { white-space: normal; min-width: 150px; }
@media (max-width: 760px), (max-height: 560px) { .tab .opt { display: none; } }
@media (max-width: 760px) { .top nav .btn.mini:nth-child(2), .top nav .btn.mini:nth-child(4) { display: none; } .lang summary { padding: 0 8px; gap: 6px; } }

/* ---------- Zones : contenu des trois zones (énoncé, indications, moteur) ---------- */
.enonce-corps { padding: 8px 14px; font-size: .92rem; line-height: 1.45; }
.enonce-corps h2 { font-size: .98rem; margin-bottom: 4px; }
.enonce-corps p { margin-bottom: .4em; } .enonce-corps li { margin-bottom: .1em; }
.cibles { display: flex; align-items: center; gap: 8px; padding: 2px 10px; border-top: 1px solid var(--n2); background: var(--n0); overflow-x: auto; flex: none; scrollbar-width: thin; }
.cibles-t { font: 650 .72rem var(--f-mono); text-transform: uppercase; letter-spacing: .05em; color: var(--n5); white-space: nowrap; }
.cibles-liste { display: flex; flex-wrap: nowrap; gap: 6px; }
.cible-lien { white-space: nowrap; background: var(--surface); color: var(--bleu-ink); }
.zone[data-zone=indication] .aide-onglets { border: 0; margin-inline-start: auto; gap: 2px; }
.zone[data-zone=indication] .aide-onglets button { flex: none; padding: 0 12px; border-bottom-width: 3px; color: var(--z-indic-ink); }
.zone[data-zone=indication] .aide-onglets button[aria-selected=true] { border-bottom-color: var(--z-indic); color: var(--ink); }
.indic-cols { flex-direction: row; }
.indic-cols .aide-corps { flex: 1 1 55%; min-width: 0; padding: 8px 10px; }
.indic-cols .indices { flex: 1 1 45%; min-width: 0; border-top: 0; border-inline-start: 1px solid var(--n2); display: flex; flex-direction: column; min-height: 0; }
.indic-cols .indice-texte { flex: 1 1 auto; max-height: none; min-height: 0; overflow: auto; }
.fn-carte { padding: 6px 8px; margin-bottom: 6px; }
.fn-carte.rel { background: var(--z-indic-soft); border-color: var(--z-indic); }
.fn-carte b { color: var(--z-indic-ink); }
@media (max-width: 760px), (max-height: 560px) {
  .indic-cols { flex-direction: column; } .indic-cols .indices { border-inline-start: 0; border-top: 1px solid var(--n2); flex: none; }
  .indic-cols .aide-corps { flex: 1 1 auto; } .indic-cols .indice-texte { max-height: 90px; flex: none; }
  .enonce-corps { font-size: .95rem; } .cibles { padding: 2px 8px; }
}
@media (max-height: 560px) { .indic-cols { flex-direction: row; } .indic-cols .indices { border-top: 0; border-inline-start: 1px solid var(--n2); flex: 1 1 45%; } .indic-cols .aide-corps { flex: 1 1 55%; } }
.zone-actions .petit { min-width: 38px; text-align: center; white-space: nowrap; }
.zone[data-zone=moteur] .formule { padding-top: 4px; padding-bottom: 4px; }
.enonce-corps { font-size: .88rem; line-height: 1.4; padding: 6px 14px; } .enonce-corps h2 { font-size: .92rem; margin-bottom: 2px; }
.enonce-corps .regle { padding: 5px 10px; margin-bottom: 4px; }
.enonce-corps ul, .enonce-corps ol { margin-bottom: .3em; } .enonce-corps p { margin-bottom: .3em; }
.indic-cols .indices { overflow: auto; }
.indices-btns .btn { min-height: 44px; }
@media (max-height: 560px) { .marque span.nom, .marque small, .etiq-maq { display: none; } .top { overflow: hidden; } }

/* ---------- Multiplateforme : tactile, clavier virtuel, Safari / Firefox, zoom, RTL ---------- */
button, a, summary, select, .grille-cadre { -webkit-tap-highlight-color: transparent; touch-action: manipulation; }
.grille-cadre { direction: ltr; overscroll-behavior: contain; -webkit-overflow-scrolling: touch; touch-action: pan-x pan-y; }
.enonce-corps, .aide-corps, .indices, .indice-texte, .tableau-cadre, .onglets-feuilles, .touches, .cibles, .fenetre .corps-f { overscroll-behavior: contain; -webkit-overflow-scrolling: touch; }
.top, .corps, .zones { -webkit-user-select: none; user-select: none; }
.zone input, .formule input, .nom-champ, .enonce-corps, .aide-corps, .indice-texte, .retours, .grille td { -webkit-user-select: text; user-select: text; }
.grille td { -webkit-user-select: none; user-select: none; }
.btn, .tabsbar button, .touches button { -webkit-appearance: none; appearance: none; }
input, select { -webkit-appearance: none; appearance: none; border-radius: 8px; }
select { background-image: none; padding-inline-end: 8px; }
/* iOS Safari zoome si un champ fait moins de 16 px : on force 16 px sur tactile et petits écrans */
@media (pointer: coarse), (max-width: 760px) { input, select, textarea, .formule input { font-size: 16px; } }
@supports (-webkit-touch-callout: none) { input, select, textarea, .formule input { font-size: 16px; } }
/* Repli Firefox : barres de défilement fines */
@supports (scrollbar-width: thin) { .grille-cadre, .aide-corps, .enonce-corps, .tableau-cadre { scrollbar-width: thin; } }
/* Zoom 200 % / très petites fenêtres : l'en-tête peut passer sur 2 lignes, jamais de défilement de page */
@media (max-width: 420px) { .top .chips { gap: 4px; } .chip-ex { min-width: 44px; } }
/* Écran très large : le contenu garde une largeur lisible, centrée */
@media (min-width: 1900px) { .corps { max-width: 2200px; margin-inline: auto; width: 100%; } }
@media (min-width: 1700px) and (min-height: 900px) { body { font-size: 15px; } }
@media (forced-colors: active) { .grille td.sel, .zone, .btn { border: 1px solid CanvasText; } }
@media (max-height: 640px) and (max-width: 760px) { .heros .petit, .heros .kicker { display: none; } .heros { padding: 10px 12px; } .ex-carte { min-height: 44px; padding: 2px 10px; } .heros .badge-niveau { padding: 6px 10px; } }

.cache { display: none !important; }
#fmtSel { flex: 1 1 auto; min-width: 0; min-height: 44px; border: 1px solid var(--n3); border-radius: 8px; padding: 0 10px; background: var(--surface); color: var(--ink); font: inherit; font-weight: 600; }