/*
 * Nvidia Club product design system.
 *
 * This file owns shared tokens, surfaces, typography, controls, tables, and
 * integration styling. Feature-specific CSS keeps its layout responsibilities.
 */

:root {
    color-scheme: dark;
    --nc-bg: #090c0a;
    --nc-bg-elevated: #0d110e;
    --nc-surface-1: #111613;
    --nc-surface-2: #171d19;
    --nc-surface-3: #1d2520;
    --nc-surface-inset: #0c100d;
    --nc-border: #2d3730;
    --nc-border-strong: #3b493f;
    --nc-border-soft: rgba(232, 239, 234, 0.08);
    --nc-text: #e8ede9;
    --nc-text-strong: #f4f7f5;
    --nc-text-secondary: #aeb9b1;
    --nc-text-muted: #89958d;
    --nc-link: #9ada42;
    --nc-link-hover: #b6ed69;
    --nc-nvidia: #79d000;
    --nc-amd: #ef5147;
    --nc-ati: #d53b52;
    --nc-intel: #39a8ea;
    --nc-other: #a78bfa;
    --nc-market-up: #f5a524;
    --nc-market-down: #38bfc4;
    --nc-market-flat: #a78bfa;
    --nc-success: #62c982;
    --nc-warning: #f2bd58;
    --nc-danger: #f07178;
    --nc-info: #62b7e8;
    --nc-focus: #c4f879;
    --nc-radius-sm: 4px;
    --nc-radius-md: 8px;
    --nc-radius-lg: 12px;
    --nc-space-1: 0.375rem;
    --nc-space-2: 0.625rem;
    --nc-space-3: 0.875rem;
    --nc-space-4: 1.125rem;
    --nc-space-5: 1.5rem;
    --nc-space-6: 2rem;
    --nc-space-7: 3rem;
    --nc-space-8: 4.5rem;
    --nc-shadow-sm: 0 8px 24px rgba(0, 0, 0, 0.18);
    --nc-shadow-md: 0 20px 50px rgba(0, 0, 0, 0.28);
    --nc-font-sans: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    --nc-font-mono: "SFMono-Regular", Consolas, "Liberation Mono", monospace;
    --nc-content-width: 1320px;
    --nc-reading-width: 90ch;
    /* Density system: utility templates (wiki, compare, market, archives) use
       the compact masthead + section scale; editorial reading keeps its own
       larger rhythm. See docs/ui-density/02-density-tokens.md. */
    --nc-masthead-pad: clamp(1.5rem, 2.6vw, 2.25rem);
    --nc-utility-h1: clamp(1.75rem, 2.6vw, 2.5rem);
    --nc-utility-section-pad: clamp(1.5rem, 2.6vw, 2.5rem);
    --nc-row-compact: 40px;
    --nc-row-default: 46px;
    --nc-control-height: 40px;
    --theme-palette-color-1: var(--nc-nvidia);
    --theme-palette-color-2: #68b900;
    --theme-palette-color-3: var(--nc-text-secondary);
    --theme-palette-color-4: var(--nc-text);
    --theme-palette-color-5: var(--nc-border);
    --theme-palette-color-6: var(--nc-surface-2);
    --theme-palette-color-7: var(--nc-surface-1);
    --theme-palette-color-8: var(--nc-bg);
    --theme-text-color: var(--nc-text);
    --theme-link-initial-color: var(--nc-link);
    --theme-link-hover-color: var(--nc-link-hover);
}

html {
    background: var(--nc-bg);
    scroll-behavior: smooth;
}

body.nc-site {
    min-height: 100vh;
    background: var(--nc-bg);
    color: var(--nc-text);
    font-family: var(--nc-font-sans);
    font-size: 16px;
    line-height: 1.6;
    text-rendering: optimizeLegibility;
}

body.nc-site #main-container,
body.nc-site .site-main,
body.nc-site [data-content="normal"],
body.nc-site .content-area {
    background: var(--nc-bg);
}

body.nc-site :where(h1, h2, h3, h4, h5, h6) {
    color: var(--nc-text-strong);
    font-family: var(--nc-font-sans);
    font-weight: 750;
    letter-spacing: -0.025em;
    text-wrap: balance;
}

body.nc-site :where(p, li, dd, figcaption) {
    color: var(--nc-text-secondary);
}

:where(body.nc-site) a {
    color: var(--nc-link);
    text-underline-offset: 0.18em;
}

:where(body.nc-site) a:hover {
    color: var(--nc-link-hover);
}

body.nc-site :where(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
    outline: 3px solid var(--nc-focus);
    outline-offset: 3px;
    box-shadow: 0 0 0 2px var(--nc-bg);
}

.nc-wrap {
    width: min(calc(100% - 40px), var(--nc-content-width));
    margin-inline: auto;
}

.nc-reading-column {
    width: min(calc(100% - 40px), var(--nc-reading-width));
    margin-inline: auto;
}

.nc-section {
    padding-block: var(--nc-utility-section-pad);
    background: var(--nc-bg);
}

.nc-kicker {
    margin: 0 0 var(--nc-space-2);
    color: var(--nc-nvidia);
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0.15em;
    line-height: 1.3;
    text-transform: uppercase;
}

.nc-section-heading {
    margin-bottom: var(--nc-space-4);
}

.nc-section-heading h2 {
    margin: 0;
    font-size: clamp(1.35rem, 1.9vw, 1.7rem);
}

/* Global shell */

body.nc-site #header {
    border-bottom: 1px solid var(--nc-border-soft);
    background: rgba(9, 12, 10, 0.96);
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.24);
    backdrop-filter: blur(16px);
}

body.nc-site #header [data-row],
body.nc-site #header [data-row] > div {
    background: transparent;
}

body.nc-site #header .ct-container {
    width: min(calc(100% - 40px), var(--nc-content-width));
    min-height: 64px;
}

body.nc-site #header .site-branding {
    margin: 0;
}

body.nc-site #header .site-title-container a {
    display: inline-flex;
    align-items: center;
    gap: 0.7rem;
    color: var(--nc-text-strong);
    font-size: 1.08rem;
    font-weight: 800;
    letter-spacing: -0.02em;
}

body.nc-site #header .site-title-container a::before {
    width: 34px;
    height: 34px;
    flex: 0 0 34px;
    background: url("../images/nvidia-club-mark.svg") center / contain no-repeat;
    content: "";
}

body.nc-site #header .site-logo-container img,
body.nc-site #header .custom-logo-link img {
    width: auto;
    max-width: 190px;
    height: 42px;
    object-fit: contain;
}

body.nc-site #header .site-logo-container + .site-title-container {
    display: none;
}

body.nc-site #header .menu > li > a,
body.nc-site #header .ct-menu-link {
    min-height: 42px;
    padding: 0.5rem 0.66rem;
    color: var(--nc-text-secondary);
    border-radius: var(--nc-radius-sm);
    font-size: 0.76rem;
    font-weight: 720;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

body.nc-site #header .menu > li > a:hover,
body.nc-site #header .menu > li.current-menu-item > a,
body.nc-site #header .menu > li.current-menu-ancestor > a,
body.nc-site #header .menu > li > a[aria-current="page"] {
    color: var(--nc-text-strong);
    background: var(--nc-surface-2);
}

body.nc-site #header .nc-nav-main-item--primary > a,
body.nc-site #header .nc-nav-main-item--compare > a,
body.nc-site #header .nc-nav-main-item--market > a {
    border-bottom: 2px solid transparent;
}

body.nc-site #header .nc-nav-main-item--primary > a:hover,
body.nc-site #header .nc-nav-main-item--compare > a:hover,
body.nc-site #header .nc-nav-main-item--market > a:hover,
body.nc-site #header .nc-nav-main-item--feature.current-menu-item > a {
    border-bottom-color: var(--nc-nvidia);
}

body.nc-site .ct-header-trigger {
    color: var(--nc-text);
}

/* Mobile offcanvas menu: same visual language as the mastheads (faint grid,
   green glow) with one homogeneous nav list. The three primary tools carry
   green mono indexes like the homepage tool rail; everything else gets a
   muted mono marker, so the hierarchy reads through color and markers rather
   than mixed font sizes and weights. */
body.nc-site #offcanvas {
    color: var(--nc-text);
    background: var(--nc-bg-elevated);
}

body.nc-site #offcanvas .ct-panel-inner {
    border-left: 1px solid var(--nc-border);
    background:
        linear-gradient(rgba(255, 255, 255, 0.025) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, 0.025) 1px, transparent 1px),
        radial-gradient(circle at 100% 0%, rgba(121, 208, 0, 0.1), transparent 45%);
    background-size: 40px 40px, 40px 40px, auto;
}

body.nc-site #offcanvas .menu-container > ul {
    counter-reset: nc-menu-feature;
}

body.nc-site #offcanvas .nc-nav-main-item > a {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    min-height: 50px;
    padding: 0.5rem 0.65rem;
    border-bottom: 1px solid var(--nc-border-soft);
    border-radius: var(--nc-radius-sm);
    color: var(--nc-text-secondary);
    font-size: 0.92rem;
    font-weight: 750;
    letter-spacing: 0.07em;
    box-shadow: none;
    transition: background-color 150ms ease, color 150ms ease, box-shadow 150ms ease;
}

body.nc-site #offcanvas .menu-container > ul > li:first-child > a {
    border-top: 1px solid var(--nc-border-soft);
}

/* Marker column: two mono characters for every item keeps the labels on one
   shared left edge. */
body.nc-site #offcanvas .nc-nav-main-item > a::before {
    content: "//";
    flex: 0 0 1.2rem;
    color: var(--nc-text-muted);
    font: 700 0.7rem/1.4 var(--nc-font-mono);
    letter-spacing: 0;
    text-align: left;
    transition: color 150ms ease;
}

body.nc-site #offcanvas .nc-nav-main-item--feature > a {
    color: var(--nc-text-strong);
    font-weight: 800;
}

body.nc-site #offcanvas .nc-nav-main-item--feature > a::before {
    counter-increment: nc-menu-feature;
    content: "0" counter(nc-menu-feature);
    color: var(--nc-nvidia);
}

body.nc-site #offcanvas .nc-nav-main-item--home > a {
    opacity: 1;
    color: var(--nc-text-muted);
}

/* Transient hover/press feedback is a background tint only. The green bar
   plus green text stays exclusive to the current section, so tapping an item
   never shows a second "selected" entry while navigation is in flight. */
@media (hover: hover) {
    body.nc-site #offcanvas .nc-nav-main-item > a:hover {
        background: var(--nc-surface-2);
        color: var(--nc-text-strong);
    }

    body.nc-site #offcanvas .nc-nav-main-item > a:hover::before {
        color: var(--nc-nvidia);
    }
}

body.nc-site #offcanvas .nc-nav-main-item > a:active,
body.nc-site #offcanvas .nc-nav-main-item > a:focus-visible {
    background: var(--nc-surface-2);
    color: var(--nc-text-strong);
}

body.nc-site #offcanvas .nc-nav-main-item.current-menu-item > a,
body.nc-site #offcanvas .nc-nav-main-item.current-menu-ancestor > a {
    color: var(--nc-link);
    box-shadow: inset 3px 0 0 var(--nc-nvidia);
}

