/* Hallmark · pre-emit critique: P5 H4 E4 S5 R5 V4 */
/* Hallmark · macrostructure: Map / Diagram · theme: approved Overground handoff
 * User-approved vertical kicker, exact hexadecimal tokens and diagram scrolling retained.
 */
html,body { overflow-x:clip; }
.og-brand,.og-brand * { box-sizing:border-box; }
.og-brand {
 margin:0;color:var(--color-ink);font-family:var(--font-body);font-size:16px;line-height:1.6;
 background-color:var(--color-paper);
 background-image:linear-gradient(var(--color-grid-major) 1px,transparent 1px),linear-gradient(90deg,var(--color-grid-major) 1px,transparent 1px),linear-gradient(var(--color-grid-minor) 1px,transparent 1px),linear-gradient(90deg,var(--color-grid-minor) 1px,transparent 1px);
 background-size:100px 100px,100px 100px,20px 20px,20px 20px;background-position:-1px -1px;
}
.og-brand a {color:var(--color-link);text-underline-offset:.2em;}
.og-brand a:hover {color:var(--color-accent-800);}
.og-brand a:active {text-decoration-thickness:2px;}
.og-brand :focus-visible {outline:2px solid var(--color-accent);outline-offset:2px;}
.og-brand [aria-disabled=true],.og-brand :disabled {opacity:.55;cursor:not-allowed;}
.og-nav {max-width:1160px;margin:auto;padding:18px 28px;display:flex;gap:22px;align-items:center;flex-wrap:wrap;}
.og-lockup {margin-right:auto;display:block;line-height:1;flex:0 1 340px;}
.og-lockup svg {width:100%;height:auto;display:block;}
.og-nav-links {display:flex;gap:20px;flex-wrap:wrap;align-items:center;}
.og-nav-links a {text-decoration:none;white-space:nowrap;min-height:44px;display:flex;align-items:center;}
.og-main {max-width:1100px;margin:auto;padding:40px 28px 48px;}
.og-opening {display:grid;grid-template-columns:64px minmax(0,1fr);padding:16px 0 44px;}
.og-vertical {display:flex;align-items:flex-start;padding-top:8px;}
.og-kicker {writing-mode:vertical-rl;transform:rotate(180deg);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;font-weight:600;color:var(--color-teal-text);}
.og-opening-content {border-left:2px solid var(--color-accent);padding-left:clamp(18px,3vw,32px);min-width:0;}
.og-brand h1,.og-brand h2,.og-brand h3 {font-family:var(--font-heading);font-weight:600;font-style:normal;line-height:1.1;letter-spacing:-.01em;overflow-wrap:anywhere;min-width:0;color:var(--color-ink);}
.og-brand h1 {font-size:clamp(32px,4.4vw,46px);line-height:1.05;max-width:18ch;margin:0 0 16px;}
.og-brand h2 {font-size:28px;}
.og-intro {max-width:58ch;margin:0 0 16px;background:var(--color-paper);box-shadow:0 0 0 10px var(--color-paper);border-radius:2px;}
.og-actions {display:flex;gap:10px;flex-wrap:wrap;}
.og-actions a {display:inline-flex;align-items:center;justify-content:center;min-height:44px;border-radius:var(--radius-button);padding:10px 18px;white-space:nowrap;font-weight:600;text-decoration:none;background:var(--color-paper);border:1px solid var(--color-divider);}
.og-actions .og-primary {background:var(--color-button);color:var(--color-white);border-color:var(--color-button);}
.og-actions .og-primary:hover {background:var(--color-link);border-color:var(--color-link);color:var(--color-white);}
.og-actions a:active {box-shadow:inset 0 0 0 2px var(--color-ink);}
.og-map-scroll {margin-top:28px;overflow-x:auto;overscroll-behavior-inline:contain;}
.og-network {width:100%;min-width:760px;display:block;font-family:var(--font-body);}
.og-network a:hover text,.og-network a:focus-visible text {text-decoration:underline;}
.og-network a:focus-visible {outline:3px solid var(--color-link);}
.og-legend {display:flex;gap:18px 22px;flex-wrap:wrap;font-size:12.5px;margin:16px 0;}
.og-legend span {display:flex;align-items:center;gap:8px;}
.og-legend i {width:14px;height:14px;flex:none;border:3px solid var(--color-accent);border-radius:50%;background:var(--color-paper);}
.og-legend .og-open {height:22px;width:12px;border-radius:999px;background:var(--color-accent);border:2px solid var(--color-paper);box-shadow:0 0 0 1.5px var(--color-accent);}
.og-legend .og-interchange {border-color:var(--color-ink);}
.og-legend .og-tick {width:4px;height:12px;border:0;background:var(--color-teal);border-radius:2px;}
.og-map-help,.og-station-notes {background:var(--color-paper);border-top:1px solid var(--color-divider);padding:24px 0;margin-top:24px;max-width:72ch;}
.og-map-help p,.og-station-notes p {max-width:65ch;}
.og-map-help summary {cursor:pointer;font-weight:600;padding:8px 0;}
.og-footer {max-width:1100px;margin:auto;padding:32px 28px 48px;border-top:1px solid var(--color-divider);}
.og-footer p {max-width:70ch;background:var(--color-paper);}
.og-footer-links {display:flex;gap:20px;flex-wrap:wrap;}
.og-footer-links a {white-space:nowrap;}
.og-skip {position:absolute;left:12px;top:-100px;background:var(--color-paper);padding:12px;z-index:100;}
.og-skip:focus {top:12px;}
@media(max-width:600px) {
 .og-nav {padding:16px;gap:8px;}
 .og-nav-links {gap:4px 16px;}
 .og-main {padding:24px 16px 32px;}
 .og-opening {grid-template-columns:24px minmax(0,1fr);padding-top:8px;}
 .og-opening-content {padding-left:18px;}
 .og-kicker {font-size:10.5px;}
 .og-brand h1 {font-size:32px;}
 .og-actions a {padding-inline:12px;font-size:15px;}
 .og-footer {padding:24px 16px 40px;}
}
@media print {
 .og-brand {background:var(--color-white);}
 .og-nav,.og-actions,.og-footer-links,.og-kicker {display:none;}
 .og-main {padding:0;}
 .og-opening {display:block;padding:0;}
 .og-opening-content {border:0;padding:0;}
 .og-map-scroll {overflow:visible;}
 .og-network {min-width:0;}
}

