/*
 * Academy courses (lane COURSES): catalogue, course page and learner courses.
 * Nexus Foundry kit tokens (--nx-*) with fallbacks, so the screens hold on any theme; light and dark follow the kit
 * (dark by default, R-010). Neutral surfaces; the pastel gradient only on lines, progress and icons in emphasis.
 * Approved reference: docs/integrations/wordpress/app/approved-design/. Gate: app/DESIGN_GATE.md.
 */
.nxc {
  --c-bg: var(--nx-bg-canvas, #fff);
  --c-surf: var(--nx-bg-surface, #fff);
  --c-muted: var(--nx-bg-muted, #f4f4f5);
  --c-hover: var(--nx-bg-hover, #ededed);
  --c-fg: var(--nx-text-primary, #000);
  --c-fg2: var(--nx-text-secondary, #262626);
  --c-fg3: var(--nx-text-muted, #525252);
  --c-line: var(--nx-border-hairline, rgba(0, 0, 0, .1));
  --c-line2: var(--nx-border-hairline-strong, rgba(0, 0, 0, .2));
  --c-pos: var(--nx-positive, #1e7e46);
  --c-cau: var(--nx-caution, #b45309);
  --c-crit: var(--nx-critical, #c62828);
  --c-info: var(--nx-info, #0b7285);
  --c-btn: var(--nx-primary-bg, #000);
  --c-btn-ink: var(--nx-primary-ink, #fff);
  --c-btn-hover: var(--nx-primary-hover, #262626);
  --c-focus: var(--nx-focus, #2563eb);
  --c-radius: var(--nx-radius, 5px);
  --c-radius-s: var(--nx-radius-chip, 2px);
  --c-sans: var(--nx-font-sans, "IBM Plex Sans", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif);
  --c-mono: var(--nx-font-mono, "IBM Plex Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace);
  --g1: #8b5cf6;
  --g2: #3b82f6;
  --g3: #10b981;
  --g4: #f97316;
  --c-grad: linear-gradient(90deg, var(--g1), var(--g2), var(--g3));
  --c-gutter: clamp(16px, 3vw, 48px);
  --c-dock: 72px;
  box-sizing: border-box;
  display: block;
  width: 100%;
  max-width: none;
  margin: 0;
  background: var(--c-bg);
  color: var(--c-fg);
  font-family: var(--c-sans);
  font-size: 15px;
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
}
:root[data-theme="dark"] .nxc,
:root[data-nx-default="dark"]:not([data-theme]) .nxc,
:root:not([data-theme]):not([data-nx-default]) .nxc {
  --g1: #c4b5fd;
  --g2: #93c5fd;
  --g3: #86efac;
  --g4: #fdba74;
  --c-bg: var(--nx-bg-canvas, #000);
  --c-surf: var(--nx-bg-surface, #0a0a0a);
  --c-muted: var(--nx-bg-muted, #141414);
  --c-hover: var(--nx-bg-hover, #1a1a1a);
  --c-fg: var(--nx-text-primary, #fff);
  --c-fg2: var(--nx-text-secondary, #d4d4d4);
  --c-fg3: var(--nx-text-muted, #a3a3a3);
  --c-line: var(--nx-border-hairline, rgba(255, 255, 255, .1));
  --c-line2: var(--nx-border-hairline-strong, rgba(255, 255, 255, .2));
  --c-pos: var(--nx-positive, #81c995);
  --c-cau: var(--nx-caution, #fdd663);
  --c-crit: var(--nx-critical, #f28b82);
  --c-info: var(--nx-info, #78d9ec);
  --c-btn: var(--nx-primary-bg, #fff);
  --c-btn-ink: var(--nx-primary-ink, #000);
  --c-btn-hover: var(--nx-primary-hover, #e5e5e5);
  --c-focus: var(--nx-focus, #93c5fd);
}
.nxc *, .nxc *::before, .nxc *::after { box-sizing: border-box; }
.nxc-pad { padding: 32px var(--c-gutter) calc(64px + var(--c-dock)); }
.nxc p, .nxc ul, .nxc ol, .nxc dl, .nxc dd, .nxc h1, .nxc h2, .nxc h3, .nxc figure { margin: 0; padding: 0; }
.nxc h1, .nxc h2, .nxc h3 { color: var(--c-fg); font-family: var(--c-sans); text-transform: none; letter-spacing: normal; }
.nxc a { color: inherit; text-decoration: none; }
.nxc a:hover { color: inherit; }
.nxc :focus { outline: none; }
.nxc :focus-visible { outline: 2px solid var(--c-focus); outline-offset: 2px; border-radius: 3px; }
.nxc .screen-reader-text { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.nxc [hidden] { display: none !important; }
.nxc-ic { flex: none; display: inline-block; vertical-align: middle; }
.nxc-muted { color: var(--c-fg3); }
.nxc-num { font-family: var(--c-mono); font-variant-numeric: tabular-nums; }
.nxc-eyebrow { font-family: var(--c-mono); font-size: 11px; font-weight: 500; letter-spacing: .14em; text-transform: uppercase; color: var(--c-fg3); }
.nxc-meta { font-family: var(--c-mono); font-size: 12px; line-height: 1.5; color: var(--c-fg3); }
.nxc-sep { margin: 0 8px; color: var(--c-line2); }

/* Buttons: one primary (solid), secondary and ghost quiet; square kit radius, never round. */
.nxc .nxc-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  min-height: 36px; height: auto; padding: 0 14px; margin: 0;
  border: 1px solid transparent; border-radius: var(--c-radius-s);
  background: transparent; color: var(--c-fg); box-shadow: none;
  font: 500 14px/1.2 var(--c-sans); letter-spacing: normal; text-transform: none; white-space: nowrap;
  cursor: pointer; text-decoration: none; transition: background-color .12s, border-color .12s, color .12s;
}
.nxc .nxc-btn[data-variant="primary"] { background: var(--c-btn); color: var(--c-btn-ink); border-color: var(--c-btn); }
.nxc .nxc-btn[data-variant="primary"]:hover { background: var(--c-btn-hover); border-color: var(--c-btn-hover); color: var(--c-btn-ink); }
.nxc .nxc-btn[data-variant="secondary"] { border-color: var(--c-line2); }
.nxc .nxc-btn[data-variant="secondary"]:hover, .nxc .nxc-btn[data-variant="ghost"]:hover { background: var(--c-hover); }
.nxc .nxc-icon-btn { display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; padding: 0; margin: 0; border: 0; border-radius: var(--c-radius-s); background: transparent; color: var(--c-fg); box-shadow: none; cursor: pointer; }
.nxc .nxc-icon-btn:hover { background: var(--c-hover); }

/* Badge: dot and word. */
.nxc-badge { display: inline-flex; align-items: center; gap: 6px; height: 22px; padding: 0 8px; border: 1px solid var(--c-line2); border-radius: var(--c-radius-s); font: 500 10.5px/1 var(--c-mono); letter-spacing: .08em; text-transform: uppercase; color: var(--c-fg2); white-space: nowrap; }
.nxc-dot { width: 6px; height: 6px; border-radius: 2px; background: var(--c-fg3); flex: none; }
.nxc-badge[data-tone="positive"] .nxc-dot { background: var(--c-pos); }
.nxc-badge[data-tone="info"] .nxc-dot { background: var(--g2); }
.nxc-badge[data-tone="caution"] .nxc-dot { background: var(--c-cau); }
.nxc-badge[data-tone="critical"] .nxc-dot { background: var(--c-crit); }

/* Progress: hairline track, gradient fill. */
.nxc-progress { position: relative; height: 4px; border-radius: 2px; background: var(--c-muted); overflow: hidden; }
.nxc-progress > span { position: absolute; inset-block: 0; inset-inline-start: 0; border-radius: 2px; background: var(--c-grad); }
.nxc-progress--lg { height: 6px; }

/* Page header: eyebrow, title, purpose, one primary action on the right. */
.nxc-enrol { margin: 0; }

/* Toolbar: one row when it fits, a second row for sort and view when it does not (2026-11-01: six filters overflowed
   the content column at 1440 px and the duration filter slid under the sort); filters collapse into a sheet below 1180 px. */
.nxc-toolbar { display: flex; align-items: center; gap: 8px; padding: 16px 0; border-bottom: 1px solid var(--c-line); flex-wrap: wrap; min-width: 0; }
.nxc-filters { flex-wrap: wrap; }
.nxc-search { position: relative; display: flex; align-items: center; flex: 1 1 220px; min-width: 180px; max-width: 360px; margin: 0; }
.nxc-filters .nxc-field, .nxc-sort { flex: none; }
.nxc-search .nxc-ic { position: absolute; inset-inline-start: 12px; color: var(--c-fg3); pointer-events: none; }
.nxc .nxc-search input {
  width: 100%; height: 38px; margin: 0; padding: 0 12px 0 36px; border: 1px solid var(--c-line2); border-radius: var(--c-radius-s);
  background: var(--c-surf); color: var(--c-fg); font: 400 14px var(--c-sans); box-shadow: none;
}
.nxc .nxc-search input::placeholder { color: var(--c-fg3); opacity: 1; }
.nxc-filters { display: flex; align-items: center; gap: 8px; flex: 0 1 auto; min-width: 0; }
.nxc-field { display: inline-flex; flex-direction: column; gap: 0; margin: 0; position: relative; min-width: 0; }
.nxc-field__label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; }
.nxc .nxc-field select {
  height: 38px; margin: 0; padding: 0 30px 0 10px; max-width: 168px; min-width: 0; border: 1px solid var(--c-line2); border-radius: var(--c-radius-s);
  background-color: var(--c-surf); color: var(--c-fg); font: 400 13.5px var(--c-sans); box-shadow: none; cursor: pointer;
  -webkit-appearance: none; appearance: none; text-overflow: ellipsis;
  background-image: linear-gradient(45deg, transparent 50%, currentColor 50%), linear-gradient(135deg, currentColor 50%, transparent 50%);
  background-position: calc(100% - 15px) 16px, calc(100% - 10px) 16px; background-size: 5px 5px, 5px 5px; background-repeat: no-repeat;
}
.nxc .nxc-field select:hover { border-color: var(--c-fg3); }
.nxc .nxc-field select[data-active="true"] { border-color: var(--c-fg); }
.nxc-sheet__head, .nxc-sheet__foot { display: none; }
.nxc-filters-open { display: none !important; }
.nxc-count-pill { display: inline-flex; align-items: center; justify-content: center; min-width: 18px; height: 18px; padding: 0 5px; border-radius: 3px; background: var(--c-fg); color: var(--c-bg); font: 600 11px var(--c-mono); }
.nxc-sort { margin-inline-start: auto; }
.nxc-result-count { font-family: var(--c-mono); font-size: 12.5px; color: var(--c-fg3); white-space: nowrap; padding: 0 4px; }
.nxc-seg { display: inline-flex; gap: 2px; padding: 2px; border: 1px solid var(--c-line2); border-radius: var(--c-radius); flex: none; }
.nxc .nxc-seg__btn { display: inline-flex; align-items: center; justify-content: center; width: 34px; height: 32px; margin: 0; padding: 0; border: 0; border-radius: 3px; background: transparent; color: var(--c-fg3); box-shadow: none; cursor: pointer; }
.nxc .nxc-seg__btn[aria-pressed="true"] { background: var(--c-muted); color: var(--c-fg); }
.nxc .nxc-seg__btn:hover { color: var(--c-fg); }

@media (max-width: 1179px) {
  .nxc-filters-open { display: inline-flex !important; }
  .nxc-filters { display: none; }
  .nxc-filters[data-open="true"] {
    display: flex; flex-direction: column; align-items: stretch; gap: 14px;
    position: fixed; z-index: 100000; inset: auto 0 0 0; max-height: 86vh; overflow: auto;
    padding: 16px var(--c-gutter) 24px; background: var(--c-surf); border-top: 1px solid var(--c-line2);
    box-shadow: 0 -12px 40px rgba(0, 0, 0, .35);
  }
  .nxc-filters[data-open="true"] .nxc-sheet__head { display: flex; align-items: center; justify-content: space-between; }
  .nxc-filters[data-open="true"] .nxc-sheet__foot { display: flex; gap: 8px; justify-content: flex-end; padding-top: 8px; border-top: 1px solid var(--c-line); }
  .nxc-filters[data-open="true"] .nxc-field__label { position: static; width: auto; height: auto; clip: auto; font-size: 12px; font-family: var(--c-mono); color: var(--c-fg3); margin-bottom: 6px; }
  .nxc-filters[data-open="true"] .nxc-field select { max-width: none; width: 100%; height: 44px; }
  .nxc-sheet__title { font-weight: 500; font-size: 16px; }
  .nxc-scrim { position: fixed; inset: 0; z-index: 99999; background: rgba(0, 0, 0, .5); }
}
@media (max-width: 720px) {
  .nxc-pad { padding-top: 20px; }
  .nxc .nxc-pagehead .nxl-head__action { inline-size: 100%; align-items: stretch; }
  .nxc .nxc-pagehead .nxl-head__action .nxc-btn, .nxc .nxc-pagehead .nxl-head__action > form { inline-size: 100%; min-height: 44px; }
  .nxc-toolbar { flex-wrap: wrap; row-gap: 10px; }
  .nxc-search { flex: 1 1 100%; max-width: none; order: 0; }
  .nxc .nxc-search input { height: 44px; }
  .nxc-filters-open { order: 1; min-height: 44px; }
  .nxc-sort { order: 2; margin-inline-start: 0; flex: 1 1 0; }
  .nxc-sort select { width: 100%; max-width: none !important; height: 44px !important; }
  .nxc-seg { order: 4; }
  .nxc .nxc-seg__btn { width: 42px; height: 38px; }
  .nxc-result-count { order: 3; flex: 1 1 auto; padding: 0; }
  .nxc-clear { order: 5; }
}

/* Results: grid of cards, or rows in list view. */
.nxc-results { padding-top: 20px; }
.nxc-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 320px), 1fr)); gap: 16px; align-items: stretch; }
.nxc-card {
  position: relative; display: flex; flex-direction: column; gap: 8px; min-width: 0;
  padding: 18px 18px 16px; background: var(--c-surf); border: 1px solid var(--c-line); border-radius: var(--c-radius);
  transition: border-color .12s, background-color .12s;
}
.nxc-card::before { content: ""; position: absolute; inset-inline-start: 18px; inset-inline-end: 18px; top: -1px; height: 2px; border-radius: 0 0 2px 2px; background: var(--c-grad); opacity: .0; transition: opacity .12s; }
.nxc-card:hover { border-color: var(--c-line2); }
.nxc-card:hover::before, .nxc-card:focus-within::before { opacity: 1; }
.nxc-card__head { display: flex; align-items: center; justify-content: space-between; gap: 8px; min-height: 22px; }
.nxc-card__title { font-size: 17px !important; font-weight: 500; line-height: 1.3; margin: 0 !important; }
.nxc-card__title a::after { content: ""; position: absolute; inset: 0; border-radius: var(--c-radius); }
.nxc-card__title a:focus-visible { outline: none; }
.nxc-card__title a:focus-visible::after { outline: 2px solid var(--c-focus); outline-offset: 2px; }
.nxc-card__faculty { font-size: 13px; color: var(--c-fg2); }
.nxc-card__summary { font-size: 13.5px; color: var(--c-fg3); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.nxc-card .nxc-meta { display: flex; flex-wrap: wrap; gap: 4px 14px; margin-top: 2px; }
.nxc-card .nxc-meta > span { display: inline-flex; align-items: center; gap: 5px; white-space: nowrap; }
.nxc-card .nxc-meta .nxc-ic { color: var(--c-fg3); }
.nxc-card .nxc-progress { margin-top: 4px; }
.nxc-card__foot { margin-top: auto; padding-top: 10px; border-top: 1px solid var(--c-line); display: flex; flex-direction: column; gap: 6px; }
.nxc-card__foot:empty { display: none; }
.nxc-card__credits, .nxc-card__paths { display: flex; align-items: flex-start; gap: 8px; font-size: 12.5px; color: var(--c-fg2); }
.nxc-card__credits .nxc-ic { color: var(--g1); margin-top: 1px; }
.nxc-card__paths .nxc-ic { color: var(--g2); margin-top: 1px; }
.nxc-card__credits span { font-family: var(--c-mono); font-size: 12px; }
.nxc.nxc-js .nxc-card[data-over="1"]:not([data-revealed="1"]) { display: none; }

.nxc-catalogue[data-view="list"] .nxc-grid { display: flex; flex-direction: column; gap: 0; border-top: 1px solid var(--c-line); }
.nxc-catalogue[data-view="list"] .nxc-card {
  display: grid; grid-template-columns: minmax(0, 2.2fr) minmax(0, 1.6fr) minmax(0, 1.3fr); grid-template-areas: "head meta foot" "title meta foot" "fac meta foot";
  column-gap: 32px; row-gap: 2px; padding: 14px 8px; border: 0; border-bottom: 1px solid var(--c-line); border-radius: 0; background: transparent;
}
.nxc-catalogue[data-view="list"] .nxc-card:hover { background: var(--c-hover); }
.nxc-catalogue[data-view="list"] .nxc-card::before { display: none; }
.nxc-catalogue[data-view="list"] .nxc-card__head { grid-area: head; }
.nxc-catalogue[data-view="list"] .nxc-card__title { grid-area: title; font-size: 15.5px !important; }
.nxc-catalogue[data-view="list"] .nxc-card__faculty { grid-area: fac; font-size: 12.5px; color: var(--c-fg3); }
.nxc-catalogue[data-view="list"] .nxc-card__summary { display: none; }
.nxc-catalogue[data-view="list"] .nxc-card .nxc-meta { grid-area: meta; align-self: center; }
.nxc-catalogue[data-view="list"] .nxc-card .nxc-progress { grid-area: meta; align-self: end; }
.nxc-catalogue[data-view="list"] .nxc-card__foot { grid-area: foot; align-self: center; margin: 0; padding: 0; border: 0; }
@media (max-width: 900px) {
  .nxc-catalogue[data-view="list"] .nxc-card { grid-template-columns: minmax(0, 1fr); grid-template-areas: "head" "title" "fac" "meta" "foot"; row-gap: 6px; }
}
.nxc-more { display: flex; justify-content: center; padding-top: 24px; }

/* Empty and no-results: one sentence, one action. */
.nxc-empty { display: flex; flex-direction: column; align-items: flex-start; gap: 8px; padding: 48px 0; max-width: 60ch; }
.nxc-empty .nxc-ic { color: var(--g2); margin-bottom: 4px; }
.nxc-empty__title { font-size: 18px !important; font-weight: 500; margin: 0 !important; }
.nxc-empty__text { color: var(--c-fg2); margin-bottom: 8px !important; }
.nxc-empty--inline { padding: 32px 0; }

/* Course page. */
.nxc-learner { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 8px 32px; align-items: center; padding: 20px 0; border-bottom: 1px solid var(--c-line); }
.nxc-learner__stat .nxc-num { font-size: 30px; font-weight: 500; line-height: 1.1; margin-top: 4px !important; }
.nxc-learner__bar { display: flex; flex-direction: column; gap: 8px; }
.nxc-learner__bar .nxc-muted { font-size: 13.5px; }
.nxc-tabs { display: flex; gap: 24px; overflow-x: auto; scrollbar-width: none; border-bottom: 1px solid var(--c-line); margin-bottom: 8px; }
.nxc-tabs::-webkit-scrollbar { display: none; }
.nxc-tabs__a { position: relative; display: inline-flex; align-items: center; gap: 6px; min-height: 46px; font-size: 14px; color: var(--c-fg3); white-space: nowrap; }
.nxc-tabs__a:hover { color: var(--c-fg); }
.nxc-tabs__a[aria-current="page"] { color: var(--c-fg); }
.nxc-tabs__a[aria-current="page"]::after { content: ""; position: absolute; inset-inline-start: 0; inset-inline-end: 0; bottom: -1px; height: 2px; background: var(--c-grad); }
.nxc-tabs__n { font-family: var(--c-mono); font-size: 11.5px; color: var(--c-fg3); }
.nxc-course__grid { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: 48px; align-items: start; }
.nxc-course__main { min-width: 0; }
.nxc-course__aside { position: sticky; top: calc(var(--nx-header-h, 64px) + 16px); display: flex; flex-direction: column; gap: 16px; padding-top: 24px; }
@media (max-width: 1080px) {
  .nxc-course__grid { grid-template-columns: minmax(0, 1fr); gap: 8px; }
  .nxc-course__aside { position: static; padding-top: 0; }
}
.nxc .nxc-pagehead { padding-bottom: 24px; border-bottom: 1px solid var(--c-line); }
.nxc .nxc-pagehead__meta { display: flex; flex-wrap: wrap; align-items: center; }
.nxc .nxc-pagehead .nxl-head__action { display: flex; flex-direction: column; align-items: flex-end; gap: 8px; }
.nxc .nxc-pagehead .nxl-head__action > form, .nxc .nxc-pagehead .nxl-head__action > a { display: inline-flex; gap: 8px; }
.nxc .nxc-titlerow { display: flex; align-items: center; gap: 4px; }
.nxc-section { padding: 28px 0; border-bottom: 1px solid var(--c-line); scroll-margin-top: calc(var(--nx-header-h, 64px) + 16px); }
.nxc-section:last-child { border-bottom: 0; }
.nxc-section__title { font-size: 19px !important; font-weight: 500; margin: 0 0 12px !important; }
.nxc-section__lead { color: var(--c-fg2); margin-bottom: 14px !important; font-size: 14px; }
.nxc-prose { max-width: 72ch; color: var(--c-fg2); font-size: 15.5px; line-height: 1.7; }
.nxc-prose p + p { margin-top: 12px; }
.nxc-prose a { text-decoration: underline; text-underline-offset: 3px; }
.nxc-prose img, .nxc-prose svg, .nxc-prose iframe, .nxc-prose table { max-width: 100%; height: auto; }
.nxc-outcomes { list-style: none; display: flex; flex-direction: column; }
.nxc-outcome { display: grid; grid-template-columns: 52px minmax(0, 1fr); gap: 12px; padding: 12px 0; border-top: 1px solid var(--c-line); }
.nxc-outcome:first-child { border-top: 0; }
.nxc-outcome__id { font-family: var(--c-mono); font-size: 12px; color: var(--c-fg3); padding-top: 2px; }
.nxc-outcome__text { color: var(--c-fg); max-width: 80ch; }
.nxc-outcome .nxc-meta { margin-top: 4px !important; }
.nxc-modules { display: flex; flex-direction: column; border-top: 1px solid var(--c-line); }
.nxc-module { border-bottom: 1px solid var(--c-line); }
.nxc-module__head { display: grid; grid-template-columns: 36px minmax(0, 1fr) auto 16px; align-items: center; gap: 12px; min-height: 56px; padding: 8px 4px; cursor: pointer; list-style: none; }
.nxc-module__head::-webkit-details-marker { display: none; }
.nxc-module__head::after { content: ""; width: 7px; height: 7px; border-inline-end: 1.5px solid var(--c-fg3); border-bottom: 1.5px solid var(--c-fg3); transform: rotate(45deg); justify-self: center; margin-top: -4px; transition: transform .12s; }
.nxc-module[open] > .nxc-module__head::after { transform: rotate(225deg); margin-top: 4px; }
.nxc-module__head:hover { background: var(--c-hover); }
.nxc-module__n { font-family: var(--c-mono); font-size: 12px; color: var(--c-fg3); }
.nxc-module__title { font-weight: 500; }
.nxc-module__meta { font-family: var(--c-mono); font-size: 12px; color: var(--c-fg3); white-space: nowrap; }
.nxc-module__summary { padding-block: 0 8px; padding-inline: 52px 4px; color: var(--c-fg2); font-size: 13.5px; max-width: 80ch; }
.nxc-items { list-style: none; padding: 0 0 8px 0 !important; }
.nxc-item { display: grid; grid-template-columns: 36px minmax(0, 1fr) auto; align-items: center; gap: 12px; padding: 9px 4px 9px 4px; border-top: 1px solid var(--c-line); }
.nxc-item:hover { background: var(--c-hover); }
.nxc-item__ic { display: inline-flex; justify-content: center; color: var(--c-fg3); }
.nxc-item[data-state="done"] .nxc-item__ic { color: var(--c-pos); }
.nxc-item__body { display: flex; flex-direction: column; min-width: 0; }
.nxc-item__title { font-size: 14px; color: var(--c-fg); }
a.nxc-item__title:hover { text-decoration: underline; text-underline-offset: 3px; }
.nxc-item[data-state="locked"] .nxc-item__title { color: var(--c-fg2); }
.nxc-item__meta { font-family: var(--c-mono); font-size: 11.5px; color: var(--c-fg3); }
.nxc-table { width: 100%; border-collapse: collapse; margin: 0 0 16px; font-size: 14px; border: 0; }
.nxc-table th { text-align: start; font: 500 11px var(--c-mono); letter-spacing: .1em; text-transform: uppercase; color: var(--c-fg3); padding: 8px 8px 8px 0; border: 0; border-bottom: 1px solid var(--c-line2); background: transparent; }
.nxc-table td { padding: 11px 8px 11px 0; border: 0; border-bottom: 1px solid var(--c-line); vertical-align: middle; background: transparent; color: var(--c-fg); }
.nxc-table tr:hover td { background: var(--c-hover); }
.nxc-table a:hover { text-decoration: underline; text-underline-offset: 3px; }
.nxc-num-col { text-align: end !important; white-space: nowrap; }
.nxc-weight { display: inline-block; width: 80px; height: 4px; border-radius: 2px; background: var(--c-muted); margin-inline-end: 10px; vertical-align: middle; overflow: hidden; }
.nxc-weight__bar { display: block; height: 100%; background: var(--c-grad); }
.nxc-facts { display: flex; flex-direction: column; }
.nxc-facts > div { display: grid; grid-template-columns: 220px minmax(0, 1fr); gap: 16px; padding: 10px 0; border-top: 1px solid var(--c-line); }
.nxc-facts dt { color: var(--c-fg3); font-size: 13.5px; }
.nxc-facts dd { font-size: 14px; color: var(--c-fg); }
.nxc-facts dd .nxc-num { margin-inline-end: 6px; }
.nxc-two { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 32px; }
.nxc-sub { font-size: 14px !important; font-weight: 500; margin: 0 0 8px !important; color: var(--c-fg2) !important; }
.nxc-list { list-style: none; }
.nxc-list li { position: relative; padding-block: 8px; padding-inline: 18px 0; border-top: 1px solid var(--c-line); font-size: 14px; color: var(--c-fg2); }
.nxc-list li::before { content: ""; position: absolute; inset-inline-start: 2px; top: 16px; width: 6px; height: 6px; border-radius: 2px; background: var(--g3); }
.nxc-list a { text-decoration: underline; text-underline-offset: 3px; }
.nxc-paths { list-style: none; }
.nxc-path { display: flex; gap: 10px; align-items: flex-start; padding: 9px 0; border-top: 1px solid var(--c-line); }
.nxc-path .nxc-ic { color: var(--g2); margin-top: 2px; }
.nxc-path__body { display: flex; flex-direction: column; }
.nxc-path a { font-size: 14px; }
.nxc-path a:hover { text-decoration: underline; text-underline-offset: 3px; }
.nxc-people { list-style: none; display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 280px), 1fr)); gap: 12px 32px; }
.nxc-person { display: flex; gap: 12px; align-items: flex-start; padding: 10px 0; border-top: 1px solid var(--c-line); }
.nxc-person > span:last-child { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.nxc-avatar { display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; flex: none; border: 1px solid var(--c-line2); border-radius: var(--c-radius-s); color: var(--c-fg2); }
.nxc-person__name { font-weight: 500; font-size: 14px; }
a.nxc-person__name:hover { text-decoration: underline; text-underline-offset: 3px; }
.nxc-person__bio { font-size: 13px; color: var(--c-fg2); }
.nxc-panel { padding: 18px; background: var(--c-surf); border: 1px solid var(--c-line); border-radius: var(--c-radius); scroll-margin-top: calc(var(--nx-header-h, 64px) + 16px); }
.nxc-panel__title { font: 500 11px var(--c-mono) !important; letter-spacing: .14em !important; text-transform: uppercase !important; color: var(--c-fg3) !important; margin: 0 0 10px !important; }
.nxc-earn { list-style: none; display: flex; flex-direction: column; }
.nxc-earn li { display: flex; gap: 10px; align-items: flex-start; padding: 9px 0; border-top: 1px solid var(--c-line); }
.nxc-earn li:first-child { border-top: 0; padding-top: 0; }
.nxc-earn li .nxc-ic { color: var(--g1); margin-top: 2px; }
.nxc-earn li > span { display: flex; flex-direction: column; gap: 1px; min-width: 0; }
.nxc-earn strong { font-weight: 500; font-size: 14px; }
.nxc-fine { margin-top: 10px !important; padding-top: 10px; border-top: 1px solid var(--c-line); font-size: 12px; color: var(--c-fg3); }
.nxc-glance > div { display: flex; justify-content: space-between; gap: 12px; padding: 7px 0; border-top: 1px solid var(--c-line); font-size: 13.5px; }
.nxc-glance > div:first-child { border-top: 0; padding-top: 0; }
.nxc-glance dt { color: var(--c-fg3); }
.nxc-glance dd { text-align: end; color: var(--c-fg); }
.nxc-tutor-box { margin-top: 12px; }
@media (max-width: 720px) {
  .nxc-two { grid-template-columns: minmax(0, 1fr); gap: 16px; }
  .nxc-facts > div { grid-template-columns: minmax(0, 1fr); gap: 2px; }
  .nxc-module__head { grid-template-columns: 28px minmax(0, 1fr) 16px; }
  .nxc-module__meta { grid-column: 2; grid-row: 2; white-space: normal; }
  .nxc-module__head::after { grid-column: 3; grid-row: 1; }
  .nxc-module__summary { padding-inline-start: 4px; }
  .nxc-item { grid-template-columns: 28px minmax(0, 1fr); }
  .nxc-item .nxc-badge { grid-column: 2; justify-self: start; }
  .nxc-outcome { grid-template-columns: 40px minmax(0, 1fr); }
  .nxc-weight { display: none; }
  .nxc-learner { grid-template-columns: minmax(0, 1fr); }
}

/* Learner courses in the dashboard. */
.nxc-dash { background: var(--c-bg); }
.nxc-dash__bar { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; border-bottom: 1px solid var(--c-line); margin-bottom: 4px; }
.nxc-dash__bar .nxc-tabs { border-bottom: 0; margin-bottom: 0; min-width: 0; }
.nxc-dash__bar .nxc-btn { margin-bottom: 8px; }
.nxc-rows { list-style: none; }
.nxc-row { display: grid; grid-template-columns: minmax(0, 2fr) minmax(120px, 1fr) auto auto; align-items: center; gap: 24px; padding: 14px 8px; border-bottom: 1px solid var(--c-line); }
.nxc-row:hover { background: var(--c-hover); }
.nxc-row__main { min-width: 0; }
.nxc-row__title { font-weight: 500; font-size: 15px; }
.nxc-row__title:hover { text-decoration: underline; text-underline-offset: 3px; }
.nxc-row__progress { display: flex; align-items: center; gap: 10px; }
.nxc-row__progress .nxc-progress { flex: 1 1 auto; }
.nxc-row__pc { font-size: 12px; color: var(--c-fg2); min-width: 36px; text-align: end; }
@media (max-width: 720px) {
  .nxc-dash__bar { flex-direction: column; align-items: stretch; }
  .nxc-dash__bar .nxc-btn { min-height: 44px; margin: 8px 0; }
  .nxc-row { grid-template-columns: minmax(0, 1fr) auto; gap: 8px 12px; }
  .nxc-row__progress { grid-column: 1 / -1; grid-row: 2; }
  .nxc-row__state { grid-row: 1; grid-column: 2; }
  .nxc-row__go { grid-column: 1 / -1; justify-self: start; min-height: 44px; }
  .nxc-table--rows thead { display: none; }
  .nxc-table--rows tr { display: grid; grid-template-columns: minmax(0, 1fr) auto; padding: 10px 0; border-bottom: 1px solid var(--c-line); }
  .nxc-table--rows td { border: 0; padding: 2px 0; }
}
@media (prefers-reduced-motion: reduce) {
  .nxc *, .nxc *::before, .nxc *::after { transition: none !important; }
}

/* 1.10.0: course status, notices, the learner screens (dashboard, records, pathways). Logical properties only, so
   right-to-left pages mirror without extra rules. */
.nxc-badge[data-tone="neutral"] .nxc-dot { background: var(--c-fg3); }
.nxc-notice { margin: 16px 0 0; padding: 12px 16px; border: 1px solid var(--c-line2); border-inline-start: 3px solid var(--c-info); border-radius: var(--c-radius); background: var(--c-surf); color: var(--c-fg); }
.nxc-notice[data-tone="positive"] { border-inline-start-color: var(--c-pos); }
.nxc-notice[data-tone="critical"] { border-inline-start-color: var(--c-crit); }
.nxc-link { color: var(--c-fg); text-decoration: underline !important; text-underline-offset: 3px; }
.nxc-link:hover { color: var(--c-fg2); }
.nxc-note { margin-top: 32px !important; color: var(--c-fg3); font-size: 13px; }
.nxc-learner .nxc-btn, .nxc-learner .nxc-link { justify-self: start; }
.nxa-learner-tabs { margin-top: 24px; }
.nxa-stats { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1px; margin: 24px 0 0 !important; border: 1px solid var(--c-line); border-radius: var(--c-radius); overflow: hidden; background: var(--c-line); }
.nxa-stats > div { padding: 16px 20px; background: var(--c-surf); }
.nxa-stats dt { color: var(--c-fg3); font-size: 13px; }
.nxa-stats dd { margin: 4px 0 0; font-size: 28px; font-weight: 500; line-height: 1.1; color: var(--c-fg); }
.nxa-dash__list { list-style: none; display: grid; gap: 12px; margin-top: 16px !important; }
.nxa-dash__item { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px 24px; padding: 16px 20px; border: 1px solid var(--c-line); border-radius: var(--c-radius); background: var(--c-surf); }
.nxa-dash__text { display: grid; gap: 6px; flex: 1 1 320px; min-width: 0; }
.nxa-dash__title { font-size: 17px; font-weight: 500; line-height: 1.3; }
.nxa-dash__title a:hover { text-decoration: underline; text-underline-offset: 3px; }
.nxa-table-wrap { margin-top: 16px; overflow-x: auto; border: 1px solid var(--c-line); border-radius: var(--c-radius); }
.nxa-table-wrap:focus-visible { outline: 2px solid var(--c-focus); outline-offset: 2px; }
.nxa-table { width: 100%; border-collapse: collapse; font-size: 14px; }
.nxa-table th, .nxa-table td { padding: 12px 16px; border-bottom: 1px solid var(--c-line); text-align: start; vertical-align: top; }
.nxa-table thead th { color: var(--c-fg3); font-weight: 500; background: var(--c-muted); }
.nxa-table tbody th { font-weight: 500; }
.nxa-table tbody tr:last-child > * { border-bottom: 0; }
.nxa-table a { text-decoration: underline; text-underline-offset: 3px; }
.nxa-paths { display: grid; gap: 12px; margin-top: 24px; }
.nxa-path > .nxc-progress { margin: 0 20px 12px; }
.nxc-item[data-status="preparation"] .nxc-item__meta { color: var(--c-fg3); }
@media (max-width: 720px) {
  .nxa-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (prefers-reduced-motion: reduce) {
  .nxc *, .nxc *::before, .nxc *::after { transition: none !important; animation: none !important; }
}
.nxc-section__sub { margin-top: 24px !important; margin-bottom: 8px !important; font-size: 15px; font-weight: 500; }

/* Open preview on the curriculum (1.14.0): units anyone can open carry an "Open" mark; the rest a lock with the next step. */
.nxc-item__open { display: inline-flex; align-items: center; gap: 6px; font: 500 11px/1 var(--c-mono); letter-spacing: .06em; text-transform: uppercase; color: var(--c-fg); white-space: nowrap; text-decoration: none; }
.nxc-item__open:hover .nxc-item__opentext, .nxc-item__open:focus-visible .nxc-item__opentext { text-decoration: underline; text-underline-offset: 3px; }
.nxc-item__lock { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; color: var(--c-fg3); white-space: nowrap; }
.nxc-module__open { font: 500 10.5px/1 var(--c-mono); letter-spacing: .08em; text-transform: uppercase; color: var(--c-fg2); border: 1px solid var(--c-line2); border-radius: var(--c-radius-s); padding: 3px 6px; margin-inline-start: 8px; vertical-align: middle; }

/* ---- Course page v2 (1.20.0, owner rejection of /course/RAF-102/ 2026-11-06) ----------------------------------------
   The estate grammar (docs/estate/UI_REFERENCE_STANDARD.md): hairline facts grid, mono eyebrows with a rationed accent dash,
   black/white primary button, 5px corners, never pills, shared tokens only, the same structure in light and dark.
   Imported course text is scoped by .nxa-prose: a fixed type scale (h2 up to 1.5rem), so a heading in imported HTML can
   never render at display size. The text itself is never changed. */
@media (min-width: 641px) {
  .nxc-pad { padding-inline-start: max(var(--c-gutter), 76px); } /* clear of the accessibility dock at the left edge */
}
.nxa-eyebrow { display: flex; align-items: center; gap: 10px; margin: 0 0 12px; font: 500 12px/1.4 var(--c-mono); letter-spacing: .1em; text-transform: uppercase; color: var(--c-fg3); }
.nxa-eyebrow__rule { flex: none; inline-size: 18px; block-size: 2px; background: var(--nx-accent, currentColor); }
.nxa-hero { display: grid; grid-template-columns: minmax(0, 1fr); gap: 32px; padding: 8px 0 32px; border-bottom: 1px solid var(--c-line); }
.nxa-hero__title { font-size: clamp(34px, 4.6vw, 60px) !important; line-height: 1.04 !important; letter-spacing: -.02em !important; font-weight: 600 !important; margin: 0 0 16px !important; max-inline-size: 22ch; text-wrap: balance; }
.nxa-hero__lede { font-size: 18px; line-height: 1.55; color: var(--c-fg2); max-inline-size: 62ch; margin: 0 0 24px !important; }
.nxa-hero__actions { display: flex; flex-wrap: wrap; gap: 12px; }
.nxa-hero__actions > form { display: inline-flex; }
.nxa-facts { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); border-block: 1px solid var(--c-line); }
.nxa-facts > div { padding: 16px 16px 16px 0; border-inline-end: 1px solid var(--c-line); display: flex; flex-direction: column; gap: 6px; }
.nxa-facts > div + div { padding-inline-start: 16px; }
.nxa-facts > div:last-child { border-inline-end: 0; }
.nxa-facts dt { font: 500 11px/1.3 var(--c-mono); letter-spacing: .1em; text-transform: uppercase; color: var(--c-fg3); }
.nxa-facts dd { margin: 0; font-size: 20px; line-height: 1.2; color: var(--c-fg); font-weight: 500; }
.nxa-facts dd.nxc-num { font-size: 24px; }
@media (max-width: 640px) {
  .nxa-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .nxa-facts > div, .nxa-facts > div + div { padding: 14px 12px 14px 0; border-inline-end: 0; border-bottom: 1px solid var(--c-line); }
  .nxa-hero__actions .nxc-btn, .nxa-hero__actions > form { inline-size: 100%; min-block-size: 44px; }
}
/* the section nav sticks under the theme header */
.nxc-course .nxc-tabs { position: sticky; top: var(--nx-header-h, 64px); z-index: 5; background: var(--c-bg); margin-bottom: 0; }
.nxc-tabs__a[aria-current="page"] { color: var(--c-fg); }
.nxc-tabs__a[aria-current="page"]::after { background: var(--nx-accent, var(--c-fg)); height: 2px; }
.nxc-course .nxc-course__grid { grid-template-columns: minmax(0, 1fr) 320px; gap: 56px; }
.nxc-course .nxc-section { padding: 36px 0; }
.nxc-course .nxc-section__title { font-size: 1.5rem !important; line-height: 1.2 !important; letter-spacing: -.01em; font-weight: 600 !important; margin: 0 0 20px !important; }
/* imported text: one type scale, readable measure, no heading above 1.5rem */
.nxa-prose { color: var(--c-fg2); font-size: 16px; line-height: 1.7; max-inline-size: 76ch; overflow-wrap: anywhere; }
.nxa-prose > * + *, .nxa-prose section + section { margin-top: 14px; }
.nxa-prose h1, .nxa-prose h2, .nxa-prose h3, .nxa-prose h4 { font-size: 1.125rem !important; line-height: 1.3 !important; font-weight: 600 !important; letter-spacing: 0 !important; color: var(--c-fg) !important; margin: 24px 0 8px !important; }
.nxa-prose h2 { font-size: 1.25rem !important; }
.nxa-prose p, .nxa-prose li { font-size: inherit; line-height: inherit; }
.nxa-prose ul, .nxa-prose ol { padding-inline-start: 1.25em; display: grid; gap: 8px; }
.nxa-prose strong { color: var(--c-fg); font-weight: 600; }
.nxa-prose a { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 3px; }
.nxa-prose section { margin: 0; padding: 0; border: 0; background: none; box-shadow: none; }
.nxa-prose img, .nxa-prose svg, .nxa-prose iframe, .nxa-prose table, .nxa-prose video { max-inline-size: 100%; block-size: auto; }
.nxa-prose > :first-child, .nxa-prose h2:first-child { margin-top: 0 !important; }
/* outcomes: a numbered, hairline-ruled list across the full column */
.nxa-outcomes { max-inline-size: none; counter-reset: nxa-out; }
.nxa-outcomes ul, .nxa-outcomes ol { list-style: none; padding: 0; margin: 0; display: block; border-top: 1px solid var(--c-line); }
.nxa-outcomes li { counter-increment: nxa-out; display: grid; grid-template-columns: 48px minmax(0, 1fr); gap: 16px; padding: 16px 0; border-bottom: 1px solid var(--c-line); color: var(--c-fg); font-size: 17px; line-height: 1.55; }
.nxa-outcomes li::before { content: counter(nxa-out, decimal-leading-zero); font: 500 12px/1.9 var(--c-mono); letter-spacing: .08em; color: var(--c-fg3); }
.nxa-outcomes > h2, .nxa-outcomes > h3 { display: none; }
/* who it is for: hairline columns */
.nxa-cols { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); border-top: 1px solid var(--c-line); }
.nxa-col { padding: 20px 24px 8px 0; border-bottom: 1px solid var(--c-line); }
.nxa-col + .nxa-col { padding-inline-start: 24px; border-inline-start: 1px solid var(--c-line); }
.nxa-col__title { font: 500 11px/1.3 var(--c-mono) !important; letter-spacing: .1em !important; text-transform: uppercase !important; color: var(--c-fg3) !important; margin: 0 0 12px !important; }
@media (max-width: 720px) { .nxa-col + .nxa-col { padding-inline-start: 0; border-inline-start: 0; } .nxa-col { padding-inline-end: 0; } }
/* pathway: a track, prerequisite → this course → next */
.nxa-track { list-style: none; margin: 0 0 24px; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border: 1px solid var(--c-line); border-radius: var(--c-radius); }
.nxa-track__col { padding: 20px; display: flex; flex-direction: column; gap: 10px; position: relative; min-inline-size: 0; }
.nxa-track__col + .nxa-track__col { border-inline-start: 1px solid var(--c-line); }
.nxa-track__col + .nxa-track__col::before { content: ""; position: absolute; inset-inline-start: -6px; inset-block-start: 50%; inline-size: 11px; block-size: 11px; border-top: 1.5px solid var(--c-fg3); border-inline-end: 1.5px solid var(--c-fg3); transform: translateY(-50%) rotate(45deg); background: var(--c-bg); clip-path: polygon(0 0, 100% 0, 100% 100%); }
[dir="rtl"] .nxa-track__col + .nxa-track__col::before { transform: translateY(-50%) rotate(-135deg); }
.nxa-track__col[data-role="this"] { background: var(--c-muted); box-shadow: inset 0 2px 0 var(--nx-accent, var(--c-fg)); }
.nxa-step { display: flex; flex-direction: column; gap: 4px; padding: 12px; border: 1px solid var(--c-line); border-radius: var(--c-radius); color: var(--c-fg); background: var(--c-bg); margin: 0; }
a.nxa-step:hover { border-color: var(--c-line2); background: var(--c-hover); }
.nxa-step--entry { border-style: dashed; color: var(--c-fg3); }
.nxa-step--this { background: transparent; border-color: var(--c-line2); }
.nxa-step__code { font: 500 11px/1.3 var(--c-mono); letter-spacing: .08em; color: var(--c-fg3); }
.nxa-step__title { font-weight: 500; line-height: 1.3; }
.nxa-badges { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 6px; }
.nxa-badge { display: inline-block; align-self: flex-start; padding: 2px 8px; border: 1px solid var(--c-line2); border-radius: var(--c-radius-s, 2px); font: 500 11px/1.5 var(--c-mono); letter-spacing: .04em; color: var(--c-fg2); background: transparent; }
.nxa-badge[data-kind="credit"] { color: var(--c-fg); border-color: var(--c-fg3); }
.nxa-chips { list-style: none; padding: 0; margin: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.nxa-chip { display: inline-block; padding: 6px 12px; border: 1px solid var(--c-line2); border-radius: var(--c-radius); font-size: 14px; color: var(--c-fg); background: transparent; }
a.nxa-chip:hover { background: var(--c-hover); }
@media (max-width: 860px) {
  .nxa-track { grid-template-columns: minmax(0, 1fr); }
  .nxa-track__col + .nxa-track__col { border-inline-start: 0; border-top: 1px solid var(--c-line); }
  .nxa-track__col + .nxa-track__col::before { inset-inline-start: 24px; inset-block-start: -6px; transform: rotate(135deg); }
}
/* curriculum modules in the same grammar */
.nxc-course .nxc-module__head { min-block-size: 64px; }
.nxc-course .nxc-module__open { display: inline-block; margin-inline-start: 10px; padding: 1px 8px; border: 1px solid var(--c-line2); border-radius: var(--c-radius-s, 2px); font: 500 11px/1.6 var(--c-mono); letter-spacing: .04em; color: var(--c-fg); vertical-align: middle; }
/* the aside: sticky at a glance */
.nxc-course .nxc-course__aside { padding-top: 36px; top: calc(var(--nx-header-h, 64px) + 62px); }
@media (max-width: 1080px) { .nxc-course .nxc-course__grid { grid-template-columns: minmax(0, 1fr); gap: 0; } .nxc-course .nxc-course__aside { position: static; padding-top: 0; } }
/* 1.20.1: the curriculum and the at-a-glance panel are ruled rows like the outcomes list: hairline, no fill, no radius */
.nxc.nxc-course .nxc-modules--cards { display: block; gap: 0; border-top: 1px solid var(--c-line); }
.nxc.nxc-course .nxc-modules--cards .nxc-module { border: 0; border-bottom: 1px solid var(--c-line); border-radius: 0; background: none; box-shadow: none; }
.nxc.nxc-course .nxc-modules--cards .nxc-module__head { padding: 14px 4px; }
.nxc.nxc-course .nxc-modules--cards .nxc-items { padding: 0 4px 12px; }
.nxc.nxc-course .nxc-panel { border: 0; border-top: 1px solid var(--c-line); border-radius: 0; background: none; box-shadow: none; padding: 16px 0 0; }
.nxc.nxc-course .nxc-panel + .nxc-panel { margin-top: 8px; }
/* 1.20.2 (lead audit 2026-11-06): primary buttons are black/white (light) and white/black (dark) whatever the network's
   brand token is; one clean chevron on the filter selects; the catalogue cards are a ruled grid, not boxes. */
.nxc { --c-btn: var(--nx-text-primary) !important; --c-btn-ink: var(--nx-bg-canvas) !important; --c-btn-hover: var(--nx-text-secondary) !important; }
.nxc .nxc-field select, .nxc .nxc-sort select, .nxc select {
  background-repeat: no-repeat !important; background-size: 5px 5px, 5px 5px !important;
  background-position: calc(100% - 15px) 16px, calc(100% - 10px) 16px !important;
  background-image: linear-gradient(45deg, transparent 50%, currentColor 50%), linear-gradient(135deg, currentColor 50%, transparent 50%) !important;
  -webkit-appearance: none; appearance: none; border-radius: var(--c-radius-s);
}
.nxc-grid { gap: 0 40px; }
.nxc-card { background: none; border: 0; border-top: 1px solid var(--c-line); border-radius: 0; padding: 20px 0 22px; }
.nxc-card::before { display: none; }
.nxc-card:hover { background: none; border-top-color: var(--c-line2); }
.nxc-card:hover .nxc-card__title { text-decoration: underline; text-underline-offset: 4px; text-decoration-color: var(--nx-accent, currentColor); text-decoration-thickness: 2px; }

/*
 * The learning room (1.11.0): the Foundry command room shell and the learning patterns of kit section 6.17
 * (docs/design/NEXUS_FOUNDRY_UI_UX_KIT.md). Tokens come from .nxc (courses.css) over the kit's --nx-* values, dark by
 * default. Logical properties only, so right to left mirrors. Status by dot, inverted primary, 5px controls, 2px
 * chips, hairlines instead of shadows, motion under 200ms.
 */
body.nxr-body { margin: 0; background: var(--nx-bg-canvas, #000); }
.nxc { --c-accent: var(--nx-accent, #8ab4f8); --c-accent-soft: var(--nx-accent-soft, rgba(138, 180, 248, .12)); --c-elev: var(--nx-bg-elevated, #111); --c-fast: var(--nx-motion-fast, 120ms); --c-ease: var(--nx-ease-standard, cubic-bezier(.2, 0, 0, 1)); }
.nxr { --r-bar: 56px; --r-rail: 280px; --r-rail-c: 72px; --r-insp: 352px; --r-read: 100%; --r-strip: 32px; --c-accent: var(--nx-accent, #8ab4f8); --c-accent-soft: var(--nx-accent-soft, rgba(138, 180, 248, .12)); --c-elev: var(--nx-bg-elevated, #111); --c-fast: var(--nx-motion-fast, 120ms); --c-ease: var(--nx-ease-standard, cubic-bezier(.2, 0, 0, 1)); min-height: 100vh; display: grid; grid-template-rows: var(--r-bar) 2px minmax(0, 1fr) var(--r-strip); }
:root[data-theme="light"] .nxc { --c-accent: var(--nx-accent, #1a73e8); --c-accent-soft: var(--nx-accent-soft, rgba(26, 115, 232, .10)); --c-elev: var(--nx-bg-elevated, #fafafa); }
.nxr-skip { position: absolute; inset-inline-start: 8px; inset-block-start: -48px; z-index: 100; padding: 8px 12px; border-radius: 5px; background: var(--nx-primary-bg, #fff); color: var(--nx-primary-ink, #000); font: 500 14px/1.4 var(--nx-font-sans, "IBM Plex Sans", system-ui, sans-serif); }
.nxr-skip:focus { inset-block-start: 8px; }
.nxr .nxc-ic { stroke-width: 1.5; flex: none; }
:root[dir="rtl"] .nxr .nxc-ic[data-icon="arrow"], :root[dir="rtl"] .nxr .nxc-ic[data-icon="back"], :root[dir="rtl"] .nxr .nxc-ic[data-icon="collapse"] { transform: scaleX(-1); }
.nxc .nf-ui-eyebrow { margin: 0; font-family: var(--c-mono); font-size: 11px; font-weight: 500; letter-spacing: .16em; text-transform: uppercase; color: var(--c-fg3); }
.nxc .nxr-muted { margin: 0; color: var(--c-fg3); font-size: 13px; }

/* System bar (56px) and the 2px course progress line */
.nxc .nxr-bar { position: sticky; inset-block-start: 0; z-index: 30; display: flex; align-items: center; gap: 16px; padding-inline: 16px; background: var(--c-bg); border-block-end: 1px solid var(--c-line); min-width: 0; }
.nxc .nxr-tile { flex: none; display: inline-grid; place-items: center; width: 32px; height: 32px; border-radius: var(--c-radius-s); background: var(--c-btn); color: var(--c-btn-ink); font: 600 12px/1 var(--c-mono); letter-spacing: .04em; }
.nxc .nxr-bar__brand { display: flex; flex-direction: column; line-height: 1.2; flex: none; }
.nxc .nxr-bar__academy { font-size: 13px; font-weight: 600; letter-spacing: .04em; text-transform: uppercase; color: var(--c-fg); }
.nxc .nxr-bar__product { font: 400 11px/1.3 var(--c-mono); color: var(--c-fg3); }
.nxc .nxr-bar__course { min-width: 0; flex: 1 1 auto; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; padding-inline-start: 16px; border-inline-start: 1px solid var(--c-line); font-size: 14px; color: var(--c-fg2); }
.nxc .nxr-bar__code { font: 500 12px/1 var(--c-mono); color: var(--c-fg3); margin-inline-end: 6px; }
.nxc .nxr-bar__title { color: var(--c-fg); font-weight: 500; }
.nxc .nxr-bar__where { flex: none; font: 400 12px/1 var(--c-mono); color: var(--c-fg3); }
.nxc .nxr-bar__end { flex: none; display: flex; align-items: center; gap: 4px; }
.nxc .nxr-iconbtn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-width: 36px; height: 36px; padding: 0 8px; border: 1px solid transparent; border-radius: var(--c-radius); background: transparent; color: var(--c-fg2); font: inherit; font-size: 13px; cursor: pointer; transition: background-color var(--c-fast) var(--c-ease), border-color var(--c-fast) var(--c-ease); }
.nxc .nxr-iconbtn:hover { background: var(--c-hover); color: var(--c-fg); }
.nxc .nxr-bar__search { border-color: var(--c-line2); min-width: 160px; justify-content: flex-start; color: var(--c-fg3); }
.nxc .nxr-kbd { margin-inline-start: auto; padding: 2px 5px; border: 1px solid var(--c-line2); border-radius: var(--c-radius-s); font: 500 10.5px/1.2 var(--c-mono); color: var(--c-fg3); }
.nxc .nxr-line { position: sticky; inset-block-start: var(--r-bar); z-index: 30; height: 2px; background: var(--c-line); }
.nxc .nxr-line > span { display: block; height: 100%; background: var(--c-fg); transition: width 180ms var(--c-ease); }

/* Body: rail 280 | reading column | inspector 352 */
.nxc .nxr-body { display: grid; grid-template-columns: var(--r-rail) minmax(0, 1fr) var(--r-insp); min-height: 0; }
.nxr[data-rail="collapsed"] .nxr-body { grid-template-columns: var(--r-rail-c) minmax(0, 1fr) var(--r-insp); }
.nxc .nxr-rail, .nxc .nxr-insp { position: sticky; inset-block-start: calc(var(--r-bar) + 2px); align-self: start; height: calc(100vh - var(--r-bar) - 2px - var(--r-strip)); overflow: auto; background: var(--c-bg); overscroll-behavior: contain; }
.nxc .nxr-rail { border-inline-end: 1px solid var(--c-line); display: flex; flex-direction: column; }
.nxc .nxr-insp { border-inline-start: 1px solid var(--c-line); padding: 20px; display: flex; flex-direction: column; gap: 24px; }

/* Contents rail (kit 6.17: rail item) */
.nxc .nxr-rail__head { flex: none; display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 16px 16px 8px; }
.nxc .nxr-seg { flex: none; display: grid; grid-template-columns: repeat(3, 1fr); margin: 0 16px 8px; border: 1px solid var(--c-line2); border-radius: var(--c-radius); overflow: hidden; }
.nxc .nxr-seg__btn { display: flex; align-items: center; justify-content: center; height: 28px; padding: 0; line-height: 1; border: 0; border-inline-start: 1px solid var(--c-line2); background: transparent; color: var(--c-fg3); font: 500 12px/1 var(--c-sans); cursor: pointer; }
.nxc .nxr-seg__btn:first-child { border-inline-start: 0; }
.nxc .nxr-seg__btn[aria-pressed="true"] { background: var(--c-btn); color: var(--c-btn-ink); }
.nxc .nxr-rail__scroll { flex: 1 1 auto; overflow: auto; padding-block-end: 16px; }
.nxc .nxr-group { padding-block: 8px; border-block-start: 1px solid var(--c-line); }
.nxc .nxr-group__head { display: flex; align-items: flex-start; gap: 10px; margin: 0; padding: 8px 16px; font-size: 13px; font-weight: 500; line-height: 1.35; }
.nxc .nxr-group__head .nxr-ringwrap { margin-block-start: 2px; }
.nxc .nxr-group__text { display: grid; gap: 2px; min-width: 0; }
.nxc .nxr-group__title { color: var(--c-fg); }
.nxc .nxr-items { list-style: none; margin: 0; padding: 0; }
.nxc .nxr-items__li[hidden] { display: none; }
.nxc .nxr-item { position: relative; display: grid; grid-template-columns: 16px minmax(0, 1fr) auto; align-items: start; gap: 10px; padding: 7px 16px 7px 16px; color: var(--c-fg2); font-size: 13px; line-height: 1.4; }
.nxc .nxr-item:hover { background: var(--c-hover); color: var(--c-fg); }
.nxc .nxr-item[aria-current="page"] { color: var(--c-fg); background: var(--c-accent-soft); }
.nxc .nxr-item[aria-current="page"]::before { content: ""; position: absolute; inset-block: 0; inset-inline-start: 0; width: 2px; background: var(--c-fg); }
.nxc .nxr-item__ic { display: inline-flex; padding-block-start: 1px; color: var(--c-fg3); }
.nxc .nxr-items__li[data-state="done"] .nxr-item__ic { color: var(--c-pos); }
.nxc .nxr-item__min { font: 400 11px/1.6 var(--c-mono); color: var(--c-fg3); white-space: nowrap; }
.nxc .nxr-rail__none { padding: 16px; color: var(--c-fg3); font-size: 13px; }
.nxr[data-rail="collapsed"] .nxr-rail__label, .nxr[data-rail="collapsed"] .nxr-seg, .nxr[data-rail="collapsed"] .nxr-group__text, .nxr[data-rail="collapsed"] .nxr-item__title, .nxr[data-rail="collapsed"] .nxr-item__min { display: none; }
.nxr[data-rail="collapsed"] .nxr-item { grid-template-columns: 1fr; justify-items: center; padding-inline: 0; }
.nxr[data-rail="collapsed"] .nxr-group__head { justify-content: center; padding-inline: 0; }
.nxr[data-rail="collapsed"] .nxr-rail__head { justify-content: center; padding-inline: 0; }

/* Progress ring (kit 6.17): hairline track, text-primary arc, mono percent */
.nxc .nxr-ringwrap { display: inline-flex; align-items: center; gap: 6px; flex: none; }
.nxc .nxr-ring { display: block; }
.nxc .nxr-ring__track { fill: none; stroke: var(--c-line2); }
.nxc .nxr-ring__arc { fill: none; stroke: var(--c-fg); stroke-linecap: butt; }
.nxc .nxr-ring__num { font: 500 12px/1 var(--c-mono); color: var(--c-fg); font-variant-numeric: tabular-nums; }

/* Reading column (max 720) */
.nxc .nxr-main { min-width: 0; outline: none; }
.nxc .nxr-read { max-width: var(--r-read); margin-inline: 0; padding: 40px clamp(24px, 3vw, 56px) 64px; display: flex; flex-direction: column; gap: 16px; }
.nxc .nxr-h1 { margin: 0; font-size: 28px; font-weight: 500; letter-spacing: -.02em; line-height: 1.2; color: var(--c-fg); }
.nxc .nxr-chips { list-style: none; display: flex; flex-wrap: wrap; gap: 6px; margin: 0; padding: 0; }
.nxc .nxr-chip { display: inline-flex; align-items: center; height: 22px; padding: 0 8px; border: 1px solid var(--c-line2); border-radius: var(--c-radius-s); font: 500 10.5px/1 var(--c-mono); letter-spacing: .08em; color: var(--c-fg2); }
.nxc .nxr-card { border: 1px solid var(--c-line); border-radius: var(--c-radius); background: var(--c-surf); padding: 16px 20px; }
.nxc .nxr-facts { display: grid; grid-template-columns: repeat(auto-fit, minmax(120px, 1fr)); gap: 12px; margin: 0; }
.nxc .nxr-facts dt { color: var(--c-fg3); font-size: 12px; }
.nxc .nxr-facts dd { margin: 4px 0 0; font-size: 20px; font-weight: 500; color: var(--c-fg); }

/* Assessment stepper (kit 6.17, FoundryStepper compact) */
.nxc .nxr-stepper { list-style: none; display: flex; flex-wrap: wrap; gap: 8px 24px; margin: 0; padding: 0; counter-reset: none; }
.nxc .nxr-stepper__step { display: inline-flex; align-items: center; gap: 8px; color: var(--c-fg3); font-size: 13px; }
.nxc .nxr-stepper__n { display: inline-grid; place-items: center; width: 22px; height: 22px; border: 1px solid var(--c-line2); border-radius: var(--c-radius-s); font: 500 11px/1 var(--c-mono); }
.nxc .nxr-stepper__step[aria-current="step"] { color: var(--c-fg); }
.nxc .nxr-stepper__step[aria-current="step"] .nxr-stepper__n { background: var(--c-btn); color: var(--c-btn-ink); border-color: var(--c-btn); }

/* The framed unit (Open edX, room mode) */
.nxc .nxr-frame { border-block: 1px solid var(--c-line); padding-block: 8px; }
.nxc .nxr-frame__el { display: block; width: 100%; min-height: 70vh; border: 0; background: transparent; color-scheme: light dark; }
.nxc .nxr-frame__el[data-fit="1"] { min-height: 0; }

/* Next-up cards (kit 6.17) */
.nxc .nxr-next { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-block-start: 8px; }
.nxc .nxr-nextcard { display: grid; gap: 4px; padding: 14px 16px; border: 1px solid var(--c-line); border-radius: var(--c-radius); background: var(--c-surf); color: var(--c-fg2); transition: border-color var(--c-fast) var(--c-ease), background-color var(--c-fast) var(--c-ease); }
.nxc .nxr-nextcard:hover { border-color: var(--c-line2); background: var(--c-hover); }
.nxc .nxr-nextcard--next { text-align: end; }
.nxc .nxr-nextcard__title { color: var(--c-fg); font-weight: 500; font-size: 15px; line-height: 1.35; }
.nxc .nxr-nextcard__meta { font: 400 12px/1.4 var(--c-mono); color: var(--c-fg3); }

/* Inspector sections (kit 6.17) */
.nxc .nxr-insp__head { display: flex; align-items: center; justify-content: space-between; }
.nxc .nxr-sec { display: grid; gap: 10px; }
.nxc .nxr-sec__title { margin: 0; font: 500 11px/1.4 var(--c-mono); letter-spacing: .16em; text-transform: uppercase; color: var(--c-fg3); }
.nxc .nxr-toc, .nxc .nxr-lo, .nxc .nxr-rubric, .nxc .nxr-marks { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; font-size: 13px; color: var(--c-fg2); line-height: 1.45; }
.nxc .nxr-toc li { padding-inline-start: 10px; border-inline-start: 1px solid var(--c-line2); }
.nxc .nxr-lo li { display: grid; grid-template-columns: auto 1fr; gap: 8px; align-items: start; }
.nxc .nxr-rubric li { display: flex; justify-content: space-between; gap: 12px; padding-block: 6px; border-block-end: 1px solid var(--c-line); }
.nxc .nxr-terms { margin: 0; display: grid; gap: 10px; font-size: 13px; }
.nxc .nxr-terms dt { color: var(--c-fg); font-weight: 500; }
.nxc .nxr-terms dd { margin: 2px 0 0; color: var(--c-fg2); line-height: 1.45; }
.nxc .nxr-note { width: 100%; box-sizing: border-box; min-height: 88px; padding: 10px 12px; border: 1px solid var(--c-line2); border-radius: var(--c-radius); background: var(--c-surf); color: var(--c-fg); font: 400 13px/1.5 var(--c-sans); resize: vertical; }
.nxc .nxr-marks a { text-decoration: underline; text-underline-offset: 3px; }
.nxc .nf-ui-btn.nxr-btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 36px; padding: 0 14px; border: 1px solid var(--c-line2); border-radius: var(--c-radius); background: transparent; color: var(--c-fg); font: 500 13px/1 var(--c-sans); cursor: pointer; justify-self: start; text-decoration: none; }
.nxc .nf-ui-btn.nxr-btn[data-variant="primary"] { background: var(--c-btn); color: var(--c-btn-ink); border-color: var(--c-btn); }
.nxc .nf-ui-btn.nxr-btn[data-variant="ghost"] { border-color: transparent; padding-inline: 0; text-decoration: underline; text-underline-offset: 3px; }
.nxc .nf-ui-btn.nxr-btn[aria-pressed="true"] { background: var(--c-accent-soft); border-color: var(--c-fg); }

/* Status strip (mono 11px, status by dot) */
.nxc .nxr-strip { position: sticky; inset-block-end: 0; z-index: 20; display: flex; align-items: center; gap: 20px; padding-inline: 16px; overflow: hidden; white-space: nowrap; border-block-start: 1px solid var(--c-line); background: var(--c-bg); font: 400 11px/1 var(--c-mono); color: var(--c-fg3); }
.nxc .nxr-strip__item { display: inline-flex; align-items: center; gap: 6px; }
.nxc .nxr-dot { width: 6px; height: 6px; border-radius: 50%; background: var(--c-fg3); }
.nxc .nxr-dot[data-tone="positive"] { background: var(--c-pos); }

/* Command palette and glossary (dialogs) */
.nxc .nxr-dialog { width: min(640px, calc(100vw - 32px)); max-height: min(70vh, 640px); padding: 0; border: 1px solid var(--c-line2); border-radius: var(--c-radius); background: var(--c-elev); color: var(--c-fg); }
.nxc .nxr-dialog::backdrop { background: var(--nx-bg-overlay, rgba(0, 0, 0, .7)); }
.nxc .nxr-palette { margin-block-start: 12vh; }
.nxc .nxr-palette__form { margin: 0; display: flex; flex-direction: column; max-height: inherit; }
.nxc .nxr-palette__field { display: flex; align-items: center; gap: 10px; padding: 0 16px; border-block-end: 1px solid var(--c-line); color: var(--c-fg3); }
.nxc .nxr-palette__field input { flex: 1; height: 52px; border: 0; background: transparent; color: var(--c-fg); font: 400 15px/1 var(--c-sans); outline: none; }
.nxc .nxr-palette__list { list-style: none; margin: 0; padding: 6px; overflow: auto; }
.nxc .nxr-palette__opt { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 2px 12px; padding: 9px 10px; border-radius: var(--c-radius); cursor: pointer; font-size: 14px; color: var(--c-fg2); }
.nxc .nxr-palette__opt[aria-selected="true"] { background: var(--c-accent-soft); color: var(--c-fg); }
.nxc .nxr-palette__meta { font: 400 11px/1.6 var(--c-mono); color: var(--c-fg3); }
.nxc .nxr-palette__def { grid-column: 1 / -1; font-size: 12.5px; color: var(--c-fg3); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.nxc .nxr-palette__hint { padding: 8px 16px 12px; border-block-start: 1px solid var(--c-line); font-size: 12px; }
.nxc .nxr-glossary { padding: 20px; }
.nxc .nxr-glossary__head { display: flex; align-items: center; justify-content: space-between; margin-block-end: 12px; }
.nxc .nxr-glossary__head form { margin: 0; }

/* Phone and tablet: drawers and the bottom bar */
.nxc .nxr-bottom, .nxc .nxr-only-narrow { display: none; }
.nxc .nxr-scrim { position: fixed; inset: 0; z-index: 40; background: var(--nx-bg-overlay, rgba(0, 0, 0, .7)); }
@media (max-width: 1279.98px) {
  .nxc .nxr-body, .nxr[data-rail="collapsed"] .nxr-body { grid-template-columns: var(--r-rail) minmax(0, 1fr); }
  .nxc .nxr-insp { position: fixed; inset-block: 0; inset-inline-end: 0; z-index: 50; width: min(var(--r-insp), 92vw); height: auto; transform: translateX(100%); transition: transform 180ms var(--c-ease); }
  :root[dir="rtl"] .nxr-insp { transform: translateX(-100%); }
  .nxc .nxr-insp.is-open { transform: none; }
  .nxc .nxr-only-narrow { display: inline-flex; }
  .nxc .nxr-insp__head.nxr-only-narrow { display: flex; }
  .nxc .nxr-only-wide { display: none; }
}
@media (max-width: 1023.98px) {
  .nxr { grid-template-rows: var(--r-bar) 2px minmax(0, 1fr) 64px; }
  .nxc .nxr-body, .nxr[data-rail="collapsed"] .nxr-body { grid-template-columns: minmax(0, 1fr); }
  .nxc .nxr-rail { position: fixed; inset-block: 0; inset-inline-start: 0; z-index: 50; width: min(var(--r-rail), 88vw); height: auto; transform: translateX(-100%); transition: transform 180ms var(--c-ease); }
  :root[dir="rtl"] .nxr-rail { transform: translateX(100%); }
  .nxc .nxr-rail.is-open { transform: none; }
  .nxc .nxr-bar { gap: 8px; padding-inline: 12px; }
  .nxc .nxr-bar__brand, .nxc .nxr-bar__where, .nxc .nxr-bar__searchtext, .nxc .nxr-kbd { display: none; }
  .nxc .nxr-bar__search { min-width: 36px; border-color: transparent; }
  .nxc .nxr-bar__course { border: 0; padding-inline-start: 0; }
  .nxc .nxr-strip { display: none; }
  .nxc .nxr-bottom { position: sticky; inset-block-end: 0; z-index: 30; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 0 12px; background: var(--c-bg); border-block-start: 1px solid var(--c-line); }
  .nxc .nxr-bottom .nxr-iconbtn { min-width: 44px; height: 44px; }
  .nxc .nxr-bottom .nxr-btn { min-height: 44px; }
  .nxc .nxr-read { padding: 24px 16px 40px; }
  .nxc .nxr-h1 { font-size: 24px; }
  .nxc .nxr-next { grid-template-columns: 1fr; }
  .nxc .nxr-nextcard--next { text-align: start; }
}
@media (prefers-reduced-motion: reduce) {
  .nxr *, .nxr *::before, .nxr *::after { transition: none !important; }
}
@media print {
  .nxc .nxr-bar, .nxc .nxr-line, .nxc .nxr-rail, .nxc .nxr-insp, .nxc .nxr-strip, .nxc .nxr-bottom { display: none !important; }
}

/* Course page and dashboard on the same patterns (1.11.0) */
.nxc .nxc-modules--cards { display: grid; gap: 12px; }
.nxc .nxc-modules--cards .nxc-module { border: 1px solid var(--c-line); border-radius: var(--c-radius); background: var(--c-surf); }
.nxc .nxc-modules--cards .nxc-module__head { grid-template-columns: 32px minmax(0, 1fr) auto 16px; gap: 16px; align-items: center; }
.nxc .nxc-modules--cards .nxc-module__title { display: grid; gap: 2px; }
.nxc .nxc-item[data-done="1"] .nxc-item__ic { color: var(--c-pos); }
.nxc .nxa-continue { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 16px 24px; margin-top: 24px; }
.nxc .nxa-continue__text { display: grid; gap: 4px; min-width: 0; }
.nxc .nxa-continue__title { margin: 0; font-size: 18px; font-weight: 500; letter-spacing: -.01em; color: var(--c-fg); }
.nxc .nxa-dash__list { grid-template-columns: repeat(auto-fill, minmax(min(100%, 340px), 1fr)); }
.nxc .nxa-dash__item { align-items: flex-start; justify-content: flex-start; }
.nxc .nxa-dash__item .nxc-meta { display: flex; flex-wrap: wrap; gap: 4px 12px; }
@media (max-width: 720px) { .nxa-continue { grid-template-columns: auto minmax(0, 1fr); } .nxa-continue .nxc-btn { grid-column: 1 / -1; justify-self: start; } }
.nxc .nxc-modules--cards .nxc-module__head { padding: 12px 16px; } .nxc-modules--cards .nxc-items { padding: 0 16px 12px; }

/* Info tooltip, first-use guide and the help band (kit 6.17; owner 2026-11-03: less text, icons, help at the bottom) */
.nxc .nxa-tip { position: relative; display: inline-flex; vertical-align: middle; margin-inline-start: 6px; }
.nxc .nxa-tip__btn { display: inline-grid; place-items: center; width: 24px; height: 24px; padding: 0; border: 0; border-radius: var(--c-radius-s); background: transparent; color: var(--c-fg3); cursor: help; }
.nxc .nxa-tip__btn:hover, .nxc .nxa-tip__btn:focus-visible { color: var(--c-fg); background: var(--c-hover); }
.nxc .nxa-tip__pop { position: absolute; inset-block-start: calc(100% + 6px); inset-inline-start: -8px; z-index: 60; width: max-content; max-width: min(300px, calc(100vw - 48px)); padding: 8px 10px; border: 1px solid var(--c-line2); border-radius: var(--c-radius); background: var(--c-elev); color: var(--c-fg2); font: 400 12.5px/1.45 var(--c-sans); letter-spacing: normal; text-transform: none; white-space: normal; text-align: start; display: none; pointer-events: none; }
.nxc .nxa-tip:hover .nxa-tip__pop, .nxc .nxa-tip__btn:focus-visible + .nxa-tip__pop { display: block; }
.nxc .nxa-tip.is-quiet .nxa-tip__pop { display: none; }
.nxc .nxa-lead { display: flex; align-items: center; gap: 4px; }
.nxc .nxr-sec__title { display: flex; align-items: center; gap: 8px; }
.nxc .nxr-sec__title .nxa-tip { margin-inline-start: auto; }
.nxc .nxc-btn .nxc-ic, .nxc .nxr-btn .nxc-ic { flex: none; }
.nxc .nxc-card__summary { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.nxc .nxa-guide { position: fixed; inset-block-end: 24px; inset-inline-end: 24px; z-index: 45; width: min(360px, calc(100vw - 32px)); display: grid; gap: 12px; padding: 16px 18px; border: 1px solid var(--c-line2); border-radius: var(--c-radius); background: var(--c-elev); color: var(--c-fg); }
.nxc .nxa-guide[hidden] { display: none; }
.nxc .nxa-guide__head { display: flex; align-items: center; justify-content: space-between; }
.nxc .nxa-guide__head .nf-ui-eyebrow { display: inline-flex; align-items: center; gap: 6px; }
.nxc .nxa-guide__close { display: inline-grid; place-items: center; width: 32px; height: 32px; padding: 0; border: 0; border-radius: var(--c-radius); background: transparent; color: var(--c-fg3); cursor: pointer; }
.nxc .nxa-guide__close:hover { background: var(--c-hover); color: var(--c-fg); }
.nxc .nxa-guide__title { margin: 0; font-size: 16px; font-weight: 500; letter-spacing: -.01em; }
.nxc .nxa-guide__steps { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; font-size: 13px; line-height: 1.45; color: var(--c-fg2); }
.nxc .nxa-guide__step { display: grid; grid-template-columns: 28px minmax(0, 1fr); gap: 10px; align-items: start; }
.nxc .nxa-guide__step strong { color: var(--c-fg); font-weight: 500; }
.nxc .nxa-guide__ic { display: inline-grid; place-items: center; width: 28px; height: 28px; border: 1px solid var(--c-line2); border-radius: var(--c-radius-s); color: var(--c-fg); }
.nxc .nxa-help { margin-block-start: 48px; padding-block-start: 20px; border-block-start: 1px solid var(--c-line); }
.nxc .nxa-help__title { display: flex; align-items: center; gap: 8px; margin: 0 0 12px; font: 500 11px/1.4 var(--c-mono); letter-spacing: .16em; text-transform: uppercase; color: var(--c-fg3); }
.nxc .nxa-help__list { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 200px), 1fr)); gap: 8px; }
.nxc .nxa-help__link { display: flex; align-items: center; gap: 10px; width: 100%; min-height: 44px; padding: 0 12px; border: 1px solid var(--c-line); border-radius: var(--c-radius); background: var(--c-surf); color: var(--c-fg2); font: 400 13.5px/1.3 var(--c-sans); text-align: start; cursor: pointer; transition: border-color var(--c-fast) var(--c-ease), background-color var(--c-fast) var(--c-ease); }
.nxc .nxa-help__link:hover { border-color: var(--c-line2); background: var(--c-hover); color: var(--c-fg); }
.nxr .nxa-guide { inset-block-end: calc(var(--r-strip) + 16px); }
@media (max-width: 1023.98px) { .nxr .nxa-guide { inset-block-end: 80px; inset-inline: 16px; width: auto; } }
.nxc .nxr-labs { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; font-size: 13px; }
.nxc .nxr-labs__item { display: flex; justify-content: space-between; gap: 12px; padding-block: 6px; border-block-end: 1px solid var(--c-line); }
.nxc .nxr-labs__name { font-family: var(--c-mono); font-size: 12px; color: var(--c-fg2); overflow-wrap: anywhere; }
.nxc .nxr-labs__state { font-family: var(--c-mono); font-size: 12px; color: var(--c-fg3); white-space: nowrap; }
.nxc .nxr-labs__state[data-done="1"] { color: var(--c-pos); }

/* Open preview (1.14.0): Start here and Module 1 open to everyone. A slim banner above the unit, the enrol action at
   its end; locked units in the rail are quieter; the rail's last open module ends with an enrol row. */
.nxc .nxr-previewbar { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 16px; padding: 10px 12px 10px 14px; border: 1px solid var(--c-line2); border-radius: var(--c-radius); background: var(--c-muted); font-size: 13px; line-height: 1.45; color: var(--c-fg); }
.nxc .nxr-previewbar__text { display: flex; align-items: baseline; gap: 8px; flex: 1 1 280px; min-width: 0; margin: 0; }
.nxc .nxr-previewbar__text .nxr-dot { flex: none; transform: translateY(-1px); background: var(--c-info); }
.nxc .nxr-previewbar__tag { font: 500 10.5px/1 var(--c-mono); letter-spacing: .08em; text-transform: uppercase; color: var(--c-fg2); }
.nxc .nxr-previewbar__note { flex-basis: 100%; margin: 0; padding-inline-start: 14px; color: var(--c-fg3); font-size: 12px; }
.nxc .nxr-previewbar form { margin: 0; }
.nxc .nxr-previewbar .nf-ui-btn.nxr-btn { min-height: 32px; }
.nxc .nxr-items__li[data-state="locked"] .nxr-item { color: var(--c-fg3); }
.nxc .nxr-items__li[data-state="locked"] .nxr-item:hover { background: transparent; color: var(--c-fg3); }
.nxc .nxr-group__open { margin-inline-start: auto; font: 500 10px/1 var(--c-mono); letter-spacing: .08em; text-transform: uppercase; color: var(--c-fg3); border: 1px solid var(--c-line2); border-radius: var(--c-radius-s); padding: 3px 5px; }
.nxc .nxr-unlock { display: grid; gap: 8px; margin: 8px 16px 16px; padding: 12px; border: 1px dashed var(--c-line2); border-radius: var(--c-radius); font-size: 12.5px; color: var(--c-fg2); }
.nxc .nxr-unlock p { margin: 0; }
.nxr[data-rail="collapsed"] .nxr-unlock, .nxr[data-rail="collapsed"] .nxr-group__open { display: none; }

/* 1.14.2, owner review of the room. One page scroll: the unit frame follows its content (courses.js), the middle column
   uses the full width between the rails, running text keeps a reading measure. Scrollbars are thin and take the theme's
   line colour in both modes, never the browser's white bar. The colour switch and the accessibility tools sit in the
   bar (data-nxr-mode, data-nxd-slot), so nothing floats over the contents or the status strip. */
.nxc .nxr-read > :where(h1, h2, h3, p, ul, ol, blockquote, .nxr-lede) { max-width: 78ch; }
.nxr, .nxr * { scrollbar-width: thin; scrollbar-color: var(--c-line2) transparent; }
.nxr ::-webkit-scrollbar { width: 8px; height: 8px; }
.nxr ::-webkit-scrollbar-track { background: transparent; }
.nxr ::-webkit-scrollbar-thumb { background: var(--c-line2); border-radius: 2px; border: 2px solid transparent; background-clip: padding-box; }
.nxr ::-webkit-scrollbar-thumb:hover { background-color: var(--c-fg3); }
.nxc .nxr-bar__tools { display: inline-flex; align-items: center; }
.nxc .nxr-bar__tools:empty { display: none; }
.nxc .nxr-bar [data-nx-switch] { position: static !important; inset: auto !important; margin: 0; box-shadow: none; }
.nxc .nxr-bar [data-nx-switch] .nx-switch__t { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
body:has(.nxr) .nx-switch--floating:not(.nxr-bar *) { display: none; }
.nxc .nxr-strip { padding-inline-start: max(16px, env(safe-area-inset-left, 0px)); }
.nxr .nxa-guide { inset-inline-end: calc(var(--r-insp) + 24px); }
@media (max-width: 1279.98px) { .nxr .nxa-guide { inset-inline-end: 24px; } }