body.nc-site #offcanvas .ct-toggle-close {
    color: var(--nc-text-secondary);
}

body.nc-site #offcanvas .ct-toggle-close:hover {
    color: var(--nc-link-hover);
}

.nc-site-footer {
    border-top: 1px solid var(--nc-border);
    background: #070a08;
    color: var(--nc-text-secondary);
}

.nc-site-footer__grid {
    display: grid;
    grid-template-columns: 1.1fr 1.5fr 1fr;
    gap: var(--nc-space-6);
    padding-block: var(--nc-space-6);
}

.nc-site-footer__brand > a {
    display: inline-flex;
    align-items: center;
    gap: 0.65rem;
    color: var(--nc-text-strong);
    font-size: 1.2rem;
    font-weight: 800;
    text-decoration: none;
}

.nc-site-footer__brand > a::before {
    width: 34px;
    height: 34px;
    background: url("../images/nvidia-club-mark.svg") center / contain no-repeat;
    content: "";
}

/* Image variant renders the same custom_logo attachment as the header, so
   the old chip-mark pseudo-icon must not also draw behind it. */
.nc-site-footer__brand > a.nc-site-footer__brand-link--image::before {
    content: none;
}

.nc-site-footer__logo {
    display: block;
    height: 42px;
    width: auto;
    max-width: 100%;
}

.nc-site-footer__brand p,
.nc-site-footer__legal p {
    margin: var(--nc-space-3) 0 0;
    color: var(--nc-text-muted);
    font-size: 0.86rem;
}

.nc-site-footer__label {
    margin: 0 0 var(--nc-space-3);
    color: var(--nc-text-strong);
    font-size: 0.75rem;
    font-weight: 800;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.nc-footer-links {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.5rem 1.5rem;
}

.nc-footer-links a {
    color: var(--nc-text-secondary);
    font-size: 0.9rem;
    text-decoration: none;
}

.nc-footer-links a:hover {
    color: var(--nc-link-hover);
}

/* Shared controls and surfaces */

body.nc-site :where(input[type="text"], input[type="search"], input[type="email"], input[type="url"], input[type="number"], input[type="password"], textarea, select),
.nc-filter-select,
.nc-combobox__input {
    min-height: 44px;
    border: 1px solid var(--nc-border-strong);
    border-radius: var(--nc-radius-sm);
    background: var(--nc-surface-inset);
    color: var(--nc-text);
    font: inherit;
}

body.nc-site :where(input, textarea)::placeholder {
    color: var(--nc-text-muted);
    opacity: 1;
}

body.nc-site :where(input, textarea, select):focus {
    border-color: var(--nc-focus);
    box-shadow: 0 0 0 3px rgba(196, 248, 121, 0.15);
}

body.nc-site select {
    color-scheme: dark;
}

.nc-button,
body.nc-site .wp-element-button,
body.nc-site button:not(.ct-toggle):not(.ct-header-trigger):not(.nc-compare-action-btn):not(.nc-combobox__clear):not(.nc-compare-view-btn),
.nc-compare-action-primary,
.nc-compare-action-btn {
    display: inline-flex;
    min-height: 42px;
    align-items: center;
    justify-content: center;
    padding: 0.65rem 1rem;
    border: 1px solid var(--nc-nvidia);
    border-radius: var(--nc-radius-sm);
    background: var(--nc-nvidia);
    color: #0b1207;
    font: 750 0.88rem/1.2 var(--nc-font-sans);
    text-decoration: none;
    transition: background-color 150ms ease, border-color 150ms ease, color 150ms ease, transform 150ms ease;
}

.nc-button:hover,
body.nc-site .wp-element-button:hover,
body.nc-site button:not(.ct-toggle):not(.ct-header-trigger):not(.nc-compare-action-btn):not(.nc-combobox__clear):not(.nc-compare-view-btn):hover,
.nc-compare-action-primary:hover {
    border-color: var(--nc-link-hover);
    background: var(--nc-link-hover);
    color: #071000;
}

.nc-button.secondary,
.nc-button--secondary,
.nc-compare-action-btn,
.nc-compare-order-btn,
.nc-compare-view-btn,
.nc-compare-row-order__select {
    /* Brighter than --nc-border-strong: the darker token nearly disappears
       against dark surfaces, so the resting state read as plain text. */
    border-color: rgba(232, 239, 234, 0.34);
    background: var(--nc-surface-2);
    color: var(--nc-text-strong);
}

.nc-button.secondary:hover,
.nc-button--secondary:hover,
.nc-compare-action-btn:hover,
.nc-compare-order-btn:hover,
.nc-compare-view-btn:hover,
.nc-compare-order-btn.is-active,
.nc-compare-view-btn.is-active,
.nc-compare-row-order__select:hover,
.nc-compare-row-order__select:focus {
    border-color: var(--nc-nvidia);
    background: var(--nc-surface-3);
    color: var(--nc-link-hover);
    box-shadow: 0 0 0 1px rgba(121, 208, 0, 0.22);
}

body.nc-site :where(button, input, select, textarea)[disabled],
body.nc-site :where(button, input, select, textarea)[aria-disabled="true"] {
    cursor: not-allowed;
    opacity: 0.48;
}

.nc-card,
.nc-panel,
.nc-empty-state,
.nc-hub-card,
.nc-wiki-card {
    border: 1px solid var(--nc-border);
    border-radius: var(--nc-radius-md);
    background: var(--nc-surface-1);
    box-shadow: var(--nc-shadow-sm);
}

.nc-empty-state {
    padding: var(--nc-space-5);
    text-align: center;
}

.nc-empty-state > :first-child {
    margin-top: 0;
}

.nc-badge,
.nc-filter-chip,
.nc-vendor-pill,
.nc-entry-type-badge,
.nc-future-badge {
    border: 1px solid var(--nc-border-strong);
    background: var(--nc-surface-2);
    color: var(--nc-text-secondary);
}

.nc-combobox-list,
.nc-search-suggestions {
    border: 1px solid var(--nc-border-strong);
    background: var(--nc-surface-2);
    color: var(--nc-text);
    box-shadow: var(--nc-shadow-md);
}

.nc-combobox-list__option:hover,
.nc-combobox-list__option[aria-selected="true"],
.nc-search-suggestions [role="option"]:hover,
.nc-search-suggestions [role="option"][aria-selected="true"] {
    background: var(--nc-surface-3);
    color: var(--nc-text-strong);
}

/* Tables */

body.nc-site .entry-content table,
.nc-table,
.nc-spec-table,
.nc-gpu-table,
.nc-compare-table {
    width: 100%;
    border-spacing: 0;
    border-collapse: separate;
    border: 1px solid var(--nc-border);
    border-radius: var(--nc-radius-md);
    background: var(--nc-surface-1);
    color: var(--nc-text-secondary);
}

body.nc-site .entry-content :where(th, td),
.nc-table :where(th, td),
.nc-spec-table :where(th, td),
.nc-gpu-table :where(th, td),
.nc-compare-table :where(th, td) {
    padding: 0.78rem 0.9rem;
    border-right: 0;
    border-bottom: 1px solid var(--nc-border-soft);
    background: transparent;
    color: inherit;
    text-align: left;
    vertical-align: top;
}

body.nc-site .entry-content th,
.nc-table th,
.nc-spec-table th,
.nc-gpu-table th,
.nc-compare-table th {
    color: var(--nc-text-strong);
    font-weight: 720;
}

body.nc-site .entry-content thead,
.nc-table thead,
.nc-spec-table thead,
.nc-gpu-table thead,
.nc-compare-table thead {
    background: var(--nc-surface-3);
}

body.nc-site .entry-content thead th,
.nc-table thead th,
.nc-spec-table thead th,
.nc-gpu-table thead th,
.nc-compare-table thead th {
    background: var(--nc-surface-3);
    color: var(--nc-text-strong);
}

body.nc-site .entry-content thead th a,
.nc-table thead th a,
.nc-spec-table thead th a,
.nc-gpu-table thead th a,
.nc-compare-table thead th a {
    color: inherit;
}

body.nc-site .entry-content tbody tr:nth-child(even),
.nc-table tbody tr:nth-child(even),
.nc-spec-table tbody tr:nth-child(even),
.nc-gpu-table tbody tr:nth-child(even),
.nc-compare-table tbody tr:nth-child(even) {
    background: rgba(255, 255, 255, 0.018);
}

body.nc-site .entry-content tbody tr:hover,
.nc-table tbody tr:hover,
.nc-spec-table tbody tr:hover,
.nc-gpu-table tbody tr:hover,
.nc-compare-table tbody tr:not(.nc-compare-section-row):hover {
    background: rgba(121, 208, 0, 0.045);
}

.nc-table-wrap,
.nc-spec-table-wrap,
.nc-gpu-table-wrap,
.nc-compare-table-wrap,
body.nc-site .entry-content .wp-block-table {
    max-width: 100%;
    overflow-x: auto;
    scrollbar-color: var(--nc-border-strong) var(--nc-surface-inset);
}

/* Wide GPU/compare tables need an explicit scroll cue below the breakpoint
   where their fixed min-width forces overflow; hidden once the table fits. */
.nc-table-scroll-hint {
    display: none;
    margin: 0 0 var(--nc-space-2);
    color: var(--nc-text-muted);
    font-size: 0.82rem;
    font-weight: 700;
}

@media (max-width: 960px) {
    .nc-table-scroll-hint {
        display: block;
    }
}

/* Page and archive shell */

.nc-page-hero,
.nc-archive-header,
.nc-compare-header {
    --nc-hero-accent: rgba(121, 208, 0, 0.08);
    position: relative;
    overflow: hidden;
    border-bottom: 1px solid var(--nc-border);
    background:
        linear-gradient(90deg, var(--nc-hero-accent), transparent 42%),
        linear-gradient(180deg, #111713, #0b0f0c);
}

.nc-page-hero::after,
.nc-archive-header::after,
.nc-compare-header::after {
    position: absolute;
    inset: 0;
    background-image:
        linear-gradient(rgba(255,255,255,.025) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.025) 1px, transparent 1px);
    background-size: 40px 40px;
    content: "";
    pointer-events: none;
    mask-image: linear-gradient(to right, black, transparent 75%);
}

/* Compact utility masthead: eyebrow, H1, one sentence. The old 515px
   min-height band spent half a desktop viewport before any tool or data. */
.nc-page-hero__inner,
.nc-archive-header > .nc-wrap,
.nc-compare-header > .nc-wrap {
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding-block: var(--nc-masthead-pad);
}

.nc-page-hero--compact .nc-page-hero__inner {
    padding-block: var(--nc-masthead-pad);
}

.nc-page-hero h1,
.nc-archive-header h1,
.nc-compare-header h1 {
    max-width: 30ch;
    margin: 0;
    color: var(--nc-text-strong);
    font-size: var(--nc-utility-h1);
    line-height: 1.12;
}

.nc-page-hero p:not(.nc-kicker),
.nc-archive-header p:not(.nc-kicker),
.nc-compare-header p:not(.nc-kicker) {
    max-width: 78ch;
    margin: var(--nc-space-2) 0 0;
    color: var(--nc-text-secondary);
    font-size: 0.98rem;
    line-height: 1.55;
}

/* Masthead with right-aligned actions on desktop, wrapping below on mobile.
   The compound selector must outrank the column direction that
   .nc-archive-header > .nc-wrap sets above. */
.nc-wrap.nc-masthead-row,
.nc-page-hero__inner.nc-masthead-row {
    flex-direction: row;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: var(--nc-space-3) var(--nc-space-5);
}

.nc-masthead-row__copy {
    min-width: min(100%, 34ch);
    flex: 1 1 auto;
}

.nc-masthead-row__actions {
    display: flex;
    flex: 0 0 auto;
    flex-wrap: wrap;
    gap: var(--nc-space-2);
}

.nc-page-content,
.nc-page-feed,
.nc-forums-shell {
    padding-block: var(--nc-space-7);
}

/* Retro and Guides are hub pages: quick paths first, article inventory close
   behind. Informational pages (about, contact) keep the roomier default. */
.nc-retro-page .nc-page-content,
.nc-guides-page .nc-page-content {
    padding-block: var(--nc-space-5) var(--nc-space-4);
}

.nc-retro-page .nc-page-feed,
.nc-guides-page .nc-page-feed {
    padding-block: var(--nc-space-4) var(--nc-space-6);
}

.nc-retro-page .nc-hub-grid,
.nc-guides-page .nc-hub-grid {
    margin: var(--nc-space-4) 0;
}

.nc-retro-page .nc-page-content h2,
.nc-guides-page .nc-page-content h2 {
    margin-top: var(--nc-space-5);
    padding-top: var(--nc-space-3);
    font-size: clamp(1.2rem, 1.7vw, 1.45rem);
}

.nc-page-content {
    max-width: 1080px;
}

.nc-page-content > :first-child,
.nc-article-body > :first-child {
    margin-top: 0;
}

.nc-page-content h2 {
    margin-top: var(--nc-space-7);
    padding-top: var(--nc-space-5);
    border-top: 1px solid var(--nc-border-soft);
    font-size: clamp(1.45rem, 2.5vw, 2rem);
}

.nc-page-lead {
    max-width: 74ch;
    color: var(--nc-text-secondary);
    font-size: 1.12rem;
    line-height: 1.75;
}

.nc-hub-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1px;
    overflow: hidden;
    border: 1px solid var(--nc-border);
    border-radius: var(--nc-radius-md);
    background: var(--nc-border);
}

