/* ============================================================
   Linear Algebra notes. Loaded after blog.css and reuses its variables.
   Base text is deliberately large; --ln-scale (set by the A-/A+ buttons)
   multiplies it, so everything below is written in em.
   ============================================================ */

:root, [data-theme="light"] {
  --c-def: #0a6cd6;   --c-def-bg: rgba(10,108,214,.10);
  --c-thm: #7a3fd0;   --c-thm-bg: rgba(122,63,208,.10);
  --c-proof: #5f6368; --c-proof-bg: rgba(95,99,104,.12);
  --c-ex: #1b8a4b;    --c-ex-bg: rgba(27,138,75,.11);
  --c-note: #b46a00;  --c-note-bg: rgba(180,106,0,.11);
  --c-extra: #c23a7a; --c-extra-bg: rgba(194,58,122,.11);
  --c-null: #e8590c;
  --c-added: #0a5fc4;
}
[data-theme="dark"] {
  --c-def: #5eb0ff;   --c-def-bg: rgba(94,176,255,.16);
  --c-thm: #b995ff;   --c-thm-bg: rgba(185,149,255,.16);
  --c-proof: #b8bcc4; --c-proof-bg: rgba(184,188,196,.14);
  --c-ex: #5fd68f;    --c-ex-bg: rgba(95,214,143,.15);
  --c-note: #ffb454;  --c-note-bg: rgba(255,180,84,.15);
  --c-extra: #ff8ec1; --c-extra-bg: rgba(255,142,193,.15);
  --c-null: #ff9f55;
  --c-added: #7ec0ff;
}

/* ---------- page frame ---------- */
.linalg-body { --hdr: 3.4rem; }

.blog-main.linalg { max-width: 860px; padding-top: 2.2rem; }
.blog-main.linalg.is-hub { max-width: 1000px; }
.linalg .post-lead {
  font-size: calc(1.2rem * var(--ln-scale, 1));
  line-height: 1.5; color: var(--text-soft); max-width: 40em; margin: .4rem auto 1rem;
}
.linalg .hero { text-align: left; padding-top: 0; }
.linalg .hero .post-lead { margin-left: 0; }
.linalg .post-meta { justify-content: flex-start; }
.is-hub .hero { text-align: center; }
.is-hub .hero .post-lead { margin-left: auto; }
.is-hub .post-meta { justify-content: center; }

/* below 1240px the contents list moves into a menu at the top, so the page is a single column */
@media (max-width: 1239px) {
  .blog-main.linalg.has-toc { display: block; max-width: 860px; }
  .blog-main.linalg.is-hub.has-toc { max-width: 1000px; }
}
.blog-main.linalg.is-hub.has-toc { display: block; max-width: 1000px; }
details.toc-details {
  margin: 0 0 1.6rem; border: 1px solid var(--rule-soft); border-radius: 16px; background: var(--bg-soft);
}
details.toc-details > summary {
  cursor: pointer; list-style: none; padding: .95rem 1.2rem; font-size: 1.1rem; font-weight: 650; min-height: 3rem;
  display: flex; align-items: center; justify-content: space-between; color: var(--text);
}
details.toc-details > summary::-webkit-details-marker { display: none; }
details.toc-details > summary::after { content: "+"; font-size: 1.5rem; color: var(--accent); line-height: 1; }
details.toc-details[open] > summary::after { content: "\2212"; }
details.toc-details .toc { padding: 0 1.2rem 1rem; font-size: 1.05rem; max-height: 60vh; overflow-y: auto; }
details.toc-details .toc-label { display: none; }
details.toc-details .toc-item a { display: block; padding: .5rem .3rem; min-height: 2.6rem; }
@media (min-width: 1240px) {
  .blog-main.linalg.has-toc:not(.is-hub) {
    max-width: calc(860px + 250px + 56px + 3rem);
    grid-template-columns: minmax(0, 860px) 250px;
    column-gap: 56px;
  }
}
.is-hub .post-toc-wrap { display: none !important; }

/* ---------- reader bar (text size, downloads) ---------- */
.reader-bar {
  position: sticky; top: var(--hdr); z-index: 90;
  display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: .6rem 1.8rem;
  padding: .55rem 1rem;
  background: var(--glass);
  -webkit-backdrop-filter: saturate(180%) blur(20px); backdrop-filter: saturate(180%) blur(20px);
  border-bottom: 1px solid var(--rule-soft);
}
.rb-group { display: flex; align-items: center; gap: .45rem; }
.rb-label { font-size: 1rem; font-weight: 600; color: var(--text-soft); margin-right: .2rem; }
.rb-btn {
  font: inherit; font-size: 1.05rem; font-weight: 600; line-height: 1;
  min-height: 2.6rem; min-width: 2.9rem; padding: 0 .9rem;
  display: inline-flex; align-items: center; justify-content: center; gap: .1rem;
  color: var(--text); background: var(--bg-elev);
  border: 1px solid var(--rule); border-radius: 999px; cursor: pointer; text-decoration: none;
  transition: background .15s, border-color .15s, transform .1s;
}
.rb-btn:hover { background: var(--bg-soft); border-color: var(--accent); color: var(--text); }
.rb-btn:active { transform: scale(.97); }
.rb-pct { min-width: 4.4rem; color: var(--text-soft); font-variant-numeric: tabular-nums; }
.rb-a-small { font-size: .85em; } .rb-a-big { font-size: 1.3em; }
.rb-dl { color: var(--accent); }
.rb-dl:hover { color: var(--accent-h); }

