:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--ivory:#f2ece2;--muted:#a9b6c1;--gold:#dcb985;--border:#a3b9cc29;--navy:#101c29;--surface:#192938;--pion-human:radial-gradient(circle at 35% 25%, #6389ae, #163c62);--pion-opponent:radial-gradient(circle at 35% 25%, #fff2d5, #b5a185);--board-size:min(100%, 440px, max(252px, calc((100svh - 338px) * .849624)))}body[data-skin=silver]{--pion-human:radial-gradient(circle at 35% 25%, #eef3f7, #b9c9d4);--pion-opponent:radial-gradient(circle at 35% 25%, #526c85, #263c55)}body[data-skin=ochre]{--pion-human:radial-gradient(circle at 35% 25%, #bd7657, #873f26);--pion-opponent:radial-gradient(circle at 35% 25%, #fff0d5, #f0d4a5)}*{box-sizing:border-box}body{min-height:100svh;color:var(--ivory);background:radial-gradient(ellipse at 50% 35%, #203345, var(--navy) 75%);-webkit-tap-highlight-color:#dcb98525;margin:0;font:15px/1.5 -apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}button,input,select{font:inherit}button,summary,select{touch-action:manipulation}button{color:inherit;cursor:pointer;border:1px solid var(--border);background:var(--surface);border-radius:12px;min-height:44px;padding:8px 12px;transition:background-color .15s,border-color .15s}button:disabled{color:#8995a1;opacity:.5;cursor:not-allowed}button:focus-visible,summary:focus-visible,select:focus-visible,input:focus-visible,a:focus-visible{outline-offset:3px;outline:2px solid #81e0d5}@media (hover:hover){button:not(:disabled):hover,summary:hover{background-color:#2c4052;border-color:#dcb98570}}button:not(:disabled):active{background-color:#344a5d}[hidden]{display:none!important}.sr-only,.skip-link:not(:focus){clip-path:inset(50%);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.skip-link:focus{z-index:20;background:var(--surface);color:var(--ivory);padding:12px;position:fixed;top:8px;left:8px}.app-header{max-width:760px;min-height:60px;padding:max(6px, env(safe-area-inset-top)) max(16px, env(safe-area-inset-right)) 6px max(16px, env(safe-area-inset-left));justify-content:space-between;align-items:center;gap:12px;margin:auto;display:flex}.brand{letter-spacing:4px;white-space:nowrap;margin:0;font:27px/1 Georgia,serif}.brand span{letter-spacing:3px;color:var(--gold);padding-top:5px;font:8px/1.1 -apple-system,BlinkMacSystemFont,sans-serif;display:block}.header-actions{gap:4px;display:flex}.quiet{background:0 0;border-color:#0000;align-items:center;gap:8px;font-size:13px;display:flex}.quiet>span:first-child[aria-hidden]{color:var(--gold);font-size:18px}main{width:min(100%,480px);margin:auto;padding:6px 16px 0}.arena{width:100%;min-width:0}.mode-bar{border:1px solid var(--border);background:#0c172380;border-radius:14px;gap:4px;margin-bottom:8px;padding:3px;display:flex}.mode-bar button{min-width:0;min-height:40px;color:var(--muted);background:0 0;border-color:#0000;border-radius:10px;flex:1;padding:6px 10px;font-size:14px}.mode-bar button.active{color:var(--ivory);background:#2b3d4e;border-color:#c4a77c55}.game-guidance{margin-bottom:4px}.phase-guide summary{cursor:pointer;border-radius:8px;align-items:center;gap:8px;min-height:36px;padding:4px 2px;font-size:13px;list-style:none;display:flex}.phase-guide summary::-webkit-details-marker{display:none}#phase-number{color:var(--gold);white-space:nowrap;font-size:11px}#phase-title{font-weight:500}.disclosure-icon{color:var(--muted);margin-left:auto;font-size:18px}.phase-guide[open] .disclosure-icon{transform:rotate(180deg)}.phase-guide p{color:var(--muted);background:#192d3d;border-radius:10px;margin:2px 0 8px;padding:10px 12px;font-size:14px;line-height:1.6}.turn{align-items:center;gap:8px;min-height:28px;display:flex}.turn strong{font-size:15px;font-weight:600}#turn-dot{background:#81d4bc;border-radius:50%;flex:0 0 6px;width:6px;height:6px}#turn-dot.thinking{animation:1.2s ease-in-out infinite pulse}.player-row{align-items:center;gap:8px;min-height:34px;padding:4px 2px;display:flex}.avatar{border-radius:50%;flex:0 0 17px;width:17px;height:17px;box-shadow:inset 0 1px 2px #ffffff40,0 2px 5px #0005}.ai-avatar{background:var(--pion-opponent)}.human-avatar{background:var(--pion-human);border:1px solid #7994ae}.player-info{align-items:baseline;gap:7px;min-width:0;display:flex}.player-info strong{text-overflow:ellipsis;white-space:nowrap;font-size:13px;overflow:hidden}.player-info>span{color:var(--muted);white-space:nowrap;font-size:11px}.count{white-space:nowrap;align-items:baseline;gap:5px;margin-left:auto;display:flex}.count b{font-variant-numeric:tabular-nums;font-size:14px;font-weight:600}.count span{color:var(--muted);font-size:11px}.board-wrap{width:var(--board-size);aspect-ratio:5.65/6.65;filter:drop-shadow(0 10px 16px #0005);margin:0 auto;position:relative}#board{border-radius:12px;width:100%;height:100%;display:block}#grid{grid-template-rows:repeat(6,1fr);grid-template-columns:repeat(5,1fr);padding:5.7522%;display:grid;position:absolute;inset:0}#grid button{border:0;border-radius:50%;min-width:0;min-height:0;padding:0;position:relative;background:0 0!important}#grid button:focus-visible{outline-offset:-5px}#grid button[data-draggable=true]{cursor:grab;touch-action:pinch-zoom}#grid[data-dragging] button{cursor:grabbing}#grid button[data-drop-target]{outline-offset:-4px;outline:3px solid #42e4d3;box-shadow:inset 0 0 0 9px #42e4d344}.drag-pawn,.animated-pawn{background:var(--pion-human);pointer-events:none;border-radius:50%;box-shadow:inset 0 2px 4px #fff5,0 6px 10px #0008}.drag-pawn{z-index:30;position:fixed;transform:translate(-50%,-50%)scale(1.08)}.pawn-layer{pointer-events:none;position:absolute;inset:0}.animated-pawn{aspect-ratio:1;width:10.2%;position:absolute}.animated-pawn.p2{background:var(--pion-opponent)}.animated-pawn.captured{outline-offset:3px;outline:3px solid #ffaa74}.has-presentation #grid.fallback button.p1:after,.has-presentation #grid.fallback button.p2:after{display:none}#grid.fallback button.target:before{background:#38d9c966;outline:3px solid #38d9c9}#grid.fallback button.capture-target:before{background:#ffaa7433;outline-color:#ffaa74}.loading{background:var(--surface);border-radius:12px;place-items:center;display:grid;position:absolute;inset:0}.actions{gap:6px;margin-top:4px;display:flex}.actions button{flex:1;justify-content:center;align-items:center;gap:6px;min-width:0;padding:7px;font-size:13px;display:flex}.action-icon{color:var(--gold);font-size:20px}#hint-limit{color:var(--gold);font-variant-numeric:tabular-nums;font-size:11px}footer{color:#9daab7;padding:10px 12px max(8px, env(safe-area-inset-bottom));justify-content:center;gap:7px;font-size:10px;display:flex}#network-panel{border:1px solid var(--border);background:#1a2c3a;border-radius:10px;margin:0 0 8px;padding:8px 10px}#network-panel>strong{font-size:13px}#network-status{color:var(--muted);margin:0;font-size:12px;line-height:1.5}#claim{width:100%}.text-button{color:var(--gold);background:0 0;border-color:#0000}dialog{color:var(--ivory);overscroll-behavior:contain;background:#172838;border:1px solid #b49a7466;border-radius:20px;width:min(440px,100% - 24px);max-height:calc(100dvh - 24px);padding:28px 24px 24px;overflow-y:auto;box-shadow:0 24px 80px #0009}dialog::backdrop{-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);background:#08131dcc}dialog h2{text-wrap:balance;margin:10px 24px 20px 0;font:30px/1.15 Georgia,serif}dialog h2:focus{outline:none}dialog p,dialog li{color:#c8d0d5;font-size:15px;line-height:1.65}.eyebrow{color:var(--gold);letter-spacing:1.4px;padding-right:28px;font-size:11px;font-weight:600}.close{width:44px;height:44px;color:var(--muted);background:0 0;border:0;padding:0;font-size:28px;position:absolute;top:8px;right:8px}.primary{color:#122333;background:#dfc296;border-color:#0000;font-weight:600}#invite-form{gap:12px;display:grid}input,select{color:var(--ivory);background:#102130;border:1px solid #a3b9cc55;border-radius:10px;max-width:100%;min-height:44px;padding:10px 12px;font-size:16px}input{width:100%}#invite-error{color:#ffbda7;margin:0;font-size:14px}#result-new,#confirm-yes{width:100%}.setting-row{border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;gap:16px;padding:14px 0;display:flex}.setting-row label,.setting-row>span{font-size:14px}#level{max-width:160px}#sound{font-size:13px}#sound[aria-pressed=true]{color:var(--gold);border-color:var(--gold)}.theme-setting{border:0;margin:22px 0 0;padding:0}.theme-setting legend{margin-bottom:12px;font-size:14px}.skin-list{gap:8px;display:flex}.skin{flex-direction:column;flex:1;align-items:center;gap:8px;min-width:0;padding:12px 4px;font-size:13px;display:flex;position:relative}.skin.selected{border-color:var(--gold);background:#293c4a}.swatch{border:1px solid #fff3;border-radius:50%;width:28px;height:28px}.swatch.indigo{background:linear-gradient(135deg,#1b4b73 50%,#dbc49b 50%)}.swatch.silver{background:linear-gradient(135deg,#bbcbd6 50%,#314959 50%)}.swatch.ochre{background:linear-gradient(135deg,#a35737 50%,#dfb58f 50%)}.skin b{color:var(--gold);font-size:11px;position:absolute;top:2px;right:5px}.skin:not(.selected) b{visibility:hidden}.settings-rules{width:100%;margin-top:18px;font-size:13px}#toast{z-index:10;bottom:max(18px, env(safe-area-inset-bottom));color:#15283a;opacity:0;pointer-events:none;text-align:center;background:#e6d0ad;border-radius:12px;width:max-content;max-width:calc(100% - 32px);padding:12px 18px;font-size:14px;transition:opacity .15s,transform .15s;position:fixed;left:50%;transform:translate(-50%,8px);box-shadow:0 8px 32px #0005}#toast.show{opacity:1;transform:translate(-50%)}@keyframes pulse{50%{opacity:.4}}.rules-guide h2{margin:12px 0;font-size:clamp(27px,6vw,36px)}.rules-guide .welcome-note{color:var(--gold);margin:0 16px 24px 0;font-size:12px}.rule-examples{gap:14px;margin:20px 0;display:grid}.rule-examples figure{border:1px solid var(--border);background:#0c1c2a;border-radius:10px;margin:0;padding:14px}.rule-board{grid-template-columns:repeat(5,1fr);gap:8px;max-width:280px;margin:0 auto 12px;display:grid}.rule-cell{aspect-ratio:1;color:var(--gold);background:#142f42;border-radius:50%;place-items:center;font-size:25px;display:grid}.rule-cell.stone{color:#8bbbdc}.rule-cell.opponent-stone{color:#f0cf92}.rule-examples figcaption{color:#c8c4bb;font-size:12px;line-height:1.6}.rules-online{border-left:2px solid var(--gold);background:#0c1c2a;padding:14px}.rules-online p{font-size:12px}.rules-navigation{justify-content:space-between;align-items:center;gap:8px;margin-top:24px;display:flex}.rules-navigation button{border:1px solid var(--border);color:var(--ivory);background:0 0;border-radius:7px;padding:10px;font-size:12px}.rules-navigation .primary{color:#152638;background:#dec198;margin:0}.rules-navigation span{white-space:nowrap;color:var(--muted);font-size:12px}.board-fallback{background:#c1a379;border:12px solid #9a7d55;border-radius:12px}#grid.fallback button:before{content:"";background:#7e6548;border-radius:50%;position:absolute;inset:10%;box-shadow:inset 0 3px 8px #0008}#grid.fallback button.p1:after,#grid.fallback button.p2:after{content:"";background:var(--pion-human);border-radius:50%;position:absolute;inset:17%;box-shadow:2px 4px 5px #0008}#grid.fallback button.p2:after{background:var(--pion-opponent)}#grid.fallback button.selected{outline:3px solid #40e0d0}#grid.fallback button.target{outline:2px solid #e8b580}.rules-navigation button{min-height:44px}.rules-navigation{background:#172838;padding:14px 0 2px;position:sticky;bottom:-24px}.welcome-example{background:#102130;border-radius:12px;margin:14px 0;padding:12px}.welcome-example h3{margin:0 0 6px;font-size:15px}.welcome-example p{margin:4px 0 10px;font-size:14px}.welcome-example .rule-board{max-width:200px;margin-bottom:0}.welcome-actions{gap:10px;margin-top:18px;display:flex}.welcome-actions button{flex:1;font-size:14px}@media (width<=600px){.app-header{min-height:52px;padding-top:max(4px, env(safe-area-inset-top));padding-bottom:4px}.brand{font-size:24px}.brand span{font-size:7px}.quiet{padding:6px 8px}.rules-guide h2{font-size:28px}.player-info{gap:5px}}@media (width<=350px){main,.app-header{padding-inline:10px}.quiet{gap:5px}.player-info>span{display:none}.actions button{gap:4px}}@media (height<=620px) and (orientation:portrait){:root{--board-size:min(100%, max(252px, calc((100svh - 276px) * .849624)))}.game-guidance{margin-bottom:0}.phase-guide summary{min-height:28px}.mode-bar{margin-bottom:2px}main{padding-top:0}.player-row{min-height:28px;padding-block:2px}.actions{margin-top:0}footer{padding-block:6px}}@media (height<=520px) and (width>=600px){main{width:min(100%,800px);padding-top:4px}.app-header{min-height:48px;padding-block:2px}.arena{grid-template-columns:1fr 1fr;grid-template-areas:"board modes""board guidance""board opponent""board human""board actions";align-items:center;gap:2px 20px;display:grid}.arena:has(#network-panel:not([hidden])){grid-template-areas:"network network""board modes""board guidance""board opponent""board human""board actions"}.board-wrap{grid-area:board;width:min(100%,max(252px,84.9624svh - 74.7669px))}.mode-bar{grid-area:modes;margin:0}#network-panel{grid-area:network;margin:0}.game-guidance{grid-area:guidance}.opponent{grid-area:opponent}.human{grid-area:human}.actions{grid-area:actions}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}