.board-halves{--board-accent:#ff5a36;--on-accent:#1b1726;--shape-a:var(--primary,#ff5a36);--shape-b:var(--sky,#4da8ff);--given-bg:color-mix(in srgb, var(--ink,#1b1726) 18%, var(--surface,#fff8ee));--cell-line:color-mix(in srgb, var(--ink,#1b1726) 35%, transparent)}@media (max-width:380px){.board-halves{padding-inline:2px!important}}@media (prefers-color-scheme:dark){.board-halves{--board-accent:#ff6b4a;--given-bg:color-mix(in srgb, var(--ink,#f4efe6) 22%, var(--surface,#1b1726))}}.halves-grid{gap:2px;width:max-content;max-width:100%;margin-inline:auto;display:grid;overflow-x:auto}.halves-cell{box-sizing:border-box;border:1px solid var(--cell-line);background:var(--surface,#fff8ee);width:32px;height:32px;color:var(--ink,#1b1726);appearance:none;cursor:pointer;touch-action:manipulation;border-radius:6px;place-items:center;margin:0;padding:0;display:grid}.halves-count{box-sizing:border-box;border:1px solid var(--cell-line);background:var(--surface,#fff8ee);width:100%;height:100%;min-height:28px;color:var(--ink,#1b1726);border-style:dashed;border-radius:6px;place-items:center;margin:0;padding:0;font-size:10px;line-height:1;display:grid}.halves-cell{cursor:pointer;touch-action:manipulation;place-items:center;display:grid}.halves-cell[data-given=true]{background:var(--given-bg);cursor:default}.halves-cell[data-cursor=true]{outline:2px solid var(--board-accent);outline-offset:-2px}.halves-cell[data-conflict=true]{background:repeating-linear-gradient(-45deg, var(--surface,#fff8ee), var(--surface,#fff8ee) 4px, color-mix(in srgb, var(--danger,#e54858) 35%, transparent) 4px, color-mix(in srgb, var(--danger,#e54858) 35%, transparent) 8px)}.halves-count{border-style:dashed;place-items:center;font-size:10px;line-height:1;display:grid}.halves-count[data-conflict=true]{color:var(--danger,#e54858);border-color:var(--danger,#e54858)}.halves-shape{background:var(--shape-a);width:16px;height:16px}.halves-shape[data-kind=square]{background:var(--shape-b)}.halves-shape[data-kind=circle]{border-radius:50%}@media (max-height:430px){.board-halves{gap:6px}.halves-grid{gap:4px}}
