/* sci-route.css - the GCSE science route (learn/sci-route.php, assets/learn/sci-route.js): the small question, the
   quiet route line, and the course page's Separate science extras.
   Every state comes from the classes sci-route.js sets in the <head>, so nothing appears and then moves. */

/* the small question (route never chosen): near the top of the course page, never blocking; gone after one tap */
.sci-mini{display:none;position:relative;margin:24px 0 0;padding:16px 52px 14px 18px;background:var(--surface);border-radius:var(--r2,16px);box-shadow:var(--shadow)}
.sci-ask .sci-mini{display:block}
.sci-mini-q{margin:0 0 10px;font:600 17.5px/1.3 var(--f-display);color:var(--ink);text-wrap:balance}
.sci-x{position:absolute;top:6px;right:6px;display:grid;place-items:center;width:44px;height:44px;padding:0;border:0;border-radius:10px;background:none;color:var(--ink-2);cursor:pointer}
.sci-x:hover{background:var(--sunk);color:var(--ink)}
.sci-x:focus-visible{outline:3px solid var(--study-ink);outline-offset:1px}
.sci-mini-ch{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;max-width:720px}
@media (max-width:600px){.sci-mini-ch{grid-template-columns:1fr}.sci-mini{padding-right:18px}.sci-mini-q{padding-right:36px}}
.sci-opt{display:grid;gap:2px;text-align:left;min-height:56px;padding:10px 14px;border:0;border-radius:12px;background:var(--seg-track,var(--sunk));color:var(--ink);font:inherit;cursor:pointer;box-shadow:inset 0 0 0 2px transparent}
.sci-opt:hover{box-shadow:inset 0 0 0 2px var(--study)}
.sci-opt:focus-visible{outline:3px solid var(--study-ink);outline-offset:2px}
.sci-opt b{font:600 16px/1.3 var(--f-display)}
.sci-opt small{font-size:14px;line-height:1.35;color:var(--ink-2);text-wrap:pretty}
.sci-mini-h{margin:10px 0 0;color:var(--ink-3);font-size:14px;text-wrap:pretty}

/* the quiet route line: "Combined Science · Change" (hidden while the card asks) */
.sci-ask .sci-line-box{display:none}
.sci-line{display:flex;flex-wrap:wrap;align-items:center;gap:4px 8px;margin:0;color:var(--ink-2);font-size:15px}
.sci-now{font-weight:700;color:var(--ink)}
.sci-c{display:none}
.sci-combined .sci-c{display:inline}
.sci-combined .sci-s{display:none}
.sci-dot{color:var(--ink-3)}
.sci-ch{min-height:32px;padding:0;border:0;background:none;color:var(--study-ink);font:700 15px/1 var(--f-body);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px;cursor:pointer}
.sci-ch:focus-visible{outline:3px solid var(--study-ink);outline-offset:2px;border-radius:4px}
.sci-pick{margin:8px 0 0}
.sci-pick[hidden]{display:none}
.sci-q{margin:0 0 6px;font-size:14px;font-weight:700;color:var(--ink-3)}
.sci-pick .cs-lvnav{margin:0}

/* Separate science extras (course page, Combined route only) */
.cp-extras{display:none}
.sci-combined .cp-extras{display:block;margin:44px 0 0}
.cp-extras h3{margin:0 0 4px;font:600 clamp(22px,2.4vw,26px)/1.2 var(--f-display)}
.cp-extras > p{margin:0 0 12px;color:var(--ink-2);max-width:62ch;text-wrap:pretty}
.cp-extras details{background:var(--surface);border-radius:var(--r2,16px);box-shadow:var(--shadow);margin:0 0 10px;padding:4px 16px}
.cp-extras summary{cursor:pointer;padding:12px 0;font:600 17px/1.3 var(--f-display);list-style:none}
.cp-extras summary::-webkit-details-marker{display:none}
.cp-extras ul{list-style:none;margin:0 0 10px;padding:0;display:grid;gap:2px}
.cp-extras li a{display:flex;flex-wrap:wrap;align-items:baseline;gap:2px 12px;padding:8px 6px;border-radius:10px;color:var(--ink);text-decoration:none}
.cp-extras li a:hover{background:var(--paper)}
.cp-extras li a svg{width:14px;height:14px;align-self:center;color:var(--ink-3)}
.cp-extras li b{font-weight:600}
.cp-extras li span{color:var(--ink-3);font-size:14px}
