/* ==========================================================================
   seiflden.com v3 — insights.css
   «تحت التسويق / Beneath Marketing»: hub + episode pages.
   Loaded after site.css (tokens, header, footer, buttons, cards).
   Logical properties only; RTL is driven by dir="rtl" on <html>.
   ========================================================================== */

/* ---------- Shared bits ---------- */
.ep-kicker {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 4px 0;
  margin-block-end: var(--sp-4);
  font-size: .8125rem;
  font-weight: 600;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--acc);
}
:lang(ar) .ep-kicker { letter-spacing: 0; text-transform: none; font-size: .9375rem; }
.ep-kicker a { color: inherit; text-decoration: underline; text-decoration-color: var(--acc-line); text-underline-offset: 4px; }
.ep-kicker a:hover { text-decoration-color: currentColor; }
.ep-kicker .sep { display: inline-block; width: 16px; height: 1px; margin-inline: 10px; background: currentColor; opacity: .5; }

.crumbs { margin-block-end: var(--sp-5); font-size: .8125rem; color: var(--t3); }
:lang(ar) .crumbs { font-size: .875rem; }
.crumbs ol { display: flex; flex-wrap: wrap; align-items: center; gap: 0; }
.crumbs li { display: inline-flex; align-items: center; }
.crumbs li + li::before {
  content: "/";
  margin-inline: 8px;
  color: var(--b2);
}
.crumbs a { display: inline-flex; align-items: center; min-height: 24px; color: var(--t3); }
.crumbs a:hover { color: var(--t1); }
.crumbs a[aria-current="page"] { color: var(--t2); }

.dot { display: inline-block; width: 3px; height: 3px; border-radius: 50%; background: currentColor; opacity: .6; margin-inline: 10px; vertical-align: middle; }

.i.up { transform: rotate(-90deg); }

/* ---------- Episode: hero ---------- */
.ep-hero {
  position: relative;
  padding-block: var(--sp-7) var(--sp-6);
  border-block-end: 1px solid var(--b1);
  background:
    radial-gradient(ellipse 60% 80% at 85% 0%, var(--glow), transparent 70%),
    var(--bg);
}
[dir="rtl"] .ep-hero { background: radial-gradient(ellipse 60% 80% at 15% 0%, var(--glow), transparent 70%), var(--bg); }
.ep-hero-in { max-width: calc(820px + 2 * var(--gutter)); }
.ep-title {
  font-size: clamp(2rem, 1.35rem + 2.6vw, 3.25rem);
  line-height: 1.1;
  font-weight: 700;
  letter-spacing: -0.025em;
  color: var(--t1);
  text-wrap: balance;
}
:lang(ar) .ep-title {
  font-size: clamp(1.875rem, 1.3rem + 2.3vw, 3rem);
  line-height: 1.35;
  letter-spacing: 0;
}
.ep-tldr {
  margin-block-start: var(--sp-4);
  max-width: 62ch;
  padding-inline-start: var(--sp-4);
  border-inline-start: 3px solid var(--acc);
  font-size: clamp(1rem, .95rem + .3vw, 1.125rem);
  line-height: 1.65;
  color: var(--t1);
  text-wrap: pretty;
}
:lang(ar) .ep-tldr { line-height: 1.85; }
.ep-dek {
  margin-block-start: var(--sp-4);
  max-width: 44ch;
  font-size: clamp(1.125rem, 1rem + .5vw, 1.375rem);
  line-height: 1.5;
  color: var(--t2);
  text-wrap: pretty;
}
:lang(ar) .ep-dek { line-height: 1.7; }
.ep-byline {
  display: flex;
  align-items: center;
  gap: var(--sp-3);
  margin-block-start: var(--sp-6);
}
.ep-avatar {
  width: 44px; height: 44px;
  flex: none;
  border-radius: 50%;
  object-fit: cover;
  background: var(--s2);
  border: 1px solid var(--b1);
}
.ep-author { font-size: .9375rem; font-weight: 600; color: var(--t1); line-height: 1.4; }
.ep-author a:hover { color: var(--acc); }
.ep-role { font-weight: 500; color: var(--t2); }
.ep-meta { margin-block-start: 2px; font-size: .875rem; color: var(--t3); line-height: 1.4; font-variant-numeric: tabular-nums; }

/* ---------- Episode: layout ---------- */
.ep-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--sp-7);
  padding-block: var(--sp-7) var(--sp-8);
}
.ep-toc { display: none; }
@media (min-width: 1180px) {
  .ep-layout {
    grid-template-columns: 200px minmax(0, 760px);
    justify-content: center;
    gap: 72px;
  }
  .ep-hero-in { max-width: calc(1032px + 2 * var(--gutter)); padding-inline-start: calc(var(--gutter) + 272px); }
  .ep-toc {
    display: block;
    position: sticky;
    inset-block-start: calc(var(--header-h) + 32px);
    align-self: start;
    max-height: calc(100vh - var(--header-h) - 64px);
    overflow-y: auto;
  }
}
.ep-toc-k {
  margin-block-end: var(--sp-3);
  font-size: .75rem;
  font-weight: 600;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--t3);
}
:lang(ar) .ep-toc-k { letter-spacing: 0; text-transform: none; font-size: .875rem; }
.ep-toc ol { border-inline-start: 1px solid var(--b1); }
.ep-toc a {
  display: block;
  padding-block: 6px;
  padding-inline: 14px 0;
  margin-inline-start: -1px;
  border-inline-start: 2px solid transparent;
  font-size: .8125rem;
  line-height: 1.45;
  color: var(--t3);
  transition: color var(--d1) var(--ease), border-color var(--d1) var(--ease);
}
:lang(ar) .ep-toc a { font-size: .875rem; line-height: 1.6; }
.ep-toc a:hover { color: var(--t1); }
.ep-toc a.is-current { color: var(--t1); border-inline-start-color: var(--acc); }

