/* ============================================================
 * draw.css — the six draw pages, ONE sheet for both kinds (0.51.314, the 23 Sep
 * Claude Design sheets: mobile 1g-1/2/3 · 1h · 1v-1/2 · 1y · 1w-0/1/2 · 1e-1/2 ·
 * 1t-1/2 · 1u-1/2; desktop D12-1/2 · D13 · D13a/b · D13c-1/2 · D10a/b · D11 ·
 * D11a/b · D11c-1/2). Enqueued by Capriastro_Draws wherever a draw shortcode
 * renders; the markup vocabulary is `cap-draw__*` with the kind (`--tarot` ink,
 * `--rune` cream) and the mode as modifiers on the root.
 *
 * The WELL is the fixed frame the script animates inside (210 css px on a phone,
 * 470 on desktop): the mobile tarot deck that deals into a fan of nine over a
 * dimmed 72 % leftover stack (cc-prompt-deck-to-fan.md), the desktop fan of every
 * card on one arc (`transform-origin 50% 160%`), or the field of 25 stones. The
 * script writes ONE `transform` per card and --cap-fan-r / --cap-fan-y for the
 * desktop arc; every size, shadow, radius and transition is here, from tokens.
 *
 * Token-only. The raw pixel values collected as --cap-draw-* at the top are the
 * widget geometry the design system has no token for (card, stone and well sizes).
 * ============================================================ */

.cap-shell .cap-draw {
  --cap-draw-card-w: 124px;          /* the desktop fan card (D12-1) */
  --cap-draw-card-h: 213px;
  --cap-draw-well-h: 470px;
  --cap-draw-card-bottom: 130px;
  --cap-draw-mid-w: 172px;           /* the yes/no card ladder (states.md §9: 124 → 172 → 260) */
  --cap-draw-mid-h: 296px;
  --cap-draw-big-w: 260px;           /* the revealed card (D13) */
  --cap-draw-big-h: 446px;
  --cap-draw-stone-w: 92px;          /* the field stone (D10a) */
  --cap-draw-stone-h: 115px;
  --cap-draw-stone-r: 43px / 53.6px;
  --cap-draw-stone-mid-w: 132px;     /* the yes/no stone (states.md §9: 92 → 132 → 176) */
  --cap-draw-stone-mid-h: 165px;
  --cap-draw-stone-mid-r: 62px / 77px;
  --cap-draw-stone-big-w: 176px;     /* the revealed stone (D11) */
  --cap-draw-stone-big-h: 220px;
  --cap-draw-stone-big-r: 82px / 102px;
  --cap-draw-col: 640px;             /* the desktop content column under the well */
  --cap-draw-shuffle-lift: 80px;     /* the desktop Shuffle pill rides up into the stage's empty band (D12-1) */
  --cap-draw-calc-icon: 100px;
  overflow-anchor: none;             /* the reveal moves the page on purpose; the browser's scroll anchoring must not move it again */
}
.cap-shell .cap-draw .cap-page { display: flex; flex-direction: column; align-items: center; }
.cap-shell .cap-draw .cap-page > * { width: 100%; }

/* ─── the two grounds ─────────────────────────────────────── */
.cap-shell .cap-draw--tarot { background: var(--cap-color-text); color: var(--cap-color-on-ink); }
.cap-shell .cap-draw--tarot .cap-eyebrow { color: var(--cap-color-primary-soft); }
.cap-shell .cap-draw--tarot .cap-lede { color: var(--cap-color-on-ink-2); }
.cap-shell .cap-draw--tarot .cap-caption { color: var(--cap-color-on-ink-muted); }
.cap-shell .cap-draw--tarot .cap-link { color: var(--cap-color-on-ink); }
@media (hover: hover) { .cap-shell .cap-draw--tarot .cap-link: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-draw--rune { background: var(--cap-color-bg); color: var(--cap-color-text); }

/* ─── hero (1g-1 / D12-1) ─────────────────────────────────── */
.cap-shell .cap-draw__hero {
  padding: var(--cap-space-after-header) var(--cap-page-x) 0;
  display: flex; flex-direction: column; align-items: center; text-align: center;
  gap: var(--cap-space-hero-step);
}
.cap-shell .cap-draw__h1 { font-family: var(--cap-font-display); font-weight: 800; font-size: var(--cap-type-xl); line-height: var(--cap-leading-hero-mid); letter-spacing: var(--cap-track-display); margin: 0; max-width: 20ch; color: inherit; }
.cap-shell .cap-draw__lede { font-size: var(--cap-type-lede-hero); line-height: var(--cap-leading-data); margin: 0; max-width: 46ch; transition: opacity var(--cap-ease-fast); }
.cap-shell .cap-draw__lede.is-fading { opacity: 0; }

/* the order of the blocks: the stones' Mix button sits ABOVE the field (1e-1 / D10a), the tarot Shuffle BELOW the fan (1g-2 / D12-1) */
.cap-shell .cap-draw__hero { order: 0; }
.cap-shell .cap-draw__back { order: 1; }
.cap-shell .cap-draw__prep { order: 2; }
.cap-shell .cap-draw__well { order: 3; }
.cap-shell .cap-draw--tarot .cap-draw__prep { order: 4; }
.cap-shell .cap-draw__cta { order: 5; }
.cap-shell .cap-draw__detail { order: 6; }
.cap-shell .cap-draw__more-spreads { order: 7; }
.cap-shell .cap-draw__after { order: 8; }
.cap-shell .cap-draw__browse { order: 9; }   /* D13: the Browse-all link closes the page, under the calculator card + the monthly line */

/* ─── "← Back to the deck" (1h / D13): revealed state only ── */
.cap-shell .cap-draw__back { display: none; justify-content: center; padding: var(--cap-space-lg) var(--cap-page-x) 0; }
.cap-shell .cap-draw.is-revealed .cap-draw__back { display: flex; }
.cap-shell .cap-draw .cap-draw__back-btn { cursor: pointer; background: none; color: var(--cap-color-text); font-size: var(--cap-type-draw-back); -webkit-user-select: text; user-select: text; }   /* D13 (25 Sep): 14 px; the words selectable like any link (a <button> is not, by default) */
 .cap-shell .cap-draw .cap-draw__back-btn:focus-visible { background: none; color: var(--cap-color-primary); }
@media (hover: hover) { .cap-shell .cap-draw .cap-draw__back-btn:hover { background: none; color: var(--cap-color-primary); } }
.cap-shell .cap-draw--tarot .cap-draw__back-btn { color: var(--cap-color-on-ink); }
 .cap-shell .cap-draw--tarot .cap-draw__back-btn:focus-visible { background: none; color: var(--cap-color-primary-soft); }
@media (hover: hover) { .cap-shell .cap-draw--tarot .cap-draw__back-btn:hover { background: none; color: var(--cap-color-primary-pale); } }   /* round 23: a link on ink turns the pale lilac (CD values: primary-pale = "link hover on ink") */

/* ─── Shuffle / Mix the stones ─────────────────────────────── */
.cap-shell .cap-draw__prep { display: flex; justify-content: center; padding: var(--cap-space-lg) var(--cap-page-x) 0; }
.cap-shell .cap-draw__prep.is-spent { visibility: hidden; }
.cap-shell .cap-draw--tarot .cap-draw__prep { padding-top: 0; margin-top: calc(var(--cap-draw-shuffle-lift) * -1); position: relative; z-index: 2; }
/* desktop: an outlined pill (the ghost button); a phone: the text link (1g-2 / 1e-1) */
.cap-shell .cap-draw .cap-draw__shuffle {
  display: inline-flex; align-items: center; justify-content: center; cursor: pointer;
  font-family: var(--cap-font-ui); font-weight: 600; font-size: var(--cap-type-btn); letter-spacing: var(--cap-track-btn); text-transform: uppercase; line-height: var(--cap-leading-ui);
  padding: var(--cap-btn-pad-s-outlined); border-radius: var(--cap-radius-pill); background: transparent;
  border: var(--cap-border-hairline) solid var(--cap-color-line-emphasis); color: var(--cap-color-text);
  transition: background var(--cap-ease-fast), color var(--cap-ease-fast), border-color var(--cap-ease-fast);
}
@media (hover: hover) { .cap-shell .cap-draw .cap-draw__shuffle:hover { border-color: var(--cap-color-text); } }
.cap-shell .cap-draw--tarot .cap-draw__shuffle { border-color: var(--cap-color-line-on-ink-3); color: var(--cap-color-on-ink); }
@media (hover: hover) { .cap-shell .cap-draw--tarot .cap-draw__shuffle:hover { border-color: var(--cap-color-line-on-ink-hover); } }
.cap-shell .cap-draw.is-revealed .cap-draw__prep { display: none; }

/* ─── the well ─────────────────────────────────────────────── */
.cap-shell .cap-draw__well { position: relative; }
.cap-shell .cap-draw.is-revealed .cap-draw__well { display: none; }
/* the Elementor kit paints bare `button` at (0,2,1) — every rule that has to beat it is one class deeper */
.cap-shell .cap-draw .cap-draw__well button { background: none; border: 0; padding: 0; cursor: pointer; -webkit-tap-highlight-color: transparent; }

/* the tarot fan / deck */
.cap-shell .cap-draw__fan { height: var(--cap-draw-well-h); margin: 0 var(--cap-page-x); overflow: hidden; }
.cap-shell .cap-draw .cap-draw__fan .cap-draw__fan-card {
  position: absolute; left: 50%; bottom: var(--cap-draw-card-bottom);
  width: var(--cap-draw-card-w); height: var(--cap-draw-card-h); margin-left: calc(var(--cap-draw-card-w) / -2);
  transform-origin: 50% var(--cap-fan-origin, 160%);   /* the tablet moves the pivot down (draws.js fanOrigin) */
  /* --cap-draw-dx/dy/dr: the desktop shuffle's scatter (draws.js), zero at rest */
  transform: translate(var(--cap-draw-dx, 0px), var(--cap-draw-dy, 0px)) rotate(calc(var(--cap-fan-r, 0deg) + var(--cap-draw-dr, 0deg))) translateY(var(--cap-fan-y, 0px));
  border-radius: var(--cap-radius-card-face-s); overflow: hidden;
  background: var(--cap-color-stone-sel-1);
  box-shadow: var(--cap-shadow-tile-ink);
  transition: transform var(--cap-ease-fast), box-shadow var(--cap-ease-fast), filter var(--cap-ease-fast);
}
.cap-shell .cap-draw .cap-draw__fan .cap-draw__fan-card img { display: block; width: 100%; height: 100%; object-fit: cover; }
.cap-shell .cap-draw .cap-draw__fan.is-shuffling .cap-draw__fan-card { transition: none; pointer-events: none; }   /* the three beats are script animations; no CSS transition may ride along */
/* hover on a card (owner spec 2026-09-23): a 10 px lift along its own angle in 150 ms and a faint glow; neighbours still.
   PICKED BEATS HOVER (owner 2026-09-23): once a card is picked (`has-pick` on the root) no card in the fan hovers — a
   still cursor keeps `:hover` alive, and this rule outranks `.picked` by specificity, so the picked card would drop back
   to its slot until the cursor left */
/* the lift is for a pointer that hovers: a finger's tap leaves `:hover` stuck on the card for a moment, and the lift then
   dropped back as the pick began — the "wobble" on phones (owner 2026-10-03); the keyboard keeps it everywhere */
@media (hover: hover) {
  .cap-shell .cap-draw:not(.has-pick) .cap-draw__fan.is-fan .cap-draw__fan-card:hover {
    transform: rotate(var(--cap-fan-r, 0deg)) translateY(calc(var(--cap-fan-y, 0px) - var(--cap-space-gap-5)));
    box-shadow: var(--cap-shadow-tile-ink), var(--cap-shadow-halo);
  }
}
.cap-shell .cap-draw:not(.has-pick) .cap-draw__fan.is-fan .cap-draw__fan-card:focus-visible {
  transform: rotate(var(--cap-fan-r, 0deg)) translateY(calc(var(--cap-fan-y, 0px) - var(--cap-space-gap-5)));
  box-shadow: var(--cap-shadow-tile-ink), var(--cap-shadow-halo);
}
/* round 23 ruling 11 (owner): the hovered / focused card lifts a little out of the fan IN ITS OWN PLACE — it keeps its
   place in the stacking order (it had z-index 5, which brought it to the top of the fan), and keyboard focus looks exactly
   like hover (the extra ring is gone; the lift + glow is the focus mark). Hover is not the picked state (.picked below). */
.cap-shell .cap-draw .cap-draw__fan { perspective: 1000px; }   /* the Turn's flip on the Y axis */
.cap-shell .cap-draw .cap-draw__fan.is-gathered .cap-draw__fan-card { box-shadow: var(--cap-shadow-card-buried); }   /* the gather: the shadows fade to one */
.cap-shell .cap-draw .cap-draw__fan.is-gathered .cap-draw__fan-card:last-child { box-shadow: var(--cap-shadow-tile-ink); }
.cap-shell .cap-draw .cap-draw__fan .cap-draw__fan-card:focus-visible { outline: none; }
/* chosen (D12-2): straight (0°), 30 px above the fan's baseline at the centre, the glow — no stroke; the fan's gap stays
   open and its siblings do not dim; the card arrives there by the pick animation (draws.js), never by a jump */
.cap-shell .cap-draw .cap-draw__fan .cap-draw__fan-card.picked {
  transform: translateY(calc(var(--cap-space-primary-air) * -1));
  box-shadow: var(--cap-shadow-card-chosen); z-index: 6; pointer-events: none;
  transition: box-shadow var(--cap-ease-fast);
}
@media (hover: hover) { .cap-shell .cap-draw .cap-draw__fan.is-fan .cap-draw__fan-card.picked:hover {
  transform: translateY(calc(var(--cap-space-primary-air) * -1));
  box-shadow: var(--cap-shadow-card-chosen); z-index: 6; pointer-events: none;
  transition: box-shadow var(--cap-ease-fast);
} }
.cap-shell .cap-draw .cap-draw__fan .cap-draw__fan-card.picked.is-inverted img { transform: rotate(180deg); }
/* the Shuffle pill while the three beats run */
.cap-shell .cap-draw .cap-draw__shuffle:disabled { opacity: var(--cap-opacity-disabled); cursor: not-allowed; }   /* states.md: .45, not-allowed */
.cap-shell .cap-draw .cap-draw__fan .cap-draw__fan-card.dim { opacity: var(--cap-opacity-dim); pointer-events: none; }
.cap-shell .cap-draw--tarot .cap-draw__fan .cap-draw__fan-card.dim { opacity: 1; }   /* the tarot fan never dims (states.md §10); the daily's locked well dims below */
.cap-shell .cap-draw.is-deck-state .cap-draw__fan .cap-draw__fan-card.dim,
.cap-shell .cap-draw--tarot.cap-draw--daily .cap-draw__fan .cap-draw__fan-card.dim { opacity: var(--cap-opacity-dim); }

/* the stone field (D10a: 9 across at 92 × 115, 24 gap; the last row centres itself) */
.cap-shell .cap-draw__field {
  margin: var(--cap-space-lg) auto 0; display: flex; flex-wrap: wrap; justify-content: center;
  gap: var(--cap-gutter) var(--cap-gutter); padding: 0 var(--cap-page-x);
  max-width: calc(var(--cap-draw-stone-w) * 9 + var(--cap-gutter) * 8 + var(--cap-page-x) * 2);
}
.cap-shell .cap-draw .cap-draw__field button {
  display: block; width: var(--cap-draw-stone-w); height: var(--cap-draw-stone-h);
  transform: translate(var(--cap-draw-dx, 0px), var(--cap-draw-dy, 0px)) rotate(var(--cap-draw-dr, 0deg));
  transition: opacity var(--cap-ease);
}
.cap-shell .cap-draw .cap-draw__field.is-shuffling button { transition: transform var(--cap-ease-shuffle); pointer-events: none; }
.cap-shell .cap-rune-stone {
  display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; container-type: size;
  border-radius: var(--cap-draw-stone-r);
  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-stone);
  transition: transform var(--cap-ease-fast), box-shadow var(--cap-ease), filter var(--cap-ease-fast);
}
.cap-shell .cap-rune-stone__face { font-family: var(--cap-font-rune); font-size: calc(100cqh * var(--cap-rune-glyph)); line-height: 1; color: var(--cap-color-primary-pale); }   /* THE RUNE GLYPH RULE (owner 2026-10-03): 30 % of the stone's height — the stone is the container (container-type: size), --cap-rune-glyph = .341 em per stone height */
/* HOVER (owner spec 2026-09-25): desktop only — the stone under the cursor lifts 6 px and brightens a little in 150 ms;
   its neighbours stay still. Keyboard focus shows the same state at every width. */
