/* Illustrated cells, 28 Oct 2026. Loaded only by the four learning back pages.
   Media has no intrinsic height on desktop: the unchanged copy sizes each card,
   so equalise() can still measure a natural minimum without a feedback loop. */
body.cell-art-page .framework-panels .picture-cell,
body.cell-art-page #send-support .send-points > .picture-cell,
body.cell-art-page #english-for-work .adult-topics--work > .picture-cell {
  display: grid;
  grid-template-columns: 44% minmax(0, 1fr);
  grid-template-rows: auto;
  gap: 0;
  min-width: 0;
  padding: 0;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: var(--paper);
}
body.cell-art-page .framework-panels .picture-cell-media {
  position: relative;
  min-width: 0;
  min-height: 130px;
  border-radius: 15px 0 0 15px;
  background: #f0e9db;
}
body.cell-art-page .framework-panels .picture-cell-media > img {
  position: absolute;
  inset: 0;
  display: block;
  float: none;
  width: 100%;
  height: 100%;
  max-width: none;
  margin: 0;
  border-radius: inherit;
  object-fit: contain;
}
body.cell-art-page .framework-panels :is(#our-lessons, #send-support, #english-for-work) .picture-cell-media > img {
  width: 100%; height: 100%; margin: 0; grid-area: auto;
}
body.cell-art-page .framework-panels .picture-cell-copy {
  min-width: 0;
  align-self: center;
  padding: 14px;
}
body.cell-art-page .framework-panels .picture-cell-copy > :first-child { margin-top: 0; }
body.cell-art-page .framework-panels .picture-cell-copy > :last-child { margin-bottom: 0; }
body.cell-art-page .steps-panel .learning-steps > li::before { display: none; }
body.cell-art-page .steps-panel .learning-steps h3::before {
  content: counter(learning-step, decimal-leading-zero);
  display: inline;
  margin: 0 7px 0 0;
  color: var(--orange-text);
  font-size: .8rem;
  font-variant-numeric: tabular-nums;
}
body.cell-art-page .steps-panel .learning-steps h3 { font-size: 1.075rem; line-height: 1.25; margin-bottom: 8px; }
body.cell-art-page .steps-panel .learning-steps p { margin: 0; line-height: 1.4; }
body.cell-art-page #send-support .send-points .picture-cell-copy > :is(h3, p),
body.cell-art-page #english-for-work .adult-topics--work .picture-cell-copy > :is(h3, p) { grid-area: auto; }
body.cell-art-page #send-support .send-points h3 { margin-bottom: 7px; }
body.cell-art-page #english-for-work .adult-topics--work h3 { margin-bottom: 7px; font-size: 1.075rem; }
body.cell-art-page #english-for-work .adult-topics--work p { line-height: 1.4; }
body.cell-art-page #english-for-work .adult-topics--work > article {
  --heading: #0b3f51; --ink: #142f3a; --ink-rgb: 20, 47, 58;
  --line: rgba(11, 63, 81, .22); --orange-text: #b74716;
  background: #f3eee4; color: var(--ink); border-color: transparent;
}

/* Give single-section pictures a real column rather than a small float. */
body.cell-art-page #weekly-reports .section-head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 36%;
  column-gap: 20px;
  align-items: center;
}
body.cell-art-page #weekly-reports .section-head > .framework-panel-art {
  grid-column: 2; grid-row: 1 / span 2;
  float: none; width: 100%; height: clamp(120px, 18vh, 160px); margin: 0;
  object-fit: contain; background: #f0e9db;
}
body.cell-art-page #weekly-reports .section-head > :is(h2, p) { grid-column: 1; }
body.cell-art-page #weekly-reports .report-parts { align-items: start; grid-auto-rows: auto; }
body.cell-art-page #our-lessons .lesson-example-head { grid-template-columns: minmax(0, 1fr) 34%; gap: 18px; margin-bottom: 12px; }
body.cell-art-page #our-lessons .lesson-example-head img { width: 100%; height: 125px; object-fit: contain; background: #f0e9db; }
body.cell-art-page #qualifications .qualification-cards > article { padding: 0; border: 0; border-radius: 16px; background: #f3eee4; color: #142f3a; --heading: #0b3f51; --line: rgba(11, 63, 81, .22); }
body.cell-art-page #qualifications .qualification-art { height: clamp(160px, 25vh, 225px); margin: 0; border-radius: 16px 16px 0 0; background: #f0e9db; }
body.cell-art-page #qualifications .qualification-cards > article > :is(h3, p, a) { margin: 12px 16px 0; }
body.cell-art-page #qualifications .qualification-cards > article > a { margin-top: auto; padding-block: 10px 14px; }

