/*
 * Organization of Power — Signal & Structure
 * Production design system: G6 / T2 / P5
 * Dense Instrument / IBM Plex / Ice–Ultramarine–Amber
 */

@font-face {
    font-family: "IBM Plex Sans";
    src: url("../fonts/ibm-plex/IBMPlexSans-Regular.5aaadb685d3c.woff2") format("woff2");
    font-style: normal;
    font-weight: 400;
    font-display: swap;
}

@font-face {
    font-family: "IBM Plex Sans";
    src: url("../fonts/ibm-plex/IBMPlexSans-Italic.2cf7d9cd7a9e.woff2") format("woff2");
    font-style: italic;
    font-weight: 400;
    font-display: swap;
}

@font-face {
    font-family: "IBM Plex Sans";
    src: url("../fonts/ibm-plex/IBMPlexSans-Medium.02ec16345450.woff2") format("woff2");
    font-style: normal;
    font-weight: 500;
    font-display: swap;
}

@font-face {
    font-family: "IBM Plex Sans";
    src: url("../fonts/ibm-plex/IBMPlexSans-SemiBold.51d76d33ef85.woff2") format("woff2");
    font-style: normal;
    font-weight: 600;
    font-display: swap;
}

@font-face {
    font-family: "IBM Plex Sans";
    src: url("../fonts/ibm-plex/IBMPlexSans-Bold.ea5f696de389.woff2") format("woff2");
    font-style: normal;
    font-weight: 700;
    font-display: swap;
}

@font-face {
    font-family: "IBM Plex Mono";
    src: url("../fonts/ibm-plex/IBMPlexMono-Regular.b51685c998a0.woff2") format("woff2");
    font-style: normal;
    font-weight: 400;
    font-display: swap;
}

@font-face {
    font-family: "IBM Plex Mono";
    src: url("../fonts/ibm-plex/IBMPlexMono-Medium.91abacd323ba.woff2") format("woff2");
    font-style: normal;
    font-weight: 500;
    font-display: swap;
}

@font-face {
    font-family: "IBM Plex Mono";
    src: url("../fonts/ibm-plex/IBMPlexMono-SemiBold.7d69bd02da7b.woff2") format("woff2");
    font-style: normal;
    font-weight: 600;
    font-display: swap;
}

@font-face {
    font-family: "IBM Plex Mono";
    src: url("../fonts/ibm-plex/IBMPlexMono-Bold.11da63e3f137.woff2") format("woff2");
    font-style: normal;
    font-weight: 700;
    font-display: swap;
}

:root {
    --page-width: 1180px;
    --type-h1: 36px;
    --type-h2: 24px;
    --type-h3: 18px;
    --type-body: 16px;
    --type-small: 14px;
    --type-label: 12px;
    --type-code: 13px;
    --weight-regular: 400;
    --weight-semibold: 600;
    --font-sans: "IBM Plex Sans", "Noto Sans TC", "Noto Sans KR", "PingFang TC", "Microsoft JhengHei", "Apple SD Gothic Neo", "Malgun Gothic", sans-serif;
    --font-mono: "IBM Plex Mono", "Cascadia Mono", Consolas, monospace;
    --display-font: var(--font-sans);
    --body-font: var(--font-sans);
    --ui-font: var(--font-sans);
    --mono-font: var(--font-mono);
    --ink: var(--text);
    /* Site style standards: one reading cap for running text (paragraphs and lists only). */
    --measure: 840px;
    /* Aliases kept for one release; use --measure. */
    --reading-width: var(--measure);
    --measure-wide: var(--measure);
    --rule: 1px solid var(--border);
    --rule-strong: 2px solid var(--panel);
    --control-height: 40px;
    --action-interactive: #0b6fb3;
    --danger: #a83232;
    /* Spacing scale: the only four gaps on the site. XS inside a component, S text to text,
       M block to block (and page header to content), L section to section. */
    --gap-xs: 8px;
    --gap-s: 16px;
    --gap-m: 32px;
    --gap-l: 56px;
    /* Old spacing steps, mapped onto the scale; retire after one release. */
    --space-1: var(--gap-xs);
    --space-2: var(--gap-xs);
    --space-3: var(--gap-s);
    --space-4: var(--gap-m);
    --space-5: var(--gap-m);
    --space-6: var(--gap-l);
    /* Type roles not covered by --type-h1 ... --type-code above. */
    --type-h4: 16px;
    --type-quote: 18px;
    --type-caption: var(--type-small);
    --leading-body: 1.7;
    --leading-lead: 1.6;
    --rail-quote: 4px solid var(--signal);
    --surface-placeholder: var(--surface-muted);
}

/* Actions and controls */

.action,
.action-state {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: var(--control-height);
    padding: 0.5rem 0.875rem;
    border: 1px solid var(--panel);
    border-radius: 0;
    background: var(--surface);
    color: var(--panel);
    cursor: pointer;
    font-family: var(--ui-font);
    font-size: 0.88rem;
    font-weight: 600;
    line-height: 1.2;
    text-align: center;
    text-decoration: none;
}

.action:hover,
.action:focus-visible {
    text-decoration: none;
}

.action--primary {
    border-color: var(--panel);
    background: var(--panel);
    color: var(--panel-text);
}

.action--primary:hover,
.action--primary:focus-visible {
    border-color: var(--link);
    background: var(--link);
    color: #fff;
}

.action--secondary:hover,
.action--secondary:focus-visible {
    border-color: var(--action-interactive);
    color: var(--action-interactive);
}

.action--danger {
    border-color: var(--danger);
    color: var(--danger);
}

.action--danger:hover,
.action--danger:focus-visible {
    border-color: var(--danger);
    background: var(--danger);
    color: #fff;
}

.action--compact {
    min-height: 36px;
    padding: 0.38rem 0.7rem;
    font-size: 0.82rem;
}

.action:disabled,
.action[aria-disabled="true"],
.action-state {
    border-color: var(--border);
    background: var(--surface-muted);
    color: var(--muted);
    cursor: not-allowed;
}

.action-group {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.625rem;
}

.action-group--separated {
    justify-content: space-between;
}

.text-action {
    display: inline-flex;
    align-items: center;
    min-height: var(--control-height);
    color: var(--text);
    font-family: var(--ui-font);
    font-weight: 600;
    text-decoration: none;
    text-underline-offset: 0.2em;
}

.text-action:hover,
.text-action:focus-visible {
    color: var(--action-interactive);
    text-decoration: underline;
    text-decoration-thickness: 2px;
}

.action-state__detail {
    margin-left: 0.35rem;
    font-weight: 400;
}

.action-state {
    cursor: default;
}

.resource-row__actions > * {
    white-space: nowrap;
}

.text-action__detail {
    margin-left: 0.25rem;
    font-size: 0.8rem;
    font-weight: 400;
}

.pagination__status {
    color: var(--muted);
    font-family: var(--mono-font);
    font-size: 0.78rem;
    font-variant-numeric: tabular-nums;
}

@media (forced-colors: active) {
    .action,
    .action-state {
        border: 1px solid ButtonText;
    }

    .action--primary {
        background: ButtonText;
        color: ButtonFace;
    }

    .action:disabled,
    .action[aria-disabled="true"],
    .action-state {
        border-color: GrayText;
        color: GrayText;
    }
}

html {
    font-family: var(--font-sans);
    font-synthesis: none;
    text-rendering: optimizeLegibility;
}

body {
    font-family: var(--font-sans);
    font-size: var(--type-body);
    line-height: var(--leading-body);
}

button,
input,
select,
textarea {
    font-family: var(--ui-font);
}

strong,
b {
    font-weight: 600;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    color: var(--text);
    font-family: var(--display-font);
    font-weight: 600;
    letter-spacing: -0.018em;
    text-wrap: balance;
}

h1 {
    font-size: var(--type-h1);
    line-height: 1.15;
}

h2 {
    font-size: var(--type-h2);
    line-height: 1.25;
}

h3 {
    font-size: var(--type-h3);
    line-height: 1.35;
}

h4 {
    font-size: var(--type-h4);
    line-height: 1.4;
}

h5,
h6 {
    line-height: 1.3;
}

p,
li,
dd {
    hanging-punctuation: first last;
}

