html,body{height:100%;margin:0}#content_layer{position:fixed;inset:0;background:#111827}#ui_layer{--controller-control-size: 120px;--controller-zone-height: 173px;--controller-offset: 43px;--controller-action-gap: .625rem;--controller-label-gap: .25rem;--controller-label-size: .8rem;position:fixed;inset:min(5vw,5vh);pointer-events:none}#ui_root{height:100%}.screen-debug-viewport{position:fixed;z-index:2;inset:0;box-sizing:border-box;border:1px solid #4ade80;pointer-events:none}.screen-debug-ui-outline{position:absolute;z-index:2;inset:0;box-sizing:border-box;border:1px solid #22d3ee;pointer-events:none}.ui-shell{--edge-height: 44px;height:100%;display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:var(--edge-height) minmax(0,1fr) var(--edge-height)}#header,#footer{display:flex}#header{align-items:flex-start;justify-content:space-between;color:#f8fafc;font:700 clamp(.85rem,2vw,1rem) system-ui,sans-serif;letter-spacing:.08em;text-transform:uppercase;text-shadow:0 2px 10px #020617}#project_title{display:grid;gap:.25rem}#tilemap_status,#renderer_status,#fps_status,#mouse_circle_radius_status,.ui-label{color:#93c5fd;font:600 clamp(.65rem,1.5vw,.75rem) system-ui,sans-serif;letter-spacing:.05em;text-transform:none}.ui-subtitle{color:#93c5fd;font:600 clamp(.75rem,1.75vw,.875rem) system-ui,sans-serif;letter-spacing:.05em;text-transform:none}#header a,#header a:visited,.control-art{pointer-events:auto}#header a,#header a:visited{color:#f8fafc}.header-actions{display:flex;flex-direction:column;align-items:flex-end;gap:.35rem;margin-left:auto}.menu-hotkey-hint{color:#93c5fd;text-shadow:0 2px 10px #020617}.circle-debug-panel{position:absolute;top:0;right:0;z-index:25;display:flex;flex-direction:column;align-items:flex-end;gap:.35rem;max-height:min(70vh,40rem);overflow:auto;padding:.55rem .65rem;border:1px solid #334155;border-radius:.5rem;background:#0f172aeb;pointer-events:auto}.circle-debug-panel .ui-subtitle{width:100%;text-align:right}.circle-debug-panel .game-menu-toggle-row{width:min(14rem,42vw);justify-content:space-between}.circle-settings-section{width:min(14rem,42vw);display:flex;flex-direction:column;gap:.3rem;align-items:stretch}.circle-settings-section-header{display:flex;align-items:center;gap:.35rem;width:100%}.circle-settings-section-toggle{flex:1;display:flex;align-items:center;justify-content:space-between;gap:.5rem;margin:0;padding:.2rem 0;border:0;background:transparent;color:#93c5fd;font:600 clamp(.75rem,1.75vw,.875rem) system-ui,sans-serif;letter-spacing:.05em;cursor:pointer;text-align:left}.circle-settings-section-enable{margin:0;padding:.1rem .2rem;border:0;background:transparent;color:#93c5fd;font:600 clamp(.75rem,1.75vw,.875rem) system-ui,sans-serif;cursor:pointer;line-height:1}.circle-settings-section-body{display:flex;flex-direction:column;gap:.3rem;width:100%}.circle-settings-section.is-disabled .circle-settings-section-body{opacity:.45;pointer-events:none}.game-menu-backdrop{position:fixed;inset:0;z-index:40;display:flex;align-items:center;justify-content:center;padding:1rem;box-sizing:border-box;background:#020617b8;pointer-events:auto}.game-menu-window{width:min(28rem,100%);max-height:min(82vh,52rem);display:flex;flex-direction:column;align-items:stretch;gap:.85rem;padding:1.25rem 1.25rem 1.1rem;border:1px solid #334155;border-radius:.75rem;background:#0f172a;box-shadow:0 18px 50px #0206178c;color:#e2e8f0;overflow:hidden}.game-menu-pause-title{margin:0;text-align:center;font:800 clamp(2rem,8vw,3.25rem) system-ui,sans-serif;letter-spacing:.18em;text-transform:uppercase;color:#f8fafc}.game-menu-hint{margin:-.35rem 0 0;text-align:center;color:#94a3b8;font:600 .75rem system-ui,sans-serif}.game-menu-body{display:flex;flex-direction:column;gap:.65rem;overflow:auto;padding-right:.1rem}.game-menu-section{display:flex;flex-direction:column;align-items:stretch;gap:.35rem;border:1px solid #1e293b;border-radius:.5rem;background:#111827;overflow:hidden}.game-menu-section-toggle{display:flex;align-items:center;justify-content:space-between;gap:.75rem;width:100%;margin:0;padding:.7rem .85rem;border:0;background:transparent;color:#f8fafc;font:700 .85rem system-ui,sans-serif;letter-spacing:.08em;text-transform:uppercase;cursor:pointer;pointer-events:auto}.game-menu-section-body{display:flex;flex-direction:column;gap:.35rem;padding:0 .85rem .85rem}.game-menu-toggle-row{display:flex;align-items:center;justify-content:space-between;gap:.75rem;width:100%;text-align:left}.game-menu-action,.game-menu-resume{pointer-events:auto}.game-menu-resume{align-self:center;min-width:8rem;padding:.45rem 1rem;border:1px solid #334155;border-radius:.4rem;background:#1e293b}.keybind-list{display:flex;flex-direction:column;gap:.5rem}.keybind-row{display:grid;grid-template-columns:minmax(5.5rem,.7fr) minmax(0,1fr) auto;gap:.55rem;align-items:center;font:600 .8rem system-ui,sans-serif}.keybind-keys{color:#93c5fd}.keybind-action{color:#cbd5e1}.keybind-keys-wrap{display:flex;flex-wrap:wrap;gap:.3rem;min-width:0}.keybind-empty{color:#64748b;font:600 .72rem system-ui,sans-serif}.keybind-chip{display:inline-flex;align-items:center;gap:.2rem;min-height:1.55rem;padding:.2rem .45rem;border:1px solid #334155;border-radius:.3rem;background:#0f172a;color:#93c5fd;font:700 .7rem system-ui,sans-serif;letter-spacing:.04em;text-transform:uppercase;cursor:pointer;pointer-events:auto}.keybind-chip-remove{display:none;font-size:.9rem;line-height:1}.keybind-chip:hover{border-color:#ef4444;background:#7f1d1d8c;color:#fecaca}.keybind-chip:hover .keybind-chip-remove{display:inline}.keybind-record{min-width:4.6rem;padding:.28rem .55rem;border:1px solid #334155;border-radius:.3rem;background:#1e293b;color:#e2e8f0;font:700 .7rem system-ui,sans-serif;letter-spacing:.04em;text-transform:uppercase;cursor:pointer;pointer-events:auto}.keybind-record.is-recording{border-color:#ef4444;background:#7f1d1d;color:#fecaca;animation:keybind-record-flash .9s ease-in-out infinite}@keyframes keybind-record-flash{0%,to{opacity:1}50%{opacity:.45}}.keybind-help,.keybind-note{margin:.15rem 0 0;color:#94a3b8;font:600 .72rem system-ui,sans-serif}.keybind-note{display:flex;justify-content:space-between;gap:.75rem}.keybind-editor{display:flex;flex-direction:column;gap:.55rem}.settings-group{display:flex;flex-direction:column;align-items:flex-end;gap:.35rem}.debug-circle-group{display:flex;flex-direction:column;align-items:flex-end;gap:.35rem;margin-top:.75rem}.debug-circle-field{display:flex;flex-direction:column;align-items:flex-end;gap:.2rem;width:min(14rem,42vw);pointer-events:auto}.debug-circle-field-label{width:100%;text-align:right}.debug-circle-field-controls{display:flex;align-items:center;gap:.4rem;width:100%}.debug-circle-field input[type=number]{width:4.5rem;flex:0 0 auto;appearance:textfield;border:1px solid #334155;border-radius:.25rem;padding:.15rem .3rem;background:#0f172a;color:#e2e8f0;font:inherit}.debug-circle-field input[type=range]{flex:1 1 auto;width:100%;min-width:0;accent-color:#93c5fd;cursor:pointer}.debug-circle-field input[type=number]::-webkit-outer-spin-button,.debug-circle-field input[type=number]::-webkit-inner-spin-button{appearance:none;margin:0}.settings-control{appearance:none;border:0;padding:0;background:transparent;cursor:pointer;pointer-events:auto}.settings-control:hover,.settings-control:focus-visible{color:#bfdbfe;text-decoration:underline;text-underline-offset:.16em;outline:none}.settings-text-style{color:#93c5fd;font:600 clamp(.65rem,1.5vw,.75rem) system-ui,sans-serif}.colliders-toggle{appearance:none;border:0;padding:0;background:transparent;cursor:pointer;pointer-events:auto}.colliders-toggle:hover,.colliders-toggle:focus-visible{color:#bfdbfe;text-decoration:underline;text-underline-offset:.16em;outline:none}.mute-sfx-toggle{appearance:none;border:0;padding:0;background:transparent;cursor:pointer;pointer-events:auto}.mute-sfx-toggle:hover,.mute-sfx-toggle:focus-visible{color:#bfdbfe;text-decoration:underline;text-underline-offset:.16em;outline:none}.respawn-toggle{appearance:none;border:0;padding:0;background:transparent;cursor:pointer;pointer-events:auto}.respawn-toggle:hover,.respawn-toggle:focus-visible{color:#bfdbfe;text-decoration:underline;text-underline-offset:.16em;outline:none}.coords-toggle{appearance:none;border:0;padding:0;background:transparent;cursor:pointer;pointer-events:auto}.coords-toggle:hover,.coords-toggle:focus-visible{color:#bfdbfe;text-decoration:underline;text-underline-offset:.16em;outline:none}.mouse-control-toggle{appearance:none;border:0;padding:0;background:transparent;cursor:pointer;pointer-events:auto}.mouse-control-toggle:hover,.mouse-control-toggle:focus-visible{color:#bfdbfe;text-decoration:underline;text-underline-offset:.16em;outline:none}#player_coords_status{color:#93c5fd;font:600 clamp(.65rem,1.5vw,.75rem) system-ui,sans-serif;letter-spacing:.05em;text-transform:none}#body{min-height:0;display:flex;align-items:flex-end}#footer{align-items:flex-end;justify-content:flex-end;color:#cbd5e1;font:500 .75rem system-ui,sans-serif}.virtual-controller{width:100%;height:var(--controller-zone-height);display:flex;align-items:center;justify-content:space-between;padding-bottom:.15rem;transform:translateY(var(--controller-offset));pointer-events:none}.action-controls{display:flex;align-items:center;min-width:0;gap:var(--controller-action-gap)}.virtual-control{display:grid;justify-items:center;min-width:0;gap:var(--controller-label-gap);color:#e2e8f0;font:700 var(--controller-label-size) system-ui,sans-serif;text-align:center;text-shadow:0 1px 3px #020617}.virtual-control>span{max-inline-size:var(--controller-control-size);line-height:1.15;overflow-wrap:anywhere}.control-art{--control-size: var(--controller-control-size);position:relative;width:var(--control-size);height:var(--control-size);padding:0;border:0;background:transparent;touch-action:none;cursor:grab}.control-art:active{cursor:grabbing}.action-art{--control-size: var(--controller-control-size)}.control-art img:first-child,.control-handle{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;pointer-events:none;-webkit-user-select:none;user-select:none}.control-handle{width:52.94%;height:52.94%;inset:23.53%;transition:transform 70ms ease-out,scale 70ms ease-out}.action-art .control-handle{width:58.33%;height:58.33%;inset:20.83%}.action-art .control-handle.is-pressed{scale:.85}@media(max-width:480px){.ui-shell{--edge-height: 36px}}