/* Rune page — CD D9 (1440) / 2e (390), built 2026-09-14 (engine 0.51.206).
 * Token-only (the guard bans literals). A CREAM-surface page (unlike the ink tarot
 * card page). Enqueued by Capriastro_Content_Library on is_singular('rune_stone');
 * ships with the module (the lift rule). Everything page-specific is .cap-rpage__*;
 * the STONE (.cap-rstone) is shared with the hub sheet and drawn from the stone
 * tokens (states.md §Rune stones) — its face is type set in var(--cap-font-rune).
 *
 * Sheet → token map: cream #f8f6f0 = bg · ink #241f3d = text · body #2f2b45 = text-body ·
 * lede #454059 = text-secondary · muted #8e8a9e = muted · rules #e7e3d8 / #dcd7cb = line /
 * line-strong · thead #ece7d9 = bg-deep · white cards = surface · violet #8b5cf6 = primary ·
 * glyph on stone #c9b8f5 = primary-pale · grid 1fr 420 gap 80 = rail / gutter-rail · hero
 * grid 176 1fr gap 44 (card-hero-gap) · h1 Barlow Condensed 500 60/34 .08em (card-h1) ·
 * lede serif italic 500 23/17 (card-lede) · heads display 800 24/22 (card-h2) · body serif
 * 18/15.5 (read) · table caps 13/11.5 (sm) · values 18/14 (card-value).
 *
 * Stone geometry is widget geometry the system has no token for (as the daily-draw sheet
 * declares it): collected as --cap-rpage-* custom properties, one place to change them. The
 * face is a constant share of the stone's height (77/220 · 58/165 · 26/64), so it scales.
 */

.cap-shell .cap-rpage {
  --cap-rpage-stone-w: 176px;
  --cap-rpage-stone-h: 220px;
  --cap-rpage-stone-r: 81.6px / 102px;
  --cap-rpage-tile-w: 52px;
  --cap-rpage-tile-h: 64px;
  --cap-rpage-tile-r: 24px / 30px;
  --cap-rpage-tarot-art: 58px;
  --cap-rpage-h1: 56px; --cap-rpage-lede: 22px; --cap-rpage-lede-w: 420px; --cap-rpage-key: 14px; --cap-rpage-sub-k: 165px; --cap-rpage-poster-h: 240px; --cap-rpage-daily-h: 36px; --cap-rpage-pair-name: 26px; --cap-rpage-deck-x: 44px; --cap-rpage-foot: 14px; --cap-rpage-foot-pad: 96px;
  background: var(--cap-color-bg); color: var(--cap-color-text);
}
.cap-shell .cap-rpage__inner { max-width: var(--cap-page-max); margin: 0 auto; padding: 0 var(--cap-page-x); }

/* The stone (shared with the hub sheet) */
.cap-shell .cap-rstone { display: flex; align-items: center; justify-content: center; flex: none; container-type: size; border-radius: var(--cap-rpage-stone-r); width: var(--cap-rpage-stone-w); height: var(--cap-rpage-stone-h);
  background: radial-gradient(70% 62% at 46% 38%, var(--cap-color-stone-1) 0%, var(--cap-color-stone-2) 46%, var(--cap-color-stone-3) 82%, var(--cap-color-stone-4) 100%);
  box-shadow: var(--cap-shadow-dark), var(--cap-shadow-stone); }
.cap-shell .cap-rstone__face { font-family: var(--cap-font-rune); font-size: calc(100cqh * var(--cap-rune-glyph)); line-height: 1; color: var(--cap-color-primary-pale); }

/* Crumb row */
.cap-shell .cap-rpage__crumbs { border-top: var(--cap-border-hairline) solid var(--cap-color-line); padding: var(--cap-space-crumb-y) 0; font-family: var(--cap-font-ui); font-weight: 500; font-size: var(--cap-type-eyebrow); line-height: var(--cap-leading-tight); letter-spacing: var(--cap-track-meta); text-transform: uppercase; color: var(--cap-color-muted); display: flex; flex-wrap: wrap; gap: var(--cap-space-sm); }
.cap-shell .cap-rpage__crumbs a { color: inherit; text-decoration: none; }
 .cap-shell .cap-rpage__crumbs [aria-current] { color: var(--cap-color-text); }
@media (hover: hover) { .cap-shell .cap-rpage__crumbs a:hover { color: var(--cap-color-text); } }

/* Two columns: main + rail */
.cap-shell .cap-rpage__grid { display: grid; grid-template-columns: 1fr var(--cap-rail); gap: var(--cap-space-lg) var(--cap-gutter-rail); align-items: start; padding: calc(var(--cap-space-xl) - var(--cap-space-gap-2)) 0 0; }
.cap-shell .cap-rpage__deck { grid-column: 1 / -1; }
.cap-shell .cap-rpage__main { display: flex; flex-direction: column; gap: var(--cap-space-md); min-width: 0; }
.cap-shell .cap-rpage__rail { display: flex; flex-direction: column; gap: var(--cap-space-field-x); min-width: 0; align-self: start; }   /* owner 2026-09-25: scrolls with the page, not sticky */

/* Hero: stone + title block */
.cap-shell .cap-rpage__hero { display: grid; grid-template-columns: var(--cap-rpage-stone-w) 1fr; gap: var(--cap-card-hero-gap); align-items: center; }
.cap-shell .cap-rpage__title { display: flex; flex-direction: column; gap: var(--cap-space-field-x); }
.cap-shell .cap-rpage__eyebrow { font-family: var(--cap-font-ui); font-weight: 500; font-size: var(--cap-type-small); letter-spacing: var(--cap-track-eyebrow); text-transform: uppercase; color: var(--cap-color-primary); }
.cap-shell .cap-rpage__eyebrow--muted { color: var(--cap-color-muted); letter-spacing: var(--cap-track-meta); }
.cap-shell .cap-rpage__eyebrow--on-ink { color: var(--cap-color-primary-soft); letter-spacing: var(--cap-track-eyebrow); }
.cap-shell .cap-rpage__h1 { font-family: var(--cap-font-ui); font-weight: 500; font-size: var(--cap-rpage-h1); letter-spacing: var(--cap-track-card-title); text-transform: uppercase; line-height: var(--cap-leading-display); margin: 0; color: var(--cap-color-text); }
.cap-shell .cap-rpage__lede { font-family: var(--cap-font-serif); font-style: italic; font-weight: 400; font-size: var(--cap-rpage-lede); line-height: var(--cap-leading-data); color: var(--cap-color-text-secondary); margin: 0; max-width: var(--cap-rpage-lede-w); }
/* D9b: pronunciation · meaning · aett — rendered exactly as stored (the identity line's ruling: no case transform, the stress stays readable) */
.cap-shell .cap-rpage__meta { font-family: var(--cap-font-ui); font-weight: 500; font-size: var(--cap-type-sm); letter-spacing: var(--cap-track-meta); line-height: var(--cap-leading-tight); color: var(--cap-color-muted); text-transform: uppercase; }   /* "YEH-RAH · HARVEST · HAGAL'S AETT" — capitals, as D9b and 2e draw it (owner 2026-09-27) */
.cap-shell .cap-rpage__chips { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: var(--cap-space-sm); }
.cap-shell .cap-rpage__chip { cursor: default; }
@media (hover: hover) { .cap-shell .cap-rpage__chip:hover { border-color: var(--cap-color-line-strong); } }

