/* The stage remains decorative; the front-door controller owns all input. */
#front-scene{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:1;isolation:isolate}
.front-scene-stage{position:absolute;inset:0;perspective:1200px;--front-ace-width:clamp(110px,min(13.5vw,27vh),224px)}
.front-scene-light,.front-scene-chips{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;transition:opacity 1.3s ease;opacity:1}
.front-scene-light{z-index:2}
.front-scene-chips{z-index:3;perspective:900px}
.front-scene-chip{position:absolute;left:0;top:0;aspect-ratio:1;transform-origin:center;will-change:transform;opacity:.54;filter:drop-shadow(3px 10px 7px #0006);--chip-depth:7px;--chip-apothem:31px;--chip-facet-width:9px}
.front-scene-chip[data-depth=near]{opacity:.84;filter:drop-shadow(4px 18px 11px #0007)}
.front-scene-chip svg{display:block;width:100%;height:100%}
.front-chip-solid{position:absolute;inset:0;transform-style:preserve-3d;will-change:transform}
.front-chip-face{position:absolute;inset:0;backface-visibility:hidden;transform:translateZ(calc(var(--chip-depth) / 2))}
.front-chip-back{transform:translateZ(calc(var(--chip-depth) / -2)) rotateY(180deg)}
.front-chip-edge{position:absolute;left:50%;top:50%;width:var(--chip-facet-width);height:var(--chip-depth);box-sizing:border-box;backface-visibility:hidden;transform:translate(-50%,-50%) rotateZ(var(--edge-angle)) translateY(calc(var(--chip-apothem) * -1)) rotateX(90deg);background:linear-gradient(#fff3 0%,#fff0 24%,#0000 64%,#0007 100%),linear-gradient(rgb(0 0 0 / var(--edge-shade)),rgb(0 0 0 / var(--edge-shade))),var(--chip-edge-color);border-top:1px solid #eadbbb66;border-bottom:1px solid #080f14a8}
.front-chip-inlay{--chip-edge-color:#d4c7a8!important;border-top-color:#fff0ca9c}
.front-scene-halo{position:absolute;left:50%;top:51%;width:min(77vw,1120px);height:min(61vh,600px);transform:translate(-50%,-50%);background:radial-gradient(ellipse at 37% 56%,#cdac6420,transparent 54%),radial-gradient(ellipse at 72% 48%,#428e8a20,transparent 58%);filter:blur(15px);opacity:.75;transition:opacity 1.4s;animation:front-breath 8s ease-in-out infinite alternate;z-index:1}
.front-scene-table-glow{position:absolute;left:50%;bottom:-28%;width:120%;height:58%;transform:translateX(-50%);border-radius:50%;background:radial-gradient(ellipse,#426f6333,transparent 68%);opacity:.3;transition:opacity 1.4s;z-index:0}
.front-ace-fan{position:absolute;inset:0;z-index:4;transform:translate3d(var(--fan-parallax-x,0px),var(--fan-parallax-y,0px),0);transition:opacity .5s,filter .7s;will-change:transform}
.front-ace{position:absolute;left:50%;top:51%;width:var(--front-ace-width);aspect-ratio:5/7;transform:translate(-50%,-50%) translateX(var(--fan-x)) translateY(var(--fan-y)) rotate(var(--fan-angle));transform-origin:50% 82%;transition:transform 1.2s cubic-bezier(.18,.77,.2,1.03),opacity .6s ease;will-change:transform;opacity:1;--fan-x:0px;--fan-y:0px;--fan-angle:0deg}
.front-ace[data-suit=spades]{--fan-x:calc(var(--front-ace-width) * -1.23);--fan-y:13px;--fan-angle:-14deg;z-index:4}
.front-ace[data-suit=hearts]{--fan-x:calc(var(--front-ace-width) * -.41);--fan-y:-12px;--fan-angle:-5deg;z-index:3}
.front-ace[data-suit=diamonds]{--fan-x:calc(var(--front-ace-width) * .41);--fan-y:-12px;--fan-angle:5deg;z-index:2}
.front-ace[data-suit=clubs]{--fan-x:calc(var(--front-ace-width) * 1.23);--fan-y:13px;--fan-angle:14deg;z-index:1}
.front-ace-paper{position:absolute;inset:0;border-radius:4.3%;filter:drop-shadow(0 24px 17px #0008);animation:front-card-float 6.8s ease-in-out infinite;animation-delay:calc(var(--ace-index) * -1.7s);will-change:transform}
.front-ace-paper::after{content:"";position:absolute;inset:0;border-radius:4.3%;box-shadow:inset 0 0 0 1px #fffae991,inset -2px -2px 2px #6c54323b;pointer-events:none}
.front-ace-paper svg{width:100%;height:100%;display:block;overflow:visible}
.front-scene-stage[data-scene-mode=gate] .front-ace{top:50%;width:clamp(130px,13.5vw,208px);transform:translate(-50%,-50%);transition-duration:0s}
.front-scene-stage[data-scene-mode=gate] .front-ace:not([data-suit=spades]){opacity:0;transform:translate(-50%,-50%) scale(.96)}
.front-scene-stage[data-scene-mode=gate] .front-ace[data-suit=spades] .front-ace-paper{animation:front-card-invitation 6s ease-in-out infinite;animation-delay:0s;filter:drop-shadow(0 19px 24px #0008)}
.front-scene-stage[data-scene-mode=gate] :is(.front-scene-light,.front-scene-chips,.front-scene-table-glow){opacity:0}
.front-scene-stage[data-scene-mode=gate] .front-scene-halo{animation:none;opacity:.22;width:450px;height:400px;background:radial-gradient(ellipse,#b9a16b24,transparent 68%)}
.front-scene-stage[data-scene-mode=flow] .front-ace-fan{opacity:0;filter:blur(6px)}
.front-scene-stage[data-scene-mode=flow] .front-ace{transform:translate(-50%,-50%) translateX(calc(var(--fan-x) * 1.6)) translateY(70px) rotate(var(--fan-angle)) scale(.85)}
.front-scene-stage[data-scene-mode=flow] .front-scene-chips{opacity:.3}
.front-scene-stage[data-scene-mode=flow] .front-scene-halo{animation:none;opacity:.2}
.front-scene-stage[data-scene-mode=hidden]{visibility:hidden}
.front-scene-stage.front-scene-paused *,.front-scene-stage[data-scene-mode=flow] .front-ace-paper{animation-play-state:paused!important}
.front-scene-stage.front-scene-reduced *{animation:none!important;transition:none!important}
@keyframes front-card-float{0%,100%{transform:translate3d(0,0,0) rotate(-.45deg)}50%{transform:translate3d(0,-12px,0) rotate(.7deg)}}
@keyframes front-card-invitation{0%,35%,72%,100%{transform:translateY(0) rotate(-1deg)}45%{transform:translateY(-7px) rotate(2deg)}49%{transform:translateY(-7px) rotate(-2.5deg)}54%{transform:translateY(-6px) rotate(1.5deg)}61%{transform:translateY(-4px) rotate(-.5deg)}}
@keyframes front-breath{from{opacity:.52;transform:translate(-50%,-50%) scale(.96)}to{opacity:.8;transform:translate(-50%,-50%) scale(1.06)}}
@media(max-width:650px){.front-scene-stage{--front-ace-width:clamp(77px,21vw,126px)}.front-ace[data-suit=spades]{--fan-x:calc(var(--front-ace-width) * -1.15)}.front-ace[data-suit=clubs]{--fan-x:calc(var(--front-ace-width) * 1.15)}.front-scene-chip[data-depth=near]{opacity:.58}}
@media(max-height:550px) and (min-width:651px){.front-scene-stage{--front-ace-width:24vh}.front-ace{top:52%}}
@media(prefers-reduced-motion:reduce){.front-scene-stage *{animation:none!important;transition:none!important}}
