.yg-disaster-stats-bar {
  width: 100%;
  margin: 0;
  padding: 12px 20px;
  box-sizing: border-box;
  background: linear-gradient(90deg, #1a0a0a 0%, #3d0a0a 35%, #1a1020 70%, #0a0a1a 100%);
  border-bottom: 3px solid #ffe566;
  color: #f5f5f5;
  font-family: system-ui, -apple-system, sans-serif;
}

.yg-disaster-stats-inner {
  max-width: 1600px;
  margin: 0 auto;
}

.yg-disaster-stats-head {
  margin: 0 0 10px;
  font: 700 clamp(14px, 2vw, 18px) / 1.2 didot-w01-italic, georgia, serif;
  color: #ffe566;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}


.yg-disaster-stats-head {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 10px 14px;
}

.yg-disaster-stats-daymark {
  display: inline-flex;
  align-items: baseline;
  gap: 6px;
  flex-wrap: wrap;
}

.yg-disaster-stats-daynum {
  display: inline-block;
  padding: 4px 12px;
  border-radius: 6px;
  background: #2f5f9e;
  color: #ffe566;
  font: 800 clamp(18px, 3.2vw, 28px) / 1.1 Georgia, "Times New Roman", serif;
  letter-spacing: 0.06em;
  box-shadow: 0 0 0 1px rgba(255, 229, 102, 0.35);
}

.yg-disaster-stats-dayof {
  color: #ffe566;
  font: 700 clamp(16px, 2.4vw, 22px) / 1.1 Georgia, "Times New Roman", serif;
  letter-spacing: 0.04em;
}

.yg-disaster-stats-title {
  color: #ffe566;
  font: 700 clamp(14px, 2vw, 18px) / 1.2 Georgia, "Times New Roman", serif;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  opacity: 0.95;
}

.yg-disaster-stats-dayline {
  margin: -2px 0 4px;
  font: 500 13px/1.4 system-ui, -apple-system, sans-serif;
  color: #d7d7d7;
}

.yg-disaster-stats-dayline strong {
  color: #ffe566;
  font-weight: 800;
}

.yg-disaster-stats-skyline {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 6px 10px;
  margin: 0 0 10px;
  font: 500 12px/1.45 system-ui, -apple-system, sans-serif;
  color: #c9d4e3;
}

.yg-disaster-stats-skyline strong {
  color: #9ec1ff;
  font-weight: 700;
}

.yg-disaster-stats-moonmonth {
  color: #ffe566;
  font-weight: 700;
}

.yg-disaster-stats-skysep {
  color: #6b7280;
}

.yg-disaster-stats-progress {
  height: 6px;
  margin: 0 0 14px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.12);
  overflow: hidden;
}

.yg-disaster-stats-progress i {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #ffe566, #ff9f43, #e74c3c);
}

.yg-disaster-stats-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 14px;
  margin: 0 0 10px;
}

.yg-disaster-stats-metric {
  flex: 1 1 100px;
  min-width: 88px;
  padding: 8px 12px;
  border-radius: 8px;
  background: rgba(0, 0, 0, 0.35);
  border: 1px solid rgba(255, 255, 255, 0.12);
  text-align: center;
}

.yg-disaster-stats-num {
  display: block;
  font: 700 clamp(18px, 3vw, 28px) / 1.1 system-ui, sans-serif;
  color: #fff;
}

.yg-disaster-stats-lbl {
  display: block;
  margin-top: 4px;
  font: 600 11px/1.2 system-ui, sans-serif;
  color: #bbb;
  text-transform: uppercase;
  letter-spacing: 0.03em;
}

.yg-disaster-stats-deaths .yg-disaster-stats-num {
  color: #ff6b6b;
}

.yg-disaster-stats-missing .yg-disaster-stats-num {
  color: #ffb347;
}

.yg-disaster-stats-archive-cas .yg-disaster-stats-num {
  color: #ff9999;
}

.yg-disaster-stats-archive-miss .yg-disaster-stats-num {
  color: #ffcc80;
}

.yg-disaster-stats-archive {
  margin: 0 0 8px;
  font: 600 clamp(13px, 1.8vw, 16px) / 1.4 system-ui, sans-serif;
  color: #fff;
}

.yg-disaster-stats-archive strong {
  color: #ff6b6b;
  font-size: 1.15em;
}

.yg-disaster-stats-types {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 10px;
  margin: 0 0 10px;
}

.yg-disaster-stats-pill {
  display: inline-block;
  padding: 3px 10px;
  border-radius: 999px;
  background: rgba(255, 229, 102, 0.12);
  border: 1px solid rgba(255, 229, 102, 0.35);
  color: #ffe566;
  font-size: 12px;
  font-weight: 600;
}

.yg-disaster-stats-research {
  margin: 0;
  font: 13px/1.45 system-ui, sans-serif;
  color: #ccc;
  border-top: 1px solid rgba(255, 255, 255, 0.12);
  padding-top: 8px;
}

.yg-disaster-stats-research em {
  color: #8cf;
  font-style: normal;
}

.yg-disaster-stats-loading {
  color: #aaa;
  font-size: 14px;
  text-align: center;
  padding: 8px;
}

@media (max-width: 640px) {
  .yg-disaster-stats-bar {
    padding: 10px 12px;
  }
}


.yg-year-preview-banner {
  margin: 0 0 12px;
  padding: 8px 12px;
  border-radius: 8px;
  border: 1px dashed #ffe566;
  background: rgba(47, 95, 158, 0.35);
  color: #ffe566;
  font: 700 13px/1.35 system-ui, sans-serif;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.yg-year-book {
  margin: 0 0 18px;
  padding: 0 0 16px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.yg-year-book.is-sealed {
  opacity: 0.92;
}

.yg-year-book.is-sealed .yg-disaster-stats-daynum {
  background: #3a3a3a;
  color: #ddd;
  box-shadow: none;
}

.yg-year-book.is-sealed .yg-disaster-stats-dayof,
.yg-year-book.is-sealed .yg-disaster-stats-sealed {
  color: #cfcfcf;
}

.yg-disaster-stats-sealed {
  font: 700 12px/1.2 system-ui, sans-serif;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  padding: 4px 10px;
  border-radius: 999px;
  border: 1px solid rgba(255, 255, 255, 0.25);
}

.yg-year-history-title {
  margin: 8px 0 12px;
  color: #ffe566;
  font: 700 14px/1.2 Georgia, serif;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.yg-year-history-empty {
  margin: 8px 0 0;
  color: #aaa;
  font: 500 12px/1.4 system-ui, sans-serif;
}

.yg-year-book.is-preview {
  outline: 1px dashed rgba(255, 229, 102, 0.35);
  outline-offset: 6px;
  border-radius: 8px;
}