a {
    text-decoration-thickness: 1px;
    text-underline-offset: 0.18em;
}

a:hover {
    text-decoration-thickness: 2px;
}

.site-name,
.page-title,
.section-breadcrumb-title h1,
.home-hero h1,
.team-profile-heading h1 {
    font-weight: 600;
}

.page-title,
.section-breadcrumb-title h1 {
    letter-spacing: -0.032em;
}

.page-title > a,
.page-title > span[aria-hidden="true"],
.section-breadcrumb-title li:not(:last-child),
.page-kicker,
.home-hero__eyebrow,
.home-pathway__role,
.metadata,
.record-meta,
.news-feed-meta,
.home-current-work__meta,
.training-video-meta,
.training-resource-meta,
.resource-row__metadata {
    font-family: var(--mono-font);
}

.section-breadcrumb-title li:not(:last-child),
.page-title > a,
.page-title > span[aria-hidden="true"] {
    font-weight: 600;
}

/* One column. Inside page content only the page title and each section h2 (with its rule) run the
   full width. Every other block -- paragraphs, lists, ledes, ledgers, decks, citation boxes, figures,
   tables, video and the video band -- shares one column capped at --measure, so all of them have the
   same left and right edge. Rule 1 caps direct children of .document-content (tutorial chapters have
   no sections); rule 2 caps the children of any section or h2 container (about-page sections wrap
   their h2 in a div; news rich text carries its own h2s). Add .wide to one figure or table to let it
   break out to the full width. */
.document-content > :not(section, h1, h2, .page-title, .wide):not(:has(> h2)),
.document-content :is(section, :has(> h2)) > :not(h2, .wide):not(:has(> h2)) {
    max-width: var(--measure);
}

.wide {
    max-width: none;
}

.page-intro,
.downloads-intro,
.audit-intro,
.research-approaches__shared-introduction,
.research-streams__shared-introduction {
    max-width: var(--measure);
    font-size: 1.05rem;
    line-height: 1.68;
}

.document-content section {
    margin-bottom: var(--gap-l);
}

.document-content h2,
.team-profile section h3,
.training-detail__section > h2 {
    margin-bottom: var(--gap-s);
    padding-bottom: 0.65rem;
    border-bottom: var(--rule);
}

.document-content h2::after,
.team-profile section h3::after,
.training-detail__section > h2::after {
    display: block;
    width: 3rem;
    height: 3px;
    margin-top: 0.65rem;
    background: var(--signal);
    content: "";
}

/* Collection controls */

.index-filter-panel {
    display: grid;
    gap: 0;
    margin-bottom: var(--space-5);
    padding: 0;
    border-top: var(--rule-strong);
    border-bottom: var(--rule);
    background: var(--surface);
}

.filter-bar,
.filter-select-form {
    min-height: 54px;
    gap: 0.55rem;
    margin: 0;
    padding: 0.45rem 0.75rem;
}

.index-filter-panel > * + * {
    border-top: var(--rule);
}

.index-filter-panel > .active-filter {
    min-height: 54px;
    gap: 0.55rem;
    margin: 0;
    padding: 0.45rem 0.75rem;
    border-top: var(--rule);
}

.active-filter__clear {
    margin-left: 0.2rem;
    font-family: var(--ui-font);
    font-size: 0.82rem;
}

/* Lab Connections record context on the Publications index: Sans text, underlined links. */
.index-filter-panel > .active-filter--context {
    color: var(--text);
    font-family: var(--ui-font);
    font-size: var(--type-small);
}

.index-filter-panel > .active-filter--context a {
    font-size: inherit;
    text-decoration: underline;
    text-underline-offset: 2px;
}

.filter-label,
.audit-filter-label,
.audit-filter-chip,
.filter-chip,
.filter-count,
.filter-select,
.active-filter {
    font-family: var(--mono-font);
}

.filter-label,
.audit-filter-label {
    min-width: 5.5rem;
    margin-right: 0.2rem;
    color: var(--muted);
    font-size: 0.75rem;
    font-weight: 600;
    letter-spacing: 0.065em;
}

/* Chips: square, Plex Mono 12px. Only a chip that is a link keeps the 36px tap height. */
.filter-chip,
.audit-filter-chip,
.descriptor-chip,
.country-chip,
.tag-list li {
    padding: 4px 10px;
    border: 1px solid var(--border-strong);
    border-radius: 0;
    background: transparent;
    font-family: var(--mono-font);
    font-size: var(--type-label);
    line-height: 1.25;
}

a.filter-chip,
a.audit-filter-chip,
a.descriptor-chip {
    min-height: 36px;
}

.filter-chip:hover,
.audit-filter-chip:hover,
.descriptor-chip:hover {
    border-color: var(--link);
    background: var(--link-soft);
    color: var(--link);
    text-decoration: none;
}

.filter-chip--active,
.audit-filter-chip--active {
    border-color: var(--panel);
    background: var(--panel);
    box-shadow: inset 0 calc(-1 * var(--signal-rail-block)) 0 var(--signal);
    color: var(--panel-text);
    font-weight: 600;
}

.filter-chip--active:hover,
.audit-filter-chip--active:hover {
    border-color: var(--panel);
    background: var(--panel);
    color: var(--panel-text);
}

.filter-count {
    min-width: 1.55rem;
    margin-left: 0.45rem;
    padding: 0.12rem 0.35rem;
    border-radius: 0;
    background: var(--surface-strong);
    color: var(--text);
    font-size: 0.75rem;
    font-variant-numeric: tabular-nums;
}

.filter-chip--active .filter-count {
    background: var(--signal);
    color: var(--panel);
}

.filter-select,
.filter-select,
.nk-page-shell input,
.nk-page-shell select,
.nk-page-shell textarea,
.resource-filter-field input,
.resource-filter-field select,
.resource-edit-form input,
.resource-edit-form select,
.resource-edit-form textarea {
    border-radius: 0;
}

/* Candidate A forms: shared field anatomy, contextual density. */

.form-region {
    min-width: 0;
    padding: clamp(1rem, 3vw, 1.75rem);
    border: 0;
    border-top: var(--rule-strong);
    border-bottom: var(--rule);
    border-radius: 0;
    background: var(--surface);
}

