.sd-home,.sd-play,.sd-result-wrap{gap:var(--space-4);scroll-margin-top:80px;display:grid}.sd-play{max-width:480px;margin:0 auto}.sd-title{letter-spacing:-.02em;word-break:keep-all;margin:0;font-size:clamp(1.3rem,6vw,1.65rem);font-weight:800}.sd-sub{color:var(--muted);margin:4px 0 0;font-weight:600}.sd-kicker{color:var(--muted);margin:0;font-weight:700}.sd-note{text-align:center;color:var(--muted);margin:0;font-size:.85rem}.sd-svg{touch-action:none;-webkit-user-select:none;user-select:none;width:100%;height:auto;display:block}.sd-bg{fill:color-mix(in oklab, var(--good-600) 18%, var(--bg))}.sd-road-edge{fill:none;stroke:color-mix(in oklab, var(--bear-600) 45%, var(--bg));stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:1;animation:.9s ease-out both sd-draw}.sd-road{fill:none;stroke:var(--cream-50);stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:1;transition:stroke .15s;animation:.9s ease-out both sd-draw}.sd-road.is-flash{stroke:color-mix(in oklab, var(--bad-600) 22%, var(--bg))}@keyframes sd-draw{0%{stroke-dashoffset:1px}to{stroke-dashoffset:0}}.sd-done{fill:none;stroke:color-mix(in oklab, var(--tiger-500) 35%, transparent);stroke-linecap:round;stroke-linejoin:round}.sd-center{fill:none;stroke:var(--muzzle-300);stroke-width:1.5px;stroke-dasharray:4 6}.sd-start{fill:var(--good-600);transform-box:fill-box;transform-origin:50%;animation:1.2s ease-in-out infinite sd-pulse}@keyframes sd-pulse{50%{transform:scale(1.12)}}.sd-start-t{fill:var(--bg);pointer-events:none;font-size:11px;font-weight:800}.sd-flag{font-size:22px}.sd-trail{fill:none;stroke-width:3.5px;stroke-linecap:round;stroke-linejoin:round}.sd-trail.is-in{stroke:var(--good-600)}.sd-trail.is-out{stroke:var(--bad-600)}.sd-resume{fill:none;stroke:var(--tiger-600);stroke-width:3px;stroke-dasharray:4 3;transform-box:fill-box;transform-origin:50%;animation:.9s ease-in-out infinite sd-pulse}.sd-hero{gap:var(--space-4);padding:var(--space-6);display:grid}.sd-hero-art{justify-self:center;width:100%;max-width:300px;position:relative}.sd-hero-art svg{width:100%;height:auto;display:block}.sd-hero-dot{fill:var(--tiger-500);stroke:var(--bear-900);stroke-width:2px}.sd-hero-bear{position:absolute;bottom:-6%;right:-8%}.sd-steps{grid-template-columns:repeat(3,1fr);gap:6px;margin:0;padding:0;list-style:none;display:grid}.sd-steps li{border-radius:var(--radius-pill);background:var(--cream-50);color:var(--muted);justify-content:center;gap:6px;padding:6px;font-size:.85rem;font-weight:800;display:flex}.sd-steps .is-now{background:var(--tiger-500);color:var(--bear-900)}.sd-steps .is-done{background:var(--good-50);color:var(--good-600)}.sd-round{gap:var(--space-3);animation:rise .3s var(--ease) both;display:grid}.sd-top{justify-content:space-between;font-weight:800;display:flex}.sd-outs{color:var(--bad-600)}.sd-progress{border-radius:var(--radius-pill);background:var(--cream-50);height:8px;overflow:hidden}.sd-progress span{background:var(--tiger-500);height:100%;transition:width .15s linear;display:block}.sd-stage{box-shadow:var(--shadow-float);border-radius:20px;transition:box-shadow .15s;position:relative;overflow:hidden}.sd-stage.is-out{box-shadow:0 0 0 4px var(--bad-600);animation:.25s shake}.sd-stage.is-done{box-shadow:0 0 0 4px var(--good-600)}.sd-hint{border-radius:var(--radius-pill);background:var(--bear-900);color:var(--bg);white-space:nowrap;animation:pop .3s var(--ease) both;padding:4px 12px;font-size:.85rem;font-weight:700;position:absolute;top:10px;left:50%;transform:translate(-50%)}.sd-result{position:relative;overflow:hidden}.sd-result>:not(.confetti){z-index:2;position:relative}.sd-result .mascot{margin:0 auto}.sd-stamp{margin:var(--space-2) 0 0;border:3px solid var(--bad-600);color:var(--bad-600);border-radius:10px;padding:4px 14px;font-size:1.15rem;font-weight:800;animation:.42s cubic-bezier(.2,1.4,.4,1) 1s both sd-stamp;display:inline-block;transform:rotate(-5deg)}@keyframes sd-stamp{0%{opacity:0;transform:rotate(-5deg)scale(2.2)}70%{opacity:1;transform:rotate(-5deg)scale(.94)}to{transform:rotate(-5deg)scale(1)}}.sd-pill{margin:var(--space-3) 0 0;border-radius:var(--radius-pill);background:var(--bear-900);color:var(--bg);padding:8px 14px;font-weight:700;animation:.4s cubic-bezier(.2,1.3,.4,1) 1.25s both sd-late;display:inline-block}.sd-cards{gap:var(--space-2);grid-template-columns:repeat(3,1fr);display:grid}.sd-card{text-align:center;gap:4px;margin:0;display:grid}.sd-card svg{border-radius:14px;width:100%;height:auto}.sd-card figcaption{font-size:.85rem;font-weight:700;display:grid}.sd-card small{color:var(--muted);font-size:.75rem}.sd-late{animation:.4s cubic-bezier(.2,1.1,.4,1) both sd-late}@keyframes sd-late{0%{opacity:0;transform:translateY(14px)scale(.97)}to{opacity:1;transform:none}}.sd-actions{gap:var(--space-2);display:grid}.sd-actions .btn{width:100%}@media (min-width:720px){.sd-actions{grid-template-columns:1fr 1fr}.sd-actions .btn:first-child{grid-column:1/-1}}.sd-shine{position:relative;overflow:hidden}.sd-shine:after{content:"";pointer-events:none;background:linear-gradient(100deg,#0000,#ffffff8c,#0000);width:30%;animation:3.6s ease-in-out 1.2s infinite sd-shine;position:absolute;top:0;bottom:0;left:-40%;transform:skew(-20deg)}@keyframes sd-shine{0%,70%{left:-40%}to{left:130%}}.sd-toast{left:50%;bottom:max(24px, env(safe-area-inset-bottom));z-index:110;border-radius:var(--radius-md);background:var(--bear-900);max-width:calc(100% - 32px);color:var(--bg);box-shadow:var(--shadow-float);animation:rise .2s var(--ease) both;padding:12px 18px;font-weight:700;position:fixed;transform:translate(-50%)}