/* MeteoFrontier Upper Air — isolated inside custom element */
mf-upperair {display:block;box-sizing:border-box;margin:20px 0 32px;font-family:Inter,system-ui,-apple-system,Segoe UI,sans-serif;color:#162236}
mf-upperair * {box-sizing:border-box}
mf-upperair .mfua-shell {border:1px solid #cbd5e1;border-radius:13px;background:#fff;overflow:hidden;box-shadow:0 6px 18px #1d35570a}
mf-upperair .mfua-head {padding:18px 22px;background:#10253c;color:#fff;display:flex;flex-wrap:wrap;gap:14px;align-items:center;justify-content:space-between}
mf-upperair .mfua-head h2 {font-weight:750;font-size:20px;line-height:1.2;margin:0}
mf-upperair .mfua-sub {font-size:12px;color:#b6c7dd;margin-top:5px}
mf-upperair .mfua-controls {display:flex;gap:8px;align-items:center;flex-wrap:wrap}
mf-upperair button,mf-upperair select {border:1px solid #9fb3ca;border-radius:7px;min-height:36px;background:white;color:#15243a;font-weight:650;padding:6px 10px;cursor:pointer}
mf-upperair button:focus-visible,mf-upperair select:focus-visible {outline:3px solid #f0b21b;outline-offset:2px}
mf-upperair button:disabled {opacity:.4;cursor:default}
mf-upperair .mfua-hour {font-variant-numeric:tabular-nums;font-weight:700;color:#fff;min-width:108px;text-align:center}
mf-upperair .mfua-notice {background:#f1f6fb;padding:10px 16px;font-size:12px;color:#4b5b72;border-bottom:1px solid #d6e0eb}
mf-upperair .mfua-layout {display:grid;grid-template-columns:minmax(0,1.5fr) minmax(270px,1fr);gap:10px;padding:14px}
mf-upperair .mfua-main,.mfua-side {min-width:0}
mf-upperair canvas {width:100%;height:auto;background:#fbfcff;border:1px solid #dbe4ef;border-radius:8px;display:block}
mf-upperair .mfua-title {font-size:14px;font-weight:750;color:#172d4a;margin:8px 0 8px}
mf-upperair .mfua-diagnostics {padding:0 16px 20px}
mf-upperair .mfua-metricgrid {display:grid;grid-template-columns:repeat(auto-fit,minmax(145px,1fr));gap:8px}
mf-upperair .mfua-metric {border:1px solid #dde6f0;border-radius:8px;padding:10px;min-width:0}
mf-upperair .mfua-metriclabel {font-size:11px;color:#42546e;line-height:1.3}
mf-upperair .mfua-metricvalue {font-weight:800;font-size:20px;font-variant-numeric:tabular-nums;margin-top:4px}
mf-upperair .mfua-tip {font-weight:bold;color:#215b99;border:0;background:none;padding:0 2px;min-height:0;cursor:help;text-decoration:underline dotted}
mf-upperair .mfua-commentary {font-size:13px;line-height:1.5;padding:12px 14px;border:1px solid #dbe4ee;border-radius:8px;margin:12px 0;background:#f7fafc}
mf-upperair .mfua-commentary p {margin:4px 0 8px}
mf-upperair .mfua-list {padding-left:20px;margin:8px 0}
mf-upperair .mfua-list li {margin:6px 0}
mf-upperair .mfua-warning {color:#8c4610;font-size:12px}
mf-upperair .mfua-status {padding:22px;color:#475569}
mf-upperair .mfua-timelabel {font-size:12px;color:#536784;padding:4px 0;text-align:center}
mf-upperair .mfua-timeline {padding:10px 16px;border-top:1px solid #e1e8f0}
mf-upperair .mfua-trend-selector {display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:8px;margin-bottom:8px}
mf-upperair .mfua-hover {font-size:12px;color:#334155;min-height:20px;padding:4px}
mf-upperair .mfua-titlebar {display:flex;align-items:center;justify-content:space-between;gap:8px}
mf-upperair .mfua-expand {min-height:28px;padding:3px 10px;font-size:12px}
mf-upperair canvas.mfua-zoomable {cursor:zoom-in}
mf-upperair .mfua-curveopts {display:flex;gap:14px;font-size:12.5px;color:#314157;margin:-2px 0 6px}
mf-upperair .mfua-curveopts label {display:flex;align-items:center;gap:5px;cursor:pointer}
@media(max-width:850px){mf-upperair .mfua-layout{grid-template-columns:1fr}mf-upperair .mfua-head{padding:14px}}
/* Full-screen viewer (overlay on the page, or the whole of viewer.html) */
.mfua-viewer {position:fixed;inset:0;z-index:10000;display:flex;flex-direction:column;background:#0e1a2a;color:#e8eef6;font-family:Inter,system-ui,-apple-system,Segoe UI,sans-serif}
.mfua-viewer * {box-sizing:border-box}
.mfua-vbar,.mfua-vanim {display:flex;flex-wrap:wrap;gap:8px;align-items:center;padding:9px 14px;background:#10253c}
.mfua-vbar {justify-content:space-between;border-bottom:1px solid #22405f}
.mfua-vanim {border-top:1px solid #22405f}
.mfua-vtitle {font-weight:700;font-size:15px;font-variant-numeric:tabular-nums}
.mfua-vtabs,.mfua-vtools {display:flex;gap:6px}
.mfua-viewer button,.mfua-viewer select {font:inherit;font-size:13px;font-weight:650;border:1px solid #4d6a8a;border-radius:7px;min-height:34px;background:#18324f;color:#eaf1f9;padding:5px 11px;cursor:pointer}
.mfua-viewer button:hover {background:#21436a}
.mfua-viewer button.active,.mfua-viewer .mfua-play {background:#f0b21b;border-color:#f0b21b;color:#10253c}
.mfua-viewer .mfua-play {min-width:96px}
.mfua-viewer :focus-visible {outline:3px solid #f0b21b;outline-offset:2px}
.mfua-vstage {flex:1;min-height:0;display:flex;align-items:center;justify-content:center;gap:12px;padding:12px}
.mfua-vstage.mfua-vstack {flex-direction:column}
.mfua-vstage canvas {display:block;flex:none;max-width:none;background:#fff;border:0;border-radius:8px}
.mfua-vstage canvas[hidden] {display:none}
.mfua-vslider {flex:1;min-width:160px;accent-color:#f0b21b}
.mfua-vhour {min-width:180px;font-weight:700;font-variant-numeric:tabular-nums}
.mfua-vcheck {display:flex;gap:5px;align-items:center;font-size:13px;white-space:nowrap}
