/* Shared product refresh. Loaded after the page styles so the existing data,
   map and chat components keep their behaviour while sharing one identity. */
:root {
  --o-paper: #faf9f6;
  --o-surface: #ffffff;
  --o-sunken: #f1f0f6;
  --o-pressed: #e8e5f3;
  --o-ink: #29283e;
  --o-ink-soft: #514f65;
  --o-muted: #6e6b7c;
  --o-rule: #e8e5e2;
  --o-rule-soft: #f1efec;
  --o-signal: #6454b3;
  --o-signal-deep: #514199;
  --o-on-signal: #ffffff;
  --o-signal-tint: #eeebf8;
  --o-signal-edge: #bbb0e1;
  --o-invert: #35304f;
  --o-invert-accent: #6454b3;
  --o-mast-bg: #faf9f6;
  --o-mast-fg: #29283e;
  --o-mast-dim: #605d71;
  --o-container: 1280px;
  --o-wide: 1280px;
  --o-header-h: 80px;
  --o-r2: 12px;
  --o-r3: 20px;
  --o-lift1: 0 2px 5px rgba(40,34,56,.03);
  --o-lift2: 0 8px 24px rgba(40,34,56,.07);
  --o-lift3: 0 18px 50px rgba(40,34,56,.12);
  --ux-lilac: #f0edf9;
  --ux-sage: #edf3e9;
  --ux-peach: #fcf0e4;
  --ux-blue: #edf3fa;
  --ux-green-ink: #477050;
  --ux-orange-ink: #93602e;
  --ux-blue-ink: #496b8c;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --o-paper: #191923; --o-surface: #242430; --o-sunken: #292735;
    --o-pressed: #393449; --o-ink: #f0edf7; --o-ink-soft: #cdc7dc;
    --o-muted: #aaa3ba; --o-rule: #3b3546; --o-rule-soft: #302b3c;
    --o-signal: #b7a5f4; --o-signal-deep: #cbbbfa; --o-on-signal: #22183d;
    --o-signal-tint: #352d4b; --o-signal-edge: #756197;
    --o-invert: #312943; --o-invert-accent: #574283;
    --o-mast-bg: #191923; --o-mast-fg: #f0edf7; --o-mast-dim: #c0b9ce;
    --ux-lilac: #30283f; --ux-sage: #253329; --ux-peach: #3b3028; --ux-blue: #263240;
    --ux-green-ink: #a1c5a0; --ux-orange-ink: #e0b382; --ux-blue-ink: #a4c1e0;
  }
}
:root[data-theme="dark"] {
  --o-paper: #191923; --o-surface: #242430; --o-sunken: #292735;
  --o-pressed: #393449; --o-ink: #f0edf7; --o-ink-soft: #cdc7dc;
  --o-muted: #aaa3ba; --o-rule: #3b3546; --o-rule-soft: #302b3c;
  --o-signal: #b7a5f4; --o-signal-deep: #cbbbfa; --o-on-signal: #22183d;
  --o-signal-tint: #352d4b; --o-signal-edge: #756197;
  --o-invert: #312943; --o-invert-accent: #574283;
  --o-mast-bg: #191923; --o-mast-fg: #f0edf7; --o-mast-dim: #c0b9ce;
  --ux-lilac: #30283f; --ux-sage: #253329; --ux-peach: #3b3028; --ux-blue: #263240;
  --ux-green-ink: #a1c5a0; --ux-orange-ink: #e0b382; --ux-blue-ink: #a4c1e0;
}

/* Honour state attributes even on flex/grid components. */
[hidden]:not([hidden="until-found"]) { display: none !important; }

/* Cross-document snapshots can stall rendering when navigating away from
   the live Leaflet map. Keep navigation immediate; local hover, loading and
   reveal effects still respect the visitor's motion preference. */
@view-transition { navigation: none; }

