@import url('fonts.css');
:root{--ink:#22251e;--cream:#f9f4df;--pink:#ee6c99;--blue:#a3d9e9;--sage:#6e8971}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--cream);color:var(--ink);font-family:'DM Sans',Arial,sans-serif;font-size:13px}button,a{-webkit-tap-highlight-color:transparent;touch-action:manipulation}button{font:inherit;cursor:pointer;color:inherit}button:disabled{cursor:default}a{color:inherit;text-decoration:none}button:focus-visible,a:focus-visible{outline:3px solid #ca4b7d;outline-offset:5px}h1,h2,p{margin:0}.topbar{position:fixed;top:0;left:0;width:100%;height:78px;background:var(--cream);border-bottom:2px solid var(--ink);padding:12px 3%;display:flex;justify-content:space-between;align-items:center;gap:20px;z-index:20}.brand{font-family:'Fredoka',Arial,sans-serif;font-weight:600;letter-spacing:-1px;font-size:30px;line-height:1}.brand span{display:block;font-family:'DM Sans',Arial,sans-serif;font-size:8px;letter-spacing:2px;font-weight:600;margin-top:7px}.token-tools{display:flex;align-items:center;gap:8px;min-width:0}.token-tools>span{font-size:8px;letter-spacing:1px;margin-right:13px}.token-tools>span:before{content:'';display:inline-block;width:6px;height:6px;background:var(--pink);border-radius:50%;margin-right:7px}.token-tools button{border:1.5px solid var(--ink);background:none;border-radius:25px;padding:12px 17px;font-weight:700;font-size:10px}.token-tools .ca{max-width:230px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.token-tools #x-link{background:var(--ink);color:var(--cream);min-width:50px}.walk{position:relative;height:390svh;padding-top:78px}.stage{position:sticky;top:78px;height:calc(100svh - 78px);min-height:460px;overflow:hidden;background:#91d3e9;isolation:isolate}.opening{position:absolute;top:30px;left:5%;z-index:6;max-width:340px;pointer-events:none;transition:opacity .3s,transform .3s}.opening>span{display:inline-block;transform:rotate(-3deg);background:var(--cream);padding:8px 12px;border:1.5px solid var(--ink);font-size:9px;letter-spacing:1px;box-shadow:3px 3px 0 #22251e22}.opening h1{font-family:'Fredoka',Arial,sans-serif;font-weight:600;font-size:clamp(40px,4.3vw,66px);line-height:.94;letter-spacing:-2px;padding-top:18px;text-shadow:2px 2px 0 #ffffff55}.opening p{font-size:8px;letter-spacing:1.5px;margin-top:15px}.sky-note{position:absolute;top:45px;right:4%;font-size:8px;letter-spacing:2px;z-index:4;transform:rotate(2deg)}.world{position:absolute;left:0;bottom:0;width:max(2200px,250vw);height:100%;will-change:transform}.street{position:absolute;left:0;bottom:70px;width:100%;height:calc(100% - 115px);object-fit:fill;pointer-events:none}.ground{position:absolute;bottom:0;height:72px;width:100%;background:#d9ba96;border-top:2px solid #b89774}.ground:after{content:'';position:absolute;top:20px;left:0;width:100%;height:2px;background:repeating-linear-gradient(90deg,#c3a382 0 140px,transparent 140px 150px)}.walker{position:absolute;left:43%;bottom:112px;height:min(45svh,350px);width:auto;z-index:7;transform:translateX(-50%);pointer-events:none}.walker>img{display:block;width:auto;height:100%;transform:scaleX(-1);filter:drop-shadow(2px 4px 0 #0002);position:relative;z-index:2;transform-origin:50% 100%}.walker.strolling>img{animation:stroll .6s ease-in-out infinite}.shadow{position:absolute;left:20%;bottom:-2px;width:65%;height:11px;background:#28271925;border-radius:50%;filter:blur(2px);z-index:1}.thought{position:absolute;top:17%;left:80%;background:var(--cream);border:1.5px solid var(--ink);border-radius:50%;padding:14px 20px;white-space:nowrap;font-family:'Fredoka',Arial,sans-serif;font-size:17px;transform:rotate(5deg);z-index:3;box-shadow:3px 3px 0 #0001}.thought:before{content:'';position:absolute;left:-8px;bottom:0;width:8px;height:8px;background:var(--cream);border:1px solid var(--ink);border-radius:50%}.thought:after{content:'';position:absolute;left:-16px;bottom:-8px;width:4px;height:4px;background:var(--cream);border:1px solid var(--ink);border-radius:50%}.place{position:absolute;top:40%;transform:translate(-50%,-50%) rotate(-2deg);border:2px solid var(--ink);border-radius:3px;background:var(--cream);box-shadow:4px 4px 0 #22251e33;padding:14px 20px;font-family:'Fredoka',Arial,sans-serif;font-size:23px;line-height:1.1;font-weight:500;z-index:5;white-space:nowrap}.place:after{content:'';position:absolute;width:2px;height:50px;background:var(--ink);bottom:-52px;left:50%;z-index:-1}.place>span{display:block;font-family:'DM Sans',Arial,sans-serif;font-size:7px;letter-spacing:1px;margin-bottom:7px}.place:hover{background:#f8d4df;transform:translate(-50%,-54%) rotate(1deg)}.bank{left:19%;top:47%;background:#f2a0b9}.kiosk{left:40%;top:40%;transform:translate(-50%,-50%) rotate(2deg)}.radio{left:66%;top:42%;background:#f5de8c}.bench{left:90%;top:44%;background:#c8d9bd}.car{position:absolute;bottom:72px;width:135px;height:46px;background:#ed6e83;border:2px solid var(--ink);border-radius:20px 35px 5px 5px;display:flex;align-items:center;justify-content:center;font-size:9px;font-weight:800;z-index:3;box-shadow:inset 0 7px 0 #fff3}.car i{position:absolute;bottom:-8px;width:18px;height:18px;border:4px solid var(--ink);background:#d0cab8;border-radius:50%}.car i:first-of-type{left:20px}.car i:last-of-type{right:20px}.car-one{left:10%;animation:drive 9s linear infinite}.car-two{left:55%;background:#edca64;animation:drive 13s linear infinite 1s}.flying-paper{position:absolute;width:17px;height:65px;background:var(--cream);border:1px solid #776d5a;left:21%;bottom:40%;background-image:repeating-linear-gradient(0deg,transparent 0 7px,#d2c9b6 7px 8px);z-index:4;transform:rotate(25deg);animation:paper 7s linear infinite}.paper-two{left:28%;bottom:33%;height:48px;animation-delay:-3s}.story-caption{position:absolute;bottom:16px;left:5%;right:36%;display:flex;gap:17px;align-items:center;z-index:8;pointer-events:none}.stop-count{display:flex;align-items:center;justify-content:center;width:45px;height:45px;border-radius:50%;border:1.5px solid var(--ink);background:var(--cream);flex-shrink:0;font-size:9px;font-weight:700}.story-caption strong{display:block;font-family:'Fredoka',Arial,sans-serif;font-size:22px;font-weight:500;line-height:1.1}.story-caption p{font-size:10px;margin-top:6px;line-height:1.5}.walking-guide{position:absolute;right:4%;bottom:110px;z-index:8;display:flex;flex-direction:column;align-items:center;text-align:center;gap:5px;transform:rotate(4deg);background:var(--cream);border:1.5px solid var(--ink);padding:16px 21px;border-radius:50%;box-shadow:3px 3px 0 #0002}.walking-guide>span{font-size:9px;font-weight:700;letter-spacing:1px}.walking-guide b{font-size:28px;font-weight:400}.walking-guide small{font-size:6px;letter-spacing:.5px}.pocket-button{position:absolute;bottom:22px;right:4%;z-index:8;border:1.5px solid var(--ink);border-radius:30px;background:var(--cream);padding:14px 18px;font-size:9px;font-weight:700;transform:rotate(-2deg)}.walk-progress{position:absolute;bottom:0;left:0;width:100%;height:4px;background:#b59674;z-index:9}.walk-progress span{display:block;background:var(--ink);height:100%;width:0}.waypoints{position:absolute;top:0;left:0;width:1px;height:100%;pointer-events:none}.waypoints span{position:absolute}.waypoints span:nth-child(1){top:0}.waypoints span:nth-child(2){top:28%}.waypoints span:nth-child(3){top:56%}.waypoints span:nth-child(4){top:80%}footer{background:var(--cream);position:relative;z-index:11;display:flex;align-items:center;justify-content:space-between;gap:25px;padding:40px 5%;border-top:2px solid var(--ink)}footer strong{font-size:9px;letter-spacing:1px}footer p{font-family:'Fredoka',Arial,sans-serif;font-size:20px;margin-top:8px}footer button{background:var(--pink);border:1.5px solid var(--ink);border-radius:30px;padding:15px 23px;font-size:9px;font-weight:700}footer>span{font-size:8px;letter-spacing:1px}dialog{border:2px solid var(--ink);border-radius:8px;background:var(--cream);color:var(--ink);padding:35px;width:min(650px,92vw);max-height:85dvh;box-shadow:8px 10px 0 #0003}dialog::backdrop{background:#25414c87;backdrop-filter:blur(4px)}.close{position:absolute;right:16px;top:16px;background:var(--ink);border:0;color:var(--cream);border-radius:50%;width:30px;height:30px;font-size:22px}.dialog-label{font-size:8px;letter-spacing:2px;margin-bottom:12px;padding-right:30px}dialog h2{font-family:'Fredoka',Arial,sans-serif;font-size:40px;line-height:1;letter-spacing:-1px;font-weight:500;margin-bottom:20px}dialog p{line-height:1.8;font-size:13px}dialog .plain-action{background:var(--pink);border:1.5px solid var(--ink);padding:13px 18px;border-radius:24px;font-weight:700;font-size:10px;margin-top:20px}dialog .aside-note{font-size:9px;opacity:.7;margin-top:20px;line-height:1.8}.receipt{border:1px dashed #9d927c;background:#fffdf5;padding:22px;font-family:monospace;font-size:12px;line-height:1.8;max-width:330px;margin:20px auto 0;transform:rotate(-2deg)}.receipt strong{display:block;text-align:center;font-size:24px}.broadcast{font-family:'Fredoka',Arial,sans-serif;font-size:29px;line-height:1.2;margin:25px 0;padding-left:20px;border-left:4px solid var(--pink)}.download-list{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:20px}.download-list a{background:#fff9e9;border:1px solid var(--ink);border-radius:4px;padding:12px;font-size:10px;display:flex;flex-direction:column;gap:10px}.download-list img{height:110px;width:100%;object-fit:contain;background:#f0e8d3}.download-list a:hover{background:#f8d4df}.download-list small{font-size:8px;opacity:.65}.toast{position:fixed;z-index:40;top:90px;right:3%;background:var(--ink);color:var(--cream);padding:15px 20px;border-radius:25px;font-size:10px;max-width:90vw}.no-js{position:fixed;bottom:15px;left:15px;background:var(--cream);padding:20px;z-index:50;border:2px solid var(--ink);line-height:1.8}@keyframes stroll{50%{transform:scaleX(-1) translateY(-4px) rotate(-.8deg)}}@keyframes drive{0%{transform:translateX(-140px)}100%{transform:translateX(1250px)}}@keyframes paper{0%{transform:translate(0,0) rotate(10deg);opacity:0}15%{opacity:1}90%{opacity:1}100%{transform:translate(420px,-130px) rotate(260deg);opacity:0}}
@media(min-width:1800px){.world{width:3800px}.street{height:calc(100% - 160px)}}
@media(max-width:900px){.brand{font-size:24px}.token-tools>span{font-size:7px;letter-spacing:0;margin-right:0}.token-tools button{padding:11px 13px;font-size:9px}.opening h1{font-size:45px}.sky-note{font-size:6px;letter-spacing:1px;max-width:150px;text-align:right}.world{width:2400px}.place{font-size:20px}.story-caption{right:30%;left:4%;gap:12px}.story-caption strong{font-size:19px}.story-caption p{font-size:9px}.walker{height:min(42svh,320px)}.thought{font-size:15px;padding:12px 15px}.walking-guide{right:3%;padding:14px}.pocket-button{right:3%;font-size:8px;padding:13px 15px}}
@media(max-width:600px){.topbar{height:104px;padding:12px 5%;flex-wrap:wrap;gap:9px;align-content:center}.brand{font-size:25px;letter-spacing:-.7px}.brand span{display:inline-block;font-size:6px;letter-spacing:.7px;margin:0 0 0 12px;vertical-align:middle;max-width:75px;line-height:1.6}.token-tools{width:100%;gap:6px}.token-tools>span{margin-right:auto;font-size:6px}.token-tools button{font-size:7px;padding:9px 12px}.token-tools .ca{max-width:145px}.token-tools #x-link{min-width:40px}.walk{padding-top:104px;height:430svh}.stage{top:104px;height:calc(100svh - 104px);min-height:460px}.opening{top:20px;left:6%;max-width:220px}.opening>span{font-size:6px;padding:6px 8px;letter-spacing:.8px}.opening h1{font-size:40px;letter-spacing:-1px;padding-top:12px}.opening p{font-size:6px;letter-spacing:1px;margin-top:10px}.sky-note{right:5%;top:25px;max-width:110px;font-size:5px;line-height:1.8;letter-spacing:.5px}.world{width:1900px}.street{bottom:100px;height:calc(100% - 175px)}.ground{height:102px}.walker{height:min(36svh,270px);max-height:265px;bottom:135px;left:43%}.thought{top:12%;left:70%;font-size:12px;max-width:150px;white-space:normal;min-width:105px;line-height:1.1;text-align:center;padding:12px 15px}.place{top:47%;font-size:18px;padding:12px 14px;border-width:1.5px}.place>span{font-size:6px;letter-spacing:.6px;margin-bottom:5px}.bank{left:18%;top:49%}.kiosk{left:40%;top:47%}.radio{left:66%;top:47%}.bench{left:90%;top:50%}.place:after{height:25px;bottom:-26px}.car{bottom:101px;width:95px;height:33px;font-size:6px}.car i{width:14px;height:14px;border-width:3px;bottom:-6px}.car i:first-of-type{left:14px}.car i:last-of-type{right:14px}.flying-paper{bottom:37%}.walking-guide{bottom:114px;right:5%;padding:12px 13px}.walking-guide>span{font-size:7px}.walking-guide b{font-size:20px}.walking-guide small{font-size:5px;max-width:95px;line-height:1.6}.story-caption{left:5%;right:5%;bottom:49px;gap:10px;align-items:start}.stop-count{width:30px;height:30px;font-size:6px}.story-caption strong{font-size:16px;line-height:1.1;max-width:250px}.story-caption p{font-size:8px;margin-top:4px;line-height:1.4;max-width:260px}.pocket-button{bottom:10px;right:5%;padding:9px 12px;font-size:6px;transform:rotate(-1deg)}footer{padding:28px 6%;flex-wrap:wrap;gap:20px}footer p{font-size:18px}footer strong{font-size:7px}footer button{font-size:7px;padding:12px 16px}footer>span{font-size:6px;width:100%;letter-spacing:1px}dialog{padding:26px 22px;border-radius:6px}dialog h2{font-size:31px;max-width:85%}dialog p{font-size:11px}.dialog-label{font-size:6px;letter-spacing:1.5px}.download-list{gap:9px}.download-list a{padding:9px;font-size:8px}.download-list img{height:85px}.download-list small{font-size:6px}.broadcast{font-size:24px;padding-left:14px}.toast{top:115px;font-size:9px}.receipt{font-size:10px;padding:17px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.walker.strolling>img,.car,.flying-paper{animation:none}.opening{transition:none}.world{will-change:auto}}
.bank{top:36%}.kiosk{top:32%}.radio{top:34%}.bench{top:36%}@media(max-width:600px){.bank,.kiosk,.radio{top:31%}.bench{top:35%}}
.opening h1{background:#f9f4dff0;display:inline-block;padding:12px 18px 15px;margin-top:12px;border:1.5px solid var(--ink);border-radius:4px;box-shadow:3px 3px 0 #22251e22;transform:rotate(-2deg)}.opening p{background:var(--cream);display:table;padding:5px 8px;margin-top:7px;transform:rotate(-2deg)}@media(max-width:600px){.opening h1{font-size:34px;padding:9px 13px 12px;margin-top:9px}.opening p{font-size:5px;margin-top:5px}}