/* ============================================================================
   AOA TEST CENTER — INTAKE: "File Your Plan"

   Faithful port of Chris's Claude Design file (File Your Plan.dc.html). Tokens,
   type roles, .btn-primary all reuse verbatim. This file rebuilds the design's
   visual language in the app shell: a 680px column, the four-question card with
   progress dots (4th dashed = optional), day-pills, radio choices with a filled
   dot, the "Your plan so far" commitment card (--orange left-rail), the calm
   feasibility verdict, and the "Your plan is filed." landing.
   ========================================================================== */

/* The design's main column is 680px (narrower than the 760px .tc-main shell). */
.intake { position: relative; max-width: 680px; margin: 0 auto; }

.intake-head { margin-bottom: clamp(14px, 3vw, 18px); }
.intake-head h1 {
  font-family: var(--font-display); font-weight: 600;
  font-size: clamp(1.6rem, 4.5vw, 2.25rem); color: var(--ink);
  line-height: 1.05; letter-spacing: 0.005em; margin: 0 0 var(--s-3);
}
.intake-head p { margin: 0; font-size: 0.97rem; line-height: 1.6; color: var(--body-text); max-width: 54ch; text-wrap: pretty; }
.intake-loadnote { margin-top: var(--s-3) !important; font-size: 0.84rem !important; color: var(--muted) !important; }

/* The design renders every small-caps eyebrow/meta/unit label in JetBrains Mono
   — that mono signature is the screen's typographic voice. The global .t-label
   class is Oswald (--font-display), so the intake labels that mirror the design's
   mono labels must restore --font-mono (these rules load after .t-label, so they
   win). Faithfulness fix from the design-fidelity panel. */
.intake-card__n, .intake-card__opt, .intake-daypills__unit,
.intake-pp__head, .intake-fp__head, .intake-verdict__label,
.intake-filed__eyebrow, .intake-followup .t-label { font-family: var(--font-mono); }

/* Wizard + filed both enter on the calm rise (design = 0.5s). */
.intake-wizard, .intake-filed { animation: intake-rise 0.5s var(--ease-cinematic) both; }
@keyframes intake-rise { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }

/* ── Progress dots — 4 buttons; earlier dots jump BACK (answers preserved),
   current/future carry aria-disabled. 4th is the dashed "optional" ring. ── */
.intake-progress { margin-bottom: var(--s-4); }
.intake-dots { display: inline-flex; align-items: center; gap: 3px; }
.intake-dot {
  display: inline-flex; align-items: center; justify-content: center;
  width: 24px; height: 24px; padding: 0; border: 0; background: none;
  border-radius: 50%; cursor: default;
}
.intake-dot__pip {
  width: 8px; height: 8px; border-radius: 50%; background: var(--line); box-sizing: border-box;
  transition: background var(--glance) var(--ease-calm), transform var(--glance) var(--ease-calm), border-color var(--glance) var(--ease-calm);
}
.intake-dot.is-now .intake-dot__pip { background: var(--orange); }
.intake-dot.is-done .intake-dot__pip { background: var(--guess); }
.intake-dot:not([aria-disabled]) { cursor: pointer; }
.intake-dot:not([aria-disabled]):hover .intake-dot__pip { background: var(--muted); transform: scale(1.25); }
.intake-dot:focus-visible { outline: none; box-shadow: var(--focus-ring); }
/* Optional 4th — hollow dashed ring until reached. */
.intake-dot--opt .intake-dot__pip { background: none; border: 1px dashed var(--guess); width: 8px; height: 8px; }
.intake-dot--opt.is-now .intake-dot__pip { border-color: var(--orange); border-style: solid; }
.intake-dot--opt.is-done .intake-dot__pip { border-color: var(--guess); border-style: solid; background: var(--guess); }
.intake-dot--opt:not([aria-disabled]):hover .intake-dot__pip { background: none; border-color: var(--muted); }