.cap-shell .cap-draw .cap-draw__field .cap-rune-stone { transition: transform var(--cap-ease-stone-hover), box-shadow var(--cap-ease-stone-hover), filter var(--cap-ease-stone-hover); }
@media (hover: hover) and (min-width: 700px) {
  .cap-shell .cap-draw .cap-draw__field:not(.has-chosen):not(.is-mixing) button:hover .cap-rune-stone { transform: translateY(var(--cap-lift-stone)); box-shadow: var(--cap-shadow-stone-hover); filter: brightness(1.08); }
}
.cap-shell .cap-draw .cap-draw__field:not(.has-chosen) button:focus-visible .cap-rune-stone { transform: translateY(var(--cap-lift-stone)); box-shadow: var(--cap-shadow-stone-hover); }
.cap-shell .cap-draw .cap-draw__field button:focus-visible { outline: 0; }
/* chosen (D10b): level, the glow, brightened; the other 24 dim to .35 and recover on hover */
.cap-shell .cap-draw .cap-draw__field button.picked .cap-rune-stone { transform: none; box-shadow: var(--cap-shadow-stone-chosen); filter: brightness(1.15); }
@media (hover: hover) { .cap-shell .cap-draw .cap-draw__field button.picked:hover .cap-rune-stone { transform: none; box-shadow: var(--cap-shadow-stone-chosen); filter: brightness(1.15); } }
.cap-shell .cap-draw .cap-draw__field button.dim { opacity: var(--cap-opacity-dim); }
@media (hover: hover) { .cap-shell .cap-draw .cap-draw__field button.dim:hover { opacity: 1; } }
.cap-shell .cap-draw.is-revealed .cap-draw__field button.dim,
.cap-shell .cap-draw--daily .cap-draw__field:not(.has-chosen) button.dim { pointer-events: none; }   /* the daily's LOCKED well */
/* MIX: the three beats are script animations — no CSS transition rides along, nothing is clickable; in the heap the
   drop shadows merge into the one under the pile */
.cap-shell .cap-draw .cap-draw__field.is-mixing button { transition: none; pointer-events: none; }
.cap-shell .cap-draw .cap-draw__field.is-heaped .cap-rune-stone { box-shadow: var(--cap-shadow-card-buried); }
/* PICK: the chosen stone rides above the field; the other 24 sink 4 px and fade to .35 over the pick's 500 ms.
   RE-PICK (CD, owner 2026-09-25): until Turn, every dimmed stone stays clickable and returns to full strength under the
   cursor; a click moves the glow there at once (no animation on the glow), the old stone dims with the rest; a click on
   the glowing stone turns it, like "Turn the stone →". */
.cap-shell .cap-draw .cap-draw__field button.picked { position: relative; z-index: 2; }
.cap-shell .cap-draw .cap-draw__field.has-chosen button { transition: opacity var(--cap-ease-stone-pick); }
.cap-shell .cap-draw .cap-draw__field.has-chosen button.dim { opacity: var(--cap-opacity-dim); }
@media (hover: hover) { .cap-shell .cap-draw .cap-draw__field.has-chosen button.dim:hover { opacity: 1; } }
.cap-shell .cap-draw .cap-draw__field.has-chosen button.picked { transition: none; }
.cap-shell .cap-draw .cap-draw__field.has-chosen button.picked .cap-rune-stone { transition: none; }
.cap-shell .cap-draw .cap-draw__field.has-chosen button.dim .cap-rune-stone { transform: translateY(var(--cap-sink-stone)); transition: transform var(--cap-ease-stone-pick); }
/* reduced motion: no travel — the states swap on a 150 ms fade */
.cap-shell .cap-draw__field.is-xfade { opacity: 0; transition: opacity var(--cap-ease-stone-quiet); }
.cap-shell .cap-draw__field { transition: opacity var(--cap-ease-stone-quiet); }
@media (prefers-reduced-motion: reduce) {
  .cap-shell .cap-draw .cap-draw__field.has-chosen button { transition: opacity var(--cap-ease-stone-quiet); }
  .cap-shell .cap-draw .cap-draw__field.has-chosen button.dim .cap-rune-stone,
  .cap-shell .cap-draw .cap-draw__field .cap-rune-stone { transform: none; transition: opacity var(--cap-ease-stone-quiet); }
  .cap-shell .cap-draw--rune.is-revealed .cap-draw__reveal { animation: cap-draw-fade var(--cap-ease-stone-quiet) both; }   /* the reveal fades in, it does not rise */
}
@keyframes cap-draw-fade { from { opacity: 0; } to { opacity: 1; } }
.cap-shell .cap-rune-stone.is-chosen {
  background: radial-gradient(70% 62% at 46% 38%, var(--cap-color-stone-sel-1) 0%, var(--cap-color-stone-sel-2) 46%, var(--cap-color-stone-sel-3) 82%, var(--cap-color-stone-sel-4) 100%);
}
.cap-shell .cap-draw .cap-draw__field button.picked.is-inverted .cap-rune-stone__face,
.cap-shell .cap-draw__item.is-inverted .cap-rune-stone__face { transform: rotate(180deg); }

