/* ==========================================================================
   AXI-x Case v0.1 — real content on the grid: a case study, re-set.
   (extension; not SNX core)   Study: /explorations/018-aipos/   Engine: SNX v0.1.4
   Kin: Sky v0.1 (the register the prose is set in), Shore v0.1 (hand-placed
   stages read by the census), Image v0.1 (the screenshot contained), Glyph
   v0.1 (the mode pair), Book v0.1 (someone else's words as a block), Circuit
   v0.2 (a dot is a pulse at rest), Form v0.1 (no signal at rest on a control).

   The client site's portfolio has a template: ten blocks in a fixed order,
   each required or collapsing. This extension reads that template as a
   SCORE for the system and sets one published case study by it. Laws:
     1. The template is the score. The block order (header, lead visual,
        situation, work, sample, turn, result, client voice, artifacts,
        capability + CTA) is kept; the system decides only what each block
        IS — a set piece on the grid or a passage of sky — and scores the
        set pieces per edition. The prose is the author's and is not
        rewritten; a word moved or cut is a finding, counted.
     2. Proof is a set piece; connective tissue is sky. The strategy's own
        sentence — visuals are load-bearing, text is connective tissue —
        decides the split: a block whose content is a thing (a screenshot,
        a figure, a quotation, a roster, a link, a call to action) is a
        manifest; a block whose content is the house's prose is sky.
     3. The cold arrival is one manifest. Everything the template asks a
        cold visitor to grasp in ten seconds — title, hook, mode pair,
        client line, role, and the lead visual — is one hand-placed stage,
        scored per edition, so the whole arrival is on the grid and in one
        viewport at L and XL.
     4. The matrix is a manifest, not a screenshot. Its axes sit on grid
        lines, so it takes an even span (four of seven, four of five, and
        all three at 3×2 — where the centre line is the overlay's); its
        quadrants are one colour, because the tool's rule is that no
        quadrant is the right one; a participant is a dot at a union
        intersection — snapped to a microcolumn and a half-row, the
        resolution and the mean error written on the block — drawn in three
        tones for the tool's three ages (you, recent, older), and the
        participant's own dot is the page's one signal moment. The dots are
        drawn by the engine's seeded rng (seed = the date) and declared as
        such: no participant was read. A dot is the Circuit's pulse at rest.
     5. Two slots, one figure. The template gives the matrix two homes —
        the embedded sample (the tool) and the process artifact (the
        framework diagram). They are the same figure, so the manifest sits
        in the higher slot and the artifact slot collapses as the template
        allows; the move is counted as a difference.
     6. A roster is a manifest. A result sentence that names memberships
        is set as named, annotated blocks (the draw: membership is visible,
        nameable, and occasionally annotated on the page itself) — and a
        set piece whose cost at an edition exceeds its proof collapses to
        sky at that edition (the roster at 3×2 is a sentence again).
     7. Someone else's words are a block. The client's voice is an extract
        block in the sky (the book's law 3): chalk, whole units tall, the
        attribution as sky beneath it.
     8. No signal at rest on a control. The links and the call to action
        rest in navy and are lit by focus or hover only (the form's law);
        the mode pair is glyphs, navy at rest (the glyph's law 5).
     9. The differences are counted, not described. Words, headings,
        images, links, stages, blocks, sky units, stage rows, page rows and
        signal blocks are read from the DOM for both settings and tabled;
        rows per stage are checked against the score at every edition.
    10. Feed/score. case.js writes the dots, the counts and data-* on the
        matrix and the stages; this file draws everything. No persistence,
        no fetch, no service, nothing of the live tool's data.
   Opt-in: .cs (a study) containing .sh[data-hand] stages with class cs-stage
   and data-rows per edition (data-rows-l / -m / -s), .cs-mx the matrix,
   .sky.cs-sky passages, .cs-x an extract; [data-case-census] for Study C.
   ========================================================================== */

