/* lvchart.css: the kit's chart type, one set of tokens. Pair of assets/levels/lvchart.js (read its header for the contract).
   Restyle every chart on every page by changing the --cx-* block below. Prefix coupling: the selectors use [data-composition-id^="lv-"];
   a new page either keeps the "lv-" shot prefix or search-and-replaces it (kit/README.md, "How a new page makes a chart"). */
[data-composition-id^="lv-"]{
  --cx-ink:#eef2f6;--cx-ink-2:rgba(238,242,246,.72);--cx-mute:rgba(238,242,246,.5);--cx-faint:rgba(238,242,246,.4);
  --cx-gold:#f3d9a0;--cx-gold-2:rgba(243,217,160,.72);--cx-ice:#9fd6ff;--cx-emerald:#74d3ad;
  --cx-glass:linear-gradient(180deg,rgba(255,255,255,.075),rgba(255,255,255,.02));--cx-rim:rgba(238,242,246,.26);
  --cx-mono:ui-monospace,SFMono-Regular,Menlo,monospace;--cx-glow-c:rgba(159,214,255,.28)}
[data-composition-id^="lv-"]{position:absolute;inset:0;container-type:size;overflow:hidden;background:transparent;color:#eef2f6;font-family:'Satoshi',Inter,system-ui,sans-serif}
[data-composition-id^="lv-"][data-era="light"]{color:#16101e}
[data-composition-id^="lv-"] .lv-data{display:none}
/* the Train page's scroll-beat padding ([data-beat]{padding:9vh 0}, from the shared head) must never reach a shot's type */
[data-composition-id^="lv-"] [data-beat]{padding:0 !important}
[data-composition-id^="lv-"] .lv-cam{position:absolute;inset:0}
[data-composition-id^="lv-"] .lv-box{--bw:min(100cqw,177.78cqh);--u:calc(var(--bw) / 1920);position:absolute;left:calc((100cqw - var(--bw)) / 2);top:calc((100cqh - var(--bw) * .5625) / 2);width:var(--bw);aspect-ratio:16/9}
[data-composition-id^="lv-"] .lv-a{position:absolute;white-space:nowrap}
[data-composition-id^="lv-"] .lv-a > *{line-height:1}
[data-composition-id^="lv-"] .al-l{transform:translate(0,-50%)}
[data-composition-id^="lv-"] .al-r{transform:translate(-100%,-50%);width:auto}
[data-composition-id^="lv-"] .al-c{transform:translate(-50%,-50%);width:auto}
[data-composition-id^="lv-"] .lv-mono,[data-composition-id^="lv-"] .lv-src,[data-composition-id^="lv-"] .lv-eyebrow,[data-composition-id^="lv-"] .lv-read,
[data-composition-id^="lv-"] .lv-chip,[data-composition-id^="lv-"] .lv-zl__k,[data-composition-id^="lv-"] .lv-tag__d,[data-composition-id^="lv-"] .lv-note,[data-composition-id^="lv-"] .lv-callout{
  font-family:ui-monospace,SFMono-Regular,Menlo,monospace;text-transform:uppercase;font-weight:500}
[data-composition-id^="lv-"] .lv-mono{font-size:calc(var(--u) * 21);letter-spacing:.1em;color:rgba(238,242,246,.5)}
[data-composition-id^="lv-"] .lv-tag{display:flex;flex-direction:column;gap:calc(var(--u) * 6);font-size:calc(var(--u) * 38);font-weight:700;letter-spacing:-.02em;color:#eef2f6;font-variant-numeric:tabular-nums}
[data-composition-id^="lv-"] .lv-tag__d{font-size:calc(var(--u) * 17);letter-spacing:.14em;color:rgba(238,242,246,.6)}
[data-composition-id^="lv-"] .lv-zl{display:flex;flex-direction:column;gap:calc(var(--u) * 5)}
[data-composition-id^="lv-"] .lv-zl__v{font-size:calc(var(--u) * 26);font-weight:700;letter-spacing:-.01em;color:#f3d9a0;font-variant-numeric:tabular-nums}
[data-composition-id^="lv-"] .lv-zl__k{font-size:calc(var(--u) * 16);letter-spacing:.16em;color:rgba(243,217,160,.72)}
[data-composition-id^="lv-"] .lv-zl--x .lv-zl__v{color:rgba(238,242,246,.78);font-size:calc(var(--u) * 22)}
[data-composition-id^="lv-"] .lv-tag--s{font-size:calc(var(--u) * 26)}
[data-composition-id^="lv-"] .lv-note--gold{color:rgba(243,217,160,.85)}
[data-composition-id^="lv-"] .lv-note{font-size:calc(var(--u) * 18);letter-spacing:.12em;color:rgba(238,242,246,.72)}
/* today's partial bar (5 Nov 2026): its label is ice, the same cool tone a test of a zone gets; a zone it is breaking flags its chip in gold */
[data-composition-id^="lv-"] .lv-note--partial{color:#9fd6ff}
[data-composition-id^="lv-"] .lv-chip--break{color:#f3d9a0;border-color:rgba(243,217,160,.62)}
[data-composition-id^="lv-"] .lv-ptitle{font-size:calc(var(--u) * 30);font-weight:700;letter-spacing:-.01em;color:#eef2f6;transform:translate(0,-50%)}
[data-composition-id^="lv-"] .lv-chip{font-size:calc(var(--u) * 19);letter-spacing:.16em;color:#eef2f6;padding:calc(var(--u) * 9) calc(var(--u) * 16);border:1px solid rgba(238,242,246,.34);border-radius:999px;background:rgba(5,3,8,.42)}
[data-composition-id^="lv-"] .lv-chip--s{font-size:calc(var(--u) * 15);padding:calc(var(--u) * 6) calc(var(--u) * 11)}
[data-composition-id^="lv-"] .lv-chip::before{content:"";display:inline-block;width:calc(var(--u) * 9);height:calc(var(--u) * 9);border-radius:50%;background:#f3d9a0;margin-right:calc(var(--u) * 11);vertical-align:.08em}
/* the key (lv-06): a symbol drawn in CSS, then its meaning in mono */
[data-composition-id^="lv-"] .lv-key{display:flex;align-items:center;gap:calc(var(--u) * 14);font-family:ui-monospace,SFMono-Regular,Menlo,monospace;
  text-transform:uppercase;font-size:calc(var(--u) * 19);letter-spacing:.12em;color:rgba(238,242,246,.86)}
[data-composition-id^="lv-"] .lv-key__s{display:inline-block;width:calc(var(--u) * 16);height:calc(var(--u) * 16);flex:none}
[data-composition-id^="lv-"] .lv-key--tri .lv-key__s{clip-path:polygon(50% 0,100% 100%,0 100%);background:#9fd6ff}
[data-composition-id^="lv-"] .lv-key--x .lv-key__s{background:linear-gradient(45deg,transparent 42%,#e58f74 42% 58%,transparent 58%),linear-gradient(-45deg,transparent 42%,#e58f74 42% 58%,transparent 58%)}
[data-composition-id^="lv-"] .lv-key--dia .lv-key__s{border:2px solid #e58f74;transform:rotate(45deg) scale(.8)}
[data-composition-id^="lv-"] .lv-key--yx .lv-key__s{background:linear-gradient(45deg,transparent 40%,#f2c46b 40% 60%,transparent 60%),linear-gradient(-45deg,transparent 40%,#f2c46b 40% 60%,transparent 60%)}
[data-composition-id^="lv-"] .lv-key--rib .lv-key__s{height:2px;background:linear-gradient(90deg,#eef2f6 50%,rgba(238,242,246,.4) 50%)}
/* the HUD: eyebrow top-left (96, 96), headline beneath it, MY READ bottom-left (96, 1032), source bottom-right (1824, 1032) */
[data-composition-id^="lv-"] .lv-eyebrow{position:absolute;left:5%;top:7.4%;margin:0;font-size:calc(var(--u) * 22);letter-spacing:.18em;color:rgba(238,242,246,.62)}
[data-composition-id^="lv-"] .lv-w{position:absolute;left:5%;top:11.6%;margin:0;white-space:nowrap;opacity:0;font-weight:700;font-size:calc(var(--u) * 92);line-height:1.05;letter-spacing:-.03em}
[data-composition-id^="lv-"] .lv-w.lv-w--last{opacity:1}
[data-composition-id^="lv-"] .lv-w .w{display:inline-block}
[data-composition-id^="lv-"] .lv-read{position:absolute;left:5%;bottom:4.4%;margin:0;font-size:calc(var(--u) * 24);letter-spacing:.18em;color:rgba(243,217,160,.92)}
[data-composition-id^="lv-"] .lv-src{position:absolute;right:5%;bottom:4.4%;margin:0;max-width:62%;text-align:right;font-size:calc(var(--u) * 18);letter-spacing:.08em;line-height:1.45;color:rgba(238,242,246,.5)}
[data-composition-id^="lv-"] .lv-callout{position:absolute;left:5%;bottom:9.2%;margin:0;max-width:72%;font-size:calc(var(--u) * 17);letter-spacing:.08em;line-height:1.5;color:rgba(243,217,160,.8)}
/* light era (the close) */
[data-composition-id^="lv-"][data-era="light"] .lv-mono,[data-composition-id^="lv-"][data-era="light"] .lv-src,[data-composition-id^="lv-"][data-era="light"] .lv-eyebrow{color:rgba(22,16,30,.62)}
[data-composition-id^="lv-"][data-era="light"] .lv-read{color:#8a6420}
[data-composition-id^="lv-"] .lumen-poster{display:none}
/* the phone stage: a 4:5 design box, type larger, headline wraps to two rows */
@container (orientation: portrait){
  [data-composition-id^="lv-"] .alp-l{transform:translate(0,-50%)}
  [data-composition-id^="lv-"] .alp-r{transform:translate(-100%,-50%)}
  [data-composition-id^="lv-"] .alp-c{transform:translate(-50%,-50%)}
  [data-composition-id^="lv-"] .lv-box{--bw:min(100cqw,80cqh);--u:calc(var(--bw) / 1080);top:calc((100cqh - var(--bw) * 1.25) / 2);aspect-ratio:4/5}
  [data-composition-id^="lv-"] .lv-mono{font-size:calc(var(--u) * 30);letter-spacing:.06em}
  [data-composition-id^="lv-"] .lv-tag{font-size:calc(var(--u) * 46)}
  [data-composition-id^="lv-"] .lv-tag__d{font-size:calc(var(--u) * 30);letter-spacing:.06em}
  [data-composition-id^="lv-"] .lv-zl__v{font-size:calc(var(--u) * 34)}
  [data-composition-id^="lv-"] .lv-zl__k{font-size:calc(var(--u) * 30);letter-spacing:.06em}
  [data-composition-id^="lv-"] .lv-zl--x .lv-zl__v{font-size:calc(var(--u) * 30)}
  [data-composition-id^="lv-"] .lv-tag--s{font-size:calc(var(--u) * 26)}
[data-composition-id^="lv-"] .lv-note--gold{color:rgba(243,217,160,.85)}
[data-composition-id^="lv-"] .lv-note{font-size:calc(var(--u) * 30);letter-spacing:.06em}
  [data-composition-id^="lv-"] .lv-ptitle{font-size:calc(var(--u) * 40)}
  [data-composition-id^="lv-"] .lv-chip{font-size:calc(var(--u) * 30);letter-spacing:.08em}
  [data-composition-id^="lv-"] .lv-chip--s{font-size:calc(var(--u) * 26)}
  [data-composition-id^="lv-"] .lv-eyebrow{left:6%;top:5.2%;font-size:calc(var(--u) * 30);letter-spacing:.08em}
  [data-composition-id^="lv-"] .lv-w{left:6%;right:6%;top:9.2%;white-space:normal;font-size:calc(var(--u) * 88)}
  [data-composition-id^="lv-"] .lv-read{left:6%;bottom:9%;font-size:calc(var(--u) * 32);letter-spacing:.1em}
  [data-composition-id^="lv-"] .lv-src{left:6%;right:6%;bottom:3.2%;max-width:none;text-align:left;font-size:calc(var(--u) * 26);letter-spacing:.03em}
  [data-composition-id^="lv-"] .lv-callout{left:6%;right:6%;bottom:16.4%;max-width:none;font-size:calc(var(--u) * 28);letter-spacing:.03em}
}
/* V2 refinement: type hierarchy, glass chips, no cramped labels */
[data-composition-id^="lv-"] .lv-ax{color:var(--cx-faint);letter-spacing:.14em}
[data-composition-id^="lv-"] .lv-tag{text-shadow:0 0 calc(var(--u) * 22) var(--cx-glow-c)}
[data-composition-id^="lv-"] .lv-tag__d{color:var(--cx-mute);letter-spacing:.16em}
[data-composition-id^="lv-"] .lv-zl{gap:calc(var(--u) * 7)}
[data-composition-id^="lv-"] .lv-zl__v{text-shadow:0 0 calc(var(--u) * 18) rgba(243,217,160,.3)}
[data-composition-id^="lv-"] .lv-note{color:var(--cx-ink-2);letter-spacing:.14em}
[data-composition-id^="lv-"] .lv-ptitle{letter-spacing:-.005em;text-shadow:0 0 calc(var(--u) * 22) var(--cx-glow-c)}
[data-composition-id^="lv-"] .lv-chip{background:var(--cx-glass),rgba(6,12,22,.55);border-color:rgba(159,214,255,.4);color:var(--cx-ink);box-shadow:inset 0 1px 0 rgba(255,255,255,.1),0 0 calc(var(--u) * 24) rgba(159,214,255,.1)}
[data-composition-id^="lv-"] .lv-chip::before{background:var(--cx-ice);box-shadow:0 0 calc(var(--u) * 10) var(--cx-ice)}
[data-composition-id^="lv-"] .lv-chip--break{border-color:rgba(243,217,160,.66);box-shadow:inset 0 1px 0 rgba(255,255,255,.1),0 0 calc(var(--u) * 24) rgba(243,217,160,.16)}
[data-composition-id^="lv-"] .lv-chip--break::before{background:var(--cx-gold);box-shadow:0 0 calc(var(--u) * 10) var(--cx-gold)}
/* a small multiple's chip wraps onto a second line rather than run into the price beside it */
[data-composition-id^="lv-"] .lv-a.lv-chip--s{white-space:normal;max-width:calc(var(--u) * 150);line-height:1.3;border-radius:calc(var(--u) * 16)}
[data-composition-id^="lv-"] .lv-a.lv-chip--s.lv-chip--x{white-space:nowrap;max-width:none}
[data-composition-id^="lv-"] .lv-note--fut{font-size:calc(var(--u) * 15);letter-spacing:.1em;color:var(--cx-ink-2)}
@container (orientation: portrait){
  [data-composition-id^="lv-"] .lv-note--fut{font-size:calc(var(--u) * 22);letter-spacing:.06em}
  [data-composition-id^="lv-"] .lv-a.lv-chip--s{max-width:none;white-space:nowrap}
  /* a long label wraps inside its column instead of running off the frame (the VIX "My line · 29.27" clip) */
  [data-composition-id^="lv-"] .lv-a.lv-zl{white-space:normal;max-width:calc(var(--u) * 250)}
  [data-composition-id^="lv-"] .lv-a.lv-zl .lv-zl__v{overflow-wrap:anywhere}
  [data-composition-id^="lv-"] .lv-a.lv-tag{white-space:normal;max-width:calc(var(--u) * 250)}
  [data-composition-id^="lv-"] .lv-tag__d{font-size:calc(var(--u) * 24);letter-spacing:.04em}
}
/* THE LOWER BAND (kit text surfaces, glass.css: .ts .ts--read .ts--note .ts--fact .ts--source). One composed band on the stage grid: Sim's read on the
   left (green glass, gold plate "MY READ"), a guardrail note beside or above it, the source quietly at the far right. Only layout and type size live
   here; the glass look is glass.css's. Sized with --u, never over the plot (frames stop above it: make_shot.plan_frames). */
[data-composition-id^="lv-"] .lvb-band{position:absolute;left:1.8%;right:3%;bottom:2.6%;display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:end;column-gap:calc(var(--u) * 24);pointer-events:none}
[data-composition-id^="lv-"] .lvb-band > *{margin:0;position:static;white-space:nowrap}
/* the glass blocks hug their words: tight padding in stage units, no wrapping of the plate */
[data-composition-id^="lv-"] .lvb-band > .ts:not(.ts--source){padding:calc(var(--u) * 10) calc(var(--u) * 20);inline-size:max-content;max-inline-size:none;border-radius:calc(var(--u) * 14)}
/* the read is ONE block on one row: the gold plate, then the words (they wrap under it only when they must) */
[data-composition-id^="lv-"] .lvb-band > .lvb-read{grid-column:1 / 3;display:block;white-space:normal;font-size:calc(var(--u) * 22);line-height:1.5;max-inline-size:calc(var(--u) * 1230) !important;inline-size:fit-content !important}
[data-composition-id^="lv-"] .lvb-read .ts__label{margin-right:calc(var(--u) * 12);vertical-align:.08em}
[data-composition-id^="lv-"] .lvb-read .ts__text{display:inline;letter-spacing:.02em}
[data-composition-id^="lv-"] .lvb-read .ts__label{white-space:nowrap}
[data-composition-id^="lv-"] .lvb-note{grid-column:2;justify-self:start;font-size:calc(var(--u) * 16);letter-spacing:.07em;line-height:1.5;text-transform:uppercase;white-space:normal;inline-size:auto !important;max-inline-size:calc(var(--u) * 1010) !important}
[data-composition-id^="lv-"] .lvb-src{grid-column:3;grid-row:1;justify-self:end;text-align:right;white-space:normal;max-width:calc(var(--u) * 560);font-size:calc(var(--u) * 15);letter-spacing:.08em;line-height:1.45;color:var(--cx-faint)}
@container (orientation: portrait){
  [data-composition-id^="lv-"] .lvb-band{left:3%;right:3%;bottom:2%;grid-template-columns:1fr;row-gap:calc(var(--u) * 10)}
  [data-composition-id^="lv-"] .lvb-read,[data-composition-id^="lv-"] .lvb-note,[data-composition-id^="lv-"] .lvb-src{grid-column:1;justify-self:start}
  [data-composition-id^="lv-"] .lvb-band > .lvb-read{grid-column:1;font-size:calc(var(--u) * 28);max-inline-size:100% !important;inline-size:100% !important}
  [data-composition-id^="lv-"] .lvb-note{max-inline-size:100% !important;font-size:calc(var(--u) * 23);letter-spacing:.03em;line-height:1.4}
  [data-composition-id^="lv-"] .lvb-src{grid-row:auto;text-align:left;max-width:none;font-size:calc(var(--u) * 22);letter-spacing:.03em}
}
@media (prefers-reduced-motion: reduce){[data-composition-id^="lv-"] .lv-w:not(.lv-w--last){display:none}}