*{margin: 0;padding: 0;box-sizing: border-box}body{font-family: 'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Oxygen,Ubuntu,Cantarell,sans-serif;line-height: 1.6;color: #2d3748;background-color: #f7fafc;min-height: 100vh}#app{min-height: 100vh;display: flex;flex-direction: column}header{background: #ffffff;box-shadow: 0 1px 3px 0 rgba(0,0,0,0.1),0 1px 2px 0 rgba(0,0,0,0.06);padding: 1rem 0;position: sticky;top: 0;z-index: 100}nav{max-width: 1200px;margin: 0 auto;display: flex;justify-content: space-between;align-items: center;padding: 0 2rem}.logo{font-size: 1.5rem;font-weight: 800;color: #4a5568;letter-spacing: -0.025em}.nav-links{display: flex;gap: 2rem}.nav-link{text-decoration: none;color: #4a5568;font-weight: 500;transition: color 0.2s ease}.nav-link:hover{color: #2b6cb0}main{flex: 1;max-width: 1200px;margin: 0 auto;padding: 2rem;width: 100%}.hero{text-align: center;margin-bottom: 3rem;color: #2d3748}.hero h1{font-size: 3rem;font-weight: 800;margin-bottom: 1rem;letter-spacing: -0.025em}.hero p{font-size: 1.2rem;color: #718096;max-width: 600px;margin: 0 auto}.games-grid{display: grid;grid-template-columns: repeat(auto-fit,minmax(300px,1fr));gap: 2rem;margin-top: 2rem}.game-card{background: #ffffff;border-radius: 8px;padding: 2rem;text-align: center;transition: all 0.2s ease-in-out;cursor: pointer;border: 1px solid #e2e8f0;box-shadow: 0 1px 3px 0 rgba(0,0,0,0.1),0 1px 2px 0 rgba(0,0,0,0.06)}.game-card:hover{transform: translateY(-2px);box-shadow: 0 4px 6px -1px rgba(0,0,0,0.1),0 2px 4px -1px rgba(0,0,0,0.06);border-color: #cbd5e0}.game-icon{font-size: 3rem;margin-bottom: 1rem}.game-card h3{color: #2d3748;margin-bottom: 0.5rem;font-size: 1.25rem;font-weight: 600}.game-card p{color: #718096;margin-bottom: 1.5rem}.game-container{background: #ffffff;border-radius: 8px;padding: 2rem;text-align: center;margin: 0 auto;max-width: 800px;border: 1px solid #e2e8f0;box-shadow: 0 1px 3px 0 rgba(0,0,0,0.1),0 1px 2px 0 rgba(0,0,0,0.06)}.game-header{display: flex;justify-content: space-between;align-items: center;margin-bottom: 2rem;padding-bottom: 1rem;border-bottom: 1px solid #e2e8f0}.back-button{background: #edf2f7;color: #4a5568;border: none;padding: 0.5rem 1rem;border-radius: 6px;cursor: pointer;font-weight: 500;transition: background 0.2s ease}.back-button:hover{background: #e2e8f0}.game-title{color: #2d3748;font-size: 1.5rem;font-weight: 700;margin: 0}.game-score{background: #ebf8ff;color: #2b6cb0;padding: 0.5rem 1rem;border-radius: 6px;font-weight: 600}canvas{border: 2px solid #2d3748;border-radius: 4px;margin: 1rem 0;background: #000;box-shadow: 0 4px 6px -1px rgba(0,0,0,0.1)}.game-controls{margin-top: 1.5rem;color: #718096}.control-btn,.btn-primary,.btn-secondary{padding: 0.5rem 1rem;border-radius: 6px;font-weight: 500;cursor: pointer;transition: all 0.2s ease;border: none;margin: 0 0.25rem}.btn-primary{background-color: #4299e1;color: white}.btn-primary:hover{background-color: #3182ce}.btn-secondary{background-color: #edf2f7;color: #4a5568}.btn-secondary:hover{background-color: #e2e8f0}.diff-btn{background: #fff;border: 1px solid #e2e8f0;padding: 0.25rem 0.75rem;border-radius: 4px;margin: 0 0.25rem;cursor: pointer}.diff-btn.active{background: #4299e1;color: white;border-color: #4299e1}footer{background: #ffffff;text-align: center;padding: 2rem;color: #718096;border-top: 1px solid #e2e8f0;margin-top: auto}@media (max-width: 768px){nav{padding: 0 1rem}.logo{font-size: 1.25rem}.nav-links{gap: 1rem}.hero h1{font-size: 2rem}.games-grid{grid-template-columns: 1fr;gap: 1rem}main{padding: 1rem}.game-header{flex-direction: column;gap: 1rem;text-align: center}}.fade-in{animation: fadeIn 0.3s ease-out}@keyframes fadeIn{from{opacity: 0;transform: translateY(10px)}to{opacity: 1;transform: translateY(0)}}.promo-container{margin: 20px 0;text-align: center;background-color: #f7fafc;border: 1px solid #e2e8f0;border-radius: 8px;padding: 10px;position: relative}.promo-container::before{content: "Advertisement";position: absolute;top: 5px;left: 10px;font-size: 10px;color: #a0aec0;text-transform: uppercase}
*{margin: 0;padding: 0;box-sizing: border-box}body{font-family: -apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Oxygen,Ubuntu,Cantarell,sans-serif;line-height: 1.6;color: var(--color-text-primary,#333);background: var(--color-bg-primary,#ffffff);min-height: 100vh}#app{min-height: 100vh;display: flex;flex-direction: column}.fade-in{animation: fadeIn 0.5s ease-in}@keyframes fadeIn{from{opacity: 0;transform: translateY(20px)}to{opacity: 1;transform: translateY(0)}}header{background: var(--color-bg-primary,#ffffff);padding: 1.5rem 0 1rem 0;border-bottom: 1px solid var(--color-border-primary,#e0e0e0)}.hero-section{max-width: 900px;margin: 0 auto;padding: 0 2rem;text-align: center}.site-title{font-size: 2rem;font-weight: bold;background: linear-gradient(45deg,#667eea,#764ba2,#ff6b6b);-webkit-background-clip: text;-webkit-text-fill-color: transparent;background-clip: text;margin-bottom: 0.75rem;text-shadow: 2px 2px 4px rgba(0,0,0,0.1)}.typewriter-container{font-family: -apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Oxygen,Ubuntu,Cantarell,sans-serif;font-size: 1.25rem;color: var(--color-text-primary,#333);padding: 0;margin: 0 auto;max-width: 800px;text-align: center;font-weight: 500}.prompt-prefix{display: none}.typewriter-text{color: var(--color-text-primary,#333)}.cursor{color: var(--color-text-primary,#333);animation: blink 1s infinite;font-weight: normal}@keyframes blink{0%,50%{opacity: 1}51%,100%{opacity: 0}}nav{max-width: 1200px;margin: 0 auto;display: flex;justify-content: space-between;align-items: center;padding: 0 2rem}.logo{font-size: 2rem;font-weight: bold;background: linear-gradient(45deg,#667eea,#764ba2);-webkit-background-clip: text;-webkit-text-fill-color: transparent;background-clip: text}.nav-links{display: flex;gap: 2rem}.nav-link{text-decoration: none;color: var(--color-text-primary,#333);font-weight: 500;transition: color 0.3s ease}.nav-link:hover{color: var(--color-primary,#667eea)}footer{margin-top: auto;background: var(--color-bg-primary,#ffffff);text-align: center;padding: 3rem 2rem;border-top: 1px solid var(--color-border-primary,#e0e0e0)}footer p{color: var(--color-text-secondary,#666);font-size: 0.9rem}main{flex: 1;padding: 3rem 2rem;max-width: 1200px;margin: 0 auto;width: 100%}.hero{text-align: center;padding: 3rem 0;background: var(--color-bg-primary,#ffffff);margin-bottom: 3rem}.hero h1{font-size: 3rem;font-weight: bold;margin-bottom: 1rem;color: var(--color-text-primary,#333)}.hero p{font-size: 1.2rem;color: var(--color-text-secondary,#666);max-width: 600px;margin: 0 auto}.games-grid{display: grid;grid-template-columns: repeat(auto-fill,minmax(180px,1fr));gap: 1.5rem;margin: 2rem 0 3rem 0;padding: 0}.game-card{background: var(--color-card-bg,#ffffff);border: 1px solid var(--color-card-border,#e0e0e0);border-radius: 8px;padding: 2rem 1.5rem;text-align: center;transition: transform 0.2s ease,box-shadow 0.2s ease,border-color 0.2s ease;cursor: pointer;display: flex;flex-direction: column;align-items: center;justify-content: center;min-height: 150px}.game-card h3{font-size: 1.1rem;margin: 0;color: var(--color-text-primary,#333);font-weight: 600}.game-desc{font-size: 0.85rem;color: var(--color-text-secondary,#777);margin-top: 0.5rem;line-height: 1.3;font-weight: 400}.game-container{background: var(--color-bg-elevated,rgba(255,255,255,0.95));backdrop-filter: blur(10px);border-radius: 12px;padding: 20px;margin: 0;position: relative;z-index: 10;border: 1px solid var(--color-border-primary,rgba(255,255,255,0.2))}.game-header{display: flex;justify-content: space-between;align-items: center;margin-bottom: 20px;padding-bottom: 15px;border-bottom: 2px solid var(--color-border-secondary,#eee)}.game-title{font-size: 2rem;font-weight: bold;color: var(--color-text-primary,#333)}.game-score{font-size: 1.2rem;font-weight: 600;color: var(--color-primary,#667eea)}.game-canvas{display: block;margin: 0 auto 20px auto;max-width: 100%;height: auto;border: 2px solid var(--color-canvas-border,#ddd);border-radius: 8px;background: var(--color-canvas-bg,#f8f9fa);box-shadow: var(--shadow-md,0 4px 15px rgba(0,0,0,0.1))}.canvas-container{display: flex;justify-content: center;margin-bottom: 20px}.canvas-container canvas{display: block;max-width: 100%;height: auto;border: 2px solid var(--color-canvas-border,#ddd);border-radius: 8px;background: var(--color-canvas-bg,#f8f9fa);box-shadow: var(--shadow-md,0 4px 15px rgba(0,0,0,0.1))}.controls{display: flex;gap: 15px;justify-content: center;flex-wrap: wrap;margin-top: 20px}.controls button{padding: 10px 20px;font-size: 1rem;border: none;border-radius: 8px;cursor: pointer;transition: all 0.3s ease;font-weight: 500}.btn-primary{background: linear-gradient(45deg,#667eea,#764ba2);color: white;box-shadow: 0 4px 15px rgba(102,126,234,0.4)}.btn-primary:hover{transform: translateY(-2px);box-shadow: 0 6px 20px rgba(102,126,234,0.6)}.btn-secondary{background: #6c757d;color: white}.btn-secondary:hover{background: #5a6268;transform: translateY(-1px)}.btn-success{background: #28a745;color: white}.btn-success:hover{background: #218838;transform: translateY(-1px)}.game-instructions{background: var(--color-bg-tertiary,rgba(255,255,255,0.8));padding: 15px;border-radius: 8px;margin-top: 20px;border-left: 4px solid var(--color-primary,#667eea)}.game-instructions h4{margin-bottom: 10px;color: var(--color-text-primary,#333)}.game-instructions p{margin: 5px 0;color: var(--color-text-secondary,#666);font-size: 0.9rem}.tetris-stats{display: flex;gap: 20px;flex-wrap: wrap}.tetris-stats>div{font-size: 1rem;font-weight: 600;color: #667eea}.tetris-game-area{display: flex;gap: 20px;justify-content: center;align-items: flex-start;margin: 20px 0}.tetris-next-piece{background: rgba(255,255,255,0.8);padding: 15px;border-radius: 8px;border-left: 4px solid #667eea;min-width: 150px}.tetris-next-piece h4{margin-bottom: 10px;color: #333;font-size: 1rem}#tetris-next-canvas{border: 1px solid #ddd;border-radius: 4px;background: #f8f9fa;display: block}#tetris-canvas{border: 2px solid #667eea;background: #000;box-shadow: 0 4px 15px rgba(102,126,234,0.3)}@media (max-width: 768px){.tetris-game-area{flex-direction: column;align-items: center}.tetris-stats{justify-content: center;text-align: center}.tetris-next-piece{margin-top: 15px;text-align: center}#tetris-canvas{}}.target-stats{display: flex;gap: 20px;flex-wrap: wrap}.target-stats>div{font-size: 1rem;font-weight: 600;color: #667eea}.space-stats{display: flex;gap: 20px;flex-wrap: wrap}.space-stats>div{font-size: 1rem;font-weight: 600;color: #667eea}.dice-stats{display: flex;gap: 20px;flex-wrap: wrap}.dice-stats>div{font-size: 1rem;font-weight: 600;color: #667eea}.dice-game-area{display: flex;gap: 20px;justify-content: center;align-items: flex-start;margin: 20px 0}.dice-controls{background: rgba(255,255,255,0.9);padding: 20px;border-radius: 8px;border-left: 4px solid #667eea;min-width: 200px}.dice-controls h4{margin-bottom: 10px;color: #333;font-size: 1rem}.bet-buttons,.prediction-buttons{display: flex;flex-wrap: wrap;gap: 8px;margin-bottom: 15px}.bet-btn,.pred-btn{padding: 8px 12px;border: 2px solid #667eea;background: white;color: #667eea;border-radius: 4px;cursor: pointer;font-size: 12px;transition: all 0.3s ease}.bet-btn:hover,.pred-btn:hover{background: #667eea;color: white}.bet-btn.active,.pred-btn.active{background: #667eea;color: white}.pong-stats{display: flex;gap: 20px;flex-wrap: wrap;justify-content: center}.pong-stats>div{font-size: 1rem;font-weight: 600;color: #667eea}.difficulty-controls{display: flex;gap: 10px;margin-bottom: 15px;justify-content: center}.diff-btn{padding: 8px 16px;border: 2px solid #667eea;background: white;color: #667eea;border-radius: 4px;cursor: pointer;font-size: 14px;transition: all 0.3s ease}.diff-btn:hover{background: #667eea;color: white}.diff-btn.active{background: #667eea;color: white}.game-controls{display: flex;gap: 15px;justify-content: center;flex-wrap: wrap}.balloon-stats{display: flex;gap: 20px;align-items: center;flex-wrap: wrap}.balloon-stats>div{background: rgba(255,255,255,0.9);padding: 8px 16px;border-radius: 20px;border: 2px solid #ff6b6b;color: #333;font-weight: 600;text-align: center;min-width: 100px;box-shadow: 0 2px 10px rgba(255,107,107,0.2)}.balloon-stats .game-score{border-color: #51cf66;color: #2b8a3e}.balloon-stats .game-combo{border-color: #ffd43b;color: #fab005;animation: pulse-combo 0.5s ease-in-out}.balloon-stats .game-time{border-color: #74c0fc;color: #1971c2}.balloon-stats .game-balloons{border-color: #ff8cc8;color: #c2255c}@keyframes pulse-combo{0%,100%{transform: scale(1)}50%{transform: scale(1.1)}}#balloon-canvas{background: linear-gradient(to bottom,#87CEEB 0%,#87CEFA 70%,#98FB98 100%);border: 3px solid #ff6b6b;border-radius: 12px;cursor: crosshair;box-shadow: 0 8px 25px rgba(255,107,107,0.3)}#balloon-canvas:hover{border-color: #ff5252;box-shadow: 0 10px 30px rgba(255,107,107,0.4)}.flappy-stats{display: flex;gap: 20px;align-items: center;flex-wrap: wrap}.flappy-stats>div{background: rgba(255,255,255,0.9);padding: 8px 16px;border-radius: 20px;border: 2px solid #4CAF50;color: #333;font-weight: 600;text-align: center;min-width: 120px;box-shadow: 0 2px 10px rgba(76,175,80,0.2)}.flappy-stats .game-score{border-color: #2196F3;color: #1976D2}.flappy-stats .game-high-score{border-color: #FF9800;color: #F57C00;animation: pulse-high-score 2s ease-in-out infinite}@keyframes pulse-high-score{0%,100%{transform: scale(1);box-shadow: 0 2px 10px rgba(255,152,0,0.2)}50%{transform: scale(1.05);box-shadow: 0 4px 15px rgba(255,152,0,0.4)}}#flappy-canvas{background: linear-gradient(to bottom,#87CEEB 0%,#98D8E8 70%,#B8E6B8 100%);border: 3px solid #4CAF50;border-radius: 12px;cursor: pointer;box-shadow: 0 8px 25px rgba(76,175,80,0.3);width: 100%;max-width: 400px;height: 600px}#flappy-canvas:hover{border-color: #45a049;box-shadow: 0 10px 30px rgba(76,175,80,0.4)}.frogger-stats{display: flex;gap: 15px;align-items: center;flex-wrap: wrap}.frogger-stats>div{background: rgba(255,255,255,0.9);padding: 8px 16px;border-radius: 20px;border: 2px solid #228B22;color: #333;font-weight: 600;text-align: center;min-width: 100px;box-shadow: 0 2px 10px rgba(34,139,34,0.2)}.frogger-stats .game-score{border-color: #32CD32;color: #228B22}.frogger-stats .game-lives{border-color: #FF6B6B;color: #DC143C}.frogger-stats .game-level{border-color: #4169E1;color: #0000CD}.frogger-stats .game-time{border-color: #FFD700;color: #FF8C00;animation: pulse-time 1s ease-in-out infinite}@keyframes pulse-time{0%,100%{transform: scale(1)}50%{transform: scale(1.05)}}#frogger-canvas{background: #90EE90;border: 3px solid #228B22;border-radius: 12px;cursor: default;box-shadow: 0 8px 25px rgba(34,139,34,0.3);width: 100%;max-width: 600px;height: 600px}#frogger-canvas:hover{border-color: #32CD32;box-shadow: 0 10px 30px rgba(34,139,34,0.4)}@media (max-width: 768px){.dice-game-area{flex-direction: column;align-items: center}.dice-controls{margin-top: 15px;text-align: center;width: 100%;max-width: 300px}.target-stats,.space-stats,.dice-stats,.pong-stats,.balloon-stats,.flappy-stats,.frogger-stats{justify-content: center;text-align: center;gap: 10px}.balloon-stats>div,.flappy-stats>div,.frogger-stats>div{min-width: 80px;padding: 6px 12px;font-size: 14px}.difficulty-controls{flex-wrap: wrap}}.blackjack-game{max-width: 800px;margin: 0 auto}.balance-display h3{text-align: center;color: #228B22;margin-bottom: 20px}.betting-area{background: rgba(102,126,234,0.1);padding: 20px;border-radius: 8px;text-align: center;margin-bottom: 20px}.bet-buttons{display: flex;gap: 10px;justify-content: center;flex-wrap: wrap;margin: 15px 0}.bet-btn{padding: 10px 20px;background: #228B22;color: white;border: none;border-radius: 4px;cursor: pointer;font-weight: 600}.bet-btn:hover{background: #1a6b1a}.deal-btn{padding: 12px 40px;background: #667eea;color: white;border: none;border-radius: 4px;cursor: pointer;font-weight: 600;font-size: 16px;margin-top: 15px}.deal-btn:hover:not(:disabled){background: #5568d3}.deal-btn:disabled{background: #ccc;cursor: not-allowed}.game-area{margin: 20px 0}.dealer-area,.player-area{margin: 20px 0;padding: 15px;background: rgba(255,255,255,0.5);border-radius: 8px}.card-container{display: flex;gap: 10px;flex-wrap: wrap;margin-top: 10px;justify-content: center}.card{width: 70px;height: 100px;background: white;border: 2px solid #333;border-radius: 8px;display: flex;align-items: center;justify-content: center;font-size: 24px;font-weight: bold;box-shadow: 0 2px 5px rgba(0,0,0,0.2)}.card-red{color: #DC143C}.card-black{color: #000}.card-back{background: linear-gradient(45deg,#1e3a8a,#3b82f6);color: white;font-size: 40px}.action-buttons{display: flex;gap: 15px;justify-content: center;margin: 20px 0}.action-btn{padding: 12px 30px;background: #4CAF50;color: white;border: none;border-radius: 4px;cursor: pointer;font-weight: 600;font-size: 16px}.action-btn:hover:not(:disabled){background: #45a049}.action-btn:disabled{background: #ccc;cursor: not-allowed}.message-area{text-align: center;margin: 20px 0;min-height: 30px}.message-area p{font-size: 18px;font-weight: 600;color: #667eea}.solitaire-game{max-width: 1000px;margin: 0 auto}.top-row{display: flex;justify-content: space-between;margin-bottom: 30px;gap: 20px}.stock-waste{display: flex;gap: 15px}.stock-pile,.waste-pile{width: 70px;height: 100px;cursor: pointer}.foundations{display: flex;gap: 10px}.foundation{width: 70px;height: 100px;background: rgba(102,126,234,0.1);border: 2px dashed #667eea;border-radius: 8px;cursor: pointer;display: flex;align-items: center;justify-content: center}.card-placeholder{width: 70px;height: 100px;background: rgba(102,126,234,0.05);border: 2px dashed #ccc;border-radius: 8px;display: flex;align-items: center;justify-content: center;font-size: 24px;color: #999}.tableau-area{display: flex;gap: 10px;justify-content: center}.tableau-column{min-height: 300px;cursor: pointer}.card.selected{box-shadow: 0 0 0 3px #FFD700;transform: translateY(-5px)}.reversi-game{max-width: 600px;margin: 0 auto}.board-container{display: flex;justify-content: center;margin: 20px 0}.reversi-board{display: grid;grid-template-columns: repeat(8,60px);grid-template-rows: repeat(8,60px);gap: 2px;background: #228B22;border: 4px solid #1a6b1a;border-radius: 8px;padding: 2px}.reversi-cell{width: 60px;height: 60px;background: #2d8a2d;cursor: pointer;display: flex;align-items: center;justify-content: center;font-size: 40px;transition: background 0.2s}.reversi-cell:hover{background: #3a9d3a}.reversi-cell.valid-move{background: #4CAF50}.move-hint{color: rgba(255,255,255,0.5);font-size: 30px}.piece{animation: place-piece 0.3s ease-out}@keyframes place-piece{0%{transform: scale(0)}100%{transform: scale(1)}}.game-info{display: flex;gap: 20px;align-items: center}.player-indicator{font-weight: bold;padding: 5px 10px;border-radius: 4px;background: rgba(102,126,234,0.1)}.mancala-game{max-width: 900px;margin: 0 auto}.mancala-board{display: flex;gap: 20px;justify-content: center;align-items: center;background: #8B4513;padding: 30px;border-radius: 16px;box-shadow: 0 8px 25px rgba(0,0,0,0.3);margin: 20px 0}.store{width: 100px;height: 280px;background: #654321;border: 4px solid #3e2a14;border-radius: 50px;display: flex;flex-direction: column;align-items: center;justify-content: center;box-shadow: inset 0 4px 10px rgba(0,0,0,0.3)}.store-label{font-weight: bold;color: #f4e4c1;margin-bottom: 10px;font-size: 18px}.store-count{font-size: 32px;font-weight: bold;color: #FFD700}.pits-container{display: flex;flex-direction: column;gap: 20px}.pit-row{display: flex;gap: 10px}.mancala-pit{width: 80px;height: 80px;background: #654321;border: 3px solid #3e2a14;border-radius: 50%;display: flex;align-items: center;justify-content: center;box-shadow: inset 0 3px 8px rgba(0,0,0,0.3);transition: all 0.2s}.mancala-pit.clickable{cursor: pointer}.mancala-pit.clickable:hover{transform: scale(1.05);background: #7a5a34;box-shadow: inset 0 3px 8px rgba(0,0,0,0.2),0 0 0 3px #FFD700}.pit-stones{font-size: 20px;text-align: center}.stone-count{font-size: 24px;font-weight: bold;color: #f4e4c1}.game-rules{margin-top: 20px;padding: 15px;background: rgba(102,126,234,0.05);border-radius: 8px}.game-rules summary{cursor: pointer;font-weight: 600;padding: 5px;color: #667eea}.game-rules ul{margin-top: 10px;padding-left: 20px}.game-rules li{margin: 5px 0;color: #666}@media (max-width: 768px){.reversi-board{grid-template-columns: repeat(8,45px);grid-template-rows: repeat(8,45px)}.reversi-cell{width: 45px;height: 45px;font-size: 30px}.mancala-board{flex-direction: column;padding: 20px}.store{width: 280px;height: 80px;flex-direction: row}.pit-row{justify-content: center}.card{width: 60px;height: 85px;font-size: 20px}.card-back{font-size: 32px}}@media (max-width: 768px){.hero-section{padding: 0 1rem}.site-title{font-size: 2rem}.typewriter-container{font-size: 1.1rem;margin: 0 10px}.nav-links{gap: 15px}.games-grid{grid-template-columns: repeat(auto-fill,minmax(200px,1fr));gap: 1.25rem}.game-card{padding: 1.5rem 1rem}.game-canvas{max-width: 100%;height: auto}.canvas-container canvas{max-width: 100%;height: auto}.controls{flex-direction: column;gap: 10px}.controls button{width: 100%}.game-header{flex-direction: column;gap: 1rem;text-align: center}.hero h1{font-size: 2rem}.hero p{font-size: 1rem;padding: 0 1rem}.content-with-sidebar{flex-direction: column}.sidebar-ads{display: none}.ad-banner-bottom{max-height: 60px;margin: 5px 0}.ad-container{margin: 10px 0;padding: 8px}nav{padding: 0 1rem}main{padding: 2rem 1rem}}@media (max-width: 1024px) and (min-width: 769px){.games-grid{grid-template-columns: repeat(auto-fill,minmax(220px,1fr));gap: 1.5rem}}@media (max-width: 480px){.logo{font-size: 1.5rem}.nav-links{gap: 10px}.games-grid{grid-template-columns: repeat(auto-fill,minmax(140px,1fr));gap: 1rem;margin: 1.5rem 0}.game-card{padding: 1.5rem 1rem}.game-icon{font-size: 3rem}header{padding: 2rem 0 1.5rem 0}.typewriter-container{font-size: 1rem}}@media screen and (max-width: 768px){input,select,textarea{font-size: 16px !important}}@media (pointer: coarse){a,button,[role="button"],input[type="checkbox"],input[type="radio"]{min-height: 48px;min-width: 48px}nav a,nav button{padding: 12px 8px}}@media (max-width: 768px){.game-card{content-visibility: auto;contain-intrinsic-size: 0 180px}}@media (prefers-reduced-motion: reduce){*,*::before,*::after{animation-duration: 0.01ms !important;animation-iteration-count: 1 !important;transition-duration: 0.01ms !important;scroll-behavior: auto !important}}@media (max-width: 768px){body{-webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;text-rendering: optimizeSpeed;overflow-x: hidden}html{overflow-x: hidden}img,video,canvas,svg{max-width: 100%;height: auto}}@media (max-width: 480px){body{font-size: 16px;line-height: 1.5;word-break: break-word;-webkit-hyphens: auto;hyphens: auto}p,li,dd{max-width: 100%;overflow-wrap: break-word}}@supports (padding-top: env(safe-area-inset-top)){header{padding-top: calc(0.6rem + env(safe-area-inset-top));padding-left: env(safe-area-inset-left);padding-right: env(safe-area-inset-right)}footer{padding-bottom: calc(2rem + env(safe-area-inset-bottom))}#main-content{padding-left: env(safe-area-inset-left);padding-right: env(safe-area-inset-right)}}.hamburger-btn{display: none;background: none;border: none;cursor: pointer;padding: 6px;color: var(--color-text-primary,#f1f3f5);font-size: 1.5rem;line-height: 1;z-index: 201}@media (max-width: 600px){.hamburger-btn{display: flex;align-items: center;justify-content: center}header{position: sticky;top: 0;z-index: 200}header nav{position: relative}header nav>a,header nav>button#theme-toggle{}.mobile-nav-drawer{display: none;position: fixed;top: 0;left: 0;right: 0;bottom: 0;background: var(--color-modal-overlay,rgba(0,0,0,0.72));z-index: 300;align-items: flex-start;justify-content: flex-end}.mobile-nav-drawer.open{display: flex}.mobile-nav-menu{background: var(--color-bg-secondary,#18181b);border-left: 1px solid var(--color-border-primary,#26262b);width: 260px;max-width: 80vw;height: 100%;padding: 4.5rem 1.5rem 2rem;display: flex;flex-direction: column;gap: 0.25rem;animation: slideInRight 0.25s ease;overflow-y: auto}@keyframes slideInRight{from{transform: translateX(100%)}to{transform: translateX(0)}}.mobile-nav-menu a,.mobile-nav-menu button{display: block;width: 100%;text-align: left;padding: 0.85rem 1rem;border-radius: 8px;font-size: 1rem;color: var(--color-text-primary,#f1f3f5);background: transparent;border: none;text-decoration: none;cursor: pointer;transition: background 0.15s}.mobile-nav-menu a:hover,.mobile-nav-menu button:hover{background: var(--color-bg-tertiary,#1f1f23)}.mobile-nav-close{position: absolute;top: 1rem;right: 1rem;background: none;border: none;color: var(--color-text-primary,#f1f3f5);font-size: 1.5rem;cursor: pointer;padding: 4px 8px;z-index: 301}header nav a,header nav #theme-toggle{display: none}}.touch-dpad{display: flex;flex-direction: column;align-items: center;gap: 2px;margin: 16px auto 8px;user-select: none;-webkit-user-select: none;touch-action: none}.dpad-middle{display: flex;align-items: center;gap: 2px}.dpad-btn{width: 56px;height: 56px;border-radius: 12px;border: 2px solid var(--color-border-primary,#3a3a40);background: var(--color-bg-elevated,#26262b);color: var(--color-text-primary,#f1f3f5);font-size: 1.4rem;display: flex;align-items: center;justify-content: center;cursor: pointer;transition: background 0.1s,transform 0.1s;-webkit-tap-highlight-color: transparent;touch-action: none}.dpad-btn:active,.dpad-btn.active{background: var(--color-primary,#667eea);transform: scale(0.92)}.dpad-center{width: 56px;height: 56px;border-radius: 50%;background: var(--color-bg-tertiary,#1a1a1d);border: 2px solid var(--color-border-primary,#3a3a40)}.touch-action-btn{position: fixed;bottom: 32px;width: 64px;height: 64px;border-radius: 50%;border: 2px solid var(--color-border-primary,#3a3a40);background: var(--color-bg-elevated,#26262b);color: var(--color-text-primary,#f1f3f5);font-size: 1.3rem;display: flex;align-items: center;justify-content: center;z-index: 100;cursor: pointer;-webkit-tap-highlight-color: transparent;touch-action: none;box-shadow: 0 4px 12px rgba(0,0,0,0.3);transition: background 0.1s,transform 0.1s}.touch-action-btn.active{background: var(--color-primary,#667eea);transform: scale(0.9)}.touch-action-btn.touch-action-right{right: 20px}.touch-action-btn.touch-action-left{left: 20px}.game-container{-webkit-user-select: none;user-select: none}.game-canvas{touch-action: none;-webkit-touch-callout: none}.mobile-tap-hint{display: none;text-align: center;padding: 8px 12px;margin: 8px auto;background: var(--color-bg-tertiary,#1f1f23);border-radius: 8px;font-size: 0.8rem;color: var(--color-text-secondary,#aaa);max-width: 300px}@media (pointer: coarse){.mobile-tap-hint{display: block}.keyboard-only-hint{display: none}}@media (pointer: fine){.touch-dpad,.touch-action-btn{display: none !important}}@media (max-width: 600px){.game-header{flex-direction: column;gap: 0.5rem;text-align: center;padding-bottom: 10px;margin-bottom: 10px}.game-title{font-size: 1.3rem}.game-container{padding: 12px 8px;border-radius: 8px;margin: 0}.game-canvas{max-width: 100%;max-height: calc(100vh - 280px);width: auto !important;height: auto !important}.game-instructions{padding: 10px;font-size: 0.85rem;margin-top: 12px}.game-instructions h4{font-size: 0.95rem}.game-instructions p{font-size: 0.8rem;margin: 3px 0}.controls{flex-wrap: wrap;gap: 8px;margin-top: 12px}.controls button{flex: 1 1 auto;min-width: 100px;padding: 10px 12px;font-size: 0.9rem}.tetris-stats,.target-stats,.space-stats,.dice-stats,.pong-stats,.balloon-stats,.flappy-stats{justify-content: center;gap: 8px;font-size: 0.85rem}.tetris-stats>div,.target-stats>div,.space-stats>div,.dice-stats>div{font-size: 0.85rem}.difficulty-controls{flex-wrap: wrap;gap: 6px}.diff-btn{padding: 6px 12px;font-size: 0.8rem}.bet-btn,.pred-btn{padding: 6px 10px;font-size: 0.75rem}.tetris-game-area{flex-direction: column;align-items: center;gap: 10px}.dice-game-area{flex-direction: column;align-items: center}.dice-controls{min-width: unset;width: 100%}#main-content{padding: 0.75rem}}@media (max-width: 600px){.games-grid{grid-template-columns: repeat(2,1fr) !important;gap: 0.6rem !important;margin-top: 0.75rem !important}.game-card{padding: 0.85rem 0.6rem !important;min-height: unset !important;border-radius: 10px}.game-card .game-icon{font-size: 2rem;margin-bottom: 0.3rem}.game-card h3{font-size: 0.85rem}.game-card .game-desc{font-size: 0.7rem;margin-top: 0.25rem}.game-card .play-button{padding: 0.4rem 0.6rem;font-size: 0.7rem;margin-top: 0.5rem}}@media (max-width: 360px){.games-grid{grid-template-columns: repeat(2,1fr) !important;gap: 0.5rem !important}.game-card{padding: 0.7rem 0.5rem !important}.game-card .game-icon{font-size: 1.7rem}.game-card h3{font-size: 0.78rem}.dpad-btn{width: 48px;height: 48px;font-size: 1.2rem}.dpad-center{width: 48px;height: 48px}.touch-action-btn{width: 54px;height: 54px;font-size: 1.1rem}}@media (max-width: 480px){.ttt-board{max-width: 280px !important}.ttt-cell{min-height: 70px !important;font-size: 2rem !important}}@media (max-width: 480px){.hangman-key{width: 32px !important;height: 38px !important;font-size: 0.85rem !important}}@media (max-width: 480px){.wordle-kb-btn{width: 28px !important;height: 42px !important;font-size: 0.8rem !important}#wordle-board>div>div{font-size: 1.3rem !important}}@media (max-width: 480px){#c4-board{max-width: 300px !important}#c4-drop-arrows{max-width: 300px !important}}@media (max-width: 600px){#bs-player-grid,#bs-ai-grid{gap: 1px !important}.bs-cell{width: 32px !important;height: 32px !important;font-size: 14px !important}}@media (max-width: 400px){.bs-cell{width: 26px !important;height: 26px !important;font-size: 11px !important}}@media (max-width: 480px){.rps-choice-btn{width: 65px !important;height: 65px !important;font-size: 2rem !important}#rps-player-display,#rps-ai-display{font-size: 3rem !important;width: 80px !important;height: 80px !important}}@media (max-width: 480px){#quiz-answers{grid-template-columns: 1fr !important}.quiz-answer-btn{font-size: 0.9rem !important;padding: 12px !important}}@media (max-width: 480px){#typing-target,#typing-display{font-size: 1rem !important;padding: 14px !important}#typing-input{font-size: 1rem !important}}@media (max-width: 600px){#car-controls-mobile{margin-top: 8px !important}#car-controls-mobile button{min-height: 52px}}@media (pointer: fine){#car-controls-mobile{display: none !important}}@media (max-width: 480px){.ai-thought-bubble{font-size: 0.8rem !important;padding: 8px !important}.ai-warning{font-size: 0.8rem !important;padding: 8px !important}}.dc-game{max-width: 1200px;margin: 0 auto;font-family: 'Courier New','Consolas',monospace;color: var(--color-text-primary,#e5e7eb)}.dc-header{display: flex;justify-content: space-between;align-items: center;padding: 0.75rem 0;border-bottom: 2px solid #3b3b44;margin-bottom: 1rem}.dc-header h2{margin: 0;font-size: 1.3rem;font-family: 'Press Start 2P',monospace;background: linear-gradient(90deg,#fbbf24,#f59e0b,#d97706);background-size: 200% 100%;-webkit-background-clip: text;-webkit-text-fill-color: transparent;background-clip: text;animation: dc-gold-shift 4s ease infinite}@keyframes dc-gold-shift{0%{background-position: 0% 50%}50%{background-position: 100% 50%}100%{background-position: 0% 50%}}.dc-subtitle{display: block;font-size: 0.75rem;color: #9ca3af;margin-top: 0.25rem}.dc-header-actions{display: flex;gap: 0.5rem}.dc-btn{background: #2d2d35;color: #e5e7eb;border: 1px solid #4b4b55;border-radius: 6px;padding: 0.4rem 0.8rem;cursor: pointer;font-family: inherit;font-size: 0.8rem;transition: all 0.15s ease;white-space: nowrap}.dc-btn:hover{background: #3d3d48;border-color: #6b6b78;transform: translateY(-1px)}.dc-btn:active{transform: translateY(0)}.dc-btn-sm{padding: 0.3rem 0.6rem;font-size: 0.72rem}.dc-btn-danger{border-color: #7f1d1d}.dc-btn-danger:hover{background: #7f1d1d;border-color: #ef4444}.dc-layout{display: grid;grid-template-columns: 1fr 320px;gap: 1rem;margin-bottom: 1rem}.dc-map-container{background: #0a0a0f;border: 2px solid #2d2d35;border-radius: 8px;overflow: hidden;position: relative}.dc-map{overflow: auto;max-height: 420px;padding: 8px;line-height: 1;white-space: nowrap;scrollbar-width: thin;scrollbar-color: #4b4b55 #0a0a0f}.dc-map::-webkit-scrollbar{width: 6px;height: 6px}.dc-map::-webkit-scrollbar-thumb{background: #4b4b55;border-radius: 3px}.dc-map::-webkit-scrollbar-track{background: #0a0a0f}.dc-map-row{height: 22px;line-height: 22px;font-size: 0}.dc-map-row span{display: inline-block;width: 22px;height: 22px;text-align: center;line-height: 22px;font-size: 14px}.dc-wall{color: #2d2d35;background: #1a1a22}.dc-floor{color: #3b3b44}.dc-stairs{font-size: 13px !important;animation: dc-pulse 2s ease-in-out infinite}.dc-chest{font-size: 13px !important;animation: dc-glow-gold 1.5s ease-in-out infinite}.dc-shop{font-size: 13px !important;animation: dc-pulse 3s ease-in-out infinite}.dc-player{color: #4ade80;font-weight: bold;font-size: 16px !important;text-shadow: 0 0 8px rgba(74,222,128,0.6);animation: dc-player-pulse 1s ease-in-out infinite}.dc-enemy{font-size: 13px !important;cursor: help;animation: dc-enemy-idle 2s ease-in-out infinite}.dc-fog{color: transparent;background: #0a0a0f}@keyframes dc-pulse{0%,100%{opacity: 1}50%{opacity: 0.6}}@keyframes dc-glow-gold{0%,100%{filter: brightness(1)}50%{filter: brightness(1.4) drop-shadow(0 0 4px rgba(251,191,36,0.5))}}@keyframes dc-player-pulse{0%,100%{text-shadow: 0 0 8px rgba(74,222,128,0.6)}50%{text-shadow: 0 0 16px rgba(74,222,128,0.9),0 0 4px rgba(74,222,128,0.4)}}@keyframes dc-enemy-idle{0%,100%{transform: translateY(0)}50%{transform: translateY(-1px)}}.dc-controls{display: flex;flex-direction: column;align-items: center;padding: 0.75rem 0;gap: 2px}.dc-control-row{display: flex;gap: 2px}.dc-move-btn{width: 48px;height: 48px;font-size: 1.2rem;display: flex;align-items: center;justify-content: center;padding: 0;border-radius: 8px;background: #1e1e28;border: 2px solid #3b3b44}.dc-move-btn:hover{background: #2d2d38;border-color: #5b5b68}.dc-move-btn:active{background: #4ade80;color: #0a0a0f;border-color: #4ade80}.dc-wait-btn{background: #1a1a28;border-color: #3b3b44;font-size: 1rem}.dc-control-hint{font-size: 0.65rem;color: #6b6b78;margin-top: 0.3rem}.dc-right-panel{display: flex;flex-direction: column;gap: 0.75rem}.dc-right-panel h3{margin: 0 0 0.5rem 0;font-size: 0.85rem;color: #9ca3af;border-bottom: 1px solid #2d2d35;padding-bottom: 0.25rem}.dc-stats-panel{background: #15151d;border: 1px solid #2d2d35;border-radius: 8px;padding: 0.75rem}.dc-stat-bar{display: flex;align-items: center;gap: 0.5rem;margin-bottom: 0.4rem}.dc-stat-bar .dc-stat-label{width: 40px;font-size: 0.72rem;color: #9ca3af}.dc-bar-outer{flex: 1;height: 14px;background: #1e1e28;border-radius: 7px;overflow: hidden;border: 1px solid #2d2d35}.dc-bar-inner{height: 100%;border-radius: 7px;transition: width 0.3s ease;background: #4ade80}.dc-xp-bar{background: linear-gradient(90deg,#818cf8,#a78bfa) !important}.dc-enemy-hp-bar{background: linear-gradient(90deg,#ef4444,#f97316) !important}.dc-stat-num{font-size: 0.7rem;min-width: 60px;text-align: right;color: #d1d5db;font-weight: bold}.dc-stat-line{display: flex;justify-content: space-between;font-size: 0.75rem;padding: 0.15rem 0;color: #d1d5db}.dc-stat-line small{color: #818cf8;font-size: 0.65rem}.dc-buffs{display: flex;flex-wrap: wrap;gap: 0.3rem;margin-top: 0.3rem}.dc-buff{font-size: 0.65rem;background: #1e1e28;padding: 0.15rem 0.4rem;border-radius: 4px;border: 1px solid #4b4b55}.dc-equipment-panel{background: #15151d;border: 1px solid #2d2d35;border-radius: 8px;padding: 0.75rem}.dc-equip-slot{display: flex;justify-content: space-between;align-items: center;font-size: 0.75rem;padding: 0.2rem 0}.dc-equip-label{color: #9ca3af}.dc-equip-item{color: #fbbf24;font-weight: bold}.dc-potions-panel{background: #15151d;border: 1px solid #2d2d35;border-radius: 8px;padding: 0.75rem}.dc-potion-btn{display: block;width: 100%;text-align: left;background: #1e1e28;color: #d1d5db;border: 1px solid #3b3b44;border-radius: 6px;padding: 0.35rem 0.5rem;margin-bottom: 0.3rem;cursor: pointer;font-family: inherit;font-size: 0.72rem;transition: all 0.15s ease}.dc-potion-btn:hover:not(:disabled){background: #2d2d38;border-color: #4ade80}.dc-potion-btn:disabled{opacity: 0.4;cursor: not-allowed}.dc-empty{font-size: 0.72rem;color: #6b6b78;font-style: italic}.dc-guide-panel{background: linear-gradient(135deg,#15151d,#1a1028);border: 1px solid #4b3b7a;border-radius: 8px;padding: 0.75rem}.dc-guide-panel h3{color: #a78bfa;border-color: #4b3b7a}.dc-guide-avatar{display: flex;align-items: center;gap: 0.5rem;margin-bottom: 0.5rem}.dc-guide-face{font-size: 2rem;animation: dc-guide-bob 3s ease-in-out infinite}@keyframes dc-guide-bob{0%,100%{transform: translateY(0)}50%{transform: translateY(-3px)}}.dc-guide-confidence{font-size: 0.7rem;color: #a78bfa}.dc-guide-confidence small{color: #ef4444}.dc-guide-messages{max-height: 160px;overflow-y: auto;scrollbar-width: thin;scrollbar-color: #4b3b7a #15151d}.dc-guide-msg{margin-bottom: 0.35rem}.dc-guide-bubble{display: block;font-size: 0.7rem;color: #c4b5fd;font-style: italic;padding: 0.3rem 0.5rem;background: #1e1028;border-radius: 6px;border-left: 3px solid #7c3aed;line-height: 1.4}.dc-guide-latest .dc-guide-bubble{color: #e9d5ff;background: #251540;border-left-color: #a78bfa;animation: dc-msg-flash 0.5s ease}@keyframes dc-msg-flash{0%{background: #4c1d95}100%{background: #251540}}.dc-log{background: #0f0f15;border: 1px solid #2d2d35;border-radius: 8px;padding: 0.75rem;margin-bottom: 1rem}.dc-log h3{margin: 0 0 0.5rem 0;font-size: 0.85rem;color: #9ca3af}.dc-log-entries{max-height: 180px;overflow-y: auto;scrollbar-width: thin;scrollbar-color: #3b3b44 #0f0f15}.dc-log-entry{font-size: 0.72rem;padding: 0.2rem 0.4rem;border-radius: 3px;margin-bottom: 0.15rem;line-height: 1.4}.dc-log-info{color: #9ca3af}.dc-log-combat{color: #fbbf24}.dc-log-damage{color: #ef4444}.dc-log-victory{color: #4ade80}.dc-log-loot{color: #fbbf24;background: rgba(251,191,36,0.05)}.dc-log-heal{color: #34d399}.dc-log-buff{color: #818cf8}.dc-log-level{color: #a78bfa;background: rgba(167,139,250,0.08)}.dc-log-death{color: #ef4444;font-weight: bold}.dc-log-boss{color: #f97316;font-weight: bold}.dc-log-achievement{color: #fbbf24;background: rgba(251,191,36,0.1);font-weight: bold}.dc-overlay{position: fixed;top: 0;left: 0;width: 100vw;height: 100vh;background: rgba(0,0,0,0.8);display: flex;justify-content: center;align-items: center;z-index: 1000;backdrop-filter: blur(4px);animation: dc-fade-in 0.3s ease}@keyframes dc-fade-in{from{opacity: 0}to{opacity: 1}}.dc-combat-panel{background: #15151d;border: 2px solid #ef4444;border-radius: 12px;padding: 1.5rem;width: 90%;max-width: 480px;max-height: 85vh;overflow-y: auto;box-shadow: 0 0 40px rgba(239,68,68,0.2);animation: dc-combat-enter 0.3s ease}@keyframes dc-combat-enter{from{transform: scale(0.9);opacity: 0}to{transform: scale(1);opacity: 1}}.dc-combat-panel h3{text-align: center;color: #ef4444;font-size: 1.1rem;margin: 0 0 1rem 0;font-family: 'Press Start 2P',monospace;font-size: 0.9rem}.dc-combat-enemy{display: flex;align-items: center;gap: 1rem;margin-bottom: 1rem;padding: 0.75rem;background: #1e1e28;border-radius: 8px;border: 1px solid #2d2d35}.dc-enemy-icon-large{font-size: 3rem;animation: dc-enemy-shake 0.5s ease-in-out infinite}@keyframes dc-enemy-shake{0%,100%{transform: translateX(0)}25%{transform: translateX(-2px)}75%{transform: translateX(2px)}}.dc-enemy-info{flex: 1}.dc-enemy-name{font-size: 1rem;font-weight: bold;color: #f87171;margin-bottom: 0.3rem}.dc-enemy-stats{font-size: 0.72rem;color: #9ca3af;margin-top: 0.25rem}.dc-combat-actions{display: flex;flex-direction: column;gap: 0.4rem;margin-bottom: 0.75rem}.dc-btn-attack{background: #7f1d1d;border-color: #ef4444;font-size: 0.9rem;padding: 0.6rem;text-align: center}.dc-btn-attack:hover{background: #991b1b;border-color: #f87171}.dc-btn-potion{background: #1a3a1a;border-color: #22c55e;text-align: left;font-size: 0.75rem}.dc-btn-potion:hover{background: #1e4d1e}.dc-btn-flee{background: #1e1e28;border-color: #6b6b78;text-align: center}.dc-btn-flee:hover{background: #2d2d38}.dc-combat-log{max-height: 120px;overflow-y: auto;border-top: 1px solid #2d2d35;padding-top: 0.5rem}.dc-shop-panel{background: #15151d;border: 2px solid #fbbf24;border-radius: 12px;padding: 1.5rem;width: 90%;max-width: 520px;max-height: 85vh;overflow-y: auto;box-shadow: 0 0 40px rgba(251,191,36,0.15)}.dc-shop-header{display: flex;justify-content: space-between;align-items: center;margin-bottom: 1rem}.dc-shop-header h3{margin: 0;color: #fbbf24;font-family: 'Press Start 2P',monospace;font-size: 0.85rem}.dc-shop-gold{font-size: 0.9rem;color: #fbbf24;font-weight: bold}.dc-shop-section{margin-bottom: 0.75rem}.dc-shop-section h4{margin: 0 0 0.4rem 0;font-size: 0.8rem;color: #9ca3af}.dc-shop-item{display: flex;align-items: center;width: 100%;gap: 0.5rem;background: #1e1e28;border: 1px solid #3b3b44;border-radius: 6px;padding: 0.4rem 0.6rem;margin-bottom: 0.3rem;cursor: pointer;font-family: inherit;font-size: 0.75rem;color: #d1d5db;transition: all 0.15s ease}.dc-shop-item:hover:not(:disabled){background: #2d2d38;border-color: #fbbf24;transform: translateX(4px)}.dc-shop-disabled{opacity: 0.35;cursor: not-allowed}.dc-shop-icon{font-size: 1.1rem;width: 24px;text-align: center}.dc-shop-name{flex: 1;text-align: left;font-weight: bold}.dc-shop-stat{color: #4ade80;font-size: 0.7rem}.dc-shop-price{color: #fbbf24;font-weight: bold;min-width: 40px;text-align: right}.dc-btn-close-shop{display: block;width: 100%;margin-top: 0.75rem;text-align: center;background: #2d2d35;border-color: #fbbf24;padding: 0.5rem;font-size: 0.85rem}.dc-btn-close-shop:hover{background: #3d3d48}.dc-death-panel{background: linear-gradient(135deg,#15151d,#1a0a0a);border: 2px solid #7f1d1d;border-radius: 12px;padding: 2rem;width: 90%;max-width: 440px;text-align: center;box-shadow: 0 0 60px rgba(127,29,29,0.3);animation: dc-death-enter 0.5s ease}@keyframes dc-death-enter{from{transform: scale(0.8);opacity: 0}to{transform: scale(1);opacity: 1}}.dc-death-skull{font-size: 4rem;margin-bottom: 0.5rem;animation: dc-skull-float 2s ease-in-out infinite}@keyframes dc-skull-float{0%,100%{transform: translateY(0)}50%{transform: translateY(-8px)}}.dc-death-panel h2{margin: 0 0 0.5rem 0;color: #ef4444;font-family: 'Press Start 2P',monospace;font-size: 1rem}.dc-death-floor{color: #9ca3af;font-size: 0.85rem;margin-bottom: 0.75rem}.dc-death-stats{display: flex;justify-content: center;gap: 1rem;font-size: 0.75rem;color: #d1d5db;margin-bottom: 1rem;flex-wrap: wrap}.dc-death-legacy{background: rgba(167,139,250,0.08);border: 1px solid #4b3b7a;border-radius: 8px;padding: 0.75rem;margin-bottom: 1rem}.dc-death-legacy h3{margin: 0 0 0.5rem 0;font-size: 0.8rem;color: #a78bfa}.dc-legacy-gains{display: flex;justify-content: center;gap: 1rem;font-size: 0.85rem;color: #4ade80;font-weight: bold}.dc-death-guide{margin-bottom: 1rem;padding: 0.5rem}.dc-death-guide .dc-guide-face{font-size: 1.5rem;margin-bottom: 0.25rem}.dc-death-guide p{font-size: 0.75rem;color: #c4b5fd;font-style: italic;margin: 0}.dc-btn-newrun{background: linear-gradient(135deg,#7c3aed,#a78bfa);border: none;color: #fff;font-size: 0.95rem;padding: 0.7rem 1.5rem;border-radius: 8px;font-weight: bold;cursor: pointer;transition: all 0.2s ease;animation: dc-pulse 2s ease-in-out infinite}.dc-btn-newrun:hover{transform: scale(1.05);box-shadow: 0 0 20px rgba(124,58,237,0.4)}.dc-achievements{background: #15151d;border: 1px solid #2d2d35;border-radius: 8px;padding: 0.75rem;margin-bottom: 1rem}.dc-achievements h3{margin: 0 0 0.5rem 0;font-size: 0.85rem;color: #fbbf24}.dc-achievement-grid{display: grid;grid-template-columns: repeat(auto-fill,minmax(120px,1fr));gap: 0.4rem}.dc-achievement{display: flex;align-items: center;gap: 0.3rem;padding: 0.3rem 0.5rem;border-radius: 6px;font-size: 0.65rem;border: 1px solid transparent;transition: all 0.15s ease}.dc-ach-unlocked{background: rgba(251,191,36,0.08);border-color: rgba(251,191,36,0.25);color: #fbbf24}.dc-ach-locked{background: #1a1a22;color: #4b4b55}.dc-ach-icon{font-size: 0.9rem}.dc-ach-name{flex: 1;white-space: nowrap;overflow: hidden;text-overflow: ellipsis}.dc-legacy-stats{background: #15151d;border: 1px solid #2d2d35;border-radius: 8px;padding: 0.75rem;margin-bottom: 1rem}.dc-legacy-stats h3{margin: 0 0 0.5rem 0;font-size: 0.85rem;color: #9ca3af}.dc-stats-grid{display: grid;grid-template-columns: repeat(auto-fill,minmax(130px,1fr));gap: 0.3rem}.dc-stat-item{display: flex;justify-content: space-between;padding: 0.2rem 0.4rem;background: #1a1a22;border-radius: 4px;font-size: 0.7rem}.dc-stat-item .dc-stat-label{color: #9ca3af}.dc-stat-item .dc-stat-val{color: #e5e7eb;font-weight: bold}@media (max-width: 768px){.dc-layout{grid-template-columns: 1fr}.dc-map{max-height: 280px}.dc-map-row span{width: 18px;height: 18px;line-height: 18px;font-size: 11px}.dc-map-row{height: 18px;line-height: 18px}.dc-right-panel{order: -1}.dc-header{flex-direction: column;gap: 0.5rem;text-align: center}.dc-header-actions{flex-wrap: wrap;justify-content: center}.dc-move-btn{width: 56px;height: 56px;font-size: 1.5rem}.dc-combat-panel,.dc-shop-panel,.dc-death-panel{width: 95%;padding: 1rem}.dc-achievement-grid{grid-template-columns: repeat(auto-fill,minmax(100px,1fr))}.dc-stats-grid{grid-template-columns: repeat(2,1fr)}.dc-death-stats{flex-direction: column;gap: 0.3rem}.dc-legacy-gains{flex-direction: column;gap: 0.3rem}}@media (max-width: 480px){.dc-header h2{font-size: 0.9rem}.dc-map{max-height: 220px}.dc-map-row span{width: 15px;height: 15px;line-height: 15px;font-size: 9px}.dc-map-row{height: 15px;line-height: 15px}.dc-player{font-size: 11px !important}.dc-stairs,.dc-chest,.dc-shop,.dc-enemy{font-size: 10px !important}.dc-achievement-grid{grid-template-columns: repeat(2,1fr)}}.dc-dedicated-page{background: #0a0a0f}
header{background: var(--color-bg-primary,#ffffff);padding: 1.5rem 0 1rem 0;border-bottom: 1px solid var(--color-border-primary,#e0e0e0)}.hero-section{max-width: 900px;margin: 0 auto;padding: 0 2rem;text-align: center}.site-title{font-size: 2rem;font-weight: bold;background: linear-gradient(45deg,#667eea,#764ba2,#ff6b6b);-webkit-background-clip: text;-webkit-text-fill-color: transparent;background-clip: text;margin-bottom: 0.75rem;text-shadow: 2px 2px 4px rgba(0,0,0,0.1)}.typewriter-container{font-family: -apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Oxygen,Ubuntu,Cantarell,sans-serif;font-size: 1.25rem;color: var(--color-text-primary,#333);padding: 0;margin: 0 auto;max-width: 800px;text-align: center;font-weight: 500}.prompt-prefix{display: none}.typewriter-text{color: var(--color-text-primary,#333)}.cursor{color: var(--color-text-primary,#333);animation: blink 1s infinite;font-weight: normal}@keyframes blink{0%,50%{opacity: 1}51%,100%{opacity: 0}}nav{max-width: 1200px;margin: 0 auto;display: flex;justify-content: space-between;align-items: center;padding: 0 2rem}.logo{font-size: 2rem;font-weight: bold;background: linear-gradient(45deg,#667eea,#764ba2);-webkit-background-clip: text;-webkit-text-fill-color: transparent;background-clip: text}.nav-links{display: flex;gap: 2rem}.nav-link{text-decoration: none;color: var(--color-text-primary,#333);font-weight: 500;transition: color 0.3s ease}.nav-link:hover{color: var(--color-primary,#667eea)}footer{margin-top: auto;background: var(--color-bg-primary,#ffffff);text-align: center;padding: 3rem 2rem;border-top: 1px solid var(--color-border-primary,#e0e0e0)}footer p{color: var(--color-text-secondary,#666);font-size: 0.9rem}
.game-container{background: var(--color-bg-elevated,rgba(255,255,255,0.95));backdrop-filter: blur(10px);border-radius: 12px;padding: 20px;margin: 0;position: relative;z-index: 10;border: 1px solid var(--color-border-primary,rgba(255,255,255,0.2))}.game-header{display: flex;justify-content: space-between;align-items: center;margin-bottom: 20px;padding-bottom: 15px;border-bottom: 2px solid var(--color-border-secondary,#eee)}.game-title{font-size: 2rem;font-weight: bold;color: var(--color-text-primary,#333)}.game-score{font-size: 1.2rem;font-weight: 600;color: var(--color-primary,#667eea)}.game-canvas{display: block;margin: 0 auto 20px auto;max-width: 100%;height: auto;border: 2px solid var(--color-canvas-border,#ddd);border-radius: 8px;background: var(--color-canvas-bg,#f8f9fa);box-shadow: var(--shadow-md,0 4px 15px rgba(0,0,0,0.1))}.canvas-container{display: flex;justify-content: center;margin-bottom: 20px}.canvas-container canvas{display: block;max-width: 100%;height: auto;border: 2px solid var(--color-canvas-border,#ddd);border-radius: 8px;background: var(--color-canvas-bg,#f8f9fa);box-shadow: var(--shadow-md,0 4px 15px rgba(0,0,0,0.1))}.controls{display: flex;gap: 15px;justify-content: center;flex-wrap: wrap;margin-top: 20px}.controls button{padding: 10px 20px;font-size: 1rem;border: none;border-radius: 8px;cursor: pointer;transition: all 0.3s ease;font-weight: 500}.btn-primary{background: linear-gradient(45deg,#667eea,#764ba2);color: white;box-shadow: 0 4px 15px rgba(102,126,234,0.4)}.btn-primary:hover{transform: translateY(-2px);box-shadow: 0 6px 20px rgba(102,126,234,0.6)}.btn-secondary{background: #6c757d;color: white}.btn-secondary:hover{background: #5a6268;transform: translateY(-1px)}.btn-success{background: #28a745;color: white}.btn-success:hover{background: #218838;transform: translateY(-1px)}.game-instructions{background: var(--color-bg-tertiary,rgba(255,255,255,0.8));padding: 15px;border-radius: 8px;margin-top: 20px;border-left: 4px solid var(--color-primary,#667eea)}.game-instructions h4{margin-bottom: 10px;color: var(--color-text-primary,#333)}.game-instructions p{margin: 5px 0;color: var(--color-text-secondary,#666);font-size: 0.9rem}.tetris-stats{display: flex;gap: 20px;flex-wrap: wrap}.tetris-stats>div{font-size: 1rem;font-weight: 600;color: #667eea}.tetris-game-area{display: flex;gap: 20px;justify-content: center;align-items: flex-start;margin: 20px 0}.tetris-next-piece{background: rgba(255,255,255,0.8);padding: 15px;border-radius: 8px;border-left: 4px solid #667eea;min-width: 150px}.tetris-next-piece h4{margin-bottom: 10px;color: #333;font-size: 1rem}#tetris-next-canvas{border: 1px solid #ddd;border-radius: 4px;background: #f8f9fa;display: block}#tetris-canvas{border: 2px solid #667eea;background: #000;box-shadow: 0 4px 15px rgba(102,126,234,0.3)}@media (max-width: 768px){.tetris-game-area{flex-direction: column;align-items: center}.tetris-stats{justify-content: center;text-align: center}.tetris-next-piece{margin-top: 15px;text-align: center}#tetris-canvas{}}.target-stats{display: flex;gap: 20px;flex-wrap: wrap}.target-stats>div{font-size: 1rem;font-weight: 600;color: #667eea}.space-stats{display: flex;gap: 20px;flex-wrap: wrap}.space-stats>div{font-size: 1rem;font-weight: 600;color: #667eea}.dice-stats{display: flex;gap: 20px;flex-wrap: wrap}.dice-stats>div{font-size: 1rem;font-weight: 600;color: #667eea}.dice-game-area{display: flex;gap: 20px;justify-content: center;align-items: flex-start;margin: 20px 0}.dice-controls{background: rgba(255,255,255,0.9);padding: 20px;border-radius: 8px;border-left: 4px solid #667eea;min-width: 200px}.dice-controls h4{margin-bottom: 10px;color: #333;font-size: 1rem}.bet-buttons,.prediction-buttons{display: flex;flex-wrap: wrap;gap: 8px;margin-bottom: 15px}.bet-btn,.pred-btn{padding: 8px 12px;border: 2px solid #667eea;background: white;color: #667eea;border-radius: 4px;cursor: pointer;font-size: 12px;transition: all 0.3s ease}.bet-btn:hover,.pred-btn:hover{background: #667eea;color: white}.bet-btn.active,.pred-btn.active{background: #667eea;color: white}.pong-stats{display: flex;gap: 20px;flex-wrap: wrap;justify-content: center}.pong-stats>div{font-size: 1rem;font-weight: 600;color: #667eea}.difficulty-controls{display: flex;gap: 10px;margin-bottom: 15px;justify-content: center}.diff-btn{padding: 8px 16px;border: 2px solid #667eea;background: white;color: #667eea;border-radius: 4px;cursor: pointer;font-size: 14px;transition: all 0.3s ease}.diff-btn:hover{background: #667eea;color: white}.diff-btn.active{background: #667eea;color: white}.game-controls{display: flex;gap: 15px;justify-content: center;flex-wrap: wrap}.balloon-stats{display: flex;gap: 20px;align-items: center;flex-wrap: wrap}.balloon-stats>div{background: rgba(255,255,255,0.9);padding: 8px 16px;border-radius: 20px;border: 2px solid #ff6b6b;color: #333;font-weight: 600;text-align: center;min-width: 100px;box-shadow: 0 2px 10px rgba(255,107,107,0.2)}.balloon-stats .game-score{border-color: #51cf66;color: #2b8a3e}.balloon-stats .game-combo{border-color: #ffd43b;color: #fab005;animation: pulse-combo 0.5s ease-in-out}.balloon-stats .game-time{border-color: #74c0fc;color: #1971c2}.balloon-stats .game-balloons{border-color: #ff8cc8;color: #c2255c}@keyframes pulse-combo{0%,100%{transform: scale(1)}50%{transform: scale(1.1)}}#balloon-canvas{background: linear-gradient(to bottom,#87CEEB 0%,#87CEFA 70%,#98FB98 100%);border: 3px solid #ff6b6b;border-radius: 12px;cursor: crosshair;box-shadow: 0 8px 25px rgba(255,107,107,0.3)}#balloon-canvas:hover{border-color: #ff5252;box-shadow: 0 10px 30px rgba(255,107,107,0.4)}.flappy-stats{display: flex;gap: 20px;align-items: center;flex-wrap: wrap}.flappy-stats>div{background: rgba(255,255,255,0.9);padding: 8px 16px;border-radius: 20px;border: 2px solid #4CAF50;color: #333;font-weight: 600;text-align: center;min-width: 120px;box-shadow: 0 2px 10px rgba(76,175,80,0.2)}.flappy-stats .game-score{border-color: #2196F3;color: #1976D2}.flappy-stats .game-high-score{border-color: #FF9800;color: #F57C00;animation: pulse-high-score 2s ease-in-out infinite}@keyframes pulse-high-score{0%,100%{transform: scale(1);box-shadow: 0 2px 10px rgba(255,152,0,0.2)}50%{transform: scale(1.05);box-shadow: 0 4px 15px rgba(255,152,0,0.4)}}#flappy-canvas{background: linear-gradient(to bottom,#87CEEB 0%,#98D8E8 70%,#B8E6B8 100%);border: 3px solid #4CAF50;border-radius: 12px;cursor: pointer;box-shadow: 0 8px 25px rgba(76,175,80,0.3);width: 100%;max-width: 400px;height: 600px}#flappy-canvas:hover{border-color: #45a049;box-shadow: 0 10px 30px rgba(76,175,80,0.4)}.frogger-stats{display: flex;gap: 15px;align-items: center;flex-wrap: wrap}.frogger-stats>div{background: rgba(255,255,255,0.9);padding: 8px 16px;border-radius: 20px;border: 2px solid #228B22;color: #333;font-weight: 600;text-align: center;min-width: 100px;box-shadow: 0 2px 10px rgba(34,139,34,0.2)}.frogger-stats .game-score{border-color: #32CD32;color: #228B22}.frogger-stats .game-lives{border-color: #FF6B6B;color: #DC143C}.frogger-stats .game-level{border-color: #4169E1;color: #0000CD}.frogger-stats .game-time{border-color: #FFD700;color: #FF8C00;animation: pulse-time 1s ease-in-out infinite}@keyframes pulse-time{0%,100%{transform: scale(1)}50%{transform: scale(1.05)}}#frogger-canvas{background: #90EE90;border: 3px solid #228B22;border-radius: 12px;cursor: default;box-shadow: 0 8px 25px rgba(34,139,34,0.3);width: 100%;max-width: 600px;height: 600px}#frogger-canvas:hover{border-color: #32CD32;box-shadow: 0 10px 30px rgba(34,139,34,0.4)}@media (max-width: 768px){.dice-game-area{flex-direction: column;align-items: center}.dice-controls{margin-top: 15px;text-align: center;width: 100%;max-width: 300px}.target-stats,.space-stats,.dice-stats,.pong-stats,.balloon-stats,.flappy-stats,.frogger-stats{justify-content: center;text-align: center;gap: 10px}.balloon-stats>div,.flappy-stats>div,.frogger-stats>div{min-width: 80px;padding: 6px 12px;font-size: 14px}.difficulty-controls{flex-wrap: wrap}}.blackjack-game{max-width: 800px;margin: 0 auto}.balance-display h3{text-align: center;color: #228B22;margin-bottom: 20px}.betting-area{background: rgba(102,126,234,0.1);padding: 20px;border-radius: 8px;text-align: center;margin-bottom: 20px}.bet-buttons{display: flex;gap: 10px;justify-content: center;flex-wrap: wrap;margin: 15px 0}.bet-btn{padding: 10px 20px;background: #228B22;color: white;border: none;border-radius: 4px;cursor: pointer;font-weight: 600}.bet-btn:hover{background: #1a6b1a}.deal-btn{padding: 12px 40px;background: #667eea;color: white;border: none;border-radius: 4px;cursor: pointer;font-weight: 600;font-size: 16px;margin-top: 15px}.deal-btn:hover:not(:disabled){background: #5568d3}.deal-btn:disabled{background: #ccc;cursor: not-allowed}.game-area{margin: 20px 0}.dealer-area,.player-area{margin: 20px 0;padding: 15px;background: rgba(255,255,255,0.5);border-radius: 8px}.card-container{display: flex;gap: 10px;flex-wrap: wrap;margin-top: 10px;justify-content: center}.card{width: 70px;height: 100px;background: white;border: 2px solid #333;border-radius: 8px;display: flex;align-items: center;justify-content: center;font-size: 24px;font-weight: bold;box-shadow: 0 2px 5px rgba(0,0,0,0.2)}.card-red{color: #DC143C}.card-black{color: #000}.card-back{background: linear-gradient(45deg,#1e3a8a,#3b82f6);color: white;font-size: 40px}.action-buttons{display: flex;gap: 15px;justify-content: center;margin: 20px 0}.action-btn{padding: 12px 30px;background: #4CAF50;color: white;border: none;border-radius: 4px;cursor: pointer;font-weight: 600;font-size: 16px}.action-btn:hover:not(:disabled){background: #45a049}.action-btn:disabled{background: #ccc;cursor: not-allowed}.message-area{text-align: center;margin: 20px 0;min-height: 30px}.message-area p{font-size: 18px;font-weight: 600;color: #667eea}.solitaire-game{max-width: 1000px;margin: 0 auto}.top-row{display: flex;justify-content: space-between;margin-bottom: 30px;gap: 20px}.stock-waste{display: flex;gap: 15px}.stock-pile,.waste-pile{width: 70px;height: 100px;cursor: pointer}.foundations{display: flex;gap: 10px}.foundation{width: 70px;height: 100px;background: rgba(102,126,234,0.1);border: 2px dashed #667eea;border-radius: 8px;cursor: pointer;display: flex;align-items: center;justify-content: center}.card-placeholder{width: 70px;height: 100px;background: rgba(102,126,234,0.05);border: 2px dashed #ccc;border-radius: 8px;display: flex;align-items: center;justify-content: center;font-size: 24px;color: #999}.tableau-area{display: flex;gap: 10px;justify-content: center}.tableau-column{min-height: 300px;cursor: pointer}.card.selected{box-shadow: 0 0 0 3px #FFD700;transform: translateY(-5px)}.reversi-game{max-width: 600px;margin: 0 auto}.board-container{display: flex;justify-content: center;margin: 20px 0}.reversi-board{display: grid;grid-template-columns: repeat(8,60px);grid-template-rows: repeat(8,60px);gap: 2px;background: #228B22;border: 4px solid #1a6b1a;border-radius: 8px;padding: 2px}.reversi-cell{width: 60px;height: 60px;background: #2d8a2d;cursor: pointer;display: flex;align-items: center;justify-content: center;font-size: 40px;transition: background 0.2s}.reversi-cell:hover{background: #3a9d3a}.reversi-cell.valid-move{background: #4CAF50}.move-hint{color: rgba(255,255,255,0.5);font-size: 30px}.piece{animation: place-piece 0.3s ease-out}@keyframes place-piece{0%{transform: scale(0)}100%{transform: scale(1)}}.game-info{display: flex;gap: 20px;align-items: center}.player-indicator{font-weight: bold;padding: 5px 10px;border-radius: 4px;background: rgba(102,126,234,0.1)}.mancala-game{max-width: 900px;margin: 0 auto}.mancala-board{display: flex;gap: 20px;justify-content: center;align-items: center;background: #8B4513;padding: 30px;border-radius: 16px;box-shadow: 0 8px 25px rgba(0,0,0,0.3);margin: 20px 0}.store{width: 100px;height: 280px;background: #654321;border: 4px solid #3e2a14;border-radius: 50px;display: flex;flex-direction: column;align-items: center;justify-content: center;box-shadow: inset 0 4px 10px rgba(0,0,0,0.3)}.store-label{font-weight: bold;color: #f4e4c1;margin-bottom: 10px;font-size: 18px}.store-count{font-size: 32px;font-weight: bold;color: #FFD700}.pits-container{display: flex;flex-direction: column;gap: 20px}.pit-row{display: flex;gap: 10px}.mancala-pit{width: 80px;height: 80px;background: #654321;border: 3px solid #3e2a14;border-radius: 50%;display: flex;align-items: center;justify-content: center;box-shadow: inset 0 3px 8px rgba(0,0,0,0.3);transition: all 0.2s}.mancala-pit.clickable{cursor: pointer}.mancala-pit.clickable:hover{transform: scale(1.05);background: #7a5a34;box-shadow: inset 0 3px 8px rgba(0,0,0,0.2),0 0 0 3px #FFD700}.pit-stones{font-size: 20px;text-align: center}.stone-count{font-size: 24px;font-weight: bold;color: #f4e4c1}.game-rules{margin-top: 20px;padding: 15px;background: rgba(102,126,234,0.05);border-radius: 8px}.game-rules summary{cursor: pointer;font-weight: 600;padding: 5px;color: #667eea}.game-rules ul{margin-top: 10px;padding-left: 20px}.game-rules li{margin: 5px 0;color: #666}@media (max-width: 768px){.reversi-board{grid-template-columns: repeat(8,45px);grid-template-rows: repeat(8,45px)}.reversi-cell{width: 45px;height: 45px;font-size: 30px}.mancala-board{flex-direction: column;padding: 20px}.store{width: 280px;height: 80px;flex-direction: row}.pit-row{justify-content: center}.card{width: 60px;height: 85px;font-size: 20px}.card-back{font-size: 32px}}
@media (max-width: 768px){.hero-section{padding: 0 1rem}.site-title{font-size: 2rem}.typewriter-container{font-size: 1.1rem;margin: 0 10px}.nav-links{gap: 15px}.games-grid{grid-template-columns: repeat(auto-fill,minmax(200px,1fr));gap: 1.25rem}.game-card{padding: 1.5rem 1rem}.game-canvas{max-width: 100%;height: auto}.canvas-container canvas{max-width: 100%;height: auto}.controls{flex-direction: column;gap: 10px}.controls button{width: 100%}.game-header{flex-direction: column;gap: 1rem;text-align: center}.hero h1{font-size: 2rem}.hero p{font-size: 1rem;padding: 0 1rem}.content-with-sidebar{flex-direction: column}.sidebar-ads{display: none}.ad-banner-bottom{max-height: 60px;margin: 5px 0}.ad-container{margin: 10px 0;padding: 8px}nav{padding: 0 1rem}main{padding: 2rem 1rem}}@media (max-width: 1024px) and (min-width: 769px){.games-grid{grid-template-columns: repeat(auto-fill,minmax(220px,1fr));gap: 1.5rem}}@media (max-width: 480px){.logo{font-size: 1.5rem}.nav-links{gap: 10px}.games-grid{grid-template-columns: repeat(auto-fill,minmax(140px,1fr));gap: 1rem;margin: 1.5rem 0}.game-card{padding: 1.5rem 1rem}.game-icon{font-size: 3rem}header{padding: 2rem 0 1.5rem 0}.typewriter-container{font-size: 1rem}}
*{margin: 0;padding: 0;box-sizing: border-box}body{font-family: -apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Oxygen,Ubuntu,Cantarell,sans-serif;line-height: 1.6;color: var(--color-text-primary,#333);background: var(--color-bg-primary,#ffffff);min-height: 100vh}#app{min-height: 100vh;display: flex;flex-direction: column}.fade-in{animation: fadeIn 0.5s ease-in}@keyframes fadeIn{from{opacity: 0;transform: translateY(20px)}to{opacity: 1;transform: translateY(0)}}
:root[data-theme="light"]{--color-primary: #667eea;--color-primary-dark: #5568d3;--color-primary-light: #7c94f5;--color-secondary: #764ba2;--color-bg-primary: #ffffff;--color-bg-secondary: #f8f9fa;--color-bg-tertiary: #f1f3f5;--color-bg-elevated: #ffffff;--color-text-primary: #333333;--color-text-secondary: #666666;--color-text-tertiary: #999999;--color-text-inverted: #ffffff;--color-border-primary: #e0e0e0;--color-border-secondary: #eeeeee;--color-border-focus: #667eea;--color-card-bg: #ffffff;--color-card-border: #e0e0e0;--color-card-hover-shadow: rgba(0,0,0,0.1);--color-canvas-bg: #f8f9fa;--color-canvas-border: #dddddd;--color-btn-primary-bg: linear-gradient(45deg,#667eea,#764ba2);--color-btn-primary-hover: linear-gradient(45deg,#5568d3,#653991);--color-btn-secondary-bg: #6c757d;--color-btn-secondary-hover: #5a6268;--shadow-sm: 0 2px 4px rgba(0,0,0,0.08);--shadow-md: 0 4px 15px rgba(0,0,0,0.1);--shadow-lg: 0 8px 25px rgba(0,0,0,0.15);--shadow-primary: 0 4px 15px rgba(102,126,234,0.4);--color-ad-bg: #f8f9fa;--color-ad-border: #e0e0e0;--color-ad-text: #888888;--color-modal-overlay: rgba(0,0,0,0.5);--color-modal-bg: #ffffff;--gradient-text: linear-gradient(45deg,#667eea,#764ba2,#ff6b6b)}:root[data-theme="dark"]{--color-primary: #7c94f5;--color-primary-dark: #667eea;--color-primary-light: #90a7ff;--color-secondary: #8e68b8;--color-bg-primary: #0f0f11;--color-bg-secondary: #18181b;--color-bg-tertiary: #1f1f23;--color-bg-elevated: #26262b;--color-text-primary: #f1f3f5;--color-text-secondary: #c5c7ca;--color-text-tertiary: #8b8d91;--color-text-inverted: #0f0f11;--color-border-primary: #26262b;--color-border-secondary: #2d2d31;--color-border-focus: #7c94f5;--color-card-bg: #1f1f23;--color-card-border: #26262b;--color-card-hover-shadow: rgba(0,0,0,0.5);--color-canvas-bg: #18181b;--color-canvas-border: #26262b;--color-btn-primary-bg: linear-gradient(45deg,#7c94f5,#8e68b8);--color-btn-primary-hover: linear-gradient(45deg,#90a7ff,#a082cc);--color-btn-secondary-bg: #4a4a52;--color-btn-secondary-hover: #5a5a62;--shadow-sm: 0 2px 4px rgba(0,0,0,0.3);--shadow-md: 0 4px 18px rgba(0,0,0,0.5);--shadow-lg: 0 8px 30px rgba(0,0,0,0.6);--shadow-primary: 0 4px 18px rgba(124,148,245,0.3);--color-ad-bg: #1f1f23;--color-ad-border: #26262b;--color-ad-text: #6b6b70;--color-modal-overlay: rgba(0,0,0,0.72);--color-modal-bg: #1f1f23;--gradient-text: linear-gradient(45deg,#7c94f5,#8e68b8,#ff8787)}body{background-color: var(--color-bg-primary);color: var(--color-text-primary);transition: background-color 0.3s ease,color 0.3s ease}header{background-color: var(--color-bg-secondary);border-bottom-color: var(--color-border-primary);transition: background-color 0.3s ease,border-color 0.3s ease}#theme-toggle{display: flex;align-items: center;gap: 0.4rem;padding: 0.4rem 0.75rem;background-color: var(--color-bg-elevated);border: 1px solid var(--color-border-primary);border-radius: 6px;color: var(--color-text-primary);cursor: pointer;font-size: 0.8rem;font-weight: 500;transition: all 0.3s ease}#theme-toggle:hover{background-color: var(--color-bg-tertiary);border-color: var(--color-border-focus);transform: translateY(-1px)}#theme-toggle:active{transform: translateY(0)}.theme-icon{font-size: 1rem;line-height: 1}.theme-text{line-height: 1}nav a{color: var(--color-text-secondary);transition: color 0.3s ease}nav a:hover{color: var(--color-text-primary)}.game-card{background-color: var(--color-card-bg);border-color: var(--color-card-border);transition: background-color 0.3s ease,border-color 0.3s ease,transform 0.25s ease,box-shadow 0.25s ease}.game-card:hover{box-shadow: var(--shadow-md);border-color: var(--color-border-focus)}.game-card h3{color: var(--color-text-primary)}.game-desc{color: var(--color-text-secondary)}.play-button{background: var(--color-btn-primary-bg);color: var(--color-text-inverted)}.play-button:hover{background: var(--color-btn-primary-hover)}.ad-box{background-color: var(--color-ad-bg);border-color: var(--color-ad-border);color: var(--color-ad-text);transition: background-color 0.3s ease,border-color 0.3s ease}footer{background-color: var(--color-bg-secondary);border-top-color: var(--color-border-primary);transition: background-color 0.3s ease,border-color 0.3s ease}footer p{color: var(--color-text-tertiary)}.hero{background-color: var(--color-bg-primary)}.hero h1{color: var(--color-text-primary)}.hero p{color: var(--color-text-secondary)}.site-title{background: var(--gradient-text);-webkit-background-clip: text;-webkit-text-fill-color: transparent;background-clip: text}.typewriter-container,.typewriter-text{color: var(--color-text-primary)}.cursor{color: var(--color-text-primary)}.game-container{background-color: var(--color-bg-elevated);border-color: var(--color-border-primary);transition: background-color 0.3s ease,border-color 0.3s ease}.game-header{border-bottom-color: var(--color-border-secondary)}.game-title{color: var(--color-text-primary)}.game-score{color: var(--color-primary)}.game-canvas{background-color: var(--color-canvas-bg);border-color: var(--color-canvas-border);transition: background-color 0.3s ease,border-color 0.3s ease}.btn-primary,.control-btn{background: var(--color-btn-primary-bg);color: var(--color-text-inverted);transition: all 0.3s ease}.btn-primary:hover,.control-btn:hover{background: var(--color-btn-primary-hover)}.btn-secondary{background-color: var(--color-btn-secondary-bg);color: var(--color-text-inverted)}.btn-secondary:hover{background-color: var(--color-btn-secondary-hover)}.game-instructions{background-color: var(--color-bg-tertiary);border-left-color: var(--color-primary);transition: background-color 0.3s ease}.game-instructions h4{color: var(--color-text-primary)}.game-instructions p{color: var(--color-text-secondary)}#between-games-ad{background-color: var(--color-modal-overlay)}#between-games-ad .ad-modal{background-color: var(--color-modal-bg);border-color: var(--color-border-secondary)}.sidebar-ads{transition: opacity 0.3s ease}.tetris-stats>div,.target-stats>div,.space-stats>div,.dice-stats>div,.pong-stats>div,.balloon-stats>div,.flappy-stats>div,.frogger-stats>div{color: var(--color-primary)}.betting-area,.dice-controls{background-color: var(--color-bg-tertiary);transition: background-color 0.3s ease}.card{background-color: var(--color-bg-primary);transition: background-color 0.3s ease}.foundation{background-color: var(--color-bg-tertiary);border-color: var(--color-primary)}.card-placeholder{background-color: var(--color-bg-tertiary);border-color: var(--color-border-secondary);color: var(--color-text-tertiary)}@media (max-width: 768px){#theme-toggle{padding: 0.4rem 0.8rem;font-size: 0.85rem}.theme-text{display: none}.theme-icon{font-size: 1.4rem}}*{transition-property: background-color,border-color,color,box-shadow;transition-duration: 0.3s;transition-timing-function: ease}.game-card,.btn-primary,.btn-secondary,#theme-toggle{transition-property: background-color,border-color,color,box-shadow,transform}
.highscores-game-card{background: linear-gradient(135deg,var(--color-card-bg,#1f1f23) 0%,rgba(59,130,246,0.1) 100%);border: 2px solid var(--color-accent,#3b82f6);position: relative;overflow: hidden;cursor: default}.highscores-game-card::before{content: '';position: absolute;top: -50%;right: -50%;width: 200%;height: 200%;background: radial-gradient(circle,rgba(59,130,246,0.1) 0%,transparent 70%);pointer-events: none}.highscores-game-card:hover{transform: translateY(-3px);box-shadow: 0 8px 24px -4px rgba(59,130,246,0.4)}.highscores-compact-list{display: flex;flex-direction: column;gap: 0.5rem;margin-top: 0.75rem;font-size: 0.85rem}.highscore-compact-entry{display: flex;align-items: center;gap: 0.5rem;padding: 0.4rem 0.5rem;background: var(--color-bg-secondary,#18181b);border-radius: 6px;border-left: 3px solid var(--color-accent,#3b82f6)}.rank-badge{font-weight: 700;font-size: 0.75rem;min-width: 1.75rem;text-align: center;color: var(--color-accent,#3b82f6)}.rank-badge.rank-1{color: #ffd700}.rank-badge.rank-2{color: #c0c0c0}.rank-badge.rank-3{color: #cd7f32}.score-info{flex: 1;min-width: 0;display: flex;flex-direction: column;gap: 0.1rem}.player-name{font-weight: 600;color: var(--color-text-primary,#f1f3f5);white-space: nowrap;overflow: hidden;text-overflow: ellipsis;font-size: 0.9rem}.game-name{font-size: 0.7rem;color: var(--color-text-secondary,#9ca3af);white-space: nowrap;overflow: hidden;text-overflow: ellipsis}.score-value{font-weight: 700;font-size: 0.95rem;color: var(--color-accent,#3b82f6);min-width: 2.5rem;text-align: right}.highscore-footer{margin-top: 0.75rem;padding-top: 0.75rem;border-top: 1px solid var(--color-border-primary,#26262b);text-align: center;font-size: 0.75rem;color: var(--color-text-secondary,#9ca3af)}.highscores-card{background: var(--color-card-bg,#1f1f23);border: 2px solid var(--color-accent,#3b82f6);border-radius: 16px;padding: 1.5rem;margin-bottom: 2rem;box-shadow: 0 4px 20px -4px rgba(59,130,246,0.3)}.highscores-header{display: flex;align-items: center;justify-content: center;margin-bottom: 1rem;padding-bottom: 1rem;border-bottom: 1px solid var(--color-border-primary,#26262b)}.highscores-header h2{margin: 0;font-size: 1.5rem;font-weight: 700;color: var(--color-text-primary,#f1f3f5)}.highscores-list{display: flex;flex-direction: column;gap: 0.75rem}.highscore-entry{display: flex;align-items: center;gap: 1rem;padding: 0.75rem;background: var(--color-bg-secondary,#18181b);border: 1px solid var(--color-border-secondary,#2d2d31);border-radius: 8px;transition: transform 0.2s ease,box-shadow 0.2s ease}.highscore-entry:hover{transform: translateY(-2px);box-shadow: 0 2px 8px rgba(0,0,0,0.2)}.highscore-rank{font-size: 1.25rem;font-weight: 700;color: var(--color-accent,#3b82f6);min-width: 2.5rem;text-align: center}.highscore-entry:nth-child(1) .highscore-rank{color: #ffd700}.highscore-entry:nth-child(2) .highscore-rank{color: #c0c0c0}.highscore-entry:nth-child(3) .highscore-rank{color: #cd7f32}.highscore-info{flex: 1;display: flex;flex-direction: column;gap: 0.25rem}.highscore-name{font-size: 1rem;font-weight: 600;color: var(--color-text-primary,#f1f3f5)}.highscore-game{font-size: 0.85rem;color: var(--color-text-secondary,#9ca3af)}.highscore-score{font-size: 1.25rem;font-weight: 700;color: var(--color-accent,#3b82f6);min-width: 4rem;text-align: right}.highscores-empty{text-align: center;padding: 2rem 1rem}.highscores-empty p{color: var(--color-text-secondary,#9ca3af);font-size: 1rem;margin: 0}.highscore-modal-overlay{position: fixed;inset: 0;background: rgba(0,0,0,0.8);display: flex;align-items: center;justify-content: center;z-index: 1000;animation: fadeIn 0.3s ease}@keyframes fadeIn{from{opacity: 0}to{opacity: 1}}.highscore-modal{background: var(--color-modal-bg,#1f1f23);border: 2px solid var(--color-accent,#3b82f6);border-radius: 16px;padding: 2rem;max-width: 400px;width: 90%;box-shadow: 0 8px 32px rgba(0,0,0,0.4);animation: slideUp 0.3s ease}@keyframes slideUp{from{transform: translateY(50px);opacity: 0}to{transform: translateY(0);opacity: 1}}.highscore-modal-header{text-align: center;margin-bottom: 1.5rem}.highscore-modal-header h2{margin: 0 0 0.5rem 0;font-size: 1.75rem;color: var(--color-text-primary,#f1f3f5)}.highscore-modal-score{font-size: 2.5rem;font-weight: 700;color: #ffd700;margin: 0.5rem 0}.highscore-modal-body{margin-bottom: 1.5rem}.highscore-modal-body p{text-align: center;color: var(--color-text-secondary,#9ca3af);margin: 0 0 1rem 0}.highscore-input-group{display: flex;flex-direction: column;gap: 0.5rem}.highscore-input-group label{font-size: 0.9rem;font-weight: 600;color: var(--color-text-primary,#f1f3f5)}.highscore-input-group input{padding: 0.75rem;font-size: 1rem;background: var(--color-bg-secondary,#18181b);border: 1px solid var(--color-border-primary,#26262b);border-radius: 8px;color: var(--color-text-primary,#f1f3f5);outline: none;transition: border-color 0.2s ease}.highscore-input-group input:focus{border-color: var(--color-accent,#3b82f6)}.highscore-modal-footer{display: flex;gap: 0.75rem}.highscore-modal-footer button{flex: 1;padding: 0.75rem;font-size: 1rem;font-weight: 600;border: none;border-radius: 8px;cursor: pointer;transition: transform 0.2s ease,opacity 0.2s ease}.highscore-modal-footer button:hover{transform: translateY(-2px);opacity: 0.9}.highscore-modal-footer .btn-primary{background: var(--color-accent,#3b82f6);color: white}.highscore-modal-footer .btn-secondary{background: var(--color-bg-tertiary,#2d2d31);color: var(--color-text-secondary,#9ca3af)}@media (max-width: 768px){.highscores-card{padding: 1rem}.highscore-entry{padding: 0.5rem}.highscore-rank{font-size: 1rem;min-width: 2rem}.highscore-name{font-size: 0.9rem}.highscore-game{font-size: 0.75rem}.highscore-score{font-size: 1rem;min-width: 3rem}.highscore-modal{padding: 1.5rem}.highscore-modal-score{font-size: 2rem}}.highscores-page{max-width: 1200px;margin: 0 auto;padding: 2rem 1rem}.page-header{display: flex;align-items: center;justify-content: space-between;margin-bottom: 2rem;padding-bottom: 1rem;border-bottom: 2px solid var(--color-border-primary,#26262b)}.page-header h1{margin: 0;font-size: 2rem;color: var(--color-text-primary,#f1f3f5)}.btn-secondary{background: var(--color-bg-secondary,#2d2d31);color: var(--color-text-primary,#f1f3f5);border: 1px solid var(--color-border-primary,#26262b);padding: 0.5rem 1rem;border-radius: 8px;cursor: pointer;font-size: 0.9rem;transition: background 0.2s ease}.btn-secondary:hover{background: var(--color-bg-tertiary,#3d3d41)}.top-scores-section{background: linear-gradient(135deg,var(--color-card-bg,#1f1f23) 0%,rgba(59,130,246,0.05) 100%);border: 2px solid var(--color-accent,#3b82f6);border-radius: 16px;padding: 2rem;margin-bottom: 3rem}.top-scores-section h2{margin: 0 0 1.5rem 0;font-size: 1.5rem;color: var(--color-text-primary,#f1f3f5)}.top-scores-list{display: flex;flex-direction: column;gap: 0.75rem}.top-score-entry{display: flex;align-items: center;gap: 1rem;padding: 1rem;background: var(--color-bg-secondary,#18181b);border: 1px solid var(--color-border-secondary,#2d2d31);border-radius: 10px;transition: transform 0.2s ease,box-shadow 0.2s ease}.top-score-entry:hover{transform: translateY(-2px);box-shadow: 0 4px 12px rgba(0,0,0,0.3)}.top-rank{font-size: 1.5rem;font-weight: 700;min-width: 3rem;text-align: center}.top-rank.rank-1{color: #ffd700;font-size: 2rem}.top-rank.rank-2{color: #c0c0c0;font-size: 1.75rem}.top-rank.rank-3{color: #cd7f32;font-size: 1.5rem}.top-score-info{flex: 1;display: flex;flex-direction: column;gap: 0.25rem}.top-player-name{font-size: 1.1rem;font-weight: 600;color: var(--color-text-primary,#f1f3f5)}.top-game-name{font-size: 0.9rem;color: var(--color-text-secondary,#9ca3af)}.top-score-value{font-size: 1.75rem;font-weight: 700;color: var(--color-accent,#3b82f6);min-width: 5rem;text-align: right}.all-games-section{margin-bottom: 3rem}.all-games-section h2{margin: 0 0 1.5rem 0;font-size: 1.5rem;color: var(--color-text-primary,#f1f3f5)}.games-highscores-grid{display: grid;grid-template-columns: repeat(auto-fill,minmax(280px,1fr));gap: 1.5rem}.game-highscore-section{background: var(--color-card-bg,#1f1f23);border: 1px solid var(--color-card-border,#26262b);border-radius: 12px;padding: 1.25rem;transition: transform 0.2s ease,box-shadow 0.2s ease}.game-highscore-section:hover{transform: translateY(-3px);box-shadow: 0 4px 16px rgba(0,0,0,0.2)}.game-highscore-header{display: flex;align-items: center;gap: 0.75rem;margin-bottom: 1rem;padding-bottom: 0.75rem;border-bottom: 1px solid var(--color-border-primary,#26262b)}.game-icon-large{font-size: 2rem}.game-highscore-header h3{margin: 0;font-size: 1.1rem;color: var(--color-text-primary,#f1f3f5)}.game-scores-list{display: flex;flex-direction: column;gap: 0.5rem}.highscore-row{display: flex;align-items: center;gap: 0.75rem;padding: 0.5rem;background: var(--color-bg-secondary,#18181b);border-radius: 6px}.highscore-row .rank-badge{font-size: 0.85rem;min-width: 2rem}.highscore-row .player-name{flex: 1;font-weight: 600;color: var(--color-text-primary,#f1f3f5);white-space: nowrap;overflow: hidden;text-overflow: ellipsis}.highscore-row .score-value{font-weight: 700;color: var(--color-accent,#3b82f6);min-width: 3rem;text-align: right}.no-scores{text-align: center;color: var(--color-text-secondary,#9ca3af);font-size: 0.9rem;padding: 1rem 0}@media (max-width: 768px){.page-header{flex-direction: column;gap: 1rem;align-items: flex-start}.page-header h1{font-size: 1.5rem}.top-scores-section{padding: 1.25rem}.top-rank{font-size: 1.25rem;min-width: 2.5rem}.top-rank.rank-1{font-size: 1.5rem}.top-rank.rank-2,.top-rank.rank-3{font-size: 1.25rem}.top-score-value{font-size: 1.25rem;min-width: 4rem}.games-highscores-grid{grid-template-columns: 1fr}}
@media screen and (max-width: 768px){input,select,textarea{font-size: 16px !important}}@media (pointer: coarse){a,button,[role="button"],input[type="checkbox"],input[type="radio"]{min-height: 48px;min-width: 48px}nav a,nav button{padding: 12px 8px}}@media (max-width: 768px){.game-card{content-visibility: auto;contain-intrinsic-size: 0 180px}}@media (prefers-reduced-motion: reduce){*,*::before,*::after{animation-duration: 0.01ms !important;animation-iteration-count: 1 !important;transition-duration: 0.01ms !important;scroll-behavior: auto !important}}@media (max-width: 768px){body{-webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;text-rendering: optimizeSpeed;overflow-x: hidden}html{overflow-x: hidden}img,video,canvas,svg{max-width: 100%;height: auto}}@media (max-width: 480px){body{font-size: 16px;line-height: 1.5;word-break: break-word;-webkit-hyphens: auto;hyphens: auto}p,li,dd{max-width: 100%;overflow-wrap: break-word}}@supports (padding-top: env(safe-area-inset-top)){header{padding-top: calc(0.6rem + env(safe-area-inset-top));padding-left: env(safe-area-inset-left);padding-right: env(safe-area-inset-right)}footer{padding-bottom: calc(2rem + env(safe-area-inset-bottom))}#main-content{padding-left: env(safe-area-inset-left);padding-right: env(safe-area-inset-right)}}.hamburger-btn{display: none;background: none;border: none;cursor: pointer;padding: 6px;color: var(--color-text-primary,#f1f3f5);font-size: 1.5rem;line-height: 1;z-index: 201}@media (max-width: 600px){.hamburger-btn{display: flex;align-items: center;justify-content: center}header{position: sticky;top: 0;z-index: 200}header nav{position: relative}header nav>a,header nav>button#theme-toggle{}.mobile-nav-drawer{display: none;position: fixed;top: 0;left: 0;right: 0;bottom: 0;background: var(--color-modal-overlay,rgba(0,0,0,0.72));z-index: 300;align-items: flex-start;justify-content: flex-end}.mobile-nav-drawer.open{display: flex}.mobile-nav-menu{background: var(--color-bg-secondary,#18181b);border-left: 1px solid var(--color-border-primary,#26262b);width: 260px;max-width: 80vw;height: 100%;padding: 4.5rem 1.5rem 2rem;display: flex;flex-direction: column;gap: 0.25rem;animation: slideInRight 0.25s ease;overflow-y: auto}@keyframes slideInRight{from{transform: translateX(100%)}to{transform: translateX(0)}}.mobile-nav-menu a,.mobile-nav-menu button{display: block;width: 100%;text-align: left;padding: 0.85rem 1rem;border-radius: 8px;font-size: 1rem;color: var(--color-text-primary,#f1f3f5);background: transparent;border: none;text-decoration: none;cursor: pointer;transition: background 0.15s}.mobile-nav-menu a:hover,.mobile-nav-menu button:hover{background: var(--color-bg-tertiary,#1f1f23)}.mobile-nav-close{position: absolute;top: 1rem;right: 1rem;background: none;border: none;color: var(--color-text-primary,#f1f3f5);font-size: 1.5rem;cursor: pointer;padding: 4px 8px;z-index: 301}header nav a,header nav #theme-toggle{display: none}}.touch-dpad{display: flex;flex-direction: column;align-items: center;gap: 2px;margin: 16px auto 8px;user-select: none;-webkit-user-select: none;touch-action: none}.dpad-middle{display: flex;align-items: center;gap: 2px}.dpad-btn{width: 56px;height: 56px;border-radius: 12px;border: 2px solid var(--color-border-primary,#3a3a40);background: var(--color-bg-elevated,#26262b);color: var(--color-text-primary,#f1f3f5);font-size: 1.4rem;display: flex;align-items: center;justify-content: center;cursor: pointer;transition: background 0.1s,transform 0.1s;-webkit-tap-highlight-color: transparent;touch-action: none}.dpad-btn:active,.dpad-btn.active{background: var(--color-primary,#667eea);transform: scale(0.92)}.dpad-center{width: 56px;height: 56px;border-radius: 50%;background: var(--color-bg-tertiary,#1a1a1d);border: 2px solid var(--color-border-primary,#3a3a40)}.touch-action-btn{position: fixed;bottom: 32px;width: 64px;height: 64px;border-radius: 50%;border: 2px solid var(--color-border-primary,#3a3a40);background: var(--color-bg-elevated,#26262b);color: var(--color-text-primary,#f1f3f5);font-size: 1.3rem;display: flex;align-items: center;justify-content: center;z-index: 100;cursor: pointer;-webkit-tap-highlight-color: transparent;touch-action: none;box-shadow: 0 4px 12px rgba(0,0,0,0.3);transition: background 0.1s,transform 0.1s}.touch-action-btn.active{background: var(--color-primary,#667eea);transform: scale(0.9)}.touch-action-btn.touch-action-right{right: 20px}.touch-action-btn.touch-action-left{left: 20px}.game-container{-webkit-user-select: none;user-select: none}.game-canvas{touch-action: none;-webkit-touch-callout: none}.mobile-tap-hint{display: none;text-align: center;padding: 8px 12px;margin: 8px auto;background: var(--color-bg-tertiary,#1f1f23);border-radius: 8px;font-size: 0.8rem;color: var(--color-text-secondary,#aaa);max-width: 300px}@media (pointer: coarse){.mobile-tap-hint{display: block}.keyboard-only-hint{display: none}}@media (pointer: fine){.touch-dpad,.touch-action-btn{display: none !important}}@media (max-width: 600px){.game-header{flex-direction: column;gap: 0.5rem;text-align: center;padding-bottom: 10px;margin-bottom: 10px}.game-title{font-size: 1.3rem}.game-container{padding: 12px 8px;border-radius: 8px;margin: 0}.game-canvas{max-width: 100%;max-height: calc(100vh - 280px);width: auto !important;height: auto !important}.game-instructions{padding: 10px;font-size: 0.85rem;margin-top: 12px}.game-instructions h4{font-size: 0.95rem}.game-instructions p{font-size: 0.8rem;margin: 3px 0}.controls{flex-wrap: wrap;gap: 8px;margin-top: 12px}.controls button{flex: 1 1 auto;min-width: 100px;padding: 10px 12px;font-size: 0.9rem}.tetris-stats,.target-stats,.space-stats,.dice-stats,.pong-stats,.balloon-stats,.flappy-stats{justify-content: center;gap: 8px;font-size: 0.85rem}.tetris-stats>div,.target-stats>div,.space-stats>div,.dice-stats>div{font-size: 0.85rem}.difficulty-controls{flex-wrap: wrap;gap: 6px}.diff-btn{padding: 6px 12px;font-size: 0.8rem}.bet-btn,.pred-btn{padding: 6px 10px;font-size: 0.75rem}.tetris-game-area{flex-direction: column;align-items: center;gap: 10px}.dice-game-area{flex-direction: column;align-items: center}.dice-controls{min-width: unset;width: 100%}#main-content{padding: 0.75rem}}@media (max-width: 600px){.games-grid{grid-template-columns: repeat(2,1fr) !important;gap: 0.6rem !important;margin-top: 0.75rem !important}.game-card{padding: 0.85rem 0.6rem !important;min-height: unset !important;border-radius: 10px}.game-card .game-icon{font-size: 2rem;margin-bottom: 0.3rem}.game-card h3{font-size: 0.85rem}.game-card .game-desc{font-size: 0.7rem;margin-top: 0.25rem}.game-card .play-button{padding: 0.4rem 0.6rem;font-size: 0.7rem;margin-top: 0.5rem}}@media (max-width: 360px){.games-grid{grid-template-columns: repeat(2,1fr) !important;gap: 0.5rem !important}.game-card{padding: 0.7rem 0.5rem !important}.game-card .game-icon{font-size: 1.7rem}.game-card h3{font-size: 0.78rem}.dpad-btn{width: 48px;height: 48px;font-size: 1.2rem}.dpad-center{width: 48px;height: 48px}.touch-action-btn{width: 54px;height: 54px;font-size: 1.1rem}}@media (max-width: 480px){.ttt-board{max-width: 280px !important}.ttt-cell{min-height: 70px !important;font-size: 2rem !important}}@media (max-width: 480px){.hangman-key{width: 32px !important;height: 38px !important;font-size: 0.85rem !important}}@media (max-width: 480px){.wordle-kb-btn{width: 28px !important;height: 42px !important;font-size: 0.8rem !important}#wordle-board>div>div{font-size: 1.3rem !important}}@media (max-width: 480px){#c4-board{max-width: 300px !important}#c4-drop-arrows{max-width: 300px !important}}@media (max-width: 600px){#bs-player-grid,#bs-ai-grid{gap: 1px !important}.bs-cell{width: 32px !important;height: 32px !important;font-size: 14px !important}}@media (max-width: 400px){.bs-cell{width: 26px !important;height: 26px !important;font-size: 11px !important}}@media (max-width: 480px){.rps-choice-btn{width: 65px !important;height: 65px !important;font-size: 2rem !important}#rps-player-display,#rps-ai-display{font-size: 3rem !important;width: 80px !important;height: 80px !important}}@media (max-width: 480px){#quiz-answers{grid-template-columns: 1fr !important}.quiz-answer-btn{font-size: 0.9rem !important;padding: 12px !important}}@media (max-width: 480px){#typing-target,#typing-display{font-size: 1rem !important;padding: 14px !important}#typing-input{font-size: 1rem !important}}@media (max-width: 600px){#car-controls-mobile{margin-top: 8px !important}#car-controls-mobile button{min-height: 52px}}@media (pointer: fine){#car-controls-mobile{display: none !important}}@media (max-width: 480px){.ai-thought-bubble{font-size: 0.8rem !important;padding: 8px !important}.ai-warning{font-size: 0.8rem !important;padding: 8px !important}}
.glitch-title{font-family: 'Press Start 2P',monospace;font-size: 1.6rem;letter-spacing: 1px;position: relative;display: inline-block;background: linear-gradient(90deg,#7c94f5,#c084fc,#f472b6,#fb923c);background-size: 300% 100%;-webkit-background-clip: text;-webkit-text-fill-color: transparent;background-clip: text;animation: gradientShift 6s ease infinite}.glitch-title::before,.glitch-title::after{content: attr(data-text);position: absolute;top: 0;left: 0;width: 100%;height: 100%;background: inherit;-webkit-background-clip: text;-webkit-text-fill-color: transparent;background-clip: text}.glitch-title::before{animation: glitch1 3s infinite;clip-path: inset(0 0 65% 0);left: 2px;text-shadow: -2px 0 #ff00ff}.glitch-title::after{animation: glitch2 3s infinite;clip-path: inset(65% 0 0 0);left: -2px;text-shadow: 2px 0 #00ffff}@keyframes gradientShift{0%{background-position: 0% 50%}50%{background-position: 100% 50%}100%{background-position: 0% 50%}}@keyframes glitch1{0%,92%,100%{transform: none;opacity: 1}93%{transform: translate(3px,-1px);opacity: 0.8}94%{transform: translate(-3px,1px);opacity: 0.8}95%{transform: none;opacity: 1}}@keyframes glitch2{0%,96%,100%{transform: none;opacity: 1}97%{transform: translate(-2px,2px);opacity: 0.8}98%{transform: translate(2px,-1px);opacity: 0.8}99%{transform: none;opacity: 1}}.ai-commentary{display: flex;align-items: center;gap: 0.75rem;padding: 0.75rem 1rem;margin-bottom: 1.25rem;background: var(--color-bg-tertiary,#1f1f23);border: 1px solid var(--color-border-secondary,#2d2d31);border-left: 3px solid #c084fc;border-radius: 10px;animation: fadeSlideIn 0.6s ease}.ai-commentary .ai-avatar{font-size: 1.5rem;flex-shrink: 0;animation: robotBob 3s ease-in-out infinite}.ai-commentary .ai-message{font-size: 0.85rem;color: var(--color-text-secondary,#c5c7ca);line-height: 1.4;font-style: italic;margin: 0;transition: opacity 0.3s ease}@keyframes robotBob{0%,100%{transform: translateY(0)}50%{transform: translateY(-3px)}}.stats-bar{display: flex;gap: 1rem;flex-wrap: wrap;padding: 0.6rem 0;margin-bottom: 1rem;font-size: 0.78rem;color: var(--color-text-tertiary,#8b8d91)}.stats-bar .stat-item{display: flex;align-items: center;gap: 0.3rem;padding: 0.3rem 0.65rem;background: var(--color-bg-tertiary,#1f1f23);border: 1px solid var(--color-border-primary,#26262b);border-radius: 20px;white-space: nowrap}.stats-bar .stat-item .stat-value{font-weight: 700;color: var(--color-text-primary,#f1f3f5)}.daily-challenge{display: flex;align-items: center;gap: 1rem;padding: 1rem 1.25rem;margin-bottom: 1.5rem;background: linear-gradient(135deg,rgba(124,148,245,0.12),rgba(192,132,252,0.10));border: 1px solid rgba(124,148,245,0.25);border-radius: 14px;cursor: pointer;transition: transform 0.2s ease,box-shadow 0.2s ease;animation: fadeSlideIn 0.7s ease}.daily-challenge:hover{transform: translateY(-2px);box-shadow: 0 6px 24px -4px rgba(124,148,245,0.25)}.daily-badge{font-family: 'Press Start 2P',monospace;font-size: 0.5rem;padding: 0.3rem 0.6rem;background: linear-gradient(135deg,#f59e0b,#f97316);color: #000;border-radius: 6px;white-space: nowrap;letter-spacing: 0.5px;font-weight: 700;flex-shrink: 0}.daily-content{display: flex;align-items: center;gap: 0.75rem;flex: 1;min-width: 0}.daily-content .daily-icon{font-size: 2rem;flex-shrink: 0}.daily-content h3{font-size: 0.95rem;color: var(--color-text-primary,#f1f3f5);margin: 0 0 0.15rem 0;font-weight: 600}.daily-content p{font-size: 0.78rem;color: var(--color-text-secondary,#c5c7ca);margin: 0}.daily-arrow{font-size: 1.2rem;color: var(--color-text-tertiary,#8b8d91);flex-shrink: 0}.recently-played-section{margin-bottom: 1.75rem;animation: fadeSlideIn 0.8s ease}.section-heading{font-size: 0.95rem;font-weight: 700;color: var(--color-text-primary,#f1f3f5);margin-bottom: 0.75rem;display: flex;align-items: center;gap: 0.5rem}.recently-played-row{display: flex;gap: 0.75rem;overflow-x: auto;padding-bottom: 0.5rem;scrollbar-width: thin;scrollbar-color: var(--color-border-secondary,#2d2d31) transparent;-webkit-overflow-scrolling: touch}.recently-played-row::-webkit-scrollbar{height: 4px}.recently-played-row::-webkit-scrollbar-thumb{background: var(--color-border-secondary,#2d2d31);border-radius: 4px}.recent-card{flex: 0 0 auto;width: 120px;padding: 0.75rem;background: var(--color-card-bg,#1f1f23);border: 1px solid var(--color-card-border,#26262b);border-radius: 10px;text-align: center;cursor: pointer;transition: transform 0.2s ease,border-color 0.2s ease}.recent-card:hover{transform: translateY(-2px);border-color: var(--color-border-focus,#7c94f5)}.recent-card .recent-icon{font-size: 1.6rem;margin-bottom: 0.3rem}.recent-card .recent-name{font-size: 0.7rem;color: var(--color-text-secondary,#c5c7ca);white-space: nowrap;overflow: hidden;text-overflow: ellipsis}.featured-challenge{display: flex;align-items: center;gap: 1rem;padding: 1rem 1.25rem;margin-bottom: 1.5rem;background: linear-gradient(135deg,rgba(251,191,36,0.12),rgba(234,88,12,0.08));border: 1px solid rgba(251,191,36,0.25);border-radius: 14px;cursor: pointer;transition: transform 0.2s ease,box-shadow 0.2s ease;animation: fadeSlideIn 0.7s ease}.featured-challenge:hover{transform: translateY(-2px);box-shadow: 0 6px 24px -4px rgba(251,191,36,0.25)}.featured-badge{font-family: 'Press Start 2P',monospace;font-size: 0.5rem;padding: 0.3rem 0.6rem;background: linear-gradient(135deg,#fbbf24,#f59e0b);color: #000;border-radius: 6px;white-space: nowrap;letter-spacing: 0.5px;font-weight: 700;flex-shrink: 0}.featured-content{display: flex;align-items: center;gap: 0.75rem;flex: 1;min-width: 0}.featured-content .featured-icon{font-size: 2rem;flex-shrink: 0}.featured-content h3{font-size: 0.95rem;color: var(--color-text-primary,#f1f3f5);margin: 0 0 0.15rem 0;font-weight: 600}.featured-content p{font-size: 0.78rem;color: var(--color-text-secondary,#c5c7ca);margin: 0}.featured-arrow{font-size: 1.2rem;color: var(--color-text-tertiary,#8b8d91);flex-shrink: 0}@media (max-width: 600px){.featured-challenge{padding: 0.75rem 1rem;gap: 0.7rem}.featured-badge{font-size: 0.42rem;padding: 0.2rem 0.45rem}.featured-content .featured-icon{font-size: 1.6rem}}.featured-ai-section{margin-bottom: 2rem;padding: 1.25rem;background: linear-gradient(135deg,rgba(192,132,252,0.06),rgba(244,114,182,0.04));border: 1px solid rgba(192,132,252,0.18);border-radius: 16px;position: relative;overflow: hidden;animation: fadeSlideIn 0.85s ease}.featured-ai-section::before{content: '';position: absolute;top: -50%;left: -50%;width: 200%;height: 200%;background: repeating-linear-gradient( 45deg,transparent,transparent 10px,rgba(192,132,252,0.02) 10px,rgba(192,132,252,0.02) 20px );pointer-events: none}.featured-ai-header{display: flex;align-items: center;justify-content: space-between;margin-bottom: 1rem;position: relative}.featured-ai-header h2{font-family: 'Press Start 2P',monospace;font-size: 0.75rem;color: #c084fc;letter-spacing: 1px;margin: 0;display: flex;align-items: center;gap: 0.5rem}.featured-ai-header p{font-size: 0.75rem;color: var(--color-text-tertiary,#8b8d91);margin: 0;font-style: italic}.featured-ai-grid{display: grid;grid-template-columns: repeat(auto-fill,minmax(200px,1fr));gap: 0.75rem;position: relative}.featured-ai-grid .game-card{border-color: rgba(192,132,252,0.2);position: relative}.featured-ai-grid .game-card::after{content: '🤖 AI';position: absolute;top: 0.5rem;right: 0.5rem;font-size: 0.55rem;padding: 0.15rem 0.4rem;background: rgba(192,132,252,0.2);border: 1px solid rgba(192,132,252,0.3);border-radius: 4px;color: #c084fc;font-weight: 600}.featured-ai-grid .game-card:hover{border-color: #c084fc;box-shadow: 0 0 20px -4px rgba(192,132,252,0.3)}.category-filters{display: flex;gap: 0.5rem;flex-wrap: wrap;margin-bottom: 1.25rem;padding: 0.5rem 0;animation: fadeSlideIn 0.9s ease}.category-chip{padding: 0.4rem 0.85rem;font-size: 0.75rem;font-weight: 600;border: 1px solid var(--color-border-primary,#26262b);background: var(--color-bg-tertiary,#1f1f23);color: var(--color-text-secondary,#c5c7ca);border-radius: 20px;cursor: pointer;transition: all 0.2s ease;display: flex;align-items: center;gap: 0.3rem;white-space: nowrap;user-select: none}.category-chip:hover{border-color: var(--color-border-focus,#7c94f5);color: var(--color-text-primary,#f1f3f5);transform: translateY(-1px)}.category-chip.active{background: linear-gradient(135deg,#7c94f5,#8e68b8);color: #fff;border-color: transparent;box-shadow: 0 2px 10px -2px rgba(124,148,245,0.4)}.category-chip .chip-count{font-size: 0.6rem;padding: 0.1rem 0.35rem;background: rgba(255,255,255,0.15);border-radius: 10px;min-width: 1.2rem;text-align: center}.category-chip.active .chip-count{background: rgba(255,255,255,0.25)}.home-page .game-card{position: relative;overflow: hidden}.game-card .ai-badge{position: absolute;top: 0.5rem;right: 0.5rem;font-size: 0.55rem;padding: 0.15rem 0.4rem;background: rgba(192,132,252,0.2);border: 1px solid rgba(192,132,252,0.3);border-radius: 4px;color: #c084fc;font-weight: 700;letter-spacing: 0.3px;z-index: 1}.game-card .card-daily-badge{position: absolute;top: 0.5rem;left: 0.5rem;font-size: 0.5rem;font-family: 'Press Start 2P',monospace;padding: 0.15rem 0.4rem;background: linear-gradient(135deg,#f59e0b,#f97316);color: #000;border-radius: 4px;font-weight: 700;z-index: 1}.game-card .top-score-badge{display: inline-flex;align-items: center;gap: 0.2rem;margin-top: 0.4rem;padding: 0.15rem 0.45rem;font-size: 0.65rem;font-weight: 700;background: rgba(251,191,36,0.12);border: 1px solid rgba(251,191,36,0.2);border-radius: 10px;color: #fbbf24}.game-card[data-ai-twist="true"]{border-color: rgba(192,132,252,0.15)}.game-card[data-ai-twist="true"]:hover{border-color: rgba(192,132,252,0.4);box-shadow: 0 4px 20px -4px rgba(192,132,252,0.2)}.game-card.stagger{animation: staggerIn 0.35s cubic-bezier(0.22,0.61,0.36,1) both;animation-delay: calc(var(--i,0) * 40ms)}@keyframes staggerIn{from{opacity: 0;transform: translateY(12px) scale(0.97)}to{opacity: 1;transform: translateY(0) scale(1)}}@keyframes fadeSlideIn{from{opacity: 0;transform: translateY(10px)}to{opacity: 1;transform: translateY(0)}}.page-enter{animation: pageIn 0.35s ease}@keyframes pageIn{from{opacity: 0;transform: translateY(8px)}to{opacity: 1;transform: translateY(0)}}#toast-container{position: fixed;bottom: 1.5rem;left: 50%;transform: translateX(-50%);display: flex;flex-direction: column-reverse;align-items: center;gap: 0.5rem;z-index: 9999;pointer-events: none}.toast-notification{padding: 0.7rem 1.2rem;background: var(--color-bg-elevated,#26262b);border: 1px solid var(--color-border-secondary,#2d2d31);border-radius: 10px;color: var(--color-text-primary,#f1f3f5);font-size: 0.8rem;font-weight: 500;box-shadow: 0 8px 30px rgba(0,0,0,0.4);opacity: 0;transform: translateY(10px) scale(0.95);transition: opacity 0.3s ease,transform 0.3s ease;pointer-events: none;white-space: nowrap;max-width: 90vw;text-align: center}.toast-notification.show{opacity: 1;transform: translateY(0) scale(1)}.toast-notification.achievement-toast{border-left: 3px solid #fbbf24;background: linear-gradient(135deg,var(--color-bg-elevated,#26262b),rgba(251,191,36,0.08))}.achievements-section{margin-top: 2.5rem;padding-top: 1.5rem;border-top: 1px solid var(--color-border-primary,#26262b);animation: fadeSlideIn 1s ease}.achievements-section h2{font-size: 1rem;font-weight: 700;color: var(--color-text-primary,#f1f3f5);margin-bottom: 1rem;display: flex;align-items: center;gap: 0.5rem}.achievements-grid{display: grid;grid-template-columns: repeat(auto-fill,minmax(240px,1fr));gap: 0.6rem}.achievement-badge{display: flex;align-items: center;gap: 0.65rem;padding: 0.65rem 0.85rem;background: var(--color-bg-tertiary,#1f1f23);border: 1px solid var(--color-border-primary,#26262b);border-radius: 10px;transition: all 0.2s ease}.achievement-badge.locked{opacity: 0.4;filter: grayscale(0.6)}.achievement-badge.unlocked{border-color: rgba(251,191,36,0.25);background: linear-gradient(135deg,var(--color-bg-tertiary,#1f1f23),rgba(251,191,36,0.05))}.achievement-badge .ach-icon{font-size: 1.4rem;flex-shrink: 0}.achievement-badge .ach-info{min-width: 0}.achievement-badge .ach-name{font-size: 0.78rem;font-weight: 700;color: var(--color-text-primary,#f1f3f5);margin-bottom: 0.1rem}.achievement-badge .ach-desc{font-size: 0.65rem;color: var(--color-text-tertiary,#8b8d91)}.share-btn{display: inline-flex;align-items: center;gap: 0.3rem;padding: 0.35rem 0.7rem;font-size: 0.7rem;font-weight: 600;color: var(--color-text-secondary,#c5c7ca);background: var(--color-bg-tertiary,#1f1f23);border: 1px solid var(--color-border-primary,#26262b);border-radius: 6px;cursor: pointer;transition: all 0.2s ease}.share-btn:hover{color: var(--color-text-primary,#f1f3f5);border-color: var(--color-border-focus,#7c94f5);background: var(--color-bg-elevated,#26262b)}#sound-toggle{display: flex;align-items: center;gap: 0.3rem;padding: 0.35rem 0.6rem;background: var(--color-bg-elevated,#26262b);border: 1px solid var(--color-border-primary,#26262b);border-radius: 6px;color: var(--color-text-secondary,#c5c7ca);cursor: pointer;font-size: 0.85rem;transition: all 0.2s ease}#sound-toggle:hover{border-color: var(--color-border-focus,#7c94f5);color: var(--color-text-primary,#f1f3f5)}.cosmetic-neon .game-card{border-color: rgba(0,255,200,0.2);box-shadow: 0 0 8px -2px rgba(0,255,200,0.1)}.cosmetic-neon .game-card:hover{border-color: rgba(0,255,200,0.5);box-shadow: 0 0 20px -4px rgba(0,255,200,0.3)}.cosmetic-retro .game-card{border-radius: 4px;border: 2px solid var(--color-border-primary,#26262b);box-shadow: 3px 3px 0 var(--color-border-primary,#26262b)}.cosmetic-retro .game-card:hover{box-shadow: 4px 4px 0 var(--color-primary,#7c94f5)}.cosmetic-gold .game-card{border-color: rgba(251,191,36,0.2)}.cosmetic-gold .game-card:hover{border-color: rgba(251,191,36,0.5);box-shadow: 0 4px 20px -4px rgba(251,191,36,0.2)}.cosmetic-glitch .game-card{animation: cardGlitch 8s infinite}@keyframes cardGlitch{0%,97%,100%{transform: none}97.5%{transform: translate(2px,-1px)}98%{transform: translate(-1px,1px)}98.5%{transform: none}}.cosmetic-rainbow .game-card{border-image: linear-gradient(135deg,#f43f5e,#f59e0b,#22c55e,#3b82f6,#a855f7) 1}.cosmetic-rainbow .game-card:hover{box-shadow: 0 4px 20px -4px rgba(168,85,247,0.25)}.cosmetics-section{margin-top: 1.5rem;padding-top: 1.5rem;border-top: 1px solid var(--color-border-primary,#26262b)}.cosmetics-section h2{font-size: 1rem;font-weight: 700;color: var(--color-text-primary,#f1f3f5);margin-bottom: 1rem;display: flex;align-items: center;gap: 0.5rem}.cosmetics-grid{display: flex;gap: 0.6rem;flex-wrap: wrap}.cosmetic-option{display: flex;align-items: center;gap: 0.5rem;padding: 0.55rem 0.85rem;background: var(--color-bg-tertiary,#1f1f23);border: 1px solid var(--color-border-primary,#26262b);border-radius: 10px;cursor: pointer;transition: all 0.2s ease;font-size: 0.75rem;color: var(--color-text-secondary,#c5c7ca)}.cosmetic-option:hover{border-color: var(--color-border-focus,#7c94f5)}.cosmetic-option.active{border-color: #7c94f5;background: rgba(124,148,245,0.1);color: var(--color-text-primary,#f1f3f5)}.cosmetic-option.locked{opacity: 0.35;cursor: not-allowed}.cosmetic-option .cos-icon{font-size: 1.1rem}.cosmetic-option .cos-name{font-weight: 600}.search-bar{position: relative;margin-bottom: 0.75rem}.search-bar input{width: 100%;padding: 0.6rem 1rem 0.6rem 2.4rem;background: var(--color-bg-tertiary,#1f1f23);border: 1px solid var(--color-border-primary,#26262b);border-radius: 10px;color: var(--color-text-primary,#f1f3f5);font-size: 0.85rem;outline: none;transition: border-color 0.2s ease}.search-bar input::placeholder{color: var(--color-text-tertiary,#8b8d91)}.search-bar input:focus{border-color: var(--color-border-focus,#7c94f5)}.search-bar .search-icon{position: absolute;left: 0.85rem;top: 50%;transform: translateY(-50%);font-size: 0.85rem;color: var(--color-text-tertiary,#8b8d91);pointer-events: none}@media (max-width: 600px){.glitch-title{font-size: 1rem}.ai-commentary{padding: 0.6rem 0.75rem}.ai-commentary .ai-message{font-size: 0.75rem}.daily-challenge{padding: 0.75rem 1rem;gap: 0.75rem}.daily-badge{font-size: 0.4rem}.daily-content .daily-icon{font-size: 1.5rem}.category-filters{gap: 0.35rem}.category-chip{padding: 0.35rem 0.7rem;font-size: 0.68rem}.featured-ai-grid{grid-template-columns: repeat(2,1fr);gap: 0.5rem}.achievements-grid{grid-template-columns: 1fr}.stats-bar{gap: 0.5rem;font-size: 0.7rem}.recently-played-row{gap: 0.5rem}.recent-card{width: 100px;padding: 0.5rem}}@media (prefers-reduced-motion: reduce){.glitch-title::before,.glitch-title::after{animation: none}.game-card.stagger{animation: none;opacity: 1}.ai-commentary .ai-avatar{animation: none}.cosmetic-glitch .game-card{animation: none}}
.jc-wrapper{max-width: 1000px;margin: 0 auto;padding: 0;position: relative;z-index: 10}.jc-header{display: flex;align-items: center;justify-content: space-between;padding: 0.6rem 0;margin-bottom: 0.5rem;border-bottom: 1px solid var(--color-border-primary,#26262b)}.jc-title{font-size: 1.3rem;font-weight: 700;margin: 0;color: var(--color-text-primary,#f1f3f5)}.jc-back-btn{background: none;border: 1px solid var(--color-border-primary,#333);color: var(--color-text-secondary,#ccc);padding: 0.35rem 0.7rem;border-radius: 6px;cursor: pointer;font-size: 0.8rem}.jc-back-btn:hover{background: var(--color-bg-secondary,#222)}.jc-header-btns{display: flex;gap: 0.4rem}.jc-save-btn,.jc-reset-btn{background: var(--color-bg-secondary,#1f1f23);border: 1px solid var(--color-border-primary,#333);color: var(--color-text-secondary,#ccc);padding: 0.3rem 0.55rem;border-radius: 6px;cursor: pointer;font-size: 0.85rem}.jc-save-btn:hover{background: #2a5d2a}.jc-reset-btn:hover{background: #5d2a2a}.jc-main{display: grid;grid-template-columns: 320px 1fr;gap: 1rem;align-items: start}.jc-left{display: flex;flex-direction: column;gap: 0.75rem}.jc-juice-display{text-align: center;padding: 1rem;background: linear-gradient(135deg,#1a1a2e 0%,#16213e 100%);border-radius: 12px;border: 1px solid #2a2a4a}.jc-juice-count{font-size: 2.4rem;font-weight: 800;color: #fbbf24;text-shadow: 0 0 20px rgba(251,191,36,0.4);line-height: 1.1;word-break: break-all}.jc-juice-label{font-size: 0.9rem;color: #94a3b8;text-transform: uppercase;letter-spacing: 2px;margin-top: 0.2rem}.jc-cps,.jc-per-click{font-size: 0.75rem;color: #64748b;margin-top: 0.15rem}.jc-golden-indicator{font-size: 0.85rem;color: #fbbf24;font-weight: 600;margin-top: 0.3rem;animation: jc-pulse 0.5s ease infinite alternate}.jc-click-area{position: relative;width: 100%;aspect-ratio: 1;max-width: 300px;margin: 0 auto;background: radial-gradient(circle at 40% 40%,#2a1a3e,#0f0a1e);border-radius: 50%;border: 3px solid #4a2a6a;display: flex;align-items: center;justify-content: center;cursor: pointer;user-select: none;-webkit-user-select: none;-webkit-tap-highlight-color: transparent;overflow: hidden;transition: transform 0.08s ease;touch-action: manipulation;box-shadow: 0 0 40px rgba(74,42,106,0.3),inset 0 0 60px rgba(0,0,0,0.3)}.jc-click-area:active{transform: scale(0.95)}.jc-big-juice{font-size: 6rem;pointer-events: none;filter: drop-shadow(0 0 10px rgba(251,191,36,0.3));transition: transform 0.08s ease}.jc-click-area:active .jc-big-juice{transform: scale(0.9) rotate(-5deg)}.jc-float-text{position: absolute;color: #fbbf24;font-weight: 700;font-size: 1.1rem;pointer-events: none;animation: jc-float-up 1s ease-out forwards;z-index: 20;text-shadow: 0 1px 4px rgba(0,0,0,0.7)}@keyframes jc-float-up{0%{opacity: 1;transform: translateY(0) scale(1)}100%{opacity: 0;transform: translateY(-80px) scale(1.3)}}.jc-particle{position: absolute;width: 8px;height: 8px;background: #fbbf24;border-radius: 50%;pointer-events: none;animation: jc-particle-fly 0.6s ease-out forwards;z-index: 15}@keyframes jc-particle-fly{0%{opacity: 1;transform: translate(0,0) scale(1)}100%{opacity: 0;transform: translate(var(--dx),var(--dy)) scale(0.3)}}.jc-golden-drop{position: absolute;font-size: 2.5rem;cursor: pointer;z-index: 30;animation: jc-golden-bob 2s ease-in-out infinite,jc-golden-glow 1s ease-in-out infinite alternate;filter: drop-shadow(0 0 12px gold);transition: transform 0.15s}.jc-golden-drop:hover{transform: scale(1.3)}@keyframes jc-golden-bob{0%,100%{transform: translateY(0)}50%{transform: translateY(-12px)}}@keyframes jc-golden-glow{from{filter: drop-shadow(0 0 8px gold)}to{filter: drop-shadow(0 0 24px gold) brightness(1.2)}}.jc-prestige-section{background: linear-gradient(135deg,#1a1a2e,#1e293b);border: 1px solid #334155;border-radius: 10px;padding: 0.75rem;text-align: center}.jc-prestige-info{font-size: 0.75rem;color: #94a3b8;display: flex;justify-content: space-around;margin-bottom: 0.5rem}.jc-prestige-btn{width: 100%;padding: 0.5rem;background: linear-gradient(135deg,#7c3aed,#6d28d9);color: #fff;border: none;border-radius: 8px;font-size: 0.8rem;font-weight: 600;cursor: pointer;transition: filter 0.2s}.jc-prestige-btn:hover{filter: brightness(1.2)}.jc-right{display: flex;flex-direction: column;min-height: 400px;max-height: 75vh;background: var(--color-bg-secondary,#18181b);border: 1px solid var(--color-border-primary,#26262b);border-radius: 12px;overflow: hidden}.jc-tabs{display: flex;background: #111;border-bottom: 1px solid #26262b;overflow-x: auto;scrollbar-width: none}.jc-tabs::-webkit-scrollbar{display: none}.jc-tab-btn{flex: 1;min-width: 0;padding: 0.55rem 0.3rem;background: transparent;color: #94a3b8;border: none;border-bottom: 2px solid transparent;font-size: 0.72rem;cursor: pointer;transition: color 0.2s,border-color 0.2s;white-space: nowrap}.jc-tab-btn.active{color: #fbbf24;border-bottom-color: #fbbf24}.jc-tab-btn:hover{color: #e2e8f0}.jc-tab-panel{display: none;overflow-y: auto;flex: 1;padding: 0.5rem}.jc-tab-panel.active{display: block}.jc-buildings-list{display: flex;flex-direction: column;gap: 0.4rem}.jc-building-btn{display: flex;align-items: center;gap: 0.6rem;width: 100%;padding: 0.55rem 0.65rem;background: #1e1e2e;border: 1px solid #2a2a3e;border-radius: 8px;cursor: pointer;text-align: left;color: #e2e8f0;transition: background 0.2s,border-color 0.2s,opacity 0.2s;opacity: 0.5}.jc-building-btn.affordable{opacity: 1;border-color: #3b82f6}.jc-building-btn.affordable:hover{background: #1e293b;border-color: #60a5fa}.jc-building-icon{font-size: 1.8rem;flex-shrink: 0}.jc-building-info{flex: 1;min-width: 0}.jc-building-name{font-weight: 600;font-size: 0.85rem;color: #f1f5f9}.jc-building-desc{font-size: 0.65rem;color: #64748b;margin-top: 0.1rem;white-space: nowrap;overflow: hidden;text-overflow: ellipsis}.jc-building-stats{font-size: 0.65rem;color: #60a5fa;margin-top: 0.1rem}.jc-building-right{text-align: right;flex-shrink: 0}.jc-building-price{font-size: 0.8rem;font-weight: 600;color: #fbbf24}.jc-building-owned{font-size: 1.6rem;font-weight: 800;color: #475569;line-height: 1}.jc-upgrades-list{display: flex;flex-wrap: wrap;gap: 0.4rem}.jc-upgrade-btn{display: flex;align-items: center;gap: 0.4rem;padding: 0.45rem 0.6rem;background: #1e1e2e;border: 1px solid #2a2a3e;border-radius: 8px;cursor: pointer;color: #e2e8f0;font-size: 0.75rem;opacity: 0.5;transition: opacity 0.2s,border-color 0.2s,background 0.2s}.jc-upgrade-btn.affordable{opacity: 1;border-color: #22c55e}.jc-upgrade-btn.affordable:hover{background: #1e2e1e;border-color: #4ade80}.jc-upgrade-icon{font-size: 1.3rem}.jc-upgrade-name{font-weight: 600}.jc-upgrade-price{color: #fbbf24;font-weight: 600;margin-left: auto}.jc-no-upgrades{text-align: center;color: #475569;padding: 2rem 1rem;font-size: 0.85rem}.jc-achievements-grid{display: grid;grid-template-columns: repeat(auto-fill,minmax(110px,1fr));gap: 0.4rem}.jc-ach{display: flex;flex-direction: column;align-items: center;padding: 0.5rem;border-radius: 8px;text-align: center;border: 1px solid #2a2a3e;transition: border-color 0.2s}.jc-ach.unlocked{background: #1a2e1a;border-color: #22c55e}.jc-ach.locked{background: #1e1e2e;opacity: 0.5}.jc-ach-icon{font-size: 1.5rem}.jc-ach-name{font-size: 0.65rem;color: #94a3b8;margin-top: 0.2rem}.jc-stats-content{display: flex;flex-direction: column;gap: 0.3rem}.jc-stat-row{display: flex;justify-content: space-between;padding: 0.35rem 0.5rem;font-size: 0.8rem;border-bottom: 1px solid #1e1e2e;color: #e2e8f0}.jc-stat-row span:last-child{font-weight: 600;color: #fbbf24}.jc-toast{position: fixed;top: 60px;left: 50%;transform: translateX(-50%) translateY(-20px);background: linear-gradient(135deg,#1e293b,#0f172a);color: #fbbf24;padding: 0.6rem 1.2rem;border-radius: 10px;border: 1px solid #334155;font-size: 0.8rem;font-weight: 600;z-index: 999;opacity: 0;pointer-events: none;transition: opacity 0.3s,transform 0.3s;max-width: 90vw;text-align: center}.jc-toast.show{opacity: 1;transform: translateX(-50%) translateY(0);animation: jc-toast-fade 3s ease forwards}@keyframes jc-toast-fade{0%,70%{opacity: 1}100%{opacity: 0}}.jc-offline-popup{position: fixed;inset: 0;background: rgba(0,0,0,0.7);display: flex;align-items: center;justify-content: center;z-index: 999}.jc-offline-card{background: #1e293b;border: 1px solid #334155;border-radius: 16px;padding: 1.5rem;text-align: center;max-width: 320px;width: 90%;color: #e2e8f0}.jc-offline-card h3{margin-top: 0;font-size: 1.1rem}.offline-amount{font-size: 1.6rem;font-weight: 800;color: #fbbf24;margin: 0.8rem 0 0.3rem}.jc-btn-primary{margin-top: 0.8rem;padding: 0.5rem 1.5rem;background: #3b82f6;color: #fff;border: none;border-radius: 8px;font-size: 0.85rem;font-weight: 600;cursor: pointer}.jc-btn-primary:hover{background: #2563eb}@keyframes jc-pulse{from{opacity: 0.8}to{opacity: 1}}@media (max-width: 720px){.jc-main{grid-template-columns: 1fr;gap: 0.75rem}.jc-left{order: 1}.jc-right{order: 2;max-height: 50vh}.jc-click-area{max-width: 220px}.jc-big-juice{font-size: 4.5rem}.jc-juice-count{font-size: 1.8rem}.jc-title{font-size: 1rem}.jc-tab-btn{font-size: 0.65rem;padding: 0.45rem 0.15rem}.jc-building-btn{padding: 0.45rem 0.5rem}.jc-building-icon{font-size: 1.4rem}.jc-building-desc{display: none}.jc-building-name{font-size: 0.78rem}.jc-achievements-grid{grid-template-columns: repeat(auto-fill,minmax(85px,1fr))}.jc-prestige-info{flex-direction: column;gap: 0.2rem}}@media (max-width: 380px){.jc-click-area{max-width: 180px}.jc-big-juice{font-size: 3.5rem}.jc-juice-count{font-size: 1.5rem}.jc-building-owned{font-size: 1.2rem}}.jc-dedicated-page .jc-wrapper{max-width: 1100px}.jc-dedicated-page .jc-main{min-height: calc(100vh - 120px)}@media (min-width: 721px){.jc-dedicated-page .jc-right{max-height: calc(100vh - 140px)}}
.sr-only{position: absolute;width: 1px;height: 1px;overflow: hidden;clip: rect(0 0 0 0);white-space: nowrap}.skip-link{position: absolute;left: 0.5rem;top: -3rem;z-index: 1000;padding: 0.5rem 0.9rem;border-radius: 8px;background: var(--color-primary,#7c94f5);color: #fff;font-size: 0.85rem;text-decoration: none;transition: top 0.15s}.skip-link:focus{top: 0.5rem}#home-page :is(button,a,input,select,summary):focus-visible,header :is(button,a):focus-visible{outline: 2px solid var(--color-primary,#7c94f5);outline-offset: 2px}.mobile-nav-drawer{display: none}@media (min-width: 601px){.mobile-nav-drawer,.mobile-nav-drawer.open{display: none !important}}#home-page{max-width: 1100px;margin: 0 auto}.hero-v2{text-align: center;padding: 1.25rem 0 0.5rem}.hero-title{font-size: clamp(1.4rem,4.5vw,2.1rem);line-height: 1.2;font-weight: 800;letter-spacing: -0.01em;color: var(--color-text-primary);margin: 0 0 0.75rem}.hero-accent{display: inline-block;background: linear-gradient(90deg,#7c94f5,#c084fc,#f472b6);-webkit-background-clip: text;background-clip: text;-webkit-text-fill-color: transparent}.hero-v2 .ai-commentary{display: inline-flex;align-items: center;gap: 0.6rem;max-width: 100%;margin: 0 auto 1.1rem;padding: 0.45rem 0.9rem;border-radius: 999px;background: var(--color-bg-tertiary);border: 1px solid var(--color-border-primary);border-left-width: 1px}.hero-v2 .ai-message{margin: 0;font-size: 0.85rem;font-style: italic;color: var(--color-text-secondary);transition: opacity 0.3s;text-align: left}.hero-actions{display: flex;gap: 0.6rem;max-width: 640px;margin: 0 auto 0.9rem}.hero-actions .search-bar{flex: 1;position: relative;margin: 0;max-width: none}.hero-actions .search-bar input{width: 100%;height: 48px;padding: 0 2.6rem 0 2.6rem;font-size: 1rem;border-radius: 12px;border: 1px solid var(--color-border-primary);background: var(--color-bg-secondary);color: var(--color-text-primary)}.hero-actions .search-bar input::placeholder{color: var(--color-text-tertiary)}.hero-actions .search-bar input:focus{outline: none;border-color: var(--color-primary);box-shadow: 0 0 0 3px color-mix(in srgb,var(--color-primary) 25%,transparent)}.hero-actions .search-icon{position: absolute;left: 0.85rem;top: 50%;transform: translateY(-50%);pointer-events: none}.search-clear{position: absolute;right: 0.4rem;top: 50%;transform: translateY(-50%);width: 34px;height: 34px;border: none;border-radius: 8px;background: transparent;color: var(--color-text-secondary);font-size: 0.9rem;cursor: pointer}.search-clear:hover{background: var(--color-bg-tertiary)}.search-clear[hidden]{display: none}.hero-actions input[type="search"]::-webkit-search-cancel-button{display: none}.surprise-btn{flex: none;height: 48px;padding: 0 1.1rem;border: none;border-radius: 12px;font-size: 0.95rem;font-weight: 700;color: #fff;cursor: pointer;background: linear-gradient(135deg,#7c94f5,#c084fc 55%,#f472b6);box-shadow: 0 4px 16px -4px rgba(192,132,252,0.6);transition: transform 0.15s,box-shadow 0.15s;white-space: nowrap}.surprise-btn:hover{transform: translateY(-2px);box-shadow: 0 8px 22px -4px rgba(192,132,252,0.7)}.surprise-btn:active{transform: translateY(0)}#home-page .stats-bar{justify-content: center;margin: 0}.spotlight{display: grid;grid-template-columns: repeat(3,1fr);gap: 0.75rem;margin: 1.25rem 0}.spot{display: flex;flex-direction: column;gap: 0.5rem;text-align: left;padding: 0.8rem 1rem;border-radius: 14px;border: 1px solid var(--color-border-primary);background: var(--color-card-bg);color: var(--color-text-primary);cursor: pointer;font: inherit;transition: transform 0.18s,box-shadow 0.18s,border-color 0.18s}.spot:hover{transform: translateY(-3px);box-shadow: 0 8px 22px -8px var(--color-card-hover-shadow,rgba(0,0,0,0.5))}.spot-label{font-size: 0.68rem;font-weight: 700;letter-spacing: 0.06em;text-transform: uppercase;color: var(--color-text-tertiary)}.spot-body{display: flex;align-items: center;gap: 0.75rem}.spot-icon{font-size: 2rem;line-height: 1}.spot-body strong{display: block;font-size: 0.95rem}.spot-body small{display: block;font-size: 0.78rem;color: var(--color-text-secondary);line-height: 1.3;margin-top: 2px}.spot-daily{border-color: rgba(124,148,245,0.45);background: linear-gradient(135deg,rgba(124,148,245,0.12),transparent 70%),var(--color-card-bg)}.spot-juice{border-color: rgba(251,146,60,0.45);background: linear-gradient(135deg,rgba(251,146,60,0.12),transparent 70%),var(--color-card-bg)}.spot-dungeon{border-color: rgba(251,191,36,0.45);background: linear-gradient(135deg,rgba(251,191,36,0.12),transparent 70%),var(--color-card-bg)}#home-page .recently-played-section{margin: 0 0 1.25rem}#home-page .recently-played-row{display: flex;gap: 0.6rem;overflow-x: auto;padding-bottom: 0.4rem;scroll-snap-type: x proximity}#home-page .recent-card{flex: none;display: flex;align-items: center;gap: 0.5rem;padding: 0.5rem 0.85rem;border-radius: 999px;border: 1px solid var(--color-border-primary);background: var(--color-card-bg);color: var(--color-text-primary);font: inherit;font-size: 0.85rem;cursor: pointer;scroll-snap-align: start;transition: border-color 0.15s,transform 0.15s}#home-page .recent-card:hover{border-color: var(--color-primary);transform: translateY(-1px)}#home-page .recent-icon{font-size: 1.2rem}.toolbar{position: sticky;top: 0;z-index: 50;display: flex;align-items: center;justify-content: space-between;gap: 0.75rem;margin: 0 -0.5rem 0.9rem;padding: 0.55rem 0.5rem;background: color-mix(in srgb,var(--color-bg-primary) 88%,transparent);backdrop-filter: blur(10px);-webkit-backdrop-filter: blur(10px);border-bottom: 1px solid var(--color-border-primary)}@supports not (background: color-mix(in srgb,red,blue)){.toolbar{background: var(--color-bg-primary)}}.toolbar .category-filters{display: flex;flex-wrap: nowrap;gap: 0.4rem;overflow-x: auto;margin: 0;padding: 2px;scrollbar-width: none;flex: 1;min-width: 0}.toolbar .category-filters::-webkit-scrollbar{display: none}.toolbar .category-chip{flex: none;cursor: pointer;font: inherit;font-size: 0.8rem}.toolbar-right{display: flex;align-items: center;gap: 0.6rem;flex: none}.results-count{font-size: 0.75rem;color: var(--color-text-tertiary);white-space: nowrap}#sort-select{height: 34px;padding: 0 0.6rem;border-radius: 8px;border: 1px solid var(--color-border-primary);background: var(--color-bg-secondary);color: var(--color-text-primary);font-size: 0.8rem;cursor: pointer}#home-page .games-grid{display: grid;grid-template-columns: repeat(auto-fill,minmax(210px,1fr));gap: 0.85rem;margin: 0 0 2rem}.tile{position: relative;border-radius: 14px;border: 1px solid var(--color-card-border);background: var(--color-card-bg);transition: transform 0.18s,box-shadow 0.18s,border-color 0.18s;animation: tileIn 0.3s cubic-bezier(0.22,0.61,0.36,1) both;animation-delay: calc(var(--i,0) * 25ms)}@keyframes tileIn{from{opacity: 0;transform: translateY(8px)}to{opacity: 1;transform: translateY(0)}}.tile:hover,.tile:focus-within{transform: translateY(-3px);border-color: var(--color-primary);box-shadow: 0 10px 26px -10px var(--color-card-hover-shadow,rgba(0,0,0,0.5))}.tile.is-ai{background: linear-gradient(160deg,rgba(168,85,247,0.09),transparent 55%),var(--color-card-bg)}.tile-main{display: flex;flex-direction: column;align-items: flex-start;width: 100%;height: 100%;min-height: 168px;padding: 1rem;text-align: left;background: none;border: none;border-radius: inherit;color: inherit;font: inherit;cursor: pointer}.tile-icon{font-size: 2.1rem;line-height: 1;margin-bottom: 0.5rem}.tile-name{font-size: 0.98rem;font-weight: 700;color: var(--color-text-primary);line-height: 1.25;padding-right: 1.6rem}.tile-desc{font-size: 0.8rem;color: var(--color-text-secondary);line-height: 1.35;margin-top: 0.25rem}.tile-badges{display: flex;flex-wrap: wrap;gap: 0.3rem;margin-top: 0.6rem}.tile-badge{font-size: 0.65rem;font-weight: 700;padding: 2px 7px;border-radius: 999px;border: 1px solid var(--color-border-primary);color: var(--color-text-secondary)}.tile-badge.ai{color: #c084fc;border-color: rgba(192,132,252,0.45);background: rgba(168,85,247,0.1)}.tile-badge.daily{color: #fbbf24;border-color: rgba(251,191,36,0.5);background: rgba(251,191,36,0.1)}.tile-badge.new{color: #34d399;border-color: rgba(52,211,153,0.4);background: rgba(52,211,153,0.08)}.tile-foot{display: flex;align-items: center;justify-content: space-between;width: 100%;margin-top: auto;padding-top: 0.7rem;font-size: 0.75rem}.tile-meta{color: var(--color-text-tertiary)}.tile-play{color: var(--color-primary);font-weight: 700;opacity: 0;transform: translateX(-4px);transition: opacity 0.15s,transform 0.15s}.tile:hover .tile-play,.tile:focus-within .tile-play{opacity: 1;transform: none}@media (hover: none){.tile-play{opacity: 1;transform: none}}.fav-btn{position: absolute;top: 0.55rem;right: 0.55rem;width: 36px;height: 36px;display: grid;place-items: center;border: none;border-radius: 50%;background: transparent;color: var(--color-text-tertiary);font-size: 1.15rem;line-height: 1;cursor: pointer;transition: color 0.15s,background 0.15s,transform 0.15s}.fav-btn:hover{background: var(--color-bg-tertiary);color: #f472b6;transform: scale(1.12)}.fav-btn.on{color: #f472b6}.empty-state{grid-column: 1 / -1;text-align: center;padding: 3rem 1rem;color: var(--color-text-secondary)}.empty-icon{font-size: 2.6rem;margin-bottom: 0.5rem}.empty-state h3{color: var(--color-text-primary);margin-bottom: 0.3rem}.empty-state p{font-size: 0.9rem;margin-bottom: 1rem}.pill-btn{padding: 0.55rem 1.1rem;border-radius: 999px;border: 1px solid var(--color-primary);background: transparent;color: var(--color-primary);font: inherit;font-weight: 600;font-size: 0.85rem;cursor: pointer}.pill-btn:hover{background: var(--color-primary);color: #fff}.fold{margin-top: 0.75rem;border: 1px solid var(--color-border-primary);border-radius: 12px;background: var(--color-card-bg)}.fold>summary{padding: 0.8rem 1rem;font-weight: 700;font-size: 0.95rem;cursor: pointer;list-style: none;display: flex;align-items: center;gap: 0.5rem;color: var(--color-text-primary)}.fold>summary::-webkit-details-marker{display: none}.fold>summary::after{content: '▾';margin-left: auto;color: var(--color-text-tertiary);transition: transform 0.2s}.fold[open]>summary::after{transform: rotate(180deg)}.fold-meta{font-size: 0.75rem;font-weight: 400;color: var(--color-text-tertiary)}.fold>:not(summary){margin: 0 1rem 1rem}#home-page .cosmetic-option{font: inherit;color: inherit}@media (max-width: 1420px){.sponsor-rail{display: none !important}}@media (min-width: 601px){.toolbar .category-filters{flex-wrap: wrap;overflow: visible}}@media (max-width: 800px){.spotlight{display: flex;overflow-x: auto;scroll-snap-type: x proximity;margin-right: -0.75rem;padding-right: 0.75rem}.spot{flex: 0 0 78%;scroll-snap-align: start}}@media (max-width: 600px){.hero-actions{flex-direction: column}.surprise-btn{width: 100%}.toolbar{flex-wrap: wrap;margin-left: -0.75rem;margin-right: -0.75rem;padding-left: 0.75rem;padding-right: 0.75rem}.toolbar .category-filters{flex-basis: 100%}.toolbar-right{width: 100%;justify-content: space-between}#home-page .games-grid{grid-template-columns: repeat(2,1fr) !important;gap: 0.6rem}.tile-main{min-height: 150px;padding: 0.8rem}.tile-icon{font-size: 1.8rem}.tile-name{font-size: 0.9rem}.tile-desc{font-size: 0.74rem}.tile-badge.new{display: none}}@media (prefers-reduced-motion: reduce){.tile,.page-enter{animation: none}.tile,.spot,.surprise-btn{transition: none}}:root[data-theme="light"] .tile-badge.ai{color: #7e22ce}:root[data-theme="light"] .tile-badge.daily{color: #b45309}:root[data-theme="light"] .tile-badge.new{color: #047857}:root[data-theme="light"] .hero-v2 .ai-commentary{background: var(--color-bg-secondary)}.cosmetic-neon .tile{border-color: rgba(0,255,200,0.25);box-shadow: 0 0 8px -2px rgba(0,255,200,0.12)}.cosmetic-neon .tile:hover{border-color: rgba(0,255,200,0.6);box-shadow: 0 0 20px -4px rgba(0,255,200,0.35)}.cosmetic-retro .tile{border-radius: 4px;border: 2px solid var(--color-border-primary);box-shadow: 3px 3px 0 var(--color-border-primary)}.cosmetic-retro .tile:hover{box-shadow: 4px 4px 0 var(--color-primary)}.cosmetic-gold .tile{border-color: rgba(251,191,36,0.3)}.cosmetic-gold .tile:hover{border-color: rgba(251,191,36,0.6);box-shadow: 0 4px 20px -4px rgba(251,191,36,0.25)}.cosmetic-glitch .tile:hover{animation: cardGlitch 0.4s 1}.cosmetic-rainbow .tile{border-image: linear-gradient(135deg,#f43f5e,#f59e0b,#22c55e,#3b82f6,#a855f7) 1}.mobile-nav-menu .mobile-nav-close{width: auto;left: auto;right: 1rem;top: 0.8rem;padding: 6px 10px}.hero-sub{max-width: 560px;margin: 0 auto 0.9rem;font-size: 0.95rem;color: var(--color-text-secondary)}a.tile-main{text-decoration: none}a.tile-main:focus-visible{outline: 2px solid var(--color-primary,#7c94f5);outline-offset: -2px}.faq{margin-top: 2rem}.faq h2{font-size: 1rem;margin-bottom: 0.5rem;color: var(--color-text-primary)}.faq .fold>p{color: var(--color-text-secondary);font-size: 0.9rem;line-height: 1.5;margin-top: 0}footer{max-width: 1100px;margin-left: auto;margin-right: auto}footer nav{max-width: none;padding: 0;justify-content: center;flex-wrap: wrap;margin-top: 0.6rem}.footer-btn{background: none;border: 1px solid var(--color-border-primary);border-radius: 999px;color: var(--color-text-secondary);font: inherit;font-size: 0.75rem;padding: 0.35rem 0.8rem;cursor: pointer}.footer-btn:hover{border-color: var(--color-primary);color: var(--color-text-primary)}.footer-btn[hidden]{display: none}.all-games{max-width: 900px;margin: 0.5rem auto;text-align: left}.all-games summary{cursor: pointer;text-align: center;color: var(--color-text-secondary);font-size: 0.8rem;list-style: none}.all-games summary::-webkit-details-marker{display: none}.all-games ul{list-style: none;display: flex;flex-wrap: wrap;gap: 0.3rem 0.9rem;justify-content: center;margin-top: 0.8rem;padding: 0}.all-games a{color: var(--color-text-tertiary);text-decoration: none;font-size: 0.78rem}.all-games a:hover{color: var(--color-primary);text-decoration: underline}
html{-webkit-text-size-adjust: 100%;text-size-adjust: 100%}body{-webkit-tap-highlight-color: transparent;touch-action: manipulation;overflow-x: hidden}#c4-board,#c4-drop-arrows{grid-template-columns: repeat(7,minmax(0,1fr)) !important}#chess-board{grid-template-columns: repeat(8,minmax(0,1fr)) !important}.c4-drop-btn{min-width: 0;padding: 0 !important}.dc-layout{grid-template-columns: minmax(0,1fr)}.dc-layout>*{min-width: 0}@media (min-width: 769px){.dc-layout{grid-template-columns: minmax(0,1fr) 320px}}#wordle-keyboard{width: 100%}#wordle-keyboard>div{width: 100%}.wordle-kb-btn{flex: 1 1 0;min-width: 0;max-width: 44px;width: auto !important;padding: 0 !important;height: 52px !important;touch-action: manipulation}.wordle-kb-btn[data-key="ENTER"],.wordle-kb-btn[data-key="BACKSPACE"]{flex: 1.6 1 0;max-width: 66px}@media (max-width: 768px){.solitaire-game{--cw: calc((100vw - 40px - 6 * 4px) / 7)}.solitaire-game .top-row{gap: 4px;margin-bottom: 14px}.solitaire-game .stock-waste{gap: 4px}.solitaire-game .foundations,.solitaire-game .tableau-area{gap: 4px}.solitaire-game .card,.solitaire-game .card-placeholder,.solitaire-game .foundation,.solitaire-game .stock-pile,.solitaire-game .waste-pile{width: var(--cw);height: calc(var(--cw) * 1.4);font-size: clamp(11px,3.4vw,16px);border-radius: 5px;border-width: 1px}.solitaire-game .card-back{font-size: clamp(14px,5vw,22px)}.solitaire-game .tableau-column{min-height: 200px}}@media (max-width: 768px){.mancala-board{padding: 12px;gap: 10px;width: 100%}.mancala-board .pits-container{width: 100%;gap: 10px}.mancala-board .pit-row{gap: 4px;width: 100%}.mancala-board .mancala-pit{flex: 1 1 0;min-width: 0;width: auto;height: auto;aspect-ratio: 1;border-width: 2px}.mancala-board .pit-stones{font-size: 11px;line-height: 1.1}.mancala-board .stone-count{font-size: 16px}.mancala-board .store{width: 100%;max-width: 280px;height: 64px}.mancala-board .store-count{font-size: 26px}}@media (max-width: 480px){.reversi-board{grid-template-columns: repeat(8,minmax(0,1fr));grid-template-rows: none;width: 100%}.reversi-cell{width: auto;height: auto;aspect-ratio: 1;font-size: 22px}}@media (max-width: 600px){#toast-container{bottom: auto;top: calc(env(safe-area-inset-top,0px) + 64px);flex-direction: column}.toast-notification{white-space: normal;font-size: 0.78rem;padding: 0.55rem 0.9rem}}#main-content{overflow-x: clip}