.form-region--narrow { max-width: 720px; }
.auth-container { width: min(460px, 100%); margin: 30px auto; }
.auth-intro, .auth-footer { color: var(--muted); }
.auth-footer { margin-top: 1.5rem; font-size: 0.9rem; }
.field-stack { display: grid; gap: 1.5rem; }
.field-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr)); gap: 1rem; }
.field, .field-group { min-width: 0; margin: 0; padding: 0; border: 0; }
.field { display: grid; align-content: start; gap: 0.4rem; }
.field-group { display: block; }
.field__label, .form-region .field__label {
    display: block;
    width: 100%;
    margin: 0;
    padding: 0;
    color: var(--text);
    font-family: var(--ui-font);
    font-size: 0.9rem;
    font-weight: 600;
    letter-spacing: normal;
    text-transform: none;
}
.field__requirement {
    display: inline-block;
    margin-left: 0.5rem;
    color: var(--muted);
    font-family: var(--mono-font);
    font-size: 0.7rem;
    font-weight: 400;
}
.field__help, .form-region .field__help {
    margin: 0;
    color: var(--muted);
    font-size: 0.85rem;
    line-height: 1.5;
    overflow-wrap: anywhere;
}
.field__error, .form-region .field__error {
    margin: 0;
    padding: 0;
    list-style: none;
    color: var(--danger);
    font-size: 0.85rem;
    overflow-wrap: anywhere;
}
.field input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]),
.field select, .field textarea,
.form-region .field input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]),
.form-region .field select, .form-region .field textarea,
.filter-select {
    box-sizing: border-box;
    width: 100%;
    min-width: 0;
    max-width: 100%;
    min-height: 44px;
    margin: 0;
    padding: 0.55rem 0.7rem;
    border: 1px solid var(--muted);
    border-radius: 0;
    background: var(--surface);
    color: var(--text);
    box-shadow: none;
    font-family: var(--ui-font);
    font-size: 1rem;
    line-height: 1.4;
}
.filter-select { width: auto; }
.field textarea { min-height: 8rem; resize: vertical; }
.field input[type="checkbox"], .field input[type="radio"] {
    width: 1.15rem;
    height: 1.15rem;
    margin: 0 0.5rem 0 0;
    accent-color: var(--panel);
}
.field-group > div > div > label { display: flex; align-items: center; min-height: 44px; font-weight: 400; }
.field input:focus, .field select:focus, .field textarea:focus, .filter-select:focus {
    outline: 3px solid var(--link);
    outline-offset: 3px;
}
.field [aria-invalid="true"], .form-region .field [aria-invalid="true"] {
    border-color: var(--danger);
    border-left-width: 4px;
}
.field input:disabled, .field select:disabled, .field textarea:disabled {
    background: var(--surface-muted);
    color: var(--muted);
    cursor: not-allowed;
}
.validation-summary {
    margin: 0 0 1.5rem;
    padding: 0.8rem 1rem;
    border-top: 3px solid var(--danger);
    border-bottom: 1px solid var(--danger);
    background: #fff5f3;
    color: var(--danger);
    overflow-wrap: anywhere;
}
.validation-summary p { margin: 0; }
.validation-summary ul { margin: 0.4rem 0 0; padding-left: 1.25rem; }
.validation-summary a { color: inherit; text-decoration: underline; }
.form-actions, .form-submit { margin-top: 1.5rem; }
.form-workbench-layout { display: grid; grid-template-columns: minmax(240px, 0.7fr) minmax(0, 1.3fr); gap: 1.5rem; align-items: start; }
.form-region.article-search-form { display: grid; gap: 1rem; border-radius: 0; }
.form-region .search-grid { grid-template-columns: repeat(auto-fit, minmax(min(100%, 180px), 1fr)); align-items: start; }
.form-region .query-builder { display: grid; gap: 1rem; padding: 0; border: 0; border-radius: 0; background: transparent; }
.form-region .rule-group { display: grid; gap: 1rem; }
.form-region .rule-row {
    display: grid;
    gap: 0.75rem;
    align-items: end;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    padding: 1rem 0;
    border: 0;
    border-top: var(--rule);
    border-radius: 0;
}
.form-region .rule-row > .action { justify-self: start; }
.form-region .boolean-query-input { font-family: var(--mono-font); }
@media (max-width: 700px) {
    .form-workbench-layout, .form-region .rule-row, .form-region .search-grid, .field-grid { grid-template-columns: minmax(0, 1fr); }
    .form-region .rule-row:first-child .rule-combinator { display: none; }
}
@media (forced-colors: active) {
    .validation-summary { border-color: CanvasText; background: Canvas; color: CanvasText; }
    .field [aria-invalid="true"], .form-region .field [aria-invalid="true"] { border-color: CanvasText; }
    .field__error, .form-region .field__error { color: CanvasText; }
    .field input:focus, .field select:focus, .field textarea:focus, .filter-select:focus { outline-color: Highlight; }
}

/* Ruled feedback: explicit text carries the state; color reinforces it. */
:root {
    --feedback-info: #0b6fb3;
    --feedback-warning: #825b08;
    --feedback-success: #286141;
}
.feedback {
    --feedback-color: var(--feedback-info);
    margin: 1rem 0;
    padding: 1rem 1.25rem;
    border: 0;
    border-top: 3px solid var(--feedback-color);
    border-bottom: var(--rule);
    border-radius: 0;
    background: var(--surface);
    color: var(--text);
    overflow-wrap: anywhere;
}
.feedback--warning, .feedback--stale { --feedback-color: var(--feedback-warning); }
.feedback--error { --feedback-color: var(--danger); }
.feedback--success { --feedback-color: var(--feedback-success); }
.feedback--empty, .feedback--access, .feedback--unavailable { --feedback-color: var(--muted); }
.feedback--compact { padding: 0.6rem 0.8rem; font-size: 0.9rem; }
.feedback .feedback__label {
    display: block;
    margin: 0 0 0.4rem;
    color: var(--feedback-color);
    font-family: var(--mono-font);
    font-size: 0.75rem;
    font-weight: 600;
    letter-spacing: 0.04em;
}
.feedback p { margin: 0; }
.feedback p + p { margin-top: 0.4rem; }
.feedback__actions { margin-top: 0.75rem; }
.feedback[hidden] { display: none; }
@media (forced-colors: active) {
    .feedback { border-color: CanvasText; background: Canvas; color: CanvasText; }
    .feedback .feedback__label { color: CanvasText; }
}

/* Borderless indexes and relation lists */

.section-heading,
.resource-section__heading,
.audit-family__heading {
    margin: 0;
    padding: 0.65rem 0.75rem;
    border-top: var(--rule-strong);
    border-bottom: var(--rule);
    background: var(--surface-strong);
    font-family: var(--mono-font);
    font-size: 0.75rem;
    font-weight: 600;
    letter-spacing: 0.07em;
    line-height: 1.35;
    text-transform: uppercase;
}

.record-list,
.training-video-list,
.training-resource-list,
.news-feed,
.research-stream-list,
.resource-index,
.audit-rule-index {
    border-top: 0;
    border-bottom: var(--rule);
}

.record-row,
.training-video-row,
.training-resource-row,
.news-feed-row,
.research-stream-row,
.resource-row,
.audit-rule-row {
    position: relative;
    padding: 1.35rem 0.75rem;
    border-bottom: var(--rule);
    background: transparent;
}

.record-row:hover,
.training-video-row:hover,
.training-resource-row:hover,
.news-feed-row:hover,
.research-stream-row:hover,
.resource-row:hover,
.audit-rule-row:hover,
.record-row:focus-within,
.training-video-row:focus-within,
.training-resource-row:focus-within,
.news-feed-row:focus-within,
.research-stream-row:focus-within,
.resource-row:focus-within,
.audit-rule-row:focus-within {
    background: var(--surface);
    box-shadow: inset var(--signal-rail-inline) 0 0 var(--signal);
}

.record-title,
.training-video-title,
.training-resource-title,
.news-feed-title,
.resource-row__title,
.research-stream-row h2 {
    margin: 0 0 0.45rem;
    font-size: 1.15rem;
    font-weight: 600;
    line-height: 1.3;
}

.record-title a,
.training-video-title a,
.training-resource-title a,
.news-feed-title a,
.resource-row__title a,
.research-stream-title a {
    color: var(--text);
    text-decoration: none;
}

.record-row:hover .record-title a,
.training-video-row:hover .training-video-title a,
.training-resource-row:hover .training-resource-title a,
.news-feed-row:hover .news-feed-title a,
.research-stream-row:hover .research-stream-title a,
.resource-row:hover .resource-row__title a,
.record-row:focus-within .record-title a,
.training-video-row:focus-within .training-video-title a,
.training-resource-row:focus-within .training-resource-title a,
.news-feed-row:focus-within .news-feed-title a,
.research-stream-row:focus-within .research-stream-title a,
.resource-row:focus-within .resource-row__title a,
.record-title a:hover,
.training-video-title a:hover,
.training-resource-title a:hover,
.news-feed-title a:hover,
.resource-row__title a:hover,
.research-stream-title a:hover,
.record-title a:focus-visible,
.training-video-title a:focus-visible,
.training-resource-title a:focus-visible,
.news-feed-title a:focus-visible,
.resource-row__title a:focus-visible,
.research-stream-title a:focus-visible {
    color: var(--link);
    text-decoration: underline;
    text-decoration-thickness: 2px;
    text-underline-offset: 0.2em;
}

.record-summary,
.training-video-summary,
.training-resource-summary,
.news-feed-summary,
.database-record__summary,
.resource-row__description,
.research-stream-summary {
    max-width: var(--measure);
    margin: 0;
    line-height: var(--leading-body);
}

.research-stream-summary p {
    margin: 0;
}

.research-stream-summary p + p {
    margin-top: 0.7rem;
}

/* Editorial detail decks: hierarchy without reusing the interactive cyan rail. */

.detail-deck {
    margin: 0 0 var(--gap-m);
    padding: 1rem 0.85rem 1.1rem;
    border-top: var(--rule-strong);
    border-bottom: var(--rule);
    background: var(--surface);
}

.detail-deck__meta {
    margin: 0;
    color: var(--muted);
    font-family: var(--mono-font);
    font-weight: 400;
    letter-spacing: 0.015em;
    line-height: 1.5;
}