/* ─── the CTA row under the well ──────────────────────────── */
.cap-shell .cap-draw__cta { display: flex; flex-direction: column; align-items: center; gap: var(--cap-space-gap-6); padding: var(--cap-space-lg) var(--cap-page-x) 0; }
.cap-shell .cap-draw .cap-draw__deal { max-width: var(--cap-col-form); }
.cap-shell .cap-draw .cap-draw__turn { display: inline-flex; opacity: 0; visibility: hidden; transition: opacity var(--cap-ease), visibility var(--cap-ease); }
.cap-shell .cap-draw.has-pick .cap-draw__turn { opacity: 1; visibility: visible; }
.cap-shell .cap-draw--tarot .cap-draw__turn { background: var(--cap-color-bg); color: var(--cap-color-text); border-color: var(--cap-color-bg); }
@media (hover: hover) { .cap-shell .cap-draw--tarot .cap-draw__turn:hover:not(:disabled) { background: var(--cap-color-primary); color: var(--cap-color-bg); border-color: var(--cap-color-primary); } }
.cap-shell .cap-draw--tarot .cap-draw__turn:disabled { background: var(--cap-color-bg); color: var(--cap-color-text); }
.cap-shell .cap-draw .cap-draw__caption { text-align: center; }
.cap-shell .cap-draw .cap-draw__alert { align-self: stretch; text-align: left; }   /* a failed reveal: the 2g-4 alert box across the column (owner 2026-09-29) */
.cap-shell .cap-draw.is-revealed .cap-draw__cta { display: none; }

/* ─── THE RUNE DRAWS, desktop (D10a · D10b, owner 2026-09-25 — every rune draw: the daily, Yes/No, one rune) ───
   The lede on one line at 24; "Mix the stones" the small button; "Turn the stone" stands under the field from the start,
   disabled (the ink button at its disabled opacity — the sheet's grey), and turns ink when a stone is picked; 40 above
   it, 16 to the caption. Measured against the sheets at 1440. */
@media (min-width: 700px) {
  .cap-shell .cap-draw--rune .cap-draw__lede { font-size: var(--cap-type-lede-hero); max-width: none; }   /* 22 at opsz 14 = D10a (24 matched only at auto opsz) */
  .cap-shell .cap-draw--rune .cap-draw__shuffle { padding: var(--cap-btn-pad-small); }
  .cap-shell .cap-draw--rune .cap-draw__prep { padding-top: calc(var(--cap-space-lg) - var(--cap-space-gap-6)); }   /* 20 under the lede */
  .cap-shell .cap-draw--rune .cap-draw__turn { opacity: 1; visibility: visible; transition: opacity var(--cap-ease-stone-quiet), background var(--cap-ease-stone-quiet); }
  .cap-shell .cap-draw--rune .cap-draw__turn:disabled { opacity: var(--cap-opacity-disabled); }   /* the grey of the sheet until a stone is picked */
  .cap-shell .cap-draw--rune .cap-draw__cta { padding-top: var(--cap-space-panel-pad); gap: var(--cap-space-gap-8); }
  /* More spreads 48 under the caption, the browse link 42 under the cards; the cards 24 · 24 · 20 with the line 8 under the headline, the
     line at 20; the link's underline 2 under the words */
  .cap-shell .cap-draw--rune .cap-draw__more-spreads { padding-top: var(--cap-space-rune-more-top); }
  .cap-shell .cap-draw--rune .cap-draw__tile { padding: var(--cap-gutter) var(--cap-gutter) var(--cap-space-field-x); gap: var(--cap-space-gap-4); }
  .cap-shell .cap-draw--rune .cap-draw__tile-k { line-height: var(--cap-leading-tight); }
  .cap-shell .cap-draw--rune .cap-draw__tile-s { font-size: var(--cap-type-section); line-height: var(--cap-leading-data); }
  .cap-shell .cap-draw--rune .cap-draw__browse { padding-top: var(--cap-space-rune-browse-top); }
  .cap-shell .cap-draw--rune .cap-draw__browse .cap-link { font-size: var(--cap-type-sm); }   /* the line + padding are the sitewide link's now (this was the template) */
}

/* ─── the reveal (1h / 1w-2 / 1y · D13 / D13c-2 / D13b) ───── */
.cap-shell .cap-draw__detail { display: none; flex-direction: column; align-items: center; width: 100%; max-width: min(var(--cap-draw-col), calc(100% - 2 * var(--cap-page-x)));   /* the column never wider than the window less its insets (round 20: at 700–751 the 640 + 2 × 56 ran 52 px past the window) */ margin: 0 auto; padding: 0 var(--cap-page-x); box-sizing: content-box; }
.cap-shell .cap-draw.is-revealed .cap-draw__detail { display: flex; }
.cap-shell .cap-draw__reveal {
  width: 100%; margin-top: var(--cap-space-lg); padding: var(--cap-space-lg) 0 0;
  border-top: var(--cap-border-hairline) solid var(--cap-color-line);
  display: flex; flex-direction: column; align-items: center; text-align: center; gap: var(--cap-space-gap-7);
}
.cap-shell .cap-draw--tarot .cap-draw__reveal { border-top-color: var(--cap-color-line-on-ink-2); }
/* the question modes box the reveal with a rule above AND below (1w-2 / 1y / 1u-2) */
.cap-shell .cap-draw--yesno .cap-draw__reveal,
.cap-shell .cap-draw--one .cap-draw__reveal { border-bottom: var(--cap-border-hairline) solid var(--cap-color-line); padding-bottom: var(--cap-space-lg); }
.cap-shell .cap-draw--tarot.cap-draw--yesno .cap-draw__reveal,
.cap-shell .cap-draw--tarot.cap-draw--one .cap-draw__reveal { border-bottom-color: var(--cap-color-line-on-ink-2); }
@keyframes cap-draw-up { from { opacity: 0; transform: translateY(var(--cap-space-md)); } to { opacity: 1; transform: none; } }
.cap-shell .cap-draw.is-revealed .cap-draw__reveal { animation: cap-draw-up var(--cap-ease-shuffle) both; }
/* THE FLIP (owner spec 2026-09-23): one two-faced card on the viewport — the back and the drawn face, backface-visibility
   hidden on both, the face pre-turned 180° so it is the side seen from 90° on. It carries the reveal card's own size,
   radius and shadow, so at 180° it is indistinguishable from the card it hands over to. While it flies the panel does
   not play its own entrance (the text fades in after the landing, 200 ms, in the script). */
.cap-shell .cap-draw.is-flipping .cap-draw__reveal, .cap-shell .cap-draw.is-flipped .cap-draw__reveal { animation: none; }
.cap-shell .cap-draw__flip { position: fixed; z-index: 50; margin: 0; pointer-events: none; transform-style: preserve-3d; transform-origin: 50% 50%; will-change: transform; }
.cap-shell .cap-draw__flip-face { position: absolute; inset: 0; display: block; overflow: hidden; border-radius: var(--cap-radius-card-face-l); background: var(--cap-color-bg); box-shadow: var(--cap-shadow-card-art); backface-visibility: hidden; -webkit-backface-visibility: hidden; }
.cap-shell .cap-draw__flip--mid .cap-draw__flip-face { border-radius: var(--cap-radius-card-face-m); box-shadow: var(--cap-shadow-card-on-ink); }
.cap-shell .cap-draw__flip-face--front { transform: rotateY(180deg); }
.cap-shell .cap-draw__flip-face img { display: block; width: 100%; height: 100%; object-fit: cover; }
/* the stone's turn (owner spec 2026-09-25): two faces, the blank back and the glyph front, turned on the HORIZONTAL axis */
.cap-shell .cap-draw__flip-stone { position: absolute; inset: 0; display: block; backface-visibility: hidden; -webkit-backface-visibility: hidden; }
.cap-shell .cap-draw__flip-stone--front { transform: rotateX(180deg); }
.cap-shell .cap-draw__flip-face--front.is-inverted img { transform: rotate(180deg); }
/* the item: the revealed card (196 × 336 / 260 × 446), the yes/no card (100 × 172 / 172 × 296), the stone */
.cap-shell .cap-draw__card-lg { display: block; width: var(--cap-draw-big-w); height: var(--cap-draw-big-h); border-radius: var(--cap-radius-card-face-l); overflow: hidden; background: var(--cap-color-bg); box-shadow: var(--cap-shadow-card-art); margin-bottom: var(--cap-space-gap-5); }
.cap-shell .cap-draw__card-lg img { display: block; width: 100%; height: 100%; object-fit: cover; }
.cap-shell .cap-draw__card-lg.is-inverted img { transform: rotate(180deg); }
.cap-shell .cap-draw--yesno .cap-draw__card-lg { width: var(--cap-draw-mid-w); height: var(--cap-draw-mid-h); border-radius: var(--cap-radius-card-face-m); box-shadow: var(--cap-shadow-card-on-ink); }
.cap-shell .cap-rune-stone--big { width: var(--cap-draw-stone-big-w); height: var(--cap-draw-stone-big-h); border-radius: var(--cap-draw-stone-big-r); box-shadow: var(--cap-shadow-hub-card), var(--cap-shadow-stone); margin-bottom: var(--cap-space-gap-5); }
.cap-shell .cap-rune-stone--big .cap-rune-stone__face { font-size: calc(100cqh * var(--cap-rune-glyph)); text-shadow: 0 0 var(--cap-space-lg) var(--cap-color-halo); }
.cap-shell .cap-draw--yesno .cap-rune-stone--big { width: var(--cap-draw-stone-mid-w); height: var(--cap-draw-stone-mid-h); border-radius: var(--cap-draw-stone-mid-r); }
.cap-shell .cap-draw--yesno .cap-rune-stone--big .cap-rune-stone__face { font-size: calc(100cqh * var(--cap-rune-glyph)); }
/* the text column */
.cap-shell .cap-draw__text { display: flex; flex-direction: column; align-items: center; gap: var(--cap-space-gap-7); width: 100%; }
/* the yes/no reveal (1w-2 / 1u-2 / D13c-2 / D11c-2): the VERDICT WORD stands above the card or stone — the text column
   dissolves into the reveal's own flex column so the verdict can order before the item */
