/*
 * ═══════════════════════════════════════════════════════════════
 * TESSERACTIC — APPLICATION SHELL (dark-pine register)
 * ═══════════════════════════════════════════════════════════════
 *
 * Version:   0.1
 * Date:      29 September 2026
 * Author:    Diane — Creative Director
 * Source:    Étude 00 (principles), wireframe v0.2, commission of
 *            29 September 2026
 *
 * Hierarchy: Layer 2c (Platform). Imports tesseractic-base.css.
 *            Beside tesseractic-web.css (2a, the holding poster)
 *            and tesseractic-docs.css (2b, print).
 *
 * The attitude: the Vieux-Port at night. A harbour-master's board,
 * not a brochure. One ground, pastis rules for structure, carved
 * figures, the mono terminal for the system voice. The operator
 * does not forget padding: spacing is on the token scale, always.
 *
 * Discipline: --t-* tokens and t- classes only. No --sc-*.
 *             No rounded corners. No fills for elevation. No
 *             animation beyond a 120ms colour change on hover.
 * ═══════════════════════════════════════════════════════════════
 */

@import url('./tesseractic-base.css?v=20260930a');


/* =================================================================
   1. GROUND
   ================================================================= */

html {
  background: var(--t-pine);
  scroll-padding-top: calc(var(--t-bar-h) + 16px);
  /* clip, not hidden: it stops the page from scrolling sideways without
     making the root a scroll container, so the sticky bar and the fixed
     ghost keep working. A wide interior table then scrolls inside its
     own .t-scroll container, as the brief asks, instead of widening the
     page (measured at 390 px, Diane, 30 September 2026). */
  overflow-x: clip;
}

body.t-app {
  background: var(--t-pine);
  color: var(--t-stone);
  font-size: 15px;
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  overflow-x: hidden;
}

.t-app p { margin: 0; }

.t-app :focus-visible {
  outline: 1.5px solid var(--t-mint);
  outline-offset: 3px;
}

.t-skip {
  position: absolute;
  left: var(--t-gutter);
  top: -60px;
  z-index: 100;
  background: var(--t-stone);
  color: var(--t-pine);
  padding: 8px 12px;
  font-family: var(--t-font-mono);
  font-size: 11px;
  text-decoration: none;
}
.t-skip:focus { top: 8px; }

/* The ghost, hors champ — mint, one fill, right side, fixed. */
.t-ghost {
  position: fixed;
  top: -22vh;
  right: -44vh;
  height: 160vh;
  width: 168vh;
  opacity: 0.045;
  pointer-events: none;
  z-index: 0;
}
.t-ghost svg { width: 100%; height: 100%; max-width: none; }

.t-bar, .t-strip, .t-main, .t-foot, .t-drawer { position: relative; z-index: 1; }


/* =================================================================
   2. TYPE WORDS — labels, meta, tags, buttons
   ================================================================= */

.t-app .t-label {
  font-family: var(--t-font-primary);
  font-weight: var(--t-w-medium);
  font-size: 11px;
  letter-spacing: var(--t-track-lapidary);
  text-transform: uppercase;
  color: var(--t-pastis);
  line-height: 1.4;
}
.t-app .t-label--mute { color: var(--t-mute-hi); }

.t-app .t-meta {
  font-family: var(--t-font-mono);
  font-size: 10.5px;
  letter-spacing: 0.04em;
  text-transform: none;
  color: var(--t-mute-hi);
  line-height: 1.5;
}
.t-app .t-meta--hi { color: var(--t-stone-80); }

.t-lock { width: 9px; height: 10.5px; display: inline-block; vertical-align: -1px; }
.t-meta__lock { display: inline-block; width: 8px; height: 9.5px; margin-right: 4px; vertical-align: -1px; }

.t-arrow { font-family: var(--t-font-primary); font-weight: var(--t-w-regular); }

/* Tags — the terminal badge */
.t-tag {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-family: var(--t-font-mono);
  font-size: 9.5px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--t-pastis);
  border: 1px solid var(--t-pastis-40);
  padding: 1px 6px 0;
  line-height: 1.6;
  white-space: nowrap;
  vertical-align: 1px;
}
.t-tag__lock { width: 7px; height: 8.5px; }

/* Buttons — square, lapidary caps. Solid mint = the door. */
.t-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  height: 36px;
  padding: 0 16px;
  font-family: var(--t-font-primary);
  font-weight: var(--t-w-medium);
  font-size: 11px;
  letter-spacing: var(--t-track-wider);
  text-transform: uppercase;
  text-decoration: none;
  white-space: nowrap;
  border: 1px solid var(--t-stone);
  color: var(--t-stone);
  background: transparent;
  cursor: pointer;
  transition: background-color 120ms ease-out, color 120ms ease-out, border-color 120ms ease-out;
}
.t-btn:hover { color: var(--t-pine); background: var(--t-stone); }
.t-btn--solid { background: var(--t-mint); border-color: var(--t-mint); color: var(--t-pine); }
.t-btn--solid:hover { background: var(--t-stone); border-color: var(--t-stone); color: var(--t-pine); }
.t-btn--wide { width: 100%; height: 44px; }

.t-link-caps {
  font-family: var(--t-font-primary);
  font-weight: var(--t-w-medium);
  font-size: 11px;
  letter-spacing: var(--t-track-wider);
  text-transform: uppercase;
  color: var(--t-mint);
  text-decoration: none;
}
.t-link-caps:hover { color: var(--t-stone); }


/* =================================================================
   3. THE APPLICATION BAR
   ================================================================= */

.t-bar {
  display: flex;
  align-items: center;
  gap: 40px;
  height: var(--t-bar-h);
  padding: 0 var(--t-gutter);
  border-bottom: 1px solid var(--t-pastis-40);
  background: var(--t-pine);
  position: sticky;
  top: 0;
  z-index: 20;
}

.t-bar__lockup {
  display: inline-flex;
  align-items: center;
  gap: 14px;
  text-decoration: none;
  color: var(--t-stone);
  flex: none;
}
.t-bar__mark { height: 28px; width: auto; }
.t-bar__word { font-size: 14px; letter-spacing: var(--t-track-lapidary); }
.t-bar__lockup:hover { color: var(--t-stone); }

.t-tabs { flex: 1; min-width: 0; align-self: stretch; }
.t-tabs ul, .t-drawer ul { list-style: none; margin: 0; padding: 0; }
.t-tabs ul { display: flex; height: 100%; gap: 28px; }
.t-tabs li { display: flex; }

.t-tab {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-family: var(--t-font-primary);
  font-weight: var(--t-w-medium);
  font-size: 11px;
  letter-spacing: var(--t-track-wider);
  text-transform: uppercase;
  color: var(--t-stone-80);
  text-decoration: none;
  white-space: nowrap;
  border-bottom: 2px solid transparent;
  margin-bottom: -1px;
  padding-top: 2px;
}
.t-tab:hover { color: var(--t-stone); }
.t-tab.is-active { color: var(--t-stone); border-bottom-color: var(--t-pastis); }
.t-tab--locked { color: var(--t-mute-hi); cursor: not-allowed; }
.t-tab--locked:hover { color: var(--t-mute-hi); }
.t-tab__lock { width: 8px; height: 9.5px; opacity: 0.9; }
.t-tabs li:nth-child(4) { margin-left: 14px; padding-left: 28px; border-left: 1px solid var(--t-pastis-18); }

.t-bar__actions { display: flex; align-items: center; gap: 10px; flex: none; }
.t-bar__show-s { display: none; }
.t-show-s { display: none; }

.t-bar__menu {
  display: none;
  width: 36px; height: 36px;
  background: transparent;
  border: 1px solid var(--t-pastis-40);
  color: var(--t-stone);
  cursor: pointer;
  padding: 0;
}
.t-bar__menu-icon { display: flex; flex-direction: column; gap: 4px; align-items: center; }
.t-bar__menu-icon i { display: block; width: 16px; height: 1.5px; background: currentColor; }

.t-drawer {
  border-bottom: 1px solid var(--t-pastis-40);
  padding: 8px var(--t-gutter) 20px;
  background: var(--t-pine);
  position: sticky;
  top: var(--t-bar-h);
  z-index: 19;
}
.t-drawer[hidden] { display: none; }
.t-drawer li { border-bottom: 1px solid var(--t-pastis-18); }
.t-drawer .t-tab { display: flex; height: 48px; border: 0; margin: 0; }
.t-drawer__door { margin-top: 16px; }
.t-drawer__door .t-btn { width: 100%; height: 44px; }


/* =================================================================
   4. THE STATUS STRIP — the system line in place of a hero claim
   ================================================================= */

.t-strip {
  display: flex;
  align-items: center;
  gap: 24px;
  min-height: 34px;
  padding: 7px var(--t-gutter);
  border-bottom: 1px solid var(--t-pastis-18);
  font-family: var(--t-font-mono);
  font-size: 10.5px;
  letter-spacing: 0.06em;
  color: var(--t-mute-hi);
  line-height: 1.5;
}
.t-strip__items { flex: 1; display: flex; flex-wrap: wrap; column-gap: 10px; row-gap: 2px; }
.t-strip__market { color: var(--t-stone); text-transform: uppercase; letter-spacing: 0.12em; }
.t-strip__market::before {
  content: "";
  display: inline-block;
  width: 6px; height: 6px;
  background: var(--t-pastis);
  margin-right: 10px;
  vertical-align: 1px;
}
.t-strip__sep { color: var(--t-pastis); }
.t-strip__key { color: var(--t-mute-hi); }
.t-operator { color: inherit; text-decoration: none; }
.t-operator:hover { color: var(--t-mint); text-decoration: underline; text-decoration-color: var(--t-pastis); text-underline-offset: 3px; }
.t-strip__operator { color: var(--t-stone); text-transform: uppercase; letter-spacing: 0.12em; white-space: nowrap; }


