:root{--ink: #fff;--bg: #000;--dim: #8a8a8a;--line: #fff;--maxw: 640px}*{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent}html{background:#000;background-color:#000;min-height:100%;min-height:100dvh;color-scheme:dark}html,body,#root{height:100%;min-height:100%;min-height:100dvh}body{background:#000;background-color:#000;color:var(--ink);font-family:Courier New,Courier,ui-monospace,monospace;line-height:1.5;overflow-x:hidden;position:relative;-webkit-text-size-adjust:100%}#root{background:#000;background-color:#000;min-height:100%;min-height:100dvh}body:before{content:"";position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:-1;background:#000}body:after{content:"";position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:0;background:radial-gradient(120% 90% at 50% 25%,transparent 52%,rgba(0,0,0,.55) 100%)}#app{position:relative;z-index:1;max-width:var(--maxw);margin:0 auto;min-height:100vh;min-height:100dvh;padding:68px 16px calc(40px + env(safe-area-inset-bottom,0px));background:#000;display:flex;flex-direction:column}.topbar{position:fixed;top:0;left:0;right:0;z-index:5;max-width:var(--maxw);margin:0 auto;display:flex;justify-content:space-between;align-items:center;padding:9px 14px;background:linear-gradient(180deg,#000 70%,transparent)}.menubtn{font-family:inherit;background:transparent;color:var(--ink);border:2px solid var(--line);border-radius:10px 8px 9px 7px/8px 10px 7px 9px;padding:5px 9px;font-size:10px;letter-spacing:1px;cursor:pointer}.menubtn:hover{background:var(--ink);color:var(--bg)}.brand{display:flex;align-items:center;gap:8px}.wordmark{font-size:12px;letter-spacing:3px;color:var(--dim);text-transform:uppercase}.brand img{display:block;width:auto}.frame{border:2px solid var(--line);border-radius:14px 12px 13px 11px/12px 14px 11px 13px;padding:16px}h1{font-size:11vw;line-height:1;letter-spacing:1px;font-weight:700}.howto-h1{font-size:8vw}@media(min-width:520px){h1{font-size:56px}.howto-h1{font-size:34px}}.sub{letter-spacing:5px;font-size:12px;margin-top:10px;color:var(--ink)}.lede{color:var(--dim);margin-top:16px;font-size:14.5px;max-width:32em}.lede.story{color:var(--ink);font-size:18px;line-height:1.6}.lede.story b{color:var(--ink)}button{font-family:inherit;cursor:pointer;background:transparent;color:var(--ink);border:2px solid var(--line);border-radius:13px 11px 12px 10px/11px 13px 10px 12px;padding:14px 16px;font-size:15px;text-align:left;width:100%;transition:background .12s,color .12s,transform .06s}button:hover{background:var(--ink);color:var(--bg)}button:active{transform:translateY(1px)}.btn-primary{text-align:center;letter-spacing:3px;font-weight:700;text-transform:uppercase}.btn-primary.pulse{animation:btnpulse 1.8s ease-in-out infinite}@keyframes btnpulse{0%,to{box-shadow:0 0 #ffffff2e}50%{box-shadow:0 0 0 7px #fff0}}.stack>*+*{margin-top:10px}.stage{display:flex;flex-direction:column;align-items:center;margin:4px 0}svg .ln{fill:none;stroke:var(--line);stroke-width:3;stroke-linecap:round;stroke-linejoin:round}.chrome{display:flex;justify-content:space-between;align-items:center;font-size:11px;color:var(--dim);letter-spacing:1.5px;text-transform:uppercase;margin-bottom:10px;gap:8px}.chan{color:var(--ink);text-align:right}.meta{font-size:11px;color:var(--dim);letter-spacing:1px;margin-bottom:10px}.thread{display:flex;flex-direction:column;gap:9px}.bubble{border:2px solid var(--line);border-radius:14px 14px 14px 4px;padding:10px 12px;font-size:15px;max-width:94%;align-self:flex-start;opacity:0;transform:translateY(8px);animation:pop .32s ease forwards}.bubble.spot{line-height:2.05}@keyframes pop{to{opacity:1;transform:none}}.chip{display:inline-block;border:2px solid var(--line);border-radius:8px;padding:2px 9px;margin:1px;cursor:pointer;font-weight:700;vertical-align:middle;transition:background .12s,color .12s}.chip:hover,.chip.tell{background:var(--ink);color:var(--bg)}.chip.wrongpick{opacity:.45;text-decoration:line-through}.hint{font-size:12px;color:var(--dim);letter-spacing:2px;text-transform:uppercase;text-align:center;margin:12px 0 2px}.timerwrap{margin:14px 0 2px}.timerrow{display:flex;justify-content:space-between;font-size:11px;letter-spacing:2px;color:var(--dim);text-transform:uppercase;margin-bottom:6px}.num{color:var(--ink);font-weight:700;font-size:15px}.track{height:8px;border:2px solid var(--line);border-radius:6px;overflow:hidden}.fill{height:100%;background:var(--ink);width:100%;transition:width .25s linear}.low .num,.low .label{animation:blink .6s steps(2,start) infinite}@keyframes blink{50%{opacity:.2}}.answers{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:12px}.answers.one{grid-template-columns:1fr}.answers button{text-align:center;letter-spacing:2px;font-weight:700;padding:18px 6px;text-transform:uppercase;font-size:15px}.verdict{font-size:30px;letter-spacing:1px;font-weight:700;text-align:center;margin:8px 0 2px}.gained{text-align:center;font-size:14px;color:var(--ink);letter-spacing:1px;margin-top:2px;min-height:18px}.vtag{text-align:center;font-size:12px;letter-spacing:3px;text-transform:uppercase;color:var(--dim);margin-top:2px}.why{margin:14px 0;font-size:14.5px}.section-t{font-size:11px;letter-spacing:3px;text-transform:uppercase;color:var(--dim);margin:14px 0 8px;border-bottom:1px dashed var(--dim);padding-bottom:6px}.levers{display:flex;flex-wrap:wrap;gap:7px}.lever{border:2px solid var(--line);border-radius:20px;padding:4px 11px;font-size:11px;letter-spacing:1px;text-transform:uppercase}.dots{display:flex;gap:5px;flex-wrap:wrap;justify-content:center;margin:14px 0 2px}.dot{width:9px;height:9px;border:2px solid var(--line);border-radius:50%}.dot.ok{background:var(--ink)}.dot.no{position:relative}.dot.no:after{content:"";position:absolute;left:1px;right:1px;top:2px;border-top:2px solid var(--line);transform:rotate(45deg)}.journey{margin:6px 0 2px}.journeytop{display:flex;justify-content:space-between;align-items:flex-end;font-size:10px;letter-spacing:1.5px;text-transform:uppercase;color:var(--dim);margin-bottom:6px}.journeytop .endpt{display:flex;flex-direction:column;align-items:center;gap:3px}.journeytrack{position:relative;height:2px;background:repeating-linear-gradient(90deg,var(--dim) 0 6px,transparent 6px 12px);margin:20px 6px 4px}.journeyman{position:absolute;top:-30px;transform:translate(-50%);transition:left .5s ease}.lives{display:flex;align-items:center;gap:7px;justify-content:center;margin-top:6px;font-size:11px;letter-spacing:1.5px;text-transform:uppercase;color:var(--dim)}.life{font-size:16px;line-height:1}.life.lost{opacity:.25}.fade{animation:fadein .3s ease}@keyframes fadein{0%{opacity:0}to{opacity:1}}.rise{animation:rise .5s cubic-bezier(.2,.8,.3,1)}@keyframes rise{0%{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}.spacer{flex:1}.scoreBig{font-size:42px;font-weight:700;text-align:center;letter-spacing:1px}.scoreSub{text-align:center;color:var(--dim);font-size:13px;letter-spacing:2px;text-transform:uppercase;margin-top:4px}.sticker{border:2px dashed var(--line);border-radius:16px;padding:18px;text-align:center;margin:18px 0;font-size:16px;font-weight:700;line-height:1.45}.storyend{text-align:center;font-size:14.5px;color:var(--dim);margin:4px 0 6px;line-height:1.5}.storyend b{color:var(--ink)}a.linkbtn{display:block;text-decoration:none;color:var(--ink);border:2px solid var(--line);border-radius:13px 11px 12px 10px/11px 13px 10px 12px;padding:12px 14px;font-size:14px;transition:background .12s,color .12s}a.linkbtn:hover{background:var(--ink);color:var(--bg)}a.linkbtn .h{display:block;font-size:11px;letter-spacing:2px;color:var(--dim);text-transform:uppercase;margin-bottom:3px}a.linkbtn:hover .h{color:var(--bg)}a.sharebtn{display:block;text-decoration:none;text-align:center;color:var(--bg);background:var(--ink);border:2px solid var(--line);border-radius:13px 11px 12px 10px/11px 13px 10px 12px;padding:15px 14px;font-size:14px;font-weight:700;letter-spacing:1.5px;text-transform:uppercase}a.sharebtn:hover{background:transparent;color:var(--ink)}.footer-note{font-size:11px;color:var(--dim);text-align:center;margin-top:24px;letter-spacing:1px}.overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:20;background:#000000f7;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:24px;animation:fadein .18s ease}.overlay .box{max-width:420px;width:100%}.overlay h2{text-align:center;font-size:20px;letter-spacing:2px;margin-bottom:4px}.overlay p.s{text-align:center;color:var(--dim);font-size:13px;margin-bottom:18px}.flash{position:fixed;top:0;right:0;bottom:0;left:0;z-index:12;pointer-events:none}.flash.ok{animation:flashok .55s ease forwards}.flash.no{animation:flashno .55s ease forwards}@keyframes flashok{0%{background:#ffffff1f;box-shadow:inset 0 0 0 6px #ffffff80}to{background:transparent;box-shadow:inset 0 0 0 0 transparent}}@keyframes flashno{0%{background:#0000;box-shadow:inset 0 0 0 6px #ffffff2e}to{background:transparent;box-shadow:inset 0 0 0 0 transparent}}.shake{animation:shake .5s cubic-bezier(.36,.07,.19,.97) both}@keyframes shake{10%,90%{transform:translate(-1px)}20%,80%{transform:translate(2px)}30%,50%,70%{transform:translate(-6px)}40%,60%{transform:translate(6px)}}.bigmark{font-size:60px;font-weight:700;text-align:center;line-height:1;margin-top:4px}.stamp{display:inline-block;animation:stamp .42s ease forwards}@keyframes stamp{0%{opacity:0;transform:scale(2.2) rotate(-14deg)}60%{opacity:1;transform:scale(.9) rotate(-4deg)}to{transform:scale(1) rotate(-4deg)}}.manpop{animation:manpop .55s cubic-bezier(.2,.8,.3,1) both}@keyframes manpop{0%{transform:translateY(22px) scale(.6);opacity:0}60%{transform:translateY(-8px) scale(1.06)}to{transform:none;opacity:1}}.mandance{display:inline-block;transform-origin:50% 90%;animation:mandance 2s ease-in-out both}@keyframes mandance{0%{transform:translateY(0) rotate(0)}12%{transform:translateY(-12px) rotate(-9deg)}25%{transform:translateY(0) rotate(8deg)}38%{transform:translateY(-12px) rotate(-9deg)}50%{transform:translateY(0) rotate(8deg)}62%{transform:translateY(-10px) rotate(-7deg)}75%{transform:translateY(0) rotate(6deg)}88%{transform:translateY(-6px) rotate(-4deg)}to{transform:translateY(0) rotate(0)}}.manfall{animation:manfall .6s ease both}@keyframes manfall{0%{transform:translateY(-16px) rotate(0);opacity:0}35%{opacity:1;transform:translateY(0) rotate(6deg)}to{transform:translateY(0) rotate(-5deg)}}.manshiver{animation:manshiver .5s linear 0s 3}@keyframes manshiver{0%,to{transform:translate(0)}25%{transform:translate(-3px) rotate(-2deg)}75%{transform:translate(3px) rotate(2deg)}}.floatup{animation:floatup .7s ease both}@keyframes floatup{0%{opacity:0;transform:translateY(10px) scale(.9)}35%{opacity:1;transform:translateY(-3px) scale(1.05)}to{opacity:1;transform:translateY(-2px) scale(1)}}.dot.pop{animation:dotpop .4s cubic-bezier(.2,.8,.3,1) both}@keyframes dotpop{0%{transform:scale(.2)}60%{transform:scale(1.4)}to{transform:scale(1)}}.chip:active{transform:scale(.92)}.endscene{position:relative;height:132px;margin:4px 0 8px;border-bottom:2px dashed var(--dim);overflow:hidden}.endscene .spot{position:absolute;bottom:8px;font-size:30px;display:flex;flex-direction:column;align-items:center;gap:2px}.endscene .spot span{font-size:9px;letter-spacing:1.5px;text-transform:uppercase;color:var(--dim)}.endscene .house{left:3%}.endscene .park{right:3%}.endscene .walker{position:absolute;bottom:-4px;transform:translate(-50%);transition:left 1.9s cubic-bezier(.45,0,.55,1)}.endscene .walker.bob{animation:bob .5s ease-in-out infinite}@keyframes bob{50%{transform:translate(-50%) translateY(-4px)}}.thought{position:absolute;top:6px;font-size:20px;opacity:0;animation:thoughtin .4s ease forwards;animation-delay:1.9s}@keyframes thoughtin{to{opacity:1}}.howto{display:flex;flex-direction:column;gap:12px;margin-top:8px}.howto-title{font-size:11px;letter-spacing:3px;text-transform:uppercase;color:var(--dim);text-align:center;margin-bottom:2px}.demo{border:2px solid var(--line);border-radius:14px 12px 13px 11px/12px 14px 11px 13px;padding:12px 13px;animation:fadein .4s ease both}.demo .step{font-size:13px;letter-spacing:2px;text-transform:uppercase;color:var(--ink);font-weight:700;margin-bottom:9px}.demo .step b{color:var(--ink)}.demobubble{border:2px solid var(--line);border-radius:12px 12px 12px 4px;padding:8px 11px;font-size:13.5px;line-height:1.9;display:inline-block;max-width:100%}.demochip{display:inline-block;border:2px solid var(--line);border-radius:8px;padding:1px 8px;font-weight:700;vertical-align:middle}.demochip.bad{animation:chippulse 2.2s ease-in-out infinite}@keyframes chippulse{0%,55%,to{background:transparent;color:var(--ink);box-shadow:0 0 #fff6}25%,40%{background:var(--ink);color:var(--bg);box-shadow:0 0 0 5px #fff0}}.demoans{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:11px}.demoans.one{grid-template-columns:1fr}.demobtn{border:2px solid var(--line);border-radius:11px 9px 10px 8px/9px 11px 8px 10px;padding:11px 6px;text-align:center;font-size:12px;font-weight:700;letter-spacing:1.5px;text-transform:uppercase}.demobtn.hit{animation:demohit 2.2s ease-in-out infinite}@keyframes demohit{0%,55%,to{background:transparent;color:var(--ink)}25%,40%{background:var(--ink);color:var(--bg)}}.democap{font-size:12.5px;color:var(--dim);margin-top:10px;line-height:1.45}.democap b{color:var(--ink)}.tapper{display:inline-block;margin-left:5px;animation:tapper 2.2s ease-in-out infinite}@keyframes tapper{0%,55%,to{transform:translateY(0)}25%,40%{transform:translateY(-4px)}}@media(prefers-reduced-motion:reduce){*{animation-duration:.01ms!important}.endscene .walker{transition:none}}
