:root{--color-bg: #0d0015;--color-surface: #1a0030;--color-surface-alt: #26004a;--color-neon-pink: #ff2d78;--color-neon-cyan: #00e5ff;--color-neon-yellow: #ffe600;--color-neon-green: #39ff14;--color-text-primary: #ffffff;--color-text-secondary: #b388ff;--color-text-muted: #7c4dff;--thumb-blue: #0044cc;--thumb-green: #006622;--thumb-red: #cc0022;--thumb-purple: #6a00cc;--font-pixel: "Press Start 2P", "Courier New", monospace;--space-xs: 4px;--space-sm: 8px;--space-md: 16px;--space-lg: 32px;--space-xl: 64px;--border-neon: 2px solid var(--color-neon-cyan);--glow-cyan: 0 0 8px var(--color-neon-cyan), 0 0 20px var(--color-neon-cyan);--glow-pink: 0 0 8px var(--color-neon-pink), 0 0 20px var(--color-neon-pink);--glow-yellow: 0 0 8px var(--color-neon-yellow), 0 0 16px var(--color-neon-yellow);--header-height: 60px;--card-width: 240px}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{font-size:16px;scroll-behavior:smooth}body{background-color:var(--color-bg);background-image:repeating-linear-gradient(0deg,transparent,transparent 2px,rgba(0,0,0,.15) 2px,rgba(0,0,0,.15) 4px);color:var(--color-text-primary);font-family:var(--font-pixel);min-height:100vh;line-height:1.6}.site-header{position:fixed;top:0;left:0;right:0;height:var(--header-height);background-color:var(--color-surface);border-bottom:2px solid var(--color-neon-pink);box-shadow:var(--glow-pink);z-index:100}.header-inner{display:flex;align-items:center;justify-content:space-between;height:100%;padding:0 var(--space-lg);max-width:1200px;margin:0 auto}.logo{font-size:.85rem;color:var(--color-neon-yellow);text-shadow:var(--glow-yellow);cursor:pointer;letter-spacing:2px;-webkit-user-select:none;user-select:none;transition:color .15s,text-shadow .15s}.logo:hover{color:var(--color-neon-pink);text-shadow:var(--glow-pink)}.main-nav{display:flex;gap:var(--space-sm)}.nav-btn{background:transparent;border:var(--border-neon);color:var(--color-neon-cyan);font-family:var(--font-pixel);font-size:.65rem;padding:var(--space-sm) var(--space-md);cursor:pointer;letter-spacing:1px;text-shadow:0 0 6px var(--color-neon-cyan);transition:background-color .15s,box-shadow .15s,color .15s}.nav-btn:hover,.nav-btn:focus-visible{background-color:var(--color-neon-cyan);color:var(--color-bg);box-shadow:var(--glow-cyan);outline:none}.app-root{padding-top:calc(var(--header-height) + var(--space-lg));min-height:100vh}.view{display:none;animation:fadeIn .25s ease-in}.view.active{display:block}@keyframes fadeIn{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.page-title{text-align:center;font-size:1.1rem;color:var(--color-neon-yellow);text-shadow:var(--glow-yellow);margin-bottom:var(--space-xl);letter-spacing:4px}.game-grid{display:flex;flex-wrap:wrap;gap:var(--space-lg);justify-content:center;padding:0 var(--space-lg) var(--space-xl);max-width:900px;margin:0 auto}.game-card{width:var(--card-width);background-color:var(--color-surface);border:2px solid var(--color-neon-cyan);box-shadow:var(--glow-cyan),inset 0 0 20px #00e5ff0a;display:flex;flex-direction:column;align-items:center;cursor:pointer;transition:transform .15s,box-shadow .15s,border-color .15s;clip-path:polygon(0 0,calc(100% - 20px) 0,100% 20px,100% 100%,0 100%)}.game-card:hover,.game-card:focus-visible{transform:translateY(-6px) scale(1.03);border-color:var(--color-neon-pink);box-shadow:var(--glow-pink),inset 0 0 20px #ff2d7814;outline:none}.card-thumbnail{width:100%;height:130px;display:flex;align-items:center;justify-content:center;font-size:3rem;position:relative;overflow:hidden}.card-thumbnail:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background-image:linear-gradient(rgba(0,0,0,.1) 1px,transparent 1px),linear-gradient(90deg,rgba(0,0,0,.1) 1px,transparent 1px);background-size:8px 8px}.thumbnail--blue{background-color:var(--thumb-blue)}.thumbnail--green{background-color:var(--thumb-green)}.thumbnail--red{background-color:var(--thumb-red)}.thumbnail--purple{background-color:var(--thumb-purple)}.canvas-wrapper.game-active .canvas-placeholder-text{display:none}.canvas-wrapper.game-active>#game-canvas{display:none}.canvas-wrapper canvas{max-width:100%;max-height:100%}.card-body{padding:var(--space-md) var(--space-sm) var(--space-sm);text-align:center;flex:1}.card-title{font-size:.6rem;color:var(--color-text-primary);line-height:1.8;margin-bottom:var(--space-xs);letter-spacing:1px}.card-genre{font-size:.45rem;color:var(--color-text-secondary);letter-spacing:2px}.card-best{margin-top:var(--space-sm);font-size:.45rem;color:var(--color-neon-green);text-shadow:0 0 6px var(--color-neon-green);letter-spacing:2px}.btn-play{width:100%;background-color:var(--color-neon-pink);border:none;color:var(--color-bg);font-family:var(--font-pixel);font-size:.6rem;padding:var(--space-md);cursor:pointer;letter-spacing:2px;transition:background-color .15s,box-shadow .15s}.btn-play:hover,.btn-play:focus-visible{background-color:var(--color-neon-yellow);box-shadow:var(--glow-yellow);outline:none}.game-view-inner{display:flex;flex-direction:column;align-items:center;gap:var(--space-lg);padding:var(--space-md) var(--space-lg) var(--space-xl);max-width:900px;margin:0 auto}.btn-back{align-self:flex-start;background:transparent;border:2px solid var(--color-neon-yellow);color:var(--color-neon-yellow);font-family:var(--font-pixel);font-size:.55rem;padding:var(--space-sm) var(--space-md);cursor:pointer;letter-spacing:1px;transition:background-color .15s,color .15s,box-shadow .15s}.btn-back:hover,.btn-back:focus-visible{background-color:var(--color-neon-yellow);color:var(--color-bg);box-shadow:var(--glow-yellow);outline:none}.game-view-title{font-size:1rem;color:var(--color-neon-cyan);text-shadow:var(--glow-cyan);letter-spacing:3px;text-align:center}.canvas-wrapper{position:relative;width:100%;max-width:800px;aspect-ratio:8 / 5;border:2px solid var(--color-neon-pink);box-shadow:var(--glow-pink);background-color:#000;display:flex;align-items:center;justify-content:center}#game-canvas{width:100%;height:100%;display:block;image-rendering:pixelated;image-rendering:crisp-edges}.canvas-placeholder-text{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;font-size:.55rem;color:var(--color-text-muted);letter-spacing:2px;pointer-events:none}#js-touch-controls{display:none}.touch-enabled #js-touch-controls{display:flex;justify-content:space-between;align-items:flex-end;position:fixed;left:0;right:0;bottom:0;padding:12px 18px calc(12px + env(safe-area-inset-bottom,0px));gap:12px;z-index:200;pointer-events:none}.touch-left,.touch-right{display:flex;align-items:flex-end;gap:12px;pointer-events:none}.touch-btn{pointer-events:auto;touch-action:none;user-select:none;-webkit-user-select:none;-webkit-tap-highlight-color:transparent;width:60px;height:60px;border-radius:12px;background:#1a0030b8;border:2px solid var(--color-neon-cyan);color:var(--color-neon-cyan);font-family:var(--font-pixel);font-size:.7rem;display:flex;align-items:center;justify-content:center;box-shadow:0 0 8px #00e5ff80}.touch-btn.is-down{background:var(--color-neon-cyan);color:var(--color-bg)}.btn-action{width:92px;height:92px;font-size:.55rem;border-color:var(--color-neon-pink);color:var(--color-neon-pink);box-shadow:0 0 8px #ff2d7899}.btn-action.is-down{background:var(--color-neon-pink);color:var(--color-bg)}.btn-restart{width:50px;height:50px;font-size:.9rem;border-color:var(--color-neon-yellow);color:var(--color-neon-yellow)}.btn-restart.is-down{background:var(--color-neon-yellow);color:var(--color-bg)}.dpad{display:flex;flex-direction:column;align-items:center;gap:8px;pointer-events:none}.dpad-row{display:flex;gap:56px;pointer-events:none}.touch-enabled .game-view-inner{padding-bottom:130px}.canvas-wrapper{touch-action:none}@media (max-width: 600px){.logo{font-size:.6rem}.page-title{font-size:.75rem}.game-grid{gap:var(--space-md)}.game-card{width:90%;max-width:320px}.btn-back{font-size:.45rem}.game-view-title{font-size:.7rem}}@media (max-width: 380px){.header-inner{padding:0 var(--space-md)}.logo{font-size:.5rem}}@media (prefers-reduced-motion: reduce){.view{animation:none}.game-card,.btn-play,.btn-back,.nav-btn{transition:none}}