/* Meaning / Merkstave + the three sub-rows — each section is a column at the sheet's 20 px pitch (D9: gap 20) */
.cap-shell .cap-rpage__main > section { display: flex; flex-direction: column; gap: 0; }
.cap-shell .cap-rpage__h2 { font-family: var(--cap-font-display-sm); font-weight: 800; font-size: var(--cap-type-card-h2); line-height: var(--cap-leading-tight); letter-spacing: var(--cap-track-tight); color: var(--cap-color-text); margin: var(--cap-space-card-pad) 0 var(--cap-space-block-5); }
.cap-shell .cap-rpage__body { font-family: var(--cap-font-serif); font-size: var(--cap-type-read); line-height: var(--cap-leading-article); color: var(--cap-color-text-body); margin: 0; }
.cap-shell .cap-rpage__body p { margin: 0 0 var(--cap-space-block-5); }
.cap-shell .cap-rpage__body p:last-child { margin-bottom: 0; }
.cap-shell .cap-rpage__subs { display: grid; grid-template-columns: 1fr; border: var(--cap-border-hairline) solid var(--cap-color-line); background: var(--cap-color-surface); margin-top: var(--cap-space-lg); }
.cap-shell .cap-rpage__sub { display: grid; grid-template-columns: var(--cap-rpage-sub-k) 1fr; gap: var(--cap-space-md); padding: calc(var(--cap-space-cell-y) + var(--cap-space-gap-2)) calc(var(--cap-space-cell-x) + var(--cap-space-gap-4)) calc(var(--cap-space-cell-y) + var(--cap-space-gap-2)) var(--cap-space-cell-x);   /* D8b/D9b: the value text stops 28 short of the edge */ border-top: var(--cap-border-hairline) solid var(--cap-color-line); align-items: baseline; }
.cap-shell .cap-rpage__sub:first-child { border-top: 0; }
.cap-shell .cap-rpage__sub-k { font-family: var(--cap-font-ui); font-weight: 600; font-size: var(--cap-rpage-key); letter-spacing: var(--cap-track-label); text-transform: uppercase; color: var(--cap-color-text); }
.cap-shell .cap-rpage__sub-v { font-family: var(--cap-font-serif); font-size: var(--cap-type-faq-answer); line-height: var(--cap-leading-body); color: var(--cap-color-text-body); margin: 0; }
.cap-shell .cap-rpage__sub-v p { margin: 0; }
.cap-shell .cap-rpage__sub-v p + p { margin-top: var(--cap-space-md); }
.cap-shell .cap-rpage__table { margin-top: 0; }

/* Correspondences table */
.cap-shell .cap-rpage__table { border: var(--cap-border-hairline) solid var(--cap-color-line); background: var(--cap-color-surface); }
.cap-shell .cap-rpage__thead, .cap-shell .cap-rpage__row { display: grid; grid-template-columns: 1fr 1fr; align-items: baseline; }
.cap-shell .cap-rpage__thead { background: var(--cap-color-bg-deep); font-family: var(--cap-font-ui); font-weight: 500; font-size: var(--cap-type-sm); line-height: normal; letter-spacing: var(--cap-track-meta); text-transform: uppercase; color: var(--cap-color-text); }
.cap-shell .cap-rpage__thead > span { padding: var(--cap-space-gap-7) var(--cap-space-cell-x); }   /* D9b 1 Oct 2026: 14 above and below */
.cap-shell .cap-rpage__row { border-top: var(--cap-border-hairline) solid var(--cap-color-line); }
.cap-shell .cap-rpage__k { padding: var(--cap-space-cell-y) var(--cap-space-cell-x); font-family: var(--cap-font-ui); font-weight: 600; font-size: var(--cap-rpage-key); letter-spacing: var(--cap-track-label); text-transform: uppercase; color: var(--cap-color-text); }
.cap-shell .cap-rpage__v { padding: var(--cap-space-cell-y) var(--cap-space-cell-x); font-family: var(--cap-font-ui); font-weight: 400; font-size: var(--cap-type-card-value); letter-spacing: var(--cap-track-data); line-height: var(--cap-leading-data); color: var(--cap-color-text-body); }

/* Also in the Tarot (conditional) — D9b (2026-09-25): an INK card on the cream page — the paired card's art left ·
   eyebrow · name (the link) · the card's essence · hairline · footnote. */
