:root{--breakpoint-xs:320px;--breakpoint-sm:480px;--breakpoint-md:768px;--breakpoint-lg:1024px;--breakpoint-xl:1200px;--spacing-xs:0.25rem;--spacing-sm:0.5rem;--spacing-md:1rem;--spacing-lg:1.5rem;--spacing-xl:2rem;--spacing-xxl:3rem;--font-size-xs:0.75rem;--font-size-sm:0.875rem;--font-size-base:1rem;--font-size-lg:1.125rem;--font-size-xl:1.25rem;--font-size-2xl:1.5rem;--font-size-3xl:1.875rem;--font-size-4xl:2.25rem;--touch-target-min:44px;--touch-target-comfortable:48px;--touch-target-large:56px;--container-xs:100%;--container-sm:100%;--container-md:768px;--container-lg:1024px;--container-xl:1200px;--grid-columns:12;--grid-gap:var(--spacing-md);--animation-fast:0.15s;--animation-normal:0.3s;--animation-slow:0.5s}@media (min-width:768px){:root{--spacing-xs:0.375rem;--spacing-sm:0.75rem;--spacing-md:1.25rem;--spacing-lg:2rem;--spacing-xl:2.5rem;--spacing-xxl:4rem;--font-size-xs:0.8125rem;--font-size-sm:0.9375rem;--font-size-base:1.125rem;--font-size-lg:1.25rem;--font-size-xl:1.5rem;--font-size-2xl:1.875rem;--font-size-3xl:2.25rem;--font-size-4xl:3rem}}.container{margin:0 auto;max-width:1200px;max-width:var(--container-xl);padding:0 1rem;padding:0 var(--spacing-md);width:100%}.container--xs{max-width:100%;max-width:var(--container-xs)}.container--sm{max-width:100%;max-width:var(--container-sm)}.container--md{max-width:768px;max-width:var(--container-md)}.container--lg{max-width:1024px;max-width:var(--container-lg)}.container--xl{max-width:1200px;max-width:var(--container-xl)}.grid{grid-gap:1rem;grid-gap:var(--grid-gap);display:grid;gap:1rem;gap:var(--grid-gap);width:100%}.grid--1{grid-template-columns:1fr}.grid--2{grid-template-columns:repeat(2,1fr)}.grid--3{grid-template-columns:repeat(3,1fr)}.grid--4{grid-template-columns:repeat(4,1fr)}@media (min-width:480px){.grid--sm-1{grid-template-columns:1fr}.grid--sm-2{grid-template-columns:repeat(2,1fr)}.grid--sm-3{grid-template-columns:repeat(3,1fr)}.grid--sm-4{grid-template-columns:repeat(4,1fr)}}@media (min-width:768px){.grid--md-1{grid-template-columns:1fr}.grid--md-2{grid-template-columns:repeat(2,1fr)}.grid--md-3{grid-template-columns:repeat(3,1fr)}.grid--md-4{grid-template-columns:repeat(4,1fr)}}@media (min-width:1024px){.grid--lg-1{grid-template-columns:1fr}.grid--lg-2{grid-template-columns:repeat(2,1fr)}.grid--lg-3{grid-template-columns:repeat(3,1fr)}.grid--lg-4{grid-template-columns:repeat(4,1fr)}}.flex{display:flex}.flex-col{flex-direction:column}.flex-row{flex-direction:row}.flex-wrap{flex-wrap:wrap}.flex-nowrap{flex-wrap:nowrap}.justify-start{justify-content:flex-start}.justify-center{justify-content:center}.justify-end{justify-content:flex-end}.justify-between{justify-content:space-between}.justify-around{justify-content:space-around}.items-start{align-items:flex-start}.items-center{align-items:center}.items-end{align-items:flex-end}.items-stretch{align-items:stretch}.touch-target{align-items:center;display:flex;justify-content:center;min-height:44px;min-height:var(--touch-target-min);min-width:44px;min-width:var(--touch-target-min);position:relative}.touch-target--comfortable{min-height:48px;min-height:var(--touch-target-comfortable);min-width:48px;min-width:var(--touch-target-comfortable)}.touch-target--large{min-height:56px;min-height:var(--touch-target-large);min-width:56px;min-width:var(--touch-target-large)}@media (hover:none) and (pointer:coarse){.touch-target:active{transform:scale(.95);transition:transform .15s ease;transition:transform var(--animation-fast) ease}.touch-target{min-height:48px;min-height:var(--touch-target-comfortable);min-width:48px;min-width:var(--touch-target-comfortable)}}.btn{-webkit-tap-highlight-color:transparent;align-items:center;border:2px solid #0000;border-radius:8px;cursor:pointer;display:inline-flex;font-size:1rem;font-size:var(--font-size-base);font-weight:500;justify-content:center;min-height:44px;min-height:var(--touch-target-min);min-width:44px;min-width:var(--touch-target-min);padding:.5rem 1rem;padding:var(--spacing-sm) var(--spacing-md);text-decoration:none;transition:all .3s ease;transition:all var(--animation-normal) ease;-webkit-user-select:none;user-select:none}.btn:disabled{cursor:not-allowed;opacity:.6;pointer-events:none}.btn--small{font-size:.875rem;font-size:var(--font-size-sm);padding:.25rem .5rem;padding:var(--spacing-xs) var(--spacing-sm)}.btn--large{font-size:1.125rem;font-size:var(--font-size-lg);min-height:48px;min-height:var(--touch-target-comfortable);padding:1rem 1.5rem;padding:var(--spacing-md) var(--spacing-lg)}.btn--full{width:100%}@media (hover:none) and (pointer:coarse){.btn:active{transform:scale(.95)}.btn:hover{transform:none}}.text-xs{font-size:.75rem;font-size:var(--font-size-xs)}.text-sm{font-size:.875rem;font-size:var(--font-size-sm)}.text-base{font-size:1rem;font-size:var(--font-size-base)}.text-lg{font-size:1.125rem;font-size:var(--font-size-lg)}.text-xl{font-size:1.25rem;font-size:var(--font-size-xl)}.text-2xl{font-size:1.5rem;font-size:var(--font-size-2xl)}.text-3xl{font-size:1.875rem;font-size:var(--font-size-3xl)}.text-4xl{font-size:2.25rem;font-size:var(--font-size-4xl)}.p-xs{padding:.25rem;padding:var(--spacing-xs)}.p-sm{padding:.5rem;padding:var(--spacing-sm)}.p-md{padding:1rem;padding:var(--spacing-md)}.p-lg{padding:1.5rem;padding:var(--spacing-lg)}.p-xl{padding:2rem;padding:var(--spacing-xl)}.p-xxl{padding:3rem;padding:var(--spacing-xxl)}.m-xs{margin:.25rem;margin:var(--spacing-xs)}.m-sm{margin:.5rem;margin:var(--spacing-sm)}.m-md{margin:1rem;margin:var(--spacing-md)}.m-lg{margin:1.5rem;margin:var(--spacing-lg)}.m-xl{margin:2rem;margin:var(--spacing-xl)}.m-xxl{margin:3rem;margin:var(--spacing-xxl)}.hidden{display:none!important}.show-xs{display:block}.hide-xs{display:none}@media (min-width:480px){.show-sm{display:block}.hide-sm,.show-xs-only{display:none}}@media (min-width:768px){.show-md{display:block}.hide-md,.show-sm-only{display:none}}@media (min-width:1024px){.show-lg{display:block}.hide-lg,.show-md-only{display:none}}@media (min-width:1200px){.show-xl{display:block}.hide-xl,.show-lg-only{display:none}}@media (orientation:portrait){.portrait-only{display:block}.landscape-only{display:none}}@media (orientation:landscape){.portrait-only{display:none}.landscape-only{display:block}}.safe-area-top{padding-top:env(safe-area-inset-top)}.safe-area-bottom{padding-bottom:env(safe-area-inset-bottom)}.safe-area-left{padding-left:env(safe-area-inset-left)}.safe-area-right{padding-right:env(safe-area-inset-right)}.safe-area-all{padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left)}.game-container{margin:0 auto;max-width:400px;padding:1rem;padding:var(--spacing-md);width:100%}@media (min-width:768px){.game-container{max-width:500px;padding:1.5rem;padding:var(--spacing-lg)}}@media (min-width:1024px){.game-container{max-width:600px;padding:2rem;padding:var(--spacing-xl)}}.modal-overlay{align-items:center;background-color:#00000080;bottom:0;display:flex;justify-content:center;left:0;padding:1rem;padding:var(--spacing-md);position:fixed;right:0;top:0;z-index:1000}.modal-content{background:#fff;border-radius:12px;max-height:90vh;max-width:500px;overflow-y:auto;position:relative;width:100%}@media (max-width:768px){.modal-overlay{align-items:flex-end;padding:0}.modal-content{border-radius:12px 12px 0 0;max-height:85vh;width:100%}}.form-group{margin-bottom:1rem;margin-bottom:var(--spacing-md)}.form-label{display:block;font-size:.875rem;font-size:var(--font-size-sm);font-weight:500;margin-bottom:.25rem;margin-bottom:var(--spacing-xs)}.form-input{border:2px solid #e0e0e0;border-radius:8px;font-size:1rem;font-size:var(--font-size-base);min-height:44px;min-height:var(--touch-target-min);padding:.5rem 1rem;padding:var(--spacing-sm) var(--spacing-md);transition:border-color .3s ease;transition:border-color var(--animation-normal) ease;width:100%}.form-input:focus{border-color:#3498db;outline:none}.nav-stack{display:flex;flex-direction:column;gap:.5rem;gap:var(--spacing-sm)}@media (min-width:768px){.nav-stack{align-items:center;flex-direction:row;justify-content:space-between}}@media print{.no-print{display:none!important}.print-only{display:block!important}}@media (prefers-reduced-motion:reduce){*,:after,:before{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}@media (prefers-contrast:high){.btn,.form-input{border-width:3px}}*,:after,:before{box-sizing:border-box;margin:0;padding:0}html{-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%;font-size:16px;line-height:1.5;scroll-behavior:smooth}body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:#f8f9fa;color:#333;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;margin:0;overflow-x:hidden}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}#root,body,html{height:100%}#root,body,html{min-height:100vh;min-height:-webkit-fill-available}body{-webkit-overflow-scrolling:touch}:focus-visible{outline:2px solid #3498db;outline-offset:2px}button{background:none;border:none;cursor:pointer;font:inherit;padding:0}input,select,textarea{color:inherit;font:inherit}embed,iframe,img,object,video{height:auto;max-width:100%}.App{animation:gradientShift 15s ease infinite;background:linear-gradient(-45deg,#ee7752,#e73c7e,#23a6d5,#23d5ab);background-size:400% 400%;display:flex;flex-direction:column;min-height:100vh;min-height:-webkit-fill-available;overflow:hidden;position:relative;text-align:center}.App:before{background:#0000000d}.App:after,.App:before{bottom:0;content:"";left:0;position:absolute;right:0;top:0;z-index:0}.App:after{animation:float 8s ease-in-out infinite;background-image:radial-gradient(circle at 20% 80%,#7877c633 0,#0000 50%),radial-gradient(circle at 80% 20%,#ff77c633 0,#0000 50%),radial-gradient(circle at 40% 40%,#78dbff33 0,#0000 50%)}.App>*{position:relative;z-index:1}.App-header{align-items:center;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;display:flex;flex:1 1;flex-direction:column;font-size:var(--font-size-base);justify-content:center;overflow:hidden;padding:var(--spacing-xl) var(--spacing-md);position:relative}.App-header:before{background:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cdefs%3E%3Cpattern id='a' width='10' height='10' patternUnits='userSpaceOnUse'%3E%3Cpath d='M10 0H0v10' fill='none' stroke='rgba(255,255,255,0.1)' stroke-width='.5'/%3E%3C/pattern%3E%3C/defs%3E%3Cpath fill='url(%23a)' d='M0 0h100v100H0z'/%3E%3C/svg%3E");bottom:0;content:"";left:0;opacity:.3;pointer-events:none;position:absolute;right:0;top:0}.App-header>*{position:relative;z-index:1}.App-header h1{font-size:var(--font-size-4xl);font-weight:700;line-height:1.2;margin-bottom:var(--spacing-lg);text-shadow:0 2px 4px #0000004d}.App-header p{font-size:var(--font-size-lg);line-height:1.6;margin:var(--spacing-sm) 0;max-width:600px;opacity:.9}.App-header small{font-size:var(--font-size-sm);font-weight:300;opacity:.8}@media (max-width:768px){.App-header{padding:var(--spacing-lg) var(--spacing-md);text-align:center}.App-header h1{font-size:var(--font-size-3xl);margin-bottom:var(--spacing-md)}.App-header p{font-size:var(--font-size-base);margin:var(--spacing-xs) 0}}@media (max-width:480px){.App-header{padding:var(--spacing-md)}.App-header h1{font-size:var(--font-size-2xl)}.App-header p{font-size:var(--font-size-sm)}}@media (orientation:landscape) and (max-height:600px){.App-header{justify-content:flex-start;padding:var(--spacing-md);padding-top:var(--spacing-xl)}.App-header h1{font-size:var(--font-size-2xl);margin-bottom:var(--spacing-sm)}.App-header p{font-size:var(--font-size-sm);margin:var(--spacing-xs) 0}}.App-header{padding-left:calc(var(--spacing-md) + env(safe-area-inset-left));padding-right:calc(var(--spacing-md) + env(safe-area-inset-right));padding-top:calc(var(--spacing-xl) + env(safe-area-inset-top))}.App-header h1{animation:fadeInUp .8s ease-out}.App-header p{animation:fadeInUp .8s ease-out .2s both}@keyframes fadeInUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@media (prefers-reduced-motion:reduce){.App-header h1,.App-header p{animation:none}}.update-banner{background:#4a90e2;box-shadow:0 2px 8px #0000001a;font-size:var(--font-size-sm);justify-content:space-between;padding:var(--spacing-sm) var(--spacing-md)}.update-banner span{flex:1 1}.install-banner{align-items:center;background:#4a90e2;bottom:0;box-shadow:0 -2px 8px #0000001a;color:#fff;display:flex;font-size:var(--font-size-sm);justify-content:space-between;left:0;padding:var(--spacing-md);position:fixed;right:0;z-index:1000}.install-banner span{flex:1 1;margin-right:var(--spacing-md)}.close-banner{align-items:center;background:none;border:none;border-radius:50%;color:#fff;cursor:pointer;display:flex;font-size:var(--font-size-xl);height:24px;justify-content:center;margin-left:var(--spacing-sm);padding:0;transition:background-color .2s ease;width:24px}.close-banner:hover{background-color:#fff3}.pwa-badge{backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);background:#fff3;border:1px solid #ffffff4d;border-radius:var(--border-radius-md);color:#fff;font-size:var(--font-size-sm);padding:var(--spacing-xs) var(--spacing-sm)}.pwa-badge span{align-items:center;display:flex;gap:var(--spacing-xs)}.pwa-status-bar{background:#4a90e2;background:var(--primary-color,#4a90e2);font-weight:500;padding:.5rem 1rem;z-index:999}.pwa-status-bar span{margin-right:.5rem}@media (display-mode:standalone){.App{overscroll-behavior:none}.App-header{padding-top:calc(var(--spacing-xl) + env(safe-area-inset-top, 20px))}.install-banner{display:none}}@media (display-mode:standalone) and (-webkit-touch-callout:none){.App{-webkit-touch-callout:none;-webkit-user-select:none}.App-header{padding-top:calc(var(--spacing-xl) + 44px)}}@media (display-mode:fullscreen){.App-header{padding-top:calc(var(--spacing-xl) + env(safe-area-inset-top, 0px))}}@media (display-mode:window-controls-overlay){.App-header{padding-top:calc(var(--spacing-xl) + env(titlebar-area-height, 32px))}}@media (prefers-contrast:high){.install-banner,.update-banner{border:2px solid #fff}.pwa-badge{border:2px solid #fffc}}@media (prefers-reduced-motion:reduce){.install-banner,.pwa-badge,.update-banner{transition:none}}@media (prefers-color-scheme:dark){.install-banner,.update-banner{background:#2c5282}}@media (max-width:768px){.install-banner,.update-banner{font-size:var(--font-size-xs);padding:var(--spacing-sm)}.install-banner{flex-direction:column;gap:var(--spacing-sm);text-align:center}.install-banner span{margin-right:0}}@media (orientation:landscape) and (max-height:600px){.install-banner,.update-banner{font-size:var(--font-size-xs);padding:var(--spacing-xs) var(--spacing-sm)}}.touch-feedback{-webkit-tap-highlight-color:transparent;overflow:hidden;position:relative}.touch-feedback:after{background:#ffffff4d;border-radius:50%;content:"";height:0;left:50%;pointer-events:none;position:absolute;top:50%;transform:translate(-50%,-50%);transition:width .2s ease,height .2s ease;width:0;z-index:0}.touch-feedback:active:after{height:100px;width:100px}.touch-feedback>*{position:relative;z-index:1}.app-navigation{-webkit-touch-callout:none}.App-header,.app-navigation,.install-banner,.pwa-badge,.update-banner{-webkit-user-select:none;user-select:none}.selectable,[contenteditable],input,textarea{-webkit-user-select:text!important;user-select:text!important}.button:focus-visible,[role=button]:focus-visible,button:focus-visible{outline:2px solid #4a90e2;outline-offset:2px}.button:focus:not(:focus-visible),[role=button]:focus:not(:focus-visible),button:focus:not(:focus-visible){outline:none}@keyframes slideInFromBottom{0%{opacity:0;transform:translateY(100%)}to{opacity:1;transform:translateY(0)}}@keyframes slideInFromTop{0%{opacity:0;transform:translateY(-100%)}to{opacity:1;transform:translateY(0)}}.install-banner{animation:slideInFromBottom .3s ease-out}.update-banner{animation:slideInFromTop .3s ease-out}@media (max-width:480px){.App{font-size:14px}.touch-feedback:after{max-height:80px;max-width:80px}}@supports (padding:max(0px)){.App{padding-left:max(12px,env(safe-area-inset-left));padding-right:max(12px,env(safe-area-inset-right))}.App-header{padding-bottom:max(var(--spacing-xl),calc(var(--spacing-xl) + env(safe-area-inset-bottom)));padding-top:max(var(--spacing-xl),calc(var(--spacing-xl) + env(safe-area-inset-top)))}}@media (prefers-reduced-motion:reduce){.install-banner,.touch-feedback:after,.update-banner{animation:none;transition:none}}@media (prefers-contrast:high){.touch-feedback:after{background:#00000080}.button:focus-visible,button:focus-visible{outline:3px solid;outline-offset:3px}}.update-banner{align-items:center;background:#007bfff2;border-bottom:2px solid #fff3;box-shadow:0 4px 20px #0003;color:#fff;display:flex;gap:1rem;justify-content:center;left:0;padding:1rem;right:0;top:0}.install-prompt-subtle,.update-banner{-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);position:fixed;z-index:1000}.install-prompt-subtle{animation:slideInFromRight .3s ease-out;background:#fffffff2;border:1px solid #0000001a;border-radius:12px;bottom:20px;box-shadow:0 8px 32px #00000026;max-width:280px;right:20px}.install-prompt-content{align-items:center;display:flex;gap:.75rem;padding:1rem}.install-icon{flex-shrink:0;font-size:1.2rem}.install-text{color:#333;flex:1 1;font-size:.9rem;font-weight:500}.install-actions{align-items:center;display:flex;gap:.5rem}.install-btn-install{background:linear-gradient(135deg,#007bff,#0056b3);border:none;border-radius:6px;color:#fff;cursor:pointer;font-size:.8rem;font-weight:600;padding:.4rem .8rem;transition:all .2s ease}.install-btn-install:hover{box-shadow:0 4px 12px #007bff4d;transform:translateY(-1px)}.install-btn-later{background:none;border:1px solid #ddd;border-radius:6px;color:#666;cursor:pointer;font-size:.8rem;padding:.4rem .6rem;transition:all .2s ease}.install-btn-later:hover{background:#f8f9fa;border-color:#bbb}.install-btn-close{background:none;border:none;border-radius:4px;color:#999;cursor:pointer;font-size:1.2rem;line-height:1;padding:.2rem .4rem;transition:all .2s ease}.install-btn-close:hover{background:#f0f0f0;color:#666}@keyframes slideInFromRight{0%{opacity:0;transform:translateX(100%)}to{opacity:1;transform:translateX(0)}}@media (prefers-color-scheme:dark){.install-prompt-subtle{background:#1e1e1ef2;border-color:#ffffff1a}.install-text{color:#e0e0e0}.install-btn-later{border-color:#555;color:#ccc}.install-btn-later:hover{background:#333;border-color:#777}.install-btn-close{color:#aaa}.install-btn-close:hover{background:#333;color:#ddd}}@media (max-width:480px){.install-prompt-subtle{bottom:10px;left:10px;max-width:none;right:10px}.install-prompt-content{padding:.75rem}.install-text{font-size:.85rem}}.pwa-status-bar{-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);background:#6c757df2;border-top:2px solid #fff3;bottom:0;box-shadow:0 -4px 20px #0003;color:#fff;font-size:.875rem;left:0;padding:.5rem;position:fixed;right:0;text-align:center;z-index:1000}button{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);transition:all .3s cubic-bezier(.175,.885,.32,1.275)}button:hover:not(:disabled){box-shadow:0 8px 25px #0003;transform:translateY(-2px)}@media (prefers-color-scheme:dark){.App{background:linear-gradient(-45deg,#1a1a2e,#16213e,#0f3460,#533483)}.update-banner{background:#0d6efdf2}}.move-valid{background-color:#28a74533!important;border-color:#28a745!important;box-shadow:0 0 0 3px #28a7454d!important}.move-invalid{animation:shake .5s ease-in-out;background-color:#dc354533!important;border-color:#dc3545!important;box-shadow:0 0 0 3px #dc35454d!important}.feedback-pulse{animation:feedbackPulse .6s ease-out}@keyframes feedbackPulse{0%{transform:scale(1)}50%{transform:scale(1.05)}to{transform:scale(1)}}.feedback-success{animation:slideInSuccess .3s ease-out;background-color:#28a7451a;border-left:4px solid #28a745;color:#155724}.feedback-success:before{color:#28a745;content:"✓";font-weight:700;margin-right:8px}.feedback-error{animation:slideInError .3s ease-out;background-color:#dc35451a;border-left:4px solid #dc3545;color:#721c24}.feedback-error:before{color:#dc3545;content:"✗";font-weight:700;margin-right:8px}.feedback-warning{animation:slideInWarning .3s ease-out;background-color:#ffc1071a;border-left:4px solid #ffc107;color:#856404}.feedback-warning:before{color:#ffc107;content:"⚠";font-weight:700;margin-right:8px}.feedback-info{animation:slideInInfo .3s ease-out;background-color:#17a2b81a;border-left:4px solid #17a2b8;color:#0c5460}.feedback-info:before{color:#17a2b8;content:"ℹ";font-weight:700;margin-right:8px}@keyframes slideInSuccess{0%{opacity:0;transform:translateX(-100%)}to{opacity:1;transform:translateX(0)}}@keyframes slideInError{0%{opacity:0;transform:translateX(-100%)}to{opacity:1;transform:translateX(0)}}@keyframes slideInWarning{0%{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}@keyframes slideInInfo{0%{opacity:0;transform:scale(.8)}to{opacity:1;transform:scale(1)}}.feedback-game-win{animation:celebrationPulse 1s ease-in-out infinite alternate;background:linear-gradient(135deg,#28a745,#20c997);border-radius:var(--border-radius-lg);box-shadow:0 8px 32px #28a7454d;color:#fff;padding:var(--spacing-lg);text-align:center}.feedback-game-loss{background:linear-gradient(135deg,#dc3545,#c82333);box-shadow:0 8px 32px #dc35454d}.feedback-game-draw,.feedback-game-loss{animation:fadeInSlow .5s ease-out;border-radius:var(--border-radius-lg);color:#fff;padding:var(--spacing-lg);text-align:center}.feedback-game-draw{background:linear-gradient(135deg,#6c757d,#5a6268);box-shadow:0 8px 32px #6c757d4d}@keyframes celebrationPulse{0%{box-shadow:0 8px 32px #28a7454d;transform:scale(1)}to{box-shadow:0 12px 40px #28a74566;transform:scale(1.02)}}@keyframes fadeInSlow{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.feedback-connection-lost{background-color:#dc3545e6}.feedback-connection-lost,.feedback-connection-restored{animation:slideDownConnection .3s ease-out;color:#fff;left:0;padding:var(--spacing-sm);position:fixed;right:0;text-align:center;top:0;z-index:9998}.feedback-connection-restored{background-color:#28a745e6}@keyframes slideDownConnection{0%{transform:translateY(-100%)}to{transform:translateY(0)}}.touch-feedback-enhanced{overflow:hidden;position:relative}.touch-feedback-enhanced:after{background:radial-gradient(circle,#fff9 0,#0000 70%);border-radius:50%;content:"";height:0;left:50%;pointer-events:none;position:absolute;top:50%;transform:translate(-50%,-50%);transition:width .3s ease,height .3s ease;width:0}.touch-feedback-enhanced:active:after{height:200px;width:200px}.feedback-loading{opacity:.7;pointer-events:none;position:relative}.feedback-loading:before{animation:loadingShimmer 1.5s ease-in-out infinite;background:linear-gradient(90deg,#0000,#fff6 50%,#0000);bottom:0;content:"";left:0;position:absolute;right:0;top:0}@keyframes loadingShimmer{0%{transform:translateX(-100%)}to{transform:translateX(100%)}}.hover-feedback{position:relative;transition:all var(--animation-fast) ease}.hover-feedback:hover{box-shadow:0 4px 12px #00000026;transform:translateY(-2px)}.hover-feedback:active{box-shadow:0 2px 6px #0000001a;transform:translateY(0)}.focus-feedback:focus{box-shadow:0 0 0 4px #007bff40;outline:2px solid #007bff;outline:2px solid var(--color-primary,#007bff);outline-offset:2px}.disabled-feedback{cursor:not-allowed;filter:grayscale(50%);opacity:.5;pointer-events:none}@media (hover:none) and (pointer:coarse){.hover-feedback:hover{box-shadow:none;transform:none}.touch-feedback-enhanced:active{background-color:#0000000d;transform:scale(.98)}}@media (prefers-reduced-motion:reduce){.celebrationPulse,.feedback-pulse,.loadingShimmer,.shake{animation:none}.shake{border-color:#dc3545!important}.hover-feedback:hover{transform:none}}@media (prefers-contrast:high){.move-valid{background-color:#28a745!important;color:#fff!important}.move-invalid{background-color:#dc3545!important;color:#fff!important}.feedback-error,.feedback-info,.feedback-success,.feedback-warning{border-width:3px}}@media (prefers-color-scheme:dark){.feedback-success{background-color:#28a74533;color:#d4edda}.feedback-error{background-color:#dc354533;color:#f8d7da}.feedback-warning{background-color:#ffc10733;color:#fff3cd}.feedback-info{background-color:#17a2b833;color:#d1ecf1}.touch-feedback-enhanced:after{background:radial-gradient(circle,#ffffff4d 0,#0000 70%)}}.offline-indicator{backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);background:linear-gradient(135deg,#ff9800,#f57c00);box-shadow:0 2px 8px #00000026;color:#fff;font-size:var(--font-size-sm);font-weight:500;left:0;padding:var(--spacing-xs) var(--spacing-md);padding-left:calc(var(--spacing-md) + env(safe-area-inset-left));padding-right:calc(var(--spacing-md) + env(safe-area-inset-right));padding-top:calc(var(--spacing-xs) + env(safe-area-inset-top));position:fixed;right:0;text-align:center;top:0;z-index:1000}.offline-indicator__content{align-items:center;display:flex;gap:var(--spacing-xs);justify-content:center;margin:0 auto;max-width:1200px}.offline-indicator__icon{filter:drop-shadow(0 1px 2px rgba(0,0,0,.2));font-size:var(--font-size-base)}.offline-indicator__text{font-weight:500;text-shadow:0 1px 2px #0003}.offline-indicator__games{background:#fff3;border-radius:12px;font-size:var(--font-size-xs);font-weight:400;opacity:.9;padding:2px var(--spacing-xs)}@media (max-width:768px){.offline-indicator{font-size:var(--font-size-xs);padding:var(--spacing-xs) var(--spacing-sm)}.offline-indicator__content{flex-direction:column;gap:2px}.offline-indicator__icon{font-size:var(--font-size-sm)}.offline-indicator__games{font-size:10px}}@media (max-width:480px){.offline-indicator{padding:4px var(--spacing-xs)}.offline-indicator__text{font-size:11px}.offline-indicator__games{font-size:9px}}@media (orientation:landscape) and (max-height:600px){.offline-indicator{font-size:11px;padding:2px var(--spacing-sm)}.offline-indicator__content{flex-direction:row;gap:var(--spacing-xs)}.offline-indicator__icon{font-size:12px}.offline-indicator__games{font-size:9px}}.offline-indicator{animation:slideDown var(--animation-normal) ease-out}@media (prefers-reduced-motion:reduce){.offline-indicator{animation:none}}.game-board{align-items:center;display:flex;justify-content:center;max-width:100%;padding:var(--spacing-md);-webkit-user-select:none;user-select:none;width:100%}.game-board__grid{grid-gap:3px;aspect-ratio:1;background-color:#333;background-color:var(--board-border-color,#333);border-radius:12px;box-shadow:0 4px 20px #0000001a;display:grid;gap:3px;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(3,1fr);max-width:320px;padding:3px;width:100%}.game-cell{-webkit-tap-highlight-color:transparent;align-items:center;background-color:#fff;background-color:var(--cell-bg-color,#fff);border:none;border-radius:8px;cursor:pointer;display:flex;font-size:clamp(1.5rem,6vw,3rem);font-weight:700;justify-content:center;min-height:var(--touch-target-large);min-width:var(--touch-target-large);overflow:hidden;position:relative;transition:all var(--animation-normal) ease}.game-cell:hover:not(:disabled){background-color:#f0f0f0;background-color:var(--cell-hover-color,#f0f0f0);transform:scale(1.02)}.game-cell:active:not(:disabled){transform:scale(.98)}.game-cell:disabled{cursor:not-allowed}.game-cell--empty:hover:not(:disabled):before{background-color:#0000001a;background-color:var(--cell-preview-color,#0000001a);border-radius:4px;content:"";inset:0;position:absolute}.game-cell--disabled{cursor:not-allowed;opacity:.6}.game-cell__mark{color:#333;color:var(--mark-color,#333);transition:color .2s ease}.game-cell--x .game-cell__mark{color:#e74c3c;color:var(--mark-x-color,#e74c3c)}.game-cell--o .game-cell__mark{color:#3498db;color:var(--mark-o-color,#3498db)}.game-cell--winning{animation:winning-pulse 1s ease-in-out infinite alternate;background-color:#f1c40f!important;background-color:var(--winning-cell-color,#f1c40f)!important}@keyframes winning-pulse{0%{transform:scale(1)}to{transform:scale(1.05)}}.game-board--dark{--board-border-color:#555;--cell-bg-color:#2c3e50;--cell-hover-color:#34495e;--cell-preview-color:#ffffff1a;--mark-color:#ecf0f1;--mark-x-color:#e74c3c;--mark-o-color:#3498db;--winning-cell-color:#f39c12}.game-board--neon{--board-border-color:#0f8;--cell-bg-color:#0a0a0a;--cell-hover-color:#1a1a1a;--cell-preview-color:#0f83;--mark-color:#0f8;--mark-x-color:#ff0080;--mark-o-color:#0f8;--winning-cell-color:#ff0}.game-board--classic{--board-border-color:#8b4513;--cell-bg-color:wheat;--cell-hover-color:#deb887;--cell-preview-color:#8b45131a;--mark-color:#8b4513;--mark-x-color:#8b0000;--mark-o-color:navy;--winning-cell-color:gold}@media (max-width:768px){.game-board{padding:var(--spacing-sm)}.game-board__grid{gap:2px;max-width:300px;padding:2px}.game-cell{border-radius:6px;font-size:clamp(1.25rem,5vw,2.5rem)}}@media (max-width:480px){.game-board{padding:var(--spacing-xs)}.game-board__grid{max-width:280px}.game-cell{font-size:clamp(1rem,4vw,2rem)}}@media (max-width:320px){.game-board__grid{max-width:260px}}@media (orientation:landscape) and (max-height:600px){.game-board{padding:var(--spacing-xs)}.game-board__grid{max-width:250px}.game-cell{font-size:clamp(.875rem,3vw,1.5rem)}}@media (hover:none) and (pointer:coarse){.game-cell{min-height:var(--touch-target-comfortable);min-width:var(--touch-target-comfortable)}.game-cell:hover:not(:disabled){background-color:#fff;background-color:var(--cell-bg-color,#fff);transform:none}.game-cell:active:not(:disabled){background-color:#f0f0f0;background-color:var(--cell-hover-color,#f0f0f0);transform:scale(.92);transition:all var(--animation-fast) ease}.game-cell:active:not(:disabled):after{animation:ripple var(--animation-normal) ease-out;background:radial-gradient(circle,#0000001a 0,#0000 70%);content:"";inset:0;position:absolute}}@media (prefers-contrast:high){.game-board__grid{border:3px solid #333;border:3px solid var(--board-border-color,#333)}.game-cell{border:2px solid #333;border:2px solid var(--board-border-color,#333)}}@media (min-width:768px) and (max-width:1024px){.game-board__grid{gap:4px;max-width:400px;padding:4px}.game-cell{border-radius:10px;font-size:clamp(2rem,4vw,3.5rem)}}@media (min-width:1024px){.game-board__grid{gap:5px;max-width:450px;padding:5px}.game-cell{border-radius:12px;font-size:clamp(2.5rem,3vw,4rem)}}.game-mode-selector{margin:0 auto;max-width:500px;padding:var(--spacing-md);width:100%}.mode-header{align-items:center;display:flex;margin-bottom:2rem;position:relative}.mode-header h2{color:#333;color:var(--text-primary,#333);flex:1 1;font-size:1.5rem;margin:0;text-align:center}.back-button{border-radius:4px;color:#666;color:var(--text-secondary,#666);left:0;padding:.5rem;position:absolute;transition:background-color .2s ease}.back-button:hover{background-color:#f0f0f0;background-color:var(--bg-hover,#f0f0f0)}.mode-buttons{display:flex;flex-direction:column;gap:1rem}.secondary-buttons{display:flex;flex-wrap:wrap;gap:var(--spacing-md);justify-content:center;margin-top:var(--spacing-lg)}.secondary-button{background:#fff;background:var(--bg-primary,#fff);border:2px solid #e0e0e0;border:2px solid var(--border-color,#e0e0e0);border-radius:8px;color:#333;color:var(--text-primary,#333);cursor:pointer;font-size:1rem;font-size:var(--font-size-base,1rem);font-weight:500;min-width:120px;padding:var(--spacing-md) var(--spacing-lg);transition:all .2s ease}.secondary-button:hover:not(:disabled){background:#3498db;background:var(--accent-color,#3498db);border-color:#3498db;border-color:var(--accent-color,#3498db);color:#fff;transform:translateY(-2px)}.secondary-button:active{transform:translateY(0)}.secondary-button:disabled{cursor:not-allowed;opacity:.5;transform:none}.guest-info{color:#666;color:var(--text-secondary,#666);font-size:var(--font-size-sm,.875rem);margin:var(--spacing-sm) 0;text-align:center}.mode-button{-webkit-tap-highlight-color:transparent;align-items:center;background-color:#fff;background-color:var(--bg-primary,#fff);border:2px solid #ddd;border:2px solid var(--border-color,#ddd);border-radius:16px;cursor:pointer;display:flex;flex-direction:column;min-height:var(--touch-target-large);overflow:hidden;padding:var(--spacing-xl) var(--spacing-md);position:relative;text-align:center;transition:all var(--animation-normal) ease}.mode-button:hover:not(:disabled){border-color:#3498db;border-color:var(--accent-color,#3498db);box-shadow:0 4px 12px #0000001a;transform:translateY(-2px)}.mode-button:disabled{cursor:not-allowed;opacity:.6}.mode-icon{margin-bottom:.5rem}.mode-title{color:#333;color:var(--text-primary,#333);font-size:1.25rem;font-weight:700;margin-bottom:.25rem}.mode-description{color:#666;color:var(--text-secondary,#666);font-size:.9rem}.mode-button--single:hover:not(:disabled){border-color:#e74c3c;border-color:var(--single-player-color,#e74c3c)}.mode-button--multi:hover:not(:disabled){border-color:#2ecc71;border-color:var(--multiplayer-color,#2ecc71)}.difficulty-selection{text-align:center}.difficulty-selection h3{color:#333;color:var(--text-primary,#333);margin-bottom:1.5rem}.difficulty-buttons{display:flex;flex-direction:column;gap:1rem}.difficulty-button{align-items:center;background-color:#fff;background-color:var(--bg-primary,#fff);border:2px solid #ddd;border:2px solid var(--border-color,#ddd);border-radius:8px;cursor:pointer;display:flex;flex-direction:column;padding:1.5rem 1rem;transition:all .2s ease}.difficulty-button:hover:not(:disabled){box-shadow:0 2px 8px #0000001a;transform:translateY(-1px)}.difficulty-button--easy:hover:not(:disabled){border-color:#2ecc71;border-color:var(--easy-color,#2ecc71)}.difficulty-button--medium:hover:not(:disabled){border-color:#f39c12;border-color:var(--medium-color,#f39c12)}.difficulty-button--hard:hover:not(:disabled){border-color:#e74c3c;border-color:var(--hard-color,#e74c3c)}.difficulty-title{color:#333;color:var(--text-primary,#333);font-size:1.1rem;font-weight:700;margin-bottom:.25rem}.difficulty-description{color:#666;color:var(--text-secondary,#666);font-size:.85rem}.multiplayer-options{display:flex;flex-direction:column;gap:2rem}.multiplayer-section{text-align:center}.multiplayer-section h3{color:#333;color:var(--text-primary,#333);font-size:1.1rem;margin-bottom:1rem}.create-game-button{background-color:#2ecc71;background-color:var(--multiplayer-color,#2ecc71);border:2px solid #2ecc71;border:2px solid var(--multiplayer-color,#2ecc71);border-radius:8px;color:#fff;cursor:pointer;font-size:1rem;font-weight:700;padding:1rem;transition:all .2s ease;width:100%}.create-game-button:hover:not(:disabled){background-color:#27ae60;background-color:var(--multiplayer-color-dark,#27ae60);transform:translateY(-1px)}.room-code-form{flex-direction:column;gap:.5rem}.room-code-input{font-family:monospace;padding:.75rem}.room-code-input:focus{border-color:var(--accent-color,#3498db)}.room-code-input--error{border-color:#e74c3c;border-color:var(--error-color,#e74c3c)}.join-button{background-color:#3498db;background-color:var(--accent-color,#3498db);border:2px solid #3498db;border:2px solid var(--accent-color,#3498db);padding:.75rem;transition:all .2s ease}.join-button:hover:not(:disabled){background-color:#2980b9;background-color:var(--accent-color-dark,#2980b9)}.join-button:disabled{opacity:.6}.error-message{color:var(--error-color,#e74c3c);font-size:.85rem;margin-top:.5rem}.lobby-games{display:flex;flex-direction:column;gap:.5rem}.lobby-game-item{align-items:center;background-color:#fff;background-color:var(--bg-primary,#fff);border:1px solid #ddd;border:1px solid var(--border-color,#ddd);border-radius:8px;cursor:pointer;display:flex;justify-content:space-between;padding:1rem;text-align:left;transition:all .2s ease}.lobby-game-item:hover:not(:disabled){background-color:#f8f9fa;background-color:var(--bg-hover,#f8f9fa);border-color:#3498db;border-color:var(--accent-color,#3498db)}.lobby-game-info{display:flex;flex-direction:column;gap:.25rem}.lobby-game-host{color:#333;color:var(--text-primary,#333);font-weight:700}.lobby-game-time{font-size:.8rem}.lobby-game-settings,.lobby-game-time{color:#666;color:var(--text-secondary,#666)}.lobby-game-settings{background-color:#f0f0f0;background-color:var(--bg-secondary,#f0f0f0);border-radius:4px;font-size:.85rem;padding:.25rem .5rem}@media (hover:none) and (pointer:coarse){.difficulty-button:active:not(:disabled),.mode-button:active:not(:disabled){transform:scale(.95);transition:all var(--animation-fast) ease}.create-game-button:active:not(:disabled),.join-button:active:not(:disabled){transform:scale(.98)}}@media (max-width:768px){.game-mode-selector{padding:var(--spacing-sm)}.mode-header{margin-bottom:var(--spacing-lg)}.mode-header h2{font-size:var(--font-size-xl)}}@media (max-width:480px){.game-mode-selector{padding:var(--spacing-xs)}.mode-button{padding:var(--spacing-lg) var(--spacing-sm)}.mode-icon{font-size:2.5rem}.mode-title{font-size:var(--font-size-lg)}.mode-description{font-size:var(--font-size-xs)}.difficulty-button{padding:var(--spacing-md) var(--spacing-sm)}.difficulty-title{font-size:var(--font-size-base)}.difficulty-description{font-size:var(--font-size-xs)}}@media (orientation:landscape) and (max-height:600px){.game-mode-selector{padding:var(--spacing-xs)}.mode-buttons{gap:var(--spacing-sm)}.mode-button{flex-direction:row;gap:var(--spacing-md);padding:var(--spacing-md);text-align:left}.mode-icon{font-size:2rem;margin-bottom:0}.difficulty-button,.difficulty-buttons{gap:var(--spacing-sm)}.difficulty-button{flex-direction:row;padding:var(--spacing-sm) var(--spacing-md);text-align:left}}@media (min-width:768px) and (max-width:1024px){.mode-buttons{grid-gap:var(--spacing-lg);display:grid;gap:var(--spacing-lg);grid-template-columns:repeat(2,1fr)}.difficulty-buttons{grid-gap:var(--spacing-md);display:grid;gap:var(--spacing-md);grid-template-columns:repeat(3,1fr)}.multiplayer-options{grid-gap:var(--spacing-xl);display:grid;gap:var(--spacing-xl);grid-template-columns:repeat(2,1fr)}}@media (prefers-color-scheme:dark){.game-mode-selector{--text-primary:#ecf0f1;--text-secondary:#bdc3c7;--bg-primary:#2c3e50;--bg-secondary:#34495e;--bg-hover:#34495e;--border-color:#555;--accent-color:#3498db;--accent-color-dark:#2980b9;--single-player-color:#e74c3c;--multiplayer-color:#2ecc71;--multiplayer-color-dark:#27ae60;--easy-color:#2ecc71;--medium-color:#f39c12;--hard-color:#e74c3c;--error-color:#e74c3c}}.customization-panel{background-color:#fff;background-color:var(--bg-primary,#fff);border-radius:12px;box-shadow:0 4px 20px #0000001a;margin:0 auto;max-width:500px;overflow:hidden}.customization-header{align-items:center;background-color:#f8f9fa;background-color:var(--bg-secondary,#f8f9fa);border-bottom:1px solid #e0e0e0;border-bottom:1px solid var(--border-color,#e0e0e0);display:flex;justify-content:space-between;padding:1.5rem}.customization-header h2{color:#333;color:var(--text-primary,#333);font-size:1.5rem;margin:0}.close-button{align-items:center;background:none;border:none;border-radius:4px;color:#666;color:var(--text-secondary,#666);cursor:pointer;display:flex;font-size:1.5rem;height:2rem;justify-content:center;padding:.25rem;transition:background-color .2s ease;width:2rem}.close-button:hover{background-color:#e0e0e0;background-color:var(--bg-hover,#e0e0e0)}.customization-content{max-height:70vh;overflow-y:auto;padding:1.5rem}.customization-section{margin-bottom:2rem}.customization-section:last-child{margin-bottom:0}.auth-section{gap:1rem}.auth-section,.profile-info{display:flex;flex-direction:column}.profile-info{background:#f8f9fa;background:var(--bg-secondary,#f8f9fa);border-radius:8px;gap:.5rem;padding:1rem}.profile-name{color:#333;color:var(--text-primary,#333);font-weight:600}.profile-email{color:#666;color:var(--text-secondary,#666);font-size:.875rem}.guest-status{background:#fff3cd;border:1px solid #ffeaa7;border-radius:8px;padding:1rem;text-align:center}.guest-info{color:#856404;font-size:.875rem}.auth-buttons{display:flex;flex-direction:column;gap:.75rem}.auth-button{border-radius:8px;font-size:1rem;padding:.75rem 1.5rem;transition:all .2s ease}.auth-button--google{background:#4285f4;color:#fff}.auth-button--google:hover{background:#3367d6}.auth-button--apple{background:#000;color:#fff}.auth-button--apple:hover{background:#333}.auth-button--facebook{background:#1877f2;color:#fff}.auth-button--facebook:hover{background:#166fe5}.auth-button--yahoo{background:#6001d2;color:#fff}.auth-button--yahoo:hover{background:#4a0199}.auth-button--custom{background:#3498db;background:var(--accent-color,#3498db);color:#fff}.auth-button--custom:hover{background:#2980b9;background:var(--accent-color-dark,#2980b9)}.auth-button--logout{align-self:flex-start;background:#e74c3c;color:#fff}.auth-button--logout:hover{background:#c0392b}.customization-section h3{color:#333;color:var(--text-primary,#333);font-size:1.1rem;font-weight:600;margin:0 0 1rem}.theme-grid{grid-gap:1rem;display:grid;gap:1rem;grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}.theme-option{align-items:center;background-color:#fff;background-color:var(--bg-primary,#fff);border:2px solid #e0e0e0;border:2px solid var(--border-color,#e0e0e0);border-radius:8px;cursor:pointer;display:flex;gap:1rem;padding:1rem;text-align:left;transition:all .2s ease}.theme-option:hover{transform:translateY(-1px)}.theme-option--selected,.theme-option:hover{border-color:#3498db;border-color:var(--accent-color,#3498db)}.theme-option--selected{background-color:#3498db1a;background-color:var(--accent-bg,#3498db1a)}.theme-preview{border-radius:6px;box-shadow:0 2px 4px #0000001a;display:flex;flex-direction:column;height:40px;overflow:hidden;width:40px}.theme-preview__primary{flex:2 1}.theme-preview__accent,.theme-preview__secondary{flex:1 1}.theme-info{display:flex;flex-direction:column;gap:.25rem}.theme-name{color:#333;color:var(--text-primary,#333);font-weight:600}.theme-description{color:#666;color:var(--text-secondary,#666);font-size:.85rem}.setting-item{margin-bottom:1rem}.setting-item:last-child{margin-bottom:0}.setting-label{align-items:center;border-radius:8px;cursor:pointer;display:flex;justify-content:space-between;padding:.75rem;transition:background-color .2s ease}.setting-label:hover{background-color:#f0f0f0;background-color:var(--bg-hover,#f0f0f0)}.setting-text{display:flex;flex:1 1;flex-direction:column;gap:.25rem}.setting-title{color:#333;color:var(--text-primary,#333);font-weight:500}.setting-description{color:#666;color:var(--text-secondary,#666);font-size:.85rem}.toggle-switch{height:24px;position:relative;width:50px}.toggle-input{height:0;opacity:0;width:0}.toggle-slider{background-color:#ccc;background-color:var(--toggle-bg,#ccc);border-radius:24px;bottom:0;cursor:pointer;left:0;position:absolute;right:0;top:0;transition:.3s}.toggle-slider:before{background-color:#fff;border-radius:50%;bottom:3px;box-shadow:0 2px 4px #0003;content:"";height:18px;left:3px;position:absolute;transition:.3s;width:18px}.toggle-input:checked+.toggle-slider{background-color:#3498db;background-color:var(--accent-color,#3498db)}.toggle-input:checked+.toggle-slider:before{transform:translateX(26px)}.toggle-input:focus+.toggle-slider{box-shadow:0 0 0 2px #3498db4d}.customization-actions{background-color:#f8f9fa;background-color:var(--bg-secondary,#f8f9fa);border-top:1px solid #e0e0e0;border-top:1px solid var(--border-color,#e0e0e0);display:flex;gap:1rem;padding:1.5rem}.action-button{border:2px solid #0000;border-radius:8px;cursor:pointer;flex:1 1;font-size:1rem;font-weight:500;padding:.75rem 1.5rem;transition:all .2s ease}.action-button--primary{background-color:#3498db;background-color:var(--accent-color,#3498db);border-color:#3498db;border-color:var(--accent-color,#3498db);color:#fff}.action-button--primary:hover{background-color:#2980b9;background-color:var(--accent-color-dark,#2980b9);border-color:#2980b9;border-color:var(--accent-color-dark,#2980b9)}.action-button--secondary{background-color:initial;border-color:#e0e0e0;border-color:var(--border-color,#e0e0e0);color:#666;color:var(--text-secondary,#666)}.action-button--secondary:hover{background-color:#f0f0f0;background-color:var(--bg-hover,#f0f0f0);border-color:#666;border-color:var(--text-secondary,#666)}@media (hover:none) and (pointer:coarse){.theme-option{min-height:var(--touch-target-comfortable)}.theme-option:active{transform:scale(.98);transition:all var(--animation-fast) ease}.setting-label{min-height:var(--touch-target-min)}.setting-label:active{background-color:#f0f0f0;background-color:var(--bg-hover,#f0f0f0)}.action-button:active{transform:scale(.98)}.close-button{min-height:var(--touch-target-min);min-width:var(--touch-target-min)}}@media (max-width:768px){.customization-panel{border-radius:0;height:100vh;height:-webkit-fill-available;margin:0}.theme-grid{grid-template-columns:1fr}.customization-content{max-height:calc(100vh - 160px);max-height:calc(100dvh - 160px)}.customization-actions{flex-direction:column;gap:var(--spacing-sm)}}@media (max-width:480px){.customization-header{padding:var(--spacing-md)}.customization-header h2{font-size:var(--font-size-xl)}.customization-content{padding:var(--spacing-md)}.customization-section h3{font-size:var(--font-size-lg)}.setting-label{padding:var(--spacing-sm)}.setting-title{font-size:var(--font-size-sm)}.setting-description{font-size:var(--font-size-xs)}.theme-option{gap:var(--spacing-sm);padding:var(--spacing-sm)}.theme-name{font-size:var(--font-size-sm)}.theme-description{font-size:var(--font-size-xs)}.customization-actions{padding:var(--spacing-md)}}@media (orientation:landscape) and (max-height:600px){.customization-panel{display:flex;flex-direction:column;height:100vh}.customization-content,.customization-header{padding:var(--spacing-sm) var(--spacing-md)}.customization-content{flex:1 1;max-height:none;overflow-y:auto}.customization-section{margin-bottom:var(--spacing-md)}.theme-grid{grid-template-columns:repeat(auto-fit,minmax(180px,1fr))}.customization-actions{flex-direction:row;padding:var(--spacing-sm) var(--spacing-md)}}@media (min-width:768px) and (max-width:1024px){.customization-panel{margin:var(--spacing-lg) auto;max-width:600px}.theme-grid{grid-template-columns:repeat(2,1fr)}}@media (min-width:1024px){.customization-panel{max-width:700px}.theme-grid{grid-template-columns:repeat(3,1fr)}}@media (prefers-color-scheme:dark){.customization-panel{--text-primary:#ecf0f1;--text-secondary:#bdc3c7;--bg-primary:#2c3e50;--bg-secondary:#34495e;--bg-hover:#34495e;--border-color:#555;--accent-color:#3498db;--accent-color-dark:#2980b9;--accent-bg:#3498db33;--toggle-bg:#555}}.statistics-display{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;margin:0 auto;max-width:800px;padding:20px}.statistics-header{align-items:center;border-bottom:2px solid #e0e0e0;display:flex;justify-content:space-between;margin-bottom:30px;padding-bottom:15px}.statistics-header h2{color:#333;font-size:28px;font-weight:600;margin:0}.view-tabs{display:flex;gap:10px}.view-tabs button{background:#fff;border:2px solid #007bff;border-radius:25px;color:#007bff;cursor:pointer;font-weight:500;padding:10px 20px;transition:all .3s ease}.view-tabs button:hover{background:#f8f9fa}.view-tabs button.active{background:#007bff;color:#fff}.error-message{align-items:center;background:#f8d7da;border-radius:8px;color:#721c24;display:flex;justify-content:space-between;margin-bottom:20px;padding:15px}.error-message button{background:none;border:none;color:#721c24;cursor:pointer;font-size:18px;height:24px;padding:0;width:24px}.loading{color:#666;font-size:18px;padding:40px;text-align:center}.personal-statistics{display:flex;flex-direction:column;gap:30px}.stats-overview{grid-gap:20px;display:grid;gap:20px;grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}.stat-card{background:linear-gradient(135deg,#667eea,#764ba2);border-radius:15px;box-shadow:0 4px 15px #0000001a;color:#fff;padding:25px;text-align:center}.stat-card h3{font-size:16px;font-weight:500;margin:0 0 10px;opacity:.9}.stat-value{font-size:36px;font-weight:700;margin:0}.stats-breakdown{background:#fff;border-radius:15px;box-shadow:0 2px 10px #0000001a;padding:25px}.stats-breakdown h3{color:#333;font-size:20px;margin:0 0 20px}.category-stats{background:#f8f9fa;border-radius:10px;margin-bottom:20px;padding:15px}.category-stats h4{color:#495057;font-size:16px;margin:0 0 10px}.category-details{display:flex;flex-wrap:wrap;gap:20px}.category-details span{border-radius:20px;font-size:14px;font-weight:500;padding:5px 12px}.wins{background:#d4edda;color:#155724}.losses{background:#f8d7da;color:#721c24}.draws{background:#fff3cd;color:#856404}.win-rate{background:#d1ecf1;color:#0c5460}.recent-games{background:#fff;border-radius:15px;box-shadow:0 2px 10px #0000001a;padding:25px}.recent-games h3{color:#333;font-size:20px;margin:0 0 20px}.games-list{display:flex;flex-direction:column;gap:10px}.game-result{align-items:center;background:#f8f9fa;border-radius:8px;display:flex;font-size:14px;justify-content:space-between;padding:12px 15px}.game-mode{color:#495057;font-weight:500}.difficulty{color:#6c757d;font-size:12px}.result.win{color:#28a745;font-weight:600}.result.loss{color:#dc3545;font-weight:600}.result.draw{color:#ffc107;font-weight:600}.date{color:#6c757d;font-size:12px}.no-games{color:#6c757d;font-style:italic;padding:20px;text-align:center}.stats-actions{display:flex;gap:15px;justify-content:center}.export-btn,.reset-btn{border:none;border-radius:25px;cursor:pointer;font-weight:500;padding:12px 24px;transition:all .3s ease}.export-btn{background:#28a745;color:#fff}.export-btn:hover{background:#218838}.reset-btn{background:#dc3545;color:#fff}.reset-btn:hover{background:#c82333}.leaderboard{display:flex;flex-direction:column;gap:20px}.leaderboard-filters{display:flex;flex-wrap:wrap;gap:15px}.leaderboard-filters select{background:#fff;border:2px solid #e0e0e0;border-radius:8px;cursor:pointer;font-size:14px;padding:10px 15px}.leaderboard-filters select:focus{border-color:#007bff;outline:none}.leaderboard-list{background:#fff;border-radius:15px;box-shadow:0 2px 10px #0000001a;overflow:hidden}.leaderboard-entry{align-items:center;border-bottom:1px solid #e0e0e0;display:flex;padding:15px 20px;transition:background-color .2s ease}.leaderboard-entry:hover{background:#f8f9fa}.leaderboard-entry:last-child{border-bottom:none}.rank{color:#495057;font-size:18px;font-weight:700;min-width:40px}.player-info{align-items:center;display:flex;flex:1 1;gap:12px;margin-left:20px}.avatar{border-radius:50%;height:40px;object-fit:cover;width:40px}.name{color:#333;font-weight:500}.stats{display:flex;font-size:14px;gap:15px}.stats span{border-radius:12px;font-weight:500;padding:4px 8px}.stats .wins{background:#d4edda;color:#155724}.stats .total-games{background:#e2e3e5;color:#495057}.stats .win-rate{background:#d1ecf1;color:#0c5460}.achievements{background:#fff;border-radius:15px;box-shadow:0 2px 10px #0000001a;padding:25px}.achievements-grid{grid-gap:20px;display:grid;gap:20px;grid-template-columns:repeat(auto-fill,minmax(280px,1fr))}.achievement{align-items:center;border-radius:12px;display:flex;gap:15px;padding:20px;transition:all .3s ease}.achievement.unlocked{background:linear-gradient(135deg,#d4edda,#c3e6cb);border:2px solid #28a745}.achievement.locked{background:#f8f9fa;border:2px solid #e0e0e0;opacity:.7}.achievement-icon{font-size:32px;min-width:40px;text-align:center}.achievement-info h4{color:#333;font-size:16px;margin:0 0 5px}.achievement-info p{color:#666;font-size:14px;margin:0 0 10px}.unlock-date{color:#28a745;font-size:12px;font-weight:500}.progress{margin-top:10px}.progress-bar{background:#e0e0e0;border-radius:4px;height:8px;overflow:hidden;width:100%}.progress-fill{background:#007bff;height:100%;transition:width .3s ease}.progress-text{color:#666;display:block;font-size:12px;margin-top:5px}@media (hover:none) and (pointer:coarse){.view-tabs button{min-height:var(--touch-target-min);padding:var(--spacing-sm) var(--spacing-lg)}.view-tabs button:active{transform:scale(.95)}.export-btn:active,.reset-btn:active{transform:scale(.98)}.error-message button,.leaderboard-filters select{min-height:var(--touch-target-min)}.error-message button{min-width:var(--touch-target-min)}}@media (max-width:768px){.statistics-display{padding:var(--spacing-md)}.statistics-header{align-items:stretch;flex-direction:column;gap:var(--spacing-md)}.statistics-header h2{font-size:var(--font-size-2xl)}.view-tabs{flex-wrap:wrap;justify-content:center}.view-tabs button{font-size:var(--font-size-sm);padding:var(--spacing-xs) var(--spacing-md)}.stats-overview{gap:var(--spacing-md);grid-template-columns:1fr}.stat-card{padding:var(--spacing-lg)}.stat-card h3{font-size:var(--font-size-sm)}.stat-value{font-size:var(--font-size-3xl)}.category-details{flex-direction:column;gap:var(--spacing-sm)}.game-result{gap:var(--spacing-xs);padding:var(--spacing-sm)}.game-result,.leaderboard-entry{flex-direction:column;text-align:center}.leaderboard-entry{gap:var(--spacing-sm);padding:var(--spacing-sm) var(--spacing-md)}.player-info{justify-content:center;margin-left:0}.achievements-grid{grid-template-columns:1fr}.achievement{flex-direction:column;padding:var(--spacing-md);text-align:center}.leaderboard-filters,.stats-actions{flex-direction:column;gap:var(--spacing-sm)}.leaderboard-filters select{width:100%}}@media (max-width:480px){.statistics-display{padding:var(--spacing-sm)}.statistics-header h2{font-size:var(--font-size-xl)}.view-tabs button{font-size:var(--font-size-xs);padding:var(--spacing-xs) var(--spacing-sm)}.stat-card{padding:var(--spacing-md)}.stat-value{font-size:var(--font-size-2xl)}.achievements,.recent-games,.stats-breakdown{padding:var(--spacing-md)}.recent-games h3,.stats-breakdown h3{font-size:var(--font-size-lg)}.achievement-info h4,.category-stats h4{font-size:var(--font-size-sm)}.achievement-info p{font-size:var(--font-size-xs)}}@media (orientation:landscape) and (max-height:600px){.statistics-display{padding:var(--spacing-sm)}.statistics-header{margin-bottom:var(--spacing-md);padding-bottom:var(--spacing-sm)}.statistics-header h2{font-size:var(--font-size-xl)}.stats-overview{grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}.stat-card{padding:var(--spacing-sm)}.stat-value{font-size:var(--font-size-xl)}.achievements-grid{grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}}@media (min-width:768px) and (max-width:1024px){.achievements-grid,.stats-overview{grid-template-columns:repeat(2,1fr)}.leaderboard-entry{flex-direction:row;text-align:left}.player-info{justify-content:flex-start;margin-left:var(--spacing-lg)}}@media (min-width:1024px){.statistics-display{padding:var(--spacing-xl)}.stats-overview{grid-template-columns:repeat(4,1fr)}.achievements-grid{grid-template-columns:repeat(3,1fr)}}.loading-indicator{align-items:center;display:flex;flex-direction:column;gap:var(--spacing-sm);justify-content:center}.loading-indicator--overlay{-webkit-backdrop-filter:none;backdrop-filter:none;-webkit-backdrop-filter:var(--overlay-blur,none);backdrop-filter:var(--overlay-blur,none);background:#ffffffb3;background:rgba(255,255,255,var(--overlay-opacity,.7));bottom:0;left:0;position:fixed;right:0;top:0;z-index:9999}.loading-indicator--small{--indicator-size:20px;--font-size:var(--font-size-sm)}.loading-indicator--medium{--indicator-size:32px;--font-size:var(--font-size-md)}.loading-indicator--large{--indicator-size:48px;--font-size:var(--font-size-lg)}.loading-indicator--primary{--indicator-color:var(--color-primary,#007bff)}.loading-indicator--secondary{--indicator-color:var(--color-secondary,#6c757d)}.loading-indicator--accent{--indicator-color:var(--color-accent,#28a745)}.loading-indicator__message{color:var(--text-secondary);font-size:var(--font-size);margin-top:var(--spacing-xs);text-align:center}.loading-spinner{height:var(--indicator-size);position:relative;width:var(--indicator-size)}.loading-spinner__circle{animation:spin 1s linear infinite;border:3px solid #0000001a;border-radius:50%;border-top:3px solid var(--indicator-color);height:100%;width:100%}.loading-dots{align-items:center;display:flex;gap:4px}.loading-dots__dot{animation:dotPulse 1.4s ease-in-out infinite both;background-color:var(--indicator-color);border-radius:50%;height:calc(var(--indicator-size)/4);width:calc(var(--indicator-size)/4)}.loading-dots__dot:first-child{animation-delay:-.32s}.loading-dots__dot:nth-child(2){animation-delay:-.16s}.loading-dots__dot:nth-child(3){animation-delay:0s}@keyframes dotPulse{0%,80%,to{opacity:.5;transform:scale(.8)}40%{opacity:1;transform:scale(1)}}.loading-pulse{height:var(--indicator-size);position:relative;width:var(--indicator-size)}.loading-pulse__circle{animation:pulse 2s ease-in-out infinite;background-color:var(--indicator-color);border-radius:50%;height:100%;width:100%}.loading-skeleton{max-width:100%;width:200px}.loading-skeleton__line{animation:skeleton 1.5s ease-in-out infinite;background:linear-gradient(90deg,#f0f0f0 25%,#e0e0e0 50%,#f0f0f0 75%);background-size:200% 100%;border-radius:6px;height:12px;margin-bottom:8px}.loading-skeleton__line--title{height:16px;width:60%}.loading-skeleton__line--text{height:12px}.loading-skeleton__line--text:last-child{margin-bottom:0;width:80%}@keyframes skeleton{0%{background-position:-200% 0}to{background-position:200% 0}}.loading-progress{display:flex;flex-direction:column;gap:var(--spacing-xs);max-width:100%;width:200px}.loading-progress__track{background-color:#0000001a;border-radius:4px;height:8px;overflow:hidden;width:100%}.loading-progress__fill{animation:progressShimmer 2s ease-in-out infinite;background-color:var(--indicator-color);border-radius:4px;height:100%;transition:width .3s ease}.loading-progress__text{color:var(--text-secondary);font-size:var(--font-size-sm);text-align:center}@keyframes progressShimmer{0%,to{opacity:1}50%{opacity:.7}}.loading-overlay{-webkit-backdrop-filter:none;backdrop-filter:none;-webkit-backdrop-filter:var(--overlay-blur,none);backdrop-filter:var(--overlay-blur,none);background:#ffffffb3;background:rgba(255,255,255,var(--overlay-opacity,.7));bottom:0;display:flex;left:0;position:fixed;right:0;top:0;z-index:9999}.loading-button,.loading-overlay{align-items:center;justify-content:center}.loading-button{display:inline-flex;gap:var(--spacing-xs);position:relative;transition:all var(--animation-fast) ease}.loading-button--loading{cursor:not-allowed;opacity:.7}.loading-button__indicator{left:50%;position:absolute;top:50%;transform:translate(-50%,-50%)}.loading-button__text--hidden{opacity:0}@media (max-width:768px){.loading-indicator--small{--indicator-size:16px}.loading-indicator--medium{--indicator-size:24px}.loading-indicator--large{--indicator-size:36px}.loading-progress,.loading-skeleton{width:150px}}@media (prefers-reduced-motion:reduce){.loading-dots__dot,.loading-pulse__circle,.loading-spinner__circle{animation-duration:2s}.loading-skeleton__line{animation:none;background:#e0e0e0}.loading-progress__fill{animation:none}}@media (prefers-contrast:high){.loading-spinner__circle{border-color:#ccc}.loading-dots__dot,.loading-progress__fill,.loading-pulse__circle{background-color:#000}.loading-progress__track{background-color:#ccc;border:1px solid #000}}@media (prefers-color-scheme:dark){.loading-overlay{background:#000000b3;background:rgba(0,0,0,var(--overlay-opacity,.7))}.loading-spinner__circle{border-color:#fff3}.loading-skeleton__line{background:linear-gradient(90deg,#2d3748 25%,#4a5568 50%,#2d3748 75%)}.loading-progress__track{background-color:#ffffff1a}.loading-indicator__message,.loading-progress__text{color:#e2e8f0}}.sr-only{clip:rect(0,0,0,0);border:0;height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}.promotion-dialog-overlay{align-items:center;animation:fadeIn .2s ease-out;background-color:#000000bf;bottom:0;display:flex;justify-content:center;left:0;position:fixed;right:0;top:0;z-index:1000}.promotion-dialog{animation:slideUp .3s ease-out;background:#fff;background:var(--color-background,#fff);border-radius:16px;box-shadow:0 20px 60px #0000004d;max-width:500px;padding:32px;width:90%}.promotion-dialog__title{color:#1a1a1a;color:var(--color-text-primary,#1a1a1a);font-size:24px;font-weight:700;margin:0 0 8px;text-align:center}.promotion-dialog__subtitle{color:#666;color:var(--color-text-secondary,#666);font-size:14px;margin:0 0 24px;text-align:center}.promotion-dialog__pieces{grid-gap:12px;display:grid;gap:12px;grid-template-columns:repeat(4,1fr);margin-bottom:20px}.promotion-dialog__piece-button{align-items:center;background:#f5f5f5;background:var(--color-surface,#f5f5f5);border:3px solid #0000;border-radius:12px;cursor:pointer;display:flex;flex-direction:column;justify-content:center;min-height:120px;padding:20px 12px;position:relative;transition:all .2s ease}.promotion-dialog__piece-button:hover{background:#e8e8e8;background:var(--color-surface-hover,#e8e8e8);box-shadow:0 4px 12px #0000001a;transform:translateY(-2px)}.promotion-dialog__piece-button:active{transform:translateY(0)}.promotion-dialog__piece-button--selected{background:#e3f2fd;background:var(--color-primary-light,#e3f2fd);border-color:#4a90e2;border-color:var(--color-primary,#4a90e2)}.promotion-dialog__piece-button:focus{border-color:#4a90e2;border-color:var(--color-primary,#4a90e2);box-shadow:0 0 0 3px #4a90e233;outline:none}.promotion-dialog__piece-symbol{font-size:48px;line-height:1;margin-bottom:8px;-webkit-user-select:none;user-select:none}.promotion-dialog__piece-label{color:#1a1a1a;color:var(--color-text-primary,#1a1a1a);font-size:14px;font-weight:600;text-align:center}.promotion-dialog__hint{background:#f5f5f5;background:var(--color-surface,#f5f5f5);border-radius:8px;color:#999;color:var(--color-text-secondary,#999);font-size:12px;padding:12px;text-align:center}@media (prefers-color-scheme:dark){.promotion-dialog{background:#2a2a2a;background:var(--color-background-dark,#2a2a2a)}.promotion-dialog__title{color:#fff;color:var(--color-text-primary-dark,#fff)}.promotion-dialog__subtitle{color:#b0b0b0;color:var(--color-text-secondary-dark,#b0b0b0)}.promotion-dialog__piece-button{background:#3a3a3a;background:var(--color-surface-dark,#3a3a3a)}.promotion-dialog__piece-button:hover{background:#4a4a4a;background:var(--color-surface-hover-dark,#4a4a4a)}.promotion-dialog__piece-button--selected{background:#1976d2;background:var(--color-primary-dark,#1976d2)}.promotion-dialog__piece-label{color:#fff;color:var(--color-text-primary-dark,#fff)}.promotion-dialog__hint{background:#3a3a3a;background:var(--color-surface-dark,#3a3a3a);color:#b0b0b0;color:var(--color-text-secondary-dark,#b0b0b0)}}@media (max-width:600px){.promotion-dialog{padding:24px;width:95%}.promotion-dialog__title{font-size:20px}.promotion-dialog__subtitle{font-size:13px;margin-bottom:20px}.promotion-dialog__pieces{gap:10px;grid-template-columns:repeat(2,1fr)}.promotion-dialog__piece-button{min-height:100px;padding:16px 10px}.promotion-dialog__piece-symbol{font-size:40px}.promotion-dialog__piece-label{font-size:13px}.promotion-dialog__hint{font-size:11px;padding:10px}}@media (max-width:600px) and (hover:none){.promotion-dialog__piece-button{min-height:110px;min-width:44px}}@media (max-width:900px) and (orientation:landscape){.promotion-dialog{max-width:600px;padding:20px}.promotion-dialog__pieces{grid-template-columns:repeat(4,1fr)}.promotion-dialog__piece-button{min-height:90px;padding:12px 8px}.promotion-dialog__piece-symbol{font-size:36px}}@media (prefers-contrast:high){.promotion-dialog__piece-button{border-color:currentColor;border-width:2px}.promotion-dialog__piece-button--selected{border-width:4px}}@media (prefers-reduced-motion:reduce){.promotion-dialog,.promotion-dialog-overlay,.promotion-dialog__piece-button{animation:none;transition:none}.promotion-dialog__piece-button:hover{transform:none}}.chess-board-container{margin:0 auto;max-width:min(90vw,90vh,600px)}.chess-board,.chess-board-container{display:inline-block;position:relative;width:100%}.chess-board{aspect-ratio:1;border-radius:4px;box-shadow:0 4px 12px #00000026;overflow:hidden}.chess-board__grid{grid-gap:0;display:grid;gap:0;grid-template-columns:repeat(8,1fr);grid-template-rows:repeat(8,1fr);height:100%;width:100%}.chess-square{align-items:center;cursor:pointer;display:flex;justify-content:center;min-height:44px;min-width:44px;position:relative;transition:background-color .2s ease;-webkit-user-select:none;user-select:none}.chess-square--light{background-color:#f0d9b5}.chess-square--dark{background-color:#b58863}.chess-square:hover{filter:brightness(.95)}.chess-square--selected{background-color:#baca44!important;box-shadow:inset 0 0 0 2px #829769}.chess-square--legal:after{animation:legal-move-appear .2s ease-out;background-color:#0003;border-radius:50%;content:"";height:25%;pointer-events:none;position:absolute;width:25%}@keyframes legal-move-appear{0%{opacity:0;transform:scale(0)}to{opacity:1;transform:scale(1)}}.chess-square--capture:after{animation:capture-move-appear .2s ease-out;border:3px solid #0003;border-radius:50%;content:"";height:90%;pointer-events:none;position:absolute;width:90%}@keyframes capture-move-appear{0%{border-width:0;opacity:0;transform:scale(.8)}to{border-width:3px;opacity:1;transform:scale(1)}}.chess-square--last-move{background-color:#9bc70040!important;box-shadow:inset 0 0 0 1px #9bc70026}.chess-square--check{animation:check-pulse 1s ease-in-out infinite;background-color:#ff000080!important}@keyframes check-pulse{0%,to{background-color:#ff000080}50%{background-color:#ff0000b3}}.chess-square--checkmate{animation:checkmate-pulse .8s ease-in-out infinite;background-color:#c80000b3!important;box-shadow:inset 0 0 20px #f009}@keyframes checkmate-pulse{0%,to{background-color:#c80000b3;box-shadow:inset 0 0 20px #f009}50%{background-color:#ff0000e6;box-shadow:inset 0 0 30px #f00c}}.chess-square--capturing{animation:capture-flash .3s ease-out}@keyframes capture-flash{0%{background-color:inherit;box-shadow:none}30%{background-color:#ff7800b3;box-shadow:inset 0 0 20px #ff6400cc;transform:scale(1.03)}60%{background-color:#ff640080;box-shadow:inset 0 0 15px #ff640099;transform:scale(1.02)}to{background-color:inherit;box-shadow:none;transform:scale(1)}}.chess-piece{cursor:grab;font-size:clamp(2rem,8vw,4rem);line-height:1;position:relative;transition:transform .15s ease,opacity .1s ease,filter .15s ease;-webkit-user-select:none;user-select:none;z-index:10}.chess-piece:hover{filter:brightness(1.1) drop-shadow(0 2px 4px rgba(0,0,0,.3));transform:scale(1.05)}.chess-piece:active{cursor:grabbing;filter:brightness(1.15) drop-shadow(0 4px 8px rgba(0,0,0,.4));transform:scale(1.1)}.chess-piece--moving{animation:piece-move .3s cubic-bezier(.4,0,.2,1);pointer-events:none;z-index:100}@keyframes piece-move{0%{opacity:1;transform:scale(1) translateY(0)}30%{opacity:.95;transform:scale(1.15) translateY(-8px)}70%{opacity:.95;transform:scale(1.1) translateY(-4px)}to{opacity:1;transform:scale(1) translateY(0)}}.chess-piece--captured{animation:piece-capture .3s ease-out forwards;pointer-events:none;z-index:5}@keyframes piece-capture{0%{opacity:1;transform:scale(1) rotate(0deg)}30%{opacity:.7;transform:scale(.9) rotate(10deg)}60%{opacity:.3;transform:scale(.5) rotate(25deg)}to{opacity:0;transform:scale(0) rotate(45deg)}}.chess-piece--white{color:#fff;text-shadow:-1px -1px 0 #000,1px -1px 0 #000,-1px 1px 0 #000,1px 1px 0 #000,0 2px 4px #00000080}.chess-piece--black{color:#000;text-shadow:-1px -1px 0 #fff,1px -1px 0 #fff,-1px 1px 0 #fff,1px 1px 0 #fff,0 2px 4px #0000004d}.chess-coordinate{font-size:clamp(.6rem,1.5vw,.9rem);font-weight:600;pointer-events:none;position:absolute;-webkit-user-select:none;user-select:none;z-index:5}.chess-coordinate--rank{left:2px;top:2px}.chess-coordinate--file{bottom:2px;right:2px}.chess-square--light .chess-coordinate{color:#b58863}.chess-square--dark .chess-coordinate{color:#f0d9b5}.chess-square[draggable=true]{cursor:grab}.chess-square:active[draggable=true]{cursor:grabbing}.chess-square:active{filter:brightness(.9)}.chess-board *{-webkit-touch-callout:none;-webkit-user-select:none;user-select:none}.chess-square{-webkit-tap-highlight-color:transparent;touch-action:none}.chess-piece:active{opacity:.8;transform:scale(1.15)}@media (max-width:768px){.chess-board{max-width:min(95vw,95vh)}.chess-piece{font-size:clamp(1.5rem,10vw,3rem)}.chess-coordinate{font-size:clamp(.5rem,2vw,.75rem)}.chess-square{min-height:48px;min-width:48px}.chess-square:active{filter:brightness(.85);transition:filter .05s ease}.chess-square--legal:after{height:30%;width:30%}.chess-square--capture:after{border-width:4px;height:85%;width:85%}.chess-piece:active{filter:drop-shadow(0 4px 8px rgba(0,0,0,.4));transform:scale(1.2);z-index:100}@media (hover:none){.chess-square:hover{filter:none}.chess-piece:hover{transform:none}}}@media (max-width:480px){.chess-board{border-radius:0;max-width:100vw}.chess-piece{font-size:clamp(1.2rem,12vw,2.5rem)}.chess-coordinate{font-size:.5rem}}@media (max-width:768px) and (orientation:landscape){.chess-board{max-width:min(60vh,90vw)}}@media (min-width:1200px){.chess-board{max-width:700px}.chess-piece{font-size:4.5rem}.chess-coordinate{font-size:1rem}}@media (prefers-color-scheme:dark){.chess-square--light{background-color:#eeeed2}.chess-square--dark{background-color:#769656}.chess-board{box-shadow:0 4px 12px #0006}}.dark-mode .chess-square--light{background-color:#eeeed2}.dark-mode .chess-square--dark{background-color:#769656}.dark-mode .chess-board{box-shadow:0 4px 12px #0006}.chess-square:focus{outline:3px solid #4a90e2;outline-offset:-3px;z-index:20}.chess-square:focus:not(:focus-visible){outline:none}@media (prefers-contrast:high){.chess-square--light{background-color:#fff}.chess-square--dark{background-color:#000}.chess-piece--white{color:#fff;text-shadow:-2px -2px 0 #000,2px -2px 0 #000,-2px 2px 0 #000,2px 2px 0 #000}.chess-piece--black{color:#000;text-shadow:-2px -2px 0 #fff,2px -2px 0 #fff,-2px 2px 0 #fff,2px 2px 0 #fff}}@media (prefers-reduced-motion:reduce){.chess-piece,.chess-square{animation:none!important;transition:none}.chess-square--check{animation:none;background-color:#f009!important}.chess-square--checkmate{animation:none;background-color:#c80000cc!important}.chess-piece--captured,.chess-piece--moving,.chess-square--capture:after,.chess-square--capturing,.chess-square--legal:after{animation:none}.chess-board__ai-thinking{animation:fade-in .1s ease-out!important}.chess-board__game-over,.chess-board__game-over-content,.chess-board__game-over-icon,.chess-board__game-over-icon--checkmate,.chess-board__game-over-icon--draw,.chess-board__game-over-icon--stalemate{animation:none!important}.chess-board__game-over{-webkit-backdrop-filter:none;backdrop-filter:none}.chess-board__game-over-icon--checkmate{filter:none!important}}@media print{.chess-board{border:2px solid #000;box-shadow:none}.chess-square--capture:after,.chess-square--legal:after,.chess-square--selected{display:none}}.chess-board__ai-thinking{animation:fade-in .2s ease-out,thinking-pulse 2s ease-in-out .2s infinite;background-color:#fffffff2;border-radius:12px;box-shadow:0 8px 24px #0003;left:50%;padding:1.5rem 2rem;pointer-events:none;position:absolute;top:50%;transform:translate(-50%,-50%);z-index:1000}@keyframes fade-in{0%{opacity:0;transform:translate(-50%,-50%) scale(.9)}to{opacity:1;transform:translate(-50%,-50%) scale(1)}}@keyframes thinking-pulse{0%,to{box-shadow:0 8px 24px #0003}50%{box-shadow:0 8px 32px #4a90e24d}}@media (prefers-color-scheme:dark){.chess-board__ai-thinking{background-color:#1e1e1ef2;color:#e2e8f0}}.dark-mode .chess-board__ai-thinking{background-color:#1e1e1ef2;color:#e2e8f0}.chess-board__game-over{align-items:center;animation:overlay-fade-in .4s ease-out;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background-color:#000c;bottom:0;display:flex;justify-content:center;left:0;position:absolute;right:0;top:0;z-index:999}@keyframes overlay-fade-in{0%{-webkit-backdrop-filter:blur(0);backdrop-filter:blur(0);opacity:0}to{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);opacity:1}}.chess-board__game-over-content{animation:content-slide-up .5s ease-out .2s both;color:#fff;text-align:center}@keyframes content-slide-up{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.chess-board__game-over-icon{animation:icon-bounce .6s ease-out .4s both;font-size:clamp(3rem,12vw,6rem);margin-bottom:1rem}.chess-board__game-over-icon--checkmate{animation:icon-checkmate .8s ease-out .4s both}.chess-board__game-over-icon--stalemate{animation:icon-stalemate .7s ease-out .4s both}.chess-board__game-over-icon--draw{animation:icon-draw .6s ease-out .4s both}@keyframes icon-bounce{0%{transform:scale(0) rotate(-180deg)}50%{transform:scale(1.2) rotate(10deg)}to{transform:scale(1) rotate(0deg)}}@keyframes icon-checkmate{0%{filter:drop-shadow(0 0 0 rgba(255,0,0,0));transform:scale(0) rotate(-180deg)}40%{filter:drop-shadow(0 0 20px rgba(255,0,0,.8));transform:scale(1.3) rotate(15deg)}60%{filter:drop-shadow(0 0 15px rgba(255,0,0,.6));transform:scale(.9) rotate(-5deg)}to{filter:drop-shadow(0 0 10px rgba(255,0,0,.4));transform:scale(1) rotate(0deg)}}@keyframes icon-stalemate{0%{opacity:0;transform:scale(0) rotate(0deg)}50%{opacity:1;transform:scale(1.15) rotate(5deg)}75%{transform:scale(.95) rotate(-3deg)}to{opacity:1;transform:scale(1) rotate(0deg)}}@keyframes icon-draw{0%{opacity:0;transform:scale(0)}60%{opacity:1;transform:scale(1.2)}80%{transform:scale(.9)}to{opacity:1;transform:scale(1)}}.chess-board__game-over-title{font-size:clamp(1.5rem,5vw,2.5rem);font-weight:700;margin-bottom:.5rem;text-shadow:0 2px 8px #00000080}.chess-board__game-over-message{font-size:clamp(1rem,3vw,1.5rem);opacity:.9;text-shadow:0 1px 4px #00000080}@media (max-width:768px){.chess-board__ai-thinking{border-radius:8px;padding:1rem 1.5rem}.chess-board__game-over-icon{font-size:clamp(2.5rem,15vw,5rem)}.chess-board__game-over-title{font-size:clamp(1.25rem,6vw,2rem)}.chess-board__game-over-message{font-size:clamp(.875rem,4vw,1.25rem)}}.move-history{background-color:#f8f9fa;background-color:var(--bg-secondary,#f8f9fa);border-radius:8px;box-shadow:0 2px 4px #0000001a;display:flex;flex-direction:column;height:100%;overflow:hidden}.move-history-header{align-items:center;background-color:#fff;background-color:var(--bg-primary,#fff);border-bottom:1px solid #dee2e6;border-bottom:1px solid var(--border-color,#dee2e6);display:flex;justify-content:space-between;padding:12px 16px}.move-history-header h3{color:#212529;color:var(--text-primary,#212529);font-size:14px;font-weight:700;letter-spacing:.5px;margin:0;text-transform:uppercase}.move-history-actions{display:flex;gap:8px}.btn-icon{background:none;border:none;border-radius:4px;cursor:pointer;font-size:18px;padding:4px 8px;transition:background-color .2s}.btn-icon:hover{background-color:#e9ecef;background-color:var(--hover-bg,#e9ecef)}.btn-icon:active{background-color:#dee2e6;background-color:var(--active-bg,#dee2e6)}.move-history-content{flex:1 1;max-height:500px;min-height:200px;overflow-x:hidden;overflow-y:auto;padding:8px}.move-history-content::-webkit-scrollbar{width:8px}.move-history-content::-webkit-scrollbar-track{background:#f1f3f5;background:var(--scrollbar-track,#f1f3f5);border-radius:4px}.move-history-content::-webkit-scrollbar-thumb{background:#adb5bd;background:var(--scrollbar-thumb,#adb5bd);border-radius:4px}.move-history-content::-webkit-scrollbar-thumb:hover{background:#868e96;background:var(--scrollbar-thumb-hover,#868e96)}.move-history-headers{grid-gap:8px;background-color:#fff;background-color:var(--bg-primary,#fff);border-bottom:2px solid #dee2e6;border-bottom:2px solid var(--border-color,#dee2e6);color:#6c757d;color:var(--text-secondary,#6c757d);display:grid;font-size:11px;font-weight:600;gap:8px;grid-template-columns:40px 1fr 1fr;padding:8px;position:-webkit-sticky;position:sticky;top:0;z-index:1}.header-number{text-align:right}.header-black,.header-white{text-align:center}.move-history-empty{align-items:center;color:#6c757d;color:var(--text-secondary,#6c757d);display:flex;font-style:italic;height:100%;justify-content:center}.move-history-list{display:flex;flex-direction:column;gap:4px}.move-pair{grid-gap:8px;align-items:center;border-radius:4px;display:grid;gap:8px;grid-template-columns:40px 1fr 1fr;padding:4px 8px;transition:background-color .2s}.move-pair:hover{background-color:#f1f3f5;background-color:var(--hover-bg-light,#f1f3f5)}.move-number{color:#6c757d;color:var(--text-secondary,#6c757d);font-size:12px;font-weight:600;text-align:right}.move-button{background:none;border:none;border-radius:4px;color:#212529;color:var(--text-primary,#212529);cursor:pointer;font-family:Courier New,monospace;font-size:12px;font-weight:500;overflow:hidden;padding:6px 12px;text-align:left;text-overflow:ellipsis;transition:all .2s;white-space:nowrap}.move-button:hover{background-color:#e7f5ff;background-color:var(--move-hover,#e7f5ff);color:#1971c2;color:var(--primary-color,#1971c2)}.move-button:active{background-color:#d0ebff;background-color:var(--move-active,#d0ebff)}.move-button.active{background-color:#1971c2;background-color:var(--primary-color,#1971c2);color:#fff;font-weight:600}.move-button.active:hover{background-color:#1864ab;background-color:var(--primary-dark,#1864ab)}.move-history-footer{background-color:#fff;background-color:var(--bg-primary,#fff);border-top:1px solid #dee2e6;border-top:1px solid var(--border-color,#dee2e6);padding:8px 16px;text-align:center}.move-count{color:#6c757d;color:var(--text-secondary,#6c757d);font-size:11px}@media (prefers-color-scheme:dark){.move-history{background-color:#2c2c2c;background-color:var(--bg-secondary-dark,#2c2c2c)}.move-history-footer,.move-history-header{background-color:#1a1a1a;background-color:var(--bg-primary-dark,#1a1a1a);border-color:#404040;border-color:var(--border-color-dark,#404040)}.move-history-header h3{color:#e9ecef;color:var(--text-primary-dark,#e9ecef)}.btn-icon:hover{background-color:#404040;background-color:var(--hover-bg-dark,#404040)}.btn-icon:active{background-color:#4a4a4a;background-color:var(--active-bg-dark,#4a4a4a)}.move-history-content::-webkit-scrollbar-track{background:#2c2c2c;background:var(--scrollbar-track-dark,#2c2c2c)}.move-history-content::-webkit-scrollbar-thumb{background:#5a5a5a;background:var(--scrollbar-thumb-dark,#5a5a5a)}.move-history-content::-webkit-scrollbar-thumb:hover{background:#6a6a6a;background:var(--scrollbar-thumb-hover-dark,#6a6a6a)}.move-history-headers{background-color:#1a1a1a;background-color:var(--bg-primary-dark,#1a1a1a);border-color:#404040;border-color:var(--border-color-dark,#404040)}.move-history-empty,.move-history-headers{color:#adb5bd;color:var(--text-secondary-dark,#adb5bd)}.move-pair:hover{background-color:#333;background-color:var(--hover-bg-light-dark,#333)}.move-number{color:#adb5bd;color:var(--text-secondary-dark,#adb5bd)}.move-button{color:#e9ecef;color:var(--text-primary-dark,#e9ecef)}.move-button:hover{background-color:#1a4d7a;background-color:var(--move-hover-dark,#1a4d7a);color:#74c0fc;color:var(--primary-light,#74c0fc)}.move-button:active{background-color:#1e5a8f;background-color:var(--move-active-dark,#1e5a8f)}.move-count{color:#adb5bd;color:var(--text-secondary-dark,#adb5bd)}}@media (max-width:768px){.move-history-header h3{font-size:12px}.btn-icon{font-size:16px;padding:4px 6px}.move-history-content{max-height:300px}.move-pair{gap:6px;grid-template-columns:35px 1fr 1fr;padding:4px 6px}.move-button,.move-number{font-size:11px}.move-button{padding:5px 10px}.move-count{font-size:10px}}@media (max-width:480px){.move-history-header{padding:10px 12px}.move-history-content{max-height:250px;padding:6px}.move-pair{gap:4px;grid-template-columns:30px 1fr 1fr;padding:3px 4px}.move-button,.move-number{font-size:10px}.move-button{padding:4px 8px}}@media (prefers-contrast:high){.move-history{border:2px solid}.move-button{border:1px solid #0000}.move-button:focus{outline:2px solid currentColor;outline-offset:2px}.move-button.active{border-color:currentColor}}@media print{.move-history-actions{display:none}.move-history-content{max-height:none;overflow:visible}.move-button{cursor:default}.move-button:hover{background:none}}.captured-pieces{background:#fff;background:var(--surface-color,#fff);border-radius:8px;box-shadow:0 2px 8px #0000001a;display:flex;flex-direction:column;gap:1rem;min-width:200px;padding:1rem}.captured-pieces__player{display:flex;flex-direction:column;gap:.5rem}.captured-pieces__label{align-items:center;color:#1a1a1a;color:var(--text-primary,#1a1a1a);display:flex;font-size:.875rem;font-weight:600;gap:.5rem}.captured-pieces__advantage{align-items:center;background:#4caf50;background:var(--success-color,#4caf50);border-radius:12px;color:#fff;display:inline-flex;font-size:.75rem;font-weight:700;justify-content:center;min-width:2rem;padding:.125rem .5rem}.captured-pieces__pieces{align-items:center;display:flex;flex-wrap:wrap;gap:.25rem;min-height:2rem}.captured-pieces__piece{cursor:default;font-size:1.5rem;line-height:1;transition:transform .2s ease;-webkit-user-select:none;user-select:none}.captured-pieces__piece:hover{transform:scale(1.1)}.captured-pieces__piece--white{color:#f0f0f0;color:var(--piece-white-color,#f0f0f0);text-shadow:-1px -1px 0 #000,1px -1px 0 #000,-1px 1px 0 #000,1px 1px 0 #000}.captured-pieces__piece--black{color:#2c2c2c;color:var(--piece-black-color,#2c2c2c);text-shadow:-1px -1px 0 #fff,1px -1px 0 #fff,-1px 1px 0 #fff,1px 1px 0 #fff}.captured-pieces__empty{color:#666;color:var(--text-secondary,#666);font-size:.875rem;font-style:italic}@media (prefers-color-scheme:dark){.captured-pieces{background:#2c2c2c;background:var(--surface-color-dark,#2c2c2c);box-shadow:0 2px 8px #0000004d}.captured-pieces__label{color:#e0e0e0;color:var(--text-primary-dark,#e0e0e0)}.captured-pieces__empty{color:#999;color:var(--text-secondary-dark,#999)}.captured-pieces__piece--white{color:#fff;color:var(--piece-white-color-dark,#fff);text-shadow:-1px -1px 0 #000,1px -1px 0 #000,-1px 1px 0 #000,1px 1px 0 #000}.captured-pieces__piece--black{color:#1a1a1a;color:var(--piece-black-color-dark,#1a1a1a);text-shadow:-1px -1px 0 #ccc,1px -1px 0 #ccc,-1px 1px 0 #ccc,1px 1px 0 #ccc}}@media (max-width:768px){.captured-pieces{margin-bottom:1rem;margin-top:1rem;min-width:0;min-width:auto;padding:.75rem;width:100%}.captured-pieces__piece{font-size:1.25rem}.captured-pieces__label{font-size:.8125rem}}@media (max-width:480px){.captured-pieces{gap:.75rem;padding:.5rem}.captured-pieces__piece{font-size:1.125rem}.captured-pieces__advantage{font-size:.6875rem;padding:.0625rem .375rem}}@keyframes capturedPieceAppear{0%{opacity:0;transform:scale(.5) translateY(-10px)}to{opacity:1;transform:scale(1) translateY(0)}}.captured-pieces__piece{animation:capturedPieceAppear .3s ease-out}@media (prefers-contrast:high){.captured-pieces{border:2px solid #000;border:2px solid var(--border-color,#000)}.captured-pieces__advantage{border:1px solid #000;border:1px solid var(--border-color,#000)}.captured-pieces__piece--white{color:#fff;text-shadow:-2px -2px 0 #000,2px -2px 0 #000,-2px 2px 0 #000,2px 2px 0 #000}.captured-pieces__piece--black{color:#000;text-shadow:-2px -2px 0 #fff,2px -2px 0 #fff,-2px 2px 0 #fff,2px 2px 0 #fff}}@media print{.captured-pieces{border:1px solid #000;box-shadow:none}.captured-pieces__piece{animation:none}}.chess-mode-selector{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,sans-serif;margin:0 auto;max-width:800px;padding:20px}.mode-header{margin-bottom:30px;text-align:center}.mode-header h2{color:#2c3e50;font-size:2rem;margin:0 0 10px}.mode-subtitle{color:#7f8c8d;font-size:1rem;margin:0}.back-button{background:none;border:none;color:#3498db;cursor:pointer;font-size:1rem;margin-bottom:20px;padding:8px 16px;transition:color .2s}.back-button:hover{color:#2980b9}.mode-options{grid-gap:20px;display:grid;gap:20px;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));margin-bottom:30px}.mode-card{background:#fff;border:2px solid #ecf0f1;border-radius:12px;box-shadow:0 2px 8px #0000001a;cursor:pointer;padding:30px 20px;text-align:center;transition:all .3s ease}.mode-card:hover:not(:disabled){border-color:#3498db;box-shadow:0 4px 16px #00000026;transform:translateY(-4px)}.mode-card:disabled{cursor:not-allowed;opacity:.5}.mode-card--single{border-color:#9b59b6}.mode-card--single:hover:not(:disabled){border-color:#8e44ad}.mode-card--realtime{border-color:#e74c3c}.mode-card--realtime:hover:not(:disabled){border-color:#c0392b}.mode-card--turnbased{border-color:#3498db}.mode-card--turnbased:hover:not(:disabled){border-color:#2980b9}.mode-icon{font-size:3rem;margin-bottom:15px}.mode-card h3{color:#2c3e50;font-size:1.3rem;margin:0 0 10px}.mode-card p{color:#7f8c8d;font-size:.95rem;line-height:1.5;margin:0}.difficulty-options{grid-gap:20px;display:grid;gap:20px;grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}.difficulty-card{background:#fff;border:2px solid #ecf0f1;border-radius:12px;box-shadow:0 2px 8px #0000001a;cursor:pointer;padding:25px 20px;text-align:center;transition:all .3s ease}.difficulty-card:hover:not(:disabled){box-shadow:0 4px 16px #00000026;transform:translateY(-4px)}.difficulty-card:disabled{cursor:not-allowed;opacity:.5}.difficulty-card--beginner{border-color:#2ecc71}.difficulty-card--beginner:hover:not(:disabled){border-color:#27ae60}.difficulty-card--intermediate{border-color:#f39c12}.difficulty-card--intermediate:hover:not(:disabled){border-color:#e67e22}.difficulty-card--expert{border-color:#e74c3c}.difficulty-card--expert:hover:not(:disabled){border-color:#c0392b}.difficulty-icon{font-size:2.5rem;margin-bottom:10px}.difficulty-card h3{color:#2c3e50;font-size:1.3rem;margin:0 0 5px}.difficulty-rating{color:#95a5a6;font-size:.85rem;font-weight:600;margin:0 0 15px}.difficulty-features{list-style:none;margin:0;padding:0;text-align:left}.difficulty-features li{color:#7f8c8d;font-size:.9rem;padding:5px 0 5px 20px;position:relative}.difficulty-features li:before{color:#2ecc71;content:"✓";font-weight:700;left:0;position:absolute}.multiplayer-type-options{grid-gap:20px;display:grid;gap:20px;grid-template-columns:repeat(auto-fit,minmax(280px,1fr))}.type-card{background:#fff;border:2px solid #ecf0f1;border-radius:12px;box-shadow:0 2px 8px #0000001a;cursor:pointer;padding:30px 20px;text-align:center;transition:all .3s ease}.type-card:hover:not(:disabled){box-shadow:0 4px 16px #00000026;transform:translateY(-4px)}.type-card:disabled{cursor:not-allowed;opacity:.5}.type-card--realtime{border-color:#e74c3c}.type-card--realtime:hover:not(:disabled){border-color:#c0392b}.type-card--turnbased{border-color:#3498db}.type-card--turnbased:hover:not(:disabled){border-color:#2980b9}.type-icon{font-size:3rem;margin-bottom:15px}.type-card h3{color:#2c3e50;font-size:1.3rem;margin:0 0 10px}.type-card>p{color:#7f8c8d;font-size:.95rem;margin:0 0 15px}.type-features{list-style:none;margin:0;padding:0;text-align:left}.type-features li{color:#7f8c8d;font-size:.9rem;padding:5px 0 5px 20px;position:relative}.type-features li:before{color:#3498db;content:"•";font-weight:700;left:0;position:absolute}.time-control-options{grid-gap:15px;display:grid;gap:15px;grid-template-columns:repeat(auto-fit,minmax(180px,1fr))}.time-control-card{background:#fff;border:2px solid #ecf0f1;border-radius:12px;box-shadow:0 2px 8px #0000001a;cursor:pointer;padding:25px 15px;text-align:center;transition:all .3s ease}.time-control-card:hover:not(:disabled){box-shadow:0 4px 16px #00000026;transform:translateY(-4px)}.time-control-card:disabled{cursor:not-allowed;opacity:.5}.time-control-card--blitz{border-color:#e74c3c}.time-control-card--blitz:hover:not(:disabled){border-color:#c0392b}.time-control-card--rapid{border-color:#f39c12}.time-control-card--rapid:hover:not(:disabled){border-color:#e67e22}.time-control-card--unlimited{border-color:#95a5a6}.time-control-card--unlimited:hover:not(:disabled){border-color:#7f8c8d}.time-control-card h3{color:#2c3e50;font-size:1.2rem;margin:0 0 8px}.time-details{color:#7f8c8d;font-size:.9rem;font-weight:600;margin:0 0 8px}.time-description{color:#95a5a6;font-size:.85rem;margin:0}.game-settings-content{margin:0 auto;max-width:600px}.settings-section{background:#fff;border-radius:12px;box-shadow:0 2px 8px #0000001a;margin-bottom:20px;padding:25px}.settings-section h3{color:#2c3e50;font-size:1.2rem;margin:0 0 20px}.privacy-toggle{display:flex;flex-direction:column;gap:15px}.privacy-option{align-items:center;background:#fff;border:2px solid #ecf0f1;border-radius:10px;cursor:pointer;display:flex;gap:15px;padding:20px;text-align:left;transition:all .3s ease}.privacy-option:hover{border-color:#3498db;box-shadow:0 2px 8px #3498db33}.privacy-option.active{background:#ebf5fb;border-color:#3498db}.privacy-icon{flex-shrink:0;font-size:2rem}.privacy-info h4{color:#2c3e50;font-size:1.1rem;margin:0 0 5px}.privacy-info p{color:#7f8c8d;font-size:.9rem;margin:0}.settings-summary{background:#f8f9fa;border-radius:12px;margin-bottom:20px;padding:25px}.settings-summary h3{color:#2c3e50;font-size:1.2rem;margin:0 0 15px}.summary-details{display:flex;flex-direction:column;gap:12px}.summary-item{align-items:center;border-bottom:1px solid #e0e0e0;display:flex;justify-content:space-between;padding:10px 0}.summary-item:last-child{border-bottom:none}.summary-label{color:#7f8c8d;font-size:.95rem;font-weight:500}.summary-value{color:#2c3e50;font-size:.95rem;font-weight:600}.start-game-button{background:linear-gradient(135deg,#667eea,#764ba2);border:none;border-radius:10px;box-shadow:0 4px 12px #667eea66;color:#fff;cursor:pointer;font-size:1.1rem;font-weight:600;padding:18px 30px;transition:all .3s ease;width:100%}.start-game-button:hover:not(:disabled){box-shadow:0 6px 16px #667eea80;transform:translateY(-2px)}.start-game-button:disabled{cursor:not-allowed;opacity:.5}.join-private-section{background:#f8f9fa;border-radius:12px;margin-top:30px;padding:25px;text-align:center}.join-private-section h3{color:#2c3e50;font-size:1.2rem;margin:0 0 20px}.room-code-form{display:flex;gap:10px;margin:0 auto;max-width:400px}.room-code-input{border:2px solid #ecf0f1;flex:1 1;font-size:1rem;font-weight:600;letter-spacing:2px;padding:12px 16px;transition:border-color .3s}.room-code-input:focus{border-color:#3498db}.room-code-input.error{border-color:#e74c3c}.join-button{background:#3498db;border:none;border-radius:8px;color:#fff;cursor:pointer;font-size:1rem;font-weight:600;padding:12px 24px;transition:all .3s ease}.join-button:hover:not(:disabled){background:#2980b9}.join-button:disabled{cursor:not-allowed;opacity:.5}.error-message{color:#e74c3c;font-size:.9rem;margin-top:10px}@media (prefers-color-scheme:dark){.chess-mode-selector,.difficulty-card h3,.mode-card h3,.mode-header h2,.privacy-info h4,.settings-section h3,.settings-summary h3,.summary-value,.time-control-card h3,.type-card h3{color:#ecf0f1}.difficulty-card,.mode-card,.privacy-option,.settings-section,.time-control-card,.type-card{background:#34495e;border-color:#2c3e50}.join-private-section,.privacy-option.active,.settings-summary{background:#2c3e50}.room-code-input{background:#34495e;border-color:#2c3e50;color:#ecf0f1}.summary-item{border-bottom-color:#2c3e50}}@media (max-width:768px){.chess-mode-selector{padding:15px}.mode-header h2{font-size:1.5rem}.difficulty-options,.mode-options,.multiplayer-type-options{grid-template-columns:1fr}.time-control-options{grid-template-columns:repeat(2,1fr)}.room-code-form{flex-direction:column}.join-button{width:100%}}@media (max-width:480px){.mode-icon,.type-icon{font-size:2.5rem}.difficulty-icon{font-size:2rem}.difficulty-card,.mode-card,.type-card{padding:20px 15px}.time-control-options{grid-template-columns:1fr}}.chess-coach{background-color:#f8f9fa;background-color:var(--bg-secondary,#f8f9fa);border-radius:8px;box-shadow:0 2px 4px #0000001a;display:flex;flex-direction:column;height:100%;overflow:hidden;transition:all .3s ease}.chess-coach.collapsed{height:auto}.chess-coach-header{align-items:center;background-color:#fff;background-color:var(--bg-primary,#fff);border-bottom:1px solid #dee2e6;border-bottom:1px solid var(--border-color,#dee2e6);cursor:pointer;display:flex;justify-content:space-between;padding:12px 16px;-webkit-user-select:none;user-select:none}.chess-coach-header:hover{background-color:#f8f9fa;background-color:var(--hover-bg,#f8f9fa)}.chess-coach-header h3{color:#212529;color:var(--text-primary,#212529);font-size:14px;font-weight:600;margin:0}.chess-coach-header .header-actions{align-items:center;display:flex;gap:8px}.chess-coach-header .expand-icon{color:#6c757d;color:var(--text-secondary,#6c757d);font-size:12px;transition:transform .3s ease}.btn-clear{background:none;border:none;border-radius:4px;cursor:pointer;font-size:18px;padding:4px 8px;transition:background-color .2s}.btn-clear:hover{background-color:#e9ecef;background-color:var(--hover-bg,#e9ecef)}.chess-coach-setup{color:#6c757d;color:var(--text-secondary,#6c757d);padding:24px;text-align:center}.chess-coach-setup p{margin:8px 0}.setup-hint{font-size:12px;font-style:italic}.chess-coach-messages{display:flex;flex:1 1;flex-direction:column;gap:12px;max-height:500px;min-height:300px;overflow-y:auto;padding:16px}.chess-coach-messages::-webkit-scrollbar{width:8px}.chess-coach-messages::-webkit-scrollbar-track{background:#f1f3f5;background:var(--scrollbar-track,#f1f3f5);border-radius:4px}.chess-coach-messages::-webkit-scrollbar-thumb{background:#adb5bd;background:var(--scrollbar-thumb,#adb5bd);border-radius:4px}.chess-coach-empty{align-items:center;color:#6c757d;color:var(--text-secondary,#6c757d);display:flex;flex-direction:column;height:100%;justify-content:center;padding:24px;text-align:center}.chess-coach-empty p{margin:8px 0}.quick-questions{display:flex;flex-direction:column;gap:8px;margin-top:16px;max-width:300px;width:100%}.quick-questions p{font-weight:600;margin-bottom:8px}.quick-questions button{background:#4caf50;background:var(--primary-color,#4caf50);border:none;border-radius:4px;color:#fff;cursor:pointer;font-size:12px;padding:8px 12px;transition:background .2s}.quick-questions button:hover{background:#45a049;background:var(--primary-hover,#45a049)}.message{animation:slideIn .3s ease-out;display:flex;flex-direction:column;max-width:85%}.message.user{align-self:flex-end}.message.assistant{align-self:flex-start}.message-content{word-wrap:break-word;border-radius:12px;font-size:13px;padding:10px 14px}.message.user .message-content{background-color:#4caf50;background-color:var(--primary-color,#4caf50);border-bottom-right-radius:4px;color:#fff}.message.assistant .message-content{background-color:#fff;background-color:var(--bg-primary,#fff);border:1px solid #dee2e6;border:1px solid var(--border-color,#dee2e6);border-bottom-left-radius:4px;color:#212529;color:var(--text-primary,#212529)}.message-content p{font-size:13px;line-height:1.4;margin:4px 0}.message-content strong{font-size:13px;font-weight:700}.message-meta{font-size:11px;margin-top:8px!important}.message-time{color:#6c757d;color:var(--text-secondary,#6c757d);font-size:10px;margin-top:4px;padding:0 4px}.message.user .message-time{text-align:right}.message.loading .message-content{padding:16px 20px}.typing-indicator{align-items:center;display:flex;gap:4px}.typing-indicator span{animation:typing 1.4s infinite;background-color:#6c757d;background-color:var(--text-secondary,#6c757d);border-radius:50%;height:8px;width:8px}.typing-indicator span:nth-child(2){animation-delay:.2s}.typing-indicator span:nth-child(3){animation-delay:.4s}@keyframes typing{0%,60%,to{opacity:.7;transform:translateY(0)}30%{opacity:1;transform:translateY(-10px)}}.chess-coach-input{align-items:center;background-color:#fff;background-color:var(--bg-primary,#fff);border-top:1px solid #dee2e6;border-top:1px solid var(--border-color,#dee2e6);display:flex;gap:8px;padding:12px 16px}.chess-coach-input input{border:1px solid #dee2e6;border:1px solid var(--border-color,#dee2e6);border-radius:20px;flex:1 1;font-size:13px;min-width:0;outline:none;padding:10px 12px;transition:border-color .2s}.chess-coach-input input:focus{border-color:#4caf50;border-color:var(--primary-color,#4caf50)}.chess-coach-input input:disabled{background-color:#f5f5f5;background-color:var(--bg-disabled,#f5f5f5);cursor:not-allowed}.chess-coach-input button{background-color:#4caf50;background-color:var(--primary-color,#4caf50);border:none;border-radius:20px;color:#fff;cursor:pointer;flex-shrink:0;font-size:16px;min-width:44px;padding:10px 16px;transition:background-color .2s}.chess-coach-input button:hover:not(:disabled){background-color:#45a049;background-color:var(--primary-hover,#45a049)}.chess-coach-input button:disabled{background-color:#ccc;background-color:var(--bg-disabled,#ccc);cursor:not-allowed;opacity:.6}@media (prefers-color-scheme:dark){.chess-coach{background-color:#2c2c2c;background-color:var(--bg-secondary-dark,#2c2c2c)}.chess-coach-header,.chess-coach-input{background-color:#1a1a1a;background-color:var(--bg-primary-dark,#1a1a1a);border-color:#404040;border-color:var(--border-color-dark,#404040)}.chess-coach-header h3{color:#e9ecef;color:var(--text-primary-dark,#e9ecef)}.btn-clear:hover{background-color:#404040;background-color:var(--hover-bg-dark,#404040)}.chess-coach-empty,.chess-coach-setup{color:#adb5bd;color:var(--text-secondary-dark,#adb5bd)}.message.assistant .message-content{background-color:#1a1a1a;background-color:var(--bg-primary-dark,#1a1a1a);border-color:#404040;border-color:var(--border-color-dark,#404040);color:#e9ecef;color:var(--text-primary-dark,#e9ecef)}.message-time{color:#adb5bd;color:var(--text-secondary-dark,#adb5bd)}.chess-coach-input input{background-color:#1a1a1a;background-color:var(--bg-primary-dark,#1a1a1a);border-color:#404040;border-color:var(--border-color-dark,#404040);color:#e9ecef;color:var(--text-primary-dark,#e9ecef)}.chess-coach-input input:disabled{background-color:#2a2a2a;background-color:var(--bg-disabled-dark,#2a2a2a)}}@media (max-width:768px){.chess-coach-messages{max-height:400px}.message{max-width:90%}.message-content{font-size:12px}.chess-coach-input input{font-size:16px}}.responsive-modal-overlay{align-items:center;animation:fadeIn var(--animation-normal) ease-out;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);background:#00000080;bottom:0;display:flex;justify-content:center;left:0;padding:var(--spacing-md);position:fixed;right:0;top:0;z-index:1000}.responsive-modal{animation:slideUp var(--animation-normal) ease-out;background:#fff;border-radius:16px;box-shadow:0 20px 60px #0000004d;display:flex;flex-direction:column;max-height:95vh;overflow:hidden;position:relative;width:100%}.responsive-modal--small{max-width:400px}.responsive-modal--medium{max-width:600px}.responsive-modal--large{max-width:800px}.responsive-modal--full{max-height:95vh;max-width:95vw}.responsive-modal__header{align-items:center;border-bottom:1px solid #e0e0e0;display:flex;flex-shrink:0;justify-content:space-between;padding:var(--spacing-lg) var(--spacing-lg) var(--spacing-md)}.responsive-modal__title{color:#333;flex:1 1;font-size:var(--font-size-xl);font-weight:600;margin:0;padding-right:var(--spacing-md)}.responsive-modal__close-button{-webkit-tap-highlight-color:transparent;align-items:center;background:none;border:none;border-radius:8px;color:#666;cursor:pointer;display:flex;font-size:var(--font-size-2xl);justify-content:center;min-height:var(--touch-target-min);min-width:var(--touch-target-min);transition:all var(--animation-normal) ease}.responsive-modal__close-button:hover{background:#0000000d;color:#333}.responsive-modal__content{-webkit-overflow-scrolling:touch;flex:1 1;min-height:0;overflow-y:auto;padding:0}@media (max-width:768px){.responsive-modal-overlay{align-items:flex-end;padding:0}.responsive-modal{animation:slideUpMobile var(--animation-normal) ease-out;border-radius:16px 16px 0 0;max-height:85vh;max-width:100%;width:100%}.responsive-modal--full{border-radius:0;max-height:100vh}.responsive-modal__header{padding:var(--spacing-md) var(--spacing-md) var(--spacing-sm);padding-left:calc(var(--spacing-md) + env(safe-area-inset-left));padding-right:calc(var(--spacing-md) + env(safe-area-inset-right))}.responsive-modal__title{font-size:var(--font-size-lg)}.responsive-modal__content{padding:var(--spacing-md);padding-bottom:calc(var(--spacing-md) + env(safe-area-inset-bottom));padding-left:calc(var(--spacing-md) + env(safe-area-inset-left));padding-right:calc(var(--spacing-md) + env(safe-area-inset-right))}}@keyframes slideUpMobile{0%{opacity:0;transform:translateY(100%)}to{opacity:1;transform:translateY(0)}}@media (max-width:480px){.responsive-modal__header{padding:var(--spacing-sm) var(--spacing-sm) var(--spacing-xs)}.responsive-modal__title{font-size:var(--font-size-base)}.responsive-modal__content{padding:var(--spacing-sm)}}@media (orientation:landscape) and (max-height:600px){.responsive-modal-overlay{align-items:center;padding:var(--spacing-sm)}.responsive-modal{animation:slideUp var(--animation-normal) ease-out;border-radius:12px;max-height:95vh}.responsive-modal__header{padding:var(--spacing-sm) var(--spacing-md)}.responsive-modal__title{font-size:var(--font-size-base)}.responsive-modal__content{padding:var(--spacing-sm) var(--spacing-md)}}@media (hover:none) and (pointer:coarse){.responsive-modal__close-button{min-height:var(--touch-target-comfortable);min-width:var(--touch-target-comfortable)}.responsive-modal__close-button:active{background:#0000001a;transform:scale(.95)}}@media (prefers-contrast:high){.responsive-modal{border:3px solid #333}.responsive-modal__header{border-bottom-width:2px}.responsive-modal__close-button{border:2px solid #0000}.responsive-modal__close-button:hover{border-color:#333}}@media (prefers-reduced-motion:reduce){.responsive-modal,.responsive-modal-overlay{animation:none}}@media (prefers-color-scheme:dark){.responsive-modal{background:#2c3e50;color:#ecf0f1}.responsive-modal__header{border-bottom-color:#34495e}.responsive-modal__title{color:#ecf0f1}.responsive-modal__close-button{color:#bdc3c7}.responsive-modal__close-button:hover{background:#ffffff1a;color:#ecf0f1}}.share-modal{--whatsapp-green:#25d366;--whatsapp-dark-green:#128c7e;--whatsapp-light-green:#dcf8c6;--whatsapp-bg:#e5ddd5;--text-primary:#333;--text-secondary:#666;--text-muted:#999;--border-color:#e0e0e0;--error-color:#f44336;--success-color:#4caf50}.share-modal__content{display:flex;flex-direction:column;height:100%;min-height:0;padding:0}.share-modal__header{align-items:center;background:linear-gradient(135deg,#f8f9fa,#fff);border-bottom:1px solid var(--border-color);display:flex;gap:12px;padding:16px 24px 12px}.share-modal__icon{align-items:center;background:linear-gradient(135deg,var(--whatsapp-green) 0,var(--whatsapp-dark-green) 100%);border-radius:50%;box-shadow:0 2px 8px #25d3664d;color:#fff;display:flex;font-size:24px;height:40px;justify-content:center;width:40px}.share-modal__title{color:var(--text-primary);font-size:20px;font-weight:600;margin:0}.share-modal__preview-section{background:#f5f5f5;flex-shrink:0;padding:16px 24px}.share-modal__label{color:var(--text-primary);display:block;font-size:14px;font-weight:600;margin-bottom:8px}.share-modal__preview{background:#fff;border:1px solid var(--border-color);border-radius:12px;box-shadow:0 2px 12px #0000001a;overflow:hidden}.share-modal__preview-content{background:#f9f9f9;padding:12px;position:relative}.share-modal__message-textarea{background:#fff;border:1px solid var(--border-color);border-radius:8px;color:var(--text-primary);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;font-size:14px;line-height:1.4;max-height:100px;min-height:80px;overflow-y:auto;padding:12px;resize:none;transition:border-color .3s ease,box-shadow .3s ease;width:100%}.share-modal__message-textarea:focus{border-color:var(--whatsapp-green);box-shadow:0 0 0 3px #25d3661a;outline:none}.share-modal__message-textarea--error{background:#fff5f5;border-color:var(--error-color)}.share-modal__message-textarea--error:focus{border-color:var(--error-color);box-shadow:0 0 0 3px #f443361a}.share-modal__character-count{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#ffffffe6;border-radius:4px;bottom:8px;color:var(--text-muted);font-size:12px;padding:4px 8px;position:absolute;right:12px}.share-modal__character-count--error{background:#f443361a;color:var(--error-color)}.share-modal__customization{border-bottom:1px solid var(--border-color);flex:1 1 auto;min-height:0;overflow-y:auto;padding:24px}.share-modal__section-title{color:var(--text-primary);font-size:18px;font-weight:600;margin:0 0 20px}.share-modal__field{margin-bottom:20px}.share-modal__input{background:#fff;border:1px solid var(--border-color);border-radius:8px;color:var(--text-primary);font-size:14px;padding:12px 16px;transition:border-color .3s ease,box-shadow .3s ease;width:100%}.share-modal__input:focus{border-color:var(--whatsapp-green);box-shadow:0 0 0 3px #25d3661a;outline:none}.share-modal__tone-options{display:flex;flex-wrap:wrap;gap:8px}.share-modal__tone-button{align-items:center;background:#fff;border:2px solid var(--border-color);border-radius:20px;color:var(--text-secondary);cursor:pointer;display:flex;font-size:14px;font-weight:500;gap:6px;padding:8px 16px;transition:all .3s ease}.share-modal__tone-button:hover{border-color:var(--whatsapp-green);color:var(--whatsapp-green);transform:translateY(-1px)}.share-modal__tone-button--active{background:var(--whatsapp-green);border-color:var(--whatsapp-green);box-shadow:0 2px 8px #25d3664d;color:#fff}.share-modal__checkbox-label{align-items:center;color:var(--text-primary);cursor:pointer;display:flex;font-size:14px;gap:8px}.share-modal__checkbox{accent-color:var(--whatsapp-green);cursor:pointer;height:18px;width:18px}.share-modal__checkbox-text{-webkit-user-select:none;user-select:none}.share-modal__reset-button{background:#fff;border:1px solid var(--border-color);border-radius:6px;color:var(--text-secondary);cursor:pointer;font-size:14px;padding:8px 16px;transition:all .3s ease}.share-modal__reset-button:hover{border-color:var(--whatsapp-green);color:var(--whatsapp-green)}.share-modal__privacy{background:#fafafa;border-bottom:1px solid var(--border-color);flex-shrink:0;padding:16px 24px}.share-modal__privacy-toggle{align-items:center;background:none;border:none;color:var(--text-secondary);cursor:pointer;display:flex;font-size:14px;font-weight:500;gap:8px;padding:0;transition:color .3s ease}.share-modal__privacy-toggle:hover{color:var(--text-primary)}.share-modal__privacy-content{border-top:1px solid var(--border-color);margin-top:16px;padding-top:16px}.share-modal__privacy-note{color:var(--text-muted);font-size:12px;line-height:1.4;margin:12px 0 0}.share-modal__actions{background:#fff;border-top:1px solid var(--border-color);display:flex!important;flex-direction:column;flex-shrink:0;gap:12px;min-height:auto;padding:16px 24px}.share-modal__share-options{grid-gap:12px;display:grid!important;gap:12px;grid-template-columns:repeat(4,1fr);width:100%}.share-modal__share-option{align-items:center;background:#fff;border:2px solid var(--border-color);border-radius:12px;color:var(--text-primary);cursor:pointer;display:flex!important;flex-direction:column;font-size:12px;font-weight:500;gap:6px;justify-content:center;min-height:70px;padding:12px 8px;transition:all .3s ease}.share-modal__share-option:hover:not(:disabled){box-shadow:0 4px 12px #0000001a;transform:translateY(-2px)}.share-modal__share-option:disabled{cursor:not-allowed;opacity:.5}.share-modal__share-option svg{flex-shrink:0}.share-modal__share-option--whatsapp{border-color:var(--whatsapp-green);color:var(--whatsapp-green)}.share-modal__share-option--whatsapp:hover:not(:disabled){background:var(--whatsapp-green);box-shadow:0 4px 12px #25d3664d;color:#fff}.share-modal__share-option--messenger{border-color:#0084ff;color:#0084ff}.share-modal__share-option--messenger:hover:not(:disabled){background:#0084ff;box-shadow:0 4px 12px #0084ff4d;color:#fff}.share-modal__share-option--sms{border-color:#34c759;color:#34c759}.share-modal__share-option--sms:hover:not(:disabled){background:#34c759;box-shadow:0 4px 12px #34c7594d;color:#fff}.share-modal__share-option--copy{border-color:#666;color:#666}.share-modal__share-option--copy:hover:not(:disabled){background:#666;box-shadow:0 4px 12px #6666664d;color:#fff}.share-modal__cancel-button{align-self:center;background:#fff;border:1px solid var(--border-color);border-radius:8px;color:var(--text-secondary);cursor:pointer;font-size:14px;font-weight:500;padding:10px 24px;transition:all .3s ease}.share-modal__cancel-button:hover:not(:disabled){border-color:var(--text-secondary);color:var(--text-primary)}.share-modal__cancel-button:disabled{cursor:not-allowed;opacity:.5}.share-modal__share-button{min-width:140px}@media (max-width:768px){.share-modal__content{max-height:90vh}.share-modal__header{padding:12px 16px 8px}.share-modal__actions,.share-modal__customization,.share-modal__preview-section,.share-modal__privacy{padding:12px 16px}.share-modal__share-options{gap:8px;grid-template-columns:repeat(2,1fr)}.share-modal__cancel-button{width:100%}.share-modal__tone-options{flex-direction:column}.share-modal__tone-button{justify-content:center}.share-modal__message-textarea{max-height:80px;min-height:60px}}@media (max-width:480px){.share-modal__header{padding:16px 12px 8px}.share-modal__icon{font-size:20px;height:36px;width:36px}.share-modal__title{font-size:18px}.share-modal__preview-section{max-height:200px;padding:16px 12px}.share-modal__customization{padding:16px 12px}.share-modal__privacy{padding:12px}.share-modal__actions{padding:16px 12px}.share-modal__message-textarea{font-size:16px;max-height:100px;min-height:60px}}@media (prefers-color-scheme:dark){.share-modal{--text-primary:#fff;--text-secondary:#ccc;--text-muted:#999;--border-color:#404040}.share-modal__header{background:linear-gradient(135deg,#2a2a2a,#1a1a1a)}.share-modal__preview-section{background:#1a1a1a}.share-modal__preview{background:#2a2a2a;border-color:var(--border-color)}.share-modal__preview-content{background:#1a1a1a}.share-modal__message-textarea{background:#2a2a2a;border-color:var(--border-color);color:var(--text-primary)}.share-modal__message-textarea--error{background:#3a2a2a}.share-modal__customization{background:#1a1a1a}.share-modal__input{background:#2a2a2a;border-color:var(--border-color);color:var(--text-primary)}.share-modal__reset-button,.share-modal__tone-button{background:#2a2a2a;border-color:var(--border-color);color:var(--text-secondary)}.share-modal__actions,.share-modal__privacy{background:#1a1a1a}.share-modal__cancel-button{color:var(--text-secondary)}.share-modal__cancel-button,.share-modal__share-option{background:#2a2a2a;border-color:var(--border-color)}.share-modal__share-option--whatsapp:hover:not(:disabled){background:var(--whatsapp-green);color:#fff}.share-modal__share-option--messenger:hover:not(:disabled){background:#0084ff;color:#fff}.share-modal__share-option--sms:hover:not(:disabled){background:#34c759;color:#fff}.share-modal__share-option--copy:hover:not(:disabled){background:#666;color:#fff}}@media (prefers-contrast:high){.share-modal__input,.share-modal__message-textarea,.share-modal__preview,.share-modal__tone-button{border-width:2px}}@media (prefers-reduced-motion:reduce){.share-modal__cancel-button,.share-modal__input,.share-modal__message-textarea,.share-modal__privacy-toggle,.share-modal__reset-button,.share-modal__tone-button{transition:none}.share-modal__tone-button:hover{transform:none}}.room-code-display-container{align-items:center;display:flex;justify-content:center;min-height:400px;padding:2rem;width:100%}.room-code-card{animation:slideIn .3s ease-out;background:#fff;background:var(--surface-color,#fff);border-radius:16px;box-shadow:0 8px 24px #0000001f;max-width:550px;padding:3rem 2.5rem;text-align:center;width:100%}.room-code-title{color:#212529;color:var(--text-primary,#212529);font-size:1.75rem;font-weight:700;margin:0 0 2rem}.room-code-section{background:#f8f9fa;background:var(--surface-secondary,#f8f9fa);border:2px solid #4caf50;border:2px solid var(--primary-color,#4caf50);border-radius:12px;margin:2rem 0;padding:1.5rem}.room-code-label{color:#6c757d;color:var(--text-secondary,#6c757d);display:block;font-size:.85rem;font-weight:600;letter-spacing:1px;margin-bottom:.75rem;text-transform:uppercase}.room-code-value{background:#fff;background:var(--surface-color,#fff);border-radius:8px;font-family:Courier New,Courier,monospace;font-size:2.75rem;font-weight:800;letter-spacing:.4rem;padding:.5rem;-webkit-user-select:all;user-select:all}.player-role{background:#e7f3ff;background:var(--info-bg,#e7f3ff);font-size:1rem;margin:1.5rem 0;padding:.75rem 1.5rem}.role-label{color:#6c757d;color:var(--text-secondary,#6c757d);font-weight:500}.role-value{color:#212529;color:var(--text-primary,#212529);font-weight:700}.room-code-actions{margin:2rem 0}.copy-code-button,.share-room-button{align-items:center;border:none;border-radius:10px;cursor:pointer;display:flex;font-size:1rem;font-weight:600;gap:.5rem;justify-content:center;min-width:150px;padding:.875rem 1.75rem;transition:all .2s ease}.copy-code-button{background:#4caf50;background:var(--primary-color,#4caf50);color:#fff}.copy-code-button:hover{background:#45a049;background:var(--primary-hover,#45a049);box-shadow:0 4px 12px #4caf504d;transform:translateY(-2px)}.share-room-button{background:#25d366;color:#fff}.share-room-button:hover{background:#20ba5a;box-shadow:0 4px 12px #25d3664d;transform:translateY(-2px)}.copy-code-button:active,.share-room-button:active{transform:translateY(0)}.button-icon{font-size:1.25rem}.button-text{font-size:1rem}.room-code-instructions{color:#6c757d;color:var(--text-secondary,#6c757d);padding:0 1rem}.waiting-indicator{align-items:center;display:flex;flex-direction:column;gap:1rem;margin:2rem 0}.spinner{height:48px;width:48px}.waiting-text{font-size:1rem;font-weight:500;margin:0}.cancel-button,.waiting-text{color:#6c757d;color:var(--text-secondary,#6c757d)}.cancel-button{border:2px solid #dee2e6;border:2px solid var(--border-color,#dee2e6);border-radius:8px;font-weight:600;margin-top:1.5rem;padding:.75rem 2rem;transition:all .2s ease}.cancel-button:hover{background:#f8f9fa;background:var(--surface-secondary,#f8f9fa);border-color:#4caf50;border-color:var(--primary-color,#4caf50);color:#4caf50;color:var(--primary-color,#4caf50)}@media (prefers-color-scheme:dark){.room-code-card{background:#2c2c2c;background:var(--surface-color-dark,#2c2c2c)}.room-code-title{color:#e9ecef;color:var(--text-primary-dark,#e9ecef)}.room-code-section{background:#1a1a1a;background:var(--surface-secondary-dark,#1a1a1a);border-color:#66bb6a;border-color:var(--primary-light,#66bb6a)}.room-code-label{color:#adb5bd;color:var(--text-secondary-dark,#adb5bd)}.room-code-value{background:#2c2c2c;background:var(--surface-color-dark,#2c2c2c);color:#66bb6a;color:var(--primary-light,#66bb6a)}.player-role{background:#1a3a52;background:var(--info-bg-dark,#1a3a52)}.role-label{color:#adb5bd;color:var(--text-secondary-dark,#adb5bd)}.role-value{color:#e9ecef;color:var(--text-primary-dark,#e9ecef)}.room-code-instructions,.waiting-text{color:#adb5bd;color:var(--text-secondary-dark,#adb5bd)}.spinner{border-color:#1a1a1a;border-color:var(--surface-secondary-dark,#1a1a1a);border-top-color:#66bb6a;border-top-color:var(--primary-light,#66bb6a)}.cancel-button{border-color:#404040;border-color:var(--border-color-dark,#404040);color:#adb5bd;color:var(--text-secondary-dark,#adb5bd)}.cancel-button:hover{background:#1a1a1a;background:var(--surface-secondary-dark,#1a1a1a);border-color:#66bb6a;border-color:var(--primary-light,#66bb6a);color:#66bb6a;color:var(--primary-light,#66bb6a)}}@media (max-width:768px){.room-code-display-container{min-height:300px;padding:1rem}.room-code-card{padding:2rem 1.5rem}.room-code-title{font-size:1.5rem}.room-code-value{font-size:2.25rem;letter-spacing:.3rem}.room-code-actions{flex-direction:column;gap:.75rem}.copy-code-button,.share-room-button{min-width:auto;width:100%}.room-code-instructions{font-size:.9rem}}@media (max-width:480px){.room-code-value{font-size:1.75rem;letter-spacing:.2rem}.button-text{font-size:.9rem}}.chess-game-container{box-sizing:border-box;margin:0 auto;max-width:1400px;padding:1rem;width:100%}.chess-game-header{align-items:center;background:#fff;background:var(--surface-color,#fff);border-radius:8px;box-shadow:0 2px 4px #0000001a;display:flex;justify-content:space-between;margin-bottom:1.5rem;padding:1rem}.chess-game-header h1{color:#333;color:var(--text-primary,#333);font-size:1.8rem;margin:0}.ai-speed-control,.chess-game-controls{align-items:center;display:flex;gap:.5rem}.ai-speed-control{background:#f5f5f5;background:var(--surface-secondary,#f5f5f5);border-radius:4px;padding:.5rem}.ai-speed-control label{color:#666;color:var(--text-secondary,#666);font-size:.9rem;white-space:nowrap}.ai-speed-control select{background:#fff;background:var(--surface-color,#fff);border:1px solid #ddd;border:1px solid var(--border-color,#ddd);border-radius:4px;color:#333;color:var(--text-primary,#333);cursor:pointer;font-size:.9rem;min-height:36px;padding:.4rem .6rem}.ai-speed-control select:hover{border-color:#4caf50;border-color:var(--primary-color,#4caf50)}.ai-speed-control select:focus{outline:2px solid #4caf50;outline:2px solid var(--primary-color,#4caf50);outline-offset:2px}.chess-game-controls button{background:#4caf50;background:var(--primary-color,#4caf50);border:none;border-radius:4px;color:#fff;cursor:pointer;font-size:.9rem;min-height:44px;min-width:44px;padding:.5rem 1rem;transition:background .2s}.chess-game-controls button:hover{background:#45a049;background:var(--primary-hover,#45a049)}.chess-game-controls button:active{transform:scale(.98)}.chess-game-content{grid-gap:1.5rem;align-items:start;display:grid;gap:1.5rem;grid-template-columns:250px 1fr 250px}.chess-game-main{align-items:center;display:flex;justify-content:center}.chess-game-sidebar{display:flex;flex-direction:column;gap:1rem}.chess-game-status{background:#fff;background:var(--surface-color,#fff);border-radius:8px;box-shadow:0 2px 4px #0000001a;padding:1rem}.chess-game-status p{color:#333;color:var(--text-primary,#333);font-size:.95rem;margin:.5rem 0}.chess-game-status p:first-child{margin-top:0}.chess-game-status p:last-child{margin-bottom:0}@media (prefers-color-scheme:dark){.chess-game-header,.chess-game-status{background:#2a2a2a;background:var(--surface-color-dark,#2a2a2a);box-shadow:0 2px 4px #0000004d}.chess-game-header h1,.chess-game-status p{color:#e0e0e0;color:var(--text-primary-dark,#e0e0e0)}.ai-speed-control{background:#1a1a1a;background:var(--surface-secondary-dark,#1a1a1a)}.ai-speed-control label{color:#aaa;color:var(--text-secondary-dark,#aaa)}.ai-speed-control select{background:#2a2a2a;background:var(--surface-color-dark,#2a2a2a);border-color:#444;border-color:var(--border-color-dark,#444);color:#e0e0e0;color:var(--text-primary-dark,#e0e0e0)}.ai-speed-control select:hover{border-color:#4caf50;border-color:var(--primary-color,#4caf50)}}@media (max-width:1024px){.chess-game-content{gap:1rem;grid-template-columns:200px 1fr 200px}.chess-game-sidebar{font-size:.9rem}}@media (max-width:768px){.chess-game-container{padding:.5rem .5rem 2rem}.chess-game-header{flex-direction:column;gap:1rem;padding:.75rem}.chess-game-header h1{font-size:1.5rem}.chess-game-controls{flex-wrap:wrap}.ai-speed-control,.chess-game-controls{justify-content:center;width:100%}.chess-game-controls button{flex:1 1;max-width:120px}.chess-game-content{gap:1.5rem;grid-template-columns:1fr}.chess-game-sidebar{margin-bottom:1rem;order:2}.chess-game-main{margin-bottom:1.5rem;order:1}.chess-game-sidebar:last-child{margin-bottom:2rem;order:3}}@media (max-width:480px){.chess-game-header h1{font-size:1.3rem}.chess-game-controls button{font-size:.85rem;padding:.4rem .8rem}.chess-game-status{padding:.75rem}.chess-game-status p{font-size:.85rem}}@media (max-width:768px) and (orientation:landscape){.chess-game-content{grid-template-columns:200px 1fr 200px}.chess-game-main,.chess-game-sidebar{order:0}}@media (prefers-contrast:high){.chess-game-controls button,.chess-game-header,.chess-game-status{border:2px solid #000;border:2px solid var(--text-primary,#000)}}@media (prefers-reduced-motion:reduce){.chess-game-controls button{transition:none}.chess-game-controls button:active{transform:none}}@media print{.chess-game-header{border:1px solid #ccc;box-shadow:none}.chess-game-controls{display:none}.chess-game-content{grid-template-columns:1fr}.chess-game-sidebar:last-child{display:none}}.waiting-for-opponent{align-items:center;display:flex;justify-content:center;min-height:400px;padding:2rem}.room-code-display{box-shadow:0 4px 12px #00000026;max-width:500px;padding:3rem 2rem;width:100%}.room-code-display h2{color:#333;color:var(--text-primary,#333);font-size:1.8rem;margin:0 0 2rem}.room-code{align-items:center;background:var(--surface-secondary,#f5f5f5);display:flex;flex-direction:column;gap:1rem;margin:2rem 0;padding:1.5rem}.room-code label{color:#666;color:var(--text-secondary,#666);font-size:.9rem;font-weight:600;letter-spacing:.5px;text-transform:uppercase}.code-value{background:#fff;background:var(--surface-color,#fff);border:2px solid #4caf50;border:2px solid var(--primary-color,#4caf50);border-radius:8px;color:#4caf50;color:var(--primary-color,#4caf50);font-family:Courier New,monospace;font-size:2.5rem;font-weight:700;letter-spacing:.3rem;padding:.5rem 1rem}.room-code-actions{align-items:center;display:flex;flex-wrap:wrap;gap:1rem;justify-content:center}.room-code button.copy-button{align-items:center;background:#4caf50;background:var(--primary-color,#4caf50);border:none;border-radius:6px;color:#fff;cursor:pointer;display:flex;font-size:1rem;gap:.5rem;padding:.6rem 1.5rem;transition:all .2s}.room-code button.copy-button:hover{background:#45a049;background:var(--primary-hover,#45a049);box-shadow:0 4px 8px #0003;transform:translateY(-2px)}.room-code button.copy-button:active{transform:translateY(0)}.room-code-instructions{color:#666;color:var(--text-secondary,#666);font-size:1rem;line-height:1.6;margin:1.5rem 0}.loading-spinner{display:flex;justify-content:center;margin-top:2rem}.spinner{border:4px solid #f5f5f5;border-top-color:#4caf50;border:4px solid var(--surface-secondary,#f5f5f5);border-top-color:var(--primary-color,#4caf50);height:40px;width:40px}@media (prefers-color-scheme:dark){.room-code-display{background:#2c2c2c;background:var(--surface-color-dark,#2c2c2c)}.room-code-display h2{color:#e9ecef;color:var(--text-primary-dark,#e9ecef)}.room-code{background:#1a1a1a;background:var(--surface-secondary-dark,#1a1a1a)}.room-code label{color:#adb5bd;color:var(--text-secondary-dark,#adb5bd)}.code-value{background:#2c2c2c;background:var(--surface-color-dark,#2c2c2c);border-color:#66bb6a;border-color:var(--primary-light,#66bb6a);color:#66bb6a;color:var(--primary-light,#66bb6a)}.room-code-instructions{color:#adb5bd;color:var(--text-secondary-dark,#adb5bd)}.spinner{border-color:#1a1a1a;border-color:var(--surface-secondary-dark,#1a1a1a);border-top-color:#66bb6a;border-top-color:var(--primary-light,#66bb6a)}}@media (max-width:768px){.waiting-for-opponent{min-height:300px;padding:1rem}.room-code-display{padding:2rem 1.5rem}.room-code-display h2{font-size:1.5rem}.code-value{font-size:2rem;letter-spacing:.2rem}.room-code-instructions{font-size:.9rem}}.cancel-button{background:#0000;border:2px solid #4caf50;border:2px solid var(--primary-color,#4caf50);border-radius:6px;color:#4caf50;color:var(--primary-color,#4caf50);cursor:pointer;font-size:1rem;margin-top:2rem;padding:.8rem 2rem;transition:all .2s}.cancel-button:hover{background:#4caf50;background:var(--primary-color,#4caf50);color:#fff}.loading-spinner p{color:#666;color:var(--text-secondary,#666);font-size:.95rem;margin-top:1rem}@media (prefers-color-scheme:dark){.cancel-button{border-color:#66bb6a;border-color:var(--primary-light,#66bb6a);color:#66bb6a;color:var(--primary-light,#66bb6a)}.cancel-button:hover{background:#66bb6a;background:var(--primary-light,#66bb6a);color:#2c2c2c;color:var(--surface-color-dark,#2c2c2c)}.loading-spinner p{color:#adb5bd;color:var(--text-secondary-dark,#adb5bd)}}.multiplayer-room-info{background:#f5f5f5;background:var(--surface-secondary,#f5f5f5);border-radius:8px;margin-bottom:1.5rem;padding:1rem;text-align:center}.multiplayer-room-info h3{color:#666;color:var(--text-secondary,#666);font-size:.9rem;letter-spacing:.5px;margin:0 0 .5rem;text-transform:uppercase}.room-code-value{color:#4caf50;color:var(--primary-color,#4caf50);font-family:Courier New,monospace;font-size:1.5rem;font-weight:700;letter-spacing:.2rem}.connection-status{align-items:center;background:#f5f5f5;background:var(--surface-secondary,#f5f5f5);border-radius:6px;display:flex;gap:.5rem;margin-bottom:1rem;padding:.75rem}.connection-status .status-indicator{animation:pulse 2s infinite;border-radius:50%;height:12px;width:12px}.connection-status.status-connected .status-indicator{background:#4caf50}.connection-status.status-reconnecting .status-indicator{background:#ffc107}.connection-status.status-disconnected .status-indicator{animation:none;background:#f44336}.connection-status .status-text{color:#333;color:var(--text-primary,#333);font-size:.9rem;font-weight:600}.opponent-status{background:#f5f5f5;background:var(--surface-secondary,#f5f5f5);border-radius:6px;margin-bottom:1rem;padding:.75rem}.opponent-status h4{color:#666;color:var(--text-secondary,#666);font-size:.85rem;letter-spacing:.5px;margin:0 0 .5rem;text-transform:uppercase}.opponent-status .connected{color:#4caf50;font-weight:600}.opponent-status .disconnected{color:#f44336;font-weight:600}.turn-indicator{background:#f5f5f5;background:var(--surface-secondary,#f5f5f5);border-radius:6px;margin-bottom:1rem;padding:.75rem}.turn-indicator h4{color:#666;color:var(--text-secondary,#666);font-size:.85rem;letter-spacing:.5px;margin:0 0 .5rem;text-transform:uppercase}.turn-display{align-items:center;background:#fff;background:var(--surface-color,#fff);border-radius:4px;display:flex;gap:.5rem;padding:.5rem}.turn-display.white{border-left:4px solid #fff;box-shadow:0 0 0 1px #ddd}.turn-display.black{border-left:4px solid #333}.turn-color{font-size:1.2rem}.turn-text{color:#333;color:var(--text-primary,#333);font-weight:600}.your-turn-badge{animation:pulse-badge 1.5s infinite;background:#4caf50;background:var(--primary-color,#4caf50);border-radius:4px;color:#fff;font-size:.75rem;font-weight:700;letter-spacing:.5px;margin-left:auto;padding:.25rem .5rem;text-transform:uppercase}@keyframes pulse-badge{0%,to{opacity:1;transform:scale(1)}50%{opacity:.8;transform:scale(1.05)}}.game-status-info{background:#f5f5f5;background:var(--surface-secondary,#f5f5f5);border-radius:6px;margin-bottom:1rem;padding:.75rem}.game-status-info h4{color:#666;color:var(--text-secondary,#666);font-size:.85rem;letter-spacing:.5px;margin:0 0 .5rem;text-transform:uppercase}.game-status-info p{font-size:1rem;font-weight:600;margin:0}.game-status-info .status-check{color:#ffc107}.game-status-info .status-checkmate{color:#f44336}.game-status-info .status-draw,.game-status-info .status-stalemate{color:#2196f3}.game-status-info .status-active{color:#4caf50}.multiplayer-actions{display:flex;flex-direction:column;gap:.5rem}.multiplayer-actions button{border:none;border-radius:6px;cursor:pointer;font-size:.9rem;font-weight:600;padding:.75rem;transition:all .2s}.multiplayer-actions button:disabled{cursor:not-allowed;opacity:.5}.resign-button{background:#f44336;color:#fff}.resign-button:hover:not(:disabled){background:#d32f2f;box-shadow:0 4px 8px #f443364d;transform:translateY(-2px)}.draw-button{background:#2196f3;color:#fff}.draw-button:hover:not(:disabled){background:#1976d2;box-shadow:0 4px 8px #2196f34d;transform:translateY(-2px)}@media (prefers-color-scheme:dark){.connection-status,.game-status-info,.multiplayer-room-info,.opponent-status,.turn-indicator{background:#1a1a1a;background:var(--surface-secondary-dark,#1a1a1a)}.game-status-info h4,.multiplayer-room-info h3,.opponent-status h4,.turn-indicator h4{color:#aaa;color:var(--text-secondary-dark,#aaa)}.room-code-value{color:#66bb6a;color:var(--primary-light,#66bb6a)}.connection-status .status-text,.turn-text{color:#e0e0e0;color:var(--text-primary-dark,#e0e0e0)}.turn-display{background:#2a2a2a;background:var(--surface-color-dark,#2a2a2a)}.turn-display.white{box-shadow:0 0 0 1px #444}}@media (max-width:768px){.multiplayer-room-info{padding:.75rem}.room-code-value{font-size:1.2rem;letter-spacing:.15rem}.connection-status,.game-status-info,.opponent-status,.turn-indicator{padding:.5rem}.multiplayer-actions button{font-size:.85rem;padding:.6rem}}.share-button{-webkit-tap-highlight-color:transparent;align-items:center;background:linear-gradient(135deg,#25d366,#128c7e);border:none;border-radius:12px;box-shadow:0 2px 8px #25d3664d;color:#fff;cursor:pointer;display:inline-flex;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;font-weight:600;justify-content:center;overflow:hidden;position:relative;transition:all .3s cubic-bezier(.4,0,.2,1);-webkit-user-select:none;user-select:none}.share-button:hover{background:linear-gradient(135deg,#2ee86c,#1ba55c);box-shadow:0 4px 16px #25d36666;transform:translateY(-2px)}.share-button:active{box-shadow:0 2px 8px #25d3664d;transform:translateY(0)}.share-button:focus{box-shadow:0 0 0 3px #25d3664d;outline:none}.share-button--small{border-radius:8px;font-size:14px;min-height:36px;padding:8px 16px}.share-button--medium{border-radius:12px;font-size:16px;min-height:44px;padding:12px 24px}.share-button--large{border-radius:16px;font-size:18px;min-height:52px;padding:16px 32px}.share-button--floating{border-radius:50%;bottom:20px;box-shadow:0 4px 16px #25d36666;height:56px;padding:0;position:fixed;right:20px;width:56px;z-index:1000}.share-button--floating .share-button__text{display:none}.share-button--floating .share-button__icon{height:24px;width:24px}.share-button--modal{justify-content:center;max-width:300px;width:100%}.share-button--loading{cursor:wait;pointer-events:none}.share-button--success{background:linear-gradient(135deg,#4caf50,#2e7d32);box-shadow:0 2px 8px #4caf504d}.share-button--error{background:linear-gradient(135deg,#f44336,#c62828);box-shadow:0 2px 8px #f443364d}.share-button--disabled{color:#9e9e9e;cursor:not-allowed}.share-button--disabled,.share-button--disabled:hover{background:#e0e0e0;box-shadow:none;transform:none}.share-button__content{align-items:center;display:flex;gap:8px;justify-content:center;position:relative;z-index:2}.share-button__icon{flex-shrink:0;height:20px;transition:all .3s ease;width:20px}.share-button--small .share-button__icon{height:16px;width:16px}.share-button--large .share-button__icon{height:24px;width:24px}.share-button__icon--whatsapp{fill:currentColor}.share-button__icon--success{stroke:currentColor;animation:checkmark .6s ease-in-out}.share-button__icon--error{stroke:currentColor;animation:shake .5s ease-in-out}.share-button__text{font-weight:600;transition:opacity .3s ease;white-space:nowrap}.share-button--loading .share-button__text{opacity:.8}.share-button__spinner{align-items:center;display:flex;justify-content:center}.spinner{animation:spin 1s linear infinite;border:2px solid #ffffff4d;border-radius:50%;border-top-color:#fff;height:16px;width:16px}.share-button--small .spinner{height:14px;width:14px}.share-button--large .spinner{height:20px;width:20px}.share-button__ripple{background:radial-gradient(circle,#ffffff4d 0,#0000 70%);border-radius:inherit;bottom:0;left:0;opacity:0;pointer-events:none;position:absolute;right:0;top:0;transform:scale(0)}.share-button:active .share-button__ripple{animation:ripple .6s ease-out}.share-button--room{background:linear-gradient(135deg,#25d366,#128c7e)}.share-button--result{background:linear-gradient(135deg,#ff9800,#f57c00);box-shadow:0 2px 8px #ff98004d}.share-button--result:hover{background:linear-gradient(135deg,#ffb74d,#ff8f00);box-shadow:0 4px 16px #ff980066}.share-button--challenge{background:linear-gradient(135deg,#e91e63,#c2185b);box-shadow:0 2px 8px #e91e634d}.share-button--challenge:hover{background:linear-gradient(135deg,#f06292,#ad1457);box-shadow:0 4px 16px #e91e6366}.share-button--invite{background:linear-gradient(135deg,#2196f3,#1976d2);box-shadow:0 2px 8px #2196f34d}.share-button--invite:hover{background:linear-gradient(135deg,#64b5f6,#1565c0);box-shadow:0 4px 16px #2196f366}.share-button--achievement{background:linear-gradient(135deg,#9c27b0,#7b1fa2);box-shadow:0 2px 8px #9c27b04d}.share-button--achievement:hover{background:linear-gradient(135deg,#ba68c8,#6a1b9a);box-shadow:0 4px 16px #9c27b066}@keyframes spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}@keyframes checkmark{0%{opacity:0;transform:scale(.3)}50%{opacity:1;transform:scale(1.1)}to{opacity:1;transform:scale(1)}}@keyframes shake{0%,to{transform:translateX(0)}25%{transform:translateX(-4px)}75%{transform:translateX(4px)}}@media (max-width:768px){.share-button{min-height:48px}.share-button--small{min-height:40px;padding:10px 18px}.share-button--medium{min-height:48px;padding:14px 28px}.share-button--large{min-height:56px;padding:18px 36px}.share-button--floating{bottom:16px;height:64px;right:16px;width:64px}.share-button--floating .share-button__icon{height:28px;width:28px}}@media (max-width:480px){.share-button--modal{max-width:none;width:100%}.share-button__text{font-size:16px}}@media (prefers-color-scheme:dark){.share-button--disabled{background:#424242;color:#757575}}@media (prefers-contrast:high){.share-button{border:2px solid #0000}.share-button:focus{border-color:#fff;box-shadow:none}}@media (prefers-reduced-motion:reduce){.share-button,.share-button__icon,.share-button__text,.spinner{animation:none;transition:none}.share-button:active,.share-button:hover{transform:none}}:root{--ws-bg-primary:#fff;--ws-bg-secondary:#f8f9fa;--ws-text-primary:#000;--ws-text-success:#155724;--ws-text-warning:#856404;--ws-text-danger:#721c24;--ws-text-info:#007bff;--ws-border-primary:#007bff;--ws-border-success:#28a745;--ws-border-warning:#ffc107;--ws-border-danger:#dc3545;--ws-cell-bg:#f8f9fa;--ws-cell-bg-empty:#fff;--ws-cell-bg-disabled:#e9ecef;--ws-cell-border:#333;--ws-gradient-gaming:linear-gradient(135deg,#667eea,#764ba2);--ws-gradient-success:linear-gradient(135deg,#43e97b,#38f9d7);--ws-gradient-warning:linear-gradient(135deg,#f093fb,#f5576c);--ws-gradient-danger:linear-gradient(135deg,#ff6b6b,#ee5a24);--ws-bg-animated:linear-gradient(-45deg,#ee7752,#e73c7e,#23a6d5,#23d5ab)}[data-theme=dark]{--ws-bg-primary:#0a0a0a;--ws-bg-secondary:#1a1a1a;--ws-text-primary:#fff;--ws-text-success:#4caf50;--ws-text-warning:#ffc107;--ws-text-danger:#f44336;--ws-text-info:#2196f3;--ws-border-primary:#2196f3;--ws-border-success:#4caf50;--ws-border-warning:#ffc107;--ws-border-danger:#f44336;--ws-cell-bg:#2a2a2a;--ws-cell-bg-empty:#1e1e1e;--ws-cell-bg-disabled:#3a3a3a;--ws-cell-border:#555;--ws-gradient-gaming:linear-gradient(135deg,#2d1b69,#11998e);--ws-gradient-success:linear-gradient(135deg,#134e5e,#71b280);--ws-gradient-warning:linear-gradient(135deg,#8360c3,#2ebf91);--ws-gradient-danger:linear-gradient(135deg,#3a1c71,#d76d77);--ws-bg-animated:linear-gradient(-45deg,#1a1a2e,#16213e,#0f3460,#533483)}.websocket-auth-button{position:fixed;right:16px;top:16px;z-index:100}@media (max-width:767px){.websocket-auth-button{right:12px;top:12px}}@media (prefers-color-scheme:dark){:root:not([data-theme=light]){--ws-bg-primary:#0a0a0a;--ws-bg-secondary:#1a1a1a;--ws-text-primary:#fff;--ws-text-success:#4caf50;--ws-text-warning:#ffc107;--ws-text-danger:#f44336;--ws-text-info:#2196f3;--ws-border-primary:#2196f3;--ws-border-success:#4caf50;--ws-border-warning:#ffc107;--ws-border-danger:#f44336;--ws-cell-bg:#2a2a2a;--ws-cell-bg-empty:#1e1e1e;--ws-cell-bg-disabled:#3a3a3a;--ws-cell-border:#555;--ws-gradient-gaming:linear-gradient(135deg,#2d1b69,#11998e);--ws-gradient-success:linear-gradient(135deg,#134e5e,#71b280);--ws-gradient-warning:linear-gradient(135deg,#8360c3,#2ebf91);--ws-gradient-danger:linear-gradient(135deg,#3a1c71,#d76d77);--ws-bg-animated:linear-gradient(-45deg,#1a1a2e,#16213e,#0f3460,#533483)}}.websocket-multiplayer-container{animation:gradientShift 12s ease infinite;background:linear-gradient(-45deg,#ee7752,#e73c7e,#23a6d5,#23d5ab);background:var(--ws-bg-animated);background-size:400% 400%;min-height:100vh;overflow:hidden;position:relative}.websocket-multiplayer-container:before{background:#0000001a;bottom:0;content:"";left:0;position:absolute;right:0;top:0;z-index:0}.websocket-multiplayer-container:after{animation:float 8s ease-in-out infinite;background-image:radial-gradient(circle at 25% 75%,#7877c633 0,#0000 50%),radial-gradient(circle at 75% 25%,#ff77c633 0,#0000 50%),radial-gradient(circle at 50% 50%,#78dbff33 0,#0000 50%);bottom:0;content:"";left:0;position:absolute;right:0;top:0;z-index:0}.websocket-multiplayer-container>*{position:relative;z-index:1}.ws-info-panel{background-color:#fff;background-color:var(--ws-bg-primary);border-color:#007bff;border-color:var(--ws-border-primary);color:#000;color:var(--ws-text-primary)}.ws-info-panel strong{color:#007bff;color:var(--ws-text-info)}.ws-turn-indicator{color:#000;color:var(--ws-text-primary)}.ws-turn-indicator.my-turn{background-color:var(--ws-bg-success);border-color:#28a745;border-color:var(--ws-border-success);color:#155724;color:var(--ws-text-success)}.ws-turn-indicator.waiting{background-color:var(--ws-bg-warning);border-color:#ffc107;border-color:var(--ws-border-warning);color:#856404;color:var(--ws-text-warning)}.ws-win-announcement{color:#000;color:var(--ws-text-primary)}.ws-win-announcement.victory{background-color:var(--ws-bg-success);border-color:#28a745;border-color:var(--ws-border-success);color:#155724;color:var(--ws-text-success)}.ws-win-announcement.defeat{background-color:var(--ws-bg-danger);border-color:#dc3545;border-color:var(--ws-border-danger);color:#721c24;color:var(--ws-text-danger)}.ws-draw-announcement{background-color:var(--ws-bg-warning);border-color:#ffc107;border-color:var(--ws-border-warning);color:#856404;color:var(--ws-text-warning)}.ws-waiting-panel{background-color:#fff;background-color:var(--ws-bg-primary);border-color:#007bff;border-color:var(--ws-border-primary);color:#000;color:var(--ws-text-primary)}.ws-waiting-panel h3{color:#007bff;color:var(--ws-text-info)}.ws-game-cell{background-color:#f8f9fa;background-color:var(--ws-cell-bg);border-color:#333;border-color:var(--ws-cell-border);color:#000;color:var(--ws-text-primary)}.ws-game-cell.empty{background-color:#fff;background-color:var(--ws-cell-bg-empty)}.ws-game-cell.disabled{background-color:#e9ecef;background-color:var(--ws-cell-bg-disabled)}.ws-game-cell.winning{border-color:#fff}@keyframes winPulse{0%,to{box-shadow:0 4px 12px #00000026}50%{box-shadow:0 8px 24px #00000040}}@keyframes winCellPulse{0%,to{border-color:#fff!important;box-shadow:0 0 20px #28a74599}50%{border-color:#ff0!important;box-shadow:0 0 30px #28a745cc}}@keyframes drawLine{0%{stroke-dasharray:0,1000;opacity:0}20%{opacity:1}to{stroke-dasharray:1000,0;opacity:1}}@keyframes lineGlow{0%,to{filter:drop-shadow(2px 2px 4px rgba(0,0,0,.3)) drop-shadow(0 0 10px currentColor)}50%{filter:drop-shadow(2px 2px 4px rgba(0,0,0,.3)) drop-shadow(0 0 20px currentColor)}}.win-announcement{animation:winPulse 2s ease-in-out infinite}.winning-cell{animation:winCellPulse 1.5s ease-in-out infinite}.winning-line{animation:drawLine 1.5s ease-in-out forwards,lineGlow 2s ease-in-out 1.5s infinite}.winning-line,.winning-line-bg{stroke-dasharray:1000;stroke-linecap:round}.winning-line-bg{animation:drawLine 1.5s ease-in-out forwards}.game-board{position:relative}.board-overlay{bottom:0;left:0;pointer-events:none;position:absolute;right:0;top:0;z-index:10}.game-cell{transition:all .3s ease}.game-cell:hover:not(:disabled){box-shadow:0 4px 8px #0003;transform:scale(1.05)}.turn-indicator{transition:all .3s ease}.turn-indicator.my-turn{animation:pulse 2s ease-in-out infinite;background-color:#d4edda;border-color:#28a745}.turn-indicator.waiting{background-color:#fff3cd;border-color:#ffc107}.ws-game-cell.empty:hover:not(:disabled){background-color:#fff;background-color:var(--ws-cell-bg-empty);opacity:.8}.ws-draw-announcement h2,.ws-draw-announcement p,.ws-info-panel p,.ws-turn-indicator p,.ws-waiting-panel p,.ws-win-announcement h2,.ws-win-announcement p{color:inherit}input[type=text]{background-color:#fff;background-color:var(--ws-cell-bg-empty);border-color:#007bff;border-color:var(--ws-border-primary);color:#000;color:var(--ws-text-primary)}input[type=text]::placeholder{color:#000;color:var(--ws-text-primary);opacity:.6}.game-app{background:#f5f5f5;background:var(--background-color,#f5f5f5);color:#333;color:var(--text-color,#333);min-height:100vh;position:relative}.game-app-auth-button{position:fixed;right:16px;top:16px;z-index:100}@media (max-width:767px){.game-app-auth-button{right:12px;top:12px}}.game-header,.view-header{align-items:center;display:flex;justify-content:space-between;margin-bottom:1rem}.game-header h2,.view-header h2{font-size:1.5rem;font-weight:600;margin:0}.room-code-display{background:#fff;background:var(--surface-color,#fff);border-radius:12px;box-shadow:0 2px 8px #0000001a;padding:2rem;text-align:center}.room-code-display h3{color:#666;color:var(--text-secondary,#666);font-size:1rem;font-weight:500;margin:0 0 1rem}.room-code{background:#f5f5f5;background:var(--background-color,#f5f5f5);border-radius:8px;color:#4a90e2;color:var(--primary-color,#4a90e2);font-family:Courier New,monospace;font-size:2rem;font-weight:700;letter-spacing:.2em;margin:1rem 0;padding:1rem 2rem}.room-code-display p{color:#666;color:var(--text-secondary,#666);font-size:.9rem;margin:1rem 0 0}.testing-note{background:#f8f9fa;border-left:3px solid #4a90e2;border-left:3px solid var(--primary-color,#4a90e2);border-radius:6px;margin-top:1rem;padding:.75rem}.testing-note small{color:#666;color:var(--text-secondary,#666);font-size:.8rem;line-height:1.4}.join-game-form{max-width:300px;width:100%}.room-code-input{background:#fff;background:var(--surface-color,#fff);border:2px solid #ddd;border:2px solid var(--border-color,#ddd);border-radius:8px;color:#333;color:var(--text-color,#333);font-family:Courier New,monospace;font-size:1.2rem;letter-spacing:.1em;margin-bottom:1.5rem;padding:1rem;text-align:center;text-transform:uppercase;width:100%}.room-code-input:focus{border-color:#4a90e2;border-color:var(--primary-color,#4a90e2);box-shadow:0 0 0 3px #4a90e21a;outline:none}.room-code-input::placeholder{color:#999;color:var(--text-secondary,#999);letter-spacing:normal;text-transform:none}[data-theme=dark] .game-app{--background-color:#1a1a1a;--surface-color:#2d2d2d;--text-color:#fff;--text-secondary:#ccc;--border-color:#444}[data-theme=high-contrast] .game-app{--background-color:#000;--surface-color:#fff;--text-color:#000;--text-secondary:#333;--border-color:#000}@media (max-width:768px){.game-header,.view-header{align-items:stretch;flex-direction:column;gap:1rem}.room-code{font-size:1.5rem;padding:.75rem 1.5rem}.room-code-input{font-size:1.1rem;padding:.875rem}}@media (max-width:480px){.room-code-display{padding:1.5rem}.room-code{font-size:1.25rem;padding:.5rem 1rem}}.game-app .loading-container{align-items:center;display:flex;justify-content:center;min-height:50vh}.game-app>*{animation:fadeIn .3s ease-in-out}.room-code-input:focus-visible{outline:2px solid #4a90e2;outline:2px solid var(--primary-color,#4a90e2);outline-offset:2px}@media (prefers-reduced-motion:reduce){.game-app>*{animation:none}}.room-status{background:#fff;background:var(--surface-color,#fff);border-radius:12px;box-shadow:0 2px 8px #0000001a;padding:1.5rem;text-align:center;width:100%}.player-role{align-items:center;background:#4a90e2;background:var(--primary-color,#4a90e2);border-radius:8px;color:#fff;display:flex;font-weight:500;gap:.5rem;justify-content:center;margin-bottom:1rem;padding:.75rem}.role-label{font-size:.9rem}.role-indicator{font-size:1rem;font-weight:700}.player-count{align-items:center;display:flex;gap:.5rem;justify-content:center;margin-bottom:1rem}.status-label{color:#666;color:var(--text-secondary,#666);font-size:.9rem}.player-indicator{background:#f5f5f5;background:var(--background-color,#f5f5f5);border-radius:20px;color:#4a90e2;color:var(--primary-color,#4a90e2);font-size:1.2rem;font-weight:700;padding:.25rem .75rem}.waiting-indicator{margin:1rem 0}.auto-check-info{margin-top:.5rem;text-align:center}.auto-check-info small{color:#666;color:var(--text-secondary,#666);font-size:.75rem}.ready-indicator{margin:1rem 0}.ready-text{color:#28a745;font-size:1.1rem;font-weight:700}.ready-text:before{color:#28a745;content:"✓ "}.waiting-indicator .loading-indicator{animation:pulse 2s infinite}@keyframes pulse{0%{opacity:1}50%{opacity:.6}to{opacity:1}}.cross-browser-section{background:#fff3cd;border:1px solid #ffeaa7;border-radius:8px;margin-top:1rem;padding:1rem;text-align:center;width:100%}.cross-browser-label{color:#856404;display:block;font-size:.85rem;line-height:1.4;margin-bottom:.75rem}.cross-browser-section .responsive-button{background:#fd7e14;border-color:#fd7e14;color:#fff;font-weight:500}.cross-browser-section .responsive-button:hover{background:#e8590c;border-color:#e8590c}.cross-browser-section .responsive-button:focus{box-shadow:0 0 0 3px #fd7e1440}[data-theme=dark] .cross-browser-section{background:#2d2a1f;border-color:#4a4017}[data-theme=dark] .cross-browser-label{color:#ffc107}@media (prefers-contrast:high){.room-code-input{border-width:3px}.room-code{border:2px solid #333;border:2px solid var(--text-color,#333)}.player-indicator{border:2px solid #4a90e2;border:2px solid var(--primary-color,#4a90e2)}.cross-browser-section{border-width:2px}}.multiplayer-info{background:#e8f5e8;border:1px solid #4caf50;border-radius:8px;margin:16px 0;padding:12px;text-align:center}.multiplayer-info p{color:#2e7d32;font-weight:500;margin:0 0 4px}.multiplayer-info small{color:#558b2f;font-size:.85em}:root{--hub-bg-primary:#fff;--hub-bg-secondary:#f8f9fa;--hub-text-primary:#212529;--hub-text-secondary:#6c757d;--hub-border:#dee2e6;--hub-shadow:#0000001a;--hub-accent:#007bff;--hub-success:#28a745;--hub-warning:#ffc107;--hub-danger:#dc3545;--hub-gradient-primary:linear-gradient(135deg,#667eea,#764ba2);--hub-gradient-secondary:linear-gradient(135deg,#f093fb,#f5576c);--hub-gradient-accent:linear-gradient(135deg,#4facfe,#00f2fe);--hub-gradient-success:linear-gradient(135deg,#43e97b,#38f9d7);--hub-gradient-gaming:linear-gradient(135deg,#fa709a,#fee140);--hub-bg-animated:linear-gradient(-45deg,#ee7752,#e73c7e,#23a6d5,#23d5ab)}[data-theme=dark]{--hub-bg-primary:#0a0a0a;--hub-bg-secondary:#1a1a1a;--hub-text-primary:#fff;--hub-text-secondary:#adb5bd;--hub-border:#495057;--hub-shadow:#00000080;--hub-accent:#0d6efd;--hub-success:#198754;--hub-warning:#fd7e14;--hub-danger:#dc3545;--hub-gradient-primary:linear-gradient(135deg,#2d1b69,#11998e);--hub-gradient-secondary:linear-gradient(135deg,#8360c3,#2ebf91);--hub-gradient-accent:linear-gradient(135deg,#3a1c71,#d76d77);--hub-gradient-success:linear-gradient(135deg,#134e5e,#71b280);--hub-gradient-gaming:linear-gradient(135deg,#667db6,#0082c8);--hub-bg-animated:linear-gradient(-45deg,#1a1a2e,#16213e,#0f3460,#533483)}.hub-auth-button{position:absolute;right:16px;top:16px;z-index:100}@media (max-width:767px){.hub-auth-button{right:12px;top:12px}}@media (prefers-color-scheme:dark){:root:not([data-theme=light]){--hub-bg-primary:#0a0a0a;--hub-bg-secondary:#1a1a1a;--hub-text-primary:#fff;--hub-text-secondary:#adb5bd;--hub-border:#495057;--hub-shadow:#00000080;--hub-accent:#0d6efd;--hub-success:#198754;--hub-warning:#fd7e14;--hub-danger:#dc3545;--hub-gradient-primary:linear-gradient(135deg,#2d1b69,#11998e);--hub-gradient-secondary:linear-gradient(135deg,#8360c3,#2ebf91);--hub-gradient-accent:linear-gradient(135deg,#3a1c71,#d76d77);--hub-gradient-success:linear-gradient(135deg,#134e5e,#71b280);--hub-gradient-gaming:linear-gradient(135deg,#667db6,#0082c8);--hub-bg-animated:linear-gradient(-45deg,#1a1a2e,#16213e,#0f3460,#533483)}}@keyframes gradientShift{0%{background-position:0 50%}50%{background-position:100% 50%}to{background-position:0 50%}}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}@keyframes glow{0%,to{box-shadow:0 0 20px #667eea4d}50%{box-shadow:0 0 40px #667eea99}}@keyframes sparkle{0%,to{opacity:0;transform:scale(0)}50%{opacity:1;transform:scale(1)}}.game-hub{animation:gradientShift 15s ease infinite;background:linear-gradient(-45deg,#ee7752,#e73c7e,#23a6d5,#23d5ab);background:var(--hub-bg-animated);background-size:400% 400%;min-height:100vh;overflow:hidden;padding:2rem 1rem;position:relative}.game-hub:before{background:#0000001a}.game-hub:after,.game-hub:before{bottom:0;content:"";left:0;position:absolute;right:0;top:0;z-index:0}.game-hub:after{animation:float 6s ease-in-out infinite;background-image:radial-gradient(circle at 20% 80%,#7877c64d 0,#0000 50%),radial-gradient(circle at 80% 20%,#ff77c64d 0,#0000 50%),radial-gradient(circle at 40% 40%,#78dbff4d 0,#0000 50%)}.game-hub>*{position:relative;z-index:1}.hub-header{margin-bottom:3rem;position:relative;text-align:center}.hub-header h1{-webkit-text-fill-color:#0000;animation:glow 3s ease-in-out infinite;background:linear-gradient(135deg,#fa709a,#fee140);background:var(--hub-gradient-gaming);-webkit-background-clip:text;background-clip:text;font-size:3.5rem;font-weight:900;margin-bottom:1rem;text-shadow:0 4px 8px #0000004d}.hub-subtitle{color:#212529;color:var(--hub-text-primary);font-size:1.3rem;font-weight:300;margin:0;text-shadow:0 2px 4px #0000004d}.games-grid{grid-gap:2rem;display:grid;gap:2rem;grid-template-columns:repeat(auto-fit,minmax(350px,1fr));margin-bottom:4rem}.game-card{-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);background:#ffffff1a;border:2px solid #fff3;border-radius:20px;box-shadow:0 8px 32px #0000001a,inset 0 1px 0 #fff3;cursor:pointer;display:flex;flex-direction:column;height:100%;overflow:hidden;padding:2rem;position:relative;transition:all .4s cubic-bezier(.175,.885,.32,1.275)}.game-card:before{background:linear-gradient(135deg,#4facfe,#00f2fe);background:var(--hub-gradient-accent);bottom:0;content:"";left:0;opacity:0;position:absolute;right:0;top:0;transition:opacity .3s ease;z-index:-1}.game-card:hover:not(.disabled){border-color:#fff6;box-shadow:0 20px 40px #0003,0 0 0 1px #ffffff4d,inset 0 1px 0 #fff6;transform:translateY(-8px) scale(1.02)}.game-card:hover:not(.disabled):before{opacity:.1}.game-card.disabled{cursor:not-allowed;filter:grayscale(50%);opacity:.5}.game-card.disabled:hover{box-shadow:0 8px 32px #0000001a;transform:none}.game-icon{align-items:center;animation:float 3s ease-in-out infinite;display:flex;filter:drop-shadow(0 4px 8px rgba(0,0,0,.3));font-size:4.5rem;height:100px;justify-content:center;margin-bottom:1.5rem;text-align:center}.game-info{flex:1 1;margin-bottom:1.5rem}.game-header{align-items:flex-start;display:flex;justify-content:space-between;margin-bottom:1rem}.game-name{font-size:1.8rem;font-weight:700;margin:0;text-shadow:0 2px 4px #0000004d}.game-description,.game-name{color:#212529;color:var(--hub-text-primary)}.game-description{line-height:1.6;margin-bottom:1.5rem;opacity:.9}.status-badge{border-radius:25px;box-shadow:0 4px 8px #0003;font-size:.75rem;font-weight:700;letter-spacing:1px;padding:.4rem 1rem;text-transform:uppercase}.status-badge.available{animation:glow 2s ease-in-out infinite;background:linear-gradient(135deg,#43e97b,#38f9d7);background:var(--hub-gradient-success);color:#fff}.status-badge.beta{background:linear-gradient(135deg,#f093fb,#f5576c);background:var(--hub-gradient-secondary);color:#fff}.status-badge.coming-soon{background:linear-gradient(135deg,#636363,#a2a2a2);color:#fff}.game-meta{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#ffffff0d;border-radius:12px;display:flex;flex-direction:column;gap:.75rem;padding:1rem}.meta-item{align-items:center;display:flex;justify-content:space-between}.meta-label{font-size:.9rem;opacity:.8}.meta-label,.meta-value{color:#212529;color:var(--hub-text-primary)}.meta-value{font-weight:600}.difficulty-easy{background:linear-gradient(135deg,#43e97b,#38f9d7);background:var(--hub-gradient-success);-webkit-background-clip:text;background-clip:text}.difficulty-easy,.difficulty-medium{-webkit-text-fill-color:#0000;font-weight:700}.difficulty-medium{background:linear-gradient(135deg,#f093fb,#f5576c);background:var(--hub-gradient-secondary);-webkit-background-clip:text;background-clip:text}.difficulty-hard{-webkit-text-fill-color:#0000;background:linear-gradient(135deg,#ff6b6b,#ee5a24);-webkit-background-clip:text;background-clip:text;font-weight:700}.game-actions{margin-top:auto;padding-top:1rem}.game-card .game-actions button{border-radius:12px;box-shadow:0 4px 15px #0003;font-weight:600;letter-spacing:.5px;padding:.75rem 1.5rem;text-transform:uppercase;transition:all .3s ease;width:100%}.game-card .game-actions button:not(:disabled):hover{box-shadow:0 8px 25px #0000004d;transform:translateY(-2px)}.hub-footer{grid-gap:3rem;border-top:2px solid #fff3;display:grid;gap:3rem;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));margin-top:4rem;padding-top:3rem}.hub-footer h3{color:#212529;color:var(--hub-text-primary);font-size:1.5rem;margin-bottom:1.5rem;text-shadow:0 2px 4px #0000004d}.legal-section{border-top:1px solid #ffffff1a;grid-column:1/-1;margin-top:2rem;padding-top:2rem;text-align:center}.legal-links{align-items:center;display:flex;flex-wrap:wrap;gap:1rem;justify-content:center;margin-bottom:1rem}.legal-link{background:#ffffff0d;border-radius:8px;color:#212529;color:var(--hub-text-primary);font-size:.95rem;opacity:.8;padding:.5rem 1rem;text-decoration:none;transition:all .3s ease}.legal-link:hover{background:#ffffff1a;opacity:1;text-decoration:none;transform:translateY(-2px)}.legal-separator{font-size:.8rem;opacity:.5}.copyright,.legal-separator{color:#212529;color:var(--hub-text-primary)}.copyright{font-size:.85rem;margin:0;opacity:.6}.stats-grid{grid-gap:1rem;display:grid;gap:1rem;grid-template-columns:repeat(3,1fr)}.stat-item{-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);background:#ffffff1a;border:1px solid #fff3;border-radius:16px;padding:1.5rem 1rem;text-align:center;transition:all .3s ease}.stat-item:hover{box-shadow:0 8px 25px #0003;transform:translateY(-4px)}.stat-number{-webkit-text-fill-color:#0000;background:linear-gradient(135deg,#4facfe,#00f2fe);background:var(--hub-gradient-accent);-webkit-background-clip:text;background-clip:text;display:block;font-size:2.5rem;font-weight:900;margin-bottom:.5rem}.stat-label{color:#212529;color:var(--hub-text-primary);font-size:.9rem;opacity:.9}.features-list{grid-gap:1rem;display:grid;gap:1rem}.feature-item{align-items:center;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);background:#ffffff1a;border:1px solid #fff3;border-radius:16px;display:flex;gap:1rem;padding:1.5rem;transition:all .3s ease}.feature-item:hover{box-shadow:0 8px 25px #0003;transform:translateX(8px)}.feature-icon{filter:drop-shadow(0 2px 4px rgba(0,0,0,.3));font-size:1.8rem;text-align:center;width:50px}@media (max-width:768px){.game-hub{padding:1rem .5rem}.hub-header h1{font-size:2.5rem}.hub-subtitle{font-size:1.1rem}.games-grid{gap:1.5rem;grid-template-columns:1fr}.game-card{padding:1.5rem}.game-icon{font-size:3.5rem;height:80px}.hub-footer,.stats-grid{grid-template-columns:1fr}.hub-footer{gap:2rem}}@media (max-width:480px){.hub-header h1{font-size:2rem}.game-header{gap:.5rem}.game-header,.meta-item{align-items:flex-start;flex-direction:column}.meta-item{gap:.25rem}.game-card{padding:1rem}}.login-prompt-overlay{align-items:center;animation:fadeIn .3s ease-out;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#0009;bottom:0;display:flex;justify-content:center;left:0;padding:1rem;position:fixed;right:0;top:0;z-index:2000}.login-prompt-modal{animation:slideInUp .4s cubic-bezier(.175,.885,.32,1.275);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);background:#fffffff2;border-radius:20px;box-shadow:0 20px 60px #0000004d,0 0 0 1px #fff3;max-height:90vh;max-width:480px;overflow-y:auto;width:100%}.login-prompt-header{border-bottom:1px solid #0000001a;padding:2rem 2rem 1rem;position:relative;text-align:center}.login-prompt-icon{animation:bounce 2s ease-in-out infinite;font-size:3rem;margin-bottom:1rem}.login-prompt-header h3{-webkit-text-fill-color:#0000;background:linear-gradient(135deg,#667eea,#764ba2);-webkit-background-clip:text;background-clip:text;color:#333;font-size:1.5rem;font-weight:700;margin:0}.login-prompt-close{background:none;border:none;border-radius:50%;color:#999;cursor:pointer;font-size:1.5rem;line-height:1;padding:.5rem;position:absolute;right:1rem;top:1rem;transition:all .2s ease}.login-prompt-close:hover{background:#0000001a;color:#666;transform:scale(1.1)}.login-prompt-content{padding:1.5rem 2rem}.login-prompt-message{color:#555;font-size:1.1rem;line-height:1.5;margin-bottom:1.5rem;text-align:center}.login-prompt-benefits{grid-gap:1rem;display:grid;gap:1rem;margin-bottom:1.5rem}.benefit-item{align-items:center;background:#667eea1a;border:1px solid #667eea33;border-radius:12px;display:flex;gap:1rem;padding:.75rem 1rem;transition:all .2s ease}.benefit-item:hover{background:#667eea26;transform:translateX(4px)}.benefit-icon{flex-shrink:0;font-size:1.2rem}.benefit-item span:last-child{color:#444;font-weight:500}.login-prompt-actions{padding:0 2rem 1.5rem}.login-btn-primary{background:linear-gradient(135deg,#667eea,#764ba2);border:none;border-radius:12px;box-shadow:0 4px 15px #667eea4d;color:#fff;cursor:pointer;font-size:1rem;font-weight:600;margin-bottom:1rem;padding:1rem;transition:all .3s ease;width:100%}.login-btn-primary:hover{box-shadow:0 8px 25px #667eea66;transform:translateY(-2px)}.login-prompt-secondary-actions{display:flex;gap:.5rem;justify-content:center}.login-btn-dismiss,.login-btn-postpone{background:none;border:1px solid #ddd;border-radius:8px;color:#666;cursor:pointer;font-size:.9rem;padding:.5rem 1rem;transition:all .2s ease}.login-btn-postpone:hover{background:#f8f9fa;border-color:#007bff;color:#007bff}.login-btn-dismiss:hover{background:#f8f9fa;border-color:#dc3545;color:#dc3545}.login-prompt-footer{padding:0 2rem 2rem;text-align:center}.login-prompt-footer p{color:#777;font-size:.9rem;font-style:italic;margin:0}@keyframes slideInUp{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}@keyframes bounce{0%,20%,50%,80%,to{transform:translateY(0)}40%{transform:translateY(-10px)}60%{transform:translateY(-5px)}}@media (prefers-color-scheme:dark){.login-prompt-modal{background:#1e1e1ef2;box-shadow:0 20px 60px #00000080,0 0 0 1px #ffffff1a}.login-prompt-header{border-bottom-color:#ffffff1a}.login-prompt-header h3{color:#e0e0e0}.login-prompt-close{color:#aaa}.login-prompt-close:hover{background:#ffffff1a;color:#ddd}.login-prompt-message{color:#ccc}.benefit-item{background:#667eea26;border-color:#667eea4d}.benefit-item:hover{background:#667eea33}.benefit-item span:last-child{color:#ddd}.login-btn-dismiss,.login-btn-postpone{border-color:#555;color:#ccc}.login-btn-postpone:hover{background:#333;border-color:#007bff;color:#007bff}.login-btn-dismiss:hover{background:#333;border-color:#dc3545;color:#dc3545}.login-prompt-footer p{color:#999}}@media (max-width:480px){.login-prompt-overlay{padding:.5rem}.login-prompt-modal{border-radius:16px}.login-prompt-header{padding:1.5rem 1.5rem 1rem}.login-prompt-content{padding:1rem 1.5rem}.login-prompt-actions,.login-prompt-footer{padding:0 1.5rem 1.5rem}.login-prompt-secondary-actions{flex-direction:column;gap:.75rem}.login-btn-dismiss,.login-btn-postpone{padding:.75rem;width:100%}}.auth-button{align-items:center;background:#0000;border:none;border-radius:20px;color:#212121;color:var(--text-primary,#212121);cursor:pointer;display:flex;font-family:inherit;font-size:14px;font-weight:500;gap:8px;height:40px;padding:8px 16px;transition:all .15s ease}.auth-button:hover{background:#0000000d}.auth-button:active{background:#0000001a}.auth-button:focus{outline:2px solid #4caf50;outline:2px solid var(--primary-green,#4caf50);outline-offset:2px}.auth-button-guest{color:#212121;color:var(--text-primary,#212121)}.auth-button-icon{font-size:18px;line-height:1}.auth-button-text{font-weight:500}.auth-button-authenticated{padding:4px 12px 4px 4px}.auth-button-avatar{align-items:center;border-radius:50%;color:#fff;display:flex;flex-shrink:0;font-size:14px;font-weight:700;height:32px;justify-content:center;-webkit-user-select:none;user-select:none;width:32px}.auth-button-name{font-weight:600;max-width:150px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.auth-button-dropdown-icon{font-size:10px;opacity:.6;transition:transform .15s ease}.auth-button:hover .auth-button-dropdown-icon{opacity:1}@media (max-width:767px){.auth-button{border-radius:18px;height:36px;padding:8px}.auth-button-guest{padding:8px}.auth-button-text{display:none}.auth-button-authenticated{padding:4px}.auth-button-avatar{font-size:12px;height:28px;width:28px}.auth-button-dropdown-icon,.auth-button-name{display:none}}@media (min-width:768px) and (max-width:1023px){.auth-button-name{max-width:120px}}@media (prefers-color-scheme:dark){.auth-button{color:#fff;color:var(--text-primary-dark,#fff)}.auth-button:hover{background:#ffffff1a}.auth-button:active{background:#ffffff26}}@media (prefers-contrast:high){.auth-button{border:2px solid}.auth-button:focus{outline-width:3px}}@media (prefers-reduced-motion:reduce){.auth-button,.auth-button-dropdown-icon{transition:none}}.email-signup-form{background:#fff;background:var(--background-white,#fff);border-radius:12px;box-shadow:0 4px 20px #00000026;max-width:400px;padding:24px;width:100%}.email-signup-back{background:#0000;border:none;color:#4caf50;color:var(--primary-green,#4caf50);cursor:pointer;font-size:14px;font-weight:500;margin-bottom:16px;padding:8px 0;transition:opacity .15s ease}.email-signup-back:hover:not(:disabled){opacity:.8}.email-signup-back:disabled{cursor:not-allowed;opacity:.5}.email-signup-title{color:#212121;color:var(--text-primary,#212121);font-size:24px;font-weight:700;margin:0 0 24px;text-align:center}.email-signup-field{margin-bottom:20px}.email-signup-label{color:#212121;color:var(--text-primary,#212121);display:block;font-size:14px;font-weight:500;margin-bottom:8px}.email-signup-input-wrapper{position:relative}.email-signup-input{background:#fff;background:var(--background-white,#fff);border:1px solid #e0e0e0;border:1px solid var(--border-light,#e0e0e0);border-radius:8px;box-sizing:border-box;color:#212121;color:var(--text-primary,#212121);font-size:14px;height:44px;padding:12px 40px 12px 12px;transition:all .15s ease;width:100%}.email-signup-input:focus{border:2px solid #4caf50;border:2px solid var(--primary-green,#4caf50);box-shadow:0 0 0 3px #4caf501a;outline:none;padding:11px 39px 11px 11px}.email-signup-input:disabled{background:#f5f5f5;cursor:not-allowed;opacity:.6}.email-signup-input-error{border-color:#f44336}.email-signup-input-error:focus{border-color:#f44336;box-shadow:0 0 0 3px #f443361a}.email-signup-input-success{border-color:#4caf50}.email-signup-toggle-password{background:#0000;border:none;cursor:pointer;font-size:18px;opacity:.6;padding:4px;position:absolute;right:12px;top:50%;transform:translateY(-50%);transition:opacity .15s ease}.email-signup-toggle-password:hover:not(:disabled){opacity:1}.email-signup-toggle-password:disabled{cursor:not-allowed}.email-signup-success{color:#4caf50}.email-signup-error,.email-signup-success{display:block;font-size:12px;margin-top:4px}.email-signup-error{color:#f44336}.email-signup-password-strength{margin-top:8px}.email-signup-password-strength-bar{background:#e0e0e0;border-radius:2px;height:4px;margin-bottom:4px;overflow:hidden;width:100%}.email-signup-password-strength-fill{border-radius:2px;height:100%;transition:width .3s ease,background-color .3s ease}.email-signup-password-strength-label{font-size:12px;font-weight:500}.email-signup-password-requirements{color:#757575;color:var(--text-secondary,#757575);font-size:12px;line-height:1.6;margin-top:8px}.email-signup-password-requirements .requirement-met{color:#4caf50}.email-signup-checkbox-field{margin-bottom:24px}.email-signup-checkbox-label{align-items:flex-start;color:#212121;color:var(--text-primary,#212121);cursor:pointer;display:flex;font-size:14px;gap:8px}.email-signup-checkbox-label input[type=checkbox]{cursor:pointer;flex-shrink:0;height:18px;margin-top:2px;width:18px}.email-signup-checkbox-label input[type=checkbox]:disabled{cursor:not-allowed}.email-signup-checkbox-label a{color:#4caf50;color:var(--primary-green,#4caf50);text-decoration:none}.email-signup-checkbox-label a:hover{text-decoration:underline}.email-signup-submit{background:#4caf50;background:var(--primary-green,#4caf50);border:none;border-radius:8px;color:#fff;cursor:pointer;font-size:16px;font-weight:600;height:48px;margin-bottom:16px;transition:all .15s ease;width:100%}.email-signup-submit:hover:not(:disabled){background:#45a049;box-shadow:0 2px 8px #4caf504d;transform:translateY(-1px)}.email-signup-submit:active:not(:disabled){transform:translateY(0)}.email-signup-submit:disabled{background:#9e9e9e;cursor:not-allowed;opacity:.6}.email-signup-footer{color:#757575;color:var(--text-secondary,#757575);font-size:14px;text-align:center}.email-signup-link{background:#0000;border:none;color:#4caf50;color:var(--primary-green,#4caf50);cursor:pointer;font-size:14px;font-weight:500;padding:0;text-decoration:none;transition:opacity .15s ease}.email-signup-link:hover:not(:disabled){opacity:.8;text-decoration:underline}.email-signup-link:disabled{cursor:not-allowed;opacity:.5}@media (max-width:768px){.email-signup-form{border-radius:0;box-shadow:none;max-width:100%;padding:20px}.email-signup-title{font-size:20px}.email-signup-input{font-size:16px}}@media (prefers-color-scheme:dark){.email-signup-form{background:#1e1e1e;background:var(--background-dark,#1e1e1e)}.email-signup-input,.email-signup-label,.email-signup-title{color:#fff;color:var(--text-primary,#fff)}.email-signup-input{background:#2c2c2c;border-color:#333}.email-signup-input:disabled{background:#1a1a1a}.email-signup-password-requirements{color:#b0b0b0;color:var(--text-secondary,#b0b0b0)}.email-signup-checkbox-label{color:#fff;color:var(--text-primary,#fff)}.email-signup-footer{color:#b0b0b0;color:var(--text-secondary,#b0b0b0)}}.email-login-form{background:#fff;background:var(--background-white,#fff);border-radius:12px;box-shadow:0 4px 20px #00000026;max-width:400px;padding:24px;width:100%}.email-login-back{background:#0000;border:none;color:#4caf50;color:var(--primary-green,#4caf50);cursor:pointer;font-size:14px;font-weight:500;margin-bottom:16px;padding:8px 0;transition:opacity .15s ease}.email-login-back:hover:not(:disabled){opacity:.8}.email-login-back:disabled{cursor:not-allowed;opacity:.5}.email-login-title{color:#212121;color:var(--text-primary,#212121);font-size:24px;font-weight:700;margin:0 0 24px;text-align:center}.email-login-field{margin-bottom:20px}.email-login-label{color:#212121;color:var(--text-primary,#212121);display:block;font-size:14px;font-weight:500;margin-bottom:8px}.email-login-input-wrapper{position:relative}.email-login-input{background:#fff;background:var(--background-white,#fff);border:1px solid #e0e0e0;border:1px solid var(--border-light,#e0e0e0);border-radius:8px;box-sizing:border-box;color:#212121;color:var(--text-primary,#212121);font-size:14px;height:44px;padding:12px 40px 12px 12px;transition:all .15s ease;width:100%}.email-login-input:focus{border:2px solid #4caf50;border:2px solid var(--primary-green,#4caf50);box-shadow:0 0 0 3px #4caf501a;outline:none;padding:11px 39px 11px 11px}.email-login-input:disabled{background:#f5f5f5;cursor:not-allowed;opacity:.6}.email-login-input-error{border-color:#f44336}.email-login-input-error:focus{border-color:#f44336;box-shadow:0 0 0 3px #f443361a}.email-login-toggle-password{background:#0000;border:none;cursor:pointer;font-size:18px;opacity:.6;padding:4px;position:absolute;right:12px;top:50%;transform:translateY(-50%);transition:opacity .15s ease}.email-login-toggle-password:hover:not(:disabled){opacity:1}.email-login-toggle-password:disabled{cursor:not-allowed}.email-login-error{color:#f44336;display:block;font-size:12px;margin-top:4px}.email-login-options{align-items:center;display:flex;justify-content:space-between;margin-bottom:24px}.email-login-checkbox-label{align-items:center;color:#212121;color:var(--text-primary,#212121);cursor:pointer;display:flex;font-size:14px;gap:8px}.email-login-checkbox-label input[type=checkbox]{cursor:pointer;height:18px;width:18px}.email-login-checkbox-label input[type=checkbox]:disabled{cursor:not-allowed}.email-login-forgot-link{background:#0000;border:none;color:#4caf50;color:var(--primary-green,#4caf50);cursor:pointer;font-size:14px;padding:0;text-decoration:none;transition:opacity .15s ease}.email-login-forgot-link:hover:not(:disabled){opacity:.8;text-decoration:underline}.email-login-forgot-link:disabled{cursor:not-allowed;opacity:.5}.email-login-submit{background:#4caf50;background:var(--primary-green,#4caf50);border:none;border-radius:8px;color:#fff;cursor:pointer;font-size:16px;font-weight:600;height:48px;margin-bottom:16px;transition:all .15s ease;width:100%}.email-login-submit:hover:not(:disabled){background:#45a049;box-shadow:0 2px 8px #4caf504d;transform:translateY(-1px)}.email-login-submit:active:not(:disabled){transform:translateY(0)}.email-login-submit:disabled{background:#9e9e9e;cursor:not-allowed;opacity:.6}.email-login-footer{color:#757575;color:var(--text-secondary,#757575);font-size:14px;text-align:center}.email-login-link{background:#0000;border:none;color:#4caf50;color:var(--primary-green,#4caf50);cursor:pointer;font-size:14px;font-weight:500;padding:0;text-decoration:none;transition:opacity .15s ease}.email-login-link:hover:not(:disabled){opacity:.8;text-decoration:underline}.email-login-link:disabled{cursor:not-allowed;opacity:.5}@media (max-width:768px){.email-login-form{border-radius:0;box-shadow:none;max-width:100%;padding:20px}.email-login-title{font-size:20px}.email-login-input{font-size:16px}.email-login-options{align-items:flex-start;flex-direction:column;gap:12px}}@media (prefers-color-scheme:dark){.email-login-form{background:#1e1e1e;background:var(--background-dark,#1e1e1e)}.email-login-input,.email-login-label,.email-login-title{color:#fff;color:var(--text-primary,#fff)}.email-login-input{background:#2c2c2c;border-color:#333}.email-login-input:disabled{background:#1a1a1a}.email-login-checkbox-label{color:#fff;color:var(--text-primary,#fff)}.email-login-footer{color:#b0b0b0;color:var(--text-secondary,#b0b0b0)}}.password-reset-form{background:#fff;background:var(--background-white,#fff);border-radius:12px;box-shadow:0 4px 20px #00000026;max-width:400px;padding:24px;width:100%}.password-reset-back{background:#0000;border:none;color:#4caf50;color:var(--primary-green,#4caf50);cursor:pointer;font-size:14px;font-weight:500;margin-bottom:16px;padding:8px 0;transition:opacity .15s ease}.password-reset-back:hover:not(:disabled){opacity:.8}.password-reset-back:disabled{cursor:not-allowed;opacity:.5}.password-reset-title{color:#212121;color:var(--text-primary,#212121);font-size:24px;font-weight:700;margin:0 0 16px;text-align:center}.password-reset-description{color:#757575;color:var(--text-secondary,#757575);font-size:14px;line-height:1.5;margin:0 0 24px;text-align:center}.password-reset-field{margin-bottom:24px}.password-reset-label{display:block;font-weight:500;margin-bottom:8px}.password-reset-input,.password-reset-label{color:#212121;color:var(--text-primary,#212121);font-size:14px}.password-reset-input{background:#fff;background:var(--background-white,#fff);border:1px solid #e0e0e0;border:1px solid var(--border-light,#e0e0e0);border-radius:8px;box-sizing:border-box;height:44px;padding:12px;transition:all .15s ease;width:100%}.password-reset-input:focus{border:2px solid #4caf50;border:2px solid var(--primary-green,#4caf50);box-shadow:0 0 0 3px #4caf501a;outline:none;padding:11px}.password-reset-input:disabled{background:#f5f5f5;cursor:not-allowed;opacity:.6}.password-reset-input-error{border-color:#f44336}.password-reset-input-error:focus{border-color:#f44336;box-shadow:0 0 0 3px #f443361a}.password-reset-error{color:#f44336;display:block;font-size:12px;margin-top:4px}.password-reset-submit{background:#4caf50;background:var(--primary-green,#4caf50);border:none;border-radius:8px;color:#fff;cursor:pointer;font-size:16px;font-weight:600;height:48px;margin-bottom:16px;transition:all .15s ease;width:100%}.password-reset-submit:hover:not(:disabled){background:#45a049;box-shadow:0 2px 8px #4caf504d;transform:translateY(-1px)}.password-reset-submit:active:not(:disabled){transform:translateY(0)}.password-reset-submit:disabled{background:#9e9e9e;cursor:not-allowed;opacity:.6}.password-reset-footer{color:#757575;color:var(--text-secondary,#757575);font-size:14px;text-align:center}.password-reset-link{background:#0000;border:none;color:#4caf50;color:var(--primary-green,#4caf50);cursor:pointer;font-size:14px;font-weight:500;padding:0;text-decoration:none;transition:opacity .15s ease}.password-reset-link:hover:not(:disabled){opacity:.8;text-decoration:underline}.password-reset-link:disabled{cursor:not-allowed;opacity:.5}.password-reset-success{text-align:center}.password-reset-success-icon{font-size:48px;margin-bottom:16px}.password-reset-success-title{color:#212121;color:var(--text-primary,#212121);font-size:24px;font-weight:700;margin:0 0 16px}.password-reset-success-message{color:#757575;color:var(--text-secondary,#757575);font-size:14px;margin:0 0 8px}.password-reset-success-email{color:#212121;color:var(--text-primary,#212121);font-size:16px;font-weight:600;margin:0 0 16px;word-break:break-word}.password-reset-success-note{color:#757575;color:var(--text-secondary,#757575);font-size:13px;margin:0 0 24px}.password-reset-success-actions{background:#f5f5f5;border-radius:8px;margin-bottom:24px;padding:16px}.password-reset-resend-text{color:#757575;color:var(--text-secondary,#757575);font-size:14px;margin:0 0 12px}.password-reset-resend-button{background:#0000;border:1px solid #4caf50;border:1px solid var(--primary-green,#4caf50);border-radius:6px;color:#4caf50;color:var(--primary-green,#4caf50);cursor:pointer;font-size:14px;font-weight:500;padding:8px 16px;transition:all .15s ease}.password-reset-resend-button:hover:not(:disabled){background:#4caf50;background:var(--primary-green,#4caf50);color:#fff}.password-reset-resend-button:disabled{cursor:not-allowed;opacity:.5}.password-reset-back-button{background:#0000;border:1px solid #e0e0e0;border:1px solid var(--border-light,#e0e0e0);border-radius:8px;color:#212121;color:var(--text-primary,#212121);cursor:pointer;font-size:14px;font-weight:500;height:44px;transition:all .15s ease;width:100%}.password-reset-back-button:hover:not(:disabled){background:#f5f5f5}.password-reset-back-button:disabled{cursor:not-allowed;opacity:.5}@media (max-width:768px){.password-reset-form{border-radius:0;box-shadow:none;max-width:100%;padding:20px}.password-reset-success-title,.password-reset-title{font-size:20px}.password-reset-input{font-size:16px}.password-reset-success-icon{font-size:40px}}@media (prefers-color-scheme:dark){.password-reset-form{background:#1e1e1e;background:var(--background-dark,#1e1e1e)}.password-reset-success-email,.password-reset-success-title,.password-reset-title{color:#fff;color:var(--text-primary,#fff)}.password-reset-description,.password-reset-resend-text,.password-reset-success-message,.password-reset-success-note{color:#b0b0b0;color:var(--text-secondary,#b0b0b0)}.password-reset-input,.password-reset-label{color:#fff;color:var(--text-primary,#fff)}.password-reset-input{background:#2c2c2c;border-color:#333}.password-reset-input:disabled{background:#1a1a1a}.password-reset-footer{color:#b0b0b0;color:var(--text-secondary,#b0b0b0)}.password-reset-success-actions{background:#2c2c2c}.password-reset-back-button{border-color:#333;color:#fff;color:var(--text-primary,#fff)}.password-reset-back-button:hover:not(:disabled){background:#2c2c2c}}.auth-menu-backdrop{animation:fadeIn .2s ease-out;background:#00000080;bottom:0;left:0;position:fixed;right:0;top:0;z-index:999}.auth-menu-backdrop-mobile{background:#0009}.auth-menu{background:#fff;border-radius:12px;box-shadow:0 4px 20px #00000026;max-height:600px;overflow-y:auto;position:fixed;z-index:1000}.auth-menu-desktop{animation:slideDown .2s ease-out;right:16px;top:60px;width:320px}.auth-menu-mobile{animation:slideUp .3s ease-out;border-radius:16px 16px 0 0;bottom:0;left:0;max-height:80vh;padding-bottom:env(safe-area-inset-bottom);right:0;width:100%}.auth-menu-drag-handle{cursor:grab;display:flex;justify-content:center;padding:12px 0}.auth-menu-drag-bar{background:#bdbdbd;border-radius:2px;height:4px;width:40px}.auth-menu-title{color:#212121;color:var(--text-primary,#212121);font-size:18px;font-weight:700;line-height:24px;margin:0;padding:16px 16px 12px}.auth-menu-content{padding:0 16px 16px}.auth-menu-button{align-items:center;background:#fff;border:1px solid #e0e0e0;border-radius:8px;color:#212121;color:var(--text-primary,#212121);cursor:pointer;display:flex;font-family:inherit;font-size:14px;font-weight:500;gap:12px;height:44px;margin:8px 0;padding:0 12px;transition:all .15s ease;width:100%}.auth-menu-button:hover{box-shadow:0 2px 8px #0000001a;transform:translateY(-1px)}.auth-menu-button:active{transform:translateY(0)}.auth-menu-button:focus{outline:2px solid #4caf50;outline:2px solid var(--primary-green,#4caf50);outline-offset:2px}.auth-menu-button-icon{align-items:center;display:flex;flex-shrink:0;font-size:20px;font-weight:700;height:24px;justify-content:center;line-height:1;width:24px}.auth-menu-button-google .auth-menu-button-icon{color:#4285f4;font-family:Product Sans,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;font-size:22px;font-weight:700}.auth-menu-button-facebook .auth-menu-button-icon{color:#1877f2;font-family:Klavika,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;font-size:24px;font-style:italic;font-weight:700}.auth-menu-button-apple .auth-menu-button-icon{color:#000;font-size:20px;font-weight:400}.auth-menu-button-yahoo .auth-menu-button-icon{color:#6001d2;font-family:Arial Black,Arial,sans-serif;font-size:18px;font-weight:900;letter-spacing:-1px}.auth-menu-button-text{flex:1 1;text-align:left}.auth-menu-button-arrow{flex-shrink:0;font-size:16px;opacity:.5}.auth-menu-button-google{border-color:#4285f4;color:#4285f4}.auth-menu-button-google:hover{background:#4285f41a;border-color:#4285f4}.auth-menu-button-facebook{border-color:#1877f2;color:#1877f2}.auth-menu-button-facebook:hover{background:#1877f21a;border-color:#1877f2}.auth-menu-button-apple{border-color:#000;color:#000}.auth-menu-button-apple:hover{background:#0000000d;border-color:#000}.auth-menu-button-yahoo{border-color:#6001d2;color:#6001d2}.auth-menu-button-yahoo:hover{background:#6001d21a;border-color:#6001d2}.auth-menu-button-custom{border-color:#ff6b6b;color:#ff6b6b}.auth-menu-button-custom:hover{background:#ff6b6b1a;border-color:#ff6b6b}.auth-menu-button-guest{border-color:#9e9e9e;color:#9e9e9e}.auth-menu-button-guest:hover{background:#9e9e9e1a;border-color:#9e9e9e}.auth-menu-button-login{border-color:#4caf50;color:#4caf50}.auth-menu-button-login:hover{background:#4caf501a;border-color:#4caf50}.auth-menu-divider{align-items:center;color:#757575;color:var(--text-secondary,#757575);display:flex;font-size:12px;font-weight:500;margin:16px 0}.auth-menu-divider:after,.auth-menu-divider:before{background:#e0e0e0;content:"";flex:1 1;height:1px}.auth-menu-divider span{padding:0 12px}.auth-menu-divider-line{background:#e0e0e0;height:1px;margin:12px 16px}.auth-menu-profile{padding:16px}.auth-menu-profile-info{display:flex;flex-direction:column;gap:4px}.auth-menu-profile-name{color:#212121;color:var(--text-primary,#212121);font-size:18px;font-weight:600;line-height:22px;margin:0}.auth-menu-profile-email{font-size:13px}.auth-menu-profile-auth,.auth-menu-profile-email{color:#757575;color:var(--text-secondary,#757575);line-height:16px;margin:0}.auth-menu-profile-auth{font-size:12px}.auth-menu-profile-member{color:#9e9e9e;color:var(--text-secondary,#9e9e9e);font-size:11px;line-height:14px;margin:4px 0 0}.auth-menu-item{align-items:center;background:#0000;border:none;border-radius:6px;color:#212121;color:var(--text-primary,#212121);cursor:pointer;display:flex;font-family:inherit;font-size:14px;font-weight:400;gap:12px;height:40px;margin:4px 0;padding:8px 12px;text-align:left;transition:background .15s ease;width:100%}.auth-menu-item:hover{background:#0000000d}.auth-menu-item:focus{outline:2px solid #4caf50;outline:2px solid var(--primary-green,#4caf50);outline-offset:2px}.auth-menu-item-icon{flex-shrink:0;font-size:20px;line-height:1}.auth-menu-item-text{flex:1 1}.auth-menu-logout{align-items:center;background:#0000;border:none;border-radius:6px;color:#f44336;cursor:pointer;display:flex;font-family:inherit;font-size:14px;font-weight:500;gap:12px;height:40px;margin:12px 0 0;padding:8px 12px;text-align:left;transition:background .15s ease;width:100%}.auth-menu-logout:hover{background:#f443361a}.auth-menu-logout:focus{outline:2px solid #f44336;outline-offset:2px}.auth-menu-cancel{background:#fff;border:1px solid #e0e0e0;border-radius:8px;color:#757575;color:var(--text-secondary,#757575);cursor:pointer;font-family:inherit;font-size:16px;font-weight:500;height:48px;margin:16px;transition:all .15s ease;width:calc(100% - 32px)}.auth-menu-cancel:hover{background:#0000000d}.auth-menu-cancel:active{background:#0000001a}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideDown{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}@keyframes slideUp{0%{opacity:0;transform:translateY(100%)}to{opacity:1;transform:translateY(0)}}@media (min-width:768px) and (max-width:1023px){.auth-menu-desktop{right:12px;width:300px}}@media (prefers-color-scheme:dark){.auth-menu{background:#1e1e1e;box-shadow:0 4px 20px #0000004d}.auth-menu-item,.auth-menu-profile-name,.auth-menu-title{color:#fff}.auth-menu-divider,.auth-menu-profile-auth,.auth-menu-profile-email{color:#b0b0b0}.auth-menu-profile-member{color:grey}.auth-menu-button{background:#2c2c2c;border-color:#333;color:#fff}.auth-menu-button:hover{background:#333}.auth-menu-button-apple .auth-menu-button-icon{color:#fff}.auth-menu-item:hover{background:#ffffff1a}.auth-menu-divider-line{background:#333}.auth-menu-cancel{background:#2c2c2c;border-color:#333;color:#b0b0b0}.auth-menu-cancel:hover{background:#333}}@media (prefers-reduced-motion:reduce){.auth-menu,.auth-menu-backdrop,.auth-menu-button{animation:none;transition:none}}.auth-menu::-webkit-scrollbar{width:8px}.auth-menu::-webkit-scrollbar-track{background:#0000}.auth-menu::-webkit-scrollbar-thumb{background:#bdbdbd;border-radius:4px}.auth-menu::-webkit-scrollbar-thumb:hover{background:#9e9e9e}@media (prefers-color-scheme:dark){.auth-menu::-webkit-scrollbar-thumb{background:#555}.auth-menu::-webkit-scrollbar-thumb:hover{background:#666}}.responsive-button{-webkit-tap-highlight-color:transparent;align-items:center;border:2px solid #0000;border-radius:8px;cursor:pointer;display:inline-flex;font-family:inherit;font-weight:500;justify-content:center;line-height:1;overflow:hidden;position:relative;text-decoration:none;transition:all var(--animation-normal) ease;-webkit-user-select:none;user-select:none}.responsive-button:focus-visible{outline:2px solid #3498db;outline-offset:2px}.responsive-button--disabled{cursor:not-allowed;opacity:.6;pointer-events:none}.responsive-button--small{font-size:var(--font-size-sm);min-height:var(--touch-target-min);min-width:var(--touch-target-min);padding:var(--spacing-xs) var(--spacing-sm)}.responsive-button--medium{font-size:var(--font-size-base);min-height:var(--touch-target-comfortable);min-width:var(--touch-target-comfortable);padding:var(--spacing-sm) var(--spacing-md)}.responsive-button--large{font-size:var(--font-size-lg);min-height:var(--touch-target-large);min-width:var(--touch-target-large);padding:var(--spacing-md) var(--spacing-lg)}.responsive-button--full-width{width:100%}.responsive-button--primary{background:linear-gradient(135deg,#3498db,#2980b9);border-color:#3498db;color:#fff}.responsive-button--primary:hover:not(.responsive-button--disabled){background:linear-gradient(135deg,#2980b9,#1f5f8b);border-color:#2980b9;box-shadow:0 4px 12px #3498db4d;transform:translateY(-1px)}.responsive-button--secondary{background:linear-gradient(135deg,#95a5a6,#7f8c8d);border-color:#95a5a6;color:#fff}.responsive-button--secondary:hover:not(.responsive-button--disabled){background:linear-gradient(135deg,#7f8c8d,#6c7b7d);border-color:#7f8c8d;box-shadow:0 4px 12px #95a5a64d;transform:translateY(-1px)}.responsive-button--outline{background:#0000;border-color:#3498db;color:#3498db}.responsive-button--outline:hover:not(.responsive-button--disabled){background:#3498db;box-shadow:0 4px 12px #3498db33;color:#fff;transform:translateY(-1px)}.responsive-button--ghost{background:#0000;border-color:#0000;color:#333}.responsive-button--ghost:hover:not(.responsive-button--disabled){background:#0000000d;transform:translateY(-1px)}@media (hover:none) and (pointer:coarse){.responsive-button:hover:not(.responsive-button--disabled){box-shadow:none;transform:none}.responsive-button:active:not(.responsive-button--disabled){transform:scale(.95);transition:all var(--animation-fast) ease}.responsive-button--small{min-height:var(--touch-target-comfortable);min-width:var(--touch-target-comfortable);padding:var(--spacing-sm) var(--spacing-md)}.responsive-button--medium{min-height:var(--touch-target-large);min-width:var(--touch-target-large)}.responsive-button:active:not(.responsive-button--disabled):after{animation:ripple var(--animation-normal) ease-out;background:radial-gradient(circle,#ffffff4d 0,#0000 70%);content:"";inset:0;pointer-events:none;position:absolute}}@keyframes ripple{0%{opacity:1;transform:scale(0)}to{opacity:0;transform:scale(1)}}.responsive-button__content{align-items:center;display:flex;gap:var(--spacing-xs);justify-content:center;position:relative;z-index:1}@media (max-width:480px){.responsive-button--large{font-size:var(--font-size-base);padding:var(--spacing-sm) var(--spacing-md)}}@media (prefers-contrast:high){.responsive-button,.responsive-button--outline{border-width:3px}}@media (prefers-reduced-motion:reduce){.responsive-button{transition:none}.responsive-button:active:not(.responsive-button--disabled),.responsive-button:hover:not(.responsive-button--disabled){transform:none}}@media (prefers-color-scheme:dark){.responsive-button--ghost{color:#ecf0f1}.responsive-button--ghost:hover:not(.responsive-button--disabled){background:#ffffff1a}}.notification-container{max-width:400px;pointer-events:none;position:fixed;width:100%;z-index:1000}.notification-container--top-right{right:var(--spacing-lg);top:var(--spacing-lg)}.notification-container--top-left{left:var(--spacing-lg);top:var(--spacing-lg)}.notification-container--bottom-right{bottom:var(--spacing-lg);right:var(--spacing-lg)}.notification-container--bottom-left{bottom:var(--spacing-lg);left:var(--spacing-lg)}.notification-container--top-center{left:50%;top:var(--spacing-lg);transform:translateX(-50%)}.notification-container--bottom-center{bottom:var(--spacing-lg);left:50%;transform:translateX(-50%)}.notification-container__header{display:flex;justify-content:flex-end;margin-bottom:var(--spacing-xs);pointer-events:auto}.notification-container__clear-all{background:#000000b3;border:none;border-radius:var(--border-radius-sm);color:#fff;cursor:pointer;font-size:var(--font-size-sm);padding:var(--spacing-xs) var(--spacing-sm);transition:background-color var(--animation-fast) ease}.notification-container__clear-all:hover{background:#000c}.notification-container__list{display:flex;flex-direction:column;gap:var(--spacing-sm)}.notification-item{word-wrap:break-word;align-items:flex-start;animation:slideIn var(--animation-normal) ease-out;background:#fff;border-left:4px solid #007bff;border-left:4px solid var(--notification-accent-color,#007bff);border-radius:var(--border-radius-md);box-shadow:0 4px 20px #00000026;display:flex;gap:var(--spacing-sm);max-width:100%;padding:var(--spacing-md);pointer-events:auto;position:relative}.notification-item--success{--notification-accent-color:#28a745;background:#f8fff9;border-left-color:#28a745}.notification-item--error{--notification-accent-color:#dc3545;background:#fff8f8;border-left-color:#dc3545}.notification-item--warning{--notification-accent-color:#ffc107;background:#fffef8;border-left-color:#ffc107}.notification-item--info{--notification-accent-color:#17a2b8;background:#f8feff;border-left-color:#17a2b8}.notification-item--turn-based{--notification-accent-color:#6f42c1;background:#faf9ff;border-left-color:#6f42c1}.notification-item--game-invite{--notification-accent-color:#fd7e14;background:#fff9f5;border-left-color:#fd7e14}.notification-item--game-result{--notification-accent-color:#20c997;background:#f8fffe;border-left-color:#20c997}.notification-item__icon{flex-shrink:0;font-size:1.25rem;margin-top:2px}.notification-item__content{flex:1 1;min-width:0}.notification-item__title{color:var(--text-primary);font-size:var(--font-size-md);font-weight:600;line-height:1.3;margin-bottom:var(--spacing-xs)}.notification-item__message{color:var(--text-secondary);font-size:var(--font-size-sm);line-height:1.4;margin-bottom:var(--spacing-sm)}.notification-item__actions{margin-top:var(--spacing-sm)}.notification-item__dismiss{align-items:center;background:none;border:none;border-radius:var(--border-radius-sm);color:var(--text-tertiary);cursor:pointer;display:flex;font-size:1.25rem;height:24px;justify-content:center;line-height:1;padding:var(--spacing-xs);position:absolute;right:var(--spacing-xs);top:var(--spacing-xs);transition:all var(--animation-fast) ease;width:24px}.notification-item__dismiss:hover{background:#0000001a;color:var(--text-primary)}@keyframes slideIn{0%{opacity:0;transform:translateX(100%)}to{opacity:1;transform:translateX(0)}}.notification-container--bottom-left .notification-item,.notification-container--top-left .notification-item{animation:slideInLeft var(--animation-normal) ease-out}@keyframes slideInLeft{0%{opacity:0;transform:translateX(-100%)}to{opacity:1;transform:translateX(0)}}.notification-container--top-center .notification-item{animation:slideInTop var(--animation-normal) ease-out}@keyframes slideInTop{0%{opacity:0;transform:translateY(-100%)}to{opacity:1;transform:translateY(0)}}.notification-container--bottom-center .notification-item{animation:slideInBottom var(--animation-normal) ease-out}@keyframes slideInBottom{0%{opacity:0;transform:translateY(100%)}to{opacity:1;transform:translateY(0)}}@media (max-width:768px){.notification-container{left:var(--spacing-sm)!important;max-width:calc(100vw - var(--spacing-md));right:var(--spacing-sm)!important;transform:none!important}.notification-container--top-center,.notification-container--top-left,.notification-container--top-right{top:var(--spacing-md)}.notification-container--bottom-center,.notification-container--bottom-left,.notification-container--bottom-right{bottom:var(--spacing-md)}.notification-item{padding:var(--spacing-sm)}.notification-item,.notification-item__title{font-size:var(--font-size-sm)}.notification-item__message{font-size:var(--font-size-xs)}}@media (prefers-reduced-motion:reduce){.notification-item{animation:fadeIn var(--animation-normal) ease-out}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}}@media (prefers-contrast:high){.notification-item{border:2px solid #007bff;border:2px solid var(--notification-accent-color,#007bff);box-shadow:0 2px 8px #0000004d}.notification-item__dismiss{border:1px solid var(--text-tertiary)}}@media (prefers-color-scheme:dark){.notification-item{background:#2d3748;box-shadow:0 4px 20px #0000004d;color:#e2e8f0}.notification-item--success{background:#1a2e1a}.notification-item--error{background:#2e1a1a}.notification-item--warning{background:#2e2a1a}.notification-item--info{background:#1a252e}.notification-item--turn-based{background:#221a2e}.notification-item--game-invite{background:#2e221a}.notification-item--game-result{background:#1a2e26}.notification-item__title{color:#f7fafc}.notification-item__message{color:#cbd5e0}.notification-container__clear-all{background:#ffffff1a;color:#e2e8f0}.notification-container__clear-all:hover{background:#fff3}}.responsive-layout{margin:0 auto;width:100%}.responsive-layout--xs{max-width:var(--container-xs)}.responsive-layout--sm{max-width:var(--container-sm)}.responsive-layout--md{max-width:var(--container-md)}.responsive-layout--lg{max-width:var(--container-lg)}.responsive-layout--xl{max-width:var(--container-xl)}.responsive-layout--padding-none .responsive-layout__content{padding:0}.responsive-layout--padding-sm .responsive-layout__content{padding:var(--spacing-sm)}.responsive-layout--padding-md .responsive-layout__content{padding:var(--spacing-md)}.responsive-layout--padding-lg .responsive-layout__content{padding:var(--spacing-lg)}.responsive-layout--padding-xl .responsive-layout__content{padding:var(--spacing-xl)}.responsive-layout--centered{align-items:center;display:flex;justify-content:center}.responsive-layout--full-height{min-height:100vh;min-height:-webkit-fill-available}.responsive-layout__content{width:100%}.responsive-grid{display:grid;width:100%}.responsive-grid--gap-sm{gap:var(--spacing-sm)}.responsive-grid--gap-md{gap:var(--spacing-md)}.responsive-grid--gap-lg{gap:var(--spacing-lg)}.responsive-grid--gap-xl{gap:var(--spacing-xl)}.responsive-grid--xs-1{grid-template-columns:1fr}.responsive-grid--xs-2{grid-template-columns:repeat(2,1fr)}.responsive-grid--xs-3{grid-template-columns:repeat(3,1fr)}.responsive-grid--xs-4{grid-template-columns:repeat(4,1fr)}@media (min-width:480px){.responsive-grid--sm-1{grid-template-columns:1fr}.responsive-grid--sm-2{grid-template-columns:repeat(2,1fr)}.responsive-grid--sm-3{grid-template-columns:repeat(3,1fr)}.responsive-grid--sm-4{grid-template-columns:repeat(4,1fr)}}@media (min-width:768px){.responsive-grid--md-1{grid-template-columns:1fr}.responsive-grid--md-2{grid-template-columns:repeat(2,1fr)}.responsive-grid--md-3{grid-template-columns:repeat(3,1fr)}.responsive-grid--md-4{grid-template-columns:repeat(4,1fr)}}@media (min-width:1024px){.responsive-grid--lg-1{grid-template-columns:1fr}.responsive-grid--lg-2{grid-template-columns:repeat(2,1fr)}.responsive-grid--lg-3{grid-template-columns:repeat(3,1fr)}.responsive-grid--lg-4{grid-template-columns:repeat(4,1fr)}}@media (min-width:1200px){.responsive-grid--xl-1{grid-template-columns:1fr}.responsive-grid--xl-2{grid-template-columns:repeat(2,1fr)}.responsive-grid--xl-3{grid-template-columns:repeat(3,1fr)}.responsive-grid--xl-4{grid-template-columns:repeat(4,1fr)}}.responsive-stack{display:flex;width:100%}.responsive-stack--column{flex-direction:column}.responsive-stack--row{flex-direction:row}.responsive-stack--gap-sm{gap:var(--spacing-sm)}.responsive-stack--gap-md{gap:var(--spacing-md)}.responsive-stack--gap-lg{gap:var(--spacing-lg)}.responsive-stack--gap-xl{gap:var(--spacing-xl)}.responsive-stack--align-start{align-items:flex-start}.responsive-stack--align-center{align-items:center}.responsive-stack--align-end{align-items:flex-end}.responsive-stack--align-stretch{align-items:stretch}.responsive-stack--justify-start{justify-content:flex-start}.responsive-stack--justify-center{justify-content:center}.responsive-stack--justify-end{justify-content:flex-end}.responsive-stack--justify-between{justify-content:space-between}.responsive-stack--justify-around{justify-content:space-around}@media (min-width:480px){.responsive-stack--sm-row{flex-direction:row}}@media (min-width:768px){.responsive-stack--md-row{flex-direction:row}}@media (min-width:1024px){.responsive-stack--lg-row{flex-direction:row}}.responsive-navigation{background:#fff;border-bottom:1px solid #e0e0e0;position:relative;width:100%;z-index:100}.responsive-navigation__header{align-items:center;display:flex;justify-content:space-between;min-height:var(--touch-target-large);padding:var(--spacing-md);padding-left:calc(var(--spacing-md) + env(safe-area-inset-left));padding-right:calc(var(--spacing-md) + env(safe-area-inset-right));padding-top:calc(var(--spacing-md) + env(safe-area-inset-top))}.responsive-navigation__back-button{-webkit-tap-highlight-color:transparent;align-items:center;background:none;border:none;border-radius:8px;color:#333;cursor:pointer;display:flex;font-size:var(--font-size-xl);justify-content:center;min-height:var(--touch-target-min);min-width:var(--touch-target-min);transition:all var(--animation-normal) ease}.responsive-navigation__back-button:hover{background:#0000000d}.responsive-navigation__title{color:#333;flex:1 1;font-size:var(--font-size-lg);font-weight:600;margin:0;padding:0 var(--spacing-md);text-align:center}.responsive-navigation__menu-toggle{-webkit-tap-highlight-color:transparent;align-items:center;background:none;border:none;border-radius:8px;cursor:pointer;display:none;justify-content:center;min-height:var(--touch-target-min);min-width:var(--touch-target-min);transition:all var(--animation-normal) ease}.responsive-navigation__hamburger{display:flex;flex-direction:column;gap:3px;height:16px;width:20px}.responsive-navigation__hamburger span{background:#333;border-radius:1px;display:block;height:2px;transition:all var(--animation-normal) ease;width:100%}.responsive-navigation--menu-open .responsive-navigation__hamburger span:first-child{transform:rotate(45deg) translate(5px,5px)}.responsive-navigation--menu-open .responsive-navigation__hamburger span:nth-child(2){opacity:0}.responsive-navigation--menu-open .responsive-navigation__hamburger span:nth-child(3){transform:rotate(-45deg) translate(7px,-6px)}.responsive-navigation__menu{display:block}.responsive-navigation__list{display:flex;gap:var(--spacing-sm);list-style:none;margin:0;padding:0;padding:0 var(--spacing-md) var(--spacing-md)}.responsive-navigation__item{margin:0}.responsive-navigation__link{-webkit-tap-highlight-color:transparent;align-items:center;background:none;border:none;border-radius:8px;color:#666;cursor:pointer;display:flex;font-size:var(--font-size-sm);font-weight:500;gap:var(--spacing-xs);min-height:var(--touch-target-min);padding:var(--spacing-sm) var(--spacing-md);text-decoration:none;transition:all var(--animation-normal) ease}.responsive-navigation__link:hover:not(.responsive-navigation__link--disabled){background:#3498db1a;color:#3498db}.responsive-navigation__link--active{background:#3498db;color:#fff}.responsive-navigation__link--active:hover{background:#2980b9}.responsive-navigation__link--disabled{cursor:not-allowed;opacity:.5;pointer-events:none}.responsive-navigation__icon{font-size:var(--font-size-base)}.responsive-navigation__label{white-space:nowrap}.responsive-navigation__overlay{display:none}@media (max-width:768px){.responsive-navigation__menu-toggle{display:flex}.responsive-navigation__menu{background:#fff;border-bottom:1px solid #e0e0e0;box-shadow:0 4px 12px #0000001a;left:0;opacity:0;position:absolute;right:0;top:100%;transform:translateY(-100%);transition:all var(--animation-normal) ease;visibility:hidden;z-index:1000}.responsive-navigation--menu-open .responsive-navigation__menu{opacity:1;transform:translateY(0);visibility:visible}.responsive-navigation__list{flex-direction:column;gap:0;padding:var(--spacing-md)}.responsive-navigation__link{border-radius:12px;font-size:var(--font-size-base);justify-content:flex-start;min-height:var(--touch-target-comfortable);padding:var(--spacing-md);width:100%}.responsive-navigation__overlay{background:#00000080;bottom:0;display:block;left:0;position:fixed;right:0;top:0;z-index:999}}@media (hover:none) and (pointer:coarse){.responsive-navigation__back-button:active{background:#0000001a;transform:scale(.95)}.responsive-navigation__menu-toggle:active{background:#0000000d;transform:scale(.95)}.responsive-navigation__link:active:not(.responsive-navigation__link--disabled){transform:scale(.98)}}@media (orientation:landscape) and (max-height:600px){.responsive-navigation__header{min-height:var(--touch-target-min);padding:var(--spacing-sm) var(--spacing-md)}.responsive-navigation__title{font-size:var(--font-size-base)}.responsive-navigation__list{padding:var(--spacing-sm) var(--spacing-md)}.responsive-navigation__link{min-height:var(--touch-target-min);padding:var(--spacing-xs) var(--spacing-sm)}}@media (prefers-contrast:high){.responsive-navigation{border-bottom-width:2px}.responsive-navigation__link{border:1px solid #0000}.responsive-navigation__link--active{border-color:#fff}}@media (prefers-color-scheme:dark){.responsive-navigation{background:#2c3e50;border-bottom-color:#34495e}.responsive-navigation__back-button,.responsive-navigation__title{color:#ecf0f1}.responsive-navigation__hamburger span{background:#ecf0f1}.responsive-navigation__menu{background:#2c3e50;border-bottom-color:#34495e}.responsive-navigation__link{color:#bdc3c7}.responsive-navigation__link:hover:not(.responsive-navigation__link--disabled){background:#3498db33;color:#3498db}}.error-boundary{align-items:center;background:linear-gradient(135deg,#f5f7fa,#c3cfe2);display:flex;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;justify-content:center;min-height:100vh;padding:1rem}.error-boundary__container{background:#fff;border-radius:12px;box-shadow:0 10px 25px #0000001a;max-width:500px;padding:2rem;text-align:center;width:100%}.error-boundary__icon{color:#e74c3c;margin-bottom:1.5rem}.error-boundary__icon svg{height:64px;width:64px}.error-boundary__title{color:#2c3e50;font-size:1.5rem;font-weight:600;margin:0 0 1rem}.error-boundary__message{color:#7f8c8d;font-size:1rem;line-height:1.5;margin:0 0 1.5rem}.error-boundary__details{border:1px solid #ecf0f1;border-radius:6px;margin:1.5rem 0;overflow:hidden;text-align:left}.error-boundary__details summary{background:#f8f9fa;border-bottom:1px solid #ecf0f1;color:#495057;cursor:pointer;font-weight:500;padding:.75rem 1rem}.error-boundary__details summary:hover{background:#e9ecef}.error-boundary__error-info{background:#fafafa;color:#6c757d;font-size:.875rem;padding:1rem}.error-boundary__error-info p{margin:.5rem 0}.error-boundary__error-info strong{color:#495057}.error-boundary__actions{display:flex;flex-direction:column;gap:.75rem;margin-top:1.5rem}.error-boundary__button{border:none;border-radius:6px;cursor:pointer;display:inline-block;font-size:.875rem;font-weight:500;padding:.75rem 1.5rem;text-decoration:none;transition:all .2s ease}.error-boundary__button--primary{background:#3498db;color:#fff}.error-boundary__button--primary:hover{background:#2980b9;transform:translateY(-1px)}.error-boundary__button--secondary{background:#ecf0f1;color:#2c3e50}.error-boundary__button--secondary:hover{background:#d5dbdb;transform:translateY(-1px)}.error-boundary__help{background:#f8f9fa;border-radius:6px;margin-top:1.5rem;padding:1rem;text-align:left}.error-boundary__help p{color:#495057;font-weight:500;margin:0 0 .5rem}.error-boundary__help ul{color:#6c757d;margin:.5rem 0 0;padding-left:1.25rem}.error-boundary__help li{margin:.25rem 0}@media (max-width:768px){.error-boundary{padding:.5rem}.error-boundary__container{padding:1.5rem}.error-boundary__title{font-size:1.25rem}.error-boundary__actions{gap:.5rem}.error-boundary__button{font-size:.8125rem;padding:.625rem 1.25rem}}@media (prefers-color-scheme:dark){.error-boundary{background:linear-gradient(135deg,#2c3e50,#34495e)}.error-boundary__container{background:#34495e;color:#ecf0f1}.error-boundary__title{color:#ecf0f1}.error-boundary__message{color:#bdc3c7}.error-boundary__details{border-color:#4a5f7a}.error-boundary__details summary{background:#2c3e50;border-bottom-color:#4a5f7a;color:#ecf0f1}.error-boundary__details summary:hover{background:#34495e}.error-boundary__error-info{background:#2c3e50;color:#bdc3c7}.error-boundary__error-info strong{color:#ecf0f1}.error-boundary__button--secondary{background:#4a5f7a;color:#ecf0f1}.error-boundary__button--secondary:hover{background:#5a6f8a}.error-boundary__help{background:#2c3e50}.error-boundary__help p{color:#ecf0f1}.error-boundary__help ul{color:#bdc3c7}}
/*# sourceMappingURL=main.9b418e43.css.map*/