:root{font-family:var(--font-primary, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, sans-serif);line-height:1.5;font-weight:400;color-scheme:light dark;color:var(--color-text, #213547);background-color:var(--color-primary, #ffffff);font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}a{font-weight:500;color:var(--color-accent, #646cff);text-decoration:inherit}a:hover{color:var(--color-accent-hover, #747bff)}body{margin:0;min-width:320px;min-height:100vh;background-color:var(--color-primary, #ffffff);color:var(--color-text, #333333)}h1{font-size:2rem;line-height:1.1}button{border-radius:8px;border:1px solid var(--color-border, #e0e0e0);padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:var(--color-surface, #ffffff);color:var(--color-text, #333);cursor:pointer;transition:all .25s ease}button:hover{border-color:var(--color-accent, #646cff);background-color:var(--color-card, #f8f9fa)}button:focus,button:focus-visible{outline:2px solid var(--color-accent, #646cff);outline-offset:2px}button:disabled{opacity:.6;cursor:not-allowed}input{font-family:inherit}@media (min-width: 768px){h1{font-size:2.5rem}}@media (min-width: 1024px){h1{font-size:3.2rem}}*{box-sizing:border-box}body{margin:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;line-height:1.6;color:#333;background-color:#fff}.app{min-height:100vh}#root{max-width:none;margin:0;padding:0;text-align:left}.logo{height:6em;padding:1.5em;will-change:filter;transition:filter .3s}.logo:hover{filter:drop-shadow(0 0 2em #646cffaa)}.logo.react:hover{filter:drop-shadow(0 0 2em #61dafbaa)}@keyframes logo-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@media (prefers-reduced-motion: no-preference){a:nth-of-type(2) .logo{animation:logo-spin infinite 20s linear}}.card{padding:2em}.read-the-docs{color:#888}.multiplayer-modal-overlay{position:fixed;inset:0;background:#0009;display:flex;align-items:center;justify-content:center;z-index:2000;padding:1rem}.multiplayer-modal{background:#fff;border-radius:12px;box-shadow:0 10px 30px #0000004d;max-width:90vw;max-height:90vh;width:600px;overflow:hidden;display:flex;flex-direction:column}.multiplayer-modal-header{display:flex;align-items:center;justify-content:space-between;padding:1.5rem;background:var(--color-accent, #2196F3);color:#fff;border-bottom:1px solid rgba(255,255,255,.2)}.multiplayer-modal-header h2{margin:0;font-size:1.2rem;font-weight:600}.multiplayer-modal-close{background:none;border:none;color:#fff;font-size:1.5rem;cursor:pointer;padding:.25rem;border-radius:4px;transition:background-color .2s ease}.multiplayer-modal-close:hover{background:#fff3}.multiplayer-modal-content{padding:1.5rem;overflow-y:auto;flex:1}.multiplayer-session-setup{display:flex;flex-direction:column;gap:2rem}.multiplayer-section{text-align:center}.multiplayer-section h3{margin:0 0 1rem;font-size:1.1rem;color:var(--color-text, #333)}.multiplayer-section p{margin:0 0 1.5rem;color:var(--color-text-secondary, #666);font-size:.9rem}.game-selection{display:flex;gap:1rem;justify-content:center;flex-wrap:wrap}.game-select-btn{padding:1rem 1.5rem;background:var(--color-accent, #2196F3);color:#fff;border:none;border-radius:8px;font-size:1rem;font-weight:500;cursor:pointer;transition:all .2s ease;min-width:140px;display:flex;align-items:center;justify-content:center;gap:.5rem}.game-select-btn:hover:not(:disabled){background:var(--color-accent-hover, #1976D2);transform:translateY(-1px)}.game-select-btn:active:not(:disabled){transform:translateY(0)}.game-select-btn:disabled{opacity:.6;cursor:not-allowed;transform:none}.multiplayer-divider{display:flex;align-items:center;text-align:center;color:var(--color-text-secondary, #666);margin:1rem 0}.multiplayer-divider:before,.multiplayer-divider:after{content:"";flex:1;height:1px;background:var(--color-border, #e0e0e0)}.multiplayer-divider span{padding:0 1rem;background:#fff;font-size:.9rem;font-weight:500}.join-session-form{display:flex;gap:.75rem;justify-content:center;align-items:center;flex-wrap:wrap}.session-id-input{padding:.75rem 1rem;border:2px solid var(--color-border, #e0e0e0);border-radius:6px;font-size:1rem;min-width:200px;flex:1;max-width:300px;transition:border-color .2s ease}.session-id-input:focus{outline:none;border-color:var(--color-accent, #2196F3)}.join-btn{padding:.75rem 1.5rem;background:#4caf50;color:#fff;border:none;border-radius:6px;font-size:1rem;font-weight:500;cursor:pointer;transition:background-color .2s ease;white-space:nowrap}.join-btn:hover:not(:disabled){background:#45a049}.join-btn:disabled{opacity:.6;cursor:not-allowed}@media (max-width: 768px){.multiplayer-modal-overlay{padding:.5rem}.multiplayer-modal{width:100%;max-width:none}.multiplayer-modal-header{padding:1rem}.multiplayer-modal-header h2{font-size:1.1rem}.multiplayer-modal-content{padding:1rem}.multiplayer-session-setup{gap:1.5rem}.game-selection{flex-direction:column;align-items:center}.game-select-btn{width:100%;max-width:250px}.join-session-form{flex-direction:column;width:100%}.session-id-input{width:100%;max-width:none}.join-btn{width:100%}}@media (prefers-color-scheme: dark){.multiplayer-modal{background:var(--color-card, #2d2d30);color:var(--color-text, #ffffff)}.multiplayer-divider span{background:var(--color-card, #2d2d30)}.session-id-input{background:var(--color-surface, #3c3c3c);color:var(--color-text, #ffffff);border-color:var(--color-border, #555)}}.navigation{position:sticky;top:0;z-index:1000;background:var(--color-card, #ffffff);border-bottom:1px solid var(--color-border, #e0e0e0);box-shadow:0 2px 4px #0000001a;width:100%}.nav-content{display:flex;align-items:center;justify-content:space-between;padding:.75rem 1rem;max-width:1200px;margin:0 auto;min-height:60px}.nav-home-btn{background:var(--color-accent, #2196F3);color:#fff;border:none;border-radius:8px;padding:.5rem 1rem;font-size:.9rem;font-weight:500;cursor:pointer;transition:background-color .2s ease;display:flex;align-items:center;gap:.5rem}.nav-home-btn:hover{background:var(--color-accent-hover, #1976D2)}.nav-home-btn:active{transform:translateY(1px)}.nav-home-btn-current{background:var(--color-surface, #f0f0f0);color:var(--color-text, #666);cursor:default;opacity:.7}.nav-home-btn-current:hover{background:var(--color-surface, #f0f0f0);transform:none}.nav-user{display:flex;align-items:center;gap:.25rem}.nav-right{display:flex;align-items:center;gap:1rem}.nav-coins{display:flex;align-items:center;background:#4caf50;color:#fff;padding:.4rem .8rem;border-radius:20px;font-size:.85rem;font-weight:600;box-shadow:0 2px 4px #4caf504d;white-space:nowrap}.nav-profile-btn{width:32px;height:32px;border-radius:50%;background:var(--color-surface, #f0f0f0);border:2px solid var(--color-border, #e0e0e0);color:var(--color-text, #333);cursor:pointer;font-size:.7rem;font-weight:700;display:flex;align-items:center;justify-content:center;transition:all .2s ease;box-shadow:0 2px 4px #0000001a;margin-right:.25rem}.nav-profile-btn:last-of-type{margin-right:0}.nav-profile-btn:hover{background:var(--color-card, #ffffff);border-color:var(--color-accent, #2196F3);transform:translateY(-1px);box-shadow:0 3px 6px #00000026}.nav-profile-btn:active{transform:translateY(0)}.nav-profile-btn-current{background:var(--color-surface, #f0f0f0);border-color:var(--color-accent, #2196F3);cursor:pointer}.nav-profile-btn-current:hover{background:var(--color-card, #ffffff);border-color:var(--color-accent, #2196F3);transform:translateY(-1px);box-shadow:0 3px 6px #00000026}.nav-profile-btn-other{background:var(--color-surface, #f0f0f0);border-color:var(--color-border, #e0e0e0);opacity:.8;cursor:default}.nav-profile-btn-other:hover{background:var(--color-surface, #f0f0f0);border-color:var(--color-border, #e0e0e0);transform:none;box-shadow:0 2px 4px #0000001a}.nav-user-name{font-weight:600;color:var(--color-text, #333);font-size:.9rem;background:none;border:none;cursor:pointer;padding:.5rem .75rem;border-radius:6px;transition:background-color .2s ease}.nav-user-name:hover{background:var(--color-surface, #f0f0f0)}.nav-user-name:active{background:var(--color-border, #e0e0e0);transform:translateY(1px)}.nav-multiplayer-btn{width:32px;height:32px;border-radius:50%;background:var(--color-accent, #2196F3);color:#fff;border:none;cursor:pointer;font-size:1.2rem;font-weight:700;display:flex;align-items:center;justify-content:center;transition:all .2s ease;box-shadow:0 2px 4px #2196f34d}.nav-multiplayer-btn:hover{background:var(--color-accent-hover, #1976D2);transform:translateY(-1px);box-shadow:0 3px 6px #2196f366}.nav-multiplayer-btn:active{transform:translateY(0)}@media (max-width: 768px){.nav-content{padding:.75rem}.nav-home-btn{padding:.4rem .8rem;font-size:.85rem}.nav-right{gap:.75rem}.nav-coins{padding:.3rem .6rem;font-size:.8rem}.nav-profile-btn{width:28px;height:28px;font-size:.65rem;margin-right:.2rem}.nav-profile-btn:last-of-type{margin-right:0}.nav-user-name{font-size:.85rem;padding:.4rem .6rem}.nav-multiplayer-btn{width:28px;height:28px;font-size:1rem}}@media (max-width: 480px){.nav-content{padding:.5rem}.nav-home-btn{padding:.4rem .6rem;font-size:.8rem}.nav-right{gap:.5rem}.nav-coins{padding:.25rem .5rem;font-size:.75rem}.nav-profile-btn{width:26px;height:26px;font-size:.6rem;margin-right:.15rem}.nav-profile-btn:last-of-type{margin-right:0}.nav-user-name{font-size:.8rem;max-width:120px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding:.3rem .5rem}.nav-multiplayer-btn{width:26px;height:26px;font-size:.9rem}}.install-prompt{position:fixed;bottom:20px;left:50%;transform:translate(-50%);background:linear-gradient(135deg,#4caf50,#45a049);border-radius:12px;box-shadow:0 4px 20px #4caf504d;padding:16px 20px;max-width:90vw;width:400px;z-index:1000;animation:slideUp .3s ease-out}@keyframes slideUp{0%{transform:translate(-50%) translateY(100%);opacity:0}to{transform:translate(-50%) translateY(0);opacity:1}}.install-prompt-content{display:flex;align-items:center;gap:12px;color:#fff}.install-prompt-icon{font-size:24px;flex-shrink:0}.install-prompt-text{flex:1;min-width:0}.install-prompt-text h3{margin:0 0 4px;font-size:16px;font-weight:600}.install-prompt-text p{margin:0;font-size:14px;opacity:.9;line-height:1.3}.install-prompt-actions{flex-shrink:0}.install-button{background:#fff3;border:1px solid rgba(255,255,255,.3);color:#fff;padding:8px 16px;border-radius:8px;font-size:14px;font-weight:500;cursor:pointer;display:flex;align-items:center;gap:6px;transition:all .2s ease;white-space:nowrap}.install-button:hover:not(:disabled){background:#ffffff4d;transform:translateY(-1px)}.install-button:active:not(:disabled){transform:translateY(0)}.install-button:disabled{opacity:.7;cursor:not-allowed}.install-icon{font-size:16px}.loading-spinner{width:14px;height:14px;border:2px solid rgba(255,255,255,.3);border-top:2px solid white;border-radius:50%;animation:spin 1s linear infinite}@media (max-width: 768px){.install-prompt{bottom:10px;left:10px;right:10px;transform:none;width:auto;max-width:none}.install-prompt-content{flex-direction:column;text-align:center;gap:8px}.install-prompt-text{order:1}.install-prompt-icon{order:0}.install-prompt-actions{order:2}.install-button{padding:10px 20px;font-size:16px}}@media (max-width: 320px){.install-prompt-text p{display:none}}.game-layout{display:flex;flex-direction:column;height:100vh;width:100vw;position:fixed;top:0;left:0;z-index:10;background:#f8f9fa;font-family:Arial,sans-serif}.game-layout__field{flex:1;display:flex;align-items:center;justify-content:center;padding:1rem;overflow:hidden;background:#f8f9fa;min-height:0}.game-layout__bottom-stripe{flex-shrink:0;background:#fff;border-top:2px solid #e9ecef;box-shadow:0 -2px 8px #0000001a;display:flex;flex-wrap:wrap;gap:1rem;padding:.75rem 1rem;align-items:center;justify-content:space-between;max-height:25vh;overflow-y:auto;z-index:20}.game-layout__info{flex:0 0 auto;min-width:200px}.game-layout__info h1,.game-layout__info h2{margin:0 0 .25rem;color:#333;font-size:1.25rem;font-weight:600}.game-layout__info p{margin:0;color:#666;font-size:.9rem}.game-layout__stats{flex:1 1 auto;display:flex;flex-wrap:wrap;gap:1rem;justify-content:center;min-width:200px}.game-layout__stats>*{flex:0 0 auto}.game-layout__controls{flex:0 0 auto;display:flex;flex-wrap:wrap;gap:.5rem;align-items:center;min-width:200px;justify-content:flex-end}.game-layout__controls button{padding:.5rem 1rem;border:1px solid #ddd;background:#fff;border-radius:4px;cursor:pointer;font-size:.9rem;transition:all .2s ease;white-space:nowrap}.game-layout__controls button:hover:not(:disabled){background:#f8f9fa;border-color:#adb5bd}.game-layout__controls button:disabled{opacity:.5;cursor:not-allowed}.game-layout__controls button.primary{background:#007bff;color:#fff;border-color:#007bff}.game-layout__controls button.primary:hover:not(:disabled){background:#0056b3;border-color:#0056b3}.game-layout__controls button.danger{background:#dc3545;color:#fff;border-color:#dc3545}.game-layout__controls button.danger:hover:not(:disabled){background:#c82333;border-color:#c82333}.game-layout__controls button.success{background:#28a745;color:#fff;border-color:#28a745}.game-layout__controls button.success:hover:not(:disabled){background:#218838;border-color:#218838}@media (max-width: 768px){.game-layout__field{padding:.5rem}.game-layout__bottom-stripe{flex-direction:column;align-items:stretch;padding:.5rem;gap:.5rem;max-height:30vh}.game-layout__info,.game-layout__stats,.game-layout__controls{min-width:auto;flex:1 1 auto}.game-layout__stats{justify-content:space-between}.game-layout__controls{justify-content:center}.game-layout__controls button{flex:1 1 auto;min-width:80px}}@media (max-width: 480px){.game-layout__field{padding:.25rem}.game-layout__bottom-stripe{max-height:35vh;padding:.5rem .25rem}.game-layout__info h1,.game-layout__info h2{font-size:1.1rem}.game-layout__info p{font-size:.8rem}.game-layout__controls button{font-size:.8rem;padding:.4rem .75rem}}@media (prefers-reduced-motion: reduce){.game-layout__controls button{transition:none}}@media print{.game-layout__bottom-stripe{display:none}.game-layout{position:static;height:auto}}.game2048-game-field{display:flex;flex-direction:column;align-items:center;width:100%;height:100%;justify-content:center}.game2048-container{display:flex;flex-direction:column;align-items:center;padding:1.5rem;max-width:520px;margin:0 auto;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,sans-serif;background:linear-gradient(135deg,#faf8ef,#f2ebe5);border-radius:20px;box-shadow:0 10px 30px #0000001a,0 1px 8px #0000000d;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.2)}.game2048-header{text-align:center;margin-bottom:1.5rem}.game2048-title{font-size:3.5rem;font-weight:900;background:linear-gradient(135deg,#776e65,#8f7a66);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent;margin:0;letter-spacing:-2px;text-shadow:0 4px 8px rgba(119,110,101,.3)}.game2048-subtitle{color:#8f7a66;font-size:1.1rem;margin:.5rem 0 0;font-weight:500}.game2048-score-container{display:flex;gap:1.2rem;margin-bottom:1.5rem}.game2048-score-box{background:linear-gradient(135deg,#bbada0,#a39186);color:#fff;padding:.8rem 1.2rem;border-radius:12px;text-align:center;min-width:90px;box-shadow:0 4px 12px #bbada066,0 2px 4px #0000001a;border:1px solid rgba(255,255,255,.1);position:relative;overflow:hidden}.game2048-score-box:before{content:"";position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,rgba(255,255,255,.3),transparent)}.game2048-score-label{font-size:.75rem;font-weight:700;text-transform:uppercase;letter-spacing:1px;margin-bottom:.3rem;opacity:.9}.game2048-score-value{font-size:1.4rem;font-weight:800;text-shadow:0 1px 2px rgba(0,0,0,.2)}.game2048-controls{display:flex;gap:.8rem;margin-bottom:1.5rem;flex-wrap:wrap;justify-content:center}.game2048-btn{padding:.7rem 1.4rem;border:none;border-radius:10px;font-size:.9rem;font-weight:600;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);position:relative;overflow:hidden;box-shadow:0 4px 12px #00000026,0 2px 4px #0000001a;border:1px solid rgba(255,255,255,.1)}.game2048-btn:before{content:"";position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,rgba(255,255,255,.4),transparent)}.game2048-btn:hover{transform:translateY(-2px);box-shadow:0 6px 20px #0003,0 4px 8px #00000026}.game2048-btn:active{transform:translateY(0);box-shadow:0 2px 8px #0003}.game2048-btn:disabled{opacity:.4;cursor:not-allowed;transform:none!important;box-shadow:0 2px 6px #0000001a!important}.game2048-btn-primary{background:linear-gradient(135deg,#8f7a66,#776e65);color:#fff}.game2048-btn-secondary{background:linear-gradient(135deg,#bbada0,#a39186);color:#fff}.game2048-btn-danger{background:linear-gradient(135deg,#f65e3b,#e54b2d);color:#fff}.game2048-grid-container{position:relative;background:linear-gradient(135deg,#bbada0,#a39186);border-radius:16px;padding:12px;margin-bottom:1.5rem;box-shadow:0 6px 20px #bbada066,0 2px 8px #0000001a,inset 0 1px #ffffff1a;border:1px solid rgba(255,255,255,.05)}.game2048-grid{display:grid;grid-template-columns:repeat(4,78px);grid-template-rows:repeat(4,78px);gap:10px;width:340px;height:340px}.game2048-cell{background:linear-gradient(135deg,#cdc1b4,#bfb3a6);border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:2.2rem;font-weight:800;width:78px;height:78px;transition:all .15s cubic-bezier(.4,0,.2,1);position:relative;box-shadow:inset 0 1px 2px #ffffff1a,0 1px 3px #0000001a;border:1px solid rgba(255,255,255,.05)}.game2048-cell-moving{transition:transform .15s ease-in-out;z-index:2}.game2048-cell-merging{transition:all .2s ease-in-out;z-index:3}.game2048-cell-merged{animation:tile-merge .2s ease-in-out}.game2048-cell-new{animation:tile-appear .2s ease-in-out}.game2048-tile-2{background:linear-gradient(135deg,#eee4da,#e6dcd2);color:#776e65;box-shadow:0 2px 8px #eee4da4d,inset 0 1px #ffffff4d}.game2048-tile-4{background:linear-gradient(135deg,#ede0c8,#e5d4b8);color:#776e65;box-shadow:0 2px 8px #ede0c84d,inset 0 1px #ffffff4d}.game2048-tile-8{background:linear-gradient(135deg,#f2b179,#f0a865);color:#f9f6f2;box-shadow:0 2px 8px #f2b17966,inset 0 1px #fff3;text-shadow:0 1px 2px rgba(0,0,0,.1)}.game2048-tile-16{background:linear-gradient(135deg,#f59563,#f3884f);color:#f9f6f2;box-shadow:0 2px 8px #f5956366,inset 0 1px #fff3;text-shadow:0 1px 2px rgba(0,0,0,.1)}.game2048-tile-32{background:linear-gradient(135deg,#f67c5f,#f46d4b);color:#f9f6f2;box-shadow:0 2px 8px #f67c5f66,inset 0 1px #fff3;text-shadow:0 1px 2px rgba(0,0,0,.15)}.game2048-tile-64{background:linear-gradient(135deg,#f65e3b,#f44d27);color:#f9f6f2;box-shadow:0 2px 8px #f65e3b80,inset 0 1px #fff3;text-shadow:0 1px 2px rgba(0,0,0,.2)}.game2048-tile-128{background:linear-gradient(135deg,#edcf72,#e6c862);color:#f9f6f2;font-size:2rem;box-shadow:0 3px 12px #edcf7280,inset 0 1px #fff3;text-shadow:0 1px 3px rgba(0,0,0,.2)}.game2048-tile-256{background:linear-gradient(135deg,#edcc61,#e6c551);color:#f9f6f2;font-size:2rem;box-shadow:0 3px 12px #edcc6180,inset 0 1px #fff3;text-shadow:0 1px 3px rgba(0,0,0,.2)}.game2048-tile-512{background:linear-gradient(135deg,#edc850,#e6c140);color:#f9f6f2;font-size:2rem;box-shadow:0 3px 12px #edc85099,inset 0 1px #fff3;text-shadow:0 1px 3px rgba(0,0,0,.2)}.game2048-tile-1024{background:linear-gradient(135deg,#edc53f,#e6be2f);color:#f9f6f2;font-size:1.7rem;box-shadow:0 4px 16px #edc53f99,inset 0 1px #fff3;text-shadow:0 1px 3px rgba(0,0,0,.25)}.game2048-tile-2048{background:linear-gradient(135deg,#edc22e,#ffdf3a);color:#f9f6f2;font-size:1.7rem;box-shadow:0 4px 20px #edc22eb3,0 0 20px #ffdf3a4d,inset 0 1px #ffffff4d;text-shadow:0 1px 4px rgba(0,0,0,.3);animation:pulse-glow 2s ease-in-out infinite alternate}.game2048-instructions{text-align:center;color:#8f7a66;font-size:.95rem;max-width:340px;line-height:1.5;background:#fff6;padding:1rem;border-radius:12px;box-shadow:0 2px 8px #0000000d;border:1px solid rgba(255,255,255,.3);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.game2048-swipe-hint{color:#8f7a66;font-size:.85rem;margin-top:.5rem;padding:.7rem;background:#f9f6f2cc;border-radius:8px;border:1px solid rgba(143,122,102,.2);-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px)}.game2048-game-over{position:absolute;inset:0;background:#fffffff2;display:flex;flex-direction:column;align-items:center;justify-content:center;border-radius:16px;z-index:10;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:inset 0 0 0 1px #ffffff4d}.game2048-game-over-title{font-size:2.5rem;font-weight:800;background:linear-gradient(135deg,#776e65,#8f7a66);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent;margin-bottom:1rem;text-shadow:0 2px 4px rgba(119,110,101,.2)}.game2048-game-over-message{color:#8f7a66;margin-bottom:1rem;text-align:center;font-size:1.1rem;font-weight:500}.game2048-status{text-align:center;margin-bottom:1.5rem;padding:.8rem 1.5rem;border-radius:12px;font-weight:600;font-size:1rem;box-shadow:0 4px 12px #0000001a;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.2)}.game2048-status-won{background:linear-gradient(135deg,#e8f5e8,#d4edda);color:#28a745;border-color:#28a745;animation:celebrate .6s ease-in-out}.game2048-status-over{background:linear-gradient(135deg,#fde8e8,#f8d7da);color:#dc3545;border-color:#dc3545}@media (max-width: 600px){.game2048-container{padding:1rem;border-radius:16px;margin:.5rem}.game2048-title{font-size:3rem}.game2048-grid{grid-template-columns:repeat(4,70px);grid-template-rows:repeat(4,70px);width:312px;height:312px;gap:8px}.game2048-cell{width:70px;height:70px;font-size:1.9rem}.game2048-tile-128,.game2048-tile-256,.game2048-tile-512{font-size:1.7rem}.game2048-tile-1024,.game2048-tile-2048{font-size:1.4rem}.game2048-controls{justify-content:center;gap:.6rem}.game2048-score-container{justify-content:center;gap:.8rem}.game2048-instructions{margin-top:.5rem;max-width:312px;padding:.8rem}.game2048-instructions p{margin:.25rem 0}}@keyframes celebrate{0%,to{transform:scale(1) rotate(0)}25%{transform:scale(1.05) rotate(-1deg)}75%{transform:scale(1.05) rotate(1deg)}}.game2048-cell:not([class*=game2048-tile-]):hover{background:linear-gradient(135deg,#d4c8bb,#c7bbae);transform:scale(1.02)}.game2048-cell[class*=game2048-tile-]:hover{transform:scale(1.02);z-index:1}@keyframes tile-appear{0%{opacity:0;transform:scale(.2) rotate(-5deg)}50%{transform:scale(1.15) rotate(2deg)}to{opacity:1;transform:scale(1) rotate(0)}}@keyframes tile-merge{0%{transform:scale(1);box-shadow:inherit}50%{transform:scale(1.25);box-shadow:0 4px 20px #edc22ecc,0 0 25px #ffdf3a66}to{transform:scale(1);box-shadow:inherit}}@keyframes score-increase{0%{transform:scale(1);color:inherit}50%{transform:scale(1.2);color:#f67c5f;text-shadow:0 0 15px rgba(246,124,95,.6)}to{transform:scale(1);color:inherit;text-shadow:inherit}}@keyframes pulse-glow{0%{box-shadow:0 4px 20px #edc22eb3,0 0 20px #ffdf3a4d,inset 0 1px #ffffff4d}to{box-shadow:0 4px 25px #edc22ee6,0 0 30px #ffdf3a80,inset 0 1px #fff6}}.game2048-tile-new{animation:tile-appear .4s cubic-bezier(.68,-.55,.265,1.55)}.game2048-score-animated{animation:score-increase .5s cubic-bezier(.4,0,.2,1)}.game2048-btn-theme{background:linear-gradient(135deg,#9c27b0,#7b1fa2);color:#fff;border:none;padding:.75rem 1rem;border-radius:8px;font-weight:600;cursor:pointer;transition:all .2s ease;margin:0 .25rem}.game2048-btn-theme:hover{transform:translateY(-2px);box-shadow:0 6px 20px #9c27b04d}.game2048-theme-selector{width:100%;max-width:500px;margin:1rem 0;padding:1rem;background:#ffffffe6;border-radius:12px;box-shadow:0 8px 25px #0000001a}.game2048-theme-selector h3{text-align:center;margin:0 0 1rem;color:#776e65;font-size:1.2rem}.game2048-themes-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:1rem;width:100%}.game2048-theme-card{padding:.75rem;border-radius:8px;cursor:pointer;transition:all .2s ease;border:2px solid transparent;text-align:center;position:relative}.game2048-theme-card:hover{transform:translateY(-2px);box-shadow:0 6px 20px #0000001a}.game2048-theme-card.current{border-width:3px;box-shadow:0 0 15px #0003}.game2048-theme-card.locked:hover{transform:none}.theme-preview{display:flex;gap:2px;justify-content:center;margin-bottom:.5rem;padding:.25rem;border-radius:4px}.theme-tile{width:20px;height:20px;border-radius:2px;display:flex;align-items:center;justify-content:center;font-size:8px;font-weight:700}.theme-info h4{margin:.25rem 0;font-size:.9rem;font-weight:600}.theme-info p{margin:.25rem 0;font-size:.7rem;line-height:1.2}.theme-cost{font-size:.8rem;font-weight:700;color:#4caf50;margin:.25rem 0}.theme-cost.insufficient{color:#f44336}.current-badge{position:absolute;top:-5px;right:-5px;background:#4caf50;color:#fff;border-radius:50%;width:20px;height:20px;display:flex;align-items:center;justify-content:center;font-size:10px;font-weight:700}.game2048-score-container{display:flex;gap:1rem;margin-bottom:1.5rem;flex-wrap:wrap;justify-content:center}.game2048-score-box:nth-child(3){background:linear-gradient(135deg,gold,orange);color:#8b4513}@media (max-width: 480px){.game2048-themes-grid{grid-template-columns:repeat(2,1fr)}.game2048-theme-card{padding:.5rem}.game2048-score-container{gap:.5rem}.game2048-controls{flex-wrap:wrap;gap:.5rem}}.tic-tac-toe-game{padding:2rem;max-width:700px;margin:0 auto;background:var(--color-card, #ffffff);border-radius:20px;box-shadow:0 8px 32px #0000001a;font-family:var(--font-primary, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif);border:1px solid var(--color-border, rgba(255, 255, 255, .18));-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);transition:all .3s cubic-bezier(.4,0,.2,1);display:flex;flex-direction:column;align-items:center}.tic-tac-toe-game-field{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;padding:1rem;background-color:var(--color-gameBackground, #f8f9fa);color:var(--color-text, #333)}.tic-tac-toe-status-message{font-size:1.5rem;font-weight:700;margin-bottom:1.5rem;text-align:center;color:var(--color-text, #333)}.tic-tac-toe-status-message.winner{color:var(--color-success, #4CAF50)}.tic-tac-toe-status-message.playing{color:var(--color-text, #333)}.tic-tac-toe-board-wrapper{display:inline-block;border:2px solid var(--color-border, #333);border-radius:12px;overflow:hidden;background-color:var(--color-border, #333)}.tic-tac-toe-board-slot{display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(3,1fr);gap:clamp(2px,.5vw,4px);width:100%;height:100%}.tic-tac-toe-cell-slot{background-color:var(--color-gameSurface, #fff);border:none;font-weight:700;cursor:pointer;display:flex;align-items:center;justify-content:center;color:var(--color-text, #333);transition:all .3s ease;aspect-ratio:1;min-height:40px;min-width:40px;border-radius:clamp(4px,1vw,8px);touch-action:manipulation}.tic-tac-toe-cell-slot:hover{background-color:var(--color-surface, #f0f0f0)}.tic-tac-toe-cell-slot.x-mark{color:var(--color-accent, #2196F3)}.tic-tac-toe-cell-slot.o-mark{color:var(--color-error, #f44336)}.tic-tac-toe-cell-slot.winning-cell{background-color:var(--color-warning, #ffeb3b)!important;border:3px solid var(--color-accent, #ff9800)}.tic-tac-toe-cell-slot:disabled{cursor:default}.tic-tac-toe-header{text-align:center;margin-bottom:2rem}.tic-tac-toe-header h2{margin:0 0 .75rem;color:var(--color-text, #333);font-size:clamp(2rem,5vw,2.5rem);font-weight:700;letter-spacing:-.02em;background:linear-gradient(135deg,var(--color-accent, #2196F3) 0%,var(--color-accentHover, #1976D2) 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.tic-tac-toe-header p{margin:0;color:var(--color-textSecondary, #666);font-size:1.1rem;font-weight:400}.tic-tac-toe-loading{padding:3rem;text-align:center;background:var(--color-card, #ffffff);border-radius:20px;box-shadow:0 4px 20px #0000001a}.tic-tac-toe-loading h2{color:var(--color-text, #333);margin:0;font-size:1.5rem;font-weight:600}.tic-tac-toe-status{margin-bottom:2rem;padding:1.5rem;background:var(--color-surface, rgba(255, 255, 255, .8));border-radius:16px;border:1px solid var(--color-border, rgba(255, 255, 255, .2));-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);transition:all .3s ease}.tic-tac-toe-status-message{font-size:clamp(1.25rem,4vw,1.75rem);font-weight:700;margin-bottom:1rem;text-align:center;color:var(--color-text, #333);transition:all .5s cubic-bezier(.4,0,.2,1);transform:translateY(0)}.tic-tac-toe-status-message.winner{color:var(--color-success, #4CAF50);text-shadow:0 2px 20px rgba(76,175,80,.3);animation:celebrate .8s cubic-bezier(.68,-.55,.265,1.55)}.tic-tac-toe-status-message.playing{color:var(--color-accent, #2196F3)}.tic-tac-toe-stats{font-size:1rem;color:var(--color-textMuted, #777);font-weight:500;display:flex;justify-content:center;gap:1rem;flex-wrap:wrap}.tic-tac-toe-stats span{padding:.25rem .75rem;background:var(--color-gameBackground, rgba(248, 249, 250, .8));border-radius:12px;border:1px solid var(--color-border, rgba(0, 0, 0, .1));font-weight:600;white-space:nowrap}.tic-tac-toe-board-container{margin-bottom:2.5rem;display:flex;justify-content:center;align-items:center;perspective:1000px}.tic-tac-toe-board{display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(3,1fr);gap:clamp(6px,1.5vw,12px);width:clamp(280px,min(85vw,80vh),480px);height:clamp(280px,min(85vw,80vh),480px);padding:clamp(12px,2.5vw,20px);background:var(--color-gameSurface, rgba(255, 255, 255, .9));border-radius:clamp(16px,3vw,24px);box-shadow:0 20px 40px #0000001a,0 8px 16px #0000000d,inset 0 1px #ffffff80;border:2px solid var(--color-border, rgba(255, 255, 255, .3));-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);transition:all .4s cubic-bezier(.4,0,.2,1)}.tic-tac-toe-board:hover{transform:translateY(-2px);box-shadow:0 25px 50px #00000026,0 10px 20px #0000001a,inset 0 1px #fff9}.tic-tac-toe-cell{background:var(--color-card, rgba(255, 255, 255, .8));border:none;font-size:clamp(1.5rem,calc(1.5rem + 2.5vw),4rem);font-weight:900;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .3s cubic-bezier(.4,0,.2,1);color:var(--color-text, #333);border-radius:clamp(8px,2vw,16px);box-shadow:0 4px 12px #0000001a,inset 0 1px #ffffff80;border:1px solid var(--color-border, rgba(255, 255, 255, .2));-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);min-height:clamp(70px,12vw,120px);min-width:clamp(70px,12vw,120px);aspect-ratio:1;position:relative;overflow:hidden;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent}.tic-tac-toe-cell:before{content:"";position:absolute;inset:0;background:linear-gradient(135deg,#fff3,#fff0);opacity:0;transition:opacity .3s ease;pointer-events:none}.tic-tac-toe-cell:hover:before{opacity:1}.tic-tac-toe-cell:hover{transform:translateY(-2px) scale(1.02);box-shadow:0 8px 20px #00000026,inset 0 1px #ffffffb3}.tic-tac-toe-cell.empty.playable:hover{background:var(--color-accent, rgba(33, 150, 243, .1));border-color:var(--color-accent, #2196F3)}.tic-tac-toe-cell.filled{cursor:default;transform:none!important}.tic-tac-toe-cell.x-mark{color:var(--color-accent, #2196F3);text-shadow:0 2px 20px rgba(33,150,243,.3);animation:placeSymbol .4s cubic-bezier(.68,-.55,.265,1.55)}.tic-tac-toe-cell.o-mark{color:var(--color-error, #f44336);text-shadow:0 2px 20px rgba(244,67,54,.3);animation:placeSymbol .4s cubic-bezier(.68,-.55,.265,1.55)}.tic-tac-toe-cell.winning-cell{background:linear-gradient(135deg,var(--color-success, #4CAF50) 0%,var(--color-warning, #8BC34A) 100%)!important;color:#fff!important;text-shadow:0 2px 10px rgba(0,0,0,.3)!important;box-shadow:0 8px 25px #4caf5066,inset 0 1px #ffffff4d!important;animation:winningCell .8s cubic-bezier(.4,0,.2,1);transform:scale(1.05)!important}.tic-tac-toe-controls{margin-bottom:2rem;display:flex;justify-content:center}.tic-tac-toe-new-game-btn{font-size:1.125rem;font-weight:600;padding:1rem 2rem;background:linear-gradient(135deg,var(--color-success, #4CAF50) 0%,var(--color-accent, #2196F3) 100%);color:#fff;border:none;border-radius:16px;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);box-shadow:0 4px 15px #4caf504d,inset 0 1px #fff3;text-shadow:0 1px 2px rgba(0,0,0,.1);letter-spacing:.025em;text-transform:uppercase;position:relative;overflow:hidden}.tic-tac-toe-new-game-btn:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.2),transparent);transition:left .5s}.tic-tac-toe-new-game-btn:hover{transform:translateY(-2px);box-shadow:0 8px 25px #4caf5066,inset 0 1px #ffffff4d}.tic-tac-toe-new-game-btn:hover:before{left:100%}.tic-tac-toe-new-game-btn:active{transform:translateY(0);transition:transform .1s}@keyframes placeSymbol{0%{opacity:0;transform:scale(.5) rotate(180deg)}50%{transform:scale(1.2) rotate(90deg)}to{opacity:1;transform:scale(1) rotate(0)}}@keyframes celebrate{0%{transform:scale(1)}50%{transform:scale(1.1)}to{transform:scale(1)}}@keyframes winningCell{0%{transform:scale(1);box-shadow:0 4px 12px #0000001a}25%{transform:scale(1.1);box-shadow:0 8px 25px #4caf5099}50%{transform:scale(1.05);box-shadow:0 12px 35px #4caf50cc}to{transform:scale(1.05);box-shadow:0 8px 25px #4caf5066}}@keyframes fadeIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes slideUp{0%{transform:translateY(100%);opacity:0}to{transform:translateY(0);opacity:1}}.tic-tac-toe-save-section{margin-bottom:2rem;background:var(--color-surface, rgba(255, 255, 255, .6));border-radius:16px;border:1px solid var(--color-border, rgba(255, 255, 255, .2));-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);overflow:hidden;transition:all .3s ease;width:100%;max-width:500px}.tic-tac-toe-save-section.collapsed{max-height:60px}.tic-tac-toe-save-section.expanded{max-height:400px}.tic-tac-toe-save-header{padding:1rem 1.5rem;cursor:pointer;display:flex;align-items:center;justify-content:space-between;background:var(--color-gameBackground, rgba(248, 249, 250, .8));transition:all .2s ease}.tic-tac-toe-save-header:hover{background:var(--color-surface, rgba(245, 245, 245, .9))}.tic-tac-toe-save-header h3{margin:0;color:var(--color-text, #333);font-size:1.125rem;font-weight:600}.tic-tac-toe-save-toggle{font-size:1.25rem;color:var(--color-textMuted, #777);transition:transform .3s ease}.tic-tac-toe-save-toggle.expanded{transform:rotate(180deg)}.tic-tac-toe-save-content{padding:1.5rem;animation:fadeIn .3s ease}.tic-tac-toe-autosave-toggle{display:flex;align-items:center;justify-content:center;gap:.75rem;margin-bottom:1.5rem;padding:1rem;background:var(--color-card, rgba(255, 255, 255, .8));border-radius:12px;border:1px solid var(--color-border, rgba(0, 0, 0, .1))}.tic-tac-toe-autosave-toggle input[type=checkbox]{width:20px;height:20px;accent-color:var(--color-success, #4CAF50)}.tic-tac-toe-autosave-toggle label{color:var(--color-text, #333);font-weight:500;cursor:pointer}.tic-tac-toe-save-buttons{display:flex;gap:.75rem;justify-content:center;flex-wrap:wrap;margin-bottom:1rem}.tic-tac-toe-save-btn{padding:.75rem 1.25rem;border:none;border-radius:12px;cursor:pointer;font-size:.9rem;font-weight:600;transition:all .3s cubic-bezier(.4,0,.2,1);text-transform:uppercase;letter-spacing:.025em;position:relative;overflow:hidden}.tic-tac-toe-save-btn:disabled{opacity:.5;cursor:not-allowed;transform:none!important}.tic-tac-toe-save-btn:not(:disabled):hover{transform:translateY(-1px)}.tic-tac-toe-save-btn.save{background:linear-gradient(135deg,var(--color-accent, #2196F3) 0%,#1976D2 100%);color:#fff;box-shadow:0 4px 15px #2196f34d}.tic-tac-toe-save-btn.save:hover{box-shadow:0 6px 20px #2196f366}.tic-tac-toe-save-btn.load{background:linear-gradient(135deg,var(--color-warning, #FF9800) 0%,#F57C00 100%);color:#fff;box-shadow:0 4px 15px #ff98004d}.tic-tac-toe-save-btn.load:hover{box-shadow:0 6px 20px #ff980066}.tic-tac-toe-save-btn.delete{background:linear-gradient(135deg,var(--color-error, #f44336) 0%,#da190b 100%);color:#fff;box-shadow:0 4px 15px #f443364d}.tic-tac-toe-save-btn.delete:hover{box-shadow:0 6px 20px #f4433666}.tic-tac-toe-save-status{padding:1rem;border-radius:12px;font-size:.9rem;font-weight:500;text-align:center;border:1px solid;margin-bottom:1rem}.tic-tac-toe-save-status.has-save{background:#4caf501a;color:var(--color-success, #4CAF50);border-color:var(--color-success, #4CAF50)}.tic-tac-toe-save-status.no-save{background:#ff98001a;color:var(--color-warning, #FF9800);border-color:var(--color-warning, #FF9800)}@media (min-width: 769px) and (max-width: 1199px){.tic-tac-toe-board{width:clamp(320px,min(70vw,70vh),400px);height:clamp(320px,min(70vw,70vh),400px);gap:clamp(8px,1.5vw,10px);padding:clamp(14px,2.5vw,18px)}.tic-tac-toe-cell{font-size:clamp(2rem,calc(1.5rem + 3vw),3.5rem);min-height:clamp(85px,12vw,110px);min-width:clamp(85px,12vw,110px)}}@media (min-width: 481px) and (max-width: 768px){.tic-tac-toe-game{padding:1.5rem 1rem;margin:.5rem;border-radius:16px}.tic-tac-toe-header h2{font-size:clamp(1.75rem,6vw,2rem)}.tic-tac-toe-board{width:clamp(300px,min(80vw,75vh),360px);height:clamp(300px,min(80vw,75vh),360px);gap:clamp(6px,1.5vw,8px);padding:clamp(12px,2.5vw,16px)}.tic-tac-toe-cell{font-size:clamp(1.75rem,calc(1.5rem + 3.5vw),3rem);min-height:clamp(75px,13vw,95px);min-width:clamp(75px,13vw,95px)}.tic-tac-toe-status{margin-bottom:1.5rem;padding:1.25rem}.tic-tac-toe-status-message{font-size:clamp(1.125rem,5vw,1.5rem);margin-bottom:.75rem}.tic-tac-toe-stats{font-size:.9rem;gap:.5rem}.tic-tac-toe-new-game-btn{font-size:1rem;padding:.875rem 1.5rem}}@media (min-width: 376px) and (max-width: 480px){.tic-tac-toe-game{padding:1.25rem .875rem;margin:.375rem;border-radius:14px}.tic-tac-toe-board{width:clamp(280px,min(85vw,80vh),320px);height:clamp(280px,min(85vw,80vh),320px);gap:clamp(5px,1.2vw,6px);padding:clamp(10px,2.2vw,14px)}.tic-tac-toe-cell{font-size:clamp(1.5rem,calc(1.25rem + 4vw),2.5rem);min-height:clamp(65px,15vw,85px);min-width:clamp(65px,15vw,85px)}.tic-tac-toe-header h2{font-size:clamp(1.5rem,7vw,1.875rem)}.tic-tac-toe-status-message{font-size:clamp(1rem,5.5vw,1.25rem)}}@media (max-width: 375px){.tic-tac-toe-game{padding:1rem .75rem;margin:.25rem;border-radius:12px}.tic-tac-toe-board{width:clamp(260px,min(90vw,85vh),300px);height:clamp(260px,min(90vw,85vh),300px);gap:clamp(4px,1vw,5px);padding:clamp(8px,2vw,12px)}.tic-tac-toe-cell{font-size:clamp(1.25rem,calc(1rem + 4.5vw),2.25rem);min-height:clamp(60px,18vw,75px);min-width:clamp(60px,18vw,75px);border-radius:clamp(6px,1.5vw,12px)}.tic-tac-toe-header h2{font-size:clamp(1.375rem,8vw,1.75rem);margin-bottom:.5rem}.tic-tac-toe-header p{font-size:.9rem}.tic-tac-toe-status{padding:1rem;margin-bottom:1.25rem}.tic-tac-toe-status-message{font-size:clamp(.875rem,6vw,1.125rem)}.tic-tac-toe-stats{font-size:.8rem;gap:.25rem}.tic-tac-toe-stats span{padding:.2rem .4rem;font-size:.75rem}.tic-tac-toe-new-game-btn{font-size:.9rem;padding:.75rem 1.25rem}.tic-tac-toe-save-header h3{font-size:1rem}.tic-tac-toe-board-slot{width:clamp(240px,min(95vw,90vh),280px);height:clamp(240px,min(95vw,90vh),280px)}.tic-tac-toe-cell-slot{font-size:clamp(1rem,12vw,2rem);border-radius:clamp(6px,1.5vw,10px)}.tic-tac-toe-save-buttons{flex-direction:column;align-items:center;gap:.75rem}.tic-tac-toe-save-btn{width:100%;max-width:250px;padding:1rem 1.25rem}.tic-tac-toe-save-header{padding:1rem}.tic-tac-toe-save-content{padding:1.25rem}}@media (prefers-contrast: high){.tic-tac-toe-cell{border-width:2px}.tic-tac-toe-cell.winning-cell{border-width:3px}}@media (min-width: 1200px) and (max-width: 1599px){.tic-tac-toe-board{width:clamp(400px,min(60vw,65vh),500px);height:clamp(400px,min(60vw,65vh),500px);gap:clamp(10px,1.8vw,14px);padding:clamp(18px,3vw,24px)}.tic-tac-toe-cell{font-size:clamp(2.5rem,calc(2rem + 2vw),4.5rem);min-height:clamp(100px,11vw,140px);min-width:clamp(100px,11vw,140px)}}@media (min-width: 1600px){.tic-tac-toe-board{width:clamp(500px,min(45vw,55vh),600px);height:clamp(500px,min(45vw,55vh),600px);gap:clamp(12px,2vw,16px);padding:clamp(20px,3.5vw,28px)}.tic-tac-toe-cell{font-size:clamp(3rem,calc(2.5rem + 1.5vw),5rem);min-height:clamp(120px,10vw,160px);min-width:clamp(120px,10vw,160px)}.tic-tac-toe-game{max-width:900px}}@media (orientation: landscape) and (max-height: 600px){.tic-tac-toe-board{width:clamp(250px,min(70vw,75vh),400px);height:clamp(250px,min(70vw,75vh),400px)}.tic-tac-toe-game{padding:1rem}.tic-tac-toe-status{margin-bottom:1rem;padding:1rem}}@media (orientation: portrait) and (min-height: 800px){.tic-tac-toe-board{width:clamp(320px,min(75vw,60vh),450px);height:clamp(320px,min(75vw,60vh),450px)}}@media (prefers-reduced-motion: reduce){.tic-tac-toe-cell,.tic-tac-toe-new-game-btn,.tic-tac-toe-save-btn,.tic-tac-toe-board,.tic-tac-toe-status-message{transition:none!important}.tic-tac-toe-cell.x-mark,.tic-tac-toe-cell.o-mark,.tic-tac-toe-cell.winning-cell,.tic-tac-toe-status-message.winner{animation:none!important}}.sudoku-game{display:flex;flex-direction:column;align-items:center;padding:1rem;max-width:800px;margin:0 auto;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;background-color:var(--color-gameBackground, #f8f9fa);color:var(--color-text, #333)}.sudoku-game-field{display:flex;flex-direction:column;align-items:center;justify-content:flex-start;height:100%;width:100%;padding:clamp(.5rem,2vw,1rem);background-color:var(--color-gameBackground, #f8f9fa);color:var(--color-text, #333);gap:clamp(.5rem,2vw,1rem);overflow-y:auto;min-height:100vh;min-height:100dvh}.modern-sudoku-board{display:grid;grid-template-columns:repeat(9,1fr);grid-template-rows:repeat(9,1fr);background-color:var(--color-border, #2c3e50);border:min(3px,.5vw) solid var(--color-border, #2c3e50);border-radius:min(12px,2vw);padding:min(3px,.5vw);margin:clamp(.5rem,2vw,1rem) 0;width:min(95vw,min(95vh,600px));height:min(95vw,min(95vh,600px));aspect-ratio:1;gap:max(.5px,min(2px,.3vw));box-shadow:0 min(8px,1vw) min(32px,4vw) #0000001a;margin-left:auto;margin-right:auto;position:relative}.modern-sudoku-cell{background-color:var(--color-surface, #ffffff);border:none;display:flex;align-items:center;justify-content:center;position:relative;cursor:pointer;transition:all .2s cubic-bezier(.4,0,.2,1);border-radius:min(2px,.3vw);outline:none;min-height:max(32px,min(10vw,6vh));min-width:max(32px,min(10vw,6vh))}.modern-sudoku-cell:hover:not(.given){background-color:var(--color-accentLight, #e3f2fd);transform:scale(1.02)}.modern-sudoku-cell:focus{outline:2px solid var(--color-accent, #2196f3);outline-offset:-2px;z-index:1}.cell-value{font-size:clamp(.8rem,min(4vw,4vh),2.2rem);font-weight:600;font-family:SF Pro Display,-apple-system,BlinkMacSystemFont,sans-serif;line-height:1;user-select:none;-webkit-user-select:none}.modern-sudoku-cell.given{background-color:var(--color-surfaceDarker, #f8f9fa);cursor:default}.modern-sudoku-cell.given .cell-value{color:var(--color-text, #1a1a1a);font-weight:700}.modern-sudoku-cell.user-entry .cell-value{color:var(--color-accent, #2196f3);font-weight:600}.modern-sudoku-cell.selected{background-color:var(--color-accent, #2196f3)!important;transform:scale(1.05);box-shadow:0 4px 12px #2196f34d;z-index:2}.modern-sudoku-cell.selected .cell-value{color:#fff;font-weight:700}.modern-sudoku-cell.related{background-color:var(--color-accentLight, #e3f2fd)}.modern-sudoku-cell.same-number{background-color:var(--color-warningLight, #fff3e0);border:2px solid var(--color-warning, #ff9800)}.modern-sudoku-cell.invalid{background-color:var(--color-errorLight, #ffebee)!important;border:2px solid var(--color-error, #f44336);animation:shake .5s ease-in-out}.modern-sudoku-cell.invalid .cell-value{color:var(--color-error, #f44336)}.modern-sudoku-cell.right-box-border{border-right:max(2px,min(3px,.4vw)) solid var(--color-border, #2c3e50)}.modern-sudoku-cell.bottom-box-border{border-bottom:max(2px,min(3px,.4vw)) solid var(--color-border, #2c3e50)}.cell-notes{position:absolute;top:min(2px,.3vw);left:min(2px,.3vw);right:min(2px,.3vw);bottom:min(2px,.3vw);display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(3,1fr);gap:max(.5px,min(1px,.1vw));pointer-events:none}.note{font-size:clamp(.35rem,min(1.2vw,1.2vh),.75rem);font-weight:500;color:var(--color-textSecondary, #666);display:flex;align-items:center;justify-content:center;line-height:1}.modern-game-status{text-align:center;margin-bottom:1.5rem;padding:1rem}.status-title{font-size:1.5rem;font-weight:700;color:var(--color-text, #1a1a1a);margin-bottom:.5rem;font-family:SF Pro Display,-apple-system,BlinkMacSystemFont,sans-serif}.progress-hint{font-size:.9rem;color:var(--color-textSecondary, #666);font-weight:400}@keyframes shake{0%,to{transform:translate(0)}25%{transform:translate(-2px)}75%{transform:translate(2px)}}.sudoku-board{display:grid;grid-template-columns:repeat(9,1fr);grid-template-rows:repeat(9,1fr);gap:1px;border:3px solid var(--color-border, #333);border-radius:4px;background-color:var(--color-border, #333);margin-bottom:1rem;max-width:min(80vw,450px);aspect-ratio:1}.sudoku-cell{background-color:var(--color-surface, #fff);border:none;display:flex;align-items:center;justify-content:center;font-size:clamp(1rem,3vw,1.5rem);font-weight:700;cursor:pointer;transition:all .2s ease;color:var(--color-text, #333);position:relative}.sudoku-cell:hover{background-color:var(--color-surfaceHover, #f0f0f0)}.sudoku-cell.selected{background-color:var(--color-accentLight, #e3f2fd);border:2px solid var(--color-accent, #2196F3)}.sudoku-cell.highlighted{background-color:var(--color-warningLight, #fff3e0)}.sudoku-cell.error{background-color:var(--color-errorLight, #ffebee);color:var(--color-error, #f44336)}.sudoku-cell.given{background-color:var(--color-surfaceDarker, #f5f5f5);color:var(--color-text, #333);font-weight:900;cursor:default}.sudoku-cell.user-input{color:var(--color-accent, #2196F3);font-weight:700}.sudoku-cell:nth-child(3n){border-right:2px solid var(--color-border, #333)}.sudoku-cell:nth-child(n+19):nth-child(-n+27),.sudoku-cell:nth-child(n+46):nth-child(-n+54){border-bottom:2px solid var(--color-border, #333)}.sudoku-controls{display:flex;flex-wrap:wrap;gap:.5rem;justify-content:center;margin-bottom:1rem;max-width:500px}.sudoku-btn{padding:.5rem 1rem;border:none;border-radius:4px;font-size:.9rem;font-weight:700;cursor:pointer;transition:all .2s ease;background-color:var(--color-accent, #2196F3);color:#fff}.sudoku-btn:hover{background-color:var(--color-accent-hover, #1976D2);transform:translateY(-1px)}.sudoku-btn:disabled{opacity:.5;cursor:not-allowed;transform:none}.sudoku-btn.new-game{background-color:var(--color-success, #4CAF50)}.sudoku-btn.new-game:hover{background-color:#45a049}.sudoku-btn.hint{background-color:var(--color-warning, #FF9800)}.sudoku-btn.hint:hover{background-color:#f57c00}.sudoku-btn.check{background-color:var(--color-info, #00BCD4)}.sudoku-btn.check:hover{background-color:#0097a7}.sudoku-number-pad{display:grid;grid-template-columns:repeat(5,1fr);gap:.5rem;margin-bottom:1rem;max-width:300px}.sudoku-number-btn{padding:.75rem;border:2px solid var(--color-borderLight, #ddd);border-radius:6px;font-size:1.2rem;font-weight:700;cursor:pointer;transition:all .2s ease;background-color:var(--color-surface, #fff);color:var(--color-text, #333)}.sudoku-number-btn:hover{background-color:var(--color-accentLight, #e3f2fd);border-color:var(--color-accent, #2196F3)}.sudoku-number-btn.clear{background-color:var(--color-errorLight, #ffebee);color:var(--color-error, #f44336);border-color:var(--color-error, #f44336);grid-column:span 2}.sudoku-number-btn.clear:hover{background-color:var(--color-error, #f44336);color:#fff}.sudoku-status{text-align:center;margin-bottom:1rem;padding:.75rem 1.5rem;border-radius:8px;font-weight:700}.sudoku-status.playing{background-color:var(--color-infoLight, #e1f5fe);color:var(--color-info, #00BCD4)}.sudoku-status.completed{background-color:var(--color-successLight, #e8f5e8);color:var(--color-success, #4CAF50)}.sudoku-status.error{background-color:var(--color-errorLight, #ffebee);color:var(--color-error, #f44336)}.sudoku-difficulty{display:flex;gap:.5rem;margin-bottom:1rem;flex-wrap:wrap;justify-content:center}.sudoku-difficulty-btn{padding:.5rem 1rem;border:2px solid var(--color-borderLight, #ddd);border-radius:20px;font-size:.9rem;font-weight:700;cursor:pointer;transition:all .2s ease;background-color:var(--color-surface, #fff);color:var(--color-text, #333)}.sudoku-difficulty-btn:hover{border-color:var(--color-accent, #2196F3);background-color:var(--color-accentLight, #e3f2fd)}.sudoku-difficulty-btn.active{background-color:var(--color-accent, #2196F3);color:#fff;border-color:var(--color-accent, #2196F3)}.sudoku-stats{display:flex;gap:2rem;margin-bottom:1rem;text-align:center;font-size:.9rem;color:var(--color-textSecondary, #666);flex-wrap:wrap;justify-content:center}.sudoku-stat{display:flex;flex-direction:column;gap:.25rem}.sudoku-stat-label{font-size:.8rem;opacity:.8;text-transform:uppercase;letter-spacing:.5px}.sudoku-stat-value{font-size:1.2rem;font-weight:700;color:var(--color-text, #333)}.sudoku-loading{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;color:var(--color-text, #333)}.sudoku-loading h2{margin:0 0 1rem;font-size:1.5rem}.sudoku-complete-celebration{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);background:#4caf50f2;color:#fff;padding:2rem;border-radius:12px;text-align:center;z-index:1000;animation:celebrationPulse 2s ease-in-out}@keyframes celebrationPulse{0%,to{transform:translate(-50%,-50%) scale(1)}50%{transform:translate(-50%,-50%) scale(1.1)}}@media (max-width: 400px){.modern-sudoku-board{width:min(98vw,98vh);height:min(98vw,98vh);border-width:max(1px,min(2px,.4vw));padding:max(1px,min(2px,.4vw));margin:clamp(.25rem,1vw,.5rem) 0}.cell-value{font-size:clamp(.7rem,min(3.8vw,3.8vh),1.8rem)}.note{font-size:clamp(.3rem,min(1vw,1vh),.6rem)}.modern-sudoku-cell{min-height:max(30px,min(9vw,5.5vh));min-width:max(30px,min(9vw,5.5vh))}}@media (min-width: 1024px){.modern-sudoku-board{width:min(70vw,min(70vh,500px));height:min(70vw,min(70vh,500px))}.cell-value{font-size:clamp(1.2rem,min(3.5vw,3.5vh),2rem)}}@media (orientation: landscape) and (max-height: 500px){.modern-sudoku-board{width:min(85vh,95vw);height:min(85vh,95vw)}.sudoku-game-field{gap:clamp(.25rem,1vh,.75rem)}}@media (prefers-contrast: high){.sudoku-cell{border:1px solid currentColor}.sudoku-btn,.sudoku-number-btn{border:2px solid currentColor}}@media (prefers-reduced-motion: reduce){.sudoku-btn,.sudoku-number-btn,.sudoku-difficulty-btn{transition:none}.sudoku-complete-celebration{animation:none}}:root{--pp-primary: #2563eb;--pp-primary-dark: #1d4ed8;--pp-accent: #3b82f6;--pp-success: #059669;--pp-warning: #d97706;--pp-error: #dc2626;--pp-surface: #ffffff;--pp-surface-dark: #1f2937;--pp-text: #111827;--pp-text-secondary: #6b7280;--pp-text-light: #ffffff;--pp-border: #e5e7eb;--pp-border-dark: #374151;--pp-shadow: 0 1px 3px rgba(0, 0, 0, .1);--pp-shadow-lg: 0 10px 15px rgba(0, 0, 0, .1);--pp-radius: .5rem;--pp-radius-lg: .75rem;--pp-transition: all .2s cubic-bezier(.4, 0, .2, 1)}.ping-pong-game{display:flex;flex-direction:column;align-items:center;padding:clamp(.5rem,2vw,1.5rem);max-width:1200px;margin:0 auto;font-family:var(--font-primary, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif);background:linear-gradient(135deg,var(--color-gameBackground, #f8fafc) 0%,var(--color-surface, #f1f5f9) 100%);color:var(--color-text, var(--pp-text));min-height:100vh;position:relative}@media (orientation: portrait) and (max-aspect-ratio: 3/4){.ping-pong-game--auto-rotate .ping-pong-canvas-container{transform:rotate(-90deg) scale(.7);transform-origin:center center;margin:3rem 0;max-width:90vh;max-height:90vw}}.ping-pong-game-field{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;width:100%;padding:clamp(.5rem,2vw,1.5rem);background:var(--color-gameBackground, var(--pp-surface-dark));color:var(--color-text, var(--pp-text-light));position:relative;overflow:hidden;transition:var(--pp-transition)}.ping-pong-canvas-container{position:relative;background:var(--pp-surface-dark);border-radius:var(--pp-radius-lg);box-shadow:var(--pp-shadow-lg);padding:1rem;transition:var(--pp-transition);border:1px solid var(--pp-border-dark);touch-action:none}.ping-pong-canvas-container:hover{transform:translateY(-2px);box-shadow:0 20px 25px #00000026}.ping-pong-canvas{display:block;max-width:100%;max-height:100%;object-fit:contain;border-radius:var(--pp-radius);background:#000;transition:var(--pp-transition);touch-action:none}@media (max-aspect-ratio: 1/1) and (orientation: portrait){.ping-pong-game-field--rotated .ping-pong-canvas-container{transform:rotate(-90deg) scale(.8);transform-origin:center center;margin:2rem 0}.ping-pong-game-field--rotated .ping-pong-status{transform:rotate(-90deg);transform-origin:center center;position:absolute;top:50%;left:50%;margin:-10rem 0 0 -5rem;width:20rem;text-align:center}}.ping-pong-status{position:absolute;top:1rem;left:50%;transform:translate(-50%);font-size:clamp(1rem,3vw,1.25rem);font-weight:600;color:var(--color-text, var(--pp-text-light));text-shadow:0 2px 4px rgba(0,0,0,.5);z-index:10;padding:.5rem 1rem;background:#000000b3;border-radius:var(--pp-radius);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.1)}.ping-pong-score{display:flex;justify-content:center;align-items:center;gap:clamp(1rem,4vw,2rem);font-size:clamp(1.5rem,5vw,2.5rem);font-weight:700;font-family:var(--font-mono, "JetBrains Mono", "Fira Code", Consolas, monospace);margin-bottom:1rem;color:var(--color-text, var(--pp-text));text-align:center;padding:1rem;background:var(--pp-surface);border-radius:var(--pp-radius-lg);box-shadow:var(--pp-shadow);border:1px solid var(--pp-border)}.ping-pong-score-player,.ping-pong-score-ai{display:flex;flex-direction:column;align-items:center;gap:.25rem;min-width:4rem}.ping-pong-score-player .score-label{color:var(--color-accent, var(--pp-primary));font-size:.8rem;font-weight:500;text-transform:uppercase;letter-spacing:.05em}.ping-pong-score-ai .score-label{color:var(--color-error, var(--pp-error));font-size:.8rem;font-weight:500;text-transform:uppercase;letter-spacing:.05em}.ping-pong-btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;padding:.75rem 1.5rem;border:none;border-radius:var(--pp-radius);font-size:.95rem;font-weight:600;font-family:inherit;cursor:pointer;transition:var(--pp-transition);text-decoration:none;white-space:nowrap;-webkit-user-select:none;user-select:none;touch-action:manipulation;min-height:44px;position:relative;overflow:hidden}.ping-pong-btn:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.2),transparent);transition:left .5s}.ping-pong-btn:hover:before{left:100%}.ping-pong-btn--primary{background:var(--color-accent, var(--pp-primary));color:var(--pp-text-light);box-shadow:var(--pp-shadow)}.ping-pong-btn--primary:hover{background:var(--pp-primary-dark);transform:translateY(-1px);box-shadow:var(--pp-shadow-lg)}.ping-pong-btn--secondary{background:var(--color-surface, var(--pp-surface));color:var(--color-text, var(--pp-text));border:1px solid var(--color-border, var(--pp-border))}.ping-pong-btn--secondary:hover{background:var(--color-card, #f8fafc);transform:translateY(-1px)}.ping-pong-btn--warning{background:var(--color-warning, var(--pp-warning));color:var(--pp-text-light)}.ping-pong-btn--warning:hover{background:#b45309;transform:translateY(-1px)}.ping-pong-btn--success{background:var(--color-success, var(--pp-success));color:var(--pp-text-light)}.ping-pong-btn--success:hover{background:#047857;transform:translateY(-1px)}.ping-pong-btn:disabled{opacity:.5;cursor:not-allowed;transform:none}.ping-pong-btn:disabled:hover{transform:none;box-shadow:var(--pp-shadow)}@media (max-width: 768px){.ping-pong-game{padding:clamp(.25rem,1vw,.5rem);min-height:calc(100vh - 2rem)}.ping-pong-game-field{padding:.5rem;min-height:70vh}.ping-pong-score{gap:1rem;font-size:clamp(1.25rem,4vw,1.75rem);padding:.75rem;margin-bottom:.75rem}.ping-pong-canvas-container{padding:.5rem;margin:.5rem 0}.ping-pong-btn{padding:.625rem 1.25rem;font-size:.9rem;min-height:48px}.ping-pong-game-stats{gap:.5rem;padding:.75rem}.ping-pong-controls-info{padding:.75rem;font-size:.85rem}.ping-pong-mobile-controls{display:flex}}@media (max-width: 480px){.ping-pong-game-field{padding:.25rem}.ping-pong-score{gap:.5rem;padding:.5rem;flex-direction:column}.ping-pong-score-player,.ping-pong-score-ai{flex-direction:row;gap:.5rem}.ping-pong-canvas-container{padding:.25rem;max-width:95vw}.ping-pong-btn{padding:.5rem 1rem;font-size:.85rem;min-width:100px}.ping-pong-game-stats{gap:.25rem;padding:.5rem}.ping-pong-stat{min-width:3rem;padding:.25rem}.ping-pong-stat-value{font-size:1.25rem}}@media (max-height: 500px) and (orientation: landscape){.ping-pong-game{flex-direction:row;align-items:stretch}.ping-pong-game-field{flex:1;min-height:auto;height:100vh}.ping-pong-canvas-container{max-height:80vh}}@media (orientation: portrait) and (max-aspect-ratio: 3/4){.ping-pong-game-field--auto-rotate .ping-pong-canvas-container{transform:rotate(-90deg) scale(.7);transform-origin:center center;margin:3rem 0;max-width:90vh;max-height:90vw}.ping-pong-game-field--auto-rotate .ping-pong-status{position:fixed;top:2rem;left:50%;transform:translate(-50%);z-index:100}.ping-pong-game-field--auto-rotate .ping-pong-controls-info{transform:scale(.9);margin-top:2rem}}@media (-webkit-min-device-pixel-ratio: 2),(min-resolution: 192dpi){.ping-pong-canvas{image-rendering:-webkit-optimize-contrast;image-rendering:crisp-edges}}@media (prefers-color-scheme: dark){:root{--pp-surface: #111827;--pp-text: #f9fafb;--pp-text-secondary: #9ca3af;--pp-border: #374151}}@media (prefers-reduced-motion: reduce){*{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}.ping-pong-btn:before{display:none}}@media (prefers-contrast: high){.ping-pong-canvas{border-color:#fff}.ping-pong-btn{border:2px solid currentColor}}.ping-pong-game-over{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);background:#000000f2;color:var(--pp-text-light);padding:2rem;border-radius:var(--pp-radius-lg);text-align:center;border:2px solid var(--color-accent, var(--pp-primary));z-index:20;box-shadow:0 25px 50px #0000004d;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);min-width:300px}.ping-pong-game-over h2{margin:0 0 1rem;font-size:2rem;font-weight:700;color:var(--color-accent, var(--pp-primary))}.ping-pong-game-over p{margin:.5rem 0;font-size:1.1rem;color:var(--pp-text-secondary)}.ping-pong-mobile-controls{display:none;position:absolute;bottom:5rem;left:50%;transform:translate(-50%);gap:1rem;z-index:10}.ping-pong-mobile-btn{padding:1rem 1.5rem;background:#000c;color:var(--pp-text-light);border:1px solid rgba(255,255,255,.2);border-radius:var(--pp-radius);font-size:.9rem;font-weight:600;cursor:pointer;transition:var(--pp-transition);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);touch-action:manipulation;min-height:48px}.ping-pong-mobile-btn:active{transform:scale(.95);background:#000000e6}.ping-pong-touch-area{position:absolute;top:0;left:0;width:50%;height:100%;background:rgba(var(--color-accent-rgb, 59, 130, 246),.1);border:2px dashed rgba(var(--color-accent-rgb, 59, 130, 246),.3);border-radius:var(--pp-radius);pointer-events:none;opacity:0;transition:opacity .3s ease}.ping-pong-canvas:active .ping-pong-touch-area{opacity:1}.ping-pong-playfield{flex:1;min-height:400px;max-height:80vh;width:100%}.ping-pong-playfield .ping-pong-canvas-container{width:100%;height:100%;position:relative;background:var(--pp-surface-dark);border-radius:var(--pp-radius);box-shadow:var(--pp-shadow-lg);border:1px solid var(--color-border, var(--pp-border-dark));overflow:hidden}.ping-pong-playfield .ping-pong-canvas{display:block;background:transparent}@media (max-width: 768px){.ping-pong-playfield{min-height:300px;max-height:70vh}}@media (orientation: portrait) and (max-aspect-ratio: 3/4){.ping-pong-playfield{max-height:50vh}}.snake-game{display:flex;flex-direction:column;align-items:center;gap:1rem;padding:1rem;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;max-width:100%;min-height:100vh;box-sizing:border-box}.snake-game-loading,.snake-game-error{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1rem;padding:2rem;text-align:center}.snake-game-error button{padding:.5rem 1rem;background:#4caf50;color:#fff;border:none;border-radius:4px;cursor:pointer;font-size:1rem}.snake-game-header{display:flex;justify-content:space-between;align-items:center;width:100%;max-width:600px;gap:1rem;flex-wrap:wrap}.snake-game-info h2{margin:0;color:#2c3e50;font-size:1.5rem}.game-mode-indicator{font-size:.9rem;color:#666;font-weight:500}.snake-game-stats{display:flex;gap:1rem;flex-wrap:wrap}.stat-item{display:flex;flex-direction:column;align-items:center;text-align:center;min-width:60px}.stat-label{font-size:.8rem;color:#666;margin-bottom:.2rem}.stat-value{font-size:1.1rem;font-weight:700;color:#2c3e50}.snake-game-board{position:relative;display:flex;justify-content:center;align-items:center;background:#f0f0f0;border:2px solid #ccc;border-radius:8px;padding:.5rem}.snake-grid{display:grid;grid-template-columns:repeat(var(--grid-width),1fr);grid-template-rows:repeat(var(--grid-height),1fr);gap:1px;background:#ddd;border:1px solid #ccc;max-width:90vw;max-height:70vh;aspect-ratio:var(--grid-width) / var(--grid-height)}.snake-cell{display:flex;align-items:center;justify-content:center;background:#fff;font-size:.8rem;min-width:20px;min-height:20px;width:100%;height:100%;position:relative}.snake-cell--empty{background:#fff}.snake-cell--food{background:#ffeb3b;font-size:.9rem}.snake-cell--snake{background:var(--snake-color, #4CAF50);color:#fff;font-weight:700}.snake-cell--head{font-size:1rem;filter:brightness(1.1)}.snake-game-overlay{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:#000c;color:#fff;border-radius:6px;z-index:10}.snake-game-over,.snake-paused{text-align:center;padding:2rem;background:#000000e6;border-radius:8px;max-width:90%}.snake-game-over h3,.snake-paused h3{margin:0 0 1rem;font-size:1.5rem}.final-scores{margin-top:1rem}.player-score{display:flex;align-items:center;gap:.5rem;margin:.5rem 0;font-size:1rem}.score-color{width:16px;height:16px;border-radius:50%}.snake-game-controls{display:flex;flex-direction:column;align-items:center;gap:1rem;width:100%;max-width:600px}.action-buttons{display:flex;gap:1rem;flex-wrap:wrap;justify-content:center}.action-btn{padding:.75rem 1.5rem;border:none;border-radius:6px;cursor:pointer;font-size:1rem;font-weight:500;transition:all .2s ease;min-width:120px}.action-btn:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 4px 8px #0003}.action-btn:disabled{opacity:.5;cursor:not-allowed}.action-btn.pause{background:#ff9800;color:#fff}.action-btn.resume{background:#4caf50;color:#fff}.action-btn.reset{background:#2196f3;color:#fff}.mobile-controls{display:flex;flex-direction:column;align-items:center;gap:.5rem;margin-top:1rem}.mobile-control-grid{display:flex;flex-direction:column;align-items:center;gap:.5rem}.mobile-row{display:flex;align-items:center;gap:.5rem}.mobile-control-btn{width:50px;height:50px;border:2px solid #ccc;background:#fff;border-radius:8px;cursor:pointer;font-size:1.2rem;display:flex;align-items:center;justify-content:center;transition:all .2s ease;-webkit-user-select:none;user-select:none}.mobile-control-btn:hover:not(:disabled){border-color:#4caf50;background:#f5f5f5;transform:scale(1.05)}.mobile-control-btn:active:not(:disabled){transform:scale(.95);background:#e0e0e0}.mobile-control-btn:disabled{opacity:.5;cursor:not-allowed}.mobile-spacer{width:50px;height:50px}.snake-instructions{text-align:center;max-width:500px;margin-top:1rem}.snake-instructions p{margin:.5rem 0;font-size:.9rem;color:#666;line-height:1.4}.snake-instructions strong{color:#2c3e50}.snake-players-list{background:#f8f9fa;border-radius:8px;padding:1rem;width:100%;max-width:400px;margin-top:1rem}.snake-players-list h4{margin:0 0 .5rem;color:#2c3e50;text-align:center}.players{display:flex;flex-direction:column;gap:.5rem}.player-item{display:flex;align-items:center;gap:.5rem;padding:.5rem;background:#fff;border-radius:4px;border:1px solid #e0e0e0}.player-item.dead{opacity:.6;background:#f5f5f5}.player-color{width:16px;height:16px;border-radius:50%;border:1px solid #ccc}.player-name{flex:1;font-weight:500}.player-score{font-weight:700;color:#2c3e50}.player-status{font-size:.9rem}.snake-save-info{position:fixed;bottom:1rem;right:1rem;padding:.5rem;background:#000c;color:#fff;border-radius:4px;font-size:.8rem;z-index:100}@media (max-width: 768px){.snake-game{padding:.5rem;gap:.8rem}.snake-game-header{flex-direction:column;gap:.5rem;text-align:center}.snake-game-stats{justify-content:center}.snake-grid{max-width:95vw;max-height:60vh}.snake-cell{min-width:15px;min-height:15px;font-size:.7rem}.action-buttons{width:100%}.action-btn{flex:1;min-width:unset}.snake-instructions{display:none}}@media (max-width: 480px){.snake-grid{max-height:50vh}.snake-cell{min-width:12px;min-height:12px;font-size:.6rem}.mobile-control-btn{width:45px;height:45px;font-size:1rem}.mobile-spacer{width:45px;height:45px}}@media (-webkit-min-device-pixel-ratio: 2),(min-resolution: 192dpi){.snake-cell{border:.5px solid #ddd}}.drawing-game{display:flex;flex-direction:column;gap:1rem;padding:1rem;max-width:800px;margin:0 auto}.drawing-game-header{text-align:center}.drawing-game-header h2{color:var(--color-text);margin:0 0 .5rem}.drawing-game-status{color:var(--color-textMuted);font-size:.9rem}.drawing-game-content{display:flex;flex-direction:column;gap:1rem;align-items:center}.drawing-canvas-container{position:relative;border:2px solid var(--color-border);border-radius:8px;padding:.5rem;background:var(--color-cardBackground)}.drawing-canvas{display:block;cursor:crosshair;image-rendering:pixelated;image-rendering:-moz-crisp-edges;image-rendering:crisp-edges;border:1px solid var(--color-border);touch-action:none}.drawing-canvas:hover{border-color:var(--color-accent)}.color-palette{display:flex;flex-wrap:wrap;gap:.5rem;padding:1rem;background:var(--color-cardBackground);border-radius:8px;border:1px solid var(--color-border);max-width:100%;justify-content:center}.color-palette-header{width:100%;text-align:center;font-weight:600;color:var(--color-text);margin-bottom:.5rem}.color-button{width:2rem;height:2rem;border:2px solid var(--color-border);border-radius:4px;cursor:pointer;transition:all .2s ease;touch-action:manipulation}.color-button:hover{transform:scale(1.1);box-shadow:0 2px 4px #0003}.color-button.selected{border-color:var(--color-accent);border-width:3px;transform:scale(1.1);box-shadow:0 0 8px var(--color-accent)}.drawing-game-controls{display:flex;flex-wrap:wrap;gap:.5rem;justify-content:center}.drawing-control-button{padding:.5rem 1rem;background:var(--color-accent);color:var(--color-background);border:none;border-radius:4px;cursor:pointer;font-weight:500;transition:all .2s ease;touch-action:manipulation}.drawing-control-button:hover{background:var(--color-accentDark, #2563eb);transform:translateY(-1px)}.drawing-control-button:active{transform:translateY(0)}.drawing-control-button:disabled{background:var(--color-disabled, #9ca3af);cursor:not-allowed;transform:none}.drawing-control-button.secondary{background:var(--color-secondary, #6b7280)}.drawing-control-button.secondary:hover{background:var(--color-secondaryDark, #4b5563)}.drawing-control-button.danger{background:var(--color-error, #dc2626)}.drawing-control-button.danger:hover{background:var(--color-errorDark, #b91c1c)}.drawing-multiplayer-status{display:flex;align-items:center;gap:.5rem;padding:.5rem;background:var(--color-info, #3b82f6);color:#fff;border-radius:4px;font-size:.9rem}.drawing-player-list{display:flex;gap:.5rem}.drawing-player-indicator{padding:.25rem .5rem;background:#fff3;border-radius:12px;font-size:.8rem}@media (max-width: 768px){.drawing-game{padding:.5rem}.drawing-game-content{gap:.75rem}.color-palette{padding:.75rem;gap:.25rem}.color-button{width:1.5rem;height:1.5rem}.drawing-game-controls{flex-direction:column;gap:.5rem}.drawing-control-button{padding:.75rem 1rem}}@media (max-width: 480px){.drawing-canvas-container{padding:.25rem}.color-palette{padding:.5rem}}.drawing-save-section{border:1px solid var(--color-border);border-radius:8px;margin-top:1rem;overflow:hidden;transition:all .3s ease}.drawing-save-section.collapsed{max-height:60px}.drawing-save-section.expanded{max-height:none}.drawing-save-header{display:flex;justify-content:space-between;align-items:center;padding:1rem;background:var(--color-surface);cursor:pointer;-webkit-user-select:none;user-select:none}.drawing-save-header h3{margin:0;color:var(--color-text);font-size:1rem}.drawing-save-toggle{font-size:1rem;color:var(--color-textSecondary);transform:rotate(-90deg);transition:transform .3s ease}.drawing-save-toggle.expanded{transform:rotate(0)}.drawing-save-content{padding:1rem;background:var(--color-cardBackground)}.drawing-autosave-toggle{display:flex;align-items:center;gap:.5rem;margin-bottom:1rem}.drawing-autosave-toggle input[type=checkbox]{accent-color:var(--color-accent)}.drawing-autosave-toggle label{color:var(--color-textSecondary);font-size:.9rem;cursor:pointer}.drawing-save-status{color:var(--color-textSecondary);font-size:.9rem;margin-bottom:1rem;padding:.5rem;background:var(--color-surface);border-radius:6px}.drawing-save-buttons{display:flex;gap:.5rem;flex-wrap:wrap}.drawing-save-btn{padding:.5rem 1rem;border:none;border-radius:6px;font-size:.9rem;font-weight:500;cursor:pointer;transition:all .2s ease}.drawing-save-btn:disabled{opacity:.5;cursor:not-allowed}.drawing-save-btn.save{background:var(--color-accent, #007bff);color:#fff}.drawing-save-btn.save:hover:not(:disabled){background:var(--color-accentHover, #0056b3)}.drawing-save-btn.load{background:var(--color-success, #28a745);color:#fff}.drawing-save-btn.load:hover:not(:disabled){background:var(--color-successHover, #1e7e34)}.drawing-save-btn.delete{background:var(--color-error, #dc3545);color:#fff}.drawing-save-btn.delete:hover:not(:disabled){background:var(--color-errorHover, #c82333)}.drawing-game-stats{display:flex;align-items:center;gap:1rem;color:var(--color-textSecondary);font-size:.9rem;justify-content:center;margin-bottom:.5rem}.current-color-indicator{margin-left:.25rem}.color-palette-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(2rem,1fr));gap:.25rem;max-width:200px}.drawing-game-loading{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:4rem 2rem;text-align:center;color:var(--color-text)}.drawing-game-loading h2{margin:0;color:var(--color-text)}.drawing-control-button.primary{background:var(--color-accent, #007bff);color:#fff}.drawing-control-button.primary:hover:not(:disabled){background:var(--color-accentHover, #0056b3)}.tetris-game{display:flex;justify-content:center;align-items:flex-start;min-height:100vh;padding:1rem;background:linear-gradient(135deg,#1a1a2e,#16213e);color:#fff;font-family:Arial,sans-serif}.tetris-container{display:flex;gap:2rem;max-width:800px;width:100%}.tetris-board-container{position:relative;background:#0f0f23;border:3px solid #4a4a5a;border-radius:8px;padding:1rem;box-shadow:0 8px 32px #0000004d}.tetris-board{display:grid;grid-template-rows:repeat(20,1fr);gap:1px;background:#1a1a2e;border:2px solid #333;width:300px;height:600px}.tetris-row{display:grid;grid-template-columns:repeat(10,1fr);gap:1px}.tetris-cell{background:#1a1a2e;border:1px solid #333;width:100%;height:100%;box-sizing:border-box;transition:background-color .1s ease}.tetris-cell--I{background:#00f0f0!important;border-color:#00d8d8}.tetris-cell--O{background:#f0f000!important;border-color:#d8d800}.tetris-cell--T{background:#a000f0!important;border-color:#8800d8}.tetris-cell--S{background:#00f000!important;border-color:#00d800}.tetris-cell--Z{background:#f00000!important;border-color:#d80000}.tetris-cell--J{background:#0000f0!important;border-color:#0000d8}.tetris-cell--L{background:#f0a000!important;border-color:#d88800}.tetris-side-panel{display:flex;flex-direction:column;gap:1.5rem;min-width:200px}.tetris-stats{background:#2a2a4a;border-radius:8px;padding:1rem;border:2px solid #4a4a5a}.tetris-stat{display:flex;justify-content:space-between;align-items:center;margin-bottom:.5rem}.tetris-stat:last-child{margin-bottom:0}.tetris-stat label{font-weight:700;color:#ccc}.tetris-stat span{font-size:1.2rem;font-weight:700;color:#fff}.tetris-next-piece{background:#2a2a4a;border-radius:8px;padding:1rem;border:2px solid #4a4a5a;text-align:center}.tetris-next-piece h3{margin:0 0 1rem;color:#fff;font-size:1.1rem}.tetris-next-grid{display:grid;grid-template-rows:repeat(4,1fr);gap:2px;max-width:80px;margin:0 auto}.tetris-next-row{display:grid;grid-template-columns:repeat(4,1fr);gap:2px}.tetris-next-cell{width:16px;height:16px;background:#1a1a2e;border:1px solid #333;box-sizing:border-box}.tetris-next-cell--I{background:#00f0f0!important;border-color:#00d8d8}.tetris-next-cell--O{background:#f0f000!important;border-color:#d8d800}.tetris-next-cell--T{background:#a000f0!important;border-color:#8800d8}.tetris-next-cell--S{background:#00f000!important;border-color:#00d800}.tetris-next-cell--Z{background:#f00000!important;border-color:#d80000}.tetris-next-cell--J{background:#0000f0!important;border-color:#0000d8}.tetris-next-cell--L{background:#f0a000!important;border-color:#d88800}.tetris-controls{background:#2a2a4a;border-radius:8px;padding:1rem;border:2px solid #4a4a5a}.tetris-controls h3{margin:0 0 1rem;color:#fff;font-size:1.1rem}.tetris-control-info{font-size:.9rem;color:#ccc;margin-bottom:1rem;line-height:1.4}.tetris-control-info p{margin:.2rem 0}.tetris-buttons{display:flex;flex-direction:column;gap:.5rem}.tetris-buttons button{background:#4a4a5a;border:2px solid #6a6a7a;color:#fff;padding:.7rem;border-radius:6px;cursor:pointer;font-size:.9rem;transition:all .2s ease}.tetris-buttons button:hover:not(:disabled){background:#5a5a6a;border-color:#7a7a8a;transform:translateY(-1px)}.tetris-buttons button:active:not(:disabled){transform:translateY(0)}.tetris-buttons button:disabled{opacity:.5;cursor:not-allowed}.tetris-mobile-controls{display:none;background:#2a2a4a;border-radius:8px;padding:1rem;border:2px solid #4a4a5a}.tetris-mobile-row{display:flex;justify-content:center;gap:.5rem;margin-bottom:.5rem}.tetris-mobile-row:last-child{margin-bottom:0}.tetris-mobile-controls button{background:#4a4a5a;border:2px solid #6a6a7a;color:#fff;padding:.8rem 1rem;border-radius:6px;cursor:pointer;font-size:.9rem;min-width:60px;transition:all .2s ease}.tetris-mobile-controls button:hover:not(:disabled){background:#5a5a6a;border-color:#7a7a8a}.tetris-mobile-controls button:active:not(:disabled){transform:scale(.95)}.tetris-game-over,.tetris-paused{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);background:#1a1a2ef2;border:3px solid #4a4a5a;border-radius:12px;padding:2rem;text-align:center;box-shadow:0 8px 32px #00000080;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.tetris-game-over h2,.tetris-paused h2{margin:0 0 1rem;color:#fff;font-size:1.8rem}.tetris-game-over p,.tetris-paused p{margin:0 0 1.5rem;color:#ccc;font-size:1.1rem}.tetris-game-over button{background:#4a4a5a;border:2px solid #6a6a7a;color:#fff;padding:.8rem 1.5rem;border-radius:6px;cursor:pointer;font-size:1rem;transition:all .2s ease}.tetris-game-over button:hover{background:#5a5a6a;border-color:#7a7a8a;transform:translateY(-1px)}.tetris-loading,.tetris-error{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:400px;color:#fff;text-align:center}.loading-spinner{width:40px;height:40px;border:4px solid #333;border-top:4px solid #fff;border-radius:50%;animation:spin 1s linear infinite;margin-bottom:1rem}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.tetris-error button{background:#4a4a5a;border:2px solid #6a6a7a;color:#fff;padding:.8rem 1.5rem;border-radius:6px;cursor:pointer;font-size:1rem;margin-top:1rem;transition:all .2s ease}.tetris-error button:hover{background:#5a5a6a;border-color:#7a7a8a}@media (max-width: 768px){.tetris-game{padding:.5rem}.tetris-container{flex-direction:column;gap:1rem;align-items:center}.tetris-board{width:250px;height:500px}.tetris-side-panel{width:100%;max-width:250px}.tetris-mobile-controls{display:block}.tetris-control-info{display:none}.tetris-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;text-align:center}.tetris-stat{flex-direction:column;gap:.2rem;margin-bottom:0}.tetris-buttons{flex-direction:row}}@media (max-width: 480px){.tetris-board{width:200px;height:400px}.tetris-side-panel{max-width:200px}.tetris-mobile-controls button{padding:.6rem .8rem;font-size:.8rem;min-width:50px}}@media (prefers-reduced-motion: reduce){.tetris-cell,.tetris-buttons button,.tetris-mobile-controls button,.tetris-game-over button,.tetris-error button{transition:none}.loading-spinner{animation:none}}@media (prefers-contrast: high){.tetris-board-container,.tetris-stats,.tetris-next-piece,.tetris-controls,.tetris-mobile-controls,.tetris-cell,.tetris-buttons button,.tetris-mobile-controls button,.tetris-game-over button,.tetris-error button{border-color:#fff}}.fullscreen-game-field{width:100%;height:100%;display:flex;align-items:center;justify-content:center;min-height:500px}.fullscreen-game-field .game2048-container,.fullscreen-game-field .tetris-game,.fullscreen-game-field .tic-tac-toe-game{padding:0;margin:0;border:none;border-radius:0;box-shadow:none;background:transparent;max-width:none;width:100%;height:100%}.game-stats-container{display:flex;gap:1rem;align-items:center}.game-stats-container>div{padding:.25rem .5rem;background:#f8f9fa;border-radius:4px;font-size:.9rem;color:#333}.game-controls-container{display:flex;gap:.5rem;align-items:center}.game-controls-container button{padding:.4rem .8rem;border:1px solid #ddd;background:#fff;border-radius:4px;cursor:pointer;font-size:.85rem;transition:all .2s ease}.game-controls-container button:hover:not(:disabled){background:#f0f0f0}.game-controls-container button.primary{background:#007bff;color:#fff;border-color:#007bff}.game-controls-container button.primary:hover:not(:disabled){background:#0056b3}.game-stats-placeholder,.game-controls-placeholder{color:#666;font-style:italic;font-size:.9rem}.temp-game-wrapper{width:100%;height:100%;display:flex;align-items:center;justify-content:center}.game-container{min-height:calc(100vh - 60px);background:#f8f9fa}.game-main{padding:2rem 1rem;max-width:1200px;margin:0 auto}.demo-game{background:#fff;border-radius:16px;padding:2.5rem;box-shadow:0 4px 12px #0000001a;text-align:center;max-width:600px;margin:0 auto}.demo-game h2{color:#333;margin-bottom:1rem;font-size:2rem}.demo-game>p{color:#666;font-size:1.1rem;margin-bottom:2rem}.demo-features{text-align:left;margin-bottom:2rem;background:#f8f9fa;padding:1.5rem;border-radius:12px;border:1px solid #e9ecef}.demo-features h3{color:#333;margin-bottom:1rem;font-size:1.2rem}.demo-features ul{margin:0;padding-left:1.5rem}.demo-features li{margin-bottom:.5rem;color:#555}.demo-note{background:#fff3cd;border:1px solid #ffeaa7;border-radius:8px;padding:1rem;color:#856404}.demo-note p{margin:0;font-size:.9rem}.game-not-found{background:#fff;border-radius:16px;padding:3rem 2rem;box-shadow:0 4px 12px #0000001a;text-align:center;max-width:500px;margin:0 auto}.game-not-found h2{color:#e74c3c;margin-bottom:1rem;font-size:2rem}.game-not-found p{color:#666;font-size:1.1rem;margin:0}@media (max-width: 768px){.game-main{padding:1.5rem .75rem}.demo-game{padding:2rem 1.5rem}.demo-game h2{font-size:1.75rem}.demo-features{padding:1.25rem}.game-not-found{padding:2.5rem 1.5rem}.game-not-found h2{font-size:1.75rem}}@media (max-width: 480px){.game-main{padding:1rem .5rem}.demo-game{padding:1.5rem 1rem}.demo-game h2{font-size:1.5rem}.demo-game>p{font-size:1rem}.demo-features{padding:1rem}.demo-features h3{font-size:1.1rem}.demo-features li{font-size:.9rem}.demo-note p{font-size:.85rem}.game-not-found{padding:2rem 1rem}.game-not-found h2{font-size:1.5rem}.game-not-found p{font-size:1rem}}.games-list{padding:2rem 1rem;max-width:1200px;margin:0 auto;min-height:calc(100vh - 60px);background:var(--color-primary, #ffffff)}.games-list-header{text-align:center;margin-bottom:3rem}.games-list-header h1{font-size:2.5rem;margin-bottom:.5rem;color:var(--color-text, #333)}.games-list-header p{font-size:1.1rem;color:var(--color-text-secondary, #666);margin:0}.games-grid{display:grid;gap:2rem;margin-bottom:3rem}.games-list--horizontal .games-grid{grid-template-columns:repeat(auto-fill,minmax(250px,1fr))}.games-list--vertical .games-grid{grid-template-columns:1fr 1fr;max-width:600px;margin:0 auto 3rem}.game-card{background:var(--color-card, #ffffff);border:2px solid var(--color-border, #e0e0e0);border-radius:16px;padding:2rem;text-align:center;cursor:pointer;transition:all .3s ease;position:relative;box-shadow:0 2px 8px #0000001a}.game-card:hover{border-color:var(--color-accent, #2196F3);transform:translateY(-4px);box-shadow:0 8px 25px #2196f326}.game-card:active{transform:translateY(-2px)}.game-emoji{font-size:4rem;margin-bottom:1rem;display:block}.game-name{font-size:1.5rem;font-weight:600;margin-bottom:.75rem;color:var(--color-text, #333)}.game-description{color:var(--color-text-secondary, #666);margin-bottom:1rem;line-height:1.4}.game-category{display:inline-block;background:var(--color-surface, #f0f0f0);color:var(--color-text-muted, #666);padding:.25rem .75rem;border-radius:12px;font-size:.8rem;font-weight:500;margin-bottom:1rem}.game-play-btn{background:var(--color-success, #4CAF50);color:#fff;padding:.75rem 1.5rem;border-radius:8px;font-weight:600;margin-top:1rem;transition:background-color .2s ease}.game-card:hover .game-play-btn{background:#45a049}.games-list-footer{text-align:center;margin-top:3rem;padding:2rem;background:var(--color-surface, #f8f9fa);border-radius:12px;border:1px solid var(--color-border, #e9ecef)}.footer-text{color:var(--color-text-secondary, #666);margin:0;font-size:.95rem}.footer-text small{color:var(--color-text-muted, #999);font-size:.8rem}.footer-text .version-info{color:var(--color-text-muted, #aaa);font-size:.75rem;font-weight:500}@media (max-width: 768px){.games-list{padding:1.5rem .75rem}.games-list-header h1{font-size:2rem}.games-list-header p{font-size:1rem}.games-list--horizontal .games-grid,.games-list--vertical .games-grid{grid-template-columns:1fr 1fr;gap:1rem;margin-bottom:2rem;max-width:none}.game-card{padding:1rem}.game-emoji{font-size:2.5rem;margin-bottom:.75rem}.game-name{font-size:1.1rem;margin-bottom:.5rem}.game-description{font-size:.85rem;margin-bottom:.75rem}.game-category{font-size:.75rem;padding:.2rem .6rem;margin-bottom:.75rem}.game-play-btn{padding:.5rem 1rem;font-size:.85rem;margin-top:.75rem}.games-list-footer{margin-top:2rem;padding:1.5rem}}@media (max-width: 480px){.games-list{padding:1rem .5rem}.games-list-header h1{font-size:1.75rem;margin-bottom:.75rem}.games-list-header{margin-bottom:1.5rem}.games-list--horizontal .games-grid,.games-list--vertical .games-grid{gap:.75rem}.game-card{padding:.85rem}.game-emoji{font-size:2rem;margin-bottom:.5rem}.game-name{font-size:1rem;margin-bottom:.4rem}.game-description{font-size:.8rem;margin-bottom:.6rem;line-height:1.3}.game-category{font-size:.7rem;padding:.15rem .5rem;margin-bottom:.6rem}.game-play-btn{padding:.45rem .9rem;font-size:.8rem;margin-top:.6rem}}.game-card:focus{outline:3px solid var(--color-accent, #2196F3);outline-offset:2px}.name-entry{min-height:100vh;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,var(--color-accent, #667eea) 0%,var(--color-accent-hover, #764ba2) 100%);padding:1rem}.name-entry-content{background:var(--color-card, white);border-radius:20px;padding:3rem 2.5rem;max-width:500px;width:100%;box-shadow:0 20px 40px #0000001a;text-align:center}.name-entry-header{margin-bottom:2.5rem}.logo-section{margin-bottom:1.5rem}.logo-emoji{font-size:4rem;margin-bottom:.5rem;display:block}.name-entry-header h1{font-size:2.5rem;font-weight:700;margin-bottom:.75rem;color:var(--color-text, #333);background:linear-gradient(135deg,var(--color-accent, #667eea),var(--color-accent-hover, #764ba2));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.name-entry-header p{font-size:1.1rem;color:var(--color-text-secondary, #666);margin:0}.name-entry-form{margin-bottom:3rem}.input-group{display:flex;gap:.75rem;margin-bottom:1rem;align-items:stretch}.name-input{flex:1;padding:1rem;border:2px solid var(--color-border, #e0e0e0);border-radius:12px;font-size:1rem;transition:border-color .3s ease;outline:none;background:var(--color-surface, white);color:var(--color-text, #333)}.name-input:focus{border-color:var(--color-accent, #667eea);box-shadow:0 0 0 3px #667eea1a}.start-btn{background:linear-gradient(135deg,var(--color-accent, #667eea),var(--color-accent-hover, #764ba2));color:#fff;border:none;border-radius:12px;padding:1rem 1.5rem;font-size:1rem;font-weight:600;cursor:pointer;transition:all .3s ease;white-space:nowrap}.start-btn:enabled:hover{transform:translateY(-2px);box-shadow:0 8px 25px #667eea4d}.start-btn:disabled{background:var(--color-text-muted, #ccc);cursor:not-allowed;transform:none}.start-btn:active{transform:translateY(0)}.features-preview{border-top:1px solid var(--color-border, #f0f0f0);padding-top:2rem}.features-preview h3{font-size:1.3rem;margin-bottom:1.5rem;color:var(--color-text, #333)}.features-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1rem}.feature-item{display:flex;flex-direction:column;align-items:center;gap:.5rem;padding:.75rem;background:var(--color-surface, #f8f9fa);border-radius:12px;transition:transform .2s ease}.feature-item:hover{transform:scale(1.05)}.feature-emoji{font-size:1.5rem}.feature-item span:last-child{font-size:.9rem;font-weight:500;color:var(--color-text-secondary, #666)}@media (max-width: 768px){.name-entry-content{padding:2.5rem 1.5rem;margin:1rem}.logo-emoji{font-size:3rem}.name-entry-header h1{font-size:2rem}.name-entry-header p{font-size:1rem}.input-group{flex-direction:column;gap:.75rem}.name-input{padding:.875rem}.start-btn{padding:.875rem 1.25rem}.features-grid{grid-template-columns:1fr;gap:.75rem}}@media (max-width: 480px){.name-entry{padding:.5rem}.name-entry-content{padding:2rem 1.25rem}.logo-emoji{font-size:2.5rem}.name-entry-header h1{font-size:1.75rem}.name-entry-header,.name-entry-form{margin-bottom:2rem}.name-input{font-size:.9rem;padding:.75rem}.start-btn{font-size:.9rem;padding:.75rem 1rem}.features-preview h3{font-size:1.1rem;margin-bottom:1rem}.feature-item{padding:.5rem}.feature-emoji{font-size:1.25rem}.feature-item span:last-child{font-size:.8rem}}.profile{min-height:100vh;background:linear-gradient(135deg,var(--color-accent, #667eea) 0%,var(--color-accent-hover, #764ba2) 100%);padding:1rem;display:flex;align-items:flex-start;justify-content:center}.profile-content{background:var(--color-card, white);border-radius:16px;box-shadow:0 20px 40px #0000001a;padding:2rem;width:100%;max-width:600px;margin-top:2rem}.profile-header{display:flex;align-items:center;margin-bottom:2rem;gap:1rem}.profile-back-btn{background:var(--color-surface, #f5f5f5);border:none;border-radius:8px;padding:.5rem 1rem;cursor:pointer;font-size:.9rem;color:var(--color-text, #333);transition:background-color .2s ease}.profile-back-btn:hover{background:var(--color-border, #e0e0e0)}.profile-header h1{margin:0;color:var(--color-text, #333);font-size:1.8rem;font-weight:600}.profile-section{display:flex;gap:2rem;margin-bottom:2rem}.profile-avatar{flex-shrink:0}.avatar-emoji{font-size:4rem;display:block;width:80px;height:80px;background:var(--color-surface, #f0f0f0);border-radius:50%;display:flex;align-items:center;justify-content:center;border:3px solid var(--color-border, #e0e0e0)}.profile-info{flex:1}.profile-field{margin-bottom:1.5rem}.profile-field label{display:block;font-weight:600;color:var(--color-text, #333);margin-bottom:.5rem;font-size:.9rem}.display-name-container{display:flex;align-items:center;gap:1rem}.display-name{font-size:1.2rem;font-weight:500;color:var(--color-text, #333);padding:.5rem 0}.edit-btn{background:#2196f3;color:#fff;border:none;border-radius:6px;padding:.4rem .8rem;font-size:.8rem;cursor:pointer;transition:background-color .2s ease;display:flex;align-items:center;gap:.3rem}.edit-btn:hover{background:#1976d2}.edit-name-container{display:flex;flex-direction:column;gap:.75rem}.edit-name-input{padding:.75rem;border:2px solid #e0e0e0;border-radius:8px;font-size:1rem;transition:border-color .2s ease;width:100%;max-width:300px}.edit-name-input:focus{outline:none;border-color:#2196f3}.edit-name-input:disabled{background:#f5f5f5;cursor:not-allowed}.edit-name-actions{display:flex;gap:.5rem}.save-btn{background:#4caf50;color:#fff;border:none;border-radius:6px;padding:.5rem 1rem;font-size:.9rem;cursor:pointer;transition:background-color .2s ease}.save-btn:hover:not(:disabled){background:#45a049}.save-btn:disabled{background:#ccc;cursor:not-allowed}.cancel-btn{background:#f44336;color:#fff;border:none;border-radius:6px;padding:.5rem 1rem;font-size:.9rem;cursor:pointer;transition:background-color .2s ease}.cancel-btn:hover:not(:disabled){background:#d32f2f}.cancel-btn:disabled{background:#ccc;cursor:not-allowed}.profile-metadata{margin-top:1.5rem;padding-top:1.5rem;border-top:1px solid #e0e0e0}.metadata-item{display:flex;justify-content:space-between;align-items:center;padding:.5rem 0;border-bottom:1px solid #f5f5f5}.metadata-item:last-child{border-bottom:none}.metadata-label{font-weight:500;color:#666;font-size:.9rem}.metadata-value{color:#333;font-size:.9rem;font-family:monospace;background:#f8f8f8;padding:.2rem .5rem;border-radius:4px}.profile-help{background:#f9f9f9;border-radius:8px;padding:1.5rem;border-left:4px solid #2196F3}.profile-help h3{margin:0 0 1rem;color:#333;font-size:1rem}.profile-help ul{margin:0;padding-left:1.2rem;color:#666}.profile-help li{margin-bottom:.5rem;font-size:.9rem;line-height:1.4}.profile-help li:last-child{margin-bottom:0}.theme-selector{display:flex;flex-direction:column;gap:.75rem}.theme-option{display:flex;align-items:center;gap:1rem;padding:1rem;border:2px solid var(--color-border, #e0e0e0);border-radius:12px;background:var(--color-surface, #ffffff);cursor:pointer;transition:all .2s ease;text-align:left}.theme-option:hover{border-color:var(--color-accent, #646cff);background:var(--color-card, #f8f9fa)}.theme-option.active{border-color:var(--color-accent, #646cff);background:var(--color-accent, #646cff);color:#fff}.theme-option.active .theme-info *{color:#fff}.theme-preview{width:40px;height:30px;border-radius:6px;position:relative;overflow:hidden;border:1px solid var(--color-border, #e0e0e0)}.theme-preview-bg{position:absolute;inset:0}.theme-preview-text{position:absolute;top:2px;left:2px;right:2px;height:8px;border-radius:2px}.theme-preview[data-theme=dark] .theme-preview-bg{background:#1a1a1a}.theme-preview[data-theme=dark] .theme-preview-text,.theme-preview[data-theme=light] .theme-preview-bg{background:#fff}.theme-preview[data-theme=light] .theme-preview-text{background:#333}.theme-preview[data-theme=matrix] .theme-preview-bg{background:#000}.theme-preview[data-theme=matrix] .theme-preview-text{background:#0f0}.theme-info{display:flex;flex-direction:column;gap:.25rem}.theme-name{font-weight:600;font-size:1rem;color:var(--color-text, #333)}.theme-description{font-size:.85rem;color:var(--color-text-muted, #777);line-height:1.3}@media (max-width: 768px){.profile{padding:.5rem}.profile-content{padding:1.5rem;margin-top:1rem}.profile-section{flex-direction:column;gap:1rem}.avatar-emoji{font-size:3rem;width:60px;height:60px}.profile-header h1{font-size:1.5rem}.display-name-container{flex-direction:column;align-items:flex-start;gap:.5rem}.edit-name-actions{flex-direction:column}.metadata-item{flex-direction:column;align-items:flex-start;gap:.25rem}.theme-option{padding:.75rem;gap:.75rem}.theme-info{gap:.2rem}.theme-name{font-size:.9rem}.theme-description{font-size:.8rem}}@media (max-width: 480px){.profile-content{padding:1rem}.profile-header{flex-direction:column;align-items:flex-start;gap:.5rem}.profile-back-btn{padding:.4rem .8rem;font-size:.8rem}}.playfield-container{min-width:0;min-height:0;box-sizing:border-box;position:relative;display:flex;align-items:center;justify-content:center;transition:all .2s ease-out}.playfield-content{flex-shrink:0;position:relative;transition:width .2s ease-out,height .2s ease-out;overflow:hidden;box-sizing:border-box}.playfield-container.aspect-16-9{--aspect-ratio: 1.7777777778}.playfield-container.aspect-4-3{--aspect-ratio: 1.3333333333}.playfield-container.aspect-1-1{--aspect-ratio: 1}.playfield-container.aspect-2-1{--aspect-ratio: 2}.playfield-container.aspect-3-2{--aspect-ratio: 1.5}@media (max-width: 768px){.playfield-container{padding:10px}}@media (max-width: 480px){.playfield-container{padding:5px}}@media (-webkit-min-device-pixel-ratio: 2),(min-resolution: 2dppx){.playfield-content{-webkit-backface-visibility:hidden;backface-visibility:hidden;-webkit-transform:translateZ(0);transform:translateZ(0)}}@media (prefers-reduced-motion: reduce){.playfield-container,.playfield-content{transition:none}}@media print{.playfield-container{padding:0;transition:none}.playfield-content{transition:none}}