:root{color:#f7f2df;background:#171421;font-family:system-ui,sans-serif;font-synthesis:none;text-rendering:optimizeLegibility}*{box-sizing:border-box}html,body{width:100%;height:100%;margin:0;overflow:hidden;overscroll-behavior:none}body{min-height:100dvh;background:radial-gradient(circle at 50% 20%,#353047 0,#171421 65%),#171421}#app{position:fixed;top:calc(var(--visual-viewport-top, 0px) + env(safe-area-inset-top));left:calc(var(--visual-viewport-left, 0px) + env(safe-area-inset-left));display:flex;width:calc(var(--visual-viewport-width, 100vw) - env(safe-area-inset-left) - env(safe-area-inset-right));height:calc(var(--visual-viewport-height, 100dvh) - env(safe-area-inset-top) - env(safe-area-inset-bottom));align-items:center;justify-content:center}canvas{display:block;margin:0!important;max-width:100%;max-height:100%;image-rendering:auto;box-shadow:0 24px 80px #00000073;touch-action:none}.fullscreen-button{position:fixed;top:calc(var(--visual-viewport-top, 0px) + env(safe-area-inset-top) + 10px);right:calc(env(safe-area-inset-right) + 10px);z-index:900;width:42px;height:42px;padding:0 0 3px;border:2px solid #f7dc64;border-radius:4px;color:#f7dc64;font:900 24px/1 system-ui,sans-serif;background:#171421d1;box-shadow:0 4px 16px #00000059;touch-action:manipulation}.fullscreen-button[hidden]{display:none}.fullscreen-button:active{color:#171421;background:#f7dc64}.dev-panel{position:fixed;top:calc(var(--visual-viewport-top, 0px) + env(safe-area-inset-top) + 10px);left:calc(var(--visual-viewport-left, 0px) + env(safe-area-inset-left) + 10px);z-index:950;width:min(310px,calc(100vw - 20px));color:#e8f5ef;font:700 12px/1.35 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;filter:drop-shadow(0 6px 18px rgb(0 0 0 / 42%))}.dev-panel button,.dev-panel select,.dev-panel input{font:inherit}.dev-panel__toggle{display:flex;min-height:34px;align-items:center;padding:7px 10px;border:1px solid #71d69f;border-radius:4px;color:#71d69f;background:#0c1214e0;cursor:pointer}.dev-panel__summary{color:#c7d8d1;font-weight:600}.dev-panel__content{display:none;gap:10px;margin-top:5px;padding:12px;border:1px solid rgb(113 214 159 / 65%);border-radius:4px;background:#0c1214f0;backdrop-filter:blur(8px)}.dev-panel--open .dev-panel__content{display:grid}.dev-panel__field{display:grid;gap:4px;color:#8ca89d}.dev-panel__select{width:100%;min-width:0;padding:7px 8px;border:1px solid #58796b;border-radius:3px;color:#edf7f2;background:#18251f}.dev-panel__checkbox{display:flex;align-items:center;color:#dcebe4;cursor:pointer}.dev-panel__checkbox input{width:16px;height:16px;margin:0 7px 0 0;accent-color:#71d69f}.dev-panel__metrics{min-height:136px;margin:0;padding:9px;overflow:hidden;border:1px solid #354c42;border-radius:3px;color:#cce2d8;line-height:1.55;background:#0a100d}.dev-panel__legend{color:#829c91;font-size:10px;font-weight:600;line-height:1.4}.dev-panel__reset{padding:8px 10px;border:1px solid #ff7b7b;border-radius:3px;color:#ff9a9a;background:#2b171a;cursor:pointer}.dev-panel__toggle:hover,.dev-panel__toggle:focus-visible{color:#0c1214;background:#71d69f}.dev-panel__toggle:hover .dev-panel__summary,.dev-panel__toggle:focus-visible .dev-panel__summary{color:#20352c}.dev-panel__reset:hover,.dev-panel__reset:focus-visible{color:#2b171a;background:#ff9a9a}.level-editor{position:fixed;top:calc(var(--visual-viewport-top, 0px) + env(safe-area-inset-top) + 10px);right:calc(var(--visual-viewport-left, 0px) + env(safe-area-inset-right) + 10px);z-index:940;display:grid;width:min(286px,calc(100vw - 20px));max-height:calc(100dvh - 20px);gap:9px;padding:13px;overflow-y:auto;border:2px solid #f7dc64;border-radius:4px;color:#f7f2df;font:800 11px/1.35 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;background:#171421f2;box-shadow:0 8px 28px #0000007a;backdrop-filter:blur(8px)}.level-editor[hidden]{display:none}.level-editor input,.level-editor select,.level-editor button{font:inherit}.level-editor__heading{color:#f7dc64;font-size:15px}.level-editor__hint{color:#a9a2b5;font-size:10px}.level-editor__selection{min-height:43px;padding:8px;white-space:pre-line;border:1px solid #5e5869;border-radius:3px;color:#fff;background:#100e17}.level-editor__coordinates{display:grid;grid-template-columns:1fr 1fr;gap:8px}.level-editor__slot-fields{display:grid;gap:8px;padding-top:2px}.level-editor__slot-fields[hidden]{display:none}.level-editor__field{display:grid;gap:3px;color:#aaa3b7}.level-editor__field input,.level-editor__field select{width:100%;min-width:0;padding:7px;border:1px solid #665f73;border-radius:3px;color:#fff;background:#252131}.level-editor__button{min-height:34px;padding:7px 9px;border:1px solid #8dd8dd;border-radius:3px;color:#c9f3f3;background:#183033;cursor:pointer}.level-editor__button:hover,.level-editor__button:focus-visible{color:#171421;background:#8dd8dd}.level-editor__button--primary{border-color:#71d69f;color:#a8ecc5;background:#173024}.level-editor__button--primary:hover,.level-editor__button--primary:focus-visible{background:#71d69f}.level-editor__button--danger{border-color:#ff7b7b;color:#ffadad;background:#35191f}.level-editor__button--danger:hover,.level-editor__button--danger:focus-visible{background:#ff7b7b}.level-editor__status{min-height:30px;color:#a8ecc5;font-size:10px}.level-editor__status--error{color:#ff9a9a}.orientation-overlay{position:fixed;inset:0;z-index:1000;display:grid;grid-template-rows:auto auto auto;align-content:center;justify-items:center;gap:18px;padding:max(28px,env(safe-area-inset-top)) max(28px,env(safe-area-inset-right)) max(28px,env(safe-area-inset-bottom)) max(28px,env(safe-area-inset-left));color:#f7f2df;text-align:center;background:#171421}.orientation-overlay[hidden]{display:none}.orientation-overlay h1{max-width:360px;margin:8px 0 0;color:#f7dc64;font-family:Rubik,system-ui,sans-serif;font-size:28px;font-weight:900;line-height:1.05}.orientation-overlay p{max-width:330px;margin:0;color:#d8d1df;font-family:Rubik,system-ui,sans-serif;font-size:16px;font-weight:700;line-height:1.4}.orientation-phone{position:relative;width:82px;height:132px;border:6px solid #f7dc64;border-radius:8px;animation:rotate-phone 1.8s ease-in-out 1}.orientation-phone__screen{position:absolute;inset:12px 8px 18px;border:3px solid #8dd8dd;background:#312d3d}.orientation-phone__button{position:absolute;bottom:5px;left:50%;width:16px;height:4px;background:#f7dc64;transform:translate(-50%)}@keyframes rotate-phone{0%,22%{transform:rotate(0)}62%,to{transform:rotate(90deg)}}@media(prefers-reduced-motion:reduce){.orientation-phone{animation:none;transform:rotate(90deg)}}
