/* Weather components. Shared output-header and text roles own physical sizes. */
*{box-sizing:border-box}[hidden]{display:none!important}
body{margin:0;font-family:var(--edu-admin-font,system-ui);color:var(--ev-text);background:var(--ev-bg)}
.shell{width:100%;max-width:1440px;margin:auto;min-height:100dvh;padding:clamp(8px,1.2vmin,24px);display:flex;flex-direction:column;gap:clamp(8px,1.2vmin,24px)}
.header{display:flex;justify-content:space-between;align-items:center}.brand{display:flex;align-items:center;gap:12px}.weather-legacy-heading{display:none}.status{font-size:var(--edu-text-caption);color:var(--ev-muted)}
.hero{display:flex;align-items:center;justify-content:space-between;background:var(--ev-primary);color:var(--ev-primary-text);border-radius:var(--ev-control-radius);flex:none;min-width:0}
.weather-current{display:flex;align-items:center;gap:var(--edu-header-gap);min-width:0;flex:1}
.temperature{white-space:nowrap;font-weight:700;line-height:1;margin:0}
.hero-details{display:flex;flex-direction:column;gap:4px;min-width:0}.hero-meta{display:flex;align-items:center;gap:6px;font-size:var(--edu-header-meta);line-height:1.2}
.hero-meta svg{width:1em;height:1em;flex:none}.feels-like{display:flex;align-items:center;gap:6px;font-size:var(--edu-header-meta);line-height:1.2;white-space:nowrap}.feels-like span,.feels-like strong{font:inherit}.feels-like strong{font-weight:650}
.hero-art{display:flex;flex-direction:column;align-items:center;justify-content:center;flex:none}.hero-art svg{width:60%;height:60%;flex:none}.condition-label{font-size:calc(var(--edu-header-height)*.11);line-height:1.15;text-align:center;overflow-wrap:normal;hyphens:none}
.weather-pages{display:grid;grid-template-columns:repeat(var(--weather-panels,1),minmax(0,1fr));gap:var(--weather-gap,16px);align-content:start}.weather-page{display:block;min-width:0;margin:0}.weather-page[data-page="2"],.daily-forecast-page{grid-column:1/-1}.section-heading{display:flex;align-items:baseline;justify-content:space-between;gap:8px 16px;flex-wrap:wrap;margin:0 0 12px}.section-heading h2,.section-heading span{min-width:0;overflow-wrap:break-word}
.section-heading h2{margin:0;line-height:1.25}.section-heading span{color:var(--ev-muted);text-align:right}.metrics{display:grid;grid-template-columns:repeat(var(--weather-metrics,3),minmax(0,1fr));gap:clamp(8px,1.3vmin,22px)}
html[data-kiosk-app="weather"] #weather-pages :is(.metric,.forecast-card,.hour-cell){min-width:0;padding:calc(var(--edu-text-body)*1.111111)!important;border:1px solid var(--ev-border);border-radius:var(--ev-card-radius);background:var(--ev-surface);color:var(--ev-text)}
.hourly-panel,.daily-forecast-panel{min-width:0;padding:0;border:0;background:transparent}
.metric-top{display:flex;align-items:center;gap:8px}.metric-icon{display:grid;place-items:center;width:2em;height:2em;flex:none;background:var(--ev-secondary);color:var(--ev-secondary-text);border-radius:var(--ev-control-radius)}.metric-icon svg{width:60%;height:60%}.metric-value{font-weight:650;margin:6px 0}.metric-note{color:var(--ev-muted)}
.hourly-grid,.daily-hourly-grid{display:grid;grid-template-columns:repeat(var(--weather-hours,3),minmax(0,1fr));gap:12px;align-items:stretch}.hour-cell,.daily-hour-cell{display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:.6em;min-width:0;text-align:center}
.hour-icon{display:grid;place-items:center;width:calc(var(--edu-text-body)*2.5);height:calc(var(--edu-text-body)*2.5)}.hour-icon svg{display:block;width:100%;height:100%}.hour-temp{font-weight:650}.daily-night-temp{font-size:var(--edu-text-label);line-height:1.3}.hour-rain{line-height:1.3}
.forecast-grid{display:grid;grid-template-columns:repeat(var(--weather-forecast,3),minmax(0,1fr));gap:12px}.forecast-card h3{font-size:var(--edu-text-title);line-height:1.2;margin:0 0 12px}.forecast-card p{margin:0 0 12px;white-space:pre-line}.forecast-empty{font-size:var(--edu-text-body);color:var(--ev-muted);padding:16px;line-height:1.4}
.weather-alerts{display:grid;gap:8px}.weather-alert{border-radius:var(--ev-control-radius);padding:12px 18px;background:#fff8d9;border-left:7px solid #e7b11e;color:#473b14}.weather-alert strong{font-size:var(--edu-text-title)}
.footer{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:6px 16px;flex:none;color:var(--ev-muted);line-height:1.3}.footer a{color:var(--ev-primary)}.page-indicator{display:none}
html.nsp-output body,body.signage{height:100dvh;min-height:0;overflow:hidden}
html.nsp-output .shell,body.signage .shell{height:100dvh;min-height:0;max-width:none;overflow:hidden}
html.nsp-output .header,html.kiosk-output .header{display:none}
html.nsp-output #weather-pages{flex:1;min-height:0;overflow:hidden}
html.nsp-output .weather-page{display:block;height:auto!important;overflow:visible}
@media(max-width:620px){.weather-current{flex-direction:column;align-items:flex-start;gap:4px}.hero-meta{flex-wrap:nowrap}.section-heading{align-items:flex-start}}


/* Ordinary pages use document flow rather than the signage shell gap. */
html.web-output[data-kiosk-app="weather"] .hero{margin-bottom:24px}

/* Section paging never exposes fragments of adjacent sections. */
#weather-pages{font-size:var(--edu-text-body)}
#weather-pages[data-section-pager]{position:relative;display:block;overflow:hidden;min-height:0}
#weather-pages[data-section-pager]>.weather-page{position:absolute;top:0;left:0;display:none!important;margin:0;box-sizing:border-box}
#weather-pages[data-section-pager]>.weather-page.is-section-current{display:block!important}
html[data-kiosk-app="weather"] .hourly-grid{gap:var(--weather-gap,16px)}

/* Low horizontal strips reserve their complete area for weather content. */
html[data-weather-strip] :is(.footer,.edu-auto-pagination,.page-indicator){display:none!important}
html[data-weather-strip] #weather-pages :is(.hourly-grid,.metrics,.forecast-grid){align-items:stretch}
html[data-weather-header-only] :is(#weather-pages,.footer,.edu-kiosk-pagination,.page-indicator,.weather-alerts){display:none!important}
html[data-weather-header-only] .shell{justify-content:center}
/* Daily cards always share the entire section width, independently of hourly density. */
html[data-kiosk-app="weather"][data-output-mode] #weather-pages .daily-hourly-grid{grid-template-columns:repeat(var(--weather-daily,3),minmax(0,1fr))!important}

/* Approved weather header: central identity and semantic sizes, independent cells. */
html[data-kiosk-app="weather"] .hero.edu-output-header{display:flex!important;align-items:center!important;justify-content:space-between;min-width:0;overflow:hidden}
html[data-kiosk-app="weather"][data-output-mode] .hero.edu-output-header>.edu-app-icon{display:inline-grid!important;place-items:center!important;flex-shrink:0!important;align-self:center;background:var(--ev-secondary)!important;color:var(--ev-secondary-text)!important;border-radius:calc(var(--edu-header-icon)*.04)!important}
html[data-kiosk-app="weather"] .hero.edu-output-header>.edu-app-icon>svg{width:60%!important;height:60%!important;max-height:60%!important;display:block!important;transform:none!important}
html[data-kiosk-app="weather"] .hero.edu-output-header .weather-current{display:flex!important;flex:1 1 0;min-width:0;flex-direction:column!important;align-items:flex-start!important;justify-content:center!important;gap:calc(var(--edu-header-height)*.035)!important}
html[data-kiosk-app="weather"] .hero.edu-output-header .temperature{flex:none;max-width:100%;line-height:1.05!important}
html[data-kiosk-app="weather"] .hero.edu-output-header .hero-details{display:flex!important;flex:none;flex-direction:column!important;align-items:flex-start!important;min-width:0;gap:calc(var(--edu-header-height)*.025)!important;padding:0!important;text-align:left}
html[data-kiosk-app="weather"] .hero.edu-output-header .hero-details :is(.feels-like,.hero-meta){display:flex;align-items:center;font-size:var(--edu-header-meta)!important;line-height:1.2!important;white-space:normal;flex-wrap:wrap;max-width:100%;margin:0}
html[data-kiosk-app="weather"] .hero.edu-output-header .hero-details .hero-meta{flex-wrap:nowrap}
html[data-kiosk-app="weather"] .hero.edu-output-header .hero-art.edu-header-art{display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;flex:0 0 calc(var(--edu-header-icon)*1.45)!important;width:calc(var(--edu-header-icon)*1.45)!important;height:100%!important;min-width:0!important;gap:calc(var(--edu-header-height)*.025);padding:0 calc(var(--edu-header-height)*.025);overflow:hidden}
html[data-kiosk-app="weather"] .hero.edu-output-header .hero-art.edu-header-art>svg{display:block!important;flex:0 1 auto!important;width:calc(var(--edu-header-icon)*.72)!important;height:calc(var(--edu-header-icon)*.72)!important;max-width:100%!important;max-height:65%!important;aspect-ratio:1}
html[data-kiosk-app="weather"] .hero.edu-output-header .condition-label{flex:none;width:100%;max-width:100%;font-size:max(12px,calc(var(--edu-header-meta)*.75))!important;line-height:1.15!important;text-align:center;white-space:normal;overflow-wrap:anywhere;text-wrap:balance;padding:0;margin:0}
html[data-kiosk-app="weather"][data-weather-header-layout="low"] .hero.edu-output-header .weather-current{flex-direction:row!important;align-items:center!important;justify-content:flex-start!important;gap:var(--edu-header-gap)!important}
/* The kiosk menu already displays the application identity. */
html[data-kiosk-app="weather"].edu-menu-app-header .hero.edu-output-header>.edu-app-icon{display:none!important}