@media screen and (min-width: 1000px) {
  /* Use the v2 frame's existing space; don't stretch cells during natural measurement. */
  body.cell-art-page[data-page-frame] .framework-panels { padding: 20px 24px; }
  body.cell-art-page[data-page-frame] .framework-panels .picture-cell { display: grid; padding: 0; gap: 0; }
  body.cell-art-page[data-page-frame] .framework-panels .section-head { margin-bottom: 14px; }
  body.cell-art-page[data-page-frame] .framework-panels .section-head h2 { font-size: clamp(1.5rem, 3.8vh, 2rem); }
  body.cell-art-page[data-page-frame] .framework-panels :is(.learning-steps, .adult-topics--work, .send-points) { gap: 12px; margin-block: 12px; }
  body.cell-art-page[data-page-frame] .steps-panel .learning-steps { flex: 1 0 auto; align-content: center; grid-auto-rows: 1fr; }
  body.cell-art-page[data-page-frame] .steps-panel .learning-steps p { font-size: clamp(.9rem, 1.95vh, 1rem); }
  body.cell-art-page[data-page-frame] .steps-panel .picture-cell-copy { align-self: end; padding: 12px; }
  body.cell-art-page[data-page-frame] .framework-panels.is-measuring .learning-steps { flex: none; }
  body.cell-art-page[data-page-frame] #our-lessons .lesson-stage-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
  body.cell-art-page[data-page-frame] #our-lessons .lesson-stage-grid > .picture-cell { grid-template-columns: minmax(0, 1fr); padding: 0; gap: 0; }
  body.cell-art-page[data-page-frame] #our-lessons .lesson-stage-grid .picture-cell-media { min-height: 0; height: clamp(95px, 16vh, 144px); border-radius: 15px 15px 0 0; }
  body.cell-art-page[data-page-frame] #our-lessons .lesson-stage-grid .picture-cell-copy { padding: 12px; align-self: start; }
  body.cell-art-page[data-page-frame] #our-lessons .lesson-stage-grid h4 { display: block; font-size: 1rem; margin-bottom: 6px; }
  body.cell-art-page[data-page-frame] #our-lessons .lesson-stage-grid h4::before { margin-right: 7px; }
  body.cell-art-page[data-page-frame] #our-lessons .lesson-stage-grid p { font-size: .95rem; line-height: 1.4; }
  body.cell-art-page[data-page-frame] #weekly-reports .report-parts { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; margin-block: 10px; }
  body.cell-art-page[data-page-frame] #weekly-reports .report-parts > li { padding: 12px 14px; font-size: .9rem; line-height: 1.4; }
  body.cell-art-page[data-page-frame] #weekly-reports .report-parts strong { font-size: 1rem; line-height: 1.3; }
  body.cell-art-page[data-page-frame] #weekly-reports .report-example { font-size: .85rem; line-height: 1.4; }
  body.cell-art-page[data-page-frame] #weekly-reports .report-purpose { margin-top: 0; padding-top: 6px; }
  body.cell-art-page[data-page-frame] #where-we-teach .teaching-formats { flex: 1 0 auto; }
  body.cell-art-page[data-page-frame] #where-we-teach .teaching-format-photo { height: clamp(165px, 25vh, 225px); }
  body.cell-art-page[data-page-frame] #where-we-teach .teaching-format-body { flex: 0 0 auto; padding: 14px 16px; }
  body.cell-art-page[data-page-frame] #where-we-teach .teaching-format p { margin-bottom: 8px; font-size: .95rem; line-height: 1.4; }
  body.cell-art-page[data-page-frame] #where-we-teach .teaching-format-link { margin-top: 2px; }
  body.cell-art-page[data-page-frame] #send-support .send-points,
  body.cell-art-page[data-page-frame] #english-for-work .adult-topics--work { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-auto-rows: 1fr; }
  body.cell-art-page[data-page-frame] #send-support .picture-cell-media,
  body.cell-art-page[data-page-frame] #english-for-work .picture-cell-media { min-height: 138px; }
  /* Text-only cards use natural rows and compact padding rather than inflated tracks. */
  body.cell-art-page[data-page-frame] .framework-panels :is(.learning-subject-grid:not(.send-points), .learning-languages, .ielts-tutors, .ielts-methods) { grid-auto-rows: auto; align-items: start; gap: 12px; }
  body.cell-art-page[data-page-frame] .framework-panels .subject-card:not(.picture-cell) { padding: 14px; }
  body.cell-art-page[data-page-frame] #qualifications .ielts-section-head h2 { font-size: clamp(1.5rem, 3.5vh, 1.9rem); }
  body.cell-art-page[data-page-frame] #qualifications .ielts-art { width: 230px; }
  body.cell-art-page[data-page-frame] #qualifications :is(.ielts-tutors, .ielts-methods) { margin-block: 12px; }
}
@media screen and (min-width: 1000px) and (max-width: 1320px) {
  body.cell-art-page[data-page-frame] #main { grid-template-columns: 260px minmax(0, 1fr); column-gap: 24px; }
}
@media screen and (min-width: 1100px) {
  /* Four short adult goals fit best in one row, with a broad picture band. */
  body.cell-art-page[data-page-frame] #english-for-work .adult-topics--work { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  body.cell-art-page[data-page-frame] #english-for-work .adult-topics--work > .picture-cell { grid-template-columns: minmax(0, 1fr); }
  body.cell-art-page[data-page-frame] #english-for-work .picture-cell-media { min-height: 0; height: clamp(100px, 16vh, 144px); border-radius: 15px 15px 0 0; }
  body.cell-art-page[data-page-frame] #english-for-work .picture-cell-copy { align-self: start; padding: 12px; }
  body.cell-art-page[data-page-frame] #english-for-work .adult-topics--work h3 { font-size: 1rem; line-height: 1.25; margin-bottom: 6px; }
  body.cell-art-page[data-page-frame] #english-for-work .adult-topics--work p { font-size: .9rem; }
}
@media (max-width: 759px) {
  body.cell-art-page .framework-panels { padding: 16px; }
  body.cell-art-page .framework-panels :is(.learning-steps, .send-points, .adult-topics--work) { grid-template-columns: minmax(0, 1fr); grid-auto-rows: auto; gap: 16px; }
  body.cell-art-page .framework-panels .picture-cell,
  body.cell-art-page #send-support .send-points > .picture-cell,
  body.cell-art-page #english-for-work .adult-topics--work > .picture-cell { grid-template-columns: minmax(0, 1fr); }
  body.cell-art-page .framework-panels .picture-cell-media { min-height: 0; aspect-ratio: 8 / 5; border-radius: 15px 15px 0 0; }
  body.cell-art-page .framework-panels .picture-cell-copy { padding: 16px; }
  body.cell-art-page #our-lessons .lesson-example-head,
  body.cell-art-page #weekly-reports .section-head { grid-template-columns: minmax(0, 1fr); gap: 14px; }
  body.cell-art-page #our-lessons .lesson-example-head img,
  body.cell-art-page #weekly-reports .section-head > .framework-panel-art { grid-column: 1; grid-row: 1; width: 100%; height: auto; aspect-ratio: 8 / 5; }
  body.cell-art-page #weekly-reports .section-head > :is(h2, p) { grid-column: 1; margin: 0; }
  body.cell-art-page #qualifications .qualification-art { height: auto; aspect-ratio: 8 / 5; }
}
/* Children: keep each explanation centred beside its illustration, including
   narrow phones. Equal rows and shared padding give all four steps one frame. */
