/* Exercise book chrome for the secondary pages (application, check, results,
   callback, terms, legal, sample plan). These pages keep the production
   components in math.css; this file carries the paper, the type, the header
   and footer, the buttons and the cards, so the whole site reads as one book.
   Loaded after math.css, only when the production theme is "workbook". */
[data-theme="workbook"] {
  --paper: #faf9f5;
  --white: #fff;
  --ink: #1e222a;
  --muted: #555b67;
  --line: #dbe0e9;
  --rule: #eaeef4;
  --accent: #c62f2a;
  --pen: #c62f2a;
  --pen-deep: #a3211d;
  --wash: #fff6da;
  --highlight-edge: #ecd9a4;
  --cover: #1f2a44;
  --cover-deep: #161e33;
  --grid: rgba(38, 67, 120, 0.085);
  --sheet: rgba(255, 255, 255, 0.58);
  --display: "Bricolage Grotesque", "Helvetica Neue", Arial, sans-serif;
  --body: "Public Sans", Helvetica, Arial, sans-serif;
  --hand: "Kalam", cursive;
  --max: 1200px;
  --cell: 26px;
  --card: 0 1px 2px rgba(25, 36, 60, 0.05), 0 24px 44px -32px rgba(25, 36, 60, 0.5);
}
[data-theme="workbook"] body {
  font-size: 17px;
  line-height: 1.62;
  background-color: var(--paper);
  background-image: linear-gradient(var(--grid) 1px, transparent 1px), linear-gradient(90deg, var(--grid) 1px, transparent 1px);
  background-size: var(--cell) var(--cell);
}
[data-theme="workbook"] h1,
[data-theme="workbook"] h2,
[data-theme="workbook"] h3 {
  font-weight: 600;
  letter-spacing: -0.025em;
}
[data-theme="workbook"] h1 {
  font-size: clamp(38px, 4.4vw, 62px);
  line-height: 1.02;
  font-weight: 700;
  letter-spacing: -0.033em;
}
[data-theme="workbook"] h2 {
  font-size: clamp(28px, 3vw, 42px);
  line-height: 1.07;
}
[data-theme="workbook"] h3 {
  font-size: clamp(20px, 1.5vw, 23px);
  line-height: 1.22;
}
[data-theme="workbook"] p {
  margin-bottom: 1.15em;
}
[data-theme="workbook"] .small {
  font-size: 14.5px;
  line-height: 1.55;
}
[data-theme="workbook"] .sample-label {
  font-size: 11px;
  letter-spacing: 0.1em;
  color: #7b8190;
}

/* The page column: one sheet of paper beside a red margin rule */
[data-theme="workbook"] main {
  position: relative;
  max-width: var(--max);
  margin: 0 auto;
  background: var(--sheet);
  box-shadow: 0 0 0 1px rgba(31, 42, 68, 0.045), 0 30px 80px -60px rgba(31, 42, 68, 0.5);
  padding-bottom: 20px;
}
[data-theme="workbook"] main::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: clamp(12px, 2.4vw, 40px);
  width: 2px;
  background: #e6aca9;
  pointer-events: none;
}