.detail-deck__meta time {
    color: var(--text);
    font-weight: 600;
}

.detail-deck__meta a {
    font-weight: 600;
}

.detail-deck__summary {
    max-width: var(--measure);
    margin: 0.75rem 0 0;
    color: var(--text);
    font-size: clamp(1.05rem, 1.5vw, 1.18rem);
    line-height: var(--leading-lead);
}

.detail-deck__descriptors {
    margin-top: 1rem;
    padding-top: 0.85rem;
    border-top: var(--rule);
}

.database-record__heading {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: baseline;
    gap: 1rem;
}

.database-record__heading .record-title {
    margin: 0;
}

.database-record__heading .database-record__actions {
    justify-content: flex-end;
    gap: 0.55rem 1rem;
    margin: 0;
    padding: 0;
    border: 0;
    font-family: var(--mono-font);
    font-size: 0.75rem;
    letter-spacing: 0.02em;
}

/* Mission statements remain editable text, presented as compact dossiers. */

#mission .about-section-items {
    gap: 1px;
    padding: 1px;
    border-left: var(--signal-rail-inline) solid var(--signal);
    background: var(--border-strong);
    counter-reset: mission-statement;
}

#mission .about-section-item {
    min-height: 12rem;
    padding: 1.35rem 1.4rem 1.5rem;
    border: 0;
    background: var(--surface);
    counter-increment: mission-statement;
}

#mission .about-section-item::before {
    display: block;
    margin-bottom: 0.85rem;
    color: var(--signal-amber);
    content: "MISSION 0" counter(mission-statement);
    font-family: var(--mono-font);
    font-size: 0.72rem;
    font-weight: 600;
    letter-spacing: 0.08em;
}

#mission .about-section-item h3 {
    max-width: 26ch;
    margin-bottom: 0.8rem;
    font-size: 1.18rem;
    line-height: 1.28;
}

#mission .about-section-item ul {
    margin-bottom: 0;
}

#mission .about-section-item li::marker {
    color: var(--link);
}

.record-meta,
.metadata,
.training-video-meta,
.training-resource-meta,
.news-feed-meta,
.resource-row__metadata {
    color: var(--muted);
    letter-spacing: 0.005em;
}

.linked-record-list,
.resource-list,
.team-profile-list,
.training-material-list,
.training-offering-list {
    gap: 0;
    max-width: var(--measure);
    margin: 0;
    padding-left: 1.35rem;
}

.linked-record-list li,
.resource-list li,
.team-profile-list li,
.training-material-list li,
.training-offering-list li {
    padding: 0.45rem 0 0.45rem 0.25rem;
}

/* Shared label-and-value ledger for labsite detail pages. */
.relationship-ledger {
    display: grid;
    gap: 2px;
    margin: 0 0 var(--gap-m);
    container-type: inline-size;
}

.relationship-ledger__row {
    display: grid;
    grid-template-columns: 180px minmax(0, 1fr);
    gap: 2px;
    min-width: 0;
}

.relationship-ledger__row dt,
.relationship-ledger__row dd {
    min-width: 0;
    margin: 0;
}

.relationship-ledger__row dt {
    padding: 10px 12px;
    background: var(--surface-strong);
    color: var(--text);
    font-family: var(--mono-font);
    font-size: var(--type-label);
    font-weight: var(--weight-semibold);
    letter-spacing: 0.06em;
    line-height: 1.45;
    text-transform: uppercase;
}

.relationship-ledger__row dd {
    padding: 10px 12px;
    background: var(--surface);
    font-size: var(--type-body);
    overflow-wrap: anywhere;
}

.relationship-ledger__items {
    margin: 0;
    padding: 0;
    list-style: none;
}

.relationship-ledger__items li + li {
    margin-top: 0.38rem;
}

.relationship-ledger__empty,
.content-empty {
    color: var(--muted);
    font-size: var(--type-small);
    font-style: italic;
}

.content-empty {
    margin: 1rem 0;
}

.content-empty .feedback__label {
    margin-right: 0.35em;
}

@container (max-width: 559px) {
    .relationship-ledger__row {
        grid-template-columns: minmax(0, 1fr);
    }
}

.database-record__summary--pending {
    color: var(--muted);
    font-style: italic;
}

/* Database navigation is an instrument panel. */

.explore-sidebar {
    padding: 1rem;
    border: 0;
    border-top: 4px solid var(--signal);
    background: var(--panel);
    color: var(--panel-text);
}

.explore-sidebar__title {
    margin-bottom: 0.65rem;
    color: var(--signal);
    font-family: var(--mono-font);
    font-size: 0.75rem;
    font-weight: 600;
    letter-spacing: 0.08em;
}

.explore-sidebar nav {
    gap: 0;
}

.explore-sidebar a,
.explore-sidebar__disabled {
    display: block;
    padding: 0.55rem 0.65rem;
    border-left: var(--signal-rail-inline) solid transparent;
    color: var(--panel-muted);
    font-family: var(--ui-font);
    font-size: 0.86rem;
    line-height: 1.35;
}

.explore-sidebar a:hover,
.explore-sidebar a[aria-current="page"] {
    border-left-color: var(--signal);
    background: var(--panel-secondary);
    color: var(--panel-text);
    text-decoration: none;
}

.explore-sidebar a[aria-current="page"] {
    color: var(--signal);
    font-weight: 600;
}

/* Type-scale size utilities: use instead of inline font-size declarations. */
.type-size-h3 { font-size: var(--type-h3); }
.type-size-small { font-size: var(--type-small); }
.type-size-code { font-size: var(--type-code); }

/* Documentary citations */

.publication-citation-box,
.database-citation {
    margin: var(--gap-m) 0;
    padding: 1.1rem 1.25rem;
    border: var(--rule);
    border-left: 6px solid var(--signal-amber);
    background: var(--surface);
    color: var(--text);
    font-size: 0.98rem;
    line-height: 1.65;
}

.publication-record-row .publication-citation {
    max-width: var(--measure-wide);
    margin: 0.35rem 0 0;
    color: var(--muted);
    font-size: var(--type-small);
    line-height: 1.55;
}

.publication-record-row .publication-citation a {
    color: inherit;
    text-decoration-color: var(--border-strong);
}

/* Shared text-row anatomy for Publications, Grants, and Streams indexes. */
.index-text-row {
    padding: 1.25rem 0.75rem;
}

.index-text-row .record-title,
.index-text-row .research-stream-title {
    margin: 0 0 0.35rem;
    font-size: var(--type-h3);
    line-height: 1.35;
}

.index-text-row__meta {
    margin: 0 0 0.4rem;
    color: var(--muted);
    font-family: var(--mono-font);
    font-size: var(--type-label);
    line-height: 1.55;
}