body.cell-art-page #getting-started .learning-steps { grid-auto-rows: 1fr; }
body.cell-art-page #getting-started .picture-cell { grid-template-columns: 38% minmax(0, 1fr); }
body.cell-art-page #getting-started .picture-cell-media { min-height: 130px; aspect-ratio: auto; border-radius: 15px 0 0 15px; }
body.cell-art-page #getting-started .picture-cell-copy { align-self: center; padding: 14px; }
@media (max-width: 759px) {
  body.cell-art-page #getting-started .picture-cell-copy { padding: 12px; }
}
/* Owner phone review, 1 Nov: let each step fit its own copy, without spare rows. */
@media (max-width: 767px) {
  body.cell-art-page #getting-started > .section-head { margin-bottom: 12px; }
  body.cell-art-page #getting-started > .section-head h2 { margin: 0 0 8px; }
  body.cell-art-page #getting-started > .section-head p { margin: 0; }
  body.cell-art-page #getting-started .learning-steps { grid-auto-rows: auto; gap: 12px; margin-block: 12px; }
  body.cell-art-page #getting-started .picture-cell-media { min-height: 0; }
  body.cell-art-page #getting-started .picture-cell-copy { padding: 10px; }
  body.cell-art-page #getting-started .learning-steps h3 { margin-bottom: 6px; }
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) body.cell-art-page #english-for-work .adult-topics--work > article,
  :root:not([data-theme="light"]) body.cell-art-page #qualifications .qualification-cards > article { --heading: #f5f0e6; --ink: #f5f0e6; --line: rgba(245, 240, 230, .25); --orange-text: #ffb486; background: #204653; color: var(--ink); }
}
:root[data-theme="dark"] body.cell-art-page #english-for-work .adult-topics--work > article,
:root[data-theme="dark"] body.cell-art-page #qualifications .qualification-cards > article { --heading: #f5f0e6; --ink: #f5f0e6; --line: rgba(245, 240, 230, .25); --orange-text: #ffb486; background: #204653; color: var(--ink); }
@media print {
  body.cell-art-page .framework-panels .picture-cell { break-inside: avoid; }
  body.cell-art-page .framework-panels .picture-cell-media { min-height: 130px; }
}