/* Navigation and shared controls. */
.o-mast { border-bottom: 1px solid var(--o-rule); }
.o-mast.is-stuck { box-shadow: var(--o-lift2); }
.o-mast-inner { gap: 20px; }
.o-brand { gap: 10px; }
.o-brand-mark { color: var(--o-signal); width: 32px; height: 32px; }
.o-wordmark { font-size: 1.25rem; font-weight: 700; letter-spacing: -.045em; }
.o-nav-link { padding: 9px 10px; font-size: .8125rem; }
.o-nav-link::after { background: var(--o-signal); }
.o-nav-sep { background: var(--o-rule); margin-inline: 3px; }
.o-nav-shortlist { padding: 10px 15px; color: var(--o-signal); border-color: var(--o-signal-edge); background: var(--o-signal-tint); }
.o-nav-shortlist:hover { border-color: var(--o-signal); background: var(--o-pressed); }
.o-theme-btn:hover, .o-mast-icon:hover { background: var(--o-sunken); }
.o-mast-burger { border-color: var(--o-rule); }
.o-mast-icon { color: var(--o-mast-dim); }
.o-btn, .btn { min-height: 44px; gap: 9px; border-radius: 10px; font-weight: 600; }
.o-btn svg, .btn svg { flex-shrink: 0; }
.o-btn-primary, .o-btn-primary:hover, .btn-primary { background: var(--o-signal); color: var(--o-on-signal); }
.o-btn-primary:hover, .btn-primary:hover { background: var(--o-signal-deep); }
a:focus-visible, button:focus-visible, input:focus-visible, summary:focus-visible { outline: 3px solid var(--o-signal); outline-offset: 4px; }
.o-foot { background: var(--o-sunken); margin-top: 56px; }
.o-foot-head { font-size: .85rem; }
.o-foot-grid { gap: 28px; }

