/* Pyrnova public website: Specimen F, Pyrnova Unified, Instrumental Editorialism (D-084).
   Authority: DESIGN.md ("Public website"), docs/strategy/CORPORATE_POSTURE_AND_BRAND.md and the owner-approved
   Pyrnova Public Website design (2026-10-15). The shell orients, the sheet carries reading and argument, the field
   holds structure. Rules before boxes. Colour carries meaning only; products carry identity, never interface state.
   The three voices are the product's own self-hosted SIL OFL 1.1 variable files. No external font service. */

/* ---------------------------------------------------------------- fonts */
@font-face { font-family: "Archivo"; src: url("/fonts/archivo-vf.1f872ddb5ab9.woff2") format("woff2"); font-weight: 100 900; font-stretch: 62% 125%; font-style: normal; font-display: swap; }
@font-face { font-family: "Source Serif 4"; src: url("/fonts/source-serif-4-vf.4680278385fb.woff2") format("woff2"); font-weight: 200 900; font-style: normal; font-display: swap; }
@font-face { font-family: "Source Serif 4"; src: url("/fonts/source-serif-4-italic-vf.d7f4d3dae7b3.woff2") format("woff2"); font-weight: 200 900; font-style: italic; font-display: swap; }
@font-face { font-family: "Red Hat Mono"; src: url("/fonts/red-hat-mono-vf.41c570b39684.woff2") format("woff2"); font-weight: 300 700; font-style: normal; font-display: swap; }

/* ---------------------------------------------------------------- tokens */
:root {
  /* Carbon: the shell and the field. */
  --carbon-field: #131416;
  --carbon-shell: #1C1D1F;
  --carbon-2: #242629;
  --carbon-rule: #3A3C40;
  --carbon-ctl: #6D6F73;
  --carbon-ink: #EBE9E3;
  --carbon-ink-2: #B3B1AA;
  --carbon-ink-3: #9B9A92;

  /* Mineral: the sheet, the plane and the collar. */
  --mineral-plane: #E4E3DD;
  --mineral-sheet: #EFEEE9;
  --mineral-hi: #F6F5F1;
  --mineral-collar: #E7E6E0;
  --mineral-rule: #CFCDC5;
  --mineral-rule-2: #B3B1A8;
  --mineral-ctl: #7F7D75;
  --mineral-ink: #17181A;
  --mineral-ink-2: #3F4144;
  --mineral-ink-3: #5D5E58;

  /* Semantic signals. Every signal also has a drawn shape (D-089). */
  --cobalt: #2340CF;
  --cobalt-press: #1C35B3;
  --cobalt-d: #93A5FF;
  --emerald: #066D48;
  --emerald-d: #55C99A;
  --vermilion: #B3321A;
  --vermilion-d: #FF8466;
  --ochre: #855605;
  --ochre-d: #E3AE4A;
  --violet: #5638B0;
  --violet-d: #B09EF4;
  --slate: #4B6074;
  --slate-d: #9AABBC;

  /* Product identity (D-086), canonical values from docs/brand/products/. Identity elements only. */
  --scout: #90d460;
  --scout-m: #3c7800;
  --strike: #f77f20;
  --strike-m: #b54900;
  --vector: #42a9f9;
  --vector-m: #006db5;
  --atlas: #cd7be5;
  --atlas-m: #964bac;

  --sans: "Archivo", "Helvetica Neue", Arial, sans-serif;
  --serif: "Source Serif 4", Georgia, "Times New Roman", serif;
  --mono: "Red Hat Mono", ui-monospace, Menlo, Consolas, monospace;

  /* Roles, carbon by default. */
  --fg: var(--carbon-ink);
  --fg2: var(--carbon-ink-2);
  --fg3: var(--carbon-ink-3);
  --line: var(--carbon-rule);
  --hard: var(--carbon-ink);
  --ctl: var(--carbon-ctl);
  --ground: var(--carbon-shell);
  --agency: var(--cobalt-d);
  --asm: var(--violet-d);
  --prv: var(--slate-d);
  --opp: var(--emerald-d);
  --thr: var(--vermilion-d);
  --cau: var(--ochre-d);
}

