/* The Satyr — Satirical News Publication */

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

:root {
  --black: #111;
  --red:   #c00;
  --mid:   #555;
  --light: #e8e8e8;
  --bg:    #f9f8f5;
  --serif: serif;
  --sans:  'Helvetica Neue', Helvetica, Arial, sans-serif;
  /* Brand wordmark font. MUST be an explicit Latin serif stack, never the bare
     generic `serif`: on a page whose lang is zh/ja/ko/ar/hi, the browser would
     otherwise render the Latin "SATYR SATIRE" with that script's serif, so the
     masthead font would change from language to language. Pinning Georgia first
     keeps the wordmark identical across every edition. */
  --brand-serif: Georgia, 'Times New Roman', Times, serif;
}

body {
  font-family: var(--serif);
  background: var(--bg);
  color: var(--black);
  font-size: 17px;
  line-height: 1.6;
  margin: 0;
  padding: 0;
}

a { color: inherit; text-decoration: none; }
a:hover { text-decoration: underline; }

/* ── Masthead ── */
.masthead {
  border-top: 3px solid var(--black);
  border-bottom: 1px solid var(--black);
  max-width: 850px;
  padding: 0 25px 2px 25px;
  margin-bottom: 0;
  display: flex;
  align-items: stretch;
  gap: 160px;
}

.masthead-left {
  display: flex;
  flex-direction: column;
}

.masthead-link {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  text-decoration: none;
}
.masthead-link:hover { text-decoration: none; }

.masthead-right {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  margin-left: auto;
  flex-shrink: 0;
  gap: 8px;
}

.masthead-right-inner {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 4px;
  margin-top: auto;
  padding-top: 10px;
}

.masthead-logo {
  height: 100px;
  width: 100px;
  object-fit: contain;
  display: block;
  flex-shrink: 0;
}

.pub-name-text {
  display: block;
  text-align: center;
}

.pub-name-top {
  display: block;
  font-family: var(--brand-serif);
  font-size: 4.8rem;
  font-weight: 700;
  letter-spacing: -2px;
  line-height: 1;
  text-transform: uppercase;
}

.pub-name-bottom {
  display: block;
  font-family: var(--brand-serif);
  font-size: 1.8rem;
  font-weight: 700;
  letter-spacing: 0.3em;
  line-height: 1;
  margin-top: 2px;
  text-transform: uppercase;
}

.masthead .tagline {
  font-family: var(--sans);
  font-size: 0.72rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--mid);
  padding-top: 4px;
  padding-left: 40px;
  text-align: left;
}

/* ── Nav ── */
nav {
  border-bottom: 1px solid var(--black);
  background: var(--black);
  color: white;
}

nav ul {
  display: flex;
  flex-wrap: wrap;
  list-style: none;
  max-width: 850px;
  margin: 0;
  padding: 0 10px;
}

nav li a {
  display: block;
  padding: 0 10px;
  font-family: var(--sans);
  font-size: 0.85rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: white;
}

nav li a:hover { background: var(--red); text-decoration: none; }
nav li a.active { background: var(--red); }

/* ── Layout ── */
.container {
  max-width: 850px;
  margin: 0;
  padding: 0 25px;
}

/* ── Section label ── */
.section-label {
  font-family: var(--sans);
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--red);
  margin-bottom: 6px;
}

/* ── Index: article grid ── */
.index-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0;
  margin: 30px 0;
}

.index-grid .featured {
  grid-column: 1 / -1;
  border-bottom: 1px solid var(--light);
  padding-bottom: 28px;
  margin-bottom: 28px;
}

.index-grid .article-card {
  padding: 0 24px 28px 0;
  border-right: 1px solid var(--light);
  margin-right: 24px;
}

.index-grid .article-card:last-child {
  border-right: none;
  margin-right: 0;
  padding-right: 0;
}

.card-img {
  width: 100%;
  height: 220px;
  object-fit: cover;
  object-position: center top;
  display: block;
  margin-bottom: 14px;
}

.card-headline {
  font-size: 1.35rem;
  font-weight: 700;
  line-height: 1.25;
  margin-bottom: 8px;
}

.card-headline a:hover { text-decoration: underline; }

.card-standfirst {
  font-size: 0.92rem;
  color: var(--mid);
  line-height: 1.5;
  margin-bottom: 10px;
}

