.playground-game{--pg-canvas-bg: #111214;--pg-bubblegum-pink: #e3aeb0;--pg-text: #f5f5f7;--pg-grey: #86868b;--pg-gradient: linear-gradient(90deg, #42baf1 0%, #7d7fe5 22%, #c768c9 44%, #ed489a 66%, #ed7641 88%, #f7ae68 100%);--pg-heading-font: var(--gsc-headings-font-family, "Inter Tight", system-ui, sans-serif);--pg-body-font: var(--gsc-body-font-family, "Montserrat", system-ui, sans-serif);--pg-aspect-ratio: .5417;position:relative;isolation:isolate;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:clamp(12px,3vw,28px);background:var(--pg-canvas-bg);color:var(--pg-text);padding:clamp(16px,4vw,40px) 16px;font-family:var(--pg-body-font);text-align:center;overflow:hidden}.playground-game__intro{max-width:420px;display:flex;flex-direction:column;gap:8px}.playground-game__headline{margin:0;font-family:var(--pg-heading-font);font-weight:700;font-size:clamp(2.75rem,12vw,5rem);line-height:.92;letter-spacing:-.02em;text-transform:uppercase}.playground-game__kicker{margin:0;font-size:.8125rem;letter-spacing:.08em;text-transform:uppercase;color:var(--pg-grey)}.playground-game__stage{position:relative;width:min(92vw,calc(var(--pg-available-height, 70dvh) * var(--pg-aspect-ratio)),420px);aspect-ratio:390 / 720;border-radius:20px;overflow:hidden;background:var(--pg-canvas-bg);box-shadow:0 24px 64px #00000073}.playground-game__canvas{display:block;width:100%;height:100%;touch-action:none;outline-offset:-4px}.playground-game__sprite-source{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}.playground-game__hud{position:absolute;top:clamp(12px,3vw,20px);left:0;right:0;display:flex;align-items:baseline;justify-content:center;gap:.35em;font-family:var(--pg-heading-font);font-weight:700;font-size:clamp(2rem,8vw,2.75rem);font-variant-numeric:tabular-nums;pointer-events:none;text-shadow:0 2px 12px rgba(0,0,0,.4)}.playground-game__score-best{color:var(--pg-grey);font-size:.6em}.playground-game__score-slash{background:var(--pg-gradient);-webkit-background-clip:text;background-clip:text;color:transparent;font-weight:400}.playground-game__pause{position:absolute;top:clamp(12px,3vw,20px);right:clamp(12px,3vw,20px);width:36px;height:36px;display:flex;align-items:center;justify-content:center;border-radius:999px;border:1px solid rgba(245,245,247,.24);background:#f5f5f714;color:var(--pg-text);font-family:var(--pg-heading-font);font-size:1.1rem;cursor:pointer}.playground-game__start{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;background:transparent;border:0;color:inherit;font-family:var(--pg-body-font);cursor:pointer}.playground-game__start-prompt{margin:0;font-size:1rem;font-weight:600}.playground-game__start-hint{margin:0;font-size:.8125rem;color:var(--pg-grey)}.playground-game__start[hidden]{display:none}.playground-game__card{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;padding:24px;background:#111214eb;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}.playground-game__card[hidden]{display:none}.playground-game__card-heading{margin:0;font-family:var(--pg-heading-font);font-weight:700;font-size:clamp(1.5rem,6vw,2rem);letter-spacing:-.01em}.playground-game__card-body{margin:0 0 6px;color:var(--pg-grey);font-size:.9375rem;max-width:26em}.playground-game__card-stats{display:flex;gap:24px;margin-bottom:6px}.playground-game__stat{display:flex;flex-direction:column;align-items:center;gap:2px}.playground-game__stat-label{font-size:.6875rem;letter-spacing:.08em;text-transform:uppercase;color:var(--pg-grey)}.playground-game__stat-value{font-family:var(--pg-heading-font);font-weight:700;font-size:1.5rem;font-variant-numeric:tabular-nums}.playground-game__actions{display:flex;flex-wrap:wrap;gap:10px;justify-content:center}.playground-game__btn{-webkit-appearance:none;appearance:none;border:none;border-radius:999px;padding:12px 22px;font-family:var(--pg-body-font);font-weight:600;font-size:.9375rem;cursor:pointer;text-decoration:none;display:inline-flex;align-items:center;justify-content:center;transition:transform .15s ease,opacity .15s ease}.playground-game__btn:hover{opacity:.88}.playground-game__btn:active{transform:scale(.97)}.playground-game__btn--solid{background:var(--pg-text);color:var(--pg-canvas-bg)}.playground-game__btn--outline{background:transparent;color:var(--pg-text);border:1px solid rgba(245,245,247,.4)}.playground-game__btn[hidden]{display:none}.playground-game__win{background:linear-gradient(#111214eb,#111214eb) padding-box,var(--pg-gradient) border-box;border:1px solid transparent}.playground-game__win-reveal{display:flex;flex-direction:column;align-items:center;gap:10px;margin:6px 0}.playground-game__code-label{font-size:.6875rem;letter-spacing:.08em;text-transform:uppercase;color:var(--pg-grey)}.playground-game__code-text{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:1.375rem;font-weight:700;letter-spacing:.04em;padding:10px 18px;border-radius:12px;border:1px dashed rgba(245,245,247,.4);-webkit-user-select:all;user-select:all}.playground-game__code-missing{font-size:.9375rem;color:var(--pg-grey)}.playground-game__empty-product{font-size:.875rem;color:var(--pg-grey);margin:0}.playground-game__sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}.playground-game *:focus-visible{outline:2px solid var(--pg-text);outline-offset:3px}@media(prefers-reduced-motion:reduce){.playground-game__btn,.playground-game__win{transition:none}}@media(max-width:380px){.playground-game{padding-inline:12px}}
/*# sourceMappingURL=/cdn/shop/t/43/assets/playground-game.css.map */