/* ---------------------------------------------------------------- base */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
body {
  margin: 0;
  background: var(--carbon-shell);
  color: var(--fg);
  font-family: var(--sans);
  font-size: 17px;
  line-height: 1.55;
  font-variant-numeric: tabular-nums lining-nums;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
a { color: inherit; }
img, svg { display: block; max-width: 100%; }
p { margin: 0; }
h1, h2, h3 { margin: 0; }
ul, ol { margin: 0; padding: 0; list-style: none; }
b, strong { font-weight: 620; }
sup.tm { font-size: .5em; vertical-align: super; line-height: 0; margin-left: 1px; font-weight: 500; letter-spacing: 0; }

.skip-link { position: absolute; left: 12px; top: -60px; z-index: 20; background: var(--cobalt); color: #FFFFFF; padding: 10px 16px; border-radius: 2px; text-decoration: none; font-weight: 600; }
.skip-link:focus { top: 12px; }
:focus-visible { outline: 2px solid var(--agency); outline-offset: 2px; }

/* ---------------------------------------------------------------- materials */
.shell { background: var(--carbon-shell); }
.field { background: var(--carbon-field); --ground: var(--carbon-field); }
.shell, .field {
  color: var(--carbon-ink);
  --fg: var(--carbon-ink); --fg2: var(--carbon-ink-2); --fg3: var(--carbon-ink-3); --line: var(--carbon-rule);
  --hard: var(--carbon-ink); --ctl: var(--carbon-ctl);
  --agency: var(--cobalt-d); --asm: var(--violet-d); --prv: var(--slate-d);
  --opp: var(--emerald-d); --thr: var(--vermilion-d); --cau: var(--ochre-d);
}
.shell { --ground: var(--carbon-shell); }
.sheet, .plane, .collar {
  color: var(--mineral-ink);
  --fg: var(--mineral-ink); --fg2: var(--mineral-ink-2); --fg3: var(--mineral-ink-3); --line: var(--mineral-rule);
  --hard: var(--mineral-ink); --ctl: var(--mineral-ctl);
  --agency: var(--cobalt); --asm: var(--violet); --prv: var(--slate);
  --opp: var(--emerald); --thr: var(--vermilion); --cau: var(--ochre);
}
.sheet { background: var(--mineral-sheet); --ground: var(--mineral-sheet); }
.plane { background: var(--mineral-plane); --ground: var(--mineral-plane); --line: var(--mineral-rule-2); border-top: 1px solid var(--mineral-rule); }
.collar { background: var(--mineral-collar); --ground: var(--mineral-collar); }
.ledger { background: var(--mineral-hi); color: var(--mineral-ink); border-top: 2px solid var(--cobalt); }
/* The sheet set into its ground: a dark cut edge outside, a lit lip inside. */
.inset { box-shadow: 0 0 0 1px #0B0C0D, 0 18px 40px -24px rgba(0, 0, 0, .7), inset 0 1px 0 var(--mineral-hi); }
.ruled-top { border-top: 1px solid var(--carbon-rule); }

.wrap { max-width: 1312px; margin: 0 auto; padding-inline: 56px; }

/* ---------------------------------------------------------------- masthead */
.masthead { background: var(--carbon-shell); color: var(--carbon-ink); position: relative; z-index: 5; }
.mast { display: flex; align-items: stretch; min-height: 68px; border-bottom: 1px solid var(--carbon-rule); }
.wordmark { display: flex; align-items: center; padding-right: 32px; border-right: 1px solid var(--carbon-rule); text-decoration: none; flex: 0 0 auto; }
.wordmark svg { height: 15px; width: auto; }
.nav { display: flex; flex-wrap: wrap; flex: 1; align-items: stretch; justify-content: space-between; gap: 20px; padding-left: 20px; }
.nav__main { display: flex; align-items: stretch; gap: 4px; }
.nav__main a { display: flex; align-items: center; padding: 0 12px; font-size: 14.5px; font-weight: 500; color: var(--carbon-ink-2); text-decoration: none; border-bottom: 2px solid transparent; margin-bottom: -1px; transition: color .16s ease-out; }
.nav__main a:hover { color: var(--carbon-ink); }
.nav__util { display: flex; align-items: center; gap: 20px; }
.nav__util .plain { font-size: 14.5px; color: var(--carbon-ink-2); text-decoration: none; }
.nav__util .plain:hover { color: var(--carbon-ink); }
.menu__btn { display: none; align-items: center; gap: 8px; align-self: center; margin-left: auto; background: transparent; border: 1px solid var(--carbon-ctl); color: var(--carbon-ink); height: 44px; padding: 0 16px; border-radius: 2px; font: 500 14px var(--sans); cursor: pointer; }

/* ---------------------------------------------------------------- controls (action hierarchy, D-086) */
.btn { display: inline-flex; align-items: center; gap: 8px; height: 44px; padding: 0 18px; border-radius: 2px; border: 1px solid var(--ctl); background-color: var(--ground); color: var(--fg); font: 560 15px/1 var(--sans); text-decoration: none; cursor: pointer; white-space: nowrap; transition: background-color .16s ease-out, border-color .16s ease-out; }
.btn:hover { border-color: var(--fg); }
.btn--primary { background-color: var(--cobalt); border-color: var(--cobalt); color: #FFFFFF; }
.btn--primary:hover { background-color: var(--cobalt-press); border-color: var(--cobalt-press); }
.btn--sm { height: 36px; padding: 0 14px; font-size: 14px; }
.btn[disabled], .btn[aria-disabled="true"] { cursor: not-allowed; opacity: .55; }
.actions { display: flex; gap: 12px; flex-wrap: wrap; }
.xref { align-self: flex-start; color: var(--fg); text-decoration: none; font-weight: 560; border-bottom: 1px solid var(--line); padding-bottom: 2px; }
.xref:hover { border-bottom-color: var(--fg); }
.xref::after { content: "\00a0\2192"; font-weight: 400; }
.xrefs { display: flex; gap: 14px 28px; flex-wrap: wrap; align-items: baseline; }
.xrefs--col { flex-direction: column; align-items: flex-start; }

/* ---------------------------------------------------------------- type voices */
.h-hero { font: 640 76px/1.03 var(--sans); font-stretch: 110%; letter-spacing: -.024em; text-wrap: balance; }
.h-page { font: 640 60px/1.05 var(--sans); font-stretch: 110%; letter-spacing: -.022em; text-wrap: balance; }
.h-sec { font: 620 38px/1.1 var(--sans); font-stretch: 106%; letter-spacing: -.016em; text-wrap: balance; }
.h-sec--lg { font-size: 44px; }
.h-sub { font: 600 23px/1.22 var(--sans); font-stretch: 104%; letter-spacing: -.012em; text-wrap: balance; }
.h-sub--sm { font-size: 20px; }
.h-sub--xs { font-size: 18px; }
.h-sub--lg { font-size: 26px; }
.h-idx { font: 580 19px/1.25 var(--sans); font-stretch: 80%; }
.stand { font: 400 22px/1.5 var(--serif); color: var(--fg2); max-width: 62ch; text-wrap: pretty; }
.prose { color: var(--fg2); max-width: 68ch; text-wrap: pretty; }
.prose + .prose { margin-top: 14px; }
.lead-in > .prose + .prose, [class*="stack-"] > .prose + .prose, .tsec .prose + .prose { margin-top: 0; }
.asm { font: 420 19px/1.55 var(--serif); color: var(--fg); }
.asm b { color: var(--asm); font-weight: 560; }
.hyp { font: italic 400 19px/1.55 var(--serif); color: var(--fg2); }
.legend { font: 620 11px/1.3 var(--sans); font-stretch: 80%; letter-spacing: .08em; text-transform: uppercase; color: var(--fg3); }
.legend--ink { color: var(--fg); }
.meta { font-size: 14px; color: var(--fg3); line-height: 1.45; }
.mono { font-family: var(--mono); font-weight: 450; letter-spacing: -.01em; }
.small { font-size: 15px; }
.ink { color: var(--fg); }
.strong { color: var(--fg); font-weight: 600; }
.pyrai-name { color: var(--asm); }
.lead-in { display: flex; flex-direction: column; gap: 16px; }
.lead-in--lg { gap: 22px; }
.stack-sm { display: flex; flex-direction: column; gap: 10px; }
.stack-md { display: flex; flex-direction: column; gap: 14px; }
.stack-lg { display: flex; flex-direction: column; gap: 28px; }
.stack-lg--tight { gap: 22px; }
.pad-top { padding-top: 22px; }

/* ---------------------------------------------------------------- composition: rules before boxes */
.sec { padding-block: 112px; }
.sec--tight { padding-block: 72px; }
.sec--close { padding-block: 104px; }
.sec--cta { padding-block: 96px; }
.head { padding-top: 72px; padding-bottom: 80px; }
.shead { display: flex; justify-content: space-between; align-items: flex-end; gap: 32px; padding-bottom: 16px; border-bottom: 1.5px solid var(--hard); }
.shead .meta { text-align: right; flex: 0 0 auto; max-width: 42ch; }
.cols { display: grid; gap: 56px; }
.c2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.c3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.c4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.gap-lg { gap: 72px; }
.gap-md { gap: 40px; }
.gap-sm { gap: 20px; }
.c12 { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: 32px; row-gap: 32px; }
.c12--end { align-items: end; }
.rule-list { border-top: 1.5px solid var(--hard); }
.kv { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); gap: 32px; padding-block: 22px; border-bottom: 1px solid var(--line); }
.kv > :first-child { font-weight: 600; color: var(--fg); }
.kv:last-child.kv--open { border-bottom: 0; }
.facts { display: grid; border-top: 1.5px solid var(--hard); border-bottom: 1px solid var(--line); }
.facts > div { padding: 14px 20px 16px 0; border-right: 1px solid var(--line); display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.facts > div + div { padding-left: 20px; }
.facts > div:last-child { border-right: 0; }
.facts .v { font-size: 19px; font-weight: 560; color: var(--fg); display: flex; align-items: center; gap: 8px; }
.facts .v--cau { color: var(--cau); }
.facts .v--opp { color: var(--opp); }
.mt-s { margin-top: 20px; }
.mt-m { margin-top: 32px; }
.mt-l { margin-top: 48px; }
.mt-xl { margin-top: 56px; }

/* ---------------------------------------------------------------- breadcrumb */
.crumbs ol { display: flex; flex-wrap: wrap; gap: 10px; font-size: 14px; color: var(--fg3); }
.crumbs li { display: inline-flex; gap: 10px; }
.crumbs li + li::before { content: "/"; color: var(--fg3); }
.crumbs a { text-decoration: none; color: var(--fg2); }
.crumbs a:hover { color: var(--fg); text-decoration: underline; text-underline-offset: 3px; }
.crumbs + .c12, .crumbs + .lead { margin-top: 32px; }

/* ---------------------------------------------------------------- notation (taught, never varied: D-089) */
.mk { display: inline-block; flex: 0 0 auto; vertical-align: middle; }
.mk-sq { width: 10px; height: 10px; background: var(--prv); box-shadow: inset 0 0 0 1.5px var(--prv); }
.mk-sq.open { background: transparent; }
.mk-disc { width: 11px; height: 11px; border-radius: 50%; background: var(--asm); }
.mk-half { width: 11px; height: 11px; border-radius: 50%; background: linear-gradient(90deg, var(--asm) 50%, transparent 50%); box-shadow: inset 0 0 0 1.5px var(--asm); }
.mk-gen { width: 11px; height: 11px; border-radius: 50%; border: 1.5px dotted var(--asm); }
.mk-you { width: 11px; height: 11px; border-radius: 50%; background: var(--agency); }
.mk-you.open { background: transparent; box-shadow: inset 0 0 0 1.5px var(--agency); }
.mk-ring { width: 11px; height: 11px; border-radius: 50%; box-shadow: inset 0 0 0 1.5px var(--fg); }
.mk-void { width: 12px; height: 12px; border-radius: 50%; border: 1.5px dashed var(--fg3); }
.mk-dia { width: 9px; height: 9px; transform: rotate(45deg); border: 1.5px dashed var(--fg2); }
.mk-due { width: 13px; height: 13px; border-radius: 50%; box-shadow: inset 0 0 0 2px var(--cau); background: var(--ground); }
.tri-up { width: 0; height: 0; border-left: 6px solid transparent; border-right: 6px solid transparent; border-bottom: 10px solid var(--opp); }
.tri-dn { width: 0; height: 0; border-left: 6px solid transparent; border-right: 6px solid transparent; border-top: 10px solid var(--thr); }
.kind { display: flex; align-items: center; gap: 8px; }
.kind--top { align-items: baseline; gap: 10px; }
.kind--asm { color: var(--asm); }
.kind--hyp { font-family: var(--serif); font-style: italic; }
.rule-asm { border-top: 1.5px solid var(--asm); padding-top: 12px; }
.rule-fact { border-top: 1.5px solid var(--hard); padding-top: 12px; }
.rule-hyp { border-top: 1.5px dashed var(--fg3); padding-top: 12px; }
.rule-you { border-top: 2px solid var(--agency); padding-top: 12px; }
.claim { display: flex; flex-direction: column; gap: 14px; }
.claim .legend { color: var(--fg); }
.claim--asm .legend { color: var(--asm); }
.src { font-family: var(--mono); font-size: 12.5px; color: var(--fg3); }

/* Materiality by extent; confidence by line continuity. Two instruments, never one score. */
.mat { display: inline-flex; align-items: flex-end; gap: 2px; height: 14px; }
.mat i { display: block; width: 4px; background: var(--fg); }
.mat i:nth-child(1) { height: 5px; }
.mat i:nth-child(2) { height: 8px; }
.mat i:nth-child(3) { height: 11px; }
.mat i:nth-child(4) { height: 14px; }
.mat i.o { background: transparent; box-shadow: inset 0 0 0 1px var(--fg3); }
.conf { display: inline-block; width: 26px; border-top: 2px solid var(--fg); vertical-align: middle; }
.conf--med { border-top-style: dashed; }
.conf--low { border-top-style: dotted; }

/* Availability: a word with a drawn mark, never colour alone. */
.status { display: inline-flex; align-items: center; gap: 7px; font: 560 13px/1 var(--sans); color: var(--fg2); white-space: nowrap; }
.status .mk { width: 9px; height: 9px; }
.status--live { color: var(--fg); }
.status--live .mk { background: var(--fg); border-radius: 50%; }
.status--qual .mk { border-radius: 50%; background: linear-gradient(90deg, var(--fg2) 50%, transparent 50%); box-shadow: inset 0 0 0 1.5px var(--fg2); }

/* ---------------------------------------------------------------- product identity: identity elements only */
.p-scout { --pid: var(--scout); }
.p-strike { --pid: var(--strike); }
.p-vector { --pid: var(--vector); }
.p-atlas { --pid: var(--atlas); }
.sheet .p-scout, .plane .p-scout { --pid: var(--scout-m); }
.sheet .p-strike, .plane .p-strike { --pid: var(--strike-m); }
.sheet .p-vector, .plane .p-vector { --pid: var(--vector-m); }
.sheet .p-atlas, .plane .p-atlas { --pid: var(--atlas-m); }
.insignia { display: inline-block; flex: 0 0 auto; width: 11px; height: 15px; vertical-align: -3px; }
.insignia path { fill: var(--pid); }
.insignia--md { width: 14px; height: 19px; }
.insignia--lg { width: 16px; height: 22px; }
.insignia--xl { width: 32px; height: 44px; }
.pname { color: var(--pid); font-weight: 620; }
.pedge { border-top: 3px solid var(--pid); }
.pband { height: 6px; background: var(--pid); }
.pid-line { display: flex; align-items: center; gap: 16px; }
.pid-line .pname { font-size: 30px; font-stretch: 108%; }
.who { display: flex; align-items: center; gap: 8px; font-weight: 620; font-size: 15px; }
.who--you { color: var(--agency); }

/* ---------------------------------------------------------------- home: hero and the collapsed canonical lineage */
.hero { padding-top: 104px; padding-bottom: 88px; }
.hero__grid { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: 64px; align-items: center; }
.hero__copy { display: flex; flex-direction: column; gap: 28px; min-width: 0; }
.hero__copy .h-hero { font-size: clamp(38px, 4vw, 56px); text-wrap: wrap; }
.hero__copy .stand { font-size: 21px; max-width: 54ch; }
.hero__record { margin: 0; padding: 32px; border-block: 1px solid var(--carbon-rule); }
.hero__record figcaption { margin-bottom: 32px; }
.hero__record .h-sub { font-size: 21px; }
.hero__record figcaption p { margin-top: 14px; }
.hero__record .lin { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 32px 20px; }
.hero__record .owner { padding-right: 0; }
.hero__record > .meta { margin-top: 28px; }
.hero__aside { align-self: end; display: flex; flex-direction: column; gap: 14px; border-top: 1px solid var(--line); padding-top: 18px; }
.hero__aside--plain { border-top: 0; padding-top: 0; }
.figrow { display: flex; justify-content: space-between; gap: 24px; margin-bottom: 30px; }
.lin { display: grid; grid-template-columns: 3fr 3fr 2fr 1fr; }
.lin .grp { display: flex; flex-direction: column; gap: 12px; min-width: 0; }
.lin .owner { display: flex; align-items: baseline; gap: 8px; padding-right: 20px; }
.lin .owner .legend { color: var(--fg); }
.lin .grp--you .owner .legend { color: var(--agency); }
.lin .rail { display: flex; align-items: center; height: 14px; position: relative; }
.lin .rail::before { content: ""; position: absolute; left: 0; right: 0; top: 50%; border-top: 1.5px solid var(--fg2); }
.lin .grp--you .rail::before { border-top: 2px solid var(--agency); }
.lin .grp--future .rail::before { border-top: 1.5px dotted var(--fg3); }
.lin .st { flex: 1; display: flex; justify-content: flex-start; position: relative; z-index: 1; }
.lin .st .mk { outline: 3px solid var(--ground); }
.lin .nums, .lin .names { display: flex; }
.lin .nums span { flex: 1; font: 450 11px var(--mono); color: var(--fg3); }
.lin .names span { flex: 1; font-size: 13px; line-height: 1.3; color: var(--fg2); padding-right: 10px; }
/* The record progresses once through its nine positions when it is reached (D-088). Without script, or under
   reduced motion, it is shown resolved. */
.js .lin.is-armed .st .mk { opacity: 0; transform: scale(.4); transition: opacity .24s ease-out, transform .24s ease-out; }
.js .lin.is-armed.is-in .st .mk { opacity: 1; transform: none; }
.js .lin.is-armed .mk-dia { transform: rotate(45deg) scale(.4); }
.js .lin.is-armed.is-in .mk-dia { transform: rotate(45deg); }

/* Specimen: what a Material Change looks like */
.spec__bar { display: flex; justify-content: space-between; gap: 20px; padding: 14px 36px; border-bottom: 1px solid var(--mineral-rule); flex-wrap: wrap; align-items: center; }
.spec__bar .mono { font-size: 13px; color: var(--fg3); }
.spec__body { padding: 40px 36px 0; }
.spec__title { font: 600 30px/1.16 var(--sans); font-stretch: 106%; letter-spacing: -.012em; text-wrap: balance; }
.spec__title .mono { font-weight: 500; }
.spec__gaps { padding: 22px 22px 24px; display: flex; flex-direction: column; gap: 14px; align-self: start; }
.spec__gaps .note { border-top: 1px solid var(--mineral-rule); padding-top: 12px; }
.spec__ledger { margin: 40px 36px 36px; padding: 16px 22px; display: flex; gap: 20px; align-items: center; flex-wrap: wrap; }
.spec__ledger .you { color: var(--cobalt); font-weight: 620; }
.spec__empty { display: inline-flex; gap: 10px; align-items: center; border: 1px dashed var(--mineral-ctl); border-radius: 2px; height: 34px; padding: 0 12px; font-size: 14.5px; }
.gloss p .strong { margin-right: 4px; }

/* How Pyrnova works: the record, read in order */
.flow { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); border-top: 1.5px solid var(--hard); }
.flow > li { padding: 22px 24px 0 0; display: flex; flex-direction: column; gap: 12px; position: relative; }
.flow > li::before { content: ""; position: absolute; top: -6px; left: 0; width: 10px; height: 10px; background: var(--hard); border-radius: 50%; outline: 3px solid var(--ground); }
.flow > li.you::before { background: var(--agency); }

/* Products over one shared record */
.prod { display: flex; flex-direction: column; gap: 14px; padding-top: 24px; }
.prod__name { display: flex; gap: 10px; align-items: center; font-size: 22px; }
.prod__q { font: 500 20px/1.3 var(--sans); font-stretch: 96%; color: var(--fg); text-wrap: balance; }
.layer { display: flex; gap: 24px; align-items: baseline; }
.layer__name { font: 600 19px/1.22 var(--sans); font-stretch: 104%; flex: 0 0 96px; }

/* Distinctions ledger */
.dist { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 32px; padding-block: 24px; border-bottom: 1px solid var(--line); align-items: baseline; }
.dist:last-child { border-bottom: 0; }
.dist__pair { font: 600 22px/1.3 var(--sans); font-stretch: 104%; }
.dist__pair i { font: italic 400 20px var(--serif); color: var(--fg3); padding-inline: 8px; }
.dist__pair--plain { font-size: 18px; }

/* Indexed lists */
.ilist > li > a, .ilist > li > div { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 20px; padding-block: 18px; border-bottom: 1px solid var(--line); text-decoration: none; align-items: center; }
.ilist > li > a:hover .h-idx { text-decoration: underline; text-underline-offset: 4px; }
.ilist .meta { display: block; margin-top: 4px; }

/* Numbered strips: the engagement path and the Desk's process */
.steps { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border-top: 1.5px solid var(--hard); }
.steps > li { padding: 20px 28px 0 0; display: flex; flex-direction: column; gap: 10px; }
.steps--6 { grid-template-columns: repeat(6, minmax(0, 1fr)); }
.steps--6 > li { padding: 18px 20px 0 0; gap: 8px; }

/* ---------------------------------------------------------------- platform: follow one change */
.stages { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); border-top: 1.5px solid var(--carbon-ink); }
.stage { display: flex; flex-direction: column; gap: 8px; min-height: 104px; padding: 16px 16px 18px; border-right: 1px solid var(--carbon-rule); color: var(--carbon-ink-2); text-decoration: none; text-align: left; background: transparent; font: inherit; transition: background-color .2s ease-out, color .2s ease-out; }
.stage:last-child { border-right: 0; }
.stage:hover { color: var(--carbon-ink); background: var(--carbon-2); }
.stage[aria-selected="true"] { background: var(--mineral-sheet); color: var(--mineral-ink); }
.stage .n { font: 450 12px var(--mono); opacity: .85; }
.stage .l { font: 600 16px/1.25 var(--sans); font-stretch: 96%; }
.stage .who { font-size: 13px; font-weight: 560; gap: 6px; }
.stage[aria-selected="true"] .p-scout { --pid: var(--scout-m); }
.stage[aria-selected="true"] .p-strike { --pid: var(--strike-m); }
.stage[aria-selected="true"] .p-vector { --pid: var(--vector-m); }
.stage[aria-selected="true"] .p-atlas { --pid: var(--atlas-m); }
.panel { padding-block: 56px 64px; border-bottom: 1px solid var(--mineral-rule); }
.panel:last-of-type { border-bottom: 0; }
.js .panels.is-tabs .panel { border-bottom: 0; }
.js .panels.is-tabs .panel[hidden] { display: none; }
.detail { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: 56px; }
.detail__aside { display: flex; flex-direction: column; gap: 16px; border-top: 1.5px solid var(--hard); padding-top: 16px; }
.detail__aside p { font-size: 16px; }
.stagenav { display: flex; justify-content: space-between; gap: 16px; border-top: 1px solid var(--mineral-rule); padding-top: 18px; padding-bottom: 64px; }
.stagenav[hidden] { display: none; }

/* ---------------------------------------------------------------- product pages */
.wf { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); column-gap: 56px; border-top: 1.5px solid var(--hard); }
.wf > li { display: grid; grid-template-columns: 44px minmax(0, 1fr); gap: 0 12px; padding-block: 22px; border-bottom: 1px solid var(--line); }
.wf .n { font: 450 13px var(--mono); color: var(--fg3); padding-top: 4px; }
.wf .prose { display: inline; }
.hand > li > a { display: grid; grid-template-columns: 22px minmax(0, 1fr) auto; gap: 12px; align-items: baseline; padding-block: 18px; border-bottom: 1px solid var(--line); text-decoration: none; }
.hand > li > a:hover .pname { text-decoration: underline; text-underline-offset: 4px; }
.proof { margin: 0; display: flex; flex-direction: column; gap: 14px; }
.proof img { width: 100%; height: auto; border: 1px solid var(--carbon-rule); background: var(--carbon-field); }
.proof figcaption { font-size: 14px; color: var(--fg3); }
.chain { border-top: 1.5px solid var(--hard); }
.chain > li { display: grid; grid-template-columns: 28px minmax(0, 1fr); gap: 12px; padding-block: 14px; border-bottom: 1px solid var(--line); align-items: baseline; }
.chain > li.hyp-row { border-bottom-style: dashed; }

/* ---------------------------------------------------------------- industries and solutions */
.qs > div { display: grid; grid-template-columns: minmax(0, 6fr) minmax(0, 6fr); gap: 40px; padding-block: 24px; border-bottom: 1px solid var(--line); align-items: baseline; }
.qs__q { font: 600 22px/1.3 var(--sans); font-stretch: 102%; text-wrap: balance; }
.prodmap { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 32px; }
.prodmap > div { padding-top: 18px; display: flex; flex-direction: column; gap: 10px; }
.when { position: relative; height: 200px; margin-top: 40px; }
.when > span, .when > div { position: absolute; }
.when .past { left: 0; top: 100px; width: 24.8%; border-top: 1.5px solid var(--carbon-ink-2); }
.when .fut { left: 24.8%; right: 0; top: 100px; border-top: 1.5px dotted var(--carbon-ctl); }
.when .win { left: 24.8%; width: 49.6%; top: 94px; height: 12px; background: rgba(227, 174, 74, .13); border-left: 1px solid rgba(227, 174, 74, .5); border-right: 1px solid rgba(227, 174, 74, .5); }
.when .pt { top: 100px; transform: translate(-50%, -50%); }
.when .pt .mk-disc { outline: 2px solid var(--carbon-field); }
.when .today { left: 24.8%; top: 40px; height: 120px; border-left: 2px solid var(--cobalt-d); }
.when .lab { font-size: 14px; line-height: 1.35; color: var(--carbon-ink-2); white-space: nowrap; }
.when .lab b { display: block; color: var(--carbon-ink); font-weight: 600; }
.when .lab--agency, .when .lab--agency b { color: var(--cobalt-d); }
.when .lab--cau, .when .lab--cau b { color: var(--ochre-d); }
.when .ticks { left: 0; right: 0; top: 176px; display: flex; justify-content: space-between; font: 450 12px var(--mono); color: var(--carbon-ink-3); }
.when-key { border-top: 1px solid var(--carbon-rule); padding-top: 20px; }
.tick-today { display: inline-block; height: 14px; border-left: 2px solid var(--cobalt-d); }
.when-list { display: none; }
.out { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 40px; }
.out > div { display: flex; flex-direction: column; gap: 10px; }
.out .rule-you .h-sub { color: var(--agency); }
.faq details { border-bottom: 1px solid var(--line); padding-block: 4px; }
.faq summary { cursor: pointer; list-style: none; display: flex; justify-content: space-between; gap: 24px; padding-block: 18px; font: 600 19px/1.3 var(--sans); }
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after { content: "+"; font-weight: 400; color: var(--fg3); }
.faq details[open] summary::after { content: "\2212"; }
.faq details p { margin: 0 0 20px; }

/* ---------------------------------------------------------------- insights */
.desk-head { display: grid; grid-template-columns: minmax(0, 8fr) minmax(0, 4fr); gap: 56px; align-items: end; padding-bottom: 28px; border-bottom: 3px double var(--hard); }
.cover { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 32px; }
.cover > div { border-top: 1px solid var(--line); padding-top: 14px; display: flex; flex-direction: column; gap: 6px; }
.box { padding: 22px 22px 24px; display: flex; flex-direction: column; gap: 12px; }
.box .note { border-top: 1px solid var(--mineral-rule); padding-top: 12px; }
.empty { border-top: 1.5px solid var(--hard); padding-top: 24px; display: flex; flex-direction: column; gap: 14px; }

/* The Intelligence Assessment: the template every published assessment uses. */
.doc-head { margin-top: 36px; padding-bottom: 28px; border-bottom: 3px double var(--hard); display: flex; flex-direction: column; gap: 18px; }
.doc-kind { font: 620 15px var(--sans); font-stretch: 110%; letter-spacing: .01em; }
.doc-title { font-size: 52px; max-width: 22ch; }
.doc-byline { display: flex; justify-content: space-between; gap: 20px; flex-wrap: wrap; align-items: center; margin-top: 8px; }
.doc { display: grid; grid-template-columns: minmax(0, 8fr) minmax(0, 3fr); gap: 64px; margin-top: 40px; }
.dsec { display: flex; flex-direction: column; gap: 16px; padding-top: 44px; }
.dsec > h2 { font: 620 24px/1.2 var(--sans); font-stretch: 104%; padding-bottom: 12px; border-bottom: 1.5px solid var(--hard); }
.kj > li { display: grid; grid-template-columns: 36px minmax(0, 1fr) 150px; gap: 16px; padding-block: 20px; border-bottom: 1px solid var(--line); align-items: baseline; }
.kj .n { font: 450 13px var(--mono); color: var(--asm); }
.kj .asm { font-size: 18px; }
.cf { display: inline-flex; gap: 8px; align-items: center; }
.ind > div { display: grid; grid-template-columns: 120px minmax(0, 1fr); gap: 20px; padding-block: 14px; border-bottom: 1px solid var(--line); }
.ind .legend--opp { color: var(--opp); }
.ind .legend--cau { color: var(--cau); }
.hist > li { display: grid; grid-template-columns: 200px 70px minmax(0, 1fr); gap: 20px; padding-block: 14px; border-bottom: 1px solid var(--line); align-items: baseline; }
.hist s { color: var(--fg3); }
.meta-col { display: flex; flex-direction: column; border-top: 1.5px solid var(--hard); }
.meta-col > div { display: flex; flex-direction: column; gap: 3px; padding-block: 12px; border-bottom: 1px solid var(--line); }
.seg { display: inline-flex; border: 1px solid var(--mineral-ctl); border-radius: 2px; }
.seg[hidden] { display: none; }
.seg button { appearance: none; border: 0; background: transparent; padding: 0 16px; height: 44px; font: 560 14px var(--sans); color: var(--mineral-ink-2); cursor: pointer; }
.seg button[aria-pressed="true"] { background: var(--mineral-ink); color: var(--mineral-sheet); }
.js .doc.is-exec .full-only { display: none; }

/* ---------------------------------------------------------------- company, trust and briefing */
.eng { border-left: 1.5px solid var(--hard); margin-left: 5px; }
.eng > li { position: relative; display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); gap: 40px; padding: 0 0 40px 36px; }
.eng > li:last-child { padding-bottom: 0; }
.eng > li::before { content: ""; position: absolute; left: -6.5px; top: 9px; width: 11px; height: 11px; border-radius: 50%; background: var(--hard); outline: 4px solid var(--ground); }
.eng > li.you::before { background: var(--agency); }
.eng > li.you .h-sub { color: var(--agency); }
.tsec { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); gap: 56px; padding-block: 44px; border-bottom: 1px solid var(--line); scroll-margin-top: 24px; }
.tsec:first-child { border-top: 1.5px solid var(--hard); }
.tsec:last-child { border-bottom: 0; }
.ex { display: flex; gap: 12px; align-items: flex-start; padding: 14px 18px; background: var(--mineral-collar); font-size: 15px; margin-top: 6px; }
.ex__mark { font-weight: 700; }
.hatch { display: inline-block; width: 22px; height: 12px; flex: 0 0 auto; margin-top: 4px; background: repeating-linear-gradient(135deg, var(--slate) 0 1.5px, transparent 1.5px 5px); box-shadow: inset 0 0 0 1px var(--slate); }
.cklist > li { display: grid; grid-template-columns: 18px minmax(0, 1fr); gap: 10px; padding-block: 10px; border-bottom: 1px solid var(--line); font-size: 15px; color: var(--fg2); }
.cklist .ck { font-weight: 700; color: var(--fg); }
.next > li { display: grid; grid-template-columns: 28px minmax(0, 1fr); gap: 12px; padding-block: 16px; border-bottom: 1px solid var(--line); }
.next .n { font: 450 13px var(--mono); color: var(--fg3); padding-top: 3px; }
.notice { display: flex; gap: 12px; align-items: flex-start; border-top: 1.5px solid var(--ochre); padding-top: 12px; font-size: 15px; color: var(--fg2); }
.notice b { color: var(--ochre); }
.notice__mark { font-weight: 700; color: var(--ochre); }
.notice--closed { border-top: 2px solid var(--hard); background: var(--mineral-collar); padding: 16px 18px; }
.notice--closed b { color: var(--fg); }
.brief { display: flex; flex-direction: column; gap: 22px; border-top: 1.5px solid var(--hard); padding-top: 28px; }
.brief fieldset { border: 0; margin: 0; padding: 0; min-width: 0; display: flex; flex-direction: column; gap: 22px; }
.brief legend { padding: 0; margin-bottom: 18px; }
.fld { display: flex; flex-direction: column; gap: 8px; }
.fld label { font-weight: 600; font-size: 15px; color: var(--fg); }
.fld .hint { font-size: 14px; color: var(--fg3); }
.inp { height: 46px; border: 1px solid var(--mineral-ctl); border-radius: 2px; background: var(--mineral-hi); padding: 0 14px; font: 400 16px var(--sans); color: var(--mineral-ink); width: 100%; }
textarea.inp { height: 132px; padding: 12px 14px; resize: vertical; line-height: 1.5; }
select.inp { appearance: none; background-image: linear-gradient(45deg, transparent 50%, var(--mineral-ink-2) 50%), linear-gradient(135deg, var(--mineral-ink-2) 50%, transparent 50%); background-position: calc(100% - 20px) 20px, calc(100% - 15px) 20px; background-size: 5px 5px; background-repeat: no-repeat; }
.inp:disabled { cursor: not-allowed; color: var(--mineral-ink-2); }
.chk { display: flex; gap: 12px; align-items: flex-start; font-size: 15px; color: var(--fg2); }
.chk input { width: 20px; height: 20px; margin: 2px 0 0; accent-color: var(--cobalt); }

