:root{--color-primary-50: #eff6ff;--color-primary-100: #dbeafe;--color-primary-200: #bfdbfe;--color-primary-300: #93c5fd;--color-primary-400: #60a5fa;--color-primary-500: #3b82f6;--color-primary-600: #2563eb;--color-primary-700: #1d4ed8;--color-primary-800: #1e40af;--color-primary-900: #1e3a8a;--color-brand-indigo: #4f46e5;--color-brand-blue: #0593fc;--color-brand-royal: #0182fc;--color-secondary-50: #ecfeff;--color-secondary-100: #cffafe;--color-secondary-200: #a5f3fc;--color-secondary-300: #67e8f9;--color-secondary-400: #22d3ee;--color-secondary-500: #06b6d4;--color-secondary-600: #0891b2;--color-secondary-700: #0e7490;--color-secondary-800: #155e75;--color-secondary-900: #164e63;--color-teal: #4ecdc4;--color-cyan: #45b7d1;--color-neon-cyan: #00f5ff;--color-bright-cyan: #4facfe;--color-accent-50: #fef2f2;--color-accent-100: #fee2e2;--color-accent-200: #fecaca;--color-accent-300: #fca5a5;--color-accent-400: #f87171;--color-accent-500: #ef4444;--color-accent-600: #dc2626;--color-accent-700: #b91c1c;--color-accent-800: #991b1b;--color-accent-900: #7f1d1d;--color-red-vibrant: #fd4755;--color-red-dark: #fb2b3a;--color-red-deeper: #e41f2d;--color-success-50: #f0fdf4;--color-success-100: #dcfce7;--color-success-200: #bbf7d0;--color-success-300: #86efac;--color-success-400: #4ade80;--color-success-500: #22c55e;--color-success-600: #16a34a;--color-success-700: #15803d;--color-success-800: #166534;--color-success-900: #14532d;--color-green-fresh: #97d729;--color-green-dark: #8bc727;--color-warning-50: #fffbeb;--color-warning-100: #fef3c7;--color-warning-200: #fde68a;--color-warning-300: #fcd34d;--color-warning-400: #fbbf24;--color-warning-500: #f59e0b;--color-warning-600: #d97706;--color-warning-700: #b45309;--color-warning-800: #92400e;--color-warning-900: #78350f;--color-yellow-golden: #ffd15b;--color-orange-warm: #fe7701;--color-orange-dark: #f46700;--color-orange-muted: #fdb441;--color-royal-50: #faf5ff;--color-royal-100: #f3e8ff;--color-royal-200: #e9d5ff;--color-royal-300: #d8b4fe;--color-royal-400: #c084fc;--color-royal-500: #a855f7;--color-royal-600: #9333ea;--color-royal-700: #7c3aed;--color-royal-800: #6b21a8;--color-royal-900: #581c87;--color-purple-deep: #6354b1;--color-purple-darker: #54469c;--color-neutral-50: #f8fafc;--color-neutral-100: #f1f5f9;--color-neutral-200: #e2e8f0;--color-neutral-300: #cbd5e1;--color-neutral-400: #94a3b8;--color-neutral-500: #64748b;--color-neutral-600: #475569;--color-neutral-700: #334155;--color-neutral-800: #1e293b;--color-neutral-900: #0f172a;--color-dark-bg: #0a0a0f;--color-dark-surface: #1a1a2e;--color-background-primary: var(--color-neutral-50);--color-background-secondary: var(--color-neutral-100);--color-background-card: #ffffff;--color-background-overlay: rgba(255, 255, 255, .95);--color-background-soft: var(--color-primary-50);--color-text-primary: var(--color-neutral-800);--color-text-secondary: var(--color-neutral-600);--color-text-muted: var(--color-neutral-500);--color-text-on-dark: #ffffff;--color-text-on-color: #ffffff;--color-border-light: var(--color-neutral-200);--color-border-medium: var(--color-neutral-300);--color-border-strong: var(--color-neutral-400);--color-button-primary: var(--color-brand-indigo);--color-button-primary-hover: var(--color-primary-700);--color-button-secondary: var(--color-neutral-600);--color-button-secondary-hover: var(--color-neutral-700);--color-button-success: var(--color-green-fresh);--color-button-success-hover: var(--color-success-700);--color-button-danger: var(--color-red-vibrant);--color-button-danger-hover: var(--color-red-dark);--color-button-warning: var(--color-orange-warm);--color-button-warning-hover: var(--color-warning-700);--color-link: var(--color-brand-blue);--color-link-hover: var(--color-primary-700);--color-focus: var(--color-brand-indigo);--color-selection: var(--color-primary-100);--color-status-info: var(--color-brand-blue);--color-status-success: var(--color-green-fresh);--color-status-warning: var(--color-orange-warm);--color-status-error: var(--color-red-vibrant);--gradient-primary: linear-gradient(135deg, var(--color-teal), var(--color-cyan));--gradient-secondary: linear-gradient(135deg, var(--color-brand-blue), var(--color-brand-indigo));--gradient-accent: linear-gradient(135deg, var(--color-orange-warm), var(--color-red-vibrant));--gradient-success: linear-gradient(135deg, var(--color-green-fresh), var(--color-secondary-600));--gradient-royal: linear-gradient(135deg, var(--color-purple-deep), var(--color-brand-indigo));--gradient-sunset: linear-gradient(135deg, var(--color-yellow-golden), var(--color-orange-warm), var(--color-red-vibrant));--gradient-ocean: linear-gradient(135deg, var(--color-bright-cyan), var(--color-brand-blue), var(--color-purple-deep));--gradient-main: linear-gradient(135deg, var(--color-teal), var(--color-cyan));--gradient-dark: linear-gradient(135deg, var(--color-neutral-900), var(--color-neutral-800));--gradient-dark-accent: linear-gradient(135deg, var(--color-dark-bg), var(--color-dark-surface));--shadow-sm: 0 1px 2px rgba(0, 0, 0, .05);--shadow-md: 0 4px 6px rgba(0, 0, 0, .07);--shadow-lg: 0 10px 15px rgba(0, 0, 0, .1);--shadow-xl: 0 20px 25px rgba(0, 0, 0, .1);--shadow-2xl: 0 25px 50px rgba(0, 0, 0, .25);--shadow-primary: 0 10px 15px rgba(79, 70, 229, .15);--shadow-secondary: 0 10px 15px rgba(5, 147, 252, .15);--shadow-accent: 0 10px 15px rgba(253, 71, 85, .15);--shadow-success: 0 10px 15px rgba(151, 215, 41, .15);--shadow-warning: 0 10px 15px rgba(254, 119, 1, .15);--glow-primary: 0 0 20px rgba(79, 70, 229, .3);--glow-secondary: 0 0 20px rgba(5, 147, 252, .3);--glow-accent: 0 0 20px rgba(253, 71, 85, .3);--glow-neon: 0 0 20px rgba(0, 245, 255, .6);--solitaire-card-bg: #ffffff;--solitaire-card-border: var(--color-border-light);--solitaire-red-suit: var(--color-red-vibrant);--solitaire-black-suit: var(--color-neutral-800);--solitaire-highlight: var(--color-primary-100);--solitaire-foundation: var(--color-background-soft);--snake-bg: var(--color-dark-bg);--snake-surface: var(--color-dark-surface);--snake-grid: rgba(79, 172, 254, .1);--snake-body: var(--color-brand-blue);--snake-head: var(--color-neon-cyan);--snake-food: #ff0080;--snake-accent: var(--color-bright-cyan);--snake-glow: var(--glow-neon);--tetris-block-i: var(--color-neon-cyan);--tetris-block-o: var(--color-yellow-golden);--tetris-block-t: var(--color-purple-deep);--tetris-block-s: var(--color-green-fresh);--tetris-block-z: var(--color-red-vibrant);--tetris-block-j: var(--color-brand-blue);--tetris-block-l: var(--color-orange-warm);--mine-flag: var(--color-red-vibrant);--mine-number-1: var(--color-brand-blue);--mine-number-2: var(--color-green-fresh);--mine-number-3: var(--color-red-vibrant);--mine-number-4: var(--color-purple-deep);--mine-number-5: var(--color-orange-warm);--mine-revealed: var(--color-background-secondary);--mine-hidden: var(--color-neutral-300);--tile-2: #eee4da;--tile-4: #ede0c8;--tile-8: var(--color-orange-muted);--tile-16: var(--color-orange-warm);--tile-32: var(--color-red-vibrant);--tile-64: var(--color-red-dark);--tile-128: var(--color-yellow-golden);--tile-256: var(--color-warning-500);--tile-512: var(--color-warning-600);--tile-1024: var(--color-warning-700);--tile-2048: var(--color-warning-800)}:root{--solitaire-gradient-start: #667eea;--solitaire-gradient-end: #764ba2;--solitaire-primary: #667eea;--2048-gradient-start: #f59e0b;--2048-gradient-end: #f97316;--2048-primary: #f59e0b;--minesweeper-gradient-start: #64748b;--minesweeper-gradient-end: #475569;--minesweeper-primary: #64748b;--snake-gradient-start: #10b981;--snake-gradient-end: #059669;--snake-primary: #10b981;--sudoku-gradient-start: #3b82f6;--sudoku-gradient-end: #2563eb;--sudoku-primary: #3b82f6;--tetris-gradient-start: #06b6d4;--tetris-gradient-end: #0891b2;--tetris-primary: #06b6d4;--blockdestroyer-gradient-start: #ec4899;--blockdestroyer-gradient-end: #db2777;--blockdestroyer-primary: #ec4899;--sort-puzzle-gradient-start: #fb923c;--sort-puzzle-gradient-end: #f97316;--sort-puzzle-primary: #fb923c}body.solitaire{background:linear-gradient(135deg,var(--solitaire-gradient-start) 0%,var(--solitaire-gradient-end) 100%)}body.game-2048{background:linear-gradient(135deg,var(--2048-gradient-start) 0%,var(--2048-gradient-end) 100%)}body.minesweeper{background:linear-gradient(135deg,var(--minesweeper-gradient-start) 0%,var(--minesweeper-gradient-end) 100%)}body.snake{background:linear-gradient(135deg,var(--snake-gradient-start) 0%,var(--snake-gradient-end) 100%)}body.sudoku{background:linear-gradient(135deg,var(--sudoku-gradient-start) 0%,var(--sudoku-gradient-end) 100%)}body.tetris{background:linear-gradient(135deg,var(--tetris-gradient-start) 0%,var(--tetris-gradient-end) 100%)}body.blockdestroyer{background:linear-gradient(135deg,var(--blockdestroyer-gradient-start) 0%,var(--blockdestroyer-gradient-end) 100%)}body.sort-puzzle{background:linear-gradient(135deg,var(--sort-puzzle-gradient-start) 0%,var(--sort-puzzle-gradient-end) 100%)}body.solitaire.immersive-mode{background:radial-gradient(circle at 25% 25%,rgba(102,126,234,.15) 0%,transparent 40%),radial-gradient(circle at 75% 75%,rgba(118,75,162,.1) 0%,transparent 40%),linear-gradient(135deg,#1a1a2e,#0f0f1e)}body.game-2048.immersive-mode{background:radial-gradient(circle at 25% 25%,rgba(245,158,11,.15) 0%,transparent 40%),radial-gradient(circle at 75% 75%,rgba(249,115,22,.1) 0%,transparent 40%),linear-gradient(135deg,#1a1a2e,#0f0f1e)}body.minesweeper.immersive-mode{background:radial-gradient(circle at 25% 25%,rgba(100,116,139,.15) 0%,transparent 40%),radial-gradient(circle at 75% 75%,rgba(71,85,105,.1) 0%,transparent 40%),linear-gradient(135deg,#1a1a2e,#0f0f1e)}body.snake.immersive-mode{background:radial-gradient(circle at 25% 25%,rgba(16,185,129,.15) 0%,transparent 40%),radial-gradient(circle at 75% 75%,rgba(5,150,105,.1) 0%,transparent 40%),linear-gradient(135deg,#1a1a2e,#0f0f1e)}body.sudoku.immersive-mode{background:radial-gradient(circle at 25% 25%,rgba(59,130,246,.15) 0%,transparent 40%),radial-gradient(circle at 75% 75%,rgba(37,99,235,.1) 0%,transparent 40%),linear-gradient(135deg,#1a1a2e,#0f0f1e)}body.tetris.immersive-mode{background:radial-gradient(circle at 25% 25%,rgba(6,182,212,.15) 0%,transparent 40%),radial-gradient(circle at 75% 75%,rgba(8,145,178,.1) 0%,transparent 40%),linear-gradient(135deg,#1a1a2e,#0f0f1e)}body.blockdestroyer.immersive-mode{background:radial-gradient(circle at 25% 25%,rgba(236,72,153,.15) 0%,transparent 40%),radial-gradient(circle at 75% 75%,rgba(219,39,119,.1) 0%,transparent 40%),linear-gradient(135deg,#1a1a2e,#0f0f1e)}body.sort-puzzle.immersive-mode{background:radial-gradient(circle at 25% 25%,rgba(251,146,60,.15) 0%,transparent 40%),radial-gradient(circle at 75% 75%,rgba(249,115,22,.1) 0%,transparent 40%),linear-gradient(135deg,#1a1a2e,#0f0f1e)}body.immersive-mode{margin:0;padding:0;overflow:hidden;height:100vh;display:flex;flex-direction:column}#header-container.immersive{width:100%;padding:0;margin:0;background:#0009;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:1px solid rgba(255,255,255,.1)}#ui-panel.immersive{max-width:100%;background:transparent;border:none;border-radius:0;padding:8px 20px;grid-template-columns:auto 1fr auto;gap:20px}.immersive .logo-title h1{font-size:1.2rem;color:#fff}.immersive .logo{width:28px;height:28px}.immersive .game-controls{gap:8px}.immersive .score-stats{gap:20px}.immersive .stat-label{color:#ffffffb3}.immersive .stat-value,.immersive .timer-value{color:#fff}.instructions-link{display:flex;align-items:center;gap:6px;color:#fffc;text-decoration:none;font-size:14px;padding:6px 12px;border-radius:6px;transition:all .2s ease;background:#ffffff1a}.instructions-link:hover{background:#fff3;color:#fff}#game-container.immersive{flex:1;max-width:100%;width:100%;height:calc(100vh - 60px);margin:0;padding:20px;background:transparent;border:none;border-radius:0;box-shadow:none;display:flex;flex-direction:column;align-items:center;justify-content:center;-webkit-backdrop-filter:none;backdrop-filter:none;overflow:hidden;box-sizing:border-box}#game-container.immersive #game-canvas{margin:0 auto;display:block}#game-container.immersive .game-instructions{display:none}.immersive .btn-primary,.immersive .btn-secondary{background:#ffffff26;color:#fff;border:1px solid rgba(255,255,255,.2)}.immersive .btn-primary:hover,.immersive .btn-secondary:hover{background:#ffffff40}.immersive .btn-primary{background:#3b82f6cc;border:1px solid rgba(59,130,246,.9)}.immersive .btn-primary:hover{background:#3b82f6}@media (max-width: 768px){#ui-panel.immersive{grid-template-columns:1fr;padding:8px 12px}.immersive .ui-panel-row-1{display:flex!important;justify-content:space-between!important;align-items:center!important;width:100%!important;margin-bottom:8px!important;border-bottom:1px solid rgba(255,255,255,.1)!important;padding-bottom:8px}.immersive .logo-title h1{font-size:1rem}.immersive .score-stats{justify-content:space-between;width:100%;gap:10px}#game-container.immersive{padding:10px;height:calc(100vh - 100px)}.instructions-link{font-size:12px;padding:4px 8px}}@media (max-width: 480px){#ui-panel.immersive{padding:6px 10px}.immersive .logo-title h1{font-size:.9rem}.immersive .stat-value{font-size:16px!important}.immersive .stat-label{font-size:9px!important}}body.immersive-mode .game-feedback-container{position:fixed;bottom:20px;right:20px;max-width:265px;border:1px solid rgba(255,255,255,.1);z-index:100;display:none;transition:opacity .3s ease,transform .3s ease}body.immersive-mode .game-feedback-container.visible{display:block;animation:fadeInUp .3s ease forwards}@keyframes fadeInUp{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}#feedback-toggle-btn{display:none}body.immersive-mode #feedback-toggle-btn{display:flex;position:fixed;bottom:20px;right:20px;width:56px;height:56px;border-radius:50%;background:#3b82f6e6;border:2px solid rgba(255,255,255,.2);color:#fff;font-size:24px;cursor:pointer;box-shadow:0 4px 12px #0000004d;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);z-index:99;align-items:center;justify-content:center;transition:all .2s ease}body.immersive-mode #feedback-toggle-btn:hover{background:#3b82f6;transform:scale(1.05);box-shadow:0 6px 16px #0006}body.immersive-mode #feedback-toggle-btn:active{transform:scale(.95)}body.immersive-mode .game-feedback-container.visible~#feedback-toggle-btn{bottom:180px}@media (max-width: 768px){body.immersive-mode .game-feedback-container{bottom:10px;right:10px;left:10px;max-width:none;padding:8px 12px}body.immersive-mode #feedback-toggle-btn{width:48px;height:48px;font-size:20px;bottom:15px;right:15px}body.immersive-mode .game-feedback-container.visible~#feedback-toggle-btn{bottom:160px}}@media (max-width: 480px){body.immersive-mode .game-feedback-container{bottom:5px;right:5px;left:5px;padding:6px 10px}body.immersive-mode #feedback-toggle-btn{width:44px;height:44px;font-size:18px;bottom:10px;right:10px}body.immersive-mode .game-feedback-container.visible~#feedback-toggle-btn{bottom:150px}}