.index-text-row .index-text-row__summary {
    display: -webkit-box;
    max-width: var(--measure-wide);
    margin: 0;
    overflow: hidden;
    color: var(--muted);
    font-size: var(--type-small);
    line-height: 1.55;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.index-text-row .index-text-row__facets {
    margin-top: 0.75rem;
}

/* Tables and structured data */

.table-wrapper,
.table-scroll,
.nk-table-scroll {
    overflow-x: auto;
    background: var(--surface);
    max-width: 100%;
    min-width: 0;
}

table {
    width: 100%;
    border-collapse: collapse;
    background: var(--surface);
    border-top: 2px solid var(--panel);
}

table caption {
    padding: 0.75rem;
    color: var(--muted);
    font-family: var(--mono-font);
    font-size: 0.75rem;
    font-weight: 600;
    letter-spacing: 0.06em;
    text-align: left;
    text-transform: uppercase;
}

table thead th {
    padding: 0.7rem 0.75rem;
    border-right: 0;
    border-bottom: var(--rule);
    background: var(--surface);
    color: var(--text);
    font-family: var(--mono-font);
    font-size: 0.75rem;
    font-weight: 600;
    letter-spacing: 0.045em;
    line-height: 1.35;
    text-align: left;
    text-transform: none;
    vertical-align: bottom;
    overflow-wrap: anywhere;
}

table tbody th,
table tbody td {
    padding: 0.72rem 0.75rem;
    border-bottom: var(--rule);
    text-align: left;
    vertical-align: top;
    overflow-wrap: anywhere;
    border-left: 0;
    border-right: 0;
}

table.resource-table {
    min-width: 40rem;
}

.nk-data-table.table--compact {
    min-width: 36rem;
}

table.table--compact th,
table.table--compact td {
    padding: 0.5rem 0.65rem;
    min-width: 6rem;
}

table .table-number {
    text-align: right;
    font-variant-numeric: tabular-nums;
}

.collection-result-summary {
    margin: 1rem 0;
}

.pagination,
.pagination-actions,
.nk-enterprise-pagination {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-start;
    gap: 0.75rem;
    margin: 1rem 0;
}

.resource-detail-row dt {
    font-family: var(--mono-font);
    font-size: 0.75rem;
    font-weight: 600;
    letter-spacing: 0.045em;
    text-transform: uppercase;
}

/* Panels: calm editorial surfaces with concentrated instrument zones. */

.card,
.team-card,
.content-card,
.empty-message,
.preview-notice,
.downloads-access-note,
.approach-section-item,
.nk-panel,
.team-profile-photo,
.profile-photo,
.approach-figure img {
    border-radius: 0;
}

.card,
.team-card,
.content-card,
.empty-message,
.approach-section-item,
.nk-panel {
    border: var(--rule);
    border-top: 3px solid var(--panel);
    background: var(--surface);
    box-shadow: none;
}

/* Team portraits remain a distinct editorial system, not panel cards. */
.team-card {
    border: 0;
    background: transparent;
}

.team-related-list {
    max-width: none;
    margin: 0;
    padding: 0;
    border-top: var(--rule);
    list-style: none;
}

.team-related-list li {
    padding: 0.9rem 0;
    border-bottom: var(--rule);
}

/* Team portraits are an editorial roster, not bordered content cards. */

.team-card {
    border: 0;
    background: transparent;
}

.team-profile-heading h1 {
    font-weight: 600;
}

.team-profile-list,
.team-related-list {
    gap: 0;
    max-width: var(--measure-wide);
    margin: 0;
    padding: 0;
    list-style: none;
}

.team-profile-list li,
.team-related-list li {
    padding: 0.9rem 0;
}

/* DEC-301 keeps Education as a compact, unruled list. */
.team-profile-list--education {
    gap: 0.75rem;
    border: 0;
}

.team-profile-list--education li {
    padding: 0;
    border: 0;
}

.preview-notice,
.downloads-access-note {
    border-left: 6px solid var(--signal-amber);
    background: var(--surface);
}

.resource-filter-form,
.audit-filter-bar {
    padding: 1rem;
    border: 0;
    border-top: 4px solid var(--signal);
    background: var(--panel);
    color: var(--panel-text);
}

.resource-filter-form label,
.audit-filter-bar .audit-filter-label {
    color: var(--panel-muted);
    font-family: var(--mono-font);
    font-size: 0.75rem;
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.audit-filter-bar .audit-filter-chip {
    border-color: var(--panel-muted);
    color: var(--panel-muted);
}

.audit-filter-bar .audit-filter-chip--active {
    border-color: var(--signal);
    background: var(--signal);
    color: var(--panel);
    box-shadow: inset 0 calc(-1 * var(--signal-rail-block)) 0 var(--panel-secondary);
}

.schema-sidebar {
    border-right-color: var(--panel-secondary);
    background: var(--panel);
    color: var(--panel-text);
}

.schema-sidebar a,
.schema-menu-heading {
    color: var(--panel-muted);
}

.schema-menu-heading {
    font-family: var(--mono-font);
    font-size: 0.75rem;
    font-weight: 600;
    letter-spacing: 0.07em;
}

.schema-menu a {
    border-left: var(--signal-rail-inline) solid transparent;
    border-radius: 0;
}

.schema-menu a:hover,
.schema-menu a[aria-current="page"] {
    border-left-color: var(--signal);
    background: var(--panel-secondary);
    color: var(--panel-text);
}

.schema-menu a[aria-current="page"] {
    color: var(--signal);
}

.audit-rule-id,
.audit-count,
.nk-official-list-id,
.nk-roster-entry-dates,
.resource-result-count {
    font-family: var(--mono-font);
    font-variant-numeric: tabular-nums;
}

.audit-rule-id {
    font-size: 0.78rem;
}

.audit-rule-header {
    padding-inline: 0.75rem;
    border-bottom: 2px solid var(--signal);
    background: var(--panel);
    color: var(--panel-text);
    font-family: var(--mono-font);
}

@media (max-width: 760px) {
    .explore-layout {
        gap: var(--space-5);
    }

    .explore-sidebar {
        position: static;
    }

    .explore-sidebar nav {
        gap: 1px;
    }

    .filter-bar,
    .filter-select-form {
        align-items: flex-start;
        padding: 0.75rem;
    }

    .filter-label {
        flex: 1 0 100%;
        min-width: 0;
    }

    .filter-stack > .active-filter {
        align-items: flex-start;
        padding: 0.75rem;
    }

    .database-record__heading {
        grid-template-columns: minmax(0, 1fr);
        gap: 0.65rem;
    }

    .database-record__heading .database-record__actions {
        justify-content: flex-start;
    }

    .record-row,
    .training-video-row,
    .training-resource-row,
    .news-feed-row,
    .research-stream-row,
    .resource-row,
    .audit-rule-row {
        padding-inline: 0.55rem;
    }

    .document-content {
        font-size: 1rem;
    }
}

/* Database workbenches: DEC-190 ruled workspaces. */

.explore-workspace,
.nk-browser-page {
    min-width: 0;
    border-top: 4px solid var(--panel);
    background: var(--surface);
}

.explore-heading,
.nk-browser-header {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    justify-content: space-between;
    gap: var(--space-4);
    margin: 0;
    padding: var(--space-4) var(--space-4) var(--space-3);
    border-bottom: var(--rule);
    background: var(--surface);
}

.explore-heading h2,
.nk-browser-header h2,
.nk-browser-header h1 {
    margin: 0 0 0.25rem;
}

.nk-browser-body {
    background: var(--surface);
}

.nk-browser-tree,
.nk-browser-detail,
.nk-enterprise-directory-body {
    background: var(--surface);
}

.nk-browser-tree {
    border-right: var(--rule);
}

.nk-browser-detail,
.nk-enterprise-directory-body {
    padding: var(--space-4);
}

.nk-tree-toolbar,
.nk-official-search,
.nk-enterprise-search,
.resource-filter-form {
    border-bottom: var(--rule);
}

.nk-tree-toolbar,
.nk-browser-panel-header {
    margin-bottom: var(--space-3);
}

.nk-page-shell summary,
.workbench-tree-summary,
.transition-tree-summary {
    border-radius: 0;
}

.workbench-tree-summary,
.transition-tree-summary {
    border-left: var(--signal-rail-inline) solid transparent;
}

.workbench-tree-summary.is-selected,
.transition-tree-summary.selected-tree-org,
summary.selected-tree-org {
    padding: 0.35rem 0.45rem;
    border-left-color: var(--signal);
    background: var(--surface-strong);
    color: var(--text);
    font-weight: 600;
}

.workbench-id,
.workbench-tree-count,
.workbench-tree-label,
.workbench-date,
.workbench-count,
.workbench-row__label {
    color: var(--muted);
    font-family: var(--mono-font);
    font-size: 0.78rem;
    font-variant-numeric: tabular-nums;
}

.workbench-id {
    margin-left: 0.4rem;
}

.workbench-warning {
    color: var(--danger);
}

.workbench-section {
    padding: var(--space-4) 0;
    border-bottom: var(--rule);
}

.workbench-section:first-child {
    padding-top: 0;
}

.workbench-section:last-child {
    border-bottom: 0;
}

.workbench-section__heading,
.workbench-record-heading {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: var(--space-3);
    align-items: center;
}

.workbench-section__heading {
    margin-bottom: var(--space-3);
}

.workbench-section__heading h2 {
    margin: 0;
    font-size: 1.05rem;
}

.workbench-record-heading {
    grid-template-columns: minmax(0, 1fr) auto auto;
}

.workbench-record-heading__title {
    font-size: 1.15rem;
    font-weight: 600;
}

.workbench-column-labels,
.workbench-row--count {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(4rem, auto);
    gap: var(--space-3);
}

.workbench-column-labels {
    padding: 0.45rem 0;
    border-bottom: 2px solid var(--panel);
    color: var(--muted);
    font-family: var(--mono-font);
    font-size: 0.75rem;
    font-weight: 600;
}

.workbench-rows {
    margin: 0;
    padding: 0;
    list-style: none;
}

.workbench-row {
    padding: 0.75rem 0;
    border-bottom: var(--rule);
}

.workbench-row:last-child {
    border-bottom: 0;
}

.workbench-row--relation {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto auto;
    gap: var(--space-3);
    align-items: baseline;
}

.workbench-transition-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr) auto;
    gap: var(--space-4);
    align-items: start;
}

