/* ══════════════════════════════════════════════════════════════════════════
   COLLEGE PROFILE — CLARITY PASS
   Loaded only by src/pages/colleges/[slug].astro.

   WHAT THIS SHEET IS FOR
   The profile inherited a social-app treatment: a 132px avatar, a handle line,
   one 13px inline stat run, three feed posts with reaction buttons, and every
   decisive fact either at 13px or inside a collapsed disclosure. As a record
   meant to beat Edusanjal on usefulness it failed the only test that matters —
   a reader could not find, at a readable size, who awards the degree, how many
   seats are published, whether a person had checked the page, or when any of it
   was read.

   This sheet does three things and nothing else:
     1. styles the profile-only components added beside the existing ones
        (.cpx, .cpxnav, .cfacts, .pledger, .cpxfoot);
     2. gives the page one type scale, one spacing rhythm and one measure;
     3. repairs the contrast and hierarchy defects that only show on this page.

   ⚠️ SCOPED TO `body.page-college`, AND THAT IS DELIBERATE, NOT DECORATION.
   The layout loads `edulibrary-refined.css` AFTER the page's own `styles`
   slot, so an unqualified `.post` rule here loses to `.edu .post` there. Every
   override below carries the body class so it wins on specificity rather than
   on order, and so that nothing in this file can reach another template.

   ⚠️ NOTHING HERE HIDES CONTENT. A `display:none` on a fact is a fact removed
   from the reader and left in the HTML for a crawler, which is the one thing a
   record like this must never do.
   ══════════════════════════════════════════════════════════════════════════ */

body.page-college {
  /* One scale for the page. Steps are ~1.2, which is close enough to read as a
     system and far enough apart that h2 and body are never mistaken. */
  --cpx-step-1: 13px;
  --cpx-step0: 16px;
  --cpx-step1: 17px;
  --cpx-step2: clamp(19px, 1.4vw, 22px);
  --cpx-step3: clamp(23px, 2vw, 28px);
  --cpx-step4: clamp(28px, 3.4vw, 42px);

  /* Text measure. 66ch on a 15.5–17px face is 60–72 characters, which is the
     band the type sits comfortably in; the feed column is wider than that and
     prose must not use all of it. */
  --cpx-measure: 66ch;

  --cpx-line: 1px solid var(--ice-color-border);
  --cpx-radius: 14px;
  --cpx-radius-sm: 10px;
  --cpx-pad: clamp(18px, 2.2vw, 28px);
  --cpx-ease: cubic-bezier(.2, .7, .2, 1);

  /* The page's own quiet surface, one step off the card, for fact panels that
     should read as inset rather than as another card. Nested cards are the
     failure this avoids. */
  --cpx-inset: color-mix(in srgb, var(--ice-color-text) 4%, transparent);
  --cpx-inset-line: color-mix(in srgb, var(--ice-color-text) 10%, transparent);
}

/* ⚠️ THE TWO DARK BLOCKS THAT WERE HERE HAVE BEEN DELETED, AS THIS FILE ASKED.
   They were a page-scoped stand-in for a dark contract the shell did not have:
   `edulibrary-refined.css` declared `--edu-paper`, `--edu-surface`, `--edu-ink`,
   `--edu-muted` and `--edu-line` as light hex literals with no
   `[data-theme="dark"]` block, so the shell painted warm paper while this page's
   own tokens painted graphite. The file said they were "safe to remove the
   moment the shell ships a dark contract of its own".

   That contract shipped on 2026-09-08, in `edulibrary-refined.css`, at
   `html[data-theme="dark"] .edu`. It maps to the SAME `--ice-color-*` roles this
   block did, so the five surface tokens are unchanged in value and only their
   home has moved.

   ⚠️ One value did change, deliberately. The second block remapped
   `--edu-accent` to `--ice-color-text-action` (crimson) on `.col--profile` only,
   because rust #A94B2D measures 2.3:1 on a dark card and the same variable also
   fills the header button, which that session did not own. The shell now solves
   that where it belongs: the token takes `--ice-color-text-accent` (terracotta,
   the dark counterpart of the light rust) and the header button states its own
   fill and ink. So a link in this column is terracotta rather than crimson in
   dark, which is the same hue it is in light and the same hue every other link
   on the host now has. Both values are audited text-on-dark roles in the
   contract `site-20260716b.css` publishes. */

/* ── browser surfaces ──────────────────────────────────────────────────────
   The parts nobody draws still carry the design. */
body.page-college ::selection {
  background: color-mix(in srgb, var(--ice-color-accent) 34%, transparent);
  color: var(--ice-color-text);
}
body.page-college :focus-visible {
  outline: 2px solid var(--edu-accent);
  outline-offset: 3px;
  border-radius: 4px;
}
body.page-college a {
  text-underline-offset: 3px;
  text-decoration-thickness: from-font;
}

/* ═══════════════════════════ 1 · THE MASTHEAD ═══════════════════════════ */

body.page-college .cpx { margin: 0 0 var(--ice-space-5); }

body.page-college .cpx__card {
  overflow: hidden;
  border: var(--cpx-line);
  border-radius: var(--cpx-radius);
  background: var(--ice-color-surface);
  box-shadow: 0 8px 26px rgb(28 42 56 / 6%);
}

/* The cover is evidence, not a hero. It was 260px of a phone screen before any
   fact appeared; 34vw capped at 220 leaves the name and the record's state
   above the fold on a 390px viewport. */
