/* ==========================================================================
   OSRI — Okanagan Student Research Initiative
   Design tokens and base styles. Single, deliberately light academic theme.
   ========================================================================== */

:root {
  --crimson: #A51C30;
  --crimson-dark: #7E1424;
  --ink: #1A1A1A;
  --ink-muted: #5F5F5A;
  --page: #F9F9F6;
  --panel: #FFFFFF;
  --rule: #D6D6D0;
  --rule-soft: #E8E8E3;
  --laurel: #2E6B3F;
  --amber: #9A6B0A;

  --font-display: "Playfair Display", Georgia, "Times New Roman", serif;
  --font-body: "Source Sans 3", "Source Sans Pro", "Helvetica Neue", Arial, sans-serif;

  --measure: 68ch;
  --max: 1180px;
  --gutter: clamp(16px, 4vw, 40px);
  --radius: 2px;
}

*, *::before, *::after { box-sizing: border-box; }

html { color-scheme: light; }

body {
  margin: 0;
  background: var(--page);
  color: var(--ink);
  font-family: var(--font-body);
  font-size: 17px;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}

img { max-width: 100%; height: auto; display: block; }

a { color: var(--crimson); text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 2px; }
a:hover { color: var(--crimson-dark); }
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible {
  outline: 2px solid var(--crimson);
  outline-offset: 2px;
}

h1, h2, h3, h4 {
  font-family: var(--font-display);
  font-weight: 600;
  line-height: 1.2;
  margin: 0;
  text-wrap: balance;
  color: var(--ink);
}
h1 { font-size: clamp(1.9rem, 3.2vw, 2.6rem); }
h2 { font-size: clamp(1.4rem, 2.2vw, 1.75rem); }
h3 { font-size: 1.2rem; }
h4 { font-size: 1.05rem; font-family: var(--font-body); font-weight: 600; }

p { margin: 0 0 1em; max-width: var(--measure); }
ul, ol { margin: 0 0 1em; padding-left: 1.4em; max-width: var(--measure); }
li { margin-bottom: 0.35em; }
strong { font-weight: 600; }
small { font-size: 0.875rem; }

hr { border: 0; border-top: 1px solid var(--rule); margin: 2rem 0; }

.wrap {
  max-width: var(--max);
  margin-inline: auto;
  padding-inline: var(--gutter);
}

.eyebrow {
  font-family: var(--font-body);
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--crimson);
  margin: 0 0 0.5rem;
}

.muted { color: var(--ink-muted); }

/* ---------- Utility band ---------- */
.utility {
  background: var(--crimson);
  color: #fff;
  font-size: 0.8rem;
  letter-spacing: 0.04em;
}
.utility .wrap {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 1rem;
  min-height: 34px;
  flex-wrap: wrap;
}
.utility a { color: #fff; text-decoration: none; }
.utility a:hover { text-decoration: underline; }
.utility nav { display: flex; gap: 1.25rem; }

/* ---------- Masthead ---------- */
.masthead {
  background: var(--panel);
  border-bottom: 1px solid var(--rule);
}
.masthead .wrap {
  display: flex;
  align-items: center;
  gap: 1.25rem;
  padding-block: 1.25rem;
}
.masthead .seal { width: 84px; flex: 0 0 auto; }
.masthead .wordmark { text-decoration: none; color: var(--ink); }
.masthead .wordmark .name {
  font-family: var(--font-display);
  font-size: clamp(1.25rem, 2.6vw, 1.85rem);
  font-weight: 600;
  line-height: 1.15;
  display: block;
}
.masthead .wordmark .place {
  display: block;
  font-size: 0.8rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ink-muted);
  margin-top: 0.3rem;
}