.workbench-row__label {
    display: block;
    margin-bottom: 0.35rem;
    font-weight: 600;
}

.workbench-row__action {
    justify-self: end;
    white-space: nowrap;
}

.workbench-empty {
    color: var(--muted);
}

.nk-official-list a,
.nk-roster-entry-list a,
.nk-enterprise-card {
    border-left: var(--signal-rail-inline) solid transparent;
    border-radius: 0;
}

.nk-official-list a:hover,
.nk-official-list a.is-selected,
.nk-roster-entry-list a:hover,
.nk-roster-entry-list a.is-selected,
.nk-enterprise-card:hover,
.nk-enterprise-card:focus-visible {
    border-left-color: var(--signal);
    background: var(--surface-strong);
    box-shadow: none;
}

.nk-enterprise-list {
    display: block;
    border-top: 2px solid var(--panel);
}

.nk-enterprise-list > li,
.article-result,
.document-result {
    border: 0;
    border-bottom: var(--rule);
}

.nk-enterprise-card {
    height: auto;
    padding: var(--space-3);
    border-top: 0;
    border-right: 0;
    border-bottom: 0;
}

.nk-enterprise-card__header {
    padding-bottom: var(--space-2);
}

.article-results,
.document-results {
    display: grid;
    gap: 0;
    margin-top: var(--space-3);
    border-top: 2px solid var(--panel);
}

.article-result,
.document-result {
    padding: var(--space-3) var(--space-2);
    border-radius: 0;
    background: var(--surface);
}

.resource-detail-list,
.resource-field-summary {
    margin: 0 var(--space-4) var(--space-4);
}

.resource-detail-list {
    border-top: 2px solid var(--panel);
}

.resource-detail-row {
    border-bottom: var(--rule);
}

.explore-workspace > .form-region,
.explore-workspace > .feedback,
.explore-workspace > .document-results,
.explore-workspace > .article-results,
.explore-workspace > .resource-result-count,
.explore-workspace > .pagination,
.explore-workspace > .resource-field-summary {
    margin-right: var(--space-4);
    margin-left: var(--space-4);
}

@media (max-width: 760px) {
    .explore-heading,
    .nk-browser-header {
        align-items: flex-start;
        flex-direction: column;
    }

    .nk-browser-tree {
        border-right: 0;
        border-bottom: var(--rule);
    }

    .workbench-record-heading,
    .workbench-row--relation,
    .workbench-transition-row {
        grid-template-columns: minmax(0, 1fr);
    }

    .workbench-row__action {
        justify-self: start;
    }

    .workbench-transition-row__direction {
        display: flex;
        gap: var(--space-2);
    }
}

/* Media and rich content: DEC-191 Evidence ledger. */

.media-ledger:not(.home-hero__figure),
.ck-content figure.image {
    margin: var(--gap-m) 0;
    background: var(--surface);
}

.media-ledger__image,
.ck-content figure.image img,
.ck-content > img {
    display: block;
    max-width: 100%;
    height: auto;
    border: 0;
    background: var(--surface-strong);
}

.news-detail-lead-media .media-ledger__image,
.training-detail-lead-media .media-ledger__image,
.about-hero .media-ledger__image,
.about-content-section .media-ledger__image {
    width: 100%;
    aspect-ratio: 16 / 9;
    object-fit: cover;
}

.about-content-section .media-ledger__image {
    aspect-ratio: 4 / 3;
}

.media-focus--top .media-ledger__image {
    object-position: 50% 20%;
}

.media-focus--center .media-ledger__image {
    object-position: 50% 50%;
}

.media-focus--bottom .media-ledger__image {
    object-position: 50% 80%;
}

.media-ledger__caption,
.ck-content figure.image figcaption {
    display: grid;
    gap: 0.45rem;
    margin: 0;
    padding: 0.9rem 1rem;
    border-top: 2px solid var(--panel);
    border-bottom: var(--rule);
    background: var(--surface);
    color: var(--text);
    font-size: var(--type-caption);
    line-height: 1.55;
    text-align: left;
}

.media-ledger__label,
.media-ledger__credit,
.ck-content figure.image figcaption::before {
    font-family: var(--mono-font);
    font-size: 0.75rem;
    font-weight: 600;
    letter-spacing: 0.055em;
    text-transform: uppercase;
}

.media-ledger__label,
.ck-content figure.image figcaption::before {
    color: var(--text);
}

.ck-content figure.image figcaption::before {
    content: "Figure";
    display: block;
}

.media-ledger__text,
.media-ledger__text p {
    margin: 0;
}

.media-ledger__credit {
    color: var(--muted);
    font-weight: 400;
    letter-spacing: 0.025em;
    text-transform: none;
}

.media-fallback {
    max-width: var(--measure);
    margin: 0;
}

.media-ledger > .media-fallback:not([hidden]) {
    margin: 0;
}

.media-ledger.is-unavailable .media-ledger__caption {
    border-top-color: var(--feedback-warning);
}

.media-embed {
    position: relative;
    overflow: hidden;
    width: 100%;
    aspect-ratio: 16 / 9;
    padding: 0;
    border: 0;
    border-top: 3px solid var(--panel);
    background: #000;
}

.media-embed iframe {
    position: absolute;
    inset: 0;
    display: block;
    width: 100%;
    height: 100%;
    border: 0;
}

.media-embed__fallback {
    margin: var(--gap-xs) 0 var(--gap-m);
    font-size: var(--type-small);
}

.video-placeholder {
    display: grid;
    width: 100%;
    aspect-ratio: 16 / 9;
    margin: 0 0 var(--gap-m);
    padding: var(--gap-m);
    place-items: center;
    border: 0;
    border-top: 4px solid var(--panel);
    border-bottom: var(--rule);
    background: var(--surface-placeholder);
    color: var(--muted);
    text-align: center;
}

.video-placeholder p {
    margin: 0;
}

/* No video yet: one slim full-width band in the metadata style. */
.video-placeholder--pending {
    display: block;
    aspect-ratio: auto;
    padding: var(--gap-xs) var(--gap-s);
    font-family: var(--mono-font);
    font-size: var(--type-label);
    line-height: 1.5;
    text-align: left;
}

.training-detail__content-section {
    margin-top: var(--gap-m);
}

.training-detail__content-section h3 {
    margin-bottom: var(--gap-xs);
}

.training-detail__legacy-content {
    max-width: var(--measure);
    margin-top: var(--gap-m);
}

.relationship-ledger__row dd > :first-child {
    margin-top: 0;
}

.relationship-ledger__row dd > :last-child {
    margin-bottom: 0;
}

.ck-content {
    overflow-wrap: anywhere;
}

/* One quote style for the whole site: news, rich text, tutorial .lede. It sits in the one column. */
blockquote,
.ck-content blockquote,
.news-detail-body blockquote,
.lede {
    margin: var(--gap-m) 0;
    padding: 0 0 0 20px;
    border-left: var(--rail-quote);
    color: var(--text);
    font-size: var(--type-quote);
    line-height: var(--leading-lead);
}

blockquote > :last-child,
.lede > :last-child {
    margin-bottom: 0;
}

.ck-content figure.table,
.ck-content .table {
    max-width: 100%;
    overflow-x: auto;
    border: 0;
}

.ck-content table {
    min-width: 36rem;
}

.home-hero__figure .media-ledger__image {
    object-fit: cover;
    object-position: right top;
}

.approach-switch-status {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip-path: inset(50%);
    white-space: nowrap;
}

.home-hero__figure .media-ledger__label,
.home-hero__figure .media-ledger__credit {
    color: inherit;
    font-size: inherit;
}

