:root{color-scheme:dark;--bg:#101316;--panel:#171d21;--panel-2:#20272b;--line:#344047;--text:#f3f7f4;--muted:#98a7a0;--green:#65d46e;--mint:#36d8b7;--red:#ff635f;--yellow:#ffd25c;--blue:#68a7ff;--wall:#9aa4ab;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}*{box-sizing:border-box}body,html{min-height:100%}body{margin:0;background:linear-gradient(130deg,rgba(54,216,183,.12),transparent 32%),linear-gradient(45deg,rgba(255,210,92,.08),transparent 35%),var(--bg);color:var(--text)}button{border:0;color:inherit;font:inherit}.shell{display:grid;grid-template-columns:280px minmax(0,1fr);min-height:100vh}.library{border-right:1px solid var(--line);background:rgba(16,19,22,.82);padding:24px}.brand{display:flex;align-items:center;gap:12px;margin-bottom:28px}.brand-mark{width:38px;height:38px;border-radius:8px;background:linear-gradient(90deg,transparent 41%,#101316 41% 52%,transparent 52%),linear-gradient(0deg,transparent 41%,#101316 41% 52%,transparent 52%),linear-gradient(135deg,var(--green),var(--yellow));box-shadow:0 12px 30px rgba(101,212,110,.22)}.brand h1,.brand p,.topbar h2,.topbar p{margin:0}.brand h1{font-size:20px;line-height:1.1}.brand p,.eyebrow{color:var(--muted);font-size:12px;text-transform:uppercase}.game-list{display:grid;gap:10px}.game-item{display:grid;grid-template-columns:42px 1fr;align-items:center;gap:12px;min-height:64px;border:1px solid var(--line);border-radius:8px;background:var(--panel);padding:10px;text-align:left}.game-item.active{border-color:rgba(101,212,110,.72);background:#1d2a20}.game-item:disabled{opacity:.48}.game-icon{display:grid;place-items:center;width:42px;height:42px;border-radius:8px;background:var(--panel-2);color:var(--green);font-weight:800}.game-item small,.game-item strong{display:block}.game-item small{color:var(--muted);margin-top:2px}.game-stage{display:grid;grid-template-rows:auto auto minmax(0,1fr) auto;gap:16px;padding:24px}.topbar{display:flex;justify-content:space-between;align-items:center;gap:16px}.topbar h2{font-size:clamp(28px,5vw,52px);line-height:1}.actions{display:flex;align-items:center;gap:10px}.icon-button,.primary-button{cursor:pointer;border-radius:8px;border:1px solid var(--line);background:var(--panel-2);min-height:44px}.icon-button{width:44px;font-weight:800}.primary-button{background:var(--green);border-color:transparent;color:#081108;font-weight:800;padding:0 18px}.hud{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}.hud>div{min-width:0;border:1px solid var(--line);border-radius:8px;background:rgba(23,29,33,.86);padding:12px}.hud span,.hud strong{display:block}.hud span{color:var(--muted);font-size:12px}.hud strong{margin-top:2px;font-size:22px}.arena-wrap{position:relative;display:grid;place-items:center;min-height:0;overflow:hidden;border:1px solid var(--line);border-radius:8px;background:linear-gradient(45deg,rgba(255,255,255,.055) 25%,transparent 25% 75%,rgba(255,255,255,.055) 75%),#060a0c;background-size:18px 18px,auto;padding:min(3vw,18px)}canvas{display:block;border-radius:8px;image-rendering:pixelated;box-shadow:0 24px 60px rgba(0,0,0,.28);outline:1px solid rgba(255,255,255,.1)}#dodgeCanvas{width:min(600px,100%);height:auto;max-height:100%;aspect-ratio:1/1}.overlay{position:absolute;inset:0;display:none;place-items:center;padding:18px;background:rgba(10,12,14,.58)}.overlay.visible{display:grid}.overlay-panel{width:min(360px,100%);border:1px solid rgba(255,255,255,.18);border-radius:8px;background:rgba(23,29,33,.92);padding:22px;text-align:center;backdrop-filter:blur(12px)}.overlay-panel h3,.overlay-panel p{margin:0}.overlay-panel h3{margin-top:6px;font-size:28px}.overlay-panel p{color:var(--muted)}#overlayText{margin:12px 0 18px}.mobile-controls{display:none;justify-content:center}.dpad-panel,.joy-panel{display:flex;align-items:center;justify-content:center}.dpad{display:grid;grid-template-columns:repeat(3,40px);grid-template-rows:repeat(3,40px);gap:5px}.dpad-up{grid-column:2;grid-row:1}.dpad-left{grid-column:1;grid-row:2}.dpad-center{grid-column:2;grid-row:2}.dpad-right{grid-column:3;grid-row:2}.dpad-down{grid-column:2;grid-row:3}.dpad-btn{cursor:pointer;border:1px solid rgba(101,212,110,.45);border-radius:8px;background:rgba(23,29,33,.9);color:var(--text);font-size:18px;line-height:1;touch-action:none;user-select:none;display:grid;place-items:center;transition:background 80ms,border-color 80ms}.dpad-btn.pressed,.dpad-btn:active{background:rgba(101,212,110,.2);border-color:var(--green)}.dpad-center{border-radius:50%;background:rgba(23,29,33,.5);border:1px solid rgba(255,255,255,.07)}.joystick{position:relative;width:132px;height:132px;border:1px solid rgba(101,212,110,.45);border-radius:50%;background:radial-gradient(circle at 50% 50%,rgba(101,212,110,.18) 0 24%,transparent 25%),linear-gradient(90deg,transparent 48%,rgba(255,255,255,.12) 48% 52%,transparent 52%),linear-gradient(0deg,transparent 48%,rgba(255,255,255,.12) 48% 52%,transparent 52%),#121719;box-shadow:inset 0 0 34px rgba(0,0,0,.32),0 18px 38px rgba(0,0,0,.24);touch-action:none;user-select:none}.joystick.active{border-color:rgba(101,212,110,.9);box-shadow:inset 0 0 36px rgba(101,212,110,.14),0 18px 38px rgba(0,0,0,.24)}.joystick-knob{position:absolute;left:50%;top:50%;width:54px;height:54px;border:1px solid rgba(255,255,255,.18);border-radius:50%;background:radial-gradient(circle at 36% 28%,rgba(255,255,255,.54),transparent 20%),linear-gradient(135deg,var(--green),var(--mint));box-shadow:0 12px 28px rgba(54,216,183,.28);transform:translate(-50%,-50%);transition:transform .12s ease}.joystick.active .joystick-knob{transition:none}.joy-arrow{position:absolute;display:grid;place-items:center;width:28px;height:28px;color:rgba(243,247,244,.72);font-size:18px;font-weight:900;pointer-events:none}.joy-arrow-up{top:6px;left:50%;transform:translateX(-50%)}.joy-arrow-right{top:50%;right:6px;transform:translateY(-50%)}.joy-arrow-down{bottom:6px;left:50%;transform:translateX(-50%)}.joy-arrow-left{top:50%;left:6px;transform:translateY(-50%)}@media (max-width:860px){.shell{grid-template-columns:1fr}.library{border-right:0;border-bottom:1px solid var(--line);padding:16px}.game-list{grid-template-columns:repeat(2,minmax(0,1fr))}.game-stage{min-height:calc(100vh - 154px);padding:16px}}@media (max-width:620px){body,html{height:100%;overflow:hidden;overscroll-behavior:none}.shell{height:100svh;overflow:hidden}body{min-height:100svh}.library{display:none}.game-stage{height:100svh;max-height:100svh;min-height:0;gap:10px;padding:12px;overflow:hidden}.topbar{align-items:center;gap:10px}.actions{flex:0 0 auto}.topbar h2{font-size:28px}.eyebrow{font-size:11px}.icon-button,.primary-button{min-height:40px}.primary-button{padding:0 12px}.hud{grid-template-columns:repeat(4,minmax(0,1fr));gap:5px}.hud>div{padding:4px 7px}.hud span{font-size:9px;line-height:1.2}.hud strong{font-size:14px;margin-top:0}.arena-wrap{padding:8px}.mobile-controls{display:flex;justify-content:space-around;align-items:center;padding:6px 12px;gap:12px}canvas{display:block}}.game-stage[hidden]{display:none!important}.mobile-game-switch{display:none;gap:4px;align-items:center}.game-switch-btn{cursor:pointer;width:30px;height:30px;border:1px solid var(--line);border-radius:6px;background:var(--panel-2);color:var(--muted);font-size:13px;font-weight:700;display:grid;place-items:center;transition:background 80ms,border-color 80ms,color 80ms}.game-switch-btn.active{border-color:rgba(101,212,110,.7);background:rgba(101,212,110,.18);color:var(--green)}@media (max-width:860px){.mobile-game-switch{display:flex}.hud>div{padding:7px 10px}.hud strong{font-size:18px}}html.game-compact .mobile-game-switch{display:flex}html.game-compact .game-switch-btn{width:26px;height:26px;font-size:11px}.game-icon-dodge{background:var(--panel-2);color:#ffe066;font-size:20px}.dodge-hp-high{color:#4ade80}.dodge-hp-mid{color:#facc15}.dodge-hp-low{color:#f87171}html.game-compact body{overflow:hidden;overscroll-behavior:none;height:100%}html.game-compact .library{display:none}html.game-compact .shell{grid-template-columns:1fr;height:100svh;max-height:100svh;overflow:hidden}html.game-compact .game-stage{display:grid;grid-template-columns:auto 1fr auto;grid-template-rows:auto 1fr;grid-template-areas:"topbar topbar topbar" "dpad   arena  joy";height:100%;max-height:100%;min-height:0;padding:4px max(0px,env(safe-area-inset-right,0px)) max(4px,env(safe-area-inset-bottom,4px)) max(0px,env(safe-area-inset-left,0px));gap:4px 0;overflow:hidden}html.game-compact .topbar{grid-area:topbar;padding:0 max(12px,calc(env(safe-area-inset-right, 0px) + 10px)) 0 max(12px,calc(env(safe-area-inset-left, 0px) + 10px));min-height:36px}html.game-compact .topbar h2{font-size:20px}html.game-compact .eyebrow{display:none}html.game-compact .icon-button,html.game-compact .primary-button{min-height:34px}html.game-compact .primary-button{padding:0 10px;font-size:13px}html.game-compact .hud{display:none}html.game-compact .arena-wrap{grid-area:arena;padding:4px;border-radius:4px;border-left:none;border-right:none;min-height:0}html.game-compact canvas{display:block}html.game-compact .mobile-controls{display:contents}html.game-compact .dpad-panel{grid-area:dpad;padding:0 10px 0 max(18px,env(safe-area-inset-left,18px))}html.game-compact .dpad-panel,html.game-compact .joy-panel{display:flex;align-items:center;justify-content:center;align-self:center}html.game-compact .joy-panel{grid-area:joy;padding:0 max(18px,env(safe-area-inset-right,18px)) 0 10px}html.game-compact .dpad{grid-template-columns:repeat(3,44px);grid-template-rows:repeat(3,44px);gap:5px}html.game-compact .dpad-btn{font-size:20px;border-radius:10px}html.game-compact .joystick{width:120px;height:120px}html.game-compact .joystick-knob{width:48px;height:48px}html.game-rotate body{overflow:hidden;overscroll-behavior:none}html.game-rotate .shell{position:fixed;width:100svh;height:100svw;min-height:0;max-height:100svw;top:calc((100svh - 100svw) / 2);left:calc((100svw - 100svh) / 2);transform:rotate(90deg);transform-origin:center center;overflow:hidden;padding-left:env(safe-area-inset-top,0);padding-right:env(safe-area-inset-bottom,0)}.rotate-prompt{display:none}.touch-toggle-btn{font-size:18px}.touch-toggle-btn.active{background:rgba(101,212,110,.18);border-color:rgba(101,212,110,.7);box-shadow:0 0 10px rgba(101,212,110,.3)}html.touch-mode .mobile-controls{display:flex;justify-content:space-around;align-items:center;padding:6px 12px;gap:12px}html.touch-mode .game-stage{grid-template-rows:auto auto minmax(0,1fr) auto;height:100vh;overflow:hidden}html.touch-mode .arena-wrap{min-height:0;overflow:hidden}html.touch-mode canvas{display:block}@media (max-width:420px){.dpad{grid-template-columns:repeat(3,36px);grid-template-rows:repeat(3,36px);gap:4px}.dpad-btn{font-size:16px}.joystick{width:110px;height:110px}}