/* Samplinglib visual system
   ------------------------------------------------------------
   This layer borrows the restrained academic rhythm of QuantumComputinglib:
   paper-like neutrals, Charter-style reading type, Inter-style UI type,
   compact headings, thin rules, minimal radius, and almost no card shadows.
   It intentionally loads last and does not alter ASTIS information semantics. */

:root {
  --paper: #f7f7f4;
  --surface: #ffffff;
  --surface-2: #f0f2f1;
  --ink: #202526;
  --muted: #596568;
  --quiet: #758084;
  --line: #d4dad8;
  --line-strong: #879497;
  --accent: #35657d;
  --accent-2: #294e61;
  --accent-soft: #edf3f6;
  --rigorous: #745f86;
  --lean: #2f705c;
  --red: #a24d42;
  --red-soft: #faefed;
  --yellow: #886a2e;
  --yellow-soft: #f6f1e5;
  --orange: #9a6335;
  --orange-soft: #f7efe7;
  --purple: #745f86;
  --purple-soft: #f2eef5;
  --green: #2f705c;
  --green-soft: #eaf3ef;
  --shadow: 0 12px 30px rgba(31, 42, 42, 0.09);
  --radius: 3px;
  --font-body: Charter, "Bitstream Charter", "Iowan Old Style", Georgia, serif;
  --font-display: Charter, "Bitstream Charter", "Iowan Old Style", Georgia, serif;
  --font-ui: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-code: "SFMono-Regular", Consolas, "Liberation Mono", monospace;
  --academic-page-width: 1260px;
  --academic-measure: 72ch;
  --reading-width: 1120px;
  --sidebar-width: 268px;
}

html[data-theme="modern"] {
  --paper: #f8f8f6;
  --surface: #ffffff;
  --surface-2: #f1f3f2;
  --ink: #212827;
  --muted: #5b6663;
  --line: #d6dcd8;
  --accent: #34745c;
  --accent-2: #245544;
  --accent-soft: #edf5f0;
}

html[data-theme="bold"] {
  --paper: #ffffff;
  --surface: #ffffff;
  --surface-2: #f1f1ee;
  --ink: #101414;
  --muted: #374143;
  --quiet: #4c5759;
  --line: #8b9494;
  --line-strong: #303a3b;
  --accent: #176247;
  --accent-2: #104b36;
  --accent-soft: #e2f2ea;
  --shadow: none;
  --radius: 2px;
}

html[data-color-scheme="dark"] {
  --paper: #151918;
  --surface: #1c211f;
  --surface-2: #242a27;
  --ink: #edf1ef;
  --muted: #b3bdb9;
  --quiet: #919c98;
  --line: #39413e;
  --line-strong: #69746f;
  --accent: #8db5c8;
  --accent-2: #b1cedb;
  --accent-soft: #23363f;
  --rigorous: #bea9cb;
  --lean: #83bca7;
  --red: #d98f86;
  --red-soft: #3d2826;
  --yellow: #d7bd76;
  --yellow-soft: #3b3422;
  --orange: #d3a071;
  --orange-soft: #3c2d22;
  --purple: #bea9cb;
  --purple-soft: #342d39;
  --green: #83bca7;
  --green-soft: #253a32;
  --shadow: 0 14px 34px rgba(0, 0, 0, 0.2);
}

html,
body {
  max-width: 100%;
  overflow-x: clip;
}

body {
  color: var(--ink);
  background: var(--paper) !important;
  font-family: var(--font-body);
  font-size: 17px;
  line-height: 1.66;
  letter-spacing: 0;
}

body::before,
body::after {
  display: none !important;
}

a {
  color: var(--accent-2);
  text-decoration-color: color-mix(in srgb, currentColor 45%, transparent);
  text-decoration-thickness: 1px;
  text-underline-offset: 0.18em;
}

a:hover {
  color: var(--red);
  text-decoration-color: currentColor;
}