@media (max-width: 760px) {
    .media-ledger__caption,
    .ck-content figure.image figcaption {
        padding: 0.75rem;
    }
}

@media (forced-colors: active) {
    .media-ledger__caption,
    .ck-content figure.image figcaption,
    .media-embed {
        border-color: CanvasText;
    }
}

@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        scroll-behavior: auto !important;
        transition-duration: 0.01ms !important;
    }
}

/* Shared small editorial thumbnails: the same derivative across indexes. */
.training-record-row--with-image { display: grid; grid-template-columns: minmax(0, 1fr) 180px; gap: 20px; align-items: start; }
.training-record-row__content { min-width: 0; }
.news-thumbnail-link { display: block; width: 180px; max-width: 100%; flex: none; }
.news-thumbnail { display: block; width: 100%; height: auto; aspect-ratio: 18 / 11;
    object-fit: contain; background: #eef4fa; border: 1px solid var(--border); }
.home-latest__item .news-thumbnail-link { margin-bottom: 12px; }
.home-approaches--instrument .home-approach-definition strong { color: var(--panel-text); }
@media (max-width: 760px) {
    .training-record-row--with-image { grid-template-columns: minmax(0, 1fr); }
    .training-record-row--with-image .news-thumbnail-link { grid-row: 1; width: 100%; max-width: 360px; }
    .training-record-row--with-image .training-record-row__content { grid-row: 2; }
    .news-feed-row .news-thumbnail-link {
        grid-row: 1;
        width: 100%;
        max-width: 360px;
    }

    .news-feed-row .news-feed-content {
        grid-row: 2;
    }
}


/* DEC-303 index cards: group shade supplied by the view. */
.index-card-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1.5rem;
    padding: 1.5rem 0;
    border-bottom: var(--rule);
}
.index-card,
.training-card { min-width: 0; }
.index-card__link,
.training-card__link { display: block; color: var(--text); text-decoration: none; }
.index-card__link:focus-visible,
.training-card__link:focus-visible { outline: 3px solid var(--signal); outline-offset: 4px; }
.index-card-art {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    width: 100%;
    aspect-ratio: 16 / 9;
    padding: clamp(1rem, 2vw, 1.4rem);
    overflow: hidden;
    border-left: 4px solid var(--card-accent);
    background: var(--card-bg);
    color: var(--card-ink);
}
.index-card-art__network {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    color: var(--card-ink);
    opacity: 0.18;
    pointer-events: none;
}
.index-card-art__eyebrow,
.index-card-art__title {
    position: relative;
    z-index: 1;
    max-width: 82%;
}
.index-card-art__eyebrow {
    color: var(--card-accent);
    font-family: var(--mono-font);
    font-size: var(--type-label);
    font-weight: 600;
    letter-spacing: 0.07em;
    line-height: 1.4;
}
.index-card-art__title {
    margin: 1rem 0 0;
    color: var(--card-ink);
    font-size: clamp(1rem, 1.55vw, 1.4rem);
    font-weight: var(--weight-semibold);
    line-height: 1.2;
    overflow-wrap: anywhere;
}
.training-detail-lead-media .index-card-art__title {
    max-width: 78%;
    font-size: clamp(1.4rem, 4vw, 2.25rem);
}
.index-card__link:hover .index-card-art__title,
.training-card__link:hover .index-card-art__title { text-decoration: underline; }
.index-card__details { padding-top: 0.75rem; }
.index-card__details .metadata { margin: 0 0 0.35rem; }
.section-definition { margin: 0.5rem 0 0; padding: 0 0.75rem; color: var(--muted); font-size: var(--type-small); }
.database-card .database-record__summary { margin: 0; color: var(--muted); font-size: var(--type-small); }
.training-card__image { display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: cover; }
.training-card__title { margin: 0.75rem 0 0; font-size: 1.05rem; line-height: 1.35; }
.training-card__title--sr-only {
    position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
    overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0;
}
.title-subtitle { display: block; }
.training-card__summary { margin: 0.75rem 0 0; line-height: 1.58; }
.training-card__link:hover .training-card__title:not(.training-card__title--sr-only) { color: var(--link); text-decoration: underline; }
@media (max-width: 900px) {
    .index-card-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 600px) {
    .index-card-grid { grid-template-columns: minmax(0, 1fr); gap: 1.75rem; }
}

/* L8.1a: shared type scale, reading measure and right-hand contents rail. */
.page-title,
.section-breadcrumb-title h1,
.editorial-page-heading .page-title {
    font-size: var(--type-h1);
    font-weight: var(--weight-semibold);
    line-height: 1.15;
}

.editorial-page-heading .editorial-breadcrumb {
    font-size: var(--type-label);
    font-weight: var(--weight-regular);
}

.document-content h2,
.team-profile-content section h2,
.about-content-section h2,
.training-detail__section > h2,
.news-detail-body h2 {
    font-size: var(--type-h2);
    font-weight: var(--weight-semibold);
    line-height: 1.25;
}

.document-content h3,
.team-profile section h3,
.news-detail-body h3,
.training-detail__section h3,
.research-stream-row h2,
.training-card__title {
    font-size: var(--type-h3);
    font-weight: var(--weight-semibold);
    line-height: 1.35;
}

/* Subheading rhythm: M above, XS below; none above when it opens a box. */
.document-content h3,
.news-detail-body h3,
.training-detail__section h3 {
    margin: var(--gap-m) 0 var(--gap-xs);
}

.document-content h3:first-child,
.news-detail-body h3:first-child {
    margin-top: 0;
}

.document-content,
.news-detail-body,
.about-content-section,
.training-detail__section {
    font-size: var(--type-body);
    line-height: var(--leading-body);
}

.page-intro,
.downloads-intro,
.research-approaches__shared-introduction,
.research-streams__shared-introduction,
.news-detail-summary,
.detail-deck__summary {
    font-size: var(--type-h3);
    font-weight: var(--weight-regular);
    line-height: 1.6;
}

.news-detail-lead-media figcaption,
.training-card__summary {
    font-size: var(--type-small);
}

.page-kicker,
.home-hero__eyebrow,
.home-pathway__role,
.home-current-work__meta,
.metadata,
.record-meta,
.news-feed-meta,
.training-video-meta,
.training-resource-meta,
.resource-row__metadata,
.media-ledger__label,
.media-ledger__credit,
.detail-deck__meta {
    font-size: var(--type-label);
}

code,
kbd,
samp,
pre {
    font-family: var(--mono-font);
    font-size: var(--type-code);
}

strong,
b {
    font-weight: var(--weight-semibold);
}

/* "On this page" (option C, "column grid card"): one style on every page that has the section,
   including the Generating Data I steps. A light card at the top of the page body (thin rule, dark
   top rule, white surface) with the links in newspaper columns, each link on its own ruled line.
   Never sticky; the body (.document-layout, .document-content) spans the full width of the page
   heading. The links sit in <details open>: static/labsite/js/page-toc.js closes it on phones
   (collapsed, tap the title to open) and keeps it open on wider screens. Without JS it stays open. */
.page-toc {
    margin: 0 0 var(--gap-m);
    padding: 12px 18px 14px;
    border: var(--rule);
    border-top: 3px solid var(--panel);
    background: var(--surface);
}

.page-toc__details {
    margin: 0;
}

.page-toc__title {
    display: block;
    margin: 0 0 8px;
    color: var(--muted);
    font-family: var(--mono-font);
    font-size: var(--type-label);
    font-weight: var(--weight-semibold);
    letter-spacing: 0.08em;
    line-height: 1.4;
    text-transform: uppercase;
    list-style: none;
    cursor: default;
}

.page-toc__title::-webkit-details-marker {
    display: none;
}

.page-toc__links {
    columns: 3 200px;
    column-gap: 24px;
}

.page-toc__links a {
    display: block;
    break-inside: avoid;
    padding: 6px 0;
    border-top: 1px solid var(--surface-strong);
    color: var(--link);
    font-family: var(--ui-font);
    font-size: var(--type-small);
    line-height: 1.45;
    text-decoration: none;
}

.page-toc__links a:hover,
.page-toc__links a:focus-visible {
    text-decoration: underline;
}

