/* Espace patient Nathia (maquette v2) : téléphone d'abord, ordinateur ensuite.
   Couleurs, polices et composants repris de la maquette (v2.css). */
:root{
  --teal:#0A4D5E; --teal-2:#0A3E4C; --mint:#57CEA6; --mint-ink:#0E8A61; --yellow:#FFFFAC; --sky:#ACEEFD; --cream:#FAECD2;
  --ink:#10292F; --text:#2A3F45; --muted:#5F7379; --faint:#8C9CA0; --line:#E9EDED; --line2:#DCE3E3; --soft:#F5F7F7; --soft2:#EDF2F2; --white:#FFFFFF;
  --font:'Plus Jakarta Sans', ui-sans-serif, system-ui, -apple-system, 'Segoe UI', sans-serif;
  color-scheme:light;
}
*{box-sizing:border-box;}
html, body{margin:0; height:100%;}
body{background:var(--white); color:var(--ink); font-family:var(--font); font-size:16px; line-height:1.55; -webkit-font-smoothing:antialiased;}
button{font:inherit; color:inherit; cursor:pointer;}
a{color:inherit;}
p{margin:0;}
h1,h2,h3,h4{margin:0;}
[hidden]{display:none !important;}
:focus-visible{outline:2px solid var(--teal); outline-offset:2px;}
.ic{width:20px; height:20px; flex:0 0 auto; fill:none; stroke:currentColor; stroke-width:1.75; stroke-linecap:round; stroke-linejoin:round;}
.sr{position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap;}

