*{box-sizing:border-box}body{margin:0;background:#302a40;color:#f5e8d9;font-family:'PingFang SC','Microsoft YaHei',sans-serif;overflow:hidden}#world{position:fixed;inset:0}canvas{display:block;touch-action:none}header{position:fixed;inset:34px 46px auto;display:flex;justify-content:space-between;pointer-events:none}.brand{display:flex;gap:13px;align-items:center;text-decoration:none;color:#f1ded0;letter-spacing:4px;font-size:23px;pointer-events:auto}.seal{width:43px;height:43px;display:grid;place-items:center;border:1px solid #c6a390;border-radius:50%;font-family:serif;padding-left:4px}.brand small{display:block;font-size:9px;letter-spacing:3px;margin-top:6px;color:#bfaaa8}.time{display:flex;gap:14px;align-items:center;font-size:21px;letter-spacing:2px;font-variant-numeric:tabular-nums}.time small{display:block;color:#c3aaa6;font-size:11px;margin-top:7px;letter-spacing:2px}.sun{width:26px;height:26px;background:#edb884;border-radius:50%;box-shadow:0 0 32px #ffb17766}.intro{position:fixed;left:6%;top:28%;pointer-events:none}.overline{font-size:11px;letter-spacing:4px;color:#d0b199}h1{font-family:'Songti SC','Noto Serif CJK SC',serif;font-weight:400;font-size:clamp(30px,3.2vw,49px);letter-spacing:5px;line-height:1.6;margin:20px 0}p{font-size:13px;line-height:2.1;letter-spacing:2px;color:#c7b2b0}.coordinates{position:fixed;right:44px;bottom:140px;color:#a68f9b;font-size:9px;letter-spacing:2px;text-align:right;pointer-events:none}.coordinates span{display:block;color:#c2a8a5;font-size:11px;margin-top:10px}footer{position:fixed;bottom:28px;left:46px;right:46px;display:flex;align-items:center;justify-content:space-between}.instructions,.footnote{font-size:11px;color:#c3abaa;letter-spacing:1px}.instructions span{margin:0 12px}.toolbar{display:flex;align-items:center;gap:3px;background:#392e4399;border:1px solid #93727b66;border-radius:40px;padding:6px;backdrop-filter:blur(20px)}button{border:0;background:none;color:#dbc5bd;font-size:13px;padding:12px 16px;border-radius:24px;cursor:pointer;white-space:nowrap;transition:.2s}button span{margin-right:8px;font-size:17px}button:hover,button:focus-visible{background:#77607155}button[aria-pressed=true]{color:#ffd19a}.toolbar i{height:18px;width:1px;background:#7e627466}#loading{position:fixed;inset:0;z-index:5;background:#302a40;display:flex;align-items:center;justify-content:center;flex-direction:column;transition:opacity .6s}.load-orbit{width:40px;height:40px;border:1px solid #a68882;border-top-color:#ffe0b2;border-radius:50%;animation:spin 2s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}#loading.done{opacity:0;pointer-events:none}@media(max-width:850px){header{inset:24px 24px auto}.brand{font-size:20px}.time{font-size:17px}.time small{font-size:9px;letter-spacing:1px}.intro{left:26px;top:120px}h1{font-size:30px;line-height:1.5;margin:12px 0}.intro p{display:none}.overline{font-size:10px}.coordinates{display:none}footer{bottom:24px;left:12px;right:12px;justify-content:center;flex-direction:column;gap:15px}.instructions{order:2;font-size:10px}.footnote{display:none}button{padding:10px 14px}.seal{width:37px;height:37px}.brand small{font-size:8px}}

.following .intro{opacity:0}.intro{transition:opacity .4s}.following .coordinates{color:#eadac8}.following #rotate{display:none}#next-person{display:none}.following #next-person{display:block}.coordinates{pointer-events:none}footer{gap:20px}.toolbar{flex-shrink:0}.instructions{max-width:300px;line-height:1.8}@media(max-width:850px){.intro{top:115px}.intro h1{font-size:26px}.toolbar{max-width:calc(100vw - 24px);gap:0}.toolbar button{padding:11px 10px;font-size:12px}.following .coordinates{display:block;top:110px;bottom:auto;right:24px}.instructions{text-align:center;max-width:none}footer{gap:9px;bottom:max(18px,env(safe-area-inset-bottom))}}

.intro{top:auto;bottom:150px;left:38px}.intro h1{font-size:30px;margin:10px 0;line-height:1.5}.intro p{display:none}.overline{font-size:14px;letter-spacing:2px;color:#fff0dc}.brand,.time{color:#fff5e6;text-shadow:0 1px 8px #53635355}.brand small,.time small{color:#f4e9dc;font-size:12px}.instructions{color:#fff7e9;font-size:14px;text-shadow:0 1px 6px #65735e}.toolbar{background:#465548c9;border-color:#e4e9c466}button{font-size:14px;color:#f5efdf}.coordinates{display:none}@media(max-width:850px){.intro{left:24px;bottom:150px;top:auto}.intro h1{font-size:24px}.overline{font-size:12px}.instructions{font-size:12px}.toolbar button{font-size:13px}}

.scene-nav{position:fixed;left:38px;top:105px;display:flex;gap:6px;background:#465548b8;border:1px solid #e4e9c455;padding:5px;border-radius:24px}.scene-nav a{font-size:13px;text-decoration:none;color:#f5efdf;padding:8px 12px;border-radius:20px}.scene-nav a:hover,.scene-nav a:focus-visible{background:#ffffff20}.place-note{position:fixed;right:38px;top:106px;max-width:290px;background:#465548df;color:#f5efdf;border-radius:14px;padding:12px 16px;font-size:14px}.place-note summary{cursor:pointer}.place-note p{font-size:14px;line-height:1.75;letter-spacing:0;color:inherit}.place-note a{color:#fae3b7}.following .scene-nav{display:none}body[data-scene=kyoto] .brand small{font-size:10px;letter-spacing:1px}@media(max-width:850px){.scene-nav{left:20px;top:88px}.place-note{top:145px;right:20px;max-width:260px;padding:10px 12px}.place-note:not([open]){font-size:12px}.following .place-note{display:none}}