@font-face{font-family:Fredoka;font-style:normal;font-display:swap;font-weight:600;src:url(/assets/fredoka-latin-600-normal-C4zohCW5.woff2) format("woff2"),url(/assets/fredoka-latin-600-normal-CcrEjrB4.woff) format("woff")}@font-face{font-family:Fredoka;font-style:normal;font-display:swap;font-weight:700;src:url(/assets/fredoka-latin-700-normal-BOIZVyIN.woff2) format("woff2"),url(/assets/fredoka-latin-700-normal-C8FeHd3X.woff) format("woff")}:root{color-scheme:light;--navy: #1c2b4a;--sky: #b9e6ff;--cream: #fff6ea;--butter: #ffd56a;--green: #6dce93;--green-deep: #2f9a64;--sand: #f6d0ae;--sand-deep: #e0a878;--pale: #e7ddd4;--pale-edge: #cfc0b4;font-family:Fredoka,Arial Rounded MT Bold,Segoe UI,sans-serif}*,*:before,*:after{box-sizing:border-box}html,body,#root{height:100%;margin:0;overflow:hidden}html,body,button{touch-action:manipulation;-webkit-tap-highlight-color:transparent}body{background:var(--sky);color:var(--navy);user-select:none;-webkit-user-select:none}button{font:inherit;color:inherit;appearance:none;border:0;background:none;padding:0;cursor:pointer}.app{position:fixed;inset:0;overflow:hidden;background:linear-gradient(#d7f3ff,#fff4e4 72%)}.screen{position:relative;height:100%;min-height:0;display:flex;flex-direction:column;overflow:hidden}.circus{position:relative;flex:1 1 auto;min-height:0;overflow:hidden}.bunting{position:absolute;z-index:4;top:calc(8px + env(safe-area-inset-top));left:14px;right:14px;display:flex;justify-content:space-between;pointer-events:none}.circus-mute-gap .bunting{right:76px}.bunting:before{content:"";position:absolute;left:0;right:0;top:1px;height:3px;border-radius:3px;background:var(--navy)}.flag{width:16px;height:22px;clip-path:polygon(0 0,100% 0,50% 100%);transform-origin:top center}.balloon{position:absolute;z-index:2;aspect-ratio:60 / 84;pointer-events:none}.balloon svg{width:100%;height:100%;display:block}.tent{position:absolute;z-index:1;left:50%;bottom:28%;width:min(78%,340px);transform:translate(-50%)}.tent-flag{transform-origin:172px 26px}.ground{position:absolute;z-index:0;left:-12%;right:-12%;bottom:-28%;height:46%;border-radius:50% 50% 0 0;background:#c9f0bf;border-top:6px solid var(--navy)}.station{position:absolute;z-index:2;left:3%;bottom:14%;width:min(26%,108px)}.train{position:absolute;z-index:3;left:22%;bottom:12%;width:min(58%,230px)}.train svg{width:100%;height:auto;display:block}.go-bar{flex:0 0 auto;min-height:118px;display:grid;place-items:center;padding:8px 16px calc(16px + env(safe-area-inset-bottom))}.go{width:min(74vw,260px);height:92px;border-radius:999px;background:var(--butter);color:var(--navy);border:4px solid var(--navy);box-shadow:0 7px #e2a12a;font-size:52px;font-weight:700;line-height:1}.go:active{transform:translateY(5px);box-shadow:0 2px #e2a12a}.go-again{width:min(88vw,340px);font-size:clamp(30px,8vw,42px);padding:0 22px;white-space:nowrap}.speaker{position:absolute;z-index:6;top:calc(10px + env(safe-area-inset-top));right:calc(10px + env(safe-area-inset-right));width:52px;height:52px;border-radius:50%;background:#fffaf3;border:3px solid var(--navy);box-shadow:0 4px #efc99a;display:grid;place-items:center}.speaker svg{width:30px;height:30px}.speaker:active{transform:translateY(2px);box-shadow:0 2px #efc99a}.question{padding:calc(10px + env(safe-area-inset-top)) calc(16px + env(safe-area-inset-right)) calc(12px + env(safe-area-inset-bottom)) calc(16px + env(safe-area-inset-left));background:linear-gradient(#c5ecff,#fff6ea 70%)}.dots{flex:0 0 auto;height:40px;display:flex;align-items:center;justify-content:center;gap:12px}.mark{width:18px;height:18px;display:grid;place-items:center;flex:0 0 auto}.mark-empty,.mark-current,.mark-miss{border-radius:50%;border:3px solid #f0d7c2;background:transparent}.mark-current{width:22px;height:22px;border-color:#ff8b7b;background:#fff;box-shadow:0 0 0 4px #ff8b7b38}.mark-miss{background:var(--pale);border-color:var(--pale-edge)}.mark-right{width:22px;height:22px}.mark svg{width:100%;height:100%;display:block}.mark-large.mark-right,.mark-large.mark-miss{width:64px;height:64px}.mark-large.mark-miss{border-width:5px}.stage{position:relative;flex:1 1 auto;min-height:0;display:flex;align-items:center;justify-content:center}.stage-svg{width:100%;height:100%;overflow:hidden;pointer-events:none}.choices{flex:0 0 auto;display:grid;grid-template-columns:1fr 1fr;gap:12px;height:clamp(148px,32dvh,260px);margin-top:8px}.choice{min-width:64px;min-height:64px;border-radius:22px;background:#fffaf3;border:4px solid var(--edge);box-shadow:0 6px 0 var(--lip);color:var(--navy);font-weight:700;font-size:clamp(40px,12vw,68px);line-height:1;position:relative}.choice:nth-child(1){--edge: #f09888;--lip: #e07a72}.choice:nth-child(2){--edge: #e7c15a;--lip: #d0a63e}.choice:nth-child(3){--edge: #6ec8ea;--lip: #4eadd4}.choice:nth-child(4){--edge: #74d2ab;--lip: #52b48e}.choice:active{transform:translateY(4px);box-shadow:0 2px 0 var(--lip)}.choice.is-right{background:var(--green);--edge: var(--green-deep);--lip: #2f9464}.choice.is-right-now{transition:background-color 80ms linear,border-color 80ms linear}.choice.is-right-ease{transition:background-color .32s ease,border-color .32s ease}.choice.is-miss{background:var(--sand);--edge: var(--sand-deep);--lip: #c9926a}.choice.is-miss:after{content:"";position:absolute;inset:10px;border-radius:inherit;background:#ffffff73;pointer-events:none}.circus-finish{display:flex;flex-direction:column;justify-content:flex-end}.circus-finish .tent{position:relative;left:auto;bottom:auto;transform:none;width:min(50%,200px);margin:0 auto 12%}.tallies{position:absolute;z-index:4;left:0;right:0;top:calc(52px + env(safe-area-inset-top));display:flex;flex-direction:column;align-items:center;gap:16px}.tally{display:grid;grid-template-columns:72px 88px;align-items:center;justify-content:center;column-gap:8px}.tally-digit{font-size:clamp(64px,18vw,96px);font-weight:700;line-height:.85;color:var(--navy)}.fireworks{position:absolute;inset:0 0 12%;z-index:2;pointer-events:none;overflow:hidden}.spark{position:absolute;width:16px;height:16px;margin:-8px 0 0 -8px;border-radius:50%;border:2px solid var(--navy);opacity:0}@media(prefers-reduced-motion:no-preference){.balloon{animation-name:drift;animation-timing-function:ease-in-out;animation-iteration-count:infinite;animation-direction:alternate}.balloon-calm{animation-name:drift-calm}.flag,.tent-flag{animation:sway 2.8s ease-in-out infinite alternate}.go-pulse{animation:pulse 1.8s ease-in-out infinite}.train-moving{animation-name:leave;animation-timing-function:linear;animation-fill-mode:forwards}.wobble{transform-box:fill-box;transform-origin:center;animation-name:wobble;animation-duration:3.2s;animation-timing-function:ease-in-out;animation-iteration-count:infinite}.choice.is-miss{animation:settle .42s ease-out}.choice.is-miss:after{animation:puff .5s ease-out forwards}.spark{animation:spark 1s ease-out forwards}}@keyframes drift{0%{transform:translateY(0)}to{transform:translateY(-16px)}}@keyframes drift-calm{0%{transform:translateY(0)}to{transform:translateY(-5px)}}@keyframes sway{0%{transform:rotate(-5deg)}to{transform:rotate(6deg)}}@keyframes pulse{0%,to{transform:scale(1)}50%{transform:scale(1.045)}}@keyframes leave{0%{transform:translate(0)}to{transform:translate(120vw)}}@keyframes wobble{0%,to{transform:rotate(-2deg)}50%{transform:rotate(2.5deg)}}@keyframes settle{0%{transform:translateY(0) scale(1)}40%{transform:translateY(3px) scale(.96)}to{transform:translateY(0) scale(1)}}@keyframes puff{0%{transform:scale(.7);opacity:.7}to{transform:scale(1.2);opacity:0}}@keyframes spark{0%{transform:translate(0) scale(.6);opacity:1}to{transform:translate(var(--dx),var(--dy)) scale(.35);opacity:0}}@media(prefers-reduced-motion:reduce){.choice.is-right{transition-duration:50ms}}@media(max-height:420px){.tent{width:min(42%,220px);bottom:22%}.train{width:min(40%,180px);bottom:8%}.station{width:min(18%,84px);bottom:8%}.go{height:76px;font-size:40px}.go-bar{min-height:92px}.circus-finish .tent{width:min(30%,150px);margin-bottom:4%}.tallies{top:calc(28px + env(safe-area-inset-top));gap:6px}.mark-large.mark-right,.mark-large.mark-miss{width:44px;height:44px}.tally{grid-template-columns:52px 64px}.tally-digit{font-size:56px}}