/* =================================================================
   5. THE START PAGE — above the fold
   Main column: the market (overview + chart). Side column: the
   members' area, then the door. Panels are regions divided by pastis
   hairlines, never boxes (The Language, VI.6).
   ================================================================= */

/* min-width: 0 added 30 September 2026 (Diane): body is a column flex
   container, so main's automatic minimum size would otherwise take the
   min-content width of a wide interior table and widen the page. */
.t-main { flex: 1; min-width: 0; outline: none; }

.t-start {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 380px;
  grid-template-rows: auto 1fr;
  align-items: start;
  grid-template-areas:
    "market members"
    "market access";
  padding: 0 var(--t-gutter);
  border-bottom: 1px solid var(--t-pastis-40);
}
.t-market  { grid-area: market;  padding: 16px 40px 18px 0; border-right: 1px solid var(--t-pastis-18); min-width: 0; }
.t-members { grid-area: members; padding: 16px 0 0 32px; }
.t-access  { grid-area: access;  padding: 20px 0 24px 32px; margin: 28px 0 0 32px; padding-left: 0; align-self: start; }

.t-panel__head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 14px;
}
.t-panel__head .t-label { margin: 0; }

/* ── The three groups ───────────────────────────────────────── */

.t-groups {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  grid-template-rows: auto auto auto;
  border-top: 1px solid var(--t-pastis);
}
.t-group {
  display: grid;
  grid-row: span 3;
  grid-template-rows: subgrid;
  padding: 10px 24px 0;
  border-left: 1px solid var(--t-pastis-18);
  min-width: 0;
}
.t-group:first-child { padding-left: 0; border-left: 0; }

.t-app .t-group__head {
  font-family: var(--t-font-primary);
  font-weight: var(--t-w-bold);
  font-size: 12px;
  letter-spacing: var(--t-track-lapidary);
  text-transform: uppercase;
  color: var(--t-stone);
  line-height: 1.3;
  margin: 0 0 4px;
}
.t-group__q {
  display: block;
  margin-top: 2px;
  font-family: var(--t-font-mono);
  font-weight: var(--t-w-regular);
  font-size: 10px;
  letter-spacing: 0.02em;
  text-transform: none;
  color: var(--t-mute-hi);
}

/* ── Tiles: the carved figure ───────────────────────────────── */

.t-tile {
  position: relative;
  padding: 9px 0 11px;
  border-top: 1px solid var(--t-pastis-18);
  outline-offset: 2px;
}
.t-group__head + .t-tile { border-top: 0; }
.t-tile:hover .t-tile__label, .t-tile:focus .t-tile__label { color: var(--t-stone); }

.t-tile__label {
  font-size: 12.5px;
  font-weight: var(--t-w-regular);
  line-height: 1.3;
  color: var(--t-stone-80);
}
.t-tile__value {
  margin-top: 6px !important;
  font-weight: var(--t-w-bold);
  font-size: 32px;
  line-height: 1;
  letter-spacing: 0.01em;
  color: var(--t-pastis);
  font-feature-settings: "tnum" 1, "lnum" 1;
  white-space: nowrap;
}
.t-tile__unit {
  font-weight: var(--t-w-medium);
  font-size: 0.42em;
  letter-spacing: 0.12em;
  color: var(--t-mint);
  margin-left: 0.18em;
  vertical-align: 0.9em;
}
.t-tile__unit--pre { margin: 0 0.35em 0 0; }
.t-tile__sub {
  margin-top: 7px !important;
  font-size: 12px;
  line-height: 1.4;
  color: var(--t-mute-hi);
}
.t-tile__sub a { color: var(--t-stone); text-decoration-color: var(--t-pastis); }

/* Source and date — on hover or focus, never hidden from assistive tech */
.t-tip {
  position: absolute;
  left: 0;
  top: calc(100% - 4px);
  z-index: 30;
  width: max-content;
  max-width: 280px;
  padding: 8px 10px;
  background: var(--t-pine);
  border: 1px solid var(--t-pastis-40);
  font-family: var(--t-font-mono);
  font-size: 10.5px;
  line-height: 1.55;
  color: var(--t-stone);
  opacity: 0;
  visibility: hidden;
  transition: opacity 120ms ease-out;
  pointer-events: none;
}
.t-group:last-child .t-tip { left: auto; right: 0; }
.t-tile:hover .t-tip, .t-tile:focus .t-tip, .t-tile:focus-within .t-tip { opacity: 1; visibility: visible; }
.t-tip__k {
  font-family: var(--t-font-mono);
  font-size: 9.5px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--t-pastis);
  margin-right: 4px;
}

/* ── The claim and its proof (Carl, 30 Sep 2026) ────────────────
   One sentence that says why to buy, set beside the chart that proves
   it. Left: the claim, and two bars at one scale (committed capital
   on both sides). Right: the chart, default view committed capital by
   maturity year against the same KRW 4.3tn as a reference line. */

.t-proof {
  display: grid;
  grid-template-columns: minmax(0, 11fr) minmax(0, 9fr);
  margin-top: 12px;
  border-top: 1px solid var(--t-pastis);
}
.t-proof .t-chart { margin-top: 0; border-top: 0; padding: 12px 0 0 28px; border-left: 1px solid var(--t-pastis-18); min-width: 0; }
.t-proof .t-chart__titles { padding-right: 0; padding-top: 36px; }

.t-claim { display: flex; flex-direction: column; justify-content: center; padding: 10px 32px 12px 0; min-width: 0; container-type: inline-size; }
.t-app .t-claim__text {
  margin: 0 0 18px;
  font-family: var(--t-font-primary);
  font-weight: var(--t-w-bold);
  /* As large as the column allows, up to 60 px: the longest word, SECONDARIES, is 7.85 em wide in caps at display tracking. */
  font-size: clamp(30px, calc(100cqi / 8.1), 60px);
  line-height: 0.98;
  letter-spacing: var(--t-track-display);
  text-transform: uppercase;
  color: var(--t-stone);
  text-wrap: pretty;
}
.t-claim__em { font-style: normal; font-weight: var(--t-w-bold); color: var(--t-mint); }
.t-claim__why { align-self: flex-start; margin-top: 4px; }
.t-claim__links { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 26px; margin-top: 7px; }
.t-claim__links .t-claim__why { margin-top: 0; }

/* ── The Saint Clair Net Supply Index (Carl, 8 Oct 2026) ───────────
   The lead figure of the proof row, directly under the claim: the
   index named as a small title, the reading carved in Jost Bold pastis
   with its base small in mint, one sentence, a sparkline of the
   readings, the source. Every figure from the data file. A region
   between hairlines, never a box. */
.t-index { padding-top: 9px; border-top: 1px solid var(--t-pastis-18); min-width: 0; }
.t-app .t-index__name {
  margin: 0;
  font-family: var(--t-font-primary);
  font-weight: var(--t-w-bold);
  font-size: 12.5px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  line-height: 1.3;
  color: var(--t-stone);
}
.t-index__row { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 6px 28px; margin-top: 5px; }
.t-index__value { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 10px; }
.t-index__fig {
  font-weight: var(--t-w-bold);
  font-size: 38px;
  line-height: 1;
  letter-spacing: 0.01em;
  color: var(--t-pastis);
  font-feature-settings: "tnum" 1, "lnum" 1;
  white-space: nowrap;
}
.t-index__base {
  font-weight: var(--t-w-medium);
  font-size: 12px;
  letter-spacing: 0.06em;
  color: var(--t-mint);
  white-space: nowrap;
  font-feature-settings: "tnum" 1, "lnum" 1;
}
.t-index__spark { display: block; flex: none; width: 132px; height: 40px; overflow: visible; }
.t-index__line { fill: none; stroke: var(--t-mint); stroke-width: 1.5; stroke-linejoin: miter; }
.t-index__pt { fill: var(--t-mint); }
.t-index__pt--last { fill: var(--t-pastis); }
.t-index__text { margin-top: 6px !important; max-width: 72ch; font-size: 13.5px; line-height: 1.4; color: var(--t-stone-80); }
.t-index__src { margin-top: 4px !important; }

/* With the index under it, the claim sets at up to 48 px while the proof
   row runs side by side: four lines at 1440 px, so the claim, the index
   and the chart keep within 1440 × 900. Below 1250 px the row stacks and
   the claim keeps its 60 px (Diane, 8 Oct 2026). */
@media (min-width: 1250px) {
  .t-app .t-claim--index .t-claim__text { font-size: clamp(30px, calc(100cqi / 8.1), 48px); margin-bottom: 12px; }
}

/* why.php#index: the series, figures right-aligned */
.t-index__table { max-width: 720px; }
.t-index__table thead th { vertical-align: bottom; }


