:root{font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;line-height:1.5;font-weight:400;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*{margin:0;padding:0;box-sizing:border-box}body{font-family:LXGW WenKai,KaiTi,STKaiti,serif;background:linear-gradient(180deg,#f5e6c8,#ecdbb0,#e2cfa0 60%,#d8c494);color:#4a2810;min-height:100vh;overflow-x:hidden;-webkit-tap-highlight-color:transparent;touch-action:manipulation}#root{display:flex;justify-content:center;min-height:100vh;padding:12px}.app{display:flex;flex-direction:column;align-items:center;gap:12px;width:100%;max-width:560px}.title{font-size:32px;font-weight:700;color:#5a2d0c;text-shadow:0 1px 0 rgba(255,255,255,.4),0 2px 4px rgba(90,45,12,.15);letter-spacing:6px;font-family:LXGW WenKai,KaiTi,STKaiti,serif}.game-status{font-size:16px;padding:8px 24px;border-radius:20px;background:linear-gradient(180deg,#f0dbb5,#e5cc9a);border:1px solid #c9a86c;text-align:center;box-shadow:inset 0 1px #ffffff80,0 2px 4px #0000001a;color:#5a3000;font-weight:700}.status-check{background:linear-gradient(180deg,#f5d0c0,#e8b8a0);border-color:#c08060;color:#a03020}.status-win{background:linear-gradient(180deg,#d0e8c0,#b8d8a0);border-color:#80a860;color:#2d6a2d;font-size:18px}.status-lose{background:linear-gradient(180deg,#f5d0c0,#e8b8a0);border-color:#c08060;color:#a03020;font-size:18px}.status-thinking{color:#8b6914}@keyframes pulse{0%,to{opacity:1}50%{opacity:.4}}.status-thinking:after{content:"";display:inline-block;width:8px;height:8px;border-radius:50%;background:#c49a3f;margin-left:8px;animation:pulse 1s infinite}.status-row{display:flex;align-items:center;gap:8px;width:100%;justify-content:center}.status-pill{padding:8px 16px;font-size:16px;border-radius:20px;background:linear-gradient(180deg,#f0dbb5,#e5cc9a);border:1px solid #c9a86c;box-shadow:inset 0 1px #ffffff80,0 2px 4px #0000001a;color:#5a3000;font-weight:700;font-family:LXGW WenKai,KaiTi,STKaiti,serif;cursor:pointer;transition:all .15s;white-space:nowrap}.status-pill:hover:not(:disabled){background:linear-gradient(180deg,#f5e4c4,#edd8a8)}.status-pill:disabled{opacity:.4;cursor:not-allowed}.status-pill-active{background:linear-gradient(180deg,#d8c494,#c4a870);border-color:#a88a50}.game-container{border-radius:8px;box-shadow:0 4px 8px #5a2d0c40,0 8px 24px #5a2d0c26;overflow:hidden;width:100%}.game-controls{display:flex;gap:8px}.game-controls button{padding:10px 22px;font-size:16px;border:1px solid #b08838;border-radius:12px;cursor:pointer;background:linear-gradient(180deg,#e8c373,#d4a84e 40%,#c49a3f);color:#5a2d0c;font-weight:700;font-family:LXGW WenKai,KaiTi,STKaiti,serif;transition:all .15s;box-shadow:0 3px #a07830,0 4px 8px #5a2d0c4d,inset 0 1px #fff6;text-shadow:0 1px 0 rgba(255,255,255,.3);position:relative;top:0}.game-controls button:hover:not(:disabled){background:linear-gradient(180deg,#f0d080,#e0b860 40%,#d0a548);top:-1px;box-shadow:0 4px #a07830,0 6px 12px #5a2d0c59,inset 0 1px #ffffff80}.game-controls button:active:not(:disabled){top:2px;box-shadow:0 1px #a07830,0 2px 4px #5a2d0c40}.game-controls button:disabled{opacity:.5;cursor:not-allowed}.auto-play-btn{padding:10px 22px;font-size:16px;border:1px solid #9a8a70;border-radius:12px;cursor:pointer;background:linear-gradient(180deg,#c8b898,#b0a080 40%,#9a8a70);color:#4a3820;font-weight:700;font-family:LXGW WenKai,KaiTi,STKaiti,serif;transition:all .15s;box-shadow:0 3px #7a6a50,0 4px 8px #5a2d0c40,inset 0 1px #ffffff4d;text-shadow:0 1px 0 rgba(255,255,255,.2);position:relative;top:0}.auto-play-btn:hover{background:linear-gradient(180deg,#d4c4a8,#bca890 40%,#a89880);top:-1px}.auto-play-btn:active{top:2px}.auto-play-btn.auto-play-active{background:linear-gradient(180deg,#c0503a,#a84030 40%,#903028);color:#fff;border-color:#802820;box-shadow:0 3px #602018,0 4px 8px #5a1e144d,inset 0 1px #fff3;text-shadow:0 1px 2px rgba(0,0,0,.2)}.auto-play-btn.auto-play-active:hover{background:linear-gradient(180deg,#d06048,#b85040 40%,#a03830)}.coach-btn{padding:10px 22px;font-size:16px;border:1px solid #4a8ab0;border-radius:12px;cursor:pointer;background:linear-gradient(180deg,#a8c8e0,#88b0d0 40%,#6898c0);color:#1a3a5a;font-weight:700;font-family:LXGW WenKai,KaiTi,STKaiti,serif;transition:all .15s;box-shadow:0 3px #4878a0,0 4px 8px #1e3c5a40,inset 0 1px #ffffff4d;text-shadow:0 1px 0 rgba(255,255,255,.2);position:relative;top:0}.coach-btn:hover{background:linear-gradient(180deg,#b8d4e8,#98c0d8 40%,#78a8c8);top:-1px}.coach-btn:active{top:2px}.coach-btn.coach-active{background:linear-gradient(180deg,#2888c8,#2070b0 40%,#1860a0);color:#fff;border-color:#1050a0;box-shadow:0 3px #104080,0 4px 8px #143c644d,inset 0 1px #fff3;text-shadow:0 1px 2px rgba(0,0,0,.2)}.coach-btn.coach-active:hover{background:linear-gradient(180deg,#3898d0,#3080b8 40%,#2870a8)}.coach-panel{width:100%;height:80px;padding:10px 14px;background:linear-gradient(180deg,#f0dbb5,#e5cc9a);border:1px solid #c9a86c;border-radius:12px;box-shadow:inset 0 1px #ffffff80,0 2px 4px #00000014;overflow-y:auto;display:flex;flex-direction:column;justify-content:center}.coach-panel-loading{text-align:center;color:#8b6914;font-weight:700;font-size:14px;animation:pulse 1.5s infinite}.coach-panel-header{display:flex;align-items:center;gap:12px;margin-bottom:6px}.coach-score{font-size:18px;font-weight:700;color:#5a2d0c}.coach-depth{font-size:12px;color:#8a6a40}.coach-pv-list{display:flex;flex-wrap:wrap;gap:4px 8px;font-size:13px}.coach-pv-step{white-space:nowrap;font-weight:700}.pv-red{color:#b03020}.pv-black{color:#3a3a50}.game-controls-btn{padding:10px 22px;font-size:16px;border:1px solid #b08838;border-radius:12px;cursor:pointer;background:linear-gradient(180deg,#e8c373,#d4a84e 40%,#c49a3f);color:#5a2d0c;font-weight:700;font-family:LXGW WenKai,KaiTi,STKaiti,serif;transition:all .15s;box-shadow:0 3px #a07830,0 4px 8px #5a2d0c4d,inset 0 1px #fff6;text-shadow:0 1px 0 rgba(255,255,255,.3);position:relative;top:0}.game-controls-btn:hover:not(:disabled){background:linear-gradient(180deg,#f0d080,#e0b860 40%,#d0a548);top:-1px}.game-controls-btn:disabled{opacity:.5;cursor:not-allowed}.settings-btn{padding:10px 22px;font-size:16px;border:1px solid #9a8a70;border-radius:12px;cursor:pointer;background:linear-gradient(180deg,#c8b898,#b0a080 40%,#9a8a70);color:#4a3820;font-weight:700;font-family:LXGW WenKai,KaiTi,STKaiti,serif;transition:all .15s;box-shadow:0 3px #7a6a50,0 4px 8px #5a2d0c40,inset 0 1px #ffffff4d;text-shadow:0 1px 0 rgba(255,255,255,.2);position:relative;top:0}.settings-btn:hover{background:linear-gradient(180deg,#d4c4a8,#bca890 40%,#a89880);top:-1px}.settings-btn:active{top:2px}.settings-btn.settings-active{background:linear-gradient(180deg,#a09080,#887868 40%,#706050);color:#fff;border-color:#605040;box-shadow:0 3px #504030,0 4px 8px #5a2d0c4d,inset 0 1px #ffffff26;text-shadow:0 1px 2px rgba(0,0,0,.2)}.settings-panel{width:100%;max-height:0;overflow:hidden;transition:max-height .3s ease}.settings-panel-open{max-height:300px}.settings-panel-inner{display:flex;flex-direction:column;align-items:center;gap:10px;padding:14px 16px;background:linear-gradient(180deg,#ffffff73,#fff3);border:1px solid rgba(180,140,80,.3);border-radius:14px;box-shadow:0 2px 6px #5a2d0c14}.settings-toggles{display:flex;gap:8px}.level-selectors{display:flex;flex-direction:column;gap:6px;width:100%;align-items:center}.level-row{display:flex;align-items:center;gap:8px}.level-label{font-size:14px;color:#7a5a30;font-weight:700;white-space:nowrap}.level-buttons{display:flex;gap:3px;background:linear-gradient(180deg,#0000000f,#00000008);border-radius:10px;padding:3px;box-shadow:inset 0 2px 4px #5a2d0c1f,0 1px #ffffff80;border:1px solid rgba(90,45,12,.1)}.diff-btn{padding:6px 13px;font-size:13px;border:none;border-radius:8px;cursor:pointer;background:transparent;color:#8a6a40;font-weight:700;font-family:LXGW WenKai,KaiTi,STKaiti,serif;transition:all .15s}.diff-btn:hover:not(:disabled):not(.diff-active){color:#5a3000;background:#fff6}.diff-btn.diff-active{background:linear-gradient(180deg,#e8c373,#d4a84e);color:#5a2d0c;border:1px solid #b08838;box-shadow:0 2px #a07830,0 2px 6px #5a2d0c33;text-shadow:0 1px 0 rgba(255,255,255,.3)}.diff-btn:disabled{opacity:.5;cursor:not-allowed}.captured-pieces{display:flex;flex-direction:column;gap:4px;width:100%;padding:0 4px}.captured-group{display:flex;align-items:center;gap:6px;font-size:13px}.captured-label{color:#8a6a40;white-space:nowrap}.captured-list{display:flex;flex-wrap:wrap;gap:4px}.red-captured .captured-piece{color:#6a5040;text-shadow:0 1px 1px rgba(255,255,255,.3)}.black-captured .captured-piece{color:#c04040;text-shadow:0 1px 1px rgba(255,255,255,.3)}.captured-piece{font-size:16px;font-weight:700}.no-captures{color:#a89070;font-style:italic}.footer{margin-top:4px;font-size:12px;color:#5a2d0c4d}.mode-selector{display:flex;flex-direction:column;align-items:center;gap:30px;padding-top:50px;width:100%}.mode-selector .title{font-size:38px;letter-spacing:8px;position:relative}.mode-selector .title:after{content:"";display:block;width:120px;height:3px;background:linear-gradient(90deg,transparent,#c49a3f,transparent);margin:8px auto 0}.mode-buttons{display:flex;flex-direction:column;gap:14px;width:100%;max-width:320px}.mode-btn{padding:16px 48px;font-size:22px;border:2px solid #b08838;border-radius:16px;cursor:pointer;background:linear-gradient(180deg,#eedbb0,#e0c890,#d4b878 60%,#c8a860);color:#5a2d0c;font-weight:700;font-family:LXGW WenKai,KaiTi,STKaiti,serif;transition:all .15s;box-shadow:0 4px #a07830,0 6px 12px #5a2d0c40,inset 0 1px #ffffff80,inset 0 -2px 4px #5a2d0c1a;text-shadow:0 1px 0 rgba(255,255,255,.4);position:relative;top:0;letter-spacing:4px}.mode-btn:hover{background:linear-gradient(180deg,#f5e4c0,#e8d0a0,#dcc088 60%,#d0b070);top:-2px;box-shadow:0 6px #a07830,0 8px 16px #5a2d0c4d,inset 0 1px #fff9}.mode-btn:active{top:2px;box-shadow:0 2px #a07830,0 3px 6px #5a2d0c33,inset 0 2px 4px #5a2d0c26}.lobby{display:flex;flex-direction:column;align-items:center;gap:16px;width:100%;max-width:400px}.lobby h2{font-size:26px;color:#5a2d0c;text-shadow:0 1px 0 rgba(255,255,255,.4);letter-spacing:4px;font-family:LXGW WenKai,KaiTi,STKaiti,serif}.lobby-section{display:flex;flex-direction:column;gap:10px;width:100%;padding:14px 16px;background:linear-gradient(180deg,#ffffff80,#ffffff40);border-radius:14px;border:1px solid rgba(180,140,80,.3);box-shadow:0 2px 6px #5a2d0c14}.lobby-section h3{font-size:14px;color:#8a6a40;font-family:LXGW WenKai,KaiTi,STKaiti,serif;margin-bottom:2px}.lobby-input{padding:10px 14px;font-size:15px;border:1px solid #c4a878;border-radius:10px;background:#fff9;color:#4a2810;outline:none;transition:border-color .2s;font-family:inherit}.lobby-input:focus{border-color:#d4a84e;box-shadow:0 0 0 2px #d4a84e33}.lobby-input::placeholder{color:#5a2d0c59}.lobby-btn{padding:10px 22px;font-size:16px;border:1px solid #b08838;border-radius:12px;cursor:pointer;background:linear-gradient(180deg,#e8c373,#d4a84e 40%,#c49a3f);color:#5a2d0c;font-weight:700;font-family:LXGW WenKai,KaiTi,STKaiti,serif;transition:all .15s;box-shadow:0 3px #a07830,0 4px 8px #5a2d0c33,inset 0 1px #fff6;text-shadow:0 1px 0 rgba(255,255,255,.3)}.lobby-btn:hover{background:linear-gradient(180deg,#f0d080,#e0b860 40%,#d0a548)}.lobby-btn:disabled{opacity:.5;cursor:not-allowed}.lobby-btn.secondary{background:linear-gradient(180deg,#c8b898,#b0a080 40%,#9a8a70);color:#4a3820;border-color:#9a8a70;box-shadow:0 3px #7a6a50,0 4px 8px #5a2d0c26,inset 0 1px #ffffff4d;text-shadow:0 1px 0 rgba(255,255,255,.2)}.lobby-btn.danger{background:linear-gradient(180deg,#c0503a,#a84030 40%,#903028);color:#fff;border-color:#802820;box-shadow:0 3px #602018,0 4px 8px #5a1e1440,inset 0 1px #ffffff26;text-shadow:0 1px 2px rgba(0,0,0,.2)}.join-row{display:flex;flex-direction:column;gap:8px}.join-row .lobby-input{width:100%;text-transform:uppercase;letter-spacing:3px;text-align:center;font-weight:700;box-sizing:border-box}.room-code-display{font-size:32px;font-weight:700;letter-spacing:8px;color:#5a2d0c;text-align:center;padding:16px;background:linear-gradient(180deg,#ffffff80,#ffffff4d);border-radius:14px;border:2px dashed #c49a3f;cursor:pointer;transition:background .2s;font-family:monospace}.room-code-display:hover{background:linear-gradient(180deg,#fff9,#fff6)}.waiting-text{color:#8b6914;text-align:center;font-size:16px;font-weight:700;animation:pulse 1.5s infinite}.error-message{color:#a03020;font-size:14px;text-align:center;padding:8px 12px;background:#c0503a1a;border:1px solid rgba(192,80,58,.25);border-radius:10px}.online-game-actions{display:flex;gap:8px;flex-wrap:wrap;justify-content:center}.draw-dialog{display:flex;align-items:center;gap:10px;padding:10px 16px;background:linear-gradient(180deg,#f8eac0,#f0dca8);border:1px solid #d4b060;border-radius:12px;color:#7a5a10;font-size:14px;font-weight:700}.disconnect-warning{padding:10px 16px;background:#c0503a1a;border:1px solid rgba(192,80,58,.25);border-radius:12px;color:#a03020;font-size:14px;text-align:center;font-weight:700}.game-over-overlay{position:fixed;inset:0;background:#3c1e0abf;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:20px;z-index:100}.game-over-result{font-size:32px;font-weight:700;font-family:LXGW WenKai,KaiTi,STKaiti,serif;text-shadow:0 2px 6px rgba(0,0,0,.4);letter-spacing:4px}.result-win{color:#90e090}.result-lose{color:#f08080}.result-draw{color:#f0d080}.chat-panel{width:100%}.chat-toggle{padding:6px 14px;font-size:13px;border:1px solid rgba(180,140,80,.3);border-radius:8px;cursor:pointer;background:#ffffff4d;color:#8a6a40;font-family:inherit;transition:all .15s}.chat-toggle:hover{background:#ffffff80;color:#5a3000}.chat-messages{max-height:200px;overflow-y:auto;display:flex;flex-direction:column;gap:4px;padding:10px;background:#ffffff4d;border:1px solid rgba(180,140,80,.2);border-radius:10px;margin-top:8px}.chat-message{font-size:13px;color:#4a2810;word-break:break-word}.chat-sender{color:#a06020;font-weight:700}.chat-input-row{display:flex;gap:6px;margin-top:6px}.chat-input-row input{flex:1;padding:8px 12px;font-size:13px;border:1px solid #c4a878;border-radius:8px;background:#fff9;color:#4a2810;outline:none;font-family:inherit}.chat-input-row button{padding:8px 14px;font-size:13px;border:1px solid #b08838;border-radius:8px;cursor:pointer;background:linear-gradient(180deg,#e8c373,#d4a84e);color:#5a2d0c;font-weight:700;font-family:inherit}.chat-empty{color:#a89070;font-style:italic;font-size:13px;text-align:center}.online-status{font-size:16px;padding:8px 24px;border-radius:20px;background:linear-gradient(180deg,#f0dbb5,#e5cc9a);border:1px solid #c9a86c;text-align:center;box-shadow:inset 0 1px #ffffff80,0 2px 4px #0000001a;font-weight:700}.online-status .my-turn{color:#2d6a2d}.online-status .opponent-turn{color:#8b6914}.game-records{display:flex;flex-direction:column;align-items:center;gap:16px;width:100%}.game-records h2{font-size:26px;color:#5a2d0c;text-shadow:0 1px 0 rgba(255,255,255,.4);letter-spacing:4px;font-family:LXGW WenKai,KaiTi,STKaiti,serif;margin-bottom:0}.records-section-title{font-size:15px;color:#8a6a40;margin:4px 0 0;align-self:flex-start}.records-list{display:flex;flex-direction:column;gap:8px;width:100%}.record-item{display:flex;flex-direction:column;gap:6px;padding:12px 16px;background:linear-gradient(180deg,#ffffff80,#ffffff4d);border:1px solid rgba(180,140,80,.3);border-radius:12px;cursor:pointer;transition:background .15s}.record-item:hover{background:linear-gradient(180deg,#ffffffa6,#ffffff73)}.record-players{display:flex;align-items:center;gap:8px;font-size:16px;font-weight:700}.record-red{color:#b03020}.record-black{color:#3a3a50}.record-vs{color:#a89070;font-size:12px}.record-info{display:flex;gap:12px;font-size:13px;color:#8a6a40}.result-red{color:#b03020;font-weight:700}.result-black{color:#3a3a50;font-weight:700}.result-draw-text{color:#8b6914;font-weight:700}.record-delete-btn{margin-left:auto;background:none;border:none;color:#c0a080;cursor:pointer;font-size:14px;padding:0 4px;line-height:1}.record-delete-btn:hover{color:#b03020}.game-replay{display:flex;flex-direction:column;align-items:center;gap:14px;width:100%}.game-replay h2{font-size:26px;color:#5a2d0c;text-shadow:0 1px 0 rgba(255,255,255,.4);letter-spacing:4px;font-family:LXGW WenKai,KaiTi,STKaiti,serif}.replay-info{display:flex;align-items:center;gap:8px;font-size:16px;font-weight:700}.replay-result{color:#8b6914;margin-left:8px}.replay-progress{font-size:14px;color:#8a6a40}.replay-controls{display:flex;gap:8px}.replay-btn{width:46px;height:46px;font-size:18px;border:1px solid #b08838;border-radius:12px;cursor:pointer;background:linear-gradient(180deg,#e8c373,#d4a84e 40%,#c49a3f);color:#5a2d0c;font-weight:700;transition:all .15s;box-shadow:0 3px #a07830,0 4px 8px #5a2d0c33,inset 0 1px #fff6;display:flex;align-items:center;justify-content:center}.replay-btn:hover:not(:disabled){background:linear-gradient(180deg,#f0d080,#e0b860 40%,#d0a548)}.replay-btn:disabled{opacity:.4;cursor:not-allowed}@media(min-width:600px){#root{align-items:center;padding:20px}.title{font-size:36px}.mode-selector .title{font-size:42px}.game-status{font-size:18px;padding:8px 28px}.app{gap:14px}}