.hn-board{border:3px solid var(--ink);border-radius:var(--radius);background:#4f7f9a;grid-template-columns:repeat(6,1fr);gap:3px;width:min(100%,400px,max(250px,75svh - 247.5px));margin:0 auto;padding:5px;display:grid}.hn-sq{aspect-ratio:1;font:inherit;color:inherit;background:#8fbcd4;border:0;border-radius:5px;padding:0;position:relative}.hn-sq.reeds{background:repeating-linear-gradient(100deg,#5c8a3a 0 4px,#7aa955 4px 9px)}button.hn-sq{cursor:pointer}.hn-sq.can:after{content:"";box-shadow:inset 0 0 0 3px var(--good);pointer-events:none;border-radius:5px;position:absolute;inset:0}.hn-sq.last{box-shadow:inset 0 0 0 2px #fff}.hn-pc{border:2px solid var(--ink);color:#fff;border-radius:7px;flex-direction:column;justify-content:center;align-items:center;line-height:1;display:flex;position:absolute;inset:7%;box-shadow:0 2px #00000059}.hn-pc.p0{background:var(--info)}.hn-pc.p1{background:var(--bad)}.hn-pc b{font-family:var(--f-mono);font-size:clamp(15px,4.6vw,22px)}.hn-pc small{margin-top:2px;font-size:clamp(8px,2.3vw,11px)}.hn-pc.unknown b{opacity:.7}.hn-pc.seen{outline-offset:-5px;outline:2px dashed #fff}.hn-pc.on{outline:3px solid var(--ink);outline-offset:2px}.hn-sq.win .hn-pc{box-shadow:0 0 0 3px var(--good)}.hn-fight{text-align:center;min-height:1.4em;margin:0;font-weight:700}.hn-lost{color:var(--muted);justify-items:center;gap:4px;font-size:13px;display:grid}.hn-lost span{font-family:var(--f-mono)}