.cap-shell .cap-rpage__tarot { background: var(--cap-color-text); color: var(--cap-color-on-ink); border: var(--cap-border-hairline) solid var(--cap-color-line-on-ink-2); margin-top: var(--cap-space-md); }
.cap-shell .cap-rpage__tarot-body { display: grid; grid-template-columns: var(--cap-rpage-tarot-art) 1fr; column-gap: var(--cap-space-block-5); align-items: start; padding: var(--cap-space-card-pad) var(--cap-space-card-pad) var(--cap-space-card-pad) var(--cap-space-block-5); }
.cap-shell .cap-rpage__tarot-art { display: block; width: var(--cap-rpage-tarot-art); aspect-ratio: 270 / 463; border-radius: var(--cap-radius-card-face-xs); overflow: hidden; box-shadow: var(--cap-shadow-card-art); margin-top: var(--cap-space-gap-5); }
.cap-shell .cap-rpage__tarot-art img { width: 100%; height: 100%; object-fit: cover; display: block; }
.cap-shell .cap-rpage__tarot-text { display: flex; flex-direction: column; gap: var(--cap-space-xs); min-width: 0; }
.cap-shell .cap-rpage__tarot-eyebrow { font-family: var(--cap-font-ui); font-weight: 500; font-size: var(--cap-type-sm); letter-spacing: var(--cap-track-meta); text-transform: uppercase; color: var(--cap-color-on-ink-muted); margin: 0; }
.cap-shell .cap-rpage__tarot-name { font-family: var(--cap-font-ui); font-weight: 500; font-size: var(--cap-type-h3-card); letter-spacing: var(--cap-track-label); text-transform: uppercase; color: var(--cap-color-on-ink); text-decoration: none; }
@media (hover: hover) { a.cap-rpage__tarot-name:hover { color: var(--cap-color-primary-pale); } }   /* round 23: a link on ink turns the pale lilac (CD values: primary-pale = "link hover on ink") */
.cap-shell .cap-rpage__tarot-essence { font-family: var(--cap-font-serif); font-style: italic; font-size: var(--cap-type-lede); line-height: var(--cap-leading-lede); color: var(--cap-color-on-ink-2); margin: 0; }
.cap-shell .cap-rpage__footnote { font-family: var(--cap-font-serif); font-style: italic; font-size: var(--cap-type-small); line-height: var(--cap-leading-small); color: var(--cap-color-on-ink-muted); margin: var(--cap-space-sm) 0 0; border-top: var(--cap-border-hairline) solid var(--cap-color-line-on-ink); padding-top: var(--cap-space-md); }

/* Rail: prev/next · on-this-page · cards */
.cap-shell .cap-rpage__pn { display: flex; justify-content: space-between; gap: var(--cap-space-md); padding: 0 var(--cap-space-xs); font-family: var(--cap-font-ui); font-weight: 500; font-size: var(--cap-type-eyebrow); line-height: var(--cap-leading-tight); letter-spacing: var(--cap-track-meta); text-transform: uppercase; color: var(--cap-color-muted); }
.cap-shell .cap-rpage__pn a { color: inherit; text-decoration: none; }
@media (hover: hover) { .cap-shell .cap-rpage__pn a:hover { color: var(--cap-color-text); } }
/* D9b (2026-09-25): the chart card white, the poster + daily cards ink; 24 in, 20 between parts, left-aligned;
   the eyebrow first, the title Bricolage 24, a full-width pill. The poster photo runs edge to edge above its words. */
.cap-shell .cap-rpage__card { background: var(--cap-color-surface); border: var(--cap-border-hairline) solid var(--cap-color-line-strong); padding: var(--cap-space-block-5); display: flex; flex-direction: column; align-items: flex-start; gap: var(--cap-space-field-x); }
.cap-shell .cap-rpage__card--ink { background: var(--cap-color-ink-raised); border-color: var(--cap-color-ink-raised); color: var(--cap-color-on-ink); }
.cap-shell .cap-rpage__card .cap-rpage__eyebrow { font-size: var(--cap-type-sm); letter-spacing: var(--cap-track-eyebrow); line-height: var(--cap-leading-tight); }
.cap-shell .cap-rpage__card-title { font-family: var(--cap-font-display-sm); font-weight: 800; font-size: var(--cap-type-h3-card); line-height: var(--cap-leading-tight); letter-spacing: var(--cap-track-tight); color: inherit; margin: 0; }
.cap-shell .cap-rpage__card-btn { align-self: stretch; justify-content: center; text-align: center; }
.cap-shell .cap-rpage__card-icon { display: block; width: var(--cap-card-icon); height: var(--cap-card-icon); color: var(--cap-color-primary); }
.cap-shell .cap-rpage__card-icon svg { width: 100%; height: 100%; display: block; }
.cap-shell .cap-rpage__card--poster { padding: 0; gap: 0; border: 0; }   /* a full-bleed photo never carries a stroke (owner 2026-09-25) */
.cap-shell .cap-rpage__card-img { width: 100%; height: var(--cap-rpage-poster-h); object-fit: cover; display: block; }
.cap-shell .cap-rpage__card-in { align-self: stretch; display: flex; flex-direction: column; align-items: flex-start; gap: var(--cap-space-field-x); padding: var(--cap-space-block-5); }
.cap-shell .cap-rpage__daily-icon { display: inline-flex; align-items: center; justify-content: center; width: auto; height: var(--cap-rpage-daily-h); color: var(--cap-color-primary-soft); }   /* the owner's tarot / rune icon (icon-*.svg, 2026-10-08): drawn in one shared frame at the box's height (the card fills it; the stone stands as tall as the owner drew it beside the card), lilac on the ink — was a lilac tile with a typed ✦ / ᛉ */
.cap-shell .cap-rpage__daily-icon svg { display: block; width: auto; height: calc(100% * 346.37 / 339.67); }
.cap-shell .cap-rpage__card-actions { display: flex; flex-wrap: wrap; gap: var(--cap-space-gap-5); }
.cap-shell .cap-rpage__nav-card > .cap-rpage__eyebrow { color: var(--cap-color-text); font-size: var(--cap-type-label); letter-spacing: var(--cap-track-label); }
.cap-shell .cap-rpage__nav { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; border-left: var(--cap-border-emphasis) solid var(--cap-color-line); }
.cap-shell .cap-rpage__nav a { display: block; margin-left: calc(-1 * var(--cap-border-emphasis)); padding: var(--cap-space-gap-3) 0 var(--cap-space-gap-3) var(--cap-space-md); font-family: var(--cap-font-ui); font-weight: 500; font-size: var(--cap-type-eyebrow); line-height: var(--cap-leading-tight); letter-spacing: var(--cap-track-label); text-transform: uppercase; color: var(--cap-color-text-tertiary); text-decoration: none; border-left: var(--cap-border-emphasis) solid transparent; }
.cap-shell .cap-rpage__nav li:first-child a { color: var(--cap-color-text); border-left-color: var(--cap-color-primary); }
@media (hover: hover) { .cap-shell .cap-rpage__nav a:hover { color: var(--cap-color-text); } }   /* the violet bar marks the SELECTED entry only; hover darkens the text (owner 2026-09-29) */

