/* Earnings week, Oct 19-23, 2026: the post's own hero and figures. Loaded only on that
   post ({% blog_post_assets %}). Built on the landing tokens and fonts (violet, Poppins
   numerals) so they sit with the rest of the blog. Everything is complete without JS; motion only plays when allowed. */

.ew-hero, .ew-figure {
  /* Site tokens (landing.css) under local names, so the figures follow the theme. */
  --ew-ink: var(--lp-bg); --ew-ink-2: var(--lp-bg-2); --ew-panel: var(--lp-surface);
  --ew-line: var(--lp-border); --ew-line-2: var(--lp-border-strong);
  --ew-accent: var(--lp-accent); --ew-accent-hi: #e8d8ff; --ew-accent-lo: var(--lp-primary-2);
  --ew-ivory: var(--lp-text); --ew-mute: var(--lp-muted); --ew-faint: var(--lp-faint);
  --ew-pos: var(--lp-green); --ew-neg: var(--lp-red); --ew-flip: var(--lp-amber);
  --ew-serif: var(--lp-font-title);
  --ew-rise-to: blur(0) drop-shadow(0 0 0 transparent);
  --ew-ease: cubic-bezier(.22, .8, .16, 1);
  --ew-grain: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 .55 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  color: var(--ew-ivory);
  font-variant-numeric: tabular-nums;
}
.ew-serif { font-family: var(--ew-serif); font-weight: 600; letter-spacing: -.02em; }
.ew-sr { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.ew-dot { display: inline-block; width: 3px; height: 3px; margin: 0 .55em; border-radius: 50%; background: currentColor; opacity: .6; vertical-align: middle; }

/* Shared button base. .lp-main reverts buttons to browser defaults, so start clean. */
.lp-main :is(.ew-hero, .ew-figure) button {
  appearance: none; margin: 0; padding: 0; border: 0; border-radius: 0; background: none; box-shadow: none;
  color: inherit; font: inherit; line-height: inherit; letter-spacing: inherit; text-align: inherit; text-transform: none; cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}
.lp-main :is(.ew-hero, .ew-figure) button:focus-visible { outline: 1px solid var(--ew-accent); outline-offset: 3px; }

/* ================= hero ================= */
/* Sized from the cover's own width (cqi), so nothing clips at 960px, on tablets or on phones. */
.lpb-cover--live {
  container: ew-hero / inline-size; aspect-ratio: auto; max-width: 1180px; overflow: hidden;
  border: 1px solid var(--lp-border-strong); background: var(--lp-bg);
  box-shadow: 0 40px 90px -40px rgba(0, 0, 0, .85), inset 0 1px 0 rgba(243, 238, 255, .06);
}
.ew-hero {
  position: relative; isolation: isolate; display: grid; gap: clamp(20px, 3.4cqi, 36px);
  padding: clamp(18px, 4cqi, 48px) clamp(16px, 4.4cqi, 52px) clamp(16px, 3cqi, 30px);
  background:
    radial-gradient(70% 90% at 92% 0%, rgba(148, 103, 254, .34), transparent 60%),
    radial-gradient(60% 80% at 0% 100%, rgba(124, 77, 222, .3), transparent 62%),
    linear-gradient(180deg, var(--ew-ink-2), var(--ew-ink));
}
.ew-hero::after { content: ""; position: absolute; inset: 0; z-index: -1; background-image: var(--ew-grain); opacity: .07; mix-blend-mode: overlay; pointer-events: none; }
.ew-hero-glow { position: absolute; inset: -20% -10% auto auto; z-index: -1; width: 46%; aspect-ratio: 1; border-radius: 50%; background: radial-gradient(circle, rgba(196, 163, 255, .14), transparent 66%); filter: blur(10px); pointer-events: none; }

.ew-hero-top { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px 24px; padding-bottom: 14px; border-bottom: 1px solid var(--ew-line); }
.ew-eyebrow { display: flex; align-items: center; color: var(--ew-accent); font-size: 11px; font-weight: 600; letter-spacing: .2em; line-height: 1.4; text-transform: uppercase; }
.ew-eyebrow--quiet { color: var(--ew-mute); letter-spacing: .16em; }
.ew-eyebrow-mark { display: inline-block; width: 22px; height: 1px; margin-right: 12px; background: linear-gradient(90deg, transparent, var(--ew-accent)); transform-origin: right; }

.ew-hero-main { display: grid; grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "id move" "facts move"; align-items: end; gap: 16px clamp(20px, 3.4cqi, 40px); }
.ew-hero-id { grid-area: id; min-width: 0; }
.ew-hero-tkr { color: var(--ew-accent); font-size: 12px; font-weight: 700; letter-spacing: .32em; }
.ew-hero-name { margin-top: 10px; padding-bottom: .06em; font-family: var(--ew-serif); font-size: clamp(28px, 5cqi, 58px); font-weight: 700; line-height: 1.04; letter-spacing: -.025em; color: var(--ew-ivory); overflow-wrap: anywhere; text-wrap: balance; }
.ew-hero-when { margin-top: 10px; color: var(--ew-mute); font-size: clamp(14px, 1.5cqi, 16px); }
.ew-hero-when::first-letter { text-transform: uppercase; }
/* The dial: 0..12% on a 240-degree arc. The arc fills and the hand turns to the move; the
   sixteen bezel marks are every reporter at its own size. The reading sits in HTML. */
.ew-dial { grid-area: move; position: relative; justify-self: end; width: clamp(250px, 38cqi, 420px); container-type: inline-size; }
.ew-dial-svg { display: block; width: 100%; height: auto; overflow: visible; }
.ew-dial-track { fill: none; stroke: rgba(243, 238, 255, .1); stroke-width: 10; stroke-linecap: round; }
.ew-dial-fill { fill: none; stroke-width: 10; stroke-linecap: round; stroke-dasharray: 100; stroke-dashoffset: calc(100 - var(--span) * 100); transition: stroke-dashoffset .9s var(--ew-ease); }
.ew-dial-tick { stroke: rgba(243, 238, 255, .28); stroke-width: 1.2; }
.ew-dial-tick.is-major { stroke: rgba(243, 238, 255, .62); stroke-width: 1.6; }
.ew-dial-num { fill: var(--ew-mute); font-family: var(--lp-font); font-size: 12px; font-weight: 600; letter-spacing: .04em; }
.ew-dial-mark { fill: rgba(196, 163, 255, .38); transition: fill .3s ease, r .3s ease; }
.ew-dial-mark.is-on { fill: #fff; r: 4; filter: drop-shadow(0 0 5px rgba(196, 163, 255, 1)); }
.ew-dial-hand { transform: rotate(calc(var(--span) * 240deg)); transform-box: view-box; transition: transform .9s var(--ew-ease); }
.ew-dial-pointer { stroke: rgba(243, 238, 255, .85); stroke-width: 1.6; stroke-linecap: round; }
.ew-dial-dot { fill: #fff; stroke: rgba(196, 163, 255, .55); stroke-width: 5; paint-order: stroke; filter: drop-shadow(0 0 8px rgba(196, 163, 255, .95)); }
.ew-dial-read { position: absolute; left: 0; right: 0; top: 40%; display: grid; justify-items: center; gap: 2px; transform: translateY(-50%); text-align: center; pointer-events: none; }
/* Gradient text paints inside its own box only, so the box is a full line tall plus padding. */
.ew-dial-pct {
  display: flex; align-items: flex-start; padding: .04em .08em .02em .02em;
  font-family: var(--ew-serif); font-size: 21cqi; font-weight: 700; line-height: 1.05; letter-spacing: -.045em; white-space: nowrap;
  background: var(--lp-title-grad); -webkit-background-clip: text; background-clip: text; color: transparent;
  --ew-rise-to: blur(0) drop-shadow(0 10px 28px rgba(148, 103, 254, .45));
  filter: var(--ew-rise-to);
}
.ew-dial-cap { color: var(--ew-mute); font-size: max(10px, 2.9cqi); font-weight: 600; letter-spacing: .22em; text-transform: uppercase; }
.ew-pm { margin-right: .06em; font-size: .42em; font-weight: 500; line-height: 1.2; transform: translateY(.22em); }
.ew-pc { margin-left: .04em; font-size: .38em; font-weight: 600; line-height: 1.2; transform: translateY(.24em); }
.ew-hero-facts { grid-area: facts; display: flex; flex-wrap: wrap; row-gap: 10px; }
.ew-hero-facts > div { padding: 2px 20px 2px 0; margin-right: 20px; border-right: 1px solid var(--ew-line); }
.ew-hero-facts > div:last-child { margin-right: 0; border-right: 0; }
.ew-hero-facts dt { color: var(--ew-faint); font-size: 10px; font-weight: 600; letter-spacing: .2em; text-transform: uppercase; }
.ew-hero-facts dd { margin-top: 4px; color: var(--ew-ivory); font-size: 16px; font-weight: 500; }

/* The instrument: a percent scale with the priced band around the close. The $ labels ride
   the band edges but stop 84px short of the frame, so a wide move never pushes them out. */
.ew-instrument { position: relative; }
.ew-bounds { position: relative; height: 24px; }
.ew-bound { position: absolute; bottom: 6px; color: var(--ew-accent-hi); font-size: 13px; font-weight: 600; letter-spacing: .02em; white-space: nowrap; transition: left .9s var(--ew-ease), right .9s var(--ew-ease); }
.ew-bound--low { right: min(calc(100% - 84px), calc(50% + var(--span) * 50% + 10px)); }
.ew-bound--high { left: min(calc(100% - 84px), calc(50% + var(--span) * 50% + 10px)); }
.ew-scale { position: relative; height: 70px; }
.ew-scale::before { content: ""; position: absolute; left: 0; right: 0; bottom: 26px; height: 1px; background: linear-gradient(90deg, transparent, var(--ew-line-2) 8%, var(--ew-line-2) 92%, transparent); }
.ew-band {
  position: absolute; top: 0; bottom: 26px; left: calc(50% - var(--span) * 50%); width: calc(var(--span) * 100%);
  background: linear-gradient(90deg, rgba(196, 163, 255, .05), rgba(196, 163, 255, .22) 50%, rgba(196, 163, 255, .05));
  transition: left .9s var(--ew-ease), width .9s var(--ew-ease);
}
.ew-band::after { content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 2px; background: linear-gradient(90deg, var(--ew-accent-lo), #fff 50%, var(--ew-accent-lo)); box-shadow: 0 0 18px rgba(148, 103, 254, .75); }
.ew-band-edge { position: absolute; top: 0; bottom: 0; width: 1px; background: linear-gradient(180deg, transparent, var(--ew-accent)); }
.ew-band-edge::before { content: ""; position: absolute; top: -3px; left: -3px; width: 7px; height: 7px; background: var(--ew-accent); transform: rotate(45deg); }
.ew-band-edge--l { left: 0; }
.ew-band-edge--r { right: 0; }
.ew-tick { position: absolute; bottom: 26px; width: 1px; height: 7px; background: rgba(243, 238, 255, .22); transform: translateX(-50%); transform-origin: bottom; }
.ew-tick--major { height: 14px; background: rgba(243, 238, 255, .5); }
.ew-tick-label { position: absolute; top: calc(100% + 18px); left: 50%; transform: translateX(-50%); color: var(--ew-mute); font-size: 11px; letter-spacing: .04em; white-space: nowrap; }
.ew-needle { position: absolute; left: 50%; top: -6px; bottom: 26px; width: 1px; background: var(--ew-ivory); box-shadow: 0 0 10px rgba(243, 238, 255, .6); transform-origin: top; }
.ew-needle::before { content: ""; position: absolute; top: -4px; left: -4px; width: 9px; height: 9px; border-radius: 50%; background: var(--ew-ivory); box-shadow: 0 0 0 4px rgba(243, 238, 255, .12), 0 0 16px rgba(243, 238, 255, .8); }
.ew-instrument-note { margin-top: 8px; color: var(--ew-mute); font-size: 13px; text-align: center; }

/* The week: its own row, label and Pause on top, the sixteen reporters underneath. */
.ew-week { display: grid; gap: 12px; padding-top: 16px; border-top: 1px solid var(--ew-line); }
.ew-week-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 30px; }
.ew-week-label { color: var(--ew-mute); font-size: 10.5px; font-weight: 600; letter-spacing: .2em; text-transform: uppercase; }
.ew-week-strip { display: flex; min-width: 0; overflow-x: auto; scrollbar-width: none; overscroll-behavior-x: contain; }
.ew-week-strip::-webkit-scrollbar { display: none; }
.ew-week-strip.is-overflow { -webkit-mask-image: linear-gradient(90deg, #000 88%, transparent); mask-image: linear-gradient(90deg, #000 88%, transparent); }
.ew-week-strip.is-overflow.is-end { -webkit-mask-image: linear-gradient(90deg, transparent, #000 12%); mask-image: linear-gradient(90deg, transparent, #000 12%); }
.ew-day { flex: 1 0 auto; display: flex; flex-direction: column; gap: 8px; padding: 0 clamp(8px, 1.3cqi, 16px); border-left: 1px solid var(--ew-line); }
.ew-day:first-child { padding-left: 0; border-left: 0; }
.ew-day:last-child { padding-right: 0; }
.ew-day-label { color: var(--ew-mute); font-size: 10px; font-weight: 600; letter-spacing: .2em; text-transform: uppercase; white-space: nowrap; }
.ew-day-picks { display: flex; gap: 2px; min-height: 42px; align-items: stretch; }
.ew-day-none { align-self: center; color: var(--ew-mute); font-size: 13px; white-space: nowrap; }
.lp-main .ew-hero .ew-pick {
  position: relative; flex: 1 0 auto; display: flex; flex-direction: column; justify-content: center; gap: 7px;
  min-width: 44px; padding: 8px 6px 10px; border-radius: 8px; color: rgba(243, 238, 255, .72);
  transition: background .3s ease, color .3s ease, box-shadow .3s ease;
}
.lp-main .ew-hero .ew-pick:hover { background: rgba(243, 238, 255, .04); color: var(--ew-ivory); }
.lp-main .ew-hero .ew-pick.is-on { background: rgba(148, 103, 254, .14); box-shadow: inset 0 0 0 1px rgba(196, 163, 255, .5), 0 0 22px -6px rgba(148, 103, 254, .7); color: #fff; }
.ew-pick-tkr { font-size: 12px; font-weight: 600; letter-spacing: .08em; text-align: center; white-space: nowrap; }
.ew-pick-bar { display: flex; justify-content: center; height: 2px; background: rgba(243, 238, 255, .1); border-radius: 2px; }
.ew-pick-bar > span { width: calc(var(--m) * 100%); height: 100%; border-radius: inherit; background: currentColor; opacity: .75; }
.ew-pick.is-on .ew-pick-bar > span { background: linear-gradient(90deg, var(--ew-accent-lo), #fff, var(--ew-accent-lo)); opacity: 1; }
.ew-pick-timer { position: absolute; left: 8px; right: 8px; bottom: 3px; height: 1px; background: var(--ew-accent); transform: scaleX(0); transform-origin: left; opacity: 0; }

.lp-main .ew-hero .ew-play {
  flex: none; display: inline-flex; align-items: center; gap: 9px; height: 30px; padding: 0 13px 0 11px;
  border: 1px solid var(--ew-line-2); border-radius: 999px; color: var(--ew-accent-hi);
  font-size: 10.5px; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; transition: background .25s ease, border-color .25s ease;
}
.lp-main .ew-hero .ew-play:hover { background: rgba(196, 163, 255, .08); border-color: var(--ew-accent); }
.lp-main .ew-hero .ew-play[hidden] { display: none; }
.ew-play-icon { position: relative; width: 9px; height: 10px; }
.ew-play-icon::before, .ew-play-icon::after { content: ""; position: absolute; top: 0; bottom: 0; width: 3px; background: currentColor; border-radius: 1px; }
.ew-play-icon::before { left: 0; }
.ew-play-icon::after { right: 0; }
.ew-play[aria-pressed="true"] .ew-play-icon::before { left: 1px; width: 0; height: 0; border-style: solid; border-width: 5px 0 5px 8px; border-color: transparent transparent transparent currentColor; background: none; }
.ew-play[aria-pressed="true"] .ew-play-icon::after { display: none; }

@container ew-hero (max-width: 700px) {
  .ew-hero-main { grid-template-columns: minmax(0, 1fr); grid-template-areas: "id" "move" "facts"; gap: 14px; }
  .ew-dial { justify-self: center; width: min(100%, 340px); }
  .ew-hero-facts > div { padding-right: 14px; margin-right: 14px; }
  .ew-hero-facts dd { font-size: 14px; }
  .ew-eyebrow--quiet { display: none; }
  .ew-tick-label { font-size: 10px; }
  .ew-bound { font-size: 12px; }
  .ew-bound--low { right: min(calc(100% - 66px), calc(50% + var(--span) * 50% + 6px)); }
  .ew-bound--high { left: min(calc(100% - 66px), calc(50% + var(--span) * 50% + 6px)); }
}

/* ================= film mode (?film=1) =================
   The hero alone, full screen, as a timed motion graphic for the X demo video. Centered
   poster layout inside a 9:16-safe column, so one 16:9 capture also crops to portrait.
   blog-earnings.js runs the timeline and exposes window.ewFilm {ready, marks, play()}. */
html.ew-film, html.ew-film body { overflow: hidden !important; }
html.ew-film .lpb-cover--live { position: fixed; inset: 0; z-index: 2147483000; max-width: none; margin: 0; border: 0; border-radius: 0; box-shadow: none; }
html.ew-film .ew-hero { --fw: min(56vh, 92vw); height: 100%; align-content: center; justify-items: center; gap: 3.4vh; padding: 6vh 4vw; text-align: center; animation: none; }
html.ew-film .ew-hero-glow { inset: 50% auto auto 50%; width: 90vh; transform: translate(-50%, -62%); }
html.ew-film .ew-hero-top { position: absolute; top: 4.6vh; left: 4vw; right: 4vw; padding: 0; border: 0; }
html.ew-film .ew-eyebrow { font-size: max(11px, 1.3vh); }
html.ew-film .ew-hero-main { width: var(--fw); grid-template-columns: minmax(0, 1fr); grid-template-areas: "id" "move" "facts"; justify-items: center; gap: 2.4vh; }
html.ew-film .ew-hero-tkr { font-size: 1.6vh; }
html.ew-film .ew-hero-name { font-size: 6vh; text-align: center; }
html.ew-film .ew-hero-when { font-size: 2vh; }
html.ew-film .ew-dial { justify-self: center; width: min(46vh, 88vw); }
html.ew-film .ew-hero-facts { justify-content: center; }
html.ew-film .ew-hero-facts > div { padding-right: 2vh; margin-right: 2vh; }
html.ew-film .ew-hero-facts dt { font-size: 1.05vh; }
html.ew-film .ew-hero-facts dd { font-size: 2vh; }
html.ew-film .ew-instrument { width: var(--fw); }
html.ew-film .ew-bound { font-size: 1.75vh; }
html.ew-film .ew-tick-label { font-size: 1.25vh; }
html.ew-film .ew-instrument-note, html.ew-film .ew-week-head { display: none; }
html.ew-film .ew-week { width: var(--fw); padding-top: 0; border-top: 0; }
html.ew-film .ew-pick-tkr { font-size: 1.3vh; }
html.ew-film .ew-day-label { font-size: 1vh; }

html.js.ew-film .ew-hero, html.js.ew-film .ew-hero .ew-band { animation: none; }
html.ew-film .ew-hero.is-preroll > *, html.ew-film .ew-hero.is-preroll .ew-band { opacity: 0; }
html.ew-film .ew-hero.is-preroll .ew-band { transition: none; }
html.ew-film .ew-hero.is-intro .ew-band { transition-duration: 1.15s; }
html.ew-film .ew-hero.is-preroll :is(.ew-dial-fill, .ew-dial-hand) { transition: none; }
html.ew-film .ew-hero.is-intro .ew-hero-glow { animation: ew-fade 1.4s ease both; }
html.ew-film .ew-hero.is-intro .ew-hero-top { animation: ew-fade .9s ease .15s both; }
html.ew-film .ew-hero.is-intro .ew-eyebrow-mark { animation: ew-draw .9s var(--ew-ease) .2s both; }
html.ew-film .ew-hero.is-intro .ew-hero-tkr { animation: ew-rise .8s var(--ew-ease) .45s both; }
html.ew-film .ew-hero.is-intro .ew-hero-name { animation: ew-rise .8s var(--ew-ease) .55s both; }
html.ew-film .ew-hero.is-intro .ew-hero-when { animation: ew-rise .8s var(--ew-ease) .7s both; }
html.ew-film .ew-hero.is-intro .ew-dial-svg { animation: ew-fade .9s ease .35s both; }
html.ew-film .ew-hero.is-intro .ew-dial-read { animation: ew-rise .9s var(--ew-ease) .8s both; }
html.ew-film .ew-hero.is-intro :is(.ew-dial-fill, .ew-dial-hand) { transition-duration: 1.15s; }
html.ew-film .ew-hero.is-intro .ew-tick { animation: ew-tick .55s var(--ew-ease) both; animation-delay: calc(.3s + var(--k) * 28ms); }
html.ew-film .ew-hero.is-intro .ew-tick-label { animation: ew-fade .6s ease both; animation-delay: calc(.6s + var(--k) * 28ms); }
html.ew-film .ew-hero.is-intro .ew-needle { animation: ew-drop .8s var(--ew-ease) .55s both; }
html.ew-film .ew-hero.is-intro .ew-bounds { animation: ew-fade .6s ease 1.75s both; }
html.ew-film .ew-hero.is-intro .ew-hero-facts { animation: ew-rise .7s var(--ew-ease) 1.9s both; }
html.ew-film .ew-hero.is-intro .ew-week { animation: ew-rise .8s var(--ew-ease) 2.1s both; }
html.ew-film .ew-hero.is-fast .ew-band { transition-duration: .55s; }
html.ew-film .ew-hero.is-fast .ew-bound { transition-duration: .55s; }
html.ew-film .ew-hero.is-fast :is(.ew-dial-fill, .ew-dial-hand) { transition-duration: .55s; }
html.ew-film .ew-hero.is-fast [data-ew-scene].is-swap :is(.ew-hero-name, .ew-dial-read, .ew-hero-when, .ew-hero-tkr) { animation: ew-snap .26s var(--ew-ease) both; }
html.ew-film .ew-hero.is-lock .ew-band::after { animation: ew-flash 1.4s ease both; }
html.ew-film .ew-hero.is-lock .ew-needle::before { animation: ew-ring 1.4s ease both; }
html.ew-film .ew-hero.is-lock .ew-dial-pct { animation: ew-glow 1.6s ease both; }
html.ew-film .ew-hero.is-lock .ew-dial-dot { animation: ew-pulse 1.4s ease both; }
@keyframes ew-pulse { 0%, 100% { stroke-width: 5; } 35% { stroke-width: 16; stroke: rgba(196, 163, 255, .25); } }
@keyframes ew-draw { from { transform: scaleX(0); } to { transform: none; } }
@keyframes ew-tick { from { opacity: 0; transform: translateX(-50%) scaleY(0); } to { opacity: 1; transform: translateX(-50%); } }
@keyframes ew-drop { from { opacity: 0; transform: scaleY(0); } to { opacity: 1; transform: none; } }
@keyframes ew-snap { from { opacity: .35; transform: translateY(4px); } to { opacity: 1; transform: none; } }
@keyframes ew-flash { 0% { box-shadow: 0 0 18px rgba(148, 103, 254, .75); } 30% { box-shadow: 0 0 46px 6px rgba(196, 163, 255, 1); } 100% { box-shadow: 0 0 18px rgba(148, 103, 254, .75); } }
@keyframes ew-ring { 0% { box-shadow: 0 0 0 4px rgba(243, 238, 255, .12), 0 0 16px rgba(243, 238, 255, .8); } 35% { box-shadow: 0 0 0 22px rgba(243, 238, 255, 0), 0 0 30px rgba(243, 238, 255, 1); } 100% { box-shadow: 0 0 0 4px rgba(243, 238, 255, .12), 0 0 16px rgba(243, 238, 255, .8); } }
@keyframes ew-glow { 0%, 100% { filter: blur(0) drop-shadow(0 18px 44px rgba(148, 103, 254, .35)); } 30% { filter: blur(0) drop-shadow(0 0 60px rgba(196, 163, 255, .9)); } }

/* ================= stage mode (?stage=flow:1 and the like) =================
   One article figure alone, centered and scaled to the screen, for the demo video. */
html.ew-stage, html.ew-stage body { overflow: hidden !important; }
html.ew-stage { background: radial-gradient(60% 70% at 50% 40%, rgba(148, 103, 254, .26), transparent 70%), var(--lp-bg); }
html.ew-stage body { visibility: hidden; background: transparent; }
html.ew-stage .lp-prose .ew-figure.is-staged {
  visibility: visible; position: fixed; left: 50%; top: 50%; z-index: 2147483000;
  width: 860px; max-width: none; margin: 0;
  transform: translate(-50%, -50%) scale(var(--stage-scale, 1));
}
html.ew-stage .lp-prose .ew-figure.is-staged .ew-flow-part:not([hidden]) { padding-top: 0; border-top: 0; }
html.ew-stage-portrait .lp-prose .ew-figure.is-staged { width: 400px; }
.ew-noanim, .ew-noanim * { transition: none !important; animation: none !important; }

/* ================= figures (in the article) ================= */
.lp-prose .ew-figure {
  container: ew-fig / inline-size;
  position: relative; isolation: isolate; overflow: hidden;
  margin: 2.4em 0; padding: clamp(18px, 3vw, 32px);
  border: 1px solid var(--ew-line); border-radius: 18px;
  background:
    radial-gradient(90% 60% at 100% 0%, rgba(196, 163, 255, .08), transparent 60%),
    linear-gradient(180deg, var(--ew-panel), var(--ew-ink));
  box-shadow: 0 30px 70px -36px rgba(0, 0, 0, .9), inset 0 1px 0 rgba(243, 238, 255, .05);
  font-size: 15px; line-height: 1.5;
}
.lp-prose .ew-figure::after { content: ""; position: absolute; inset: 0; z-index: -1; background-image: var(--ew-grain); opacity: .05; mix-blend-mode: overlay; pointer-events: none; }
.lp-prose .ew-figure :where(p, ol, ul, li, dl, dt, dd, section) { margin: 0; padding: 0; list-style: none; }
.lp-prose .ew-figure figcaption { margin: 22px 0 0; padding-top: 16px; border-top: 1px solid var(--ew-line); color: var(--ew-mute); font-size: 13px; line-height: 1.6; text-align: left; }
.ew-fig-head { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 14px 20px; margin-bottom: 22px; }
.ew-kicker { display: flex; align-items: center; gap: 10px; color: var(--ew-accent); font-size: 10.5px; font-weight: 600; letter-spacing: .22em; text-transform: uppercase; }
.ew-kicker::before { content: ""; width: 18px; height: 1px; background: var(--ew-accent); }
.lp-prose .ew-figure .ew-fig-title { margin-top: 8px; color: var(--ew-ivory); font-family: var(--ew-serif); font-size: clamp(20px, 2.6vw, 26px); font-weight: 700; line-height: 1.2; letter-spacing: -.015em; }
.ew-fig-stat { color: var(--ew-mute); font-size: 13px; text-align: right; }
.ew-fig-stat .ew-serif { display: block; font-size: 34px; font-weight: 700; line-height: 1; background: var(--lp-title-grad); -webkit-background-clip: text; background-clip: text; color: transparent; }

/* Segmented control */
.ew-seg { display: inline-flex; padding: 3px; border: 1px solid var(--ew-line-2); border-radius: 999px; }
.ew-seg[hidden] { display: none; }
.lp-main .ew-figure .ew-seg-btn { padding: 7px 14px; border-radius: 999px; color: var(--ew-mute); font-size: 11px; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; white-space: nowrap; transition: background .25s ease, color .25s ease; }
.lp-main .ew-figure .ew-seg-btn:hover { color: var(--ew-ivory); }
.lp-main .ew-figure .ew-seg-btn[aria-pressed="true"] { background: linear-gradient(180deg, #d9c4ff, var(--lp-primary)); color: #12062e; }

/* ---------- cheat sheet ---------- */
.ew-sheet-meta { color: var(--ew-mute); font-size: 12px; letter-spacing: .06em; }
.lp-prose .ew-figure .ew-sheet-dayhead { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 12px; margin: 26px 0 12px; padding-bottom: 10px; border-bottom: 1px solid var(--ew-line); }
.lp-prose .ew-figure .ew-sheet-day:first-of-type .ew-sheet-dayhead { margin-top: 4px; }
.ew-sheet-dayname { color: var(--ew-ivory); font-family: var(--ew-serif); font-size: 19px; font-weight: 700; letter-spacing: -.01em; }
.ew-sheet-date { color: var(--ew-accent); font-size: 11px; font-weight: 600; letter-spacing: .18em; text-transform: uppercase; }
.ew-sheet-count { margin-left: auto; color: var(--ew-mute); font-size: 12px; }
.ew-sheet-day.is-quiet .ew-sheet-dayname { color: var(--ew-mute); font-size: 16px; }
.lp-prose .ew-figure .ew-tickets { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 228px), 1fr)); gap: 10px; }
.lp-prose .ew-figure .ew-ticket {
  position: relative; display: grid; gap: 10px; padding: 14px 16px 13px;
  border: 1px solid var(--ew-line); border-radius: 14px;
  background: linear-gradient(160deg, rgba(148, 103, 254, .11), rgba(148, 103, 254, .02) 60%), var(--ew-ink-2);
  transition: border-color .3s ease, transform .3s var(--ew-ease), box-shadow .3s ease;
}
.lp-prose .ew-figure .ew-ticket:hover { border-color: var(--ew-line-2); transform: translateY(-2px); box-shadow: 0 16px 34px -18px rgba(148, 103, 254, .55); }
.lp-prose .ew-figure .ew-ticket.is-featured { border-color: rgba(196, 163, 255, .55); box-shadow: 0 0 0 1px rgba(148, 103, 254, .25), 0 18px 40px -20px rgba(148, 103, 254, .8); }
.ew-ticket-top { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.ew-ticket-tkr { color: var(--ew-ivory); font-size: 13px; font-weight: 700; letter-spacing: .1em; }
.ew-session { display: inline-flex; align-items: center; gap: 6px; padding: 3px 9px 3px 7px; border: 1px solid var(--ew-line); border-radius: 999px; color: var(--ew-mute); font-size: 10px; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; white-space: nowrap; }
.ew-session svg { width: 12px; height: 12px; }
.ew-session--bmo svg { fill: none; stroke: var(--lp-amber); stroke-width: 1.4; stroke-linecap: round; }
.ew-session--amc svg { fill: var(--ew-accent); }
.lp-prose .ew-figure .ew-ticket-name { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin-top: -4px; color: var(--ew-mute); font-size: 13px; line-height: 1.3; }
.ew-ticket-badge { padding: 1px 7px; border-radius: 999px; background: rgba(148, 103, 254, .2); color: var(--ew-accent-hi); font-size: 9.5px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
.lp-prose .ew-figure .ew-ticket-move { justify-self: start; margin: 2px 0 -2px; padding: 0 .06em .04em 0; font-family: var(--ew-serif); font-size: 32px; font-weight: 700; line-height: 1.05; letter-spacing: -.035em; background: var(--lp-title-grad); -webkit-background-clip: text; background-clip: text; color: transparent; }
.ew-ticket-range { display: grid; grid-template-columns: auto minmax(30px, 1fr) auto; align-items: center; gap: 8px; }
.ew-ticket-bound { color: var(--ew-ivory); font-size: 12px; font-weight: 500; white-space: nowrap; }
.ew-ticket-track { position: relative; height: 8px; border-radius: 8px; background: rgba(243, 238, 255, .06); }
.ew-ticket-band { position: absolute; top: 1px; bottom: 1px; left: calc(50% - var(--m) * 50%); width: calc(var(--m) * 100%); border-radius: inherit; background: linear-gradient(90deg, rgba(124, 77, 222, .55), rgba(196, 163, 255, .9) 50%, rgba(124, 77, 222, .55)); }
.ew-ticket.is-featured .ew-ticket-band { background: linear-gradient(90deg, var(--lp-primary-2), #fff 50%, var(--lp-primary-2)); box-shadow: 0 0 12px rgba(148, 103, 254, .8); }
.ew-ticket-dot { position: absolute; left: 50%; top: 50%; width: 6px; height: 6px; border-radius: 50%; background: #fff; transform: translate(-50%, -50%); box-shadow: 0 0 8px rgba(243, 238, 255, .9); }
.lp-prose .ew-figure .ew-ticket-facts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); padding-top: 10px; border-top: 1px solid var(--ew-line); }
.ew-ticket-facts > div + div { padding-left: 10px; border-left: 1px solid var(--ew-line); }
.lp-prose .ew-figure .ew-ticket-facts dt { color: var(--ew-faint); font-size: 9.5px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; }
.lp-prose .ew-figure .ew-ticket-facts dd { margin-top: 2px; color: var(--ew-ivory); font-size: 13px; font-weight: 500; }
.lp-prose .ew-figure .ew-sheet-table { margin-top: 22px; }
.lp-prose .ew-figure .ew-sheet-table > summary {
  display: inline-flex; align-items: center; gap: 10px; padding: 8px 16px; border: 1px solid var(--ew-line-2); border-radius: 999px;
  color: var(--ew-accent-hi); font-size: 11px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; cursor: pointer; list-style: none;
  transition: background .25s ease, border-color .25s ease;
}
.ew-sheet-table > summary::-webkit-details-marker { display: none; }
.ew-sheet-table > summary::after { content: ""; width: 7px; height: 7px; margin-top: -3px; border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor; transform: rotate(45deg); transition: transform .25s ease; }
.ew-sheet-table[open] > summary::after { margin-top: 3px; transform: rotate(-135deg); }
.lp-prose .ew-figure .ew-sheet-table > summary:hover { background: rgba(196, 163, 255, .08); border-color: var(--ew-accent); }
.lp-prose .ew-figure .ew-sheet-table > summary:focus-visible { outline: 1px solid var(--ew-accent); outline-offset: 3px; }
.lp-prose .ew-figure .ew-sheet-table :is(table, .lpb-table-scroll) { margin: 14px 0 0; }
.lp-prose .ew-figure .ew-sheet-table table { font-size: 13px; }
@container ew-fig (max-width: 640px) {
  .ew-sheet-count { margin-left: 0; width: 100%; }
}

/* ---------- ledger ---------- */
.ew-ledger { --tkr: 58px; --name: 150px; --pct: 60px; }
.ew-ledger-axis, .lp-main .ew-figure .ew-row { display: grid; grid-template-columns: var(--tkr) var(--name) minmax(0, 1fr) var(--pct); align-items: center; column-gap: 14px; }
.ew-ledger-axis > span:first-child { grid-column: 1 / 3; }
.ew-axis-track { position: relative; height: 18px; }
.ew-axis-label { position: absolute; top: 0; transform: translateX(-50%); color: var(--ew-faint); font-size: 10.5px; letter-spacing: .04em; white-space: nowrap; }
.ew-rows { display: flex; flex-direction: column; }
.lp-prose .ew-figure .ew-group { display: flex; gap: 10px; align-items: baseline; margin: 16px 0 4px; padding-bottom: 6px; border-bottom: 1px solid var(--ew-line); color: var(--ew-mute); font-size: 13px; }
.lp-prose .ew-figure .ew-group:first-child { margin-top: 4px; }
.ew-group > span { color: var(--ew-accent); font-family: var(--lp-font); font-size: 10.5px; font-style: normal; font-weight: 600; letter-spacing: .2em; text-transform: uppercase; }
.ew-ledger.is-size .ew-group { display: none; }
.lp-main .ew-figure .ew-row { min-height: 40px; padding: 6px 8px; margin: 1px -8px; width: calc(100% + 16px); border-radius: 8px; transition: background .25s ease; }
.lp-main .ew-figure .ew-row:hover { background: rgba(243, 238, 255, .035); }
.lp-main .ew-figure .ew-row.is-on { background: linear-gradient(90deg, rgba(196, 163, 255, .1), rgba(196, 163, 255, .03)); box-shadow: inset 2px 0 0 var(--ew-accent); }
.ew-row-tkr { color: var(--ew-ivory); font-size: 13px; font-weight: 700; letter-spacing: .08em; }
.ew-row-name { overflow: hidden; color: var(--ew-mute); font-size: 13.5px; text-overflow: ellipsis; white-space: nowrap; }
.ew-row-track { position: relative; height: 22px; }
.ew-row-grid { --l: rgba(243, 238, 255, .07); position: absolute; inset: 0; background: linear-gradient(90deg, transparent 8.333%, var(--l) 8.333% calc(8.333% + 1px), transparent calc(8.333% + 1px) 29.167%, var(--l) 29.167% calc(29.167% + 1px), transparent calc(29.167% + 1px) 70.833%, var(--l) 70.833% calc(70.833% + 1px), transparent calc(70.833% + 1px) 91.667%, var(--l) 91.667% calc(91.667% + 1px), transparent calc(91.667% + 1px)); }
.ew-row-band {
  position: absolute; top: 50%; left: calc(50% - var(--m) * 50%); width: calc(var(--m) * 100%); height: 6px; border-radius: 6px;
  background: linear-gradient(90deg, rgba(124, 77, 222, .45), rgba(196, 163, 255, .75) 50%, rgba(124, 77, 222, .45));
  transform: translateY(-50%); transition: height .3s ease, background .3s ease, box-shadow .3s ease;
}
.ew-row.is-on .ew-row-band { height: 8px; background: linear-gradient(90deg, var(--lp-primary-2), #fff 50%, var(--lp-primary-2)); box-shadow: 0 0 18px rgba(148, 103, 254, .75); }
.ew-row-zero { position: absolute; top: 2px; bottom: 2px; left: 50%; width: 1px; background: rgba(243, 238, 255, .45); }
.ew-row-pct { color: var(--ew-ivory); font-family: var(--ew-serif); font-size: 15px; font-weight: 600; letter-spacing: -.01em; text-align: right; }
.ew-row.is-on .ew-row-pct, .ew-row.is-on .ew-row-tkr { color: var(--ew-accent-hi); }

.ew-detail { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.3fr); gap: 16px 28px; align-items: center; margin-top: 22px; padding: 18px 20px; border: 1px solid var(--ew-line-2); border-radius: 14px; background: linear-gradient(135deg, rgba(196, 163, 255, .08), rgba(196, 163, 255, .015)); }
.lp-prose .ew-figure .ew-detail-name { color: var(--ew-ivory); font-family: var(--ew-serif); font-size: 22px; font-weight: 700; line-height: 1.15; letter-spacing: -.015em; }
.lp-prose .ew-figure .ew-detail-when { margin-top: 4px; color: var(--ew-mute); font-size: 13px; }
.ew-detail-when::first-letter { text-transform: uppercase; }
.ew-detail-range { display: grid; grid-template-columns: auto minmax(40px, 1fr) auto; align-items: center; gap: 12px; }
.ew-detail-bound { color: var(--ew-accent-hi); font-family: var(--ew-serif); font-size: 21px; font-weight: 600; white-space: nowrap; }
.ew-detail-rule { position: relative; height: 1px; background: linear-gradient(90deg, var(--ew-accent-lo), var(--ew-accent-hi) 50%, var(--ew-accent-lo)); }
.ew-detail-rule > span { position: absolute; left: 50%; top: 50%; width: 7px; height: 7px; border-radius: 50%; background: var(--ew-ivory); transform: translate(-50%, -50%); box-shadow: 0 0 10px rgba(243, 238, 255, .7); }
.lp-prose .ew-figure .ew-detail-facts { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); padding-top: 14px; border-top: 1px solid var(--ew-line); }
.ew-detail-facts > div { padding: 0 12px; border-left: 1px solid var(--ew-line); }
.ew-detail-facts > div:first-child { padding-left: 0; border-left: 0; }
.lp-prose .ew-figure .ew-detail-facts dt { color: var(--ew-faint); font-size: 10px; font-weight: 600; letter-spacing: .18em; text-transform: uppercase; }
.lp-prose .ew-figure .ew-detail-facts dd { margin-top: 3px; color: var(--ew-ivory); font-size: 15px; font-weight: 500; }

@container ew-fig (max-width: 640px) {
  .ew-ledger-axis, .ew-rows { --tkr: 46px; --pct: 50px; }
  .ew-ledger-axis, .lp-main .ew-figure .ew-row { grid-template-columns: var(--tkr) minmax(0, 1fr) var(--pct); column-gap: 10px; }
  .ew-ledger-axis > span:first-child { grid-column: 1; }
  .ew-row-name { display: none; }
  .ew-axis-label:nth-child(even) { display: none; }
  .ew-row-pct { font-size: 17px; }
  .ew-detail { grid-template-columns: minmax(0, 1fr); padding: 16px; }
  .ew-detail-bound { font-size: 18px; }
  .lp-prose .ew-figure .ew-detail-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 12px; }
  .ew-detail-facts > div:nth-child(3) { padding-left: 0; border-left: 0; }
}

/* ---------- ridgeline ---------- */
.ew-ridge-stage { margin: 0 -6px; }
.ew-ridge-svg { display: block; width: 100%; height: auto; overflow: visible; }
.ew-ridge-svg text { font-family: var(--lp-font); }
.ew-r-area { transition: opacity .35s ease; }
.ew-r-line { fill: none; stroke: rgba(243, 238, 255, .72); stroke-width: 1.6; stroke-linejoin: round; stroke-linecap: round; transition: stroke .35s ease, stroke-width .35s ease, opacity .35s ease; }
.ew-r--earn .ew-r-line { stroke: var(--ew-accent-hi); stroke-width: 2.4; }
.ew-r-base { stroke: rgba(243, 238, 255, .1); stroke-width: 1; }
.ew-r-label { fill: var(--ew-mute); font-size: 15px; letter-spacing: .04em; }
.ew-r-iv { fill: var(--ew-ivory); font-family: var(--ew-serif) !important; font-size: 18px; font-weight: 600; }
.ew-r--earn .ew-r-label { fill: var(--ew-accent); font-weight: 600; }
.ew-r--earn .ew-r-iv { fill: #fff; font-size: 21px; font-weight: 700; }
.ew-r-axis { fill: var(--ew-faint); font-size: 13px; }
.ew-r-tag { fill: var(--ew-ivory); font-size: 12.5px; letter-spacing: .1em; text-transform: uppercase; }
.ew-r-close { stroke: rgba(243, 238, 255, .4); stroke-width: 1; stroke-dasharray: 2 4; }
.ew-ridge.is-focus .ew-r { opacity: .32; transition: opacity .35s ease; }
.ew-ridge.is-focus .ew-r.is-hi { opacity: 1; }
.ew-ridge.is-focus .ew-r.is-hi .ew-r-line { stroke: var(--ew-accent-hi); stroke-width: 2.4; }

.ew-ridge-chips { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 6px; margin-top: 14px; }
.lp-main .ew-figure .ew-chip { display: flex; flex-direction: column; gap: 2px; padding: 9px 10px; border: 1px solid var(--ew-line); border-radius: 10px; transition: border-color .25s ease, background .25s ease; }
.lp-main .ew-figure .ew-chip:hover { border-color: var(--ew-line-2); background: rgba(243, 238, 255, .03); }
.lp-main .ew-figure .ew-chip.is-on { border-color: var(--ew-accent); background: rgba(196, 163, 255, .08); }
.ew-chip-exp { color: var(--ew-mute); font-size: 10.5px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; }
.ew-chip-iv { color: var(--ew-ivory); font-family: var(--ew-serif); font-size: 18px; font-weight: 600; line-height: 1.2; }
.ew-chip.is-earn .ew-chip-exp { color: var(--ew-accent); }
.ew-chip.is-earn .ew-chip-iv { color: var(--ew-accent-hi); }
@container ew-fig (max-width: 640px) {
  .ew-ridge-chips { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .ew-fig-stat { text-align: left; }
}

/* ---------- flow ---------- */
.lp-prose .ew-figure .ew-flow-part { padding: 22px 0; border-top: 1px solid var(--ew-line); }
.lp-prose .ew-figure .ew-flow-part:first-of-type { padding-top: 0; border-top: 0; }
.lp-prose .ew-figure .ew-part-title { display: flex; align-items: center; gap: 12px; margin-bottom: 14px; color: var(--ew-mute); font-size: 11px; font-weight: 600; letter-spacing: .18em; text-transform: uppercase; }
.ew-part-n { color: var(--ew-accent); font-family: var(--ew-serif); font-size: 15px; font-weight: 700; letter-spacing: 0; }
.lp-prose .ew-figure .ew-part-big { margin-bottom: 14px; color: var(--ew-mute); font-size: 14px; }
.ew-part-big .ew-serif { margin-right: 8px; font-size: 34px; font-weight: 700; line-height: 1; background: var(--lp-title-grad); -webkit-background-clip: text; background-clip: text; color: transparent; }
.ew-split { display: flex; gap: 3px; height: 14px; }
.ew-split-seg { flex: 0 0 var(--w); border-radius: 3px; transform-origin: left; }
.ew-split-seg--bull { background: linear-gradient(180deg, #4ade80, #15803d); box-shadow: 0 0 14px rgba(34, 197, 94, .35); }
.ew-split-seg--neutral { background: repeating-linear-gradient(135deg, rgba(243, 238, 255, .2) 0 4px, rgba(243, 238, 255, .08) 4px 8px); }
.ew-split-seg--bear { background: linear-gradient(180deg, #fb7185, #be123c); box-shadow: 0 0 14px rgba(244, 63, 94, .35); }
.lp-prose .ew-figure .ew-split-key { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin-top: 12px; }
.ew-split-item { padding-left: 12px; border-left: 2px solid; }
.ew-split-item--bull { border-color: var(--ew-pos); }
.ew-split-item--neutral { border-color: rgba(243, 238, 255, .35); }
.ew-split-item--bear { border-color: var(--ew-neg); }
.lp-prose .ew-figure .ew-split-item dt { color: var(--ew-mute); font-size: 12px; }
.lp-prose .ew-figure .ew-split-item dd { color: var(--ew-ivory); font-family: var(--ew-serif); font-size: 20px; font-weight: 600; line-height: 1.25; }
.ew-side { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 12px; margin-top: 16px; color: var(--ew-mute); font-size: 12.5px; }
.ew-side-bar { height: 4px; border-radius: 4px; background: rgba(148, 103, 254, .35); overflow: hidden; }
.ew-side-bar > span { display: block; width: var(--w); height: 100%; background: rgba(243, 238, 255, .7); }

.ew-prints { display: flex; flex-direction: column; }
.lp-prose .ew-figure .ew-print { position: relative; display: grid; grid-template-columns: 72px minmax(0, 1.2fr) minmax(0, 1fr) 80px minmax(0, 1fr); align-items: baseline; gap: 12px; padding: 10px 0; border-bottom: 1px solid var(--ew-line); font-size: 13.5px; }
.lp-prose .ew-figure .ew-print:last-child { border-bottom: 0; }
.ew-print.is-paired::before { content: ""; position: absolute; left: -14px; top: 50%; width: 6px; height: 6px; border-radius: 50%; background: var(--ew-accent); transform: translateY(-50%); box-shadow: 0 0 8px rgba(196, 163, 255, .7); }
.ew-print-time { color: var(--ew-faint); font-size: 12px; }
.ew-print-k { color: var(--ew-mute); white-space: nowrap; }
.ew-print-k .ew-serif { color: var(--ew-ivory); font-size: 16px; }
.ew-print-n { color: var(--ew-mute); }
.ew-print-v { color: var(--ew-ivory); font-weight: 600; text-align: right; }
.ew-print-tag { justify-self: end; padding: 2px 9px; border: 1px solid var(--ew-line-2); border-radius: 999px; color: var(--ew-mute); font-size: 10.5px; letter-spacing: .12em; text-transform: uppercase; white-space: nowrap; }
.ew-print-tag--bullish { border-color: rgba(34, 197, 94, .55); color: #4ade80; }
.ew-print-tag--bearish { border-color: rgba(244, 63, 94, .55); color: #fb7185; }

.ew-gamma { display: block; width: 100%; height: auto; overflow: visible; }
.ew-gamma text { font-family: var(--lp-font); }
.ew-g-zero { stroke: rgba(243, 238, 255, .35); stroke-width: 1; }
.ew-g-edge { stroke: rgba(196, 163, 255, .55); stroke-width: 1; }
.ew-g-close { stroke: var(--ew-ivory); stroke-width: 1.2; }
.ew-g-flip { stroke: var(--ew-flip); stroke-width: 1.2; stroke-dasharray: 4 4; }
.ew-g-tag { fill: var(--ew-ivory); font-size: 15px; font-weight: 600; letter-spacing: .03em; }
.ew-g-tag--accent { fill: var(--ew-accent-hi); }
.ew-g-tag--flip { fill: var(--ew-flip); }
.ew-g-axis { fill: var(--ew-mute); font-size: 14px; }
.ew-gamma-key { display: flex; flex-wrap: wrap; gap: 8px 20px; margin-top: 10px; color: var(--ew-mute); font-size: 12px; }
.ew-gk { display: inline-flex; align-items: center; gap: 8px; }
.ew-gk::before { content: ""; width: 12px; height: 12px; border-radius: 3px; }
.ew-gk--pos::before { background: linear-gradient(180deg, #4ade80, #15803d); }
.ew-gk--neg::before { background: linear-gradient(180deg, #be123c, #fb7185); }
.ew-gk--band::before { background: rgba(196, 163, 255, .16); box-shadow: inset 0 0 0 1px rgba(196, 163, 255, .55); }

@container ew-fig (max-width: 640px) {
  .lp-prose .ew-figure .ew-split-key { grid-template-columns: minmax(0, 1fr); gap: 8px; }
  .lp-prose .ew-figure .ew-print { grid-template-columns: 62px minmax(0, 1fr) auto; row-gap: 2px; }
  .ew-print-n { grid-column: 2; grid-row: 2; font-size: 12px; }
  .ew-print-tag { grid-column: 3; grid-row: 2; }
  .ew-print.is-paired::before { left: -10px; }
}

/* ================= motion (only with JS and motion allowed) ================= */
@media (prefers-reduced-motion: no-preference) {
  html.js .ew-hero.is-playing .ew-pick.is-on .ew-pick-timer { opacity: .9; animation: ew-timer var(--ew-dwell, 3.6s) linear forwards; }
  html.js .ew-hero [data-ew-scene].is-swap :is(.ew-hero-name, .ew-dial-read, .ew-hero-when, .ew-hero-tkr) { animation: ew-rise .6s var(--ew-ease) both; }
  html.js .ew-hero [data-ew-scene].is-swap .ew-dial-read { animation-delay: .05s; }
  html.js .ew-hero { animation: ew-fade 1s var(--ew-ease) both; }
  html.js .ew-hero .ew-band { animation: ew-open 1.3s var(--ew-ease) .25s backwards; }

  html.js .ew-figure[data-lp-reveal] .ew-row-band { transform: translateY(-50%) scaleX(0); transition: transform .9s var(--ew-ease), height .3s ease, background .3s ease, box-shadow .3s ease; transition-delay: calc(var(--r, 0) * 40ms + .1s), 0s, 0s, 0s; }
  html.js .ew-figure[data-lp-reveal].is-in .ew-row-band { transform: translateY(-50%) scaleX(1); }
  html.js .ew-figure[data-lp-reveal] .ew-r-line { stroke-dasharray: 1; stroke-dashoffset: 1; transition: stroke-dashoffset 1.6s var(--ew-ease) calc(var(--i) * .14s), stroke .35s ease, stroke-width .35s ease; }
  html.js .ew-figure[data-lp-reveal] .ew-r-area { opacity: 0; transition: opacity .9s ease calc(var(--i) * .14s + .5s); }
  html.js .ew-figure[data-lp-reveal].is-in .ew-r-line { stroke-dashoffset: 0; }
  html.js .ew-figure[data-lp-reveal].is-in .ew-r-area { opacity: 1; }
  html.js .ew-figure[data-lp-reveal] .ew-split-seg { transform: scaleX(0); transition: transform 1s var(--ew-ease) .15s; }
  html.js .ew-figure[data-lp-reveal].is-in .ew-split-seg { transform: none; }
  html.js .ew-figure[data-lp-reveal] .ew-g-bar { transform: scaleY(0); transform-box: fill-box; transform-origin: center bottom; transition: transform .8s var(--ew-ease) calc(var(--i) * 35ms + .2s); }
  html.js .ew-figure[data-lp-reveal] .ew-g-bar--neg { transform-origin: center top; }
  html.js .ew-figure[data-lp-reveal].is-in .ew-g-bar { transform: none; }
  html.js .ew-ledger.is-swap .ew-detail { animation: ew-rise .6s var(--ew-ease) both; }
  html.js .ew-figure[data-lp-reveal] .ew-print { opacity: 0; transform: translateX(-10px); transition: opacity .5s ease, transform .6s var(--ew-ease); }
  html.js .ew-figure[data-lp-reveal].is-in .ew-print { opacity: 1; transform: none; }
  html.js .ew-figure[data-lp-reveal] .ew-print:nth-child(1) { transition-delay: 0.15s; }
  html.js .ew-figure[data-lp-reveal] .ew-print:nth-child(2) { transition-delay: 0.27s; }
  html.js .ew-figure[data-lp-reveal] .ew-print:nth-child(3) { transition-delay: 0.39s; }
  html.js .ew-figure[data-lp-reveal] .ew-print:nth-child(4) { transition-delay: 0.51s; }
  html.js .ew-figure[data-lp-reveal] .ew-print:nth-child(5) { transition-delay: 0.63s; }
  html.js .ew-figure[data-lp-reveal] .ew-print:nth-child(6) { transition-delay: 0.75s; }
  html.js .ew-figure[data-lp-reveal] .ew-ticket { opacity: 0; transform: translateY(12px); transition: opacity .6s ease, transform .7s var(--ew-ease), border-color .3s ease, box-shadow .3s ease; transition-delay: calc(var(--r, 0) * 60ms + .1s), calc(var(--r, 0) * 60ms + .1s), 0s, 0s; }
  html.js .ew-figure[data-lp-reveal].is-in .ew-ticket { opacity: 1; transform: none; }
  html.js .ew-figure[data-lp-reveal].is-in .ew-ticket:hover { transform: translateY(-2px); transition-delay: 0s; }
}
@keyframes ew-timer { from { transform: scaleX(0); } to { transform: scaleX(1); } }
/* Same filter list at both ends so it interpolates and lands on the element's own glow. */
@keyframes ew-rise { from { opacity: 0; transform: translateY(10px); filter: blur(6px) drop-shadow(0 0 0 transparent); } to { opacity: 1; transform: none; filter: var(--ew-rise-to); } }
@keyframes ew-fade { from { opacity: 0; } to { opacity: 1; } }
@keyframes ew-open { from { left: 50%; width: 0; } }