:root{color-scheme:light;--paper:#faf9f6;--ink:#292e31;--muted:#727a7e;--rule:#d9dedc;--closed:#e1e4df;--open:#dfc18c;--wet:#3d88a0;--route:#a54530;--field:#fff;--blue:#287a9b;--orange:#b96d2f;--violet:#8661ab;font:15px/1.7 -apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei",sans-serif}
:root.dark{color-scheme:dark;--paper:#202120;--ink:#e5e8e3;--muted:#a3afa9;--rule:#414b46;--closed:#343c37;--open:#a58c62;--wet:#4a9fb7;--route:#ffb085;--field:#282c29;--blue:#6db6cf;--orange:#e5ad78;--violet:#bba0de}
*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink)}main{padding:24px 24px 28px;border-top:2px solid var(--ink);min-width:0}h1{font-size:21px;line-height:1.5;font-weight:650;letter-spacing:-.4px;margin:0 0 7px}p{margin:0}.eyebrow{font:11px/1.5 ui-monospace,monospace;letter-spacing:1.6px;color:var(--blue);margin-bottom:8px}.intro{font-size:13px;color:var(--muted);margin-bottom:20px}.toolbar{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:14px 0}button{font:inherit;font-size:12px;min-height:38px;border:1px solid var(--rule);border-radius:4px;padding:7px 12px;background:transparent;color:var(--ink);cursor:pointer}button:hover{border-color:var(--ink)}button[aria-pressed=true]{border-color:var(--blue);color:var(--blue)}button.primary{background:var(--ink);color:var(--paper);border-color:var(--ink)}button:disabled{opacity:.4;cursor:default}button:focus-visible,input:focus-visible{outline:2px solid var(--route);outline-offset:3px}input[type=range]{accent-color:var(--blue);width:100%;min-width:0;min-height:32px;margin:0}.slider{display:grid;grid-template-columns:auto minmax(60px,1fr) 62px;gap:14px;align-items:center;font-size:12px;margin:18px 0}.slider output{font:15px ui-monospace,monospace;text-align:right;color:var(--blue)}.figure{display:block;width:100%;max-width:400px;aspect-ratio:1;margin:0 auto}.figure text{font:11px sans-serif;fill:var(--muted)}.board-label{font-size:11px;color:var(--muted);text-align:center;margin:6px 0}.board{display:grid;grid-template-columns:repeat(8,1fr);gap:3px;max-width:400px;margin:auto}.cell{aspect-ratio:1;min-height:0;padding:0;border:1px solid transparent;border-radius:2px;font-size:17px;line-height:1;background:var(--closed);color:var(--muted)}.cell.open{background:var(--open);color:#3b3020}.cell.wet{background:var(--wet);color:#f4fbfc}.cell.route{outline:2px solid var(--route);outline-offset:-3px}.legend{display:flex;gap:12px;flex-wrap:wrap;font-size:11px;color:var(--muted);margin:14px 0}.legend span{display:inline-flex;align-items:center;gap:5px}.swatch{display:inline-block;width:11px;height:11px;background:var(--closed);flex:none}.swatch.open{background:var(--open)}.swatch.wet{background:var(--wet)}.swatch.route{background:transparent;border:2px solid var(--route)}.stats{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:20px;padding-top:15px;border-top:1px solid var(--rule)}.label{font-size:11px;color:var(--muted)}.value{font-size:26px;font-weight:550;line-height:1.5;font-variant-numeric:tabular-nums;letter-spacing:-.5px}.value.yes{color:var(--blue)}.note,.status{font-size:12px;color:var(--muted);margin-top:12px;overflow-wrap:anywhere}.status{min-height:24px}.status strong{color:var(--ink);font-weight:550}.pair{display:grid;grid-template-columns:1fr 1fr;gap:24px}.pair h2{font-size:14px;margin:8px 0;font-weight:550}.pair .figure{max-width:320px}.pair .stats{grid-template-columns:1fr;gap:5px;margin-top:10px;padding-top:10px}.pair .value{font-size:23px}.chart{width:100%;display:block;aspect-ratio:2}.chart text{fill:var(--muted);font:12px -apple-system,BlinkMacSystemFont,"PingFang SC",sans-serif}.chart .axis{stroke:var(--rule);stroke-width:1}.chart .ref{stroke:var(--muted);stroke-width:1;stroke-dasharray:4 4}.table-wrap{max-width:100%;overflow-x:auto}table{width:100%;border-collapse:collapse;text-align:right;font-size:12px;font-variant-numeric:tabular-nums;margin-top:12px}td,th{padding:8px;border-bottom:1px solid var(--rule);font-weight:400}td:first-child,th:first-child{text-align:left}th{color:var(--muted)}.line-key{width:18px;height:0;border-top:2px solid var(--blue);display:inline-block}.key16{border-color:var(--orange);border-top-style:dashed}.key32{border-color:var(--violet);border-top-style:dotted}.chain{display:grid;grid-template-columns:repeat(10,1fr);gap:4px;margin:20px 0}.chain span{display:flex;aspect-ratio:1;align-items:center;justify-content:center;font:10px ui-monospace,monospace;background:var(--closed);color:var(--muted);border-radius:2px}.chain .open{background:var(--open);color:#3b3020}.chain .wet{background:var(--wet);color:#fff}.chain .break{outline:2px solid var(--route);outline-offset:-2px}.big-result{font-size:35px;color:var(--blue);font-weight:500;letter-spacing:-1px;font-variant-numeric:tabular-nums}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}[hidden]{display:none!important}
@media(max-width:540px){main{padding:18px 14px 22px}h1{font-size:19px}.intro{font-size:12px}.pair{grid-template-columns:1fr;gap:22px}.pair .figure{max-width:270px}.slider{gap:9px;grid-template-columns:auto minmax(40px,1fr) 52px}.value{font-size:23px}.legend{gap:9px}.chart{aspect-ratio:1.7}.cell{font-size:15px}.chain{gap:3px}.stats{gap:10px}td,th{padding:8px 4px}.toolbar button{padding:7px 10px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}
@media(max-width:540px){.chart text{font-size:20px}}