/* Homepage: task first, with space for a little personality. */
.discover-hero { padding: 64px 0 52px; }
.discover-layout { display: grid; grid-template-columns: 1.12fr 1fr; gap: 58px; align-items: center; }
.discover-copy { min-width: 0; }
.discover-kicker { display: flex; align-items: center; gap: 8px; color: var(--o-ink-soft); font-size: .77rem; font-weight: 500; margin: 0 0 20px; }
.discover-kicker > span { width: 8px; height: 8px; border-radius: 50%; background: #82a376; box-shadow: 0 0 0 4px var(--ux-sage); }
.discover-copy h1 { font-size: clamp(2.2rem, 3.65vw, 3.3rem); line-height: 1.13; letter-spacing: -.052em; font-weight: 650; margin: 0 0 22px; text-wrap: balance; }
.discover-copy h1 > span { color: var(--o-signal); }
.discover-lede { color: var(--o-muted); line-height: 1.75; font-size: .95rem; max-width: 52ch; margin: 0 0 28px; }
.finder-panel { padding: 0 22px 16px; border: 1px solid var(--o-rule); border-radius: 18px; background: var(--o-surface); box-shadow: 0 7px 30px rgba(52,43,73,.055); }
.finder-modes { display: flex; gap: 24px; border-bottom: 1px solid var(--o-rule); margin-bottom: 18px; }
.finder-mode { display: inline-flex; align-items: center; gap: 8px; position: relative; min-height: 54px; padding: 12px 0; border: 0; background: none; color: var(--o-muted); font: inherit; font-size: .8rem; font-weight: 550; cursor: pointer; }
.finder-mode.is-active { color: var(--o-signal); }
.finder-mode.is-active::after { content: ''; position: absolute; inset: auto 0 -1px; height: 3px; border-radius: 3px 3px 0 0; background: var(--o-signal); }
.finder-label { display: block; font-size: .78rem; font-weight: 600; margin-bottom: 8px; }
.finder-input-row { display: flex; align-items: center; gap: 8px; padding: 6px 6px 6px 12px; border: 1px solid var(--o-rule); border-radius: 11px; background: var(--o-paper); }
.finder-input-row:focus-within { border-color: var(--o-signal); box-shadow: 0 0 0 3px var(--o-signal-tint); }
.finder-input-icon { display: flex; color: var(--o-muted); }
#hero-pc { flex: 1; min-width: 0; width: 100%; border: 0; outline: none; box-shadow: none; padding: 9px 0; background: transparent; color: var(--o-ink); font: inherit; font-size: .81rem; }
#hero-pc::placeholder { color: var(--o-muted); opacity: 1; }
#hero-pc-go { padding: 10px 13px; font-size: .78rem; white-space: nowrap; min-height: 42px; }
.finder-phases { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; margin-top: 13px; }
.finder-phases > span { color: var(--o-muted); font-size: .71rem; margin-right: 3px; }
.finder-phases button { min-height: 33px; padding: 5px 10px; border: 1px solid transparent; border-radius: 7px; background: none; color: var(--o-muted); font: inherit; font-size: .72rem; cursor: pointer; }
.finder-phases button:hover { background: var(--o-paper); }
.finder-phases button.is-active { border-color: var(--o-signal-edge); background: var(--o-signal-tint); color: var(--o-signal); font-weight: 600; }
.finder-phases[hidden] { display: none; }
.finder-hint { font-size: .7rem; line-height: 1.6; color: var(--o-muted); margin: 9px 0 0; }
#hero-pc-form.is-error .finder-input-row { border-color: var(--o-brick); }
#hero-pc-form.is-error .finder-hint { color: var(--o-brick); }
.discover-reassurance { display: flex; align-items: center; flex-wrap: wrap; gap: 18px; margin-top: 17px; font-size: .72rem; color: var(--o-muted); }
.discover-reassurance span, .discover-reassurance a { display: inline-flex; align-items: center; gap: 5px; color: inherit; text-decoration: none; }
.discover-reassurance svg { color: var(--ux-green-ink); }
.discover-copy .o-saved { margin-top: 16px; }

/* The vector neighbourhood is deliberately illustrative; real schools and
   inspection outcomes only appear after a lookup. */
.neighbourhood { position: relative; min-width: 0; padding: 34px 0 46px; }
.neighbourhood-map { display: block; width: 100%; height: auto; border-radius: 32px; transform: rotate(-3deg); }
.neighbourhood-caption { position: relative; z-index: 1; margin: 0 0 22px; text-align: center; color: var(--o-muted); font-size: .72rem; letter-spacing: .015em; }
.map-note { display: flex; align-items: center; gap: 12px; position: absolute; border: 1px solid var(--o-rule); background: var(--o-surface); color: var(--o-ink); border-radius: 13px; box-shadow: var(--o-lift3); }
.map-note-school { top: 89px; left: -22px; padding: 13px 17px; transform: rotate(-3deg); }
.note-icon { display: grid; place-items: center; width: 40px; height: 43px; background: var(--ux-lilac); color: var(--o-signal); border-radius: 9px; }
.map-note strong { display: block; font-size: .76rem; font-weight: 600; }
.map-note small { display: block; margin-top: 2px; color: var(--o-muted); font-size: .65rem; }
.map-note-home { right: -10px; bottom: 112px; padding: 13px 17px; font-size: .8rem; transform: rotate(3deg); }
.map-note-home svg { color: var(--o-signal); }
.map-explore { position: absolute; bottom: 38px; left: 40px; display: inline-flex; align-items: center; gap: 14px; min-height: 44px; padding: 12px 18px; border-radius: 12px; background: var(--o-surface); color: var(--o-ink); box-shadow: var(--o-lift2); text-decoration: none; font-size: .76rem; font-weight: 600; }
.map-explore:hover { color: var(--o-signal); }
.map-illustration-label { position: absolute; bottom: 10px; right: 8px; color: var(--o-muted); font-size: .6rem; }
.coverage-strip { border-top: 1px solid var(--o-rule); border-bottom: 1px solid var(--o-rule); background: var(--o-surface); }
.coverage-inner { display: flex; align-items: center; justify-content: space-between; gap: 32px; padding-block: 24px; }
.coverage-inner > p { display: flex; align-items: center; gap: 11px; margin: 0; font-size: .82rem; font-weight: 500; }
.coverage-inner > p svg { color: var(--ux-green-ink); flex-shrink: 0; }
.coverage-inner dl { display: flex; gap: 52px; }
.coverage-inner dd { font-size: .94rem; font-weight: 650; letter-spacing: -.02em; }
.coverage-inner dt { margin-top: 3px; font-size: .69rem; color: var(--o-muted); }

.home-section { padding-block: 32px; }
.coverage-strip + .home-section { margin-top: 20px; }
.home-section-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; margin-bottom: 25px; }
.home-kicker { color: var(--o-muted); font-size: .65rem; letter-spacing: .1em; font-weight: 600; margin: 0 0 10px; }
.home-section h2 { font-size: clamp(1.45rem, 2.1vw, 1.85rem); font-weight: 600; letter-spacing: -.035em; line-height: 1.23; margin: 0; border: 0; padding: 0; }
.home-section-head > p { color: var(--o-muted); font-size: .82rem; margin: 0 0 3px; }
.journey-grid { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 16px; }
.journey-card, .journey-card.o-mapband { display: flex; flex-direction: column; position: relative; padding: 25px 23px 21px; border: 1px solid transparent; border-radius: 18px; color: var(--o-ink); text-decoration: none; transition: transform .18s ease, box-shadow .18s ease; overflow: visible; }
.journey-card:hover { transform: translateY(-4px); box-shadow: var(--o-lift2); text-decoration: none; }
.journey-map { background: var(--ux-sage); --journey-ink: var(--ux-green-ink); }
.journey-compare { background: var(--ux-lilac); --journey-ink: var(--o-signal); }
.journey-move { background: var(--ux-peach); --journey-ink: var(--ux-orange-ink); }
.journey-grammar { background: var(--ux-blue); --journey-ink: var(--ux-blue-ink); }
.journey-icon { color: var(--journey-ink); display: flex; margin-bottom: 23px; }
.journey-card h3 { font-size: .95rem; line-height: 1.4; margin: 0 0 9px; font-weight: 600; letter-spacing: -.02em; }
.journey-card p { font-size: .77rem; line-height: 1.7; color: var(--o-ink-soft); margin: 0 0 22px; }
.journey-link { display: flex; justify-content: space-between; align-items: center; gap: 8px; font-size: .72rem; font-weight: 600; color: var(--journey-ink); margin-top: auto; }
.journey-link svg { flex-shrink: 0; }
.matters-panel { display: grid; grid-template-columns: 1fr 1.5fr; gap: 60px; border: 1px solid var(--o-rule); background: var(--o-surface); padding: 38px; border-radius: 22px; }
.matters-intro > p:not(.home-kicker) { font-size: .84rem; line-height: 1.75; color: var(--o-muted); margin: 16px 0 22px; max-width: 35ch; }
.matters-intro .o-btn { font-size: .76rem; padding-inline: 15px; }
.matters-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 26px 30px; }
.matters-grid a { color: var(--o-ink); text-decoration: none; }
.matters-grid a:hover h3 { color: var(--o-signal); }
.matter-icon { display: flex; color: var(--o-signal); margin-bottom: 9px; }
.matters-grid h3 { font-size: .84rem; font-weight: 600; line-height: 1.4; margin: 0 0 5px; }
.matters-grid p { font-size: .75rem; line-height: 1.65; color: var(--o-muted); margin: 0; }
.assistant-panel { display: grid; grid-template-columns: 1fr 1.22fr; gap: 70px; padding: 40px; background: var(--ux-lilac); border-radius: 22px; }
.assistant-icon { display: grid; place-items: center; width: 48px; height: 48px; color: var(--o-signal); background: var(--o-surface); border-radius: 14px; margin-bottom: 20px; }
.assistant-intro > p:not(.home-kicker) { color: var(--o-ink-soft); font-size: .84rem; line-height: 1.75; margin: 15px 0 22px; }
.assistant-intro .o-btn { font-size: .77rem; }
.assistant-intro > small { display: block; color: var(--o-muted); font-size: .67rem; margin-top: 14px; max-width: 40ch; }
.assistant-questions { align-self: center; min-width: 0; }
.questions-caption { font-size: .77rem; color: var(--o-muted); margin: 0 0 14px; }
.assistant-questions .o-ask-q { display: flex; align-items: center; justify-content: space-between; gap: 15px; padding: 17px 18px; margin-bottom: 10px; width: 100%; min-height: 58px; border: 1px solid var(--o-rule); background: var(--o-surface); border-radius: 10px; font: inherit; font-size: .79rem; font-weight: 500; color: var(--o-ink); line-height: 1.6; }
.assistant-questions .o-ask-q::after { display: none; }
.assistant-questions .o-ask-q svg { flex-shrink: 0; color: var(--o-signal); }
.assistant-questions .o-ask-q:hover { border-color: var(--o-signal-edge); box-shadow: var(--o-lift1); }
.more-questions summary { font-size: .75rem; color: var(--o-signal); cursor: pointer; padding: 10px 0; }
.browse-links { display: grid; grid-template-columns: repeat(4,1fr); gap: 16px; }
.browse-links a { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 16px 18px; background: var(--o-surface); border: 1px solid var(--o-rule); border-radius: 12px; color: var(--o-ink); text-decoration: none; font-size: .79rem; }
.browse-links a:hover { color: var(--o-signal); border-color: var(--o-signal-edge); }
.home-faq { display: grid; grid-template-columns: 1fr 1.6fr; gap: 60px; }
.home-faq .home-section-head { display: block; margin: 0; }
.home-faq .o-eyebrow { color: var(--o-muted); background: none; padding: 0; font-size: .65rem; text-transform: uppercase; letter-spacing: .1em; }
.home-faq .o-faq { margin-top: 0; }
.home-faq .o-faq-item summary { font-size: .83rem; padding-block: 18px; }
.home-faq .o-faq-item p { font-size: .8rem; }
#ask-schools { scroll-margin-top: calc(var(--o-header-h) + 20px); }

