:root{--paper: #f6f4ef;--ink: #1b1917;--accent: #b8432f;--ink-70: rgba(27, 25, 23, .7);--ink-55: rgba(27, 25, 23, .55);--ink-40: rgba(27, 25, 23, .4);--ink-25: rgba(27, 25, 23, .25);--hairline: rgba(27, 25, 23, .14);--ink-06: rgba(27, 25, 23, .06);--gap: clamp(6px, 1.8vw, 9px)}*{margin:0;padding:0;box-sizing:border-box}html{-webkit-text-size-adjust:100%}body{background:var(--paper);color:var(--ink);font-family:Noto Sans JP,sans-serif;font-size:15px;line-height:1.8;font-feature-settings:"palt"}button{font:inherit;color:inherit;background:none;border:none;cursor:pointer;-webkit-tap-highlight-color:transparent}.container{max-width:560px;margin:0 auto;padding:0 20px 96px}header.site{border-bottom:1px solid var(--hairline)}.site-inner{max-width:560px;margin:0 auto;padding:18px 20px;display:flex;align-items:baseline;gap:10px}.wordmark{font-size:22px;font-weight:900;letter-spacing:.06em;line-height:1}.tagline{font-size:11.5px;color:var(--ink-55);letter-spacing:.04em}nav.tabs{margin-left:auto;display:flex;gap:18px}nav.tabs a{color:var(--ink-55);text-decoration:none;font-size:14px;font-weight:500;padding-bottom:2px}nav.tabs a.active{color:var(--ink);font-weight:700;border-bottom:2px solid var(--ink)}.status-row{display:flex;align-items:baseline;margin:26px 0 14px;min-height:28px}.status{font-size:17px;font-weight:700}.status.win{color:var(--accent)}.status .sub{font-weight:400;font-size:13px;color:var(--ink-55);margin-left:10px}.move-count{margin-left:auto;font-size:12.5px;color:var(--ink-40);font-variant-numeric:tabular-nums}.board-wrap{max-width:440px;margin:0 auto}.marks{display:grid;grid-template-columns:repeat(7,1fr);gap:var(--gap);height:20px;margin-bottom:3px}.mark{display:flex;align-items:center;justify-content:center;line-height:1}.m-score{font-size:12px;font-weight:500;font-variant-numeric:tabular-nums;letter-spacing:-.03em;color:var(--ink-40)}.m-score.plain{color:var(--ink-55)}.m-score.best{color:var(--ink);font-weight:700}.m-score.win{color:var(--accent);font-weight:700}.m-score.loss{color:var(--ink-40)}@media(max-width:430px){.m-score{font-size:10.5px;letter-spacing:-.04em}}.board{position:relative;display:grid;grid-template-columns:repeat(7,1fr);gap:var(--gap);border-top:1px solid var(--hairline);border-bottom:1px solid var(--ink);padding:calc(var(--gap) + 2px) 0}.cell{position:relative;aspect-ratio:1}.cell:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border:1px solid var(--ink-25);border-radius:50%}.disc{position:absolute;top:0;right:0;bottom:0;left:0;border-radius:50%;z-index:1}.disc.u{background:var(--accent)}.disc.c{background:var(--ink)}.board:not(.no-anim) .disc.dropped{animation:drop .3s cubic-bezier(.5,0,.8,.4)}@keyframes drop{0%{transform:translateY(var(--drop))}to{transform:none}}.disc .last-dot{position:absolute;top:50%;left:50%;width:14%;height:14%;border-radius:50%;transform:translate(-50%,-50%);background:var(--paper)}.disc.ghost{opacity:.28}.disc.hint{background:none;border:2px solid var(--accent);opacity:1;animation:none}.board.finished .disc:not(.win-disc){opacity:.22}.board.finished .disc.win-disc{opacity:1}.col-hits{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;grid-template-columns:repeat(7,1fr);gap:var(--gap);z-index:2}.col-hit{height:100%}.col-hit:disabled{cursor:default}@media(hover:hover){.col-hit:not(:disabled):hover{background:var(--ink-06)}}.legend{display:flex;flex-wrap:wrap;gap:6px 14px;justify-content:center;margin-top:12px;font-size:11.5px;color:var(--ink-55);align-items:center}.legend b{font-weight:700;font-style:normal}.legend .lg-best{color:var(--ink)}.legend .lg-win{color:var(--accent)}.legend .lg-loss{color:var(--ink-40)}.legend .sep{width:1px;height:10px;background:var(--hairline)}@media(max-width:430px){.legend .sep{display:none}}.feedback{min-height:54px;margin-top:14px;padding:12px 16px;background:var(--ink-06);font-size:13.5px;line-height:1.7;display:flex;align-items:center}.feedback.empty{background:none;border:1px dashed transparent}.feedback .verdict{font-weight:700;margin-right:8px;flex-shrink:0}.feedback .verdict.good{color:var(--accent)}.actions{display:flex;gap:8px;margin-top:18px}.btn{border:1px solid var(--ink-40);padding:9px 0;flex:1;font-size:13.5px;font-weight:500;background:var(--paper);border-radius:2px}.btn:disabled{opacity:.35;cursor:default}@media(hover:hover){.btn:not(:disabled):hover{background:var(--ink-06)}}.btn.on{background:var(--ink);color:var(--paper);border-color:var(--ink)}.btn.primary{background:var(--ink);color:var(--paper);border-color:var(--ink);font-weight:700}.settings{margin-top:26px;padding-top:20px;border-top:1px solid var(--hairline);display:flex;flex-direction:column;gap:14px}.setting{display:flex;align-items:center;gap:12px}.setting .label{font-size:12.5px;color:var(--ink-55);width:4.5em;flex-shrink:0}.seg{display:flex;flex:1}.seg button{flex:1;padding:8px 0;font-size:13px;font-weight:500;border:1px solid var(--ink-40);margin-left:-1px;background:var(--paper);border-radius:0}.seg button:first-child{margin-left:0;border-radius:2px 0 0 2px}.seg button:last-child{border-radius:0 2px 2px 0}.seg button.on{background:var(--ink);color:var(--paper);border-color:var(--ink);font-weight:700}.new-game{border:1px solid var(--ink);background:var(--ink);color:var(--paper);font-weight:700;font-size:13.5px;padding:10px 0;border-radius:2px;width:100%}.learn-head{margin:34px 0 8px}.learn-head h2{font-size:24px;font-weight:900;line-height:1.5;letter-spacing:.02em}.learn-head .progress{font-size:12.5px;color:var(--ink-55);font-variant-numeric:tabular-nums}.learn-intro{color:var(--ink-70);font-size:14.5px;margin-top:10px}.lesson{border-top:1px solid var(--hairline);margin-top:40px;padding-top:32px}.lesson .no{font-size:12px;color:var(--ink-40);font-variant-numeric:tabular-nums;letter-spacing:.1em}.lesson h3{font-size:19px;font-weight:900;margin:4px 0 12px;line-height:1.6}.lesson p{font-size:14.5px;color:var(--ink-70)}.lesson p strong{color:var(--ink)}.lesson p+p{margin-top:10px}.fm-figure{margin:20px 0 6px}.fm-cells{display:grid;grid-template-columns:repeat(7,1fr);gap:6px;max-width:360px}.fm-cell{aspect-ratio:1;display:flex;flex-direction:column;align-items:center;justify-content:center;background:var(--ink-06);font-size:15px;font-weight:700;gap:1px}.fm-cell .n{font-size:10px;font-weight:400;color:var(--ink-40)}.fm-cell.w{background:var(--accent);color:var(--paper)}.fm-cell.w .n{color:#f6f4efb3}.fm-cell.l{color:var(--ink-40)}.figure-caption{font-size:11.5px;color:var(--ink-55);margin-top:8px}.parity-figure{margin:20px 0 6px;max-width:300px}.parity-row{display:flex;align-items:center;gap:12px;padding:7px 12px;font-size:12.5px}.parity-row.odd{background:var(--ink-06)}.parity-row .rn{width:3.5em;color:var(--ink-55);font-variant-numeric:tabular-nums}.parity-row .who{font-weight:700}.parity-row.odd .who{color:var(--accent)}.parity-row.even .who{color:var(--ink-55)}.drill{margin-top:22px;background:var(--ink-06);padding:18px 18px 20px}.drill-label{font-size:11px;font-weight:700;letter-spacing:.14em;color:var(--ink-55)}.drill-label .done{color:var(--accent);margin-left:8px;letter-spacing:0;font-weight:700}.drill-prompt{font-size:14.5px;font-weight:700;margin:6px 0 14px}.drill .board-wrap{max-width:320px;margin:0}.drill .board{background:var(--paper);padding:calc(var(--gap) + 2px) var(--gap);border-top:none}.drill-feedback{margin-top:12px;font-size:13.5px;line-height:1.7;min-height:24px}.drill-feedback .verdict{font-weight:700;margin-right:8px}.drill-feedback .verdict.good{color:var(--accent)}.drill-retry{margin-top:10px;font-size:12.5px;text-decoration:underline;text-underline-offset:3px;color:var(--ink-55);padding:2px 0}.choice-options{display:flex;flex-direction:column;gap:8px}.choice-options button{text-align:left;padding:12px 14px;border:1px solid var(--ink-40);background:var(--paper);font-size:13.5px;border-radius:2px}@media(hover:hover){.choice-options button:hover{background:var(--ink-06)}}.choice-options button.picked-good{background:var(--ink);color:var(--paper);border-color:var(--ink)}.to-play{margin-top:18px}.to-play a{display:inline-block;background:var(--ink);color:var(--paper);text-decoration:none;font-weight:700;font-size:13.5px;padding:11px 26px;border-radius:2px}.engine-note{margin-top:48px;padding-top:16px;border-top:1px solid var(--hairline);font-size:11.5px;color:var(--ink-40)}@media(prefers-reduced-motion:reduce){.disc.dropped{animation:none!important}}
