/* Current-conditions component. No decorative rings or generated imagery. */
.conditions-card{display:flex;flex-direction:column;padding:0;background:#fff;color:#1e4054;border:1px solid #d8e4eb;border-radius:14px;overflow:hidden;box-shadow:0 4px 18px #16384b07;container:conditions / inline-size}
.conditions-card::before,.conditions-card::after{display:none;content:none}
.conditions-hero{padding:24px 28px;background:#17394e;color:#fff}
.conditions-card .conditions-top{display:flex;align-items:center;justify-content:space-between;gap:16px}
.conditions-card .conditions-source{display:flex;flex-direction:column;align-items:flex-start;gap:5px;min-width:0}
.conditions-card .card-label{font:600 13px/1.5 var(--font);letter-spacing:0;color:#e0edf3;text-transform:none}
.conditions-card .current-freshness{font-size:12px;line-height:1.5;color:#b5cbd7}
.conditions-card .current-freshness[data-source=forecast]{color:#f0d199}
.conditions-card .unit-toggle{display:flex;align-items:center;gap:2px;background:#ffffff08;border:1px solid #ffffff24;padding:3px;border-radius:7px;flex-shrink:0}
.conditions-card .unit-toggle button{min-width:40px;min-height:38px;padding:6px 8px;background:none;border:0;border-radius:4px;font:600 13px/1.4 var(--font);color:#aec7d6}
.conditions-card .unit-toggle button.selected{background:#fff;color:#17394e;box-shadow:none}
.conditions-card .conditions-main{display:grid;grid-template-columns:auto minmax(0,1fr) 140px;grid-template-areas:'city city city' 'reading summary icon';align-items:center;align-content:start;gap:12px 22px;margin:20px 0 0;min-height:0;flex:none}
.conditions-card .conditions-main h2{grid-area:city;margin:0;font:650 27px/1.3 var(--display);letter-spacing:-.035em;overflow-wrap:anywhere;color:#fff}
.conditions-card .conditions-reading{grid-area:reading;min-width:0}
.conditions-card .temperature{display:flex;align-items:flex-start;margin:0;font:600 104px/1.12 var(--display);letter-spacing:-.06em;font-variant-numeric:tabular-nums;color:#fff}
.conditions-card .degree{display:flex;align-items:flex-start;gap:0;font-size:38px;line-height:1.3;font-weight:400;letter-spacing:0;margin:10px 0 0 4px;color:#c6dde8}
.conditions-card .degree>span{font:500 18px/1.4 var(--font);padding-top:6px}
.conditions-card .conditions-visual{grid-area:icon;display:flex;align-items:center;justify-content:center;width:140px;height:130px}
.conditions-card .hero-weather-icon{position:static;width:140px;height:140px;margin:0;filter:none}
.conditions-card .conditions-summary{grid-area:summary;min-width:0}
.conditions-card .condition-description{font:550 21px/1.4 var(--font);max-width:none;margin:0;color:#f5fafc;overflow-wrap:anywhere}
.conditions-card .feels{font-size:13px;line-height:1.6;margin:7px 0 0;color:#b9d0dc}
.conditions-card .conditions-metrics{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;padding:8px 28px;margin:0;border:0;background:#fff}
.conditions-card .conditions-metrics>div{display:flex;flex-direction:column;align-items:flex-start;gap:6px;min-width:0;padding:17px 20px;border-left:1px solid #e5edf1}
.conditions-card .conditions-metrics>div:nth-child(3n+1){padding-left:0;border-left:0}
.conditions-card .conditions-metrics>div:nth-child(-n+3){border-bottom:1px solid #e5edf1}
.conditions-card .conditions-metrics dt{margin:0;font-size:12px;line-height:1.5;color:#607888}
.conditions-card .conditions-metrics dd{margin:0;font:650 19px/1.4 var(--font);letter-spacing:-.02em;font-variant-numeric:tabular-nums;color:#1e4054;overflow-wrap:anywhere}
.conditions-card .conditions-next{display:grid;grid-template-columns:1fr auto;gap:4px 16px;padding:14px 28px;margin:0;border:0;border-top:1px solid #e5edf1;border-bottom:1px solid #e5edf1;border-radius:0;background:#f5f9fb;position:relative;color:#284e63;transition:background .15s}
.conditions-card .conditions-next[hidden]{display:none}
.conditions-card .conditions-next>span:first-child{grid-column:1;grid-row:1;font:500 11px/1.5 var(--font);color:#617b8d;letter-spacing:0;flex-basis:auto}
.conditions-card .conditions-next strong{grid-column:1;grid-row:2;font:600 14px/1.5 var(--font);color:#2b5269}
.conditions-card .conditions-next>span:last-child{position:static;grid-column:2;grid-row:1/3;align-self:center;margin:0;font-size:20px;color:#397d88}
.conditions-card .conditions-next:hover{background:#eef5f8}.conditions-card .conditions-next:hover strong{color:#176c7a}
.conditions-card .conditions-bottom{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:16px 28px;margin:auto 0 0;color:#617b8d;background:#fff;font-size:11px;line-height:1.6;flex-wrap:nowrap}
.conditions-observation{min-width:0}.conditions-observation p{margin:0;color:#3d5d70;font-size:12px;line-height:1.6;overflow-wrap:anywhere}.conditions-observation>div{display:flex;align-items:center;flex-wrap:wrap;gap:4px 14px;margin-top:3px}
.conditions-card .conditions-bottom a{font-size:11px;color:#267888;min-height:24px;display:inline-flex;align-items:center}.conditions-card .conditions-bottom a[hidden]{display:none}
.conditions-card .conditions-bottom button{border:1px solid #d8e5ec;background:#fff;border-radius:6px;padding:8px 11px;min-height:42px;min-width:0;font:600 12px/1.5 var(--font);text-align:center;color:#3e6076;flex-shrink:0}.conditions-card .conditions-bottom button:hover{background:#f3f8fa}.conditions-card .conditions-bottom button span{margin-left:6px;font-size:15px}
@container conditions (max-width:600px){.conditions-card .conditions-main{grid-template-columns:minmax(0,1fr) 134px;grid-template-areas:'city city' 'reading icon' 'summary summary';gap:8px 18px}.conditions-card .conditions-visual{width:134px;height:114px}.conditions-card .hero-weather-icon{width:134px;height:134px}.conditions-card .temperature{font-size:98px}.conditions-card .condition-description{font-size:20px}.conditions-card .conditions-summary{margin-top:2px}.conditions-card .conditions-main h2{font-size:26px}}
@container conditions (max-width:400px){.conditions-hero{padding:22px}.conditions-card .conditions-main{grid-template-columns:minmax(0,1fr) 118px;gap:7px 14px;margin-top:18px}.conditions-card .conditions-main h2{font-size:25px}.conditions-card .temperature{font-size:94px}.conditions-card .degree{font-size:35px;margin-top:9px}.conditions-card .conditions-visual{width:118px;height:110px}.conditions-card .hero-weather-icon{width:118px;height:118px}.conditions-card .conditions-metrics{padding:6px 22px}.conditions-card .conditions-metrics>div{padding:15px 12px}.conditions-card .conditions-metrics dt{font-size:11px}.conditions-card .conditions-metrics dd{font-size:15px}.conditions-card .conditions-next{padding:13px 22px}.conditions-card .conditions-next strong{font-size:13px}.conditions-card .conditions-bottom{padding:15px 22px;gap:10px}.conditions-card .card-label{font-size:12px}.conditions-card .current-freshness{font-size:11px}.conditions-card .unit-toggle button{min-width:36px;min-height:38px}.conditions-card .feels{font-size:13px}}
@container conditions (max-width:330px){.conditions-hero{padding:20px}.conditions-card .conditions-main{grid-template-columns:minmax(0,1fr) 100px;gap:8px 12px}.conditions-card .temperature{font-size:84px}.conditions-card .degree{font-size:31px;margin-top:8px}.conditions-card .degree>span{font-size:16px;padding-top:5px}.conditions-card .conditions-visual{width:100px;height:96px}.conditions-card .hero-weather-icon{width:100px;height:100px}.conditions-card .condition-description{font-size:18px}.conditions-card .conditions-metrics{grid-template-columns:repeat(2,minmax(0,1fr));padding:5px 20px}.conditions-card .conditions-metrics>div{padding:13px 16px;border:0;border-left:1px solid #e5edf1;border-bottom:1px solid #e5edf1}.conditions-card .conditions-metrics>div:nth-child(3n+1){padding-left:16px;border-left:1px solid #e5edf1}.conditions-card .conditions-metrics>div:nth-child(odd){padding-left:0;border-left:0}.conditions-card .conditions-metrics>div:nth-last-child(-n+2){border-bottom:0}.conditions-card .conditions-metrics dd{font-size:17px}.conditions-card .conditions-next{padding:13px 20px}.conditions-card .conditions-bottom{padding:14px 20px;align-items:flex-start}.conditions-observation>div{gap:4px 10px}.conditions-card .conditions-bottom button{font-size:11px;padding:8px 9px}.conditions-card .unit-toggle button{min-width:33px}.conditions-card .conditions-top{gap:10px}}
@container conditions (max-width:400px){.conditions-card[data-temperature-length="3"] .temperature{font-size:78px}.conditions-card[data-temperature-length="4"] .temperature{font-size:62px}.conditions-card[data-temperature-length="3"] .degree,.conditions-card[data-temperature-length="4"] .degree{font-size:28px;margin-top:8px}.conditions-card[data-temperature-length="3"] .conditions-visual,.conditions-card[data-temperature-length="4"] .conditions-visual{width:100%;height:100px}.conditions-card[data-temperature-length="3"] .hero-weather-icon,.conditions-card[data-temperature-length="4"] .hero-weather-icon{width:104px;height:104px}}
@container conditions (max-width:330px){.conditions-card:is([data-temperature-length="3"],[data-temperature-length="4"]) .conditions-main{grid-template-columns:minmax(0,1fr) 84px;column-gap:10px}.conditions-card[data-temperature-length="3"] .temperature{font-size:65px}.conditions-card[data-temperature-length="4"] .temperature{font-size:52px}.conditions-card[data-temperature-length="3"] .degree,.conditions-card[data-temperature-length="4"] .degree{font-size:24px;margin-top:7px}.conditions-card:is([data-temperature-length="3"],[data-temperature-length="4"]) .conditions-visual{width:84px;height:94px}.conditions-card[data-temperature-length="3"] .hero-weather-icon,.conditions-card[data-temperature-length="4"] .hero-weather-icon{width:84px;height:84px}}
@media(prefers-reduced-motion:reduce){.conditions-card .conditions-next{transition:none}}