/* Nearby results show a few comparable facts and a separate save action. */
.home-redesign .near-you { padding-block: 34px; scroll-margin-top: calc(var(--o-header-h) + 16px); }
.near-you-head .o-eyebrow { background: none; padding: 0; color: var(--o-muted); }
.near-you-head .o-h2 { font-size: 1.6rem; letter-spacing: -.03em; }
.home-redesign .near-you-grid { grid-template-columns: repeat(2, minmax(0,1fr)); gap: 14px; }
.ny-card-wrap { display: grid; grid-template-columns: 1fr auto; align-items: start; gap: 12px; padding: 20px; background: var(--o-surface); border: 1px solid var(--o-rule); border-radius: 16px; }
.ny-card-wrap:hover { border-color: var(--o-signal-edge); box-shadow: var(--o-lift2); }
.home-redesign .ny-card { display: grid; grid-template-columns: 44px 1fr; gap: 14px; align-items: start; border: 0; box-shadow: none; padding: 0; background: none; min-width: 0; }
.home-redesign .ny-card:hover { transform: none; }
.ny-school-icon { display: grid; place-items: center; width: 44px; height: 48px; border-radius: 12px; background: var(--ux-sage); color: var(--ux-green-ink); }
.ny-school-icon.secondary { background: var(--ux-lilac); color: var(--o-signal); }
.home-redesign .ny-card-name { font-size: .91rem; font-weight: 600; line-height: 1.45; margin-bottom: 4px; }
.home-redesign .ny-card-meta { font-size: .73rem; line-height: 1.6; color: var(--o-muted); }
.ny-card-facts { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; margin-top: 10px; font-size: .68rem; }
.ny-grade { border-radius: 5px; padding: 3px 7px; background: var(--o-sunken); color: var(--o-ink-soft); }
.ny-grade.outstanding { background: var(--ux-sage); color: var(--ux-green-ink); }
.ny-grade.good { background: var(--ux-peach); color: var(--ux-orange-ink); }
.home-redesign .ny-card-dist { font-size: .68rem; color: var(--o-muted); white-space: normal; }
.home-redesign .ny-save { display: grid; place-items: center; width: 44px; height: 44px; padding: 0; border: 1px solid var(--o-rule); border-radius: 50%; background: var(--o-surface); color: var(--o-muted); }
.home-redesign .ny-save.saved { color: var(--o-signal); background: var(--o-signal-tint); border-color: var(--o-signal-edge); }
.ny-save.saved svg { fill: currentColor; }
.near-you-filters button { min-height: 40px; }
.near-you-foot { margin-top: 18px; }
.near-you-foot .o-link { font-size: .82rem; }
.ny-skeleton { min-height: 137px; border-radius: 16px; background: var(--o-sunken); border: 1px solid var(--o-rule); animation: result-pulse 1.4s ease-in-out infinite alternate; }
@keyframes result-pulse { to { opacity: .45; } }

