:root {
  --navy: #071b4d;
  --navy-2: #0f2c70;
  --navy-3: #183a8a;
  --red: #c01920;
  --red-dark: #8f1117;
  --gold: #f4c542;
  --ink: #101827;
  --muted: #667085;
  --line: #d8dde8;
  --bg: #f5f7fb;
  --paper: #ffffff;
  --rail: #f7f8fb;
  --shadow: 0 14px 35px rgba(7, 27, 77, 0.14);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  font-family: Arial, Helvetica, sans-serif;
  color: var(--ink);
  background: var(--bg);
  line-height: 1.45;
}
a { color: inherit; }
.site-shell { min-height: 100vh; display: flex; flex-direction: column; }

.network-bar {
  background: #050505;
  color: #d9dce4;
  border-bottom: 3px solid #e97321;
  font-size: .74rem;
  text-transform: uppercase;
  letter-spacing: .04em;
}
.network-inner,
.masthead-inner,
.trend-inner,
.page,
.site-footer-inner {
  width: min(1180px, calc(100% - 2rem));
  margin: 0 auto;
}
.network-inner {
  min-height: 30px;
  display: flex;
  align-items: center;
  gap: 1rem;
  overflow-x: auto;
  white-space: nowrap;
}
.network-item { font-weight: 800; opacity: .9; }
.network-sep { color: #79829c; }

.masthead {
  background:
    linear-gradient(90deg, rgba(7,27,77,.98), rgba(15,44,112,.98)),
    radial-gradient(circle at 65% 0%, rgba(255,255,255,.28), transparent 18rem);
  color: #fff;
}
.masthead-inner {
  min-height: 72px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1.25rem;
}
.brand {
  display: inline-flex;
  align-items: center;
  gap: .8rem;
  text-decoration: none;
  min-width: 0;
}
.brand-box {
  width: 76px;
  height: 58px;
  display: grid;
  place-items: center;
  background: #fff;
  color: var(--navy);
  border: 3px solid rgba(255,255,255,.7);
  box-shadow: inset 0 0 0 3px var(--navy);
  font-weight: 1000;
  font-size: 1.35rem;
  line-height: .9;
  letter-spacing: -.08em;
}
.brand-text {
  font-size: clamp(1.45rem, 3vw, 2.7rem);
  line-height: .9;
  font-weight: 1000;
  letter-spacing: -.055em;
  text-transform: uppercase;
  text-shadow: 0 2px 0 rgba(0,0,0,.18);
}
.main-nav {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: .2rem;
  font-size: .86rem;
  font-weight: 900;
}
.main-nav a {
  color: #fff;
  text-decoration: none;
  padding: .55rem .65rem;
  border-radius: 2px;
  text-transform: uppercase;
}
.main-nav a:hover { background: rgba(255,255,255,.14); }
.main-nav a:last-child {
  background: #b6532f;
  border: 1px solid rgba(255,255,255,.35);
}

.trend-bar {
  background: #fff;
  border-bottom: 1px solid var(--line);
  box-shadow: 0 2px 10px rgba(0,0,0,.04);
}
.trend-inner {
  min-height: 42px;
  display: flex;
  align-items: center;
  gap: 1.3rem;
  overflow-x: auto;
  white-space: nowrap;
  font-size: .86rem;
}
.trend-inner strong {
  color: var(--red);
  text-transform: uppercase;
  font-weight: 1000;
}
.trend-inner a {
  text-decoration: none;
  color: var(--navy);
  font-weight: 800;
}
.trend-inner a:hover { color: var(--red); }

.page {
  flex: 1;
  padding: 1.6rem 0 3rem;
}
.news-topper {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 1rem;
  border-bottom: 3px solid var(--line);
  margin-bottom: 1.5rem;
  padding-bottom: .8rem;
}
.section-label,
.story-flag,
.rail-kicker {
  display: inline-flex;
  align-items: center;
  width: fit-content;
  background: var(--red);
  color: #fff;
  font-size: .72rem;
  text-transform: uppercase;
  font-weight: 1000;
  letter-spacing: .04em;
  padding: .25rem .45rem;
  border-radius: 2px;
}
.news-topper h1,
h1 {
  margin: .35rem 0 0;
  font-size: clamp(2.1rem, 5vw, 4.15rem);
  line-height: .92;
  color: var(--navy);
  letter-spacing: -.06em;
  font-weight: 1000;
}
.topper-note {
  max-width: 430px;
  margin: 0;
  color: var(--muted);
  font-weight: 700;
}
.front-layout,
.article-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 320px;
  gap: 1.6rem;
  align-items: start;
}
.lead-column { min-width: 0; }
.lead-story {
  background: var(--paper);
  border-bottom: 1px solid var(--line);
  padding-bottom: 1.1rem;
}
.lead-link {
  display: grid;
  grid-template-columns: minmax(300px, 1fr) minmax(280px, .78fr);
  gap: 1.1rem;
  text-decoration: none;
}
.lead-image-link,
.story-image-link {
  display: block;
  min-width: 0;
  text-decoration: none;
  color: inherit;
}
.story-title-link {
  color: inherit;
  text-decoration: none;
}
.story-title-link:hover,
.reporter-byline-link:hover {
  color: var(--red);
}
.lead-image,
.article-hero,
.thumb {
  position: relative;
  min-height: 230px;
  overflow: hidden;
  background:
    linear-gradient(135deg, rgba(7,27,77,.05), rgba(7,27,77,.12)),
    repeating-linear-gradient(-35deg, #d9e1f3 0 15px, #c4cfe6 15px 30px);
  border-radius: 4px;
}
.lead-image::after,
.article-hero::after,
.thumb::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, transparent 45%, rgba(7,27,77,.78));
}
.image-label {
  position: absolute;
  z-index: 1;
  top: .7rem;
  left: .7rem;
  background: var(--red);
  color: #fff;
  font-size: .75rem;
  font-weight: 1000;
  text-transform: uppercase;
  padding: .25rem .4rem;
  border-radius: 2px;
}
.image-title {
  position: absolute;
  z-index: 1;
  left: 1rem;
  bottom: .85rem;
  background: rgba(7,27,77,.88);
  color: #fff;
  padding: .35rem .55rem;
  font-size: clamp(1.4rem, 3vw, 2.2rem);
  font-weight: 1000;
  text-transform: uppercase;
  line-height: .95;
}
.lead-copy h2 {
  margin: .65rem 0 .75rem;
  color: var(--navy);
  font-size: clamp(2rem, 4vw, 3.4rem);
  line-height: .96;
  letter-spacing: -.065em;
  font-weight: 1000;
}
.lead-copy p,
.summary,
.story-card p,
.rail-card p,
.empty-state p {
  color: var(--muted);
  font-weight: 650;
}
.lead-copy small,
.story-card small,
.story-meta {
  color: var(--muted);
  font-size: .82rem;
  font-weight: 700;
}
.under-lead-links {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1rem;
  margin: 1rem 0 1.25rem;
}
.under-lead-links a {
  color: #9d3316;
  text-decoration: none;
  font-size: .93rem;
  font-weight: 800;
  padding-left: .85rem;
  position: relative;
}
.under-lead-links a::before {
  content: '•';
  position: absolute;
  left: 0;
  color: var(--red);
}
.story-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1rem;
  border-top: 1px solid var(--line);
  padding-top: 1rem;
}
.story-card {
  background: var(--paper);
  border-right: 1px solid var(--line);
  padding-right: .9rem;
}
.story-card:nth-child(3n) { border-right: 0; }
.story-link {
  display: block;
  text-decoration: none;
}
.thumb {
  min-height: 112px;
  margin-bottom: .65rem;
}
.thumb span {
  position: absolute;
  z-index: 1;
  right: .55rem;
  bottom: .45rem;
  color: #fff;
  font-size: 2rem;
  font-weight: 1000;
}
.story-tag { margin-bottom: .55rem; background: var(--navy-2); }
.story-card h2 {
  margin: .35rem 0 .45rem;
  color: var(--navy);
  font-size: 1.25rem;
  line-height: 1.05;
  letter-spacing: -.035em;
  font-weight: 1000;
}
.story-card h2 a:hover,
.lead-copy h2 a:hover,
.rail-list a:hover { color: var(--red); }

