/* L'attention — styles. Préfixe att- partout ; les règles de l'app gagnent contre une classe seule, donc
   spécificité montée (#ec-attention …, .att-sc …) et propriétés redites. Aucune ombre portée. */

/* ---------- onglet dans Respirer (4 au lieu de 3) ---------- */
.onglets-respirer.att-4{grid-template-columns:repeat(4,minmax(0,1fr))}
.onglets-respirer.att-4 button{font-size:.8rem;padding:10px 2px;line-height:1.15;white-space:normal}
.onglets-respirer.att-4 .onglet-neuf{display:none !important}
.onglets-respirer .att-point{display:inline-block;width:7px;height:7px;border-radius:50%;background:#E64DFF;margin-left:4px;vertical-align:2px}
.onglets-respirer .att-point[hidden]{display:none !important}

/* ---------- la page (suit l'ambiance de l'app) ---------- */
#ec-attention .att-page{padding-top:0}
#ec-attention .att-tete{margin:6px 2px 14px}
#ec-attention .att-titre{font-family:'Newsreader',Georgia,serif;font-weight:300;font-size:2.1rem;line-height:1.05;letter-spacing:-.01em;margin:0;color:var(--encre)}
#ec-attention .att-sous{font-family:'Newsreader',Georgia,serif;font-style:italic;font-weight:300;font-size:1.05rem;color:var(--encre-douce);margin:6px 0 0}
#ec-attention .att-lab,.att-sc .att-lab{display:block;font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;font-weight:600;margin:0 0 5px;color:var(--encre-douce)}
#ec-attention .att-sugg{position:relative;display:block;width:100%;text-align:left;border:1.5px solid var(--c,var(--sauge));background:var(--voile);color:var(--encre);border-radius:22px;padding:16px 44px 16px 18px;margin:0 0 16px;cursor:pointer;font:inherit}
#ec-attention .att-sugg b{display:block;font-family:'Newsreader',Georgia,serif;font-weight:400;font-size:1.2rem;line-height:1.25}
#ec-attention .att-sugg-t{display:block;font-size:.88rem;color:var(--encre-douce);margin-top:4px;line-height:1.4}
#ec-attention .att-fl,.att-sc .att-fl{position:absolute;right:18px;top:50%;transform:translateY(-50%);font-size:1.7rem;line-height:1;color:var(--c,var(--sauge))}
#ec-attention .att-filtres{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;margin:0 -20px 6px;padding:2px 20px 8px;-webkit-overflow-scrolling:touch}
#ec-attention .att-filtres::-webkit-scrollbar{display:none}
#ec-attention .att-filtres button{flex:none;border:1px solid var(--trait);background:var(--voile);color:var(--encre);border-radius:999px;padding:8px 14px;font-family:'Karla',sans-serif;font-size:.85rem;font-weight:600;white-space:nowrap;cursor:pointer}
#ec-attention .att-filtres button[aria-selected="true"]{background:var(--sauge);border-color:var(--sauge);color:#fff}
#ec-attention .att-fam{margin:18px 0 6px}
#ec-attention .att-fam-t{display:flex;align-items:center;gap:9px;font-family:'Karla',sans-serif;font-size:.78rem;letter-spacing:.14em;text-transform:uppercase;font-weight:600;color:var(--encre-douce);margin:0 2px 2px}
#ec-attention .att-fam-t i{width:9px;height:9px;border-radius:50%;flex:none}
#ec-attention .att-fam-t span{margin-left:auto;letter-spacing:0;font-weight:500;opacity:.8}
#ec-attention .att-fam-p{font-family:'Newsreader',Georgia,serif;font-style:italic;font-weight:300;font-size:.98rem;color:var(--encre-douce);margin:2px 2px 6px;line-height:1.35}
#ec-attention .att-ex{display:flex;align-items:center;gap:14px;width:100%;text-align:left;background:none;border:0;border-bottom:1px solid var(--trait);border-radius:0;padding:12px 2px;color:var(--encre);font:inherit;cursor:pointer}
#ec-attention .att-ex:active{opacity:.7}
#ec-attention .att-ico{width:44px;height:44px;flex:none;border-radius:14px;display:grid;place-items:center;background:var(--voile);border:1px solid var(--trait)}
#ec-attention .att-txt{flex:1;min-width:0}
#ec-attention .att-txt b{display:block;font-family:'Newsreader',Georgia,serif;font-weight:400;font-size:1.12rem;line-height:1.25}
#ec-attention .att-txt span{display:block;font-size:.82rem;color:var(--encre-douce);line-height:1.35;margin-top:2px}
#ec-attention .att-etat{flex:none;display:grid;place-items:center;width:26px;color:var(--encre-douce)}
#ec-attention .att-chev{font-size:1.4rem;opacity:.5}
#ec-attention .att-verrou{opacity:.7}
#ec-attention .att-pied{text-align:center;font-size:.82rem;color:var(--encre-douce);margin:24px 10px 8px;line-height:1.5}

/* ---------- la scène (toujours de nuit, comme les respirations en plein écran) ---------- */
body.att-scene-ouverte{overflow:hidden}
body.att-scene-ouverte .vers-menu{display:none !important}
.att-sc{--a:#3DF5E6;--nuit:#170F29;--cr:#F2E9E4;--cr2:rgba(242,233,228,.66);--cr3:rgba(242,233,228,.45);--tr:rgba(242,233,228,.13);--vo:rgba(242,233,228,.05);
  position:fixed;inset:0;z-index:140;display:flex;flex-direction:column;color:var(--cr);font-family:'Karla',sans-serif;font-size:16px;line-height:1.5;
  background:radial-gradient(90% 50% at 70% 0,color-mix(in srgb,var(--a) 16%,transparent),transparent 70%),linear-gradient(180deg,#1E1433 0,#170F29 45%,#120B21 100%);
  animation:att-apparait .28s ease both;-webkit-tap-highlight-color:transparent}
.att-sc[hidden]{display:none !important}
@keyframes att-apparait{from{opacity:0}to{opacity:1}}
.att-sc *{box-sizing:border-box}
.att-sc h1,.att-sc h2,.att-sc h3,.att-sc h4{color:var(--cr) !important;text-shadow:none !important;text-transform:none !important;letter-spacing:normal}
.att-sc p,.att-sc li{color:var(--cr);text-shadow:none}
.att-sc .att-doux,.att-sc .att-st{color:var(--cr2)}.att-sc .att-note{color:var(--cr3)}
.att-sc button{font-family:inherit;-webkit-appearance:none;appearance:none}
.att-sc-haut{flex:none;display:flex;align-items:center;gap:10px;padding:calc(12px + env(safe-area-inset-top)) 18px 8px;min-height:56px}
.att-sc .att-retour{flex:none;display:inline-flex;align-items:center;gap:8px;border:1px solid var(--tr);background:var(--vo);color:var(--cr);border-radius:999px;padding:8px 15px 8px 12px;font-size:.9rem;font-weight:600;cursor:pointer}
.att-sc-fam{margin-left:auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;/* langue-v1 : un nom de famille long (de) ne fait plus déborder l'en-tête */font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;font-weight:600;color:var(--a)}
.att-sc-chrono{font-variant-numeric:tabular-nums;font-weight:600;font-size:.95rem;color:var(--cr2);min-width:0}
.att-sc-chrono:empty{display:none}
.att-sc[data-phase="exercice"] .att-sc-fam{display:none}
.att-sc[data-phase="exercice"] .att-sc-chrono{margin-left:auto}
.att-sc-corps{flex:1;min-height:0;overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;display:flex;flex-direction:column;width:100%;max-width:560px;margin:0 auto}
.att-sc .att-lab{color:var(--cr3)}
.att-sc .att-bas{flex:none;padding:12px 22px calc(22px + env(safe-area-inset-bottom));margin-top:auto}
.att-sc .att-note{text-align:center;font-size:.8rem;color:var(--cr3);margin:0 0 12px;line-height:1.45}
.att-sc .att-cta{display:flex;align-items:center;justify-content:center;width:100%;min-height:56px;border-radius:28px;font-size:1rem;font-weight:600;letter-spacing:.01em;cursor:pointer;border:0;padding:0 20px;text-align:center}
.att-sc .att-cta.plein{background:var(--a);color:#1B122F}
.att-sc .att-cta.ligne{background:transparent;border:1.5px solid var(--a);color:var(--cr)}
.att-sc .att-cta.nu{background:transparent;border:1px solid var(--tr);color:var(--cr2)}
.att-sc .att-cta:disabled{opacity:.4;cursor:default}
.att-sc .att-cta+.att-cta{margin-top:10px}
.att-sc .att-deux{display:flex;gap:10px}.att-sc .att-deux .att-cta{flex:1;margin:0}
.att-sc .att-chips{display:flex;flex-wrap:wrap;gap:8px}
.att-sc .att-chip{border:1px solid rgba(242,233,228,.18);background:rgba(242,233,228,.03);color:rgba(242,233,228,.85);border-radius:999px;padding:9px 15px;font-size:.88rem;font-weight:500;cursor:pointer;white-space:nowrap}
.att-sc .att-chip.on,.att-sc .att-chip[aria-pressed="true"]{background:var(--a);border-color:var(--a);color:#1B122F;font-weight:600}
.att-sc .att-carte{background:var(--vo);border:1px solid var(--tr);border-radius:22px;padding:16px 18px}
.att-sc .att-h{font-family:'Newsreader',Georgia,serif;font-weight:300;font-size:1.75rem;line-height:1.15;letter-spacing:-.01em;margin:0}
.att-sc .att-st{font-family:'Newsreader',Georgia,serif;font-style:italic;font-weight:300;font-size:1.05rem;color:var(--cr2);margin:6px 0 0;line-height:1.4}
.att-sc .att-consigne{font-family:'Newsreader',Georgia,serif;font-style:italic;font-weight:300;font-size:1.55rem;line-height:1.3;text-align:center;margin:0}
.att-sc .att-doux{font-size:.9rem;color:var(--cr2);line-height:1.5;margin:8px 0 0}
.att-sc .att-doux.centre,.att-sc .centre{text-align:center}
.att-sc .att-it{font-family:'Newsreader',Georgia,serif;font-style:italic;font-weight:300}
.att-sc .att-champ{display:block;width:100%;background:transparent;border:0;border-bottom:1px solid rgba(242,233,228,.24);color:var(--cr);font-family:'Karla',sans-serif;font-size:17px;line-height:1.45;padding:8px 0 10px;border-radius:0;outline:none;resize:none}
.att-sc .att-champ.it{font-family:'Newsreader',Georgia,serif;font-style:italic;font-weight:300;font-size:19px}
.att-sc .att-champ:focus{border-bottom-color:var(--a)}
.att-sc .att-champ::placeholder{color:rgba(242,233,228,.32)}
.att-sc input[type=range].att-reglette{-webkit-appearance:none;appearance:none;width:100%;height:28px;background:transparent;margin:0}
.att-sc input[type=range].att-reglette::-webkit-slider-runnable-track{height:6px;border-radius:3px;background:linear-gradient(90deg,var(--a) 0 var(--p,50%),rgba(242,233,228,.12) var(--p,50%) 100%)}
.att-sc input[type=range].att-reglette::-moz-range-track{height:6px;border-radius:3px;background:rgba(242,233,228,.12)}
.att-sc input[type=range].att-reglette::-moz-range-progress{height:6px;border-radius:3px;background:var(--a)}
.att-sc input[type=range].att-reglette::-webkit-slider-thumb{-webkit-appearance:none;width:26px;height:26px;border-radius:50%;background:#F2E9E4;margin-top:-10px;border:0}
.att-sc input[type=range].att-reglette::-moz-range-thumb{width:26px;height:26px;border-radius:50%;background:#F2E9E4;border:0}
.att-sc .att-stats{display:flex;justify-content:center;gap:28px;margin-top:22px}
.att-sc .att-stats div{text-align:center}
.att-sc .att-stats b{display:block;font-family:'Newsreader',Georgia,serif;font-weight:300;font-size:2.2rem;line-height:1}
.att-sc .att-stats span{font-size:.75rem;color:var(--cr3)}

/* entrée */
.att-sc .att-intro{position:relative;padding:18px 26px 8px}
.att-sc .att-halo{position:absolute;right:-70px;top:-50px;width:260px;height:260px;border-radius:50%;background:radial-gradient(circle,color-mix(in srgb,var(--a) 30%,transparent),transparent 70%);pointer-events:none}
.att-sc .att-h-intro{position:relative;font-family:'Newsreader',Georgia,serif;font-weight:300;font-size:2.55rem;line-height:1.04;letter-spacing:-.015em;margin:8px 0 0}
.att-sc .att-phrase{position:relative;font-family:'Newsreader',Georgia,serif;font-style:italic;font-weight:300;font-size:1.2rem;line-height:1.42;color:rgba(242,233,228,.82);margin:18px 0 0}
.att-sc .att-pour{margin-top:24px;border-top:1px solid var(--tr)}
.att-sc .att-pour>div{display:grid;grid-template-columns:100px 1fr;gap:6px;align-items:baseline;padding:11px 0;border-bottom:1px solid var(--tr);font-size:.93rem;line-height:1.45}
.att-sc .att-pour .att-lab{margin:0}
.att-sc .att-durees{margin-top:18px}
.att-sc .att-comment{margin-top:18px;border:1px solid var(--tr);border-radius:18px;padding:0 16px}
.att-sc .att-comment summary{cursor:pointer;padding:13px 0;font-weight:600;font-size:.92rem;color:var(--cr2);list-style:none}
.att-sc .att-comment summary::-webkit-details-marker{display:none}
.att-sc .att-comment summary::after{content:"+";float:right;color:var(--a);font-size:1.2rem;line-height:1}
.att-sc .att-comment[open] summary::after{content:"–"}
.att-sc .att-comment ol{margin:0 0 14px;padding-left:20px;color:var(--cr2);font-size:.92rem;line-height:1.5}
.att-sc .att-comment li{margin:0 0 7px}
.att-sc .att-deja{font-size:.82rem;color:var(--cr3);margin:14px 0 0}

/* déroulé */
.att-sc .att-stage{position:relative;flex:1;display:flex;flex-direction:column;min-height:100%;padding:0}
.att-sc .att-pad{padding:10px 22px 0}
.att-sc .att-vide{margin:auto;padding:30px;text-align:center}

/* fin */
.att-sc .att-fin{text-align:center;padding:40px 28px 0}
.att-sc .att-fin-ico{color:var(--a)}
.att-sc .att-h-fin{font-family:'Newsreader',Georgia,serif;font-weight:300;font-size:2.1rem;line-height:1.15;margin:18px 0 0}
.att-sc .att-fin-t{font-family:'Newsreader',Georgia,serif;font-style:italic;font-weight:300;font-size:1.18rem;line-height:1.45;color:rgba(242,233,228,.82);margin:12px auto 0;max-width:420px}
.att-sc .att-sugg{position:relative;display:block;width:100%;text-align:left;border:1px solid color-mix(in srgb,var(--a) 55%,transparent);background:var(--vo);color:var(--cr);border-radius:22px;padding:15px 44px 15px 18px;margin:30px 0 0;cursor:pointer;--c:var(--a)}
.att-sc .att-sugg b{display:block;font-family:'Newsreader',Georgia,serif;font-weight:400;font-size:1.1rem}
.att-sc .att-sugg .att-lab{color:var(--a)}

@media (prefers-reduced-motion: reduce){.att-sc,.att-sc *{animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important}}
@media (min-width:700px){.att-sc .att-h-intro{font-size:3rem}}

/* ---------- Communs (compte des souffles … lettre) : préfixe apx- ---------- */
.att-sc .apx{position:relative;flex:1;display:flex;flex-direction:column;min-height:100%}
.att-sc .apx [hidden]{display:none !important}
.att-sc .apx-reglages{position:relative;z-index:3;display:flex;flex-wrap:wrap;justify-content:center;gap:8px 10px;padding:2px 16px 0}
.att-sc .apx-reglages .att-chips{gap:6px;justify-content:center}
.att-sc .apx .att-chip{position:relative;padding:7px 13px;font-size:.8rem;line-height:1.2}
.att-sc .apx .att-chip::after{content:"";position:absolute;inset:-6px -3px}
.att-sc .apx-texte{position:relative;z-index:2;padding:0 24px;text-align:center}
.att-sc .apx-texte .att-consigne{font-size:1.4rem}
.att-sc .apx-texte .att-doux{margin-top:6px}
.att-sc .apx-compte{display:inline-flex;align-items:baseline;gap:8px;margin-top:12px;padding:9px 18px;border-radius:999px;border:1px solid rgba(242,233,228,.16);background:rgba(242,233,228,.05);font-size:.85rem;color:rgba(242,233,228,.72)}
.att-sc .apx-compte b{font-family:'Newsreader',Georgia,serif;font-weight:300;font-size:1.5rem;line-height:1;color:var(--cr)}
.att-sc .apx .att-bas{position:relative;z-index:2}
.att-sc .apx .att-pad{padding:8px 24px 0}
.att-sc .apx .att-lab{margin-top:18px}
.att-sc .apx .att-st{margin-bottom:16px}

/* ---------- Le compte des souffles ---------- */
.att-sc .sfl-scene{position:relative;flex:1;min-height:210px}
.att-sc .sfl-svg{position:absolute;inset:0;display:block}
.att-sc .sfl-centre{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);text-align:center;pointer-events:none}
.att-sc .sfl-n{display:block;font-family:'Newsreader',Georgia,serif;font-weight:300;font-size:4.6rem;line-height:1;color:var(--cr)}
.att-sc .sfl-lab{display:block;margin-top:4px;font-size:.9rem;color:var(--cr2)}
.att-sc .sfl-trace{fill:none;stroke:rgba(242,233,228,.08);stroke-width:1.5;transition:stroke .6s ease,stroke-opacity .6s ease}
.att-sc .sfl-svg.complet .sfl-trace{stroke:var(--a);stroke-opacity:.5}
.att-sc .sfl-pt{fill:rgba(242,233,228,.15);transform-box:fill-box;transform-origin:center;transition:fill .5s ease,transform .5s ease}
.att-sc .sfl-pt.on,.att-sc .sfl-svg.complet .sfl-pt{fill:var(--a);transform:scale(1.25)}
.att-sc .sfl-bilan{min-height:1.5em;margin:8px 0 0;font-size:.85rem;color:var(--cr3);text-align:center}
.att-sc .sfl .att-bas{padding-top:6px}
.att-sc .sfl .sfl-perdu{min-height:48px}

/* ---------- Le mta-ancre ---------- */
.att-sc .mta-choix .att-h{margin-top:6px}
.att-sc .mta-champ{max-width:320px}
.att-sc .mta-raide{min-height:3em}
.att-sc .mta-souffle{flex:1;display:flex;flex-direction:column;padding-bottom:4px}
.att-sc .mta-scene{flex:1;display:grid;place-items:center;min-height:250px;padding:10px 0}
.att-sc .mta-rond{position:relative;width:min(70vw,290px,40vh);aspect-ratio:1;display:grid;place-items:center;border-radius:50%;outline:none;touch-action:none;-webkit-user-select:none;user-select:none}
.att-sc .mta-rond.mien{cursor:pointer}
.att-sc .mta-rond:focus-visible{outline:2px solid var(--a);outline-offset:6px}
.att-sc .mta-halo{position:absolute;inset:-22%;border-radius:50%;background:radial-gradient(circle,rgba(242,179,107,.34) 0,rgba(242,179,107,.12) 42%,transparent 68%);pointer-events:none}
.att-sc .mta-anneau{position:absolute;inset:0;border-radius:50%;border:1.5px solid color-mix(in srgb,var(--a) 70%,transparent);pointer-events:none}
.att-sc .mta-disque{position:absolute;inset:9%;border-radius:50%;display:grid;place-items:center;border:1.5px solid color-mix(in srgb,var(--a) 38%,transparent);background:radial-gradient(circle at 50% 45%,rgba(242,179,107,.42) 0,rgba(166,110,80,.22) 45%,rgba(40,26,60,.3) 100%);will-change:transform}
.att-sc .mta-mot{font-family:'Newsreader',Georgia,serif;font-style:italic;font-weight:300;line-height:1.1;color:#FFF6EC;text-align:center;padding:0 12%;overflow-wrap:anywhere}

/* ---------- Le chemin du doigt ---------- */
.att-sc .che-scene{position:relative;flex:1;min-height:260px}
.att-sc .che-svg{position:absolute;inset:0;display:block;touch-action:none;cursor:crosshair;-webkit-user-select:none;user-select:none}
.att-sc .che-guide{fill:none;stroke:rgba(242,233,228,.13);stroke-linecap:round;stroke-linejoin:round}
.att-sc .che-trait{fill:none;stroke:var(--a);stroke-linecap:round;stroke-linejoin:round;transition:stroke-opacity .45s ease}
.att-sc .che-svg.vite .che-trait{stroke-opacity:.28}
.att-sc .che-arrivee{fill:none;stroke:rgba(242,233,228,.3);stroke-width:1.5}
.att-sc .che-main{fill:#F2E9E4;transition:fill-opacity .45s ease}
.att-sc .che-svg.vite .che-main{fill-opacity:.45}
.att-sc .che-svg.fini .che-main{fill:var(--a)}
.att-sc .che .apx-texte{min-height:5.6em}

/* ---------- L'horizon ---------- */
.att-sc .hor{overflow:hidden}
.att-sc .hor-svg{position:absolute;inset:0;display:block}
.att-sc .hor-texte{position:absolute;z-index:2;left:0;right:0;bottom:calc(34px + env(safe-area-inset-bottom));padding:0 28px;text-align:center}
.att-sc .hor-consigne{font-size:1.6rem}
.att-sc .hor-aide{max-width:330px;margin-left:auto !important;margin-right:auto !important}
.att-sc .hor-paup{position:absolute;z-index:4;left:0;right:0;height:0;background:#0B0717;pointer-events:none}
.att-sc .hor-paup.haut{top:0}.att-sc .hor-paup.bas{bottom:0}
.att-sc .hor.cligne .hor-paup{animation:hor-cligne 1.2s ease-in-out 2}
@keyframes hor-cligne{0%,100%{height:0}45%,55%{height:51%}}

/* ---------- Le regard large ---------- */
.att-sc .reg{overflow:hidden}
.att-sc .reg::before{content:"";position:absolute;inset:0;background:radial-gradient(70% 45% at 50% 45%,rgba(183,156,255,.16),transparent 70%),linear-gradient(180deg,rgba(242,233,228,.05),rgba(183,156,255,.08));opacity:0;transition:opacity 1.2s ease;pointer-events:none}
.att-sc .reg.reg-brume::before{opacity:1}
.att-sc .reg-svg{position:absolute;inset:0;display:block}
.att-sc .reg-anneau{fill:none;stroke:rgba(242,233,228,.12);stroke-width:1;stroke-dasharray:2 6}
.att-sc .reg.reg-brume .reg-svg{opacity:.85}
.att-sc .reg-zone{position:absolute;inset:0;z-index:1;width:100%;height:100%;background:transparent;border:0;padding:0;cursor:pointer;touch-action:manipulation}
.att-sc .reg-zone:focus-visible{outline:2px solid var(--a);outline-offset:-6px;border-radius:24px}
.att-sc .reg-bas{position:relative;z-index:2;margin-top:auto;padding:0 22px calc(22px + env(safe-area-inset-bottom));text-align:center;pointer-events:none}
.att-sc .reg-consigne{font-size:1.4rem}

/* ---------- Les cinq sens ---------- */
.att-sc .sen-zone{position:absolute;inset:0;z-index:1;width:100%;height:100%;background:transparent;border:0;padding:0;cursor:pointer;touch-action:manipulation}
.att-sc .sen-zone:focus-visible{outline:2px solid var(--a);outline-offset:-6px;border-radius:24px}
.att-sc .sen-lignes{position:relative;z-index:2;flex:1;display:flex;flex-direction:column;justify-content:center;gap:clamp(10px,3.2vh,30px);padding:14px 30px;pointer-events:none;max-width:420px;width:100%;margin:0 auto}
.att-sc .sen-ligne{display:flex;align-items:center;gap:14px;opacity:.45;transition:opacity .5s ease}
.att-sc .sen-ligne.cur,.att-sc .sen-ligne.fait{opacity:1}
.att-sc .sen-nom{flex:0 0 96px;font-weight:600;font-size:1rem;color:var(--cr)}
.att-sc .sen-ligne.cur .sen-nom{color:var(--a)}
.att-sc .sen-pts{display:flex;gap:12px}
.att-sc .sen-pt{display:block;width:22px;height:22px;border-radius:50%;background:rgba(242,233,228,.13);transition:background .4s ease,transform .4s ease}
.att-sc .sen-pt.on{background:var(--a);transform:scale(1.05)}
.att-sc .sen-pt.attend{background:conic-gradient(color-mix(in srgb,var(--a) 70%,transparent) var(--g,0deg),rgba(242,233,228,.13) 0)}
.att-sc .sen-texte{pointer-events:none;padding-bottom:calc(22px + env(safe-area-inset-bottom))}
.att-sc .sen-texte .att-doux{min-height:1.5em}
.att-sc .sen-compte:empty{display:none}
.att-sc .sen-question{padding-top:0}
.att-sc .sen-rep{display:flex;gap:8px}
.att-sc .sen-rep .att-cta{flex:1;margin:0;padding:0 8px;font-size:.95rem}

/* ---------- Les pouces qui alternent ---------- */
.att-sc .pou-zones{flex:1;display:flex;gap:14px;padding:18px 18px 6px;min-height:240px}
.att-sc .pou-z{position:relative;flex:1;display:grid;place-items:center;border-radius:28px;border:1.5px dashed rgba(242,233,228,.2);background:linear-gradient(180deg,rgba(242,233,228,.03),rgba(242,233,228,.06));color:var(--cr2);font-size:1.05rem;font-weight:600;cursor:pointer;overflow:hidden;touch-action:manipulation;-webkit-user-select:none;user-select:none;transition:border-color .5s ease,color .5s ease}
.att-sc .pou-z.attendue{border-style:solid;border-color:color-mix(in srgb,var(--a) 55%,transparent);color:var(--cr)}
.att-sc .pou-z.eclaire{border-color:var(--a);color:var(--cr)}
.att-sc .pou-z:focus-visible{outline:2px solid var(--a);outline-offset:3px}
.att-sc .pou-lueur{position:absolute;inset:0;border-radius:inherit;background:radial-gradient(90% 60% at 50% 50%,color-mix(in srgb,var(--a) 38%,transparent),color-mix(in srgb,var(--a) 10%,transparent) 75%);opacity:0;pointer-events:none}
.att-sc .pou-nom{position:relative}
.att-sc .pou-msg{min-height:1.5em;margin:4px 20px 6px;text-align:center;font-family:'Newsreader',Georgia,serif;font-style:italic;font-weight:300;font-size:1.02rem;color:var(--a);opacity:0;transition:opacity .6s ease}
.att-sc .pou-msg.pou-la{opacity:1}
.att-sc .pou .apx-texte{padding-bottom:calc(22px + env(safe-area-inset-bottom))}

/* ---------- Le volcan ---------- */
.att-sc .vol-scene{position:relative;flex:1;min-height:250px}
.att-sc .vol-svg{position:absolute;inset:0;display:block}
.att-sc .vol-cible{position:absolute;z-index:2;background:transparent;border:0;padding:0;border-radius:40% 40% 10px 10px;cursor:pointer;touch-action:none}
.att-sc .vol-cible:focus-visible{outline:2px solid var(--a);outline-offset:4px}
.att-sc .vol-etiq{font-family:'Newsreader',Georgia,serif;font-style:italic;font-weight:300;font-size:19px;fill:#FFF3E6}
.att-sc .vol .apx-texte{min-height:6.2em}
.att-sc .vol-consigne.vol-question{font-size:1.5rem;color:#FFE7C2}
.att-sc .vol .att-bas{min-height:calc(34px + env(safe-area-inset-bottom))}

/* ---------- Nommer l'émotion ---------- */
.att-sc .emo-avant,.att-sc .emo-apres{flex:1;display:flex;flex-direction:column}
.att-sc .emo-q{margin:4px 0 14px !important}
.att-sc .emo-mots{justify-content:center}
.att-sc .emo-mots .att-chip{min-width:84px;padding:10px 14px;font-size:.9rem}
.att-sc .emo-mots .emo-plus{border-style:dashed;color:var(--cr2)}
.att-sc .emo-autre{display:flex;gap:10px;align-items:flex-end;margin-top:12px}
.att-sc .emo-autre .att-champ{flex:1}
.att-sc .emo-reg{margin:auto 0;padding:26px 4px 18px}
.att-sc .emo-val{margin-top:10px;text-align:center;font-family:'Newsreader',Georgia,serif;font-style:italic;font-weight:300;font-size:1.5rem;color:var(--cr2)}
.att-sc .emo-val b{font-weight:300;font-size:2.4rem;color:var(--cr)}
.att-sc .emo-avant .apx-texte{padding:0 0 4px}
.att-sc .emo-souffle{flex:1;display:flex;flex-direction:column}
.att-sc .emo-rappel{margin:6px 0 0;text-align:center;font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;font-weight:600;color:var(--a)}
.att-sc .emo-scene{flex:1;display:grid;place-items:center;min-height:240px}
.att-sc .emo-rond{position:relative;width:min(68vw,270px,38vh);aspect-ratio:1;display:grid;place-items:center}
.att-sc .emo-halo{position:absolute;inset:-20%;border-radius:50%;background:radial-gradient(circle,color-mix(in srgb,var(--a) 30%,transparent),transparent 66%)}
.att-sc .emo-anneau{position:absolute;inset:0;border-radius:50%;border:1.5px dashed color-mix(in srgb,var(--a) 45%,transparent)}
.att-sc .emo-disque{position:absolute;inset:0;border-radius:50%;background:radial-gradient(circle at 50% 42%,color-mix(in srgb,var(--a) 55%,#F2E9E4 10%),color-mix(in srgb,var(--a) 22%,transparent) 70%);border:1.5px solid color-mix(in srgb,var(--a) 70%,transparent);will-change:transform}
.att-sc .emo-t{position:relative;font-family:'Newsreader',Georgia,serif;font-style:italic;font-weight:300;font-size:1.5rem;color:#fff}
.att-sc .emo-souffle .apx-texte{padding-bottom:28px}
.att-sc .emo-h2{margin-top:8px}
.att-sc .emo-piste{position:relative;padding-top:26px}
.att-sc .emo-marque{position:absolute;top:0;left:calc(13px + (100% - 26px) * var(--m,.5));transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;pointer-events:none}
.att-sc .emo-marque em{order:-1;font-style:normal;font-size:.68rem;letter-spacing:.1em;text-transform:uppercase;color:var(--cr3)}
.att-sc .emo-marque i{display:block;width:2px;height:10px;margin-top:2px;border-radius:1px;background:rgba(242,233,228,.45)}

/* ---------- L'envie est une vague ---------- */
.att-sc .vag-nom .att-chips{margin-top:2px}
.att-sc .vag-ligne{display:flex;gap:10px;align-items:flex-end;margin-top:18px}
.att-sc .vag-ligne .att-champ{flex:1}
.att-sc .vag-deja{margin-top:18px !important;color:var(--cr3) !important}
.att-sc .vag-scene{position:relative;flex:1;min-height:420px;overflow:hidden}
.att-sc .vag-svg{position:absolute;inset:0;display:block}
.att-sc .vag-mot{font-family:'Newsreader',Georgia,serif;font-style:italic;font-weight:300;font-size:20px;fill:#F2E9E4}
.att-sc .vag-texte{position:absolute;z-index:2;left:0;right:0;bottom:calc(24px + env(safe-area-inset-bottom));padding:0 24px;text-align:center}
.att-sc .vag-texte .att-consigne{font-size:1.4rem}
.att-sc .vag-texte .att-doux{min-height:1.5em}
.att-sc .vag-compte{background:rgba(16,35,58,.55)}

/* ---------- La lettre qu'on n'envoie pas ---------- */
.att-sc .let-avant{flex:1}
.att-sc .let-hier{margin:4px 0 22px}
.att-sc .let-hier-t{margin:0 0 12px;font-family:'Newsreader',Georgia,serif;font-style:italic;font-weight:300;font-size:1.1rem;line-height:1.4}
.att-sc .let-hier .att-chips{gap:6px}
.att-sc .let-promesses{list-style:none;margin:6px 0 0;padding:0;border-top:1px solid var(--tr)}
.att-sc .let-promesses li{padding:14px 0 14px 26px;border-bottom:1px solid var(--tr);position:relative;font-size:.95rem;line-height:1.5;color:var(--cr2)}
.att-sc .let-promesses li::before{content:"";position:absolute;left:4px;top:22px;width:8px;height:8px;border-radius:50%;background:var(--a)}
.att-sc .let-promesses b{color:var(--cr);font-weight:600}
.att-sc .let-ecrire{flex:1;display:flex;flex-direction:column;padding:6px 20px 0}
.att-sc .let-papier{position:relative;flex:1;display:flex;min-height:260px;border:1px solid rgba(242,233,228,.14);border-radius:22px;background:linear-gradient(180deg,rgba(242,233,228,.045),rgba(242,233,228,.02))}
.att-sc .let-champ{flex:1;width:100%;min-height:0;height:auto;padding:18px 20px;border:0 !important;background:transparent;font-size:19px;line-height:1.55}
.att-sc .let-mots{position:relative;flex:1;padding:18px 20px;overflow:hidden;white-space:pre-wrap;overflow-wrap:anywhere;font-family:'Newsreader',Georgia,serif;font-style:italic;font-weight:300;font-size:19px;line-height:1.55;color:var(--cr)}
.att-sc .let-mot{display:inline-block;transition:opacity 1.6s ease,transform 1.8s ease,filter 1.6s ease}
.att-sc .let-mot.let-parti{opacity:0;transform:translateY(-14px);filter:blur(3px)}
.att-sc .let-mots.reduit .let-mot{transition:opacity .8s ease}
.att-sc .let-mots.reduit .let-mot.let-parti{transform:none;filter:none}
.att-sc .let-consigne{margin:16px 0 0 !important;font-size:1.25rem !important}

/* ---------- La sphère et les voitures ---------- */
.att-sc .sph{position:relative;flex:1;display:flex;flex-direction:column;min-height:520px;overflow:hidden}
.att-sc .sph-svg{position:absolute;inset:0;display:block}
.att-sc .sph-reglages{position:relative;z-index:2;display:flex;flex-direction:column;gap:8px;padding:4px 18px 0}
.att-sc .sph-reglages .att-chips{gap:6px}
.att-sc .sph-reglages .att-chip{padding:6px 12px;font-size:.78rem}
.att-sc .sph-message{position:absolute;z-index:2;left:24px;right:24px;top:34%;text-align:center;font-family:'Newsreader',Georgia,serif;font-style:italic;font-weight:300;font-size:1.12rem;line-height:1.4;color:#F2B36B;opacity:0;transition:opacity .6s ease;pointer-events:none}
.att-sc .sph-message.la{opacity:1}
.att-sc .sph-cible{position:absolute;z-index:3;border-radius:50%;background:transparent;border:0;padding:0;cursor:pointer;touch-action:manipulation}
.att-sc .sph-cible:focus-visible{outline:2px solid #F2B36B;outline-offset:4px}
.att-sc .sph-bas{position:absolute;z-index:2;left:0;right:0;bottom:calc(18px + env(safe-area-inset-bottom));padding:0 24px;text-align:center;pointer-events:none}
.att-sc .sph-consigne{font-size:1.45rem}
.att-sc .sph-aide{margin-top:4px}
.att-sc .sph-compte{display:inline-flex;align-items:baseline;gap:8px;margin-top:14px;padding:10px 20px;border-radius:999px;border:1px solid rgba(242,233,228,.16);background:rgba(242,233,228,.05)}
.att-sc .sph-compte b{font-family:'Newsreader',Georgia,serif;font-weight:300;font-size:1.6rem;line-height:1}
.att-sc .sph-compte span{font-size:.85rem;color:rgba(242,233,228,.7)}

/* ---------- Confiance en soi · Estime de soi : commun ---------- */
.att-sc:has(.att-stage:is([data-ex="forces"],[data-ex="deuxmin"],[data-ex="preuves"],[data-ex="ridicule"],[data-ex="droit"],[data-ex="rejeu"],[data-ex="pascote"],[data-ex="bon"],[data-ex="volume"],[data-ex="promesse"])) .att-sc-chrono{color:var(--a);font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;font-weight:700}
.att-sc .cf{flex:1;display:flex;flex-direction:column;min-height:100%}
.att-sc .cf>*{flex-shrink:0}
.att-sc .cf [hidden]{display:none !important}
.att-sc .cf .att-pad{padding:8px 22px 0}
.att-sc .cf .att-h{margin:2px 0 0}
.att-sc .cf-sr{position:absolute !important;width:1px;height:1px;margin:-1px;padding:0;border:0;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}
.att-sc .cf-lien{display:block;margin:0 auto 8px;min-height:44px;padding:0 12px;background:none;border:0;color:var(--cr2);font-size:.88rem;font-weight:600;text-decoration:underline;text-decoration-color:rgba(242,233,228,.28);text-underline-offset:4px;cursor:pointer}
.att-sc .cf .att-champ.it::placeholder{font-style:italic}
.att-sc .cf .att-chips .att-chip{min-height:40px}

/* ---------- Le jeu des forces ---------- */
.att-sc .frc-main{position:relative;height:148px;width:100%;max-width:340px;margin:12px auto 0}
.att-sc .frc-carte{position:absolute;left:50%;top:6px;width:96px;height:132px;margin-left:-48px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:9px;padding:10px 8px;text-align:center;border-radius:14px;border:1px solid rgba(242,233,228,.2);background:linear-gradient(160deg,#2C2045,#1E1534);transition:transform .5s ease,opacity .4s ease}
.att-sc .frc-carte b{font-family:'Newsreader',Georgia,serif;font-weight:400;font-style:italic;font-size:1.05rem;line-height:1.15;color:var(--cr);overflow-wrap:anywhere}
.att-sc .frc-orne{display:flex;color:var(--a);opacity:.75}
.att-sc .frc-carte.p0{transform:translateX(-74px) translateY(12px) rotate(-11deg)}
.att-sc .frc-carte.p2{transform:translateX(74px) translateY(12px) rotate(11deg)}
.att-sc .frc-carte.p1{z-index:2}
.att-sc .frc-carte.vive{border-color:var(--a);background:linear-gradient(160deg,color-mix(in srgb,var(--a) 34%,#221833),color-mix(in srgb,var(--a) 10%,#170F29))}
.att-sc .frc-carte.vide{border:1.5px dashed rgba(242,233,228,.2);background:#1A1230}
.att-sc .frc-carte.vide.p1{border-color:color-mix(in srgb,var(--a) 45%,transparent)}
.att-sc .frc-jeu{display:flex;flex-wrap:wrap;justify-content:center;gap:7px 6px;padding:10px 14px 4px}
.att-sc .frc-c{min-height:44px;padding:8px 12px;border-radius:12px;border:1px solid rgba(242,233,228,.16);background:rgba(242,233,228,.04);color:var(--cr);font-size:.9rem;font-weight:500;cursor:pointer;transition:background .25s,border-color .25s,opacity .25s}
.att-sc .frc-c.on{background:color-mix(in srgb,var(--a) 24%,transparent);border-color:var(--a);font-weight:600}
.att-sc .frc-c.loin{opacity:.38}
.att-sc .frc-une{position:relative;display:flex;justify-content:center;padding:22px 0 6px}
.att-sc .frc-une::before{content:"";position:absolute;left:50%;top:50%;width:300px;height:300px;margin:-150px 0 0 -150px;border-radius:50%;background:radial-gradient(circle,color-mix(in srgb,var(--a) 22%,transparent),transparent 65%);pointer-events:none}
.att-sc .frc-carte.grande{position:relative;left:auto;top:auto;margin:0;width:150px;height:204px;border-radius:18px;gap:16px}
.att-sc .frc-carte.grande b{font-size:1.55rem}
.att-sc .frc-carte.tourne{animation:frc-tourne .6s ease}
@keyframes frc-tourne{from{transform:perspective(700px) rotateY(75deg);opacity:.2}to{transform:none;opacity:1}}
.att-sc .frc-qt{display:block;margin:16px 0 8px;font-size:1.45rem}
.att-sc .frc-champ{text-align:center}
.att-sc .frc-liens{display:flex;flex-wrap:wrap;justify-content:center;margin-top:6px}
.att-sc .frc-liens .cf-lien{margin:0}
.att-sc .frc-groupes{display:flex;flex-direction:column;gap:12px;padding:16px 22px 0}
.att-sc .frc-g{border:1px solid var(--tr);border-radius:18px;padding:14px 16px;background:var(--vo)}
.att-sc .frc-g.autres{opacity:.75}
.att-sc h3.frc-gt{display:flex;align-items:center;gap:8px;margin:0;font-family:'Newsreader',Georgia,serif;font-weight:400;font-size:1.22rem;line-height:1.2}
.att-sc .frc-n{margin-left:auto;font-family:'Karla',sans-serif;font-size:.8rem;font-weight:700;color:var(--a)}
.att-sc .frc-g ul{list-style:none;margin:10px 0 0;padding:0}
.att-sc .frc-g li{display:grid;grid-template-columns:84px 1fr;gap:10px;align-items:baseline;padding:8px 0;border-top:1px solid var(--tr)}
.att-sc .frc-d{font-size:.76rem;color:var(--cr3)}
.att-sc .frc-t{font-family:'Newsreader',Georgia,serif;font-style:italic;font-weight:300;font-size:1.02rem;line-height:1.35;color:var(--cr);overflow-wrap:anywhere}
.att-sc .frc-g .att-doux{margin:6px 0 0}

/* ---------- Les deux premières minutes ---------- */
.att-sc .dmn-lab{margin-top:24px}
.att-sc .dmn-idees{margin-top:14px;gap:6px}
.att-sc .dmn-idees .att-chip{padding:8px 13px;font-size:.82rem}
.att-sc .dmn-compte{display:flex;align-items:baseline;justify-content:center;gap:10px;width:max-content;max-width:calc(100% - 44px);margin:26px auto 0;padding:10px 20px;border-radius:999px;border:1px solid var(--tr);background:var(--vo)}
.att-sc .dmn-compte span{font-size:.86rem;color:var(--cr2)}
.att-sc .dmn-compte b{font-family:'Newsreader',Georgia,serif;font-weight:300;font-size:1.45rem;line-height:1}
.att-sc .dmn-compte.petit{margin:0 auto 10px;padding:6px 16px}
.att-sc .dmn-tache{margin:14px 22px 0;text-align:center;font-size:.95rem;font-weight:600;letter-spacing:.2em;color:var(--cr2);overflow-wrap:anywhere}
.att-sc .dmn-rond{position:relative;width:min(64vw,250px,38vh);aspect-ratio:1;margin:auto;display:grid;place-items:center}
.att-sc .dmn-rond svg{position:absolute;inset:0;width:100%;height:100%}
.att-sc .dmn-fond{fill:none;stroke:rgba(242,233,228,.1);stroke-width:8}
.att-sc .dmn-arc{fill:none;stroke:var(--a);stroke-width:8;stroke-linecap:round;transition:stroke-dashoffset .3s linear}
.att-sc .dmn-rond.fini .dmn-arc{fill:color-mix(in srgb,var(--a) 8%,transparent);stroke-opacity:.9}
.att-sc .dmn-seuil .dmn-rond{width:min(46vw,180px,28vh)}
.att-sc .dmn-coche{fill:none;stroke:var(--a);stroke-width:5;stroke-linecap:round;stroke-linejoin:round}
.att-sc .dmn-t{position:relative;font-family:'Newsreader',Georgia,serif;font-style:italic;font-weight:300;font-size:3.6rem;line-height:1;font-variant-numeric:tabular-nums}
.att-sc .dmn-rond.apercu{width:min(44vw,170px,26vh);opacity:.4;margin:auto auto 18px}
.att-sc .dmn-rond.apercu .dmn-t{font-size:2.4rem}
.att-sc .dmn-cons{margin:0 22px 6px}
.att-sc .dmn-pad{margin:6px 30px 0}
.att-sc .dmn-deux .att-cta{font-weight:500;font-size:1.02rem;border:1.5px solid rgba(242,233,228,.3)}

/* ---------- Le mur des preuves ---------- */
.att-sc .mur-q{line-height:1.5}
.att-sc .mur-ok{margin:0;font-family:'Newsreader',Georgia,serif;font-style:italic;font-weight:300;font-size:1.05rem;color:var(--cr2)}
.att-sc .mur-zone{padding:18px 22px 0}
.att-sc .mur-neuve{display:flex;align-items:center;justify-content:center;min-height:50px;padding:10px 16px;border-radius:11px;background:var(--a);color:#1B122F;font-weight:600;font-size:.95rem;line-height:1.3;text-align:center;overflow-wrap:anywhere}
.att-sc .mur-neuve.vide{background:transparent;border:1.5px dashed color-mix(in srgb,var(--a) 50%,transparent);color:var(--cr3);font-weight:500}
.att-sc .mur-neuve.pose{animation:mur-pose .8s cubic-bezier(.2,.8,.3,1)}
@keyframes mur-pose{0%{transform:translateY(-28px) scale(1.04);opacity:.3}100%{transform:none;opacity:1}}
.att-sc .mur-rangs{display:flex;flex-direction:column;gap:6px;margin-top:6px}
.att-sc .mur-rang{display:flex;gap:6px}
.att-sc .mur-rang.etroit{padding:0 8%}
.att-sc .mur-rang.large{margin:0 -4px}
.att-sc .mur-b{flex:1 1 0;min-width:0;height:44px;padding:0 7px;border-radius:9px;border:1px solid color-mix(in srgb,var(--a) 30%,transparent);background:color-mix(in srgb,var(--a) 14%,#1E1433);color:rgba(242,233,228,.82);font-size:.72rem;font-weight:500;cursor:pointer;overflow:hidden}
.att-sc .mur-b span{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.att-sc .mur-b.t1{background:color-mix(in srgb,var(--a) 22%,#1E1433)}
.att-sc .mur-b.t2{background:color-mix(in srgb,var(--a) 8%,#1B1230);color:rgba(242,233,228,.62)}
.att-sc .mur-b.fantome{border:1px dashed rgba(242,233,228,.12);background:transparent;cursor:default}
.att-sc .mur-detail{min-height:1.5em;margin:12px 0 0;text-align:center;font-family:'Newsreader',Georgia,serif;font-style:italic;font-weight:300;font-size:1rem;color:var(--cr2)}
.att-sc .mur-texte{margin:4px 30px 0;text-align:center;font-size:.86rem;line-height:1.55;color:var(--cr2)}
.att-sc .mur-vue{margin-top:14px}
.att-sc .mur-liste{padding:10px 22px 0}
.att-sc h3.mur-mois{display:flex;justify-content:space-between;margin:14px 0 4px;font-family:'Karla',sans-serif;font-size:.72rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase !important;color:var(--a) !important}
.att-sc .mur-liste ul{list-style:none;margin:0;padding:0}
.att-sc .mur-liste li{display:grid;grid-template-columns:62px 1fr;gap:10px;align-items:baseline;padding:9px 0;border-top:1px solid var(--tr)}
.att-sc .mur-date{font-size:.76rem;color:var(--cr3)}
.att-sc .mur-l{font-family:'Newsreader',Georgia,serif;font-style:italic;font-weight:300;font-size:1.05rem;line-height:1.35;overflow-wrap:anywhere}

/* ---------- Le pas ridicule ---------- */
.att-sc .rid-carte{margin-top:18px;padding:14px 18px}
.att-sc .rid-quoi{margin:2px 0 0;font-family:'Newsreader',Georgia,serif;font-weight:400;font-size:1.3rem;line-height:1.3;overflow-wrap:anywhere}
.att-sc .rid-dl{margin-top:16px}
.att-sc .rid-depuis{gap:6px}
.att-sc .rid-depuis .att-chip{padding:7px 13px;font-size:.82rem}
.att-sc .rid-echelle{list-style:none;margin:16px 0 0;padding:0 22px}
.att-sc .rid-m{padding:10px 0 10px;border-bottom:1px solid var(--tr)}
.att-sc .rid-barre{position:relative;display:block;height:4px;margin-bottom:8px;border-radius:2px;background:rgba(242,233,228,.07)}
.att-sc .rid-barre::before{content:"";position:absolute;left:0;top:0;bottom:0;width:var(--w);border-radius:2px;background:rgba(242,233,228,.32);transition:width .5s ease}
.att-sc .rid-m.der .rid-barre::before{background:var(--a)}
.att-sc .rid-l{display:flex;align-items:center;gap:10px;min-height:44px}
.att-sc .rid-t{flex:1;min-width:0;font-size:.95rem;color:var(--cr2);overflow-wrap:anywhere}
.att-sc .rid-m.der .rid-t{color:var(--cr);font-weight:600}
.att-sc .rid-l .rid-champ{flex:1;min-width:0;padding:4px 0 6px;font-weight:600}
.att-sc .rid-ridicule{flex:none;min-height:44px;padding:0 13px;border-radius:999px;border:1px solid rgba(242,233,228,.2);background:transparent;color:var(--cr2);font-size:.8rem;font-weight:700;cursor:pointer}
.att-sc .rid-ridicule.on{border-color:var(--a);color:var(--a);background:color-mix(in srgb,var(--a) 13%,transparent)}
.att-sc .rid-ridicule:disabled{opacity:.35;cursor:default}
.att-sc .rid-outils{padding-top:12px}
.att-sc .rid-aide{margin:0 0 8px;font-size:.84rem}
.att-sc .rid-props{gap:6px}
.att-sc .rid-props .att-chip{padding:7px 12px;font-size:.8rem;white-space:normal;text-align:left}
.att-sc .rid-plus{margin-top:12px;min-height:48px}
.att-sc .rid-regle{margin:12px 0 0;text-align:center;font-size:.85rem;color:var(--cr2)}
.att-sc .rid-ql{margin-top:26px}
.att-sc .rid-pas{margin:4px 0 0;font-family:'Newsreader',Georgia,serif;font-style:italic;font-weight:300;font-size:1.55rem;line-height:1.3;overflow-wrap:anywhere}
.att-sc .rid-fait{margin-top:30px}
.att-sc .rid-faits{list-style:none;margin:14px 0 18px;padding:0}
.att-sc .rid-faits li{display:flex;align-items:baseline;gap:10px;padding:6px 0;font-size:.92rem;color:var(--cr2)}
.att-sc .rid-faits em{margin-left:auto;font-style:normal;font-size:.76rem;color:var(--cr3);white-space:nowrap}
.att-sc .rid-ok{color:var(--a);font-weight:700}
.att-sc .rid-q .rid-carte{margin-top:6px}
.att-sc .rid-entier{margin-top:16px}
.att-sc .rid .att-chips.rid-props{margin-top:10px}

/* ---------- Se tenir droit ---------- */
.att-sc .drt-scene{position:relative;flex:1;min-height:250px;margin:2px 16px 0}
.att-sc .drt-scene.petite{flex:0 0 auto;height:min(30vh,240px);min-height:160px;opacity:.7}
.att-sc .drt-svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.att-sc .drt-corps,.att-sc .drt-tete{fill:color-mix(in srgb,var(--a) 7%,transparent);stroke:var(--a);stroke-width:2;stroke-linejoin:round;stroke-linecap:round}
.att-sc .drt-fleche{fill:none;stroke:var(--a);stroke-width:1.5;stroke-dasharray:3 4;stroke-linecap:round;opacity:0;transition:opacity 1.2s ease}
.att-sc .drt-horizon{stroke:rgba(242,233,228,.35);stroke-width:1;stroke-dasharray:2 5;opacity:0;transition:opacity 1.2s ease}
.att-sc .drt-svg:has(.r1.la) .drt-fleche,.att-sc .drt-svg:has(.r3.la) .drt-horizon{opacity:1}
.att-sc .drt-ventre{opacity:0}
.att-sc .drt-run .drt-ventre{opacity:1}
.att-sc .drt-rep{opacity:0;transition:opacity 1.4s ease}
.att-sc .drt-rep.la{opacity:1}
.att-sc .drt-rep text{font-family:'Newsreader',Georgia,serif;font-style:italic;font-weight:300;font-size:16px;fill:rgba(242,233,228,.78);text-anchor:middle}
.att-sc .drt-compte{display:flex;align-items:baseline;justify-content:center;gap:12px;margin:4px 0 0}
.att-sc .drt-souffle{font-family:'Newsreader',Georgia,serif;font-style:italic;font-weight:300;font-size:1.2rem;color:var(--cr2)}
.att-sc .drt-n{min-width:1ch;font-family:'Newsreader',Georgia,serif;font-weight:300;font-size:2rem;line-height:1}
.att-sc .drt-mesure{display:flex;align-items:center;justify-content:center;gap:18px;margin:12px 0 0}
.att-sc .drt-box{display:flex;flex-direction:column;align-items:center;justify-content:center;width:88px;height:68px;border-radius:14px;border:1px solid var(--tr);background:var(--vo)}
.att-sc .drt-box span{font-size:.62rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--cr3)}
.att-sc .drt-box b{font-family:'Newsreader',Georgia,serif;font-weight:300;font-size:2rem;line-height:1.05}
.att-sc .drt-box.vide{border:1.5px dashed color-mix(in srgb,var(--a) 55%,transparent);background:transparent}
.att-sc .drt-box.ap{border-color:var(--a)}
.att-sc .drt-fl{color:var(--cr3)}
.att-sc .drt-mesure.grand{margin:34px 0 24px}
.att-sc .drt-mesure.grand .drt-box{width:112px;height:92px}
.att-sc .drt-mesure.grand .drt-box b{font-size:2.7rem}
.att-sc .drt-av{margin-top:14px}
.att-sc .drt-l{display:flex;align-items:baseline;justify-content:space-between;gap:12px}
.att-sc .drt-l .att-lab{margin:0}
.att-sc .drt-v{font-family:'Newsreader',Georgia,serif;font-weight:300;font-size:2rem;line-height:1}
.att-sc .drt-bornes{display:flex;justify-content:space-between;margin-top:2px;font-size:.75rem;color:var(--cr3)}
@media (max-height:720px){.att-sc .drt-run .drt-mesure{display:none}.att-sc .drt-run .drt-scene{min-height:200px}.att-sc .drt-run .att-bas .att-note{display:none}}
.att-sc .drt-opt{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:12px}
.att-sc .drt-opt .att-lab{margin:0}
.att-sc .drt-opt .att-chip{padding:7px 15px;font-size:.82rem}

/* ---------- Le rejeu ---------- */
.att-sc .rej-scene{margin-top:14px}
.att-sc .rej-garde{margin-top:20px}
.att-sc .rej-garde .att-chip{padding:7px 16px;font-size:.84rem}
.att-sc .rej-gn{margin-top:8px;font-size:.84rem}
.att-sc .rej-points{display:flex;align-items:center;gap:8px;margin:20px 0 0}
.att-sc .att-bas .rej-points{justify-content:center;margin:0 0 14px}
.att-sc .rej-points i{flex:none;width:12px;height:12px;border-radius:50%;border:1.5px solid rgba(242,233,228,.35)}
.att-sc .rej-points i.on{background:var(--a);border-color:var(--a)}
.att-sc .rej-points i.cours{border-color:var(--a);background:color-mix(in srgb,var(--a) 30%,transparent)}
.att-sc .rej-points span{margin-left:6px;font-size:.84rem;color:var(--cr2)}
.att-sc .rej-v1{margin-top:6px;padding:14px 16px;border-radius:18px;border:1px solid var(--tr);background:var(--vo);transition:opacity .6s ease}
.att-sc .rej-v1 .att-lab{color:var(--cr3)}
.att-sc .rej-v1 p:last-of-type{margin:0;font-size:.96rem;line-height:1.5;color:var(--cr2);overflow-wrap:anywhere}
.att-sc .rej-v1.vue{opacity:.55}
.att-sc .rej-prog{display:block;height:3px;margin-top:12px;border-radius:2px;background:rgba(242,233,228,.1);overflow:hidden}
.att-sc .rej-prog i{display:block;height:100%;background:var(--a);transform:scaleX(0);transform-origin:left;transition:transform .3s linear}
.att-sc .rej-prog.v2{margin:14px 4px 0}
.att-sc .rej-cons{margin-top:34px}
.att-sc .rej-v2{margin-top:14px;padding:14px 16px;border-radius:18px;border:1px solid color-mix(in srgb,var(--a) 60%,transparent);background:color-mix(in srgb,var(--a) 9%,transparent)}
.att-sc .rej-v2 .att-lab{color:var(--a)}
.att-sc .rej-geste-t{margin:4px 0 0;font-size:.98rem;line-height:1.5;overflow-wrap:anywhere}
.att-sc .rej-phrase-t{margin:10px 0 0;font-family:'Newsreader',Georgia,serif;font-style:italic;font-weight:300;font-size:1.5rem;line-height:1.3;overflow-wrap:anywhere}
.att-sc .rej-det-t{margin:10px 0 0;font-size:.92rem;color:var(--cr2)}
.att-sc .rej-v2 .rej-geste{padding-top:2px}
.att-sc .rej-v2 .rej-phrase{margin-top:8px;font-size:20px}
.att-sc .rej-det{gap:6px;margin-top:12px}
.att-sc .rej-det .att-chip{padding:7px 12px;font-size:.8rem}
.att-sc .rej-guide{margin:28px 4px 0;font-size:1.35rem}

/* ---------- Le pas de côté ---------- */
.att-sc .pc-titre{margin:8px 0 22px;text-align:center;font-size:.9rem;font-weight:600;letter-spacing:.24em;color:var(--cr2)}
.att-sc .pc-carte{display:block;width:100%;margin:0;padding:16px 18px;border-radius:20px;border:1px solid;text-align:left;font:inherit;color:var(--cr)}
.att-sc .pc-carte.dure{border-color:rgba(183,156,255,.42);background:rgba(183,156,255,.08)}
.att-sc .pc-carte.rep{border-color:color-mix(in srgb,var(--a) 60%,transparent);background:color-mix(in srgb,var(--a) 9%,transparent)}
.att-sc .pc-lab{display:block;margin:0 0 6px;font-size:.8rem;font-weight:700}
.att-sc .pc-carte.dure .pc-lab{color:#C9B5FF}
.att-sc .pc-carte.rep .pc-lab{color:var(--a)}
.att-sc .pc-t{display:block;margin:0;font-family:'Newsreader',Georgia,serif;font-style:italic;font-weight:300;font-size:1.35rem;line-height:1.35;overflow-wrap:anywhere}
.att-sc .pc-carte .att-champ{padding:2px 0 6px;border-bottom-color:rgba(242,233,228,.12)}
.att-sc .pc-carte .att-champ:focus{border-bottom-color:var(--a)}
.att-sc .pc-carte.tourne{animation:pc-tourne .9s ease}
@keyframes pc-tourne{from{transform:perspective(600px) rotateX(70deg);opacity:0}to{transform:none;opacity:1}}
.att-sc .pc-fil{width:0;height:34px;margin:10px auto;border-left:1.5px dashed rgba(242,233,228,.25)}
.att-sc .pc-q{margin:0 0 18px;font-size:1.35rem}
.att-sc .pc-aide{margin-top:14px}
.att-sc .pc-h{text-align:center;font-size:1.55rem}
.att-sc .pc-titre+.pc-h{margin-top:-8px}
.att-sc .pc-face{display:grid;grid-template-columns:1fr auto 1fr;align-items:stretch;gap:8px;padding:24px 16px 0}
.att-sc .pc-ou{align-self:center;font-family:'Newsreader',Georgia,serif;font-style:italic;color:var(--cr3)}
.att-sc .pc-carte.choix{display:flex;flex-direction:column;min-height:160px;padding:14px 14px 16px;cursor:pointer;transition:opacity .3s ease,border-color .3s ease,background .3s ease}
.att-sc .pc-carte.choix .pc-t{font-size:1.15rem}
.att-sc .pc-carte.choix.on{border-width:2px;padding:13px 13px 15px}
.att-sc .pc-carte.dure.choix.on{border-color:#C9B5FF}
.att-sc .pc-carte.rep.choix.on{border-color:var(--a);background:color-mix(in srgb,var(--a) 16%,transparent)}
.att-sc .pc-face:has(.on) .choix:not(.on){opacity:.45}
.att-sc .pc-liste{list-style:none;margin:14px 0 0;padding:0 22px}
.att-sc .pc-liste li{display:flex;flex-direction:column;gap:3px;padding:12px 0;border-top:1px solid var(--tr)}
.att-sc .pc-d{font-size:.76rem;color:var(--cr3)}
.att-sc .pc-rt{font-family:'Newsreader',Georgia,serif;font-style:italic;font-weight:300;font-size:1.12rem;line-height:1.35;overflow-wrap:anywhere}
.att-sc .pc-dt{font-size:.8rem;color:var(--cr3);overflow-wrap:anywhere}
@media (max-width:359px){.att-sc .pc-face{grid-template-columns:1fr}.att-sc .pc-ou{justify-self:center}.att-sc .pc-carte.choix{min-height:0}}

/* ---------- Ce qu'on m'a dit de bon ---------- */
.att-sc .bon-liste{display:flex;flex-direction:column;gap:10px;padding-top:18px}
.att-sc .bon-c{padding:12px 16px;border-radius:16px;border:1px solid var(--tr);background:var(--vo)}
.att-sc .bon-ct{margin:0;font-family:'Newsreader',Georgia,serif;font-style:italic;font-weight:300;font-size:1.12rem;line-height:1.35;overflow-wrap:anywhere}
.att-sc .bon-cq{margin:4px 0 0;font-size:.8rem;color:var(--cr3)}
.att-sc .bon-c.neuve{border:1.5px solid color-mix(in srgb,var(--a) 70%,transparent);background:color-mix(in srgb,var(--a) 8%,transparent)}
.att-sc .bon-c.neuve .bon-t{padding:2px 0 6px;font-size:19px;border-bottom-color:rgba(242,233,228,.12)}
.att-sc .bon-qq{display:flex;gap:12px}
.att-sc .bon-qq .att-champ{flex:1;min-width:0;padding:8px 0 6px;font-size:16px;color:var(--a);border-bottom-color:rgba(242,233,228,.12)}
.att-sc .bon-qq .att-champ:focus{border-bottom-color:var(--a)}
.att-sc .bon-c.p0 .bon-cq{color:color-mix(in srgb,var(--a) 70%,var(--cr))}
.att-sc .bon-c.p1{opacity:.72}
.att-sc .bon-c.p2{opacity:.45}
.att-sc .bon-c.arrive{animation:bon-arrive .7s ease}
@keyframes bon-arrive{from{transform:translateY(-28px);opacity:0}to{transform:none;opacity:1}}
.att-sc .bon-alerte{margin:8px 0 0;font-size:.82rem;color:var(--a)}
.att-sc .bon-regle{margin:18px 22px 0;text-align:center;font-family:'Newsreader',Georgia,serif;font-style:italic;font-weight:300;font-size:1.02rem;color:var(--cr2)}
.att-sc .bon-liens{display:flex;justify-content:center;gap:4px}
.att-sc .bon-liens .cf-lien{margin:0 0 6px}
.att-sc .bon-scene{display:flex;flex-direction:column;justify-content:center;flex:1;min-height:330px;margin:10px 22px 0;padding-top:120px}
.att-sc .bon-boite{position:relative;width:100%;max-width:340px;aspect-ratio:2/1;margin:0 auto}
.att-sc .bon-fond,.att-sc .bon-face{position:absolute;inset:0;width:100%;height:100%;display:block}
.att-sc .bon-face{z-index:2}
.att-sc .bon-sort{position:absolute;z-index:1;left:9%;right:9%;bottom:44%}
.att-sc .bon-c.grande{padding:22px 18px 44px;text-align:center;border:1.5px solid var(--a);background:#2A1C38;animation:bon-sort 1s ease both}
.att-sc .bon-c.grande .bon-ct{font-size:1.5rem}
.att-sc .bon-c.grande .bon-cq{margin-top:10px;font-family:'Newsreader',Georgia,serif;font-style:italic;font-size:1rem;color:var(--a)}
@keyframes bon-sort{from{transform:translateY(48px);opacity:0}to{transform:none;opacity:1}}
.att-sc .bon-date{margin:14px 30px 0}
.att-sc .bon-toutes-l{display:flex;flex-direction:column;gap:10px;padding-top:16px}

/* ---------- Le volume du critique ---------- */
.att-sc .vlm-lab{margin-top:22px}
.att-sc .vlm-aide{margin-top:10px}
.att-sc .vlm-scene{display:flex;align-items:center;min-height:96px;margin:2px 0 0;transition:min-height .6s ease}
.att-sc .vlm-scene.bas{align-items:flex-start;min-height:34px}
.att-sc .vlm-phrase{margin:0;font-family:'Newsreader',Georgia,serif;font-style:italic;font-size:2.2rem;line-height:1.2;overflow-wrap:anywhere;transition:font-size .35s ease,opacity .35s ease,color .35s ease}
.att-sc .vlm-ton{margin-top:16px}
.att-sc .vlm-reco{margin:0 0 10px}
.att-sc .vlm-tons{gap:7px}
.att-sc .vlm-tons .att-chip{padding:8px 15px;font-size:.86rem}
.att-sc .vlm-tons .vlm-plus{border-style:dashed;color:var(--cr2)}
.att-sc .vlm-autre{display:flex;align-items:center;gap:10px;margin-top:10px}
.att-sc .vlm-autre .att-champ{flex:1;min-width:0;font-size:16px}
.att-sc .vlm-reglage{margin-top:20px}
.att-sc .vlm-ligne{display:flex;align-items:center;gap:12px}
.att-sc .vlm-hp{display:flex;color:var(--cr2)}
.att-sc .vlm-n{min-width:2ch;text-align:right;font-family:'Newsreader',Georgia,serif;font-weight:300;font-size:1.7rem;line-height:1}
.att-sc .vlm-dit{margin-top:8px}
.att-sc .vlm-allie-z{margin-top:18px}
.att-sc .vlm-carte{padding:14px 16px;border-radius:18px;border:1.5px solid color-mix(in srgb,var(--a) 65%,transparent);background:color-mix(in srgb,var(--a) 9%,transparent)}
.att-sc .vlm-carte .att-lab{color:var(--a)}
.att-sc .vlm-carte .vlm-allie{font-size:23px;padding:4px 0 8px;border-bottom-color:rgba(242,233,228,.14)}
.att-sc .vlm-carte .vlm-allie:focus{border-bottom-color:var(--a)}
.att-sc .vlm-long{display:flex;flex-direction:column;gap:4px;margin-top:10px}
.att-sc .vlm-long span{display:block;height:3px;border-radius:2px;background:rgba(242,233,228,.06)}
.att-sc .vlm-long i{display:block;width:0;height:100%;border-radius:2px;transition:width .3s ease}
.att-sc .vlm-long .c i{background:rgba(242,233,228,.3)}
.att-sc .vlm-long .a i{background:var(--a)}
.att-sc .vlm-longt{margin:6px 0 0;font-size:.8rem;color:var(--cr3)}

/* ---------- La promesse tenue ---------- */
.att-sc .pro-flash{margin:0 0 12px;text-align:center;font-family:'Newsreader',Georgia,serif;font-style:italic;font-weight:300;font-size:1.05rem;color:var(--a)}
.att-sc .pro-carte{margin-top:4px}
.att-sc .pro-champ{font-size:20px}
.att-sc .pro-sous{margin:8px 0 0;font-size:.8rem;color:var(--cr3)}
.att-sc .pro-red{gap:6px;margin-top:10px}
.att-sc .pro-red .att-chip{padding:7px 13px;font-size:.82rem}
.att-sc .pro-t-grand{margin:2px 0 0;font-family:'Newsreader',Georgia,serif;font-style:italic;font-weight:300;font-size:1.45rem;line-height:1.3;overflow-wrap:anywhere}
.att-sc .pro-cal{display:grid;grid-template-columns:repeat(10,minmax(0,1fr));gap:9px 4px;justify-items:center;margin:22px 0 0}
.att-sc .pro-cal i{display:block;width:min(25px,100%);aspect-ratio:1;border-radius:50%;box-sizing:border-box}
.att-sc .pro-cal i.tenue{background:var(--a)}
.att-sc .pro-cal i.reduite{border:2px solid var(--a)}
.att-sc .pro-cal i.attente{border:1.5px dashed color-mix(in srgb,var(--a) 75%,transparent)}
.att-sc .pro-cal i.rien{border:1px solid rgba(242,233,228,.14)}
.att-sc .pro-cal i.futur{border:1px solid rgba(242,233,228,.06)}
.att-sc .pro-cal i.auj{background-image:radial-gradient(circle,rgba(242,233,228,.6) 0 2.5px,transparent 3px)}
.att-sc .pro-leg{display:flex;justify-content:center;flex-wrap:wrap;gap:6px 18px;margin-top:12px;font-size:.78rem;color:var(--cr2)}
.att-sc .pro-leg i{display:inline-block;width:8px;height:8px;margin-right:6px;border-radius:50%;vertical-align:1px}
.att-sc .pro-leg i.tenue{background:var(--a)}
.att-sc .pro-leg i.reduite{border:1.5px solid var(--a)}
.att-sc .pro-stats{display:flex;justify-content:center;gap:34px;margin-top:16px}
.att-sc .pro-stats div{text-align:center}
.att-sc .pro-stats b{display:block;font-family:'Newsreader',Georgia,serif;font-weight:300;font-size:2.2rem;line-height:1}
.att-sc .pro-stats span{font-size:.75rem;color:var(--cr3)}
.att-sc .pro-vide{margin:14px 10px 0;text-align:center;font-size:.84rem;line-height:1.5;color:var(--cr2)}
.att-sc .pro-der{list-style:none;margin:18px 0 0;padding:0;border-top:1px solid var(--tr)}
.att-sc .pro-der li{display:grid;grid-template-columns:64px 1fr auto;gap:10px;align-items:baseline;padding:11px 0;border-bottom:1px solid var(--tr);font-size:.88rem}
.att-sc .pro-j{font-size:.76rem;color:var(--cr3)}
.att-sc .pro-t{overflow-wrap:anywhere}
.att-sc .pro-t em{font-family:'Newsreader',Georgia,serif;font-style:italic;color:var(--a)}
.att-sc .pro-e{font-size:.76rem;color:var(--cr3)}
.att-sc .pro-e.tenue{color:var(--a)}
.att-sc .pro-q{margin-top:26px}

@media (prefers-reduced-motion: reduce){.att-sc .frc-carte,.att-sc .mur-neuve,.att-sc .bon-c,.att-sc .pc-carte,.att-sc .vlm-phrase{animation:none !important;transition:none !important}}

/* ---------- Détente : scan, ancrage, sable, bâillement, main, mâchoire, paumes, poids ---------- */
/* socle commun (préfixe dtn-) */
.att-sc .dtn{position:relative;flex:1;display:flex;flex-direction:column;min-height:100%;overflow:hidden}
.att-sc .dtn-reglages{position:relative;z-index:2;display:flex;flex-direction:column;align-items:center;gap:8px;padding:2px 18px 0;transition:opacity .9s ease,visibility .9s}
.att-sc .dtn-reglages .att-chips{justify-content:center;gap:6px}
.att-sc .dtn-reglages .att-chip{position:relative;padding:7px 13px;font-size:.8rem;line-height:1.2}
.att-sc .dtn-reglages .att-chip::after{content:"";position:absolute;inset:-6px -2px}
.att-sc .dtn-reglages.dtn-parti{opacity:0;visibility:hidden;pointer-events:none}
.att-sc .dtn-scene{position:relative;flex:1 1 auto;min-height:190px;margin:6px 0 0}
.att-sc .dtn-scene>svg{position:absolute;inset:0;width:100%;height:100%;display:block;overflow:visible}
.att-sc .dtn-txt{position:relative;z-index:2;flex:none;padding:0 26px;text-align:center;min-height:5.6em}
.att-sc .dtn-txt .att-consigne{font-size:1.5rem;line-height:1.3;text-wrap:balance}
.att-sc .dtn-txt .att-doux{text-wrap:balance}
.att-sc .dtn-txt .att-consigne.dtn-grand{font-size:1.3rem;line-height:1.36;max-width:420px;margin:0 auto}
.att-sc .dtn-txt .att-doux{margin-top:8px;min-height:1.5em}
.att-sc .dtn-t{transition:opacity .45s ease}
.att-sc .dtn-t.dtn-off{opacity:0}
.att-sc .dtn .att-bas{position:relative;z-index:2;padding-top:10px}
.att-sc .dtn .att-cta.nu{color:var(--cr);border-color:rgba(242,233,228,.22)}
.att-sc .dtn-points{display:flex;justify-content:center;align-items:center;gap:8px;min-height:24px}
.att-sc .dtn-points i{display:block;width:6px;height:6px;border-radius:3px;background:rgba(242,233,228,.18);transition:width .8s ease,background-color .8s ease}
.att-sc .dtn-points i.fait{background:rgba(242,179,107,.5)}
.att-sc .dtn-points i.on{width:24px;background:var(--a)}

/* le scan éclair */
.att-sc .scn-lab,.att-sc .scn-fil,.att-sc .scn-halos{transition:opacity .7s ease}
.att-sc .scn-rep .att-cta{min-height:54px}
.att-sc .scn-rep .att-cta:disabled{opacity:.3}

/* la minute d'ancrage */
.att-sc .anc-txt{padding-top:14px;min-height:6.4em}
.att-sc .anc-scene{position:relative;flex:1;display:flex;align-items:center;justify-content:center;min-height:230px;padding:10px 0}
.att-sc .anc-cercle{display:block;width:min(66vw,260px,40vh);aspect-ratio:1;min-width:190px;border:0;padding:0;border-radius:50%;background:transparent;cursor:pointer;touch-action:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;transition:transform 1.2s ease,opacity 1.2s ease}
.att-sc .anc-cercle svg{display:block;width:100%;height:100%;overflow:visible}
.att-sc .anc-cercle:focus-visible{outline:2px solid var(--a);outline-offset:6px}
.att-sc .anc-cercle.tenu{transform:scale(.985)}
.att-sc .anc-empreinte{transition:stroke-opacity .8s}
.att-sc .anc-cercle.tenu .anc-empreinte{stroke-opacity:.5}
.att-sc .anc-pret{position:absolute;z-index:3;left:0;right:0;top:40%;margin:0;text-align:center;font-family:'Newsreader',Georgia,serif;font-style:italic;font-weight:300;font-size:3.6rem;line-height:1;color:var(--a);animation:dtn-lent 1.6s ease both}
.att-sc .anc-pret[hidden]{display:none !important}
.att-sc .anc-fini .anc-cercle,.att-sc .anc-fini .anc-txt,.att-sc .anc-fini .anc-bas{opacity:0;transition:opacity 1.4s ease}
.att-sc .anc-bas .att-note{margin:0}
@keyframes dtn-lent{from{opacity:0}to{opacity:1}}

/* le sable qui coule */
.att-sc .sab-voile{position:fixed;inset:0;z-index:20;background:#000;display:flex;align-items:flex-end;justify-content:center;padding:0 24px calc(40px + env(safe-area-inset-bottom));cursor:pointer;animation:dtn-lent 1.8s ease both}
.att-sc .sab-voile[hidden]{display:none !important}
.att-sc .sab-voile span{font-size:.78rem;color:rgba(242,233,228,.16);text-align:center}
.att-sc .sab-voile:focus{outline:none}
.att-sc .sab-lab{transition:opacity .6s}
.att-sc .sab-terminer[hidden]{display:none !important}

/* le bâillement volontaire */
.att-sc .bai-scene{min-height:170px}
.att-sc .bai-txt{min-height:0}
.att-sc .bai-vagues{display:block;height:16px;max-width:100%;margin:16px auto 0;overflow:visible}
.att-sc .bai-v{stroke-dasharray:1;stroke-dashoffset:1;transition:stroke-dashoffset 1.6s ease}
.att-sc .bai-v.on{stroke-dashoffset:0}
.att-sc .bai-compte{margin:8px 0 0;font-size:.92rem;color:var(--cr2);text-align:center}

/* la main qui rassure */
.att-sc .min::before{content:"";position:absolute;inset:0;background:#07040E;opacity:0;transition:opacity 2.4s ease;pointer-events:none;z-index:0}
.att-sc .min.sombre::before{opacity:.55}
.att-sc .min>*{position:relative;z-index:1}
.att-sc .min .dtn-sil,.att-sc .min .min-ui,.att-sc .min .min-note{transition:opacity 2.4s ease}
.att-sc .min.sombre .dtn-sil{opacity:.45}
.att-sc .min.sombre .min-ui,.att-sc .min.sombre .min-note{opacity:.28}
.att-sc .min-scene{min-height:200px}
.att-sc .min-milieu{flex:none;display:flex;flex-direction:column;align-items:center;padding:4px 20px 0}
.att-sc .min-phrase{margin:0 0 14px;font-family:'Newsreader',Georgia,serif;font-style:italic;font-weight:300;font-size:1.95rem;line-height:1.2;text-align:center;color:var(--cr)}
.att-sc .min-lieu{justify-content:center;gap:8px}
.att-sc .min-lieu .att-chip{position:relative;padding:8px 14px;font-size:.84rem}
.att-sc .min-lieu .att-chip::after{content:"";position:absolute;inset:-5px -2px}
.att-sc .min-ecrire{margin-top:6px;min-height:44px;padding:0 14px;border:0;background:none;color:var(--cr3);font-size:.82rem;text-decoration:underline;text-decoration-color:rgba(242,233,228,.2);text-underline-offset:3px;cursor:pointer}
.att-sc .min-champ{display:flex;align-items:flex-end;gap:10px;width:100%;max-width:340px;margin-top:4px}
.att-sc .min-champ[hidden]{display:none !important}
.att-sc .min-champ .att-champ{flex:1;min-width:0}
.att-sc .min-champ .att-chip{flex:none;min-height:40px}
.att-sc .min .att-note{margin-bottom:12px;min-height:1.45em}

/* la mâchoire qui se desserre */
.att-sc .mac .dtn-scene{margin-top:14px}

/* les paumes sur les yeux */
.att-sc .pau-voile{position:absolute;inset:0;z-index:1;background:#030108;opacity:0;pointer-events:none}
.att-sc .pau .dtn-txt,.att-sc .pau .att-bas,.att-sc .pau .dtn-reglages{z-index:2}
.att-sc .pau-txt{transition:opacity 2s ease}
.att-sc .pau-nuit .pau-txt{opacity:.5}

/* le poids du corps */
.att-sc .poi .dtn-scene{margin-top:10px}
.att-sc .poi-allonge .dtn-scene{min-height:140px}
@media (max-width:360px){
  .att-sc .min-lieu .att-chip{padding:7px 10px;font-size:.78rem}
  .att-sc .min-lieu{gap:6px}
  .att-sc .min-phrase{font-size:1.7rem;margin-bottom:10px}
}

/* ---------- Détente (2) : visage, serrer, chaleur, balancier, sons, étirement, doigts ---------- */
.att-sc .dt2{position:relative;flex:1;display:flex;flex-direction:column;min-height:100%}
.att-sc .dt2-reg{display:flex;flex-direction:column;align-items:center;gap:8px;padding:2px 16px 0}
.att-sc .dt2-reg .att-chips{justify-content:center;gap:6px}
.att-sc .dt2-reg .att-chip{position:relative;padding:7px 14px;font-size:.8rem;line-height:1.3}
.att-sc .dt2-reg .att-chip::before{content:"";position:absolute;left:-3px;right:-3px;top:-5px;bottom:-5px}
.att-sc .dt2-scene{position:relative;flex:1 1 auto;min-height:230px}
.att-sc .dt2-svg{position:absolute;left:12px;top:8px;width:calc(100% - 24px);height:calc(100% - 16px);display:block;overflow:visible;touch-action:none}
.att-sc .dt2-txt{padding:0 26px;text-align:center;min-height:124px;transition:opacity .34s ease}
.att-sc .dt2-txt.sort{opacity:0}
.att-sc .dt2-lab{color:var(--a);margin:0 0 6px;min-height:1.1em;opacity:.9}
.att-sc .dt2-c{font-size:1.45rem;line-height:1.28}
.att-sc .dt2-a{margin:8px auto 0;max-width:330px}
.att-sc .dt2-pts{display:flex;justify-content:center;gap:6px;min-height:3px;padding-top:12px}
.att-sc .dt2-pts:empty{display:none !important}
.att-sc .dt2-pts i{display:block;width:22px;height:3px;border-radius:2px;background:rgba(242,233,228,.13);transition:background .8s ease}
.att-sc .dt2-pts i.on{background:color-mix(in srgb,var(--a) 60%,transparent)}
.att-sc .dt2-pts i.la{background:var(--a)}
.att-sc .dt2-bas{padding-top:14px}
.att-sc .dt2-stop{min-height:48px;font-size:.92rem;font-weight:500}
/* les sons : l'écran noir complet */
.att-sc .snd-noir{position:fixed;inset:0;z-index:50;display:flex;align-items:flex-end;justify-content:center;width:100%;height:100%;margin:0;padding:0 0 calc(40px + env(safe-area-inset-bottom));border:0;border-radius:0;background:#000;cursor:pointer;touch-action:manipulation}
.att-sc .snd-noir[hidden]{display:none !important}
.att-sc .snd-noir span{font-size:.82rem;color:rgba(242,233,228,.32);transition:opacity 2.4s ease}
.att-sc .snd-noir.eteint span{opacity:0}
.att-sc .snd-noir:focus-visible{outline:none}
@media (max-height:700px){
  .att-sc .dt2-txt{min-height:112px}
  .att-sc .dt2-c{font-size:1.3rem}
  .att-sc .dt2-a{font-size:.86rem}
  .att-sc .dt2-bas{padding-top:8px;padding-bottom:calc(14px + env(safe-area-inset-bottom))}
}

/* ---------- Le paysage sûr ---------- */
.att-sc .pay{position:relative;flex:1;display:flex;flex-direction:column;min-height:100%}
/* le dessin couvre tout l'écran, derrière l'en-tête (z-index négatif dans la scène) */
.att-sc .pay-fond{position:fixed;inset:0;z-index:-1;overflow:hidden;background:#140D24;pointer-events:none}
.att-sc .pay-dessin,.att-sc .pay-calque{position:absolute;inset:0}
.att-sc .pay-calque{opacity:0;transition:opacity .8s ease}
.att-sc .pay-calque.la{opacity:1}
.att-sc .pay-svg{position:absolute;inset:0;width:100%;height:100%;display:block}
.att-sc .pay-teinte{position:absolute;inset:0;opacity:0;transition:opacity 1.2s ease}
.att-sc .pay-teinte[data-t="frais"]{opacity:1;background:linear-gradient(180deg,rgba(140,190,255,.12),rgba(120,170,240,.05) 60%,rgba(120,170,240,0))}
.att-sc .pay-teinte[data-t="chaud"]{opacity:1;background:linear-gradient(180deg,rgba(255,170,90,.04),rgba(255,150,70,.1))}
.att-sc .pay-v{position:absolute;left:0;right:0;opacity:0;transition:opacity 1.1s ease}
.att-sc .pay-v-haut{top:0;height:24%;opacity:1;background:linear-gradient(180deg,rgba(12,8,24,.55),rgba(12,8,24,.22) 55%,rgba(12,8,24,0))}
.att-sc .pay-v-bas{bottom:0;height:44%;background:linear-gradient(180deg,rgba(12,8,24,0),rgba(12,8,24,.42) 38%,rgba(12,8,24,.8))}
.att-sc .pay-v-fort{bottom:0;height:62%;background:linear-gradient(180deg,rgba(14,9,27,0),rgba(14,9,27,.66) 34%,rgba(14,9,27,.94) 70%)}
.att-sc .pay-v-plein{top:0;bottom:0;background:rgba(18,11,33,.86)}
.att-sc .pay[data-mode="scene"] .pay-v-bas,.att-sc .pay[data-mode="pret"] .pay-v-fort,.att-sc .pay[data-mode="compo"] .pay-v-plein{opacity:1}
.att-sc .pay-vue{position:relative;flex:1;display:flex;flex-direction:column;min-height:100%}

/* 1. composer */
.att-sc .pay-compo{flex:1;display:flex;flex-direction:column;min-height:100%}
.att-sc .pay-tete{padding:8px 22px 0}
.att-sc .pay-tete .att-lab{color:var(--a)}
.att-sc .pay-sec{padding:18px 22px 0;margin:0}
.att-sc .pay-lab{margin:0 0 10px !important;font-family:'Karla',sans-serif !important;font-size:.7rem !important;letter-spacing:.14em !important;text-transform:uppercase !important;font-weight:600 !important;color:var(--cr3) !important}
.att-sc .pay-lab label{cursor:pointer}
.att-sc .pay-grille{display:grid;grid-auto-flow:column;grid-template-rows:repeat(2,auto);grid-auto-columns:min(142px,40vw);gap:10px;overflow-x:auto;overflow-y:hidden;margin:0 -22px;padding:0 22px 4px;scroll-snap-type:x proximity;scroll-padding:0 22px;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.att-sc .pay-grille::-webkit-scrollbar{display:none}
.att-sc .pay-vig{position:relative;display:block;width:100%;height:100px;padding:0;margin:0;border-radius:16px;overflow:hidden;border:1.5px solid rgba(242,233,228,.14);background:#241838;cursor:pointer;scroll-snap-align:start;color:#FFF8F0;text-align:left;-webkit-tap-highlight-color:transparent}
.att-sc .pay-vig-img,.att-sc .pay-vig-img .pay-svg{position:absolute;inset:0;width:100%;height:100%;display:block}
.att-sc .pay-vig::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(10,6,20,0) 45%,rgba(10,6,20,.72));pointer-events:none}
.att-sc .pay-vig-nom{position:absolute;z-index:1;left:10px;right:8px;bottom:8px;font-family:'Karla',sans-serif;font-size:.8rem;font-weight:600;line-height:1.2;color:#FFF8F0}
.att-sc .pay-vig[aria-checked="true"]{border-color:var(--a);border-width:2.5px}
.att-sc .pay-vig[aria-checked="true"]::before{content:"";position:absolute;z-index:2;top:8px;right:8px;width:22px;height:22px;border-radius:50%;background:var(--a) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6 12.5l4 4 8-9' fill='none' stroke='%231B122F' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/16px no-repeat}
.att-sc .pay-vig:focus-visible{outline:2px solid var(--a);outline-offset:2px}
.att-sc .pay-moments,.att-sc .pay-temps{gap:8px}
.att-sc .pay-odeur{font-size:19px}
.att-sc .pay-note{font-size:.78rem;color:var(--cr3);margin:8px 0 0;line-height:1.4}
.att-sc .pay-compo-bas{position:sticky;bottom:0;z-index:2;margin-top:auto;padding-top:22px;background:linear-gradient(180deg,rgba(18,11,33,0),rgba(18,11,33,.94) 26px)}

/* 3. prêt en un geste */
.att-sc .pay-pret{flex:1;display:flex;flex-direction:column;justify-content:flex-end;min-height:100%}
.att-sc .pay-pret-bas{padding:0 26px calc(20px + env(safe-area-inset-bottom));text-align:center}
.att-sc .pay-mon{font-family:'Newsreader',Georgia,serif;font-weight:300;font-size:1.72rem;line-height:1.22;margin:0;color:var(--cr);text-wrap:balance}
.att-sc .pay-mon span{display:block;font-family:'Karla',sans-serif;font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;font-weight:600;color:var(--a);margin:0 0 8px}
.att-sc .pay-mon-d{font-size:.92rem;color:var(--cr2);margin:10px 0 0}
.att-sc .pay-mon-d i{font-family:'Newsreader',Georgia,serif;font-size:1.05rem}
.att-sc .pay-mon-n{font-size:.8rem;color:var(--cr3);margin:14px 0 16px}
.att-sc .pay-changer{display:inline-flex;align-items:center;justify-content:center;min-height:44px;margin-top:6px;padding:0 16px;background:none;border:0;color:var(--cr2);font-size:.88rem;text-decoration:underline;text-decoration-color:rgba(242,233,228,.3);text-underline-offset:4px;cursor:pointer}

/* 2. la scène */
.att-sc .pay-scene{flex:1;display:flex;flex-direction:column;min-height:100%}
.att-sc .pay-puces{display:flex;flex-wrap:wrap;gap:8px;margin:0;padding:4px 18px 0;list-style:none}
.att-sc .pay-puces li{margin:0;padding:6px 13px;border-radius:999px;font-size:.8rem;font-weight:600;line-height:1.3;color:#FBF4EE;background:rgba(20,13,38,.3);border:1px solid rgba(255,255,255,.24);-webkit-backdrop-filter:blur(10px) saturate(1.3);backdrop-filter:blur(10px) saturate(1.3);max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.att-sc .pay-puces li.it{font-family:'Newsreader',Georgia,serif;font-style:italic;font-weight:400;font-size:.9rem}
.att-sc .pay-bas{margin-top:auto;padding:0 24px calc(16px + env(safe-area-inset-bottom));text-align:center}
.att-sc .pay-texte{transition:opacity .7s ease;min-height:6.2em}
.att-sc .pay-texte.sort{opacity:0}
.att-sc .pay-consigne{font-size:1.62rem;color:#FBF4EE}
.att-sc .pay-sous{font-size:.95rem;color:rgba(251,244,238,.8);margin:8px auto 0;max-width:340px;line-height:1.45;text-wrap:balance}
.att-sc .pay-sous.it{font-family:'Newsreader',Georgia,serif;font-style:italic;font-size:1.25rem;color:#FBF4EE}
.att-sc .pay-infos{display:flex;justify-content:center;align-items:center;gap:10px;margin-top:14px}
.att-sc .pay-son,.att-sc .pay-sortir{display:inline-flex;align-items:center;gap:9px;min-height:44px;padding:0 16px;border-radius:999px;border:1px solid rgba(255,255,255,.2);background:rgba(20,13,38,.3);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);color:#FBF4EE;font-size:.85rem;font-weight:600;cursor:pointer;white-space:nowrap}
.att-sc .pay-duree{color:rgba(251,244,238,.66);font-weight:500}
.att-sc .pay-sortir{color:rgba(251,244,238,.85)}
.att-sc .pay-barres{display:inline-flex;align-items:center;gap:2.5px;height:16px}
.att-sc .pay-barres i{display:block;width:2.5px;height:100%;border-radius:2px;background:var(--a);transform-origin:50% 50%;animation:pay-barre 1.8s ease-in-out infinite alternate}
.att-sc .pay-barres i:nth-child(2){animation-delay:-.6s;animation-duration:2.2s}
.att-sc .pay-barres i:nth-child(3){animation-delay:-1.1s;animation-duration:1.6s}
.att-sc .pay-barres i:nth-child(4){animation-delay:-.3s;animation-duration:2s}
.att-sc .pay-son.off .pay-barres i{animation:none;transform:scaleY(.25);background:rgba(251,244,238,.5)}
@keyframes pay-barre{from{transform:scaleY(.3)}to{transform:scaleY(1)}}
.att-sc .pay-son:focus-visible,.att-sc .pay-sortir:focus-visible,.att-sc .pay-changer:focus-visible{outline:2px solid var(--a);outline-offset:3px}
@media (max-height:700px){.att-sc .pay-mon{font-size:1.4rem}.att-sc .pay-mon span{margin-bottom:4px}.att-sc .pay-mon-d{margin-top:6px}.att-sc .pay-mon-n{display:none}.att-sc .pay-pret-bas .att-cta{margin-top:14px}.att-sc .pay-changer{margin-top:2px}.att-sc .pay-consigne{font-size:1.4rem}.att-sc .pay-texte{min-height:5.4em}.att-sc .pay-sous.it{font-size:1.12rem}}

/* ---------- Conscience de soi & Réflexion (exos-reflexion.js) ---------- */
.att-sc .rfx{position:relative;flex:1;display:flex;flex-direction:column;min-height:100%;padding-bottom:0}
.att-sc .rfx [hidden]{display:none !important}
.att-sc .rfx .att-h{font-size:1.72rem}
.att-sc .rfx .att-bas{padding-top:14px}
.att-sc .rfx .att-bas .rfx-lien{display:block;margin:0 auto 6px}
.att-sc .rfx-lien{display:inline-flex;align-items:center;justify-content:center;min-height:44px;background:none;border:0;color:var(--a);font-size:.9rem;font-weight:600;padding:8px 10px;cursor:pointer;text-decoration:underline;text-decoration-color:color-mix(in srgb,var(--a) 45%,transparent);text-underline-offset:4px}
.att-sc .rfx .att-lab{letter-spacing:.16em}
.att-sc .rfx .att-cta:disabled{opacity:.35}
.att-sc .rfx .att-chip{min-height:40px}
.att-sc .rfx-cadenas{width:30px;height:36px;color:var(--cr3)}
.att-sc .rfx-cadenas .rfx-anse{transition:transform .8s cubic-bezier(.3,.7,.3,1);transform:translateY(-5px)}
.att-sc .rfx-cadenas.ferme .rfx-anse{transform:none}

/* panneau (relire) */
.att-sc .rfx-pan{position:fixed;inset:0;z-index:40;display:flex;justify-content:center;background:linear-gradient(180deg,#1E1433 0,#170F29 60%,#120B21 100%);animation:att-apparait .25s ease both}
.att-sc .rfx-pan-in{width:100%;max-width:560px;display:flex;flex-direction:column;min-height:0}
.att-sc .rfx-pan-t{flex:none;display:flex;align-items:center;gap:12px;padding:calc(14px + env(safe-area-inset-top)) 22px 10px;border-bottom:1px solid var(--tr)}
.att-sc .rfx-pan-h{font-family:'Newsreader',Georgia,serif;font-weight:300;font-size:1.6rem;margin:0;flex:1}
.att-sc .rfx-pan-x{min-height:44px;border:1px solid var(--tr);background:var(--vo);color:var(--cr);border-radius:999px;padding:0 18px;font-weight:600;font-size:.9rem;cursor:pointer}
.att-sc .rfx-pan-c{flex:1;overflow-y:auto;-webkit-overflow-scrolling:touch;padding:14px 22px calc(28px + env(safe-area-inset-bottom))}
.att-sc .rfx-pan-st{font-family:'Newsreader',Georgia,serif;font-style:italic;font-weight:300;color:var(--cr2);font-size:1.02rem;margin:4px 0 14px}
.att-sc .rfx-pan-vide{font-family:'Newsreader',Georgia,serif;font-style:italic;font-weight:300;font-size:1.2rem;color:var(--cr2);text-align:center;margin:60px 10px}
.att-sc .rfx-page{padding:14px 0 12px;border-bottom:1px solid var(--tr)}
.att-sc .rfx-page .att-lab{color:var(--a);margin-bottom:6px}
.att-sc .rfx-page p{margin:6px 0 0;font-family:'Newsreader',Georgia,serif;font-style:italic;font-weight:300;font-size:1.08rem;line-height:1.4;overflow-wrap:anywhere}
.att-sc .rfx-page p small{display:block;font-family:'Karla',sans-serif;font-style:normal;font-size:.72rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--cr3);margin-bottom:1px}
.att-sc .rfx-page .rfx-page-t{font-style:normal;font-size:1.15rem}

/* ===== météo ===== */
.att-sc .met-lignes{display:flex;flex-direction:column;gap:18px;margin-top:22px}
.att-sc .met-lh{display:flex;align-items:center;justify-content:space-between;margin-bottom:2px}
.att-sc .met-nom{font-size:.98rem;font-weight:500}
.att-sc .met-v{display:inline-flex;align-items:center;gap:10px;color:var(--a)}
.att-sc .met-v b{min-width:1.3em;text-align:right;color:var(--cr);font-weight:700;font-size:1rem;font-variant-numeric:tabular-nums}
.att-sc .met-p{display:inline-flex;width:22px;height:22px}
.att-sc .met.note .met-lignes{opacity:.7}
.att-sc .met-reglette:disabled{cursor:default}
.att-sc .met-zone-carte{margin-top:22px}
.att-sc .met-carte{padding:16px 16px 14px;border-radius:20px;animation:att-apparait .5s ease both}
.att-sc .met-ch{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px}
.att-sc .met-ct{font-size:.86rem;font-weight:600;color:var(--cr2)}
.att-sc .met-bascule{display:flex;border:1px solid var(--tr);border-radius:999px;padding:2px}
.att-sc .met-bascule button{border:0;background:none;color:var(--cr3);font-size:.74rem;font-weight:600;padding:6px 10px;border-radius:999px;cursor:pointer;min-height:32px;white-space:nowrap}
.att-sc .met-bascule button[aria-pressed="true"]{background:rgba(242,233,228,.1);color:var(--cr)}
.att-sc .met-barres{position:relative;display:flex;align-items:flex-end;gap:8px;height:92px;margin-top:14px}
.att-sc .met-col{flex:1;min-width:0;display:flex;flex-direction:column;align-items:center;height:100%}
.att-sc .met-piste{flex:1;width:100%;display:flex;align-items:flex-end;justify-content:center}
.att-sc .met-b{display:block;width:100%;max-width:34px;border-radius:7px;background:rgba(242,233,228,.16);transform-origin:bottom}
.att-sc .met-col.auj .met-b{background:var(--a)}
.att-sc .met-vide{display:block;width:100%;max-width:34px;height:4px;border-radius:2px;border-top:1.5px dashed rgba(242,233,228,.22)}
.att-sc .met-col span{font-size:.68rem;color:var(--cr3);margin-top:6px;line-height:1}
.att-sc .met-col.auj span{color:var(--a);font-weight:700}
.att-sc .met-barres.fines{gap:2px;height:84px;margin-bottom:18px}
.att-sc .met-barres.fines .met-b{border-radius:2px}
.att-sc .met-barres.fines .met-vide{border-top-width:1px}
.att-sc .met-bornes{position:absolute;left:0;right:0;bottom:-18px;display:flex;justify-content:space-between;font-size:.66rem;color:var(--cr3)}
.att-sc .met-msg{margin:14px 0 0;font-size:.88rem;line-height:1.45;color:var(--cr2)}
.att-sc .met-msg b{color:var(--a);font-weight:600}

/* ===== besoin ===== */
.att-sc .bes-emos{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:22px}
.att-sc .bes-emo{min-height:58px;border-radius:18px;border:1px solid rgba(242,233,228,.16);background:rgba(242,233,228,.04);color:var(--cr);font-family:'Newsreader',Georgia,serif;font-style:italic;font-weight:300;font-size:1.3rem;cursor:pointer}
.att-sc .bes-emo:active{background:color-mix(in srgb,var(--a) 22%,transparent)}
.att-sc .bes-haut{display:flex;align-items:center;gap:10px}
.att-sc .bes-sens{font-size:.95rem;color:var(--cr2)}
.att-sc .bes-emo-choisie{min-height:36px !important;padding:6px 14px}
.att-sc .bes-q{margin-top:10px !important}
.att-sc .bes-b{margin-top:16px}
.att-sc .bes-b .att-chip{border-radius:14px}
.att-sc .bes-ajout{border-style:dashed !important;color:var(--cr2) !important}
.att-sc .bes-mien{display:flex;gap:10px;align-items:flex-end;margin-top:10px}
.att-sc .bes-mien .att-champ{flex:1}
.att-sc .bes-aide{font-size:.78rem;color:var(--cr3);margin:10px 0 0}
.att-sc .bes-phrase{border-top:0;border-right:0;border-bottom:0;margin:18px 0 0;padding:16px 18px;border-left:2px solid var(--a);border-radius:0 16px 16px 0;background:linear-gradient(90deg,color-mix(in srgb,var(--a) 11%,transparent),transparent);font-family:'Newsreader',Georgia,serif;font-style:italic;font-weight:300;font-size:1.28rem;line-height:1.38;color:var(--cr);transition:opacity .4s}
.att-sc .bes-phrase em{color:var(--a);font-style:italic}
.att-sc .bes-phrase.vide{opacity:.55}
.att-sc .bes-petit-z{margin-top:20px}

/* ===== bilan ===== */
.att-sc .bil-lignes{display:flex;flex-direction:column;gap:12px;margin-top:20px}
.att-sc .bil-l{position:relative;display:block;border:1px solid var(--tr);background:var(--vo);border-radius:18px;padding:13px 18px 8px;cursor:text;transition:border-color .3s,opacity .8s}
.att-sc .bil-l:focus-within{border-color:color-mix(in srgb,var(--a) 60%,transparent)}
.att-sc .bil-l .att-lab{font-size:.64rem;margin-bottom:2px}
.att-sc .bil-in{position:relative;display:block}
.att-sc .bil-l .att-champ{border-bottom:0;padding:2px 0 6px;font-size:19px}
.att-sc .bil-l.lache{border:1px dashed rgba(230,77,255,.5);background:rgba(230,77,255,.04)}
.att-sc .bil-l.lache .att-lab{color:#E98BFF}
.att-sc .bil-l.lache:focus-within{border-color:#E64DFF}
.att-sc .bil-grain{position:absolute;right:0;top:50%;width:62px;height:24px;transform:translateY(-55%);background-image:radial-gradient(circle,rgba(242,233,228,.34) 1px,transparent 1.4px);background-size:7px 7px;-webkit-mask-image:linear-gradient(90deg,transparent,#000);mask-image:linear-gradient(90deg,transparent,#000);pointer-events:none}
.att-sc .bil-l.lache .att-champ{padding-right:66px}
.att-sc .bil-poussiere{position:absolute;left:0;top:2px;right:0;white-space:nowrap;overflow:visible;pointer-events:none;font-family:'Newsreader',Georgia,serif;font-style:italic;font-weight:300;font-size:19px;line-height:1.45;color:var(--cr)}
.att-sc .bil-poussiere span{display:inline-block;animation:bil-part 1.1s ease-in forwards;animation-delay:var(--d)}
@keyframes bil-part{0%{opacity:1;transform:none;filter:none}35%{color:#E98BFF}100%{opacity:0;transform:translate(var(--x),var(--y)) scale(.6);filter:blur(3px)}}
.att-sc .bil-l.part .bil-grain{animation:bil-grain 2.4s ease-out forwards}
@keyframes bil-grain{to{opacity:0;transform:translate(24px,-70%)}}
.att-sc .bil-l.vide{opacity:.5}
.att-sc .bil-l.vide .att-lab{color:var(--cr2)}
.att-sc .bil-aide{margin-top:18px;font-size:.84rem;color:var(--cr3)}
.att-sc .bil .centre{margin:6px 0 0}

/* ===== film ===== */
.att-sc .fil-tabs{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:6px;padding:4px 16px 0}
.att-sc .fil-tab{position:relative;min-height:40px;border:1px solid var(--tr);background:var(--vo);color:var(--cr2);border-radius:12px;font-size:.78rem;font-weight:600;padding:0 2px;cursor:pointer;white-space:nowrap}
.att-sc .fil-tab[aria-selected="true"]{background:var(--a);border-color:var(--a);color:#1B122F}
.att-sc .fil-tab.passe{color:var(--cr)}
.att-sc .fil-tab:disabled{cursor:default;color:var(--cr2)}
.att-sc .fil-nb{position:absolute;top:-6px;right:-3px;min-width:17px;height:17px;border-radius:9px;background:#E64DFF;color:#fff;font-style:normal;font-size:.64rem;line-height:17px;font-weight:700;padding:0 4px}
.att-sc .fil-nb:empty{display:none}
.att-sc .fil-tete{text-align:center;padding-top:14px}
.att-sc .fil-t{font-size:1.5rem !important}
.att-sc .fil-q{font-size:1.14rem;margin-top:2px}
.att-sc .fil-evoc{display:block;font-family:'Karla',sans-serif;font-style:normal;font-size:.8rem;color:var(--cr3);margin-top:4px}
.att-sc .fil-scene{flex:1 0 auto;display:flex;align-items:center;justify-content:center;padding:8px 0 4px;min-height:0}
.att-sc .fil-svg{display:block;height:clamp(190px,calc(100vh - 420px),360px);height:clamp(190px,calc(100dvh - 420px),360px);width:auto;aspect-ratio:200/360;overflow:visible;touch-action:manipulation;cursor:crosshair;-webkit-user-select:none;user-select:none}
.att-sc .fil.resume .fil-svg{cursor:default}
.att-sc .fil-mode{display:flex;justify-content:center;gap:10px;padding:4px 22px 0}
.att-sc .fil-mode button{display:inline-flex;align-items:center;gap:8px;min-height:40px;border:1px solid var(--tr);background:none;color:var(--cr2);border-radius:999px;padding:0 16px;font-size:.86rem;font-weight:600;cursor:pointer}
.att-sc .fil-mode button i{width:10px;height:10px;border-radius:50%}
.att-sc .fil-mode button[aria-pressed="true"]{border-color:rgba(242,233,228,.45);background:rgba(242,233,228,.08);color:var(--cr)}
.att-sc .fil.resume .fil-mode{display:none}
.att-sc .fil-aide{margin:10px 22px 0;min-height:2.9em;font-size:.84rem}

/* ===== pilote ===== */
.att-sc .pil-note{margin:12px 0 0;padding:10px 14px;border-radius:14px;background:color-mix(in srgb,var(--a) 10%,transparent);font-size:.86rem;line-height:1.45;color:var(--cr)}
.att-sc .pil-liste{display:flex;flex-direction:column;margin-top:14px;border-top:1px solid var(--tr)}
.att-sc .pil-opt{display:flex;align-items:center;gap:14px;min-height:50px;border:0;border-bottom:1px solid var(--tr);background:none;color:var(--cr);text-align:left;font-size:.98rem;padding:8px 2px;cursor:pointer}
.att-sc .pil-opt i{flex:none;width:20px;height:20px;border-radius:50%;border:1.5px solid rgba(242,233,228,.35)}
.att-sc .pil-opt[aria-checked="true"]{color:var(--a)}
.att-sc .pil-opt[aria-checked="true"] i{border-color:var(--a);background:radial-gradient(circle,var(--a) 0 5px,transparent 5.5px)}
.att-sc .pil-mien{padding:4px 0 0}
.att-sc .pil-d{margin-top:18px}
.att-sc .pil-geste{display:flex;align-items:center;gap:12px;margin-top:18px;padding:14px 16px}
.att-sc .pil-geste>div{flex:1;min-width:0}
.att-sc .pil-geste .att-lab{font-size:.62rem}
.att-sc .pil-geste b{display:block;font-family:'Newsreader',Georgia,serif;font-weight:400;font-size:1.22rem;line-height:1.25;overflow-wrap:anywhere}
.att-sc .pil-changer{flex:none;min-height:40px;border:0;background:none;color:var(--cr3);font-size:.8rem;text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.att-sc .pil-centre{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:18px 22px 6px}
.att-sc .pil-inter{position:relative;display:grid;grid-template-columns:1fr 1fr;width:196px;height:62px;border-radius:31px;border:1px solid var(--tr);background:rgba(242,233,228,.05);padding:5px;cursor:pointer}
.att-sc .pil-bouton{position:absolute;top:5px;left:5px;width:calc(50% - 5px);height:50px;border-radius:25px;background:rgba(242,233,228,.14);transition:transform .55s cubic-bezier(.3,.7,.3,1),background .55s}
.att-sc .pil-inter span{position:relative;display:flex;align-items:center;justify-content:center;font-size:.95rem;font-weight:600;color:var(--cr);transition:color .55s}
.att-sc .pil-inter .pil-m{color:var(--cr3)}
.att-sc .pil-inter.manuel .pil-bouton{transform:translateX(100%);background:var(--a)}
.att-sc .pil-inter.manuel .pil-a{color:var(--cr3)}
.att-sc .pil-inter.manuel .pil-m{color:#1B122F}
.att-sc .pil-compte{text-align:center;margin-top:16px}
.att-sc .pil-compte b{display:block;font-family:'Newsreader',Georgia,serif;font-weight:300;font-size:4rem;line-height:1}
.att-sc .pil-compte span{font-size:.86rem;color:var(--cr2)}
.att-sc .pil-frise{position:relative;width:100%;max-width:340px;height:44px;margin-top:18px}
.att-sc .pil-ligne{position:absolute;left:0;right:0;top:12px;height:1px;background:rgba(242,233,228,.2)}
.att-sc .pil-pts{position:absolute;left:0;right:0;top:12px}
.att-sc .pil-pts i{position:absolute;top:-4.5px;width:9px;height:9px;margin-left:-4.5px;border-radius:50%;background:var(--a)}
.att-sc .pil-pts i.neuf{animation:pil-neuf .9s ease-out}
@keyframes pil-neuf{from{transform:scale(2.4);opacity:.3}to{transform:none;opacity:1}}
.att-sc .pil-h{position:absolute;left:0;right:0;top:22px;display:flex;justify-content:space-between;font-size:.66rem;color:var(--cr3)}

/* ===== nuage ===== */
.att-sc .nua{position:relative;flex:1;display:flex;flex-direction:column;min-height:540px;overflow:hidden;-webkit-user-select:none;user-select:none}
.att-sc .nua [hidden]{display:none !important}
.att-sc .nua-svg{position:absolute;inset:0;display:block}
.att-sc .nua-ciel{position:absolute;left:0;right:0;top:0;height:62%;z-index:1;touch-action:none;-webkit-touch-callout:none}
.att-sc .nua-bas{position:relative;z-index:2;margin-top:auto;padding:0 22px calc(22px + env(safe-area-inset-bottom))}
.att-sc .nua-etape{display:flex;flex-direction:column;gap:8px}
.att-sc .nua-c{font-size:1.4rem}
.att-sc .nua-champ{position:relative;margin:6px 0 8px}
.att-sc .nua-in{text-align:center;padding-right:44px;padding-left:44px}
.att-sc .nua-mots{position:absolute;right:0;bottom:12px;font-size:.74rem;color:var(--cr3);font-variant-numeric:tabular-nums}
.att-sc .nua-souffle{position:relative;overflow:hidden;min-height:64px;margin-top:10px;border-radius:32px;border:1.5px solid color-mix(in srgb,var(--a) 70%,transparent);background:rgba(242,233,228,.04);color:var(--cr);font-size:1rem;font-weight:600;cursor:pointer;touch-action:none;-webkit-touch-callout:none}
.att-sc .nua-jauge{position:absolute;inset:0;background:linear-gradient(90deg,color-mix(in srgb,var(--a) 22%,transparent),color-mix(in srgb,var(--a) 42%,transparent));transform-origin:left;transform:scaleX(0)}
.att-sc .nua-sl{position:relative}
.att-sc .nua .att-deux .att-cta{padding:0 10px;font-size:.94rem;white-space:nowrap}
.att-sc .nua.souffle .nua-souffle{background:rgba(242,233,228,.09)}

/* ===== rivière ===== */
.att-sc .riv{position:relative;flex:1;display:flex;flex-direction:column;min-height:560px;overflow:hidden}
.att-sc .riv-svg{position:absolute;inset:0;display:block}
.att-sc .riv-haut{position:relative;z-index:2;padding:26px 24px 0;text-align:center}
.att-sc .riv-c{font-size:1.45rem}
.att-sc .riv-compte{margin:10px 0 0;font-size:.8rem;color:var(--a);min-height:1.3em}
.att-sc .riv-mots{position:absolute;inset:0;z-index:3;pointer-events:none}
.att-sc .riv-mot{position:absolute;left:0;top:0;pointer-events:auto;display:flex;flex-direction:column;align-items:center;min-height:44px;justify-content:center;padding:6px 14px;border-radius:14px;border:1px solid transparent;background:transparent;color:rgba(242,233,228,.9);font-size:1.08rem;font-weight:500;white-space:nowrap;cursor:pointer;transition:background .5s,border-color .5s;will-change:transform}
.att-sc .riv-pq{display:none;font-size:.78rem;font-weight:600;color:var(--a)}
.att-sc .riv-mot.pense{z-index:2;background:#1B1432;border-color:color-mix(in srgb,var(--a) 60%,transparent);padding:10px 18px}
.att-sc .riv-mot.pense .riv-pq{display:block}
.att-sc .riv-mot.pense .riv-m{font-family:'Newsreader',Georgia,serif;font-style:italic;font-weight:400;font-size:1.3rem;color:var(--cr)}
.att-sc .riv-bas{position:relative;z-index:4;margin-top:auto;padding:12px 22px calc(22px + env(safe-area-inset-bottom));background:linear-gradient(180deg,transparent,rgba(12,25,42,.85) 40%)}
.att-sc .riv-reg{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin-bottom:12px}
.att-sc .riv-reg .att-chips{gap:8px}
.att-sc .riv-reg .att-chip{padding:7px 13px;font-size:.8rem;min-height:38px}
.att-sc .riv-ajout-z{display:flex;gap:10px;align-items:flex-end}
.att-sc .riv-ajout-z .att-champ{flex:1}
.att-sc .riv-liste{list-style:none;margin:16px 0 0;padding:0}
.att-sc .riv-liste li{display:flex;align-items:center;gap:10px;padding:8px 0;border-bottom:1px solid var(--tr)}
.att-sc .riv-liste li span{flex:1;font-family:'Newsreader',Georgia,serif;font-style:italic;font-size:1.1rem;overflow-wrap:anywhere}
.att-sc .riv-liste li.riv-rien{color:var(--cr3);font-size:.9rem;border:0}
.att-sc .riv-retire{min-height:40px;border:1px solid var(--tr);background:none;color:var(--cr2);border-radius:999px;padding:0 14px;font-size:.8rem;cursor:pointer}

/* ===== soucis ===== */
.att-sc .sou-boite{display:flex;align-items:center;gap:14px;margin-top:14px;padding:12px 16px;border:1px dashed rgba(242,233,228,.22);border-radius:16px}
.att-sc .sou-boite .rfx-cadenas{flex:none;color:var(--a)}
.att-sc .sou-boite b{display:block;font-size:.92rem}
.att-sc .sou-boite span{display:block;font-size:.8rem;color:var(--cr2);line-height:1.4}
.att-sc .sou-ecrit{display:flex;align-items:flex-end;gap:10px;margin-top:18px}
.att-sc .sou-ecrit .att-champ{flex:1}
.att-sc .sou-plus{flex:none;width:48px;height:48px;border-radius:50%;border:0;background:var(--a);color:#1B122F;font-size:1.6rem;line-height:1;cursor:pointer}
.att-sc .sou-vrac{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;min-height:52px;margin-top:18px}
.att-sc .sou-bulle{position:relative;display:inline-flex;align-items:center;gap:6px;min-height:44px;max-width:100%;padding:8px 16px;border-radius:22px;border:1px solid rgba(242,233,228,.14);background:rgba(242,233,228,.09);color:var(--cr);font-size:.92rem;font-weight:500;overflow-wrap:anywhere;text-align:center;touch-action:none;cursor:grab}
.att-sc .sou-libre .sou-bulle{cursor:default;touch-action:auto;padding-right:6px}
.att-sc .sou-x{width:32px;height:32px;border-radius:50%;border:0;background:rgba(242,233,228,.08);color:var(--cr2);font-size:1.1rem;line-height:1;cursor:pointer}
.att-sc .sou-bulle.choisie{border-color:var(--a);background:color-mix(in srgb,var(--a) 22%,transparent)}
.att-sc .sou-bulle.glisse{z-index:10;cursor:grabbing;background:color-mix(in srgb,var(--a) 30%,#241A3D);transition:none}
.att-sc .sou-fait{margin:12px 0 0;font-family:'Newsreader',Georgia,serif;font-style:italic;font-size:1.1rem;color:var(--cr2)}
.att-sc .sou-cases{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:16px}
.att-sc .sou-case{position:relative;display:flex;flex-direction:column;align-items:stretch;gap:8px;min-height:230px;padding:10px 8px 50px;border-radius:20px;border:1.5px solid color-mix(in srgb,var(--a) 65%,transparent);background:linear-gradient(180deg,color-mix(in srgb,var(--a) 9%,transparent),transparent);transition:border-color .3s,background .3s}
.att-sc .sou-case.soir{border:1.5px dashed rgba(242,233,228,.3);background:rgba(242,233,228,.025)}
.att-sc .sou-case.cible{border-color:var(--a);cursor:pointer}
.att-sc .sou-case.survol{background:color-mix(in srgb,var(--a) 20%,transparent)}
.att-sc .sou-ct{min-height:44px;border:0;background:none;color:var(--a);font-family:inherit;font-size:.9rem;font-weight:700;line-height:1.2;cursor:pointer;padding:4px}
.att-sc .sou-case.soir .sou-ct{color:var(--cr2)}
.att-sc .sou-dans{display:flex;flex-direction:column;align-items:stretch;gap:8px}
.att-sc .sou-dans .sou-bulle{justify-content:center;font-size:.86rem;padding:8px 10px}
.att-sc .sou-case .sou-dans .sou-bulle{background:color-mix(in srgb,var(--a) 26%,#1B122F)}
.att-sc .sou-case.soir .sou-dans .sou-bulle{background:rgba(242,233,228,.1)}
.att-sc .sou-case .rfx-cadenas{position:absolute;left:50%;bottom:10px;margin-left:-15px}
.att-sc .sou-case.ouverte{min-height:0;padding:44px 12px 14px;border-style:solid;margin-top:18px}
.att-sc .sou-case.ouverte .rfx-cadenas{top:8px;bottom:auto;color:var(--a)}
.att-sc .sou-rappel{margin:16px 0 0;font-family:'Newsreader',Georgia,serif;font-style:italic;font-size:1.1rem}
.att-sc .sou-coffre{position:relative;display:flex;flex-direction:column;align-items:center;gap:14px;margin:26px auto 0;max-width:300px;padding:22px 18px 18px;border-radius:24px;border:1.5px dashed rgba(242,233,228,.3);transition:border-color 1s,background 1s}
.att-sc .sou-coffre .sou-dans{width:100%;transition:filter 1.2s ease,opacity 1.2s ease}
.att-sc .sou-coffre .rfx-cadenas{width:46px;height:56px;color:var(--cr2);transition:color 1s}
.att-sc .sou-coffre.ferme{border-style:solid;border-color:color-mix(in srgb,var(--a) 55%,transparent);background:color-mix(in srgb,var(--a) 7%,transparent)}
.att-sc .sou-coffre.ferme .sou-dans{filter:blur(7px);opacity:.35}
.att-sc .sou-coffre.ferme .rfx-cadenas{color:var(--a)}
.att-sc .sou-sous{margin:0;text-align:center;font-family:'Newsreader',Georgia,serif;font-style:italic;font-size:1.12rem}
.att-sc .sou-reg{margin-top:22px}
.att-sc .sou-pour1 b{font-family:'Newsreader',Georgia,serif;font-weight:400;font-size:1.25rem}
.att-sc .sou-pour1{margin-top:16px}
.att-sc .sou .att-pad>.att-lab{margin-top:18px}
.att-sc .sou-idees{margin-top:14px}
.att-sc .sou-idees .att-chip{white-space:normal;text-align:left;font-size:.84rem}

/* ===== boussole ===== */
.att-sc .bou-rappel{min-height:24px;font-family:'Newsreader',Georgia,serif;font-style:italic;color:var(--cr3);text-align:center}
.att-sc .bou-centre{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:14px 26px 4px;text-align:center}
.att-sc .bou-rose{width:min(46vw,180px);height:auto;display:block}
.att-sc .bou-rose.petite{width:90px}
.att-sc .bou-aig{transform-origin:100px 100px;transition:transform 1.4s cubic-bezier(.3,.7,.3,1)}
.att-sc .bou-nom{margin:14px 0 0;font-size:.7rem;letter-spacing:.16em;text-transform:uppercase;font-weight:700;color:var(--a)}
.att-sc .bou-q{font-family:'Newsreader',Georgia,serif;font-style:italic;font-weight:300;font-size:1.45rem;line-height:1.3;margin:6px 0 0;max-width:22em}
.att-sc .bou-rep{margin-top:16px;background:rgba(242,233,228,.05);border:1px solid var(--tr);border-radius:18px;padding:12px 16px;min-height:84px}
.att-sc .bou-rep:focus{border-color:color-mix(in srgb,var(--a) 60%,transparent)}
.att-sc .bou-aide{margin-top:10px}
.att-sc .bou-supp-z{margin-top:14px}
.att-sc .bou-grille{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:18px}
.att-sc .bou-carte{position:relative;border:1px solid var(--tr);background:var(--vo);border-radius:18px;padding:12px 14px 14px;min-height:130px}
.att-sc .bou-carte.pas{border-color:color-mix(in srgb,var(--a) 60%,transparent);background:color-mix(in srgb,var(--a) 8%,transparent)}
.att-sc .bou-c{position:absolute;top:10px;right:12px;font-weight:700;font-size:.8rem;color:var(--a)}
.att-sc .bou-carte .att-lab{font-size:.6rem;padding-right:18px}
.att-sc .bou-carte p{margin:6px 0 0;font-family:'Newsreader',Georgia,serif;font-style:italic;font-weight:300;font-size:1.05rem;line-height:1.32;overflow-wrap:anywhere}
.att-sc .bou-vide{color:var(--cr3)}

/* ===== chaises ===== */
.att-sc .cha-carte{margin-top:6px;padding:14px 18px}
.att-sc .cha-carte .att-lab{font-size:.64rem}
.att-sc .cha-carte .att-champ{border-bottom:0;padding:2px 0 4px}
.att-sc .cha-dil-t{margin:0;font-family:'Newsreader',Georgia,serif;font-style:italic;font-weight:300;font-size:1.3rem;line-height:1.3;overflow-wrap:anywhere}
.att-sc .cha-noms{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:14px}
.att-sc .cha-noms label{display:block}
.att-sc .cha .att-pad>.att-lab{margin-top:18px}
.att-sc .cha-duo{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:14px}
.att-sc .cha-ch{position:relative;display:flex;flex-direction:column;align-items:center;padding:14px 10px 16px;border-radius:18px;border:1px solid var(--tr);background:rgba(242,233,228,.02);color:rgba(242,233,228,.35);text-align:center}
.att-sc .cha-ch svg{width:30px;height:40px}
.att-sc .cha-ch b{margin-top:6px;font-family:'Newsreader',Georgia,serif;font-weight:400;font-size:1.2rem;color:var(--cr2)}
.att-sc .cha-ch>span{font-size:.8rem;color:var(--cr3);line-height:1.25;overflow-wrap:anywhere}
.att-sc .cha-ch.actif{border:1.5px solid var(--a);background:color-mix(in srgb,var(--a) 9%,transparent);color:var(--a)}
.att-sc .cha-ch.actif b{color:var(--cr)}
.att-sc .cha-ch.actif>span{color:var(--cr)}
.att-sc .cha-ch.fait{color:rgba(242,233,228,.5)}
.att-sc .cha-fait{position:absolute;top:9px;right:12px;font-size:.58rem;letter-spacing:.14em;text-transform:uppercase;font-weight:700;color:var(--cr3)}
.att-sc .cha-prog{position:absolute;left:16px;right:16px;bottom:8px;height:3px;border-radius:2px;background:rgba(242,233,228,.12);overflow:hidden}
.att-sc .cha-prog i{display:block;height:100%;width:0;background:var(--a);border-radius:2px}
.att-sc .cha-z .att-lab{margin-top:18px}
.att-sc .cha-txt{font-size:19px;min-height:104px}
.att-sc .cha-parle{margin:8px 0 0;font-family:'Newsreader',Georgia,serif;font-style:italic;font-weight:300;font-size:1.2rem;line-height:1.4;color:var(--cr2)}
.att-sc .cha-msg{margin:8px 0 0;font-size:.84rem;color:var(--a);min-height:1.2em}
.att-sc .cha-temoin-mini,.att-sc .cha-temoin{display:flex;align-items:center;gap:14px;margin-top:14px;padding:12px 16px;border-radius:16px;border:1px dashed rgba(242,233,228,.2);color:rgba(242,233,228,.4)}
.att-sc .cha-temoin-mini svg,.att-sc .cha-temoin svg{flex:none;width:22px;height:30px}
.att-sc .cha-temoin-mini b,.att-sc .cha-temoin b{display:block;font-size:.88rem;color:var(--cr)}
.att-sc .cha-temoin-mini span,.att-sc .cha-temoin span{display:block;font-size:.8rem;color:var(--cr3)}
.att-sc .cha-temoin{border:1.5px solid var(--a);color:var(--a);background:color-mix(in srgb,var(--a) 8%,transparent)}
.att-sc .cha-voix{display:grid;gap:8px;margin-top:12px}
.att-sc .cha-voix p{margin:0;padding:10px 14px;border-left:2px solid rgba(242,233,228,.2);font-family:'Newsreader',Georgia,serif;font-style:italic;font-weight:300;font-size:1.02rem;line-height:1.38;color:var(--cr2);overflow-wrap:anywhere}
.att-sc .cha-voix small{display:block;font-family:'Karla',sans-serif;font-style:normal;font-size:.66rem;letter-spacing:.12em;text-transform:uppercase;font-weight:700;color:var(--cr3)}
.att-sc .cha-lab-c{margin-top:18px !important;color:var(--a) !important}
.att-sc .cha-garde-z{margin-top:14px}
.att-sc .cha-suite.appel{animation:cha-appel 2.4s ease-in-out 2}
@keyframes cha-appel{50%{opacity:.7}}

/* ===== zoom ===== */
.att-sc .zoo-scene{flex:1;display:flex;align-items:center;justify-content:center;padding:10px 16px 4px;min-height:0;touch-action:none}
.att-sc .zoo-svg{display:block;width:min(100%,46vh,380px);height:auto;aspect-ratio:1;overflow:visible}
.att-sc .zoo-niv{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;margin-top:6px}
.att-sc .zoo-niv button{min-height:40px;border:1px solid var(--tr);background:var(--vo);color:var(--cr2);border-radius:12px;font-size:.76rem;font-weight:600;padding:0 2px;cursor:pointer;white-space:nowrap}
.att-sc .zoo-niv button:disabled{opacity:.4;cursor:default}
.att-sc .zoo-niv button[aria-pressed="true"]{background:var(--a);border-color:var(--a);color:#1B122F;opacity:1}
.att-sc .zoo-q{margin-top:14px}
.att-sc .zoo-lab.phrase{text-transform:none;letter-spacing:0;font-family:'Newsreader',Georgia,serif;font-style:italic;font-weight:300;font-size:1.15rem;line-height:1.35;color:var(--cr);margin-bottom:0}
.att-sc .zoo-ligne{display:flex;gap:10px;align-items:flex-end}
.att-sc .zoo-ligne .att-champ{flex:1}

/* ===== question ===== */
.att-sc .que-pile{position:relative;margin-top:18px}
.att-sc .que-carte{position:relative;border-radius:22px;border:1px solid color-mix(in srgb,var(--a) 45%,transparent);background:linear-gradient(170deg,#2A1F48,#1E1636);padding:18px 18px 16px;transform-origin:center}
.att-sc .que-front .att-champ{border-bottom:0;padding:4px 0 2px;font-size:21px}
.att-sc .que-dos{position:relative;z-index:0;display:block;width:88%;margin:0 auto -14px;text-align:left;border-radius:18px;border:1px solid var(--tr);background:#211934;padding:12px 16px 24px;transform:rotate(-2.5deg);opacity:.72;cursor:pointer;transition:opacity .4s,transform .5s;color:var(--cr)}
.att-sc .que-dos .att-lab{font-size:.6rem}
.att-sc .que-dos-t{display:block;font-family:'Newsreader',Georgia,serif;font-style:italic;font-weight:300;font-size:.98rem;color:var(--cr2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.att-sc .que-dos.vue{opacity:1;transform:rotate(0deg) translateY(-4px)}
.att-sc .que-dos.vue .que-dos-t{white-space:normal;font-size:1.12rem;color:var(--cr)}
.att-sc .que-face{z-index:1}
.att-sc .que-ret{color:var(--a) !important;font-size:.62rem}
.att-sc .que-h{font-family:'Newsreader',Georgia,serif;font-weight:300;font-size:1.45rem;line-height:1.2;margin:2px 0 8px}
.att-sc .que-opts{display:flex;flex-direction:column}
.att-sc .que-opt{display:flex;align-items:center;gap:12px;min-height:48px;border:0;border-top:1px solid var(--tr);background:none;color:var(--cr);text-align:left;padding:8px 0;font-family:'Newsreader',Georgia,serif;font-weight:400;font-size:1.08rem;line-height:1.3;cursor:pointer}
.att-sc .que-opt i{flex:none;width:18px;height:18px;border-radius:50%;border:1.5px solid rgba(242,233,228,.35)}
.att-sc .que-opt[aria-checked="true"] i{border:2px solid var(--a);background:radial-gradient(circle,var(--a) 0 4px,transparent 4.5px)}
.att-sc .que-opt[aria-checked="true"]{color:var(--cr)}
.att-sc .que-mienne-z{border-top:1px solid var(--tr);margin-top:2px}
.att-sc .que-mienne-z .rfx-lien{font-size:.84rem;padding-left:0}
.att-sc .que-mienne{display:flex;gap:10px;align-items:flex-end;padding-bottom:4px}
.att-sc .que-mienne .att-champ{flex:1}
.att-sc .que-rep-z{margin-top:22px}
.att-sc .que-rep-lab{text-transform:none !important;letter-spacing:0 !important;font-family:'Newsreader',Georgia,serif;font-style:italic;font-weight:300;font-size:1rem !important;color:var(--a) !important}
.att-sc .que-garde{margin-top:12px}

/* ===== faits ===== */
.att-sc .fai-in{font-size:19px;line-height:1.55;min-height:170px;margin-top:10px}
.att-sc .fai-cols{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:16px}
.att-sc .fai-col{border-radius:18px;border:1px solid var(--tr);background:var(--vo);padding:12px 10px;min-height:150px}
.att-sc .fai-col .att-lab{font-size:.6rem;color:var(--a);margin-bottom:10px}
.att-sc .fai-liste{display:flex;flex-direction:column;gap:8px}
.att-sc .fai-bulle{min-height:40px;border-radius:12px;padding:8px 10px;font-size:.84rem;font-weight:500;text-align:left;line-height:1.3;color:var(--cr);cursor:pointer;overflow-wrap:anywhere;animation:att-apparait .4s ease both}
.att-sc .fai-col.g .fai-bulle{background:rgba(61,245,230,.08);border:1px solid rgba(61,245,230,.32)}
.att-sc .fai-col.d .fai-bulle{background:color-mix(in srgb,var(--a) 13%,transparent);border:1px solid color-mix(in srgb,var(--a) 40%,transparent)}
.att-sc .fai-col.d .fai-bulle.choisie{background:color-mix(in srgb,var(--a) 32%,transparent);border-color:var(--a)}
.att-sc .fai-milieu{display:flex;flex-direction:column;align-items:center;padding:20px 22px 0}
.att-sc .fai-milieu:empty{padding:0}
.att-sc .fai-courante{max-width:86%;padding:13px 20px;border-radius:16px;border:1px solid rgba(242,233,228,.3);background:#2A2045;font-size:1rem;font-weight:500;text-align:center;line-height:1.35;transform:rotate(-1.5deg);touch-action:none;cursor:grab;-webkit-user-select:none;user-select:none;overflow-wrap:anywhere;animation:att-apparait .35s ease both}
.att-sc .fai-courante.tenue{cursor:grabbing;transition:none}
.att-sc .fai-courante.vers-g{border-color:#3DF5E6}
.att-sc .fai-courante.vers-d{border-color:var(--a)}
.att-sc .fai-glisse{margin:8px 0 0;font-size:.74rem;letter-spacing:.1em;color:var(--cr3)}
.att-sc .fai-fin-z{margin-top:16px}
.att-sc .fai-histoire{padding:14px 18px}
.att-sc .fai-histoire .att-lab{font-size:.62rem}
.att-sc .fai-pour{margin:0 0 4px;font-size:.84rem;color:var(--cr2);line-height:1.4}
.att-sc .fai-pour span{display:block;font-size:.76rem;color:var(--cr3);margin-top:2px}
.att-sc .fai-histoire .att-champ{border-bottom-color:var(--tr)}
.att-sc .fai-boutons .att-cta{font-size:.92rem;padding:0 10px}

@media (max-height:700px){
  .att-sc .rfx .att-h{font-size:1.5rem}
  .att-sc .met-lignes{gap:12px;margin-top:14px}
  .att-sc .sou-case{min-height:180px}
  .att-sc .bou-q{font-size:1.28rem}
}
@media (max-width:350px){
  .att-sc .fil-tabs{gap:4px;padding:4px 10px 0}
  .att-sc .fil-tab{font-size:.72rem}
  .att-sc .zoo-niv button{font-size:.68rem}
  .att-sc .bes-emo{font-size:1.15rem}
  .att-sc .pil-inter{width:180px}
  .att-sc .fai-boutons .att-cta{font-size:.84rem}
}

/* attention-rangee-1014 : les exercices express posés dans les tuiles Confiance, Alchimie, Recul, Mon attention */
.att-ailleurs{margin:18px 0 0;padding:14px 14px 4px;border-radius:18px;border:1px solid var(--trait,rgba(255,255,255,.14));background:var(--voile,rgba(255,255,255,.05))}
.att-ailleurs-t{margin:0;font-family:'Newsreader',Georgia,serif;font-weight:400;font-size:1.25rem}
.att-ailleurs-p{margin:4px 0 4px;font-size:.88rem;color:var(--encre-douce);line-height:1.4}
#ec-attention .att-parti{margin-top:4px;font-style:normal;font-size:.85rem}
.att-ailleurs .att-ex{display:flex;align-items:center;gap:14px;width:100%;text-align:left;background:none;border:0;border-bottom:1px solid var(--trait);border-radius:0;padding:12px 2px;color:var(--encre);font:inherit;cursor:pointer}
.att-ailleurs .att-ex:active{opacity:.7}
.att-ailleurs .att-ico{width:44px;height:44px;flex:none;border-radius:14px;display:grid;place-items:center;background:var(--voile);border:1px solid var(--trait)}
.att-ailleurs .att-txt{flex:1;min-width:0}
.att-ailleurs .att-txt b{display:block;font-family:'Newsreader',Georgia,serif;font-weight:400;font-size:1.12rem;line-height:1.25}
.att-ailleurs .att-txt span{display:block;font-size:.82rem;color:var(--encre-douce);line-height:1.35;margin-top:2px}
.att-ailleurs .att-etat{flex:none;display:grid;place-items:center;width:26px;color:var(--encre-douce)}
.att-ailleurs .att-chev{font-size:1.4rem;opacity:.5}
.att-ailleurs .att-verrou{opacity:.7}