/* Cover boards */
[data-theme="workbook"] .site-header.cover {
  max-width: none;
  min-height: 0;
  padding: 20px var(--pad);
  background: var(--cover);
  color: #fff;
  border-bottom: 5px solid var(--cover-deep);
}
[data-theme="workbook"] .site-header .brand {
  font-size: 23px;
  font-weight: 700;
  letter-spacing: -0.02em;
  gap: 12px;
  color: #fff;
}
[data-theme="workbook"] .site-header .brand svg {
  width: 30px;
  height: 34px;
  stroke: #e6aca9;
  stroke-width: 1.5;
}
[data-theme="workbook"] .site-header nav {
  font-size: 14.5px;
  color: #dbe0ec;
}
[data-theme="workbook"] .site-header nav a:hover {
  color: #fff;
}
[data-theme="workbook"] .nav-apply {
  color: #fff;
  background: var(--pen);
  border: 0;
  border-radius: 4px;
  padding: 10px 16px;
  font-weight: 600;
}
[data-theme="workbook"] .nav-apply:hover {
  background: var(--pen-deep);
  color: #fff;
}
[data-theme="workbook"] .nav-apply span {
  margin-left: 8px;
}
[data-theme="workbook"] .menu-toggle {
  color: #fff;
  border-color: #4a5573;
  border-radius: 4px;
}
[data-theme="workbook"] .preview-bar {
  background: var(--cover-deep);
  color: #c9d0e2;
}
[data-theme="workbook"] .preview-bar a {
  color: #fff;
}
[data-theme="workbook"] .site-footer.cover {
  max-width: none;
  display: grid;
  grid-template-columns: 1.3fr 2fr;
  gap: 36px;
  padding: 56px var(--pad) 22px;
  background: var(--cover);
  color: #d5dbea;
  border-top: 5px solid var(--cover-deep);
}
[data-theme="workbook"] .site-footer nav {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px 30px;
  font-size: 13.5px;
}
[data-theme="workbook"] .site-footer nav a {
  color: #fff;
  text-decoration: none;
  overflow-wrap: anywhere;
}
[data-theme="workbook"] .brand-plain {
  font-family: var(--display);
  font-weight: 700;
  font-size: 24px;
  color: #fff;
}
[data-theme="workbook"] .site-footer p {
  color: #c9d0e2;
  font-size: 13.5px;
  margin-top: 12px;
}
[data-theme="workbook"] .footer-bottom {
  grid-column: 1 / -1;
  border-top: 1px solid #3b4766;
  padding-top: 20px;
  color: #c9d0e2;
  font-size: 12.5px;
}

/* Buttons that carry weight */
[data-theme="workbook"] .button {
  padding: 17px 24px;
  gap: 22px;
  font-size: 15.5px;
  font-weight: 600;
  background: var(--ink);
  border-color: var(--ink);
  color: #fff;
  border-radius: 5px;
  box-shadow: 0 12px 24px -16px rgba(25, 36, 60, 0.9);
  transition: background 0.16s ease, border-color 0.16s ease, transform 0.16s ease, box-shadow 0.16s ease;
}
[data-theme="workbook"] .button:hover {
  background: #2f3542;
  border-color: #2f3542;
  color: #fff;
  transform: translateY(-2px);
}
[data-theme="workbook"] .button[data-apply],
[data-theme="workbook"] button.button[type="submit"] {
  background: var(--pen);
  border-color: var(--pen);
  color: #fff;
  box-shadow: 0 12px 26px -14px rgba(198, 47, 42, 0.85);
}
[data-theme="workbook"] .button[data-apply]:hover,
[data-theme="workbook"] button.button[type="submit"]:hover {
  background: var(--pen-deep);
  border-color: var(--pen-deep);
}
[data-theme="workbook"] .button-quiet {
  background: transparent;
  color: var(--ink);
  border: 0;
  border-bottom: 2px solid var(--pen);
  border-radius: 0;
  padding: 8px 0;
  box-shadow: none;
  font-size: 15px;
}
[data-theme="workbook"] .button-quiet:hover {
  background: transparent;
  color: var(--pen);
  transform: none;
}
[data-theme="workbook"] .text-button {
  font-size: 15px;
}

/* Page intro */
[data-theme="workbook"] .page-intro {
  padding: 60px var(--pad) 36px;
}
[data-theme="workbook"] .eyebrow {
  font-family: var(--hand);
  font-size: 20px;
  text-transform: none;
  letter-spacing: 0;
  color: var(--pen);
  margin-bottom: 14px;
}
[data-theme="workbook"] .page-intro h1 {
  font-size: clamp(36px, 4.2vw, 58px);
}
[data-theme="workbook"] .page-intro > p {
  font-size: 19px;
  max-width: 62ch;
  margin-top: 18px;
}