/* Reference line in the chart: dashed pastis over a pine underlay */
.t-chart__ref-under { stroke: #0F1E14; stroke-width: 4; }
.t-chart__ref-line { stroke: #C9A54A; stroke-width: 1.5; stroke-dasharray: 5 4; }
.t-chart__legend .t-chart__key--ref { width: 16px; height: 0; border-top: 2px dashed var(--t-pastis); }

/* ── The chart ──────────────────────────────────────────────── */

.t-chart { position: relative; margin-top: 12px; padding-top: 12px; border-top: 1px solid var(--t-pastis); }

.t-chart__head { display: flex; justify-content: flex-end; margin-bottom: -26px; position: relative; z-index: 2; }
.t-chart__switch { display: inline-flex; border: 1px solid var(--t-pastis-40); }
.t-chart__switch button {
  appearance: none;
  background: transparent;
  border: 0;
  border-left: 1px solid var(--t-pastis-40);
  color: var(--t-mute-hi);
  font-family: var(--t-font-mono);
  font-size: 10px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  height: 26px;
  padding: 0 11px;
  cursor: pointer;
  transition: color 120ms ease-out, background-color 120ms ease-out;
}
.t-chart__switch button:first-child { border-left: 0; }
.t-chart__switch button:hover { color: var(--t-stone); }
.t-chart__switch button[aria-selected="true"] { color: var(--t-pine); background: var(--t-pastis); }

.t-chart__titles { padding-right: 420px; min-height: 34px; }
.t-app .t-chart__title {
  font-family: var(--t-font-primary);
  font-weight: var(--t-w-bold);
  font-size: 12.5px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  line-height: 1.3;
  color: var(--t-stone);
}
.t-chart__unit { font-family: var(--t-font-mono); font-size: 10px; color: var(--t-mute-hi); margin-top: 3px !important; }

.t-chart__legend { list-style: none; display: flex; flex-wrap: wrap; gap: 4px 20px; margin: 8px 0 0; padding: 0; font-size: 12px; color: var(--t-stone-80); }
.t-chart__legend li { display: inline-flex; align-items: center; gap: 7px; }
.t-chart__key { display: inline-block; width: 10px; height: 10px; }
.t-chart__key--s1 { background: var(--t-mint); }
.t-chart__key--s2 { background: var(--t-pastis-deep); }

.t-chart__svg { width: 100%; height: auto; margin-top: 6px; overflow: visible; }
.t-chart__svg--narrow, .t-chart__svg--medium { display: none; }

.t-chart__grid { stroke: var(--t-stone-06); stroke-width: 1; }
.t-chart__base { stroke: var(--t-pastis-40); stroke-width: 1; }
.t-chart__ax { font-family: var(--t-font-mono); font-size: 10.5px; fill: var(--t-mute-hi); }
.t-chart__lb { font-family: var(--t-font-primary); font-weight: var(--t-w-medium); font-size: 12px; fill: var(--t-stone); font-feature-settings: "tnum" 1, "lnum" 1; }
.t-chart__bar--s1 { fill: var(--t-mint); }
.t-chart__bar--s2 { fill: var(--t-pastis-deep); }
.t-chart__hit { fill: rgba(0, 0, 0, 0); cursor: default; outline: none; }
.t-chart__band { fill: rgba(0, 0, 0, 0); transition: fill 120ms ease-out; }
/* Hover and focus light a band behind the columns; the columns stay as they are.
   Literal colours, not tokens: an SVG fill whose variable fails to resolve falls back to black. */
.t-chart__yr:hover .t-chart__band, .t-chart__yr:focus-within .t-chart__band { fill: rgba(150, 209, 170, 0.10); }
.t-chart__yr:focus-within .t-chart__band { stroke: #96D1AA; stroke-width: 1; }

.t-chart__tip {
  position: absolute;
  z-index: 30;
  max-width: 300px;
  padding: 8px 10px;
  background: var(--t-pine);
  border: 1px solid var(--t-pastis-40);
  font-family: var(--t-font-mono);
  font-size: 10.5px;
  line-height: 1.55;
  color: var(--t-stone);
  pointer-events: none;
}
.t-chart__tip b { font-family: var(--t-font-primary); font-weight: var(--t-w-medium); font-size: 12.5px; }

.t-chart__table { margin-top: 4px; }
.t-chart__table summary {
  display: inline-block;
  cursor: pointer;
  font-family: var(--t-font-mono);
  font-size: 10px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--t-mute-hi);
  list-style: none;
}
.t-chart__table summary::-webkit-details-marker { display: none; }
.t-chart__table summary::before { content: "+ "; color: var(--t-pastis); }
.t-chart__table[open] summary::before { content: "− "; }
.t-chart__table summary:hover { color: var(--t-stone); }
.t-chart__table .t-table { margin: 10px 0 6px; }

.t-chart__src, .t-chart__note {
  font-family: var(--t-font-mono);
  font-size: 10.5px;
  line-height: 1.5;
  color: var(--t-mute-hi);
}
.t-chart__src { margin-top: 6px !important; }
.t-chart__note { margin-top: 4px !important; color: var(--t-stone-80); }

/* ── The members' area ──────────────────────────────────────── */

.t-locked { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--t-pastis); }
.t-locked__row {
  display: grid;
  grid-template-columns: 14px minmax(0, 1fr) auto;
  gap: 12px;
  align-items: start;
  padding: 11px 0 12px;
  border-bottom: 1px solid var(--t-pastis-18);
}
.t-locked__icon { width: 10px; height: 12px; color: var(--t-mute-hi); margin-top: 3px; }
.t-locked__title { font-weight: var(--t-w-bold); font-size: 12.5px; letter-spacing: 0.12em; text-transform: uppercase; line-height: 1.3; color: var(--t-stone); }
.t-locked__desc { font-size: 12.5px; line-height: 1.4; color: var(--t-mute-hi); margin-top: 2px !important; }

.t-tier {
  font-family: var(--t-font-mono);
  font-size: 9.5px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  padding: 1px 6px 0;
  line-height: 1.6;
  margin-top: 1px;
  border: 1px solid var(--t-pastis-40);
  color: var(--t-pastis);
  white-space: nowrap;
}
.t-tier--registered { border-color: var(--t-stone-80); color: var(--t-stone-80); }

/* ── The door ───────────────────────────────────────────────── */

.t-access { border-top: 1px solid var(--t-pastis); }
.t-access__line {
  font-size: 17px;
  font-weight: var(--t-w-regular);
  line-height: 1.4;
  color: var(--t-stone);
  margin-bottom: 16px !important;
}
.t-access__member { margin-top: 12px !important; font-size: 12.5px; color: var(--t-mute-hi); }
.t-access__member a { color: var(--t-stone); }


/* =================================================================
   6. THE START PAGE — below the fold
   ================================================================= */

.t-below {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 380px;
  padding: 0 var(--t-gutter);
}
.t-reading { padding: 28px 40px 40px 0; border-right: 1px solid var(--t-pastis-18); min-width: 0; }
.t-sources { padding: 28px 0 40px 32px; }

.t-reading__card { border-top: 1px solid var(--t-pastis); padding-top: 16px; }
.t-app .t-reading__title {
  font-family: var(--t-font-primary);
  font-weight: var(--t-w-bold);
  font-size: 30px;
  letter-spacing: var(--t-track-display);
  text-transform: uppercase;
  line-height: 1.08;
  color: var(--t-stone);
  margin: 10px 0 12px;
  max-width: 26ch;
}
.t-app .t-reading__title a { color: inherit; text-decoration: none; }
.t-app .t-reading__title a:hover { color: var(--t-mint); }
.t-reading__stand { font-size: 16px; line-height: 1.55; color: var(--t-stone-80); max-width: 68ch; margin-bottom: 18px !important; }

.t-sources__gen { margin-top: 12px !important; }


/* =================================================================
   7. TABLES — protagonists, Bloomberg-grade
   ================================================================= */

.t-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.t-table th, .t-table td { text-align: left; vertical-align: top; padding: 8px 10px 8px 0; border-bottom: 1px solid var(--t-pastis-18); }
.t-table thead th {
  font-family: var(--t-font-mono);
  font-weight: var(--t-w-regular);
  font-size: 9.5px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--t-pastis);
  border-bottom: 1px solid var(--t-pastis);
}
.t-table tbody th { font-weight: var(--t-w-regular); color: var(--t-stone); }
.t-table td { color: var(--t-stone-80); font-feature-settings: "tnum" 1, "lnum" 1; }

.t-table--ledger { border-top: 1px solid var(--t-pastis); }
.t-table--ledger th { width: 40%; font-size: 13px; }
.t-table--ledger td { font-family: var(--t-font-mono); font-size: 11px; line-height: 1.5; padding-top: 9px; }
.t-table--ledger a { color: var(--t-stone); }

.t-table--chart td, .t-table--chart tbody th { font-family: var(--t-font-mono); font-size: 11px; padding: 5px 16px 5px 0; }
.t-table--chart td { text-align: right; }
.t-table--chart thead th:not(:first-child) { text-align: right; }
.t-table--chart { width: auto; min-width: 320px; }


/* =================================================================
   8. INNER PAGES — the standard, request access, notices, members
   ================================================================= */

.t-doc {
  display: grid;
  grid-template-columns: 260px minmax(0, 1fr);
  gap: 0 48px;
  padding: 40px var(--t-gutter) 72px;
}
.t-doc__head { grid-column: 1 / -1; padding-bottom: 28px; margin-bottom: 36px; border-bottom: 1px solid var(--t-pastis); }
.t-app .t-doc__title {
  margin: 14px 0 0;
  font-weight: var(--t-w-bold);
  font-size: clamp(30px, 4vw, 52px);
  letter-spacing: 0.14em;
  line-height: 1.05;
  color: var(--t-stone);
}
.t-doc__lede { margin-top: 18px !important; font-size: 19px; line-height: 1.45; max-width: 44ch; color: var(--t-stone); }

.t-doc__aside { font-family: var(--t-font-mono); font-size: 10.5px; line-height: 1.6; color: var(--t-mute-hi); }
.t-doc__aside .t-label { margin-bottom: 10px; }
.t-doc__body { min-width: 0; max-width: 76ch; }
.t-doc__body > * + * { margin-top: 18px !important; }
.t-doc__body p { font-size: 16px; line-height: 1.6; color: var(--t-stone-80); }
.t-app .t-doc__body h2 {
  font-weight: var(--t-w-bold);
  font-size: 13px;
  letter-spacing: var(--t-track-lapidary);
  color: var(--t-stone);
  padding-top: 26px;
  margin-top: 30px !important;
  border-top: 1px solid var(--t-pastis-18);
}
.t-app .t-doc__body h2:first-child { margin-top: 0 !important; padding-top: 0; border-top: 0; }

