.sp-home,.sp-result-wrap,.sp-stage{gap:var(--space-4);scroll-margin-top:80px;display:grid}.sp-stage{max-width:600px;margin:0 auto;position:relative}.sp-intro{gap:var(--space-4);padding:var(--space-6);display:grid}.sp-intro-row{align-items:center;gap:var(--space-4);display:flex}.sp-intro-title{margin:0;font-size:1.3rem;font-weight:800}.sp-sub{color:var(--muted);word-break:keep-all;margin:4px 0 0;font-weight:600}.sp-note{text-align:center;color:var(--muted);word-break:keep-all;margin:0;font-size:.85rem}.sp-today{justify-content:space-between;align-items:center;gap:var(--space-3);padding:var(--space-3) var(--space-4);border-radius:var(--radius-md);background:var(--cream-50);display:flex}.sp-today p{margin:0;font-weight:700}.sp-top{align-items:center;gap:var(--space-3);display:flex}.sp-count{font-variant-numeric:tabular-nums;flex:1;font-weight:800}.sp-tier{cursor:default}.sp-tier.t2{background:var(--tiger-50);border-color:var(--tiger-500)}.sp-tier.t3{background:var(--bad-50);border-color:var(--bad-600);color:var(--bad-600)}.sp-progress{grid-template-columns:repeat(10,minmax(0,1fr));gap:4px;display:grid}.sp-progress span{border-radius:var(--radius-pill);background:var(--cream-50);height:8px}.sp-progress .is-now{background:var(--tiger-500)}.sp-progress .is-ok{background:var(--good-600)}.sp-progress .is-no{background:var(--bad-600)}.sp-ask{margin:var(--space-3) 0 0;text-align:center;color:var(--muted);font-weight:700}.sp-sentence{text-align:center;word-break:keep-all;margin:0;font-size:clamp(1.4rem,6.4vw,1.8rem);font-weight:800;line-height:1.6}.sp-blank{border-bottom:4px solid var(--tiger-500);min-width:3em;color:var(--accent);padding:0 6px;display:inline-block}.sp-blank.is-ok{border-color:var(--good-600);color:var(--good-600)}.sp-blank.is-no{border-color:var(--bad-600);color:var(--bad-600)}.sp-opts{gap:var(--space-3);grid-template-columns:1fr 1fr;display:grid}.sp-opt{min-height:84px;padding:var(--space-3);border-radius:var(--radius);border:3px solid var(--line);background:var(--bg);color:var(--fg);font:inherit;word-break:keep-all;cursor:pointer;-webkit-tap-highlight-color:transparent;border-bottom-width:6px;font-size:clamp(1.15rem,5vw,1.4rem);font-weight:800;position:relative}.sp-opt:hover:not(:disabled){border-color:var(--tiger-500)}.sp-opt:active:not(:disabled){border-bottom-width:4px;transform:translateY(2px)}.sp-opt:disabled{cursor:default;color:var(--fg)}.sp-opt.is-right{border-color:var(--good-600);background:var(--good-50)}.sp-opt.is-wrong{border-color:var(--bad-600);background:var(--bad-50)}.sp-opt.is-dim{opacity:.55}.sp-mark{font-size:1rem;position:absolute;top:6px;right:10px}.sp-opt.is-right .sp-mark{color:var(--good-600)}.sp-opt.is-wrong .sp-mark{color:var(--bad-600)}.sp-explain{gap:var(--space-2);padding:var(--space-5);border-radius:var(--radius);border:2px solid var(--good-600);background:var(--good-50);display:grid}.sp-explain.is-no{border-color:var(--bad-600);background:var(--bad-50)}.sp-explain p{word-break:keep-all;margin:0;line-height:1.6}.sp-explain-head{font-size:1.15rem;font-weight:800}.sp-explain-full{font-weight:700}.sp-src{color:var(--muted);font-size:.85rem}.sp-explain .btn{margin-top:var(--space-2)}.sp-result{padding-top:var(--space-5)}.sp-result .mascot{margin:0 auto}.sp-kicker{color:var(--muted);margin:0;font-weight:700}.sp-grade{margin:4px 0 0;font-size:1.35rem;font-weight:800}.sp-grid{margin:var(--space-3) 0 0;justify-content:center;gap:4px;display:flex}.sp-grid span{width:26px;height:26px;color:var(--bg);animation:sp-flip .42s var(--ease) both;border-radius:7px;place-items:center;font-size:.8rem;font-weight:800;display:grid}.sp-grid.is-small span{animation:none}.sp-grid.is-small{gap:3px;margin:0}.sp-grid.is-small span{border-radius:4px;width:14px;height:14px}.sp-grid .is-ok{background:var(--good-600)}.sp-grid .is-no{background:var(--bad-600)}.sp-stats{gap:var(--space-2);grid-template-columns:repeat(3,minmax(0,1fr));display:grid}.sp-stats .stat{text-align:center;padding:12px}.sp-actions{gap:var(--space-2);display:grid}.sp-actions .btn{width:100%}@media (min-width:720px){.sp-actions{grid-template-columns:1fr 1fr}}.sp-review h2{margin:var(--space-4) 0 var(--space-3);font-size:1.15rem}.sp-review ul{gap:var(--space-3);margin:0;padding:0;list-style:none;display:grid}.sp-review li{padding:var(--space-4) var(--space-5);border-radius:var(--radius);border:2px solid var(--line);background:var(--bg)}.sp-review li p{word-break:keep-all;margin:0 0 4px;line-height:1.6}.sp-review-s{font-weight:800}.sp-review-pick s{color:var(--bad-600)}.sp-review-pick b{color:var(--good-600)}.sp-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%)}.sp-hero{align-items:center;gap:var(--space-4);display:flex}.sp-hero-text{min-width:0}.sp-date{border-radius:var(--radius-pill);background:var(--tiger-500);color:var(--bear-900);margin:0 0 4px;padding:2px 10px;font-size:.85rem;font-weight:800;display:inline-block}.sp-intro-title{letter-spacing:-.02em;font-size:clamp(1.35rem,6vw,1.7rem)!important}.sp-teaser{flex-wrap:wrap;gap:6px;margin:0;padding:0;list-style:none;display:flex}.sp-teaser li{border-radius:var(--radius-pill);border:2px dashed var(--line);background:var(--cream-50);animation:rise .3s var(--ease) both;padding:6px 12px;font-size:.9rem;font-weight:700}.sp-teaser li:nth-child(odd){rotate:-2deg}.sp-teaser li:nth-child(2n){rotate:1.5deg}.sp-go{font-size:1.15rem}.sp-combo{border-radius:var(--radius-pill);background:var(--tiger-500);color:var(--bear-900);animation:pop .3s var(--ease) both;padding:4px 10px;font-weight:800}.sp-result{animation:rise .3s var(--ease) both, sp-thud .32s ease-out 1.2s both;position:relative;overflow:hidden}.sp-result-row{justify-content:center;align-items:center;gap:var(--space-3);margin-top:var(--space-2);display:flex}.sp-scorebox{justify-items:start;gap:6px;display:grid}.sp-scorebox .big-number{margin:0}.sp-stamp{border:3px solid var(--bad-600);color:var(--bad-600);border-radius:10px;margin:0;padding:6px 12px;font-size:1.05rem;font-weight:800;animation:.42s cubic-bezier(.2,1.4,.4,1) 1.05s both sp-stamp;transform:rotate(-6deg)}@keyframes sp-stamp{0%{opacity:0;transform:rotate(-6deg)scale(2.2)}70%{opacity:1;transform:rotate(-6deg)scale(.94)}to{transform:rotate(-6deg)scale(1)}}@keyframes sp-flip{0%{opacity:0;transform:rotateX(90deg)}to{opacity:1;transform:none}}@keyframes sp-bounce{0%{transform:scale(1)}40%{transform:scale(1.06)}to{transform:scale(1)}}.sp-in{animation:.38s cubic-bezier(.2,.9,.3,1) both sp-slide-in}.sp-opt-in{animation:.36s cubic-bezier(.2,1.2,.4,1) both sp-rise-pop}@keyframes sp-slide-in{0%{opacity:0;transform:translate(28px)}to{opacity:1;transform:none}}@keyframes sp-rise-pop{0%{opacity:0;transform:translateY(14px)scale(.96)}to{opacity:1;transform:none}}.sp-blank{position:relative}.sp-blank.is-wait{color:var(--tiger-600);animation:1.4s ease-in-out infinite sp-breathe}.sp-blank.is-ok,.sp-blank.is-no{animation:.46s cubic-bezier(.2,1.5,.4,1) both sp-drop}.sp-blank.is-no{text-decoration:none}@keyframes sp-breathe{0%,to{opacity:1;border-bottom-color:var(--tiger-500)}50%{opacity:.45;border-bottom-color:var(--line)}}@keyframes sp-drop{0%{opacity:0;transform:translateY(-18px)scale(.8)}60%{opacity:1;transform:translateY(3px)scale(1.06)}to{transform:none}}.sp-opt.is-right{animation:sp-bounce .42s var(--ease) both}.sp-opt.is-right:after{content:"";border-radius:inherit;border:3px solid var(--good-600);pointer-events:none;animation:.6s ease-out both sp-ripple;position:absolute;inset:-3px}@keyframes sp-ripple{0%{opacity:.9;transform:scale(1)}to{opacity:0;transform:scale(1.18)}}.sp-plus{color:var(--good-600);pointer-events:none;font-size:1.1rem;font-weight:800;animation:.9s ease-out both sp-float-up;position:absolute;top:-6px;left:50%}@keyframes sp-float-up{0%{opacity:0;transform:translate(-50%,6px)scale(.6)}25%{opacity:1;transform:translate(-50%,-8px)scale(1.15)}to{opacity:0;transform:translate(-50%,-38px)scale(1)}}.sp-opt.is-wrong{animation:.3s 2 shake,.5s ease-out both sp-flash}@keyframes sp-flash{0%{box-shadow:0 0 0 0 var(--bad-600)}to{box-shadow:0 0 0 12px #0000}}.sp-flame{transform-origin:50% 90%;animation:.9s ease-in-out infinite sp-flicker;display:inline-block}@keyframes sp-flicker{0%,to{transform:rotate(-6deg)scale(1)}50%{transform:rotate(6deg)scale(1.15)}}.sp-progress span{transform-origin:0}.sp-progress .is-ok,.sp-progress .is-no{animation:sp-fill .35s var(--ease) both}.sp-progress .is-now{animation:1.2s ease-in-out infinite sp-breathe-bar}@keyframes sp-fill{0%{transform:scaleX(.2)}to{transform:none}}@keyframes sp-breathe-bar{0%,to{opacity:1}50%{opacity:.5}}.sp-unfold{animation:.42s cubic-bezier(.2,.9,.3,1) both sp-unfold}@keyframes sp-unfold{0%{clip-path:inset(0 0 100% round 24px);transform:translateY(-6px)}to{clip-path:inset(0 round 24px);transform:none}}@keyframes sp-thud{0%,to{transform:none}30%{transform:translateY(3px)scale(.995)}60%{transform:translateY(-1px)}}.sp-late{animation:.4s cubic-bezier(.2,1.1,.4,1) both sp-rise-pop}.sp-teaser li{animation:rise .3s var(--ease) both, sp-float 3.2s ease-in-out .4s infinite}.sp-teaser li:nth-child(2){animation-delay:80ms,.9s}.sp-teaser li:nth-child(3){animation-delay:.16s,1.4s}.sp-teaser li:nth-child(4){animation-delay:.24s,.6s}.sp-teaser li:nth-child(5){animation-delay:.32s,1.8s}@keyframes sp-float{0%,to{translate:0}50%{translate:0 -4px}}.sp-shine{position:relative;overflow:hidden}.sp-shine:after{content:"";pointer-events:none;background:linear-gradient(100deg,#0000,#ffffff8c,#0000);width:30%;animation:3.6s ease-in-out 1.2s infinite sp-shine;position:absolute;top:0;bottom:0;left:-40%;transform:skew(-20deg)}@keyframes sp-shine{0%,70%{left:-40%}to{left:130%}}