/* ---------- Primary navigation ---------- */
.primary-nav {
  background: var(--panel);
  border-bottom: 1px solid var(--rule);
}
.primary-nav ul {
  list-style: none;
  margin: 0;
  padding: 0;
  max-width: none;
  display: flex;
  flex-wrap: wrap;
}
.primary-nav li { margin: 0; }
.primary-nav a {
  display: block;
  padding: 0.85rem 1.1rem;
  font-size: 0.95rem;
  font-weight: 600;
  letter-spacing: 0.02em;
  color: var(--ink);
  text-decoration: none;
  border-bottom: 3px solid transparent;
  margin-bottom: -1px;
}
.primary-nav a:hover { color: var(--crimson); border-bottom-color: var(--rule); }
.primary-nav a[aria-current="page"] { color: var(--crimson); border-bottom-color: var(--crimson); }
.primary-nav li:first-child a { padding-left: 0; }

/* ---------- Page header block ---------- */
.page-head {
  padding-block: 2.5rem 1.5rem;
  border-bottom: 1px solid var(--rule);
  margin-bottom: 2.5rem;
}
.page-head p { font-size: 1.1rem; color: var(--ink-muted); margin-top: 0.75rem; margin-bottom: 0; }

/* ---------- Statement (home) ----------
   The photograph sits behind this section. A cream wash is laid over it,
   heaviest on the left where the words are and lightest on the right, so the
   picture stays visible without ever competing with the text.
   To use a different photograph, replace assets/hero.jpg (and hero-small.jpg
   for phones). To show more or less of it, change the numbers in --scrim. */
.statement {
  position: relative;
  isolation: isolate;
  padding-block: clamp(2.75rem, 5vw, 4.25rem);
  border-bottom: 1px solid var(--rule);
  background-color: var(--page);
  background-image: url("../assets/hero.jpg");
  background-size: cover;
  background-position: center 58%;
}
.statement::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: linear-gradient(100deg,
    rgba(249, 249, 246, 0.97) 0%,
    rgba(249, 249, 246, 0.96) 46%,
    rgba(249, 249, 246, 0.80) 62%,
    rgba(249, 249, 246, 0.46) 82%,
    rgba(249, 249, 246, 0.34) 100%);
}
.statement .lede { color: var(--ink); }
.statement h1 { max-width: 22ch; }
.statement .lede {
  font-size: 1.15rem;
  margin-top: 1rem;
  max-width: 62ch;
}
.statement .actions { display: flex; gap: 0.75rem; flex-wrap: wrap; margin-top: 1.5rem; }

