.hud-button{--hud-edge:var(--panel-edge);height:calc(var(--game-unit) * 2);padding-inline:calc(var(--game-unit) * .75);border-radius:calc(var(--game-unit) * .75);box-shadow:0 calc(var(--game-unit) * .25) 0 var(--hud-edge);white-space:nowrap;font-size:.9375em;position:relative}.hud-button:active:not(:disabled,[aria-disabled=true]){transform:translateY(calc(var(--game-unit) * .1875));box-shadow:0 calc(var(--game-unit) * .0625) 0 var(--hud-edge);transition-duration:0s}.hud-icon{width:1.5rem;height:1.5rem;display:none}.hud-button--icon{width:calc(var(--game-unit) * 2);padding-inline:0}.hud-button--icon .hud-label{display:none}.hud-button--icon .hud-icon{width:1.25em;height:1.25em;display:block}@media (prefers-reduced-motion:no-preference){.hud-button--icon .hud-icon{transition:transform var(--duration-hover) ease}}.hud-button--icon:hover .hud-icon{transform:rotate(45deg)}.sudoku-game{grid-template-columns:auto minmax(0,1fr) auto;grid-template-rows:calc(var(--game-unit) * var(--hud-units,2.75)) minmax(0, 1fr);height:100%;min-height:0;color:var(--cream);font-family:var(--body);grid-template-areas:"stats variants controls""board board board";display:grid}.sudoku-game[data-dealing] .sudoku-hud__stats,.sudoku-game[data-dealing] .sudoku{visibility:hidden;opacity:0}@media (prefers-reduced-motion:no-preference){.sudoku-hud__stats,.sudoku{transition:opacity .16s}}.sudoku-hud__stats,.sudoku-hud__variants,.sudoku-hud__controls{font-size:var(--game-unit);align-self:center}.sudoku-hud__variants{grid-area:variants;justify-self:center;gap:.25em;display:flex}.sudoku-hud__variant{border-radius:calc(var(--game-unit) * .75);color:var(--cream);font-family:var(--display);white-space:nowrap;padding:.25em .75em;font-weight:600;text-decoration:none}.sudoku-hud__variant:hover{background:#0000001f}.sudoku-hud__variant[aria-current=page]{color:var(--cream);background:#00000038}.sudoku-hud__stats{margin-left:var(--game-unit);grid-area:stats;justify-self:start;gap:1.25em;display:flex}.sudoku-hud__controls{margin-right:var(--game-unit);grid-area:controls;justify-self:end;gap:.5em;display:flex}.sudoku-hud__stat{align-items:baseline;gap:.25em;display:flex}.sudoku-hud__stat-label{color:var(--cream);font-size:.875em}.sudoku-hud__stat-value{min-width:var(--reading);font-size:1.0625em;font-weight:700;display:inline-grid}.sudoku-hud__stat-value>span{grid-area:1/1}.sudoku-hud__stat-reserve{visibility:hidden}.sudoku-difficulty .setting{flex-direction:column;align-items:stretch;gap:.5em}.sudoku-difficulty .segmented{grid-template-columns:1fr 1fr;display:grid}.sudoku-difficulty .segmented span{text-align:center;padding-inline:.5em}.sudoku{width:100%;height:100%;min-height:0;padding:calc(var(--game-unit) * .5);isolation:isolate;grid-area:board;justify-content:center;align-items:center;display:flex;position:relative;overflow:hidden;container-type:size}.sudoku>*{--table-cell:min(calc(88cqh / 9), calc(88cqw / 12.5));--cell:var(--table-cell);--line:calc(var(--cell) / 48);--line-box:calc(var(--cell) / 16);--line-ink:color-mix(in srgb, var(--panel-edge) 65%, var(--ink-soft));--sudoku-entry:#2456a6}.sudoku__board{--focus-ring:var(--ink);width:calc(var(--cell) * 9);height:calc(var(--cell) * 9);border:var(--line-box) solid var(--ink-soft);border-radius:calc(var(--cell) / 6);background:var(--panel);flex:none;position:relative;overflow:hidden}.sudoku__board[data-size="9"]{--size:9}.sudoku__board[data-size="6"]{--size:6}.sudoku__grid{--cell:calc(var(--table-cell) * 9 / var(--size));grid-template-columns:repeat(var(--size), 1fr);grid-template-rows:repeat(var(--size), 1fr);width:100%;height:100%;display:grid;position:relative}.sudoku__grid:before,.sudoku__grid:after{content:"";pointer-events:none;position:absolute;inset:0}.sudoku__grid:before{background:linear-gradient(to right, transparent calc(100% / 3 - var(--line-box) / 2), var(--ink-soft) 0, var(--ink-soft) calc(100% / 3 + var(--line-box) / 2), transparent 0, transparent calc(200% / 3 - var(--line-box) / 2), var(--ink-soft) 0, var(--ink-soft) calc(200% / 3 + var(--line-box) / 2), transparent 0)}.sudoku__board[data-size="6"] .sudoku__grid:before{background:linear-gradient(to right, transparent calc(50% - var(--line-box) / 2), var(--ink-soft) 0, var(--ink-soft) calc(50% + var(--line-box) / 2), transparent 0)}.sudoku__grid:after{background:linear-gradient(to bottom, transparent calc(100% / 3 - var(--line-box) / 2), var(--ink-soft) 0, var(--ink-soft) calc(100% / 3 + var(--line-box) / 2), transparent 0, transparent calc(200% / 3 - var(--line-box) / 2), var(--ink-soft) 0, var(--ink-soft) calc(200% / 3 + var(--line-box) / 2), transparent 0)}.sudoku__cell{border:0;border-right:var(--line) solid var(--line-ink);border-bottom:var(--line) solid var(--line-ink);min-width:0;color:var(--ink);font-family:var(--display);font-size:calc(var(--cell) * .6);cursor:pointer;background:0 0;place-items:center;margin:0;padding:0;font-weight:500;line-height:1;display:grid}@media (prefers-reduced-motion:no-preference){.sudoku__cell{transition:background 80ms}}.sudoku__board[data-size="9"] .sudoku__cell:nth-child(9n),.sudoku__board[data-size="6"] .sudoku__cell:nth-child(6n){border-right:0}.sudoku__board[data-size="9"] .sudoku__cell:nth-child(n+73),.sudoku__board[data-size="6"] .sudoku__cell:nth-child(n+31){border-bottom:0}.sudoku__cell[data-given]{background:color-mix(in srgb, var(--panel-edge) 34%, transparent);cursor:default;font-weight:700}.sudoku__cell[data-peer]{background:color-mix(in srgb, var(--panel-edge) 55%, transparent)}.sudoku__cell[data-same]{background:color-mix(in srgb, var(--accent) 30%, transparent)}.sudoku__cell[data-selected]{background:color-mix(in srgb, var(--accent) 58%, transparent)}.sudoku__cell:not([data-given]) .sudoku__digit{color:var(--sudoku-entry)}.sudoku__cell[data-conflict]{background:color-mix(in srgb, var(--danger) 18%, transparent)}.sudoku__cell[data-conflict][data-selected]{background:color-mix(in srgb, var(--danger) 34%, transparent)}.sudoku__cell[data-conflict] .sudoku__digit{color:var(--danger);font-weight:700}.sudoku__cell[data-wrong]{outline:var(--line-box) solid var(--danger);outline-offset:calc(var(--line-box) * -1)}.sudoku__digit{pointer-events:none}.sudoku__notes{width:100%;height:100%;color:var(--ink-soft);font-family:var(--body);font-size:calc(var(--cell) * .26);pointer-events:none;grid-template-rows:repeat(3,1fr);grid-template-columns:repeat(3,1fr);place-items:center;font-weight:600;display:grid}.sudoku__board[data-size="6"] .sudoku__notes{grid-template-rows:repeat(2,1fr)}.sudoku__cages{pointer-events:none;width:100%;height:100%;position:absolute;inset:0}.sudoku__cage{fill:none;stroke:var(--ink-soft);stroke-width:calc(.028px * var(--size) / 9);stroke-linecap:round}.sudoku__cage-sum{fill:var(--ink);font-family:var(--body);font-size:.23px;font-weight:700}.sudoku__pad{gap:calc(var(--cell) * .125);margin-left:calc(var(--cell) * .5);flex:none;display:grid}.sudoku__digits{gap:calc(var(--cell) * .125);grid-template-columns:repeat(3,1fr);display:grid}.sudoku__digit-key{width:var(--cell);height:var(--cell);border-radius:calc(var(--cell) / 6);box-shadow:0 calc(var(--cell) * .08) 0 var(--panel-edge);font-size:calc(var(--cell) * .5);padding-inline:0}.sudoku__tools{gap:calc(var(--cell) * .125);display:grid}.sudoku__tool{justify-content:center;align-items:center;gap:calc(var(--cell) * .125);height:calc(var(--cell) * .667);padding-inline:calc(var(--cell) * .167);border-radius:calc(var(--cell) / 6);box-shadow:0 calc(var(--cell) * .08) 0 var(--panel-edge);font-size:calc(var(--cell) * .3);display:flex}.sudoku__digit-key:active:not(:disabled,[aria-disabled=true]),.sudoku__tool:active:not(:disabled,[aria-disabled=true]){transform:translateY(calc(var(--cell) * .06));box-shadow:0 calc(var(--cell) * .02) 0 var(--panel-edge);transition-duration:0s}.sudoku__tool[aria-pressed=true]{background:var(--accent);box-shadow:0 calc(var(--cell) * .08) 0 var(--accent-edge);color:var(--accent-ink)}.sudoku__tool[aria-pressed=true]:active:not(:disabled,[aria-disabled=true]){box-shadow:0 calc(var(--cell) * .02) 0 var(--accent-edge)}.sudoku__tool .sudoku-hud__icon{width:1.25em;height:1.25em;display:block}.sudoku__status{z-index:var(--layer-float);width:fit-content;padding:calc(var(--game-unit) * .375) calc(var(--game-unit) * .875);border-radius:calc(var(--game-unit) * .75);background:var(--rail);color:var(--cream);font-size:calc(var(--game-unit) * .9375);margin:0 auto;position:absolute;inset-block-end:calc(var(--game-unit) * .75);inset-inline:0}.sudoku-win{background:color-mix(in srgb, var(--table-edge) 60%, transparent)}.sudoku-win__panel{text-align:center}.sudoku-win__title{margin:0 0 .25rem}.sudoku-win__reading{color:var(--ink-soft);margin:0 0 1.25rem}.sudoku-win__reading:has(+.sudoku-win__note){margin-bottom:.25rem}.sudoku-win__note{color:var(--ink-soft);margin:0 0 1.25rem;font-size:.875rem}.sudoku-win__actions{justify-content:center;gap:.75rem;display:flex}@media (width<=40rem) and (height>=30rem){.sudoku-game{grid-template:"stats""board"minmax(0,1fr)"controls"/minmax(0,1fr)}.sudoku-hud__variants{display:none}.sudoku>*{--board:min(100cqw, calc(100cqh - 7.25rem));--table-cell:calc(var(--board) / 9);--line:.0625rem;--line-box:.125rem}.sudoku-hud__stats,.sudoku-hud__controls{flex-wrap:wrap;justify-content:center;justify-self:center;margin:0;padding-block:.5rem;font-size:1rem}.sudoku-hud__controls{flex-direction:row-reverse;justify-content:space-evenly;gap:1.5rem .5rem;width:100%;padding-block:.75rem 1.5rem;padding-inline:.5rem}.sudoku-hud__stats{font-size:min(1rem,4.2vw)}.sudoku-hud__label{color:var(--cream);font-family:var(--body);text-align:center;white-space:nowrap;pointer-events:none;font-size:.625rem;line-height:1;position:absolute;inset:calc(100% + .375rem) -1rem auto}.sudoku-hud__icon{display:block}.sudoku-hud__button--icon .sudoku-hud__icon{width:1.5rem;height:1.5rem}.sudoku-hud__button{border-radius:var(--radius-control);width:2.75rem;height:2.75rem;box-shadow:0 .25rem 0 var(--hud-edge);padding-inline:0}.sudoku-hud__button:active:not(:disabled,[aria-disabled=true]){box-shadow:0 .0625rem 0 var(--hud-edge);transform:translateY(.1875rem)}.sudoku{flex-direction:column;justify-content:center;justify-self:center;align-items:stretch;gap:.75rem;width:100%;padding:.25rem}.sudoku__board{width:var(--board);height:var(--board);border-radius:.375rem;align-self:center}.sudoku__pad{gap:.75rem;width:100%;margin-left:0}.sudoku__digits{grid-template-columns:none;grid-auto-columns:minmax(0,1fr);grid-auto-flow:column;gap:.25rem}.sudoku__digit-key{border-radius:var(--radius-control);width:auto;height:2.75rem;box-shadow:0 .25rem 0 var(--panel-edge);font-size:1.125rem}.sudoku__tools{grid-template-columns:1fr 1fr;gap:.375rem}.sudoku__tool{border-radius:var(--radius-control);height:2.75rem;box-shadow:0 .25rem 0 var(--panel-edge);font-size:1rem}.sudoku__digit-key:active:not(:disabled,[aria-disabled=true]),.sudoku__tool:active:not(:disabled,[aria-disabled=true]){box-shadow:0 .0625rem 0 var(--panel-edge);transform:translateY(.1875rem)}.sudoku__tool[aria-pressed=true]{box-shadow:0 .25rem 0 var(--accent-edge)}.sudoku__tool[aria-pressed=true]:active:not(:disabled,[aria-disabled=true]){box-shadow:0 .0625rem 0 var(--accent-edge)}.sudoku__status{border-radius:var(--radius-control);padding:.25rem .75rem;font-size:.9375rem;inset-block-end:.5rem}}