button,
input,
select,
summary,
.site-sidebar,
.mobile-bar,
.verification-strip,
.eyebrow,
.portal-kicker,
.card-meta,
.file-ref,
.tag-row,
.status,
.toolbar,
.reader-breadcrumb,
.reader-kicker,
.source-anchor,
.reader-pagination,
.pane-kicker,
.toc-part,
.book-nav,
.sidebar-more,
.chapter-index,
.step-kicker {
  font-family: var(--font-ui);
}

code,
pre,
.kind,
.depth-number,
.root-tags,
.book-nav .compact-chapter-link span,
.current-chapter-sections a span {
  font-family: var(--font-code);
}

h1,
h2,
h3,
h4,
.section-heading h2,
.reader-header h1,
.reader-prose h2,
.theorem-layout > article > h2:not(:first-child) {
  color: var(--ink);
  font-family: var(--font-display);
  font-weight: 650;
  line-height: 1.2;
  letter-spacing: 0;
}

h1 {
  max-width: 920px;
  margin-bottom: 20px;
  font-size: 44px;
}

h2 {
  margin-bottom: 16px;
  font-size: 29px;
}

h3 {
  margin-bottom: 10px;
  font-size: 21px;
}

h4 {
  margin-bottom: 7px;
  font-size: 17px;
}

p,
li,
dd {
  max-width: var(--academic-measure);
}

.lede,
.reader-lede {
  max-width: 760px;
  color: var(--muted);
  font-size: 20px;
  line-height: 1.55;
  text-wrap: pretty;
}

/* Shell ---------------------------------------------------------------- */
.site-sidebar {
  width: var(--sidebar-width);
  gap: 16px;
  padding: 20px 18px 18px;
  border-right: 1px solid var(--line);
  background: var(--surface);
  box-shadow: none;
}

.site-stage {
  margin-left: var(--sidebar-width);
}

.site-stage main {
  max-width: var(--reading-width);
  padding-inline: clamp(22px, 3vw, 42px);
}

.site-stage .verification-strip,
.site-stage footer {
  padding-inline: max(30px, calc((100% - var(--reading-width)) / 2));
}

.site-sidebar .brand {
  display: grid;
  grid-template-columns: 32px minmax(0, 1fr);
  gap: 10px;
  align-items: center;
  padding: 0 2px 15px;
  border-bottom: 1px solid var(--line);
}

.site-sidebar .brand-mark {
  width: 32px;
  height: 32px;
  color: var(--surface);
  background: var(--ink);
  border-radius: 2px;
  font: 650 18px/1 var(--font-display);
}

.site-sidebar .brand strong {
  color: var(--ink);
  font-family: var(--font-ui);
  font-size: 18px;
  font-weight: 800;
  line-height: 1.12;
}

.site-sidebar .brand small {
  margin-top: 2px;
  color: var(--quiet);
  font-family: var(--font-ui);
  font-size: 10.5px;
  font-weight: 550;
  line-height: 1.35;
}

.site-sidebar .search-shell input {
  min-height: 38px;
  padding: 7px 10px;
  border: 1px solid var(--line);
  border-radius: 3px;
  background: var(--paper);
  font-family: var(--font-ui);
  font-size: 12px;
}

.sidebar-contents {
  gap: 15px;
}

