@font-face{font-family:Cormorant Garamond;src:url(/fonts/cormorant-garamond-regular.ttf) format("truetype");font-display:swap;font-weight:400}:root{font-family:-apple-system,BlinkMacSystemFont,PingFang SC,Microsoft YaHei,sans-serif;color:#e8edf2;background:#050b14;font-synthesis:none;font-weight:400;color-scheme:dark}*{box-sizing:border-box}body{margin:0}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;cursor:pointer}button:disabled{opacity:.4;cursor:wait}button:focus-visible,a:focus-visible,canvas:focus-visible{outline:2px solid #8ec9e8;outline-offset:5px}button{border:0;background:none}a{color:inherit;text-decoration:none}.app{height:100dvh;min-height:640px;position:relative;overflow:hidden;background:radial-gradient(ellipse at 57% 49%,#0b1625,#050b14 62%)}.space-glow{position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse at 55% 48%,#17324c20,transparent 54%)}.earth-canvas{position:absolute;inset:0}.earth-canvas canvas{display:block;touch-action:none}header{position:absolute;top:32px;left:42px;right:42px;display:flex;align-items:center;justify-content:space-between;z-index:5;pointer-events:none}header>*{pointer-events:auto}.brand{display:flex;align-items:center;gap:21px}.brand>span{font-family:Cormorant Garamond,Georgia,serif;letter-spacing:6px;font-size:32px}.brand small{color:#8898aa;font-size:12px;letter-spacing:4px;border-left:1px solid #52607155;padding-left:22px}nav{display:flex;gap:12px}nav button{border:1px solid #8898aa30;display:flex;align-items:center;gap:9px;border-radius:22px;padding:11px 18px;font-size:12px;color:#acb9c8;background:#07101a55;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}nav button:hover{border-color:#a0c6de88;color:#fff}.intro{position:absolute;left:48px;top:33%;width:320px;pointer-events:none;z-index:3}.intro h1{font-family:Songti SC,STSong,serif;font-weight:400;letter-spacing:2px;font-size:36px;margin:0 0 19px;line-height:1.45;text-shadow:0 2px 25px #050b14}.intro p{font-size:14px;letter-spacing:2px;color:#8e9eaf;margin:0;line-height:1.9}.rule{height:1px;width:37px;background:#697b8e66;margin:34px 0 29px}dl{margin:0;display:flex;flex-direction:column;gap:24px}dl>div{display:flex;align-items:baseline;gap:17px}dt{font-family:Georgia,serif;font-size:24px;color:#bbc8d5;font-weight:400;letter-spacing:.5px}dt small{font-size:15px}dd{font-size:11px;letter-spacing:2px;color:#728397;margin:0}.markers{position:absolute;inset:0;pointer-events:none;z-index:2}.markers.hidden{display:none}.marker{position:absolute;left:0;top:0;width:30px;height:30px;padding:0;margin:-15px;pointer-events:auto;visibility:hidden;border-radius:50%;display:grid;place-items:center}.marker i{height:5px;width:5px;background:#d3ecff;border-radius:50%;box-shadow:0 0 0 4px #8fcfff18,0 0 10px #73baff80}.marker span{position:absolute;left:27px;white-space:nowrap;font-size:10px;letter-spacing:1px;color:#c8dbea;text-shadow:0 1px 5px #000;opacity:.75}.marker:hover i,.marker.selected i{box-shadow:0 0 0 6px #8fcfff33,0 0 15px #b9dfff}.marker:hover span,.marker.selected span{opacity:1;color:#fff}.city-shortcuts{position:absolute;right:42px;bottom:170px;display:flex;align-items:center;gap:8px;z-index:4}.city-shortcuts>span{font-size:10px;color:#607387;letter-spacing:2px;margin-right:4px}.city-shortcuts button{font-size:11px;display:flex;gap:9px;align-items:center;border:1px solid #7993ac30;border-radius:18px;padding:8px 12px;background:#07101a99;color:#a7b6c7}.city-shortcuts button:hover,.city-shortcuts button.active{border-color:#9fcfeb88;color:#e6f3ff}footer{position:absolute;left:50%;transform:translate(-50%);bottom:37px;width:min(680px,calc(100% - 40px));z-index:5;display:flex;align-items:center;flex-direction:column}.toolbar{padding:8px;background:linear-gradient(130deg,#172333bb,#0c1725cc);border:1px solid #6b829631;border-radius:17px;box-shadow:0 12px 48px #0004,inset 0 1px #ffffff04;-webkit-backdrop-filter:blur(24px);backdrop-filter:blur(24px);display:flex;width:100%;gap:4px}.toolbar button{flex:1;display:flex;justify-content:center;align-items:center;gap:11px;color:#6d8095;font-size:12px;letter-spacing:1px;padding:17px 7px;border-radius:10px;transition:background .2s,color .2s}.toolbar button[aria-pressed=true]{color:#b8d5e8;background:#51739413}.toolbar button:hover{background:#7c9cbc20}.toolbar button i{width:3px;height:3px;border-radius:50%;background:currentColor;opacity:0;margin-left:2px}.toolbar button[aria-pressed=true] i{opacity:.8}.hint{font-size:10px;color:#576b80;letter-spacing:2px;margin:20px 0 0}.mobile-hint{display:none}.sources-button{position:absolute;bottom:25px;left:42px;font-size:10px;color:#62758a;display:flex;gap:6px;align-items:center;z-index:5;letter-spacing:1px;padding:6px 0}.sources-button:hover{color:#c3d9eb}.signature{position:absolute;bottom:32px;right:42px;color:#34495d;font-size:8px;letter-spacing:2px}.back{display:flex;align-items:center;gap:7px;font-size:11px;color:#8ea8be;padding:0;margin:0 0 25px;pointer-events:auto}.city-en{display:block;font-size:10px;text-transform:uppercase;letter-spacing:3px;color:#7893ac;margin-bottom:10px}.city-detail h1{font-size:42px;margin-bottom:12px}.city-detail p{letter-spacing:1px;font-size:12px;max-width:245px}.city-detail .rule{margin:24px 0}.coordinates{font-size:11px;color:#b0c8da;letter-spacing:1px}.coordinates span{margin:0 12px;color:#3e566d}.local-time{display:flex;gap:14px;align-items:baseline;margin-top:22px}.local-time strong{font-family:Georgia,serif;font-weight:400;font-size:27px;color:#c5d8e8;font-variant-numeric:tabular-nums}.local-time>span{font-size:10px;letter-spacing:1px;color:#637c94}.loading,.error{position:absolute;left:57%;top:46%;transform:translate(-50%,-50%);z-index:6;text-align:center;background:#050b14cc;padding:30px;border-radius:20px;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.loading p{font-size:12px;color:#9db4c8;letter-spacing:2px}.loading p span{font-size:10px;margin-left:10px}.loading-orbit{display:inline-block;height:30px;width:30px;border:1px solid #213c54;border-top-color:#a3d7f6;border-radius:50%;animation:spin 2s linear infinite}.loading-track{height:1px;background:#263d53;width:210px}.loading-track i{display:block;height:1px;background:#a3d7f6;transition:width .4s}.error{width:320px;font-size:12px;color:#b9c9d7}.error p{overflow-wrap:anywhere;line-height:1.8}.error button{border:1px solid #7893ac66;border-radius:20px;padding:9px 20px;margin-top:10px}@keyframes spin{to{transform:rotate(360deg)}}dialog{border:1px solid #7893ac44;background:#101b29;color:#a7bacd;border-radius:20px;padding:0;width:min(540px,calc(100vw - 32px));max-height:80dvh;box-shadow:0 20px 100px #0008}dialog::backdrop{background:#010711bb;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}dialog article{padding:40px;position:relative}dialog h2{font-family:Songti SC,serif;font-size:26px;font-weight:400;color:#e6edf6;margin:16px 0 25px}dialog p{font-size:12px;line-height:2;margin:16px 0}dialog a{color:#9aceed;text-decoration:underline;text-underline-offset:4px}dialog .dialog-close{position:absolute;right:20px;top:20px;padding:5px;color:#93a8ba}@media(min-width:1600px){.intro{left:64px;top:35%}.intro h1{font-size:42px}}@media(max-width:1050px){.intro{left:30px;width:245px}.intro h1{font-size:29px}.intro p{font-size:12px}header{left:30px;right:30px}.city-shortcuts{right:30px}.signature{display:none}.sources-button{left:30px;bottom:19px}footer{bottom:42px;width:min(580px,calc(100% - 40px))}.toolbar button{gap:7px}}@media(max-width:760px){.app{min-height:600px}header{top:23px;left:23px;right:23px}.brand{gap:12px}.brand>span{font-size:25px;letter-spacing:4px}.brand small{font-size:9px;letter-spacing:2px;padding-left:12px}nav{gap:7px}nav button{padding:9px}nav button span{display:none}.intro{top:103px;left:26px;width:calc(100% - 52px)}.intro h1{font-size:29px;margin-bottom:9px;letter-spacing:2px}.intro p{font-size:11px;letter-spacing:2px}.rule{display:none}dl{flex-direction:row;gap:25px;margin-top:21px}dl>div{gap:8px}dt{font-size:16px}dt small{font-size:10px}dd{font-size:9px;letter-spacing:0}.city-shortcuts{right:24px;bottom:168px;gap:6px}.city-shortcuts button{font-size:10px;padding:7px 10px}.city-shortcuts>span{font-size:9px}footer{bottom:53px;width:calc(100% - 36px)}.toolbar{padding:5px;border-radius:15px;gap:2px}.toolbar button{flex-direction:column;gap:8px;font-size:10px;padding:14px 2px;position:relative}.toolbar button i{position:absolute;top:11px;right:12px}.toolbar button svg{width:18px;height:18px}.hint{font-size:9px;letter-spacing:1px;margin-top:16px}.desktop-hint{display:none}.mobile-hint{display:inline}.sources-button{bottom:16px;left:50%;transform:translate(-50%);font-size:9px;white-space:nowrap}.marker span{font-size:9px}.city-detail .back{margin:0 0 13px}.city-detail .city-en{position:absolute;left:100px;top:2px;font-size:9px}.city-detail h1{font-size:27px;display:inline-block;margin-right:18px;margin-bottom:7px}.city-detail p{font-size:10px;max-width:100%;letter-spacing:1px}.coordinates{font-size:10px;margin-top:12px}.local-time{position:absolute;right:0;top:26px;flex-direction:column;gap:4px}.local-time strong{font-size:22px}.local-time>span{font-size:8px}.loading,.error{left:50%;top:50%}dialog article{padding:30px}dialog h2{font-size:24px}}@media(prefers-reduced-motion:reduce){.loading-orbit{animation:none}*{scroll-behavior:auto!important}}.notice{position:absolute;top:90px;right:25px;max-width:300px;padding:14px 18px;border:1px solid #7893ac44;border-radius:12px;background:#101b29;z-index:9;font-size:12px;line-height:1.8;color:#b8cde0}.city-shortcuts{max-width:calc(100% - 70px);flex-wrap:wrap}.city-shortcuts button{white-space:nowrap}.city-approach{position:absolute;bottom:168px;left:50%;transform:translate(-50%);display:flex;gap:18px;align-items:center;padding:12px 19px;background:#0c1d2ce8;border:1px solid #7ba0bd55;border-radius:30px;font-size:11px;color:#a8cbe5;z-index:6;white-space:nowrap}.city-approach button{font-size:10px;color:#7695ae;padding:0}@media(max-width:760px){.city-shortcuts{max-width:calc(100% - 40px);left:20px;right:20px;gap:5px;justify-content:flex-end;bottom:166px}.city-shortcuts>span{display:none}.city-shortcuts button{font-size:10px;padding:6px 8px;gap:4px}.city-shortcuts button svg{width:10px}.city-approach{bottom:204px}}