.cap-shell .cap-draw--yesno .cap-draw__text { display: contents; }
.cap-shell .cap-draw--yesno .cap-draw__verdict { order: -1; }
.cap-shell .cap-draw__verdict { font-family: var(--cap-font-display); font-weight: 800; font-size: var(--cap-type-draw-verdict); line-height: var(--cap-leading-display); letter-spacing: var(--cap-track-tight); color: inherit; }
.cap-shell .cap-draw__name { font-family: var(--cap-font-ui); font-weight: 500; font-size: var(--cap-type-draw-name); line-height: var(--cap-leading-display); letter-spacing: var(--cap-track-name); text-transform: uppercase; color: inherit; }
.cap-shell .cap-draw__name--sm { font-size: var(--cap-type-name); line-height: var(--cap-leading-ui); }
/* the ONE line under the name (owner 2026-09-27): "Major Arcana VI · Upright" · "Elder Futhark 15 · Merkstave", capitals, both kinds */
.cap-shell .cap-draw__cap { font-family: var(--cap-font-ui); font-weight: 500; font-size: var(--cap-type-caption); letter-spacing: var(--cap-track-caption); color: var(--cap-color-muted); }
.cap-shell .cap-draw__cap { text-transform: uppercase; }
.cap-shell .cap-draw--tarot .cap-draw__cap { color: var(--cap-color-on-ink-muted); }
.cap-shell .cap-draw__cap:empty { display: none; }
/* on the cream rune pages the line takes the caption grey (D11 · D11b · D11c-2, 27 Sep) */
.cap-shell .cap-draw--rune .cap-draw__cap { color: var(--cap-color-caption); }
.cap-shell .cap-draw__reason { font-family: var(--cap-font-serif); font-style: italic; font-weight: 500; font-size: var(--cap-type-lede-hero); line-height: var(--cap-leading-data); color: var(--cap-color-text-secondary); margin: 0; max-width: 46ch; }
.cap-shell .cap-draw--tarot .cap-draw__reason { color: var(--cap-color-on-ink-2); }
.cap-shell .cap-draw__reason:empty { display: none; }
.cap-shell .cap-draw__text :is(p, .cap-draw__reason) { text-wrap: pretty; }   /* the reveal is put on the page after load: no word alone on its last line there either (owner 2026-10-01) */
.cap-shell .cap-draw .cap-draw__more { margin-top: var(--cap-space-sm); font-size: var(--cap-type-draw-more); }   /* D13 (25 Sep): 13 px */
/* the question draw's body (D13b / 1t-2): left-aligned paragraphs, then Love · Career & Money on a rule each */
.cap-shell .cap-draw__body { width: 100%; text-align: left; display: flex; flex-direction: column; gap: var(--cap-space-gap-7); margin-top: var(--cap-space-gap-5); }
.cap-shell .cap-draw__body p { 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-draw--tarot .cap-draw__body p { color: var(--cap-color-on-ink-3); }
.cap-shell .cap-draw__cell { border-top: var(--cap-border-hairline) solid var(--cap-color-line); padding-top: var(--cap-space-md); display: flex; flex-direction: column; gap: var(--cap-space-gap-3); }
.cap-shell .cap-draw--tarot .cap-draw__cell { border-top-color: var(--cap-color-line-on-ink-2); }
.cap-shell .cap-draw__cell-k { font-family: var(--cap-font-ui); font-weight: 600; font-size: var(--cap-type-section); letter-spacing: var(--cap-track-feature); text-transform: uppercase; color: inherit; }
/* the draw-lock row (1h / D13) */
.cap-shell .cap-draw__lock {
  width: 100%; margin-top: var(--cap-space-lg); padding: var(--cap-space-md) 0;
  border-top: var(--cap-border-hairline) solid var(--cap-color-line); border-bottom: var(--cap-border-hairline) solid var(--cap-color-line);
  display: flex; justify-content: center; align-items: baseline; gap: var(--cap-space-gap-5); white-space: nowrap;
  font-family: var(--cap-font-ui); font-weight: 500; font-size: var(--cap-type-caption); letter-spacing: var(--cap-track-caption); text-transform: uppercase; color: var(--cap-color-muted);
}
.cap-shell .cap-draw__lock b { font-weight: 500; color: var(--cap-color-text); }
.cap-shell .cap-draw--tarot .cap-draw__lock { border-color: var(--cap-color-line-on-ink-2); color: var(--cap-color-on-ink-muted); }
.cap-shell .cap-draw--tarot .cap-draw__lock b { color: var(--cap-color-on-ink); }
.cap-shell .cap-draw__lock-sep { color: var(--cap-color-primary); font-size: var(--cap-type-badge); letter-spacing: 0; }
/* the button after the reveal + its caption */
.cap-shell .cap-draw .cap-draw__again { margin-top: var(--cap-space-lg); width: auto; }
.cap-shell .cap-draw__detail > .cap-caption { margin-top: var(--cap-space-gap-6); text-align: center; }

/* ─── More spreads (1h / D13) ──────────────────────────────── */
.cap-shell .cap-draw__more-spreads { width: 100%; max-width: min(var(--cap-draw-col), calc(100% - 2 * var(--cap-page-x)));   /* the column never wider than the window less its insets (round 20: at 700–751 the 640 + 2 × 56 ran 52 px past the window) */ margin: 0 auto; padding: var(--cap-space-primary-air) var(--cap-page-x) 0; box-sizing: content-box; display: flex; flex-direction: column; gap: var(--cap-space-gap-7); }
.cap-shell .cap-draw.is-revealed .cap-draw__more-spreads { padding-top: var(--cap-space-primary-air); }
.cap-shell .cap-draw__more-h { font-family: var(--cap-font-ui); font-weight: 500; font-size: var(--cap-type-section); letter-spacing: var(--cap-track-label); text-transform: uppercase; color: inherit; margin: 0; }
.cap-shell .cap-draw__tiles { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: var(--cap-space-tile-gap-x); }
.cap-shell .cap-draw__tile {
  display: flex; flex-direction: column; gap: var(--cap-space-sm); padding: var(--cap-space-gap-8) var(--cap-space-gap-8); min-width: 0;
  background: var(--cap-color-surface); border: var(--cap-border-hairline) solid var(--cap-color-line-strong); text-decoration: none; color: inherit;
  transition: box-shadow var(--cap-ease), border-color var(--cap-ease);
}
.cap-shell .cap-draw--tarot .cap-draw__tile { background: var(--cap-color-ink-raised); border-color: var(--cap-color-line-halo-soft); }
/* THE CARD HOVER (D13, owner 2026-09-24; the border dropped 2026-09-29 — hover is the glow alone, the ring is the keyboard's): the violet glow, on cream and on ink alike — the text
   and the fill never react. The tile pins its own colour in every state: the bare `.cap-shell a:hover` (0,2,1) had
   turned the ink tile's text ink-on-ink. */
.cap-shell .cap-draw .cap-draw__tile,
.cap-shell .cap-draw .cap-draw__tile:focus-visible { color: inherit; }
@media (hover: hover) { .cap-shell .cap-draw .cap-draw__tile:hover { color: inherit; } }
@media (hover: hover) { .cap-shell .cap-draw .cap-draw__tile:hover { box-shadow: var(--cap-shadow-halo); } }   /* hover = the glow, never a stroke (owner 2026-09-29) */
.cap-shell .cap-draw .cap-draw__tile:focus-visible { outline: var(--cap-ring, var(--cap-focus-ring)); outline-offset: var(--cap-focus-ring-offset); }
.cap-shell .cap-draw__tile-k { font-family: var(--cap-font-ui); font-weight: 600; font-size: var(--cap-type-tile-label); letter-spacing: var(--cap-track-label); text-transform: uppercase; }
.cap-shell .cap-draw__tile-s { font-family: var(--cap-font-serif); font-style: italic; font-size: var(--cap-type-tile-sub); color: var(--cap-color-muted); }
.cap-shell .cap-draw--tarot .cap-draw__tile-s { color: var(--cap-color-on-ink-muted); }

/* ─── Browse all N ─────────────────────────────────────────── */
.cap-shell .cap-draw__browse { display: flex; flex-wrap: wrap; justify-content: center; gap: var(--cap-space-md) var(--cap-space-lg); padding: var(--cap-space-primary-air) var(--cap-page-x) var(--cap-space-band-close); }

/* ─── the calculator card + the monthly line (revealed only; 1h / D13) ── */
.cap-shell .cap-draw__after { display: none; width: 100%; max-width: min(var(--cap-draw-col), calc(100% - 2 * var(--cap-page-x)));   /* the column never wider than the window less its insets (round 20: at 700–751 the 640 + 2 × 56 ran 52 px past the window) */ margin: 0 auto; padding: 0 var(--cap-page-x) var(--cap-space-band-close); box-sizing: content-box; flex-direction: column; align-items: flex-start; gap: var(--cap-space-lg); }
.cap-shell .cap-draw.is-revealed .cap-draw__after { display: flex; }
.cap-shell .cap-draw__calc { width: 100%; background: var(--cap-color-ink-raised); border: var(--cap-border-hairline) solid var(--cap-color-line-halo-soft); padding: var(--cap-space-lg); display: grid; grid-template-columns: var(--cap-draw-calc-icon) 1fr; gap: var(--cap-space-lg); align-items: center; color: var(--cap-color-on-ink); }
.cap-shell .cap-draw--rune .cap-draw__calc { background: var(--cap-color-text); border-color: var(--cap-color-text); }
.cap-shell .cap-draw__calc-icon { display: block; width: var(--cap-draw-calc-icon); height: var(--cap-draw-calc-icon); }
.cap-shell .cap-draw__calc-icon--m { display: none; }
.cap-shell .cap-draw__calc-body { display: flex; flex-direction: column; align-items: flex-start; gap: var(--cap-space-md); min-width: 0; }
.cap-shell .cap-draw__calc-h { font-family: var(--cap-font-display); font-weight: 800; font-size: var(--cap-type-product-tile); line-height: var(--cap-leading-ui); letter-spacing: var(--cap-track-tight); color: var(--cap-color-on-ink-heading); margin: 0; }
.cap-shell .cap-draw__calc-lede { 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-3); margin: 0; }
.cap-shell .cap-draw .cap-draw__calc-btn { margin-top: var(--cap-space-sm); }
.cap-shell .cap-draw__month { display: flex; flex-wrap: wrap; align-items: baseline; gap: var(--cap-space-sm); margin: 0; }
.cap-shell .cap-draw__month-sep { color: var(--cap-color-muted); }
.cap-shell .cap-draw--tarot .cap-draw__month-sep { color: var(--cap-color-on-ink-muted); }


/* ─── tablet + phone: the tablet inset (56) from 1279 down; the phone block resets it below 700 ─── */
@media (max-width: 1279px) {
  .cap-shell .cap-draw__hero, .cap-shell .cap-draw__cta, .cap-shell .cap-draw__detail, .cap-shell .cap-draw__more-spreads, .cap-shell .cap-draw__browse, .cap-shell .cap-draw__after, .cap-shell .cap-draw__back, .cap-shell .cap-draw__prep { padding-left: var(--cap-page-x-mid); padding-right: var(--cap-page-x-mid); }
  .cap-shell .cap-draw__fan { margin-left: var(--cap-page-x-mid); margin-right: var(--cap-page-x-mid); }
  .cap-shell .cap-draw__field { padding-left: var(--cap-page-x-mid); padding-right: var(--cap-page-x-mid); }
}

