/* =========================================================
   CATCHABREAK — ACADEMY THEME
   Shared academy theme, layout, and visual tokens.
   ========================================================= */

:root {
    --academy-navy: #06142b;
    --academy-navy-2: #0b1d3a;
    --academy-ink: #10172a;
    --academy-gold: #d7aa58;
    --academy-gold-soft: #f0d393;
    --academy-cream: #f7f0e2;
    --academy-paper: #fbf5e9;
    --academy-paper-2: #efe3cd;
    --academy-muted: #9c8c75;
    --academy-calm: #55d5b3;
    --academy-moderate: #efb143;
    --academy-busy: #f15e78;
    --academy-border: rgba(215,170,88,.58);
    --academy-shadow: 0 18px 50px rgba(0,0,0,.30);
}

.academy-theme {
    color: var(--academy-ink);
    font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.academy-theme h1,
.academy-theme h2,
.academy-theme .academy-brand strong,
.academy-theme .academy-welcome-panel h1,
.academy-theme .academy-welcome-panel h2,
.academy-theme .academy-section-heading h2,
.academy-theme .academy-stat-copy > strong,
.academy-theme .academy-about-hero h1 {
    font-family: Georgia, "Times New Roman", serif;
    font-weight: 600;
}

/* ---------- shared academy header ---------- */
.academy-theme .academy-topbar {
    height: 72px;
    padding: 0 clamp(22px, 4.4vw, 72px);
    border-bottom: 1px solid rgba(215,170,88,.52);
    background:
        radial-gradient(circle at 25% 0%, rgba(45,61,106,.20), transparent 30%),
        linear-gradient(180deg, #06142b 0%, #071226 100%);
    color: #f8ead0;
    box-shadow: 0 8px 28px rgba(0,0,0,.18);
}

.academy-brand {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    min-width: 0;
    color: #f8ead0;
    text-decoration: none;
}

.academy-brand img {
    width: 45px;
    height: 45px;
    object-fit: contain;
    filter: drop-shadow(0 0 10px rgba(224,179,91,.17));
}

.academy-brand > span {
    display: grid;
    line-height: 1;
    gap: 4px;
}

.academy-brand strong {
    color: #fbefd8;
    font-size: 24px;
    letter-spacing: -.02em;
}

.academy-brand small {
    color: rgba(247,228,191,.72);
    font-size: 9px;
    letter-spacing: .035em;
}

.academy-nav-link {
    color: #e7c77f !important;
    font-size: 12px;
    font-weight: 700;
    text-decoration: none !important;
    letter-spacing: .01em;
    transition: color 160ms ease;
}

.academy-nav-link:hover { color: #fff0c9 !important; }

.academy-header-actions { gap: 26px; }

.academy-primary-button {
    min-height: 42px;
    padding: 0 19px;
    border: 1px solid rgba(224,178,87,.78);
    border-radius: 14px;
    background: linear-gradient(180deg, rgba(13,30,60,.84), rgba(5,18,39,.92));
    color: #f3cd7b;
    box-shadow: inset 0 0 0 1px rgba(255,227,163,.05), 0 0 22px rgba(225,173,72,.08);
    font-family: Georgia, "Times New Roman", serif;
    font-size: 13px;
    font-weight: 700;
    cursor: pointer;
}

.academy-primary-button span { margin-left: 7px; }
.academy-primary-button:hover {
    color: #fff0c9;
    border-color: #efc66d;
    box-shadow: inset 0 0 0 1px rgba(255,227,163,.09), 0 0 24px rgba(225,173,72,.16);
}

/* =========================================================
   LANDING PAGE
   ========================================================= */
.landing-academy {
    background: var(--academy-navy);
}

.landing-academy main { background: var(--academy-navy); }

.academy-hero {
    height: min(560px, 62vw);
    min-height: 440px;
    margin-top: 72px;
    overflow: hidden;
    border-bottom: 1px solid rgba(215,170,88,.58);
    background: #071326;
}

.academy-slide {
    isolation: isolate;
    background: #071326;
}

.academy-hero-bg,
.academy-hero-video {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.academy-hero-bg-one {
    background-image: url("../images/home/hero-journey.png");
    background-size: cover;
    background-position: center center;
    filter: saturate(.94) contrast(1.04) brightness(.82);
    transform: scale(1.01);
}

.academy-hero-bg-two {
    background-image: url("../images/home/hero-anxiety.png");
    background-size: cover;
    background-position: center center;
    filter: saturate(.96) contrast(1.04) brightness(.84);
    transform: scale(1.01);
}

.academy-hero-bg-three {
    background-image: url("../images/home/hero-reset.png");
    background-size: cover;
    background-position: center center;
    filter: saturate(.96) contrast(1.04) brightness(.86);
    transform: scale(1.01);
}

.academy-hero-video {
    object-position: center 72%;
    filter: saturate(.72) contrast(1.06) brightness(.76);
}

.academy-vignette {
    position: absolute;
    inset: 0;
    z-index: 1;
    background:
        linear-gradient(90deg, rgba(3,13,29,.40) 0%, rgba(3,13,29,.10) 44%, rgba(3,13,29,.54) 100%),
        linear-gradient(180deg, rgba(3,12,26,.08) 0%, rgba(3,12,26,.04) 55%, rgba(3,12,26,.48) 100%);
    pointer-events: none;
}

.academy-stars {
    position: absolute;
    inset: 0;
    z-index: 2;
    opacity: .7;
    pointer-events: none;
    background-image:
        radial-gradient(circle at 16% 18%, rgba(255,211,118,.85) 0 1px, transparent 1.4px),
        radial-gradient(circle at 31% 30%, rgba(255,211,118,.62) 0 1px, transparent 1.5px),
        radial-gradient(circle at 67% 19%, rgba(255,211,118,.72) 0 1px, transparent 1.4px),
        radial-gradient(circle at 82% 42%, rgba(255,211,118,.72) 0 1px, transparent 1.4px),
        radial-gradient(circle at 51% 62%, rgba(255,211,118,.45) 0 1px, transparent 1.4px);
}

.academy-hero-shell {
    position: relative;
    z-index: 3;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: flex-end;
}

.academy-guide-card {
    position: absolute;
    top: 34px;
    left: 0;
    width: min(330px, 33vw);
    min-height: 126px;
    padding: 16px 18px 16px 102px;
    border: 1px solid rgba(215,170,88,.75);
    border-radius: 16px;
    background:
        linear-gradient(135deg, rgba(255,252,244,.97), rgba(238,226,202,.97));
    box-shadow: var(--academy-shadow);
}

.academy-guide-card::before,
.academy-guide-card::after {
    content: "✦";
    position: absolute;
    color: #b48736;
    font-size: 14px;
}
.academy-guide-card::before { top: 9px; right: 12px; }
.academy-guide-card::after { bottom: 9px; right: 12px; }

.academy-guide-card img {
    position: absolute;
    left: 11px;
    bottom: 0;
    width: 90px;
    height: 115px;
    object-fit: contain;
    object-position: bottom;
}

.academy-guide-card span,
.academy-kicker,
.academy-cta-copy > span,
.academy-route-kicker {
    color: #c69c4d;
    font-size: 9px;
    font-weight: 900;
    letter-spacing: .12em;
}

.academy-guide-card strong {
    display: block;
    margin: 5px 0 5px;
    color: #302719;
    font-family: Georgia, "Times New Roman", serif;
    font-size: 15px;
}

.academy-guide-card p {
    margin: 0;
    color: #706452;
    font-size: 11px;
    line-height: 1.45;
}

.academy-welcome-panel,
.academy-archive-panel {
    width: min(500px, 46vw);
    padding: clamp(26px, 3.5vw, 44px);
    border: 1px solid rgba(215,170,88,.62);
    border-radius: 16px;
    background:
        radial-gradient(circle at 100% 100%, rgba(226,176,81,.12), transparent 24%),
        linear-gradient(135deg, rgba(4,17,38,.86), rgba(8,23,49,.76));
    color: #fff4dd;
    box-shadow: 0 24px 58px rgba(0,0,0,.35), inset 0 0 42px rgba(255,199,88,.02);
    backdrop-filter: blur(8px);
}

.academy-welcome-panel h1,
.academy-welcome-panel h2 {
    margin: 10px 0 14px;
    color: #fff7e8;
    font-size: clamp(42px, 5vw, 68px);
    line-height: .99;
    letter-spacing: -.035em;
}

.academy-slide-one .academy-welcome-panel h1 {
    font-size: clamp(28px, 3.2vw, 42px);
    line-height: 1.08;
    letter-spacing: -.02em;
}

.academy-welcome-panel h2 { font-size: clamp(38px, 4.4vw, 60px); }

.academy-slide-three .academy-welcome-panel h2 {
    font-size: clamp(26px, 3vw, 38px);
    line-height: 1.1;
    letter-spacing: -.02em;
}

.academy-welcome-panel p,
.academy-archive-panel p {
    margin: 0;
    max-width: 440px;
    color: rgba(255,244,221,.82);
    font-size: 14px;
    line-height: 1.65;
}

.academy-panel-note {
    margin-top: 22px;
    padding-top: 15px;
    border-top: 1px solid rgba(215,170,88,.28);
    color: #e9c36f;
    font-size: 11px;
    font-weight: 700;
}

.academy-evidence-hero-shell { justify-content: flex-start; }
.academy-archive-panel { margin-left: auto; }
.archive-stat {
    margin: 11px 0 2px;
    color: #f2d08b;
    font-family: Georgia, "Times New Roman", serif;
    font-size: clamp(58px, 7vw, 86px);
    line-height: 1;
}
.academy-archive-panel h2 {
    margin: 4px 0 12px;
    max-width: 470px;
    color: #fff5df;
    font-family: Georgia, "Times New Roman", serif;
    font-size: clamp(26px, 3vw, 39px);
    line-height: 1.08;
}
.academy-archive-panel a {
    display: inline-block;
    margin-top: 16px;
    color: #eac671;
    font-size: 11px;
    font-weight: 800;
}

.academy-video-shell { justify-content: flex-start; }
.academy-video-panel { width: min(510px, 48vw); }

.academy-carousel-arrow {
    z-index: 5;
    width: 42px;
    height: 42px;
    border: 1px solid rgba(215,170,88,.56);
    background: rgba(5,17,37,.68);
    color: #f2ca74;
    box-shadow: 0 8px 22px rgba(0,0,0,.26);
    backdrop-filter: blur(7px);
}
.academy-carousel-arrow:hover { background: rgba(8,27,56,.88); color: #fff0c5; }

.academy-carousel-dots { z-index: 6; bottom: 18px; }
.academy-carousel-dots .carousel-dot {
    border: 1px solid rgba(238,195,109,.65);
    background: rgba(245,221,166,.35);
}
.academy-carousel-dots .carousel-dot.is-active { background: #e7bd64; }
.academy-carousel-counter { z-index: 6; color: rgba(255,236,195,.72); }

.academy-evidence-section {
    padding: 54px 0 64px;
    background:
        radial-gradient(circle at 50% 0%, rgba(185,143,65,.08), transparent 36%),
        linear-gradient(180deg, #f7f0e4 0%, #efe4d1 100%);
    border-bottom: 1px solid rgba(122,92,46,.26);
}

.academy-section-heading {
    margin: 0 auto 34px;
    text-align: center;
}
.academy-section-heading > span {
    color: #786a55;
    font-family: Georgia, "Times New Roman", serif;
    font-size: 11px;
    font-style: italic;
}
.academy-section-heading h2 {
    margin: 8px 0 5px;
    color: #111b31;
    font-size: clamp(34px, 4vw, 50px);
}
.academy-section-heading p { margin: 0; color: #8d806d; font-size: 11px; }

.academy-stats-grid {
    gap: 20px;
    align-items: start;
}

/* Each evidence card has the same compact body height. Opening one card only
   expands that card; opening all three gives them the same fixed detail height. */
.academy-stat-card {
    --academy-stat-main-height: 300px;
    --academy-stat-detail-height: 148px;
    position: relative;
    display: grid;
    grid-template-columns: 50% 50%;
    grid-template-rows: var(--academy-stat-main-height) auto;
    overflow: hidden;
    border: 1px solid rgba(123,88,40,.23);
    border-radius: 14px;
    background: #f7eddb;
    box-shadow: 0 10px 24px rgba(86,59,24,.10);
    align-self: start;
    height: auto;
}

.academy-stat-card::after {
    content: "✦";
    position: absolute;
    right: 10px;
    bottom: 8px;
    z-index: 5;
    color: #b88430;
    font-size: 12px;
}
.academy-stat-card:hover,
.academy-stat-card:focus-visible {
    transform: none;
    border-color: rgba(164,116,44,.54);
    box-shadow: 0 14px 32px rgba(86,59,24,.15);
}

.academy-stat-copy {
    position: relative;
    z-index: 3;
    min-width: 0;
    padding: 24px 28px 18px 20px;
    background: #fbf4e7;
}

.academy-stat-tag {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: #2b3042;
    font-size: 9px;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: .04em;
}
.academy-stat-tag::before { content: "✦"; color: #b7832e; }
.academy-stat-copy > strong {
    display: block;
    margin: 17px 0 10px;
    color: #3b2a59;
    font-size: clamp(36px, 3.6vw, 52px);
    line-height: 1;
}
.academy-stat-copy > p {
    margin: 0;
    max-width: none;
    color: #4d473f;
    font-size: 13px;
    line-height: 1.45;
}
.academy-card-open {
    display: inline-block;
    margin-top: 17px;
    color: #a2722e;
    font-size: 9px;
    font-weight: 800;
}

/* Exact 50/50 image split. The image overlaps the seam slightly and is faded
   through a dark cinematic gradient, removing the hard half-and-half edge. */
.academy-stat-image {
    position: relative;
    z-index: 1;
    height: var(--academy-stat-main-height);
    min-height: 0;
    margin-left: -58px;
    width: calc(100% + 58px);
    background-size: cover;
    background-position: center;
    filter: saturate(.96) contrast(1.03) brightness(.94);
    -webkit-mask-image: linear-gradient(90deg, transparent 0%, rgba(0,0,0,.42) 12%, #000 30%, #000 100%);
    mask-image: linear-gradient(90deg, transparent 0%, rgba(0,0,0,.42) 12%, #000 30%, #000 100%);
}
.academy-stat-image::after {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background:
        linear-gradient(90deg,
            rgba(4,8,17,.84) 0%,
            rgba(4,8,17,.62) 14%,
            rgba(4,8,17,.30) 30%,
            rgba(4,8,17,.08) 50%,
            rgba(4,8,17,0) 72%),
        linear-gradient(180deg, rgba(3,8,18,.03) 55%, rgba(3,8,18,.18) 100%);
}

.academy-stat-detail {
    grid-column: 1 / -1;
    height: var(--academy-stat-detail-height);
    padding: 15px 20px 18px;
    overflow: auto;
    border-top: 1px solid rgba(123,88,40,.16);
    background: #f2e6d2;
    color: #4f473b;
    box-sizing: border-box;
}
.academy-stat-detail a { color: #8f6425; }

.academy-stat-card[aria-expanded="false"] {
    min-height: var(--academy-stat-main-height);
}
.academy-stat-card[aria-expanded="true"] .academy-stat-detail {
    height: var(--academy-stat-detail-height);
}


.academy-cta-section {
    position: relative;
    overflow: hidden;
    border-bottom: 1px solid rgba(215,170,88,.44);
    background:
        radial-gradient(circle at 82% 45%, rgba(223,172,72,.14), transparent 25%),
        linear-gradient(105deg, #07152c 0%, #071329 44%, #081a37 100%);
}
.academy-cta-section::before {
    content: "";
    position: absolute;
    inset: 0;
    opacity: .32;
    background-image:
        radial-gradient(circle at 84% 28%, rgba(255,202,94,.65) 0 1px, transparent 1.5px),
        radial-gradient(circle at 72% 67%, rgba(255,202,94,.43) 0 1px, transparent 1.5px),
        radial-gradient(circle at 91% 57%, rgba(255,202,94,.35) 0 1px, transparent 1.5px);
}
.academy-cta-inner {
    width: 100%;
    max-width: none;
    min-height: 330px;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    align-items: stretch;
    gap: 0;
}
.academy-cta-visual {
    position: relative;
    min-height: 330px;
    height: 100%;
    overflow: hidden;
    border-right: 1px solid rgba(215,170,88,.22);
}
.academy-cta-visual::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 2;
    background:
        linear-gradient(90deg, rgba(5,17,37,.02), rgba(5,17,37,.05) 58%, rgba(5,17,37,.84) 100%),
        linear-gradient(180deg, rgba(4,13,29,.02), rgba(4,13,29,.12));
}
.academy-cta-visual img {
    display: block;
    width: 100%;
    height: 100%;
    min-height: 330px;
    object-fit: cover;
    object-position: center 54%;
    filter: saturate(.96) contrast(1.04) brightness(.94);
}
.academy-cta-photo {
    border-radius: 0;
}
.academy-cta-copy {
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 44px clamp(42px, 5.5vw, 96px) 72px;
    color: #fff0d0;
}
.academy-cta-copy h2 {
    margin: 8px 0 10px;
    color: #fff4dd;
    font-size: clamp(34px, 4vw, 52px);
}
.academy-cta-copy p {
    max-width: 620px;
    color: rgba(245,231,202,.78);
    font-size: clamp(16px, 1.55vw, 20px);
    line-height: 1.55;
}
.academy-cta-rule {
    position: absolute;
    right: clamp(36px, 4vw, 72px);
    bottom: 28px;
    margin: 0;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    color: #dbad55;
    font-size: 18px;
    line-height: 1;
}
.academy-cta-rule i { display: none; }

.academy-footer {
    padding: 0;
    background: #061226;
    border-top: 1px solid rgba(215,170,88,.35);
    color: #e8ca88;
}
.academy-footer-inner {
    min-height: 72px;
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    gap: 24px;
}
.academy-brand-small img { width: 34px; height: 34px; }
.academy-brand-small strong { font-size: 18px; }
.academy-brand-small small { font-size: 8px; }
.academy-footer-motto {
    color: #d4b36c;
    font-family: Georgia, "Times New Roman", serif;
    font-size: 12px;
    font-style: italic;
    white-space: nowrap;
}
.academy-footer-motto span { color: #dfb65d; margin: 0 7px; }
.academy-footer-motto .green-word { color: #92b788; margin: 0; }
.academy-sdg { justify-self: end; border-color: rgba(218,173,88,.25); color: #d9c79f; background: rgba(255,255,255,.025); }
.academy-footer-values {
    justify-self: end;
    color: #d9c79f;
    font-size: 12px;
    letter-spacing: .02em;
    white-space: nowrap;
}

/* =========================================================
   MAP PAGE
   ========================================================= */
.map-academy { background: #041127; }
.map-academy .academy-map-topbar {
    grid-template-columns: minmax(250px, 1fr) auto minmax(320px, 1fr);
}
.map-academy .map-topbar-actions { gap: 18px; }
.academy-map-title {
    color: #e4c171;
    gap: 12px;
    font-family: Georgia, "Times New Roman", serif;
}
.academy-map-title span { color: #9d7933; font-size: 10px; }
.academy-map-title strong { color: #efd08b; font-size: 13px; letter-spacing: .02em; }

.map-academy .academy-map-nav,
.map-topbar-nav {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 22px;
    justify-self: center;
}

.map-academy .academy-map-nav .academy-nav-link {
    font-size: 13px;
    letter-spacing: .02em;
    white-space: nowrap;
}

.map-academy .academy-map-nav .academy-nav-link.is-active {
    color: #fff0c9 !important;
    text-decoration: underline !important;
    text-underline-offset: 6px;
    text-decoration-color: rgba(232, 200, 106, 0.7);
}

.map-academy .map-app-shell {
    background: #031126;
}
.map-academy .movement-map {
    background: #071421;
}
.map-academy .movement-map .leaflet-tile-pane {
    filter: none;
    mix-blend-mode: normal;
}
.map-academy .movement-map .leaflet-mapLabels-pane {
    filter: none;
    mix-blend-mode: normal;
}
.map-academy .movement-map .maplibregl-map {
    background: #071421;
}
.map-academy .movement-map .leaflet-container {
    position: relative;
    z-index: 5;
}
.map-academy .movement-map::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    pointer-events: none;
    background:
        radial-gradient(circle at 53% 48%, transparent 0 42%, rgba(3,10,25,.08) 66%, rgba(3,10,25,.28) 100%),
        linear-gradient(180deg, rgba(8,22,46,.08), rgba(1,7,18,.14));
}
.academy-map-frame {
    position: absolute;
    inset: 7px;
    z-index: 600;
    border: 1px solid rgba(212,164,71,.38);
    border-radius: 11px;
    box-shadow: inset 0 0 30px rgba(218,165,63,.03);
    pointer-events: none;
}

.academy-weather-chip {
    min-height: 38px !important;
    border: 1px solid rgba(213,165,71,.53) !important;
    border-radius: 999px !important;
    background: rgba(8,25,52,.80) !important;
    color: #f2d596 !important;
    box-shadow: inset 0 0 14px rgba(255,207,102,.025) !important;
}
.academy-weather-chip .weather-live-badge {
    border: 1px solid rgba(92,213,184,.23);
    background: rgba(43,146,121,.16) !important;
    color: #91e4cb !important;
}

/* drawer */
.map-academy .movement-sidebar.academy-drawer {
    top: 86px;
    bottom: 78px;
    left: 16px;
    width: min(430px, calc(100% - 32px));
    padding: 0;
    border: 1px solid rgba(215,170,88,.70);
    border-radius: 18px;
    background:
        linear-gradient(180deg, rgba(252,246,233,.99), rgba(237,226,204,.99));
    box-shadow: 0 25px 70px rgba(0,0,0,.40), inset 0 0 0 4px rgba(95,70,37,.035);
}
.academy-drawer::before,
.academy-drawer::after {
    content: "✦";
    position: absolute;
    z-index: 3;
    color: #b78634;
    font-size: 12px;
}
.academy-drawer::before { left: 11px; top: 10px; }
.academy-drawer::after { right: 11px; bottom: 10px; }

.map-academy .academy-drawer-heading {
    min-height: 94px;
    margin: 0 14px;
    padding: 12px 4px 11px;
    border-bottom: 1px solid rgba(121,94,55,.20);
}
.academy-drawer-title { display: flex !important; align-items: center; gap: 12px; }
.academy-drawer-title > img {
    width: 58px;
    height: 66px;
    object-fit: contain;
    object-position: bottom;
    flex: 0 0 auto;
}
.academy-drawer-title > div { display: grid; gap: 2px; }
.map-academy .drawer-eyebrow { color: #a47b35; letter-spacing: .15em; }
.map-academy .drawer-heading strong {
    color: #1f2636;
    font-family: Georgia, "Times New Roman", serif;
    font-size: 22px;
}
.academy-drawer-title small { max-width: 250px; color: #867966; font-size: 9px; line-height: 1.35; }

.map-academy .movement-sidebar .movement-panel.is-active { padding: 0 14px 14px; }
.map-academy .selected-place-toolbar {
    padding: 8px 0 9px;
    border-bottom: 1px solid rgba(121,94,55,.12);
}
.map-academy .back-to-recommendations { color: #3a3127; font-weight: 850; }
.map-academy .selected-place-toolbar > span { color: #9b8b75; letter-spacing: .12em; }

.map-academy .recommendation-list {
    gap: 10px;
    padding: 10px 4px 8px 0;
}
.map-academy .recommendation-list::-webkit-scrollbar-thumb { background: rgba(137,103,53,.36); }

.map-academy .movement-card.academy-place-card {
    padding: 15px 15px 13px;
    border: 1px solid rgba(102,78,47,.22);
    border-radius: 14px;
    background:
        radial-gradient(circle at 100% 0%, rgba(212,167,86,.09), transparent 25%),
        linear-gradient(180deg, rgba(255,253,247,.95), rgba(248,240,226,.96));
    box-shadow: 0 5px 12px rgba(86,58,29,.06);
}
.map-academy .movement-card.academy-place-card.is-selected {
    border: 1.5px solid #4b3a25;
    box-shadow: 0 8px 18px rgba(78,50,22,.10), inset 0 0 0 1px rgba(218,174,89,.16);
}
.map-academy .movement-card.academy-place-card:hover {
    transform: none !important;
    border-color: rgba(177,129,53,.48);
    box-shadow: 0 8px 19px rgba(78,50,22,.10);
}
.map-academy .movement-card h3 {
    color: #202537;
    font-family: Georgia, "Times New Roman", serif;
    font-size: 18px;
}
.map-academy .movement-card p { color: #867a69; }
.map-academy .spot-category {
    border: 1px solid rgba(174,132,67,.18);
    background: #eee2cd;
    color: #8b7048;
    font-size: 8px;
    letter-spacing: .08em;
}

.map-academy .comfort-badge {
    min-height: 35px;
    border-radius: 999px;
    box-shadow: none;
}
.map-academy .academy-shield { margin-right: -4px; font-size: 10px; opacity: .72; }
.map-academy .comfort-calm { background: rgba(72,196,160,.10); color: #08765e; border-color: #2fac88; }
.map-academy .comfort-moderate { background: rgba(239,177,67,.10); color: #9f6611; border-color: #d59b31; }
.map-academy .comfort-busy { background: rgba(241,94,120,.09); color: #b63e58; border-color: #d9506c; }

.map-academy .academy-breakdown {
    margin-top: 12px;
    border: 1px solid rgba(134,102,56,.18);
    border-radius: 12px;
    background: rgba(246,237,219,.74);
}
.map-academy .breakdown-title { color: #2e2a26; font-family: Georgia, "Times New Roman", serif; }
.map-academy .breakdown-item strong { color: #40372c; }
.map-academy .breakdown-source { color: #9b8a72; }

.map-academy .academy-route-button {
    color: #2c2630;
    font-family: Georgia, "Times New Roman", serif;
    font-size: 12px;
    font-weight: 800;
}
.map-academy .academy-route-button span { color: #ab7c2d; margin-left: 4px; }

.map-academy .show-more-places {
    border: 1px dashed rgba(154,111,50,.42);
    border-radius: 11px;
    background: rgba(255,251,242,.45);
    color: #756855;
}
.map-academy .show-more-places:hover { border-color: #ae7a2b; color: #8c6021; background: rgba(255,251,242,.78); }
.map-academy .academy-type-filter {
    margin-top: 8px;
    border-top-color: rgba(117,88,47,.18);
    background: transparent;
}
.map-academy .filter-label { color: #a4947e; letter-spacing: .13em; }
.map-academy .type-filter {
    border: 1px solid rgba(126,94,52,.20);
    background: rgba(255,253,247,.62);
    color: #7b6e5b;
}
.map-academy .type-filter.is-active {
    border-color: #2e2a28;
    background: #171b28;
    color: #f4d994;
}

.map-academy .map-activity-buttons {
    top: 86px !important;
    left: 16px !important;
}

.map-academy .map-activity-buttons .academy-menu-button {
    top: auto !important;
    left: auto !important;
}

.academy-menu-button {
    border: 1px solid rgba(215,170,88,.66) !important;
    background: linear-gradient(180deg, rgba(9,29,59,.95), rgba(5,17,38,.96)) !important;
    color: #edcf8b !important;
    box-shadow: 0 12px 32px rgba(0,0,0,.35), inset 0 0 0 1px rgba(255,218,139,.04) !important;
}
.academy-menu-button:hover { border-color: #ebc269 !important; color: #fff0c2 !important; }

/* search HUD */
.map-academy .academy-search-row {
    top: 18px;
    width: min(720px, calc(100% - 190px));
}
.map-academy .map-search-wrap {
    min-height: 48px;
    border: 1px solid rgba(215,170,88,.48);
    border-radius: 16px;
    background: rgba(5,18,40,.90);
    box-shadow: 0 12px 34px rgba(0,0,0,.32);
    backdrop-filter: blur(10px);
}
.map-academy .academy-search-rune {
    position: absolute;
    left: 17px;
    top: 50%;
    transform: translate(-50%, -50%);
    z-index: 3;
    color: #c99943;
    font-size: 20px;
    pointer-events: none;
}
.map-academy .map-search-wrap input {
    height: 48px;
    padding-left: 38px;
    border: 0;
    background: transparent;
    color: #f6e8c8;
}
.map-academy .map-search-wrap input::placeholder { color: rgba(232,211,171,.50); }
.map-academy .map-search-wrap input:focus { box-shadow: none; }
.map-academy .map-search-button,
.map-academy .map-locate-button,
.map-academy .map-dark-toggle {
    border: 1px solid rgba(215,170,88,.48);
    background: #081b39;
    color: #efd185;
    box-shadow: 0 8px 24px rgba(0,0,0,.25);
}
.map-academy .map-search-button:hover,
.map-academy .map-locate-button:hover,
.map-academy .map-dark-toggle:hover { background: #102b55; color: #fff0c1; }
.map-academy .map-dark-toggle.is-dark {
    color: #fff0c1;
}
.map-academy .map-search-suggestions {
    border: 1px solid rgba(215,170,88,.45);
    border-radius: 14px;
    background: rgba(249,240,220,.98);
    box-shadow: 0 20px 45px rgba(0,0,0,.34);
}
.map-academy .map-search-suggestion { color: #2c2930; border-bottom-color: rgba(129,96,48,.14); }
.map-academy .map-search-suggestion:hover { background: #efe0c5; }
.map-academy .map-search-suggestion small { color: #897a65; }
.map-academy .search-suggestion-arrow { color: #9e7028; }
.map-academy .map-search-status { color: #f2d797; background: rgba(5,18,40,.88); border-color: rgba(215,170,88,.35); }

/* map legend / markers / popup — bottom-right near zoom controls */
.map-academy .academy-map-legend {
    left: auto;
    right: 58px;
    bottom: 22px;
    gap: 18px;
    padding: 9px 14px;
    border: 1px solid rgba(215,170,88,.45);
    border-radius: 13px;
    background: rgba(4,17,37,.92);
    color: #e8d4aa;
    box-shadow: 0 12px 30px rgba(0,0,0,.32);
}
.map-academy .legend-symbol {
    display: inline-grid;
    place-items: center;
    width: 18px;
    height: 18px;
    margin-right: 4px;
    font-style: normal;
    font-size: 16px;
}
.map-academy .legend-symbol.park { color: #0f8c70; }
.map-academy .legend-symbol.sports { color: #b77d13; }
.map-academy .legend-symbol.recreation { color: #1f5aa8; }

.map-academy .spot-marker {
    width: 28px;
    height: 28px;
}
.map-academy .spot-marker.marker-user {
    width: 20px;
    height: 20px;
    border: 3px solid #fff;
    border-radius: 50%;
    background: #0060fc;
    box-shadow: 0 2px 8px rgba(0, 0, 0, .35);
}

.map-academy .spot-marker.marker-user .marker-core {
    display: none;
}

.map-academy .spot-marker .marker-core {
    display: grid;
    place-items: center;
    width: 28px;
    height: 28px;
    /* The icon IS the pin now (no badge shape behind it) — a drop-shadow
       halo keeps it legible over any basemap colour underneath. */
    filter: drop-shadow(0 0 2px #fff) drop-shadow(0 0 2px #fff) drop-shadow(0 2px 3px rgba(0,0,0,.4));
}
.map-academy .marker-park .marker-core { color: #0f8c70; }
.map-academy .marker-sports .marker-core { color: #c17f0e; }
.map-academy .marker-recreation .marker-core { color: #1f5aa8; }
.map-academy .user-label-tooltip {
    border: 1px solid rgba(215,170,88,.42);
    background: rgba(6,20,43,.92);
    color: #f0d28a;
    box-shadow: 0 6px 18px rgba(0,0,0,.24);
}
.map-academy .spot-label-popup .leaflet-popup-content-wrapper,
.map-academy .spot-label-popup .leaflet-popup-tip {
    border: 1px solid rgba(171,128,61,.32);
    background: #f5ead6;
    color: #342c24;
}
.map-academy .spot-label-popup .leaflet-popup-content-wrapper { border-radius: 12px; }
.map-academy .map-popup-content strong { font-family: Georgia, "Times New Roman", serif; }

/* route — position/size live in map.css (left tall strip); keep academy look only */
.map-academy .academy-route-summary {
    border: 1px solid rgba(215,170,88,.67);
    background:
        radial-gradient(circle at 100% 0%, rgba(219,169,68,.08), transparent 28%),
        linear-gradient(180deg, rgba(248,239,221,.98), rgba(235,222,197,.98));
    box-shadow: 0 18px 44px rgba(0,0,0,.35);
}
.map-academy .academy-route-summary h3 {
    margin: 4px 0 1px;
    color: #202234;
    font-family: Georgia, "Times New Roman", serif;
    font-size: 19px;
}
.map-academy .academy-route-summary p { color: #6f6454; }
.map-academy .academy-route-summary > div > span:last-child { color: #8d724a; }
.map-academy .academy-route-summary button {
    border: 1px solid #a77a2d;
    border-radius: 11px;
    background: linear-gradient(180deg, #152d5a, #071a39);
    color: #f0cf7f;
    box-shadow: inset 0 0 0 1px rgba(255,222,145,.08);
}
.map-academy .academy-route-summary button:hover { background: linear-gradient(180deg, #203c70, #0a2247); }
.map-academy .academy-route-loading {
    border: 1px solid rgba(215,170,88,.43);
    background: rgba(5,18,40,.92);
    color: #efd18b;
}

.map-academy .leaflet-control-zoom a {
    border-color: rgba(215,170,88,.28) !important;
    background: rgba(5,18,40,.92) !important;
    color: #eacb82 !important;
}
.map-academy .leaflet-control-attribution {
    background: rgba(3,12,28,.80) !important;
    color: rgba(231,211,171,.62) !important;
}
.map-academy .leaflet-control-attribution a { color: #dcb86b !important; }

/* =========================================================
   ABOUT PAGE
   ========================================================= */
.about-academy {
    background:
        radial-gradient(circle at 84% 8%, rgba(211,162,69,.10), transparent 25%),
        #07152d;
    color: #f5e8cb;
}
.about-academy .about-main { margin-top: 72px; }
.academy-about-main { background: transparent; }
.academy-about-hero {
    border-bottom: 1px solid rgba(215,170,88,.36);
    background: linear-gradient(120deg, #07162f, #0c2144);
}
.academy-about-hero .about-copy { color: #f5e8cb; }
.academy-about-hero .about-kicker { color: #d1a653; }
.academy-about-hero h1 { color: #fff2d2; }
.academy-about-hero p { color: rgba(242,226,193,.72); }
.academy-primary-link { border-color: #b98837 !important; background: #102a54 !important; color: #efcf84 !important; }
.academy-team-logo-card {
    border: 1px solid rgba(215,170,88,.48) !important;
    background: linear-gradient(145deg, #f4ead7, #e8dbc2) !important;
    box-shadow: var(--academy-shadow) !important;
}
.academy-team-section { background: #efe3ce !important; color: #1a2133; }
.academy-team-section .about-section-heading span { color: #9e752f; }
.academy-team-photo-card { border: 1px solid rgba(126,90,42,.25) !important; box-shadow: 0 18px 42px rgba(41,28,15,.16) !important; }
.academy-about-values { background: #07152d !important; }
.academy-about-values article { border-color: rgba(215,170,88,.30) !important; background: rgba(13,33,65,.76) !important; color: #f2dfb8; }
.academy-about-values article > span { color: #c99b49 !important; }
.academy-about-values h3 { color: #f7e7c5 !important; font-family: Georgia, "Times New Roman", serif; }
.academy-about-values p { color: rgba(237,218,178,.70) !important; }
.academy-about-footer { border-top-color: rgba(215,170,88,.34) !important; background: #051126 !important; color: #cbb588 !important; }

/* =========================================================
   RESPONSIVE
   ========================================================= */
@media (max-width: 980px) {
    .academy-theme .academy-topbar { padding: 0 20px; }
    .academy-brand strong { font-size: 21px; }
    .academy-guide-card { width: 300px; }
    .academy-welcome-panel, .academy-archive-panel { width: min(520px, 58vw); }
    .academy-footer-inner { grid-template-columns: 1fr 1fr; }
    .academy-footer-motto { display: none; }
    .map-academy .academy-map-topbar { grid-template-columns: minmax(210px, 1fr) auto; }
    .map-academy .academy-map-title { display: none; }
    .map-academy .academy-map-nav {
        gap: 14px;
    }
    .map-academy .academy-map-nav .academy-nav-link {
        font-size: 12px;
    }
}

@media (max-width: 760px) {
    .academy-theme .academy-topbar { height: 64px; padding: 0 13px; }
    .academy-brand img { width: 38px; height: 38px; }
    .academy-brand strong { font-size: 18px; }
    .academy-brand small { display: none; }
    .academy-header-actions { gap: 12px; }
    .academy-primary-button { min-height: 38px; padding: 0 12px; font-size: 11px; }
    .academy-hero { margin-top: 64px; height: 560px; min-height: 560px; }
    .academy-hero-shell { align-items: flex-end; padding-bottom: 52px; }
    .academy-guide-card { top: 18px; left: 14px; width: calc(100% - 28px); min-height: 105px; padding-left: 90px; }
    .academy-guide-card img { width: 78px; height: 98px; }
    .academy-welcome-panel, .academy-archive-panel, .academy-video-panel { width: 100%; padding: 24px; }
    .academy-welcome-panel h1, .academy-welcome-panel h2 { font-size: 42px; }
    .academy-slide-one .academy-welcome-panel h1 { font-size: 30px; }
    .academy-slide-three .academy-welcome-panel h2 { font-size: 28px; }
    .academy-archive-panel { margin: 0; }
    .academy-stats-grid { grid-template-columns: 1fr; }
    .academy-stat-card { grid-template-columns: 50% 50%; --academy-stat-main-height: 270px; --academy-stat-detail-height: 154px; }
    .academy-cta-inner { grid-template-columns: 1fr; gap: 0; }
    .academy-cta-visual { display: block; min-height: 230px; height: 230px; border-right: 0; border-bottom: 1px solid rgba(215,170,88,.22); }
    .academy-cta-visual img { min-height: 230px; }
    .academy-cta-copy { padding: 42px 28px 64px; }
    .academy-footer-inner { min-height: 92px; grid-template-columns: 1fr; gap: 10px; padding: 14px 0; }
    .academy-sdg,
    .academy-footer-values { justify-self: start; }

    .map-academy .map-app-shell { margin-top: 64px; height: calc(100vh - 64px); }
    .map-academy .academy-map-topbar { grid-template-columns: 1fr auto; }
    .map-academy .academy-map-actions { gap: 8px; }
    .map-academy .academy-drawer { top: 126px; bottom: 68px; left: 10px; width: min(420px, calc(100% - 20px)); }
    .map-academy .academy-search-row { top: 62px; width: calc(100% - 20px); }
    .map-academy .map-activity-buttons { top: 126px !important; left: 10px !important; }
    .map-academy .academy-map-legend { left: auto; right: 52px; bottom: 12px; }
}

@media (max-width: 560px) {
    .academy-nav-link { font-size: 10px; }
    .academy-primary-button { max-width: 155px; }
    .academy-hero { height: 610px; }
    .academy-welcome-panel p { font-size: 12px; }
    .academy-guide-card p { display: none; }
    .academy-stat-card { grid-template-columns: 1fr; grid-template-rows: 180px auto auto; --academy-stat-main-height: auto; }
    .academy-stat-image { min-height: 180px; height: 180px; width: 100%; margin-left: 0; grid-row: 1; -webkit-mask-image: linear-gradient(180deg, #000 0%, #000 68%, transparent 100%); mask-image: linear-gradient(180deg, #000 0%, #000 68%, transparent 100%); }
    .academy-stat-copy { grid-row: 2; padding-top: 16px; }
    .academy-stat-detail { grid-row: 3; height: auto; min-height: 0; overflow: visible; }
    .academy-stat-card[aria-expanded="true"] .academy-stat-detail { height: auto; }
    .map-academy .academy-drawer-heading { min-height: 82px; }
    .academy-drawer-title > img { width: 45px; height: 54px; }
    .academy-drawer-title small { display: none; }
}

/* Small supplied compass artwork used as a restrained route-card watermark. */
.map-academy .academy-route-summary::after {
    content: "";
    position: absolute;
    right: 120px;
    top: 50%;
    width: 58px;
    height: 58px;
    transform: translateY(-50%);
    background: url("../images/academy/academy-compass.png") center / contain no-repeat;
    opacity: .10;
    pointer-events: none;
}
.map-academy .academy-route-summary > * { position: relative; z-index: 1; }
@media (max-width: 560px) {
    .map-academy .academy-route-summary::after { display: none; }
}

/* =========================================================
   ACADEMY MAP DRAWER — compact quest-list treatment
   ========================================================= */
.map-academy .movement-sidebar.academy-drawer {
    width: min(390px, calc(100% - 32px));
    border: 1px solid rgba(210, 158, 66, .72);
    border-radius: 18px;
    background:
        radial-gradient(circle at 14% 3%, rgba(73, 56, 133, .18), transparent 28%),
        linear-gradient(180deg, rgba(5, 21, 48, .985), rgba(3, 15, 36, .99));
    box-shadow: 0 24px 66px rgba(0, 0, 0, .52), inset 0 0 0 1px rgba(246, 205, 111, .045);
}

.map-academy .academy-drawer::before,
.map-academy .academy-drawer::after {
    color: #d8a54a;
    opacity: .82;
}

.map-academy .academy-drawer-heading {
    min-height: 72px;
    margin: 0 10px;
    padding: 9px 2px 10px;
    border-bottom: 1px solid rgba(214, 169, 83, .24);
}

.academy-mode-tab {
    min-width: 214px;
    height: 50px;
    padding: 0 17px 0 11px;
    display: inline-flex !important;
    align-items: center;
    gap: 10px;
    border: 1px solid rgba(218, 170, 83, .68);
    border-radius: 13px 17px 17px 13px;
    background:
        linear-gradient(180deg, rgba(72, 61, 150, .96), rgba(31, 29, 92, .98));
    color: #f6d477;
    box-shadow:
        inset 0 0 0 2px rgba(190, 146, 63, .12),
        0 7px 19px rgba(0, 0, 0, .28);
}

.academy-mode-icon {
    width: 33px;
    height: 33px;
    flex: 0 0 auto;
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: rgba(8, 20, 50, .78);
    border: 1px solid rgba(236, 190, 92, .36);
}

.academy-mode-icon img {
    width: 25px;
    height: 25px;
    object-fit: contain;
}

.academy-mode-copy {
    display: grid;
    gap: 0;
    text-align: left;
}

.academy-mode-copy small {
    color: rgba(245, 218, 155, .68);
    font-size: 7px;
    font-weight: 900;
    letter-spacing: .13em;
}

.academy-mode-copy strong {
    color: #f5d276 !important;
    font-family: Georgia, "Times New Roman", serif !important;
    font-size: 19px !important;
    font-weight: 700;
}

.map-academy .movement-sidebar .movement-panel.is-active {
    padding: 0 10px 10px;
}

.map-academy .selected-place-toolbar {
    margin: 0 2px 4px;
    padding: 8px 3px;
    border-bottom: 1px solid rgba(217, 171, 83, .18);
}

.map-academy .back-to-recommendations {
    color: #06142b;
}

.map-academy .selected-place-toolbar > span {
    color: rgba(6, 20, 43, .68);
}

.map-academy .recommendation-list {
    gap: 5px;
    padding: 7px 4px 7px 0;
}

.map-academy .recommendation-list::-webkit-scrollbar-thumb {
    background: rgba(226, 181, 92, .32);
}

.map-academy .movement-card.academy-place-card {
    padding: 9px 10px;
    border: 1px solid rgba(177, 139, 76, .34);
    border-radius: 11px;
    background:
        radial-gradient(circle at 100% 0%, rgba(218, 172, 86, .09), transparent 31%),
        linear-gradient(180deg, #fff8e9, #f3e3c7);
    box-shadow: 0 3px 8px rgba(0, 0, 0, .16);
    cursor: pointer;
}

.map-academy .movement-card.academy-place-card:hover {
    border-color: rgba(226, 178, 85, .72);
    box-shadow: 0 5px 13px rgba(0, 0, 0, .20);
}

.map-academy .movement-card.academy-place-card.is-selected {
    padding: 13px 12px 12px;
    border: 1.5px solid #8e6a31;
    border-radius: 14px;
    background:
        radial-gradient(circle at 100% 0%, rgba(224, 175, 87, .13), transparent 30%),
        linear-gradient(180deg, #fff9ec, #f5e6ca);
    box-shadow: 0 8px 18px rgba(0, 0, 0, .25), inset 0 0 0 1px rgba(255, 223, 157, .52);
}

.academy-place-layout {
    display: grid;
    grid-template-columns: 45px minmax(0, 1fr) 18px;
    gap: 9px;
    align-items: center;
}

.academy-place-medallion {
    width: 45px;
    height: 45px;
    display: grid;
    place-items: center;
    align-self: center;
    overflow: hidden;
    border-radius: 50%;
    border: 1px solid #c3913b;
    background:
        radial-gradient(circle at 35% 25%, rgba(122, 104, 219, .55), transparent 35%),
        linear-gradient(145deg, #30266f, #101f4f 70%);
    box-shadow: inset 0 0 0 2px rgba(237, 191, 94, .16), 0 4px 9px rgba(15, 18, 47, .18);
}

.academy-place-medallion img {
    width: 34px;
    height: 34px;
    object-fit: contain;
    filter: drop-shadow(0 1px 1px rgba(0,0,0,.2));
}

.academy-place-body {
    min-width: 0;
}

.map-academy .movement-card .movement-card-topline {
    align-items: start;
    gap: 8px;
}

.map-academy .movement-card h3 {
    margin: 0 0 1px;
    font-size: 14px;
    line-height: 1.1;
    color: #19223a;
}

.map-academy .academy-quest-subtitle {
    margin: 0 !important;
    color: #4c3d47 !important;
    font-family: Georgia, "Times New Roman", serif;
    font-size: 9px !important;
    font-style: italic;
    line-height: 1.25;
}

.map-academy .movement-card .spot-distance {
    margin-top: 4px;
    color: #655a4b;
    font-size: 10px;
}

.map-academy .movement-card .spot-category {
    padding: 5px 8px;
    border-color: rgba(164, 116, 45, .22);
    background: #e8d4ac;
    color: #76552c;
    font-size: 7px;
}

.academy-card-chevron {
    color: #273148;
    font-size: 18px;
    font-weight: 900;
    text-align: center;
    line-height: 1;
}

/* Compact rows match the reference list: icon + quest name + category + chevron. */
.map-academy .academy-place-card:not(.is-selected) .spot-distance,
.map-academy .academy-place-card:not(.is-selected) .comfort-row,
.map-academy .academy-place-card:not(.is-selected) .academy-breakdown,
.map-academy .academy-place-card:not(.is-selected) .academy-route-button {
    display: none !important;
}

/* The selected quest becomes the expanded parchment card. */
.map-academy .academy-place-card.is-selected .academy-place-layout {
    grid-template-columns: 56px minmax(0, 1fr);
    gap: 11px;
    align-items: start;
}

.map-academy .academy-place-card.is-selected .academy-place-medallion {
    width: 56px;
    height: 56px;
    margin-top: 1px;
}

.map-academy .academy-place-card.is-selected .academy-place-medallion img {
    width: 43px;
    height: 43px;
}

.map-academy .academy-place-card.is-selected h3 {
    font-size: 17px;
}

.map-academy .academy-place-card.is-selected .academy-quest-subtitle {
    font-size: 10px !important;
}

.map-academy .academy-place-card.is-selected .academy-card-chevron {
    display: none;
}

.map-academy .academy-place-card.is-selected .comfort-row {
    margin-top: 7px;
}

.map-academy .academy-place-card.is-selected .comfort-badge {
    min-height: 30px;
    padding: 0 9px;
    gap: 6px;
    border-width: 0;
    border-radius: 9px;
    background: transparent;
    box-shadow: none;
    font-family: Georgia, "Times New Roman", serif;
    font-size: 11px;
}

.map-academy .academy-place-card.is-selected .comfort-dot {
    width: 7px;
    height: 7px;
}

.map-academy .academy-place-card.is-selected .academy-shield {
    display: inline-grid;
    place-items: center;
    width: 19px;
    height: 19px;
    margin-right: 0;
    border: 1px solid currentColor;
    border-radius: 6px 6px 8px 8px;
    font-size: 8px;
}

.map-academy .academy-breakdown {
    margin-top: 7px;
    padding: 10px 10px 8px;
    border: 1px solid rgba(127, 96, 49, .24);
    border-radius: 9px;
    background: rgba(255, 248, 232, .55);
}

.map-academy .breakdown-title {
    margin-bottom: 9px !important;
    color: #30273a !important;
    font-size: 11px !important;
}

.map-academy .breakdown-item {
    grid-template-columns: 17px minmax(0, 1fr);
    gap: 6px;
    margin-bottom: 7px;
}

.map-academy .breakdown-item strong {
    color: #23304c;
    font-family: Georgia, "Times New Roman", serif;
    font-size: 10px;
}

.map-academy .breakdown-item p {
    color: #4f4b4b !important;
    font-size: 8px !important;
    line-height: 1.28;
}

.map-academy .breakdown-source {
    margin-top: 8px;
    padding-top: 7px;
    color: #877961;
    font-size: 7px;
}

.map-academy .academy-route-button {
    margin-top: 8px;
    color: #17223b;
    font-size: 11px;
}

.map-academy .show-more-places {
    min-height: 31px;
    margin: 4px 0 2px;
    border-color: rgba(211, 169, 88, .38);
    background: rgba(17, 34, 67, .72);
    color: #e4c681;
}

.map-academy .show-more-places:hover {
    border-color: #dfb45d;
    background: rgba(26, 48, 89, .92);
    color: #ffe6a3;
}

.map-academy .academy-type-filter {
    margin-top: 6px;
    padding: 9px 2px 1px;
    border-top-color: rgba(212, 166, 81, .24);
    background: transparent;
}

.map-academy .filter-label {
    color: rgba(227, 198, 137, .58);
}

.map-academy .type-filter {
    min-height: 31px;
    border-color: rgba(210, 166, 83, .28);
    background: rgba(8, 24, 52, .78);
    color: #ddc48d;
}

.map-academy .type-filter.is-active {
    border-color: #d7a84d;
    background: linear-gradient(180deg, #433b88, #201f60);
    color: #ffe08a;
}

@media (max-width: 760px) {
    .map-academy .movement-sidebar.academy-drawer {
        width: min(390px, calc(100% - 20px));
    }
}

/* =========================================================
   MAP VISIBILITY REFINEMENT
   Keep the fixed Type footer fully inside the drawer and make
   the academy basemap easier to read without losing the dark theme.
   ========================================================= */
.map-academy .movement-sidebar.academy-drawer {
    bottom: 96px;
}

.map-academy .movement-sidebar .movement-panel.is-active {
    padding-bottom: 8px;
}

.map-academy .academy-type-filter {
    flex: 0 0 auto;
    min-height: 66px;
    margin-top: 5px;
    padding: 9px 2px 10px;
    box-sizing: border-box;
}

.map-academy .academy-type-filter .filter-pills {
    flex-wrap: nowrap;
    gap: 6px;
}

.map-academy .academy-type-filter .type-filter {
    min-height: 30px;
    padding-inline: 11px;
    white-space: nowrap;
}

/* Vector basemap carries navy / emerald / gold paints — do not recolor tiles. */
.map-academy .movement-map .leaflet-tile-pane {
    filter: none;
    mix-blend-mode: normal;
}

.map-academy .movement-map::after {
    background:
        radial-gradient(circle at 53% 48%, transparent 0 48%, rgba(3,10,25,.025) 72%, rgba(3,10,25,.10) 100%),
        linear-gradient(180deg, rgba(8,22,46,.015), rgba(1,7,18,.045));
}

@media (max-width: 760px) {
    .map-academy .movement-sidebar.academy-drawer {
        bottom: 82px;
    }

    .map-academy .academy-type-filter {
        min-height: 62px;
        padding-bottom: 8px;
    }

    .map-academy .academy-type-filter .type-filter {
        padding-inline: 9px;
    }
}

/* =========================================================
   MAP REFINEMENT V2
   - Keep the Type footer safely above the drawer's rounded edge.
   - Brighten the OSM basemap while preserving the academy theme.
   ========================================================= */
.map-academy .movement-sidebar .movement-panel.is-active {
    padding-bottom: 14px;
}

.map-academy .academy-type-filter {
    flex: 0 0 auto;
    min-height: 82px;
    margin: 6px 0 8px;
    padding: 9px 2px 18px;
    box-sizing: border-box;
}

.map-academy .academy-type-filter .filter-pills {
    align-items: center;
}

.map-academy .academy-type-filter .type-filter {
    min-height: 31px;
}

/* Academy vector basemap: navy city, emerald parks, restrained gold roads. */
.map-academy .movement-map {
    background: #071421;
}

.map-academy .movement-map .leaflet-tile-pane {
    filter: none;
    mix-blend-mode: normal;
}

.map-academy .movement-map .leaflet-mapLabels-pane {
    filter: none;
    mix-blend-mode: normal;
}

.map-academy .movement-map .leaflet-tile {
    opacity: .98;
}

.map-academy .movement-map .leaflet-mapLabels-pane {
    filter: grayscale(1) brightness(2.35) contrast(1.2);
    mix-blend-mode: screen;
}

.map-academy .movement-map::after {
    background:
        radial-gradient(circle at 53% 48%, transparent 0 58%, rgba(4, 13, 31, .015) 78%, rgba(4, 13, 31, .055) 100%),
        linear-gradient(180deg, rgba(10, 28, 54, .006), rgba(2, 9, 22, .018));
}

@media (max-width: 760px) {
    .map-academy .academy-type-filter {
        min-height: 76px;
        margin-bottom: 6px;
        padding-bottom: 15px;
    }
}


/* Magical walking route layer styling. */
.map-academy .leaflet-overlay-pane path.academy-route-aura {
    filter: drop-shadow(0 0 10px rgba(29, 78, 216, .68))
            drop-shadow(0 0 24px rgba(56, 189, 248, .34));
}
.map-academy .leaflet-overlay-pane path.academy-route-glow {
    filter: drop-shadow(0 0 7px rgba(56, 189, 248, .82));
}
.map-academy .leaflet-overlay-pane path.academy-route-core {
    filter: drop-shadow(0 0 4px rgba(219, 234, 254, .95));
}
.map-academy .leaflet-overlay-pane path.academy-route-flow-line {
    stroke-linecap: round;
    filter: drop-shadow(0 0 3px rgba(255, 255, 255, .9));
    pointer-events: none;
}

/* On stacked mobile cards the image no longer overlaps the copy column. */
@media (max-width: 560px) {
    .academy-stat-image {
        margin-left: 0;
        padding-left: 0;
    }
}


/* =========================================================
   SANCTUARY CARD REFINEMENT
   ========================================================= */
.map-academy .academy-place-card.is-selected .comfort-row.sanctuary-overview {
    min-height: 58px;
    margin: 10px 0 2px;
    padding: 7px 2px 7px 0;
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr) 34px;
    align-items: center;
    gap: 9px;
}

.map-academy .sanctuary-status-mark {
    width: 39px;
    height: 39px;
    display: grid;
    place-items: center;
    border: 2px solid currentColor;
    border-radius: 12px 12px 16px 16px;
    background: rgba(255,255,255,.55);
    font-family: Georgia, "Times New Roman", serif;
    font-size: 23px;
    font-weight: 800;
    line-height: 1;
    box-shadow: 0 5px 12px rgba(26, 41, 49, .08);
}
.map-academy .sanctuary-overview.comfort-calm { color: #138561; }
.map-academy .sanctuary-overview.comfort-moderate { color: #b47a11; }
.map-academy .sanctuary-overview.comfort-busy { color: #bd3b54; }

.map-academy .sanctuary-status-copy { min-width: 0; }
.map-academy .sanctuary-status-copy strong {
    display: block;
    color: currentColor;
    font-family: Georgia, "Times New Roman", serif;
    font-size: 15px;
    line-height: 1.05;
}
.map-academy .sanctuary-status-copy small {
    display: block;
    margin-top: 3px;
    color: #7f7568;
    font-family: Inter, ui-sans-serif, system-ui, sans-serif;
    font-size: 8px;
    line-height: 1.25;
}

.map-academy .academy-place-card.is-selected .comfort-badge.sanctuary-toggle {
    width: 31px;
    min-width: 31px;
    height: 31px;
    min-height: 31px;
    padding: 0;
    display: grid;
    place-items: center;
    border: 1px solid rgba(123, 101, 68, .22);
    border-radius: 50%;
    background: rgba(255,255,255,.78);
    color: currentColor;
    box-shadow: 0 4px 10px rgba(36, 28, 18, .10);
}
.map-academy .academy-place-card.is-selected .comfort-badge.sanctuary-toggle:hover {
    background: #fffdf8;
    box-shadow: 0 5px 14px rgba(36, 28, 18, .14);
}
.map-academy .comfort-badge.sanctuary-toggle .comfort-chevron {
    margin: 0;
    transform-origin: center;
}
.map-academy .comfort-badge.sanctuary-toggle.is-expanded .comfort-chevron {
    transform: rotate(180deg);
}

.map-academy .academy-breakdown.sanctuary-breakdown {
    margin: 8px 0 3px;
    padding: 11px 11px 7px;
    border: 1px solid rgba(128, 98, 55, .22);
    border-radius: 12px;
    background: rgba(255, 251, 242, .74);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.68);
}
.map-academy .sanctuary-breakdown-heading {
    display: flex;
    align-items: center;
    gap: 7px;
    margin-bottom: 5px;
}
.map-academy .sanctuary-breakdown-rune {
    width: 24px;
    height: 24px;
    display: grid;
    place-items: center;
    border: 1px solid rgba(47, 59, 78, .12);
    border-radius: 50%;
    background: #fffdf8;
    color: #1d2a45;
    font-size: 11px;
}
.map-academy .sanctuary-breakdown .breakdown-title {
    margin: 0 !important;
    color: #1d2944 !important;
    font-size: 12px !important;
}

.map-academy .sanctuary-metric-row {
    min-height: 68px;
    display: grid;
    grid-template-columns: 32px 105px minmax(120px, 1fr);
    gap: 8px;
    align-items: center;
    padding: 8px 0;
    border-top: 1px solid rgba(111, 91, 60, .11);
}
.map-academy .sanctuary-metric-row:first-of-type { border-top: 0; }
.map-academy .sanctuary-metric-icon {
    width: 30px;
    height: 30px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    font-family: Georgia, "Times New Roman", serif;
    font-size: 12px;
    font-weight: 900;
}
.map-academy .sanctuary-metric-icon.crowd { background: #dff2df; color: #158154; }
.map-academy .sanctuary-metric-icon.noise { background: #fff0c9; color: #c58a10; }
.map-academy .sanctuary-metric-icon.air { background: #e0f1df; color: #26814e; }

.map-academy .sanctuary-metric-copy { min-width: 0; }
.map-academy .sanctuary-metric-copy strong {
    display: block;
    color: #1c2944;
    font-family: Georgia, "Times New Roman", serif;
    font-size: 10px;
}
.map-academy .sanctuary-metric-copy p {
    margin: 3px 0 0 !important;
    color: #6d665e !important;
    font-size: 7.2px !important;
    line-height: 1.28;
}
.map-academy .sanctuary-metric-pill {
    width: fit-content;
    margin-top: 3px;
    padding: 2px 6px;
    display: inline-flex;
    border-radius: 999px;
    font-size: 7px;
    font-weight: 900;
}
.map-academy .sanctuary-metric-pill.band-low,
.map-academy .sanctuary-metric-pill.band-quiet,
.map-academy .sanctuary-metric-pill.band-good { background: #dff2dc; color: #16794f; }
.map-academy .sanctuary-metric-pill.band-moderate { background: #fff0bf; color: #a66b00; }
.map-academy .sanctuary-metric-pill.band-high,
.map-academy .sanctuary-metric-pill.band-noisy,
.map-academy .sanctuary-metric-pill.band-poor { background: #f8d9dd; color: #ad334b; }
.map-academy .sanctuary-metric-pill.band-unknown { background: #ece8e1; color: #736d66; }

.map-academy .sanctuary-meter { min-width: 0; }
.map-academy .sanctuary-meter-track {
    position: relative;
    height: 8px;
    overflow: visible;
    border-radius: 999px;
    background: linear-gradient(90deg, #d9eee0 0 33%, #faedc8 33% 66%, #efd9dc 66% 100%);
}
.map-academy .sanctuary-meter-fill {
    position: absolute;
    inset: 0 auto 0 0;
    width: 16%;
    border-radius: inherit;
    background: #3ca65d;
}
.map-academy .sanctuary-meter-pointer {
    position: absolute;
    top: -6px;
    left: 16%;
    width: 0;
    height: 0;
    border-left: 4px solid transparent;
    border-right: 4px solid transparent;
    border-top: 5px solid #2f9953;
    transform: translateX(-50%);
}
.map-academy .sanctuary-meter.band-moderate .sanctuary-meter-fill { width: 50%; background: #e8aa1c; }
.map-academy .sanctuary-meter.band-moderate .sanctuary-meter-pointer { left: 50%; border-top-color: #d9980c; }
.map-academy .sanctuary-meter.band-high .sanctuary-meter-fill,
.map-academy .sanctuary-meter.band-noisy .sanctuary-meter-fill,
.map-academy .sanctuary-meter.band-poor .sanctuary-meter-fill { width: 84%; background: #d35a6c; }
.map-academy .sanctuary-meter.band-high .sanctuary-meter-pointer,
.map-academy .sanctuary-meter.band-noisy .sanctuary-meter-pointer,
.map-academy .sanctuary-meter.band-poor .sanctuary-meter-pointer { left: 84%; border-top-color: #c64359; }
.map-academy .sanctuary-meter.band-quiet .sanctuary-meter-fill,
.map-academy .sanctuary-meter.band-good .sanctuary-meter-fill,
.map-academy .sanctuary-meter.band-low .sanctuary-meter-fill { width: 16%; background: #3ca65d; }
.map-academy .sanctuary-meter.band-quiet .sanctuary-meter-pointer,
.map-academy .sanctuary-meter.band-good .sanctuary-meter-pointer,
.map-academy .sanctuary-meter.band-low .sanctuary-meter-pointer { left: 16%; border-top-color: #2f9953; }
.map-academy .sanctuary-meter.band-unknown .sanctuary-meter-fill { width: 50%; background: #aaa39a; }
.map-academy .sanctuary-meter.band-unknown .sanctuary-meter-pointer { left: 50%; border-top-color: #8e877f; }
.map-academy .sanctuary-meter-labels {
    margin-top: 5px;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    color: #898078;
    font-size: 6.2px;
    text-align: center;
}

/* Raw source timestamps are hidden from the recommendation drawer. */
.map-academy .data-note,
.map-academy .breakdown-source { display: none !important; }

@media (max-width: 560px) {
    .map-academy .sanctuary-metric-row {
        grid-template-columns: 30px minmax(82px, .8fr) minmax(100px, 1.2fr);
        gap: 6px;
    }
}

/* =========================================================
   SILENTOE ACADEMY STORY PAGE
   ========================================================= */
.academy-story-page {
    min-height: 100vh;
    background:
        radial-gradient(circle at 82% 10%, rgba(210, 161, 67, .10), transparent 25%),
        linear-gradient(180deg, #06142c 0%, #0a1b38 48%, #07152d 100%);
    color: #f4e3be;
}
.academy-story-page .about-topbar {
    background: rgba(5, 17, 38, .93) !important;
    border-bottom: 1px solid rgba(214, 166, 74, .34);
}
.academy-story-main {
    width: min(1280px, calc(100% - 64px));
    margin: 0 auto;
    padding: 118px 0 78px;
}
.academy-story-hero {
    min-height: 590px;
    display: grid;
    grid-template-columns: minmax(0, 1.08fr) minmax(360px, .72fr);
    gap: 64px;
    align-items: center;
}
.academy-story-copy .about-kicker,
.academy-story-heading > span,
.academy-headmaster-copy > span {
    color: #d5a855;
    font-size: 11px;
    font-weight: 900;
    letter-spacing: .18em;
}
.academy-story-copy h1 {
    margin: 20px 0 28px;
    max-width: 760px;
    color: #fff0ca;
    font-family: Georgia, "Times New Roman", serif;
    font-size: clamp(58px, 6.4vw, 96px);
    font-weight: 500;
    line-height: .94;
    letter-spacing: -.04em;
}
.academy-story-copy h1 em { color: #dfb45f; font-weight: 500; }
.academy-story-copy p {
    max-width: 720px;
    margin: 0 0 16px;
    color: rgba(241, 222, 184, .76);
    font-size: 17px;
    line-height: 1.75;
}
.academy-story-copy strong { color: #f0c96f; }
.academy-crest-showcase {
    position: relative;
    min-height: 500px;
    display: grid;
    place-items: center;
    align-content: center;
    overflow: hidden;
    border: 1px solid rgba(218, 172, 84, .42);
    border-radius: 34px;
    background:
        radial-gradient(circle at 50% 42%, rgba(213, 168, 85, .12), transparent 42%),
        rgba(8, 25, 52, .72);
    box-shadow: 0 24px 70px rgba(0,0,0,.28), inset 0 0 60px rgba(210,161,71,.04);
}
.academy-crest-showcase .crest-glow {
    position: absolute;
    width: 360px;
    height: 360px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(226,181,92,.18), rgba(226,181,92,0) 68%);
    filter: blur(10px);
}
.academy-crest-showcase img {
    position: relative;
    z-index: 1;
    width: min(370px, 78%);
    max-height: 390px;
    object-fit: contain;
    filter: drop-shadow(0 16px 30px rgba(0,0,0,.34));
}
.academy-crest-showcase p {
    position: relative;
    z-index: 1;
    margin: 8px 0 0;
    color: #cda95e;
    font-family: Georgia, "Times New Roman", serif;
    font-style: italic;
    letter-spacing: .04em;
}
.academy-symbol-section {
    padding: 86px 0 96px;
    border-top: 1px solid rgba(214, 166, 74, .24);
}
.academy-story-heading {
    max-width: 760px;
    margin-bottom: 34px;
}
.academy-story-heading h2,
.academy-headmaster-copy h2 {
    margin: 12px 0 0;
    color: #fff0ca;
    font-family: Georgia, "Times New Roman", serif;
    font-size: clamp(38px, 4.2vw, 62px);
    font-weight: 500;
    line-height: 1.03;
    letter-spacing: -.035em;
}
.academy-symbol-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
}
.academy-symbol-grid article {
    min-height: 175px;
    padding: 24px 26px;
    display: grid;
    grid-template-columns: 92px minmax(0, 1fr);
    align-items: center;
    gap: 22px;
    border: 1px solid rgba(214,166,74,.27);
    border-radius: 22px;
    background: linear-gradient(135deg, rgba(16, 38, 73, .88), rgba(8, 25, 51, .78));
}
.academy-symbol-grid img {
    width: 88px;
    height: 88px;
    object-fit: contain;
    filter: drop-shadow(0 7px 16px rgba(0,0,0,.25));
}
.academy-symbol-grid article span { color: #b78a3b; font-size: 10px; font-weight: 900; letter-spacing: .14em; }
.academy-symbol-grid h3 {
    margin: 6px 0 8px;
    color: #f7e6c0;
    font-family: Georgia, "Times New Roman", serif;
    font-size: 22px;
}
.academy-symbol-grid p { margin: 0; color: rgba(235,215,176,.67); font-size: 14px; line-height: 1.55; }
.academy-headmaster-section {
    min-height: 610px;
    display: grid;
    grid-template-columns: minmax(360px, .74fr) minmax(0, 1fr);
    align-items: center;
    gap: 58px;
    padding: 70px 0;
    border-top: 1px solid rgba(214,166,74,.24);
}
.academy-headmaster-portrait {
    margin: 0;
    overflow: hidden;
    border: 1px solid rgba(220,174,83,.48);
    border-radius: 28px;
    background: #08162e;
    box-shadow: 0 24px 60px rgba(0,0,0,.34);
}
.academy-headmaster-portrait img {
    width: 100%;
    aspect-ratio: 3 / 4;
    display: block;
    object-fit: cover;
}
.academy-headmaster-copy p {
    max-width: 650px;
    margin: 22px 0 0;
    color: rgba(239,220,182,.72);
    font-size: 16px;
    line-height: 1.72;
}
.academy-headmaster-copy blockquote {
    max-width: 660px;
    margin: 30px 0 0;
    padding: 24px 0 24px 28px;
    border-left: 2px solid #d5a855;
    color: #efca79;
    font-family: Georgia, "Times New Roman", serif;
    font-size: 24px;
    font-style: italic;
    line-height: 1.4;
}
.academy-headmaster-copy .headmaster-signoff { color: #c4a363; font-size: 13px; font-weight: 800; }
.academy-story-footer { width: 100%; }

@media (max-width: 900px) {
    .academy-story-main { width: min(100% - 36px, 760px); padding-top: 100px; }
    .academy-story-hero,
    .academy-headmaster-section { grid-template-columns: 1fr; gap: 34px; }
    .academy-crest-showcase { min-height: 390px; }
    .academy-symbol-grid { grid-template-columns: 1fr; }
    .academy-headmaster-portrait { max-width: 520px; }
}
@media (max-width: 560px) {
    .academy-story-main { width: calc(100% - 24px); }
    .academy-story-hero { min-height: auto; }
    .academy-symbol-grid article { grid-template-columns: 70px minmax(0, 1fr); padding: 20px; }
    .academy-symbol-grid img { width: 66px; height: 66px; }
}

/* =========================================================
   SANCTUARY CARD — CLEAN STATUS + CONTAINED METERS
   ========================================================= */
/* The selected-card medallion stays in the first column, while the expanded
   breakdown and route action span the full parchment width below it. */
.map-academy .academy-place-card.is-selected .sanctuary-breakdown,
.map-academy .academy-place-card.is-selected .academy-route-button {
    grid-column: 1 / -1;
}

.map-academy .academy-place-card.is-selected .academy-route-button {
    justify-self: end;
    margin-top: 2px;
}

/* Remove the boxed white diamond. The state is now communicated by one simple
   coloured gem beside the Sanctuary label. */
.map-academy .academy-place-card.is-selected .comfort-row.sanctuary-overview {
    min-height: 54px;
    margin: 9px 0 0;
    padding: 6px 0;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 34px;
    align-items: center;
    gap: 9px;
}

.map-academy .sanctuary-status-line {
    display: flex;
    align-items: center;
    gap: 9px;
    min-width: 0;
}

.map-academy .sanctuary-status-gem {
    width: 14px;
    height: 14px;
    flex: 0 0 14px;
    display: inline-block;
    border: 2px solid currentColor;
    border-radius: 3px;
    background: currentColor;
    transform: rotate(45deg) scale(.72);
    box-shadow: 0 3px 8px rgba(20,30,45,.12);
}

.map-academy .sanctuary-status-copy strong {
    font-size: 17px;
    line-height: 1.08;
}

.map-academy .sanctuary-status-copy small {
    margin-top: 4px;
    padding-left: 23px;
    font-size: 8px;
}

/* The breakdown uses the full selected-card width instead of being squeezed by
   the medallion column. Everything inside it is explicitly constrained so the
   meter can never escape the parchment panel. */
.map-academy .academy-breakdown.sanctuary-breakdown {
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
    overflow: hidden;
    margin: 9px 0 4px;
    padding: 12px 13px 9px;
}

.map-academy .sanctuary-metric-row {
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
    grid-template-columns: 34px minmax(92px, .9fr) minmax(0, 1.35fr);
    gap: 9px;
    padding: 9px 0;
}

.map-academy .sanctuary-metric-row > * {
    min-width: 0;
    max-width: 100%;
    box-sizing: border-box;
}

.map-academy .sanctuary-meter {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    padding: 0 2px;
    box-sizing: border-box;
    overflow: visible;
}

.map-academy .sanctuary-meter-track {
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
}

.map-academy .sanctuary-meter-labels {
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
    gap: 2px;
}

.map-academy .sanctuary-meter-labels span {
    min-width: 0;
    white-space: nowrap;
}

@media (max-width: 560px) {
    .map-academy .sanctuary-metric-row {
        grid-template-columns: 30px minmax(76px, .85fr) minmax(0, 1.15fr);
        gap: 6px;
    }
    .map-academy .sanctuary-status-copy strong { font-size: 15px; }
}


/* =========================================================
   SELECTED SANCTUARY CARD — READABILITY PASS
   Larger type for the expanded quest and Sanctuary breakdown.
   ========================================================= */
.map-academy .academy-place-card.is-selected h3 {
    font-size: 20px;
    line-height: 1.08;
}
.map-academy .academy-place-card.is-selected .academy-quest-subtitle {
    font-size: 12px !important;
    line-height: 1.3;
}
.map-academy .academy-place-card.is-selected .spot-distance {
    margin-top: 5px;
    font-size: 12px;
    line-height: 1.35;
}
.map-academy .academy-place-card.is-selected .spot-category {
    padding: 6px 10px;
    font-size: 9px;
}
.map-academy .academy-place-card.is-selected .sanctuary-status-gem {
    width: 18px;
    height: 18px;
    flex-basis: 18px;
}
.map-academy .academy-place-card.is-selected .sanctuary-status-line { gap: 11px; }
.map-academy .academy-place-card.is-selected .sanctuary-status-copy strong {
    font-size: 20px;
    line-height: 1.08;
}
.map-academy .academy-place-card.is-selected .sanctuary-status-copy small {
    margin-top: 4px;
    padding-left: 29px;
    font-size: 11px;
    line-height: 1.35;
}
.map-academy .academy-place-card.is-selected .comfort-badge.sanctuary-toggle {
    width: 38px;
    min-width: 38px;
    height: 38px;
    min-height: 38px;
}
.map-academy .comfort-badge.sanctuary-toggle .comfort-chevron { margin: 0; }
.map-academy .academy-breakdown.sanctuary-breakdown {
    padding: 15px 16px 12px;
    border-radius: 14px;
}
.map-academy .sanctuary-breakdown-heading { gap: 9px; margin-bottom: 8px; }
.map-academy .sanctuary-breakdown-rune {
    width: 30px;
    height: 30px;
    font-size: 14px;
}
.map-academy .sanctuary-breakdown .breakdown-title {
    font-size: 16px !important;
    line-height: 1.2;
}
.map-academy .sanctuary-metric-row {
    min-height: 82px;
    grid-template-columns: 42px minmax(112px, .92fr) minmax(0, 1.35fr);
    gap: 12px;
    padding: 12px 0;
}
.map-academy .sanctuary-metric-icon {
    width: 40px;
    height: 40px;
    font-size: 16px;
}
.map-academy .sanctuary-metric-copy strong { font-size: 14px; line-height: 1.2; }
.map-academy .sanctuary-metric-copy p {
    margin-top: 5px !important;
    font-size: 10.5px !important;
    line-height: 1.35;
}
.map-academy .sanctuary-metric-pill {
    margin-top: 5px;
    padding: 3px 8px;
    font-size: 9px;
}
.map-academy .sanctuary-meter-track { height: 10px; }
.map-academy .sanctuary-meter-pointer {
    top: -8px;
    border-left-width: 5px;
    border-right-width: 5px;
    border-top-width: 6px;
}
.map-academy .sanctuary-meter-labels {
    margin-top: 7px;
    font-size: 9px;
}
.map-academy .academy-place-card.is-selected .academy-route-button {
    margin-top: 8px;
    font-size: 14px;
}

@media (max-width: 560px) {
    .map-academy .sanctuary-metric-row {
        grid-template-columns: 36px minmax(92px, .9fr) minmax(0, 1.1fr);
        gap: 8px;
    }
    .map-academy .sanctuary-metric-icon { width: 34px; height: 34px; font-size: 14px; }
    .map-academy .sanctuary-metric-copy strong { font-size: 12px; }
    .map-academy .sanctuary-metric-copy p { font-size: 9px !important; }
    .map-academy .sanctuary-meter-labels { font-size: 8px; }
}


/* =========================================================
   SELECTED CALM STATUS — FINAL COMPACT PASS
   Keep the overall status secondary to the place name and
   make the disclosure control feel part of the status strip.
   ========================================================= */
.map-academy .academy-place-card.is-selected .comfort-row.sanctuary-overview {
    padding: 10px 12px;
    gap: 10px;
    border-radius: 0;
    overflow: hidden;
    align-items: center;
}

.map-academy .academy-place-card.is-selected .sanctuary-status-line {
    gap: 8px;
    align-items: center;
}

.map-academy .academy-place-card.is-selected .sanctuary-status-gem {
    width: 13px;
    height: 13px;
    flex: 0 0 13px;
    border-radius: 3px;
    transform: rotate(45deg);
    box-shadow: none;
}

.map-academy .academy-place-card.is-selected .sanctuary-status-copy strong {
    font-size: 16px;
    line-height: 1.1;
    letter-spacing: 0;
}

.map-academy .academy-place-card.is-selected .sanctuary-status-copy small {
    margin-top: 3px;
    padding-left: 21px;
    font-size: 10.5px;
    line-height: 1.3;
}

/* The toggle no longer floats as a large white control. */
.map-academy .academy-place-card.is-selected .comfort-badge.sanctuary-toggle {
    width: 30px;
    min-width: 30px;
    height: 30px;
    min-height: 30px;
    margin-left: auto;
    padding: 0;
    border: 1px solid currentColor;
    border-radius: 999px;
    background: rgba(255, 255, 255, .32);
    box-shadow: none;
    color: inherit;
    display: inline-grid;
    place-items: center;
    flex: 0 0 30px;
}

.map-academy .academy-place-card.is-selected .comfort-badge.sanctuary-toggle:hover {
    background: rgba(255, 255, 255, .55);
    transform: none;
}

.map-academy .comfort-badge.sanctuary-toggle .comfort-chevron {
    margin: 0;
}

.map-academy .comfort-badge.sanctuary-toggle.is-expanded .comfort-chevron {
    transform: rotate(180deg);
}

/* Place name remains the strongest typography in the card. */
.map-academy .academy-place-card.is-selected h3 {
    font-size: 20px;
    line-height: 1.08;
}


/* =========================================================
   LANDING PAGE HEADER AND HERO LAYOUT
   ========================================================= */
.landing-academy .academy-hero {
    margin-top: 72px;
    padding-top: 0;
}

.landing-academy .academy-hero > .carousel-slide {
    inset: 0;
}

.landing-topbar {
    position: fixed;
}

.landing-nav-start {
    position: absolute;
    left: 50%;
    top: 50%;
    z-index: 2;
    display: flex;
    height: 36px;
    align-items: center;
    transform: translate(-50%, -50%);
}

.academy-nav-start-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-width: 0;
    min-height: 36px;
    height: 36px;
    padding: 0 18px;
    border: 1px solid rgba(215, 170, 88, .62);
    border-radius: 999px;
    background: linear-gradient(180deg, #f0cf83 0%, #c99a46 100%);
    color: #081427;
    box-shadow:
        0 10px 22px rgba(0, 0, 0, .28),
        inset 0 1px 0 rgba(255, 244, 206, .42);
    backdrop-filter: blur(8px);
    font-family: Georgia, "Times New Roman", serif;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: .01em;
    line-height: 1;
    text-decoration: none;
    white-space: nowrap;
    transition: color 160ms ease, border-color 160ms ease, box-shadow 160ms ease;
}

.academy-nav-start-button span {
    margin-left: 0;
}

.academy-nav-start-button .start-star {
    margin: 0;
}

.academy-nav-start-button:hover {
    color: #06142b;
    border-color: rgba(239, 198, 109, .88);
    background: linear-gradient(180deg, #f7dc9b 0%, #d6a64f 100%);
    box-shadow:
        0 12px 26px rgba(0, 0, 0, .32),
        inset 0 1px 0 rgba(255, 247, 218, .55);
}

.start-label-short {
    display: none;
}

.start-star {
    margin-left: 8px;
}

@media (max-width: 980px) {
    .landing-topbar .academy-brand small {
        display: none;
    }

    .academy-nav-start-button {
        min-width: 0;
        padding: 8px 14px;
        font-size: 13px;
    }
}

@media (max-width: 700px) {
    .landing-academy .academy-hero {
        margin-top: 64px;
        padding-top: 0;
    }

    .landing-academy .academy-hero > .carousel-slide {
        inset: 0;
    }

    .landing-topbar {
        height: 64px;
        padding: 0 12px;
    }

    .landing-topbar .academy-brand img {
        width: 38px;
        height: 38px;
    }

    .landing-topbar .academy-brand strong {
        font-size: 18px;
    }

    .academy-header-actions {
        gap: 10px;
    }

    .landing-topbar .academy-nav-link {
        display: none;
    }

    .academy-nav-start-button {
        min-width: 0;
        min-height: 0;
        padding: 8px 12px;
        font-size: 12px;
        border-radius: 999px;
    }

    .start-label-full {
        display: none;
    }

    .start-label-short {
        display: inline;
    }
}


/* Indoor header keeps its own height/layout even though it also reuses the
   academy colour treatment from .academy-topbar. */
.indoor-hall-page .hall-topbar.academy-topbar {
    height: var(--hall-topbar-height);
    padding: 0 clamp(22px, 4.4vw, 72px);
    display: grid;
    grid-template-columns: minmax(220px, 1fr) auto minmax(220px, 1fr);
}

@media (max-width: 760px) {
    .indoor-hall-page .hall-topbar.academy-topbar {
        height: auto;
        min-height: var(--hall-topbar-height);
        padding: 8px 12px;
    }
}