.sidebar-group h2 {
  margin: 0 0 7px 7px;
  color: var(--quiet);
  font: 750 10px/1.2 var(--font-ui);
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.sidebar-group nav,
.chapter-nav nav {
  gap: 1px;
}

.sidebar-group a,
.chapter-nav a,
.current-chapter-sections a,
.sidebar-more nav a,
.book-nav .compact-chapter-link {
  min-width: 0;
  padding: 6px 7px;
  color: var(--muted);
  border-radius: 2px;
  font-family: var(--font-ui);
  font-size: 12px;
  font-weight: 600;
  line-height: 1.32;
  text-decoration: none;
}

.sidebar-group a:hover,
.sidebar-group a[aria-current="page"],
.chapter-nav a:hover,
.book-nav .compact-chapter-link:hover,
.book-nav .compact-chapter-link[aria-current="page"],
.current-chapter-sections a:hover,
.current-chapter-sections a[aria-current="page"] {
  color: var(--ink);
  background: var(--surface-2);
}

.sidebar-group .source-hub {
  gap: 2px;
  padding: 10px 8px;
  border: 0;
  border-top: 1px solid var(--line);
  background: transparent;
  border-radius: 0;
}

.sidebar-group .source-hub:last-child {
  border-bottom: 1px solid var(--line);
}

.sidebar-group .source-hub:hover,
.sidebar-group .source-hub[aria-current="page"] {
  border-color: var(--line-strong);
  background: var(--surface-2);
}

.source-hub-title {
  color: var(--ink);
  font-family: var(--font-ui);
  font-size: 13.5px;
  font-weight: 760;
}

.source-hub small {
  color: var(--quiet);
  font-family: var(--font-ui);
  font-size: 10.5px;
  line-height: 1.35;
}

.book-nav > summary,
.sidebar-more > summary,
.chapter-nav summary {
  padding: 5px 7px;
  color: var(--muted);
  border-radius: 2px;
  font-family: var(--font-ui);
  font-size: 11.5px;
  font-weight: 700;
}

.toc-part.compact {
  margin: 12px 0 4px;
  padding: 0 7px;
  color: var(--quiet);
  font-family: var(--font-ui);
  font-size: 9.5px;
}

.toc-part.compact span {
  color: var(--accent-2);
}

.current-chapter-sections {
  margin-left: 24px;
  border-left-color: var(--line);
}

.sidebar-utility {
  padding-top: 12px;
  border-top-color: var(--line);
  font-family: var(--font-ui);
}

.scheme-toggle {
  width: 34px;
  height: 34px;
  border-radius: 3px;
}

.verification-strip {
  min-height: 34px;
  align-items: center;
  padding-block: 6px;
  color: var(--muted) !important;
  border-bottom: 1px solid var(--line);
  background: var(--surface-2) !important;
  font-family: var(--font-ui);
  font-size: 11.5px;
}

.verification-strip strong {
  color: var(--green);
}

/* Homepage ------------------------------------------------------------- */
.ia-home-hero {
  max-width: 900px;
  margin: 0;
  padding: 72px 0 34px;
  border-bottom: 1px solid var(--line);
}

.ia-home-hero h1 {
  max-width: none;
  margin: 0 0 18px;
  font-size: 50px;
  line-height: 1.08;
  letter-spacing: 0;
}

.ia-home-hero .eyebrow {
  margin: 0 0 10px;
}

.ia-home-hero .lede {
  margin: 0;
}

.eyebrow,
.portal-kicker,
.section-heading > span {
  color: var(--yellow);
  font-family: var(--font-ui);
  font-size: 11px;
  font-weight: 750;
  letter-spacing: 0.05em;
  text-transform: none;
}

.source-portal-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0;
  margin-top: 42px;
  border-top: 1px solid var(--line-strong);
  border-bottom: 1px solid var(--line-strong);
}

.source-portal {
  min-height: 320px;
  padding: 28px 34px 30px 0;
  border: 0;
  border-top: 4px solid var(--accent);
  background: transparent;
  border-radius: 0;
  box-shadow: none;
}

.source-portal + .source-portal {
  padding-right: 0;
  padding-left: 34px;
  border-left: 1px solid var(--line);
}

.source-portal-wiki {
  border-top-color: var(--lean);
}

.source-portal h2 {
  margin: 9px 0 12px;
  font-size: 27px;
  line-height: 1.18;
  letter-spacing: 0;
}

.source-portal p {
  color: var(--muted);
  font-size: 16px;
}

.portal-metric {
  gap: 8px;
  padding-top: 22px;
}

.portal-metric strong {
  color: var(--ink);
  font: 650 30px/1 var(--font-display);
}

.portal-metric span {
  color: var(--quiet);
  font-family: var(--font-ui);
  font-size: 11px;
}

.portal-actions {
  gap: 10px 14px;
  margin-top: 18px;
  font-family: var(--font-ui);
}