/* ── Why Korean venture secondaries (why.php, 30 Sep 2026) ──
   The title is the claim, set as on the start page: light, sentence case. */
.t-app.t-page-why .t-doc__title {
  font-weight: var(--t-w-bold);
  text-transform: uppercase;
  letter-spacing: var(--t-track-display);
  line-height: 1.0;
  font-size: clamp(34px, 5vw, 72px);
}
.t-app.t-page-why .t-doc__body h2 { font-size: clamp(20px, 2.2vw, 28px); letter-spacing: var(--t-track-display); line-height: 1.1; padding-top: 34px; margin-top: 44px !important; }
.t-app.t-page-why .t-doc__body h2:first-child { padding-top: 0; margin-top: 0 !important; }
.t-app .t-why h3 {
  margin-top: 26px !important;
  font-weight: var(--t-w-bold);
  font-size: 16px;
  line-height: 1.35;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--t-stone);
}
.t-app .t-why h2 + h3 { margin-top: 20px !important; }
.t-app .t-why h3 + p { margin-top: 8px !important; }
.t-why p + p { margin-top: 10px !important; }
.t-why .t-why__src {
  margin-top: 8px !important;
  font-family: var(--t-font-mono);
  font-size: 10px;
  line-height: 1.5;
  color: var(--t-mute-hi);
}
.t-why a { color: var(--t-stone); text-decoration-color: var(--t-pastis); text-underline-offset: 3px; }
.t-why__door { margin-top: 40px !important; padding-top: 26px; border-top: 1px solid var(--t-pastis); }
.t-why .t-why__door-line { font-size: 19px; line-height: 1.45; color: var(--t-stone); margin-bottom: 18px !important; max-width: 40ch; }
.t-why__door .t-btn { text-decoration: none; }
.t-app .t-why p.t-why__lead { font-size: 18px; line-height: 1.5; color: var(--t-stone); }

/* ── The standard (standard.php, 8 Oct 2026): the nine items ──
   Number and label, then the buyer's question, the disclosure and the
   guidance line (t-why__src with its t-tip__k key, as on why.php). */
.t-items { margin: 0; border-top: 1px solid var(--t-pastis); }
.t-items dt { padding-top: 18px; font-weight: var(--t-w-bold); font-size: 16px; line-height: 1.35; color: var(--t-stone); }
.t-items__n { display: inline-block; min-width: 30px; font-family: var(--t-font-mono); font-weight: var(--t-w-regular); font-size: 11px; letter-spacing: 0.06em; color: var(--t-pastis); }
.t-items dd { margin: 6px 0 0; padding: 0 0 18px 30px; border-bottom: 1px solid var(--t-pastis-18); }
.t-items dd p { font-size: 15px; line-height: 1.55; }
.t-items .t-items__q { color: var(--t-mint); }
/* The standards a level is read against, under each level heading. */
.t-why .t-level__std { margin-top: 10px !important; margin-bottom: 14px !important; font-family: var(--t-font-mono); font-size: 12px; line-height: 1.55; letter-spacing: 0.02em; color: var(--t-stone); }
@media (max-width: 760px) {
  .t-items dd { padding-left: 0; }
}

.t-placeholder { border: 1px dashed var(--t-pastis-40); padding: 16px 18px; }
.t-placeholder .t-label { margin-bottom: 6px; }
.t-placeholder p:last-child { font-size: 14px; color: var(--t-mute-hi); }

/* ── The form ───────────────────────────────────────────────── */

.t-form { display: grid; grid-template-columns: 1fr 1fr; gap: 22px 28px; max-width: 760px; }
.t-field { display: flex; flex-direction: column; gap: 7px; min-width: 0; }
.t-field--full { grid-column: 1 / -1; }
.t-field label, .t-field legend {
  font-family: var(--t-font-mono);
  font-size: 10px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--t-mute-hi);
}
.t-field .t-req { color: var(--t-pastis); }
.t-input, .t-select, .t-textarea {
  width: 100%;
  font-family: var(--t-font-primary);
  font-weight: var(--t-w-regular);
  font-size: 16px;
  color: var(--t-stone);
  background: transparent;
  border: 0;
  border-bottom: 1px solid var(--t-pastis-40);
  border-radius: 0;
  padding: 8px 0 9px;
  transition: border-color 120ms ease-out;
}
.t-input:hover, .t-select:hover, .t-textarea:hover { border-bottom-color: var(--t-pastis); }
.t-input:focus, .t-select:focus, .t-textarea:focus { outline: none; border-bottom-color: var(--t-mint); box-shadow: 0 1px 0 0 var(--t-mint); }
.t-select { appearance: none; background-image: linear-gradient(45deg, transparent 50%, var(--t-pastis) 50%), linear-gradient(135deg, var(--t-pastis) 50%, transparent 50%); background-position: calc(100% - 10px) 55%, calc(100% - 5px) 55%; background-size: 5px 5px; background-repeat: no-repeat; padding-right: 22px; }
.t-select option { background: var(--t-pine); color: var(--t-stone); }
.t-textarea { min-height: 96px; resize: vertical; border: 1px solid var(--t-pastis-40); padding: 10px 12px; }
.t-field [aria-invalid="true"] { border-bottom-color: var(--t-pastis); }
.t-field__err { font-size: 12.5px; color: var(--t-pastis); }
.t-field .t-check { font-family: var(--t-font-primary); font-size: 14px; letter-spacing: 0; text-transform: none; color: var(--t-stone-80); }
.t-doc__aside-link { margin-top: 14px !important; }
.t-doc__aside a { color: var(--t-stone); }
.t-check { display: grid; grid-template-columns: 18px 1fr; gap: 12px; align-items: start; font-size: 14px; line-height: 1.5; color: var(--t-stone-80); }
.t-check input { appearance: none; width: 16px; height: 16px; margin: 3px 0 0; border: 1px solid var(--t-pastis); background: transparent; cursor: pointer; }
.t-check input:checked { background: var(--t-mint); border-color: var(--t-mint); box-shadow: inset 0 0 0 3px var(--t-pine); }
.t-check a { color: var(--t-stone); }
.t-hp { position: absolute !important; left: -10000px !important; width: 1px; height: 1px; overflow: hidden; }
.t-form__actions { grid-column: 1 / -1; display: flex; align-items: center; gap: 24px; margin-top: 6px; }
.t-form__actions .t-btn { height: 44px; min-width: 220px; }

.t-notice { border-top: 1px solid var(--t-pastis); border-bottom: 1px solid var(--t-pastis-18); padding: 16px 0; margin-bottom: 28px !important; font-size: 16px; line-height: 1.5; max-width: 760px; }
.t-notice--ok { color: var(--t-stone); }
.t-notice--err { color: var(--t-stone); }
.t-notice .t-label { display: block; margin-bottom: 6px; }

/* ── Members' landing ───────────────────────────────────────── */

.t-modules { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--t-pastis); }
.t-modules li { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 16px; padding: 14px 0; border-bottom: 1px solid var(--t-pastis-18); align-items: baseline; }
.t-modules .t-locked__title { font-size: 16px; }
.t-account { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 28px !important; }


/* =================================================================
   8b. THE INTERIOR — the board, a holding, a process room, the
       price register, the full market data
       (brief of 30 September 2026; Diane, same day)

   The board is the harbour-master's board itself: one ground, pastis
   hairlines, no box and no card fill. A listing is a region between
   two hairlines, with one carved figure — the size of the interest.
   Titles are Jost 700 in capitals; display sizes take
   --t-track-display, small titles 0.12em, labels the lapidary 0.20em.
   ================================================================= */

/* ── The demonstration switch's bar (devel, administrators) ──── */

.t-view {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 4px 20px;
  padding: 5px var(--t-gutter) 4px;
  background: var(--t-pastis);
  color: var(--t-pine);
  font-family: var(--t-font-mono);
  font-size: 10px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  position: relative;
  z-index: 18;
}
.t-view__now { font-weight: var(--t-w-bold); }
.t-view__set { display: flex; flex-wrap: wrap; gap: 2px 14px; }
.t-view__opt { color: var(--t-pine); text-decoration: none; opacity: 0.72; }
.t-view__opt:hover { color: var(--t-pine); opacity: 1; text-decoration: underline; text-underline-offset: 2px; }
.t-view__opt.is-on { opacity: 1; text-decoration: underline; text-underline-offset: 2px; }
.t-app .t-view :focus-visible { outline-color: var(--t-pine); }

/* ── The Illustrative stamp ─────────────────────────────────────
   Solid pastis, pine text: the harbour-master's stamp, and the same
   language as the review ribbon. Unmissable at 9.5 px, and it never
   competes with the mint door. */

.t-illus {
  display: inline-block;
  padding: 1px 6px 0;
  background: var(--t-pastis);
  color: var(--t-pine);
  font-family: var(--t-font-mono);
  font-size: 9.5px;
  font-weight: var(--t-w-bold);
  letter-spacing: 0.1em;
  line-height: 1.7;
  text-transform: uppercase;
  white-space: nowrap;
  vertical-align: 1px;
}

.t-illus-note {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 6px 12px;
  padding: 10px 0 11px;
  border-top: 1px solid var(--t-pastis);
  border-bottom: 1px solid var(--t-pastis-18);
  margin: 18px 0 !important;
}
.t-illus-note__text { font-size: 13.5px; line-height: 1.5; color: var(--t-stone-80); max-width: 90ch; }
/* Never two parallel rules 15 px apart: the head already carries one. */
.t-wide__head + .t-illus-note, .t-switch + .t-illus-note,
.t-wide__head + .t-real-note { border-top: 0; margin-top: 0 !important; padding-top: 14px; }
.t-illus-note + .t-room__rule { border-top: 0; padding-top: 4px; }