@media (max-width: 599px) {
    .page-toc {
        padding: 10px 14px;
    }

    .page-toc__title {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 12px;
        margin: 0;
        min-height: 28px;
        cursor: pointer;
    }

    .page-toc__title::after {
        content: "+";
        color: var(--ink);
        font-size: 18px;
        font-weight: var(--weight-regular, 400);
        line-height: 1;
    }

    .page-toc__details[open] > .page-toc__title {
        margin-bottom: 8px;
    }

    .page-toc__details[open] > .page-toc__title::after {
        content: "\2013";
    }
}

@media (max-width: 560px) {
    h1 {
        font-size: 28px;
    }

    h2 {
        font-size: 21px;
    }

    .page-title,
    .section-breadcrumb-title h1,
    .editorial-page-heading .page-title {
        font-size: 28px;
    }

    .document-content h2,
    .team-profile-content section h2,
    .about-content-section h2,
    .training-detail__section > h2,
    .news-detail-body h2 {
        font-size: 21px;
    }
}

/* DEC-308: Database cards as faded country flags; eyebrow and title at the bottom-left. */
.flag-card-art {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    width: 100%;
    max-width: 100%;
    aspect-ratio: 16 / 9;
    padding: clamp(0.9rem, 2vw, 1.25rem);
    overflow: hidden;
    background: #ffffff;
    box-shadow: inset 0 0 0 1px rgba(16, 33, 59, 0.10);
    color: var(--text);
}
.flag-card-art__field { position: absolute; inset: 0; width: 100%; height: 100%; }
.flag-card-art__eyebrow,
.flag-card-art__title { position: relative; z-index: 1; max-width: 92%; }
.flag-card-art__eyebrow {
    color: var(--text);
    font-family: var(--mono-font);
    font-size: var(--type-label);
    font-weight: var(--weight-semibold);
    letter-spacing: 0.07em;
    line-height: 1.4;
}
.flag-card-art__title {
    margin: 0.35rem 0 0;
    color: var(--text);
    font-size: clamp(1rem, 1.55vw, 1.25rem);
    font-weight: var(--weight-semibold);
    line-height: 1.2;
    overflow-wrap: anywhere;
}
.index-card__link:hover .flag-card-art__title { text-decoration: underline; }

/* DEC-313: contributor role beside a name in a Lab Connections row. */
.relationship-ledger__role {
  color: var(--muted, #586b82);
  font-weight: 400;
}

/* Grant metadata line under the grant page heading: "NSTC · 2025–2028 · 3 years". */
.grant-metadata-line {
  color: var(--muted);
  margin: -0.5rem 0 1.5rem;
  font-variant-numeric: tabular-nums;
}

/* Site style standards, step 3: rhythm. Zero-specificity defaults, so a component's own margins
   still win. Text after text is S; anything before or after a block is M; the last item in a box
   has no bottom margin. */
:where(.document-content, .news-detail-body) :where(p, ul, ol) {
    margin: 0 0 var(--gap-s);
}

:where(.document-content, .news-detail-body) :where(li) > :where(ul, ol) {
    margin-bottom: 0;
}

:where(.document-content, .document-content section, .news-detail-body) > :where(
    .relationship-ledger, blockquote, .lede, figure, .fig, table, .video-placeholder,
    .media-embed, .chapters, .record-meta + .metadata
) {
    margin-block: var(--gap-m);
}

:where(.document-content, .document-content section, .news-detail-body) > :where(
    .relationship-ledger, blockquote, .lede, figure, .fig, table, .video-placeholder,
    .media-embed, .chapters
):first-child {
    margin-top: 0;
}

/* h2 to its first block is S (the h2's own bottom margin). */
:where(.document-content h2, .training-detail__section > h2) + :where(
    .relationship-ledger, blockquote, .lede, figure, .fig, table, .video-placeholder,
    .media-embed, .chapters, .record-meta, .part, p, ul, ol
) {
    margin-top: 0;
}

/* A chip row and its metadata line are one block: XS between them. */
:where(.document-content, .document-content section) > :where(.record-meta):has(+ .metadata) {
    margin-bottom: var(--gap-xs);
}

:where(.document-content, .document-content section) > :where(.record-meta + .metadata) {
    margin-top: 0;
}

/* Analytic Approaches and Research Streams indexes: approach cards with relation counts. */
.approach-card-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.approach-card__summary { margin: 0 0 0.6rem; color: var(--muted); font-size: var(--type-small); }
.approach-card__counts {
  display: flex;
  flex-wrap: wrap;
  gap: 0.25rem 0;
  margin: 0;
  padding: 0;
  list-style: none;
  font-variant-numeric: tabular-nums;
}
.approach-card__counts li + li::before { content: "\00b7"; padding: 0 0.45rem; }
@media (max-width: 600px) {
  .approach-card-grid { grid-template-columns: minmax(0, 1fr); }
}

/* Home: both Analytic Approaches side by side, no approach chips (Jacob 2026-11-01). */
.home-approach-columns {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(20px, 3vw, 36px);
}
.home-approach-card {
  min-width: 0;
  padding: clamp(20px, 3vw, 28px);
  background: var(--panel-secondary);
  border-top: var(--signal-rail-block) solid var(--signal);
}
.home-approach-card__title {
  margin: 0 0 4px;
  color: var(--panel-text);
  font-size: clamp(1.3rem, 2.4vw, 1.7rem);
}
.home-approach-card__pathway {
  padding: 18px 0;
  border-bottom: 1px solid rgb(255 255 255 / 0.2);
}
.home-approach-card__pathway:last-child { padding-bottom: 0; border-bottom: 0; }
.home-approach-card__pathway h4 { margin: 0 0 6px; color: var(--panel-text); }
.home-approach-card__pathway p { margin: 0 0 8px; color: var(--panel-muted); }
.home-approach-card .home-link-list { margin: 0; }
/* Home, two sections (Jacob 2026-11-01). The styles are provisional and
   match the pathway cards; section and card styles are being workshopped. */
.home-section__title {
  max-width: var(--measure);
  margin: 0 0 28px;
  color: var(--panel-text);
  font-size: clamp(1.8rem, 4vw, 2.8rem);
}
.home-approach-summaries { margin-top: 34px; }
.home-approach-summary {
  min-width: 0;
  padding: clamp(20px, 3vw, 28px);
  background: var(--panel-secondary);
  border-top: var(--signal-rail-block) solid var(--signal);
}
.home-approach-summary__title {
  margin: 0 0 10px;
  color: var(--panel-text);
  font-size: clamp(1.3rem, 2.4vw, 1.7rem);
}
.home-approach-summary__description { margin: 0 0 12px; color: var(--panel-muted); }
.home-approach-summary__links { margin: 0; }
/* Home, Navy steel (Jacob 2026-11-01, workshop round 4): the hero stays navy,
   the two middle sections are pale navy with dark type, Latest Posts stays
   white. Each card takes its approach's shade, as on the index pages. */
.home-section {
  color: var(--text);
  background: var(--surface-strong);
  border-left-color: var(--panel);
  border-bottom: 0;
}
.home-section .home-approaches__intro h2,
.home-section .home-section__title,
.home-approaches--instrument.home-section .home-approach-definition strong { color: var(--text); }
.home-section .home-approaches__intro p { color: var(--muted); }
.home-section .home-approach-card,
.home-section .home-approach-summary {
  color: var(--card-ink, var(--panel-text));
  background: var(--card-bg, var(--panel-secondary));
  border-top-color: var(--card-accent, var(--signal));
}
.home-section .home-approach-card__title,
.home-section .home-approach-summary__title,
.home-section .home-approach-card__pathway h4 { color: inherit; }
.home-section .home-approach-card__pathway p,
.home-section .home-approach-summary__description {
  color: color-mix(in srgb, var(--card-ink, var(--panel-text)) 80%, var(--card-bg, var(--panel-secondary)));
}
.home-section .home-approach-card__pathway {
  border-bottom-color: color-mix(in srgb, var(--card-ink, var(--panel-text)) 22%, transparent);
}
.home-section .home-approach-card .home-link-list a,
.home-section .home-approach-summary .home-link-list a { color: var(--card-accent, var(--signal)); }
.home-link-list__scope {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
}
@media (max-width: 760px) {
  .home-approach-columns { grid-template-columns: minmax(0, 1fr); }
}