.detail-head{position:relative}
.place-weather-slot{position:absolute;top:26px;right:32px;z-index:2;width:min(226px,34%);min-height:58px;color:#173d3a}
.place-weather-slot.is-ready{border:1px solid rgba(44,86,76,.16);border-radius:16px;background:rgba(255,253,247,.84);box-shadow:0 10px 24px rgba(37,48,42,.08);backdrop-filter:blur(10px);overflow:hidden}
.place-weather-top{display:flex;align-items:center;gap:9px;padding:10px 12px 9px}
.weather-sun-mark{position:relative;display:block;width:27px;height:27px;flex:0 0 27px;border:2px solid #c78840;border-radius:50%;background:#f3cb7b;box-shadow:0 0 0 5px rgba(243,203,123,.2)}
.weather-sun-mark:before,.weather-sun-mark:after{content:"";position:absolute;inset:-6px;border-top:1px solid #d6a259;border-bottom:1px solid #d6a259;border-radius:50%;transform:rotate(45deg)}
.weather-sun-mark:after{transform:rotate(-45deg)}
.weather-eyebrow{display:block;color:#719087;font-size:.58rem;font-weight:900;letter-spacing:.13em;text-transform:uppercase}
.weather-temperature{display:inline-block;margin-right:6px;color:#173d3a;font-family:Georgia,serif;font-size:1.35rem;line-height:1;font-weight:600}
.weather-condition{color:#61736f;font-size:.7rem;font-weight:700}
.weather-chevron{margin-left:auto;color:#9b8060;font-size:1.1rem;line-height:1;transition:transform .2s ease}
.place-weather-slot:hover .weather-chevron,.place-weather-slot:focus-within .weather-chevron{transform:rotate(180deg)}
.weather-forecast{max-height:0;padding:0 12px;overflow:hidden;opacity:0;transition:max-height .28s ease,opacity .22s ease,padding .28s ease}
.place-weather-slot:hover .weather-forecast,.place-weather-slot:focus-within .weather-forecast{max-height:150px;padding:0 12px 11px;opacity:1}
.weather-forecast p{margin:0 0 7px;border-top:1px solid rgba(44,86,76,.12);padding-top:8px;color:#8a6c4f;font-size:.58rem;font-weight:900;letter-spacing:.11em;text-transform:uppercase}
.weather-forecast ul{display:grid;grid-template-columns:repeat(3,1fr);gap:5px;margin:0;padding:0;list-style:none}
.weather-forecast li{display:grid;gap:2px;min-width:0;color:#6d7c77;text-align:center;font-size:.58rem}
.weather-forecast li strong{color:#214944;font-size:.75rem}
.weather-forecast li small{color:#9aa49f;font-size:.62rem}
.weather-day{color:#315f59;font-weight:900;text-transform:capitalize}
.weather-day-state{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.52rem}
.weather-loading{display:grid;gap:6px;padding:13px 15px;border:1px solid rgba(44,86,76,.12);border-radius:16px;background:rgba(255,253,247,.75)}
.weather-loading-line{display:block;width:74px;height:8px;border-radius:8px;background:linear-gradient(90deg,#eadfce,#f8f1e7,#eadfce);background-size:200% 100%;animation:weatherShimmer 1.2s infinite}
.weather-loading-line.short{width:48px;height:14px}
.weather-unavailable{display:block;padding:13px 15px;border:1px solid rgba(44,86,76,.1);border-radius:16px;background:rgba(255,253,247,.7);color:#7d8983;font-size:.67rem;font-weight:700}
@keyframes weatherShimmer{to{background-position:-200% 0}}
@media (max-width:800px){.place-weather-slot{top:22px;right:18px;width:188px}.detail-head{padding-right:214px}.weather-condition{display:block;margin-top:3px}.weather-temperature{font-size:1.2rem}}
@media (max-width:560px){.place-weather-slot{top:17px;right:16px;width:164px}.detail-head{padding-right:16px}.place-weather-slot.is-ready{border-radius:13px}.place-weather-top{padding:8px 9px}.weather-sun-mark{width:22px;height:22px;flex-basis:22px}.weather-eyebrow{font-size:.5rem}.weather-temperature{font-size:1.05rem}.weather-condition{font-size:.6rem}.weather-forecast{display:block}.place-weather-slot.is-expanded .weather-forecast{max-height:150px;padding:0 9px 9px;opacity:1}.weather-chevron{font-size:.9rem}.detail-head h2{padding-top:67px}}