:root{--color-bg: #1a1a2e;--color-bg-surface: #16213e;--color-bg-card: #0f3460;--color-accent: #e94560;--color-accent-alt: #f5a623;--color-text: #eaeaea;--color-text-muted: #9aaabb;--color-border: #2a3a5c;--color-success: #4caf50;--color-danger: #e94560;--color-warning: #f5a623;--space-xs: 4px;--space-sm: 8px;--space-md: 16px;--space-lg: 24px;--space-xl: 32px;--space-2xl: 48px;--radius-sm: 6px;--radius-md: 12px;--radius-lg: 20px;--radius-full: 999px;--font-sans: "Segoe UI", system-ui, -apple-system, sans-serif;--font-mono: "Courier New", monospace;--text-xs: 12px;--text-sm: 14px;--text-md: 16px;--text-lg: 20px;--text-xl: 24px;--text-2xl: 32px;--text-3xl: 40px;--shadow-sm: 0 2px 8px rgba(0,0,0,.3);--shadow-md: 0 4px 16px rgba(0,0,0,.4);--shadow-lg: 0 8px 32px rgba(0,0,0,.5);--transition-fast: .12s ease;--transition-md: .24s ease;--safe-top: env(safe-area-inset-top, 0px);--safe-bottom: env(safe-area-inset-bottom, 0px);--safe-left: env(safe-area-inset-left, 0px);--safe-right: env(safe-area-inset-right, 0px)}@media (prefers-color-scheme: light){:root{--color-bg: #f0f4ff;--color-bg-surface: #e0e8ff;--color-bg-card: #c8d8ff;--color-text: #1a1a2e;--color-text-muted: #4a5a7c;--color-border: #b0c0e0}}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html,body{height:100%;width:100%;overflow:hidden;font-family:var(--font-sans);font-size:var(--text-md);color:var(--color-text);background:var(--color-bg);-webkit-font-smoothing:antialiased;touch-action:manipulation;user-select:none;-webkit-user-select:none}#app{width:100%;height:100%;display:flex;flex-direction:column;padding-top:var(--safe-top);padding-bottom:var(--safe-bottom);padding-left:var(--safe-left);padding-right:var(--safe-right)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-sm);min-height:44px;min-width:44px;padding:var(--space-sm) var(--space-lg);border:none;border-radius:var(--radius-md);font-family:var(--font-sans);font-size:var(--text-md);font-weight:600;cursor:pointer;transition:transform var(--transition-fast),opacity var(--transition-fast);-webkit-tap-highlight-color:transparent}.btn:active{transform:scale(.95);opacity:.85}.btn-primary{background:var(--color-accent);color:#fff}.btn-secondary{background:var(--color-bg-card);color:var(--color-text);border:1px solid var(--color-border)}.btn-ghost{background:transparent;color:var(--color-text-muted)}#game-root{width:100%;height:100%;position:relative;overflow:hidden}.visually-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important}}.portal{display:flex;flex-direction:column;height:100%;overflow-y:auto;-webkit-overflow-scrolling:touch}.portal-header{padding:var(--space-xl) var(--space-md) var(--space-md);text-align:center;background:var(--color-bg-surface);border-bottom:1px solid var(--color-border);flex-shrink:0}.portal-titulo{font-size:var(--text-2xl);font-weight:800;letter-spacing:-.5px}.portal-subtitulo{font-size:var(--text-sm);color:var(--color-text-muted);margin-top:var(--space-xs)}.portal-grid{display:flex;flex-direction:column;gap:var(--space-sm);padding:var(--space-md);overflow-y:auto;flex:1}.game-card{display:flex;align-items:center;gap:var(--space-md);padding:var(--space-md);background:var(--color-bg-card);border:1px solid var(--color-border);border-radius:var(--radius-lg);cursor:pointer;transition:transform var(--transition-fast),box-shadow var(--transition-fast);-webkit-tap-highlight-color:transparent;outline:none}.game-card:focus-visible{box-shadow:0 0 0 3px var(--color-accent)}.game-card:active{transform:scale(.97)}.game-card-icone{font-size:44px;line-height:1;flex-shrink:0;width:56px;text-align:center}.game-card-info{flex:1;min-width:0}.game-card-nome{font-size:var(--text-lg);font-weight:700;margin-bottom:var(--space-xs)}.game-card-desc{font-size:var(--text-sm);color:var(--color-text-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.game-card-seta{font-size:var(--text-lg);color:var(--color-accent);flex-shrink:0}#game-root{width:100%;height:100%;position:relative;overflow:hidden;background:#000}#game-root canvas{display:block;margin:0 auto}