/* ---------- the blocks' type ---------- */
:where(.cs .snx-b) p,:where(.cs .snx-b) b,:where(.cs .snx-b) span.t{font-size:14.5px;line-height:1.5;margin:0}
:where(.cs .snx-b) .snx-pad{display:flex;flex-direction:column;justify-content:space-between;height:100%;box-sizing:border-box;gap:8px;padding:14px 18px}
:where(.cs .snx-b) .k{font-family:var(--snx-mono);font-size:9.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--snx-ink-60);font-weight:600;line-height:1.3;display:block}
.cs .snx-b.on-dark .k{color:rgba(251,250,241,.7)}
@media (max-width:639px){:where(.cs .snx-b) p{font-size:13.5px}:where(.cs .snx-b) .snx-pad{padding:10px 14px}}
.cs-stage{margin-top:14px}
/* blocks arrive from the sea (the shore's assembly) and sit translated past the stage's edge until they do; clip the x axis so the page never grows a horizontal scroll at M, where the wrap is the viewport */
.cs .sh{overflow-x:clip}
/* the stage's rows are the score's: a block never grows them (checked by the instrument, law 9) */
.cs .sh-stage{grid-auto-rows:var(--snx-row)}
.cs .sh-stage > .snx-b{overflow:hidden}

/* ---------- B1 · the cold arrival (law 3) ---------- */
.cs-title{--c:1;--s:4;--r:1;--rs:2;--bg:var(--snx-butter)}
.cs-title .snx-pad{justify-content:flex-end}
.cs-title b{font-size:var(--snx-s5);font-weight:800;letter-spacing:-.02em;line-height:1.02;text-wrap:balance;display:block}
.cs-hook{--c:5;--s:3;--r:1;--rs:2;--bg:var(--snx-chalk)}
.cs-hook p{font-size:15.5px;line-height:1.35;text-wrap:pretty}
.cs-shot{--c:1;--s:5;--r:3;--rs:8}
.cs-mode{--c:6;--s:2;--r:3;--rs:2;--bg:var(--snx-chalk)}
.cs-mode .snx-pad{flex-direction:row;flex-wrap:wrap;align-items:center;justify-content:flex-start;gap:8px 12px}
.cs-mode .gl{--gl-size:calc(var(--snx-row) - 20px)}
.cs-mode .pair{display:flex;flex-direction:column;gap:2px}
.cs-mode .pair b{font-size:var(--snx-s2);font-weight:700;line-height:1.2}
.cs-mode .pair span{font-size:12px;color:var(--snx-ink-60);line-height:1.3}
.cs-client{--c:6;--s:2;--r:5;--rs:2;--bg:var(--snx-mint)}
.cs-role{--c:6;--s:2;--r:7;--rs:2;--bg:var(--snx-sky)}
.cs-cap{--c:6;--s:2;--r:9;--rs:2;--bg:var(--snx-chalk)}
.cs-cap p{font-family:var(--snx-mono);font-size:10.5px;line-height:1.55;letter-spacing:.03em;color:var(--snx-ink-60)}
.cs-cap p b{font-family:var(--snx-mono);font-size:10.5px;line-height:1.55;color:var(--snx-ink);font-weight:600;display:inline}
@media (min-width:1440px){
  .cs-shot{--rs:7}
  .cs-mode{--r:3;--rs:1}
  .cs-mode .snx-pad{padding:10px 18px}
  .cs-mode .gl{--gl-size:36px}
  .cs-client{--r:4;--rs:2}
  .cs-role{--r:6;--rs:2}
  .cs-cap{--r:8;--rs:2}
}
@media (max-width:1023px){
  .cs-title{--c:1;--s:3;--r:1;--rs:2}
  .cs-title b{font-size:var(--snx-s4)}
  .cs-hook{--c:4;--s:2;--r:1;--rs:2}
  .cs-hook p{font-size:14px;line-height:1.3}
  .cs-hook .k{display:none}
  .cs-hook .snx-pad{padding:10px 14px;justify-content:center}
  .cs-shot{--c:1;--s:4;--r:3;--rs:6}
  .cs-mode{--c:5;--s:1;--r:3;--rs:2}
  .cs-mode .snx-pad{flex-direction:row;flex-wrap:wrap;align-items:center;gap:6px 10px;padding:12px}
  .cs-mode .gl{--gl-size:28px}
  .cs-mode .pair b{font-size:13.5px}
  .cs-mode .pair span{font-size:11px}
  .cs-client{--c:5;--s:1;--r:5;--rs:3}
  .cs-client p,.cs-role p{font-size:12.5px;line-height:1.4}
  .cs-client .snx-pad,.cs-role .snx-pad{padding:10px 12px}
  .cs-role{--c:5;--s:1;--r:8;--rs:3}
  .cs-cap{--c:1;--s:4;--r:9;--rs:2}
}
@media (max-width:639px){
  .cs-title{--c:1;--s:3;--r:1;--rs:2}
  .cs-title b{font-size:var(--snx-s4)}
  .cs-hook{--c:1;--s:3;--r:3;--rs:2}
  .cs-shot{--c:1;--s:3;--r:5;--rs:4}
  .cs-mode{--c:1;--s:3;--r:9;--rs:1}
  .cs-mode .snx-pad{flex-direction:row;align-items:center;gap:12px;padding:8px 14px}
  .cs-mode .pair{flex-direction:row;gap:10px;align-items:baseline}
  .cs-client{--c:1;--s:3;--r:10;--rs:2}
  .cs-role{--c:1;--s:3;--r:12;--rs:1}
  .cs-role .snx-pad,.cs-client .snx-pad{padding:10px 14px}
  .cs-cap{--c:1;--s:3;--r:13;--rs:2}
}