.right-rail {
  border-left: 1px solid var(--line);
  padding-left: 1rem;
  display: grid;
  gap: 1rem;
}
.rail-card {
  background: var(--paper);
  border: 1px solid var(--line);
  box-shadow: 0 8px 20px rgba(7, 27, 77, .08);
  padding: 1rem;
}
.live-card {
  background: linear-gradient(180deg, var(--navy), var(--navy-2));
  color: #fff;
  border: 0;
}
.live-card p { color: #dbe4ff; }
.rail-card h3 {
  margin: .5rem 0;
  font-size: 1.25rem;
  color: inherit;
  line-height: 1.05;
}
.rail-button,
.button,
button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 0;
  background: var(--red);
  color: #fff;
  font-weight: 1000;
  font-size: .88rem;
  text-transform: uppercase;
  text-decoration: none;
  padding: .7rem .9rem;
  border-radius: 3px;
  cursor: pointer;
}
.rail-button:hover,
.button:hover,
button:hover { background: var(--red-dark); }
.secondary {
  background: #fff;
  color: var(--navy);
  border: 1px solid var(--line);
}
.secondary:hover { background: var(--navy); color: #fff; }
.rail-list {
  margin: .35rem 0 0;
  padding-left: 1.35rem;
}
.rail-list li {
  padding: .65rem 0;
  border-bottom: 1px solid var(--line);
  font-weight: 900;
}
.rail-list li:last-child { border-bottom: 0; }
.rail-list a { text-decoration: none; color: var(--navy); }
.ad-card { background: #fbfcff; }

.empty-state,
.panel,
.form-card,
.price-card {
  background: var(--paper);
  border: 1px solid var(--line);
  box-shadow: var(--shadow);
  padding: clamp(1.25rem, 4vw, 2.2rem);
}
.breaking-empty {
  border-top: 5px solid var(--red);
}
.empty-state h2,
.panel h1,
.panel h2 { color: var(--navy); margin-top: .4rem; }
.narrow { max-width: 760px; margin-inline: auto; }
.feature-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
  gap: 1rem;
  margin: 1.25rem 0;
}
.feature-grid article,
.price-card {
  border-top: 4px solid var(--navy);
  background: #fff;
}
.price-card strong { display: block; font-size: 2.4rem; color: var(--navy); }

.article-layout { grid-template-columns: minmax(0, 820px) 300px; justify-content: center; }
.article-main {
  background: var(--paper);
  padding: clamp(1.25rem, 4vw, 2.6rem);
  border-top: 6px solid var(--red);
  box-shadow: var(--shadow);
}
.story-meta {
  display: flex;
  align-items: center;
  gap: .55rem;
  flex-wrap: wrap;
  margin-bottom: .8rem;
}
.article-main h1 { margin-bottom: .8rem; }
.summary { font-size: 1.2rem; max-width: 720px; }
.article-hero { min-height: 260px; margin: 1.4rem 0; }
.story-body {
  font-family: Georgia, 'Times New Roman', serif;
  font-size: 1.15rem;
  line-height: 1.75;
}
.share-links {
  display: flex;
  gap: .65rem;
  flex-wrap: wrap;
  align-items: center;
}
.article-rail { position: sticky; top: 1rem; }

label { display: block; font-weight: 900; color: var(--navy); margin-bottom: 1rem; }
input, textarea, select {
  width: 100%;
  margin-top: .35rem;
  padding: .75rem;
  border: 1px solid #b9c2d6;
  background: #fff;
  font: inherit;
}
input:focus, textarea:focus, select:focus {
  outline: 3px solid rgba(192,25,32,.18);
  border-color: var(--red);
}
code { background: #eef2ff; padding: .15rem .35rem; border: 1px solid var(--line); }

.site-footer {
  background: #071126;
  color: #fff;
  border-top: 4px solid var(--red);
  margin-top: auto;
}
.site-footer-inner,
.site-footer {
  padding: 1.4rem 0;
}
.site-footer-inner {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  flex-wrap: wrap;
}
.site-footer p { color: #cbd5e1; margin: 0; max-width: 560px; }
.site-footer nav { display: flex; gap: .8rem; flex-wrap: wrap; }
.site-footer a { color: #fff; font-weight: 800; text-decoration: none; }
.site-footer a:hover { color: var(--gold); }

/* Admin area keeps its own layout but uses the same visual system. */
.admin-shell .masthead { background: linear-gradient(90deg, #121826, #1f2937); }
.admin-page { width: min(1180px, calc(100% - 2rem)); margin: 1.6rem auto 3rem; }
.admin-head { display: flex; justify-content: space-between; align-items: end; gap: 1rem; margin-bottom: 1rem; }
.table-wrap { overflow-x: auto; background: var(--paper); border: 1px solid var(--line); box-shadow: var(--shadow); }
table { width: 100%; border-collapse: collapse; }
th, td { text-align: left; padding: .85rem; border-bottom: 1px solid var(--line); }
th { background: var(--navy); color: #fff; }

@media (max-width: 980px) {
  .front-layout,
  .article-layout,
  .lead-link { grid-template-columns: 1fr; }
  .right-rail { border-left: 0; padding-left: 0; }
  .article-rail { position: static; }
  .story-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .story-card:nth-child(3n) { border-right: 1px solid var(--line); }
  .story-card:nth-child(2n) { border-right: 0; }
}
@media (max-width: 720px) {
  .masthead-inner { align-items: flex-start; flex-direction: column; padding: .8rem 0; }
  .brand-box { width: 62px; height: 48px; }
  .main-nav { justify-content: flex-start; }
  .news-topper { align-items: flex-start; flex-direction: column; }
  .under-lead-links,
  .story-grid { grid-template-columns: 1fr; }
  .story-card { border-right: 0 !important; border-bottom: 1px solid var(--line); padding-bottom: .9rem; }
}

/* Admin dashboard */
.admin-body { margin: 0; background: #f4f6fb; color: #111735; }
.admin-layout { min-height: 100vh; display: grid; grid-template-columns: 230px 1fr; grid-template-rows: 58px 1fr; }
.admin-topbar { grid-column: 1 / -1; grid-row: 1; display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 0 1.2rem; background: #090e22; color: #fff; border-bottom: 3px solid #a34d2f; box-shadow: 0 2px 12px rgba(0,0,0,.18); }
.admin-topbrand { display: flex; align-items: center; gap: .75rem; color: #fff; text-decoration: none; min-width: 0; }
.admin-topbrand strong { display: block; font-size: 1.1rem; line-height: 1; letter-spacing: .03em; }
.admin-topbrand small { display: block; color: #c8cfdf; font-size: .72rem; margin-top: .18rem; }
.admin-topmark { width: 34px; height: 34px; display: flex; align-items: center; justify-content: center; background: #fff; border: 2px solid #dfe5f4; overflow: hidden; flex: 0 0 34px; }
.admin-topmark img { width: 100%; height: 100%; object-fit: contain; display: block; }
.admin-top-actions { display: flex; align-items: center; justify-content: flex-end; gap: .6rem; min-width: 0; }
.admin-user { color: #e6eaf4; font-weight: 800; font-size: .78rem; white-space: nowrap; }
.admin-button { display: inline-flex; align-items: center; min-height: 32px; padding: 0 .75rem; border-radius: 2px; background: #a76435; color: #fff; text-decoration: none; font-size: .72rem; font-weight: 900; text-transform: uppercase; letter-spacing: .03em; }
.admin-button.secondary { background: #151c34; border: 1px solid rgba(255,255,255,.25); }
.site-switcher { display: flex; align-items: center; gap: .35rem; color: #c8cfdf; font-size: .72rem; font-weight: 900; text-transform: uppercase; }
.site-switcher select { height: 32px; border: 1px solid #303957; border-radius: 2px; background: #fff; color: #111735; font-weight: 800; padding: 0 .5rem; max-width: 230px; }
.admin-sidebar { grid-column: 1; grid-row: 2; background: #11172b; color: #fff; padding: 1rem .85rem; display: flex; flex-direction: column; gap: 1.2rem; }
.admin-sidebar-brand { display: flex; align-items: center; gap: .7rem; padding: .85rem; border: 1px solid rgba(255,255,255,.1); background: rgba(255,255,255,.03); }
.admin-sidebar-logo { width: 44px; height: 44px; display: flex; align-items: center; justify-content: center; background: #fff; border: 2px solid #dfe5f4; overflow: hidden; flex: 0 0 44px; }
.admin-sidebar-logo img { width: 100%; height: 100%; object-fit: contain; display: block; }
.admin-sidebar-brand strong { display: block; font-size: .88rem; line-height: 1.05; }
.admin-sidebar-brand small { display: block; color: #b8c0d5; font-size: .72rem; margin-top: .25rem; }
.admin-side-nav { display: grid; gap: .25rem; }
.admin-side-nav a { display: flex; align-items: center; gap: .65rem; color: #eef2ff; text-decoration: none; padding: .75rem .55rem; border-radius: 4px; font-weight: 900; }
.admin-side-nav a:hover { background: rgba(255,255,255,.07); }
.admin-side-nav span { width: 22px; height: 22px; display: inline-flex; align-items: center; justify-content: center; background: #252e4d; color: #fff; border-radius: 3px; font-size: .72rem; }
.admin-public-link { margin-top: auto; display: block; text-align: center; color: #fff; background: #a76435; text-decoration: none; font-weight: 900; text-transform: uppercase; padding: .75rem; border-radius: 3px; font-size: .75rem; }
.admin-main { grid-column: 2; grid-row: 2; padding: 3rem clamp(1rem, 4vw, 4rem); max-width: 1180px; width: 100%; box-sizing: border-box; }
.admin-head { display: flex; justify-content: space-between; align-items: flex-end; gap: 1rem; margin-bottom: 1rem; }
.admin-head h1, .admin-main h1 { font-size: clamp(2.1rem, 4vw, 3.25rem); margin: .15rem 0 0; color: #151b4b; line-height: .95; }
.table-wrap { background: #fff; border: 1px solid #dbe1ee; box-shadow: 0 16px 38px rgba(15,23,42,.09); overflow-x: auto; }
.table-wrap table { width: 100%; border-collapse: collapse; }
.table-wrap th { text-align: left; background: #151b4b; color: #fff; padding: .9rem 1rem; font-size: .82rem; }
.table-wrap td { padding: .9rem 1rem; border-bottom: 1px solid #edf0f7; }
.alert.error { background: #fee2e2; color: #991b1b; border: 1px solid #fecaca; padding: .8rem 1rem; margin: 1rem 0; font-weight: 800; }

@media (max-width: 760px) {
  .admin-layout { display: block; }
  .admin-topbar { min-height: 58px; align-items: flex-start; flex-direction: column; padding: .8rem 1rem; }
  .admin-top-actions { width: 100%; justify-content: flex-start; flex-wrap: wrap; }
  .admin-sidebar { display: block; padding: .7rem; }
  .admin-sidebar-brand { display: none; }
  .admin-side-nav { display: flex; overflow-x: auto; gap: .4rem; padding-bottom: .25rem; }
  .admin-side-nav a { flex: 0 0 auto; }
  .admin-public-link { display: none; }
  .admin-main { padding: 1.5rem 1rem 3rem; }
}
.admin-topmark strong, .admin-sidebar-logo strong { color: #151b4b; font-size: .78rem; font-weight: 1000; letter-spacing: .03em; }

.lead-image.has-image,
.article-hero.has-image,
.thumb.has-image {
  background: #071b4d;
}

.lead-image img,
.article-hero img,
.thumb img {
  position: absolute;
  inset: 0;
  display: block;
  width: 100% !important;
  max-width: none !important;
  height: 100% !important;
  object-fit: cover;
  display: block;
}

.form-help {
  margin: -0.65rem 0 1rem;
  color: var(--muted);
  font-size: 0.9rem;
  font-weight: 700;
}


.admin-story-table { table-layout: fixed; width: 100%; }
.admin-story-image-col { width: 132px; }
.admin-story-image-cell { width: 132px; }
.admin-story-thumb-link { display: inline-flex; align-items: center; justify-content: center; width: 112px; height: 70px; background: #eef1f7; border: 1px solid #d5dbea; text-decoration: none; overflow: hidden; }
.admin-story-thumb { width: 100%; height: 100%; object-fit: contain; display: block; }
.admin-story-no-thumb { display: inline-flex; align-items: center; justify-content: center; width: 112px; height: 70px; background: #eef1f7; color: #6c748b; border: 1px dashed #c8cfdf; font-size: .72rem; font-weight: 900; text-transform: uppercase; letter-spacing: .03em; }
.admin-story-title-cell a { color: #111735; font-weight: 800; text-decoration-thickness: 1px; }
.admin-story-uri-cell code { white-space: normal; word-break: break-word; font-size: .75rem; }
.admin-action-link { display: inline-flex; align-items: center; min-height: 28px; padding: 0 .55rem; background: #151b4b; color: #fff; border-radius: 3px; text-decoration: none; font-size: .72rem; font-weight: 900; text-transform: uppercase; }
.current-story-image { display: grid; gap: .45rem; padding: .8rem; border: 1px solid #d9deeb; background: #f7f8fb; }
.current-story-image span { font-weight: 900; color: #111735; }
.current-story-image img { width: 220px; max-width: 100%; height: 135px; object-fit: contain; border: 1px solid #d5dbea; background: #fff; display: block; }
.current-story-image a { font-size: .78rem; font-weight: 800; }
@media (max-width: 760px) {
  .admin-story-table { min-width: 760px; }
  .admin-story-table-wrap { overflow-x: auto; }
}


/* Admin editing improvements */
.admin-main {
  max-width: none;
  padding: 1.25rem clamp(.85rem, 2vw, 1.75rem) 2rem;
}

.admin-main .panel,
.admin-main .form-card,
.admin-main .table-wrap,
.admin-head {
  width: 100%;
  max-width: none;
}

.admin-edit-panel {
  padding: clamp(1rem, 1.6vw, 1.5rem);
}

.admin-edit-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: .8rem;
}

.admin-edit-head .kicker {
  margin-bottom: .15rem;
}

.admin-edit-head h1,
.admin-main h1 {
  font-size: clamp(1.8rem, 3vw, 2.65rem);
  line-height: 1;
}

.admin-edit-back {
  flex: 0 0 auto;
}

.admin-main .form-card {
  background: #fff;
  border: 1px solid #dbe1ee;
  box-shadow: 0 16px 38px rgba(15,23,42,.08);
  padding: clamp(1rem, 1.6vw, 1.35rem);
}

.story-edit-form {
  display: grid;
  gap: .85rem;
}

.story-edit-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(260px, .9fr);
  gap: .75rem 1rem;
  align-items: start;
}

.story-edit-field,
.admin-main label {
  color: #101735;
  font-weight: 800;
  margin-bottom: 0;
}

.story-edit-field input,
.story-edit-field textarea,
.story-edit-field select,
.admin-main input,
.admin-main textarea,
.admin-main select {
  font-family: Arial, Helvetica, sans-serif;
  font-weight: 400;
  line-height: 1.35;
  color: #101827;
  margin-top: .25rem;
  padding: .55rem .65rem;
}

.admin-main input[type="file"] {
  font-weight: 400;
  padding: .48rem .55rem;
}

.admin-main input::placeholder,
.admin-main textarea::placeholder {
  color: #667085;
  font-weight: 400;
}

.story-edit-title,
.story-edit-uri,
.story-edit-summary,
.story-edit-media,
.story-edit-status,
.story-edit-body {
  min-width: 0;
}

.story-edit-summary,
.story-edit-media,
.story-edit-body {
  grid-column: 1 / -1;
}

.story-edit-summary textarea {
  min-height: 4.3rem;
  resize: vertical;
}

.story-edit-media {
  display: grid;
  grid-template-columns: 210px minmax(0, 1fr);
  gap: .85rem;
  align-items: stretch;
}

.story-image-card {
  display: grid;
  gap: .4rem;
  align-content: start;
  padding: .65rem;
  border: 1px solid #d9deeb;
  background: #f7f8fb;
  min-height: 142px;
}

.story-image-card span,
.current-story-image span {
  font-weight: 900;
  color: #111735;
  font-size: .82rem;
}

.story-image-card img,
.current-story-image img {
  width: 180px;
  max-width: 100%;
  height: 95px;
  object-fit: contain;
  border: 1px solid #d5dbea;
  background: #fff;
  display: block;
}

.story-image-card a,
.current-story-image a {
  font-size: .78rem;
  font-weight: 800;
}

.story-image-empty {
  min-height: 95px;
  display: grid;
  place-items: center;
  border: 1px dashed #c8cfdf;
  background: #fff;
  color: #6c748b;
  font-size: .74rem;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: .03em;
}

.story-image-fields {
  display: grid;
  gap: .55rem;
  align-content: start;
}

.compact-help,
.form-help.compact-help {
  margin: -.25rem 0 0;
  font-size: .8rem;
  line-height: 1.35;
}

.story-edit-status {
  max-width: 260px;
}

.richtext-label {
  margin-bottom: .35rem;
}

.richtext-editor {
  margin-bottom: 0;
  border: 1px solid #b9c2d6;
  background: #fff;
}

.richtext-toolbar {
  display: flex;
  flex-wrap: wrap;
  gap: .3rem;
  padding: .45rem;
  background: #f3f5fa;
  border-bottom: 1px solid #d8dde8;
  position: sticky;
  top: 58px;
  z-index: 2;
}

.richtext-toolbar button {
  width: auto;
  min-height: 30px;
  padding: .3rem .5rem;
  border: 1px solid #c6cedd;
  background: #fff;
  color: #151b4b;
  border-radius: 3px;
  font-family: Arial, Helvetica, sans-serif;
  font-size: .8rem;
  font-weight: 800;
  cursor: pointer;
}

.richtext-toolbar button:hover,
.richtext-toolbar button:focus {
  background: #151b4b;
  color: #fff;
  outline: none;
}

.richtext-surface {
  min-height: clamp(360px, 48vh, 620px);
  padding: .9rem 1rem;
  background: #fff;
  color: #101827;
  font-family: Georgia, 'Times New Roman', serif;
  font-size: 1.05rem;
  font-weight: 400;
  line-height: 1.7;
  outline: none;
  overflow: auto;
}

.richtext-surface:focus {
  box-shadow: inset 0 0 0 3px rgba(192,25,32,.14);
}

.richtext-surface p {
  margin: 0 0 1rem;
}

.richtext-surface h2,
.richtext-surface h3 {
  font-family: Arial, Helvetica, sans-serif;
  color: #151b4b;
  line-height: 1.15;
  margin: 1.2rem 0 .6rem;
}

.richtext-surface ul,
.richtext-surface ol {
  margin: 0 0 1rem 1.4rem;
  padding: 0;
}

.richtext-source {
  position: absolute;
  left: -9999px;
  width: 1px;
  height: 1px;
  opacity: 0;
}

.admin-form-actions {
  position: sticky;
  bottom: 0;
  z-index: 4;
  display: flex;
  justify-content: flex-end;
  gap: .6rem;
  padding: .75rem 0 0;
  background: linear-gradient(to bottom, rgba(255,255,255,0), #fff 34%);
  border-top: 1px solid #e2e7f2;
}

.admin-form-actions button,
.admin-form-actions .admin-button {
  width: auto;
  min-height: 34px;
  padding: 0 .85rem;
}

.current-story-image,
.current-story-image img,
.admin-story-thumb {
  object-fit: contain;
}

@media (max-width: 900px) {
  .story-edit-grid,
  .story-edit-media {
    grid-template-columns: 1fr;
  }

  .story-edit-status {
    max-width: none;
  }
}

@media (max-width: 760px) {
  .admin-main {
    padding: 1rem .75rem 2rem;
  }

  .admin-edit-head {
    align-items: flex-start;
    flex-direction: column;
  }

  .richtext-toolbar {
    top: 0;
  }

  .richtext-surface {
    min-height: 320px;
    font-size: 1rem;
  }
}

/* Combined admin editor fix: compact vertical layout + smart ChatGPT paste display.
   The JavaScript keeps semantic formatting from ChatGPT while stripping noisy inline styles.
   These rules keep the editor readable without losing the compact edit page layout. */
.admin-main .richtext-surface,
.admin-main .richtext-surface p,
.admin-main .richtext-surface div,
.admin-main .richtext-surface li {
  font-family: Arial, Helvetica, sans-serif;
  font-size: 15px;
  line-height: 1.55;
  font-weight: 400;
  color: #111827;
}

.admin-main .richtext-surface p,
.admin-main .richtext-surface div {
  margin: 0 0 .85rem;
}

.admin-main .richtext-surface h1,
.admin-main .richtext-surface h2,
.admin-main .richtext-surface h3,
.admin-main .richtext-surface h4,
.admin-main .richtext-surface h5,
.admin-main .richtext-surface h6 {
  font-family: Arial, Helvetica, sans-serif;
  font-weight: 800;
  line-height: 1.22;
  color: #111827;
  margin: .95rem 0 .5rem;
}

.admin-main .richtext-surface h1 { font-size: 26px; }
.admin-main .richtext-surface h2 { font-size: 24px; }
.admin-main .richtext-surface h3 { font-size: 19px; }
.admin-main .richtext-surface h4,
.admin-main .richtext-surface h5,
.admin-main .richtext-surface h6 { font-size: 16px; }

.admin-main .richtext-surface ul,
.admin-main .richtext-surface ol {
  margin: 0 0 .9rem 1.3rem;
  padding: 0;
}

.admin-main .richtext-surface li {
  margin: 0 0 .25rem;
}

.admin-main .richtext-surface strong,
.admin-main .richtext-surface b {
  font-weight: 700;
}

.admin-main .richtext-surface em,
.admin-main .richtext-surface i {
  font-style: italic;
}

.admin-main .richtext-surface blockquote {
  margin: .75rem 0 .9rem;
  padding: .55rem .8rem;
  border-left: 4px solid #d8dde8;
  background: #f7f8fb;
  color: #344054;
}

.admin-main .richtext-surface a {
  color: #153e9f;
  text-decoration: underline;
}

.admin-main .richtext-surface span,
.admin-main .richtext-surface font {
  font-family: inherit !important;
  font-size: inherit !important;
  color: inherit !important;
  font-weight: inherit;
}

/* Editor/public story formatting fix: keep ChatGPT semantic formatting but remove bad pasted sizing. */
.admin-main .richtext-surface {
  min-height: clamp(460px, 56vh, 720px);
  padding: 1rem 1.1rem;
  font-family: Georgia, 'Times New Roman', serif;
  font-size: 18px;
  line-height: 1.68;
  font-weight: 400;
  letter-spacing: normal;
  word-spacing: normal;
  color: #111827;
}

.admin-main .richtext-surface p,
.admin-main .richtext-surface div,
.admin-main .richtext-surface li {
  font-family: Georgia, 'Times New Roman', serif;
  font-size: 18px;
  line-height: 1.68;
  font-weight: 400;
  letter-spacing: normal;
  word-spacing: normal;
  color: #111827;
}

.admin-main .richtext-surface p,
.admin-main .richtext-surface div {
  margin: 0 0 1rem;
}

.admin-main .richtext-surface h1,
.admin-main .richtext-surface h2,
.admin-main .richtext-surface h3,
.admin-main .richtext-surface h4,
.admin-main .richtext-surface h5,
.admin-main .richtext-surface h6 {
  font-family: Georgia, 'Times New Roman', serif;
  font-weight: 800;
  line-height: 1.18;
  letter-spacing: -.02em;
  color: #071b4d;
  margin: 1.1rem 0 .65rem;
}

.admin-main .richtext-surface h1 { font-size: 30px; }
.admin-main .richtext-surface h2 { font-size: 27px; }
.admin-main .richtext-surface h3 { font-size: 22px; }
.admin-main .richtext-surface h4,
.admin-main .richtext-surface h5,
.admin-main .richtext-surface h6 { font-size: 19px; }

.admin-main .richtext-surface ul,
.admin-main .richtext-surface ol {
  margin: 0 0 1rem 1.6rem;
  padding: 0;
}

.admin-main .richtext-surface li {
  margin: 0 0 .35rem;
}

.admin-main .richtext-surface strong,
.admin-main .richtext-surface b {
  font-weight: 700;
}

.admin-main .richtext-surface em,
.admin-main .richtext-surface i {
  font-style: italic;
}

.admin-main .richtext-surface blockquote {
  margin: .9rem 0 1rem;
  padding: .65rem .9rem;
  border-left: 4px solid #d8dde8;
  background: #f7f8fb;
  color: #344054;
}

.admin-main .richtext-surface a {
  color: #153e9f;
  text-decoration: underline;
}

.admin-main .richtext-surface span,
.admin-main .richtext-surface font {
  font-family: inherit !important;
  font-size: inherit !important;
  color: inherit !important;
  font-weight: inherit;
  letter-spacing: inherit !important;
  word-spacing: inherit !important;
}

.story-body {
  font-family: Georgia, 'Times New Roman', serif;
  font-size: 1.15rem;
  line-height: 1.75;
  letter-spacing: normal;
  word-spacing: normal;
}

.story-body p,
.story-body li,
.story-body blockquote {
  font-family: Georgia, 'Times New Roman', serif;
  font-size: 1.15rem;
  line-height: 1.75;
  font-weight: 400;
  letter-spacing: normal;
  word-spacing: normal;
  color: var(--ink, #101827);
}

.story-body p {
  margin: 0 0 1.15rem;
}

.story-body h1,
.story-body h2,
.story-body h3,
.story-body h4,
.story-body h5,
.story-body h6 {
  font-family: Georgia, 'Times New Roman', serif;
  color: var(--navy, #071b4d);
  font-weight: 800;
  letter-spacing: -.02em;
  line-height: 1.18;
  margin: 1.55rem 0 .75rem;
}

.story-body h1 { font-size: clamp(1.8rem, 3vw, 2.45rem); }
.story-body h2 { font-size: clamp(1.55rem, 2.35vw, 2.1rem); }
.story-body h3 { font-size: clamp(1.3rem, 1.8vw, 1.65rem); }
.story-body h4,
.story-body h5,
.story-body h6 { font-size: 1.18rem; }

.story-body ul,
.story-body ol {
  margin: 0 0 1.2rem 1.6rem;
  padding: 0;
}

.story-body li {
  margin: 0 0 .35rem;
}

.story-body strong,
.story-body b {
  font-weight: 700;
}

.story-body em,
.story-body i {
  font-style: italic;
}

.story-body blockquote {
  margin: 1.2rem 0;
  padding: .75rem 1rem;
  border-left: 4px solid var(--line, #d8dde8);
  background: #f7f8fb;
}

.story-body span,
.story-body font {
  font-family: inherit !important;
  font-size: inherit !important;
  color: inherit !important;
  font-weight: inherit;
  letter-spacing: inherit !important;
  word-spacing: inherit !important;
}

/* Full article hero images should show the entire uploaded image.
   Keep thumbnail/card images cropped, but do not crop the story detail hero. */
.article-main .article-hero.has-image {
  min-height: 0;
  height: auto;
  overflow: hidden;
  background: #fff;
}

.article-main .article-hero.has-image img {
  position: relative;
  inset: auto;
  display: block;
  width: 100%;
  height: auto;
  max-height: none;
  object-fit: contain;
}


/* Article share buttons: shown near the top for quick shares and repeated at the bottom after reading. */
.share-links {
  display: flex;
  gap: .55rem;
  flex-wrap: wrap;
  align-items: center;
}
.share-links-top {
  margin: .85rem 0 1.15rem;
  padding-top: 0;
  border-top: 0;
}
.share-links-bottom {
  margin-top: 2rem;
  padding-top: 1.25rem;
  border-top: 1px solid var(--line);
}
.share-button {
  white-space: nowrap;
  border: 0;
}
.share-facebook {
  background: #1877f2;
  color: #fff;
}
.share-facebook:hover {
  background: #145dbd;
  color: #fff;
}
.share-x {
  background: #000;
  color: #fff;
}
.share-x:hover {
  background: #111827;
  color: #fff;
}
.share-copy {
  background: var(--red);
  color: #fff;
}
.share-copy:hover {
  background: var(--red-dark);
  color: #fff;
}
@media (max-width: 640px) {
  .share-links {
    gap: .45rem;
  }
  .share-button {
    flex: 1 1 auto;
    min-width: 0;
    padding: .65rem .7rem;
    font-size: .78rem;
  }
}

/* Homepage image fit: keep lead story large, but show full images on smaller story cards. */
.front-layout .lead-image.has-image {
  min-height: 230px;
  aspect-ratio: auto;
  background: #071b4d;
  overflow: hidden;
}

.front-layout .lead-image.has-image img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover !important;
  object-position: center center;
  display: block;
}

.front-layout .lead-image.has-image::after {
  background: linear-gradient(180deg, transparent 45%, rgba(7,27,77,.78));
  pointer-events: none;
}

.front-layout .thumb.has-image,
.compact-grid .thumb.has-image,
.story-card .thumb.has-image {
  min-height: 0;
  aspect-ratio: 3 / 1;
  max-height: 360px;
  background: #fff;
  overflow: hidden;
}

.front-layout .thumb.has-image img,
.compact-grid .thumb.has-image img,
.story-card .thumb.has-image img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: contain !important;
  object-position: center center;
  display: block;
}

.front-layout .thumb.has-image::after,
.compact-grid .thumb.has-image::after,
.story-card .thumb.has-image::after {
  background: linear-gradient(180deg, transparent 58%, rgba(7,27,77,.65));
  pointer-events: none;
}

.lead-copy {
  min-width: 0;
}

.lead-copy h2,
.story-card h2 {
  overflow-wrap: anywhere;
}

/* Free reader accounts and moderated comments. */
.account-panel .account-switch,
.account-panel .account-actions {
  margin-top: 1rem;
}

.checkbox-label {
  display: flex !important;
  gap: .55rem;
  align-items: flex-start;
  font-weight: 700;
}

.checkbox-label input {
  width: auto !important;
  margin-top: .15rem;
}

.hp-field {
  position: absolute !important;
  left: -9999px !important;
  width: 1px !important;
  height: 1px !important;
  overflow: hidden !important;
}

.alert {
  margin: 1rem 0;
  padding: .85rem 1rem;
  border: 1px solid #d7deea;
  background: #f8fafc;
  font-weight: 800;
}

.alert.success {
  border-color: #badbcc;
  background: #eef8f1;
}

.alert.error {
  border-color: #f0b8b8;
  background: #fff2f2;
}

.comments-section {
  margin-top: 2rem;
  padding-top: 1.5rem;
  border-top: 1px solid #d8deea;
}

.comments-header h2 {
  margin: .5rem 0 1rem;
  font-family: var(--headline-font, Georgia, serif);
  font-size: clamp(1.8rem, 3vw, 2.5rem);
  line-height: .95;
  color: #121a46;
}

.comment-list {
  display: grid;
  gap: .9rem;
  margin: 1rem 0 1.4rem;
}

.reader-comment,
.comment-login-card,
.comment-form-wrap {
  border: 1px solid #d8deea;
  background: #fff;
  padding: 1rem;
}

.reader-comment header {
  display: flex;
  flex-wrap: wrap;
  gap: .5rem .75rem;
  align-items: baseline;
  margin-bottom: .45rem;
}

.reader-comment header strong {
  color: #121a46;
  font-weight: 900;
}

.reader-comment header span,
.comment-note,
.comments-empty {
  color: #687084;
  font-weight: 700;
}

.reader-comment p,
.comment-login-card p {
  margin: 0;
}

.comment-form {
  display: grid;
  gap: .8rem;
}

.comment-form label {
  display: grid;
  gap: .35rem;
  font-weight: 900;
}

.comment-form textarea {
  width: 100%;
  min-height: 130px;
  padding: .75rem;
  border: 1px solid #cfd6e6;
  font: inherit;
  resize: vertical;
}

.comment-form button,
.account-form button {
  justify-self: start;
}

.comment-login-card .button {
  margin-right: .5rem;
  margin-top: .5rem;
}

.admin-comments-list {
  display: grid;
  gap: 1rem;
}

.admin-comment-card {
  border: 1px solid #d8deea;
  background: #fff;
  padding: 1rem;
}

.admin-comment-card.status-pending {
  border-left: 5px solid #b4442a;
}

.admin-comment-card.status-approved {
  border-left: 5px solid #2f855a;
}

.admin-comment-card.status-rejected {
  border-left: 5px solid #718096;
  opacity: .8;
}

.admin-comment-head {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  align-items: flex-start;
}

.admin-comment-head span,
.admin-comment-meta {
  display: block;
  color: #687084;
  font-size: .85rem;
  font-weight: 700;
}

.comment-status {
  display: inline-block !important;
  padding: .25rem .5rem;
  background: #121a46;
  color: #fff !important;
  text-transform: uppercase;
  font-size: .75rem !important;
}

.admin-comment-body {
  margin: 1rem 0;
  padding: 1rem;
  background: #f7f8fc;
  border: 1px solid #e1e6f2;
}

.admin-comment-actions {
  display: flex;
  flex-wrap: wrap;
  gap: .5rem;
}

.admin-comment-actions .danger {
  background: #8b1e1e;
}

.admin-empty-state {
  padding: 2rem;
  border: 1px solid #d8deea;
  background: #fff;
}
.reader-comment p,
.admin-comment-body {
  white-space: pre-wrap;
}

/* Comment UX: collapsed forms, threaded replies, and AJAX refresh. */
.comments-section[data-comments-section] {
  margin-top: 2rem;
  padding-top: 1.5rem;
  border-top: 1px solid #d8deea;
}

.comments-section .comment-list {
  display: block;
  margin: 1rem 0 1.4rem;
}

.comments-section .reader-comment {
  border: 0;
  border-bottom: 1px solid #e0e5ef;
  background: transparent;
  padding: .9rem 0 1rem;
}

.comments-section .reader-comment:last-child {
  border-bottom: 0;
}

.comment-head {
  display: flex;
  flex-wrap: wrap;
  gap: .45rem .75rem;
  align-items: baseline;
  margin-bottom: .35rem;
}

.comment-head strong {
  color: #121a46;
  font-weight: 900;
}

.comment-head span,
.comment-note,
.comments-empty {
  color: #687084;
  font-weight: 700;
}

.comment-body {
  margin: 0 0 .55rem;
  line-height: 1.55;
}

.comment-actions {
  display: flex;
  flex-wrap: wrap;
  gap: .25rem .8rem;
  align-items: center;
  margin-top: .35rem;
}

.comment-action,
.comment-reaction-form button.comment-action {
  appearance: none;
  border: 0;
  background: transparent;
  padding: 0;
  color: #9d4f2d;
  cursor: pointer;
  font: inherit;
  font-family: var(--sans-font, Arial, sans-serif);
  font-size: .78rem;
  font-weight: 900;
  letter-spacing: .03em;
  text-transform: uppercase;
  text-decoration: none;
}

.comment-action:hover,
.comment-reaction-form button.comment-action:hover {
  text-decoration: underline;
}

.comment-reaction-form {
  display: inline;
  margin: 0;
}

.comment-replies {
  margin: .9rem 0 0 1.25rem;
  padding-left: 1rem;
  border-left: 3px solid #e0e5ef;
}

.comment-replies .reply-comment {
  padding: .55rem 0 .7rem;
  border-bottom: 0;
}

.comment-reply-form,
.comment-new-form,
.comment-login-card {
  margin-top: .9rem;
  padding: 1rem;
  border: 1px solid #d8deea;
  background: #f8f9fc;
}

.comment-form-wrap {
  border: 0;
  background: transparent;
  padding: 0;
  margin-top: 1.2rem;
}

.comment-add-toggle {
  margin-top: .3rem;
}

.comment-form.compact textarea {
  min-height: 105px;
}

.comment-form-actions {
  display: flex;
  flex-wrap: wrap;
  gap: .55rem;
  align-items: center;
}

.comment-form-actions button,
.comment-form-actions .button {
  margin: 0;
}

.comments-section.is-loading {
  opacity: .62;
  pointer-events: none;
}

@media (max-width: 640px) {
  .comment-replies {
    margin-left: .45rem;
    padding-left: .75rem;
  }

  .comment-reply-form,
  .comment-new-form,
  .comment-login-card {
    padding: .85rem;
  }
}

/* Comment action cleanup: compact reactions, reply links on replies, one-level threads. */
.comments-section .comment-actions {
  gap: .25rem .55rem;
  color: #687084;
}

.comments-section .comment-action,
.comments-section .comment-reaction-form button.comment-action {
  display: inline-flex;
  align-items: center;
  gap: .18rem;
  min-height: 1.35rem;
  color: #9d4f2d;
  font-size: .76rem;
  line-height: 1;
  letter-spacing: .02em;
  text-transform: uppercase;
}

.comments-section .comment-reaction-action {
  color: #4f5b72;
  text-decoration: none;
}

.comments-section .comment-reaction-action span {
  color: #687084;
  font-size: .72rem;
  font-weight: 900;
}

.comments-section .comment-reply-action::after {
  content: '·';
  display: inline-block;
  margin-left: .55rem;
  color: #aab2c2;
  text-decoration: none;
}

.comments-section .comment-actions .comment-reaction-form + .comment-reaction-form::before,
.comments-section .comment-actions a.comment-reaction-action + a.comment-reaction-action::before {
  content: '·';
  display: inline-block;
  margin-right: .55rem;
  color: #aab2c2;
}

.comments-section .comment-replies {
  margin: .8rem 0 0 1rem;
  padding-left: 1rem;
  border-left: 3px solid #e4e8f1;
}

.comments-section .comment-replies .reader-comment {
  padding: .65rem 0 .7rem;
  border-bottom: 0;
}

.comments-section .comment-replies .reader-comment + .reader-comment {
  border-top: 1px solid #edf0f6;
}

.comments-section .comment-reply-form {
  margin: .75rem 0 .35rem;
}

.comments-section .comment-new-form {
  margin-top: .75rem;
}

.comments-section .comment-add-toggle {
  margin-top: .4rem;
}


/* Comment scroll and cleaner reaction controls. */
.comments-section .comment-help {
  margin: .25rem 0 1rem;
  color: #687084;
  font-family: var(--sans-font, Arial, sans-serif);
  font-size: .92rem;
  font-weight: 700;
  line-height: 1.45;
}

.comments-section .comment-scroll {
  max-height: 34rem;
  overflow-y: auto;
  overscroll-behavior: contain;
  padding-right: .75rem;
  margin: 1rem 0 1.4rem;
  scrollbar-gutter: stable;
}

.comments-section .comment-scroll .comment-list {
  margin: 0;
}

.comments-section .comment-reaction-action {
  display: inline-flex;
  align-items: center;
  gap: .22rem;
  padding: .08rem .24rem;
  border-radius: 999px;
}

.comments-section .comment-reaction-action:hover,
.comments-section .comment-reaction-form button.comment-reaction-action:hover {
  background: #f0f3f8;
  text-decoration: none;
}

.comments-section .comment-reaction-icon {
  font-size: 1.08rem;
  line-height: 1;
}

.comments-section .comment-reaction-count {
  color: #4f5b72;
  font-size: .82rem;
  font-weight: 900;
  line-height: 1;
}

.sr-only {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

@media (max-width: 640px) {
  .comments-section .comment-scroll {
    max-height: 28rem;
    padding-right: .35rem;
  }
}

/* Header repair: keep the masthead logo constrained after article/comment image CSS overrides. */
.site-header {
  position: relative;
  z-index: 50;
}

.site-header .network-bar,
.site-header .masthead,
.site-header .trend-bar {
  position: relative;
  z-index: 1;
}

.site-header .masthead-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1.25rem;
  min-width: 0;
}

.site-header .brand {
  display: inline-flex;
  align-items: center;
  gap: .8rem;
  min-width: 0;
  flex: 1 1 auto;
  text-decoration: none;
  overflow: visible;
}

.site-header .brand-box {
  width: 76px;
  height: 58px;
  flex: 0 0 76px;
  overflow: hidden;
  position: relative;
}

.site-header .brand-logo-box {
  width: 96px;
  height: 96px;
  flex: 0 0 96px;
  overflow: hidden;
  position: relative;
  z-index: 5;
  margin-bottom: -34px;
  display: grid;
  place-items: center;
  padding: 4px;
  background: #fff;
  border: 3px solid rgba(255,255,255,.78);
  box-shadow: inset 0 0 0 3px var(--navy), 0 6px 14px rgba(0,0,0,.22);
}

.site-header .brand-logo,
.site-header .brand-logo-box img,
.site-header .brand-box img {
  position: static !important;
  inset: auto !important;
  display: block;
  width: 100% !important;
  height: 100% !important;
  max-width: 100% !important;
  max-height: 100% !important;
  object-fit: contain !important;
  object-position: center center !important;
}

.site-header .brand-text {
  display: block;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  min-width: 0;
}

.site-header .main-nav {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: nowrap;
  white-space: nowrap;
}

.site-header .main-nav a {
  flex: 0 0 auto;
}

.mobile-menu-toggle {
  display: none;
  border: 0;
  background: rgba(255,255,255,.12);
  color: #fff;
  width: 42px;
  height: 38px;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}

.hamburger,
.hamburger::before,
.hamburger::after {
  display: block;
  width: 20px;
  height: 2px;
  background: currentColor;
  content: "";
  position: relative;
}

.hamburger::before { position: absolute; top: -6px; left: 0; }
.hamburger::after { position: absolute; top: 6px; left: 0; }

@media (max-width: 900px) {
  .site-header .masthead-inner {
    gap: .75rem;
  }

  .site-header .brand-logo-box {
    width: 72px;
    height: 72px;
    flex-basis: 72px;
    margin-bottom: -22px;
  }

  .site-header .brand-text {
    font-size: clamp(1.35rem, 7vw, 2.25rem);
  }

  .mobile-menu-toggle {
    display: inline-flex;
  }

  .site-header .main-nav {
    display: none;
    position: absolute;
    right: 1rem;
    top: calc(100% + .35rem);
    z-index: 20;
    min-width: 190px;
    flex-direction: column;
    align-items: stretch;
    background: var(--navy);
    border: 1px solid rgba(255,255,255,.22);
    box-shadow: var(--shadow);
    padding: .35rem;
  }

  .site-header .main-nav.is-open,
  .site-header .main-nav.open {
    display: flex;
  }

  .site-header .main-nav a {
    padding: .75rem .85rem;
  }
}

@media (max-width: 560px) {
  .site-header .brand-logo-box {
    width: 60px;
    height: 60px;
    flex-basis: 60px;
    margin-bottom: -16px;
  }

  .site-header .brand-text {
    font-size: clamp(1.15rem, 8vw, 1.75rem);
    letter-spacing: -.05em;
  }
}

/* Header logo overlap repair: keep logo sized but let it hang over the white menu row. */
.site-header,
.site-header .network-bar,
.site-header .masthead,
.site-header .masthead-inner,
.site-header .trend-bar,
.site-header .trend-inner {
  overflow: visible !important;
}

.site-header .masthead {
  position: relative;
  z-index: 5;
  min-height: 72px;
}

.site-header .masthead-inner {
  min-height: 72px;
  align-items: center;
}

.site-header .brand {
  position: relative;
  z-index: 10;
  align-self: stretch;
  align-items: center;
}

.site-header .brand-logo-box {
  width: 96px !important;
  height: 96px !important;
  flex: 0 0 96px !important;
  margin-top: 0 !important;
  margin-bottom: -34px !important;
  position: relative !important;
  z-index: 30 !important;
  overflow: hidden !important;
  align-self: center;
}

.site-header .brand-logo,
.site-header .brand-logo-box img {
  width: 100% !important;
  height: 100% !important;
  max-width: 100% !important;
  max-height: 100% !important;
  object-fit: contain !important;
  object-position: center center !important;
}

.site-header .brand-text,
.site-header .main-nav {
  position: relative;
  z-index: 12;
}

.site-header .trend-bar {
  position: relative;
  z-index: 1;
}

@media (max-width: 900px) {
  .site-header .brand-logo-box {
    width: 72px !important;
    height: 72px !important;
    flex-basis: 72px !important;
    margin-bottom: -22px !important;
  }
}

@media (max-width: 560px) {
  .site-header .brand-logo-box {
    width: 60px !important;
    height: 60px !important;
    flex-basis: 60px !important;
    margin-bottom: -16px !important;
  }
}

/* Header logo/menu spacing repair: logo may hang over the menu row, but must not cover menu links. */
@media (min-width: 901px) {
  .site-header .baboon-masthead + .trend-bar .trend-inner {
    padding-left: 112px !important;
  }

  .site-header .baboon-masthead + .trend-bar .trend-inner strong:first-child {
    margin-left: 0 !important;
  }
}

@media (max-width: 900px) {
  .site-header .baboon-masthead + .trend-bar .trend-inner {
    padding-left: 0 !important;
  }
}

/* Comment UI repair: restore compact inline actions after later CSS overrides. */
.comments-section .comment-list {
  display: block;
  max-height: min(620px, 72vh);
  overflow-y: auto;
  padding-right: .5rem;
  margin: 1rem 0 1.4rem;
  scrollbar-gutter: stable;
}

.comments-section .reader-comment,
.comments-section .reply-comment {
  display: block !important;
  border: 0 !important;
  border-bottom: 1px solid #e0e5ef !important;
  background: transparent !important;
  box-shadow: none !important;
  padding: .85rem 0 1rem !important;
  margin: 0 !important;
}

.comments-section .reader-comment:last-child,
.comments-section .reply-comment:last-child {
  border-bottom: 0 !important;
}

.comments-section .comment-head {
  display: flex !important;
  flex-wrap: wrap;
  align-items: baseline;
  gap: .35rem .65rem;
  margin-bottom: .25rem;
}

.comments-section .comment-body {
  margin: 0 0 .45rem !important;
  line-height: 1.55;
}

.comments-section .comment-actions {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: wrap;
  align-items: center;
  gap: .3rem .7rem !important;
  margin-top: .3rem;
}

.comments-section .comment-reaction-form {
  display: inline-flex !important;
  margin: 0 !important;
  padding: 0 !important;
}

.comments-section .comment-action,
.comments-section button.comment-action,
.comments-section .comment-reaction-form button.comment-action,
.comments-section a.comment-action {
  appearance: none !important;
  -webkit-appearance: none !important;
  display: inline-flex !important;
  flex: 0 0 auto !important;
  width: auto !important;
  min-width: 0 !important;
  min-height: 0 !important;
  height: auto !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: .25rem !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: #9d4f2d !important;
  font-family: var(--sans-font, Arial, sans-serif) !important;
  font-size: .78rem !important;
  font-weight: 900 !important;
  line-height: 1.1 !important;
  letter-spacing: .03em !important;
  text-transform: uppercase !important;
  text-decoration: none !important;
  cursor: pointer;
}

.comments-section .comment-action:hover,
.comments-section button.comment-action:hover,
.comments-section .comment-reaction-form button.comment-action:hover,
.comments-section a.comment-action:hover {
  color: #b35a36 !important;
  text-decoration: underline !important;
  background: transparent !important;
}

.comments-section .comment-reaction-action,
.comments-section button.comment-reaction-action,
.comments-section a.comment-reaction-action {
  color: #121a46 !important;
  font-size: .9rem !important;
  text-decoration: none !important;
}

.comments-section .comment-reaction-icon {
  display: inline-block !important;
  font-size: 1.1rem !important;
  line-height: 1 !important;
  transform: translateY(.04rem);
}

.comments-section .comment-reaction-count {
  display: inline-block !important;
  color: #687084 !important;
  font-size: .82rem !important;
  font-weight: 900 !important;
  line-height: 1 !important;
}

.comments-section .comment-replies {
  display: block !important;
  margin: .85rem 0 0 1rem !important;
  padding-left: 1rem !important;
  border-left: 3px solid #e4e8f1 !important;
  background: transparent !important;
}

.comments-section .comment-reply-form,
.comments-section .comment-new-form,
.comments-section .comment-login-card {
  margin-top: .85rem !important;
  padding: 1rem !important;
  border: 1px solid #d8deea !important;
  background: #f8f9fc !important;
  box-shadow: none !important;
}

.comments-section .comment-add-toggle,
.comments-section .comment-form-actions button[type="submit"] {
  display: inline-flex !important;
  width: auto !important;
  padding: .75rem 1rem !important;
  border: 0 !important;
  background: #a64f2e !important;
  color: #fff !important;
  border-radius: 2px !important;
  font-family: var(--sans-font, Arial, sans-serif) !important;
  font-weight: 900 !important;
  letter-spacing: .02em !important;
  text-transform: uppercase !important;
}

@media (max-width: 640px) {
  .comments-section .comment-list {
    max-height: 70vh;
    padding-right: .25rem;
  }

  .comments-section .comment-replies {
    margin-left: .35rem !important;
    padding-left: .75rem !important;
  }
}

/* Comment modal restore: no nested scrollbars, modal forms only. */
.comments-section .comment-scroll,
.comments-section .comment-list {
  max-height: none !important;
  height: auto !important;
  overflow: visible !important;
  padding-right: 0 !important;
  margin: 1rem 0 1.4rem !important;
  scrollbar-gutter: auto !important;
}

.comments-section .comment-new-form,
.comments-section .comment-reply-form {
  display: none !important;
}

.comments-section .comment-modal[hidden] {
  display: none !important;
}

.comment-modal {
  position: fixed;
  inset: 0;
  z-index: 5000;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1.25rem;
}

.comment-modal-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(10, 14, 32, .72);
  backdrop-filter: blur(3px);
}

.comment-modal-card {
  position: relative;
  z-index: 1;
  width: min(620px, calc(100vw - 2rem));
  max-height: calc(100vh - 2rem);
  overflow-y: auto;
  padding: 1.3rem;
  border: 1px solid #d8deea;
  background: #fff;
  box-shadow: 0 28px 80px rgba(10, 14, 32, .35);
}

.comment-modal-card h3 {
  margin: 0 2.5rem .65rem 0;
  color: #121a46;
  font-family: var(--sans-font, Arial, sans-serif);
  font-size: 1.25rem;
  font-weight: 900;
}

.comment-modal-close {
  position: absolute;
  top: .75rem;
  right: .75rem;
  width: 2rem;
  height: 2rem;
  border: 0;
  background: #a64f2e;
  color: #fff;
  font-size: 1.35rem;
  font-weight: 900;
  line-height: 1;
  cursor: pointer;
}

.comment-modal .comment-form {
  margin-top: .85rem;
}

.comment-modal .comment-form textarea {
  width: 100%;
  min-height: 150px;
  box-sizing: border-box;
}

body.comment-modal-open {
  overflow: hidden;
}

@media (max-width: 640px) {
  .comment-modal {
    align-items: flex-start;
    padding: .8rem;
  }

  .comment-modal-card {
    width: 100%;
    max-height: calc(100vh - 1.6rem);
    padding: 1rem;
  }
}

.membership-grid { align-items: stretch; }
.membership-offer-card h2 { margin-top: .55rem; color: var(--navy); font-size: clamp(1.8rem, 4vw, 2.6rem); line-height: 1; }
.membership-offer-card form { margin-top: 1rem; }
.founder-credit-callout { margin: 1rem 0 1.15rem; padding: 1rem 1.15rem; border: 2px solid var(--copper); border-left-width: 8px; background: #fff8f2; box-shadow: 0 12px 24px rgba(7, 19, 62, .08); }
.founder-credit-amount { color: var(--navy); font-size: clamp(1.5rem, 4vw, 2.2rem); font-weight: 1000; line-height: 1; text-transform: uppercase; }
.founder-credit-copy { margin-top: .45rem; color: var(--ink); font-weight: 800; line-height: 1.45; }
.founder-credit-copy strong { color: var(--copper-dark); }
.membership-confirmed,
.membership-badge-line { color: var(--navy); font-weight: 900; }
.membership-note { margin-top: .8rem; color: var(--muted); font-weight: 800; }

.reporter-profile-card {
  margin-top: 1.25rem;
}

.reporter-profile-card textarea {
  width: 100%;
  box-sizing: border-box;
  border: 1px solid #cfd6e3;
  padding: .7rem .75rem;
  font: inherit;
  resize: vertical;
}

.reporter-link-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .85rem;
}

@media (max-width: 800px) {
  .reporter-link-grid { grid-template-columns: 1fr; }
}

/* Compact account summary + tabs for profile/reporter profile. */
.account-summary-line {
  margin-bottom: .65rem;
}

.account-membership-summary-card {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: .85rem 1rem;
  border: 1px solid #d8deea;
  background: #fbfcff;
  margin: .65rem 0 .85rem;
}

.account-membership-summary-copy p {
  margin: .3rem 0 0;
}

.account-membership-summary-actions {
  justify-content: flex-end;
  flex-wrap: wrap;
  margin: 0;
}

.account-tabs-shell {
  margin-top: .5rem;
}

.account-tab-radio {
  position: absolute;
  left: -9999px;
  width: 1px;
  height: 1px;
  overflow: hidden;
}

.account-tabs-nav {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem;
  margin: .25rem 0 0;
  border-bottom: 2px solid #d8deea;
}

.account-tab-label {
  display: inline-flex;
  align-items: center;
  min-height: 38px;
  padding: 0 .95rem;
  border: 1px solid #d8deea;
  border-bottom: 0;
  background: #f7f8fb;
  color: var(--navy);
  cursor: pointer;
  font-weight: 1000;
  text-transform: uppercase;
  letter-spacing: .025em;
  font-size: .78rem;
}

.account-tab-label:hover {
  background: #fff;
}

.account-tab-panels {
  border: 1px solid #d8deea;
  border-top: 0;
  background: #fff;
  padding: 1rem;
}

.account-tab-panel {
  display: none;
}

#account-tab-profile:checked ~ .account-tabs-nav .account-tab-profile-label,
#account-tab-reporter:checked ~ .account-tabs-nav .account-tab-reporter-label {
  background: #fff;
  color: #a34d2f;
  border-color: #d8deea;
  box-shadow: inset 0 3px 0 #a34d2f;
}

#account-tab-profile:checked ~ .account-tab-panels .account-tab-profile-panel,
#account-tab-reporter:checked ~ .account-tab-panels .account-tab-reporter-panel {
  display: block;
}

.account-section-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
}

.compact-section-head {
  margin-bottom: .75rem;
}

.compact-section-head h2 {
  margin: .35rem 0 .2rem;
}

.account-compact-grid {
  display: grid;
  grid-template-columns: minmax(280px, 1fr) minmax(260px, .9fr);
  gap: 1rem;
  align-items: end;
}

.account-email-pref {
  align-self: center;
  margin-top: 1.35rem;
}

.account-compact-form button,
.reporter-profile-compact button {
  flex: 0 0 auto;
}

.compact-actions {
  align-items: flex-end;
  min-width: 210px;
}

.reporter-profile-card.reporter-profile-compact {
  margin-top: 0;
}

.compact-note {
  margin: -.15rem 0 .75rem;
}

.reporter-compact-grid {
  display: grid;
  grid-template-columns: minmax(260px, .95fr) minmax(320px, 1.2fr);
  gap: .75rem 1rem;
  align-items: start;
}

.reporter-compact-grid label {
  min-width: 0;
}

.reporter-compact-grid label:nth-child(2) {
  grid-row: span 2;
}

.reporter-compact-grid textarea {
  min-height: 7.15rem;
}

@media (max-width: 860px) {
  .account-tab-panels { padding: .85rem; }
  .account-section-head,
  .account-membership-summary-card { display: grid; }
  .account-compact-grid,
  .reporter-compact-grid { grid-template-columns: 1fr; }
  .reporter-compact-grid label:nth-child(2) { grid-row: auto; }
  .compact-actions { align-items: flex-start; min-width: 0; }
  .account-membership-summary-actions { justify-content: flex-start; }
}

/* Tighter logged-in account dashboard layout. */
.account-dashboard-panel {
  padding-top: 1.15rem;
  padding-bottom: 1.25rem;
}

.account-dashboard-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: .45rem;
}

.account-dashboard-top .story-flag {
  margin-bottom: .25rem;
}

.account-dashboard-top .account-summary-line {
  margin: 0;
  font-size: 1rem;
}

.account-dashboard-panel .account-membership-summary-card {
  margin-top: .4rem;
  margin-bottom: .65rem;
  padding: .65rem .85rem;
}

.account-dashboard-panel .account-membership-summary-copy .story-flag {
  margin-bottom: .2rem;
}

.account-dashboard-panel .account-membership-summary-copy p {
  margin: .18rem 0 0;
}

.account-dashboard-panel .account-tabs-shell {
  margin-top: .35rem;
}

.account-dashboard-panel .account-tabs-nav {
  margin-top: 0;
}

.account-dashboard-panel .account-tab-label {
  min-height: 34px;
  padding: 0 .85rem;
}

.account-dashboard-panel .account-tab-panels {
  padding: .75rem .85rem;
}

.account-dashboard-panel .compact-section-head {
  margin-bottom: .45rem;
}

.account-dashboard-panel .compact-section-head h2 {
  margin: .2rem 0 0;
}

.account-dashboard-panel .compact-note {
  margin: -.05rem 0 .55rem;
}

.account-dashboard-panel .reporter-compact-grid {
  gap: .55rem .8rem;
}

.account-dashboard-panel .reporter-compact-grid textarea {
  min-height: 5.85rem;
}

@media (max-width: 860px) {
  .account-dashboard-top,
  .account-dashboard-panel .account-membership-summary-card {
    display: grid;
  }
}

/* Account compact polish: less red, signed-in status on the right, save actions below forms. */
.account-blue-flag {
  background: var(--navy);
  color: #fff;
}

.account-blue-button,
.account-form button.account-blue-button,
a.button.account-blue-button {
  background: var(--navy);
  border-color: var(--navy);
  color: #fff;
}

.account-blue-button:hover,
.account-form button.account-blue-button:hover,
a.button.account-blue-button:hover {
  filter: brightness(1.08);
}

.account-form-actions {
  display: flex;
  justify-content: flex-start;
  margin-top: .65rem;
}

.account-dashboard-top {
  align-items: flex-start;
}

.account-dashboard-top .account-summary-line {
  margin-left: auto;
  text-align: right;
}

.account-dashboard-panel .account-tabs-shell {
  margin-top: .3rem;
}

.account-dashboard-panel .account-tab-panels {
  padding-bottom: .8rem;
}

.account-dashboard-panel .compact-section-head {
  margin-bottom: .35rem;
}

.account-dashboard-panel .account-compact-grid,
.account-dashboard-panel .reporter-compact-grid {
  margin-top: .15rem;
}

@media (max-width: 860px) {
  .account-dashboard-top .account-summary-line {
    margin-left: 0;
    text-align: left;
  }
}

/* Professional account dashboard polish: fewer nested boxes, save buttons only blue. */
.account-dashboard-panel {
  max-width: 980px;
  padding: 1rem 1.15rem 1.05rem;
}

.account-dashboard-top {
  display: grid;
  grid-template-columns: auto 1fr;
  align-items: center;
  gap: .75rem 1rem;
  margin-bottom: .65rem;
}

.account-dashboard-top .account-summary-line {
  justify-self: end;
  margin: 0;
  color: #596274;
  font-size: .95rem;
}

.account-dashboard-panel .account-membership-summary-card {
  border: 1px solid #dce2ee;
  background: linear-gradient(180deg, #ffffff, #f8faff);
  box-shadow: 0 1px 0 rgba(7,27,77,.04);
  padding: .75rem .8rem;
  margin: 0 0 .7rem;
}

.account-dashboard-panel .account-membership-summary-copy p {
  margin: .16rem 0 0;
  line-height: 1.35;
}

.account-dashboard-panel .account-membership-summary-actions {
  gap: .35rem;
}

.account-dashboard-panel .account-membership-summary-actions .button,
.account-dashboard-panel .account-membership-summary-actions button {
  min-height: 38px;
  padding: .58rem .82rem;
}

.account-dashboard-panel .account-membership-summary-actions .button:not(.secondary) {
  background: var(--red);
  border-color: var(--red);
  color: #fff;
}

.account-dashboard-panel .account-membership-summary-actions .button:not(.secondary):hover {
  background: var(--red-dark);
}

.account-tabs-shell {
  margin-top: .55rem;
}

.account-tabs-nav {
  border-bottom: 1px solid #dce2ee;
  gap: 0;
  margin-bottom: 0;
}

.account-tab-label {
  min-height: 34px;
  padding: 0 .9rem;
  border: 1px solid transparent;
  border-bottom: 0;
  background: transparent;
  color: #34405a;
  font-size: .76rem;
}

.account-tab-label:hover {
  background: #f8faff;
}

#account-tab-profile:checked ~ .account-tabs-nav .account-tab-profile-label,
#account-tab-reporter:checked ~ .account-tabs-nav .account-tab-reporter-label {
  background: #fff;
  color: var(--navy);
  border-color: #dce2ee;
  box-shadow: inset 0 3px 0 var(--red);
}

.account-tab-panels {
  border: 1px solid #dce2ee;
  border-top: 0;
  background: #fff;
  padding: .85rem .9rem .9rem;
}

.account-dashboard-panel .compact-section-head {
  margin-bottom: .3rem;
}

.account-dashboard-panel .compact-section-head h2 {
  font-size: 1.55rem;
  margin: .18rem 0 0;
}

.account-dashboard-panel .account-compact-grid,
.account-dashboard-panel .reporter-compact-grid {
  gap: .65rem .9rem;
}

.account-dashboard-panel label {
  margin-bottom: .45rem;
}

.account-dashboard-panel input[type="text"],
.account-dashboard-panel input[type="url"],
.account-dashboard-panel input[type="email"],
.account-dashboard-panel textarea {
  border: 1px solid #cfd7e6;
  background: #fff;
  box-shadow: inset 0 1px 0 rgba(7,27,77,.03);
}

.account-dashboard-panel input:focus,
.account-dashboard-panel textarea:focus {
  outline: 2px solid rgba(15,44,112,.16);
  border-color: #9caad0;
}

.account-form-actions {
  margin-top: .55rem;
}

.account-save-button,
.account-form button.account-save-button {
  background: var(--navy);
  border-color: var(--navy);
  color: #fff;
}

.account-save-button:hover,
.account-form button.account-save-button:hover {
  background: var(--navy-2);
}

/* Keep only the badges blue; do not make navigation/action CTAs blue. */
.account-blue-flag {
  background: var(--navy);
  color: #fff;
}

.account-dashboard-panel .reporter-compact-grid textarea {
  min-height: 5.1rem;
}

@media (max-width: 860px) {
  .account-dashboard-top {
    grid-template-columns: 1fr;
  }

  .account-dashboard-top .account-summary-line {
    justify-self: start;
    text-align: left;
  }

  .account-dashboard-panel .account-membership-summary-card {
    display: grid;
  }

  .account-dashboard-panel .account-membership-summary-actions {
    justify-content: flex-start;
  }
}

/* Account tab simplification: reporter profile already has its own tab.
   Keep both tab states visually stable so the card does not jump in height. */
.account-dashboard-panel .account-membership-summary-actions {
  margin-left: auto;
}

.account-dashboard-panel .account-tab-panels {
  min-height: 300px;
}

.account-dashboard-panel .account-tab-panel {
  min-height: 270px;
}

@media (max-width: 860px) {
  .account-dashboard-panel .account-tab-panels,
  .account-dashboard-panel .account-tab-panel {
    min-height: 0;
  }
}

/* Account tab height and spacing fix: keep desktop tabs stable and add breathing room after membership. */
.account-dashboard-panel .account-membership-summary-card {
  margin-bottom: 1rem;
}

.account-dashboard-panel .account-tabs-shell {
  margin-top: .85rem;
}

.account-dashboard-panel .account-tab-panels {
  min-height: 390px;
}

.account-dashboard-panel .account-tab-panel {
  min-height: 360px;
}

@media (max-width: 860px) {
  .account-dashboard-panel .account-membership-summary-card {
    margin-bottom: .75rem;
  }

  .account-dashboard-panel .account-tabs-shell {
    margin-top: .55rem;
  }

  .account-dashboard-panel .account-tab-panels,
  .account-dashboard-panel .account-tab-panel {
    min-height: 0;
  }
}

/* Account tab stability final pass: force equal desktop panel height and add real breathing room above tabs. */
.account-dashboard-panel .account-tabs-shell {
  margin-top: 1.35rem !important;
}

.account-dashboard-panel .account-tabs-nav {
  margin-top: 0 !important;
}

.account-dashboard-panel .account-tab-panels {
  height: 390px !important;
  min-height: 390px !important;
  box-sizing: border-box;
}

.account-dashboard-panel .account-tab-panel {
  min-height: 350px !important;
}

@media (max-width: 860px) {
  .account-dashboard-panel .account-tabs-shell {
    margin-top: .85rem !important;
  }

  .account-dashboard-panel .account-tab-panels {
    height: auto !important;
    min-height: 0 !important;
  }

  .account-dashboard-panel .account-tab-panel {
    min-height: 0 !important;
  }
}

/* Account tab height match: make the shorter tab reserve the taller tab height,
   keep action buttons inside the panel border, and add clearer space after membership. */
.account-dashboard-panel .account-tabs-shell {
  margin-top: 1.75rem !important;
}

.account-dashboard-panel .account-tab-panels {
  height: 435px !important;
  min-height: 435px !important;
  padding: .85rem .9rem 1.05rem !important;
  overflow: hidden;
  box-sizing: border-box;
}

.account-dashboard-panel .account-tab-panel {
  min-height: 405px !important;
  height: 100%;
  box-sizing: border-box;
}

#account-tab-profile:checked ~ .account-tab-panels .account-tab-profile-panel,
#account-tab-reporter:checked ~ .account-tab-panels .account-tab-reporter-panel {
  display: block;
}

.account-dashboard-panel .account-tab-panel .account-form {
  min-height: 100%;
  box-sizing: border-box;
}

.account-dashboard-panel .account-form-actions {
  margin-top: .75rem;
}

@media (max-width: 860px) {
  .account-dashboard-panel .account-tabs-shell {
    margin-top: 1rem !important;
  }

  .account-dashboard-panel .account-tab-panels,
  .account-dashboard-panel .account-tab-panel {
    height: auto !important;
    min-height: 0 !important;
    overflow: visible;
  }

  .account-dashboard-panel .account-tab-panel .account-form {
    min-height: 0;
  }
}

/* Account form typography: keep the theme boldness on labels/buttons,
   but make text inside form controls easier to read. Scoped to account dashboard only. */
.account-dashboard-panel .account-form input[type="text"],
.account-dashboard-panel .account-form input[type="email"],
.account-dashboard-panel .account-form input[type="url"],
.account-dashboard-panel .account-form input[type="password"],
.account-dashboard-panel .account-form textarea,
.account-dashboard-panel .account-form select {
  font-family: Arial, Helvetica, sans-serif;
  font-weight: 500;
  letter-spacing: normal;
  color: #111827;
}

.account-dashboard-panel .account-form input::placeholder,
.account-dashboard-panel .account-form textarea::placeholder {
  font-family: Arial, Helvetica, sans-serif;
  font-weight: 500;
  letter-spacing: normal;
  color: #6b7280;
  opacity: 1;
}

.account-dashboard-panel .account-form label {
  font-weight: 800;
}

/* Founding Baboon Reporter badge */
.founding-badge {
  display: inline-flex;
  align-items: center;
  gap: .34rem;
  vertical-align: middle;
  width: max-content;
  max-width: 100%;
  border: 1px solid rgba(171, 87, 45, .42);
  border-radius: 999px;
  background: linear-gradient(180deg, #fff8ee 0%, #f6e6d2 100%);
  color: #17204d;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .9), 0 1px 2px rgba(10, 16, 38, .08);
  font-family: var(--font-display, inherit);
  font-weight: 900;
  letter-spacing: .04em;
  text-transform: uppercase;
  white-space: nowrap;
}

.founding-badge-mark {
  display: inline-grid;
  place-items: center;
  width: 1.28em;
  height: 1.28em;
  border-radius: 999px;
  background: #17204d;
  color: #f6a04d;
  font-size: .82em;
  line-height: 1;
}

.founding-badge-inline {
  margin-left: .35rem;
  padding: .18rem .55rem .18rem .2rem;
  font-size: .68rem;
}

.founding-badge-heading {
  margin-left: .5rem;
  padding: .2rem .58rem .2rem .22rem;
  font-size: .64rem;
  transform: translateY(-.08rem);
}

.founding-badge-mini {
  padding: .14rem .46rem .14rem .16rem;
  font-size: .58rem;
  letter-spacing: .035em;
}

.comment-author-line {
  display: inline-flex;
  align-items: center;
  flex-wrap: wrap;
  gap: .42rem;
  min-width: 0;
}

.account-membership-summary-copy .founding-badge-inline {
  position: relative;
  top: -.02rem;
}

@media (max-width: 640px) {
  .founding-badge-heading {
    display: inline-flex;
    margin-left: 0;
    margin-top: .35rem;
  }

  .founding-badge-inline {
    margin-left: 0;
    margin-top: .25rem;
  }
}

/* Account badge button uncut fix: use equal minimum height instead of clipping fixed height. */
.account-dashboard-panel .account-tabs-shell {
  margin-top: 1.85rem !important;
}

.account-dashboard-panel .account-tab-panels {
  height: auto !important;
  min-height: 460px !important;
  padding: .9rem .9rem 1.35rem !important;
  overflow: visible !important;
  box-sizing: border-box;
}

.account-dashboard-panel .account-tab-panel {
  min-height: 425px !important;
  height: auto !important;
  overflow: visible !important;
  box-sizing: border-box;
}

.account-dashboard-panel .account-tab-panel .account-form {
  min-height: 0 !important;
}

.account-dashboard-panel .account-form-actions {
  margin-top: .95rem !important;
  margin-bottom: 0 !important;
}

@media (max-width: 860px) {
  .account-dashboard-panel .account-tabs-shell {
    margin-top: 1rem !important;
  }

  .account-dashboard-panel .account-tab-panels,
  .account-dashboard-panel .account-tab-panel {
    min-height: 0 !important;
  }
}

/* Account width fix: let the account dashboard use the same centered page width as the home page. */
.account-dashboard-panel {
  width: 100% !important;
  max-width: none !important;
}

/* Reporter story submissions */
#account-tab-stories:checked ~ .account-tabs-nav .account-tab-stories-label {
  background: #151b4b;
  color: #fff;
  border-color: #151b4b;
}

#account-tab-stories:checked ~ .account-tab-panels .account-tab-stories-panel {
  display: block;
}

.reporter-submissions-head {
  align-items: center;
  gap: 1rem;
}

.reporter-submissions-head .button {
  flex: 0 0 auto;
}

.reporter-submission-list {
  display: grid;
  gap: .65rem;
  margin-top: .8rem;
}

.reporter-submission-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: .75rem .85rem;
  border: 1px solid #dbe1ee;
  background: #f8fafc;
  border-radius: 8px;
}

.reporter-submission-row strong {
  display: block;
  color: #101735;
  font-weight: 900;
}

.reporter-submission-row p {
  margin: .25rem 0 0;
  color: #4b5563;
  font-size: .92rem;
}

.reporter-submission-row small {
  display: block;
  margin-top: .2rem;
  color: #687086;
  font-weight: 700;
}

.account-page-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .75rem;
  margin-bottom: 1rem;
}

.reporter-story-form {
  width: 100%;
}

.reporter-story-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: .85rem 1rem;
  margin-top: .8rem;
}

.reporter-story-wide {
  grid-column: 1 / -1;
}

.reporter-story-form textarea[name="body"] {
  min-height: 260px;
  resize: vertical;
}

.reporter-story-image-field {
  display: grid;
  gap: .45rem;
}

.reporter-story-image-field input[type="file"] {
  width: 100%;
  min-height: 44px;
  padding: .65rem .75rem;
  border: 1px solid #d6dbe6;
  background: #fff;
  color: #101735;
  font-weight: 500;
}

.reporter-image-preview {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 152px;
  border: 1px dashed #b9c2d5;
  background: #f8fafc;
  color: #687086;
  overflow: hidden;
}

.reporter-image-preview img {
  display: block;
  width: 100%;
  max-height: 240px;
  object-fit: contain;
  background: #fff;
}

.reporter-image-preview span {
  padding: 1rem;
  font-weight: 700;
  text-align: center;
}

.image-upload-note {
  margin: 0;
  font-size: .82rem;
}

.reporter-story-actions {
  justify-content: flex-end;
  gap: .7rem;
  margin-top: 1rem;
}

.reporter-story-actions button[disabled] {
  opacity: .55;
  cursor: not-allowed;
}

.admin-submission-meta {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .6rem;
  margin: .75rem 0;
}

.admin-submission-meta-card {
  padding: .65rem;
  border: 1px solid #dbe1ee;
  background: #f8fafc;
  border-radius: 8px;
}

.admin-submission-meta-card span {
  display: block;
  color: #687086;
  font-size: .72rem;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: .04em;
}

.admin-submission-meta-card strong {
  color: #101735;
}

@media (max-width: 760px) {
  .reporter-submission-row,
  .account-page-actions {
    align-items: flex-start;
    flex-direction: column;
  }

  .reporter-story-grid,
  .admin-submission-meta {
    grid-template-columns: 1fr;
  }
}

/* Reporter story editor polish: scoped form typography + rich text surface.
   Keeps the lighter field text limited to reporter story forms. */
.reporter-story-form input[type="text"],
.reporter-story-form input[type="url"],
.reporter-story-form input[type="email"],
.reporter-story-form input[type="file"],
.reporter-story-form textarea,
.reporter-story-form select,
.reporter-story-form .richtext-surface {
  font-family: Arial, Helvetica, sans-serif;
  font-weight: 500;
  letter-spacing: normal;
}

.reporter-story-form input::placeholder,
.reporter-story-form textarea::placeholder,
.reporter-story-form .richtext-surface:empty::before {
  color: #6b7280;
  font-weight: 500;
}

.reporter-story-form label,
.reporter-story-form .richtext-label {
  font-weight: 800;
}

.reporter-story-body-field {
  display: block;
}

.reporter-story-form .reporter-richtext-editor {
  border-color: #d6dbe6;
  box-shadow: inset 0 1px 0 rgba(15, 23, 42, .02);
}

.reporter-story-form .richtext-toolbar {
  position: static;
  top: auto;
  gap: .35rem;
  padding: .45rem .55rem;
}

.reporter-story-form .richtext-toolbar button {
  min-height: 28px;
  padding: .28rem .5rem;
  font-size: .76rem;
}

.reporter-story-form .reporter-richtext-surface {
  min-height: 310px;
  max-height: 52vh;
  overflow-y: auto;
  padding: .8rem .9rem;
  color: #111827;
  font-size: .98rem;
  font-weight: 400;
  line-height: 1.55;
}

.reporter-story-form .reporter-richtext-surface:focus {
  box-shadow: inset 0 0 0 3px rgba(21, 27, 75, .12);
}

.reporter-story-form .reporter-richtext-surface p,
.reporter-story-form .reporter-richtext-surface div,
.reporter-story-form .reporter-richtext-surface li {
  font-weight: 400;
}

.reporter-story-form .reporter-richtext-surface strong,
.reporter-story-form .reporter-richtext-surface b {
  font-weight: 800;
}

.reporter-story-form .reporter-richtext-surface h1,
.reporter-story-form .reporter-richtext-surface h2,
.reporter-story-form .reporter-richtext-surface h3,
.reporter-story-form .reporter-richtext-surface h4,
.reporter-story-form .reporter-richtext-surface h5,
.reporter-story-form .reporter-richtext-surface h6 {
  margin: .9rem 0 .45rem;
  color: #151b4b;
  font-family: Arial, Helvetica, sans-serif;
  font-weight: 900;
  line-height: 1.18;
}

.reporter-story-form .reporter-richtext-surface h2 { font-size: 1.35rem; }
.reporter-story-form .reporter-richtext-surface h3 { font-size: 1.15rem; }

.reporter-story-form .reporter-richtext-surface ul,
.reporter-story-form .reporter-richtext-surface ol {
  margin: 0 0 .9rem 1.3rem;
  padding: 0;
}

.reporter-story-form .reporter-richtext-surface blockquote {
  margin: .85rem 0;
  padding: .55rem .8rem;
  border-left: 4px solid #a64f2e;
  background: #f8fafc;
  color: #374151;
}

/* Admin reporter submission review polish */
.admin-review-head {
  align-items: flex-start;
  gap: 1rem;
}

.admin-review-subtitle {
  margin: .25rem 0 0;
  color: #687086;
  font-weight: 700;
}

.admin-review-head-actions {
  display: flex;
  gap: .5rem;
  flex-wrap: wrap;
  justify-content: flex-end;
}

.admin-review-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 360px;
  gap: 1rem;
  align-items: start;
}

.admin-review-submission-card,
.admin-review-decision-card {
  border: 1px solid #dbe1ee;
  background: #fff;
  border-radius: 10px;
  padding: 1rem;
  box-shadow: 0 14px 35px rgba(15, 23, 42, .06);
}

.admin-review-decision-card {
  position: sticky;
  top: 92px;
}

.admin-review-section-head h2,
.admin-review-decision-card h2 {
  margin: .35rem 0 .25rem;
  color: #151b4b;
}

.admin-review-title-row {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  align-items: flex-start;
  padding-bottom: .85rem;
  border-bottom: 1px solid #e6eaf2;
}

.admin-review-title-row h3 {
  margin: .2rem 0 0;
  color: #101735;
  font-size: 1.4rem;
  line-height: 1.15;
}

.admin-review-label {
  display: block;
  color: #687086;
  font-size: .72rem;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: .05em;
}

.admin-review-block {
  margin-top: .9rem;
  padding-bottom: .9rem;
  border-bottom: 1px solid #e6eaf2;
}

.admin-review-block p {
  margin: .35rem 0 0;
  color: #111827;
  font-weight: 500;
  line-height: 1.45;
}

.admin-review-media-grid {
  display: grid;
  grid-template-columns: 240px minmax(0, 1fr);
  gap: .8rem;
  margin-top: .9rem;
}

.admin-review-media-card,
.admin-review-links-card,
.admin-review-body-card {
  border: 1px solid #e2e8f0;
  background: #f8fafc;
  border-radius: 8px;
  padding: .75rem;
}

.admin-review-media-card img {
  display: block;
  width: 100%;
  max-height: 160px;
  object-fit: cover;
  border-radius: 6px;
  margin-top: .45rem;
}

.admin-review-link-list,
.admin-submission-pills,
.admin-row-actions {
  display: flex;
  gap: .4rem;
  flex-wrap: wrap;
  align-items: center;
}

.admin-review-link-list {
  margin-top: .55rem;
}

.admin-meta-pill,
.admin-muted-pill,
.admin-status-badge {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  padding: .25rem .5rem;
  border-radius: 999px;
  font-size: .72rem;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: .035em;
  text-decoration: none;
}

.admin-meta-pill {
  color: #151b4b;
  background: #eef2ff;
  border: 1px solid #cfd7ff;
}

.admin-muted-pill {
  color: #687086;
  background: #f1f5f9;
  border: 1px solid #dbe1ee;
}

.admin-status-badge {
  color: #151b4b;
  background: #eef2ff;
  border: 1px solid #cfd7ff;
  white-space: nowrap;
}

.admin-status-badge.status-needs_changes,
.admin-status-badge.status-under_review {
  color: #7c3f13;
  background: #fff7ed;
  border-color: #fed7aa;
}

.admin-status-badge.status-rejected {
  color: #7f1d1d;
  background: #fef2f2;
  border-color: #fecaca;
}

.admin-status-badge.status-approved,
.admin-status-badge.status-published {
  color: #14532d;
  background: #f0fdf4;
  border-color: #bbf7d0;
}

.admin-review-body-card {
  margin-top: .9rem;
  background: #fff;
}

.admin-review-body {
  margin-top: .5rem;
  max-height: 560px;
  overflow: auto;
  padding: .85rem;
  border: 1px solid #e6eaf2;
  background: #fff;
  border-radius: 8px;
  line-height: 1.6;
}

.admin-review-button-stack {
  display: grid;
  gap: .55rem;
  margin-top: .85rem;
}

.admin-review-button-stack button,
.admin-review-button-stack .admin-button {
  width: 100%;
  justify-content: center;
  text-align: center;
}

.admin-review-button-stack .secondary {
  background: #fff;
  color: #151b4b;
  border: 1px solid #dbe1ee;
}

.admin-review-button-stack .danger {
  color: #7f1d1d;
  border-color: #fecaca;
  background: #fff7f7;
}

.admin-submission-summary-cell {
  width: 42%;
}

.admin-submission-cardline {
  display: grid;
  grid-template-columns: 96px minmax(0, 1fr);
  gap: .75rem;
  align-items: start;
}

.admin-submission-thumb {
  width: 96px;
  height: 72px;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  border-radius: 8px;
  border: 1px solid #dbe1ee;
  background: #f8fafc;
  color: #687086;
  font-size: .68rem;
  font-weight: 900;
  text-transform: uppercase;
  text-align: center;
}

.admin-submission-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.admin-submission-title {
  display: inline-block;
  color: #101735;
  font-size: .98rem;
  line-height: 1.2;
  font-weight: 900;
}

.admin-submission-copy p {
  max-width: 42rem;
  margin: .25rem 0 .45rem;
  color: #4b5563;
  font-size: .82rem;
  font-weight: 600;
  line-height: 1.35;
}

.admin-reporter-cell,
.admin-submitted-cell,
.admin-row-actions-cell {
  vertical-align: middle;
}

@media (max-width: 1100px) {
  .admin-review-layout {
    grid-template-columns: 1fr;
  }

  .admin-review-decision-card {
    position: static;
  }
}

@media (max-width: 760px) {
  .admin-submission-cardline,
  .admin-review-media-grid {
    grid-template-columns: 1fr;
  }

  .admin-submission-thumb {
    width: 100%;
    height: 180px;
  }
}

/* Admin reporter review: public-id URLs and one-decision workflow. */
.admin-review-preview-layout {
  grid-template-columns: minmax(0, 1fr) 340px;
}

.admin-review-preview-card {
  padding: 1rem 1.1rem 1.25rem;
}

.admin-public-preview {
  margin-top: .9rem;
  border: 1px solid #e6eaf2;
  border-radius: 10px;
  background: #fff;
  padding: 1.1rem;
}

.admin-public-preview h1 {
  margin: .45rem 0 .35rem;
  color: #151b4b;
  font-size: clamp(2rem, 4vw, 4.1rem);
  line-height: .95;
  letter-spacing: -.04em;
}

.admin-public-preview .summary {
  color: #687086;
  font-size: 1.1rem;
  line-height: 1.45;
  font-weight: 800;
  max-width: 760px;
}

.admin-public-preview-byline {
  margin: .45rem 0 .75rem;
  color: #4b5563;
  font-weight: 800;
}

.admin-public-preview-image {
  margin: 1rem 0;
}

.admin-public-preview-image img {
  width: 100%;
  max-height: 470px;
  object-fit: cover;
  border-radius: 8px;
}

.admin-public-preview-body {
  color: #101735;
  font-size: 1.05rem;
  line-height: 1.65;
}

.admin-public-preview-body h1,
.admin-public-preview-body h2,
.admin-public-preview-body h3 {
  font-family: Georgia, 'Times New Roman', serif;
  letter-spacing: -.025em;
}

.admin-public-preview-video {
  margin-top: 1rem;
}

.admin-review-button-stack.single-action {
  margin-top: 1rem;
}

.admin-review-button-stack.single-action button {
  min-height: 44px;
}

.admin-submission-thumb-empty {
  text-decoration: none;
}

@media (max-width: 1100px) {
  .admin-review-preview-layout {
    grid-template-columns: 1fr;
  }
}

/* Public category navigation and category pages */
.category-strip {
  display: flex;
  flex-wrap: wrap;
  gap: .45rem;
  margin: -0.55rem 0 1.25rem;
  padding-bottom: .85rem;
  border-bottom: 1px solid var(--line);
}
.category-strip a {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  padding: .28rem .55rem;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 999px;
  color: var(--navy);
  font-size: .76rem;
  font-weight: 1000;
  text-decoration: none;
  text-transform: uppercase;
  letter-spacing: .035em;
}
.category-strip a:hover,
.category-strip a.active {
  background: var(--gold);
  border-color: #d9a800;
  color: #111827;
}
.story-flag-category,
.category-inline,
.rail-category {
  background: transparent;
  color: #d7a500;
  font-weight: 1000;
  text-transform: uppercase;
  letter-spacing: .045em;
  text-decoration: none;
}
.story-flag-category {
  display: inline-flex;
  background: var(--gold);
  color: #111827;
  border: 1px solid #d9a800;
}
.category-inline span,
.category-inline {
  color: #b88400;
  font-size: .76rem;
}
.story-category-tag {
  background: var(--gold);
  color: #111827;
  border: 1px solid #d9a800;
}
.rail-category {
  display: block;
  margin-bottom: .15rem;
  color: #b88400;
  font-size: .67rem;
}
.story-byline {
  margin: .3rem 0 .65rem;
  color: var(--muted);
  font-weight: 900;
  line-height: 1.25;
}
.article-byline {
  margin: -.2rem 0 1rem;
  color: var(--muted);
  font-size: .95rem;
}
.story-byline-home,
.story-byline-card,
.story-byline-result {
  font-size: .78rem;
}
.mini-reporter-badge {
  display: inline-flex;
  align-items: center;
  min-height: 18px;
  margin-left: .25rem;
  padding: .12rem .35rem;
  border: 1px solid #d6bd8b;
  border-radius: 999px;
  background: #fff7df;
  color: var(--navy);
  font-size: .62rem;
  font-weight: 1000;
  text-transform: uppercase;
  letter-spacing: .05em;
  vertical-align: middle;
}
.category-directory {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0 2rem;
  max-width: 1040px;
  margin: 0 auto;
}
.category-directory-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  min-height: 58px;
  border-bottom: 1px solid var(--line);
  color: var(--navy);
  text-decoration: none;
}
.category-directory-item:hover .category-directory-name {
  color: var(--red);
}
.category-directory-name {
  font-size: 1.08rem;
  font-weight: 1000;
}
.category-directory-count {
  color: var(--muted);
  font-size: .78rem;
  font-weight: 900;
  font-variant-numeric: tabular-nums;
}
.category-results {
  display: grid;
  gap: 1rem;
}
.category-result-card {
  display: grid;
  grid-template-columns: 240px minmax(0, 1fr);
  gap: 1rem;
  padding: 1rem;
  background: var(--paper);
  border: 1px solid var(--line);
  box-shadow: 0 8px 22px rgba(7, 27, 77, .05);
}
.category-result-image {
  display: block;
  min-height: 145px;
  border-radius: 4px;
  overflow: hidden;
  background:
    linear-gradient(135deg, rgba(7,27,77,.05), rgba(7,27,77,.12)),
    repeating-linear-gradient(-35deg, #d9e1f3 0 15px, #c4cfe6 15px 30px);
}
.category-result-image img {
  display: block;
  width: 100%;
  height: 100%;
  min-height: 145px;
  object-fit: cover;
}
.category-result-copy h2 {
  margin: .2rem 0 .4rem;
  color: var(--navy);
  font-size: clamp(1.25rem, 2.4vw, 2rem);
  line-height: 1;
  letter-spacing: -.045em;
  font-weight: 1000;
}
.category-result-copy h2 a {
  text-decoration: none;
}
.category-result-copy p {
  margin: .45rem 0 0;
  color: var(--muted);
  font-weight: 700;
}
.result-meta-line {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .35rem;
  color: var(--muted);
  font-size: .78rem;
  font-weight: 800;
}
.story-video-block {
  margin: 1.6rem 0;
  padding-top: 1rem;
  border-top: 1px solid var(--line);
}
.story-video-block h2 {
  margin: 0 0 .65rem;
  color: var(--navy);
  font-size: 1.35rem;
  letter-spacing: -.03em;
}
.youtube-embed {
  position: relative;
  width: 100%;
  aspect-ratio: 16 / 9;
  max-height: none;
  background: #000;
  border-radius: 4px;
  overflow: hidden;
}
.youtube-embed iframe {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
}
.story-resource-links {
  display: flex;
  flex-wrap: wrap;
  gap: .55rem;
  margin: 1.4rem 0;
  padding-top: 1rem;
  border-top: 1px solid var(--line);
}
.story-resource-links .button.secondary {
  background: #fff;
  color: var(--navy);
  border: 1px solid var(--line);
}
@media (max-width: 900px) {
  .category-directory { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .category-result-card { grid-template-columns: 180px minmax(0, 1fr); }
}
@media (max-width: 620px) {
  .category-directory { grid-template-columns: 1fr; }
  .category-result-card { grid-template-columns: 1fr; }
  .category-result-image,
  .category-result-image img { min-height: 190px; }
}

/* Public category color polish: match editorial red badges like LOCAL / TOP STORY */
.category-strip a:hover,
.category-strip a.active {
  background: var(--red);
  border-color: var(--red);
  color: #ffffff;
}

.story-flag-category,
.story-category-tag {
  background: var(--red);
  border-color: var(--red);
  color: #ffffff;
}

.category-inline,
.category-inline span,
.rail-category {
  background: transparent;
  border: 0;
  color: var(--red);
  padding: 0;
}

.category-inline,
.category-inline span {
  font-size: .76rem;
  font-weight: 1000;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.rail-category {
  display: block;
  margin-bottom: .15rem;
  font-size: .67rem;
  font-weight: 1000;
  letter-spacing: .045em;
  text-transform: uppercase;
}

.home-rail .rail-category,
.sidebar .rail-category {
  color: var(--red);
}

/* Public reporter profile pages */
.field-help {
  display: block;
  margin: .25rem 0 .25rem;
  color: var(--muted);
  font-size: .78rem;
  font-weight: 800;
}
.reporter-byline-link {
  color: inherit;
  text-decoration: underline;
  text-decoration-thickness: 2px;
  text-underline-offset: 3px;
}
.reporter-byline-link:hover,
.reporter-byline-link:focus {
  color: var(--red);
}
.reporter-profile-hero {
  position: relative;
  margin-bottom: 1.35rem;
  border: 1px solid var(--line);
  background: #fff;
  box-shadow: var(--shadow);
  overflow: hidden;
}
.reporter-cover {
  position: relative;
  display: block;
  width: 100%;
  min-height: 0;
  aspect-ratio: 3 / 1;
  max-height: 360px;
  overflow: hidden;
  background:
    radial-gradient(circle at 18% 20%, rgba(192, 25, 32, .22), transparent 18rem),
    linear-gradient(135deg, var(--navy), #101827 64%, var(--red));
}
.reporter-cover.has-image {
  background: #070d22;
}
.reporter-cover img,
.reporter-cover img,
.reporter-cover.has-image img {
  position: absolute;
  inset: 0;
  display: block;
  width: 100% !important;
  max-width: none !important;
  height: 100% !important;
  object-fit: cover;
  object-position: center center;
}
.reporter-cover-shade {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(5, 8, 20, .02), rgba(5, 8, 20, .12));
  pointer-events: none;
}
.reporter-cover:not(.has-image) .reporter-cover-shade {
  background: linear-gradient(180deg, rgba(5, 8, 20, .08), rgba(5, 8, 20, .72));
}
.reporter-profile-card-public {
  position: relative;
  width: 100%;
  margin: 0;
  padding: clamp(1.15rem, 2.6vw, 2rem);
  border: 0;
  border-top: 6px solid var(--red);
  background: #fff;
  box-shadow: none;
}
.reporter-profile-card-public h1 {
  margin: .55rem 0 .4rem;
  color: var(--navy);
  font-size: clamp(2rem, 4vw, 3.2rem);
  line-height: .98;
  letter-spacing: -.035em;
}
.reporter-profile-badge {
  margin-bottom: .5rem;
}
.reporter-public-bio {
  max-width: 760px;
  margin: .75rem 0 0;
  color: var(--ink);
  font-size: 1.05rem;
  font-weight: 750;
  line-height: 1.45;
}
.reporter-public-links {
  display: flex;
  flex-wrap: wrap;
  gap: .55rem;
  margin-top: 1rem;
}
.reporter-public-links .button.secondary {
  background: #fff;
  color: var(--navy);
  border: 1px solid var(--line);
}
.reporter-section-head {
  margin: 1.35rem 0 .85rem;
}
.reporter-section-head h2 {
  margin: .2rem 0 0;
  color: var(--navy);
  font-size: clamp(1.6rem, 3vw, 2.3rem);
  line-height: 1;
  letter-spacing: -.025em;
}
@media (max-width: 620px) {
  .reporter-profile-card-public {
    width: 100%;
    margin-top: 0;
  }
  .reporter-public-links {
    display: grid;
  }
  .reporter-public-links .button {
    justify-content: center;
  }
}

/* Reporter profile form additions */
.reporter-compact-grid label:nth-child(2) { grid-row: auto; }
.reporter-compact-grid .reporter-bio-field { grid-row: span 2; }
.reporter-compact-grid .reporter-story-wide { grid-column: 1 / -1; }
@media (max-width: 860px) {
  .reporter-compact-grid .reporter-bio-field { grid-row: auto; }
  .reporter-compact-grid .reporter-story-wide { grid-column: auto; }
}

/* Cleaner reporter profile editor with cover upload preview */
.reporter-profile-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .85rem;
  padding: .75rem .85rem;
  margin: .75rem 0 1rem;
  border: 1px solid var(--line);
  background: #f8f9fc;
}
.reporter-profile-url-box {
  display: grid;
  gap: .15rem;
  min-width: 0;
}
.reporter-profile-url-box strong {
  color: var(--navy);
  overflow-wrap: anywhere;
}
.reporter-profile-view-link.is-disabled {
  opacity: .55;
  pointer-events: none;
}
 .reporter-profile-editor-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1rem;
  align-items: start;
}
.reporter-profile-editor-main,
.reporter-link-grid {
  display: grid;
  gap: .85rem;
}
.reporter-link-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.reporter-cover-uploader {
  display: grid;
  gap: .75rem;
  padding: .9rem;
  margin: 1rem 0 1.15rem;
  border: 1px solid var(--line);
  background: #fff;
  box-shadow: 0 8px 22px rgba(16,24,40,.06);
}
.reporter-cover-uploader-wide {
  max-width: none;
}
.reporter-cover-editor-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
}
.reporter-cover-editor-head h3 {
  margin: 0;
  color: var(--navy);
  font-size: 1rem;
  line-height: 1.1;
}
.reporter-cover-editor-head p {
  margin: .2rem 0 0;
  color: var(--muted);
  font-size: .9rem;
  font-weight: 700;
}
.reporter-cover-file-button {
  position: relative;
  overflow: hidden;
  white-space: nowrap;
}
.reporter-cover-file-button input[type=file] {
  position: absolute;
  inset: 0;
  opacity: 0;
  cursor: pointer;
}
.reporter-cover-preview {
  position: relative;
  min-height: 220px;
  aspect-ratio: 3 / 1;
  cursor: default;
  touch-action: none;
  border: 1px dashed #b9c0d0;
  background:
    radial-gradient(circle at 20% 18%, rgba(176, 97, 49, .22), transparent 9rem),
    linear-gradient(135deg, #182257, #111a44 66%, #9a492d);
  overflow: hidden;
}
.reporter-cover-preview img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.reporter-cover-preview.is-cropping {
  cursor: grab;
}
.reporter-cover-preview.is-cropping::after {
  content: 'Drag to reposition';
  position: absolute;
  right: .75rem;
  bottom: .75rem;
  padding: .35rem .5rem;
  background: rgba(7, 13, 34, .78);
  color: #fff;
  font-size: .72rem;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: .04em;
}
.reporter-cover-preview.is-cropping.is-dragging {
  cursor: grabbing;
}
.reporter-cover-preview.is-cropping img {
  position: absolute;
  top: 50%;
  left: 50%;
  width: auto;
  height: auto;
  max-width: none;
  max-height: none;
  transform-origin: center center;
  user-select: none;
  pointer-events: none;
}
.reporter-cover-crop-tools {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .75rem;
  padding: .65rem .75rem;
  border: 1px solid var(--line);
  background: #f8f9fc;
}
.reporter-cover-reset {
  flex: 0 0 auto;
}
.reporter-cover-empty {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  align-content: center;
  gap: .35rem;
  padding: 1rem;
  color: #fff;
  text-align: center;
  font-weight: 900;
  line-height: 1.25;
}
.reporter-cover-empty span {
  display: block;
  max-width: 34rem;
  font-size: .86rem;
  opacity: .92;
}
.reporter-cover-upload-control,
.reporter-cover-url-control {
  display: grid;
  gap: .35rem;
}
.reporter-profile-actions {
  gap: .65rem;
}
@media (max-width: 920px) {
  .reporter-profile-toolbar,
  .reporter-cover-editor-head,
  .reporter-cover-crop-tools {
    align-items: flex-start;
    display: grid;
  }
  .reporter-link-grid {
    grid-template-columns: 1fr;
  }
  .reporter-cover-preview {
    min-height: 160px;
  }
}

/* Fix lead story image height after separating the story link and reporter profile link.
   The old layout had the image as a direct grid item, so it stretched to match the
   tall headline column. The new nested image link must stretch too. */
.front-layout .lead-story-content > .lead-image-link {
  align-self: stretch;
  height: 100%;
  min-height: 230px;
}

.front-layout .lead-story-content > .lead-image-link .lead-image {
  height: 100%;
  min-height: 100%;
}

@media (max-width: 760px) {
  .front-layout .lead-story-content > .lead-image-link,
  .front-layout .lead-story-content > .lead-image-link .lead-image {
    height: auto;
    min-height: 230px;
  }
}

/* Ad campaigns account/admin UI */
#account-tab-ads:checked ~ .account-tabs-nav .account-tab-ads-label {
  background: var(--ink, #10184a);
  color: #fff;
  border-color: var(--ink, #10184a);
}

#account-tab-ads:checked ~ .account-tab-panels .account-tab-ads-panel {
  display: block;
}

.ad-editor-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 320px;
  gap: 1.25rem;
  align-items: start;
}

.ad-editor-main,
.ad-editor-preview {
  display: grid;
  gap: .9rem;
}

.ad-editor-preview {
  border: 1px solid var(--line, #d7dce8);
  background: #fbfcff;
  padding: 1rem;
}

.ad-image-button input {
  display: none;
}

.ad-image-preview {
  display: grid;
  place-items: center;
  min-height: 180px;
  border: 1px dashed var(--line, #d7dce8);
  background: #fff;
  overflow: hidden;
  color: var(--muted, #6b7280);
  font-weight: 800;
  text-transform: uppercase;
  font-size: .75rem;
}

.ad-image-preview img {
  width: 100%;
  height: auto;
  display: block;
}

.ad-native-preview {
  border: 1px solid var(--line, #d7dce8);
  background: #fff;
  padding: 1rem;
}

.ad-campaign-row strong {
  display: block;
}

.public-ad-card .public-ad-image {
  display: block;
  margin: .75rem 0;
  border: 1px solid rgba(16,24,74,.12);
  overflow: hidden;
}

.public-ad-card .public-ad-image img {
  display: block;
  width: 100%;
  height: auto;
}

@media (max-width: 800px) {
  .ad-editor-grid { grid-template-columns: 1fr; }
}

/* Ad campaign editor polish. */
.account-form.ad-campaign-editor input[type="text"],
.account-form.ad-campaign-editor input[type="url"],
.account-form.ad-campaign-editor input[type="date"],
.account-form.ad-campaign-editor textarea,
.account-form.ad-campaign-editor select,
.account-dashboard-panel .account-form.ad-campaign-editor input[type="text"],
.account-dashboard-panel .account-form.ad-campaign-editor input[type="url"],
.account-dashboard-panel .account-form.ad-campaign-editor input[type="date"],
.account-dashboard-panel .account-form.ad-campaign-editor textarea,
.account-dashboard-panel .account-form.ad-campaign-editor select {
  font-family: Arial, Helvetica, sans-serif;
  font-weight: 400;
  letter-spacing: normal;
  color: #111827;
}

.account-form.ad-campaign-editor input::placeholder,
.account-form.ad-campaign-editor textarea::placeholder {
  font-weight: 400;
}

.ad-run-until-cancelled {
  align-self: end;
  min-height: 42px;
  display: inline-flex;
  align-items: center;
  gap: .45rem;
  margin: 0;
  padding: .55rem .65rem;
  border: 1px solid var(--line, #d7dce8);
  background: #f8fafc;
  font-size: .9rem;
  line-height: 1.2;
}

.ad-run-until-cancelled input {
  margin: 0;
}

.ad-run-until-cancelled span {
  font-weight: 800;
  color: var(--ink, #10184a);
}

[data-ad-end-date-field].is-disabled {
  opacity: .55;
}

[data-ad-end-date-field].is-disabled input {
  background: #f3f4f6;
}

/* Ad campaign editor cleanup. */
.ad-campaign-editor .ad-editor-intro {
  margin-top: .45rem;
}

.ad-schedule-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
  align-items: start;
}

.ad-schedule-grid > label,
.ad-end-date-row > label {
  margin: 0;
}

.ad-end-date-row {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 1rem;
  align-items: end;
}

.ad-run-until-cancelled {
  min-height: 42px;
  display: inline-flex;
  align-items: center;
  justify-content: flex-start;
  gap: .5rem;
  margin: 0 0 0 0;
  padding: .56rem .75rem;
  border: 1px solid var(--line, #d7dce8);
  background: #f8fafc;
  white-space: nowrap;
  font-size: .9rem;
  line-height: 1.2;
}

.ad-run-until-cancelled input {
  width: auto;
  margin: 0;
  flex: 0 0 auto;
}

.ad-run-until-cancelled span {
  font-weight: 700;
  color: var(--ink, #10184a);
}

@media (max-width: 700px) {
  .ad-schedule-grid,
  .ad-end-date-row {
    grid-template-columns: 1fr;
  }

  .ad-run-until-cancelled {
    width: 100%;
    white-space: normal;
  }
}

/* Ad campaign date/select alignment fix. */
.account-form.ad-campaign-editor input[type="text"],
.account-form.ad-campaign-editor input[type="url"],
.account-form.ad-campaign-editor input[type="date"],
.account-form.ad-campaign-editor select {
  min-height: 42px;
  height: 42px;
  box-sizing: border-box;
  line-height: 1.2;
}

.account-form.ad-campaign-editor textarea {
  box-sizing: border-box;
}

.ad-schedule-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: start;
}

.ad-end-date-row {
  display: contents;
}

.ad-run-until-cancelled {
  width: 100%;
  min-height: 42px;
  height: 42px;
  box-sizing: border-box;
  align-self: end;
  justify-content: flex-start;
}

.ad-run-until-cancelled input {
  height: auto;
  min-height: 0;
}

@media (max-width: 700px) {
  .ad-end-date-row {
    display: grid;
    grid-template-columns: 1fr;
  }

  .ad-run-until-cancelled {
    height: auto;
    min-height: 42px;
  }
}

/* Admin ad review preview sizing fix. */
.admin-ad-review-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 320px;
  gap: 1.25rem;
  align-items: start;
}

.admin-ad-review-main,
.admin-ad-review-side,
.admin-ad-creative-card {
  border: 1px solid var(--line, #d7dce8);
  background: #fff;
  padding: 1rem;
}

.admin-ad-review-main {
  display: grid;
  gap: 1rem;
}

.admin-ad-meta {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .65rem 1rem;
  margin: 0;
}

.admin-ad-meta div { min-width: 0; }
.admin-ad-meta dt {
  font-size: .72rem;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: .03em;
  color: #5f6678;
  margin-bottom: .15rem;
}
.admin-ad-meta dd {
  margin: 0;
  font-weight: 700;
  overflow-wrap: anywhere;
}

.admin-ad-preview-wrap {
  display: grid;
  grid-template-columns: minmax(0, 360px) minmax(0, 320px);
  gap: 1rem;
  align-items: start;
}

.admin-ad-creative-card h3 {
  margin: 0 0 .35rem;
  color: #111735;
  font-size: 1rem;
}

.admin-help-text {
  margin: 0 0 .75rem;
  color: #6b7280;
  font-size: .8rem;
  font-weight: 700;
}

.admin-ad-preview-image {
  width: 100%;
  min-height: 0;
  margin: 0;
  background: #f7f9fc;
}

.admin-ad-preview-image.is-sidebar {
  max-width: 300px;
  aspect-ratio: 6 / 5;
}

.admin-ad-preview-image.is-banner {
  max-width: 100%;
  aspect-ratio: 970 / 250;
}

.admin-ad-preview-image img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
}

.admin-ad-rendered-preview {
  max-width: 300px;
  margin: 0;
}

.admin-ad-rendered-preview .public-ad-image {
  margin-top: .35rem;
}

@media (max-width: 980px) {
  .admin-ad-review-grid,
  .admin-ad-preview-wrap {
    grid-template-columns: 1fr;
  }
  .admin-ad-rendered-preview,
  .admin-ad-preview-image.is-sidebar {
    max-width: 100%;
  }
}


/* Ad campaign tagline + review preview polish */
.public-ad-tagline {
  margin: .15rem 0 .45rem;
  color: #4f5a70;
  font-weight: 900;
  line-height: 1.25;
}
.ad-native-preview .public-ad-tagline,
.admin-ad-rendered-preview .public-ad-tagline {
  font-size: .9rem;
}
.admin-ad-public-preview-only {
  border: 1px solid var(--line, #d7dce8);
  background: #fff;
  padding: 1rem;
  max-width: 360px;
}
.admin-ad-public-preview-only h3 {
  margin: 0 0 .35rem;
  color: #111735;
  font-size: 1rem;
}
.admin-ad-public-preview-only .admin-ad-rendered-preview {
  max-width: 300px;
}
@media (max-width: 980px) {
  .admin-ad-public-preview-only,
  .admin-ad-public-preview-only .admin-ad-rendered-preview {
    max-width: 100%;
  }
}

/* Ad campaign CTA label polish */
.ad-native-preview .rail-button {
  display: inline-flex;
  margin-top: 0.75rem;
}

/* Ad campaign action button spacing fix. */
.ad-campaign-editor .account-button-row {
  display: flex;
  flex-wrap: wrap;
  gap: .65rem;
  align-items: center;
  margin-top: 1.75rem;
  clear: both;
}

.ad-campaign-editor .ad-schedule-grid {
  margin-bottom: .25rem;
}

.ad-campaign-editor .account-button-row button {
  margin: 0;
  flex: 0 0 auto;
}

@media (max-width: 700px) {
  .ad-campaign-editor .account-button-row {
    gap: .5rem;
  }
}

/* Ad campaign review-lock UI. */
.ad-status-strip {
  display: flex;
  align-items: center;
  gap: .5rem;
  margin: .75rem 0 1rem;
  padding: .75rem .85rem;
  border: 1px solid var(--line, #d7dce8);
  background: #f8fafc;
  color: #111735;
  font-size: .9rem;
}
.ad-status-pill {
  display: inline-flex;
  align-items: center;
  padding: .25rem .55rem;
  border: 1px solid var(--line, #d7dce8);
  background: #fff;
  color: #111735;
  font-size: .72rem;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: .035em;
}
.ad-status-pending { border-color: #b35a33; color: #9d4723; background: #fff7ed; }
.ad-status-active { border-color: #9fc7a8; color: #236b35; background: #f0fdf4; }
.ad-status-rejected { border-color: #e4a6a6; color: #991b1b; background: #fef2f2; }
.ad-status-paused { border-color: #cbd5e1; color: #475569; background: #f8fafc; }
.ad-status-ended { border-color: #cbd5e1; color: #334155; background: #f1f5f9; }
.ad-lock-alert {
  margin-bottom: 1rem;
}
.ad-campaign-editor-locked input[readonly],
.ad-campaign-editor-locked textarea[readonly],
.ad-campaign-editor-locked select:disabled,
.ad-campaign-editor-locked input:disabled {
  background: #f6f7fb;
  color: #4f5a70;
  cursor: not-allowed;
}
.ad-campaign-editor-locked .ad-image-button {
  opacity: .65;
  cursor: not-allowed;
}
.ad-locked-actions {
  border-top: 1px solid var(--line, #d7dce8);
  padding-top: 1rem;
}

/* Admin ad draft review preview sizing restore. */
.admin-ad-review-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 320px;
  gap: 1.25rem;
  align-items: start;
}

.admin-ad-review-main,
.admin-ad-review-side,
.admin-ad-creative-card {
  border: 1px solid var(--line, #d7dce8);
  background: #fff;
  padding: 1rem;
}

.admin-ad-review-main {
  display: grid;
  gap: 1rem;
}

.admin-ad-meta {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .65rem 1rem;
  margin: 0;
}

.admin-ad-meta div { min-width: 0; }
.admin-ad-meta dt {
  font-size: .72rem;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: .03em;
  color: #5f6678;
  margin-bottom: .15rem;
}
.admin-ad-meta dd {
  margin: 0;
  font-weight: 700;
  overflow-wrap: anywhere;
}

.admin-ad-public-only-preview {
  width: fit-content;
  max-width: 100%;
}

.admin-ad-creative-card h3 {
  margin: 0 0 .35rem;
  color: #111735;
  font-size: 1rem;
}

.admin-help-text,
.admin-public-ad-preview-wrap .help-text {
  margin: 0 0 .75rem;
  color: #6b7280;
  font-size: .8rem;
  font-weight: 700;
}

.admin-ad-rendered-preview,
.admin-public-ad-preview {
  width: 300px;
  max-width: 100%;
  margin: 0;
}

.admin-ad-rendered-preview .public-ad-image,
.admin-public-ad-preview .public-ad-image {
  display: block;
  margin-top: .35rem;
}

.admin-ad-rendered-preview .public-ad-image img,
.admin-public-ad-preview .public-ad-image img,
.admin-public-ad-preview .ad-card-image {
  width: 100%;
  max-width: 300px;
  max-height: 250px;
  object-fit: contain;
  display: block;
}

@media (max-width: 980px) {
  .admin-ad-review-grid {
    grid-template-columns: 1fr;
  }
  .admin-ad-rendered-preview,
  .admin-public-ad-preview {
    width: 100%;
    max-width: 300px;
  }
}

/* Horizontal banner ad placements. */
.ad-banner-slot {
  margin: 1.25rem 0 1.6rem;
}
.public-ad-banner-card {
  display: grid;
  grid-template-columns: minmax(220px, 42%) minmax(0, 1fr);
  gap: 1rem 1.25rem;
  align-items: center;
  padding: 1rem;
  max-width: 100%;
}
.public-ad-banner-card .rail-kicker {
  grid-column: 1 / -1;
  justify-self: start;
}
.public-ad-banner-card .public-ad-image {
  grid-row: span 4;
  margin: 0;
  width: 100%;
  aspect-ratio: 970 / 250;
  background: #050816;
}
.public-ad-banner-card .public-ad-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.public-ad-banner-card h3 {
  margin: 0;
  font-size: clamp(1.15rem, 2.2vw, 1.75rem);
  line-height: .98;
}
.public-ad-banner-card p {
  margin: 0;
}
.public-ad-banner-card .rail-button {
  justify-self: start;
  margin-top: .15rem;
}
.category-banner-ad,
.home-banner-ad {
  border-top: 1px solid var(--line, #d7dce8);
  border-bottom: 1px solid var(--line, #d7dce8);
  padding: 1rem 0;
}
.story-banner-ad {
  border-top: 1px solid var(--line, #d7dce8);
  border-bottom: 1px solid var(--line, #d7dce8);
  padding: 1rem 0;
}
.ad-image-preview[data-placement="home_banner"],
.ad-image-preview[data-placement="story_banner"],
.ad-image-preview[data-placement="category_banner"] {
  aspect-ratio: 970 / 250;
  min-height: 0;
}
.ad-image-preview[data-placement="home_banner"] img,
.ad-image-preview[data-placement="story_banner"] img,
.ad-image-preview[data-placement="category_banner"] img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.ad-native-preview[data-placement="home_banner"],
.ad-native-preview[data-placement="story_banner"],
.ad-native-preview[data-placement="category_banner"] {
  display: grid;
  grid-template-columns: minmax(120px, 42%) minmax(0, 1fr);
  gap: .55rem .75rem;
  align-items: center;
}
.ad-native-preview[data-placement="home_banner"] .rail-kicker,
.ad-native-preview[data-placement="story_banner"] .rail-kicker,
.ad-native-preview[data-placement="category_banner"] .rail-kicker {
  grid-column: 1 / -1;
  justify-self: start;
}
.admin-ad-rendered-preview.admin-ad-banner-preview,
.admin-public-ad-preview.admin-ad-banner-preview {
  width: min(720px, 100%);
  max-width: 100%;
}
.admin-ad-rendered-preview.admin-ad-banner-preview .public-ad-image img,
.admin-public-ad-preview.admin-ad-banner-preview .public-ad-image img {
  max-width: none;
  max-height: none;
}
.admin-ad-public-only-preview:has(.admin-ad-banner-preview) {
  width: min(760px, 100%);
  max-width: 100%;
}
@media (max-width: 760px) {
  .public-ad-banner-card,
  .ad-native-preview[data-placement="home_banner"],
  .ad-native-preview[data-placement="story_banner"],
  .ad-native-preview[data-placement="category_banner"] {
    grid-template-columns: 1fr;
  }
  .public-ad-banner-card .public-ad-image {
    grid-row: auto;
  }
}

/* Multi-creative ad campaigns. */
.ad-placement-fieldset {
  border: 1px solid var(--line);
  padding: 12px;
  margin: 6px 0 14px;
  background: #fbfcff;
}
.ad-placement-fieldset legend {
  padding: 0 6px;
  font-weight: 900;
  color: var(--navy);
}
.ad-placement-check-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  margin-top: 10px;
}
.ad-placement-check-grid .checkbox-label,
.ad-run-until-cancelled {
  min-height: 40px;
}
.ad-editor-creatives {
  display: flex;
  flex-direction: column;
  gap: 14px;
}
.ad-creative-editor-card {
  border: 1px solid var(--line);
  padding: 12px;
  background: #fff;
}
.ad-creative-editor-card h4 {
  margin: 0 0 4px;
  color: var(--navy);
  font-size: 1rem;
}
.ad-creative-editor-card .ad-image-button {
  width: 100%;
  text-align: center;
  margin: 8px 0 10px;
}
.ad-image-preview-banner {
  aspect-ratio: 970 / 250;
}
.ad-image-preview-banner img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.public-ad-card[data-placement$="_banner"],
.public-ad-card.ad-card-banner,
.admin-ad-rendered-preview[data-placement$="_banner"] {
  max-width: 970px;
}
.public-ad-card[data-placement$="_banner"] .public-ad-image img,
.public-ad-card.ad-card-banner .public-ad-image img {
  width: 100%;
  aspect-ratio: 970 / 250;
  object-fit: cover;
}
.admin-ad-creative-card .ad-preview-placement-heading {
  margin-top: 18px;
  margin-bottom: 8px;
  color: var(--navy);
}
@media (max-width: 760px) {
  .ad-placement-check-grid {
    grid-template-columns: 1fr;
  }
}

/* Ad multi-creative editor preview containment fix. */
.ad-editor-preview,
.ad-editor-creatives,
.ad-creative-editor-card {
  min-width: 0;
  box-sizing: border-box;
}

.ad-editor-preview .ad-image-preview,
.ad-editor-preview .ad-image-preview-banner {
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
}

.ad-editor-preview .ad-native-preview {
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
  overflow: hidden;
}

.ad-editor-preview .ad-native-preview img {
  display: block;
  width: 100%;
  max-width: 100%;
  height: auto;
  object-fit: cover;
}

.ad-editor-preview .ad-native-preview[data-placement$="_banner"] {
  display: block;
}

.ad-editor-preview .ad-native-preview[data-placement$="_banner"] img {
  aspect-ratio: 970 / 250;
  height: auto;
  object-fit: cover;
}

/* Ad multi-creative mobile + wide banner editor layout fix. */
.ad-banner-creative-wide {
  margin-top: 16px;
}

.ad-creative-editor-card-wide {
  max-width: 100%;
  overflow: hidden;
}

.ad-creative-wide-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 10px;
}

.ad-creative-wide-header .ad-image-button {
  flex: 0 0 auto;
  min-width: 220px;
  margin: 0;
}

.ad-image-preview-banner-wide {
  width: 100%;
  max-width: 970px;
  margin: 0 auto;
  aspect-ratio: 970 / 250;
  overflow: hidden;
  background: #f5f6fb;
}

.ad-image-preview-banner-wide img,
.ad-image-preview-banner img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  background: #050712;
}

.ad-image-preview-mobile {
  aspect-ratio: 320 / 100;
}

.ad-image-preview-mobile img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  background: #050712;
}

.public-ad-image picture,
.public-ad-image picture img {
  display: block;
  width: 100%;
}

@media (max-width: 760px) {
  .ad-creative-wide-header {
    display: block;
  }

  .ad-creative-wide-header .ad-image-button {
    width: 100%;
    margin-top: 10px;
  }
}

/* Ad campaign editor reorganization. */
.ad-campaign-editor .ad-editor-sections {
  display: grid;
  gap: 18px;
}

.ad-campaign-editor .ad-editor-section {
  border: 1px solid var(--line, #d7dce8);
  background: #fff;
  padding: 16px;
}

.ad-campaign-editor .ad-section-heading {
  margin-bottom: 12px;
}

.ad-campaign-editor .ad-section-heading .field-help {
  margin: 6px 0 0;
}

.ad-editor-details-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px 18px;
}

.ad-editor-details-grid .ad-details-wide {
  grid-column: 1 / -1;
}

.ad-two-column-section {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(280px, .9fr);
  gap: 18px;
  align-items: start;
}

.ad-editor-subsection {
  border: 1px solid var(--line, #d7dce8);
  background: #fbfcff;
  padding: 14px;
  min-width: 0;
}

.ad-editor-subsection h3,
.ad-preview-grid h4 {
  margin: 0 0 10px;
  color: var(--navy, #11194c);
}

.ad-creatives-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}

.ad-creative-banner-card {
  grid-column: 1 / -1;
}

.ad-creative-card-header {
  display: flex;
  gap: 14px;
  justify-content: space-between;
  align-items: flex-start;
  margin-bottom: 12px;
}

.ad-creative-card-header .ad-image-button {
  flex: 0 0 auto;
  min-width: 210px;
  margin: 0;
}

.ad-creative-sidebar-card .ad-image-preview {
  max-width: 300px;
  aspect-ratio: 300 / 250;
  margin: 0 auto;
}

.ad-creative-sidebar-card .ad-image-preview img,
.ad-campaign-preview-section .ad-native-preview img {
  width: 100%;
  height: auto;
  display: block;
}

.ad-creative-banner-card .ad-image-preview-banner-wide,
.ad-banner-display-preview {
  width: 100%;
  max-width: 970px;
  margin: 0 auto;
}

.ad-preview-grid {
  display: grid;
  grid-template-columns: 320px minmax(0, 1fr);
  gap: 18px;
  align-items: start;
}

.ad-preview-sidebar-cell,
.ad-preview-banner-cell {
  min-width: 0;
}

.ad-preview-sidebar-cell .ad-native-preview {
  max-width: 300px;
}

.ad-banner-preview-card {
  border: 1px solid var(--line, #d7dce8);
  background: #fff;
  padding: 12px;
}

.ad-banner-preview-card .rail-kicker {
  display: inline-block;
  margin-bottom: 8px;
}

.ad-banner-display-preview img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  background: #050712;
}

.ad-campaign-editor .account-button-row {
  margin-top: 18px;
}

@media (max-width: 900px) {
  .ad-editor-details-grid,
  .ad-two-column-section,
  .ad-creatives-grid,
  .ad-preview-grid {
    grid-template-columns: 1fr;
  }

  .ad-creative-card-header {
    display: block;
  }

  .ad-creative-card-header .ad-image-button {
    width: 100%;
    margin-top: 10px;
  }
}

/* Ad editor preview launcher and creative card cleanup. */
.ad-creatives-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 18px;
}

.ad-creative-editor-card {
  overflow: hidden;
}

.ad-creative-card-header {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(190px, 260px);
  gap: 16px;
  align-items: start;
}

.ad-creative-card-header .ad-image-button {
  min-width: 0;
  width: 100%;
  max-width: 260px;
  justify-self: end;
  box-sizing: border-box;
  white-space: normal;
  text-align: center;
}

.ad-creative-sidebar-card .ad-image-preview,
.ad-creative-mobile-card .ad-image-preview {
  margin: 14px auto 0;
}

.ad-creative-banner-card .ad-image-preview-banner-wide {
  margin-top: 14px;
}

.ad-campaign-preview-launcher {
  display: flex;
  justify-content: space-between;
  gap: 18px;
  align-items: center;
}

.ad-campaign-preview-launcher h3 {
  margin: 8px 0 4px;
  color: var(--navy, #11194c);
}

.ad-preview-launcher-copy {
  min-width: 0;
}

.ad-preview-open-button {
  flex: 0 0 auto;
}

@media (max-width: 760px) {
  .ad-creative-card-header,
  .ad-campaign-preview-launcher {
    display: block;
  }

  .ad-creative-card-header .ad-image-button,
  .ad-preview-open-button {
    width: 100%;
    max-width: none;
    margin-top: 10px;
  }
}


/* Ad creative preview sizing and crop tools. */
.ad-creative-mobile-card .ad-image-preview {
  width: 100%;
  max-width: 320px;
  aspect-ratio: 320 / 100;
  margin: 14px auto 0;
}

.ad-creative-banner-card .ad-image-preview-banner-wide {
  width: 100%;
  max-width: 970px;
  margin: 14px auto 0;
}

.ad-image-preview[data-ad-crop-frame] {
  position: relative;
  overflow: hidden;
  touch-action: none;
}

.ad-image-preview[data-ad-crop-frame] img {
  display: block;
}

.ad-image-preview[data-ad-crop-frame].is-cropping {
  cursor: grab;
  background: #050712;
  border-style: solid;
}

.ad-image-preview[data-ad-crop-frame].is-cropping.is-dragging {
  cursor: grabbing;
}

.ad-image-preview[data-ad-crop-frame].is-cropping::after {
  content: '';
  position: absolute;
  inset: 0;
  border: 2px solid rgba(255,255,255,.85);
  box-shadow: inset 0 0 0 1px rgba(6,10,24,.45);
  pointer-events: none;
}

.ad-image-preview [data-ad-image-empty] {
  padding: .75rem;
  text-align: center;
}

.ad-image-preview[data-ad-crop-frame] {
  background: #050712;
}

.ad-image-preview[data-ad-crop-frame]:not(.has-image) {
  background: #f6f7fb;
}

.ad-image-preview[data-ad-crop-frame] img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.ad-image-crop-tools {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: .75rem 1rem;
  margin-top: .85rem;
}

.ad-image-crop-actions {
  display: flex;
  flex-wrap: wrap;
  gap: .5rem;
}

.ad-image-crop-actions .button {
  margin: 0;
}

.ad-image-crop-status {
  flex: 1 1 320px;
  margin: 0;
}

@media (max-width: 760px) {
  .ad-image-crop-tools {
    display: grid;
    gap: .65rem;
  }

  .ad-image-crop-actions,
  .ad-image-crop-status {
    width: 100%;
  }
}


/* Ad creative saved/upload preview consistency.
   Non-cropping previews show the full image exactly as it will be saved.
   Crop mode still uses JS positioning when the uploaded image ratio does not match. */
.ad-image-preview[data-ad-crop-frame]:not(.is-cropping) img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  background: #050712;
}

.ad-image-preview[data-ad-crop-frame].is-cropping img {
  object-fit: unset;
}


/* Mobile creative preview exact frame fix. */
.ad-creative-mobile-card .ad-image-preview,
.ad-creative-mobile-card .ad-image-preview-mobile,
.ad-image-preview.ad-image-preview-mobile {
  width: 320px;
  max-width: 100%;
  height: 100px;
  min-height: 0;
  aspect-ratio: 320 / 100;
  margin: 14px auto 0;
  box-sizing: border-box;
}

.ad-creative-mobile-card .ad-image-preview img,
.ad-creative-mobile-card .ad-image-preview-mobile img,
.ad-image-preview.ad-image-preview-mobile img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
}

.ad-image-preview-mobile[data-ad-crop-frame].is-cropping img {
  object-fit: unset;
}


/* Inline ad creative previews. */
.ad-creative-sidebar-card .ad-image-preview {
  margin-bottom: 0;
}

.ad-sidebar-copy-preview {
  width: 100%;
  max-width: 300px;
  margin: 0 auto 0;
  border: 1px solid var(--line, #d7dce8);
  border-top: 0;
  background: #fff;
  padding: 12px;
  box-sizing: border-box;
}

.ad-sidebar-copy-preview h5 {
  margin: 0 0 8px;
  color: var(--navy, #101842);
  font-size: 1.05rem;
  line-height: 1.1;
}

.ad-sidebar-copy-preview p {
  margin: 0 0 10px;
  line-height: 1.35;
}

.ad-sidebar-copy-preview .ad-inline-tagline {
  font-weight: 800;
  color: var(--muted, #61687b);
}

.ad-sidebar-copy-preview .ad-inline-cta {
  display: inline-block;
  margin-top: 2px;
  pointer-events: none;
}

.ad-campaign-preview-launcher,
.ad-preview-open-button {
  display: none !important;
}

/* Sidebar creative actual-card preview fix. */
.ad-sidebar-card-preview {
  width: 100%;
  max-width: 300px;
  margin: 14px auto 0;
  border: 1px solid var(--line, #d7dce8);
  background: #fff;
  padding: 12px;
  box-sizing: border-box;
}

.ad-sidebar-card-preview .rail-kicker {
  display: inline-block;
  margin: 0 0 8px;
}

.ad-sidebar-card-preview .ad-image-preview {
  width: 100%;
  max-width: none;
  min-height: 0;
  aspect-ratio: 300 / 250;
  margin: 0 0 12px;
  border: 1px solid var(--line, #d7dce8);
  border-style: solid;
}

.ad-sidebar-card-preview .ad-image-preview img {
  width: 100%;
  height: 100%;
}

.ad-sidebar-card-preview .ad-sidebar-copy-preview {
  width: 100%;
  max-width: none;
  margin: 0;
  border: 0;
  padding: 0;
  background: transparent;
}

.ad-sidebar-crop-tools {
  width: 100%;
  max-width: 300px;
  margin-left: auto;
  margin-right: auto;
}

/* Make the ad schedule box match the Placements fieldset style. */
.ad-schedule-fieldset legend {
  padding: 0 6px;
  font-weight: 900;
  color: var(--navy);
}

.ad-schedule-fieldset .ad-schedule-grid {
  margin-top: 10px;
}

/* Admin ad review: show each creative in the actual public shape. */
.admin-ad-review-previews {
  width: 100%;
  max-width: 100%;
}

.admin-ad-preview-list {
  display: grid;
  gap: 1.25rem;
  width: 100%;
  max-width: 980px;
}

.admin-ad-preview-section {
  display: grid;
  gap: .5rem;
  align-items: start;
}

.admin-ad-preview-section .ad-preview-placement-heading {
  margin: 0;
  color: var(--navy, #11194c);
  font-size: .95rem;
  font-weight: 900;
}

.admin-ad-sidebar-preview {
  width: 300px;
  max-width: 100%;
}

.admin-ad-image-only-preview {
  display: grid;
  gap: .55rem;
  text-decoration: none;
  color: inherit;
  border: 1px solid var(--line, #d7dce8);
  background: #fff;
  padding: .75rem;
  width: fit-content;
  max-width: 100%;
}

.admin-ad-image-only-preview .rail-kicker {
  justify-self: start;
}

.admin-ad-image-only-preview img {
  display: block;
  width: 100%;
  height: auto;
  object-fit: cover;
  background: #050712;
}

.admin-ad-banner-only-preview {
  width: min(970px, 100%);
}

.admin-ad-banner-only-preview img {
  aspect-ratio: 970 / 250;
}

.admin-ad-mobile-only-preview {
  width: 320px;
}

.admin-ad-mobile-only-preview img {
  aspect-ratio: 320 / 100;
}

@media (max-width: 980px) {
  .admin-ad-preview-list {
    max-width: 100%;
  }
}

/* Advertiser reporting */
.ad-report-row {
  align-items: flex-start;
  gap: 1rem;
}

.ad-report-main {
  flex: 1 1 auto;
  min-width: 0;
}

.ad-report-mini-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: .55rem;
  margin-top: .65rem;
}

.ad-report-mini-grid span,
.ad-report-stat-grid > div {
  display: block;
  border: 1px solid rgba(15, 23, 42, .12);
  border-radius: 12px;
  background: rgba(255, 255, 255, .78);
  padding: .65rem .75rem;
}

.ad-report-mini-grid strong,
.ad-report-stat-grid strong {
  display: block;
  color: #0f172a;
  font-size: 1.05rem;
  line-height: 1.1;
}

.ad-report-mini-grid small,
.ad-report-stat-grid span {
  display: block;
  margin-top: .2rem;
  color: #64748b;
  font-size: .78rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .04em;
}

.ad-report-summary {
  margin: .55rem 0 0;
  color: #475569;
  font-size: .9rem;
}

.ad-report-card {
  border: 1px solid rgba(15, 23, 42, .12);
  border-radius: 18px;
  background: linear-gradient(180deg, rgba(248, 250, 252, .98), rgba(255, 255, 255, .96));
  box-shadow: 0 14px 35px rgba(15, 23, 42, .08);
  padding: 1rem;
  margin: 1rem 0;
}

.ad-report-heading {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  align-items: flex-start;
  margin-bottom: 1rem;
}

.ad-report-heading h3 {
  margin: .25rem 0 0;
}

.ad-report-heading .membership-note {
  max-width: 36rem;
  margin: 0;
}

.ad-report-stat-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: .75rem;
  margin-bottom: 1rem;
}

.ad-report-table-wrap {
  overflow-x: auto;
  margin-top: 1rem;
}

.ad-report-table-wrap h4 {
  margin: 0 0 .5rem;
}

.ad-report-table {
  width: 100%;
  border-collapse: collapse;
  min-width: 680px;
  font-size: .92rem;
}

.ad-report-table th,
.ad-report-table td {
  padding: .65rem .75rem;
  border-bottom: 1px solid rgba(15, 23, 42, .1);
  text-align: left;
  white-space: nowrap;
}

.ad-report-table th {
  color: #475569;
  font-size: .78rem;
  text-transform: uppercase;
  letter-spacing: .04em;
  background: rgba(241, 245, 249, .72);
}

@media (max-width: 760px) {
  .ad-report-mini-grid,
  .ad-report-stat-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .ad-report-heading {
    display: block;
  }

  .ad-report-heading .membership-note {
    margin-top: .75rem;
  }
}

/* Ad wallet / phase 1 CPC billing */
.ad-wallet-card {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  padding: 1rem;
  margin: 1rem 0;
  border: 1px solid var(--line, #d7dce8);
  background: #fff;
  box-shadow: 0 1px 0 rgba(8, 14, 48, 0.04);
}
.ad-wallet-card h3 {
  margin: .35rem 0;
  font-size: 1.1rem;
}
.ad-wallet-note {
  max-width: 360px;
  color: var(--muted, #626b82);
  font-size: .9rem;
  line-height: 1.4;
}
.ad-editor-wallet-card {
  align-items: flex-start;
}
@media (max-width: 760px) {
  .ad-wallet-card {
    display: block;
  }
  .ad-wallet-note {
    max-width: none;
    margin-top: .75rem;
  }
}

/* Advertiser wallet reporting */
.ad-wallet-balance-hero {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1rem;
  margin: 1rem 0;
}
.ad-wallet-balance-hero > div {
  border: 1px solid var(--line, #d7dce8);
  background: #fff;
  padding: 1rem;
  box-shadow: 0 1px 0 rgba(8, 14, 48, 0.04);
}
.ad-wallet-balance-hero small,
.ad-wallet-balance-hero span {
  display: block;
  color: var(--muted, #626b82);
}
.ad-wallet-balance-hero strong {
  display: block;
  margin: .25rem 0;
  font-size: 1.55rem;
  line-height: 1.1;
}
.ad-wallet-full-note {
  max-width: none;
  margin: 1rem 0;
}
.ad-wallet-section {
  margin-top: 1.5rem;
}
.ad-wallet-report-grid {
  margin-top: 1rem;
}
@media (max-width: 760px) {
  .ad-wallet-balance-hero {
    grid-template-columns: 1fr;
  }
}

/* Admin wallet credit tools */
.admin-card {
  background: #fff;
  border: 1px solid var(--line, #d9dee8);
  box-shadow: 0 12px 30px rgba(12, 20, 46, 0.06);
  padding: 1rem;
  margin: 1rem 0;
}
.admin-card h2 {
  margin: 0 0 .35rem;
}
.admin-muted {
  color: var(--muted, #667085);
  font-weight: 700;
}
.admin-form-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .85rem;
  align-items: end;
}
.admin-form-grid label {
  display: grid;
  gap: .3rem;
  font-weight: 900;
  color: var(--ink, #101828);
  text-transform: uppercase;
  letter-spacing: .04em;
  font-size: .78rem;
}
.admin-form-grid input,
.admin-form-grid select {
  width: 100%;
  border: 1px solid var(--line, #d9dee8);
  background: #fff;
  padding: .7rem .75rem;
  font: inherit;
  text-transform: none;
  letter-spacing: normal;
}
.admin-form-wide {
  grid-column: 1 / -1;
}
.admin-form-actions {
  display: flex;
  justify-content: flex-end;
}
.alert.error {
  border: 1px solid #f1b5b5;
  background: #fff5f5;
  color: #8a1f1f;
  padding: .8rem 1rem;
  font-weight: 900;
  margin: 1rem 0;
}
@media (max-width: 800px) {
  .admin-form-grid {
    grid-template-columns: 1fr;
  }
}

/* PayPal wallet top-up */
.account-success,
.account-notice,
.account-error {
  border: 1px solid var(--line, #d7dce8);
  background: #fff;
  padding: .85rem 1rem;
  margin: 1rem 0;
  font-weight: 800;
}
.account-success {
  border-color: #b8dfc2;
  background: #f1fbf4;
}
.account-notice {
  border-color: #d7dce8;
  background: #f8fafc;
}
.account-error {
  border-color: #efb6b6;
  background: #fff5f5;
}
.ad-wallet-topup-section {
  border: 1px solid var(--line, #d7dce8);
  background: #fff;
  padding: 1rem;
}
.ad-wallet-topup-form {
  display: flex;
  flex-wrap: wrap;
  gap: .75rem;
  align-items: center;
  margin: 1rem 0;
}
.ad-wallet-topup-option {
  display: inline-flex;
  align-items: center;
  gap: .45rem;
  border: 1px solid var(--line, #d7dce8);
  background: #f8fafc;
  padding: .7rem .85rem;
  font-weight: 900;
  cursor: pointer;
}
.ad-wallet-topup-option input {
  width: auto;
}
.ad-wallet-topup-option:has(input:checked) {
  border-color: var(--navy, #141b4d);
  background: #eef2ff;
}

/* v31 campaign billing status UX */
.wallet-status-alert {
  margin: 1rem 0;
}
.billing-status-pill {
  display: inline-flex;
  align-items: center;
  border-radius: 999px;
  padding: 0.12rem 0.5rem;
  font-size: 0.78rem;
  font-weight: 800;
  line-height: 1.2;
  background: rgba(15, 23, 42, 0.08);
  color: #334155;
}
.billing-status-active {
  background: rgba(34, 197, 94, 0.14);
  color: #166534;
}
.billing-status-warning {
  background: rgba(245, 158, 11, 0.18);
  color: #92400e;
}
.billing-status-danger {
  background: rgba(239, 68, 68, 0.14);
  color: #991b1b;
}
.billing-status-muted {
  background: rgba(100, 116, 139, 0.14);
  color: #475569;
}
.ad-billing-warning {
  margin: 0.45rem 0 0;
  color: #991b1b;
  font-weight: 700;
}

/* v32 wallet cleanup: top action button + PayPal add-funds modal */
.wallet-page-actions {
  justify-content: flex-start;
}
.wallet-add-funds-top {
  margin-left: auto;
}
.wallet-page-status {
  margin: 0 0 1rem;
}
.ad-wallet-performance-section .ad-wallet-report-grid {
  margin-top: 0;
}
.wallet-topup-modal[hidden] {
  display: none !important;
}
.wallet-topup-modal {
  position: fixed;
  inset: 0;
  z-index: 10000;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1.25rem;
}
.wallet-topup-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(10, 15, 35, .62);
}
.wallet-topup-card {
  position: relative;
  z-index: 1;
  width: min(100%, 620px);
  max-height: calc(100vh - 2.5rem);
  overflow: auto;
  border: 1px solid var(--line, #d7dce8);
  background: #fff;
  box-shadow: 0 24px 70px rgba(10, 15, 35, .28);
  padding: 1.25rem;
}
.wallet-topup-card h3 {
  margin: .35rem 2.25rem .35rem 0;
}
.wallet-topup-close {
  position: absolute;
  top: .75rem;
  right: .75rem;
  width: 2rem;
  height: 2rem;
  border: 1px solid var(--line, #d7dce8);
  background: #fff;
  color: var(--navy, #141b4d);
  font-size: 1.45rem;
  line-height: 1;
  font-weight: 900;
  cursor: pointer;
}
.wallet-topup-options {
  display: flex;
  flex-wrap: wrap;
  gap: .75rem;
}
.wallet-custom-amount {
  display: block;
  width: min(100%, 260px);
  margin: .85rem 0 0;
  font-weight: 900;
}
.wallet-custom-amount-row {
  display: flex;
  align-items: stretch;
  margin-top: .3rem;
}
.wallet-dollar-prefix,
.wallet-custom-amount input {
  height: 46px;
  box-sizing: border-box;
  margin: 0;
  line-height: 1;
}
.wallet-dollar-prefix {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 2.25rem;
  border: 1px solid var(--line, #d7dce8);
  border-right: 0;
  background: #f8fafc;
  font-weight: 900;
}
.wallet-custom-amount input {
  width: 100%;
  min-width: 0;
  border: 1px solid var(--line, #d7dce8);
  padding: 0 .75rem;
  font: inherit;
  font-weight: 900;
}
.wallet-topup-actions {
  display: flex;
  flex-wrap: wrap;
  gap: .75rem;
  align-items: center;
  margin-top: 1rem;
}
body.wallet-topup-modal-open {
  overflow: hidden;
}
@media (max-width: 760px) {
  .wallet-add-funds-top {
    margin-left: 0;
    width: 100%;
  }
  .wallet-page-actions .button,
  .wallet-page-actions .admin-action-link {
    width: 100%;
    text-align: center;
  }
  .wallet-topup-modal {
    align-items: flex-start;
    padding: .8rem;
  }
  .wallet-topup-card {
    max-height: calc(100vh - 1.6rem);
  }
}

/* v33 wallet modal validation: keep top-up errors inside the modal */
.wallet-modal-error {
  margin: .85rem 0 1rem;
}
.wallet-custom-amount input[aria-invalid="true"] {
  border-color: #b4532f;
  box-shadow: 0 0 0 2px rgba(180, 83, 47, .16);
}

/* v35 ad campaigns cleanup: simpler wallet card + clearer campaign cards */
.ad-campaigns-page-actions {
  align-items: center;
}
.ad-campaigns-clean-page .ad-campaigns-intro {
  max-width: 46rem;
  margin-bottom: 1rem;
}
.ad-wallet-summary-card {
  align-items: center;
  margin: 1.15rem 0 1.5rem;
  background: linear-gradient(180deg, #fff, #fbfcff);
}
.ad-wallet-summary-main {
  display: grid;
  gap: .25rem;
  min-width: 0;
}
.ad-wallet-summary-main small,
.ad-campaign-meta-grid span,
.ad-campaign-placements span {
  color: #64748b;
  font-size: .78rem;
  font-weight: 900;
  letter-spacing: .04em;
  text-transform: uppercase;
}
.ad-wallet-summary-main > strong {
  color: #0f172a;
  font-size: 1.75rem;
  line-height: 1;
}
.ad-wallet-summary-main p {
  margin: .25rem 0 0;
  color: var(--muted, #626b82);
  font-weight: 800;
  max-width: 52rem;
}
.ad-wallet-summary-actions {
  display: flex;
  flex-wrap: wrap;
  gap: .65rem;
  justify-content: flex-end;
  align-items: center;
}
.ad-campaign-list-section {
  margin-top: 1.25rem;
}
.ad-campaign-section-heading {
  margin-bottom: .75rem;
}
.ad-campaign-section-heading h3 {
  margin: .25rem 0 0;
}
.ad-campaign-clean-list {
  display: grid;
  gap: 1rem;
}
.ad-campaign-clean-row {
  display: block;
  border-radius: 0;
  background: #fff;
  padding: 1rem;
}
.ad-campaign-row-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: .85rem;
}
.ad-campaign-row-head strong {
  font-size: 1.05rem;
}
.ad-campaign-row-head .admin-action-link {
  flex: 0 0 auto;
}
.ad-campaign-meta-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .75rem;
  margin: .75rem 0;
}
.ad-campaign-meta-grid > div {
  border: 1px solid rgba(15, 23, 42, .10);
  background: #f8fafc;
  padding: .7rem .75rem;
}
.ad-campaign-meta-grid strong {
  display: block;
  margin-top: .18rem;
  color: #0f172a;
}
.ad-campaign-placements {
  margin: .85rem 0;
  border: 1px solid rgba(15, 23, 42, .10);
  background: #fff;
  padding: .75rem;
}
.ad-campaign-placements p {
  margin: .2rem 0 0;
  color: #475569;
  font-weight: 800;
}
.ad-campaign-clean-stats {
  margin-top: .85rem;
}
@media (max-width: 760px) {
  .ad-campaign-row-head,
  .ad-wallet-summary-card,
  .ad-wallet-summary-actions {
    display: grid;
    justify-content: stretch;
  }
  .ad-campaign-meta-grid {
    grid-template-columns: 1fr;
  }
  .ad-wallet-summary-actions .button,
  .ad-wallet-summary-actions .admin-action-link,
  .ad-campaign-row-head .admin-action-link {
    width: 100%;
    text-align: center;
  }
}

/* v36 ad campaigns refinement: remove redundant headings, match wallet action heights */
.ad-campaigns-clean-page {
  padding-top: 1.35rem;
}
.ad-campaigns-clean-page .ad-campaigns-intro {
  margin-top: 0;
}
.ad-wallet-summary-actions .admin-action-link,
.ad-wallet-summary-actions .button {
  min-height: 44px;
  padding: .7rem .9rem;
  box-sizing: border-box;
  font-size: .88rem;
  line-height: 1;
}
.ad-campaign-section-heading h3 {
  margin-top: 0;
}

/* Public banner placements use the uploaded banner creative only.
   Sidebar ads keep the normal card layout with headline, text, and CTA. */
.public-ad-banner-image-only {
  display: block;
  padding: .75rem;
  max-width: 100%;
}
.public-ad-banner-image-only .rail-kicker {
  display: inline-block;
  margin: 0 0 .75rem;
}
.public-ad-banner-image-only .public-ad-image {
  display: block;
  width: 100%;
  max-width: 970px;
  aspect-ratio: 970 / 250;
  margin: 0 auto;
  background: #050816;
  overflow: hidden;
}
.public-ad-banner-image-only .public-ad-image picture,
.public-ad-banner-image-only .public-ad-image img {
  display: block;
  width: 100%;
  height: 100%;
}
.public-ad-banner-image-only .public-ad-image img {
  object-fit: contain;
}
.public-ad-banner-image-only h3,
.public-ad-banner-image-only p,
.public-ad-banner-image-only .rail-button {
  display: none;
}
@media (max-width: 760px) {
  .public-ad-banner-image-only {
    padding: .65rem;
  }
  .public-ad-banner-image-only .public-ad-image {
    max-width: 100%;
  }
}

/* Banner image-only ads should fill the available public page width.
   Keep sidebar ads on the normal text/card layout. */
.home-banner-ad,
.category-banner-ad,
.story-banner-ad {
  width: 100%;
}
.public-ad-banner-image-only {
  width: 100%;
  box-sizing: border-box;
}
.public-ad-banner-image-only .public-ad-image {
  width: 100%;
  max-width: none;
  margin: 0;
  aspect-ratio: 970 / 250;
}
.public-ad-banner-image-only .public-ad-image picture,
.public-ad-banner-image-only .public-ad-image img {
  width: 100%;
  height: 100%;
}
.public-ad-banner-image-only .public-ad-image img {
  object-fit: cover;
}

/* Force public banner ads to use the full available page width.
   This overrides the older 970px preview/banner max-width rule. */
.ad-banner-slot > .public-ad-card.ad-card-banner.public-ad-banner-image-only,
.home-banner-ad > .public-ad-card.ad-card-banner.public-ad-banner-image-only,
.category-banner-ad > .public-ad-card.ad-card-banner.public-ad-banner-image-only,
.story-banner-ad > .public-ad-card.ad-card-banner.public-ad-banner-image-only {
  width: 100%;
  max-width: none;
}
.ad-banner-slot > .public-ad-card.ad-card-banner.public-ad-banner-image-only .public-ad-image,
.home-banner-ad > .public-ad-card.ad-card-banner.public-ad-banner-image-only .public-ad-image,
.category-banner-ad > .public-ad-card.ad-card-banner.public-ad-banner-image-only .public-ad-image,
.story-banner-ad > .public-ad-card.ad-card-banner.public-ad-banner-image-only .public-ad-image {
  width: 100%;
  max-width: none;
  margin-left: 0;
  margin-right: 0;
}

/* v39: standalone campaign pages + separated report/edit actions */
.account-tabs-nav a.account-tab-label {
  text-decoration: none;
}

.ad-campaign-row-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 0.5rem;
  flex-wrap: wrap;
}

.ad-campaign-row-actions .admin-action-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.ad-campaign-report-page .ad-report-page-head {
  margin-bottom: 1rem;
}

.ad-campaign-report-page .ad-report-page-head h2 {
  margin: 0.35rem 0 0;
}

.ad-campaign-report-page .ad-report-card {
  margin-top: 1rem;
}

/* v40 campaign pages: consistent navigation and less badge-like clutter */
.campaign-page-nav {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .55rem;
  margin: .65rem 0 1.35rem;
}
.campaign-nav-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 42px;
  padding: .72rem 1rem;
  border: 1px solid #d6dbe6;
  background: #fff;
  color: #101735;
  font-weight: 900;
  font-size: .88rem;
  line-height: 1;
  text-transform: uppercase;
  letter-spacing: .02em;
  text-decoration: none;
  border-radius: 3px;
  box-shadow: 0 1px 0 rgba(15, 23, 42, .04);
}
.campaign-nav-link:hover,
.campaign-nav-link:focus {
  border-color: #a64f2f;
  color: #a64f2f;
  text-decoration: none;
}
.campaign-nav-link.active {
  border-color: #101735;
  background: #101735;
  color: #fff;
}
.campaign-nav-link.secondary {
  background: #f8fafc;
}
.ad-campaign-report-page .ad-report-page-head h2 {
  margin-top: 0;
}
.ad-campaign-editor .ad-editor-intro {
  margin-top: 0;
}
@media (max-width: 720px) {
  .campaign-page-nav {
    display: grid;
    grid-template-columns: 1fr 1fr;
  }
  .campaign-nav-link {
    width: 100%;
  }
}

/* v41 advertising pages: breadcrumbs for navigation, buttons only for actions */
.ad-page-topbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  margin: .55rem 0 1.35rem;
}
.account-breadcrumb {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: .4rem;
  color: #667085;
  font-size: .86rem;
  font-weight: 900;
  letter-spacing: .03em;
  text-transform: uppercase;
}
.account-breadcrumb a {
  color: #101735;
  text-decoration: none;
}
.account-breadcrumb a:hover,
.account-breadcrumb a:focus {
  color: #a64f2f;
  text-decoration: underline;
}
.account-breadcrumb span[aria-current="page"] {
  color: #a64f2f;
}
.account-breadcrumb span[aria-hidden="true"] {
  color: #98a2b3;
  font-weight: 700;
}
.ad-page-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: .6rem;
}
.ad-page-actions .button,
.ad-page-actions button.button {
  min-height: 42px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin: 0;
  white-space: nowrap;
}
.ad-page-actions .button.secondary {
  background: #fff;
}
@media (max-width: 720px) {
  .ad-page-topbar {
    align-items: flex-start;
    flex-direction: column;
  }
  .ad-page-actions {
    width: 100%;
    justify-content: flex-start;
  }
}

/* Account tabs: keep the selected tab style consistent across every account tab. */
.account-dashboard-panel #account-tab-profile:checked ~ .account-tabs-nav .account-tab-profile-label,
.account-dashboard-panel #account-tab-reporter:checked ~ .account-tabs-nav .account-tab-reporter-label,
.account-dashboard-panel #account-tab-stories:checked ~ .account-tabs-nav .account-tab-stories-label,
.account-dashboard-panel #account-tab-ads:checked ~ .account-tabs-nav .account-tab-ads-label {
  background: #fff !important;
  color: var(--navy) !important;
  border-color: #dce2ee !important;
  border-bottom-color: #fff !important;
  box-shadow: inset 0 3px 0 var(--red) !important;
}

.account-dashboard-panel .account-tabs-nav .account-tab-label {
  min-height: 34px;
  align-items: center;
}

/* v43: remove duplicate divider between category chips and homepage banner ad. */
.category-strip + .ad-banner-slot.home-banner-ad {
  border-top: 0;
  margin-top: 0;
}


/* v44: category pages should have one divider after the category chips.
   The chip row already has a bottom border, so remove the extra top border
   when a category banner directly follows it. This matches the homepage fix. */
.category-strip + .ad-banner-slot.category-banner-ad {
  border-top: 0;
  margin-top: 0;
}

/* Keep the category index page aligned with individual category pages when
   the shared category banner is present. */
.category-banner-ad + .category-directory,
.category-strip + .category-directory {
  margin-top: 1.25rem;
}

/* Account dropdown and standalone account dashboard */
.main-nav .account-nav-menu {
  position: relative;
  display: inline-flex;
  align-items: center;
  margin: 0;
}

.main-nav .account-nav-menu summary {
  list-style: none;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  color: inherit;
  font: inherit;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  padding: 0.4rem 0;
}

.main-nav .account-nav-menu summary::-webkit-details-marker {
  display: none;
}

.main-nav .account-nav-menu summary::after {
  content: "▾";
  font-size: 0.75em;
  line-height: 1;
  transform: translateY(-1px);
}

.main-nav .account-nav-menu[open] summary::after {
  content: "▴";
}

.account-nav-dropdown {
  position: absolute;
  top: calc(100% + 0.55rem);
  right: 0;
  z-index: 50;
  min-width: 210px;
  padding: 0.45rem;
  background: #fff;
  border: 1px solid var(--border);
  box-shadow: 0 18px 45px rgba(12, 19, 55, 0.18);
}

.account-nav-dropdown a {
  display: block;
  padding: 0.62rem 0.7rem;
  color: var(--ink) !important;
  text-decoration: none;
  white-space: nowrap;
  font-size: 0.82rem;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: 0.035em;
}

.account-nav-dropdown a:hover,
.account-nav-dropdown a:focus {
  background: var(--paper-soft);
  color: var(--accent) !important;
}

.account-home-links {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
  margin-top: 1.4rem;
}

.account-home-card {
  display: grid;
  gap: 0.45rem;
  padding: 1rem;
  border: 1px solid var(--border);
  background: #fff;
  color: var(--ink);
  text-decoration: none;
}

.account-home-card strong {
  font-size: 1.1rem;
  line-height: 1.1;
}

.account-home-card span:last-child {
  color: var(--muted);
  font-weight: 700;
  line-height: 1.35;
}

.account-home-card:hover,
.account-home-card:focus {
  border-color: var(--accent);
  box-shadow: 0 10px 26px rgba(12, 19, 55, 0.08);
  transform: translateY(-1px);
}

.account-standalone-section {
  margin-top: 1rem;
}

.account-standalone-section .account-tab-panels {
  margin-top: 0;
}

@media (max-width: 760px) {
  .main-nav .account-nav-menu {
    display: block;
    width: 100%;
  }

  .main-nav .account-nav-menu summary {
    width: 100%;
  }

  .account-nav-dropdown {
    position: static;
    min-width: 0;
    margin-top: 0.45rem;
    box-shadow: none;
  }

  .account-home-links {
    grid-template-columns: 1fr;
  }
}


/* v46 account menu and standalone account page polish */
.main-nav .account-nav-menu summary:hover,
.main-nav .account-nav-menu summary:focus {
  color: #fff;
}

.account-nav-dropdown {
  padding: 0.35rem;
}

.account-nav-dropdown a {
  color: var(--ink) !important;
}

.account-nav-dropdown a:hover,
.account-nav-dropdown a:focus {
  background: var(--red) !important;
  color: #fff !important;
  text-decoration: none;
}

.account-nav-dropdown a[href="/account/logout"] {
  margin-top: 0.25rem;
  background: var(--red);
  color: #fff !important;
}

.account-nav-dropdown a[href="/account/logout"]:hover,
.account-nav-dropdown a[href="/account/logout"]:focus {
  background: var(--red-dark) !important;
  color: #fff !important;
}

.account-panel > .account-breadcrumb,
.account-page > .account-breadcrumb {
  margin-top: 0.45rem;
  margin-bottom: 1.35rem;
}

.account-breadcrumb {
  line-height: 1.35;
}

.account-profile-grid {
  grid-template-columns: minmax(280px, 560px) 1fr;
  align-items: start;
}

.account-profile-grid > label:not(.checkbox-label) {
  grid-column: 1;
}

.account-profile-grid .account-email-pref {
  grid-column: 1;
  margin-top: 0.15rem;
  align-self: start;
}

.account-profile-grid .account-email-pref input {
  flex: 0 0 auto;
}

.account-page-topbar {
  margin-bottom: 1rem;
}

@media (max-width: 760px) {
  .account-profile-grid {
    grid-template-columns: 1fr;
  }
}

/* v46 account layout polish: align standalone account pages and account home spacing */
.account-panel > h1 + .account-breadcrumb {
  margin-top: 0.85rem;
  margin-bottom: 1.35rem;
}

.account-dashboard-panel {
  max-width: 1140px;
  padding: clamp(1.25rem, 4vw, 2.2rem);
}

.account-dashboard-panel .account-membership-summary-card {
  margin-top: 0.85rem;
  margin-bottom: 1.35rem;
  padding: 0.85rem 1rem;
}

.account-dashboard-panel .account-home-links {
  margin-top: 1.35rem;
  gap: 1.2rem 1.6rem;
}

.account-dashboard-panel .account-home-card {
  padding: 1.15rem 1rem;
}

@media (max-width: 760px) {
  .account-dashboard-panel {
    padding: 1.25rem;
  }

  .account-panel > h1 + .account-breadcrumb {
    margin-top: 0.65rem;
  }
}


/* v48 mobile header repair: prevent horizontal overflow and make hamburger menu work with JS. */
@media (max-width: 760px) {
  html,
  body {
    max-width: 100%;
    overflow-x: hidden;
  }

  .site-header .network-bar {
    display: none;
  }

  .site-header .masthead {
    min-height: 76px;
  }

  .site-header .masthead-inner {
    width: 100% !important;
    min-height: 76px;
    padding: 0 .75rem;
    gap: .65rem;
    position: relative;
  }

  .site-header .brand {
    flex: 1 1 auto;
    min-width: 0;
    align-self: center;
    overflow: visible;
  }

  .site-header .brand-logo-box {
    width: 56px !important;
    height: 56px !important;
    flex: 0 0 56px !important;
    margin: 0 !important;
  }

  .site-header .brand-text {
    font-size: clamp(1.35rem, 7.8vw, 1.95rem) !important;
    line-height: .92;
    white-space: nowrap;
  }

  .mobile-menu-toggle {
    display: inline-flex !important;
    flex: 0 0 42px;
    position: relative;
    z-index: 120;
    border: 1px solid rgba(255,255,255,.18);
    border-radius: 3px;
  }

  .site-header .main-nav {
    display: none !important;
    position: absolute;
    left: .75rem;
    right: .75rem;
    top: calc(100% + .4rem);
    z-index: 1000;
    width: auto;
    min-width: 0;
    max-width: none;
    flex-direction: column;
    align-items: stretch;
    justify-content: flex-start;
    gap: .15rem;
    padding: .5rem;
    background: var(--navy);
    border: 1px solid rgba(255,255,255,.22);
    box-shadow: 0 18px 40px rgba(7, 27, 77, .32);
    white-space: normal;
  }

  .site-header .main-nav.is-open,
  .site-header .main-nav.open {
    display: flex !important;
  }

  .site-header .main-nav > a,
  .site-header .main-nav .account-nav-menu summary {
    width: 100%;
    padding: .75rem .85rem;
    color: #fff !important;
    text-align: left;
    border-radius: 2px;
  }

  .site-header .main-nav > a:hover,
  .site-header .main-nav > a:focus,
  .site-header .main-nav .account-nav-menu summary:hover,
  .site-header .main-nav .account-nav-menu summary:focus {
    background: rgba(255,255,255,.12);
    color: #fff !important;
  }

  .site-header .main-nav > a:last-child {
    margin-top: .2rem;
    background: var(--red);
    border-color: rgba(255,255,255,.2);
  }

  .main-nav .account-nav-menu {
    display: block;
    width: 100%;
  }

  .account-nav-dropdown {
    position: static !important;
    width: 100%;
    min-width: 0;
    margin: .2rem 0 .35rem;
    padding: .25rem;
    background: #fff;
    box-shadow: none;
  }

  .account-nav-dropdown a {
    white-space: normal;
  }

  .site-header .trend-bar {
    overflow: hidden !important;
  }

  .site-header .trend-inner {
    width: 100% !important;
    min-height: 40px;
    padding: .45rem .75rem;
    gap: .9rem;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    white-space: nowrap;
    -webkit-overflow-scrolling: touch;
  }
}

@media (max-width: 420px) {
  .site-header .brand-logo-box {
    width: 50px !important;
    height: 50px !important;
    flex-basis: 50px !important;
  }

  .site-header .brand {
    gap: .5rem;
  }

  .site-header .brand-text {
    font-size: clamp(1.15rem, 7.5vw, 1.65rem) !important;
    letter-spacing: -.06em;
  }
}


/* v49 mobile masthead compact repair: keep logo, title, and menu button on one row. */
@media (max-width: 760px) {
  .site-header .masthead {
    min-height: 64px !important;
  }

  .site-header .masthead-inner {
    min-height: 64px !important;
    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: .5rem !important;
    padding: .45rem .65rem !important;
  }

  .site-header .brand {
    flex: 1 1 auto !important;
    min-width: 0 !important;
    max-width: calc(100% - 46px) !important;
    gap: .5rem !important;
  }

  .site-header .brand-logo-box {
    width: 46px !important;
    height: 46px !important;
    flex: 0 0 46px !important;
    margin: 0 !important;
  }

  .site-header .brand-text {
    display: block !important;
    min-width: 0 !important;
    max-width: 100% !important;
    font-size: clamp(1.22rem, 6.2vw, 1.7rem) !important;
    line-height: .95 !important;
    letter-spacing: -.045em !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }

  .mobile-menu-toggle {
    flex: 0 0 38px !important;
    width: 38px !important;
    height: 36px !important;
    margin-left: auto !important;
  }

  .site-header .trend-bar {
    display: none !important;
  }

  .site-header .main-nav {
    top: calc(100% + .35rem) !important;
  }
}

@media (max-width: 420px) {
  .site-header .masthead {
    min-height: 58px !important;
  }

  .site-header .masthead-inner {
    min-height: 58px !important;
    padding: .4rem .55rem !important;
    gap: .45rem !important;
  }

  .site-header .brand-logo-box {
    width: 42px !important;
    height: 42px !important;
    flex-basis: 42px !important;
  }

  .site-header .brand-text {
    font-size: clamp(1.05rem, 5.9vw, 1.42rem) !important;
    letter-spacing: -.055em !important;
  }

  .mobile-menu-toggle {
    width: 36px !important;
    height: 34px !important;
    flex-basis: 36px !important;
  }
}

/* v50 tighter mobile masthead: move logo left and keep menu button in the same compact row. */
@media (max-width: 760px) {
  .site-header .masthead {
    min-height: 54px !important;
  }

  .site-header .masthead-inner {
    width: 100% !important;
    min-height: 54px !important;
    margin: 0 !important;
    padding: .32rem .5rem !important;
    gap: .42rem !important;
    position: relative !important;
  }

  .site-header .brand {
    flex: 1 1 auto !important;
    max-width: calc(100% - 44px) !important;
    min-width: 0 !important;
    gap: .45rem !important;
    align-self: center !important;
    margin: 0 !important;
  }

  .site-header .brand-logo-box {
    width: 40px !important;
    height: 40px !important;
    flex: 0 0 40px !important;
    margin: 0 !important;
    padding: 3px !important;
    border-width: 2px !important;
    box-shadow: inset 0 0 0 2px var(--navy), 0 3px 8px rgba(0,0,0,.18) !important;
  }

  .site-header .brand-text {
    font-size: clamp(1.08rem, 5.4vw, 1.55rem) !important;
    line-height: 1 !important;
    letter-spacing: -.045em !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }

  .mobile-menu-toggle {
    position: absolute !important;
    right: .5rem !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    width: 34px !important;
    height: 32px !important;
    flex: 0 0 34px !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  .hamburger,
  .hamburger::before,
  .hamburger::after {
    width: 17px !important;
  }

  .hamburger::before { top: -5px !important; }
  .hamburger::after { top: 5px !important; }

  .site-header .main-nav {
    top: calc(100% + .1rem) !important;
    left: .5rem !important;
    right: .5rem !important;
  }
}

@media (max-width: 420px) {
  .site-header .masthead {
    min-height: 50px !important;
  }

  .site-header .masthead-inner {
    min-height: 50px !important;
    padding: .3rem .45rem !important;
  }

  .site-header .brand-logo-box {
    width: 36px !important;
    height: 36px !important;
    flex-basis: 36px !important;
  }

  .site-header .brand-text {
    font-size: clamp(1rem, 5.25vw, 1.32rem) !important;
    letter-spacing: -.05em !important;
  }

  .mobile-menu-toggle {
    right: .45rem !important;
    width: 32px !important;
    height: 30px !important;
    flex-basis: 32px !important;
  }
}


/* v51 mobile masthead alignment: logo/title flush left, menu button flush right. */
@media (max-width: 760px) {
  .site-header .masthead {
    min-height: 50px !important;
  }

  .site-header .masthead-inner {
    max-width: none !important;
    width: 100% !important;
    min-height: 50px !important;
    margin: 0 !important;
    padding: .28rem .45rem !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: .45rem !important;
  }

  .site-header .brand {
    flex: 1 1 auto !important;
    max-width: calc(100% - 42px) !important;
    margin: 0 !important;
    padding: 0 !important;
    justify-content: flex-start !important;
    gap: .45rem !important;
  }

  .site-header .brand-logo-box {
    width: 34px !important;
    height: 34px !important;
    flex: 0 0 34px !important;
    margin: 0 !important;
    padding: 2px !important;
  }

  .site-header .brand-text {
    flex: 0 1 auto !important;
    max-width: calc(100vw - 92px) !important;
    text-align: left !important;
    font-size: clamp(1.02rem, 5.1vw, 1.32rem) !important;
    line-height: 1 !important;
    letter-spacing: -.045em !important;
  }

  .mobile-menu-toggle {
    position: static !important;
    transform: none !important;
    flex: 0 0 34px !important;
    width: 34px !important;
    height: 32px !important;
    margin: 0 0 0 auto !important;
  }

  .site-header .main-nav {
    top: calc(100% + .1rem) !important;
    left: .45rem !important;
    right: .45rem !important;
  }
}

@media (max-width: 420px) {
  .site-header .masthead-inner {
    padding-left: .35rem !important;
    padding-right: .35rem !important;
  }

  .site-header .brand {
    gap: .38rem !important;
    max-width: calc(100% - 38px) !important;
  }

  .site-header .brand-logo-box {
    width: 32px !important;
    height: 32px !important;
    flex-basis: 32px !important;
  }

  .site-header .brand-text {
    max-width: calc(100vw - 82px) !important;
    font-size: clamp(.98rem, 5vw, 1.22rem) !important;
  }

  .mobile-menu-toggle {
    flex-basis: 32px !important;
    width: 32px !important;
    height: 30px !important;
  }
}


/* v52 force mobile masthead to use the full viewport width.
   This overrides the desktop centered .masthead-inner width:min(...) rule. */
@media (max-width: 760px) {
  html,
  body {
    overflow-x: hidden !important;
  }

  .site-header,
  .site-header .masthead,
  .site-header .baboon-masthead {
    width: 100% !important;
    max-width: 100% !important;
  }

  .site-header .masthead .masthead-inner,
  .site-header .baboon-masthead .masthead-inner,
  .masthead-inner {
    width: 100vw !important;
    max-width: 100vw !important;
    min-width: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding: .28rem .45rem !important;
    box-sizing: border-box !important;
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    justify-content: space-between !important;
    column-gap: .45rem !important;
  }

  .site-header .brand,
  .masthead-inner > .brand {
    display: inline-flex !important;
    flex: 1 1 auto !important;
    width: auto !important;
    max-width: calc(100vw - 48px) !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: .42rem !important;
    order: 1 !important;
  }

  .site-header .brand-logo-box,
  .masthead-inner .brand-logo-box {
    width: 34px !important;
    height: 34px !important;
    flex: 0 0 34px !important;
    margin: 0 !important;
    padding: 2px !important;
    align-self: center !important;
  }

  .site-header .brand-text,
  .masthead-inner .brand-text {
    display: block !important;
    flex: 0 1 auto !important;
    min-width: 0 !important;
    max-width: calc(100vw - 92px) !important;
    text-align: left !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    font-size: clamp(1rem, 5vw, 1.28rem) !important;
    line-height: 1 !important;
    letter-spacing: -.045em !important;
  }

  .site-header .mobile-menu-toggle,
  .masthead-inner > .mobile-menu-toggle {
    position: static !important;
    transform: none !important;
    display: inline-flex !important;
    flex: 0 0 34px !important;
    width: 34px !important;
    height: 32px !important;
    margin: 0 !important;
    padding: 0 !important;
    order: 2 !important;
    align-self: center !important;
  }

  .site-header .main-nav {
    top: calc(100% + .1rem) !important;
    left: .45rem !important;
    right: .45rem !important;
  }
}

@media (max-width: 420px) {
  .site-header .masthead .masthead-inner,
  .site-header .baboon-masthead .masthead-inner,
  .masthead-inner {
    padding-left: .35rem !important;
    padding-right: .35rem !important;
  }

  .site-header .brand-logo-box,
  .masthead-inner .brand-logo-box {
    width: 32px !important;
    height: 32px !important;
    flex-basis: 32px !important;
  }

  .site-header .brand-text,
  .masthead-inner .brand-text {
    max-width: calc(100vw - 84px) !important;
    font-size: clamp(.95rem, 4.9vw, 1.18rem) !important;
  }

  .site-header .mobile-menu-toggle,
  .masthead-inner > .mobile-menu-toggle {
    flex-basis: 32px !important;
    width: 32px !important;
    height: 30px !important;
  }
}


/* v53 mobile masthead side padding: keep left/right breathing room while preserving compact row. */
@media (max-width: 760px) {
  .site-header .masthead .masthead-inner,
  .site-header .baboon-masthead .masthead-inner,
  .masthead-inner {
    width: 100% !important;
    max-width: none !important;
    padding-left: .8rem !important;
    padding-right: .8rem !important;
    box-sizing: border-box !important;
  }

  .site-header .brand,
  .masthead-inner > .brand {
    max-width: calc(100% - 46px) !important;
  }

  .site-header .brand-text,
  .masthead-inner .brand-text {
    max-width: calc(100vw - 112px) !important;
  }

  .site-header .main-nav {
    left: .8rem !important;
    right: .8rem !important;
  }
}

@media (max-width: 420px) {
  .site-header .masthead .masthead-inner,
  .site-header .baboon-masthead .masthead-inner,
  .masthead-inner {
    padding-left: .65rem !important;
    padding-right: .65rem !important;
  }

  .site-header .brand-text,
  .masthead-inner .brand-text {
    max-width: calc(100vw - 104px) !important;
  }

  .site-header .main-nav {
    left: .65rem !important;
    right: .65rem !important;
  }
}


/* v54 mobile masthead height: target an approximately 70px tall header row. */
@media (max-width: 760px) {
  .site-header .masthead,
  .site-header .baboon-masthead {
    min-height: 70px !important;
  }

  .site-header .masthead .masthead-inner,
  .site-header .baboon-masthead .masthead-inner,
  .masthead-inner {
    min-height: 70px !important;
    padding-top: .65rem !important;
    padding-bottom: .65rem !important;
    padding-left: .8rem !important;
    padding-right: .8rem !important;
    box-sizing: border-box !important;
  }

  .site-header .brand-logo-box,
  .masthead-inner .brand-logo-box {
    width: 42px !important;
    height: 42px !important;
    flex: 0 0 42px !important;
  }

  .site-header .brand-text,
  .masthead-inner .brand-text {
    font-size: clamp(1.15rem, 5.25vw, 1.55rem) !important;
    line-height: 1 !important;
    max-width: calc(100vw - 122px) !important;
  }

  .site-header .mobile-menu-toggle,
  .masthead-inner > .mobile-menu-toggle {
    width: 38px !important;
    height: 36px !important;
    flex: 0 0 38px !important;
  }

  .site-header .main-nav {
    top: calc(100% + .15rem) !important;
  }
}

@media (max-width: 420px) {
  .site-header .masthead,
  .site-header .baboon-masthead {
    min-height: 70px !important;
  }

  .site-header .masthead .masthead-inner,
  .site-header .baboon-masthead .masthead-inner,
  .masthead-inner {
    min-height: 70px !important;
    padding-left: .65rem !important;
    padding-right: .65rem !important;
  }

  .site-header .brand-logo-box,
  .masthead-inner .brand-logo-box {
    width: 40px !important;
    height: 40px !important;
    flex-basis: 40px !important;
  }

  .site-header .brand-text,
  .masthead-inner .brand-text {
    font-size: clamp(1.05rem, 5vw, 1.36rem) !important;
    max-width: calc(100vw - 112px) !important;
  }

  .site-header .mobile-menu-toggle,
  .masthead-inner > .mobile-menu-toggle {
    width: 36px !important;
    height: 34px !important;
    flex-basis: 36px !important;
  }
}


/* v55 story card image fit: avoid white gutters in compact story cards. */
.story-card .thumb.has-image,
.compact-grid .story-card .thumb.has-image {
  aspect-ratio: 16 / 9 !important;
  min-height: 0 !important;
  background: #071b4d !important;
}

.story-card .thumb.has-image img,
.compact-grid .story-card .thumb.has-image img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center center !important;
}

/* Keep lead/banner-style thumbs unchanged; this only targets story cards. */


/* v56 restore story-card breathing room and force card thumbnails to fill their frame. */
.story-grid {
  gap: 1rem !important;
}

.story-grid .story-card {
  padding: .85rem !important;
  border: 1px solid var(--line) !important;
  background: #fff !important;
  box-sizing: border-box !important;
}

.story-grid .story-card:nth-child(3n) {
  border-right: 1px solid var(--line) !important;
}

.story-grid .story-card .story-link,
.compact-grid .story-link {
  display: block !important;
  width: 100% !important;
}

.story-grid .story-card .thumb.has-image,
.compact-grid .thumb.has-image {
  width: 100% !important;
  min-height: 0 !important;
  aspect-ratio: 16 / 9 !important;
  max-height: none !important;
  margin: 0 0 .7rem !important;
  background: #071b4d !important;
  overflow: hidden !important;
  box-sizing: border-box !important;
}

.story-grid .story-card .thumb.has-image img,
.compact-grid .thumb.has-image img {
  position: absolute !important;
  inset: 0 !important;
  display: block !important;
  width: 100% !important;
  max-width: none !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center center !important;
}

/* Give the lead story/main feature the same left/right breathing room without touching ad banners. */
.lead-story {
  padding: .9rem .9rem 1.1rem !important;
  border: 1px solid var(--line) !important;
  box-sizing: border-box !important;
}

.lead-story .lead-link {
  min-width: 0 !important;
}

.lead-story .lead-image.has-image {
  width: 100% !important;
  box-sizing: border-box !important;
}

.lead-story .lead-image.has-image img {
  object-fit: cover !important;
  object-position: center center !important;
}

@media (max-width: 760px) {
  .story-grid .story-card {
    padding: .75rem !important;
  }

  .lead-story {
    padding: .75rem !important;
  }
}


/* v57 restore lead-story spacing and fix story-card image gutters.
   The lead story should not have the extra inset padding/card border added in v56. */
.lead-story {
  background: var(--paper) !important;
  padding: 0 0 1.1rem !important;
  border: 0 !important;
  border-bottom: 1px solid var(--line) !important;
  box-shadow: none !important;
}

.lead-story .lead-link {
  gap: 1.1rem !important;
}

.lead-story .lead-image,
.lead-story .lead-image.has-image {
  margin: 0 !important;
  width: 100% !important;
  box-sizing: border-box !important;
}

/* Keep the original lead-story crop behavior instead of forcing a new inset card layout. */
.lead-story .lead-image.has-image img {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  max-width: none !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center center !important;
}

/* Story-card thumbnails: fill the thumbnail frame even when the markup uses a direct image. */
.story-grid .story-card .story-image-link,
.compact-grid .story-card .story-image-link {
  display: block !important;
  width: 100% !important;
  overflow: hidden !important;
  background: #071b4d !important;
  margin: 0 0 .7rem !important;
}

.story-grid .story-card .story-image-link > img,
.compact-grid .story-card .story-image-link > img,
.story-grid .story-card > a > img,
.compact-grid .story-card > a > img {
  display: block !important;
  width: 100% !important;
  max-width: none !important;
  height: auto !important;
}

/* If the thumbnail wrapper is present, force cover and remove the old contain gutter. */
.story-grid .story-card .thumb.has-image,
.compact-grid .story-card .thumb.has-image,
.story-grid .story-card .story-image-link .thumb.has-image,
.compact-grid .story-card .story-image-link .thumb.has-image {
  width: 100% !important;
  min-height: 0 !important;
  aspect-ratio: 16 / 9 !important;
  max-height: none !important;
  margin: 0 0 .7rem !important;
  background: #071b4d !important;
  overflow: hidden !important;
  box-sizing: border-box !important;
}

.story-grid .story-card .thumb.has-image img,
.compact-grid .story-card .thumb.has-image img,
.story-grid .story-card .story-image-link .thumb.has-image img,
.compact-grid .story-card .story-image-link .thumb.has-image img {
  position: absolute !important;
  inset: 0 !important;
  display: block !important;
  width: 100% !important;
  max-width: none !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center center !important;
}


/* v58 compact public banner ad spacing.
   Keep the 970x250 banner ratio, but reduce the surrounding vertical chrome. */
.home-banner-ad,
.category-banner-ad,
.story-banner-ad {
  padding-top: .55rem !important;
  padding-bottom: .55rem !important;
}

.ad-banner-slot {
  margin-top: .85rem !important;
  margin-bottom: 1rem !important;
}

.public-ad-banner-card {
  padding: .55rem !important;
}

.public-ad-banner-card .rail-kicker {
  margin-bottom: .35rem !important;
}

.public-ad-banner-card .public-ad-image {
  aspect-ratio: 970 / 250 !important;
}

/* On very small screens, keep the banner readable but reduce the extra box spacing. */
@media (max-width: 760px) {
  .home-banner-ad,
  .category-banner-ad,
  .story-banner-ad {
    padding-top: .45rem !important;
    padding-bottom: .45rem !important;
  }

  .public-ad-banner-card {
    padding: .45rem !important;
  }

  .ad-banner-slot {
    margin-top: .7rem !important;
    margin-bottom: .85rem !important;
  }
}


/* v59 story article banner cleanup: remove extra divider lines around in-story ads. */
.story-banner-ad {
  border-top: 0 !important;
  border-bottom: 0 !important;
  padding-top: .45rem !important;
  padding-bottom: .45rem !important;
}

.story-banner-ad.ad-banner-slot {
  margin-top: 1rem !important;
  margin-bottom: 1.15rem !important;
}

.story-banner-ad .public-ad-banner-card {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}


/* v61 redesigned public Buy Ads landing page. */
.buy-ads-page {
  max-width: 1180px;
  margin: 0 auto;
  padding: clamp(1rem, 3vw, 2rem);
}

.buy-ads-hero,
.buy-ads-section,
.buy-ads-final-cta {
  background: #fff;
  border: 1px solid var(--line, #d7dce8);
  box-shadow: 0 18px 42px rgba(7, 27, 77, .08);
}

.buy-ads-hero {
  display: grid;
  grid-template-columns: minmax(0, 1.02fr) minmax(360px, .98fr);
  gap: clamp(1.5rem, 4vw, 3rem);
  align-items: center;
  padding: clamp(1.4rem, 4vw, 3rem);
  overflow: hidden;
  position: relative;
}

.buy-ads-hero::before {
  content: '';
  position: absolute;
  inset: 0 0 auto;
  height: 6px;
  background: linear-gradient(90deg, var(--red, #a44b2b), var(--navy, #111844));
}

.buy-ads-hero-copy,
.buy-ads-hero-art {
  position: relative;
  z-index: 1;
}

.buy-ads-hero h1 {
  margin: .55rem 0 .75rem;
  max-width: 760px;
  font-size: clamp(3rem, 7.5vw, 6.7rem);
  line-height: .88;
  letter-spacing: -.075em;
}

.buy-ads-lede {
  max-width: 610px;
  color: var(--muted, #6b7280);
  font-size: clamp(1.05rem, 1.7vw, 1.25rem);
  font-weight: 800;
  line-height: 1.35;
}

.buy-ads-actions {
  display: flex;
  flex-wrap: wrap;
  gap: .8rem;
  margin: 1.3rem 0 1.35rem;
}

.buy-ads-primary,
.buy-ads-secondary {
  min-height: 46px;
  padding-left: 1.15rem;
  padding-right: 1.15rem;
}

.buy-ads-proof-row {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .85rem;
  margin-top: 1.25rem;
}

.buy-ads-proof-row div {
  border-top: 3px solid var(--red, #a44b2b);
  padding-top: .55rem;
}

.buy-ads-proof-row strong,
.buy-ads-proof-row span {
  display: block;
}

.buy-ads-proof-row strong {
  color: var(--navy, #111844);
  font-weight: 1000;
  text-transform: uppercase;
  font-size: .8rem;
  letter-spacing: .04em;
}

.buy-ads-proof-row span {
  color: var(--muted, #6b7280);
  font-weight: 750;
  font-size: .86rem;
}

.buy-ads-hero-art {
  min-height: 390px;
  display: grid;
  grid-template-columns: minmax(210px, .95fr) minmax(210px, .9fr);
  align-items: center;
  gap: 1rem;
}

.buy-ads-hero-art::before {
  content: '';
  position: absolute;
  right: -5%;
  top: 4%;
  width: 85%;
  height: 82%;
  border-radius: 999px;
  background:
    radial-gradient(circle at 70% 35%, rgba(164,75,43,.14), transparent 28%),
    linear-gradient(135deg, rgba(17,24,68,.08), rgba(17,24,68,.02));
  z-index: -1;
}

.buy-ads-mascot-stage {
  position: relative;
  justify-self: center;
  width: min(280px, 100%);
  aspect-ratio: 1;
  display: grid;
  place-items: center;
}

.buy-ads-mascot-stage img,
.buy-ads-icon img,
.buy-ads-custom-card img {
  display: block;
  width: 100%;
  height: auto;
}

.buy-ads-mascot-stage img {
  filter: drop-shadow(0 14px 22px rgba(7,27,77,.18));
}

.buy-ads-chart-card {
  position: absolute;
  left: -18px;
  bottom: 10px;
  width: 150px;
  background: #fff;
  border: 1px solid var(--line, #d7dce8);
  box-shadow: 0 12px 26px rgba(7, 27, 77, .18);
  padding: .65rem .7rem .75rem;
}

.buy-ads-chart-card span {
  display: block;
  color: var(--navy, #111844);
  text-transform: uppercase;
  font-size: .64rem;
  font-weight: 1000;
  letter-spacing: .05em;
  margin-bottom: .55rem;
}

.buy-ads-chart-card i {
  display: inline-block;
  width: 18%;
  margin-right: 5%;
  vertical-align: bottom;
  background: var(--navy, #111844);
}

.buy-ads-chart-card i:nth-child(2) { height: 22px; }
.buy-ads-chart-card i:nth-child(3) { height: 34px; }
.buy-ads-chart-card i:nth-child(4) { height: 48px; }
.buy-ads-chart-card i:nth-child(5) { height: 64px; background: var(--red, #a44b2b); }

.buy-ads-placement-board {
  align-self: center;
  background: #fff;
  border: 2px solid var(--navy, #111844);
  box-shadow: 0 16px 32px rgba(7, 27, 77, .18);
  padding: 1rem;
  transform: rotate(-1deg);
}

.buy-ads-placement-board strong {
  display: block;
  background: var(--red, #a44b2b);
  color: #fff;
  padding: .55rem .65rem;
  text-transform: uppercase;
  font-weight: 1000;
  letter-spacing: .04em;
  margin-bottom: .65rem;
}

.buy-ads-placement-board span {
  display: block;
  color: var(--navy, #111844);
  border-bottom: 1px solid var(--line, #d7dce8);
  padding: .45rem .2rem;
  font-weight: 950;
}

.buy-ads-placement-board span::before {
  content: '✓';
  color: var(--red, #a44b2b);
  margin-right: .45rem;
}

.buy-ads-section {
  margin-top: 1.25rem;
  padding: clamp(1.15rem, 3vw, 1.75rem);
}

.buy-ads-section-heading {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 1rem;
  border-bottom: 1px solid var(--line, #d7dce8);
  padding-bottom: .9rem;
  margin-bottom: 1rem;
}

.buy-ads-section-heading h2 {
  color: var(--navy, #111844);
  margin: .4rem 0 0;
  font-size: clamp(1.7rem, 3.2vw, 2.5rem);
  letter-spacing: -.045em;
  line-height: .95;
}

.buy-ads-benefit-grid,
.buy-ads-placement-grid {
  display: grid;
  gap: 1rem;
}

.buy-ads-benefit-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.buy-ads-benefit,
.buy-ads-placement,
.buy-ads-custom-card {
  border: 1px solid var(--line, #d7dce8);
  background: #fbfcff;
  padding: 1rem;
}

.buy-ads-benefit h3,
.buy-ads-placement h3,
.buy-ads-custom-card h3 {
  color: var(--navy, #111844);
  margin: .55rem 0 .4rem;
  font-size: 1.18rem;
  line-height: 1.05;
}

.buy-ads-benefit p,
.buy-ads-placement p,
.buy-ads-custom-card p,
.buy-ads-final-cta p {
  color: var(--muted, #6b7280);
  font-weight: 750;
}

.buy-ads-icon {
  width: 74px;
  height: 74px;
  border: 2px solid var(--navy, #111844);
  border-radius: 999px;
  display: grid;
  place-items: center;
  overflow: hidden;
  background: #fff;
}

.buy-ads-icon img {
  width: 82px;
  max-width: none;
}

.buy-ads-icon-layout,
.buy-ads-icon-report {
  border-radius: 8px;
  padding: .5rem;
  gap: .25rem;
  align-content: center;
}

.buy-ads-icon-layout span,
.buy-ads-icon-report i {
  display: block;
  width: 100%;
  background: #d7dce8;
}

.buy-ads-icon-layout span:nth-child(1) { height: 12px; background: var(--red, #a44b2b); }
.buy-ads-icon-layout span:nth-child(2) { height: 18px; }
.buy-ads-icon-layout span:nth-child(3) { height: 22px; }

.buy-ads-icon-report {
  grid-template-columns: repeat(3, 1fr);
  align-items: end;
}

.buy-ads-icon-report i:nth-child(1) { height: 22px; }
.buy-ads-icon-report i:nth-child(2) { height: 38px; }
.buy-ads-icon-report i:nth-child(3) { height: 54px; background: var(--red, #a44b2b); }

.buy-ads-icon-wallet img {
  transform: scale(1.25);
}

.buy-ads-placement-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.placement-preview {
  height: 122px;
  border: 1px solid #cfd6e6;
  background:
    linear-gradient(#f1f4f9 0 0) 12px 52px / 42% 20px no-repeat,
    linear-gradient(#f1f4f9 0 0) 12px 82px / 68% 16px no-repeat,
    linear-gradient(#f1f4f9 0 0) right 12px top 52px / 26% 48px no-repeat,
    #fff;
  position: relative;
  overflow: hidden;
}

.placement-preview b {
  position: absolute;
  left: 12px;
  right: 12px;
  top: 16px;
  background: var(--red, #a44b2b);
  color: #fff;
  text-align: center;
  text-transform: uppercase;
  font-size: .78rem;
  letter-spacing: .04em;
  padding: .55rem .4rem;
}

.story-preview b {
  top: 58px;
}

.sidebar-preview b {
  left: auto;
  right: 12px;
  top: 28px;
  width: 78px;
  min-height: 54px;
  display: grid;
  place-items: center;
}

.buy-ads-custom-card {
  background: linear-gradient(180deg, #fff, #f8fafc);
}

.buy-ads-custom-card img {
  width: 94px;
  float: left;
  margin: 0 .8rem .4rem 0;
}

.buy-ads-custom-card a {
  color: var(--red, #a44b2b);
  font-weight: 1000;
  text-decoration: none;
}

.buy-ads-results {
  margin-top: 1.25rem;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: .9rem;
}

.buy-ads-results div {
  background: #fff;
  border: 1px solid var(--line, #d7dce8);
  padding: .95rem 1rem;
  box-shadow: 0 10px 24px rgba(7,27,77,.06);
}

.buy-ads-results strong,
.buy-ads-results span {
  display: block;
}

.buy-ads-results strong {
  color: var(--navy, #111844);
  font-size: 1.5rem;
  line-height: 1;
  letter-spacing: -.035em;
}

.buy-ads-results span {
  color: var(--muted, #6b7280);
  margin-top: .35rem;
  font-weight: 800;
}

.buy-ads-final-cta {
  margin-top: 1.25rem;
  background: linear-gradient(135deg, var(--navy, #111844), #1d2868);
  color: #fff;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 1.25rem;
  padding: clamp(1.25rem, 3vw, 2rem);
}

.buy-ads-final-cta h2 {
  color: #fff;
  margin: .45rem 0 .4rem;
  font-size: clamp(1.7rem, 4vw, 3rem);
  line-height: .95;
}

.buy-ads-final-cta p {
  color: #dbe4ff;
  max-width: 760px;
}

.buy-ads-final-cta .story-flag {
  background: var(--red, #a44b2b);
}

@media (max-width: 980px) {
  .buy-ads-hero {
    grid-template-columns: 1fr;
  }

  .buy-ads-hero-art {
    min-height: auto;
  }

  .buy-ads-benefit-grid,
  .buy-ads-placement-grid,
  .buy-ads-results {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 640px) {
  .buy-ads-page {
    padding: .8rem;
  }

  .buy-ads-hero {
    padding: 1.2rem;
  }

  .buy-ads-hero h1 {
    font-size: clamp(2.4rem, 14vw, 3.6rem);
  }

  .buy-ads-actions,
  .buy-ads-final-cta {
    align-items: stretch;
    flex-direction: column;
  }

  .buy-ads-actions .button,
  .buy-ads-final-cta .button {
    width: 100%;
  }

  .buy-ads-proof-row,
  .buy-ads-benefit-grid,
  .buy-ads-placement-grid,
  .buy-ads-results {
    grid-template-columns: 1fr;
  }

  .buy-ads-hero-art {
    grid-template-columns: 1fr;
  }

  .buy-ads-placement-board {
    transform: none;
  }

  .buy-ads-section-heading {
    display: block;
  }
}

/* Conversion-focused lifetime membership page */
.membership-sales-page {
  margin-top: 1rem;
}
.membership-hero-strip {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 210px;
  gap: 1.25rem;
  align-items: stretch;
  padding: 1.15rem 1.25rem;
  border: 1px solid #d8deea;
  border-left: 8px solid var(--copper);
  background: linear-gradient(135deg, #fff 0%, #f7f8fc 100%);
  box-shadow: 0 14px 34px rgba(7, 19, 62, .08);
}
.membership-hero-strip h2 {
  margin: .55rem 0 .45rem;
  font-size: clamp(2rem, 5vw, 3.5rem);
  line-height: .96;
  letter-spacing: -.04em;
  color: var(--navy);
}
.membership-hero-strip p {
  margin: 0;
  max-width: 760px;
  color: #616a7c;
  font-weight: 800;
  line-height: 1.45;
}
.membership-price-card {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-align: center;
  border: 1px solid #d8deea;
  background: var(--navy);
  color: #fff;
  padding: 1rem;
  min-height: 140px;
}
.membership-price-card span,
.membership-price-card small {
  color: rgba(255,255,255,.78);
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: .05em;
  font-size: .72rem;
}
.membership-price-card strong {
  display: block;
  margin: .2rem 0;
  font-size: clamp(2rem, 4vw, 3rem);
  line-height: 1;
}
.membership-conversion-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(320px, .75fr);
  gap: 1.5rem;
  align-items: start;
  margin-top: 1.5rem;
}
.membership-value-card,
.membership-action-card {
  border: 1px solid #d8deea;
  background: #fff;
  box-shadow: 0 18px 36px rgba(7, 19, 62, .08);
}
.membership-value-card {
  padding: 1.2rem;
}
.membership-action-card {
  position: sticky;
  top: 1rem;
  padding: 1.25rem;
  border-top: 7px solid var(--copper);
}
.membership-action-card h3 {
  margin: 0 0 .4rem;
  color: var(--navy);
  font-size: clamp(1.35rem, 3vw, 1.75rem);
  line-height: 1.05;
}
.membership-action-card form {
  margin-top: 1rem;
}
.membership-action-card .membership-join-form label {
  margin-bottom: .75rem;
}
.membership-action-card input[type="text"],
.membership-action-card input[type="email"],
.membership-action-card input[type="password"] {
  min-height: 46px;
}
.membership-action-card button[type="submit"] {
  width: 100%;
  justify-content: center;
  font-size: .95rem;
  padding: .95rem 1rem;
}
.membership-button-row {
  display: grid;
  gap: .65rem;
}
.membership-button-row .button.secondary {
  justify-content: center;
  text-align: center;
}
.founder-credit-callout.founder-credit-hero {
  margin: 0 0 1rem;
  padding: 1.2rem 1.25rem;
  border: 2px solid var(--copper);
  border-left-width: 10px;
  background: #fff4ea;
}
.founder-credit-kicker {
  color: var(--copper-dark);
  font-weight: 1000;
  text-transform: uppercase;
  letter-spacing: .08em;
  font-size: .75rem;
  margin-bottom: .35rem;
}
.founder-credit-hero .founder-credit-amount {
  font-size: clamp(2rem, 5vw, 3.4rem);
  letter-spacing: -.04em;
}
.membership-mini-stats {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: .75rem;
  margin: 1rem 0;
}
.membership-mini-stats div {
  border: 1px solid #d8deea;
  background: #f7f8fc;
  padding: .85rem;
  text-align: center;
}
.membership-mini-stats strong {
  display: block;
  color: var(--navy);
  font-size: clamp(1.25rem, 3vw, 1.9rem);
  line-height: 1;
}
.membership-mini-stats span {
  display: block;
  margin-top: .35rem;
  color: #616a7c;
  font-weight: 900;
  font-size: .78rem;
  text-transform: uppercase;
  letter-spacing: .03em;
}
.membership-benefits-card {
  border: 1px solid #d8deea;
  background: #fff;
  padding: 1rem 1.15rem;
}
.membership-benefits-card h3 {
  margin: 0 0 .75rem;
  color: var(--navy);
  font-size: 1.35rem;
}
.membership-check-list {
  list-style: none;
  padding: 0;
  margin: 0 0 .9rem;
  display: grid;
  gap: .55rem;
}
.membership-check-list li {
  position: relative;
  padding-left: 1.6rem;
  line-height: 1.35;
}
.membership-check-list li::before {
  content: "✓";
  position: absolute;
  left: 0;
  top: 0;
  color: var(--copper-dark);
  font-weight: 1000;
}
.membership-trust-note {
  margin-top: 1rem;
  padding: .9rem;
  border: 1px solid #d8deea;
  background: #f7f8fc;
  color: #616a7c;
  font-weight: 800;
  line-height: 1.4;
}
.membership-trust-note strong,
.membership-trust-note span {
  display: block;
}
.membership-trust-note strong {
  color: var(--navy);
  margin-bottom: .25rem;
}
.membership-confirmed-card {
  margin-top: 1rem;
}
@media (max-width: 900px) {
  .membership-hero-strip,
  .membership-conversion-grid,
  .membership-mini-stats {
    grid-template-columns: 1fr;
  }
  .membership-action-card {
    position: static;
  }
}

/* Clean, conversion-focused lifetime membership page */
.membership-sales-page-clean {
  margin-top: .75rem;
}
.membership-sales-page-clean .membership-offer-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 190px;
  gap: 1rem;
  align-items: stretch;
  padding: 1.2rem;
  border: 1px solid #d8deea;
  border-left: 8px solid var(--copper);
  background: linear-gradient(135deg, #fff 0%, #f7f8fc 100%);
  box-shadow: 0 16px 34px rgba(7, 19, 62, .08);
}
.membership-sales-page-clean .membership-offer-hero h2 {
  margin: .45rem 0 .35rem;
  color: var(--navy);
  font-size: clamp(2.3rem, 5vw, 4rem);
  line-height: .94;
  letter-spacing: -.05em;
}
.membership-sales-page-clean .membership-offer-lede {
  margin: 0;
  max-width: 760px;
  color: #5d6577;
  font-weight: 900;
  font-size: clamp(1rem, 2vw, 1.2rem);
  line-height: 1.35;
}
.membership-sales-page-clean .membership-offer-price {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  min-height: 150px;
  padding: 1rem;
  text-align: center;
  color: #fff;
  background: var(--navy);
  border: 1px solid var(--navy);
}
.membership-sales-page-clean .membership-offer-price span,
.membership-sales-page-clean .membership-offer-price small {
  color: rgba(255,255,255,.82);
  font-weight: 1000;
  text-transform: uppercase;
  letter-spacing: .06em;
  font-size: .72rem;
}
.membership-sales-page-clean .membership-offer-price strong {
  display: block;
  margin: .15rem 0;
  font-size: clamp(2.5rem, 5vw, 3.7rem);
  line-height: 1;
}
.membership-sales-page-clean .membership-clean-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.12fr) minmax(320px, .88fr);
  gap: 1.25rem;
  align-items: start;
  margin-top: 1.25rem;
}
.membership-sales-page-clean .membership-clean-value,
.membership-sales-page-clean .membership-signup-card {
  border: 1px solid #d8deea;
  background: #fff;
  box-shadow: 0 18px 36px rgba(7, 19, 62, .08);
}
.membership-sales-page-clean .membership-clean-value {
  padding: 1rem;
}
.membership-sales-page-clean .membership-signup-card {
  position: sticky;
  top: 1rem;
  padding: 1.2rem;
  border-top: 7px solid var(--copper);
}
.membership-sales-page-clean .founder-credit-feature {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 1rem;
  align-items: center;
  padding: 1rem 1.1rem;
  border: 2px solid var(--copper);
  background: #fff4ea;
}
.membership-sales-page-clean .founder-credit-big {
  color: var(--copper-dark);
  font-size: clamp(3.2rem, 8vw, 5rem);
  line-height: .9;
  font-weight: 1000;
  letter-spacing: -.06em;
}
.membership-sales-page-clean .founder-credit-title {
  color: var(--navy);
  font-size: clamp(1.55rem, 3vw, 2.2rem);
  line-height: 1;
  font-weight: 1000;
  letter-spacing: -.03em;
}
.membership-sales-page-clean .founder-credit-feature p {
  margin: .35rem 0 0;
  color: #5d6577;
  font-weight: 800;
  line-height: 1.35;
}
.membership-sales-page-clean .membership-value-pills {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: .7rem;
  margin: .9rem 0;
}
.membership-sales-page-clean .membership-value-pills div {
  padding: .8rem;
  text-align: center;
  border: 1px solid #d8deea;
  background: #f7f8fc;
}
.membership-sales-page-clean .membership-value-pills strong {
  display: block;
  color: var(--navy);
  font-size: clamp(1.4rem, 3vw, 2rem);
  line-height: 1;
}
.membership-sales-page-clean .membership-value-pills span {
  display: block;
  margin-top: .35rem;
  color: #5d6577;
  font-size: .78rem;
  font-weight: 1000;
  line-height: 1.2;
  text-transform: uppercase;
  letter-spacing: .035em;
}
.membership-sales-page-clean .membership-benefit-panel {
  padding: 1rem;
  border: 1px solid #d8deea;
}
.membership-sales-page-clean .membership-benefit-panel h3,
.membership-sales-page-clean .membership-signup-card h3 {
  margin: 0 0 .8rem;
  color: var(--navy);
  font-size: clamp(1.45rem, 3vw, 2rem);
  line-height: 1;
  letter-spacing: -.03em;
}
.membership-sales-page-clean .membership-benefit-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .75rem;
  margin-bottom: .9rem;
}
.membership-sales-page-clean .membership-benefit-grid div {
  padding: .85rem;
  border: 1px solid #d8deea;
  background: #fff;
}
.membership-sales-page-clean .membership-benefit-grid strong,
.membership-sales-page-clean .membership-benefit-grid span {
  display: block;
}
.membership-sales-page-clean .membership-benefit-grid strong {
  color: var(--navy);
  margin-bottom: .25rem;
}
.membership-sales-page-clean .membership-benefit-grid span,
.membership-sales-page-clean .membership-benefit-panel small,
.membership-sales-page-clean .membership-after-note {
  color: #5d6577;
  font-weight: 800;
  line-height: 1.35;
}
.membership-sales-page-clean .membership-signup-card form {
  margin-top: 1rem;
}
.membership-sales-page-clean .membership-signup-card label {
  margin-bottom: .75rem;
}
.membership-sales-page-clean .membership-signup-card input[type="text"],
.membership-sales-page-clean .membership-signup-card input[type="email"],
.membership-sales-page-clean .membership-signup-card input[type="password"] {
  min-height: 46px;
}
.membership-sales-page-clean .membership-primary-cta {
  display: flex;
  justify-content: center;
  width: 100%;
  margin-top: .35rem;
  padding: 1rem;
  font-size: 1rem;
}
.membership-sales-page-clean .membership-secondary-cta {
  display: flex;
  justify-content: center;
  width: 100%;
  margin-top: .65rem;
  text-align: center;
}
.membership-sales-page-clean .membership-after-note {
  margin: 1rem 0 0;
  padding: .85rem;
  border: 1px solid #d8deea;
  background: #f7f8fc;
}
.membership-sales-page-clean .membership-after-note strong {
  color: var(--navy);
}
@media (max-width: 900px) {
  .membership-sales-page-clean .membership-offer-hero,
  .membership-sales-page-clean .membership-clean-grid,
  .membership-sales-page-clean .membership-value-pills,
  .membership-sales-page-clean .membership-benefit-grid,
  .membership-sales-page-clean .founder-credit-feature {
    grid-template-columns: 1fr;
  }
  .membership-sales-page-clean .membership-signup-card {
    position: static;
  }
  .membership-sales-page-clean .founder-credit-feature {
    text-align: center;
  }
}

/* Membership conversion page */
.membership-convert-page {
  margin-top: 1rem;
}
.membership-convert-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(340px, 390px);
  gap: 1.4rem;
  align-items: start;
}
.membership-offer-card,
.membership-pay-card,
.membership-confirmed-card {
  border: 1px solid #d8deea;
  background: #fff;
  box-shadow: 0 18px 38px rgba(7, 19, 62, .09);
}
.membership-offer-card {
  padding: clamp(1rem, 2.5vw, 1.6rem);
}
.membership-offer-topline {
  display: flex;
  flex-wrap: wrap;
  gap: .75rem;
  align-items: center;
  justify-content: space-between;
  margin-bottom: .75rem;
}
.membership-price-pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: .42rem .75rem;
  color: #fff;
  background: var(--navy);
  border: 1px solid var(--navy);
  font-weight: 1000;
  text-transform: uppercase;
  letter-spacing: .04em;
  line-height: 1;
}
.membership-offer-card h2 {
  max-width: 820px;
  margin: 0 0 .55rem;
  color: var(--navy);
  font-size: clamp(2.2rem, 4.5vw, 4.3rem);
  line-height: .92;
  letter-spacing: -.06em;
}
.membership-offer-subhead {
  max-width: 760px;
  margin: 0 0 1rem;
  color: #5d6577;
  font-size: clamp(1rem, 1.6vw, 1.2rem);
  font-weight: 900;
  line-height: 1.35;
}
.membership-credit-hero {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 1rem;
  align-items: center;
  margin: 1rem 0;
  padding: 1rem;
  color: #fff;
  background: linear-gradient(135deg, var(--copper) 0%, var(--copper-dark) 100%);
  border: 1px solid var(--copper-dark);
  box-shadow: 0 16px 30px rgba(159, 75, 38, .20);
}
.membership-credit-amount {
  min-width: 145px;
  padding: .6rem .8rem;
  text-align: center;
  color: var(--navy);
  background: #fff;
  border: 2px solid rgba(255,255,255,.45);
  font-size: clamp(3rem, 7vw, 5rem);
  line-height: .9;
  font-weight: 1000;
  letter-spacing: -.07em;
}
.membership-credit-copy strong,
.membership-credit-copy span {
  display: block;
}
.membership-credit-copy strong {
  font-size: clamp(1.65rem, 3vw, 2.45rem);
  line-height: .95;
  font-weight: 1000;
  letter-spacing: -.04em;
}
.membership-credit-copy span {
  max-width: 620px;
  margin-top: .45rem;
  font-size: 1rem;
  line-height: 1.35;
  font-weight: 850;
}
.membership-proof-row {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .7rem;
  margin: 1rem 0;
}
.membership-proof-row div {
  padding: .9rem .7rem;
  text-align: center;
  border: 1px solid #d8deea;
  background: #f7f8fc;
}
.membership-proof-row strong,
.membership-proof-row span {
  display: block;
}
.membership-proof-row strong {
  color: var(--navy);
  font-size: clamp(1.45rem, 2.7vw, 2.2rem);
  line-height: 1;
  font-weight: 1000;
  letter-spacing: -.04em;
}
.membership-proof-row span {
  margin-top: .35rem;
  color: #5d6577;
  font-size: .78rem;
  font-weight: 1000;
  line-height: 1.15;
  text-transform: uppercase;
  letter-spacing: .035em;
}
.membership-benefits-short {
  margin-top: 1rem;
  padding-top: 1rem;
  border-top: 1px solid #d8deea;
}
.membership-benefits-short h3,
.membership-pay-card h3 {
  margin: 0 0 .85rem;
  color: var(--navy);
  font-size: clamp(1.45rem, 2.5vw, 2rem);
  line-height: 1;
  letter-spacing: -.03em;
}
.membership-benefits-short-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .75rem;
}
.membership-benefits-short-grid div {
  padding: .85rem;
  border-left: 5px solid var(--copper);
  background: #f7f8fc;
}
.membership-benefits-short-grid strong,
.membership-benefits-short-grid span {
  display: block;
}
.membership-benefits-short-grid strong {
  color: var(--navy);
  font-size: .98rem;
  line-height: 1.1;
}
.membership-benefits-short-grid span,
.membership-benefits-short small,
.membership-note,
.membership-mini-guarantee span {
  color: #5d6577;
  font-weight: 800;
  line-height: 1.35;
}
.membership-benefits-short-grid span {
  margin-top: .28rem;
}
.membership-benefits-short small {
  display: block;
  margin-top: .75rem;
}
.membership-pay-card {
  position: sticky;
  top: 1rem;
  padding: 1rem;
  border-top: 8px solid var(--copper);
}
.membership-pay-card-head {
  margin: -1rem -1rem 1rem;
  padding: 1rem;
  color: #fff;
  text-align: center;
  background: var(--navy);
}
.membership-pay-card-head span,
.membership-pay-card-head strong,
.membership-pay-card-head small {
  display: block;
}
.membership-pay-card-head span,
.membership-pay-card-head small {
  font-weight: 1000;
  text-transform: uppercase;
  letter-spacing: .045em;
  color: rgba(255,255,255,.82);
}
.membership-pay-card-head strong {
  margin: .25rem 0;
  font-size: clamp(3rem, 7vw, 4.4rem);
  line-height: .9;
  letter-spacing: -.06em;
}
.membership-pay-card form {
  margin-top: .75rem;
}
.membership-pay-card label {
  margin-bottom: .72rem;
}
.membership-pay-card input[type="text"],
.membership-pay-card input[type="email"],
.membership-pay-card input[type="password"] {
  min-height: 46px;
}
.membership-primary-cta,
.membership-pay-card .membership-primary-cta {
  display: flex;
  justify-content: center;
  width: 100%;
  margin-top: .35rem;
  padding: 1rem;
  font-size: 1rem;
  line-height: 1.1;
}
.membership-secondary-cta,
.membership-pay-card .membership-secondary-cta {
  display: flex;
  justify-content: center;
  width: 100%;
  margin-top: .65rem;
  text-align: center;
}
.membership-mini-guarantee {
  display: grid;
  gap: .2rem;
  margin-top: 1rem;
  padding: .85rem;
  border: 1px solid #d8deea;
  background: #f7f8fc;
}
.membership-mini-guarantee strong {
  color: var(--navy);
}
.membership-confirmed-card {
  padding: 1.4rem;
}
.membership-confirmed-card h2 {
  margin: .5rem 0;
  color: var(--navy);
  font-size: clamp(2rem, 4vw, 3.5rem);
  line-height: .95;
}
@media (max-width: 980px) {
  .membership-convert-grid,
  .membership-credit-hero,
  .membership-proof-row,
  .membership-benefits-short-grid {
    grid-template-columns: 1fr;
  }
  .membership-pay-card {
    position: static;
  }
  .membership-credit-hero {
    text-align: center;
  }
  .membership-credit-amount {
    min-width: 0;
  }
}


/* Membership page hotfix: conversion layout and parse-safe replacement */
.membership-sales-page-clean .membership-offer-hero { margin-bottom: 1.25rem; }
.membership-sales-page-clean .founder-credit-feature { box-shadow: 0 14px 30px rgba(7, 19, 62, .08); }
.membership-sales-page-clean .membership-signup-card { align-self: start; }
.membership-sales-page-clean .membership-primary-cta { white-space: normal; }


/* v62: polish account menu and Buy Ads spacing/color */
.site-header .main-nav {
  gap: 0.7rem;
}

.site-header .main-nav .account-nav-menu {
  margin-right: 0.25rem;
}

.site-header .main-nav .account-nav-summary,
.main-nav .account-nav-menu summary.account-nav-summary {
  min-height: 38px;
  padding: 0.35rem 0.45rem;
  gap: 0.45rem;
  border-radius: 3px;
}

.site-header .main-nav .account-nav-summary:hover,
.site-header .main-nav .account-nav-summary:focus {
  background: rgba(255,255,255,.12);
}

.account-nav-icon {
  position: relative;
  display: inline-block;
  flex: 0 0 auto;
  width: 24px;
  height: 24px;
  border: 2px solid rgba(255,255,255,.92);
  border-radius: 999px;
  box-shadow: inset 0 0 0 2px rgba(7,27,77,.18);
}

.account-nav-icon::before {
  content: "";
  position: absolute;
  left: 50%;
  top: 5px;
  width: 6px;
  height: 6px;
  border-radius: 999px;
  background: #fff;
  transform: translateX(-50%);
}

.account-nav-icon::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: 4px;
  width: 13px;
  height: 7px;
  border-radius: 999px 999px 4px 4px;
  background: #fff;
  transform: translateX(-50%);
}

.account-nav-name {
  display: inline-block;
  max-width: 10rem;
  overflow: hidden;
  text-overflow: ellipsis;
  vertical-align: middle;
  white-space: nowrap;
}

.site-header .main-nav a.buy-ads-link,
.main-nav a.buy-ads-link,
.site-header .main-nav > a.buy-ads-link:last-child {
  margin-left: 0.25rem;
  padding: 0.56rem 0.82rem;
  background: #c01920;
  border: 1px solid rgba(255,255,255,.38);
  color: #fff !important;
  box-shadow: 0 2px 0 rgba(0,0,0,.14);
}

.site-header .main-nav a.buy-ads-link:hover,
.site-header .main-nav a.buy-ads-link:focus,
.main-nav a.buy-ads-link:hover,
.main-nav a.buy-ads-link:focus {
  background: #8f1117 !important;
  color: #fff !important;
}

@media (max-width: 760px) {
  .site-header .main-nav {
    gap: 0.15rem;
  }

  .site-header .main-nav .account-nav-menu {
    margin-right: 0;
  }

  .account-nav-name {
    max-width: none;
  }

  .site-header .main-nav a.buy-ads-link,
  .main-nav a.buy-ads-link,
  .site-header .main-nav > a.buy-ads-link:last-child {
    margin-left: 0;
    width: 100%;
  }
}

.account-password-form {
  margin-top: 1.25rem;
  padding-top: 1.25rem;
  border-top: 1px solid var(--line, #d8dde8);
}

.account-password-form .alert {
  margin: 0.75rem 0 1rem;
}


/* Account profile security disclosure */
.account-password-disclosure {
  margin-top: 1rem;
  padding-top: 1rem;
  border-top: 1px solid #d8dde8;
}
.account-password-disclosure > summary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  list-style: none;
  cursor: pointer;
}
.account-password-disclosure > summary::-webkit-details-marker { display: none; }
.account-password-disclosure[open] > summary { margin-bottom: 1rem; }
.account-password-disclosure .account-password-form {
  margin-top: 0;
}
.account-show-password {
  grid-column: 1 / -1;
  margin-top: -.15rem;
}


/* Account profile inline actions and hidden password panel */
.account-profile-actions {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: .65rem;
}
.account-password-toggle-button {
  min-height: 2.65rem;
}
.account-password-panel {
  margin-top: 1rem;
}
.account-password-panel.is-hidden {
  display: none;
}
.account-password-panel .account-password-form {
  margin-top: 0;
}
}
.support-status {
  display: inline-block;
  white-space: nowrap;
}
.support-thread {
  display: grid;
  gap: 1rem;
  margin: 1rem 0 1.5rem;
}
.support-message {
  border: 1px solid var(--line, #d7dce6);
  background: #fff;
  padding: 1rem;
}
.support-message-staff {
  border-left: 5px solid var(--accent, #a14d2b);
  background: #fffaf7;
}
.support-message-customer {
  border-left: 5px solid var(--navy, #111847);
}
.support-message-meta {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  color: var(--muted, #6f7484);
  font-size: .9rem;
  margin-bottom: .5rem;
}
.support-message-body {
  line-height: 1.55;
  white-space: normal;
}
.support-reply-form textarea,
.support-message-form textarea {
  width: 100%;
}
.support-ticket-actions {
  display: flex;
  gap: .75rem;
  flex-wrap: wrap;
  margin-top: 1rem;
}
.support-admin-status-row {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  align-items: flex-start;
  border-bottom: 1px solid var(--line, #d7dce6);
  padding-bottom: 1rem;
  margin-bottom: 1rem;
}
.support-admin-status-row form {
  display: flex;
  gap: .75rem;
  align-items: end;
  flex-wrap: wrap;
}
.support-admin-card {
  background: #fff;
  border: 1px solid var(--line, #d7dce6);
  padding: 1.25rem;
}
@media (max-width: 760px) {
  .support-message-meta,
  .support-admin-status-row {
    display: block;
  }
}


/* v59 founding reporter verification badge placement polish.
   Keep the icon-only badge, but pull it closer to the text and vertically center it better. */
.founding-badge,
.mini-reporter-badge {
  display: inline-block !important;
  width: 28px !important;
  min-width: 28px !important;
  height: 28px !important;
  padding: 0 !important;
  margin: 0 0 0 .22rem !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent url('../images/badges/founding-founder-badge.svg') center center / contain no-repeat !important;
  box-shadow: none !important;
  color: transparent !important;
  font-size: 0 !important;
  line-height: 0 !important;
  letter-spacing: 0 !important;
  text-indent: -9999px !important;
  text-transform: none !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  vertical-align: middle !important;
}

.founding-badge > *,
.mini-reporter-badge > * {
  display: none !important;
}

.founding-badge-inline,
.founding-badge-mini,
.mini-reporter-badge {
  width: 26px !important;
  min-width: 26px !important;
  height: 26px !important;
}

.founding-badge-heading {
  width: 34px !important;
  min-width: 34px !important;
  height: 34px !important;
  margin-left: .24rem !important;
  transform: none !important;
  vertical-align: middle !important;
  position: relative !important;
  top: -.04em !important;
}

.story-byline .mini-reporter-badge,
.article-byline .mini-reporter-badge,
.story-byline-card .mini-reporter-badge,
.story-byline-home .mini-reporter-badge,
.story-byline-result .mini-reporter-badge,
.reporter-preview-byline .founding-badge,
.comment-author-line .founding-badge {
  position: relative !important;
  top: -.08em !important;
}

.story-byline-card .mini-reporter-badge,
.story-byline-home .mini-reporter-badge,
.story-byline-result .mini-reporter-badge {
  margin-left: .18rem !important;
}

.article-byline .mini-reporter-badge,
.story-byline .mini-reporter-badge {
  width: 28px !important;
  min-width: 28px !important;
  height: 28px !important;
  margin-left: .2rem !important;
}

@media (max-width: 640px) {
  .founding-badge-heading,
  .founding-badge-inline {
    margin-top: 0 !important;
    margin-left: .18rem !important;
  }

  .founding-badge-heading {
    width: 30px !important;
    min-width: 30px !important;
    height: 30px !important;
  }
}


/* v60 founding reporter badge placement: context-specific sizing and alignment.
   Cards need a smaller badge; article/reporters can use a slightly larger one. */
.founding-badge,
.mini-reporter-badge {
  display: inline-block !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent url('../images/badges/founding-founder-badge.svg') center center / contain no-repeat !important;
  box-shadow: none !important;
  color: transparent !important;
  font-size: 0 !important;
  line-height: 0 !important;
  letter-spacing: 0 !important;
  text-indent: -9999px !important;
  text-transform: none !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  vertical-align: middle !important;
}

.founding-badge > *,
.mini-reporter-badge > * {
  display: none !important;
}

/* Story grid / home cards: small enough to stay on the byline without stealing attention. */
.story-byline-card .mini-reporter-badge,
.story-byline-home .mini-reporter-badge,
.story-byline-result .mini-reporter-badge {
  width: 18px !important;
  min-width: 18px !important;
  height: 18px !important;
  margin-left: .12rem !important;
  position: relative !important;
  top: -.03em !important;
  vertical-align: middle !important;
}

/* Full story page byline: a little larger, pulled tight to the reporter name. */
.article-byline .mini-reporter-badge,
.story-byline .mini-reporter-badge {
  width: 22px !important;
  min-width: 22px !important;
  height: 22px !important;
  margin-left: .16rem !important;
  position: relative !important;
  top: -.05em !important;
  vertical-align: middle !important;
}

/* Public reporter profile: badge belongs beside the name, not on its own line. */
.reporter-profile-card-public h1 .reporter-profile-badge {
  width: 28px !important;
  min-width: 28px !important;
  height: 28px !important;
  margin-left: .18rem !important;
  position: relative !important;
  top: -.08em !important;
  vertical-align: middle !important;
}

.reporter-profile-badge {
  margin-bottom: 0 !important;
}

/* Account reporter editor heading. */
.founding-badge-heading {
  width: 30px !important;
  min-width: 30px !important;
  height: 30px !important;
  margin-left: .18rem !important;
  position: relative !important;
  top: -.06em !important;
  vertical-align: middle !important;
}

.founding-badge-inline,
.founding-badge-mini {
  width: 20px !important;
  min-width: 20px !important;
  height: 20px !important;
  margin-left: .16rem !important;
  position: relative !important;
  top: -.04em !important;
}

@media (max-width: 640px) {
  .story-byline-card .mini-reporter-badge,
  .story-byline-home .mini-reporter-badge,
  .story-byline-result .mini-reporter-badge {
    width: 17px !important;
    min-width: 17px !important;
    height: 17px !important;
  }

  .article-byline .mini-reporter-badge,
  .story-byline .mini-reporter-badge {
    width: 20px !important;
    min-width: 20px !important;
    height: 20px !important;
  }

  .reporter-profile-card-public h1 .reporter-profile-badge {
    width: 24px !important;
    min-width: 24px !important;
    height: 24px !important;
  }
}

/* v61 founding reporter badge final placement pass.
   Use different sizes for story cards, article bylines, and profile headings. */
.story-byline-card,
.story-byline-home,
.story-byline-result,
.article-byline {
  display: inline-flex !important;
  align-items: center !important;
  gap: 0 !important;
}

.story-byline-card .mini-reporter-badge,
.story-byline-home .mini-reporter-badge,
.story-byline-result .mini-reporter-badge {
  width: 14px !important;
  min-width: 14px !important;
  height: 14px !important;
  margin-left: .13rem !important;
  position: static !important;
  top: auto !important;
  transform: none !important;
  vertical-align: middle !important;
}

.article-byline .mini-reporter-badge,
.story-byline.article-byline .mini-reporter-badge {
  width: 16px !important;
  min-width: 16px !important;
  height: 16px !important;
  margin-left: .15rem !important;
  position: static !important;
  top: auto !important;
  transform: none !important;
  vertical-align: middle !important;
}

.reporter-profile-card-public h1 {
  display: flex !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: .32rem !important;
}

.reporter-profile-card-public h1 .reporter-profile-badge {
  width: 22px !important;
  min-width: 22px !important;
  height: 22px !important;
  margin-left: 0 !important;
  position: relative !important;
  top: .02em !important;
  transform: none !important;
  vertical-align: middle !important;
  flex: 0 0 auto !important;
}

.account-section-head h2 {
  display: flex !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: .28rem !important;
}

.account-section-head h2 .founding-badge-heading {
  width: 20px !important;
  min-width: 20px !important;
  height: 20px !important;
  margin-left: 0 !important;
  position: static !important;
  top: auto !important;
  transform: none !important;
  vertical-align: middle !important;
}

@media (max-width: 640px) {
  .story-byline-card .mini-reporter-badge,
  .story-byline-home .mini-reporter-badge,
  .story-byline-result .mini-reporter-badge {
    width: 13px !important;
    min-width: 13px !important;
    height: 13px !important;
  }

  .reporter-profile-card-public h1 .reporter-profile-badge {
    width: 20px !important;
    min-width: 20px !important;
    height: 20px !important;
  }
}

/* v60 founding reporter badge context sizing and byline-link fix.
   Do not use one badge size everywhere: cards, article bylines, and profile headings each need their own size. */
.reporter-byline-link,
.reporter-byline-link:visited {
  color: inherit;
  text-decoration: none;
}

.reporter-byline-link:hover,
.reporter-byline-link:focus {
  color: var(--red);
  text-decoration: underline;
  text-underline-offset: 2px;
}

.reporter-byline-combo {
  display: inline-flex !important;
  align-items: center !important;
  gap: 0 !important;
  vertical-align: middle !important;
}

.story-byline-card,
.story-byline-home,
.story-byline-result,
.article-byline {
  display: flex !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 0 !important;
}

.story-byline-card .mini-reporter-badge,
.story-byline-home .mini-reporter-badge,
.story-byline-result .mini-reporter-badge {
  width: 14px !important;
  min-width: 14px !important;
  height: 14px !important;
  margin-left: .18rem !important;
  position: relative !important;
  top: -.03em !important;
  transform: none !important;
  vertical-align: middle !important;
}

.article-byline .mini-reporter-badge,
.story-byline.article-byline .mini-reporter-badge {
  width: 21px !important;
  min-width: 21px !important;
  height: 21px !important;
  margin-left: .2rem !important;
  position: relative !important;
  top: -.04em !important;
  transform: none !important;
  vertical-align: middle !important;
}

.reporter-profile-card-public h1 {
  display: flex !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 0 !important;
}

.reporter-profile-card-public h1 .reporter-profile-badge {
  width: 32px !important;
  min-width: 32px !important;
  height: 32px !important;
  margin-left: .32rem !important;
  position: relative !important;
  top: -.03em !important;
  transform: none !important;
  vertical-align: middle !important;
  flex: 0 0 auto !important;
}

.account-section-head h2 {
  display: flex !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 0 !important;
}

.account-section-head h2 .founding-badge-heading {
  width: 25px !important;
  min-width: 25px !important;
  height: 25px !important;
  margin-left: .26rem !important;
  position: relative !important;
  top: -.03em !important;
  transform: none !important;
  vertical-align: middle !important;
}

@media (max-width: 640px) {
  .story-byline-card .mini-reporter-badge,
  .story-byline-home .mini-reporter-badge,
  .story-byline-result .mini-reporter-badge {
    width: 13px !important;
    min-width: 13px !important;
    height: 13px !important;
  }

  .article-byline .mini-reporter-badge,
  .story-byline.article-byline .mini-reporter-badge {
    width: 19px !important;
    min-width: 19px !important;
    height: 19px !important;
  }

  .reporter-profile-card-public h1 .reporter-profile-badge {
    width: 28px !important;
    min-width: 28px !important;
    height: 28px !important;
    margin-left: .24rem !important;
  }
}

/* v62 reporter byline link restore.
   Keep the reporter name itself as the link; the badge is only the status icon. */
.story-byline .reporter-byline-link,
.article-byline .reporter-byline-link,
.story-byline-card .reporter-byline-link,
.story-byline-home .reporter-byline-link,
.story-byline-result .reporter-byline-link {
  cursor: pointer !important;
}

.story-byline .reporter-byline-link:hover,
.article-byline .reporter-byline-link:hover,
.story-byline-card .reporter-byline-link:hover,
.story-byline-home .reporter-byline-link:hover,
.story-byline-result .reporter-byline-link:hover,
.story-byline .reporter-byline-link:focus,
.article-byline .reporter-byline-link:focus,
.story-byline-card .reporter-byline-link:focus,
.story-byline-home .reporter-byline-link:focus,
.story-byline-result .reporter-byline-link:focus {
  color: var(--red) !important;
  text-decoration: underline !important;
  text-underline-offset: 2px !important;
}


/* v10 reporter byline link restore: keep the name clickable while the badge remains separate. */
.reporter-byline-link {
  color: inherit;
  text-decoration: none;
  cursor: pointer;
}

.reporter-byline-link:hover,
.reporter-byline-link:focus {
  color: var(--red, #a94f2e);
  text-decoration: underline;
  text-underline-offset: 2px;
}

.reporter-byline-link + .mini-reporter-badge {
  pointer-events: none;
}


/* v11 byline spacing fix: preserve the visual space after "By" in flex bylines. */
.byline-prefix {
  display: inline;
}

.reporter-public-tagline {
  margin: -6px 0 12px;
  color: #a24d2c;
  font-size: clamp(18px, 2.2vw, 26px);
  font-weight: 900;
  letter-spacing: .01em;
}

/* v63 public reporter profile polish: full-width profile, readable bio, wider archive. */
.reporter-profile-full {
  width: 100% !important;
  max-width: none !important;
  margin: 0 0 2.25rem !important;
  border-color: #dfe5f4 !important;
  background: #fff !important;
  box-shadow: 0 18px 48px rgba(7, 27, 77, .12) !important;
}

.reporter-profile-full .reporter-cover {
  max-height: none !important;
  aspect-ratio: 3 / 1 !important;
  border-bottom: 4px solid #a34d2f !important;
}

.reporter-profile-full .reporter-profile-card-public {
  padding: clamp(1.35rem, 3vw, 2.45rem) !important;
  border-top: 0 !important;
}

.reporter-profile-kicker-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: .55rem;
}

.reporter-profile-full .reporter-profile-card-public h1 {
  margin: .2rem 0 .45rem !important;
  max-width: none !important;
}

.reporter-profile-tagline {
  margin: 0 0 1.35rem !important;
  color: #4f5b76 !important;
  font-size: clamp(1rem, 1.7vw, 1.22rem) !important;
  font-weight: 700 !important;
  line-height: 1.35 !important;
}

.reporter-profile-content-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(230px, 285px);
  gap: clamp(1.4rem, 3vw, 2.4rem);
  align-items: start;
}

.reporter-profile-bio-column {
  max-width: none;
}

.reporter-profile-bio-column .reporter-public-bio {
  max-width: none !important;
  margin: 0 0 .95rem !important;
  color: #263149 !important;
  font-size: clamp(1.02rem, 1.25vw, 1.13rem) !important;
  font-weight: 500 !important;
  line-height: 1.7 !important;
  letter-spacing: 0 !important;
}

.reporter-profile-side-card {
  padding: 1rem;
  border: 1px solid var(--line, #d8dde8);
  border-left: 6px solid var(--red, #c01920);
  background: #f8fafc;
  box-shadow: 0 10px 24px rgba(7, 27, 77, .06);
}

.reporter-profile-side-card strong {
  display: block;
  color: var(--navy, #071b4d);
  font-size: .84rem;
  font-weight: 1000;
  letter-spacing: .06em;
  line-height: 1.1;
  text-transform: uppercase;
}

.reporter-profile-side-card span {
  display: block;
  margin-top: .45rem;
  color: #5f6b85;
  font-size: .9rem;
  font-weight: 700;
  line-height: 1.35;
}

.reporter-profile-side-card .reporter-public-links {
  display: grid !important;
  gap: .55rem !important;
  margin-top: .95rem !important;
}

.reporter-profile-side-card .reporter-public-links .button.secondary {
  width: 100%;
  justify-content: center;
  text-align: center;
}

.reporter-story-results {
  width: 100% !important;
  max-width: none !important;
}

.reporter-story-results .reporter-section-head {
  margin-top: 0 !important;
}

.reporter-story-results .reporter-result-card,
.reporter-story-results .category-result-card {
  grid-template-columns: minmax(240px, 330px) minmax(0, 1fr) !important;
  gap: 1.25rem !important;
  padding: 1.1rem !important;
}

.reporter-story-results .category-result-image,
.reporter-story-results .category-result-image img {
  min-height: 175px !important;
}

.reporter-story-results .category-result-copy h2 {
  max-width: 820px;
}

.reporter-story-results .category-result-copy p {
  max-width: 780px;
  font-weight: 600 !important;
  line-height: 1.5 !important;
}

@media (max-width: 820px) {
  .reporter-profile-content-grid {
    grid-template-columns: 1fr;
  }

  .reporter-profile-side-card .reporter-public-links {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .reporter-story-results .reporter-result-card,
  .reporter-story-results .category-result-card {
    grid-template-columns: 180px minmax(0, 1fr) !important;
  }
}

@media (max-width: 620px) {
  .reporter-profile-full .reporter-profile-card-public {
    padding: 1.1rem !important;
  }

  .reporter-profile-side-card .reporter-public-links,
  .reporter-story-results .reporter-result-card,
  .reporter-story-results .category-result-card {
    grid-template-columns: 1fr !important;
  }

  .reporter-story-results .category-result-image,
  .reporter-story-results .category-result-image img {
    min-height: 190px !important;
  }
}


/* v64 trend navigation active-state fix */
.trend-inner a {
  color: var(--navy);
}
.trend-inner a.active,
.trend-inner a[aria-current="page"] {
  color: var(--red);
  text-transform: uppercase;
  font-weight: 1000;
}
.trend-inner strong {
  color: var(--navy);
}


/* v65 mobile menu includes the same section links as the desktop white trend menu. */
.main-nav .mobile-trend-nav {
  display: none;
}

@media (max-width: 760px) {
  .site-header .main-nav {
    max-height: calc(100vh - 92px);
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
  }

  .site-header .main-nav .mobile-trend-nav {
    display: grid;
    gap: .15rem;
    margin: .1rem 0 .25rem;
    padding: .35rem 0 .45rem;
    border-top: 1px solid rgba(255,255,255,.18);
    border-bottom: 1px solid rgba(255,255,255,.18);
  }

  .site-header .main-nav .mobile-trend-label {
    display: block;
    padding: .35rem .85rem .2rem;
    color: rgba(255,255,255,.72);
    font-size: .72rem;
    font-weight: 1000;
    letter-spacing: .08em;
    text-transform: uppercase;
  }

  .site-header .main-nav .mobile-trend-nav a {
    display: block;
    width: 100%;
    padding: .68rem .85rem;
    color: #fff !important;
    text-align: left;
    text-decoration: none;
    border-radius: 2px;
    font-weight: 1000;
    line-height: 1.15;
  }

  .site-header .main-nav .mobile-trend-nav a:hover,
  .site-header .main-nav .mobile-trend-nav a:focus {
    background: rgba(255,255,255,.12);
    color: #fff !important;
  }

  .site-header .main-nav .mobile-trend-nav a.active,
  .site-header .main-nav .mobile-trend-nav a[aria-current="page"] {
    background: transparent !important;
    color: #fff !important;
    border-color: transparent !important;
    box-shadow: none !important;
  }

  .site-header .main-nav > a.buy-ads-link,
  .site-header .main-nav > a:last-child {
    margin-top: .25rem;
    background: var(--red);
    border-color: rgba(255,255,255,.2);
  }
}


/* v66 mobile menu color cleanup: keep section links white without active color blocks. */
@media (max-width: 760px) {
  .site-header .main-nav .mobile-trend-nav a,
  .site-header .main-nav .mobile-trend-nav a.active,
  .site-header .main-nav .mobile-trend-nav a[aria-current="page"] {
    background: transparent !important;
    color: #fff !important;
    border-color: transparent !important;
    box-shadow: none !important;
  }

  .site-header .main-nav .mobile-trend-nav a:hover,
  .site-header .main-nav .mobile-trend-nav a:focus {
    background: rgba(255,255,255,.10) !important;
    color: #fff !important;
  }
}


/* Admin site settings readability */
.admin-settings-context {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .8rem;
  align-items: stretch;
  margin: 1rem 0;
  padding: .9rem 1rem;
  border: 1px solid var(--line, #d9dee8);
  background: #fff;
  box-shadow: 0 10px 24px rgba(12, 20, 46, 0.045);
}
.admin-settings-context div {
  display: grid;
  gap: .2rem;
  min-width: 0;
}
.admin-settings-context span {
  color: var(--muted, #667085);
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .04em;
  text-transform: uppercase;
}
.admin-settings-context strong,
.admin-settings-context code {
  color: var(--navy, #111735);
  font-size: .95rem;
  font-weight: 700;
  word-break: break-word;
}
.admin-settings-context p {
  grid-column: 1 / -1;
  margin: .2rem 0 0;
  color: var(--muted, #667085);
  font-size: .9rem;
  font-weight: 400;
  line-height: 1.45;
}
.admin-settings-form .admin-settings-card {
  padding: 1.15rem;
}
.admin-settings-form .admin-settings-card h2 {
  margin-bottom: .75rem;
  font-size: 1.35rem;
  font-weight: 700;
}
.admin-settings-form .admin-form-grid {
  align-items: start;
}
.admin-settings-form .admin-setting-field {
  gap: .35rem;
  margin: 0;
  color: var(--ink, #101828);
  text-transform: none;
  letter-spacing: normal;
  font-size: .9rem;
  font-weight: 400 !important;
}
.admin-settings-form .admin-setting-label {
  color: var(--navy, #111735);
  font-size: .76rem;
  font-weight: 600;
  letter-spacing: .035em;
  line-height: 1.25;
  text-transform: uppercase;
}
.admin-settings-form .admin-setting-field input,
.admin-settings-form .admin-setting-field select,
.admin-settings-form .admin-setting-field textarea {
  color: #1f2937;
  font-size: .95rem;
  font-weight: 400 !important;
  line-height: 1.35;
}
.admin-settings-form .admin-setting-key {
  margin-top: -.1rem;
  color: var(--muted, #667085);
  font-size: .68rem;
  font-weight: 400 !important;
  line-height: 1.2;
}
.admin-settings-form .admin-setting-key code {
  padding: .12rem .25rem;
  border: 1px solid #e5e7ef;
  background: #f7f9fc;
  color: #667085;
  font-size: .68rem;
  font-weight: 400;
  letter-spacing: .02em;
  text-transform: uppercase;
}
.admin-settings-form .admin-setting-help {
  color: var(--muted, #667085);
  font-size: .72rem;
  font-weight: 400 !important;
  line-height: 1.3;
  text-transform: none;
  letter-spacing: normal;
}
.site-switcher label {
  white-space: nowrap;
}
@media (max-width: 900px) {
  .admin-settings-context {
    grid-template-columns: 1fr;
  }
}


/* v67 mobile story width and compact share controls */
@media (max-width: 640px) {
  /* The normal page gutter plus the article padding made stories feel narrow
     on phones. Keep a small outer safety gutter and let the article use the
     rest of the viewport. */
  .page:has(.article-layout) {
    width: calc(100% - .75rem);
  }

  .article-layout {
    gap: .85rem;
  }

  .article-main {
    width: 100%;
    padding: .85rem .75rem 1.2rem;
    border-top-width: 4px;
  }

  .article-main h1 {
    font-size: clamp(2rem, 10.5vw, 2.65rem);
    line-height: 1.04;
  }

  .article-main .summary {
    font-size: 1.08rem;
    line-height: 1.5;
  }

  .article-main .story-body {
    font-size: 1.08rem;
    line-height: 1.68;
  }

  /* Keep the four actions on one compact row. Copy URL is a utility action,
     so it should not expand into a full-width second row. */
  .article-main .share-links {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 46px minmax(0, 1fr) auto;
    gap: .42rem;
    width: 100%;
    align-items: stretch;
  }

  .article-main .share-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-width: 0;
    min-height: 44px;
    padding: .62rem .48rem;
    font-size: .76rem;
    line-height: 1;
    text-align: center;
  }

  .article-main .share-copy-url {
    width: auto;
    padding-inline: .62rem;
    font-size: .7rem;
  }

  .article-main .article-hero {
    margin: 1rem 0 1.15rem;
  }
}

@media (max-width: 390px) {
  .article-main {
    padding-inline: .6rem;
  }

  .article-main .share-links {
    grid-template-columns: minmax(0, 1fr) 42px minmax(0, 1fr) auto;
    gap: .32rem;
  }

  .article-main .share-button {
    padding-inline: .34rem;
    font-size: .7rem;
  }

  .article-main .share-copy-url {
    padding-inline: .48rem;
    font-size: .66rem;
  }
}


/* Comic stories preserve the complete uploaded strip/page instead of using a
   fixed crop. The upload pipeline also keeps the source aspect ratio. */
.article-main .article-hero.is-comic {
  min-height: 0;
  height: auto;
  overflow: visible;
  background: transparent;
}

.article-main .article-hero.is-comic::after {
  display: none;
}

.article-main .article-hero.is-comic .image-label,
.article-main .article-hero.is-comic .image-title {
  display: none;
}

.article-main .article-hero.is-comic img {
  position: relative !important;
  inset: auto !important;
  width: 100% !important;
  height: auto !important;
  max-width: 100% !important;
  max-height: none !important;
  object-fit: contain !important;
}

/* Latter Day Comics theme */
:root{--navy:#17395f;--navy-2:#315d88;--navy-3:#527ca6;--red:#4e79a5;--red-dark:#315d88;--gold:#b9dcea;--ink:#10243b;--muted:#60758b;--line:#d4e1eb;--bg:#f4f8fb;--paper:#fff;--rail:#edf4f8;--shadow:0 16px 40px rgba(23,57,95,.16)}
body{background:linear-gradient(180deg,#f9fcfe 0,#eef5fa 100%);font-family:Arial,Helvetica,sans-serif}
.network-bar{background:#102a48;border-bottom:3px solid #8cc0d8}.network-item{text-decoration:none;color:#fff}
.ldc-masthead{position:relative;overflow:hidden;background:linear-gradient(145deg,#76aecb 0 18%,#5c88b0 18% 43%,#456f99 43% 100%)}
.ldc-masthead:before,.ldc-masthead:after{content:"";position:absolute;inset:auto -10% -70px 25%;height:150px;background:rgba(255,255,255,.08);transform:skewY(-11deg)}
.ldc-masthead:after{inset:-90px 25% auto -10%;background:rgba(255,255,255,.1)}
.masthead-inner{position:relative;z-index:1;min-height:92px}.brand{gap:1rem}.ldc-mark{width:72px;height:72px;display:grid;place-items:center;clip-path:polygon(50% 0,92% 22%,92% 75%,50% 100%,8% 75%,8% 22%);background:#fff;filter:drop-shadow(0 5px 0 rgba(16,42,72,.22))}.ldc-mark span{display:grid;place-items:center;width:58px;height:58px;clip-path:inherit;background:#17395f;color:#fff;font-weight:1000;letter-spacing:-.08em}.brand-copy{display:grid}.brand-copy small{font-weight:800;letter-spacing:.06em;text-transform:uppercase;opacity:.9}.brand-text{font-size:clamp(1.55rem,3vw,2.8rem)}
.main-nav a{border:1px solid transparent}.main-nav a:hover{background:#fff;color:#17395f;border-color:#fff}.main-nav a:last-child{background:#fff;color:#17395f;border-color:#fff}
.trend-inner strong{color:#315d88}.trend-inner a:hover{color:#527ca6}.section-label,.story-flag,.rail-kicker{background:#4e79a5}.news-topper h1,h1{color:#17395f}.story-card,.rail-card,.article-main{border-color:#d4e1eb}.story-card:hover{transform:translateY(-3px);box-shadow:0 16px 35px rgba(23,57,95,.13)}
.article-hero.is-comic img{object-fit:contain;background:#e8f1f7}.comic-reader{display:grid;justify-items:center;gap:clamp(.5rem,1.4vw,1rem);margin:1.5rem auto;max-width:980px}.comic-page{margin:0;width:100%;display:grid;justify-items:center}.comic-page img{display:block;max-width:100%;width:auto;height:auto;box-shadow:0 12px 30px rgba(16,42,72,.18);background:#fff}.comic-page figcaption{padding:.5rem 1rem;color:var(--muted);font-weight:700}
.admin-story-editor{max-width:1200px;margin:auto}.editor-grid{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:1.5rem}.editor-main,.editor-side,.comic-gallery-admin{display:grid;gap:1rem}.field-row{display:grid;grid-template-columns:1fr 1fr;gap:1rem}.admin-cover-preview{max-width:100%;height:auto}.comic-gallery-admin{margin-top:1.5rem;padding-top:1.5rem;border-top:3px solid var(--line)}.gallery-heading{display:flex;justify-content:space-between;gap:2rem}.gallery-heading p{max-width:520px}.gallery-sort-list{display:grid;gap:1rem}.gallery-admin-card{display:grid;grid-template-columns:36px 150px 1fr;gap:1rem;align-items:start;padding:1rem;background:#fff;border:1px solid var(--line)}.gallery-admin-card.dragging{opacity:.45}.gallery-admin-card img{width:150px;max-height:180px;object-fit:contain;background:#eef4f8}.drag-handle{font-size:1.5rem;cursor:grab;color:var(--navy)}.gallery-admin-fields{display:grid;gap:.65rem}.gallery-options{display:flex;gap:1rem}.comic-upload-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:.75rem}
@media(max-width:800px){.editor-grid{grid-template-columns:1fr}.field-row,.comic-upload-grid{grid-template-columns:1fr}.gallery-admin-card{grid-template-columns:28px 90px 1fr}.gallery-admin-card img{width:90px}.brand-copy small{display:none}}

/* Latter-Day Comics storefront refresh */
.ldc-masthead {
  background: #5876a2;
}

.ldc-brand-logo {
  width: 68px;
  height: 68px;
  flex: 0 0 68px;
  object-fit: contain;
  display: block;
}

.brand-copy {
  display: grid;
  min-width: 0;
}

.brand-copy small {
  margin-top: .2rem;
  color: rgba(255,255,255,.9);
  font-size: .72rem;
  font-weight: 900;
  letter-spacing: .06em;
  line-height: 1;
  text-transform: uppercase;
}

.ldc-release-section {
  margin-top: 1rem;
}

.ldc-release-heading {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 1rem;
  padding-bottom: .8rem;
  border-bottom: 2px solid var(--line);
}

.ldc-release-heading h2 {
  margin: .35rem 0 0;
  color: var(--navy);
  font-size: clamp(1.7rem, 4vw, 2.6rem);
  line-height: 1;
  letter-spacing: -.045em;
}

.ldc-view-all {
  color: var(--navy);
  font-size: .82rem;
  font-weight: 1000;
  text-decoration: none;
  text-transform: uppercase;
}

.ldc-view-all:hover { text-decoration: underline; }

.ldc-comic-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1.35rem;
}

.ldc-comic-card {
  min-width: 0;
  overflow: hidden;
  background: var(--paper);
  border: 1px solid var(--line);
  box-shadow: 0 10px 24px rgba(20, 43, 80, .09);
  transition: transform .18s ease, box-shadow .18s ease;
}

.ldc-comic-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 16px 34px rgba(20, 43, 80, .16);
}

.ldc-cover-link {
  display: block;
  color: inherit;
  text-decoration: none;
}

.ldc-cover {
  display: grid;
  place-items: center;
  width: 100%;
  aspect-ratio: 4 / 3;
  overflow: hidden;
  background: #e8eef7;
  border-bottom: 1px solid var(--line);
}

.ldc-cover img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  background: #fff;
}

.ldc-cover-placeholder {
  color: #5876a2;
  font-size: 2.4rem;
  font-weight: 1000;
  letter-spacing: -.08em;
}

.ldc-card-copy {
  padding: .95rem 1rem 1.05rem;
}

.ldc-card-category {
  display: inline-block;
  margin-bottom: .45rem;
  color: #5876a2;
  font-size: .7rem;
  font-weight: 1000;
  letter-spacing: .06em;
  text-transform: uppercase;
}

.ldc-card-copy h2 {
  margin: 0 0 .5rem;
  color: var(--navy);
  font-size: clamp(1.25rem, 2vw, 1.65rem);
  line-height: 1.05;
  letter-spacing: -.035em;
}

.ldc-card-copy h2 a {
  color: inherit;
  text-decoration: none;
}

.ldc-card-copy h2 a:hover { text-decoration: underline; }

.ldc-card-copy p {
  display: -webkit-box;
  margin: 0 0 .7rem;
  overflow: hidden;
  color: var(--muted);
  font-weight: 650;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
}

.ldc-card-copy small {
  color: var(--muted);
  font-size: .78rem;
  font-weight: 750;
}

.ldc-home-ad {
  max-width: 760px;
  margin: 2rem auto 0;
}

@media (max-width: 900px) {
  .ldc-comic-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 720px) {
  .network-bar,
  .trend-bar {
    display: none;
  }

  .ldc-masthead {
    background: #5876a2;
    box-shadow: 0 2px 10px rgba(9, 31, 67, .18);
  }

  .masthead-inner {
    min-height: 82px;
    padding: .55rem .15rem;
    flex-direction: row;
    align-items: center;
  }

  .ldc-brand {
    gap: .55rem;
    max-width: calc(100% - 54px);
  }

  .ldc-brand-logo {
    width: 58px;
    height: 58px;
    flex-basis: 58px;
  }

  .brand-text {
    font-size: clamp(1.15rem, 5.2vw, 1.55rem);
    line-height: .98;
    letter-spacing: -.04em;
    white-space: nowrap;
  }

  .brand-copy small { display: none; }

  .mobile-menu-toggle {
    margin-left: auto;
    flex: 0 0 auto;
  }

  .main-nav {
    position: absolute;
    z-index: 20;
    top: 82px;
    right: 0;
    left: 0;
    display: none;
    padding: .75rem 1rem 1rem;
    background: #405f8e;
    box-shadow: 0 10px 18px rgba(9, 31, 67, .2);
  }

  .main-nav.is-open,
  .main-nav[aria-hidden="false"] {
    display: grid;
  }

  .main-nav a {
    padding: .7rem;
    border-bottom: 1px solid rgba(255,255,255,.15);
  }

  .ldc-home-topper { margin-top: .35rem; }

  .ldc-release-heading {
    align-items: flex-start;
    flex-direction: column;
  }

  .ldc-comic-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .75rem;
  }

  .ldc-card-copy { padding: .7rem; }
  .ldc-card-copy h2 { font-size: 1.05rem; }
  .ldc-card-copy p { display: none; }
  .ldc-card-copy small { font-size: .68rem; }
}

@media (max-width: 390px) {
  .brand-text { font-size: 1.05rem; }
  .ldc-brand-logo { width: 52px; height: 52px; flex-basis: 52px; }
  .ldc-comic-grid { gap: .55rem; }
}

/* LDC compact masthead + comic thumbnail grid repair */
.site-header.ldc-header .ldc-masthead {
  min-height: 0 !important;
  background: #5876a2 !important;
  background-image: none !important;
}

.site-header.ldc-header .ldc-masthead .masthead-inner {
  width: min(1180px, calc(100% - 2rem)) !important;
  min-height: 76px !important;
  height: auto !important;
  padding: .45rem 0 !important;
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 1rem !important;
  overflow: visible !important;
}

.site-header.ldc-header .ldc-brand {
  display: inline-flex !important;
  flex: 0 1 auto !important;
  align-items: center !important;
  gap: .75rem !important;
  max-width: calc(100% - 300px) !important;
  min-width: 0 !important;
}

.site-header.ldc-header .ldc-brand-logo {
  display: block !important;
  width: 58px !important;
  height: 58px !important;
  min-width: 58px !important;
  max-width: 58px !important;
  min-height: 58px !important;
  max-height: 58px !important;
  flex: 0 0 58px !important;
  object-fit: contain !important;
  margin: 0 !important;
  padding: 0 !important;
  transform: none !important;
}

.site-header.ldc-header .brand-copy {
  display: grid !important;
  min-width: 0 !important;
}

.site-header.ldc-header .brand-text {
  font-size: clamp(1.45rem, 2.6vw, 2.35rem) !important;
  line-height: .95 !important;
  white-space: nowrap !important;
}

.site-header.ldc-header .main-nav {
  flex: 0 0 auto !important;
}

.ldc-category-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1.25rem;
  margin-top: 1rem;
}

.ldc-category-card {
  min-width: 0;
  overflow: hidden;
  background: #fff;
  border: 1px solid var(--line);
  box-shadow: 0 8px 22px rgba(20, 43, 80, .08);
  transition: transform .18s ease, box-shadow .18s ease;
}

.ldc-category-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 14px 30px rgba(20, 43, 80, .14);
}

.ldc-category-thumb {
  display: block;
  width: 100%;
  aspect-ratio: 4 / 3;
  overflow: hidden;
  background: #e8eef7;
  border-bottom: 1px solid var(--line);
}

.ldc-category-thumb img {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  max-height: none !important;
  object-fit: cover !important;
  object-position: center !important;
  margin: 0 !important;
}

.ldc-category-copy {
  padding: .9rem 1rem 1rem;
}

.ldc-category-meta {
  display: flex;
  flex-wrap: wrap;
  gap: .3rem;
  color: var(--muted);
  font-size: .72rem;
  font-weight: 800;
  text-transform: uppercase;
}

.ldc-category-meta a {
  color: #5876a2;
  text-decoration: none;
}

.ldc-category-copy h2 {
  margin: .45rem 0 .5rem;
  color: var(--navy);
  font-size: clamp(1.18rem, 2vw, 1.55rem);
  line-height: 1.05;
  letter-spacing: -.035em;
}

.ldc-category-copy h2 a {
  color: inherit;
  text-decoration: none;
}

.ldc-category-copy h2 a:hover { text-decoration: underline; }

.ldc-category-copy > p {
  display: -webkit-box;
  margin: 0;
  overflow: hidden;
  color: var(--muted);
  font-weight: 650;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
}

@media (max-width: 900px) {
  .ldc-category-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 720px) {
  .site-header.ldc-header .ldc-masthead .masthead-inner {
    width: 100% !important;
    min-height: 68px !important;
    padding: .4rem .75rem !important;
  }

  .site-header.ldc-header .ldc-brand {
    max-width: calc(100% - 52px) !important;
    gap: .5rem !important;
  }

  .site-header.ldc-header .ldc-brand-logo {
    width: 48px !important;
    height: 48px !important;
    min-width: 48px !important;
    max-width: 48px !important;
    min-height: 48px !important;
    max-height: 48px !important;
    flex-basis: 48px !important;
  }

  .site-header.ldc-header .brand-text {
    font-size: clamp(1.02rem, 5vw, 1.35rem) !important;
  }

  .site-header.ldc-header .main-nav {
    top: 68px !important;
  }

  .ldc-category-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .7rem;
  }

  .ldc-category-copy { padding: .7rem; }
  .ldc-category-copy h2 { font-size: 1rem; }
  .ldc-category-copy > p { display: none; }
  .ldc-category-meta { font-size: .62rem; }
}

@media (max-width: 390px) {
  .ldc-category-grid { gap: .5rem; }
  .ldc-category-copy { padding: .6rem; }
}

/* LDC masthead logo sizing + homepage advertising placement (v3) */
.site-header.ldc-header .ldc-masthead .masthead-inner {
  min-height: 92px !important;
}

.site-header.ldc-header .ldc-brand-logo {
  width: 88px !important;
  height: 88px !important;
  min-width: 88px !important;
  max-width: 88px !important;
  min-height: 88px !important;
  max-height: 88px !important;
  flex: 0 0 88px !important;
}

/* Treat the homepage ad as a horizontal shelf beneath the releases,
   rather than a narrow sidebar card floating under the first comic. */
.ldc-home-ad {
  width: 100%;
  max-width: none !important;
  margin: 2rem 0 0 !important;
  padding: 1rem 0;
  border-top: 1px solid var(--line);
}

.ldc-home-ad > * {
  width: 100%;
  max-width: none !important;
  margin-inline: 0 !important;
}

.ldc-home-ad .public-ad-card,
.ldc-home-ad .ad-card {
  width: 100%;
  max-width: none !important;
}

@media (max-width: 720px) {
  .site-header.ldc-header .ldc-masthead .masthead-inner {
    min-height: 80px !important;
  }

  .site-header.ldc-header .ldc-brand-logo {
    width: 66px !important;
    height: 66px !important;
    min-width: 66px !important;
    max-width: 66px !important;
    min-height: 66px !important;
    max-height: 66px !important;
    flex-basis: 66px !important;
  }

  .site-header.ldc-header .ldc-brand {
    max-width: calc(100% - 54px) !important;
  }

  .site-header.ldc-header .main-nav {
    top: 80px !important;
  }

  .ldc-home-ad {
    margin-top: 1.4rem !important;
    padding-top: .8rem;
  }
}

/* LDC masthead height correction (v4)
   Keep the larger logo, but restore the compact masthead height. */
.site-header.ldc-header .ldc-masthead .masthead-inner {
  min-height: 76px !important;
  height: 76px !important;
  padding-top: .2rem !important;
  padding-bottom: .2rem !important;
}

.site-header.ldc-header .ldc-brand-logo {
  width: 72px !important;
  height: 72px !important;
  min-width: 72px !important;
  max-width: 72px !important;
  min-height: 72px !important;
  max-height: 72px !important;
  flex: 0 0 72px !important;
}

@media (max-width: 720px) {
  .site-header.ldc-header .ldc-masthead .masthead-inner {
    min-height: 64px !important;
    height: 64px !important;
    padding-top: .2rem !important;
    padding-bottom: .2rem !important;
  }

  .site-header.ldc-header .ldc-brand-logo {
    width: 58px !important;
    height: 58px !important;
    min-width: 58px !important;
    max-width: 58px !important;
    min-height: 58px !important;
    max-height: 58px !important;
    flex-basis: 58px !important;
  }

  .site-header.ldc-header .main-nav {
    top: 64px !important;
  }
}

/* Latter-Day Comics white sticky bookstore header + shelf layout (v6) */
.site-header.ldc-store-header {
  position: sticky;
  top: 0;
  z-index: 1000;
  background: #fff;
  border-top: 3px solid #203c70;
  border-bottom: 1px solid #d8dee8;
  box-shadow: 0 2px 10px rgba(18, 37, 68, .08);
}

.ldc-store-bar { background: #fff; }
.ldc-store-inner {
  width: min(1180px, calc(100% - 32px));
  min-height: 70px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 28px;
}

.ldc-store-brand {
  display: inline-flex;
  align-items: center;
  gap: 11px;
  min-width: 0;
  color: #172f59;
  text-decoration: none;
}

.ldc-store-logo {
  display: block;
  width: 54px;
  height: 54px;
  flex: 0 0 54px;
  object-fit: contain;
}

.ldc-store-wordmark {
  font-family: var(--headline-font, Impact, "Arial Narrow", sans-serif);
  font-size: clamp(1.25rem, 2.1vw, 2rem);
  font-weight: 900;
  line-height: 1;
  letter-spacing: -.035em;
  white-space: nowrap;
}

.site-header.ldc-store-header .ldc-store-nav {
  position: static;
  display: flex;
  align-items: stretch;
  gap: 3px;
  background: transparent;
  box-shadow: none;
}

.site-header.ldc-store-header .ldc-store-nav > a,
.ldc-nav-trigger {
  min-height: 68px;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 0 13px;
  border: 0;
  border-bottom: 3px solid transparent;
  background: transparent;
  color: #111d35;
  font: inherit;
  font-size: .82rem;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: .025em;
  text-decoration: none;
  cursor: pointer;
}

.site-header.ldc-store-header .ldc-store-nav > a:hover,
.site-header.ldc-store-header .ldc-store-nav > a:focus,
.ldc-nav-trigger:hover,
.ldc-nav-trigger:focus,
.ldc-nav-menu.is-open > .ldc-nav-trigger {
  color: #315d9b;
  border-bottom-color: #315d9b;
  background: transparent;
}

.ldc-nav-trigger > span {
  width: 7px;
  height: 7px;
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  transform: rotate(45deg) translateY(-2px);
  transition: transform .16s ease;
}
.ldc-nav-menu.is-open .ldc-nav-trigger > span { transform: rotate(225deg) translate(-2px, -1px); }

.ldc-nav-menu { position: relative; display: flex; }
.ldc-nav-dropdown {
  position: absolute;
  top: calc(100% - 1px);
  left: 0;
  min-width: 210px;
  display: none;
  padding: 10px;
  background: #fff;
  border: 1px solid #d8dee8;
  box-shadow: 0 16px 35px rgba(15, 34, 65, .16);
}
.ldc-nav-menu.is-open .ldc-nav-dropdown { display: grid; }
.ldc-nav-dropdown a {
  padding: 10px 12px;
  color: #182c50;
  font-weight: 800;
  text-decoration: none;
  white-space: nowrap;
}
.ldc-nav-dropdown a:hover,
.ldc-nav-dropdown a:focus { background: #eef3fa; color: #315d9b; }

.site-header.ldc-store-header .ldc-account-link {
  min-height: 38px;
  align-self: center;
  margin-left: 8px;
  padding: 0 15px;
  border: 1px solid #bfc9d8;
  border-bottom-width: 1px;
}
.site-header.ldc-store-header .ldc-account-link:hover { border-color: #315d9b; }

/* Cover-first shelves rather than boxed news cards. */
.ldc-bookstore-grid {
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 28px 16px;
  align-items: start;
}

.ldc-book-card,
.ldc-category-card.ldc-book-card {
  display: block;
  min-width: 0;
  overflow: visible;
  background: transparent;
  border: 0;
  box-shadow: none;
  transform: none;
}
.ldc-book-card:hover { transform: translateY(-4px); box-shadow: none; }

.ldc-book-card .ldc-cover-link,
.ldc-book-card .ldc-category-thumb {
  display: block;
  width: 100%;
  aspect-ratio: 2 / 3;
  overflow: hidden;
  background: #e8edf4;
  border: 1px solid #c6cfdb;
  box-shadow: 0 6px 16px rgba(20, 40, 72, .12);
}

.ldc-book-card .ldc-cover,
.ldc-book-card .ldc-category-thumb {
  width: 100%;
  height: 100%;
  aspect-ratio: 2 / 3;
  min-height: 0;
}

.ldc-book-card .ldc-cover img,
.ldc-book-card .ldc-category-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: top center;
}

.ldc-book-card .ldc-card-copy,
.ldc-book-card .ldc-category-copy {
  padding: 10px 2px 0;
  background: transparent;
}

.ldc-book-card .ldc-card-category,
.ldc-book-card .ldc-category-meta {
  margin-bottom: 5px;
  color: #62718a;
  font-size: .66rem;
}

.ldc-book-card .ldc-card-copy h2,
.ldc-book-card .ldc-category-copy h2 {
  margin: 0;
  font-size: 1rem;
  line-height: 1.08;
  text-transform: uppercase;
}

.ldc-book-card .ldc-card-copy p,
.ldc-book-card .ldc-category-copy > p { display: none; }
.ldc-book-card .ldc-card-copy small { margin-top: 7px; font-size: .67rem; }

@media (max-width: 980px) {
  .ldc-store-wordmark { font-size: 1.45rem; }
  .site-header.ldc-store-header .ldc-store-nav > a,
  .ldc-nav-trigger { padding-inline: 9px; font-size: .74rem; }
  .ldc-bookstore-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

@media (max-width: 760px) {
  .site-header.ldc-store-header { border-top-width: 2px; }
  .ldc-store-inner { width: 100%; min-height: 62px; padding: 0 12px; gap: 10px; }
  .ldc-store-logo { width: 48px; height: 48px; flex-basis: 48px; }
  .ldc-store-wordmark { font-size: 1.22rem; white-space: normal; }

  .site-header.ldc-store-header .mobile-menu-toggle {
    position: static;
    display: inline-flex;
    flex: 0 0 auto;
    color: #172f59;
    border-color: #bfc9d8;
    background: #fff;
  }

  .site-header.ldc-store-header .ldc-store-nav {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    display: none;
    padding: 8px 12px 14px;
    background: #fff;
    border-top: 1px solid #d8dee8;
    box-shadow: 0 14px 24px rgba(15, 34, 65, .14);
  }
  .site-header.ldc-store-header .ldc-store-nav.is-open { display: grid; }
  .site-header.ldc-store-header .ldc-store-nav > a,
  .ldc-nav-trigger {
    width: 100%;
    min-height: 44px;
    justify-content: space-between;
    padding: 0 10px;
    border-bottom: 1px solid #e3e8ef;
  }
  .ldc-nav-menu { display: grid; }
  .ldc-nav-dropdown {
    position: static;
    min-width: 0;
    padding: 0 0 7px 12px;
    border: 0;
    box-shadow: none;
    background: #f5f7fb;
  }
  .ldc-nav-dropdown a { padding: 9px 12px; }
  .site-header.ldc-store-header .ldc-account-link { margin: 8px 0 0; justify-content: center; }
  .ldc-bookstore-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 22px 10px; }
}

@media (max-width: 520px) {
  .ldc-store-wordmark { font-size: 1.05rem; }
  .ldc-bookstore-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ldc-book-card .ldc-card-copy h2,
  .ldc-book-card .ldc-category-copy h2 { font-size: .88rem; }
}

/* Full-bleed coming-soon hero on the Latter-Day Comics home page. */
.ldc-coming-soon-hero {
  display: block;
  width: 100vw;
  min-height: clamp(390px, 44vw, 720px);
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  background-image: url('/images/coming-soon-hero.png?v=20260731-1');
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
  text-decoration: none;
  box-shadow: inset 0 -1px 0 rgba(255, 255, 255, .16);
}

.ldc-coming-soon-hero:focus-visible {
  outline: 4px solid #75b7ff;
  outline-offset: -4px;
}

.ldc-hero-category-strip {
  margin-top: 0;
  padding-top: 18px;
  padding-bottom: 18px;
  border-top: 0;
}

.visually-hidden {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

@media (max-width: 900px) {
  .ldc-coming-soon-hero {
    min-height: 480px;
    background-position: 58% center;
  }
}

@media (max-width: 600px) {
  .ldc-coming-soon-hero {
    min-height: 410px;
    background-position: 61% center;
  }

  .ldc-hero-category-strip {
    padding-top: 14px;
    padding-bottom: 14px;
  }
}


/* Hero alignment and mobile copy fix. */
.page > .ldc-coming-soon-hero:first-child {
  margin-top: -1.6rem;
}

.ldc-mobile-hero-copy {
  display: none;
}

@media (max-width: 600px) {
  .ldc-coming-soon-hero {
    position: relative;
    min-height: 430px;
    background-position: 72% center;
  }

  .ldc-coming-soon-hero::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg, rgba(4, 20, 49, .96) 0%, rgba(4, 20, 49, .82) 43%, rgba(4, 20, 49, .20) 72%, rgba(4, 20, 49, 0) 100%);
    pointer-events: none;
  }

  .ldc-mobile-hero-copy {
    position: relative;
    z-index: 1;
    display: flex;
    width: min(68%, 300px);
    min-height: 430px;
    padding: 54px 0 34px 18px;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    color: #fff;
    text-shadow: 0 2px 8px rgba(0, 0, 0, .34);
  }

  .ldc-mobile-hero-kicker {
    color: #7db9ff;
    font-size: .78rem;
    font-weight: 1000;
    letter-spacing: .08em;
    text-transform: uppercase;
  }

  .ldc-mobile-hero-copy strong {
    margin-top: 12px;
    font-size: clamp(2.2rem, 11vw, 3.45rem);
    line-height: .92;
    letter-spacing: -.055em;
  }

  .ldc-mobile-hero-summary {
    margin-top: 18px;
    font-size: .94rem;
    line-height: 1.35;
  }

  .ldc-mobile-hero-button {
    margin-top: 20px;
    padding: 11px 16px;
    border-radius: 5px;
    background: #72adf5;
    color: #071b4d;
    font-size: .76rem;
    font-weight: 1000;
    letter-spacing: .03em;
    text-shadow: none;
    text-transform: uppercase;
  }
}

/* LDC home-page rhythm cleanup: add breathing room below the hero and
   remove divider rules that compete with the cover-first storefront. */
.ldc-hero-category-strip {
  margin: 0 auto 24px;
  padding-top: 30px;
  padding-bottom: 18px;
  border-top: 0 !important;
  border-bottom: 0 !important;
}

.ldc-release-section {
  margin-top: 0;
  padding-top: 0;
  border-top: 0 !important;
  border-bottom: 0 !important;
}

.ldc-release-section::before,
.ldc-release-section::after {
  display: none !important;
}

.ldc-home-ad,
.ad-banner-slot.ldc-home-ad {
  margin-top: 32px !important;
  padding-top: 0;
  border-top: 0 !important;
  border-bottom: 0 !important;
}

@media (max-width: 600px) {
  .ldc-hero-category-strip {
    margin-bottom: 20px;
    padding-top: 22px;
    padding-bottom: 12px;
  }

  .ldc-home-ad,
  .ad-banner-slot.ldc-home-ad {
    margin-top: 26px !important;
  }
}

/* Latter-Day Comics category landing page: promotional hero + cleaner release grid. */
.ldc-category-hero {
  position: relative;
  width: 100vw;
  min-height: clamp(360px, 42vw, 620px);
  margin: -1.6rem calc(50% - 50vw) 0;
  overflow: hidden;
  background: #071a3f url('/images/coming-soon-hero.png?v=20260731-1') center/cover no-repeat;
  isolation: isolate;
}
.ldc-category-hero.has-featured-art { background-image: var(--ldc-category-hero-image); }
.ldc-category-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: linear-gradient(90deg, rgba(3,15,40,.98) 0%, rgba(3,15,40,.90) 38%, rgba(3,15,40,.42) 68%, rgba(3,15,40,.12) 100%),
              linear-gradient(0deg, rgba(3,15,40,.42), transparent 45%);
}
.ldc-category-hero-inner {
  width: min(1180px, calc(100% - 40px));
  min-height: inherit;
  margin: 0 auto;
  display: flex;
  align-items: center;
}
.ldc-category-hero-copy { width: min(560px, 52%); color: #fff; padding: 58px 0; }
.ldc-category-hero-copy .section-label { display: inline-flex; margin: 0 0 18px; background: #6c85b6; color: #fff; }
.ldc-category-eyebrow { display:block; margin-bottom:10px; color:#8fc3ff; font-size:.78rem; font-weight:1000; letter-spacing:.1em; text-transform:uppercase; }
.ldc-category-hero h1 { margin:0; color:#fff; font-size:clamp(2.5rem,5.5vw,5.6rem); line-height:.93; letter-spacing:-.055em; }
.ldc-category-hero-copy > p:not(.section-label) { max-width:520px; margin:22px 0 0; color:rgba(255,255,255,.86); font-size:clamp(1rem,1.4vw,1.2rem); line-height:1.55; }
.ldc-category-hero-button { margin-top:26px; background:#78b4ff; color:#071a3f; border-color:#78b4ff; }
.ldc-category-nav { margin:0 auto 34px; padding:22px 0 4px; border:0 !important; }
.ldc-category-releases { margin-top:8px; }
.ldc-category-section-heading { display:flex; align-items:end; justify-content:space-between; gap:24px; margin:0 0 24px; padding-bottom:14px; border-bottom:1px solid #dce3ed; }
.ldc-category-section-heading h2 { margin:8px 0 0; color:#122957; font-size:clamp(1.8rem,3vw,2.8rem); line-height:1; }
.ldc-category-section-heading p { margin:0; color:#647089; }
.ldc-category-card { transition:transform .18s ease, box-shadow .18s ease; }
.ldc-category-card:hover { transform:translateY(-4px); }
.ldc-category-thumb { overflow:hidden; background:#eef2f8; }
.ldc-category-thumb img { transition:transform .28s ease; }
.ldc-category-card:hover .ldc-category-thumb img { transform:scale(1.025); }

/* LDC-specific advertising presentation. */
.buy-ads-page { --buy-ads-accent:#6f8fbe; }
.buy-ads-hero-art img, .buy-ads-custom-card img, .buy-ads-benefit img { object-fit:contain; }
.buy-ads-mascot-stage > img { width:110px; height:110px; padding:10px; border-radius:50%; background:#fff; box-shadow:0 14px 28px rgba(9,30,69,.16); }
.buy-ads-final-cta { background:linear-gradient(135deg,#0a1f4a,#173d76); }

@media (max-width: 760px) {
  .ldc-category-hero { min-height:430px; background-position:64% center; }
  .ldc-category-hero::before { background:linear-gradient(90deg,rgba(3,15,40,.97),rgba(3,15,40,.82) 65%,rgba(3,15,40,.48)); }
  .ldc-category-hero-inner { width:min(100% - 28px,1180px); }
  .ldc-category-hero-copy { width:min(88%,560px); padding:48px 0; }
  .ldc-category-hero h1 { font-size:clamp(2.4rem,12vw,4.2rem); }
  .ldc-category-section-heading { align-items:flex-start; flex-direction:column; gap:10px; }
}

/* Latter-Day Comics category index. Uses the evergreen coming-soon artwork. */
.ldc-categories-hero {
  position: relative;
  width: 100vw;
  min-height: clamp(360px, 40vw, 590px);
  margin: -1.6rem calc(50% - 50vw) 0;
  overflow: hidden;
  background: #071a3f url('/images/coming-soon-hero.png?v=1') center/cover no-repeat;
  isolation: isolate;
}
.ldc-categories-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: linear-gradient(90deg, rgba(3,15,40,.98) 0%, rgba(3,15,40,.9) 40%, rgba(3,15,40,.44) 70%, rgba(3,15,40,.12) 100%);
}
.ldc-categories-hero-inner {
  width: min(1180px, calc(100% - 40px));
  min-height: inherit;
  margin: 0 auto;
  display: flex;
  align-items: center;
}
.ldc-categories-hero-copy {
  width: min(570px, 54%);
  padding: 58px 0;
  color: #fff;
}
.ldc-categories-hero-copy .section-label { display: inline-flex; margin: 0 0 18px; background: #6c85b6; color: #fff; }
.ldc-categories-hero-copy h1 { margin: 0; color: #fff; font-size: clamp(2.8rem, 5.4vw, 5.5rem); line-height: .94; letter-spacing: -.055em; }
.ldc-categories-hero-copy > p:not(.section-label) { max-width: 520px; margin: 22px 0 0; color: rgba(255,255,255,.88); font-size: clamp(1rem,1.35vw,1.18rem); line-height: 1.55; }
.ldc-categories-directory { margin-top: 8px; }
.ldc-categories-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 24px; }
.ldc-category-tile {
  position: relative;
  min-height: 290px;
  overflow: hidden;
  border: 1px solid #d7dfeb;
  background: #102852 url('/images/coming-soon-hero.png?v=1') center/cover no-repeat;
  box-shadow: 0 16px 34px rgba(12,33,72,.10);
  text-decoration: none;
  transition: transform .18s ease, box-shadow .18s ease;
}
.ldc-category-tile:hover { transform: translateY(-4px); box-shadow: 0 22px 44px rgba(12,33,72,.17); }
.ldc-category-tile--comics { background-position: 30% center; }
.ldc-category-tile--stories { background-position: 76% center; }
.ldc-category-tile-shade { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(4,18,47,.96), rgba(4,18,47,.68) 58%, rgba(4,18,47,.22)); }
.ldc-category-tile-copy { position: relative; z-index: 1; display: flex; min-height: 290px; padding: 30px; flex-direction: column; align-items: flex-start; justify-content: flex-end; color: #fff; }
.ldc-category-tile-copy strong { margin-top: 12px; color: #fff; font-size: clamp(2rem,3vw,3.25rem); line-height: .95; letter-spacing: -.04em; }
.ldc-category-tile-copy > span:not(.story-flag) { margin-top: 10px; color: rgba(255,255,255,.75); font-weight: 800; }
.ldc-category-tile-copy em { margin-top: 24px; color: #9dccff; font-style: normal; font-weight: 1000; text-transform: uppercase; letter-spacing: .04em; font-size: .78rem; }

@media (max-width: 760px) {
  .ldc-categories-hero { min-height: 430px; background-position: 66% center; }
  .ldc-categories-hero::before { background: linear-gradient(90deg,rgba(3,15,40,.98),rgba(3,15,40,.84) 68%,rgba(3,15,40,.48)); }
  .ldc-categories-hero-inner { width: min(100% - 28px,1180px); }
  .ldc-categories-hero-copy { width: min(88%,570px); padding: 48px 0; }
  .ldc-categories-grid { grid-template-columns: 1fr; }
  .ldc-category-tile, .ldc-category-tile-copy { min-height: 240px; }
}

/* Comic release landing page and embedded reader. */
.ldc-release-page { margin-top:-1.6rem; }
.ldc-release-hero { position:relative; width:100vw; min-height:clamp(470px,48vw,690px); margin-left:calc(50% - 50vw); background:#081a3c center/cover no-repeat; overflow:hidden; }
.ldc-release-hero-shade { position:absolute; inset:0; background:linear-gradient(90deg,rgba(3,14,37,.98) 0%,rgba(3,14,37,.9) 38%,rgba(3,14,37,.52) 68%,rgba(3,14,37,.18) 100%); }
.ldc-release-hero-inner { position:relative; width:min(1180px,calc(100% - 40px)); min-height:inherit; margin:0 auto; display:flex; align-items:center; }
.ldc-release-hero-copy { width:min(620px,57%); padding:64px 0; color:#fff; }
.ldc-release-meta { display:flex; flex-wrap:wrap; align-items:center; gap:9px; color:rgba(255,255,255,.72); font-size:.78rem; font-weight:800; text-transform:uppercase; letter-spacing:.035em; }
.ldc-release-eyebrow { margin:22px 0 8px; color:#9fc0ff; font-size:.78rem; font-weight:1000; letter-spacing:.13em; text-transform:uppercase; }
.ldc-release-hero h1 { max-width:760px; margin:0; color:#fff; font-size:clamp(3rem,6vw,6.2rem); line-height:.92; letter-spacing:-.055em; }
.ldc-release-summary { max-width:580px; margin:22px 0 0; color:rgba(255,255,255,.88); font-size:clamp(1rem,1.35vw,1.2rem); line-height:1.55; }
.ldc-release-actions { display:flex; flex-wrap:wrap; gap:12px; margin-top:28px; }
.ldc-release-primary { background:#86a9ed; border-color:#86a9ed; color:#071735; }
.ldc-release-secondary { background:rgba(255,255,255,.08); border-color:rgba(255,255,255,.45); color:#fff; }
.ldc-release-layout { width:min(1180px,calc(100% - 40px)); margin:38px auto 0; display:grid; grid-template-columns:minmax(0,1fr) 290px; gap:28px; align-items:start; }
.ldc-release-main { min-width:0; }
.ldc-reader-section,.ldc-release-notes,.ldc-motion-section { margin-bottom:34px; padding:28px; border:1px solid #d8e0ec; background:#fff; box-shadow:0 14px 34px rgba(10,31,68,.08); }
.ldc-section-heading { display:flex; align-items:flex-end; justify-content:space-between; gap:20px; margin-bottom:20px; border-bottom:1px solid #dce3ed; padding-bottom:14px; }
.ldc-section-heading h2,.ldc-release-notes h2,.ldc-motion-section h2 { margin:8px 0 0; color:#152b5c; font-size:clamp(2rem,3vw,3.2rem); letter-spacing:-.04em; }
.ldc-back-to-top { color:#50688f; font-size:.8rem; font-weight:900; text-transform:uppercase; }
.ldc-comic-reader { margin:0; }
.ldc-comic-reader .comic-page,.ldc-single-comic { margin:0 0 22px; }
.ldc-comic-reader .comic-page:last-child { margin-bottom:0; }
.ldc-comic-reader img,.ldc-single-comic img { display:block; width:100%; height:auto; border:1px solid #ccd6e5; }
.ldc-release-rail { position:sticky; top:92px; display:grid; gap:16px; }
.ldc-release-card { padding:22px; border:1px solid #d6deea; border-top:5px solid #6d86b6; background:#fff; box-shadow:0 12px 28px rgba(10,31,68,.07); }
.ldc-release-card h3 { margin:12px 0 8px; color:#172c5a; font-size:1.35rem; line-height:1.08; }
.ldc-release-card p { margin:0; color:#5b6a83; line-height:1.5; }
.ldc-format-links { display:grid; gap:8px; margin-top:18px; }
.ldc-format-links a { padding:10px 12px; border:1px solid #d4deec; color:#183468; font-weight:900; text-decoration:none; }
.ldc-share-card .share-links { display:grid; gap:8px; margin-top:14px; }
.ldc-share-card .share-button { width:100%; text-align:center; }
.ldc-ad-card { border-top-color:#d5ab4b; }

@media (max-width:900px) {
  .ldc-release-layout { grid-template-columns:1fr; }
  .ldc-release-rail { position:static; grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width:760px) {
  .ldc-release-hero { min-height:520px; background-position:62% center; }
  .ldc-release-hero-shade { background:linear-gradient(90deg,rgba(3,14,37,.98),rgba(3,14,37,.86) 70%,rgba(3,14,37,.5)); }
  .ldc-release-hero-inner,.ldc-release-layout { width:min(100% - 28px,1180px); }
  .ldc-release-hero-copy { width:min(92%,620px); padding:52px 0; }
  .ldc-release-hero h1 { font-size:clamp(2.8rem,14vw,4.8rem); }
  .ldc-reader-section,.ldc-release-notes,.ldc-motion-section { padding:18px; }
  .ldc-release-rail { grid-template-columns:1fr; }
}

/* v13: keep every mobile navigation item reachable on short screens. */
@media (max-width: 760px) {
  .site-header.ldc-store-header .ldc-store-nav {
    max-height: calc(100dvh - 62px);
    overflow-y: auto;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    padding-bottom: max(18px, env(safe-area-inset-bottom));
  }

  .site-header.ldc-store-header .ldc-store-nav.is-open {
    display: grid;
  }
}

/* v14: restore direct mobile menu link text hidden by inherited generic nav rules. */
@media (max-width: 760px) {
  .site-header.ldc-store-header .ldc-store-nav > a {
    color: #111d35 !important;
    background: transparent !important;
    border-left: 0 !important;
    border-right: 0 !important;
    border-top: 0 !important;
    border-bottom: 1px solid #e3e8ef !important;
    box-shadow: none !important;
  }

  .site-header.ldc-store-header .ldc-store-nav > a:hover,
  .site-header.ldc-store-header .ldc-store-nav > a:focus {
    color: #315d9b !important;
    background: #f5f7fb !important;
  }

  .site-header.ldc-store-header .ldc-store-nav > .ldc-account-link,
  .site-header.ldc-store-header .ldc-store-nav > a:last-child {
    color: #172f59 !important;
    background: #fff !important;
    border: 1px solid #bfc9d8 !important;
  }
}

/* Zendreo Chronicles brand overrides — v2 */
:root {
  --zc-black: #07090d;
  --zc-charcoal: #11151d;
  --zc-gold: #d5b659;
  --zc-gold-pale: #f2e9a0;
  --zc-silver: #d9dee7;
}
.zc-theme { background: #eef1f5; }
.zc-header .ldc-store-bar { background: #fff; border-top-color: #151a23; }
.zc-store-brand { gap: 12px; }
.zc-store-logo { width: 48px; height: 48px; object-fit: contain; }
.zc-store-wordmark { color: #182139; font-size: 1rem; letter-spacing: .16em; text-transform: uppercase; white-space: nowrap; }
.zc-store-wordmark strong { color: #9a7b1f; }
.zc-buy-link { border: 1px solid #b49a43; padding: 10px 14px !important; }
.zc-book-hero { display: block; min-height: 560px; height: auto; background: radial-gradient(circle at 72% 46%, rgba(213,182,89,.2), transparent 28%), linear-gradient(100deg, #05070b 0%, #0b0f17 58%, #111722 100%); color: white; text-decoration: none; overflow: hidden; }
.zc-hero-inner { width: min(1180px, calc(100% - 48px)); min-height: 560px; margin: 0 auto; display: grid; grid-template-columns: 1.05fr .95fr; align-items: center; gap: 64px; }
.zc-hero-copy { position: relative; z-index: 2; padding: 70px 0; }
.zc-hero-copy h1 { margin: 18px 0 20px; color: white; font-size: clamp(3.6rem, 7vw, 6.8rem); line-height: .86; letter-spacing: -.055em; text-transform: uppercase; }
.zc-hero-copy h1 em { color: var(--zc-gold-pale); font-style: normal; }
.zc-hero-copy p { max-width: 610px; color: #cbd1dc; font-size: 1.2rem; line-height: 1.55; }
.zc-hero-actions, .zc-book-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 28px; }
.zc-hero-cover-wrap { display: flex; justify-content: center; align-items: center; min-height: 560px; position: relative; }
.zc-hero-cover-wrap:before { content: ''; position: absolute; width: 460px; height: 460px; border: 1px solid rgba(213,182,89,.28); border-radius: 50%; }
.zc-hero-cover { position: relative; width: min(330px, 72%); box-shadow: 0 26px 70px rgba(0,0,0,.58); border: 1px solid rgba(255,255,255,.2); }
.zc-section-nav { margin-top: 0; }
.zc-book-section, .zc-info-grid, .zc-universe-section, .zc-comics-preview { width: min(1080px, calc(100% - 48px)); margin: 52px auto; }
.zc-book-section { background: white; border-top: 4px solid #657dad; box-shadow: 0 14px 36px rgba(28,39,66,.09); }
.zc-book-layout { display: grid; grid-template-columns: minmax(240px, 360px) 1fr; gap: 54px; padding: 52px; align-items: start; }
.zc-book-cover-column img { display: block; width: 100%; box-shadow: 0 18px 38px rgba(0,0,0,.24); }
.zc-book-copy h2, .zc-info-card h2, .zc-universe-section h2, .zc-section-heading h2 { color: #22345f; font-size: clamp(2.3rem, 5vw, 4.6rem); line-height: .95; margin: 14px 0 24px; }
.zc-book-copy p, .zc-book-copy blockquote { color: #48566e; font-size: 1.08rem; line-height: 1.72; }
.zc-book-copy blockquote { margin: 0 0 24px; padding-left: 22px; border-left: 4px solid var(--zc-gold); font-style: italic; color: #27344d; }
.zc-info-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.zc-info-card { background: white; border-top: 4px solid #657dad; padding: 34px; box-shadow: 0 12px 28px rgba(28,39,66,.08); }
.zc-info-card h2 { font-size: 2.2rem; }
.zc-info-card p { color: #4d5a72; font-size: 1.05rem; line-height: 1.6; }
.zc-info-card small { display: block; color: #6f7a8d; line-height: 1.55; }
.zc-universe-section { display: grid; grid-template-columns: 1fr 1fr; gap: 44px; align-items: center; background: #101722; color: white; padding: 48px; }
.zc-universe-section h2 { color: white; font-size: 3rem; }
.zc-universe-section p { color: #c4cad4; line-height: 1.65; }
.zc-universe-list { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.zc-universe-list span { border: 1px solid rgba(213,182,89,.35); padding: 16px; color: var(--zc-gold-pale); text-transform: uppercase; letter-spacing: .08em; font-weight: 800; font-size: .78rem; }
.zc-section-heading { margin-bottom: 26px; }
.zc-section-heading h2 { margin-bottom: 12px; }
.zc-footer { background: #09101d; }
.zc-footer-copy { display: grid; gap: .55rem; max-width: 620px; }
.zc-footer .zc-fiction-note {
  margin: 0;
  max-width: 560px;
  padding: 0;
  color: #8e98aa;
  font-size: .78rem;
  line-height: 1.5;
}
@media (max-width: 820px) {
  .zc-store-wordmark { display: none; }
  .zc-hero-inner { grid-template-columns: 1fr; min-height: auto; gap: 0; padding-bottom: 36px; }
  .zc-hero-copy { padding: 50px 0 12px; }
  .zc-hero-copy h1 { font-size: clamp(3.25rem, 15vw, 5.5rem); }
  .zc-hero-cover-wrap { min-height: auto; padding: 18px 0 20px; }
  .zc-hero-cover-wrap:before { width: 310px; height: 310px; }
  .zc-hero-cover { width: min(270px, 74vw); }
  .zc-book-layout, .zc-info-grid, .zc-universe-section { grid-template-columns: 1fr; }
  .zc-book-layout { padding: 28px; gap: 32px; }
  .zc-book-cover-column { max-width: 300px; margin: 0 auto; }
  .zc-book-section, .zc-info-grid, .zc-universe-section, .zc-comics-preview { width: min(100% - 28px, 1080px); margin: 28px auto; }
  .zc-universe-section { padding: 30px; }
}

/* Zendreo homepage refinement v3: cover-matched hero, integrated reviews, dictionary clarity. */
.zc-book-hero {
  background:
    radial-gradient(circle at 76% 45%, rgba(249, 218, 99, .23), transparent 25%),
    radial-gradient(circle at 70% 64%, rgba(135, 190, 211, .10), transparent 31%),
    linear-gradient(105deg, #020304 0%, #07090d 55%, #11151a 100%);
}

.zc-hero-copy .story-flag,
.zc-book-copy .story-flag,
.zc-dictionary-section .story-flag,
.zc-section-heading .story-flag {
  background: #d6bd48;
  color: #090b0e;
}

.zc-hero-copy h1 {
  color: #dce9ef;
}

.zc-hero-copy h1 em {
  color: #f1e778;
}

.zc-hero-copy p {
  color: #bfd0d8;
}

.zc-hero-actions .button,
.zc-book-actions .button {
  background: #e0c94e;
  border-color: #e0c94e;
  color: #080a0d;
}

.zc-hero-actions .button:hover,
.zc-book-actions .button:hover {
  background: #f1df72;
  border-color: #f1df72;
}

.zc-hero-actions .button-secondary,
.zc-book-actions .button-secondary {
  background: transparent;
  border-color: #9fb8c4;
  color: #dce9ef;
}

.zc-book-actions .button-secondary {
  color: #263348;
  border-color: #8fa4b2;
}

.zc-book-section {
  border-top-color: #d6bd48;
}

.zc-book-copy h2,
.zc-section-heading h2 {
  color: #202b43;
}

.zc-review-strip {
  margin-top: 34px;
  padding-top: 28px;
  border-top: 1px solid #dce1e8;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 22px 30px;
}

.zc-review-quote {
  margin: 0;
}

.zc-review-quote blockquote {
  margin: 0 0 10px;
  padding: 0;
  border: 0;
  color: #29364b;
  font-size: 1rem;
  line-height: 1.6;
  font-style: italic;
}

.zc-review-quote figcaption {
  color: #6a7587;
  font-size: .82rem;
  line-height: 1.45;
}

.zc-awards-line {
  grid-column: 1 / -1;
  margin: 0 !important;
  padding-top: 18px;
  border-top: 1px solid #e5e8ee;
  color: #806a1d !important;
  font-size: .78rem !important;
  font-weight: 800;
  letter-spacing: .025em;
  text-transform: uppercase;
}

.zc-dictionary-section {
  background: #11161d;
  border-top: 4px solid #d6bd48;
}

.zc-dictionary-section h2 {
  color: #dce9ef;
}

.zc-dictionary-section p {
  color: #b9c5ce;
}

.zc-dictionary-section .button-secondary {
  border-color: #d6bd48;
  color: #f1e778;
}

.zc-dictionary-section .button-secondary:hover {
  background: #d6bd48;
  color: #090b0e;
}

.zc-universe-list span {
  border-color: rgba(214, 189, 72, .45);
  color: #e9df84;
}

@media (max-width: 760px) {
  .zc-review-strip {
    grid-template-columns: 1fr;
  }

  .zc-awards-line {
    grid-column: auto;
  }
}


/* Zendreo homepage correction v4: preserve the Latter-day Comics base controls and content rhythm. */
.zc-theme .story-flag,
.zc-theme .section-label {
  background: #6c85b6;
  color: #fff;
}

.zc-theme .button,
.zc-theme .zc-hero-actions .button,
.zc-theme .zc-book-actions .button {
  background: #6c85b6;
  border-color: #6c85b6;
  color: #fff;
}

.zc-theme .button:hover,
.zc-theme .zc-hero-actions .button:hover,
.zc-theme .zc-book-actions .button:hover {
  background: #5873a8;
  border-color: #5873a8;
  color: #fff;
}

.zc-theme .button-secondary,
.zc-theme .zc-hero-actions .button-secondary,
.zc-theme .zc-book-actions .button-secondary {
  background: #fff;
  border-color: #c6cfdd;
  color: #172f59;
}

.zc-theme .button-secondary:hover,
.zc-theme .zc-hero-actions .button-secondary:hover,
.zc-theme .zc-book-actions .button-secondary:hover {
  background: #f5f7fb;
  border-color: #9eacc0;
  color: #172f59;
}

.zc-book-section,
.zc-reviews-section,
.zc-dictionary {
  border-top-color: #657dad;
}

.zc-book-copy blockquote { border-left-color: #657dad; }

.zc-book-hero {
  background:
    radial-gradient(circle at 76% 45%, rgba(124, 151, 199, .2), transparent 26%),
    linear-gradient(105deg, #050a14 0%, #0a1326 56%, #15233d 100%);
}
.zc-hero-copy h1, .zc-hero-copy h1 em { color: #fff; }
.zc-hero-copy p { color: rgba(255,255,255,.84); }

.zc-reviews-section,
.zc-dictionary {
  width: min(1080px, calc(100% - 48px));
  margin: 52px auto;
  background: #fff;
  border-top: 4px solid #657dad;
  box-shadow: 0 14px 36px rgba(28,39,66,.09);
  padding: 42px 48px;
}

.zc-reviews-section .zc-section-heading h2,
.zc-dictionary h2 {
  margin: 12px 0 24px;
  color: #22345f;
  font-size: clamp(2rem, 4vw, 3.6rem);
  line-height: .98;
}

.zc-reviews-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap: 22px;
}
.zc-review-card {
  margin: 0;
  padding: 26px;
  border: 1px solid #d9e0eb;
  background: #f8faff;
}
.zc-review-stars {
  margin-bottom: 14px;
  color: #315d9b;
  font-size: .78rem;
  font-weight: 1000;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.zc-review-card blockquote {
  margin: 0 0 18px;
  color: #243653;
  font-size: 1.08rem;
  line-height: 1.62;
  font-style: italic;
}
.zc-review-card figcaption { color: #22345f; font-weight: 900; }
.zc-review-card figcaption span { display: block; margin-top: 3px; color: #6a7587; font-size: .8rem; font-weight: 700; }
.zc-awards-note { margin: 22px 0 0; color: #5f6e86; font-size: .82rem; font-weight: 800; text-transform: uppercase; letter-spacing: .025em; }

.zc-dictionary-header { max-width: 780px; margin-bottom: 28px; }
.zc-dictionary-header p { color: #526078; font-size: 1.04rem; line-height: 1.7; }
.zc-dictionary-list { margin: 0; }
.zc-dictionary-list > div {
  display: grid;
  grid-template-columns: minmax(190px, .36fr) 1fr;
  gap: 24px;
  padding: 20px 0;
  border-top: 1px solid #dfe5ee;
}
.zc-dictionary-list dt { color: #22345f; font-weight: 1000; }
.zc-dictionary-list dt span { display: block; color: #76839a; font-size: .78rem; font-weight: 700; }
.zc-dictionary-list dd { margin: 0; color: #526078; line-height: 1.6; }

/* Retire the previous dark promotional dictionary treatment. */
.zc-universe-section, .zc-dictionary-section { background: #fff; color: inherit; }

@media (max-width: 760px) {
  .zc-reviews-section, .zc-dictionary { width: min(100% - 28px,1080px); margin: 28px auto; padding: 26px 22px; }
  .zc-reviews-grid { grid-template-columns: 1fr; }
  .zc-dictionary-list > div { grid-template-columns: 1fr; gap: 8px; }
}

/* Zendreo v5: reviews integrated with book details and restored trailer */
.zc-book-reviews {
  margin-top: 30px;
  padding-top: 26px;
  border-top: 1px solid #d9deeb;
}
.zc-book-reviews h3 {
  margin: 10px 0 18px;
  color: #22345f;
  font-size: clamp(1.55rem, 3vw, 2.25rem);
  line-height: 1.05;
}
.zc-inline-review {
  margin: 0;
  padding: 16px 0;
  border-top: 1px solid #e2e6ef;
}
.zc-inline-review:first-of-type { border-top: 0; padding-top: 0; }
.zc-inline-review blockquote {
  margin: 6px 0 10px;
  padding: 0;
  border: 0;
  color: #34425d;
  font-size: 1rem;
  line-height: 1.55;
}
.zc-inline-review figcaption {
  color: #22345f;
  font-weight: 900;
}
.zc-inline-review figcaption span {
  display: block;
  margin-top: 2px;
  color: #6a7587;
  font-size: .8rem;
  font-weight: 700;
}
.zc-book-reviews .zc-awards-note {
  margin: 10px 0 0;
  color: #5f6d86;
  font-size: .76rem;
  font-weight: 900;
  line-height: 1.45;
  text-transform: uppercase;
  letter-spacing: .02em;
}
.zc-book-video {
  padding: 0 52px 52px;
}
.zc-video-heading {
  margin-bottom: 18px;
}
.zc-video-heading h2 {
  margin: 10px 0 0;
  color: #22345f;
  font-size: clamp(1.8rem, 4vw, 3rem);
  line-height: 1;
}
.zc-video-responsive {
  position: relative;
  overflow: hidden;
  width: 100%;
  padding-top: 56.25%;
  background: #080b13;
  box-shadow: 0 12px 30px rgba(28,39,66,.14);
}
.zc-video-responsive iframe {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
}
@media (max-width: 760px) {
  .zc-book-video { padding: 0 28px 28px; }
}


/* Zendreo v6: cover-art hero and trailer-first sales flow */
.zc-cover-art-hero {
  position: relative;
  min-height: 540px;
  background-image:
    linear-gradient(90deg, rgba(4, 8, 16, .97) 0%, rgba(4, 8, 16, .9) 34%, rgba(4, 8, 16, .45) 67%, rgba(4, 8, 16, .72) 100%),
    url('/images/zehn-mortalix-cover.jpg');
  background-size: cover;
  background-position: center 31%;
}
.zc-cover-art-hero::after {
  content: '';
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(180deg, rgba(0,0,0,.04), rgba(0,0,0,.35));
}
.zc-cover-art-hero .zc-hero-inner {
  position: relative;
  z-index: 1;
  grid-template-columns: minmax(0, 720px);
}
.zc-cover-art-hero .zc-hero-copy {
  max-width: 720px;
}
.zc-cover-art-hero .zc-hero-copy h1 {
  text-shadow: 0 3px 22px rgba(0,0,0,.68);
}
.zc-cover-art-hero .zc-hero-copy p {
  max-width: 620px;
  text-shadow: 0 2px 12px rgba(0,0,0,.8);
}
.zc-cover-art-hero .zc-hero-cover-wrap { display: none; }

.zc-trailer-section {
  width: min(1080px, calc(100% - 48px));
  margin: 52px auto;
  padding: 42px 48px 48px;
  background: #fff;
  border-top: 4px solid #657dad;
  box-shadow: 0 14px 36px rgba(28,39,66,.09);
}
.zc-trailer-section .zc-video-heading {
  max-width: 780px;
}
.zc-trailer-section .zc-video-heading p {
  margin: 12px 0 24px;
  color: #526078;
  font-size: 1.02rem;
  line-height: 1.65;
}

@media (max-width: 760px) {
  .zc-cover-art-hero {
    min-height: 500px;
    background-position: 62% center;
  }
  .zc-cover-art-hero .zc-hero-copy {
    max-width: 100%;
  }
  .zc-trailer-section {
    width: min(100% - 28px, 1080px);
    margin: 28px auto;
    padding: 26px 22px 28px;
  }
}


/* Zendreo v7: video-only trailer block and a hero crop that preserves the helmet. */
.zc-cover-art-hero {
  background-color: #050914;
  background-image:
    linear-gradient(90deg, rgba(4, 8, 16, .98) 0%, rgba(4, 8, 16, .91) 39%, rgba(4, 8, 16, .35) 69%, rgba(4, 8, 16, .58) 100%),
    url('/images/zehn-mortalix-cover.jpg');
  background-repeat: no-repeat;
  background-size: 100% 100%, auto 142%;
  background-position: center, 78% 24%;
}
.zc-trailer-section {
  padding-top: 48px;
}
@media (max-width: 1000px) {
  .zc-cover-art-hero {
    background-size: 100% 100%, auto 128%;
    background-position: center, 82% 20%;
  }
}
@media (max-width: 760px) {
  .zc-cover-art-hero {
    background-size: 100% 100%, auto 115%;
    background-position: center, 70% 18%;
  }
  .zc-trailer-section {
    padding-top: 28px;
  }
}

/* Zendreo v8: dedicated text-free cover-art hero and unboxed trailer. */
.zc-cover-art-hero {
  min-height: 540px;
  background-color: #050914;
  background-image: url('/images/zehn-mortalix-hero.jpg');
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
}
.zc-cover-art-hero::after {
  background: linear-gradient(90deg, rgba(3,7,15,.14) 0%, rgba(3,7,15,.04) 58%, rgba(3,7,15,.18) 100%);
}
.zc-trailer-section {
  width: min(1080px, calc(100% - 48px));
  margin: 44px auto 56px;
  padding: 0;
  background: transparent;
  border: 0;
  box-shadow: none;
}
.zc-trailer-section .zc-video-responsive {
  box-shadow: 0 14px 36px rgba(28,39,66,.16);
}
@media (max-width: 760px) {
  .zc-cover-art-hero {
    min-height: 500px;
    background-position: 61% center;
  }
  .zc-trailer-section {
    width: min(100% - 28px,1080px);
    margin: 28px auto 36px;
    padding: 0;
  }
}

/* Zendreo v9: temporarily remove hero artwork until a dedicated banner is available. */
.zc-cover-art-hero {
  background-color: #050914;
  background-image: linear-gradient(115deg, #030711 0%, #091121 58%, #111a2d 100%);
  background-size: cover;
  background-position: center;
}
.zc-cover-art-hero::after {
  background: radial-gradient(circle at 78% 45%, rgba(126, 143, 184, .16), transparent 38%);
}