/* Resource Centre (signed in), 2026 design: one course and topic switcher, every material one tab away.
   Read = one document; Practise = questions with worked solutions. Tokens, type and the shell come from
   /css/site-2026-app.css (white, chalk, ink, navy, gold, hairlines, 3px radius, Fraunces titles, Instrument Sans UI).
   Gold marks the one primary action on a screen. */

/* ---------- page frame ---------- */
.rc-page { --rc-pad: 24px; }
@media (max-width: 1023px) { .rc-page { --rc-pad: 16px; } }
.rc { flex: 1; min-height: 0; min-width: 0; display: flex; flex-direction: column; background: #fff; position: relative; }
.rc ul, .rc ol { list-style: none; }
.rc-ic { width: 18px; height: 18px; flex: none; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.rc-lk { width: 13px; height: 13px; color: var(--mute); flex: none; }
.rc-ext { width: 14px; height: 14px; color: var(--mute); }
.rc-ck { width: 15px; height: 15px; color: var(--ink); flex: none; }
.rc :focus-visible, .rc-pop :focus-visible, .rc-drawer :focus-visible { outline: 2px solid var(--navy); outline-offset: 2px; }
.rc-ib { width: var(--ctl); height: var(--ctl); display: inline-grid; place-items: center; flex: none; padding: 0; color: var(--ink); border-radius: var(--r); }
.rc-ib:hover { background: var(--chalk); }

/* ---------- buttons, segmented controls ---------- */
.rc-btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: var(--ctl); padding: 0 14px; border: 1px solid var(--ink); border-radius: var(--r); background: #fff; color: var(--ink); font: 500 14px/1 var(--fu); white-space: nowrap; text-align: center; text-decoration: none; cursor: pointer; transition: background-color .15s, border-color .15s; }
.rc-btn:hover { background: var(--chalk); }
.rc-btn--q { border-color: var(--line); }
.rc-btn--q:hover { border-color: var(--ink2); }
.rc-btn--q[aria-expanded="true"], .rc-btn--q.on { background: var(--chalk); border-color: var(--ink2); }
.rc-btn--q .rc-ic:last-child:not(:first-child) { width: 14px; height: 14px; color: var(--mute); }
.rc-btn--gold { border-color: var(--gold); background: var(--gold); color: var(--ink); font-weight: 600; min-height: 48px; padding: 0 22px; font-size: 15px; }
.rc-btn--gold:hover { background: #ffba2e; border-color: #ffba2e; }
.rc-btn--sm { min-height: 40px; padding: 0 10px; font-size: 13px; gap: 7px; }
.rc-btn.rc-ib { width: var(--ctl); padding: 0; }
.rc-btn--sm.rc-ib { width: 40px; }
.rc-btn:disabled, .rc-btn[aria-disabled="true"] { opacity: .45; cursor: default; pointer-events: none; }
.rc-btn b { font-weight: 600; }
.rc-seg { display: inline-flex; outline: 1px solid var(--line); outline-offset: -1px; border-radius: var(--r); background: #fff; overflow: hidden; flex: none; max-width: 100%; }
.rc-seg > button { display: inline-flex; align-items: center; justify-content: center; height: var(--ctl); padding: 0 14px; font: 500 13.5px/1 var(--fu); color: var(--ink); white-space: nowrap; border-radius: 0; text-align: center; }
.rc-seg > button + button { border-left: var(--hair); }
.rc-seg > button:hover { background: var(--chalk); }
.rc-seg > button[aria-pressed="true"] { background: var(--ink); color: #fff; }
.rc-seg > button:focus-visible { outline-offset: -3px; }
.rc-seg > button[aria-pressed="true"]:focus-visible { outline-color: var(--gold); }
.rc-seg .c1 { font-weight: 500; }
.rc-seg .c2 { font-weight: 400; }
.rc-seg--sm > button { height: 30px; padding: 0 10px; font-size: 12.5px; }
.rc-seg--scroll { overflow-x: auto; scrollbar-width: none; }
.rc-seg--scroll::-webkit-scrollbar { display: none; }
@media (pointer: coarse), (max-width: 1023px) { .rc-seg--sm > button { height: 44px; } }
.rc-tl { display: inline; padding: 0; font: inherit; font-weight: 500; color: var(--ink); text-decoration: underline; text-decoration-color: var(--line); text-decoration-thickness: 2px; text-underline-offset: 4px; border-radius: 0; }
.rc-tl:hover { text-decoration-color: var(--ink); }
.rc-eyebrow { font: 600 11px/1.2 var(--fu); letter-spacing: .12em; text-transform: uppercase; color: var(--mute); }
.rc-freetag { font: 500 12.5px/1 var(--fu); color: var(--ink2); border: var(--hair); border-radius: 3px; padding: 4px 8px; white-space: nowrap; }
.rc-badge { margin-left: 8px; font: 600 10.5px/1 var(--fu); letter-spacing: .1em; text-transform: uppercase; color: var(--ink2); border: var(--hair); border-radius: 3px; padding: 4px 7px; }

/* ---------- the bar: course, topic, search, booklet ---------- */
.rc-bar { flex: none; position: relative; z-index: 30; display: flex; align-items: center; gap: 6px; min-height: 56px; padding: 0 var(--rc-pad); border-bottom: var(--hair); background: #fff; }
.rc-swb { display: inline-flex; align-items: center; gap: 6px; height: var(--ctl); padding: 0 10px; font: 500 14px/1 var(--fu); color: var(--ink); white-space: nowrap; min-width: 0; border-radius: var(--r); }
.rc-swb:hover, .rc-swb[aria-expanded="true"] { background: var(--chalk); }
.rc-swb__t { overflow: hidden; text-overflow: ellipsis; }
.rc-swb__c { width: 14px; height: 14px; color: var(--mute); }
.rc-sep { color: #a9b3c3; font-size: 15px; padding: 0 1px; }
.rc-combo { display: none; }
.rc-search { position: relative; flex: 1 1 260px; max-width: 420px; margin-left: 12px; display: flex; align-items: center; }
.rc-search > .rc-ic { position: absolute; left: 11px; width: 16px; height: 16px; color: var(--mute); pointer-events: none; }
.rc-search input { width: 100%; height: var(--ctl); border: var(--hair); border-radius: var(--r); padding: 0 42px 0 34px; background: #fff; font: 400 14px/1 var(--fu); color: var(--ink); -webkit-appearance: none; appearance: none; }
.rc-search input::placeholder { color: var(--mute); opacity: 1; }
.rc-search input::-webkit-search-cancel-button { display: none; }
.rc-search input:focus { outline: 2px solid var(--navy); outline-offset: 0; border-color: var(--navy); }
.rc-search kbd { position: absolute; right: 9px; font: 500 11px/1 var(--fu); padding: 3px 6px; border: var(--hair); border-radius: 3px; background: var(--chalk); color: var(--mute); }
.rc-sbtn, .rc-scancel { display: none; }
.rc-bk { margin-left: auto; display: flex; align-items: center; gap: 6px; flex: none; }
.rc-bk .pl-bk-btn[hidden] { display: none !important; }

/* ---------- main area ---------- */
.rc-main { flex: 1; min-height: 0; display: flex; flex-direction: column; background: #fff; min-width: 0; overflow: hidden; }
.rc-main.is-home { overflow: auto; }
.skeleton { height: 100%; min-height: 200px; background: linear-gradient(100deg, #eef1f6 20%, #f8fafc 40%, #eef1f6 60%); background-size: 200% 100%; animation: rcShimmer 1.5s infinite; }
@keyframes rcShimmer { to { background-position: -200% 0; } }
.rc-notice { margin: auto; max-width: 460px; padding: 40px 24px; text-align: center; color: var(--ink2); }
.rc-notice h2 { font: 400 26px/1.2 var(--fd); color: var(--ink); margin: 0 0 8px; }
.rc-notice p { margin: 0 0 18px; font: 400 15px/1.55 var(--fu); }
.rc-muted { color: var(--mute); padding: 12px 0; margin: 0; }

/* topic header */
.rc-top { flex: none; display: flex; align-items: baseline; flex-wrap: wrap; gap: 4px 18px; padding: 10px var(--rc-pad) 6px; }
.rc-title { font: 400 28px/1.1 var(--fd); font-optical-sizing: auto; letter-spacing: -.012em; color: var(--ink); margin: 0; }
.rc-syl { font: 400 13.5px/1.3 var(--fu); color: var(--ink2); font-variant-numeric: tabular-nums; margin: 0; }
.rc-syl span { font: 600 10.5px/1 var(--fu); letter-spacing: .12em; text-transform: uppercase; color: var(--mute); margin-right: 8px; }
.rc-top__r { margin-left: auto; display: flex; align-items: center; flex-wrap: wrap; gap: 0 18px; }
.rc-lnk { display: inline-flex; align-items: center; justify-content: center; gap: 7px; min-height: var(--ctl); min-width: 44px; padding: 0 4px; margin: -8px 0; font: 500 14px/1 var(--fu); color: var(--ink); text-decoration: underline; text-decoration-color: var(--line); text-decoration-thickness: 2px; text-underline-offset: 5px; border-radius: 0; }
.rc-lnk:hover { text-decoration-color: var(--ink); }

/* ---------- the two families of tabs ---------- */
.rc-tabs { flex: none; display: flex; align-items: flex-end; gap: 26px; padding: 8px var(--rc-pad) 0; border-bottom: var(--hair); background: #fff; overflow-x: auto; scrollbar-width: none; }
.rc-tabs::-webkit-scrollbar { display: none; }
.rc-fam { display: flex; flex-direction: column; flex: none; min-width: 0; }
.rc-fh { display: block; margin: 0 0 5px; padding: 0 2px; font: 600 10.5px/1 var(--fu); letter-spacing: .12em; text-transform: uppercase; color: var(--mute); white-space: nowrap; }
.rc-fh b { font-weight: 600; color: var(--ink2); }
.rc-fh i { font-style: normal; }
.rc-ft { display: flex; align-items: stretch; }
.rc-tab { position: relative; display: inline-flex; align-items: center; gap: 8px; height: 48px; padding: 0 12px; color: var(--ink2); white-space: nowrap; text-align: left; border-radius: 0; }
.rc-fi { width: 16px; height: 16px; color: var(--mute); }
.rc-tt { display: flex; flex-direction: column; align-items: flex-start; gap: 3px; min-width: 0; }
.rc-tb { display: inline-flex; align-items: center; gap: 5px; font: 500 14px/1.1 var(--fu); }
.rc-tn { display: block; font: 400 12px/1.1 var(--fu); color: var(--mute); font-variant-numeric: tabular-nums; }
.rc-tab:hover { color: var(--ink); background: var(--chalk); }
.rc-tab[aria-selected="true"] { color: var(--ink); }
.rc-tab[aria-selected="true"] .rc-fi { color: var(--navy); }
/* Read: plain tabs with a navy rule under the open one */
.rc-tab--read[aria-selected="true"]::after { content: ""; position: absolute; left: 12px; right: 12px; bottom: 0; height: 2px; background: var(--navy); }
/* Practise: tabs sit on a chalk track, the open one lifts to white with a navy top edge */
.rc-track { align-self: flex-start; margin-bottom: 2px; background: var(--chalk); border: 1px solid var(--line); border-radius: 3px; }
.rc-track .rc-tab { height: 44px; padding: 0 12px; border-radius: 2px; }
.rc-track .rc-tab:hover { background: rgba(255, 255, 255, .7); }
.rc-track .rc-tab[aria-selected="true"] { background: #fff; box-shadow: 0 0 0 1px var(--line), inset 0 2px 0 var(--navy); }
@media (max-width: 1399px) { .rc-tn { font-size: 11.5px; } }
@media (max-width: 1139px) { .rc-tn, .rc-fi { display: none; } .rc-tabs { gap: 20px; } .rc-tab { height: 44px; } .rc-track .rc-tab { height: 44px; } }

/* ---------- viewer: toolbar, stage, panes ---------- */
.rc-view { flex: 1; min-height: 0; display: flex; flex-direction: column; background: var(--chalk); position: relative; }
.rc-view.fs, .rc-view:fullscreen { background: var(--chalk); }
.rc-view.fs { position: fixed; inset: 0; z-index: 1000; }
.rc-vbar { flex: none; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 20px; padding: 8px var(--rc-pad); background: #fff; border-bottom: var(--hair); }
.rc-vbar[hidden] { display: none; }
.rc-vbar__l { display: flex; align-items: center; flex-wrap: wrap; gap: 6px 14px; min-width: 0; flex: 1 1 auto; }
.rc-vl { display: flex; align-items: baseline; flex-wrap: wrap; gap: 4px 14px; min-width: 0; }
.rc-vt1 { font: 600 14px/1.25 var(--fu); }
.rc-vk { font: 400 13px/1.25 var(--fu); color: var(--ink2); font-variant-numeric: tabular-nums; }
.rc-vt { display: flex; align-items: center; flex-wrap: wrap; justify-content: flex-end; gap: 8px; flex: 0 1 auto; }
.rc-pick { display: flex; align-items: center; flex-wrap: wrap; gap: 6px 14px; min-width: 0; max-width: 100%; }
.rc-pick__g { display: inline-flex; align-items: center; gap: 8px; }
.rc-pick__l { font: 400 13px/1.2 var(--fu); color: var(--ink2); font-variant-numeric: tabular-nums; white-space: nowrap; }
.rc-zoom { display: inline-flex; outline: 1px solid var(--line); outline-offset: -1px; border-radius: var(--r); overflow: hidden; background: #fff; flex: none; }
.rc-zoom button { height: var(--ctl); min-width: 40px; padding: 0; display: inline-grid; place-items: center; font: 500 13px/1 var(--fu); text-align: center; border-radius: 0; color: var(--ink); }
.rc-zoom button + button { border-left: var(--hair); }
.rc-zoom button:hover { background: var(--chalk); }
.rc-zoom button .rc-ic { width: 16px; height: 16px; }
.rc-zoom button[data-v="0"] { min-width: 54px; }
@media (pointer: coarse), (max-width: 1023px) { .rc-zoom button { min-width: 44px; } .rc-zoom button[data-v="0"] { min-width: 56px; } }
.rc-pgi { font: 400 13px/1 var(--fu); color: var(--ink2); font-variant-numeric: tabular-nums; min-width: 78px; text-align: center; white-space: nowrap; }
.rc-pgi:empty { display: none; }
.rc-pairbar, .rc-pairx, .rc-actbar { display: none; }

.rc-stage { position: relative; flex: 1; min-height: 0; background: var(--canvas); overflow: hidden; }
.rc-stage.is-loading > .rc-panes:not(.incoming) { opacity: .45; }
.rc-stage.is-loading:before { content: ''; position: absolute; z-index: 5; top: 0; left: 0; width: 35%; height: 3px; background: var(--gold); animation: rcBar 1.2s ease-in-out infinite; }
@keyframes rcBar { from { transform: translateX(-100%); } to { transform: translateX(300%); } }
.rc-panes { position: absolute; inset: 0; display: grid; grid-template-columns: minmax(0, 1fr); grid-template-rows: minmax(0, 1fr); background: var(--canvas); transition: opacity .15s; }
.rc-panes.incoming { opacity: 0; pointer-events: none; }
.rc-panes.two { grid-template-columns: minmax(0, 1fr) 64px minmax(0, 1fr); }
.rc-pane { display: flex; flex-direction: column; min-width: 0; min-height: 0; container-type: inline-size; }
.rc-ph { flex: none; display: flex; align-items: center; gap: 8px; min-height: 54px; padding: 6px 12px; background: #fff; border-bottom: var(--hair); }
.rc-pt { min-width: 0; flex: 1; display: flex; flex-direction: column; gap: 2px; }
.rc-pt1 { font: 600 13.5px/1.2 var(--fu); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.rc-pt2 { font: 400 12px/1.2 var(--fu); color: var(--ink2); display: flex; align-items: center; flex-wrap: wrap; gap: 4px 8px; min-width: 0; }
.rc-pt2 > :first-child:not(.rc-seg):not(select) { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; }
.rc-pn { font: 500 12px/1 var(--fu); color: var(--mute); font-variant-numeric: tabular-nums; white-space: nowrap; margin-right: 2px; }
.rc-sel { height: 32px; max-width: 220px; padding: 0 26px 0 8px; border: var(--hair); border-radius: var(--r); background: #fff; color: var(--ink); font: 500 12.5px/1 var(--fu); }
@media (pointer: coarse), (max-width: 1023px) { .rc-sel { height: 44px; } }
@container (max-width: 600px) { .rc-ph .rc-lb { display: none; } .rc-ph .rc-btn--sm:not(.rc-ib) { width: var(--ctl); padding: 0; } }
.pdf-pages { flex: 1; min-height: 0; overflow: auto; overscroll-behavior: contain; background: var(--canvas); padding: 18px 12px 28px; display: flex; flex-direction: column; gap: 10px; -webkit-overflow-scrolling: touch; }
.pdf-pages .pg { flex: none; margin: 0 auto; max-width: 100%; background: #fff; box-shadow: var(--sh); border: 1px solid rgba(13, 31, 60, .08); }
.pdf-pages.is-zoomed .pg { max-width: none; }
.pdf-pages .pg canvas { display: block; width: 100%; height: 100%; }
.pdf-pages .pg--img { width: calc(min(100%, 960px) * var(--z, 1)); }
.pdf-pages .pg--img img { display: block; width: 100%; height: auto; aspect-ratio: 1100 / 1557; background: #fff; }
.pdf-pages__load { margin: auto; color: var(--ink2); display: flex; flex-direction: column; align-items: center; gap: 12px; font: 400 14px/1.4 var(--fu); text-align: center; }
.spinner { width: 32px; height: 32px; border: 3px solid rgba(27, 58, 107, .15); border-top-color: var(--gold); border-radius: 50%; animation: rcSpin .8s linear infinite; }
@keyframes rcSpin { to { transform: rotate(360deg); } }
.rc-endnote { max-width: 640px; margin: 2px auto 0; padding: 0 8px; text-align: center; font: 400 12.5px/1.5 var(--fu); color: var(--mute); }
.rc-spine { display: flex; flex-direction: column; align-items: center; padding-top: 6px; background: #fff; border-left: var(--hair); border-right: var(--hair); }
.rc-sync { display: flex; flex-direction: column; align-items: center; gap: 7px; width: 100%; min-height: 44px; padding: 8px 4px; font: 500 10.5px/1.15 var(--fu); color: var(--ink2); text-align: center; }
.rc-sync:hover { color: var(--ink); }
.rc-tk { position: relative; width: 32px; height: 18px; border: 1px solid var(--ink2); border-radius: 3px; background: #fff; flex: none; }
.rc-tk i { position: absolute; left: 2px; top: 2px; width: 12px; height: 12px; border-radius: 2px; background: var(--ink2); }
.rc-sync[aria-pressed="true"] .rc-tk { background: var(--navy); border-color: var(--navy); }
.rc-sync[aria-pressed="true"] .rc-tk i { left: 16px; background: #fff; }
.rc-l1 { display: none; }
.rc-demosheet { width: min(100%, 720px); margin: 0 auto; padding: 36px 40px; background: #fff; box-shadow: var(--sh); border: 1px solid rgba(13, 31, 60, .08); }
.rc-demosheet h3 { font: 400 28px/1.15 var(--fd); margin: 10px 0 12px; letter-spacing: -.01em; }
.rc-demosheet p { font: 400 14px/1.55 var(--fu); color: var(--ink2); margin: 0 0 14px; }
.rc-demosheet__more { margin: 14px 0 0 !important; color: var(--mute) !important; }
.rc-pql { border-top: 1px solid var(--ink); }
.rc-pql li { display: grid; grid-template-columns: 112px 52px 40px 52px minmax(0, 1fr); gap: 0 12px; align-items: baseline; padding: 9px 4px; border-bottom: var(--hair); font: 400 13.5px/1.4 var(--fu); font-variant-numeric: tabular-nums; }
.rc-pql li.hd { padding: 8px 4px; font: 600 10.5px/1 var(--fu); letter-spacing: .1em; text-transform: uppercase; color: var(--mute); }

/* ---------- locked material (calm panel on the chalk canvas) ---------- */
.rc-canvas { flex: 1; min-height: 0; overflow: auto; background: var(--chalk); padding: 28px var(--rc-pad) 48px; }
.rc-sheet { max-width: 680px; margin: 0 auto; background: #fff; border: 1px solid rgba(13, 31, 60, .08); box-shadow: var(--sh); padding: 40px 44px; }
.rc-sheet h2 { font: 400 34px/1.12 var(--fd); font-optical-sizing: auto; letter-spacing: -.012em; margin: 12px 0 14px; text-wrap: balance; }
.rc-lead { font: 400 16px/1.55 var(--fu); color: var(--ink2); max-width: 34em; text-wrap: pretty; margin: 0; }
.rc-inc { display: grid; grid-template-columns: 1fr 1fr; column-gap: 32px; margin: 24px 0 4px; border-top: var(--hair); }
.rc-inc li { padding: 11px 0; border-bottom: var(--hair); font: 500 15px/1.3 var(--fu); }
.rc-price { margin: 26px 0 18px; display: flex; align-items: baseline; gap: 10px; }
.rc-amt { font: 400 38px/1 var(--fd); letter-spacing: -.01em; font-variant-numeric: lining-nums; }
.rc-per { font: 400 15px/1 var(--fu); color: var(--ink2); }
.rc-cta { display: flex; align-items: center; flex-wrap: wrap; gap: 8px 24px; }
.rc-fine { margin: 22px 0 0; padding-top: 14px; border-top: var(--hair); font: 400 13.5px/1.55 var(--fu); color: var(--ink2); }

/* ---------- subject home ---------- */
.rc-home { padding: 22px var(--rc-pad) 40px; max-width: 1180px; width: 100%; margin: 0 auto; }
.rc-home__h h2 { font: 400 30px/1.15 var(--fd); letter-spacing: -.012em; margin: 0; }
.rc-home__h p { margin: 6px 0 18px; font: 400 14px/1.4 var(--fu); color: var(--ink2); font-variant-numeric: tabular-nums; }
.rc-unlock { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px 24px; padding: 18px 20px; margin-bottom: 22px; background: var(--chalk); border: var(--hair); border-radius: var(--r); }
.rc-unlock h3 { font: 400 22px/1.2 var(--fd); margin: 0; }
.rc-unlock p { margin: 4px 0 0; font: 400 14px/1.5 var(--fu); color: var(--ink2); max-width: 44em; }
.rc-unlock__b { display: flex; align-items: center; flex-wrap: wrap; gap: 8px 22px; }
.rc-tgrid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 0 28px; border-top: 1px solid var(--ink); }
.rc-tcard { display: flex; gap: 14px; align-items: flex-start; padding: 14px 4px; min-height: 76px; border-bottom: var(--hair); color: var(--ink); text-decoration: none; }
.rc-tcard:hover { background: var(--chalk); }
.rc-tcard.is-locked { color: var(--ink2); }
.rc-tn { flex: none; width: 24px; font: 600 13px/1.4 var(--fu); color: var(--ink2); font-variant-numeric: tabular-nums; }
.rc-tb2 { flex: 1; display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.rc-tb2 b { font: 500 15px/1.3 var(--fu); }
.rc-tb2 small { color: var(--mute); font: 400 12.5px/1.4 var(--fu); }
.rc-tb2 .rc-freetag { align-self: flex-start; margin-top: 3px; }

/* ---------- topic overview (no material open yet) ---------- */
.rc-view.is-land { background: #fff; overflow: auto; }
.rc-land { flex: 1; min-height: 0; }
.rc-land__in { max-width: 1120px; margin: 0 auto; padding: 22px var(--rc-pad) 56px; }
.rc-sum { font: 400 16px/1.55 var(--fu); color: var(--ink2); max-width: 46em; margin: 0 0 24px; }
.rc-cols { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 40px; align-items: start; }
.rc-lane { margin-bottom: 28px; min-width: 0; }
.rc-lh { margin: 0; padding: 0 0 10px; font: 600 11px/1 var(--fu); letter-spacing: .12em; text-transform: uppercase; color: var(--ink2); }
.rc-lh i { font-style: normal; color: var(--mute); }
.rc-lane--read .rc-lh { border-bottom: 2px solid var(--navy); }
.rc-lane--read .rc-mats { border-top: 0; }
.rc-lane--prac .rc-mats, .rc-lane--past .rc-mats { background: var(--chalk); border: 1px solid var(--line); border-radius: 3px; padding: 0 14px; }
.rc-lane--prac .rc-lh, .rc-lane--past .rc-lh { padding-bottom: 8px; }
.rc-mat { display: grid; grid-template-columns: 28px minmax(0, 1fr) auto; gap: 0 12px; align-items: center; padding: 14px 0; border-bottom: var(--hair); }
.rc-lane--prac .rc-mat:last-child, .rc-lane--past .rc-mat:last-child { border-bottom: 0; }
.rc-mat__i { color: var(--navy); display: grid; place-items: center; }
.rc-mat__b h4 { margin: 0; font: 600 15px/1.3 var(--fu); display: flex; align-items: center; flex-wrap: wrap; gap: 8px; }
.rc-mat__b p { margin: 3px 0 0; font: 400 13.5px/1.5 var(--fu); color: var(--ink2); }
.rc-mat__a { display: flex; align-items: center; flex-wrap: wrap; justify-content: flex-end; gap: 6px; }
.rc-act-l { font: 500 13px/1 var(--fu); color: var(--mute); margin-right: 2px; }
.rc-meta { font: 400 13px/1 var(--fu); color: var(--mute); margin-left: 4px; }
.rc-mat.is-locked .rc-mat__b p { color: var(--mute); }
.rc-about { margin-top: 12px; padding-top: 22px; border-top: 1px solid var(--ink); }
.rc-about h2 { font: 400 24px/1.2 var(--fd); margin: 0 0 6px; }
.rc-about__b { max-width: 46em; }
.rc-about h3, .rc-dwb h3 { font: 600 11px/1 var(--fu); letter-spacing: .12em; text-transform: uppercase; color: var(--mute); margin: 22px 0 8px; }
.rc-about li, .rc-dwb li { padding: 7px 0; font: 400 14.5px/1.5 var(--fu); border-bottom: 1px solid #eaeef3; }
.rc-about li:last-child, .rc-dwb li:last-child { border-bottom: 0; }
.rc-about p, .rc-dwb p { margin: 0; font: 400 14.5px/1.55 var(--fu); }
.rc-warn li { display: flex; gap: 10px; align-items: flex-start; }
.rc-warn .rc-ic { width: 15px; height: 15px; margin-top: 3px; color: var(--ink2); }

/* ---------- popovers, sheets, drawer ---------- */
.rc-scrim { position: fixed; inset: 0; z-index: 1190; background: rgba(13, 31, 60, .38); }
.rc-pop { position: fixed; z-index: 1200; background: #fff; border: var(--hair); border-radius: var(--r); box-shadow: 0 12px 36px rgba(13, 31, 60, .16), 0 2px 6px rgba(13, 31, 60, .08); min-width: 240px; max-width: min(380px, calc(100vw - 16px)); max-height: min(70vh, 560px); overflow: auto; padding: 6px 0; }
.rc-pop[hidden] { display: none; }
.rc-pop--topic { width: 340px; padding-top: 0; }
.rc-pop--course { width: 340px; }
.rc-pop--side { width: 268px; }
.rc-pop--dl { min-width: 200px; }
.rc-pop--mat { width: 320px; }
.rc-pop--search { width: 420px; max-width: calc(100vw - 16px); padding: 0; }
.rc-sx { display: none; }
.rc-ph3 { margin: 0; padding: 10px 16px 6px; font: 600 10.5px/1.2 var(--fu); letter-spacing: .12em; text-transform: uppercase; color: var(--mute); }
.rc-ph3--s { padding-top: 4px; }
.rc-pi { display: flex; align-items: center; gap: 10px; width: 100%; min-height: var(--ctl); padding: 8px 16px; font: 500 14px/1.3 var(--fu); color: var(--ink); border-radius: 0; text-align: left; }
.rc-pi:hover, .rc-pi:focus-visible { background: var(--chalk); }
.rc-pi:focus-visible { outline-offset: -2px; }
.rc-pi:disabled { color: var(--mute); cursor: default; }
.rc-pi:disabled:hover { background: none; }
.rc-pn2 { width: 22px; flex: none; color: var(--mute); font-variant-numeric: tabular-nums; font-weight: 500; }
.rc-pl { flex: 1; min-width: 0; }
.rc-ps { font: 400 12px/1 var(--fu); color: var(--mute); white-space: nowrap; }
.rc-pdiv { height: 1px; background: var(--line); margin: 6px 0; }
.rc-pf { position: sticky; top: 0; background: #fff; padding: 10px 12px 8px; border-bottom: var(--hair); z-index: 1; }
.rc-pf input { width: 100%; height: var(--ctl); border: var(--hair); border-radius: var(--r); padding: 0 12px; font: 400 14px/1 var(--fu); background: #fff; color: var(--ink); }
.rc-pf input:focus { outline: 2px solid var(--navy); outline-offset: 0; border-color: var(--navy); }
.rc-pfoot { position: sticky; bottom: 0; margin: 0; background: #fff; padding: 10px 16px 8px; font: 400 12.5px/1.4 var(--fu); color: var(--mute); border-top: var(--hair); font-variant-numeric: tabular-nums; }
.rc-pe { padding: 14px 16px; color: var(--ink2); font: 400 14px/1.4 var(--fu); margin: 0; }
.rc-courses { padding: 0 8px 6px; }
.sp-title { font: 600 10.5px/1.2 var(--fu); letter-spacing: .12em; text-transform: uppercase; color: var(--mute); padding: 8px 8px 4px; }
.sp-row { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 4px 8px; flex-wrap: wrap; }
.sp-name { font: 500 14px/1.3 var(--fu); color: var(--ink); }
.sp-pills { display: flex; gap: 6px; }
.sp-pill { display: inline-flex; align-items: center; gap: 5px; min-height: 36px; padding: 4px 12px; border: var(--hair); background: #fff; border-radius: var(--r); color: var(--ink); font: 600 13px/1 var(--fu); }
.sp-pill:hover:not(:disabled) { border-color: var(--ink2); background: var(--chalk); }
.sp-pill.on { background: var(--ink); border-color: var(--ink); color: #fff; }
.sp-pill:disabled { opacity: .35; cursor: not-allowed; }
.sp-lk { font: 500 11px/1 var(--fu); opacity: .8; }
.sp-pill .rc-lk { color: currentColor; }
.rc-sr { display: flex; align-items: baseline; gap: 12px; width: 100%; padding: 11px 16px; border-bottom: var(--hair); font: 500 14px/1.3 var(--fu); border-radius: 0; text-align: left; }
.rc-sr:last-child { border-bottom: 0; }
.rc-sr:hover, .rc-sr[aria-selected="true"] { background: var(--chalk); }
.rc-sr__k { flex: none; width: 76px; font: 600 10.5px/1.3 var(--fu); letter-spacing: .1em; text-transform: uppercase; color: var(--mute); }
.rc-sr__l { flex: 1; min-width: 0; }
.rc-sr small { display: block; font: 400 12.5px/1.35 var(--fu); color: var(--ink2); margin-top: 1px; }
.rc-drawer { position: fixed; z-index: 1210; top: var(--psh-top, 56px); bottom: 0; right: 0; width: min(400px, 100%); display: flex; flex-direction: column; background: #fff; border-left: var(--hair); box-shadow: -14px 0 32px rgba(13, 31, 60, .10); transform: translateX(100%); visibility: hidden; transition: transform .18s ease, visibility 0s .18s; }
.rc-drawer.open { transform: none; visibility: visible; transition: transform .18s ease; }
.rc-dwh { display: flex; align-items: flex-start; gap: 12px; padding: 18px 20px 14px; border-bottom: var(--hair); }
.rc-dwh > div { flex: 1; }
.rc-dwh h2 { font: 400 26px/1.15 var(--fd); margin: 6px 0 0; letter-spacing: -.01em; }
.rc-dwb { flex: 1; overflow: auto; padding: 18px 20px 32px; }
.rc-dwb .rc-lead { font-size: 15px; max-width: none; }
.rc-sylx { margin: 12px 0 4px; font: 400 13.5px/1.4 var(--fu); color: var(--ink2); font-variant-numeric: tabular-nums; }
.rc-dwb h3 { padding-top: 16px; border-top: var(--hair); }

/* ---------- formula / data booklet buttons and viewer (js/photon-booklet.js) ---------- */
.pl-bk-btn { display: inline-flex; align-items: center; gap: 8px; min-height: var(--ctl); padding: 0 14px; border: 1px solid var(--line); border-radius: var(--r); background: #fff; color: var(--ink); font: 500 14px/1 var(--fu); white-space: nowrap; cursor: pointer; }
.pl-bk-btn:hover { background: var(--chalk); border-color: var(--ink2); }
.pl-bk-btn svg { width: 16px; height: 16px; flex: none; }
.pl-bk-btn[hidden] { display: none !important; }
.pl-bk-overlay { position: fixed; inset: 0; background: rgba(13, 31, 60, .55); z-index: 10001; display: none; align-items: center; justify-content: center; padding: 18px; }
.pl-bk-overlay.open { display: flex; }
.pl-bk-modal { background: #fff; width: min(960px, 96vw); height: 90vh; border-radius: var(--r); overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 30px 80px rgba(0, 0, 0, .45); }
.pl-bk-frame { flex: 1; border: 0; width: 100%; background: #525866; }
.pl-vm-head { display: flex; align-items: center; gap: 12px; padding: 10px 16px; background: #fff; border-bottom: var(--hair); flex-shrink: 0; }
.pl-vm-head__k { font: 600 10px/1 var(--fu); letter-spacing: .16em; text-transform: uppercase; color: var(--mute); }
.pl-vm-head__t { font: 400 17px/1.3 var(--fd); color: var(--ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pl-btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 40px; padding: 0 12px; border: var(--hair); border-radius: var(--r); background: #fff; color: var(--ink); font: 500 13px/1 var(--fu); text-decoration: none; cursor: pointer; }
.pl-btn:hover { background: var(--chalk); }
.pl-bk-menu { position: absolute; z-index: 10002; min-width: 230px; background: #fff; border: var(--hair); border-radius: var(--r); box-shadow: 0 14px 36px rgba(13, 31, 60, .22); padding: 6px; font-family: var(--fu); }
.pl-bk-menu__h { font: 600 10.5px/1 var(--fu); letter-spacing: .1em; text-transform: uppercase; color: var(--mute); padding: 8px 10px 6px; }
.pl-bk-menu button { display: flex; width: 100%; min-height: 40px; justify-content: space-between; align-items: center; gap: 14px; background: none; border: 0; border-radius: var(--r); padding: 8px 10px; font: 500 13.5px/1.2 var(--fu); color: var(--ink); cursor: pointer; text-align: left; }
.pl-bk-menu button:hover { background: var(--chalk); }
.pl-bk-menu button em { font-style: normal; font-size: 11.5px; color: var(--mute); }

/* ---------- tablets: 600 to 1023px (rail is icons and labels; two documents stack) ---------- */
@media (max-width: 1023px) {
  .rc-search { display: none; }
  .rc-sbtn { display: inline-grid; margin-left: auto; }
  .rc-bk { margin-left: 0; }
  body.rc-searching .rc-search { display: flex; position: absolute; left: 0; right: 0; top: 0; height: 100%; max-width: none; margin: 0; padding: 0 12px; background: #fff; z-index: 5; align-items: center; gap: 4px; }
  body.rc-searching .rc-search > .rc-ic { left: 23px; }
  body.rc-searching .rc-search input { padding-left: 34px; padding-right: 12px; }
  body.rc-searching .rc-search kbd { display: none; }
  body.rc-searching .rc-scancel { display: inline-flex; align-items: center; height: var(--ctl); padding: 0 12px 0 14px; font: 500 14px/1 var(--fu); }
  .rc-tabs { padding-left: 12px; padding-right: 12px; gap: 14px; }
  .rc-tab { padding: 0 6px; }
  .rc-tab--read[aria-selected="true"]::after { left: 6px; right: 6px; }
  .rc-vbar { gap: 8px 12px; }
  .rc-vt .rc-pdf, .rc-vt .rc-wth { display: none; }
  .rc-panes.two { grid-template-columns: minmax(0, 1fr); grid-template-rows: minmax(0, 1fr) 46px minmax(0, 1fr); }
  .rc-spine { flex-direction: row; justify-content: center; padding: 0; border: 0; border-top: var(--hair); border-bottom: var(--hair); }
  .rc-sync { flex-direction: row; justify-content: center; gap: 10px; width: auto; height: 100%; padding: 0 16px; font-size: 12.5px; }
  .rc-sync .rc-l1 { display: block; } .rc-sync .rc-l2 { display: none; }
  .rc-sheet { padding: 30px 28px; }
  .rc-cols { grid-template-columns: minmax(0, 1fr); }
  .rc-pop--topic, .rc-pop--course { max-width: calc(100vw - 16px); }
}

/* ---------- phones: under 600px (course and topic are one switcher, actions sit above the tab bar) ---------- */
@media (max-width: 599px) {
  .rc-bar { padding: 0 6px 0 12px; gap: 2px; }
  .rc-swb:not(.rc-combo), .rc-sep { display: none; }
  .rc-combo { display: inline-flex; flex: 1; min-width: 0; font-size: 15px; padding: 0 8px; }
  .rc-sbtn { margin-left: 0; }
  .rc-bk .pl-bk-btn { padding: 0; min-width: var(--ctl); justify-content: center; }
  .rc-bk .pl-bk-btn > span { display: none; }
  .rc-top { padding: 8px 16px 4px; flex-wrap: nowrap; align-items: center; }
  .rc-title { font-size: 23px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; }
  .rc-syl, .rc-freetag { display: none; }
  .rc-top__r { gap: 0 8px; flex: none; }
  .rc-top__r .rc-lnk[href] { display: none; }
  .rc-tabs { display: block; padding: 0; gap: 0; overflow: visible; border-bottom: var(--hair); }
  .rc-fam { flex-direction: row; align-items: center; padding: 6px 0 6px 12px; }
  .rc-fam--prac { background: var(--chalk); border-top: var(--hair); }
  .rc-fh { flex: none; width: 64px; margin: 0; padding: 0 6px 0 0; }
  .rc-fh i { display: none; }
  .rc-ft { flex: 1; min-width: 0; overflow-x: auto; scrollbar-width: none; padding: 3px 12px 3px 3px; margin: -3px 0; gap: 8px; }
  .rc-ft::-webkit-scrollbar { display: none; }
  .rc-track { align-self: auto; margin-bottom: 0; background: none; border: 0; border-radius: 0; }
  .rc-tab, .rc-track .rc-tab { height: 44px; padding: 0 14px; gap: 6px; border: var(--hair); border-radius: var(--r); background: #fff; box-shadow: none; }
  .rc-tab:hover, .rc-track .rc-tab:hover { background: #fff; }
  .rc-tab .rc-fi, .rc-tn { display: none; }
  .rc-tab[aria-selected="true"], .rc-track .rc-tab[aria-selected="true"] { background: var(--ink); color: #fff; border-color: var(--ink); box-shadow: none; }
  .rc-tab--read[aria-selected="true"]::after { display: none; }
  .rc-tab[aria-selected="true"] .rc-lk { color: #fff; }
  .rc-tab[aria-selected="true"]:focus-visible { outline-color: var(--gold); }
  .rc-vbar { padding: 6px 12px; gap: 6px 10px; flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; }
  .rc-vbar::-webkit-scrollbar { display: none; }
  .rc-vbar__l { flex: 1 1 0; min-width: 0; flex-wrap: nowrap; }
  .rc-pick { flex-wrap: nowrap; }
  .rc-pick__l { display: none; }
  .rc-seg--scroll { max-width: 100%; }
  .rc-seg > button { padding: 0 12px; }
  .rc-vt { flex: none; flex-wrap: nowrap; }
  .rc-vt .rc-seg, .rc-vt .rc-zoom, .rc-vt .rc-pgi, .rc-vt .rc-dl, .rc-vt .rc-pr, .rc-vt .rc-fs, .rc-vt .rc-nt { display: none; }
  .rc-vt .rc-btn--q { padding: 0 11px; gap: 6px; }
  .rc-vbar.is-two .rc-pick, .rc-vbar.is-two .rc-vl { display: none; }
  .rc-vbar.is-two .rc-pairbar, .rc-vbar.is-two .rc-pairx { display: inline-flex; }
  .rc-vbar.is-two .rc-vt .rc-btn--q { display: none; }
  .rc-vbar.is-two .rc-vt .rc-zoom { display: none; }
  .rc-panes.two { display: block; }
  .rc-panes.two .rc-pane { position: absolute; inset: 0; }
  .rc-panes.two .rc-pane:not(.on) { visibility: hidden; pointer-events: none; }
  .rc-panes.two .rc-ph, .rc-panes.two .rc-spine { display: none; }
  .pdf-pages { padding: 10px 8px 20px; }
  .rc-actbar { display: flex; flex: none; align-items: center; justify-content: space-between; gap: 6px; padding: 6px 10px; min-height: 64px; background: #fff; border-top: var(--hair); }
  .rc-actbar[hidden] { display: none; }
  .rc-actbar .rc-seg { flex: none; }
  .rc-actbar .rc-seg > button { height: 44px; padding: 0 11px; font-size: 13px; }
  .rc-bb { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; min-width: 56px; min-height: 52px; padding: 4px 6px; font: 500 11.5px/1 var(--fu); color: var(--ink); text-align: center; }
  .rc-bb:active { background: var(--chalk); }
  .rc-bb:disabled { opacity: .45; }
  .rc-bb .rc-ic { width: 20px; height: 20px; }
  .rc-bbpg { flex: 1; font: 500 13px/1.2 var(--fu); color: var(--ink2); font-variant-numeric: tabular-nums; padding-left: 6px; }
  .rc-canvas { padding: 12px 10px 24px; }
  .rc-sheet { padding: 26px 20px 28px; box-shadow: none; }
  .rc-sheet h2 { font-size: 28px; }
  .rc-inc { grid-template-columns: 1fr; margin-top: 18px; }
  .rc-cta .rc-btn { width: 100%; }
  .rc-land__in { padding-top: 14px; }
  .rc-mat { grid-template-columns: 24px minmax(0, 1fr); }
  .rc-mat__a { grid-column: 2; justify-content: flex-start; margin-top: 8px; }
  .rc-home { padding-top: 14px; }
  .rc-tgrid { grid-template-columns: minmax(0, 1fr); }
  .rc-unlock { padding: 16px; }
  .rc-unlock__b .rc-btn { width: 100%; }
  .rc-pql li { grid-template-columns: auto auto 1fr auto; gap: 2px 14px; padding: 11px 2px; }
  .rc-pql li.hd { display: none; }
  .rc-pql li > span:nth-child(5) { grid-column: 1 / -1; }
  .rc-demosheet { padding: 24px 18px; }
  .toast { bottom: calc(var(--psh-bottom, 0px) + 76px) !important; }
  /* popovers become bottom sheets above the tab bar */
  .rc-pop { left: 0 !important; right: 0 !important; top: auto !important; bottom: 0 !important; width: auto !important; max-width: none; max-height: 80dvh; border-radius: 6px 6px 0 0; padding-bottom: env(safe-area-inset-bottom); border-width: 1px 0 0; }
  .rc-pop--search { top: calc(var(--psh-top, 56px) + 56px) !important; bottom: auto !important; border-radius: 0; max-height: 62dvh; border-width: 0 0 1px; }
  .rc-sx { display: grid; position: absolute; right: 2px; top: 2px; width: 44px; height: 44px; place-items: center; color: var(--ink2); z-index: 2; }
  .rc-ph3, .rc-pf { padding-right: 52px; }
  .rc-drawer { inset: 0; width: 100%; top: 0; bottom: 0; border-left: 0; }
  .rc-dwh { padding-top: calc(16px + env(safe-area-inset-top)); }
  .rc-sr__k { width: 64px; }
  .rc-about li, .rc-dwb li, .rc-sum { font-size: 15px; }
}
@media (max-width: 359px) { .rc-sheet h2 { font-size: 25px; } .rc-bb { min-width: 48px; } .rc-actbar .rc-seg > button { padding: 0 8px; } }
@media (prefers-reduced-motion: reduce) { .rc *, .rc-pop, .rc-drawer { animation: none !important; transition: none !important; scroll-behavior: auto !important; } }

/* "Full past papers" beside the Past IB picker and in the overview lane */
.rc-lnk--fp { margin: 0; min-height: 36px; font-size: 13.5px; }
.rc-lh--past { display: flex; align-items: center; flex-wrap: wrap; gap: 4px 0; }
.rc-lh--past .rc-lnk--fp { margin-left: auto; text-transform: none; letter-spacing: 0; font-weight: 500; }
@media (max-width: 599px) { .rc-vbar .rc-lnk--fp { display: none; } }
.rc-seg > button .c2 { margin-left: .3em; }
.rc-vt { margin-left: auto; }
.rc-drawer ul, .rc-drawer ol { list-style: none; margin: 0; padding: 0; }
.rc-dwb .rc-lead { margin-bottom: 12px; }

/* touch: every control is at least 44px in both directions */
@media (pointer: coarse), (max-width: 1023px) {
  .rc-seg > button { min-width: 44px; }
  .rc-lnk--fp { min-height: 44px; }
  .rc-cta .rc-tl, .rc-unlock__b .rc-tl { display: inline-flex; align-items: center; min-height: 44px; }
  /* inline links inside a sentence get a 44px hit area without changing the line height */
  .rc-fine .rc-tl { display: inline-block; padding: 14px 0; margin: -14px 0; }
}

@media (pointer: coarse), (max-width: 1023px) {
  .rc-btn--sm { min-height: 44px; }
  .rc-btn--sm.rc-ib { width: 44px; }
}

/* ---------- short screens (landscape phones, small windows): the page scrolls, the document keeps a full-height pane ---------- */
@media (max-height: 560px) {
  body.app26.app26-fill.rc-page { height: auto; min-height: 100vh; min-height: 100dvh; overflow: auto; display: block; }
  .rc-page .rc { min-height: calc(100dvh - var(--psh-top, 56px) - var(--psh-bottom, 0px)); }
  .rc-bar { position: sticky; top: var(--psh-top, 56px); }
  .rc-main { flex: none; overflow: visible; }
  .rc-main.is-home { overflow: visible; }
  .rc-view { flex: none; height: calc(100dvh - var(--psh-top, 56px) - var(--psh-bottom, 0px) - 48px); min-height: 300px; }
  .rc-view.is-land { height: auto; min-height: 0; overflow: visible; }
  .rc-view.fs, .rc-view:fullscreen { height: 100dvh; }
  .rc-fh { display: none; }
  .rc-tab, .rc-track .rc-tab { height: 40px; }
  .rc-top { padding-top: 6px; padding-bottom: 2px; }
  .rc-title { font-size: 22px; }
}

/* toolbar width budget: shorter labels below 1280, page indicator only where it fits */
@media (max-width: 1279px) {
  .rc-vt .rc-pdf, .rc-vt .rc-wth { display: none; }
  .rc-pgi { display: none; }
  .rc-vt { gap: 6px; }
}
@media (max-height: 560px) {
  .rc-vt .rc-zoom, .rc-vt .rc-nt { display: none; }
  .rc-vbar { padding-top: 6px; padding-bottom: 6px; gap: 6px 12px; }
}
.rc-seg > button { flex: none; }
.rc-arrows { display: inline-flex; gap: 4px; flex: none; }
.rc-flip { transform: rotate(180deg); }