/* The strip of 25 (D9: 12-up, the blank apart under a rule — solid #e7e3d8 since the owner's 27 Sep ruling, all widths) */
.cap-shell .cap-rpage__deck { border-top: var(--cap-border-hairline) solid var(--cap-color-line); padding: var(--cap-space-lg) 0 var(--cap-space-xl); }
.cap-shell .cap-rpage__deck-head { display: flex; align-items: baseline; gap: var(--cap-space-md); margin: 0 0 calc(var(--cap-space-md) + var(--cap-space-gap-1)); }
.cap-shell .cap-rpage__deck-h { font-family: var(--cap-font-ui); font-weight: 500; font-size: var(--cap-type-section); letter-spacing: var(--cap-track-eyebrow); text-transform: uppercase; color: var(--cap-color-text); margin: 0; }
.cap-shell .cap-rpage__deck-sub { font-family: var(--cap-font-ui); font-weight: 500; font-size: var(--cap-type-sm); letter-spacing: var(--cap-track-meta); text-transform: uppercase; color: var(--cap-color-muted); }
.cap-shell .cap-rpage__tiles { list-style: none; margin: 0; padding: 0 var(--cap-rpage-deck-x); display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: var(--cap-space-md) 0; }   /* D9b: 12 equal columns over 1192, centred */
.cap-shell .cap-rpage__tile > :is(a, .cap-press), .cap-shell .cap-rpage__tile:is(a, .cap-press) { display: flex; flex-direction: column; align-items: center; gap: var(--cap-space-gap-3); text-decoration: none; color: var(--cap-color-muted); }
@media (hover: hover) { .cap-shell .cap-rpage__tile > :is(a, .cap-press):hover, .cap-shell .cap-rpage__tile:is(a, .cap-press):hover { opacity: .75; } }
.cap-shell .cap-rpage__tile-g { width: var(--cap-rpage-tile-w); height: var(--cap-rpage-tile-h); border-radius: var(--cap-rpage-tile-r); background: var(--cap-color-surface); border: var(--cap-border-hairline) solid var(--cap-color-line-strong); display: flex; align-items: center; justify-content: center; font-family: var(--cap-font-rune); font-size: calc(var(--cap-rpage-tile-h) * var(--cap-rune-glyph)); line-height: 1; color: var(--cap-color-text); }   /* the rune glyph rule: 30 % of the tile (owner 2026-10-03) */
.cap-shell .cap-rpage__tile-name { font-family: var(--cap-font-ui); font-weight: 600; font-size: var(--cap-type-meta); letter-spacing: var(--cap-track-feature); text-transform: uppercase; text-align: center; color: var(--cap-color-muted); padding-bottom: var(--cap-space-xs); border-bottom: var(--cap-border-selected) solid transparent; }   /* D9b: the names muted, the current one in ink */
.cap-shell .cap-rpage__tile-sub { font-family: var(--cap-font-ui); font-weight: 500; font-size: var(--cap-type-sm); letter-spacing: var(--cap-track-meta); text-transform: uppercase; text-align: center; color: var(--cap-color-muted); }
.cap-shell .cap-rpage__tile[aria-current] .cap-rpage__tile-g, .cap-shell .cap-rpage__tile.is-current .cap-rpage__tile-g { color: var(--cap-color-primary); }
.cap-shell .cap-rpage__tile[aria-current] .cap-rpage__tile-name, .cap-shell .cap-rpage__tile.is-current .cap-rpage__tile-name { color: var(--cap-color-text); border-bottom-color: var(--cap-color-primary); }
.cap-shell .cap-rpage__blank { margin-top: var(--cap-space-card-pad); padding-top: var(--cap-space-card-pad); border-top: var(--cap-border-hairline) solid var(--cap-color-divider-rune); display: flex; justify-content: center; }
.cap-shell .cap-rpage__pn-all { display: none; }   /* the tablet top row's "← All …" (owner 2026-10-01) */
.cap-shell .cap-rpage__pn-pair { display: contents; }
.cap-shell .cap-rpage__deck-all { display: none; }   /* the phone-only "All 25 →" (owner 27 Sep: the one mobile string variant) */

/* 700–1279 · T12 / T13 (1024; 820 follows them): the tablet column (912 / 708); no breadcrumb — the top row 20 under the
   header line: "← All 22 cards" / "← All 25 runes" left, the previous · next names right (owner 2026-10-01); 56 between the
   blocks under the article; the free-chart and poster cards side by side, the draw band across; the deck one scrolling row
   with "All 22 →" / "All 25 →" beside its heading (the phone's strip at the tablet's sizes) */
/* THE DRAW BOX, desktop rail — VERSION A (owner ruling 2026-10-08): the icon + headline on one row, eyebrow above, the three buttons
   beneath (two above and one below where three do not fit) — the tablet arrangement, in the rail's width */