/* Real figures only: the counterpart line on market-data.php */
.t-real-note {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 6px 12px;
  padding: 10px 0 11px;
  border-top: 1px solid var(--t-mint);
  border-bottom: 1px solid var(--t-pastis-18);
  margin: 18px 0 26px !important;
}
.t-real-note__k {
  font-family: var(--t-font-mono);
  font-size: 9.5px;
  font-weight: var(--t-w-bold);
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--t-mint);
  border: 1px solid var(--t-mint);
  padding: 1px 6px 0;
  line-height: 1.7;
  white-space: nowrap;
}
.t-real-note__t { font-size: 13.5px; line-height: 1.5; color: var(--t-stone-80); max-width: 90ch; }

/* ── The wide interior frame ────────────────────────────────────
   The board and the registers are instruments, not documents: they
   take the full gutter-to-gutter width, unlike the 76-character
   document pages. */

.t-wide { padding: 32px var(--t-gutter) 64px; }
.t-wide__head { padding-bottom: 22px; margin-bottom: 0; border-bottom: 1px solid var(--t-pastis); }
.t-app .t-wide__title {
  margin: 12px 0 0;
  font-family: var(--t-font-primary);
  font-weight: var(--t-w-bold);
  font-size: clamp(28px, 4.2vw, 54px);
  letter-spacing: var(--t-track-display);
  text-transform: uppercase;
  line-height: 1.0;
  color: var(--t-stone);
  text-wrap: pretty;
}
.t-wide__lede { margin-top: 16px !important; font-size: 17px; line-height: 1.5; color: var(--t-stone-80); max-width: 62ch; }
.t-wide__foot { margin-top: 40px; padding-top: 22px; border-top: 1px solid var(--t-pastis); }
.t-wide__foot-links { display: flex; flex-wrap: wrap; gap: 10px 28px; margin-top: 12px !important; }

/* ── The gate: a tier that may not open the page ─────────────── */

.t-gate { padding: 40px 0 24px; max-width: 54ch; }
.t-gate__icon { width: 20px; height: 24px; color: var(--t-pastis); display: block; margin-bottom: 18px; }
.t-gate__line { font-family: var(--t-font-primary); font-weight: var(--t-w-bold); font-size: clamp(20px, 2.4vw, 28px); letter-spacing: var(--t-track-display); text-transform: uppercase; line-height: 1.1; color: var(--t-stone); }
.t-gate__sub { margin-top: 16px !important; font-size: 16px; line-height: 1.55; color: var(--t-stone-80); }
.t-gate__sub a { color: var(--t-stone); text-decoration-color: var(--t-pastis); }
.t-gate__doors { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 24px !important; }
.t-gate__doors .t-btn { height: 44px; min-width: 190px; }

/* ── The lock pattern, inside a page ────────────────────────── */

.t-lockbox { border-top: 1px solid var(--t-pastis-40); border-bottom: 1px solid var(--t-pastis-18); padding: 16px 0 18px; background: var(--t-stone-06); }
.t-lockbox__head { display: flex; align-items: center; gap: 8px; }
.t-lockbox__icon { width: 10px; height: 12px; color: var(--t-pastis); flex: none; }
.t-lockbox__line { margin-top: 10px !important; font-size: 15px; line-height: 1.55; color: var(--t-stone-80); max-width: 62ch; }
.t-lockbox__who { margin-top: 12px !important; font-family: var(--t-font-mono); font-size: 10.5px; letter-spacing: 0.04em; color: var(--t-mute-hi); display: flex; flex-wrap: wrap; gap: 6px 16px; align-items: baseline; }

/* ── The board switch, and the filters ──────────────────────── */

.t-switch { display: flex; flex-wrap: wrap; border-bottom: 1px solid var(--t-pastis-18); }
.t-switch__i {
  font-family: var(--t-font-primary);
  font-weight: var(--t-w-medium);
  font-size: 11px;
  letter-spacing: var(--t-track-wider);
  text-transform: uppercase;
  color: var(--t-mute-hi);
  text-decoration: none;
  padding: 14px 0 12px;
  margin-right: 32px;
  border-bottom: 2px solid transparent;
  margin-bottom: -1px;
  transition: color 120ms ease-out, border-color 120ms ease-out;
}
.t-switch__i:hover { color: var(--t-stone); }
.t-switch__i.is-on { color: var(--t-stone); border-bottom-color: var(--t-pastis); }

.t-board__caution {
  padding: 14px 0 16px;
  border-bottom: 1px solid var(--t-pastis-18);
  font-size: 14px;
  line-height: 1.55;
  color: var(--t-stone-80);
  max-width: 96ch;
}
.t-board__caution-line {
  display: block;
  font-family: var(--t-font-mono);
  font-size: 11px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--t-pastis);
  margin-bottom: 7px;
}
.t-board__caution a { color: var(--t-stone); text-decoration-color: var(--t-pastis); text-underline-offset: 3px; white-space: nowrap; }

.t-filters { padding: 16px 0 20px; border-bottom: 1px solid var(--t-pastis); }
.t-filters__row { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)) auto; gap: 16px 28px; align-items: end; }
.t-filter { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.t-filter label {
  font-family: var(--t-font-mono);
  font-size: 10px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--t-mute-hi);
}
.t-filter--go { flex-direction: row; align-items: center; gap: 16px; }
.t-filter--go .t-btn { height: 36px; }
.t-filters__clear { font-family: var(--t-font-mono); font-size: 10px; letter-spacing: 0.08em; text-transform: uppercase; color: var(--t-mute-hi); }
.t-filters__clear:hover { color: var(--t-stone); }

/* ── The listing cards: regions, not boxes ──────────────────── */

.t-cards {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.t-card {
  padding: 20px 28px 22px;
  border-bottom: 1px solid var(--t-pastis-18);
  border-left: 1px solid var(--t-pastis-18);
  min-width: 0;
  display: flex;
  flex-direction: column;
}
.t-card:nth-child(3n+1) { padding-left: 0; border-left: 0; }
.t-card__top { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 6px 12px; }
.t-app .t-card__name {
  margin: 12px 0 0;
  font-family: var(--t-font-primary);
  font-weight: var(--t-w-bold);
  font-size: 19px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  line-height: 1.12;
  color: var(--t-stone);
}
.t-app .t-card__name a { color: inherit; text-decoration: none; }
.t-app .t-card__name a:hover { color: var(--t-mint); }

.t-card__size { margin-top: 14px !important; white-space: nowrap; }
.t-card__fig {
  font-family: var(--t-font-primary);
  font-weight: var(--t-w-bold);
  font-size: 24px;
  line-height: 1;
  letter-spacing: 0.01em;
  color: var(--t-pastis);
  font-feature-settings: "tnum" 1, "lnum" 1;
}
.t-card__usd { display: block; margin-top: 5px; font-family: var(--t-font-mono); font-size: 11px; letter-spacing: 0.04em; color: var(--t-mint); }

.t-card__facts { margin: 16px 0 0; display: grid; grid-template-columns: minmax(0, 1fr); }
.t-card__facts dt {
  font-family: var(--t-font-mono);
  font-size: 9.5px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--t-mute-hi);
  padding-top: 8px;
  border-top: 1px solid var(--t-pastis-18);
}
.t-card__facts dt:first-child { padding-top: 0; border-top: 0; }
.t-card__facts dd { margin: 3px 0 8px; font-size: 13px; line-height: 1.4; color: var(--t-stone-80); }

.t-card__submitted {
  margin-top: 6px !important;
  font-family: var(--t-font-mono);
  font-size: 10px;
  letter-spacing: 0.04em;
  line-height: 1.5;
  color: var(--t-pastis);
}
.t-card__go { margin-top: auto !important; padding-top: 16px; }

.t-empty { padding: 44px 0; border-bottom: 1px solid var(--t-pastis-18); max-width: 62ch; }
.t-empty__line { font-size: 17px; line-height: 1.5; color: var(--t-stone); margin-bottom: 14px !important; }

/* ── One holding, and one process room ──────────────────────── */

.t-holding__head { padding-bottom: 26px; }
.t-holding__eyebrow { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 16px; }
.t-holding__board { font-family: var(--t-font-mono); font-size: 10px; letter-spacing: 0.08em; text-transform: uppercase; color: var(--t-mute-hi); }
.t-app .t-holding__title {
  margin: 14px 0 0;
  font-family: var(--t-font-primary);
  font-weight: var(--t-w-bold);
  /* The holding page opens with its title large (brief §6, Size). */
  font-size: clamp(30px, 5.4vw, 66px);
  letter-spacing: var(--t-track-display);
  text-transform: uppercase;
  line-height: 0.98;
  color: var(--t-stone);
  text-wrap: pretty;
}
.t-holding__size { margin-top: 22px !important; display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 14px; }
.t-holding__fig {
  font-family: var(--t-font-primary);
  font-weight: var(--t-w-bold);
  font-size: 30px;
  line-height: 1;
  letter-spacing: 0.01em;
  color: var(--t-pastis);
  font-feature-settings: "tnum" 1, "lnum" 1;
}
.t-holding__usd { font-family: var(--t-font-mono); font-size: 13px; letter-spacing: 0.04em; color: var(--t-mint); }
.t-holding__what { font-size: 13px; color: var(--t-mute-hi); }
.t-holding__submitted {
  margin-top: 18px !important;
  font-family: var(--t-font-mono);
  font-size: 11px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--t-pastis);
}
.t-holding__submitted a { color: var(--t-stone); text-transform: none; letter-spacing: 0.02em; margin-left: 10px; text-decoration-color: var(--t-pastis); }

