/* The utility windows share MEDAILY AI's night palette in either site theme. */
#utility-dialog.utility-dialog{--surface:#101a2d;--surface-2:#19253b;--ink:#eff5ff;--muted:#a6b5ce;--purple:#a9baff;--line:#adc8ff24;color-scheme:dark;border-color:#b1caff30;border-radius:26px;background:radial-gradient(ellipse at 8% 0,#16416b60,transparent 42%),radial-gradient(ellipse at 100% 35%,#44245f45,transparent 48%),#090f1e;box-shadow:0 30px 120px #02061199,inset 0 1px 0 #e3edff12;isolation:isolate;scrollbar-color:#7088b658 transparent}
#utility-dialog::backdrop{background:#0307159c;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
#utility-dialog[open]{animation:utility-reveal .4s cubic-bezier(.16,1,.3,1)}
#utility-dialog .utility-dialog-header{background:#0d1529ed;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border-color:#b3caff1c}
#utility-dialog .utility-dialog-header h2{font-size:23px;letter-spacing:-.4px;color:#eff5ff}
#utility-dialog .utility-dialog-header .eyebrow{color:#9db9ec;letter-spacing:3px}
#utility-dialog .utility-dialog-header .icon-button{border:1px solid var(--line);background:#9cbeff0c;color:#dbe7ff;border-radius:50%}
#utility-dialog .utility-card{background:linear-gradient(135deg,#80b9ff09,#c199ff06),#10192bcc;border-color:#aecbff26;box-shadow:inset 0 1px 0 #f0f6ff08;border-radius:18px}
#utility-dialog .utility-primary{background:#627ada;color:#fff}
#utility-dialog button{transition:background .2s,border-color .2s,color .2s,transform .2s}
#utility-dialog input,#utility-dialog select{background:#0c1427;color:#eff4ff;border-color:#a4c2ff30;border-radius:11px}
#utility-dialog input::placeholder{color:#8fa1bf}
#utility-dialog :is(input,select):focus{border-color:#9acbff88;box-shadow:0 0 0 3px #91bdff0d}
#utility-dialog .history-periods,#utility-dialog .weather-map-mode{padding:5px;background:#080f21b3;border:1px solid #acc8ff18;border-radius:13px}
#utility-dialog :is(.history-periods,.weather-map-mode) button[aria-pressed=true]{background:linear-gradient(130deg,#4b74b448,#906ac438);box-shadow:inset 0 1px 0 #e1eaff12,0 2px 14px #0003;color:#d6e4ff}
#utility-dialog .utility-badge{background:linear-gradient(135deg,#5a96dd25,#b287f72b);color:#c4d8ff;border-color:#b8cfff32}
#utility-dialog .exchange-converter{position:relative;overflow:hidden}
#utility-dialog .exchange-converter:before{content:'';position:absolute;right:-80px;top:-140px;width:310px;height:310px;pointer-events:none;border-radius:50%;background:radial-gradient(circle,#7268ef22,transparent 70%);animation:exchange-aura 12s ease-in-out infinite}
#utility-dialog .converter-result output{color:#d2e0ff;letter-spacing:-1px;text-shadow:0 0 24px #8aafff35}
#utility-dialog .history-change.is-up strong{color:#b3c6ff}#utility-dialog .history-change.is-down strong{color:#78e8ca}
#utility-dialog .chart-trace{stroke-dasharray:1;stroke-dashoffset:0;animation:chart-draw 1.2s ease both;filter:drop-shadow(0 0 4px #9daeff40)}
#utility-dialog .chart-area{animation:utility-fade 1.3s ease both}#utility-dialog .chart-end{animation:chart-glow 3s ease-in-out infinite}
#utility-dialog .chart-tooltip{color:#bdd9ff}
#utility-dialog .rate-row{border-bottom-color:#b5d0ff14;border-radius:10px}
#utility-dialog .rate-row:hover{background:#a8caff0a;transform:translateX(2px)}
#utility-dialog .rate-row[aria-pressed=true]{background:linear-gradient(100deg,#669dff16,#bf8bff0b);box-shadow:inset 2px 0 0 #a8caff}
#utility-dialog .currency-symbol{background:#9ab8ff0b;border-color:#adcaff24;border-radius:12px}
#utility-dialog .currency-special.xau{color:#f8d899;background:#b2903219}#utility-dialog .currency-special.xag{color:#c5d9f1;background:#a2b9da14}
#utility-dialog .all-rates-list{scrollbar-color:#6c86b256 transparent}
#utility-dialog .weather-toolbar .utility-intro{color:#e3edff}
#utility-dialog .music-toggle{color:#c4d6f5;background:#b1caff08;border:1px solid #adcaff20}
#utility-dialog .music-toggle.is-on{color:#b9d7ff;border-color:#9fc6ff60;box-shadow:0 0 22px #5f8cdd18}
#utility-dialog .music-toggle .brand-toggle{background:linear-gradient(135deg,#456bb9,#876aca);border-color:#d4e8ff33;box-shadow:0 0 15px #8aabff22}
#utility-dialog .ub-hourly-card{background:linear-gradient(155deg,#25426980,#10213780);border-color:#a5cbff20;border-radius:13px}
#utility-dialog .ub-hourly-card.is-night{background:radial-gradient(1px 1px at 80% 18%,#c5e4ff 99%,transparent),radial-gradient(1px 1px at 18% 30%,#d9d2ff 99%,transparent),linear-gradient(155deg,#17213c,#120f27);border-color:#ada2e82b}
#utility-dialog .ub-hourly-card time>strong{color:#ecf5ff}#utility-dialog .ub-hourly-temp{font-weight:400}
#utility-dialog .weather-glyph{color:#ffdc99;filter:drop-shadow(0 0 7px #ffc56b30)}
#utility-dialog .weather-glyph.is-night{color:#d0ccff;filter:drop-shadow(0 0 7px #aaa2ff30)}
#utility-dialog .weather-glyph:is(.cloud,.fog){color:#bacbdf}#utility-dialog .weather-glyph:is(.snow,.rain,.storm){color:#b3dcff}
#utility-dialog .weather-glyph.unknown{color:var(--muted);filter:none}
#utility-dialog .weather-map-section{background:radial-gradient(ellipse at 65% 35%,#273b5744,transparent 70%),#0d1629;border-color:#b4d0ff20;border-radius:19px}
#utility-dialog .aimag-shape{fill:#263a57;stroke:#91b4e33b;stroke-width:1.3}
#utility-dialog .aimag-region:nth-child(3n) .aimag-shape,#utility-dialog .aimag-shape.aimag-region:nth-child(3n){fill:#253a53}
#utility-dialog .aimag-region:nth-child(3n + 1) .aimag-shape,#utility-dialog .aimag-shape.aimag-region:nth-child(3n + 1){fill:#30425e}
#utility-dialog .aimag-region:hover .aimag-shape,#utility-dialog .aimag-shape.aimag-region:hover{fill:#476485}
#utility-dialog .aimag-region[aria-pressed=true] .aimag-shape,#utility-dialog .aimag-shape.aimag-region[aria-pressed=true]{fill:#5075a8;stroke:#b7dbff;stroke-width:1.7}
#utility-dialog .aimag-label rect{fill:#132039;fill-opacity:.95;stroke:#8eb3ed5c}#utility-dialog .aimag-label text{fill:#ecf4ff}
#utility-dialog .aimag-region[aria-pressed=true] .aimag-label rect{fill:#526b9e;stroke:#bddaff;fill-opacity:1}
#utility-dialog .aimag-region[aria-pressed=true] .aimag-label text{fill:#fff}
#utility-dialog .mongolia-weather-map[data-mode=night] .aimag-shape{fill:#252a47;stroke:#a9adf12b}
#utility-dialog .mongolia-weather-map[data-mode=night] .aimag-region[aria-pressed=true] .aimag-shape,#utility-dialog .mongolia-weather-map[data-mode=night] .aimag-shape.aimag-region[aria-pressed=true]{fill:#6c64a9;stroke:#d0c9ff}
#utility-dialog .aimag-leader{stroke:#a5c9ef77}#utility-dialog .aimag-anchor{fill:#a1cfff;stroke:#14223b}
#utility-dialog .forecast-day{border-color:#aac8ff26;border-radius:15px;background:#0c1526}
#utility-dialog .forecast-day>header{background:#26365085;border-bottom:1px solid #abcaff12}
#utility-dialog .forecast-half{position:relative;isolation:isolate;overflow:hidden;min-height:160px}
#utility-dialog .forecast-half.day{background:linear-gradient(155deg,#28445f99,#172539)}
#utility-dialog .forecast-half.night{background:radial-gradient(1px 1px at 78% 17%,#c9dfff 99%,transparent),radial-gradient(1px 1px at 35% 33%,#e6d6ff 99%,transparent),linear-gradient(155deg,#191e39,#100f22)}
#utility-dialog .forecast-half-label{display:inline-flex;align-items:center;gap:5px;color:#c0d2ed;font-size:10px}
#utility-dialog .forecast-half-label:before{content:'☀';color:#ffdfa0;font-size:12px}#utility-dialog .forecast-half.night .forecast-half-label:before{content:'☾';color:#cfceff}
#utility-dialog .forecast-half.night .forecast-half-label{color:#bebbe5}#utility-dialog .forecast-half>p{color:#bac8dd}
#utility-dialog .forecast-half[data-weather=snow]:after{content:'';position:absolute;z-index:-1;inset:-30px 0 0;pointer-events:none;background:radial-gradient(2px 2px at 12% 10%,#d9ecff8a 99%,transparent),radial-gradient(1px 1px at 57% 35%,#d9ecff8a 99%,transparent),radial-gradient(2px 2px at 80% 55%,#d9ecff5c 99%,transparent);background-size:110px 80px;animation:forecast-snow 6s linear infinite}
#utility-dialog .forecast-half:is([data-weather=rain],[data-weather=storm]):after{content:'';position:absolute;z-index:-1;inset:0;pointer-events:none;background:repeating-linear-gradient(108deg,transparent 0 32px,#c1e5ff0b 33px 34px,transparent 35px 64px);animation:forecast-rain 1.3s linear infinite}
#utility-dialog .province-weather-card{background:#b9d5ff04;border-color:#b4d0ff1c;border-radius:12px}
#utility-dialog .province-weather-card:hover,#utility-dialog .province-weather-card[aria-pressed=true]{background:linear-gradient(135deg,#679ff21c,#bd9dfb0e);border-color:#a9cfff68}
#utility-dialog .province-weather-values>span:first-child{color:#e9d6a9}#utility-dialog .province-weather-values>span:last-child{color:#c7c6f5}
/* A contained animated sky follows the selected location and forecast period. */
.weather-sky{position:relative;isolation:isolate;overflow:hidden;min-height:292px;margin:20px 0;border:1px solid #b9d7ff2b;border-radius:22px;background:linear-gradient(150deg,#164d708f,#1b3d608f 45%,#1e2745);box-shadow:inset 0 1px 0 #e5f7ff16,0 12px 40px #0308162b;transition:background 1s}
.weather-sky[data-period=night]{background:radial-gradient(ellipse at 74% 12%,#2a236955,transparent 65%),linear-gradient(155deg,#070f29,#10152f 55%,#1b2542)}
.weather-sky:is([data-weather=rain],[data-weather=storm]){background:linear-gradient(150deg,#142339,#243c5480,#152234)}
.weather-sky[data-weather=snow]{background:linear-gradient(150deg,#243d56,#36475d,#172439)}
.weather-sky[data-weather=fog]{background:linear-gradient(150deg,#253a4d,#293b4f,#1b2a42)}
.weather-scene-sky{position:absolute;inset:0;pointer-events:none;overflow:hidden}
.weather-scene-sky:after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#0b142964 0,transparent 70%),linear-gradient(0deg,#070e2855,transparent 40%)}
.sky-stars,.sky-precipitation{position:absolute;inset:0}
.sky-star{position:absolute;left:var(--x);top:var(--y);width:var(--size);height:var(--size);border-radius:50%;background:#e4eeff;box-shadow:0 0 8px #cadcff88;animation:sky-twinkle 5s ease-in-out var(--delay) infinite}
.sky-star:nth-child(7n):after{content:'';position:absolute;inset:-3px;background:#daeaffad;clip-path:polygon(50% 0,58% 40%,100% 50%,58% 58%,50% 100%,42% 58%,0 50%,42% 40%)}
.sky-meteor{position:absolute;left:var(--x);top:var(--y);width:110px;height:1px;border-radius:50%;background:linear-gradient(90deg,transparent,#d5eaff);filter:drop-shadow(0 0 3px #b5cfff);opacity:0;transform:rotate(-35deg);animation:sky-shoot 14s linear var(--delay) infinite}
.weather-sky:not([data-period=night]) .sky-stars{display:none}
.weather-sky:is([data-weather=rain],[data-weather=snow],[data-weather=storm],[data-weather=fog]) .sky-stars{display:none}
.weather-sky[data-weather=cloud] .sky-stars{opacity:.2}.weather-sky[data-weather=partly] .sky-stars{opacity:.65}
.sky-luminary{position:absolute;right:16%;top:34px;width:94px;height:94px;border-radius:50%;background:radial-gradient(circle at 35% 28%,#fff6d7,#ffdc91 65%,#eeb566);box-shadow:0 0 35px #ffe7b033,0 0 100px 35px #fac3791c;animation:sky-sun 9s ease-in-out infinite}
.weather-sky[data-period=night] .sky-luminary{width:72px;height:72px;background:radial-gradient(circle at 35% 28%,#eef5ff,#c2cbed);box-shadow:0 0 40px #b9c8ff28,0 0 100px #b6c9ff12;animation:sky-moon 12s ease-in-out infinite}
.weather-sky[data-period=night] .sky-luminary:after{content:'';position:absolute;left:-13px;top:-12px;width:67px;height:67px;border-radius:50%;background:#101530}
.weather-sky:is([data-weather=cloud],[data-weather=fog]) .sky-luminary{opacity:.3;filter:blur(7px)}
.weather-sky:is([data-weather=rain],[data-weather=storm],[data-weather=snow]) .sky-luminary{display:none}.weather-sky[data-weather=unknown] .sky-luminary{opacity:.2}
.sky-cloud{position:absolute;width:290px;height:70px;top:48px;right:0;border-radius:50%;background:radial-gradient(ellipse,#b8d7ed48,transparent 72%);filter:blur(12px);animation:sky-cloud-drift 25s ease-in-out infinite;opacity:0}
.sky-cloud-two{top:106px;right:16%;width:420px;animation-duration:33s;animation-direction:reverse;opacity:0}.sky-cloud-three{top:-30px;right:38%;width:470px;animation-duration:40s;opacity:0}
.weather-sky:is([data-weather=cloud],[data-weather=partly],[data-weather=rain],[data-weather=snow],[data-weather=storm]) .sky-cloud{opacity:1}
.weather-sky[data-weather=partly] .sky-cloud{opacity:.5}
.sky-particle{position:absolute;left:var(--x);top:-40px;width:1px;height:28px;background:linear-gradient(transparent,#b9e2ff80);animation:sky-rain var(--duration) linear var(--delay) infinite}
.weather-sky[data-weather=snow] .sky-particle{width:var(--size);height:var(--size);border-radius:50%;background:#f2f8ff;opacity:.7;box-shadow:0 0 5px #deefff33;animation-name:sky-snow}
.sky-fog{position:absolute;inset:30% -15% -10%;background:radial-gradient(ellipse,#cfdfed26,transparent 65%);filter:blur(25px);opacity:0;animation:sky-cloud-drift 19s ease-in-out infinite}.weather-sky[data-weather=fog] .sky-fog{opacity:1}
.sky-horizon{position:absolute;inset:68% -10% -20%;background:radial-gradient(ellipse,#6080a52b,transparent 70%);filter:blur(15px)}
.weather-scene-copy{position:relative;z-index:1;padding:25px 30px;max-width:100%;text-shadow:0 1px 12px #01071d35;animation:utility-fade .65s ease}
.weather-scene-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:15px}
.weather-scene-kicker{font-size:9px;letter-spacing:2.2px;color:#ccdcf0}
#utility-dialog .weather-scene-heading h3{font-size:25px;font-weight:400;letter-spacing:-.4px;margin:5px 0 0;line-height:1.4;color:#f0f7ff}
.weather-scene-period{font-size:11px;color:#e3edff;background:#0d153749;border:1px solid #deedff2b;border-radius:20px;padding:7px 11px;white-space:nowrap;backdrop-filter:blur(12px)}
.weather-scene-temperature{font-size:72px;font-weight:400;line-height:1.18;letter-spacing:-4px;margin:10px 0 0;color:#fff;font-variant-numeric:tabular-nums}
.weather-scene-condition{font-size:14px;color:#ecf4ff;line-height:1.6;margin:0 0 14px}
.weather-scene-stats{display:flex;flex-wrap:wrap;gap:10px;font-size:10px;color:#bfcee5}
.weather-scene-stats>span{padding:7px 10px;border:1px solid #c5deff20;background:#080e2640;border-radius:9px;backdrop-filter:blur(10px)}
.weather-scene-stats b{font-weight:500;color:#eff7ff;margin-left:5px}
.weather-scene-foot{font-size:9px;line-height:1.5;color:#b4c4de;margin-top:14px;letter-spacing:.2px}
#utility-dialog:not([open]) *,#utility-dialog[data-motion=paused] *{animation-play-state:paused!important}
@keyframes utility-reveal{from{opacity:0;transform:translateY(15px) scale(.986)}to{opacity:1;transform:none}}
@keyframes utility-fade{from{opacity:0}to{opacity:1}}
@keyframes exchange-aura{50%{transform:translate(-30px,50px) scale(1.2);opacity:.6}}
@keyframes chart-draw{from{stroke-dashoffset:1}to{stroke-dashoffset:0}}
@keyframes chart-glow{50%{filter:drop-shadow(0 0 5px #b4cbff)}}
@keyframes sky-twinkle{0%,100%{opacity:.35;transform:scale(.7)}45%{opacity:1;transform:scale(1.15)}}
@keyframes sky-shoot{0%,5%{opacity:0;transform:translate(60px,-40px) rotate(-35deg)}7%{opacity:.9}13%{opacity:0;transform:translate(-380px,260px) rotate(-35deg)}100%{opacity:0;transform:translate(-380px,260px) rotate(-35deg)}}
@keyframes sky-rain{to{transform:translate(-100px,410px) rotate(12deg)}}
@keyframes sky-snow{0%{transform:translate(0,0);opacity:0}10%{opacity:.85}90%{opacity:.75}100%{transform:translate(var(--drift),400px);opacity:0}}
@keyframes sky-cloud-drift{50%{transform:translate(-40px,8px) scale(1.15)}}
@keyframes sky-sun{50%{box-shadow:0 0 50px #ffe7b048,0 0 120px 40px #fac37928;transform:scale(1.04)}}
@keyframes sky-moon{50%{transform:translateY(-5px);filter:brightness(1.07)}}
@keyframes forecast-snow{to{background-position:12px 80px}}
@keyframes forecast-rain{to{background-position:-64px 0}}
@media(max-width:740px){
 #utility-dialog.utility-dialog{border-radius:23px;max-height:94dvh}#utility-dialog .utility-dialog-header h2{font-size:20px}
 .weather-sky{min-height:285px;margin-block:16px;border-radius:19px}.weather-scene-copy{padding:22px 20px}.weather-scene-temperature{font-size:65px;margin-top:17px}#utility-dialog .weather-scene-heading h3{font-size:22px}
 .weather-scene-period{font-size:9px;padding:6px 9px}.weather-scene-kicker{font-size:8px;letter-spacing:1.7px}.weather-scene-condition{font-size:12px}.weather-scene-stats{font-size:9px;gap:7px}
 .sky-luminary{right:12%;top:75px;width:75px;height:75px}.weather-sky[data-period=night] .sky-luminary{width:61px;height:61px}.weather-sky[data-period=night] .sky-luminary:after{width:57px;height:57px}
 #utility-dialog .forecast-half{min-height:164px}#utility-dialog .rate-row:hover{transform:none}
}
@media(prefers-reduced-motion:reduce){#utility-dialog,#utility-dialog *,#utility-dialog *:before,#utility-dialog *:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.sky-meteor{display:none}.sky-particle{top:var(--x)}.sky-star{opacity:.7}}
