.weather-card{border-radius:26px;padding:18px 20px;margin-top:16px}
.weather-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}
.weather-heading p{font-size:9px;color:var(--muted);margin:0}
.weather-heading h3{font-size:12px;letter-spacing:0;margin:2px 0 0}
.weather-heading button{border:0;background:rgba(255,255,255,.35);border-radius:12px;padding:7px 10px;font-size:9px}
.weather-content{display:flex;align-items:center;gap:12px;margin-top:15px;min-height:49px}
.weather-symbol{width:43px;height:43px;border-radius:15px;display:grid;place-items:center;background:rgba(255,255,255,.34);font-size:22px}
.weather-content div{display:grid;gap:2px}
.weather-content strong{font-size:11px;font-weight:600}
.weather-content small{font-size:9px;color:var(--muted)}
.weather-content[data-ready="true"] strong{font-size:20px;font-weight:450;letter-spacing:-.03em}
.weather-content[data-ready="true"] small{font-size:9px}
.days button{font:inherit;color:inherit;border:0;background:transparent;font-size:10px;line-height:28px;min-height:28px;display:grid;place-items:center;border-radius:50%;padding:0}
.days button:hover{background:rgba(255,255,255,.48)}
.days button.current{box-shadow:inset 0 0 0 1px rgba(106,131,147,.5)}
.days button.selected{background:#6a8393;color:white;width:28px;justify-self:center}
.days button.current.selected{box-shadow:none}
#weather-dialog{width:min(430px,calc(100vw - 32px));border:1px solid rgba(255,255,255,.65);border-radius:30px;padding:0;background:rgba(239,245,248,.86);color:var(--ink);box-shadow:0 26px 80px rgba(34,54,72,.25);backdrop-filter:blur(28px);-webkit-backdrop-filter:blur(28px)}
#weather-dialog::backdrop{background:rgba(36,54,70,.22);backdrop-filter:blur(5px)}
.weather-form{padding:24px}
.weather-dialog-heading{display:flex;justify-content:space-between;align-items:flex-start;gap:20px}
.weather-dialog-heading p{margin:0;color:var(--muted);font-size:9px;letter-spacing:.08em}
.weather-dialog-heading h2{font-size:20px;margin:2px 0 0}
.weather-dialog-heading button{border:0;background:rgba(255,255,255,.42);border-radius:50%;width:36px;height:36px;font-size:20px}
.weather-dialog-intro{font-size:10px;color:var(--muted);line-height:1.7;margin:16px 0}
.weather-form>label{display:block;font-size:10px;margin-bottom:6px}
.weather-search{display:grid;grid-template-columns:1fr auto;gap:8px}
.weather-search input{min-width:0;border:1px solid rgba(255,255,255,.8);border-radius:14px;background:rgba(255,255,255,.46);padding:11px 12px;color:inherit;font:inherit;font-size:12px;outline:none}
.weather-search input:focus{border-color:rgba(82,110,145,.55);box-shadow:0 0 0 3px rgba(82,110,145,.08)}
.weather-search button{border:0;border-radius:14px;padding:0 16px;background:#668495;color:white;font-size:11px}
#weather-form-status{min-height:20px;margin:9px 0 0;color:var(--muted);font-size:9px}
.weather-remove{border:0;background:transparent;color:var(--muted);font-size:9px;padding:5px 0}
.weather-remove[hidden]{display:none}
@media(max-width:760px){.weather-card{padding:18px 22px;margin-top:0}.workspace aside{gap:12px}.days button{font-size:12px;line-height:36px;min-height:36px}.days button.selected{width:36px}.weather-heading button{min-width:44px;min-height:44px}.weather-search input{font-size:16px}.weather-search button{min-width:70px}.weather-dialog-heading button{width:44px;height:44px}}
body.dusk #weather-dialog{background:rgba(34,48,68,.92)}
body.dusk .weather-search input{background:rgba(28,43,62,.5);border-color:rgba(255,255,255,.2)}
@media(prefers-reduced-motion:reduce){#weather-dialog::backdrop{backdrop-filter:none}}