/* Approach: shared sky subheaders and compact, evenly aligned teaching cards.
   All selectors stay inside the three requested panels. */
body.cell-art-page.approach-page .framework-panels :is(#steps-to-success, #our-lessons, #weekly-reports, #where-we-teach) .approach-swash {
  padding: 12px 16px;
  border-radius: 14px;
  color: #fff8ea;
  background: var(--sky-tint),
    #361329 url("assets/loading-pixel-sky.png") var(--sky-pos, center) / cover;
  box-shadow: inset 0 0 0 1px #e9bcd33d;
}
body.cell-art-page.approach-page #steps-to-success .picture-cell {
  --heading: #153e38;
  --ink: #193c36;
  --orange-text: #914021;
  color: var(--ink);
  background: #d6e4d7;
}
body.cell-art-page.approach-page #steps-to-success .picture-cell-media {
  margin: 10px 0 10px 10px;
  border-radius: 12px;
}
body.cell-art-page.approach-page #steps-to-success .picture-cell-copy { align-self: center; }
body.cell-art-page.approach-page .approach-panel-cta { margin-top: 16px; }
body.cell-art-page.approach-page .approach-panel-cta .button {
  max-width: 100%;
  min-height: 44px;
  text-align: center;
  line-height: 1.3;
}
body.cell-art-page.approach-page #weekly-reports #reports-heading {
  font-size: clamp(2.25rem, 5.8vh, 3rem);
  line-height: 1.08;
}
body.cell-art-page.approach-page #weekly-reports .report-parts {
  align-items: stretch;
  grid-auto-rows: 1fr;
}
body.cell-art-page.approach-page #weekly-reports .report-parts > li {
  display: grid;
  grid-template-rows: minmax(2.6em, auto) minmax(4.2em, auto) 1fr;
  row-gap: 8px;
}
body.cell-art-page.approach-page #weekly-reports .report-parts strong {
  margin: 0;
  color: #4c1130;
}
body.cell-art-page.approach-page #weekly-reports .report-example { margin-top: 0; }
@supports (grid-template-rows: subgrid) {
  body.cell-art-page.approach-page #weekly-reports .report-parts { grid-auto-rows: auto; }
  body.cell-art-page.approach-page #weekly-reports .report-parts > li {
    grid-row: span 3;
    grid-template-rows: subgrid;
  }
}
@media screen and (min-width: 1000px) {
  body.cell-art-page.approach-page[data-page-frame] #our-lessons:not([hidden]) {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    grid-template-rows: auto 1fr auto;
    gap: 12px 16px;
  }
  body.cell-art-page.approach-page[data-page-frame] #our-lessons > .section-head { grid-column: 1 / -1; margin: 0; }
  body.cell-art-page.approach-page[data-page-frame] #our-lessons > .approach-lesson-page { grid-column: 1 / -1; grid-row: 2; }
  body.cell-art-page.approach-page[data-page-frame] #our-lessons #a-session { display: flex; flex-direction: column; }
  body.cell-art-page.approach-page[data-page-frame] #our-lessons .lesson-stage-grid { flex: 1 0 auto; }
  body.cell-art-page.approach-page[data-page-frame] #our-lessons .lesson-stage-grid > .picture-cell {
    grid-template-rows: minmax(clamp(95px, 16vh, 144px), 1fr) auto;
  }
  body.cell-art-page.approach-page[data-page-frame] #our-lessons .lesson-stage-grid .picture-cell-media { height: clamp(120px, 27vh, 210px); }
  body.cell-art-page.approach-page[data-page-frame] #our-lessons .framework-page-controls {
    grid-column: 2; grid-row: 3; align-self: center; margin: 0; padding: 0; gap: 12px;
  }
  body.cell-art-page.approach-page[data-page-frame] #our-lessons > .approach-panel-cta { grid-column: 1; grid-row: 3; margin: 0; }
  body.cell-art-page.approach-page[data-page-frame] #steps-to-success .learning-steps { align-content: stretch; }
  body.cell-art-page.approach-page[data-page-frame] #steps-to-success > .approach-panel-cta { margin-top: auto; padding-top: 4px; }
  body.cell-art-page.approach-page[data-page-frame] .framework-panels .approach-swash { margin-block: 0 10px; }
  body.cell-art-page.approach-page[data-page-frame] #weekly-reports .section-head { grid-template-columns: minmax(0, 1fr) 26%; gap: 12px 20px; }
  body.cell-art-page.approach-page[data-page-frame] #weekly-reports .section-head > .framework-panel-art { height: 120px; }
  body.cell-art-page.approach-page[data-page-frame] #weekly-reports .report-intro { margin: 0; }
  body.cell-art-page.approach-page[data-page-frame] #weekly-reports .report-parts { flex: 1 0 auto; }
  body.cell-art-page.approach-page[data-page-frame] #weekly-reports .report-purpose { margin-top: 0; padding-top: 4px; }
  body.cell-art-page.approach-page[data-page-frame] #weekly-reports .approach-panel-cta { margin-top: 10px; }
  /* Natural measurement must not inherit the stretched grid's spare height. */
  body.cell-art-page.approach-page[data-page-frame] .framework-panels.is-measuring #our-lessons .lesson-stage-grid,
  body.cell-art-page.approach-page[data-page-frame] .framework-panels.is-measuring #weekly-reports .report-parts { flex: none; }
}
@media (max-width: 759px) {
  body.cell-art-page.approach-page #steps-to-success .picture-cell-media { margin: 10px 10px 0; }
  body.cell-art-page.approach-page .approach-panel-cta .button { width: 100%; }
}
@media (max-width: 560px) {
  /* In one column, equal outer rows keep all four report cards the same size. */
  body.cell-art-page.approach-page #weekly-reports .report-parts { grid-auto-rows: 1fr; }
  body.cell-art-page.approach-page #weekly-reports .report-parts > li {
    grid-row: auto;
    grid-template-rows: minmax(3.6em, auto) minmax(4.5em, auto) 1fr;
  }
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) body.cell-art-page.approach-page #weekly-reports .report-parts strong { color: #f1bfd8; }
}
:root[data-theme="dark"] body.cell-art-page.approach-page #weekly-reports .report-parts strong { color: #f1bfd8; }
/* Owner, 29 Oct: the swash and the cells under it are windows onto one shared
   pixel sky, so together they read as a single crop. The framed page doesn't
   scroll on laptops, so the sky can sit fixed to the window. */