/* ---------- body typography ---------- */
.linalg .post-body {
  font-size: calc(1.2rem * var(--ln-scale, 1));
  line-height: 1.78;
}
.linalg .post-body h2 { font-size: 1.55em; margin-top: 2.6em; scroll-margin-top: calc(var(--hdr) + 4.5rem); }
.linalg .post-body h3 { font-size: 1.22em; margin-top: 2em; color: var(--c-thm); scroll-margin-top: calc(var(--hdr) + 4.5rem); }
.linalg .post-body p { margin: 1.1em 0; }
.linalg .post-body li { margin: .45em 0; }
.linalg .post-body > .lnotes > *:first-child { margin-top: 0; }

.sc { font-variant: small-caps; letter-spacing: .03em; }
.center { text-align: center; }
.center > p { margin: .4em 0; }
.added { color: var(--c-added); }
.extra-note { font-style: italic; color: var(--text-soft); }
.section-qualifier { margin-top: -.65em !important; color: var(--text-soft); font-weight: 600; }

/* labels: Definition / Theorem / Proof / Example ... */
.lbl {
  display: inline-block; font-size: .72em; font-weight: 700; letter-spacing: .05em; text-transform: uppercase;
  padding: .12em .7em; margin-right: .5em; border-radius: 999px; vertical-align: .12em; white-space: nowrap;
}
.lbl-def   { color: var(--c-def);   background: var(--c-def-bg); }
.lbl-thm   { color: var(--c-thm);   background: var(--c-thm-bg); }
.lbl-proof { color: var(--c-proof); background: var(--c-proof-bg); }
.lbl-example { color: var(--c-ex);  background: var(--c-ex-bg); }
.lbl-note  { color: var(--c-note);  background: var(--c-note-bg); }
.lbl-extra { color: var(--c-extra); background: var(--c-extra-bg); }
.lbl-sub { font-weight: 600; color: var(--text-soft); }

.linalg .post-body p.p-def, .linalg .post-body p.p-thm, .linalg .post-body p.p-example, .linalg .post-body p.p-note {
  border-left: 4px solid; border-radius: 4px 14px 14px 4px; padding: .7em 1em; background: var(--bg-soft);
}
.linalg .post-body p.p-def     { border-color: var(--c-def); }
.linalg .post-body p.p-thm     { border-color: var(--c-thm); }
.linalg .post-body p.p-example { border-color: var(--c-ex); }
.linalg .post-body p.p-note    { border-color: var(--c-note); }
.linalg .post-body p.p-proof   { margin-top: 1.3em; }

/* Paired directions in an if-and-only-if proof. */
.iff-proof {
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1em; margin: 1.1em 0;
}
.iff-proof-step {
  min-width: 0; padding: 1.1em; border: 1px solid var(--rule-soft);
  border-radius: 20px; background: var(--bg-soft); box-shadow: var(--shadow-sm);
}
.iff-proof-heading { display: flex; align-items: center; gap: .75em; margin-bottom: .9em; }
.iff-proof-heading > div { display: flex; min-width: 0; flex-direction: column; line-height: 1.35; }
.iff-proof-heading strong { color: var(--text); font-size: 1.05em; }
.iff-proof-heading span:not(.iff-proof-arrow) { color: var(--text-soft); font-size: .78em; }
.iff-proof-arrow {
  display: grid; flex: 0 0 2.35em; width: 2.35em; height: 2.35em; place-items: center;
  border: 1px solid var(--c-thm); border-radius: 50%; color: var(--c-thm);
  background: var(--c-thm-bg); font-weight: 800; line-height: 1;
}
.linalg .post-body .iff-proof-step > p { margin: .75em 0; }
.iff-proof-step .mblock {
  margin: .75em 0; padding: .15em .7em; border: 1px solid var(--rule-soft);
  border-radius: 14px; background: var(--bg-elev);
}
.iff-proof-step .mblock mjx-container[display="true"] { margin: .65em 0 !important; }
.linalg .post-body .iff-proof-conclusion {
  margin-top: 1em; padding: .7em .8em; border-left: 3px solid var(--c-thm);
  border-radius: 4px 12px 12px 4px; background: var(--c-thm-bg);
}
.linalg .post-body .iff-proof-complete {
  margin: 1em 0 1.5em; text-align: center; color: var(--text-soft);
}
@media (max-width: 720px) {
  .iff-proof { grid-template-columns: 1fr; }
  .iff-proof-step { padding: 1em .85em; }
}

