/* Shared only by the public portal and Revision; Points uses assets/style.css. */
:root {
  --ink:#273247; --muted:#606b80; --paper:#f8f9fc; --white:#fff;
  --blue:#6b9fe8; --blue-dark:#315fa8; --blue-light:#edf3fd;
  --lavender:#a995e8; --lavender-dark:#675099; --lavender-light:#f3effb;
  --mint:#77cdb5; --mint-dark:#246752; --mint-light:#edf8f3;
  --yellow:#f4d77b; --line:#dce2ed; --danger:#934b3d; --danger-light:#fff4ed;
  --space-1:8px; --space-2:16px; --space-3:24px; --space-4:32px; --space-5:48px;
  --radius-sm:12px; --radius:22px; --radius-lg:30px;
  --shadow:0 8px 28px #27324708; --shadow-lift:0 14px 32px #27324712;
  --font: "Aptos", "Segoe UI", system-ui, sans-serif;
  --text:1rem; --text-small:.82rem; --leading:1.6;
  font-family:var(--font); color:var(--ink); background:var(--paper); font-size:18px;
}
* { box-sizing:border-box; }
body { margin:0; line-height:var(--leading); }
a { color:var(--blue-dark); text-underline-offset:4px; }
h1,h2,h3,p { margin-top:0; }
h1,h2,h3 { line-height:1.25; letter-spacing:-.025em; }
h1 { font-size:clamp(2rem,5vw,2.65rem); margin-bottom:12px; }
h2 { font-size:1.45rem; } h3 { font-size:1.12rem; }
button,input,select { font:inherit; }
button,.button { display:inline-flex; justify-content:center; align-items:center; gap:12px; min-height:52px; padding:13px 23px; border:1px solid transparent; border-radius:var(--radius-sm); background:var(--blue-dark); color:var(--white); font-weight:650; cursor:pointer; text-decoration:none; transition:background .15s,transform .15s; }
button:hover,.button:hover { background:#264d8c; }
button:active,.button:active { transform:translateY(1px); }
button[aria-disabled=true] { opacity:.65; cursor:wait; }
button.secondary { color:var(--blue-dark); background:var(--white); border-color:var(--line); }
button.secondary:hover { background:var(--blue-light); }
:where(a,button,input,select,summary):focus-visible { outline:3px solid #315fa8; outline-offset:4px; }
input,select { min-height:54px; max-width:100%; border:1px solid #a5b0c3; border-radius:var(--radius-sm); padding:12px 14px; background:var(--white); color:var(--ink); }
select { width:100%; }
input:not([type=radio]):focus,select:focus { border-color:var(--blue-dark); }
label,legend { font-weight:600; }
label { display:block; margin:0 0 10px; }
fieldset { border:0; padding:0; margin:0; min-width:0; }
small { display:block; color:var(--muted); font-size:var(--text-small); line-height:1.55; }
.eyebrow { color:var(--lavender-dark); font-size:.74rem; font-weight:750; letter-spacing:.1em; text-transform:uppercase; margin:0 0 12px; }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; border:0; }
.formatted-copy { white-space:pre-line; overflow-wrap:anywhere; }
.number { white-space:nowrap; font-variant-numeric:tabular-nums; }
.page-shell { width:min(1180px,100%); padding:0 var(--space-4); margin:auto; }
.site-header { min-height:100px; display:flex; align-items:center; justify-content:space-between; gap:20px; border-bottom:1px solid var(--line); }
.brand { display:inline-flex; align-items:center; gap:12px; font-weight:750; color:var(--ink); font-size:1.1rem; text-decoration:none; letter-spacing:-.025em; min-height:48px; }
.brand-mark { position:relative; display:inline-grid; place-items:center; width:38px; height:38px; border-radius:12px; background:#e2eafb; color:var(--blue-dark); font-size:32px; font-family:Georgia,serif; font-weight:700; line-height:1; transform:rotate(-5deg); }
.brand-mark>span { position:absolute; top:-5px; right:-5px; color:#a17725; font-size:18px; }
.header-note { font-size:.8rem; color:var(--muted); }
.site-footer { text-align:center; color:var(--muted); font-size:.72rem; padding:26px 0; }
/* The activity hub. */
.portal-page { background:radial-gradient(ellipse at 0% 12%,#edf0fd 0,transparent 40%),radial-gradient(ellipse at 100% 55%,#f2f4e7 0,transparent 40%),var(--paper); }
.welcome { position:relative; text-align:center; padding:58px 0 50px; }
.welcome::before,.welcome::after { content:""; position:absolute; border:2px solid #b5c8e5; width:34px; height:34px; border-radius:50%; opacity:.5; top:92px; left:5%; }
.welcome::after { left:auto; right:6%; border-color:#bca9de; border-radius:9px; width:24px; height:24px; transform:rotate(18deg); top:145px; }
.welcome-tag { display:flex; width:fit-content; align-items:center; gap:8px; padding:5px 13px; background:#fbefcb; color:#705c29; font-size:.72rem; font-weight:650; border-radius:99px; margin:0 auto 22px; }
.welcome h1 { display:inline-block; position:relative; font-size:clamp(2.4rem,7vw,4rem); font-weight:780; letter-spacing:-.055em; margin-bottom:16px; }
.heading-spark { position:absolute; color:#8e77ca; font-size:37px; right:-39px; top:-13px; transform:rotate(12deg); }
.welcome>p:last-child { color:var(--muted); font-size:1.05rem; margin:0; line-height:1.65; }
.section-heading { display:flex; justify-content:space-between; align-items:center; gap:16px; margin-bottom:22px; }
.section-heading h2 { font-size:1.13rem; margin:0; }
.section-heading>span { font-size:.74rem; color:var(--muted); }
.activity-grid { display:grid; grid-template-columns:1.12fr 1fr 1fr; gap:22px; }
.activity-card { min-width:0; display:flex; flex-direction:column; border:1px solid var(--line); background:var(--white); border-radius:var(--radius); overflow:hidden; text-decoration:none; color:var(--ink); box-shadow:var(--shadow); }
a.activity-card { transition:transform .18s,box-shadow .18s,border-color .18s; }
a.activity-card:hover { transform:translateY(-5px); box-shadow:var(--shadow-lift); border-color:#a8bedf; }
a.activity-card:active { transform:translateY(-1px); }
.activity-art { position:relative; display:flex; justify-content:center; align-items:flex-end; min-height:242px; padding:40px 12px 0; background:#e3edfc; }
.activity-art img { display:block; max-width:100%; object-fit:contain; height:202px; }
.activity-points .activity-art { background:#e0f2e9; }
.activity-games .activity-art { background:#ece5f9; }
.card-tag { position:absolute; top:18px; left:18px; border:1px solid #ffffff80; border-radius:99px; background:#ffffffb0; padding:3px 10px; color:#455b7c; font-size:.65rem; font-weight:650; }
.activity-points .card-tag { color:#396452; } .activity-games .card-tag { color:#695682; }
.activity-copy { padding:24px; display:flex; flex:1; flex-direction:column; }
.activity-copy h3 { font-size:1.6rem; margin:0 0 9px; }
.activity-copy p { color:var(--muted); font-size:.85rem; margin:0 0 25px; line-height:1.6; }
.card-action { display:flex; align-items:center; justify-content:space-between; min-height:46px; margin-top:auto; color:var(--blue-dark); font-weight:700; font-size:.86rem; }
.card-action>span { display:grid; place-items:center; width:36px; height:36px; border-radius:50%; background:var(--blue-light); font-size:1.2rem; }
.activity-points .card-action { color:var(--mint-dark); } .activity-points .card-action>span { background:var(--mint-light); }
.coming-soon { display:flex; justify-content:space-between; align-items:center; min-height:46px; margin-top:auto; color:#766880; font-size:.72rem; }
.portal-footer { text-align:center; font-size:.8rem; color:var(--muted); margin:38px 0 12px; }
.portal-footer>span { color:var(--lavender-dark); margin-right:8px; }
/* A quieter workbook for Revision. */
.revision-shell { width:min(1040px,100%); padding:0 32px; margin:auto; }
.revision-header { min-height:88px; }
.back-link { display:inline-flex; align-items:center; gap:8px; min-height:48px; text-decoration:none; font-size:.8rem; font-weight:650; }
.revision-main { padding:38px 0 0; }
.page-heading { display:flex; align-items:center; gap:20px; margin-bottom:30px; }
.page-heading h1 { margin:0 0 7px; }
.page-heading p { margin:0; color:var(--muted); font-size:.9rem; }
.page-icon { flex:none; width:72px; height:72px; padding:5px; border-radius:22px; background:var(--blue-light); }
.selection-intro { max-width:650px; margin-bottom:28px; color:var(--muted); }
.session-preview { display:flex; flex-wrap:wrap; gap:12px; margin-bottom:30px; }
.preview-step { display:inline-flex; align-items:center; gap:9px; padding:9px 14px; border:1px solid #e0d8ef; background:var(--lavender-light); color:var(--lavender-dark); border-radius:var(--radius-sm); font-size:.8rem; }
.preview-step:last-child { background:var(--blue-light); color:var(--blue-dark); border-color:#d8e4f7; }
.preview-step strong { font-size:1.1rem; }
.selection-grid { display:grid; grid-template-columns:1fr 1fr; gap:22px; align-items:stretch; }
.selection-card { background:var(--white); border:1px solid var(--line); border-radius:var(--radius); padding:28px; box-shadow:var(--shadow); display:flex; flex-direction:column; }
.selection-card h2 { margin-bottom:12px; font-size:1.25rem; }
.step-number { display:inline-grid; place-items:center; width:32px; height:32px; margin-right:8px; border-radius:10px; background:var(--blue-light); color:var(--blue-dark); font-size:.85rem; vertical-align:middle; }
.selection-card p { font-size:.86rem; color:var(--muted); margin-bottom:24px; }
.selection-card label { font-size:.85rem; }
.selection-card button { margin-top:20px; align-self:flex-start; }
.selection-card select { margin-top:auto; }
.selection-topic { border-top:3px solid var(--lavender); }
.selection-topic .step-number { color:var(--lavender-dark); background:var(--lavender-light); }
.selection-placeholder { border-style:dashed; background:#ffffff60; justify-content:center; }
.selection-placeholder p { margin:0; }
.session-heading { margin-bottom:22px; }
.topic-label { font-size:.8rem; color:var(--muted); margin:0 0 8px; }
.progress-caption { font-size:.87rem; font-weight:650; margin:0 0 14px; }
.session-progress { padding:20px 24px; border:1px solid var(--line); border-radius:var(--radius); background:var(--white); margin-bottom:28px; }
.stage-labels { display:flex; font-size:.71rem; color:var(--muted); gap:16px; margin-bottom:12px; }
.stage-labels .stage-active { color:var(--ink); font-weight:700; }
.stage-labels>span:first-child { flex:3; } .stage-labels>span:last-child { flex:7; }
.stage-labels strong { font-size:.72rem; }
.progress-steps { list-style:none; padding:0; margin:0; display:grid; grid-template-columns:repeat(10,minmax(0,1fr)); gap:8px; }
.progress-steps li { background:#edf0f5; height:8px; border-radius:5px; }
.progress-steps li.guided-step { background:#e8e1f4; }
.progress-steps li.step-done { background:var(--blue); }
.progress-steps li.guided-step.step-done { background:var(--lavender); }
.progress-steps li.step-current { background:var(--blue-dark); outline:2px solid var(--blue-dark); outline-offset:2px; }
.progress-steps li.guided-step.step-current { background:var(--lavender-dark); outline-color:var(--lavender-dark); }
.progress-steps li:nth-child(3):not(:last-child) { margin-right:4px; }
.question-card { background:var(--white); border:1px solid var(--line); border-radius:var(--radius); padding:32px; box-shadow:var(--shadow); }
.lesson { padding:24px; background:var(--lavender-light); border:1px solid #e2daef; border-radius:var(--radius-sm); margin-bottom:30px; }
.lesson h2 { font-size:1.1rem; color:var(--lavender-dark); margin:0 0 12px; }
.lesson-intro { margin:0; line-height:1.65; font-size:.95rem; }
.example-heading { margin:22px 0 12px; padding-top:20px; border-top:1px solid #dcd2ed; font-size:.84rem; color:var(--lavender-dark); letter-spacing:0; }
.worked-example { margin:0; line-height:1.85; font-size:.92rem; }
.worked-example .example-answer { display:block; margin-top:12px; padding:12px 14px; border-left:3px solid var(--lavender); border-radius:0 8px 8px 0; background:var(--white); color:var(--lavender-dark); font-weight:700; }
.method-reminder { padding:20px 22px; border-left:4px solid var(--lavender); background:var(--lavender-light); border-radius:0 var(--radius-sm) var(--radius-sm) 0; font-size:.95rem; margin-bottom:18px; }
.guidance { margin:0 0 28px; border:1px solid #d9d0e9; border-radius:var(--radius-sm); background:#fbf9fe; }
summary { min-height:52px; padding:13px 18px; cursor:pointer; color:var(--lavender-dark); font-size:.9rem; font-weight:650; }
.guidance p { padding:0 20px; margin:10px 0 20px; line-height:1.75; }
.question-kicker { color:var(--muted); font-size:.73rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase; margin-bottom:12px; }
.question-title { font-size:clamp(1.2rem,2.6vw,1.55rem); line-height:1.5; margin:0 0 28px; letter-spacing:-.02em; }
.choices { margin:0; padding:0; }
.choices legend { margin:0 0 10px; font-size:.85rem; color:var(--muted); }
.choices label:has(input[type=radio]) { width:100%; min-height:60px; display:flex; align-items:center; gap:14px; margin:12px 0; padding:15px 18px; border:1px solid #cbd4e3; border-radius:var(--radius-sm); background:#fff; line-height:1.55; cursor:pointer; font-weight:500; transition:border-color .15s,background .15s; }
.choices label:has(input[type=radio]):hover { border-color:#8da8d0; background:#fafcff; }
.choices label:has(input[type=radio]:checked) { border:2px solid var(--blue-dark); padding:14px 17px; background:var(--blue-light); }
.retry-answer .choices label:has(input[type=radio]:checked) { border-color:var(--danger); background:var(--danger-light); }
.choices label:has(input:focus-visible) { outline:3px solid var(--blue-dark); outline-offset:3px; }
.choices label input[type=radio] { flex:none; width:22px; height:22px; min-height:0; margin:0; padding:0; accent-color:var(--blue-dark); }
.choices .formatted-copy { min-width:0; }
.choices label[for=answer] { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
.choices>input { width:min(100%,420px); margin-top:4px; }
.answer-actions { display:flex; flex-wrap:wrap; align-items:center; gap:12px; margin-top:24px; padding-top:22px; border-top:1px solid #e9edf3; }
.answer-actions button:last-child { margin-left:auto; }
.answer-actions button:only-child { margin-left:0; }
.answer-form:not([data-guided-answer]) .answer-actions button:last-child { margin-left:auto; }
.answer-note { margin:18px 0 0; }
.feedback { border-radius:var(--radius-sm); padding:20px 22px; margin:0 0 22px; border:1px solid #d4dfed; background:var(--blue-light); }
.feedback p { margin:0 0 10px; } .feedback p:last-child { margin:0; }
.feedback--success { background:var(--mint-light); border-color:#b9ddcc; border-left:4px solid var(--mint-dark); }
.feedback--retry,.feedback--learn { background:var(--danger-light); border-color:#efd7c9; border-left:4px solid var(--danger); }
.feedback-title { font-weight:750; font-size:1.1rem; }
.reset-form { display:flex; align-items:center; gap:18px; margin:28px 0 12px; }
.reset-form button { background:transparent; color:var(--muted); border:1px solid var(--line); font-size:.8rem; padding:10px 16px; flex:none; }
.reset-form button:hover { background:var(--white); color:var(--ink); }
.score-card { display:flex; align-items:center; justify-content:space-between; gap:24px; border:1px solid #c5dfd4; background:var(--mint-light); border-radius:var(--radius); padding:32px; margin-bottom:30px; }
.score-card .eyebrow { color:var(--mint-dark); }
.score-card h2 { font-size:1.55rem; margin-bottom:12px; }
.score-card p:last-child { margin:0; color:#416153; font-size:.9rem; }
.completion-mark { display:grid; place-items:center; width:74px; height:74px; border:1px solid #b3d9c9; border-radius:50%; background:#d6eee2; color:var(--mint-dark); font-size:2.3rem; flex:none; }
.review-heading { margin-bottom:20px; }
.review { padding:24px 26px; margin:0 0 16px; background:var(--white); border:1px solid var(--line); border-radius:var(--radius-sm); }
.review-top { display:flex; flex-wrap:wrap; align-items:center; gap:10px; justify-content:space-between; margin-bottom:16px; }
.review-top small { font-weight:650; }
.result-badge { display:inline-block; background:var(--mint-light); color:var(--mint-dark); border-radius:99px; padding:4px 11px; font-size:.72rem; font-weight:700; }
.result-badge.needs-practice { background:var(--danger-light); color:var(--danger); }
.review h3 { font-size:1.05rem; line-height:1.5; margin-bottom:16px; }
.review p { margin-bottom:12px; font-size:.9rem; }
.review-answer { color:var(--muted); }
.review-explanation { border-top:1px solid #edf0f5; padding-top:14px; margin-bottom:0!important; }
.practice-more { padding:24px; border:1px solid var(--line); background:var(--blue-light); border-radius:var(--radius); margin-top:28px; display:flex; align-items:center; justify-content:space-between; gap:20px; }
.practice-more h2 { font-size:1.15rem; margin:0 0 5px; } .practice-more p { margin:0; color:var(--muted); font-size:.82rem; }
@media(min-width:1200px) { .portal-main { padding:0 16px; } }
@media(min-width:600px) and (max-width:899px) {
  .activity-grid { grid-template-columns:1fr 1fr; }
  .activity-revision { grid-column:1/-1; flex-direction:row; }
  .activity-revision .activity-art { flex:1; min-height:260px; }
  .activity-revision .activity-copy { flex:1; justify-content:center; padding:32px; }
  .activity-revision .card-action { margin-top:12px; }
  .activity-art { min-height:225px; }
  .activity-art img { height:190px; }
}
@media(max-width:700px) {
  .selection-grid { grid-template-columns:1fr; }
  .stage-labels { gap:12px; }
  .stage-labels>span:first-child { flex:1; } .stage-labels>span:last-child { flex:1; text-align:right; }
}
@media(max-width:599px) {
  .page-shell,.revision-shell { padding:0 20px; }
  .site-header { min-height:78px; }
  .header-note { display:none; }
  .brand { font-size:.95rem; gap:9px; }
  .brand-mark { width:33px; height:33px; }
  .welcome { padding:38px 0 36px; }
  .welcome h1 { font-size:2.5rem; }
  .heading-spark { font-size:25px; right:-22px; top:-10px; }
  .welcome>p:last-child { font-size:.94rem; }
  .welcome-tag { font-size:.65rem; margin-bottom:20px; }
  .welcome::before,.welcome::after { display:none; }
  .section-heading { margin-bottom:18px; }
  .section-heading h2 { font-size:1.05rem; }
  .section-heading>span { display:none; }
  .activity-grid { grid-template-columns:1fr; gap:22px; }
  .activity-art { min-height:204px; }
  .activity-art img { height:170px; }
  .activity-copy { padding:22px 24px; }
  .activity-copy h3 { font-size:1.45rem; }
  .activity-copy p { margin-bottom:12px; }
  .portal-footer { font-size:.75rem; line-height:1.7; margin:28px 10px 0; }
  .revision-header { flex-wrap:wrap; gap:0; }
  .back-link { font-size:.72rem; }
  .revision-main { padding-top:28px; }
  .page-heading { gap:14px; margin-bottom:24px; }
  .page-icon { width:54px; height:54px; border-radius:16px; }
  .page-heading h1 { font-size:1.85rem; }
  .page-heading p { font-size:.8rem; }
  .selection-card { padding:22px; }
  .session-preview { gap:8px; }
  .preview-step { font-size:.72rem; padding:7px 10px; }
  .session-progress { padding:18px; }
  .progress-steps { gap:6px; }
  .stage-labels { font-size:.65rem; }
  .stage-labels strong { font-size:.65rem; }
  .question-card { padding:22px 18px; }
  .lesson { padding:18px; margin-bottom:24px; }
  .lesson-intro,.worked-example { font-size:.9rem; }
  .worked-example { line-height:1.75; }
  .question-title { margin-bottom:24px; font-size:1.2rem; }
  .choices label:has(input[type=radio]) { gap:12px; padding:13px 12px; font-size:.95rem; }
  .choices label:has(input[type=radio]:checked) { padding:12px 11px; }
  .answer-actions { gap:10px; }
  .answer-actions button { padding:12px 18px; }
  .answer-actions button:only-child { width:100%; }
  .reset-form { align-items:flex-start; flex-direction:column; gap:10px; }
  .score-card { padding:24px 20px; gap:12px; }
  .score-card h2 { font-size:1.3rem; }
  .completion-mark { width:48px; height:48px; font-size:1.7rem; }
  .review { padding:20px; }
  .practice-more { align-items:stretch; flex-direction:column; padding:22px; }
}
@media(prefers-reduced-motion:reduce) {
  *,*::before,*::after { transition:none!important; animation:none!important; scroll-behavior:auto!important; }
}