*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{-webkit-text-size-adjust:100%;-webkit-tap-highlight-color:transparent}body{min-height:100vh;line-height:1.5;text-rendering:optimizeSpeed;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}img,picture,video,canvas,svg{display:block;max-width:100%}input,button,textarea,select{font:inherit;color:inherit}button{background:none;border:none;cursor:pointer}a{color:inherit;text-decoration:none}ul,ol{list-style:none}table{border-collapse:collapse;border-spacing:0}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}: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}}.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}.game-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);transition:all var(--transition-fast);cursor:pointer;border:none}.game-btn:disabled{opacity:.5;cursor:not-allowed}.game-btn-primary{background-color:var(--color-brand-primary);color:#fff}.game-btn-primary:hover:not(:disabled){background-color:#4f46e5;transform:translateY(-1px);box-shadow:var(--shadow-md)}.game-btn-secondary{background-color:var(--color-bg-card);color:var(--color-text-primary)}.game-btn-secondary:hover:not(:disabled){background-color:var(--color-bg-elevated)}.game-btn-ghost{background-color:transparent;color:var(--color-text-secondary)}.game-btn-ghost:hover:not(:disabled){background-color:var(--color-bg-secondary);color:var(--color-text-primary)}.game-btn-icon{width:44px;height:44px;padding:0;border-radius:var(--radius-full)}.game-btn-lg{padding:var(--space-4) var(--space-6);font-size:var(--text-base)}.game-card{background-color:var(--color-bg-secondary);border-radius:var(--radius-xl);padding:var(--space-4);box-shadow:var(--shadow-sm)}.game-card-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--space-3)}.game-card-title{font-size:var(--text-lg);font-weight:600}.progress-bar{height:8px;background-color:var(--color-bg-card);border-radius:var(--radius-full);overflow:hidden}.progress-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)}.badge{display:inline-flex;align-items:center;padding:var(--space-1) var(--space-2);font-size:var(--text-xs);font-weight:600;border-radius:var(--radius-full);text-transform:uppercase;letter-spacing:.05em}.badge-success{background-color:#22c55e33;color:var(--color-success)}.badge-warning{background-color:#f59e0b33;color:var(--color-warning)}.badge-error{background-color:#ef444433;color:var(--color-error)}.icon-btn{display:flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:var(--radius-lg);background-color:var(--color-bg-secondary);color:var(--color-text-secondary);transition:all var(--transition-fast)}.icon-btn:hover{background-color:var(--color-bg-card);color:var(--color-text-primary)}.toast-container{position:fixed;bottom:var(--space-4);left:50%;transform:translate(-50%);z-index:var(--z-toast)}.toast{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);margin-top:var(--space-2);animation:slideUp .3s ease}@keyframes slideUp{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.game-directory{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:var(--space-4);padding:var(--space-4)}.game-card-link{display:block;text-decoration:none;color:inherit}.game-card-link:hover .game-card{transform:translateY(-4px);box-shadow:var(--shadow-lg)}.game-card-link .game-card{transition:all var(--transition-base)}.game-card-image{aspect-ratio:16/9;background-color:var(--color-bg-card);border-radius:var(--radius-lg);margin-bottom:var(--space-3);display:flex;align-items:center;justify-content:center;font-size:var(--text-3xl)}.game-card-name{font-size:var(--text-base);font-weight:600;margin-bottom:var(--space-1)}.game-card-desc{font-size:var(--text-sm);color:var(--color-text-secondary)}