.button,
.button.primary {
  min-height: 40px;
  padding: 8px 13px;
  border: 1px solid var(--ink);
  border-radius: 3px;
  font-family: var(--font-ui);
  font-size: 13px;
  font-weight: 700;
}

.button {
  color: var(--ink);
  background: transparent;
}

.button.primary {
  color: var(--surface);
  background: var(--ink);
}

.button:hover,
.button.primary:hover {
  color: var(--surface);
  border-color: var(--red);
  background: var(--red);
}

.portal-actions > a:not(.button),
.text-link {
  color: var(--accent-2);
  font-family: var(--font-ui);
  font-size: 13px;
  font-weight: 700;
  text-decoration: none;
}

.ia-shortcuts {
  margin: 34px 0 48px;
  border-color: var(--line-strong);
  border-radius: 0;
  background: var(--line);
}

.ia-shortcuts a {
  padding: 15px 17px;
}

.ia-shortcuts span,
.companion-tools span {
  color: var(--quiet);
  font-family: var(--font-ui);
  font-size: 9.5px;
  letter-spacing: 0.06em;
}

.ia-shortcuts strong {
  font-family: var(--font-ui);
  font-size: 13px;
}

/* Content rhythm ------------------------------------------------------- */
.site-stage main > section,
main > section {
  margin: 52px 0;
}

.page-hero,
.page-hero.compact {
  max-width: 920px;
  margin-bottom: 36px;
  padding-top: 54px;
}

.page-hero::after {
  display: none !important;
}

.page-hero.compact h1,
.live-hero h1,
.overview-hero h1,
.contribution-hero h1 {
  max-width: 920px;
  margin-bottom: 18px;
  font-size: 44px;
  line-height: 1.15;
  letter-spacing: 0;
}

.section-heading {
  max-width: 790px;
  margin-bottom: 24px;
}

.section-heading h2 {
  max-width: 790px;
  margin: 0;
  font-size: 29px;
  line-height: 1.2;
}

.section-heading > span {
  margin-bottom: 8px;
}

.zoom-grid,
.study-route,
.proof-cluster-grid,
.companion-grid,
.companion-support-grid {
  gap: 0;
  border-top: 1px solid var(--line-strong);
  border-bottom: 1px solid var(--line-strong);
}

.zoom-grid article,
.companion-support-grid article,
.proof-cluster,
.companion-grid article {
  padding: 24px 24px 26px 0;
  border: 0;
  border-top: 0;
  background: transparent;
  box-shadow: none;
}

.zoom-grid article + article,
.companion-support-grid article + article,
.proof-cluster + .proof-cluster,
.companion-grid article + article {
  padding-left: 24px;
  border-left: 1px solid var(--line);
}

.zoom-grid p,
.companion-support-grid p,
.proof-cluster p,
.companion-grid p {
  color: var(--muted);
  font-size: 15px;
}

.study-route > a,
.chapter-one-route > a,
.companion-tools > a {
  padding: 15px 16px;
  border-color: var(--line);
  border-radius: 2px;
  background: var(--surface);
}

.study-route > a:hover,
.chapter-one-route > a:hover,
.companion-tools > a:hover {
  border-color: var(--line-strong);
  background: var(--surface-2);
}

/* Cards and surfaces: editorial, not dashboard. */
.source-card,
.theorem-mini,
.info-card,
.detail-category-grid article,
.lesson-grid article,
.attribution-grid article,
.calculation-step,
.chapter-card,
.route-row,
.correspondence-card,
.theorem-layout > article,
.theorem-sidebar > section,
.progress-panel,
.example-links > div,
.reader-pagination a,
.reader-disclosure,
details,
.note,
.pitfall,
.toolbar,
.architecture-figure,
.diagram,
.table-wrap,
.module-meta {
  border-color: var(--line);
  border-radius: 3px;
  box-shadow: none !important;
}

.source-card,
.theorem-mini,
.info-card,
.detail-category-grid article,
.lesson-grid article,
.attribution-grid article,
.chapter-card,
.route-row,
.correspondence-card,
.theorem-layout > article,
.theorem-sidebar > section,
.progress-panel,
.example-links > div {
  background: var(--surface);
}

