:root{color-scheme:light;font-family:Inter,ui-sans-serif,system-ui,sans-serif;line-height:1.5;background:#fff8fb;color:#2c1935}body{margin:0;min-block-size:100vh;background:radial-gradient(circle at top,#ffe8f2,transparent 40%),linear-gradient(180deg,#fff8fb,#fff)}button{font:inherit}.app-shell{max-inline-size:64rem;margin-inline:auto;padding:2rem 1.25rem 3rem}.app-shell--centered{min-block-size:100vh;display:grid;place-items:center}.hero{display:grid;gap:1rem;margin-block-end:1.5rem}.hero__eyebrow{font-size:.875rem;letter-spacing:.08em;text-transform:uppercase;color:#8d4d7d;margin:0}.status-card{max-inline-size:32rem;padding:2rem;border-radius:1.5rem;background:#ffffffe6;border:.0625rem solid rgb(141 77 125 / .18);box-shadow:0 1rem 3rem #7a3f701f}.status-card h1,.status-card p{margin-block:0 .75rem}.status-card--error{border-color:#b02a793d}.hero h1,.hero p{margin:0}.layout{display:grid;gap:1.5rem;align-items:start}@media(min-width:56rem){.layout{grid-template-columns:minmax(0,1.35fr) minmax(18rem,.85fr)}}.card-stage,.panel{background:#ffffffd1;border:.0625rem solid rgb(141 77 125 / .18);border-radius:1.5rem;box-shadow:0 1rem 3rem #7a3f701f}.card-stage{padding:1rem}.scratch-board{position:relative;inline-size:min(100%,32rem);aspect-ratio:1;margin-inline:auto;border-radius:1.25rem;overflow:clip;background:#fff;--reveal-accent: #b02a79;--reveal-accent-soft: #fff1f8}.grid{display:grid;grid-template-columns:repeat(5,1fr);grid-template-rows:repeat(5,1fr);inline-size:100%;block-size:100%;gap:.5rem;padding:.75rem;box-sizing:border-box}.grid__cell{display:grid;place-items:center;padding:.5rem;border-radius:1rem;text-align:center;background:linear-gradient(180deg,#fff,#fff4f9);border:.0625rem solid rgb(141 77 125 / .12);transition:background-color .18s ease,border-color .18s ease,box-shadow .18s ease,transform .18s ease}.grid__glyph{display:grid;place-items:center;inline-size:clamp(2.9rem,5.5vw,4.1rem);block-size:clamp(2.9rem,5.5vw,4.1rem);border-radius:999px;background:var(--cell-accent);color:#fff;font-size:clamp(.68rem,1.35vw,.84rem);font-weight:700;line-height:1;letter-spacing:.01em;text-shadow:0 .05rem .2rem rgb(0 0 0 / .16);filter:drop-shadow(0 .2rem .35rem rgb(122 63 112 / .14))}.grid__cell[data-label=girl]{--cell-accent: #d45a95}.grid__cell[data-label=boy]{--cell-accent: #3c7fda}@media(max-width:38rem){.grid__glyph{font-size:clamp(.56rem,2vw,.72rem)}}.scratch-board canvas{position:absolute;inset:0;inline-size:100%;block-size:100%}.scratch-layer{touch-action:none;cursor:crosshair;opacity:1;transition:opacity var(--scratch-fade-duration, .32s) ease}.scratch-layer--cleared{opacity:0;pointer-events:none}.confetti-layer{pointer-events:none}.scratch-board[data-revealed=true] .grid__cell[data-winning=true][data-highlighted=true]{background:linear-gradient(180deg,#fff 0%,var(--reveal-accent-soft) 100%);border-color:color-mix(in srgb,var(--reveal-accent) 36%,white);box-shadow:0 0 0 .2rem color-mix(in srgb,var(--reveal-accent) 16%,transparent);transform:scale(1.03)}.grid__cell--blink{animation:winning-line-blink .72s ease-out 1}@keyframes winning-line-blink{0%,to{box-shadow:0 0 0 .2rem color-mix(in srgb,var(--reveal-accent) 16%,transparent)}40%{box-shadow:0 0 0 .32rem color-mix(in srgb,var(--reveal-accent) 28%,transparent),0 0 1.4rem color-mix(in srgb,var(--reveal-accent) 24%,transparent)}}@media(prefers-reduced-motion:reduce){.scratch-layer,.grid__cell{transition:none}.grid__cell--blink{animation:none}}.panel{padding:1.25rem}.panel h2,.panel p{margin:0}.panel section{display:grid;gap:.75rem}.button{border:none;border-radius:999px;padding:.75rem 1.1rem;background:#7a3f70;color:#fff;font-weight:700}.reveal-modal{position:absolute;inset:0;display:grid;place-items:center;padding:1rem;background:#2c193538;backdrop-filter:blur(.2rem);z-index:3}.reveal-modal[hidden]{display:none}.reveal-modal__surface{inline-size:min(100%,22rem);padding:1.25rem;border-radius:1.25rem;background:#fffffff7;border:.0625rem solid rgb(141 77 125 / .16);box-shadow:0 1rem 2.5rem #2c193538;display:grid;gap:.75rem;text-align:center}.reveal-modal__eyebrow,.reveal-modal__surface h2,.reveal-modal__surface p{margin:0}.reveal-modal__eyebrow{font-size:.82rem;letter-spacing:.08em;text-transform:uppercase;color:#8d4d7d}.reveal-modal__message{color:#5d3d65}.reveal-modal__dismiss{justify-self:center;min-inline-size:10rem}.sr-only{position:absolute;inline-size:.0625rem;block-size:.0625rem;padding:0;margin:-.0625rem;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}