:root{color-scheme:light;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;color:#182026;background:#eef3f0;--bg: #eef3f0;--panel: #fbfcf8;--panel-strong: #f4efe2;--ink: #182026;--muted: #66746f;--line: #d7ded5;--wood: #d8a85f;--wood-dark: #a76d34;--black: #162025;--white: #f7f3e9;--teal: #177e79;--coral: #cc5b45;--gold: #d7a936;--shadow: 0 12px 36px rgba(39, 52, 44, .1);--board-shadow: 0 28px 84px rgba(71, 46, 16, .24)}*{box-sizing:border-box}body{margin:0;min-width:320px;min-height:100vh;background:linear-gradient(135deg,rgba(23,126,121,.12),transparent 32%),linear-gradient(315deg,rgba(204,91,69,.12),transparent 28%),var(--bg)}button,select{font:inherit}button{cursor:pointer}button:disabled,select:disabled{cursor:not-allowed;opacity:.58}.app-shell{min-height:100vh;padding:28px}.game-layout{display:grid;grid-template-columns:minmax(210px,270px) minmax(560px,780px) minmax(210px,270px);gap:22px;align-items:start;max-width:1360px;margin:0 auto}.side-stack{display:grid;gap:16px}.panel{border:1px solid rgba(24,32,38,.09);border-radius:8px;background:#fbfcf8c7;box-shadow:var(--shadow);padding:18px}.control-panel{display:grid;gap:16px}.eyebrow,.label{display:block;color:var(--muted);font-size:.74rem;font-weight:800;text-transform:uppercase}.eyebrow{margin:0 0 6px;color:var(--teal)}h1,h2,p{margin-top:0}h1{margin-bottom:0;font-size:1.8rem;line-height:1.08}h2{margin-bottom:0;font-size:1rem}p{color:var(--muted);line-height:1.5}.status-strip,.board-meta,.panel-heading,.history-list li,.field-label,.button-row,.replay-progress{display:flex;align-items:center}.status-strip{gap:12px;padding:12px;border-radius:8px;background:var(--panel-strong)}.status-strip.result-banner{background:linear-gradient(135deg,#d7a93647,#fbfcf8f2);box-shadow:inset 0 0 0 1px #d7a93659}.thinking-indicator{display:inline-flex;gap:4px;margin-left:auto;padding:6px 7px;border-radius:999px;background:#177e791f}.thinking-indicator span{width:6px;height:6px;border-radius:999px;background:var(--teal);animation:thinking-dot .9s ease-in-out infinite}.thinking-indicator span:nth-child(2){animation-delay:.12s}.thinking-indicator span:nth-child(3){animation-delay:.24s}.turn-stone,.history-stone{flex:0 0 auto;border-radius:999px}.turn-stone{width:28px;height:28px;border:2px solid rgba(24,32,38,.16)}.turn-stone.black,.history-stone.black{background:var(--black)}.turn-stone.white,.history-stone.white{background:var(--white);border:1px solid #a7aaa2}.segmented{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;padding:5px;border-radius:8px;background:#e5ebe6}.segmented button,.primary-action,.secondary-action,.ghost-action,.icon-action{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:40px;border:0;border-radius:8px;color:var(--ink);font-weight:800}.segmented button{background:transparent}.segmented button.active{background:var(--panel);box-shadow:0 5px 18px #1820261a}.field-label{gap:8px;color:var(--muted);font-weight:800}select{width:100%;min-height:42px;border:1px solid var(--line);border-radius:8px;background:#fff;color:var(--ink);padding:0 12px}.button-row{gap:9px;flex-wrap:wrap}.primary-action{background:var(--teal);color:#fff;padding:0 15px}.secondary-action{background:#177e7921;color:var(--teal);padding:0 15px}.ghost-action,.icon-action{background:#e6ece8;padding:0 13px}.hint-readout{padding:11px 12px;border:1px dashed rgba(23,126,121,.36);border-radius:8px}.hint-readout em{display:block;margin-top:6px;color:var(--muted);font-size:.8rem;font-style:normal;font-weight:700}.ruleset-panel{display:grid;gap:7px;min-width:0;margin:0;padding:11px;border:1px solid rgba(24,32,38,.1);border-radius:8px;background:#ffffff6b}.ruleset-panel legend{display:inline-flex;align-items:center;gap:7px;padding:0 5px;color:var(--ink);font-weight:900}.ruleset-panel label{color:var(--muted);font-size:.78rem;font-weight:800}.ruleset-panel small{color:var(--muted);font-size:.74rem;font-weight:700}.threat-readout{display:grid;gap:6px;padding:11px 12px;border:1px solid rgba(204,91,69,.2);border-radius:8px;background:#fff8ee9e}.threat-list{display:grid;gap:4px}.threat-readout strong{color:var(--ink);font-size:.86rem}.action-message{margin:-4px 0 0;color:var(--muted);font-size:.88rem;font-weight:700}.result-actions{display:grid;gap:10px;padding:12px;border:1px solid rgba(215,169,54,.35);border-radius:8px;background:#fff8daad}.result-actions p{margin-bottom:0;color:var(--ink);font-weight:900}.play-section{display:grid;gap:14px}.board-meta{justify-content:space-between;gap:12px;padding:14px 16px;border-radius:8px;background:#fbfcf8db;box-shadow:var(--shadow)}.board-meta>div{min-width:0}.board-meta strong{display:block;font-size:1.1rem}.board-wrap{width:min(100%,760px);aspect-ratio:1 / 1;padding:clamp(8px,1.4vw,14px);border-radius:8px;background:linear-gradient(90deg,rgba(80,42,18,.08) 1px,transparent 1px),linear-gradient(rgba(80,42,18,.08) 1px,transparent 1px),linear-gradient(135deg,#e3ba74,var(--wood));background-size:calc(100%/max(1,var(--board-size, 11) - 1)) calc(100%/max(1,var(--board-size, 11) - 1)),calc(100%/max(1,var(--board-size, 11) - 1)) calc(100%/max(1,var(--board-size, 11) - 1)),auto;border:1px solid rgba(88,52,18,.28);box-shadow:var(--board-shadow)}.board-grid{display:grid;grid-template-columns:.52fr repeat(11,minmax(0,1fr));grid-template-rows:.52fr repeat(11,minmax(0,1fr));width:100%;height:100%;border:2px solid rgba(72,40,15,.5)}.coordinate-label{display:grid;place-items:center;color:#44270fad;font-size:clamp(.52rem,1vw,.74rem);font-weight:900;letter-spacing:0;-webkit-user-select:none;user-select:none}.column-label{border-bottom:1px solid rgba(88,52,18,.24)}.row-label{border-right:1px solid rgba(88,52,18,.24)}.board-cell{position:relative;display:grid;place-items:center;min-width:0;min-height:0;aspect-ratio:1 / 1;border:1px solid rgba(88,52,18,.28);background:#ffffff0a;padding:0;transition:background .14s ease,box-shadow .14s ease}.board-cell.empty:hover{background:#177e792e}.board-cell.axis-highlight{background:#fff6c229;box-shadow:inset 0 0 0 1px #d7a93629}.board-cell.axis-highlight.ghost-preview{background:#177e7933}.empty-dot{width:11%;height:11%;position:relative;border-radius:999px;background:#5c361447;opacity:0}.board-cell.empty:hover .empty-dot,.board-cell.hint-cell .empty-dot{opacity:1;background:var(--teal)}.board-cell.hint-cell{outline:3px solid rgba(23,126,121,.5);outline-offset:-4px}.board-cell.opportunity-cell.empty{box-shadow:inset 0 0 0 2px #177e7957}.board-cell.danger-cell.empty{box-shadow:inset 0 0 0 2px #cc5b4561}.board-cell.expiry-soon.has-piece .stone-shell:before{box-shadow:0 0 0 1px #18202617,0 0 16px #cc5b4557}.board-cell.ghost-preview{background:#177e7924}.board-cell.ghost-preview .empty-dot{width:78%;height:78%;opacity:1;background:transparent}.ghost-stone{position:absolute;top:8%;right:8%;bottom:8%;left:8%;border-radius:999px;opacity:.42;filter:saturate(.86);box-shadow:inset -6px -7px 13px #0000002e,0 5px 10px #20130929}.ghost-preview.black .ghost-stone{background:radial-gradient(circle at 32% 28%,#4a575c,var(--black) 58%)}.ghost-preview.white .ghost-stone{background:radial-gradient(circle at 32% 26%,#ffffff,var(--white) 62%);border:1px solid rgba(24,32,38,.2)}.stone-shell{position:relative;display:grid;place-items:center;width:78%;height:78%;--ttl-ring: var(--teal)}.ttl-high .stone-shell{--ttl-ring: var(--teal)}.ttl-mid .stone-shell{--ttl-ring: var(--gold)}.ttl-danger .stone-shell{--ttl-ring: var(--coral)}.stone-shell:before{content:"";position:absolute;top:-2px;right:-2px;bottom:-2px;left:-2px;border-radius:999px;background:conic-gradient(var(--ttl-ring) var(--ttl-degrees),rgba(255,255,255,.36) 0);box-shadow:0 0 0 1px #18202617}.stone{position:absolute;top:8%;right:8%;bottom:8%;left:8%;z-index:1;border-radius:999px;box-shadow:inset -6px -7px 13px #0000003d,0 5px 10px #20130933}.black .stone{background:radial-gradient(circle at 32% 28%,#4a575c,var(--black) 58%)}.white .stone{background:radial-gradient(circle at 32% 26%,#ffffff,var(--white) 62%);border:1px solid rgba(24,32,38,.2)}.ttl{position:relative;z-index:2;min-width:1.4em;color:#fff;font-size:clamp(.58rem,1.2vw,.83rem);font-weight:900;text-align:center;text-shadow:0 1px 5px rgba(0,0,0,.48)}.white .ttl{color:var(--ink);text-shadow:0 1px 5px rgba(255,255,255,.6)}.low-ttl .stone{box-shadow:inset -6px -7px 13px #0000003d,0 0 0 4px #cc5b4557,0 5px 10px #20130933}.low-ttl .stone-shell{--ttl-ring: var(--coral)}.ttl-danger .stone-shell:before{box-shadow:0 0 0 1px #18202617,0 0 18px #cc5b456b}.expiring-preview .stone{animation:pulse-expire .8s ease-in-out infinite alternate}.expiring-preview .stone-shell:before{background:conic-gradient(var(--coral) var(--ttl-degrees),rgba(204,91,69,.24) 0);box-shadow:0 0 0 2px #cc5b4561,0 0 22px #cc5b4570}.last-move .stone-shell{animation:stone-pop .34s cubic-bezier(.2,.9,.2,1)}.last-move .stone{animation:last-move-glow 1.05s ease-out}.winning{background:#d7a93680;outline:3px solid rgba(215,169,54,.85);outline-offset:-4px;overflow:hidden}.winning:after{content:"";position:absolute;top:10%;right:10%;bottom:10%;left:10%;border-radius:999px;background:linear-gradient(115deg,transparent 15%,rgba(255,255,255,.68),transparent 85%);transform:translate(-130%);animation:win-sweep 1.1s ease-out .12s both;pointer-events:none}.winning .stone{box-shadow:inset -6px -7px 13px #0003,0 0 0 5px #ffeca0db,0 0 26px #d7a936e6}.win-mark{position:absolute;top:-4px;right:-4px;z-index:3;color:var(--gold);fill:var(--gold)}.panel-heading{gap:8px;margin-bottom:14px}.history-list{display:grid;gap:10px;margin:0;padding:0;list-style:none}.history-list li{gap:9px;min-width:0;color:var(--muted);font-size:.9rem;padding:4px 6px;border-radius:8px}.history-list li.active-move{background:#177e791f;color:var(--ink)}.history-move-button{min-width:0;border:0;background:transparent;color:inherit;padding:0;text-align:left;font:inherit;font-weight:700}.history-move-button:focus-visible{outline:2px solid rgba(23,126,121,.5);outline-offset:2px}.history-stone{width:14px;height:14px}.history-list span:nth-child(2),.history-move-button{min-width:0}.history-list em{margin-left:auto;color:var(--coral);font-size:.78rem;font-style:normal;font-weight:800;white-space:nowrap}.empty-state{margin-bottom:0}.rules-panel{box-shadow:none}.rules-panel summary{cursor:pointer;color:var(--ink);font-weight:900}.rules-panel p{margin-top:12px;margin-bottom:0}.replay-panel{display:grid;gap:13px}.replay-dock{grid-template-columns:auto minmax(180px,1fr) auto;align-items:center;gap:12px;padding:12px;box-shadow:0 10px 30px #27342c17}.replay-dock .panel-heading{margin-bottom:0}.replay-dock .replay-actions{justify-content:flex-end}.replay-progress{gap:8px;color:var(--muted);font-size:.85rem;font-weight:800}progress{width:100%;height:10px;overflow:hidden;border:0;border-radius:999px;background:#dfe7e1}progress::-webkit-progress-bar{background:#dfe7e1}progress::-webkit-progress-value{background:var(--teal)}.replay-actions{align-items:stretch}@keyframes pulse-expire{0%{transform:scale(1);filter:saturate(1)}to{transform:scale(.88);filter:saturate(1.8)}}@keyframes stone-pop{0%{transform:scale(.62);opacity:.7}70%{transform:scale(1.08);opacity:1}to{transform:scale(1)}}@keyframes last-move-glow{0%{box-shadow:inset -6px -7px 13px #0000003d,0 0 0 8px #177e7952,0 5px 10px #20130933}to{box-shadow:inset -6px -7px 13px #0000003d,0 5px 10px #20130933}}@keyframes win-sweep{0%{transform:translate(-130%) rotate(12deg)}to{transform:translate(130%) rotate(12deg)}}@keyframes thinking-dot{0%,to{transform:translateY(0);opacity:.45}50%{transform:translateY(-3px);opacity:1}}@media (max-width: 1120px){.game-layout{grid-template-columns:minmax(0,1fr)}.side-stack{grid-template-columns:repeat(2,minmax(0,1fr))}.play-section{order:-1}.side-stack:first-child{order:0}.side-stack:last-child{order:1}.board-wrap{margin:0 auto}}@media (max-width: 700px){.app-shell{padding:12px}.side-stack{grid-template-columns:1fr}.side-stack:first-child{order:-2}.play-section{order:-1}.board-meta{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;padding:10px}.board-meta strong{font-size:.86rem}.panel{padding:13px}h1{font-size:1.38rem}.button-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}.button-row .ghost-action{grid-column:1 / -1}.replay-actions{grid-template-columns:repeat(2,minmax(0,1fr))}.replay-actions .ghost-action{grid-column:1 / -1}.primary-action,.secondary-action,.ghost-action,.icon-action{min-width:0;padding:0 10px}.board-wrap{padding:7px}.coordinate-label{font-size:.48rem}.replay-dock{grid-template-columns:1fr}.replay-dock .replay-actions{justify-content:stretch}}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}