.nc-hub-grid > br {
    display: none;
}

.nc-hub-card {
    display: flex;
    min-height: 0;
    flex-direction: column;
    gap: var(--nc-space-1);
    justify-content: center;
    padding: var(--nc-space-3) var(--nc-space-4);
    border: 0;
    border-radius: 0;
    background: var(--nc-surface-1);
    box-shadow: none;
    color: var(--nc-text-secondary);
    text-decoration: none;
}

.nc-hub-card:hover {
    background: var(--nc-surface-2);
}

.nc-hub-card strong {
    color: var(--nc-text-strong);
    font-size: 1.05rem;
}

.nc-hub-card span {
    color: var(--nc-text-secondary);
}

.nc-page-hero--retro {
    --nc-hero-accent: rgba(207, 157, 87, 0.11);
    background:
        linear-gradient(90deg, var(--nc-hero-accent), transparent 45%),
        linear-gradient(180deg, #17140f, #0c0e0b);
}

.nc-retro-page .nc-kicker,
.nc-start-card--retro .nc-start-card__title {
    color: #d2ad76;
}

/* Guides: a restrained blueprint tone, distinct from the neutral grid pattern. */
.nc-page-hero--guides {
    --nc-hero-accent: rgba(88, 166, 214, 0.1);
    background:
        linear-gradient(90deg, var(--nc-hero-accent), transparent 45%),
        linear-gradient(180deg, #0f1417, #0b0e0f);
}

.nc-page-hero--guides::after {
    background-image:
        linear-gradient(rgba(146, 200, 227, 0.05) 1px, transparent 1px),
        linear-gradient(90deg, rgba(146, 200, 227, 0.05) 1px, transparent 1px),
        linear-gradient(135deg, transparent 48%, rgba(146, 200, 227, 0.06) 49%, rgba(146, 200, 227, 0.06) 50%, transparent 51%);
    background-size: 28px 28px, 28px 28px, 84px 84px;
}

.nc-guides-page .nc-kicker {
    color: #92c8e3;
}

/* Homepage */

.nc-home,
.nc-home-section,
.nc-home-section--dark,
.nc-home-compare-spotlight {
    background: var(--nc-bg);
    color: var(--nc-text);
}

.nc-home-hero {
    border-bottom: 1px solid var(--nc-border);
    background:
        radial-gradient(circle at 82% 22%, rgba(121, 208, 0, 0.12), transparent 25%),
        linear-gradient(120deg, #111713, #080b09 65%);
}

.nc-home-hero__inner {
    display: grid;
    grid-template-columns: minmax(0, 1.15fr) minmax(360px, 0.85fr);
    gap: clamp(1.5rem, 4vw, 4rem);
    align-items: center;
    padding-block: clamp(1.75rem, 3.4vw, 2.75rem);
}

/* The homepage keeps the largest H1 on the site, capped at ~52px so the hero,
   tool rail, and the start of Latest Content share the first viewport. */
.nc-home-hero__h1 {
    max-width: 26ch;
    margin: 0;
    font-size: clamp(2.1rem, 3.6vw, 3.25rem);
    line-height: 1.06;
}

.nc-home-hero__sub {
    max-width: 63ch;
    margin: var(--nc-space-3) 0 0;
    color: var(--nc-text-secondary);
    font-size: clamp(1rem, 1.3vw, 1.12rem);
}

.nc-hero-actions {
    display: flex;
    flex-wrap: wrap;
    gap: var(--nc-space-3);
    margin-top: var(--nc-space-4);
}

.nc-home-hero__search {
    width: 100%;
    margin-inline: auto;
    padding: var(--nc-space-4);
    border: 1px solid var(--nc-border);
    border-radius: var(--nc-radius-md);
    background: rgba(17, 22, 19, 0.9);
    box-shadow: var(--nc-shadow-md);
}

.nc-home-search-row {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 0;
    padding: 0;
    border: 1px solid var(--nc-border-strong);
    border-radius: var(--nc-radius-sm);
    background: var(--nc-surface-inset);
}

.nc-home-search-row input[type="search"] {
    border: 0;
    background: transparent;
    box-shadow: none;
}

/* The row is the visible control; a second outline on the transparent inner
   input rendered as a detached green rectangle floating over the box. Focus
   feedback moves to the row itself. */
body.nc-site .nc-home-search-row input[type="search"]:focus,
body.nc-site .nc-home-search-row input[type="search"]:focus-visible {
    outline: none;
    border: 0;
    box-shadow: none;
}

.nc-home-search-row:focus-within {
    border-color: var(--nc-focus);
    box-shadow: 0 0 0 3px rgba(196, 248, 121, 0.15);
}

.nc-home-search-icon {
    display: grid;
    padding-left: 0.9rem;
    color: var(--nc-text-muted);
    place-items: center;
}

.nc-home-search-hints,
.nc-home-search-hints a {
    font-size: 0.8rem;
}

/* Coverage row: total entry count plus one clickable count per vendor,
   linking into that vendor's GPU Wiki view. Width matches .nc-wrap's gutter
   formula; equal block padding centers the line between its own top border
   and the hero's bottom border. Wraps to a second centered line on phones. */
.nc-home-proof {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    justify-content: center;
    gap: 0.3rem clamp(0.4rem, 1.2vw, 0.7rem);
    width: min(calc(100% - 40px), var(--nc-content-width));
    margin: var(--nc-space-4) auto 0;
    padding-block: var(--nc-space-3);
    border-top: 1px solid var(--nc-border);
    list-style: none;
    color: var(--nc-text-secondary);
    font-size: clamp(0.8rem, 1vw, 0.92rem);
    font-weight: 700;
}

.nc-home-proof li {
    white-space: nowrap;
}

.nc-home-proof li:not(:first-child)::before {
    content: "\00b7";
    margin-right: clamp(0.4rem, 1.2vw, 0.7rem);
    color: var(--nc-text-muted);
}

.nc-home-proof__total {
    color: var(--nc-text-strong);
}

.nc-home-proof a {
    color: var(--nc-text-secondary);
    text-decoration: none;
}

.nc-home-proof a:hover,
.nc-home-proof a:focus-visible {
    color: var(--nc-link-hover);
}

.nc-home-proof__count {
    color: var(--nc-text-muted);
    font: 700 0.85em/1 var(--nc-font-mono);
}

.nc-home-proof a:hover .nc-home-proof__count,
.nc-home-proof a:focus-visible .nc-home-proof__count {
    color: inherit;
}

.nc-home-pillars {
    border-bottom: 1px solid var(--nc-border);
    background: var(--nc-bg-elevated);
}

.nc-home-pillars__grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
}

.nc-home-pillars__grid > a {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 0.2rem var(--nc-space-3);
    padding: var(--nc-space-4) var(--nc-space-5);
    border-right: 1px solid var(--nc-border);
    color: var(--nc-text-secondary);
    text-decoration: none;
}

.nc-home-pillars__grid > a:last-child {
    border-right: 0;
}

.nc-home-pillars__grid > a:hover {
    background: var(--nc-surface-1);
}

.nc-home-pillar__index {
    grid-row: span 2;
    color: var(--nc-nvidia);
    font: 700 0.68rem/1.4 var(--nc-font-mono);
}

.nc-home-pillars strong {
    color: var(--nc-text-strong);
    font-size: 1.05rem;
}

.nc-home-pillars strong + span {
    color: var(--nc-text-muted);
    font-size: 0.84rem;
}

.nc-home-section {
    padding-block: clamp(2rem, 3.4vw, 3rem);
    border-bottom: 1px solid var(--nc-border-soft);
}

.nc-home-section-head {
    display: flex;
    gap: var(--nc-space-5);
    align-items: end;
    justify-content: space-between;
    margin-bottom: var(--nc-space-4);
}

.nc-home-section-head h2 {
    margin: 0;
    font-size: clamp(1.35rem, 2vw, 1.75rem);
}

.nc-section-more,
.nc-text-link {
    color: var(--nc-link);
    font-weight: 720;
    text-decoration: none;
}

.nc-article-grid,
.nc-gpu-grid,
.nc-start-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: var(--nc-space-4);
}

.nc-article-card,
.nc-start-card {
    overflow: hidden;
    border: 1px solid var(--nc-border);
    border-radius: var(--nc-radius-md);
    background: var(--nc-surface-1);
    box-shadow: var(--nc-shadow-sm);
}

.nc-article-card:hover,
.nc-start-card:hover {
    border-color: var(--nc-border-strong);
    background: var(--nc-surface-2);
}

.nc-article-card__thumb {
    display: block;
    aspect-ratio: 4 / 3;
    overflow: hidden;
    border-bottom: 1px solid var(--nc-border);
    background: var(--nc-surface-inset);
}

.nc-article-card__thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.nc-article-card__body {
    padding: var(--nc-space-5);
}

.nc-article-card__category,
.nc-article-card__date {
    display: inline-block;
    margin: 0 var(--nc-space-2) var(--nc-space-2) 0;
    color: var(--nc-text-muted);
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.07em;
    text-transform: uppercase;
}

.nc-article-card__category {
    color: var(--nc-link);
}

.nc-article-card__title {
    margin: 0;
    font-size: 1.18rem;
    line-height: 1.25;
}

.nc-article-card__title a {
    color: var(--nc-text-strong);
    text-decoration: none;
}

.nc-article-card__excerpt {
    margin: var(--nc-space-3) 0 0;
    font-size: 0.9rem;
}

.nc-start-card {
    display: flex;
    min-height: 150px;
    flex-direction: column;
    justify-content: center;
    padding: var(--nc-space-5);
    color: var(--nc-text-secondary);
    text-decoration: none;
}

.nc-start-card__title {
    color: var(--nc-text-strong);
    font-size: 1.04rem;
    font-weight: 750;
}

.nc-start-card__desc {
    margin-top: var(--nc-space-2);
    color: var(--nc-text-muted);
    font-size: 0.87rem;
}

/* Popular GPU data table on the homepage. */
.nc-home-gpu-table__action {
    text-align: right;
    white-space: nowrap;
}

.nc-home-gpu-table__action a {
    font-weight: 750;
    text-decoration: none;
}

@media (max-width: 689px) {
    /* Rows become compact cards: hide the header row, stack each GPU with its
       four labeled values. The action link closes the card. */
    .nc-home-gpu-table thead {
        position: absolute;
        width: 1px;
        height: 1px;
        overflow: hidden;
        clip-path: inset(50%);
    }

    .nc-home-gpu-table,
    .nc-home-gpu-table tbody,
    .nc-home-gpu-table tr,
    .nc-home-gpu-table th,
    .nc-home-gpu-table td {
        display: block;
        width: 100%;
    }

    .nc-home-gpu-table {
        /* The shared .nc-gpu-table 860px minimum is for real column layouts;
           in stacked card mode it only forces pointless horizontal scrolling. */
        min-width: 0;
        border: 0;
        background: transparent;
    }

    .nc-home-gpu-table-wrap {
        overflow-x: visible;
    }

    .nc-home-gpu-table tr {
        margin-bottom: var(--nc-space-3);
        border: 1px solid var(--nc-border);
        border-radius: var(--nc-radius-md);
        background: var(--nc-surface-1);
        overflow: hidden;
    }

    .nc-home-gpu-table tbody tr[class*="gpu-table-row--vendor"] th:first-child {
        border-left-width: 4px;
    }

    .nc-home-gpu-table th[scope="row"] {
        padding: 0.6rem 0.8rem 0.3rem;
        border-bottom: 0;
        font-size: 1rem;
    }

    .nc-home-gpu-table td {
        display: flex;
        gap: 0.6rem;
        justify-content: space-between;
        padding: 0.22rem 0.8rem;
        border-bottom: 0;
        font-size: 0.9rem;
    }

    .nc-home-gpu-table td::before {
        content: attr(data-label);
        color: var(--nc-text-muted);
        font-size: 0.78rem;
        font-weight: 750;
        letter-spacing: 0.04em;
        text-transform: uppercase;
    }

    .nc-home-gpu-table td.nc-home-gpu-table__action {
        justify-content: flex-end;
        padding-bottom: 0.65rem;
    }

    .nc-home-gpu-table td.nc-home-gpu-table__action::before {
        content: none;
    }
}

/* Two-column utility band: popular comparisons beside the market snapshot. */
@media (min-width: 961px) {
    .nc-home-utility-pair {
        display: grid;
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
        align-items: stretch;
    }

    .nc-home-utility-pair > * {
        min-width: 0;
        height: 100%;
    }

    .nc-home-utility-pair > * + * {
        border-left: 1px solid var(--nc-border);
    }

    .nc-home-utility-pair .nc-wrap {
        width: calc(100% - 48px);
    }
}

/* Compact secondary-path row replacing the old destination card wall. */
.nc-home-secondary-paths {
    border-bottom: 1px solid var(--nc-border-soft);
    background: var(--nc-bg-elevated);
}

.nc-home-secondary-paths__row {
    display: flex;
    flex-wrap: wrap;
    gap: var(--nc-space-2) var(--nc-space-5);
    align-items: baseline;
    padding-block: var(--nc-space-4);
}

.nc-home-secondary-paths__label {
    color: var(--nc-text-muted);
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.nc-home-secondary-paths__row a {
    color: var(--nc-text-secondary);
    font-size: 0.92rem;
    font-weight: 700;
    text-decoration: none;
}

.nc-home-secondary-paths__row a:hover {
    color: var(--nc-link-hover);
}

.nc-home-arch-chips,
.nc-filter-chip-row,
.nc-vendor-pills {
    display: flex;
    flex-wrap: wrap;
    gap: var(--nc-space-2);
}

.nc-home-arch-chip {
    display: inline-flex;
    gap: 0.65rem;
    align-items: center;
    padding: 0.6rem 0.8rem;
    border: 1px solid var(--nc-border);
    border-radius: var(--nc-radius-sm);
    background: var(--nc-surface-1);
    color: var(--nc-text-secondary);
    text-decoration: none;
}

.nc-home-arch-chip:hover {
    border-color: var(--nc-nvidia);
    color: var(--nc-text-strong);
}

.nc-chip-count {
    color: var(--nc-text-muted);
    font: 700 0.72rem/1 var(--nc-font-mono);
}

/* Editorial archives and articles */

.nc-editorial-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--nc-space-5);
}