@media (min-width: 1280px) {
  .cap-shell .cap-rpage__card--daily { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: var(--cap-space-md); }
  .cap-shell .cap-rpage__card--daily > :not(.cap-rpage__daily-icon):not(.cap-rpage__card-title) { grid-column: 1 / -1; }
  .cap-shell .cap-rpage__card--daily .cap-rpage__daily-icon { margin: 0; }
}
@media (min-width: 700px) and (max-width: 1279px) {
  .cap-shell .cap-rpage__inner { padding-left: var(--cap-page-x-mid); padding-right: var(--cap-page-x-mid); }
  .cap-shell nav.cap-rpage__crumbs { display: none; }
  .cap-shell .cap-rpage__grid { padding-top: 0; row-gap: var(--cap-space-band-close); }
  .cap-shell .cap-rpage__pn--top { border-top: 0; padding-top: var(--cap-space-section-head-below); color: var(--cap-color-caption); }
  .cap-shell .cap-rpage__pn-all { display: inline; color: inherit; text-decoration: none; }
  .cap-shell .cap-rpage__pn-pair { display: flex; gap: var(--cap-space-lg); }
  .cap-shell .cap-rpage__hero { margin-top: calc(var(--cap-space-band-close) + var(--cap-space-gap-1)); }   /* the sheet's distance from the top row to the hero */
  .cap-shell .cap-rpage__rail { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--cap-space-band-close) var(--cap-gutter); max-width: none; align-self: stretch; }
  .cap-shell .cap-rpage__card--daily { grid-column: 1 / -1; display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: var(--cap-space-md); }   /* T12 / T13: eyebrow · icon + headline · the buttons */
  .cap-shell .cap-rpage__card--daily > :not(.cap-rpage__daily-icon):not(.cap-rpage__card-title) { grid-column: 1 / -1; }
  .cap-shell .cap-rpage__card--daily .cap-rpage__daily-icon { margin: 0; }
  .cap-shell .cap-rpage__card--chart > :last-child { margin-top: auto; }   /* the button at the card's foot, level with the poster card's */
  .cap-shell .cap-rpage__tile-name { font-size: var(--cap-type-spec-stacked); font-weight: 600; letter-spacing: var(--cap-track-label); }   /* T12 / T13: 12 · 600 · .1em */
  .cap-shell .cap-rpage__card--daily .cap-rpage__d { display: none; }   /* the tablet sheets use the site's phone headline */
  .cap-shell .cap-rpage__card--daily .cap-rpage__m { display: inline; }
  .cap-shell .cap-rpage__deck { min-width: 0; padding-bottom: var(--cap-space-xl); }
  .cap-shell .cap-rpage__deck-head { display: flex; align-items: baseline; justify-content: space-between; gap: var(--cap-space-md); margin: 0; }
  .cap-shell .cap-rpage__deck-h { margin: 0; }
  .cap-shell .cap-rpage__deck-all { display: inline; flex: none; font-family: var(--cap-font-ui); font-weight: 600; font-size: var(--cap-type-caption); letter-spacing: var(--cap-track-meta); line-height: normal; text-transform: uppercase;
    color: var(--cap-color-text); text-decoration: none; border-bottom: var(--cap-border-hairline) solid var(--cap-color-primary); padding-bottom: var(--cap-space-gap-1); }
  .cap-shell .cap-rpage__deck-sub, .cap-shell .cap-rpage__tile-sub { display: none; }
  .cap-shell .cap-rpage__strip { display: flex; align-items: flex-start; gap: var(--cap-space-gap-7); overflow-x: auto; margin: 0 calc(-1 * var(--cap-page-x-mid)); padding: var(--cap-space-section-head-below) var(--cap-page-x-mid) var(--cap-space-block-5); }   /* round 32 (owner 2026-10-06): one step more between the names and the scroll bar, so a two-line name never touches it (20 → 24) */
  .cap-shell .cap-rpage__tiles { display: contents; }
  .cap-shell .cap-rpage__tile { flex: none; width: 60px; position: relative; }   /* geometry: T13's 60 × 74 stone */
  .cap-shell .cap-rpage { --cap-rpage-tile-w: 60px; --cap-rpage-tile-h: 74px; --cap-rpage-tile-r: 28px / 35px; }
  .cap-shell .cap-rpage__blank { flex: none; align-self: stretch; margin: 0 0 0 var(--cap-space-gap-2); padding: 0 0 0 calc(var(--cap-space-gap-2) + var(--cap-space-gap-5)); border-top: 0; border-left: var(--cap-border-hairline) solid var(--cap-color-divider-rune); display: block; }
  .cap-shell .cap-rpage__lede { max-width: none; }   /* T13 (owner 2026-10-01): the lede runs to the column's right edge */
  .cap-shell .cap-rpage { --cap-rpage-foot-pad: 0px; }   /* the note across the box, never a word alone on its last line */
  .cap-shell .cap-rpage__footnote { text-wrap: pretty; }
}

/* Mobile (2e): ONE flow. The article and the rail dissolve (display: contents) so every block takes the
   sheet's order: prev/next → hero (stone centred, then eyebrow · name · lede · meta · chips) → Upright → Merkstave →
   correspondences → Tarot card → chart card → poster card → daily card → the strip of 25, last (the desktop order,
   owner round 22 — it replaced 2e's chart · strip · Tarot).
   The rail's own prev/next and nav card are hidden. */
@media (max-width: 699px) {
  .cap-shell .cap-rpage { --cap-rpage-stone-w: 132px; --cap-rpage-stone-h: 165px; --cap-rpage-stone-r: 61.6px / 77px; --cap-rpage-h1: var(--cap-type-card-h1); --cap-rpage-lede: var(--cap-type-card-lede); --cap-rpage-lede-w: none; --cap-rpage-key: var(--cap-type-sm); }
  .cap-shell .cap-rpage__grid { display: flex; flex-direction: column; align-items: stretch; gap: var(--cap-space-lg); padding: 0 0 var(--cap-space-lg); }   /* stretch: the desktop grid's `align-items: start` would shrink-wrap every block */
  .cap-shell .cap-rpage__main, .cap-shell .cap-rpage__rail { display: contents; }
  .cap-shell .cap-rpage__pn--top { display: flex; order: 0; border-top: var(--cap-border-hairline) solid var(--cap-color-line); padding-top: var(--cap-space-crumb-y); }
  .cap-shell .cap-rpage__hero { order: 1; grid-template-columns: 1fr; gap: var(--cap-space-md); text-align: center; justify-items: center; margin-top: calc(var(--cap-space-crumb-y) - var(--cap-space-lg)); }
  .cap-shell .cap-rpage__title { align-items: center; gap: var(--cap-space-sm); }
  .cap-shell .cap-rpage__chips { justify-content: center; }
  .cap-shell #meaning { order: 2; } .cap-shell #merkstave { order: 3; } .cap-shell #correspondences { order: 4; }
  .cap-shell #tarot { order: 5; }   /* round 22 C10 (owner): below 1024 the desktop order — the cross-reference, then the rail's cards, the strip last */
  .cap-shell .cap-rpage__card--chart { order: 6; }
  .cap-shell .cap-rpage__card--poster { order: 7; }
  .cap-shell .cap-rpage__card--daily { order: 8; }
  .cap-shell .cap-rpage__deck { order: 9; }
  .cap-shell .cap-rpage__rail .cap-rpage__pn, .cap-shell .cap-rpage__nav-card { display: none; }
  .cap-shell .cap-rpage__sub { grid-template-columns: 1fr; gap: var(--cap-space-xs); }
  .cap-shell .cap-rpage__thead, .cap-shell .cap-rpage__row { grid-template-columns: 1fr auto; }
  .cap-shell .cap-rpage__v { text-align: right; }
  .cap-shell .cap-rpage__tarot-body { grid-template-columns: auto 1fr; gap: var(--cap-space-md); padding: var(--cap-space-card-pad); }
  .cap-shell .cap-rpage__tarot-art { margin-top: 0; }
}
@media (min-width: 700px) {
  .cap-shell .cap-rpage__pn--top { display: none; }
}
/* 700–1279 (owner 2026-09-30): the 440 rail beside the article left the article 40 px wide at 820 and 244 at 1024 —
   every value in the correspondences table wrapped ("The / World"). The rail drops under the article, as on the
   horoscope sign pages; prev/next moves to the top, the "On this page" card goes (it jumps to what is right above). */