/* ---------- Buttons ---------- */
.btn {
  display: inline-block;
  padding: 0.6rem 1.15rem;
  font-family: var(--font-body);
  font-size: 0.95rem;
  font-weight: 600;
  letter-spacing: 0.02em;
  text-decoration: none;
  border: 1px solid var(--crimson);
  border-radius: var(--radius);
  background: var(--crimson);
  color: #fff;
  cursor: pointer;
}
.btn:hover { background: var(--crimson-dark); border-color: var(--crimson-dark); color: #fff; }
.btn.secondary { background: transparent; color: var(--crimson); }
.btn.secondary:hover { background: #fff; }

/* ---------- Three-column layout ---------- */
.columns {
  display: grid;
  grid-template-columns: 240px minmax(0, 1fr) 280px;
  gap: 2.5rem;
  padding-block: 2.5rem 3.5rem;
}
.columns > * { min-width: 0; }
.two-col {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 300px;
  gap: 3rem;
  padding-bottom: 3.5rem;
}
.two-col > * { min-width: 0; }

.sidebar h3 {
  font-family: var(--font-body);
  font-size: 0.8rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--ink-muted);
  padding-bottom: 0.5rem;
  border-bottom: 1px solid var(--rule);
  margin-bottom: 0.75rem;
}
.sidebar section + section { margin-top: 2rem; }
.sidebar ul.links { list-style: none; padding: 0; margin: 0; }
.sidebar ul.links li { margin: 0; border-bottom: 1px solid var(--rule-soft); }
.sidebar ul.links a { display: block; padding: 0.45rem 0; text-decoration: none; color: var(--ink); }
.sidebar ul.links a:hover { color: var(--crimson); }
.sidebar p { font-size: 0.95rem; }

/* ---------- Section headings with rule ---------- */
.section-title {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 1rem;
  border-bottom: 2px solid var(--ink);
  padding-bottom: 0.4rem;
  margin-bottom: 1.25rem;
}
.section-title a { font-size: 0.9rem; font-weight: 600; text-decoration: none; }
.section-title a:hover { text-decoration: underline; }

/* ---------- Publication entries ---------- */
.entry-list { list-style: none; padding: 0; margin: 0 0 2.5rem; max-width: none; }
.entry {
  padding: 1.15rem 0;
  border-bottom: 1px solid var(--rule);
  margin: 0;
}
.entry:first-child { padding-top: 0; }
.entry h3 { font-size: 1.15rem; margin-bottom: 0.3rem; }
.entry h3 a { color: var(--ink); text-decoration: none; }
.entry h3 a:hover { color: var(--crimson); text-decoration: underline; }
.entry .byline { font-size: 0.9rem; color: var(--ink-muted); margin-bottom: 0.4rem; }
.entry .abstract { font-size: 0.97rem; margin-bottom: 0.5rem; }
.entry .meta { display: flex; flex-wrap: wrap; gap: 0.5rem; align-items: center; font-size: 0.82rem; }

.tag {
  display: inline-block;
  padding: 0.1rem 0.5rem;
  border: 1px solid var(--rule);
  border-radius: var(--radius);
  background: var(--panel);
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: var(--ink-muted);
}
.tag.paper { border-color: var(--crimson); color: var(--crimson); }

/* ---------- Notice / panel boxes ---------- */
.notice {
  background: var(--panel);
  border: 1px solid var(--rule);
  border-left: 3px solid var(--crimson);
  border-radius: var(--radius);
  padding: 1rem 1.15rem;
  font-size: 0.95rem;
}
.notice p:last-child { margin-bottom: 0; }
.notice h4 { margin-bottom: 0.35rem; }

.panel {
  background: var(--panel);
  border: 1px solid var(--rule);
  border-radius: var(--radius);
  padding: 1.25rem 1.4rem;
}
.panel + .panel { margin-top: 1.25rem; }

/* ---------- News list ---------- */
.news { list-style: none; padding: 0; margin: 0; }
.news li { padding: 0.75rem 0; border-bottom: 1px solid var(--rule-soft); margin: 0; }
.news time { display: block; font-size: 0.78rem; letter-spacing: 0.06em; text-transform: uppercase; color: var(--ink-muted); }
.news a { color: var(--ink); text-decoration: none; font-weight: 600; }
.news a:hover { color: var(--crimson); }
.news p { font-size: 0.9rem; margin: 0.2rem 0 0; }

/* ---------- Ethics decision tree ---------- */
.tiers { display: grid; gap: 1.25rem; margin: 1.5rem 0 2rem; }
.tier {
  background: var(--panel);
  border: 1px solid var(--rule);
  border-radius: var(--radius);
  border-top: 4px solid var(--rule);
  padding: 1.15rem 1.35rem;
}
.tier.green { border-top-color: var(--laurel); }
.tier.yellow { border-top-color: var(--amber); }
.tier.red { border-top-color: var(--crimson); }
.tier h3 { display: flex; align-items: center; gap: 0.6rem; margin-bottom: 0.25rem; }
.tier .light { width: 12px; height: 12px; border-radius: 50%; flex: 0 0 auto; }
.tier.green .light { background: var(--laurel); }
.tier.yellow .light { background: var(--amber); }
.tier.red .light { background: var(--crimson); }
.tier .verdict { font-size: 0.9rem; color: var(--ink-muted); margin-bottom: 0.75rem; }
.tier ul { margin-bottom: 0; }

/* ---------- Tables ---------- */
.table-wrap { overflow-x: auto; border: 1px solid var(--rule); border-radius: var(--radius); background: var(--panel); margin-bottom: 2rem; }
table { border-collapse: collapse; width: 100%; font-size: 0.95rem; }
th, td { text-align: left; vertical-align: top; padding: 0.75rem 0.9rem; border-bottom: 1px solid var(--rule-soft); }
th { font-size: 0.78rem; letter-spacing: 0.1em; text-transform: uppercase; color: var(--ink-muted); background: var(--page); border-bottom: 1px solid var(--rule); }
tr:last-child td { border-bottom: 0; }
td.num { font-variant-numeric: tabular-nums; white-space: nowrap; }

/* ---------- Research question bank ---------- */
.rq-group { margin-bottom: 2.75rem; }
.rq-group h2 { border-bottom: 2px solid var(--ink); padding-bottom: 0.4rem; margin-bottom: 1rem; }
.rq { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); gap: 1.5rem; padding: 1rem 0; border-bottom: 1px solid var(--rule); }
.rq > * { min-width: 0; }
.rq h3 { font-size: 1.08rem; margin-bottom: 0.4rem; }
.rq p { font-size: 0.95rem; margin-bottom: 0.4rem; }
.rq .dataset { font-size: 0.9rem; }
.rq .dataset dt { font-size: 0.72rem; letter-spacing: 0.1em; text-transform: uppercase; color: var(--ink-muted); margin-top: 0.5rem; }
.rq .dataset dt:first-child { margin-top: 0; }
.rq .dataset dd { margin: 0.1rem 0 0; }