/* ─── tablet 700–1279 (T22 / T23, owner 2026-10-01) ─────────────
   The rune field: 72 × 90 stones, 24 apart, 7 · 7 · 7 · 4; one tap turns the stone (draws.js), so no Turn button and
   no chosen state; a press shows the glow. The tarot fan: the desktop fan, one tap, cards 124 × 213 (100 × 172 at 820),
   drawn exactly as wide as the content column — its pivot set by draws.js so the outermost card edge sits
   --cap-draw-fan-edge (the column inset) from each screen edge. More spreads and the rows under it keep the 640 reading
   column (owner 2026-10-02). */
@media (min-width: 700px) and (max-width: 1279px) {
  .cap-shell .cap-draw {
    --cap-draw-stone-w: 72px;
    --cap-draw-stone-h: 90px;
    --cap-draw-stone-r: 33.6px / 42px;
    --cap-draw-fan-edge: var(--cap-page-x-mid);   /* the fan spans the content column (owner 2026-10-01) */
  }
  .cap-shell .cap-draw__field { column-gap: var(--cap-gutter); row-gap: var(--cap-gutter); max-width: calc(var(--cap-draw-stone-w) * 7 + var(--cap-gutter) * 6 + var(--cap-page-x-mid) * 2); }
  .cap-shell .cap-draw--rune .cap-draw__turn { display: none; }
  @media (hover: hover) { .cap-shell .cap-draw .cap-draw__field:not(.has-chosen) button:active .cap-rune-stone { box-shadow: var(--cap-shadow-stone-chosen); filter: brightness(1.15); } }
  .cap-shell .cap-draw--rune .cap-draw__lede { max-width: 18em; text-wrap: balance; }   /* two even lines, as T22 sets it */
  .cap-shell .cap-draw--rune.cap-draw--yesno .cap-draw__lede { max-width: none; }   /* the Yes / No lede on one line where it fits (owner 2026-10-02) */
  .cap-shell .cap-draw__fan { margin-left: 0; margin-right: 0; overflow: visible; }
  .cap-shell .cap-draw .cap-draw__fan .cap-draw__fan-card { bottom: calc(var(--cap-draw-card-bottom) + var(--cap-fan-drop, 0px)); }
  .cap-shell .cap-draw--tarot .cap-draw__turn { display: none; }
  .cap-shell .cap-draw--tarot .cap-draw__prep { margin-top: 0; padding-top: var(--cap-space-gap-2); }   /* round 25 (owner, 712 / 820; 24 → 14 → 4, owner 4 Oct): the fan stays; Shuffle and everything under it start 4 below its LOWEST card (the well already reaches it — --cap-fan-drop), so no caption, however long, runs behind a card */
  .cap-shell .cap-draw--tarot .cap-draw__cta { padding-top: var(--cap-space-block-5); }   /* round 22 C9 (owner): 24 from Shuffle to the caption (it was the 32 of space-lg) — round 25: at every tablet width, 700–1279 (it stopped at 1023) */
  @media (hover: hover) { .cap-shell .cap-draw:not(.has-pick) .cap-draw__fan.is-fan .cap-draw__fan-card:active { box-shadow: var(--cap-shadow-halo); } }
  /* More spreads, the links row, the birth-chart band and the month line take the reading column's width and edges (the
     dividers'), before and after the reveal, as T24–T27 and 1440 set them (owner 2026-10-02 — reverses the 1 Oct full width) */
  .cap-shell .cap-draw__browse { width: 100%; max-width: min(var(--cap-draw-col), calc(100% - 2 * var(--cap-page-x)));   /* the column never wider than the window less its insets (round 20: at 700–751 the 640 + 2 × 56 ran 52 px past the window) */ margin-left: auto; margin-right: auto; box-sizing: content-box; }
}
@media (min-width: 700px) and (max-width: 1023px) {
  .cap-shell .cap-draw {
    --cap-draw-card-w: 100px;
    --cap-draw-card-h: 172px;
    --cap-draw-well-h: 380px;
    --cap-draw-card-bottom: 105px;
  }
}

/* ─── phone: the deck → fan model, one-step draws ──────────── */
@media (max-width: 699px) {
  .cap-shell .cap-draw {
    --cap-draw-card-w: 74px;         /* the fan card (1g-2) */
    --cap-draw-card-h: 127px;
    --cap-draw-well-h: 210px;
    --cap-draw-card-bottom: 49px;
    --cap-draw-mid-w: 100px;         /* the yes/no card (1w-2) */
    --cap-draw-mid-h: 172px;
    --cap-draw-big-w: 196px;         /* the revealed card (1h) */
    --cap-draw-big-h: 336px;
    --cap-draw-stone-w: 46px;        /* the field stone (1e-1) */
    --cap-draw-stone-h: 57.5px;
    --cap-draw-stone-r: 21.5px / 26.8px;
    --cap-draw-stone-mid-w: 90px;    /* the yes/no stone (1u-2) */
    --cap-draw-stone-mid-h: 112.5px;
    --cap-draw-stone-mid-r: 42px / 52.5px;
    --cap-draw-stone-big-w: 120px;   /* the revealed stone (1e-2) */
    --cap-draw-stone-big-h: 150px;
    --cap-draw-stone-big-r: 56px / 70px;
    --cap-draw-shuffle-lift: 0px;
    --cap-draw-calc-icon: 113px;
    --cap-draw-fan-edge-phone: var(--cap-space-gap-6);   /* round 32 (owner 2026-10-06): the nine-card fan leaves at least 12 free each side (draws.js fanStep) */
  }
  .cap-shell .cap-draw__hero, .cap-shell .cap-draw__cta, .cap-shell .cap-draw__detail, .cap-shell .cap-draw__more-spreads, .cap-shell .cap-draw__browse, .cap-shell .cap-draw__after, .cap-shell .cap-draw__back, .cap-shell .cap-draw__prep { padding-left: var(--cap-page-x); padding-right: var(--cap-page-x); }
  /* the strip on a phone carries the date + the draw's segment only (1g-1 / 1e-1: no moon) — the segments after ours hide */
  .cap-shell .cap-transit__seg:has([data-cap-draw-transit]) ~ .cap-transit__sep,
  .cap-shell .cap-transit__seg:has([data-cap-draw-transit]) ~ .cap-transit__seg { display: none; }
  .cap-shell .cap-draw__h1 { line-height: var(--cap-leading-hero); letter-spacing: var(--cap-track-hero); }
  .cap-shell .cap-draw__lede { font-size: var(--cap-type-lede); line-height: var(--cap-leading-lede); min-height: calc(var(--cap-type-lede) * var(--cap-leading-lede) * 2); }   /* two lines reserved: the deck → fan lede swap moves nothing below (the brief) */
  /* Shuffle / Mix the stones as the text link (1g-2 / 1e-1) */
  .cap-shell .cap-draw .cap-draw__shuffle { padding: 0 0 var(--cap-space-xs); border: 0; border-bottom: var(--cap-border-hairline) solid var(--cap-color-primary); border-radius: 0; font-size: var(--cap-type-textlink); letter-spacing: var(--cap-track-textlink); color: var(--cap-color-text); }
  .cap-shell .cap-draw--tarot .cap-draw__shuffle { color: var(--cap-color-on-ink); }
  .cap-shell .cap-draw--tarot .cap-draw__prep { margin-top: 0; padding-top: var(--cap-space-lg); }
  .cap-shell .cap-draw--rune .cap-draw__prep { padding-bottom: var(--cap-space-sm); }
  .cap-shell .cap-draw.is-deck-state .cap-draw__prep { visibility: hidden; }   /* the Shuffle link exists in the fan state only (its room is released in the deck state below — owner 2026-09-28) */
  /* the well: 210 tall, edge to edge (the outer fan cards run off-canvas on purpose) */
  .cap-shell .cap-draw__fan { margin: var(--cap-space-lg) 0 0; }
  .cap-shell .cap-draw .cap-draw__fan .cap-draw__fan-card { box-shadow: var(--cap-shadow-card-on-ink); transition: box-shadow var(--cap-ease-fast), filter var(--cap-ease-fast); }
  .cap-shell .cap-draw .cap-draw__fan .cap-draw__fan-card.is-buried { box-shadow: var(--cap-shadow-card-buried); }
  .cap-shell .cap-draw .cap-draw__fan.is-riffled .cap-draw__fan-card.is-top { box-shadow: var(--cap-shadow-card-chosen); filter: brightness(1.25); }
  
  .cap-shell .cap-draw .cap-draw__fan.is-fan .cap-draw__fan-card:focus-visible { box-shadow: var(--cap-shadow-card-on-ink); }
@media (hover: hover) { .cap-shell .cap-draw .cap-draw__fan.is-fan .cap-draw__fan-card:hover { box-shadow: var(--cap-shadow-card-on-ink); } }
  /* chosen (1g-3): the glow + brighten + an 18 px lift, no stroke, siblings unchanged */
  .cap-shell .cap-draw .cap-draw__fan .cap-draw__fan-card.picked { box-shadow: var(--cap-shadow-card-chosen); filter: brightness(1.25); margin-bottom: var(--cap-space-row-pad); }
  /* the leftover stack (set B): four backs at 72 %, dimmed, a 1 px ink wash over the gold edge; painted before the fan */
  .cap-shell .cap-draw .cap-draw__well .cap-draw__stack { position: absolute; inset: 0; width: 100%; height: 100%; cursor: pointer; }
  .cap-shell .cap-draw__stack-card {
    position: absolute; left: 50%; bottom: var(--cap-draw-card-bottom); width: var(--cap-draw-card-w); height: var(--cap-draw-card-h); margin-left: calc(var(--cap-draw-card-w) / -2);
    border-radius: var(--cap-radius-card-face-s); overflow: hidden; transform-origin: 50% 50%;
    box-shadow: var(--cap-shadow-card-buried); transition: box-shadow var(--cap-ease-fast);
  }
  .cap-shell .cap-draw__stack-card img { display: block; width: 100%; height: 100%; object-fit: cover; transition: filter var(--cap-ease-shuffle); }
  .cap-shell .cap-draw__wash { position: absolute; inset: 0; border-radius: var(--cap-radius-card-face-s); box-shadow: inset 0 0 0 var(--cap-border-hairline) var(--cap-color-wash-ink); opacity: 0; transition: opacity var(--cap-ease-shuffle); }
  .cap-shell .cap-draw__well.is-left .cap-draw__stack-card { box-shadow: var(--cap-shadow-card-leftover); }
  .cap-shell .cap-draw__well.is-left .cap-draw__stack-card img { filter: brightness(.6); }
  .cap-shell .cap-draw__well.is-left .cap-draw__wash { opacity: 1; }
  .cap-shell .cap-draw__well.is-xfade { opacity: 0; transition: opacity var(--cap-ease-fast); }   /* reduced motion: a 120 ms cross-fade, ending on the fan + the dimmed stack */
  .cap-shell .cap-draw__well.is-dealing button, .cap-shell .cap-draw__well.is-riffled button { pointer-events: none; }
  /* the field: 5 across at 46 × 57.5, 8 / 12 gaps (1e-1) */
  .cap-shell .cap-draw__field { gap: var(--cap-space-sm) var(--cap-space-gap-6); padding: 0; max-width: calc(var(--cap-draw-stone-w) * 5 + var(--cap-space-gap-6) * 4); margin-top: var(--cap-space-gap-4); }   /* 5 across (1e-1) */
  /* one step on a phone: no Turn / Reveal pill; the deck's "Spread the cards →" instead */
  .cap-shell .cap-draw .cap-draw__turn { display: none; }
  .cap-shell .cap-draw--rune .cap-draw__turn { display: inline-flex; }   /* the stones are two-step at every width (owner spec 2026-09-25): pick, then Turn */
  .cap-shell .cap-draw__cta { padding-top: var(--cap-space-lg); gap: var(--cap-space-gap-5); }
  .cap-shell .cap-draw--rune .cap-draw__cta { padding-top: var(--cap-space-lg); }
  /* the reveal */
  .cap-shell .cap-draw__detail { padding-left: var(--cap-page-x); padding-right: var(--cap-page-x); box-sizing: border-box; }
  .cap-shell .cap-draw__reveal { margin-top: var(--cap-space-primary-air); padding-top: var(--cap-space-lg); gap: var(--cap-space-gap-5); }
  .cap-shell .cap-draw--tarot .cap-draw__reveal { border-top-color: var(--cap-color-line-on-ink-2); }
  .cap-shell .cap-draw__reason { font-size: var(--cap-type-feature); line-height: var(--cap-leading-lede); }
  .cap-shell .cap-draw__body p { font-size: var(--cap-type-lede); }
  .cap-shell .cap-draw__cell-k { font-size: var(--cap-type-label); letter-spacing: var(--cap-track-label); }
  .cap-shell .cap-draw__lock { margin-top: var(--cap-space-lg); padding: var(--cap-space-gap-7) 0; gap: var(--cap-space-sm); letter-spacing: var(--cap-track-feature); }
  .cap-shell .cap-draw--tarot .cap-draw__lock { border-color: var(--cap-color-line-on-ink); }
  .cap-shell .cap-draw .cap-draw__again { width: 100%; margin-top: var(--cap-space-primary-air); }
  /* More spreads: two tiles side by side at 14 px pads (1h) */
  .cap-shell .cap-draw__tiles { gap: var(--cap-space-gap-5); }
  .cap-shell .cap-draw__tile { padding: var(--cap-space-card-pad); gap: var(--cap-space-gap-3); }
  .cap-shell .cap-draw__browse { padding-top: 0; padding-bottom: var(--cap-space-lg); }
  .cap-shell .cap-draw__more-spreads { padding-bottom: var(--cap-space-lg); max-width: none; }   /* round 25 (owner): the phone band is border-box with the page inset as its padding — the 700+ cap (window less the insets) took the inset twice (52 in, not 1v-1 / 1t-1's 26) */
  /* the calculator card stacks and centres, the stars icon (1h) */
  .cap-shell .cap-draw__after { padding-top: 0; gap: var(--cap-space-md); align-items: center; max-width: none; }   /* round 26 (owner): the same double-inset as the band — the card is the boxes' width (26 → 362 at 388), not 52 → 336 */
  .cap-shell .cap-draw__detail, .cap-shell .cap-draw__more-spreads, .cap-shell .cap-draw__after { box-sizing: border-box; }
  /* the card stacks and centres in the sheet's order — heading · the stars icon · lede · button (1h) */
  .cap-shell .cap-draw__calc { display: flex; flex-direction: column; align-items: center; text-align: center; gap: var(--cap-space-md); padding: var(--cap-space-panel-pad); }
  .cap-shell .cap-draw__calc-body { display: contents; }
  .cap-shell .cap-draw__calc-icon--d { display: none; }
  .cap-shell .cap-draw__calc-icon--m { display: block; width: var(--cap-draw-calc-icon); height: auto; order: 2; }
  .cap-shell .cap-draw__calc-h { order: 1; }
  .cap-shell .cap-draw__calc-lede { order: 3; }
  .cap-shell .cap-draw .cap-draw__calc-btn { order: 4; margin-top: 0; }
  .cap-shell .cap-draw .cap-draw__calc-btn { font-size: var(--cap-type-btn-small); line-height: var(--cap-leading-btn-small); padding: var(--cap-btn-pad-small); }   /* Small, 40 (CD sweep) */
  .cap-shell .cap-draw__month { justify-content: center; }
}

