*{box-sizing:border-box} :root{--ink:#393d36;--muted:#929187;--red:#933f36;--gold:#a39473}body{margin:0;color:var(--ink);background:radial-gradient(ellipse at 28% 40%,#faf9f5,transparent 64%),#eeece6;font-family:"Songti SC","Noto Serif CJK SC","SimSun",serif}button,select{font:inherit;color:inherit;cursor:pointer}button{border:0;background:none}button:focus-visible,select:focus-visible{outline:2px solid var(--red);outline-offset:4px}header{height:112px;max-width:1320px;margin:auto;display:flex;align-items:center;justify-content:space-between;padding:0 55px}.brand{display:flex;gap:15px;align-items:center;text-decoration:none;color:var(--ink);font-size:22px;letter-spacing:4px}.seal{display:grid;place-items:center;border:1px solid #934f43;color:#934f43;width:39px;height:45px;font-size:26px;border-radius:2px}.brand small{display:block;font:8px Arial;letter-spacing:2px;margin-top:7px}.header-right{display:flex;gap:24px;align-items:center;font-size:11px;letter-spacing:3px;color:#8c897d}.circle{border:1px solid #ccc6b8;border-radius:50%;width:28px;height:28px;font-size:13px}main{max-width:1160px;margin:16px auto 50px;display:grid;grid-template-columns:minmax(0,650px) 290px;gap:100px;align-items:center;padding:0 24px}.board-heading,.board-footer{display:flex;justify-content:space-between;align-items:center;padding:0 13px;font-size:13px;letter-spacing:2px;height:42px}.board-heading small,.board-footer small{font-size:10px;color:var(--muted);margin-left:10px;letter-spacing:1px}.dot{display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:8px}.black{background:#4b5048}.red{background:#a85143}.light-label,#captures{font-size:10px;letter-spacing:1px;color:#969084}.board-wrap{padding:19px;border-radius:9px;background:linear-gradient(135deg,#e5dfd1,#faf7ef 40%,#d2c7b2);box-shadow:0 30px 45px -26px #766c5370,0 4px 6px #87785a22,inset 0 1px 1px white,inset 0 0 0 1px #c7bda7}.board-inset{padding:8px;border:1px solid #b5a587;border-radius:3px;background:linear-gradient(115deg,#e8e0ce,#f4efdf 55%,#e7deca);box-shadow:inset 0 2px 8px #78674620,0 1px 0 white}svg{width:100%;display:block;overflow:visible;touch-action:manipulation}.piece{cursor:pointer;transition:transform .18s}.piece:hover{filter:brightness(1.04)}.piece text{user-select:none}.eyebrow{font:9px Arial;letter-spacing:3px;color:#a0947c}h1{font-weight:400;font-size:49px;line-height:1.38;letter-spacing:7px;margin:23px 0 17px}.intro{font-size:12px;line-height:2.2;letter-spacing:3px;color:#929084}.divider{border-top:1px solid #d7d1c3;margin:27px 0;position:relative}.divider span{position:absolute;top:-8px;right:0;background:#eeece6;padding-left:12px;font-size:11px;color:#a99c83}.status{display:flex;align-items:center;gap:15px;margin-bottom:27px}.status-icon{width:43px;height:43px;border:1px solid #cdbba1;border-radius:50%;display:grid;place-items:center;color:var(--red);font-size:24px;background:#eee6d7;box-shadow:2px 3px 5px #93836b20,inset 0 1px 2px #fff}.status small{font-size:9px;color:#a19784;letter-spacing:2px}.status h2{font-size:17px;font-weight:400;margin:7px 0}.status p{font-size:10px;color:#929084;margin:0}.settings label{font-size:10px;letter-spacing:2px;color:#938a77}.segmented{display:flex;background:#e3dfd5;border:1px solid #d9d3c6;border-radius:5px;padding:3px;margin:10px 0 15px}.segmented button{width:50%;font-size:11px;padding:10px 0;border-radius:3px}.segmented button.active{background:#f8f6f0;box-shadow:0 2px 4px #61543b16}.level-row{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}select{font-size:11px;background:transparent;border:0;padding:5px}.primary{background:#4a5148;color:#f7f3e9;width:100%;padding:16px 20px;text-align:left;font-size:12px;letter-spacing:3px;border-radius:4px;box-shadow:0 5px 9px #47504418}.primary span{float:right}.primary:hover{background:#3e463d}.actions{display:flex;justify-content:space-between;padding:14px 0}.actions button{font-size:11px;color:#8e8678;padding:6px}.actions button:hover{color:var(--red)}details{border-top:1px solid #d7d1c3;border-bottom:1px solid #d7d1c3;font-size:11px;color:#8a8171;padding:14px 0}summary{cursor:pointer;letter-spacing:2px}summary span{float:right;font:11px Arial}ol{max-height:130px;overflow:auto;padding-left:22px;font-size:11px;line-height:2}.side-note{margin-top:25px;line-height:2;font-size:11px;letter-spacing:3px;color:#a19784}.side-note span{font:7px Arial;letter-spacing:1.8px}footer{border-top:1px solid #d9d4c8;max-width:1210px;margin:auto;padding:24px 10px;display:flex;justify-content:space-between;font-size:9px;color:#a29a89;letter-spacing:2px}dialog{border:1px solid #c8baa2;border-radius:8px;padding:40px;background:#f5f1e8;max-width:520px;color:var(--ink);box-shadow:0 30px 90px #27291f40}dialog::backdrop{background:#30342e66;backdrop-filter:blur(5px)}dialog h2{font-size:25px;font-weight:400}dialog p{font-size:13px;line-height:2}dialog .muted{font-size:11px;color:#8c8271}.close{position:absolute;right:15px;top:12px;font-size:25px}#toast{position:fixed;bottom:35px;left:50%;transform:translateX(-50%);padding:12px 24px;color:#f8f4ea;background:#4a5148;border-radius:5px;font-size:12px;opacity:0;pointer-events:none;transition:opacity .2s}.actions button:disabled{opacity:.35;cursor:default}@media(min-width:1450px){main{margin-top:35px;gap:115px;max-width:1230px;grid-template-columns:680px 300px}}@media(max-width:1050px){main{gap:45px;grid-template-columns:minmax(0,600px) 260px}h1{font-size:39px}header{padding:0 30px}}@media(max-width:760px){header{height:80px;padding:0 20px}.brand{font-size:18px}.header-right>span{display:none}main{display:flex;flex-direction:column;padding:0 12px;gap:30px;margin-top:0}.game{width:100%;max-width:580px}.board-wrap{padding:10px;border-radius:6px}.board-inset{padding:3px}.board-heading,.board-footer{font-size:11px;padding:0 5px}.light-label{font-size:8px}aside{width:100%;max-width:540px;padding:0 15px}.eyebrow{font-size:8px}h1{font-size:31px;margin:12px 0}h1 br{display:none}.intro{font-size:11px}.intro br{display:none}.divider{margin:23px 0}.side-note{display:none}footer{margin:0 24px;gap:20px;font-size:8px}footer span:nth-child(2){display:none}dialog{margin:20px;padding:30px}#captures{font-size:8px}}

@font-face{font-family:PieceSerif;src:url('./fonts/serif.ttf') format('truetype');font-display:swap;font-weight:500}@font-face{font-family:PieceSans;src:url('./fonts/sans.ttf') format('truetype');font-display:swap;font-weight:400}
.skin-settings{margin:0 0 20px}.skin-settings>label{font-size:10px;letter-spacing:2px;color:#938a77}.skin-options{display:flex;gap:8px;margin-top:10px}.skin-options button{position:relative;display:flex;gap:10px;align-items:center;text-align:left;flex:1;padding:10px;border:1px solid #d4cbb9;border-radius:5px;background:#ede8dd;font-size:12px;transition:background .18s,border-color .18s}.skin-options button.active{border-color:#a89a7f;background:#f9f5eb;box-shadow:0 2px 5px #6256380b}.skin-options small{display:block;font-size:8px;color:#9a8d76;margin-top:5px;letter-spacing:1px}.skin-options i{position:absolute;right:6px;top:6px;font:9px Arial;color:#7c856b;opacity:0}.skin-options .active i{opacity:1}.skin-sample{display:grid;place-items:center;width:32px;height:32px;border-radius:50%;background:radial-gradient(circle at 30% 20%,#fff8e7,#ead7b3);box-shadow:1px 2px 3px #69583b25;color:#983c2d;font-size:21px}.skin-sample.serif{font-family:PieceSerif,serif;font-weight:500}.skin-sample.sans{font-family:PieceSans,sans-serif;font-weight:400}
@media(min-width:761px){h1{font-size:42px;margin:15px 0 12px}.intro{margin:0}.divider{margin:22px 0}.status{margin-bottom:20px}.side-note{margin-top:16px}}

.status-icon{border:0;background:radial-gradient(circle at 30% 20%,#fff8e7,#ead7b3);box-shadow:1px 3px 5px #69583b25;font-weight:400}

/* Carved ivory jade: generated material and substantial slab bevel. */
.board-wrap{position:relative;padding:21px;border-radius:18px;background:linear-gradient(135deg,#fff9e9 0%,#efe1c3 35%,#cebc99 83%,#b6a17d);box-shadow:0 5px 0 #c3af88,0 9px 0 #b49e77,0 13px 13px -6px #7b674c60,8px 32px 45px -20px #77634370,inset 1px 2px 3px #fffdf5,inset -2px -3px 6px #9c845d45;border:1px solid #e0d0b1}
.board-inset{position:relative;border-radius:9px;padding:8px;border:1px solid #d6c5a5;background:linear-gradient(120deg,#fff9eb52,#faf3e0b5 65%,#e8d8b852),url('./assets/jade-board.png') center/cover;box-shadow:inset 0 1px 4px #866e4825,inset 0 -1px 1px #fff9ea,0 1px 1px #fff9eb}
.jade-piece:hover{filter:brightness(1.025) drop-shadow(0 -1px 1px #fff8e778)}
.skin-sample,.status-icon{background: url('./assets/jade-piece.png') center/128% 128% no-repeat;box-shadow:none}
.skin-options button{background:#eee7d9}.skin-options button.active{background:#fcf5e8;border-color:#ac9773}
@media(max-width:760px){.board-wrap{padding:10px;border-radius:12px;box-shadow:0 4px 0 #c3af88,0 7px 0 #b49e77,3px 19px 28px -14px #77634370,inset 1px 1px 2px #fffdf5}.board-inset{padding:3px;border-radius:6px}}

/* Reference artwork: preserve native carved lettering, material, and bevel. */
.original-piece-art{filter:drop-shadow(1.1px 2.2px 1.6px #4d3b2263)}
.jade-piece:hover{filter:brightness(1.025)}

/* 凝脂白玉 · 山水相望 — a single quiet slab, moderate empty border. */
.board-wrap{padding:0;border-radius:17px;border:1px solid #e5ddcc;background:#f5f0e5;box-shadow:0 3px 0 #c8bca3,0 5px 3px #b1a08630,0 19px 30px -16px #70624d77,inset 1px 1px 3px #fffef7,inset -1px -2px 3px #c9bda466;overflow:hidden}
.board-inset{padding:0;border:0;border-radius:16px;background:linear-gradient(115deg,#fffdf5ee,#f6f2e9ef 55%,#eae3d6ee),url('./assets/jade-board.png') center/cover;box-shadow:inset 1px 1px 3px #fffef9,inset -1px -1px 3px #d1c5ad80}
#board{outline:none}
.view-settings{border-top:1px solid #d7d1c3;padding:15px 0 16px}.immersion-row{display:flex;align-items:center;position:relative;cursor:pointer;font-size:12px;letter-spacing:1px}.immersion-row small{display:block;font-size:9px;letter-spacing:1px;color:#948b79;margin-top:6px}.immersion-row input{position:absolute;right:0;width:36px;height:22px;opacity:0;cursor:pointer}.switch-track{margin-left:auto;width:34px;height:20px;background:#d1ccbf;border-radius:20px;padding:3px;transition:background .2s}.switch-track:after{content:'';display:block;background:#fffdf6;width:14px;height:14px;border-radius:50%;box-shadow:0 1px 3px #0002;transition:transform .2s}.immersion-row input:checked+.switch-track{background:#64705f}.immersion-row input:checked+.switch-track:after{transform:translateX(14px)}.immersion-row input:focus-visible+.switch-track{outline:2px solid #933f36;outline-offset:3px}#immersiveHelp{font-size:9px;line-height:1.7;color:#a09785;margin:9px 0 0}
body.immersive{height:100dvh;overflow:hidden;background:#eeece6}
body.immersive header,body.immersive aside,body.immersive footer,body.immersive .board-heading,body.immersive .board-footer,body.immersive #toast{display:none!important}
body.immersive main{display:flex;align-items:center;justify-content:center;gap:0;width:100%;max-width:none;height:100dvh;margin:0;padding:18px}
body.immersive .game{width:min(calc((100dvh - 44px)*584/648),calc(100vw - 36px));max-width:none;flex:none}
@media(max-width:760px){.board-wrap{padding:0;border-radius:13px}.board-inset{padding:0;border-radius:12px}body.immersive main{padding:10px}body.immersive .game{width:min(calc((100dvh - 30px)*584/648),calc(100vw - 20px))}}
@media(min-width:761px){header{height:90px}main{align-items:start;margin-top:8px}.side-note{margin-top:14px}}

.exit-immersive{display:none;position:fixed;z-index:30;right:max(18px,env(safe-area-inset-right));top:max(18px,env(safe-area-inset-top));padding:10px 14px;border:1px solid #d3ccbd;border-radius:24px;background:#f8f6efed;color:#716b5e;box-shadow:0 3px 12px #51452e0c;font-size:11px;letter-spacing:1px;backdrop-filter:blur(12px)}.exit-immersive span{font:17px Arial;margin-right:4px}.exit-immersive:hover{background:#fffdf6;color:#393d36}body.immersive .exit-immersive{display:flex;align-items:center}body.immersive main{padding-top:64px}body.immersive .game{width:min(calc((100dvh - 90px)*584/648),calc(100vw - 36px))}
#resultDialog{width:min(420px,calc(100vw - 40px));text-align:center;padding:36px;border-radius:16px;background:linear-gradient(135deg,#fffdf5,#eee8da);border:1px solid #d5c9b3}#resultDialog::backdrop{background:#35382e52;backdrop-filter:blur(4px)}#resultDialog .eyebrow{font-size:8px;letter-spacing:2.5px}#resultSeal{margin:25px auto 18px;width:66px;height:66px;border-radius:50%;background:radial-gradient(circle at 30% 20%,#fff8e7,#e4d0a9);box-shadow:inset 0 1px 2px #fff,0 3px 0 #c6b18c,2px 7px 9px #5d4f3224;font-family:PieceSerif,serif;font-size:39px;display:grid;place-items:center}#resultTitle{font-size:28px;letter-spacing:3px;margin:20px 0 12px}#resultReason{font-size:12px;color:#827764;line-height:1.9;margin:0}#resultDialog .result-note{font-size:11px;color:#a09480;margin:12px 0 28px}.result-actions .primary{text-align:center;letter-spacing:2px}.result-actions #finishGame{width:100%;margin-top:10px;padding:13px;font-size:12px;color:#817561;border:1px solid #d6ccba;border-radius:4px}.result-actions #finishGame:hover{background:#fff8e9}
@media(max-width:760px){.exit-immersive{top:max(12px,env(safe-area-inset-top));right:12px;padding:9px 12px}body.immersive main{padding:58px 10px 10px}body.immersive .game{width:min(calc((100dvh - 82px)*584/648),calc(100vw - 20px))}#resultDialog{margin:auto;padding:28px}}
/* Two distinct views: quiet setup, focused play. */
[hidden]{display:none!important}body{min-height:100dvh}
body[data-page="home"] .game-page,body[data-page="game"] .home-header,body[data-page="game"] .home-footer{display:none}
main.home-page{display:grid;grid-template-columns:minmax(0,560px) 300px;max-width:1080px;gap:110px;align-items:center;margin:12px auto 38px;padding:0 32px}
.home-preview{position:relative;width:100%;padding:18px 0 0}.home-preview .board-wrap{transform:rotate(-4deg);box-shadow:0 4px 0 #c8bca3,0 25px 45px -25px #70624d77}.home-preview .board-heading,.home-preview .board-footer{display:none}.home-preview .game{width:100%}.home-preview .piece{pointer-events:none}.home-preview .preview-caption{text-align:center;margin-top:34px;color:#a2967e;font-size:10px;letter-spacing:4px}.home-panel h1{font-size:49px;margin:20px 0 15px}.home-rule{height:1px;background:#d7d1c3;margin:29px 0}.home-panel .skin-settings{margin-bottom:27px}.home-panel .settings{margin-bottom:27px}.home-panel .level-row{margin-bottom:0}.home-panel .primary{padding:18px 20px}.continue-game{display:block;width:100%;text-align:left;border:1px solid #cfc7b7;padding:14px 20px;border-radius:4px;margin-top:10px;font-size:12px;letter-spacing:2px}.continue-game span{float:right}.continue-game:hover{background:#f8f5ed}.home-footnote{font-size:10px;color:#a29886;letter-spacing:3px;margin-top:23px;text-align:center}
main.game-page{display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:0;width:min(760px,100%);max-width:760px;margin:0 auto;padding:0 24px 18px;min-height:100dvh}
.game-nav{width:100%;display:flex;align-items:center;justify-content:space-between;gap:16px;height:78px;flex-shrink:0}.back-home{font-size:12px;letter-spacing:1px;padding:10px 0;color:#8a8170;min-width:105px;text-align:left}.back-home:hover{color:#933f36}.game-status{margin:0;gap:10px}.game-status .status-icon{width:33px;height:33px;font-size:20px}.game-status h2{font-size:14px;margin:4px 0 0;letter-spacing:1px}.game-status small{font-size:8px}.game-mode{color:#958a77;min-width:105px;text-align:right;font-size:10px;letter-spacing:1px}
.game-stage{width:min(100%,calc((100dvh - 184px)*584/648));flex-shrink:0}.game-stage .game{width:100%;max-width:none}.game-stage .board-heading,.game-stage .board-footer{display:none}
.game-hint{margin:12px 0 9px;min-height:14px;font-size:10px;color:#9a907d;letter-spacing:1px;line-height:14px}
.game-toolbar{display:flex;align-items:center;justify-content:center;gap:4px;position:relative;width:100%;max-width:470px;height:42px;flex-shrink:0}.game-toolbar>button{display:flex;align-items:center;justify-content:center;gap:6px;white-space:nowrap;font-size:11px;color:#817865;border-radius:5px;padding:10px 13px}.game-toolbar>button>span{font:17px Arial;color:#93866e}.game-toolbar>button:hover,.game-more>summary:hover{background:#e6e1d5}.game-toolbar>button:disabled{opacity:.3;cursor:default}.game-more{position:relative;border:0;padding:0;font-size:11px;color:#817865}.game-more>summary{list-style:none;display:flex;align-items:center;gap:6px;padding:10px 13px;border-radius:5px;font:17px Arial;letter-spacing:0}.game-more>summary span{font:11px "Songti SC",serif}.game-more>summary::-webkit-details-marker{display:none}.more-panel{position:absolute;right:0;bottom:48px;width:220px;padding:10px 14px;border:1px solid #d6cbb7;border-radius:9px;background:#faf7ef;box-shadow:0 12px 35px #5d50372b;z-index:20}.more-panel>button{display:block;width:100%;text-align:left;padding:12px 2px;font-size:12px}.more-panel>button:hover{color:#933f36}.game-records{margin-top:4px;font-size:11px}.game-records ol{padding-left:15px;max-height:150px;font-size:10px;letter-spacing:0}
body.immersive .game-nav,body.immersive .game-toolbar,body.immersive .game-hint{display:none!important}body.immersive main.game-page{width:100%;max-width:none;min-height:0;height:100dvh;padding:64px 18px 18px;justify-content:center}body.immersive .game-stage{width:min(calc((100dvh - 90px)*584/648),calc(100vw - 36px))}body.immersive .game{width:100%}
@media(max-width:1050px){main.home-page{gap:60px;grid-template-columns:minmax(0,500px) 280px;max-width:960px}.home-panel h1{font-size:42px}}
@media(max-width:760px){.home-header{height:74px}main.home-page{display:flex;flex-direction:column;gap:38px;padding:0 28px;margin:5px auto 24px;max-width:580px}.home-preview{width:64%;padding:7px 0 0}.home-preview .board-wrap{transform:rotate(-5deg)}.home-preview .preview-caption{margin-top:20px;font-size:8px;letter-spacing:2px}.home-panel{width:100%}.home-panel h1{font-size:35px;margin:12px 0;line-height:1.3}.home-panel h1 br{display:none}.home-panel .intro{font-size:11px;margin:0}.home-panel .intro br{display:none}.home-rule{margin:22px 0}.home-panel .skin-settings{margin-bottom:22px}.home-panel .settings{margin-bottom:23px}.home-footnote{margin:18px 0}.home-footer{padding:18px 0}main.game-page{padding:0 10px 12px}.game-nav{height:64px;gap:8px;padding:0 5px}.back-home{font-size:10px;min-width:80px}.game-mode{font-size:9px;min-width:80px}.game-status{gap:7px}.game-status .status-icon{width:27px;height:27px;font-size:17px}.game-status h2{font-size:12px}.game-status small{font-size:7px;letter-spacing:1px}.game-stage{width:min(100%,calc((100dvh - 168px)*584/648))}.game-toolbar{gap:1px;max-width:430px}.game-toolbar>button{font-size:10px;padding:10px 9px;gap:4px}.game-more>summary{padding:10px 9px}.game-more>summary span{font-size:10px}.game-hint{margin:11px 0 8px;font-size:9px}body.immersive main.game-page{padding:58px 10px 10px}body.immersive .game-stage{width:min(calc((100dvh - 82px)*584/648),calc(100vw - 20px))}body.immersive .game{width:100%}}

/* 童趣浮雕: clean porcelain, pictorial reliefs, warm clay and slate blue. */
.skin-options{flex-wrap:wrap}.skin-options button{min-width:120px}.skin-options button[data-skin="playful"]{flex-basis:100%}.skin-sample.playful{background:none;overflow:hidden}.skin-sample.playful svg{width:100%;height:100%}
body[data-skin="playful"]{--ink:#525451;--red:#b7735d;--muted:#93918b;background:radial-gradient(ellipse at 30% 35%,#fffefa,transparent 65%),#f5f3ee;font-family:"Microsoft YaHei","PingFang SC",sans-serif}
body[data-skin="playful"] .board-wrap{border:1px solid #e5dfd2;border-radius:17px;background:#f5efe4;box-shadow:0 3px 1px #d4cabb,0 16px 32px -17px #83776666,inset 1px 1px 3px white}
body[data-skin="playful"] .board-inset{background:linear-gradient(115deg,#fffcf6,#f5efe4 75%,#eee7da);box-shadow:inset 1px 1px 4px #ffffff,inset -1px -1px 4px #cfc3b84a}
.playful-art{filter:drop-shadow(.6px 1.6px 1.2px #786a5530)}
body[data-skin="playful"] .red{background:#bf806a}body[data-skin="playful"] .black{background:#7b8a98}
body[data-skin="playful"] .skin-options button.active{background:#fffcf5;border-color:#b9aa96}body[data-skin="playful"] .status-icon{background:none}
body[data-skin="playful"] .primary{background:#7c8a91;border-radius:10px}body[data-skin="playful"] .primary:hover{background:#677881}
.game-skin-picker{padding-bottom:10px;border-bottom:1px solid #ded7c9}.game-skin-picker small{font-size:9px;color:#9a907e}.game-skin-picker button{display:block;text-align:left;width:100%;padding:9px 2px;font-size:11px}.game-skin-picker button:hover{color:#b7735d}
body[data-skin="playful"] .home-rule{margin:20px 0}body[data-skin="playful"] .home-panel .skin-settings{margin-bottom:20px}

#drawOfferDialog,#longCheckDialog{width:min(430px,calc(100vw - 40px));border-radius:16px;background:#faf7ef}#drawOfferDialog button:disabled{opacity:.4;cursor:default}#declineDraw{display:block;width:100%;padding:14px;margin-top:10px;border:1px solid #d6ccba;border-radius:5px;font-size:12px}.long-check-warning{font:11px/1.7 "Microsoft YaHei","PingFang SC",sans-serif;color:#9e6345;border:1px solid #dfc6ae;background:#fff8ed;border-radius:8px;padding:9px 14px;margin:12px 0 0;max-width:500px}body.immersive .long-check-warning{position:fixed;z-index:25;bottom:12px;left:50%;transform:translateX(-50%);width:max-content;max-width:calc(100vw - 30px);margin:0}#offerDraw:disabled{opacity:.4;cursor:default}

/* Size the board from usable viewport space, never from a fixed desktop cap. */
main.game-page{width:100%;max-width:none;min-height:100dvh;padding:0 12px 8px}
.game-nav{max-width:1100px;height:56px}
.game-stage{width:min(100%,calc((100dvh - 126px)*584/648));max-width:none}
.game-hint{margin:8px 0 5px}
@media(min-width:1100px) and (min-aspect-ratio:6/5){
 main.game-page{--board-width:min(calc((100dvh - 32px)*584/648),calc(100vw - 360px));display:grid;grid-template-columns:minmax(140px,1fr) var(--board-width) minmax(140px,1fr);grid-template-rows:minmax(0,1fr);align-items:center;column-gap:20px;height:100dvh;min-height:0;padding:16px}
 .game-stage{grid-column:2;grid-row:1;width:100%;align-self:center}
 .game-nav{grid-column:1;grid-row:1;align-self:start;justify-self:end;display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-start;gap:36px;width:min(100%,220px);height:auto;padding:16px 6px}
 .game-nav .game-status{align-items:center}.game-nav .game-mode{text-align:left;min-width:0}.game-nav .back-home{min-width:0}
 .game-toolbar{grid-column:3;grid-row:1;align-self:center;justify-self:start;display:flex;flex-direction:column;align-items:stretch;justify-content:center;gap:12px;width:150px;max-width:100%;height:auto;padding:16px 8px;border:1px solid #ded8ce;border-radius:16px;background:#fcfaf644}
 .game-toolbar>button,.game-more>summary{justify-content:flex-start;padding:13px 15px;font-size:12px}.game-more>summary span{font-size:12px}
 .more-panel{right:0;bottom:48px;width:220px;max-height:calc(100dvh - 50px);overflow:auto}
 .game-hint{position:fixed;bottom:24px;left:24px;max-width:145px;line-height:1.8;margin:0}
 .long-check-warning{position:fixed;left:20px;bottom:90px;width:145px;margin:0}
}
@media(max-width:760px){
 main.game-page{padding:0 8px 8px}.game-nav{height:52px}.game-stage{width:min(100%,calc((100dvh - 120px)*584/648))}.game-hint{margin:7px 0 5px}.game-toolbar{height:40px}
}
/* Immersion reserves only the exit control's safe margin. */
body.immersive main.game-page{display:flex;flex-direction:column;justify-content:center;width:100%;max-width:none;height:100dvh;min-height:0;padding:12px}
body.immersive .game-stage{width:min(calc((100dvh - 26px)*584/648),calc(100vw - 26px));max-width:none}
body.immersive .game{width:100%;max-width:none}
body.immersive .long-check-warning{left:50%;bottom:12px;width:max-content;max-width:calc(100vw - 30px)}
@media(max-width:760px){body.immersive main.game-page{padding:8px}body.immersive .game-stage{width:min(calc((100dvh - 22px)*584/648),calc(100vw - 18px))}}
/* The source artwork provides its own clean edge; avoid softening it with filters. */
.playful-art{filter:none;image-rendering:auto}.piece.jade-piece:has(.playful-art){filter:none}.piece.jade-piece:has(.playful-art):hover{filter:brightness(1.025)}

/* Reference proportions: quiet rounded slab, molded mountain and water. */
body[data-skin="playful"] .board-wrap{border-radius:18px;border:1px solid #e8dece;background:linear-gradient(135deg,#fff9f0,#e9dfcf);box-shadow:0 3px 0 #ccbea8,0 7px 7px -4px #a5967c60,0 20px 32px -20px #7a6b5577,inset 1px 1px 3px #fffdf8}
body[data-skin="playful"] .board-inset{border-radius:17px;background:radial-gradient(ellipse at 25% 18%,#fffaf0a8,transparent 75%),linear-gradient(115deg,#f9f2e7,#f4ebdd 68%,#ece1d0);box-shadow:inset 1px 1px 3px #fffdf8,inset -1px -2px 5px #cbbba54d}
body[data-skin="playful"] .board-inset:before{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;opacity:.035;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='256' height='256'%3E%3Cfilter id='grain'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23grain)' opacity='.8'/%3E%3C/svg%3E")}
body[data-skin="playful"] #board{position:relative}
body[data-skin="playful"] .game-stage{width:min(100%,calc((100dvh - 126px)*520/592))}
@media(min-width:1100px) and (min-aspect-ratio:6/5){body[data-skin="playful"] main.game-page{--board-width:min(calc((100dvh - 32px)*520/592),calc(100vw - 360px))}body[data-skin="playful"] .game-stage{width:100%}}
@media(max-width:760px){body[data-skin="playful"] .game-stage{width:min(100%,calc((100dvh - 120px)*520/592))}}
body[data-skin="playful"].immersive .game-stage{width:min(calc((100dvh - 26px)*520/592),calc(100vw - 26px))}
@media(max-width:760px){body[data-skin="playful"].immersive .game-stage{width:min(calc((100dvh - 22px)*520/592),calc(100vw - 18px))}}

body[data-skin="playful"] .river-relief{opacity:.8}

body[data-skin="playful"] .river-relief{opacity:1}
/* Native SVG landscape: one unit scale for both axes, including all square cells. */
.terrain-picker{display:none;margin:0 0 18px}.terrain-picker small{font-size:10px;color:#968974;letter-spacing:1px}.terrain-picker>div{display:flex;gap:8px;margin-top:9px}.terrain-picker button{border:1px solid #ddd1bf;border-radius:7px;padding:9px 12px;font-size:11px;background:#f6f0e5}.terrain-picker button.active{border-color:#a7b18c;background:#eef0e2;color:#586b51}body[data-skin="playful"] .terrain-picker{display:block}.more-panel .terrain-picker{margin:12px 0;border-bottom:1px solid #ded7c9;padding-bottom:13px}.terrain-art{isolation:isolate}body[data-skin="playful"]:is([data-terrain="riverside"],[data-terrain="vector"]) .game-stage{width:min(100%,calc((100dvh - 126px)*520/640))}
@media(min-width:1100px) and (min-aspect-ratio:6/5){body[data-skin="playful"]:is([data-terrain="riverside"],[data-terrain="vector"]) main.game-page{--board-width:min(calc((100dvh - 32px)*520/640),calc(100vw - 360px))}body[data-skin="playful"]:is([data-terrain="riverside"],[data-terrain="vector"]) .game-stage{width:100%}}
@media(max-width:760px){body[data-skin="playful"]:is([data-terrain="riverside"],[data-terrain="vector"]) .game-stage{width:min(100%,calc((100dvh - 120px)*520/640))}}
body[data-skin="playful"]:is([data-terrain="riverside"],[data-terrain="vector"]).immersive .game-stage{width:min(calc((100dvh - 26px)*520/640),calc(100vw - 26px))}
@media(max-width:760px){body[data-skin="playful"]:is([data-terrain="riverside"],[data-terrain="vector"]).immersive .game-stage{width:min(calc((100dvh - 22px)*520/640),calc(100vw - 18px))}}

.terrain-art image{image-rendering:auto}.terrain-picker>div{flex-wrap:wrap}
/* 静弈 · clay home. Typography and controls are real, accessible HTML. */
body[data-page="home"]{--ink:#53564e;--muted:#959687;--red:#bc7d67;background:radial-gradient(ellipse at 25% 43%,#e9eddf99,transparent 48%),radial-gradient(ellipse at 85% 20%,#f3e3d680,transparent 40%),#f8f5ee;font-family:"Microsoft YaHei","微软雅黑","PingFang SC","Noto Sans CJK SC",sans-serif}
body[data-page="home"] button,body[data-page="home"] select,body[data-page="home"] h1,body[data-page="home"] .brand,body[data-page="home"] small,body[data-page="home"] .eyebrow{font-family:inherit}
.home-header{height:92px;max-width:1320px;padding:0 48px}.brand{gap:12px;letter-spacing:0}.brand-logo{width:56px;height:56px;border-radius:16px;object-fit:cover;box-shadow:0 3px 8px #9e8a6d18}.brand-name{font-size:24px;line-height:1.2;font-weight:700;color:#565a50;letter-spacing:3px}.brand small{font-size:10px;font-weight:400;letter-spacing:1.5px;margin-top:7px;color:#9b9c8d}.header-right{font-size:11px;letter-spacing:1px;gap:22px}.header-right .circle{width:32px;height:32px;border-color:#ddd5c6;background:#fffaf1;box-shadow:inset 0 1px 0 #fff,0 3px 6px #897b5c0c;color:#928b7a}
main.home-page{max-width:1280px;grid-template-columns:minmax(0,1fr) 402px;gap:76px;padding:12px 54px 28px;margin:0 auto;min-height:calc(100dvh - 160px);align-items:center}
.home-preview{width:100%;padding:0;display:flex;flex-direction:column;align-items:center;justify-content:center;align-self:center;min-width:0}
.home-preview .game{width:min(100%,calc((100dvh - 194px)*.8125));max-width:580px;position:relative}
.home-preview .board-wrap{transform:rotate(-3deg);border-radius:20px;box-shadow:0 4px 1px #d1c5af,0 28px 42px -24px #80725166,inset 0 1px 2px #fff8ee;border:1px solid #e3d8c4}
.home-preview .preview-caption{margin-top:25px;font-size:10px;letter-spacing:2px;color:#a49b87}
.home-panel{padding:0;width:100%;position:relative}.home-kicker{display:flex;gap:8px;align-items:center;color:#909c7c;font-size:11px;letter-spacing:1.5px;font-weight:500}.home-kicker>span{height:6px;width:6px;border-radius:50%;background:#a7b48e;box-shadow:0 0 0 4px #e7ebdf}.home-panel h1{font-size:44px;font-weight:700;line-height:1.43;letter-spacing:1px;margin:17px 0 12px;color:#545b50}.home-panel h1 em{font-style:normal;color:#bb7d67}.home-panel .intro{font-size:12px;line-height:1.95;letter-spacing:.6px;color:#949183;margin:0 0 25px}
.home-setup{padding:22px 24px 16px;border:1px solid #e6dece;border-radius:22px;background:linear-gradient(135deg,#fffdf6dc,#f4eee2cc);box-shadow:inset 1px 1px 0 #ffffff,0 10px 25px -20px #84735c55}.setup-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:19px}.setup-heading>span{font-size:13px;font-weight:700;color:#62675a}.setup-heading small{font-size:9px;letter-spacing:.2px;color:#a5a18f}
.home-panel .skin-settings,body[data-skin="playful"] .home-panel .skin-settings{margin:0 0 15px}.home-panel .skin-settings>label,.home-panel .settings label,.home-panel .terrain-picker small{font-size:10px;letter-spacing:.5px;color:#9a9482}
.home-panel .skin-options{display:grid;grid-template-columns:1fr 1fr 1.2fr;gap:6px;margin-top:8px}.home-panel .skin-options button{min-width:0;min-height:50px;flex:none;gap:6px;padding:9px 7px;border:1px solid #e7dfd0;border-radius:10px;background:#f8f3e9;font-size:10px;color:#827b6a;transition:background .2s,box-shadow .2s}.home-panel .skin-options button.active{border-color:#c6c8ab;background:#eef0e2;box-shadow:inset 0 1px 0 #fff}.home-panel .skin-options small{font-size:8px;letter-spacing:0;margin-top:3px;white-space:nowrap;color:#a19985}.home-panel .skin-options i{display:none}.home-panel .skin-sample{flex-shrink:0;width:25px;height:25px;font-size:17px}.home-panel .skin-sample.playful{width:28px;height:28px}
.home-panel .terrain-picker{margin:0 0 15px}.home-panel .terrain-picker>div{gap:6px;margin-top:7px}.home-panel .terrain-picker button{font-family:inherit;font-size:10px;padding:7px 11px;border-radius:8px;background:#f9f5ec;border-color:#e4dccd}.home-panel .terrain-picker button.active{background:#eaf0df;border-color:#bfcaac;color:#75855c}
.home-panel .settings{margin-bottom:15px}.home-panel .segmented{margin:8px 0 10px;background:#eae6db;border:1px solid #e0d9ca;border-radius:10px;padding:3px}.home-panel .segmented button{font-family:inherit;border-radius:7px;padding:9px 0;font-size:11px;color:#98917f}.home-panel .segmented button.active{background:linear-gradient(#fffdf6,#f6f0e5);box-shadow:0 2px 4px #8f7c5b14;color:#68715f;font-weight:600}.home-panel .level-row{margin:0}.home-panel select{font-family:inherit;font-size:10px;color:#888674}.home-panel select:disabled{opacity:.5}
.home-panel .primary,body[data-skin="playful"] .home-panel .primary{border-radius:12px;background:linear-gradient(140deg,#c88d76,#b77761);box-shadow:inset 0 1px 1px #e7b29b,0 4px 0 #a76a54,0 8px 13px #ab7a5b1f;font-size:13px;font-family:inherit;font-weight:600;letter-spacing:1px;padding:15px 18px;color:#fffaf1;transition:filter .2s,transform .2s}.home-panel .primary:hover,body[data-skin="playful"] .home-panel .primary:hover{background:linear-gradient(140deg,#cc947f,#bd7e67);filter:brightness(1.02);transform:translateY(-1px)}.home-panel .primary span{font-size:16px;font-weight:400}.home-panel .continue-game{font-size:10px;font-family:inherit;border:0;border-radius:9px;padding:12px 0 3px;text-align:center;letter-spacing:.6px;color:#939981;background:none}.home-panel .continue-game span{float:none;margin-left:8px}.home-panel .home-footnote{font-size:9px;line-height:1.6;margin:15px 0 0;letter-spacing:.4px;color:#aaa18c}
.home-footer{border-color:#e8e1d3;font-size:9px;letter-spacing:.8px;padding:17px 0;margin:0 48px;max-width:none;color:#b0a692}
@media(min-width:761px) and (max-height:840px){.home-header{height:76px}.home-panel h1{font-size:37px;line-height:1.35;margin:12px 0 10px}.home-panel .intro{margin-bottom:18px;font-size:11px}.home-setup{padding:17px 20px 13px}.setup-heading{margin-bottom:13px}.home-panel .skin-settings,body[data-skin="playful"] .home-panel .skin-settings,.home-panel .terrain-picker,.home-panel .settings{margin-bottom:11px}main.home-page{min-height:calc(100dvh - 130px);padding-top:4px;padding-bottom:17px}.home-preview .game{width:min(100%,calc((100dvh - 160px)*.8125))}.brand-logo{width:48px;height:48px}}
@media(min-width:761px) and (max-width:1080px){main.home-page{grid-template-columns:minmax(0,1fr) 354px;gap:45px;padding-left:36px;padding-right:36px}.home-panel h1{font-size:38px}.home-setup{padding-left:18px;padding-right:18px}}
@media(max-width:760px){.home-header{height:76px;padding:0 22px}.brand-logo{width:44px;height:44px;border-radius:12px}.brand-name{font-size:20px}.brand small{font-size:8px;margin-top:5px}.header-right{gap:10px}main.home-page{display:flex;flex-direction:column;min-height:0;gap:0;padding:9px 22px 28px;margin:0 auto;max-width:500px}.home-preview{width:100%;padding:0 30px 0}.home-preview .game{width:100%;max-width:270px}.home-preview .board-wrap{transform:rotate(-3deg)}.home-preview .preview-caption{font-size:8px;margin-top:16px;letter-spacing:1.2px}.home-panel{margin-top:24px}.home-kicker{font-size:10px;letter-spacing:.5px;justify-content:center}.home-panel h1{font-size:32px;text-align:center;line-height:1.4;margin:10px 0}.home-panel h1 br{display:none}.home-panel h1 em{display:block}.home-panel .intro{font-size:11px;text-align:center;line-height:1.9;letter-spacing:.2px;margin-bottom:20px}.home-panel .intro br{display:block}.home-setup{padding:20px;border-radius:20px}.home-footer{margin:0 22px;padding:17px 0;font-size:8px}.home-footer>span:nth-child(2){display:none}}
@media(prefers-reduced-motion:reduce){.home-panel button{transition:none!important}.home-panel .primary:hover{transform:none!important}}
