.sudoku-layout{--sudoku-keypad-height:42px;--sudoku-gap:8px;display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:auto minmax(0,1fr);grid-gap:var(--sudoku-gap);gap:var(--sudoku-gap);width:100%;height:100%;min-width:0;min-height:0}.sudoku-toolbar{width:100%}.sudoku-play-area{--sudoku-side:min(100cqw,calc(100cqh - var(--sudoku-keypad-height) - var(--sudoku-gap)),760px);container-type:size;width:100%;height:100%;min-width:0;min-height:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--sudoku-gap)}.sudoku-board{--sudoku-base:#243f36;--sudoku-ink:#eee9d7;--sudoku-entry:#a7d9f1;--sudoku-line:#557368;--sudoku-border:#a7b6a5;--sudoku-peer:#34574a;--sudoku-selected:#bd9a52;--sudoku-same:#4f7f86;display:grid;grid-template-columns:repeat(9,minmax(0,1fr));grid-template-rows:repeat(9,minmax(0,1fr));width:var(--sudoku-side);height:var(--sudoku-side);border:3px solid var(--sudoku-border);border-radius:5px;overflow:hidden;background:var(--sudoku-base);box-shadow:0 5px 12px #0004}.sudoku-cell{display:grid;place-items:center;min-width:0;min-height:0;padding:0;background:var(--sudoku-base);color:var(--sudoku-entry);border:0;border-right:1px solid var(--sudoku-line);border-bottom:1px solid var(--sudoku-line);font-family:inherit;font-size:clamp(15px,calc(var(--sudoku-side)*.06),44px);line-height:1;font-weight:500;cursor:pointer;-webkit-tap-highlight-color:transparent;transition:background-color .11s ease}.sudoku-cell:nth-child(9n){border-right:0}.sudoku-cell:nth-last-child(-n+9){border-bottom:0}.sudoku-cell[data-given]{color:var(--sudoku-ink);font-weight:750}.sudoku-cell[data-peer]{background:var(--sudoku-peer)}.sudoku-cell[data-matching]{background:var(--sudoku-same)}.sudoku-cell[data-selected]{background:var(--sudoku-selected);color:#27382f;box-shadow:inset 0 0 0 2px #9e722a}.sudoku-cell[data-error]{color:#ff9290;-webkit-text-decoration:underline wavy;text-decoration:underline wavy;text-decoration-thickness:1px;text-underline-offset:3px}.sudoku-cell[data-error][data-selected]{color:#9b1f30}.sudoku-cell[data-box-right]{border-right:3px solid var(--sudoku-border)}.sudoku-cell[data-box-bottom]{border-bottom:3px solid var(--sudoku-border)}.sudoku-cell:focus-visible{outline:2px solid #b67a24;outline-offset:-3px}.sudoku-notes{display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(3,1fr);width:90%;height:90%;padding:1px;line-height:1}.sudoku-notes small{display:grid;place-items:center;font-size:clamp(7px,calc(var(--sudoku-side)*.02),16px);font-weight:500;color:var(--sudoku-ink);text-decoration:none}.sudoku-keypad{flex:none;width:100%;max-width:760px;height:var(--sudoku-keypad-height);display:grid;grid-template-columns:repeat(9,minmax(0,1fr));grid-gap:5px;gap:5px}.solo-game .sudoku-keypad .solo-button{padding:0;min-width:0;min-height:34px;font-size:clamp(16px,calc(var(--sudoku-side)*.035),26px)}.sudoku-keypad[data-notes] .solo-button{font-size:15px;color:#d9c994}.solo-game .sudoku-keypad .solo-button{position:relative}.sudoku-left{position:absolute;top:3px;right:5px;font-size:10px;font-weight:700;line-height:1;color:#b8c4d0;font-feature-settings:"tnum";font-variant-numeric:tabular-nums}.solo-game .sudoku-keypad .solo-button[data-done]{opacity:.28}.sudoku-short{display:none}@media (max-width:600px) and (pointer:coarse){.sudoku-long{display:none}.sudoku-short{display:inline}.solo-game .sudoku-toolbar{flex-wrap:nowrap;gap:4px}.solo-game .sudoku-toolbar .solo-button{flex:1 1 auto;padding-inline:4px}.sudoku-left{top:2px;right:3px;font-size:9px}}.puzzle-levels{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-gap:8px;gap:8px;margin:12px 0;width:100%}html .puzzle-levels .solo-button[aria-pressed=true],html .sudoku-toggle[aria-pressed=true]{background:linear-gradient(145deg,#51422d,#382f24);border-color:#cba86c;color:#ffe1ad;box-shadow:inset 0 0 0 1px #cba86c}.solo-dialog[data-solo=sudoku][data-panel=ranking]{height:min(650px,calc(100dvh - 32px));overflow:auto}html .solo-dialog[data-solo=sudoku] .solo-ranking{min-height:100px}@media (orientation:landscape) and (max-height:600px) and (pointer:coarse){.sudoku-layout{--sudoku-gap:7px}.solo-game .sudoku-keypad .solo-button{font-size:22px}}@media (max-width:600px) and (pointer:coarse){.sudoku-keypad{gap:3px}.solo-game .sudoku-keypad .solo-button{border-radius:6px}}@media(prefers-reduced-motion:reduce){.sudoku-cell{transition:none}}