:root {
  /* Ported from the public site so portal and marketing read as one product.
     Variable names are unchanged - only their values move. */
  --navy: #0A1B33;          /* ink */
  --navy-2: #0F2748;        /* raised navy surface */
  --teal: #8A6A28;          /* ACCENT FOR TEXT. Deliberately darker than brass:
                               #C9A355 on white is ~2.1:1 and fails WCAG AA for
                               small text. This tone clears 5:1. */
  --teal-light: #F4EBD8;    /* warm accent tint */
  --gold: #C9A355;          /* brass - rules, marks, large text, on-dark text */
  --cream: #F7F4EC;         /* vellum */
  --paper: #ffffff;
  --ink: #1B2430;
  --muted: #5A6A7C;
  --line: #D8DFE6;
  --danger: #8C2F39;        /* red pen */
  --shadow: 0 18px 50px rgba(10,31,54,.11);
  --radius: 4px;
  --brass-bright: #DBB86A;  /* brass on dark grounds */
  --ease: cubic-bezier(.22,.61,.36,1);
}

/* Native PMC Classroom and Practice */
.announcement-list { margin: 1.25rem 0; display: grid; gap: .8rem; }
.announcement-list article, .resource-grid article, .practice-card-grid article, .practice-admin-list > article { border: 1px solid var(--line); border-radius: 16px; padding: 1rem; background: #fff; }
.resource-grid, .practice-card-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 1rem; }
.resource-shelf, .classroom-columns, .practice-admin-list { margin-top: 1.25rem; }
.practice-admin-list { display: grid; gap: 1rem; }
.practice-meta { display: flex; flex-wrap: wrap; gap: .45rem; margin: .9rem 0; }
.practice-meta span { border-radius: 999px; background: var(--teal-light); color: var(--navy); padding: .3rem .55rem; font-size: .82rem; font-weight: 700; }
.back-link { display: inline-block; margin-bottom: 1rem; }
.result-banner { display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.practice-form { display: grid; gap: 1rem; }
.practice-question { position: relative; padding-left: 5rem; }
.question-number { position: absolute; left: 1rem; top: 1rem; display: grid; justify-items: center; gap: .25rem; }
.question-number span { width: 2.5rem; height: 2.5rem; display: grid; place-items: center; border-radius: 50%; background: var(--navy); color: #fff; font-weight: 800; }
.choice-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: .65rem; margin: 1rem 0; }
.choice { border: 1px solid var(--line); border-radius: 12px; padding: .75rem; display: flex; align-items: center; gap: .55rem; cursor: pointer; }
.choice:has(input:checked) { border-color: var(--teal); background: var(--teal-light); }
.hint { border-top: 1px solid var(--line); padding: .7rem 0 0; margin-top: .7rem; }
.hint summary { color: var(--teal); font-weight: 750; cursor: pointer; }
.worked-review { margin-top: 1rem; padding: .85rem; border-radius: 12px; }
.worked-review.correct { background: #edf9f2; border: 1px solid #b8e0c8; }
.worked-review.needs-work { background: #fff7e8; border: 1px solid #f1d29c; }
.practice-submit { justify-self: end; min-width: 220px; }
@media (max-width: 680px) { .practice-question { padding-left: 1rem; padding-top: 4.5rem; } .result-banner { align-items: flex-start; flex-direction: column; } }
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; color: var(--ink); background: #f6f8f8; font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; line-height: 1.58; }
a { color: inherit; text-decoration: none; }
button, input, textarea, select { font: inherit; }
button { cursor: pointer; }
h1, h2, h3, p { margin-top: 0; }
h1, h2, h3 { color: var(--navy); line-height: 1.12; letter-spacing: -.025em; }
h1 { font-family: Georgia, "Times New Roman", serif; font-size: clamp(2.65rem, 6vw, 5.7rem); font-weight: 500; }
h2 { font-family: Georgia, "Times New Roman", serif; font-size: clamp(2rem, 4vw, 3.3rem); font-weight: 500; }
h3 { font-size: 1.05rem; }
.skip-link { position: absolute; left: -9999px; top: 8px; z-index: 100; background: #fff; padding: 10px; }
.skip-link:focus { left: 8px; }
.site-header { min-height: 76px; padding: 14px clamp(20px,5vw,72px); display: flex; align-items: center; justify-content: space-between; gap: 24px; background: rgba(255,255,255,.96); border-bottom: 1px solid var(--line); position: sticky; top: 0; z-index: 20; }
.brand { display: flex; align-items: center; gap: 11px; color: var(--navy); }
.brand-logo { width: 56px; height: 56px; display: block; border-radius: 50%; object-fit: cover; box-shadow: 0 3px 12px rgba(11,31,54,.14); }
.brand-mark { width: 42px; height: 42px; border-radius: 50%; display: grid; place-items: center; background: var(--navy); color: var(--gold); font-family: Georgia,serif; font-size: 1.5rem; border: 2px solid var(--gold); }
.brand strong,.brand small { display: block; line-height: 1; letter-spacing: .12em; }
.brand strong { font-size: .92rem; }.brand small { font-size: .58rem; margin-top: 5px; }
.site-header nav { display: flex; align-items: center; gap: 24px; font-size: .9rem; font-weight: 650; }
.site-header nav a:not(.nav-button):hover,.link-button:hover { color: var(--teal); }
.inline-form { display: inline; margin: 0; }.link-button { border: 0; background: transparent; color: var(--ink); font-weight: 650; padding: 0; }
.nav-button { background: var(--navy); color: #fff; border-radius: 999px; padding: 11px 18px; }
.flash { max-width: 1180px; margin: 18px auto 0; padding: 14px 18px; border-radius: 10px; font-weight: 650; }
.flash-success { background: #e4f4e8; color: #245b31; }.flash-error { background: #f8e2e2; color: #7b2727; }
.hero { min-height: 740px; padding: clamp(68px,10vw,130px) clamp(20px,6vw,92px); display: grid; grid-template-columns: minmax(0,1.25fr) minmax(340px,.75fr); align-items: center; gap: clamp(50px,8vw,120px); color: #fff; background: radial-gradient(circle at 80% 18%, rgba(8,127,120,.32), transparent 32%), linear-gradient(135deg, #07182b, #102c49 75%); }
.hero h1 { color: #fff; max-width: 850px; margin-bottom: 24px; }.hero h1 em { color: #a9ddd6; font-weight: 400; }
.eyebrow,.kicker { text-transform: uppercase; letter-spacing: .16em; font-size: .74rem; font-weight: 800; color: var(--teal); }
.hero .eyebrow { color: #9fd8d2; }.lede { max-width: 760px; font-size: clamp(1.05rem,2vw,1.3rem); color: #d6e1e9; }
.button-row { display: flex; flex-wrap: wrap; gap: 12px; margin: 32px 0 22px; }.compact-row { margin: 18px 0 10px; }
.button { min-height: 46px; padding: 12px 18px; border-radius: 9px; display: inline-flex; justify-content: center; align-items: center; border: 1px solid transparent; font-weight: 750; transition: transform .15s, box-shadow .15s; }
.button:hover { transform: translateY(-1px); box-shadow: 0 10px 25px rgba(11,31,54,.14); }
.button-primary { color: #fff; background: var(--teal); }.button-secondary { color: var(--navy); border-color: #b9c6cf; background: #fff; }.button-danger { color: #fff; background: var(--danger); }.button[disabled] { opacity: .45; cursor: not-allowed; transform: none; box-shadow: none; }
.full { width: 100%; }.trust-line { color: #aebfce; font-size: .86rem; }
.hero-card { padding: 32px; border: 1px solid rgba(255,255,255,.16); border-radius: 24px; background: rgba(255,255,255,.07); backdrop-filter: blur(15px); box-shadow: 0 25px 70px rgba(0,0,0,.2); }
.card-label { color: #a9ddd6; text-transform: uppercase; font-weight: 800; font-size: .75rem; letter-spacing: .13em; }
.rhythm { list-style: none; padding: 0; margin: 0; }.rhythm li { display: flex; gap: 18px; padding: 19px 0; border-bottom: 1px solid rgba(255,255,255,.13); }.rhythm li:last-child { border: 0; }
.rhythm>li>span { color: var(--gold); font: 1.2rem Georgia,serif; }.rhythm strong,.rhythm small { display: block; }.rhythm strong { color: #fff; }.rhythm small { color: #b8c7d2; margin-top: 4px; }
.principles,.experience,.tuition,.policy-grid { padding: clamp(70px,10vw,130px) clamp(20px,6vw,92px); max-width: 1500px; margin: 0 auto; }
.section-heading { max-width: 900px; margin-bottom: 50px; }.section-heading>p:last-child { color: var(--muted); font-size: 1.12rem; }.section-heading.narrow { max-width: 700px; }
.three-grid,.experience-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 20px; }
.three-grid article,.experience-grid article,.policy-grid article { background: #fff; border: 1px solid var(--line); border-radius: var(--radius); padding: 30px; box-shadow: 0 8px 28px rgba(11,31,54,.05); }
.three-grid .number { color: var(--gold); font: 2rem Georgia,serif; }.three-grid h3 { margin-top: 24px; }.three-grid p,.experience-grid p,.policy-grid p { color: var(--muted); margin-bottom: 0; }
.experience { background: var(--cream); max-width: none; }.experience .section-heading,.experience-grid { max-width: 1316px; margin-left: auto; margin-right: auto; }.experience-grid article { min-height: 210px; }
.privacy-band { padding: clamp(60px,9vw,110px) clamp(20px,6vw,92px); display: grid; grid-template-columns: 1fr 1fr; gap: 80px; color: #dce8ee; background: var(--navy); }.privacy-band h2 { color: #fff; }.privacy-band p { font-size: 1.05rem; }.privacy-band a { color: #9bd5cf; font-weight: 750; }
.tuition { display: grid; grid-template-columns: .8fr 1.2fr; gap: clamp(40px,8vw,110px); align-items: center; }.tuition-card { border-radius: 24px; padding: 42px; background: #fff; box-shadow: var(--shadow); border-top: 5px solid var(--gold); }.price { display: flex; align-items: baseline; gap: 12px; margin-bottom: 12px; }.price strong { font: 3.2rem Georgia,serif; color: var(--navy); }.price span { color: var(--muted); }.check-list { list-style: none; padding: 0; margin: 24px 0; }.check-list li { padding: 9px 0 9px 28px; position: relative; }.check-list li:before { content: "✓"; color: var(--teal); position: absolute; left: 0; font-weight: 900; }
.site-footer { padding: 38px clamp(20px,6vw,92px); display: flex; justify-content: space-between; gap: 30px; background: #071524; color: #c1ced8; }.site-footer strong { color: #fff; }.site-footer p { margin: 8px 0 0; }.footer-links { display: flex; gap: 22px; align-items: center; }
.auth-shell { min-height: calc(100vh - 180px); padding: clamp(60px,10vw,120px) 20px; display: grid; grid-template-columns: minmax(0,580px) minmax(340px,470px); justify-content: center; align-items: center; gap: clamp(50px,9vw,130px); background: linear-gradient(115deg,#f3f7f7,#fff); }.auth-intro h1 { font-size: clamp(3rem,7vw,5rem); }.auth-intro>p { color: var(--muted); font-size: 1.12rem; }.privacy-note { border-left: 4px solid var(--teal); padding: 14px 20px; background: var(--teal-light); border-radius: 0 10px 10px 0; }.privacy-note p { margin: 5px 0 0; }
.auth-card,.stack-form { display: grid; gap: 18px; }.auth-card { padding: 38px; background: #fff; border-radius: 20px; box-shadow: var(--shadow); }.auth-card label,.stack-form label,.question-label { display: grid; gap: 7px; font-weight: 750; color: var(--navy); }.auth-card input,.stack-form input,.stack-form textarea,.stack-form select,.assistant-form textarea { width: 100%; border: 1px solid #b8c4cc; border-radius: 9px; padding: 12px 13px; color: var(--ink); background: #fff; }.auth-card input:focus,.stack-form input:focus,.stack-form textarea:focus,.stack-form select:focus,.assistant-form textarea:focus { outline: 3px solid rgba(8,127,120,.18); border-color: var(--teal); }.form-help { color: var(--muted); font-size: .83rem; margin: 0; }
.page-hero { padding: 100px clamp(20px,8vw,130px); color: #fff; background: var(--navy); }.page-hero h1 { color: #fff; max-width: 1000px; }.page-hero>p:last-child { max-width: 780px; color: #cbd8e1; }.page-hero.compact h1 { font-size: clamp(2.6rem,6vw,4.8rem); }.policy-grid { display: grid; grid-template-columns: repeat(2,1fr); gap: 20px; }
.message-page { min-height: 70vh; max-width: 800px; margin: 0 auto; padding: 120px 20px; text-align: center; }.message-page p:not(.eyebrow) { color: var(--muted); font-size: 1.15rem; }
.portal-shell,.assistant-shell { max-width: 1500px; margin: 0 auto; padding: 52px clamp(18px,4vw,62px) 100px; }.portal-heading,.assistant-top { display: flex; justify-content: space-between; align-items: flex-start; gap: 30px; margin-bottom: 32px; }.portal-heading h1,.assistant-top h1 { font-size: clamp(2.5rem,5vw,4rem); margin: 0; }.secure-badge { padding: 9px 13px; border-radius: 999px; color: #346057; background: #e2f0ed; font-size: .78rem; font-weight: 750; }
.summary-strip { display: grid; grid-template-columns: repeat(3,1fr); margin-bottom: 20px; border-radius: var(--radius); overflow: hidden; background: var(--navy); color: #fff; }.summary-strip div { padding: 24px 28px; border-right: 1px solid rgba(255,255,255,.14); }.summary-strip div:last-child { border: 0; }.summary-strip span,.summary-strip strong { display: block; }.summary-strip span { color: #9fc4c8; font-size: .72rem; letter-spacing: .12em; text-transform: uppercase; }.summary-strip strong { margin-top: 7px; }
.panel { background: #fff; border: 1px solid var(--line); border-radius: var(--radius); padding: 28px; box-shadow: 0 8px 30px rgba(11,31,54,.055); }.portal-grid { display: grid; gap: 20px; margin-bottom: 20px; }.portal-grid.two-one { grid-template-columns: 2fr 1fr; }.portal-grid.equal-grid { grid-template-columns: repeat(2,1fr); }.panel-heading { display: flex; justify-content: space-between; align-items: flex-start; gap: 20px; margin-bottom: 20px; }.panel-heading h2,.panel h2 { font-family: Georgia,serif; font-size: 1.65rem; margin-bottom: 8px; }.panel-heading span { color: var(--muted); font-size: .8rem; }
.goal-list article { display: flex; align-items: flex-start; gap: 14px; padding: 15px 0; border-bottom: 1px solid var(--line); }.goal-list article:last-child { border: 0; }.goal-dot { width: 12px; height: 12px; margin-top: 7px; border-radius: 50%; background: var(--teal); box-shadow: 0 0 0 5px var(--teal-light); }.goal-list small,.goal-list strong { display: block; }.goal-list small { color: var(--teal); font-weight: 750; }.assistant-panel { background: linear-gradient(160deg,#0b2038,#15405a); color: #dce8ed; }.assistant-panel h2 { color: #fff; }.assistant-panel .kicker { color: #9bd5cf; }.status-chip { display: inline-block; padding: 5px 9px; border-radius: 99px; background: var(--teal-light); color: #285e57; font-size: .75rem; font-weight: 750; }.status-chip.muted { background: rgba(255,255,255,.12); color: #d6e2e7; }.status-chip.alert { background: #f7e1d6; color: #8b4524; }
.table-wrap { overflow-x: auto; }table { width: 100%; border-collapse: collapse; font-size: .9rem; }th,td { padding: 13px 12px; border-bottom: 1px solid var(--line); text-align: left; vertical-align: top; }th { color: var(--muted); font-size: .72rem; text-transform: uppercase; letter-spacing: .09em; }.empty { color: var(--muted); font-style: italic; }
.portal-intro { max-width: 760px; margin-bottom: 28px; }.portal-intro h2 { font-size: 2rem; }.portal-intro p { color: var(--muted); }.family-card { margin-bottom: 20px; }.family-columns { display: grid; grid-template-columns: 1fr 1fr; gap: 36px; }.clean-list { list-style: none; padding: 0; }.clean-list li { padding: 12px 0; border-bottom: 1px solid var(--line); }.clean-list strong,.clean-list span { display: block; }.clean-list span { color: var(--muted); margin-top: 3px; }.consent-box { margin-top: 26px; padding: 24px; border-radius: 13px; background: #f4f8f8; border: 1px solid #d7e6e4; }.consent-box h3 { margin-bottom: 6px; }.consent-box p { color: var(--muted); }.consent-status { font-size: .84rem; margin-bottom: 0; }
.tutor-layout { display: grid; grid-template-columns: 310px 1fr; gap: 20px; align-items: start; }.roster { padding: 18px; position: sticky; top: 96px; }.roster nav { display: grid; gap: 5px; }.student-row { display: grid; grid-template-columns: 38px 1fr auto; gap: 11px; align-items: center; padding: 10px; border-radius: 10px; }.student-row:hover,.student-row.active { background: #edf6f4; }.avatar { width: 38px; height: 38px; border-radius: 50%; display: grid; place-items: center; color: #fff; background: var(--teal); font-weight: 850; }.student-row strong,.student-row small { display: block; }.student-row small { color: var(--muted); }.alert-count { width: 23px; height: 23px; display: grid; place-items: center; border-radius: 50%; color: #fff; background: #b65343; font-size: .72rem; }.tutor-main { display: grid; gap: 20px; }.student-header { display: flex; justify-content: space-between; gap: 28px; }.student-header p { color: var(--muted); }.access-control { min-width: 190px; display: grid; align-content: center; gap: 8px; padding-left: 22px; border-left: 1px solid var(--line); font-size: .86rem; }.access-control span,.access-control strong { display: block; }.top-rule { padding-top: 22px; margin-top: 18px; border-top: 1px solid var(--line); }
.assistant-shell { max-width: 1180px; }.assistant-top>div { max-width: 800px; }.assistant-top p { color: var(--muted); }.privacy-reminder { padding: 16px 18px; display: grid; grid-template-columns: max-content 1fr; gap: 16px; border-radius: 10px; color: #684c13; background: #fff4d8; border: 1px solid #efdaa2; margin-bottom: 20px; }.assistant-form { padding: clamp(24px,4vw,42px); border-radius: 20px; background: #fff; border: 1px solid var(--line); box-shadow: var(--shadow); }.assistant-form fieldset { border: 0; padding: 0; margin: 0 0 30px; }.assistant-form legend { margin-bottom: 15px; color: var(--navy); font-weight: 800; }.mode-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 10px; }.mode-grid label { display: block; cursor: pointer; }.mode-grid input { position: absolute; opacity: 0; pointer-events: none; }.mode-grid span { display: block; min-height: 92px; padding: 15px; border: 1px solid #cfd8de; border-radius: 11px; }.mode-grid input:checked+span { border: 2px solid var(--teal); background: #edf8f6; padding: 14px; }.mode-grid strong,.mode-grid small { display: block; }.mode-grid small { color: var(--muted); margin-top: 4px; }.question-label textarea { margin-top: 10px; font-weight: 400; }.submit-row { display: flex; align-items: center; justify-content: space-between; gap: 25px; margin-top: 22px; }.submit-row p { max-width: 600px; margin: 0; color: var(--muted); font-size: .83rem; }.assistant-response { margin-bottom: 20px; padding: 30px; border-radius: 18px; color: #fff; background: linear-gradient(135deg,var(--teal),#075e68); box-shadow: var(--shadow); }.assistant-response h2 { color: #fff; }.response-label { text-transform: uppercase; letter-spacing: .13em; font-size: .72rem; font-weight: 850; color: #c7ece7; }.follow-up { padding: 14px; border-radius: 9px; background: rgba(255,255,255,.13); }.escalation { margin: 15px 0 0; color: #fff1c2; }.locked-card { text-align: center; padding: 70px 30px; border-radius: 20px; background: #fff; box-shadow: var(--shadow); }.locked-card p { max-width: 650px; margin: 0 auto 25px; color: var(--muted); }.lock-icon { color: var(--gold); font-size: 2rem; }
.method-list { display: grid; gap: 14px; }.method-list article { padding: 20px; border: 1px solid var(--line); border-radius: 12px; background: #fbfcfc; }.method-list p { color: var(--muted); }.method-title { display: flex; align-items: flex-start; justify-content: space-between; gap: 15px; }.method-title h3 { margin-bottom: 10px; }
.page-subtitle,.privacy-copy { color: var(--muted); }.page-subtitle { max-width: 760px; margin: 12px 0 0; }
.learning-chart { margin-bottom: 20px; border-top: 4px solid var(--gold); }.chart-grid,.topic-map,.session-grid { display: grid; gap: 14px; }.chart-grid { grid-template-columns: repeat(4,1fr); }.chart-grid article,.topic-map article,.session-grid article { padding: 18px; border-radius: 12px; background: #f6f9f9; border: 1px solid #e1e8e8; }.chart-grid small,.chart-grid strong,.chart-grid span,.topic-map small,.topic-map strong,.topic-map span,.session-grid small { display: block; }.chart-grid small,.topic-map small,.session-grid small { color: var(--teal); text-transform: uppercase; letter-spacing: .08em; font-size: .68rem; font-weight: 850; }.chart-grid strong,.topic-map strong { margin: 7px 0; color: var(--navy); }.chart-grid span,.topic-map span { color: var(--muted); font-size: .87rem; }
.form-pair { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }.check-label { grid-template-columns: max-content 1fr!important; align-items: start; gap: 10px!important; color: var(--ink)!important; font-weight: 600!important; font-size: .87rem; }.check-label input { width: auto!important; margin-top: 4px; }.upload-form { margin-top: 24px; }.feed-history .clean-list p,.family-learning-feed .clean-list p { margin: 8px 0 0; color: var(--ink); font-size: .88rem; }.small-link { color: var(--teal); font-size: .84rem; font-weight: 750; }.clean-list .small-link { display: inline-block; margin-top: 6px; }.weekly-plan-card { margin-bottom: 20px; }.session-grid { grid-template-columns: repeat(3,1fr); }.session-grid p { margin: 8px 0 0; }.family-learning-feed { display: grid; grid-template-columns: 1fr 1fr; gap: 34px; margin-top: 28px; padding-top: 26px; border-top: 1px solid var(--line); }.compact-upload { padding: 20px; border-radius: 12px; background: #f7f9f9; }.weekly-family { margin-top: 28px; padding-top: 24px; border-top: 1px solid var(--line); }
.weekly-map { margin-bottom: 20px; }.topic-map { grid-template-columns: repeat(auto-fit,minmax(210px,1fr)); }.feed-review-list { display: grid; gap: 18px; }.feed-review-item { padding: 22px; border: 1px solid var(--line); border-radius: 13px; background: #fbfcfc; }.feed-review-summary,.resource-heading,.resource-actions { display: flex; justify-content: space-between; align-items: flex-start; gap: 18px; }.feed-review-summary small,.resource-heading small { color: var(--teal); font-size: .72rem; font-weight: 800; text-transform: uppercase; letter-spacing: .07em; }.feed-review-summary h3,.resource-heading h3 { margin: 5px 0 0; }.feed-review-item>p { color: var(--muted); }.feed-meta { font-size: .82rem; }.feed-meta a { color: var(--teal); font-weight: 750; }.feed-review-form { padding-top: 18px; border-top: 1px solid var(--line); }.weekly-plan-editor { border-left: 4px solid var(--teal); }.form-sessions label { display: grid; gap: 8px; }.form-sessions textarea { width: 100%; border: 1px solid #b8c4cc; border-radius: 9px; padding: 12px; resize: vertical; }.support-evidence-editor { padding: 18px 24px; }.support-evidence-editor summary { color: var(--teal); font-weight: 800; cursor: pointer; }.support-evidence-editor form { margin-top: 18px; }
.skill-map-panel { margin-bottom: 20px; border-top: 4px solid var(--teal); }.skill-map-list { display: grid; gap: 12px; }.skill-map-list article { display: grid; grid-template-columns: 1fr auto; gap: 22px; align-items: center; padding: 18px 20px; border: 1px solid var(--line); border-radius: 13px; background: #fbfcfc; }.skill-map-list small { color: var(--teal); font-size: .7rem; font-weight: 850; letter-spacing: .08em; text-transform: uppercase; }.skill-map-list h3 { margin: 5px 0 6px; font-size: 1rem; }.skill-map-list p { margin: 0; color: var(--muted); font-size: .87rem; }.skill-map-list em { display: block; margin-top: 7px; color: var(--muted); font-size: .76rem; font-style: normal; }.mastery-level { min-width: 145px; padding: 8px 11px; border-radius: 999px; text-align: center; font-size: .74rem; font-weight: 850; background: #edf1f3; color: #4b5d68; }.level-foundation_needed { background: #f8e3dd; color: #8b4524; }.level-developing { background: #fff1cf; color: #775718; }.level-secure_with_support { background: #e0f0ed; color: #285e57; }.level-independent { background: #dcecf6; color: #285674; }.level-extension_ready { background: #e8e3f6; color: #56417c; }.level-not_assessed { background: #edf1f3; color: #62717a; }.family-skill-map { margin-top: 28px; padding-top: 24px; border-top: 1px solid var(--line); }.compact-skill-map article { padding: 14px 16px; }.diagnostic-line { margin: 18px 0 0; padding: 14px 16px; border-radius: 10px; background: #f4f8f8; color: var(--muted); font-size: .88rem; }.diagnostic-summary { margin-bottom: 20px; }.skill-map-workspace { display: grid; grid-template-columns: 1.25fr .75fr; gap: 24px; align-items: start; }.evidence-form { padding: 22px; border-radius: 13px; background: #f4f8f8; border: 1px solid #d7e6e4; }.diagnostic-queue { margin-top: 24px; padding-top: 22px; border-top: 1px solid var(--line); }
.diagnostic-workspace { max-width: 1180px; }.diagnostic-form,.diagnostic-review-form { display: grid; gap: 18px; }.diagnostic-intro p:first-child { font-size: 1.05rem; }.diagnostic-item { margin: 0; }.diagnostic-item legend { padding: 0 10px; color: var(--teal); font-size: .76rem; font-weight: 850; letter-spacing: .09em; text-transform: uppercase; }.diagnostic-item h2 { margin-bottom: 22px; }.diagnostic-options { display: grid; grid-template-columns: repeat(2,1fr); gap: 10px; }.diagnostic-options label { cursor: pointer; }.diagnostic-options input { position: absolute; opacity: 0; pointer-events: none; }.diagnostic-options span { display: block; padding: 15px; border: 1px solid #cfd8de; border-radius: 10px; background: #fff; font-weight: 750; }.diagnostic-options input:checked+span { padding: 14px; border: 2px solid var(--teal); background: #edf8f6; }.diagnostic-submit { display: flex; justify-content: space-between; align-items: center; gap: 24px; padding: 20px 24px; border-radius: 14px; color: #fff; background: var(--navy); }.diagnostic-submit p { margin: 0; }.diagnostic-feedback { display: grid; gap: 12px; margin-top: 22px; }.diagnostic-feedback article { padding: 18px; border: 1px solid var(--line); border-radius: 12px; }.diagnostic-feedback small,.diagnostic-feedback strong,.diagnostic-feedback span { display: block; }.diagnostic-feedback small { color: var(--teal); font-weight: 800; }.diagnostic-feedback strong { margin: 7px 0; }.diagnostic-feedback span { color: var(--muted); font-size: .82rem; }.diagnostic-review-heading { display: grid; grid-template-columns: .7fr 1.3fr; gap: 30px; margin-bottom: 18px; border-left: 4px solid var(--gold); }.diagnostic-review-heading p:last-child { color: var(--muted); }.diagnostic-review-item { margin: 0; }.diagnostic-answer-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin: 20px 0; }.diagnostic-answer-grid article { padding: 18px; border-radius: 11px; background: #f6f9f9; border: 1px solid var(--line); }.diagnostic-answer-grid small { color: var(--teal); font-weight: 850; text-transform: uppercase; font-size: .7rem; }.diagnostic-answer-grid p { white-space: pre-wrap; }.diagnostic-answer-grid span { color: var(--muted); font-size: .84rem; }.diagnostic-final-review { display: grid; gap: 18px; }
.diagnostic-governance { display: grid; grid-template-columns: .8fr 1.2fr; gap: 30px; margin-bottom: 20px; border-left: 4px solid var(--teal); }.diagnostic-governance p:last-child { color: var(--muted); }.diagnostic-admin-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; margin-bottom: 20px; }.diagnostic-definition-list { display: grid; gap: 16px; }.diagnostic-definition { padding: 0; }.diagnostic-definition>summary { padding: 22px 26px; display: flex; justify-content: space-between; align-items: center; gap: 24px; cursor: pointer; }.diagnostic-definition summary span,.diagnostic-definition summary small,.diagnostic-definition summary strong,.diagnostic-definition summary em { display: block; }.diagnostic-definition summary small { color: var(--teal); font-size: .72rem; font-weight: 850; text-transform: uppercase; letter-spacing: .07em; }.diagnostic-definition summary strong { margin: 5px 0; font: 1.3rem Georgia,serif; color: var(--navy); }.diagnostic-definition summary em { color: var(--muted); font-size: .8rem; font-style: normal; }.diagnostic-definition-body { padding: 26px; border-top: 1px solid var(--line); }.diagnostic-item-register ol { padding-left: 22px; }.diagnostic-item-register li { padding: 15px 5px; border-bottom: 1px solid var(--line); }.diagnostic-item-register li:last-child { border: 0; }.diagnostic-item-register small,.diagnostic-item-register strong,.diagnostic-item-register span { display: block; }.diagnostic-item-register small { color: var(--teal); font-weight: 750; }.diagnostic-item-register strong { margin: 5px 0; }.diagnostic-item-register span,.diagnostic-item-register p { color: var(--muted); font-size: .84rem; }.diagnostic-item-builder { margin-top: 24px; padding: 24px; border-radius: 13px; background: #f4f8f8; border: 1px solid #d7e6e4; }.publish-diagnostic,.assign-diagnostic { margin-top: 20px; padding: 20px 22px; display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 22px; border-radius: 12px; background: var(--navy); color: #fff; }.publish-diagnostic p,.assign-diagnostic p { margin: 0; color: #cbd8e1; }.assign-diagnostic { grid-template-columns: 1fr minmax(260px,.8fr) auto; }.assign-diagnostic label { display: grid; gap: 7px; font-weight: 750; }.assign-diagnostic select { width: 100%; padding: 11px; border-radius: 9px; }
.resource-list { display: grid; gap: 14px; }.resource-list>article { padding: 22px; border: 1px solid var(--line); border-radius: 13px; background: #fbfcfc; }.resource-list>article>p { color: var(--muted); }.resource-tags { font-size: .86rem; }.resource-actions { align-items: center; font-size: .82rem; color: var(--muted); }.resource-actions a { color: var(--teal); font-weight: 800; }.approval-form { margin-top: 18px; padding-top: 18px; border-top: 1px solid var(--line); display: grid; gap: 14px; }.approval-form label { display: grid; grid-template-columns: max-content 1fr; gap: 10px; align-items: start; font-size: .85rem; }.approval-form input { margin-top: 4px; }
.sensitive-once { margin-bottom: 20px; display: grid; grid-template-columns: 1fr 1.25fr; gap: 24px; border: 2px solid var(--gold); background: #fffaf0; }.sensitive-once input { width: 100%; margin-top: 8px; border: 1px solid #b8c4cc; border-radius: 9px; padding: 12px; background: #fff; }.admin-account-grid { display: grid; grid-template-columns: 2fr 1fr; gap: 20px; margin-bottom: 20px; }.conditional-fields { margin: 0; padding: 20px; border: 1px solid var(--line); border-radius: 12px; }.conditional-fields legend { padding: 0 8px; color: var(--muted); font-size: .82rem; font-weight: 750; }.admin-rules .check-list { margin-top: 15px; }.account-register,.student-administration { margin-bottom: 20px; }.table-subline { display: block; margin-top: 4px; color: var(--muted); }.account-actions { display: flex; flex-wrap: wrap; gap: 10px 14px; }.account-actions form { display: flex; flex-wrap: wrap; gap: 10px; }.danger-link { color: var(--danger); }.student-admin-list { display: grid; gap: 12px; }.student-admin-list details { border: 1px solid var(--line); border-radius: 12px; background: #fbfcfc; }.student-admin-list summary { padding: 18px 20px; display: flex; justify-content: space-between; gap: 20px; cursor: pointer; }.student-admin-list summary span,.student-admin-list summary strong,.student-admin-list summary small { display: block; }.student-admin-list summary small { color: var(--muted); margin-top: 4px; }.student-admin-body { padding: 22px; display: grid; grid-template-columns: 1.3fr .7fr; gap: 28px; border-top: 1px solid var(--line); }.guardian-links h3 { margin-bottom: 12px; }
.release-control { margin-bottom: 20px; display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 30px; border-left: 4px solid var(--danger); }.release-control p { color: var(--muted); }.release-control form { min-width: 230px; padding-left: 24px; border-left: 1px solid var(--line); }
@media (max-width: 980px) { .hero { grid-template-columns: 1fr; }.hero-card { max-width: 650px; }.three-grid,.experience-grid { grid-template-columns: repeat(2,1fr); }.privacy-band,.tuition,.auth-shell,.admin-account-grid,.sensitive-once,.student-admin-body,.release-control,.skill-map-workspace,.diagnostic-review-heading,.diagnostic-governance,.diagnostic-admin-grid,.publish-diagnostic,.assign-diagnostic { grid-template-columns: 1fr; }.release-control form { border-left: 0; border-top: 1px solid var(--line); padding: 18px 0 0; }.tutor-layout { grid-template-columns: 1fr; }.roster { position: static; }.roster nav { grid-template-columns: repeat(2,1fr); }.portal-grid.two-one,.portal-grid.equal-grid { grid-template-columns: 1fr; }.mode-grid { grid-template-columns: repeat(2,1fr); } }
/* ---- Navigation menu, no JavaScript ---------------------------------
   Wide screens: the toggle is hidden and .nav-links is display:contents, so
   its children lay out as direct flex items of the header exactly as they
   did before this wrapper existed. Nothing about the desktop header changes.
   The collapsing behaviour lives entirely in the max-width query below. */
.site-header .nav-toggle,
.site-header .nav-toggle-label { display: none; }
.site-header .nav-links { display: contents; }

/* A signed agreement is evidence: show it monospaced and unreflowed, so
   what is on screen is what was agreed, line for line. */
.agreement-snapshot {
    margin: 0;
    padding: 18px;
    max-height: 32rem;
    overflow: auto;
    background: var(--chalk);
    border: 1px solid var(--line);
    border-radius: 4px;
    font: 400 .82rem/1.7 "IBM Plex Mono", ui-monospace, monospace;
    white-space: pre-wrap;
    word-break: break-word;
}

/* A global `a { color: inherit; text-decoration: none }` strips links of both
   their colour and their underline, which is right for nav and cards but left
   the register's student names looking exactly like the text beside them —
   they were links nobody could see. Inside a data table, a link says so. */
.data-table a {
    color: var(--teal);
    font-weight: 750;
    text-decoration: underline;
    text-underline-offset: 2px;
    text-decoration-thickness: 1px;
}
.data-table a:hover { color: var(--ink); text-decoration-thickness: 2px; }
.data-table a:focus-visible { outline: 2px solid var(--gold); outline-offset: 2px; }

/* Same problem wherever a link sits in running text rather than a control:
   without this it reads as ordinary prose and nobody knows to click it. */
.privacy-copy a,
.page-subtitle a,
.form-help a,
.clean-list a,
.empty a {
    color: var(--teal);
    font-weight: 750;
    text-decoration: underline;
    text-underline-offset: 2px;
}
.privacy-copy a:hover,
.page-subtitle a:hover,
.form-help a:hover,
.clean-list a:hover,
.empty a:hover { color: var(--ink); }

/* In-page jump targets must clear the sticky header (76px). */
[id] { scroll-margin-top: 96px; }

@media (max-width: 1100px) { .chart-grid { grid-template-columns: repeat(2,1fr); }.family-learning-feed { grid-template-columns: 1fr; } }
@media (max-width: 980px) { .session-grid { grid-template-columns: 1fr; } }
@media (max-width: 700px) { .site-header { align-items: flex-start; }.site-header nav { gap: 12px; }.site-header nav>a:not(.nav-button) { display: none; }.site-header nav { position: relative; }.site-header .nav-toggle-label { display: block; padding: 8px 14px; border: 1px solid rgba(255,255,255,.3); border-radius: 3px; color: #fff; font-size: .85rem; font-weight: 750; cursor: pointer; }.site-header .nav-toggle-label::after { content: ' \25BE'; }.site-header .nav-toggle:checked ~ .nav-toggle-label::after { content: ' \25B4'; }.site-header .nav-toggle { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }.site-header .nav-toggle:focus-visible ~ .nav-toggle-label { outline: 2px solid var(--gold); outline-offset: 2px; }.site-header .nav-links { display: none; }.site-header .nav-toggle:checked ~ .nav-links { display: grid; gap: 2px; position: absolute; right: 0; top: calc(100% + 12px); z-index: 30; width: max-content; min-width: 12rem; max-width: calc(100vw - 32px); padding: 10px; border-radius: 6px; background: var(--ink); box-shadow: 0 18px 40px rgba(10,27,51,.45); }.site-header .nav-toggle:checked ~ .nav-links a { display: block; padding: 10px 12px; border-radius: 4px; color: #E7EDF3; }.site-header .nav-toggle:checked ~ .nav-links a[aria-current="page"] { background: rgba(255,255,255,.1); color: #fff; }.site-header .nav-toggle:checked ~ .nav-links a[aria-current="page"]::after { display: none; }.brand small { display: none; }.hero { padding-top: 75px; min-height: auto; }.three-grid,.experience-grid,.policy-grid,.family-columns,.summary-strip,.chart-grid,.form-pair,.diagnostic-options,.diagnostic-answer-grid { grid-template-columns: 1fr; }.privacy-band { gap: 25px; }.tuition-card { padding: 28px; }.portal-heading,.assistant-top,.student-header,.submit-row,.feed-review-summary,.resource-heading,.resource-actions,.diagnostic-submit { display: grid; }.summary-strip div { border-right: 0; border-bottom: 1px solid rgba(255,255,255,.14); }.roster nav { grid-template-columns: 1fr; }.access-control { border-left: 0; border-top: 1px solid var(--line); padding: 18px 0 0; }.mode-grid { grid-template-columns: 1fr; }.privacy-reminder { grid-template-columns: 1fr; }.footer-links { display: grid; }.site-footer { display: grid; }.skill-map-list article { grid-template-columns: 1fr; }.mastery-level { justify-self: start; } }


/* ============================================================
   DESIGN SYSTEM PORT  -  matches the public site
   Appended deliberately: the rules above stay as authored and
   these override only what carries brand.
   ============================================================ */

/* ---- Typography ---- */
body { font-family: "Archivo", -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif; }
h1, h2, h3,
.panel h2, .panel-heading h2,
.price strong, .three-grid .number, .rhythm > li > span,
.diagnostic-definition summary strong, .brand-mark {
  font-family: "Fraunces", Georgia, "Times New Roman", serif;
}
h1 { font-variation-settings: "opsz" 144, "SOFT" 20; font-weight: 600; }
h2 { font-variation-settings: "opsz" 96; font-weight: 600; }
.eyebrow, .kicker, .card-label, .response-label,
.summary-strip span, th,
.chart-grid small, .topic-map small, .session-grid small,
.skill-map-list small, .goal-list small,
.diagnostic-item legend, .feed-review-summary small, .resource-heading small {
  font-family: "IBM Plex Mono", ui-monospace, SFMono-Regular, Menlo, monospace;
  font-weight: 500;
}

/* ---- Brand surfaces ---- */
body { background: var(--cream); }
.site-header { background: rgba(10,27,51,.94); backdrop-filter: blur(12px); border-bottom-color: var(--navy-2); }
.site-header .brand { color: #fff; }
.site-header nav a { color: #9DB0C4; }
.site-header nav a:not(.nav-button):hover, .link-button:hover { color: var(--gold); }
.link-button { color: #9DB0C4; }
.brand-logo { width: 46px; height: 46px; background: #fff; padding: 3px; box-shadow: 0 1px 3px rgba(0,0,0,.35); }
.site-header nav a.nav-button { background: var(--gold); color: #22180A; border-radius: 2px; font-weight: 750; transition: background-color .25s var(--ease), transform .25s var(--ease), box-shadow .25s var(--ease); }
.site-header nav a.nav-button:hover { background: var(--brass-bright); color: #22180A; transform: translateY(-2px); box-shadow: 0 10px 25px rgba(10,27,51,.14); }

/* The page you are on. Marked with aria-current="page" rather than a class,
   so the screen-reader semantic and the styling cannot drift apart.
   Colour alone would fail anyone who cannot separate gold from grey-blue, so
   the weight lifts and a rule sits under the label as well. */
.site-header nav a[aria-current="page"]:not(.nav-button) {
    color: #FFFFFF;
    font-weight: 750;
    position: relative;
}
.site-header nav a[aria-current="page"]:not(.nav-button)::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: -6px;
    height: 2px;
    background: var(--gold);
    border-radius: 2px;
}
/* Hover on the current item should not read as "somewhere else to go". */
.site-header nav a[aria-current="page"]:not(.nav-button):hover { color: #FFFFFF; }


.hero { background: radial-gradient(circle at 80% 18%, rgba(201,163,85,.14), transparent 34%), linear-gradient(135deg, #07152A, var(--navy-2) 78%); }
.hero h1 em { color: var(--gold); font-style: italic; }
.hero .eyebrow, .card-label, .assistant-panel .kicker, .response-label { color: var(--gold); }
.privacy-band { background: var(--navy); }
.privacy-band a { color: var(--gold); }
.page-hero { background: var(--navy); }
.site-footer { background: #071324; }

/* ---- Controls ---- */
.button { border-radius: 2px; transition: background-color .25s var(--ease), color .25s var(--ease), transform .25s var(--ease); }
.button-primary { background: var(--gold); color: #22180A; }
.button-primary:hover { background: var(--brass-bright); }
.button-secondary { border-color: #C3CFD8; }
.button:hover { transform: translateY(-2px); box-shadow: 0 10px 25px rgba(10,27,51,.14); }
:focus-visible { outline: 3px solid var(--gold); outline-offset: 3px; }
.auth-card input:focus, .stack-form input:focus, .stack-form textarea:focus,
.stack-form select:focus, .assistant-form textarea:focus {
  outline: 3px solid rgba(201,163,85,.28); border-color: var(--gold);
}

/* ---- Cards and panels: one radius, one hover language ---- */
.panel, .auth-card, .hero-card, .three-grid article, .experience-grid article,
.policy-grid article, .tuition-card, .assistant-form, .locked-card,
.announcement-list article, .resource-grid article, .practice-card-grid article,
.practice-admin-list > article, .method-list article, .resource-list > article,
.feed-review-item, .skill-map-list article, .diagnostic-feedback article,
.student-admin-list details, .summary-strip { border-radius: var(--radius); }
.choice, .diagnostic-options span, .mode-grid span, .conditional-fields,
.consent-box, .evidence-form, .diagnostic-item-builder, .compact-upload { border-radius: 3px; }

.three-grid article, .experience-grid article, .policy-grid article,
.method-list article, .resource-list > article, .skill-map-list article,
.feed-review-item { transition: background-color .3s var(--ease), border-color .3s var(--ease); }
.three-grid article:hover, .experience-grid article:hover, .policy-grid article:hover,
.method-list article:hover, .resource-list > article:hover, .skill-map-list article:hover,
.feed-review-item:hover { background: #fff; border-color: #DFD4BC; }

/* ---- Accent tints that were teal ---- */
.practice-meta span, .status-chip, .privacy-note { background: var(--teal-light); color: #5C4715; }
.secure-badge { background: var(--teal-light); color: #5C4715; }
.choice:has(input:checked) { border-color: var(--gold); background: var(--teal-light); }
.mode-grid input:checked + span, .diagnostic-options input:checked + span { border-color: var(--gold); background: var(--teal-light); }
.goal-dot { background: var(--gold); box-shadow: 0 0 0 5px var(--teal-light); }
.avatar { background: var(--navy); color: var(--gold); }
.student-row:hover, .student-row.active { background: var(--teal-light); }
.chart-grid article, .topic-map article, .session-grid article,
.diagnostic-answer-grid article, .method-list article, .resource-list > article,
.feed-review-item, .skill-map-list article, .student-admin-list details { background: #FBF9F4; border-color: #E6E0D2; }
.consent-box, .evidence-form, .diagnostic-item-builder, .compact-upload,
.diagnostic-line { background: var(--cream); border-color: #E6E0D2; }
.assistant-response { background: linear-gradient(135deg, var(--navy-2), var(--navy)); }
.assistant-panel { background: linear-gradient(160deg, var(--navy), var(--navy-2)); }
.weekly-plan-editor, .diagnostic-governance { border-left-color: var(--gold); }
.skill-map-panel, .learning-chart, .tuition-card, .diagnostic-review-heading { border-top-color: var(--gold); }
.auth-shell { background: linear-gradient(115deg, var(--cream), #fff); }
.experience { background: var(--cream); }
.summary-strip, .diagnostic-submit, .publish-diagnostic, .assign-diagnostic { background: var(--navy); }
.summary-strip span { color: var(--gold); }
.question-number span { background: var(--navy); color: var(--gold); }

@media (prefers-reduced-motion: reduce) {
  * { animation-duration: .001ms !important; transition-duration: .001ms !important; }
  .button:hover { transform: none; }
}

/* Essential-cookies notice (CSP-safe; shown by default, hidden on dismiss) */
.cookie-notice { position: fixed; left: 50%; bottom: 18px; transform: translateX(-50%); z-index: 60; width: min(720px, calc(100% - 24px)); display: flex; gap: 16px; align-items: center; justify-content: space-between; background: var(--navy); color: #eef4f8; border: 1px solid rgba(255,255,255,.14); border-radius: 12px; padding: 14px 18px; box-shadow: 0 14px 40px rgba(11,31,54,.30); }
.cookie-notice[hidden] { display: none; }
.cookie-notice p { margin: 0; font-size: .9rem; color: #dbe5ec; }
.cookie-notice a { color: var(--brass-bright); text-decoration: underline; }
.button-quiet { color: #fff; background: transparent; border-color: rgba(255,255,255,.4); font-weight: 650; white-space: nowrap; }
.button-quiet:hover { background: rgba(255,255,255,.10); }
/* Full privacy policy rendered under the summary cards */
.privacy-policy .privacy-policy-head { grid-column: 1 / -1; }
.privacy-policy .privacy-policy-head h2 { margin: 0; }
@media (max-width: 700px) { .cookie-notice { flex-direction: column; align-items: flex-start; } }

/* Enrollment intake page (/enroll) */
.enroll-page { padding: clamp(40px,6vw,80px) clamp(20px,6vw,92px); max-width: 900px; margin: 0 auto; }
.enroll-form { gap: 26px; }
.enroll-fieldset { border: 1px solid var(--line); border-radius: var(--radius); padding: 24px; margin: 0; background: #fff; }
.enroll-fieldset legend { font-weight: 750; color: var(--navy); padding: 0 8px; font-size: 1.05rem; }
.child-block { border: 1px dashed var(--line); border-radius: 12px; padding: 18px; margin-top: 14px; }
.child-block:first-of-type { margin-top: 8px; }
.child-block-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px; }
.child-block-head .child-title { margin: 0; font-size: 1rem; color: var(--navy); }
.remove-child { color: var(--danger); }
.agreement-scroll { max-height: 320px; overflow-y: auto; border: 1px solid var(--line); border-radius: 10px; padding: 18px 20px; background: var(--paper, #fff); margin-bottom: 16px; }
.agreement-scroll h3 { margin: 16px 0 6px; font-size: .98rem; color: var(--navy); }
.agreement-scroll h3:first-child { margin-top: 0; }
.agreement-scroll p { color: var(--muted); font-size: .9rem; margin: 0 0 8px; }
.agreement-scroll .agreement-draft-banner { color: var(--danger); font-size: .85rem; }
.check-line { display: flex; gap: 10px; align-items: flex-start; font-weight: 500; color: var(--ink); margin-bottom: 10px; }
.check-line input { width: auto; margin-top: 3px; }
.enroll-summary-box { border: 1px solid var(--brass-deep, #8A6A28); border-radius: 12px; padding: 16px 20px; background: rgba(201,163,85,.08); }
.enroll-summary-box p { margin: 0 0 6px; }
.promo-flag { display: inline-block; background: var(--repair, #2C6B5D); color: #fff; font-size: .72rem; padding: 2px 8px; border-radius: 999px; margin-left: 4px; }

/* Enrollment form fixes: consent checkboxes, inline password errors, ACH nudge.
   Scoped to .enroll-form so they override the generic .stack-form input/label. */
.enroll-form .check-line { display: flex; gap: 12px; align-items: flex-start; font-weight: 500; color: var(--ink); margin: 0 0 12px; }
.enroll-form .check-line input[type="checkbox"] { width: 20px; height: 20px; min-width: 20px; margin: 1px 0 0; padding: 0; border: 1px solid #b8c4cc; border-radius: 4px; box-shadow: none; flex: 0 0 auto; accent-color: var(--teal, #087f78); }
.enroll-form .check-line span { font-weight: 500; }
.enroll-form .field-error { display: block; color: var(--danger, #b23b3b); font-size: .82rem; margin-top: 6px; font-weight: 600; }
.enroll-form input.invalid { border-color: var(--danger, #b23b3b); box-shadow: 0 0 0 3px rgba(178,59,59,.14); }
.enroll-summary-box .ach-nudge { margin: 10px 0 0; font-size: .88rem; color: var(--muted); border-left: 3px solid var(--repair, #2C6B5D); padding-left: 12px; }
.enroll-summary-box .ach-nudge strong { color: var(--ink); }

/* Voluntary processing-fee opt-in checkbox (used on enroll + billing forms;
   label.optin-check ties .stack-form label on specificity and wins by order). */
label.optin-check { display: flex; gap: 12px; align-items: flex-start; font-weight: 500; color: var(--ink); margin: 6px 0 12px; }
label.optin-check input[type="checkbox"] { width: 20px; height: 20px; min-width: 20px; margin: 1px 0 0; padding: 0; border: 1px solid #b8c4cc; border-radius: 4px; box-shadow: none; flex: 0 0 auto; accent-color: var(--teal, #087f78); }
label.optin-check span { font-weight: 500; }

/* ---- Upload field -------------------------------------------------------
   A file input on its own is almost invisible: a small grey button with no
   indication that a whole worksheet can be dropped on it. This gives the
   control the weight of the thing it does.

   Progressive enhancement. The real <input type="file"> is always present and
   always works; it is only visually hidden once the script has confirmed it
   can offer the drop zone, so a no-JS browser keeps a usable control. */
.upload-field { display: block; }
.upload-field > input[type="file"] {
  display: block;
  width: 100%;
  margin-top: .4rem;
}
.upload-field.is-enhanced > input[type="file"] {
  position: absolute;
  width: 1px; height: 1px;
  padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}
.upload-zone {
  display: none;
  margin-top: .5rem;
  padding: 1.75rem 1.25rem;
  text-align: center;
  background: var(--cream);
  border: 2px dashed var(--line);
  border-radius: var(--radius);
  cursor: pointer;
  transition: border-color .2s var(--ease), background-color .2s var(--ease);
}
.upload-field.is-enhanced .upload-zone { display: block; }
.upload-zone:hover,
.upload-zone:focus-visible { border-color: var(--gold); background: var(--teal-light); }
.upload-zone:focus-visible { outline: 2px solid var(--navy); outline-offset: 2px; }
.upload-zone.is-dragging { border-color: var(--gold); background: var(--teal-light); border-style: solid; }
.upload-zone svg { width: 34px; height: 34px; color: var(--teal); margin-bottom: .5rem; }
.upload-zone-lead { margin: 0; font-weight: 600; color: var(--ink); }
.upload-zone-lead b { color: var(--teal); text-decoration: underline; font-weight: 600; }
.upload-zone-hint { margin: .3rem 0 0; font-size: .8125rem; color: var(--muted); }
/* The chosen file, once there is one. */
.upload-chosen {
  display: none;
  align-items: center; gap: .75rem;
  margin-top: .5rem; padding: .75rem 1rem;
  background: var(--paper);
  border: 1px solid var(--line);
  border-left: 3px solid var(--teal);
  border-radius: var(--radius);
  text-align: left;
}
.upload-field.has-file .upload-chosen { display: flex; }
.upload-field.has-file .upload-zone { display: none; }
.upload-chosen-name { font-weight: 600; color: var(--ink); word-break: break-word; }
.upload-chosen-size { display: block; font-size: .8125rem; color: var(--muted); font-weight: 400; }
.upload-remove {
  margin-left: auto; flex: none;
  background: none; border: 1px solid var(--line); border-radius: var(--radius);
  padding: .35rem .7rem; font: inherit; font-size: .8125rem;
  color: var(--danger); cursor: pointer;
}
.upload-remove:hover { border-color: var(--danger); }
.upload-error { margin: .5rem 0 0; font-size: .8125rem; color: var(--danger); }