:root{--ink:#263e35;--paper:#f6f3ea;--muted:#7a8075;--red:#aa3f32;--line:#deded0;--wood:#e9d5ae}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font-family:system-ui,-apple-system,"PingFang SC","Microsoft YaHei",sans-serif}button,select{font:inherit}button{cursor:pointer;border:1px solid var(--line);color:var(--ink);background:transparent;border-radius:8px;padding:11px 16px;transition:background .15s}button:hover{background:#e9eadf}button:disabled{opacity:.4;cursor:not-allowed}button:focus-visible,select:focus-visible,a:focus-visible,summary:focus-visible{outline:3px solid #b97935;outline-offset:3px}header{max-width:1440px;margin:auto;padding:28px 5%;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.brand{color:inherit;text-decoration:none;display:flex;gap:12px;align-items:center;font-family:serif;font-size:24px;font-weight:700;letter-spacing:3px}.brand small{font:10px system-ui;letter-spacing:3px;display:block}.seal{display:grid;place-items:center;width:41px;height:43px;color:#fff;background:var(--red);border-radius:4px;font-size:29px;font-weight:400}.eyebrow{font-size:11px;letter-spacing:3px;color:var(--muted)}main{max-width:1440px;margin:0 auto;display:grid;grid-template-columns:minmax(150px,1fr) minmax(360px,570px) minmax(235px,280px);gap:44px;padding:45px 5%}.intro{padding-top:55px}.intro h1{font:clamp(28px,3.1vw,46px)/1.6 "Songti SC","Noto Serif CJK SC",serif;letter-spacing:4px;margin:24px 0}.intro>p:not(.eyebrow){color:var(--muted);font-size:13px;line-height:2.2}.features{display:flex;gap:12px;flex-wrap:wrap;font-size:10px;margin-top:38px;color:var(--muted)}.features span:before{content:'· ';color:var(--red)}.game-top,.game-bottom{display:flex;justify-content:space-between;align-items:center;padding:0 5px 15px;font-size:13px}.game-bottom{padding:15px 5px 0}.game-top>div,.game-bottom>div{display:flex;gap:9px;align-items:center}.side-dot{display:inline-block;width:9px;height:9px;border-radius:50%}.black{background:var(--ink)}.red{background:var(--red)}.muted{color:var(--muted);font-size:12px;line-height:1.8}.pill{padding:5px 12px;background:#e9e9de;border-radius:20px;color:#7a8075;font-size:11px}.board-frame{padding:11px;background:#b99660;border:1px solid #a58b62;border-radius:5px;box-shadow:0 18px 35px #34412c14,inset 0 0 0 4px #c5a777}.board{position:relative;width:100%;aspect-ratio:9/10;background:var(--wood);border:1px solid #7f6947;isolation:isolate;touch-action:manipulation}.board svg{position:absolute;inset:0;width:100%;height:100%;z-index:-1}.cell{position:absolute;display:flex;align-items:center;justify-content:center;width:11.1112%;height:10%;padding:0;border:0;border-radius:0;background:none!important;transform:translate(-50%,-50%);-webkit-tap-highlight-color:transparent}.piece{width:86%;aspect-ratio:1;border-radius:50%;display:grid;place-items:center;background:radial-gradient(circle at 30% 25%,#fff2d5,#e4c792);border:1px solid #aa8957;box-shadow:0 2px 1px #846034,0 3px 4px #71522844,inset 0 0 0 3px #f0dcb7,inset 0 0 0 4px #b69b6d;font:700 clamp(19px,2.3vw,32px)/1 "Songti SC","Noto Serif CJK SC",serif;color:#303f36;transition:transform .15s}.piece.is-red{color:var(--red)}.cell.selected .piece{transform:translateY(-3px);box-shadow:0 0 0 3px var(--ink),0 7px 10px #71522844}.cell.legal:after{content:'';position:absolute;background:#43634dbb;width:20%;aspect-ratio:1;border-radius:50%}.cell.legal:has(.piece):after{background:none;border:3px solid #43634d;width:95%}.cell.last-origin{border-radius:50%;background:#b77a2c24!important}.cell:focus-visible{outline:2px solid var(--ink);outline-offset:-3px}.panel{padding-top:3px}.panel-title{display:flex;justify-content:space-between;align-items:center}.connection{font-size:10px;color:var(--muted)}.connection:before{content:'';display:inline-block;width:5px;height:5px;border-radius:50%;background:#738869;margin-right:5px}.panel h2{font:28px serif;margin:25px 0 10px}.panel>label{display:block;font-size:11px;color:var(--muted);margin:28px 0 9px}select{padding:12px 9px;background:#efeee6;border:1px solid var(--line);border-radius:7px;color:var(--ink);width:100%;font-size:12px}.actions{display:flex;gap:9px;margin-top:15px}.actions button{flex:1;font-size:12px}.primary{background:var(--ink);color:#fff;border-color:var(--ink)}.primary:hover{background:#3e5b4d}.text-button{font-size:11px;border:none;padding:12px 0;color:var(--muted)}.history{border-top:1px solid var(--line);margin-top:15px;padding-top:15px}.history h3{font-weight:500;font-size:12px;display:flex;justify-content:space-between}.history small{color:var(--muted);font-weight:400}.history ol{padding:0;list-style:none;height:140px;overflow:auto;font-size:12px;line-height:2;color:var(--muted)}.history li{border-bottom:1px solid #deded066}.history .empty{border:0;font-size:11px;padding-top:20px}details{border-top:1px solid var(--line);padding-top:18px;font-size:11px;line-height:1.9;color:var(--muted)}summary{cursor:pointer;color:var(--ink)}footer{max-width:1440px;margin:auto;padding:18px 5% 25px;display:flex;justify-content:space-between;color:var(--muted);font-size:10px;letter-spacing:2px}dialog{border:1px solid var(--line);border-radius:14px;padding:25px;max-width:calc(100% - 40px);background:var(--paper);color:var(--ink)}dialog::backdrop{background:#182c2570}dialog h2{font:26px serif}dialog p{font-size:13px;color:var(--muted)}[hidden]{display:none!important}@media(min-width:1450px){main{padding-top:65px}}@media(max-width:1100px){main{grid-template-columns:minmax(350px,570px) minmax(220px,280px);gap:32px;justify-content:center}.intro{display:none}.piece{font-size:clamp(23px,3.3vw,34px)}}@media(max-width:680px){header{padding:16px 20px}header>.eyebrow{display:none}.brand{font-size:19px}.seal{width:33px;height:35px;font-size:24px}main{display:flex;flex-direction:column;gap:26px;padding:22px 14px}.game{width:100%;max-width:520px;margin:auto}.board-frame{padding:8px}.piece{font-size:clamp(19px,5.4vw,31px)}.panel{max-width:520px;width:100%;margin:auto;padding:0 5px}.panel h2{margin-top:14px}.panel>label{margin-top:16px}.history ol{height:90px}footer{padding:15px 20px;font-size:9px;letter-spacing:0}header button{font-size:11px;padding:8px} .game-top,.game-bottom{font-size:12px}.game-bottom .muted{font-size:10px}}@media(prefers-reduced-motion:reduce){*{transition:none!important}}

/* 起点只留半透明实心圆；电脑落定后路径停留 2 秒，再用 0.4 秒淡出；不添加棋子外圈。 */
.board .move-path{z-index:3;pointer-events:none;opacity:.78;animation:move-path-fade .4s linear forwards}.move-tag{position:absolute;right:0;bottom:0;z-index:4;background:#176b8a;color:#fff;border-radius:3px;padding:1px 3px;font:600 10px/1.3 system-ui;pointer-events:none}.landing>.piece{visibility:hidden}.moving-piece{position:absolute;z-index:5;display:flex;align-items:center;justify-content:center;width:11.1112%;height:10%;transform:translate(-50%,-50%);pointer-events:none}.move-notice{margin:12px 2px 0;padding:10px 12px;border:1px solid #176b8a44;border-radius:8px;background:#176b8a0c;color:#20576a;font-size:12px;line-height:1.8;overflow-wrap:anywhere}

@keyframes move-path-fade{from{opacity:.78}to{opacity:0}}
@media(prefers-reduced-motion:reduce){.board .move-path{animation:none}}

/* 棋子朝向各自一方：红子正向（朝下家），黑子旋转 180°（朝上家），棋盘本身不转。 */
.piece.is-black{transform:rotate(180deg)}
.cell.selected .piece.is-black{transform:translateY(-3px) rotate(180deg);box-shadow:0 0 0 3px var(--ink),0 7px 10px #71522844}