.nc-editorial-card {
    display: grid;
    grid-template-columns: 34% 1fr;
    min-height: 0;
    overflow: hidden;
    border: 1px solid var(--nc-border);
    border-radius: var(--nc-radius-md);
    background: var(--nc-surface-1);
    box-shadow: var(--nc-shadow-sm);
}

.nc-editorial-card--lead {
    grid-column: 1 / -1;
    grid-template-columns: 48% 1fr;
    min-height: 300px;
}

.nc-editorial-card:hover {
    border-color: var(--nc-border-strong);
    background: var(--nc-surface-2);
}

.nc-editorial-card__media {
    display: block;
    min-height: 100%;
    overflow: hidden;
    border-right: 1px solid var(--nc-border);
    background:
        linear-gradient(135deg, rgba(121, 208, 0, 0.09), transparent),
        var(--nc-surface-inset);
}

.nc-editorial-card__media img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    object-position: center;
}

.nc-editorial-card__body {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    padding: clamp(0.9rem, 1.6vw, 1.35rem);
}

.nc-editorial-card__eyebrow {
    display: flex;
    flex-wrap: wrap;
    gap: var(--nc-space-3);
    color: var(--nc-text-muted);
    font-size: 0.72rem;
    font-weight: 720;
    letter-spacing: 0.07em;
    text-transform: uppercase;
}

.nc-editorial-card__eyebrow span {
    color: var(--nc-link);
}

.nc-editorial-card__title {
    margin: var(--nc-space-2) 0 0;
    font-size: clamp(1.08rem, 1.5vw, 1.3rem);
    line-height: 1.25;
}

.nc-editorial-card--lead .nc-editorial-card__title {
    font-size: clamp(1.4rem, 2.2vw, 1.9rem);
    line-height: 1.18;
}

.nc-editorial-card__title a {
    color: var(--nc-text-strong);
    text-decoration: none;
}

.nc-editorial-card__body > p {
    margin: var(--nc-space-3) 0;
}

.navigation.pagination,
.ct-pagination {
    margin-top: var(--nc-space-7);
}

.navigation.pagination .nav-links,
.ct-pagination .page-numbers {
    display: flex;
    flex-wrap: wrap;
    gap: var(--nc-space-2);
}

.navigation.pagination a,
.navigation.pagination span,
.ct-pagination a,
.ct-pagination span {
    display: grid;
    min-width: 42px;
    min-height: 42px;
    padding: 0.55rem;
    border: 1px solid var(--nc-border);
    border-radius: var(--nc-radius-sm);
    background: var(--nc-surface-1);
    color: var(--nc-text-secondary);
    place-items: center;
}

.navigation.pagination .current,
.ct-pagination .current {
    border-color: var(--nc-nvidia);
    color: var(--nc-text-strong);
}

.nc-article-header {
    padding-block: clamp(2rem, 4vw, 3.25rem) var(--nc-space-5);
    border-bottom: 1px solid var(--nc-border-soft);
    background: linear-gradient(180deg, var(--nc-bg-elevated), var(--nc-bg));
}

.nc-article-header h1 {
    margin: var(--nc-space-3) 0 0;
    font-size: clamp(2rem, 3.4vw, 3.1rem);
    line-height: 1.12;
}

.nc-article-deck {
    margin: var(--nc-space-3) 0 0;
    color: var(--nc-text-secondary);
    font-size: clamp(1.08rem, 1.8vw, 1.3rem);
    line-height: 1.6;
}

.nc-article-meta {
    display: flex;
    flex-wrap: wrap;
    gap: var(--nc-space-2);
    margin-top: var(--nc-space-3);
    color: var(--nc-text-muted);
    font-size: 0.8rem;
    font-weight: 650;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.nc-article-meta a {
    color: var(--nc-text-secondary);
    text-decoration: none;
}

.nc-article-breadcrumb {
    display: flex;
    gap: var(--nc-space-2);
    overflow: hidden;
    margin-bottom: var(--nc-space-4);
    color: var(--nc-text-muted);
    font-size: 0.78rem;
    white-space: nowrap;
}

.nc-article-breadcrumb a,
.nc-article-breadcrumb span[aria-current="page"] {
    overflow: hidden;
    color: var(--nc-text-muted);
    text-overflow: ellipsis;
}

.nc-article-body {
    padding-block: var(--nc-space-7);
    color: var(--nc-text);
    font-size: clamp(1.0625rem, 1.25vw, 1.16rem);
    line-height: 1.72;
}

.nc-article-body p,
.nc-article-body li {
    color: var(--nc-text);
}

.nc-article-body p {
    margin-block: 0 1.35em;
}

.nc-article-body :where(h2, h3, h4) {
    scroll-margin-top: 96px;
}

.nc-article-body h2 {
    margin: 2.4em 0 0.75em;
    padding-top: 0.85em;
    border-top: 1px solid var(--nc-border);
    font-size: clamp(1.65rem, 2.8vw, 2.35rem);
}

.nc-article-body h3 {
    margin: 1.9em 0 0.65em;
    font-size: clamp(1.3rem, 2vw, 1.7rem);
}

.nc-article-body a:not(.wp-element-button) {
    color: var(--nc-link);
    text-decoration-thickness: 1px;
}

.nc-article-body :where(ul, ol) {
    margin: 0 0 1.5em;
    padding-left: 1.45em;
}

.nc-article-body li + li {
    margin-top: 0.4em;
}

.nc-article-body blockquote {
    margin: 2em 0;
    padding: var(--nc-space-4) var(--nc-space-5);
    border-left: 3px solid var(--nc-nvidia);
    background: var(--nc-surface-1);
    color: var(--nc-text-secondary);
}

.nc-article-body :where(pre, code) {
    font-family: var(--nc-font-mono);
}

.nc-article-body pre {
    max-width: 100%;
    overflow-x: auto;
    padding: var(--nc-space-5);
    border: 1px solid var(--nc-border);
    border-radius: var(--nc-radius-md);
    background: #080b09;
    color: #d9e7dc;
    font-size: 0.88em;
    line-height: 1.6;
}

.nc-article-body :not(pre) > code {
    padding: 0.14em 0.35em;
    border: 1px solid var(--nc-border);
    border-radius: 3px;
    background: var(--nc-surface-2);
    color: #d9e7dc;
    font-size: 0.88em;
}

.nc-article-body figcaption {
    margin-top: var(--nc-space-2);
    color: var(--nc-text-muted);
    font-size: 0.8rem;
    text-align: center;
}

.nc-article-tags {
    display: flex;
    flex-wrap: wrap;
    gap: var(--nc-space-2);
    padding-block: var(--nc-space-5);
    border-top: 1px solid var(--nc-border);
}

.nc-article-tags a {
    padding: 0.3rem 0.55rem;
    border: 1px solid var(--nc-border);
    border-radius: var(--nc-radius-sm);
    background: var(--nc-surface-1);
    color: var(--nc-text-muted);
    font-size: 0.75rem;
    text-decoration: none;
}

.nc-article-related-wrap {
    padding-bottom: var(--nc-space-8);
}

.nc-article-related {
    padding-top: var(--nc-space-7);
    border-top: 1px solid var(--nc-border);
    background: var(--nc-surface-1);
    color: var(--nc-text-secondary);
}

.nc-article-related__heading .nc-kicker {
    color: var(--nc-link);
}

.nc-article-related__heading h2 {
    color: var(--nc-text-strong);
}

.nc-article-related__grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: var(--nc-space-4);
}

