@font-face{font-family:TokyoSans;src:url(/tokyo-assets/fonts/inter.woff2)}@font-face{font-family:TokyoSerif;src:url(/tokyo-assets/fonts/bodoni.woff2)}*{box-sizing:border-box}body{color:#efefeb;background:#080a0b;margin:0;font-family:TokyoSans,Arial,sans-serif}#experience{isolation:isolate;height:100svh;min-height:440px;position:relative;overflow:hidden}canvas{touch-action:none;cursor:grab;width:100%;height:100%;display:block}canvas:active{cursor:grabbing}button,a{-webkit-tap-highlight-color:transparent;color:inherit}button{font:inherit;cursor:pointer;background:0 0;border:0}a{text-decoration:none}button:focus-visible,a:focus-visible{outline-offset:8px;outline:1px solid #c9b894}header{inset:max(30px,env(safe-area-inset-top)) 5% auto;pointer-events:none;justify-content:space-between;align-items:center;display:flex;position:absolute}header a{pointer-events:auto;letter-spacing:-.06em;font-size:30px}header a span{letter-spacing:.25em;margin-left:12px;font-size:10px}.prototype,.coordinates,.eyebrow,footer,#arrival>span{letter-spacing:.13em;color:#929895;font-size:10px}.coordinates{line-height:1.9;position:absolute;top:140px;right:5%}.intro{pointer-events:none;transition:opacity .6s,transform .9s;position:absolute;top:34%;left:7%}.intro h1{letter-spacing:-.045em;margin:25px 0 35px;font:clamp(50px,6.3vw,100px)/1.07 TokyoSerif,serif}.intro em{color:#aeb4b1;font-style:normal}.intro p{color:#959d9c;letter-spacing:.03em;font-size:11px}.intro p span{padding:0 9px}.eyebrow{font-size:9px}#hotspot{will-change:left,top;z-index:3;align-items:center;gap:13px;min-width:110px;min-height:48px;padding:12px;display:flex;position:absolute;top:0;left:0;transform:translate(-24px,-24px)}#hotspot i{background:#a41f21;border-radius:50%;width:12px;height:12px;box-shadow:0 0 0 6px #8b000023,0 0 20px #a31f2144}#hotspot span{letter-spacing:.18em;white-space:nowrap;text-shadow:0 1px 5px #000;font-size:10px}#hotspot b{color:#ae7b73;padding-left:8px;font-weight:400}#hotspot:hover i{background:#c43732;box-shadow:0 0 0 9px #8b000033}footer{bottom:max(30px,env(safe-area-inset-bottom));justify-content:space-between;align-items:center;gap:20px;line-height:1.5;display:flex;position:absolute;left:5%;right:5%}footer button{letter-spacing:.1em;color:#d0d0c6;border-bottom:1px solid #777b6b;min-height:44px;font-size:10px}footer a{font-size:10px}#status{max-width:230px;font-size:9px}#veil{pointer-events:none;opacity:0;z-index:5;background:#080a0b;position:absolute;inset:0}#arrival{pointer-events:none;opacity:0;transition:opacity 1.7s,transform 2s;position:absolute;bottom:19%;left:7%;transform:translateY(20px)}#arrival h2{letter-spacing:-.055em;margin:25px 0;font:clamp(68px,10vw,155px)/.95 TokyoSerif,serif}#arrival h2 em{letter-spacing:.8em;margin:30px 0 0 5px;font:12px TokyoSans,sans-serif;display:block}#arrival p{color:#969b98;margin-top:30px;font-size:10px}.city #arrival{opacity:1;transform:none}.travelling .intro,.city .intro{opacity:0;transform:translateY(-30px)}.city .coordinates{opacity:.6}.city #hotspot{display:none!important}.travelling #hotspot{pointer-events:none}.travelling #hotspot i{animation:.65s ease-out departure-pulse}.travelling .coordinates,.travelling footer{opacity:0;transition:opacity .5s}#error{text-align:center;z-index:10;background:#080a0b;padding:25px;font-size:14px;position:absolute;inset:35% 8%}#error a{margin-top:25px;font-size:12px;display:block}[hidden]{display:none!important}@media (width<=700px){header{top:max(25px,env(safe-area-inset-top));left:6%;right:6%}.prototype{display:none}header a{font-size:27px}.coordinates{font-size:9px;top:105px;right:6%}.intro{top:auto;bottom:16%;left:7%}.intro h1{margin:16px 0 20px;font-size:48px;line-height:1.02}.intro p{font-size:10px}.eyebrow{font-size:8px}footer{left:6%;right:6%;bottom:max(20px,env(safe-area-inset-bottom));flex-wrap:wrap;gap:12px}#status{width:100%;max-width:none;font-size:8px}footer a{margin-left:auto;font-size:9px}footer button{font-size:9px}#arrival{bottom:21%}#arrival h2{font-size:90px}#arrival h2 em{font-size:11px}#arrival p{font-size:10px}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition:none!important;animation:none!important}}body.embedded header{display:none}body.embedded .coordinates{top:145px}.unavailable .intro,.unavailable #arrival{display:none}.unavailable #error{height:max-content;inset:40% 8% auto}.city-spot{z-index:3;color:#d2d2c9;align-items:center;gap:8px;min-height:40px;padding:10px 4px;display:flex;position:absolute;top:0;left:0;transform:translate(-10px,-15px)}.city-spot i{background:#962d2d;border-radius:50%;flex-shrink:0;width:5px;height:5px;box-shadow:0 0 0 5px #8b000025}.city-spot span{letter-spacing:.1em;white-space:nowrap;text-shadow:0 1px 6px #000;font-size:9px}.city-spot b{font-weight:400}.city-spot[aria-pressed=true] i{background:#efbbb0;box-shadow:0 0 0 7px #8b000040}.city-spot:hover{color:#fff}#city-fragment{z-index:4;border-top:1px solid #73352e;width:280px;max-width:85%;padding:20px 0;position:absolute;bottom:19%;right:5%}#city-fragment>span{letter-spacing:.13em;color:#b5a798;font-size:9px}#city-fragment h3{margin:20px 0 15px;font:34px TokyoSerif,serif}#city-fragment p{color:#b6bab5;text-shadow:0 1px 6px #000;font-size:12px;line-height:1.8}#close-fragment{color:#c8c5b9;width:36px;height:36px;font-size:22px;position:absolute;top:10px;right:0}#fragment-link{letter-spacing:.07em;border-bottom:1px solid #aaa3;margin-top:22px;padding-bottom:9px;font-size:10px;display:inline-block}#take-home{letter-spacing:.12em;z-index:4;align-items:center;min-height:44px;font-size:10px;display:flex;position:absolute;top:145px;right:5%}.city .coordinates{display:none}.exploring #arrival{opacity:0;transform:translateY(15px)}.embedded footer{bottom:max(40px,env(safe-area-inset-bottom))}.embedded footer>a,.embedded .prototype{display:none}@media (width<=700px){.city-spot b{display:none}.city-spot span{font-size:10px}.city-spot{gap:6px;min-width:36px}#take-home{font-size:9px;top:120px;right:6%}#city-fragment{background:linear-gradient(#0000,#080a0b55);width:auto;padding-top:17px;bottom:17%;left:7%;right:7%}#city-fragment h3{margin:15px 0 10px;font-size:30px}#city-fragment p{max-width:280px;font-size:12px}#fragment-link{margin-top:14px}.embedded footer{bottom:max(38px,env(safe-area-inset-bottom))}body.embedded .coordinates{top:120px}}.unavailable{background:linear-gradient(#080a0bbd,#080a0bea),url(/tokyo-assets/hero.webp) 50%/cover}.unavailable #error{background:0 0}.unavailable canvas{visibility:hidden}.locating{color:#b4bfbd;letter-spacing:.18em;flex-direction:column;justify-content:center;align-items:center;gap:22px;font-size:11px;display:flex;position:absolute;inset:0}.locating i{transform-origin:0;background:#788683;width:100px;height:1px;animation:1.8s ease-in-out infinite locate-line}.locating small{color:#8e9c9a;font-size:10px;line-height:1.9}.preparing #veil{opacity:1}.preparing #enter,.preparing #hotspot{visibility:hidden}.city-spot[aria-pressed=true]{color:#fff0dc}@keyframes locate-line{0%,to{opacity:.4;transform:scaleX(.3)}50%{opacity:.9;transform:scaleX(1)}}@keyframes departure-pulse{50%{box-shadow:0 0 0 12px #a42e2922,0 0 24px #a31f2166}}@media (width<=700px){.eyebrow,#status{font-size:10px}.intro p,footer button,footer a,#take-home{font-size:11px}.coordinates{font-size:10px}.city-spot span{font-size:11px}.city-spot{min-width:44px;padding:10px 5px}#city-fragment{padding-top:12px;bottom:17%}#city-fragment h3{margin:10px 0;font-size:28px}#city-fragment p{line-height:1.65}#fragment-link{margin-top:8px;font-size:11px}#arrival{bottom:22%}#arrival h2{font-size:82px}.embedded footer{gap:6px}}@media (prefers-reduced-motion:reduce){.locating i,.travelling #hotspot i{animation:none}}canvas:focus-visible{outline-offset:-5px;outline:1px solid #c9b894}.city-spot{min-width:44px;min-height:44px}#close-fragment{width:44px;height:44px}
