.cuaca-air {
  position:absolute; z-index:4; top:86px; right:20px; width:292px;
  color:#223c48; background:rgba(249,252,253,.96); border:1px solid #ffffffb3;
  border-radius:12px; box-shadow:0 8px 32px #152e4024;
  backdrop-filter:blur(14px); font-family:"Instrument Sans",system-ui,sans-serif;
  --air-color:#596d77;
}
.cuaca-air summary { list-style:none; cursor:pointer; padding:15px 17px; }
.cuaca-air summary::-webkit-details-marker { display:none; }
.air-heading { display:flex; align-items:center; justify-content:space-between; gap:8px; font-size:11px; font-weight:700; letter-spacing:.09em; text-transform:uppercase; }
.air-heading::after { content:'+'; font-size:19px; line-height:1; }
.cuaca-air[open] .air-heading::after { content:'−'; }
.air-reading { display:flex; align-items:center; gap:12px; margin-top:8px; }
.air-value { font-size:38px; line-height:1; font-weight:700; letter-spacing:-.04em; font-variant-numeric:tabular-nums; }
.air-category { color:var(--air-color); font-size:13px; font-weight:700; }
.air-category::before { content:''; display:inline-block; width:7px; height:7px; margin-right:6px; border-radius:50%; background:currentColor; }
.air-station-name { display:block; margin-top:5px; font-size:11px; line-height:1.4; color:#52666f; }
.air-body { padding:0 17px 15px; max-height:290px; overflow:auto; overscroll-behavior:contain; }
.air-body label { display:block; font-size:11px; font-weight:600; margin-bottom:5px; }
.air-body select { width:100%; min-height:40px; padding:7px; border:1px solid #d2dde1; border-radius:6px; color:#223c48; background:#fff; font:12px "Instrument Sans",system-ui,sans-serif; }
.air-note { font-size:11px; line-height:1.5; margin:9px 0; color:#52666f; }
.air-scale { display:grid; grid-template-columns:repeat(5,1fr); gap:3px; margin-top:12px; }
.air-scale span { height:4px; border-radius:2px; }
.air-legend { display:flex; justify-content:space-between; font-size:10px; color:#52666f; margin-top:5px; }
.air-footer { display:flex; justify-content:space-between; align-items:center; gap:8px; padding-top:8px; border-top:1px solid #dfe6e9; }
.air-footer a { color:#286982; font-size:11px; text-underline-offset:3px; }
.air-footer button { min-height:36px; border:1px solid #d2dde1; border-radius:6px; background:#fff; color:#223c48; font:600 11px "Instrument Sans",system-ui,sans-serif; padding:6px 9px; cursor:pointer; }
.air-footer button:disabled { opacity:.6; cursor:wait; }
.cuaca-air :focus-visible { outline:3px solid #277894; outline-offset:3px; }
@media(max-width:650px) {
  .cuaca-air { top:var(--air-mobile-top,285px); left:12px; right:auto; width:254px; max-width:calc(100% - 24px); }
  .cuaca-air summary { padding:12px 14px; }
  .air-value { font-size:30px; }
  .air-body { padding:0 14px 12px; max-height:190px; }
}