/* ---------- B3 · the sample: the matrix as a manifest (laws 4, 5) ---------- */
.cs-frame{--c:1;--s:4;--r:1;--rs:1;--bg:var(--snx-chalk)}
.cs-frame .snx-pad{padding:8px 18px;justify-content:center}
.cs-frame p{font-size:13.5px;line-height:1.4;text-wrap:pretty}
.cs-link{--bg:var(--snx-navy);color:var(--snx-chalk);text-decoration:none;display:block}
.cs-link .snx-pad{padding:8px 16px;justify-content:center;flex-direction:row;align-items:center;gap:10px}
.cs-gh .k,.cs-cta .k{display:none}
.cs-link b{font-size:15px;font-weight:700;line-height:1.2}
.cs-link .k{color:rgba(251,250,241,.7)}
.cs-link.alt{--bg:var(--snx-chalk);color:var(--snx-ink);box-shadow:inset 0 0 0 1px var(--snx-ink)}
.cs-link.alt .k{color:var(--snx-ink-60)}
/* law 8: lit by focus or hover only */
.cs-link:hover,.cs-link:focus-visible{--bg:var(--snx-signal);color:var(--snx-ink);outline:none}
.cs-link:hover .k,.cs-link:focus-visible .k{color:var(--snx-ink)}
.cs-try{--c:5;--s:2;--r:1;--rs:1}
.cs-gh{--c:7;--s:1;--r:1;--rs:1}
.cs-axq{--c:1;--s:1;--r:2;--rs:6;--bg:var(--snx-mint)}
.cs-axq .snx-pad{justify-content:flex-start;gap:14px}
.cs-axq p{font-size:13px;line-height:1.4}
.cs-axq p b{font-family:var(--snx-mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;display:block;margin-bottom:3px;line-height:1.3}
.cs-mx{--c:2;--s:4;--r:2;--rs:6;--bg:var(--snx-chalk);box-shadow:inset 0 0 0 1px var(--snx-ink);overflow:visible !important;z-index:2}
.cs-key{--c:6;--s:2;--r:2;--rs:6;--bg:var(--snx-chalk)}
.cs-key .snx-pad{justify-content:flex-start;gap:10px;padding:14px 18px}
.cs-key p{font-family:var(--snx-mono);font-size:10.5px;line-height:1.55;letter-spacing:.03em;color:var(--snx-ink-60);font-variant-numeric:tabular-nums}
.cs-key p b{font-family:var(--snx-mono);font-size:10.5px;color:var(--snx-ink);font-weight:600;display:inline}
.cs-key i{display:inline-block;width:9px;height:9px;vertical-align:-1px;margin-right:6px;background:var(--snx-navy)}
.cs-key i.you{background:var(--snx-signal);width:12px;height:12px;vertical-align:-2px}
.cs-key i.older{background:var(--snx-ink-18)}
@media (max-width:1023px){
  .cs-frame{--c:1;--s:5;--r:1;--rs:1}
  .cs-frame p{font-size:13px}
  .cs-try{--c:1;--s:2;--r:2;--rs:1}
  .cs-gh{--c:3;--s:3;--r:2;--rs:1}
  .cs-link .snx-pad{padding:8px 12px}
  .cs-link b{font-size:13px}
  .cs-mx{--c:1;--s:4;--r:3;--rs:6}
  .cs-axq{--c:5;--s:1;--r:3;--rs:6}
  .cs-axq .snx-pad{padding:12px}
  .cs-axq p{font-size:12px;line-height:1.35}
  .cs-axq p b{font-size:10px}
  .cs-key{--c:1;--s:5;--r:9;--rs:4}
  .cs-key .snx-pad{padding:12px 16px}
  .cs-key p{font-size:10px;letter-spacing:.02em}
}
@media (max-width:639px){
  .cs-frame{--c:1;--s:3;--r:1;--rs:2}
  .cs-try{--c:1;--s:2;--r:3;--rs:1}
  .cs-gh{--c:3;--s:1;--r:3;--rs:1}
  .cs-link .snx-pad{padding:6px 10px}
  .cs-mx{--c:1;--s:3;--r:4;--rs:6}
  .cs-key{--c:1;--s:3;--r:10;--rs:6}
  .cs-axq{display:none}
}
/* the matrix's interior: axes on the centre lines, one colour, four names, the dots */
.cs-mx .cs-axes{position:absolute;inset:0;pointer-events:none;z-index:1;
  background-image:linear-gradient(to right,transparent calc(50% - 1px),var(--snx-navy) calc(50% - 1px) calc(50% + 1px),transparent calc(50% + 1px)),
                   linear-gradient(to bottom,transparent calc(50% - 1px),var(--snx-navy) calc(50% - 1px) calc(50% + 1px),transparent calc(50% + 1px))}
.cs-mx .cs-qd{position:absolute;width:50%;height:50%;display:flex;align-items:center;justify-content:center;text-align:center;pointer-events:none;z-index:1;
  font-size:var(--snx-s3);line-height:1.1;color:var(--snx-ink-40);font-weight:500;letter-spacing:-.01em}
.cs-mx .cs-qd[data-qd=pi]{left:0;top:0}.cs-mx .cs-qd[data-qd=vi]{right:0;top:0}.cs-mx .cs-qd[data-qd=pg]{left:0;bottom:0}.cs-mx .cs-qd[data-qd=vg]{right:0;bottom:0}
.cs-mx .cs-qd b{position:absolute;font-family:var(--snx-mono);font-size:9.5px;letter-spacing:.1em;color:var(--snx-ink-60);font-weight:600;font-variant-numeric:tabular-nums}
.cs-mx .cs-qd[data-qd=pi] b{left:8px;top:6px}.cs-mx .cs-qd[data-qd=vi] b{right:8px;top:6px}.cs-mx .cs-qd[data-qd=pg] b{left:8px;bottom:6px}.cs-mx .cs-qd[data-qd=vg] b{right:8px;bottom:6px}
.cs-mx .cs-ax{position:absolute;font-family:var(--snx-mono);font-size:9.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--snx-navy);font-weight:600;z-index:3;pointer-events:none;background:var(--snx-chalk);padding:1px 5px;white-space:nowrap}
.cs-mx .cs-ax[data-ax=top]{left:50%;top:4px;transform:translateX(-50%)}
.cs-mx .cs-ax[data-ax=bottom]{left:50%;bottom:4px;transform:translateX(-50%)}
.cs-mx .cs-ax[data-ax=left]{left:4px;top:50%;transform:translateY(-50%)}
.cs-mx .cs-ax[data-ax=right]{right:4px;top:50%;transform:translateY(-50%)}
@media (max-width:1023px){.cs-mx .cs-qd{font-size:15px}.cs-mx .cs-ax{font-size:8.5px;letter-spacing:.08em}}
@media (max-width:639px){.cs-mx .cs-qd{font-size:13px}.cs-mx .cs-qd b{font-size:8.5px}.cs-mx .cs-ax{font-size:8px;letter-spacing:.06em}}
/* the dot: the Circuit's pulse at rest — a square 3/16 of a row — on a union intersection */
.cs-mx .cs-dot{position:absolute;z-index:4;width:calc(var(--snx-row)*3/16);height:calc(var(--snx-row)*3/16);background:var(--snx-navy);
  left:calc(var(--qx)*100%/var(--q,20));top:calc(var(--qy)*100%/var(--h,12));transform:translate(-50%,-50%);pointer-events:none}