.theorem-mini:hover,
.source-card:hover {
  transform: none;
  border-color: var(--line-strong);
  box-shadow: none;
}

.chapter-card,
.route-row {
  grid-template-columns: 58px minmax(0, 1fr);
  gap: 18px;
  padding: 20px 0;
  border-width: 0 0 1px;
  background: transparent;
}

.chapter-index {
  color: var(--accent-2);
  font: 650 22px var(--font-display);
}

.tag-row > span:not(.status),
.mini-tag,
.status {
  border-radius: 2px;
  font-family: var(--font-ui);
}

.tag-row > span:not(.status),
.mini-tag {
  padding: 2px 6px;
  background: transparent;
  font-size: 10.5px;
}

.status {
  padding: 2px 6px;
  font-size: 10px;
  letter-spacing: 0;
}

.metric-row,
.module-meta {
  border-color: var(--line-strong);
  border-radius: 0;
}

.metric-row > div,
.module-meta > div {
  padding: 17px 19px;
}

.metric-row strong {
  font: 650 30px var(--font-display);
}

.metric-row span {
  font-family: var(--font-ui);
  font-size: 11px;
}

.note,
.ia-project-note {
  color: var(--muted);
  border: 0;
  border-left: 3px solid var(--accent);
  background: var(--surface-2);
  border-radius: 0;
}

.pitfall {
  border-left: 3px solid var(--red);
  background: var(--red-soft);
}

.formula,
.math-statement {
  border: 0;
  border-left: 3px solid var(--accent);
  background: var(--surface-2);
  border-radius: 0;
}

.code-block {
  color: #edf2f1;
  background: #202728;
  border-color: #303a3b;
  border-radius: 3px;
  font-size: 12px;
  line-height: 1.58;
}

.table-wrap {
  border-color: var(--line-strong);
}

table {
  font-family: var(--font-ui);
  font-size: 12px;
}

th {
  color: var(--muted);
  background: var(--surface-2);
  font-size: 10px;
  letter-spacing: 0.04em;
}

th,
td {
  padding: 10px 11px;
}

/* Textbook reading surface -------------------------------------------- */
.textbook-reader {
  width: min(100%, 760px);
  padding: 54px 0 76px;
  font-family: var(--font-body);
  font-size: 17px;
  line-height: 1.72;
}

.reader-header {
  padding-bottom: 28px;
  border-bottom-color: var(--line);
}

.reader-header h1 {
  max-width: 760px;
  margin-bottom: 14px;
  font: 650 42px/1.16 var(--font-display);
}

.reader-kicker,
.reader-breadcrumb,
.source-anchor,
.reader-disclosure summary,
.reader-pagination {
  font-family: var(--font-ui);
}

.reader-kicker {
  margin-bottom: 10px;
  color: var(--yellow);
  font-size: 10.5px;
  letter-spacing: 0.04em;
  text-transform: none;
}

.reader-lede {
  max-width: 700px;
  font-size: 19px;
}

.reader-prose {
  padding-top: 30px;
}

.reader-prose h2 {
  margin: 32px 0 10px;
  font: 650 27px/1.2 var(--font-display);
}

.reader-prose h3,
.disclosure-body h3 {
  margin-top: 24px;
  font: 650 18px/1.3 var(--font-display);
}

.reader-disclosure {
  background: var(--surface);
}

.reader-disclosure summary {
  padding: 11px 13px;
  font-size: 12.5px;
}

.disclosure-body {
  padding: 13px 15px;
  font-family: var(--font-body);
  font-size: 15.5px;
  line-height: 1.65;
}

.reader-pagination a {
  min-height: 68px;
  padding: 10px 12px;
}

/* Proof/theorem pages -------------------------------------------------- */
.theorem-layout {
  grid-template-columns: minmax(0, 1fr) minmax(235px, 285px);
  gap: 38px;
}

.theorem-layout > article {
  padding: 26px 28px;
  border-top: 3px solid var(--accent);
}

