.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)}.score-sheet,.end-overlay{padding:var(--game-unit);background:color-mix(in srgb, var(--table-edge) 60%, transparent);font-size:max(1rem, calc(var(--game-unit) * .8))}.score-sheet{z-index:var(--layer-overlay);grid-template:minmax(0,1fr)/minmax(0,1fr);place-items:center;display:grid;position:absolute;inset:0}.score-sheet__panel,.end-overlay__panel{max-width:min(36em,100%);max-height:100%;color:var(--ink);text-align:center;border-radius:1.125em;flex-direction:column;padding:1.75em;display:flex}.score-sheet__title,.end-overlay__title{margin:0 0 1em;font-size:1.5em}.score-sheet__scroll{scrollbar-width:thin;scrollbar-color:var(--panel-edge) transparent;min-height:0;overflow:auto}.score-sheet__actions,.end-overlay__actions{justify-content:center;gap:.75em;margin-top:1.25em;display:flex}:is(.score-sheet__actions,.end-overlay__actions) .button{border-radius:.7em;height:max(2.75rem,2.6em);padding-inline:1.4em;font-size:1.0625em}.spades-hud__stats,.spades-hud__modes,.spades-hud__controls{font-size:var(--game-unit);align-self:center}.spades-hud__stats{margin-left:var(--game-unit);grid-area:stats;justify-self:start;gap:1.25em;display:flex}.spades-hud__controls{margin-right:var(--game-unit);grid-area:controls;justify-self:end;gap:.5em;display:flex}.spades-hud__modes{grid-area:modes;justify-self:center;gap:.25em;display:flex}.spades-hud__mode{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}.spades-hud__mode:hover{background:#0000001f}.spades-hud__mode[aria-current=page]{color:var(--cream);background:#00000038}.spades{--hand-step:.46;--hand-card:min(calc(var(--game-unit) * 6.2), calc((100cqw - var(--game-unit) * 2) / (1 + 12 * var(--hand-step))))}.spades-bid{grid-template-columns:repeat(7, calc(var(--game-unit) * 2.6));gap:calc(var(--game-unit) * .4);padding:calc(var(--game-unit) * .6);border-radius:calc(var(--game-unit) * .75);z-index:1;background:#00000038;justify-self:unsafe center;display:grid}.spades-bid--blind{grid-template-columns:auto;justify-items:stretch}.spades-bid__trick{height:calc(var(--game-unit) * 2.6);border-radius:calc(var(--game-unit) * .5);background:var(--panel);box-shadow:0 calc(var(--game-unit) * .2) 0 var(--panel-edge);color:var(--ink);font:inherit;font-variant-numeric:tabular-nums;cursor:pointer;border:0;padding:0;font-weight:700}.spades-bid__trick[data-nil]{font-size:.8em}.spades-bid__trick:hover{background:var(--accent);box-shadow:0 calc(var(--game-unit) * .2) 0 var(--accent-edge);color:var(--accent-ink)}.spades-bid__trick:active{transform:translateY(calc(var(--game-unit) * .15));box-shadow:0 calc(var(--game-unit) * .05) 0 var(--panel-edge)}.spades-bid__trick:focus-visible,.spades-bid__choice:focus-visible{outline:.1875rem solid var(--cream);outline-offset:.125rem}.spades-bid__choice{height:calc(var(--game-unit) * 2.4);padding-inline:var(--game-unit);border-radius:calc(var(--game-unit) * .75);white-space:nowrap;font-size:.9375em}.spades-action{width:calc(var(--card-width) * 3.1);height:calc(var(--card-height) * 2.05);pointer-events:none;position:relative}.spades-action>.spades-action__give{bottom:calc(var(--game-unit) * 2.9);pointer-events:auto;position:absolute;left:50%;translate:-50% 50%}.spades-action__give{--give-edge:var(--accent-edge);height:calc(var(--game-unit) * 2);padding-inline:var(--game-unit);border-radius:calc(var(--game-unit) * .75);box-shadow:0 calc(var(--game-unit) * .25) 0 var(--give-edge);white-space:nowrap;font-size:.9375em}.spades-down__card{--card-width:var(--hand-card);display:block}.spades-sheet__scroll{flex-wrap:wrap;justify-content:center;gap:1em 1.5em;display:flex}.spades-scores{flex:15em}.spades-scores__nil{color:var(--ink-soft);white-space:nowrap;font-size:.875em;display:block}.spades-scores__nil[data-made]{color:var(--ink)}@media (width<=48rem) and (height>=24rem){.spades-hud__modes{margin-top:-.25rem;padding-bottom:.125rem;font-size:.9375rem;line-height:1.25}.spades-hud__mode{padding-block:.1875em}.spades-hud__stats,.spades-hud__controls{flex-wrap:wrap;justify-content:center;justify-self:center;margin:0;padding-block:.5rem;font-size:1rem}.spades-hud__controls{justify-content:space-evenly;gap:1.5rem .5rem;width:100%;padding-block:.5rem 1.5rem;padding-inline:.5rem}.spades{--hand-step:.3;--hand-card:min(calc(var(--game-unit) * 8), calc((100cqw - 1rem) / (1 + 12 * var(--hand-step))))}.spades-hud__stats{gap:.75em;font-size:.875rem}.spades-bid{grid-template-columns:repeat(5,2.5rem);gap:.375rem;padding:.5rem}.spades-bid--blind{grid-template-columns:auto}.spades-bid__trick{height:2.75rem;font-size:1rem}.spades-bid__trick[data-nil]{font-size:.8125rem}.spades-bid__choice,.spades-action__give{border-radius:var(--radius-control);height:2.75rem;padding-inline:1.25rem;font-size:1rem}.spades-action__give{box-shadow:0 .25rem 0 var(--give-edge)}.spades-scores{font-size:.875em}.spades-scores th,.spades-scores td{padding:.25em .375em}}