.cs-mx .cs-dot[data-age=older]{background:var(--snx-ink-18)}
.cs-mx .cs-dot[data-age=you]{background:var(--snx-signal);width:calc(var(--snx-row)*3/8);height:calc(var(--snx-row)*3/8);z-index:5;box-shadow:0 0 0 2px var(--snx-chalk)}
.cs-mx .cs-dot[data-age=you].flip::after{left:auto;right:calc(100% + 6px)}
.cs-mx .cs-dot[data-age=you]::after{content:attr(data-label);position:absolute;left:calc(100% + 6px);top:50%;transform:translateY(-50%);font-family:var(--snx-mono);font-size:9.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--snx-ink);font-weight:600;background:var(--snx-chalk);padding:1px 4px}
/* the page's grids and the half-rows over the matrix, on request (the engine's element, never the stage's pseudo-elements) */
.cs-mx .snx-gridlines{opacity:0;transition:opacity 200ms ease;z-index:2;inset:0;
  background-image:linear-gradient(to right,var(--snx-ink-18) 0 1px,transparent 1px),linear-gradient(to right,rgba(27,42,155,.28) 0 1px,transparent 1px),repeating-linear-gradient(to bottom,rgba(164,75,224,.35) 0 1px,transparent 1px calc(var(--snx-row)/2));
  background-size:calc(100%/var(--s,1)) 100%,calc(100%*var(--snx-base)/(var(--s,1)*var(--snx-over))) 100%,100% 100%}