.og-map-count {text-align:center;font-size:9.5px;font-weight:600;letter-spacing:.08em;color:var(--color-link);line-height:1.5;}
/* Existing teaching pages consume the approved brand through their established tokens. */
:root {--red:var(--color-link);--red-dark:var(--color-accent-800);--ink:var(--color-ink);--muted:var(--color-muted);--line:var(--color-divider);--paper:var(--color-paper);--wash:var(--color-surface);--tint:var(--color-accent-100);--serif:var(--font-heading);--sans:var(--font-body);}
.og-brand .site-header {max-width:1200px;margin:auto;padding:18px 28px;gap:20px;flex-wrap:wrap;border:0;}
.og-brand .site-header .brand {max-width:340px;width:340px;flex:0 1 340px;margin-right:auto;}
.og-brand .site-header nav {gap:20px;flex-wrap:wrap;font-size:16px;}
.og-brand .site-header nav a {white-space:nowrap;min-height:44px;display:flex;align-items:center;border:0;color:var(--color-link);}
.og-brand .site-header nav a.active {text-decoration:underline;text-decoration-thickness:2px;}
.og-brand .page:not(.og-main) {background-color:var(--color-paper);margin-block:24px;max-width:1200px;border-radius:var(--radius-panel);padding:36px 24px 48px;}
.og-brand h1 {max-width:none;font-size:clamp(30px,4vw,46px);}
.og-brand .og-opening h1 {max-width:18ch;}
.og-brand .og-opening-content {display:block;}
.og-brand .og-intro {margin-bottom:20px;}
.og-brand h2 {font-size:clamp(25px,3vw,34px);font-weight:600;}
.og-brand h3 {font-size:1.2rem;font-weight:600;}
.og-brand .resource-type,.og-brand .eyebrow {color:var(--color-link);}
.og-brand button,.og-brand .secondary,.og-brand .primary,.og-brand .tag {border-radius:var(--radius-button);}
.og-brand button,.og-brand .secondary {min-height:44px;}
.og-brand .primary,.og-brand .resource-tools .pdf-pair a:first-child {background:var(--color-button);border-color:var(--color-button);color:var(--color-white);}
.og-brand .primary:hover,.og-brand .resource-tools .pdf-pair a:first-child:hover {background:var(--color-link);color:var(--color-white);}
.og-brand .resource-card,.og-brand .recognition-card,.og-brand .question-card,.og-brand .chapter-card {border-radius:var(--radius-card);background:var(--color-paper);}
.og-brand .resource-card:hover {transform:none;}
.og-brand .station-heading {background:var(--color-accent-100);border:0;border-radius:var(--radius-panel);padding:24px;}
.og-brand .station-heading h1 {font-size:clamp(28px,4vw,44px);}
.og-brand .resource-table th {background:var(--color-surface);}
.og-brand .linearity-route {border-left:0;background:var(--color-surface);border-radius:var(--radius-card);}
.og-brand .brand-mark-large {mask:none;-webkit-mask:none;background:transparent url('overground-symbol.svg') center/contain no-repeat;}
.og-brand footer {display:flex;flex-direction:column;max-width:1200px;margin:auto;background:var(--color-paper);padding:24px 28px 48px;gap:16px;font-size:14px;}
.og-brand footer nav {display:flex;gap:12px 24px;flex-wrap:wrap;}
.og-brand footer a {white-space:nowrap;}
.og-brand .og-actions button {border:1px solid var(--color-divider);padding:10px 18px;background:var(--color-paper);color:var(--color-link);font-weight:600;white-space:nowrap;}
.og-map-actions {display:flex;gap:8px;flex-wrap:wrap;}
.og-home-chapters {border-block:1px solid var(--color-divider);padding-block:24px;margin-bottom:40px;}
.og-home-chapter-list {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px 40px;margin-top:24px;}
.og-home-chapter-list a {display:block;text-decoration:none;border-bottom:1px solid var(--color-divider);padding-bottom:20px;}
.og-home-chapter-list h3 {margin-bottom:8px;}
.og-home-chapter-list p {color:var(--color-ink);}
.og-home-chapter-list span {display:block;margin-top:12px;font-weight:600;}
.og-brand .og-map-directory {background:var(--color-paper);padding:24px;border-radius:var(--radius-panel);}
.og-brand .og-map-list-item {background:transparent;}
.og-brand .og-map-key.overground {background:var(--color-accent);border-color:var(--color-accent);border-radius:999px;}
.og-brand .og-map-key.planned {background:var(--color-paper);border-color:var(--color-accent);border-radius:999px;transform:none;}
.og-brand .og-planned-notice {background:var(--color-accent-100);padding:20px;border-radius:var(--radius-card);}
.og-brand .privacy-banner {background:var(--color-paper);color:var(--color-ink);border-color:var(--color-divider);}
.og-brand .privacy-banner button {color:var(--color-link);background:var(--color-paper);}
.og-brand .privacy-banner .primary {color:var(--color-white);background:var(--color-button);}
@media(max-width:680px){
 .og-brand .site-header {padding:16px;gap:8px;}
 .og-brand .site-header nav {display:grid;width:100%;min-width:0;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px 16px;justify-content:flex-start;}
 .og-brand .site-header nav a {min-width:0;justify-content:flex-start;}
 .og-brand .site-header .brand {max-width:320px;}
 .og-brand .page:not(.og-main) {margin:12px 8px;padding:24px 16px;}
 .og-home-chapter-list {grid-template-columns:minmax(0,1fr);}
 .og-brand .og-map-directory {padding:16px;}
 .og-brand .og-opening {padding-bottom:24px;}
 .og-brand .station-heading {padding:18px;}
 .og-brand footer {padding:24px 16px 80px;}
}
@media(max-width:390px){.og-brand .site-header nav {grid-template-columns:repeat(2,minmax(0,1fr));}}
@media print {
 .og-brand .page:not(.og-main) {margin:0;padding:0;border-radius:0;}
 .og-brand h1 {font-size:28pt;}
 .og-brand footer,.og-brand .site-header,.og-map-actions {display:none!important;}
}