body.page-college .cpx__cover {
  position: relative;
  height: clamp(140px, 24vw, 340px);
  background: var(--ice-color-surface-field);
}
body.page-college .cpx__cover picture { display: block; height: 100%; }
body.page-college .cpx__coverimg {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* Every cover carries decision information. Real campus media remains evidence;
   the missing-photo state is a deterministic record map, not a repeated stock
   scene or an invented campus. */
body.page-college .cpx__coverbanner {
  position: absolute;
  z-index: 2;
  right: clamp(14px, 2vw, 24px);
  bottom: clamp(14px, 2vw, 24px);
  left: clamp(14px, 2vw, 24px);
  display: grid;
  grid-template-columns: minmax(150px, .7fr) minmax(0, 1.8fr);
  gap: 12px clamp(16px, 3vw, 34px);
  align-items: center;
  padding: 14px 16px;
  border: 1px solid rgb(255 255 255 / 44%);
  border-radius: 10px;
  background: rgb(8 39 72 / 88%);
  color: #fff;
  box-shadow: 0 14px 30px rgb(7 30 54 / 24%);
  backdrop-filter: blur(8px);
}
body.page-college .cpx__coverbanner p { display: grid; gap: 2px; margin: 0; }
body.page-college .cpx__coverbanner strong { font-size: 14px; letter-spacing: .01em; }
body.page-college .cpx__coverbanner p span { color: #bfe6fa; font-size: 13px; line-height: 1.35; }
body.page-college .cpx__coverbanner ul {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 7px;
  margin: 0;
  padding: 0;
  list-style: none;
}
body.page-college .cpx__coverbanner li {
  max-width: 28ch;
  padding: 6px 9px;
  border: 1px solid rgb(255 255 255 / 34%);
  border-radius: 999px;
  background: rgb(255 255 255 / 9%);
  font-size: 13px;
  font-weight: 650;
  line-height: 1.25;
  text-wrap: balance;
}

/* ── unique record cover ──────────────────────────────────────────────────
   The slug changes the contour, route, nodes and one of six brand-bound paper
   palettes. Facts remain HTML over that field: the SVG is decoration and never
   has to carry the accessible meaning of the cover. */
body.page-college .record-cover {
  --rc-paper: #dff3fb;
  --rc-ink: #082f55;
  --rc-route: #e66042;
  --rc-wash: #aedbe9;
  position: relative;
  isolation: isolate;
  width: 100%;
  height: 100%;
  min-height: 210px;
  overflow: hidden;
  color: var(--rc-ink);
  background: var(--rc-paper);
}
body.page-college .record-cover[data-cover-variant="1"] { --rc-paper:#e9f4ef; --rc-ink:#123b40; --rc-route:#d95f43; --rc-wash:#bbddd2; }
body.page-college .record-cover[data-cover-variant="2"] { --rc-paper:#f4f0df; --rc-ink:#173b54; --rc-route:#d8583f; --rc-wash:#dcd1a9; }
body.page-college .record-cover[data-cover-variant="3"] { --rc-paper:#e8f0fb; --rc-ink:#102f58; --rc-route:#c94f3a; --rc-wash:#becfea; }
body.page-college .record-cover[data-cover-variant="4"] { --rc-paper:#f7e9e3; --rc-ink:#183953; --rc-route:#b94c38; --rc-wash:#e5c6bb; }
body.page-college .record-cover[data-cover-variant="5"] { --rc-paper:#e5f2f4; --rc-ink:#113a50; --rc-route:#df6a43; --rc-wash:#b8d9dd; }
body.page-college .record-cover__field { position:absolute; inset:0; z-index:-1; width:100%; height:100%; }
body.page-college .record-cover__paper { fill:var(--rc-paper); }
body.page-college .record-cover__contour { fill:none; stroke:var(--rc-wash); stroke-width:34; stroke-linecap:round; opacity:.72; }
body.page-college .record-cover__contour--soft { stroke-width:17; opacity:.45; }
body.page-college .record-cover__route { fill:none; stroke:var(--rc-route); stroke-width:3; stroke-linecap:round; stroke-linejoin:round; }
body.page-college .record-cover__node { fill:var(--rc-paper); stroke:var(--rc-ink); stroke-width:2; }
body.page-college .record-cover__identity {
  position:absolute;
  z-index:2;
  top:clamp(14px, 2vw, 22px);
  left:clamp(14px, 2vw, 24px);
  display:grid;
  grid-template-columns:auto minmax(0, 1fr) auto;
  gap:11px;
  align-items:center;
  width:36%;
  min-width:230px;
}
body.page-college .record-cover__identity p { display:grid; gap:3px; min-width:0; margin:0; line-height:1.2; }
body.page-college .record-cover__identity strong { display:-webkit-box; overflow:hidden; font-size:clamp(13px, 1.3vw, 18px); text-wrap:balance; -webkit-box-orient:vertical; -webkit-line-clamp:2; }
body.page-college .record-cover__identity p span { overflow:hidden; color:color-mix(in srgb, var(--rc-ink) 74%, transparent); font-size:13px; line-height:1.3; text-overflow:ellipsis; white-space:nowrap; }
body.page-college .record-cover__mark {
  display:grid;
  place-items:center;
  width:clamp(48px, 5vw, 68px);
  aspect-ratio:1;
  padding:6px;
  border:1px solid color-mix(in srgb, var(--rc-ink) 22%, transparent);
  border-radius:10px;
  background:#fff;
  color:#0c315b;
  font-size:12px;
  font-weight:800;
  letter-spacing:.04em;
}
body.page-college .record-cover__mark img { display:block; width:100%; height:100%; object-fit:contain; }
body.page-college .record-cover__ref { font-size:13px; font-weight:750; letter-spacing:.08em; font-variant-numeric:tabular-nums; }
body.page-college .record-cover__programmes {
  position:absolute;
  z-index:2;
  top:26%;
  left:35%;
  width:25%;
}
body.page-college .record-cover__programmes p {
  margin:0 0 7px;
  color:color-mix(in srgb, var(--rc-ink) 68%, transparent);
  font-size:13px;
  font-weight:760;
  letter-spacing:.09em;
  text-transform:uppercase;
}
body.page-college .record-cover__programmes ul { display:flex; flex-wrap:wrap; gap:6px; margin:0; padding:0; list-style:none; }
body.page-college .record-cover__programmes li {
  max-width:24ch;
  padding:6px 9px;
  border:1px solid color-mix(in srgb, var(--rc-ink) 18%, transparent);
  border-radius:7px;
  background:color-mix(in srgb, #fff 82%, var(--rc-paper));
  box-shadow:0 7px 16px rgb(8 47 85 / 8%);
  font-size:13px;
  font-weight:760;
  line-height:1.15;
  text-wrap:balance;
}
body.page-college .record-cover__banner {
  position:absolute;
  right:clamp(12px, 2vw, 22px);
  bottom:clamp(12px, 2vw, 20px);
  left:clamp(12px, 2vw, 22px);
  display:grid;
  z-index:3;
  grid-template-columns:minmax(160px, 1fr) auto;
  gap:12px 20px;
  align-items:center;
  padding:10px 12px;
  border:1px solid color-mix(in srgb, var(--rc-ink) 20%, transparent);
  border-radius:9px;
  background:color-mix(in srgb, #fff 90%, var(--rc-paper));
  box-shadow:0 9px 24px rgb(8 47 85 / 10%);
}
body.page-college .record-cover__banner p { display:grid; gap:1px; margin:0; }
body.page-college .record-cover__banner strong { font-size:13px; }
body.page-college .record-cover__banner p span { color:color-mix(in srgb, var(--rc-ink) 70%, transparent); font-size:13px; }
body.page-college .record-cover__banner > span { color:color-mix(in srgb, var(--rc-ink) 72%, transparent); font-size:13px; font-weight:650; text-align:right; }

/* No photograph is a fact about the record, so it is written rather than
   drawn as a grey box. */
body.page-college .cpx__cover--none {
  display: grid;
  place-items: center;
  height: auto;
  min-height: 0;
  padding: var(--ice-space-4) var(--cpx-pad);
  border-bottom: var(--cpx-line);
  background: var(--cpx-inset);
}
body.page-college .cpx__coverwait {
  margin: 0;
  font-size: var(--cpx-step-1);
  line-height: 1.5;
  color: var(--ice-color-text-muted);
  text-align: center;
}

/* ── market-coverage candidate page ───────────────────────────────────────
   This is intentionally a simpler page family. It shares the visual world but
   cannot inherit the fact density of a source-bearing college record. */
body.page-college .candidate-college__hero {
  overflow: hidden;
  border:0;
  border-top:2px solid #7fc9ee;
  border-radius:0;
  background:transparent;
  box-shadow:none;
}
body.page-college .candidate-college__cover {
  position: relative;
  height: clamp(230px, 32vw, 430px);
  margin: 0;
  overflow: hidden;
  background: var(--ice-color-surface-field);
}
body.page-college .candidate-college__body { display:grid; gap:var(--ice-space-5); padding:var(--cpx-pad) 0 0; }
body.page-college .candidate-college__identity { display: flex; gap: 16px; align-items: flex-start; }
body.page-college .candidate-college__identity > span {
  display: grid;
  flex: 0 0 auto;
  place-items: center;
  width: 62px;
  aspect-ratio: 1;
  border-radius: 10px;
  background: #0c315b;
  color: #fff;
  font-size: 15px;
  font-weight: 780;
  letter-spacing: .03em;
}
body.page-college .candidate-college__identity h1 { margin: 0; max-width: 25ch; color: var(--ice-color-text); font-size: var(--cpx-step4); line-height: 1.07; letter-spacing: -.03em; text-wrap: balance; }
body.page-college .candidate-college__identity p { margin: 7px 0 0; color: var(--ice-color-text-muted); font-size: var(--cpx-step0); }
body.page-college .candidate-college__state {
  padding:16px 0;
  border:0;
  border-top:2px solid var(--ice-color-text-accent);
  border-radius:0;
  background:transparent;
}
body.page-college .candidate-college__state strong { color: var(--ice-color-text-accent); font-size: var(--cpx-step0); }
body.page-college .candidate-college__state p { max-width: 76ch; margin: 6px 0 0; color: var(--ice-color-text); line-height: 1.65; }
body.page-college .candidate-college__main { display: grid; gap: clamp(38px, 6vw, 72px); padding: clamp(34px, 5vw, 62px) 0; }
body.page-college .candidate-college__heading { max-width: 780px; }
body.page-college .candidate-college__heading h2,
body.page-college .candidate-college__next h2 { margin: 0; color: var(--ice-color-text); font-size: var(--cpx-step3); line-height: 1.16; letter-spacing: -.02em; text-wrap: balance; }
body.page-college .candidate-college__heading > p:last-child { max-width: 68ch; margin: 10px 0 0; color: var(--ice-color-text-muted); line-height: 1.65; }
body.page-college .candidate-programmes { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:0 28px; margin:22px 0 0; padding:0; list-style:none; }
body.page-college .candidate-programmes li { display:flex; justify-content:space-between; gap:16px; padding:16px 0; border:0; border-top:var(--cpx-line); border-radius:0; background:transparent; }
body.page-college .candidate-programmes li div { display: grid; gap: 4px; }
body.page-college .candidate-programmes strong { color: var(--ice-color-text); font-size: var(--cpx-step1); font-weight: 680; }
body.page-college .candidate-programmes a { display:inline-flex; align-items:center; min-height:44px; color:var(--ice-color-link); font-size:13px; font-weight:700; letter-spacing:0; text-transform:none; }
body.page-college .candidate-programmes span { color:var(--ice-color-text-muted); font-size:13px; line-height:1.4; }
body.page-college .candidate-programmes__state { flex:0 0 auto; align-self:start; color:var(--ice-color-text-accent); font-size:13px; font-weight:650; }
body.page-college .candidate-college__empty { margin-top: 22px; padding: 24px; border: var(--cpx-line); background: var(--cpx-inset); }
body.page-college .candidate-college__empty h3 { margin: 0; color: var(--ice-color-text); }
body.page-college .candidate-college__empty p { max-width: 62ch; margin: 7px 0 0; color: var(--ice-color-text-muted); }
body.page-college .candidate-college__next { display:grid; grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr); gap:clamp(24px,6vw,80px); padding:clamp(26px,4vw,42px); border-radius:0; border-top:2px solid #7fc9ee; background:#0c315b; color:#d9ebf8; }
body.page-college .candidate-college__next h2 { color: #fff; }
body.page-college .candidate-college__next ol { display: grid; gap: 13px; margin: 0; padding-left: 22px; line-height: 1.6; }
body.page-college .candidate-college__stamp { margin:0; padding-top:16px; border-top:var(--cpx-line); color:var(--ice-color-text-muted); font-size:13px; }

@media (max-width: 760px) {
  body.page-college .candidate-college__cover { height: 275px; }
  body.page-college .candidate-programmes { grid-template-columns: minmax(0, 1fr); }
  body.page-college .candidate-programmes li { display: grid; }
  body.page-college .candidate-college__next { grid-template-columns: minmax(0, 1fr); }
}

body.page-college .cpx__body {
  display: grid;
  gap: var(--ice-space-5);
  padding: var(--cpx-pad);
}

/* ── identity ── */
body.page-college .cpx__id {
  display: flex;
  align-items: flex-start;
  gap: clamp(12px, 1.6vw, 18px);
}

/* 64px, not 132px. The mark identifies; it does not lead. */
body.page-college .cpx__mark {
  flex: 0 0 auto;
  display: grid;
  place-items: center;
  width: clamp(52px, 6vw, 64px);
  aspect-ratio: 1;
  border-radius: var(--cpx-radius-sm);
  background: var(--ice-color-surface-brand, #13234B);
  color: #FAF7F2;
  font-weight: 680;
  font-size: clamp(15px, 1.6vw, 18px);
  letter-spacing: -.02em;
}
/* ⚠️ A LIGHT PLATE IN BOTH THEMES. These are other institutions' marks, mostly
   dark type on transparency; a navy seal on a navy tile loses everything but
   its red quarters, which has already happened on this project once. */
body.page-college .cpx__mark--logo {
  padding: 6px;
  background: #FFFFFF;
  border: var(--cpx-line);
}
body.page-college .cpx__mark--logo picture,
body.page-college .cpx__mark--logo img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}

body.page-college .cpx__names { min-width: 0; }

body.page-college .cpx__name {
  margin: 0;
  font-size: var(--cpx-step4);
  font-weight: 660;
  line-height: 1.08;
  letter-spacing: -.028em;
  text-wrap: balance;
  color: var(--ice-color-text);
}

/* One sentence that says what this institution IS. It replaces the `@handle`
   line, which styled the college's own domain as a social handle and left the
   affiliation to a pill on top of a photograph. */
body.page-college .cpx__what {
  margin: 6px 0 0;
  max-width: var(--cpx-measure);
  font-size: var(--cpx-step1);
  line-height: 1.45;
  color: var(--ice-color-text-muted);
}
body.page-college .cpx__whatmain {
  color: var(--ice-color-text);
  font-weight: 600;
  text-transform: capitalize;
}
body.page-college .cpx__aka {
  margin: 4px 0 0;
  font-size: var(--cpx-step-1);
  line-height: 1.5;
  color: var(--ice-color-text-muted);
}

/* ── the state of the record ──
   Two states, both labelled. The limited one is warmer and heavier because it
   qualifies everything under it; the read one is quiet because it is the
   expected case, not a badge. */
body.page-college .cpx__state {
  padding: var(--ice-space-4);
  border: 1px solid var(--cpx-inset-line);
  border-radius: var(--cpx-radius-sm);
  background: var(--cpx-inset);
}
body.page-college .cpx__state--limited {
  border-color: color-mix(in srgb, var(--ice-color-text-accent) 40%, transparent);
  background: color-mix(in srgb, var(--ice-color-text-accent) 9%, transparent);
}
body.page-college .cpx__statehead {
  margin: 0;
  font-size: var(--cpx-step0);
  font-weight: 660;
  letter-spacing: -.005em;
  color: var(--ice-color-text);
}
body.page-college .cpx__state--limited .cpx__statehead { color: var(--ice-color-text-accent); }
/* ⚠️ FULL INK AND ONE STEP LARGER ON A LIMITED RECORD. Muted over the warm
   tint measures 4.44:1 — under the floor — and this notice qualifies every
   value on the page beneath it. On a page nobody has checked it is the most
   important paragraph there is, so it is not the one to set in the faintest
   grey the palette has. */
body.page-college .cpx__state--limited .cpx__statebody,
body.page-college .cpx__state--limited .cpx__prov {
  font-size: var(--cpx-step0);
  color: var(--ice-color-text);
}
body.page-college .cpx__statebody {
  margin: 5px 0 0;
  max-width: var(--cpx-measure);
  font-size: var(--cpx-step-1);
  line-height: 1.6;
  color: var(--ice-color-text-muted);
}
body.page-college .cpx__prov {
  margin: 9px 0 0;
  font-size: var(--cpx-step-1);
  font-weight: 600;
  font-variant-numeric: tabular-nums;
  color: var(--ice-color-text-muted);
}
body.page-college .cpx__prov a { color: var(--edu-accent); }

/* ── the figures ──
   Three at most, each one a count of something the record holds, each with the
   qualifier that keeps it true. Tabular numerals so a reader comparing two
   colleges in two tabs is comparing aligned digits. */
body.page-college .cpx__figures {
  display: flex;
  flex-wrap: wrap;
  gap: var(--ice-space-3) clamp(20px, 3vw, 40px);
  margin: 0;
  padding: var(--ice-space-4) 0 0;
  border-top: var(--cpx-line);
}
body.page-college .cpx__figure { min-width: 0; }
body.page-college .cpx__fign {
  margin: 0;
  font-size: var(--cpx-step3);
  font-weight: 650;
  line-height: 1.05;
  letter-spacing: -.02em;
  font-variant-numeric: tabular-nums lining-nums;
  color: var(--ice-color-text);
}
body.page-college .cpx__figl {
  margin: 3px 0 0;
  font-size: var(--cpx-step-1);
  line-height: 1.4;
  color: var(--ice-color-text-muted);
}

/* ── the actions ──
   Two lines each: what it does, and where it goes. A student following a
   college page wants the college's own site, and hiding the hostname behind
   the word "Visit" costs them a click to find out where they are being sent. */
body.page-college .cpx__acts {
  display: flex;
  flex-wrap: wrap;
  gap: var(--ice-space-2);
}
body.page-college .cpx__btn {
  display: grid;
  gap: 2px;
  flex: 1 1 190px;
  min-height: 52px;
  padding: 9px 16px;
  align-content: center;
  border: var(--cpx-line);
  border-radius: var(--cpx-radius-sm);
  background: var(--ice-color-surface);
  color: var(--ice-color-text);
  font-size: var(--cpx-step0);
  font-weight: 640;
  text-decoration: none;
  transition: transform 180ms var(--cpx-ease), border-color 180ms var(--cpx-ease), background 180ms var(--cpx-ease);
}
body.page-college .cpx__btnsub {
  font-size: 12.5px;
  font-weight: 500;
  line-height: 1.35;
  color: var(--ice-color-text-muted);
  overflow-wrap: anywhere;
}
body.page-college .cpx__btn:hover {
  transform: translateY(-2px);
  border-color: var(--ice-color-text);
  background: var(--cpx-inset);
}
/* ⚠️ THE ONE FILLED BUTTON ON THE PAGE, AND ITS LABEL IS WRITTEN OUT.
   `.pf__btn--go` shipped a crimson gradient with `color` inherited from
   `edulibrary-refined.css`'s `.edu a { color: var(--edu-accent) }` — rust
   #A94B2D on #C41E3A, about 1.3:1, which is a primary action whose label
   cannot be read at all. Whatever fills this button states its own ink. */
body.page-college .cpx__btn--go {
  border-color: transparent;
  background: var(--edu-accent);
  color: var(--ice-color-on-action, #FAF7F2);
}
/* ⚠️ FULL STRENGTH, NOT 82%. The hostname under "Official site" is 12.5px, and
   `on-action` at 82% over the crimson fill measures 3.25:1 — under the 4.5:1
   that text this size needs. There is no dimmer shade of white available on a
   crimson button; the sub-label separates by size and weight instead. */
body.page-college .cpx__btn--go .cpx__btnsub {
  color: var(--ice-color-on-action, #FAF7F2);
}
body.page-college .cpx__btn--go:hover {
  background: #094b78;
  border-color: transparent;
  color: var(--ice-color-on-action-hover, #FAF7F2);
}

/* ── the register lines ── */
body.page-college .cpx__reg {
  display: grid;
  gap: var(--ice-space-2);
  margin: 0;
  padding: var(--ice-space-4) 0 0;
  border-top: var(--cpx-line);
}
body.page-college .cpx__reg > div {
  display: grid;
  grid-template-columns: minmax(0, 34ch) minmax(0, 1fr);
  gap: 2px var(--ice-space-4);
  align-items: baseline;
}
body.page-college .cpx__reg dt {
  font-size: var(--cpx-step-1);
  line-height: 1.45;
  color: var(--ice-color-text-muted);
}
body.page-college .cpx__reg dd {
  margin: 0;
  font-size: var(--cpx-step0);
  font-weight: 600;
  font-variant-numeric: tabular-nums;
  color: var(--ice-color-text);
}

/* ═════════════════════════ 2 · THE SECTION NAV ═════════════════════════ */

body.page-college .cpxnav {
  margin: 0 0 var(--ice-space-5);
  padding: 7px 0;
}

/* ⚠️ STICKY ONLY WHERE THE HEADER'S HEIGHT IS KNOWN. `.edu-top` is
   `position: sticky; top: 0` at 84px on a desktop and wraps to two rows below
   640px, so a chip row pinned at a hard offset would sit under the search bar
   on exactly the device class this record is read on. Above 1080px the shell is
   the three-column layout and 84px is stable; below it the row is an ordinary
   table of contents at the top of the document, which is what it is anyway. */
@media (min-width: 1080px) {
  body.page-college .cpxnav {
    position: sticky;
    top: 84px;
    z-index: 5;
    background: color-mix(in srgb, var(--ice-color-canvas) 88%, transparent);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
  }
}

/* A fragment link that lands a heading underneath the sticky header is a
   fragment link that does not work. 84px of header plus a line of air. */
body.page-college .post[id],
body.page-college .col-block[id],
body.page-college .prov[id] { scroll-margin-top: 96px; }

/* ⚠️ 96px IS RIGHT UNTIL `.cpxnav` STARTS STICKING, AND THEN IT IS 41px SHORT.
   The comment above counts the 84px header and nothing else. At >=1080px the
   section nav is `position:sticky; top:84px` (see §2) and MEASURED 53px tall at
   1440x900, so the two together occupy 84-137px — while a fragment still lands
   its target's top at 96px. Every chip in that nav therefore scrolls its own
   heading about 41px behind the nav that sent it there, which is the one thing
   the component exists to do. 140px is 137 plus a line of air, matching the
   intent the rule above already states. Below 1080px `.cpxnav` is `static`
   (measured), so 96px stays correct there and this block does not apply. */
@media (min-width: 1080px) {
  body.page-college .post[id],
  body.page-college .col-block[id],
  body.page-college .prov[id] { scroll-margin-top: 140px; }
}
body.page-college .cpxnav ul {
  display: flex;
  gap: 6px;
  margin: 0;
  padding: 0 0 2px;
  list-style: none;
  overflow-x: auto;
  scrollbar-width: none;
  overscroll-behavior-x: contain;
}
body.page-college .cpxnav ul::-webkit-scrollbar { display: none; }
/* ⚠️ 44px, MEASURED AT 37px. `padding: 7px 13px` around a 13px line box gives
   about 37px at 390px, on the row of chips that is this page's whole section
   index — while `.cpx__review-details summary` two hundred lines below already
   carries `min-height:44px`. D-13 asks for 44x44 where practical; a horizontal
   chip row on a phone is exactly where it is practical. Centring keeps the
   label optically where it was, so nothing else in the row moves. */
body.page-college .cpxnav a {
  display: flex;
  align-items: center;
  min-height: 44px;
  white-space: nowrap;
  padding: 7px 13px;
  border: var(--cpx-line);
  border-radius: 999px;
  background: var(--ice-color-surface);
  color: var(--ice-color-text-muted);
  font-size: var(--cpx-step-1);
  font-weight: 600;
  text-decoration: none;
  transition: color 160ms var(--cpx-ease), border-color 160ms var(--cpx-ease);
}
body.page-college .cpxnav a:hover {
  color: var(--ice-color-text);
  border-color: var(--ice-color-text);
}
/* `:target` marks the section a reader has arrived at, which is the only state
   available without a scroll-spy — and a scroll-spy would need a script that
   production CSP refuses. */
body.page-college .col-block:target > h2,
body.page-college .post:target .post__title { text-decoration: underline; text-decoration-thickness: 2px; }

@media (prefers-reduced-transparency: reduce) {
  body.page-college .cpxnav {
    background: var(--ice-color-canvas);
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
  }
}

/* ══════════════════════════ 3 · THE FACT LIST ══════════════════════════ */

body.page-college .cfacts {
  display: grid;
  gap: 0;
  margin: 0;
}
body.page-college .cfacts__row {
  display: grid;
  grid-template-columns: minmax(11ch, 17ch) minmax(0, 1fr);
  gap: 4px var(--ice-space-4);
  padding: 11px 0;
  border-bottom: 1px solid var(--cpx-inset-line);
}
body.page-college .cfacts__row:last-child { border-bottom: 0; padding-bottom: 0; }
body.page-college .cfacts__row:first-child { padding-top: 0; }

body.page-college .cfacts__k {
  font-size: var(--cpx-step-1);
  line-height: 1.45;
  color: var(--ice-color-text-muted);
}
body.page-college .cfacts__v {
  margin: 0;
  font-size: var(--cpx-step1);
  line-height: 1.45;
  font-weight: 560;
  color: var(--ice-color-text);
  overflow-wrap: anywhere;
}
body.page-college .cfacts__v--num { font-variant-numeric: tabular-nums lining-nums; }
body.page-college .cfacts__v a { color: var(--edu-accent); font-weight: 600; }

@media (max-width: 520px) {
  body.page-college .cfacts__row { grid-template-columns: minmax(0, 1fr); gap: 2px; }
}

/* ═════════════════════════ 4 · THE PROGRAMMES ═════════════════════════ */

body.page-college .pledger {
  display: grid;
  gap: var(--ice-space-2);
  margin: 0;
  padding: 0;
  list-style: none;
}
body.page-college .pledger__row {
  padding: 13px 15px;
  border: 1px solid var(--cpx-inset-line);
  border-radius: var(--cpx-radius-sm);
  background: var(--cpx-inset);
}
body.page-college .pledger__head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: var(--ice-space-3);
}
body.page-college .pledger__name {
  margin: 0;
  font-size: var(--cpx-step1);
  font-weight: 640;
  line-height: 1.25;
  letter-spacing: -.012em;
  color: var(--ice-color-text);
}
body.page-college .pledger__name a {
  display: inline-block;
  margin-inline-start: .55rem;
  color: var(--ice-color-link);
  font-size: var(--cpx-step-1);
  font-weight: 700;
  letter-spacing: .025em;
  text-transform: uppercase;
  text-decoration-color: color-mix(in srgb, currentColor 28%, transparent);
  text-underline-offset: .16em;
}
body.page-college .pledger__name a:hover {
  color: var(--ice-color-link);
  text-decoration-color: currentColor;
}
body.page-college .pledger__seats {
  margin: 0;
  flex: 0 0 auto;
  font-size: var(--cpx-step0);
  font-weight: 650;
  font-variant-numeric: tabular-nums lining-nums;
  color: var(--ice-color-text);
}
body.page-college .pledger__seats--none {
  font-weight: 500;
  font-size: var(--cpx-step-1);
  color: var(--ice-color-text-muted);
}
/* The registered name, kept because it is what the transcript will say. */
body.page-college .pledger__reg {
  margin: 4px 0 0;
  max-width: var(--cpx-measure);
  font-size: var(--cpx-step-1);
  line-height: 1.45;
  color: var(--ice-color-text-muted);
}
body.page-college .pledger__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 3px 14px;
  margin: 6px 0 0;
  font-size: var(--cpx-step-1);
  line-height: 1.45;
  color: var(--ice-color-text-muted);
  font-variant-numeric: tabular-nums;
}
body.page-college .pledger__dur { font-weight: 600; color: var(--ice-color-text); }
body.page-college .pledger__dur--none { font-weight: 500; color: var(--ice-color-text-muted); }
body.page-college .pledger__level,
body.page-college .pledger__evidence {
  padding: 3px 7px;
  border: 1px solid var(--cpx-inset-line);
  border-radius: 999px;
  background: var(--ice-color-surface);
  color: var(--ice-color-text-muted);
  font-size: 13px;
  font-weight: 650;
}
body.page-college .pledger__ref {
  display: inline-block;
  margin-left: 7px;
  color: var(--ice-color-text-muted);
  font-size: 13px;
  font-weight: 600;
  letter-spacing: .04em;
  text-transform: uppercase;
}
body.page-college .pledger__evidence::before {
  content: '';
  display: inline-block;
  width: 6px;
  height: 6px;
  margin: 0 6px 1px 0;
  border-radius: 50%;
  background: #3c8a73;
}
body.page-college .pledger__evidence--lead::before { background: #d1795f; }
body.page-college .pledger__note {
  margin: var(--ice-space-3) 0 0;
  font-size: var(--cpx-step-1);
  line-height: 1.5;
  color: var(--ice-color-text-muted);
}

@media (min-width: 760px) {
  body.page-college .pledger { grid-template-columns: 1fr 1fr; }
}

/* ═══════════════════════ 5 · THE SECTION FOOTER ═══════════════════════ */

body.page-college .cpxfoot {
  display: flex;
  align-items: center;
  gap: var(--ice-space-3);
  flex-wrap: wrap;
  margin: var(--ice-space-5) 0 0;
  padding: var(--ice-space-3) 0 0;
  border-top: var(--cpx-line);
}
body.page-college .cpxfoot__prov {
  margin: 0;
  flex: 1 1 auto;
  font-size: var(--cpx-step-1);
  color: var(--ice-color-text-muted);
  font-variant-numeric: tabular-nums;
}
body.page-college .cpxfoot__prov a { color: var(--edu-accent); font-weight: 600; }

/* ⚠️ THREE BUTTONS, NOT ONE. This selector was `.cpxfoot__share` while the row
   carried Share alone; Love and Comment were restored to it on 2026-09-08
   (`ProfileSectionFoot.astro`'s header says why) and the class is now the one
   they share. `.cpxfoot__prov`'s `flex: 1 1 auto` still holds the group against
   the trailing edge, and `.cpxfoot`'s `flex-wrap` drops it to a second line on a
   phone rather than squeezing three 38px targets into one. */
/* ⚠️ 44px, NOT 38px. The comment above already anticipates "three 38px targets"
   wrapping to a second line on a phone, which concedes the number rather than
   fixing it; measured 38px at 390px. These are the section's Love / Comment /
   Share controls and they are the smallest interactive targets on the page.
   `flex-wrap` on `.cpxfoot` still drops the group to its own line, so the extra
   6px costs no horizontal room. */
body.page-college .cpxfoot__act {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  min-height: 44px;
  padding: 0 13px;
  border: var(--cpx-line);
  border-radius: 999px;
  background: transparent;
  color: var(--ice-color-text-muted);
  font: inherit;
  font-size: var(--cpx-step-1);
  font-weight: 600;
  cursor: pointer;
}
body.page-college .cpxfoot__act svg {
  width: 15px;
  height: 15px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.6;
  stroke-linecap: round;
  stroke-linejoin: round;
}
body.page-college .cpxfoot__act:hover { color: var(--ice-color-text); border-color: var(--ice-color-text); }
body.page-college .cpxfoot__note {
  margin: 0;
  flex: 0 0 auto;
  font-size: var(--cpx-step-1);
  color: var(--ice-color-text-accent);
}
body.page-college .cpxfoot__note:empty { display: none; }

/* ══════════════════ 6 · REPAIRS TO THE EXISTING BLOCKS ══════════════════
   Everything below re-typesets markup this session does not own. No structure
   changes, no content removed. */

/* The feed post. It was three nested surfaces deep — card inside card inside
   card — with a 15px title competing with a 15px avatar monogram. One border,
   one background, and a title that reads as a section heading. */
body.page-college .post {
  margin: 0 0 var(--ice-space-5);
  border: var(--cpx-line);
  border-radius: var(--cpx-radius);
  background: var(--ice-color-surface);
  box-shadow: 0 8px 26px rgb(28 42 56 / 6%);
}
body.page-college .post .post__head {
  align-items: center;
  gap: var(--ice-space-3);
  padding: var(--cpx-pad) var(--cpx-pad) 0;
  border-bottom: 0;
}
body.page-college .post .post__avatar {
  width: 34px;
  height: 34px;
  font-size: 12px;
  box-shadow: none;
}
/* ⚠️ The warm tone is terracotta #F0A97A, and `.post__avatar` prints its
   monogram in warm-50 — 1.84:1, the only text on the page a sighted reader
   genuinely cannot read. It is `aria-hidden`, so no automated a11y check and no
   screen reader would ever have reported it. `--ice-color-on-accent` is the
   token that exists for exactly this pairing. */
body.page-college .post .post__avatar--warm span { color: var(--ice-color-on-accent); }
body.page-college .post .post__title {
  margin: 0;
  font-size: var(--cpx-step2);
  font-weight: 640;
  line-height: 1.25;
  letter-spacing: -.016em;
  color: var(--ice-color-text);
  text-wrap: balance;
}
body.page-college .post .post__sub {
  margin: 3px 0 0;
  font-size: var(--cpx-step-1);
  line-height: 1.45;
  color: var(--ice-color-text-muted);
  font-variant-numeric: tabular-nums;
}
body.page-college .post .post__pinned { color: var(--ice-color-text-muted); font-weight: 500; }
body.page-college .post .post__body { padding: var(--ice-space-4) var(--cpx-pad) var(--cpx-pad); }
body.page-college .post .post__body > p { max-width: var(--cpx-measure); }

/* The two standalone blocks — Admission, Location — matched to the posts so
   the page reads as one document rather than as a feed with two appendices. */
body.page-college .col--profile .col-block {
  margin: 0 0 var(--ice-space-5);
  padding: var(--cpx-pad);
  border: var(--cpx-line);
  border-radius: var(--cpx-radius);
  background: var(--ice-color-surface);
  box-shadow: 0 8px 26px rgb(28 42 56 / 6%);
}
body.page-college .col--profile .col-block h2 {
  margin: 0 0 var(--ice-space-3);
  font-size: var(--cpx-step2);
  font-weight: 640;
  line-height: 1.25;
  letter-spacing: -.016em;
  color: var(--ice-color-text);
}
body.page-college .col--profile .col-block p {
  max-width: var(--cpx-measure);
  font-size: var(--cpx-step1);
  line-height: 1.62;
  color: var(--ice-color-text);
}
/* The university's system-wide rule, when the college also has one of its own.
   Muted, but not below the contrast floor: it is still a rule a reader acts on. */
body.page-college .col--profile .col-block p.col-note { color: var(--ice-color-text-muted); }

/* Location and contact. A two-column definition grid instead of an uppercase
   micro-label stacked over its value. */
/* ⚠️ `grid-template-columns` HAS TO BE RESTATED. `ice-colleges.css` sets
   `repeat(auto-fit, minmax(min(200px,100%), 1fr))` on `.col-facts`, so setting
   only `display:grid` here left the shared track list in place: the four
   contact rows laid out as four side-by-side columns and "Lalitpur" broke to
   one character a line. Any rule that re-lays-out inherited markup has to
   replace every property that decides the layout, not just the ones it
   changes. */
body.page-college .col--profile .col-facts {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 0;
  margin: 0;
  padding: 0;
  border: 0;
  /* ⚠️ AND THE RADIUS AND THE SHADOW. `ice-college-profile.css` gives this list
     a 24px radius and a drop shadow to make it a card; clearing the border and
     the background alone left the shadow painting a rounded ghost edge under
     the last row, on every college page. A rule that stops something being a
     card has to clear all four of the properties that made it one. */
  border-radius: 0;
  box-shadow: none;
  background: transparent;
}
body.page-college .col--profile .col-facts__item {
  display: grid;
  grid-template-columns: minmax(11ch, 17ch) minmax(0, 1fr);
  gap: 4px var(--ice-space-4);
  padding: 11px 0;
  border-bottom: 1px solid var(--cpx-inset-line);
}
body.page-college .col--profile .col-facts__item:last-child { border-bottom: 0; padding-bottom: 0; }
body.page-college .col--profile .col-facts__item:first-child { padding-top: 0; }
body.page-college .col--profile .col-facts dt {
  font-size: var(--cpx-step-1);
  font-weight: 500;
  letter-spacing: 0;
  text-transform: none;
  color: var(--ice-color-text-muted);
}
body.page-college .col--profile .col-facts dd {
  margin: 0;
  font-size: var(--cpx-step1);
  line-height: 1.45;
  font-weight: 560;
  color: var(--ice-color-text);
  overflow-wrap: anywhere;
}

@media (max-width: 520px) {
  body.page-college .col--profile .col-facts__item { grid-template-columns: minmax(0, 1fr); gap: 2px; }
}

/* A sourced value and its footnote. The number was 10px and the same ink as
   the value, so it read as a typo inside the figure rather than as a link. */
body.page-college .col-val { font-variant-numeric: tabular-nums; }
body.page-college .col-cite {
  display: inline-block;
  margin-left: 3px;
  padding: 0 3px;
  min-width: 18px;
  border-radius: 4px;
  background: var(--cpx-inset);
  color: var(--ice-color-text-muted);
  font-size: 13px;
  font-weight: 700;
  line-height: 18px;
  text-align: center;
  vertical-align: 2px;
  text-decoration: none;
}
body.page-college .col-cite:hover {
  background: color-mix(in srgb, var(--edu-accent) 16%, transparent);
  color: var(--edu-accent);
}

/* A gap that says why it is a gap. Not an error, so not red; not invisible,
   so not the muted ink the rest of the fine print uses. */
body.page-college .col-empty {
  max-width: var(--cpx-measure);
  margin: var(--ice-space-4) 0 0;
  padding: 13px 15px;
  border: 1px dashed var(--cpx-inset-line);
  border-radius: var(--cpx-radius-sm);
  background: transparent;
  font-size: var(--cpx-step0);
  line-height: 1.6;
  color: var(--ice-color-text-muted);
}

/* The provenance disclosure. It is the record's whole argument and it looked
   like a caption — 13px, no affordance, no hit area. */
body.page-college .prov {
  margin: 0 0 var(--ice-space-5);
  border: var(--cpx-line);
  border-radius: var(--cpx-radius);
  background: var(--ice-color-surface);
  overflow: hidden;
}
body.page-college .prov > summary {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 3px 10px;
  padding: var(--ice-space-4) var(--cpx-pad);
  cursor: pointer;
  font-size: var(--cpx-step1);
  font-weight: 640;
  color: var(--ice-color-text);
  list-style-position: outside;
}
body.page-college .prov > summary:hover { background: var(--cpx-inset); }
body.page-college .prov .prov__count {
  font-size: var(--cpx-step-1);
  font-weight: 500;
  color: var(--ice-color-text-muted);
  font-variant-numeric: tabular-nums;
}
body.page-college .prov .prov__body { padding: 0 var(--cpx-pad) var(--cpx-pad); }
body.page-college .prov .col-block {
  margin: 0 0 var(--ice-space-4);
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}
body.page-college .prov .col-findings {
  display: grid;
  gap: var(--ice-space-3);
  max-width: var(--cpx-measure);
  margin: 0;
  padding-left: 1.1em;
}
body.page-college .prov .col-findings li {
  font-size: var(--cpx-step0);
  line-height: 1.62;
  color: var(--ice-color-text);
}
body.page-college .prov .col-links { display: grid; gap: 7px; max-width: var(--cpx-measure); }
body.page-college .prov .col-links li { font-size: var(--cpx-step0); line-height: 1.5; }
body.page-college .col-sources__item { font-variant-numeric: tabular-nums; }
body.page-college .col-sources__meta { color: var(--ice-color-text-muted); }

/* The operator disclosure. It answers the one objection this record cannot
   argue away, and it was set smaller than the photo captions. */
body.page-college .col--profile .col-disclosure {
  margin: 0 0 var(--ice-space-5);
  padding: var(--ice-space-4) var(--cpx-pad);
  border: var(--cpx-line);
  border-radius: var(--cpx-radius);
  background: var(--cpx-inset);
  box-shadow: none;
}
/* ⚠️ BODY INK, NOT MUTED. Muted over the tinted panel measures 4.42:1 at
   15.5px, which is under the floor — and this is the paragraph that answers
   the conflict-of-interest objection, so it is the last text on the page that
   should be hard to read. It stays quiet by size and by the panel, not by
   fading the words. */
body.page-college .col--profile .col-disclosure p {
  max-width: var(--cpx-measure);
  margin: 0;
  font-size: var(--cpx-step0);
  line-height: 1.6;
  color: var(--ice-color-text);
}
body.page-college .col--profile .col-disclosure a { color: var(--edu-accent); font-weight: 600; }

/* ⚠️ THE RAIL'S TWO ACTIONS, SAME DEFECT AS `.pf__btn--go`.
   `.prail__ctabtn` and `.prail__go` inherit `.edu a { color: var(--edu-accent) }`
   from `edulibrary-refined.css`, which puts rust on the crimson fill at about
   1.3:1. Both state their own ink here. The rail component is not owned by this
   session and is not edited; only its ink is corrected, on this page. */
body.page-college .prail__ctabtn,
body.page-college .prail__ctabtn:hover {
  color: var(--ice-color-on-action, #FAF7F2);
}
/* ⚠️ `.prail__go` IS NOT TOUCHED, AND AN EARLIER REVISION OF THIS FILE WAS
   WRONG TO TOUCH IT. Its fill is a near-white gradient in light and a
   translucent white one in dark, and `ice-college-profile.css` already carries
   the matching `html[data-theme="dark"]` rule. A `body.page-college` override
   ties that rule on specificity, wins on order, and put a pale crimson on the
   pale panel in dark. The rust it inherits from `.edu a` clears 6:1 on the
   light fill; there is nothing here to fix. */
/* `--ice-color-terracotta` on the card's near-white fill measures 3.33:1 at
   12px. `--ice-color-text-accent` is the darkened terracotta the token set
   already carries for text on a light ground, and it resolves in both themes. */
body.page-college .prail__ctalabel { color: var(--ice-color-text-accent); }
body.page-college .prail__facts dd { font-weight: 620; color: var(--ice-color-text); }
body.page-college .prail__head {
  font-size: var(--cpx-step-1);
  letter-spacing: .04em;
  color: var(--ice-color-text-muted);
}

/* The gallery's empty state. `.gal__tile--none span` names the kind of picture
   the record is waiting for — Campus, Laboratories, Library — at 2.47:1, which
   on a college with no photographs is six illegible labels where the page's
   largest block should be. It is a real statement about what is missing and it
   is worth reading. */
body.page-college .col--profile .gal__tile--none span,
body.page-college .col--profile .gal__wait {
  font-size: var(--cpx-step-1);
  line-height: 1.5;
  color: var(--ice-color-text-muted);
}

/* ── phones ── */
@media (max-width: 640px) {
  body.page-college .cpx__cover { height: 210px; }
  body.page-college .record-cover__identity { top:12px; left:12px; width:54%; min-width:0; grid-template-columns:auto minmax(0, 1fr); }
  body.page-college .record-cover__identity p span { display:none; }
  body.page-college .record-cover__mark { width:44px; }
  body.page-college .record-cover__programmes { top:38%; left:12px; width:48%; }
  body.page-college .record-cover__programmes li { padding:5px 7px; font-size:13px; }
  body.page-college .record-cover__programmes li:nth-child(n + 3) { display:none; }
  body.page-college .record-cover__banner { right:10px; bottom:10px; left:10px; grid-template-columns:minmax(0, 1fr); gap:2px; padding:7px 9px; }
  body.page-college .record-cover__banner > span { text-align:left; }
  body.page-college .record-cover__ref { display:none; }
  body.page-college .cpx__coverbanner {
    grid-template-columns: minmax(0, 1fr);
    gap: 9px;
    padding: 11px 12px;
  }
  body.page-college .cpx__coverbanner ul { justify-content: flex-start; }
  body.page-college .cpx__coverbanner li:nth-child(n + 4) { display: none; }
  body.page-college .cpx__id { gap: 12px; }
  body.page-college .cpx__acts { display: grid; }
  body.page-college .cpx__btn { flex: none; }
  body.page-college .cpx__figures { gap: var(--ice-space-3) var(--ice-space-6); }
  body.page-college .cpx__reg > div { display: grid; gap: 1px; }
  body.page-college .cpx__reg dt { min-width: 0; }
  body.page-college .post .post__head,
  body.page-college .post .post__body,
  body.page-college .col--profile .col-block,
  body.page-college .prov > summary,
  body.page-college .prov .prov__body { padding-inline: 16px; }
}

@media (prefers-reduced-motion: reduce) {
  body.page-college .cpx__btn,
  body.page-college .cpxnav a { transition: none; }
  body.page-college .cpx__btn:hover { transform: none; }
}

/* Print: the record is a document, and a printed college page should carry the
   facts and the sources rather than the chrome. */
@media print {
  body.page-college .cpxnav,
  body.page-college .cpxfoot__act { display: none; }
  body.page-college .prov[open] .prov__body,
  body.page-college .prov .prov__body { display: block; }
  body.page-college .cpx__card,
  body.page-college .post,
  body.page-college .col--profile .col-block { box-shadow: none; }
}

/* College identity follows the shared brand kit while retaining its own mark. */
/* ⚠️ A LITERAL INK, BECAUSE THE PLATE UNDER IT IS A LITERAL WHITE. `--edu-ink`
   inverts to #eef5fb under `html[data-theme="dark"]`, and `.cpx__mark--logo`
   above pins `background:#FFFFFF` in BOTH themes on purpose — other
   institutions' marks are mostly dark type on transparency, and a navy seal on
   a navy tile loses everything but its red quarters. Every one of the 1,458
   college pages carries that class; 149 cover it with a logo image, and on the
   other 1,309 the monogram is the institution's identity. In dark mode that put
   #eef5fb on #ffffff — measured 1.10:1 in the browser, a blank white square
   where the mark should be, which is exactly the D-16 fallback failing.
   #1c2a38 is the light theme's own ink value and reads 14.6:1 on white in both
   themes. Do not restore the token here without also unpinning the plate. */
body.page-college .cpx__mark { color:#1c2a38; }
body.page-college .cpx__review-details summary { cursor:pointer; min-height:44px; display:flex; align-items:center; font-size:14px; text-decoration:underline; text-underline-offset:3px; }
body.page-college .cpx__cover[data-media-failed]::after { content:"Campus photo unavailable"; position:absolute; inset:0; display:grid; place-items:center; color:var(--edu-muted); background:var(--edu-paper); }
body.page-college .cpx__btn--go, body.page-college .cpx__btn--go .cpx__btnsub { color:#fff; }
html[data-theme="dark"] body.page-college .cpx__btn--go, html[data-theme="dark"] body.page-college .cpx__btn--go .cpx__btnsub { color:#142b3c; }
html[data-theme="dark"] body.page-college .cpx__btn--go:hover { background:#a6dfff; }
@media(min-width:1080px) {
  body.page-college .cpx__body { grid-template-columns:minmax(0,1fr) minmax(260px,320px); grid-template-areas:"identity actions" "figures actions" "state state"; gap:20px 32px; }
  body.page-college .cpx__id { grid-area:identity; align-items:center; }
  body.page-college .cpx__mark { width:80px; }
  body.page-college .cpx__state { grid-area:state; }
  body.page-college .cpx__figures { grid-area:figures; }
  body.page-college .cpx__acts { grid-area:actions; display:grid; align-content:start; }
}
