/* Mini-diapositives des aperçus : dimensions en cqw du cadre, couleurs --t-* du thème. */
.ig-frame .tp-slide.td-slide{display:grid;padding:4.5cqw 5cqw}.ig-frame .td-body.sa-body{padding:0}.ig-preview{cursor:zoom-in}
.sa-body{align-content:center;min-width:0}
.sa{display:grid;gap:2.1cqw;align-content:center;width:100%;min-width:0;font-family:var(--t-body);color:var(--t-ink);text-align:left}
.sa-k{font:600 1.4cqw/1 var(--t-body);letter-spacing:.22em;text-transform:uppercase;color:var(--t-muted)}
.sa-h{display:block;font:700 5cqw/1.04 var(--t-title);letter-spacing:-.01em;text-wrap:balance}
.sa-mark{color:var(--t-on-accent);background:linear-gradient(var(--t-accent),var(--t-accent)) no-repeat 0 55%/100% 90%;padding:0 .12em;margin:0 -.06em;border-radius:.12em;-webkit-box-decoration-break:clone;box-decoration-break:clone}
.sa-note{font:400 1.7cqw/1.35 var(--t-body);color:var(--t-muted);max-width:62cqw}
.sa-src{font:400 1.1cqw/1.3 ui-monospace,'Courier New',monospace;letter-spacing:.08em;color:var(--t-muted)}
.sa-a{background:var(--t-accent)}.sa-b{background:var(--t-accent2)}.sa-m{background:var(--t-muted)}
/* Barres horizontales commentées */
.sa-bars{display:grid;gap:.9cqw}
.sa-bar{display:grid;grid-template-columns:6.5cqw 1fr 9cqw 6.5cqw;gap:1.4cqw;align-items:center}
.sa-bar b,.sa-mini b{font:700 2.5cqw/1 var(--t-title)}
.sa-bar i,.sa-mini i{display:block;height:2.5cqw;width:var(--w);background:var(--t-muted);border-radius:.5cqw;transform-origin:left}
.sa-bar em,.sa-mini em{font:700 2.2cqw/1 var(--t-body);font-style:normal;font-variant-numeric:tabular-nums;justify-self:end;padding:.45cqw .7cqw;border-radius:.6cqw}
.sa-bar small{font:400 1.15cqw ui-monospace,monospace;color:var(--t-muted);text-align:right}
.sa-bar.is-hot i{background:var(--t-ink)}.sa-bar.is-hot em{background:var(--t-accent);color:var(--t-on-accent)}
/* Histogramme */
.sa-cols{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;gap:2.4cqw;align-items:end;padding:0 2cqw}
.sa-col{display:grid;justify-items:center;gap:.6cqw;min-width:0}
.sa-col i{display:block;width:100%;height:calc(var(--h)*1cqw);background:var(--t-muted);border-radius:.6cqw .6cqw 0 0;transform-origin:bottom}
.sa-col em{font:700 2cqw/1 var(--t-body);font-style:normal;font-variant-numeric:tabular-nums;padding:.4cqw .7cqw;border-radius:.6cqw}
.sa-col b{font:600 1.5cqw/1 var(--t-body);color:var(--t-muted);padding-top:.5cqw;border-top:max(1px,.2cqw) solid var(--t-ink);width:calc(100% + 2.4cqw);text-align:center}
.sa-col.is-hot i{background:var(--t-ink)}.sa-col.is-hot em{background:var(--t-accent);color:var(--t-on-accent)}.sa-col.is-hot b{color:var(--t-ink)}
/* Courbe */
.sa-chart{position:relative}.sa-chart svg{display:block;width:100%;height:auto;overflow:visible}
.sa-grid{fill:none;stroke:var(--t-muted);stroke-width:.25;stroke-dasharray:1.5 1.5;opacity:.6}
.sa-area{fill:var(--t-accent);opacity:.16}.sa-curve{fill:none;stroke:var(--t-ink);stroke-width:1.1;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:1;stroke-dashoffset:0}
.sa-point{fill:var(--t-muted)}.sa-point.is-hot{fill:var(--t-accent);stroke:var(--t-bg);stroke-width:.8}
.sa-tick{font:400 3px ui-monospace,monospace;fill:var(--t-muted);text-anchor:middle}
.sa-callout{position:absolute;right:0;top:-1cqw;background:var(--t-accent);color:var(--t-on-accent);font:700 1.9cqw/1 var(--t-body);padding:.6cqw 1cqw;border-radius:.7cqw}
/* Répartition */
.sa-share{display:flex;height:5.5cqw;border-radius:1cqw;overflow:hidden;gap:.4cqw}.sa-seg{display:block;width:var(--w);transform-origin:left}
.sa-legend{display:grid;grid-template-columns:repeat(3,1fr);gap:2cqw}.sa-legend div{display:grid;grid-template-columns:auto 1fr;gap:.2cqw 1cqw;align-items:center}
.sa-key{width:1.6cqw;height:1.6cqw;border-radius:.4cqw}.sa-legend strong{font:700 3.6cqw/1 var(--t-title)}.sa-legend div>span{grid-column:1/-1;font:400 1.6cqw/1.2 var(--t-body);color:var(--t-muted)}
/* Chiffres clés */
.sa-figs{display:grid;grid-template-columns:repeat(3,1fr);gap:3cqw}.sa-figs div{display:grid;gap:1.2cqw;align-content:start;padding-top:1.6cqw;border-top:max(1px,.3cqw) solid var(--t-ink)}
.sa-figs b{font:700 6.2cqw/1 var(--t-title);letter-spacing:-.02em;white-space:nowrap}.sa-figs div>span{font:400 1.8cqw/1.3 var(--t-body);color:var(--t-muted)}
.sa-figs .is-hot{border-top-color:var(--t-accent)}.sa-figs .is-hot b{color:var(--t-accent-text)}
/* Panneaux jumeaux */
.sa-duo{display:grid;grid-template-columns:1fr 1fr;gap:2cqw}
.sa-panel{background:var(--t-surface);border-radius:1.6cqw;padding:2cqw;display:grid;gap:.9cqw;align-content:start;min-width:0}
.sa-panel.is-hot{box-shadow:inset 0 0 0 max(1.5px,.35cqw) var(--t-accent)}
.sa-panel-top{display:flex;justify-content:space-between;align-items:baseline;gap:1cqw}.sa-panel-top>span{font:700 1.9cqw/1.1 var(--t-body)}.sa-panel-top b{font:700 3.6cqw/1 var(--t-title);color:var(--t-accent-surface-text);white-space:nowrap}
.sa-panel p{margin:0;font:400 1.9cqw/1.35 var(--t-body)}
.sa-mini{display:grid;grid-template-columns:9cqw 1fr 5cqw;gap:1cqw;align-items:center}.sa-mini b{font-size:1.7cqw}.sa-mini i{height:2cqw}.sa-mini em{padding:0;font-size:1.9cqw}
.sa-panel.is-hot .sa-mini:first-of-type i{background:var(--t-ink)}
/* Tableau comparatif */
.sa-table{display:grid;grid-template-columns:1.2fr 1fr 1fr;gap:0 1.4cqw;align-items:stretch}
.sa-table>b{font:700 1.9cqw/1.15 var(--t-title);padding:1cqw 1.2cqw;background:var(--t-surface);border-radius:1cqw 1cqw 0 0}
.sa-cell{font:400 1.9cqw/1.2 var(--t-body);padding:1.1cqw 1.2cqw;border-bottom:max(1px,.15cqw) solid color-mix(in srgb,var(--t-muted) 45%,transparent)}
.sa-cell:nth-child(3n+1){color:var(--t-muted);padding-left:0}.sa-cell.is-hot{background:var(--t-accent);color:var(--t-on-accent);font-weight:700;border-radius:.6cqw;border-color:transparent}
/* Cartes numérotées */
.sa-cards{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;gap:1.4cqw;perspective:60cqw}
.sa-card{background:var(--t-surface);border-radius:1.4cqw;padding:1.6cqw;display:grid;gap:3.4cqw;align-content:space-between;min-width:0;transform-origin:50% 100%}
.sa-card small{font:400 1.2cqw ui-monospace,monospace;color:var(--t-muted)}.sa-card b{font:700 2cqw/1.15 var(--t-body);letter-spacing:-.02em}
.sa-card.is-hot{background:var(--t-accent);color:var(--t-on-accent)}.sa-card.is-hot small{color:inherit}
/* Lignes à étiquette */
.sa-rows{display:grid;gap:.9cqw}
.sa-row{display:grid;grid-template-columns:4.6cqw 1.1fr 1.4fr;gap:1.6cqw;align-items:center;background:var(--t-surface);border-radius:1cqw;padding:1.2cqw 1.8cqw}
.sa-row s{text-decoration:none;justify-self:start;font:700 1.2cqw/1 ui-monospace,monospace;background:var(--t-accent);color:var(--t-on-accent);padding:.5cqw .7cqw;border-radius:.5cqw}
.sa-row b{font:700 2.2cqw/1.05 var(--t-title);text-transform:uppercase}.sa-row span{font:400 1.6cqw/1.25 var(--t-body);color:var(--t-muted)}
.sa-row.is-hot{box-shadow:inset 0 0 0 max(1.5px,.35cqw) var(--t-ink)}
.sa-plain .sa-row{background:none;border-radius:0;padding:1cqw 0;border-bottom:max(1px,.15cqw) solid color-mix(in srgb,currentColor 25%,transparent)}
.sa-plain .sa-row s{background:none;color:var(--t-accent-text);padding:0;font-size:1.4cqw}.sa-plain .sa-row.is-hot{box-shadow:none}.sa-plain .sa-row.is-hot b{color:var(--t-accent-text)}
/* Liste illustrée */
.sa-list{display:grid;gap:1.4cqw}.sa-list div{display:grid;grid-template-columns:5cqw 14cqw 1fr;gap:1.6cqw;align-items:center}
.sa-list i{display:grid;place-items:center;width:4.6cqw;height:4.6cqw;border-radius:50%;background:var(--t-accent);color:var(--t-on-accent);font:700 2.2cqw/1 var(--t-title);font-style:normal}
.sa-list b{font:700 2.6cqw/1 var(--t-title)}.sa-list span{font:400 1.8cqw/1.25 var(--t-body);color:var(--t-muted)}
/* Frise */
.sa-time{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;gap:1.6cqw;border-top:max(1px,.3cqw) solid var(--t-muted);margin-top:1.5cqw}
.sa-time div{position:relative;display:grid;gap:.8cqw;padding-top:2.4cqw}
.sa-time div::before{content:'';position:absolute;left:0;top:-.95cqw;width:1.6cqw;height:1.6cqw;border-radius:50%;background:var(--t-muted)}
.sa-time b{font:700 3.4cqw/1 var(--t-title)}.sa-time span{font:400 1.6cqw/1.25 var(--t-body);color:var(--t-muted)}
.sa-time .is-hot::before{background:var(--t-accent);width:2.4cqw;height:2.4cqw;top:-1.35cqw;box-shadow:0 0 0 .5cqw var(--t-bg)}.sa-time .is-hot b{color:var(--t-accent-text)}.sa-time .is-hot span{color:var(--t-ink)}
/* Compte à rebours */
.sa-days{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;gap:1.6cqw;align-items:start}
.sa-days div{display:grid;gap:.9cqw}.sa-days b{font:700 3.3cqw/1 var(--t-title);padding-bottom:.9cqw;border-bottom:max(1.5px,.4cqw) solid var(--t-ink);white-space:nowrap}
.sa-days span{font:700 1.6cqw/1.2 var(--t-body)}.sa-days small{font:400 1.1cqw ui-monospace,monospace;color:var(--t-muted)}
.sa-days .is-hot b{background:var(--t-accent);color:var(--t-on-accent);border:0;border-radius:1cqw;padding:1.2cqw 0;text-align:center}
/* Processus */
.sa-flow{display:grid;grid-template-columns:repeat(4,1fr);gap:3.4cqw}
.sa-flow div{position:relative;background:var(--t-surface);border-radius:1.4cqw;padding:1.8cqw;display:grid;gap:2.6cqw}
.sa-flow div:not(:last-child)::after{content:'→';position:absolute;right:-2.9cqw;top:50%;translate:0 -50%;font:400 2.4cqw/1 var(--t-body);color:var(--t-muted)}
.sa-flow small{font:400 1.2cqw ui-monospace,monospace;color:var(--t-muted)}.sa-flow b{font:700 2.4cqw/1 var(--t-title);text-transform:uppercase}
.sa-flow .is-hot{background:var(--t-accent);color:var(--t-on-accent)}.sa-flow .is-hot small{color:inherit}
.sa-chips{display:flex;flex-wrap:wrap;gap:.8cqw;align-items:center}.sa-chips span{font:500 1.15cqw/1 ui-monospace,monospace;letter-spacing:.08em;text-transform:uppercase;padding:.6cqw 1cqw;border-radius:2cqw;background:var(--t-surface)}
.sa-chips .is-hot{background:var(--t-accent);color:var(--t-on-accent)}.sa-chips em{font:400 1.1cqw ui-monospace,monospace;font-style:normal;letter-spacing:.14em;text-transform:uppercase;color:var(--t-muted);margin-right:.6cqw}
/* Pyramide */
.sa-pyr{display:grid;gap:.7cqw;width:62cqw;margin:0 auto;clip-path:polygon(50% 0,100% 100%,0 100%)}
.sa-pyr div{height:5.6cqw;display:grid;place-items:center;background:var(--t-surface);font:700 2cqw/1 var(--t-body)}
.sa-pyr .is-hot{background:var(--t-accent);color:var(--t-on-accent);align-items:end;padding-bottom:.8cqw;font-size:1.6cqw}
/* Schémas positionnés : acteurs autour d’un centre, cycle */
.sa-map{position:relative;height:24cqw}.sa-lines{position:absolute;inset:0;width:100%;height:100%}
.sa-lines path{fill:none;stroke:var(--t-ink);stroke-width:1.2;vector-effect:non-scaling-stroke;stroke-linecap:round;transform-box:view-box;transform-origin:50% 50%}
.sa-pill{position:absolute;translate:-50% -50%;background:var(--t-surface);border-radius:1.2cqw;padding:.9cqw 1.4cqw;font:700 1.8cqw/1 var(--t-body);letter-spacing:-.02em;white-space:nowrap}
.sa-pill.is-hot{background:var(--t-accent);color:var(--t-on-accent)}
.sa-hub{position:absolute;left:50%;top:50%;translate:-50% -50%;display:grid;justify-items:center;gap:.5cqw;background:var(--t-accent);color:var(--t-on-accent);border-radius:5cqw;padding:1.6cqw 3.4cqw;font:700 3.2cqw/1 var(--t-title);text-transform:uppercase;white-space:nowrap}
.sa-hub small{font:400 1cqw ui-monospace,monospace;letter-spacing:.2em}
.sa-map-ring{height:25cqw}.sa-ring{position:absolute;left:50%;top:50%;height:100%;aspect-ratio:1;translate:-50% -50%}
.sa-ring circle{fill:none;stroke:var(--t-muted);stroke-width:1.4;stroke-dasharray:1;stroke-dashoffset:0;transform:rotate(-90deg);transform-origin:50% 50%}.sa-ring path{fill:var(--t-ink)}
/* Matrice */
.sa-matrix{position:relative;display:grid;grid-template-columns:1fr 1fr;gap:.9cqw;margin:0 0 2.4cqw 3.4cqw}
.sa-quad{background:var(--t-surface);border-radius:1.2cqw;padding:1.3cqw 1.6cqw;min-height:9.5cqw;display:flex;flex-wrap:wrap;gap:.7cqw;align-content:start}
.sa-quad b{flex-basis:100%;font:700 1.7cqw/1.1 var(--t-body)}.sa-quad span{font:500 1.4cqw/1 var(--t-body);padding:.5cqw .9cqw;border-radius:2cqw;background:var(--t-bg)}
.sa-quad.is-hot{box-shadow:inset 0 0 0 max(1.5px,.35cqw) var(--t-accent)}.sa-quad.is-hot span{background:var(--t-accent);color:var(--t-on-accent)}
.sa-axis{position:absolute;font:400 1.1cqw ui-monospace,monospace;letter-spacing:.14em;text-transform:uppercase;color:var(--t-muted)}
.sa-axis-x{right:0;bottom:-2.2cqw}.sa-axis-y{left:-3cqw;bottom:0;writing-mode:vertical-rl;rotate:180deg}
/* Jauges, pictogrammes, entonnoir, liste de contrôle */
.sa-gauges{display:grid;grid-template-columns:repeat(3,1fr);gap:3cqw;justify-items:center}.sa-gauges div{display:grid;gap:1cqw;justify-items:center}
.sa-gauges div>span{position:relative;display:grid;place-items:center;width:15cqw;height:15cqw}.sa-gauges svg{position:absolute;inset:0;rotate:-90deg}
.sa-track{fill:none;stroke:var(--t-surface);stroke-width:4.5}.sa-arc{fill:none;stroke:var(--t-muted);stroke-width:4.5;stroke-linecap:round}
.sa-gauges b{font:700 3.4cqw/1 var(--t-title);white-space:nowrap}.sa-gauges em{font:600 1.6cqw/1.2 var(--t-body);font-style:normal;color:var(--t-muted)}
.sa-gauges .is-hot .sa-arc{stroke:var(--t-accent)}.sa-gauges .is-hot em{color:var(--t-ink)}
.sa-pictos{display:grid;grid-template-columns:repeat(10,1fr);gap:1.6cqw}.sa-pictos svg{width:100%;height:auto;fill:var(--t-surface);stroke:color-mix(in srgb,var(--t-muted) 50%,transparent);stroke-width:.5}.sa-pictos .is-hot{fill:var(--t-accent);stroke:none}
.sa-funnel{display:grid;gap:.8cqw;justify-items:center}.sa-funnel div{width:var(--w);min-width:max-content;display:flex;justify-content:space-between;gap:2cqw;align-items:center;background:var(--t-surface);border-radius:.8cqw;padding:1.2cqw 1.8cqw}
.sa-funnel span{font:600 1.7cqw/1 var(--t-body);white-space:nowrap}.sa-funnel b{font:700 2.2cqw/1 var(--t-title);white-space:nowrap}.sa-funnel .is-hot{background:var(--t-accent);color:var(--t-on-accent)}
.sa-checks{display:grid;gap:1.2cqw}.sa-checks div{display:grid;grid-template-columns:3.6cqw 1fr;gap:1.8cqw;align-items:center}
.sa-checks svg{width:3.6cqw;height:3.6cqw}.sa-checks rect{fill:var(--t-surface);stroke:var(--t-muted);stroke-width:1.2}.sa-checks path{fill:none;stroke:var(--t-on-accent);stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:1;stroke-dashoffset:0}
.sa-checks .is-done rect{fill:var(--t-accent);stroke:var(--t-accent)}.sa-checks span{font:600 2.3cqw/1.1 var(--t-body)}.sa-checks .is-done span{color:var(--t-muted)}.sa-checks .is-hot rect{stroke:var(--t-ink);stroke-width:1.8}
/* Types d’écrans */
.sa-letters{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;gap:1cqw}.sa-letters div{display:grid;gap:.4cqw}
.sa-letters b{display:block;font:700 15cqw/.86 var(--t-title)}.sa-letters span{font:400 1.3cqw ui-monospace,monospace;letter-spacing:.2em;text-transform:uppercase;color:var(--t-muted)}
.sa-ticker{position:absolute;left:-5cqw;right:-5cqw;bottom:-4.5cqw;background:var(--t-accent);color:var(--t-on-accent);overflow:hidden;padding:1cqw 0}
.sa-ticker-track{display:flex;width:max-content;min-width:200%}.sa-ticker-group{display:flex;justify-content:space-around;flex:1}.play .sa-ticker-track{animation:sa-ticker 16s linear infinite}
.sa-ticker span{font:700 1.7cqw/1 var(--t-title);letter-spacing:.06em;text-transform:uppercase;padding:0 1.6cqw;white-space:nowrap}.sa-ticker span::after{content:'■';font-size:.7cqw;vertical-align:middle;margin-left:3.2cqw}
.sa-chapter{grid-template-columns:auto 1fr;align-items:center;gap:5cqw}
.sa-giant{display:block;font:700 15cqw/.9 var(--t-title);letter-spacing:-.03em;color:var(--t-accent-text);white-space:nowrap}.sa-chapter .sa-giant{font-size:22cqw}
.sa-band{margin:-.6cqw -20cqw;padding:1.2cqw 20cqw;background:var(--t-accent);color:var(--t-on-accent);font:700 2.4cqw/1 var(--t-title);letter-spacing:.1em;text-transform:uppercase;transform-origin:left}
.sa-split{grid-template-columns:1fr 1fr;gap:4cqw;align-items:center}.sa-split .lm-image{min-height:30cqw;border-radius:1.2cqw}
.sa-quote-mark{color:var(--t-accent-text)}
.sa-full{position:absolute;inset:-4.5cqw -5cqw;padding:4.5cqw 5cqw;display:grid;align-content:center}
.sa-invert{background:var(--t-ink)}.sa-invert .sa,.sa-invert .sa-row b{color:var(--t-bg)}.sa-invert .sa-row span,.sa-invert .sa-note{color:color-mix(in srgb,var(--t-bg) 72%,var(--t-ink))}
.sa-invert .sa-plain .sa-row s,.sa-invert .sa-mark{color:var(--t-on-accent)}.sa-invert .sa-plain .sa-row s{color:var(--t-accent-on-ink)}
.sa-accent{background:var(--t-accent)}.sa-accent .sa,.sa-accent .sa-src{color:var(--t-on-accent)}
.sa-refs{display:grid;grid-template-columns:1fr 1fr;gap:0 4cqw}.sa-refs span{display:flex;gap:1.2cqw;align-items:baseline;font:500 1.8cqw/1.2 var(--t-body);text-decoration:underline;text-underline-offset:.3cqw;padding:1.1cqw 0;border-top:max(1px,.2cqw) solid currentColor}
.sa-refs small{font:400 1.1cqw ui-monospace,monospace}
.sa-end{justify-items:center;text-align:center}.sa-end .sa-note{font-size:2.6cqw}
.layout-center .sa:not(.sa-chapter):not(.sa-split){text-align:left}
/* Mouvements, joués une fois quand l’aperçu entre à l’écran ou au survol (classe .play) ; l’état de repos est l’état final. */
.play .sa-mark{animation:sa-mark .65s cubic-bezier(.65,0,.35,1) .5s both}
.play .sa-h,.play .sa-k{animation:sa-rise .5s ease-out both}
.play .sa-bar i,.play .sa-mini i,.play .sa-seg,.play .sa-band{animation:sa-stretch .95s cubic-bezier(.76,0,.24,1) calc(.25s + var(--i,0)*.12s) both}
.play .sa-col i{animation:sa-grow .9s cubic-bezier(.3,1.45,.5,1) calc(.25s + var(--i,0)*.12s) both}
.play .sa-card,.play .sa-flow div{animation:sa-domino .8s cubic-bezier(.3,1.35,.5,1) calc(.3s + var(--i,0)*.14s) both}
.play .sa-row,.play .sa-list div,.play .sa-days div,.play .sa-time div,.play .sa-figs div,.play .sa-legend div,.play .sa-cell,.play .sa-quad,.play .sa-refs span,.play .sa-pyr div{animation:sa-rise .55s ease-out calc(.3s + var(--i,0)*.13s) both}
.play .sa-pill{animation:sa-pop .6s cubic-bezier(.3,1.5,.5,1) calc(.3s + var(--i,0)*.14s) both}.play .sa-hub{animation:sa-pop .7s cubic-bezier(.3,1.5,.5,1) 1s both}
.play .sa-lines path{animation:sa-link-grow .6s ease-in-out calc(.5s + var(--i,0)*.14s) both}.play .sa-curve{animation:sa-draw 1.4s ease-in-out .3s both}.play .sa-ring circle{animation:sa-draw 1.2s ease-in-out .2s both}.play .sa-ring path{animation:sa-fade .2s ease-out 1.4s both}.play .sa-ring{animation:sa-cycle 12s linear 1.6s infinite}
.play .sa-point,.play .sa-callout{animation:sa-pop .4s ease-out calc(.5s + var(--i,4)*.22s) both}.play .sa-area{animation:sa-fade .8s ease-out 1.2s both}
.play .sa-letters b{animation:sa-assemble 1.3s cubic-bezier(.25,1,.5,1) calc(var(--i,0)*.09s) both}.play .sa-letters span{animation:sa-rise .5s ease-out 1.1s both}
.play .sa-giant,.play .sa-quote{animation:sa-pop .7s cubic-bezier(.3,1.4,.5,1) .1s both}
.play .sa-arc{animation:sa-arc 1.2s cubic-bezier(.65,0,.35,1) calc(.3s + var(--i,0)*.18s) both}
.play .sa-pictos .is-hot{animation:sa-fill .01s linear calc(.4s + var(--i,0)*.14s) both,sa-pop .35s ease-out calc(.4s + var(--i,0)*.14s) both;transform-box:fill-box;transform-origin:center}
.play .sa-funnel div{animation:sa-open .8s cubic-bezier(.76,0,.24,1) calc(.3s + var(--i,0)*.16s) both}
.play .sa-checks div{animation:sa-rise .45s ease-out calc(.2s + var(--i,0)*.3s) both}.play .sa-checks path{animation:sa-draw .35s ease-out calc(.55s + var(--i,0)*.3s) both}
@keyframes sa-arc{from{stroke-dasharray:0 100}}
@keyframes sa-fill{from{fill:var(--t-surface)}}
@keyframes sa-open{from{clip-path:inset(0 50%);opacity:0}to{clip-path:inset(0)}}
@keyframes sa-mark{from{background-size:0 90%}}
@keyframes sa-rise{from{opacity:0;translate:0 1.6cqw}}
@keyframes sa-stretch{from{transform:scaleX(0)}}
@keyframes sa-grow{from{transform:scaleY(0)}}
@keyframes sa-domino{from{opacity:0;transform:rotateX(88deg)}}
@keyframes sa-pop{from{opacity:0;scale:.2}}
@keyframes sa-link-grow{from{transform:scale(0)}to{transform:scale(1)}}
@keyframes sa-draw{from{stroke-dashoffset:1}}
@keyframes sa-fade{from{opacity:0}}
@keyframes sa-assemble{from{opacity:.1;translate:var(--dx) var(--dy);rotate:var(--r);scale:2}}
@keyframes sa-cycle{to{rotate:360deg}}
@keyframes sa-ticker{to{transform:translateX(-50%)}}
@media(prefers-reduced-motion:reduce){.sa-ticker div{animation:none}}
#art-dialog{border:1px solid #bac2ae;padding:0;background:var(--paper);color:var(--ink);width:min(1500px,95vw);max-width:95vw;max-height:96svh;overflow:auto;box-shadow:0 30px 100px #15200d66}#art-dialog::backdrop{background:#16200ee0;backdrop-filter:blur(5px)}
#art-dialog .td-note{font-size:12px;max-width:90ch}#art-dialog .td-stage{padding-bottom:18px}
/* Transitions et effets */
.effects{padding:45px 4% 70px;border-top:1px solid var(--line)}.effects-summary{font:11px/1.7 Arial;color:#4d5d3e;margin:0 0 6px}.effects-summary b{font-weight:400;color:#26301f}.effects-summary a{margin-left:8px;font-size:10px}
.ig-kind{display:block;font:8px monospace;letter-spacing:1px;text-transform:uppercase;color:var(--muted);margin:14px 0 -10px}
.sa-paper{background:var(--t-bg)}
/* Deux écrans superposés : .fx-a est quitté, .fx-b est celui qui arrive. Au repos, seul .fx-b se voit. */
.fx{position:absolute;inset:0}.fx-cube{perspective:120cqw}
.fx-screen{position:absolute;inset:-4.5cqw -5cqw;padding:4.5cqw 5cqw;display:grid;align-content:center;background:var(--t-bg)}
.fx-screen.sa-invert{background:var(--t-ink)}.fx-screen.sa-accent{background:var(--t-accent)}.fx-a{opacity:0}
.fx-panel{clip-path:inset(0 0 100% 0);align-content:end}.fx-letter{position:absolute;left:4cqw;bottom:1cqw;font:700 44cqw/.8 var(--t-title);color:var(--t-accent-on-ink);transform-origin:0 100%}
.fx-meta{justify-items:end;text-align:right}.fx-meta .sa-k{color:color-mix(in srgb,var(--t-bg) 70%,var(--t-ink))}
.fx-push .fx-a{box-shadow:5cqw 0 0 var(--t-accent)}
.fx-dot{display:inline-block;width:.2em;height:.2em;margin-left:.06em;border-radius:50%;background:var(--t-accent)}
.fx-strips{position:absolute;inset:-4.5cqw -5cqw;display:grid;grid-template-columns:repeat(5,1fr)}.fx-strips i{background:var(--t-ink);transform:scaleY(0);transform-origin:top}.fx-strips i:nth-child(even){background:var(--t-accent)}
.fx-page .fx-a{transform-origin:0 50%;box-shadow:4cqw 0 8cqw #0006}.fx-sheet{background:var(--t-surface)}.fx-screen.sa-invert .sa,.fx-screen.sa-invert .sa-k{color:var(--t-bg)}
.fx-cube .fx-a{transform-origin:50% 100%}.fx-cube .fx-b{transform-origin:50% 0}
.fx-through .fx-a{transform-origin:66% 58%}
.fx-type span{position:relative;display:inline-block}.fx-type s{position:absolute;left:0;top:0;white-space:nowrap;clip-path:inset(0 100% 0 0);text-decoration-color:var(--t-accent-text);text-decoration-thickness:.08em}.fx-type em{font-style:normal;display:inline-block}
.fx-word b{font-size:17cqw;text-align:center}
.fx-cascade{display:grid;grid-template-columns:repeat(3,1fr);gap:3cqw;perspective:60cqw}.fx-cascade div{display:grid;gap:1.2cqw}
.fx-cascade b{font:700 7cqw/1 var(--t-title);white-space:nowrap;padding-bottom:1.2cqw;border-bottom:max(1.5px,.4cqw) solid var(--t-ink)}.fx-cascade b span{display:inline-block;transform-origin:50% 0}
.fx-cascade div>span{font:700 1.9cqw/1.2 var(--t-body)}.fx-cascade div:last-child b{color:var(--t-accent-text)}
.fx-prism{perspective:70cqw}.fx-prism div{display:grid;gap:1cqw;background:var(--t-ink);color:var(--t-bg);border-radius:1cqw;padding:3cqw 3.4cqw;transform-origin:50% 50% -6cqw}
.fx-prism small{font:400 1.1cqw ui-monospace,monospace;letter-spacing:.2em;text-transform:uppercase;color:var(--t-accent-on-ink)}.fx-prism b{font:700 5cqw/1 var(--t-title);text-transform:uppercase;color:var(--t-accent-on-ink)}.fx-prism span{font:400 1.8cqw/1.3 var(--t-body)}
.fx-wide{display:block;font:700 6cqw/1.1 var(--t-title);text-transform:uppercase}.fx-wide span{display:inline-block;transform-origin:left;transform:scaleX(1.55)}
.fx-wipe span{display:block;position:relative;width:max-content}.fx-wipe span::after{content:'';position:absolute;inset:0;background:var(--t-accent);transform:scaleX(0);transform-origin:right}
.fx-ring{position:relative;white-space:nowrap}.fx-ring svg{position:absolute;inset:-18% -6%;width:112%;height:136%;overflow:visible}.fx-ring path{fill:none;stroke:var(--t-accent-text);stroke-width:max(2px,.55cqw);vector-effect:non-scaling-stroke;stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:0}
.fx-spot .sa-card:not(.is-hot){opacity:.28}.fx-spot .sa-card.is-hot{scale:1.08}
.fx-pile{display:grid;justify-items:start;font:700 8.4cqw/.95 var(--t-title);text-transform:uppercase;letter-spacing:-.02em}.fx-pile span{display:block}.fx-pile span:nth-child(even){margin-left:9cqw}
.fx-odometer{display:flex;align-items:flex-start;font:700 17cqw/1 var(--t-title);font-variant-numeric:lining-nums tabular-nums;height:1em;overflow:hidden;color:var(--t-accent-text)}
.fx-reel{display:block;flex:0 0 .72em;height:1em;overflow:hidden}.fx-reel i{display:grid;grid-template-rows:repeat(20,1fr);height:20em;font-style:normal;transform:translateY(calc((var(--d) + 10)*-5%))}.fx-reel i span{display:flex;align-items:center;justify-content:center;line-height:1;min-height:0}.fx-odometer em{flex:0 0 .22em}
.fx-pulse .is-hot::after{content:'';position:absolute;left:-.8cqw;top:-2.55cqw;width:4.8cqw;height:4.8cqw;border-radius:50%;border:max(1.5px,.35cqw) solid var(--t-accent);opacity:0}
.fx-zoom{position:relative}.fx-zoom>.sa-cards{opacity:.35}.fx-zoomed{position:absolute;inset:-1.5cqw 0;display:grid;gap:1cqw;align-content:center;background:var(--t-accent);color:var(--t-on-accent);border-radius:1.6cqw;padding:2cqw 3cqw;transform-origin:50% 60%}
.fx-zoomed small{font:400 1.2cqw ui-monospace,monospace;letter-spacing:.16em;text-transform:uppercase}.fx-zoomed b{font:700 3.4cqw/1.05 var(--t-title)}.fx-zoomed span{font:400 1.6cqw/1.3 var(--t-body)}
.fx-burst{position:relative}.fx-bit{position:absolute;left:50%;top:42%;width:1.6cqw;height:1.6cqw;transform:translate(var(--x),var(--y)) rotate(var(--r));background:var(--t-accent)}
.fx-bit-1{background:var(--t-accent2);border-radius:50%}.fx-bit-2{background:var(--t-ink);height:.5cqw;width:2.4cqw}.fx-bit-3{background:none;border:max(1.5px,.35cqw) solid var(--t-accent);border-radius:50%}
.fx-burst .sa-h,.fx-burst .sa-note{position:relative}
.fx-badge{position:absolute;right:-1cqw;top:-1cqw;width:19cqw;height:19cqw}.fx-badge g{transform-origin:50% 50%}.play .fx-badge g{animation:fx-spin 24s linear infinite}
.fx-badge text{font:700 6.6px var(--t-body);letter-spacing:.06em;fill:var(--t-ink)}.fx-badge circle{fill:var(--t-accent)}.fx-badge .fx-badge-n{font:700 26px var(--t-title);letter-spacing:0;fill:var(--t-on-accent);text-anchor:middle}
.play .fx-cut .fx-a{animation:fx-hold-a 2.6s linear both}.play .fx-cut .fx-panel{animation:fx-cut 2.6s cubic-bezier(.76,0,.24,1) both}.play .fx-cut .fx-letter{animation:fx-letter 2.6s cubic-bezier(.16,1,.3,1) both}.play .fx-cut .fx-meta{animation:sa-rise .5s ease-out .8s both}
.play .fx-push .fx-a{animation:fx-push-out 1.3s cubic-bezier(.76,0,.24,1) .5s both}.play .fx-push .fx-b{animation:fx-push-in 1.3s cubic-bezier(.76,0,.24,1) .5s both}
.play .fx-flood .fx-a{animation:fx-hold-b 1.9s linear both}.play .fx-flood .fx-dot{animation:fx-flood 1.9s cubic-bezier(.7,0,.84,0) both}.play .fx-flood .fx-b .sa-h{animation:sa-rise .5s ease-out 1.7s both}
.play .fx-blades .fx-a{animation:fx-hold-c 1.9s linear both}.play .fx-blades .fx-strips i{animation:fx-blade 1.5s cubic-bezier(.76,0,.24,1) calc(.3s + var(--i)*.08s) both}
.play .fx-iris .fx-a{animation:fx-hold-b 1.6s linear both}.play .fx-iris .fx-b{animation:fx-iris 1.2s cubic-bezier(.65,0,.35,1) .4s both}
.play .fx-through .fx-a{animation:fx-through 1.5s cubic-bezier(.7,0,.84,0) .5s both}.play .fx-through .fx-b .sa{animation:sa-fade .5s ease-out 1.6s both}
.play .fx-page .fx-a{animation:fx-page 1.3s cubic-bezier(.65,0,.35,1) .5s both}
.play .fx-cube .fx-a{animation:fx-cube-out 1.2s cubic-bezier(.65,0,.35,1) .5s both}.play .fx-cube .fx-b{animation:fx-cube-in 1.2s cubic-bezier(.65,0,.35,1) .5s both}
.play .fx-type s{animation:fx-wrong 3.2s steps(24,end) both}.play .fx-type em{animation:fx-right 3.2s steps(24,end) both}.play .fx-type .sa-mark{animation-delay:3.2s}
.play .fx-cascade b span{animation:fx-fall .5s cubic-bezier(.3,1.5,.5,1) calc(var(--g)*.5s + var(--i)*.07s) both}.play .fx-cascade div>span{animation:sa-rise .5s ease-out calc(var(--g)*.5s + .5s) both}
.play .fx-prism div{animation:fx-prism 1s cubic-bezier(.65,0,.35,1) .2s both}
.play .fx-fly .sa-pill{animation:fx-fly 1s cubic-bezier(.25,1,.5,1) calc(var(--i)*.16s) both}.play .fx-fly .sa-lines path{animation-delay:calc(.6s + var(--i)*.16s)}.play .fx-fly .sa-hub{animation-delay:1.6s}
.play .fx-wide span{animation:fx-wide 3s cubic-bezier(.37,0,.63,1) .4s both}.play .fx-wide .sa-mark{animation:none}
.play .fx-wipe span{animation:fx-wipe-text .9s linear calc(.2s + var(--i)*.45s) both}.play .fx-wipe span::after{animation:fx-wipe .9s cubic-bezier(.76,0,.24,1) calc(.2s + var(--i)*.45s) both}
.play .fx-ring path{animation:sa-draw .8s cubic-bezier(.65,0,.35,1) .8s both}
.play .fx-spot .sa-card{animation:fx-dim .6s ease-out 1.2s both}.play .fx-spot .sa-card.is-hot{animation:fx-lift .6s cubic-bezier(.3,1.4,.5,1) 1.2s both}
.play .fx-pile span{animation:fx-drop .5s cubic-bezier(.3,1.4,.5,1) calc(.15s + var(--i)*.32s) both}.play .fx-pile .sa-mark{animation-delay:1.6s}
.play .fx-reel i{animation:fx-roll calc(1s + var(--i)*.35s) cubic-bezier(.2,.7,.2,1) both}
.play .fx-pulse .is-hot::after{animation:fx-pulse 1s ease-out 1s 2 both}
.play .fx-zoomed{animation:fx-zoom .8s cubic-bezier(.65,0,.35,1) 1.2s both}.play .fx-zoom>.sa-cards{animation:fx-dim2 .5s ease-out 1.2s both}
.play .fx-bit{animation:fx-burst 1.1s cubic-bezier(.16,.5,.35,1) calc(.12s + var(--i)*.004s) both}.play .fx-burst .sa-h{animation:sa-pop .3s ease-out both}
@keyframes fx-hold-a{0%,24%{opacity:1}24.1%,100%{opacity:0}}
@keyframes fx-hold-b{0%,80%{opacity:1}100%{opacity:0}}
@keyframes fx-hold-c{0%,52%{opacity:1}52.1%,100%{opacity:0}}
@keyframes fx-cut{0%{clip-path:inset(100% 0 0 0)}24%,70%{clip-path:inset(0 0 0 0)}100%{clip-path:inset(0 0 100% 0)}}
@keyframes fx-letter{0%,16%{transform:scaleX(.08) scaleY(1.3)}50%,100%{transform:none}}
@keyframes fx-push-out{from{opacity:1;translate:0 0}to{opacity:1;translate:-112% 0}}
@keyframes fx-push-in{from{translate:112% 0}}
@keyframes fx-flood{0%,25%{scale:1}80%,100%{scale:160}}
@keyframes fx-blade{0%{transform:scaleY(0);transform-origin:bottom}40%,55%{transform:scaleY(1);transform-origin:bottom}55.1%{transform:scaleY(1);transform-origin:top}100%{transform:scaleY(0);transform-origin:top}}
@keyframes fx-iris{from{clip-path:circle(0 at 30% 62%)}to{clip-path:circle(150% at 30% 62%)}}
@keyframes fx-through{0%{opacity:1;scale:1}75%{opacity:1}100%{opacity:0;scale:26}}
@keyframes fx-page{from{opacity:1;transform:perspective(140cqw) rotateY(0)}to{opacity:1;transform:perspective(140cqw) rotateY(96deg)}}
@keyframes fx-cube-out{from{opacity:1;transform:translateY(0) rotateX(0)}to{opacity:.2;transform:translateY(-100%) rotateX(80deg)}}
@keyframes fx-cube-in{from{transform:translateY(100%) rotateX(-80deg)}}
@keyframes fx-wrong{0%{clip-path:inset(0 100% 0 0);text-decoration-line:none}30%,34%{clip-path:inset(0);text-decoration-line:none}35%,45%{clip-path:inset(0);text-decoration-line:line-through}58%,100%{clip-path:inset(0 100% 0 0);text-decoration-line:line-through}}
@keyframes fx-right{0%,60%{clip-path:inset(0 100% 0 0)}100%{clip-path:inset(0 0 0 0)}}
@keyframes fx-fall{from{opacity:0;transform:rotateX(90deg)}}
@keyframes fx-prism{from{transform:rotateX(-90deg);filter:brightness(.3)}}
@keyframes fx-fly{from{opacity:0;translate:calc(-50% + var(--fx)) calc(-50% + var(--fy));rotate:-25deg;scale:1.6}}
@keyframes fx-wide{from{transform:scaleX(1)}}
@keyframes fx-wipe{0%{transform:scaleX(0);transform-origin:left}50%{transform:scaleX(1);transform-origin:left}50.1%{transform:scaleX(1);transform-origin:right}100%{transform:scaleX(0);transform-origin:right}}
@keyframes fx-wipe-text{0%,50%{color:transparent}50.1%,100%{color:inherit}}
@keyframes fx-dim{from{opacity:1}}
@keyframes fx-dim2{from{opacity:1}}
@keyframes fx-lift{from{scale:1}}
@keyframes fx-drop{from{opacity:0;translate:0 -6cqw;rotate:-6deg}}
@keyframes fx-roll{from{transform:translateY(0)}}
@keyframes fx-pulse{from{opacity:.9;scale:.4}to{opacity:0;scale:1.9}}
@keyframes fx-zoom{from{opacity:0;scale:.2 .4;translate:0 1cqw}}
@keyframes fx-burst{from{opacity:0;transform:translate(0,0) rotate(0deg) scale(.2)}to{opacity:1;transform:translate(var(--x),var(--y)) rotate(var(--r)) scale(1)}}
@keyframes fx-spin{to{rotate:360deg}}
@media(prefers-reduced-motion:reduce){.fx-badge g{animation:none}}
#art-dialog .ig-preview{width:min(100%,calc((96svh - 190px)*16/9));cursor:default;border:0}#art-dialog .td-frame{width:100%}

@media(prefers-reduced-motion:reduce){.ig-preview *,.ig-preview *::before,.ig-preview *::after{animation:none!important;transition:none!important}}
@media print{.ig-preview *,.ig-preview *::before,.ig-preview *::after{animation:none!important;transition:none!important}}

#art-dialog:has(.td-controls) .ig-preview{width:min(100%,calc((96svh - 240px)*16/9))}

#art-dialog .td-controls>button{width:auto;min-width:80px;padding:8px 14px;font:12px Arial,sans-serif}