@media (min-width: 700px) and (max-width: 1279px) {
  .cap-shell .cap-rpage__grid { grid-template-columns: 1fr; column-gap: var(--cap-space-xl); }
  .cap-shell .cap-rpage__rail .cap-rpage__pn, .cap-shell .cap-rpage__nav-card { display: none; }
  .cap-shell .cap-rpage__pn--top { display: flex; }   /* the T13 row's look: the block above (with the strip) */
}

/* D8b/D9b pairing module type (2026-09-25): name 26, essence 17 on 27 (above the components' card-lede sweep), footnote 14
   held 96 off the right edge so it breaks where the sheet does */
:root body .cap-shell .cap-rpage .cap-rpage__tarot-essence { font-size: var(--cap-type-lede); line-height: var(--cap-leading-small); }
.cap-shell .cap-rpage__tarot-name { font-size: var(--cap-rpage-pair-name); line-height: var(--cap-leading-tight); }
.cap-shell .cap-rpage__footnote { font-size: var(--cap-rpage-foot); padding-right: var(--cap-rpage-foot-pad); }   /* the rule runs full width; the words break where the sheet's do */
@media (max-width: 699px) { .cap-shell .cap-rpage { --cap-rpage-foot-pad: 0px; } }
a.cap-rpage__tarot-art { transition: filter var(--cap-ease); }
@media (hover: hover) { a.cap-rpage__tarot-art:hover { filter: brightness(1.12); } }

/* PHONE (390) — CD 2e, measured 27 Sep 2026 against mobile-key-screens.dc.html (27 Sep markup), every value from the
 * sheet; the ones it has no name for are in design-system.json → mobile_pass (provisional). The grid gap goes to 0 and
 * each block carries the sheet's own distance above it. Desktop + tablet untouched. */