/* ---------- Prose ---------- */
.prose {
  --measure: 68ch;
  min-width: 0;
  font-size: 1.125rem;
  line-height: 1.72;
  color: var(--t1);
}
:lang(ar) .prose {
  --measure: 62ch;
  font-size: 1.1875rem;
  line-height: 1.85;
}
.prose > *, .ep-sec > * { max-width: var(--measure); }
.prose p { margin-block-start: 1.1em; text-wrap: pretty; }
.prose strong { font-weight: 650; }
:lang(ar) .prose strong { font-weight: 700; }
.prose em { font-style: italic; }
:lang(ar) .prose em { font-style: normal; color: var(--t2); }
.prose a:not(.btn):not(.share-btn):not(.link-cta):not(.sn-card) {
  color: var(--acc);
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
  text-decoration-color: var(--acc-line);
}
.prose a:not(.btn):not(.share-btn):not(.link-cta):not(.sn-card):hover { text-decoration-color: currentColor; }
.prose ul, .prose ol { margin-block-start: 1em; }
.prose ul > li, .prose ol > li { position: relative; padding-inline-start: 1.6em; margin-block-start: .55em; }
.prose ul > li::before {
  content: "";
  position: absolute;
  inset-inline-start: .35em;
  inset-block-start: .78em;
  width: 7px; height: 7px;
  border-radius: 2px;
  background: var(--acc);
  transform: rotate(45deg);
}
.prose ol { counter-reset: li; }
.prose ol > li { counter-increment: li; }
.prose ol > li::before {
  content: counter(li);
  position: absolute;
  inset-inline-start: 0;
  inset-block-start: .1em;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  color: var(--acc);
}
.prose blockquote {
  margin: 1.4em 0 0;
  padding-inline-start: var(--sp-5);
  border-inline-start: 3px solid var(--acc);
  font-size: 1.125em;
  color: var(--t1);
}

.ep-sec { scroll-margin-top: calc(var(--header-h) + 24px); }
.ep-sec + .ep-sec, .ep-abstract + .ep-sec { margin-block-start: var(--sp-8); }
.ep-sec h2 {
  display: flex;
  align-items: baseline;
  gap: 14px;
  font-size: clamp(1.5rem, 1.25rem + .9vw, 1.875rem);
  line-height: 1.2;
  font-weight: 700;
  letter-spacing: -0.015em;
  text-wrap: balance;
}
:lang(ar) .ep-sec h2 { font-size: clamp(1.375rem, 1.2rem + .8vw, 1.75rem); line-height: 1.45; letter-spacing: 0; }
.h-num {
  flex: none;
  display: inline-grid;
  place-items: center;
  min-width: 34px; height: 34px;
  padding-inline: 6px;
  border-radius: 10px;
  border: 1px solid var(--acc-line);
  background: var(--acc-soft);
  color: var(--acc);
  font-size: .9375rem;
  font-weight: 700;
  line-height: 1;
  font-variant-numeric: tabular-nums;
  transform: translateY(-3px);
}
:lang(ar) .h-num { transform: translateY(-1px); font-family: var(--font); }
.prose h3, .prose h4 {
  margin-block-start: var(--sp-6);
  font-size: 1.1875rem;
  line-height: 1.35;
  font-weight: 650;
  scroll-margin-top: calc(var(--header-h) + 24px);
}
:lang(ar) .prose h3, :lang(ar) .prose h4 { font-size: 1.1875rem; line-height: 1.6; font-weight: 700; }
.prose .ep-sec h2 + p { margin-block-start: var(--sp-4); }

/* question-led paragraphs: «**"Is there demand?"** …» */
.lead-q { position: relative; }
.lead-q > strong:first-child {
  display: block;
  margin-block-end: .2em;
  font-size: 1.0625em;
  color: var(--t1);
}

/* abstract */
.ep-abstract {
  padding: var(--sp-5) var(--sp-5) var(--sp-5);
  border-radius: var(--r-lg);
  background: var(--s1);
  border: 1px solid var(--b1);
  border-inline-start: 3px solid var(--acc);
}
.ep-abstract h2 {
  font-size: .8125rem;
  font-weight: 600;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--acc);
}
:lang(ar) .ep-abstract h2 { letter-spacing: 0; text-transform: none; font-size: .9375rem; }
.ep-abstract p { margin-block-start: var(--sp-2); font-size: 1.0625em; line-height: 1.7; color: var(--t1); }
:lang(ar) .ep-abstract p { line-height: 1.85; }
@media (min-width: 720px) { .ep-abstract { padding: var(--sp-6); } }

/* composite example */
.composite {
  position: relative;
  margin-block-start: var(--sp-5);
  padding: var(--sp-5);
  border-radius: var(--r-md);
  border: 1px dashed var(--b2);
  background: var(--s1);
  background-image: repeating-linear-gradient(135deg, transparent 0 10px, var(--grid-line) 10px 11px);
}
.composite p { margin-block-start: var(--sp-2); }
.composite .composite-k {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin: 0;
  padding: 2px 10px;
  border-radius: 999px;
  background: var(--amber-soft);
  color: var(--t1);
  font-size: .8125rem;
  font-weight: 600;
  line-height: 1.6;
}
:lang(ar) .composite .composite-k { font-size: .875rem; }
.composite .composite-k::before {
  content: "";
  width: 7px; height: 7px;
  border-radius: 50%;
  background: var(--amber);
}

/* credit line */
.credit {
  margin-block-start: var(--sp-5) !important;
  padding: var(--sp-4) var(--sp-5);
  border-radius: var(--r-md);
  background: var(--acc-soft);
  border: 1px solid var(--acc-line);
  font-size: .9375em;
  color: var(--t1);
}

/* footnote references */
.fn-ref { font-size: .7em; line-height: 0; vertical-align: super; margin-inline: 1px 0; }
.prose .fn-ref a {
  display: inline-block;
  min-width: 1.35em;
  padding: 0 .15em;
  line-height: 1.35;
  border-radius: 4px;
  font-family: var(--font);
  font-weight: 600;
  text-align: center;
  text-decoration: none;
  font-variant-numeric: tabular-nums;
  color: var(--acc);
  background: var(--acc-soft);
}
.prose .fn-ref a:hover { background: var(--acc-line); }
:target { scroll-margin-top: calc(var(--header-h) + 24px); }
.ep-notes li:target, .fn-ref a:target { animation: ins-flash 1.6s var(--ease) 1; }
@keyframes ins-flash { 0%, 40% { background: var(--acc-line); } 100% { background: transparent; } }
.prose .fn-ref a:target { animation-name: ins-flash-ref; }
@keyframes ins-flash-ref { 0%, 40% { background: var(--acc-line); } 100% { background: var(--acc-soft); } }