/* ── The question card — one at a time, enters on the rise. ── */
.intake-card {
  border: 1px solid var(--line); border-radius: var(--r-xl);
  background: var(--surface); box-shadow: var(--shadow-card);
  padding: clamp(18px, 3.5vw, 26px);
  opacity: 0; transform: translateY(8px);
}
.intake-card.is-in {
  opacity: 1; transform: none;
  transition: opacity var(--brief) var(--ease-cinematic), transform var(--brief) var(--ease-cinematic);
}
.intake-card__n { color: var(--guess); margin-bottom: 13px; }
.intake-card__nrow { display: flex; align-items: baseline; gap: var(--s-3); margin-bottom: 13px; }
.intake-card__nrow .intake-card__n { margin-bottom: 0; }
.intake-card__opt { color: var(--muted); }
.intake-card__q {
  font-family: var(--font-display); font-weight: 600;
  font-size: clamp(1.3rem, 3.2vw, 1.62rem); color: var(--ink); line-height: 1.2;
  margin: 0 0 var(--s-5);
}

/* Q1 — date + "No date yet" pill + hint. */
.intake-daterow { display: flex; align-items: center; gap: var(--s-3); flex-wrap: wrap; }
.intake-date {
  height: 48px; padding: 0 var(--s-4);
  border: 1px solid var(--line); border-radius: var(--r-md);
  background: var(--paper); color: var(--ink);
  font-family: var(--font-mono); font-size: 0.9rem; cursor: pointer;
}
.intake-date:focus { outline: none; border-color: var(--orange); box-shadow: var(--focus-ring); }
.intake-date:disabled { opacity: 0.4; cursor: default; }
.intake-or { font-family: var(--font-mono); font-size: 0.7rem; color: var(--muted); text-transform: uppercase; letter-spacing: 0.1em; }
.intake-nodate {
  display: inline-flex; align-items: center; height: 48px; padding: 0 18px;
  border-radius: 999px; cursor: pointer;
  font-family: var(--font-display); font-weight: 600; font-size: 0.78rem;
  text-transform: uppercase; letter-spacing: 0.06em;
  border: 1px solid var(--line); background: var(--surface); color: var(--body-text);
  transition: all var(--glance) var(--ease-calm);
}
.intake-nodate:hover { border-color: var(--orange); }
.intake-nodate[aria-pressed="true"] { border-color: var(--orange); background: var(--orange-soft); color: var(--orange-text, #b8500a); }
.intake-nodate:focus-visible { outline: none; box-shadow: var(--focus-ring); }
.intake-hint { margin: 18px 0 0; font-size: 0.84rem; line-height: 1.5; color: var(--muted); max-width: 52ch; }

/* Q2 — honesty subtitle, day-pills 1–7, unit caption. */
.intake-honesty { margin: 0 0 var(--s-5); font-size: 0.84rem; line-height: 1.55; color: var(--muted); max-width: 54ch; }
.intake-daypills { display: flex; flex-wrap: wrap; gap: 10px; }
.intake-daypill {
  min-width: 54px; height: 50px;
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: var(--r-md); cursor: pointer;
  font-family: var(--font-display); font-weight: 600; font-size: 1.06rem;
  border: 1px solid var(--line); background: var(--paper); color: var(--ink);
  transition: all var(--glance) var(--ease-calm);
}
.intake-daypill:hover { border-color: var(--orange); }
.intake-daypill[aria-pressed="true"] { border-color: var(--orange); background: var(--orange-soft); color: var(--orange-text, #b8500a); box-shadow: var(--focus-ring); }
.intake-daypill:focus-visible { outline: none; box-shadow: var(--focus-ring); }
.intake-daypills__unit { color: var(--muted); margin-top: var(--s-3); }

/* Q3/Q4 — full-width radio choices with a filled dot. */
.intake-choices { display: flex; flex-direction: column; gap: 10px; }
.intake-choice {
  display: flex; align-items: center; gap: 13px; width: 100%; min-height: 56px;
  padding: 13px 18px; text-align: left;
  border: 1px solid var(--line); border-radius: var(--r-md);
  background: var(--paper); cursor: pointer;
  font-family: var(--font-body); font-size: 0.95rem; color: var(--ink);
  transition: border-color var(--glance) var(--ease-calm), background var(--glance) var(--ease-calm);
}
.intake-choice:hover { border-color: var(--orange); }
.intake-choice.is-selected { border-color: var(--orange); background: var(--orange-soft); box-shadow: var(--focus-ring); }
.intake-choice:focus-visible { outline: none; box-shadow: var(--focus-ring); }
.intake-choice__dot {
  flex: none; width: 18px; height: 18px; border-radius: 50%;
  background: var(--surface); border: 2px solid var(--line);
  transition: border var(--glance) var(--ease-calm);
}
.intake-choice.is-selected .intake-choice__dot { border: 6px solid var(--orange); }
.intake-choice__label { flex: 1; }

/* Q3 conditional — last written score. */
.intake-followup { margin-top: 18px; animation: intake-rise 0.3s var(--ease-cinematic) both; }
.intake-followup[hidden] { display: none; }
.intake-followup .t-label { display: block; margin-bottom: var(--s-2); color: var(--guess); }
.intake-opt { color: var(--muted); text-transform: none; letter-spacing: 0; }
.intake-scorerow { display: flex; align-items: center; gap: 10px; }
.intake-scoreinput {
  width: 120px; height: 46px; padding: 0 var(--s-4);
  border: 1px solid var(--line); border-radius: var(--r-md);
  background: var(--paper); color: var(--ink);
  font-family: var(--font-mono); font-size: 0.95rem;
}
.intake-scoreinput:focus { outline: none; border-color: var(--orange); box-shadow: var(--focus-ring); }
.intake-scorepct { font-family: var(--font-mono); font-size: 0.95rem; color: var(--body-text); }

/* ── "Your plan so far" / "Flight Plan" — the commitment card (--orange rail).
   Row styles are shared by both the wizard preview and the filed summary. ── */
.intake-pp, .intake-fp {
  margin-top: var(--s-4); padding: var(--s-4) var(--s-5);
  border: 1px solid var(--line); border-left: 3px solid var(--orange);
  border-radius: var(--r-lg); background: var(--surface);
}
.intake-fp { box-shadow: var(--shadow-card); }
.intake-pp__head, .intake-fp__head { display: block; color: var(--orange-text, #b8500a); margin-bottom: var(--s-3); }
.intake-pp__rows, .intake-fp__rows { display: flex; flex-direction: column; gap: 10px; }
.intake-pp__row { display: flex; align-items: baseline; gap: 12px; }
.intake-pp__label {
  flex: none; width: 110px; font-family: var(--font-mono);
  font-size: 0.66rem; letter-spacing: 0.08em; text-transform: uppercase; color: var(--guess);
}
.intake-pp__val { font-size: 0.92rem; color: var(--ink); font-weight: 500; }

/* ── Feasibility verdict — calm card under the honesty eyebrow. ── */
.intake-verdict {
  margin-top: var(--s-3); padding: var(--s-4) var(--s-5);
  border: 1px solid var(--line); border-left: 3px solid var(--caution);
  border-radius: var(--r-lg); background: var(--paper);
}
.intake-verdict__label { display: block; color: var(--muted); margin-bottom: var(--s-2); }
.intake-verdict p { margin: 0; font-size: 0.9rem; line-height: 1.55; color: var(--body-text); }
/* Tone follows the verdict (design): a comfortable plan reads on-track in
   orange (matching the plan card); a tight/closing/lapsed one stays amber.
   Never red — the honesty moat's pace rule. */
.intake-verdict--amber { border-left-color: var(--caution); }
.intake-verdict--orange { border-left-color: var(--orange); }

/* "Learn more about ground school" — Chris's add on Q4. Quiet orange-text link,
   opens AOA's ground school in a new tab so the wizard isn't lost. */
.intake-gslink {
  display: inline-flex; align-items: center; gap: 6px; margin-top: var(--s-4);
  font-family: var(--font-mono); font-size: 0.78rem; letter-spacing: 0.01em;
  color: var(--orange-text, #b8500a); text-decoration: none;
}
.intake-gslink:hover { text-decoration: underline; text-underline-offset: 3px; }
.intake-gslink:focus-visible { outline: 2px solid var(--orange); outline-offset: 2px; border-radius: 4px; }
.intake-gslink svg { flex: none; }

/* Save-retry — calm --caution, never --error. */
.intake-savenote { margin: var(--s-4) 0 0; font-size: 0.9rem; line-height: 1.5; }
.intake-savenote.is-caution { color: var(--caution); }
.intake-savenote[hidden] { display: none; }

/* The never-stranded door under a failed save. */
.intake-nosave {
  display: block; margin-top: var(--s-3); background: none; border: 0; cursor: pointer; padding: 4px 0;
  font-family: var(--font-mono); font-size: 0.78rem; color: var(--muted);
  text-decoration: underline; text-underline-offset: 3px;
}
.intake-nosave:hover { color: var(--orange-text, #b8500a); }
.intake-nosave[hidden] { display: none; }

/* ── Nav — Back + the one orange primary (Continue / File My Plan). ── */
.intake-nav { display: flex; align-items: center; justify-content: space-between; gap: var(--s-4); margin-top: clamp(16px, 3vw, 22px); }
.intake-next { margin-left: auto; }
/* The GLOBAL .btn-primary[disabled] rule (test-center-system.css) is opacity:0
   — for the question card's reveal choreography. On the intake nav that hid the
   button entirely = a stranding. Scoped override: visible-but-inert. */
.intake-nav .btn-primary[disabled] { opacity: 0.4; pointer-events: none; }
.intake-nav .btn-primary[aria-busy="true"] { opacity: 0.7; }
.intake-back {
  background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-md);
  min-height: 48px; padding: 0 var(--s-5); cursor: pointer;
  font-family: var(--font-display); font-weight: 600; font-size: 0.8rem;
  text-transform: uppercase; letter-spacing: 0.06em; color: var(--ink);
  transition: border-color var(--glance) var(--ease-calm);
}
.intake-back:hover:not(:disabled) { border-color: var(--orange); }
.intake-back:disabled { opacity: 0.35; cursor: default; }

/* ── Skip row — "Skip for now · answers save as you go". ── */
.intake-skiprow { display: flex; align-items: center; justify-content: center; gap: 7px; margin-top: var(--s-4); }
.intake-skip {
  background: none; border: 0; cursor: pointer; padding: 6px 0;
  font-family: var(--font-mono); font-size: 0.78rem; letter-spacing: 0.02em; color: var(--guess); white-space: nowrap;
}
.intake-skip:hover { color: var(--orange-text, #b8500a); }
.intake-skip:focus-visible { outline: 2px solid var(--orange); outline-offset: 2px; }
.intake-skiprow__dot { font-family: var(--font-mono); font-size: 0.72rem; color: var(--line); }
.intake-skiprow__note { font-family: var(--font-mono); font-size: 0.7rem; color: var(--muted); }

.intake-demonote { margin: var(--s-4) 0 0; font-family: var(--font-mono); font-size: 0.74rem; color: var(--muted); text-align: center; }

/* ── "Your plan is filed." landing. ── */
.intake-filed { padding-top: var(--s-2); text-align: left; }
.intake-filed__check {
  display: inline-flex; align-items: center; justify-content: center;
  width: 46px; height: 46px; border-radius: 50%; margin-bottom: 18px;
  background: var(--success-soft, rgba(44, 122, 75, 0.10));
  border: 1px solid var(--success-line, rgba(44, 122, 75, 0.3));
  color: var(--success);
}
.intake-filed__eyebrow { display: block; color: var(--orange-text, #b8500a); letter-spacing: 0.22em; margin-bottom: 11px; }
.intake-filed__h1 {
  font-family: var(--font-display); font-weight: 600;
  font-size: clamp(1.6rem, 4.5vw, 2.25rem); color: var(--ink); line-height: 1.05; margin: 0 0 var(--s-3);
}
.intake-filed__sub { margin: 0; font-size: 0.97rem; line-height: 1.6; color: var(--body-text); max-width: 52ch; text-wrap: pretty; }
.intake-filed .intake-fp { margin-top: var(--s-5); }
.intake-filed .intake-verdict { margin-top: var(--s-3); }
.intake-filed .intake-skipnote { margin-top: var(--s-3); font-size: 0.92rem; color: var(--body-text); }
.intake-filed .intake-skipnote b { color: var(--ink); }
.intake-filed__cta { display: flex; align-items: center; gap: var(--s-3); flex-wrap: wrap; margin-top: var(--s-6, 24px); }
.intake-edit {
  background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-md);
  min-height: 50px; padding: 0 var(--s-5); cursor: pointer;
  font-family: var(--font-display); font-weight: 600; font-size: 0.8rem;
  text-transform: uppercase; letter-spacing: 0.06em; color: var(--ink);
  transition: border-color var(--glance) var(--ease-calm);
}
.intake-edit:hover { border-color: var(--orange); }
.intake-edit:focus-visible { outline: none; box-shadow: var(--focus-ring); }

@media (prefers-reduced-motion: reduce) {
  .intake-wizard, .intake-filed, .intake-followup { animation: none; }
  .intake-card, .intake-card.is-in { opacity: 1; transform: none; transition: none; }
}