.t-holding__grid, .t-room__grid, .t-prices__grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 340px;
  gap: 0 48px;
  align-items: start;
}
.t-hside { grid-column: 2; grid-row: 1 / span 40; padding-left: 40px; border-left: 1px solid var(--t-pastis-18); align-self: stretch; }

.t-hsec { grid-column: 1; min-width: 0; padding: 26px 0 8px; border-top: 1px solid var(--t-pastis-18); }
.t-hsec:first-of-type { border-top: 0; }
.t-app .t-hsec__h {
  font-family: var(--t-font-primary);
  font-weight: var(--t-w-bold);
  font-size: 12.5px;
  letter-spacing: var(--t-track-lapidary);
  text-transform: uppercase;
  color: var(--t-pastis);
  line-height: 1.4;
  margin: 0 0 14px;
}
.t-hsec__lede { font-size: 15.5px; line-height: 1.55; color: var(--t-stone); max-width: 72ch; margin-bottom: 16px !important; }
.t-hsec > p { font-size: 15px; line-height: 1.6; color: var(--t-stone-80); max-width: 76ch; }
.t-hsec > p + p { margin-top: 12px !important; }
.t-app .t-hsec__sub {
  margin: 26px 0 10px;
  font-family: var(--t-font-primary);
  font-weight: var(--t-w-bold);
  font-size: 12.5px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--t-stone);
  line-height: 1.3;
}
.t-hsec .t-illus-note { margin: 14px 0 16px !important; }
.t-hsec .t-notice { margin-top: 16px; }
.t-hsec .t-meta { margin-top: 14px !important; }
.t-hsec .t-meta a { color: var(--t-stone); }

/* The fact ledger */
.t-facts { margin: 0; display: grid; grid-template-columns: 250px minmax(0, 1fr); border-top: 1px solid var(--t-pastis); }
.t-facts dt {
  font-family: var(--t-font-mono);
  font-size: 10px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--t-mute-hi);
  padding: 9px 20px 9px 0;
  border-bottom: 1px solid var(--t-pastis-18);
}
.t-facts dd { margin: 0; padding: 8px 0 9px; font-size: 14px; line-height: 1.45; color: var(--t-stone); border-bottom: 1px solid var(--t-pastis-18); }
.t-facts--prov dt { color: var(--t-pastis); }
.t-facts--prov dd { color: var(--t-stone-80); }

/* The disclosure status of one criterion */
.t-status {
  font-family: var(--t-font-mono);
  font-size: 10px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  white-space: nowrap;
}
.t-status::before { content: ""; display: inline-block; width: 7px; height: 7px; margin-right: 8px; vertical-align: 1px; }
.t-status--disclosed { color: var(--t-mint); }
.t-status--disclosed::before { background: var(--t-mint); }
.t-status--partly { color: var(--t-pastis); }
.t-status--partly::before { background: var(--t-pastis); }
.t-status--not { color: var(--t-mute-hi); }
.t-status--not::before { border: 1px solid var(--t-mute-hi); }

.t-table--report th[scope="row"] { font-size: 14px; color: var(--t-stone); width: 62%; }
.t-table--report { border-top: 1px solid var(--t-pastis); }

/* The data-room request */
.t-roomreq { margin-top: 18px; display: flex; flex-direction: column; align-items: flex-start; gap: 20px; max-width: 72ch; }
.t-roomreq .t-btn { height: 44px; min-width: 240px; }

/* The stages, and the timetable */
.t-stages, .t-time { list-style: none; margin: 12px 0 0; padding: 0; }
.t-stages__i, .t-time__i {
  display: grid;
  grid-template-columns: 10px minmax(0, 1fr) auto;
  gap: 4px 12px;
  align-items: baseline;
  padding: 10px 0 11px;
  border-bottom: 1px solid var(--t-pastis-18);
}
.t-stages__i:first-child, .t-time__i:first-child { border-top: 1px solid var(--t-pastis); }
.t-stages__dot, .t-time__dot { width: 7px; height: 7px; border: 1px solid var(--t-mute-hi); align-self: center; }
.t-stages__i.is-open .t-stages__dot, .t-time__i--done .t-time__dot { background: var(--t-mint); border-color: var(--t-mint); }
.t-time__i--open .t-time__dot { background: var(--t-pastis); border-color: var(--t-pastis); }
.t-stages__name, .t-time__stage { font-family: var(--t-font-primary); font-weight: var(--t-w-medium); font-size: 12.5px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--t-stone); line-height: 1.3; }
.t-stages__state, .t-time__state { font-family: var(--t-font-mono); font-size: 9.5px; letter-spacing: 0.08em; text-transform: uppercase; color: var(--t-mute-hi); white-space: nowrap; }
.t-stages__i.is-open .t-stages__state { color: var(--t-mint); }
.t-time__date { grid-column: 2; font-family: var(--t-font-mono); font-size: 10.5px; letter-spacing: 0.04em; color: var(--t-mute-hi); }
.t-stages__note { margin-top: 10px !important; }

.t-hside__lede { font-family: var(--t-font-primary); font-size: 13.5px; line-height: 1.55; color: var(--t-stone-80); margin: 12px 0 16px !important; }
.t-hside__rule {
  margin-top: 28px !important;
  padding-top: 18px;
  border-top: 1px solid var(--t-pastis);
  font-size: 14px;
  line-height: 1.55;
  color: var(--t-stone);
}
.t-hside__links { display: flex; flex-direction: column; gap: 10px; margin-top: 26px !important; }
.t-hside .t-illus-note { margin: 12px 0 14px !important; }
.t-hside .t-illus-note__text { font-size: 12px; }

.t-room__rule {
  padding: 16px 0 18px;
  border-top: 1px solid var(--t-pastis);
  border-bottom: 1px solid var(--t-pastis-18);
  margin-bottom: 8px !important;
  font-size: 16px;
  line-height: 1.5;
  color: var(--t-stone);
  max-width: 80ch;
}

/* The documents */
.t-docs { list-style: none; margin: 0 0 18px; padding: 0; border-top: 1px solid var(--t-pastis); }
.t-docs__i {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 96px 72px auto;
  gap: 4px 16px;
  align-items: baseline;
  padding: 9px 0 10px;
  border-bottom: 1px solid var(--t-pastis-18);
}
.t-docs__t { font-size: 14px; line-height: 1.4; color: var(--t-stone); text-decoration-color: var(--t-pastis-40); text-underline-offset: 3px; }
.t-docs__t:hover { color: var(--t-mint); }
.t-docs__d, .t-docs__s { font-family: var(--t-font-mono); font-size: 10.5px; letter-spacing: 0.04em; color: var(--t-mute-hi); white-space: nowrap; }

.t-docview { padding: 40px 0 24px; max-width: 62ch; }
.t-docview__top { display: flex; flex-wrap: wrap; align-items: baseline; gap: 8px 16px; }
.t-app .t-docview__title { margin: 14px 0 0; font-weight: var(--t-w-bold); font-size: clamp(22px, 2.8vw, 34px); letter-spacing: var(--t-track-display); text-transform: uppercase; line-height: 1.05; color: var(--t-stone); }
.t-docview__meta { margin-top: 12px !important; font-family: var(--t-font-mono); font-size: 10.5px; letter-spacing: 0.04em; color: var(--t-mute-hi); }
.t-docview__line { margin-top: 22px !important; padding-top: 18px; border-top: 1px solid var(--t-pastis); font-size: 16px; line-height: 1.55; color: var(--t-stone-80); margin-bottom: 20px !important; }

/* Questions and answers */
.t-qa { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--t-pastis); }
.t-qa__i { padding: 14px 0 16px; border-bottom: 1px solid var(--t-pastis-18); }
.t-qa__meta { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 14px; }
.t-qa__meta + .t-qa__meta { margin-top: 14px !important; }
.t-qa__who {
  font-family: var(--t-font-mono);
  font-size: 9.5px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--t-pastis);
  border: 1px solid var(--t-pastis-40);
  padding: 1px 6px 0;
  line-height: 1.7;
}
.t-qa__who--holder { color: var(--t-mint); border-color: var(--t-mint); }
.t-qa__when { font-family: var(--t-font-mono); font-size: 10px; letter-spacing: 0.04em; color: var(--t-mute-hi); }
.t-qa__q { margin-top: 7px !important; font-size: 15px; line-height: 1.55; color: var(--t-stone); max-width: 76ch; }
.t-qa__a { margin-top: 7px !important; font-size: 15px; line-height: 1.55; color: var(--t-stone-80); max-width: 76ch; }
.t-qa__wait { margin-top: 10px !important; font-family: var(--t-font-mono); font-size: 10.5px; letter-spacing: 0.04em; color: var(--t-mute-hi); }
.t-ask { margin-top: 22px; display: flex; flex-direction: column; align-items: flex-start; gap: 16px; max-width: 72ch; }
.t-ask .t-field { width: 100%; }

/* ── The price register ─────────────────────────────────────── */

.t-reading-seg { padding: 4px 0 0; margin-bottom: 8px; }
.t-segs { list-style: none; margin: 14px 0 14px; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border-top: 1px solid var(--t-pastis); }
.t-segs__i { padding: 14px 24px 16px; border-left: 1px solid var(--t-pastis-18); min-width: 0; }
.t-segs__i:first-child { padding-left: 0; border-left: 0; }
.t-segs__name { font-family: var(--t-font-primary); font-weight: var(--t-w-medium); font-size: 12.5px; line-height: 1.3; color: var(--t-stone-80); }
.t-segs__val { margin-top: 8px !important; }
.t-segs__fig {
  font-family: var(--t-font-primary);
  font-weight: var(--t-w-bold);
  font-size: 30px;
  line-height: 1;
  letter-spacing: 0.01em;
  color: var(--t-pastis);
  font-feature-settings: "tnum" 1, "lnum" 1;
  white-space: nowrap;
}
/* The basis is stated once, above the segments, never on each tile. */
.t-segs__basis { margin-top: 12px !important; font-family: var(--t-font-mono); font-size: 10px; line-height: 1.5; letter-spacing: 0.06em; text-transform: uppercase; color: var(--t-mute-hi); }
.t-segs { margin-top: 10px; }

