*{margin:0;padding:0;box-sizing:border-box}body{font-family:var(--la-font-ui);background:var(--la-page);color:var(--la-ink);line-height:var(--la-leading-body);-webkit-font-smoothing:antialiased}.bnb{margin-top:var(--la-space-5)}.bnb-machine{border:1px solid var(--la-hairline);border-radius:var(--la-radius);background:var(--la-sunken);padding:var(--la-space-4) var(--la-space-3);overflow-x:auto}.bnb-row{list-style:none;display:grid;grid-template-columns:repeat(8,minmax(44px,1fr));gap:.3rem}[data-width="6"] .bnb-row{grid-template-columns:repeat(6,minmax(44px,1fr))}[data-width="8"] .bnb-row{grid-template-columns:repeat(8,minmax(44px,1fr))}[data-width="12"] .bnb-row{grid-template-columns:repeat(12,minmax(44px,1fr))}[data-width="18"] .bnb-row{grid-template-columns:repeat(18,minmax(44px,1fr))}[data-width="12"] .bnb-bit{font-size:var(--la-text-base)}[data-width="18"] .bnb-bit{font-size:var(--la-text-sm)}[data-width="12"] .bnb-place,[data-width="18"] .bnb-place{writing-mode:vertical-rl;transform:rotate(180deg);margin-left:auto;margin-right:auto}.bnb-widthbar{display:flex;flex-wrap:wrap;align-items:center;gap:var(--la-space-2) var(--la-space-3);margin-bottom:var(--la-space-3)}.bnb-machinelabel,.bnb-widthlabel{font-family:var(--la-font-mono);font-size:var(--la-text-xs);color:var(--la-ink-faint)}.bnb-widths{list-style:none;display:flex;gap:.3rem}.bnb-width{font:inherit;font-family:var(--la-font-mono);font-size:var(--la-text-sm);color:var(--la-ink-dim);background:var(--la-raised);border:1px solid var(--la-hairline);border-radius:var(--la-radius-sm);padding:.45rem .9rem;cursor:pointer;transition:border-color var(--la-transition),color var(--la-transition),background var(--la-transition)}.bnb-width:hover{color:var(--la-ink);border-color:var(--la-hairline-strong)}.bnb-width.is-on{color:var(--la-page);background:var(--machine);border-color:var(--machine);font-weight:700}.bnb-width:focus-visible{outline:2px solid var(--machine);outline-offset:3px}.bnb-places{font-family:var(--la-font-mono);font-size:var(--la-text-xs);color:var(--la-ink-faint);text-align:center;margin-bottom:.25rem}.bnb-bits{margin-bottom:var(--la-space-3)}.bnb-bit{width:100%;aspect-ratio:1/1;font-family:var(--la-font-mono);font-size:var(--la-text-lg);color:var(--la-ink-faint);background:var(--la-raised);border:1px solid var(--la-hairline-strong);border-radius:var(--la-radius-sm);cursor:pointer;transition:background var(--la-transition),color var(--la-transition),border-color var(--la-transition)}.bnb-bit:hover{border-color:var(--machine)}.bnb-bit.is-on{color:var(--la-page);background:var(--machine);border-color:var(--machine);font-weight:700}.bnb-bit:focus-visible{outline:2px solid var(--machine);outline-offset:3px}.bnb-groups{margin-bottom:var(--la-space-3)}.bnb-group{font-family:var(--la-font-mono);font-size:var(--la-text-sm);text-align:center;padding:.25em 0;border-radius:var(--la-radius-sm);border:1px solid var(--la-hairline);color:var(--la-ink-dim);transition:border-color var(--la-transition),color var(--la-transition)}.bnb-group[data-span="4"]{grid-column:span 4}.bnb-group[data-span="3"]{grid-column:span 3}.bnb-group[data-span="2"]{grid-column:span 2}.bnb-group[data-span="1"]{grid-column:span 1}.is-hex{border-color:color-mix(in srgb,var(--machine) 45%,transparent);color:var(--machine)}.is-hex.is-hot{background:color-mix(in srgb,var(--machine) 14%,transparent);border-color:var(--machine)}.bnb-group.is-ragged{border-style:dashed;color:#ff6b5e;border-color:color-mix(in srgb,#ff6b5e 55%,transparent)}.bnb-grouplabel{font-size:var(--la-text-sm);color:var(--la-ink-dim);margin-bottom:var(--la-space-2)}.bnb-grouplabel strong{color:var(--la-ink)}.bnb-readout{margin-top:var(--la-space-4);display:grid;grid-template-columns:repeat(auto-fit,minmax(6rem,1fr));gap:var(--la-space-3)}.bnb-readout div{border-top:1px solid var(--la-hairline);padding-top:var(--la-space-2)}.bnb-readout div:first-child{grid-column:1/-1}.bnb-readout div:first-child dd{white-space:nowrap;overflow-x:auto}.bnb-readout dt{font-size:var(--la-text-sm);color:var(--la-ink-faint);font-family:var(--la-font-mono)}.bnb-readout dd{margin-top:.2rem;font-family:var(--la-font-mono);font-size:var(--la-text-lg);color:var(--la-ink)}.bnb-note{margin-top:var(--la-space-3);font-family:var(--la-font-mono);font-size:var(--la-text-xs);color:var(--machine);border-left:2px solid color-mix(in srgb,var(--machine) 45%,transparent);padding-left:var(--la-space-2);min-height:2.6em}.bnb-controls{margin-top:var(--la-space-3);display:flex;flex-wrap:wrap;gap:var(--la-space-2)}.bnb-button{font:inherit;font-size:var(--la-text-sm);color:var(--la-ink);background:var(--la-raised);border:1px solid var(--la-hairline-strong);border-radius:var(--la-radius-sm);padding:.45em .9em;cursor:pointer;transition:border-color var(--la-transition),color var(--la-transition)}.bnb-button:hover{border-color:var(--machine);color:var(--machine)}.bnb-button:focus-visible{outline:2px solid var(--machine);outline-offset:3px}.bnb-why{margin-top:var(--la-space-6)}.bnb-why p{margin-top:var(--la-space-2);color:var(--la-ink-dim)}.bnb-sub{margin-top:var(--la-space-4);font-family:var(--la-font-display);font-size:var(--la-text-lg);line-height:var(--la-leading-tight);color:var(--la-ink)}.bnb-why strong{color:var(--la-ink)}.bnb-why em{font-style:italic}@media (max-width:34rem){.bnb-machine{padding:var(--la-space-3) var(--la-space-2)}.bnb-row{gap:.2rem}.bnb-bit{font-size:var(--la-text-base)}}@media (prefers-reduced-motion:reduce){.bnb-bit,.bnb-button,.bnb-group{transition:none}}.bnb-readout dd.is-invalid{color:#ff6b5e}.bnb-readout dd.is-negative{color:#ffb454}@media (max-width:34rem){#bnb{margin-inline:-1.25rem;padding-inline:0.5rem;border-inline-width:0;border-radius:0}.bnb-machine{padding-inline:0;border-inline-width:0;border-radius:0}.bnb-row{gap:.15rem}}