/* Curriculum mapping onto the shared Elite PM chrome (shared/harness.css). Loaded last. */
@import url('../shared/harness.css');

:root:not([data-theme="light"]) {
  --ink: var(--hx-text);
  --muted: var(--hx-muted);
  --paper: var(--hx-bg);
  --surface: var(--hx-surface);
  --indigo: var(--hx-raised);
  --indigo-dark: var(--hx-bg);
  --saffron: var(--hx-accent);
  --mint: #1f3a31;
  --line: var(--hx-line);
  --line-strong: var(--hx-line-strong);
}

body {
  color: var(--hx-text);
  background: var(--hx-bg);
  font-family: var(--hx-sans);
}
:focus-visible { outline-color: var(--hx-accent); }

/* ---------- Shell + rail ---------- */
.shell { grid-template-columns: var(--hx-rail) minmax(0, 1fr); }
.rail {
  top: var(--hx-top);
  height: calc(100vh - var(--hx-top));
  padding: 24px 14px;
  background: var(--hx-bg);
  border-right: 1px solid var(--hx-line);
}
.rail-head { align-items: center; margin-bottom: 8px; }
.rail-head .hx-rail-title { margin: 0; }
.rail-links { display: none; }
.progress-card { margin: 0 0 18px; background: var(--hx-surface); border-color: var(--hx-line); }
.progress-head { color: var(--hx-muted); }
.progress-head strong { color: var(--hx-text); }
.progress-track { background: var(--hx-line); }
.progress-fill { background: var(--hx-accent); }
.phase-label { margin: 18px 16px 6px; color: var(--hx-muted); font: 650 .72rem/1.3 var(--hx-sans); letter-spacing: .08em; text-transform: uppercase; }
.day-button {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 14px;
  width: 100%;
  min-height: 0;
  padding: 11px 16px;
  color: var(--hx-soft);
  background: none;
  border: 0;
  border-radius: 10px;
  font: 500 .95rem/1.45 var(--hx-sans);
  text-align: left;
}
.day-button:hover:not(:disabled) { background: var(--hx-raised); }
.day-button[aria-current="page"],
.day-button.active { color: var(--hx-accent); background: var(--hx-raised); box-shadow: none; }
.day-button.is-locked { color: var(--hx-muted); opacity: .55; }
.day-number { display: none; }
.day-name { font: inherit; color: inherit; }
.day-state { color: var(--hx-accent); }
.rail-foot { margin: 18px 16px 0; color: var(--hx-muted); }

/* ---------- Article ---------- */
.workspace { min-width: 0; }
main { width: 100%; margin: 0; padding: 0 0 72px; }
.lesson-hero { grid-template-columns: minmax(0, 1fr); gap: 28px; max-width: 820px; margin-bottom: 24px; padding: 72px 0 36px; color: var(--hx-text); background: none; border: 0; }
.lesson-hero h1 { color: var(--hx-title); font: 500 clamp(2.6rem, 4.6vw, 4.2rem)/1.08 var(--hx-serif); letter-spacing: -.02em; }
.eyebrow { color: var(--hx-accent); }
.deck { color: var(--hx-soft); font: 400 1.15rem/1.7 var(--hx-sans); }
.pill { color: var(--hx-muted); background: var(--hx-surface); border-color: var(--hx-line); }
.lesson-content,
.content-grid { padding-left: 0; padding-right: 0; }
.content-grid { grid-template-columns: minmax(0, 1fr); gap: 0; max-width: 760px; }
.article section { padding-top: 40px; border-top: 1px solid var(--hx-line); }
.article h2 { color: var(--hx-text); font-family: var(--hx-serif); font-weight: 500; }
.article h3 { color: var(--hx-text); font-family: var(--hx-serif); font-weight: 500; }
.article p,
.article li { color: var(--hx-soft); font-family: var(--hx-sans); }
.article strong { color: var(--hx-text); }
.article a { color: var(--hx-accent); }
.article blockquote { color: var(--hx-text); border-color: var(--hx-accent); }
.article pre,
.article code { color: var(--hx-text); background: var(--hx-surface); border-color: var(--hx-line); }

.callout,
.concept-card,
.exercise,
.quiz,
.roadmap-card,
.aside-card,
.decision-dial,
.loop-step,
.choice,
.mini {
  color: var(--hx-text);
  background: var(--hx-surface);
  border-color: var(--hx-line);
  box-shadow: none;
}
.concept-card.system,
.concept-card.ai { background: var(--hx-raised); }
.decision-table th,
.article th { color: var(--hx-text); background: var(--hx-raised); }
.decision-table td,
.article td { color: var(--hx-soft); border-color: var(--hx-line); }
textarea {
  color: var(--hx-text);
  background: var(--hx-surface);
  border: 1px solid var(--hx-line);
  border-radius: 10px;
}
.save-state,
.source-note,
.response-label { color: var(--hx-muted); }

/* Former right-hand "at a glance" cards now sit under the article. */
.lesson-aside {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 12px;
  position: static;
  margin: 8px 0 48px;
  padding: 0;
  border: 0;
}
.aside-card { padding: 18px; border: 1px solid var(--hx-line); border-radius: 12px; }
.aside-card:first-child { padding-top: 18px; }
.aside-card h3 { color: var(--hx-text); font-family: var(--hx-serif); font-weight: 500; }

.lesson-footer { border-color: var(--hx-line); }
.next-button,
.save-answer { color: var(--hx-bg); background: var(--hx-text); border-color: var(--hx-text); border-radius: 999px; }
.toast { color: var(--hx-bg); background: var(--hx-text); }
.hx-top .hx-slot-end > button.secondary-button { color: var(--hx-text); background: transparent; border-color: var(--hx-line); }

@media (max-width: 560px) {
  .hx-top .hx-slot-end > button.secondary-button { display: none; }
}

@media (max-width: 1180px) {
  .lesson-hero { padding-top: 40px; }
}

/* Curriculum's drawer breakpoint matches the other tracks: 900px (see curriculum.js). */
@media (min-width: 901px) {
  .hx-top .hx-menu { display: none; }
}

@media (max-width: 1020px) {
  .shell { grid-template-columns: 264px minmax(0, 1fr); }
}

@media (max-width: 900px) {
  .shell { display: block; }
  .rail { position: fixed; top: 0; height: 100dvh; z-index: 150; }
  main { padding: 0; }
  .lesson-hero { padding: 28px 0 24px; }
  .lesson-hero h1 { font-size: clamp(2.3rem, 10vw, 3.2rem); }
  .lesson-aside { display: grid; }
}