.cs.cs-grids .cs-mx .snx-gridlines{opacity:1}
/* the matrix assembles; its dots never move (the doctrine: motion is structure, never garnish) */
.snx-assemble .cs-mx .cs-dot{opacity:0;transition:opacity 300ms ease}
.snx-assemble.snx-in .cs-mx .cs-dot{opacity:1;transition-delay:calc(var(--d,0s) + .45s)}
@media (prefers-reduced-motion:reduce){.snx-assemble .cs-mx .cs-dot{opacity:1;transition:none}}

/* ---------- B5 · the result as a roster (law 6) ---------- */
.cs-ro{--bg:var(--snx-chalk)}
.cs-ro .snx-pad{justify-content:space-between}
.cs-ro p{font-size:14.5px;line-height:1.35;font-weight:600;text-wrap:balance}
.cs-ro1{--c:1;--s:2;--r:1;--rs:2;--bg:var(--snx-mint)}
.cs-ro2{--c:3;--s:3;--r:1;--rs:2;--bg:var(--snx-sky)}
.cs-ro3{--c:6;--s:2;--r:1;--rs:2;--bg:var(--snx-chalk);box-shadow:inset 0 0 0 1px var(--snx-ink)}
.cs-ro4{--c:1;--s:4;--r:3;--rs:2;--bg:var(--snx-butter)}
.cs-ro5{--c:5;--s:3;--r:3;--rs:2;--bg:var(--snx-ink);color:var(--snx-chalk)}
.cs-ro5 .snx-pad{padding:10px 16px}
.cs-ro5 p{font-family:var(--snx-mono);font-size:11.5px;font-weight:400;line-height:1.45;letter-spacing:.02em}
@media (max-width:1023px){
  .cs-ro p{font-size:13.5px}
  .cs-ro1{--c:1;--s:2;--r:1;--rs:2}
  .cs-ro2{--c:3;--s:3;--r:1;--rs:2}
  .cs-ro3{--c:1;--s:2;--r:3;--rs:2}
  .cs-ro4{--c:3;--s:3;--r:3;--rs:2}
  .cs-ro5{--c:1;--s:5;--r:5;--rs:2}
  .cs-ro5 .snx-pad{padding:10px 16px;justify-content:center}
  .cs-ro5 p{font-size:11px}
}
/* at 3×2 the roster collapses to sky: a set piece that costs nine rows for one sentence is sky at that edition */
.cs-ro-sky{display:none}
@media (max-width:639px){
  .cs-ro-stage{display:none}
  .cs-ro-sky{display:block}
}