/* sweep 3 (owner review 2026-09-23): D12-1's fan → "More spreads" is 40 on desktop */
@media (min-width: 700px) { .cap-shell .cap-draw__more-spreads, .cap-shell .cap-draw.is-revealed .cap-draw__more-spreads { padding-top: var(--cap-space-panel-pad); } }

/* D13's foot, desktop (owner review 2026-09-23): the More-spreads tiles pad 24; More spreads → the calculator card 56; the card →
   the monthly line 24; the monthly line → "Browse all N" 40 (the reveal block no longer adds its own 56 under the line) */
@media (min-width: 700px) {
  .cap-shell .cap-draw__tile { padding: var(--cap-space-block-5); }
  .cap-shell .cap-draw.is-revealed .cap-draw__after { padding-top: var(--cap-space-band-close); padding-bottom: 0; gap: var(--cap-gutter); }
  .cap-shell .cap-draw.is-revealed .cap-draw__browse { padding-top: var(--cap-space-panel-pad); }
}

/* the tarot fan pages, lede → fan one step tighter (owner review 2026-09-23): desktop only now — the phone is back on the 27 Sep sheets' 24 (owner 2026-09-28); desktop the
   fan box is one block-ladder step (24) shorter — the lede sits on the box as D12-1 draws it, so the step comes out of the
   box's empty top (the visible lede → first card 123 → 99) */
@media (min-width: 700px) { .cap-shell .cap-draw--tarot .cap-draw__fan { height: calc(var(--cap-draw-well-h) - var(--cap-space-block-5) + var(--cap-fan-drop, 0px)); } }   /* the arc is anchored to the box's foot, so a shorter box lifts it — nothing overlaps the lede; --cap-fan-drop = the tablet fan's lowered outer cards (draws.js, 0 elsewhere) */
@media (max-width: 699px) { .cap-shell .cap-draw--tarot .cap-draw__fan { margin-top: var(--cap-space-block-5); } }   /* 24 under the lede, deck and fan (1g-1 · 1g-2 · 1v-1 · 1v-2 · 1w-0 · 1w-1) */
/* D13 / D13b / D13c-2 · D11 / D11b / D11c-2 (25 Sep), desktop: the back link 26 under the lede, the revealed card or stone 24 under the divider */
@media (min-width: 700px) {
  .cap-shell .cap-draw .cap-draw__back { padding-top: calc(var(--cap-space-lg) - var(--cap-space-gap-3)); }
  .cap-shell .cap-draw .cap-draw__reveal { padding-top: calc(var(--cap-space-lg) - var(--cap-space-gap-4)); }
  .cap-shell .cap-draw.cap-draw--yesno .cap-draw__reveal { padding-top: calc(var(--cap-space-lg) + var(--cap-space-gap-4)); }   /* the verdict leads: 48 from the divider to its letters */
  .cap-shell .cap-draw.cap-draw--yesno .cap-draw__verdict { margin-bottom: var(--cap-space-gap-7); }   /* ~30 from the verdict's descenders to the card */
  .cap-shell .cap-draw .cap-draw__lock { padding: var(--cap-space-gap-6) 0; }   /* the "Drawn today" / "Your question, answered" row: 48 rule to rule */
  /* Ask the Tarot / Ask the Runes: ONE rule above "Your question, answered" (owner 2026-09-25) — the row's own; the reveal box closes without its bottom rule */
  .cap-shell .cap-draw.cap-draw--one .cap-draw__reveal { border-bottom: 0; }
  .cap-shell .cap-draw.cap-draw--one .cap-draw__lock { margin-top: 0; }
  /* the rune line (D11 · D11b · D11c-2): ~23 from the name */
  .cap-shell .cap-draw--rune .cap-draw__cap { margin-top: calc(-1 * var(--cap-space-gap-2)); }
}

/* ═══ PHONE — CD's 27 Sep phone sheets, MEASURED (1h · 1y · 1w-2 · 1e-2 · 1t-2 · 1u-2 and their deck/field states) ═══
   Appended last so it wins over the earlier phone block at equal specificity. Every value from mobile-key-screens.dc.html
   (27 Sep); rendered and read beside the site element by element. Desktop untouched. */