.nc-article-related-card {
    overflow: hidden;
    border: 1px solid var(--nc-border);
    border-radius: var(--nc-radius-md);
    background: var(--nc-surface-2);
    color: var(--nc-text-secondary);
}

.nc-article-related-card__image {
    display: block;
    aspect-ratio: 4 / 3;
    overflow: hidden;
    border-bottom: 1px solid var(--nc-border);
}

.nc-article-related-card__image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.nc-article-related-card__body {
    padding: var(--nc-space-4);
}

.nc-article-related-card h3 {
    margin: 0;
    font-size: 1.05rem;
}

.nc-article-related-card h3 a {
    color: var(--nc-text-strong);
    text-decoration: none;
}

.nc-article-related-card p {
    margin: var(--nc-space-2) 0 0;
    color: var(--nc-text-secondary);
    font-size: 0.84rem;
}

.nc-article-next-actions {
    display: flex;
    flex-wrap: wrap;
    gap: var(--nc-space-2);
    margin-top: var(--nc-space-5);
}

.nc-article-related .nc-article-next-actions a {
    padding: 0.5rem 0.7rem;
    border: 1px solid var(--nc-border);
    border-radius: var(--nc-radius-sm);
    background: var(--nc-surface-inset);
    color: var(--nc-text-strong);
    text-decoration: none;
}

.nc-article-related .nc-article-next-actions a:hover,
.nc-article-related .nc-article-next-actions a:focus {
    border-color: var(--nc-link-hover);
    background: var(--nc-surface-3);
    color: var(--nc-link-hover);
}

/* GPU Wiki and detail pages */

.nc-gpu-wiki-page,
.nc-gpu-entry,
.nc-gpu-compare-page {
    --gpu-vendor-accent: var(--nc-nvidia);
}

.gpu-vendor-amd { --gpu-vendor-accent: var(--nc-amd); }
.gpu-vendor-ati { --gpu-vendor-accent: var(--nc-ati); }
.gpu-vendor-intel { --gpu-vendor-accent: var(--nc-intel); }
.gpu-vendor-others { --gpu-vendor-accent: var(--nc-other); }

.nc-gpu-wiki-hero {
    --nc-hero-accent: color-mix(in srgb, var(--gpu-vendor-accent) 10%, transparent);
    background:
        linear-gradient(90deg, var(--nc-hero-accent), transparent 50%),
        linear-gradient(180deg, #111713, #0b0f0c);
}

.nc-gpu-wiki-utility {
    border-bottom: 1px solid var(--nc-border);
    background: var(--nc-bg);
}

.nc-gpu-wiki-utility > .nc-wrap {
    display: grid;
    gap: var(--nc-space-3);
    padding-block: var(--nc-space-3);
}

.nc-gpu-wiki-utility .nc-hero-actions {
    margin-top: 0;
}

/* One-row quick-browse rail; scrolls horizontally instead of wrapping. */
.nc-quick-browse {
    display: flex;
    align-items: center;
    gap: var(--nc-space-3);
    min-width: 0;
}

.nc-quick-browse__label {
    flex: 0 0 auto;
    color: var(--nc-text-muted);
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.nc-quick-browse__rail {
    display: flex;
    flex: 1 1 auto;
    flex-wrap: nowrap;
    gap: var(--nc-space-2);
    overflow-x: auto;
    padding-bottom: 2px;
    scrollbar-width: thin;
    scrollbar-color: var(--nc-border-strong) transparent;
}

.nc-quick-browse__rail .nc-filter-chip {
    flex: 0 0 auto;
    white-space: nowrap;
}

/* "All filters" disclosure summary, shared across viewports. */
.nc-wiki-filters > summary {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    width: fit-content;
    cursor: pointer;
    color: var(--nc-text-secondary);
    font-size: 0.88rem;
    font-weight: 800;
    list-style: none;
}

.nc-wiki-filters > summary::-webkit-details-marker {
    display: none;
}

.nc-wiki-filters > summary::before {
    content: "";
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 5px 0 5px 6px;
    border-color: transparent transparent transparent currentColor;
    transition: transform 0.15s ease;
}

.nc-wiki-filters[open] > summary::before {
    transform: rotate(90deg);
}

.nc-wiki-filters > summary:hover,
.nc-wiki-filters > summary:focus-visible {
    color: var(--nc-link-hover);
}

.nc-wiki-filters[open] > summary {
    margin-bottom: var(--nc-space-3);
}

.nc-results-count {
    flex: 0 0 auto;
    align-self: center;
    padding: 0.25rem 0.6rem;
    border: 1px solid var(--nc-border-strong);
    border-radius: 999px;
    background: var(--nc-surface-2);
    color: var(--nc-text-secondary);
    font-size: 0.8rem;
    font-weight: 800;
    white-space: nowrap;
}

.nc-vendor-blurb-wrap,
.nc-wiki-filters,
.nc-filter-select-panel,
.nc-gpu-controls {
    border-color: var(--nc-border);
    background: var(--nc-surface-1);
    color: var(--nc-text-secondary);
}

/* The controls bar was a five-column grid sized around a search field that no
   longer renders on the main archive. Flex keeps sort, per-page, view toggle,
   and reset on one vertically centered row, with reset pinned to the right,
   and adapts when taxonomy hubs still include their search form. */
.nc-gpu-controls {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--nc-space-2) var(--nc-space-5);
}

/* No-JS fallback submit buttons: the selects auto-submit on change once the
   enhancement script runs. !important is required because the global
   body.nc-site button rule above outranks the .nc-js hide in nvidia-club.css
   on both specificity and source order. */
html.nc-js .nc-gpu-sort-control button[type="submit"],
html.nc-js .nc-gpu-per-page-control button[type="submit"] {
    display: none !important;
}

/* Visible label for the Cards/Table toggle so it lines up with the other
   labelled controls in the bar. */
.nc-gpu-view-control {
    display: flex;
    align-items: center;
    gap: 0.55rem;
}

.nc-gpu-view-label {
    color: var(--nc-text-secondary);
    font-weight: 800;
}

.nc-gpu-controls .nc-gpu-search-control {
    flex: 1 1 300px;
}

.nc-gpu-controls .nc-view-toggle,
.nc-gpu-controls .nc-filter-reset {
    align-self: center;
}

.nc-gpu-controls .nc-filter-reset {
    margin-left: auto;
}

@media (max-width: 620px) {
    .nc-gpu-controls .nc-gpu-sort-control,
    .nc-gpu-controls .nc-gpu-per-page-control {
        flex: 1 1 100%;
    }

    .nc-gpu-controls .nc-filter-reset {
        margin-left: 0;
    }
}

.nc-vendor-pill,
.nc-filter-chip {
    color: var(--nc-text-secondary);
    text-decoration: none;
}

.nc-vendor-pill:hover,
.nc-vendor-pill.is-active {
    border-color: var(--vendor-tab-accent, var(--gpu-vendor-accent));
    background: var(--nc-surface-3);
    color: var(--nc-text-strong);
}

.nc-filter-chip:hover,
.nc-filter-chip.is-active {
    border-color: var(--gpu-vendor-accent);
    background: var(--nc-surface-3);
    color: var(--nc-text-strong);
}

/* Keep keyboard focus visible without stacking a second vendor outline on hover. */
body.nc-site .nc-vendor-pill:focus-visible {
    border-color: var(--vendor-tab-accent, var(--gpu-vendor-accent));
    outline: 2px solid var(--nc-focus);
    outline-offset: 2px;
    box-shadow: none;
}

.nc-gpu-hero-search-control {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: var(--nc-space-2);
    max-width: 760px;
    border: 0;
    background: transparent;
}

.nc-gpu-hero-search-control label {
    display: block;
    min-width: 0;
}

.nc-gpu-hero-search-control input[type="search"] {
    width: 100%;
}

.nc-gpu-hero-search-control .nc-search-suggestions {
    grid-column: 1 / -1;
}

.nc-gpu-card {
    position: relative;
    overflow: hidden;
    border: 1px solid var(--nc-border);
    border-top: 3px solid var(--gpu-vendor-accent);
    border-radius: var(--nc-radius-md);
    background: var(--nc-surface-1);
    box-shadow: var(--nc-shadow-sm);
}

.nc-gpu-card:hover {
    border-color: var(--gpu-vendor-accent);
    background: var(--nc-surface-2);
    transform: translateY(-2px);
}

.nc-gpu-card__body {
    color: var(--nc-text-secondary);
}

.nc-gpu-card__title,
.nc-gpu-card__title a,
.nc-gpu-card__link {
    color: var(--nc-text-strong);
}

.nc-gpu-card__meta,
.nc-gpu-card__excerpt,
.nc-gpu-card__specs {
    color: var(--nc-text-muted);
}

.nc-gpu-card__chips .nc-badge,
.nc-gpu-card__badges .nc-badge {
    border-color: color-mix(in srgb, var(--gpu-vendor-accent) 45%, var(--nc-border));
    background: color-mix(in srgb, var(--gpu-vendor-accent) 7%, var(--nc-surface-2));
    color: var(--nc-text-secondary);
}

.nc-gpu-header {
    margin-bottom: var(--nc-space-4);
    padding: clamp(1rem, 2vw, 1.5rem);
    border: 1px solid var(--nc-border);
    border-left: 4px solid var(--gpu-vendor-accent);
    border-radius: var(--nc-radius-md);
    background:
        linear-gradient(115deg, color-mix(in srgb, var(--gpu-vendor-accent) 8%, transparent), transparent 45%),
        var(--nc-surface-1);
    box-shadow: var(--nc-shadow-sm);
}

.nc-gpu-header h1 {
    margin: var(--nc-space-2) 0 0;
    font-size: var(--nc-utility-h1);
    line-height: 1.1;
}

.nc-gpu-breadcrumb {
    color: var(--nc-text-muted);
}

.nc-gpu-excerpt {
    color: var(--nc-text-secondary);
    font-size: 1.05rem;
}

/* Key-metrics strip: the PHP renderer keeps this to the six or seven
   highest-value values; the full data lives in the spec table below. */
.nc-at-a-glance {
    display: block;
    padding: var(--nc-space-3);
    border: 1px solid var(--nc-border);
    border-radius: var(--nc-radius-md);
    background: var(--nc-surface-2);
}

.nc-at-a-glance h2 {
    margin: 0 0 var(--nc-space-2);
    font-size: 0.98rem;
}

.nc-at-a-glance dl {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    gap: 1px;
    margin: 0;
    overflow: hidden;
    border: 1px solid var(--nc-border);
    border-radius: var(--nc-radius-md);
    background: var(--nc-border);
}

.nc-glance-item {
    min-height: 0;
    padding: 0.5rem 0.7rem;
    border: 0;
    background: var(--nc-surface-inset);
}

.nc-glance-item dt {
    margin: 0 0 0.3rem;
    color: var(--nc-text-muted);
    font-size: 0.72rem;
    font-weight: 750;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.nc-glance-item dd {
    margin: 0;
    color: var(--nc-text-strong);
    font-size: 0.98rem;
    font-weight: 700;
}

.nc-confidence-banner,
.nc-status-note {
    border: 1px solid color-mix(in srgb, var(--nc-warning) 45%, var(--nc-border));
    background: color-mix(in srgb, var(--nc-warning) 8%, var(--nc-surface-1));
    color: #e8d7ad;
}

.nc-confidence-banner--verified {
    border-color: color-mix(in srgb, var(--nc-success) 45%, var(--nc-border));
    background: color-mix(in srgb, var(--nc-success) 8%, var(--nc-surface-1));
    color: #cae8d3;
}

.nc-section-nav,
.nc-gpu-compare-cta,
.nc-gpu-note,
.nc-gpu-reviews,
.nc-related-gpus,
.nc-source-list,
.nc-gpu-board-partners,
.nc-correction-box,
.nc-series-overview,
.nc-series-facts,
.nc-architecture-overview,
.nc-architecture-facts {
    border-color: var(--nc-border);
    background: var(--nc-surface-1);
    color: var(--nc-text-secondary);
}

/* Hub quick facts: compact panels above the inventory. */
.nc-series-facts,
.nc-architecture-facts {
    margin-bottom: var(--nc-space-3);
    padding: var(--nc-space-3);
}

.nc-series-facts h2,
.nc-architecture-facts h2 {
    margin-bottom: var(--nc-space-2);
    font-size: 0.98rem;
}

/* Single-row fact strip used above the inventory (no heading, short values). */
.nc-facts-strip {
    padding: var(--nc-space-2) var(--nc-space-3);
}

.nc-facts-strip dl {
    display: flex;
    flex-wrap: wrap;
    gap: var(--nc-space-2) var(--nc-space-6);
}

.nc-facts-strip .nc-architecture-fact {
    border-left: 3px solid var(--gpu-vendor-accent, var(--nc-nvidia));
    padding-left: 0.6rem;
}

.nc-masthead-context-link {
    margin-top: var(--nc-space-2);
}

.nc-masthead-context-link a {
    font-size: 0.85rem;
    font-weight: 700;
}

.nc-hub-context {
    border-top: 1px solid var(--nc-border-soft);
}

.nc-gpu-layout {
    background: transparent;
}

.nc-gpu-sidebar {
    background: transparent;
}

.nc-spec-table-wrap {
    border: 0;
    background: transparent;
}

.nc-spec-table-heading,
.nc-spec-table .nc-spec-group > th,
.nc-compare-table .nc-compare-section-row > th {
    background: var(--nc-surface-3);
    color: var(--nc-text-strong);
}

.nc-gpu-review-card,
.nc-partner-card,
.nc-related-details,
.nc-source-details,
.nc-gpu-review-details {
    border-color: var(--nc-border);
    background: var(--nc-surface-2);
    color: var(--nc-text-secondary);
}

.nc-partner-card {
    border-top-color: var(--gpu-vendor-accent);
}

/* Compare tool */

.nc-gpu-compare-form,
.nc-compare-results,
.nc-compare-blank-state,
.nc-compare-key-diffs {
    border: 1px solid var(--nc-border);
    border-radius: var(--nc-radius-md);
    background: var(--nc-surface-1);
    color: var(--nc-text-secondary);
}

.nc-gpu-compare-form {
    padding: var(--nc-space-4);
}

.nc-compare-selector-grid {
    gap: var(--nc-space-3);
}

.nc-compare-slot,
.nc-compare-optional {
    border-color: var(--nc-border);
    background: var(--nc-surface-inset);
}

.nc-compare-selector label,
.nc-compare-optional summary {
    color: var(--nc-text-secondary);
}

.nc-compare-selected {
    border-color: var(--gpu-vendor-accent);
    background: color-mix(in srgb, var(--gpu-vendor-accent) 8%, var(--nc-surface-2));
    color: var(--nc-text);
}

/* Loaded-state selected-GPU strip: compact identification chips plus the
   secondary compare actions, shown instead of leading with the builder. */
.nc-compare-strip {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: var(--nc-space-2) var(--nc-space-3);
    margin-bottom: var(--nc-space-3);
}

.nc-compare-strip__list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    gap: var(--nc-space-2);
}

.nc-compare-strip__item {
    display: inline-flex;
    align-items: center;
    gap: 0.55rem;
    border: 1px solid var(--nc-border);
    border-radius: var(--nc-radius-md);
    background: var(--nc-surface-1);
    padding: 0.35rem 0.5rem 0.35rem 0.8rem;
}

.nc-compare-strip__id {
    display: flex;
    flex-direction: column;
    line-height: 1.25;
}

.nc-compare-strip__name {
    font-weight: 800;
    font-size: 0.95rem;
    color: var(--nc-text);
    text-decoration: none;
}

.nc-compare-strip__name:hover,
.nc-compare-strip__name:focus-visible {
    color: var(--nc-link);
}

.nc-compare-strip__meta {
    font-size: 0.76rem;
    color: var(--nc-text-muted);
}

.nc-compare-strip__remove {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border: 1px solid var(--nc-border);
    border-radius: 50%;
    color: var(--nc-text-secondary);
    background: var(--nc-surface-inset);
    text-decoration: none;
    font-size: 1rem;
    line-height: 1;
}

.nc-compare-strip__remove:hover,
.nc-compare-strip__remove:focus-visible {
    border-color: var(--nc-danger);
    color: var(--nc-danger);
}

.nc-compare-strip__actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--nc-space-2);
}

