/* The offline controls follow the existing App typography and neutral surfaces. */
.gw-offline-dialog{width:min(500px,calc(100vw - 40px));text-align:center}
.gw-offline-dialog [data-offline-intro]{font-size:14px;line-height:1.72;margin-bottom:20px}
.gw-offline-dialog ul{list-style:none;margin:0 0 20px;padding:0;text-align:left}
.gw-offline-dialog li{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:16px 0;border-top:1px solid var(--gw-app-line)}
.gw-offline-dialog h3{margin:0 0 4px;color:var(--gw-app-text);font:600 16px/1.5 "GW App Avenir",Arial,sans-serif}
.gw-offline-dialog li p{margin:0;color:var(--gw-app-muted);font-size:12px;line-height:1.6}
.gw-offline-actions{flex:none;display:flex;align-items:center;gap:8px}
.gw-offline-dialog :is(.gw-offline-actions a,.gw-offline-actions button){display:inline-flex;align-items:center;justify-content:center;min-height:36px;padding:8px 14px;border:1px solid var(--gw-app-line);border-radius:99px;background:var(--gw-app-button);color:var(--gw-app-text);font:400 12px/1.5 "GW App Avenir",Arial,sans-serif;text-decoration:none;white-space:nowrap;cursor:pointer}
.gw-offline-dialog button.gw-offline-text{border:0;background:transparent;padding:8px 4px;color:var(--gw-app-body);font:400 12px/1.6 "GW App Avenir",Arial,sans-serif;cursor:pointer}
.gw-offline-dialog [data-offline-status]{font-size:12px;color:var(--gw-app-body);margin-bottom:12px}
.gw-offline-dialog [data-offline-status]:empty{display:none}
.gw-offline-tools{display:flex;flex-direction:column;align-items:center;gap:4px;margin-bottom:20px}
.gw-offline-dialog [data-offline-version]{font-size:10px;color:var(--gw-app-muted)}
.gw-offline-dialog :is(button,a):focus-visible{outline:1px solid var(--gw-app-accent);outline-offset:3px}
.gw-offline-dialog button:disabled{opacity:.55;cursor:wait}
.gw-offline-dialog [hidden],.gw-offline-media[hidden],.gw-offline-notice[hidden]{display:none!important}
.gw-offline-notice{box-sizing:border-box;margin:0 0 16px;padding:10px 14px;border:1px solid var(--gw-app-line);border-radius:8px;background:transparent;color:var(--gw-app-body);font:400 12px/1.6 "GW App Avenir",Arial,sans-serif;text-align:center}
html[data-gw-offline="true"] iframe:is([src*="windy"],[src*="youtube"],[src*="168.motc"],[src*="thb.gov"],[src*="cctv"],[src*="acrobat"],[src*="documentcloud"]){visibility:hidden!important;pointer-events:none!important}
.gw-offline-media{position:absolute;inset:0;display:grid;place-items:center;padding:20px;text-align:center;color:var(--gw-app-muted);font:400 14px/1.6 "GW App Avenir",Arial,sans-serif;background:var(--gw-app-surface)}
@media(max-width:520px){.gw-offline-dialog h3{font-size:14px}.gw-offline-dialog [data-offline-intro]{font-size:12px}.gw-offline-dialog li p,.gw-offline-dialog [data-offline-status],.gw-offline-notice{font-size:10px}.gw-offline-dialog li{gap:10px}.gw-offline-dialog .gw-offline-actions{gap:4px}.gw-offline-dialog :is(.gw-offline-actions a,.gw-offline-actions button){padding-inline:10px}}
@media(hover:hover) and (pointer:fine){.gw-offline-dialog :is(.gw-offline-actions a,.gw-offline-actions button):hover{background:var(--gw-app-hover);color:var(--gw-app-hover-text)}.gw-offline-dialog button.gw-offline-text:hover{background:transparent;color:var(--gw-app-text)}}

.gw-offline-camera{display:grid;place-items:center;min-height:160px;padding:20px;text-align:center;color:var(--gw-app-muted);font:400 14px/1.6 "GW App Avenir",Arial,sans-serif;background:var(--gw-app-surface)}
.gw-offline-camera[hidden],html[data-gw-offline="true"] img[data-offline-camera-hidden]{display:none!important}
.gw-offline-dialog [data-offline-home]{padding:0 0 16px;text-align:center}
.gw-offline-dialog [data-offline-home] p{margin:0;color:var(--gw-app-muted);font:400 12px/1.6 "GW App Avenir",Arial,sans-serif}
.gw-offline-dialog [data-offline-progress]{display:block;width:100%;height:3px;border:0;border-radius:2px;background:var(--gw-app-line);accent-color:var(--gw-app-accent);margin:4px 0 10px}
.gw-offline-dialog progress::-webkit-progress-bar{background:var(--gw-app-line);border-radius:2px}
.gw-offline-dialog progress::-webkit-progress-value{background:var(--gw-app-accent);border-radius:2px}
.gw-offline-dialog progress::-moz-progress-bar{background:var(--gw-app-accent);border-radius:2px}
@media(max-width:520px){.gw-offline-dialog [data-offline-home] p{font-size:10px}}