/* ---------- Filter controls ---------- */
.filters { display: flex; flex-wrap: wrap; gap: 0.5rem; align-items: center; margin-bottom: 1.5rem; }
.filters span { font-size: 0.8rem; letter-spacing: 0.1em; text-transform: uppercase; color: var(--ink-muted); margin-right: 0.25rem; }
.filters button {
  font: inherit; font-size: 0.85rem; font-weight: 600;
  padding: 0.35rem 0.8rem;
  background: var(--panel);
  border: 1px solid var(--rule);
  border-radius: var(--radius);
  color: var(--ink);
  cursor: pointer;
}
.filters button:hover { border-color: var(--crimson); color: var(--crimson); }
.filters button[aria-pressed="true"] { background: var(--crimson); border-color: var(--crimson); color: #fff; }

/* ---------- Forms ---------- */
form.formal { max-width: 720px; }
.field { margin-bottom: 1.25rem; }
.field label { display: block; font-weight: 600; font-size: 0.95rem; margin-bottom: 0.3rem; }
.field .hint { font-size: 0.85rem; color: var(--ink-muted); margin: 0 0 0.4rem; }
.field input[type="text"], .field input[type="email"], .field input[type="url"], .field select, .field textarea {
  width: 100%;
  font: inherit;
  font-size: 1rem;
  padding: 0.55rem 0.7rem;
  border: 1px solid var(--rule);
  border-radius: var(--radius);
  background: var(--panel);
  color: var(--ink);
}
.field textarea { min-height: 120px; resize: vertical; }
.field-row { display: grid; grid-template-columns: 1fr 1fr; gap: 1.25rem; }
.field-row > * { min-width: 0; }
.choice { display: flex; gap: 0.6rem; align-items: flex-start; font-size: 0.95rem; margin-bottom: 0.5rem; }
.choice input { margin-top: 0.3rem; flex: 0 0 auto; }
fieldset { border: 1px solid var(--rule); border-radius: var(--radius); padding: 1rem 1.15rem; margin: 0 0 1.5rem; background: var(--panel); }
legend { font-weight: 600; padding: 0 0.4rem; }

/* ---------- Definition lists (guidelines) ---------- */
dl.spec { display: grid; grid-template-columns: max-content 1fr; gap: 0.35rem 1.5rem; max-width: var(--measure); margin: 0 0 1.5rem; }
dl.spec dt { font-weight: 600; }
dl.spec dd { margin: 0; }

/* ---------- Process steps (true sequence) ---------- */
ol.steps { list-style: none; padding: 0; counter-reset: step; max-width: var(--measure); }
ol.steps li { counter-increment: step; display: grid; grid-template-columns: 2.5rem 1fr; gap: 0.75rem; padding: 0.9rem 0; border-bottom: 1px solid var(--rule-soft); margin: 0; }
ol.steps li::before { content: counter(step); font-family: var(--font-display); font-size: 1.5rem; line-height: 1; color: var(--crimson); }
ol.steps h4 { margin-bottom: 0.2rem; }
ol.steps p { margin: 0; font-size: 0.95rem; }

/* ---------- Table of contents ---------- */
.toc { position: sticky; top: 1rem; }
.toc h3 { font-family: var(--font-body); font-size: 0.8rem; letter-spacing: 0.12em; text-transform: uppercase; color: var(--ink-muted); margin-bottom: 0.5rem; }
.toc ol { list-style: none; padding: 0; margin: 0; border-top: 1px solid var(--rule); }
.toc li { margin: 0; border-bottom: 1px solid var(--rule-soft); }
.toc a { display: block; padding: 0.45rem 0; font-size: 0.92rem; color: var(--ink); text-decoration: none; }
.toc a:hover { color: var(--crimson); }

/* ---------- Prose sections ---------- */
.prose section { margin-bottom: 2.75rem; scroll-margin-top: 1.5rem; }
.prose section h2 { border-bottom: 1px solid var(--rule); padding-bottom: 0.4rem; margin-bottom: 1rem; }
.prose h3 { margin: 1.5rem 0 0.5rem; }

/* ---------- People ---------- */
.people { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 1.25rem; margin-bottom: 2rem; }
.person { background: var(--panel); border: 1px solid var(--rule); border-radius: var(--radius); padding: 1rem 1.15rem; }
.person h4 { margin-bottom: 0.15rem; }
.person .role { font-size: 0.85rem; color: var(--crimson); font-weight: 600; letter-spacing: 0.04em; }
.person p { font-size: 0.9rem; margin: 0.5rem 0 0; }

/* ---------- Footer ---------- */
.site-footer {
  background: var(--panel);
  border-top: 3px solid var(--crimson);
  margin-top: 1rem;
  font-size: 0.9rem;
}
.site-footer .wrap { padding-block: 2.5rem 1.5rem; }
.footer-grid {
  display: grid;
  grid-template-columns: 1.4fr repeat(3, 1fr);
  gap: 2rem;
  padding-bottom: 2rem;
  border-bottom: 1px solid var(--rule);
}
.footer-grid > * { min-width: 0; }
.site-footer h3 {
  font-family: var(--font-body);
  font-size: 0.78rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--ink-muted);
  margin-bottom: 0.6rem;
}
.site-footer ul { list-style: none; padding: 0; margin: 0; }
.site-footer li { margin-bottom: 0.35rem; }
.site-footer a { color: var(--ink); text-decoration: none; }
.site-footer a:hover { color: var(--crimson); text-decoration: underline; }
.site-footer .brand .name { font-family: var(--font-display); font-size: 1.15rem; font-weight: 600; display: block; margin-bottom: 0.4rem; }
.site-footer .brand p { font-size: 0.88rem; color: var(--ink-muted); }
.footer-legal { padding-top: 1.25rem; font-size: 0.82rem; color: var(--ink-muted); display: flex; justify-content: space-between; gap: 1rem; flex-wrap: wrap; }
.footer-legal p { margin: 0; max-width: none; }

