:root{color:#fff;--page-wood-light:#1f1e1b;--page-wood-dark:#272624;--board-wood-light:#ddb86f;--board-wood-dark:#cf9950;--river-light:#ddb86f;--river-dark:#cf9950;--frame-color:#753717;--line-color:#432611e6;--red-piece:#c51010;--black-piece:#111;font-family:Arial,sans-serif}*{box-sizing:border-box}html,body,#root{width:100%;min-height:100%;margin:0}body{background:repeating-linear-gradient(90deg, #ffffff05 0, #18151505 2px, #1a181708 3px, #08080808 7px), linear-gradient(180deg, var(--page-wood-light), var(--page-wood-dark));color:#fff;justify-content:center;align-items:center;min-height:100vh;padding:16px;display:flex}#root{justify-content:center;align-items:center;min-height:calc(100vh - 32px);display:flex}main{justify-content:center;align-items:center;width:100%;display:flex}.chess-board{position:relative}.square{justify-content:center;align-items:center;display:flex}.piece{-webkit-user-select:none;user-select:none;cursor:grab;line-height:1}.piece:active{cursor:grabbing}.selected{outline-offset:-4px;outline:4px solid #4caf50}.square.last-move{box-shadow:inset 0 0 0 4px #22c55e}.room-dialog{box-sizing:border-box;background:#2b2b2b;border-radius:12px;gap:14px;width:min(320px,92vw);margin:0 auto;padding:24px;display:grid;position:fixed;top:50%;left:50%;transform:translate(-50%,-50%)}.room-dialog input,.room-dialog button{padding:12px;font-size:16px}.checkmate-dialog{border:2px solid var(--board-wood-dark);color:#fff;text-align:center;background:#2b2520;border-radius:16px;width:min(420px,100vw - 32px);padding:28px;box-shadow:0 20px 60px #0008}.checkmate-dialog::backdrop{background:#000b}.checkmate-dialog h2{color:var(--board-wood-light);margin-top:0}.checkmate-winner{font-size:24px;font-weight:700}.checkmate-pieces,.checkmate-actions{flex-wrap:wrap;justify-content:center;gap:16px;margin-top:24px;display:flex}.checkmate-pieces{--piece-size:64px}.separator{text-align:center;opacity:.7}.game-toolbar{align-items:center;gap:8px;margin-bottom:14px;display:flex}.game-toolbar h3{margin:0 12px 0 0}.game-menu{z-index:20;position:fixed;top:16px;left:16px}.menu-toggle{color:#fff;cursor:pointer;background:#0f0f0f;border:1px solid #ffffff29;border-radius:8px;flex-direction:column;justify-content:center;align-items:center;gap:5px;width:46px;height:42px;display:inline-flex;box-shadow:0 8px 22px #00000059}.menu-toggle span{background:currentColor;border-radius:999px;width:22px;height:2px}.menu-panel{background:#151515;border:1px solid #ffffff24;border-radius:8px;width:220px;padding:8px;display:none;position:absolute;top:calc(100% + 8px);left:0;box-shadow:0 16px 34px #00000073}.menu-panel.open{gap:6px;display:grid}.menu-item{color:#fff;width:100%;min-height:38px;font:inherit;text-align:left;cursor:pointer;background:0 0;border:0;border-radius:6px;padding:8px 10px;font-size:13px;font-weight:700}.menu-item:hover,.menu-item:focus-visible{background:#ffffff1a}.menu-item.active{background:#22c55e2e}.menu-item.danger{color:#ffb4a8}.menu-item:disabled{opacity:.65;cursor:default}.button-31{color:#fff;text-align:center;cursor:pointer;-webkit-user-select:none;user-select:none;touch-action:manipulation;background:#000;border:0;border-radius:4px;width:106px;min-width:10px;min-height:44px;margin:0;padding:9px 10px 8px;font-family:Farfetch Basis,Helvetica Neue,Arial,sans-serif;font-size:12px;font-weight:700;line-height:1.5;display:inline-block}.button-31:hover,.button-31:focus-visible{opacity:.75}button:disabled{color:#fff;cursor:default;opacity:1;background-color:#6b7280}.xiangqi-container{-webkit-user-select:none;user-select:none;justify-content:center;width:100%;margin:0 auto;display:flex;position:relative}.xiangqi-toolbar{justify-content:center;margin-bottom:16px;display:flex}.xiangqi-style-button{appearance:none;color:#3d220d;cursor:pointer;background:linear-gradient(#e6c27b,#cf9950);border:1px solid #6f3818;border-radius:999px;padding:10px 22px;font-size:14px;font-weight:700;transition:transform .12s,filter .12s,box-shadow .12s;box-shadow:0 3px #7d4519,0 5px 12px #0000004d}.xiangqi-style-button:hover{filter:brightness(1.06)}.xiangqi-style-button:active{transform:translateY(2px);box-shadow:0 1px #7d4519,0 3px 7px #00000040}.chess-board.xiangqi-board{--piece-size:clamp(42px, 6.7vw, 64px);--field-margin:calc(var(--piece-size) / 2 + 10px);aspect-ratio:9/10;border:clamp(8px, 1.6vw, 13px) solid var(--frame-color);background:repeating-linear-gradient(90deg, #ffffff08 0, #ffffff08 2px, #4626100a 3px, #4626100a 7px), linear-gradient(180deg, var(--board-wood-light), var(--board-wood-dark));border-radius:5px;flex:none;width:min(96vw,760px);padding:0;display:block;position:relative;overflow:visible;box-shadow:inset 0 0 20px #5b240540,0 10px 24px #00000052}.xiangqi-field{left:var(--field-margin);right:var(--field-margin);top:calc(var(--field-margin) - 2px);bottom:calc(var(--field-margin) - 2px);position:absolute}.xiangqi-lines,.xiangqi-points{position:absolute;inset:0}.xiangqi-lines{z-index:1;pointer-events:none}.xiangqi-points{z-index:3;pointer-events:none}.capture-flashes{z-index:5;pointer-events:none;position:absolute;inset:0}.xiangqi-horizontal-line{background:var(--line-color);width:100%;height:1px;position:absolute;left:0}.xiangqi-vertical-line{background:var(--line-color);width:1px;position:absolute}.xiangqi-vertical-line.full{height:100%;top:0}.xiangqi-vertical-line.upper{height:44.4444%;top:0}.xiangqi-vertical-line.lower{height:44.4444%;top:55.5556%}.xiangqi-palace-line{box-sizing:border-box;width:25%;height:22.2222%;position:absolute;left:37.5%}.xiangqi-palace-line.top-a{background:linear-gradient(to bottom right, transparent calc(50% - .6px), var(--line-color) calc(50% - .6px), var(--line-color) calc(50% + .6px), transparent calc(50% + .6px));top:0}.xiangqi-palace-line.top-b{background:linear-gradient(to top right, transparent calc(50% - .6px), var(--line-color) calc(50% - .6px), var(--line-color) calc(50% + .6px), transparent calc(50% + .6px));top:0}.xiangqi-palace-line.bottom-a{background:linear-gradient(to bottom right, transparent calc(50% - .6px), var(--line-color) calc(50% - .6px), var(--line-color) calc(50% + .6px), transparent calc(50% + .6px));bottom:0}.xiangqi-palace-line.bottom-b{background:linear-gradient(to top right, transparent calc(50% - .6px), var(--line-color) calc(50% - .6px), var(--line-color) calc(50% + .6px), transparent calc(50% + .6px));bottom:0}.xiangqi-river{background:repeating-linear-gradient(90deg, #ffffff06 0, #ffffff06 2px, #46261006 3px, #46261006 7px), linear-gradient(180deg, var(--river-light), var(--river-dark));color:#6a3b18;letter-spacing:.18em;justify-content:space-around;align-items:center;height:11.1111%;font-family:Noto Serif CJK SC,Noto Serif SC,Songti SC,SimSun,serif;font-size:clamp(17px,4vw,28px);font-weight:700;display:flex;position:absolute;top:44.4444%;left:0;right:0}.xiangqi-point{width:var(--piece-size);height:var(--piece-size);pointer-events:auto;touch-action:manipulation;background:0 0;justify-content:center;align-items:center;display:flex;position:absolute;transform:translate(-50%,-50%)}.xiangqi-point:before{content:"";opacity:0;background:#ffee5abf;border-radius:50%;width:18px;height:18px;transition:width .12s,height .12s,opacity .12s;position:absolute}.xiangqi-point.last-move:before{opacity:1}.xiangqi-point.selected:before{width:calc(var(--piece-size) + 10px);height:calc(var(--piece-size) + 10px);opacity:1;background:#bee1ff38;border:2px solid #20508cd9}.xiangqi-point.legal-target:before{opacity:1;background:#207846bf;width:16px;height:16px}.xiangqi-point.legal-target:has(.xiangqi-piece):before{width:calc(var(--piece-size) + 8px);height:calc(var(--piece-size) + 8px);background:#20784629;border:2px solid #207846d9}.xiangqi-piece{z-index:4;width:var(--piece-size);height:var(--piece-size);color:var(--black-piece);font-family:Noto Serif CJK SC,Noto Serif SC,Songti SC,SimSun,serif;font-size:calc(var(--piece-size) * .58);cursor:grab;-webkit-user-select:none;user-select:none;background:radial-gradient(circle at 35% 28%,#fff5b8 0,#efd278 48%,#c89436 100%);border:3px solid #17110a;border-radius:50%;justify-content:center;align-items:center;font-weight:800;line-height:1;transition:transform .12s,filter .12s,box-shadow .12s;display:flex;position:relative;box-shadow:inset 0 0 0 2px #f1ce61,inset 0 0 0 4px #21160b,0 3px 5px #0000006b}.xiangqi-piece.last-move-piece:after,.xiangqi-piece.in-check-piece:after{content:"";pointer-events:none;border:4px solid #ffee5af2;border-radius:50%;position:absolute;inset:-8px}.xiangqi-piece.in-check-piece:after{border-color:#5e0bacf2}.xiangqi-piece.capture-flash{left:calc(100% + var(--piece-size) / 2 + 22px);z-index:6;cursor:default;pointer-events:none;position:absolute;transform:translate(-50%,-50%)}.xiangqi-piece.capture-flash.black{top:calc(25% + var(--capture-offset,0px))}.xiangqi-piece.capture-flash.white{top:calc(75% + var(--capture-offset,0px))}.xiangqi-piece.capture-flash:after{content:"";opacity:1;pointer-events:none;border:4px solid #fff;border-radius:50%;animation:1s step-end infinite capture-ring-blink;position:absolute;inset:-8px}@keyframes capture-ring-blink{0%,49%{opacity:1}50%,to{opacity:0}}.xiangqi-piece:hover{filter:brightness(1.04);transform:scale(1.055)}.xiangqi-piece:active{cursor:grabbing;transform:scale(1.075)}.xiangqi-piece[draggable=false]{cursor:default}.xiangqi-piece.white{color:var(--red-piece);border-color:#af0c0c;box-shadow:inset 0 0 0 2px #f2d263,inset 0 0 0 4px #b20d0d,0 3px 5px #0000006b}.xiangqi-piece.black{color:var(--black-piece)}.xiangqi-piece.western{font-family:DejaVu Sans,Segoe UI Symbol,"Noto Sans Symbols 2",sans-serif;font-size:calc(var(--piece-size) * .65);font-weight:400}.xiangqi-piece.western.white{color:var(--red-piece)}.xiangqi-piece.western.black{color:var(--black-piece)}@media (width<=500px){body{padding:18px 4px 28px}.xiangqi-container{width:99vw}.chess-board.xiangqi-board{--piece-size:38px;--field-margin:calc(var(--piece-size) / 2 + 8px);border-width:7px}.xiangqi-style-button{padding:8px 15px;font-size:13px}.game-menu{top:8px;left:8px}.menu-toggle{width:42px;height:40px}}