:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}*{box-sizing:border-box;margin:0;padding:0}html,body{background:#06070a;width:100%;height:100%;font-family:Trebuchet MS,Segoe UI,system-ui,sans-serif;overflow:hidden}#app{width:100vw;height:100vh;position:relative}canvas{touch-action:none;display:block}.flash{pointer-events:none;z-index:28;opacity:0;background:radial-gradient(circle,#c4153000 25%,#960a1e99 100%);position:absolute;inset:0}.flash.is-hit{animation:.45s ease-out escalera-flash}@keyframes escalera-flash{0%{opacity:0}10%{opacity:1}to{opacity:0}}.blood{pointer-events:none;z-index:26;opacity:0;background-position:50%;background-size:cover;transition:opacity .18s ease-out;position:absolute;inset:0}.blood.is-shown{opacity:.92}.blood__drip{background:linear-gradient(#56040bf2,#3a0208bf);border-radius:0 0 60% 60%;height:0;animation-name:blood-run;animation-timing-function:cubic-bezier(.3,0,.6,1);animation-fill-mode:forwards;position:absolute;top:0}@keyframes blood-run{0%{height:0}to{height:var(--run,30vh)}}.hud{pointer-events:none;z-index:10;flex-direction:column;align-items:flex-end;padding-right:30px;display:flex;position:absolute;inset:0}.hud__score{letter-spacing:2px;color:#f0ead8;text-shadow:0 0 20px #ff7a2a47,0 4px 14px #000000d9;margin-top:18px;font-size:68px;font-weight:800;transition:transform .1s ease-out}.hud__best{letter-spacing:4px;color:#c9a24a;text-shadow:0 2px 6px #000000d9;opacity:.85;margin-top:2px;font-size:13px;font-weight:700}.hud__combo{letter-spacing:3px;color:#ff7a2a;text-shadow:0 2px 10px #000000d9;min-height:24px;margin-top:8px;font-size:20px;font-weight:800}.overlay{text-align:center;pointer-events:auto;z-index:20;background:radial-gradient(circle,#06070a66 0%,#040508eb 92%);flex-direction:column;justify-content:center;align-items:center;gap:14px;padding:24px;transition:opacity .3s;display:flex;position:absolute;inset:0}.overlay.hidden{display:none}.overlay__title{letter-spacing:6px;color:#f0ead8;text-shadow:0 0 26px #ff7a2a59,3px 4px #c415308c,0 8px 26px #000000e6;font-size:60px;font-weight:800}.overlay__subtitle{letter-spacing:3px;color:#d8d2c2;text-shadow:0 2px 6px #000000d9;font-size:15px;font-weight:700}.overlay__score{letter-spacing:2px;color:#ff7a2a;text-shadow:0 2px 8px #000000d9;font-size:22px;font-weight:800}.overlay__hint{letter-spacing:1px;color:#8d94a2;text-shadow:0 2px 6px #000000d9;max-width:460px;margin-top:6px;font-size:13px;line-height:1.55}.countdown{pointer-events:none;z-index:25;letter-spacing:6px;color:#f0ead8;text-shadow:0 0 30px #ff7a2a73,0 8px 34px #000c;opacity:0;justify-content:center;align-items:center;font-size:170px;font-weight:800;display:flex;position:absolute;inset:0}.countdown.is-shown{animation:.75s ease-out countdown-pop}@keyframes countdown-pop{0%{opacity:0;transform:scale(.4)}20%{opacity:1;transform:scale(1.15)}40%{transform:scale(1)}80%{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(1.4)}}.touch-pad{z-index:22;pointer-events:auto;grid-template-rows:repeat(3,60px);grid-template-columns:repeat(3,60px);gap:6px;display:none;position:absolute;bottom:22px;right:18px}.touch-btn{color:#f0ead8;-webkit-backdrop-filter:blur(6px);touch-action:none;background:#120e0c99;border:2px solid #ff7a2a73;border-radius:14px;width:60px;height:60px;font-family:inherit;font-size:22px;font-weight:800}.touch-btn:active{background:#ff7a2a73;border-color:#f0ead8}.touch-btn--left{grid-area:2/1}.touch-btn--up{grid-area:1/2}.touch-btn--down{grid-area:3/2}.touch-btn--right{grid-area:2/3}@media (hover:none),(pointer:coarse){.touch-pad{display:grid}.hud__score{font-size:52px}.overlay__title{letter-spacing:4px;font-size:40px}}