/* ---------- Responsive ---------- */
@media (max-width: 960px) {
  .columns { grid-template-columns: minmax(0, 1fr) 260px; }
  .columns .sidebar.left { grid-column: 1 / -1; order: 3; }
  .footer-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 720px) {
  .columns, .two-col { grid-template-columns: minmax(0, 1fr); gap: 2rem; }
  .rq { grid-template-columns: minmax(0, 1fr); gap: 0.5rem; }
  .field-row { grid-template-columns: 1fr; }
  .toc { position: static; margin-bottom: 1.5rem; }
  .masthead .seal { width: 64px; }
  .primary-nav a { padding: 0.7rem 0.8rem; font-size: 0.9rem; }
  dl.spec { grid-template-columns: 1fr; gap: 0.1rem 0; }
  dl.spec dd { margin-bottom: 0.6rem; }
}
@media (max-width: 480px) {
  .footer-grid { grid-template-columns: 1fr; }
  .utility nav { gap: 0.9rem; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { transition: none !important; animation: none !important; }
}

@media print {
  .utility, .primary-nav, .site-footer nav, .filters { display: none; }
  body { background: #fff; }
}

/* ---------- Forms: spam honeypot (hidden from people, visible to bots) ---------- */
.honeypot { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

/* ---------- Suggest-a-question section ---------- */
.suggest {
  border-top: 1px solid var(--rule);
  margin-top: 1rem;
  padding-top: 2.5rem;
  padding-bottom: 3.5rem;
}
.suggest .section-title { border-bottom-width: 2px; }
.suggest form { margin-top: 1.5rem; }

/* ---------- Editorial note on a publication entry ---------- */
.entry-note {
  font-size: 0.88rem;
  font-style: italic;
  color: var(--ink-muted);
  border-left: 2px solid var(--rule);
  padding-left: 0.75rem;
  margin-bottom: 0.5rem;
}

/* ---------- Privacy line under a form's submit button ---------- */
.form-privacy {
  font-size: 0.85rem;
  color: var(--ink-muted);
  margin-bottom: 0.9rem;
  max-width: 52ch;
}

/* ==========================================================================
   Ornament and image system
   Ornaments in assets/ornaments/ are generated by make_ornaments.py — drawn
   from scratch, so no copyright or attribution applies to them.
   ========================================================================== */

/* Thin engine-turned strip under the navigation: an institutional edge. */
.guilloche-rule {
  height: 9px;
  background: url("../assets/ornaments/guilloche.svg") repeat-x center / auto 100%;
  opacity: 0.3;
  border-bottom: 1px solid var(--rule);
}


/* Centred laurel fleuron between major blocks. */
.fleuron {
  display: block;
  width: 340px;
  max-width: 76%;
  height: auto;
  margin: 2.25rem auto 0.25rem;
}

/* Rosette watermark on the short confirmation pages. */
.rosette-mark {
  display: block;
  width: 150px;
  height: auto;
  margin: 0 0 1.5rem;
  opacity: 0.5;
}

/* Figure attached to a publication entry or page section. */
figure.plate {
  margin: 0 0 1.5rem;
  border: 1px solid var(--rule);
  border-radius: var(--radius);
  background: var(--panel);
  overflow: hidden;
}
figure.plate img { display: block; width: 100%; height: auto; }
figure.plate figcaption {
  font-size: 0.85rem;
  color: var(--ink-muted);
  padding: 0.6rem 0.9rem;
  border-top: 1px solid var(--rule-soft);
}
figure.plate figcaption .credit { display: block; margin-top: 0.2rem; font-size: 0.78rem; }

/* Entry thumbnail: a small plate beside a publication in the list. */
.entry.has-figure { display: grid; grid-template-columns: 132px minmax(0, 1fr); gap: 1.1rem; }
.entry.has-figure > * { min-width: 0; }
.entry-thumb {
  margin: 0;
  border: 1px solid var(--rule);
  border-radius: var(--radius);
  overflow: hidden;
  background: var(--panel);
}
.entry-thumb img { display: block; width: 100%; height: 96px; object-fit: cover; }

@media (max-width: 560px) {
  .entry.has-figure { grid-template-columns: minmax(0, 1fr); }
  .entry-thumb img { height: 140px; }
}

/* Phones: a lighter file, and the wash runs top-to-bottom so the words sit on
   cream and the photograph shows beneath them. */
@media (max-width: 720px) {
  .statement {
    background-image: url("../assets/hero-small.jpg");
    background-position: center 70%;
  }
  .statement::before {
    background: linear-gradient(to bottom,
      rgba(249, 249, 246, 0.97) 0%,
      rgba(249, 249, 246, 0.96) 62%,
      rgba(249, 249, 246, 0.74) 84%,
      rgba(249, 249, 246, 0.52) 100%);
  }
}

@media print {
  .statement { background-image: none; }
  .statement::before { display: none; }
}

/* An empty section reads as a venue that has just opened, not one that died. */
.empty-state { margin-bottom: 2.5rem; }
.empty-state p { font-size: 0.97rem; }
.empty-state p:last-child { margin-bottom: 0; }