/* Mandyben Propal · base du moteur. Chaque version définit ses couleurs via ces variables :
   --deck-bg (fond autour de la scène), --hud-bg, --hud-fg, --hud-line, --bar (barre de progression). */
html.deck-root,html.deck-root body{height:100%;margin:0;overflow:hidden}
html.deck-root body{background:var(--deck-bg,#e9e9e9)}
.deck-viewport{position:fixed;inset:0;overflow:hidden}
.deck-stage{position:absolute;left:50%;top:50%;width:1920px;height:1080px;transform-origin:50% 50%}
.deck{position:absolute;inset:0;perspective:2400px}
.deck>.slide{position:absolute;inset:0;overflow:hidden;visibility:hidden;pointer-events:none;box-sizing:border-box}
.deck>.slide.vis{visibility:visible}
.deck>.slide.cur{pointer-events:auto}
.deck *{box-sizing:border-box}

/* apparitions */
[data-a]{opacity:0;transform:translateY(28px);transition:opacity .8s cubic-bezier(.16,1,.3,1),transform .9s cubic-bezier(.16,1,.3,1),filter .8s cubic-bezier(.16,1,.3,1)}
[data-a="left"]{transform:translateX(-40px)}
[data-a="right"]{transform:translateX(40px)}
[data-a="scale"]{transform:scale(.92)}
[data-a="fade"]{transform:none}
[data-a="blur"]{transform:none;filter:blur(14px)}
.slide.in [data-a]{opacity:1;transform:none;filter:none;transition-delay:calc(var(--d0,250ms) + var(--i,0) * var(--step,70ms))}
[data-f]{transition:opacity .6s cubic-bezier(.16,1,.3,1),transform .7s cubic-bezier(.16,1,.3,1),filter .6s}
[data-f]:not(.shown){opacity:0!important;transform:translateY(18px)!important}
html.shot [data-a],html.shot [data-f]{transition:none!important}
html.shot *{animation-play-state:paused!important}

/* HUD */
.deck-hud{position:fixed;left:50%;bottom:calc(14px + env(safe-area-inset-bottom,0px));transform:translateX(-50%);z-index:50;display:flex;align-items:center;gap:6px;padding:6px;border-radius:999px;background:var(--hud-bg,rgba(255,255,255,.86));color:var(--hud-fg,#020308);border:1px solid var(--hud-line,rgba(2,3,8,.08));backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);box-shadow:0 8px 30px -10px rgba(0,0,0,.25);transition:opacity .5s;font:500 12px/1 "IBM Plex Mono",ui-monospace,monospace;letter-spacing:.08em}
.dh-b{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;border:0;background:transparent;color:inherit;cursor:pointer}
.dh-b:hover{background:rgba(127,127,127,.16)}
.dh-c{padding:0 6px;font-variant-numeric:tabular-nums}
.dh-sp{width:1px;height:18px;background:currentColor;opacity:.15;margin:0 2px}
body.deck-idle .deck-hud{opacity:0}
body.deck-idle{cursor:none}
.deck-bar{position:fixed;left:0;top:0;height:3px;width:100%;z-index:50;background:var(--bar,#22AA7C);transform-origin:left;transform:scaleX(0);transition:transform .8s cubic-bezier(.16,1,.3,1)}
.deck-hint{position:fixed;left:50%;top:14px;transform:translateX(-50%);z-index:50;font:500 11px/1 "IBM Plex Mono",ui-monospace,monospace;letter-spacing:.12em;text-transform:uppercase;padding:9px 14px;border-radius:999px;background:var(--hud-bg,rgba(255,255,255,.86));color:var(--hud-fg,#020308);border:1px solid var(--hud-line,rgba(2,3,8,.08));transition:opacity .8s;white-space:nowrap;pointer-events:none}
.deck-hint.off{opacity:0}
html.shot .deck-hud,html.shot .deck-bar,html.shot .deck-hint{display:none}
body.deck-ov .deck>.slide{visibility:visible;pointer-events:auto;cursor:pointer;transition:transform .6s cubic-bezier(.77,0,.18,1);outline:8px solid transparent}
body.deck-ov .deck>.slide:hover{outline-color:var(--bar,#22AA7C)}
@media (max-width:640px){.deck-hint{display:none}}
@media (prefers-reduced-motion:reduce){[data-a],[data-f]{transition:none!important}}