.nc-compare-action-btn--tertiary {
    border-color: transparent;
    background: transparent;
    color: var(--nc-text-muted);
}

.nc-compare-action-btn--tertiary:hover,
.nc-compare-action-btn--tertiary:focus-visible {
    color: var(--nc-danger);
    border-color: var(--nc-border);
}

/* Edit GPUs disclosure wrapping the full selector form in the loaded state. */
.nc-compare-editor {
    margin-bottom: var(--nc-space-3);
}

.nc-compare-editor__summary {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    min-height: 40px;
    padding: 0.45rem 0.95rem;
    border: 1px solid var(--gpu-vendor-accent, var(--nc-nvidia));
    border-radius: var(--nc-radius-md);
    background: color-mix(in srgb, var(--gpu-vendor-accent, var(--nc-nvidia)) 14%, var(--nc-surface-1));
    color: var(--nc-text-strong);
    font-weight: 800;
    cursor: pointer;
    list-style: none;
    width: fit-content;
}

.nc-compare-editor__summary::-webkit-details-marker {
    display: none;
}

.nc-compare-editor__summary::before {
    content: '';
    border-style: solid;
    border-width: 5px 0 5px 7px;
    border-color: transparent transparent transparent currentColor;
    transition: transform 0.15s ease;
}

.nc-compare-editor[open] > .nc-compare-editor__summary::before {
    transform: rotate(90deg);
}

.nc-compare-editor__summary:hover,
.nc-compare-editor__summary:focus-visible {
    border-color: var(--nc-link);
    outline: none;
}

.nc-compare-editor__summary:focus-visible {
    box-shadow: 0 0 0 2px var(--nc-focus);
}

.nc-compare-editor__panel {
    margin-top: var(--nc-space-2);
}

@media (prefers-reduced-motion: reduce) {
    .nc-compare-editor__summary::before {
        transition: none;
    }
}

.nc-compare-results {
    margin-top: var(--nc-space-4);
    padding: var(--nc-space-4);
}

.nc-compare-table-wrap {
    border-color: var(--nc-border);
    background: var(--nc-surface-inset);
}

.nc-compare-view-controls,
.nc-compare-legend {
    border-color: var(--nc-border);
    background: var(--nc-surface-inset);
    color: var(--nc-text-muted);
}

.nc-compare-table {
    min-width: 760px;
}

.nc-compare-table thead th {
    /* Vertical stickiness lives on .nc-compare-sticky-head instead: this row's
       own overflow-x:auto ancestor forces overflow-y:auto too, which silently
       defeats position: sticky here (confirmed by measuring rendered position
       during scroll: it moved 1:1 with the page like a static cell). */
    border-bottom: 2px solid var(--nc-border-strong);
    background: var(--nc-surface-3);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.22);
}

.nc-compare-table tr > :first-child {
    position: sticky;
    z-index: 2;
    left: 0;
    min-width: 190px;
    background: var(--nc-surface-2);
    box-shadow: 1px 0 var(--nc-border);
}

.nc-compare-table thead tr > :first-child {
    z-index: 5;
    background: var(--nc-surface-3);
}

/* Page-level sticky clone of the table's <thead>, built and kept in sync by
   gpu-compare.js (initStickyCompareHeader). Sits outside .nc-compare-table-wrap
   so its own position: sticky resolves against the page, not the horizontally
   scrolling wrapper. Shown/hidden and horizontally synced entirely in JS;
   aria-hidden since the real <thead> stays the single accessible source.
   height: 0 + overflow: visible keeps this element's own contribution to
   document flow at zero at all times, whether engaged or not -- toggling
   [hidden] would otherwise insert/remove its real (~50px) height right
   before the scroll position the user is already past, shifting the page
   and, worse, feeding back into the IntersectionObserver as a scroll event
   that immediately disengaged it again (confirmed: a stepped scroll trace
   showed scrollY snapping backward and [hidden] flipping repeatedly). The
   visual chrome moved onto __scroller, which has its own real height and
   escapes the 0-height parent purely via overflow: visible painting. */
.nc-compare-sticky-head {
    position: sticky;
    top: 0;
    z-index: 20;
    height: 0;
    overflow: visible;
}

.nc-compare-sticky-head[hidden] {
    display: none;
}

