/* ----------------------------------------------------------------------------
   Tier lists — any table that presents a ranking by tier (S/A/B/C…) gets the
   tier badge treatment at render time (functions.php: almanac_tier_table).
   The colour ramp is the conventional tier-list ramp, expressed in the
   theme's own surfaces so it sits quietly inside an article.
   ---------------------------------------------------------------------------- */
:root {
  --almanac-tier-s: #C2410C;
  --almanac-tier-a: #B45309;
  --almanac-tier-b: #A16207;
  --almanac-tier-c: #3F6212;
  --almanac-tier-d: #1D4ED8;
  --almanac-tier-e: #4B5563;
  --almanac-tier-f: #6B7280;
  --almanac-tier-ink: #FFFFFF;
  --almanac-tier-row-alpha: 0.10;
  --almanac-tier-row-base: var(--almanac-bg-paper, #FBF8EF);
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --almanac-tier-s: #F97316; --almanac-tier-a: #F59E0B; --almanac-tier-b: #EAB308;
    --almanac-tier-c: #84CC16; --almanac-tier-d: #60A5FA; --almanac-tier-e: #9CA3AF; --almanac-tier-f: #9CA3AF;
    --almanac-tier-ink: #1A1410; --almanac-tier-row-alpha: 0.16; --almanac-tier-row-base: var(--almanac-bg-paper, #1A1410);
  }
}
:root[data-theme="dark"] {
  --almanac-tier-s: #F97316; --almanac-tier-a: #F59E0B; --almanac-tier-b: #EAB308;
  --almanac-tier-c: #84CC16; --almanac-tier-d: #60A5FA; --almanac-tier-e: #9CA3AF; --almanac-tier-f: #9CA3AF;
  --almanac-tier-ink: #1A1410; --almanac-tier-row-alpha: 0.16; --almanac-tier-row-base: var(--almanac-bg-paper, #1A1410);
}

.almanac-post__content .almanac-tierlist table { border-collapse: separate; border-spacing: 0; }
.almanac-post__content .almanac-tierlist th:first-child,
.almanac-post__content .almanac-tierlist td:first-child { width: 4.5rem; text-align: center; vertical-align: middle; }

.almanac-tier__badge {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 2.4rem; height: 2.4rem; padding: 0 .55rem;
  border-radius: .5rem;
  font-weight: 800; font-size: 1.05rem; letter-spacing: .02em; line-height: 1;
  color: var(--almanac-tier-ink);
  background: var(--almanac-tier-e);
}
.almanac-tier--s .almanac-tier__badge { background: var(--almanac-tier-s); }
.almanac-tier--a .almanac-tier__badge { background: var(--almanac-tier-a); }
.almanac-tier--b .almanac-tier__badge { background: var(--almanac-tier-b); }
.almanac-tier--c .almanac-tier__badge { background: var(--almanac-tier-c); }
.almanac-tier--d .almanac-tier__badge { background: var(--almanac-tier-d); }
.almanac-tier--e .almanac-tier__badge { background: var(--almanac-tier-e); }
.almanac-tier--f .almanac-tier__badge { background: var(--almanac-tier-f); }

/* a faint wash of the tier colour across its row, mixed into the row's own paper (never transparent:
   the table wrapper behind it is dark, and a transparent wash turned S rows black on 2026-09-22) */
.almanac-post__content .almanac-tierlist tr.almanac-tier--s > td { background: color-mix(in srgb, var(--almanac-tier-s) calc(var(--almanac-tier-row-alpha) * 100%), var(--almanac-tier-row-base)); }
.almanac-post__content .almanac-tierlist tr.almanac-tier--a > td { background: color-mix(in srgb, var(--almanac-tier-a) calc(var(--almanac-tier-row-alpha) * 100%), var(--almanac-tier-row-base)); }
.almanac-post__content .almanac-tierlist tr.almanac-tier--b > td { background: color-mix(in srgb, var(--almanac-tier-b) calc(var(--almanac-tier-row-alpha) * 100%), var(--almanac-tier-row-base)); }
.almanac-post__content .almanac-tierlist tr.almanac-tier--c > td { background: color-mix(in srgb, var(--almanac-tier-c) calc(var(--almanac-tier-row-alpha) * 100%), var(--almanac-tier-row-base)); }
.almanac-post__content .almanac-tierlist tr.almanac-tier--d > td { background: color-mix(in srgb, var(--almanac-tier-d) calc(var(--almanac-tier-row-alpha) * 100%), var(--almanac-tier-row-base)); }

/* per-item tables (Unit | Tier | Notes): only the tier cell carries the badge */
.almanac-post__content .almanac-tierlist--items td.almanac-tier__cell { text-align: center; vertical-align: middle; width: 4.5rem; }

@media (max-width: 640px) {
  .almanac-tier__badge { min-width: 2rem; height: 2rem; font-size: .95rem; }
  .almanac-post__content .almanac-tierlist th:first-child,
  .almanac-post__content .almanac-tierlist td:first-child { width: 3.4rem; }
}
