:root{--paper:#f6f1e8;--paper2:#fffdf8;--ink:#23312e;--muted:#77817b;--line:#e4ded2;--orange:#ee8d50;--gold:#edbd69;--coral:#e5684d;--green:#537b67;--pale:#e9eee5;--night:#283c38;--shadow:0 12px 42px rgba(45,53,43,.07);--mono:'DM Mono',Consolas,monospace;--sans:'DM Sans','Noto Sans SC','Microsoft YaHei',sans-serif}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);font-size:15px;-webkit-font-smoothing:antialiased}button,input{font:inherit}button{color:inherit}.topbar{height:78px;max-width:1440px;margin:auto;padding:0 52px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid rgba(35,49,46,.1)}.brand{display:flex;align-items:center;gap:10px;color:inherit;text-decoration:none}.brand-mark{width:34px;height:34px;display:grid;place-items:center}.brand-mark svg{width:100%;height:100%;overflow:visible}.brand-mark path{fill:none;stroke:var(--green);stroke-width:2.1;stroke-linecap:round}.brand-mark circle{fill:var(--orange);stroke:#fff5e6;stroke-width:3}.brand-name{font-size:23px;font-weight:700;letter-spacing:-1px}.brand-dot,.footer-brand span{color:var(--coral)}.brand-sub{margin-left:5px;padding-left:13px;border-left:1px solid var(--line);font:10px var(--mono);letter-spacing:1.7px;color:var(--muted)}.top-links{display:flex;gap:34px;margin-left:auto;margin-right:38px}.top-links a{color:#68746d;text-decoration:none;font-size:13px}.top-links a:hover{color:var(--coral)}.today-button{background:transparent;border:1px solid #d8d1c5;border-radius:999px;padding:9px 16px;font-size:12px;cursor:pointer}.live-dot{display:inline-block;width:7px;height:7px;margin-right:8px;background:var(--coral);border-radius:50%;box-shadow:0 0 0 3px #f3d8c9}
main{max-width:1336px;margin:auto;padding:0 44px}.hero{position:relative;min-height:238px;display:flex;align-items:center;justify-content:space-between;padding:30px 32px 18px;overflow:hidden}.eyebrow{display:flex;align-items:center;gap:9px;color:#7c8073;font:10px var(--mono);letter-spacing:1.9px;text-transform:uppercase}.eyebrow>span{width:7px;height:7px;border-radius:50%;background:var(--coral)}.hero h1{margin:18px 0 10px;font-size:43px;line-height:1.35;letter-spacing:-1.6px;font-weight:600}.hero h1 em,.method-intro h2 em{font-style:normal;color:var(--coral)}.hero-copy>p{margin:0;color:#81857b;font-size:14px}.hero-sun{width:390px;height:210px;position:absolute;right:56px;bottom:-20px;overflow:hidden}.sun-disc{position:absolute;width:176px;height:176px;border-radius:50%;left:111px;top:34px;background:linear-gradient(180deg,#f4c677 1%,#f08f56 61%,#e8684b 100%);box-shadow:0 0 0 14px rgba(238,141,80,.1),0 0 0 32px rgba(238,141,80,.06)}.sun-halo{position:absolute;width:254px;height:254px;border:1px solid rgba(232,104,77,.25);border-radius:50%;left:72px;top:-5px}.sun-horizon{position:absolute;left:0;right:0;bottom:43px;height:1px;background:#bfb6a7}.sun-horizon:after{content:'';position:absolute;left:85px;right:42px;bottom:-9px;border-bottom:1px dashed #c9bdac}.hero-label{position:absolute;z-index:1;display:flex;flex-direction:column;gap:4px;font:9px var(--mono);letter-spacing:1.5px;color:#74776e}.hero-label b{font:12px var(--sans);letter-spacing:0;color:var(--ink)}.label-rise{left:8px;bottom:67px}.label-set{right:8px;bottom:67px;text-align:right}.hero-star{position:absolute;color:#d8a36e;font-size:20px}.s1{left:47px;top:57px}.s2{right:77px;top:82px;font-size:14px}
.query-head{min-height:95px;border-top:1px solid #e4ddd1;border-bottom:1px solid #e4ddd1;display:flex;align-items:center;justify-content:space-between;padding:13px 31px}.location-line{display:flex;align-items:center;gap:14px}.pin-icon{font-size:28px;color:var(--coral)}.location-kicker{font-size:10px;color:#959488;letter-spacing:1px}.location-line h2{margin:1px 0 0;font-size:22px;letter-spacing:-.4px}.location-province{padding-left:13px;border-left:1px solid #ded7c9;color:#81877c;font-size:12px}.timezone-chip{border:1px solid #ddd7c9;border-radius:4px;padding:7px 10px;color:#737f76;font:10px var(--mono);letter-spacing:.2px}.date-control{display:flex;align-items:center;gap:10px}.date-control>button{width:34px;height:34px;border:1px solid #ddd6c8;background:transparent;border-radius:50%;font-size:18px;cursor:pointer}.date-control>button:hover{background:#fff8ee}.date-label{display:flex;align-items:center;gap:12px}.date-label>span{font-size:11px;color:#81877c}.date-label input{border:0;background:transparent;color:var(--ink);font:13px var(--mono);width:133px;cursor:pointer;outline:none}
.dashboard{display:grid;grid-template-columns:1.46fr 1fr;gap:18px;margin-top:20px}.sun-card,.daylight-card,.place-panel,.calendar-panel{background:var(--paper2);border:1px solid rgba(55,66,55,.08);border-radius:12px;box-shadow:var(--shadow)}.sun-card{min-height:306px;padding:24px 30px 17px;position:relative;overflow:hidden;background:linear-gradient(160deg,#fffdf8 22%,#fbf2e5 100%)}.sun-card-top{display:flex;justify-content:space-between;align-items:flex-start}.card-eyebrow{color:#979183;font:10px var(--mono);letter-spacing:1.5px;text-transform:uppercase}.sun-card h3,.daylight-card h3{margin:7px 0 0;font-size:17px;font-weight:600}.season-tag{border-radius:999px;padding:6px 10px;background:#f7e9d4;color:#ae7840;font-size:10px}.sun-arc{height:194px;position:relative;margin-top:7px}.sun-arc svg{width:100%;height:178px;overflow:visible}.arc-track{fill:none;stroke:#e7dbca;stroke-width:2}.arc-dash{fill:none;stroke:#eda667;stroke-width:2;stroke-dasharray:3 7}.horizon{stroke:#cfc6b8;stroke-width:1.5}.sun-orb{fill:#ed9457;filter:drop-shadow(0 0 8px rgba(238,141,80,.45))}.sun-glow{fill:#ed9457;opacity:.13}.orb-ray{stroke:#df9a59;stroke-width:2;stroke-linecap:round}.arc-time{position:absolute;top:116px;display:flex;flex-direction:column;gap:2px}.rise-time{left:4px;align-items:flex-start}.set-time{right:4px;align-items:flex-end}.arc-time strong{font:25px var(--mono);letter-spacing:-1px}.arc-time small{font-size:10px;color:#89877b}.sun-glyph{font-size:15px;color:var(--coral)}.arc-noon{position:absolute;left:50%;top:72px;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:4px;color:#81877b;font-size:10px;white-space:nowrap}.arc-noon strong{font:12px var(--mono);color:var(--ink)}.sun-card-bottom{position:absolute;bottom:16px;left:30px;right:30px;display:flex;align-items:center;justify-content:space-between;color:#89887f;font-size:10px}.calc-note{display:flex;align-items:center;gap:6px;font:9px var(--mono)}.calc-note i{width:6px;height:6px;background:#7c9b7e;border-radius:50%}
.daylight-card{min-height:306px;position:relative;overflow:hidden;padding:25px 28px;background:var(--night);color:#f8f1e6}.daylight-copy{position:relative;z-index:1}.daylight-card .card-eyebrow{color:#a6b1a5}.daylight-card h3{font-size:18px}.daylight-card p{margin:7px 0;color:#bdc4b9;font-size:11px;line-height:1.8}.daylight-ring{position:absolute;right:32px;top:56px;width:152px;height:152px;border-radius:50%;display:grid;place-items:center;background:conic-gradient(from -90deg,#f3ba6b 0deg 164deg,rgba(246,238,222,.15) 164deg 360deg)}.daylight-ring:before{content:'';position:absolute;inset:8px;border-radius:50%;background:var(--night)}.daylight-ring>div{position:relative;display:flex;flex-direction:column;align-items:center;gap:5px}.daylight-ring strong{font:21px var(--mono);letter-spacing:-1px}.daylight-ring strong span{font:10px var(--sans);color:#c2cabe;margin:0 3px}.daylight-ring small{color:#aab4a7;font-size:9px}.daylight-foot{position:absolute;left:28px;right:28px;bottom:21px;border-top:1px solid rgba(240,239,223,.16);padding-top:12px;display:flex;justify-content:space-between;color:#b8c0b4;font-size:10px}.daylight-foot b{font:11px var(--mono);color:#fff4e4;margin-left:5px}.sun-flare{position:absolute;bottom:-87px;right:-32px;width:220px;height:220px;border-radius:50%;border:1px solid rgba(244,188,112,.2)}.sun-flare:after{content:'';position:absolute;inset:17px;border:1px dashed rgba(244,188,112,.14);border-radius:50%}
.workspace{display:grid;grid-template-columns:1.06fr .94fr;gap:18px;margin-top:18px;align-items:stretch}.place-panel,.calendar-panel{min-height:562px;padding:24px 26px 19px}.section-heading{display:flex;align-items:flex-start;justify-content:space-between}.section-heading h3{font-size:18px;margin:6px 0 0}.panel-index{font:9px var(--mono);letter-spacing:1.1px;color:#a8a296;padding-top:4px}.tabs{display:flex;gap:19px;margin-top:21px;border-bottom:1px solid #eee7dc}.tab{position:relative;background:transparent;border:0;padding:0 0 11px;color:#919186;font-size:11px;cursor:pointer}.tab.active{color:var(--ink);font-weight:600}.tab.active:after{content:'';position:absolute;bottom:-1px;height:2px;background:var(--coral);left:0;right:0}.tab-body{height:371px;padding-top:16px}.tab-body.hidden{display:none}.searchbox{height:43px;display:flex;align-items:center;gap:10px;border:1px solid #e3ddd1;border-radius:6px;padding:0 12px;background:#fffefa}.searchbox svg{width:17px;height:17px;fill:none;stroke:#858a80;stroke-width:1.8}.searchbox input{flex:1;min-width:0;border:0;outline:none;background:transparent;color:var(--ink);font-size:12px}.searchbox input::placeholder{color:#aaa99f}.searchbox kbd{font-size:18px;color:#aba69a}.search-results{height:232px;overflow:auto;margin-top:9px}.result-row{width:100%;height:47px;display:flex;align-items:center;gap:11px;border:0;background:transparent;border-bottom:1px solid #f1ede5;text-align:left;cursor:pointer;padding:0 5px}.result-row:hover,.city-item:hover{background:#f8f5ee}.result-pin{width:27px;height:27px;display:grid;place-items:center;border-radius:50%;background:#f9eadd;color:#db8050;font-size:14px}.result-name{font-size:12px;font-weight:500}.result-region{margin-left:auto;color:#99968b;font-size:10px}.result-arrow{color:#b1aa9e;font-size:16px}.empty-state{padding:26px 8px;color:#99968b;font-size:11px;line-height:1.7}.popular-row{display:flex;align-items:center;gap:8px;margin-top:7px}.popular-row>span{font-size:10px;color:#aaa397;margin-right:1px}.popular-row button{border:1px solid #e8e0d4;border-radius:999px;background:transparent;padding:5px 10px;color:#6f786e;font-size:10px;cursor:pointer}.popular-row button:hover{border-color:#df9972;color:#bc6548}
.browse-columns{height:355px;display:grid;grid-template-columns:153px 1fr;gap:14px}.province-list{overflow:auto;display:flex;flex-direction:column;gap:3px;padding-right:3px}.province-item{display:flex;justify-content:space-between;align-items:center;text-align:left;border:0;background:transparent;padding:7px 9px;border-radius:5px;color:#73796f;font-size:11px;cursor:pointer}.province-item span:last-child{font:9px var(--mono);color:#aaa497}.province-item.active{background:#f7eee3;color:#b46646;font-weight:600}.city-list-wrap{min-width:0;border-left:1px solid #eee8dc;padding-left:13px}.city-list-title{display:flex;justify-content:space-between;color:#59635b;font-size:11px;font-weight:600;padding:7px 2px 11px}.city-list-title span{font-size:9px;font-weight:400;color:#a09b90}.city-list{height:310px;overflow:auto;display:flex;flex-direction:column}.city-item{display:flex;align-items:center;justify-content:space-between;min-height:34px;border:0;border-bottom:1px solid #f3efe8;background:transparent;text-align:left;padding:4px 7px;font-size:11px;cursor:pointer}.city-item small{font:9px var(--mono);color:#aaa497}.map-topline{display:flex;align-items:center;justify-content:space-between;margin:1px 0 10px}.map-topline>div:first-child{display:flex;flex-direction:column;gap:4px}.map-topline b{font-size:11px}.map-topline small{font-size:9px;color:#959286}.map-zoom{display:flex;gap:4px}.map-zoom button{width:27px;height:27px;border:1px solid #e5dfd4;background:#fffefa;border-radius:5px;color:#637064;cursor:pointer}.map-wrap{position:relative;width:100%;height:282px;border-radius:9px;overflow:hidden;background:#edf1e7}#chinaMap{width:100%;height:100%;cursor:crosshair;touch-action:none}.map-grid line{stroke:#d8e1d4;stroke-width:.7;stroke-dasharray:3 7}.province-shape{fill:#fffaf0;stroke:#d4d9cd;stroke-width:.62;vector-effect:non-scaling-stroke;transition:fill .2s}.province-shape:nth-child(3n){fill:#f5f3e8}.province-shape:hover{fill:#f9e0c8}.city-pin{fill:#657f6c;stroke:#fafff4;stroke-width:1.5;vector-effect:non-scaling-stroke;cursor:pointer}.city-pin:hover{fill:var(--coral);r:5}.active-pin{fill:var(--coral);stroke:#fff8ee;stroke-width:2;vector-effect:non-scaling-stroke;filter:url(#pinShadow)}.active-ring{fill:none;stroke:var(--coral);stroke-width:1;opacity:.62;vector-effect:non-scaling-stroke;animation:pulse 2s infinite}@keyframes pulse{0%{r:7;opacity:.6}100%{r:17;opacity:0}}.map-hint{position:absolute;left:11px;bottom:10px;padding:7px 9px;border-radius:999px;background:rgba(255,253,248,.92);font-size:9px;color:#67746c;box-shadow:0 2px 9px #34453210}.map-hint-dot{display:inline-block;width:6px;height:6px;border-radius:50%;background:#e88b50;margin-right:5px}.map-hint #mapCoord{color:#a09c90}.map-legend{display:flex;align-items:center;gap:14px;padding:9px 1px 0;color:#8d8d80;font-size:9px}.map-legend span{display:flex;align-items:center;gap:5px}.legend-city,.legend-selected{width:7px;height:7px;border-radius:50%;background:#657f6c}.legend-selected{background:var(--coral)}.map-attribution{margin-left:auto!important;font-size:8px!important;color:#a4a295}.place-foot{border-top:1px solid #eee9df;padding-top:13px;margin-top:3px;display:flex;gap:8px;align-items:center;color:#8d8b7f;font-size:9px}.place-foot-icon{color:#d58b56;font-size:13px}
.calendar-panel{display:flex;flex-direction:column}.calendar-summary{display:flex;align-items:center;justify-content:space-between;margin:19px 0 9px;color:#a09c91;font-size:9px}.calendar-summary>div{display:flex;align-items:center;gap:7px}.calendar-summary strong{font:10px var(--mono);color:#737d72}.calendar-summary>span{font:9px var(--mono);letter-spacing:.2px}.table-head,.day-row{display:grid;grid-template-columns:1.28fr .8fr .8fr .8fr;align-items:center}.table-head{height:30px;padding:0 11px;background:#f6f3ec;border-radius:5px;color:#9a978c;font-size:9px}.table-head span:not(:first-child),.day-row>span:not(:first-child){text-align:right}.day-table{height:360px;overflow:auto;margin-top:3px;scrollbar-width:thin;scrollbar-color:#ded5c6 transparent}.day-row{position:relative;min-height:33px;padding:0 11px;border-bottom:1px solid #f0ece4;color:#73796f;font-size:10px}.day-row.selected{background:#f8eee3;color:#704e3b;font-weight:600}.day-row.selected:before{content:'';position:absolute;left:0;top:5px;bottom:5px;width:2px;border-radius:2px;background:var(--coral)}.day-date{font:10px var(--mono)}.weekday{color:#a5a092;font:9px var(--sans);margin-left:4px}.day-row.selected .weekday{color:#bd8564}.daytime{font:10px var(--mono);color:#59685c}.daytime.set{color:#b1714e}.daybar{height:4px;margin-left:auto;background:#f1e4d1;border-radius:99px;width:75%;overflow:hidden}.daybar i{display:block;height:100%;background:linear-gradient(90deg,#f0c276,#e78353);border-radius:99px}.calendar-foot{display:flex;align-items:center;gap:6px;margin-top:auto;padding-top:12px;color:#999488;font-size:9px}.day-tick{width:12px;height:3px;background:linear-gradient(90deg,#f0c276,#e78353);border-radius:4px}.calendar-foot button{margin-left:auto;border:0;background:transparent;color:#ae6c4b;font-size:9px;cursor:pointer}
.method-section{display:grid;grid-template-columns:.75fr 1.65fr;gap:34px;padding:70px 28px 55px;border-top:1px solid #e2dbcf;margin-top:61px}.method-intro h2{font-size:31px;line-height:1.38;letter-spacing:-.7px;margin:17px 0 10px}.method-intro p{max-width:300px;font-size:12px;line-height:1.9;color:#7d8279}.method-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.method-card{position:relative;min-height:231px;padding:20px 17px 16px;border:1px solid #e5ded1;border-radius:9px;background:#fbf8f1}.method-num{position:absolute;right:15px;top:16px;color:#b9b2a5;font:9px var(--mono)}.method-icon{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;font-size:21px}.orbit-icon{background:#f6e9d7;color:#e19450}.compare-icon{background:#e7eee5;color:#69816d;font:22px var(--mono)}.place-icon{background:#f5e6e2;color:#d77b60;font-size:25px}.method-card h3{font-size:12px;margin:14px 0 8px}.method-card p{margin:0;color:#81847a;font-size:10px;line-height:1.8}.method-card a,.method-meta{display:inline-block;margin-top:12px;color:#b66e4e;font-size:9px;text-decoration:none}.method-card a:hover{text-decoration:underline}.method-meta{color:#8c978b}.method-footnote{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:16px 22px;border-radius:8px;background:#ebe9de;color:#7d8176}.method-footnote>div{display:flex;align-items:center;gap:12px}.method-footnote p{margin:0;font-size:10px;line-height:1.7}.footnote-star{color:#d58d53;font-size:18px}.method-footnote>span{white-space:nowrap;font:9px var(--mono);color:#999489}.sources{display:grid;grid-template-columns:220px 1fr;gap:20px;padding:36px 28px 44px;border-bottom:1px solid #e2dbcf}.source-title h3{margin:8px 0;font-size:17px}.source-items{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.source-items p{font-size:9px;line-height:1.8;color:#81847b;margin:0}.source-items b{color:#5f6b61}.source-items a{color:#b86f4f;text-decoration:none}footer{max-width:1336px;padding:25px 72px 35px;margin:auto;display:flex;align-items:center;gap:14px;color:#969386;font-size:10px}footer>span:last-child{margin-left:auto;font:9px var(--mono)}.footer-brand{text-decoration:none;color:var(--ink);font-size:18px;font-weight:700}
@media(max-width:1050px){main{padding:0 24px}.topbar{padding:0 26px}.dashboard{grid-template-columns:1fr 1fr}.workspace{grid-template-columns:1fr}.place-panel{min-height:530px}.calendar-panel{min-height:560px}.method-section{grid-template-columns:1fr;gap:18px}.method-intro p{max-width:600px}.hero-sun{right:18px;opacity:.75}.hero h1{font-size:38px}}
@media(max-width:650px){.topbar{height:65px;padding:0 16px}.brand-sub,.top-links{display:none}.today-button{padding:8px 11px;font-size:10px}main{padding:0 13px}.hero{min-height:240px;padding:25px 8px 10px}.hero h1{font-size:31px;line-height:1.4;margin-top:16px}.hero-copy>p{max-width:260px;font-size:11px;line-height:1.7}.hero-sun{width:220px;height:130px;right:-39px;bottom:-2px;opacity:.38;transform:scale(.74);transform-origin:right bottom}.query-head{padding:12px 8px;align-items:flex-start;gap:8px;flex-direction:column}.location-line{gap:9px;flex-wrap:wrap}.location-line h2{font-size:18px}.pin-icon{font-size:23px}.timezone-chip{font-size:9px;padding:5px 7px}.location-province{font-size:10px}.date-control{align-self:flex-end;margin-top:-3px}.date-label>span{font-size:9px}.date-label input{font-size:11px}.dashboard{grid-template-columns:1fr;gap:11px;margin-top:12px}.sun-card{min-height:280px;padding:20px 20px 16px}.sun-arc{height:178px}.sun-arc svg{height:162px}.arc-time{top:107px}.sun-card-bottom{left:20px;right:20px}.daylight-card{min-height:214px;padding:21px}.daylight-ring{width:129px;height:129px;right:22px;top:35px}.daylight-card p{max-width:145px}.daylight-foot{left:21px;right:21px;bottom:17px}.workspace{margin-top:11px;gap:11px}.place-panel,.calendar-panel{padding:19px 15px 16px;min-height:510px}.section-heading h3{font-size:16px}.tabs{gap:16px;margin-top:18px}.tab{font-size:10px}.tab-body{height:370px}.browse-columns{grid-template-columns:116px 1fr;gap:8px}.city-list-wrap{padding-left:8px}.map-wrap{height:260px}.map-attribution{font-size:7px!important}.table-head,.day-row{grid-template-columns:1.1fr .75fr .85fr .75fr;padding-left:7px;padding-right:7px}.day-row{font-size:9px}.day-date{font-size:9px}.daytime{font-size:9px}.weekday{margin-left:2px}.calendar-panel{min-height:520px}.day-table{height:350px}.method-section{padding:49px 8px 33px;margin-top:39px}.method-intro h2{font-size:27px}.method-cards{grid-template-columns:1fr;gap:8px}.method-card{min-height:0;padding:16px}.method-card p{max-width:430px}.method-card h3{margin-top:10px}.method-footnote{padding:13px;align-items:flex-start}.method-footnote p{font-size:9px}.method-footnote>span{font-size:8px}.sources{grid-template-columns:1fr;padding:28px 8px 34px;gap:7px}.source-items{grid-template-columns:1fr;gap:8px}.source-items p{font-size:9px}footer{padding:23px 18px 30px;gap:9px;font-size:9px}footer>span:last-child{font-size:8px}}