.nc-compare-sticky-head__scroller {
    overflow: hidden;
    width: 100%;
    border-bottom: 2px solid var(--nc-border-strong);
    background: var(--nc-surface-3);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.22);
}

.nc-compare-sticky-head .nc-compare-table {
    margin: 0;
    border-bottom: 0;
}

.nc-compare-sticky-head .nc-compare-table thead th {
    border-bottom: 0;
    box-shadow: none;
}

.nc-compare-section-row > th:first-child,
.nc-compare-section-row > td {
    /* A plain single-column th (see comparison.php) needs no position
       override at all: it already matches .nc-compare-table tr > :first-
       child (sticky, left: 0) exactly, unlike the old full-width <th
       colspan>, which position: sticky never actually stuck to (confirmed
       by measuring its rendered position while scrolling: it moved 1:1
       with scroll like a static cell, in both Chromium and WebKit). The
       filler <td> spanning the remaining GPU columns just needs the same
       background so the row reads as one continuous band. */
    background: var(--nc-surface-3);
}

.nc-compare-brand-badge,
.nc-compare-vendor-term {
    color: var(--nc-text-muted);
}

.nc-compare-cell--better {
    background: color-mix(in srgb, var(--nc-info) 8%, transparent);
}

.nc-compare-cell--unknown,
.nc-compare-cell--not-applicable,
.nc-compare-cell--incompatible {
    color: var(--nc-text-muted);
    background: rgba(255, 255, 255, 0.018);
}

.nc-compare-bar {
    background: color-mix(in srgb, var(--nc-info) 35%, transparent);
}

/* Preset pills keep the split vendor border: the left half of the border is
   GPU 1's vendor color and the right half GPU 2's, driven by the
   data-vendor-a/b custom properties set in nvidia-club.css. The border must
   stay transparent and the interior an opaque gradient layer; a plain
   border-color or flat background here paints over the split and flattens
   every pill to gray (the regression this rule replaces). */
.nc-compare-preset-card {
    border: 2px solid transparent;
    background:
        linear-gradient(var(--nc-surface-1), var(--nc-surface-1)) padding-box,
        linear-gradient(to right, var(--nc-va-color, var(--nc-border-strong)) 50%, var(--nc-vb-color, var(--nc-border-strong)) 50%) border-box;
    color: var(--nc-text-secondary);
}

.nc-compare-preset-card:hover,
.nc-compare-preset-card:focus-visible {
    background:
        linear-gradient(var(--nc-surface-2), var(--nc-surface-2)) padding-box,
        linear-gradient(to right, var(--nc-va-color, var(--nc-border-strong)) 50%, var(--nc-vb-color, var(--nc-border-strong)) 50%) border-box;
    color: var(--nc-text-strong);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--nc-va-color, var(--nc-border-strong)) 18%, transparent);
}

/* Homepage spotlight pills: same split border, interiors on the current dark
   palette (the legacy layer uses a blue-toned #141c25 interior). */
.nc-home-compare-spotlight .nc-compare-preset-card {
    background:
        linear-gradient(var(--nc-surface-1), var(--nc-surface-1)) padding-box,
        linear-gradient(to right, var(--nc-va-color, var(--nc-border-strong)) 50%, var(--nc-vb-color, var(--nc-border-strong)) 50%) border-box;
    color: var(--nc-text);
}

.nc-home-compare-spotlight .nc-compare-preset-card:hover,
.nc-home-compare-spotlight .nc-compare-preset-card:focus-visible {
    background:
        linear-gradient(var(--nc-surface-2), var(--nc-surface-2)) padding-box,
        linear-gradient(to right, var(--nc-va-color, var(--nc-border-strong)) 50%, var(--nc-vb-color, var(--nc-border-strong)) 50%) border-box;
    color: var(--nc-text-strong);
}

/* Scoped wpForo integration. The forum plugin owns behavior and layout. */

.nc-forums-shell {
    max-width: var(--nc-content-width);
}

.nc-forum-intro {
    margin-bottom: var(--nc-space-5);
    padding: var(--nc-space-5);
    border-left: 3px solid var(--nc-nvidia);
    background: var(--nc-surface-1);
}

.nc-forum-intro > :last-child {
    margin-bottom: 0;
}

.nc-forum-intro p {
    color: var(--nc-text-secondary);
}

/* Closed posting-guidance disclosure between the hero and the forum list,
   and the shared compact warning callout (retro legacy-buying warning). */
.nc-forum-help,
.nc-callout-details {
    margin: 0 0 var(--nc-space-4);
    border: 1px solid var(--nc-border);
    border-radius: var(--nc-radius-md);
    background: var(--nc-surface-1);
    padding: var(--nc-space-2) var(--nc-space-4);
}

.nc-callout-details {
    margin: var(--nc-space-4) 0;
    border-color: color-mix(in srgb, var(--nc-warning) 45%, var(--nc-border));
    background: color-mix(in srgb, var(--nc-warning) 8%, var(--nc-surface-1));
}

.nc-forum-help > summary,
.nc-callout-details > summary {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    cursor: pointer;
    font-weight: 800;
    font-size: 0.92rem;
    color: var(--nc-text);
    list-style: none;
}

.nc-forum-help > summary::-webkit-details-marker,
.nc-callout-details > summary::-webkit-details-marker {
    display: none;
}

.nc-forum-help > summary::before,
.nc-callout-details > summary::before {
    content: '';
    border-style: solid;
    border-width: 4px 0 4px 6px;
    border-color: transparent transparent transparent currentColor;
    transition: transform 0.15s ease;
}

.nc-forum-help[open] > summary::before,
.nc-callout-details[open] > summary::before {
    transform: rotate(90deg);
}

.nc-forum-help > summary:focus-visible,
.nc-callout-details > summary:focus-visible {
    outline: 2px solid var(--nc-focus);
    outline-offset: 2px;
}

.nc-forum-help p,
.nc-callout-details p {
    margin: var(--nc-space-2) 0 0;
    color: var(--nc-text-secondary);
}

@media (prefers-reduced-motion: reduce) {
    .nc-forum-help > summary::before,
    .nc-callout-details > summary::before {
        transition: none;
    }
}

body.page-id-5209 #wpforo #wpforo-wrap {
    border: 1px solid var(--nc-border);
    border-radius: var(--nc-radius-md);
    background: var(--nc-surface-1);
    color: var(--nc-text-secondary);
    font-family: var(--nc-font-sans);
}

body.page-id-5209 #wpforo #wpforo-wrap :where(#wpforo-menu, .wpforo-category, .wpforo-forum, .wpforo-topic, .wpforo-post, .wpf-head-bar, .wpf-thread, .wpf-post-wrap, .wpf-topic-wrap, .wpforo-profile-wrap, .wpf-form-wrapper) {
    border-color: var(--nc-border);
    background-color: var(--nc-surface-1);
    color: var(--nc-text-secondary);
}

body.page-id-5209 #wpforo #wpforo-wrap :where(.wpforo-category, .wpf-head-bar, .wpforo-post-head, .wpf-thread-head, .wpforo-forum-icon) {
    background-color: var(--nc-surface-2);
}

body.page-id-5209 #wpforo #wpforo-wrap :where(a, .wpf-link) {
    color: var(--nc-link);
}

body.page-id-5209 #wpforo #wpforo-wrap :where(h1, h2, h3, h4, strong, .wpf-title, .wpforo-forum-title) {
    color: var(--nc-text-strong);
}

body.page-id-5209 #wpforo #wpforo-wrap :where(input, textarea, select) {
    border-color: var(--nc-border-strong);
    background: var(--nc-surface-inset);
    color: var(--nc-text);
}

body.page-id-5209 #wpforo #wpforo-wrap :where(.wpf-button, button, input[type="submit"]) {
    border-color: var(--nc-nvidia);
    background: var(--nc-nvidia);
    color: #071000;
}

body.page-id-5209 #wpforo #wpforo-wrap :where(.wpfbg-3, .wpfbg-9) {
    background-color: var(--nc-surface-1) !important;
}

body.page-id-5209 #wpforo #wpforo-wrap :where(.wpfbg-7) {
    background-color: var(--nc-border) !important;
}

body.page-id-5209 #wpforo #wpforo-wrap :where(.wpfcl-1, .wpfcl-2) {
    color: var(--nc-text-secondary) !important;
}

body.page-id-5209 #wpforo #wpforo-wrap :where(.wpfcl-3) {
    color: var(--nc-text-strong) !important;
    fill: var(--nc-text-strong) !important;
}

body.page-id-5209 #wpforo #wpforo-wrap :where(.wpfcl-a, .wpfcl-b) {
    color: var(--nc-link) !important;
}

body.page-id-5209 #wpforo-wrap #wpforo-menu,
body.page-id-5209 #wpforo-wrap #wpf-menu,
body.page-id-5209 #wpforo-wrap #wpf-menu > li,
body.page-id-5209 #wpforo-wrap #wpf-menu > li > a,
body.page-id-5209 #wpforo-wrap .wpforo-subtop,
body.page-id-5209 #wpforo-wrap .wpforo-cat-panel {
    border-color: var(--nc-border) !important;
    background-color: var(--nc-surface-1) !important;
    color: var(--nc-text-secondary) !important;
}

body.page-id-5209 #wpforo-wrap #wpf-menu > li > a:hover,
body.page-id-5209 #wpforo-wrap #wpf-menu > li.wpforo-active > a,
body.page-id-5209 #wpforo-wrap .wpforo-cat-panel {
    background-color: var(--nc-surface-2) !important;
    color: var(--nc-text-strong) !important;
}

body.page-id-5209 #wpforo-wrap :where(.cat-name, #wpforo-title, .wpf-breadcrumb a) {
    color: var(--nc-text-strong) !important;
}

body.page-id-5209 #wpforo-wrap .wpf-breadcrumb div,
body.page-id-5209 #wpforo-wrap .wpf-breadcrumb div.active,
body.page-id-5209 #wpforo-wrap .wpf-breadcrumb div:hover,
body.page-id-5209 #wpforo-wrap .wpf-breadcrumb div::after,
body.page-id-5209 #wpforo-wrap .wpf-breadcrumb div.active::after,
body.page-id-5209 #wpforo-wrap .wpf-breadcrumb div:hover::after {
    border-color: var(--nc-border) !important;
    background: var(--nc-surface-1) !important;
}

/* Contrast hardening for legacy light-theme selectors that still carry
   foreground or surface colors into the shared dark product shell. */
.nc-gpu-controls label,
.nc-gpu-breadcrumb,
.nc-gpu-breadcrumb span,
.nc-gpu-breadcrumb strong,
.nc-architecture-facts dt,
.nc-series-facts dt {
    color: var(--nc-text-secondary);
}

.nc-view-toggle {
    border-color: var(--nc-border-strong);
    background: var(--nc-surface-inset);
}

.nc-view-toggle a {
    background: var(--nc-surface-1);
    color: var(--nc-text-secondary);
}

.nc-view-toggle a + a {
    border-left-color: var(--nc-border-strong);
}

.nc-view-toggle a:hover,
.nc-view-toggle a:focus,
.nc-view-toggle a.is-active {
    background: var(--nc-surface-3);
    color: var(--nc-text-strong);
}