.theorem-layout > article > h2:not(:first-child) {
  margin-top: 38px;
  padding-top: 15px;
  border-top: 1px solid var(--line);
  font-size: 25px;
}

.theorem-sidebar {
  top: 28px;
}

.theorem-sidebar > section {
  padding: 13px 14px;
}

.theorem-sidebar h2,
.theorem-sidebar h3 {
  font-family: var(--font-ui);
  font-size: 10px;
  letter-spacing: 0.06em;
}

.correspondence-card {
  padding: 21px 22px;
}

.correspondence-flow {
  border-color: var(--line);
  border-radius: 0;
}

.correspondence-flow > div {
  padding: 18px 17px;
  background: var(--surface);
}

.correspondence-flow > div:not(:last-child)::after {
  display: none;
}

/* Footer --------------------------------------------------------------- */
footer,
.site-stage footer {
  padding-top: 24px;
  padding-bottom: 34px;
  color: var(--quiet);
  border-top: 1px solid var(--line);
  background: transparent;
  font-family: var(--font-ui);
  font-size: 11px;
}

/* Responsive ----------------------------------------------------------- */
@media (max-width: 980px) {
  :root {
    --sidebar-width: 248px;
  }

  .source-portal-grid,
  .zoom-grid,
  .study-route,
  .proof-cluster-grid,
  .companion-grid,
  .companion-support-grid {
    grid-template-columns: 1fr;
  }

  .source-portal,
  .source-portal + .source-portal,
  .zoom-grid article,
  .zoom-grid article + article,
  .companion-support-grid article,
  .companion-support-grid article + article,
  .proof-cluster,
  .proof-cluster + .proof-cluster,
  .companion-grid article,
  .companion-grid article + article {
    padding: 22px 0;
    border-left: 0;
    border-top: 1px solid var(--line);
  }

  .source-portal:first-child,
  .zoom-grid article:first-child,
  .companion-support-grid article:first-child,
  .proof-cluster:first-child,
  .companion-grid article:first-child {
    border-top-color: var(--line-strong);
  }
}

@media (max-width: 820px) {
  body {
    font-size: 16px;
  }

  .site-stage {
    margin-left: 0;
  }

  .mobile-bar {
    min-height: 54px;
    border-bottom: 1px solid var(--line);
    background: var(--surface);
    font-family: var(--font-ui);
  }

  .site-sidebar {
    width: min(310px, 88vw);
  }

  .site-stage main {
    padding-inline: 18px;
  }

  .ia-home-hero {
    padding-top: 48px;
  }

  .ia-home-hero h1,
  .page-hero.compact h1,
  .live-hero h1,
  .overview-hero h1,
  .contribution-hero h1 {
    font-size: 36px;
  }

  .lede,
  .reader-lede {
    font-size: 18px;
  }

  .section-heading h2 {
    font-size: 26px;
  }

  .textbook-reader {
    padding-top: 38px;
    font-size: 16px;
  }

  .reader-header h1 {
    font-size: 34px;
  }

  .theorem-layout {
    grid-template-columns: 1fr;
  }

  .theorem-sidebar {
    position: static;
  }
}

@media (max-width: 560px) {
  .ia-home-hero h1,
  .page-hero.compact h1,
  .live-hero h1,
  .overview-hero h1,
  .contribution-hero h1 {
    font-size: 32px;
  }

  .source-portal h2 {
    font-size: 24px;
  }

  .ia-shortcuts,
  .metric-row {
    grid-template-columns: 1fr;
  }

  .reader-columns,
  .reader-pagination {
    grid-template-columns: 1fr;
  }

  .chapter-card,
  .route-row {
    grid-template-columns: 40px minmax(0, 1fr);
  }
}

@media print {
  body {
    background: white !important;
    color: black;
  }

  .site-sidebar,
  .mobile-bar,
  .verification-strip,
  footer {
    display: none !important;
  }

  .site-stage {
    margin-left: 0;
  }

  .site-stage main {
    max-width: none;
  }
}