:root{--color-brand-primary: #6366f1;--color-brand-secondary: #8b5cf6;--color-brand-accent: #f59e0b;--color-bg-primary: #0f172a;--color-bg-secondary: #1e293b;--color-bg-card: #334155;--color-bg-elevated: #475569;--color-text-primary: #f8fafc;--color-text-secondary: #94a3b8;--color-text-muted: #64748b;--color-success: #22c55e;--color-warning: #f59e0b;--color-error: #ef4444;--color-info: #3b82f6;--color-fluid-1: #ef4444;--color-fluid-2: #f97316;--color-fluid-3: #eab308;--color-fluid-4: #22c55e;--color-fluid-5: #06b6d4;--color-fluid-6: #3b82f6;--color-fluid-7: #8b5cf6;--color-fluid-8: #ec4899;--space-1: .25rem;--space-2: .5rem;--space-3: .75rem;--space-4: 1rem;--space-5: 1.5rem;--space-6: 2rem;--space-7: 3rem;--space-8: 4rem;--radius-sm: .25rem;--radius-md: .5rem;--radius-lg: 1rem;--radius-xl: 1.5rem;--radius-full: 9999px;--font-sans: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--font-mono: ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace;--text-xs: .75rem;--text-sm: .875rem;--text-base: 1rem;--text-lg: 1.125rem;--text-xl: 1.25rem;--text-2xl: 1.5rem;--text-3xl: 2rem;--shadow-sm: 0 1px 2px rgba(0, 0, 0, .25);--shadow-md: 0 4px 6px rgba(0, 0, 0, .25);--shadow-lg: 0 10px 15px rgba(0, 0, 0, .25);--shadow-xl: 0 20px 25px rgba(0, 0, 0, .25);--transition-fast: .15s ease;--transition-base: .25s ease;--transition-slow: .35s ease;--z-base: 0;--z-elevated: 10;--z-overlay: 100;--z-modal: 1000;--z-toast: 2000;--focus-ring-color: var(--color-brand-primary);--focus-ring-width: 3px;--focus-ring-offset: 2px;--animation-duration-fast: .15s;--animation-duration-base: .25s;--animation-duration-slow: .35s}@media (prefers-color-scheme: light){:root.auto-theme{--color-bg-primary: #f8fafc;--color-bg-secondary: #f1f5f9;--color-bg-card: #e2e8f0;--color-bg-elevated: #cbd5e1;--color-text-primary: #0f172a;--color-text-secondary: #475569;--color-text-muted: #64748b}}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}.particles,.confetti,.sparkle{display:none!important}.game-btn:active,.game-card:active,.icon-btn:active{transform:none!important}}.reduced-motion *,.reduced-motion *:before,.reduced-motion *:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}.reduced-motion .particles,.reduced-motion .confetti,.reduced-motion .sparkle{display:none!important}.colorblind-deuteranopia{--color-fluid-1: #d55e00;--color-fluid-2: #e69f00;--color-fluid-3: #f0e442;--color-fluid-4: #009e73;--color-fluid-5: #56b4e9;--color-fluid-6: #0072b2;--color-fluid-7: #cc79a7;--color-fluid-8: #999999;--color-success: #009e73;--color-error: #d55e00}.colorblind-protanopia{--color-fluid-1: #e69f00;--color-fluid-2: #f0e442;--color-fluid-3: #009e73;--color-fluid-4: #56b4e9;--color-fluid-5: #0072b2;--color-fluid-6: #cc79a7;--color-fluid-7: #d55e00;--color-fluid-8: #999999;--color-success: #009e73;--color-error: #e69f00}.colorblind-tritanopia{--color-fluid-1: #e69f00;--color-fluid-2: #f0e442;--color-fluid-3: #009e73;--color-fluid-4: #d55e00;--color-fluid-5: #cc79a7;--color-fluid-6: #0072b2;--color-fluid-7: #56b4e9;--color-fluid-8: #999999;--color-success: #009e73;--color-error: #d55e00}.colorblind-patterns .fluid-segment-1{background-image:repeating-linear-gradient(45deg,transparent,transparent 3px,rgba(0,0,0,.3) 3px,rgba(0,0,0,.3) 6px)}.colorblind-patterns .fluid-segment-2{background-image:repeating-linear-gradient(90deg,transparent,transparent 3px,rgba(0,0,0,.3) 3px,rgba(0,0,0,.3) 6px)}.colorblind-patterns .fluid-segment-3{background-image:repeating-linear-gradient(0deg,transparent,transparent 3px,rgba(0,0,0,.3) 3px,rgba(0,0,0,.3) 6px)}.colorblind-patterns .fluid-segment-4{background-image:radial-gradient(circle at center,rgba(0,0,0,.3) 2px,transparent 2px);background-size:8px 8px}.colorblind-patterns .fluid-segment-5{background-image:repeating-linear-gradient(-45deg,transparent,transparent 3px,rgba(0,0,0,.3) 3px,rgba(0,0,0,.3) 6px)}.colorblind-patterns .fluid-segment-6{background-image:linear-gradient(45deg,rgba(0,0,0,.2) 25%,transparent 25%,transparent 75%,rgba(0,0,0,.2) 75%);background-size:8px 8px}.colorblind-patterns .fluid-segment-7{border:3px solid rgba(0,0,0,.4)}.colorblind-patterns .fluid-segment-8{border:3px dashed rgba(0,0,0,.4)}@media (prefers-contrast: more){:root{--color-bg-primary: #000000;--color-bg-secondary: #1a1a1a;--color-bg-card: #333333;--color-bg-elevated: #4a4a4a;--color-text-primary: #ffffff;--color-text-secondary: #e0e0e0;--color-text-muted: #c0c0c0;--color-brand-primary: #ffffff;--color-brand-secondary: #e0e0e0}.game-card,.game-btn,.game-board,.toast,.game-overlay-content{border:2px solid var(--color-text-primary)}}.high-contrast{--color-bg-primary: #000000;--color-bg-secondary: #1a1a1a;--color-bg-card: #333333;--color-bg-elevated: #4a4a4a;--color-text-primary: #ffffff;--color-text-secondary: #e0e0e0;--color-text-muted: #c0c0c0;--color-brand-primary: #ffffff;--color-brand-secondary: #e0e0e0}.high-contrast .game-card,.high-contrast .game-btn,.high-contrast .game-board,.high-contrast .toast,.high-contrast .game-overlay-content{border:2px solid var(--color-text-primary)}.high-contrast .game-btn-primary{background-color:#fff;color:#000}:focus{outline:2px solid var(--color-brand-primary);outline-offset:2px}:focus:not(:focus-visible){outline:none}:focus-visible{outline:3px solid var(--color-brand-primary);outline-offset:3px}.game-btn:focus-visible,.icon-btn:focus-visible{outline:3px solid var(--color-brand-accent);outline-offset:2px;box-shadow:0 0 0 6px #f59e0b4d}a:focus-visible{outline:3px solid var(--color-brand-accent);outline-offset:2px;border-radius:var(--radius-sm)}.skip-link{position:absolute;top:-100%;left:50%;transform:translate(-50%);padding:var(--space-3) var(--space-5);background-color:var(--color-brand-primary);color:#fff;font-weight:600;border-radius:var(--radius-lg);z-index:var(--z-toast);transition:top .2s ease}.skip-link:focus{top:var(--space-4);outline:none}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.sr-only-focusable:focus,.sr-only-focusable:active{position:static;width:auto;height:auto;overflow:visible;clip:auto;white-space:normal}.game-btn,.icon-btn,.game-card-link{min-height:44px;min-width:44px}[tabindex="0"]:focus-visible{outline:3px solid var(--color-brand-accent);outline-offset:2px}.animating{pointer-events:none}.loading-spinner{display:inline-block;width:24px;height:24px;border:3px solid var(--color-bg-card);border-top-color:var(--color-brand-primary);border-radius:50%;animation:spin 1s linear infinite}@media (prefers-reduced-motion: reduce){.loading-spinner{animation:none;border-top-color:var(--color-brand-primary);border-right-color:var(--color-brand-primary);opacity:.7}}@media (hover: none) and (pointer: coarse){.game-btn,.icon-btn,.badge,.install-btn,.install-dismiss{min-height:48px;min-width:48px}.game-header-controls{gap:var(--space-3)}.game-controls{gap:var(--space-4)}}@media (prefers-reduced-data: reduce){:root{--font-sans: system-ui, sans-serif;--font-mono: ui-monospace, monospace}}@media print{.install-banner,.update-notification,.toast-container,.game-overlay{display:none!important}body{background:#fff;color:#000}}.gpu-accelerated{transform:translateZ(0);will-change:transform;backface-visibility:hidden;perspective:1000px}.game-card,.game-btn,.toast,.game-overlay,.install-banner{transform:translateZ(0);backface-visibility:hidden}.gpu-accelerated:not(.animating){will-change:auto}@supports (height: 100dvh){body,.game-container{min-height:100dvh}.game-board{min-height:calc(100dvh - 200px)}}@supports not (height: 100dvh){body,.game-container{min-height:-webkit-fill-available}}@supports (padding: max(0px)){body{padding-left:max(0px,env(safe-area-inset-left));padding-right:max(0px,env(safe-area-inset-right));padding-bottom:max(0px,env(safe-area-inset-bottom))}.game-header{padding-top:max(var(--space-3),env(safe-area-inset-top))}.game-controls,.install-banner{padding-bottom:max(var(--space-4),env(safe-area-inset-bottom))}}.game-btn,.game-card,.icon-btn,.install-btn,.install-dismiss{touch-action:manipulation}.scrollable{-webkit-overflow-scrolling:touch;overscroll-behavior:contain}.no-select{-webkit-user-select:none;user-select:none}.game-board{-webkit-touch-callout:none}.loading-overlay{position:fixed;inset:0;background-color:var(--color-bg-primary);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--space-4);z-index:var(--z-modal)}.loading-text{color:var(--color-text-secondary);font-size:var(--text-sm)}.skeleton-card{background:var(--color-bg-secondary);border-radius:var(--radius-xl);padding:var(--space-5)}.skeleton-image{aspect-ratio:16/9;background:linear-gradient(90deg,var(--color-bg-card) 25%,var(--color-bg-elevated) 50%,var(--color-bg-card) 75%);background-size:200% 100%;animation:shimmer 1.5s infinite;border-radius:var(--radius-lg);margin-bottom:var(--space-4)}.skeleton-text{height:1em;background:linear-gradient(90deg,var(--color-bg-card) 25%,var(--color-bg-elevated) 50%,var(--color-bg-card) 75%);background-size:200% 100%;animation:shimmer 1.5s infinite;border-radius:var(--radius-sm);margin-bottom:var(--space-2)}.skeleton-text.short{width:60%}.skeleton-text.medium{width:80%}.btn-press{transition:transform .1s ease}.btn-press:active{transform:scale(.95)}@keyframes successPulse{0%,to{box-shadow:0 0 #22c55e66}50%{box-shadow:0 0 0 10px #22c55e00}}.success-pulse{animation:successPulse .6s ease-out}@keyframes gentleBounce{0%,to{transform:translateY(0)}50%{transform:translateY(-4px)}}.bounce{animation:gentleBounce .3s ease}.fade-in{animation:fadeIn .3s ease}@keyframes scaleIn{0%{opacity:0;transform:scale(.9)}to{opacity:1;transform:scale(1)}}.scale-in{animation:scaleIn .3s ease}@keyframes slideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes slideDown{0%{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}.slide-up{animation:slideUp .3s ease}.slide-down{animation:slideDown .3s ease}.error-state{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:var(--space-6);text-align:center;color:var(--color-text-secondary)}.error-state-icon{font-size:3rem;margin-bottom:var(--space-4)}.error-state-title{font-size:var(--text-lg);font-weight:600;color:var(--color-text-primary);margin-bottom:var(--space-2)}.error-state-message{font-size:var(--text-sm);margin-bottom:var(--space-4)}.empty-state-message{font-size:var(--text-sm);color:var(--color-text-secondary);max-width:280px}.defer-render{content-visibility:auto}.contain-layout{contain:layout}.contain-paint{contain:paint}.contain-strict{contain:strict}@media (max-width: 600px){.hide-mobile{display:none!important}}@media (min-width: 601px){.hide-desktop{display:none!important}}@media (hover: none){.touch-only{display:block}.hover-only{display:none}}@media (hover: hover){.touch-only{display:none}.hover-only{display:block}}.gif-recording-indicator{position:fixed;top:var(--space-4);right:var(--space-4);display:flex;align-items:center;gap:var(--space-2);padding:var(--space-2) var(--space-4);background-color:#ef4444e6;color:#fff;border-radius:var(--radius-full);font-size:var(--text-sm);font-weight:600;z-index:var(--z-overlay);animation:pulse 1.5s ease-in-out infinite}.gif-recording-indicator:before{content:"";width:10px;height:10px;background-color:#fff;border-radius:50%;animation:blink 1s ease-in-out infinite}@keyframes blink{0%,to{opacity:1}50%{opacity:.3}}@keyframes pulse{0%,to{transform:scale(1)}50%{transform:scale(1.02)}}.gif-preview-modal{position:fixed;inset:0;background-color:#000000d9;display:flex;align-items:center;justify-content:center;z-index:var(--z-modal);animation:fadeIn .2s ease}.gif-preview-content{background-color:var(--color-bg-secondary);border-radius:var(--radius-xl);padding:var(--space-4);max-width:90vw;max-height:90vh;display:flex;flex-direction:column;gap:var(--space-4);animation:scaleIn .2s ease}@keyframes scaleIn{0%{transform:scale(.95);opacity:0}to{transform:scale(1);opacity:1}}.gif-preview-content img{max-width:100%;max-height:60vh;border-radius:var(--radius-lg);background-color:var(--color-bg-card)}.gif-preview-actions{display:flex;gap:var(--space-3);justify-content:center;flex-wrap:wrap}.gif-btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);padding:var(--space-3) var(--space-5);font-size:var(--text-sm);font-weight:600;border-radius:var(--radius-lg);border:none;cursor:pointer;transition:all var(--transition-fast)}.gif-btn-share{background-color:var(--color-brand-primary);color:#fff}.gif-btn-share:hover{background-color:#4f46e5;transform:translateY(-1px)}.gif-btn-download{background-color:var(--color-success);color:#fff}.gif-btn-download:hover{background-color:#16a34a;transform:translateY(-1px)}.gif-btn-close{background-color:var(--color-bg-card);color:var(--color-text-primary)}.gif-btn-close:hover{background-color:var(--color-bg-elevated)}.gif-export-progress{display:flex;flex-direction:column;align-items:center;gap:var(--space-3);padding:var(--space-6)}.gif-export-progress .progress-bar{width:200px;height:8px}.gif-export-progress .progress-text{font-size:var(--text-sm);color:var(--color-text-secondary)}.btn-share-gif{display:flex;align-items:center;gap:var(--space-2);background:linear-gradient(135deg,var(--color-brand-primary),var(--color-brand-secondary));color:#fff;padding:var(--space-3) var(--space-5);border-radius:var(--radius-lg);font-weight:600;border:none;cursor:pointer;transition:all var(--transition-fast)}.btn-share-gif:hover{transform:translateY(-2px);box-shadow:var(--shadow-lg)}.btn-share-gif svg{width:20px;height:20px}@media (max-width: 480px){.gif-preview-content{padding:var(--space-3);margin:var(--space-2)}.gif-preview-actions{flex-direction:column}.gif-btn{width:100%}}@media (prefers-reduced-motion: reduce){.gif-recording-indicator,.gif-recording-indicator:before{animation:none}.gif-preview-modal,.gif-preview-content{animation:none}}.skill-indicator{display:flex;flex-direction:column;gap:var(--space-2);padding:var(--space-3);background-color:var(--color-bg-secondary);border-radius:var(--radius-lg)}.skill-indicator-header{display:flex;justify-content:space-between;align-items:center}.skill-indicator-label{font-size:var(--text-sm);color:var(--color-text-secondary)}.skill-indicator-value{font-size:var(--text-lg);font-weight:700;color:var(--color-brand-primary)}.difficulty-meter{height:8px;background-color:var(--color-bg-card);border-radius:var(--radius-full);overflow:hidden;position:relative}.difficulty-meter-fill{height:100%;border-radius:var(--radius-full);transition:width var(--transition-slow),background-color var(--transition-slow)}.difficulty-meter-fill.level-easy{background-color:var(--color-success)}.difficulty-meter-fill.level-medium{background-color:var(--color-warning)}.difficulty-meter-fill.level-hard{background-color:var(--color-error)}.difficulty-labels{display:flex;justify-content:space-between;font-size:var(--text-xs);color:var(--color-text-muted);margin-top:var(--space-1)}.adaptive-toggle{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-3);background-color:var(--color-bg-secondary);border-radius:var(--radius-lg)}.adaptive-toggle-info{flex:1}.adaptive-toggle-title{font-weight:600;margin-bottom:var(--space-1)}.adaptive-toggle-desc{font-size:var(--text-sm);color:var(--color-text-secondary)}.switch{position:relative;width:48px;height:28px}.switch input{opacity:0;width:0;height:0}.switch-slider{position:absolute;cursor:pointer;inset:0;background-color:var(--color-bg-card);border-radius:var(--radius-full);transition:var(--transition-fast)}.switch-slider:before{position:absolute;content:"";height:22px;width:22px;left:3px;bottom:3px;background-color:#fff;border-radius:50%;transition:var(--transition-fast)}.switch input:checked+.switch-slider{background-color:var(--color-brand-primary)}.switch input:checked+.switch-slider:before{transform:translate(20px)}.switch input:focus+.switch-slider{box-shadow:0 0 0 2px var(--focus-ring-color)}.skill-metrics-panel{background-color:var(--color-bg-secondary);border-radius:var(--radius-xl);padding:var(--space-4)}.skill-metrics-title{font-size:var(--text-lg);font-weight:600;margin-bottom:var(--space-4)}.skill-metrics-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--space-3)}.skill-metric{display:flex;flex-direction:column;gap:var(--space-1)}.skill-metric-label{font-size:var(--text-xs);color:var(--color-text-muted);text-transform:uppercase;letter-spacing:.05em}.skill-metric-value{font-size:var(--text-lg);font-weight:600}.difficulty-adjustment{display:flex;align-items:center;gap:var(--space-2);padding:var(--space-3);border-radius:var(--radius-lg);font-size:var(--text-sm);animation:slideDown .3s ease}@keyframes slideDown{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.difficulty-adjustment.up{background-color:#22c55e33;color:var(--color-success)}.difficulty-adjustment.down{background-color:#3b82f633;color:var(--color-info)}.level-recommendation{background-color:var(--color-bg-card);border-radius:var(--radius-lg);padding:var(--space-4);border-left:4px solid var(--color-brand-primary)}.level-recommendation-header{display:flex;align-items:center;gap:var(--space-2);margin-bottom:var(--space-2)}.level-recommendation-badge{padding:var(--space-1) var(--space-2);background-color:var(--color-brand-primary);color:#fff;border-radius:var(--radius-sm);font-size:var(--text-xs);font-weight:600;text-transform:uppercase}.level-recommendation-difficulty{font-size:var(--text-sm);color:var(--color-text-secondary)}.level-recommendation-alternatives{margin-top:var(--space-3);padding-top:var(--space-3);border-top:1px solid var(--color-bg-elevated)}.level-recommendation-alternatives-title{font-size:var(--text-xs);color:var(--color-text-muted);margin-bottom:var(--space-2)}.skill-history{display:flex;align-items:flex-end;gap:2px;height:40px;margin-top:var(--space-2)}.skill-history-bar{flex:1;background-color:var(--color-brand-secondary);border-radius:var(--radius-sm) var(--radius-sm) 0 0;min-height:4px;transition:height var(--transition-fast)}.skill-history-bar.fail{background-color:var(--color-error)}.skill-history-bar.success{background-color:var(--color-success)}@media (max-width: 480px){.skill-metrics-grid{grid-template-columns:1fr}}@media (prefers-reduced-motion: reduce){.difficulty-adjustment,.difficulty-meter-fill,.switch-slider,.switch-slider:before{transition:none}.difficulty-adjustment{animation:none}}.container{max-width:1200px;margin:0 auto;padding:var(--space-6);min-height:100vh;display:flex;flex-direction:column}header{text-align:center;margin-bottom:var(--space-8);position:relative}header h1{font-size:var(--text-3xl);background:linear-gradient(135deg,var(--color-brand-primary),var(--color-brand-secondary));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;margin-bottom:var(--space-2)}.subtitle{color:var(--color-text-secondary);font-size:var(--text-lg)}.profile-link{position:absolute;right:0;top:0;padding:var(--space-2) var(--space-3);background-color:var(--color-bg-secondary);border-radius:var(--radius-lg);font-size:var(--text-sm);color:var(--color-text-secondary);transition:all var(--transition-fast)}.profile-link:hover{background-color:var(--color-bg-card);color:var(--color-text-primary)}.games-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:var(--space-5);flex:1}.game-card{background-color:var(--color-bg-secondary);border-radius:var(--radius-xl);padding:var(--space-5);text-align:center;transition:transform var(--transition-base),box-shadow var(--transition-base)}.game-card-link{text-decoration:none;color:inherit}.game-card-link:hover .game-card:not(.coming-soon){transform:translateY(-4px);box-shadow:var(--shadow-lg)}.game-card.coming-soon{opacity:.8}.game-card.coming-soon:hover{transform:none;box-shadow:none}.game-card-image{aspect-ratio:16/9;background-color:var(--color-bg-card);border-radius:var(--radius-lg);display:flex;align-items:center;justify-content:center;font-size:3rem;margin-bottom:var(--space-4)}.game-card-name{font-size:var(--text-lg);font-weight:600;margin-bottom:var(--space-2)}.game-card-desc{color:var(--color-text-secondary);font-size:var(--text-sm);margin-bottom:var(--space-3)}footer{text-align:center;margin-top:var(--space-8);padding-top:var(--space-6);border-top:1px solid var(--color-bg-card);color:var(--color-text-muted);font-size:var(--text-sm)}.streak-indicator{display:inline-flex;align-items:center;gap:var(--space-1);padding:var(--space-1) var(--space-3);background:linear-gradient(135deg,#fb923c33,#fb923c1a);border-radius:var(--radius-full);font-size:var(--text-sm);font-weight:600;color:#fb923c;margin-top:var(--space-2)}.daily-indicator{display:inline-flex;align-items:center;gap:var(--space-1);padding:var(--space-1) var(--space-3);background:linear-gradient(135deg,#22c55e33,#22c55e1a);border-radius:var(--radius-full);font-size:var(--text-sm);font-weight:600;color:var(--color-success);margin-top:var(--space-2);margin-left:var(--space-2)}.xp-badge{font-size:var(--text-xs);opacity:.7;margin-left:var(--space-1)}.install-banner{position:fixed;bottom:0;left:0;right:0;background:linear-gradient(135deg,var(--color-brand-primary),var(--color-brand-secondary));color:#fff;padding:var(--space-4);z-index:var(--z-modal);animation:slideUp .3s ease}.install-content{max-width:600px;margin:0 auto;display:flex;justify-content:space-between;align-items:center;gap:var(--space-4)}.install-actions{display:flex;gap:var(--space-2);flex-shrink:0}.install-btn{padding:var(--space-2) var(--space-4);background-color:#fff;color:var(--color-brand-primary);border:none;border-radius:var(--radius-lg);font-weight:600;cursor:pointer;transition:transform var(--transition-fast)}.install-btn:hover{transform:scale(1.05)}.install-dismiss{padding:var(--space-2) var(--space-4);background-color:transparent;color:#fff;border:1px solid rgba(255,255,255,.3);border-radius:var(--radius-lg);cursor:pointer;transition:all var(--transition-fast)}.install-dismiss:hover{background-color:#ffffff1a}.update-notification{position:fixed;bottom:var(--space-4);right:var(--space-4);background-color:var(--color-bg-elevated);color:var(--color-text-primary);padding:var(--space-3) var(--space-4);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);display:flex;align-items:center;gap:var(--space-3);z-index:var(--z-toast);animation:slideUp .3s ease}.update-notification button{padding:var(--space-1) var(--space-3);background-color:var(--color-brand-primary);color:#fff;border:none;border-radius:var(--radius-md);font-size:var(--text-sm);cursor:pointer}@media (max-width: 600px){.container{padding:var(--space-4)}header h1{font-size:var(--text-2xl)}.profile-link{position:static;display:inline-block;margin-bottom:var(--space-4)}.games-grid{grid-template-columns:1fr;gap:var(--space-4)}.install-content{flex-direction:column;text-align:center}.install-actions{width:100%;justify-content:center}.update-notification{left:var(--space-4);right:var(--space-4)}}.header-nav{position:absolute;right:0;top:0;display:flex;gap:var(--space-2)}.profile-link,.settings-link{padding:var(--space-2) var(--space-3);background-color:var(--color-bg-secondary);border-radius:var(--radius-lg);font-size:var(--text-sm);color:var(--color-text-secondary);transition:all var(--transition-fast);text-decoration:none}.profile-link:hover,.settings-link:hover{background-color:var(--color-bg-card);color:var(--color-text-primary)}@media (max-width: 600px){.header-nav{position:static;display:flex;justify-content:center;gap:var(--space-3);margin-bottom:var(--space-4)}}.zen-mode{--color-fluid-1: #D4A5A5;--color-fluid-2: #D4BBA5;--color-fluid-3: #D4CFA5;--color-fluid-4: #A5D4B8;--color-fluid-5: #A5C4D4;--color-fluid-6: #A5B4D4;--color-fluid-7: #C4A5D4;--color-fluid-8: #D4A5C4;--color-bg-primary: #1a1a2e;--color-bg-secondary: #2a2a3e;--color-bg-card: #3a3a4e;--color-bg-elevated: #4a4a5e;--color-text-primary: rgba(255, 255, 255, .9);--color-text-secondary: rgba(255, 255, 255, .7);--color-text-muted: rgba(255, 255, 255, .5);--animation-speed: 1.5;--transition-fast: calc(.15s * var(--animation-speed));--transition-base: calc(.25s * var(--animation-speed));--transition-slow: calc(.35s * var(--animation-speed));--animation-duration-fast: calc(.15s * var(--animation-speed));--animation-duration-base: calc(.25s * var(--animation-speed));--animation-duration-slow: calc(.35s * var(--animation-speed));--zen-easing: cubic-bezier(.4, 0, .2, 1)}.zen-mode .move-counter,.zen-mode .timer,.zen-mode .star-rating,.zen-mode .optimal-moves,.zen-mode .achievement-toast,.zen-mode .score-display,.zen-mode .leaderboard-link,.zen-mode .daily-challenge-badge,.zen-mode .streak-indicator,.zen-mode .daily-indicator{display:none!important}.zen-mode .undo-btn,.zen-mode .restart-btn,.zen-mode .game-btn-ghost{opacity:.5;transition:opacity var(--transition-base)}.zen-mode .undo-btn:hover,.zen-mode .restart-btn:hover,.zen-mode .game-btn-ghost:hover{opacity:.8}.zen-mode .pour-animation,.zen-mode .pour-liquid{animation-duration:calc(.6s * var(--animation-speed))!important;animation-timing-function:var(--zen-easing)!important}.zen-mode .slide-animation,.zen-mode .car-slide{animation-duration:calc(.4s * var(--animation-speed))!important;animation-timing-function:var(--zen-easing)!important}.zen-mode .fade-in{animation:zen-fade-in calc(.5s * var(--animation-speed)) var(--zen-easing)}@keyframes zen-fade-in{0%{opacity:0}to{opacity:1}}.zen-mode .celebration,.zen-mode .confetti,.zen-mode .sparkle,.zen-mode .particles{display:none!important}.zen-mode .level-complete{animation:gentle-fade calc(2s * var(--animation-speed)) ease}.zen-mode .level-complete-title{font-size:var(--text-2xl);font-weight:300;color:var(--color-text-primary);letter-spacing:.05em}.zen-mode .level-complete-message{font-size:var(--text-lg);color:var(--color-text-secondary);margin-top:var(--space-2)}.zen-mode .zen-complete-message{display:flex;flex-direction:column;align-items:center;gap:var(--space-4);padding:var(--space-6)}.zen-mode .zen-complete-message .emoji{font-size:3rem;animation:zen-glow 3s ease-in-out infinite}@keyframes zen-glow{0%,to{filter:brightness(1)}50%{filter:brightness(1.2)}}.zen-mode .zen-complete-message .message{font-size:var(--text-xl);font-weight:300;color:var(--color-text-primary)}.zen-mode .game-btn{border-radius:var(--radius-xl);box-shadow:none}.zen-mode .game-btn-primary{background:linear-gradient(135deg,#6366f199,#8b5cf699);transition:all var(--transition-base) var(--zen-easing)}.zen-mode .game-btn-primary:hover:not(:disabled){background:linear-gradient(135deg,#6366f1cc,#8b5cf6cc);transform:translateY(-2px);box-shadow:0 4px 12px #6366f14d}.zen-session-summary{text-align:center;padding:var(--space-6);max-width:320px;margin:0 auto}.zen-session-summary .icon{font-size:3rem;margin-bottom:var(--space-4)}.zen-session-summary .title{font-size:var(--text-xl);font-weight:600;margin-bottom:var(--space-2);color:var(--color-text-primary)}.zen-session-summary .stats{font-size:var(--text-lg);color:var(--color-text-secondary);margin-bottom:var(--space-3)}.zen-session-summary .time{font-size:var(--text-base);color:var(--color-text-muted);margin-bottom:var(--space-4)}.zen-session-summary .quote{font-style:italic;color:var(--color-text-secondary);margin-bottom:var(--space-6);line-height:1.6}.zen-session-summary .actions{display:flex;gap:var(--space-3);justify-content:center}.zen-toggle-container{display:flex;align-items:center;justify-content:space-between;padding:var(--space-4);background-color:var(--color-bg-secondary);border-radius:var(--radius-lg);margin-bottom:var(--space-3)}.zen-toggle-info{display:flex;align-items:center;gap:var(--space-3)}.zen-toggle-info .icon{font-size:var(--text-xl)}.zen-toggle-info .label{font-weight:600}.zen-toggle-info .description{font-size:var(--text-sm);color:var(--color-text-muted);margin-top:var(--space-1)}.zen-toggle{position:relative;width:52px;height:28px}.zen-toggle input{opacity:0;width:0;height:0}.zen-toggle-slider{position:absolute;cursor:pointer;inset:0;background-color:var(--color-bg-card);transition:background-color var(--transition-base);border-radius:var(--radius-full)}.zen-toggle-slider:before{position:absolute;content:"";height:22px;width:22px;left:3px;bottom:3px;background-color:var(--color-text-primary);transition:transform var(--transition-base);border-radius:50%}.zen-toggle input:checked+.zen-toggle-slider{background:linear-gradient(135deg,var(--color-brand-primary),var(--color-brand-secondary))}.zen-toggle input:checked+.zen-toggle-slider:before{transform:translate(24px)}.zen-toggle input:focus-visible+.zen-toggle-slider{outline:3px solid var(--color-brand-accent);outline-offset:2px}.zen-settings{margin-top:var(--space-4);padding:var(--space-4);background-color:var(--color-bg-secondary);border-radius:var(--radius-lg);animation:zen-fade-in calc(.3s * var(--animation-speed)) var(--zen-easing)}.zen-settings.hidden{display:none}.zen-settings-title{font-size:var(--text-sm);font-weight:600;color:var(--color-text-secondary);text-transform:uppercase;letter-spacing:.05em;margin-bottom:var(--space-3)}.zen-setting-row{display:flex;align-items:center;justify-content:space-between;padding:var(--space-3) 0;border-bottom:1px solid var(--color-bg-card)}.zen-setting-row:last-child{border-bottom:none}.zen-setting-row label{font-size:var(--text-sm);color:var(--color-text-primary)}.zen-ambiance-select{padding:var(--space-2) var(--space-3);background-color:var(--color-bg-card);color:var(--color-text-primary);border:1px solid var(--color-bg-elevated);border-radius:var(--radius-md);font-size:var(--text-sm);cursor:pointer}.zen-ambiance-select:focus{outline:2px solid var(--color-brand-primary);outline-offset:2px}.zen-volume-slider{width:120px;height:6px;appearance:none;background:var(--color-bg-card);border-radius:var(--radius-full);cursor:pointer}.zen-volume-slider::-webkit-slider-thumb{appearance:none;width:18px;height:18px;background:var(--color-brand-primary);border-radius:50%;cursor:pointer;transition:transform var(--transition-fast)}.zen-volume-slider::-webkit-slider-thumb:hover{transform:scale(1.1)}.zen-volume-slider::-moz-range-thumb{width:18px;height:18px;background:var(--color-brand-primary);border-radius:50%;border:none;cursor:pointer}body{transition:background-color calc(.5s * var(--animation-speed, 1)) ease,color calc(.5s * var(--animation-speed, 1)) ease}.zen-mode-transitioning *{transition-duration:calc(.5s * var(--animation-speed, 1))!important}@media (prefers-reduced-motion: reduce){.zen-mode{--animation-speed: .01}.zen-mode .zen-complete-message .emoji{animation:none}}@media (max-width: 600px){.zen-session-summary{padding:var(--space-4)}.zen-session-summary .actions{flex-direction:column}.zen-toggle-container{flex-direction:column;align-items:flex-start;gap:var(--space-3)}.zen-toggle{align-self:flex-end}}.zen-session-overlay{background-color:#1a1a2ef2}.zen-session-summary{background:linear-gradient(135deg,var(--color-bg-secondary),rgba(99,102,241,.1));border:1px solid rgba(99,102,241,.2)}.zen-session-icon{font-size:4rem;margin-bottom:var(--space-4);animation:zen-float 3s ease-in-out infinite}@keyframes zen-float{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}.zen-session-title{font-size:var(--text-2xl);font-weight:300;color:var(--color-text-primary);margin-bottom:var(--space-4);letter-spacing:.05em}.zen-session-stats{font-size:var(--text-lg);color:var(--color-text-secondary);margin-bottom:var(--space-2)}.zen-session-time{font-size:var(--text-base);color:var(--color-text-muted);margin-bottom:var(--space-4)}.zen-session-quote{font-style:italic;color:var(--color-text-secondary);line-height:1.6;margin-bottom:var(--space-6);max-width:280px}.zen-session-actions{display:flex;flex-direction:column;gap:var(--space-3)}.zen-session-actions .game-btn{min-width:200px}.zen-level-complete{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);z-index:var(--z-overlay);pointer-events:none}.zen-level-complete .zen-complete-message{display:flex;flex-direction:column;align-items:center;gap:var(--space-3);padding:var(--space-6);background:linear-gradient(135deg,#6366f133,#8b5cf633);border-radius:var(--radius-xl);backdrop-filter:blur(10px)}.zen-level-complete .zen-complete-message .emoji{font-size:3rem}.zen-level-complete .zen-complete-message .message{font-size:var(--text-xl);font-weight:300;color:var(--color-text-primary);letter-spacing:.05em}.zen-level-complete.fade-in{animation:zen-fade-in .5s ease forwards}.zen-level-complete.fade-out{animation:zen-fade-out .5s ease forwards}@keyframes zen-fade-in{0%{opacity:0;transform:translate(-50%,-50%) scale(.9)}to{opacity:1;transform:translate(-50%,-50%) scale(1)}}@keyframes zen-fade-out{0%{opacity:1;transform:translate(-50%,-50%) scale(1)}to{opacity:0;transform:translate(-50%,-50%) scale(.9)}}.zen-mode-indicator{display:inline-flex;align-items:center;gap:var(--space-2);padding:var(--space-2) var(--space-3);background:linear-gradient(135deg,#6366f133,#8b5cf633);border-radius:var(--radius-full);font-size:var(--text-sm);color:var(--color-brand-secondary);border:1px solid rgba(139,92,246,.3)}.zen-mode-indicator .icon{animation:zen-pulse 2s ease-in-out infinite}@keyframes zen-pulse{0%,to{opacity:1}50%{opacity:.6}}@media (max-width: 400px){.zen-session-summary{padding:var(--space-4);margin:var(--space-4)}.zen-session-icon{font-size:3rem}.zen-session-title{font-size:var(--text-xl)}.zen-session-actions .game-btn{min-width:160px}}@media (prefers-reduced-motion: reduce){.zen-session-icon,.zen-mode-indicator .icon{animation:none}.zen-level-complete.fade-in,.zen-level-complete.fade-out{animation-duration:.01ms}}.spinner{display:inline-block;width:24px;height:24px;border:3px solid var(--color-bg-card);border-top-color:var(--color-brand-primary);border-radius:50%;animation:spin 1s linear infinite}.spinner-sm{width:16px;height:16px;border-width:2px}.spinner-lg{width:40px;height:40px;border-width:4px}.spinner-xl{width:64px;height:64px;border-width:5px}.spinner-primary{border-top-color:var(--color-brand-primary)}.spinner-secondary{border-top-color:var(--color-brand-secondary)}.spinner-success{border-top-color:var(--color-success)}.spinner-white{border-color:#ffffff4d;border-top-color:#fff}@media (prefers-reduced-motion: reduce){.spinner{animation:none;border-top-color:var(--color-brand-primary);border-right-color:var(--color-brand-primary);opacity:.7}}@keyframes spin{to{transform:rotate(360deg)}}.skeleton{background:linear-gradient(90deg,var(--color-bg-card) 25%,var(--color-bg-elevated) 50%,var(--color-bg-card) 75%);background-size:200% 100%;animation:shimmer 1.5s infinite;border-radius:var(--radius-md)}.skeleton-text{height:1em;margin-bottom:var(--space-2)}.skeleton-text:last-child{width:70%}.skeleton-heading{height:1.5em;width:50%;margin-bottom:var(--space-3)}.skeleton-avatar{width:48px;height:48px;border-radius:var(--radius-full)}.skeleton-thumbnail{width:100%;aspect-ratio:16/9}.skeleton-card{padding:var(--space-4);background-color:var(--color-bg-secondary);border-radius:var(--radius-xl)}.skeleton-card .skeleton-thumbnail{margin-bottom:var(--space-3)}@media (prefers-reduced-motion: reduce){.skeleton{animation:none;background:var(--color-bg-card)}}@keyframes shimmer{0%{background-position:200% 0}to{background-position:-200% 0}}.loading-overlay{position:absolute;inset:0;background-color:#00000080;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--space-3);z-index:var(--z-overlay);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}.loading-overlay-text{color:var(--color-text-primary);font-size:var(--text-sm);font-weight:500}.loading-page{position:fixed;inset:0;background-color:var(--color-bg-primary);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--space-4);z-index:var(--z-modal)}.loading-page-logo{font-size:var(--text-3xl);animation:pulse 2s ease-in-out infinite}@keyframes pulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.7;transform:scale(.95)}}.progress-linear{height:4px;background-color:var(--color-bg-card);border-radius:var(--radius-full);overflow:hidden}.progress-linear-fill{height:100%;background:linear-gradient(90deg,var(--color-brand-primary),var(--color-brand-secondary));border-radius:var(--radius-full);transition:width var(--transition-slow)}.progress-linear.indeterminate .progress-linear-fill{width:50%!important;animation:indeterminate 1.5s ease-in-out infinite}@keyframes indeterminate{0%{transform:translate(-100%)}to{transform:translate(200%)}}.progress-circular{position:relative;width:48px;height:48px}.progress-circular svg{transform:rotate(-90deg)}.progress-circular-track{fill:none;stroke:var(--color-bg-card);stroke-width:4}.progress-circular-fill{fill:none;stroke:var(--color-brand-primary);stroke-width:4;stroke-linecap:round;transition:stroke-dashoffset var(--transition-slow)}.error-container{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:var(--space-8);text-align:center}.error-icon{font-size:3rem;margin-bottom:var(--space-4);opacity:.8}.error-title{font-size:var(--text-xl);font-weight:600;color:var(--color-text-primary);margin-bottom:var(--space-2)}.error-message{font-size:var(--text-sm);color:var(--color-text-secondary);margin-bottom:var(--space-4);max-width:300px}.error-actions{display:flex;gap:var(--space-2)}.error-inline{display:inline-flex;align-items:center;gap:var(--space-2);padding:var(--space-2) var(--space-3);background-color:#ef44441a;border:1px solid rgba(239,68,68,.3);border-radius:var(--radius-md);color:var(--color-error);font-size:var(--text-sm)}.error-inline-icon{font-size:1em}.error-toast{position:fixed;bottom:var(--space-4);left:50%;transform:translate(-50%);display:flex;align-items:center;gap:var(--space-3);padding:var(--space-3) var(--space-4);background-color:var(--color-error);color:#fff;border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);z-index:var(--z-toast);animation:slideUp .3s ease}.error-toast-icon{font-size:var(--text-lg)}.error-toast-close{padding:var(--space-1);background:transparent;border:none;color:#fff;opacity:.8;cursor:pointer;transition:opacity var(--transition-fast)}.error-toast-close:hover{opacity:1}.empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:var(--space-8);text-align:center}.empty-state-icon{font-size:4rem;margin-bottom:var(--space-4);opacity:.5}.empty-state-title{font-size:var(--text-lg);font-weight:600;color:var(--color-text-primary);margin-bottom:var(--space-2)}.empty-state-message{font-size:var(--text-sm);color:var(--color-text-secondary);margin-bottom:var(--space-4);max-width:280px}.empty-state-action{margin-top:var(--space-2)}.success-container{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:var(--space-8);text-align:center}.success-icon{font-size:4rem;margin-bottom:var(--space-4);animation:bounceIn .5s ease}.success-title{font-size:var(--text-xl);font-weight:600;color:var(--color-success);margin-bottom:var(--space-2)}.success-message{font-size:var(--text-sm);color:var(--color-text-secondary);margin-bottom:var(--space-4)}@keyframes bounceIn{0%{transform:scale(0);opacity:0}50%{transform:scale(1.2)}to{transform:scale(1);opacity:1}}.optimistic{position:relative}.optimistic:after{content:"";position:absolute;top:0;left:0;right:0;height:2px;background:linear-gradient(90deg,var(--color-brand-primary),var(--color-brand-secondary));animation:optimisticSlide 1s ease-in-out infinite}@keyframes optimisticSlide{0%{transform:translate(-100%)}to{transform:translate(100%)}}.btn-loading{position:relative;color:transparent!important;pointer-events:none}.btn-loading:after{content:"";position:absolute;top:50%;left:50%;width:16px;height:16px;margin:-8px 0 0 -8px;border:2px solid rgba(255,255,255,.3);border-top-color:#fff;border-radius:50%;animation:spin 1s linear infinite}.network-status{position:fixed;top:0;left:0;right:0;padding:var(--space-2);text-align:center;font-size:var(--text-sm);font-weight:500;z-index:var(--z-toast);transform:translateY(-100%);transition:transform var(--transition-base)}.network-status.offline{background-color:var(--color-error);color:#fff;transform:translateY(0)}.network-status.online{background-color:var(--color-success);color:#fff;transform:translateY(0)}.network-status.online{animation:slideDownThenUp 3s ease forwards}@keyframes slideDownThenUp{0%,10%{transform:translateY(0)}90%,to{transform:translateY(-100%)}}.content-placeholder{display:flex;flex-direction:column;gap:var(--space-3);padding:var(--space-4)}.content-placeholder-row{display:flex;gap:var(--space-3);align-items:center}.content-placeholder-avatar{width:40px;height:40px;border-radius:var(--radius-full);flex-shrink:0}.content-placeholder-content{flex:1;display:flex;flex-direction:column;gap:var(--space-2)}.game-btn{position:relative;overflow:hidden;transform:translateZ(0);transition:all var(--transition-fast)}.game-btn:hover:not(:disabled){transform:translateY(-2px);box-shadow:var(--shadow-md)}.game-btn-primary:hover:not(:disabled){box-shadow:0 4px 12px #6366f166}.game-btn:active:not(:disabled){transform:translateY(0) scale(.98);box-shadow:var(--shadow-sm)}.ripple{position:absolute;border-radius:50%;background-color:#ffffff4d;transform:scale(0);animation:ripple .6s linear;pointer-events:none}@keyframes ripple{to{transform:scale(4);opacity:0}}.icon-btn-action{transition:transform var(--transition-fast)}.icon-btn-action:active{transform:scale(.9) rotate(-10deg)}.icon-btn-action.success{animation:successPop .3s ease}@keyframes successPop{0%{transform:scale(1)}50%{transform:scale(1.2)}to{transform:scale(1)}}.game-card{position:relative;transition:transform var(--transition-base),box-shadow var(--transition-base)}.game-card:before{content:"";position:absolute;inset:0;border-radius:inherit;background:linear-gradient(135deg,rgba(255,255,255,.1) 0%,transparent 50%);opacity:0;transition:opacity var(--transition-base);pointer-events:none}.game-card:hover:before{opacity:1}.game-card-link:hover .game-card{transform:translateY(-4px);box-shadow:var(--shadow-lg),0 0 20px #6366f11a}@media (hover: none){.game-card:active{transform:scale(.98)}}input[type=text],input[type=number],textarea,select{transition:border-color var(--transition-fast),box-shadow var(--transition-fast)}input:focus,textarea:focus,select:focus{border-color:var(--color-brand-primary);box-shadow:0 0 0 3px #6366f133}.input-error{animation:shake .4s ease}@keyframes shake{0%,to{transform:translate(0)}20%,60%{transform:translate(-8px)}40%,80%{transform:translate(8px)}}.checkbox-animated{position:relative;width:20px;height:20px}.checkbox-animated input{opacity:0;position:absolute}.checkbox-animated .checkmark{position:absolute;inset:0;background-color:var(--color-bg-card);border:2px solid var(--color-bg-elevated);border-radius:var(--radius-sm);transition:all var(--transition-fast)}.checkbox-animated input:checked+.checkmark{background-color:var(--color-brand-primary);border-color:var(--color-brand-primary)}.checkbox-animated .checkmark:after{content:"";position:absolute;left:6px;top:2px;width:5px;height:10px;border:solid white;border-width:0 2px 2px 0;transform:rotate(45deg) scale(0);transition:transform var(--transition-fast)}.checkbox-animated input:checked+.checkmark:after{transform:rotate(45deg) scale(1)}.toast{animation:toastSlideIn .3s ease}.toast.hiding{animation:toastSlideOut .3s ease forwards}@keyframes toastSlideIn{0%{opacity:0;transform:translateY(20px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes toastSlideOut{0%{opacity:1;transform:translateY(0) scale(1)}to{opacity:0;transform:translateY(-10px) scale(.95)}}.game-overlay{transition:opacity var(--transition-base),visibility var(--transition-base)}.game-overlay.active{animation:fadeIn .2s ease}.game-overlay.closing{animation:fadeOut .2s ease forwards}.game-overlay-content{animation:modalSlideIn .3s ease}.game-overlay.closing .game-overlay-content{animation:modalSlideOut .2s ease forwards}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes fadeOut{0%{opacity:1}to{opacity:0}}@keyframes modalSlideIn{0%{opacity:0;transform:scale(.9) translateY(20px)}to{opacity:1;transform:scale(1) translateY(0)}}@keyframes modalSlideOut{0%{opacity:1;transform:scale(1) translateY(0)}to{opacity:0;transform:scale(.9) translateY(10px)}}.page-enter{animation:pageEnter .3s ease}@keyframes pageEnter{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.stagger-children>*{opacity:0;animation:staggerFadeIn .4s ease forwards}.stagger-children>*:nth-child(1){animation-delay:0ms}.stagger-children>*:nth-child(2){animation-delay:50ms}.stagger-children>*:nth-child(3){animation-delay:.1s}.stagger-children>*:nth-child(4){animation-delay:.15s}.stagger-children>*:nth-child(5){animation-delay:.2s}.stagger-children>*:nth-child(6){animation-delay:.25s}.stagger-children>*:nth-child(7){animation-delay:.3s}.stagger-children>*:nth-child(8){animation-delay:.35s}@keyframes staggerFadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.confetti-container{position:fixed;inset:0;pointer-events:none;z-index:var(--z-modal);overflow:hidden}.confetti{position:absolute;width:10px;height:10px;background-color:var(--color-brand-primary);animation:confettiFall 3s ease-out forwards}@keyframes confettiFall{0%{transform:translateY(-100vh) rotate(0);opacity:1}to{transform:translateY(100vh) rotate(720deg);opacity:0}}.star-burst{position:absolute;width:20px;height:20px;animation:starBurst .6s ease-out forwards}@keyframes starBurst{0%{transform:scale(0) rotate(0);opacity:1}50%{transform:scale(1.5) rotate(180deg);opacity:.8}to{transform:scale(0) rotate(360deg);opacity:0}}.celebration{animation:celebration .5s ease}@keyframes celebration{0%,to{transform:scale(1)}25%{transform:scale(1.05)}50%{transform:scale(.95)}75%{transform:scale(1.02)}}.number-increment{display:inline-block;animation:numberPop .3s ease}@keyframes numberPop{0%{transform:scale(1)}50%{transform:scale(1.3);color:var(--color-brand-accent)}to{transform:scale(1)}}.score-fly-in{animation:scoreFlyIn .5s ease forwards}@keyframes scoreFlyIn{0%{opacity:0;transform:translateY(-20px) scale(.5)}to{opacity:1;transform:translateY(0) scale(1)}}.tooltip{position:relative}.tooltip:after{content:attr(data-tooltip);position:absolute;bottom:100%;left:50%;transform:translate(-50%) translateY(-4px);padding:var(--space-2) var(--space-3);background-color:var(--color-bg-elevated);color:var(--color-text-primary);font-size:var(--text-xs);white-space:nowrap;border-radius:var(--radius-md);box-shadow:var(--shadow-md);opacity:0;visibility:hidden;transition:all var(--transition-fast);pointer-events:none;z-index:var(--z-elevated)}.tooltip:hover:after{opacity:1;visibility:visible;transform:translate(-50%) translateY(-8px)}.loading-dots{display:inline-flex;gap:4px}.loading-dots span{width:8px;height:8px;background-color:var(--color-brand-primary);border-radius:50%;animation:loadingDot 1.4s infinite ease-in-out both}.loading-dots span:nth-child(1){animation-delay:-.32s}.loading-dots span:nth-child(2){animation-delay:-.16s}.loading-dots span:nth-child(3){animation-delay:0s}@keyframes loadingDot{0%,80%,to{transform:scale(0)}40%{transform:scale(1)}}.focus-animated:focus-visible{outline:none;box-shadow:0 0 #6366f166;animation:focusRing .3s ease forwards}@keyframes focusRing{to{box-shadow:0 0 0 3px #6366f166}}@media (prefers-reduced-motion: reduce){.game-btn,.game-card,.toast,.game-overlay,.game-overlay-content,.ripple,.confetti,.star-burst,.number-increment,.score-fly-in,.loading-dots span{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}.game-btn:hover:not(:disabled),.game-card-link:hover .game-card{transform:none}}@supports (-webkit-touch-callout: none){.container,.game-container,body{min-height:100vh;min-height:100dvh}.full-height-ios{position:fixed;inset:0}}@supports (padding: max(0px)){.container,.game-container{padding-left:max(var(--space-4),env(safe-area-inset-left));padding-right:max(var(--space-4),env(safe-area-inset-right));padding-bottom:max(var(--space-4),env(safe-area-inset-bottom))}header,.game-header{padding-top:max(var(--space-3),env(safe-area-inset-top))}footer{padding-bottom:max(var(--space-4),env(safe-area-inset-bottom))}.game-controls,.install-banner{padding-bottom:max(var(--space-4),env(safe-area-inset-bottom))}.game-overlay-content{margin-bottom:max(var(--space-4),env(safe-area-inset-bottom))}}body{overscroll-behavior-y:contain;-webkit-overflow-scrolling:touch}@supports (-webkit-touch-callout: none){.game-overlay,.install-banner,.update-notification{position:absolute}.keyboard-open .game-overlay,.keyboard-open .install-banner{position:fixed}}a,button,input,select,textarea,[role=button],.game-btn,.game-card-link,.icon-btn{touch-action:manipulation}.game-board,.game-card,.game-btn,.game-controls{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}@supports not (height: 100dvh){.container,.game-container{min-height:100vh;min-height:calc(var(--vh, 1vh) * 100)}}@-moz-document url-prefix(){.game-board::-webkit-scrollbar{display:none}.game-board{scrollbar-width:none}}@media (hover: hover) and (pointer: fine){::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:var(--color-bg-primary)}::-webkit-scrollbar-thumb{background:var(--color-bg-card);border-radius:var(--radius-full)}::-webkit-scrollbar-thumb:hover{background:var(--color-bg-elevated)}}@-moz-document url-prefix(){*{scrollbar-width:thin;scrollbar-color:var(--color-bg-card) var(--color-bg-primary)}}@supports not (display: grid){.games-grid{display:flex;flex-wrap:wrap;gap:var(--space-4)}.games-grid>*{flex:1 1 260px;margin:var(--space-2)}}@supports not (--css: variables){.game-btn-primary{background-color:#6366f1;color:#fff}.game-btn-secondary{background-color:#334155;color:#f8fafc}body{background-color:#0f172a;color:#f8fafc}}@supports not (gap: 1rem){.game-header-controls{margin:calc(var(--space-2) * -1);>*{margin:var(--space-2)}}.game-controls{margin:calc(var(--space-3) * -1);>*{margin:var(--space-3)}}}.game-card,.game-btn,.toast,.install-banner,.game-overlay-content{will-change:transform}.animation-complete{will-change:auto}.animating,.sliding,.fading{transform:translateZ(0);backface-visibility:hidden}.game-card{contain:layout style paint}.game-board{contain:layout paint}@media (hover: none) and (pointer: coarse){.game-btn,.icon-btn,.game-card-link,.install-btn,.install-dismiss,.back-link,button[type=button],input[type=submit]{min-height:44px;min-width:44px}.game-header-controls{gap:var(--space-3)}.game-controls{gap:var(--space-4)}.game-btn{touch-action:manipulation}}@media (orientation: landscape) and (max-height: 500px){.game-container{flex-direction:row;max-width:none;padding:var(--space-2)}.game-stats{flex-direction:column;padding:var(--space-2);margin-bottom:0;margin-right:var(--space-3)}.game-board{min-height:auto;flex:1}.game-controls{flex-direction:column;padding:var(--space-2)}}@media (orientation: landscape) and (max-height: 400px){.portrait-hint{display:flex;position:fixed;inset:0;background:#000000e6;color:#fff;align-items:center;justify-content:center;z-index:var(--z-modal);font-size:var(--text-lg);text-align:center;padding:var(--space-4)}}@media (-webkit-min-device-pixel-ratio: 2),(min-resolution: 192dpi){.game-card,.game-btn,.toast,.game-board{border:none;box-shadow:0 0 0 .5px var(--color-bg-elevated)}}@media print{.game-controls,.install-banner,.update-notification,.toast-container,.game-overlay{display:none!important}body{background:#fff;color:#000;font-size:12pt}.game-card{break-inside:avoid;page-break-inside:avoid;border:1px solid #ccc}}@media (prefers-reduced-data: reduce){.game-card,.game-btn,.toast{transition:none}:root{--font-sans: system-ui, sans-serif}.install-banner{background:var(--color-brand-primary)}}.battery-saving *,.battery-saving *:before,.battery-saving *:after{animation-duration:0ms!important;animation-iteration-count:1!important;transition-duration:0ms!important}.battery-saving .particles,.battery-saving .confetti,.battery-saving .sparkle{display:none!important}
