:root{--paper:#fff5ef;--ink:#29211d;--accent:#ff8e73;--hot:#ffd94f;--surface:#fff;--focus:#315cff}.story{display:grid;grid-template-columns:1.25fr .75fr;gap:24px;margin:48px 0}.screen{position:relative;min-height:420px;overflow:hidden;border:3px solid var(--ink);border-radius:24px;background:#9ed8ff}.sky{position:absolute;inset:0 0 46%;background:#9ed8ff}.road{position:absolute;inset:54% 0 0;background:#4e5362}.road i{position:relative;display:inline-block;width:15%;height:14px;margin:90px 8%;background:#fff}.hero-dot{position:absolute;left:12%;bottom:42%;width:78px;height:92px;border-radius:48% 48% 30% 30%;background:#ffd94f;transition:transform .8s cubic-bezier(.22,1,.36,1)}.hero-dot b{position:absolute;width:10px;height:10px;border-radius:50%;background:var(--ink);left:22px;top:24px;box-shadow:28px 0 var(--ink)}.signal{position:absolute;right:16%;top:18%;width:70px;padding:10px;background:#25242a;border-radius:18px}.signal i{display:block;width:48px;height:48px;margin:6px auto;border-radius:50%;background:#5c5b61}.signal .red{background:#ff4e3d}.play{position:absolute;inset:auto 50% 24px auto;transform:translateX(50%);border:3px solid var(--ink);border-radius:16px;background:#fff;padding:16px 24px;font:700 18px Manrope,sans-serif;cursor:pointer}.play span{display:inline-grid;place-items:center;width:40px;height:40px;margin-right:8px;border-radius:50%;background:var(--hot)}.story-copy,.choice,.adult-note{padding:32px;border:2px solid var(--ink);border-radius:24px;background:#fff}.caption{min-height:84px;font-size:20px;line-height:1.45}.voice-state,.adult-note{font-size:14px;line-height:1.5}.replay{font:700 16px Manrope,sans-serif;border:2px solid;border-radius:12px;background:var(--hot);padding:12px 16px}.big-answers{display:grid;grid-template-columns:1fr 1fr;gap:16px}.big-answers button{min-height:130px;border:3px solid var(--ink);border-radius:24px;background:#fff;font:700 24px Manrope,sans-serif}.big-answers span{display:block;font-size:44px}.big-answers button:focus-visible,.play:focus-visible,.replay:focus-visible{outline:5px solid var(--focus);outline-offset:4px}.screen[data-state=walking] .hero-dot{transform:translateX(160px)}.screen[data-state=safe] .signal .red{background:#5c5b61}.screen[data-state=safe] .signal .green{background:#66d17a}.screen[data-state=safe] .hero-dot{transform:translateX(360px)}.screen[data-state=stopped] .hero-dot{transform:translateX(160px) scale(.92)}.adult-note{margin-top:24px;background:#ffd94f}.adult-note p{margin-bottom:0}@media(max-width:760px){.story{grid-template-columns:1fr}.screen{min-height:340px}.big-answers{grid-template-columns:1fr}.hero-dot{transform:scale(.82);transform-origin:bottom left}.screen[data-state=walking] .hero-dot{transform:translateX(100px) scale(.82)}.screen[data-state=safe] .hero-dot{transform:translateX(220px) scale(.82)}}@media(prefers-reduced-motion:reduce){.hero-dot{transition:none}}
