*{box-sizing:border-box}body{margin:0;background:#11151a;color:#e0e0e0;font-family:system-ui,sans-serif}#app{display:flex;flex-direction:column;height:100vh;height:100dvh;position:relative;touch-action:manipulation}#controls{display:flex;gap:8px;align-items:center;padding:8px;background:#1b2129;flex-wrap:wrap;position:relative;z-index:50}#controls button{padding:5px 12px;border-radius:6px;border:1px solid #3a4250;background:#252d38;color:#e0e0e0;cursor:pointer;font-size:13px;transition:background .15s}#controls button:hover{background:#323d4d}#controls button.active{background:#7c3aed;border-color:#9f67ff;color:#fff}#controls select{padding:5px 8px;border-radius:6px;border:1px solid #3a4250;background:#252d38;color:#e0e0e0;font-size:13px}#speed-label{font-size:12px;color:#aaa;display:flex;align-items:center;gap:4px}#status{margin-left:auto;font-variant-numeric:tabular-nums;font-size:13px;color:#7aecb4;white-space:nowrap}#message{color:#ff8a65;padding:0 8px;min-height:1.2em;font-size:13px;position:relative;z-index:50}#playfield{flex:1;min-height:0;display:flex;align-items:center;justify-content:center;background:#000;overflow:hidden}#stage{position:relative;height:100%;aspect-ratio:9 / 16;max-width:100%;overflow:hidden;container-type:size;box-shadow:0 0 40px #0009;background:#11151a}@media (max-aspect-ratio: 9 / 16){#stage{height:auto;width:100%;max-height:100%}}canvas{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;display:block;z-index:10}#state-overlay{position:absolute;z-index:50;bottom:40px;left:50%;transform:translate(-50%);font-size:28px;font-weight:700;letter-spacing:2px;text-transform:uppercase;color:#fff;text-shadow:0 0 12px #9f67ff,0 2px 4px rgba(0,0,0,.8);pointer-events:none;opacity:0}#state-overlay.fade{animation:state-flash .9s ease-out forwards}@keyframes state-flash{0%{opacity:1;transform:translate(-50%) scale(1.2)}30%{opacity:1;transform:translate(-50%) scale(1)}to{opacity:0;transform:translate(-50%) scale(.95)}}.vl-bg{position:absolute;top:0;right:0;bottom:0;left:0;z-index:1;background-size:cover;background-position:center bottom;pointer-events:none}.amb-kenburns{animation:kenburns 30s ease-in-out infinite alternate}@keyframes kenburns{0%{transform:scale(1) translate(0)}to{transform:scale(1.15) translate(-2%,-2%)}}.amb-bokeh:after,.amb-light_rays:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:radial-gradient(circle at 30% 30%,rgba(255,255,255,.15),transparent 40%);animation:drift 14s linear infinite}@keyframes drift{0%{transform:translate(0)}to{transform:translate(6%,4%)}}.fx-pulse_glow{animation:pulseGlow .25s ease-out}@keyframes pulseGlow{0%{filter:brightness(1.4) drop-shadow(0 0 12px var(--beat-color))}to{filter:none}}.fx-zoom_beat{animation:zoomBeat .2s ease-out}@keyframes zoomBeat{50%{transform:scale(1.03)}}.fx-flash{animation:flash .15s ease-out}@keyframes flash{0%{filter:brightness(2.2)}to{filter:none}}.fx-tilt_shake{animation:tilt .15s ease-out}@keyframes tilt{25%{transform:rotate(.4deg)}75%{transform:rotate(-.4deg)}}.vl-objects{position:absolute;top:0;right:0;bottom:0;left:0;z-index:40;pointer-events:none;overflow:hidden}.vl-obj{position:absolute;top:-10%;background-size:contain;background-repeat:no-repeat;will-change:transform,opacity}.anim-fall{animation:objFall linear forwards}@keyframes objFall{0%{transform:translateY(0) rotate(0)}to{transform:translateY(120vh) rotate(40deg);opacity:.2}}.anim-rise{top:auto;bottom:-10%;animation:objRise ease-out forwards}@keyframes objRise{0%{transform:translateY(0);opacity:1}to{transform:translateY(-110vh);opacity:0}}.anim-burst{top:50%;animation:objBurst ease-out forwards}@keyframes objBurst{0%{transform:scale(.2);opacity:1}to{transform:scale(1.6);opacity:0}}.anim-spin{top:40%;animation:objSpin linear forwards}@keyframes objSpin{to{transform:rotate(360deg);opacity:0}}.anim-pop{top:45%;animation:objPop ease-out forwards}@keyframes objPop{0%{transform:scale(0)}60%{transform:scale(1.2);opacity:1}to{transform:scale(1);opacity:0}}.anim-drift{top:30%;animation:objDrift linear forwards}@keyframes objDrift{0%{transform:translate(-10vw)}to{transform:translate(110vw);opacity:.2}}.anim-twinkle{top:35%;animation:objTwinkle ease-in-out forwards}@keyframes objTwinkle{0%,to{opacity:0;transform:scale(.6)}50%{opacity:1;transform:scale(1)}}.vl-companions{position:absolute;top:0;right:0;bottom:0;left:0;z-index:30;pointer-events:none}.vl-companion{position:absolute;bottom:var(--md-companion-bottom, 18%);width:calc(clamp(60px,26cqw,240px) * var(--md-companion-scale, 1));height:calc(clamp(80px,35cqw,320px) * var(--md-companion-scale, 1))}.vl-companion-inner{position:absolute;top:0;right:0;bottom:0;left:0;background-size:contain;background-repeat:no-repeat;background-position:bottom center}.vl-companion-idle{animation:companionIdle 2s ease-in-out infinite}@keyframes companionIdle{0%,to{transform:translateY(0) rotate(0)}50%{transform:translateY(-6%) rotate(1.2deg)}}.side-left{left:6%}.side-right{right:6%}.enter-slide_in_left{animation:slideInL .6s ease-out}.enter-slide_in_right{animation:slideInR .6s ease-out}.enter-drop_in{animation:dropIn .6s ease-out}.enter-bounce_in{animation:bounceIn .7s cubic-bezier(.2,1.4,.4,1)}@keyframes slideInL{0%{transform:translate(-140%)}to{transform:none}}@keyframes slideInR{0%{transform:translate(140%)}to{transform:none}}@keyframes dropIn{0%{transform:translateY(-140%)}to{transform:none}}@keyframes bounceIn{0%{transform:translateY(-120%) scale(.8)}to{transform:none}}.exit-slide_out{animation:slideOut .7s ease-in forwards}.exit-fade_out{animation:fadeOut .7s ease-in forwards}.exit-hop_out{animation:hopOut .7s ease-in forwards}@keyframes slideOut{to{transform:translate(140%)}}@keyframes fadeOut{to{opacity:0}}@keyframes hopOut{40%{transform:translateY(-20%)}to{transform:translateY(140%)}}@media (max-width: 600px){#controls{padding:6px;gap:6px}#folder{display:none}#controls button{padding:8px 12px;font-size:14px}#controls select{padding:7px 8px;font-size:14px}#status{margin-left:0;width:100%;order:99;text-align:right}}.vl-screenfx{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;overflow:hidden;z-index:5}.sfx{position:absolute;top:0;right:0;bottom:0;left:0}.sfx-flash{background:#fff;opacity:0;animation:sfx-flash .45s ease-out}@keyframes sfx-flash{0%{opacity:.7}to{opacity:0}}.sfx-bloom{background:radial-gradient(circle,rgba(255,245,200,.6),transparent 70%);opacity:0;animation:sfx-flash .8s ease-out}.sfx-zoom-punch{box-shadow:inset 0 0 0 100vmax #fff0;animation:sfx-zoom .5s ease-out}@keyframes sfx-zoom{0%{transform:scale(1.04)}to{transform:scale(1)}}.sfx-shockwave{border:3px solid rgba(255,255,255,.7);border-radius:50%;width:0;height:0;inset:auto;transform:translate(-50%,-50%);animation:sfx-ring .7s ease-out forwards}@keyframes sfx-ring{0%{width:0;height:0;opacity:.8}to{width:120vmax;height:120vmax;opacity:0}}