@media (max-width: 699px) {
  .cap-shell .cap-rpage__grid { gap: 0; padding-bottom: var(--cap-page-x); }   /* the sheet closes on 26 under the last card */
  /* crumb row: 12 / 10px caption type, its rule the header's own */
  .cap-shell .cap-rpage__crumbs { padding: var(--cap-space-gap-6) 0; font-size: var(--cap-type-caption); line-height: normal; border-top: 0; color: var(--cap-color-caption);
    gap: calc(var(--cap-space-gap-4) - var(--cap-border-hairline)); }
  /* prev / next: a full-width hairline, 24 above the 11px row */
  .cap-shell .cap-rpage__pn--top { margin: 0 calc(-1 * var(--cap-page-x)); padding: var(--cap-space-block-5) var(--cap-page-x) 0; font-size: var(--cap-type-eyebrow-card); line-height: normal; color: var(--cap-color-caption); }
  /* hero: the stone 24 under prev/next and 20 above the eyebrow, then 14 between lines; meta +10, chips +8 */
  .cap-shell .cap-rpage__hero { margin-top: var(--cap-space-block-5); gap: var(--cap-space-block-4); }
  .cap-shell .cap-rstone--hero { box-shadow: var(--cap-mp-shadow-stone-reveal); }
  .cap-shell .cap-rpage__title { gap: var(--cap-space-gap-7); }
  .cap-shell .cap-rpage__title .cap-rpage__eyebrow { font-size: var(--cap-type-eyebrow-card); letter-spacing: var(--cap-track-wide); line-height: normal; }
  .cap-shell .cap-rpage__h1 { line-height: normal; }
  .cap-shell .cap-rpage__lede { font-weight: 500; line-height: var(--cap-leading-lede); }
  .cap-shell .cap-rpage__meta { font-size: var(--cap-type-eyebrow-card); line-height: normal; color: var(--cap-color-caption); margin-top: var(--cap-space-gap-5); }
  .cap-shell .cap-rpage__chips { gap: var(--cap-space-gap-3); margin-top: var(--cap-space-gap-4); }
  .cap-shell .cap-rpage__chip { font-size: var(--cap-type-caption); padding: var(--cap-space-gap-3) var(--cap-space-gap-6); }
  /* the reading: 24 above each section, 14 under the head and between paragraphs; the white rows box 18 under the text */
  .cap-shell #meaning, .cap-shell #merkstave, .cap-shell #correspondences { margin-top: var(--cap-space-block-5); }
  .cap-shell .cap-rpage__h2 { font-size: var(--cap-mp-type-card-h2); letter-spacing: var(--cap-mp-track-card-h2); margin: 0 0 var(--cap-space-gap-7); }
  .cap-shell .cap-rpage__body p { margin-bottom: var(--cap-space-gap-7); }
  .cap-shell .cap-rpage__subs { margin-top: calc(var(--cap-space-gap-7) + var(--cap-space-gap-2)); border-color: var(--cap-color-line-strong); }
  .cap-shell .cap-rpage__sub { gap: var(--cap-space-gap-3); padding: var(--cap-space-co-field-row) var(--cap-space-field-cell-x); border-top-color: var(--cap-color-line-strong); }
  .cap-shell .cap-rpage__sub-k { font-size: var(--cap-type-spec-label); line-height: normal; }
  .cap-shell .cap-rpage__sub-v { font-size: var(--cap-type-lede); line-height: var(--cap-mp-leading-sub); }
  /* correspondences: a 118 key column, left-set values */
  .cap-shell .cap-rpage__table { border-color: var(--cap-color-line-strong); }
  .cap-shell .cap-rpage__thead, .cap-shell .cap-rpage__row { grid-template-columns: var(--cap-mp-corr-key-w-rune) 1fr; }
  .cap-shell .cap-rpage__row { border-top-color: var(--cap-color-line-strong); }
  .cap-shell .cap-rpage__thead { font-size: var(--cap-type-caption); letter-spacing: var(--cap-track-feature); line-height: normal; }
  .cap-shell .cap-rpage__thead > span, .cap-shell .cap-rpage__k { padding: var(--cap-space-gap-6) var(--cap-space-gap-7) var(--cap-space-gap-6) var(--cap-space-gap-8); }
  .cap-shell .cap-rpage__thead > span + span, .cap-shell .cap-rpage__v { padding: var(--cap-space-gap-6) var(--cap-space-gap-8) var(--cap-space-gap-6) 0; }
  .cap-shell .cap-rpage__k { font-size: var(--cap-type-spec-label); line-height: normal; }
  .cap-shell .cap-rpage__v { text-align: left; color: var(--cap-color-text); }
  /* the three promo cards: 24 above, 20 in, 10 between; the eyebrow 13 with its star one space off; 19 titles; 13px pills */
  .cap-shell .cap-rpage__card { margin-top: var(--cap-space-block-5); padding: var(--cap-space-block-4); gap: var(--cap-space-gap-5); }
  .cap-shell .cap-rpage__card .cap-rpage__eyebrow { font-size: var(--cap-type-eyebrow); line-height: normal; }
  .cap-shell .cap-rpage__card--chart .cap-eyebrow--star::before, .cap-shell .cap-rpage__card--poster .cap-eyebrow--star::before { content: "✦\00a0"; }
  .cap-shell .cap-rpage__card-icon { margin: var(--cap-space-gap-1) 0; }
  .cap-shell .cap-rpage__card-title { line-height: var(--cap-leading-serif-title); letter-spacing: normal; }
  .cap-shell .cap-rpage__card .cap-btn { font-size: var(--cap-mp-type-btn-band); letter-spacing: var(--cap-track-btn); line-height: var(--cap-leading-btn-small); padding: var(--cap-btn-pad-small); }
  .cap-shell .cap-rpage__card--chart .cap-rpage__card-btn { margin-top: var(--cap-space-gap-2); }
  /* the poster card is WHITE on the phone sheet: ink title, violet eyebrow, an ink pill */
  .cap-shell .cap-rpage__card--poster { padding: 0; gap: 0; background: var(--cap-color-surface); color: var(--cap-color-text); }
  .cap-shell .cap-rpage__card--poster .cap-rpage__eyebrow { color: var(--cap-color-primary); }
  .cap-shell .cap-rpage__card--poster .cap-btn { background: var(--cap-color-text); border-color: var(--cap-color-text); color: var(--cap-color-on-ink); margin-top: var(--cap-space-gap-1); }
  @media (hover: hover) { .cap-shell .cap-rpage__card--poster .cap-btn:hover { background: var(--cap-color-primary); border-color: var(--cap-color-primary); } }
  .cap-shell .cap-rpage__card-img { height: var(--cap-mp-poster-img-h); object-position: 50% 42%; }
  .cap-shell .cap-rpage__card-in { padding: var(--cap-space-block-3) var(--cap-space-block-4) var(--cap-space-block-4); gap: var(--cap-space-gap-5); }
  /* the daily card: the page ink, a halo rule, centred, a star each side, the rune icon, the buttons side by side */
  .cap-shell .cap-rpage__card--daily { background: var(--cap-color-text); border-color: var(--cap-color-line-halo); align-items: center; text-align: center; gap: var(--cap-space-gap-4); }
  .cap-shell .cap-rpage__card--daily .cap-eyebrow--star::after { content: "\00a0\00a0✦"; }
  .cap-shell .cap-rpage__daily-icon { height: var(--cap-mp-icon-band-tarot-h); margin: var(--cap-space-gap-4) 0; }
  .cap-shell .cap-rpage__card-actions { justify-content: center; gap: var(--cap-space-gap-5); margin-top: var(--cap-space-gap-4); }
  .cap-shell .cap-rpage__card-actions .cap-btn--primary { color: var(--cap-color-surface); }
  .cap-shell .cap-rpage__card-actions .cap-btn--secondary { padding: var(--cap-btn-pad-small-outlined); }   /* its colours: components .cap-btn--secondary.cap-btn--on-ink (round 23) */
  /* the strip: 24 above; "The runes · 25" + "All 25 →" on one line; the 24 stones and, after a vertical rule, the blank
     scroll in ONE row edge to edge, 16 under the line */
  .cap-shell .cap-rpage__deck { border-top: 0; padding: 0; margin-top: var(--cap-space-block-5); min-width: 0; }
  .cap-shell .cap-rpage__deck-head { justify-content: space-between; gap: var(--cap-space-gap-6); margin: 0; }
  .cap-shell .cap-rpage__deck-h { font-size: var(--cap-type-eyebrow-card); letter-spacing: var(--cap-track-meta); line-height: normal; white-space: nowrap; color: var(--cap-color-caption); }
  .cap-shell .cap-rpage__deck-sub, .cap-shell .cap-rpage__tile-sub { display: none; }   /* not on the phone sheet (neither showed on the phone before) */
  .cap-shell .cap-rpage__deck-all { display: inline; flex: none; font-family: var(--cap-font-ui); font-weight: 600; font-size: var(--cap-type-eyebrow-card); letter-spacing: var(--cap-track-meta); line-height: normal; text-transform: uppercase;
    color: var(--cap-color-text); text-decoration: none; border-bottom: var(--cap-border-hairline) solid var(--cap-color-primary); padding-bottom: var(--cap-space-gap-1); }
  @media (hover: hover) { .cap-shell .cap-rpage__deck-all:hover { color: var(--cap-color-primary); } }
  .cap-shell .cap-rpage__strip { display: flex; align-items: flex-start; gap: var(--cap-space-gap-5); overflow-x: auto; margin: var(--cap-space-gap-8) calc(-1 * var(--cap-page-x)) 0; padding: 0 var(--cap-page-x) var(--cap-space-gap-8); }   /* round 32 (owner 2026-10-06): 16 between the names and the scroll bar, so a two-line name never touches it (was 6) */
  .cap-shell .cap-rpage__tiles { display: contents; }
  .cap-shell .cap-rpage__tile { flex: none; width: var(--cap-rpage-tile-w); position: relative; }   /* position: holds the press-link inside the scroller */
  .cap-shell .cap-rpage__tile > :is(a, .cap-press), .cap-shell .cap-rpage__tile:is(a, .cap-press) { gap: var(--cap-space-gap-4); }
  .cap-shell .cap-rpage__tile-g { color: var(--cap-color-muted); }
  .cap-shell .cap-rpage__tile-name { font-size: var(--cap-type-eyebrow-card); letter-spacing: var(--cap-track-label); line-height: var(--cap-leading-serif-title); color: var(--cap-color-caption); padding-bottom: 0; border-bottom: 0; }
  .cap-shell .cap-rpage__tile[aria-current] .cap-rpage__tile-g, .cap-shell .cap-rpage__tile.is-current .cap-rpage__tile-g { border-color: var(--cap-color-primary); }
  .cap-shell .cap-rpage__tile[aria-current] .cap-rpage__tile-name, .cap-shell .cap-rpage__tile.is-current .cap-rpage__tile-name { padding-bottom: calc(var(--cap-space-gap-1) + var(--cap-border-hairline)); border-bottom: var(--cap-border-hairline) solid var(--cap-color-primary); }
  .cap-shell .cap-rpage__blank { flex: none; align-self: stretch; margin: 0 0 0 var(--cap-space-gap-2); padding: 0 0 0 calc(var(--cap-space-gap-2) + var(--cap-space-gap-5)); border-top: 0; border-left: var(--cap-border-hairline) solid var(--cap-color-divider-rune); display: block; }
  /* Also in the tarot: an ink box — the eyebrow on top, the card beside the name + essence, the footnote under a hairline */
  .cap-shell #tarot { margin-top: var(--cap-space-block-5); }
  .cap-shell .cap-rpage__tarot-body { grid-template-columns: var(--cap-mp-stone-xref-w) 1fr; column-gap: var(--cap-space-block-3); row-gap: 0; align-items: center; padding: var(--cap-space-block-3) var(--cap-space-field-cell-x); }
  .cap-shell .cap-rpage__tarot-text { display: contents; }
  .cap-shell .cap-rpage__tarot-eyebrow { grid-column: 1 / -1; grid-row: 1; margin-bottom: var(--cap-space-gap-7); font-size: var(--cap-type-eyebrow-card); letter-spacing: var(--cap-track-eyebrow); line-height: normal; }
  .cap-shell .cap-rpage__tarot-art { grid-column: 1; grid-row: 2 / span 2; width: var(--cap-mp-stone-xref-w); box-shadow: var(--cap-mp-shadow-card-xref); }
  .cap-shell .cap-rpage__tarot-name { grid-column: 2; grid-row: 2; align-self: end; font-size: var(--cap-type-name); letter-spacing: var(--cap-track-card-title); line-height: var(--cap-leading-ui); }
  :root body .cap-shell .cap-rpage .cap-rpage__tarot-essence { grid-column: 2; grid-row: 3; align-self: start; margin-top: var(--cap-space-gap-2); font-size: var(--cap-mp-type-card-lede-sm); line-height: var(--cap-leading-data); color: var(--cap-color-on-ink-3); }
  .cap-shell .cap-rpage__footnote { grid-column: 1 / -1; grid-row: 4; margin-top: var(--cap-space-gap-7); padding-top: var(--cap-space-gap-6); font-size: var(--cap-mp-type-footnote); line-height: var(--cap-leading-lede); }
}