.nc-section-nav a {
    border-color: var(--nc-border-strong);
    background: var(--nc-surface-2);
    color: var(--nc-text-secondary);
}

.nc-section-nav a:hover,
.nc-section-nav a:focus {
    border-color: var(--gpu-vendor-accent);
    background: var(--nc-surface-3);
    color: var(--nc-text-strong);
}

.nc-source-summary-title,
.nc-gpu-review-summary-title,
.nc-related-summary-title {
    color: var(--nc-text-strong);
}

.nc-gpu-entry .nc-badge--vendor-mixed {
    color: var(--nc-text-secondary);
}

.nc-spec-help-link {
    color: var(--nc-link);
}

.nc-compare-blank-state__intro p,
.nc-compare-blank-state__steps li,
.nc-compare-blank-state__steps span,
.nc-compare-key-diffs__list li {
    color: var(--nc-text-secondary);
}

body.page-id-5209 #wpforo-wrap :where(.wpf-footer-box, .wpf-footer-box.wpf-last-info) {
    border-color: var(--nc-border) !important;
    background: var(--nc-surface-inset) !important;
    color: var(--nc-text-secondary) !important;
}

body.page-id-5209 #wpforo-wrap :where(.wpf-tt-sticky, .wpforo-last-topic-date, .wpf-by, .wpf-stat-value, .wpf-stat-label, .wpf-last-info span) {
    color: var(--nc-text-secondary) !important;
}

body.page-id-5209 #wpforo-wrap :where(.wpf-sbtn-title span, .wpf-footer-title span) {
    color: var(--nc-text-secondary) !important;
}

body.page-id-5209 #wpforo #wpforo-wrap a.wpf-button,
body.page-id-5209 #wpforo #wpforo-wrap a.wpf-button:hover,
body.page-id-5209 #wpforo #wpforo-wrap a.wpf-button:focus {
    border-color: var(--nc-nvidia) !important;
    background: var(--nc-nvidia) !important;
    color: #071000 !important;
}

body.page-id-5209 #wpforo #wpforo-wrap a.wpf-button :where(span, i) {
    color: #071000 !important;
}

/* wpForo palette correction: the plugin ships blue accents, red pins, and
   per-usergroup inline colors that fight the dark green theme. Everything is
   scoped to the forums page; !important is required where wpForo uses inline
   styles or its own !important palette classes. */
body.page-id-5209 #wpforo .wpforo-category,
body.page-id-5209 #wpforo .wpf-footer-title {
    border-bottom-color: var(--nc-nvidia) !important;
}

body.page-id-5209 #wpforo i.fa-search,
body.page-id-5209 #wpforo i.fa-bars,
body.page-id-5209 #wpforo i.fa-navicon,
body.page-id-5209 #wpforo i.fa-comments,
body.page-id-5209 #wpforo .wpf-item-element,
body.page-id-5209 #wpforo .wpf-item-element a {
    color: var(--nc-link) !important;
}

/* Pinned, hot, and announcement markers: amber instead of alarm red. The
   doubled #wpforo #wpforo-wrap outranks wpForo's own two-id palette rules. */
body.page-id-5209 #wpforo i.fa-thumbtack,
body.page-id-5209 #wpforo i.fa-fire-flame-curved,
body.page-id-5209 #wpforo i.fa-exclamation-circle,
body.page-id-5209 #wpforo #wpforo-wrap i.fa-thumbtack,
body.page-id-5209 #wpforo #wpforo-wrap i.fa-fire-flame-curved,
body.page-id-5209 #wpforo #wpforo-wrap i.fa-exclamation-circle {
    color: var(--nc-warning) !important;
}

/* Usergroup names carry inline red from wpForo settings. */
body.page-id-5209 #wpforo a[style*="#FF3333"],
body.page-id-5209 #wpforo a[style*="#ff3333"] {
    color: var(--nc-link) !important;
}

/* Forum icon rings are inline-styled blue circles; topic-state boxes use
   dotted gray borders. Both become quiet theme borders. */
body.page-id-5209 #wpforo .wpforo-forum-icon > div {
    border-color: var(--nc-border-strong) !important;
}

body.page-id-5209 #wpforo .wpforo-forum-icon i {
    color: var(--nc-text-secondary) !important;
}

body.page-id-5209 #wpforo div[style*="dotted"],
body.page-id-5209 #wpforo div[style*="dashed"] {
    border-style: solid !important;
    border-color: var(--nc-border-strong) !important;
}

body.nc-site .entry-content a:not(.nc-button):not(.wp-block-button__link) {
    color: var(--nc-link);
}

body.nc-site .entry-content a:not(.nc-button):not(.wp-block-button__link):hover,
body.nc-site .entry-content a:not(.nc-button):not(.wp-block-button__link):focus {
    color: var(--nc-link-hover);
}

/* Responsive and motion */

@media (max-width: 1180px) {
    body.nc-site #header .menu > li > a,
    body.nc-site #header .ct-menu-link {
        padding-inline: 0.45rem;
        font-size: 0.7rem;
    }

    .nc-editorial-grid {
        grid-template-columns: 1fr;
    }

    .nc-editorial-card--lead {
        grid-column: auto;
    }
}

@media (max-width: 960px) {
    .nc-home-hero__inner {
        grid-template-columns: 1fr;
    }

    .nc-home-hero__search {
        max-width: 680px;
    }

    .nc-home-pillars__grid,
    .nc-article-grid,
    .nc-gpu-grid,
    .nc-start-grid,
    .nc-article-related__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .nc-site-footer__grid {
        grid-template-columns: 1fr 1fr;
    }

    .nc-site-footer__legal {
        grid-column: 1 / -1;
    }
}

@media (max-width: 760px) {
    :root {
        --nc-space-8: 2.75rem;
        --nc-masthead-pad: 1.1rem;
    }

    .nc-wrap,
    .nc-reading-column {
        width: min(calc(100% - 28px), var(--nc-content-width));
    }

    body.nc-site #header .ct-container {
        width: min(calc(100% - 28px), var(--nc-content-width));
        min-height: 56px;
    }

    body.nc-site #header .site-logo-container img,
    body.nc-site #header .custom-logo-link img {
        max-width: 160px;
        height: 36px;
    }

    .nc-page-hero h1,
    .nc-archive-header h1,
    .nc-compare-header h1 {
        font-size: clamp(1.55rem, 7vw, 2rem);
    }

    .nc-article-header h1 {
        font-size: clamp(1.85rem, 8.5vw, 2.35rem);
    }

    .nc-home-hero__inner {
        padding-block: 1.5rem;
    }

    .nc-home-hero__h1 {
        font-size: clamp(1.8rem, 8.5vw, 2.35rem);
    }

    .nc-home-pillars__grid,
    .nc-article-grid,
    .nc-gpu-grid,
    .nc-start-grid,
    .nc-article-related__grid,
    .nc-hub-grid,
    .nc-site-footer__grid {
        grid-template-columns: 1fr;
    }

    .nc-home-proof {
        width: min(calc(100% - 28px), var(--nc-content-width));
    }

    .nc-home-pillars__grid > a {
        border-right: 0;
        border-bottom: 1px solid var(--nc-border);
    }

    .nc-home-pillars__grid > a:last-child {
        border-bottom: 0;
    }

    .nc-home-section-head {
        align-items: flex-start;
        flex-direction: column;
    }

    .nc-editorial-card,
    .nc-editorial-card--lead {
        grid-template-columns: 1fr;
        min-height: 0;
    }

    .nc-editorial-card__media {
        min-height: auto;
        aspect-ratio: 4 / 3;
        border-right: 0;
        border-bottom: 1px solid var(--nc-border);
    }

    .nc-editorial-card--lead .nc-editorial-card__title {
        font-size: clamp(1.4rem, 7vw, 2rem);
    }

    .nc-article-body {
        padding-block: var(--nc-space-6) var(--nc-space-7);
        font-size: 1.05rem;
        line-height: 1.7;
    }

    .nc-gpu-header {
        padding: var(--nc-space-3);
    }

    .nc-gpu-compare-form,
    .nc-compare-results {
        padding: var(--nc-space-3);
    }

    /* No margin-inline/padding-inline here: padding on an overflow-x: auto
       container sits inside its own scrollable clip area, so scrolled table
       content can slide underneath it, showing as a stray sliver to the left
       of the sticky column. Leaving the wrap's edges flush with its border
       makes the table edge and the sticky column's stuck edge identical, so
       there is no gap left for anything to bleed through. */

    .nc-compare-table-wrap[data-gpu-count="2"] .nc-compare-table {
        /* Was 680px, which left no real room for the bounded ~130px SPEC
           column below and forced most of the viewport to be consumed by
           it under table-layout: auto. 470px (~130px SPEC + 2x~170px GPU
           columns) lets a 2-GPU table fit without scrolling on wider phones
           and only need modest scrolling on narrow ones. */
        min-width: 470px;
    }

    .nc-compare-table-wrap[data-gpu-count="3"] .nc-compare-table {
        min-width: 840px;
    }

    .nc-compare-table-wrap[data-gpu-count="4"] .nc-compare-table {
        min-width: 1000px;
    }

    .nc-site-footer__legal {
        grid-column: auto;
    }

    /* GPU entry header: chip rows and the section nav become one-line
       horizontal rails on phones so the spec table starts sooner. */
    .nc-gpu-header .nc-badge-row,
    .nc-gpu-header .nc-section-nav {
        flex-wrap: nowrap;
        overflow-x: auto;
        padding-bottom: 2px;
        scrollbar-width: none;
    }

    .nc-gpu-header .nc-badge-row > *,
    .nc-gpu-header .nc-section-nav a {
        flex: 0 0 auto;
        white-space: nowrap;
    }

    /* Vendor tabs stay one horizontal rail on phones instead of wrapping into
       a two-row block above the search field. */
    .nc-vendor-pills {
        flex-wrap: nowrap;
        overflow-x: auto;
        padding-bottom: 2px;
        scrollbar-width: none;
    }

    .nc-vendor-pills .nc-vendor-pill {
        flex: 0 0 auto;
        white-space: nowrap;
    }
}

@media (max-width: 480px) {
    /* Two selector chips side by side left too little room for GPU names
       once the oversized clear-button bug (fixed above) is no longer
       masking the real available width; a full-width row per GPU is more
       readable than a cramped two-up grid on phones. */
    .nc-compare-selector-grid {
        grid-template-columns: 1fr;
    }

    .nc-home-search-row {
        grid-template-columns: auto minmax(0, 1fr);
    }

    .nc-home-search-row button {
        grid-column: 1 / -1;
        border-radius: 0 0 var(--nc-radius-sm) var(--nc-radius-sm);
    }

    .nc-hero-actions,
    .nc-hero-actions .nc-button {
        width: 100%;
    }

    .nc-article-meta,
    .nc-article-next-actions {
        align-items: flex-start;
        flex-direction: column;
    }

    .nc-article-meta > span[aria-hidden="true"] {
        display: none;
    }
}

@media (prefers-reduced-motion: reduce) {
    html {
        scroll-behavior: auto;
    }

    *,
    *::before,
    *::after {
        scroll-behavior: auto;
        transition-duration: 0.01ms !important;
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
    }
}