/* Allergens tab styles. Loaded in the order base, weather, sky, allergens, about. The tiles below the hero are plain glass cards, no picture behind any of their text. */
.allergen-hero{padding:30px;margin-top:10px;background:linear-gradient(135deg,rgba(72,38,112,.74),rgba(20,28,66,.7))}
.allergen-hero h2{font-size:clamp(1.6rem,4vw,2.6rem);letter-spacing:-.04em;margin:0 0 10px}
.allergen-hero p{margin:0;max-width:640px;line-height:1.5}
.allergen-hero p+p{margin-top:8px;color:var(--muted);font-size:.86rem}
/* Marcus, 2026-09-22: 6 rotating hero pictures (day/night matched, one random pick per load), the Sky tab's
   .sky-hero.space-image shape -- a ::before picture layer behind the card's own existing gradient, which now
   also serves as the text-legibility tint over the picture. Same no-boxes rule as everywhere else: the gradient
   is on .allergen-hero itself (see above), not a separate panel around the text. */
.allergen-hero.air-scene{position:relative;overflow:hidden;isolation:isolate;min-height:clamp(170px,20vw,240px);text-shadow:var(--ink-shadow);-webkit-text-stroke:2px rgba(0,0,0,.55);paint-order:stroke fill}
.allergen-hero.air-scene::before{content:"";position:absolute;inset:0;z-index:-1;background-repeat:no-repeat;background-position:center;background-size:cover;background-image:var(--scene-image,none)}
.allergen-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px}
.allergen-tile{padding:17px}
.allergen-tile span{display:block;color:var(--muted);font-size:.76rem;margin-bottom:7px}
.allergen-tile b{display:block;font-size:1.05rem;margin-bottom:6px}
.allergen-tile small{color:var(--muted);font-size:.78rem;line-height:1.45}
.allergen-tile b+.scale,.allergen-tile b+.meter{margin-top:2px}
.allergen-note{color:var(--muted);font-size:.8rem;line-height:1.5;margin:0 0 12px}
.allergen-credit{color:var(--muted);font-size:.78rem;line-height:1.55;margin:26px 0 0;max-width:760px}
.allergen-credit a{color:inherit}
@media(max-width:900px){.allergen-section .section-title{display:block}.allergen-section .section-title p{margin-top:6px}}
@media(max-width:480px){.allergen-hero{padding:22px}.allergen-grid{grid-template-columns:1fr 1fr}}
.us-pollen{padding:18px}
.pollen-row{display:grid;grid-template-columns:64px 1fr auto;align-items:center;gap:12px;margin:12px 0}
.pollen-name{font-weight:700}
.pollen-track{display:flex;gap:4px}
.pollen-track i{flex:1;height:14px;border-radius:4px;background:rgba(255,255,255,.1);border:1px solid #8f89b8}
.pollen-track i.on{border-color:transparent}
.pollen-l1 i.on{background:#7fc97f}.pollen-l2 i.on{background:#c7e05a}.pollen-l3 i.on{background:#f4d03f}.pollen-l4 i.on{background:#f39c12}.pollen-l5 i.on{background:#e74c3c}
.pollen-cat{min-width:88px;text-align:right;font-size:.9rem}
.pollen-out .pollen-cat{grid-column:2/4;text-align:left;color:var(--muted)}
.us-pollen-source{margin:14px 0 0;font-size:.85rem;line-height:1.5;color:#e9e4f7}
.us-pollen-source a{color:#dbc5ff;text-decoration:underline}