:root{--font-sans:system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;--font-mono:ui-monospace, SFMono-Regular, Menlo, "Cascadia Mono", monospace;--font-size-xs:.75rem;--font-size-sm:.85rem;--font-size-base:1rem;--font-size-lg:1.125rem;--font-size-xl:1.25rem;--font-size-2xl:1.75rem;--line-height:1.5;--color-bg:#fbfbfc;--color-surface:#fff;--color-bg-subtle:#f2f3f6;--color-bg-muted:#e6e8ee;--color-border:#d9dce4;--color-border-strong:#b9bec9;--color-ink:#1c2130;--color-ink-muted:#5b6273;--color-ink-subtle:#878da0;--color-accent:#1d4ed8;--color-accent-hover:#1a43b8;--color-accent-ink:#fff;--color-danger:#dc2626;--color-board-line:#23262d;--color-cell-given-ink:var(--color-board-line);--color-cell-entry-ink:var(--color-accent);--color-cell-selected-bg:#dbe4fb;--color-cell-peer-bg:var(--color-bg-subtle);--color-cell-match-bg:#cfe0f7;--space-1:.25rem;--space-2:.5rem;--space-3:.75rem;--space-4:1rem;--space-6:1.5rem;--space-8:2rem;--radius-sm:4px;--radius-md:6px;--radius-lg:10px;--radius-pill:999px;--border-cell:1px;--border-box:3px;--hatch-stripe:.4rem;--hatch-ring:2px;--shadow-sm:0 1px 2px #1c21300f;--shadow-md:0 .25rem .75rem #1c213026;--shadow-lg:0 1rem 2.5rem #1c213038;--transition:.12s ease;--content-width:44rem;--board-width:min(92vw, 32rem)}html{font-size:100%}@media (width>=48rem){html{font-size:112.5%}}@media (width>=80rem){html{font-size:125%}}*,:before,:after{box-sizing:border-box}body{font-family:var(--font-sans);font-size:var(--font-size-base);line-height:var(--line-height);color:var(--color-ink);background-color:var(--color-bg);-webkit-font-smoothing:antialiased;-webkit-text-size-adjust:100%;margin:0}h1,h2,h3{margin:0 0 var(--space-4);font-weight:600;line-height:1.2}h1{font-size:var(--font-size-2xl)}h2{font-size:var(--font-size-xl)}h3{font-size:var(--font-size-lg)}p{margin:0 0 var(--space-4)}hgroup>*{margin-bottom:0}hgroup>p{color:var(--color-ink-muted);font-size:var(--font-size-sm)}a{color:var(--color-accent);text-underline-offset:.15em;text-decoration:underline}a:hover{color:var(--color-accent-hover)}small{font-size:var(--font-size-sm);color:var(--color-ink-muted)}code{font-family:var(--font-mono);background-color:var(--color-bg-muted);border-radius:var(--radius-sm);padding:.1em .35em;font-size:.9em}svg{display:block}:focus-visible{outline:2px solid var(--color-accent);outline-offset:2px}button,[role=button]{--button-ink:var(--color-accent-ink);--button-bg:var(--color-accent);--button-border:var(--color-accent);--button-ink-hover:var(--button-ink);--button-bg-hover:var(--color-accent-hover);--button-border-hover:var(--button-bg-hover);justify-content:center;align-items:center;gap:var(--space-2);padding:var(--space-2) var(--space-4);font-family:inherit;font-size:var(--font-size-base);font-weight:500;line-height:var(--line-height);color:var(--button-ink);background-color:var(--button-bg);border:1px solid var(--button-border);border-radius:var(--radius-md);cursor:pointer;transition:background-color var(--transition), border-color var(--transition), color var(--transition);text-decoration:none;display:inline-flex}button:hover,[role=button]:hover{color:var(--button-ink-hover);background-color:var(--button-bg-hover);border-color:var(--button-border-hover)}button.secondary{--button-ink:var(--color-ink);--button-bg:var(--color-bg-muted);--button-border:var(--color-bg-muted);--button-bg-hover:var(--color-border);--button-border-hover:var(--color-border)}button.secondary.outline{--button-bg:transparent;--button-border:var(--color-border-strong);--button-bg-hover:var(--color-bg-subtle);--button-border-hover:var(--color-ink-subtle)}button:disabled{opacity:.45;cursor:not-allowed}button:disabled:hover{color:var(--button-ink);background-color:var(--button-bg);border-color:var(--button-border)}label{font-size:var(--font-size-sm);color:var(--color-ink-muted);display:block}select,input[type=text]{font-family:inherit;font-size:var(--font-size-base);line-height:var(--line-height);color:var(--color-ink);background-color:var(--color-surface);border:1px solid var(--color-border-strong);border-radius:var(--radius-md);padding:var(--space-2) var(--space-3);transition:border-color var(--transition), box-shadow var(--transition)}select{appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%235b6273' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right var(--space-2) center;cursor:pointer;padding-inline-end:var(--space-8)}select:hover,input[type=text]:hover{border-color:var(--color-ink-subtle)}select:focus-visible,input[type=text]:focus-visible{border-color:var(--color-accent);outline:none;box-shadow:0 0 0 3px #1d4ed833}dialog{width:100%;max-width:100%;height:100%;max-height:100%;padding:var(--space-4);background:0 0;border:none;margin:0;overflow:hidden}dialog[open]{justify-content:center;align-items:center;display:flex}dialog::backdrop{-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);background-color:#1c213080}dialog>article{width:100%;max-width:28rem;max-height:100%;padding:var(--space-6);background-color:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);margin:0;overflow-y:auto}dialog>article>:last-child{margin-bottom:0}.container{width:100%;max-width:var(--content-width);padding-inline:var(--space-4);margin-inline:auto}header.container{padding-block:var(--space-6) var(--space-4)}.header-container{justify-content:space-between;align-items:center;gap:var(--space-4);display:flex}.header-controls{align-items:center;gap:var(--space-1);flex-shrink:0;display:flex}main.container{padding-block:var(--space-4)}footer.container{padding-block:var(--space-8);text-align:center}.new-game{align-items:end;gap:var(--space-3);width:var(--board-width);margin-inline:auto;margin-bottom:var(--space-6);flex-wrap:wrap;display:flex}.new-game select{padding-block:var(--space-1);font-size:var(--font-size-sm)}.new-game button{padding-block:var(--space-1);font-size:var(--font-size-sm);margin-inline-start:auto}@media (width<=30rem){.new-game label{align-items:flex-start;gap:var(--space-1);flex-direction:column;display:flex}}.visually-hidden{clip-path:inset(50%);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}