/* Content pages keep their data tables, with clearer groups and less ruling. */
body > .wrap { max-width: 1160px; }
body > .wrap > h1 { font-size: clamp(1.8rem, 3vw, 2.5rem); line-height: 1.18; }
body > .wrap h2 { border-top: 0; }
.breadcrumbs { font-size: .76rem; margin-bottom: 22px; }
.card { border-radius: 16px; padding: 24px; box-shadow: var(--o-lift1); }
.school-hero { padding: 28px; border: 1px solid var(--o-rule); border-radius: 22px; background: var(--o-surface); }
.school-hero .school-hero-text > h1 { font-size: clamp(1.6rem, 3vw, 2.35rem); line-height: 1.2; letter-spacing: -.035em; margin-bottom: 12px; }
.school-hero .subtitle { font-size: .85rem; color: var(--o-muted); }
.school-hero .compare-cta { font-size: .76rem; }
.school-related { margin: 18px 0 12px; border: 1px solid var(--o-rule); border-radius: 10px; padding: 0 14px; background: var(--o-paper); }
.school-related > summary { padding: 12px 0; font-size: .79rem; color: var(--o-signal); font-weight: 550; cursor: pointer; }
.school-related > .compare-cta { margin-block: 6px 12px; }
.school-hero .school-cta-bar { margin-top: 22px; padding: 16px 0 0; border-top: 1px solid var(--o-rule); background: transparent; }
.school-hero .school-badges { margin-bottom: 0; }
.school-hero .badge.badge-grammar, .school-hero .badge.ofsted-stale, .school-hero .badge.ofsted-ri { background: var(--ux-peach); color: var(--ux-orange-ink); }
.school-hero .school-cta-bar .cta-btn.save.saved { background: var(--ux-sage); border-color: var(--o-rule); color: var(--ux-green-ink); }
.wrap > .score-section { margin-block: 24px; }
.wrap > .overview-section { margin-block: 30px; }
.overview-section > h2 { font-size: 1.3rem; margin: 0 0 18px; padding: 0; }
.overview-section .overview-card { border: 0; padding: 0; }
.overview-section .overview-body { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.overview-section .overview-body > p { background: var(--o-surface); border: 1px solid var(--o-rule); border-radius: 14px; padding: 20px; margin: 0; font-size: .86rem; line-height: 1.75; }
.overview-section .overview-body > p > strong:first-child { display: block; font-size: .93rem; margin-bottom: 7px; color: var(--o-signal); }
.overview-section .overview-label { margin-top: 14px; font-size: .73rem; line-height: 1.6; }
body #sgpt-compare-tray { background: var(--o-invert); color: var(--o-on-invert); border: 1px solid var(--o-invert-edge); box-shadow: var(--o-lift3); }
body #sgpt-compare-tray .sgpt-tray-toggle, body #sgpt-compare-tray .sgpt-tray-chip a, body #sgpt-compare-tray .sgpt-tray-chip button { color: var(--o-on-invert); }
.school-cta-bar .cta-btn { min-height: 44px; border-radius: 9px; padding: 10px 16px; }
.school-cta-bar .cta-btn.save { background: var(--o-signal); border-color: var(--o-signal); color: var(--o-on-signal); }
.chance-section .chance-card { background: var(--ux-lilac); border: 1px solid var(--o-signal-edge); border-radius: 18px; padding: 24px; }
.chance-card .chance-form input { background: var(--o-surface); }
.chance-card .chance-form button { background: var(--o-signal); color: var(--o-on-signal); min-height: 44px; }
.score-section .score-card { box-shadow: none; background: var(--o-paper); border-radius: 14px; }
.sl-head { padding: 12px 0 22px; }
.sl-head h1 { font-size: 2.2rem; letter-spacing: -.04em; margin-bottom: 10px; }
.sl-head p { font-size: .86rem; max-width: 58ch; }
.sl-storage-note { color: var(--o-muted); font-size: .76rem; margin: 18px 0; }
.sl-empty { padding: 60px 24px; border: 1px solid var(--o-rule); background: var(--o-surface); border-radius: 22px; }
.sl-empty-icon { display: grid; place-items: center; margin: 0 auto 22px; width: 78px; height: 78px; background: var(--ux-lilac); color: var(--o-signal); border-radius: 24px; transform: rotate(-6deg); }
.sl-empty h2 { margin: 0 0 12px; font-size: 1.7rem; }
.sl-empty p { margin: 0 auto 24px; max-width: 44ch; font-size: .88rem; line-height: 1.75; }
.sl-empty .btn { background: var(--o-signal); color: var(--o-on-signal); }
.sl-card { border-radius: 16px; padding: 22px; }
.sl-card-actions a, .sl-card-actions button { min-height: 40px; }
.compare-wrap { border-radius: 16px; }
.compare-table thead th { background: var(--ux-lilac); color: var(--o-ink); }
.compare-table th:first-child { background: var(--ux-lilac); color: var(--o-ink); }
.compare-table td { padding-block: 15px; }
body:has(#map) > .wrap { max-width: 1600px; padding: 24px 28px; }
.map-page-heading { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-bottom: 22px; }
.map-page-heading h1 { font-size: 1.8rem; line-height: 1.2; margin-bottom: 6px; }
.map-page-heading p { font-size: .83rem; color: var(--o-muted); margin: 0; }
.map-page-heading > span { display: flex; align-items: center; gap: 7px; color: var(--o-signal); background: var(--o-signal-tint); padding: 8px 12px; border-radius: 8px; font-size: .74rem; }
.map-toolbar { background: var(--o-surface); padding: 14px; margin: 0; border: 1px solid var(--o-rule); border-radius: 16px 16px 0 0; gap: 12px; }
.map-toolbar form { max-width: 480px; }
.map-toolbar input[type="text"] { background: var(--o-paper); color: var(--o-ink); box-shadow: none; border-radius: 9px; }
.map-toolbar input[type="text"]::placeholder { color: var(--o-muted); opacity: 1; }
.map-toolbar > form > button[type="submit"] { background: var(--o-signal); color: var(--o-on-signal); min-height: 44px; }
.map-toolbar .tool-btn { background: var(--o-surface); color: var(--o-ink-soft); border-color: var(--o-rule); }
/* Suggestions are list items, so they must not inherit the Search CTA fill. */
.map-toolbar .map-suggest button { background: var(--o-surface); color: var(--o-ink); min-height: 44px; }
.map-toolbar .map-suggest button:hover,
.map-toolbar .map-suggest button:focus,
.map-toolbar .map-suggest button[aria-selected="true"] { background: var(--o-signal-tint); }
.map-toolbar .map-suggest button:focus-visible { outline: 2px solid var(--o-signal); outline-offset: -2px; }
.map-toolbar .map-suggest .sg-name { color: var(--o-ink); }
.map-toolbar .map-suggest .sg-meta { color: var(--o-ink-soft); }
.map-status { font-size: .76rem; }
.map-filters { background: var(--o-surface); padding: 0 14px 14px; border: 1px solid var(--o-rule); border-top: 0; border-radius: 0 0 16px 16px; margin-bottom: 16px; }
.map-filters .fchip, .map-filters select { min-height: 38px; background: var(--o-paper); border-radius: 8px; font-size: .75rem; }
.map-filters .fchip.active { background: var(--o-signal-tint); border-color: var(--o-signal-edge); color: var(--o-signal); }
.map-filters .fchip.grammar-chip.active, .map-filters .fchip.independent-chip.active { background: var(--ux-peach); color: var(--ux-orange-ink); }
#map { border-radius: 16px; border-color: var(--o-rule); }
.league-toggle { background: var(--o-surface); color: var(--o-ink); border: 1px solid var(--o-rule); border-radius: 10px; padding: 12px 17px; }
.league-panel { border-radius: 16px; }

@media (min-width: 901px) {
  body.empty #menu-btn { order: 4; width: 30px; margin-left: -12px; }
}
@media (max-width: 1100px) and (min-width: 901px) {
  .o-mast-inner { gap: 10px; padding-inline: 24px; }
  .o-nav-link { padding-inline: 7px; font-size: .75rem; }
  .o-nav-shortlist { padding-inline: 10px; }
  .o-wordmark { font-size: 1.1rem; }
  .discover-layout { gap: 35px; }
  .finder-panel { padding-inline: 16px; }
  #hero-pc { font-size: .75rem; }
  #hero-pc-go svg { display: none; }
  .map-note-school { left: -12px; padding: 10px; }
  .journey-card, .journey-card.o-mapband { padding: 22px 18px; }
}
@media (max-width: 900px) {
  :root { --o-header-h: 66px; }
  .o-mast-inner { gap: 12px; }
  .o-nav-link { min-height: 48px; border-color: var(--o-rule); }
  .o-theme-btn { margin-top: 12px; min-height: 44px; width: 44px; }
  body.empty #menu-btn { order: 2; }
  .o-mast-burger { order: 3; }
  .discover-hero { padding: 38px 0; }
  .discover-layout { gap: 25px; grid-template-columns: 1.1fr .9fr; }
  .discover-copy h1 { font-size: 2.4rem; }
  .finder-input-row { flex-wrap: wrap; }
  #hero-pc { flex-basis: calc(100% - 40px); font-size: 1rem; }
  #hero-pc-go { width: 100%; }
  .finder-panel { padding-inline: 16px; }
  .finder-modes { gap: 16px; }
  .finder-mode { font-size: .75rem; }
  .neighbourhood-caption { line-height: 1.6; font-size: .66rem; }
  .map-note-school { top: 70px; left: -5px; padding: 10px; gap: 7px; }
  .map-note strong { font-size: .65rem; }
  .map-note small { font-size: .6rem; max-width: 23ch; }
  .note-icon { width: 32px; height: 36px; }
  .map-note-home { bottom: 65px; right: 0; font-size: .69rem; padding: 10px; }
  .map-explore { bottom: 14px; left: 15px; font-size: .68rem; padding: 10px 12px; }
  .map-illustration-label { bottom: -12px; }
  .coverage-inner { gap: 22px; }
  .coverage-inner > p { font-size: .72rem; max-width: 22ch; }
  .coverage-inner dl { gap: 25px; }
  .coverage-inner dd { font-size: .8rem; }
  .journey-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .matters-panel, .assistant-panel { gap: 28px; padding: 28px; }
  .browse-links { grid-template-columns: 1fr 1fr; }
  .home-faq { gap: 30px; }
}
@media (max-width: 640px) {
  :root { --o-gutter: 20px; }
  .o-wordmark { font-size: 1.15rem; }
  .discover-hero { padding: 30px 0 26px; }
  .discover-layout { grid-template-columns: 1fr; gap: 10px; }
  .discover-kicker { font-size: .7rem; margin-bottom: 16px; }
  .discover-copy h1 { font-size: clamp(2rem, 8.5vw, 2.8rem); margin-bottom: 16px; }
  .discover-lede { font-size: .87rem; line-height: 1.7; margin-bottom: 23px; }
  .finder-panel { padding: 0 16px 14px; border-radius: 16px; }
  .finder-modes { gap: 23px; }
  .finder-mode { font-size: .76rem; }
  .finder-input-row { gap: 5px; padding: 7px; }
  .finder-input-icon { padding-left: 4px; }
  #hero-pc { font-size: 1rem; padding-block: 10px; }
  #hero-pc-go { min-height: 46px; font-size: .85rem; }
  .finder-phases { gap: 5px; }
  .finder-phases > span { flex-basis: 100%; margin: 2px 0 1px; }
  .finder-phases button { min-height: 40px; font-size: .75rem; padding-inline: 12px; }
  .discover-reassurance { justify-content: center; font-size: .68rem; gap: 14px; }
  .neighbourhood { max-width: 420px; width: calc(100% - 24px); margin-inline: auto; padding: 0 0 35px; }
  .neighbourhood-caption { margin: 18px 0 17px; }
  .neighbourhood-map { max-height: 255px; }
  .map-note-school { top: 60px; left: -10px; padding: 10px 12px; }
  .map-note-home { bottom: 63px; right: -9px; padding: 10px 12px; }
  .map-explore { bottom: 20px; left: 20px; }
  .map-illustration-label { bottom: -1px; }
  .coverage-inner { display: block; padding-block: 20px; }
  .coverage-inner > p { font-size: .78rem; max-width: none; margin-bottom: 19px; justify-content: center; }
  .coverage-inner dl { justify-content: space-between; gap: 15px; text-align: center; }
  .coverage-inner dd { font-size: .77rem; }
  .coverage-inner dt { font-size: .6rem; }
  .home-section { padding-block: 25px; }
  .home-section-head { display: block; margin-bottom: 19px; }
  .home-section-head > p { margin-top: 9px; }
  .home-section h2 { font-size: 1.45rem; }
  .journey-grid { gap: 12px; }
  .journey-card, .journey-card.o-mapband { padding: 19px 16px; border-radius: 15px; }
  .journey-icon { margin-bottom: 17px; }
  .journey-card h3 { font-size: .85rem; }
  .journey-card p { font-size: .73rem; margin-bottom: 17px; }
  .journey-link { font-size: .66rem; gap: 4px; align-items: flex-end; }
  .journey-link svg { width: 15px; }
  .matters-panel, .assistant-panel { grid-template-columns: 1fr; padding: 25px; gap: 28px; border-radius: 18px; }
  .matters-intro h2 br { display: none; }
  .matters-intro > p:not(.home-kicker) { max-width: none; }
  .matters-grid { gap: 25px 20px; }
  .matters-grid h3 { font-size: .8rem; }
  .matters-grid p { font-size: .73rem; }
  .assistant-intro h2 br { display: none; }
  .assistant-icon { margin-bottom: 15px; }
  .assistant-questions .o-ask-q { font-size: .78rem; padding: 14px; }
  .browse-links { gap: 10px; }
  .browse-links a { padding: 14px; font-size: .73rem; }
  .browse-links svg { width: 15px; flex-shrink: 0; }
  .home-faq { display: block; }
  .home-faq .o-faq { margin-top: 15px; }
  .home-redesign .near-you-grid { grid-template-columns: 1fr; }
  .home-redesign .near-you-head { align-items: start; flex-direction: column; gap: 16px; }
  .home-redesign .near-you { padding-block: 25px; }
  .ny-card-wrap { padding: 16px; gap: 8px; }
  .home-redesign .ny-card { grid-template-columns: 37px 1fr; gap: 10px; }
  .ny-school-icon { width: 37px; height: 42px; }
  .home-redesign .ny-card-name { font-size: .86rem; }
  .o-foot { margin-top: 26px; }
  .o-foot-grid { grid-template-columns: 1fr 1fr; gap: 28px 20px; }
  .o-foot-col a { font-size: .76rem; }
  .school-hero { padding: 20px; }
  .overview-section .overview-body { grid-template-columns: 1fr; }
  .school-hero .school-hero-text > h1 { font-size: 1.65rem; }
  .school-cta-bar .cta-btn { padding-inline: 12px; }
  .school-hero .school-cta-bar { position: static; }
  .chance-section .chance-card { padding: 20px; }
  .sl-head h1 { font-size: 1.8rem; }
  .sl-empty { padding: 38px 20px; }
  .sl-empty h2 { font-size: 1.5rem; }
  body:has(#map) > .wrap { padding: 20px 14px; }
  .map-page-heading { margin-bottom: 16px; }
  .map-page-heading h1 { font-size: 1.5rem; }
  .map-page-heading > span { display: none; }
  .map-toolbar { padding: 12px; }
  .map-filters { padding: 0 12px 12px; gap: 6px; }
  .map-filters .fchip, .map-filters select { min-height: 40px; }
}
@media (prefers-reduced-motion: reduce) {
  .journey-card:hover { transform: none; }
  .ny-skeleton { animation: none; }
}