@media screen and (min-width: 1000px) {
  body.cell-art-page.approach-page[data-page-frame] :is(#our-lessons, #steps-to-success) :is(.approach-swash, .picture-cell),
  body.cell-art-page.approach-page[data-page-frame] #where-we-teach .approach-swash {
    --heading: #fff8ea;
    --ink: #f3e9df;
    --orange-text: #f2b48c;
    color: var(--ink);
    background: var(--sky-tint) fixed, #361329 url("assets/loading-pixel-sky.png") var(--sky-pos, center) / cover fixed;
    box-shadow: inset 0 0 0 1px #e9bcd33d;
  }
  body.cell-art-page.approach-page[data-page-frame] #our-lessons .lesson-stage-grid .picture-cell-media { margin: 8px 8px 0; border-radius: 10px; background: #f0e9db; overflow: hidden; }
  body.cell-art-page.approach-page[data-page-frame] :is(#our-lessons, #steps-to-success) .picture-cell :is(h3, h4) { color: var(--heading); }
}
/* Owner, 29 Oct: each panel title sits in its own cell over the same sky as the
   swash beneath it, so title and swash read as one crop. */
body.cell-art-page.approach-page .framework-panels :is(#steps-to-success, #our-lessons, #weekly-reports, #where-we-teach) .section-head > h2 {
  margin-bottom: 6px;
  padding: 4px 14px;
  border-radius: 14px;
  color: #fff8ea;
  background: var(--sky-tint), #361329 url("assets/loading-pixel-sky.png") var(--sky-pos, center) / cover;
  box-shadow: inset 0 0 0 1px #e9bcd33d;
}
@media screen and (min-width: 1000px) {
  body.cell-art-page.approach-page[data-page-frame] .framework-panels :is(#steps-to-success, #our-lessons, #weekly-reports, #where-we-teach) .section-head > h2,
  body.cell-art-page.approach-page[data-page-frame] .framework-panels :is(#weekly-reports) .approach-swash {
    background: var(--sky-tint) fixed, #361329 url("assets/loading-pixel-sky.png") var(--sky-pos, center) / cover fixed;
  }
}
/* Owner, 29 Oct: Our lessons takes Getting started's neater 2x2 layout, art left and copy right. */
@media screen and (min-width: 1000px) {
  body.cell-art-page.approach-page[data-page-frame] #our-lessons .lesson-stage-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-auto-rows: 1fr; }
  body.cell-art-page.approach-page[data-page-frame] #our-lessons .lesson-stage-grid > .picture-cell { display: grid; grid-template-columns: 38% minmax(0, 1fr); grid-template-rows: minmax(0, 1fr); }
  body.cell-art-page.approach-page[data-page-frame] #our-lessons .lesson-stage-grid .picture-cell-media { grid-area: 1 / 1; height: auto; min-height: 110px; margin: 10px 0 10px 10px; border-radius: 12px; }
  body.cell-art-page.approach-page[data-page-frame] #our-lessons .lesson-stage-grid .picture-cell-copy { grid-area: 1 / 2; align-self: center; padding: 12px; }
}
/* Owner, 29 Oct: one sky tint, darker at night, and each panel takes its own part of the sky. */
body.cell-art-page.approach-page { --sky-tint: linear-gradient(120deg, #361329ed, #49234bc9 55%, #103f4de6); }
body.cell-art-page.approach-page #steps-to-success { --sky-pos: 12% 18%; }
body.cell-art-page.approach-page #our-lessons { --sky-pos: 82% 30%; }
body.cell-art-page.approach-page #weekly-reports { --sky-pos: 30% 88%; }
body.cell-art-page.approach-page #where-we-teach { --sky-pos: 92% 78%; }
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) body.cell-art-page.approach-page { --sky-tint: linear-gradient(120deg, #1c0915f4, #2a1230e6 55%, #072630f0); }
}
:root[data-theme="dark"] body.cell-art-page.approach-page { --sky-tint: linear-gradient(120deg, #1c0915f4, #2a1230e6 55%, #072630f0); }
/* At night the report cards turn blue and keep the plum headers of his report emails. */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) body.cell-art-page.approach-page #weekly-reports .report-parts > li { color: #12303a; background: #cfdee7; }
  :root:not([data-theme="light"]) body.cell-art-page.approach-page #weekly-reports .report-parts strong { color: #4c1130; }
}
:root[data-theme="dark"] body.cell-art-page.approach-page #weekly-reports .report-parts > li { color: #12303a; background: #cfdee7; }
:root[data-theme="dark"] body.cell-art-page.approach-page #weekly-reports .report-parts strong { color: #4c1130; }
:root[data-theme="dark"] .learning-page .framework-shell .approach-report .report-example { color: #294c59; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .learning-page .framework-shell .approach-report .report-example { color: #294c59; } }
/* Short laptops (1280x720): the tallest panels ran a few pixels off screen; trim the frame's own padding. */
@media screen and (min-width: 1000px) and (max-height: 740px) {
  body.cell-art-page[data-page-frame] .framework-panels { padding-block: 10px; }
}
/* Owner, 30 Oct: the Children exams panel gained a CTA; slightly shorter art keeps it on one laptop screen. */
@media (min-width: 760px) { body.children-page.cell-art-page #qualifications .qualification-art { height: clamp(120px, 20vh, 225px); } }