.card-byline {
  font-family: var(--sans);
  font-size: 0.7rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--mid);
}

/* ── Featured card ── */
.featured .card-headline { font-size: 2rem; }
.featured .card-img { height: 360px; }

/* ── Article page ── */
.article-header {
  padding: 8px 0 2px;
  margin-bottom: 2px;
}

.article-header .section-label { margin-bottom: 10px; }

.article-headline {
  font-size: 2.6rem;
  font-weight: 700;
  line-height: 1.05;
  margin-bottom: 4px;
  letter-spacing: -0.5px;
}
/* Devanagari (Hindi) carries tall top matras / shirorekha that rise into the
   language-switcher flag row above the headline. Nudge the headline down a few
   px so the diacritics clear the flags. Scoped to Hindi so other scripts are
   unaffected. */
html[lang="hi"] .article-headline { margin-top: 6px; }

.article-standfirst {
  font-size: 1.15rem;
  color: var(--mid);
  line-height: 1.2;
  font-style: italic;
  margin-bottom: 4px;
}

.article-meta {
  font-family: var(--sans);
  font-size: 0.72rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--mid);
  border-top: 1px solid var(--light);
  padding-top: 12px;
}

/* ── Article body ── */
.article-body {
  display: grid;
  grid-template-columns: 1fr 280px;
  gap: 40px;
  padding: 4px 0 60px;
}

.article-body.no-sidebar {
  grid-template-columns: 1fr;
}

.article-text p { margin-bottom: 16px; }

.article-text h2 {
  font-size: 1.2rem;
  font-weight: 700;
  font-family: var(--sans);
  letter-spacing: 0.04em;
  text-transform: uppercase;
  margin: 28px 0 4px;
  clear: both;
  text-align: left;
}

.article-text figure {
  margin: 2px 0;
  position: relative;
  overflow: hidden;
}

.figure-brand {
  position: absolute;
  bottom: 8px;
  right: 8px;
  width: 36px;
  height: 36px;
  opacity: 0.82;
  filter: drop-shadow(0 1px 3px rgba(0,0,0,0.7));
  pointer-events: none;
  z-index: 10;
}

.article-text figure:first-child {
  margin-top: 0;
}

.article-text figure img:not(.figure-brand) {
  width: 400px;
  max-width: 100%;
  display: block;
}

.article-text figure figcaption {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  background: rgba(0, 0, 0, 0.62);
  color: #fff;
  font-family: Impact, 'Arial Narrow', var(--sans);
  font-size: 1rem;
  font-weight: 900;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  text-shadow: 1px 1px 0 #000, -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000;
  padding: 10px 14px;
  text-align: center;
  line-height: 1.3;
}

.article-text .dateline {
  font-family: var(--sans);
  font-weight: 700;
  font-size: 0.88rem;
  text-transform: uppercase;
}

.article-text .closing-note {
  font-style: italic;
  color: var(--mid);
  font-size: 0.9rem;
  border-top: 1px solid var(--light);
  padding-top: 16px;
  margin-top: 32px;
}

/* ── Pull quote ── */
.pull-quote {
  border-top: 3px solid var(--black);
  border-bottom: 1px solid var(--light);
  padding: 18px 0;
  margin: 28px 0;
}

.pull-quote p {
  font-size: 1.25rem;
  line-height: 1.4;
  font-style: italic;
  margin: 0;
}

/* ── Sidebar ── */
.article-sidebar {
  padding-top: 4px;
}

.sidebar-block {
  border-top: 3px solid var(--black);
  padding: 16px 0 24px;
  margin-bottom: 24px;
}

.sidebar-block h3 {
  font-family: var(--sans);
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--red);
  margin-bottom: 12px;
}

.sidebar-block .sidebar-headline {
  font-size: 0.98rem;
  font-weight: 700;
  line-height: 1.3;
  margin-bottom: 6px;
  margin-top: 10px;
}

.sidebar-block .sidebar-blurb {
  font-size: 0.82rem;
  color: var(--mid);
  line-height: 1.45;
}

