:root {
  --line: #eadfce;
  --line-strong: #d9c5b0;
  --accent: #ef6b4c;
  --accent-soft: rgba(239, 107, 76, 0.14);
  --accent-2: #d98a3a;
  --accent-2-soft: rgba(217, 138, 58, 0.14);
  --accent-3: #7cc19c;
  --accent-3-soft: rgba(124, 193, 156, 0.16);
}

.app-card {
  border-radius: 1.25rem;
}

.app-header {
  border-top-left-radius: inherit;
  border-top-right-radius: inherit;
  border-bottom-right-radius: 0;
  border-bottom-left-radius: 0;
}

.app-shell {
  margin: 12px auto;
  padding: 0 12px 28px;
}

.app-shell.statistics-shell {
  width: 100%;
  max-width: 1440px;
}

.app-shell.statistics-shell .app-card {
  overflow: visible;
}

.app-body {
  padding: 24px;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.7), rgba(255, 255, 255, 0.92)), linear-gradient(135deg, rgba(240, 212, 181, 0.22), transparent 55%);
}

.station-shell,
.report-card,
.insight-card {
  min-width: 0;
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 1rem;
}

.station-shell {
  position: relative;
  z-index: 20;
  display: grid;
  grid-template-columns: auto minmax(320px, 1fr) minmax(480px, .9fr);
  align-items: center;
  gap: 1rem;
  margin-bottom: 1rem;
  padding: .7rem .85rem;
  overflow: visible;
  background: linear-gradient(180deg, #fffaf4, #fffdf9);
}

.admin-context-nav {
  display: flex;
  justify-content: flex-start;
  margin-bottom: .85rem;
}

.admin-context-link {
  display: inline-flex;
  align-items: center;
  gap: .45rem;
  padding: .42rem .72rem;
  border: 1px solid #eadfce;
  border-radius: 999px;
  background: #fffdf9;
  color: #7a3b10;
  font-size: .82rem;
  font-weight: 800;
  text-decoration: none;
}

.admin-context-link:hover,
.admin-context-link:focus {
  color: #5f2e0c;
  border-color: #e4b06f;
  background: #fff8ef;
}

.station-hero-icon {
  position: relative;
  z-index: 1;
  width: 2.75rem;
  height: 2.75rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  border-radius: .75rem;
  color: #fff;
  background: linear-gradient(135deg, #ef7d12, #d85c00);
  font-size: 1.25rem;
  box-shadow: 0 10px 22px rgba(95, 46, 12, .07);
}

.station-shell-intro {
  position: relative;
  z-index: 1;
  min-width: 0;
}

.station-shell-title {
  max-width: 520px;
  margin: 0;
  color: #281508;
  font-size: .98rem;
  line-height: 1.2;
  font-weight: 900;
}

.station-shell-copy {
  max-width: 720px;
  margin: .18rem 0 0;
  color: var(--ink);
  font-size: .76rem;
  line-height: 1.35;
}

.station-filter-dropdown {
  position: relative;
  z-index: 2600;
  justify-self: end;
  width: min(100%, 344px);
  min-width: 0;
}

.station-filter-button {
  position: relative;
  width: 100%;
  min-height: 2.8rem;
  gap: .5rem;
  padding: .38rem .62rem;
  border: 1px solid #eadfce;
  border-radius: .75rem;
  background: linear-gradient(180deg, #fffdf9, #fff8ef);
  color: #281508;
  box-shadow: 0 5px 12px rgba(95, 46, 12, .05);
  text-align: left;
}

.station-filter-button:hover,
.station-filter-button:focus {
  border-color: #d99a54;
  background: linear-gradient(180deg, #fffaf4, #fff2df);
}

.station-filter-summary-item {
  min-width: 0;
  display: flex;
  align-items: center;
  gap: .38rem;
}

.station-filter-summary-item i {
  flex: 0 0 auto;
  color: #d85c00;
  font-size: .95rem;
}

.station-filter-summary-item span {
  min-width: 0;
  display: grid;
  gap: .06rem;
}

.station-filter-summary-item small {
  color: var(--ink);
  font-size: .64rem;
  font-weight: 800;
  line-height: 1.05;
}

.station-filter-summary-item strong {
  overflow: hidden;
  color: #24160d;
  font-size: .78rem;
  font-weight: 900;
  line-height: 1.1;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.station-filter-divider {
  width: 1px;
  height: 1.75rem;
  flex: 0 0 1px;
  background: #eadfce;
}

.station-filter-caret {
  flex: 0 0 auto;
  margin-left: auto;
  color: #b85200;
  font-size: .9rem;
}

.station-filter-menu {
  right: 0;
  left: auto;
  z-index: 2700;
  width: min(430px, calc(100vw - 2rem));
  padding: .7rem;
  border: 1px solid #eadfce;
  border-radius: .85rem;
  background: #fffaf4;
  box-shadow: 0 18px 34px rgba(95, 46, 12, .14);
}

.station-filter-menu-actions {
  display: flex;
  justify-content: flex-end;
  margin-top: .65rem;
  padding-top: .6rem;
  border-top: 1px solid #eadfce;
}

.station-filter-menu-actions .btn {
  min-height: 2.15rem;
  min-width: 132px;
  font-size: .78rem;
  font-weight: 800;
}

.btn-primary-fire {
  color: #fff;
  background: linear-gradient(180deg, #b96514, #8c4915);
  border-color: #8c4915;
}

.btn-primary-fire:hover,
.btn-primary-fire:focus {
  color: #fff;
  background: linear-gradient(180deg, #c86f18, #7a3b10);
  border-color: #7a3b10;
}

.station-select-wrap {
  position: relative;
  width: 100%;
}

.filter-label {
  font-size: .74rem;
  text-transform: uppercase;
  letter-spacing: .08em;
  font-weight: 800;
  color: var(--ink);
}

.station-select-wrap .filter-label {
  display: block;
  margin-bottom: .12rem;
}

.station-select-wrap::after {
  content: "";
  position: absolute;
  right: .68rem;
  bottom: .58rem;
  width: .55rem;
  height: .55rem;
  border-right: 2px solid #8c4915;
  border-bottom: 2px solid #8c4915;
  transform: rotate(45deg);
  pointer-events: none;
  opacity: .9;
}

.station-select-wrap .form-select {
  appearance: none;
  -webkit-appearance: none;
  border-color: var(--line-strong);
  background: linear-gradient(180deg, #fff, #fff8ef);
  min-height: 2.2rem;
  padding: .35rem 2.1rem .35rem .68rem;
  border-radius: .7rem;
  box-shadow: 0 6px 14px rgba(95, 46, 12, 0.06);
  font-size: .78rem;
  font-weight: 600;
  color: #3b322b;
}

.station-select-wrap .form-select:hover {
  border-color: #c88b44;
  background: linear-gradient(180deg, #fff, #fff3df);
}

.station-select-wrap .form-select:focus {
  border-color: #b96514;
  box-shadow: 0 0 0 .2rem rgba(185, 101, 20, 0.16), 0 8px 18px rgba(95, 46, 12, 0.10);
}

.year-indicator {
  display: inline-flex;
  align-items: center;
  gap: .45rem;
  margin-top: .55rem;
  margin-left: .45rem;
  padding: .35rem .65rem;
  border-radius: 999px;
  background: #fff5ea;
  color: #8a5a12;
  font-size: .78rem;
  font-weight: 700;
  border: 1px solid #f0d4b5;
}

.content-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 320px;
  gap: 1rem;
}

.report-card {
  padding: 1.15rem 1.15rem 1.25rem;
  overflow: hidden;
}

.report-head {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  align-items: flex-start;
  flex-wrap: wrap;
  margin-bottom: 1rem;
}

.report-head-inline {
  flex-wrap: nowrap;
  align-items: flex-start;
}

.report-head-copy {
  min-width: 0;
  flex: 1 1 auto;
}

.report-title {
  margin: 0;
  font-size: 1.02rem;
  font-weight: 800;
  color: var(--fire-dark);
}

.report-sub {
  margin: .25rem 0 0;
  color: var(--ink);
  font-size: .88rem;
}

.report-tag {
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  padding: .4rem .7rem;
  border-radius: 999px;
  font-size: .78rem;
  font-weight: 700;
  color: #7a3b10;
  background: #f7efe5;
  flex: 0 0 auto;
}

.line-chart {
  position: relative;
  height: 280px;
  padding: 1rem;
  border: 1px solid var(--line);
  border-radius: 1rem;
  background: linear-gradient(180deg, #fff, #fffdf9);
}

.line-chart svg {
  width: 100%;
  height: 100%;
}

.axis-label {
  font-size: .78rem;
  fill: #7f6e60;
  font-weight: 600;
}

.axis-line,
.grid-stroke {
  stroke: #ebdfd2;
  stroke-width: 1;
}

.line-stroke {
  fill: none;
  stroke: #d98a3a;
  stroke-width: 4;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.point {
  fill: #fff;
  stroke: #d98a3a;
  stroke-width: 3;
}

.point-value {
  font-size: .74rem;
  fill: #7a3b10;
  font-weight: 800;
}

.point-label {
  font-size: .72rem;
  fill: #6b5c50;
}

.dashboard-stack {
  display: grid;
  gap: 1rem;
}

.statistics-filter-panel {
  display: grid;
  gap: .65rem;
  margin-bottom: 1rem;
  padding: .85rem .95rem .95rem;
  border: 1px solid #eadfce;
  border-radius: 1rem;
  background: linear-gradient(180deg, #fffdf9, #fffaf4);
  box-shadow: 0 8px 18px rgba(95, 46, 12, .045);
}

.statistics-filter-title {
  color: #7a3b10;
  font-size: .72rem;
  font-weight: 900;
  letter-spacing: .04em;
}

.statistics-filter-grid {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: .65rem;
}

.statistics-filter-field {
  min-width: 0;
  display: grid;
  gap: .25rem;
}

.statistics-filter-field label {
  color: #3a2a1f;
  font-size: .68rem;
  font-weight: 900;
  line-height: 1.15;
}

.statistics-filter-field .form-select {
  min-height: 2.25rem;
  padding-top: .38rem;
  padding-bottom: .38rem;
  border-color: #eadfce;
  border-radius: .65rem;
  background-color: #fff;
  color: #281508;
  font-size: .78rem;
  font-weight: 700;
}

.statistics-kpi-strip {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: .7rem;
  margin-bottom: 1rem;
}

.statistics-kpi-card {
  min-width: 0;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: start;
  gap: .28rem .5rem;
  padding: .72rem .78rem .62rem;
  border: 1px solid #eadfce;
  border-radius: .75rem;
  background: linear-gradient(180deg, #fffdf9, #fffaf4);
  box-shadow: 0 8px 18px rgba(95, 46, 12, .045);
}

.statistics-kpi-icon {
  width: 1.75rem;
  height: 1.75rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: .55rem;
  color: #d85c00;
  background: #fff2df;
}

.statistics-kpi-card b {
  align-self: center;
  min-height: 0;
  color: var(--ink);
  font-size: .56rem;
  font-weight: 900;
  line-height: 1.05;
  text-transform: uppercase;
}

.statistics-kpi-card strong {
  grid-column: 1 / -1;
  justify-self: center;
  text-align: center;
  color: #281508;
  font-size: 1.25rem;
  line-height: 1;
}

.statistics-kpi-card.warning .statistics-kpi-icon {
  color: #bf3d2b;
  background: #fff1ef;
}

.statistics-kpi-card.ok .statistics-kpi-icon {
  color: #16743a;
  background: #eef9f0;
}

.statistics-kpi-card.purple .statistics-kpi-icon {
  color: #7656b0;
  background: #f2ecfb;
}

.statistics-sparkline {
  grid-column: 1 / -1;
  height: 18px;
  width: 100%;
  margin-top: .1rem;
  overflow: visible;
}

.statistics-sparkline polyline {
  fill: none;
  stroke: #e66f18;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.6;
}

.statistics-kpi-card.warning .statistics-sparkline polyline {
  stroke: #ef6b4c;
}

.statistics-kpi-card.ok .statistics-sparkline polyline {
  stroke: #31a34a;
}

.statistics-kpi-card.purple .statistics-sparkline polyline {
  stroke: #9b6bd3;
}

.statistics-analysis-panel {
  display: grid;
  gap: 1.15rem;
  border: 0;
  border-radius: 0;
  background: transparent;
  overflow: visible;
}

.statistics-dashboard-section {
  display: grid;
  gap: .75rem;
}

.statistics-section-title {
  margin: 0;
  color: #0f355f;
  font-size: .92rem;
  font-weight: 900;
  letter-spacing: .02em;
  text-transform: uppercase;
}

.statistics-section-grid {
  display: grid;
  gap: 1rem;
  align-items: stretch;
}

.statistics-section-grid-two {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.statistics-section-grid-three {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.statistics-section-grid-three .statistics-chart-card {
  padding: .9rem;
}

.statistics-section-grid-three .statistics-chart-head h2 {
  font-size: .9rem;
  line-height: 1.18;
}

.statistics-section-grid-three .risk-bar-chart,
.statistics-section-grid-three .spread-stack-chart,
.statistics-section-grid-three .safety-working-chart {
  --axis-label-width: 112px;
  --axis-gap: .55rem;
  padding: .7rem;
}

.statistics-section-grid-three .risk-bar-chart span,
.statistics-section-grid-three .spread-stack-chart span,
.statistics-section-grid-three .safety-working-chart span {
  font-size: .74rem;
}

.statistics-section-grid-three .statistics-legend {
  gap: .55rem;
  margin-top: .45rem;
  font-size: .7rem;
}

.statistics-section-grid-three .spread-stack-chart {
  align-content: stretch;
}

.statistics-section-grid-three .spread-stack-plot {
  gap: 1.35rem;
  padding-top: .45rem;
  padding-bottom: 0;
}

.statistics-section-grid-three .spread-stack-chart b {
  height: 2.65rem;
}

.statistics-volume-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .75rem;
}

.statistics-volume-grid div {
  min-width: 0;
  padding: .9rem 1rem;
  border: 1px solid #eadfce;
  border-radius: .8rem;
  background: linear-gradient(180deg, #fffaf4, #fffdf9);
}

.statistics-volume-grid b,
.statistics-volume-grid span {
  display: block;
  color: var(--ink);
  font-size: .76rem;
}

.statistics-volume-grid strong {
  display: block;
  margin: .2rem 0;
  color: #281508;
  font-size: 1.8rem;
  line-height: 1;
}

.statistics-volume-grid.safety div {
  background: linear-gradient(180deg, #f8fcf8, #fffdf9);
}

.pillar-chart {
  display: grid;
  grid-template-columns: 46px minmax(0, 1fr);
  gap: .8rem;
  min-height: 320px;
  padding: 1rem;
  border: 1px solid var(--line);
  border-radius: 1rem;
  background: linear-gradient(180deg, #fff, #fffdf9);
}

.pillar-axis {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding: .3rem 0 2.1rem;
  color: #7b6b5c;
  font-size: .72rem;
  font-weight: 800;
  text-align: right;
}

.pillar-plot {
  position: relative;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1rem;
  min-width: 0;
  padding: .3rem .6rem 0;
  background:
    linear-gradient(#f0e7dc 1px, transparent 1px) 0 0 / 100% 25%,
    linear-gradient(180deg, rgba(255, 250, 244, .72), rgba(255, 253, 249, .9));
  border-radius: .8rem;
}

.pillar-group {
  min-width: 0;
  display: grid;
  grid-template-rows: minmax(0, 1fr) auto;
  gap: .65rem;
  text-align: center;
}

.pillar-bars {
  height: 235px;
  display: flex;
  align-items: end;
  justify-content: center;
  gap: .45rem;
}

.pillar {
  position: relative;
  width: min(38px, 34%);
  min-height: 10px;
  border-radius: .55rem .55rem .18rem .18rem;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .55);
}

.pillar b {
  position: absolute;
  right: 50%;
  bottom: calc(100% + .28rem);
  color: #5f2e0c;
  font-size: .7rem;
  transform: translateX(50%);
  white-space: nowrap;
}

.pillar.incidents {
  background: linear-gradient(180deg, #ef7d12, #c95500);
}

.pillar.fatalities {
  background: linear-gradient(180deg, #ef6b4c, #b93626);
}

.pillar-group strong {
  overflow: hidden;
  color: #5f2e0c;
  font-size: .78rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.pillar-legend {
  grid-column: 2;
  display: flex;
  justify-content: center;
  gap: 1rem;
  color: var(--ink);
  font-size: .78rem;
  font-weight: 800;
}

.pillar-legend span {
  display: inline-flex;
  align-items: center;
  gap: .35rem;
}

.pillar-legend i {
  width: .65rem;
  height: .65rem;
  border-radius: 999px;
}

.incident-dot {
  background: #d85c00;
}

.fatality-dot {
  background: #c43d2c;
}

.calendar-matrix-wrap {
  padding: .85rem;
}

.calendar-matrix {
  min-width: 760px;
  margin-bottom: 0;
  border-collapse: separate;
  border-spacing: .35rem;
}

.calendar-matrix th {
  color: #5f2e0c;
  font-size: .72rem;
  font-weight: 900;
  text-transform: none;
  white-space: nowrap;
}

.calendar-matrix td {
  min-width: 4.8rem;
  padding: .55rem .45rem;
  border: 1px solid #f0d4b5;
  border-radius: .65rem;
  background: #fff7ec;
  color: #5f2e0c;
  font-size: .86rem;
  font-weight: 900;
  text-align: center;
}

.calendar-matrix td:nth-child(n+6) {
  background: #fff2df;
  border-color: #e4b06f;
}

.calendar-matrix td {
  box-shadow: 0 4px 10px rgba(95, 46, 12, .03);
}

.bar-chart {
  display: grid;
  gap: .9rem;
  padding: 1rem;
  border: 1px solid var(--line);
  border-radius: 1rem;
  background: linear-gradient(180deg, #fff, #fffdf9);
}

.bar-row {
  display: grid;
  grid-template-columns: minmax(140px, 220px) minmax(0, 1fr) 48px;
  gap: .8rem;
  align-items: center;
}

.bar-label {
  font-size: .84rem;
  font-weight: 700;
  color: #5f2e0c;
}

.bar-track {
  position: relative;
  height: 1rem;
  border-radius: 999px;
  background: #f5ebe0;
  overflow: hidden;
}

.bar-fill {
  height: 100%;
  border-radius: 999px;
  background: linear-gradient(90deg, #d98a3a, #ef6b4c);
}

.bar-fill-alt {
  background: linear-gradient(90deg, #7cc19c, #d98a3a);
}

.bar-value {
  font-size: .82rem;
  font-weight: 800;
  color: #7a3b10;
  text-align: right;
}

.statistics-chart-card {
  min-width: 0;
  display: flex;
  flex-direction: column;
  padding: 1rem 1.1rem 1.15rem;
  border: 1px solid var(--line);
  border-radius: 1rem;
  background: linear-gradient(180deg, #fffdf9, #fffaf4);
  box-shadow: 0 8px 18px rgba(95, 46, 12, .045);
}

.statistics-chart-head {
  margin-bottom: .9rem;
}

.statistics-chart-head h2 {
  margin: 0;
  color: #0f355f;
  font-size: .98rem;
  font-weight: 900;
}

.statistics-chart-head p {
  display: none;
}

.combo-country-chart,
.risk-bar-chart,
.spread-stack-chart,
.grouped-outcome-chart,
.age-stack-chart,
.safety-working-chart {
  flex: 1;
  min-width: 0;
  padding: .85rem;
  border: 1px solid #eadfce;
  border-radius: .85rem;
  background: linear-gradient(180deg, #fff, #fffdf9);
}

.combo-country-chart {
  display: grid;
  align-content: stretch;
  overflow: hidden;
}

.combo-chart-frame {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr) 30px;
  align-items: stretch;
  gap: .35rem;
  min-width: 0;
}

.combo-axis {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  height: 326px;
  margin-top: .55rem;
  color: #173b60;
  font-size: .72rem;
  font-weight: 800;
}

.combo-axis-left {
  text-align: right;
}

.combo-axis-right {
  text-align: left;
}

.combo-plot {
  --chart-top: .55rem;
  --chart-height: 310px;
  --label-space: 3.7rem;
  position: relative;
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  align-items: end;
  gap: .42rem;
  min-width: 0;
  height: calc(var(--chart-top) + var(--chart-height) + var(--label-space));
  padding: var(--chart-top) .55rem var(--label-space);
  background: transparent;
}

.combo-plot::before,
.combo-plot::after {
  position: absolute;
  right: .55rem;
  left: .55rem;
  content: "";
}

.combo-plot::before {
  top: var(--chart-top);
  height: var(--chart-height);
  z-index: 0;
  background:
    linear-gradient(#e1e7ed 1px, transparent 1px) 0 0 / 100% 43.33px,
    linear-gradient(180deg, #fff, #fffaf4);
  border-right: 1px solid #7c8a99;
  border-left: 1px solid #7c8a99;
}

.combo-plot::after {
  top: calc(var(--chart-top) + var(--chart-height));
  z-index: 1;
  border-top: 1px solid #7c8a99;
}

.combo-line {
  position: absolute;
  top: var(--chart-top);
  right: .55rem;
  left: .55rem;
  width: calc(100% - 1.1rem);
  height: var(--chart-height);
  z-index: 3;
  pointer-events: none;
  overflow: visible;
}

.combo-line polyline {
  fill: none;
  stroke: #c7392e;
  stroke-width: 4;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.combo-line circle {
  r: 7;
  fill: #c7392e;
}

.combo-bar {
  position: relative;
  display: grid;
  justify-items: center;
  align-items: end;
  height: var(--chart-height);
  min-width: 0;
  z-index: 2;
}

.combo-bar span {
  position: relative;
  width: 68%;
  min-height: 12px;
  background: #1f577d;
}

.combo-bar span b {
  position: absolute;
  top: -1.1rem;
  left: 50%;
  color: #29465d;
  font-size: .7rem;
  transform: translateX(-50%);
}

.combo-bar strong {
  position: absolute;
  top: max(0px, min(var(--chart-height), var(--fatal-y)));
  left: 60%;
  color: #b3201b;
  font-size: .7rem;
  z-index: 4;
  transform: translateY(-50%);
}

.combo-bar strong.fatal-zero {
  top: var(--fatal-y);
  bottom: auto;
  line-height: 1;
  transform: translateY(-50%);
}

.combo-bar em {
  position: absolute;
  bottom: -2.65rem;
  left: 50%;
  width: max-content;
  max-width: 90px;
  color: #1f2933;
  font-size: .7rem;
  font-style: normal;
  transform: translateX(-50%) rotate(-35deg);
  transform-origin: center;
}

.statistics-legend {
  display: flex;
  justify-content: center;
  gap: 1rem;
  flex-wrap: wrap;
  margin-top: .65rem;
  color: #334155;
  font-size: .76rem;
  font-weight: 800;
}

.statistics-legend span {
  display: inline-flex;
  align-items: center;
  gap: .35rem;
}

.statistics-legend i {
  width: .75rem;
  height: .75rem;
  display: inline-block;
  border-radius: .18rem;
}

.legend-blue { background: #1f577d; }
.legend-red { background: #c5392f; }
.legend-green { background: #28965a; }
.legend-orange { background: #ed7d1a; }
.legend-gray { background: #8d98a3; }
.age0 { background: #6fb3df; }
.age1 { background: #2786c7; }
.age2 { background: #f4a21a; }
.age3 { background: #ed7d1a; }
.age4 { background: #c5392f; }

.statistics-heatmap {
  padding: .15rem;
}

.statistics-heatmap table {
  min-width: 860px;
  margin: 0;
  border-collapse: separate;
  border-spacing: 1px;
}

.statistics-heatmap th {
  color: #173b60;
  font-size: .76rem;
  font-weight: 900;
  background: #fffdf9;
  border: 0;
  white-space: nowrap;
}

.statistics-heatmap td {
  min-width: 5.6rem;
  padding: .5rem .45rem;
  border: 0;
  color: #111827;
  font-size: .82rem;
  font-weight: 800;
  text-align: center;
}

.statistics-heatmap .h0 { background: #faeeee; }
.statistics-heatmap .h1 { background: #f8dada; }
.statistics-heatmap .h2 { background: #f6caca; }
.statistics-heatmap .h3 { background: #f1b8b4; }
.statistics-heatmap .h4 { background: #e9a29d; }
.statistics-heatmap .h5 { background: #de8981; }
.statistics-heatmap .h6 { background: #c96f66; }
.statistics-heatmap .h7 { background: #a9382f; color: #fff; }

.risk-bar-chart {
  display: grid;
  gap: 0;
  position: relative;
  --axis-label-width: 148px;
  --axis-gap: .8rem;
  --chart-grid-line: rgba(23, 59, 96, .42);
  --chart-edge-offset: 0;
  --chart-line-width: 1px;
}

.risk-bar-chart div,
.spread-stack-chart div,
.safety-working-chart div,
.age-stack-chart div {
  display: grid;
  grid-template-columns: minmax(130px, 190px) minmax(0, 1fr);
  align-items: center;
  gap: .8rem;
}

.chart-scale {
  margin-bottom: -.25rem;
}

.chart-scale b {
  display: flex;
  justify-content: space-between;
  min-width: 0;
  padding: 0;
  background: transparent;
  color: #173b60;
  font-size: .72rem;
  font-weight: 900;
}

.chart-scale i {
  display: inline;
  height: auto;
  background: transparent;
  font-style: normal;
  transform: translateX(-50%);
}

.chart-scale i:first-child {
  transform: none;
}

.chart-scale i:last-child {
  transform: translateX(50%);
}

.risk-bar-chart span,
.spread-stack-chart span,
.safety-working-chart span,
.age-stack-chart span {
  color: #172033;
  font-size: .8rem;
  font-weight: 800;
  line-height: 1.15;
  text-align: right;
}

.risk-bar-plot span {
  max-width: var(--axis-label-width);
  white-space: normal;
}

.risk-bar-chart b {
  position: relative;
  z-index: 2;
  min-width: 2.5rem;
  padding: .35rem .55rem;
  background: #c5392f;
  color: transparent;
  font-size: .76rem;
  font-weight: 900;
}

.risk-bar-plot b::after {
  content: attr(data-value);
  position: absolute;
  top: 50%;
  left: 100%;
  color: #7a1f18;
  font-size: .76rem;
  font-weight: 900;
  line-height: 1;
  white-space: nowrap;
  transform: translate(.35rem, -50%);
}

.risk-bar-chart div,
.risk-bar-plot div,
.risk-bar-chart .chart-scale {
  grid-template-columns: var(--axis-label-width) minmax(0, 1fr);
  gap: var(--axis-gap);
}

.risk-bar-plot {
  position: relative;
  display: grid;
  gap: .82rem;
  padding-top: .72rem;
}

.risk-bar-chart .risk-bar-plot {
  grid-template-columns: 1fr;
  align-items: stretch;
}

.risk-bar-plot::before {
  position: absolute;
  top: calc(-4 * var(--chart-line-width));
  right: var(--chart-edge-offset);
  bottom: 0;
  left: calc(var(--axis-label-width) + var(--axis-gap));
  z-index: 3;
  background:
    linear-gradient(90deg,
      var(--chart-grid-line) 0,
      var(--chart-grid-line) var(--chart-line-width),
      transparent var(--chart-line-width),
      transparent 25%,
      var(--chart-grid-line) 25%,
      var(--chart-grid-line) calc(25% + var(--chart-line-width)),
      transparent calc(25% + var(--chart-line-width)),
      transparent 50%,
      var(--chart-grid-line) 50%,
      var(--chart-grid-line) calc(50% + var(--chart-line-width)),
      transparent calc(50% + var(--chart-line-width)),
      transparent 75%,
      var(--chart-grid-line) 75%,
      var(--chart-grid-line) calc(75% + var(--chart-line-width)),
      transparent calc(75% + var(--chart-line-width)),
      transparent calc(100% - var(--chart-line-width)),
      var(--chart-grid-line) calc(100% - var(--chart-line-width)),
      var(--chart-grid-line) 100%);
  content: "";
  pointer-events: none;
}

.risk-bar-chart .chart-scale {
  justify-items: stretch;
  margin-bottom: 0;
}

.risk-bar-chart .chart-scale b {
  width: auto;
  justify-self: stretch;
  margin-right: var(--chart-edge-offset);
  padding-bottom: .35rem;
  border-bottom: var(--chart-line-width) solid var(--chart-grid-line);
}

.spread-stack-chart {
  position: relative;
  display: grid;
  align-content: start;
  gap: .25rem;
  --axis-label-width: 104px;
  --axis-gap: .5rem;
  --chart-grid-line: rgba(23, 59, 96, .42);
  --chart-edge-offset: .45rem;
  --chart-line-width: 1px;
}

.spread-stack-chart div,
.spread-stack-plot div,
.spread-stack-chart .chart-scale {
  grid-template-columns: var(--axis-label-width) minmax(0, 1fr);
  gap: var(--axis-gap);
}

.spread-stack-plot {
  position: relative;
  display: grid;
  gap: .85rem;
  padding-bottom: 0;
}

.spread-stack-chart .spread-stack-plot {
  grid-template-columns: 1fr;
  align-items: stretch;
}

.spread-stack-plot::before {
  position: absolute;
  top: 0;
  right: var(--chart-edge-offset);
  bottom: 0;
  left: calc(var(--axis-label-width) + var(--axis-gap));
  z-index: 3;
  background:
    linear-gradient(90deg,
      var(--chart-grid-line) 0,
      var(--chart-grid-line) var(--chart-line-width),
      transparent var(--chart-line-width),
      transparent 20%,
      var(--chart-grid-line) 20%,
      var(--chart-grid-line) calc(20% + var(--chart-line-width)),
      transparent calc(20% + var(--chart-line-width)),
      transparent 40%,
      var(--chart-grid-line) 40%,
      var(--chart-grid-line) calc(40% + var(--chart-line-width)),
      transparent calc(40% + var(--chart-line-width)),
      transparent 60%,
      var(--chart-grid-line) 60%,
      var(--chart-grid-line) calc(60% + var(--chart-line-width)),
      transparent calc(60% + var(--chart-line-width)),
      transparent 80%,
      var(--chart-grid-line) 80%,
      var(--chart-grid-line) calc(80% + var(--chart-line-width)),
      transparent calc(80% + var(--chart-line-width)),
      transparent calc(100% - var(--chart-line-width)),
      var(--chart-grid-line) calc(100% - var(--chart-line-width)),
      var(--chart-grid-line) 100%);
  content: "";
  pointer-events: none;
}

.spread-stack-chart .chart-scale {
  justify-items: stretch;
  margin-top: -1rem;
  margin-bottom: 0;
}

.spread-stack-chart .chart-scale b {
  width: auto;
  justify-self: stretch;
  box-sizing: border-box;
  margin-right: var(--chart-edge-offset);
  padding-top: .35rem;
  border-top: 1px solid var(--chart-grid-line);
}

.spread-stack-chart b,
.age-stack-chart b,
.safety-working-chart b {
  position: relative;
  display: flex;
  height: 2.1rem;
  background: transparent;
}

.spread-stack-chart b {
  margin-right: var(--chart-edge-offset);
  min-height: 2.25rem;
  background: #f1f5f2;
}

.spread-stack-chart b::before {
  display: none;
}

.spread-stack-chart i,
.spread-stack-chart em,
.age-stack-chart i,
.safety-working-chart i,
.safety-working-chart em {
  display: block;
  height: 100%;
}

.spread-stack-chart i,
.spread-stack-chart em {
  position: relative;
  z-index: 1;
}

.spread-stack-chart i {
  background: #c5392f;
}

.spread-stack-chart em {
  background: #28965a;
}

.risk-bar-chart .chart-scale b,
.spread-stack-chart .chart-scale b,
.age-stack-chart .chart-scale b,
.safety-working-chart .chart-scale b {
  display: flex;
  justify-content: space-between;
  height: auto;
  min-width: 0;
  padding: 0;
  background: transparent;
  color: #173b60;
  font-size: .72rem;
  font-weight: 900;
}

.risk-bar-chart .chart-scale i,
.spread-stack-chart .chart-scale i,
.age-stack-chart .chart-scale i,
.safety-working-chart .chart-scale i {
  display: inline;
  height: auto;
  background: transparent;
  color: #173b60;
}

.risk-bar-chart .chart-scale b {
  width: 100%;
  justify-self: stretch;
  padding-bottom: .35rem;
  border-bottom: 1px solid var(--chart-grid-line);
}

.spread-stack-chart .chart-scale b {
  width: auto;
  justify-self: stretch;
  box-sizing: border-box;
  margin-right: var(--chart-edge-offset);
  padding-top: .35rem;
  border-top: var(--chart-line-width) solid var(--chart-grid-line);
}

.spread-stack-chart .chart-scale b::before,
.age-stack-chart .chart-scale b::before {
  display: none;
}

.grouped-outcome-chart {
  position: relative;
  display: grid;
  grid-template-columns: 2.1rem minmax(0, 1fr);
  align-items: start;
  gap: .5rem;
  min-height: 250px;
  padding: 1.25rem .45rem 0 .2rem;
  --chart-grid-line: rgba(23, 59, 96, .42);
}

.grouped-outcome-chart::before {
  display: none;
}

.outcome-axis {
  position: relative;
  z-index: 2;
  height: 220px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  color: #173b60;
  font-size: .72rem;
  font-weight: 900;
  text-align: right;
}

.outcome-plot {
  position: relative;
  display: grid;
  grid-template-columns: repeat(2, minmax(110px, 1fr));
  justify-content: center;
  align-items: start;
  gap: 1rem;
  min-width: 0;
  padding: 0 .4rem;
}

.outcome-plot::before {
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  height: 220px;
  z-index: 0;
  background:
    linear-gradient(var(--chart-grid-line) 1px, transparent 1px) 0 0 / 100% 36.66px;
  border-bottom: 1px solid var(--chart-grid-line);
  border-left: 1px solid var(--chart-grid-line);
  content: "";
  pointer-events: none;
}

.outcome-group {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: repeat(2, minmax(42px, 58px));
  grid-template-rows: 220px auto;
  justify-content: center;
  align-items: end;
  column-gap: 0;
  row-gap: .65rem;
  min-width: 0;
}

.outcome-group span {
  grid-column: 1 / -1;
  order: 3;
  color: #172033;
  font-size: .78rem;
  font-weight: 800;
  text-align: center;
}

.outcome-group b {
  position: relative;
  align-self: end;
  width: 100%;
  min-height: 6px;
}

.outcome-group .spread {
  border-radius: .2rem 0 0 0;
}

.outcome-group .fatality {
  border-radius: 0 .2rem 0 0;
}

.outcome-group b em {
  position: absolute;
  top: -1.45rem;
  left: 50%;
  font-size: .76rem;
  font-style: normal;
  font-weight: 900;
  white-space: nowrap;
  transform: translateX(-50%);
}

.outcome-group .spread {
  background: #c5392f;
}

.outcome-group .spread em {
  color: #c5392f;
}

.outcome-group .fatality {
  background: #ed7d1a;
}

.outcome-group .fatality em {
  color: #ed7d1a;
}

.age-stack-chart {
  position: relative;
  display: grid;
  gap: 0;
  --axis-label-width: 96px;
  --axis-gap: .6rem;
  --chart-grid-line: rgba(23, 59, 96, .42);
}

.age-stack-chart div {
  grid-template-columns: var(--axis-label-width) minmax(0, 1fr);
  gap: var(--axis-gap);
}

.age-stack-chart::before {
  display: none;
}

.age-stack-plot {
  position: relative;
  display: grid;
  gap: .64rem;
  padding-bottom: .6rem;
}

.age-stack-chart .age-stack-plot {
  grid-template-columns: 1fr;
  align-items: stretch;
}

.age-stack-plot::before {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: calc(var(--axis-label-width) + var(--axis-gap));
  z-index: 3;
  background:
    linear-gradient(90deg,
      var(--chart-grid-line) 0,
      var(--chart-grid-line) 1px,
      transparent 1px,
      transparent 11.111%,
      var(--chart-grid-line) 11.111%,
      var(--chart-grid-line) calc(11.111% + 1px),
      transparent calc(11.111% + 1px),
      transparent 22.222%,
      var(--chart-grid-line) 22.222%,
      var(--chart-grid-line) calc(22.222% + 1px),
      transparent calc(22.222% + 1px),
      transparent 33.333%,
      var(--chart-grid-line) 33.333%,
      var(--chart-grid-line) calc(33.333% + 1px),
      transparent calc(33.333% + 1px),
      transparent 44.444%,
      var(--chart-grid-line) 44.444%,
      var(--chart-grid-line) calc(44.444% + 1px),
      transparent calc(44.444% + 1px),
      transparent 55.555%,
      var(--chart-grid-line) 55.555%,
      var(--chart-grid-line) calc(55.555% + 1px),
      transparent calc(55.555% + 1px),
      transparent 66.666%,
      var(--chart-grid-line) 66.666%,
      var(--chart-grid-line) calc(66.666% + 1px),
      transparent calc(66.666% + 1px),
      transparent 77.777%,
      var(--chart-grid-line) 77.777%,
      var(--chart-grid-line) calc(77.777% + 1px),
      transparent calc(77.777% + 1px),
      transparent 88.888%,
      var(--chart-grid-line) 88.888%,
      var(--chart-grid-line) calc(88.888% + 1px),
      transparent calc(88.888% + 1px),
      transparent calc(100% - 1px),
      var(--chart-grid-line) calc(100% - 1px),
      var(--chart-grid-line) 100%);
  content: "";
  pointer-events: none;
}

.age-stack-chart div:not(.chart-scale) > b::before {
  display: none;
}

.age-stack-chart div:not(.chart-scale) > b {
  width: 100%;
  min-width: 0;
  box-shadow:
    inset 1px 0 0 var(--chart-grid-line),
    inset -1px 0 0 var(--chart-grid-line);
  overflow: hidden;
}

.age-stack-chart i {
  position: relative;
  z-index: 1;
  flex: 0 0 auto;
}

.age-stack-chart .chart-scale {
  margin-top: 0;
  margin-bottom: 0;
  grid-template-columns: var(--axis-label-width) minmax(0, 1fr);
  gap: var(--axis-gap);
  justify-items: stretch;
}

.age-stack-chart .chart-scale b {
  width: 100%;
  justify-self: stretch;
  padding-top: .35rem;
  border-top: 1px solid var(--chart-grid-line);
}

.age-stack-chart .statistics-legend {
  display: flex;
  grid-template-columns: none;
  justify-content: center;
  gap: .75rem;
  margin-top: .55rem;
}

.age-stack-chart .statistics-legend span {
  display: inline-flex;
  align-items: center;
  gap: .35rem;
  width: auto;
  color: #334155;
  text-align: left;
}

.age-stack-chart .statistics-legend i {
  width: .75rem;
  height: .75rem;
  flex: 0 0 .75rem;
  border-radius: .18rem;
}

.age-stack-chart .statistics-legend .age0 { background: #6fb3df; }
.age-stack-chart .statistics-legend .age1 { background: #2786c7; }
.age-stack-chart .statistics-legend .age2 { background: #f4a21a; }
.age-stack-chart .statistics-legend .age3 { background: #ed7d1a; }
.age-stack-chart .statistics-legend .age4 { background: #c5392f; }

.age-stack-plot div:nth-child(6) .a1 {
  width: 16.67% !important;
}

.age-stack-chart .a0 { background: #6fb3df; }
.age-stack-chart .a1 { background: #2786c7; }
.age-stack-chart .a2 { background: #f4a21a; }
.age-stack-chart .a3 { background: #ed7d1a; }
.age-stack-chart .a4 { background: #c5392f; }

.safety-working-chart {
  position: relative;
  display: grid;
  grid-template-rows: max-content 42px;
  align-content: center;
  gap: 0;
  --axis-label-width: 128px;
  --axis-gap: .8rem;
  --chart-grid-line: rgba(23, 59, 96, .42);
  --chart-edge-offset: 0;
  --chart-line-width: 1px;
}

.safety-working-plot {
  position: relative;
  display: grid;
  gap: .95rem;
}

.safety-working-plot::before {
  position: absolute;
  top: 0;
  right: var(--chart-edge-offset);
  bottom: 0;
  left: calc(var(--axis-label-width) + var(--axis-gap));
  z-index: 3;
  background:
    linear-gradient(90deg,
      var(--chart-grid-line) 0,
      var(--chart-grid-line) var(--chart-line-width),
      transparent var(--chart-line-width),
      transparent 10%,
      var(--chart-grid-line) 10%,
      var(--chart-grid-line) calc(10% + var(--chart-line-width)),
      transparent calc(10% + var(--chart-line-width)),
      transparent 20%,
      var(--chart-grid-line) 20%,
      var(--chart-grid-line) calc(20% + var(--chart-line-width)),
      transparent calc(20% + var(--chart-line-width)),
      transparent 30%,
      var(--chart-grid-line) 30%,
      var(--chart-grid-line) calc(30% + var(--chart-line-width)),
      transparent calc(30% + var(--chart-line-width)),
      transparent 40%,
      var(--chart-grid-line) 40%,
      var(--chart-grid-line) calc(40% + var(--chart-line-width)),
      transparent calc(40% + var(--chart-line-width)),
      transparent 50%,
      var(--chart-grid-line) 50%,
      var(--chart-grid-line) calc(50% + var(--chart-line-width)),
      transparent calc(50% + var(--chart-line-width)),
      transparent 60%,
      var(--chart-grid-line) 60%,
      var(--chart-grid-line) calc(60% + var(--chart-line-width)),
      transparent calc(60% + var(--chart-line-width)),
      transparent 70%,
      var(--chart-grid-line) 70%,
      var(--chart-grid-line) calc(70% + var(--chart-line-width)),
      transparent calc(70% + var(--chart-line-width)),
      transparent 80%,
      var(--chart-grid-line) 80%,
      var(--chart-grid-line) calc(80% + var(--chart-line-width)),
      transparent calc(80% + var(--chart-line-width)),
      transparent 90%,
      var(--chart-grid-line) 90%,
      var(--chart-grid-line) calc(90% + var(--chart-line-width)),
      transparent calc(90% + var(--chart-line-width)),
      transparent calc(100% - var(--chart-line-width)),
      var(--chart-grid-line) calc(100% - var(--chart-line-width)),
      var(--chart-grid-line) 100%);
  content: "";
  pointer-events: none;
}

.safety-working-chart div,
.safety-working-plot div {
  grid-template-columns: var(--axis-label-width) minmax(0, 1fr);
  gap: var(--axis-gap);
}

.safety-working-chart .safety-working-plot {
  grid-template-columns: 1fr;
  align-items: stretch;
  gap: .95rem;
}

.safety-working-chart::before {
  display: none;
}

.safety-working-chart .chart-scale {
  height: 42px;
  align-items: start;
  align-self: start;
}

.safety-working-chart b {
  height: 2rem;
  background: transparent;
}

.safety-working-chart div:not(.chart-scale) > b::before {
  display: none;
}

.safety-working-chart .chart-scale b {
  position: relative;
  width: auto;
  justify-self: stretch;
  margin-right: var(--chart-edge-offset);
  height: auto;
  box-sizing: border-box;
  padding-top: .35rem;
  border-top: var(--chart-line-width) solid var(--chart-grid-line);
  background: transparent;
}

.safety-working-chart .present {
  position: absolute;
  left: 0;
  top: 0;
  z-index: 1;
  height: 1rem;
  background: #8d98a3;
}

.safety-working-chart .working {
  position: absolute;
  left: 0;
  top: 1rem;
  z-index: 1;
  height: 1rem;
  background: #28965a;
  color: transparent;
  font-size: .72rem;
  font-style: normal;
  font-weight: 900;
  text-align: right;
  padding-left: 0;
  padding-right: 0;
}

.safety-working-chart .working::after {
  content: attr(data-value);
  position: absolute;
  top: 50%;
  left: 100%;
  color: #28965a;
  font-size: .72rem;
  font-weight: 900;
  line-height: 1;
  white-space: nowrap;
  transform: translate(.3rem, -50%);
}

.safety-working-chart strong {
  position: absolute;
  top: .1rem;
  z-index: 3;
  color: #374151;
  font-size: .72rem;
  transform: translateX(.3rem);
}

.insight-stack {
  display: grid;
  gap: 1rem;
}

.insight-card {
  padding: 1.1rem 1.15rem;
  background: linear-gradient(180deg, #fff, #fffdf9);
}

.table-card {
  padding: 0;
  overflow: hidden;
}

.table-head {
  padding: 1rem 1.15rem;
  border-bottom: 1px solid #eee4d8;
  background: rgba(255, 252, 247, 0.95);
}

.table-title {
  margin: 0;
  font-size: .98rem;
  font-weight: 800;
  color: var(--fire-dark);
}

.table-sub {
  margin: .25rem 0 0;
  color: var(--ink);
  font-size: .86rem;
}

.table-wrap {
  padding: 0 1.15rem 1.15rem;
  max-width: 100%;
}

.table-wrap table {
  margin-bottom: 0;
}

.table-wrap th {
  font-size: .76rem;
  text-transform: uppercase;
  letter-spacing: .05em;
  color: #6b5c50;
  white-space: normal;
}

.table-wrap td {
  vertical-align: middle;
}

.delta-up {
  color: #0f5132;
  font-weight: 700;
}

.delta-down {
  color: #9a5a16;
  font-weight: 700;
}

@media (max-width: 991px) {
  .app-brand > div,
  .app-user-copy,
  .app-user-actions {
    display: none;
  }
  .app-user {
    width: auto;
    flex-wrap: nowrap;
  }
  .content-grid {
    grid-template-columns: 1fr;
    align-items: start;
  }
  .station-shell {
    grid-template-columns: auto minmax(0, 1fr);
  }
  .station-filter-dropdown {
    grid-column: 1 / -1;
  }
  .statistics-filter-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .statistics-kpi-strip {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .statistics-section-grid-two,
  .statistics-section-grid-three {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 767px) {
  .app-shell.statistics-shell {
    width: 100%;
    max-width: none;
    margin: 0;
    padding: 0;
  }
  .app-shell.statistics-shell .app-card {
    width: 100%;
    max-width: 100%;
    border-right: 0;
    border-left: 0;
    border-radius: 0;
  }
  .app-body {
    width: 100%;
    max-width: 100%;
    padding: 12px;
  }
  .station-shell {
    width: 100%;
    max-width: 100%;
    grid-template-columns: 1fr;
    padding: 1rem;
  }
  .station-filter-button {
    gap: .5rem;
    padding-right: 2.1rem;
  }
  .station-filter-caret {
    position: absolute;
    right: .75rem;
    top: 50%;
    transform: translateY(-50%);
  }
  .station-filter-menu {
    position: static !important;
    width: 100%;
    max-width: 100%;
    margin-top: .55rem;
    transform: none !important;
  }
  .station-filter-menu-actions,
  .station-filter-menu-actions .btn {
    width: 100%;
  }
  .station-hero-icon {
    width: 3.1rem;
    height: 3.1rem;
  }
  .report-head-inline {
    flex-wrap: wrap;
  }
  .statistics-kpi-strip,
  .statistics-filter-grid,
  .statistics-volume-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .dashboard-stack,
  .statistics-dashboard-section,
  .statistics-section-grid,
  .statistics-chart-card,
  .report-card,
  .insight-card,
  .bar-chart,
  .table-wrap {
    max-width: 100%;
    min-width: 0;
  }
  .bar-row {
    grid-template-columns: 1fr;
    gap: .4rem;
  }
  .pillar-chart {
    grid-template-columns: 1fr;
    min-height: 0;
    padding: .85rem;
  }
  .pillar-axis {
    display: none;
  }
  .pillar-plot {
    grid-template-columns: 1fr;
  }
  .pillar-bars {
    height: 180px;
  }
  .pillar-legend {
    grid-column: 1;
  }
  .bar-value {
    text-align: left;
  }
  .combo-country-chart,
  .statistics-heatmap {
    overflow-x: auto;
  }
  .combo-chart-frame {
    min-width: 760px;
  }
  .risk-bar-chart div,
  .spread-stack-chart div,
  .safety-working-chart div,
  .age-stack-chart div {
    grid-template-columns: 1fr;
  }
  .risk-bar-chart div:not(.chart-scale)::after {
    left: 0;
  }
  .risk-bar-plot::before {
    left: 0;
  }
  .age-stack-chart::before {
    left: 0;
  }
  .age-stack-plot::before {
    left: 0;
  }
  .spread-stack-plot::before {
    left: 0;
  }
  .age-stack-chart div {
    grid-template-columns: 1fr;
  }
  .age-stack-plot div {
    grid-template-columns: 1fr;
  }
  .risk-bar-plot div {
    grid-template-columns: 1fr;
  }
  .spread-stack-plot div {
    grid-template-columns: 1fr;
  }
  .safety-working-chart::before {
    left: 0;
  }
  .safety-working-plot::before {
    left: 0;
  }
  .safety-working-chart div {
    grid-template-columns: 1fr;
  }
  .safety-working-plot div {
    grid-template-columns: 1fr;
  }
  .chart-scale > span {
    display: none;
  }
  .risk-bar-chart span,
  .spread-stack-chart span,
  .safety-working-chart span,
  .age-stack-chart span {
    text-align: left;
  }
  .grouped-outcome-chart {
    grid-template-columns: 2.1rem minmax(320px, 1fr);
    overflow-x: auto;
  }
  .outcome-plot {
    grid-template-columns: repeat(2, minmax(150px, 1fr));
    gap: 1.5rem;
    justify-content: stretch;
  }
}

@media (max-width: 575px) {
  .statistics-kpi-strip,
  .statistics-filter-grid,
  .statistics-volume-grid {
    grid-template-columns: 1fr;
  }
  .report-card,
  .insight-card {
    padding: 1rem;
  }
  .table-card {
    padding: 0;
  }
  .grouped-outcome-chart {
    grid-template-columns: 2.1rem minmax(300px, 1fr);
  }
}

.statistics-shell .admin-context-link,
.statistics-shell .station-shell-title,
.statistics-shell .station-filter-summary-item small,
.statistics-shell .station-filter-summary-item strong,
.statistics-shell .station-filter-menu-actions .btn,
.statistics-shell .filter-label,
.statistics-shell .station-select-wrap .form-select,
.statistics-shell .statistics-filter-title,
.statistics-shell .statistics-filter-field label,
.statistics-shell .statistics-filter-field .form-select,
.statistics-shell .statistics-kpi-card b,
.statistics-shell .statistics-kpi-card strong,
.statistics-shell .statistics-section-title,
.statistics-shell .statistics-chart-head h2,
.statistics-shell .statistics-legend,
.statistics-shell .statistics-heatmap th,
.statistics-shell .statistics-heatmap td,
.statistics-shell .chart-scale b,
.statistics-shell .combo-axis,
.statistics-shell .risk-bar-chart span,
.statistics-shell .spread-stack-chart span,
.statistics-shell .safety-working-chart span,
.statistics-shell .age-stack-chart span,
.statistics-shell .risk-bar-chart b,
.statistics-shell .risk-bar-chart b::after,
.statistics-shell .outcome-axis,
.statistics-shell .outcome-group span,
.statistics-shell .outcome-group b em,
.statistics-shell .safety-working-chart .working,
.statistics-shell .safety-working-chart .working::after,
.statistics-shell .safety-working-chart strong,
.statistics-shell b,
.statistics-shell strong {
  font-weight: 400;
}
