:root{color-scheme:light;--washi: #f3eee3;--washi-deep: #e8e0d0;--wood: #d4a84b;--wood-deep: #c4953a;--wood-edge: #8a5a22;--ink: #241c14;--ink-soft: #5c5144;--line: #3a2a18;--stone: #1c1814;--cpu: #1c1814;--you: #b33a32;--hint: #f0d078;--accent: #c45c26;--circle: #1f6f8b;--card: #faf7f0;--edge: #cbbfa8;--shadow: rgba(36, 28, 20, .12);--board-size: min(92vw, calc(100vw - var(--coord) * 2 - 8px), 420px);--coord: 22px}*{box-sizing:border-box}html,body{margin:0;min-height:100%;overflow-x:hidden;overflow-x:clip}body{background:radial-gradient(ellipse at top,#f7f3ea 0%,var(--washi) 55%,var(--washi-deep) 100%);color:var(--ink);font-family:Hiragino Sans,Noto Sans JP,Yu Gothic UI,system-ui,sans-serif;-webkit-tap-highlight-color:transparent;line-height:1.6}#app{max-width:520px;margin:0 auto;padding:20px 16px 56px}.top{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;margin-bottom:14px}.brand{min-width:0}.eyebrow{margin:0;font-size:11px;letter-spacing:.18em;color:var(--ink-soft);font-weight:600}h1{margin:2px 0 0;font-family:Shippori Mincho B1,Hiragino Mincho ProN,Yu Mincho,YuMincho,serif;font-size:28px;font-weight:600;letter-spacing:.06em;line-height:1.2}.subtitle{margin:6px 0 0;color:var(--ink-soft);font-size:12px;line-height:1.5;max-width:28em}.switches{display:flex;flex-direction:column;gap:8px;flex-shrink:0}.switch{display:inline-flex;align-items:center;gap:8px;cursor:pointer;user-select:none;font-size:13px;color:var(--ink);position:relative}.switch input{position:absolute;left:0;top:50%;transform:translateY(-50%);width:34px;height:20px;margin:0;opacity:0;cursor:pointer;z-index:2}.switch-ui{width:34px;height:20px;border-radius:999px;background:var(--washi-deep);border:1px solid var(--edge);position:relative;transition:background .15s ease,border-color .15s ease}.switch-ui:after{content:"";position:absolute;top:2px;left:2px;width:14px;height:14px;border-radius:50%;background:var(--card);border:1px solid var(--edge);transition:transform .15s ease}.switch input:checked+.switch-ui{background:var(--accent);border-color:var(--accent)}.switch input:checked+.switch-ui:after{transform:translate(14px);border-color:transparent}.switch input:focus-visible+.switch-ui{outline:2px solid var(--circle);outline-offset:2px}.switch-label{min-width:2.5em}.statusbar{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin:0 0 12px;padding:10px 2px;border-top:1px solid var(--edge);border-bottom:1px solid var(--edge)}.turn{font-family:Shippori Mincho B1,Hiragino Mincho ProN,Yu Mincho,serif;font-weight:600;font-size:16px;letter-spacing:.04em}.meta{display:flex;flex-direction:column;align-items:flex-end;gap:2px;font-size:12px;color:var(--ink-soft);font-variant-numeric:tabular-nums}.fetch{color:var(--accent)}.board-frame{--cell: calc((var(--board-size) - 1px) / 9);display:grid;grid-template-columns:var(--coord) var(--board-size) var(--coord);grid-template-rows:var(--coord) var(--board-size) var(--coord);width:calc(var(--board-size) + var(--coord) * 2);margin:8px 0 0;position:relative;left:50%;transform:translate(-50%);justify-content:center}.coords{display:grid;font-size:11px;color:var(--ink-soft);font-variant-numeric:tabular-nums;letter-spacing:.04em;font-weight:600}.coords span{display:flex;align-items:center;justify-content:center}.coords-top{grid-column:2;grid-row:1;grid-template-columns:repeat(9,1fr)}.coords-bottom{grid-column:2;grid-row:3;grid-template-columns:repeat(9,1fr)}.coords-left{grid-column:1;grid-row:2;grid-template-rows:repeat(9,1fr)}.coords-right{grid-column:3;grid-row:2;grid-template-rows:repeat(9,1fr)}.board-shell{grid-column:2;grid-row:2;position:relative;width:var(--board-size);height:var(--board-size);background:linear-gradient(180deg,rgba(255,255,255,.2),transparent 42%),linear-gradient(145deg,#dfb85c 0%,var(--wood) 42%,var(--wood-deep) 100%);border:3px solid var(--wood-edge);box-shadow:0 1px #ffffff40 inset,0 8px 24px var(--shadow)}.board-shell:before{content:"";position:absolute;inset:0;background:repeating-linear-gradient(90deg,transparent 0 7px,rgba(90,55,15,.04) 7px 8px);pointer-events:none}.grid-layer{position:absolute;inset:0;width:100%;height:100%;z-index:0;pointer-events:none}.board{position:absolute;inset:0;display:grid;grid-template-columns:repeat(9,1fr);grid-template-rows:repeat(9,1fr);z-index:1}.cell{position:relative;border:0;background:transparent;padding:0;min-height:0;cursor:pointer;z-index:2}.cell:focus-visible{outline:2px solid var(--circle);outline-offset:-4px}.cell:disabled{cursor:default}.cell.hint-ok:before{content:"";position:absolute;inset:36%;border-radius:50%;background:var(--hint);box-shadow:0 0 0 1px #241c141f;opacity:.95}.cell.cpu:after,.cell.you:after{content:"";position:absolute;inset:12%;border-radius:50%;box-shadow:0 1px 2px #00000059,inset 0 1px 1px #ffffff2e}.cell.cpu:after,.cell.you:after{background:radial-gradient(circle at 35% 30%,#4a443c,var(--stone) 55%,#0d0b09)}#board.hint-on .cell.cpu:after{background:radial-gradient(circle at 35% 30%,#5a534a,var(--cpu) 55%,#0a0908)}#board.hint-on .cell.you:after{background:radial-gradient(circle at 35% 30%,#e07068,var(--you) 55%,#7a201c)}.cell.last:before{content:"";position:absolute;inset:38%;border-radius:50%;background:var(--accent);z-index:3;box-shadow:0 0 0 1px #ffffff80}.cell.hint-ok.last:before{inset:38%;background:var(--accent)}.cell.blame:after{outline:2px solid var(--circle);outline-offset:1px}.cell.blame:not(.cpu):not(.you):after{content:"";position:absolute;inset:22%;border-radius:50%;border:2px dashed var(--circle);background:transparent}.circle-layer{position:absolute;inset:0;width:100%;height:100%;z-index:4;pointer-events:none;overflow:visible}.circle-layer circle,.circle-layer line{stroke:var(--circle);stroke-width:.045;stroke-linecap:round;opacity:.9;filter:drop-shadow(0 0 .5px rgba(255,255,255,.4))}.circle-layer circle{fill:none}.circle-layer circle.faint,.circle-layer line.faint{opacity:.35;stroke-width:.03}.coord-readout{text-align:center;margin:10px 0 0;min-height:1.4em;font-size:13px;color:var(--ink-soft);font-variant-numeric:tabular-nums;letter-spacing:.08em}.controls{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:14px}.btn{font:inherit;font-size:14px;font-weight:600;letter-spacing:.04em;border:1px solid var(--line);background:var(--card);color:var(--ink);border-radius:4px;padding:12px 10px;cursor:pointer;box-shadow:0 1px #fff9 inset}.btn:hover:not(:disabled){border-color:var(--accent);color:var(--accent)}.btn:disabled{opacity:.35;cursor:not-allowed}.btn-quiet{grid-column:1 / -1;border-color:var(--accent);color:var(--accent)}.legend{display:flex;flex-wrap:wrap;gap:10px 14px;margin:16px 0 0;font-size:12px;color:var(--ink-soft)}.chip{display:inline-flex;align-items:center;gap:6px}.chip-hint-only{display:none}body:has(#board.hint-on) .chip-hint-only{display:inline-flex}.stone{width:12px;height:12px;border-radius:50%;display:inline-block;box-shadow:0 1px 1px #00000040}.stone-black,.stone-cpu{background:radial-gradient(circle at 35% 30%,#5a534a,var(--stone))}.stone-you{background:radial-gradient(circle at 35% 30%,#e07068,var(--you))}.hint-sw{width:12px;height:12px;border-radius:50%;background:var(--hint);border:1px solid var(--edge);display:inline-block}.ring-sw{width:12px;height:12px;border-radius:50%;border:2px solid var(--circle);display:inline-block}.about{margin-top:22px;padding-top:14px;border-top:1px solid var(--edge);font-size:13px;color:var(--ink-soft)}.about summary{cursor:pointer;font-weight:600;color:var(--ink);letter-spacing:.04em}.about p{margin:10px 0;line-height:1.7}.tech{margin:8px 0 0;font-size:11px;font-variant-numeric:tabular-nums}.tech div{display:flex;gap:8px}.tech dt{min-width:72px;color:var(--ink-soft)}.tech dd{margin:0;color:var(--ink)}.about .mono{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:.94em}.about-links{font-size:11px}.about-links a{color:var(--ink-soft);text-decoration:underline;text-decoration-color:color-mix(in srgb,var(--ink-soft) 45%,transparent);text-underline-offset:2px}.about-links a:hover,.about-links a:focus-visible{color:var(--ink);text-decoration-color:currentColor}.about-links span{margin:0 5px}@media(max-width:420px){#app{padding:14px 10px 48px}h1{font-size:24px}.subtitle{display:none}.top{align-items:center}}