:root{color-scheme:dark;font-family:Segoe UI,system-ui,sans-serif}*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:#0b0714;touch-action:none;-webkit-user-select:none;user-select:none}#game{width:100%;height:100%}#game canvas{display:block}#rotate-overlay{position:fixed;inset:0;z-index:40;display:grid;place-items:center;background:#0b0714;color:#f4efe6;font-size:1.4rem;text-align:center;padding:2rem}#rotate-overlay[hidden]{display:none}.ui-panel{position:fixed;left:50%;bottom:max(4%,env(safe-area-inset-bottom,0px));transform:translate(-50%);z-index:20;display:flex;flex-direction:column;align-items:center;gap:.45rem;max-width:min(92vw,36rem);max-height:46vh;overflow:auto;padding:.25rem .5rem}.ui-panel[hidden]{display:none}.ui-panel button{font-size:1.25rem;padding:.7rem 2.2rem;border:3px solid #d4b24a;background:#2a4d9e;color:#fff;border-radius:8px;cursor:pointer}.ui-panel p{margin:0;color:#f4efe6;font-size:1.5rem;text-shadow:0 2px 0 #000}#touch-controls{position:fixed;inset:0;z-index:15;pointer-events:none}#touch-controls[hidden]{display:none}#stick-zone{position:absolute;left:0;top:0;width:46%;height:100%;pointer-events:auto}#stick-nub{position:absolute;width:88px;height:88px;margin-left:-44px;margin-top:-44px;border-radius:50%;border:3px solid #f4efe6;background:#f4efe62e;opacity:.55;pointer-events:none}#btn-cluster{position:absolute;right:4%;bottom:10%;width:210px;height:210px;pointer-events:auto;opacity:.55}.touch-btn{position:absolute;width:72px;height:72px;border-radius:50%;border:2px solid #f4efe6;background:#141020b3;color:#f4efe6;font-size:.78rem;font-weight:700;pointer-events:auto}.touch-btn:active{background:#d4b24a8c}.pos-up{left:69px;top:0}.pos-right{left:138px;top:69px}.pos-down{left:69px;top:138px}.pos-left{left:0;top:69px}.ui-panel .ui-note{max-width:22rem;margin:0;font-size:.9rem;line-height:1.25;color:#c8c0b4;text-align:center;text-shadow:0 1px 0 #000}.ui-mode{gap:.55rem}.ui-mode .ui-note{margin-top:.15rem}.ui-mode button{font-size:1.05rem;padding:.55rem 1.6rem;width:min(100%,22rem)}.ui-panel button.ui-secondary{font-size:.9rem;padding:.4rem 1.2rem;background:#1e1630;border-color:#7a735f;color:#c8c0b4}@media(pointer:coarse)and (orientation:landscape)and (max-height:450px){.ui-panel{bottom:max(2%,env(safe-area-inset-bottom,0px));gap:.3rem;max-height:52vh}.ui-mode button{font-size:.95rem;padding:.45rem 1.2rem}.ui-panel .ui-note{font-size:.8rem;max-width:20rem}.ui-panel p{font-size:1.15rem}.select-side img{width:36px;height:36px}.select-side button{width:5.4rem;font-size:.72rem;padding:.12rem .2rem .2rem}.ui-select{bottom:2%;max-height:70vh}}.ui-panel button.is-selected,.ui-panel button:focus-visible{background:#d4b24a;color:#1a0a08}.ui-panel button:disabled{opacity:.45;cursor:not-allowed;border-color:#7a735f;background:#2a2430}.ui-select{bottom:8%}.select-cols{display:flex;gap:1.2rem}.select-side{display:grid;grid-template-columns:1fr 1fr;gap:.35rem;align-items:stretch}.select-side p{grid-column:1 / -1;font-size:1rem;text-align:center}.select-side button{min-width:0;width:6.6rem;font-size:.85rem;padding:.2rem .3rem .35rem;display:flex;flex-direction:column;align-items:center;gap:.1rem;overflow:hidden}.select-side img{width:58px;height:58px;object-fit:contain;image-rendering:pixelated;background:#140818;pointer-events:none}.select-side button.is-selected{background:#d4b24a;color:#1a0a08}#audio-controls{position:fixed;top:12px;right:16px;z-index:28;display:flex;align-items:center;gap:.6rem;pointer-events:auto}#audio-controls button{font-size:.85rem;padding:.35rem .8rem;border:2px solid #d4b24a;background:#2a4d9e;color:#fff;border-radius:6px;cursor:pointer}#audio-controls button[aria-pressed=true]{background:#5a3a3a;border-color:#c08080}#audio-controls .vol-label{display:flex;align-items:center;gap:.35rem;color:#f4efe6;font-size:.8rem;text-shadow:0 1px 0 #000}#audio-controls input[type=range]{width:88px}