/* Chapter choices and the station's three teaching stages. */
.og-home-chapters {padding-block:32px 40px;}
.og-chapter-intro {max-width:720px;margin-top:12px;}
.og-home-chapter-list {grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;}
.og-home-chapter-list a {display:flex;flex-direction:column;padding:24px 20px;border:1px solid var(--color-divider);border-top:3px solid var(--color-accent);border-radius:8px;background:var(--color-paper);color:var(--color-ink);}
.og-home-chapter-list a:hover {border-color:var(--color-link);background:var(--color-surface);}
.og-home-chapter-list .og-chapter-number {font-size:.8rem;letter-spacing:.06em;color:var(--color-link);margin:0 0 18px;}
.og-home-chapter-list h3 {font-size:1.35rem;line-height:1.25;margin-bottom:12px;}
.og-home-chapter-list p {font-size:.95rem;margin-bottom:24px;}
.og-home-chapter-list .og-chapter-action {display:flex;justify-content:space-between;gap:12px;margin-top:auto;color:var(--color-link);font-size:.95rem;}
.og-chapter-action span {margin:0;}
.teaching-station .station-browse-bar {display:block;padding:20px 0 24px;border-bottom:1px solid var(--color-divider);}
.teaching-station .station-browse-bar nav {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;padding:0;margin-bottom:16px;}
.teaching-station .station-browse-bar nav a {display:flex;justify-content:space-between;align-items:center;gap:12px;padding:16px;border:1px solid var(--color-divider);border-top:3px solid var(--color-accent);border-radius:4px;background:var(--color-paper);color:var(--color-link);}
.teaching-station .station-browse-bar nav a:hover {background:var(--color-surface);border-color:var(--color-link);}
.teaching-station .station-browse-bar nav small {font-size:.85rem;font-weight:400;color:var(--color-muted);white-space:nowrap;}
.teaching-station .station-browse-bar>div {display:flex;align-items:center;gap:12px;}
.teaching-station .station-browse-bar label {margin:0;}
@media(max-width:1000px){.og-home-chapter-list {grid-template-columns:repeat(2,minmax(0,1fr));}.teaching-station .station-browse-bar nav a {align-items:flex-start;flex-direction:column;gap:5px;}}
@media(max-width:560px){.og-home-chapter-list {grid-template-columns:minmax(0,1fr);}.teaching-station .station-heading h1 {font-size:2rem;line-height:1.08;margin:12px 0;}.teaching-station .station-big-question {font-size:1.1rem;}.teaching-station .station-heading .secondary {margin-top:12px;}.teaching-station .station-browse-bar nav {width:100%;min-width:0;gap:6px;}.teaching-station .station-browse-bar nav a {min-width:0;padding:10px 7px;font-size:.95rem;}.teaching-station .station-browse-bar nav small {font-size:.75rem;}.teaching-station .station-browse-bar>div {align-items:flex-start;flex-direction:column;gap:6px;}.teaching-station .station-browse-bar select {width:100%;}}