@media (max-width: 699px) {
  /* type in the sheet's line boxes: the font's normal line where the sheet sets none */
  .cap-shell .cap-draw .cap-draw__hero .cap-eyebrow, .cap-shell .cap-draw__name, .cap-shell .cap-draw__cap, .cap-shell .cap-draw__lock,
  .cap-shell .cap-draw .cap-draw__back-btn, .cap-shell .cap-draw .cap-draw__more, .cap-shell .cap-draw__more-h,
  .cap-shell .cap-draw__tile-k, .cap-shell .cap-draw__tile-s { line-height: normal; }
  .cap-shell .cap-draw--tarot .cap-draw__hero .cap-eyebrow { color: var(--cap-color-primary); }   /* the page eyebrow is violet on the ink ground (1h) */
  .cap-shell .cap-draw__h1 { font-family: var(--cap-font-display-sm); }   /* the phone page-title cut (owner ruling 27 Sep) */
  .cap-shell .cap-draw__lede { font-weight: 400; max-width: none; }
  .cap-shell .cap-draw--tarot .cap-draw__lede { min-height: var(--cap-draw-lede-hold, 0px); }   /* at full width every tarot lede is one line (1g-1 · 1g-2 · 1h): no two-line reserve — only the deck / fan texts' taller height on a narrow phone (draws.js fitFan, round 33) */
  .cap-shell .cap-draw.is-revealed .cap-draw__lede { min-height: 0; }
  .cap-shell .cap-draw__cta .cap-btn--primary { color: var(--cap-color-surface); }
  .cap-shell .cap-draw__cta .cap-caption { line-height: normal; letter-spacing: var(--cap-track-feature); }
  /* the fan (1g-2): the Shuffle link 20 under the fan, the note 34 under the link (its 20 + the 10 gap + 4) */
  .cap-shell .cap-draw--tarot .cap-draw__prep { padding-top: calc(var(--cap-space-block-4) + var(--cap-fan-lower, 0px) - var(--cap-fan-close-rise, 0px)); }   /* + the fan's lowering: the line stays 20 under the cards (draws.js fitFan); − the closed fan's rise below ~344 (draws.js fanStep, round 32) */
  .cap-shell .cap-draw .cap-draw__shuffle { line-height: normal; }
  .cap-shell .cap-draw--tarot:not(.is-deck-state):not(.is-revealed) .cap-draw__cta { padding-top: calc(var(--cap-space-block-6) + var(--cap-space-gap-2)); }
  /* the reveal: 30 above the rule, 24 under it; the card; 20 to the name; 10 · 14 · 16 down the text; 24 to the lock row */
  .cap-shell .cap-draw__back { padding-top: var(--cap-space-block-5); }
  .cap-shell .cap-draw .cap-draw__back-btn { padding-bottom: calc(var(--cap-space-gap-1) + var(--cap-border-hairline)); }   /* the sheets' back link: 3 under the words to its line */
  .cap-shell .cap-draw__reveal { margin-top: var(--cap-space-block-6); padding-top: var(--cap-space-block-5); gap: var(--cap-space-block-4); }
  .cap-shell .cap-draw__card-lg { border-radius: var(--cap-radius-card-art); margin-bottom: 0; }
  .cap-shell .cap-draw__text { gap: var(--cap-space-gap-5); }
  .cap-shell .cap-draw__cap { font-size: var(--cap-type-draw-more); }   /* the one-line reveal caption: 11 on the phone sheets */
  .cap-shell .cap-draw__reason { margin-top: var(--cap-space-gap-2); }
  .cap-shell .cap-draw .cap-draw__more { margin-top: var(--cap-space-gap-3); }
  .cap-shell .cap-draw__lock { margin-top: var(--cap-space-block-5); }
  .cap-shell .cap-draw--tarot .cap-draw__again { color: var(--cap-color-surface); }   /* the violet pill on ink; the rune pages' ink pill keeps its on-ink text */
  /* More spreads (1h): 30 above, the heading 12 over the two tiles, the violet 0.3 box */
  .cap-shell .cap-draw__more-spreads { padding-top: var(--cap-space-block-6); padding-bottom: var(--cap-space-block-5); }
  .cap-shell .cap-draw--tarot .cap-draw__tile { border-color: var(--cap-color-line-halo); }
  /* the phone's own order after the reveal: Browse-all straight under More spreads, then the calculator card and the monthly line */
  .cap-shell .cap-draw__browse { order: 7; padding-bottom: calc(var(--cap-space-block-5) - var(--cap-space-gap-1) - var(--cap-border-hairline)); }   /* the sheet's 24 is from the link's line box, not its underline */
  .cap-shell .cap-draw__browse .cap-link { font-weight: 500; }
  .cap-shell .cap-draw__more-spreads { order: 7; }
  .cap-shell .cap-draw__after { order: 8; }
  .cap-shell .cap-draw--tarot .cap-draw__calc { border-color: var(--cap-color-line-halo); }
  .cap-shell .cap-draw__calc-h { font-family: var(--cap-font-display-sm); line-height: var(--cap-leading-serif-title); letter-spacing: normal; color: var(--cap-color-on-ink); }
  .cap-shell .cap-draw .cap-draw__calc-btn { color: var(--cap-color-surface); margin-top: var(--cap-space-gap-1); }
  .cap-shell .cap-draw__calc-lede { font-size: var(--cap-mp-type-card-lede-sm); line-height: var(--cap-leading-small); }
  .cap-shell .cap-draw__month .cap-caption { font-size: var(--cap-type-draw-more); letter-spacing: var(--cap-track-feature); line-height: normal; }
  .cap-shell .cap-draw__month-sep { display: none; }   /* the sheet's two parts sit 8 apart, no dot */
  /* Ask the Tarot (1y): the eyebrow in the lilac, the lede in the quieter lilac, the name 32, the body 12 under the essence,
     the Love / Career & Money cells 14 under their rule with a 4 gap, the label 15 */
  .cap-shell .cap-draw--tarot.cap-draw--one .cap-draw__hero .cap-eyebrow { color: var(--cap-color-primary-soft); }
  .cap-shell .cap-draw--tarot.cap-draw--one .cap-draw__lede { color: var(--cap-color-on-ink-3); }
  .cap-shell .cap-draw--one .cap-draw__name { font-size: var(--cap-mp-type-draw-name-sm); }
  .cap-shell .cap-draw--one .cap-draw__body { margin-top: var(--cap-space-gap-1); gap: var(--cap-space-gap-6); }
  .cap-shell .cap-draw--tarot.cap-draw--one:not(.is-deck-state):not(.is-revealed) .cap-draw__cta { padding-top: var(--cap-space-block-6); }   /* 1v-2 draws its note without the 4 the other two fans add */
  .cap-shell .cap-draw__cell { padding-top: var(--cap-space-gap-7); gap: var(--cap-space-gap-2); }
  .cap-shell .cap-draw__cell-k { font-size: var(--cap-type-section-light); line-height: normal; }
  /* Tarot yes / no (1w-2): the question draws' lilac eyebrow + quieter lede; the reveal box 24 / 20 / 20 with a 10 gap —
     the verdict (24pt cut, 1.12, −.014em), the card 12 down and 10 up, the name 22 on 1.1, the caption, the essence 4 down,
     the link 8 down */
  .cap-shell .cap-draw--tarot.cap-draw--yesno .cap-draw__hero .cap-eyebrow { color: var(--cap-color-primary-soft); }
  .cap-shell .cap-draw--tarot.cap-draw--yesno .cap-draw__lede, .cap-shell .cap-draw--tarot.cap-draw--yesno .cap-draw__reason { color: var(--cap-color-on-ink-3); }
  .cap-shell .cap-draw--yesno .cap-draw__reveal { padding: var(--cap-space-block-5) var(--cap-space-block-4) var(--cap-space-block-4); gap: var(--cap-space-gap-5); }
  .cap-shell .cap-draw--yesno .cap-draw__verdict { font-family: var(--cap-font-display-sm); line-height: var(--cap-leading-hero); letter-spacing: var(--cap-track-tight); }
  .cap-shell .cap-draw.cap-draw--yesno .cap-draw__verdict { margin-bottom: 0; }
  .cap-shell .cap-draw--tarot.cap-draw--yesno .cap-draw__card-lg { margin: var(--cap-space-gap-6) 0 var(--cap-space-gap-5); box-shadow: var(--cap-mp-shadow-card-yesno); }
  .cap-shell .cap-draw--yesno .cap-draw__name--sm { line-height: var(--cap-leading-ui); }
  .cap-shell .cap-draw.cap-draw--yesno .cap-draw__more { margin-top: var(--cap-space-gap-4); }
  .cap-shell .cap-draw__detail > .cap-caption { margin-top: var(--cap-space-gap-7); line-height: normal; letter-spacing: var(--cap-track-feature); }   /* "Yes, no, or it depends · …": 10 + 4 under the button */
  /* the rune draws on cream (1e-2 · 1t-2 · 1u-2): the rule over the stone in the stronger line, the revealed stone 16 above its
     name with the sheet's shadow, the name 32, the lock row in the caption grey, the calculator card without a border */
  .cap-shell .cap-draw--rune .cap-draw__reveal { border-top-color: var(--cap-color-line-strong); }
  .cap-shell .cap-draw--rune .cap-draw__reveal .cap-draw__item { box-shadow: var(--cap-mp-shadow-stone-reveal); margin-bottom: 0; }
  .cap-shell .cap-draw--rune:not(.cap-draw--yesno) .cap-draw__reveal { gap: var(--cap-space-gap-8); }
  .cap-shell .cap-draw--rune .cap-draw__name:not(.cap-draw__name--sm) { font-size: var(--cap-mp-type-draw-name-sm); }
  .cap-shell .cap-draw--rune .cap-draw__lock, .cap-shell .cap-draw--rune .cap-caption { color: var(--cap-color-caption); }
  .cap-shell .cap-draw__field { margin-top: var(--cap-space-block-4); }   /* 1e-1: 8 under the Mix link + 20 = 28 to the stones */
  .cap-shell .cap-draw--rune.cap-draw--one .cap-draw__cell, .cap-shell .cap-draw--rune.cap-draw--one .cap-draw__lock { border-color: var(--cap-color-line-strong); }   /* 1t-2 */
  .cap-shell .cap-draw--rune .cap-draw__again { color: var(--cap-color-on-ink); }
  .cap-shell .cap-draw--rune .cap-draw__calc { border: 0; }
  /* Runes yes / no (1u-2): the stone 12 under the verdict and 10 over the name, its lighter shadow, the glyph 38 with a 20 glow */
  .cap-shell .cap-draw--rune.cap-draw--yesno .cap-draw__reveal .cap-draw__item { margin: var(--cap-space-gap-6) 0 var(--cap-space-gap-5); box-shadow: var(--cap-mp-shadow-stone-yesno); }
  .cap-shell .cap-draw--rune.cap-draw--yesno .cap-draw__reveal .cap-rune-stone__face { font-size: calc(100cqh * var(--cap-rune-glyph)); text-shadow: 0 0 var(--cap-space-block-4) var(--cap-color-halo); }
  /* the pre-pick states (1e-1 · 1t-1 · 1u-1 · 1g-1 · 1v-1 · 1w-0). The stones: "Turn the stone" HOLDS ITS ROOM before a pick,
     invisible (owner 2026-10-03, round 20 — reverses the 28 Sep "no room until a pick": nothing below the stones may move when one
     is picked). The deck: the Shuffle link takes no room in the deck state; the fan is set lower instead (draws.js fitFan), so
     nothing below the cards moves when the deck spreads. */
  .cap-shell .cap-draw--rune:not(.has-pick) .cap-draw__turn { visibility: hidden; opacity: 0; }
  .cap-shell .cap-draw.is-deck-state .cap-draw__prep { display: none; }
  .cap-shell .cap-draw--tarot.is-deck-state .cap-draw__cta { padding-top: var(--cap-space-block-6); }
  /* "Spread the cards →" (owner 2026-10-03): full width below 600; from 600 to 699 it hugs its words, centred */
  @media (min-width: 600px) { .cap-shell .cap-draw .cap-draw__deal { width: auto; padding: var(--cap-btn-pad-large); } }
  /* the fan's clip edge moves down with it (draws.js fitFan): the cards show exactly as much as before, only lower */
  .cap-shell .cap-draw--tarot .cap-draw__fan { overflow: visible; clip-path: inset(0 0 calc(var(--cap-fan-lower, 0px) * -1) 0); }
  /* the closed deck (1g-1 · 1v-1 · 1w-0, owner 2026-09-28): the sheet's deck is eight cards — seven in the buried shadow, the top
     card alone in the deep one. The six fan cards that wait exactly under the top card cast no shadow while the deck is closed
     (seven stacked deep shadows made a near-black halo that read as a bigger deck); they take it back as the deal spreads them. */
  .cap-shell .cap-draw .cap-draw__well.is-deck:not(.is-dealing) .cap-draw__fan-card:not(.is-top):not(.is-buried) { box-shadow: none; }
  /* the reveal's foot, 28 Sep sheets (owner 2026-09-28): the one-card reveals (1y · 1t-2) carry ONE rule above "Your question,
     answered" — the reveal box closes without its own (the 25 Sep desktop ruling, now on the phone too); the lock row sits 20 under
     the text on the stone reveals and the one-card reveals (1e-2 · 1t-2 · 1y), 24 on the daily tarot (1h) */
  .cap-shell .cap-draw.cap-draw--one .cap-draw__reveal { border-bottom: 0; padding-bottom: 0; }
  .cap-shell .cap-draw--rune .cap-draw__lock, .cap-shell .cap-draw.cap-draw--one .cap-draw__lock { margin-top: var(--cap-space-block-4); }
  /* the stone pages on cream (1e-2): the More-spreads lines in the caption grey, the calculator card's heading in the heading lilac */
  .cap-shell .cap-draw--rune .cap-draw__tile-s { color: var(--cap-color-caption); }
  .cap-shell .cap-draw--rune .cap-draw__calc-h { color: var(--cap-color-on-ink-heading); }
}

