.situation-view { padding-block: var(--space-5, 1.25rem) var(--space-8); }
.situation-heading { margin-bottom: var(--space-4); }
.situation-heading h2,
.situation-heading p { margin-bottom: 0; }
.situation-heading > p { color: var(--ink-soft); font-variant-numeric: tabular-nums; }
.situation-controls {
  margin-bottom: var(--space-4);
  display: grid;
  gap: var(--space-3) var(--space-8);
}
.control-label {
  margin-bottom: var(--space-2);
  display: block;
  color: var(--ink-soft);
  font-size: .72rem;
  font-weight: 750;
  letter-spacing: .06em;
  text-transform: uppercase;
}
.situation-map-wrap {
  position: relative;
  min-height: min(70vh, 660px);
  overflow: hidden;
  border: 1px solid var(--line);
  background: #dfe9ee;
}
.situation-map { position: absolute; inset: 0; background: transparent; }
.situation-legend {
  position: absolute;
  z-index: 500;
  right: var(--space-3);
  bottom: var(--space-3);
  width: min(15rem, calc(100% - 1.5rem));
  padding: var(--space-3);
  display: grid;
  gap: .35rem;
  border: 1px solid var(--line);
  color: var(--ink);
  background: rgb(255 255 255 / 92%);
  font-size: .72rem;
  -webkit-backdrop-filter: blur(4px);
  backdrop-filter: blur(4px);
}
.situation-legend strong { font-size: .82rem; letter-spacing: .04em; text-transform: uppercase; }
.situation-legend span { display: flex; align-items: center; gap: .45rem; }
.legend-line { width: 1.5rem; border-top: 2px solid #375d85; }
.legend-center {
  width: 1.35rem;
  height: 1.35rem;
  display: inline-grid;
  place-items: center;
  border-radius: 50%;
  color: white;
  font-size: .72rem;
}
.legend-center--high { background: #c9332d; }
.legend-center--low { background: #1768ac; }
.front-key {
  position: relative;
  width: 2.35rem;
  height: 1rem;
  flex: 0 0 2.35rem;
  color: #1768c5;
}
.front-key::before {
  content: "";
  position: absolute;
  top: .45rem;
  inset-inline: 0;
  height: 3px;
  border-radius: 3px;
  background: currentColor;
}
.front-key b {
  position: absolute;
  left: .35rem;
  top: .04rem;
  width: .62rem;
  height: .45rem;
  background: currentColor;
}
.front-key b + b { left: 1.35rem; }
.front-key--cold b { clip-path: polygon(50% 0, 100% 100%, 0 100%); }
.front-key--warm { color: #d43c36; }
.front-key--warm b { border-radius: .7rem .7rem 0 0; }
.front-key--stationary {
  color: #1768c5;
  background: linear-gradient(90deg, #1768c5 0 50%, #d43c36 50%);
  background-position: 0 .45rem;
  background-repeat: no-repeat;
  background-size: 100% 3px;
}
.front-key--stationary::before { display: none; }
.front-key--stationary b:first-child {
  top: .48rem;
  color: #1768c5;
  clip-path: polygon(0 0, 100% 0, 50% 100%);
}
.front-key--stationary b:last-child {
  top: .04rem;
  color: #d43c36;
  border-radius: .7rem .7rem 0 0;
}
.front-key--occluded { color: #8a2bb7; }
.front-key--occluded b:first-child { clip-path: polygon(50% 0, 100% 100%, 0 100%); }
.front-key--occluded b:last-child { border-radius: .7rem .7rem 0 0; }
.legend-source {
  color: var(--ink-soft);
  font-size: .66rem;
}
.pressure-label {
  color: #294f75;
  padding: .1rem .2rem;
  border-radius: 2px;
  background: rgb(255 255 255 / 72%);
  font: 750 .66rem/1 var(--font-ui);
  text-shadow: 0 1px white, 1px 0 white, 0 -1px white, -1px 0 white;
  white-space: nowrap;
}
.pressure-center {
  width: 2.25rem;
  height: 2.25rem;
  display: grid;
  place-items: center;
  border: 2px solid white;
  border-radius: 50%;
  color: white;
  font: 850 1.05rem/1 var(--font-ui);
  box-shadow: 0 1px 6px rgb(0 0 0 / 35%);
}
.pressure-center--high { background: #c9332d; }
.pressure-center--low { background: #1768ac; }
.wind-arrow {
  color: var(--wind-color, #173b6c);
  font-size: var(--wind-size, 1rem);
  font-weight: var(--wind-weight, 650);
  line-height: 32px;
  opacity: var(--wind-opacity, .72);
  display: block;
  width: 32px;
  height: 32px;
  text-align: center;
  transform-origin: center;
  text-shadow: 0 1px 3px white, 1px 0 3px white, 0 -1px 3px white, -1px 0 3px white;
}
.front-line { filter: drop-shadow(0 1px 1px rgb(255 255 255 / 90%)); }
.front-symbol {
  position: relative;
  width: 18px;
  height: 18px;
  display: grid;
  place-items: center;
  transform-origin: center;
}
.front-symbol--triangle::before {
  content: "";
  position: absolute;
  top: 0;
  left: 1px;
  width: 15px;
  height: 12px;
  background: var(--front-color);
  clip-path: polygon(50% 0, 100% 100%, 0 100%);
}
.front-symbol--semicircle::before {
  content: "";
  position: absolute;
  top: 2px;
  left: 1px;
  width: 15px;
  height: 9px;
  border-radius: 15px 15px 0 0;
  background: var(--front-color);
}
.wind-scale { flex-wrap: wrap; }
.wind-scale i {
  width: .65rem;
  height: .65rem;
  display: inline-block;
  background: var(--wind-swatch);
}
.air-gradient {
  width: 100%;
  height: .55rem;
  border: 1px solid rgb(23 59 108 / 15%);
  background: linear-gradient(90deg, #174ea6, #2e86de, #20a4b8, #79bc7b, #f2c94c, #e76f36, #c4342f);
}
.front-explainer {
  display: grid;
  gap: var(--space-2);
}
.front-explainer h2,
.front-explainer p { margin: 0; }
.front-explainer h2 { font-size: clamp(1.25rem, 2vw, 1.7rem); }
.front-explainer p { max-width: var(--measure); color: var(--ink-soft); }
.synoptic-bulletin {
  display: grid;
  gap: var(--space-5);
}
.synoptic-bulletin__heading {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: end;
  gap: var(--space-2) var(--space-5);
}
.synoptic-bulletin__heading h2,
.synoptic-bulletin__heading p { margin-bottom: 0; }
.synoptic-bulletin__heading > p {
  color: var(--ink-soft);
  font-variant-numeric: tabular-nums;
}
.bulletin-takeaway {
  padding: var(--space-4);
  border-left: .3rem solid var(--page-accent, #174ea6);
  background: #f4f7fb;
  background: color-mix(in srgb, var(--page-accent, #174ea6) 7%, white);
}
.bulletin-takeaway h3 { margin: 0 0 var(--space-2); }
.bulletin-takeaway ul {
  margin: 0;
  padding-left: 1.2rem;
}
.bulletin-takeaway li + li { margin-top: .35rem; }
.bulletin-grid {
  display: grid;
  gap: 0 var(--space-6);
}
.bulletin-grid article {
  padding-block: var(--space-3);
  border-top: 1px solid var(--line);
}
.bulletin-grid h3 {
  margin: 0 0 .35rem;
  font-size: 1rem;
}
.bulletin-grid p {
  max-width: var(--measure);
  margin: 0;
  color: var(--ink-soft);
}
.europe-explainer {
  display: grid;
  gap: var(--space-2);
}
.europe-explainer h2,
.europe-explainer p { margin: 0; }
.europe-explainer__content {
  display: grid;
  gap: var(--space-3);
  max-width: var(--measure);
}
.europe-explainer__content p { color: var(--ink-soft); }
.method-note { color: var(--ink-soft); font-size: .9rem; }
.leaflet-container { font-family: var(--font-ui); }

@media (min-width: 48rem) {
  .situation-controls { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .situation-map-wrap { min-height: 600px; }
  .bulletin-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 40rem) {
  .situation-map-wrap { min-height: 480px; }
  .situation-legend { right: var(--space-2); bottom: var(--space-2); }
}