/* Use the existing detail tier; no new card or fixed overlay. */
.gw-offline-notice .gw-offline-reload-text{display:inline-flex;align-items:center;justify-content:center;gap:5px;margin:4px 0 0 10px;padding:3px 0;border:0;border-radius:0;background:transparent;color:inherit;font:inherit;text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.gw-offline-reload-text svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.5;flex:none}
.gw-offline-reload-text:focus-visible{outline:1px solid var(--gw-app-accent);outline-offset:3px}

main :is(.ld-condition-grid,.gw-condition-grid)>article[data-gw-observation-expired]>:not(small):not(.gw-offline-expired-value){display:none!important}
.gw-offline-expired-value{display:block;color:var(--gw-app-muted,#777)!important;font:400 var(--gw-type-detail,12px)/1.6 "GW App Avenir",Arial,sans-serif}

/* Notices use the page's actual family and detail tier. The refresh label and
   message share a baseline, with no extra button height/padding. */
main .gw-offline-notice{font-family:inherit!important;font-size:var(--gw-type-detail,12px)!important;font-weight:400!important;line-height:1.6!important;letter-spacing:0!important;color:var(--gw-ink-detail,var(--gw-app-body,#777));text-align:center}
main .gw-offline-notice .gw-offline-reload-text{display:inline-flex;align-items:baseline;vertical-align:baseline;gap:.35em;margin:0 0 0 .65em!important;padding:0!important;min-height:0!important;height:auto!important;font:inherit!important;line-height:inherit!important;letter-spacing:inherit!important;color:inherit!important;transform:none!important;background:transparent!important;border:0!important;border-radius:0!important}
main .gw-offline-notice .gw-offline-reload-text span{font:inherit!important;line-height:inherit!important;letter-spacing:inherit!important;color:inherit!important}
main .gw-offline-reload-text svg{width:1em;height:1em;align-self:center;flex:none}
.gw-offline-page-wrap{box-sizing:border-box;width:100%;padding:16px max(var(--ld-page-gutter,var(--gw-page-gutter,5vw)),calc((100% - var(--ld-content-width,var(--gw-content-width,1080px)))/2))}
main.gw-home>.gw-offline-page-wrap{padding-inline:var(--home-page-gutter,5vw)}
.gw-offline-page-wrap>.gw-offline-notice{width:100%;margin:0}
.gw-offline-page-wrap[hidden]{display:none!important}
@media(max-width:520px){main .gw-offline-notice{font-size:var(--gw-type-detail,10px)!important}}

/* App runtime updates are separate from saved-crag content checks. */
.gw-app-update-notice{display:flex;align-items:baseline;justify-content:center;flex-wrap:wrap;gap:6px 14px;padding:12px 16px;border:1px solid var(--gw-app-line);border-radius:10px;background:transparent;color:var(--gw-app-body);font-family:inherit;font-size:12px;font-weight:400;line-height:1.6;text-align:center}
.gw-app-update-notice :is(span,a){font-family:inherit!important;font-size:inherit!important;font-weight:400!important;line-height:inherit!important;letter-spacing:inherit!important}
.gw-app-update-notice a{display:inline-flex;align-items:center;gap:5px;color:var(--gw-app-text);text-decoration:underline;text-underline-offset:3px;white-space:nowrap}
.gw-app-update-notice svg{flex:none;width:1em;height:1em;fill:none;stroke:currentColor;stroke-width:1.5}
.gw-app-update-notice a:focus-visible{outline:1px solid var(--gw-app-accent);outline-offset:4px}
@media(max-width:520px){.gw-app-update-notice{font-size:10px}}

.gw-app-update-wrap{position:relative;z-index:2;padding:12px 15vw;background:var(--gw-app-surface)}
@media(max-width:991px){.gw-app-update-wrap{padding-inline:7vw}}
@media(max-width:767px){.gw-app-update-wrap{padding-inline:5vw}}