/* ── Tags ── */
.related-articles {
  margin: 28px 0;
  padding-top: 20px;
  border-top: 1px solid var(--light);
  clear: both;
  width: 100%;
  box-sizing: border-box;
}
.related-articles h3 {
  font-family: var(--sans);
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--red);
  margin: 0 0 14px;
}
.related-articles ul {
  list-style: none;
  padding: 0;
  margin: 0;
}
.related-articles li {
  font-family: var(--serif);
  font-size: 0.95rem;
  line-height: 1.55;
  margin-bottom: 10px;
  color: var(--mid);
}
.related-articles li a {
  color: var(--black);
  font-weight: 700;
  text-decoration: none;
  border-bottom: 1px solid var(--light);
}
.related-articles li a:hover {
  border-bottom-color: var(--black);
}

.tags {
  margin-top: 32px;
  padding-top: 16px;
  border-top: 1px solid var(--light);
  font-family: var(--sans);
  font-size: 0.72rem;
  letter-spacing: 0.06em;
}

.tags span { color: var(--mid); text-transform: uppercase; margin-right: 4px; }
.tags a {
  display: inline-block;
  background: var(--light);
  padding: 3px 8px;
  margin: 3px 3px 3px 0;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}
.tags a:hover { background: var(--black); color: white; text-decoration: none; }

/* ── Advertisement blocks ── */
.ad-block {
  border: 2px solid var(--black);
  padding: 18px 16px;
  margin-bottom: 24px;
  text-align: center;
  background: white;
}

.ad-block .sponsor-label {
  font-family: var(--sans);
  font-size: 0.58rem;
  font-weight: 700;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--mid);
  border-bottom: 1px solid var(--light);
  padding-bottom: 8px;
  margin-bottom: 12px;
}

.ad-block .sponsor-name {
  font-family: var(--serif);
  font-size: 1.4rem;
  font-weight: 700;
  letter-spacing: -0.5px;
  line-height: 1.1;
  margin-bottom: 8px;
}

.ad-block .sponsor-tag {
  font-family: var(--serif);
  font-style: italic;
  font-size: 0.82rem;
  color: var(--mid);
  line-height: 1.4;
  margin-bottom: 10px;
}

.ad-block .ad-body {
  font-family: var(--sans);
  font-size: 0.72rem;
  color: var(--black);
  line-height: 1.45;
  margin-bottom: 10px;
}

.ad-block .ad-cta {
  display: inline-block;
  font-family: var(--sans);
  font-size: 0.65rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  border: 1px solid var(--black);
  padding: 4px 12px;
}