/* The library link's tap area (CD note 28 Sep 2026): now the site-wide TAP AREA pattern in components.css (a.cap-link). */
/* D (owner 2026-10-02): the reveal pages on tablet follow the phone's order — More spreads, the "Browse all…" row, the
   birth-chart band, the "Your month" line; the Browse row sits under the tiles with the tiles' own gap, the band and the
   month line close the page as before */
@media (min-width: 700px) and (max-width: 1279px) {
  .cap-shell .cap-draw__browse { order: 7; padding-top: 0; padding-bottom: var(--cap-space-lg); }
  .cap-shell .cap-draw__more-spreads { order: 7; }
  .cap-shell .cap-draw__after { order: 8; }
  /* round 28 (owner): before a draw the tarot pages' "Browse all 22 cards →" sits as far under More spreads as the rune pages' link
     (it touched the tiles at 9) — the runes' 42 above the link; after a draw both keep their 24 */
  .cap-shell .cap-draw--tarot:not(.is-revealed) .cap-draw__browse { padding-top: var(--cap-space-rune-browse-top); }
}

/* ═══ ROUND 15 (owner 2026-10-02) — CD's 2 Oct reveal sheets (D11 · D11b · D11c-2 · D13 · D13b · D13c-2, T24–T27, 1h · 1y ·
   1w-2 · 1e-2 · 1t-2 · 1u-2) ═══ */
/* B — the identity and the orientation on TWO rows: "Major Arcana VI", then "Upright" on its own, larger and in the text
   colour; 12 between them, no "·". A row with nothing in it takes no room (the nine symmetrical runes and Wyrd have no
   orientation; Wyrd's identity reads "The blank rune"). */
.cap-shell .cap-draw__ids { display: flex; flex-direction: column; align-items: center; gap: var(--cap-space-gap-6); }
.cap-shell .cap-draw__ids .cap-draw__cap { margin-top: 0; line-height: normal; }
.cap-shell .cap-draw__orient { font-family: var(--cap-font-ui); font-weight: 600; font-size: var(--cap-type-draw-orient); letter-spacing: var(--cap-track-eyebrow); line-height: normal; text-transform: uppercase; color: var(--cap-color-text); }
.cap-shell .cap-draw--tarot .cap-draw__orient { color: var(--cap-color-on-ink); }
.cap-shell .cap-draw__orient:empty, .cap-shell .cap-draw__ids:empty { display: none; }

/* A — after a reveal the "Browse all…" row holds TWO links, each centred under its More spreads card (the tiles' own
   columns and gap); before a reveal "Browse all…" stands alone as before. The row follows More spreads at every width. */
.cap-shell .cap-draw:not(.is-revealed) .cap-draw__cross { display: none; }
.cap-shell .cap-draw.is-revealed .cap-draw__browse { order: 7; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); column-gap: var(--cap-space-tile-gap-x); justify-items: center; align-items: center; }
.cap-shell .cap-draw.is-revealed .cap-draw__browse-cell { display: flex; justify-content: center; min-width: 0; }
.cap-shell .cap-draw.is-revealed .cap-draw__more-spreads { order: 7; }
.cap-shell .cap-draw.is-revealed .cap-draw__after { order: 8; }
@media (min-width: 1280px) {
  /* the More spreads column (640): links 24 under the cards, the band 32 under the links (D13 · D11) */
  .cap-shell .cap-draw.is-revealed .cap-draw__browse { width: 100%; max-width: min(var(--cap-draw-col), calc(100% - 2 * var(--cap-page-x)));   /* the column never wider than the window less its insets (round 20: at 700–751 the 640 + 2 × 56 ran 52 px past the window) */ margin: 0 auto; box-sizing: content-box; padding: var(--cap-space-block-5) var(--cap-page-x) 0; }
  .cap-shell .cap-draw.is-revealed .cap-draw__after { padding-top: var(--cap-space-lg); }
  /* a 44-high tap area on desktop too (owner: both links) — invisible, centred on the link; nothing moves */
  .cap-shell .cap-draw.is-revealed .cap-draw__browse .cap-link { position: relative; }
  .cap-shell .cap-draw.is-revealed .cap-draw__browse .cap-link::after { content: ""; position: absolute; left: 50%; top: 50%; width: max(100%, var(--cap-tap-min)); height: var(--cap-tap-min); transform: translate(-50%, -50%); }
}
@media (max-width: 1279px) {
  .cap-shell .cap-draw.is-revealed .cap-draw__browse { column-gap: var(--cap-space-gap-5); }   /* the tiles' gap below 1280 */
}
/* the gaps around the new rows, measured on the 2 Oct sheets: the reading 20 under the orientation on the daily draws, 18 on
   the question and yes/no draws (the text column's 14 + 6 / 4); the links 13 like the sheets' (the tarot pages had 12.5) */
@media (min-width: 700px) {
  .cap-shell .cap-draw__ids + .cap-draw__reason { margin-top: var(--cap-space-gap-2); }
  .cap-shell .cap-draw--daily .cap-draw__ids + .cap-draw__reason { margin-top: var(--cap-space-gap-3); }
  .cap-shell .cap-draw__browse .cap-link { font-size: var(--cap-type-sm); }
}
@media (min-width: 700px) and (max-width: 1279px) {
  /* T24–T27: the links 24 under the cards, the band 32 under the links */
  .cap-shell .cap-draw.is-revealed .cap-draw__more-spreads { padding-bottom: 0; }
  .cap-shell .cap-draw.is-revealed .cap-draw__browse { padding-top: var(--cap-space-block-5); padding-bottom: var(--cap-space-lg); }
  .cap-shell .cap-draw.is-revealed .cap-draw__after { padding-top: 0; }   /* the desktop rule's 56 above the band is not the tablet's */
}
@media (max-width: 699px) {
  /* 1h · 1y · 1w-2 · 1e-2 · 1t-2 · 1u-2: 24 from the cards to the links and from the links' underline to the band */
  .cap-shell .cap-draw.is-revealed .cap-draw__browse { padding-bottom: var(--cap-space-block-5); }
}

/* THE MORE SPREADS TILES at the sheets' 106 (owner 2026-10-02): every sheet — D11 · D13 at 1440, T22–T27 at 1024 and 820, tarot
   and runes alike — sets 24 all round, the label and the line 8 apart, label 18 and line 19 in each face's normal line box. The
   tarot tiles had stood 117–121 (the label's 1.7 line), the rune tiles 103–105 (20 at the foot, the line at 20 / 19 in 1.45). */
@media (min-width: 700px) {
  .cap-shell .cap-draw .cap-draw__tile { padding: var(--cap-space-block-5); gap: var(--cap-space-gap-4); }
  .cap-shell .cap-draw .cap-draw__tile-k { line-height: normal; }
  .cap-shell .cap-draw .cap-draw__tile-s { font-size: var(--cap-type-lede-box); line-height: normal; }
}

/* 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. Before
   a reveal the page ends on "Browse all…": the gap is measured to the link's underline, 3 under its line (2 + the hairline). */
.cap-shell .cap-draw:not(.is-revealed) .cap-draw__browse { padding-bottom: calc(var(--cap-space-footer-gap) - var(--cap-space-gap-1) - var(--cap-border-hairline)); }
/* After a reveal it ends on the "Your month" line, which sat 4 above the footer from 700 up (the band had dropped its own foot
   when "Browse all" still followed it) and 56 on a phone. */
.cap-shell .cap-draw.is-revealed .cap-draw__after { padding-bottom: var(--cap-space-footer-gap); }

/* THE DRAW BLOCK TAKES THE COLUMN'S WIDTH (owner 2026-10-05, round 30): Elementor sizes the widget that holds the draw before it
   gives it the full width, so it kept room for the "More spreads" tiles as if they were narrow — 26–48 px of extra space above
   the footer at 712 (90 / 112 against the 64 rule). A definite width makes the measured height the laid-out one. */
.elementor-widget:has(> .elementor-widget-container .cap-draw) { width: 100%; }

/* A 320 PHONE (owner 2026-10-05, round 31): the reveal's own rows on the narrowest phones. Below 380 the column under the drawn
   card or stone is 216–256 wide (320–360), so
   · "Have a question? Ask the Runes / Tarot →" (266 of type, set in one line) ran past its pill — the pill keeps ONE line and
     reads "Ask the Runes →" / "Ask the Tarot →": "Have a question?" is hidden (owner ruling 2026-10-05: no two-line buttons);
   · "Drawn today ✦ Return tomorrow · Tue, October 6" (252) and "Your question, answered ✦ Ask as often as you like" (266) ran
     off the column — the two halves stack, centred, and the ✦ between them goes;
   below 360 the two links under More spreads — "Browse all 25 runes →" (131) in a half of 129 — keep one line each: the two
   halves meet with no gap between them (each link still centred in its half). 380 and up are unchanged. */
@media (max-width: 379px) {
  .cap-shell .cap-draw__detail > .cap-btn .cap-draw__ask-lead { display: none; }
  .cap-shell .cap-draw__lock { flex-direction: column; align-items: center; gap: var(--cap-space-gap-2); }
  .cap-shell .cap-draw__lock .cap-draw__lock-sep { display: none; }
}
@media (max-width: 359px) {
  .cap-shell .cap-draw.is-revealed .cap-draw__browse { column-gap: 0; }
  .cap-shell .cap-draw.is-revealed .cap-draw__browse .cap-link { white-space: nowrap; }
}

/* THE REVEAL ON THE PAGE GUTTER (owner ruling 2026-10-05, round 31): below 700 the reveal block took "100 % less two page margins"
   (round 20's cap for 700–751) AND carried a page margin of padding inside it — the margin twice: the text sat 52 from each edge, the
   Yes / No answer 72. Below 700 the cap goes, so the text sits on the page gutter as sheet 1y draws it; the Yes / No answer too. */
@media (max-width: 699px) {
  .cap-shell .cap-draw__detail { max-width: none; }
  .cap-shell .cap-draw--yesno .cap-draw__reveal { padding-left: 0; padding-right: 0; }   /* the answer's own 20 each side (it draws no box) goes too */
}