@import url(https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap);html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-tap-highlight-color:rgba(93,173,226,.2);background-color:#f0f2f5;background-color:var(--bg-primary);color:#1d2129;color:var(--text-primary);font-family:Inter,sans-serif;margin:0;overflow-x:hidden;transition:background-color .3s ease,color .3s ease}@supports (padding:env(safe-area-inset-top)){.app-shell{padding-left:env(safe-area-inset-left);padding-right:env(safe-area-inset-right)}}:root{--bg-primary:#f0f2f5;--bg-secondary:#fff;--bg-tertiary:#e9ebee;--text-primary:#1d2129;--text-secondary:#5c5e62;--accent-primary:#3498db;--accent-primary-hover:#2980b9;--border-color:#dcdfe3;--shadow-color:#00000014;--online-accent:#10b981;--danger-color:#ef4444;--board-light:#d1d5db;--board-dark:#6b7280}[data-theme=dark]{--bg-primary:#18191a;--bg-secondary:#242526;--bg-tertiary:#3a3b3c;--text-primary:#e4e6eb;--text-secondary:#b0b3b8;--accent-primary:#5dade2;--accent-primary-hover:#85c1e9;--border-color:#3a3b3c;--shadow-color:#00000040;--online-accent:#34d399;--danger-color:#f87171;--board-light:#4b5563;--board-dark:#1f2937}::-webkit-scrollbar{height:8px;width:8px}::-webkit-scrollbar-track{background:#0000}::-webkit-scrollbar-thumb{background-clip:content-box;background-color:#dcdfe3;background-color:var(--border-color);border:2px solid #0000;border-radius:4px}::-webkit-scrollbar-thumb:hover{background-color:#5c5e62;background-color:var(--text-secondary)}@media (max-width:768px){::-webkit-scrollbar{height:4px;width:4px}::-webkit-scrollbar-thumb{background-clip:padding-box}}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}@keyframes shimmer{0%{background-position:-200% 0}to{background-position:200% 0}}@keyframes scale-in{0%{opacity:0;transform:scale(.92)}to{opacity:1;transform:scale(1)}}@keyframes slide-in-right{0%{opacity:0;transform:translateX(20px)}to{opacity:1;transform:translateX(0)}}@keyframes slide-in-left{0%{opacity:0;transform:translateX(-20px)}to{opacity:1;transform:translateX(0)}}@keyframes bounce-in{0%{opacity:0;transform:scale(.8)}60%{opacity:1;transform:scale(1.05)}to{transform:scale(1)}}@keyframes shimmer-slide{0%{transform:translateX(-100%)}to{transform:translateX(100%)}}.animate-pulse{animation:pulse 2s cubic-bezier(.4,0,.6,1) infinite}.animate-shimmer{animation:shimmer 1.5s ease-in-out infinite;background:linear-gradient(90deg,#e9ebee 25%,#dcdfe3 50%,#e9ebee 75%);background:linear-gradient(90deg,var(--bg-tertiary) 25%,var(--border-color) 50%,var(--bg-tertiary) 75%);background-size:200% 100%}.skeleton{background-color:#dcdfe3;background-color:var(--border-color);border-radius:.25rem}.anim-delay-1{animation-delay:.1s}.anim-delay-2{animation-delay:.2s}.anim-delay-3{animation-delay:.3s}.anim-delay-4{animation-delay:.4s}.anim-delay-5{animation-delay:.5s}.mx-auto{margin-left:auto;margin-right:auto}.sk-body-loading{align-items:center;display:flex;flex-direction:column;gap:.75rem;grid-column:1/-1;padding:1rem 0 .5rem;width:100%}.sk-cp-carousel{flex-shrink:0;height:46px;width:46px}.sk-cp-icon{align-items:center;background:linear-gradient(135deg,#3498db,#5dade2);background:linear-gradient(135deg,var(--accent-primary),#5dade2);border-radius:14px;box-shadow:0 3px 12px #3498db4d;display:flex;height:46px;justify-content:center;overflow:hidden;position:relative;transition:transform .5s cubic-bezier(.34,1.56,.64,1);width:46px}.sk-cp-piece{color:#fff;filter:drop-shadow(0 2px 4px rgba(0,0,0,.2));font-size:1.5rem;line-height:1;position:relative;transition:transform .6s cubic-bezier(.34,1.56,.64,1);z-index:2}.sk-cp-glow{animation:cp-glow-pulse 2.5s ease-in-out infinite;background:radial-gradient(circle at 50% 50%,#ffffff40 0,#0000 60%);inset:-10px;opacity:0;pointer-events:none;position:absolute;z-index:1}@keyframes cp-glow-pulse{0%,to{opacity:0;transform:scale(.8)}50%{opacity:1;transform:scale(1.3)}}.cp-entering .sk-cp-piece{animation:cp-enter .6s cubic-bezier(.34,1.56,.64,1) forwards}.cp-idle .sk-cp-piece{animation:cp-idle 3s ease-in-out infinite}@keyframes cp-enter{0%{opacity:0;transform:translateY(-20px) scale(.5) rotate(-15deg)}60%{transform:translateY(6px) scale(1.15) rotate(5deg)}to{opacity:1;transform:translateY(0) scale(1) rotate(0deg)}}@keyframes cp-idle{0%,to{transform:translateY(0) rotate(0deg)}25%{transform:translateY(-3px) rotate(-2deg)}50%{transform:translateY(0) rotate(0deg)}75%{transform:translateY(-2px) rotate(2deg)}}.cp-king .sk-cp-piece{animation:cp-king-idle 4s ease-in-out infinite}.cp-queen .sk-cp-piece{animation:cp-queen-idle 3.5s ease-in-out infinite}.cp-rook .sk-cp-piece{animation:cp-rook-idle 3s ease-in-out infinite}.cp-bishop .sk-cp-piece{animation:cp-bishop-idle 3.2s ease-in-out infinite}.cp-knight .sk-cp-piece{animation:cp-knight-idle 2.5s ease-in-out infinite}.cp-pawn .sk-cp-piece{animation:cp-pawn-idle 2.8s ease-in-out infinite}@keyframes cp-king-idle{0%,to{transform:translateY(0) scale(1)}50%{transform:translateY(-5px) scale(1.03)}}@keyframes cp-queen-idle{0%,to{transform:translateY(0) rotate(0deg)}33%{transform:translateY(-3px) rotate(-3deg)}66%{transform:translateY(-1px) rotate(3deg)}}@keyframes cp-rook-idle{0%,to{transform:translateY(0)}50%{transform:translateY(-2px)}}@keyframes cp-bishop-idle{0%,to{transform:translateY(0) translateX(0)}25%{transform:translateY(-4px) translateX(2px)}75%{transform:translateY(-2px) translateX(-2px)}}@keyframes cp-knight-idle{0%,to{transform:translateY(0) rotate(0deg)}30%{transform:translateY(-6px) rotate(-8deg)}60%{transform:translateY(-2px) rotate(6deg)}}@keyframes cp-pawn-idle{0%,to{transform:translateY(0)}40%{transform:translateY(-4px)}80%{transform:translateY(-1px)}}.sk-progress-row{align-items:center;display:flex;gap:.75rem;max-width:460px;width:100%}.sk-progress-row .sk-progress-bar{flex:1 1}.sk-progress-bar{align-items:center;background:#e9ebee;background:var(--bg-tertiary);border:1px solid #dcdfe3;border:1px solid var(--border-color);border-radius:13px;display:flex;height:26px;justify-content:center;max-width:420px;overflow:hidden;position:relative;width:100%}.sk-progress-fill{background:linear-gradient(90deg,#3498db,#5dade2);background:linear-gradient(90deg,var(--accent-primary),#5dade2);border-radius:13px;inset:0;position:absolute;transition:width .4s cubic-bezier(.34,1.56,.64,1)}.sk-progress-label{color:#fff;font-size:.65rem;font-weight:700;letter-spacing:.03em;position:relative;text-shadow:0 1px 2px #00000040;z-index:1}.sk-pieces-steps{flex-wrap:wrap;gap:.75rem;justify-content:center}.sk-pieces-steps,.sk-ps-step{align-items:center;display:flex}.sk-ps-step{gap:.35rem;opacity:.4;transition:opacity .35s ease,transform .3s ease}.sk-ps-dot{align-items:center;background:#e9ebee;background:var(--bg-tertiary);border:2px solid #dcdfe3;border:2px solid var(--border-color);border-radius:50%;display:flex;height:22px;justify-content:center;position:relative;transition:all .35s ease;width:22px}.sk-ps-piece{animation:ps-piece-appear .4s ease-out forwards;filter:drop-shadow(0 1px 1px rgba(0,0,0,.15));font-size:.7rem;line-height:1;opacity:0}@keyframes ps-piece-appear{0%{opacity:0;transform:scale(0) rotate(-30deg)}60%{transform:scale(1.3) rotate(10deg)}to{opacity:1;transform:scale(1) rotate(0deg)}}.sk-ps-empty{background:#dcdfe3;background:var(--border-color);border-radius:50%;height:6px;transition:all .3s ease;width:6px}.ps-done{opacity:1}.ps-dot-done{background:#10b981;background:var(--online-accent);border-color:#10b981;border-color:var(--online-accent);box-shadow:0 0 6px #10b98159}.ps-dot-done .sk-ps-piece{color:#fff}.ps-current{opacity:1;transform:scale(1.05)}.ps-dot-current{animation:ps-dot-glow 1.3s ease-in-out infinite;border-color:#3498db;border-color:var(--accent-primary);box-shadow:0 0 10px #3498db73}.ps-dot-current .sk-ps-piece{color:#3498db;color:var(--accent-primary)}@keyframes ps-dot-glow{0%,to{box-shadow:0 0 6px #3498db4d}50%{box-shadow:0 0 14px #3498db99;transform:scale(1.1)}}.ps-dot-current .sk-ps-empty{background:#3498db;background:var(--accent-primary);box-shadow:0 0 6px #3498db66}.sk-ps-label{color:#1d2129;color:var(--text-primary);font-size:.6rem;font-weight:600;white-space:nowrap}.ps-done .sk-ps-label{color:#10b981;color:var(--online-accent)}.ps-current .sk-ps-label{color:#3498db;color:var(--accent-primary);font-weight:700}.sk-board-enchanted{aspect-ratio:1/1;background:#e9ebee;background:var(--bg-tertiary);border:1px solid #dcdfe3;border:1px solid var(--border-color);border-radius:6px;overflow:hidden;position:relative;width:100%}.sk-board-bg{background-image:linear-gradient(45deg,#6b7280 25%,#0000 0),linear-gradient(-45deg,#6b7280 25%,#0000 0),linear-gradient(45deg,#0000 75%,#6b7280 0),linear-gradient(-45deg,#0000 75%,#6b7280 0);background-image:linear-gradient(45deg,var(--board-dark) 25%,#0000 25%),linear-gradient(-45deg,var(--board-dark) 25%,#0000 25%),linear-gradient(45deg,#0000 75%,var(--board-dark) 75%),linear-gradient(-45deg,#0000 75%,var(--board-dark) 75%);background-position:0 0,0 6.25%,6.25% -6.25%,-6.25% 0;background-size:12.5% 12.5%;inset:0;opacity:.15;position:absolute}.sk-board-shimmer{animation:board-shimmer-drift 3.5s ease-in-out infinite;background:linear-gradient(90deg,#0000,#ffffff0a 30%,#ffffff14 50%,#ffffff0a 70%,#0000);background-size:200% 100%;inset:0;pointer-events:none;position:absolute;z-index:5}@keyframes board-shimmer-drift{0%{background-position:-200% 0}to{background-position:200% 0}}.sk-board-pieces{inset:0;pointer-events:none;position:absolute;z-index:3}.sk-bp{animation-fill-mode:both;color:#5c5e62;color:var(--text-secondary);filter:drop-shadow(0 2px 4px rgba(0,0,0,.08));font-size:clamp(1.2rem,5vw,2.8rem);opacity:.12;position:absolute}[data-theme=dark] .sk-bp{opacity:.15}.sk-bp-king{animation:bp-drop-in .8s cubic-bezier(.34,1.56,.64,1) .1s both,bp-king-float 5s ease-in-out .9s infinite;left:42%;top:8%}.sk-bp-queen{animation:bp-drop-in .7s cubic-bezier(.34,1.56,.64,1) .25s both,bp-queen-float 4.5s ease-in-out .95s infinite;left:56%;top:6%}.sk-bp-rook{animation:bp-drop-in .6s cubic-bezier(.34,1.56,.64,1) .4s both,bp-rook-float 4s ease-in-out 1s infinite;left:72%;top:22%}.sk-bp-bishop{animation:bp-drop-in .75s cubic-bezier(.34,1.56,.64,1) .55s both,bp-bishop-float 5.5s ease-in-out 1.3s infinite;left:30%;top:38%}.sk-bp-knight{animation:bp-drop-in .5s cubic-bezier(.34,1.56,.64,1) .7s both,bp-knight-float 3s ease-in-out 1.2s infinite;left:58%;top:52%}.sk-bp-pawn{animation:bp-drop-in .6s cubic-bezier(.34,1.56,.64,1) .85s both,bp-pawn-float 3.5s ease-in-out 1.45s infinite;left:16%;top:68%}.sk-bp-bk{animation:bp-drop-in .9s cubic-bezier(.34,1.56,.64,1) .15s both,bp-king-float 5.5s ease-in-out 1s infinite;left:46%;top:75%}.sk-bp-bk,.sk-bp-bq{color:#1d2129;color:var(--text-primary)}.sk-bp-bq{animation:bp-drop-in .65s cubic-bezier(.34,1.56,.64,1) .3s both,bp-queen-float 5s ease-in-out 1.1s infinite;left:12%;top:14%}.sk-bp-br{animation:bp-drop-in .7s cubic-bezier(.34,1.56,.64,1) .45s both,bp-rook-float 4.5s ease-in-out 1.3s infinite;left:48%;top:30%}.sk-bp-bb,.sk-bp-br{color:#1d2129;color:var(--text-primary)}.sk-bp-bb{animation:bp-drop-in .55s cubic-bezier(.34,1.56,.64,1) .6s both,bp-bishop-float 6s ease-in-out 1.4s infinite;left:74%;top:45%}.sk-bp-bn{animation:bp-drop-in .8s cubic-bezier(.34,1.56,.64,1) .75s both,bp-knight-float 3.5s ease-in-out 1.5s infinite;left:38%;top:60%}.sk-bp-bn,.sk-bp-bp2{color:#1d2129;color:var(--text-primary)}.sk-bp-bp2{animation:bp-drop-in .5s cubic-bezier(.34,1.56,.64,1) .9s both,bp-pawn-float 4s ease-in-out 1.6s infinite;left:64%;top:82%}@keyframes bp-drop-in{0%{opacity:0;transform:translateY(-60px) scale(.3)}50%{opacity:1;transform:translateY(8px) scale(1.1)}70%{transform:translateY(-4px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes bp-king-float{0%,to{transform:translateY(0) scale(1)}50%{transform:translateY(-6px) scale(1.02)}}@keyframes bp-queen-float{0%,to{transform:translateY(0) rotate(0deg)}33%{transform:translateY(-4px) rotate(-2deg)}66%{transform:translateY(-2px) rotate(2deg)}}@keyframes bp-rook-float{0%,to{transform:translateY(0)}50%{transform:translateY(-3px)}}@keyframes bp-bishop-float{0%,to{transform:translateY(0) translateX(0)}25%{transform:translateY(-5px) translateX(3px)}75%{transform:translateY(-2px) translateX(-3px)}}@keyframes bp-knight-float{0%,to{transform:translateY(0) rotate(0deg)}25%{transform:translateY(-7px) rotate(-6deg)}50%{transform:translateY(-3px) rotate(4deg)}75%{transform:translateY(-5px) rotate(-2deg)}}@keyframes bp-pawn-float{0%,to{transform:translateY(0)}40%{transform:translateY(-5px)}80%{transform:translateY(-2px)}}.sk-section{opacity:.4;transform:scale(.97);transition:opacity .4s ease,transform .4s ease;width:100%}.sk-section.sk-section-active{opacity:1;transform:scale(1)}.sk-online-status{align-items:center;background:#fff;background:var(--bg-secondary);border:1px solid #dcdfe3;border:1px solid var(--border-color);border-radius:10px;display:flex;gap:1rem;justify-content:center;margin-bottom:1rem;padding:.75rem 1rem}.sk-puzzle-info{display:flex;flex-direction:column;gap:.75rem;padding:1.25rem}.sk-puzzle-solution,.sk-puzzle-stats{display:flex;gap:.5rem}.sk-puzzle-solution{flex-direction:column;padding:1.25rem}@media (max-width:639px){.sk-progress-bar{height:22px;max-width:100%}.sk-progress-label{font-size:.55rem}.sk-steps{gap:.4rem}.sk-step-label{font-size:.5rem;white-space:normal}.sk-puzzle-stats{flex-direction:column}}.sk-transition-wrap{min-height:100vh;position:relative}.sk-fade-layer{opacity:1;transition:opacity .3s cubic-bezier(.22,1,.36,1)}.sk-fade-out{opacity:0;pointer-events:none}.sk-entering-content{opacity:0;transition:opacity .3s cubic-bezier(.22,1,.36,1)}.sk-entering-content.sk-crossfade{opacity:1}.sk-landing-wrap{min-height:100vh;position:relative}.sk-landing-overlay{background:#f0f2f5;background:var(--bg-primary);inset:0;opacity:1;overflow-y:auto;position:absolute;transition:opacity .45s cubic-bezier(.22,1,.36,1);z-index:10}.sk-landing-overlay.sk-exit{opacity:0;pointer-events:none}.sk-landing-content{opacity:0;transition:opacity .45s cubic-bezier(.22,1,.36,1)}.sk-landing-content.sk-crossfade{opacity:1}@media (prefers-reduced-motion:reduce){.sk-entering-content,.sk-fade-layer,.sk-landing-content,.sk-landing-overlay{opacity:1;transition:none}.sk-fade-out,.sk-landing-overlay.sk-exit{opacity:0}.sk-entering-content.sk-crossfade,.sk-landing-content.sk-crossfade{opacity:1}.sk-progress-fill{transition:none}.sk-section{opacity:1!important;transform:none!important;transition:none!important}.sk-cp-glow,.sk-cp-icon,.sk-cp-icon .sk-cp-piece,.sk-ps-dot{animation:none!important}.sk-bp,.sk-bp-bb,.sk-bp-bishop,.sk-bp-bk,.sk-bp-bn,.sk-bp-bp2,.sk-bp-bq,.sk-bp-br,.sk-bp-king,.sk-bp-knight,.sk-bp-pawn,.sk-bp-queen,.sk-bp-rook{animation:none!important;opacity:.15!important}.sk-board-shimmer{animation:none!important;opacity:.3}}:root{--toastify-color-light:#fff;--toastify-color-dark:#121212;--toastify-color-info:#3498db;--toastify-color-success:#07bc0c;--toastify-color-warning:#f1c40f;--toastify-color-error:#e74d3c;--toastify-color-transparent:#ffffffb3;--toastify-icon-color-info:var(--toastify-color-info);--toastify-icon-color-success:var(--toastify-color-success);--toastify-icon-color-warning:var(--toastify-color-warning);--toastify-icon-color-error:var(--toastify-color-error);--toastify-container-width:fit-content;--toastify-toast-width:320px;--toastify-toast-offset:16px;--toastify-toast-top:max(var(--toastify-toast-offset),env(safe-area-inset-top));--toastify-toast-right:max(var(--toastify-toast-offset),env(safe-area-inset-right));--toastify-toast-left:max(var(--toastify-toast-offset),env(safe-area-inset-left));--toastify-toast-bottom:max(var(--toastify-toast-offset),env(safe-area-inset-bottom));--toastify-toast-background:#fff;--toastify-toast-padding:14px;--toastify-toast-min-height:64px;--toastify-toast-max-height:800px;--toastify-toast-bd-radius:6px;--toastify-toast-shadow:0px 4px 12px #0000001a;--toastify-font-family:sans-serif;--toastify-z-index:9999;--toastify-text-color-light:#757575;--toastify-text-color-dark:#fff;--toastify-text-color-info:#fff;--toastify-text-color-success:#fff;--toastify-text-color-warning:#fff;--toastify-text-color-error:#fff;--toastify-spinner-color:#616161;--toastify-spinner-color-empty-area:#e0e0e0;--toastify-color-progress-light:linear-gradient(90deg,#4cd964,#5ac8fa,#007aff,#34aadc,#5856d6,#ff2d55);--toastify-color-progress-dark:#bb86fc;--toastify-color-progress-info:var(--toastify-color-info);--toastify-color-progress-success:var(--toastify-color-success);--toastify-color-progress-warning:var(--toastify-color-warning);--toastify-color-progress-error:var(--toastify-color-error);--toastify-color-progress-bgo:0.2}.Toastify__toast-container{box-sizing:border-box;color:#fff;display:flex;flex-direction:column;position:fixed;-webkit-transform:translateZ(9999);-webkit-transform:translateZ(var(--toastify-z-index));width:-webkit-fit-content;width:fit-content;width:var(--toastify-container-width);z-index:9999;z-index:var(--toastify-z-index)}.Toastify__toast-container--top-left{left:max(16px,env(safe-area-inset-left));left:var(--toastify-toast-left);top:max(16px,env(safe-area-inset-top));top:var(--toastify-toast-top)}.Toastify__toast-container--top-center{align-items:center;left:50%;top:max(16px,env(safe-area-inset-top));top:var(--toastify-toast-top);transform:translateX(-50%)}.Toastify__toast-container--top-right{align-items:end;right:max(16px,env(safe-area-inset-right));right:var(--toastify-toast-right);top:max(16px,env(safe-area-inset-top));top:var(--toastify-toast-top)}.Toastify__toast-container--bottom-left{bottom:max(16px,env(safe-area-inset-bottom));bottom:var(--toastify-toast-bottom);left:max(16px,env(safe-area-inset-left));left:var(--toastify-toast-left)}.Toastify__toast-container--bottom-center{align-items:center;bottom:max(16px,env(safe-area-inset-bottom));bottom:var(--toastify-toast-bottom);left:50%;transform:translateX(-50%)}.Toastify__toast-container--bottom-right{align-items:end;bottom:max(16px,env(safe-area-inset-bottom));bottom:var(--toastify-toast-bottom);right:max(16px,env(safe-area-inset-right));right:var(--toastify-toast-right)}.Toastify__toast{--y:0px;align-items:center;border-radius:6px;border-radius:var(--toastify-toast-bd-radius);box-shadow:0 4px 12px #0000001a;box-shadow:var(--toastify-toast-shadow);box-sizing:border-box;display:flex;flex:1 1 auto;font-family:sans-serif;font-family:var(--toastify-font-family);margin-bottom:1rem;max-height:800px;max-height:var(--toastify-toast-max-height);min-height:64px;min-height:var(--toastify-toast-min-height);padding:14px;padding:var(--toastify-toast-padding);position:relative;touch-action:none;width:320px;width:var(--toastify-toast-width);word-break:break-word;z-index:0}@media only screen and (max-width:480px){.Toastify__toast-container{left:env(safe-area-inset-left);margin:0;width:100vw}.Toastify__toast-container--top-center,.Toastify__toast-container--top-left,.Toastify__toast-container--top-right{top:env(safe-area-inset-top);transform:translateX(0)}.Toastify__toast-container--bottom-center,.Toastify__toast-container--bottom-left,.Toastify__toast-container--bottom-right{bottom:env(safe-area-inset-bottom);transform:translateX(0)}.Toastify__toast-container--rtl{left:auto;right:env(safe-area-inset-right)}.Toastify__toast{--toastify-toast-width:100%;border-radius:0;margin-bottom:0}}.Toastify__toast-container[data-stacked=true]{width:320px;width:var(--toastify-toast-width)}@media only screen and (max-width:480px){.Toastify__toast-container[data-stacked=true]{width:100vw}}.Toastify__toast--stacked{position:absolute;transform:translate3d(0,var(--y),0) scale(var(--s));transition:transform .3s;width:100%}.Toastify__toast--stacked[data-collapsed] .Toastify__close-button,.Toastify__toast--stacked[data-collapsed] .Toastify__toast-body{transition:opacity .1s}.Toastify__toast--stacked[data-collapsed=false]{overflow:visible}.Toastify__toast--stacked[data-collapsed=true]:not(:last-child)>*{opacity:0}.Toastify__toast--stacked:after{bottom:100%;content:"";height:calc(var(--g)*1px);left:0;position:absolute;right:0}.Toastify__toast--stacked[data-pos=top]{top:0}.Toastify__toast--stacked[data-pos=bot]{bottom:0}.Toastify__toast--stacked[data-pos=bot].Toastify__toast--stacked:before{transform-origin:top}.Toastify__toast--stacked[data-pos=top].Toastify__toast--stacked:before{transform-origin:bottom}.Toastify__toast--stacked:before{bottom:0;content:"";height:100%;left:0;position:absolute;right:0;transform:scaleY(3);z-index:-1}.Toastify__toast--rtl{direction:rtl}.Toastify__toast--close-on-click{cursor:pointer}.Toastify__toast-icon{-webkit-margin-end:10px;display:flex;flex-shrink:0;margin-inline-end:10px;width:22px}.Toastify--animate{animation-duration:.5s;animation-fill-mode:both}.Toastify--animate-icon{animation-duration:.3s;animation-fill-mode:both}.Toastify__toast-theme--dark{background:#121212;background:var(--toastify-color-dark);color:#fff;color:var(--toastify-text-color-dark)}.Toastify__toast-theme--colored.Toastify__toast--default,.Toastify__toast-theme--light{background:#fff;background:var(--toastify-color-light);color:#757575;color:var(--toastify-text-color-light)}.Toastify__toast-theme--colored.Toastify__toast--info{background:#3498db;background:var(--toastify-color-info);color:#fff;color:var(--toastify-text-color-info)}.Toastify__toast-theme--colored.Toastify__toast--success{background:#07bc0c;background:var(--toastify-color-success);color:#fff;color:var(--toastify-text-color-success)}.Toastify__toast-theme--colored.Toastify__toast--warning{background:#f1c40f;background:var(--toastify-color-warning);color:#fff;color:var(--toastify-text-color-warning)}.Toastify__toast-theme--colored.Toastify__toast--error{background:#e74d3c;background:var(--toastify-color-error);color:#fff;color:var(--toastify-text-color-error)}.Toastify__progress-bar-theme--light{background:linear-gradient(90deg,#4cd964,#5ac8fa,#007aff,#34aadc,#5856d6,#ff2d55);background:var(--toastify-color-progress-light)}.Toastify__progress-bar-theme--dark{background:#bb86fc;background:var(--toastify-color-progress-dark)}.Toastify__progress-bar--info{background:#3498db;background:var(--toastify-color-progress-info)}.Toastify__progress-bar--success{background:#07bc0c;background:var(--toastify-color-progress-success)}.Toastify__progress-bar--warning{background:#f1c40f;background:var(--toastify-color-progress-warning)}.Toastify__progress-bar--error{background:#e74d3c;background:var(--toastify-color-progress-error)}.Toastify__progress-bar-theme--colored.Toastify__progress-bar--error,.Toastify__progress-bar-theme--colored.Toastify__progress-bar--info,.Toastify__progress-bar-theme--colored.Toastify__progress-bar--success,.Toastify__progress-bar-theme--colored.Toastify__progress-bar--warning{background:#ffffffb3;background:var(--toastify-color-transparent)}.Toastify__close-button{background:#0000;border:none;color:#fff;cursor:pointer;opacity:.7;outline:none;padding:0;position:absolute;right:6px;top:6px;transition:.3s ease;z-index:1}.Toastify__toast--rtl .Toastify__close-button{left:6px;right:auto}.Toastify__close-button--light{color:#000;opacity:.3}.Toastify__close-button>svg{fill:currentColor;height:16px;width:14px}.Toastify__close-button:focus,.Toastify__close-button:hover{opacity:1}@keyframes Toastify__trackProgress{0%{transform:scaleX(1)}to{transform:scaleX(0)}}.Toastify__progress-bar{bottom:0;height:100%;left:0;opacity:.7;position:absolute;transform-origin:left;width:100%;z-index:1}.Toastify__progress-bar--animated{animation:Toastify__trackProgress linear 1 forwards}.Toastify__progress-bar--controlled{transition:transform .2s}.Toastify__progress-bar--rtl{border-bottom-left-radius:0;left:auto;right:0;transform-origin:right}.Toastify__progress-bar--wrp{border-bottom-left-radius:6px;border-bottom-left-radius:var(--toastify-toast-bd-radius);border-bottom-right-radius:6px;border-bottom-right-radius:var(--toastify-toast-bd-radius);bottom:0;height:5px;left:0;overflow:hidden;position:absolute;width:100%}.Toastify__progress-bar--wrp[data-hidden=true]{opacity:0}.Toastify__progress-bar--bg{height:100%;opacity:.2;opacity:var(--toastify-color-progress-bgo);width:100%}.Toastify__spinner{animation:Toastify__spin .65s linear infinite;border:2px solid #e0e0e0;border-color:var(--toastify-spinner-color-empty-area);border-radius:100%;border-right-color:#616161;border-right-color:var(--toastify-spinner-color);box-sizing:border-box;height:20px;width:20px}@keyframes Toastify__bounceInRight{0%,60%,75%,90%,to{animation-timing-function:cubic-bezier(.215,.61,.355,1)}0%{opacity:0;transform:translate3d(3000px,0,0)}60%{opacity:1;transform:translate3d(-25px,0,0)}75%{transform:translate3d(10px,0,0)}90%{transform:translate3d(-5px,0,0)}to{transform:none}}@keyframes Toastify__bounceOutRight{20%{opacity:1;transform:translate3d(-20px,var(--y),0)}to{opacity:0;transform:translate3d(2000px,var(--y),0)}}@keyframes Toastify__bounceInLeft{0%,60%,75%,90%,to{animation-timing-function:cubic-bezier(.215,.61,.355,1)}0%{opacity:0;transform:translate3d(-3000px,0,0)}60%{opacity:1;transform:translate3d(25px,0,0)}75%{transform:translate3d(-10px,0,0)}90%{transform:translate3d(5px,0,0)}to{transform:none}}@keyframes Toastify__bounceOutLeft{20%{opacity:1;transform:translate3d(20px,var(--y),0)}to{opacity:0;transform:translate3d(-2000px,var(--y),0)}}@keyframes Toastify__bounceInUp{0%,60%,75%,90%,to{animation-timing-function:cubic-bezier(.215,.61,.355,1)}0%{opacity:0;transform:translate3d(0,3000px,0)}60%{opacity:1;transform:translate3d(0,-20px,0)}75%{transform:translate3d(0,10px,0)}90%{transform:translate3d(0,-5px,0)}to{transform:translateZ(0)}}@keyframes Toastify__bounceOutUp{20%{transform:translate3d(0,calc(var(--y) - 10px),0)}40%,45%{opacity:1;transform:translate3d(0,calc(var(--y) + 20px),0)}to{opacity:0;transform:translate3d(0,-2000px,0)}}@keyframes Toastify__bounceInDown{0%,60%,75%,90%,to{animation-timing-function:cubic-bezier(.215,.61,.355,1)}0%{opacity:0;transform:translate3d(0,-3000px,0)}60%{opacity:1;transform:translate3d(0,25px,0)}75%{transform:translate3d(0,-10px,0)}90%{transform:translate3d(0,5px,0)}to{transform:none}}@keyframes Toastify__bounceOutDown{20%{transform:translate3d(0,calc(var(--y) - 10px),0)}40%,45%{opacity:1;transform:translate3d(0,calc(var(--y) + 20px),0)}to{opacity:0;transform:translate3d(0,2000px,0)}}.Toastify__bounce-enter--bottom-left,.Toastify__bounce-enter--top-left{animation-name:Toastify__bounceInLeft}.Toastify__bounce-enter--bottom-right,.Toastify__bounce-enter--top-right{animation-name:Toastify__bounceInRight}.Toastify__bounce-enter--top-center{animation-name:Toastify__bounceInDown}.Toastify__bounce-enter--bottom-center{animation-name:Toastify__bounceInUp}.Toastify__bounce-exit--bottom-left,.Toastify__bounce-exit--top-left{animation-name:Toastify__bounceOutLeft}.Toastify__bounce-exit--bottom-right,.Toastify__bounce-exit--top-right{animation-name:Toastify__bounceOutRight}.Toastify__bounce-exit--top-center{animation-name:Toastify__bounceOutUp}.Toastify__bounce-exit--bottom-center{animation-name:Toastify__bounceOutDown}@keyframes Toastify__zoomIn{0%{opacity:0;transform:scale3d(.3,.3,.3)}50%{opacity:1}}@keyframes Toastify__zoomOut{0%{opacity:1}50%{opacity:0;transform:translate3d(0,var(--y),0) scale3d(.3,.3,.3)}to{opacity:0}}.Toastify__zoom-enter{animation-name:Toastify__zoomIn}.Toastify__zoom-exit{animation-name:Toastify__zoomOut}@keyframes Toastify__flipIn{0%{animation-timing-function:ease-in;opacity:0;transform:perspective(400px) rotateX(90deg)}40%{animation-timing-function:ease-in;transform:perspective(400px) rotateX(-20deg)}60%{opacity:1;transform:perspective(400px) rotateX(10deg)}80%{transform:perspective(400px) rotateX(-5deg)}to{transform:perspective(400px)}}@keyframes Toastify__flipOut{0%{transform:translate3d(0,var(--y),0) perspective(400px)}30%{opacity:1;transform:translate3d(0,var(--y),0) perspective(400px) rotateX(-20deg)}to{opacity:0;transform:translate3d(0,var(--y),0) perspective(400px) rotateX(90deg)}}.Toastify__flip-enter{animation-name:Toastify__flipIn}.Toastify__flip-exit{animation-name:Toastify__flipOut}@keyframes Toastify__slideInRight{0%{transform:translate3d(110%,0,0);visibility:visible}to{transform:translate3d(0,var(--y),0)}}@keyframes Toastify__slideInLeft{0%{transform:translate3d(-110%,0,0);visibility:visible}to{transform:translate3d(0,var(--y),0)}}@keyframes Toastify__slideInUp{0%{transform:translate3d(0,110%,0);visibility:visible}to{transform:translate3d(0,var(--y),0)}}@keyframes Toastify__slideInDown{0%{transform:translate3d(0,-110%,0);visibility:visible}to{transform:translate3d(0,var(--y),0)}}@keyframes Toastify__slideOutRight{0%{transform:translate3d(0,var(--y),0)}to{transform:translate3d(110%,var(--y),0);visibility:hidden}}@keyframes Toastify__slideOutLeft{0%{transform:translate3d(0,var(--y),0)}to{transform:translate3d(-110%,var(--y),0);visibility:hidden}}@keyframes Toastify__slideOutDown{0%{transform:translate3d(0,var(--y),0)}to{transform:translate3d(0,500px,0);visibility:hidden}}@keyframes Toastify__slideOutUp{0%{transform:translate3d(0,var(--y),0)}to{transform:translate3d(0,-500px,0);visibility:hidden}}.Toastify__slide-enter--bottom-left,.Toastify__slide-enter--top-left{animation-name:Toastify__slideInLeft}.Toastify__slide-enter--bottom-right,.Toastify__slide-enter--top-right{animation-name:Toastify__slideInRight}.Toastify__slide-enter--top-center{animation-name:Toastify__slideInDown}.Toastify__slide-enter--bottom-center{animation-name:Toastify__slideInUp}.Toastify__slide-exit--bottom-left,.Toastify__slide-exit--top-left{animation-duration:.3s;animation-name:Toastify__slideOutLeft;animation-timing-function:ease-in}.Toastify__slide-exit--bottom-right,.Toastify__slide-exit--top-right{animation-duration:.3s;animation-name:Toastify__slideOutRight;animation-timing-function:ease-in}.Toastify__slide-exit--top-center{animation-duration:.3s;animation-name:Toastify__slideOutUp;animation-timing-function:ease-in}.Toastify__slide-exit--bottom-center{animation-duration:.3s;animation-name:Toastify__slideOutDown;animation-timing-function:ease-in}@keyframes Toastify__spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}@keyframes fade-in-up{0%{opacity:0;transform:translateY(15px)}to{opacity:1;transform:translateY(0)}}.App{align-items:center;background-color:var(--bg-primary);box-sizing:border-box;display:flex;flex-direction:column;justify-content:flex-start;min-height:100vh;padding:25px}.App-header{margin-bottom:25px;text-align:center;width:100%}.App-header h1{color:var(--text-primary);font-size:2.2em;font-weight:700;margin:0}.App-body{grid-gap:25px;align-items:flex-start;display:grid;gap:25px;grid-template-areas:"evaluation chessboard controls" "opening movehistory movehistory";grid-template-columns:260px 1fr 260px;max-width:1300px;width:100%}.App-body.online-mode{grid-template-areas:"chessboard";grid-template-columns:1fr;justify-content:center;margin:0 auto;max-width:650px}.panel{animation:fade-in-up .5s ease-out forwards;background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:10px;box-shadow:0 2px 8px var(--shadow-color);opacity:0;padding:20px}.evaluation-section{align-items:stretch;background:none;border:none;box-shadow:none;display:flex;grid-area:evaluation;padding:0}.chessboard-container-wrapper{align-items:center;display:flex;grid-area:chessboard;justify-content:center;opacity:1;perspective:800px}.chessboard-container-wrapper.flip-flip-out{animation:board-flip-out .2s ease-in forwards}.chessboard-container-wrapper.flip-flip-out .chessboard-container{-webkit-backface-visibility:hidden;backface-visibility:hidden}.chessboard-container-wrapper.flip-flip-in{animation:board-flip-in .3s cubic-bezier(.16,1,.3,1) forwards}.chessboard-container-wrapper.flip-flip-in .chessboard-container{-webkit-backface-visibility:hidden;backface-visibility:hidden}@keyframes board-flip-out{0%{opacity:1;transform:perspective(800px) rotateY(0deg)}to{opacity:.2;transform:perspective(800px) rotateY(-90deg)}}@keyframes board-flip-in{0%{opacity:.2;transform:perspective(800px) rotateY(90deg)}to{opacity:1;transform:perspective(800px) rotateY(0deg)}}.chessboard-container{border-radius:6px;box-shadow:0 5px 20px var(--shadow-color);max-width:600px;overflow:hidden;width:100%}.controls{display:flex;flex-direction:column;gap:20px}.control-section{background-color:var(--bg-secondary);border:1px solid var(--border-color);border-radius:8px;padding:15px}.section-title{align-items:center;border-bottom:1px solid var(--border-color);color:var(--text-primary);display:flex;font-size:1.1em;font-weight:600;gap:10px;margin:0 0 15px;padding-bottom:10px}.section-title svg{color:var(--accent-primary)}.section-content{display:flex;flex-direction:column;gap:15px}.button-grid{grid-gap:10px;display:grid;gap:10px;grid-template-columns:1fr 1fr}.icon-button{-webkit-tap-highlight-color:transparent;align-items:center;background-color:var(--bg-tertiary);border:1px solid var(--border-color);border-radius:6px;color:var(--text-secondary);cursor:pointer;display:flex;font-size:.9em;font-weight:500;gap:8px;justify-content:center;padding:10px;position:relative;transition:all .2s ease;user-select:none;-webkit-user-select:none}.icon-button:hover{background-color:var(--bg-secondary);border-color:var(--accent-primary);color:var(--accent-primary)}.icon-button:active:not(:disabled){transform:scale(.95)}.icon-button:hover .shortcut-hint{display:inline-block}.icon-button:disabled{cursor:not-allowed;opacity:.5}.shortcut-hint{background:var(--accent-primary);border-radius:4px;color:#fff;display:none;font-family:Inter,sans-serif;font-size:.6em;font-weight:700;line-height:1.4;padding:1px 5px;pointer-events:none;position:absolute;right:-8px;top:-8px}.toggle-switch{align-items:center;display:flex;justify-content:space-between}.toggle-switch label{align-items:center;cursor:pointer;display:flex;gap:10px}.toggle-switch input{height:0;opacity:0;width:0}.slider{background-color:var(--border-color);border-radius:10px;height:20px;position:relative;transition:background-color .2s;width:40px}.slider:before{background-color:#fff;border-radius:50%;bottom:2px;content:"";height:16px;left:2px;position:absolute;transition:transform .2s;width:16px}input:checked+.slider{background-color:var(--accent-primary)}input:checked+.slider:before{transform:translateX(20px)}.control-group label{font-weight:500;margin-bottom:5px}input[type=range]{-webkit-appearance:none;background:var(--border-color);border-radius:4px;height:8px;opacity:.7;outline:none;transition:opacity .2s;width:100%}input[type=range]:hover{opacity:1}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;background:var(--accent-primary);border-radius:50%;cursor:pointer;height:18px;width:18px}input[type=range]::-moz-range-thumb{background:var(--accent-primary);border-radius:50%;cursor:pointer;height:18px;width:18px}.control-group select{-webkit-appearance:none;appearance:none;background-color:var(--bg-tertiary);background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none' stroke='%23B0B3B8' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");background-position:right 12px center;background-repeat:no-repeat;border:1px solid var(--border-color);border-radius:6px;box-sizing:border-box;color:var(--text-primary);cursor:pointer;font-size:.95em;padding:10px 12px;transition:border-color .2s,background-color .2s;width:100%}.control-group select:focus,.control-group select:hover{border-color:var(--accent-primary)}.control-group select:focus{outline:none}.button-primary,.button-secondary{border-radius:6px;cursor:pointer;font-family:inherit;font-size:.95em;font-weight:600;padding:10px 20px;transition:all .2s ease}.button-primary{background:linear-gradient(135deg,var(--accent-primary),var(--online-accent));border:none;color:#fff}.button-primary:hover{box-shadow:0 4px 14px #5dade259;transform:translateY(-1px)}.button-primary:active:not(:disabled){transform:translateY(0) scale(.97)}.button-secondary{background-color:var(--bg-tertiary);border:1px solid var(--border-color);color:var(--text-secondary)}.button-secondary:hover{background-color:var(--bg-secondary);border-color:var(--accent-primary);color:var(--accent-primary)}.button-secondary:active:not(:disabled){transform:scale(.97)}.promotion-overlay{align-items:center;animation:fade-in-up .2s ease-out;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);background:#0009;bottom:0;display:flex;justify-content:center;left:0;position:fixed;right:0;top:0;z-index:1000}.promotion-dialog{animation:lobby-slide-up .3s ease-out;background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:16px;box-shadow:0 8px 32px var(--shadow-color);max-width:360px;padding:24px;width:90%}.promotion-title{color:var(--text-primary);font-size:1.1em;font-weight:600;margin-bottom:20px;text-align:center}.promotion-choices{grid-gap:12px;display:grid;gap:12px;grid-template-columns:1fr 1fr}.promotion-btn{align-items:center;background:var(--bg-tertiary);border:2px solid var(--border-color);border-radius:12px;color:var(--text-primary);cursor:pointer;display:flex;flex-direction:column;font-family:inherit;font-size:2em;gap:8px;padding:16px 12px;transition:all .2s ease}.promotion-btn:hover{background:var(--bg-secondary);border-color:var(--accent-primary);box-shadow:0 4px 12px var(--shadow-color);transform:translateY(-2px)}.promotion-btn:focus-visible{border-color:var(--accent-primary);box-shadow:0 0 0 3px #5dade24d;outline:none}.promotion-label{color:var(--text-secondary);font-size:.45em;font-weight:600}.game-over-banner{align-items:center;animation:lobby-slide-up .3s ease-out;background:var(--bg-secondary);border:2px solid var(--accent-primary);border-radius:16px;box-shadow:0 8px 40px var(--shadow-color);box-sizing:border-box;display:flex;flex-direction:column;gap:16px;left:50%;max-width:calc(100vw - 32px);padding:28px 36px;position:fixed;text-align:center;top:50%;transform:translate(-50%,-50%);width:auto;z-index:999}.game-over-text{color:var(--text-primary);font-size:1.3em;font-weight:700;white-space:normal;word-break:break-word}.game-over-banner:before{background:#00000080;bottom:0;content:"";left:0;position:fixed;right:0;top:0;z-index:-1}.game-over-banner .button-primary,.game-over-banner .button-secondary{min-width:120px}.banner-action-btn{font-size:.9em!important;padding:8px 20px!important}.banner-action-btn:hover{transform:translateY(-1px)}.banner-action-btn:active:not(:disabled){transform:translateY(0) scale(.97)}.evaluation-section{animation:fade-in-up .5s ease-out 0s forwards}.chessboard-container-wrapper{animation:fade-in-up .5s ease-out .1s forwards}.controls{animation:fade-in-up .5s ease-out .2s forwards}.opening-explorer{animation:fade-in-up .5s ease-out .3s forwards;opacity:0}.move-history-panel{animation:fade-in-up .5s ease-out .4s forwards}@media (max-width:1100px) and (min-width:769px){.App{padding:20px}.App-body{gap:18px;grid-template-areas:"chessboard" "evaluation" "opening" "controls" "movehistory";grid-template-columns:1fr;max-width:520px}.chessboard-container{max-width:500px}.evaluation-section{max-width:100%}.control-section{padding:12px}.controls{gap:16px}}@media (max-width:768px){.App{padding:16px}.App-body{gap:16px;grid-template-areas:"chessboard" "evaluation" "opening" "controls" "movehistory";grid-template-columns:1fr;max-width:600px}.chessboard-container{max-width:100%}.controls{gap:14px}.control-section{padding:12px}.button-grid{gap:8px}.eval-bar-container{height:30px}.main-evaluation h2{font-size:2em}.game-over-banner{max-width:340px;padding:24px 20px;width:calc(100vw - 48px)}.game-over-text{font-size:1.1em}.promotion-dialog{padding:20px;width:95%}}@media (max-width:480px){.App{padding:10px}.App-body,.controls{gap:12px}.control-section{padding:10px}.section-title{font-size:.9em;margin:0 0 12px;padding-bottom:8px}.button-grid{gap:6px;grid-template-columns:1fr 1fr}.icon-button{font-size:.75em;gap:4px;padding:8px 6px}.icon-button span{font-size:.85em}.section-title{font-size:.95em}.promotion-choices{gap:8px;grid-template-columns:1fr 1fr}.promotion-btn{font-size:1.5em;padding:12px 8px}.online-status-bar{flex-direction:column;gap:8px;padding:10px}.online-status-info{font-size:.8em}.online-status-actions,.online-status-info{flex-wrap:wrap;justify-content:center}.online-btn-draw,.online-btn-leave,.online-btn-resign,.online-btn-takeback{font-size:.7em;padding:6px 10px}.move-history-panel{max-height:250px}.move-row{font-size:.75em}.game-over-banner{max-width:300px;padding:20px 16px;width:calc(100vw - 32px)}.game-over-text{font-size:1em}.shortcut-guide-card{padding:20px}.shortcut-guide-key{font-size:.75em;min-width:28px;padding:3px 8px}.shortcut-guide-action{font-size:.8em}}@media (max-height:500px) and (orientation:landscape){.App{padding:8px 16px}.App-body{gap:10px}.chessboard-container{max-width:50vh}.panel{padding:12px}.game-over-banner{max-width:280px;padding:16px}.eval-bar-container{height:20px}.move-history-panel{max-height:150px}}.reset-confirm-dialog{padding:16px;text-align:center}.reset-confirm-dialog h2{color:var(--text-primary);margin:0 0 12px}.reset-confirm-dialog p{color:var(--text-secondary);font-size:.9em;line-height:1.5;margin-bottom:20px}.reset-confirm-dialog .button-group{display:flex;gap:12px;justify-content:center}.button-danger{background:linear-gradient(135deg,#e53935,#c62828);border:none;border-radius:8px;color:#fff;cursor:pointer;font-size:.9em;font-weight:600;padding:10px 24px;transition:all .2s ease}.button-danger:hover{box-shadow:0 4px 12px #e5393566;transform:translateY(-1px)}.button-danger:active{transform:translateY(0)}.shortcut-guide-card{animation:lobby-slide-up .3s ease-out;background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:16px;max-width:380px;padding:28px 32px;width:90%}.shortcut-guide-title{align-items:center;color:var(--text-primary);display:flex;font-size:1.2em;font-weight:700;gap:10px;margin:0 0 20px}.shortcut-guide-title svg{color:var(--accent-primary)}.shortcut-guide-list{display:flex;flex-direction:column;gap:8px;margin-bottom:16px}.shortcut-guide-row{align-items:center;background:var(--bg-primary);border-radius:8px;display:flex;gap:14px;padding:8px 12px;transition:transform .15s ease}.shortcut-guide-row:hover{transform:translateX(4px)}.shortcut-guide-key{align-items:center;background:var(--bg-tertiary);border:1px solid var(--border-color);border-radius:6px;box-shadow:0 1px 3px var(--shadow-color);color:var(--accent-primary);display:inline-flex;font-family:Inter,monospace;font-size:.85em;font-weight:700;justify-content:center;min-width:36px;padding:4px 10px;text-align:center}.shortcut-guide-action{color:var(--text-primary);font-size:.9em;font-weight:500}.shortcut-guide-hint{color:var(--text-secondary);font-size:.8em;font-style:italic;margin:0 0 16px;text-align:center}.shortcut-guide-hint kbd{background:var(--bg-tertiary);border:1px solid var(--border-color);border-radius:4px;color:var(--accent-primary);display:inline;font-family:Inter,monospace;font-size:.9em;font-weight:700;padding:1px 6px}.shortcut-guide-actions{display:flex;justify-content:center}.shortcut-guide-actions button{padding:10px 32px}.App-header-nav{align-items:center;display:flex;gap:12px;margin:0 auto;max-width:1300px;width:100%}.nav-back-btn{align-items:center;display:inline-flex;font-size:.9em;gap:4px;height:40px;padding:0 16px}.nav-back-btn:hover{transform:translateX(-2px)}.nav-back-btn:active:not(:disabled){transform:translateX(-2px) scale(.97)}.nav-theme-btn{align-items:center;display:flex;flex-shrink:0;height:40px;justify-content:center;margin-left:auto;padding:0;width:40px}.nav-theme-btn:hover{transform:rotate(15deg)}.nav-theme-btn:active:not(:disabled){transform:rotate(15deg) scale(.95)}.error-boundary-fallback{animation:fade-in-up .3s ease-out forwards;background:var(--bg-secondary);border:1px solid var(--danger-color);border-radius:10px;flex-direction:column;gap:.75rem;min-height:200px;padding:2rem 1.5rem;text-align:center}.eb-icon,.error-boundary-fallback{align-items:center;display:flex;justify-content:center}.eb-icon{background:#ef44441a;border-radius:50%;color:var(--danger-color);height:52px;width:52px}.eb-title{color:var(--text-primary);font-size:1rem;font-weight:700;margin:0}.eb-message{color:var(--text-secondary);font-size:.85rem;line-height:1.5;margin:0;max-width:280px}.eb-retry-btn{align-items:center;background:var(--accent-primary);border:none;border-radius:8px;color:#fff;cursor:pointer;display:inline-flex;font-family:inherit;font-size:.85rem;font-weight:600;gap:.5rem;padding:.5rem 1.25rem;transition:all .2s ease}.eb-retry-btn:hover{box-shadow:0 4px 12px #5dade259;transform:translateY(-1px)}.eb-retry-btn:active:not(:disabled){transform:translateY(0) scale(.97)}.eb-retry-btn:focus-visible{outline:2px solid #fff;outline-offset:2px}@media (prefers-reduced-motion:reduce){.error-boundary-fallback{animation:none}}.page-enter{animation:page-enter .45s cubic-bezier(.16,1,.3,1) forwards;transform-origin:center top}@keyframes page-enter{0%{opacity:0;transform:translateY(18px) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes move-departure{0%{background:#9bc700b3;transform:scale(1)}40%{background:#9bc7004d;transform:scale(.92)}to{background:#9bc70069;transform:scale(1)}}@keyframes move-arrival{0%{background:#9bc70026;box-shadow:inset 0 0 0 0 #9bc70000}30%{background:#9bc700b3;box-shadow:inset 0 0 20px 4px #9bc70040}60%{background:#9bc70080;box-shadow:inset 0 0 10px 2px #9bc7001a;transform:scale(1.03)}to{background:#9bc70069;box-shadow:inset 0 0 0 0 #9bc70000;transform:scale(1)}}@media (prefers-reduced-motion:reduce){.page-enter{animation:none}@keyframes move-departure{0%{background:#9bc70069}to{background:#9bc70069}}@keyframes move-arrival{0%{background:#9bc70069}to{background:#9bc70069}}@keyframes board-flip-out{0%{opacity:1;transform:none}to{opacity:1;transform:none}}@keyframes board-flip-in{0%{opacity:1;transform:none}to{opacity:1;transform:none}}}.landing-skeleton{align-items:center;animation:landing-skeleton-fade .3s ease-out forwards;display:flex;flex-direction:column;max-width:900px;position:relative;width:100%;z-index:1}@keyframes landing-skeleton-fade{0%{opacity:0}to{opacity:1}}.landing-sk-block{animation:shimmer 1.5s ease-in-out infinite;background:linear-gradient(90deg,var(--bg-tertiary) 25%,var(--border-color) 50%,var(--bg-tertiary) 75%);background-size:200% 100%}.landing-sk-progress-row{align-items:center;display:flex;gap:.75rem;margin-bottom:1rem;max-width:520px;width:100%}.landing-sk-progress-row .landing-sk-progress-bar{flex:1 1}.landing-sk-progress-bar{align-items:center;background:var(--bg-tertiary);border:1px solid var(--border-color);border-radius:14px;display:flex;height:28px;justify-content:center;margin-bottom:1rem;max-width:480px;overflow:hidden;position:relative;width:100%}.landing-sk-progress-fill{background:linear-gradient(90deg,var(--accent-primary),#5dade2);border-radius:14px;inset:0;position:absolute;transition:width .35s cubic-bezier(.34,1.56,.64,1);will-change:width}.landing-sk-progress-label{color:#fff;font-size:.7rem;font-weight:700;letter-spacing:.03em;position:relative;text-shadow:0 1px 2px #00000040;transition:opacity .25s ease;z-index:1}.landing-sk-steps{align-items:center;display:flex;flex-wrap:wrap;gap:.75rem;justify-content:center;margin-bottom:2rem}.landing-sk-step{align-items:center;display:flex;gap:.35rem;opacity:.35;transition:opacity .35s ease,transform .3s ease}.landing-sk-step-dot{background:var(--border-color);border-radius:50%;height:8px;transition:background .35s ease,box-shadow .35s ease,transform .3s ease;width:8px}.landing-sk-step.step-done .landing-sk-step-dot{background:var(--online-accent);box-shadow:0 0 6px #10b98166}.landing-sk-step.step-current{opacity:1;transform:scale(1.05)}.landing-sk-step.step-current .landing-sk-step-dot{animation:step-dot-pulse 1.2s ease-in-out infinite;background:var(--accent-primary);box-shadow:0 0 8px #3498db80;transform:scale(1.25)}@keyframes step-dot-pulse{0%,to{box-shadow:0 0 6px #3498db4d}50%{box-shadow:0 0 14px #3498db99;transform:scale(1.35)}}.landing-sk-step-label{color:var(--text-primary);font-size:.65rem;font-weight:600;white-space:nowrap}.landing-sk-step.step-done .landing-sk-step-label{color:var(--online-accent)}.landing-sk-step.step-current .landing-sk-step-label{color:var(--accent-primary);font-weight:700}.landing-sk-section{opacity:.55;transform:scale(.98);transition:opacity .4s ease,transform .4s ease;width:100%}.landing-sk-section.sk-section-active{opacity:1;transform:scale(1)}.landing-sk-section.sk-section-active .landing-sk-block{animation-duration:.9s;opacity:1}.landing-sk-section:not(.sk-section-active) .landing-sk-block{opacity:.6}.landing-sk-header{align-items:center;display:flex;flex-direction:column;gap:.75rem;margin-bottom:3.5rem;width:100%}.landing-sk-title{margin-top:.5rem}.landing-sk-cards{grid-gap:1.25rem;display:grid;gap:1.25rem;grid-template-columns:1fr;margin-bottom:3rem;width:100%}@media (min-width:640px){.landing-sk-cards{grid-template-columns:1fr 1fr}.landing-sk-card-hero{grid-column:1/-1}}@media (min-width:1024px){.landing-sk-cards{grid-template-columns:1fr 1fr 1fr}.landing-sk-card-hero{grid-column:1/-1}}.landing-sk-card{align-items:flex-start;background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:1.25rem;display:flex;gap:1.25rem;padding:2rem 1.5rem}.landing-sk-card-body{display:flex;flex:1 1;flex-direction:column;gap:.5rem}.landing-sk-stats{grid-gap:1rem;background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:1.25rem;box-sizing:border-box;display:grid;gap:1rem;grid-template-columns:repeat(4,1fr);margin-bottom:3rem;padding:1.5rem;width:100%}.landing-sk-features-header,.landing-sk-stat{align-items:center;display:flex;flex-direction:column;gap:.5rem}.landing-sk-features-header{margin-bottom:2rem;width:100%}.landing-sk-features{grid-gap:1.25rem;display:grid;gap:1.25rem;grid-template-columns:1fr;margin-bottom:3rem;width:100%}@media (min-width:768px){.landing-sk-features{grid-template-columns:1fr 1fr 1fr}}.landing-sk-feature{background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:1.25rem;display:flex;flex-direction:column;gap:.75rem;padding:1.5rem}.landing-sk-footer{display:flex;justify-content:center;width:100%}.landing-screen{align-items:center;box-sizing:border-box;display:flex;flex-direction:column;min-height:100vh;overflow:hidden;padding:2rem 1.5rem 4rem;position:relative;width:100%}.landing-screen:before{animation:orb-float-1 20s ease-in-out infinite;background:radial-gradient(circle,#3498db1a 0,#3498db0a 40%,#0000 70%);height:700px;right:-10%;top:-15%;width:700px}.landing-screen:after,.landing-screen:before{border-radius:50%;content:"";pointer-events:none;position:absolute;z-index:0}.landing-screen:after{animation:orb-float-2 25s ease-in-out infinite;background:radial-gradient(circle,#10b98114 0,#10b98108 40%,#0000 70%);bottom:-10%;height:600px;left:-8%;width:600px}[data-theme=dark] .landing-screen:before{background:radial-gradient(circle,#5dade21f 0,#5dade20a 40%,#0000 70%)}[data-theme=dark] .landing-screen:after{background:radial-gradient(circle,#34d3991a 0,#34d39908 40%,#0000 70%)}.landing-screen .bg-pattern{background-image:repeating-conic-gradient(var(--accent-primary) 0 25%,#0000 0 50%);background-size:32px 32px;inset:0;opacity:.035;pointer-events:none;position:fixed;z-index:0}[data-theme=dark] .landing-screen .bg-pattern{opacity:.06}.floating-pieces{inset:0;overflow:hidden;pointer-events:none;position:fixed;z-index:0}.floating-piece{animation-iteration-count:infinite;animation-timing-function:ease-in-out;color:var(--text-secondary);font-size:2rem;opacity:0;position:absolute}[data-theme=dark] .floating-piece{opacity:0}.floating-piece:first-child{animation:float-piece-1 22s ease-in-out infinite;animation-delay:0s;font-size:2.8rem;left:5%;opacity:.06;top:8%}.floating-piece:nth-child(2){animation:float-piece-2 18s ease-in-out infinite;animation-delay:2s;font-size:2.2rem;opacity:.05;right:8%;top:12%}.floating-piece:nth-child(3){animation:float-piece-3 20s ease-in-out infinite;animation-delay:4s;font-size:1.8rem;left:3%;opacity:.05;top:40%}.floating-piece:nth-child(4){animation:float-piece-4 24s ease-in-out infinite;animation-delay:1s;font-size:2.4rem;opacity:.04;right:4%;top:55%}.floating-piece:nth-child(5){animation:float-piece-5 16s ease-in-out infinite;animation-delay:3s;bottom:15%;font-size:1.5rem;left:10%;opacity:.06}.floating-piece:nth-child(6){animation:float-piece-1 26s ease-in-out infinite;animation-delay:5s;bottom:20%;font-size:3rem;opacity:.04;right:6%}[data-theme=dark] .floating-piece:first-child,[data-theme=dark] .floating-piece:nth-child(2),[data-theme=dark] .floating-piece:nth-child(3),[data-theme=dark] .floating-piece:nth-child(4),[data-theme=dark] .floating-piece:nth-child(5),[data-theme=dark] .floating-piece:nth-child(6){opacity:.08}@keyframes float-piece-1{0%,to{opacity:.06;transform:translate(0) rotate(0deg)}25%{opacity:.09;transform:translate(30px,-40px) rotate(5deg)}50%{opacity:.06;transform:translate(-20px,-80px) rotate(-3deg)}75%{opacity:.08;transform:translate(40px,-30px) rotate(4deg)}}@keyframes float-piece-2{0%,to{opacity:.05;transform:translate(0) rotate(0deg)}25%{opacity:.08;transform:translate(-40px,-30px) rotate(-5deg)}50%{opacity:.05;transform:translate(20px,-70px) rotate(3deg)}75%{opacity:.07;transform:translate(-30px,-20px) rotate(-4deg)}}@keyframes float-piece-3{0%,to{opacity:.05;transform:translate(0) scale(1)}33%{opacity:.08;transform:translate(20px,-50px) scale(1.1)}66%{opacity:.06;transform:translate(-30px,-20px) scale(.95)}}@keyframes float-piece-4{0%,to{opacity:.04;transform:translate(0) rotate(0deg)}25%{opacity:.07;transform:translate(-20px,30px) rotate(-3deg)}50%{opacity:.05;transform:translate(-50px,-20px) rotate(2deg)}75%{opacity:.06;transform:translate(10px,40px) rotate(-2deg)}}@keyframes float-piece-5{0%,to{opacity:.06;transform:translate(0) scale(1)}33%{opacity:.09;transform:translate(-30px,-30px) scale(1.15)}66%{opacity:.07;transform:translate(20px,-60px) scale(.9)}}@keyframes orb-float-1{0%,to{transform:translate(0)}33%{transform:translate(-20px,30px)}66%{transform:translate(30px,-20px)}}@keyframes orb-float-2{0%,to{transform:translate(0)}33%{transform:translate(30px,20px)}66%{transform:translate(-20px,-30px)}}.landing-header{animation:landing-fade-slide .7s ease-out forwards;margin-bottom:3.5rem;position:relative;text-align:center;z-index:1}.landing-header .logo-mark{align-items:center;animation:landing-bounce-in .6s cubic-bezier(.34,1.56,.64,1) .1s both;background:linear-gradient(135deg,var(--accent-primary),#5dade2);border-radius:20px;box-shadow:0 8px 24px #3498db40,0 0 0 1px #3498db1a;display:inline-flex;height:72px;justify-content:center;margin-bottom:1.25rem;position:relative;width:72px}.landing-header .logo-mark:after{animation:logo-glow-pulse 3s ease-in-out infinite;background:linear-gradient(135deg,var(--accent-primary),var(--online-accent));border-radius:24px;content:"";inset:-4px;opacity:.15;position:absolute;z-index:-1}@keyframes logo-glow-pulse{0%,to{opacity:.15;transform:scale(1)}50%{opacity:.3;transform:scale(1.05)}}.landing-header .logo-mark svg{color:#fff;filter:drop-shadow(0 2px 4px rgba(0,0,0,.15))}.landing-header .logo-piece{animation:logo-piece-bounce 3s ease-in-out infinite;bottom:-6px;color:#fff;filter:drop-shadow(0 1px 3px rgba(0,0,0,.2));font-size:1.4rem;opacity:.9;position:absolute;right:-8px}@keyframes logo-piece-bounce{0%,to{transform:translateY(0)}50%{transform:translateY(-4px)}}.landing-header h1{-webkit-text-fill-color:#0000;animation:gradient-shift 8s ease-in-out infinite;background:linear-gradient(135deg,var(--accent-primary),var(--online-accent),#a78bfa);-webkit-background-clip:text;background-clip:text;background-size:200% 200%;font-size:clamp(2.8rem,7vw,4.5rem);font-weight:800;letter-spacing:-.03em;line-height:1.1;margin:0 0 .75rem}@keyframes gradient-shift{0%,to{background-position:0 50%}50%{background-position:100% 50%}}.landing-header .tagline{color:var(--text-secondary);font-size:clamp(1rem,2.5vw,1.2rem);font-weight:400;line-height:1.7;margin:0 auto;max-width:520px}.landing-header .tagline strong{color:var(--accent-primary);font-weight:600}.landing-cards{grid-gap:1.25rem;display:grid;gap:1.25rem;grid-template-columns:1fr;max-width:900px;position:relative;width:100%;z-index:1}@media (min-width:640px){.landing-cards{grid-template-columns:1fr 1fr}.landing-card:first-child{grid-column:1/-1}}@media (min-width:1024px){.landing-cards{gap:1.25rem;grid-template-columns:1fr 1fr 1fr}.landing-card:first-child{grid-column:1/-1}}.landing-card{-webkit-tap-highlight-color:transparent;align-items:flex-start;animation:landing-card-enter .6s ease-out forwards;background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:1.25rem;box-shadow:0 1px 3px var(--shadow-color),0 0 0 1px #0000;cursor:pointer;display:flex;font-family:inherit;gap:1.25rem;opacity:0;outline:none;padding:2rem 1.5rem;position:relative;text-align:left;transition:transform .35s cubic-bezier(.34,1.56,.64,1),border-color .3s ease,box-shadow .4s ease,background .3s ease;-webkit-user-select:none;user-select:none}.landing-card .card-badge{animation:badge-pop .5s cubic-bezier(.34,1.56,.64,1) .6s forwards;background:var(--accent-primary);border-radius:1rem;box-shadow:0 2px 8px #3498db4d;color:#fff;font-size:.65rem;font-weight:700;letter-spacing:.06em;opacity:0;padding:.25rem .7rem;position:absolute;right:1.25rem;text-transform:uppercase;top:-.5rem;transform-origin:center;z-index:2}.landing-card.online .card-badge{background:var(--online-accent);box-shadow:0 2px 8px #10b9814d}.landing-card.spectator .card-badge{background:#a78bfa;box-shadow:0 2px 8px #a78bfa4d}.landing-card.puzzle .card-badge{background:#f59e0b;box-shadow:0 2px 8px #f59e0b4d}.landing-card.history .card-badge{background:#8b5cf6;box-shadow:0 2px 8px #8b5cf64d}@keyframes badge-pop{0%{opacity:0;transform:scale(.5) translateY(5px)}60%{opacity:1;transform:scale(1.15) translateY(0)}to{opacity:1;transform:scale(1) translateY(0)}}.landing-card:first-child{animation-delay:.12s}.landing-card:nth-child(2){animation-delay:.2s}.landing-card:nth-child(3){animation-delay:.28s}.landing-card:nth-child(4){animation-delay:.36s}.landing-card:nth-child(5){animation-delay:.44s}.landing-card:focus-visible{outline:2px solid var(--accent-primary);outline-offset:2px}.landing-card:hover{border-color:var(--accent-primary);box-shadow:0 12px 40px var(--shadow-color),0 0 0 1px var(--accent-primary),0 0 30px #3498db14;transform:translateY(-5px)}.landing-card:hover .card-icon{background:var(--accent-primary);box-shadow:0 4px 16px #3498db4d;color:#fff;transform:scale(1.08)}.landing-card:hover .card-arrow{background:var(--bg-tertiary);color:var(--accent-primary);transform:translateX(6px)}.landing-card.online:hover{border-color:var(--online-accent);box-shadow:0 12px 40px var(--shadow-color),0 0 0 1px var(--online-accent),0 0 30px #10b98114}.landing-card.online:hover .card-icon{background:var(--online-accent);box-shadow:0 4px 16px #10b9814d;color:#fff}.landing-card.online:hover .card-arrow{color:var(--online-accent)}.landing-card.spectator:hover{border-color:#a78bfa;box-shadow:0 12px 40px var(--shadow-color),0 0 0 1px #a78bfa,0 0 30px #a78bfa14}.landing-card.spectator:hover .card-icon{background:#a78bfa;box-shadow:0 4px 16px #a78bfa4d;color:#fff}.landing-card.spectator:hover .card-arrow{color:#a78bfa}.landing-card.puzzle:hover{border-color:#f59e0b;box-shadow:0 12px 40px var(--shadow-color),0 0 0 1px #f59e0b,0 0 30px #f59e0b14}.landing-card.puzzle:hover .card-icon{background:#f59e0b;box-shadow:0 4px 16px #f59e0b4d;color:#fff}.landing-card.puzzle:hover .card-arrow{color:#f59e0b}.landing-card.history:hover{border-color:#8b5cf6;box-shadow:0 12px 40px var(--shadow-color),0 0 0 1px #8b5cf6,0 0 30px #8b5cf614}.landing-card.history:hover .card-icon{background:#8b5cf6;box-shadow:0 4px 16px #8b5cf64d;color:#fff}.landing-card.history:hover .card-arrow{color:#8b5cf6}.landing-card:active:not(:disabled){transform:translateY(-1px) scale(.98)}.card-icon{align-items:center;background:var(--bg-tertiary);border-radius:14px;color:var(--text-primary);display:flex;flex-shrink:0;font-size:1.5rem;height:3.5rem;justify-content:center;position:relative;transition:background .3s ease,color .3s ease,box-shadow .3s ease,transform .3s ease;width:3.5rem}.landing-card:first-child .card-icon{border-radius:16px;font-size:1.75rem;height:4rem;width:4rem}.card-body{flex:1 1;min-width:0}.card-body h2{align-items:center;color:var(--text-primary);display:flex;font-size:1.15rem;font-weight:700;gap:.5rem;letter-spacing:-.01em;margin:0 0 .4rem}.card-body h2 .card-key-hint{align-items:center;background:var(--bg-tertiary);border:1px solid var(--border-color);border-radius:4px;color:var(--text-secondary);display:inline-flex;font-family:Inter,monospace;font-size:.6rem;font-weight:700;height:20px;justify-content:center;min-width:20px;padding:0 5px;transition:all .2s ease}.landing-card:hover .card-body h2 .card-key-hint{background:var(--bg-secondary);border-color:var(--accent-primary);color:var(--accent-primary)}.card-body p{color:var(--text-secondary);font-size:.875rem;line-height:1.55;margin:0}.landing-card:first-child .card-body h2{font-size:1.35rem}.card-arrow{align-items:center;align-self:center;border-radius:50%;color:var(--text-secondary);display:flex;flex-shrink:0;height:2rem;justify-content:center;transition:transform .3s ease,color .3s ease,background .3s ease;width:2rem}.landing-stats{grid-gap:1rem;animation:landing-fade-slide .6s ease-out .55s forwards;background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:1.25rem;box-shadow:0 2px 12px var(--shadow-color);display:grid;gap:1rem;grid-template-columns:repeat(4,1fr);margin-top:3rem;max-width:900px;opacity:0;padding:1.5rem;position:relative;width:100%;z-index:1}.stat-item{align-items:center;display:flex;flex-direction:column;gap:.35rem;padding:.5rem;position:relative;text-align:center}.stat-item+.stat-item:before{background:var(--border-color);content:"";height:70%;left:-.5rem;opacity:.6;position:absolute;top:15%;width:1px}.stat-icon{align-items:center;background:var(--bg-tertiary);border-radius:12px;color:var(--accent-primary);display:flex;height:2.5rem;justify-content:center;transition:transform .3s ease,background .3s ease,color .3s ease;width:2.5rem}.stat-item:hover .stat-icon{background:var(--accent-primary);color:#fff;transform:scale(1.1) translateY(-2px)}.stat-value{font-feature-settings:"tnum";font-size:clamp(1.6rem,3vw,2.2rem);font-variant-numeric:tabular-nums;font-weight:800;letter-spacing:-.03em;line-height:1;transition:color .3s ease}.stat-item:hover .stat-value{color:var(--accent-primary)}.stat-label{font-size:.75rem;letter-spacing:.06em}.landing-features{margin-top:3rem;max-width:900px;position:relative;width:100%;z-index:1}.features-header{animation:landing-fade-slide .6s ease-out .65s forwards;margin-bottom:2rem;opacity:0;text-align:center}.features-header h2{align-items:center;color:var(--text-primary);display:inline-flex;font-size:1.5rem;font-weight:700;gap:.6rem;margin:0 0 .5rem}.features-header h2 svg{color:var(--accent-primary)}.features-header p{color:var(--text-secondary);font-size:.95rem;margin:0}.features-grid{grid-gap:1.25rem;display:grid;gap:1.25rem;grid-template-columns:1fr}@media (min-width:768px){.features-grid{grid-template-columns:1fr 1fr 1fr}}.feature-card{background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:1.25rem;box-shadow:0 1px 3px var(--shadow-color);display:flex;flex-direction:column;gap:1.25rem;opacity:0;padding:1.5rem;perspective:800px;transform:translateY(30px) scale(.93);transform-style:preserve-3d;transition:transform .5s cubic-bezier(.34,1.56,.64,1),box-shadow .4s ease,border-color .3s ease}.feature-card.from-left{opacity:0;transform:translateX(-60px) scale(.92)}.feature-card.from-bottom{opacity:0;transform:translateY(60px) scale(.9)}.feature-card.from-right{opacity:0;transform:translateX(60px) scale(.92)}.feature-card.revealed{opacity:1;transform:translateX(0) translateY(0) scale(1);transition:opacity .7s cubic-bezier(.16,1,.3,1),transform .8s cubic-bezier(.34,1.56,.64,1),box-shadow .4s ease,border-color .3s ease;transition-delay:0s;transition-delay:calc(var(--stagger, 0)*.15s)}.feature-card.revealed:hover{border-color:var(--accent-primary);box-shadow:0 20px 48px var(--shadow-color),0 0 0 1px var(--accent-primary);transform:translateX(0) translateY(-6px) rotateX(0deg) rotateY(0deg) scale(1.02);transform:translateX(0) translateY(-6px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg)) scale(1.02)}.feature-card.revealed:hover .feature-visual{background:var(--bg-secondary);transform:translateZ(12px)}.feature-card.revealed:hover .feature-icon{background:var(--accent-primary);color:#fff;transform:translateZ(8px) scale(1.05)}.feature-card.revealed:hover .feature-body h3{transform:translateZ(4px)}.feature-card.revealed:after{background:radial-gradient(600px circle at 50% 50%,#5dade20a,#0000 60%);background:radial-gradient(600px circle at var(--mx,50%) var(--my,50%),#5dade20a,#0000 60%);border-radius:inherit;content:"";inset:0;opacity:0;pointer-events:none;position:absolute;transition:opacity .5s ease;z-index:0}.feature-card.revealed:hover:after{opacity:1}.feature-visual{align-items:center;background:var(--bg-tertiary);border-radius:.85rem;display:flex;height:120px;justify-content:center;overflow:hidden;transition:background .3s ease,transform .4s ease;width:100%}[data-theme=dark] .feature-visual{background:linear-gradient(135deg,#3b82f60a,#10b9810a);border:1px solid #ffffff0a}.feature-body{display:flex;flex-direction:column;gap:.5rem}.feature-icon{align-items:center;background:var(--bg-tertiary);border-radius:10px;color:var(--accent-primary);display:inline-flex;height:2rem;justify-content:center;transition:all .3s ease;width:2rem}.feature-card:hover .feature-icon{background:var(--accent-primary);color:#fff;transform:scale(1.05)}.feature-body h3{color:var(--text-primary);font-size:1rem;font-weight:700;margin:0}.feature-body p{color:var(--text-secondary);font-size:.82rem;line-height:1.55;margin:0}.mockup-eval-bar{display:flex;flex-direction:column;gap:.5rem;padding:.75rem 1rem;width:100%}.mockup-eval-label{color:var(--text-secondary);font-size:.6rem;font-weight:700;letter-spacing:.08em;opacity:.5;text-transform:uppercase}.mockup-bar-track{background:#1a1a1a;border-radius:9px;display:flex;height:18px;overflow:hidden;position:relative}[data-theme=dark] .mockup-bar-track{background:#0d0d0d;border:1px solid #ffffff0f}.mockup-bar-fill-white{align-items:center;background:linear-gradient(90deg,#e0e0e0,#fff);display:flex;justify-content:flex-end;padding-right:6px;transition:width .3s ease}[data-theme=dark] .mockup-bar-fill-white{background:linear-gradient(90deg,#4a6a8a,#5a8aba);border-right:1px solid #ffffff14}.mockup-bar-text{color:#2d2d2d;font-family:Courier New,monospace;font-size:.6rem;font-weight:700}[data-theme=dark] .mockup-bar-text{color:#c8dce8}.mockup-bar-divider{background:#ffffff4d;height:100%;left:50%;position:absolute;width:2px;z-index:1}[data-theme=dark] .mockup-bar-divider{background:#5dade24d}.mockup-bar-fill-black{background:linear-gradient(90deg,#2d2d2d,#1a1a1a);flex:1 1}[data-theme=dark] .mockup-bar-fill-black{background:linear-gradient(90deg,#1a1a2e,#16213e)}.mockup-pv-line{align-items:center;color:var(--text-secondary);display:flex;flex-wrap:wrap;font-family:Courier New,monospace;font-size:.65rem;gap:4px;opacity:.7}.mockup-pv-number{color:var(--text-secondary);font-weight:500;opacity:.5}.mockup-pv-move{background:#10b98114;border-radius:3px;color:var(--text-primary);font-weight:600;padding:1px 3px}[data-theme=dark] .mockup-pv-move{background:#10b9811f;color:#34d399}.mockup-pv-move-second{background:#0000;color:var(--text-secondary)}[data-theme=dark] .mockup-pv-move-second{color:#8899a6}.mockup-ellipsis{opacity:.4}.mockup-board{border-radius:6px;box-shadow:0 2px 8px var(--shadow-color);display:grid;grid-template-columns:repeat(4,1fr);grid-template-rows:repeat(4,1fr);height:88px;overflow:hidden;width:88px}[data-theme=dark] .mockup-board{box-shadow:0 2px 8px var(--shadow-color),0 0 12px #5dade20f}.mockup-square{align-items:center;display:flex;font-size:.9rem;justify-content:center;line-height:1}.mockup-square.light{background:#d1d5db;background:var(--board-light,#d1d5db)}.mockup-square.dark{background:#6b7280;background:var(--board-dark,#6b7280)}.mockup-piece{filter:drop-shadow(0 1px 2px rgba(0,0,0,.2));font-size:.9rem}[data-theme=dark] .mockup-piece{filter:drop-shadow(0 1px 3px rgba(0,0,0,.5));opacity:.9}.mockup-online{display:flex;flex-direction:column;gap:.6rem;padding:.75rem 1rem;width:100%}.mockup-connection-row{align-items:center;display:flex;gap:.5rem;justify-content:center}.mockup-player-dot{background:var(--online-accent);border-radius:50%;height:8px;width:8px}.mockup-dot-active{background:var(--online-accent);box-shadow:0 0 6px #10b98180}.mockup-dot-pulse{animation:mockup-pulse 2s ease-in-out infinite}@keyframes mockup-pulse{0%,to{box-shadow:0 0 0 0 #10b98180}50%{box-shadow:0 0 0 6px #10b98100}}.mockup-player-info{align-items:center;display:flex;flex-direction:column;gap:1px}.mockup-player-name{color:var(--text-primary);font-size:.65rem;font-weight:700}.mockup-player-rating{font-weight:500;opacity:.6}.mockup-player-rating,.mockup-vs{color:var(--text-secondary);font-size:.55rem}.mockup-vs{font-weight:700;letter-spacing:.05em;opacity:.4;padding:0 .25rem;text-transform:uppercase}.mockup-status-bar{align-items:center;color:var(--online-accent);display:flex;font-size:.6rem;font-weight:600;gap:.4rem;justify-content:center}.mockup-status-dot{animation:mockup-pulse 1.5s ease-in-out infinite;background:var(--online-accent);border-radius:50%;height:5px;width:5px}.mockup-clock{color:var(--text-secondary);font-family:Courier New,monospace;margin-left:.5rem;opacity:.6}.landing-footer{animation:landing-fade-slide .6s ease-out .6s forwards;flex-direction:column;font-size:.8rem;margin-top:4rem;opacity:0;position:relative;text-align:center;z-index:1}.landing-footer,.landing-footer .powered-by{align-items:center;color:var(--text-secondary);display:flex;gap:.5rem}.landing-footer .powered-by{opacity:.7;transition:opacity .2s ease}.landing-footer .powered-by:hover{opacity:1}.landing-footer .powered-by svg{opacity:.6;transition:opacity .2s ease}.landing-footer .powered-by:hover svg{color:var(--accent-primary);opacity:1}.landing-footer .footer-links{align-items:center;display:flex;font-size:.75rem;gap:1rem;opacity:.5;transition:opacity .2s ease}.landing-footer .footer-links:hover{opacity:.8}.landing-footer .footer-links span{color:var(--text-secondary)}.landing-footer .footer-links a{color:var(--text-secondary);text-decoration:none;transition:color .2s ease}.landing-footer .footer-links a:hover{color:var(--accent-primary)}.theme-hint{align-items:center;animation:landing-fade-slide .6s ease-out 1.2s forwards;background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:2rem;bottom:1.25rem;box-shadow:0 2px 8px var(--shadow-color);color:var(--text-secondary);cursor:default;display:flex;font-size:.75rem;gap:.5rem;opacity:0;padding:.5rem 1rem;position:fixed;right:1.25rem;transition:box-shadow .2s ease,border-color .2s ease;z-index:10}.theme-hint:hover{border-color:var(--accent-primary);box-shadow:0 4px 16px var(--shadow-color)}@keyframes landing-fade-slide{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}@keyframes landing-card-enter{0%{opacity:0;transform:translateY(24px) scale(.96)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes landing-bounce-in{0%{opacity:0;transform:scale(.5)}60%{transform:scale(1.12)}to{opacity:1;transform:scale(1)}}@media (max-width:639px){.landing-screen{padding:1.5rem 1rem 3rem}.landing-header{margin-bottom:2rem}.landing-header .logo-mark{border-radius:16px;height:56px;margin-bottom:1rem;width:56px}.landing-header .logo-piece{bottom:-4px;font-size:1.1rem;right:-6px}.landing-card{border-radius:1rem;gap:1rem;padding:1.25rem 1rem}.landing-card:first-child .card-icon{height:3.25rem;width:3.25rem}.landing-card .card-badge{font-size:.55rem;padding:.2rem .55rem;right:.75rem;top:-.4rem}.card-icon{border-radius:12px;font-size:1.2rem;height:2.75rem;width:2.75rem}.card-body h2{font-size:1rem}.card-body h2 .card-key-hint{display:none}.card-body p{font-size:.8rem}.landing-card:first-child .card-body h2{font-size:1.1rem}.landing-stats{gap:.75rem;grid-template-columns:repeat(2,1fr);margin-top:2rem;padding:1rem}.stat-item+.stat-item:before{display:none}.stat-icon{border-radius:10px;height:2rem;width:2rem}.stat-value{font-size:1.4rem}.stat-label{font-size:.65rem}.landing-features{margin-top:2rem}.features-header h2{font-size:1.2rem}.feature-card{padding:1.25rem}.feature-visual{height:100px}.landing-footer{margin-top:2.5rem}.landing-divider,.theme-hint{display:none}.landing-sk-stats{gap:.75rem;grid-template-columns:repeat(2,1fr);padding:1rem}.floating-pieces{display:none}.landing-sk-progress-bar{height:24px;max-width:100%;width:100%}.landing-sk-progress-label{font-size:.6rem}.landing-sk-steps{gap:.5rem}.landing-sk-step-label{font-size:.55rem;white-space:normal}}@media (min-width:640px) and (max-width:1023px){.landing-screen{padding:2rem 2rem 3rem}.landing-cards{max-width:600px}}@media (prefers-reduced-motion:reduce){.features-header,.floating-piece,.landing-card,.landing-card .card-badge,.landing-footer,.landing-header,.landing-stats,.theme-hint{animation:none;opacity:1}.feature-card,.feature-card.from-bottom,.feature-card.from-left,.feature-card.from-right{opacity:1!important;transform:none!important;transition:none!important}.feature-card.revealed:hover{box-shadow:0 12px 32px var(--shadow-color);transform:none!important}.feature-card.revealed:hover .feature-body h3,.feature-card.revealed:hover .feature-icon,.feature-card.revealed:hover .feature-visual{transform:none!important}.feature-card.revealed:after{display:none}.landing-card:active:not(:disabled),.landing-card:hover,.landing-card:hover .card-arrow{transform:none}.landing-header .logo-mark{animation:none;opacity:1}.floating-pieces{display:none}.landing-header h1,.landing-screen:after,.landing-screen:before{animation:none}.landing-header .logo-mark:after{animation:none;opacity:.15}.landing-header .logo-piece,.landing-sk-block,.mockup-dot-pulse,.mockup-status-dot{animation:none}.landing-sk-progress-fill{transition:none}.landing-sk-step.step-current .landing-sk-step-dot{animation:none;transform:scale(1)}.landing-sk-section,.landing-sk-step,.landing-sk-step-label{opacity:1!important;transform:none!important;transition:none!important}.landing-sk-section:not(.sk-section-active) .landing-sk-block{opacity:1}}.modal-dialog{background:#0000;border:none;border-radius:0;max-height:calc(100dvh - 32px);max-width:500px;overflow:auto;padding:0;width:90%}.modal-dialog::backdrop{animation:modal-fade-in .2s ease-out;background:#000000b3}@keyframes modal-fade-in{0%{opacity:0}to{opacity:1}}.modal-content{animation:modal-slide-up .3s cubic-bezier(.16,1,.3,1);background:var(--bg-secondary);border-radius:10px;box-shadow:0 5px 15px #0000004d;box-sizing:border-box;color:var(--text-primary);max-width:500px;padding:25px;width:90%}@keyframes modal-slide-up{0%{opacity:0;transform:translateY(20px) scale(.97)}to{opacity:1;transform:translateY(0) scale(1)}}.modal-header{align-items:center;display:flex;justify-content:space-between;margin-bottom:20px}.modal-header h2{color:var(--text-primary);font-size:1.5em;margin:0}.modal-close-button{background:none;border:none;color:var(--text-secondary);cursor:pointer;font-size:2em;transition:color .2s ease,transform .2s ease}.modal-close-button:hover{color:var(--accent-primary);transform:rotate(90deg)}.modal-body{display:flex;flex-direction:column;gap:12px;max-height:calc(100dvh - 180px);overflow-y:auto;padding:12px 0}.modal-body input[type=text],.modal-body textarea{background-color:var(--bg-primary);border:1px solid var(--border-color);border-radius:6px;box-sizing:border-box;color:var(--text-primary);font-size:1em;margin-bottom:15px;padding:12px;width:calc(100% - 24px)}.modal-body input[type=text]:focus,.modal-body textarea:focus{border-color:var(--accent-primary);outline:none}.modal-body .button-group{display:flex;gap:10px;justify-content:flex-end}.modal-body .button-group .button-primary{font-size:1em;padding:10px 20px}.modal-body .button-group .button-secondary{background-color:var(--bg-primary);border:1px solid var(--border-color);border-radius:6px;color:var(--text-secondary);cursor:pointer;font-size:1em;font-weight:600;padding:10px 20px;transition:all .2s ease}.modal-body .button-group .button-secondary:hover{border-color:var(--accent-primary);color:var(--accent-primary)}.pgn-headers{display:flex;flex-direction:column;gap:10px;margin-bottom:12px}.pgn-header-row{display:flex;gap:8px}.pgn-header-row input{background:var(--bg-primary);border:1px solid var(--border-color);border-radius:6px;color:var(--text-primary);flex:1 1;font-size:.95rem;padding:8px 10px}.pgn-header-row input::placeholder{color:var(--text-secondary)}.pgn-header-row input:focus{border-color:var(--accent-primary);box-shadow:0 0 0 3px #007bff0f;outline:none}@media (max-width:480px){.pgn-header-row{flex-direction:column}}.move-history-panel{display:flex;flex-direction:column;grid-area:movehistory;max-height:400px;min-height:0}.move-search-wrapper{margin-bottom:10px;position:relative}.move-search-input{background:var(--bg-primary);border:1px solid var(--border-color);border-radius:8px;box-sizing:border-box;color:var(--text-primary);font-family:inherit;font-size:.82em;outline:none;padding:8px 12px 8px 34px;transition:border-color .2s,box-shadow .2s;width:100%}.move-search-input::placeholder{color:var(--text-secondary);opacity:.6}.move-search-input:focus{border-color:var(--accent-primary);box-shadow:0 0 0 2px #5dade226}.move-search-icon{left:10px;opacity:.5;pointer-events:none}.move-search-clear,.move-search-icon{color:var(--text-secondary);position:absolute;top:50%;transform:translateY(-50%)}.move-search-clear{align-items:center;background:none;border:none;border-radius:4px;cursor:pointer;display:flex;justify-content:center;opacity:.6;padding:4px;right:6px;transition:opacity .15s}.move-search-clear:hover{background:var(--bg-tertiary);opacity:1}.move-search-count{color:var(--text-secondary);font-size:.72em;margin-top:4px;opacity:.7;text-align:right}.move-history-title{align-items:center;color:var(--text-primary);display:flex;font-size:1em;font-weight:600;gap:8px;margin:0 0 12px}.move-history-title svg{color:var(--accent-primary)}.move-history-scroll{flex:1 1;overflow-y:auto;scrollbar-color:var(--border-color) #0000;scrollbar-width:thin}.move-history-scroll::-webkit-scrollbar{width:6px}.move-history-scroll::-webkit-scrollbar-track{background:#0000}.move-history-scroll::-webkit-scrollbar-thumb{background-color:var(--border-color);border-radius:3px}.move-row-header{color:var(--text-secondary);font-size:.75em;font-weight:600}.move-row{grid-gap:4px;align-items:center;animation:fade-in-up .3s ease-out forwards;border-bottom:1px solid var(--border-color);border-radius:4px;display:grid;font-size:.85em;gap:4px;grid-template-columns:36px 1fr 1fr;padding:4px 0;transition:background-color .15s ease}.move-row:hover{background-color:var(--bg-tertiary)}.tree-main-row{padding-left:4px;position:relative}.tree-main-row:before{background-color:var(--border-color);bottom:10%;content:"";left:-2px;opacity:.4;position:absolute;top:10%;transition:opacity .2s;width:2px}.tree-main-row.move-row-active:before{background-color:var(--accent-primary);opacity:1}.move-row-active{background-color:#5dade214!important;border-left:3px solid var(--accent-primary);padding-left:0}.move-row-active .move-cell-clickable .move-san{color:var(--accent-primary);font-weight:700}.move-row:last-child{border-bottom:none}.move-alternatives{align-items:flex-start;animation:fade-in-up .25s ease-out forwards;border-bottom:1px solid var(--border-color);display:flex;gap:6px;padding:2px 0 6px 36px}.alt-connector{background-color:var(--border-color);border-radius:1px;flex-shrink:0;height:100%;margin-right:4px;min-height:20px;opacity:.3;width:2px}.alt-items{display:flex;flex-wrap:wrap}.alt-chip,.alt-items{align-items:center;gap:4px}.alt-chip{background-color:var(--bg-tertiary);border:1px solid var(--border-color);border-radius:6px;color:var(--text-secondary);cursor:default;display:inline-flex;font-family:Segoe UI,monospace;font-size:.75em;font-weight:600;padding:2px 8px;transition:all .15s ease}.alt-chip:hover{background-color:var(--bg-secondary);border-color:var(--accent-primary);color:var(--accent-primary);transform:translateY(-1px)}.alt-move{letter-spacing:.5px}.tree-opening-label{align-items:center;background:linear-gradient(135deg,#5dade214,#43a04714);border:1px solid var(--border-color);border-radius:4px;color:var(--accent-primary);display:inline-flex;flex-shrink:0;font-size:.65em;font-weight:600;gap:4px;line-height:1.5;margin-left:4px;max-width:160px;overflow:hidden;padding:1px 6px;text-overflow:ellipsis;white-space:nowrap}.tree-opening-label:hover{border-color:var(--accent-primary);max-width:300px}.tree-opening-eco{border-left:1px solid var(--border-color);color:var(--text-secondary);padding-left:3px}.move-number,.tree-opening-eco{font-size:.85em;font-weight:500}.move-number{text-align:center}.move-cell{align-items:center;border-radius:4px;cursor:default;display:flex;gap:6px;overflow:hidden;padding:2px 6px;transition:all .15s ease}.move-cell-clickable{cursor:pointer}.move-cell-clickable:hover{background-color:var(--bg-tertiary);transform:translateX(2px)}.move-cell-clickable:focus-visible{border-radius:4px;outline:2px solid var(--accent-primary);outline-offset:1px}.move-san{color:var(--text-primary);font-size:.95em}.move-badge{align-items:center;border-radius:3px;display:inline-flex;font-size:.7em;font-weight:700;gap:2px;letter-spacing:.3px;line-height:1.4;padding:1px 6px;text-transform:uppercase;white-space:nowrap}.empty-move{color:var(--text-secondary);font-size:.85em;font-style:italic;padding:20px 0;text-align:center}@media (prefers-reduced-motion:reduce){.move-alternatives,.move-row{animation:none}.alt-chip:hover,.move-cell-clickable:hover{transform:none}}@media (max-width:480px){.move-history-panel{max-height:300px}.move-row{font-size:.75em;grid-template-columns:30px 1fr 1fr;padding:3px 0}.move-san{font-size:.85em}.move-badge{font-size:.6em;padding:1px 4px}.move-cell{gap:4px;padding:1px 4px}.empty-move{font-size:.75em;padding:12px 0}.move-alternatives{padding:1px 0 4px 30px}.alt-chip{font-size:.65em;padding:1px 6px}.tree-opening-label{font-size:.55em;max-width:100px;padding:0 4px}.tree-opening-eco{display:none}}.opening-explorer{background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:10px;box-shadow:0 2px 8px var(--shadow-color);font-size:.9em;grid-area:opening;padding:15px;transition:border-color .2s ease}.opening-explorer:hover{border-color:var(--accent-primary)}.opening-title{align-items:center;border-bottom:1px solid var(--border-color);color:var(--text-primary);display:flex;font-size:1em;font-weight:600;gap:8px;margin:0 0 10px;padding-bottom:8px}.opening-title svg{color:var(--accent-primary);flex-shrink:0}.opening-name{color:var(--accent-primary);font-size:1.1em;font-weight:700;transition:color .2s ease}.opening-eco{color:var(--text-secondary);font-size:.85em;margin-top:4px}.opening-next-moves{border-top:1px solid var(--border-color);margin-top:12px;padding-top:10px}.opening-next-header{color:var(--text-secondary);font-size:.85em;margin-bottom:6px}.opening-next-item{display:flex;font-family:Segoe UI,monospace;font-size:.9em;justify-content:space-between;padding:4px 0}.opening-next-item:hover{background:var(--bg-tertiary);border-radius:4px;padding-left:4px;padding-right:4px}.opening-next-move{color:var(--text-primary)}.opening-next-count{color:var(--text-secondary);font-size:.85em}.opening-empty{color:var(--text-secondary);font-size:.9em;font-style:italic}@media (max-width:480px){.opening-explorer{font-size:.8em;padding:12px}.opening-name{font-size:.95em}.opening-next-item{font-size:.8em}}.game-review-dialog[open]::backdrop{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#000c}.game-review-card{animation:lobby-slide-up .4s ease-out;background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:16px;max-width:480px;padding:32px;width:90%}.game-review-title{color:var(--text-primary);font-size:1.4em;font-weight:700;margin:0 0 4px;text-align:center}.game-review-subtitle{color:var(--text-secondary);font-size:.9em;margin:0 0 24px;text-align:center}.accuracy-section{display:flex;gap:24px;justify-content:center;margin-bottom:24px}.accuracy-card{background:var(--bg-primary);border:2px solid var(--border-color);border-radius:12px;flex:1 1;padding:20px 16px;text-align:center}.accuracy-card.high{border-color:#43a047}.accuracy-card.medium{border-color:#ffa726}.accuracy-card.low{border-color:#e53935}.accuracy-side{color:var(--text-secondary);font-size:.85em;font-weight:600;letter-spacing:1px;margin-bottom:8px;text-transform:uppercase}.accuracy-score{font-size:2.4em;font-weight:800;line-height:1;margin-bottom:4px}.accuracy-score.good{color:#43a047}.accuracy-score.ok{color:#ffa726}.accuracy-score.bad{color:#e53935}.accuracy-label{color:var(--text-secondary);font-size:.75em;font-weight:500}.breakdown-section{border-top:1px solid var(--border-color);margin-bottom:24px;padding-top:16px}.breakdown-title{color:var(--text-secondary);font-size:.85em;font-weight:600;letter-spacing:.5px;margin-bottom:12px;text-transform:uppercase}.breakdown-grid{grid-gap:12px;display:grid;gap:12px;grid-template-columns:1fr 1fr}.breakdown-side h4{border-bottom:1px solid var(--border-color);color:var(--text-primary);font-size:.85em;font-weight:600;margin:0 0 8px;padding-bottom:4px}.breakdown-count{align-items:center;display:flex;font-size:.8em;justify-content:space-between;padding:3px 0}.breakdown-label{align-items:center;color:var(--text-primary);display:flex;gap:4px}.breakdown-num{color:var(--text-secondary);font-weight:700}.breakdown-empty{color:var(--text-secondary);font-size:.8em;font-style:italic;padding:8px 0;text-align:center}.game-review-actions{display:flex;gap:10px;justify-content:center}.game-review-actions button{border-radius:10px;cursor:pointer;font-size:.9em;font-weight:600;padding:12px 24px;transition:all .2s ease}@media (max-width:480px){.game-review-card{padding:20px}.accuracy-section{gap:12px}.accuracy-card{padding:16px 12px}.accuracy-score{font-size:1.8em}.breakdown-grid{gap:8px;grid-template-columns:1fr}}.accessible-dialog{background:#0000;border:none;max-height:calc(100dvh - 32px);max-width:100%;overflow-y:auto;padding:0}.accessible-dialog::backdrop{animation:lobby-fade-in .3s ease-out;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);background:#000000bf}@keyframes lobby-fade-in{0%{opacity:0}to{opacity:1}}@keyframes lobby-slide-up{0%{opacity:0;transform:translateY(30px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes pulse-glow{0%,to{box-shadow:0 0 20px #5dade233}50%{box-shadow:0 0 40px #5dade280}}@keyframes dot-pulse{0%,80%,to{opacity:.3;transform:scale(.8)}40%{opacity:1;transform:scale(1.2)}}.online-lobby-card{animation:lobby-slide-up .4s ease-out;background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:16px;color:var(--text-primary);max-width:440px;overflow:hidden;padding:32px;position:relative;width:90%}.online-lobby-card:before{background:linear-gradient(90deg,var(--accent-primary),#a78bfa,var(--online-accent));content:"";height:3px;left:0;position:absolute;right:0;top:0}.lobby-header{justify-content:space-between;margin-bottom:28px}.lobby-header,.lobby-header h2{align-items:center;display:flex}.lobby-header h2{color:var(--text-primary);font-size:1.5em;font-weight:700;gap:10px;margin:0}.lobby-header h2 svg{color:var(--online-accent)}.lobby-close-btn{align-items:center;background:var(--bg-tertiary);border:1px solid var(--border-color);border-radius:50%;color:var(--text-secondary);cursor:pointer;display:flex;font-size:1.3em;height:36px;justify-content:center;transition:all .2s ease;width:36px}.lobby-close-btn:hover{background:var(--bg-primary);border-color:var(--accent-primary);color:var(--text-primary)}.lobby-tabs{background:var(--bg-primary);border-radius:10px;display:flex;gap:4px;margin-bottom:24px;padding:4px}.lobby-tab{background:#0000;border:none;border-radius:8px;color:var(--text-secondary);cursor:pointer;flex:1 1;font-family:inherit;font-size:.9em;font-weight:600;padding:10px 16px;transition:all .2s ease}.lobby-tab:hover{background:var(--bg-secondary);color:var(--text-primary)}.lobby-tab.active{background:var(--bg-secondary);box-shadow:0 1px 4px var(--shadow-color);color:var(--accent-primary)}.lobby-actions{display:flex;flex-direction:column;gap:16px}.lobby-divider{align-items:center;color:var(--text-secondary);display:flex;font-size:.85em;font-weight:600;gap:16px;letter-spacing:1px;text-transform:uppercase}.lobby-divider:after,.lobby-divider:before{background:var(--border-color);content:"";flex:1 1;height:1px}.lobby-btn-create{align-items:center;background:linear-gradient(135deg,var(--online-accent),var(--accent-primary));border:none;border-radius:10px;color:#fff;cursor:pointer;display:flex;font-size:1.05em;font-weight:600;gap:10px;justify-content:center;letter-spacing:.3px;padding:14px 20px;transition:all .25s ease;width:100%}.lobby-btn-create:hover{box-shadow:0 6px 20px #5dade259;transform:translateY(-2px)}.lobby-btn-create:active{transform:translateY(0)}.lobby-join-row{display:flex;gap:10px}.lobby-code-input{background:var(--bg-primary);border:2px solid var(--border-color);border-radius:10px;color:var(--text-primary);flex:1 1;font-family:Inter,monospace;font-size:1.1em;font-weight:600;letter-spacing:4px;padding:12px 16px;text-align:center;text-transform:uppercase;transition:border-color .2s ease}.lobby-code-input::placeholder{color:var(--text-secondary);font-size:.85em;font-weight:400;letter-spacing:1px}.lobby-code-input:focus{border-color:var(--accent-primary);box-shadow:0 0 0 3px #5dade226;outline:none}.lobby-btn-join{background:var(--bg-tertiary);border:2px solid var(--border-color);border-radius:10px;color:var(--text-primary);cursor:pointer;font-size:1em;font-weight:600;padding:12px 24px;transition:all .2s ease;white-space:nowrap}.lobby-btn-join:hover{background:var(--bg-secondary);border-color:var(--accent-primary);color:var(--accent-primary)}.lobby-waiting{gap:24px;padding:10px 0}.lobby-code-display,.lobby-waiting{align-items:center;display:flex;flex-direction:column}.lobby-code-display{gap:12px}.lobby-code-display label{color:var(--text-secondary);font-size:.85em;font-weight:600;letter-spacing:1.5px;text-transform:uppercase}.lobby-code-value{align-items:center;animation:pulse-glow 2.5s ease-in-out infinite;background:var(--bg-primary);border:2px solid var(--border-color);border-radius:12px;display:flex;gap:12px;padding:14px 24px}.lobby-code-value span{color:var(--online-accent);font-family:Inter,monospace;font-size:2em;font-weight:800;letter-spacing:8px}.lobby-code-copy-btn{align-items:center;background:var(--bg-tertiary);border:1px solid var(--border-color);border-radius:8px;color:var(--text-secondary);cursor:pointer;display:flex;justify-content:center;padding:8px;transition:all .2s ease}.lobby-code-copy-btn:hover{border-color:var(--accent-primary);color:var(--accent-primary)}.lobby-waiting-dots{align-items:center;color:var(--text-secondary);display:flex;font-size:.95em;gap:6px}.lobby-waiting-text{margin-left:6px}.lobby-player-color{color:var(--text-secondary);font-size:.85em}.lobby-color-badge{border-radius:4px;display:inline-block;font-weight:700;padding:2px 8px;text-transform:capitalize}.lobby-color-badge.color-white{background:#333;color:#f0f0f0}.lobby-color-badge.color-black{background:#f0f0f0;color:#333}.lobby-waiting-dots .dot{animation:dot-pulse 1.4s ease-in-out infinite;background:var(--accent-primary);border-radius:50%;height:8px;width:8px}.lobby-waiting-dots .dot:nth-child(2){animation-delay:.2s}.lobby-waiting-dots .dot:nth-child(3){animation-delay:.4s}.lobby-btn-cancel:focus-visible,.lobby-btn-create:focus-visible,.lobby-btn-join:focus-visible,.lobby-close-btn:focus-visible,.lobby-tab:focus-visible,.lobby-time-btn:focus-visible{outline:2px solid var(--accent-primary);outline-offset:2px}.lobby-btn-cancel{background:#0000;border:1px solid var(--border-color);border-radius:8px;color:var(--text-secondary);cursor:pointer;font-size:.9em;font-weight:500;padding:10px 28px;transition:all .2s ease}.lobby-btn-cancel:hover{border-color:var(--danger-color);color:var(--danger-color)}.lobby-error{background:#ef44441a;border:1px solid #ef444433;border-radius:8px;color:var(--danger-color);font-size:.85em;padding:8px 12px;text-align:center}.lobby-error-spectate{margin-bottom:12px}.online-status-bar{align-items:center;animation:fade-in-up .4s ease-out;background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:10px;display:flex;gap:12px;justify-content:space-between;margin-bottom:12px;padding:10px 16px}.online-status-info{align-items:center;display:flex;font-size:.9em;font-weight:500;gap:10px}.status-separator{color:var(--border-color);margin:0 4px}.connection-text,.spectator-count-text{color:var(--text-secondary);font-size:.85em}.online-status-dot{border-radius:50%;flex-shrink:0;height:10px;width:10px}.online-status-dot.connected{background:var(--online-accent);box-shadow:0 0 8px #10b98180}.online-status-dot.disconnected{background:var(--danger-color);box-shadow:0 0 8px #ef444480}.online-status-dot.your-turn{animation:dot-pulse 1s ease-in-out infinite;background:var(--online-accent)}.online-status-dot.reconnecting{animation:dot-pulse .6s ease-in-out infinite;background:#f59e0b;box-shadow:0 0 8px #f59e0b80}.online-status-actions{display:flex;gap:8px}.online-btn-resign{background:#0000;border:1px solid var(--danger-color);border-radius:6px;color:var(--danger-color);cursor:pointer;font-size:.8em;font-weight:600;padding:6px 14px;transition:all .2s ease}.online-btn-resign:hover{background:var(--danger-color);color:#fff}.online-btn-takeback{background:#0000;border:1px solid var(--accent-primary);border-radius:6px;color:var(--accent-primary);cursor:pointer;font-size:.8em;font-weight:600;padding:6px 14px;transition:all .2s ease;white-space:nowrap}.online-btn-takeback:hover{background:var(--accent-primary);color:#fff}.online-btn-takeback:disabled{background:#0000;color:var(--accent-primary);cursor:not-allowed;opacity:.5}.online-btn-draw{background:#0000;border:1px solid var(--online-accent);border-radius:6px;color:var(--online-accent);cursor:pointer;font-size:.8em;font-weight:600;padding:6px 14px;transition:all .2s ease;white-space:nowrap}.online-btn-draw:hover{background:var(--online-accent);color:#fff}.online-btn-draw:disabled{background:#0000;color:var(--online-accent);cursor:not-allowed;opacity:.5}.online-btn-leave{background:var(--bg-tertiary);border:1px solid var(--border-color);border-radius:6px;color:var(--text-secondary);cursor:pointer;font-size:.8em;font-weight:600;padding:6px 14px;transition:all .2s ease}.online-btn-leave:hover{border-color:var(--accent-primary);color:var(--accent-primary)}.game-action-dialog::backdrop{animation:lobby-fade-in .2s ease-out;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#000000b3}.game-action-card{animation:lobby-slide-up .3s ease-out;background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:16px;max-width:360px;padding:32px;text-align:center;width:90%}.game-action-icon{font-size:2.5em;margin-bottom:12px}.game-action-card h2{color:var(--text-primary);font-size:1.3em;margin:0 0 8px}.game-action-card p{color:var(--text-secondary);font-size:1em;margin:0 0 24px}.game-action-card .game-result-actions{display:flex;gap:12px;justify-content:center}.game-action-card .game-result-actions button{border-radius:10px;cursor:pointer;font-size:.95em;font-weight:600;padding:12px 28px;transition:all .2s ease}.game-action-buttons{display:flex;gap:12px;justify-content:center}.game-action-btn{border-radius:8px;cursor:pointer;font-family:inherit;font-size:.9em;font-weight:600;padding:10px 24px;transition:all .2s ease}.game-action-btn.decline{background:var(--bg-tertiary);border:1px solid var(--border-color);color:var(--text-secondary)}.game-action-btn.decline:hover{border-color:var(--accent-primary);color:var(--accent-primary)}.game-action-btn.accept{background:var(--accent-primary);border:none;color:#fff}.game-action-btn.accept:hover{box-shadow:0 4px 12px #5dade259;transform:translateY(-1px)}.game-action-btn:active{transform:scale(.97)}.game-action-btn:focus-visible{outline:2px solid var(--accent-primary);outline-offset:2px}.game-result-dialog::backdrop{animation:lobby-fade-in .3s ease-out;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);background:#000000bf}.game-result-card{animation:lobby-slide-up .4s ease-out;background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:16px;max-width:380px;padding:36px;text-align:center;width:90%}.game-result-icon{font-size:3em;margin-bottom:12px}.game-result-card h2{color:var(--text-primary);font-size:1.6em;margin:0 0 8px}.game-result-card p{color:var(--text-secondary);font-size:1em;margin:0 0 24px}.game-result-actions{display:flex;gap:10px;justify-content:center}.game-result-actions button{border-radius:10px;cursor:pointer;font-size:.95em;font-weight:600;padding:12px 24px;transition:all .2s ease}.game-result-btn-share{background:#0000;border:1px solid var(--accent-primary);color:var(--accent-primary)}.game-result-btn-share:hover{background:var(--accent-primary);color:#fff;transform:translateY(-1px)}.game-result-btn-share:active{transform:translateY(0) scale(.97)}.game-result-btn-share:focus-visible{outline:2px solid var(--accent-primary);outline-offset:2px}.game-result-btn-new{background:linear-gradient(135deg,var(--online-accent),var(--accent-primary));border:none;color:#fff}.game-result-btn-new:hover{box-shadow:0 4px 16px #5dade259;transform:translateY(-2px)}.game-result-btn-close{background:var(--bg-tertiary);border:1px solid var(--border-color);color:var(--text-secondary)}.game-result-btn-close:hover{border-color:var(--accent-primary);color:var(--accent-primary)}.lobby-btn-online{align-items:center;background:linear-gradient(135deg,var(--online-accent),var(--accent-primary));border:none;border-radius:8px;color:#fff;cursor:pointer;display:flex;font-size:.95em;font-weight:600;gap:8px;justify-content:center;padding:12px 16px;transition:all .25s ease;width:100%}.lobby-btn-online:hover{box-shadow:0 4px 14px #5dade24d;transform:translateY(-1px)}.lobby-btn-online:active{transform:translateY(0)}.lobby-btn-online:disabled{box-shadow:none;cursor:not-allowed;opacity:.5;transform:none}@media (prefers-reduced-motion:reduce){.accessible-dialog::backdrop,.game-action-dialog::backdrop,.game-result-dialog::backdrop{animation:none}.game-action-card,.game-result-card,.lobby-code-value,.online-lobby-card{animation:none}.lobby-waiting-dots .dot{animation:none;opacity:.6}.chat-msg,.chat-reaction-emoji{animation:none}.clock-display.clock-expired{animation:none;opacity:.7}.chat-panel,.online-status-bar,.online-status-dot.reconnecting,.online-status-dot.your-turn{animation:none}}.chat-panel{animation:fade-in-up .3s ease-out;background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:10px;margin-top:12px;overflow:hidden}.chat-messages{display:flex;flex-direction:column;gap:6px;max-height:180px;overflow-y:auto;padding:12px;scrollbar-width:thin}.chat-empty{color:var(--text-secondary);font-size:.8em;font-style:italic;padding:20px 0;text-align:center}.chat-msg{align-items:flex-start;animation:fade-in-up .2s ease-out;display:flex;font-size:.85em;gap:8px}.chat-msg-own{flex-direction:row-reverse}.chat-msg-own .chat-msg-text{background:var(--accent-primary);border-radius:12px 4px 12px 12px;color:#fff}.chat-msg-sender{flex-shrink:0;font-size:.75em;font-weight:600;min-width:40px}.chat-msg-sender.sender-white{color:var(--text-primary)}.chat-msg-sender.sender-black{color:var(--accent-primary)}.chat-msg-text{background:var(--bg-tertiary);border-radius:4px 12px 12px 12px;color:var(--text-primary);line-height:1.3;max-width:80%;padding:6px 12px;word-break:break-word}.chat-msg-time{display:block;font-size:.65em;margin-top:3px;opacity:.5;text-align:right}.chat-msg-own .chat-msg-time{color:#ffffffb3}.chat-reaction{justify-content:center;padding:2px 0}.chat-reaction-emoji{animation:lobby-slide-up .3s ease-out;cursor:default;font-size:1.8em;transition:transform .2s ease}.chat-reaction-emoji:hover{transform:scale(1.3)}.chat-reactions{border-top:1px solid var(--border-color);display:flex;flex-wrap:wrap;gap:4px;justify-content:center;padding:8px 12px}.reaction-btn{background:var(--bg-tertiary);border:1px solid var(--border-color);border-radius:8px;cursor:pointer;font-size:1.2em;line-height:1;padding:6px 10px;transition:all .2s ease}.reaction-btn:hover{background:var(--bg-secondary);border-color:var(--accent-primary);transform:scale(1.15)}.reaction-btn:active{transform:scale(.95)}.chat-input-row{border-top:1px solid var(--border-color);display:flex;gap:8px;padding:8px 12px}.chat-input{background:var(--bg-primary);border:1px solid var(--border-color);border-radius:8px;color:var(--text-primary);flex:1 1;font-family:inherit;font-size:.85em;outline:none;padding:8px 12px;transition:border-color .2s ease}.chat-input:focus{border-color:var(--accent-primary)}.chat-input::placeholder{color:var(--text-secondary)}.chat-send-btn{background:var(--accent-primary);border:none;border-radius:8px;color:#fff;cursor:pointer;font-size:.85em;font-weight:600;padding:8px 16px;transition:all .2s ease;white-space:nowrap}.chat-send-btn:hover{background:var(--accent-primary-hover)}.chat-send-btn:disabled{cursor:not-allowed;opacity:.5}.clock-container{align-items:stretch;display:flex;gap:8px}.clock-display{align-items:center;background:var(--bg-primary);border:2px solid var(--border-color);border-radius:8px;display:flex;flex-direction:column;min-width:70px;padding:4px 10px;transition:all .3s ease}.clock-display.clock-active{background:var(--bg-secondary);border-color:var(--accent-primary);box-shadow:0 0 12px #5dade240}.clock-display.clock-expired{animation:clock-expired-pulse 1s ease-in-out infinite;background:#ef44441a;border-color:var(--danger-color)}@keyframes clock-expired-pulse{0%,to{opacity:1}50%{opacity:.6}}.clock-label{color:var(--text-secondary);font-size:.6em;font-weight:600;letter-spacing:1px;text-transform:uppercase}.clock-time{font-feature-settings:"tnum";color:var(--text-primary);font-family:Inter,monospace;font-size:1em;font-variant-numeric:tabular-nums;font-weight:700;line-height:1.3}.clock-display.clock-expired .clock-time{color:var(--danger-color)}.lobby-time-control{display:flex;flex-direction:column;gap:8px}.lobby-time-label{color:var(--text-secondary);font-size:.75em;font-weight:600;letter-spacing:1.2px;text-transform:uppercase}.lobby-time-options{display:flex;flex-wrap:wrap;gap:4px}.lobby-time-btn{background:var(--bg-primary);border:1px solid var(--border-color);border-radius:6px;color:var(--text-secondary);cursor:pointer;flex:1 1;font-family:inherit;font-size:.78em;font-weight:600;min-width:48px;padding:6px 8px;text-align:center;transition:all .2s ease}.lobby-time-btn:hover{border-color:var(--accent-primary);color:var(--text-primary)}.lobby-time-btn.active,.lobby-time-btn[aria-pressed=true]{background:var(--accent-primary);border-color:var(--accent-primary);color:#fff}.online-mode-badge{align-items:center;background:#10b9811a;border:1px solid #10b9814d;border-radius:20px;color:var(--online-accent);display:inline-flex;font-size:.75em;font-weight:600;gap:6px;letter-spacing:.5px;padding:4px 10px;text-transform:uppercase}.online-mode-badge .dot{background:var(--online-accent);border-radius:50%;height:6px;width:6px}@media (max-width:480px){.game-action-buttons{flex-direction:column;gap:8px}.game-action-buttons .game-action-btn{width:100%}.online-lobby-card{padding:20px;width:95%}.lobby-header h2{font-size:1.2em}.lobby-code-value{gap:8px;padding:10px 16px}.lobby-code-value span{font-size:1.4em;letter-spacing:4px}.lobby-btn-create{font-size:.95em;padding:12px 16px}.lobby-join-row{flex-direction:column}.lobby-btn-join{width:100%}.lobby-code-input{font-size:1em;padding:10px 12px}.online-status-bar{flex-direction:column;gap:8px;padding:10px}.online-status-info{font-size:.8em}.online-status-actions,.online-status-info{flex-wrap:wrap;justify-content:center}.online-btn-draw,.online-btn-leave,.online-btn-resign,.online-btn-takeback{font-size:.7em;padding:6px 10px}.chat-panel{margin-top:8px}.chat-messages{max-height:140px;padding:8px}.chat-msg{font-size:.8em}.chat-msg-text{max-width:90%}.chat-reactions{gap:3px;padding:6px 8px}.reaction-btn{font-size:1em;padding:4px 7px}.game-action-card,.game-result-card{padding:24px 16px}.game-result-card h2{font-size:1.3em}.game-action-card .game-result-actions{flex-direction:column;gap:8px}.game-action-card .game-result-actions button{width:100%}}.puzzle-mode .App-body{grid-template-columns:260px 1fr 200px}.puzzle-info-panel{animation:pp-fade-in .5s ease-out forwards;display:flex;flex-direction:column;gap:16px;padding:20px}@keyframes pp-fade-in{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}.puzzle-header{align-items:flex-start;display:flex;gap:12px;justify-content:space-between}.puzzle-title{color:var(--text-primary);font-size:1.2em;font-weight:700;margin:0}.puzzle-meta{flex-shrink:0;gap:8px}.puzzle-meta,.puzzle-rating{align-items:center;display:flex}.puzzle-rating{color:var(--accent-primary);font-size:.85em;font-weight:600;gap:4px}.puzzle-id{background:var(--bg-tertiary);border-radius:4px;color:var(--text-secondary);font-size:.75em;padding:2px 8px;transition:background .2s ease}.puzzle-id:hover{background:var(--bg-secondary)}.puzzle-themes{display:flex;flex-wrap:wrap;gap:4px}.puzzle-theme-tag{background:var(--bg-tertiary);border:1px solid var(--border-color);border-radius:4px;color:var(--accent-primary);font-size:.7em;font-weight:600;letter-spacing:.5px;padding:3px 8px;text-transform:uppercase;transition:all .2s ease}.puzzle-theme-tag:hover{background:var(--bg-secondary);border-color:var(--accent-primary);transform:translateY(-1px)}.puzzle-description{color:var(--text-secondary);font-size:.85em;line-height:1.4;margin:0}.puzzle-stats{display:flex;gap:12px}.puzzle-stat{align-items:center;background:var(--bg-primary);border:1px solid var(--border-color);border-radius:8px;display:flex;flex:1 1;flex-direction:column;gap:2px;padding:10px;transition:all .2s ease}.puzzle-stat:hover{background:var(--bg-secondary);border-color:var(--accent-primary)}.stat-value{color:var(--text-primary);font-size:1.3em;font-weight:700}.stat-label{color:var(--text-secondary);font-size:.65em;font-weight:600;letter-spacing:1px;text-transform:uppercase}.puzzle-progress{align-items:center;display:flex;gap:8px}.progress-bar{background:var(--bg-primary);border-radius:3px;flex:1 1;height:6px;overflow:hidden}.progress-fill{background:linear-gradient(90deg,var(--accent-primary),var(--online-accent));border-radius:3px;height:100%;transition:width .4s cubic-bezier(.34,1.56,.64,1)}.progress-text{color:var(--text-secondary);flex-shrink:0;font-size:.75em;font-weight:600}.puzzle-solved-banner{align-items:center;animation:pp-solved-pop .5s cubic-bezier(.34,1.56,.64,1);background:linear-gradient(135deg,#10b9811f,#10b9810f);border:1px solid #10b9814d;border-radius:10px;display:flex;gap:8px;justify-content:center;padding:14px}@keyframes pp-solved-pop{0%{opacity:0;transform:scale(.85)}60%{opacity:1;transform:scale(1.05)}to{transform:scale(1)}}.solved-icon{animation:pp-solved-bounce .6s ease-out .3s;font-size:1.5em}@keyframes pp-solved-bounce{0%,to{transform:translateY(0)}40%{transform:translateY(-8px) scale(1.2)}60%{transform:translateY(-3px)}}.solved-text{color:var(--online-accent);font-size:1em;font-weight:700}.puzzle-actions{display:flex;flex-wrap:wrap;gap:8px}.puzzle-btn{align-items:center;background:var(--bg-tertiary);border:1px solid var(--border-color);border-radius:8px;color:var(--text-primary);cursor:pointer;display:flex;font-family:inherit;font-size:.8em;font-weight:600;gap:6px;padding:8px 14px;transition:all .2s ease}.puzzle-btn:hover{border-color:var(--accent-primary);color:var(--accent-primary)}.puzzle-btn:active:not(:disabled){transform:scale(.95)}.puzzle-btn:disabled{cursor:not-allowed;opacity:.4}.puzzle-btn:focus-visible{outline:2px solid var(--accent-primary);outline-offset:2px}.puzzle-btn-primary{background:linear-gradient(135deg,var(--online-accent),var(--accent-primary));border:none;color:#fff}.puzzle-btn-primary:hover{box-shadow:0 4px 12px #5dade24d;color:#fff;transform:translateY(-1px)}.puzzle-btn-primary:active:not(:disabled){transform:translateY(0) scale(.97)}.puzzle-btn-start{align-items:center;background:linear-gradient(135deg,var(--accent-primary),#a78bfa);border:none;border-radius:10px;color:#fff;cursor:pointer;display:flex;font-family:inherit;font-size:1em;font-weight:600;gap:8px;justify-content:center;padding:14px 20px;transition:all .25s ease;width:100%}.puzzle-btn-start:hover{box-shadow:0 6px 20px #5dade259;transform:translateY(-2px)}.puzzle-btn-start:active:not(:disabled){transform:translateY(0) scale(.97)}.puzzle-btn-start:focus-visible{outline:2px solid #fff;outline-offset:2px}.puzzle-start-screen{align-items:center;display:flex;flex-direction:column;gap:16px;padding-top:40px;text-align:center}.puzzle-start-icon{animation:pp-float 3s ease-in-out infinite;font-size:3em}@keyframes pp-float{0%,to{transform:translateY(0)}50%{transform:translateY(-8px)}}.puzzle-start-screen h2{color:var(--text-primary);font-size:1.3em;margin:0}.puzzle-start-screen p{color:var(--text-secondary);font-size:.85em;line-height:1.5;margin:0}.puzzle-board-wrapper{position:relative}.puzzle-moves-panel{animation:pp-fade-in .5s ease-out .15s both;display:flex;flex-direction:column;gap:12px;padding:20px}.panel-title{color:var(--text-secondary);font-size:.9em;font-weight:700;letter-spacing:1.5px;margin:0;text-transform:uppercase}.puzzle-solution-list{display:flex;flex-direction:column;gap:2px;max-height:400px;overflow-y:auto}.solution-move{align-items:center;border-radius:6px;display:flex;font-size:.85em;gap:8px;padding:6px 10px;transition:all .2s ease}.solution-move:hover{background:var(--bg-primary)}.solution-move.played{background:#10b98114;color:var(--online-accent)}.solution-move.next{animation:pulse-glow 2s ease-in-out infinite;background:#5dade21a;border:1px solid var(--accent-primary)}.move-number{color:var(--text-secondary);font-size:.75em;font-weight:600;min-width:24px;text-align:right}.move-san{font-family:Inter,monospace;font-weight:600}.move-san.player{color:var(--text-primary)}.move-san.opponent{color:var(--text-secondary)}.puzzle-nav{display:flex;gap:8px;margin-top:auto}.puzzle-nav-btn{align-items:center;background:var(--bg-tertiary);border:1px solid var(--border-color);border-radius:8px;color:var(--text-secondary);cursor:pointer;display:flex;flex:1 1;font-family:inherit;font-size:.8em;font-weight:600;gap:4px;justify-content:center;padding:8px;transition:all .2s ease}.puzzle-nav-btn:hover{border-color:var(--accent-primary);color:var(--text-primary)}.puzzle-nav-btn:active:not(:disabled){transform:scale(.95)}.puzzle-nav-btn:focus-visible{outline:2px solid var(--accent-primary);outline-offset:2px}.puzzle-start-info{padding-top:40px;text-align:center}.puzzle-start-info p{color:var(--text-secondary);font-size:.85em;line-height:1.5;margin:0 0 12px}.puzzle-start-sub{font-size:.8em}@keyframes pulse-hint{0%,to{opacity:.6}50%{opacity:1}}.difficulty-selector{display:flex;flex-direction:column;gap:8px;width:100%}.difficulty-label{align-items:center;color:var(--text-secondary);font-size:.75em;font-weight:600;letter-spacing:1px;text-transform:uppercase}.difficulty-buttons,.difficulty-label{display:flex;gap:6px}.diff-btn{background:var(--bg-tertiary);border:1px solid var(--border-color);border-radius:8px;color:var(--text-secondary);cursor:pointer;flex:1 1;font-family:inherit;font-size:.8em;font-weight:600;padding:8px 12px;text-align:center;transition:all .2s ease}.diff-btn:hover{border-color:var(--accent-primary);color:var(--text-primary)}.diff-btn:active:not(:disabled){transform:scale(.95)}.diff-btn.active{background:linear-gradient(135deg,var(--accent-primary),#a78bfa);border-color:#0000;box-shadow:0 2px 8px #5dade24d;color:#fff}.diff-btn:focus-visible{outline:2px solid var(--accent-primary);outline-offset:2px}.difficulty-filter-bar{display:flex;gap:6px;padding:4px 0}.difficulty-filter-bar .diff-btn{font-size:.75em;padding:5px 10px}@media (max-width:768px){.puzzle-mode .App-body{grid-template-areas:"chessboard" "info" "solution";grid-template-columns:1fr}.puzzle-info-panel,.puzzle-moves-panel{padding:16px}.puzzle-stats{gap:8px}.puzzle-stat{padding:8px}.stat-value{font-size:1.1em}.puzzle-actions{justify-content:center}.puzzle-solution-list{max-height:200px}}@media (prefers-reduced-motion:reduce){.puzzle-info-panel,.puzzle-moves-panel,.puzzle-solved-banner,.puzzle-start-icon,.solved-icon{animation:none}.progress-fill{transition:none}.solution-move.next{animation:none}}.gh-panel{flex-direction:column;width:100%}.gh-header,.gh-panel{display:flex;gap:12px}.gh-header{align-items:center;justify-content:space-between}.gh-title{color:var(--text-primary);font-size:1.1em;font-weight:700;margin:0}.gh-count{background:var(--bg-tertiary);border-radius:12px;color:var(--text-secondary);font-size:.75em;font-weight:600;padding:3px 10px}.gh-loading{display:flex;flex-direction:column;gap:8px}.gh-skeleton{animation:skeleton-pulse 1.5s ease-in-out infinite;background:var(--bg-tertiary);border-radius:10px;height:64px}@keyframes skeleton-pulse{0%,to{opacity:.4}50%{opacity:.8}}.gh-empty{align-items:center;display:flex;flex-direction:column;gap:12px;padding:40px 20px;text-align:center}.gh-empty-icon{font-size:3em}.gh-empty h3{color:var(--text-primary);font-size:1.1em;margin:0}.gh-empty p{color:var(--text-secondary);font-size:.85em;line-height:1.5;margin:0;max-width:280px}.gh-list{display:flex;flex-direction:column;gap:6px;max-height:480px;overflow-y:auto}.gh-item{align-items:stretch;animation:gh-item-fade .4s ease-out both;animation-delay:0s;animation-delay:calc(var(--stagger, 0)*.05s);display:flex;gap:4px}@keyframes gh-item-fade{0%{opacity:0;transform:translateX(-8px)}to{opacity:1;transform:translateX(0)}}.gh-item-main{background:var(--bg-tertiary);border:1px solid var(--border-color);border-radius:10px;color:var(--text-primary);cursor:pointer;display:flex;flex:1 1;flex-direction:column;font-family:inherit;gap:6px;padding:10px 14px;text-align:left;transition:all .2s ease}.gh-item-main:hover{background:var(--bg-secondary);border-color:var(--accent-primary)}.gh-item-main:focus-visible{outline:2px solid var(--accent-primary);outline-offset:2px}.gh-item-top{gap:8px;justify-content:space-between}.gh-item-top,.gh-source{align-items:center;display:flex}.gh-source{color:var(--accent-primary);font-size:.7em;font-weight:600;gap:4px;letter-spacing:.5px;text-transform:uppercase}.gh-date{color:var(--text-secondary);font-size:.7em;font-weight:500}.gh-item-bottom{align-items:center;display:flex;gap:12px}.gh-result{color:var(--text-primary);font-size:.85em;font-weight:600}.gh-reason{font-size:.85em;font-weight:400}.gh-moves,.gh-reason{color:var(--text-secondary)}.gh-moves{font-size:.7em;font-weight:500;margin-left:auto}.gh-replay-icon{align-items:center;color:var(--accent-primary);display:flex;flex-shrink:0;font-size:.7em;font-weight:600;gap:4px;opacity:0;transition:opacity .2s ease}.gh-item-main:hover .gh-replay-icon{opacity:1}.gh-delete-btn{align-items:center;background:var(--bg-tertiary);border:1px solid var(--border-color);border-radius:10px;color:var(--text-secondary);cursor:pointer;display:flex;justify-content:center;padding:0;transition:all .2s ease;width:36px}.gh-delete-btn:hover{background:#ef444414;border-color:#ef4444;color:#ef4444}.gh-delete-btn:disabled{cursor:not-allowed;opacity:.4}.gh-delete-btn:focus-visible{outline:2px solid #ef4444;outline-offset:2px}.history-page-layout .App-body{display:flex;justify-content:center}.history-page{animation:hp-fade-in .5s ease-out forwards;display:flex;flex-direction:column;gap:24px;max-width:600px;padding:32px 24px;width:100%}@keyframes hp-fade-in{0%{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}.history-header{align-items:flex-start;animation:hp-fade-in .5s ease-out .1s both;display:flex;gap:16px}.history-back-btn{align-items:center;background:var(--bg-tertiary);border:1px solid var(--border-color);border-radius:10px;color:var(--text-primary);cursor:pointer;display:flex;flex-shrink:0;height:40px;justify-content:center;margin-top:4px;transition:all .2s ease;width:40px}.history-back-btn:hover{border-color:var(--accent-primary);color:var(--accent-primary);transform:translateX(-2px)}.history-back-btn:active:not(:disabled){transform:translateX(-2px) scale(.95)}.history-back-btn:focus-visible{outline:2px solid var(--accent-primary);outline-offset:2px}.history-header-text{flex:1 1}.history-title{color:var(--text-primary);font-size:1.4em;font-weight:700;margin:0}.history-subtitle{color:var(--text-secondary);font-size:.85em;margin:4px 0 0}.history-header-icon{align-items:center;animation:hp-fade-in .5s ease-out .15s both;background:linear-gradient(135deg,var(--accent-primary),#a78bfa);border-radius:14px;color:#fff;display:flex;flex-shrink:0;height:56px;justify-content:center;transition:transform .3s ease,box-shadow .3s ease;width:56px}.history-header-icon:hover{box-shadow:0 4px 16px #5dade24d;transform:scale(1.05) rotate(-3deg)}.replay-modal-content{animation:hp-fade-in .3s ease-out;display:flex;flex-direction:column;padding:8px 0}.replay-actions{display:flex;gap:8px;justify-content:flex-end}.replay-actions button{transition:all .2s ease}.replay-actions button:active:not(:disabled){transform:scale(.97)}.replay-actions button:focus-visible{outline:2px solid var(--accent-primary);outline-offset:2px}@media (max-width:768px){.history-page{padding:20px 16px}.history-header-icon{display:none}}@media (prefers-reduced-motion:reduce){.history-header,.history-header-icon,.history-page,.replay-modal-content{animation:none}.history-back-btn:hover,.history-header-icon:hover{transform:none}}