._demo_tvdvu_9{display:grid;gap:var(--mantine-spacing-lg);align-items:start}@container (min-width: 40em){._demo_tvdvu_9{grid-template-columns:auto minmax(0,1fr)}}._grid_tvdvu_21{display:grid;gap:1px;background:var(--mantine-color-fleece-3)}[data-mantine-color-scheme=dark] ._grid_tvdvu_21{background:var(--mantine-color-dark-4)}._grid_tvdvu_21{border:1px solid var(--mantine-color-fleece-3)}[data-mantine-color-scheme=dark] ._grid_tvdvu_21{border:1px solid var(--mantine-color-dark-4)}._grid_tvdvu_21{border-radius:2px;width:fit-content;-webkit-user-select:none;user-select:none;touch-action:none}._cell_tvdvu_37{width:18px;height:18px;padding:0;border:0;cursor:crosshair}._cell_tvdvu_37:focus-visible{outline:2px solid var(--mantine-color-heather-filled);outline-offset:-2px}._cell_tvdvu_37[data-reading]{box-shadow:inset 0 0 0 1px var(--mantine-color-heather-filled)}._readout_tvdvu_55{min-width:0}._swatches_tvdvu_59{display:flex;gap:var(--mantine-spacing-xs);align-items:center;margin-bottom:var(--mantine-spacing-md)}._swatch_tvdvu_59{width:30px;height:30px;border-radius:2px;border:1px solid var(--mantine-color-fleece-4)}[data-mantine-color-scheme=dark] ._swatch_tvdvu_59{border:1px solid var(--mantine-color-dark-3)}._swatch_tvdvu_59{cursor:pointer;padding:0}._swatch_tvdvu_59[data-active]{box-shadow:0 0 0 2px var(--mantine-color-heather-filled)}._written_tvdvu_80{font-family:var(--mantine-font-family-monospace);font-size:var(--mantine-font-size-sm);line-height:1.7;padding:var(--mantine-spacing-md);border:1px solid var(--mantine-color-fleece-3)}[data-mantine-color-scheme=dark] ._written_tvdvu_80{border:1px solid var(--mantine-color-dark-4)}._written_tvdvu_80{border-radius:2px;background:#fff}[data-mantine-color-scheme=dark] ._written_tvdvu_80{background:var(--mantine-color-dark-7)}._written_tvdvu_80{color:var(--mantine-color-fleece-8)}[data-mantine-color-scheme=dark] ._written_tvdvu_80{color:var(--mantine-color-dark-1)}._written_tvdvu_80{min-height:7.5rem}._writtenRow_tvdvu_93{display:block}._writtenRow_tvdvu_93[data-reading]{color:var(--mantine-color-fleece-9)}[data-mantine-color-scheme=dark] ._writtenRow_tvdvu_93[data-reading]{color:var(--mantine-color-dark-0)}._writtenRow_tvdvu_93[data-reading]{font-weight:600}._hint_tvdvu_102{font-size:var(--mantine-font-size-xs);color:var(--mantine-color-dimmed);margin:var(--mantine-spacing-xs) 0 0}