/* ---------------------------------------------------------------- footer */
.footer { border-top: 1px solid var(--carbon-rule); }
.foot { padding-block: 72px 40px; }
.fgrid { display: grid; grid-template-columns: minmax(0, 3fr) repeat(5, minmax(0, 2fr)); gap: 32px; }
.fgrid__lead { display: flex; flex-direction: column; gap: 18px; padding-right: 24px; }
.fgrid__lead .wordmark { border-right: 0; padding-right: 0; }
.fgrid__lead .wordmark svg { height: 14px; }
.fgrid__lead .btn { align-self: flex-start; }
.fgrid h2 { margin: 0 0 14px; color: var(--carbon-ink); }
.fgrid h2 + ul + h2 { margin-top: 28px; }
.fgrid ul { display: flex; flex-direction: column; gap: 9px; }
.fgrid li a { display: inline-flex; align-items: center; gap: 8px; text-decoration: none; color: var(--carbon-ink-2); font-size: 15px; }
.fgrid li a:hover { color: var(--carbon-ink); }
.fgrid li a .pyrai-name { color: var(--violet-d); }
.foot__base { display: flex; justify-content: space-between; gap: 12px 24px; flex-wrap: wrap; border-top: 1px solid var(--carbon-rule); margin-top: 64px; padding-top: 20px; font-size: 13.5px; color: var(--carbon-ink-3); }
.foot__base a { text-decoration: none; }
.foot__base a:hover { color: var(--carbon-ink); }