/* tables */
.tbl-wrap { margin-block-start: var(--sp-5); max-width: none !important; }
.ep-table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  font-size: .9375rem;
  line-height: 1.55;
  border: 1px solid var(--b1);
  border-radius: var(--r-lg);
  overflow: hidden;
  background: var(--s1);
}
:lang(ar) .ep-table { font-size: 1rem; line-height: 1.75; }
.ep-table th, .ep-table td { padding: 14px 16px; text-align: start; vertical-align: top; }
.ep-table thead th {
  background: var(--s2);
  font-size: .75rem;
  font-weight: 600;
  letter-spacing: .05em;
  text-transform: uppercase;
  color: var(--t2);
  border-block-end: 1px solid var(--b1);
}
:lang(ar) .ep-table thead th { font-size: .875rem; letter-spacing: 0; text-transform: none; }
.ep-table tbody tr + tr > * { border-block-start: 1px solid var(--b1); }
.ep-table tbody th { font-weight: 650; color: var(--acc); white-space: nowrap; }
:lang(ar) .ep-table tbody th { font-weight: 700; }
.ep-table td { color: var(--t1); }
.ep-table td:last-child { color: var(--t1); }
.ep-table.kv tbody th { width: 9.5em; white-space: normal; color: var(--t2); font-weight: 600; }
.ep-table.kv tbody tr:first-child td { font-size: 1.0625em; font-weight: 600; }
@media (max-width: 719px) {
  .ep-table, .ep-table tbody, .ep-table tr, .ep-table th, .ep-table td { display: block; width: auto; }
  .ep-table thead { display: none; }
  .ep-table { border: 0; background: transparent; border-radius: 0; overflow: visible; }
  .ep-table tbody { display: grid; gap: var(--sp-3); }
  .ep-table tbody tr { border: 1px solid var(--b1); border-radius: var(--r-md); background: var(--s1); padding: var(--sp-4); }
  .ep-table tbody tr + tr > * { border: 0; }
  .ep-table th, .ep-table td { padding: 0; }
  .ep-table tbody th { font-size: 1rem; white-space: normal; }
  .ep-table td { margin-block-start: var(--sp-3); }
  .ep-table td[data-label]::before {
    content: attr(data-label);
    display: block;
    font-size: .75rem;
    font-weight: 600;
    letter-spacing: .05em;
    text-transform: uppercase;
    color: var(--t3);
  }
  :lang(ar) .ep-table td[data-label]::before { font-size: .8125rem; letter-spacing: 0; text-transform: none; }
  .ep-table.kv tbody { gap: 0; border: 1px solid var(--b1); border-radius: var(--r-md); background: var(--s1); }
  .ep-table.kv tbody tr { border: 0; border-radius: 0; background: transparent; }
  .ep-table.kv tbody tr + tr { border-block-start: 1px solid var(--b1); }
  .ep-table.kv tbody th { width: auto; font-size: .8125rem; }
  .ep-table.kv td { margin-block-start: 4px; }
}

/* "this week" */
.this-week, .is-this-week {
  --tw-pad: var(--sp-5);
}
.this-week {
  margin-block-start: var(--sp-6);
  padding: var(--tw-pad);
  border-radius: var(--r-lg);
  border: 1px solid var(--b1);
  background: var(--s1);
}
.this-week h3, .this-week h4 { margin-block-start: 0; }
.this-week ol, .is-this-week ol { counter-reset: tw; margin-block-start: var(--sp-4); }
.this-week ol > li, .is-this-week ol > li {
  counter-increment: tw;
  position: relative;
  min-height: 32px;
  padding-inline-start: 48px;
  margin-block-start: var(--sp-4);
}
.this-week ol > li::before, .is-this-week ol > li::before {
  content: counter(tw);
  position: absolute;
  inset-inline-start: 0;
  inset-block-start: .1em;
  display: grid;
  place-items: center;
  width: 32px; height: 32px;
  border-radius: 50%;
  background: var(--acc-fill);
  color: var(--on-acc);
  font-family: var(--font);
  font-size: .875rem;
  font-weight: 700;
}
.is-this-week ol {
  padding: var(--sp-2) var(--tw-pad) var(--tw-pad);
  border-radius: var(--r-lg);
  border: 1px solid var(--b1);
  background: var(--s1);
}
@media (min-width: 720px) { .this-week, .is-this-week { --tw-pad: var(--sp-6); } }

/* ---------- CTA card ---------- */
.ins-cta {
  position: relative;
  margin-block-start: var(--sp-8);
  padding: var(--sp-6) var(--sp-5);
  border-radius: var(--r-lg);
  border: 1px solid var(--acc-line);
  background:
    radial-gradient(ellipse 70% 120% at 100% 0%, var(--glow), transparent 70%),
    var(--s1);
  overflow: hidden;
}
[dir="rtl"] .ins-cta { background: radial-gradient(ellipse 70% 120% at 0% 0%, var(--glow), transparent 70%), var(--s1); }
.prose > .ins-cta { max-width: none; }
.ins-cta-k {
  margin: 0 !important;
  font-size: .75rem;
  font-weight: 600;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--acc);
}
:lang(ar) .ins-cta-k { letter-spacing: 0; text-transform: none; font-size: .875rem; }
.cta-title { margin-block-start: var(--sp-2); font-size: clamp(1.5rem, 1.2rem + 1.1vw, 2rem); line-height: 1.2; }
:lang(ar) .cta-title { line-height: 1.45; }
.ins-cta-text { margin-block-start: var(--sp-3) !important; font-size: 1.125rem; line-height: 1.6; color: var(--t1); max-width: 56ch; }
:lang(ar) .ins-cta-text { font-size: 1.1875rem; line-height: 1.8; }
.ins-cta-actions { display: flex; flex-wrap: wrap; align-items: center; gap: var(--sp-3) var(--sp-5); margin-block-start: var(--sp-5) !important; }
.ins-cta-note { font-size: .875rem; color: var(--t3); }
@media (max-width: 559px) {
  .ins-cta-actions .btn { width: 100%; white-space: normal; padding-block: 10px; }
}
@media (min-width: 720px) { .ins-cta { padding: var(--sp-7); } }

