/* Solo manual countdown — the MC-driven digit artwork, one asset per click.
   Transparent full-viewport stage (OBS composites this over the stream, so the
   page itself must never paint a background). Square-ish canvas suits a digit;
   the media is contained, so any OBS source size works. */
html,body{width:100%;height:100%;margin:0;overflow:hidden;background:transparent;scrollbar-width:none;-ms-overflow-style:none}
::-webkit-scrollbar{display:none}
#media{position:fixed;inset:0;display:grid;place-items:center;pointer-events:none}
#media img,#media video{width:100%;height:100%;object-fit:contain;animation:mcd-in .18s ease-out both}
@keyframes mcd-in{from{opacity:0;transform:scale(.88)}to{opacity:1;transform:scale(1)}}
/* Exit for the LAST step only — it plays, then leaves rather than freezing on
   screen.
   A keyframe animation, NOT a transition. The entry above fills with `both`, so
   the element's opacity is animation-controlled; a rule that clears
   `animation` and sets `opacity:0` in the same style change gives Chromium no
   before-value to interpolate from and it snaps instead — which is exactly the
   hard cut this is meant to avoid. Replacing one animation with another composes
   cleanly and always plays.
   Duration is mirrored by EXIT_FADE_MS in script.js. */
#media img.is-leaving,#media video.is-leaving,#media .mcd-digit.is-leaving{animation:mcd-out .7s ease-in both}
@keyframes mcd-out{from{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(.97)}}
/* Built-in sequence (no countdown media bound): one big digit per click. Sized
   from the source box so it fills whatever OBS canvas the MC gave it, and it
   lands a beat rather than fading in — it replaces a spoken "ten… nine…". */
#media .mcd-digit{
    font:900 min(62vmin,62vw)/1 'Outfit','Segoe UI',system-ui,-apple-system,sans-serif;
    color:#fff;
    text-shadow:0 0 .06em rgba(0,0,0,.6),0 .04em .09em rgba(0,0,0,.55);
    -webkit-text-stroke:.028em rgba(0,0,0,.4);
    font-variant-numeric:tabular-nums;
    animation:mcd-beat .28s cubic-bezier(.2,1.5,.4,1) both;
}
@keyframes mcd-beat{from{opacity:0;transform:scale(1.45)}to{opacity:1;transform:scale(1)}}
/* Off-screen warm-up for the remaining steps — never visible, never clickable. */
#preload{position:fixed;width:1px;height:1px;left:-9999px;top:-9999px;opacity:0;pointer-events:none;overflow:hidden}