:root{--paper:#f6f5f0;--ink:#29362e;--green:#354f41;--line:#e2e3da;color-scheme:light;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft Yahei",sans-serif;color:var(--ink);background:var(--paper)}*{box-sizing:border-box}body{margin:0}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer;color:inherit}button:disabled{cursor:not-allowed;opacity:.35}button:focus-visible,a:focus-visible,svg:focus-visible{outline:3px solid #829573;outline-offset:5px}button{touch-action:manipulation}svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}button{transition:background .16s,color .16s,transform .16s,box-shadow .16s}button:not(:disabled):active{transform:translateY(1px)}[hidden]{display:none!important}.site-shell{max-width:1240px;margin:0 auto;padding:0 48px}.header{height:108px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.brand{display:flex;align-items:center;gap:15px;text-decoration:none;color:var(--ink);font:600 29px "Noto Serif SC",serif;letter-spacing:3px}.brand-mark{width:47px;height:43px;position:relative}.brand-mark i{position:absolute;width:31px;height:31px;border-radius:50%;background:#2c4035;left:0;top:0}.brand-mark i+i{background:var(--paper);border:1.6px solid #2c4035;left:16px;top:12px}.header-nav{display:flex;align-items:center;gap:36px}.local-badge{font-size:12px;color:#81897b;display:flex;align-items:center;gap:8px}.local-badge>span,.live-label>span{height:5px;width:5px;background:#81916e;border-radius:50%;display:inline-block}.text-button{display:inline-flex;align-items:center;gap:7px;background:none;border:0;padding:8px 0;font-size:12px;color:#646e5d}.text-button:hover{color:#1d3c2b}.text-button svg{width:17px;height:17px}.game-layout{display:grid;grid-template-columns:minmax(0,1fr) 310px;gap:38px;align-items:start}.board-section{min-width:0}.board-toolbar{display:flex;align-items:center;justify-content:space-between;padding:0 2px 13px;height:40px;font-size:12px}.board-toolbar>div{display:flex;gap:12px;align-items:center}.board-status{font-size:10px;color:#74806a;border-left:1px solid #d2d8c9;padding-left:12px}.compact{padding:3px 0;color:#8b907e;font-size:10px}.compact[aria-pressed="true"]{color:#1a402c}.compact svg{height:14px;width:14px}.board-frame{background:#dcb982;border:1px solid #c5a16e;border-radius:5px;padding:8px;box-shadow:0 3px 0 #c5a574,0 9px 22px #493c2310,inset 0 0 0 3px #e5c794;overflow:hidden;position:relative;aspect-ratio:1;isolation:isolate}.board-frame:before{content:"";position:absolute;inset:0;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 300 300' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.018 .32' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' opacity='.20' filter='url(%23n)'/%3E%3C/svg%3E");opacity:.22;pointer-events:none;mix-blend-mode:multiply;z-index:-1}#board{height:100%;width:100%;display:block;stroke:none;cursor:crosshair;user-select:none;touch-action:manipulation}#board .stone{filter:url(#stoneShadow)}#board .dead-stone{opacity:.35}#board .cross{stroke:#9a4d3a;stroke-width:3;stroke-linecap:round}#board .board-label{font-family:Arial,sans-serif;fill:#876b43;font-size:12px;font-weight:500}#board .hover-stone{pointer-events:none}.side-panel{padding-top:40px;display:flex;flex-direction:column;gap:22px}.play-panel{background:#fffefa;border:1px solid #e0e2d7;border-radius:8px;padding:22px}.panel-heading{display:flex;justify-content:space-between;align-items:center;gap:6px}.live-label{font-size:9px;color:#949b8a;display:flex;gap:5px;align-items:center;white-space:nowrap}.live-label>span{width:4px;height:4px}.play-panel h2{font-family:"Noto Serif SC",serif;font-size:23px;font-weight:500;letter-spacing:1px;margin:10px 0 23px;display:flex;justify-content:space-between;align-items:center}.play-panel h2>span{font-size:9px;color:#87a077}.players{display:flex;flex-direction:column;gap:10px;margin-bottom:20px}.player-card{display:flex;align-items:center;gap:12px;padding:14px 12px;border-radius:5px;background:#f6f6f1;border:1px solid transparent}.player-card.active{background:#edf1e6;border-color:#b9c7a7}.player-stone{border-radius:50%;height:33px;width:33px;flex-shrink:0}.player-stone.black{background:radial-gradient(circle at 35% 25%,#565752,#1c201d 70%);box-shadow:0 2px 3px #0002,inset 0 -.8px 1px #000}.player-stone.white{background:radial-gradient(circle at 35% 25%,#fff,#f6f6ef 65%,#e3e3d9);box-shadow:0 2px 3px #0002,inset 0 0 1px #a0a59b}.player-info{display:flex;flex-direction:column;gap:5px}.player-info strong{font-size:12px;font-weight:600}.player-info>span{font-size:9px;color:#929985}.capture-count{margin-left:auto;text-align:center;display:flex;flex-direction:column;gap:2px;min-width:20px}.active .capture-count{margin-left:0}.capture-count strong{font:19px Georgia,serif}.capture-count span{font-size:8px;color:#9a9e90}.button{min-height:43px;border-radius:5px;padding:10px 12px;display:flex;justify-content:center;gap:8px;align-items:center;font-size:12px;font-weight:500;letter-spacing:.3px;border:1px solid transparent}.button svg{width:17px;height:17px}.primary{background:var(--green);color:#fffef6;width:100%}.primary:hover{background:#253d2f}.primary>span{font:8px Arial,sans-serif;letter-spacing:1px;opacity:.6;margin-left:auto}.primary:has(>span){justify-content:flex-start;padding:10px 15px}.secondary{background:transparent;border-color:#dce1d4;color:#727e68}.secondary:hover{background:#eef1e7}.action-row{display:flex;gap:9px;margin-top:9px}.action-row>button{flex:1;font-size:11px;white-space:nowrap;gap:6px;padding:10px 8px}.control-note{font-size:9px;line-height:1.6;color:#9a9e91;margin:14px 0 0;text-align:center}.setup-panel,.move-panel{padding:0 3px}.section-title{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}.section-title h3{font-size:11px;font-weight:500;margin:0}.section-title>span{font-size:9px;color:#9ca18f}.size-picker{display:flex;gap:8px}.size-picker button{width:33.333%;border:1px solid #dde1d4;background:transparent;border-radius:5px;padding:12px 4px 10px;display:flex;flex-direction:column;gap:6px;align-items:center}.size-picker strong{font:17px Georgia,serif}.size-picker strong span{font-size:12px}.size-picker small{font-size:9px;color:#a1a68f}.size-picker button.selected{border-color:#6d8061;background:#edf0e6;color:#415436}.size-picker button.selected small{color:#8d9a7f}.size-picker button:hover{background:#ebeee3}.new-game{color:#8a937e;width:100%;margin-top:7px;background:transparent;font-size:10px}.new-game:hover{background:#edf0e6}.move-panel{border-top:1px solid var(--line);padding-top:20px;margin-top:-3px}.move-list{display:flex;gap:6px;flex-wrap:wrap}.move-chip{background:#eeefe8;color:#7c856f;font-size:9px;border-radius:4px;min-width:44px;display:flex;gap:5px;padding:8px 6px;align-items:center}.move-chip i{border-radius:50%;width:8px;height:8px;background:#343c32;display:block}.move-chip i.white{background:#fffef9;border:1px solid #c8cdbf}.empty-history{font-size:10px;color:#a4aa96;margin:3px 0 8px}.toast{position:fixed;left:50%;bottom:30px;transform:translateX(-50%);background:#2e4537;color:#fffef9;padding:14px 22px;box-shadow:0 6px 24px #12221922;border-radius:7px;z-index:10;font-size:12px;max-width:calc(100% - 32px);width:max-content;line-height:1.5;pointer-events:none}.dialog{border:1px solid #dfe3d5;border-radius:10px;background:#fbfbf5;color:var(--ink);padding:34px;max-width:440px;width:calc(100% - 32px);box-shadow:0 22px 90px #1b281633}.dialog::backdrop{background:#28352970;backdrop-filter:blur(4px)}.dialog form{margin:0}.dialog-close{position:absolute;right:16px;top:13px;background:none;border:0;font-size:25px;font-weight:300;color:#7c8770;padding:4px 7px}.dialog h2{font-family:"Noto Serif SC",serif;font-size:23px;font-weight:500;margin:14px 0}.dialog p{font-size:12px;color:#859076;line-height:1.9}.dialog-actions{display:flex;gap:10px;margin-top:24px}.dialog-actions button{flex:1}.rules-dialog{max-width:570px;max-height:85dvh}.rule-list{margin:24px 0}.rule-list>div{display:flex;gap:16px;margin-bottom:20px}.rule-list>div>span{font:13px Georgia,serif;color:#a7b299;padding-top:2px}.rule-list section h3{font-size:13px;font-weight:500;margin:0 0 6px}.rule-list section p{font-size:11px;margin:0 0 7px;line-height:1.85}.full-width{width:100%;margin-top:9px}.scoring-instruction{background:#f0f2e9;padding:13px;border-radius:5px;margin:8px 0 16px}.scoring-instruction strong{font-size:12px;font-weight:500}.scoring-instruction p{font-size:10px;color:#818c73;line-height:1.8;margin:6px 0 0}.score-preview{margin:15px 0}.score-row{display:flex;justify-content:space-between;align-items:center;font-size:11px;margin:12px 0}.score-row strong{font:20px Georgia,serif}.score-row small{display:block;font-size:9px;color:#929b83;margin-top:4px}.neutral-note{font-size:9px;color:#9aa28e;text-align:center;border-top:1px solid var(--line);padding-top:10px}.result-box{text-align:center;background:#edf2e5;padding:22px 12px;border-radius:6px;margin-bottom:17px}.result-box .winner{font:500 24px "Noto Serif SC",serif;margin:0 0 7px}.result-box .margin{font-size:11px;color:#70815f}.result-box .score-row{text-align:left}.result-box .result-eyebrow{font-size:9px;color:#91a17c;letter-spacing:2px;margin-bottom:12px}
@media(min-width:1450px){.site-shell{max-width:1320px;padding:0 55px}.game-layout{grid-template-columns:minmax(0,1fr) 330px;gap:48px}.play-panel{padding:26px}.header{height:116px}.side-panel{gap:26px}}
@media(max-width:1000px){.site-shell{padding:0 28px}.game-layout{grid-template-columns:minmax(0,1fr) 280px;gap:26px}.play-panel{padding:18px}.side-panel{gap:20px}.player-card{gap:9px;padding:13px 10px}.header-nav{gap:20px}.live-label{font-size:8px}}
@media(max-width:760px){.site-shell{max-width:600px;padding:0 20px}.header{height:84px}.brand{font-size:24px;gap:11px}.brand-mark{transform:scale(.85);transform-origin:left center;width:39px}.local-badge{display:none}.header-nav{gap:0}.text-button{font-size:11px}.game-layout{display:flex;flex-direction:column;gap:26px}.board-section{width:100%}.board-toolbar{font-size:11px;padding-bottom:10px;height:31px}.board-status{font-size:9px}.board-frame{padding:4px;border-radius:4px}.side-panel{width:100%;padding-top:0;gap:24px}.play-panel{padding:20px}.play-panel h2{font-size:21px;margin:9px 0 18px}.live-label{font-size:9px}.players{flex-direction:row;gap:10px;margin-bottom:17px}.player-card{width:50%;padding:12px 10px;gap:8px}.player-stone{height:28px;width:28px}.player-info strong{font-size:11px}.player-info>span{font-size:8px}.active .capture-count{margin-left:auto}.capture-count strong{font-size:17px}.capture-count span{font-size:8px}.button{min-height:45px;font-size:12px}.action-row>button{font-size:12px}.control-note{font-size:10px;margin-top:12px}.size-picker button{padding:14px 8px 12px}.size-picker strong{font-size:19px}.size-picker small{font-size:10px}.section-title h3{font-size:12px}.section-title>span{font-size:10px}.new-game{font-size:11px;margin-top:9px}.move-panel{padding-top:20px;margin-top:-6px}.move-chip{font-size:10px;padding:9px;min-width:50px}.scoring-instruction p{font-size:11px}.score-preview{display:flex;gap:20px;flex-wrap:wrap}.score-preview>.score-row{flex:1}.score-preview>.neutral-note{width:100%;margin:0}.dialog{padding:28px 24px}.rules-dialog{padding:30px 24px}.rule-list>div{gap:12px}.rule-list section p{font-size:12px}.toast{bottom:20px}.result-box .score-preview{display:block}.result-box .score-row{padding:0 12px}}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}
/* Compact mobile game table: real reflow and board sizing, never overflow clipping. */
.mobile-only{display:none}.rule-pagination{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:18px}.rule-pagination .button{min-width:95px}.rule-pagination span{font:11px Arial,sans-serif;color:#8c977e}.rule-list>div[hidden]{display:none}.settings-note{font-size:10px!important;color:#9aa48b!important;text-align:center;margin:12px 0!important}.settings-dialog .move-panel{margin-top:12px}.settings-dialog .setup-panel{margin-top:20px}.settings-dialog .new-game{width:100%}.rules-dialog .rule-list{min-height:170px}.rules-dialog .rule-list>div{margin-bottom:0}
@media(max-width:760px),(max-width:1000px) and (max-height:500px){
  html,body{height:100%;min-height:0;margin:0}.site-shell{height:var(--app-height,100dvh);max-width:none;width:100%;padding:var(--safe-top,env(safe-area-inset-top,0px)) max(12px,var(--safe-right,env(safe-area-inset-right,0px))) var(--safe-bottom,env(safe-area-inset-bottom,0px)) max(12px,var(--safe-left,env(safe-area-inset-left,0px)));display:flex;flex-direction:column;min-height:0}.header{flex:0 0 43px;height:43px;min-height:43px;gap:12px}.brand{font-size:21px;gap:8px;letter-spacing:2px}.brand-mark{width:31px;height:30px;transform:scale(.65);transform-origin:left top}.header-nav{gap:18px}.header-nav .text-button{min-height:38px;font-size:12px;padding:0 2px}.mobile-only{display:inline-flex}.local-badge{display:none}main{flex:1;min-height:0;display:flex;padding:6px 0}.game-layout{flex:1;min-height:0;display:flex;flex-direction:column;gap:7px}.board-section{flex:1;min-width:0;min-height:0;width:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:0}.board-toolbar{height:26px;min-height:26px;flex:0 0 26px;padding:0 2px 4px;width:100%;font-size:11px}.board-toolbar .compact{font-size:10px;min-height:25px}.board-frame{flex:none;width:var(--fit-board, min(100vw - 24px, 48dvh));height:var(--fit-board, min(100vw - 24px,48dvh));padding:4px;aspect-ratio:1;margin:0 auto;box-shadow:0 2px 0 #c5a574,0 5px 12px #493c2310,inset 0 0 0 2px #e5c794}#boardHint{font-size:9px}.side-panel{flex:none;width:100%;padding:0;gap:0;min-height:0}.play-panel{border-radius:6px;padding:9px 10px;background:#fffefa;display:grid;grid-template-columns:1fr 1fr;column-gap:8px;row-gap:7px;align-items:center}.panel-heading{display:none}.play-panel h2{margin:0;font-size:15px;letter-spacing:.5px;white-space:nowrap;grid-column:1}.play-panel h2>span{display:none}.players{flex-direction:row;justify-content:flex-end;gap:5px;margin:0;grid-column:2}.player-card{padding:3px 6px;width:auto;gap:5px;border-radius:4px}.player-stone{width:14px;height:14px}.player-info{display:none}.capture-count{flex-direction:row;align-items:center;gap:2px;min-width:0;margin:0!important}.capture-count strong{font:13px Georgia,serif}.capture-count span{font-size:8px}.button{min-height:39px;height:39px;padding:7px 8px;font-size:11px;letter-spacing:0;gap:4px}.button svg{width:14px;height:14px}.play-panel #playControls{grid-column:1 / -1;display:grid;grid-template-columns:1fr 2.15fr;gap:6px}.primary:has(>span){justify-content:center;padding:7px 8px}.primary>span{display:none}.action-row{margin:0;gap:6px}.action-row>button{font-size:11px;padding:7px 5px}.control-note{grid-column:1 / -1;margin:0;font-size:9px;line-height:14px}.play-panel #scoringControls,.play-panel #finishedControls{grid-column:1 / -1;display:grid;grid-template-columns:1fr 1fr 1fr;gap:6px}.scoring-instruction{grid-column:1 / -1;padding:0;background:none;border-radius:0;margin:0}.scoring-instruction strong{display:none}.scoring-instruction p{font-size:9px;line-height:14px;margin:0;color:#849074}.score-preview{grid-column:1 / -1;display:grid;grid-template-columns:1fr 1fr;gap:4px 16px;margin:0}.score-row{font-size:10px;margin:0;gap:5px}.score-row strong{font-size:20px}.score-row small{font-size:9px;margin-top:3px;white-space:nowrap}.neutral-note{grid-column:1 / -1;width:100%;font-size:9px;margin:0;padding-top:4px;line-height:13px}.play-panel .full-width,.play-panel .new-game{margin:0;width:100%;height:39px;min-height:39px}.play-panel .new-game{border:1px solid #dce1d4;color:#727e68;font-size:11px}.result-box{grid-column:1 / -1;text-align:left;margin:0;padding:8px 10px;border-radius:4px;display:grid;grid-template-columns:1fr 1fr;gap:3px 10px;align-items:center}.result-box .result-eyebrow{display:none}.result-box .winner{font-size:17px;margin:0}.result-box .margin{font-size:10px;margin:0;text-align:right}.result-box .score-preview{grid-column:1 / -1;display:grid;grid-template-columns:1fr 1fr;gap:4px 12px;margin-top:4px}.result-box .score-row{padding:0}.result-box .score-row strong{font-size:17px}.play-panel #reviewButton{grid-column:1 / 3}.play-panel #finishedResumeButton{grid-column:3}.toast{bottom:calc(var(--safe-bottom,env(safe-area-inset-bottom,0px)) + 8px);font-size:10px;padding:8px 12px;max-width:calc(100% - 24px);box-shadow:0 3px 12px #12221922}.dialog{max-height:calc(var(--app-height,100dvh) - var(--safe-top,env(safe-area-inset-top,0px)) - var(--safe-bottom,env(safe-area-inset-bottom,0px)) - 24px);max-width:480px;width:calc(100% - 28px);padding:22px;margin:auto;border-radius:8px}.dialog h2{font-size:20px;margin:10px 0 14px}.dialog-close{right:9px;top:6px;font-size:23px}.dialog p{font-size:11px;line-height:1.75}.dialog-actions{margin-top:18px}.dialog-actions .button,.dialog>.button{height:40px;min-height:40px}.rules-dialog .rule-list{min-height:0;margin:20px 0 14px}.rule-list>div{gap:12px}.rule-list section h3{font-size:13px;line-height:1.6}.rule-list section p{font-size:12px;line-height:1.8;margin:6px 0 0}.rule-pagination{margin-top:16px}.rule-pagination .button{min-width:85px}.rules-dialog .full-width,.settings-dialog .full-width{margin-top:9px}.settings-dialog .setup-panel{margin-top:18px;padding:0}.settings-dialog .section-title{margin-bottom:9px}.settings-dialog .section-title h3{font-size:11px}.settings-dialog .size-picker button{padding:10px 6px;gap:4px}.settings-dialog .size-picker strong{font-size:19px}.settings-dialog .size-picker small{font-size:9px}.settings-dialog .new-game{margin-top:8px;height:37px;min-height:37px;font-size:11px}.settings-dialog .move-panel{padding:13px 0 0;margin-top:4px}.settings-dialog .move-chip{font-size:9px;padding:7px 6px;min-width:40px}.settings-dialog .empty-history{font-size:10px;margin:0}.settings-dialog .settings-note{line-height:1.5;margin:10px 0!important}
}
@media(max-width:1000px) and (max-height:500px) and (min-aspect-ratio: 6/5){
  .site-shell{padding-left:max(10px,var(--safe-left,env(safe-area-inset-left,0px)));padding-right:max(10px,var(--safe-right,env(safe-area-inset-right,0px)))}.header{flex-basis:35px;height:35px;min-height:35px}.header-nav .text-button{min-height:32px}.brand{font-size:19px}.brand-mark{height:27px;transform:scale(.58)}main{padding:4px 0}.game-layout{flex-direction:row;gap:12px}.board-section{flex:1}.side-panel{width:clamp(250px,42%,330px);align-self:center}.board-toolbar{height:23px;flex-basis:23px;min-height:23px}.play-panel{padding:9px;row-gap:7px}.play-panel h2{font-size:15px}.dialog{padding:15px 22px;max-width:560px;max-height:calc(var(--app-height,100dvh) - 16px)}.dialog h2{font-size:18px;margin:3px 0 10px}.dialog p{font-size:11px;line-height:1.6}.dialog-actions{margin-top:12px}.rules-dialog .rule-list{margin:12px 0}.rule-list section p{font-size:11px;line-height:1.65}.rule-pagination{margin-top:12px}.rules-dialog .full-width{margin-top:7px}.dialog .button{height:35px;min-height:35px}.settings-dialog .setup-panel{margin-top:10px}.settings-dialog .size-picker button{padding:7px;gap:3px}.settings-dialog .size-picker strong{font-size:17px}.settings-dialog .new-game{margin-top:4px;height:32px;min-height:32px}.settings-dialog .move-panel{padding-top:7px;margin-top:2px}.settings-dialog .section-title{margin-bottom:6px}.settings-dialog .move-chip{padding:5px 6px}.settings-dialog .settings-note{margin:6px 0!important;font-size:9px!important}.settings-dialog .full-width{margin-top:5px}
}
@media(max-width:380px) and (max-height:600px){
  .header{height:38px;min-height:38px;flex-basis:38px}.site-shell{padding-left:10px;padding-right:10px}.header-nav{gap:14px}.game-layout{gap:5px}main{padding:4px 0}.play-panel{padding:7px 8px;row-gap:5px}.play-panel h2{font-size:14px}.button,.play-panel .full-width,.play-panel .new-game{height:35px;min-height:35px}.board-toolbar{height:23px;min-height:23px;flex-basis:23px}.scoring-instruction p{font-size:9px;line-height:13px}.dialog{padding:20px}.rule-list section p{font-size:11px;line-height:1.7}.rules-dialog .rule-list{margin:14px 0}.settings-dialog .setup-panel{margin-top:12px}
}
@media(max-width:380px) and (max-height:600px){.header-nav .text-button{min-height:36px}}
@media(max-width:760px),(max-width:1000px) and (max-height:500px){.game-layout{align-items:stretch}}
@media(max-width:760px),(max-width:1000px) and (max-height:500px){
 .dialog{position:fixed;inset:var(--safe-top,env(safe-area-inset-top,0px)) var(--safe-right,env(safe-area-inset-right,0px)) var(--safe-bottom,env(safe-area-inset-bottom,0px)) var(--safe-left,env(safe-area-inset-left,0px));width:calc(100% - var(--safe-left,env(safe-area-inset-left,0px)) - var(--safe-right,env(safe-area-inset-right,0px)) - 28px)}
}
@media(max-width:1000px) and (max-height:500px) and (min-aspect-ratio:6/5){
 .dialog{max-height:calc(var(--app-height,100dvh) - var(--safe-top,env(safe-area-inset-top,0px)) - var(--safe-bottom,env(safe-area-inset-bottom,0px)) - 16px);padding-top:10px;padding-bottom:10px}.dialog h2{margin-bottom:7px}.settings-dialog .new-game{height:30px;min-height:30px}
}
@media(max-width:1000px) and (max-height:500px) and (min-aspect-ratio:6/5){.settings-dialog{padding-top:8px;padding-bottom:8px}}
/* Explicit in-page modal layer: consistent across iOS embedded browsers. */
.modal-backdrop{position:fixed;inset:0;z-index:20;background:#28352970;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}
.dialog{position:fixed;inset:0;z-index:21;margin:auto;height:max-content;max-height:calc(100dvh - 24px);display:block}
.dialog[hidden],.modal-backdrop[hidden]{display:none!important}
.site-shell[inert]{pointer-events:none}
@media(max-width:760px),(max-width:1000px) and (max-height:500px){
 .dialog{inset:var(--safe-top,env(safe-area-inset-top,0px)) var(--safe-right,env(safe-area-inset-right,0px)) var(--safe-bottom,env(safe-area-inset-bottom,0px)) var(--safe-left,env(safe-area-inset-left,0px));max-height:calc(var(--app-height,100dvh) - var(--safe-top,env(safe-area-inset-top,0px)) - var(--safe-bottom,env(safe-area-inset-bottom,0px)) - 24px)}
}
@media(max-width:1000px) and (max-height:500px) and (min-aspect-ratio:6/5){.dialog{max-height:calc(var(--app-height,100dvh) - var(--safe-top,env(safe-area-inset-top,0px)) - var(--safe-bottom,env(safe-area-inset-bottom,0px)) - 16px)}}

#inviteField{display:block;width:100%;padding:8px;margin:4px 0}#proposal{margin:8px 0;padding:8px;background:#edf1e6;border-radius:5px}#proposal p{font-size:12px;margin:0}a.text-button{text-decoration:none}
@media(max-width:760px),(max-width:1000px) and (max-height:500px){
  #proposal{grid-column:1/-1}
  .header-nav{gap:clamp(6px,2vw,14px)}
}

.control-note:empty{display:none}
.rules-dialog .rule-list{min-height:0}
#turnEyebrow{font-size:12px}
@media(min-width:761px) and (min-height:501px), (min-width:1001px){
  .site-shell{max-width:1060px;padding:0 22px}
  .header{height:60px}
  .brand{font-size:24px;gap:6px}
  .brand-mark{transform:scale(.72);transform-origin:left center;width:35px}
  .header-nav{gap:18px}
  .game-layout{padding:12px 0;grid-template-columns:minmax(0,1fr) 280px;gap:20px}
  .board-toolbar{height:30px;padding-bottom:6px}
  .board-section{width:min(100%,max(420px,calc(100dvh - 118px)));justify-self:end}
  .side-panel{padding-top:30px;gap:12px}
  .play-panel{padding:14px}
  .play-panel h2{margin:6px 0 12px;font-size:21px}
  .players{gap:6px;margin-bottom:12px}
  .player-card{padding:8px}
  .player-card .capture-count{margin-left:auto}
  .setup-panel,.move-panel{padding-top:12px}
  .section-title{margin-bottom:8px}
}
@media(max-width:760px) and (orientation:portrait){
  .board-section{max-height:calc(100vw + 4px);justify-content:flex-start}
}

/* Shared chess-room colors, including the self-contained offline table. */
:root {
  --paper: #f2f4f6;
  --ink: #202d48;
  --green: #293f65;
  --muted: #56677c;
  --line: #ced6df;
  --soft: #e6edf4;
  --accent: #576f91;
}
.brand,.play-panel h2,.dialog h2 { font-family: "Songti SC", "STSong", "Noto Serif CJK SC", serif }
.brand-mark i { background: var(--blue, #293f65) }
.brand-mark i+i { background: #fcfdff; border-color: #293f65 }
.play-panel,.dialog { background: #fcfdff; border-color: var(--line); border-radius: 9px }
.play-panel { border-top: 4px solid var(--green) }
.player-card.active,.size-picker .selected,#proposal { background: #e5ecf4; border-color: #92a5bb }
.button.primary { background: var(--green); color: white }
.button.secondary,.size-picker button { border-color: var(--line) }
.text-button,.board-status,.local-badge,.live-label,.compact,.control-note,.empty-history { color: #52647b }
.local-badge>span,.live-label>span { background: #597391 }
.board-frame { box-shadow: 0 4px 0 #b79364, 0 10px 22px #25334a1a }
button:focus-visible,a:focus-visible,svg:focus-visible { outline-color: #af702e }
@media(prefers-reduced-motion: reduce) { *,*::before,*::after { transition: none !important; animation: none !important } }

.play-panel h2 .turn-stone { display: inline-block; width: .56em; height: .56em; margin-left: .4em; vertical-align: middle; border-radius: 50%; background: #26303c; border: 1px solid #253044 }
.play-panel h2 .light-stone { background: white; border-color: #8695a3 }