.og-brand .privacy-banner,.og-brand .privacy-banner>* {min-width:0;}
.og-brand .privacy-actions button {max-width:100%;overflow-wrap:anywhere;}

.og-map-actions>a {align-self:center;font-size:.9rem;text-underline-offset:4px;}
.og-directory-return {margin-bottom:24px;}

/* Keep the content close to the edges without losing the paper border. */
@media screen {
 .og-brand .og-main,.og-brand .site-header,.og-brand footer {width:calc(100% - clamp(24px,2.4vw,96px));max-width:none;padding-inline:0;}
}
@media screen and (min-width:681px) {
 .og-brand .page:not(.og-main) {width:calc(100% - clamp(16px,1.4vw,48px));max-width:none;padding-inline:clamp(12px,1vw,24px);}
}
@media screen and (min-width:601px) {.og-opening {grid-template-columns:44px minmax(0,1fr);}}

.og-station-list {grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr));}
/* Worked diagrams use the same paper and typography as their resource. */
.teacher-figure-gallery{margin-block:2rem;border-top:1px solid var(--color-divider);padding-top:1rem}
.teacher-figure-gallery figure{margin:1.5rem 0 2rem}
.teacher-figure-gallery img{display:block;width:100%;max-width:760px;height:auto;margin-inline:auto}
.teacher-figure-gallery figcaption{font-size:1rem;line-height:1.5;margin-top:.75rem}

/* Let the desktop map use the available width. */
.og-home-copy{min-width:0}
.og-map-keys{min-width:0}
.og-line-key{display:flex;flex-wrap:wrap;gap:8px 14px;list-style:none;padding:0;margin:14px 0 8px;font-size:.875rem}
.og-line-key li{display:flex;align-items:center;gap:7px;white-space:nowrap}
.og-line-key i{display:block;width:28px;height:5px;border-radius:999px;background:var(--line-colour);box-shadow:0 0 0 1px var(--color-ink)}
.og-line-key .number{--line-colour:var(--color-map-number)}
.og-line-key .geometry{--line-colour:var(--color-map-geometry)}
.og-line-key .algebra{--line-colour:var(--color-map-algebra)}
.og-line-key .functions{--line-colour:var(--color-map-functions)}
.og-line-key .calculus{--line-colour:var(--color-map-calculus)}
@media screen and (min-width:901px){
 .og-brand .og-main{padding-top:16px}
 .og-opening{min-height:calc(100svh - 96px);padding:0 0 20px}
 .og-opening-content{display:grid!important;grid-template-columns:minmax(250px,340px) minmax(0,1fr);grid-template-rows:auto auto auto 1fr;gap:14px 28px;align-content:start}
 .og-home-copy{grid-column:1;grid-row:1}
 .og-map-scroll{grid-column:2;grid-row:1 / span 4;margin:0;display:grid;place-items:start center;overflow:auto}
 .og-network{width:min(100%,1264px);height:auto;min-width:0;max-height:none}
 .og-map-keys{grid-column:1;grid-row:2}
 .og-map-actions{grid-column:1;grid-row:3}
 .og-map-help,.og-planned-notice{grid-column:1;max-width:100%;margin-top:0}
 .og-brand .og-opening h1{font-size:clamp(2.3rem,3vw,3.3rem);margin-bottom:12px}
 .og-brand .og-intro{font-size:.98rem;line-height:1.55;margin-bottom:14px}
 .og-legend{gap:8px 14px;margin:8px 0;font-size:.82rem}
 .og-map-actions button,.og-map-actions a{font-size:.85rem}
}
@media screen and (max-width:900px){
 .og-map-scroll{margin-top:18px}
 .og-network{width:100%;min-width:760px}
 .og-line-key{margin-top:16px}
}