/* ---------- B6 · the client's voice as an extract block (law 7; the book's arithmetic) ---------- */
.sky .cs-x{
  margin-top:var(--sky-unit);
  padding:calc(var(--sky-unit) - var(--tb)*var(--sky-cap)*var(--sky-sub)) var(--sky-inset) var(--sky-unit);
  background:var(--snx-chalk);box-shadow:inset 0 0 0 1px var(--snx-ink);
  position:relative;z-index:2;
}
.sky .cs-x > p{margin-top:0;padding-inline:0;text-indent:0;hanging-punctuation:first;font-size:var(--sky-sub);line-height:var(--sky-unit);font-weight:500}
.sky .cs-by{font-family:var(--snx-mono);font-size:var(--sky-note);line-height:var(--sky-unit);color:var(--snx-ink-60);letter-spacing:.02em}
.sky.cs-sky p + .cs-by,.sky .cs-x + .cs-by{margin-top:calc(2*var(--sky-unit) - var(--tb)*var(--sky-cap)*var(--sky-note))}
/* the study's sky passages: no initial (the page's one signal is the participant's dot) */
.sky.cs-sky .lede::first-letter{initial-letter:normal;color:inherit;font-weight:inherit;margin:0;font-size:inherit;float:none}
.sky.cs-sky h3{margin-top:calc(3*var(--sky-unit) - var(--tb)*var(--sky-cap)*var(--sky-sub))}
.sky.cs-sky .eyebrow + h2{margin-top:calc(var(--sky-unit) - var(--tb)*var(--sky-cap)*var(--sky-display))}
.sky.cs-sky .modes{font-weight:700;font-size:var(--sky-sub);line-height:var(--sky-unit)}
.sky.cs-sky .lede + .modes{margin-top:calc(2*var(--sky-unit) - var(--tb)*var(--sky-cap)*var(--sky-sub))}
.sky.cs-sky .modes img{height:1em;width:auto;display:inline-block;vertical-align:-.12em;margin:0 .25em 0 .6em}
.sky.cs-sky .modes img:first-child{margin-left:0}
.sky.cs-sky .btn{display:inline-block;background:var(--snx-navy);color:var(--snx-chalk);text-decoration:none;padding:0 14px;line-height:var(--sky-unit);font-weight:700}
.sky.cs-sky .btn:hover,.sky.cs-sky .btn:focus-visible{background:var(--snx-signal);color:var(--snx-ink);outline:none}
/* the A setting's images: a figure in the sky holding one image block of whole rows */
.sky .cs-fig{grid-column:1 / -1;padding-inline:0;margin-top:calc(2*var(--sky-unit))}
.sky .cs-fig .snx-stage{grid-auto-rows:var(--snx-row)}
.cs-fig-shot{--c:1;--s:7;--r:1;--rs:12}
@media (min-width:1440px){.cs-fig-shot{--rs:10}}
@media (max-width:1023px){.cs-fig-shot{--s:5;--rs:8}}
@media (max-width:639px){.cs-fig-shot{--s:3;--rs:4}}

