*{box-sizing:border-box}html{min-height:100%;background:#e7d8cb}body{--ink:#453e39;--muted:#746b65;--glass:rgba(255,253,247,.49);--line:rgba(83,65,48,.13);--accent:#906851;--sky-a:#c8dce2;--sky-b:#f2dcc1;--sky-c:#eac4ae;--hill-a:#b8c4ad;--hill-b:#8faaa0;margin:0;min-height:100svh;font:14px/1.6 -apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei",sans-serif;color:var(--ink);background:linear-gradient(175deg,var(--sky-a),var(--sky-b) 66%,var(--sky-c));transition:background 2s,color 1s}body[data-scene=night]{--ink:#edf0f4;--muted:#b0bfd1;--glass:rgba(30,45,67,.47);--line:rgba(211,226,243,.15);--accent:#c5d5ee;--sky-a:#111b32;--sky-b:#30465f;--sky-c:#637586;--hill-a:#304b53;--hill-b:#203b44}body[data-scene=dawn]{--sky-a:#ada7ce;--sky-b:#f3cfcc;--sky-c:#e9bb9a;--hill-a:#a1b8ae;--hill-b:#809f99}body[data-scene=dusk]{--sky-a:#b6b8d6;--sky-b:#f0c3bf;--sky-c:#dfa580;--hill-a:#98aaa6;--hill-b:#748d89}body[data-weather=rain],body[data-weather=storm]{--sky-a:#899ca8;--sky-b:#b9c7ce;--sky-c:#ced1ca;--hill-a:#77979b;--hill-b:#577a81}body[data-scene=night][data-weather=rain],body[data-scene=night][data-weather=storm]{--sky-a:#101c2b;--sky-b:#263d50;--sky-c:#4b6169;--hill-a:#304c52;--hill-b:#1c353d}body[data-weather=snow]{--sky-a:#b4c6d4;--sky-b:#e2e9ed;--sky-c:#e5e8df;--hill-a:#b2c5c6;--hill-b:#8eafb3}body[data-scene=night][data-weather=snow]{--sky-a:#1c2e47;--sky-b:#465e76;--sky-c:#8094a5}body[data-weather=fog]{--sky-a:#bec6c4;--sky-b:#deded4;--sky-c:#d8d3c4}.scenery{position:fixed;inset:0;overflow:hidden;pointer-events:none;isolation:isolate}.sky-glow{position:absolute;width:85vw;height:85vw;right:-20vw;top:-50vw;background:radial-gradient(circle,rgba(255,239,185,.45),transparent 67%);transition:opacity 2s}.sun{position:absolute;width:100px;height:100px;border-radius:50%;right:18%;top:14%;background:#fff6cf;box-shadow:0 0 60px 25px #ffedaf77,0 0 170px 80px #ffe4a333;animation:sun-breathe 12s ease-in-out infinite;transition:opacity 2s}.moon{position:absolute;width:82px;height:82px;border-radius:50%;right:18%;top:14%;background:radial-gradient(circle at 30% 30%,#fffce6,#cbd9e9);box-shadow:0 0 80px 15px #c1d8ef33;opacity:0;transition:opacity 2s}.moon:after{content:"";position:absolute;inset:10px 15px 38px 38px;background:#8b9db522;border-radius:50%;box-shadow:-24px 30px 0 3px #8b9db51a}.stars{position:absolute;inset:0;opacity:0;transition:opacity 2s}.star{position:absolute;width:2px;height:2px;background:#f4f5e3;border-radius:50%;animation:twinkle 5s ease-in-out infinite alternate}body[data-scene=night] .moon,body[data-scene=night] .stars{opacity:1}body[data-scene=night] .sun,body[data-scene=night] .sky-glow{opacity:0}.cloud{position:absolute;width:420px;height:110px;background:#fff9;border-radius:50%;filter:blur(22px);animation:drift 65s ease-in-out infinite alternate;opacity:.28;transition:opacity 2s}.cloud-one{left:4%;top:14%;transform:rotate(-6deg)}.cloud-two{right:-100px;top:32%;width:600px;animation-delay:-25s}.cloud-three{left:18%;top:52%;width:300px;height:70px;animation-delay:-48s}body[data-scene=night] .cloud{opacity:.08}body[data-weather=cloudy] .cloud{opacity:.65}body[data-weather=rain] .cloud,body[data-weather=storm] .cloud,body[data-weather=fog] .cloud{opacity:.75}body[data-weather=rain] .sun,body[data-weather=storm] .sun,body[data-weather=fog] .sun{opacity:.1}body[data-weather=cloudy] .sun{opacity:.55}body[data-weather=rain] .moon,body[data-weather=storm] .moon,body[data-weather=fog] .moon{opacity:.15}.hill{position:absolute;width:135%;height:38vh;min-height:180px;border-radius:50% 55% 0 0;bottom:-25vh;background:var(--hill-a);transition:background 2s;transform:rotate(-7deg);left:-15%;opacity:.7}.hill-front{bottom:-30vh;background:var(--hill-b);transform:rotate(8deg);left:-8%;height:39vh;opacity:.85}.precipitation{position:absolute;inset:-100px -10%;opacity:0;transition:opacity 2s}.drop{position:absolute;top:-10%;width:1px;height:60px;background:linear-gradient(transparent,#e9f5ffaa);animation:rain 1.3s linear infinite;transform:rotate(15deg)}body[data-weather=rain] .precipitation,body[data-weather=storm] .precipitation,body[data-weather=snow] .precipitation{opacity:.6}body[data-weather=snow] .drop{width:5px;height:5px;border-radius:50%;background:#fffd;animation-name:snow;animation-duration:12s!important}.grain{position:absolute;inset:0;opacity:.045;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.7' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' opacity='.7' filter='url(%23n)'/%3E%3C/svg%3E")}.page{position:relative;max-width:1440px;margin:0 auto;padding:38px 6vw 22px;min-height:100svh;display:flex;flex-direction:column}.header{display:flex;align-items:center;justify-content:space-between;gap:16px}.brand{display:flex;gap:12px;align-items:center;color:var(--ink);font:600 23px Georgia,serif;text-decoration:none;letter-spacing:.5px}.brand-mark{width:38px;height:44px;border:1px solid var(--line);border-radius:20px 20px 4px 4px;display:grid;place-items:center;font-size:28px;font-style:italic}.brand small{display:block;font:10px/1.6 sans-serif;letter-spacing:1.8px;margin-top:3px;color:var(--muted)}.header-actions{display:flex;gap:12px;align-items:center}button,input{font:inherit}button{cursor:pointer}button:focus-visible,a:focus-visible,input:focus-visible{outline:2px solid var(--accent);outline-offset:4px}button:disabled{cursor:wait;opacity:.65}.quiet-button,.city-button{border:0;background:transparent;color:var(--muted);padding:9px 12px;border-radius:25px;font-size:12px}.city-button{border:1px solid var(--line);background:var(--glass);color:var(--ink);padding:9px 18px}.city-button>span:first-child{font-size:18px;vertical-align:middle;margin-right:4px}main{display:grid;grid-template-columns:minmax(0,1fr) 300px;align-items:center;gap:70px;flex:1;padding:95px 0 85px}.moment{padding-bottom:10px}.eyebrow{font-size:10px;font-weight:600;letter-spacing:2.7px;color:var(--muted);text-transform:uppercase}.live-dot{display:inline-block;width:5px;height:5px;background:#83a793;border-radius:50%;margin-right:10px;vertical-align:middle}.date{font-size:13px;color:var(--muted);letter-spacing:1.4px;margin:25px 0 0}.clock{font-size:clamp(70px,8.8vw,120px);font-weight:200;letter-spacing:-5px;line-height:1.2;font-variant-numeric:tabular-nums;margin:0 0 25px;white-space:nowrap}.colon{padding:0 5px;font-weight:200;opacity:.55}.seconds{font-size:24px;letter-spacing:0;margin-left:14px;opacity:.45}.moment h1{font:400 clamp(22px,2.8vw,34px)/1.7 "Songti SC","SimSun",serif;letter-spacing:3px;margin:0 0 12px}.moment-copy{font-size:13px;color:var(--muted);letter-spacing:1px;margin:0;line-height:2}.signature{display:flex;align-items:center;gap:12px;font-size:11px;margin-top:46px;color:var(--muted);letter-spacing:2px}.signature>span:first-child{display:inline-block;width:25px;height:1px;background:var(--muted);opacity:.4}.signature-en{font:italic 12px Georgia,serif;letter-spacing:.5px;opacity:.65}.weather-card{padding:27px 28px 20px;border:1px solid #ffffff33;border-radius:22px;background:var(--glass);backdrop-filter:blur(24px);box-shadow:0 15px 55px #293e4910}.card-top{display:flex;align-items:center;justify-content:space-between}.weather-icon{font-size:31px;line-height:1;color:var(--accent)}.temperature{font-size:65px;line-height:1.4;font-weight:200;letter-spacing:-3px;margin-top:15px}.degree{font-size:40px;vertical-align:top;letter-spacing:0}.weather-name{font-size:15px;margin:0 0 9px}.weather-description{font-size:11px;line-height:1.9;color:var(--muted);min-height:42px;margin:0 0 20px}.weather-details{display:flex;justify-content:space-between;gap:10px;border-top:1px solid var(--line);padding-top:17px;margin-bottom:20px;color:var(--muted);font-size:10px}.location-button{width:100%;border:1px solid var(--line);color:var(--ink);padding:11px;border-radius:10px;background:transparent;font-size:12px}.location-button:hover{background:#ffffff22}.weather-notice{font-size:10px;text-align:center;color:var(--muted);margin:12px 0 0;line-height:1.7;min-height:17px}footer{display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;font-size:10px;color:var(--muted);line-height:1.9}footer a{color:inherit;text-decoration:none}footer a:hover{text-decoration:underline}.footer-divider{margin:0 10px;opacity:.5}.footer-right{display:flex;gap:18px;flex-wrap:wrap}dialog{width:min(480px,calc(100vw - 32px));background:#fbf8f4;color:#453e39;border:1px solid #fff;border-radius:22px;padding:30px;box-shadow:0 40px 100px #0003}dialog::backdrop{background:#12203566;backdrop-filter:blur(7px)}.dialog-heading{display:flex;justify-content:space-between;align-items:start;gap:14px}dialog h2{font:400 20px/1.7 "Songti SC","SimSun",serif;margin:12px 0 28px}dialog label{font-size:12px;display:block;margin-bottom:8px}.close-button{border:0;background:none;font-size:26px;color:#81746b;line-height:1}.city-search{display:flex;gap:8px}.city-search input{min-width:0;flex:1;border:1px solid #ddd1c7;border-radius:9px;background:white;padding:11px;font-size:13px}.city-search button{background:#675b50;color:white;border:0;border-radius:9px;padding:0 18px}.dialog-help{font-size:11px;color:#85786e;margin:12px 0}.city-result{display:block;text-align:left;width:100%;padding:12px 9px;margin-top:4px;border:0;border-radius:8px;background:transparent;color:#453e39}.city-result:hover{background:#eee8e0}.city-result small{display:block;color:#8e8075;margin-top:3px}.noscript{position:fixed;bottom:10px;left:15px;font-size:12px}@keyframes sun-breathe{50%{box-shadow:0 0 85px 35px #ffedaf77,0 0 200px 90px #ffe4a333}}@keyframes drift{to{translate:100px 10px}}@keyframes twinkle{to{opacity:.2}}@keyframes rain{to{translate:-12vw 125vh}}@keyframes snow{to{translate:5vw 125vh;rotate:140deg}}body.reduce-motion *,body.reduce-motion *:before,body.reduce-motion *:after{animation:none!important;transition:none!important}body.reduce-motion .drop{top:40%;opacity:.25}body.reduce-motion .precipitation{opacity:.15}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}.precipitation{display:none}}@media(min-width:1450px){.page{padding-left:70px;padding-right:70px}}@media(max-width:800px){.page{padding:26px 7vw 20px}main{grid-template-columns:1fr;gap:40px;padding:80px 0 55px}.clock{font-size:96px}.weather-card{max-width:420px;width:100%;padding:22px}.card-top{float:right;display:block;text-align:right}.card-top .eyebrow{display:block;margin-bottom:15px}.temperature{margin:0;line-height:1.1}.weather-description{min-height:0}.sun,.moon{right:12%;top:16%;scale:.8}.header-actions{gap:2px}.quiet-button{font-size:10px;padding:6px}.city-button{padding:7px 12px;font-size:11px}.brand{font-size:20px}.brand small{font-size:8px;letter-spacing:1px}.brand-mark{width:30px;height:36px}.signature{margin-top:28px}.hill-back{bottom:-24vh}.hill-front{bottom:-29vh}.footer-right{gap:10px}footer{font-size:9px}.moment h1{font-size:25px;letter-spacing:1px}}@media(max-width:380px){.clock{font-size:80px}.seconds{font-size:19px}.header-actions{flex-direction:column;align-items:flex-end}.moment h1{font-size:21px}}
body:not([data-scene=night])[data-weather] .moon{opacity:0}body[data-scene=night][data-weather] .sun{opacity:0}
.page footer{color:var(--ink);opacity:.75}
