/* ============ Fabric.Media — SIGNAL v2 ============ */
:root{--display:'Archivo',system-ui,sans-serif;--ui:'Archivo',system-ui,sans-serif;--body:'Newsreader',Georgia,serif;--mono:'IBM Plex Mono',ui-monospace,monospace;--wrap:1280px;--pad:32px}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:#7E7A74;font-family:var(--ui);-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}

/* ---- theme ---- */
html{background:#7E7A74}
.sg{--paper:#FAF8F4;--el:#FFFFFF;--el2:#F2EFE9;--ink:#131211;--ink2:#4A453E;--ink3:#7E7871;--ln:#E4DFD6;--ln2:#CFC8BC;--acc:#2340D6;--acc2:#5B72E8;--acc-t:#EDEFFD;--b1:#2340D6;--b2:#B4400F;--b3:#146152;--b4:#5A3FBF;--b5:#0E7490;--b6:#B4266E;--warn:#B4400F;--ok:#12805C;background:var(--paper);color:var(--ink);min-height:100vh}
.sg[data-mode=dark]{--paper:#0D0D0F;--el:#141418;--el2:#1C1C22;--ink:#EDE9E3;--ink2:#A9A39B;--ink3:#726C65;--ln:rgba(255,255,255,.11);--ln2:rgba(255,255,255,.2);--acc:#7D93FF;--acc2:#A9BAFF;--acc-t:rgba(125,147,255,.14);--b1:#7D93FF;--b2:#FF9166;--b3:#4FC3A1;--b4:#A98BFF;--b5:#53C6DE;--b6:#F06BAB;--warn:#FF9166;--ok:#4FC3A1}
.sg a:hover{color:var(--acc)}
.in{max-width:var(--wrap);margin:0 auto;padding:0 var(--pad)}

/* ============ PLATES — generated key art, no photography ============ */
.plate{position:relative;overflow:hidden;background:var(--el2);isolation:isolate;container-type:inline-size}
/* Breaking intrusion: house red enters a plate ONLY while the desk's live
   'breaking' tag is on the post — rendered from the tag itself, so clearing
   Breaking in the desk removes the treatment on the next render. Red is
   reserved for this; no other plate element may use it. */
/* Monument cut: ledger number at plate scale, atmosphere beneath it, and
   provenance demoted to edge code. Injected by signal.js from signal-meta,
   so a post without a stamped number simply has no monument. */
.plate .fog{position:absolute;inset:0;z-index:3;pointer-events:none;background:linear-gradient(180deg,transparent 52%,rgba(8,8,12,.34) 100%),radial-gradient(120% 88% at 50% 122%,rgba(8,8,12,.4),transparent 60%)}
/* Monument: 35% white (65% transparent, owner call), NORMAL blend. Screen blends compound — every overlap
   (numeral x bloom, numeral x BREAKING) multiplied brightness and glowed.
   Plain alpha lightens on overlap too, but bounded, and colors underneath
   keep their hue. Tracking -.085em, size set by signal.js fit-to-rails with
   a height clamp so there is always real air, never a sliver. */
/* Everything on the plate scales WITH the plate (owner call 2026-08-16:
   the card-size render, where fixed px sizes read proportionally huge, is
   the layout — so the proportions are now the law at every size).
   Reference: 20px label / 13px title / 9px edge on a 690px plate.
   cqw ONLY: this label was at top:4.5cqh, and cqh does not exist in a
   container-type:inline-size container, so it silently resolved against the
   VIEWPORT height -- the label slid up and down with the browser window and
   at most window sizes landed on top of the badge that used to sit here. */
.plate .brk-x{position:absolute;inset:0;z-index:5;pointer-events:none;box-shadow:inset 0 0 0 3px #E8412B}
.plate .brk-x::before{content:"";position:absolute;inset:0;mix-blend-mode:screen;background:radial-gradient(60% 90% at 76% 20%,rgba(232,65,43,.55),transparent 62%)}
.plate .brk-x::after{content:"BREAKING";position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);font:900 13cqw/1 Archivo,Helvetica,Arial,sans-serif;letter-spacing:.08em;color:#E8412B;text-shadow:0 0 30px rgba(232,65,43,.55),0 0 8px rgba(0,0,0,.35);white-space:nowrap}
/* Burn-in scales with its plate everywhere (owner: "that's it. Do it
   everywhere", 2026-08-16). Cards, idents and strips inherit the same
   proportional voice; the post hero overrides position and shows the title. */
.plate .mk{position:absolute;left:2cqw;bottom:8%;z-index:5;font-family:var(--mono);font-size:max(7px,1.9cqw);letter-spacing:.24em;text-transform:uppercase;color:rgba(255,255,255,.5);line-height:1.75;max-width:70%}
/* Hero burn-in: the human title, matched to the monument's transparency.
   The seed lives in data-seed, so this is display only. */
.art-plate .mk,.plate.dressed .mk{color:rgba(255,255,255,.4);max-width:46%;white-space:normal;line-height:1.75;
  font-size:max(8px,1.9cqw);letter-spacing:.24em;left:2cqw;bottom:auto;top:56%}
/* ---- title-card dress (owner-approved 2026-08-26) ----
   Every plate on every surface: ghost channel word, headline, credit, mark.
   All sizes are cqw so one rule serves a 296px card and an 840px hero; the
   ghost word's size is set by signal.js, which MEASURES the word rather than
   guessing (MEASUREMENT at a fixed size cropped both edges). The quote, the
   verification eyebrow and the ledger number are gone from the artwork -- the
   quote and its claim live in the page body now, where they can be checked. */
.plate.dressed .ghostw{position:absolute;left:50%;top:36%;transform:translate(-50%,-50%);
  z-index:1;font-family:var(--display);font-weight:900;line-height:.8;letter-spacing:-.06em;
  text-transform:uppercase;color:rgba(255,255,255,.10);white-space:nowrap;pointer-events:none}
.plate.dressed .cardhd{position:absolute;left:2.6cqw;right:6cqw;bottom:12.5cqw;z-index:6;margin:0;
  font-family:var(--display);font-weight:800;line-height:1.02;letter-spacing:-.035em;color:#fff;
  text-shadow:0 2px 34px rgba(6,6,10,.5);text-wrap:balance}
.plate.dressed .attr{position:absolute;left:2.6cqw;right:9cqw;bottom:4cqw;z-index:6;
  font-family:var(--mono);font-size:max(9px,1.834cqw);font-weight:600;letter-spacing:.14em;
  color:rgba(255,255,255,.72)}
.plate.dressed .attr b{font-weight:600;color:rgba(255,255,255,.95)}
.plate.dressed .attr .src{color:rgba(255,255,255,.72)}
.plate.dressed .attr .dt{color:rgba(255,255,255,.62)}
.plate.dressed .attr .sep{color:rgba(255,255,255,.45)}
/* Thin strips (t2, 16/5.4) carry the headline and mark only -- a credit there
   would be 6px and the card prints the byline in type right beneath it. */
/* The mark signs every plate. */
.art-head h1,.t1>h2,.t2>h3{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;
  clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0}
/* signal.js adds .shown when the plate declines the headline (too small a
   card): the headline can never end up in neither place. */
.t1>h2.shown,.t2>h3.shown,.art-head h1.shown{position:static;width:auto;height:auto;overflow:visible;
  clip:auto;clip-path:none;white-space:normal}
.t1>h2.shown{margin:14px 0}
.t2>h3.shown{margin:11px 0 9px}
.art-head h1.shown{margin:16px 0 18px}
/* The lead card's hover cue moved with the headline. */
.t1:hover .plate.dressed .cardhd{color:#fff;text-decoration:underline;text-decoration-thickness:2px;
  text-underline-offset:5px;text-decoration-color:var(--acc)}
/* THE DATE, as a corner stamp (owner pick B, 2026-08-27). Top-left, the one
   corner every motif leaves empty, diagonally opposite the mark. It is on the
   plate because the plate is now the post's main image AND its share image,
   and a share with no time context is a claim with no date on it. Our PUBLISH
   date, deliberately: the provenance rail still carries SIGNAL PUBLISHED and
   SOURCE PUBLISHED separately, and neither of those is what a share claims.
   Same max(px, cqw) pattern as .attr — the floor keeps it legible on a 343px
   card, the cqw keeps it proportional on a 1200px plate. */
.plate.dressed .stamp{position:absolute;left:2.6cqw;top:3.4cqw;z-index:6;font-family:var(--mono);font-size:max(8px,1.834cqw);font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:rgba(255,255,255,.72)}
.plate.dressed .fmark{position:absolute;right:2.2cqw;bottom:1.9cqw;z-index:7;
  font-family:var(--display);font-size:max(16px,4.1cqw);font-weight:800;letter-spacing:-.02em;
  color:rgba(255,255,255,.85);pointer-events:none}
.plate.dressed .fmark s{text-decoration:none;color:#A9BAFF}
.plate .cap{position:absolute;right:12px;bottom:10px;z-index:5;font-family:var(--mono);font-size:9px;letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.5)}
.plate::before,.plate::after{content:"";position:absolute;inset:0}

/* ============ FABRICATED — pipeline-validation posts, pre-cadence ============
   Not an error state: a deliberate, confident marker that this post was
   published while the pipeline was being built and proven, not by the
   running system. Applied via an internal Ghost tag so it can be lifted in
   one place (scripts/tag-pretest-posts.mjs) once real cadence content
   dominates the archive. */
.fab-ribbon{position:absolute;top:0;right:0;z-index:7;width:132px;height:132px;overflow:hidden;pointer-events:none}
.fab-ribbon span{position:absolute;top:24px;right:-36px;width:180px;transform:rotate(45deg);background:var(--warn);color:#fff;font-family:var(--mono);font-size:9px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;text-align:center;padding:5px 0;box-shadow:0 2px 6px rgba(0,0,0,.28)}
.fab-strip{display:flex;align-items:center;gap:10px;background:var(--ink);color:var(--paper);font-family:var(--mono);font-size:10.5px;letter-spacing:.02em;padding:11px var(--pad);margin:0 calc(var(--pad) * -1) 22px}
.fab-strip b{color:var(--warn);font-weight:700;letter-spacing:.14em;text-transform:uppercase;flex:none}
.fab-strip i{width:6px;height:6px;border-radius:50%;background:var(--warn);flex:none;animation:sgPulse 2.4s infinite}

/* ramp — the house gradient, grid ruled */
.plate[data-p=ramp]{background:linear-gradient(calc(146deg + var(--ga,0deg)),#0A0A0C 0%,#16246E 30%,#2340D6 64%,#7D93FF 100%)}
.plate[data-p=ramp]::before{background:radial-gradient(70% 110% at var(--gx,82%) var(--gy,24%),rgba(169,186,255,.5),transparent 62%)}
.plate[data-p=ramp]::after{background:repeating-linear-gradient(90deg,rgba(255,255,255,.09) 0 1px,transparent 1px calc(46px*var(--gs,1))),repeating-linear-gradient(0deg,rgba(255,255,255,.06) 0 1px,transparent 1px calc(46px*var(--gs,1)));opacity:var(--gi,1)}

/* field — dot matrix over a two-blob ground */
.plate[data-p=field]{background:linear-gradient(calc(160deg + var(--ga,0deg)),#101018,#1A1A24)}
.plate[data-p=field]::before{background:radial-gradient(52% 76% at var(--gx,24%) var(--gy,32%),rgba(35,64,214,.9),transparent 64%),radial-gradient(46% 68% at var(--gx2,80%) var(--gy2,76%),rgba(180,64,15,.6),transparent 62%)}
.plate[data-p=field]::after{background:radial-gradient(circle at center,rgba(255,255,255,.42) 1px,transparent 1.1px) 0 0/calc(11px*var(--gs,1)) calc(11px*var(--gs,1));opacity:calc(.7*var(--gi,1))}

/* rule — diagonal hatch, single accent */
.plate[data-p=rule]{background:linear-gradient(calc(120deg + var(--ga,0deg)),#0B0B0D 0%,#141B4A 58%,#2340D6 100%)}
.plate[data-p=rule]::before{background:repeating-linear-gradient(calc(58deg + var(--ga,0deg)),rgba(255,255,255,.4) 0 2px,transparent 2px calc(12px*var(--gs,1)));opacity:calc(.34*var(--gi,1))}
.plate[data-p=rule]::after{background:linear-gradient(200deg,transparent 40%,rgba(8,8,10,.68) 100%)}

/* arc — concentric rings, measurement */
.plate[data-p=arc]{background:linear-gradient(calc(150deg + var(--ga,0deg)),#0A0F14 0%,#0F3F44 52%,#20A08A 100%)}
.plate[data-p=arc]::before{background:repeating-radial-gradient(circle at var(--gx,18%) var(--gy,84%),transparent 0 calc(22px*var(--gs,1)),rgba(255,255,255,.32) calc(22px*var(--gs,1)) calc(22px*var(--gs,1) + 1px))}
.plate[data-p=arc]::after{background:repeating-radial-gradient(circle at var(--gx,18%) var(--gy,84%),transparent 0 calc(22px*var(--gs,1)),rgba(255,255,255,.32) calc(22px*var(--gs,1)) calc(22px*var(--gs,1) + 1px)),linear-gradient(160deg,rgba(8,8,10,.5),transparent 56%);opacity:var(--gi,1)}/* rings duplicated onto ::after because the feature photo (.plate-photo, z-index:1)   paints ABOVE ::before — Measurement plates with photos showed no pattern at all */

/* split — hard geometric cut, two grounds */
.plate[data-p=split]{background:#0A0A0C}
.plate[data-p=split]::before{background:linear-gradient(calc(146deg + var(--ga,0deg)),#16246E,#2340D6 62%,#7D93FF);clip-path:polygon(var(--gx,34%) 0,100% 0,100% 100%,var(--gy,12%) 100%)}
.plate[data-p=split]::after{background:repeating-linear-gradient(0deg,rgba(255,255,255,.09) 0 1px,transparent 1px calc(14px*var(--gs,1)));opacity:var(--gi,1)}

/* ember — the agencies beat */
.plate[data-p=ember]{background:linear-gradient(calc(146deg + var(--ga,0deg)),#0C0806 0%,#5C1B08 44%,#E4622E 100%)}
.plate[data-p=ember]::before{background:radial-gradient(60% 90% at var(--gx,78%) var(--gy,30%),rgba(255,168,120,.5),transparent 62%)}
.plate[data-p=ember]::after{background:repeating-linear-gradient(90deg,rgba(255,255,255,.08) 0 1px,transparent 1px calc(46px*var(--gs,1)));opacity:var(--gi,1)}

/* violet — streaming */

/* ---- data plate: the art IS the story's data ---- */
.plate[data-p=data]{background:linear-gradient(160deg,#0A0A0C,#12142C)}
.plate[data-p=data]::before{background:repeating-linear-gradient(0deg,rgba(255,255,255,.055) 0 1px,transparent 1px 26px)}
.plate[data-p=data]::after{display:none}
.dplot{position:absolute;inset:auto 7% 22% 7%;height:56%;display:flex;align-items:flex-end;gap:2.4%;z-index:2}
.dplot i{flex:1;background:linear-gradient(180deg,var(--acc2),rgba(125,147,255,.16));display:block;min-height:3px}
.dplot i.hi{background:linear-gradient(180deg,#fff,var(--acc2))}
.dhead{position:absolute;left:7%;top:16%;z-index:3;font-family:var(--mono);font-size:9px;letter-spacing:.2em;text-transform:uppercase;color:rgba(255,255,255,.62)}
.dhead b{display:block;font-family:var(--display);font-size:30px;font-weight:800;letter-spacing:-.03em;color:#fff;margin-top:7px;text-transform:none}
.plate[data-p=data] .mk,.plate[data-p=data] .cap{color:rgba(255,255,255,.45)}

/* ============ STRIP + MASTHEAD ============ */
.sg-strip{background:var(--el);border-bottom:1px solid var(--ln);font-family:var(--mono)}
.sg-strip .in{display:flex;align-items:center;gap:16px;height:38px;overflow:hidden}
.sg-strip .k{display:inline-flex;align-items:center;gap:7px;font-size:9px;letter-spacing:.22em;text-transform:uppercase;color:var(--warn);flex:none}
.sg-strip .k i{width:5px;height:5px;border-radius:50%;background:var(--warn);animation:sgPulse 2.4s infinite}
@keyframes sgPulse{0%,100%{opacity:1}50%{opacity:.25}}
.sg-rot{position:relative;flex:1;min-width:0;height:38px}
.sg-rot a{position:absolute;inset:0;display:flex;align-items:center;gap:14px;opacity:0;transition:opacity .4s;pointer-events:none}
.sg-rot a.on{opacity:1;pointer-events:auto}
.sg-rot time{font-size:10.5px;color:var(--ink3);flex:none}
.sg-rot .bt{font-size:9px;letter-spacing:.16em;text-transform:uppercase;color:var(--acc);flex:none}
.sg-rot .t{font-family:var(--display);font-size:14px;font-weight:600;letter-spacing:-.015em;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sg-dots{display:flex;gap:5px;flex:none}
.sg-dots i{width:5px;height:5px;border-radius:50%;background:var(--ln2)}
.sg-dots i.on{background:var(--warn)}

.sg-head{position:sticky;top:0;z-index:60;background:var(--paper);border-bottom:1px solid var(--ink)}
.sg-head .in{display:flex;align-items:center;gap:26px;height:66px}
.wm{flex:none;font-family:var(--display);font-size:23px;font-weight:800;letter-spacing:-.042em;color:var(--ink);white-space:nowrap}
.wm s{text-decoration:none;color:var(--acc)}
.wm i{font-style:normal;font-weight:400;color:var(--ink2)}
.sg-nav{display:flex;gap:22px;min-width:0;overflow-x:auto;scrollbar-width:none;-ms-overflow-style:none}
.sg-nav::-webkit-scrollbar{display:none}
.sg-nav a{flex:none;white-space:nowrap;font-size:12.5px;font-weight:600;letter-spacing:-.005em;color:var(--ink2);padding:5px 0;border-bottom:2px solid transparent}
.sg-nav a:hover,.sg-nav a.on{color:var(--ink);border-bottom-color:var(--acc)}
.sg-acts{flex:none;margin-left:auto;display:flex;align-items:center;gap:12px}
.msw{display:inline-flex;border:1px solid var(--ln2);border-radius:999px;overflow:hidden;font-family:var(--mono);font-size:9px;letter-spacing:.14em;text-transform:uppercase}
.msw button{font:inherit;letter-spacing:inherit;text-transform:inherit;border:0;background:transparent;color:var(--ink3);padding:7px 11px;cursor:pointer}
.msw button.on{background:var(--ink);color:var(--paper)}
.sg-k{font-family:var(--mono);font-size:10.5px;color:var(--ink3);border:1px solid var(--ln);padding:6px 8px;display:inline-flex;align-items:center;line-height:0}
.sg-k:hover{color:var(--acc);border-color:var(--acc)}
.sg-btn{display:inline-flex;align-items:center;height:34px;padding:0 17px;background:var(--acc);color:#fff;font-size:12.5px;font-weight:700;letter-spacing:-.005em;border-radius:999px}
.sg-btn:hover{background:var(--ink);color:var(--paper)}
.sg-burger{display:none;flex-direction:column;justify-content:center;gap:4px;width:34px;height:34px;padding:0 7px;border:1px solid var(--ln2);background:transparent;cursor:pointer;border-radius:2px}
.sg-burger span{display:block;height:1.5px;background:var(--ink)}
.sg-burger:hover{border-color:var(--ink)}

.sg-sub{border-bottom:1px solid var(--ln)}
.sg-sub .in{display:flex;align-items:center;gap:26px;height:44px;font-family:var(--mono);font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--ink3)}
.sg-sub .tag{letter-spacing:.24em}
.sg-sub .st{margin-left:auto;display:flex;gap:24px}
.sg-sub .st b{font-family:var(--display);font-size:12.5px;font-weight:800;letter-spacing:-.02em;color:var(--ink);margin-right:6px}

/* ============ TIERS ============ */
.tier{display:inline-flex;align-items:center;gap:6px;font-family:var(--mono);font-size:9px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;padding:4px 8px;border:1px solid currentColor;border-radius:2px}
.tier.ex{color:var(--warn)}
.tier.an{color:var(--acc)}
.tier.br{color:var(--ink3)}
.tier.si{color:var(--ok)}
/* channel badges — one hue per section, matching the plate palette */
.tier.ch{color:var(--ink2)}
.tier.ch-measurement{color:var(--b3)}
.tier.ch-streaming{color:var(--b4)}
.tier.ch-ad-tech{color:var(--b1)}
.tier.ch-agencies{color:var(--b2)}
.tier.ch-retail-media{color:var(--b5)}
.tier.ch-creators{color:var(--b6)}
.kick{font-family:var(--mono);font-size:9px;letter-spacing:.2em;text-transform:uppercase;color:var(--acc);display:flex;align-items:center;gap:11px;flex-wrap:wrap}
.kick .id{color:var(--ink3)}
.byl{font-family:var(--mono);font-size:10.5px;letter-spacing:.06em;color:var(--ink3);display:flex;gap:12px;align-items:center;flex-wrap:wrap}
.byl b{font-weight:500;color:var(--ink2)}
.byl .src{color:var(--acc)}

/* T1 exclusive */
.ch-lead{margin:0 0 30px;padding-bottom:28px;border-bottom:2px solid var(--ink)}
.t1{display:block}
.t1 .plate{aspect-ratio:16/8;margin:16px 0 18px}
.t1 h2{font-family:var(--display);font-size:44px;font-weight:800;letter-spacing:-.042em;line-height:1.01;margin:14px 0 14px;color:var(--ink);text-wrap:balance}
.t1 p{font-family:var(--body);font-size:18px;line-height:1.46;color:var(--ink2);margin:0 0 16px;max-width:58ch}
.t1:hover h2{color:var(--acc)}

/* T2 analysis — no plate, ruled */
/* "Why it matters" — the desk's consequence line. Optional everywhere: most
   signals do not carry one, and the absence is meaningful, so nothing here
   reserves space. Cards hydrate it from signal-meta via signal.js. */
.wim{display:block;margin:10px 0 0;padding:9px 0 0;border-top:1px solid var(--ln)}
.wim[hidden]{display:none}
.wim .lb{display:block;font-family:var(--mono);font-size:9px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--acc);margin-bottom:5px}
.wim p{margin:0;font-family:var(--body);font-size:14px;line-height:1.45;color:var(--ink)}
.t1 .wim p{font-size:16px}
/* Lead-card provenance. Fills the column the lead story used to leave empty,
   with the desk's own receipts rather than furniture. Mono throughout: this
   is apparatus, and must never compete with the headline above it. */
/* THE CREDIT ROW — the other half of comps option 4, "the plate is ours"
   (owner, 2026-08-27; label approved "Drafted from", 2026-08-28).
   The credit came off the artwork on 2026-08-27 and this is where it went. It
   shipped without this row for a day: the lead card fell back to the older
   .leadprov definition list and the Latest grid showed no credit at all, which
   is what the owner caught.

   Reporter LEADS and links to their archive, outlet follows — authorship
   elevated (owner, 2026-08-27). With no byline the publication is the credit
   and stands alone. The label is "Drafted from", NOT "Reported by": A53
   retired first-filed claims because day-precision dates cannot establish who
   reported first, and this row must not quietly reintroduce one.

   Lives here rather than in signal-feed/feed.css because v2's feed card uses
   the same component — putting it in the overlay is how the two would drift.

   Sizes snapped to the type scale on the way in: the prototype these rules
   came from is not linted, and it carried 15px / 10px / 9.5px, none of which
   is a step. The linter caught all three. */
.cred{margin:16px 0 0;padding-top:13px;border-top:1px solid var(--ln)}
.cred[hidden]{display:none}
.cred .lb{display:block;font-family:var(--mono);font-size:9px;font-weight:600;letter-spacing:.2em;
  text-transform:uppercase;color:var(--ink3);margin-bottom:7px}
.cred .ln{display:flex;align-items:baseline;gap:9px;flex-wrap:wrap}
.cred .who{font-family:var(--display);font-size:16px;font-weight:700;letter-spacing:-.018em;color:var(--ink);
  border-bottom:1.5px solid var(--ch,var(--acc));padding-bottom:1px}
.cred a.who:hover{color:var(--acc);border-bottom-color:var(--acc)}
.cred .at{font-family:var(--mono);font-size:10.5px;letter-spacing:.05em;color:var(--ink2)}
.cred .more{font-family:var(--mono);font-size:9px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink3)}
/* Story page: the same line, given a block of its own under the dek. */
[data-wim-slot]:empty{display:none}
[data-wim-slot] .art-wim{margin:16px 0 4px}
p.art-wim,.art-wim{margin:18px 0 22px;padding:14px 18px;border-left:3px solid var(--acc);background:var(--el2);font-family:var(--body);font-size:18px;line-height:1.5;color:var(--ink)}
.art-wim .lb{display:block;font-family:var(--mono);font-size:9px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--acc);margin-bottom:7px}
.art-wim p{margin:0;font-family:var(--body);font-size:18px;line-height:1.5;color:var(--ink)}
.art-wim .lb{display:block}
.t2{display:block;padding-top:15px;border-top:2px solid var(--ink)}
/* Card thumb: the story's own plate at band scale. Same seed as the hero,
   so a story looks like itself everywhere. Kept quiet — no monument, no
   edge code; those are hero apparatus (owner call 2026-08-16). */
/* Bottom margin exists because the h3 that used to carry the gap is now
   visually hidden (the plate is the headline): without it the excerpt sat
   flush against the artwork. 14px ~ the t1 plate's 18px scaled to t2 width. */
.t2 .plate{aspect-ratio:16/8;margin:12px 0 14px}
.t2 h3{font-family:var(--display);font-size:21px;font-weight:700;letter-spacing:-.03em;line-height:1.13;margin:11px 0 9px;color:var(--ink);text-wrap:pretty}
.t2 p{font-family:var(--body);font-size:16px;line-height:1.46;color:var(--ink2);margin:0 0 11px}
.t2 .cred{margin-top:11px;padding-top:11px}
.t2 .cred .who{font-size:14px}
.t2:hover h3{color:var(--acc)}

/* T3 brief — text only, dense */
.t3{display:grid;grid-template-columns:46px 1fr;gap:12px;padding:10px 0;border-bottom:1px solid var(--ln);align-items:start}
.t3 time{font-family:var(--mono);font-size:10.5px;color:var(--acc);padding-top:3px}
.t3 h4{font-family:var(--display);font-size:14px;font-weight:600;letter-spacing:-.018em;line-height:1.26;margin:0;color:var(--ink)}
.t3 .bt{font-family:var(--mono);font-size:9px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink3);margin-top:5px;display:block}
.t3:hover h4{color:var(--acc)}

/* ============ HOME ============ */
.sg-home{display:grid;grid-template-columns:minmax(0,1fr) 296px;gap:36px;padding:26px 0 40px}
.sg-lead{min-width:0;display:flex;flex-direction:column}
.lead-split{display:grid;grid-template-columns:minmax(0,1.55fr) 1fr;gap:32px;padding-bottom:26px;border-bottom:1px solid var(--ink)}
.also{display:flex;flex-direction:column;gap:22px;border-left:1px solid var(--ln);padding-left:32px}
.also h5{font-family:var(--mono);font-size:9px;letter-spacing:.22em;text-transform:uppercase;color:var(--ink3);margin:0 0 2px}

.secH{display:flex;align-items:baseline;gap:14px;padding:26px 0 10px;border-bottom:2px solid var(--ink);margin-bottom:18px}
.secH h2{font-family:var(--display);font-size:18px;font-weight:800;letter-spacing:.02em;text-transform:uppercase;margin:0}
.secH .sub{font-family:var(--body);font-style:italic;font-size:16px;color:var(--ink3)}
.secH .more{margin-left:auto;font-family:var(--mono);font-size:9px;letter-spacing:.16em;text-transform:uppercase;color:var(--acc)}
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:28px}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:32px}
.wirelist{display:flex;flex-direction:column}

/* rail */
.rail{display:flex;flex-direction:column;min-width:0}
.railH{display:flex;align-items:center;gap:8px;font-family:var(--mono);font-size:9px;letter-spacing:.2em;text-transform:uppercase;color:var(--ink3);padding-bottom:9px;border-bottom:1px solid var(--ink);margin-bottom:12px}
.railH i{width:5px;height:5px;border-radius:50%;background:var(--warn)}
.railH .ct{margin-left:auto;color:var(--acc)}
/* The house label above a promo: full ink, not faint — Eleanor's "disappears"
   was this label at var(--ink3) against the saturated card below it. */
.railH--house{color:var(--ink);border-bottom-color:var(--ink)}
.boltcard{position:relative;overflow:hidden;isolation:isolate;padding:22px 20px;margin-bottom:26px;background:linear-gradient(146deg,#0A0A0C 0%,#16246E 34%,#2340D6 72%,#7D93FF 100%)}
.boltcard::before{content:"";position:absolute;inset:0;z-index:-1;background:repeating-linear-gradient(90deg,rgba(255,255,255,.07) 0 1px,transparent 1px 40px)}
.boltcard .sr{font-family:var(--mono);font-size:9px;letter-spacing:.22em;text-transform:uppercase;color:rgba(255,255,255,.6);display:block;margin-bottom:11px}
.boltcard .nm{font-family:var(--display);font-size:38px;font-weight:900;letter-spacing:-.045em;line-height:.9;color:#fff;margin:0 0 11px}
.boltcard p{font-family:var(--body);font-size:14px;line-height:1.44;color:rgba(247,245,240,.82);margin:0 0 15px}
.boltcard input{width:100%;height:36px;padding:0 11px;border:0;background:rgba(255,255,255,.14);color:#fff;font-family:var(--ui);font-size:12.5px;margin-bottom:7px}
.boltcard input::placeholder{color:rgba(255,255,255,.5)}
.boltcard button{width:100%;height:36px;border:0;background:#fff;color:#16246E;font-family:var(--ui);font-weight:800;font-size:12.5px;letter-spacing:.06em;text-transform:uppercase;cursor:pointer}
.boltcard .fine{font-family:var(--mono);font-size:9px;letter-spacing:.1em;text-transform:uppercase;color:rgba(255,255,255,.52);margin:9px 0 0}
.railnum{list-style:none;margin:0 0 26px;padding:0}
.railnum li{border-bottom:1px solid var(--ln)}
.railnum a{display:grid;grid-template-columns:22px 1fr;gap:11px;padding:10px 0;align-items:start}
.railnum .n{font-family:var(--mono);font-size:10.5px;color:var(--acc)}
.railnum h4{margin:0;font-family:var(--display);font-size:14px;font-weight:600;letter-spacing:-.018em;line-height:1.26}
/* ============ SISTER PUBLICATIONS — "editorial embassy" ============
   Owner-approved 2026-08-25. Each unit wears its OWN publication's design
   system rather than Fabric's, so the rail reads as two guest columns and
   not as two Fabric boxes. Tokens are taken from source, not guessed:
   The Measure from themeasure.net/assets/css/the-measure.css (vermilion
   #E8412B, ink #14110F, hairline #E7E2DA, Archivo headlines); TVREV from
   the Ghost handoff kit's tokens/colors.css (signal blue #2456ff, warm
   neutrals, Newsreader body) -- and #2456ff is also the accent-color the
   gated tvrev2beta2 beta serves, which corroborates the kit.

   Newsreader and Archivo are already loaded by this theme, and Newsreader
   is genuinely TVREV's --font-body, so the borrowed voices cost no extra
   font requests. Local tokens are literals on purpose: they are another
   publication's palette, not ours, and must not drift with our own. */
.promo{padding:14px;margin-bottom:12px;display:block}
.promo .plogo{display:flex;align-items:center;margin-bottom:9px}
.promo .plogo img,.promo .plogo .tvrev-lg{width:auto;display:block}
.promo .plogo .drk{display:none}
.sg[data-mode=dark] .promo .plogo .lgt{display:none}
.sg[data-mode=dark] .promo .plogo .drk{display:block}
/* Shared shell so the two stay siblings: mono kicker with a leading tick,
   a dek, the live feed, a "read" link. Only voice and colour differ. */
.promo .rl{font-family:var(--mono);font-size:9px;font-weight:600;letter-spacing:.17em;
  text-transform:uppercase;display:flex;align-items:center;gap:6px;margin:0}
.promo p{font-size:12.5px;line-height:1.42;margin:7px 0 0}
.promo .pfeed{margin:11px 0 0;padding:11px 0 0;gap:8px}
.promo .pfeed a{font-size:12.5px}
.promo .pfeed .d{font-size:9px}
.promo .go{display:block;margin-top:11px;padding-top:10px;font-family:var(--mono);
  font-size:9px;font-weight:600;letter-spacing:.16em;text-transform:uppercase}

/* ---- TVREV: warm paper, signal blue, serif voice ---- */
.promo--tv{background:#faf8f4;border:1px solid #e0dacb;box-shadow:inset 0 2px 0 0 #2456ff}
.promo--tv .plogo .tvrev-lg{height:19px;color:#16140f}
.promo--tv .rl{color:#2456ff}
.promo--tv .rl i{width:4px;height:4px;border-radius:50%;background:#2456ff;flex:none}
.promo--tv p{font-family:var(--body);font-style:italic;color:#423d33}
.promo--tv .pfeed{border-top:1px solid #e0dacb}
.promo--tv .pfeed a{font-family:var(--body);font-weight:500;line-height:1.32;color:#16140f}
.promo--tv .pfeed a:hover{color:#2456ff}
.promo--tv .pfeed .d{color:#7a7464}
.promo--tv .go{border-top:1px solid #e0dacb;color:#2456ff}
.sg[data-mode=dark] .promo--tv{background:#1b1813;border-color:#332e25;box-shadow:inset 0 2px 0 0 #9fb3ff}
.sg[data-mode=dark] .promo--tv .plogo .tvrev-lg{color:#f3efe6}
.sg[data-mode=dark] .promo--tv .rl{color:#9fb3ff}
.sg[data-mode=dark] .promo--tv .rl i{background:#9fb3ff}
.sg[data-mode=dark] .promo--tv p{color:#bdb6a4}
.sg[data-mode=dark] .promo--tv .pfeed{border-color:#332e25}
.sg[data-mode=dark] .promo--tv .pfeed a{color:#f3efe6}
.sg[data-mode=dark] .promo--tv .pfeed a:hover{color:#9fb3ff}
.sg[data-mode=dark] .promo--tv .pfeed .d{color:#7a7464}
.sg[data-mode=dark] .promo--tv .go{border-color:#332e25;color:#9fb3ff}

/* ---- The Measure: white card, vermilion, Archivo voice ---- */
.promo--ms{background:#FFFFFF;border:1px solid #E7E2DA;border-radius:3px}
.promo--ms .plogo img{height:17px}
.promo--ms .rl{color:#E8412B}
.promo--ms .rl i{width:12px;height:2px;background:#E8412B;flex:none}
.promo--ms p{font-family:var(--display);font-size:12px;color:#8A8175}
.promo--ms .pfeed{border-top:1px solid #E7E2DA}
.promo--ms .pfeed a{font-family:var(--display);font-size:12px;font-weight:600;
  letter-spacing:-.012em;line-height:1.3;color:#14110F}
.promo--ms .pfeed a:hover{color:#E8412B}
.promo--ms .pfeed .d{color:#8A8175}
.promo--ms .go{border-top:1px solid #E7E2DA;color:#E8412B}
.sg[data-mode=dark] .promo--ms{background:#1A1714;border-color:#332e2a}
.sg[data-mode=dark] .promo--ms .rl{color:#FF6A4D}
.sg[data-mode=dark] .promo--ms .rl i{background:#FF6A4D}
.sg[data-mode=dark] .promo--ms p{color:#A8A096}
.sg[data-mode=dark] .promo--ms .pfeed{border-color:#332e2a}
.sg[data-mode=dark] .promo--ms .pfeed a{color:#FBFAF7}
.sg[data-mode=dark] .promo--ms .pfeed a:hover{color:#FF6A4D}
.sg[data-mode=dark] .promo--ms .pfeed .d{color:#8A8175}
.sg[data-mode=dark] .promo--ms .go{border-color:#332e2a;color:#FF6A4D}

/* ============ POST — the showcase ============ */
.art-top{padding:26px 0 0}
.art-head{max-width:860px;padding-bottom:26px;border-bottom:1px solid var(--ink)}
.art-head h1{font-family:var(--display);font-size:58px;font-weight:800;letter-spacing:-.046em;line-height:1;margin:16px 0 18px;color:var(--ink);text-wrap:balance}
.art-head .dek{font-family:var(--body);font-size:21px;line-height:1.44;color:var(--ink2);margin:0 0 20px;max-width:60ch}
.art-plate{aspect-ratio:16/8;margin:22px 0 20px}
.art-body{display:grid;grid-template-columns:236px minmax(0,700px) 1fr;gap:0 42px;padding:32px 0 0}
.prov{border-right:1px solid var(--ln);padding-right:26px;display:flex;flex-direction:column;gap:20px;align-self:start;position:sticky;top:126px}
.provH{font-family:var(--mono);font-size:9px;letter-spacing:.2em;text-transform:uppercase;color:var(--acc);padding-bottom:9px;border-bottom:1px solid var(--ink)}
.score{display:flex;align-items:baseline;gap:10px}
.score .n{font-family:var(--display);font-size:46px;font-weight:900;letter-spacing:-.045em;line-height:.86;color:var(--ink)}
.score .m{font-family:var(--mono);font-size:9px;line-height:1.5;letter-spacing:.12em;text-transform:uppercase;color:var(--ink3)}
.score .m b{display:block;color:var(--ok);font-weight:500}
.pdl{display:grid;grid-template-columns:auto 1fr;gap:7px 14px;margin:0;font-family:var(--mono);font-size:10.5px;line-height:1.5}
.pdl dt{color:var(--ink3);letter-spacing:.1em;text-transform:uppercase;font-size:9px;padding-top:2px}
.pdl dd{margin:0;color:var(--ink2)}
.pdl dd em{font-style:normal;color:var(--ink)}
.pdl dd a{color:var(--acc);border-bottom:1px solid var(--acc-t)}
.spark{display:flex;align-items:flex-end;gap:2px;height:34px}
.spark i{flex:1;background:var(--acc);opacity:.5;display:block;min-height:2px}
.spark i:last-child{opacity:1}

.prose{font-family:var(--body);font-size:21px;line-height:1.62;color:var(--ink)}
.sg[data-mode=dark] .prose{color:var(--ink2)}
.prose p{margin:0 0 1.05em}
.prose h2{font-family:var(--display);font-size:25px;font-weight:800;letter-spacing:-.032em;margin:1.7em 0 .5em;color:var(--ink)}
.prose a{color:var(--acc);box-shadow:inset 0 -1px 0 currentColor}
.prose strong{font-weight:600;color:var(--ink)}
.pull{margin:1.7em 0;padding:20px 0;border-top:3px solid var(--acc);border-bottom:1px solid var(--ln)}
.pull q{display:block;font-family:var(--display);font-size:25px;font-weight:700;letter-spacing:-.028em;line-height:1.16;quotes:none;color:var(--ink);margin-bottom:11px}
.pull cite{font-family:var(--mono);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;font-style:normal;color:var(--ink3)}

/* source trail */
.trail{border:1px solid var(--ln);background:var(--el);margin:2em 0;padding:20px 22px}
.trail .h{display:flex;align-items:center;gap:9px;font-family:var(--mono);font-size:9px;letter-spacing:.2em;text-transform:uppercase;color:var(--acc);padding-bottom:11px;border-bottom:1px solid var(--ln);margin-bottom:14px}
.trail .h .ct{margin-left:auto;color:var(--ink3)}
.trail ol{list-style:none;margin:0;padding:0;display:flex;flex-direction:column}
.trail li{display:grid;grid-template-columns:58px 92px 1fr;gap:14px;padding:10px 0;border-bottom:1px solid var(--ln);align-items:baseline}
.trail li:last-child{border-bottom:0;padding-bottom:0}
.trail .dt{font-family:var(--mono);font-size:10.5px;color:var(--ink3)}
.trail .ty{font-family:var(--mono);font-size:9px;letter-spacing:.14em;text-transform:uppercase;color:var(--acc)}
.trail .ty.doc{color:var(--b3)}
.trail .ty.unc{color:var(--warn)}
.trail .tx{font-family:var(--body);font-size:16px;line-height:1.42;color:var(--ink2)}

/* update log */
.ulog{border-left:3px solid var(--warn);padding:4px 0 4px 18px;margin:2em 0;display:flex;flex-direction:column;gap:14px}
.ulog .h{font-family:var(--mono);font-size:9px;letter-spacing:.2em;text-transform:uppercase;color:var(--warn)}
.ulog .u{display:flex;flex-direction:column;gap:5px}
.ulog .dt{font-family:var(--mono);font-size:9px;letter-spacing:.06em;color:var(--ink3)}
.ulog .tx{font-family:var(--body);font-size:16px;line-height:1.45;color:var(--ink2)}

/* datasets */
.dsets{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:2em 0}
.dset{border:1px solid var(--ln);padding:13px 14px;display:block}
.dset:hover{border-color:var(--acc)}
.dset .fn{font-family:var(--mono);font-size:10.5px;color:var(--ink);margin-bottom:6px;word-break:break-all}
.dset .mt{font-family:var(--mono);font-size:9px;letter-spacing:.08em;color:var(--ink3)}

.art-end{max-width:978px;padding-left:278px;margin-top:40px;padding-bottom:50px}
.auth{display:grid;grid-template-columns:58px 1fr;gap:16px;padding:20px 0;border-top:1px solid var(--ink);border-bottom:1px solid var(--ln)}
.auth .av{width:58px;height:58px;border-radius:50%;overflow:hidden;background:var(--el2)}
.auth .av img{width:100%;height:100%;object-fit:cover}
.auth .nm{font-family:var(--display);font-size:16px;font-weight:800;letter-spacing:-.025em;margin-bottom:5px}
.auth .bio{font-family:var(--body);font-size:16px;line-height:1.45;color:var(--ink2);max-width:64ch}
.discl{margin-top:14px;padding:13px 15px;background:var(--el2);border-left:2px solid var(--ln2);font-family:var(--mono);font-size:9px;line-height:1.6;letter-spacing:.04em;color:var(--ink3)}
.discl b{color:var(--ink2);font-weight:500}

/* ============ TOPIC — dossier ============ */
.dos-mast{padding:34px 0 0}
/* Channel ident: the section's own motif as its masthead — network
   programming, one strand per channel. */
.kick .id:empty{display:none}
.chid{aspect-ratio:16/4.6;display:block;margin:0 0 18px}
/* Reporter record card. Deliberately motif-free: paper, rules and type
   only. A channel is ours to brand; a byline is not. */
.repcard{border-top:2px solid var(--ink);border-bottom:1px solid var(--ln);padding:18px 0 20px;margin:0 0 4px}
.repcard h1{margin:10px 0 0}
.repcard .std{margin:12px 0 0;max-width:62ch}
.repcard .repnote{font-family:var(--mono);font-size:9px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink3);margin:14px 0 0;line-height:1.7}
.chid .mk{font-size:10.5px;letter-spacing:.2em;max-width:none}
.chid .chid-t{position:absolute;left:26px;right:26px;bottom:20px;z-index:5}
.chid .chid-t h1{color:#fff;margin:6px 0 0;text-shadow:0 2px 22px rgba(6,6,10,.5)}
.chid .chid-t .kick{color:rgba(255,255,255,.72)}
.chid .chid-t .kick .id{color:rgba(255,255,255,.55)}
.chid .chid-t .tier.br{background:rgba(255,255,255,.16);color:#fff;border-color:transparent}
/* State of play inherits its channel's accent, so the module reads as part
   of that strand rather than generic desk furniture. */
/* One colour per channel, now driving BOTH the edge and the series eyebrow
   through --ch, so the lockup is tinted by the beat it belongs to rather than
   the two being set independently and drifting. */
[data-ch=measurement] .sop{--ch:#20A08A}
[data-ch=agencies] .sop{--ch:#E4622E}
[data-ch=streaming] .sop,[data-ch=ad-tech] .sop{--ch:#2340D6}
[data-ch=retail-media] .sop,[data-ch=creators] .sop,[data-ch=deals] .sop{--ch:#5D6C99}
.sop{border-left-color:var(--ch,var(--acc))}
@media(max-width:700px){.chid{aspect-ratio:16/7}.chid .chid-t{left:16px;right:16px;bottom:14px}}
.dos-mast h1{font-family:var(--display);font-size:64px;font-weight:900;letter-spacing:-.05em;line-height:.94;margin:14px 0 14px;color:var(--ink)}
.dos-mast .std{font-family:var(--body);font-size:18px;line-height:1.46;color:var(--ink2);margin:0 0 22px;max-width:56ch}
.dos-grid{display:grid;grid-template-columns:minmax(0,1fr) 296px;gap:36px;padding-bottom:44px}
/* State of Play — desk-apparatus module, same garment family as .srcq
   (accent left edge, elevated ground, mono label). Dot-motif corner ties
   it to the plate language; no drop cap (it is a brief, not an article). */
.sop{position:relative;border:1px solid var(--ln2);border-left:3px solid var(--acc);background:var(--el2);padding:22px 26px 20px;margin:0 0 30px;overflow:hidden}
.sop::after{content:"";position:absolute;top:10px;right:10px;width:96px;height:44px;opacity:.35;pointer-events:none;background:radial-gradient(circle at center,var(--ink3) 1.1px,transparent 1.3px) 0 0/11px 11px;-webkit-mask-image:linear-gradient(115deg,transparent 20%,#000 70%);mask-image:linear-gradient(115deg,transparent 20%,#000 70%)}
/* THE SERIES LOCKUP (owner, 2026-08-28). State of Play was a mono section
   label at 10.5px — apparatus, a box with a caption. It is a named thing the
   desk publishes on a cadence, so it takes the same treatment as The Signal in
   the rail: a small mono eyebrow over the name at display scale. Deliberately
   the SAME 38px/900/-.045em as .boltcard .nm, because the two are siblings and
   the owner is balancing them against each other. Ink rather than white — this
   one sits on paper. */
.sopH{position:relative;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:0 14px;align-items:baseline;
  padding:0 34px 14px 0;border-bottom:1px solid var(--ln);margin-bottom:16px}
.sopH .sr{grid-column:1/-1;font-family:var(--mono);font-size:9px;font-weight:600;letter-spacing:.2em;
  text-transform:uppercase;color:var(--ch,var(--acc));margin-bottom:7px}
.sopH .sr::before{content:"";display:inline-block;width:6px;height:6px;border-radius:50%;
  background:var(--ch,var(--acc));margin-right:8px;vertical-align:1px}
.sopH h2{font-family:var(--display);font-size:38px;font-weight:900;letter-spacing:-.045em;line-height:.9;
  color:var(--ink);margin:0;text-wrap:balance}
.sopH .as{font-family:var(--mono);font-size:9px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink3);white-space:nowrap}
@media(max-width:620px){.sopH h2{font-size:28px}.sopH{grid-template-columns:1fr}.sopH .as{margin-top:8px}}
.sop .gh-content{font-size:18px}
/* Tightened on the owner's note (2026-08-27): the brief is four dense
   movements, and at 1.5/normal it read like body copy rather than a briefing.
   Line-height to 1.42 and a hair of negative tracking pull each movement into a
   block you can take in at once. SIZE IS UNCHANGED at the scale's 18px — the
   lint caught a 17px here on the first pass and was right: the ask was spacing,
   not a new step in the type scale. */
.sop .sopB{line-height:1.42;letter-spacing:-.006em}
.sop .sopB p{margin:0 0 12px}
.sop .sopB p:last-child{margin-bottom:0}

/* The header is the control. The caret is drawn rather than typed so it keeps
   its weight against the mono label beside it. */
.sop[data-sop] .sopH{cursor:pointer;user-select:none}
/* Absolute now rather than a flex item: a 38px name would drag a baseline-
   aligned caret down beside its descenders. Pinned to the corner it stays
   where the eye expects the control. */
.sop[data-sop] .sopH::after{content:"";position:absolute;right:4px;top:9px;width:9px;height:9px;
  border-right:2px solid var(--ink3);border-bottom:2px solid var(--ink3);
  transform:rotate(45deg);transition:transform .18s ease}
.sop[data-sop][aria-expanded="false"] .sopH::after{transform:rotate(-45deg)}
.sop[data-sop] .sopH:hover::after{border-color:var(--ink)}
.sop[data-sop][aria-expanded="false"] .sopB{display:none}
.sop[data-sop][aria-expanded="false"]{padding-bottom:16px}
.sop[data-sop][aria-expanded="false"] .sopH{padding-bottom:0;border-bottom:0;margin-bottom:0}
.sop[data-sop] .sopH:focus-visible{outline:2px solid var(--acc);outline-offset:3px}
.sop .gh-content p strong{font-family:var(--display);font-size:12.5px;letter-spacing:.02em}
.sop .lede{font-family:var(--body);font-size:18px;line-height:1.5;color:var(--ink);margin:0 0 18px;max-width:66ch}
.moves{display:grid;grid-template-columns:repeat(3,1fr);gap:0;border-top:1px solid var(--ln)}
.moves div{padding:14px 16px 0;border-right:1px solid var(--ln)}
.moves div:last-child{border-right:0}
.moves .l{font-family:var(--mono);font-size:9px;letter-spacing:.16em;text-transform:uppercase;color:var(--ink3);margin-bottom:8px}
.moves .v{font-family:var(--display);font-size:16px;font-weight:700;letter-spacing:-.022em;line-height:1.25;color:var(--ink)}
.moves .v em{font-style:normal;color:var(--warn)}
.moves .v em.up{color:var(--ok)}

.trk{width:100%;border-collapse:collapse;margin-bottom:30px}
.trk caption{text-align:left;font-family:var(--mono);font-size:9px;letter-spacing:.2em;text-transform:uppercase;color:var(--ink3);padding-bottom:10px}
.trk th{font-family:var(--mono);font-size:9px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink3);text-align:left;font-weight:500;padding:9px 12px;border-bottom:1px solid var(--ink)}
.trk td{padding:11px 12px;border-bottom:1px solid var(--ln);font-size:14px;vertical-align:middle}
.trk tr:hover td{background:var(--el)}
.trk .en{font-family:var(--display);font-weight:700;letter-spacing:-.022em;color:var(--ink)}
.trk .mv{font-family:var(--mono);font-size:10.5px}
.trk .mv.up{color:var(--ok)}
.trk .mv.dn{color:var(--warn)}
.trk .mv.fl{color:var(--ink3)}
.trk .nt{font-family:var(--body);font-size:14px;color:var(--ink2);line-height:1.4}
.trk .lk{font-family:var(--mono);font-size:9px;letter-spacing:.1em;text-transform:uppercase;color:var(--acc);white-space:nowrap}

.river{display:flex;flex-direction:column}
.riv{display:grid;grid-template-columns:minmax(0,1fr) 200px;gap:26px;padding:20px 0;border-bottom:1px solid var(--ln);align-items:start}
.riv .plate{aspect-ratio:16/10}
.riv h3{font-family:var(--display);font-size:21px;font-weight:700;letter-spacing:-.03em;line-height:1.14;margin:11px 0 9px;color:var(--ink)}
.riv p{font-family:var(--body);font-size:16px;line-height:1.45;color:var(--ink2);margin:0 0 11px}
.riv:hover h3{color:var(--acc)}
.riv.noart{grid-template-columns:1fr}
.pager{display:flex;gap:7px;padding:22px 0 0}
.pager a,.pager span{font-family:var(--mono);font-size:10.5px;letter-spacing:.06em;padding:7px 12px;border:1px solid var(--ln)}
.pager .cur{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.pager a:hover{border-color:var(--acc);color:var(--acc)}

/* ============ THE BOLT ============ */
.bolt-mast{position:relative;overflow:hidden;isolation:isolate;padding:56px 0 50px;color:#F7F5F0}
/* Flagship ident. Same system as the channel idents (motif plate carries the
   masthead) at flagship scale: taller band, content vertically centred, and
   the ledger monument carrying the current issue number. .bolt-ka is retired
   — the ramp motif is the key art now, so The Signal and every channel page
   are drawn by one engine. */
.sig-ident{padding:0;min-height:clamp(330px,32vw,440px);display:flex;align-items:center}
.sig-ident>.in{position:relative;z-index:5;width:100%;align-items:center}
/* CTV hero details (VIZIO/Apple TV reference). One column anchored left over
   the motif, an oversized title, a two-line description, and a single
   unmistakable CTA — the pattern a 10-foot interface uses because it has one
   job. Everything secondary sits below the button, never beside it. */
.sigv{display:block!important}
/* Cast art: right side of the band, fading into the motif toward the text —
   the connected-TV hero pattern. Sits under the fog and the monument. */
.sigv-castart{position:absolute;top:0;bottom:0;right:0;width:56%;z-index:2;pointer-events:none;
  background-repeat:no-repeat;background-position:right bottom;background-size:contain;
  -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 34%);mask-image:linear-gradient(90deg,transparent 0,#000 34%);
  opacity:.8}
.sigv-castline{font-family:var(--mono);font-size:10.5px;letter-spacing:.22em;text-transform:uppercase;color:rgba(255,255,255,.55);margin:14px 0 0}
.sigv-castline b{color:#fff;font-weight:600}
@media(max-width:860px){.sigv-castart{width:78%;opacity:.45}}
.sigv-t{max-width:min(620px,62%)}
.sig-ident .sigv-t h1{font-size:clamp(52px,7.4vw,104px);line-height:.86;letter-spacing:-.055em;margin:0 0 14px;text-shadow:0 2px 40px rgba(6,6,10,.45)}
.sigv-desc{font-family:var(--body);font-size:clamp(17px,1.5vw,21px);line-height:1.42;color:rgba(247,245,240,.86);margin:0 0 24px;max-width:46ch}
.sigv-fmt{display:flex;flex-wrap:wrap;gap:8px 26px;margin:26px 0 0}
.sigv-fmt span{display:flex;flex-direction:column;gap:3px;font-family:var(--mono);font-size:9px;letter-spacing:.16em;text-transform:uppercase;color:rgba(255,255,255,.6)}
.sigv-fmt b{font-family:var(--ui);font-size:14px;font-weight:700;letter-spacing:-.02em;text-transform:none;color:#fff}
.sigv-fmt .soon b{color:rgba(255,255,255,.62)}
.sigv-fmt .soon{color:rgba(255,255,255,.42)}
@media(max-width:860px){.sigv-t{max-width:100%}}
/* Sits behind the whole band as texture, not beside the subscribe panel —
   at this alpha it reads as watermark rather than a competing element. */
.sig-ident .mk{left:16px;bottom:12px}
.sig-ident .fog{background:linear-gradient(96deg,rgba(6,6,8,.88) 0%,rgba(6,6,8,.6) 48%,rgba(6,6,8,.1) 100%)}
/* Formats carry their own status, so "soon" can never read as a live
   promise. The pending one is set back rather than hidden. */
.sig-ident .bolt-cnt{flex-wrap:wrap;gap:26px 30px;align-items:flex-start}
.sig-ident .bolt-cnt div{max-width:190px}
.sig-ident .bolt-cnt .n{font-size:18px;line-height:1.12;letter-spacing:-.025em}
.sig-ident .bolt-cnt .soon .n{color:rgba(255,255,255,.62)}
.sig-ident .bolt-cnt .soon .l{color:rgba(255,255,255,.42)}
.sig-ident .bolt-cnt .soon .l::before{content:"";display:inline-block;width:5px;height:5px;border:1px solid rgba(255,255,255,.5);border-radius:50%;margin-right:6px;vertical-align:middle}
@media(max-width:700px){.sig-ident{min-height:0;padding:38px 0 34px}}
.bolt-ka{position:absolute;inset:0;z-index:-1;background:linear-gradient(112deg,#08080A 0%,#101B5E 32%,#2340D6 66%,#7D93FF 100%)}
.bolt-ka::before{content:"";position:absolute;inset:0;background:radial-gradient(62% 120% at 80% 32%,rgba(169,186,255,.5),transparent 60%),repeating-linear-gradient(90deg,rgba(255,255,255,.07) 0 1px,transparent 1px 100px)}
.bolt-ka::after{content:"";position:absolute;inset:0;background:linear-gradient(96deg,rgba(6,6,8,.9) 0%,rgba(6,6,8,.66) 46%,rgba(6,6,8,.14) 100%)}
.bolt-mast .in{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:40px;align-items:end}
.bolt-brand{display:flex;align-items:center;gap:11px;margin-bottom:16px}
.bolt-brand .fm{font-family:var(--display);font-size:16px;font-weight:800;letter-spacing:-.038em;color:#F7F5F0}
.bolt-brand .fm s{text-decoration:none;color:#A9BAFF}
.bolt-brand .fm i{font-style:normal;font-weight:400;color:rgba(247,245,240,.7)}
.bolt-brand u{text-decoration:none;width:1px;height:14px;background:rgba(255,255,255,.28)}
.bolt-brand .sr{font-family:var(--mono);font-size:9px;letter-spacing:.22em;text-transform:uppercase;color:rgba(255,255,255,.62)}
.bolt-mast h1{font-family:var(--display);font-size:80px;font-weight:900;letter-spacing:-.05em;line-height:.88;margin:0 0 16px;color:#fff}
.bolt-mast .std{font-family:var(--body);font-size:18px;line-height:1.48;color:rgba(247,245,240,.82);margin:0 0 22px;max-width:52ch}
.bolt-cnt{display:flex;gap:30px}
.bolt-cnt div{display:flex;flex-direction:column;gap:5px}
.bolt-cnt .n{font-family:var(--display);font-size:21px;font-weight:800;letter-spacing:-.03em;color:#fff;line-height:1}
.bolt-cnt .l{font-family:var(--mono);font-size:9px;letter-spacing:.16em;text-transform:uppercase;color:rgba(255,255,255,.6)}
.bolt-sub{background:rgba(10,10,12,.6);border:1px solid rgba(255,255,255,.2);padding:18px}
.bolt-sub .lb{font-family:var(--mono);font-size:9px;letter-spacing:.18em;text-transform:uppercase;color:rgba(255,255,255,.62);display:block;margin-bottom:12px}
.bolt-sub input{width:100%;height:38px;padding:0 12px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.18);color:#fff;font-family:var(--ui);font-size:14px;margin-bottom:8px}
.bolt-sub input::placeholder{color:rgba(255,255,255,.45)}
.bolt-sub button{width:100%;height:38px;border:0;background:#fff;color:#101B5E;font-family:var(--ui);font-weight:800;font-size:12.5px;letter-spacing:.08em;text-transform:uppercase;cursor:pointer}
.bolt-sub .fine{font-family:var(--mono);font-size:9px;letter-spacing:.08em;color:rgba(255,255,255,.5);margin:10px 0 0;line-height:1.5}
.bolt-body{display:grid;grid-template-columns:minmax(0,1fr) 296px;gap:36px;padding:30px 0 46px}
.iss{display:grid;grid-template-columns:74px 1fr;gap:20px;padding:18px 0;border-bottom:1px solid var(--ln);align-items:start}
.iss .no{font-family:var(--mono);font-size:10.5px;color:var(--acc);padding-top:3px}
.iss h3{font-family:var(--display);font-size:21px;font-weight:700;letter-spacing:-.03em;line-height:1.15;margin:0 0 8px;color:var(--ink)}
.iss .tp{font-family:var(--body);font-size:16px;line-height:1.45;color:var(--ink2);margin:0 0 8px}
.iss .m{font-family:var(--mono);font-size:9px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink3)}
.iss:hover h3{color:var(--acc)}
.epgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-bottom:30px}
.epcard .plate{aspect-ratio:16/9;margin-bottom:11px;display:flex;align-items:center;justify-content:center}
.epcard .plate .pl{position:relative;z-index:5;width:38px;height:38px;border-radius:50%;background:rgba(255,255,255,.9);display:flex;align-items:center;justify-content:center}
.epcard .plate .pl::after{content:"";border-left:11px solid #101B5E;border-top:7px solid transparent;border-bottom:7px solid transparent;margin-left:3px}
.epcard .plate .dur{position:absolute;right:9px;top:9px;z-index:5;font-family:var(--mono);font-size:9px;letter-spacing:.08em;color:rgba(255,255,255,.85);background:rgba(0,0,0,.45);padding:2px 6px}
.epcard h4{font-family:var(--display);font-size:16px;font-weight:600;letter-spacing:-.022em;line-height:1.24;margin:0 0 6px;color:var(--ink)}
.epcard .m{font-family:var(--mono);font-size:9px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink3)}

/* ============ EMAIL preview ============ */
.mailwrap{background:#6E6A64;padding:34px 0 60px;min-height:100vh}
.mailbar{max-width:680px;margin:0 auto 18px;display:flex;align-items:center;gap:14px;font-family:var(--mono);font-size:9px;letter-spacing:.16em;text-transform:uppercase;color:rgba(255,255,255,.72)}
.mailbar .sp{margin-left:auto}
.mailclient{max-width:680px;margin:0 auto;background:#fff;box-shadow:0 20px 60px rgba(0,0,0,.28)}
.mailmeta{padding:16px 22px;border-bottom:1px solid #E4DFD6;font-family:var(--mono);font-size:10.5px;line-height:1.9;color:#7E7871}
.mailmeta b{color:#131211;font-weight:500}
.mailmeta .subj{font-family:'Archivo',sans-serif;font-size:16px;font-weight:700;letter-spacing:-.025em;color:#131211;margin-top:6px;display:block}

/* ============ responsive ============ */
@media(max-width:1180px){
.sg-head .in{gap:18px}
.sg-nav{gap:18px}
.sg-k{display:none}
.sg-home,.dos-grid,.bolt-body{grid-template-columns:1fr}
.art-body{grid-template-columns:1fr;gap:0}
.prov{position:static;border-right:0;padding-right:0;border-bottom:1px solid var(--ln);padding-bottom:20px;margin-bottom:26px;flex-direction:row;flex-wrap:wrap;gap:28px}
.prov .spark{flex:none;width:160px}
.trk .mv{white-space:nowrap}
.art-end{padding-left:0}
.lead-split{grid-template-columns:1fr}
.also{border-left:0;padding-left:0;border-top:1px solid var(--ln);padding-top:20px}
.grid3,.epgrid,.moves{grid-template-columns:1fr}
.moves div{border-right:0;border-bottom:1px solid var(--ln);padding-bottom:14px}
.moves div:last-child{border-bottom:0;padding-bottom:0}
.bolt-mast .in{grid-template-columns:1fr}
.bolt-mast h1{font-size:52px}
.art-head h1{font-size:38px}
.dos-mast h1{font-size:42px}
.riv{grid-template-columns:1fr}
}
@media(max-width:980px){
.sg-burger{display:flex}
.sg-nav{display:none;position:absolute;top:100%;left:0;right:0;z-index:70;flex-direction:column;gap:0;background:var(--paper);border-bottom:1px solid var(--ink);box-shadow:0 18px 40px rgba(0,0,0,.14);padding:6px var(--pad) 14px;overflow:visible}
.sg-head.open .sg-nav{display:flex}
.sg-nav a{font-size:16px;padding:11px 0;border-bottom:1px solid var(--ln);border-left:2px solid transparent;padding-left:0}
.sg-nav a:hover,.sg-nav a.on{border-bottom-color:var(--ln);color:var(--acc)}
.sg-sub .st{display:none}
}
@media(prefers-reduced-motion:reduce){.sg-strip .k i{animation:none}}

/* ============ Ghost / Koenig ============ */
.gh-content{font-family:var(--body);font-size:21px;line-height:1.62;color:var(--ink)}
.sg[data-mode=dark] .gh-content{color:var(--ink2)}
.gh-content>*{margin:0 0 1.05em}
/* hr = house-page section divider, drawn as the plate motif (dot run + ring)
   so content stays plain HTML and the graphic language lives in the theme. */
.gh-content hr,.art-body hr{border:0;width:88px;height:14px;margin:2.4em 0 2.2em;position:relative;opacity:.5;overflow:visible;
  background:radial-gradient(circle 1.8px at 7px 7px,currentColor 98%,transparent) 0 0/12px 14px repeat-x}
.gh-content hr::after,.art-body hr::after{content:"";position:absolute;right:-26px;top:1.6px;width:9px;height:9px;border:1.4px solid currentColor;border-radius:50%}
/* "From the original" — verbatim excerpt block (signal.js renders from
   signal-meta). Quiet quoted-source garment, deliberately distinct from
   .gh-content blockquote's loud editorial pull-quote. */
.srcq{margin:2.2em 0 1.4em;padding:18px 22px;border-left:3px solid var(--acc);background:var(--el2)}
.srcq figcaption{font-family:var(--mono);font-size:10.5px;text-transform:uppercase;letter-spacing:.14em;color:var(--ink3);margin-bottom:9px}
.srcq blockquote{margin:0;border:0;padding:0;font-family:var(--body);font-style:italic;font-size:18px;line-height:1.56;color:var(--ink2)}
.srcq cite{display:block;margin-top:11px;font-style:normal;font-family:var(--mono);font-size:10.5px;letter-spacing:.02em;color:var(--ink3)}
.srcq cite a{color:var(--acc)}
/* "read the original · gated" — a heads-up on a paywalled receipt, never a
   badge for the outlet. Mono, faint, lowercase, no colour, no border, no logo,
   so it reads as a footnote ON the link rather than a button competing with it.
   font-style resets because one of its three homes is inside the body's <em>
   attribution line; the other two are this cite and a timeline row. Never on a
   plate — see the gate pass in signal.js. */
.gate{font-family:var(--mono);font-size:10.5px;font-style:normal;font-weight:400;text-transform:none;letter-spacing:.02em;color:var(--ink3);white-space:nowrap}
/* Option B sub-brand: the desk mark in the sub-bar stats (header.hbs) */
.st .deskmark-st{color:var(--acc)}
/* ============ ABOUT — the special page ============
   The plate motif language (dot fields, rings, scanlines, grid) escapes the
   image overlays and becomes full-bleed page furniture. Colors come from
   theme vars so every band adapts to light/dark. */
.ab-hero,.abx hr{border:0;width:100vw;margin-left:calc(50% - 50vw);-webkit-mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent);mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent)}
.ab-hero{height:132px;margin-top:6px;margin-bottom:14px;opacity:.5;background:
  radial-gradient(circle at 76% 46%,transparent 42px,var(--acc) 43px 45px,transparent 46px),
  radial-gradient(circle at 82% 62%,transparent 14px,var(--ink3) 15px 16px,transparent 17px),
  radial-gradient(circle at 18% 40%,var(--acc) 0 5px,transparent 6px),
  radial-gradient(circle at center,var(--ink3) 1px,transparent 1.2px) 0 0/12px 12px,
  linear-gradient(0deg,transparent 49.5%,var(--ln2) 49.5% 50.5%,transparent 50.5%)}
.abx hr{height:64px;margin-top:2.6em;margin-bottom:2.4em;opacity:.42;background:none}
.abx hr::after{content:none}
.abx hr:nth-of-type(1){background:
  radial-gradient(circle at 24% 50%,transparent 20px,var(--acc) 21px 22.5px,transparent 23.5px),
  radial-gradient(circle at center,var(--ink3) 1.1px,transparent 1.3px) 0 0/13px 13px}
.abx hr:nth-of-type(2){background:
  radial-gradient(circle at 70% 50%,var(--acc) 0 4px,transparent 5px),
  repeating-linear-gradient(58deg,var(--ink3) 0 1.5px,transparent 1.5px 11px)}
.abx hr:nth-of-type(3){background:
  radial-gradient(circle at 50% 50%,transparent 16px,var(--acc) 17px 18.5px,transparent 19.5px),
  repeating-linear-gradient(90deg,var(--ln2) 0 1px,transparent 1px 42px),
  repeating-linear-gradient(0deg,var(--ln2) 0 1px,transparent 1px 42px)}
/* desk request form (page-about.hbs) */
.dform{margin-top:.4em;font-family:var(--ui)}
.dform label{display:block;margin:0 0 16px;font-size:12.5px;font-weight:600;letter-spacing:.01em}
.dform .req{font-weight:400;color:var(--ink3);font-size:10.5px;margin-left:4px}
.dform input,.dform select,.dform textarea{display:block;width:100%;margin-top:6px;padding:10px 12px;font:inherit;font-weight:400;font-size:16px;color:var(--ink);background:var(--el);border:1px solid var(--ln2);border-radius:2px}
.dform input:focus,.dform select:focus,.dform textarea:focus{outline:2px solid var(--acc);outline-offset:0;border-color:var(--acc)}
.dform .hp{position:absolute;left:-9999px;height:0;overflow:hidden}
.dform button{font:inherit;font-size:14px;font-weight:600;padding:11px 22px;color:var(--paper);background:var(--ink);border:0;border-radius:2px;cursor:pointer}
.dform button:disabled{opacity:.55;cursor:default}
.dform-note{margin-top:14px;font-size:14px;color:var(--ink2)}
/* post bodies open with the attribution line since the dek dedupe — a drop
   cap on "Signal from…" reads as a typo, not typography */
.gh-content h2{font-family:var(--display);font-size:25px;font-weight:800;letter-spacing:-.032em;margin:1.7em 0 .5em;color:var(--ink)}
.gh-content h3{font-family:var(--display);font-size:21px;font-weight:700;letter-spacing:-.028em;margin:1.5em 0 .4em;color:var(--ink)}
.gh-content a{color:var(--acc);box-shadow:inset 0 -1px 0 currentColor}
.gh-content strong{font-weight:600;color:var(--ink)}
.gh-content ul,.gh-content ol{padding-left:1.2em}
.gh-content li{margin-bottom:.4em}
.gh-content blockquote{margin:1.7em 0;padding:20px 0;border-top:3px solid var(--acc);border-bottom:1px solid var(--ln);font-family:var(--display);font-size:25px;font-weight:700;letter-spacing:-.028em;line-height:1.16;color:var(--ink)}
.gh-content hr{border:0;border-top:1px solid var(--ln);margin:2em 0}
.gh-content figure{margin:1.8em 0}
.gh-content figcaption{font-family:var(--mono);font-size:10.5px;letter-spacing:.06em;color:var(--ink3);padding-top:9px;text-align:left}
.gh-content .kg-card{margin:1.8em 0}
.gh-content .kg-width-wide{width:min(100%,860px);margin-left:calc(50% - min(50%,430px))}
.gh-content .kg-width-full{width:min(100vw,1180px);margin-left:calc(50% - min(50vw,590px))}
.gh-content .kg-callout-card{display:flex;gap:14px;padding:18px 20px;background:var(--el2);border-left:3px solid var(--acc);font-family:var(--ui);font-size:16px;line-height:1.5}
.gh-content .kg-bookmark-card a{display:grid;grid-template-columns:1fr auto;border:1px solid var(--ln);box-shadow:none;text-decoration:none}
.gh-content .kg-bookmark-content{padding:16px 18px}
.gh-content .kg-bookmark-title{font-family:var(--display);font-weight:700;letter-spacing:-.025em;color:var(--ink);font-size:16px}
.gh-content .kg-bookmark-description{font-size:14px;color:var(--ink2);margin-top:6px}
.gh-content .kg-bookmark-metadata{font-family:var(--mono);font-size:10.5px;color:var(--ink3);margin-top:10px;display:flex;gap:8px;align-items:center}
.gh-content .kg-bookmark-thumbnail img{width:170px;height:100%;object-fit:cover}
.gh-content .kg-embed-card,.gh-content .kg-video-card,.gh-content .kg-audio-card{margin:1.8em 0}
/* Ghost-native embeds arrive with fixed 200x113 oembed dimensions -- make
   them fill the column (owner ask 2026-08-24: video in original posts). */
.gh-content .kg-embed-card iframe{width:100%;aspect-ratio:16/9;height:auto}
/* Watch block: a sister-pub video pulled up onto the article page. */
.watch{margin:0 0 26px}
.watch figcaption{font-family:var(--mono);font-size:10.5px;font-weight:600;letter-spacing:.2em;
  text-transform:uppercase;color:var(--acc);padding-bottom:9px;border-bottom:1px solid var(--ink);margin-bottom:12px}
.watch iframe{display:block;width:100%;aspect-ratio:16/9;height:auto;border:0;background:#000}
.gh-content .kg-toggle-card{border:1px solid var(--ln);padding:16px 18px}
.gh-content .kg-toggle-heading{display:flex;justify-content:space-between;align-items:center;cursor:pointer}
.gh-content .kg-toggle-heading-text{font-family:var(--display);font-size:18px;font-weight:700;letter-spacing:-.025em;margin:0}
.gh-content .kg-toggle-content{display:none;padding-top:12px;font-size:18px}
.gh-content .kg-toggle-card[data-kg-toggle-state=open] .kg-toggle-content{display:block}
.gh-content .kg-button-card a{font-family:var(--ui);font-weight:700;font-size:12.5px;letter-spacing:.02em;background:var(--acc);color:#fff;padding:12px 20px;display:inline-block;box-shadow:none;border-radius:999px}
.gh-content table{width:100%;border-collapse:collapse;font-family:var(--ui);font-size:14px}
.gh-content th{font-family:var(--mono);font-size:9px;letter-spacing:.14em;text-transform:uppercase;text-align:left;padding:9px 12px;border-bottom:1px solid var(--ink);color:var(--ink3)}
.gh-content td{padding:10px 12px;border-bottom:1px solid var(--ln)}
.gh-content code{font-family:var(--mono);font-size:.86em;background:var(--el2);padding:2px 5px}
.gh-content pre{background:var(--el2);padding:16px 18px;overflow-x:auto;font-family:var(--mono);font-size:12.5px;line-height:1.6}
.gh-content pre code{background:none;padding:0}
/* members / subscribe states */
.gh-members-form{display:flex;flex-direction:column;gap:7px}
.gh-members-form .msg{font-family:var(--mono);font-size:9px;letter-spacing:.1em;text-transform:uppercase;display:none}
.gh-members-form.success .msg.ok,.gh-members-form.error .msg.err{display:block}
.gh-members-form .msg.ok{color:#fff}
.gh-members-form .msg.err{color:#FFC9B4}
.paywall{border:1px solid var(--ink);padding:28px 30px;margin:2em 0;text-align:center}
.paywall h3{font-family:var(--display);font-size:24px;font-weight:800;letter-spacing:-.035em;margin:0 0 10px}
.paywall p{font-family:var(--body);font-size:16px;line-height:1.5;color:var(--ink2);margin:0 0 18px;max-width:48ch;margin-inline:auto}
/* archive / pagination */
.pagination{display:flex;gap:7px;padding:22px 0 0;font-family:var(--mono);font-size:10.5px}
.pagination a,.pagination span{padding:7px 12px;border:1px solid var(--ln)}
.pagination a:hover{border-color:var(--acc);color:var(--acc)}
.err{padding:90px 0;text-align:center}
.err .code{font-family:var(--display);font-size:110px;font-weight:900;letter-spacing:-.06em;line-height:1;color:var(--acc)}
.err h1{font-family:var(--display);font-size:30px;font-weight:800;letter-spacing:-.035em;margin:14px 0 10px}
.err p{font-family:var(--body);font-size:18px;color:var(--ink2);margin:0 0 22px}

/* ============ footer ============ */
.sg-foot{background:var(--ink);color:var(--ink3);padding:44px 0 0;margin-top:20px}
.sg[data-mode=dark] .sg-foot{background:#08080A}
.sg-foot .cols{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:36px;padding-bottom:34px}
.sg-foot .wm{font-size:28px;color:#FAF8F4;margin-bottom:14px}
.sg-foot .wm s{color:var(--acc2)}
.sg-foot .wm i{color:rgba(250,248,244,.66)}
.sg-foot p{font-family:var(--body);font-size:16px;line-height:1.5;max-width:34ch;margin:0;color:rgba(250,248,244,.62)}
.sg-foot h4{font-family:var(--ui);font-weight:800;font-size:10.5px;letter-spacing:.18em;text-transform:uppercase;color:#FAF8F4;margin:0 0 14px}
.sg-foot ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:9px}
.sg-foot ul a{font-size:14px;color:rgba(250,248,244,.62)}
.sg-foot ul a:hover{color:#FAF8F4}
/* nav-helper output in the footer: bare anchors, styled like the ul lists */
.sg-foot .ftnav{display:flex;flex-direction:column;gap:9px}
.sg-foot .ftnav a{font-size:14px;color:rgba(250,248,244,.62)}
.sg-foot .ftnav a:hover{color:#FAF8F4}
/* ownership disclosure — site-wide, above the legal row */
.sg-foot .discl-foot{font-family:var(--body);font-size:12.5px;line-height:1.6;color:rgba(250,248,244,.5);max-width:88ch;padding:0 0 20px}
.sg-foot .discl-foot b{color:rgba(250,248,244,.72);font-weight:600}
.sg-foot .lg{border-top:1px solid rgba(250,248,244,.14);padding:16px 0;font-family:var(--mono);font-size:9px;letter-spacing:.1em;text-transform:uppercase;color:rgba(250,248,244,.4);display:flex;gap:20px;flex-wrap:wrap}
.sg-foot .lg .p{margin-left:auto}
.sg-foot .lg a{color:inherit}
@media(max-width:1180px){.sg-foot .cols{grid-template-columns:1fr 1fr}}
@media(max-width:680px){.sg-foot .cols{grid-template-columns:1fr}}

/* ============ feature image composited into the plate ============ */
.plate-photo{position:absolute;inset:0;z-index:1;background-image:var(--photo);background-size:cover;background-position:center;mix-blend-mode:luminosity;filter:contrast(1.1) saturate(1.05);opacity:.72}/* photo rides its own layer via --photo so the section gradient beneath   survives — inline background-image used to REPLACE the gradient, which   killed the duotone motif on every photo plate */
.plate:has(.plate-photo)::before{z-index:2;opacity:.55}
.plate:has(.plate-photo)::after{z-index:3;opacity:.5}
.plate:has(.plate-photo) .mk,.plate:has(.plate-photo) .cap{z-index:6}
figure.plate{margin:24px 0 0}

/* search button reset */
.sg-k{font:inherit;font-family:var(--mono);font-size:10.5px;cursor:pointer}

/* sample-issue email embed on The Signal page */
/* Issue archive: flat rows, number + lede headline + date link. */
.issarch{border-top:2px solid var(--ink);margin-bottom:26px}
.issarch a{display:flex;gap:18px;align-items:baseline;padding:14px 0;border-bottom:1px solid var(--ln);color:var(--ink)}
.issarch a:hover .tt{color:var(--acc)}
.issarch .no{font-family:var(--mono);font-size:10.5px;color:var(--ink3);flex:none}
.issarch .tt{font-family:var(--display);font-weight:700;font-size:16px;letter-spacing:-.02em}
.issarch .dt{font-family:var(--mono);font-size:10.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--ink3);margin-left:auto;flex:none;white-space:nowrap}
@media(max-width:700px){.issarch a{flex-wrap:wrap}.issarch .dt{margin-left:0;width:100%}}
.mailframe{width:100%;max-width:640px;height:780px;border:1px solid var(--ln2);background:#FAF8F4;display:block}

/* ============ iSpot Top Commercials rail unit (ported from Look Directions v1.0) ============ */
/* ---- iSpot horizontal ticker (Terminal) ---- */
/* ---- iSpot Top Commercials rail unit ---- */
/* Maps theme tokens into the widget's namespace. Four of these named
   properties this theme never defines (--line, --line2, --card, --mut,
   --ink-2), so the widget's rules, borders and muted text resolved to
   nothing. Corrected to the real tokens 2026-08-22. */
.isp{--i-line:var(--ln);--i-line2:var(--ln2);--i-surface:var(--el);--i-ink:var(--ink);--i-paper:var(--paper);--i-mut:var(--ink3);--i-body:var(--ink2);--i-hover:var(--acc-t);--i-acc:var(--acc);--i-r:12px;
border:1px solid var(--i-line);border-radius:var(--i-r);overflow:hidden;background:var(--i-surface);margin-bottom:26px}
.tr .isp{--i-line:var(--ln);--i-line2:var(--ln2);--i-surface:var(--el);--i-ink:var(--ink);--i-paper:var(--paper);--i-mut:var(--ink3);--i-body:var(--ink2);--i-hover:rgba(107,132,255,.13);--i-acc:var(--acc);--i-r:0}
.isp-hd{display:flex;align-items:center;gap:6px;padding:9px 10px 7px;white-space:nowrap}
.isp-hd .ttl{font-family:var(--ui);font-size:12.5px;font-weight:800;letter-spacing:-.025em;color:var(--i-ink)}
/* Disclosure row: stated plainly, sized to be read rather than announced. */
.isp-sub{display:flex;align-items:center;gap:8px;padding:0 10px 8px;border-bottom:1px solid var(--i-line);white-space:nowrap;min-height:8px}
/* Publication-side disclosure: our type, our canvas, above the unit. */
.adlabel{font-family:var(--mono);font-size:9px;letter-spacing:.2em;text-transform:uppercase;color:var(--ink3);padding:0 0 6px}
.isp-sub .wk{margin-left:auto;font-family:var(--mono);font-size:7.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--i-mut)}
.isp-hd .by{margin-left:auto;display:flex;align-items:center;gap:4px;font-family:var(--mono);font-size:7.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--i-mut)}
.isp-hd .by b{font-family:var(--ui);font-weight:800;color:#12A46B;letter-spacing:-.02em;font-size:11px;text-transform:none}
.isp-hd .by i{font-style:normal;width:4px;height:4px;border-radius:50%;background:#12A46B}
.isp-roll{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--i-line);border-bottom:1px solid var(--i-line)}
.tr .isp-roll{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--i-line);border-bottom:1px solid var(--i-line)}
.isp-roll div{background:var(--i-surface);padding:8px 5px;min-width:0;overflow:hidden}
.isp-roll .n{font-family:var(--mono);font-size:11px;font-weight:600;letter-spacing:-.035em;line-height:1;color:var(--i-ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.isp-roll .l{font-family:var(--mono);font-size:6.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--i-mut);margin-top:5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.isp-listwrap{position:relative;height:216px;overflow:hidden}
.isp-listwrap::after{content:"";position:absolute;left:0;right:0;bottom:0;height:26px;pointer-events:none;z-index:3;background:linear-gradient(180deg,transparent,var(--i-surface))}
.isp-list{display:flex;flex-direction:column;will-change:transform;animation:ispScroll 34s linear infinite}
.isp-listwrap:hover .isp-list{animation-play-state:paused}
@media(prefers-reduced-motion:reduce){.isp-list{animation:none}.isp-listwrap{height:auto}}
.isp-row{position:relative;display:grid;grid-template-columns:12px 40px minmax(0,1fr) 30px;gap:8px;padding:8px 10px;border-bottom:1px solid var(--i-line);align-items:center;cursor:pointer}
.isp-row:last-child{border-bottom:0}
.isp-row:hover{background:var(--i-hover)}
.isp-row .rk{font-family:var(--mono);font-size:9.5px;color:var(--i-mut);line-height:1}
.isp-row .bd{display:flex;flex-direction:column;min-width:0}
.isp-row .th{aspect-ratio:16/10;border-radius:3px;overflow:hidden;position:relative}
.isp-row .th>img{width:100%;height:100%;object-fit:cover;display:block}
.isp-row .th.noimg{background:repeating-linear-gradient(-45deg,var(--i-line) 0 1px,transparent 1px 6px),var(--i-hover)}
.tr .isp-row .th{border-radius:0}
.isp-row .br{display:block;font-size:11.5px;font-weight:700;letter-spacing:-.02em;line-height:1.15;color:var(--i-ink);margin-bottom:3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.isp-row .ti{display:block;font-family:var(--mono);font-size:8px;letter-spacing:0;color:var(--i-mut);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:1.3}
.isp-row .at{text-align:right;display:flex;flex-direction:column;align-items:flex-end;gap:3px}
.isp-row .at .v{display:block;font-family:var(--mono);font-size:11.5px;font-weight:600;color:var(--i-ink);line-height:1}
.isp-row .at .d{display:block;font-family:var(--mono);font-size:7.5px;letter-spacing:.04em;color:var(--i-mut);line-height:1}
.isp .up{color:#12A46B}
.isp .dn{color:#D2410F}
.isp-det{position:absolute;right:100%;top:-4px;margin-right:10px;z-index:60;width:250px;background:var(--i-surface);border:1px solid var(--i-line2);border-radius:var(--i-r);padding:12px 13px;opacity:0;visibility:hidden;transform:translateX(6px);transition:opacity .14s,transform .14s,visibility .14s;box-shadow:0 18px 40px rgba(0,0,0,.22);pointer-events:none}
.tr .isp-det{box-shadow:0 18px 40px rgba(0,0,0,.5)}
.isp-row:hover .isp-det{opacity:1;visibility:visible;transform:none}
.isp-det .k{font-family:var(--mono);font-size:8.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--i-acc);padding-bottom:8px;border-bottom:1px solid var(--i-line);margin-bottom:9px;display:flex}
.isp-det .k b{margin-left:auto;color:var(--i-mut);font-weight:400}
.isp-det dl{display:grid;grid-template-columns:66px 1fr;gap:6px 11px;margin:0;font-family:var(--mono);font-size:10px;line-height:1.5}
.isp-det dt{color:var(--i-mut);letter-spacing:.1em;text-transform:uppercase;font-size:8px;padding-top:2px}
.isp-det dd{margin:0;color:var(--i-body)}
.isp-det dd em{font-style:normal;color:var(--i-ink)}
.isp-ft{display:flex;align-items:center;gap:8px;padding:8px 10px;border-top:1px solid var(--i-line);font-family:var(--mono);font-size:7.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--i-mut);white-space:nowrap}
.isp-ft span{min-width:0;overflow:hidden;text-overflow:ellipsis}
.isp-ft a{margin-left:auto;color:var(--i-acc);flex:none}
@media(max-width:1180px){.isp-det{right:auto;left:0;top:100%;margin:6px 0 0;transform:translateY(-4px)}}
/* House-promo frame. A rule above in ink and a hairline below set the unit
   off from the editorial either side of it, and the mono label says who is
   speaking. Deliberately NOT .adlabel/"Advertisement" -- that belongs to the
   iSpot placement, which is third-party paid; this is Fabric's own service. */
.hpromo{margin:26px 0 34px;padding:14px 0 22px;
  border-top:1px solid var(--ink);border-bottom:1px solid var(--ln)}
.hpromo__lb{font-family:var(--mono);font-size:9px;letter-spacing:.2em;
  text-transform:uppercase;color:var(--ink3);padding:0 0 10px}
.hpromo .qwide{margin:0}
/* Consult an analyst, wide. Same identity as the rail card (.qpromo) but
   laid across the main column: the quote carries the weight on the left, the
   attribution and CTA sit right, and it stacks on narrow screens. Placed
   above THE WIRE so it reads as the end of the curated edition. */
.qwide{position:relative;overflow:hidden;isolation:isolate;display:grid;
  grid-template-columns:minmax(0,1fr) 260px;gap:30px;align-items:center;
  border-radius:12px;padding:24px 28px;margin:6px 0 34px;
  background:linear-gradient(104deg,#0B0A09 0%,#132AA8 46%,#2C46D8 78%,#4C63E8 100%)}
.qwide::before{content:"";position:absolute;inset:0;z-index:-1;
  background:radial-gradient(70% 120% at 14% 10%,rgba(107,132,255,.5),transparent 64%)}
.qwide:hover{box-shadow:0 0 0 1px var(--acc)}
.qwide .rl{font-family:var(--mono);font-size:9px;letter-spacing:.14em;
  text-transform:uppercase;color:rgba(255,255,255,.7);margin-bottom:10px}
.qwide blockquote{margin:0;font-family:var(--display);font-size:23px;line-height:1.24;
  font-weight:700;letter-spacing:-.026em;color:#F7F5F0;text-wrap:pretty;max-width:34ch}
.qwide__who{border-left:1px solid rgba(255,255,255,.3);padding-left:26px}
.qwide .at{display:grid;grid-template-columns:38px 1fr;gap:10px;align-items:center}
.qwide .av{width:38px;height:38px;border-radius:50%;overflow:hidden;
  background:rgba(255,255,255,.14);box-shadow:0 0 0 1px rgba(255,255,255,.28)}
.qwide .av img{width:100%;height:100%;object-fit:cover;display:block}
.qwide .nm{font-size:12.5px;font-weight:700;letter-spacing:-.015em;color:#fff;line-height:1.2}
.qwide .ro{font-family:var(--mono);font-size:9px;letter-spacing:.08em;color:rgba(255,255,255,.82);margin-top:3px}
.qwide .go{display:block;font-family:var(--mono);font-size:9px;letter-spacing:.14em;
  text-transform:uppercase;color:#fff;margin-top:14px;padding-top:12px;
  border-top:1px solid rgba(255,255,255,.34)}
@media(max-width:820px){
  .qwide{grid-template-columns:1fr;gap:20px;padding:20px}
  .qwide blockquote{font-size:18px;max-width:none}
  .qwide__who{border-left:0;border-top:1px solid rgba(255,255,255,.2);padding:18px 0 0}
}
.qpromo{position:relative;overflow:hidden;isolation:isolate;border:0;border-radius:12px;padding:16px;margin-bottom:12px;display:block;background:linear-gradient(148deg,#0B0A09 0%,#1B32B8 56%,#6B84FF 100%)}
.qpromo::before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(80% 90% at 18% 12%,rgba(107,132,255,.5),transparent 64%)}
.qpromo:hover{box-shadow:0 0 0 1px var(--acc)}
.qpromo .rl{font-family:var(--mono);font-size:9px;letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.7);margin-bottom:10px}
.qpromo blockquote{margin:0 0 12px;font-size:16px;line-height:1.36;font-weight:600;letter-spacing:-.018em;color:#F7F5F0;text-wrap:pretty}
.qpromo .at{display:grid;grid-template-columns:38px 1fr;gap:10px;align-items:center}
.qpromo .av{width:38px;height:38px;border-radius:50%;overflow:hidden;background:rgba(255,255,255,.14);box-shadow:0 0 0 1px rgba(255,255,255,.28)}
.qpromo .av img{width:100%;height:100%;object-fit:cover;display:block}
.qpromo .nm{font-size:12.5px;font-weight:700;letter-spacing:-.015em;color:#fff;line-height:1.2}
.qpromo .ro{font-family:var(--mono);font-size:9px;letter-spacing:.08em;color:rgba(255,255,255,.62);margin-top:3px}
/* The CTA is the one thing this card asks you to do — Eleanor's contrast pass
   applied inside the card too: #A9BAFF on the gradient's light end was ~2.2:1.
   Near-white with the periwinkle kept for the arrow. */
.qpromo .go{display:block;font-family:var(--mono);font-size:9px;letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.92);margin-top:12px;padding-top:11px;border-top:1px solid rgba(255,255,255,.2)}
.qpromo:hover .go{color:#fff}
/* sample-data chip — shows until a real iSpot feed is wired via @custom.ispot_feed_url */
.isp .smp{font-family:var(--mono);font-size:7.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--warn);border:1px solid currentColor;border-radius:2px;padding:2px 5px;margin-left:8px}

/* loop animations for the iSpot units — missed by the 1.0.11 port (the
   extractor couldn't match nested keyframe braces): without ispScroll the
   rail list sat frozen showing its doubled loop content twice */
@keyframes ispbMarquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@keyframes ispScroll{from{transform:translateY(0)}to{transform:translateY(-50%)}}

/* sister-pub latest-5 lists in the rail promos (filled by signal.js) */
.pfeed{list-style:none;margin:10px 0 8px;padding:10px 0 2px;border-top:1px solid var(--ln);display:flex;flex-direction:column;gap:7px}
.pfeed:empty{display:none}
.pfeed a{display:flex;gap:8px;align-items:baseline;font-family:var(--ui);font-size:12.5px;font-weight:600;letter-spacing:-.01em;line-height:1.3;color:var(--ink2)}
.pfeed a:hover{color:var(--acc)}
.pfeed .d{flex:none;font-family:var(--mono);font-size:9px;letter-spacing:.06em;color:var(--ink3)}


/* One-line pointer above the dek, shown only when the story moved after
   this post. Deliberately lighter than .art-wim beside it: this is
   navigation, not judgment. */
.contd{
  display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;
  margin:14px 0 2px;font-family:var(--mono);font-size:10.5px;line-height:1.6;
}
.contd__k{
  text-transform:uppercase;letter-spacing:.2em;font-size:9px;
  font-weight:600;color:var(--acc2);
}
.contd a{color:var(--ink2);text-decoration:underline;text-underline-offset:2px}
.contd a:hover{color:var(--acc)}

/* .series* rules removed 2026-08-22: the two coverage blocks they styled
   were consolidated into THE TIMELINE, which uses .trail. Left no dead
   selectors behind rather than letting them rot in the stylesheet. */

/* Both trail blocks take the SECOND accent (--acc2), which separates the
   coverage apparatus from --acc — the primary accent carries judgment and
   navigation (.art-wim sits directly above, .kick, .byl .src) and two
   identical blue-ruled blocks stacked read as one repeated element.
   --b1..--b6 were not candidates: those are the channel colours on .tier,
   and borrowing one would collide with network programming. Direction is
   carried by the label, since continuing and later are one system. */
.series--later{border-left-color:var(--acc2)}


/* first-report credit in the byline row — quieter than .src (the source
   count), since the reporter's name carries the emphasis on its own */
.byl .fby a{color:var(--ink2);text-decoration:underline;text-underline-offset:2px}
.byl .fby a:hover{color:var(--ink)}

/* source-trail role chip: the first report is the claim that matters */
.trail .ty.first{color:var(--ink);border-color:currentColor;font-weight:700}

/* timeline: our own signals sit in the accent family so they read as ours
   against the outlets' reports; the current post is the anchor */
.trail .ty.sig{color:var(--acc2);border-color:currentColor}
.trail .ty.self{color:var(--acc);border-color:currentColor;font-weight:700}
.trail li.tl-self .tx{font-weight:700;color:var(--ink)}

/* the outlet a signal was drafted from, trailing its headline in the timeline */
.trail .tl-src{font-style:normal;color:var(--ink3);font-size:9px;letter-spacing:.06em}

/* Channel hero: The Signal's CTV layout at channel scale. The flagship
   should still out-shout a section, so this sits a step below it in height
   and display size. No cast art — the motif plate is the key art, and
   .sigv-t already caps the text at 62% so the field carries the right. */
.chid-hero{min-height:clamp(250px,23vw,340px);margin:0 0 18px}
.chid-hero .sigv-t h1{font-size:clamp(40px,5.4vw,74px)}
.chid-hero .sigv-desc{font-size:clamp(15px,1.25vw,18px);margin:0 0 18px}
.chid-hero .sigv-fmt{margin:20px 0 0}


/* ---- THE BRIDGE: plate to copy (comps option 2, "tighten and align") ----
   With the headline living in the artwork, the plate and the copy beneath it
   read as two unrelated objects — the owner's words, and the reason the comps
   sheet existed. A channel-coloured rule carries the eye out of the plate and
   into the summary, and the gap between them collapses so they read as one
   unit rather than an image with a caption under it.

   This is option 2 COMBINED with option 4 (the plate is ours), which the comps
   presented as alternatives. They are compatible: the rule is purely visual,
   the credit removal is about ownership. Option 2's mock still showed the
   source signed on the plate because it predates that decision; it is not
   coming back. The source credit lives under the summary with the link to the
   original, which is where option 4 put it.

   --ch is the channel's own colour, set on the card/article root. The fallback
   is the accent, so a post with no channel still gets a rule. */
.ch-measurement{--ch:var(--b3)}
.ch-streaming{--ch:var(--b4)}
.ch-ad-tech{--ch:var(--b1)}
.ch-agencies{--ch:var(--b2)}
.ch-retail-media{--ch:var(--b5)}
.ch-creators{--ch:var(--b6)}

/* Collapse the gap the rule is meant to close. */
.t1 .plate{margin-bottom:0}
.t2 .plate{margin-bottom:0}
.art-head .art-plate{margin-bottom:0}

.t1 p,
.t2 p,
.art-head .dek{margin-top:0;padding-top:13px;padding-left:11px;border-left:2px solid var(--ch,var(--acc))}

/* When the plate is too small to carry the headline the heading un-hides and
   sits between the plate and the dek, so it joins the rule rather than
   breaking it — otherwise the line would start halfway down the card. */
.t1 h2.shown,
.t2 h3.shown,
.art-head h1.shown{margin-top:0;padding-top:13px;padding-left:11px;border-left:2px solid var(--ch,var(--acc))}
.t1 h2.shown + p,
.t2 h3.shown + p,
.art-head h1.shown + .dek{padding-top:0}