:root{--ink:#14231d;--ink-2:#243a31;--jade:#31725b;--jade-bright:#4d9878;--paper:#f4e5c4;--paper-dark:#d5b77d;--red:#b6322c;--cream:#fbf6e9;--muted:#718078;--shadow:0 24px 70px rgba(10,24,18,.26)}
.topbar .brand-mark{font:700 16px system-ui;flex-shrink:0}.topbar h1{font-family:system-ui,sans-serif;letter-spacing:-.03em}.topbar .language-picker{flex-shrink:0}
.language-picker{margin-left:auto;display:flex;gap:5px}.language-picker button{font:14px system-ui;background:transparent;border:1px solid #789185;color:#f4e5c4;border-radius:6px;padding:7px 10px;cursor:pointer}.language-picker button.active{background:#f4e5c4;color:#14231d}.topbar .icon-btn{margin-left:10px}.welcome-bar{display:flex;align-items:center;gap:16px;margin:0 0 28px;color:#f8eed7;font:16px/1.5 system-ui}.welcome-bar div{flex:1}.welcome-bar p{margin:3px 0;font-size:14px;color:#c6d4cb}.welcome-bar a{color:#f8eed7;border:1px solid #718b7b;border-radius:8px;padding:10px 14px;text-decoration:none;white-space:nowrap}.welcome-bar a:first-of-type{background:#31725b;border-color:#4d9878}.rules-panel{margin:24px 0;padding:22px;border-radius:14px;background:#fbf6e9;font:16px/1.6 system-ui}.rules-panel summary{cursor:pointer;font-weight:700;font-size:20px}.rules-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.rules-grid article{background:#fffdf6;border:1px solid #d5dccf;border-radius:9px;padding:16px}.rules-grid h3{font-size:17px;margin:0}.rules-grid p{margin:8px 0 0}.rules-panel p{color:#43594c}html[lang=en] body{font-family:system-ui,-apple-system,sans-serif}html[lang=en] .piece{font-family:SimSun,serif}.welcome-bar a:focus-visible,summary:focus-visible{outline:3px solid #d29229;outline-offset:3px}@media(max-width:650px){.welcome-bar{flex-wrap:wrap;gap:10px}.welcome-bar div{flex-basis:100%}.rules-grid{grid-template-columns:1fr}.language-picker button{padding:6px}.topbar h1{font-size:20px}.topbar p{letter-spacing:0}.rules-panel{padding:16px}}
.clock-strip{display:flex;justify-content:space-between;margin:0 4px 18px;color:#f8eed7;font:16px system-ui}.clock-strip strong{margin-left:12px;font-variant-numeric:tabular-nums;font-size:20px}.board-stage .turn-banner{top:24px}.game-actions{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-top:14px}.game-actions button,.secondary-btn,.archive-row{border:1px solid #bdc6bd;background:#fffdf6;color:#224b3b;padding:10px 12px;border-radius:8px;cursor:pointer;font:14px system-ui}.secondary-btn{margin-top:12px;width:100%}.control-panel select{width:100%;padding:10px;border:1px solid #bdc6bd;border-radius:8px;background:white;color:#14231d;font:14px system-ui}.archive-panel{margin:24px 0;background:#fbf6e9;padding:22px;border-radius:14px;font:16px/1.6 system-ui}.archive-panel h2{font-size:20px;margin:0}.archive-panel p{font-size:14px;color:#526159}.archive-panel .move-head button{padding:8px;border:1px solid #bdc6bd;border-radius:7px}.archive-row{display:block;width:100%;text-align:left;margin-bottom:8px}#archiveList{max-height:260px;overflow:auto}button:focus-visible,select:focus-visible{outline:3px solid #d29229;outline-offset:3px}.target{min-width:6%;min-height:5.4%}.control-panel label,.tip,.move-row,.empty-moves{font-size:14px}.tip,.empty-moves{color:#57675e}.thinking{font-size:14px}
@media(min-width:821px) and (max-width:980px){.game-layout{display:flex;flex-direction:column}.board-stage,.control-panel{width:100%}.control-panel{min-height:0}.piece{font-size:30px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}
*{box-sizing:border-box}html,body{margin:0;min-height:100%;font-family:"Noto Serif SC","Songti SC",SimSun,serif;color:var(--ink)}body{background:radial-gradient(circle at 20% 0%,#315342 0,transparent 34%),linear-gradient(135deg,#14241e,#0d1814 72%);padding:24px;overflow-x:hidden}button{font:inherit}.app-shell{max-width:1260px;margin:auto}.topbar{height:68px;display:flex;align-items:center;color:#f7edd6;border-bottom:1px solid rgba(244,229,196,.18);margin-bottom:20px}.brand-mark{width:42px;height:42px;border:1px solid #d9bd83;border-radius:50%;display:grid;place-items:center;font-size:24px;color:#e8cb91;margin-right:12px}.topbar h1{font-size:22px;letter-spacing:.18em;margin:0}.topbar p{font-family:system-ui,sans-serif;font-size:12px;letter-spacing:.18em;color:#b7c1bb;margin:3px 0 0}.icon-btn{margin-left:auto;width:40px;height:40px;border:1px solid rgba(255,255,255,.16);border-radius:50%;color:#d9bd83;background:rgba(255,255,255,.05);cursor:pointer}.game-layout{display:grid;grid-template-columns:minmax(540px,720px) 320px;grid-template-rows:auto auto;gap:16px;align-items:start}.board-stage{grid-row:1/3;position:relative}.board-wrap{background:linear-gradient(145deg,#8d6c3f,#4a3420);padding:16px;border-radius:12px;box-shadow:var(--shadow);border:1px solid rgba(244,225,184,.25)}.board{position:relative;width:100%;aspect-ratio:9/10;background-color:#e6c78d;background-image:linear-gradient(rgba(80,54,28,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(80,54,28,.035) 1px,transparent 1px);background-size:8px 8px;overflow:hidden;border:2px solid #4e341d}.board::before{content:"楚河　　　　漢界";position:absolute;left:5.55%;right:5.55%;top:45%;height:10%;display:flex;align-items:center;justify-content:center;white-space:pre;font-size:clamp(18px,3vw,34px);letter-spacing:.22em;color:rgba(75,48,24,.7);background:#e6c78d;z-index:2}.grid-line{position:absolute;background:#54391f;opacity:.84;pointer-events:none}.grid-line.h{left:5.55%;right:5.55%;height:1px}.grid-line.v{top:5%;bottom:5%;width:1px}.palace-line{position:absolute;height:1px;background:#54391f;transform-origin:left center;pointer-events:none}.piece{position:absolute;width:9.5%;aspect-ratio:1;transform:translate(-50%,-50%);border-radius:50%;border:3px solid #3e2a19;background:radial-gradient(circle at 35% 28%,#fff7dc,#dfbd7d 68%,#bd9454);box-shadow:0 3px 0 #6e4d2a,0 5px 10px rgba(25,15,6,.38),inset 0 0 0 2px rgba(255,249,220,.6);display:grid;place-items:center;font-weight:800;font-size:clamp(19px,3.1vw,34px);cursor:pointer;z-index:4;transition:left .18s ease,top .18s ease,transform .15s ease,filter .15s}.piece.red{color:var(--red);border-color:#8f2e27}.piece.black{color:#17231d}.piece.selected{transform:translate(-50%,-50%) scale(1.1);filter:drop-shadow(0 0 8px rgba(255,245,184,.95))}.target{position:absolute;width:4.5%;aspect-ratio:1;border-radius:50%;background:rgba(30,112,78,.72);transform:translate(-50%,-50%);z-index:3;cursor:pointer;box-shadow:0 0 0 5px rgba(37,116,84,.18)}.target.capture{width:9.8%;background:transparent;border:3px solid rgba(157,45,39,.72);box-shadow:none}.last-move{position:absolute;width:10.4%;aspect-ratio:1;border:2px solid rgba(31,126,86,.72);transform:translate(-50%,-50%);border-radius:50%;z-index:3}.turn-banner{position:absolute;z-index:8;left:50%;top:-12px;transform:translate(-50%,-50%);background:#f8eed7;border:1px solid #b69a65;border-radius:999px;padding:7px 18px;font-family:system-ui,sans-serif;font-size:13px;font-weight:700;box-shadow:0 6px 20px rgba(0,0,0,.18)}.control-panel{grid-column:2;grid-row:1/3;background:var(--cream);border-radius:14px;padding:22px;box-shadow:var(--shadow);min-height:500px;font-family:system-ui,-apple-system,sans-serif}.panel-head,.move-head{display:flex;align-items:center;justify-content:space-between;font-weight:750;font-size:17px}.live-badge,.you-badge{font-size:12px;color:var(--jade);background:#dfeee7;padding:4px 8px;border-radius:999px}.control-panel label{display:block;margin:22px 0 8px;font-size:13px;font-weight:700;color:#69766f}.segmented,.side-picker{display:grid;grid-template-columns:repeat(3,1fr);padding:3px;background:#e8eadf;border-radius:9px}.segmented button,.side-picker button{border:0;background:transparent;padding:10px 4px;border-radius:7px;cursor:pointer;color:#5c6862}.segmented button.active,.side-picker button.active{background:white;color:var(--ink);box-shadow:0 2px 7px rgba(20,35,29,.12);font-weight:700}.side-picker{grid-template-columns:1fr 1fr}.side-picker button{display:flex;gap:7px;align-items:center;justify-content:center}.mini-piece{width:25px;height:25px;border-radius:50%;display:grid;place-items:center;background:#ead2a3;font-style:normal;font-family:serif;border:1px solid currentColor}.mini-piece.red{color:var(--red)}.mini-piece.black{color:#17231d}.primary-btn{width:100%;border:0;background:linear-gradient(135deg,var(--jade),#235945);color:white;padding:13px;border-radius:9px;font-weight:750;letter-spacing:.06em;cursor:pointer;margin-top:20px;box-shadow:0 7px 16px rgba(38,102,77,.22)}.primary-btn:hover{background:linear-gradient(135deg,var(--jade-bright),var(--jade))}.divider{border-top:1px solid #dedfd7;margin:22px 0}.move-head button{border:0;background:transparent;color:var(--jade);font-size:13px;cursor:pointer}.move-head button:disabled{color:#aeb5b0}.move-list{height:180px;overflow:auto;margin-top:10px;border:1px solid #e0e1d9;border-radius:8px;background:#fff}.empty-moves{height:100%;display:grid;place-items:center;color:#9aa39f;font-size:13px}.move-row{display:grid;grid-template-columns:30px 1fr 1fr;gap:6px;padding:8px 10px;border-bottom:1px solid #edf0eb;font-size:13px}.move-row span:first-child{color:#9aa39f}.tip{font-size:12px;line-height:1.65;color:#87928d;margin:14px 2px 0}.player-card{grid-column:2;display:none;background:rgba(250,246,235,.96);padding:12px 16px;border-radius:12px;align-items:center;gap:11px;font-family:system-ui,sans-serif}.player-card strong{font-size:14px}.player-card p{font-size:12px;color:#758079;margin:2px 0}.avatar{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;background:#e7cc94;border:2px solid;font-weight:800}.red-avatar{color:var(--red)}.black-avatar{color:#16241d}.name-row{display:flex;gap:7px;align-items:center}.status-dot{width:7px;height:7px;background:#36a56c;border-radius:50%}.clock{margin-left:auto;font-variant-numeric:tabular-nums;font-weight:800}.thinking{position:absolute;right:26px;bottom:24px;z-index:8;padding:8px 12px;border-radius:8px;background:rgba(16,34,27,.88);color:white;font:12px system-ui;opacity:0;transition:.2s}.thinking.show{opacity:1}.thinking span{display:inline-block;width:7px;height:7px;background:#6ed09b;border-radius:50%;margin-right:6px;animation:pulse 1s infinite}@keyframes pulse{50%{opacity:.25}}.modal{position:fixed;inset:0;background:rgba(5,13,10,.64);display:grid;place-items:center;z-index:20;padding:20px}.modal[hidden]{display:none}.modal-card{width:min(360px,100%);background:var(--cream);border-radius:18px;padding:30px;text-align:center;box-shadow:var(--shadow)}.result-icon{margin:auto;width:70px;height:70px;border-radius:50%;display:grid;place-items:center;background:#e8cf9e;color:var(--red);border:3px solid currentColor;font-size:36px;font-weight:800}.modal h2{margin:16px 0 6px}.modal p{color:var(--muted);font-family:system-ui,sans-serif}.modal .primary-btn{margin-top:12px}
@media(min-width:1050px){.game-layout{grid-template-columns:minmax(560px,720px) 320px}.player-card{display:flex}.ai-card{grid-row:1}.human-card{grid-row:2;align-self:end}.control-panel{grid-row:1/3}.board-stage{grid-row:1/3}.game-layout{grid-template-columns:minmax(560px,720px) 320px}.player-card{grid-column:2}.control-panel{margin-top:76px;margin-bottom:76px}.ai-card,.human-card{display:none}}
@media(max-width:820px){body{padding:12px}.topbar{margin-bottom:24px}.game-layout{display:flex;flex-direction:column}.board-stage{width:100%}.control-panel{width:100%;min-height:0}.piece{border-width:2px}.board-wrap{padding:9px}.board::before{font-size:clamp(15px,5vw,26px)}.player-card{display:flex;width:100%}.ai-card{order:-1}.control-panel{order:3}.human-card{order:2}.move-list{height:130px}}
@media(max-width:480px){body{padding:8px}.topbar{height:58px}.brand-mark{width:36px;height:36px}.board-wrap{padding:6px}.piece{width:10.5%;font-size:clamp(16px,6.2vw,26px)}.control-panel{padding:18px}.turn-banner{font-size:12px;padding:6px 13px}}
/* Online guest rooms use the established game surface and palette. */
.online-panel{margin:1rem 0;padding:1rem;border:1px solid #d3c8b3;border-radius:12px;background:#fff}
.online-panel h2{font-size:1.1rem;margin:0 0 .5rem}.online-panel p{font-size:1rem;line-height:1.5}
.online-controls,#roomDetails{display:flex;gap:.65rem;align-items:center;flex-wrap:wrap}
.online-panel input{min-width:180px;max-width:100%;flex:1;padding:.65rem;border:1px solid #aaa;border-radius:6px;font:inherit}
.online-panel button{padding:.65rem .85rem;font:inherit;border-radius:6px;cursor:pointer}
.online-panel button:disabled{opacity:.5;cursor:not-allowed}
.online-panel .primary-btn{width:auto;margin:0}#roomDetails{margin-top:.8rem}#roomDetails[hidden],.online-panel button[hidden]{display:none}
#onlinePrivacy{font-size:.875rem;color:#595959}#onlineStatus{min-height:1.5em;font-weight:600;overflow-wrap:anywhere}
@media(max-width:600px){.online-controls label{width:100%}.online-panel input{width:100%;flex-basis:100%}}
/* Shared page background uses the Go theme; game surfaces keep their own colors. */
body{background:#0b1220;font-family:system-ui,-apple-system,"Microsoft YaHei",sans-serif}
/* Shared navigation across all games, including Xiangqi. */
.topbar>a{color:#b9e7ff;margin-left:18px;font:16px system-ui,sans-serif;text-decoration:none;padding:8px 10px;border-radius:6px}.topbar>a:hover{background:#25445a;color:#fff}.topbar>a:focus-visible,.game-nav a:focus-visible{outline:3px solid #65d7f5;outline-offset:3px}.game-nav{display:flex;gap:.5rem;flex-wrap:wrap;margin:1rem 0;font:16px system-ui,sans-serif}.game-nav a,.game-nav button{padding:.65rem 1rem;background:#162238;color:#e3eeff;border:1px solid #465875;border-radius:8px;text-decoration:none}.game-nav a[aria-current=page]{background:#164f65;border-color:#65d7f5;color:#fff}.online-panel[hidden]{display:none!important}
/* Reversible focus mode across all seven games. */
.control-toggle{display:block;margin:8px 0 12px auto;border:1px solid #536b8a;border-radius:8px;background:#162238;color:#e3eeff;padding:9px 14px;font:16px system-ui;cursor:pointer}.control-toggle:focus-visible{outline:3px solid #65d7f5;outline-offset:3px}.focus-play.focus-play{grid-template-columns:minmax(0,1fr)!important;grid-template-rows:auto!important}.focus-play .board-stage{grid-column:1;grid-row:auto}.focus-play .control-panel,.focus-play .hub-controls,.focus-play>aside{display:none!important}.focus-playing .player-card,.focus-playing .welcome-bar,.focus-playing .archive-panel,.focus-playing #rules,.focus-playing .hub-progress{display:none!important}

.release-footer{display:flex;flex-wrap:wrap;gap:14px;align-items:center;margin:24px 0;color:#d4e1d8;font:14px/1.5 system-ui}.release-footer a{color:#b9e7ff}.beta-badge{display:inline-block;border:1px solid #62d4e8;background:#12394b;color:#e8fbff;border-radius:999px;padding:4px 10px;font:700 12px/1.2 system-ui;letter-spacing:.04em}