.t-prov {
  font-family: var(--t-font-mono);
  font-size: 9.5px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--t-pastis);
  white-space: nowrap;
}
.t-table--prices { border-top: 1px solid var(--t-pastis); font-size: 12.5px; }
.t-table--prices th[scope="row"] { font-family: var(--t-font-mono); font-size: 11px; white-space: nowrap; color: var(--t-stone-80); }
.t-table--prices .t-num { text-align: right; padding-right: 26px; }
.t-price { font-family: var(--t-font-mono); font-weight: var(--t-w-bold); color: var(--t-stone) !important; white-space: nowrap; }
.t-table--prices tbody tr:hover th, .t-table--prices tbody tr:hover td { background: var(--t-stone-06); }

.t-ctx { margin: 0; border-top: 1px solid var(--t-pastis); }
.t-ctx dt { font-size: 13px; line-height: 1.4; color: var(--t-stone); padding-top: 11px; }
.t-ctx dd { margin: 4px 0 0; padding-bottom: 11px; border-bottom: 1px solid var(--t-pastis-18); }
.t-ctx__v { display: block; font-family: var(--t-font-mono); font-size: 12px; letter-spacing: 0.04em; color: var(--t-pastis); }
.t-ctx__s { display: block; margin-top: 3px; font-family: var(--t-font-mono); font-size: 10px; line-height: 1.5; color: var(--t-mute-hi); }

/* ── Full market data ───────────────────────────────────────── */

.t-dsec { padding: 30px 0 4px; border-top: 1px solid var(--t-pastis-18); }
.t-dsec:first-of-type { border-top: 0; }
.t-app .t-dsec__h {
  font-family: var(--t-font-primary);
  font-weight: var(--t-w-bold);
  font-size: clamp(18px, 2vw, 26px);
  letter-spacing: var(--t-track-display);
  text-transform: uppercase;
  line-height: 1.1;
  color: var(--t-stone);
  margin: 0 0 14px;
}
.t-dsec__lede { font-size: 15.5px; line-height: 1.55; color: var(--t-stone-80); max-width: 80ch; margin-bottom: 20px !important; }
.t-dsec__p { font-size: 15px; line-height: 1.6; color: var(--t-stone-80); max-width: 84ch; }
.t-dsec__p + .t-dsec__p { margin-top: 12px !important; }
.t-dsec .t-src, .t-dsec .t-meta { margin-top: 14px !important; }

.t-dfigs { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); border-top: 1px solid var(--t-pastis); margin-bottom: 18px; }
.t-dfig { padding: 16px 28px 18px; border-left: 1px solid var(--t-pastis-18); min-width: 0; }
.t-dfig:first-child { padding-left: 0; border-left: 0; }
.t-dfig__v { white-space: nowrap; }
.t-dfig__n {
  font-family: var(--t-font-primary);
  font-weight: var(--t-w-bold);
  font-size: 38px;
  line-height: 1;
  letter-spacing: 0.01em;
  color: var(--t-pastis);
  font-feature-settings: "tnum" 1, "lnum" 1;
}
.t-dfig__u { font-weight: var(--t-w-medium); font-size: 14px; letter-spacing: 0.12em; color: var(--t-mint); margin-left: 8px; }
.t-dfig__l { margin-top: 10px !important; font-size: 13px; line-height: 1.45; color: var(--t-stone-80); max-width: 34ch; }

/* A ledger is read across, so it keeps a measure: a label at 1920 px
   with its figure 1,700 px away is not white space, it is a gap. */
.t-table--data { border-top: 1px solid var(--t-pastis); max-width: 1120px; }
.t-table--data th[scope="row"] { font-size: 14px; line-height: 1.45; color: var(--t-stone); }
.t-table__sub { display: block; margin-top: 4px; font-size: 12.5px; line-height: 1.45; color: var(--t-mute-hi); }
.t-table__fig { font-family: var(--t-font-mono); font-weight: var(--t-w-bold); font-size: 14px; color: var(--t-pastis) !important; white-space: nowrap; }
.t-table__unit { font-family: var(--t-font-mono); font-weight: var(--t-w-regular); font-size: 10.5px; letter-spacing: 0.06em; color: var(--t-mint); }
.t-table__src { font-family: var(--t-font-mono); font-size: 10px; line-height: 1.5; color: var(--t-mute-hi); width: 30%; }
.t-table .t-num { text-align: right; }

.t-src { font-family: var(--t-font-mono); font-size: 10.5px; line-height: 1.5; color: var(--t-mute-hi); }
.t-chart--data { border-top: 1px solid var(--t-pastis); margin-top: 0; }
.t-chart--data .t-chart__titles { padding-right: 0; padding-top: 0; }
.t-chart--data .t-chart__svg--medium { display: block; max-width: 900px; }
.t-chart--data .t-chart__svg--wide { display: none; }

/* A table that scrolls inside its own container on a phone.
   min-width: 0 keeps the container from carrying the table's
   min-content width up the tree, which would widen the page instead of
   scrolling the table (measured at 390 px, Diane, 30 September 2026). */
.t-scroll { max-width: 100%; min-width: 0; overflow-x: auto; }

/* ── The members' landing, with live links ──────────────────── */

.t-members__illus { font-size: 14px; line-height: 1.55; color: var(--t-stone-80); padding-bottom: 18px; }
.t-modules .t-locked__title a { color: var(--t-stone); text-decoration-color: var(--t-pastis); text-underline-offset: 4px; }
.t-modules .t-locked__title a:hover { color: var(--t-mint); }
.t-modules li.is-locked .t-locked__title { color: var(--t-mute-hi); }
.t-modules__lock { width: 10px; height: 12px; margin-right: 9px; vertical-align: -1px; color: var(--t-pastis); }
.t-tier--members { border-color: var(--t-pastis-40); color: var(--t-pastis); }


/* =================================================================
   9. FOOTER
   ================================================================= */

.t-foot {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 12px 32px;
  padding: 22px var(--t-gutter) 28px;
  border-top: 1px solid var(--t-pastis-40);
  margin-top: auto;
}
.t-foot__fence { font-size: 14px; color: var(--t-stone-80); }
.t-foot__fence a { color: var(--t-stone); }
.t-foot__legal { display: flex; flex-wrap: wrap; gap: 4px 10px; font-family: var(--t-font-mono); font-size: 10.5px; color: var(--t-mute-hi); letter-spacing: 0.04em; }
.t-foot__legal a { color: var(--t-mute-hi); text-decoration-color: var(--t-pastis-40); }
.t-foot__legal a:hover { color: var(--t-stone); }
.t-foot__legal [aria-hidden] { color: var(--t-pastis); }

/* Review ribbon — devel, localhost and the HTML twins only */
.t-review {
  position: fixed;
  left: 0;
  bottom: 0;
  z-index: 50;
  margin: 0;
  padding: 4px 10px 3px;
  background: var(--t-pastis);
  color: var(--t-pine);
  font-family: var(--t-font-mono);
  font-size: 9.5px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  pointer-events: none;
}


/* =================================================================
   10. RESPONSIVE
   ================================================================= */

/* ── The interior, 10b ──────────────────────────────────────────
   The board goes from three columns to two to one; the holding, the
   room and the register drop their side column beneath the main one.
   Tables scroll inside .t-scroll on a phone. No horizontal scroll at
   any width from 320 to 1920 px. */

@media (max-width: 1320px) {
  .t-holding__grid, .t-room__grid, .t-prices__grid { grid-template-columns: minmax(0, 1fr) 300px; gap: 0 36px; }
  .t-hside { padding-left: 30px; }
  .t-facts { grid-template-columns: 210px minmax(0, 1fr); }
}

