:root{--haiti:#0d102e;--silver:#ccc;--white:#fff;--color-primary:var(--haiti);--color-secondary:var(--white);--color-muted:var(--silver);--font-family-heading:"Single Day", cursive;--step--2:clamp(1.1285rem, .9356rem + .8573vw, 1.6rem);--step--1:clamp(1.3542rem, 1.09rem + 1.1742vw, 2rem);--step-0:clamp(1.625rem, 1.267rem + 1.5909vw, 2.5rem);--step-1:clamp(1.95rem, 1.4693rem + 2.1364vw, 3.125rem);--step-2:clamp(2.34rem, 1.6993rem + 2.8477vw, 3.9063rem);--step-3:clamp(2.808rem, 1.9592rem + 3.7724vw, 4.8828rem);--step-4:clamp(3.3696rem, 2.2512rem + 4.9708vw, 6.1035rem);--step-5:clamp(4.0435rem, 2.5766rem + 6.5198vw, 7.6294rem);--step-6:clamp(4.8522rem, 2.9358rem + 8.5173vw, 9.5367rem);--space-4xs:clamp(.1875rem, .1364rem + .2273vw, .3125rem);--space-3xs:clamp(.4375rem, .3608rem + .3409vw, .625rem);--space-2xs:clamp(.8125rem, .6335rem + .7955vw, 1.25rem);--space-xs:clamp(1.25rem, .9943rem + 1.1364vw, 1.875rem);--space-s:clamp(1.625rem, 1.267rem + 1.5909vw, 2.5rem);--space-m:clamp(2.4375rem, 1.9006rem + 2.3864vw, 3.75rem);--space-l:clamp(3.25rem, 2.5341rem + 3.1818vw, 5rem);--space-xl:clamp(4.875rem, 3.8011rem + 4.7727vw, 7.5rem);--space-2xl:clamp(6.5rem, 5.0682rem + 6.3636vw, 10rem);--space-3xl:clamp(9.75rem, 7.6023rem + 9.5455vw, 15rem);--space-4xs-3xs:clamp(.1875rem, .0085rem + .7955vw, .625rem);--space-3xs-2xs:clamp(.4375rem, .1051rem + 1.4773vw, 1.25rem);--space-2xs-xs:clamp(.8125rem, .3778rem + 1.9318vw, 1.875rem);--space-xs-s:clamp(1.25rem, .7386rem + 2.2727vw, 2.5rem);--space-s-m:clamp(1.625rem, .7557rem + 3.8636vw, 3.75rem);--space-m-l:clamp(2.4375rem, 1.3892rem + 4.6591vw, 5rem);--space-l-xl:clamp(3.25rem, 1.5114rem + 7.7273vw, 7.5rem);--space-xl-2xl:clamp(4.875rem, 2.7784rem + 9.3182vw, 10rem);--space-2xl-3xl:clamp(6.5rem, 3.0227rem + 15.4545vw, 15rem);--space-s-l:clamp(1.625rem, .2443rem + 6.1364vw, 5rem)}*{box-sizing:border-box;margin:0;padding:0}body{--flow-space:var(--space-s);color:var(--color-primary);font-family:Schoolbell,cursive;font-size:var(--step-0);height:100dvh;padding:var(--space-3xs);text-align:center;place-items:center;display:grid}button,input,textarea{color:inherit;font:inherit;letter-spacing:inherit;word-spacing:inherit}button{cursor:pointer}.flow>*+*{margin-block-start:var(--flow-space,1em)}.heading{font-family:var(--font-family-heading);font-size:var(--step-3)}.btn{--raise-amount:2px;--shadow-height:.1em;--shadow-width:calc(var(--shadow-height) / 2);border:.075em solid var(--color-primary);-webkit-box-shadow:var(--shadow-width) var(--shadow-height) var(--color-primary);box-shadow:var(--shadow-width) var(--shadow-height) var(--color-primary);font-family:var(--font-family-heading);font-size:var(--step-0);text-wrap:nowrap;background-color:#0000;border-radius:.375em;outline:none;padding:.15em 1.5em;display:inline-block}.btn:focus-visible{-webkit-box-shadow:var(--shadow-width) calc(var(--shadow-height) + var(--raise-amount)) var(--color-primary);box-shadow:var(--shadow-width) calc(var(--shadow-height) + var(--raise-amount)) var(--color-primary);-webkit-transform:translateY(calc(var(--raise-amount) * -1));-ms-transform:translateY(calc(var(--raise-amount) * -1));transform:translateY(calc(var(--raise-amount) * -1))}.btn:active{-webkit-box-shadow:none;box-shadow:none;-webkit-transform:translateY(var(--shadow-height));-ms-transform:translateY(var(--shadow-height));transform:translateY(var(--shadow-height))}.btn-wrapper{display:-ms-grid;align-items:center;gap:var(--space-3xs);grid-auto-columns:1fr;justify-content:center;width:fit-content;margin-inline:auto;display:grid}@media (width>=768px){.btn-wrapper{grid-auto-flow:column;width:fit-content}}.input{text-align:center;border:none;outline:none;margin-inline:auto;display:block}.number-input{--flow-space:.05em;font-size:var(--step-6);align-items:center;width:fit-content;margin-inline:auto;display:flex}.number-input input{font-family:Staatliches,sans-serif;font-size:inherit;pointer-events:none;-moz-appearance:textfield;border:none;outline:none}.number-input input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.number-input button{color:var(--color-muted);background:0 0;border:none;outline:none;line-height:0;display:block}.number-input button:focus,.number-input button:hover{color:color-mix(in oklch, var(--color-muted) 85%, black)}.number-input button svg{aspect-ratio:1;width:.25em}.text-input{border-bottom:.075em solid var(--color-primary);font-family:Caveat Brush,cursive;font-size:var(--step-1);margin-bottom:var(--space-m);width:min(600px,100%)}.game-layout{align-items:center;gap:var(--flow-space);flex-direction:column;justify-content:center;display:flex}@media (width>=768px){.game-layout{gap:var(--space-m);flex-direction:row}}.score-display h2{font-size:var(--step-1)}.score-row{justify-content:space-between;align-items:center;gap:1em;display:flex}.status-desktop{display:none}@media (width>=768px){.status-desktop{display:block}.status-mobile{display:none}}.board{font-family:Gamja Flower,cursive;font-size:var(--step-4);flex-direction:column;align-items:center;width:fit-content;display:inline-flex}.board--4{font-size:var(--step-3)}.board--5{font-size:var(--step-2)}.row{display:flex}.square{aspect-ratio:1;border:none;border-color:var(--color-primary);font-family:inherit;font-size:inherit;background-color:#0000;border-width:.05em;outline:none;width:1.25em;line-height:1;display:inline-block}.square:focus-visible{background-color:var(--square-highlight)}