.ad-block.ad-ink { border-color: #1a1a4e; }
.ad-block.ad-ink .sponsor-name { color: #1a1a4e; }
.ad-block.ad-ink .ad-cta { border-color: #1a1a4e; color: #1a1a4e; }

.sponsor-strip {
  border-top: 1px solid var(--light);
  border-bottom: 1px solid var(--light);
  padding: 0 20px;
  margin: 4px 0 0;
  clear: both;
  width: 100%;
  box-sizing: border-box;
  display: flex;
  align-items: center;
  gap: 8px;
  background: var(--bg);
  text-decoration: none;
  color: inherit;
  line-height: 1.2;
  white-space: nowrap;
  overflow: hidden;
}
.sponsor-strip:hover { background: #fafafa; text-decoration: none; }

.sponsor-strip .sponsor-label {
  font-family: var(--sans);
  font-size: 0.52rem;
  font-weight: 700;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: var(--mid);
  flex-shrink: 0;
}

.sponsor-strip .sponsor-body {
  flex: 1;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.sponsor-strip .sponsor-name {
  font-family: var(--serif);
  font-size: 0.88rem;
  font-weight: 700;
}

.sponsor-strip .sponsor-tag {
  font-family: var(--serif);
  font-style: italic;
  font-size: 0.76rem;
  color: var(--mid);
  margin-left: 6px;
}

/* ── Beat page cards (two-column, alternating image/text) ── */
.beat-list {
  margin: 16px 0 30px;
}

.beat-card {
  display: flex;
  gap: 20px;
  align-items: flex-start;
  margin-bottom: 24px;
  padding-bottom: 24px;
  border-bottom: 1px solid var(--light);
}
.beat-card:last-child { border-bottom: none; }

.beat-card > a {
  width: 50%;
  flex-shrink: 0;
  display: block;
}

.beat-card-img {
  width: 100%;
  height: 240px;
  object-fit: cover;
}

.beat-card-body {
  flex: 1;
}

/* Alternate rows: even cards flip image to right */
.beat-card:nth-child(even) {
  flex-direction: row-reverse;
}

/* ── Topic landing page (section filter view) ── */
#topic-list {
  margin: 30px 0;
}

.topic-row {
  display: flex;
  gap: 36px;
  padding: 32px 0;
  border-bottom: 1px solid var(--light);
  align-items: flex-start;
}

.topic-row:first-child {
  border-top: 1px solid var(--light);
}

/* Even-indexed rows: reverse — text left, image right */
.topic-row.reverse {
  flex-direction: row-reverse;
}

.topic-row-img {
  flex: 0 0 380px;
}

.topic-row-img img {
  width: 100%;
  height: 260px;
  object-fit: cover;
  object-position: center top;
  display: block;
}

.topic-row-img--empty {
  background: var(--light);
  height: 260px;
}

.topic-row-text {
  flex: 1;
  padding-top: 4px;
}

.topic-headline {
  font-size: 1.75rem;
  font-weight: 700;
  line-height: 1.2;
  margin-bottom: 14px;
}

.topic-headline a:hover {
  text-decoration: underline;
}

.topic-row-text .card-standfirst {
  font-size: 1rem;
  line-height: 1.6;
  margin-bottom: 14px;
}

.topic-row-text .card-byline {
  margin-top: 8px;
}

@media (max-width: 680px) {
  .topic-row,
  .topic-row.reverse {
    flex-direction: column;
  }
  .topic-row-img {
    flex: none;
    width: 100%;
  }
  .topic-headline { font-size: 1.4rem; }
}

/* ── Footer ── */
footer {
  border-top: 3px solid var(--black);
  padding: 20px;
  text-align: center;
  font-family: var(--sans);
  font-size: 0.72rem;
  color: var(--mid);
  letter-spacing: 0.06em;
}

@media (max-width: 680px) {
  .masthead .pub-name { font-size: 2rem; }
  .index-grid { grid-template-columns: 1fr; }
  .index-grid .featured { grid-column: 1; }
  .article-body { grid-template-columns: 1fr; }
  .article-headline { font-size: 1.8rem; }
  .article-sidebar { display: none; }
}

/* ── Article components ───────────────────────────────────────── */

.meme-block {
  background: #f4f4f4;
  border: 1px solid #ddd;
  border-radius: 4px;
  padding: 0;
  margin: 32px auto;
  max-width: 540px;
  overflow: hidden;
}
.meme-block img { width: 100%; display: block; }
.meme-block .meme-caption {
  font-family: var(--sans);
  font-size: 0.78rem;
  color: var(--mid);
  padding: 10px 14px;
  border-top: 1px solid #ddd;
  text-align: center;
}

.ad-unit {
  border: 2px solid var(--black);
  padding: 20px 24px;
  margin: 36px 0;
  text-align: center;
  background: #fff;
}
.ad-unit .sponsor-label {
  font-family: var(--sans);
  font-size: 0.65rem;
  font-weight: 700;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: var(--mid);
  margin-bottom: 10px;
}
.ad-unit .ad-brand {
  font-family: var(--serif);
  font-size: 1.6rem;
  font-weight: 900;
  letter-spacing: -0.5px;
  margin-bottom: 6px;
}
.ad-unit .ad-copy {
  font-family: var(--sans);
  font-size: 0.88rem;
  color: var(--mid);
  line-height: 1.5;
  margin-bottom: 12px;
}
.ad-unit .ad-cta {
  display: inline-block;
  background: var(--black);
  color: #fff;
  font-family: var(--sans);
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  padding: 9px 22px;
  text-decoration: none;
}
.ad-unit .ad-disclaimer {
  font-family: var(--sans);
  font-size: 0.65rem;
  color: #aaa;
  margin-top: 10px;
}

.man-on-street {
  border-left: 4px solid var(--black);
  padding: 18px 24px;
  margin: 32px 0;
  background: #f9f9f9;
  clear: both;
  width: 100%;
  box-sizing: border-box;
}
.man-on-street .mot-label {
  font-family: var(--sans);
  font-size: 0.65rem;
  font-weight: 700;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: var(--mid);
  margin-bottom: 10px;
}
.man-on-street .mot-quote {
  font-family: var(--serif);
  font-size: 1.5rem;
  font-weight: 700;
  line-height: 1.3;
  margin-bottom: 8px;
}
.man-on-street .mot-attribution {
  font-family: var(--sans);
  font-size: 0.82rem;
  color: var(--mid);
}
.man-on-street .mot-followup {
  font-family: var(--sans);
  font-size: 0.82rem;
  color: var(--mid);
  font-style: italic;
  margin-top: 10px;
}

/* ── Utility / content classes ────────────────────────────────── */

.ad-brand-sub {
  font-size: 1rem;
  font-weight: 400;
}

.article-list {
  margin: 0 0 20px 20px;
  line-height: 2;
}

.column-bio {
  font-size: 0.82rem;
  line-height: 1.55;
}

.sidebar-section-bordered {
  margin-top: 20px;
  padding-top: 16px;
  border-top: 1px solid var(--light);
}

.sidebar-note {
  font-size: 0.78rem;
  line-height: 1.5;
  color: var(--mid);
}

/* ── Publication dateline ─────────────────────────────────────── */

/* ── Dateline + share row ─────────────────────────────────────── */

.dateline-share-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 4px;
  padding: 3px 24px;
  border-bottom: 1px solid var(--light);
  background: #fafafa;
  overflow: hidden;
}

.pub-dateline {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  font-family: var(--mono, monospace);
  font-size: 0.65rem;
  color: var(--mid);
  letter-spacing: 0.01em;
  line-height: 1.3;
  grid-column: 1 / -1;
  margin-top: 0;
  padding-top: 0;
}

.dl-date { }
.dl-time { }
.dl-ms   { }

/* ── Corrections block ────────────────────────────────────────── */

.corrections-block {
  border-top: 2px solid var(--black);
  margin: 40px 0 0;
  padding-top: 16px;
}
.corrections-block .corrections-label {
  font-family: var(--sans);
  font-size: 0.65rem;
  font-weight: 700;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: var(--mid);
  margin-bottom: 10px;
}
.corrections-block ul {
  list-style: none;
  padding: 0;
  margin: 0;
}
.corrections-block li {
  font-family: var(--sans);
  font-size: 0.82rem;
  line-height: 1.5;
  color: var(--mid);
  margin-bottom: 6px;
}
.corrections-block .correction-date {
  font-weight: 700;
  color: var(--black);
}

/* ── Share bar ────────────────────────────────────────────────── */

.share-bar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  margin: 0;
  padding: 0;
  border: none;
}

/* Vertical share bar in masthead.
   4 columns: flexible 1fr spacer tracks on the outside, two auto icon tracks in
   the middle. The full-width pub-dateline below would otherwise inflate the
   icon tracks and spread the icons apart; the 1fr spacers absorb that extra
   width instead, keeping the two icon columns tight and centered. */
.share-bar--vertical {
  display: inline-grid;
  grid-template-columns: auto auto;
  gap: 0;
  align-items: start;
  line-height: 0;
}
/* Quad variant: flexible 1fr spacer tracks outside, two tight icon tracks in
   the middle. Keeps the icons from spreading when a full-width dateline sits
   below them. REQUIRES .sb-spacer placeholder cells in the markup, so it is
   opt-in per page — pages without spacers keep the plain 2-column socbar. */
.share-bar--vertical.share-bar--quad {
  grid-template-columns: 1fr auto auto 1fr;
}
.share-bar--vertical .sb-spacer {
  width: 18px;
  height: 18px;
}

.share-bar--vertical .share-copy {
  font-family: Impact, 'Arial Narrow', var(--sans);
  font-size: 0.5rem;
  font-weight: 400;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: var(--red);
  text-align: left;
  width: 100%;
  height: auto;
}

.share-bar a.share-icon {
  border: none;
  background: transparent;
  padding: 0;
  width: auto;
  height: 18px;
  line-height: 0;
  display: flex;
  align-items: center;
}
.share-bar a.share-icon:hover {
  background: transparent;
  opacity: 0.7;
}

/* Share bar inside article body (standalone, not in dateline-share-row) */
.article-body .share-bar {
  margin: 36px 0 24px;
  padding: 18px 0;
  border-top: 1px solid var(--light);
  border-bottom: 1px solid var(--light);
}
.share-bar .share-label {
  font-family: var(--sans);
  font-size: 0.65rem;
  font-weight: 700;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: var(--mid);
  margin-right: 4px;
}
.share-bar a.share-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  border: none;
  color: var(--black);
  background: transparent;
  text-decoration: none;
  transition: opacity 0.15s;
  font-size: 0.9rem;
}
.share-bar a.share-btn:hover {
  background: var(--black);
  color: #fff;
}
.share-bar a.share-native {
  background: var(--black);
  color: #fff;
}
.share-bar a.share-native:hover {
  background: #333;
}

.pub-ms {
  font-size: 0.95em;
  font-weight: 900;
  color: var(--black);
  letter-spacing: 0;
}

/* ── Ad Banners (supplement) ── */
.sponsor-strip .sponsor-label {
  font-family: var(--sans);
  font-size: 0.55rem;
  font-weight: 700;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: var(--mid);
  margin-bottom: 0;
}
.sponsor-strip .sponsor-body .sponsor-name {
  font-family: var(--serif);
  font-size: 1.1rem;
  font-weight: 900;
  line-height: 1;
}
.sponsor-strip .sponsor-body .sponsor-tag {
  display: block;
  font-family: var(--sans);
  font-size: 0.75rem;
  color: var(--mid);
  margin-top: -2px;
  line-height: 1;
}

/* ── Ad Units (large format) ── */
.ad-unit {
  border: 1px solid var(--black);
  padding: 10px 24px;
  margin: 18px 0;
  text-align: center;
  background: #fff;
}
.ad-unit .sponsor-label {
  font-family: var(--sans);
  font-size: 0.55rem;
  font-weight: 700;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: var(--mid);
  margin-bottom: 6px;
}
.ad-unit .ad-brand {
  font-family: var(--serif);
  font-size: 1.6rem;
  font-weight: 900;
  letter-spacing: -0.5px;
  margin-bottom: 4px;
}
.ad-unit .ad-copy {
  font-family: var(--sans);
  font-size: 0.88rem;
  color: var(--mid);
  line-height: 1.5;
  margin-bottom: 8px;
}
.ad-unit .ad-cta {
  display: inline-block;
  background: var(--black);
  color: #fff;
  font-family: var(--sans);
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  padding: 9px 22px;
  text-decoration: none;
}
.ad-unit .ad-disclaimer {
  font-family: var(--sans);
  font-size: 0.65rem;
  color: #aaa;
  margin-top: 6px;
}

/* ── XMR Inline Tip Jar ── */
.xmr-inline {
  border-top: 1px solid var(--light);
  border-bottom: 1px solid var(--light);
  padding: 4px 20px;
  margin: 4px 0;
  display: flex;
  align-items: center;
  gap: 10px;
  background: var(--bg);
  clear: both;
  width: 100%;
  box-sizing: border-box;
  line-height: 1.2;
  flex-wrap: wrap;
}
.xmr-inline .xmr-inline-label {
  font-family: var(--sans);
  font-size: 0.52rem;
  font-weight: 700;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: var(--mid);
  flex-shrink: 0;
}
.xmr-inline .xmr-inline-ask {
  font-family: var(--serif);
  font-style: italic;
  font-size: 0.78rem;
  color: var(--mid);
  flex: 1 1 auto;
  min-width: 0;
}
.xmr-inline .xmr-inline-addr-row {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-left: auto;
  flex-shrink: 0;
  flex-wrap: wrap;
}
.xmr-inline .xmr-inline-addr {
  font-family: monospace;
  font-size: 0.7rem;
  background: transparent;
  border: none;
  padding: 3px 0;
  color: var(--black);
  user-select: all;
}
.xmr-inline .xmr-inline-copy {
  background: var(--black);
  color: #fff;
  border: none;
  font-family: var(--sans);
  font-size: 0.58rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  padding: 4px 10px;
  cursor: pointer;
}
.xmr-inline .xmr-inline-copy:hover { background: #333; }
.xmr-inline .xmr-inline-more {
  font-family: var(--sans);
  font-size: 0.64rem;
  color: var(--mid);
  text-decoration: none;
  letter-spacing: 0.06em;
}
.xmr-inline .xmr-inline-more:hover { text-decoration: underline; color: var(--black); }