/* ---------------------------------------------------------------- marketing expression layer (D-085) */
/* Platform cyan is the parent brand's connective accent on the website: the current navigation rule and nothing
   else. It is never an interaction colour and never a signal. */
:root { --cyan: #25CFE8; }
.nav__main a[aria-current="page"] { color: var(--carbon-ink); border-bottom-color: var(--cyan); }

/* ---------------------------------------------------------------- narrow widths: recompose, never shrink */
@media (max-width: 1080px) {
  .wrap { padding-inline: 40px; }
  .c4, .prodmap, .cover { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .nav__main a { padding: 0 8px; }
  .wordmark { padding-right: 20px; }
  .nav { padding-left: 12px; }
  .nav__util .plain { display: none; }
  .stages { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .stage { border-bottom: 1px solid var(--carbon-rule); }
  .steps--6 { grid-template-columns: repeat(3, minmax(0, 1fr)); row-gap: 28px; }
  .fgrid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .fgrid__lead { grid-column: 1 / -1; }
  .flow { grid-template-columns: repeat(3, minmax(0, 1fr)); row-gap: 36px; }
}
@media (max-width: 960px) {
  .mast { flex-wrap: wrap; }
  .wordmark { border-right: 0; min-height: 60px; }
  .js .menu__btn { display: inline-flex; }
  .nav { flex: 1 0 100%; flex-direction: column; gap: 0; padding: 0 0 24px; order: 3; }
  .nav__main { flex-direction: column; gap: 0; }
  .nav__main a, .nav__util .plain { display: block; padding: 14px 0; border-bottom: 1px solid var(--carbon-rule); margin: 0; font-size: 18px; font-weight: 560; color: var(--carbon-ink); }
  .nav__main a[aria-current="page"] { border-bottom-color: var(--carbon-rule); box-shadow: inset 3px 0 0 var(--cyan); padding-left: 14px; }
  .nav__util { flex-direction: column; align-items: stretch; gap: 0; }
  .nav__util .btn { align-self: flex-start; margin-top: 20px; }
  .js .masthead:not([data-nav-open="true"]) .nav { display: none; }
  .mast { border-bottom: 0; }
  .masthead { border-bottom: 1px solid var(--carbon-rule); }
}
@media (max-width: 820px) {
  body { font-size: 16.5px; }
  .wrap { padding-inline: 20px; }
  .sec { padding-block: 64px; }
  .sec--tight, .sec--close, .sec--cta { padding-block: 48px; }
  .head { padding-top: 48px; padding-bottom: 56px; }
  .hero { padding-top: 56px; padding-bottom: 56px; }
  .hero__grid { grid-template-columns: minmax(0, 1fr); gap: 40px; }
  .hero__record { padding: 28px 20px; }
  .hero__copy .stand { font-size: 19px; }
  .h-hero { font-size: 42px; line-height: 1.06; }
  .h-page, .doc-title { font-size: 38px; }
  .h-sec, .h-sec--lg { font-size: 29px; }
  .h-sub { font-size: 21px; }
  .h-sub--sm, .h-sub--xs { font-size: 19px; }
  .stand { font-size: 19px; }
  .spec__title { font-size: 23px; }
  .cols, .c2, .c3, .c4, .prodmap, .cover, .out { grid-template-columns: minmax(0, 1fr); gap: 36px; }
  .gap-lg { gap: 48px; }
  .c12 { grid-template-columns: minmax(0, 1fr); row-gap: 28px; }
  .c12 > * { grid-column: 1 / -1 !important; }
  .kv, .dist, .qs > div, .tsec, .eng > li, .detail, .doc, .desk-head { grid-template-columns: minmax(0, 1fr); gap: 8px; }
  .tsec { gap: 14px; padding-block: 32px; }
  .detail, .doc { gap: 32px; }
  .desk-head { gap: 20px; }
  .eng > li { padding-left: 24px; }
  .shead { flex-direction: column; align-items: flex-start; gap: 6px; }
  .shead .meta { text-align: left; }
  .figrow { flex-direction: column; gap: 8px; }
  .facts { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  .facts > div { border-right: 0; border-bottom: 1px solid var(--line); padding-left: 0 !important; }
  .lin { grid-template-columns: minmax(0, 1fr); row-gap: 22px; }
  .lin .names { display: none; }
  .flow, .steps, .steps--6 { grid-template-columns: minmax(0, 1fr); border-top: 0; border-left: 1.5px solid var(--hard); padding-left: 22px; row-gap: 28px; }
  .flow > li, .steps > li, .steps--6 > li { padding: 0; }
  .flow > li::before { top: 7px; left: -28px; }
  .stages { grid-template-columns: minmax(0, 1fr); }
  .stage { min-height: 0; flex-direction: row; align-items: baseline; gap: 12px; border-right: 0; padding: 14px 4px; }
  .stage .who { margin-left: auto; }
  .wf { grid-template-columns: minmax(0, 1fr); }
  .when { display: none; }
  .when-list { display: block; }
  .kj > li { grid-template-columns: 28px minmax(0, 1fr); }
  .kj .cf { grid-column: 2; }
  .hist > li, .ind > div { grid-template-columns: minmax(0, 1fr); gap: 4px; }
  .spec__bar { padding: 14px 20px; }
  .spec__body { padding: 28px 20px 0; }
  .spec__ledger { margin: 28px 20px 20px; }
  .fgrid { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 40px; }
  .layer { flex-direction: column; gap: 6px; }
  .layer__name { flex: 0 0 auto; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { transition: none !important; animation: none !important; scroll-behavior: auto !important; }
  .js .lin.is-armed .st .mk { opacity: 1; transform: none; }
  .js .lin.is-armed .mk-dia { transform: rotate(45deg); }
}

@media print {
  .masthead, .footer, .seg, .skip-link, .stagenav { display: none !important; }
  body, .shell, .field { background: #FFFFFF; color: #000000; }
}

/* ---------------------------------------------------------------- Intelligence Desk (PYRNOVA-INTELLIGENCE-001, D-117) */
/* The Desk may be more expressive than the rest of the site: a carbon band with a fine ruled index grid, mono
   reference strips and a quiet vertical gradient, all from the established tokens. Cobalt stays on interaction; no
   product hue and no cyan is used here. */
.dk-band { background-color: var(--carbon-field); background-image: linear-gradient(180deg, var(--carbon-field) 0%, var(--carbon-shell) 100%); border-bottom: 1px solid var(--carbon-rule); position: relative; overflow: hidden; }
.dk-band::before { content: ""; position: absolute; inset: 0; pointer-events: none; background-image: linear-gradient(90deg, color-mix(in srgb, var(--carbon-ink) 5%, transparent) 1px, transparent 1px); background-size: calc(100% / 12) 100%; background-position: left top; }
.dk-head { position: relative; padding-top: 64px; padding-bottom: 56px; display: flex; flex-direction: column; gap: 22px; }
.dk-kicker { font: 450 13px/1.4 var(--mono); letter-spacing: .01em; color: var(--fg2); }
.dk-kicker a { text-decoration: none; }
.dk-kicker a:hover { text-decoration: underline; text-underline-offset: 3px; }
.dk-title { max-width: 18ch; }
.dk-title--art { font-size: 48px; max-width: 24ch; }
.dk-band .stand { max-width: 58ch; }
.dk-facts { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); margin: 8px 0 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.dk-facts > div { padding: 12px 16px 14px 0; display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.dk-facts > div + div { padding-left: 16px; border-left: 1px solid var(--line); }
.dk-facts dd { margin: 0; font: 450 14px/1.4 var(--mono); color: var(--fg); overflow-wrap: anywhere; }
.dk-facts dd a { text-underline-offset: 3px; }
.dk-index { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); margin-top: 8px; border-top: 1px solid var(--line); }
.dk-index li + li { border-left: 1px solid var(--line); }
.dk-index a { display: flex; flex-direction: column; gap: 4px; padding: 14px 20px 16px; text-decoration: none; height: 100%; }
.dk-index li:first-child a { padding-left: 0; }
.dk-index a:hover .dk-index__n { text-decoration: underline; text-underline-offset: 4px; }
.dk-index .mono { font-size: 13px; color: var(--fg3); }
.dk-index__n { font: 580 21px/1.2 var(--sans); font-stretch: 100%; }

.dk-pubs { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 40px; }
.dk-pub { display: flex; flex-direction: column; gap: 14px; border-top: 1.5px solid var(--hard); padding-top: 18px; scroll-margin-top: 24px; }
.dk-latest { display: flex; flex-direction: column; gap: 8px; padding-top: 14px; border-top: 1px solid var(--line); }
.dk-latest a.h-idx { text-underline-offset: 4px; }
.dk-latest .empty { border-top: 0; padding-top: 0; }
.dk-topics { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 24px; }
.dk-topics a { display: flex; flex-direction: column; gap: 6px; height: 100%; border-top: 1px solid var(--line); padding-top: 14px; text-decoration: none; }
.dk-topics a:hover .h-idx { text-decoration: underline; text-underline-offset: 4px; }
.dk-flow { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 32px 40px; counter-reset: dk; }
.dk-flow > li { display: flex; flex-direction: column; gap: 6px; border-top: 1px solid var(--line); padding-top: 14px; }

.dk-year { padding-top: 8px; }
.dk-year + .dk-year { margin-top: 56px; }
.dk-year__h { font: 640 40px/1.1 var(--sans); font-stretch: 108%; letter-spacing: -.016em; display: flex; align-items: baseline; justify-content: space-between; gap: 20px; padding-bottom: 14px; border-bottom: 3px double var(--hard); }
.dk-count { font-size: 13px; font-weight: 450; letter-spacing: 0; color: var(--fg3); }
.dk-month { margin: 32px 0 10px; }
.dk-list > li > a { display: grid; grid-template-columns: 190px minmax(0, 1fr); gap: 28px; padding-block: 20px; border-bottom: 1px solid var(--line); text-decoration: none; }
.dk-list > li > a:hover .h-idx { text-decoration: underline; text-underline-offset: 4px; }
.dk-ref, .dk-main { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.dk-main .h-idx { font-stretch: 100%; font-size: 21px; }
.dk-corr { display: grid; grid-template-columns: 190px minmax(0, 1fr); gap: 28px; padding-block: 20px; border-bottom: 1px solid var(--line); }
.dk-corr .h-idx { text-underline-offset: 4px; }

.dk-art { padding-bottom: 96px; }
.dk-artwrap { padding-top: 16px; }
.dk-text { min-width: 0; }
.dk-preview { background: var(--carbon-2); color: var(--carbon-ink); border-bottom: 2px solid var(--ochre-d); padding: 12px 56px; font-size: 15px; }
.dk-preview b { color: var(--ochre-d); }
.dk-sec { display: flex; flex-direction: column; gap: 16px; padding-top: 44px; scroll-margin-top: 16px; }
.dk-h { font: 620 24px/1.2 var(--sans); font-stretch: 104%; padding-bottom: 12px; border-bottom: 1.5px solid var(--hard); }
.dk-sub { margin-top: 8px; }
.dk-sec .dk-sec { padding-top: 12px; }
.dk-sec .dk-sec > .dk-h { font-size: 19px; border-bottom: 1px solid var(--line); }
.dk-fact { max-width: 68ch; padding-left: 14px; border-left: 2px solid var(--prv); text-wrap: pretty; }
.dk-item { display: flex; flex-direction: column; gap: 8px; padding-block: 18px; border-bottom: 1px solid var(--line); }
.dk-item__h { font: 600 19px/1.3 var(--sans); font-stretch: 100%; letter-spacing: -.005em; }
.dk-more { padding-left: 14px; }
.dk-judg { max-width: 68ch; padding: 4px 0 4px 14px; border-left: 3px solid var(--asm); }
.dk-judg__b { display: flex; flex-direction: column; gap: 6px; }
.dk-judg__l { color: var(--asm); }
.dk-cite { font: 450 11px/0 var(--mono); margin-left: 3px; vertical-align: super; }
.dk-cite a { padding: 0 1px; text-decoration: underline; text-underline-offset: 2px; }
.dk-bullets { display: flex; flex-direction: column; gap: 10px; max-width: 68ch; }
.dk-bullets li { padding-left: 16px; position: relative; color: var(--fg2); }
.dk-bullets li::before { content: ""; position: absolute; left: 0; top: .7em; width: 6px; border-top: 1.5px solid var(--fg3); }
.dk-bullets--mk li { display: flex; gap: 10px; align-items: baseline; padding-left: 0; }
.dk-bullets--mk li::before { content: none; }
.dk-bullets--mk .mk { transform: translateY(1px); }
.dk-bullets--mk .mk-dia { transform: rotate(45deg) translateY(-1px); margin-inline: 2px; }
.dk-sources { counter-reset: dk-src; display: flex; flex-direction: column; border-top: 1px solid var(--line); }
.dk-sources > li { display: flex; flex-direction: column; gap: 4px; padding: 14px 0 14px 36px; border-bottom: 1px solid var(--line); position: relative; scroll-margin-top: 16px; }
.dk-sources > li::before { counter-increment: dk-src; content: counter(dk-src); position: absolute; left: 0; top: 14px; font: 450 13px/1.55 var(--mono); color: var(--fg3); }
.dk-sources > li:target { background: var(--mineral-collar); }
.dk-notice { margin-top: 28px; padding: 18px 20px 20px; background: var(--mineral-collar); border-top: 3px solid var(--cau); display: flex; flex-direction: column; gap: 10px; }
.dk-notice--wd { border-top-color: var(--thr); }
.dk-notice__h { font: 620 20px/1.2 var(--sans); font-stretch: 104%; }
.dk-wd { margin-top: 20px; }
.dk-wd > summary { cursor: pointer; font-weight: 600; padding-block: 10px; border-bottom: 1.5px solid var(--hard); }
.dk-wd__b { color: var(--fg3); }
.dk-wd__b .dk-fact, .dk-wd__b .asm, .dk-wd__b .dk-item__h { color: var(--fg3); text-decoration: line-through; text-decoration-thickness: 1px; }
.dk-aside { min-width: 0; }
.dk-toc ol { display: flex; flex-direction: column; gap: 6px; margin-top: 8px; border-top: 1.5px solid var(--hard); padding-top: 10px; }
.dk-toc a { text-decoration: none; color: var(--fg2); }
.dk-toc a:hover { color: var(--fg); text-decoration: underline; text-underline-offset: 3px; }
.dk-share { display: flex; flex-direction: column; gap: 10px; }
.dk-share__b { display: flex; flex-wrap: wrap; gap: 8px; }
.dk-share__b [hidden] { display: none; }
.dk-share__l { display: flex; flex-wrap: wrap; gap: 6px 18px; }
.dk-share__l a { text-underline-offset: 3px; }
.dk-checks { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px 20px; }
.dk-band--art .stand { font-size: 21px; }

@media (max-width: 1080px) {
  .dk-pubs { grid-template-columns: minmax(0, 1fr); gap: 36px; }
  .dk-topics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .dk-flow { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .dk-preview { padding-inline: 40px; }
}
@media (max-width: 820px) {
  .dk-head { padding-top: 40px; padding-bottom: 40px; gap: 18px; }
  .dk-title, .dk-title--art { max-width: none; }
  .dk-title--art { font-size: 32px; }
  .dk-index, .dk-topics, .dk-flow, .dk-checks { grid-template-columns: minmax(0, 1fr); }
  .dk-index li + li { border-left: 0; border-top: 1px solid var(--line); }
  .dk-index a, .dk-index li:first-child a { padding: 12px 0 14px; }
  .dk-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .dk-facts > div, .dk-facts > div + div { padding: 10px 12px 12px 0; border-left: 0; }
  .dk-list > li > a, .dk-corr { grid-template-columns: minmax(0, 1fr); gap: 8px; }
  .dk-ref { flex-direction: row; gap: 14px; flex-wrap: wrap; }
  .dk-year__h { font-size: 32px; }
  .dk-preview { padding-inline: 20px; }
  .dk-h { font-size: 22px; }
}
@media print {
  .dk-band { background: #FFFFFF; background-image: none; border-bottom: 1.5px solid #000000; }
  .dk-band::before, .dk-share, .dk-toc { display: none !important; }
  .dk-band .stand, .dk-kicker, .dk-facts dd { color: #000000; }
  .dk-wd__b { display: block; }
  .dk-sec, .dk-item { break-inside: avoid; }
  .dk-sources > li { break-inside: avoid; }
}