/* ---------- Share ---------- */
/* ---------- Endnotes ---------- */
.ep-notes { margin-block-start: var(--sp-7); padding-block-start: var(--sp-6); border-block-start: 1px solid var(--b1); }
.ep-notes h2 { font-size: 1.25rem; line-height: 1.3; }
:lang(ar) .ep-notes h2 { font-size: 1.1875rem; line-height: 1.6; }
.ep-notes ol { counter-reset: none; margin-block-start: var(--sp-4); }
.prose .ep-notes ol > li {
  position: relative;
  padding-inline-start: 2.6em;
  margin-block-start: 0;
  padding-block: 10px;
  border-block-end: 1px solid var(--b1);
  font-size: .875rem;
  line-height: 1.6;
  color: var(--t2);
  border-radius: 6px;
  scroll-margin-top: calc(var(--header-h) + 24px);
}
:lang(ar) .prose .ep-notes ol > li { font-size: .9375rem; line-height: 1.8; }
.prose .ep-notes ol > li::before {
  content: attr(data-n);
  position: absolute;
  inset-inline-start: 0;
  inset-block-start: 10px;
  min-width: 1.9em;
  padding: 0 4px;
  border-radius: 4px;
  font-family: var(--font);
  font-size: .8125rem;
  line-height: 1.7;
  text-align: center;
  color: var(--acc);
  background: var(--acc-soft);
}
.ep-notes p { margin: 0; overflow-wrap: anywhere; }
.ep-notes em { color: var(--t1); }
.ep-notes a.url { display: inline-block; max-width: 100%; direction: ltr; unicode-bidi: isolate; font-size: .9em; vertical-align: top; }
.ep-notes p[dir="ltr"] { text-align: end; }
.ep-notes p[dir="ltr"] .fn-back { margin-inline: 4px 0; }
.fn-back {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 1px;
  min-width: 28px; min-height: 28px;
  margin-inline-start: 4px;
  vertical-align: middle;
  border-radius: 6px;
  color: var(--acc);
  text-decoration: none !important;
}
.fn-back:hover { background: var(--acc-soft); }
.fn-back .i { width: 16px; height: 16px; }
.fn-back sup { font-size: .7em; }

/* ---------- Author box ---------- */
.ep-authorbox {
  display: flex;
  align-items: flex-start;
  gap: var(--sp-4);
  margin-block-start: var(--sp-7);
  padding: var(--sp-5);
  border-radius: var(--r-lg);
  border: 1px solid var(--b1);
  background: var(--s1);
}
.prose > .ep-authorbox { max-width: none; }
.ep-authorbox img { width: 64px; height: 64px; flex: none; border-radius: 50%; object-fit: cover; background: var(--s2); }
.ab-k { font-size: .75rem; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--t3); }
:lang(ar) .ab-k { letter-spacing: 0; text-transform: none; font-size: .875rem; }
.ab-name { margin: 2px 0 0 !important; font-size: 1.125rem; font-weight: 700; }
.ab-name a:hover { color: var(--acc); }
.ab-bio { margin-block-start: 6px !important; font-size: .9375rem; line-height: 1.6; color: var(--t2); }
:lang(ar) .ab-bio { font-size: 1rem; line-height: 1.8; }
.ep-authorbox .link-cta { margin-block-start: var(--sp-2); }

/* ---------- Series navigation ---------- */
.ep-foot { padding-block-end: var(--sp-8); }
.series-nav {
  display: grid;
  gap: var(--sp-3);
  max-width: 1032px;
  margin-inline: auto;
  padding-block-start: var(--sp-6);
  border-block-start: 1px solid var(--b1);
}
@media (min-width: 720px) { .series-nav { grid-template-columns: repeat(auto-fit, minmax(0, 1fr)); gap: var(--sp-4); } }
.sn-card {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-height: 44px;
  padding: var(--sp-5);
  border-radius: var(--r-lg);
  border: 1px solid var(--b1);
  background: var(--s1);
  transition: border-color var(--d2) var(--ease);
}
.sn-card:hover { border-color: var(--acc-line); }
.sn-k { display: inline-flex; align-items: center; gap: 6px; font-size: .8125rem; font-weight: 600; color: var(--acc); }
:lang(ar) .sn-k { font-size: .875rem; }
.sn-k .i { width: 16px; height: 16px; }
.sn-n { font-size: .8125rem; color: var(--t3); }
:lang(ar) .sn-n { font-size: .875rem; }
.sn-t { font-size: 1.0625rem; font-weight: 650; line-height: 1.4; color: var(--t1); }
:lang(ar) .sn-t { font-weight: 700; line-height: 1.6; }
.sn-next { text-align: end; }
.sn-next .sn-k { align-self: flex-end; }
.sn-all { background: transparent; border-style: dashed; }