/* Long copy */
[data-theme="workbook"] .terms-copy,
[data-theme="workbook"] .form-page {
  max-width: 880px;
  margin: 0 auto;
  padding: 0 var(--pad) 70px;
}
[data-theme="workbook"] .terms-copy h2 {
  margin: 44px 0 14px;
}
[data-theme="workbook"] .terms-copy h3 {
  font-size: 24px;
  margin: 36px 0 12px;
}
[data-theme="workbook"] .terms-copy li {
  margin-bottom: 8px;
}

/* Forms as worksheets */
[data-theme="workbook"] .application-form,
[data-theme="workbook"] .check-intro-layout form,
[data-theme="workbook"] #callback-form,
[data-theme="workbook"] #qualified-calendar,
[data-theme="workbook"] .result-calendar form {
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: 8px;
  box-shadow: var(--card);
  padding: clamp(22px, 3vw, 34px);
}
[data-theme="workbook"] .application-layout {
  gap: 48px;
}
[data-theme="workbook"] .application-offer {
  padding: 26px 28px;
  background: var(--wash);
  border: 1px solid var(--highlight-edge);
  border-left: 4px solid var(--pen);
  border-radius: 6px;
  align-self: start;
}
[data-theme="workbook"] .application-offer h3 {
  font-size: 21px;
  margin: 18px 0 10px;
}
[data-theme="workbook"] .application-offer p {
  font-size: 15.5px;
}
[data-theme="workbook"] .application-offer a {
  font-weight: 600;
  text-decoration: none;
  border-bottom: 2px solid var(--pen);
}
[data-theme="workbook"] .field {
  font-size: 14.5px;
  font-weight: 600;
  margin-bottom: 22px;
}
[data-theme="workbook"] .field input,
[data-theme="workbook"] .field select,
[data-theme="workbook"] .field textarea,
[data-theme="workbook"] .link-box input {
  border: 1px solid var(--line);
  border-radius: 5px;
  background: #fbfcfe;
  padding: 12px 13px;
  font-size: 16px;
  font-weight: 400;
  color: var(--ink);
}
[data-theme="workbook"] .field input:focus,
[data-theme="workbook"] .field select:focus,
[data-theme="workbook"] .field textarea:focus {
  border-color: var(--ink);
  background: #fff;
}
[data-theme="workbook"] legend {
  font-size: 15px;
  font-weight: 600;
}
[data-theme="workbook"] .choice {
  font-size: 15.5px;
  border-bottom-color: var(--rule);
}
[data-theme="workbook"] .choice input,
[data-theme="workbook"] .question-choices input {
  accent-color: var(--pen);
}
[data-theme="workbook"] .form-status:not(:empty) {
  border-radius: 6px;
  background: var(--wash);
  border-color: var(--highlight-edge);
  font-size: 15px;
}
[data-theme="workbook"] .group-error {
  color: var(--pen);
}
[data-theme="workbook"] .topic-list li {
  font-size: 15.5px;
  border-bottom-color: var(--rule);
}
[data-theme="workbook"] .check-intro-layout h2 {
  font-size: clamp(26px, 2.6vw, 34px);
}

/* Calendar */
[data-theme="workbook"] .calendar h2 {
  font-size: clamp(24px, 2.4vw, 30px);
}
[data-theme="workbook"] .calendar-heading > p {
  font-size: 14.5px;
}
[data-theme="workbook"] .calendar-days button,
[data-theme="workbook"] .calendar-times button {
  border-radius: 6px;
  background: #fbfcfe;
  font-size: 13.5px;
  transition: background 0.16s ease, border-color 0.16s ease;
}
[data-theme="workbook"] .calendar-days button:hover,
[data-theme="workbook"] .calendar-times button:hover {
  border-color: var(--ink);
  background: #fff;
}
[data-theme="workbook"] .calendar-days button strong {
  font-family: var(--hand);
  font-size: 26px;
  color: var(--pen);
}
[data-theme="workbook"] .calendar-days button[aria-pressed="true"],
[data-theme="workbook"] .calendar-times button[aria-pressed="true"] {
  background: var(--ink);
  color: #fff;
  border-color: var(--ink);
}
[data-theme="workbook"] .calendar-days button[aria-pressed="true"] strong {
  color: #fff;
}

