@font-face{font-family:prstart;src:url(../fonts/prstart.ttf);font-display:swap}:root{--black: #020203;--ink: #07080a;--glass: rgba(255, 255, 255, .06);--glass-strong: rgba(255, 255, 255, .1);--line: rgba(255, 255, 255, .16);--line-strong: rgba(255, 255, 255, .3);--text: #f7f7f5;--muted: #9a9da3;--dim: #62666d;--accent: #d8a24a;--focus: #9ec5ff;--radius: 8px;--topbar-h: 64px;--controls-h: 32vh;--sat: env(safe-area-inset-top, 0px);--sab: env(safe-area-inset-bottom, 0px);--sal: env(safe-area-inset-left, 0px);--sar: env(safe-area-inset-right, 0px);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;color:var(--text);color-scheme:dark}*{box-sizing:border-box}html,body,#root{margin:0;height:100%;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent}html,body{overflow:hidden;overscroll-behavior:none;touch-action:none}body{background:var(--black);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}body:before{content:"";position:fixed;inset:0;pointer-events:none;background:radial-gradient(920px 620px at 50% -16%,rgba(255,255,255,.13),transparent 62%),radial-gradient(720px 420px at 50% 108%,rgba(216,162,74,.11),transparent 66%),linear-gradient(180deg,#101114,#020203 56%,#000)}body:after{content:"";position:fixed;inset:0;pointer-events:none;background:linear-gradient(90deg,rgba(255,255,255,.055),transparent 16%,transparent 84%,rgba(255,255,255,.055)),repeating-linear-gradient(0deg,rgba(255,255,255,.018) 0,rgba(255,255,255,.018) 1px,transparent 1px,transparent 4px);opacity:.42}button,select{font:inherit}button,canvas,img,#app,#stage,#main,#controls{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;-webkit-user-drag:none;touch-action:none}input,textarea,select{-webkit-user-select:text;user-select:text;touch-action:manipulation}#app{position:relative;height:100vh;height:100dvh;min-height:0;display:flex;flex-direction:column}#topbar{flex:0 0 auto;min-height:calc(var(--topbar-h) + var(--sat));display:flex;align-items:center;justify-content:space-between;gap:18px;padding:max(14px,var(--sat)) max(24px,calc(var(--sar) + 24px)) 12px max(24px,calc(var(--sal) + 24px));border-bottom:1px solid rgba(255,255,255,.08);background:#02020394;backdrop-filter:blur(24px) saturate(145%);-webkit-backdrop-filter:blur(24px) saturate(145%);z-index:50}.brand{min-width:0;display:flex;align-items:center;gap:12px}.brand-mark{position:relative;width:29px;height:29px;flex:0 0 auto;border:1px solid rgba(255,255,255,.34);border-radius:var(--radius);background:linear-gradient(90deg,transparent 44%,rgba(2,2,3,.96) 44% 56%,transparent 56%),linear-gradient(0deg,transparent 44%,rgba(2,2,3,.96) 44% 56%,transparent 56%),linear-gradient(145deg,#fbf3d2,var(--accent) 52%,#8b5a20);box-shadow:0 0 28px #d8a24a2e}.brand-mark:after{content:"";position:absolute;top:-7px;left:50%;width:4px;height:11px;transform:translate(-50%);border-radius:1px;background:var(--text)}.brand-copy{min-width:0;display:grid;gap:3px}.brand-name{font-family:prstart,ui-monospace,monospace;font-size:clamp(11px,1.7vw,14px);letter-spacing:0;white-space:nowrap}.brand-subtitle{color:var(--muted);font-size:11px;line-height:1;letter-spacing:.02em}.topbar-actions{display:flex;align-items:center;justify-content:flex-end;gap:8px}.icon-btn,#lang-switcher{height:38px;color:var(--text);border:1px solid var(--line);border-radius:var(--radius);background:#ffffff0b;box-shadow:inset 0 1px #ffffff13;transition:transform .12s ease,background .16s ease,border-color .16s ease}.icon-btn{appearance:none;width:38px;display:inline-flex;align-items:center;justify-content:center;padding:0;cursor:pointer}.icon-btn:hover,#lang-switcher:hover{background:#ffffff18;border-color:var(--line-strong)}.icon-btn:focus-visible,#lang-switcher:focus-visible,.ctrl-btn:focus-visible{outline:2px solid var(--focus);outline-offset:3px}.icon-btn:active{transform:scale(.94)}.icon-btn--sm{width:30px;height:30px;font-size:18px}#lang-switcher{appearance:none;-webkit-appearance:none;min-width:88px;padding:0 30px 0 12px;font-size:12px;cursor:pointer;background:#ffffff0b url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath fill='%239a9da3' d='M0 0l5 6 5-6z'/%3E%3C/svg%3E") no-repeat right 11px center}#lang-switcher option{color:#08090b}#stage{position:relative;flex:1 1 auto;min-width:0;min-height:0;display:flex;align-items:center;justify-content:center;padding:clamp(16px,4vmin,52px);padding-left:max(clamp(16px,4vmin,52px),var(--sal));padding-right:max(clamp(16px,4vmin,52px),var(--sar));overflow:hidden}.play-shell{position:relative;width:min(100%,1180px);height:min(100%,760px);min-width:0;min-height:0;display:flex;align-items:center;justify-content:center;padding:clamp(10px,1.8vmin,20px)}.play-shell:before{content:"";position:absolute;inset:0;pointer-events:none;border:1px solid rgba(255,255,255,.1);border-radius:var(--radius);background:linear-gradient(180deg,#ffffff16,#ffffff06),#ffffff06;box-shadow:0 40px 90px #00000094,inset 0 1px #ffffff1f;backdrop-filter:blur(18px) saturate(130%);-webkit-backdrop-filter:blur(18px) saturate(130%)}.canvas-fit-area{position:relative;z-index:1;width:100%;height:100%;min-width:0;min-height:0;display:flex;align-items:center;justify-content:center}#main.screen{position:relative;display:inline-flex;max-width:100%;max-height:100%;padding:clamp(6px,1.15vmin,12px);border:1px solid rgba(255,255,255,.22);border-radius:var(--radius);background:linear-gradient(180deg,#16181d,#050506),var(--ink);box-shadow:0 24px 80px #000000b8,inset 0 1px #ffffff1a}#main.screen:after{content:"";position:absolute;inset:clamp(6px,1.15vmin,12px);pointer-events:none;border-radius:4px;box-shadow:inset 0 0 0 1px #ffffff14}canvas{display:block;max-width:100%;max-height:100%;background:#000;border-radius:4px;image-rendering:pixelated}.card{position:fixed;top:calc(var(--topbar-h) + 14px + var(--sat));right:max(14px,var(--sar));width:min(260px,calc(100vw - 28px));z-index:80;padding:12px;border:1px solid var(--line);border-radius:var(--radius);background:#08080ad6;box-shadow:0 28px 70px #00000094;backdrop-filter:blur(24px) saturate(145%);-webkit-backdrop-filter:blur(24px) saturate(145%);animation:card-in .16s ease}.card[hidden]{display:none}@keyframes card-in{0%{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:translateY(0)}}.card-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:10px;font-family:prstart,ui-monospace,monospace;font-size:10px;color:var(--text)}.card table{width:100%;border-collapse:collapse}.card td{padding:8px 0;border-top:1px solid rgba(255,255,255,.08);color:var(--text);vertical-align:middle}.card td:last-child{text-align:right;color:var(--muted)}.card img{width:18px;height:18px;vertical-align:middle;opacity:.92;image-rendering:pixelated}.build-meta{position:fixed;right:max(12px,var(--sar));bottom:max(10px,var(--sab));z-index:54;display:flex;align-items:center;gap:10px;max-width:calc(100vw - 28px - var(--sal) - var(--sar));color:#f7f7f547;font:10px/1.2 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;letter-spacing:0;pointer-events:none;white-space:nowrap;text-align:right}.build-meta span+span:before{content:"/";margin-right:10px;color:#f7f7f538}#controls{position:fixed;inset:0;pointer-events:none;z-index:60;touch-action:none}#controls,#controls *{-webkit-user-select:none!important;user-select:none!important;-webkit-touch-callout:none!important;-webkit-user-drag:none;-webkit-tap-highlight-color:transparent;touch-action:none}#controls[hidden]{display:none}#controls .pad,#controls .actions{position:absolute;pointer-events:auto}#controls .pad{display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(3,1fr);width:min(40vw,220px);aspect-ratio:1 / 1;gap:8px}#controls .actions{display:flex;flex-direction:column;align-items:flex-end;gap:14px}#controls .actions-system{display:flex;gap:10px}.ctrl-btn{appearance:none;-webkit-appearance:none;display:flex;align-items:center;justify-content:center;margin:0;padding:0;color:var(--text);background:#0a0a0ca8;border:1px solid var(--line-strong);border-radius:var(--radius);box-shadow:0 16px 38px #0000006b,inset 0 1px #ffffff1f;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;-webkit-user-drag:none;touch-action:none;cursor:default;transition:transform 90ms ease,background .12s ease,box-shadow .12s ease}.ctrl-btn.pressed,.ctrl-btn:active{transform:scale(.93);background:#ffffff2b;box-shadow:inset 0 0 0 2px #ffffff38,0 2px 10px #00000059}body.touch .ctrl-btn{backdrop-filter:none;-webkit-backdrop-filter:none;transition:none;transform:translateZ(0);will-change:transform}body.touch .ctrl-btn.pressed,body.touch .ctrl-btn:active{transform:translateZ(0) scale(.93)}body.touch #topbar,body.touch .play-shell:before,body.touch .card{backdrop-filter:none;-webkit-backdrop-filter:none}body.touch .play-shell:before{background:#08080ab8;box-shadow:0 22px 42px #00000075,inset 0 1px #ffffff1a}body.touch #topbar{background:#020203e6}#controls .pad .ctrl-btn{font-size:clamp(16px,4.2vw,22px)}#btn-up{grid-area:1 / 2}#btn-left{grid-area:2 / 1}#btn-right{grid-area:2 / 3}#btn-down{grid-area:3 / 2}#btn-center{grid-area:2 / 2;background:#ffffff07;border-color:var(--line);box-shadow:none;backdrop-filter:none;pointer-events:none}.ctrl-btn--fire{width:clamp(84px,22vw,120px);height:clamp(84px,22vw,120px);border-radius:50%;font-size:clamp(14px,3.7vw,19px);font-weight:750;letter-spacing:.08em;color:#130d04;background:linear-gradient(180deg,#ffe8ad,var(--accent));border-color:#d8a24abd}.ctrl-btn--fire.pressed,.ctrl-btn--fire:active{background:linear-gradient(180deg,#fff1cb,#e4b35d)}.ctrl-btn--sys{min-width:64px;height:38px;padding:0 12px;font-size:clamp(11px,3vw,14px)}@media(orientation:landscape){#controls .pad{left:max(3vw,var(--sal));bottom:max(4vh,var(--sab))}#controls .actions{right:max(3vw,var(--sar));bottom:max(4vh,var(--sab))}}@media(orientation:portrait){body.touch #stage{padding-bottom:calc(var(--controls-h) + var(--sab))}body.touch .build-meta{bottom:calc(var(--controls-h) + var(--sab) + 8px)}#controls .pad{left:max(6vw,var(--sal));bottom:calc(var(--sab) + 5vh);width:min(44vw,230px)}#controls .actions{right:max(6vw,var(--sar));bottom:calc(var(--sab) + 5vh);align-items:flex-end}}@media(max-width:560px){:root{--topbar-h: 58px}#topbar{gap:10px;padding-left:max(12px,var(--sal));padding-right:max(12px,var(--sar))}.brand-subtitle{display:none}.brand-mark{width:27px;height:27px}.brand-name{font-size:11px}#lang-switcher{min-width:72px;width:72px}.play-shell{padding:8px}}@media(pointer:fine){#controls{display:none}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.001ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.001ms!important}}