/* "Correspondences" is a section label like "More spreads", at every width (D8b / D9b 1 Oct 2026, 2k / 2e 28 Sep):
   Barlow Condensed 500 · .1em · uppercase at the section step (20 desktop and tablet, 17 phone); desktop 32 under the reading
   and 24 to the table, the phone 30 and 12 (the column heads stay "Correspondence · Value"). */
.cap-shell #correspondences .cap-rpage__h2 { font-family: var(--cap-font-ui); font-weight: 500; font-size: var(--cap-type-section); line-height: var(--cap-leading-tight); letter-spacing: var(--cap-track-label); text-transform: uppercase; margin: var(--cap-space-section-head-above) 0 var(--cap-space-block-5); }
@media (max-width: 699px) {
  .cap-shell #correspondences { margin-top: var(--cap-space-block-6); }
  .cap-shell #correspondences .cap-rpage__h2 { line-height: normal; margin: 0 0 var(--cap-space-gap-6); }
}
/* C3 (owner 2026-10-01): the free-chart card's italic line, back at 700–1279 as T13 draws it (19 italic on 1.5, the
   secondary text colour on cream); desktop and phone keep D9b / 2e's card without it */
.cap-shell .cap-rpage__card-line { display: none; }
@media (min-width: 700px) and (max-width: 1279px) {
  .cap-shell .cap-rpage__card-line { display: block; font-family: var(--cap-font-serif); font-style: italic; font-weight: 400; font-size: var(--cap-type-lede-band); line-height: var(--cap-leading-lede); color: var(--cap-color-text-secondary); margin: 0; text-wrap: pretty; }
}

/* THE FOOTER GAP (owner 2026-10-02): from the last thing on the page to the footer, 64 from 700 up and 40 on a phone — the
   token's pair (--cap-space-footer-gap). Appended last so it wins over the page's earlier end spacing. */
@media (max-width: 699px) {
  .cap-shell .cap-rpage__grid { padding-bottom: var(--cap-space-footer-gap); }
}
@media (min-width: 700px) and (max-width: 1279px) {
  .cap-shell .cap-rpage__deck { padding-bottom: calc(var(--cap-space-footer-gap) - var(--cap-space-section-head-below)); }   /* the stone strip's own foot */
}

/* round 29 (owner 2026-10-05): the name on T12 / T13 sets its lines 1.0 apart (56 on 1) — it was 1.06 */
@media (min-width: 700px) and (max-width: 1279px) {
  .cap-shell .cap-rpage__h1 { line-height: var(--cap-leading-one); }
}

/* THE STONE STRIP'S SCROLL BAR (round 32, owner 2026-10-06): on the cream page the bar read white and nearly invisible — it is dark
   cream at every width the strip scrolls (below 1280). iOS draws a dark or a light scroll indicator from the scroller's own
   background, so the strip carries the page cream and says it is light; the other browsers take scrollbar-color / the thumb. */
@media (max-width: 1279px) {
  .cap-shell .cap-rpage__strip { background-color: var(--cap-color-bg); color-scheme: light; scrollbar-color: var(--cap-color-line-deep) transparent; }
  .cap-shell .cap-rpage__strip::-webkit-scrollbar { height: var(--cap-space-gap-3); }
  .cap-shell .cap-rpage__strip::-webkit-scrollbar-track { background: transparent; }
  .cap-shell .cap-rpage__strip::-webkit-scrollbar-thumb { background: var(--cap-color-line-deep); border-radius: var(--cap-radius-pill); }
}