*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}:root{--bg-1: #0f1419;--bg-2: #181e2d;--panel: rgba(28, 33, 50, .75);--panel-solid: #1b2133;--panel-hi: rgba(42, 50, 72, .82);--border-soft: rgba(255, 255, 255, .07);--border-gold: rgba(212, 165, 116, .22);--accent: #d4a574;--accent-hi: #e8c391;--accent-dim: rgba(212, 165, 116, .12);--text: #e8e6e3;--text-dim: #94a3b8;--text-mute: #576579;--cell-light: #ebd9b5;--cell-dark: #a87f5e;--check-red: #ef4444;--shadow-xl: 0 28px 72px rgba(0, 0, 0, .6), 0 8px 24px rgba(0, 0, 0, .4);--shadow-md: 0 8px 28px rgba(0, 0, 0, .4);--shadow-sm: 0 2px 10px rgba(0, 0, 0, .35);--cell: 88px;--radius: 14px;--radius-sm: 8px;font-family:Inter,Segoe UI,system-ui,-apple-system,sans-serif;font-size:15px;line-height:1.4;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;color-scheme:dark}html,body{height:100%}body{background:linear-gradient(145deg,var(--bg-1) 0%,var(--bg-2) 100%);color:var(--text)}body:before{content:"";position:fixed;top:0;right:0;bottom:0;left:0;background:radial-gradient(ellipse 90% 55% at 50% -5%,rgba(212,165,116,.07) 0%,transparent 65%);pointer-events:none;z-index:0}#root{min-height:100vh;display:flex;align-items:center;justify-content:center;position:relative;z-index:1}.app{display:grid;grid-template-columns:240px auto 240px;gap:20px;align-items:center;padding:32px}.leftPanel{display:flex;flex-direction:column;gap:12px}.playerCard{background:var(--panel);backdrop-filter:blur(18px) saturate(160%);-webkit-backdrop-filter:blur(18px) saturate(160%);border:1px solid var(--border-soft);border-radius:var(--radius);padding:16px 18px;display:flex;flex-direction:column;gap:14px;transition:border-color .3s ease,box-shadow .3s ease}.playerCard.active{border-color:var(--border-gold);box-shadow:0 0 0 1px #d4a5742e,0 0 36px #d4a57417}.playerCardHeader{display:flex;align-items:center;gap:12px}.playerAvatar{width:42px;height:42px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:22px;flex-shrink:0;line-height:1}.playerAvatar.dark{background:linear-gradient(145deg,#2c2c2c,#1a1a1a);border:1px solid rgba(255,255,255,.1)}.playerAvatar.light{background:linear-gradient(145deg,#f2ede4,#d4cdc0);border:1px solid rgba(0,0,0,.15);color:#3a3020}.playerCardMeta{flex:1;min-width:0}.playerCardName{display:block;font-size:15px;font-weight:600;color:var(--text);line-height:1.2}.playerCardRole{display:block;font-size:11px;font-weight:500;letter-spacing:.07em;text-transform:uppercase;color:var(--text-mute);margin-top:3px}.advantageBadge{font-size:14px;font-weight:700;color:var(--accent);background:var(--accent-dim);border:1px solid rgba(212,165,116,.28);border-radius:7px;padding:3px 9px;flex-shrink:0}.capturedPieces{display:flex;align-items:center;gap:4px;min-height:22px}.capturedLg{min-height:28px}.capturedIcons{display:flex;flex-wrap:wrap;align-items:center}.capturedIcon{width:18px;height:18px;margin-left:-4px;opacity:.88;filter:drop-shadow(0 1px 2px rgba(0,0,0,.55))}.capturedIcon:first-child{margin-left:0}.capturedLg .capturedIcon{width:26px;height:26px;margin-left:-8px}.capturedLg .capturedIcon:first-child{margin-left:0}.materialAdvantage{font-size:12px;font-weight:700;color:var(--accent);margin-left:6px;flex-shrink:0}.capturedLg .materialAdvantage{font-size:14px}.boardColumn{display:flex;flex-direction:column;gap:0}.gameStatus{height:38px;display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:600;letter-spacing:.04em;color:var(--text-mute);background:var(--panel);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid var(--border-soft);border-bottom:none;border-radius:var(--radius) var(--radius) 0 0;transition:color .25s ease}.gameStatus.thinking{color:var(--accent);animation:statusPulse 1.3s ease-in-out infinite}.gameStatus.check{color:var(--check-red);letter-spacing:.06em}.gameStatus.end{color:var(--accent);font-size:14px}@keyframes statusPulse{0%,to{opacity:1}50%{opacity:.45}}.playerBar{display:flex;align-items:center;gap:12px;padding:0 16px;height:52px;background:var(--panel);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid var(--border-soft);border-top:none;border-bottom:none;transition:background .25s ease,border-color .25s ease}.playerBar.bottom{border-bottom:1px solid var(--border-soft);border-radius:0 0 var(--radius) var(--radius)}.playerBar.active{background:var(--panel-hi)}.playerBar.active.top{border-color:var(--border-gold);border-top:none;border-bottom:none}.playerBar.active.bottom{border-color:var(--border-gold);border-top:none}.playerChip{font-size:18px;flex-shrink:0;line-height:1;opacity:.75}.playerBar.active .playerChip{opacity:1}.playerName{flex:1;font-size:14px;font-weight:600;letter-spacing:.02em;color:var(--text-dim);transition:color .25s ease}.playerBar.active .playerName{color:var(--text)}.timerDisplay{font-size:20px;font-weight:700;font-variant-numeric:tabular-nums;font-feature-settings:"tnum";letter-spacing:.03em;color:var(--text-dim);background:#0000004d;border-radius:var(--radius-sm);padding:6px 12px;min-width:80px;text-align:center;flex-shrink:0;transition:color .25s ease,text-shadow .25s ease}.playerBar.active .timerDisplay{color:var(--accent);text-shadow:0 0 18px rgba(212,165,116,.45)}.chessTable{position:relative;border:7px solid #17110d;box-shadow:var(--shadow-xl);display:block;outline:1px solid rgba(0,0,0,.6)}.chessCell{box-sizing:border-box;width:var(--cell);height:var(--cell);position:relative;-webkit-user-select:none;user-select:none;cursor:default}.chessCell.white{background-color:var(--cell-light)}.chessCell.black{background-color:var(--cell-dark)}.chessCell.selected{background-color:#d4a57480}.chessCell.lastMove:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:#d4a57442;pointer-events:none;z-index:0}.chessCell.isValidMove:after{content:"";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:28%;height:28%;background:#0f141c42;border-radius:50%;box-shadow:0 0 0 3px #0f141c17;pointer-events:none;z-index:0}.chessCell.eatable{outline:3px solid rgba(239,68,68,.65);outline-offset:-3px}.chessRow{display:flex}[id="0"]{border-top-left-radius:2px}[id="7"]{border-top-right-radius:2px}[id="56"]{border-bottom-left-radius:2px}[id="63"]{border-bottom-right-radius:2px}.cellLabel{position:absolute;font-size:10px;font-weight:700;pointer-events:none;z-index:2;line-height:1;opacity:.52}.rankLabel{top:4px;left:5px}.fileLabel{bottom:4px;right:5px}.chessCell.white .cellLabel{color:var(--cell-dark)}.chessCell.black .cellLabel{color:var(--cell-light)}.chessPiece{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;z-index:1;cursor:pointer;transform-origin:center;filter:drop-shadow(0 2px 5px rgba(0,0,0,.45));transition:filter .15s ease}.chessPiece:hover{filter:drop-shadow(0 4px 10px rgba(0,0,0,.55)) brightness(1.06)}.chessPiece.end{pointer-events:none}@keyframes checkPulse{0%,to{filter:drop-shadow(0 2px 5px rgba(0,0,0,.45)) drop-shadow(0 0 14px rgba(239,68,68,1))}50%{filter:drop-shadow(0 2px 5px rgba(0,0,0,.45)) drop-shadow(0 0 3px rgba(239,68,68,.2))}}.chessPiece.checked{animation:checkPulse .85s ease-in-out infinite}.winnerOverlay{position:absolute;top:0;right:0;bottom:0;left:0;z-index:10;background:#0006;backdrop-filter:blur(3px) saturate(120%);-webkit-backdrop-filter:blur(3px) saturate(120%);display:flex;align-items:center;justify-content:center;border-radius:2px}.winnerCard{background:radial-gradient(ellipse at 50% 0%,rgba(212,165,116,.14),transparent 65%),var(--panel-solid);border:1px solid rgba(212,165,116,.4);border-radius:var(--radius);padding:40px 52px;text-align:center;box-shadow:0 12px 56px #000000bf,0 0 0 1px #d4a5741f;display:flex;flex-direction:column;align-items:center;gap:10px}.winnerIcon{display:block;font-size:60px;line-height:1;filter:drop-shadow(0 0 28px rgba(212,165,116,.75));margin-bottom:4px}.winnerTitle{font-size:26px;font-weight:700;color:var(--accent);letter-spacing:-.01em}.winnerSub{font-size:14px;color:var(--text-dim)}.winnerRestart{margin-top:12px;padding:11px 32px;border-radius:var(--radius-sm);border:1px solid rgba(212,165,116,.45);background:var(--accent-dim);color:var(--accent);font-size:14px;font-weight:600;font-family:inherit;cursor:pointer;letter-spacing:.02em;transition:background .15s ease,border-color .15s ease,transform .12s ease}.winnerRestart:hover{background:#d4a57438;border-color:var(--accent);transform:translateY(-1px)}.winnerRestart:active{transform:translateY(0)}.crownedContainer{position:absolute;z-index:20;top:-96px;left:50%;transform:translate(-50%);background:var(--panel-solid);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);border:1px solid rgba(212,165,116,.32);border-radius:12px;padding:10px;display:flex;gap:8px;box-shadow:var(--shadow-md)}.crownablePiece{width:58px;height:58px;border-radius:var(--radius-sm);background:#ffffff0d;border:1px solid var(--border-soft);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .12s ease,border-color .12s ease,transform .12s ease}.crownablePiece:hover{background:var(--accent-dim);border-color:#d4a57480;transform:translateY(-3px);box-shadow:var(--shadow-sm)}.crownablePieceImage{width:100%;height:100%;display:block;filter:drop-shadow(0 2px 4px rgba(0,0,0,.45))}.sidePanel{display:flex;flex-direction:column;gap:12px}.controls{display:flex;flex-direction:column;gap:8px}.restartGame,.aiToggle{width:100%;padding:11px 14px;border-radius:var(--radius-sm);border:1px solid var(--border-soft);background:var(--panel);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);color:var(--text-dim);font-size:14px;font-weight:500;cursor:pointer;font-family:inherit;display:flex;align-items:center;gap:9px;letter-spacing:.01em;transition:background .15s ease,border-color .15s ease,color .15s ease,transform .12s ease,box-shadow .15s ease}.restartGame:hover,.aiToggle:hover{background:var(--panel-hi);border-color:#d4a57447;color:var(--text);transform:translateY(-1px);box-shadow:var(--shadow-sm)}.restartGame:active,.aiToggle:active{transform:translateY(0);box-shadow:none}.aiToggle.activated{background:var(--accent-dim);border-color:#d4a57461;color:var(--accent)}.aiToggle.activated:hover{background:#d4a57433;border-color:var(--accent)}.difficultySelector{display:flex;gap:6px;transition:opacity .2s ease}.difficultySelector.disabled{opacity:.4;pointer-events:none}.difficultyBtn{flex:1;padding:8px 6px;border-radius:var(--radius-sm);border:1px solid var(--border-soft);background:var(--panel);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);color:var(--text-dim);font-size:12px;font-weight:500;cursor:pointer;font-family:inherit;letter-spacing:.01em;transition:background .15s ease,border-color .15s ease,color .15s ease,transform .12s ease,box-shadow .15s ease}.difficultyBtn:hover:not(:disabled){background:var(--panel-hi);border-color:#d4a57447;color:var(--text);transform:translateY(-1px);box-shadow:var(--shadow-sm)}.difficultyBtn:active:not(:disabled){transform:translateY(0);box-shadow:none}.difficultyBtn.active{background:var(--accent-dim);border-color:#d4a57461;color:var(--accent)}.difficultyBtn.active:hover{background:#d4a57433;border-color:var(--accent)}.moveHistory{background:var(--panel);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);border:1px solid var(--border-soft);border-radius:var(--radius);overflow:hidden;display:flex;flex-direction:column;max-height:380px}.moveHistoryTitle{padding:11px 14px 9px;font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--text-mute);border-bottom:1px solid var(--border-soft);flex-shrink:0;display:flex;align-items:center;gap:7px}.moveHistoryList{overflow-y:auto;padding:4px 0;flex:1;scrollbar-width:thin;scrollbar-color:rgba(212,165,116,.18) transparent}.moveHistoryList::-webkit-scrollbar{width:3px}.moveHistoryList::-webkit-scrollbar-track{background:transparent}.moveHistoryList::-webkit-scrollbar-thumb{background:#d4a57438;border-radius:2px}.moveHistoryEmpty{display:block;padding:18px 14px;font-size:12px;color:var(--text-mute);font-style:italic;text-align:center}.movePair{display:grid;grid-template-columns:26px 1fr 1fr;align-items:center;padding:4px 12px;font-size:13px;gap:2px;transition:background .1s ease}.movePair:hover{background:var(--accent-dim)}.moveNumber{color:var(--text-mute);font-size:11px;font-weight:600;text-align:right;padding-right:4px}.moveWhite{color:var(--text-dim);font-weight:500;font-variant-numeric:tabular-nums;padding:3px 6px;border-radius:4px}.moveBlack{color:var(--text-mute);font-weight:500;font-variant-numeric:tabular-nums;padding:3px 6px;border-radius:4px}.movePair.last .moveWhite{color:var(--accent);font-weight:700}.movePair.last .moveBlack{color:var(--accent);font-weight:700;opacity:.75}@media (max-width: 1240px){:root{--cell: 76px}.app{grid-template-columns:210px auto 210px;gap:14px;padding:20px}}@media (max-width: 1020px){:root{--cell: 60px}.app{grid-template-columns:180px auto 180px;gap:12px;padding:16px}.playerAvatar{width:34px;height:34px;font-size:18px}.playerCardName{font-size:13px}}@media (max-width: 860px){:root{--cell: 52px}.app{display:flex;flex-direction:column;align-items:center;padding:12px;gap:12px}.leftPanel{flex-direction:row;width:100%;max-width:540px}.playerCard{flex:1}.sidePanel{width:100%;max-width:540px;flex-direction:row;align-items:flex-start}.controls{flex-direction:row}.restartGame,.aiToggle{flex:1}.moveHistory{flex:1;max-height:220px}}:root{font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{margin:0;min-height:100vh}
