@font-face{font-family:Kumar One;src:url(../assets/fonts/KumarOne-Regular.ttf)format("truetype");font-display:block}:root{--menu-scale:1;--hud-scale:1;--safe-w:100vw;--safe-h:100vh;--safe-t:env(safe-area-inset-top,0px);--safe-r:env(safe-area-inset-right,0px);--safe-b:env(safe-area-inset-bottom,0px);--safe-l:env(safe-area-inset-left,0px);--pad-scale:1;--pad-margin:14px;--pad:calc(min(150px, calc(min(var(--safe-w), var(--safe-h)) * .36)) * var(--pad-scale));--act:calc(min(64px, calc(min(var(--safe-w), var(--safe-h)) * .155)) * var(--pad-scale));--hud-bar:calc(197.3px * var(--hud-scale));--text:#b9bece;--panel:#09191ff8}*{box-sizing:border-box}html,body{height:100%;color:var(--text);-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent;-webkit-text-size-adjust:100%;-moz-text-size-adjust:100%;text-size-adjust:100%;touch-action:none;overscroll-behavior:none;background:#000;margin:0;font-family:Kumar One,system-ui,sans-serif;overflow:hidden}#app{position:fixed;inset:0}#app canvas{width:100%;height:100%;display:block}#ui{pointer-events:none;position:fixed;inset:0}#ui>*{pointer-events:auto}.hidden{display:none!important}.stage-wrap{inset:var(--safe-t) var(--safe-r) var(--safe-b) var(--safe-l);pointer-events:none;justify-content:center;align-items:center;display:flex;position:absolute}.stage{width:1920px;height:1080px;transform:scale(var(--menu-scale));pointer-events:auto;flex:none;position:relative}.title{color:#ffde98;white-space:nowrap;font-size:125px;line-height:1.3;position:absolute;top:12px;left:200px}.title.center{text-align:center;color:#faffdb;left:0;right:0}.panel{background:var(--panel);border-radius:58px;flex-direction:column;gap:33px;width:1520px;height:680px;padding:42px;display:flex;position:absolute;top:200px;left:200px}.menu-btn{min-height:0;color:var(--text);font:inherit;cursor:pointer;background:#010c0648;border:0;border-radius:10px;outline:none;flex:1 1 0;font-size:69px;transition:background-color .1s,color .1s,box-shadow .1s}.menu-btn:focus-visible{color:#fff;background:#00000073;box-shadow:inset 0 0 0 4px #ffde988c}@media (hover:hover){.menu-btn:hover{color:#fff;background:#00000073;box-shadow:inset 0 0 0 4px #ffde988c}.bind select:hover{color:#fff;background:#37755d}.reset-btn:hover,.back-btn:hover{background:#00705a}.choice-btn:hover{color:#fff;background:#1d5446}}.menu-btn:active{background:#011c0e48}.menu-btn.fixed-height{flex:0 0 281.4px}.panel.fit{height:auto}.slot-btn{text-align:left;align-items:center;padding:0;display:flex}.slot-btn .num{width:246px;padding-left:40px;font-size:69px}.slot-btn .data{text-align:center;flex:1;padding-right:160px;font-size:33px}.panel .question{color:#fff;text-align:center;flex:none;padding:30px 0}.panel .question.big{font-size:78px}.panel .question.small{font-size:42px}.controls-grid{flex:1;grid-template-rows:repeat(5,1fr);grid-template-columns:repeat(2,1fr);grid-auto-flow:column;gap:25px 120px;padding:0 60px;display:grid}.bind{align-items:center;gap:30px;display:flex}.bind label{text-align:right;color:#e7e7e7;flex:0 0 280px;font-size:30px}.bind select{color:#c4c4c4;height:100px;font:inherit;text-align:center;text-align-last:center;cursor:pointer;appearance:none;background:#003128;border:0;border-radius:10px;outline:none;flex:1;font-size:33px}.bind select:focus-visible{color:#fff;background:#37755d}.bind select option{color:#fff;background:#468a95;font-family:system-ui,sans-serif;font-size:16px}.reset-btn,.back-btn{color:#e0e0e0;width:800px;height:100px;font:inherit;cursor:pointer;background:#004f40;border:0;border-radius:10px;outline:none;font-size:42px;position:absolute;top:929px;left:560px}.reset-btn:focus-visible,.back-btn:focus-visible{background:#00705a}.back-btn{width:320px;left:200px}[data-input=touch] .controls-grid,[data-input=desktop] .touch-settings{display:none}.touch-settings{flex-direction:column;flex:1;justify-content:center;gap:44px;padding:0 40px;display:flex}.setting{align-items:center;gap:40px;display:flex}.setting-label{text-align:right;color:#e7e7e7;flex:0 0 360px;font-size:40px}.choices{flex:1;gap:20px;display:flex}.choice-btn{color:#c4c4c4;height:130px;font:inherit;cursor:pointer;background:#003128;border:0;border-radius:10px;outline:none;flex:1;font-size:40px}.choice-btn:focus-visible{color:#fff;background:#1d5446}.choice-btn.on{color:#fff;background:#37755d;box-shadow:inset 0 0 0 4px #ffde988c}.touch-help{color:#b9bece;text-align:center;margin:0;font-size:34px;line-height:1.4}.start-hint{text-align:center;color:#ffde98;font-size:48px;animation:1.6s ease-in-out infinite pulse;position:absolute;bottom:140px;left:0;right:0}@keyframes pulse{50%{opacity:.35}}.load-error{text-align:center;color:#fff;flex-direction:column;gap:24px;width:min(90vw,720px);font-size:24px;display:flex;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.load-error .menu-btn{padding:16px;font-size:32px}.fatal{color:#ffde98;text-align:center;z-index:10;background:#000;place-items:center;padding:24px;font-size:22px;display:grid;position:fixed;inset:0}.loading{background:#000;position:absolute;inset:0}.loading .text{left:calc(100% - 1039px * var(--hud-scale));top:calc(100% - 265px * var(--hud-scale));font-size:calc(149px * var(--hud-scale));color:#fff;white-space:pre;line-height:1;position:absolute}.hud{pointer-events:none;position:absolute;inset:0}.hud-root{left:var(--safe-l);top:var(--safe-t);width:calc(var(--safe-w) / var(--hud-scale));height:calc(var(--safe-h) / var(--hud-scale));transform:scale(var(--hud-scale));transform-origin:0 0;position:absolute}.hud-bar{height:calc(var(--hud-bar) + var(--safe-b));background:#000d0b92;position:absolute;bottom:0;left:0;right:0}.slot-panel{pointer-events:auto;justify-content:center;height:180px;display:flex;position:absolute;bottom:0;left:29.5px;right:29.5px}.slot-panel-bg{opacity:.609;background:url(../assets/ui/slot-panel-bg.jpg) 50%/100% 100%;position:absolute;inset:0}.slot-panel-bg:after{content:"";mix-blend-mode:multiply;background:#ff95c1;position:absolute;inset:0}.slots{gap:.2px;width:calc(100% - 1000px);min-width:760px;display:flex;position:relative}.slot{cursor:pointer;flex:1;height:180px;position:relative}.slot .frame,.slot .tint{border:35.5px solid #0000;border-width:32px 35.5px 37.9px;border-image:url(../assets/ui/slot-frame.png) 82 91 97 fill/32px 35.5px 37.9px;position:absolute;inset:0}.slot .tint{background:var(--tint,#0052ff);mix-blend-mode:multiply;border:0;-webkit-mask:url(../assets/ui/slot-frame.png) 50%/100% 100%;mask:url(../assets/ui/slot-frame.png) 50%/100% 100%}.slot .icon{background:50%/contain no-repeat;width:100px;height:100px;margin:-50px 0 0 -50px;position:absolute;top:50%;left:50%}.health{width:200px;height:200px;position:absolute;top:50px;right:50px}.health div{background:50%/contain no-repeat;position:absolute;inset:0}.health .bg{background-image:url(../assets/ui/health-bg.png)}.health .fg{background-image:url(../assets/ui/health-fg.png)}.hud{z-index:2}.loading,.pause-dim{z-index:10}.touch-controls{pointer-events:none;position:absolute;inset:0}.touch-pad{left:calc(var(--safe-l) + var(--pad-margin));bottom:calc(var(--safe-b) + var(--pad-margin));width:var(--pad);height:var(--pad);z-index:3;pointer-events:auto;touch-action:none;opacity:.8;background:radial-gradient(circle,#09191f40 0 56%,#09191f99 58% 100%);border:2px solid #b9bece59;border-radius:50%;transition:opacity .15s;position:absolute}.touch-pad:before{content:"";border-radius:50%;position:absolute;inset:-28%}.touch-pad.held{opacity:1}[data-pad-side=right] .touch-pad{left:auto;right:calc(var(--safe-r) + var(--pad-margin))}.pad-knob{pointer-events:none;background:#b9bece38;border:2px solid #ffde9873;border-radius:50%;width:42%;height:42%;margin:-21% 0 0 -21%;position:absolute;top:50%;left:50%}.touch-pad.moving .pad-knob{background:#ffde9859;border-color:#ffde98}.action-pad{right:calc(var(--safe-r) + var(--pad-margin));bottom:calc(var(--safe-b) + var(--pad-margin));width:calc(var(--act) * 2.9);height:calc(var(--act) * 2.9);z-index:3;pointer-events:none;position:absolute}[data-pad-side=right] .action-pad{right:auto;left:calc(var(--safe-l) + var(--pad-margin))}.action-btn{width:var(--act);height:var(--act);border:3px solid var(--tint,#0052ff);pointer-events:auto;touch-action:none;cursor:pointer;background:#09191fb8;border-radius:50%;padding:0;transition:transform 80ms,opacity .1s,background-color .1s;position:absolute;box-shadow:0 0 12px #00000059}.action-btn:before{content:"";border-radius:50%;position:absolute;inset:-12%}.action-top{left:calc(50% - var(--act) / 2);top:0}.action-bottom{left:calc(50% - var(--act) / 2);bottom:0}.action-left{top:calc(50% - var(--act) / 2);left:0}.action-right{top:calc(50% - var(--act) / 2);right:0}.action-icon{pointer-events:none;background:50%/contain no-repeat;position:absolute;inset:20%}.action-btn.engaged{background:#37755dd9}.action-btn.held{transform:scale(1.1)}.action-btn.cooling{background:#09191f8c}[data-input=touch] .hud-bar,[data-input=touch] .slot-panel{display:none}.touch-buttons{left:calc(var(--safe-l) + 12px);top:calc(var(--safe-t) + 12px);z-index:3;pointer-events:auto;gap:12px;display:flex;position:absolute}.touch-btn{color:#ffde98;cursor:pointer;touch-action:none;background:#09191f9e;border:2px solid #b9bece59;border-radius:50%;width:48px;height:48px;padding:11px}.touch-btn svg{fill:currentColor;width:100%;height:100%;display:block}.touch-btn:active{background:#37755dd9}[data-orient=portrait] .stage{width:1080px;height:1920px}[data-orient=portrait] .title{text-align:center;white-space:normal;font-size:120px;line-height:1.15;top:110px;left:40px;right:40px}[data-orient=portrait] .panel{width:960px;height:1000px;top:560px;left:60px}[data-orient=portrait] .panel.fit{height:auto}[data-orient=portrait] .back-btn{width:300px;height:120px;top:1620px;left:60px}[data-orient=portrait] .reset-btn{width:620px;height:120px;top:1620px;left:400px}[data-orient=portrait] .start-hint{font-size:64px;bottom:380px}[data-orient=portrait] .slot-btn .num{width:170px;padding-left:30px}[data-orient=portrait] .slot-btn .data{padding-right:30px}[data-orient=portrait] .controls-grid{grid-template-rows:repeat(10,1fr);grid-template-columns:1fr;gap:14px;padding:0 10px}[data-orient=portrait] .bind select{height:72px}[data-orient=portrait] .touch-settings{gap:60px;padding:0}[data-orient=portrait] .setting{flex-direction:column;align-items:stretch;gap:20px}[data-orient=portrait] .setting-label{text-align:center;flex:none}[data-orient=portrait] .slots{width:calc(100% - 60px);min-width:0}[data-orient=portrait] .slot-btn .data{font-size:40px}[data-orient=portrait] .touch-help{font-size:38px}[data-orient=portrait] .loading .text{left:calc(var(--safe-l) + 7%);top:calc(100% - 330px * var(--hud-scale));font-size:calc(120px * var(--hud-scale))}.mute-btn{left:calc(var(--safe-l) + 12px);top:calc(var(--safe-t) + 12px);z-index:20;color:#ffde98;cursor:pointer;background:#09191f9e;border:2px solid #b9bece59;border-radius:50%;outline:none;width:44px;height:44px;padding:10px;position:absolute}.mute-btn svg{fill:currentColor;width:100%;height:100%;display:block}.mute-btn.muted{color:#b9bece}.mute-btn:focus-visible{box-shadow:0 0 0 3px #ffde988c}@media (hover:hover){.mute-btn:hover{background:#0009}}[data-input=touch] .mute-btn{width:48px;height:48px;padding:11px}[data-input=touch] .touch-buttons{left:calc(var(--safe-l) + 12px + 60px)}.pause-dim{background:#00000073;position:absolute;inset:0}@media (prefers-reduced-motion:reduce){.start-hint{animation:none}}
