/* The Mystery of the Giant Shadow. Stage units: 1cqw = 1% of stage width; the stage is 16:9. */
.mx-card{max-width:min(1100px,calc((100svh - 360px) * 16 / 9));min-width:min(100%,560px);margin:18px auto 0;border-radius:28px;overflow:hidden;background:#1f1440;box-shadow:0 20px 50px #1c123355;border:4px solid #f6cf72}
.mx-card h1:focus{outline:none}
.mx-stage{position:relative;width:100%;aspect-ratio:16/9;container-type:size;overflow:hidden;isolation:isolate;user-select:none}
.mx-stage>*{position:absolute}
.mx-sky{inset:0;background:linear-gradient(#0b1838 0%,#1b2a5c 42%,#463a78 66%,#c97a6c 84%,#f0ad78 100%)}
.mx-moon{left:9%;top:7%;width:5.5cqw;height:5.5cqw;border-radius:50%;background:radial-gradient(circle at 35% 35%,#fffcec,#efdca6);box-shadow:0 0 4cqw #fff1bf80}
.mx-star{width:.35cqw;height:.35cqw;border-radius:50%;background:#fff;box-shadow:0 0 .6cqw #fff;animation:mx-twinkle 3.2s var(--d) ease-in-out infinite}
.mx-trees{left:0;right:0;overflow:hidden}
.mx-trees>div{display:flex;width:200%;height:100%}
.mx-trees svg{width:50%;height:100%;display:block}
.mx-trees-back{bottom:14%;height:46%;opacity:.95}
.mx-trees-front{bottom:9%;height:38%}
.mx-trees.walking>div{animation:mx-walk 16s linear infinite}
.mx-trees-back.walking>div{animation-duration:30s}
.mx-ground{left:0;right:0;bottom:0;height:14%;background:linear-gradient(#25371f,#121c12)}
.mx-firefly{width:.5cqw;height:.5cqw;border-radius:50%;background:#fff3b5;box-shadow:0 0 1cqw .4cqw #ffd76b99;z-index:12;pointer-events:none;animation:mx-drift var(--t) var(--d) ease-in-out infinite}

/* Campsite and light lab */
.mx-tent{left:58%;top:14%;width:40%;height:80%;z-index:4}
.mx-tent svg{width:100%;height:100%;display:block}
.mx-campfire{left:44%;bottom:6%;width:7cqw;height:7cqw;z-index:5}
.mx-campfire i{position:absolute;bottom:0;left:30%;width:40%;height:80%;border-radius:50% 50% 45% 45%/70% 70% 30% 30%;background:radial-gradient(circle at 50% 80%,#fff4b0,#ffb03b 45%,#e8582a 80%,transparent);transform-origin:50% 100%;animation:mx-flame 1s ease-in-out infinite alternate;filter:drop-shadow(0 0 1.5cqw #ff9a3c)}
.mx-campfire i:nth-child(2){left:12%;height:55%;animation-delay:.3s}.mx-campfire i:nth-child(3){left:52%;height:62%;animation-delay:.6s}
.mx-title{left:28%;right:3%;top:7%;text-align:center;z-index:11;color:#ffe7a3;font-family:Georgia,'Times New Roman',serif;text-shadow:0 0 1.5cqw #f6cf72aa,0 .3cqw 0 #3b2163;animation:mx-title-in 1.4s cubic-bezier(.2,.9,.3,1.3) both}
.mx-title span{display:block;font-size:2.6cqw;color:#f3e6ff}
.mx-title strong{display:block;font-size:6.4cqw;line-height:1.05}
.mx-stump{z-index:5;left:5.5%;top:60%;width:9%;height:30%;border-radius:1cqw 1cqw .4cqw .4cqw;background:linear-gradient(90deg,#5a3a1f,#8a5c34 40%,#6e4624);box-shadow:inset 0 1.2cqw 0 #b88a58}
.mx-flashlight{width:13cqw;z-index:8;filter:drop-shadow(0 .5cqw .6cqw #0008)}
.mx-flashlight svg{width:100%;display:block}
.mx-lens{animation:mx-lens 2.4s ease-in-out infinite}
.mx-beam{inset:0;z-index:5;pointer-events:none;background:linear-gradient(90deg,#fff7cfdd 15%,#ffe9a07a 45%,#ffe39a2a);mix-blend-mode:screen}
.mx-beam.sweep{animation:mx-beam-on 1.5s ease-out both}
.mx-screen{inset:0;z-index:6;pointer-events:none}
.mx-tent-screen{clip-path:polygon(78% 15%,97.5% 94%,58.5% 94%)}
.mx-rock-screen{clip-path:polygon(54.8% 92%,52.9% 73.6%,55.7% 53.1%,58.5% 40.8%,61.2% 24.4%,67.7% 14.2%,76% 11.7%,85.2% 8.9%,93.5% 18.3%,97.2% 34.7%,100% 49%,99.5% 73.6%,100% 92%)}
.mx-shadow{position:absolute;transition:left .45s ease,top .45s ease,width .45s ease,height .45s ease}
.mx-shadow img,.mx-shadow svg{width:100%;height:100%;display:block;filter:brightness(0) blur(.22cqw);opacity:.8}
.mx-pinecone-svg.shadow *{fill:#000;stroke:#000}
.dragging .mx-shadow,.dragging .mx-handle{transition:none}

.mx-handle{z-index:9;border:0;padding:0;background:none;cursor:grab;touch-action:none;transition:left .45s ease,top .45s ease;-webkit-tap-highlight-color:transparent}
.mx-handle::before{content:'';position:absolute;inset:-60% -60%;border-radius:50%;background:radial-gradient(closest-side,#fff3c455,transparent);animation:mx-pulse 1.8s ease-in-out infinite}
.mx-handle svg,.mx-handle img{position:relative;width:100%;height:100%;display:block;filter:drop-shadow(0 .3cqw .4cqw #0007)}
.mx-handle:active{cursor:grabbing}
.mx-handle:focus-visible{outline:.35cqw solid #fff;outline-offset:.4cqw;border-radius:1cqw}
.mx-grip{position:absolute;left:50%;bottom:112%;translate:-50% 0;padding:.25cqw 1cqw;border-radius:99px;background:#ffe9a3;color:#3b2160;font:900 max(1.6cqw,12px)/1.2 ui-rounded,'Segoe UI',sans-serif;white-space:nowrap;box-shadow:0 .3cqw .8cqw #0006}
.mx-lab .mx-handle::after{content:'';position:absolute;left:46%;width:8%;top:96%;height:205%;border-radius:1cqw;background:linear-gradient(90deg,#7a5230,#a8774a)}
.cheer .mx-handle svg,.cheer .mx-handle img{animation:mx-bounce .7s ease}
.mx-rule{left:3%;top:4%;width:38%;z-index:11;display:grid;grid-template-columns:1fr 1fr;gap:1cqw;padding:1.2cqw;border-radius:1.6cqw;background:#fff8ea;border:.3cqw solid #f6cf72;color:#34204f;font:700 max(1.45cqw,10px)/1.3 ui-rounded,'Segoe UI',sans-serif;box-shadow:0 1cqw 2cqw #0007;opacity:0;scale:.6;transform-origin:0 0;transition:opacity .5s,scale .5s cubic-bezier(.2,.9,.3,1.4)}
.mx-rule b{font-size:max(1.9cqw,12px);color:#5b3a9c}
.mx-rule .big{display:block;font-size:4.5cqw;line-height:1}.mx-rule .small{display:block;font-size:2cqw;line-height:2.25}
.show-rule .mx-rule{opacity:1;scale:1}

/* Night walk */
.mx-bush{right:5%;bottom:5%;width:24%;z-index:7}
.mx-bush svg{width:100%;display:block;transform-origin:50% 100%}
.rustling .mx-bush svg{animation:mx-rustle .32s ease-in-out 8 alternate}
.mx-rustle{position:absolute;color:#fff3c4;font:900 italic max(2cqw,12px) ui-rounded,'Segoe UI',sans-serif;opacity:0;text-shadow:0 0 1cqw #000}
.mx-rustle.r1{left:5%;top:-10%}.mx-rustle.r2{right:0;top:-22%}
.rustling .mx-rustle{animation:mx-word 2.6s ease-out both}.rustling .mx-rustle.r2{animation-delay:.5s}

/* Dragon detective */
.mx-dragon{z-index:6;transform-origin:50% 100%;filter:drop-shadow(0 .5cqw .8cqw #0007)}
.mx-dragon.waving{left:6%;bottom:6%;height:56%;animation:mx-sway 3s ease-in-out infinite}
.mx-dragon.walking{left:26%;bottom:5%;height:46%;animation:mx-step .55s ease-in-out infinite alternate}
.mx-dragon.peeking,.mx-dragon.peek-calm{left:2%;top:36%;height:34%}
.mx-dragon.peeking{animation:mx-peek 2s ease-out both}
.mx-dragon.peek-calm{animation:mx-breathe 4s ease-in-out infinite}

/* Forest rock scene */
.mx-rock{left:52%;top:6%;width:48%;height:86%;z-index:4}
.mx-rock svg{width:100%;height:100%;display:block}
.mx-rock::after{content:'';position:absolute;inset:0;background:radial-gradient(ellipse 45% 40% at 50% 52%,#fff2c066,transparent);mix-blend-mode:screen}
.mx-log{left:0;top:61%;width:27%;z-index:7}
.mx-log svg{width:100%;display:block}
.mx-phase-shadow .mx-mystery{transform:scaleY(0);transform-origin:50% 100%;opacity:0}
.mx-phase-shadow.risen .mx-mystery{animation:mx-rise 1.6s cubic-bezier(.2,.9,.25,1.15) forwards,mx-loom 3.5s 1.6s ease-in-out infinite}
.mx-phase-clues .mx-mystery,.mx-phase-reveal .mx-mystery{animation:mx-loom 3.5s ease-in-out infinite;transform-origin:50% 100%}
.mx-clue{z-index:10;width:max(7cqw,48px);height:max(7cqw,48px);translate:-50% -50%;padding:.8cqw;border:0;border-radius:50%;background:radial-gradient(closest-side,#fff5c488,transparent);cursor:pointer;animation:mx-pulse 1.6s ease-in-out infinite}
.mx-clue svg{width:100%;height:100%;display:block;filter:drop-shadow(0 0 .6cqw #ffd76a)}
.mx-clue:focus-visible{outline:.35cqw solid #fff}
.mx-clue.found{animation:none;opacity:.5;cursor:default}
.mx-clue.found::after{content:'';position:absolute;inset:-35%;border:.4cqw solid #ffe28a;border-radius:50%;animation:mx-ring .9s ease-out forwards}
.mx-ghost img{filter:brightness(0) drop-shadow(0 0 .25cqw #ffd76a) drop-shadow(0 0 .25cqw #ffd76a);opacity:.42}
.mx-test{animation:mx-grow .9s .25s cubic-bezier(.2,.9,.3,1.2) both;transform-origin:50% 100%}
.mx-test img{filter:brightness(0) sepia(1) hue-rotate(210deg) saturate(4) brightness(.45) blur(.2cqw);opacity:.75}
.mx-test.match img{filter:brightness(0) blur(.2cqw);opacity:.85}
.mx-test.match{animation:mx-grow .9s .25s cubic-bezier(.2,.9,.3,1.2) both,mx-glow 1.2s 1.2s ease-in-out 3}
.mx-actor{z-index:9}
.mx-actor img{width:100%;height:100%;display:block}
.mx-actor.arriving{animation:mx-arrive .8s cubic-bezier(.2,.9,.3,1.2) both}
.mx-spotlight{z-index:9;width:20cqw;height:20cqw;translate:-50% -50%;border-radius:50%;box-shadow:0 0 0 300cqw #070510a8,inset 0 0 3cqw 1cqw #070510a8;pointer-events:none;animation:mx-iris 1.6s ease-in-out both}
.mx-hero{z-index:10;transform-origin:50% 100%;animation:mx-hero-in 1s .8s cubic-bezier(.2,.9,.3,1.4) both}
.mx-hero img{animation:mx-twitch 2.2s 2s ease-in-out infinite;transform-origin:85% 40%}
.mx-phase-play .mx-live-shadow,.mx-lab .mx-live-shadow{z-index:6}
.cheer .mx-live-shadow{animation:mx-glow .9s ease-in-out}

/* Controls under the stage */
.mx-hud{padding:16px 20px 20px;background:linear-gradient(#2c1a52,#1f1440);color:#fff8ea;text-align:center}
.mx-trail{display:flex;justify-content:center;flex-wrap:wrap;gap:6px;list-style:none;margin:0 0 10px;padding:0}
.mx-trail li{display:flex;align-items:center;gap:5px;padding:6px 10px;border-radius:99px;background:#ffffff12;color:#bfb0dc;font-size:12px;font-weight:800}
.mx-trail li.done{background:#f6cf7233;color:#ffe7a3}
.mx-trail li.current{background:#f6cf72;color:#3b2160;box-shadow:0 0 14px #f6cf7299}
.mx-prompt{font:700 clamp(17px,2.1vw,22px)/1.45 ui-rounded,'Segoe UI Rounded','Segoe UI',sans-serif;margin:6px auto 14px;max-width:820px}
.mx-controls{display:flex;justify-content:center;flex-wrap:wrap;gap:12px;align-items:stretch}
.mx-hud .btn{background:#efe6ff;color:#3b2160;font-size:17px}
.mx-hud .btn.primary{background:linear-gradient(180deg,#ffe08f,#f0b14a);color:#3b2160;box-shadow:0 4px 0 #b97a22;font-size:19px;padding:16px 28px;animation:mx-pulse 2.2s ease-in-out infinite}
.mx-notebook{display:flex;gap:10px;flex-wrap:wrap;justify-content:center;width:100%}
.mx-note{display:flex;align-items:center;gap:8px;min-width:170px;padding:12px 16px;border-radius:16px;border:2px dashed #8f7bb8;color:#bfb0dc;font-weight:800}
.mx-note span{font-size:22px}
.mx-note.found{border:2px solid #f6cf72;background:#fff8ea;color:#3b2160;animation:mx-note-in .6s cubic-bezier(.2,.9,.3,1.4)}
.mx-lineup{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;width:100%;max-width:860px}
.mx-suspect{position:relative;display:flex;flex-direction:column;align-items:center;gap:6px;padding:10px 8px 12px;min-height:150px;border-radius:18px;border:3px solid #f0dfb5;background:#fff8ea;color:#3b2160;font:800 16px ui-rounded,'Segoe UI',sans-serif;cursor:pointer;transition:translate .2s,box-shadow .2s}
.mx-suspect:hover:not(:disabled),.mx-suspect:focus-visible{translate:0 -4px;box-shadow:0 0 20px #f6cf72aa;border-color:#f6cf72}
.mx-suspect-art{height:100px;width:100%;display:flex;align-items:flex-end;justify-content:center}
.mx-suspect-art img{height:var(--h);max-width:100%;object-fit:contain}
.mx-suspect.ruled-out{opacity:.6;cursor:default}
.mx-suspect.ruled-out img{filter:grayscale(.8)}
.mx-stamp{position:absolute;top:34%;left:50%;translate:-50% 0;rotate:-12deg;padding:4px 10px;border:3px solid #c0392b;border-radius:8px;color:#c0392b;background:#fff8eae6;font-size:14px;white-space:nowrap;animation:mx-stamp .4s cubic-bezier(.2,.9,.3,1.6)}
.mx-suspect.match{border-color:#f6cf72;box-shadow:0 0 24px #f6cf72;opacity:1}

/* Finish */
.mx-finish{padding:30px 24px;text-align:center;background:radial-gradient(circle at 50% 0,#4a2b86,#1f1440 70%);color:#fff8ea}
.mx-finish .eyebrow{color:#f6cf72}
.mx-finish h1{font-family:Georgia,'Times New Roman',serif;color:#ffe7a3;font-size:clamp(28px,4.5vw,44px);margin:8px 0}
.mx-badge{width:150px;margin:0 auto;animation:mx-badge 1.4s cubic-bezier(.2,.9,.3,1.3) both;filter:drop-shadow(0 0 22px #f6cf72aa)}
.mx-badge svg{width:100%;display:block}
.mx-recap{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:14px;max-width:720px;margin:18px auto;text-align:left}
.mx-recap>div{display:flex;flex-direction:column;gap:6px;padding:16px;border-radius:18px;background:#ffffff14;border:2px solid #f6cf7266}
.mx-recap b{color:#ffe7a3}
.mx-finish .small{color:#d9cdee}
.mx-finish .btn{background:#efe6ff;color:#3b2160}.mx-finish .btn.primary{background:linear-gradient(180deg,#ffe08f,#f0b14a);box-shadow:0 4px 0 #b97a22}

/* Over-the-shoulder 3D view. The camera orbits from the side (rotated world) to behind the flashlight. */
.mx-side{inset:0;transform-origin:35% 65%;transition:opacity .9s .25s,transform 1.7s cubic-bezier(.45,0,.2,1)}
.mx-side>*,.mx-3d-sky>*{position:absolute}
.view-behind .mx-side{opacity:0;transform:perspective(80cqw) rotateY(38deg) translateX(-12cqw) scale(1.25);pointer-events:none}
.mx-phase-behind .mx-live-shadow{z-index:6}
.mx-3d{inset:0;overflow:hidden;perspective:80cqw;perspective-origin:50% 50%;opacity:0;pointer-events:none;transition:opacity .7s;background:linear-gradient(#0b1838 0%,#1b2a5c 34%,#463a78 50%,#c97a6c 58%,#f0ad78 62%)}
.view-behind .mx-3d{opacity:1;pointer-events:auto;transition-delay:.15s}
.mx-3d-sky{position:absolute;inset:0}
.mx-cam{position:absolute;inset:0;transform-style:preserve-3d;transform-origin:50% 50% -85cqw;transform:rotateY(-72deg) translateX(8cqw);transition:transform 1.9s cubic-bezier(.45,0,.2,1)}
.view-behind .mx-cam{transform:none}
.mx-3d-el{position:absolute;left:50%;top:50%}
.mx-trees3d svg,.mx-wall3d>svg{position:absolute;inset:0;width:100%;height:100%;display:block}
.mx-ground3d{transform-origin:50% 0;background:linear-gradient(#2a3d22,#16241a 18%,#0d1710 40%,#0b140d)}
.mx-wall-glow{position:absolute;inset:0;background:radial-gradient(ellipse 30% 46% at 52% 68%,#fff2c099,transparent 72%);mix-blend-mode:screen;pointer-events:none}
.mx-wall-shadows{position:absolute;inset:0;clip-path:polygon(5.8% 100%,1.9% 78.6%,7.7% 54.8%,13.5% 40.5%,19.2% 21.4%,32.7% 9.5%,50% 6.7%,69.2% 3.3%,86.5% 14.3%,94.2% 33.3%,100% 50%,99% 78.6%,100% 100%)}
.mx-shadow3d{position:absolute;transition:left .45s ease,top .45s ease,width .45s ease,height .45s ease}
.mx-flash3d{border-radius:50%;background:radial-gradient(circle at 42% 38%,#5b6170,#1a1d25 72%);border:.7cqw solid #6b7282;box-shadow:0 0 5cqw 2cqw #ffe9a055,inset 0 0 1.2cqw #000}
.mx-mouse3d{border:0;padding:0;background:none;cursor:grab;touch-action:none;transition:transform .45s ease;-webkit-tap-highlight-color:transparent}
.mx-mouse3d img{position:relative;width:100%;height:100%;display:block;filter:drop-shadow(0 .3cqw .4cqw #0008)}
.mx-mouse3d::before{content:'';position:absolute;inset:-30%;border-radius:50%;background:radial-gradient(closest-side,#fff3c433,transparent);animation:mx-pulse 1.8s ease-in-out infinite}
.mx-mouse3d:focus-visible{outline:.35cqw solid #fff;outline-offset:.4cqw;border-radius:1cqw}
.mx-mouse3d:active{cursor:grabbing}
.dragging .mx-mouse3d,.dragging .mx-shadow3d{transition:none}
.mx-beam3d{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;mix-blend-mode:screen;opacity:0;transition:opacity .5s}
.view-behind .mx-beam3d{opacity:1;transition:opacity 1s 1.7s}
.mx-shoulder{position:absolute;left:-10%;bottom:-40%;height:100%;pointer-events:none;filter:brightness(.16) saturate(.3) blur(.2cqw) drop-shadow(.35cqw -.2cqw 0 #ffcf7a77);opacity:0;transform:translateX(-14cqw);transition:transform 1.3s .2s ease,opacity .6s}
.view-behind .mx-shoulder{opacity:1;transform:none;transition:transform 1.4s 1.2s cubic-bezier(.2,.8,.2,1),opacity .8s 1.2s}

@media (max-width:650px){
 .mx-card{border-width:3px;border-radius:20px;margin-top:10px}
 .mx-hud{padding:12px 12px 16px}
 .mx-trail li{font-size:0;padding:6px 8px}.mx-trail li span{font-size:16px}
 .mx-lineup{grid-template-columns:repeat(2,1fr)}
 .mx-controls .btn{flex:1 1 140px}
 .mx-note{min-width:0;flex:1 1 100%}
}

@keyframes mx-twinkle{0%,100%{opacity:.25}50%{opacity:1}}
@keyframes mx-walk{to{transform:translateX(-50%)}}
@keyframes mx-drift{0%,100%{transform:translate(0,0);opacity:.2}35%{opacity:1}50%{transform:translate(3cqw,-5cqw);opacity:.9}80%{opacity:.3}}
@keyframes mx-flame{from{transform:scale(1,1) rotate(-3deg)}to{transform:scale(.9,1.12) rotate(3deg)}}
@keyframes mx-title-in{from{opacity:0;transform:scale(.6) translateY(-3cqw)}to{opacity:1;transform:none}}
@keyframes mx-lens{0%,100%{opacity:.85}50%{opacity:1}}
@keyframes mx-beam-on{0%{opacity:0;filter:brightness(.4)}30%{opacity:.6}45%{opacity:.25}100%{opacity:1;filter:none}}
@keyframes mx-pulse{0%,100%{scale:1}50%{scale:1.07}}
@keyframes mx-bounce{0%,100%{transform:none}35%{transform:translateY(-18%) scale(1.08)}70%{transform:translateY(4%) scale(.96)}}
@keyframes mx-rustle{from{transform:rotate(-3deg) scaleX(1.02)}to{transform:rotate(3deg) scaleX(.98)}}
@keyframes mx-word{0%{opacity:0;transform:translateY(1cqw) scale(.7)}20%{opacity:1;transform:none}80%{opacity:1}100%{opacity:0;transform:translateY(-2cqw)}}
@keyframes mx-sway{0%,100%{transform:rotate(-2deg)}50%{transform:rotate(2deg) translateY(-1%)}}
@keyframes mx-step{from{transform:translateY(0) rotate(-2deg)}to{transform:translateY(-4%) rotate(2deg)}}
@keyframes mx-peek{0%{transform:translateY(40%)}40%{transform:translateY(-6%)}55%{transform:translateY(0) rotate(-3deg)}70%{transform:rotate(3deg)}85%{transform:rotate(-2deg)}100%{transform:none}}
@keyframes mx-breathe{0%,100%{transform:scale(1,1)}50%{transform:scale(1.015,.985)}}
@keyframes mx-rise{0%{transform:scaleY(0) scaleX(.4);opacity:0}60%{opacity:1}100%{transform:none;opacity:1}}
@keyframes mx-loom{0%,100%{transform:scale(1)}50%{transform:scale(1.025,1.04)}}
@keyframes mx-ring{from{transform:scale(.5);opacity:1}to{transform:scale(1.4);opacity:0}}
@keyframes mx-grow{from{transform:scale(.15);opacity:0}to{transform:none;opacity:1}}
@keyframes mx-glow{0%,100%{filter:none}50%{filter:drop-shadow(0 0 2cqw #ffd76a) drop-shadow(0 0 1cqw #fff)}}
@keyframes mx-arrive{from{transform:translateX(-8cqw) translateY(-2cqw);opacity:0}to{transform:none;opacity:1}}
@keyframes mx-iris{from{scale:9;opacity:0}to{scale:1;opacity:1}}
@keyframes mx-hero-in{0%{transform:scale(0);opacity:0}100%{transform:scale(2.2);opacity:1}}
@keyframes mx-twitch{0%,80%,100%{transform:none}84%{transform:rotate(-4deg)}88%{transform:rotate(3deg)}92%{transform:rotate(-2deg)}}
@keyframes mx-note-in{from{transform:scale(.6);opacity:0}to{transform:none;opacity:1}}
@keyframes mx-stamp{from{scale:2.2;opacity:0}to{scale:1;opacity:1}}
@keyframes mx-badge{from{transform:scale(.2) rotate(-200deg);opacity:0}to{transform:none;opacity:1}}

/* Reduce motion: same scenes and shadow sizes, no movement. The revealed mouse is still shown larger. */
:root[data-reduced="true"] .mx-card *{animation:none!important;transition:none!important}
:root[data-reduced="true"] .mx-firefly{display:none}
:root[data-reduced="true"] .mx-hero{transform:scale(2.2)}
:root[data-reduced="true"] .mx-phase-shadow.risen .mx-mystery{transform:none;opacity:1}
@media (prefers-reduced-motion:reduce){.mx-firefly{display:none}.mx-hero{transform:scale(2.2)}.mx-phase-shadow.risen .mx-mystery{transform:none;opacity:1}}