:root{--bg-app:#02040a;--glass-bg:#0f172aa6;--glass-bg-hover:#0f172acc;--glass-border:1px solid #ffffff14;--glass-border-bright:1px solid #ffffff26;--glass-shadow:0 8px 32px 0 #000000b3;--glass-reflection:linear-gradient(145deg, #ffffff0d 0%, transparent 40%);--bg-panel:var(--glass-bg);--bg-board-dark:#1e293b;--bg-board-light:#94a3b8;--cell-accent:#6366f126;--accent-primary:#6366f1;--accent-secondary:#ec4899;--accent-tertiary:#10b981;--accent-hover:#818cf8;--accent-glow:#6366f180;--accent-gradient:linear-gradient(135deg, #6366f1 0%, #ec4899 100%);--accent-gradient-hover:linear-gradient(135deg, #818cf8 0%, #f472b6 100%);--text-main:#f8fafc;--text-muted:#94a3b8;--text-dim:#64748b;--success:#34d399;--danger:#fb7185;--warning:#fbbf24;--cell-size:min(8vw, 64px);--radius-xl:24px;--radius-lg:16px;--radius-md:12px;--radius-sm:8px;--transition-fast:.2s cubic-bezier(.4, 0, .2, 1);--transition-normal:.3s cubic-bezier(.4, 0, .2, 1);--transition-slow:.6s cubic-bezier(.2, .8, .2, 1);--transition-bounce:.5s cubic-bezier(.34, 1.56, .64, 1);--font-main:"Outfit", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--grid-line-color:#ffffff1a;--z-background:-1;--z-board:10;--z-ui:50;--z-overlay:100;--z-modal:200;--z-tooltip:300;--vh-100:100vh;--dvh-100:100vh}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent;margin:0;padding:0}@media (pointer:coarse){*{touch-action:manipulation}#board,.cell,.piece-svg,.promotion-option{-webkit-user-select:none;user-select:none}}:root{--safe-area-inset-top:env(safe-area-inset-top,0);--safe-area-inset-right:env(safe-area-inset-right,0);--safe-area-inset-bottom:env(safe-area-inset-bottom,0);--safe-area-inset-left:env(safe-area-inset-left,0)}@media screen and (width<=768px){input,select,textarea{font-size:16px!important}}body{font-family:var(--font-main);background-color:var(--bg-app);color:var(--text-main);background-image:radial-gradient(circle at 10% 20%,#6366f126 0%,#0000 40%),radial-gradient(circle at 90% 80%,#ec489926 0%,#0000 40%),radial-gradient(circle,#10b9810d 0%,#0000 60%);background-attachment:fixed;flex-direction:column;height:100dvh;margin:0;display:flex;position:relative;overflow:hidden}body:before{content:"";pointer-events:none;width:100%;height:100%;z-index:var(--z-background);background:url("data:image/svg+xml;utf8,<svg opacity=\"0.04\" viewBox=\"0 0 200 200\" xmlns=\"http://www.w3.org/2000/svg\"><filter id=\"noiseFilter\"><feTurbulence type=\"fractalNoise\" baseFrequency=\"0.65\" numOctaves=\"3\" stitchTiles=\"stitch\"/></filter><rect width=\"100%\" height=\"100%\" filter=\"url(%23noiseFilter)\"/></svg>");position:absolute;top:0;left:0}.hidden{display:none!important}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:#0000001a}::-webkit-scrollbar-thumb{background:#ffffff1a;border-radius:4px}::-webkit-scrollbar-thumb:hover{background:#fff3}:focus{outline:none}:focus-visible{outline:2px solid var(--accent-primary);outline-offset:2px;border-radius:6px}button:focus-visible,a:focus-visible,select:focus-visible,input:focus-visible,summary:focus-visible,[tabindex]:not([tabindex="-1"]):focus-visible,.skin-selector:focus-visible,.action-icon-btn:focus-visible,.menu-item:focus-visible,.menu-tab-btn:focus-visible,.gamemode-card:focus-visible,.shop-item:focus-visible,.tab-btn:focus-visible,.icon-btn:focus-visible{box-shadow:0 0 0 2px var(--bg-app), 0 0 0 4px var(--accent-primary), 0 0 12px var(--accent-glow);outline:none}@media (prefers-contrast:more){:focus-visible,button:focus-visible,a:focus-visible,select:focus-visible,input:focus-visible,.action-icon-btn:focus-visible,.icon-btn:focus-visible{outline-offset:2px;outline:3px solid #fff;box-shadow:0 0 0 5px #000}.status-pill,.stat-pill{border-color:#fff}}@media (pointer:coarse){button,a,select,input,summary,[tabindex]:not([tabindex="-1"]),.menu-item,.shop-item,.gamemode-card,.tab-btn,.icon-btn,.promotion-option,.action-icon-btn{min-width:44px;min-height:44px}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.001ms!important;animation-duration:.001ms!important;animation-iteration-count:1!important}}body[data-theme=blue]{--bg-board-dark:#3b5998;--bg-board-light:#8b9dc3;--corridor-bg:#f59e0b26;--corridor-border:#f59e0b66;--corridor-bg-hover:#f59e0b40;--corridor-border-hover:#f59e0b99;--grid-line-color:#0f172a}body[data-theme=green]{--bg-board-dark:#769656;--bg-board-light:#eeeed2;--corridor-bg:#ffff0026;--corridor-border:#ff06;--corridor-bg-hover:#ffff0040;--corridor-border-hover:#ff09}body[data-theme=classic]{--bg-board-dark:#475569;--bg-board-light:#e2e4e9;--corridor-bg:#6366f126;--corridor-border:#6366f166;--corridor-bg-hover:#6366f140;--corridor-border-hover:#6366f199}body[data-theme=wood]{--bg-board-dark:#b58863;--bg-board-light:#f0d9b5;--corridor-bg:#16653433;--corridor-border:#16653480;--corridor-bg-hover:#1665344d;--corridor-border-hover:#166534b3;--grid-line-color:#271202}body[data-theme=dark]{--bg-board-dark:#1a1a1a;--bg-board-light:#404040;--corridor-bg:#ec489926;--corridor-border:#ec489966;--corridor-bg-hover:#ec489940;--corridor-border-hover:#ec489999;--grid-line-color:#f472b6}#top-layer{width:100%;height:0;z-index:var(--z-tooltip);pointer-events:none;position:fixed;top:0;left:0}#top-layer>*{pointer-events:auto}#overlay-layer{width:100%;height:100%;z-index:var(--z-modal);pointer-events:none;position:fixed;top:0;left:0}#overlay-layer>:not(.hidden){pointer-events:auto}#panel-layer{width:100%;height:100%;z-index:var(--z-overlay);pointer-events:none;position:fixed;top:0;left:0}#panel-layer>:not(.hidden){pointer-events:auto}#game-layer{z-index:var(--z-ui);width:100%;height:100%;position:relative}#app-container{flex-direction:column;justify-content:space-between;max-width:600px;height:100dvh;margin:0 auto;padding:0 1rem 40vh;display:flex;position:relative;overflow:hidden auto}@media (width<=768px){#app-container{max-width:100vw;min-height:100vh;min-height:-webkit-fill-available;padding:env(safe-area-inset-top) .5rem env(safe-area-inset-bottom);padding-bottom:max(40vh, env(safe-area-inset-bottom) + 120px)}}@media (width<=480px){#app-container{padding-bottom:max(40vh, env(safe-area-inset-bottom) + 100px)}}.minimal-header{height:50px;z-index:var(--z-ui);justify-content:space-between;align-items:center;padding:.75rem 0;display:flex}.logo{-webkit-text-fill-color:transparent;letter-spacing:-.5px;background:linear-gradient(135deg,#fff,#94a3b8);-webkit-background-clip:text;background-clip:text;font-size:1.1rem;font-weight:800}.status-pill,.stat-pill{color:var(--text-main);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#ffffff0d;border:1px solid #ffffff1a;border-radius:20px;padding:4px 12px;font-size:.75rem;font-weight:500}.stat-pill{background:var(--accent-glow);border-color:var(--accent-primary);font-weight:600}.icon-btn{color:var(--text-main);cursor:pointer;background:0 0;border:none;border-radius:50%;padding:8px;transition:all .2s}.icon-btn:hover{background:#ffffff1a;transform:rotate(90deg)}.game-area{flex-direction:column;flex:1;justify-content:center;gap:1rem;width:100%;display:flex}.player-info{background:var(--glass-bg);-webkit-backdrop-filter:blur(16px);border:var(--glass-border);border-radius:var(--radius-lg);height:64px;box-shadow:var(--glass-shadow);transition:all var(--transition-normal);justify-content:space-between;align-items:center;padding:.5rem 1rem;display:flex;position:relative;overflow:hidden}.player-info:after{content:"";background:var(--accent-gradient);width:0%;height:2px;transition:width .5s;position:absolute;bottom:0;left:0}.player-info.active:after{width:100%}.player-info.active{border-color:#6366f14d;box-shadow:0 0 20px #6366f126}.player-avatar{color:var(--text-muted);margin-right:1rem}.player-info.active .player-avatar{color:var(--accent-primary)}.player-details{flex-direction:column;flex:1;justify-content:center;display:flex;overflow:hidden}.player-name{margin-bottom:2px;font-size:.95rem;font-weight:700}.captured-pieces{gap:-4px;height:18px;padding-left:4px;display:flex;overflow:hidden}.captured-piece-icon{filter:drop-shadow(0 2px 2px #00000080);width:18px;height:18px}.clock-display{color:var(--text-dim);background:#0003;border-radius:8px;padding:4px 12px;font-family:JetBrains Mono,monospace;font-size:1.25rem;font-weight:700;transition:all .3s}.clock-display.active{color:#fff;background:var(--accent-gradient);box-shadow:0 0 15px var(--accent-glow)}.clock-display.low-time{background:var(--danger);animation:1s infinite pulse-red}.action-bar{-webkit-backdrop-filter:blur(20px);border:var(--glass-border-bright);transition:var(--transition-normal);background:#0f172ad9;border-radius:24px;justify-content:center;align-items:center;gap:.5rem;width:fit-content;margin-bottom:1.5rem;margin-left:auto;margin-right:auto;padding:.75rem 1rem;display:flex;box-shadow:0 10px 40px #00000080}@media (width<=768px){.action-bar{bottom:env(safe-area-inset-bottom);width:auto;max-width:calc(100vw - 2rem);z-index:var(--z-overlay);-webkit-overflow-scrolling:touch;scrollbar-width:none;border-radius:28px;flex-wrap:nowrap;gap:.375rem;margin-bottom:0;padding:.625rem 1.25rem;position:fixed;left:50%;overflow:auto hidden;transform:translate(-50%)}.action-bar::-webkit-scrollbar{display:none}}@media (width<=480px){.action-bar{gap:.25rem;padding:.5rem 1rem}.action-icon-btn{width:44px;min-width:44px;height:44px;min-height:44px}}.action-icon-btn{color:var(--text-muted);cursor:pointer;width:48px;height:48px;transition:all var(--transition-bounce);background:0 0;border:1px solid #0000;border-radius:14px;flex-direction:column;justify-content:center;align-items:center;gap:1px;padding:2px;display:flex;position:relative}.action-icon-btn:hover{color:#fff;background:#ffffff1a;transform:translateY(-4px)scale(1.06);box-shadow:0 4px 12px #0000004d}.action-icon-btn.active{background:var(--accent-gradient);color:#fff;box-shadow:0 0 15px var(--accent-glow);transform:translateY(-3px)}.action-icon-btn svg{stroke-width:2px;flex-shrink:0;width:22px;height:22px}.action-label{letter-spacing:.02em;text-overflow:ellipsis;white-space:nowrap;max-width:56px;color:inherit;opacity:.85;font-size:.56rem;font-weight:600;line-height:1;overflow:hidden}.action-shortcut{color:var(--text-muted);opacity:0;transition:opacity var(--transition-fast);background:#00000073;border-radius:4px;padding:1px 3px;font-size:.5rem;font-weight:700;line-height:1;position:absolute;top:2px;right:3px}.action-icon-btn:hover .action-shortcut,.action-icon-btn:focus-visible .action-shortcut{opacity:1}@media (pointer:coarse){.action-label,.action-shortcut{display:none}.action-icon-btn{flex-direction:row}.action-icon-btn svg{width:24px;height:24px}}.skin-selector-wrapper{padding:0;overflow:visible}.skin-selector-wrapper .action-label{margin-top:-2px}.skin-selector{opacity:0;width:100%;height:100%;color:inherit;cursor:pointer;background:0 0;border:none;font-size:0;position:absolute;inset:0}.skin-selector:focus{outline:none}.skin-selector option{color:#fff;background-color:#0f172a;font-size:.85rem}.close-icon-btn{color:var(--text-muted);cursor:pointer;background:0 0;border:none;padding:4px;font-size:1.5rem;line-height:1;transition:color .2s}.close-icon-btn:hover{color:var(--text-main);transform:scale(1.1)}.analysis-panel{background:var(--glass-bg);-webkit-backdrop-filter:blur(20px);border:var(--glass-border);border-radius:var(--radius-lg);width:280px;box-shadow:var(--glass-shadow);z-index:var(--z-modal);color:var(--text-main);flex-direction:column;transition:all .3s cubic-bezier(.34,1.56,.64,1);display:flex;position:fixed;top:80px;right:20px}.analysis-panel.hidden{opacity:0;pointer-events:none;transform:translate(40px)scale(.95)}.analysis-header{border-bottom:1px solid #ffffff1a;justify-content:space-between;align-items:center;padding:12px 16px;display:flex}.analysis-header h3{letter-spacing:.5px;color:var(--accent-primary);margin:0;font-size:.9rem;font-weight:700}.eval-bar-container{background:#333;border-radius:4px;flex:1;height:8px;position:relative;overflow:hidden}.top-moves-section h4{color:var(--text-muted);text-transform:uppercase;margin:0 0 10px;font-size:.8rem}.top-move-item{cursor:pointer;background:#ffffff0d;border:1px solid #0000;border-radius:8px;justify-content:space-between;align-items:center;padding:8px 12px;transition:all .2s;display:flex}.top-move-item:hover{border-color:var(--accent-primary);background:#ffffff1a}.move-notation{color:#fff;font-weight:600}.move-eval{color:var(--text-muted);font-size:.8rem}.analysis-controls{color:var(--text-muted);justify-content:space-between;align-items:center;margin-top:8px;font-size:.7rem;display:flex}.close-icon-btn{color:var(--text-muted);cursor:pointer;background:0 0;border:none;padding:4px;font-size:1.2rem}@media (width<=768px){.analysis-panel{width:calc(100% - 40px);top:auto;bottom:20px;right:20px}}#board-container{aspect-ratio:1;justify-content:center;align-items:center;width:100%;padding:0 0 30px 30px;display:flex;position:relative}@media (width<=768px){#board-container{aspect-ratio:1;width:100vw;max-width:100vw;height:auto;max-height:calc(100vh - env(safe-area-inset-top) - env(safe-area-inset-bottom) - 120px);box-sizing:border-box;margin:0 auto;padding:0}}@media (width<=480px){#board-container{max-height:calc(100vh - env(safe-area-inset-top) - env(safe-area-inset-bottom) - 80px)}}#board-wrapper{z-index:20;pointer-events:auto;opacity:1;width:100%;height:100%;transition:opacity .3s;position:absolute;top:0;left:0}body.mode-3d #battle-chess-3d-container{opacity:1;pointer-events:all}body.mode-3d #board-container{padding:0}body.mode-3d #board-wrapper{opacity:0;pointer-events:none}#board-wrapper{width:100%;height:100%;position:relative}#board.board-8x8{grid-template-rows:repeat(8,1fr);grid-template-columns:repeat(8,1fr)}#board{z-index:10;touch-action:manipulation;border-radius:4px;grid-template-rows:repeat(9,1fr);grid-template-columns:repeat(9,1fr);width:100%;height:100%;display:grid;overflow:hidden;box-shadow:0 10px 30px #00000080}.col-labels{text-align:center;pointer-events:none;width:100%;display:grid;position:absolute;bottom:-24px;left:0}.row-labels{text-align:right;pointer-events:none;align-items:center;height:100%;display:grid;position:absolute;top:0;left:-24px}.coord-label{color:var(--text-muted);text-transform:uppercase;font-size:.75rem;font-weight:600}#board:not(.board-8x8) .cell:nth-child(9n+3),#board:not(.board-8x8) .cell:nth-child(9n+6){border-right:4px solid #000}#board:not(.board-8x8) .cell:nth-child(n+19):nth-child(-n+27),#board:not(.board-8x8) .cell:nth-child(n+46):nth-child(-n+54){border-bottom:4px solid #000}.cell{justify-content:center;align-items:center;width:100%;height:100%;transition:transform .15s,box-shadow .15s;display:flex;position:relative}.cell.light{background-color:var(--bg-board-light);color:var(--bg-board-dark)}.cell.dark{background-color:var(--bg-board-dark);color:var(--bg-board-light)}.cell.blocked-square{opacity:.6;cursor:not-allowed;pointer-events:none;background:repeating-linear-gradient(45deg,#1a1a2e,#1a1a2e 10px,#0f0f1a 10px 20px)!important}.cell.blocked-square:after{content:"";background:#00000080;position:absolute;inset:0}.cell.border-right{border-right:4px solid var(--grid-line-color)}.cell.border-bottom{border-bottom:4px solid var(--grid-line-color)}.cell.selected{box-shadow:inset 0 0 0 4px var(--accent-primary)}.cell.last-move{background-color:#6366f166!important}.cell.valid-move:after{content:"";background:#0003;border-radius:50%;width:16px;height:16px}.cell.capture-move:after{content:"";box-sizing:border-box;background:0 0;border:4px solid #ef444480;border-radius:50%;width:100%;height:100%}.cell.dragging{opacity:.5;transform:scale(.95)}.cell.drag-target{box-shadow:inset 0 0 0 3px #10b98180;background-color:#10b9811a!important}.cell.drag-over{box-shadow:inset 0 0 0 4px var(--success);transition:all .1s;transform:scale(1.02);background-color:#10b98140!important}.cell.hover-move{box-shadow:inset 0 0 8px #6366f166}.cell.hover-piece{box-shadow:inset 0 0 0 2px #6366f199}.cell.selectable-corridor{cursor:pointer;box-shadow:inset 0 0 0 100px var(--corridor-bg), inset 0 0 0 1px var(--corridor-border)!important}.cell.selectable-corridor:hover{box-shadow:inset 0 0 0 100px var(--corridor-bg-hover), inset 0 0 0 1px var(--corridor-border-hover)!important}.cell.upgradable-piece{cursor:pointer;transition:box-shadow .3s;box-shadow:inset 0 0 0 2px #22c55e!important}.cell.upgradable-piece:hover{box-shadow:inset 0 0 15px 4px #22c55e!important}.piece{cursor:grab;z-index:2;background-position:50%;background-repeat:no-repeat;background-size:contain;width:90%;height:90%;transition:transform .2s}.piece-svg{width:90%;height:90%;transition:transform .2s}.cell.in-check{background:radial-gradient(circle,#ef444480 0%,#0000 70%);animation:2s infinite pulse-red}.cell.checkmate{box-shadow:0 0 20px #ef4444cc;background:#ef4444cc!important}.cell.quality-brilliant:before{content:"!!";background-color:#31c48d}.cell.quality-best:before{content:"★";background-color:#9f5fef}.cell.quality-excellent:before{content:"□";background-color:#93c5fd}.cell.quality-good:before{content:"✔";background-color:#d1d5db}.cell.quality-inaccuracy:before{content:"?!";background-color:#facc15}.cell.quality-mistake:before{content:"?";background-color:#f97316}.cell.quality-blunder:before{content:"??";background-color:#f87171}[class*=quality-]:before{color:#fff;z-index:10;border-radius:50%;justify-content:center;align-items:center;width:24px;height:24px;font-size:14px;font-weight:700;animation:.3s cubic-bezier(.175,.885,.32,1.275) pop-in;display:flex;position:absolute;top:-10px;right:-10px;box-shadow:0 2px 4px #0000004d}@keyframes pop-in{0%{opacity:0;transform:scale(0)}to{opacity:1;transform:scale(1)}}#opening-name-container{color:#ccc;justify-content:center;align-items:center;height:30px;margin-bottom:10px;font-size:.9rem;font-style:italic;transition:all .3s;display:flex}#opening-name{color:var(--accent-primary);margin-left:8px;font-weight:700}.btn-primary{background:var(--accent-gradient);color:#fff;border-radius:var(--radius-md);cursor:pointer;transition:all var(--transition-fast);border:none;padding:12px 24px;font-weight:600;position:relative;overflow:hidden;box-shadow:0 4px 12px #6366f14d}.btn-primary:before{content:"";opacity:0;background:linear-gradient(#ffffff1a,#0000);width:100%;height:100%;transition:opacity .2s;position:absolute;top:0;left:0}.btn-primary:hover:not(:disabled){background:var(--accent-gradient-hover);box-shadow:0 8px 24px var(--accent-glow);transform:translateY(-2px)}.btn-primary:active:not(:disabled){transform:translateY(0)}.btn-primary:hover:before{opacity:1}.btn-primary:disabled{opacity:.5;cursor:not-allowed;filter:grayscale()}.btn-secondary{color:var(--text-main);border-radius:var(--radius-md);cursor:pointer;background:#ffffff0d;border:1px solid #ffffff0d;padding:12px 24px;font-weight:600;transition:all .2s}.btn-secondary:hover{background:#ffffff1a;border-color:#ffffff26;transform:translateY(-1px)}.full-width{width:100%}.mb-2{margin-bottom:1rem}.small-btn{padding:8px 16px;font-size:.85rem}.fullscreen-overlay{-webkit-backdrop-filter:blur(16px);width:100%;height:100%;z-index:var(--z-overlay);opacity:0;pointer-events:none;background:#02040acc;justify-content:center;align-items:center;transition:opacity .3s;display:flex;position:fixed;top:0;left:0}.fullscreen-overlay:not(.hidden){opacity:1;pointer-events:auto}.menu-content,.info-content{background:var(--glass-bg);border:var(--glass-border);width:90%;max-width:480px;box-shadow:var(--glass-shadow);border-radius:var(--radius-xl);max-height:85vh;animation:slideUpFade .4s var(--transition-bounce) forwards;padding:2.5rem;overflow-y:auto}.menu-header{border-bottom:1px solid #ffffff0d;justify-content:space-between;align-items:center;margin-bottom:2.5rem;padding-bottom:1rem;display:flex}.menu-header h2{background:var(--accent-gradient);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;font-size:1.8rem;font-weight:700}.menu-section{margin-bottom:2.5rem}.menu-section h3{text-transform:uppercase;letter-spacing:2px;color:var(--text-muted);margin-bottom:1rem;font-size:.75rem;font-weight:700}.menu-item{text-align:left;border-radius:var(--radius-lg);width:100%;color:var(--text-main);cursor:pointer;background:#ffffff08;border:1px solid #0000;align-items:center;gap:12px;margin-bottom:.75rem;padding:1.25rem;font-size:1.05rem;transition:all .2s;display:flex}.menu-item:hover{background:#ffffff0f;border-color:#ffffff1a;transform:translate(4px)}.menu-item.danger{color:var(--danger)}.menu-item.danger:hover{background:#fb71851a;border-color:#fb718533}.menu-item.warning{color:var(--warning)}.setting-row{justify-content:space-between;align-items:center;margin-bottom:1.25rem;padding:4px;display:flex}.setting-row label{color:var(--text-main);font-weight:500}.menu-select{appearance:none;color:var(--text-main);border-radius:var(--radius-md);font-family:var(--font-main);cursor:pointer;background-color:#0003;background-image:url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='rgba(255,255,255,0.5)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3e%3cpolyline points='6 9 12 15 18 9'%3e%3c/polyline%3e%3c/svg%3e");background-position:right 12px center;background-repeat:no-repeat;background-size:16px;border:1px solid #ffffff1a;min-width:140px;padding:12px 40px 12px 16px;font-size:.95rem;transition:all .2s}.menu-select:hover{border-color:var(--accent-primary);background-color:#0000004d}.menu-select:focus{border-color:var(--accent-primary);box-shadow:0 0 0 4px var(--accent-glow);outline:none}.toggle-switch{width:44px;height:24px;display:inline-block;position:relative}.toggle-switch input{opacity:0;width:0;height:0}.toggle-slider{cursor:pointer;transition:var(--transition-normal);border:var(--glass-border);background-color:#ffffff1a;border-radius:24px;position:absolute;inset:0}.toggle-slider:before{content:"";width:18px;height:18px;transition:var(--transition-normal);background-color:#fff;border-radius:50%;position:absolute;bottom:2px;left:2px;box-shadow:0 2px 4px #0003}input:checked+.toggle-slider{background:var(--accent-gradient)}input:focus+.toggle-slider{box-shadow:0 0 1px var(--accent-primary)}input:checked+.toggle-slider:before{transform:translate(20px)}.volume-slider{appearance:none;width:100px;height:6px;transition:var(--transition-fast);background:#ffffff1a;border-radius:10px;outline:none}.volume-slider::-webkit-slider-thumb{appearance:none;cursor:pointer;border:4px solid var(--accent-primary);width:18px;height:18px;box-shadow:0 0 10px var(--accent-glow);transition:var(--transition-bounce);background:#fff;border-radius:50%}.volume-slider::-webkit-slider-thumb:hover{transform:scale(1.2)}.volume-slider::-moz-range-thumb{background:var(--accent-primary);cursor:pointer;border:none;border-radius:50%;width:14px;height:14px}#volume-value{color:var(--text-muted);min-width:35px;font-size:.8rem}.modal-overlay{z-index:300;background:#000000b3;justify-content:center;align-items:center;width:100%;height:100%;display:flex;position:fixed;top:0;left:0}.modal-overlay.hidden{display:none}.modal-content{background:var(--bg-panel);-webkit-backdrop-filter:blur(16px);border:var(--glass-border);text-align:center;border-radius:20px;width:90%;max-width:350px;padding:2rem}.modal-buttons{justify-content:center;gap:1rem;margin-top:1.5rem;display:flex}.points-grid{justify-content:center;gap:1rem;margin-top:1rem;display:flex}.stats-grid{grid-template-columns:repeat(2,1fr);gap:1rem;margin-top:1rem;display:grid}.stat-card{text-align:center;background:#ffffff0d;border:1px solid #ffffff1a;border-radius:12px;padding:1rem}.stat-label{color:var(--text-muted);text-transform:uppercase;margin-bottom:.5rem;font-size:.75rem}.stat-value{color:var(--accent-primary);font-size:1.25rem;font-weight:800}.stat-value.positive{color:var(--success)}.stat-value.negative{color:var(--danger)}.divider{text-align:center;color:var(--text-muted);align-items:center;margin:1.5rem 0;font-size:.8rem;display:flex}.divider:before,.divider:after{content:"";border-bottom:1px solid #ffffff1a;flex:1}.divider span{padding:0 10px}.small-text{color:var(--text-muted);font-size:.85rem}.global-tooltip{color:#fff;pointer-events:none;z-index:10000;white-space:nowrap;opacity:0;background:#0f172af2;border:1px solid #ffffff1a;border-radius:6px;padding:8px 12px;font-size:.85rem;font-weight:500;transition:opacity .2s,transform .2s;position:fixed;transform:translateY(4px);box-shadow:0 4px 12px #00000080}.global-tooltip.hidden{display:none}.floating-text{pointer-events:none;z-index:10000;text-shadow:0 2px 4px #00000080;opacity:1;font-size:1.5rem;font-weight:700;transition:all 1.5s cubic-bezier(.1,.7,.1,1);position:fixed;transform:translate(-50%)}.floating-text.score{color:#fbbf24}.floating-text.message{color:#fff;font-size:1.2rem}.floating-text.animate{opacity:0;transform:translate(-50%,-100px)}.particle{pointer-events:none;z-index:9999;border-radius:50%;position:fixed}.confetti{pointer-events:none;z-index:9999}.skin-selector option{color:#fff;background-color:#0f172a;padding:10px}.info-tabs{gap:.5rem;margin-bottom:1rem;display:flex}.tab-btn{color:var(--text-muted);cursor:pointer;background:#ffffff0d;border:none;border-radius:8px;flex:1;padding:.75rem;transition:all .2s}.tab-btn.active{background:var(--accent-primary);color:#fff}.tab-pane{display:none}.tab-pane.active{display:block}.history-list,.log-list{max-height:300px;font-size:.9rem;overflow-y:auto}.history-list>div,.log-list>div{border-bottom:1px solid #ffffff0d;padding:.5rem 0}.action-icon-btn.active{border-color:var(--accent-primary);box-shadow:0 0 8px var(--accent-glow);background:#ffffff26}.action-icon-btn.active svg{filter:drop-shadow(0 0 2px)}#achievements-modal{-webkit-backdrop-filter:blur(8px);width:100%;height:100%;z-index:var(--z-modal,1000);opacity:0;pointer-events:none;background:#000c;justify-content:center;align-items:center;transition:opacity .3s;display:flex;position:fixed;top:0;left:0}#achievements-modal:not(.hidden){opacity:1;pointer-events:auto}#achievements-modal .modal-content{background:var(--bg-panel);-webkit-backdrop-filter:blur(16px);border:var(--glass-border);border-radius:var(--radius-xl);width:90%;max-width:600px;max-height:85vh;box-shadow:var(--glass-shadow);flex-direction:column;padding:2rem;display:flex;overflow:hidden}#achievements-modal .modal-header{border-bottom:1px solid #ffffff14;justify-content:space-between;align-items:center;margin-bottom:1.5rem;padding-bottom:1rem;display:flex}#achievements-modal .modal-header h2{background:var(--accent-gradient);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;margin:0;font-size:1.5rem;font-weight:700}#achievements-modal .modal-close{color:var(--text-muted);cursor:pointer;border-radius:var(--radius-sm);background:0 0;border:none;padding:.25rem .5rem;font-size:1.5rem;line-height:1;transition:all .2s}#achievements-modal .modal-close:hover{color:var(--text-main);background:#ffffff1a}#achievements-modal .modal-body{flex:1;padding-right:.5rem;overflow-y:auto}.achievements-stats{text-align:center;color:var(--text-muted);border-radius:var(--radius-md);background:#ffffff08;border:1px solid #ffffff0d;margin-bottom:1.5rem;padding:.75rem;font-size:.9rem}.achievements-grid{grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:1rem;display:grid}.achievement-card{border-radius:var(--radius-lg);background:#ffffff0a;border:1px solid #ffffff0f;align-items:flex-start;gap:1rem;padding:1.25rem;transition:all .3s;display:flex;position:relative;overflow:hidden}.achievement-card:before{content:"";background:var(--accent-gradient);opacity:0;pointer-events:none;width:100%;height:100%;transition:opacity .3s;position:absolute;top:0;left:0}.achievement-card.unlocked{background:#fbbf240d;border-color:#fbbf244d}.achievement-card.unlocked:before{opacity:.03}.achievement-card.locked{opacity:.6;filter:grayscale(.8)}.achievement-card.locked:hover{opacity:.8;filter:grayscale(.5);transform:translateY(-2px);box-shadow:0 8px 24px #0000004d}.achievement-icon{flex-shrink:0;font-size:2.5rem;line-height:1}.achievement-info{flex:1;min-width:0}.achievement-name{color:var(--text-main);margin-bottom:.25rem;font-size:1rem;font-weight:700}.achievement-card.unlocked .achievement-name{color:#fbbf24}.achievement-description{color:var(--text-muted);font-size:.85rem;line-height:1.4}.achievement-progress{border-top:1px solid #ffffff0d;margin-top:.75rem;padding-top:.75rem}.achievement-progress-bar{background:#ffffff1a;border-radius:3px;height:6px;margin-bottom:.25rem;overflow:hidden}.achievement-progress-bar>div{background:var(--accent-gradient);border-radius:3px;height:100%;transition:width .5s ease-out}.achievement-progress-text{color:var(--text-muted);font-size:.75rem}.achievement-status{color:#fbbf24;flex-shrink:0;font-size:1.5rem}.achievement-card.locked .achievement-status{color:var(--text-muted)}#achievements-menu-btn{color:#0f172a;background:linear-gradient(135deg,#fbbf24,#f59e0b);border:none;font-weight:700}#achievements-menu-btn:hover{background:linear-gradient(135deg,#fcd34d,#fbbf24);transform:translateY(-2px);box-shadow:0 4px 16px #fbbf2466}.shop-panel{background:var(--bg-panel);-webkit-backdrop-filter:blur(16px);border-top:var(--glass-border);z-index:100;-webkit-overflow-scrolling:touch;touch-action:pan-y;opacity:1;border-top-left-radius:20px;border-top-right-radius:20px;width:100%;max-width:600px;min-height:0;max-height:35vh;padding:1.5rem;transition:transform .3s,opacity .3s;position:fixed;bottom:0;left:50%;overflow:hidden auto;transform:translate(-50%);box-shadow:0 -10px 40px #00000080}.shop-panel.hidden{opacity:0;pointer-events:none;transform:translate(-50%)translateY(100%)}@media (width>=769px){.shop-panel{border-top:var(--glass-border);border-top-left-radius:20px;border-top-right-radius:0;border-bottom-left-radius:20px;width:380px;max-width:380px;max-height:100vh;inset:0 0 0 auto;transform:none;box-shadow:-10px 0 40px #00000080}.shop-panel.hidden{opacity:0;pointer-events:none;transform:translate(100%)}}.shop-header{justify-content:space-between;align-items:center;margin-bottom:1rem;display:flex}.shop-header h2{font-size:1.1rem}.shop-points{color:var(--accent-primary);font-weight:700}.shop-grid{grid-template-columns:repeat(4,1fr);gap:.75rem;margin-bottom:1rem;display:grid}.shop-item{cursor:pointer;background:#ffffff08;border:1px solid #ffffff0d;border-radius:16px;flex-direction:column;align-items:center;padding:.75rem .5rem;transition:all .2s cubic-bezier(.4,0,.2,1);display:flex;position:relative;overflow:hidden}.shop-item:hover{background:#ffffff14;border-color:#ffffff1a;transform:translateY(-4px);box-shadow:0 4px 12px #0003}.shop-item.selected{border-color:var(--accent-primary);background:#6366f126;box-shadow:0 0 0 2px #6366f14d}.shop-icon{margin-bottom:4px;font-size:1.5rem}.shop-cost{color:var(--text-muted);font-size:.8rem}.shop-status{text-align:center;color:var(--text-muted);height:1.2em;margin-bottom:1rem;font-size:.9rem}.tutor-recommendations-section{margin:1rem 0}#toggle-tutor-recommendations{background:#6366f126;border:1px solid #6366f14d;margin-bottom:.75rem;transition:all .2s}#toggle-tutor-recommendations:hover{background:#6366f140;border-color:#6366f180}.tutor-recommendations-container{scroll-snap-type:x mandatory;scrollbar-width:thin;scrollbar-color:var(--accent-primary) transparent;gap:1rem;margin-bottom:1rem;padding:.5rem;display:flex;overflow-x:auto}.tutor-recommendations-container::-webkit-scrollbar{height:6px}.tutor-recommendations-container::-webkit-scrollbar-track{background:#ffffff0d;border-radius:3px}.tutor-recommendations-container::-webkit-scrollbar-thumb{background-color:var(--accent-primary);border-radius:3px}.setup-template-card{cursor:pointer;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);scroll-snap-align:start;background:#22c55e0d;border:1px solid #22c55e33;border-radius:16px;flex-shrink:0;min-width:240px;margin-bottom:0;padding:1rem;transition:all .2s cubic-bezier(.4,0,.2,1)}.setup-template-card:hover{background:#22c55e26;border-color:#22c55e66;transform:translateY(-4px);box-shadow:0 12px 24px #0000004d,0 0 0 1px #22c55e4d}.setup-template-card.recommended{background:linear-gradient(135deg,#f59e0b1a,#22c55e0d);border:1px solid #f59e0b66;position:relative;overflow:hidden}.setup-template-card.recommended:before{content:"";background:var(--warning);width:4px;height:100%;position:absolute;top:0;left:0}.recommended-badge{background:var(--warning);color:#000;text-transform:uppercase;letter-spacing:.5px;border-radius:99px;padding:2px 8px;font-size:.65rem;font-weight:800;position:absolute;top:12px;right:12px;box-shadow:0 2px 8px #f59e0b66}.templates-overlay-grid{grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:1rem;display:grid}.template-name{color:var(--text-main);margin-bottom:.5rem;font-size:1rem;font-weight:700}.template-description{color:#cbd5e1;margin-bottom:.5rem;font-size:.85rem}.template-pieces{color:#94a3b8;flex-wrap:wrap;align-items:center;gap:.25rem;margin-top:.5rem;font-size:.8rem;display:flex}.template-piece-icon{justify-content:center;align-items:center;width:24px;height:24px;display:inline-flex}.puzzle-panel{-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);z-index:100;background:#0f172af2;border-top:1px solid #6366f14d;padding:1rem 1.5rem;animation:.3s ease-out slideUp;position:fixed;bottom:0;left:0;right:0}.puzzle-panel.hidden{display:none}.puzzle-content{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:1rem;max-width:800px;margin:0 auto;display:flex}.puzzle-info{flex:1;min-width:200px}.puzzle-content h2{color:var(--accent-primary);margin:0 0 .25rem;font-size:1.1rem}.puzzle-content p{color:var(--text-muted);margin:0;font-size:.9rem}.puzzle-status{text-align:center;background:#ffffff0d;border-radius:8px;padding:.5rem 1rem;font-size:.9rem}.puzzle-status.success{color:#4ade80;background:#22c55e33}.puzzle-status.failed{color:#f87171;background:#ef444433}.puzzle-buttons{gap:.5rem;display:flex}@media (width<=640px){.puzzle-content{text-align:center;flex-direction:column}.puzzle-buttons button{padding:.5rem 1rem;font-size:.9rem}.puzzle-buttons{justify-content:center;width:100%}}#puzzle-menu-overlay{z-index:2000;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);background:#0f172af2}.puzzle-menu-container{flex-direction:column;width:90%;max-width:800px;max-height:80vh;display:flex!important}.puzzle-grid{grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:1.5rem;max-height:60vh;padding:1rem 0;display:grid;overflow-y:auto}.puzzle-card{cursor:pointer;background:#ffffff08;border:1px solid #ffffff1a;border-radius:12px;flex-direction:column;gap:.5rem;padding:1rem;transition:all .2s;display:flex;position:relative;overflow:hidden}.puzzle-card:hover{border-color:var(--accent-primary);background:#ffffff14;transform:translateY(-4px);box-shadow:0 4px 12px #0000004d}.puzzle-card.solved{border-color:var(--success);background:#22c55e0d}.puzzle-card.solved:hover{background:#22c55e1a}.puzzle-card-header{justify-content:space-between;align-items:center;display:flex}.puzzle-title{color:var(--text-main);font-size:1.1rem;font-weight:700}.puzzle-check{font-size:1.2rem}.puzzle-difficulty{text-transform:uppercase;letter-spacing:.05em;color:var(--text-muted);background:#ffffff1a;border-radius:4px;margin-bottom:.5rem;padding:2px 8px;font-size:.75rem;display:inline-block}.puzzle-difficulty.einfach{color:#4ade80;background:#4ade801a}.puzzle-difficulty.mittel{color:#facc15;background:#facc151a}.puzzle-difficulty.schwer{color:#f87171;background:#f871711a}.puzzle-desc{color:var(--text-muted);margin:0;font-size:.9rem;line-height:1.4}@keyframes modalPop{0%{opacity:0;transform:scale(.9)}to{opacity:1;transform:scale(1)}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes pulse-glow{0%{box-shadow:0 0 10px var(--accent-glow)}50%{box-shadow:0 0 20px #6366f199}to{box-shadow:0 0 10px var(--accent-glow)}}@keyframes pulse-red{0%{box-shadow:inset 0 0 #f000}50%{box-shadow:inset 0 0 20px #f00c}to{box-shadow:inset 0 0 #f000}}@keyframes slideInRight{0%{opacity:0;transform:translate(20px)}to{opacity:1;transform:translate(0)}}@keyframes slideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes spring-pop{0%{transform:scale(1)}50%{transform:scale(.92)}to{transform:scale(1)}}@keyframes slide-up-fade{0%{opacity:0;transform:translateY(20px)scale(.96)}to{opacity:1;transform:translateY(0)scale(1)}}@keyframes slideUpFade{0%{opacity:0;transform:translateY(20px)scale(.96)}to{opacity:1;transform:translateY(0)scale(1)}}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.action-icon-btn:active,.btn-primary:active,.btn-secondary:active,.shop-item:active{animation:.3s cubic-bezier(.34,1.56,.64,1) spring-pop;transform:translateY(0)}@keyframes slideInLeft{0%{opacity:0;transform:translate(-100%)}to{opacity:1;transform:translate(0)}}.game-area{animation:fadeIn var(--transition-slow)}#board-container{animation:slide-up-fade .8s var(--transition-bounce)}.player-info.opponent{animation:slideInLeft .6s var(--transition-bounce) .1s both}.player-info.self{animation:slideInLeft .6s var(--transition-bounce) .2s both}.action-bar{animation:slide-up-fade .6s var(--transition-bounce) .3s both}@keyframes pulse{0%{opacity:.8;transform:scale(1)}50%{opacity:1;transform:scale(1.1)}to{opacity:.8;transform:scale(1)}}@keyframes eval-pulse{0%{transform:scale(1);box-shadow:0 0 #22c55e00}50%{transform:scale(1.02);box-shadow:0 0 20px #22c55e99}to{transform:scale(1);box-shadow:0 0 #22c55e00}}.evaluation-bar-wrapper{width:44px;height:100%;animation:slideInLeft .5s var(--transition-bounce);flex-direction:column;align-items:center;gap:12px;margin-right:16px;display:flex}.evaluation-bar{background:var(--bg-board-dark);border:1px solid #ffffff0d;border-radius:20px;flex:1;width:14px;margin-bottom:8px;position:relative;overflow:hidden;box-shadow:inset 0 2px 8px #0009}.eval-bar-fill{background:linear-gradient(to bottom, var(--bg-board-dark), var(--bg-app));will-change:height;width:100%;height:50%;transition:height .6s cubic-bezier(.4,0,.2,1);position:absolute;bottom:0;left:0;box-shadow:0 0 15px #0000004d}.evaluation-bar:after{content:"";z-index:1;background:#fff3;width:100%;height:1px;position:absolute;top:50%;left:0}.eval-bar-labels{pointer-events:none;z-index:2;flex-direction:column;justify-content:space-between;width:100%;height:100%;padding:10px 0;display:flex;position:absolute;top:0;left:0}.eval-label{text-align:center;text-shadow:0 1px 2px #00000080;color:#fff;mix-blend-mode:difference;font-size:8px;font-weight:800}.eval-bar-score{background:var(--bg-panel);border:var(--glass-border);text-align:center;border-radius:8px;min-width:40px;padding:4px 8px;font-family:Outfit,sans-serif;font-size:.8rem;font-weight:800;transition:color .3s,box-shadow .3s}.eval-bar-score.win-white{color:var(--success);box-shadow:0 0 10px color-mix(in srgb, var(--success) 25%, transparent)}.eval-bar-score.win-black{color:var(--danger);box-shadow:0 0 10px color-mix(in srgb, var(--danger) 25%, transparent)}.eval-bar-score.neutral{color:var(--text-muted)}.cell.quality-best{box-shadow:inset 0 0 12px #22c55e!important}.cell.quality-brilliant{animation:2s infinite pulse-brilliant;box-shadow:inset 0 0 15px #3b82f6,0 0 10px #3b82f680!important}.cell.quality-mistake{box-shadow:inset 0 0 12px #ef4444!important}.cell.quality-blunder{animation:.5s ease-in-out shake;box-shadow:inset 0 0 20px #dc2626!important}@keyframes pulse-brilliant{0%{box-shadow:inset 0 0 15px #3b82f6}50%{box-shadow:inset 0 0 25px #60a5fa,0 0 15px #3b82f6cc}to{box-shadow:inset 0 0 15px #3b82f6}}.post-game-analysis-overlay{flex-direction:column;align-items:center;gap:24px;width:90%;max-width:500px;display:flex}.analysis-summary-grid{grid-template-columns:repeat(2,1fr);gap:16px;width:100%;display:grid}.analysis-stat-card{text-align:center;background:#ffffff0d;border:1px solid #ffffff1a;border-radius:12px;padding:16px}.analysis-stat-value{margin-bottom:4px;font-size:1.5rem;font-weight:800}.analysis-stat-label{color:var(--text-muted);text-transform:uppercase;letter-spacing:.05em;font-size:.8rem}.move-quality-table{border-collapse:collapse;width:100%;margin-top:10px}.move-quality-row{border-bottom:1px solid #ffffff0d;justify-content:space-between;padding:8px 12px;display:flex}.move-quality-row:last-child{border-bottom:none}.quality-badge{align-items:center;gap:8px;display:flex}.quality-icon{border-radius:4px;justify-content:center;align-items:center;width:20px;height:20px;font-size:.7rem;font-weight:800;display:flex}.move-quality-badge{vertical-align:middle;border-radius:4px;justify-content:center;align-items:center;width:18px;height:18px;margin-left:6px;font-size:.65rem;font-weight:800;display:inline-flex}.accuracy-high{color:#4ade80}.accuracy-mid{color:#facc15}.accuracy-low{color:#f87171}.analysis-progress-container{background:#ffffff1a;border-radius:4px;width:100%;height:8px;margin:10px 0;overflow:hidden}.analysis-progress-fill{background:var(--accent-primary);width:0%;height:100%;transition:width .3s}@keyframes shake{0%,to{transform:translate(0)}25%{transform:translate(-5px)}75%{transform:translate(5px)}}@media (width<=600px){.evaluation-bar-wrapper{width:10px;height:300px;margin-right:6px}.eval-bar-score{padding:2px 4px;font-size:.7rem}}.opening-book-panel{background:var(--bg-panel);border:var(--glass-border);border-radius:var(--radius-lg);width:360px;max-width:90vw;height:100%;max-height:calc(100vh - 120px);box-shadow:var(--shadow-xl);animation:slideInRight .3s var(--transition-smooth);z-index:var(--z-panel);flex-direction:column;display:flex;overflow:hidden}.opening-book-header{background:#ffffff08;border-bottom:1px solid #ffffff1a;justify-content:space-between;align-items:center;padding:12px 16px;display:flex}.opening-book-header h3{color:var(--text-primary);margin:0;font-size:1rem;font-weight:700}.opening-book-body{flex-direction:column;flex:1;gap:20px;padding:16px;display:flex;overflow-y:auto}.current-opening-section{border-radius:var(--radius-md);background:#9f5fef1a;border:1px solid #9f5fef33;padding:12px}.current-opening-section.hidden{display:none}.current-opening-section h4{text-transform:uppercase;letter-spacing:.05em;color:var(--text-muted);margin:0 0 8px;font-size:.8rem;font-weight:700}.current-opening-name-row{align-items:center;gap:8px;margin-bottom:6px;display:flex}.current-opening-name{color:#9f5fef;font-size:1.1rem;font-weight:700}.current-opening-eco{color:#9f5fef;border-radius:var(--radius-sm);background:#9f5fef33;padding:2px 8px;font-size:.8rem;font-weight:600}.current-opening-category{color:var(--text-muted);text-transform:capitalize;margin-bottom:8px;font-size:.75rem;display:block}.current-opening-stats{flex-wrap:wrap;gap:6px;margin-bottom:8px;display:flex}.current-opening-stats .stat-pill{border-radius:var(--radius-pill);color:var(--text-secondary);background:#ffffff1a;padding:3px 8px;font-size:.7rem;font-weight:600}.current-opening-stats .stat-pill.white{color:#4ade80;background:#4ade8033}.current-opening-stats .stat-pill.black{color:#f87171;background:#f8717133}.current-opening-stats .stat-pill.draw{color:#facc15;background:#facc1533}.current-opening-moves{color:var(--text-secondary);margin-bottom:8px;font-family:monospace;font-size:.8rem}.current-opening-moves .opening-move{color:var(--accent-primary);font-weight:600}.current-opening-description{color:var(--text-muted);margin:0;font-size:.8rem;line-height:1.5}.book-move-section h4{text-transform:uppercase;letter-spacing:.05em;color:var(--text-muted);margin:0 0 8px;font-size:.8rem;font-weight:700}.book-moves-list{min-height:50px}.book-move-item{border-radius:var(--radius-md);background:#ffffff0d;border:1px solid #ffffff1a;justify-content:space-between;align-items:center;padding:10px 12px;font-family:monospace;display:flex}.book-move-item.book-move{background:#9f5fef1a;border-color:#9f5fef80}.book-move-item .move-notation{color:var(--accent-primary);font-size:1.1rem;font-weight:700}.book-move-item .move-source{text-transform:uppercase;color:#9f5fef;border-radius:var(--radius-sm);background:#9f5fef33;padding:2px 6px;font-size:.7rem;font-weight:600}.no-book-moves{text-align:center;color:var(--text-muted);padding:16px;font-size:.85rem;font-style:italic}.opening-browser-section h4{text-transform:uppercase;letter-spacing:.05em;color:var(--text-muted);margin:0 0 12px;font-size:.8rem;font-weight:700}.browser-controls{gap:8px;margin-bottom:16px;display:flex}.opening-search-input{border-radius:var(--radius-md);color:var(--text-primary);background:#ffffff0d;border:1px solid #ffffff1a;flex:1;padding:8px 12px;font-family:inherit;font-size:.85rem}.opening-search-input:focus{border-color:var(--accent-primary);outline:none;box-shadow:0 0 0 2px #4ade8033}.opening-search-input::placeholder{color:var(--text-muted)}.opening-category-filter{border-radius:var(--radius-md);color:var(--text-primary);background:#ffffff0d;border:1px solid #ffffff1a;min-width:160px;padding:8px 12px;font-family:inherit;font-size:.85rem}.opening-category-filter:focus{border-color:var(--accent-primary);outline:none}.opening-search-results,.top-openings-list{flex-direction:column;gap:8px;max-height:300px;display:flex;overflow-y:auto}.opening-entry{border-radius:var(--radius-md);background:#ffffff08;border:1px solid #ffffff0d;padding:12px;transition:border-color .2s,background .2s}.opening-entry:hover{background:#ffffff14;border-color:#ffffff26}.opening-entry.compact{padding:10px}.opening-entry-header{justify-content:space-between;align-items:center;margin-bottom:4px;display:flex}.opening-name{color:var(--text-primary);font-size:.9rem;font-weight:600}.opening-eco{color:var(--accent-primary);border-radius:var(--radius-sm);background:#ffffff1a;padding:2px 6px;font-family:monospace;font-size:.7rem;font-weight:700}.opening-meta{color:var(--text-muted);gap:12px;margin-bottom:6px;font-size:.7rem;display:flex}.opening-category{text-transform:capitalize}.opening-popularity{color:var(--accent-primary);font-weight:600}.opening-stats{justify-content:space-between;margin-bottom:6px;font-size:.7rem;display:flex}.opening-stats .stat{font-weight:600}.opening-stats .stat.white{color:#4ade80}.opening-stats .stat.black{color:#f87171}.opening-stats .stat.draw{color:#facc15}.opening-stats .stat.elo{color:var(--text-muted);font-family:monospace}.opening-moves{color:var(--text-secondary);margin-bottom:6px;font-family:monospace;font-size:.75rem}.opening-description{color:var(--text-muted);font-size:.75rem;line-height:1.4}.no-results{text-align:center;color:var(--text-muted);padding:20px;font-style:italic}@media (width<=768px){.opening-book-panel{border-radius:var(--radius-lg) var(--radius-lg) 0 0;width:100vw;max-width:100vw;height:auto;max-height:70vh;animation:slideUp .3s var(--transition-smooth);position:fixed;bottom:0;left:0;right:0}@keyframes slideUp{0%{opacity:0;transform:translateY(100%)}to{opacity:1;transform:translateY(0)}}}.debug-panel{z-index:9000;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);background:#0f172afa;border:1px solid #6366f14d;border-radius:16px;flex-direction:column;width:400px;max-height:80vh;display:flex;position:fixed;top:80px;right:20px;overflow:hidden;box-shadow:0 10px 40px #0009}.debug-header-actions{align-items:center;gap:8px;display:flex}.debug-tabs{border-bottom:1px solid #ffffff1a;display:flex}.debug-tab{color:#64748b;cursor:pointer;background:0 0;border:none;border-bottom:2px solid #0000;flex:1;padding:10px;font-size:.85rem;transition:all .2s}.debug-tab:hover{color:#94a3b8;background:#ffffff08}.debug-tab.active{color:#6366f1;background:#6366f10d;border-bottom-color:#6366f1}.debug-content{flex-direction:column;flex:1;display:flex;overflow:hidden}.debug-tab-content{flex:1;padding:12px;display:none;overflow-y:auto}.debug-tab-content.active{flex-direction:column;gap:12px;display:flex}.debug-filters{flex-direction:column;gap:8px;display:flex}#debug-search{color:#f1f5f9;background:#0000004d;border:1px solid #ffffff1a;border-radius:8px;width:100%;padding:8px 12px;font-size:.85rem}#debug-search::placeholder{color:#64748b}#debug-search:focus{border-color:#6366f1;outline:none}.debug-filter-btns,.debug-context-filters{flex-wrap:wrap;gap:4px;display:flex}.debug-filter{color:#94a3b8;cursor:pointer;background:#ffffff0d;border:1px solid #ffffff1a;border-radius:6px;padding:6px 10px;font-size:.75rem;transition:all .2s}.debug-filter.small{padding:4px 8px;font-size:.7rem}.debug-filter:hover{color:#f1f5f9;background:#ffffff1a}.debug-filter.active{color:#a5b4fc;background:#6366f133;border-color:#6366f1}.debug-logs{background:#0003;border-radius:8px;flex:1;min-height:200px;max-height:350px;padding:8px;font-family:Fira Code,Consolas,monospace;font-size:.75rem;overflow-y:auto}.debug-log-entry{border-radius:4px;gap:8px;margin-bottom:2px;padding:4px 6px;display:flex}.debug-log-entry:hover{background:#ffffff0d}.log-time{color:#64748b;min-width:35px}.log-level{min-width:20px}.log-msg{word-break:break-all;flex:1}.debug-log-error{color:#fca5a5;background:#ef44441a}.debug-log-warn{color:#fcd34d;background:#f59e0b1a}.debug-log-debug{color:#94a3b8}.debug-stats{color:#64748b;justify-content:space-between;padding-top:8px;font-size:.75rem;display:flex}.debug-section{background:#ffffff08;border-radius:8px;padding:12px}.debug-section h4{text-transform:uppercase;letter-spacing:1px;color:#94a3b8;margin:0 0 10px;font-size:.8rem}.debug-ai-stats,.debug-state-info{flex-direction:column;gap:6px;display:flex}.debug-stat-row{justify-content:space-between;font-size:.85rem;display:flex}.debug-stat-row span:first-child{color:#94a3b8}.debug-stat-row span:last-child{color:#f1f5f9;font-weight:600}.debug-buttons button,.debug-btn{color:#f1f5f9;cursor:pointer;background:#ffffff0d;border:1px solid #ffffff1a;border-radius:8px;padding:8px 12px;font-size:.85rem;transition:all .2s}.debug-buttons button:hover,.debug-btn:hover{background:#6366f133;border-color:#6366f1;transform:translateY(-1px)}.debug-btn.small{padding:4px 8px;font-size:.75rem}.debug-code{color:#94a3b8;white-space:pre;background:#0000004d;border-radius:6px;margin:0;padding:10px;font-family:Fira Code,monospace;font-size:.7rem;overflow-x:auto}@media (width<=640px){.debug-panel{border-radius:0;width:100%;height:100vh;max-height:100vh;top:0;right:0}}.promotion-grid{perspective:1000px;grid-template-columns:repeat(4,1fr);gap:15px;padding:20px;display:grid}.promotion-option{cursor:pointer;background:#ffffff0d;border:1px solid #ffffff1a;border-radius:12px;flex-direction:column;align-items:center;padding:15px;transition:all .3s cubic-bezier(.4,0,.2,1);display:flex;position:relative;overflow:hidden}.promotion-option:hover{border-color:var(--accent-primary,#6366f1);background:#ffffff26;transform:translateY(-5px)scale(1.05);box-shadow:0 10px 20px #0003,0 0 15px #6366f166}.promotion-option:before{content:"";z-index:0;background:radial-gradient(circle,#6366f199 0%,#0000 70%);width:60px;height:60px;transition:transform .3s;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)scale(0)}.promotion-option:hover:before{transform:translate(-50%,-50%)scale(1.5)}.promotion-option .piece-svg{z-index:1;filter:drop-shadow(0 4px 6px #0000004d);width:60px;height:60px;position:relative}.promotion-option .piece-name{color:var(--text-main,#fff);z-index:1;margin-top:10px;font-family:Outfit,sans-serif;font-size:.9rem;font-weight:600;position:relative}.promotion-option .piece-cost{color:var(--text-muted,#94a3b8);margin-top:4px;font-size:.75rem}#promotion-overlay .modal-content{-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);background:#0f172af2;border:1px solid #ffffff1a;width:90%;max-width:600px;box-shadow:0 25px 50px -12px #00000080}#promotion-overlay h2{text-align:center;background:linear-gradient(135deg,#fff 0%,#94a3b8 100%);-webkit-text-fill-color:transparent;text-shadow:0 2px 10px #ffffff1a;-webkit-background-clip:text;background-clip:text;margin-bottom:1.5rem;font-size:1.8rem}.promotion-option.recommended{background:#f59e0b14;border-color:#f59e0b99}.promotion-option.recommended:hover{background:#f59e0b2e;border-color:#f59e0be6;box-shadow:0 10px 20px #0003,0 0 15px #f59e0b66}.promo-badge{color:#f59e0b;text-shadow:0 0 6px #f59e0b99;z-index:2;pointer-events:none;font-size:.85rem;animation:2s ease-in-out infinite badge-pulse;position:absolute;top:6px;right:8px}@keyframes badge-pulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.8;transform:scale(1.2)}}.promotion-option:focus-visible{outline:2px solid var(--accent-primary,#6366f1);outline-offset:2px}@media (width<=480px){.promotion-grid{grid-template-columns:repeat(2,1fr);gap:8px;padding:8px}.promotion-option{min-width:48px;min-height:48px;padding:12px}.promotion-option .piece-svg{width:44px;height:44px}.promotion-option .piece-name{font-size:.75rem}.promotion-option .piece-cost{font-size:.7rem}#promotion-overlay h2{margin-bottom:.75rem;font-size:1.2rem}#promotion-overlay .modal-content{margin:0 12px;width:calc(100vw - 24px)!important;max-width:calc(100vw - 24px)!important}}@media (width<=360px){.promotion-grid{grid-template-columns:repeat(2,1fr);gap:6px;padding:6px}.promotion-option{min-height:44px;padding:10px}.promotion-option .piece-svg{width:40px;height:40px}.promotion-option .piece-name{font-size:.7rem}}.ghost-piece{pointer-events:none;opacity:.4;z-index:5;filter:sepia()hue-rotate(190deg)saturate(300%)opacity(.5);transition:opacity .5s ease-out,transform .5s ease-out;position:absolute}.ghost-piece.fade-out{opacity:0;transform:scale(.8)}.cell.king-check-flash{animation:.8s ease-out kingFlash}@keyframes kingFlash{0%{box-shadow:inset 0 0 #0000}50%{background-color:#ff00004d;box-shadow:inset 0 0 40px 20px #f009}to{box-shadow:inset 0 0 #0000}}@keyframes kingMateFlash{0%{box-shadow:inset 0 0 #0000}50%{background-color:#f006;box-shadow:inset 0 0 60px 30px #f00c}to{background-color:#f006;box-shadow:inset 0 0 60px 30px #f00c}}.cell.king-mate-flash{animation:1.5s ease-in-out infinite alternate kingMateFlash}.ai-arrow{transform-origin:0;pointer-events:none;z-index:15;background:linear-gradient(90deg,#6366f1cc,#fff0);border-radius:2px;height:4px;position:absolute;box-shadow:0 0 10px #6366f180}.ai-arrow:after{content:"";border-top:8px solid #0000;border-bottom:8px solid #0000;border-left:10px solid #6366f1cc;position:absolute;top:-6px;right:-8px}.cell.piece-veteran .piece-svg{filter:drop-shadow(0 0 5px #10b98199)}.cell.piece-veteran:after{content:"★";color:#10b981;text-shadow:0 0 3px #000c;pointer-events:none;z-index:5;font-size:.65rem;position:absolute;top:2px;right:2px}.cell.piece-elite .piece-svg{filter:drop-shadow(0 0 8px #8b5cf6cc)}.cell.piece-elite:after{content:"★★";color:#8b5cf6;text-shadow:0 0 3px #000c;pointer-events:none;z-index:5;font-size:.65rem;position:absolute;top:2px;right:2px}.cell.piece-champion .piece-svg{filter:drop-shadow(0 0 12px #f59e0be6);animation:2s infinite alternate championGlow!important}@keyframes championGlow{0%{filter:drop-shadow(0 0 8px #f59e0b99)}to{filter:drop-shadow(0 0 15px #f59e0b)}}.cell.piece-champion:before{content:"👑";z-index:10;pointer-events:none;font-size:.8rem;position:absolute;top:-5px;left:50%;transform:translate(-50%)}#promotion-overlay{opacity:0;transform:translateY(20px)}#promotion-overlay.animate-in{animation:.3s ease-out forwards fadeInUp}@keyframes fadeInUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}#promotion-overlay{opacity:0;transition:opacity .2s,transform .2s;transform:scale(.95)}#promotion-overlay.show{opacity:1;transform:scale(1)}#battle-chess-3d-container{z-index:5;pointer-events:none;opacity:0;width:100%;height:100%;transition:opacity .5s ease-in-out;position:absolute;top:0;left:0}#battle-chess-3d-container.active{pointer-events:auto;opacity:1;z-index:20}#battle-chess-3d-container canvas{border-radius:4px;width:100%!important;height:100%!important}#board-wrapper{transition:opacity .3s}.debug-panel{background:var(--bg-panel);border-radius:var(--radius-lg);z-index:500;border:1px solid #6366f14d;flex-direction:column;width:350px;max-height:80vh;display:flex;position:fixed;top:80px;right:20px;overflow:hidden;box-shadow:0 10px 40px #00000080}.debug-panel.hidden{display:none}.debug-header{background:#6366f11a;border-bottom:1px solid #6366f133;justify-content:space-between;align-items:center;padding:1rem;display:flex}.debug-header h3{color:var(--accent-primary);margin:0;font-size:1rem}.debug-close{color:var(--text-muted);cursor:pointer;background:0 0;border:none;border-radius:4px;padding:4px 8px;font-size:1.2rem;transition:background .2s}.debug-close:hover{color:var(--text-main);background:#ffffff1a}.debug-content{flex:1;padding:1rem;overflow-y:auto}.debug-section{margin-bottom:1.5rem}.debug-section h4{text-transform:uppercase;letter-spacing:1px;color:var(--text-muted);margin-bottom:.75rem;font-size:.75rem}.debug-buttons{flex-wrap:wrap;gap:.5rem;display:flex}.debug-buttons button{color:var(--text-main);cursor:pointer;background:#ffffff0d;border:1px solid #ffffff1a;border-radius:8px;flex:1;min-width:fit-content;padding:8px 12px;font-size:.85rem;transition:all .2s}.debug-buttons button:hover{border-color:var(--accent-primary);background:#ffffff1a;transform:translateY(-1px)}.debug-logs{background:#0000004d;border-radius:8px;max-height:200px;padding:.75rem;font-family:Courier New,monospace;font-size:.75rem;overflow-y:auto}.debug-log-entry{border-bottom:1px solid #ffffff0d;padding:4px 0}.debug-log-info{color:var(--text-muted)}.debug-log-success{color:var(--success)}.debug-log-warning{color:var(--warning)}.debug-log-error{color:var(--danger)}.eval-graph-container{box-sizing:border-box;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);background:#ffffff0d;border:1px solid #ffffff1a;border-radius:8px;width:100%;height:80px;margin:15px 0;padding:10px;transition:all .3s;position:relative;overflow:hidden}.eval-graph-container:hover{background:#ffffff14;border-color:#fff3}.eval-graph-container.hidden{display:none}#eval-graph{width:100%;height:100%;display:block}.eval-line{fill:none;stroke:url(#eval-gradient);stroke-width:2.5px;stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(0 2px 4px #0000004d)}.eval-area{fill:url(#area-gradient);opacity:.2}.eval-zero-line{stroke:#ffffff4d;stroke-width:1px;stroke-dasharray:4 4}.eval-point{fill:#fff;stroke:#4f9cf9;stroke-width:2px;cursor:pointer;transition:r .2s}.eval-point:hover{r:6;fill:#4f9cf9}.analysis-panel{-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);z-index:100;background:#0f172ad9;border:1px solid #ffffff1a;border-radius:16px;flex-direction:column;width:280px;transition:all .3s;animation:.4s ease-out slideInRight;display:flex;position:absolute;top:80px;right:20px;overflow:hidden;box-shadow:0 12px 24px #00000080}.analysis-header{background:#ffffff0d;border-bottom:1px solid #ffffff1a;justify-content:space-between;align-items:center;padding:12px 16px;display:flex}.analysis-header h3{color:var(--accent-primary);letter-spacing:.05em;text-transform:uppercase;margin:0;font-size:1rem}.analysis-body{flex-direction:column;gap:20px;padding:16px;display:flex}.eval-section{align-items:center;gap:12px;display:flex}.eval-bar-container{background:#334155;border-radius:6px;flex-grow:1;height:12px;position:relative;overflow:hidden}.eval-bar{background:linear-gradient(90deg,#f87171,#4ade80);width:50%;height:100%;transition:width .5s cubic-bezier(.4,0,.2,1)}.eval-score{text-align:right;min-width:50px;font-family:Outfit,sans-serif;font-size:1.1rem;font-weight:800}.eval-score.positive{color:#4ade80}.eval-score.negative{color:#f87171}.top-moves-section h4{color:#94a3b8;text-transform:uppercase;letter-spacing:.05em;margin:0 0 10px;font-size:.85rem}.top-moves-list{flex-direction:column;gap:8px;display:flex}.top-move-item{cursor:pointer;background:#ffffff08;border-radius:8px;flex-direction:column;align-items:stretch;gap:4px;padding:8px 12px;transition:all .2s;display:flex}.top-move-main{justify-content:space-between;align-items:center;display:flex}.top-move-item:hover{background:#ffffff14;transform:translate(4px)}.top-move-item.best{background:#4ade800d;border-left:3px solid #4ade80}.top-move-notation{color:#f1f5f9;font-family:Outfit,sans-serif;font-weight:600}.top-move-score{color:#94a3b8;font-size:.9rem}.top-move-pv{color:#64748b;white-space:nowrap;text-overflow:ellipsis;border-top:1px solid #ffffff0d;padding-top:4px;font-size:.75rem;font-style:italic;overflow:hidden}.analysis-controls{flex-direction:column;gap:12px;margin-top:10px;display:flex}.analysis-info{color:#64748b;text-align:center;font-size:.75rem}.cell.analysis-from{box-shadow:inset 0 0 0 4px #4f9cf999!important}.cell.analysis-to{background-color:#4f9cf966!important}#spinner-overlay{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);z-index:1000;background:#0f111ae6;justify-content:center;align-items:center;width:100vw;height:100vh;display:none;position:fixed;top:0;left:0}.ai-thinking-panel{background:var(--bg-panel);border:var(--glass-border);text-align:center;box-shadow:var(--glass-shadow);border-radius:20px;flex-direction:column;align-items:center;gap:16px;min-width:280px;padding:2rem;display:flex}.spinner{border:4px solid #ffffff1a;border-top-color:var(--accent-primary);border-radius:50%;width:48px;height:48px;animation:1s linear infinite spin}.ai-status{color:var(--text-muted);flex-direction:column;gap:8px;font-size:.9rem;display:flex}.progress-bar-container{background:#ffffff1a;border-radius:3px;width:100%;height:6px;overflow:hidden}#progress-fill{background:linear-gradient(90deg, var(--accent-primary), var(--success));border-radius:3px;width:0%;height:100%;transition:width .3s}@media (width<=640px){.debug-panel{border-radius:0;width:100%;height:100vh;max-height:100vh;top:0;right:0}}#toast-container{z-index:var(--z-overlay);pointer-events:none;flex-direction:column;gap:10px;display:flex;position:fixed;bottom:2rem;right:2rem}@media (width<=640px){#toast-container{align-items:center;width:90%;bottom:5rem;right:50%;transform:translate(50%)}}.toast-notification{pointer-events:auto;-webkit-backdrop-filter:blur(12px);min-width:300px;max-width:400px;color:var(--text-main);background:#0f172af2;border:1px solid #ffffff1a;border-radius:12px;align-items:center;gap:12px;padding:12px 16px;font-size:.95rem;transition:all .3s;animation:.4s cubic-bezier(.16,1,.3,1) toastSlideIn;display:flex;position:relative;overflow:hidden;box-shadow:0 8px 32px #0006}.toast-notification.hiding{animation:.3s forwards toastFadeOut}.toast-notification:before{content:"";width:4px;position:absolute;top:0;bottom:0;left:0}.toast-success:before{background-color:var(--success)}.toast-success .toast-icon{color:var(--success)}.toast-error:before{background-color:var(--danger)}.toast-error .toast-icon{color:var(--danger)}.toast-warning:before{background-color:var(--warning)}.toast-warning .toast-icon{color:var(--warning)}.toast-info:before{background-color:var(--accent-primary)}.toast-info .toast-icon{color:var(--accent-primary)}.toast-icon{justify-content:center;align-items:center;font-size:1.2rem;display:flex}.toast-content{flex-direction:column;flex:1;display:flex}.toast-title{margin-bottom:2px;font-size:.9rem;font-weight:700}.toast-message{color:var(--text-muted);font-size:.85rem}.toast-close{color:var(--text-muted);cursor:pointer;opacity:.7;background:0 0;border:none;margin-left:8px;padding:4px;transition:opacity .2s}.toast-close:hover{opacity:1;color:var(--text-main)}.critical-error-content{text-align:center;max-width:500px;border:1px solid var(--danger)!important;box-shadow:0 0 40px #f8717133!important}.error-icon-large{color:var(--danger);margin-bottom:1rem;font-size:3rem}.error-title{color:var(--text-main);margin-bottom:.5rem;font-size:1.5rem;font-weight:800}.error-description{color:var(--text-muted);margin-bottom:1.5rem;line-height:1.5}.error-details-box{text-align:left;color:var(--danger);background:#0000004d;border:1px solid #f8717133;border-radius:8px;max-height:150px;margin-bottom:1.5rem;padding:1rem;font-family:JetBrains Mono,monospace;font-size:.8rem;overflow:auto}@keyframes toastSlideIn{0%{opacity:0;transform:translate(100px)scale(.9)}to{opacity:1;transform:translate(0)scale(1)}}@keyframes toastFadeOut{to{opacity:0;height:0;margin:0;padding:0;transform:translate(20px)}}#main-menu{z-index:9000;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);opacity:0;pointer-events:none;background:radial-gradient(circle,#0f172af2,#020617);width:100vw;height:100vh;transition:opacity .4s;display:flex;position:fixed;top:0;left:0}#main-menu.active{opacity:1;pointer-events:all}.menu-container{gap:2rem;width:100%;max-width:1200px;height:100%;margin:0 auto;padding:2rem;display:flex}@media (width<=768px){.menu-container{flex-direction:column;gap:1rem;padding:1rem}}.menu-sidebar{border-right:1px solid #ffffff1a;flex-direction:column;width:250px;padding:2rem 0;display:flex}.menu-logo{-webkit-text-fill-color:transparent;background:linear-gradient(135deg,#fff 0%,#94a3b8 100%);-webkit-background-clip:text;background-clip:text;align-items:center;gap:.5rem;margin-bottom:3rem;font-family:Outfit,sans-serif;font-size:2rem;font-weight:800;display:flex}.menu-nav{flex-direction:column;gap:.5rem;display:flex}.menu-tab-btn{text-align:left;color:var(--text-muted);cursor:pointer;background:0 0;border:none;border-radius:12px;align-items:center;gap:1rem;padding:1rem 1.5rem;font-family:Outfit,sans-serif;font-size:1.1rem;font-weight:600;transition:all .2s;display:flex}.menu-tab-btn:hover{color:#fff;background:#ffffff0d;transform:translate(5px)}.menu-tab-btn.active{color:#fff;border-left:3px solid var(--accent-primary);background:linear-gradient(90deg,#3b82f626,#0000)}.menu-content-area{flex:1;padding:2rem;position:relative;overflow-y:auto}.menu-view{animation:.4s forwards fadeInSlide;display:none}.menu-view.active{display:block}@keyframes fadeInSlide{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.gamemode-grid{grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:1.5rem;margin-top:1rem;display:grid}.gamemode-card{cursor:pointer;text-align:left;background:#ffffff08;border:1px solid #ffffff14;border-radius:20px;flex-direction:column;gap:1rem;padding:2rem;transition:all .3s cubic-bezier(.34,1.56,.64,1);display:flex;position:relative;overflow:hidden}.gamemode-card:before{content:"";opacity:0;background:radial-gradient(circle at 100% 0,#ffffff0d,#0000 60%);width:100%;height:100%;transition:opacity .3s;position:absolute;top:0;left:0}.gamemode-card:hover{background:#ffffff0f;border-color:#fff3;transform:translateY(-8px);box-shadow:0 10px 30px #0000004d}.gamemode-card:hover:before{opacity:1}.card-icon{filter:drop-shadow(0 0 10px #fff3);margin-bottom:.5rem;font-size:2.5rem}.card-title{color:#fff;font-size:1.4rem;font-weight:700}.card-desc{color:var(--text-muted);font-size:.9rem;line-height:1.5}.card-tag{text-transform:uppercase;letter-spacing:.5px;border-radius:20px;align-self:flex-start;padding:4px 10px;font-size:.75rem;font-weight:700}.tag-new{color:#4ade80;background:#22c55e33}.tag-hot{color:#fb923c;background:#f9731633}.tag-pro{color:#c084fc;background:#a855f733}.section-title{color:#fff;margin-bottom:.5rem;font-size:2rem;font-weight:700}.section-subtitle{color:var(--text-muted);margin-bottom:2rem;font-size:1.1rem}.settings-grid{grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:2rem;display:grid}.setting-group{background:#0003;border:1px solid #ffffff0d;border-radius:16px;padding:1.5rem}.setting-group h3{color:var(--accent-primary);margin-bottom:1rem;font-size:1.1rem}#tutorial-overlay:not(.hidden){display:flex}.tutorial-content{background:var(--glass-bg);border:var(--glass-border-bright);-webkit-backdrop-filter:blur(20px);border-radius:var(--radius-xl);width:95%;max-width:600px;max-height:90vh;animation:slideUpFade .5s var(--transition-bounce) forwards;flex-direction:column;display:flex;overflow:hidden;box-shadow:0 20px 50px #00000080}.tutorial-body{flex-grow:1;padding:2.5rem;overflow-y:auto}.tutorial-step{display:none}.tutorial-step.active{animation:.4s forwards fadeIn;display:block}.tutorial-step h2{background:var(--accent-gradient);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;margin-bottom:1.5rem;font-size:2rem}.tutorial-step p{color:var(--text-muted);margin-bottom:1rem;font-size:1.1rem;line-height:1.6}.tutorial-step ul,.tutorial-step ol{color:var(--text-muted);margin-bottom:1rem;margin-left:1.5rem}.tutorial-step li{margin-bottom:.5rem}.piece-demo{border-radius:var(--radius-lg);text-align:center;background:#ffffff08;border:1px solid #ffffff0d;margin:1.5rem 0;padding:1.5rem}.piece-demo-grid{border:4px solid var(--bg-board-dark);border-radius:var(--radius-sm);background:var(--bg-board-dark);grid-template-columns:repeat(5,1fr);gap:4px;width:250px;height:250px;margin:1.5rem auto;display:grid}.demo-cell{justify-content:center;align-items:center;width:100%;padding-top:100%;display:flex;position:relative}.demo-cell.light{background-color:var(--bg-board-light)}.demo-cell.dark{background-color:var(--bg-board-dark)}.demo-cell>div{width:100%;height:100%;position:absolute;top:0;left:0}.piece-position{z-index:2;filter:drop-shadow(0 0 5px #00000080)}.move-indicator{z-index:1;border-radius:50%;width:60%;height:60%;position:absolute;top:20%;left:20%}.move-indicator.knight-move{background-color:#48f9}.move-indicator.bishop-move,.move-indicator.rook-move{background-color:#4ecca399}.tutorial-footer{background:#0000004d;border-top:1px solid #ffffff0d;justify-content:space-between;align-items:center;padding:1.5rem 2.5rem;display:flex}.tutorial-controls{gap:1rem;display:flex}.close-icon-btn{color:var(--text-dim);cursor:pointer;z-index:10;background:0 0;border:none;font-size:2rem;transition:color .2s;position:absolute;top:1.5rem;right:1.5rem}.close-icon-btn:hover{color:var(--text-main)}@media (width<=600px){.tutorial-content{border-radius:0;width:100%;height:100%}.tutorial-step h2{font-size:1.5rem}.piece-demo-grid{width:200px;height:200px}}.skin-infernale .piece-svg{filter:drop-shadow(0 0 2px #ff4500);animation:1.5s ease-in-out infinite alternate burn}@keyframes burn{0%{filter:drop-shadow(0 0 2px #ff4500)drop-shadow(0 0 3px #ff8c00);transform:scale(1)}50%{filter:drop-shadow(0 -1px 3px red)drop-shadow(0 -2px 5px #fc0);transform:scale(1.02)translateY(-1px)}to{filter:drop-shadow(0 -2px 4px #ff4500)drop-shadow(0 -3px 6px orange);transform:scale(1.01)translateY(-.5px)}}.skin-frost .piece-svg{filter:drop-shadow(0 0 3px #00e5ff);animation:3s ease-in-out infinite alternate freeze}@keyframes freeze{0%{filter:drop-shadow(0 0 2px #00e5ff)brightness(1.1);transform:scale(1)}50%{filter:drop-shadow(0 0 5px #00bcd4)brightness(1.3);transform:scale(1.01)translateY(1px)}to{filter:drop-shadow(0 0 3px #00e5ff)brightness(1.1);transform:scale(1)}}.skin-neon .piece-svg{animation:4s infinite alternate neon-flicker}.skin-neon .piece-white .piece-svg{filter:drop-shadow(0 0 5px #0f8)drop-shadow(0 0 10px #0ff)}.skin-neon .piece-black .piece-svg{filter:drop-shadow(0 0 5px #f0f)drop-shadow(0 0 10px #f08)}@keyframes neon-flicker{0%,19%,21%,23%,25%,54%,56%,to{opacity:1;filter:drop-shadow(0 0 5px)drop-shadow(0 0 10px)}20%,24%,55%{opacity:.8;filter:none}}