/* ------------------------------------------------------------------ châssis */
/* overflow: clip (et non hidden) : les formes décoratives débordent sans faire défiler l'écran. */
.app{min-height:100vh; min-height:100dvh; display:flex;}
.screen{flex:1; min-width:0; display:flex; flex-direction:column; height:100vh; height:100dvh; position:relative; overflow:hidden; overflow:clip; background:var(--white);}
.pbar{flex:0 0 auto; min-height:64px; display:flex; align-items:center; gap:8px; padding:8px 12px; position:relative; z-index:2; background:#fff;}
.pbar h1{flex:1; font-size:17px; font-weight:800; letter-spacing:-.01em;}
.pbar.conv{padding:8px 10px 8px 20px; border-bottom:1px solid var(--line);}
.pbar .who{flex:1; min-width:0;}
.pbar .who b{display:block; font-size:16px;}
.pbar .who small{display:block; font-size:12.5px; color:var(--muted); white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.pbar .stepn{flex:1; text-align:center; font-size:13.5px; font-weight:700; color:var(--muted); margin-right:40px;}
.pb{flex:1; overflow-y:auto; padding:18px 22px 22px; position:relative; -webkit-overflow-scrolling:touch;}
.pfoot{flex:0 0 auto; padding:12px 22px 18px; background:#fff; position:relative; z-index:1;}
.icb{width:42px; height:42px; border-radius:50%; border:0; background:transparent; display:grid; place-items:center; color:var(--ink); flex:0 0 auto;}
.icb:hover{background:var(--soft2);}
.icb .ic{width:22px; height:22px;}
.urg{flex:0 0 auto; text-align:center; font-size:12.5px; color:var(--muted); padding:2px 16px 14px; background:#fff;}
.urg .y, .y{display:inline-block; background:var(--yellow); color:var(--ink); border-radius:6px; padding:0 6px; font-weight:800;}
.urg a{color:inherit; text-decoration:none; white-space:nowrap;}
.shape{position:absolute; pointer-events:none; z-index:0;}
.q1{width:220px; height:220px; border-radius:0 0 0 100%; background:var(--cream); top:0; right:0;}
.q2{width:74px; height:74px; border-radius:50%; background:var(--sky); opacity:.55; right:-24px;}
.testnotice{margin:0 0 14px; padding:10px 14px; border-radius:14px; background:var(--yellow); color:var(--ink); font-size:13.5px; line-height:1.5;}

/* ------------------------------------------------------------------ texte et boutons */
.h1{font-size:27px; line-height:1.15; font-weight:800; letter-spacing:-.025em; color:var(--ink); text-wrap:balance;}
.h2{font-size:19px; line-height:1.3; font-weight:800; letter-spacing:-.012em;}
.sub1{font-size:15px; color:var(--muted); margin-top:8px;}
.fine{font-size:13.5px; color:var(--muted);}
.under{font-size:13px; color:var(--muted); text-align:center; margin-top:16px;}
.btn{display:inline-flex; align-items:center; justify-content:center; gap:8px; min-height:46px; padding:0 20px; border-radius:999px; border:1px solid var(--line2);
     background:#fff; color:var(--ink); font-size:15px; font-weight:700; text-decoration:none; text-align:center;}
.btn .ic{width:18px; height:18px;}
.btn:hover{border-color:#C6D1D2;}
.btn.pri{background:var(--teal); border-color:var(--teal); color:#fff;}
.btn.pri:hover{background:var(--teal-2);}
.btn.pri[disabled]{opacity:.45; cursor:default;}
.btn.lg{min-height:52px; font-size:15.5px;}
.btn.sm{min-height:36px; padding:0 15px; font-size:13.5px;}
.btn.soft{background:var(--soft); border-color:transparent;}
.btn.full{width:100%;}
.lnk{color:var(--teal); font-weight:700; text-decoration:underline; text-underline-offset:3px; text-decoration-thickness:1.5px;
     text-decoration-color:rgba(13,76,93,.35); background:none; border:0; padding:0; font-size:inherit;}
.lnk:hover{text-decoration-color:var(--teal);}
.lnk.mute{color:var(--muted); text-decoration-color:rgba(95,115,121,.35);}
.err{color:#A8432F; font-size:14px; font-weight:600; margin-top:12px;}
.opt{font-size:13px; font-weight:500; color:var(--faint); margin-left:3px;}

/* ------------------------------------------------------------------ arrivée, code, choix */
.brand{display:inline-flex; align-items:center; text-decoration:none; color:var(--teal);}
.logo{height:30px; width:auto; display:block;}
.hero{position:relative; z-index:1; padding-top:24px;}
.hero .h1{font-size:31px; line-height:1.12; margin-top:56px;}
.hero .h1 em{font-style:normal; color:var(--mint-ink);}
.doc{display:flex; align-items:center; gap:12px; margin-top:24px;}
.doc b{display:block; font-size:15px;} .doc small{display:block; font-size:13px; color:var(--muted);}
.av{width:36px; height:36px; border-radius:50%; background:var(--teal); color:#fff; font-size:12.5px; font-weight:800; display:grid; place-items:center; flex:0 0 auto; letter-spacing:.02em;}
.warn{list-style:none; padding:0; margin:28px 0 0; display:flex; flex-direction:column; gap:16px;}
.warn li{display:flex; gap:13px; font-size:15px; line-height:1.55; color:var(--text);}
.warn li .ic{width:22px; height:22px; color:var(--teal); margin-top:1px;}
.codein{display:flex; gap:8px; margin-top:30px;}
.codein .cd{width:46px; height:58px; border:0; border-radius:14px; background:#fff; box-shadow:inset 0 0 0 1.5px var(--line2); text-align:center;
            font:inherit; font-size:24px; font-weight:800; color:var(--ink); padding:0;}
.codein .cd:focus{outline:none; box-shadow:inset 0 0 0 2px var(--teal);}
.codein .gap{width:6px;}
.pick{display:flex; flex-direction:column; margin-top:26px;}
.pick button{display:flex; align-items:center; gap:14px; width:100%; padding:17px 4px; border:0; border-bottom:1px solid var(--line); background:transparent; text-align:left;}
.pick button:first-child{border-top:1px solid var(--line);}
.pick button:hover{background:#FAFBFB;}
.pick .tx{flex:1;}
.pick b{display:block; font-size:16.5px;}
.pick small{display:block; font-size:13.5px; color:var(--muted); margin-top:2px;}
.pick .ic{color:#A8B6B9;}
.pick button.quiet b{font-weight:600; color:var(--muted);}
.cal{margin-top:22px; max-width:360px;}
.cal .mh{display:flex; align-items:center; justify-content:space-between; margin-bottom:12px;}
.cal .mh b{font-size:16.5px;}
.cal .mh .icb{width:38px; height:38px; background:var(--soft);}
.cal .g{display:grid; grid-template-columns:repeat(7, 1fr); row-gap:6px; text-align:center;}
.cal .g span{font-size:12px; font-weight:700; color:var(--faint); padding:4px 0;}
.cal .g button{justify-self:center; width:42px; height:42px; padding:0; border:0; background:transparent; border-radius:50%; font-size:15px; font-weight:600; color:var(--ink); font-variant-numeric:tabular-nums;}
.cal .g button:hover{background:var(--soft);}
.cal .g button.sel{background:var(--teal); color:#fff; font-weight:800;}
.cal .g button.today{box-shadow:inset 0 0 0 1.5px var(--line2);}
.inline-note{margin-top:14px; padding:12px 14px; border-radius:14px; background:var(--soft); font-size:14px; color:var(--text);}

/* ------------------------------------------------------------------ conversation */
.thread{display:flex; flex-direction:column; gap:12px; padding:6px 0;}
.thread .bu, .thread .ba, .thread .bc{max-width:86%; padding:12px 16px; border-radius:20px; font-size:15.5px; line-height:1.55;
  overflow-wrap:anywhere; hyphens:auto; -webkit-hyphens:auto;}
.thread .bu{align-self:flex-end; background:#D3F4E6; color:var(--ink); border-bottom-right-radius:6px; white-space:pre-wrap;}
.thread .ba{align-self:flex-start; background:var(--soft); color:var(--text); border-bottom-left-radius:6px;}
.thread .bc{align-self:flex-start; background:#fff; box-shadow:inset 0 0 0 1.5px var(--teal); color:var(--text); border-bottom-left-radius:6px;}
.thread .ba p + p, .thread .ba p + .cl, .thread .ba .cl + p{margin-top:8px;}
/* Textes justifiés, avec coupure des mots pour éviter les grands blancs (choix de la maquette). */
.thread .ba, .thread .bc, .lecture p, .lecture li, .cgp p{text-align:justify; hyphens:auto; -webkit-hyphens:auto;}
.thread .who{font-size:12.5px; font-weight:700; color:var(--muted);}
.cl{margin:6px 0 0; padding-left:20px;}
.cl li{margin:4px 0; padding-left:2px;}
.cl li::marker{color:var(--faint);}
.src{align-self:flex-start; font-size:13.5px; font-weight:700; color:var(--teal); text-decoration:underline; text-underline-offset:3px;
     text-decoration-color:rgba(13,76,93,.35); margin:-4px 0 4px 6px; background:none; border:0; padding:0;}
.thread .acts{display:flex; flex-direction:column; gap:9px; align-self:stretch;}
.thread .acts .btn{width:100%; justify-content:flex-start; padding:0 18px;}
.note{display:flex; align-items:flex-start; gap:10px; align-self:center; max-width:94%; font-size:13.5px; color:var(--muted); font-weight:600; padding:6px 4px; text-align:center;}
.note .ic{width:17px; height:17px; color:var(--mint-ink); stroke-width:2.4; flex:0 0 auto; margin-top:2px;}
.empty{display:flex; flex-direction:column; align-items:center; text-align:center; gap:12px; padding:22px 12px;}
.empty > .ic{width:40px; height:40px; color:var(--teal); stroke-width:1.5;}
.empty b{font-size:19px; letter-spacing:-.01em;}
.empty p{font-size:15px; color:var(--muted);}
.sugg{display:flex; flex-direction:column; align-items:flex-start; gap:9px; margin-top:14px;}
.sugg button{border:0; background:#fff; box-shadow:inset 0 0 0 1.5px var(--line2); border-radius:999px; padding:10px 16px; font-size:14.5px; font-weight:700; color:var(--ink); text-align:left;}
.sugg button:hover{box-shadow:inset 0 0 0 1.5px var(--faint);}
.typing{display:inline-flex; gap:5px; align-items:center; min-height:22px;}
.typing i{width:7px; height:7px; border-radius:50%; background:var(--faint); animation:dot 1.2s infinite ease-in-out;}
.typing i:nth-child(2){animation-delay:.15s;} .typing i:nth-child(3){animation-delay:.3s;}
@keyframes dot{0%,80%,100%{opacity:.3; transform:translateY(0);} 40%{opacity:1; transform:translateY(-3px);}}
.cmp{display:flex; align-items:center; gap:8px; padding:10px 14px 8px; border-top:1px solid var(--line); background:#fff; flex:0 0 auto;}
.cmp .field{flex:1; min-width:0; height:48px; border-radius:999px; background:var(--soft); border:0; padding:0 18px; font:inherit; font-size:15.5px; color:var(--ink);}
.cmp .field::placeholder{color:#8A9A9E;}
.cmp .field:focus{outline:none; box-shadow:inset 0 0 0 2px var(--teal); background:#fff;}
.circ{width:46px; height:46px; border-radius:50%; border:0; background:var(--teal); color:#fff; display:grid; place-items:center; flex:0 0 auto;}
.circ[disabled]{opacity:.45; cursor:default;}
.circ .ic{width:21px; height:21px;}
.counter{text-align:right; font-size:12.5px; color:var(--muted); padding:0 20px;}
.devbox{align-self:stretch; margin-top:-4px; padding:10px 12px; border-radius:12px; border:1px dashed var(--line2); font-size:12.5px; color:var(--muted); line-height:1.5; overflow-wrap:anywhere;}
.devbox .devlab{display:inline-block; margin-bottom:4px; padding:1px 8px; border-radius:999px; background:var(--soft2); font-weight:800; color:var(--ink);}
.devbox .warn2{color:#8A5F1E;}
body.no-test .devbox{display:none;}

/* ------------------------------------------------------------------ menu, listes, réglages */
.sheet{position:fixed; inset:0; z-index:50; display:flex; flex-direction:column; justify-content:flex-end;}
.scrim{position:absolute; inset:0; background:rgba(16,41,47,.32); border:0;}
.sheet .in2{position:relative; background:#fff; border-radius:28px 28px 0 0; padding:12px 20px 22px; max-width:640px; width:100%; margin:0 auto;}
.grab{width:40px; height:5px; border-radius:5px; background:var(--line2); margin:0 auto 14px;}
.mrow{display:flex; align-items:center; gap:14px; width:100%; padding:16px 4px; border:0; border-bottom:1px solid var(--line); background:transparent; text-align:left; font-size:16.5px; font-weight:700;}
.mrow .ic{width:22px; height:22px; color:var(--teal);}
.mrow span{flex:1;}
.chev{width:18px; height:18px; color:#A8B6B9;}
.ls{border-top:1px solid var(--line);}
.li{display:flex; align-items:center; gap:16px; padding:16px 6px; border:0; border-bottom:1px solid var(--line); min-height:64px; text-align:left; width:100%; background:transparent;}
button.li:hover{background:#FAFBFB;}
.li .tx{flex:1; min-width:0;}
.li .t{display:block; font-size:15.5px; font-weight:700; color:var(--ink);}
.li .t.q{font-weight:600; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical;}
.li .m{display:block; font-size:13.5px; color:var(--muted); margin-top:4px;}
.li .r{display:flex; align-items:center; gap:12px; flex:0 0 auto;}
.li .when{font-size:13px; color:var(--muted); white-space:nowrap;}
.st{display:inline-flex; align-items:center; gap:7px; font-size:13.5px; font-weight:600; color:var(--muted); white-space:nowrap;}
.st::before{content:""; width:8px; height:8px; border-radius:50%; background:var(--mint); flex:0 0 auto;}
.set{display:flex; align-items:center; gap:16px; padding:16px 4px; border-bottom:1px solid var(--line); min-height:66px;}
.set .tx{flex:1; min-width:0;}
.set b{display:block; font-size:15px;}
.set small{display:block; font-size:13.5px; color:var(--muted); margin-top:2px; overflow-wrap:anywhere;}
.sw{width:46px; height:28px; border-radius:999px; border:0; background:#D3DCDD; position:relative; flex:0 0 auto; padding:0;}
.sw::after{content:""; position:absolute; left:3px; top:3px; width:22px; height:22px; border-radius:50%; background:#fff; box-shadow:0 1px 2px rgba(0,0,0,.15); transition:left .15s;}
.sw[aria-pressed="true"]{background:var(--mint);}
.sw[aria-pressed="true"]::after{left:21px;}
.form{display:flex; flex-direction:column; gap:18px;}
.fld{display:flex; flex-direction:column; gap:8px;}
.fld > span{font-size:14px; font-weight:700; color:var(--ink);}
.fld > small{font-size:13px; color:var(--muted);}
.in, .ta{font:inherit; font-size:16px; color:var(--ink); background:#fff; border:1px solid var(--line2); border-radius:12px; width:100%;}
.in{height:48px; padding:0 15px;}
.ta{padding:13px 15px; min-height:110px; resize:vertical; line-height:1.6;}
.in:focus, .ta:focus{outline:none; border-color:var(--teal); box-shadow:0 0 0 3px rgba(13,76,93,.12);}
.inline-edit{display:flex; gap:8px; margin-top:10px; flex-wrap:wrap;}
.inline-edit .in{flex:1; min-width:200px;}

/* ------------------------------------------------------------------ pages d'information */
.cgp section{display:flex; gap:14px; padding:18px 0; border-top:1px solid var(--line);}
.cgp .cgurg + section{border-top:0;}
.cgp .cgi{flex:0 0 auto; width:38px; height:38px; border-radius:50%; background:var(--soft2); display:grid; place-items:center; color:var(--teal);}
.cgp .cgi .ic{width:18px; height:18px;}
.cgp h2{font-size:16px; font-weight:800; margin:8px 0 5px;}
.cgp p{font-size:15px; line-height:1.65; color:var(--text);}
.cgp section.ccm{display:block; padding:22px 0;}
.ccm p{margin-top:4px;}
.ccm .warn{margin-top:16px; gap:12px;}
.ccm .warn li{font-size:14.5px;}
.ccm .warn li .ic{width:19px; height:19px;}
.ccm .warn li .ic.no{color:#B9853A;}
.cgmeta{display:flex; align-items:center; justify-content:space-between; gap:10px; font-size:13.5px; color:var(--muted); margin:4px 0 14px;}
.pill{display:inline-flex; align-items:center; gap:6px; height:28px; padding:0 12px; border-radius:999px; font-size:13px; font-weight:700; background:var(--soft2); color:var(--ink); white-space:nowrap;}
.pill.y{background:var(--yellow);}
.cgurg{display:flex; gap:12px; align-items:flex-start; padding:15px 16px; border-radius:18px; background:#FCFBE3; box-shadow:inset 0 0 0 1px #ECE79B; margin-bottom:6px;}
.cgurg > .ic{flex:0 0 auto; width:20px; height:20px; margin-top:2px; color:var(--ink);}
.cgurg b{display:block; font-size:15.5px; color:var(--ink);}
.cgurg > div > span{display:block; margin-top:3px; font-size:14px; line-height:1.5; color:var(--text);}

/* ------------------------------------------------------------------ les consignes complètes */
.chipbar{display:flex; gap:8px; overflow-x:auto; padding:2px 22px 12px; flex:0 0 auto; border-bottom:1px solid var(--line); scrollbar-width:none;}
.chipbar::-webkit-scrollbar{height:0;}
.chipbar button{flex:0 0 auto; height:36px; padding:0 14px; border-radius:999px; border:0; background:var(--soft); font-size:13.5px; font-weight:700; color:var(--muted);}
.chipbar button[aria-current="true"]{background:var(--teal); color:#fff;}
.lecture .chap{padding-top:34px; scroll-margin-top:12px;}
.lecture .chap:first-child{padding-top:6px;}
.cht{display:flex; align-items:center; gap:12px; font-size:21px; font-weight:800; letter-spacing:-.02em; margin-bottom:8px;}
.cht i{width:30px; height:30px; border-radius:50%; background:var(--teal); color:#fff; font-style:normal; font-size:14px; display:grid; place-items:center; flex:0 0 auto;}
.pt{font-size:16px; font-weight:800; color:var(--ink); margin:24px 0 10px;}
.lecture p, .lecture li{font-size:15.5px; line-height:1.75; color:var(--text); max-width:68ch;}
.lecture .cs{border-radius:4px; scroll-margin-top:90px;}
.lecture .cs + .cs{margin-top:12px;}
.lecture .cs.item{margin-top:2px; padding-left:20px; position:relative;}
.lecture .cs.item::before{content:"•"; position:absolute; left:6px; color:var(--faint);}
.cs.cs-on{animation:surligne 3.2s ease-out 1;}
@keyframes surligne{0%,45%{background:#FBF6B8; box-shadow:0 0 0 8px #FBF6B8;} 100%{background:rgba(251,246,184,0); box-shadow:0 0 0 8px rgba(251,246,184,0);}}
.ask{margin-top:34px; padding:20px; border-radius:18px; background:#F2FBF7; font-size:15px;}
.ask b{display:block; margin-bottom:6px;}
.loading{padding:30px 0; color:var(--muted); font-size:14.5px;}

/* ------------------------------------------------------------------ ordinateur */
.nav{display:none;}
@media (min-width: 960px){
  .app.with-nav .nav{display:flex; flex:0 0 264px; width:264px; height:100vh; height:100dvh; background:#F7F9F9; border-right:1px solid var(--line);
       padding:22px 14px 16px; flex-direction:column; overflow-y:auto; position:sticky; top:0;}
  .nav .brand{padding:4px 10px; margin-bottom:22px;}
  .nav .logo{height:27px;}
  .who2{padding:0 10px; margin:-6px 0 22px;}
  .who2 b{display:block; font-size:14.5px;}
  .who2 small{display:block; font-size:13px; color:var(--muted);}
  .newp{display:flex; align-items:center; justify-content:center; gap:8px; height:44px; border:0; border-radius:12px; background:var(--teal); color:#fff; font-size:14.5px; font-weight:700; margin-bottom:22px;}
  .newp .ic{width:18px; height:18px; stroke-width:2.2;}
  .nlist{display:flex; flex-direction:column; gap:2px;}
  .ni{display:flex; align-items:center; gap:11px; height:40px; padding:0 10px; border:0; background:transparent; border-radius:10px; font-size:14.5px; font-weight:600; color:#4C6167; text-align:left; width:100%;}
  .ni .ic{width:19px; height:19px; opacity:.75;}
  .ni:hover{background:#EEF2F2;}
  .ni.on{background:#E7EEEE; color:var(--ink);} .ni.on .ic{opacity:1; color:var(--teal);}
  .chaps{display:flex; flex-direction:column; gap:1px; margin:3px 0 5px;}
  .ci{display:flex; align-items:center; gap:9px; min-height:30px; padding:0 10px 0 40px; border:0; background:transparent; border-radius:9px; font-size:13px; font-weight:600; color:var(--muted); text-align:left; width:100%;}
  .ci i{width:16px; height:16px; border-radius:50%; box-shadow:inset 0 0 0 1.4px #C4CFD1; font-style:normal; font-size:9.5px; font-weight:800; display:grid; place-items:center; color:var(--faint); flex:0 0 auto;}
  .ci:hover{color:var(--ink);}
  .ci[aria-current="true"]{color:var(--ink); background:#E7EEEE;}
  .ci[aria-current="true"] i{background:var(--teal); box-shadow:none; color:#fff;}
  .grow{flex:1; min-height:20px;}
  .navfoot{font-size:12.5px; color:var(--muted); padding:0 10px;}

  /* écrans d'arrivée : une colonne centrée, le bouton sous le contenu */
  .screen.solo{justify-content:center;}
  .screen.solo .pb{flex:0 1 auto;}
  .screen.solo .pb, .screen.solo .pfoot, .screen.solo .pbar{width:100%; max-width:480px; margin:0 auto;}
  .screen.solo .pbar{padding-left:0; padding-right:0;}
  .screen.solo .q1{width:340px; height:340px;}

  /* écrans de l'application : la barre du téléphone laisse la place au menu de gauche */
  .app.with-nav .pbar.conv{display:none;}
  .app.with-nav .screen.wide .pb{padding:34px 0 20px;}
  .app.with-nav .screen.wide .col{width:min(680px, calc(100% - 64px)); margin:0 auto;}
  .app.with-nav .screen.wide .cmp{border-top:0; padding:0; width:min(680px, calc(100% - 64px)); margin:0 auto;}
  .app.with-nav .screen.wide .cmpw{border-top:1px solid var(--line); padding:14px 0 0;}
  .app.with-nav .screen.wide .urg{padding:10px 0 14px;}
  .thread .bu, .thread .ba, .thread .bc{max-width:78%;}
  .app.with-nav .screen.page .pb{padding:40px 0 60px;}
  .app.with-nav .screen.page .col{width:min(780px, calc(100% - 96px)); margin:0 auto;}
  .app.with-nav .screen.page .chipbar{display:none;}
  .app.with-nav .screen.page .pbar .icb.back{display:none;}
  .app.with-nav .screen.page .pbar{padding-left:max(48px, calc((100% - 780px) / 2)); border-bottom:1px solid var(--line);}
  .lecture p, .lecture li{font-size:16px; line-height:1.8;}
  .cht{font-size:23px;} .cht i{width:34px; height:34px; font-size:15px;}
  .sheet{display:none;}
}

/* ------------------------------------------------------------------ la dictée (lot 9, P13, réduit le 29/10) */
.cmp .circ.ghost{background:var(--soft2); color:var(--ink);}
.cmp .circ.ghost.rec{background:#FBE3E3; color:#B3261E; animation:vpulse 1.6s ease-in-out infinite;}
.counter.dict{color:var(--muted);}
@keyframes vpulse{0%,100%{transform:scale(1);} 50%{transform:scale(.92);}}
@media (prefers-reduced-motion: reduce){
  .cmp .circ.ghost.rec{animation:none;}
}