/* remarks and exercises */
.remark, .exercise {
  margin: 1.1em 0; padding: .75em 1em; border-radius: 12px; font-size: .96em; line-height: 1.6;
  background: var(--bg-soft); border-left: 4px solid var(--muted);
}
.exercise { border-left-color: var(--c-null); background: var(--c-note-bg); }
.remark-label { font-weight: 700; margin-right: .4em; color: var(--text-soft); }
.exercise .remark-label { color: var(--c-null); }

/* page markers: a small tag on the right, only there so a page can be matched with the original notes */
.pagemark { display: none; text-align: right; margin: 1.6em 0 -.5em; line-height: 1; }
.pagemark span { font-size: .8rem; font-weight: 600; letter-spacing: .05em; color: var(--muted); opacity: .85; }
.pagemark.extra { display: block; text-align: left; margin-top: 2.4em; }
.pagemark.extra span { font-size: .9rem; color: var(--c-extra); }

/* lists */
.linalg .post-body ol.roman { list-style-type: lower-roman; padding-left: 2.2em; }
.linalg .post-body ol.alpha { list-style-type: lower-alpha; padding-left: 2.2em; }
.linalg .post-body ol.decimal { padding-left: 2em; }
.linalg .post-body ol li::marker { color: var(--accent); font-weight: 700; }
.linalg .post-body ul.gt { list-style: none; padding-left: 1.6em; }
.linalg .post-body ul.gt > li { position: relative; }
.linalg .post-body ul.gt > li::before { content: "\203A"; position: absolute; left: -1.05em; top: -.04em; color: var(--accent); font-weight: 700; font-size: 1.15em; }
.linalg .post-body li > p:first-child { margin-top: 0; }
.linalg .post-body li > p:last-child { margin-bottom: 0; }

/* math */
.mblock, mjx-container[display="true"] { overflow-x: auto; overflow-y: hidden; max-width: 100%; }
mjx-container[display="true"] { margin: 1.6em 0 !important; padding: .45em 0; }
.mblock { margin: .5em 0; }