/* ---------- B8 · the capability footer and the call to action (law 8) ---------- */
.cs-gl{--bg:var(--snx-chalk)}
.cs-gl .snx-pad{align-items:center;justify-content:center}
.cs-gl .gl{--gl-size:calc(var(--snx-row) - 20px)}
.cs-gl .k{text-align:center;margin-top:6px}
.cs-gl1{--c:1;--s:1;--r:1;--rs:2}
.cs-gl2{--c:2;--s:1;--r:1;--rs:2}
.cs-capa{--c:3;--s:3;--r:1;--rs:3;--bg:var(--snx-butter)}
.cs-capa p{font-size:14px;line-height:1.45;text-wrap:pretty}
.cs-gll{--c:1;--s:2;--r:3;--rs:1;--bg:var(--snx-chalk);display:block}
.cs-gll .snx-pad{padding:8px 14px;justify-content:center}
.cs-gll p{font-size:13px}
.cs-sea7{--c:6;--s:2;--r:3;--rs:1;--bg:var(--snx-paper);display:block}
.cs-contact{--c:6;--s:2;--r:1;--rs:1;--bg:var(--snx-chalk)}
.cs-contact .snx-pad{justify-content:center;padding:10px 18px}
.cs-contact p{font-family:var(--snx-mono);font-size:12px;line-height:1.5;letter-spacing:.02em}
.cs-contact a{color:var(--snx-ink)}
.cs-cta{--c:6;--s:2;--r:2;--rs:1}
@media (max-width:1023px){
  .cs-gl1{--c:1;--s:1;--r:1;--rs:2}
  .cs-gl2{--c:2;--s:1;--r:1;--rs:2}
  .cs-gll{--c:1;--s:2;--r:3;--rs:1}
  .cs-sea7{display:none}
  .cs-capa{--c:3;--s:3;--r:1;--rs:3}
  .cs-contact{--c:1;--s:3;--r:4;--rs:1}
  .cs-cta{--c:4;--s:2;--r:4;--rs:1}
}
@media (max-width:639px){
  .cs-gl1{--c:1;--s:1;--r:1;--rs:1}
  .cs-gl2{--c:2;--s:1;--r:1;--rs:1}
  .cs-gl .gl{--gl-size:28px}
  .cs-gl .snx-pad{padding:8px;gap:2px}
  .cs-gl .k{display:none}
  .cs-gll{--c:3;--s:1;--r:1;--rs:1}
  .cs-gll p{font-size:12px;line-height:1.3}
  .cs-sea7{display:none}
  .cs-capa{--c:1;--s:3;--r:2;--rs:4}
  .cs-capa p{font-size:13.5px;line-height:1.4}
  .cs-contact{--c:1;--s:3;--r:6;--rs:1}
  .cs-cta{--c:1;--s:3;--r:7;--rs:1}
}

/* ---------- Study C · the counts ---------- */
.cs-table{border:1px solid var(--snx-ink);background:var(--snx-chalk);margin-top:14px;padding:0}
.cs-table table{border-collapse:collapse;width:100%;font-size:13px;font-family:var(--snx-mono);font-variant-numeric:tabular-nums}
.cs-table th{font-size:10px;letter-spacing:.12em;text-transform:uppercase;text-align:left;padding:10px 14px 6px;border-bottom:2px solid var(--snx-ink);color:var(--snx-ink-60);font-weight:600}
.cs-table td{padding:6px 14px;border-bottom:1px solid var(--snx-ink-18);vertical-align:top}
.cs-table tr:last-child td{border-bottom:0}
.cs-table td:first-child{color:var(--snx-ai-deep);font-weight:600;white-space:nowrap}
.cs-table td.n{text-align:right;white-space:nowrap}
.cs-table td.d{color:var(--snx-ink-60)}
.cs-table td.d b{color:var(--snx-ink);font-weight:600}
.cs-table td.hold-no{color:var(--snx-work);font-weight:600}
.cs-diff td{font-family:var(--snx-grotesk);font-size:14.5px;white-space:normal}
.cs-diff td:first-child{font-family:var(--snx-mono);font-size:12px}
@media (max-width:639px){.cs-table table{font-size:11px}.cs-diff td{font-size:13px}}