@font-face{font-family:Fredoka;font-style:normal;font-weight:400 700;font-display:swap;src:url(../fonts/fredoka-latin.woff2)format("woff2")}:root{--panel-bg:#0e1015c7;--panel-border:#ffffff14;--text:#e6e2da;--muted:#9aa0ab;--accent:#e0484f;font-family:Segoe UI,system-ui,-apple-system,sans-serif}*{box-sizing:border-box}html,body{height:100%;color:var(--text);-webkit-touch-callout:none;background:#15181e;margin:0;overflow:hidden}img,canvas{-webkit-user-drag:none;-webkit-touch-callout:none;-webkit-user-select:none;user-select:none}#app{position:fixed;inset:0}canvas{outline:none;display:block}.hud{pointer-events:none;-webkit-user-select:none;user-select:none;--hud-u:clamp(.15px, .0165vw, .32px);--hud-margin:clamp(14px, 2vw, 32px);position:absolute;inset:0}.hud.hidden{display:none}.hud{transition:opacity .5s ease-out}.hud.concealed{opacity:0;transition-duration:.2s}.hud-cluster{bottom:var(--hud-margin);filter:drop-shadow(0 3px 4px #00000059);position:absolute}.hud-move{left:var(--hud-margin)}.hud-actions{right:var(--hud-margin)}.hud-part{transition:translate .16s cubic-bezier(.3,1.5,.5,1),scale .16s cubic-bezier(.3,1.5,.5,1),filter .16s ease-out,opacity .16s ease-out;display:block;position:absolute}.hud-key{transform-origin:50% 100%}.hud-group.down>.hud-key{filter:brightness(1.12)drop-shadow(0 0 .3em #ffbe46f2);transition-duration:60ms;translate:0 4%;scale:.97 .93}.hud-rays{opacity:.6}.hud-group.down>.hud-rays{opacity:1;filter:brightness(1.3)drop-shadow(0 0 .2em #ffd65c);transition-duration:60ms}.hud-group.hit>.hud-rays{animation:.32s ease-out hud-burst}@keyframes hud-burst{0%{opacity:.5;scale:.85}40%{opacity:1;scale:1.45}to{scale:1}}.hud-group.down>.hud-arrow{translate:var(--dx) var(--dy);filter:brightness(1.2)drop-shadow(0 0 .3em #ffc850f2);transition-duration:90ms;animation:.38s ease-in-out infinite alternate hud-pulse}@keyframes hud-pulse{0%{scale:1}to{scale:1.12}}.hud-group.down>.hud-run{filter:brightness(1.12)drop-shadow(0 0 .3em #ffd764e6);animation:.24s ease-in-out infinite alternate hud-run}@keyframes hud-run{0%{translate:4%;rotate:0deg}to{translate:9% -7%;rotate:-4deg}}.hud-group.hit>.hud-fire{animation:.56s cubic-bezier(.2,.7,.3,1) hud-cast}@keyframes hud-cast{0%{filter:none;scale:1}20%{filter:brightness(1.3);translate:0 4%;scale:.82}45%{filter:brightness(1.7)drop-shadow(0 0 .5em #ff8a2a);translate:-4% -6%;scale:1.35}70%{filter:brightness(1.25)drop-shadow(0 0 .3em #ff8a2a);translate:0;scale:1.08}to{filter:none;scale:1}}.hud-group.hit>.hud-slide{animation:.48s cubic-bezier(.2,.8,.3,1) hud-slide}@keyframes hud-slide{0%{translate:0}35%{filter:brightness(1.3)drop-shadow(0 0 .4em #7fe3ff);translate:18% 3%}to{translate:0}}.hud-group.down>.hud-slide{filter:brightness(1.15)drop-shadow(0 0 .3em #7fe3ff)}.hud-mouse.zoom-in>.hud-zoom-in,.hud-mouse.zoom-out>.hud-zoom-out{filter:brightness(1.2)drop-shadow(0 0 .35em #ffc850f2);transition-duration:60ms;scale:1.25}.hud-mouse.zoom-in>.hud-spin-in{--turn:40deg;animation:.24s ease-out infinite hud-tick}.hud-mouse.zoom-out>.hud-spin-out{--turn:-40deg;animation:.24s ease-out infinite hud-tick}@keyframes hud-tick{0%{rotate:0deg}to{rotate:var(--turn)}}.hud-mouse.zoom-in>.hud-key,.hud-mouse.zoom-out>.hud-key{filter:brightness(1.08)drop-shadow(0 0 .3em #ffbe46cc);transition-duration:60ms;scale:.98}.hud-mouse.zoom-in>.hud-rays,.hud-mouse.zoom-out>.hud-rays{opacity:1;filter:brightness(1.3)drop-shadow(0 0 .2em #ffd65c);scale:1.2}.hud-status{background:var(--panel-bg);border:1px solid var(--panel-border);font-variant-numeric:tabular-nums;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);border-radius:8px;padding:8px 12px;font-size:12px;line-height:1.5;position:absolute;top:12px;left:12px}.hud-status[hidden]{display:none}.hud-status small{color:var(--muted)}@media (prefers-reduced-motion:reduce){.hud-part{transition-duration:0s!important;animation:none!important}}.loading{color:var(--muted);place-items:center;font-size:14px;display:grid;position:absolute;inset:0}.loading.error{color:var(--accent)}.desktop-only{color:#5a2912;background:radial-gradient(at 50% 40%,#0a465040,#041e28bf),url(../level/water.webp) 50%/420px,#0d5563;place-items:center;padding:20px 32px;font-family:Fredoka,Segoe UI,system-ui,sans-serif;display:grid;position:fixed;inset:0}.dialog{width:min(100%, calc((100svh - 48px) * var(--panel-ratio)), 440px);aspect-ratio:var(--panel-aspect);filter:drop-shadow(0 10px 18px #00000073);animation:.42s cubic-bezier(.3,1.5,.5,1) both dialog-in;position:relative;container-type:inline-size}@keyframes dialog-in{0%{opacity:0;scale:.8}to{opacity:1;scale:1}}.dialog-panel{pointer-events:none;width:100%;height:100%;position:absolute;inset:0}.dialog-content{text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:4cqw;padding:5cqw 4cqw;display:flex;position:absolute}.dialog h1{margin:0;font-size:9.5cqw;font-weight:700;line-height:1.05}.dialog p{margin:0;font-size:5.6cqw;font-weight:500;line-height:1.3}.dialog p b{font-weight:700}.dialog .dialog-hint{color:#8a4a1e;font-size:5cqw;font-weight:600}.dialog-keys{flex-direction:column;align-items:center;gap:.6cqw;display:flex}.dialog-keys>div{align-items:flex-end;gap:1cqw;display:flex}.dialog-keys img{height:auto;display:block}.dialog-close{cursor:pointer;-webkit-tap-highlight-color:transparent;background:0 0;border:0;width:17cqw;padding:0;transition:translate 60ms ease-out,scale 60ms ease-out,filter 60ms ease-out;position:absolute;top:-4cqw;right:-5cqw}.dialog-close img{width:100%;height:auto;display:block}.dialog-close:active{filter:brightness(1.12)drop-shadow(0 0 .3em #ffbe46f2);translate:0 4%;scale:.94}.dialog-close:focus-visible{outline-offset:4px;border-radius:12px;outline:3px solid #ffd65c}@media (prefers-reduced-motion:reduce){.dialog{animation:none}}.welcome{z-index:10;cursor:pointer;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;background:linear-gradient(#0000 38%,#06101a4d 68%,#06101a99 100%);font-family:Fredoka,Segoe UI,system-ui,sans-serif;animation:.45s ease-out both welcome-fade;position:fixed;inset:0}@keyframes welcome-fade{0%{opacity:0}}.welcome-stage{width:min(100vw - 32px,1280px,130svh);position:absolute;bottom:clamp(8px,2.5svh,28px);left:50%;translate:-50%;container-type:inline-size}.welcome-figure{transform-origin:50% 100%;filter:drop-shadow(0 6px 14px #00000059);height:min(66svh,56cqw);animation:.65s cubic-bezier(.2,.9,.3,1.1) .12s both welcome-figure-in;position:absolute;bottom:13cqw;left:0}@keyframes welcome-figure-in{0%{opacity:0;translate:-12%}}.welcome-figure.talk{animation:.38s cubic-bezier(.3,1.6,.5,1) welcome-talk}@keyframes welcome-talk{0%{translate:0}35%{translate:0 -1.6%}to{translate:0}}.welcome-portraits{transform-origin:50% 100%;animation:3.4s ease-in-out infinite alternate welcome-breathe;position:absolute;inset:0}@keyframes welcome-breathe{to{scale:1.004 1.008}}.welcome-portraits img{opacity:0;width:100%;height:100%;transition:opacity .26s ease-out;position:absolute;inset:0}.welcome-portraits img.active{opacity:1}.welcome-box{color:#5a2912;animation:.55s cubic-bezier(.25,1.35,.5,1) both welcome-box-in;position:relative;container-type:inline-size}@keyframes welcome-box-in{0%{opacity:0;translate:0 35%}}.welcome-box-art{filter:drop-shadow(0 8px 16px #0006);width:100%;height:100%;position:absolute;inset:0}.welcome-name{letter-spacing:.02em;color:#8a2a17;place-items:center;font-size:2.5cqw;font-weight:700;display:grid;position:absolute}.welcome-text{overflow-wrap:break-word;padding:1.5cqw 2.2cqw 1cqw 2.4cqw;font-size:2.15cqw;font-weight:500;line-height:1.32;position:absolute}.welcome-text b{color:#8a2a17;font-weight:700}.welcome-char{opacity:0;transition:opacity 90ms linear}.welcome-char.on{opacity:1}.welcome-hint{color:#8a4a1e}.welcome-spoken{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;margin:-1px;position:absolute;overflow:hidden}.welcome-next{opacity:0;transition:opacity .16s ease-out;position:absolute}.welcome.ready .welcome-next{opacity:1;animation:.9s ease-in-out infinite welcome-next}@keyframes welcome-next{0%,to{translate:0}50%{filter:brightness(1.12)drop-shadow(0 0 .4cqw #ffb43ccc);translate:18%}}.welcome.leaving{pointer-events:none;animation:.6s ease-in reverse both welcome-fade}.welcome.leaving .welcome-box{animation:.55s ease-in both welcome-box-out}.welcome.leaving .welcome-figure{animation:.5s ease-in both welcome-figure-out}@keyframes welcome-box-out{to{opacity:0;translate:0 35%}}@keyframes welcome-figure-out{to{opacity:0;translate:-12%}}@media (prefers-reduced-motion:reduce){.welcome,.welcome *,.welcome.leaving,.welcome.leaving *{transition:none!important;animation:none!important}}