html,body{overscroll-behavior:none;-webkit-tap-highlight-color:transparent;-webkit-text-size-adjust:100%;background:#0e1117;width:100%;height:100%;margin:0;overflow:hidden}body{color:#dbe7ff;font-family:monospace;display:block}#game{flex-direction:column;justify-content:stretch;align-items:stretch;width:100%;height:100%;display:flex;position:relative}#game-canvas-wrap{background:#0e1117;flex:auto;width:100%;min-height:0;position:relative;overflow:hidden}#game-canvas-wrap canvas{image-rendering:pixelated;margin:auto;display:block}#game-controls{display:contents}.tf-controls{--touch-alpha:.6;--touch-alpha-active:.95;--punch-color:#df4545;--kick-color:#426edb;pointer-events:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;touch-action:none}.tf-controls[data-layout=hidden]{display:none!important}.tf-controls .tf-controls-pause,.tf-controls .tf-controls-dpad,.tf-controls .tf-controls-attacks{pointer-events:none}.tf-controls button,.tf-controls .tf-dpad-ring{pointer-events:auto;touch-action:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}.tf-dpad-ring{background:rgba(20, 24, 32, calc(var(--touch-alpha) * .85));border:2px solid rgba(141, 230, 255, calc(var(--touch-alpha) * .85));width:clamp(120px,28vmin,180px);height:clamp(120px,28vmin,180px);box-shadow:inset 0 0 0 6px rgba(0, 0, 0, calc(var(--touch-alpha) * .4));border-radius:50%;position:relative}.tf-dpad-ring.is-pressed{border-color:rgba(141, 230, 255, var(--touch-alpha-active));background:rgba(20, 24, 32, calc(var(--touch-alpha) * .95))}.tf-dpad-nub{background:rgba(220, 231, 255, calc(var(--touch-alpha) * 1.1));border:2px solid rgba(255, 255, 255, calc(var(--touch-alpha) * .9));pointer-events:none;border-radius:50%;width:38%;height:38%;transition:background 80ms linear;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.tf-dpad-ring.is-pressed .tf-dpad-nub{background:rgba(255, 255, 255, var(--touch-alpha-active))}.tf-controls-attacks{grid-template-columns:repeat(3,auto);grid-auto-rows:auto;gap:clamp(8px,1.6vmin,14px);display:grid}.tf-attack-btn{border:2px solid rgba(255, 255, 255, calc(var(--touch-alpha) * .85));color:#fff;cursor:pointer;text-align:center;letter-spacing:.5px;background:rgba(20, 24, 32, calc(var(--touch-alpha) * .85));border-radius:50%;width:clamp(48px,11vmin,68px);height:clamp(48px,11vmin,68px);padding:0;font-family:monospace;font-size:clamp(13px,2.4vmin,16px);font-weight:700}.tf-attack-btn.tf-attack-punch{background:rgba(223, 69, 69, calc(var(--touch-alpha) * .85));border-color:rgba(255, 200, 200, calc(var(--touch-alpha) * .9))}.tf-attack-btn.tf-attack-kick{background:rgba(66, 110, 219, calc(var(--touch-alpha) * .85));border-color:rgba(200, 215, 255, calc(var(--touch-alpha) * .9))}.tf-attack-btn.is-pressed{background:rgba(255, 255, 255, var(--touch-alpha-active));color:#0e1117}.tf-pause-btn{border:1px solid rgba(255, 255, 255, calc(var(--touch-alpha) * .7));background:rgba(20, 24, 32, calc(var(--touch-alpha) * .7));color:#fff;cursor:pointer;letter-spacing:2px;border-radius:8px;width:40px;height:40px;padding:0;font-family:monospace;font-size:18px;font-weight:700}.tf-pause-btn:active{background:rgba(141, 230, 255, var(--touch-alpha-active));color:#0e1117}.tf-controls[data-layout=landscape]{z-index:20;position:absolute;inset:0}.tf-controls[data-layout=landscape] .tf-controls-pause{top:max(12px, env(safe-area-inset-top));right:max(12px, env(safe-area-inset-right));position:absolute}.tf-controls[data-layout=landscape] .tf-controls-dpad{bottom:max(20px, env(safe-area-inset-bottom));left:max(20px, env(safe-area-inset-left));position:absolute}.tf-controls[data-layout=landscape] .tf-controls-attacks{bottom:max(20px, env(safe-area-inset-bottom));right:max(20px, env(safe-area-inset-right));position:absolute}html[data-orientation=portrait][data-touch="1"] #game{grid-template-rows:auto 1fr;align-items:stretch;display:grid}html[data-orientation=portrait][data-touch="1"] #game-canvas-wrap{aspect-ratio:16/9;flex:none;width:100vw;max-height:60vh}html[data-orientation=portrait][data-touch="1"] #game-controls{display:block}.tf-controls[data-layout=portrait]{--touch-alpha:.95;--touch-alpha-active:1;width:100%;height:100%;padding:max(12px, env(safe-area-inset-bottom)) max(16px, env(safe-area-inset-right)) max(20px, env(safe-area-inset-bottom)) max(16px, env(safe-area-inset-left));box-sizing:border-box;background:linear-gradient(#141820,#0e1117);border-top:1px solid #8de6ff66;grid-template-rows:auto 1fr;grid-template-columns:1fr 1fr;place-items:end center;gap:12px 16px;display:grid;position:relative}.tf-controls[data-layout=portrait] .tf-controls-pause{grid-area:1/1/auto/-1;justify-self:end}.tf-controls[data-layout=portrait] .tf-controls-dpad{grid-area:2/1;justify-content:center;align-items:center;display:flex}.tf-controls[data-layout=portrait] .tf-controls-dpad .tf-dpad-ring{width:clamp(140px,36vmin,220px);height:clamp(140px,36vmin,220px)}.tf-controls[data-layout=portrait] .tf-controls-attacks{grid-area:2/2;align-self:center}.tf-controls[data-layout=portrait] .tf-attack-btn{width:clamp(56px,14vmin,80px);height:clamp(56px,14vmin,80px)}