:root {
  color-scheme: light;
  --steel: #3a4046;
  --red: #b51f28;
  --black: #101214;
  --paper: #f8f7f2;
  --fog: #d8dade;
  --muted: #52575b;
}

* { box-sizing: border-box; }
html { scroll-padding-top: 24px; }
body { margin: 0; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif; font-size: 18px; }
h1, h2, h3, p, figure { margin: 0; }
a { color: inherit; text-underline-offset: 5px; text-decoration-thickness: 1.5px; }
button, input, textarea, select { font: inherit; }
main:focus { outline: none; }
::selection { color: var(--paper); background: var(--red); }

.bg-steel { background-color: var(--steel); }
.bg-red { background-color: var(--red); }
.bg-black { background-color: var(--black); }
.bg-paper { background-color: var(--paper); }
.ink-paper { color: var(--paper); }
.ink-black { color: var(--black); }
.ink-red { color: var(--red); }
.ink-fog { color: var(--fog); }
.ink-muted { color: var(--muted); }
.text-base { font-size: 1rem; }
.text-body { font-size: 1.125rem; }
.text-brand { font-size: 1.75rem; }
.text-lead { font-size: 1.6rem; }
.text-hero { font-size: clamp(3rem, 5.85vw, 5.3rem); }
.text-workbook { font-size: clamp(3rem, 5.5vw, 5rem); }
.text-section { font-size: clamp(2rem, 2.8vw, 2.7rem); }
.text-subhead { font-size: 1.5rem; }
.text-question { font-size: 1.4rem; }
.weight-bold { font-weight: 650; }
.weight-heavy { font-weight: 800; }
.leading-tight { line-height: 1.04; }
.leading-snug { line-height: 1.3; }
.leading-body { line-height: 1.65; }
.tracking-tight { letter-spacing: -0.045em; }
.tracking-wide { letter-spacing: 0.075em; }
.uppercase { text-transform: uppercase; }
.underline { text-decoration: underline; }
.no-underline { text-decoration: none; }
.measure { max-width: 64ch; }
.title-measure { max-width: 18ch; }
.bound { width: min(100% - 80px, 1232px); margin-inline: auto; }
.grid { display: grid; }
.flex { display: flex; }
.inline-flex { display: inline-flex; }
.wrap { flex-wrap: wrap; }
.align-center { align-items: center; }
.align-start { align-items: start; }
.content-start { align-content: start; }
.justify-between { justify-content: space-between; }
.question-columns { grid-template-columns: 1fr 1fr; }
.hero-columns { grid-template-columns: minmax(0, 1.3fr) minmax(0, 0.9fr); }
.reading-columns { grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr); }
.next-columns { grid-template-columns: minmax(0, 1fr) minmax(0, 0.55fr); }
.gap-sm { gap: 10px; }
.gap-md { gap: 18px; }
.gap-lg { gap: 26px; }
.gap-xl { gap: 52px; }
.pad-block-xl { padding-block: 76px; }
.pad-block-lg { padding-block: 40px; }
.pad-top-sm { padding-top: 8px; }
.pad-top-lg { padding-top: 28px; }
.pad-bottom-lg { padding-bottom: 30px; }
.pad-left-lg { padding-left: 24px; }
.pad-tab { padding: 20px 26px; }
.pad-action { padding: 15px 22px; }
.pad-jump { padding: 12px 16px; }
.min-target { min-height: 44px; }
.fit-content { width: fit-content; }
.margin-zero { margin: 0; }
.border-top-steel { border-top: 1px solid var(--steel); }
.border-bottom-paper { border-bottom: 2px solid var(--paper); }
.border-paper { border: 1px solid var(--paper); }
.border-left-red { border-left: 5px solid var(--red); }
.border-red-thick { border: 4px solid var(--red); }
.relative { position: relative; }
.absolute { position: absolute; }
.isolate { isolation: isolate; }
.drawing-height { height: 390px; }
.left-zero { left: 0; }
.right-zero { right: 0; }
.bottom-zero { bottom: 0; }
.left-twelve { left: 12%; }
.left-sixteen { left: 16%; }
.left-twenty-eight { left: 28%; }
.right-six { right: 6%; }
.top-six { top: 6%; }
.top-twenty { top: 20%; }
.top-twenty-eight { top: 28%; }
.top-forty { top: 40%; }
.top-forty-two { top: 42%; }
.top-fifty-four { top: 54%; }
.top-fifty-six { top: 56%; }
.top-sixty-eight { top: 68%; }
.top-seventy { top: 70%; }
.bottom-eight { bottom: 8%; }
.width-full { width: 100%; }
.width-nine { width: 9%; }
.width-thirty { width: 30%; }
.width-forty { width: 40%; }
.width-fifty-six { width: 56%; }
.width-sixty-six { width: 66%; }
.width-seventy-six { width: 76%; }
.width-eighty { width: 80%; }
.height-three { height: 3%; }
.height-five { height: 5%; }
.height-eight { height: 8%; }
.height-twenty-eight { height: 28%; }
.height-forty-two { height: 42%; }
.height-eighty { height: 80%; }
.plane-cut { clip-path: polygon(0 24%, 83% 0, 100% 71%, 16% 100%); }
.block-cut { clip-path: polygon(20% 0, 100% 14%, 83% 100%, 0 86%); }
.stamp-cut { clip-path: polygon(0 13%, 85% 0, 100% 86%, 15% 100%); }
.check-cut { clip-path: polygon(0 47%, 18% 29%, 39% 53%, 86% 0, 100% 17%, 41% 100%); }
.rotate-left { transform: rotate(-8deg); }
.hard-shadow { box-shadow: 13px 16px 0 var(--black); }
.brand-mark { width: 21px; height: 27px; transform: skew(-14deg); }
.ruled-space { height: 74px; background: repeating-linear-gradient(to bottom, transparent 0, transparent 35px, #73777b 35px, #73777b 36px); }
.focus-ring:focus-visible { outline: 3px solid currentColor; outline-offset: 5px; }
.tab-rest:hover { background-color: var(--black); }
.action-hover:hover { background-color: #8f1720; }
.next-hover:hover { background-color: var(--black); }
.jump-hover:hover { background-color: var(--black); }
.skip-link { position: absolute; left: 20px; top: -120px; z-index: 10; min-height: 44px; display: flex; align-items: center; padding: 14px 20px; color: var(--black); background: var(--paper); font-size: 18px; }
.skip-link:focus { top: 12px; }

@media (max-width: 850px) {
  .bound { width: calc(100% - 44px); }
  .hero-columns { grid-template-columns: minmax(0, 1fr); }
  .reading-columns { grid-template-columns: minmax(0, 1fr); }
  .next-columns { grid-template-columns: minmax(0, 1fr); }
  .gap-xl { gap: 34px; }
  .pad-block-xl { padding-block: 48px; }
  .pad-tab { padding: 16px; }
  .drawing-height { height: 330px; }
}

@media (max-width: 450px) {
  .question-columns { grid-template-columns: minmax(0, 1fr); }
  .pad-tab { padding: 17px 18px; }
  .text-hero { font-size: 2.95rem; }
  .text-workbook { font-size: 3rem; }
  .text-lead { font-size: 1.4rem; }
  .pad-top-lg { padding-top: 24px; }
  .pad-bottom-lg { padding-bottom: 20px; }
}

@media print {
  :root { --steel: #000; --red: #000; --black: #000; --paper: #fff; --fog: #000; --muted: #000; }
  body { font-size: 12pt; }
  header nav, main > section nav, .skip-link, figure, footer nav { display: none; }
  .bg-steel, .bg-red, .bg-black { background: #fff; }
  .ink-paper { color: #000; }
  .bound { width: 100%; }
  .reading-columns, .next-columns, .hero-columns { grid-template-columns: minmax(0, 1fr); }
  .pad-block-xl { padding-block: 20pt; }
  .pad-block-lg { padding-block: 14pt; }
  .gap-xl { gap: 14pt; }
  .text-hero, .text-workbook { font-size: 30pt; }
  .text-section { font-size: 23pt; }
  a { overflow-wrap: anywhere; }
  h2, h3 { break-after: avoid; }
  p, .ruled-space { break-inside: avoid; }
  .ruled-space { background: none; border-bottom: 1px solid #000; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
}