/* The check itself */
[data-theme="workbook"] .check-workspace {
  padding-top: 50px;
}
[data-theme="workbook"] .check-workspace h1 {
  font-size: clamp(34px, 4vw, 52px);
}
[data-theme="workbook"] .check-workspace h2 {
  font-size: clamp(24px, 2.6vw, 32px);
}
[data-theme="workbook"] .check-progress {
  font-size: 13.5px;
  color: var(--muted);
}
[data-theme="workbook"] .check-track span {
  background: var(--pen);
}
[data-theme="workbook"] .question-title {
  font-size: clamp(26px, 3vw, 36px);
  font-weight: 600;
  letter-spacing: -0.02em;
}
[data-theme="workbook"] .question-choices label {
  border-radius: 6px;
  font-family: var(--hand);
  font-size: 22px;
  box-shadow: var(--card);
}
[data-theme="workbook"] .question-choices label:nth-last-child(-n + 2) {
  font-family: var(--body);
  font-size: 14.5px;
}
[data-theme="workbook"] .question-choices label:has(input:checked) {
  background: var(--wash);
  border-color: var(--pen);
}
[data-theme="workbook"] .child-result,
[data-theme="workbook"] .link-box {
  border-radius: 8px;
}
[data-theme="workbook"] .child-result {
  background: var(--white);
  box-shadow: var(--card);
}
[data-theme="workbook"] .result-summary {
  font-size: 19px;
}

/* Results for the parent */
[data-theme="workbook"] .results-page h1 {
  font-size: clamp(36px, 4.4vw, 58px);
}
[data-theme="workbook"] .results-page > h2 {
  font-size: clamp(26px, 2.8vw, 34px);
}
[data-theme="workbook"] .result-topic {
  border-top-color: var(--rule);
}
[data-theme="workbook"] .result-topic h2 {
  font-size: 24px;
}
[data-theme="workbook"] .result-topic p {
  font-size: 15.5px;
}
[data-theme="workbook"] .counts {
  font-size: 13.5px;
}
[data-theme="workbook"] .result-bars {
  border-radius: 3px;
  overflow: hidden;
  background: var(--rule);
}
[data-theme="workbook"] .result-bars i {
  background: var(--ink);
}
[data-theme="workbook"] .result-bars i:nth-child(2) {
  background: #e8a33c;
}
[data-theme="workbook"] .result-bars i:nth-child(3) {
  background: #b9c0cc;
}
[data-theme="workbook"] .result-offer,
[data-theme="workbook"] .result-calendar {
  border-top-color: var(--rule);
}

/* Sample plan */
[data-theme="workbook"] .sample-plan {
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: 8px;
  box-shadow: var(--card);
  padding: clamp(24px, 3.4vw, 44px);
  margin-bottom: 70px;
}
[data-theme="workbook"] .sample-plan dt {
  font-weight: 600;
}

/* Design study index */
[data-theme="workbook"] .design-card {
  background: var(--white);
  border-radius: 8px;
  box-shadow: var(--card);
}

@media (max-width: 760px) {
  [data-theme="workbook"] .site-footer.cover {
    grid-template-columns: 1fr;
  }
  [data-theme="workbook"] main::before {
    display: none;
  }
  [data-theme="workbook"] body {
    font-size: 16px;
  }
}
@media print {
  [data-theme="workbook"] body {
    background: #fff;
  }
  [data-theme="workbook"] main {
    background: #fff;
    box-shadow: none;
  }
  [data-theme="workbook"] main::before {
    display: none;
  }
}