/* ---------- Roundabout (Episode 0) ---------- */
.rb {
  margin-block-start: var(--sp-6);
  padding: var(--sp-4) var(--sp-3) var(--sp-5);
  border-radius: var(--r-lg);
  border: 1px solid var(--b1);
  background: var(--s1);
  max-width: none !important;
}
@media (min-width: 720px) { .rb { padding: var(--sp-5) var(--sp-6) var(--sp-6); } }
.rb-stage { position: relative; }
.rb-toggle {
  display: flex;
  width: max-content;
  max-width: 100%;
  margin-inline: auto;
  margin-block-end: var(--sp-3);
  padding: 3px;
  border-radius: 999px;
  border: 1px solid var(--b1);
  background: var(--bg);
}
.rb-toggle[hidden] { display: none; }
.rb-tbtn {
  min-height: 38px;
  padding: 0 16px;
  border: 0;
  border-radius: 999px;
  background: transparent;
  color: var(--t2);
  font-size: .875rem;
  font-weight: 600;
  transition: background-color var(--d2) var(--ease), color var(--d2) var(--ease);
}
:lang(ar) .rb-tbtn { font-size: .9375rem; }
.rb-tbtn:hover { color: var(--t1); }
.rb-tbtn[aria-pressed="true"] { background: var(--acc-fill); color: var(--on-acc); }
.rb-svg {
  display: block;
  width: 100%;
  max-width: 520px;
  height: auto;
  margin-inline: auto;
  overflow: visible;
  transition: opacity 150ms linear;
  -webkit-tap-highlight-color: transparent;
}
.rb-svg.is-fading { opacity: 0; }
.rb-svg text { font-family: inherit; font-size: 17px; font-weight: 600; fill: var(--t1); }
:lang(ar) .rb-svg text { font-weight: 700; }
.rb-road { fill: none; stroke: var(--dot-off); stroke-width: 24; stroke-linejoin: round; }
.rb-lane { fill: none; stroke: var(--s1); stroke-width: 1.5; stroke-dasharray: 5 9; }
.rb-outline { fill: var(--acc-soft); stroke: var(--t3); stroke-width: 2; stroke-linejoin: round; }
.rb-arc { fill: none; stroke: var(--acc); stroke-width: 7; stroke-linecap: round; opacity: 0; transition: opacity var(--d2) var(--ease); }
.rb-arc.is-on { opacity: 1; }
.rb-chev { fill: none; stroke: var(--t2); stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.rb-entry { fill: none; stroke: var(--t3); stroke-width: 2.5; stroke-dasharray: 4 5; stroke-linecap: round; }
.rb-entry-head, .rb-feed-head { fill: var(--t3); }
.rb-exit { fill: none; stroke: var(--acc); stroke-width: 3.5; stroke-linecap: round; }
.rb-exit-head { fill: var(--acc); }
.rb-svg .rb-exit-label { fill: var(--acc); font-size: 16px; }
.rb-loop { fill: none; stroke: var(--amber); stroke-width: 2.5; stroke-dasharray: 5 5; stroke-linecap: round; }
.rb-loop-head { fill: var(--amber); }
.rb-svg .rb-loop-label { font-size: 14.5px; fill: var(--t1); }
.rb-feed { fill: none; stroke: var(--t3); stroke-width: 1.5; stroke-dasharray: 2 4; stroke-linecap: round; }
.rb-lost-line { fill: none; stroke: var(--bad); stroke-width: 2; stroke-dasharray: 3 4; }
.rb-x { fill: none; stroke: var(--bad); stroke-width: 3; stroke-linecap: round; }
.rb-svg .rb-lost { fill: var(--bad); font-size: 15px; }
.rb-st rect { fill: var(--bg); stroke: var(--b2); stroke-width: 1.5; transition: fill var(--d2) var(--ease), stroke var(--d2) var(--ease); }
.rb-island circle { fill: var(--acc-soft); stroke: var(--acc-line); stroke-width: 1.5; transition: fill var(--d2) var(--ease), stroke var(--d2) var(--ease); }
.rb-svg .rb-island text { font-size: 15px; }
.rb-bubble { fill: none; stroke: var(--acc); stroke-width: 1.75; stroke-linejoin: round; }
.rb-st { transition: opacity var(--d2) var(--ease); outline: none; }
.rb-funnel-only, .rb-ring-only { transition: opacity var(--d2) var(--ease); }
.rb-st.is-on rect, .rb-island.is-on circle { fill: var(--acc-fill); stroke: var(--acc-fill); }
.rb-svg .rb-st.is-on text { fill: var(--on-acc); }
.rb-island.is-on .rb-bubble { stroke: var(--on-acc); }
/* dimmed stations keep AA text contrast: fade the chip, not the label */
.has-sel .rb-st:not(.is-on) rect { fill: var(--s1); stroke: var(--b1); }
.has-sel .rb-island:not(.is-on) circle { fill: transparent; stroke: var(--b1); }
.rb-svg.has-sel .rb-st:not(.is-on) text { fill: var(--t3); font-weight: 500; }
.has-sel .rb-island:not(.is-on) .rb-bubble { stroke: var(--t3); }
.rb-island text { transition: opacity var(--d2) var(--ease); }
.rb-f-mode .rb-island text { opacity: 0; }
.rb-f-mode .rb-island:not(.is-on) circle { stroke-dasharray: 4 4; }
.has-sel .rb-chev, .has-sel .rb-entry, .has-sel .rb-entry-head, .has-sel .rb-loop, .has-sel .rb-loop-head, .has-sel .rb-loop-label,
.has-sel .rb-feed, .has-sel .rb-feed-head, .has-sel .rb-exit, .has-sel .rb-exit-head, .has-sel .rb-exit-label { opacity: .3; transition: opacity var(--d2) var(--ease); }
.has-sel[data-sel="revenue"] .rb-exit, .has-sel[data-sel="revenue"] .rb-exit-head, .has-sel[data-sel="revenue"] .rb-exit-label,
.has-sel[data-sel="decision"] .rb-loop, .has-sel[data-sel="decision"] .rb-loop-head, .has-sel[data-sel="decision"] .rb-loop-label,
.has-sel[data-sel="memory"] .rb-loop, .has-sel[data-sel="memory"] .rb-loop-head, .has-sel[data-sel="memory"] .rb-loop-label,
.has-sel[data-sel="market"] .rb-feed, .has-sel[data-sel="market"] .rb-feed-head { opacity: 1; }
.js .rb-st { cursor: pointer; }
.js .rb-st:hover rect, .js .rb-island:hover circle { stroke: var(--acc); }
.rb-st:focus-visible rect, .rb-island:focus-visible circle { stroke: var(--acc); stroke-width: 3.5; }
.rb-st:focus-visible { opacity: 1 !important; }
@media (prefers-reduced-motion: no-preference) {
  .rb-lane { animation: rb-flow 16s linear infinite; }
  @keyframes rb-flow { to { stroke-dashoffset: -140; } }
}
@media (max-width: 559px) {
  .rb-svg text { font-size: 18px; }
  .rb-svg .rb-island text { font-size: 15.5px; }
}
.rb-legend {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 6px 18px;
  margin-block-start: var(--sp-4) !important;
  font-size: .8125rem;
  line-height: 1.5;
  color: var(--t2);
}
:lang(ar) .rb-legend { font-size: .875rem; }
.prose .rb-legend > li { display: inline-flex; align-items: center; gap: 8px; margin: 0; padding: 0; }
.prose .rb-legend > li::before { content: none; }
.rb-sw { display: inline-block; width: 22px; height: 0; flex: none; border-block-start: 2.5px dashed var(--t3); }
.rb-sw-exit { border-block-start: 3.5px solid var(--acc); border-radius: 2px; }
.rb-sw-loop { border-block-start-color: var(--amber); }
.rb-sw-island { width: 14px; height: 14px; border: 1.5px solid var(--acc-line); border-radius: 50%; background: var(--acc-soft); }
.rb-cap { margin-block-start: var(--sp-3); text-align: center; font-size: .8125rem; color: var(--t3); }
:lang(ar) .rb-cap { font-size: .875rem; }
.rb-panel { margin-block-start: var(--sp-5); }
.rb-hint {
  margin: 0 !important;
  padding: var(--sp-4);
  border-radius: var(--r-md);
  border: 1px dashed var(--b2);
  font-size: .9375rem;
  color: var(--t2);
  text-align: center;
}
.rb-hint[hidden] { display: none; }
.rb-cards { display: grid; gap: var(--sp-3); margin: 0 !important; counter-reset: none; }
@media (min-width: 720px) { .rb-cards:not(.is-single) { grid-template-columns: 1fr 1fr; } }
.prose .rb-cards > li { margin: 0; padding: var(--sp-4) var(--sp-5); }
.prose .rb-cards > li::before { content: none; }
.rb-card {
  border-radius: var(--r-md);
  border: 1px solid var(--b1);
  background: var(--bg);
}
.rb-cards.is-single .rb-card:not(.is-on) { display: none; }
.rb-cards.is-single .rb-card.is-on { border-color: var(--acc-line); animation: rb-in var(--d3) var(--ease); }
@keyframes rb-in { from { opacity: 0; transform: translateY(6px); } }
@media (prefers-reduced-motion: reduce) { .rb-cards.is-single .rb-card.is-on { animation: none; } }
.rb-card-k { margin: 0 !important; font-size: .75rem; font-weight: 600; letter-spacing: .05em; text-transform: uppercase; color: var(--acc); }
:lang(ar) .rb-card-k { letter-spacing: 0; text-transform: none; font-size: .875rem; }
.prose .rb-card-q { margin-block-start: 4px; font-size: 1.125rem; line-height: 1.4; }
:lang(ar) .prose .rb-card-q { font-size: 1.1875rem; line-height: 1.6; }
.rb-card dl { display: grid; gap: var(--sp-3); margin-block-start: var(--sp-3); }
.rb-card dt { font-size: .75rem; font-weight: 600; letter-spacing: .05em; text-transform: uppercase; color: var(--t3); }
:lang(ar) .rb-card dt { letter-spacing: 0; text-transform: none; font-size: .8125rem; }
.rb-card dd { margin: 2px 0 0; font-size: .9375rem; line-height: 1.6; color: var(--t1); }
:lang(ar) .rb-card dd { font-size: 1rem; line-height: 1.8; }
@media (min-width: 560px) { .rb-cards.is-single .rb-card dl { grid-template-columns: 1fr 1fr; gap: var(--sp-5); } }
.rb-all { margin-block-start: var(--sp-3); }
.rb-all[hidden] { display: none; }

/* ---------- Hub ---------- */
.hub-hero {
  position: relative;
  overflow: hidden;
  padding-block: var(--sp-7) var(--sp-8);
  border-block-end: 1px solid var(--b1);
}
.hub-grid-bg {
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(var(--grid-line) 1px, transparent 1px),
    linear-gradient(90deg, var(--grid-line) 1px, transparent 1px);
  background-size: 48px 48px;
  -webkit-mask-image: radial-gradient(ellipse 70% 90% at 70% 0%, #000 20%, transparent 75%);
  mask-image: radial-gradient(ellipse 70% 90% at 70% 0%, #000 20%, transparent 75%);
  pointer-events: none;
}
.hub-hero .container { position: relative; }
.hub-art { display: none; }
@media (min-width: 960px) {
  .hub-art {
    display: block;
    position: absolute;
    inset-inline-end: var(--gutter);
    inset-block-start: 50%;
    width: 300px;
    transform: translateY(-46%);
    opacity: .95;
  }
  .hub-art .mini-rb { width: 100%; height: auto; }
  .hub-hero .hub-dek { max-width: 52ch; }
}
@media (prefers-reduced-motion: no-preference) {
  .hub-art .m-lane { animation: rb-flow-mini 14s linear infinite; }
}
.hub-title {
  font-size: var(--fs-h1);
  line-height: var(--lh-h);
  font-weight: 700;
  letter-spacing: -0.03em;
}
:lang(ar) .hub-title { font-size: clamp(2.125rem, 1.5rem + 2.4vw, 3.5rem); line-height: 1.3; letter-spacing: 0; }
.hub-dek { margin-block-start: var(--sp-4); max-width: 58ch; font-size: clamp(1.125rem, 1rem + .45vw, 1.3125rem); line-height: 1.6; color: var(--t2); text-wrap: pretty; }
:lang(ar) .hub-dek { line-height: 1.85; }
.ep-byline-s { margin-block-start: var(--sp-5); font-size: .9375rem; color: var(--t3); }
.ep-byline-s a { font-weight: 600; color: var(--t1); }
.ep-byline-s a:hover { color: var(--acc); }

.hub-pillars { padding-block: var(--sp-7) 0; }
.pillars { display: grid; gap: var(--sp-3); }
@media (min-width: 800px) { .pillars { grid-template-columns: repeat(3, 1fr); gap: var(--sp-5); } }
.pillars li {
  position: relative;
  padding: var(--sp-5);
  border-radius: var(--r-lg);
  border: 1px solid var(--b1);
  background: var(--s1);
}
.pl-n {
  display: inline-grid;
  place-items: center;
  width: 32px; height: 32px;
  margin-block-end: var(--sp-3);
  border-radius: 10px;
  border: 1px solid var(--acc-line);
  background: var(--acc-soft);
  color: var(--acc);
  font-family: var(--font);
  font-weight: 700;
  font-size: .875rem;
}
.pillars h3 { font-size: 1.125rem; line-height: 1.35; }
:lang(ar) .pillars h3 { line-height: 1.6; }
.pillars p { margin-block-start: 6px; color: var(--t2); font-size: .9375rem; line-height: 1.6; }
:lang(ar) .pillars p { font-size: 1rem; line-height: 1.8; }
.hub-credit { margin-block-start: var(--sp-4); font-size: .875rem; color: var(--t3); max-width: 80ch; }

.hub-eps { padding-block: var(--sp-8) var(--sp-6); }
.hub-eps-head { display: flex; align-items: baseline; justify-content: space-between; gap: var(--sp-4); margin-block-end: var(--sp-5); }
.hub-eps-head h2 { font-size: var(--fs-h2); line-height: 1.15; letter-spacing: -0.02em; }
:lang(ar) .hub-eps-head h2 { line-height: 1.4; letter-spacing: 0; }
.hub-count { font-size: .9375rem; color: var(--t3); font-variant-numeric: tabular-nums; }
.hub-list { display: grid; gap: var(--sp-4); }
@media (min-width: 800px) { .hub-list { grid-template-columns: 1fr 1fr; gap: var(--sp-5); } }
.hub-card {
  position: relative;
  display: grid;
  grid-template-columns: 72px minmax(0, 1fr);
  gap: var(--sp-4);
  padding: var(--sp-5);
}
.hub-card:has(.stretched:focus-visible) { outline: 2px solid var(--acc); outline-offset: 2px; }
.hc-art { display: grid; place-items: center; width: 72px; height: 72px; border-radius: var(--r-md); background: var(--s2); border: 1px solid var(--b1); overflow: hidden; }
.hc-num span { font-family: var(--font); font-size: 1.75rem; font-weight: 700; letter-spacing: -0.03em; color: var(--acc); font-variant-numeric: tabular-nums; }
.hc-body { min-width: 0; display: flex; flex-direction: column; }
.hc-k { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; font-size: .8125rem; font-weight: 600; color: var(--acc); }
:lang(ar) .hc-k { font-size: .875rem; }
.hc-badge { padding: 1px 8px; border-radius: 999px; background: var(--acc-fill); color: var(--on-acc); font-size: .75rem; }
.hc-title { margin-block-start: 6px; font-size: 1.25rem; line-height: 1.3; font-weight: 700; letter-spacing: -0.01em; text-wrap: balance; }
:lang(ar) .hc-title { font-size: 1.25rem; line-height: 1.6; letter-spacing: 0; }
.hc-title a:hover { color: var(--acc); }
.hc-sub { margin-block-start: 6px; font-size: .9375rem; line-height: 1.55; color: var(--t2); }
:lang(ar) .hc-sub { font-size: 1rem; line-height: 1.75; }
.hc-meta { margin-block-start: var(--sp-3); font-size: .8125rem; color: var(--t3); font-variant-numeric: tabular-nums; }
:lang(ar) .hc-meta { font-size: .875rem; }
.hc-cta { display: inline-flex; align-items: center; gap: 6px; margin-block-start: auto; padding-block-start: var(--sp-3); font-size: .9375rem; font-weight: 600; color: var(--acc); }
.hc-cta .i { width: 18px; height: 18px; }
.hub-card:hover .nudge { translate: calc(3px * var(--dir)) 0; }
.hub-card.is-featured { grid-template-columns: minmax(0, 1fr); }
.hub-card.is-featured .hc-art { width: 100%; height: auto; aspect-ratio: 16 / 9; }
.hub-card.is-featured .hc-art .mini-rb { width: 56%; max-width: 230px; height: auto; }
.hub-card.is-featured .hc-art { background: radial-gradient(circle at 50% 50%, var(--glow), transparent 70%), var(--s2); }
.hub-card.is-featured .hc-num span { font-size: 4rem; }
.hub-card.is-featured .hc-title { font-size: clamp(1.375rem, 1.1rem + 1vw, 1.875rem); }
@media (min-width: 800px) {
  .hub-card.is-featured { grid-column: 1 / -1; grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: var(--sp-6); padding: var(--sp-6); align-items: center; }
  .hub-card.is-featured .hc-art { aspect-ratio: 4 / 3; }
}
.mini-rb { width: 64px; height: 64px; }
.mini-rb .m-road { fill: none; stroke: var(--dot-off); stroke-width: 16; }
.mini-rb .m-lane { fill: none; stroke: var(--s2); stroke-width: 1.5; stroke-dasharray: 5 8; }
.mini-rb .m-island { fill: var(--acc-soft); stroke: var(--acc-line); stroke-width: 1.5; }
.mini-rb .m-st { fill: var(--bg); stroke: var(--b2); stroke-width: 1.5; }
.mini-rb .m-st.on { fill: var(--acc-fill); stroke: var(--acc-fill); }
.mini-rb .m-exit { fill: none; stroke: var(--acc); stroke-width: 3.5; stroke-linecap: round; }
@media (prefers-reduced-motion: no-preference) {
  .hub-card.is-featured .m-lane { animation: rb-flow-mini 14s linear infinite; }
  @keyframes rb-flow-mini { to { stroke-dashoffset: -130; } }
}
.hub-cta { padding-block: var(--sp-4) var(--sp-8); }
.hub-cta .ins-cta { margin-block-start: 0; }

/* ---------- Season 2 formats ---------- */
/* illustrative arithmetic box (reuses .composite) and a standalone composite label */
.composite.is-calc { border-style: solid; border-color: var(--b1); background-image: none; }
.composite.is-calc .composite-k { background: var(--s2); }
.composite.is-calc .composite-k::before { border-radius: 2px; background: var(--t3); }
.prose .composite-solo {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-block-start: var(--sp-5);
  padding: 2px 10px;
  border-radius: 999px;
  background: var(--amber-soft);
  color: var(--t1);
  font-size: .8125rem;
  font-weight: 600;
  line-height: 1.6;
}
:lang(ar) .prose .composite-solo { font-size: .875rem; }
.composite-solo::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--amber); }
.prose .composite-solo + p { margin-block-start: var(--sp-3); }

/* dialogue: speaker label + line; two speakers styled alternately */
.dialogue { display: grid; gap: var(--sp-3); margin-block-start: var(--sp-5); }
.prose .dialogue .dl {
  margin: 0;
  padding: var(--sp-3) var(--sp-4);
  border-radius: var(--r-md);
  border: 1px solid var(--b1);
  border-inline-start: 3px solid var(--acc);
  background: var(--s1);
}
.prose .dialogue .dl-2 { border-inline-start-color: var(--amber); background: transparent; margin-inline-start: clamp(0px, 4vw, 40px); }
.dl-who {
  display: block;
  margin-block-end: 2px;
  font-size: .8125rem;
  font-weight: 700;
  letter-spacing: .02em;
  color: var(--acc);
}
:lang(ar) .dl-who { font-size: .875rem; letter-spacing: 0; }
.dl-2 .dl-who { color: var(--t2); }
.dl-say { display: block; }
.dl-say em { color: var(--t2); }

/* letter: salutation heading and sign-off */
.ep-sec.is-letter-open h2 { font-style: italic; font-weight: 600; color: var(--t2); }
:lang(ar) .ep-sec.is-letter-open h2 { font-style: normal; }
.prose .letter-sign { margin-block-start: var(--sp-5); display: flex; flex-direction: column; gap: 2px; }
.letter-sign .letter-name { font-size: 1.25em; font-weight: 700; color: var(--t1); }

/* episode meta: format tag */
.ep-fmt { color: var(--t2); }

/* hypothetical street map (S2 Episode 3) */
.sm {
  margin-block-start: var(--sp-6);
  padding: var(--sp-4) var(--sp-3) var(--sp-5);
  border-radius: var(--r-lg);
  border: 1px solid var(--b1);
  background: var(--s1);
  max-width: none !important;
}
@media (min-width: 720px) { .sm { padding: var(--sp-5) var(--sp-6) var(--sp-6); } }
.sm-stage { position: relative; }
.prose .sm-tag {
  display: inline-block;
  margin: 0 0 var(--sp-3);
  padding: 2px 10px;
  border-radius: 999px;
  border: 1px dashed var(--b2);
  font-size: .8125rem;
  font-weight: 600;
  color: var(--t2);
}
:lang(ar) .prose .sm-tag { font-size: .875rem; }
.sm-svg { display: block; width: 100%; height: auto; }
.sm-svg .sm-block { fill: var(--s2); stroke: var(--b1); stroke-width: 1; }
.sm-svg .sm-road { fill: var(--dot-off); }
.sm-svg .sm-lane { fill: none; stroke: var(--s1); stroke-width: 1.5; stroke-dasharray: 10 10; }
.sm-svg .sm-unit.sm-top { fill: var(--t2); }
.sm-svg .sm-unit.sm-mid { fill: var(--t3); opacity: .55; }
.sm-svg .sm-flow { fill: none; stroke: var(--t1); stroke-linecap: round; }
.sm-svg .sm-flow-a { stroke-width: 9; }
.sm-svg .sm-flow-b { stroke-width: 3; }
.sm-svg .sm-flow-head { fill: var(--t1); }
.sm-svg .sm-ring { fill: none; stroke-width: 2; }
.sm-svg .sm-ring-a { stroke: var(--acc); }
.sm-svg .sm-ring-b { stroke: var(--amber); }
.sm-svg .sm-deliv { stroke-width: 1.5; stroke-dasharray: 6 6; opacity: .8; }
.sm-svg .sm-hatch-bg { fill: var(--s1); }
.sm-svg .sm-hatch-line { stroke: var(--t3); stroke-width: 2; }
.sm-svg .sm-dest { fill: url(#sm-hatch); stroke: var(--t2); stroke-width: 1.5; }
.sm-svg .sm-shift { fill: none; stroke: var(--t2); stroke-width: 2; stroke-dasharray: 5 5; }
.sm-svg .sm-shift-head { fill: var(--t2); }
.sm-svg .sm-badge circle { fill: var(--bg); stroke: var(--t1); stroke-width: 2; }
.sm-svg .sm-badge text, .sm-svg .sm-park text { font-family: inherit; font-size: 15px; font-weight: 700; fill: var(--t1); }
.sm-svg .sm-badge.is-c circle { stroke: var(--t2); stroke-dasharray: 4 3; }
.sm-svg .sm-site circle { fill: var(--acc-fill); stroke: var(--bg); stroke-width: 3; }
.sm-svg .sm-site.is-b circle { fill: var(--amber); }
.sm-svg .sm-park rect { fill: var(--bg); stroke: var(--t3); stroke-width: 1.5; }
.sm-svg .sm-park text { font-family: var(--font); font-size: 14px; }
@media (max-width: 559px) {
  .sm-svg .sm-badge circle { r: 20px; }
  .sm-svg .sm-badge text, .sm-svg .sm-park text { font-size: 21px; }
  .sm-svg .sm-park rect { x: -16px; y: -16px; width: 32px; height: 32px; }
}
.sm-legend {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 6px 18px;
  margin-block-start: var(--sp-4) !important;
  font-size: .8125rem;
  line-height: 1.5;
  color: var(--t2);
}
:lang(ar) .sm-legend { font-size: .875rem; }
.prose .sm-legend > li { display: inline-flex; align-items: center; gap: 8px; margin: 0; padding: 0; }
.prose .sm-legend > li::before { content: none; }
.sm-sw { display: inline-block; flex: none; width: 22px; height: 10px; border-radius: 2px; }
.sm-sw-top { background: var(--t2); }
.sm-sw-mid { background: var(--t3); opacity: .55; }
.sm-sw-heavy { height: 6px; border-radius: 3px; background: var(--t1); }
.sm-sw-light { height: 2px; background: var(--t1); }
.sm-sw-ring { height: 14px; width: 14px; border-radius: 50%; border: 2px solid var(--acc); box-shadow: 0 0 0 3px var(--s1), 0 0 0 4.5px var(--amber); }
.sm-sw-hatch { border: 1px solid var(--t2); background: repeating-linear-gradient(45deg, var(--s1) 0 3px, var(--t3) 3px 5px); }
.sm-cap { margin-block-start: var(--sp-3); text-align: center; font-size: .875rem; color: var(--t3); }
:lang(ar) .sm-cap { font-size: .9375rem; }
.sm-table caption {
  caption-side: top;
  padding: 0 0 var(--sp-2);
  text-align: start;
  font-size: .8125rem;
  font-weight: 600;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--acc);
}
:lang(ar) .sm-table caption { font-size: .9375rem; letter-spacing: 0; text-transform: none; }
.sm .tbl-wrap { margin-block-start: var(--sp-5); }
@media (max-width: 719px) { .sm-table caption { display: block; } }

/* series navigation: two columns (prev/next, other season/all) */
@media (min-width: 720px) {
  .series-nav { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .series-nav > .sn-card:last-child:nth-child(odd) { grid-column: 1 / -1; }
}
.sn-season { background: transparent; }

/* hub: seasons */
.season-jump { margin-block-start: var(--sp-5); }
.season-jump ul { display: flex; flex-wrap: wrap; gap: var(--sp-3); }
.season-jump a {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 4px 10px;
  min-height: 44px;
  padding: 10px 16px;
  border-radius: var(--r-md);
  border: 1px solid var(--b1);
  background: var(--s1);
  color: var(--t1);
  transition: border-color var(--d2) var(--ease);
}
.season-jump a:hover { border-color: var(--acc-line); }
.sj-t { font-size: .8125rem; font-weight: 600; color: var(--acc); }
:lang(ar) .sj-t { font-size: .875rem; }
.sj-n { font-weight: 700; }
.sj-c { font-size: .8125rem; color: var(--t3); }
:lang(ar) .sj-c { font-size: .875rem; }
.hub-season + .hub-season { border-block-start: 1px solid var(--b1); }
.hub-season { scroll-margin-top: var(--header-h); }
.hs-head { min-width: 0; }
.hs-k { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-block-end: 4px; font-size: .8125rem; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--acc); }
:lang(ar) .hs-k { font-size: .9375rem; letter-spacing: 0; text-transform: none; }
.hs-latest { padding: 1px 8px; border-radius: 999px; background: var(--acc-fill); color: var(--on-acc); font-size: .75rem; letter-spacing: 0; text-transform: none; }
.hs-theme { margin-block-start: 6px; max-width: 60ch; font-size: 1.0625rem; line-height: 1.6; color: var(--t2); }
:lang(ar) .hs-theme { line-height: 1.8; }
.hub-season .hub-count { flex: none; }
.hc-fmt { padding: 0 8px; border-radius: 999px; border: 1px solid var(--b2); color: var(--t2); font-size: .75rem; font-weight: 600; }

/* ---------- Print ---------- */
@media print {
  .ep-toc, .share, .series-nav, .season-jump, .rb-toggle, .rb-all, .ins-cta-actions, .crumbs { display: none !important; }
  .ep-layout { display: block; padding: 0; }
  .prose { font-size: 11pt; }
  .rb-cards.is-single .rb-card:not(.is-on) { display: block; }
  .ep-notes a.url::after { content: none; }
}