@import"https://fonts.googleapis.com/css2?family=Ma+Shan+Zheng&family=Noto+Serif+SC:wght@400;600;700;900&display=swap";body.theme-wood{--bg-gradient: linear-gradient(135deg, #1e1b18 0%, #2b231d 50%, #151210 100%);--panel-bg: rgba(43, 35, 29, .75);--panel-border: rgba(212, 163, 115, .25);--accent-gold: #d4a373;--accent-gold-glow: rgba(212, 163, 115, .4);--text-main: #f3e9dc;--text-muted: #a89f91;--board-bg-grad-1: #e8c39e;--board-bg-grad-2: #d4a373;--board-bg-grad-3: #bc8a5f;--board-line-color: #3d2314;--board-frame-color: #5c3d2e;--board-river-text: #5c2c16}body.theme-ink{--bg-gradient: linear-gradient(135deg, #141619 0%, #202428 50%, #0e1012 100%);--panel-bg: rgba(26, 30, 34, .85);--panel-border: rgba(200, 205, 215, .2);--accent-gold: #c5a059;--accent-gold-glow: rgba(197, 160, 89, .3);--text-main: #f3f4f6;--text-muted: #9ca3af;--board-bg-grad-1: #2b3036;--board-bg-grad-2: #1e2226;--board-bg-grad-3: #14171a;--board-line-color: #717d8a;--board-frame-color: #a0acba;--board-river-text: rgba(200, 210, 220, .75)}body.theme-ink .board-wrapper{box-shadow:0 20px 50px #000000e6,0 0 35px #c5a05940}body.theme-dark{--bg-gradient: linear-gradient(135deg, #090d16 0%, #131b2e 50%, #050811 100%);--panel-bg: rgba(15, 23, 42, .85);--panel-border: rgba(99, 102, 241, .35);--accent-gold: #818cf8;--accent-gold-glow: rgba(129, 140, 248, .4);--text-main: #f8fafc;--text-muted: #94a3b8;--board-bg-grad-1: #1e1b4b;--board-bg-grad-2: #0f172a;--board-bg-grad-3: #020617;--board-line-color: #6366f1;--board-frame-color: #818cf8;--board-river-text: rgba(165, 180, 252, .75)}body.theme-dark .board-wrapper{box-shadow:0 20px 50px #000000f2,0 0 40px #818cf84d}.board-area{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;min-height:0}.board-wrapper{position:relative;width:min(100vw - 20px,(100vh - 180px) * .9);max-width:580px;height:auto;aspect-ratio:9/10;border-radius:14px;box-shadow:0 15px 40px #000c,0 0 25px #d4a37326;overflow:hidden;touch-action:manipulation;-webkit-tap-highlight-color:transparent}.board-svg{position:absolute;top:0;left:0;width:100%;height:100%;z-index:1}.board-svg rect.board-bg-rect{fill:url(#boardGrad)}.board-svg .board-outer-frame{stroke:var(--board-frame-color)}.board-svg .board-inner-frame,.board-svg .board-grid-lines line,.board-svg .board-grid-lines path{stroke:var(--board-line-color)}.board-svg .river-text{fill:var(--board-river-text)}.piece-layer{position:absolute;top:0;right:0;bottom:0;left:0;z-index:2}.board-cell{position:absolute;width:11.111%;height:10%;transform:translate(-50%,-50%);display:flex;justify-content:center;align-items:center;cursor:pointer}.board-cell.selected .piece{transform:scale(1.15) translateY(-3px);box-shadow:0 0 20px #f1c40f,0 10px 20px #0009;border-color:#f1c40f!important;z-index:10}.board-cell.selected:after{content:"";position:absolute;width:94%;height:94%;border-radius:50%;border:3px solid #f1c40f;box-shadow:0 0 18px #f1c40f,inset 0 0 10px #f1c40f80;animation:pulseSelect 1.2s infinite alternate;z-index:5;pointer-events:none}.board-cell.valid-move:after{content:"";position:absolute;width:24px;height:24px;border-radius:50%;background:#2ecc71;border:2px solid #ffffff;box-shadow:0 0 12px #2ecc71;z-index:6;pointer-events:none;animation:pulseDot 1s infinite alternate}.board-cell.valid-capture:after{content:"";position:absolute;width:90%;height:90%;border-radius:50%;border:3px dashed #e74c3c;box-shadow:0 0 14px #e74c3c;z-index:6;pointer-events:none;animation:pulseCapture 1s infinite alternate}.board-cell.last-move-from .last-move-from-marker{position:absolute;width:78%;height:78%;border-radius:50%;border:2.5px dashed #f39c12;background:#f39c1238;box-shadow:0 0 12px #f39c1280,inset 0 0 8px #f39c1240;z-index:1;pointer-events:none;display:flex;justify-content:center;align-items:center}.board-cell.last-move-from .last-move-from-marker .from-crosshair{width:10px;height:10px;border-radius:50%;background:#f39c12;box-shadow:0 0 8px #f39c12}.board-cell.last-move-to .last-move-to-marker{position:absolute;width:96%;height:96%;pointer-events:none;z-index:8;animation:lastMovePulse 1.2s ease-in-out infinite alternate}.board-cell.last-move-to .last-move-to-marker:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border-radius:50%;border:3px solid #f39c12;box-shadow:0 0 16px #f39c12,inset 0 0 8px #f39c1266}.board-cell.last-move-to .last-move-to-marker .corner{position:absolute;width:13px;height:13px;border-color:#f39c12;border-style:solid;filter:drop-shadow(0 0 5px #f39c12)}.board-cell.last-move-to .last-move-to-marker .corner.top-left{top:-2px;left:-2px;border-width:3px 0 0 3px;border-top-left-radius:4px}.board-cell.last-move-to .last-move-to-marker .corner.top-right{top:-2px;right:-2px;border-width:3px 3px 0 0;border-top-right-radius:4px}.board-cell.last-move-to .last-move-to-marker .corner.bottom-left{bottom:-2px;left:-2px;border-width:0 0 3px 3px;border-bottom-left-radius:4px}.board-cell.last-move-to .last-move-to-marker .corner.bottom-right{bottom:-2px;right:-2px;border-width:0 3px 3px 0;border-bottom-right-radius:4px}.board-cell.last-move-player.last-move-from .last-move-from-marker{border-color:#00e676;background:#00e67640;box-shadow:0 0 12px #00e67699,inset 0 0 8px #00e6764d}.board-cell.last-move-player.last-move-from .last-move-from-marker .from-crosshair{background:#00e676;box-shadow:0 0 10px #00e676}.board-cell.last-move-player.last-move-to .last-move-to-marker:after{border-color:#00e676;box-shadow:0 0 16px #00e676,inset 0 0 8px #00e67680}.board-cell.last-move-player.last-move-to .last-move-to-marker .corner{border-color:#00e676;filter:drop-shadow(0 0 6px #00e676)}.last-move-line{stroke:#f39c12;stroke-width:4;stroke-dasharray:8,8;stroke-linecap:round;opacity:.75;animation:moveLinePulse 1.5s infinite linear}@keyframes moveLinePulse{0%{stroke-dashoffset:32;opacity:.6}50%{opacity:.95}to{stroke-dashoffset:0;opacity:.6}}@keyframes lastMovePulse{0%{transform:scale(.96);opacity:.85}to{transform:scale(1.05);opacity:1}}@keyframes pulseSelect{0%{transform:scale(.95);opacity:.8}to{transform:scale(1.05);opacity:1}}@keyframes pulseDot{0%{transform:scale(.85)}to{transform:scale(1.15)}}@keyframes pulseCapture{0%{transform:scale(.95) rotate(0)}to{transform:scale(1.05) rotate(15deg)}}.piece{position:relative;width:84%;height:84%;border-radius:50%;display:flex;justify-content:center;align-items:center;z-index:2;transition:transform .15s ease,box-shadow .15s ease;box-shadow:0 6px 12px #0006,inset 0 3px 4px #fff6}.piece:hover{transform:scale(1.1) translateY(-2px);z-index:10}.piece-red{background:radial-gradient(circle at 35% 35%,#fceade,#e6b89c 40%,#c88d68);border:3px solid #8c4424}.piece-red .piece-inner{color:var(--red-piece);border:2px solid var(--red-piece);text-shadow:0 1px 2px rgba(0,0,0,.15)}.piece-black{background:radial-gradient(circle at 35% 35%,#fceade,#e6b89c 40%,#c88d68);border:3px solid #4a3427}.piece-black .piece-inner{color:#1a252f;border:2px solid #1a252f;text-shadow:0 1px 2px rgba(0,0,0,.15)}.piece-inner{width:82%;height:82%;border-radius:50%;display:flex;justify-content:center;align-items:center;font-family:Ma Shan Zheng,Kaiti,serif;font-size:clamp(.95rem,4.2vw,1.65rem);font-weight:700}.piece-small{width:32px;height:32px}.piece-small .piece-inner{font-size:.9rem}.check-banner{position:absolute;top:20px;left:50%;transform:translate(-50%) translateY(-50px);background:linear-gradient(90deg,#c0392b,#e74c3c);color:#fff;padding:12px 30px;border-radius:30px;font-size:1.3rem;font-weight:900;box-shadow:0 10px 25px #e74c3c80;opacity:0;pointer-events:none;transition:all .3s cubic-bezier(.175,.885,.32,1.275);z-index:100}.check-banner.active{transform:translate(-50%) translateY(0);opacity:1}.vibrate{animation:boardShake .4s cubic-bezier(.36,.07,.19,.97) both}@keyframes boardShake{10%,90%{transform:translate3d(-2px,0,0)}20%,80%{transform:translate3d(4px,0,0)}30%,50%,70%{transform:translate3d(-6px,0,0)}40%,60%{transform:translate3d(6px,0,0)}}:root{--bg-gradient: linear-gradient(135deg, #1e1b18 0%, #2b231d 50%, #151210 100%);--panel-bg: rgba(43, 35, 29, .75);--panel-border: rgba(212, 163, 115, .25);--accent-gold: #d4a373;--accent-gold-glow: rgba(212, 163, 115, .4);--red-piece: #c0392b;--red-border: #7f1d1d;--black-piece: #2c3e50;--black-border: #1a252f;--move-valid: rgba(46, 204, 113, .6);--capture-valid: rgba(231, 76, 60, .75);--text-main: #f3e9dc;--text-muted: #a89f91;--board-bg-grad-1: #e8c39e;--board-bg-grad-2: #d4a373;--board-bg-grad-3: #bc8a5f;--board-line-color: #3d2314;--board-frame-color: #5c3d2e;--board-river-text: #5c2c16}*{box-sizing:border-box;margin:0;padding:0;-webkit-user-select:none;user-select:none}body{font-family:"Noto Serif SC",Kaiti,serif;background:var(--bg-gradient);color:var(--text-main);height:100vh;width:100vw;display:flex;justify-content:center;align-items:center;overflow:hidden;margin:0}#app-container{display:flex;flex-direction:column;align-items:center;gap:8px;max-width:1360px;width:100%;height:100vh;padding:10px 16px;box-sizing:border-box;overflow:hidden}.game-header{text-align:center;flex-shrink:0}.game-title{font-family:Ma Shan Zheng,serif;font-size:2.2rem;letter-spacing:4px;background:linear-gradient(180deg,#fceade,#d4a373);-webkit-background-clip:text;-webkit-text-fill-color:transparent;text-shadow:0 4px 15px rgba(0,0,0,.6);margin-bottom:0;line-height:1.1}.game-subtitle{font-size:.8rem;color:var(--text-muted);letter-spacing:2px}.main-layout{flex:1;min-height:0;display:grid;grid-template-columns:290px minmax(420px,1fr) 290px;gap:16px;align-items:center;width:100%;overflow:hidden}.side-panel{display:flex;flex-direction:column;gap:10px;width:100%;height:100%;overflow-y:auto;overflow-x:hidden;padding-right:4px}.side-panel::-webkit-scrollbar{width:4px}.side-panel::-webkit-scrollbar-thumb{background:#d4a3734d;border-radius:4px}.card-panel{background:var(--panel-bg);border:1px solid var(--panel-border);border-radius:10px;padding:12px 14px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:0 8px 20px #0000004d;flex-shrink:0}.card-title{font-size:.95rem;font-weight:700;color:var(--accent-gold);margin-bottom:8px;display:flex;align-items:center;gap:6px;border-bottom:1px solid var(--panel-border);padding-bottom:4px}.control-group{display:flex;flex-direction:column;gap:8px}.control-item{display:flex;justify-content:space-between;align-items:center;font-size:.85rem}select{background:#1a1614;color:var(--text-main);border:1px solid var(--panel-border);border-radius:6px;padding:4px 8px;font-family:inherit;font-size:.85rem;outline:none;cursor:pointer;transition:border-color .2s}select:hover{border-color:var(--accent-gold)}.btn-grid{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin-top:8px}.btn{background:linear-gradient(180deg,#3a2e26,#251d18);color:var(--text-main);border:1px solid var(--panel-border);border-radius:6px;padding:7px 10px;font-family:inherit;font-size:.82rem;font-weight:600;cursor:pointer;transition:all .2s ease;display:flex;justify-content:center;align-items:center;gap:6px;box-shadow:0 4px 10px #0000004d}.btn:hover{background:linear-gradient(180deg,#4e3f34,#342922);border-color:var(--accent-gold);color:#fff;transform:translateY(-2px)}.btn-primary{background:linear-gradient(180deg,#d4a373,#a67c52);color:#1e1b18;border-color:#f1c40f;grid-column:span 2}.btn-primary:hover{background:linear-gradient(180deg,#e4b383,#b68c62);color:#000}.status-badge{text-align:center;padding:10px;border-radius:8px;font-weight:700;font-size:1.05rem;margin-bottom:12px}.status-red{background:#c0392b40;border:1px solid rgba(192,57,43,.5);color:#ff6b6b}.status-black{background:#34495e59;border:1px solid rgba(52,73,94,.6);color:#74b9ff}.timer-box{display:flex;justify-content:space-around;background:#0000004d;padding:10px;border-radius:8px}.timer-item{display:flex;flex-direction:column;align-items:center}.timer-label{font-size:.75rem;color:var(--text-muted)}.timer-val{font-family:monospace;font-size:1.2rem;font-weight:700}.history-log{height:200px;overflow-y:auto;background:#0000004d;border-radius:8px;padding:8px;font-size:.9rem}.history-row{display:grid;grid-template-columns:40px 1fr 1fr;padding:4px 6px;border-bottom:1fr solid rgba(255,255,255,.05)}.history-row:nth-child(2n){background:#ffffff05}.step-num{color:var(--text-muted)}.red-move{color:#ff7675}.black-move{color:#74b9ff}.graveyard{display:flex;flex-wrap:wrap;gap:4px;min-height:40px;padding:6px;background:#0003;border-radius:6px;margin-top:6px}.overlay{position:fixed;top:0;left:0;width:100vw;height:100vh;background:#000000bf;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);display:flex;justify-content:center;align-items:center;z-index:1000;opacity:0;pointer-events:none;transition:opacity .3s ease}.overlay.active{opacity:1;pointer-events:auto}.overlay-card{background:var(--panel-bg);border:2px solid var(--accent-gold);border-radius:20px;padding:40px;text-align:center;box-shadow:0 20px 60px #000000e6;max-width:450px;width:90%;animation:modalIn .3s ease}@keyframes modalIn{0%{transform:scale(.8)}to{transform:scale(1)}}.overlay-title{font-family:Ma Shan Zheng,serif;font-size:2.5rem;color:var(--accent-gold);margin-bottom:12px}.overlay-desc{font-size:1.1rem;color:var(--text-muted);margin-bottom:24px}.eval-bar-container{display:flex;flex-direction:column;gap:6px;width:100%}.eval-labels{display:flex;justify-content:space-between;font-size:.85rem;font-weight:700}.red-text{color:#ff7675}.black-text{color:#74b9ff}.eval-track{display:flex;height:12px;width:100%;border-radius:6px;overflow:hidden;background:#333;box-shadow:inset 0 2px 4px #00000080}.eval-fill{height:100%;transition:width .4s ease}.eval-red{background:linear-gradient(90deg,#d63031,#ff7675)}.eval-black{background:linear-gradient(90deg,#0984e3,#74b9ff)}.endgame-desc-box{background:#00000040;border:1px dashed var(--panel-border);border-radius:8px;padding:8px 12px;font-size:.85rem;color:var(--accent-gold);line-height:1.4;margin-top:6px}.fen-modal-card{max-width:540px;text-align:left}.fen-field-group{display:flex;flex-direction:column;gap:8px}.fen-field-group label{font-size:.9rem;color:var(--text-muted)}.fen-textarea{width:100%;background:#0006;border:1px solid var(--panel-border);border-radius:8px;color:var(--text-main);padding:10px;font-family:monospace;font-size:.85rem;resize:vertical}.fen-textarea:focus{outline:none;border-color:var(--accent-gold)}.fen-btn-row{display:flex;gap:10px;margin-top:6px}.gemini-commentary-box{background:#0d111799;border:1px solid rgba(129,140,248,.4);border-radius:10px;padding:12px 14px;font-size:.9rem;color:#e2e8f0;line-height:1.5;box-shadow:0 4px 15px #0000004d;position:relative;overflow:hidden;animation:glowPulse 3s infinite ease-in-out}@keyframes glowPulse{0%,to{border-color:#818cf866}50%{border-color:#d4a373b3}}.mobile-quick-actions,.mobile-tab-bar{display:none}@media(min-width:768px)and (max-width:1150px){body{height:auto;min-height:100vh;overflow-y:auto}#app-container{height:auto;overflow:visible;padding:16px;max-width:900px}.main-layout{display:grid;grid-template-columns:1fr 1fr;grid-template-areas:"board board" "left right";gap:16px;height:auto;overflow:visible}.board-area{grid-area:board;width:100%}.left-panel{grid-area:left;height:auto}.right-panel{grid-area:right;height:auto}.side-panel{overflow-y:visible}.mobile-hidden{display:flex!important}}@media(max-width:767px){body{height:auto;min-height:100vh;overflow-y:auto}#app-container{height:auto;overflow:visible;padding:8px 10px 24px;gap:4px}.game-header{margin-bottom:2px}.game-title{font-size:clamp(1.35rem,6vw,1.8rem);letter-spacing:2px}.game-subtitle{font-size:.68rem;letter-spacing:1px}.mobile-quick-actions{display:flex;justify-content:center;gap:5px;width:100%;max-width:480px;margin:2px 0 4px}.mobile-quick-actions .btn{flex:1;padding:6px 4px;font-size:.78rem;white-space:nowrap;min-height:36px}.main-layout{display:flex;flex-direction:column;align-items:center;gap:8px;height:auto;overflow:visible;width:100%}.board-area{order:1;width:100%}.mobile-tab-bar{order:2;display:flex;width:100%;max-width:480px;margin:4px 0 6px;background:#0006;border-radius:8px;padding:3px;border:1px solid var(--panel-border)}.mobile-tab-bar .tab-btn{flex:1;padding:8px 4px;border:none;background:transparent;color:var(--text-muted);font-size:.85rem;font-weight:600;border-radius:6px;cursor:pointer;transition:all .2s;display:flex;justify-content:center;align-items:center}.mobile-tab-bar .tab-btn.active{background:linear-gradient(180deg,#d4a373,#a67c52);color:#1e1b18;font-weight:700;box-shadow:0 2px 8px #0006}.left-panel,.right-panel{order:3;height:auto}.mobile-hidden{display:none!important}.card-panel{padding:10px 12px}select,input{font-size:16px;padding:6px 10px}.btn{padding:8px 10px;font-size:.85rem;min-height:38px}.btn-grid{gap:8px}.overlay-card{padding:24px 18px;max-width:92vw;max-height:88vh;overflow-y:auto}.overlay-title{font-size:1.8rem}.overlay-desc{font-size:.95rem}.timer-val{font-size:1.1rem}.history-log{height:150px}}