/* handwritten figures */
.scan {
  margin: 1.6em auto; text-align: center; max-width: 100%;
  width: max(var(--w, 60%), min(100%, 460px));
}
.scan a { display: block; background: #fff; border-radius: 16px; padding: .7rem; border: 1px solid var(--rule-soft); box-shadow: var(--shadow-sm); cursor: zoom-in; }
.scan img { display: block; width: 100%; height: auto; }
.scan figcaption { font-size: .9rem; color: var(--muted); margin-top: .5rem; }
.lightbox {
  position: fixed; inset: 0; z-index: 1000; display: flex; align-items: center; justify-content: center;
  background: rgba(0,0,0,.82); padding: 1rem; cursor: zoom-out;
}
.lightbox img { max-width: min(96vw, 1400px); max-height: 94vh; background: #fff; border-radius: 12px; padding: .6rem; }

/* previous / next */
.pager { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; margin: 4rem 0 1rem; }
.pager-link {
  display: flex; flex-direction: column; gap: .35rem; padding: 1.1rem 1.3rem; border-radius: 18px;
  background: var(--bg-soft); border: 1px solid var(--rule-soft); color: var(--text);
  transition: transform .15s, border-color .15s, box-shadow .15s;
}
.pager-link:hover { transform: translateY(-2px); border-color: var(--accent); box-shadow: var(--shadow-md); color: var(--text); }
.pager-next { grid-column: 2; text-align: right; }
.pager-prev { grid-column: 1; }
.pager-dir { font-size: .98rem; font-weight: 600; color: var(--accent); }
.pager-title { font-size: 1.2rem; font-weight: 650; letter-spacing: -.01em; line-height: 1.3; }
@media (max-width: 640px) { .pager { grid-template-columns: 1fr; } .pager-next, .pager-prev { grid-column: 1; text-align: left; } }

/* ============================================================
   Hub page
   ============================================================ */
.lhub { font-size: 1.1rem; }
.lhub h2 { font-size: 1.9rem; margin-top: 3.4rem; letter-spacing: -.03em; text-align: center; }
.lhub .lede { max-width: 38em; margin: 1rem auto; text-align: center; color: var(--text-soft); font-size: 1.2rem; line-height: 1.6; }

/* four subspaces figure: plain ink drawing, no text, no motion */
.fourspaces { margin: 1.6rem auto 0; max-width: 960px; }
.hf-svg { display: block; width: 100%; height: auto; }
.hf-portrait { display: none; max-width: 420px; margin: 0 auto; }
@media (max-width: 700px) { .hf-landscape { display: none; } .hf-portrait { display: block; } }
.hf-panel { fill: var(--bg-soft); stroke: var(--rule); stroke-width: 1.5; }
.hf-box { fill: var(--bg); stroke: var(--text); stroke-opacity: .55; stroke-width: 2.5; }
.hf-dash { fill: none; stroke: var(--text-soft); stroke-width: 2.4; stroke-linecap: round; stroke-dasharray: 3 9; }
.hf-arrow { fill: none; stroke: var(--text); stroke-width: 3; stroke-linecap: round; }
.hf-ah { fill: var(--text); }
.hf-dot { fill: var(--text); }
.hf-zero { fill: var(--bg); stroke: var(--text); stroke-width: 3; }

/* section cards */
.sec-grid { display: grid; gap: 1.1rem; margin-top: 1.8rem; }
.sec-card {
  position: relative; display: grid; grid-template-columns: auto 1fr auto; gap: 1.2rem; align-items: start;
  padding: 1.5rem 1.6rem; border-radius: 22px; background: var(--bg-soft); border: 1px solid var(--rule-soft);
  color: var(--text); transition: transform .18s, box-shadow .18s, border-color .18s;
}
.sec-card:hover { transform: translateY(-3px); box-shadow: var(--shadow-md); border-color: var(--accent); color: var(--text); }
.sec-no {
  display: grid; place-items: center; width: 3.4rem; height: 3.4rem; border-radius: 16px;
  background: var(--accent); color: #fff; font-size: 1.6rem; font-weight: 700; letter-spacing: -.02em;
}
.sec-body { display: flex; flex-direction: column; gap: .45rem; min-width: 0; }
.sec-title { font-size: 1.45rem; font-weight: 700; letter-spacing: -.02em; line-height: 1.25; }
.sec-sum { font-size: 1.1rem; line-height: 1.55; color: var(--text-soft); }
.post-body .sec-topics { list-style: none; margin: .3rem 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: .5rem; }
.post-body .sec-topics li { margin: 0; font-size: .98rem; font-weight: 600; padding: .25em .85em; border-radius: 999px; background: var(--bg-elev); border: 1px solid var(--rule-soft); color: var(--text-soft); }
.sec-meta { font-size: 1rem; color: var(--muted); margin-top: .3rem; }
.sec-go { font-size: 1.8rem; color: var(--accent); align-self: center; transition: transform .18s; }
.sec-card:hover .sec-go { transform: translateX(4px); }
@media (max-width: 600px) {
  .sec-card { grid-template-columns: auto 1fr; padding: 1.2rem; }
  .sec-go { display: none; }
}

/* how to read */
.legend { display: grid; grid-template-columns: repeat(auto-fit, minmax(15rem, 1fr)); gap: .9rem; margin: 1.6rem 0; }
.legend > div { padding: 1rem 1.2rem; border-radius: 16px; background: var(--bg-soft); border: 1px solid var(--rule-soft); font-size: 1.05rem; line-height: 1.5; }
.legend .lbl { margin-bottom: .4rem; }
.notation-table { width: 100%; border-collapse: collapse; font-size: 1.1rem; margin: 1rem 0; }
.notation-table th, .notation-table td { text-align: left; padding: .7rem .9rem; border-bottom: 1px solid var(--rule); }
.notation-table th { color: var(--text-soft); font-size: 1rem; }
.notation-table .ul1 { text-decoration: underline; }
.notation-table .ul2 { text-decoration: underline double; }
.dl-row { display: flex; flex-wrap: wrap; gap: .8rem; justify-content: center; margin: 1.4rem 0; }
.dl-btn {
  display: inline-flex; align-items: center; gap: .6rem; padding: .9rem 1.5rem; border-radius: 999px;
  font-size: 1.1rem; font-weight: 650; color: #fff; background: var(--accent); border: none;
}
.dl-btn:hover { background: var(--accent-h); color: #fff; }

@media print {
  .reader-bar, .blog-header, .pager, .post-toc-wrap, .blog-footer { display: none !important; }
}

/* ---------- phones ---------- */
@media (max-width: 600px) {
  .reader-bar { gap: .35rem .7rem; padding: .4rem .5rem; }
  .rb-group { gap: .3rem; }
  .rb-label { display: none; }
  .rb-btn { min-height: 2.75rem; min-width: 2.75rem; padding: 0 .75rem; font-size: 1rem; }
  .rb-pct { min-width: 3.6rem; }
  .linalg .post-body { font-size: calc(1.1rem * var(--ln-scale, 1)); line-height: 1.68; }
  .linalg .post-lead { font-size: calc(1.1rem * var(--ln-scale, 1)); }
  .linalg .post-body h2 { font-size: 1.45em; }
  .linalg .post-body ol.roman, .linalg .post-body ol.alpha { padding-left: 1.7em; }
  .linalg .post-body p.p-def, .linalg .post-body p.p-thm, .linalg .post-body p.p-example, .linalg .post-body p.p-note { padding: .6em .8em; }
  .lhub h2 { font-size: 1.6rem; }
  .lhub .lede { font-size: 1.1rem; }
  .pagemark { margin-top: 2.2em; }
  .blog-main.linalg { padding-left: 1rem; padding-right: 1rem; }
}

.blog-footer .credit { margin: 1rem 0 0; font-size: .92rem; color: var(--muted); }

/* a formula that is too wide for its line is moved onto its own line (see linalg.js) */
.lnotes mjx-container.mj-wide { display: block !important; max-width: 100%; overflow-x: auto; overflow-y: hidden; margin: .5em 0; text-align: left; }

/* Ordered lesson content presented as responsive cards and carousels. */
.lnotes .definition-cards {
  counter-reset: definition-card;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .9em;
  margin: 1em 0 1.8em;
  padding: 0;
  list-style: none;
}
.lnotes .definition-cards > li {
  counter-increment: definition-card;
  position: relative;
  margin: 0;
  padding: 1em 1.1em 1em 3.5em;
  border: 1px solid var(--rule-soft);
  border-radius: 18px;
  background: var(--bg-soft);
  box-shadow: var(--shadow-sm);
}
.lnotes.complex-numbers .definition-cards > li:nth-child(3) { grid-column: 1 / -1; }
.lnotes.complex-numbers .multiplication-cards > li:nth-child(3),
.lnotes.complex-numbers .summation-cards > li:nth-child(3),
.lnotes.complex-numbers .conjugation-cards > li:nth-child(3) { grid-column: auto; }
.lnotes .definition-cards > li::before {
  content: counter(definition-card);
  position: absolute;
  top: 1em;
  left: 1em;
  display: grid;
  width: 1.75em;
  height: 1.75em;
  place-items: center;
  border: 1px solid var(--c-def);
  border-radius: 50%;
  color: var(--c-def);
  background: var(--c-def-bg);
  font-size: .78em;
  font-weight: 750;
  line-height: 1;
}
.lnotes .definition-carousel.is-enhanced .definition-cards > li::before {
  content: attr(data-card-number);
}
.lnotes .definition-carousel.is-enhanced {
  display: grid;
  grid-template-columns: 3rem minmax(0, 1fr) 3rem;
  gap: .75em;
  align-items: center;
  margin: 1em 0 1.8em;
}
.lnotes .definition-carousel.is-enhanced .definition-cards {
  grid-column: 2;
  grid-row: 1;
  display: block;
  min-width: 0;
  margin: 0;
}
.lnotes .definition-carousel.is-enhanced .definition-cards > li {
  min-height: 7.5em;
}
.lnotes .proof-cards { grid-template-columns: 1fr; }
.lnotes .proof-cards > li::before { border-color: var(--c-proof); color: var(--c-proof); background: var(--c-proof-bg); }
.definition-carousel [hidden] { display: none !important; }
.definition-nav {
  display: grid;
  width: 3rem;
  height: 3rem;
  padding: 0;
  place-items: center;
  border: 1px solid var(--rule);
  border-radius: 50%;
  color: var(--accent);
  background: var(--bg-elev);
  font: inherit;
  font-size: 1.35em;
  line-height: 1;
  cursor: pointer;
  transition: transform .15s, border-color .15s, background .15s;
}
.definition-nav:hover { border-color: var(--accent); background: var(--bg-soft); transform: scale(1.05); }
.definition-nav:focus-visible { outline: 3px solid var(--c-def-bg); outline-offset: 3px; border-color: var(--accent); }
.definition-nav-prev { grid-column: 1; grid-row: 1; }
.definition-nav-next { grid-column: 3; grid-row: 1; }
.definition-position {
  grid-column: 1 / -1;
  grid-row: 2;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: .55em;
  color: var(--text-soft);
  font-size: .8em;
}
.definition-dots { display: flex; align-items: center; gap: .42em; }
.definition-dot {
  width: .72rem;
  height: .72rem;
  padding: 0;
  border: 1px solid var(--accent);
  border-radius: 50%;
  background: transparent;
  cursor: pointer;
}
.definition-dot[aria-current="true"] { background: var(--accent); transform: scale(1.15); }
.definition-dot:focus-visible { outline: 3px solid var(--c-def-bg); outline-offset: 3px; }
.proof-disclosure {
  margin-top: .9em;
  padding-top: .8em;
  border-top: 1px solid var(--rule-soft);
}
.proof-disclosure > summary {
  display: inline-flex;
  min-height: 2.7rem;
  align-items: center;
  justify-content: center;
  padding: .5em 1em;
  border: 1px solid var(--c-proof);
  border-radius: 999px;
  color: var(--c-proof);
  background: var(--c-proof-bg);
  font-size: .88em;
  font-weight: 700;
  list-style: none;
  cursor: pointer;
}
.proof-disclosure > summary::-webkit-details-marker { display: none; }
.proof-disclosure > summary:hover { border-color: var(--text-soft); color: var(--text); }
.proof-disclosure > summary:focus-visible { outline: 3px solid var(--c-proof-bg); outline-offset: 3px; }
.proof-disclosure .proof-hide { display: none; }
.proof-disclosure[open] .proof-show { display: none; }
.proof-disclosure[open] .proof-hide { display: inline; }
.proof-body {
  margin-top: .8em;
  padding: .2em 1em .7em;
  border-radius: 14px;
  background: var(--c-proof-bg);
}
@media (max-width: 600px) {
  .lnotes .definition-cards { grid-template-columns: 1fr; }
  .lnotes.complex-numbers .definition-cards > li:nth-child(3) { grid-column: auto; }
  .lnotes .definition-carousel.is-enhanced { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .7em; }
  .lnotes .definition-carousel.is-enhanced .definition-cards { grid-column: 1 / -1; }
  .lnotes .definition-carousel.is-enhanced .definition-cards > li { min-height: 0; }
  .definition-nav { width: 100%; height: 2.9rem; border-radius: 999px; }
  .definition-nav-prev { grid-column: 1; grid-row: 2; }
  .definition-nav-next { grid-column: 2; grid-row: 2; }
  .definition-position { grid-row: 3; }
  .proof-disclosure > summary { width: 100%; }
  .proof-body { padding: .15em .75em .6em; }
}

/* ---------- interactive Gaussian-elimination walkthrough ---------- */
.gauss-demo {
  margin: 1.8em 0;
  padding: 1em;
  border: 1px solid var(--rule-soft);
  border-radius: 24px;
  background: var(--bg-elev);
  box-shadow: var(--shadow-sm);
}
.gauss-step {
  min-width: 0;
  margin: .8em 0;
  padding: 1.15em 1.25em;
  border: 1px solid var(--rule-soft);
  border-radius: 18px;
  background: var(--bg-soft);
}
.linalg .post-body .gauss-step h3 { margin: .2em 0 .55em; color: var(--text); }
.gauss-step-kicker {
  color: var(--accent);
  font-size: .74em;
  font-weight: 750;
  letter-spacing: .06em;
  text-transform: uppercase;
}
.gauss-operation {
  padding: .65em .8em;
  border-left: 4px solid var(--accent);
  border-radius: 4px 12px 12px 4px;
  background: var(--c-def-bg);
}
.gauss-result {
  margin: 1em 0;
  padding: .2em .7em;
  border: 1px solid var(--c-ex);
  border-radius: 14px;
  background: var(--c-ex-bg);
  overflow-x: auto;
}
.gauss-final { font-weight: 700; }
.gauss-demo.is-enhanced .gauss-steps { display: grid; }
.gauss-demo.is-enhanced .gauss-step {
  grid-area: 1 / 1;
  margin: 0;
  opacity: 0;
  visibility: hidden;
  transform: translateX(1rem);
  pointer-events: none;
  transition: opacity .38s ease, transform .38s ease, visibility 0s linear .38s;
}
.gauss-demo.is-enhanced .gauss-step.is-active {
  opacity: 1;
  visibility: visible;
  transform: translateX(0);
  pointer-events: auto;
  transition-delay: 0s;
}
.gauss-toolbar {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 1em;
  margin: 0 0 .9em;
}
.gauss-status { color: var(--text-soft); font-size: .82em; font-weight: 650; }
.gauss-current-title { margin-top: .12em; color: var(--text); font-weight: 750; }
.gauss-progress {
  width: min(48%, 18rem);
  height: .55rem;
  border-radius: 999px;
  background: var(--rule-soft);
  overflow: hidden;
}
.gauss-progress-fill {
  display: block;
  width: 0;
  height: 100%;
  border-radius: inherit;
  background: var(--accent);
  transition: width .38s ease;
}
.gauss-controls {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  gap: .65em;
  margin-top: .9em;
}
.gauss-btn {
  min-height: 3rem;
  padding: .55em 1em;
  border: 1px solid var(--rule);
  border-radius: 999px;
  color: var(--text);
  background: var(--bg-elev);
  font: inherit;
  font-size: .88em;
  font-weight: 700;
  cursor: pointer;
  transition: transform .15s, border-color .15s, background .15s;
}
.gauss-btn:hover:not(:disabled) { border-color: var(--accent); background: var(--bg-soft); transform: translateY(-1px); }
.gauss-btn:focus-visible { outline: 3px solid var(--c-def-bg); outline-offset: 3px; border-color: var(--accent); }
.gauss-btn:disabled { opacity: .42; cursor: not-allowed; }
.gauss-play { min-width: 8.5rem; color: #fff; border-color: var(--accent); background: var(--accent); }
.gauss-play:hover:not(:disabled) { color: #fff; background: var(--accent-h); }
.gauss-next { text-align: right; }
.gauss-prev { text-align: left; }
@media (prefers-reduced-motion: reduce) {
  .gauss-demo.is-enhanced .gauss-step, .gauss-progress-fill, .gauss-btn { transition: none; }
}
@media (max-width: 600px) {
  .gauss-demo { padding: .7em; border-radius: 18px; }
  .gauss-step { padding: .9em .8em; }
  .gauss-toolbar { display: block; }
  .gauss-progress { width: 100%; margin-top: .65em; }
  .gauss-controls { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .gauss-prev { grid-column: 1; grid-row: 1; text-align: center; }
  .gauss-next { grid-column: 2; grid-row: 1; text-align: center; }
  .gauss-play { grid-column: 1 / -1; grid-row: 2; width: 100%; }
}

/* ---------- interactive 3D Gram–Schmidt walkthrough ---------- */
.gram-demo {
  margin: 1.8em 0; padding: 1em; border: 1px solid var(--rule-soft);
  border-radius: 24px; background: var(--bg-elev); box-shadow: var(--shadow-sm);
}
.gram-stage {
  overflow: hidden; border: 1px solid var(--rule-soft); border-radius: 20px;
  background: var(--bg-soft);
}
.gram-svg { display: block; width: 100%; height: auto; }
.gram-backdrop { fill: var(--bg-soft); }
.gram-axes line { stroke: var(--text-soft); stroke-width: 1.8; opacity: .55; }
.gram-axes text {
  fill: var(--text-soft); font: italic 600 23px ui-serif, Georgia, serif;
}
.gram-arrow-axis { fill: var(--text-soft); }
.gram-arrow-blue { fill: var(--accent); }
.gram-arrow-orange { fill: var(--c-null); }
.gram-arrow-green { fill: var(--c-ex); }
.gram-arrow-purple { fill: var(--c-thm); }
.gram-layer {
  opacity: 0; visibility: hidden; transform: translateY(-4px);
  transition: opacity .42s ease, transform .42s ease, visibility 0s linear .42s;
}
.gram-layer.is-visible {
  opacity: 1; visibility: visible; transform: translateY(0); transition-delay: 0s;
}
.gram-vector, .gram-projection, .gram-error, .gram-ghost, .gram-muted-vector {
  fill: none; stroke-linecap: round; stroke-linejoin: round;
}
.gram-vector { stroke-width: 5; }
.gram-blue { stroke: var(--accent); }
.gram-orange { stroke: var(--c-null); }
.gram-green { stroke: var(--c-ex); }
.gram-projection { stroke: var(--c-thm); stroke-width: 5; }
.gram-error { stroke: var(--text); stroke-width: 3; stroke-dasharray: 8 7; }
.gram-ghost { stroke: var(--text-soft); stroke-width: 3; stroke-dasharray: 6 7; opacity: .48; }
.gram-muted-vector { stroke: var(--text-soft); stroke-width: 3; opacity: .28; }
.gram-plane { fill: var(--c-thm); fill-opacity: .12; stroke: var(--c-thm); stroke-width: 2; stroke-dasharray: 7 7; }
.gram-origin { fill: var(--text); }
.gram-svg text { paint-order: stroke; stroke: var(--bg-soft); stroke-width: 5px; stroke-linejoin: round; }
.gram-label { font: italic 750 27px ui-serif, Georgia, serif; }
.gram-blue-fill { fill: var(--accent); }
.gram-orange-fill { fill: var(--c-null); }
.gram-green-fill { fill: var(--c-ex); }
.gram-small-label, .gram-ghost-label {
  fill: var(--text-soft); font: 650 20px -apple-system, BlinkMacSystemFont, "SF Pro Text", Helvetica, Arial, sans-serif;
}
.gram-ghost-label { opacity: .7; font-style: italic; }
.gram-legend {
  display: flex; flex-wrap: wrap; justify-content: center; gap: .5em 1em;
  padding: .65em .8em .75em; color: var(--text-soft); font-size: .75em;
}
.gram-legend span { display: inline-flex; align-items: center; gap: .4em; }
.gram-legend i { width: .8em; height: .8em; border-radius: 50%; }
.gram-blue-bg { background: var(--accent); }
.gram-orange-bg { background: var(--c-null); }
.gram-green-bg { background: var(--c-ex); }
.gram-purple-bg { background: var(--c-thm); }
.gram-steps { margin-top: .9em; }
.gram-step {
  min-width: 0; padding: 1em 1.15em; border: 1px solid var(--rule-soft);
  border-radius: 18px; background: var(--bg-soft);
}
.gram-step-kicker {
  color: var(--accent); font-size: .75em; font-weight: 750;
  letter-spacing: .055em; text-transform: uppercase;
}
.linalg .post-body .gram-step p { margin: .65em 0 0; }
.gram-step .mblock { margin: .45em 0; }
.gram-final { font-weight: 650; }
.gram-demo.is-enhanced .gram-steps { display: grid; }
.gram-demo.is-enhanced .gram-step {
  grid-area: 1 / 1; opacity: 0; visibility: hidden; transform: translateX(1rem);
  pointer-events: none; transition: opacity .38s ease, transform .38s ease, visibility 0s linear .38s;
}
.gram-demo.is-enhanced .gram-step.is-active {
  opacity: 1; visibility: visible; transform: translateX(0); pointer-events: auto; transition-delay: 0s;
}
@media (prefers-reduced-motion: reduce) {
  .gram-layer, .gram-demo.is-enhanced .gram-step { transition: none; }
}
@media (max-width: 600px) {
  .gram-demo { padding: .65em; border-radius: 18px; }
  .gram-stage { border-radius: 15px; }
  .gram-step { padding: .85em .75em; }
  .gram-legend { font-size: .68em; gap: .4em .75em; }
}

/* ---------- redrawn figures (inline SVG) ---------- */
.diagram { margin: 1.8em auto; width: max(var(--w, 60%), min(100%, 460px)); max-width: 100%;
  background: var(--bg-soft); border: 1px solid var(--rule-soft); border-radius: 18px; padding: .7rem .9rem; }
.cauchy-schwarz-visual figcaption {
  max-width: 42em; margin: .8em auto 0; text-align: center;
  color: var(--text-soft); font-size: .92em; line-height: 1.6;
}
.dg { display: block; width: 100%; height: auto; overflow: visible; }
.dg .ax { stroke: var(--text-soft); stroke-width: 2.4; fill: none; stroke-linecap: round; stroke-linejoin: round; }
.dg .thin { stroke: var(--text-soft); stroke-width: 1.8; fill: none; }
.dg .thinb { stroke: var(--c-null); stroke-width: 2; fill: none; }
.dg .vec { stroke: var(--accent); stroke-width: 3.6; fill: none; stroke-linecap: round; }
.dg .vec2 { stroke: var(--c-null); stroke-width: 3.6; fill: none; stroke-linecap: round; }
.dg .vec3 { stroke: var(--c-ex); stroke-width: 3.6; fill: none; stroke-linecap: round; }
.dg .vecb { stroke: var(--accent); stroke-width: 2.4; fill: none; stroke-linecap: round; }
.dg .dash { stroke: var(--muted); stroke-width: 1.9; stroke-dasharray: 6 6; fill: none; }
.dg .lab { font: 600 22px -apple-system, BlinkMacSystemFont, "SF Pro Text", Helvetica, Arial, sans-serif; fill: var(--text); }
.dg .m { font: italic 500 25px ui-serif, Georgia, "Times New Roman", serif; fill: var(--text); }
.dg .mb { font: italic 700 26px ui-serif, Georgia, "Times New Roman", serif; fill: var(--text); }
.dg .note { font: 500 19px -apple-system, BlinkMacSystemFont, "SF Pro Text", Helvetica, Arial, sans-serif; fill: var(--text-soft); }
.dg .cap { font: italic 500 21px ui-serif, Georgia, "Times New Roman", serif; fill: var(--text-soft); }
.dg .pt { fill: var(--text); } .dg .ptA { fill: var(--accent); } .dg .ptB { fill: var(--c-null); } .dg .ptC { fill: var(--c-ex); }
.dg .fillA { fill: var(--accent); fill-opacity: .13; stroke: var(--accent); stroke-width: 2; }
.dg .fillB { fill: var(--c-null); fill-opacity: .13; stroke: var(--c-null); stroke-width: 2; }
.dg .fillN { fill: var(--bg-elev); stroke: var(--text-soft); stroke-width: 2; }
.dg .ah-n { fill: var(--text-soft); } .dg .ah-a { fill: var(--accent); } .dg .ah-b { fill: var(--c-null); } .dg .ah-c { fill: var(--c-ex); }
.dg .open { fill: var(--bg-soft); stroke: var(--text-soft); stroke-width: 2.4; }
.dg .src { fill: var(--bg-elev); stroke: var(--text-soft); stroke-width: 2.4; }
.dg .bg { fill: var(--bg-soft); stroke: none; }

/* ---------- coloured equation boxes ---------- */
.keyeq, .keythm { margin: 1.8em 0; padding: .5em 1.3rem; border-radius: 18px; border: 1.5px solid; }
.keyeq { border-color: var(--c-def); background: var(--c-def-bg); }
.keythm { border-color: var(--c-thm); background: var(--c-thm-bg); }
.keyeq-title { margin: .35em 0 -.2em; font-size: .78em; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; }
.keyeq .keyeq-title { color: var(--c-def); } .keythm .keyeq-title { color: var(--c-thm); }
.keyeq mjx-container[display="true"], .keythm mjx-container[display="true"] { margin: .8em 0 !important; }
.keyeq .mblock, .keythm .mblock { margin: .3em 0; }
.keyeq p, .keythm p { margin: .6em 0; }

/* ---------- paper: pale yellow notebook colours ---------- */
html[data-paper="on"] {
  --bg: #fbf3d6; --bg-elev: #fffbea; --bg-soft: #f4e9bf; --text: #2a2416; --text-soft: #574c31; --muted: #8a7d58;
  --rule: #d8c88f; --rule-soft: #e7daa9; --accent: #0a58b5; --accent-h: #0b6bd6; --glass: rgba(251, 243, 214, .8);
  --shadow-sm: 0 1px 3px rgba(90, 70, 20, .12); --shadow-md: 0 4px 16px rgba(90, 70, 20, .14);
  --c-def: #0a5db8; --c-def-bg: rgba(10,93,184,.10); --c-thm: #6b34b8; --c-thm-bg: rgba(107,52,184,.10);
  --c-proof: #5b5640; --c-proof-bg: rgba(91,86,64,.14); --c-ex: #19763f; --c-ex-bg: rgba(25,118,63,.12);
  --c-note: #a65f00; --c-note-bg: rgba(166,95,0,.12); --c-null: #d2520b; --c-added: #0a58b5;
  color-scheme: light;
}
.rb-paper.is-on { background: #f4e9bf; border-color: #b9a55f; color: #3a3220; }
html[data-paper="on"] .rb-btn { background: var(--bg-elev); }
html[data-paper="on"] .rb-paper.is-on { background: #efe0a3; }
@media (max-width: 600px) { .reader-bar { position: static; flex-wrap: wrap; } }