@media (max-width: 1140px) {
  .t-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .t-card:nth-child(3n+1) { padding-left: 28px; border-left: 1px solid var(--t-pastis-18); }
  .t-card:nth-child(2n+1) { padding-left: 0; border-left: 0; }
  .t-filters__row { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .t-filter--go { grid-column: 1 / -1; }
  .t-segs { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .t-segs__i { border-top: 1px solid var(--t-pastis-18); }
  .t-segs__i:nth-child(2n+1) { padding-left: 0; border-left: 0; }
  .t-segs__i:nth-child(-n+2) { border-top: 0; }
}

@media (max-width: 900px) {
  .t-wide { padding-top: 24px; }
  .t-holding__grid, .t-room__grid, .t-prices__grid { grid-template-columns: minmax(0, 1fr); gap: 0; }
  .t-hside {
    grid-column: 1;
    grid-row: auto;
    padding-left: 0;
    padding-top: 26px;
    margin-top: 26px;
    border-left: 0;
    border-top: 1px solid var(--t-pastis-40);
  }
  .t-hsec { max-width: none; }
  .t-dfig { padding-left: 0; padding-right: 20px; border-left: 0; border-top: 1px solid var(--t-pastis-18); }
  .t-dfigs .t-dfig:first-child { border-top: 0; }
  .t-table__src { width: auto; }
}

@media (max-width: 760px) {
  .t-wide { padding-bottom: 44px; }
  .t-cards { grid-template-columns: minmax(0, 1fr); }
  .t-card, .t-card:nth-child(3n+1), .t-card:nth-child(2n+1) { padding: 18px 0 20px; border-left: 0; }
  .t-card__facts dd { font-size: 12.5px; }
  /* Two by two, so the board itself is not pushed off a phone screen
     by four stacked filters (Diane, 30 September 2026). */
  .t-filters { padding: 12px 0 16px; }
  .t-filters__row { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px 18px; }
  .t-filter label { font-size: 9.5px; }
  .t-filter .t-select { font-size: 14px; padding: 6px 0 7px; }
  .t-filter--go { grid-column: 1 / -1; justify-content: space-between; }
  .t-filter--go .t-btn { flex: 1; }
  .t-segs { grid-template-columns: minmax(0, 1fr); }
  .t-segs__i { padding: 12px 0 14px; border-left: 0; border-top: 1px solid var(--t-pastis-18); }
  .t-segs__i:first-child { border-top: 0; }
  .t-segs__fig { font-size: 26px; }
  .t-facts { grid-template-columns: minmax(0, 1fr); }
  .t-facts dt { padding-bottom: 0; border-bottom: 0; padding-top: 11px; }
  .t-facts dd { padding-top: 3px; }
  .t-docs__i { grid-template-columns: minmax(0, 1fr) auto; }
  .t-docs__d { grid-column: 1; }
  .t-docs__s { grid-column: 2; text-align: right; }
  .t-stages__i, .t-time__i { grid-template-columns: 10px minmax(0, 1fr); }
  .t-stages__state, .t-time__state { grid-column: 2; }
  .t-dfig__n { font-size: 30px; }
  .t-view { padding: 5px var(--t-gutter) 4px; font-size: 9px; letter-spacing: 0.05em; }
  .t-illus-note, .t-real-note { margin: 14px 0 !important; }
  .t-illus-note__text, .t-real-note__t { font-size: 12.5px; }
  .t-table--prices, .t-table--data, .t-table--report { font-size: 12px; }
  .t-table--prices th, .t-table--prices td, .t-table--data th, .t-table--data td { padding-right: 14px; white-space: nowrap; }
  .t-table--data th[scope="row"], .t-table__sub, .t-table__src { white-space: normal; }
  .t-scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; }
  .t-gate__doors .t-btn { width: 100%; }
  .t-roomreq .t-btn, .t-ask .t-btn { width: 100%; min-width: 0; }
}

/* Laptop widths: narrower side column, tighter tabs */
@media (max-width: 1320px) {
  .t-start, .t-below { grid-template-columns: minmax(0, 1fr) 340px; }
  .t-bar { gap: 28px; }
  .t-tabs ul { gap: 20px; }
  .t-tabs li:nth-child(4) { margin-left: 6px; padding-left: 20px; }
  .t-tile__value { font-size: 30px; }
  .t-chart__titles { padding-right: 0; padding-top: 34px; }
  .t-chart__head { margin-bottom: -26px; }
}

/* Chart drawing for laptop and tablet widths */
@media (max-width: 1249px) {
  .t-chart__svg--wide { display: none; }
  .t-chart__svg--medium { display: block; }
  .t-proof { grid-template-columns: minmax(0, 1fr); }
  .t-claim { padding: 16px 0 14px; border-bottom: 1px solid var(--t-pastis-18); }
  .t-proof .t-chart { padding: 12px 0 0; border-left: 0; }
}

/* Tablet: the locked tabs go to the menu */
@media (max-width: 1120px) {
  .t-tabs li:nth-child(n+4) { display: none; }
  .t-bar__menu { display: inline-flex; align-items: center; justify-content: center; }
}

/* Narrow tablet and phone landscape: every tab goes to the menu */
@media (max-width: 1000px) {
  .t-tabs { display: none; }
  .t-strip__opt { display: none; }
  .t-bar__actions { margin-left: auto; }
}

/* One column */
@media (max-width: 900px) {
  .t-start {
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: none;
    grid-template-areas: "market" "access" "members";
    border-bottom: 0;
  }
  .t-market { padding: 14px 0 18px; border-right: 0; }
  .t-access { padding: 16px 0 22px; margin: 0; align-self: auto; }
  .t-members { padding: 20px 0 8px; border-top: 1px solid var(--t-pastis-40); }
  .t-below { grid-template-columns: minmax(0, 1fr); }
  .t-reading { padding: 24px 0 28px; border-right: 0; border-top: 1px solid var(--t-pastis-40); }
  .t-sources { padding: 24px 0 36px; border-top: 1px solid var(--t-pastis-40); }
  .t-doc { grid-template-columns: minmax(0, 1fr); padding-top: 28px; }
  .t-doc__aside { margin-bottom: 24px; }
}

/* Phones */
@media (max-width: 760px) {
  body.t-app { font-size: 14px; }
  .t-bar { gap: 12px; }
  .t-tabs { display: none; }
  .t-bar__actions { margin-left: auto; }
  .t-bar__hide-s { display: none; }
  .t-bar__show-s { display: inline; }
  .t-hide-s { display: none !important; }
  span.t-show-s { display: inline; }
  p.t-show-s { display: block; }
  .t-review { font-size: 8.5px; letter-spacing: 0.06em; padding: 3px 8px 2px; }
  .t-bar__mark { height: 24px; }
  .t-bar__word { font-size: 12.5px; }
  .t-btn { height: 34px; padding: 0 14px; }

  .t-strip { padding: 6px var(--t-gutter); font-size: 10px; min-height: 0; gap: 12px; }
  .t-strip__market, .t-strip__opt, .t-strip__sep.t-strip__reg { display: none; }
  .t-strip__operator { letter-spacing: 0.06em; }
  .t-strip__key { display: none; }
  .t-strip__items { display: block; white-space: nowrap; min-width: 0; overflow: hidden; text-overflow: ellipsis; }
  .t-access__member { margin-top: 8px !important; }

  .t-start .t-market > .t-panel__head { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
  .t-panel__head { margin-bottom: 8px; }
  .t-panel__head .t-meta { display: none; }
  .t-groups { grid-template-columns: minmax(0, 1fr); grid-template-rows: none; border-top: 0; }
  .t-group {
    grid-row: auto;
    grid-template-rows: none;
    grid-template-columns: 1fr 1fr;
    column-gap: 16px;
    padding: 5px 0 0;
    border-left: 0;
    border-top: 1px solid var(--t-pastis);
  }
  .t-group:first-child { border-top: 0; padding-top: 0; }
  .t-app .t-group__head { grid-column: 1 / -1; margin-bottom: 0; font-size: 11px; }
  .t-group__q { display: none; }
  .t-tile { border-top: 0; padding: 2px 0 7px; }
  .t-tile__label { font-size: 11px; line-height: 1.25; }
  .t-tile__value { font-size: 22px; margin-top: 3px !important; }
  .t-tile__sub { font-size: 10.5px; margin-top: 2px !important; }
  .t-sub__rest, .t-sub__text { display: none; }
  .t-tip { max-width: calc(100vw - 32px); }
  .t-group .t-tile .t-tip { left: 0; right: auto; }
  .t-group .t-tile:nth-of-type(2) .t-tip { left: auto; right: 0; }

  /* The claim leads on a phone: before the tiles, then the chart */
  .t-market { display: flex; flex-direction: column; }
  .t-proof { display: contents; }
  .t-claim { order: -1; padding: 4px 0 14px; margin-bottom: 4px; border-bottom: 1px solid var(--t-pastis); }
  .t-app .t-claim__text { margin-bottom: 10px; }
  .t-index__value { flex-direction: column; align-items: flex-start; }
  .t-index__fig { font-size: 30px; }
  .t-index__base { font-size: 11px; }
  .t-index__spark { width: 110px; height: 34px; }
  .t-index__text { font-size: 13px; }
  .t-claim__links { gap: 6px 20px; }
  .t-proof .t-chart { order: 1; margin-top: 4px; padding-top: 9px; border-top: 1px solid var(--t-pastis); }
  .t-proof .t-chart__titles { padding-top: 0; }

  .t-chart { margin-top: 0; padding-top: 9px; }
  .t-chart__head { justify-content: flex-start; margin-bottom: 8px; }
  .t-chart__switch { display: flex; width: 100%; }
  .t-chart__switch button { flex: 1; padding: 0 4px; font-size: 9px; height: 28px; letter-spacing: 0; white-space: nowrap; }
  .t-chart__titles { padding-right: 0; padding-top: 0; min-height: 0; }
  .t-app .t-chart__title { font-size: 12.5px; }
  .t-chart__unit { font-size: 9.5px; margin-top: 1px !important; }
  .t-chart__legend { margin-top: 4px; font-size: 11px; }
  .t-chart__svg { margin-top: 2px; }
  .t-chart__svg--wide, .t-chart__svg--medium { display: none; }
  .t-chart__svg--narrow { display: block; }
  .t-chart__table { overflow-x: auto; margin-top: 0; }
  .t-chart__table summary { font-size: 9.5px; }
  .t-access { padding-top: 12px; }
  .t-access__line { line-height: 1.3; }
  .t-chart__src, .t-chart__note { font-size: 10px; }

  .t-access__line { font-size: 15.5px; margin-bottom: 12px !important; }
  .t-app .t-reading__title { font-size: 22px; }
  .t-reading__stand { font-size: 15px; }
  .t-table--ledger th { width: 38%; }

  .t-form { grid-template-columns: minmax(0, 1fr); }
  .t-form__actions { flex-direction: column; align-items: stretch; }
  .t-app .t-doc__title { letter-spacing: 0.1em; }
  .t-doc__lede { font-size: 17px; }

  .t-foot { flex-direction: column; }
}

@media (prefers-reduced-motion: reduce) {
  * { transition: none !important; }
}

@media (forced-colors: active) {
  .t-chart__bar--s2 { fill: GrayText; }
  .t-index__line { stroke: CanvasText; }
  .t-index__pt { fill: CanvasText; }
  .t-btn--solid { border: 1px solid ButtonText; }
}
