.challenge{--challenge:#e0245e;--challenge-deep:#2b1442;--challenge-ink:#fff4f8;border-radius:var(--radius-xl);background:var(--challenge-deep);color:var(--challenge-ink);grid-template-columns:minmax(0,1fr);gap:28px;padding:28px 20px;display:grid;overflow:hidden}.challenge-copy{justify-items:start;gap:14px;display:grid}.challenge-eyebrow{border-radius:var(--radius-full);background:var(--challenge);color:#fff;align-items:center;gap:6px;padding:6px 12px 6px 8px;font-size:13px;font-weight:800;display:inline-flex}.challenge h2{font-size:30px}.challenge-copy p{color:color-mix(in srgb, var(--challenge-ink) 78%, transparent);font-size:16px}.challenge-stage{grid-template-columns:minmax(0,1fr);gap:12px;display:grid}.challenge-round,.challenge-result{border-radius:var(--radius-lg);background:#ffffff14;border:1px solid #ffffff24;gap:14px;padding:16px;display:grid}.challenge-round-head{text-transform:uppercase;letter-spacing:.04em;justify-content:space-between;align-items:center;font-size:13px;font-weight:800;display:flex}.challenge-timer-track,.challenge-timer-fill{fill:none;stroke-width:5px}.challenge-timer-track{stroke:#ffffff29}.challenge-timer-fill{stroke:var(--challenge);stroke-linecap:round;stroke-dashoffset:52px}.challenge-timer text{fill:var(--challenge-ink);text-anchor:middle;font-size:12px;font-weight:800}[data-playing] .challenge-timer-fill{animation:6s linear infinite challenge-timer}@keyframes challenge-timer{0%{stroke-dashoffset:0}to{stroke-dashoffset:125.6px}}.challenge-rounds{grid-template-columns:repeat(5,minmax(0,1fr));gap:6px;margin:0;padding:0;list-style:none;display:grid}.challenge-rounds li{border-radius:var(--radius-sm);opacity:.6;background:#ffffff0f;justify-items:center;gap:4px;min-width:0;padding:8px 2px;font-size:10.5px;font-weight:700;display:grid}.challenge-rounds .explorer-icon{--icon-tone:var(--challenge-ink);--icon-soft-tone:#ffffff2e}.challenge-rounds .is-done{opacity:1;background:color-mix(in srgb, var(--success) 30%, transparent)}.challenge-rounds .is-current{opacity:1;background:var(--challenge)}.challenge-prompt{font-size:18px;font-weight:800}.challenge-result{grid-template-columns:auto minmax(0,1fr);align-items:center}.challenge-share{grid-column:1/-1;justify-self:start}.challenge-score{font-size:28px;font-weight:800;line-height:1}.challenge-score small{opacity:.7;font-size:12px;font-weight:700;display:block}.challenge-grid{justify-content:center;gap:5px;display:flex}.challenge-square{border-radius:6px;width:22px;height:22px}.challenge-square.is-right{background:var(--success)}.challenge-square.is-partial{background:var(--xp)}.challenge-square.is-wrong{background:var(--challenge)}[data-playing] .challenge-square{animation:square-in .5s var(--spring) both}.challenge-square:nth-child(2){animation-delay:80ms}.challenge-square:nth-child(3){animation-delay:.16s}.challenge-square:nth-child(4){animation-delay:.24s}.challenge-square:nth-child(5){animation-delay:.32s}@keyframes square-in{0%{opacity:0;transform:scale(.4)rotate(-12deg)}to{opacity:1;transform:none}}.challenge-share{border-radius:var(--radius-full);color:var(--challenge-deep);background:#fff;padding:8px 14px;font-size:13px;font-weight:800}@media (max-width:419px){.challenge-rounds li span{display:none}}@media (min-width:480px){.challenge-result{grid-template-columns:auto minmax(0,1fr) auto}.challenge-share{grid-column:auto}}@media (min-width:900px){.challenge{grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:center;gap:48px;padding:48px}.challenge h2{font-size:38px}}
.formats{gap:40px;margin:0;padding:0;list-style:none;display:grid}.format{align-content:start;gap:18px;display:grid}.format-stage{display:grid}.format-demo{place-items:stretch stretch;min-height:300px;display:grid}.format-demo>.art{align-content:center}.app-format{display:grid}.app-format>*{grid-area:1/1}.app-format-waiting{border:2px solid var(--line);border-radius:var(--radius-xl);background:var(--surface);min-height:360px}.app-format-frame{pointer-events:none;opacity:0;border:0;width:100%;height:360px;transition:opacity .42s;display:block}.app-format[data-shown=app] .app-format-frame{opacity:1}@media (prefers-reduced-motion:reduce){.app-format-frame{transition:none}}.format-copy{order:-1;gap:6px;padding:0 4px;display:grid}.format-kicker{color:var(--primary);letter-spacing:.04em;text-transform:uppercase;font-size:13px;font-weight:800}.format-copy h3{font-size:22px}.format-copy p{color:var(--ink-muted);font-size:15.5px}.levels{border-radius:var(--radius-xl);background:var(--primary-soft);gap:20px;margin-top:56px;padding:24px 18px;display:grid}.levels-copy{gap:8px;display:grid}.levels-copy h3{font-size:22px}.levels-copy p{color:var(--ink-muted);font-size:15.5px}.levels-steps ol{counter-reset:level;gap:12px;margin:0;padding:0;list-style:none;display:grid}.level{border-radius:var(--radius-lg);background:var(--surface);align-content:start;gap:10px;padding:16px;display:grid}.level-name{color:var(--primary);text-transform:uppercase;letter-spacing:.04em;align-items:center;gap:8px;font-size:13px;font-weight:800;display:inline-flex}.level-dot{border-radius:var(--radius-full);border:3px solid var(--primary);width:12px;height:12px}.level:nth-child(2) .level-dot{background:linear-gradient(90deg, var(--primary) 50%, transparent 50%)}.level:nth-child(3) .level-dot{background:var(--primary)}.level-question{font-size:15px;font-weight:700}.level-choices{flex-wrap:wrap;gap:6px;display:flex}.level-choices span{border-radius:var(--radius-sm);border:1.5px solid var(--line);padding:6px 10px;font-size:13px;font-weight:700}.level-choices .is-right{border-color:var(--success);background:var(--success-soft);color:var(--success)}.level-typed{border-radius:var(--radius-sm);border:1.5px solid var(--primary);align-items:center;min-height:40px;padding:0 12px;font-weight:700;display:inline-flex}.level-caret{background:var(--primary);width:2px;height:18px;margin-left:2px}[data-playing] .level-caret{animation:1s step-end infinite caret}@keyframes caret{50%{opacity:0}}.level-map{width:120px}.level-map path{fill:var(--track)}.level-pin{fill:var(--success);stroke:var(--surface);stroke-width:2px;transform-box:fill-box;transform-origin:bottom}[data-playing] .level-pin{animation:pin 2.4s var(--spring) infinite}@keyframes pin{0%,20%{opacity:0;transform:translateY(-14px)}40%,to{opacity:1;transform:none}}@media (min-width:700px){.formats{grid-template-columns:repeat(2,minmax(0,1fr));gap:48px 28px}.format:nth-child(2n){margin-top:56px}.levels-steps ol{grid-template-columns:repeat(3,minmax(0,1fr))}}@media (min-width:1100px){.formats{grid-template-columns:repeat(3,minmax(0,1fr));gap:56px 32px}.format:nth-child(2n){margin-top:0}.format:nth-child(3n+2){margin-top:64px}.levels{grid-template-columns:minmax(0,.8fr) minmax(0,2fr);align-items:center;gap:32px;padding:36px}}
