:root {
    --sage: #8B9D83;
    --clay: #B08B6E;
    --terracotta: #C66B3D;
    --ochre: #C08E3A;
    --moss: #606C38;
    --sand: #E8DCC7;
    --oat: #D4B895;
    --surface: #E8DCC7;
    --surface-deep: #D4B895;
    --text: #606C38;
    --text-strong: #4C562D;
    /* Heritage atlas: keep both side panels on the same green hierarchy. */
    --heritage-ink: #163D26;
    --heritage-copy: #213421;
    --heritage-muted: #4C562D;
    --heritage-action: #184E46;
    --heritage-action-deep: #0E403A;
    --heritage-action-border: #113E3A;
    --heritage-filter-label-color: rgba(76, 86, 45, .9);
    --heritage-chip-border: rgba(176, 139, 110, .32);
    --heritage-chip-background: rgba(232, 220, 199, .42);
    --heritage-chip-active-border: rgba(17, 62, 58, .72);
    --heritage-chip-active-background: linear-gradient(180deg, rgba(24, 78, 70, .98), rgba(14, 64, 58, .98));
    --border: rgba(96, 108, 56, 0.24);
    --border-strong: rgba(96, 108, 56, 0.42);
    --radius: 24px;
    --radius-sm: 18px;
    --ease: 420ms cubic-bezier(.2, .8, .2, 1);
    color-scheme: light;
}

@media (min-width: 900px) {
    html {
        zoom: .85;
    }
}

* {
    scrollbar-width: none;
    -ms-overflow-style: none;
}

*::-webkit-scrollbar {
    display: none;
    width: 0;
    height: 0;
}

/* Heritage result drawer */
.heritage-atlas .heritage-results-panel {
    right: 18px;
    width: min(414px, calc(100vw - 36px));
    padding: 18px;
    overflow: hidden;
    grid-template-rows: auto minmax(0, 1fr) auto;
    gap: 12px;
    transform-origin: right center;
}

.heritage-atlas .heritage-results-panel.is-entering {
    animation: heritageDrawerIn 430ms cubic-bezier(.16, 1, .3, 1) both;
}

.heritage-atlas .heritage-results-panel.is-closing {
    pointer-events: none;
    animation: heritageDrawerOut 260ms cubic-bezier(.55, .06, .68, .19) both;
}

@keyframes heritageDrawerIn {
    0% {
        opacity: 0;
        transform: translate3d(calc(100% + 30px), 0, 0);
    }

    72% {
        opacity: 1;
        transform: translate3d(-7px, 0, 0);
    }

    100% {
        opacity: 1;
        transform: translate3d(0, 0, 0);
    }
}

@keyframes heritageDrawerOut {
    from {
        opacity: 1;
        transform: translate3d(0, 0, 0);
    }

    to {
        opacity: 0;
        transform: translate3d(calc(100% + 30px), 0, 0);
    }
}

.heritage-results-panel .heritage-list-head {
    min-height: 42px;
    align-items: center;
    padding-bottom: 10px;
    border-bottom: 1px solid rgba(96, 108, 56, .18);
}

.heritage-results-panel .heritage-list-head h3 {
    font-size: 27px;
    line-height: 1;
}

.heritage-results-close {
    width: 38px;
    height: 38px;
    flex: 0 0 38px;
    display: grid;
    place-items: center;
    padding: 0;
    border: 1px solid rgba(96, 108, 56, .3);
    border-radius: 50%;
    color: #214220;
    background: rgba(212, 184, 149, .3);
    transition: transform 180ms ease, border-color 180ms ease, background-color 180ms ease;
}

.heritage-results-close:hover,
.heritage-results-close:focus-visible {
    outline: 0;
    transform: translateX(2px);
    border-color: rgba(33, 66, 32, .52);
    background: rgba(139, 157, 131, .24);
}

.heritage-results-close svg,
.heritage-page-controls svg {
    width: 19px;
    height: 19px;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.heritage-results-panel .heritage-card-list {
    min-height: 0;
    overflow-x: hidden;
    overflow-y: auto;
    grid-template-rows: repeat(10, minmax(62px, 1fr));
    align-content: stretch;
    gap: 8px;
    padding: 2px 5px 2px 2px;
}

.heritage-card-list .heritage-result-card {
    position: relative;
    width: 100%;
    min-height: 0;
    height: 100%;
    padding: 6px;
    grid-template-columns: clamp(94px, 30%, 124px) minmax(0, 1fr);
    gap: 12px;
    align-items: center;
    overflow: hidden;
    border-color: rgba(176, 139, 110, .3);
    background: rgba(232, 220, 199, .56);
    box-shadow: 0 1px 0 rgba(96, 108, 56, .05);
    transition: transform 180ms ease, border-color 180ms ease, background-color 180ms ease, box-shadow 180ms ease;
}

.heritage-card-list .heritage-result-card:hover,
.heritage-card-list .heritage-result-card:focus-visible,
.heritage-card-list .heritage-result-card.active {
    outline: 0;
    transform: none;
    border-color: rgba(96, 108, 56, .42);
    background: rgba(139, 157, 131, .16);
    box-shadow: 0 3px 10px rgba(67, 71, 42, .08);
}

.heritage-result-card .heritage-result-media {
    width: 100%;
    height: auto;
    aspect-ratio: 16 / 9;
    border-radius: 6px;
}

.heritage-result-card .heritage-result-media img {
    transition: transform 420ms ease, filter 180ms ease;
}

.heritage-result-card:hover .heritage-result-media img,
.heritage-result-card:focus-visible .heritage-result-media img {
    transform: scale(1.035);
    filter: saturate(.96) contrast(1);
}

.heritage-result-card .heritage-result-copy {
    min-width: 0;
    display: grid;
    grid-template-rows: 27px 22px;
    gap: 3px;
    align-content: center;
}

.heritage-result-copy .heritage-name-marquee {
    --marquee-shift: 0px;
    min-width: 0;
    overflow: hidden;
    color: #263d22;
    font-family: "Noto Serif SC", "Songti SC", "Source Han Serif SC", serif;
    font-size: 19px;
    font-weight: 900;
    line-height: 27px;
    white-space: nowrap;
}

.heritage-result-copy .heritage-name-marquee>span {
    display: inline-block;
    will-change: transform;
    padding: 0;
    border-radius: 0;
    color: inherit;
    background: none;
    font-size: inherit;
}

.heritage-name-marquee.is-overflowing>span {
    animation: heritageNamePan 7s ease-in-out 900ms infinite alternate;
}

@keyframes heritageNamePan {

    0%,
    14% {
        transform: translateX(0);
    }

    86%,
    100% {
        transform: translateX(var(--marquee-shift));
    }
}

.heritage-result-card .heritage-result-copy .heritage-result-meta {
    min-width: 0;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 1em;
    overflow: hidden;
    color: rgba(76, 86, 45, .82);
    font-size: 13px;
    font-weight: 700;
    line-height: 22px;
    white-space: nowrap;
}

.heritage-result-copy .heritage-result-meta span {
    min-width: 0;
    padding: 0;
    overflow: hidden;
    border-radius: 0;
    color: inherit;
    background: none;
    text-overflow: ellipsis;
}

.heritage-result-copy .heritage-result-meta span:first-child {
    flex: 0 1 auto;
    color: rgba(33, 66, 32, .82);
}

.heritage-result-copy .heritage-result-meta span:nth-child(2),
.heritage-result-copy .heritage-result-meta span:nth-child(3) {
    flex: 0 0 auto;
    padding-left: 0;
    border-left: 0;
}

.heritage-pagination {
    min-width: 0;
    min-height: 42px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding-top: 10px;
    border-top: 1px solid rgba(96, 108, 56, .18);
}

.heritage-total {
    flex: 0 0 auto;
    color: rgba(76, 86, 45, .78);
    font-size: 13px;
    font-weight: 700;
    white-space: nowrap;
}

.heritage-total b {
    color: #263d22;
    font-size: 15px;
}

.heritage-page-controls {
    min-width: 0;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 6px;
}

.heritage-page-controls button {
    width: 30px;
    height: 30px;
    flex: 0 0 30px;
    display: grid;
    place-items: center;
    padding: 0;
    border: 1px solid rgba(96, 108, 56, .25);
    border-radius: 6px;
    color: #354d2d;
    background: rgba(232, 220, 199, .5);
    font-size: 12px;
    font-weight: 800;
    transition: border-color 160ms ease, color 160ms ease, background-color 160ms ease;
}

.heritage-page-controls button:hover:not(:disabled),
.heritage-page-controls button:focus-visible {
    outline: 0;
    border-color: #606c38;
    color: #e8dcc7;
    background: #606c38;
}

.heritage-page-controls button:disabled {
    cursor: not-allowed;
    opacity: .38;
}

.heritage-page-input {
    width: 58px;
    height: 30px;
    padding: 0 8px;
    border: 1px solid rgba(96, 108, 56, .3);
    border-radius: 6px;
    color: #354d2d;
    background: rgba(232, 220, 199, .58);
    font-size: 12px;
    font-weight: 800;
    text-align: center;
    font-variant-numeric: tabular-nums;
}

.heritage-page-input:focus {
    border-color: #606c38;
    background: rgba(232, 220, 199, .76);
}

.heritage-page-input:focus-visible {
    outline: 2px solid rgba(96, 108, 56, .3);
    outline-offset: 2px;
}

.heritage-atlas .heritage-detail-card {
    right: 452px;
}

@media (max-width: 820px) {
    .heritage-atlas .heritage-results-panel {
        width: 100%;
        padding: 16px;
        grid-template-rows: auto minmax(0, 1fr) auto;
    }

    .heritage-results-panel .heritage-card-list {
        max-height: min(58vh, 620px);
    }

    .heritage-card-list .heritage-result-card {
        grid-template-columns: 96px minmax(0, 1fr);
    }

    .heritage-result-card .heritage-result-media {
        width: 96px;
    }

    .heritage-pagination {
        align-items: flex-start;
        flex-direction: column;
    }

    .heritage-page-controls {
        width: 100%;
        justify-content: flex-start;
        overflow-x: auto;
        padding-bottom: 2px;
    }
}

/* Buffer target picker reuses the heritage search and list language. */
.analysis-buffer-selection {
    gap: 10px;
}

.analysis-buffer-search-form {
    grid-template-columns: minmax(0, 1fr) 46px;
}

.analysis-buffer-results {
    min-width: 0;
    padding: 10px;
    border: 1px solid rgba(176, 139, 110, .28);
    border-radius: 5px;
    background: rgba(232, 220, 199, .25);
}

.analysis-buffer-results .heritage-card-list {
    max-height: 540px;
    gap: 8px;
    padding-right: 0;
}

.analysis-buffer-results .heritage-card-list .heritage-result-card {
    min-height: 78px;
    height: auto;
    padding: 8px;
    grid-template-columns: 76px minmax(0, 1fr);
    gap: 10px;
    border-radius: 5px;
}

.analysis-buffer-results .heritage-result-media {
    height: 60px;
    border-radius: 5px;
}

.analysis-buffer-results .heritage-result-copy {
    gap: 4px;
}

.analysis-buffer-results .heritage-result-copy h4 {
    font-size: 16px;
}

.analysis-buffer-results .heritage-result-copy .heritage-result-meta {
    gap: 6px;
    font-size: 11px;
}

.analysis-buffer-pagination {
    margin-top: 10px;
}

.analysis-buffer-pagination .heritage-page-controls {
    align-items: center;
}

.analysis-buffer-pagination .heritage-page-controls button,
.analysis-buffer-pagination .heritage-page-input {
    height: 28px;
    min-height: 28px;
    border-radius: 6px;
}

.analysis-buffer-pagination .heritage-page-controls button {
    width: 28px;
    flex-basis: 28px;
}

.analysis-buffer-pagination .heritage-page-input {
    width: 90px;
    min-width: 90px;
    flex: 0 0 90px;
    padding: 0 8px;
}

.analysis-buffer-distance .analysis-radius-presets {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 6px;
}

.analysis-buffer-distance .analysis-radius-presets button {
    min-height: 40px;
    padding: 7px 4px;
}

.analysis-density-route-selection {
    gap: 10px;
}

.analysis-density-route-results {
    min-width: 0;
    padding: 10px;
    border: 1px solid rgba(176, 139, 110, .28);
    border-radius: 5px;
    background: rgba(232, 220, 199, .25);
}

.analysis-density-route-results .heritage-card-list {
    max-height: none;
    gap: 6px;
    padding-right: 0;
    overflow: visible;
}

.analysis-density-route-results .heritage-card-list .analysis-density-route-card {
    min-height: 58px;
    height: 58px;
    padding: 6px;
    grid-template-columns: 76px minmax(0, 1fr);
    gap: 10px;
    border-radius: 5px;
    overflow: hidden;
}

.analysis-density-route-results .analysis-density-route-card .heritage-result-media {
    width: 76px;
    height: 42.75px;
    aspect-ratio: 16 / 9;
    align-self: center;
    border-radius: 5px;
}

.analysis-density-route-results .analysis-density-route-card .heritage-result-copy {
    display: flex;
    align-items: center;
    height: 100%;
    gap: 0;
}

.analysis-density-route-results .analysis-density-route-card .heritage-name-marquee {
    display: flex;
    align-items: center;
    width: 100%;
    height: 100%;
    color: var(--heritage-ink);
    font-size: 17px;
    font-weight: 900;
    line-height: 1.25;
}

.analysis-density-pagination .heritage-page-controls {
    align-items: center;
}

.analysis-density-pagination .heritage-page-controls button,
.analysis-density-pagination .heritage-page-input {
    height: 28px;
    min-height: 28px;
    border-radius: 6px;
}

.analysis-density-pagination .heritage-page-controls button {
    width: 28px;
    flex-basis: 28px;
}

.analysis-density-pagination .heritage-page-input {
    width: 90px;
    min-width: 90px;
    flex: 0 0 90px;
    padding: 0 8px;
}

@media (prefers-reduced-motion: reduce) {

    .heritage-results-panel.is-entering,
    .heritage-results-panel.is-closing,
    .heritage-name-marquee.is-overflowing>span {
        animation: none;
    }

    .heritage-name-marquee.is-overflowing {
        text-overflow: ellipsis;
    }
}

* {
    box-sizing: border-box;
}

body {
    margin: 0;
    color: var(--text);
    font-family: "Adobe Caslon Pro", "Libre Caslon Text", "Iowan Old Style", "Songti SC", Georgia, serif;
    background:
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180' viewBox='0 0 180 180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='180' height='180' filter='url(%23n)' opacity='.025'/%3E%3C/svg%3E"),
        radial-gradient(circle at 12% 8%, rgba(139, 157, 131, .36), transparent 32rem),
        radial-gradient(circle at 88% 18%, rgba(192, 142, 58, .28), transparent 34rem),
        linear-gradient(180deg, var(--sand), var(--oat));
}

button,
input,
select,
textarea {
    font: inherit;
}

button {
    cursor: pointer;
}

.boot {
    min-height: 100vh;
    display: grid;
    place-items: center;
    color: var(--sand);
    background: var(--moss);
    font-size: 22px;
}

.login-shell {
    position: relative;
    min-height: 100vh;
    overflow: hidden;
    display: grid;
    place-items: center;
    padding: 118px 24px 42px;
    color: #d8bf8c;
    background:
        linear-gradient(180deg, rgba(6, 27, 33, .22), rgba(5, 21, 22, .42) 48%, rgba(3, 13, 13, .78)),
        url("assets/shared/backgrounds/tea-horse-landscape.jpg") center / cover;
    isolation: isolate;
}

.login-shell::before,
.login-shell::after {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
}

.login-compliance {
    position: absolute;
    z-index: 3;
    right: 20px;
    bottom: 12px;
    left: 20px;
    display: flex;
    justify-content: center;
    font-family: "Epilogue", "Greycliff CF", Arial, sans-serif;
    font-size: 12px;
    line-height: 20px;
}

.login-compliance a {
    color: rgba(232, 220, 199, .74);
    text-decoration: none;
}

.login-compliance a:hover,
.login-compliance a:focus-visible {
    color: #f4dfb5;
    text-decoration: underline;
    outline: 0;
}

.mobile-viewing-notice[hidden] {
    display: none;
}

.mobile-viewing-notice {
    position: fixed;
    z-index: 10000;
    inset: 0;
    display: grid;
    place-items: center;
    padding: 24px;
    color: #eadbb8;
    background:
        linear-gradient(180deg, rgba(3, 18, 23, .8), rgba(2, 12, 14, .94)),
        url("assets/shared/backgrounds/tea-horse-landscape.jpg") center / cover;
}

.mobile-viewing-dialog {
    width: min(420px, 100%);
    padding: 28px 24px 24px;
    border: 1px solid rgba(216, 191, 140, .4);
    border-radius: 8px;
    text-align: center;
    background: rgba(5, 28, 33, .94);
    box-shadow: 0 24px 64px rgba(0, 0, 0, .42);
    backdrop-filter: blur(12px);
}

.mobile-viewing-dialog img {
    width: 64px;
    height: 64px;
    object-fit: contain;
}

.mobile-viewing-label {
    margin: 14px 0 8px;
    color: rgba(216, 191, 140, .72);
    font-family: "Epilogue", "Greycliff CF", Arial, sans-serif;
    font-size: 12px;
}

.mobile-viewing-dialog h2 {
    margin: 0;
    color: #f0d79e;
    font-size: 26px;
    line-height: 1.25;
}

.mobile-viewing-dialog>p:last-of-type {
    margin: 16px 0 22px;
    color: rgba(232, 220, 199, .84);
    font-family: "Songti SC", "STSong", serif;
    font-size: 15px;
    line-height: 1.75;
    text-align: left;
}

.mobile-viewing-dialog button {
    width: 100%;
    min-height: 48px;
    border: 1px solid rgba(216, 191, 140, .74);
    border-radius: 6px;
    color: #f5e2b7;
    font-weight: 700;
    background: linear-gradient(180deg, #184e46, #0e403a);
    box-shadow: 0 10px 24px rgba(0, 0, 0, .24);
}

.mobile-viewing-dialog button:focus-visible {
    outline: 2px solid #f0d79e;
    outline-offset: 3px;
}

.login-shell::before {
    z-index: 1;
    background:
        linear-gradient(180deg, rgba(7, 31, 38, .7), rgba(7, 31, 38, .05) 32%, rgba(5, 18, 17, .72)),
        radial-gradient(ellipse at center, transparent 35%, rgba(1, 8, 10, .52) 82%);
}

.login-shell::after {
    z-index: 5;
    background:
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180' viewBox='0 0 180 180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.78' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='180' height='180' filter='url(%23n)' opacity='.11'/%3E%3C/svg%3E"),
        repeating-linear-gradient(0deg, rgba(255, 255, 255, .035) 0 1px, transparent 1px 4px);
    mix-blend-mode: soft-light;
}

.login-topbar {
    position: absolute;
    inset: 0 0 auto;
    z-index: 8;
    height: 86px;
    display: flex;
    align-items: center;
    padding: 0 clamp(24px, 4vw, 54px);
    border-bottom: 1px solid rgba(216, 191, 140, .16);
    background: rgba(5, 25, 32, .84);
    box-shadow: 0 18px 46px rgba(0, 0, 0, .28);
    backdrop-filter: blur(10px);
}

.brand-mark {
    display: flex;
    gap: 16px;
    align-items: center;
}

.brand-icon {
    width: 68px;
    height: 68px;
    border: 1px solid rgba(232, 220, 199, .7);
    border-radius: 28px;
    display: grid;
    place-items: center;
    color: var(--sand);
    font-family: "Epilogue", "Greycliff CF", Arial, sans-serif;
    font-size: 18px;
    letter-spacing: 0;
    background: rgba(96, 108, 56, .35);
    overflow: hidden;
}

.brand-icon img {
    display: block;
    width: 76%;
    height: 76%;
    object-fit: contain;
}

.brand-title h1 {
    margin: 0;
    font-size: clamp(25px, 3vw, 42px);
    line-height: 1.1;
    color: inherit;
}

.brand-title p {
    margin: 6px 0 0;
    color: rgba(232, 220, 199, .8);
    font-size: 12px;
    font-family: "Epilogue", "Greycliff CF", Arial, sans-serif;
}

.login-shell .brand-icon {
    width: 72px;
    height: 60px;
    border: 0;
    border-radius: 0;
    color: #d8bf8c;
    background: transparent;
    overflow: visible;
}

.login-shell .brand-icon img {
    width: 100%;
    height: 100%;
}

.login-shell .brand-title h1 {
    font-size: clamp(20px, 1.75vw, 28px);
    text-shadow: 0 2px 18px rgba(216, 191, 140, .18);
}

.login-shell .brand-title p {
    color: rgba(216, 191, 140, .76);
    letter-spacing: .16em;
    text-transform: uppercase;
}

.login-stage {
    position: relative;
    z-index: 7;
    width: min(620px, calc(100vw - 32px));
    display: grid;
    justify-items: center;
}

.login-panel {
    width: 100%;
    padding: 0;
    overflow: hidden;
    border: 1px solid rgba(216, 191, 140, .58);
    background:
        linear-gradient(180deg, rgba(21, 47, 45, .92), rgba(12, 31, 29, .94)),
        rgba(13, 38, 38, .92);
    border-radius: 8px;
    box-shadow:
        0 30px 90px rgba(0, 0, 0, .44),
        inset 0 0 0 1px rgba(255, 235, 184, .08);
    backdrop-filter: blur(10px);
}

.login-tabs {
    display: grid;
    grid-template-columns: 1fr 1fr;
    min-height: 62px;
    border-bottom: 1px solid rgba(216, 191, 140, .5);
}

.login-tabs button {
    border: 0;
    border-right: 1px solid rgba(216, 191, 140, .4);
    color: rgba(230, 214, 178, .78);
    background: rgba(14, 42, 45, .8);
    font-size: 20px;
    font-weight: 700;
    letter-spacing: .08em;
}

.login-tabs button:last-child {
    border-right: 0;
}

.login-tabs button.active {
    color: #17271f;
    background:
        linear-gradient(180deg, rgba(226, 202, 156, .98), rgba(188, 146, 87, .96));
}

.panel-inner {
    position: relative;
    padding: 28px clamp(24px, 4vw, 54px) 34px;
}

.panel-inner::before,
.panel-inner::after {
    content: "";
    position: absolute;
    width: 28px;
    height: 28px;
    border-color: rgba(216, 191, 140, .72);
    pointer-events: none;
}

.panel-inner::before {
    left: 10px;
    top: 10px;
    border-left: 2px solid;
    border-top: 2px solid;
}

.panel-inner::after {
    right: 10px;
    bottom: 10px;
    border-right: 2px solid;
    border-bottom: 2px solid;
}

.login-panel h3,
.panel h3,
.section-title {
    margin: 0 0 14px;
    color: var(--text-strong);
    font-size: 22px;
    line-height: 1.15;
}

.login-panel h3 {
    margin: 0;
    text-align: center;
    color: #e4ca98;
    font-size: 34px;
    letter-spacing: .12em;
}

.login-panel h3+p {
    margin: 8px 0 22px;
    text-align: center;
    color: rgba(226, 201, 154, .48);
    font-family: "Epilogue", "Greycliff CF", Arial, sans-serif;
    font-size: 12px;
    letter-spacing: .34em;
}

.login-field {
    display: grid;
    grid-template-columns: 64px minmax(0, 1fr) auto;
    align-items: center;
    gap: 12px;
    margin-top: 16px;
}

.login-field span {
    color: rgba(232, 220, 199, .86);
    font-size: 17px;
    font-weight: 700;
}

.login-field input {
    min-width: 0;
    height: 50px;
    padding: 0 18px;
    border: 1px solid rgba(232, 220, 199, .18);
    border-radius: 6px;
    outline: 0;
    color: #eadbb8;
    background: rgba(6, 17, 18, .46);
    box-shadow: inset 0 0 20px rgba(0, 0, 0, .22);
}

.login-field input::placeholder {
    color: rgba(232, 220, 199, .4);
}

.login-field input:focus {
    border-color: rgba(216, 191, 140, .72);
}

.login-options button {
    border: 0;
    color: rgba(226, 201, 154, .82);
    background: transparent;
}

.login-options {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin: 18px 0 24px 76px;
    color: rgba(232, 220, 199, .78);
    font-size: 14px;
}

.login-options label {
    display: inline-flex;
    align-items: center;
    gap: 9px;
}

.login-options input {
    width: 18px;
    height: 18px;
    accent-color: #d8bf8c;
}

.login-submit {
    display: block;
    width: min(430px, 100%);
    min-height: 70px;
    margin: 0 auto;
    border: 1px solid rgba(255, 239, 194, .65);
    border-radius: 6px;
    color: #19251b;
    background:
        linear-gradient(180deg, rgba(231, 204, 157, .98), rgba(182, 137, 73, .98));
    box-shadow:
        inset 0 0 0 4px rgba(255, 241, 202, .14),
        0 12px 26px rgba(0, 0, 0, .24);
    font-size: 26px;
    font-weight: 800;
    letter-spacing: .12em;
}

.login-submit:hover,
.login-submit:focus-visible {
    transform: translateY(-2px);
    filter: brightness(1.06);
}


.login-panel>p,
.muted {
    color: rgba(96, 108, 56, .78);
}

.identity-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
}

.identity-card,
.heritage-card,
.metric-card,
.analysis-card,
.stat-card,
.panel,
.map-card {
    border: 1px solid var(--border);
    border-radius: var(--radius);
    background:
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence baseFrequency='.85' numOctaves='2'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)' opacity='.03'/%3E%3C/svg%3E"),
        rgba(232, 220, 199, .82);
}

.identity-card {
    min-height: 210px;
    padding: 22px;
    color: var(--text);
    text-align: left;
    transition: transform var(--ease), border-color var(--ease), background-color var(--ease);
}

.identity-card:hover,
.identity-card:focus-visible {
    outline: 0;
    transform: translateY(-4px);
    border-color: var(--terracotta);
    background-color: rgba(212, 184, 149, .88);
}

.identity-label,
.pill,
.role-chip {
    display: inline-flex;
    align-items: center;
    min-height: 30px;
    padding: 6px 11px;
    border-radius: 999px;
    border: 1px solid rgba(96, 108, 56, .25);
    background: rgba(139, 157, 131, .22);
    color: var(--text-strong);
    font-family: "Epilogue", "Greycliff CF", Arial, sans-serif;
    font-size: 13px;
}

.identity-card strong {
    display: block;
    margin: 18px 0 8px;
    font-size: 25px;
    color: var(--text-strong);
}

.identity-card span {
    line-height: 1.65;
}

.app-shell {
    min-height: 100vh;
    display: grid;
    grid-template-rows: 86px 1fr;
}

.topbar {
    position: sticky;
    top: 0;
    z-index: 50;
    height: 86px;
    display: grid;
    grid-template-columns: max-content minmax(0, 1fr) max-content;
    align-items: center;
    color: #d8bf8c;
    border-bottom: 1px solid rgba(216, 191, 140, .16);
    background:
        linear-gradient(90deg, rgba(6, 30, 36, .94), rgba(7, 38, 45, .9) 50%, rgba(4, 23, 29, .95)),
        rgba(5, 25, 32, .92);
    box-shadow: 0 18px 46px rgba(0, 0, 0, .24);
    backdrop-filter: blur(10px);
}

.topbar .brand-mark {
    padding-left: clamp(24px, 4vw, 54px);
}

.topbar .brand-icon {
    width: 72px;
    height: 60px;
    border: 0;
    border-radius: 0;
    background: transparent;
    overflow: visible;
    font-size: 14px;
}

.topbar .brand-icon img {
    width: 100%;
    height: 100%;
}

.topbar .brand-title h1 {
    font-size: clamp(20px, 1.45vw, 28px);
    color: #e6cf9b;
    text-shadow: 0 2px 18px rgba(216, 191, 140, .18);
}

.topbar .brand-title p {
    color: rgba(216, 191, 140, .76);
    letter-spacing: .12em;
    text-transform: uppercase;
}

.nav {
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 0;
    padding: 0 10px;
    transform: none;
}

.nav button,
.round-btn,
.tool-btn,
.primary-btn,
.ghost-btn,
.danger-btn,
.icon-btn {
    min-height: 42px;
    padding: 10px 16px;
    border: 1px solid rgba(96, 108, 56, .28);
    border-radius: 18px;
    background: rgba(232, 220, 199, .7);
    color: var(--text-strong);
    font-family: "Epilogue", "Greycliff CF", Arial, sans-serif;
    font-size: 14px;
    transition: background-color var(--ease), transform var(--ease), border-color var(--ease);
    text-decoration: none;
}

.nav button {
    position: relative;
    z-index: 0;
    width: clamp(128px, 9.2vw, 176px);
    min-width: 128px;
    min-height: 86px;
    padding: 0 10px;
    border: 0;
    border-radius: 0;
    color: rgba(232, 220, 199, .82);
    background: transparent;
    box-shadow: none;
    font-family: "Adobe Caslon Pro", "Libre Caslon Text", "Iowan Old Style", "Songti SC", "STSong", serif;
    font-size: 20px;
    font-weight: 800;
    letter-spacing: .03em;
    white-space: nowrap;
    text-shadow:
        0 1px 12px rgba(0, 0, 0, .38),
        0 0 10px rgba(216, 191, 140, .12);
}

.nav button::before,
.nav button::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    pointer-events: none;
    opacity: 0;
    transition: opacity var(--ease), transform var(--ease);
}

.nav button::before {
    inset-block: 0;
    background:
        linear-gradient(180deg, rgba(13, 54, 63, .82), rgba(14, 44, 48, .36) 56%, rgba(6, 25, 31, .76));
    box-shadow:
        inset 1px 0 0 rgba(216, 191, 140, .05),
        inset -1px 0 0 rgba(216, 191, 140, .05),
        inset 0 -1px 0 rgba(216, 191, 140, .26),
        0 0 32px rgba(216, 191, 140, .08);
    transform: scaleY(.88);
    z-index: -1;
}

.nav button::after {
    bottom: 0;
    height: 3px;
    background: linear-gradient(90deg, transparent, rgba(255, 221, 151, .96), transparent);
    box-shadow:
        0 -8px 18px rgba(216, 191, 140, .46),
        0 0 22px rgba(198, 107, 61, .34);
}

.nav button.active,
.tool-btn.active,
.primary-btn {
    background: #c66b3d;
    border-color: #c66b3d;
    color: var(--sand);
}

.nav button.active {
    color: #f0d9a8;
    background: transparent;
    border-color: transparent;
    text-shadow:
        0 0 16px rgba(216, 191, 140, .48),
        0 2px 18px rgba(0, 0, 0, .44);
}

.nav button.active::before,
.nav button.active::after,
.nav button:hover::after {
    opacity: 1;
    transform: scaleY(1);
}

.nav button:hover,
.round-btn:hover,
.tool-btn:hover,
.primary-btn:hover,
.ghost-btn:hover,
.icon-btn:hover {
    transform: translateY(-2px);
}

.top-actions {
    display: flex;
    gap: 10px;
    align-items: center;
    justify-content: flex-end;
    padding-right: clamp(28px, 5vw, 76px);
    transform: none;
}

.round-btn {
    color: var(--sand);
    border-color: rgba(232, 220, 199, .22);
    background: rgba(176, 139, 110, .28);
}

.logout-btn {
    position: relative;
    min-width: auto;
    min-height: 46px;
    padding: 0 2px;
    border: 0;
    border-radius: 0;
    background: transparent;
    color: #eadbb8;
    font-weight: 700;
    font-family: "Adobe Caslon Pro", "Libre Caslon Text", "Iowan Old Style", "Songti SC", "STSong", serif;
    font-size: 18px;
    letter-spacing: .08em;
    text-shadow: 0 0 14px rgba(216, 191, 140, .18);
}

.logout-btn::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 4px;
    height: 2px;
    background: linear-gradient(90deg, transparent, rgba(216, 191, 140, .86), transparent);
    opacity: 0;
    box-shadow: 0 0 18px rgba(216, 191, 140, .36);
    transition: opacity var(--ease);
}

.logout-btn:hover::after,
.logout-btn:focus-visible::after {
    opacity: 1;
}

.role-chip {
    min-height: 42px;
    padding: 9px 16px;
    color: #eadbb8;
    border-color: rgba(216, 191, 140, .24);
    background: rgba(232, 220, 199, .08);
    font-weight: 700;
}

.user-avatar {
    width: 46px;
    height: 46px;
    border: 1px solid rgba(216, 191, 140, .46);
    border-radius: 50%;
    object-fit: cover;
    background: rgba(216, 191, 140, .12);
    box-shadow:
        inset 0 1px 0 rgba(255, 239, 194, .14),
        0 10px 24px rgba(0, 0, 0, .22);
}

.page {
    min-height: calc(100vh - 86px);
}

.hero-layout {
    position: relative;
    display: grid;
    grid-template-rows: minmax(440px, 48vh) auto;
    min-height: calc(100vh - 86px);
    overflow: hidden;
    isolation: isolate;
    background: rgb(232, 220, 199);
}

.hero-layout::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 0;
    height: min(34vh, 300px);
    pointer-events: none;
    background: url("assets/pages/home/bottom-mountain-band.png") left bottom / 100% auto no-repeat;
}

.scene-hero {
    position: relative;
    overflow: hidden;
    color: var(--sand);
    background:
        linear-gradient(90deg, rgba(28, 58, 48, .78), rgba(10, 31, 35, .18) 52%, rgba(8, 23, 26, .28)),
        url("assets/shared/backgrounds/tea-horse-landscape.jpg") center / cover;
}

.scene-hero::after,
.map-card::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    background:
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence baseFrequency='.75' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)' opacity='.045'/%3E%3C/svg%3E");
    mix-blend-mode: multiply;
}

.hero-card {
    position: absolute;
    z-index: 1;
    left: clamp(38px, 4vw, 72px);
    top: 50%;
    transform: translateY(calc(-50% - 12px));
    width: min(690px, calc(100vw - 96px));
    padding: 34px 36px 36px;
    border: 1px solid rgba(216, 191, 140, .28);
    border-radius: 8px;
    background:
        linear-gradient(90deg, rgba(8, 25, 29, .47), rgba(14, 39, 38, .29)),
        rgba(7, 24, 28, .43);
    box-shadow:
        inset 0 1px 0 rgba(255, 239, 194, .1),
        0 28px 70px rgba(0, 0, 0, .34);
    backdrop-filter: blur(8px);
}

.hero-card::before {
    content: "";
    position: absolute;
    pointer-events: none;
    inset: 10px;
    border: 1px solid rgba(216, 191, 140, .08);
}

.hero-title-lockup {
    position: relative;
    display: inline-block;
    margin: 0 0 9px;
    width: min(420px, 58%);
}

.hero-title-img {
    display: block;
    width: 100%;
    height: auto;
    filter:
        drop-shadow(0 2px 18px rgba(0, 0, 0, .44)) drop-shadow(0 0 12px rgba(216, 191, 140, .14));
}

.hero-seal-img {
    position: absolute;
    right: -28px;
    top: 8px;
    width: 18px;
    height: auto;
    filter: drop-shadow(0 0 10px rgba(161, 46, 34, .2));
}

.hero-card>p {
    width: 100%;
    max-width: none;
    margin: 0;
    color: rgba(232, 220, 199, .9);
    font-size: 18px;
    font-weight: 700;
    line-height: 1.9;
    text-indent: 2em;
    text-shadow: 0 2px 12px rgba(0, 0, 0, .38);
}

.hero-stats {
    display: grid;
    grid-template-columns: repeat(4, minmax(92px, 1fr));
    gap: 0;
    margin-top: 30px;
    border: 1px solid rgba(216, 191, 140, .18);
    background: rgba(4, 18, 22, .34);
    box-shadow: inset 0 1px 0 rgba(255, 239, 194, .08);
}

.hero-stats div {
    position: relative;
    min-height: 138px;
    padding: 18px 14px 16px;
    display: grid;
    grid-template-rows: 36px auto auto;
    row-gap: 8px;
    justify-items: center;
    align-content: center;
    text-align: center;
    background: linear-gradient(180deg, rgba(216, 191, 140, .05), rgba(216, 191, 140, .01));
}

.hero-stats div+div {
    border-left: 1px solid rgba(216, 191, 140, .16);
}

.hero-stats img {
    width: 34px;
    height: 34px;
    object-fit: contain;
    margin-bottom: 0;
    filter: drop-shadow(0 0 12px rgba(216, 191, 140, .22));
}

.hero-stats span {
    display: block;
    margin-bottom: 0;
    color: rgba(232, 220, 199, .78);
    font-size: 16px;
    font-weight: 800;
}

.hero-stats p {
    width: auto;
    max-width: none;
    min-width: 88px;
    margin: 0;
    display: inline-flex;
    align-items: baseline;
    justify-content: center;
    gap: 6px;
    color: inherit;
    font-size: inherit;
    font-weight: 400;
    line-height: 1;
    text-indent: 0;
    text-shadow: none;
}

.hero-stats b {
    display: inline-block;
    color: #e5c486;
    font-size: 42px;
    line-height: 1;
    letter-spacing: .02em;
    text-shadow: 0 0 18px rgba(216, 191, 140, .18);
}

.hero-stats small {
    margin-left: 0;
    color: rgba(232, 220, 199, .75);
    font-size: 15px;
    font-weight: 700;
}

.home-lower {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: minmax(0, .6fr) minmax(0, .6fr) minmax(0, 1.4fr) minmax(0, 1.4fr);
    gap: 18px;
    min-height: calc(52vh - 86px);
    padding: 28px 32px 32px;
}

.home-panel {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
    min-width: 0;
    min-height: 0;
}

.home-panel .section-title {
    margin: 0 0 18px;
    animation: home-section-title-enter 480ms cubic-bezier(.22, 1, .36, 1) backwards;
    animation-delay: calc(60ms + var(--panel-delay, 0ms));
}

.home-route-list,
.home-entry-grid,
.home-node-grid,
.home-heritage-grid {
    display: grid;
    gap: 10px;
    min-height: 0;
}

.home-route-list {
    grid-template-rows: repeat(3, minmax(74px, 1fr));
}

.home-entry-grid {
    grid-template-rows: repeat(4, minmax(60px, 1fr));
}

.home-route-card,
.home-entry-card,
.home-node-card,
.home-heritage-card {
    position: relative;
    min-width: 0;
    padding: 0;
    overflow: hidden;
    color: #213421;
    border: 0;
    border-radius: 5px;
    background: rgba(232, 220, 199, .7);
    box-shadow: 0 10px 24px rgba(76, 86, 45, .08);
    text-align: left;
    transition: transform 360ms ease, box-shadow 360ms ease;
    animation: home-card-enter 560ms cubic-bezier(.22, 1, .36, 1) backwards;
    animation-delay: calc(140ms + var(--panel-delay, 0ms) + var(--card-delay, 0ms));
}

@keyframes home-section-title-enter {
    from {
        opacity: 0;
        transform: translate3d(-12px, 8px, 0);
    }

    to {
        opacity: 1;
        transform: translate3d(0, 0, 0);
    }
}

@keyframes home-card-enter {
    from {
        opacity: 0;
        transform: translate3d(0, 18px, 0) scale(.965);
    }

    to {
        opacity: 1;
        transform: translate3d(0, 0, 0) scale(1);
    }
}

@keyframes home-card-exit {
    from {
        opacity: 1;
        transform: translate3d(0, 0, 0) scale(1);
    }

    to {
        opacity: 0;
        transform: translate3d(0, -14px, 0) scale(.97);
    }
}

@media (prefers-reduced-motion: reduce) {
    .home-panel .section-title,
    .home-route-card,
    .home-entry-card,
    .home-node-card,
    .home-heritage-card {
        animation: none;
    }

    .home-refresh-button.is-refreshing svg {
        animation: none;
    }

    .home-node-grid.is-exiting .home-node-card,
    .home-heritage-grid.is-exiting .home-heritage-card {
        animation: none !important;
        opacity: 0;
    }
}

.home-route-card:hover,
.home-entry-card:hover,
.home-node-card:hover,
.home-heritage-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 15px 30px rgba(76, 86, 45, .14);
}

.home-route-card:focus-visible,
.home-entry-card:focus-visible,
.home-node-card:focus-visible,
.home-heritage-card:focus-visible {
    outline: 2px solid rgba(62, 62, 62, .88);
    outline-offset: 3px;
}

.home-route-card {
    min-height: 0;
}

.home-route-card::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(44, 44, 44, .06), rgba(38, 38, 38, .84));
}

.home-route-card>img {
    position: absolute;
    inset: 0;
    display: block;
    width: 100%;
    height: 100%;
    object-fit: fill;
    object-position: center;
    filter: saturate(.74) contrast(.94);
}

.home-route-card>span {
    position: absolute;
    z-index: 1;
    left: 16px;
    right: 14px;
    bottom: 13px;
    display: grid;
    gap: 4px;
    color: #e8dcc7;
}

.home-route-card b,
.home-entry-card b,
.home-node-card b,
.home-heritage-card b {
    font-size: 16px;
    line-height: 1.2;
}

.home-route-card small,
.home-entry-card small,
.home-node-card small,
.home-heritage-card small {
    color: #4c562d;
    font-size: 12px;
    line-height: 1.35;
}

.home-entry-grid {
    grid-template-columns: 1fr;
}

.home-entry-card {
    min-height: 0;
}

.home-entry-card>img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    filter: saturate(.74) contrast(.94);
}

.home-entry-card::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(44, 44, 44, .06), rgba(38, 38, 38, .84));
}

.home-entry-card>span {
    position: absolute;
    z-index: 1;
    left: 16px;
    right: 14px;
    bottom: 13px;
    display: grid;
    gap: 4px;
    color: #e8dcc7;
}

.home-route-card small,
.home-entry-card small {
    color: rgba(232, 220, 199, .8);
}

.home-node-grid,
.home-heritage-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    grid-template-rows: repeat(4, minmax(58px, 1fr));
    gap: 8px;
}

.home-node-grid.is-refreshing .home-node-card,
.home-heritage-grid.is-refreshing .home-heritage-card {
    animation-delay: calc(40ms + var(--card-delay, 0ms));
}

.home-node-grid.is-exiting .home-node-card,
.home-heritage-grid.is-exiting .home-heritage-card {
    pointer-events: none;
    animation: home-card-exit 280ms cubic-bezier(.64, 0, .78, 0) forwards;
    animation-delay: var(--exit-delay, 0ms);
}

.home-node-card,
.home-heritage-card {
    min-height: 0;
    background: #3c3c3c;
}

.home-node-card>img,
.home-heritage-card>img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    filter: saturate(.82) contrast(.96);
    transition: transform 420ms ease, filter 420ms ease;
}

.home-node-card::after,
.home-heritage-card::after {
    content: "";
    position: absolute;
    inset: 30% 0 0;
    background: linear-gradient(180deg, transparent, rgba(36, 36, 36, .88));
}

.home-node-card:hover>img,
.home-heritage-card:hover>img {
    transform: scale(1.035);
    filter: saturate(.96) contrast(1);
}

.home-node-card>span,
.home-heritage-card>span {
    position: absolute;
    z-index: 1;
    left: 9px;
    right: 8px;
    bottom: 8px;
    color: #f1e5cf;
    text-shadow: 0 1px 5px rgba(0, 0, 0, .72);
}

.home-node-card b,
.home-heritage-card b {
    display: block;
    font-size: 13px;
    line-height: 1.25;
    overflow-wrap: anywhere;
}

.section-title {
    display: flex;
    align-items: center;
    gap: 12px;
}

.section-title::after {
    content: "";
    order: 1;
    height: 2px;
    flex: 1;
    border-radius: 999px;
    background: rgba(96, 108, 56, .18);
}

.home-refresh-button {
    order: 2;
    display: grid;
    place-items: center;
    flex: 0 0 28px;
    width: 28px;
    height: 28px;
    padding: 0;
    color: #565a49;
    border: 0;
    border-radius: 50%;
    background: transparent;
    cursor: pointer;
    transition: color 260ms ease, background-color 260ms ease, transform 320ms ease;
}

.home-refresh-button svg {
    width: 18px;
    height: 18px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.home-refresh-button:hover:not(:disabled) {
    color: #2f302c;
    background: rgba(62, 62, 62, .09);
    transform: rotate(28deg);
}

.home-refresh-button:focus-visible {
    outline: 2px solid rgba(62, 62, 62, .72);
    outline-offset: 2px;
}

.home-refresh-button:disabled {
    cursor: wait;
    opacity: .38;
}

.home-refresh-button.is-refreshing {
    opacity: 1;
}

.home-refresh-button.is-refreshing svg {
    animation: home-refresh-spin 760ms linear infinite;
}

@keyframes home-refresh-spin {
    to {
        transform: rotate(360deg);
    }
}

.heritage-card h4 {
    margin: 0 0 8px;
    font-size: 21px;
    color: inherit;
}

.heritage-card p {
    margin: 0;
    line-height: 1.55;
}

.heritage-card {
    overflow: hidden;
    text-align: left;
}

.heritage-card img {
    display: block;
    width: 100%;
    height: 118px;
    object-fit: cover;
    background: var(--oat);
    filter: saturate(.84) contrast(.94);
}

.heritage-card .body {
    padding: 14px;
}

.workspace {
    display: grid;
    grid-template-columns: 292px minmax(0, 1fr) 340px;
    gap: 18px;
    padding: 18px;
}

.workspace.two-col {
    grid-template-columns: 320px minmax(0, 1fr);
}

.workspace.wide-right {
    grid-template-columns: 330px minmax(0, 1fr) 420px;
}

.global-page {
    position: relative;
    min-height: calc(100vh - 86px);
    overflow: hidden;
    isolation: isolate;
    background: #22351f;
}

.global-webgl {
    position: absolute;
    inset: 0;
    z-index: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
    opacity: 0;
    pointer-events: none;
    filter: saturate(.95) contrast(1.06);
    transition: opacity var(--ease);
}

.global-webgl.active {
    opacity: 1;
    pointer-events: auto;
}

.global-page .global-webgl .supermap3d-viewer-navigationContainer,
.route-explore-webgl .supermap3d-viewer-navigationContainer {
    top: auto;
    right: calc(24px + var(--map-render-extra-width, 0px));
    bottom: 24px;
    width: 128px;
    height: 128px;
    z-index: 4;
}

.global-page .global-webgl .sm-compass,
.route-explore-webgl .sm-compass {
    top: 0;
    right: 0;
}

.global-page .global-webgl .sm-zoom,
.route-explore-webgl .sm-zoom {
    display: none;
}

.global-page .global-webgl[data-display-mode="2d"] .supermap3d-viewer-navigationContainer {
    display: none;
}

/* Route documentary placeholders and user-controlled node exhibitions. */
.route-theme-media-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.08fr) minmax(340px, .92fr);
    gap: 26px;
    align-items: center;
    padding: 20px 4px;
}

.route-theme-media-grid .route-story-intro {
    padding: 0;
}

.route-video-placeholder {
    position: relative;
    aspect-ratio: 16 / 9;
    min-width: 0;
    overflow: hidden;
    border: 1px solid rgba(110, 78, 34, .58);
    border-radius: 3px;
    color: #f2e2bb;
    background: #263f35;
    isolation: isolate;
}

.route-video-placeholder>img,
.route-video-shade {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
}

.route-video-placeholder>img {
    object-fit: cover;
    filter: sepia(.18) saturate(.72) brightness(.68);
}

.route-video-shade {
    z-index: 1;
    background: rgba(12, 29, 24, .38);
}

.route-video-play {
    position: absolute;
    left: 50%;
    top: 44%;
    z-index: 2;
    width: 54px;
    height: 54px;
    display: grid;
    place-items: center;
    padding-left: 3px;
    border: 1px solid rgba(241, 220, 171, .74);
    border-radius: 50%;
    color: #f1dcab;
    background: rgba(22, 54, 45, .72);
    font: 700 18px/1 Arial, sans-serif;
    transform: translate(-50%, -50%);
}

.route-video-placeholder>div {
    position: absolute;
    left: 18px;
    right: 18px;
    bottom: 15px;
    z-index: 2;
    display: grid;
    gap: 2px;
}

.route-video-placeholder small,
.route-video-placeholder b,
.route-video-placeholder em {
    display: block;
    letter-spacing: 0;
}

.route-video-placeholder small {
    color: rgba(242, 224, 184, .68);
    font: 700 9px/1.2 "Epilogue", Arial, sans-serif;
}

.route-video-placeholder b {
    font: 800 17px/1.35 "STKaiti", "KaiTi", serif;
}

.route-video-placeholder em {
    color: rgba(242, 224, 184, .72);
    font-size: 11px;
    font-style: normal;
}

.route-intro-video-backdrop {
    position: absolute;
    inset: 0;
    z-index: 9;
    display: grid;
    place-items: center;
    padding: 32px;
    background: rgba(7, 15, 12, .76);
    backdrop-filter: grayscale(.25) brightness(.58);
}

.route-intro-video-dialog {
    width: min(920px, calc(100vw - 64px));
    max-height: calc(100dvh - 64px);
    display: grid;
    grid-template-rows: auto minmax(0, 1fr) auto;
    gap: 18px;
    padding: 22px;
    overflow: auto;
    border: 1px solid rgba(173, 126, 52, .82);
    border-radius: 4px;
    color: #244b40;
    background: rgba(239, 226, 197, .97);
    box-shadow: 0 24px 70px rgba(0, 0, 0, .5), inset 0 0 0 5px rgba(151, 108, 49, .12);
}

.route-intro-video-dialog>header small {
    color: #8a6537;
    font: 700 13px/1.3 "STKaiti", "KaiTi", serif;
}

.route-intro-video-dialog>header h2 {
    margin: 5px 0 2px;
    color: #214f42;
    font: 800 31px/1.25 "STKaiti", "KaiTi", serif;
    letter-spacing: 0;
}

.route-intro-video-dialog>header p {
    margin: 0;
    color: #765b39;
    font: 700 15px/1.5 "STKaiti", "KaiTi", serif;
}

.route-intro-video-frame {
    width: 100%;
    min-height: 0;
}

.route-intro-video-dialog>footer {
    display: flex;
    justify-content: flex-end;
    gap: 12px;
}

.route-node-backdrop {
    position: absolute;
    inset: 0;
    z-index: 9;
    display: grid;
    place-items: center;
    padding: 34px;
    background: rgba(7, 15, 12, .72);
    backdrop-filter: grayscale(.42) brightness(.62);
}

.route-node-backdrop .route-story-card {
    position: relative;
    inset: auto;
    width: min(980px, calc(100vw - 96px));
    height: min(650px, calc(100% - 40px));
    max-height: 720px;
    display: grid;
    grid-template-rows: auto auto minmax(0, 1fr) auto;
    overflow: hidden;
    padding: 24px 28px 22px;
    box-shadow: 0 28px 86px rgba(0, 0, 0, .58), inset 0 0 0 5px rgba(98, 71, 34, .08);
    animation-name: route-node-dialog-in;
}

@keyframes route-node-dialog-in {
    from { opacity: 0; transform: translateY(18px) scale(.985); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}

.route-node-close {
    position: absolute;
    right: 17px;
    top: 14px;
    z-index: 3;
    width: 36px;
    height: 36px;
    padding: 0;
    border: 1px solid rgba(108, 78, 39, .42);
    border-radius: 50%;
    color: #5d4d34;
    background: rgba(239, 225, 194, .72);
    font: 500 25px/1 Arial, sans-serif;
}

.route-node-backdrop .route-story-card>header {
    padding-right: 42px;
}

.route-node-backdrop .route-story-card-title {
    margin: 12px 0 14px;
}

.route-node-backdrop .route-story-card-title h2 {
    font-size: 34px;
}

.route-node-pages {
    min-height: 0;
    overflow: auto;
    border-top: 1px solid rgba(102, 75, 38, .18);
    border-bottom: 1px solid rgba(102, 75, 38, .18);
}

.route-node-page {
    min-height: 100%;
    padding: 20px 2px;
}

.route-node-page-overview,
.route-node-page-video {
    display: grid;
    grid-template-columns: minmax(0, 1.28fr) minmax(280px, .72fr);
    gap: 26px;
    align-items: center;
}

.route-node-page figure {
    position: relative;
    aspect-ratio: 16 / 9;
    margin: 0;
    overflow: hidden;
    border: 1px solid rgba(100, 72, 35, .42);
    background: #d4c3a1;
}

.route-node-page figure img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    filter: sepia(.14) saturate(.8);
}

.route-node-page figure figcaption {
    position: absolute;
    right: 7px;
    bottom: 6px;
    padding: 3px 6px;
    color: #f3e4be;
    background: rgba(20, 43, 36, .7);
    font-size: 10px;
}

.route-node-page figure>span {
    position: absolute;
    inset: 0;
    display: none;
    place-items: center;
    color: #715c3f;
}

.route-node-page figure.image-missing img,
.route-node-page figure.image-missing figcaption {
    display: none;
}

.route-node-page figure.image-missing>span {
    display: grid;
}

.route-node-copy small,
.route-node-evidence span {
    color: #8b6536;
    font-size: 12px;
    font-weight: 800;
}

.route-node-copy h3 {
    margin: 6px 0 10px;
    color: #24493e;
    font: 900 24px/1.3 "STKaiti", "KaiTi", serif;
}

.route-node-copy p,
.route-node-evidence p {
    margin: 0;
    color: #465448;
    font-size: 15px;
    font-weight: 600;
    line-height: 1.85;
}

.route-node-page-video {
    grid-template-columns: minmax(0, 1.15fr) minmax(280px, .85fr);
}

.route-node-evidence {
    display: grid;
    gap: 7px;
}

.route-node-evidence p+span {
    margin-top: 14px;
    padding-top: 14px;
    border-top: 1px solid rgba(102, 75, 38, .18);
}

.route-node-page-archive {
    display: grid;
    grid-template-columns: 160px minmax(0, 1fr);
    gap: 28px;
    align-items: center;
}

.route-node-archive-mark {
    min-height: 190px;
    display: grid;
    align-content: center;
    justify-items: center;
    border-right: 1px solid rgba(102, 75, 38, .2);
}

.route-node-archive-mark span {
    padding: 5px 12px;
    border: 1px solid #9d4638;
    color: #9d4638;
    font-size: 15px;
    font-weight: 800;
}

.route-node-archive-mark b {
    margin-top: 14px;
    color: rgba(135, 93, 37, .28);
    font: 800 64px/1 "Epilogue", Arial, sans-serif;
}

.route-node-page-archive dl {
    display: grid;
    grid-template-columns: 1fr 1fr;
    margin: 0;
}

.route-node-page-archive dl>div {
    padding: 11px 12px;
    border-bottom: 1px solid rgba(102, 75, 38, .16);
}

.route-node-page-archive dt {
    color: #8b7250;
    font-size: 11px;
    font-weight: 800;
}

.route-node-page-archive dd {
    margin: 4px 0 0;
    color: #3e4d42;
    font-size: 13px;
    font-weight: 650;
    line-height: 1.55;
}

.route-node-backdrop .route-story-card>footer {
    display: grid;
    grid-template-columns: auto 1fr;
    align-items: center;
    gap: 14px;
    margin-top: 16px;
}

.route-node-backdrop .route-story-card>footer nav {
    display: flex;
    gap: 6px;
}

.route-node-page-button {
    width: 38px;
    height: 32px;
    padding: 0;
    border: 1px solid rgba(101, 76, 42, .42);
    border-radius: 2px;
    color: #78613f;
    background: rgba(239, 225, 194, .46);
    font: 700 10px/1 "Epilogue", Arial, sans-serif;
}

.route-node-page-button.active {
    border-color: #315b4c;
    color: #f4e4bd;
    background: #315b4c;
}

.route-node-backdrop .route-story-card>footer>span {
    color: #8b7250;
    font: 700 11px/1 "Epilogue", Arial, sans-serif;
}

@media (max-width: 1180px) {
    .route-theme-media-grid {
        grid-template-columns: 1fr;
    }

    .route-theme-video {
        width: min(620px, 100%);
        margin-inline: auto;
    }

    .route-node-backdrop .route-story-card {
        width: min(900px, calc(100vw - 44px));
    }
}

@media (max-width: 820px) {
    .route-intro-video-backdrop {
        padding: 10px;
    }

    .route-intro-video-dialog {
        width: 100%;
        max-height: calc(100dvh - 20px);
        gap: 12px;
        padding: 16px;
    }

    .route-intro-video-dialog>header h2 {
        font-size: 25px;
    }

    .route-intro-video-dialog>footer .route-btn-secondary,
    .route-intro-video-dialog>footer .route-btn-primary {
        flex: 1 1 0;
        min-width: 0;
    }

    .route-theme-media-grid {
        padding: 12px 0;
    }

    .route-node-backdrop {
        padding: 8px;
    }

    .route-node-backdrop .route-story-card {
        left: auto;
        right: auto;
        top: auto;
        bottom: auto;
        width: 100%;
        height: min(620px, calc(100% - 12px));
        padding: 18px 16px 14px;
    }

    .route-node-backdrop .route-story-card-title h2 {
        font-size: 27px;
    }

    .route-node-page-overview,
    .route-node-page-video,
    .route-node-page-archive {
        grid-template-columns: 1fr;
        gap: 14px;
    }

    .route-node-page {
        padding: 14px 0;
    }

    .route-node-copy p,
    .route-node-evidence p {
        font-size: 13px;
        line-height: 1.7;
    }

    .route-node-archive-mark {
        min-height: 74px;
        grid-template-columns: auto auto;
        gap: 14px;
        border-right: 0;
        border-bottom: 1px solid rgba(102, 75, 38, .2);
    }

    .route-node-archive-mark b {
        margin: 0;
        font-size: 42px;
    }

    .route-node-page-archive dl {
        grid-template-columns: 1fr;
    }

    .route-node-backdrop .route-story-card>footer {
        grid-template-columns: auto 1fr auto;
        gap: 8px;
    }

    .route-node-backdrop .route-story-card>footer .route-btn-primary {
        min-height: 42px;
        padding-inline: 14px;
    }
}
.global-webgl canvas {
    display: block;
}

.route-explore-page {
    position: relative;
    min-height: calc(100vh - 86px);
    overflow: hidden;
    isolation: isolate;
    color: #f4ead2;
    background: #183a34;
}

.route-explore-webgl {
    position: absolute;
    inset: 0;
    z-index: 0;
    width: 100%;
    height: 100%;
    filter: saturate(.78) contrast(1.08) sepia(.08);
}

.route-explore-webgl canvas {
    display: block;
}

.route-explore-shade {
    position: absolute;
    inset: 0;
    z-index: 1;
    pointer-events: none;
    background: linear-gradient(90deg, rgba(10, 31, 28, .9) 0, rgba(10, 31, 28, .5) 340px, transparent 56%, rgba(18, 34, 27, .14));
}

.route-explore-controls {
    position: absolute;
    left: 18px;
    top: 18px;
    bottom: 18px;
    z-index: 8;
    width: clamp(390px, 25vw, 430px);
    max-width: calc(100vw - 36px);
    display: flex;
    flex-direction: column;
    gap: 22px;
    padding: 60px 24px 20px;
    overflow: auto;
    isolation: isolate;
    color: var(--heritage-copy);
    border: 1px solid rgba(212, 184, 149, .78);
    border-radius: 5px;
    background:
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence baseFrequency='.86' numOctaves='2'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)' opacity='.04'/%3E%3C/svg%3E"),
        linear-gradient(180deg, rgba(232, 220, 199, .94), rgba(232, 220, 199, .985));
    box-shadow: 0 34px 90px rgba(5, 18, 17, .32);
    backdrop-filter: blur(8px);
}

.route-explore-controls::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    border-radius: inherit;
    background: url("assets/shared/backgrounds/vertical-panel-texture.png") center / 100% 100% no-repeat;
    opacity: .72;
}

.route-explore-controls > * {
    position: relative;
    z-index: 1;
}

/* In flight mode the panel becomes the single source of route telemetry. */
.route-explore-controls-flight {
    gap: 16px;
    padding: 60px 24px 20px;
}

.route-explore-flight-info {
    min-width: 0;
    display: grid;
    gap: 15px;
}

.route-explore-flight-heading {
    position: relative;
    display: grid;
    gap: 10px;
    padding-bottom: 13px;
    border-bottom: 1px solid rgba(96, 108, 56, .18);
}

.route-flight-heading-actions {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 2;
}

.route-explore-flight-heading .heritage-title-lockup {
    padding-inline: 44px;
}

.route-flight-back-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    padding: 0;
    border: 1px solid rgba(96, 108, 56, .58);
    border-radius: 50%;
    background: rgba(232, 220, 199, .78);
    color: var(--heritage-ink);
    box-shadow: 0 3px 10px rgba(45, 60, 39, .12);
    cursor: pointer;
    transition: background-color .3s ease, border-color .3s ease, transform .3s ease;
}

.route-flight-back-button:hover {
    border-color: rgba(96, 108, 56, .8);
    background: rgba(212, 184, 149, .82);
    transform: translateX(-2px);
}

.route-flight-back-button:focus-visible {
    outline: 2px solid rgba(192, 142, 58, .85);
    outline-offset: 3px;
}

.route-flight-back-button svg {
    width: 21px;
    height: 21px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.9;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.route-explore-flight-heading .heritage-title-lockup {
    margin: 0;
}

.route-explore-flight-heading .heritage-title-lockup h3 {
    font-size: 48px;
}

.route-explore-flight-theme {
    display: grid;
    place-items: center;
    margin-top: 12px;
    color: var(--heritage-muted);
    font-family: "Noto Serif SC", "Songti SC", "Source Han Serif SC", serif;
    font-size: 17px;
    font-weight: 900;
    line-height: 1.15;
    text-align: center;
}

.route-explore-controls-flight .route-flight-narration {
    position: relative;
    left: auto;
    top: auto;
    width: auto;
}

.route-explore-controls-flight .route-flight-narration .route-narration-panel {
    border-color: rgba(96, 108, 56, .35);
    color: var(--heritage-copy);
    background: rgba(139, 157, 131, .14);
    box-shadow: inset 0 0 0 1px rgba(96, 108, 56, .04);
}

.route-explore-controls-flight .route-journey-hud {
    position: relative;
    left: auto;
    right: auto;
    bottom: auto;
    min-height: 0;
    display: grid;
    grid-template-columns: 1fr;
    gap: 15px;
    padding: 15px;
    border: 1px solid rgba(96, 108, 56, .26);
    border-radius: 4px;
    color: var(--heritage-copy);
    background: rgba(24, 60, 52, .92);
    box-shadow: 0 14px 28px rgba(5, 18, 17, .18);
}

.route-explore-controls-flight .route-journey-progress>div:first-child {
    color: rgba(241, 223, 185, .72);
}

.route-explore-controls-flight .route-flight-stats {
    grid-template-columns: 1fr;
    gap: 9px;
}

.route-explore-controls-flight .route-flight-stats>div {
    padding: 0 0 9px;
    border-left: 0;
    border-bottom: 1px solid rgba(222, 194, 137, .18);
}

.route-explore-controls-flight .route-flight-stats>div:last-child {
    padding-bottom: 0;
    border-bottom: 0;
}

.route-explore-controls-flight .route-flight-stats>div:nth-child(3) {
    display: block;
}

.route-explore-controls-flight .route-flight-stats dt {
    color: rgba(241, 223, 185, .58);
}

.route-explore-controls-flight .route-flight-stats dd {
    color: #f0dfb8;
    white-space: normal;
}

.route-explore-controls-flight .route-hud-controls {
    display: grid;
    grid-template-columns: 44px 44px minmax(0, 1fr);
}

.route-explore-controls-flight .route-hud-controls button {
    width: 100%;
}

.route-explore-controls-flight .route-hud-controls .route-next-button {
    width: 100%;
    overflow: visible;
    color: #efddb6;
}

.route-explore-controls-flight .route-elevation-overview {
    position: relative;
    top: auto;
    right: auto;
    width: auto;
    padding: 13px 12px 11px;
    border-color: rgba(96, 108, 56, .24);
    box-shadow: 0 12px 26px rgba(5, 18, 17, .12), inset 0 0 0 3px rgba(117, 103, 78, .035);
}

.route-explore-controls-flight .route-elevation-overview h3 {
    font-size: 18px;
}

.route-explore-controls-flight .route-profile-chart {
    margin-inline: -7px;
}

@media (max-width: 820px) {
    .route-explore-controls-flight {
        max-height: calc(100% - 16px);
        padding: 16px 12px 14px;
    }

    .route-explore-flight-heading .heritage-title-lockup h3 {
        font-size: 38px;
    }

    .route-explore-controls-flight .route-elevation-overview {
        display: block;
    }
}

.route-narration-panel {
    display: grid;
    gap: 11px;
    padding: 13px 14px;
    border: 1px solid rgba(176, 139, 110, .32);
    border-radius: 3px;
    background: rgba(139, 157, 131, .14);
    box-shadow: inset 0 0 0 1px rgba(96, 108, 56, .04);
}

.route-narration-panel header,
.route-narration-actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.route-narration-label {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 8px;
    color: var(--heritage-ink);
    font-size: 13px;
}

.route-narration-label i {
    width: 24px;
    height: 24px;
    display: grid;
    flex: 0 0 auto;
    place-items: center;
    border: 1px solid rgba(198, 107, 61, .62);
    color: var(--terracotta);
    font: 800 12px/1 "STKaiti", "KaiTi", serif;
    font-style: normal;
    background: rgba(198, 107, 61, .09);
}

.route-narration-label b {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.route-narration-panel .route-auto-toggle {
    min-width: 0;
    color: var(--heritage-ink);
    font-size: 13px;
}

.route-narration-panel .route-auto-toggle b {
    overflow: hidden;
    font-weight: 800;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.route-narration-panel em {
    flex: 0 0 auto;
    padding: 3px 7px;
    border: 1px solid rgba(96, 108, 56, .3);
    border-radius: 999px;
    color: var(--heritage-muted);
    font-size: 11px;
    font-style: normal;
    font-weight: 800;
}

.route-narration-panel[data-status="playing"] em,
.route-narration-panel[data-status="fallback"] em {
    color: #f1dfb9;
    background: var(--heritage-action);
}

.route-narration-body {
    display: grid;
    gap: 4px;
    min-width: 0;
}

.route-narration-body small {
    color: rgba(76, 86, 45, .72);
    font-size: 11px;
    font-weight: 800;
}

.route-narration-body strong {
    min-width: 0;
    overflow: hidden;
    color: var(--heritage-copy);
    font-size: 14px;
    font-weight: 900;
    line-height: 1.35;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.route-narration-actions {
    justify-content: flex-start;
}

.route-narration-actions button {
    width: 30px;
    height: 30px;
    display: grid;
    place-items: center;
    border: 1px solid rgba(96, 108, 56, .3);
    border-radius: 3px;
    color: var(--heritage-action);
    font-size: 13px;
    font-weight: 900;
    line-height: 1;
    background: rgba(212, 184, 149, .24);
    cursor: pointer;
}

.route-narration-actions button:hover {
    color: #f1dfb9;
    background: var(--heritage-action);
}

.route-explore-list {
    display: grid;
    gap: 14px;
}

.route-explore-list button {
    position: relative;
    min-width: 0;
    min-height: 0;
    display: grid;
    grid-template-columns: 6px minmax(0, 1fr);
    gap: 15px;
    align-items: stretch;
    padding: 18px 18px 18px 0;
    overflow: hidden;
    border: 1px solid rgba(176, 139, 110, .3);
    border-radius: 5px;
    color: var(--heritage-copy);
    text-align: left;
    background: rgba(232, 220, 199, .56);
    transition: border-color 180ms ease, background-color 180ms ease, transform 180ms ease;
}

.route-explore-list button>span:last-child {
    grid-column: 2;
    min-width: 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.route-card-copy {
    gap: 10px;
}

.route-card-title-row {
    min-width: 0;
    display: flex !important;
    align-items: baseline;
    justify-content: space-between;
    gap: 10px;
}

.route-card-title-row strong {
    min-width: 0;
    color: var(--heritage-ink);
    font-family: "Noto Serif SC", "Songti SC", "STSong", serif;
    font-size: 22px;
    font-weight: 800;
    line-height: 1.25;
}

.route-explore-list .route-swatch {
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 6px;
    background: var(--route-color);
}

.route-card-theme {
    color: #4f5949;
    font-size: 17px;
    font-weight: 700;
    line-height: 1.45;
}

.route-card-details {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 9px 18px;
    padding-top: 10px;
    border-top: 1px solid rgba(96, 108, 56, .16);
    color: #4f5949;
    font-size: 14px;
    font-weight: 700;
    line-height: 1.4;
}

.route-card-details span {
    display: inline-flex;
    align-items: center;
    gap: 5px;
}

.route-card-details img {
    width: 1em;
    height: 1em;
    max-height: 1em;
    display: block;
    flex: 0 0 auto;
    object-fit: contain;
}

.route-card-details b {
    display: inline;
    color: #4f5949;
    font-size: 14px;
    font-weight: 800;
}

.route-card-intro {
    display: block !important;
    color: #4f5949;
    font-size: 12px;
    font-weight: 600;
    line-height: 1.5;
}

.route-explore-list button.active {
    border-color: var(--route-color);
    color: var(--heritage-copy);
    background: rgba(232, 220, 199, .56);
    box-shadow: 0 0 0 1px var(--route-color);
    transform: translateY(-1px);
}

.route-explore-list button.active .route-card-details {
    border-color: rgba(96, 108, 56, .16);
}

.route-explore-list button.active .route-card-details b {
    color: #4f5949;
}

.route-explore-list button.active .route-swatch {
    background: var(--route-color);
}

.route-guide-backdrop {
    position: absolute;
    inset: 0;
    z-index: 6;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 22px 18px 22px clamp(466px, calc(25vw + 72px), 502px);
    background: rgba(15, 30, 24, .16);
    pointer-events: none;
}

.route-guide,
.route-summary {
    position: relative;
    width: min(79vw, 1320px);
    max-height: calc(100vh - 122px);
    overflow: auto;
    padding: 30px 32px 28px;
    border: 1px solid var(--route-color, #a9823d);
    border-radius: 5px;
    color: #263b31;
    background: #eee1c4 url("/assets/shared/backgrounds/vertical-panel-texture.png") center / cover;
    box-shadow: 0 22px 64px rgba(10, 22, 17, .42), inset 0 0 0 5px rgba(98, 71, 34, .08);
    pointer-events: auto;
    font-family: "STKaiti", "KaiTi", "SimSun", serif;
    font-weight: 600;
}

.route-guide-overview,
.route-guide-story {
    box-sizing: border-box;
    height: min(620px, calc(100vh - 130px));
    min-height: 0;
}

.route-guide-overview {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr) auto;
    overflow: hidden;
}

.route-guide::before,
.route-summary::before {
    content: "";
    position: absolute;
    inset: 8px;
    border: 1px solid color-mix(in srgb, var(--route-color, #8c6125) 38%, transparent);
    pointer-events: none;
}

.route-guide-header {
    position: relative;
    display: flex;
    justify-content: space-between;
    padding: 0 2px 16px;
    border-bottom: 1px solid rgba(101, 75, 38, .24);
    color: var(--route-color, #73572e);
    font-size: 14px;
    font-weight: 700;
}

.route-guide-header b {
    font-family: "Epilogue", Arial, sans-serif;
}

.route-overview-copy h2,
.route-story-intro h2,
.route-guide-section-title,
.route-summary>header h2,
.route-story-card-title h2 {
    color: var(--route-color, #21483d);
}

.route-guide-overview-grid {
    min-height: 0;
    display: grid;
    grid-template-columns: minmax(0, 1.5fr) minmax(290px, .82fr);
    gap: 36px;
    align-items: center;
    overflow: hidden;
    padding: 30px 2px 26px;
}

.route-overview-map {
    position: relative;
    aspect-ratio: 16 / 9;
    overflow: hidden;
    border: 1px solid rgba(109, 78, 34, .5);
    background: #e9dbbd url("/assets/shared/backgrounds/vertical-panel-texture.png") center / cover;
}

.route-overview-map>img {
    position: absolute;
    inset: auto 0 0;
    width: 100%;
    height: 58%;
    object-fit: cover;
    opacity: .45;
    filter: sepia(.32) saturate(.75);
}

.route-overview-map svg {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
}
.route-overview-map-static {
    background: #eee1c4 url("/assets/shared/backgrounds/vertical-panel-texture.png") center / cover;
}

.route-overview-map-static .route-overview-map-image {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    opacity: 1;
    filter: none;
}

.route-overview-map-static svg {
    display: none;
}

.route-overview-map-static .route-overview-north,
.route-overview-map-static .route-overview-data {
    display: none;
}

.route-overview-line-shadow,
.route-overview-line {
    fill: none;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.route-overview-line-shadow {
    stroke: rgba(247, 234, 198, .88);
    stroke-width: 10;
}

.route-overview-line {
    stroke: var(--route-accent);
    stroke-width: 4.5;
}

.route-overview-node circle:first-child {
    fill: #ecdfbe;
    stroke: #6f4b25;
    stroke-width: 2;
}

.route-overview-node circle:nth-child(2) {
    fill: var(--route-accent);
}

.route-overview-node text {
    fill: #3c4332;
    font: 700 17px "STKaiti", "KaiTi", "Microsoft YaHei", sans-serif;
    paint-order: stroke;
    stroke: #efe2c4;
    stroke-width: 4px;
    stroke-linejoin: round;
}

.route-overview-node text:last-child {
    fill: #87622d;
    font: 700 10px "Epilogue", Arial, sans-serif;
}

.route-overview-city-node circle {
    fill: #efe0b9;
    stroke: #6b5434;
    stroke-width: 1.8;
}

.route-overview-city-node text {
    fill: #5b523c;
    font: 800 13px "STKaiti", "KaiTi", "Microsoft YaHei", sans-serif;
    paint-order: stroke;
    stroke: rgba(240, 226, 194, .94);
    stroke-width: 3px;
    stroke-linejoin: round;
}

.route-overview-boundaries path {
    fill: rgba(137, 118, 78, .025);
    stroke: rgba(91, 93, 69, .42);
    stroke-width: 1.1;
    vector-effect: non-scaling-stroke;
}

.route-overview-admin-label {
    fill: rgba(72, 82, 63, .45);
    font: 800 22px "STKaiti", "KaiTi", serif;
    pointer-events: none;
}

.route-overview-context-node circle {
    fill: rgba(239, 225, 188, .7);
    stroke: rgba(87, 91, 69, .62);
    stroke-width: 1.2;
}

.route-overview-context-node text {
    fill: rgba(78, 83, 64, .72);
    font: 700 11px "STKaiti", "KaiTi", "Microsoft YaHei", sans-serif;
    paint-order: stroke;
    stroke: rgba(239, 226, 197, .9);
    stroke-width: 2.8px;
    stroke-linejoin: round;
}

.route-overview-north,
.route-overview-data {
    position: absolute;
    color: #5b563d;
    font-size: 11px;
    font-weight: 700;
}

.route-overview-north {
    right: 14px;
    top: 12px;
    text-align: center;
    line-height: 1.25;
}

.route-overview-data {
    left: 12px;
    bottom: 10px;
    padding: 3px 6px;
    border: 1px solid rgba(94, 73, 41, .28);
    background: rgba(239, 225, 194, .72);
}

.route-overview-missing {
    display: grid;
    aspect-ratio: 16 / 9;
    place-items: center;
    border: 1px solid rgba(109, 78, 34, .5);
    color: #785b35;
}

.route-overview-copy>small,
.route-story-intro small {
    color: #8b5d31;
    font-size: 14px;
    font-weight: 700;
}

.route-overview-copy h2,
.route-story-intro h2 {
    margin: 7px 0 10px;
    color: var(--route-color, #193f35);
    font: 900 35px/1.25 "FZKai-Z03", "STKaiti", "KaiTi", serif;
    letter-spacing: 0;
}

.route-overview-copy>p,
.route-story-intro p {
    margin: 0;
    color: #4f5949;
    font-size: 15px;
    font-weight: 600;
    line-height: 1.75;
}

.route-overview-copy dl {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0;
    margin: 18px 0 0;
    border-top: 1px solid rgba(92, 67, 32, .2);
}

.route-overview-copy dl>div {
    padding: 12px 4px;
    border-bottom: 1px solid rgba(92, 67, 32, .16);
}

.route-overview-copy dl>div.wide {
    grid-column: 1 / -1;
}

.route-overview-copy dt,
.route-story-card dt {
    color: #8b7250;
    font-size: 12px;
    font-weight: 700;
}

.route-overview-copy dd {
    margin: 3px 0 0;
    color: #263c32;
    font-size: 15px;
    font-weight: 700;
    line-height: 1.45;
}

.route-guide-actions {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 12px;
    padding: 18px 2px 0;
    border-top: 1px solid rgba(101, 75, 38, .24);
}

.route-guide-actions>span {
    margin-right: auto;
    color: #887253;
    font-size: 12px;
    font-weight: 600;
}

.route-btn-primary,
.route-btn-secondary {
    min-height: 46px;
    padding: 0 25px;
    border-radius: 3px;
    font-size: 15px;
    font-weight: 800;
}

.route-btn-primary {
    border: 1px solid color-mix(in srgb, var(--route-color, #315b4c) 72%, #2f271c);
    color: #f6ead0;
    background: var(--route-color, #315b4c);
}

.route-btn-primary:hover {
    background: color-mix(in srgb, var(--route-color, #315b4c) 78%, #172d27);
}

.route-btn-secondary {
    border: 1px solid rgba(101, 76, 42, .5);
    color: #4a442f;
    background: rgba(239, 225, 194, .48);
}

.route-story-intro {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    padding: 24px 4px 20px;
}

.route-dynasty-timeline {
    position: relative;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0;
    margin: 0;
    padding: 18px 0;
    list-style: none;
    border-top: 1px solid rgba(101, 75, 38, .2);
    border-bottom: 1px solid rgba(101, 75, 38, .2);
}

.route-dynasty-timeline li {
    display: grid;
    grid-template-columns: 42px 1fr;
    gap: 10px;
    padding: 5px 14px;
    border-right: 1px solid rgba(101, 75, 38, .18);
}

.route-dynasty-timeline li:last-child {
    border-right: 0;
}

.route-dynasty-timeline b {
    width: 38px;
    height: 38px;
    display: grid;
    place-items: center;
    border: 1px solid #98713b;
    color: #724f25;
    font: 800 21px/1 "STKaiti", "KaiTi", serif;
}

.route-dynasty-timeline span {
    color: #4d5748;
    font-size: 13px;
    font-weight: 600;
    line-height: 1.6;
}

.route-chapter-preview {
    min-height: 190px;
    display: flex;
    flex: 1 1 190px;
    flex-direction: column;
    padding: 20px 2px 10px;
}

.route-guide-section-title {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    color: var(--route-color, #294a3f);
    font-size: 16px;
    font-weight: 800;
}

.route-guide-section-title small {
    color: #8a7150;
    font-size: 12px;
    font-weight: 600;
}

.route-chapter-preview ol {
    min-height: 0;
    flex: 1 1 auto;
    display: grid;
    grid-template-columns: repeat(var(--route-node-count, 6), minmax(0, 1fr));
    gap: 12px;
    margin: 12px 0 0;
    padding: 0;
    list-style: none;
}

.route-chapter-preview li {
    min-width: 0;
    min-height: 0;
    height: 100%;
    display: grid;
    grid-template-rows: auto minmax(80px, 1fr) auto;
    align-content: stretch;
    gap: 9px;
    padding: 10px;
    border: 1px solid rgba(108, 79, 38, .25);
    background: rgba(240, 225, 193, .42);
}

.route-chapter-preview i {
    display: block;
    color: #9a7036;
    font: 700 11px/1 "Epilogue", Arial, sans-serif;
    font-style: normal;
}

.route-chapter-preview figure {
    width: 100%;
    min-height: 0;
    margin: 0;
    overflow: hidden;
    background: rgba(207, 188, 151, .45);
}

.route-chapter-preview figure img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    filter: saturate(.78) sepia(.08);
}

.route-chapter-preview li>div {
    min-width: 0;
    display: block;
    text-align: center;
}

.route-chapter-preview b {
    display: block;
    color: #32483e;
    font-size: 15px;
    font-weight: 800;
}

.route-chapter-preview small {
    display: -webkit-box;
    overflow: hidden;
    margin-top: 3px;
    color: #887657;
    font-size: 11px;
    font-weight: 600;
    line-height: 1.35;
    text-overflow: ellipsis;
    white-space: normal;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.route-chapter-preview em {
    display: none;
}

.route-guide-actions-split .route-auto-toggle {
    margin-right: auto;
}

.route-auto-toggle {
    display: flex;
    align-items: center;
    gap: 8px;
    color: #4e5b4a;
    font-size: 14px;
    font-weight: 700;
    cursor: pointer;
}

.route-auto-toggle input {
    position: absolute;
    opacity: 0;
}

.route-auto-toggle span {
    position: relative;
    width: 36px;
    height: 20px;
    border: 1px solid #9d8159;
    border-radius: 10px;
    background: #d5c6a5;
}

.route-auto-toggle span::after {
    content: "";
    position: absolute;
    left: 3px;
    top: 3px;
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: #715a38;
    transition: transform .2s;
}

.route-auto-toggle input:checked+span {
    background: #587665;
}

.route-auto-toggle input:checked+span::after {
    background: #f1dfb8;
    transform: translateX(16px);
}

.route-flight-title {
    position: absolute;
    left: calc(clamp(390px, 25vw, 430px) + 36px);
    top: 24px;
    z-index: 5;
    display: grid;
    padding-left: 14px;
    border-left: 3px solid #c69a49;
    text-shadow: 0 2px 8px rgba(0, 0, 0, .72);
}

.route-flight-title small {
    color: #d9b76e;
    font-size: 12px;
    font-weight: 700;
}

.route-flight-title strong {
    margin-top: 3px;
    color: #f5e9cd;
    font-size: 22px;
}

.route-flight-title span {
    margin-top: 3px;
    color: rgba(245, 233, 205, .72);
    font-size: 13px;
    font-weight: 600;
}

.route-flight-narration {
    position: absolute;
    left: calc(clamp(390px, 25vw, 430px) + 36px);
    top: 118px;
    z-index: 6;
    width: min(342px, calc(100vw - 520px));
}

.route-flight-narration .route-narration-panel {
    border-color: rgba(217, 180, 98, .6);
    background: rgba(12, 47, 41, .94) url("/assets/shared/backgrounds/vertical-panel-texture.png") center / cover;
    background-blend-mode: multiply;
    box-shadow: 0 12px 30px rgba(4, 18, 14, .36), inset 0 0 0 1px rgba(255, 232, 177, .08);
}

.route-journey-hud {
    position: absolute;
    left: calc(clamp(390px, 25vw, 430px) + 36px);
    right: 28px;
    bottom: 24px;
    z-index: 5;
    min-height: 118px;
    display: grid;
    grid-template-columns: minmax(150px, .85fr) minmax(380px, 1.6fr) auto;
    gap: 26px;
    align-items: center;
    padding: 18px 21px;
    border: 1px solid rgba(207, 170, 92, .54);
    border-radius: 4px;
    color: #f0e3c5;
    background: rgba(16, 49, 43, .92);
    box-shadow: 0 16px 38px rgba(0, 0, 0, .3);
    backdrop-filter: blur(8px);
}

.route-flight-loading {
    position: absolute;
    inset: 0;
    z-index: 6;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding-left: calc(clamp(390px, 25vw, 430px) + 36px);
    color: #ead9b4;
    background: rgba(18, 42, 35, .86) url("/assets/shared/backgrounds/vertical-panel-texture.png") center / cover;
    background-blend-mode: multiply;
    text-align: center;
}

.route-flight-loading i {
    width: 48px;
    height: 48px;
    display: block;
    margin-bottom: 15px;
    border: 1px solid rgba(219, 180, 99, .4);
    border-top-color: #d9ad55;
    border-radius: 50%;
    animation: route-loading-turn 1.4s linear infinite;
}

.route-flight-loading strong {
    font: 900 25px/1.3 "FZKai-Z03", "STKaiti", "KaiTi", serif;
    color: #e4c272;
}

.route-flight-loading span {
    margin-top: 7px;
    color: rgba(235, 218, 180, .72);
    font-family: "STKaiti", "KaiTi", serif;
    font-size: 12px;
    font-weight: 600;
}

@keyframes route-loading-turn {
    to { transform: rotate(360deg); }
}

.route-journey-progress>div:first-child {
    display: flex;
    justify-content: space-between;
    color: rgba(240, 227, 197, .7);
    font-size: 12px;
    font-weight: 600;
}

.route-journey-progress b {
    color: #e0b75e;
    font: 700 15px/1 "Epilogue", Arial, sans-serif;
}

.route-progress-track {
    height: 5px;
    margin-top: 12px;
    overflow: hidden;
    background: rgba(231, 217, 182, .18);
}

.route-progress-track i {
    width: 0;
    height: 100%;
    display: block;
    background: #d2a34f;
    transition: width .14s linear;
}

.route-elevation-overview {
    position: absolute;
    top: 24px;
    right: 28px;
    z-index: 5;
    width: 440px;
    padding: 17px 18px 13px;
    border: 1px solid rgba(116, 103, 73, .34);
    border-radius: 4px;
    color: rgba(55, 60, 45, .82);
    background:
        linear-gradient(180deg, rgba(197, 190, 164, .58), rgba(171, 165, 138, .5)),
        linear-gradient(135deg, rgba(63, 83, 64, .16), rgba(137, 104, 58, .1)),
        url("/assets/shared/backgrounds/vertical-panel-texture.png") center / cover;
    background-blend-mode: normal, multiply, multiply;
    box-shadow: 0 10px 26px rgba(7, 16, 12, .18), inset 0 0 0 4px rgba(117, 103, 78, .035);
    backdrop-filter: blur(2px);
}

.route-elevation-overview header {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 12px;
    min-height: 34px;
    padding: 0 2px 9px;
    border-bottom: 1px solid rgba(75, 77, 56, .16);
}

.route-elevation-overview header small {
    display: block;
    color: rgba(83, 77, 52, .72);
    font-family: "Epilogue", Arial, sans-serif;
    font-size: 9.5px;
    font-weight: 800;
}

.route-elevation-overview h3 {
    margin: 3px 0 0;
    color: rgba(43, 57, 42, .8);
    font: 800 19px/1.08 "FZKai-Z03", "STKaiti", "KaiTi", serif;
    text-shadow: 0 1px 0 rgba(255, 250, 232, .55);
}

.route-elevation-overview header>span {
    flex: 0 0 auto;
    color: rgba(64, 66, 48, .72);
    font: 800 10.5px/1.2 "Epilogue", Arial, sans-serif;
    text-align: right;
}

.route-profile-chart {
    margin: 12px -2px 7px;
}

.route-profile-chart svg {
    width: 100%;
    height: auto;
    display: block;
    overflow: visible;
    text-rendering: geometricPrecision;
}

.route-profile-grid line {
    stroke: rgba(58, 70, 52, .13);
    stroke-dasharray: 2 4;
}

.route-profile-grid text,
.route-profile-axis-y,
.route-profile-axis-x,
.route-profile-endpoint {
    fill: rgba(54, 61, 44, .58);
    font: 800 8.8px "STKaiti", "KaiTi", "Microsoft YaHei", serif;
}

.route-profile-axis-y,
.route-profile-axis-x {
    fill: rgba(76, 76, 51, .62);
}

.route-profile-endpoint {
    fill: rgba(45, 55, 39, .68);
    font-size: 9.5px;
}

.route-profile-area {
    fill: url(#routeProfileWash);
}

.route-profile-line-shadow,
.route-profile-line,
.route-profile-pending {
    fill: none;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.route-profile-line-shadow {
    stroke: rgba(225, 213, 181, .46);
    stroke-width: 3;
}

.route-profile-line {
    stroke: rgba(106, 89, 54, .72);
    stroke-width: 1.65;
}

.route-profile-pending {
    stroke: rgba(106, 89, 54, .28);
    stroke-width: 1.4;
    stroke-dasharray: 3 4;
}

.route-profile-node line {
    stroke: rgba(76, 83, 58, .3);
    stroke-width: .8;
    stroke-dasharray: 1.5 2;
}

.route-profile-node circle {
    fill: rgba(107, 91, 57, .74);
    stroke: rgba(226, 216, 184, .72);
    stroke-width: 1.5;
}

.route-profile-end-marker circle {
    fill: rgba(218, 206, 174, .82);
    stroke: rgba(103, 88, 55, .76);
    stroke-width: 1.5;
}

.route-profile-end-marker text {
    fill: rgba(42, 55, 39, .76);
    font: 800 9.4px "STKaiti", "KaiTi", "Microsoft YaHei", serif;
    paint-order: stroke;
    stroke: rgba(219, 210, 179, .62);
    stroke-width: 1.3px;
    stroke-linejoin: round;
}

.route-profile-node text {
    fill: rgba(42, 57, 41, .76);
    font: 800 9.4px "STKaiti", "KaiTi", "Microsoft YaHei", serif;
    paint-order: stroke;
    stroke: rgba(219, 210, 179, .58);
    stroke-width: 1.25px;
    stroke-linejoin: round;
}

.route-elevation-overview footer {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 7px 2px 0;
    border-top: 1px solid rgba(75, 77, 56, .14);
    color: rgba(67, 65, 44, .68);
    font-size: 10.5px;
    font-weight: 800;
}

.route-elevation-overview footer i {
    width: 3px;
    height: 3px;
    border-radius: 50%;
    background: rgba(86, 83, 55, .34);
}

.route-elevation-overview footer small {
    color: rgba(69, 66, 45, .5);
    font-family: "STKaiti", "KaiTi", serif;
    font-size: 10.5px;
    font-weight: 800;
}

/* Keep the in-flight sidebar as one information console instead of stacked cards. */
.route-explore-controls-flight .route-explore-flight-info {
    flex: 1 1 auto;
    min-height: 0;
    align-content: start;
    grid-template-rows: repeat(5, auto);
    gap: 12px;
}

.route-mode-story .route-explore-controls-flight .route-explore-flight-info {
    flex: 0 0 auto;
    grid-template-rows: repeat(4, auto);
}

    .route-explore-controls-flight .route-explore-flight-heading {
        padding-bottom: 10px;
        border-bottom: 1px solid rgba(96, 108, 56, .18);
    }

    .route-flight-back-button {
        width: 36px;
        height: 36px;
    }

    .route-explore-flight-heading .heritage-title-lockup {
        padding-inline: 40px;
    }

    .route-explore-controls-flight .route-explore-flight-heading .heritage-title-lockup h3 {
        font-size: 42px;
        line-height: 1.08;
    }

.route-explore-controls-flight .route-explore-flight-theme {
    width: 100%;
    place-items: center;
    margin-top: 7px;
    font-size: 14px;
    line-height: 1.35;
    text-align: center;
}

.route-flight-visual {
    min-width: 0;
    display: grid;
    gap: 8px;
}

.route-flight-visual h4 {
    margin: 0;
    color: var(--heritage-muted);
    font-family: "Noto Serif SC", "Songti SC", "Source Han Serif SC", serif;
    font-size: 17px;
    font-weight: 900;
    line-height: 1.15;
    letter-spacing: 0;
    text-align: center;
}

.route-flight-map,
.route-flight-profile {
    position: relative;
    width: 100%;
    min-height: 0;
    aspect-ratio: 1672 / 941;
    margin: 0;
    overflow: hidden;
    border-radius: 5px;
}

.route-flight-map img,
.route-flight-profile img {
    position: absolute;
    inset: 0;
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
    object-position: center;
}

.route-explore-controls-flight .route-flight-narration .route-narration-panel {
    grid-template-columns: auto minmax(0, 1fr) auto;
    grid-template-areas: "label body status";
    align-items: center;
    gap: 10px;
    padding: 9px 11px;
    border: 0;
    border-radius: 5px;
    background: rgba(139, 157, 131, .12);
    box-shadow: none;
}

.route-explore-controls-flight .route-narration-panel header {
    display: contents;
}

.route-explore-controls-flight .route-narration-label {
    grid-area: label;
}

.route-explore-controls-flight .route-narration-label i {
    width: 22px;
    height: 22px;
}

.route-explore-controls-flight .route-narration-body {
    grid-area: body;
    gap: 0;
}

.route-explore-controls-flight .route-narration-body small {
    display: none;
}

.route-explore-controls-flight .route-narration-body strong {
    font-size: 12px;
    line-height: 1.3;
}

.route-explore-controls-flight .route-narration-panel em {
    grid-area: status;
}

.route-explore-controls-flight .route-journey-hud {
    gap: 11px;
    padding: 13px 14px;
    border: 0;
    border-radius: 5px;
    box-shadow: 0 12px 26px rgba(5, 18, 17, .16);
}

.route-explore-controls-flight .route-flight-stats {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
}

.route-explore-controls-flight .route-flight-stats>div,
.route-explore-controls-flight .route-flight-stats>div:last-child {
    min-width: 0;
    padding: 9px 10px;
    border: 0;
    border-radius: 3px;
    background: rgba(232, 220, 199, .065);
}

.route-explore-controls-flight .route-flight-stats dt {
    font-size: 10px;
}

.route-explore-controls-flight .route-flight-stats dd {
    margin-top: 4px;
    font-size: 13px;
    white-space: nowrap;
}

.route-explore-controls-flight .route-hud-controls {
    grid-template-columns: 42px 42px minmax(0, 1fr);
    gap: 8px;
}

.route-explore-controls-flight .route-hud-controls button {
    height: 42px;
}

.route-explore-controls-flight .route-elevation-overview {
    min-height: 0;
    height: 100%;
    display: grid;
    grid-template-rows: auto minmax(180px, 1fr) auto;
    padding: 13px 8px 10px;
    border: 0;
    border-top: 1px solid rgba(96, 108, 56, .2);
    border-radius: 0;
    background: rgba(139, 157, 131, .09);
    box-shadow: none;
}

.route-explore-controls-flight .route-elevation-overview header {
    padding-inline: 5px;
}

.route-explore-controls-flight .route-elevation-overview h3 {
    max-width: 260px;
    overflow: hidden;
    font-size: 17px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.route-explore-controls-flight .route-profile-chart {
    min-height: 0;
    display: grid;
    place-items: center;
    margin: 0 -3px;
}

.route-explore-controls-flight .route-profile-chart svg {
    max-height: 100%;
}

.route-explore-controls-flight .route-elevation-overview footer {
    margin-inline: 5px;
}

.route-flight-stats {
    display: grid;
    grid-template-columns: 1.2fr 1.2fr .75fr;
    gap: 0;
    margin: 0;
}

.route-flight-stats>div {
    min-width: 0;
    padding: 0 14px;
    border-left: 1px solid rgba(222, 194, 137, .18);
}

.route-flight-stats dt {
    color: rgba(238, 224, 193, .52);
    font-size: 11px;
    font-weight: 600;
}

.route-flight-stats dd {
    margin: 5px 0 0;
    overflow: hidden;
    color: #f0dfb8;
    font-size: 14px;
    font-weight: 700;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.route-hud-controls {
    display: flex;
    gap: 7px;
}

.route-hud-controls button {
    width: 44px;
    height: 44px;
    padding: 0;
    border: 1px solid rgba(224, 183, 94, .48);
    border-radius: 3px;
    color: #efddb6;
    background: rgba(43, 78, 66, .92);
}

.route-hud-controls .route-next-button {
    width: auto;
    padding: 0 16px;
    font-size: 13px;
    font-weight: 700;
    white-space: nowrap;
}

.route-story-card {
    position: absolute;
    right: 28px;
    top: 22px;
    bottom: 160px;
    z-index: 7;
    width: min(400px, calc(100vw - 424px));
    overflow: auto;
    padding: 22px;
    border: 1px solid var(--route-color, #ac8546);
    border-radius: 5px;
    color: #304238;
    background: #eee1c4 url("/assets/shared/backgrounds/vertical-panel-texture.png") center / cover;
    box-shadow: -14px 18px 46px rgba(11, 27, 21, .35);
    animation: route-card-in .34s ease-out both;
}

@keyframes route-card-in {
    from { opacity: 0; transform: translateX(28px); }
    to { opacity: 1; transform: translateX(0); }
}

.route-story-card>header {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.route-story-card>header span {
    padding: 4px 9px;
    border: 1px solid #9d4638;
    color: #9d4638;
    font-size: 13px;
    font-weight: 700;
}

.route-story-card>header small {
    color: #806c4c;
    font: 700 11px/1 "Epilogue", Arial, sans-serif;
}

.route-story-card-title {
    display: flex;
    justify-content: space-between;
    margin: 14px 0 12px;
}

.route-story-card-title small {
    color: #8c7049;
    font-size: 12px;
    font-weight: 700;
}

.route-story-card-title h2 {
    margin: 3px 0 0;
    color: var(--route-color, #21483d);
    font: 900 30px/1.2 "STKaiti", "KaiTi", serif;
    letter-spacing: 0;
}

.route-story-card-title i {
    color: rgba(135, 93, 37, .22);
    font: 700 42px/1 "Epilogue", Arial, sans-serif;
    font-style: normal;
}

.route-story-card figure {
    position: relative;
    aspect-ratio: 16 / 9;
    margin: 0;
    overflow: hidden;
    border: 1px solid rgba(100, 72, 35, .42);
    background: #d4c3a1;
}

.route-story-card figure img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    filter: sepia(.18) saturate(.76);
}

.route-story-card figure figcaption {
    position: absolute;
    right: 6px;
    bottom: 5px;
    padding: 2px 5px;
    color: rgba(250, 238, 210, .8);
    background: rgba(22, 46, 38, .62);
    font-size: 10px;
}

.route-story-card figure>span {
    position: absolute;
    inset: 0;
    display: none;
    place-items: center;
    color: #7a6545;
    font-size: 12px;
}

.route-story-card figure.image-missing img,
.route-story-card figure.image-missing figcaption {
    display: none;
}

.route-story-card figure.image-missing>span {
    display: grid;
}

.route-story-card>p {
    margin: 14px 0;
    color: #465448;
    font-size: 14px;
    font-weight: 600;
    line-height: 1.75;
}

.route-story-card>dl {
    margin: 0;
    border-top: 1px solid rgba(102, 75, 38, .22);
}

.route-story-card>dl>div {
    display: grid;
    grid-template-columns: 82px minmax(0, 1fr);
    gap: 8px;
    padding: 10px 0;
    border-bottom: 1px solid rgba(102, 75, 38, .16);
}

.route-story-card dd {
    margin: 0;
    color: #3e4d42;
    font-size: 12px;
    font-weight: 600;
    line-height: 1.6;
}

.route-fact-status {
    display: inline-block;
    padding: 2px 6px;
    border: 1px solid #758262;
    color: #526243;
}

.route-fact-status[data-status="地方传说"] { border-color: #a1703f; color: #8b5d30; }
.route-fact-status[data-status="参考线路"] { border-color: #8a765c; color: #706049; }
.route-fact-status[data-status="待考"] { border-color: #a84a3a; color: #993e32; }

.route-story-card>footer {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
    margin-top: 14px;
}

.route-story-card>footer button {
    min-width: 0;
    padding: 0 8px;
}

.route-auto-countdown {
    margin-top: 10px;
    color: #826b49;
    font-size: 9px;
}

.route-auto-countdown i {
    width: 100%;
    height: 2px;
    display: block;
    margin-bottom: 5px;
    background: #9d7134;
    transform-origin: left;
    animation: route-countdown 10s linear both;
}

@keyframes route-countdown { to { transform: scaleX(0); } }

.route-summary-backdrop {
    padding-left: clamp(466px, calc(25vw + 72px), 502px);
}

.route-summary {
    width: min(940px, 72vw);
    padding: 32px;
}

.route-summary>header {
    position: relative;
    text-align: center;
}

.route-summary>header small { color: #9c4738; font-size: 13px; font-weight: 700; }
.route-summary>header h2 { margin: 7px 0 3px; color: var(--route-color, #21483d); font: 900 34px/1.2 "STKaiti", "KaiTi", serif; letter-spacing: 0; }
.route-summary>header p { margin: 0; color: #85683f; font-size: 15px; font-weight: 600; }

.route-summary-body {
    position: relative;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 26px;
    margin-top: 24px;
}

.route-summary-body>div>span {
    display: block;
    padding-bottom: 8px;
    border-bottom: 1px solid rgba(101, 75, 38, .23);
    color: #75572f;
    font-size: 16px;
    font-weight: 800;
}

.route-summary-chapters ol { margin: 9px 0 0; padding: 0; list-style: none; }
.route-summary-chapters li { display: grid; grid-template-columns: 30px 1fr; gap: 9px; padding: 7px 0; }
.route-summary-chapters i { color: #9c7138; font: 700 11px/1.6 "Epilogue", Arial, sans-serif; font-style: normal; }
.route-summary-chapters b,
.route-summary-chapters small { display: block; }
.route-summary-chapters b { color: #31473d; font-size: 14px; }
.route-summary-chapters small { margin-top: 3px; color: #806f55; font-size: 11px; font-weight: 600; line-height: 1.45; }

.route-summary-history>div { display: grid; grid-template-columns: 34px 1fr; gap: 10px; padding: 8px 0; }
.route-summary-history>div b { width: 30px; height: 30px; display: grid; place-items: center; border: 1px solid #9b7440; color: #725129; }
.route-summary-history p { margin: 0; color: #536052; font-size: 12px; font-weight: 600; line-height: 1.6; }
.route-summary-people { padding-top: 10px; border-top: 1px solid rgba(101, 75, 38, .18); }
.route-summary-people b { display: block; margin-bottom: 4px; color: #765b35; }

.route-summary>footer {
    position: relative;
    display: flex;
    justify-content: center;
    gap: 10px;
    margin-top: 22px;
    padding-top: 16px;
    border-top: 1px solid rgba(101, 75, 38, .23);
}

.hidden {
    display: none !important;
}

.global-shade {
    position: absolute;
    inset: 0;
    z-index: 1;
    pointer-events: none;
    background:
        linear-gradient(90deg, rgba(9, 30, 34, .42), rgba(11, 28, 24, .12) 43%, rgba(9, 28, 32, .38)),
        linear-gradient(180deg, rgba(4, 20, 26, .1), rgba(3, 15, 14, .22));
}

.global-control {
    position: fixed;
    --global-nav-height: 86px;
    --global-card-gap-y: 18px;
    left: 18px;
    top: calc(var(--global-nav-height) + var(--global-card-gap-y));
    right: auto;
    bottom: var(--global-card-gap-y);
    z-index: 5;
    width: clamp(390px, 25vw, 430px);
    height: auto;
    aspect-ratio: auto;
    max-height: none;
    padding: 60px 24px 20px;
    overflow: auto;
    isolation: isolate;
    color: var(--text-strong);
    border: 1px solid rgba(212, 184, 149, .78);
    border-radius: 5px;
    background:
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence baseFrequency='.86' numOctaves='2'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)' opacity='.04'/%3E%3C/svg%3E"),
        linear-gradient(180deg, rgba(232, 220, 199, .94), rgba(232, 220, 199, .985));
    box-shadow: 0 34px 90px rgba(5, 18, 17, .32);
    backdrop-filter: blur(8px);
}

.global-control::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    border-radius: inherit;
    background: url("assets/shared/backgrounds/vertical-panel-texture.png") center / 100% 100% no-repeat;
    opacity: .72;
}

.global-control>* {
    position: relative;
    z-index: 1;
}

.global-city-panel {
    position: absolute;
    right: 30px;
    top: 24px;
    z-index: 6;
    --city-paper-rgb: 232, 220, 199;
    --city-paper: rgb(var(--city-paper-rgb));
    width: clamp(380px, 25vw, 500px);
    overflow: hidden;
    border: 1px solid rgba(212, 184, 149, .86);
    border-radius: 18px;
    color: #213421;
    font-family: "Noto Serif SC", "Songti SC", "Source Han Serif SC", "Adobe Caslon Pro", "Libre Caslon Text", serif;
    background:
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence baseFrequency='.86' numOctaves='2'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)' opacity='.04'/%3E%3C/svg%3E"),
        linear-gradient(180deg, rgba(232, 220, 199, .94), rgba(232, 220, 199, .985));
    box-shadow: 0 34px 90px rgba(5, 18, 17, .42);
    backdrop-filter: blur(8px);
    animation: cityPanelIn 360ms cubic-bezier(.2, .8, .2, 1);
}

.global-city-close {
    position: absolute;
    right: 12px;
    top: 12px;
    z-index: 4;
    width: 36px;
    height: 36px;
    display: grid;
    place-items: center;
    border: 1px solid rgba(212, 184, 149, .76);
    border-radius: 50%;
    color: #f1dfb9;
    background: rgba(9, 16, 15, .76);
    box-shadow: 0 14px 30px rgba(0, 0, 0, .32);
}

.global-city-close span,
.global-city-close span::after {
    display: block;
    width: 15px;
    height: 2px;
    border-radius: 999px;
    background: currentColor;
    transform: rotate(45deg);
    content: "";
}

.global-city-close span {
    position: relative;
}

.global-city-close span::after {
    position: absolute;
    left: 0;
    top: 0;
    transform: rotate(90deg);
}

.global-city-hero {
    position: relative;
    z-index: 2;
    aspect-ratio: 16 / 9;
    min-height: 0;
    overflow: visible;
    isolation: isolate;
}

.global-city-hero::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: -8px;
    z-index: 9;
    height: 70px;
    pointer-events: none;
    background: linear-gradient(180deg, rgba(var(--city-paper-rgb), 0), rgba(var(--city-paper-rgb), .18) 15%, rgba(var(--city-paper-rgb), .68) 55%, var(--city-paper) 90%, var(--city-paper));
}

.global-city-media {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
    background: rgba(96, 108, 56, .36);
}

.global-city-media img {
    position: relative;
    z-index: 0;
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.global-city-media::before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: -2px;
    z-index: 1;
    height: 170px;
    pointer-events: none;
    background: linear-gradient(180deg, rgba(var(--city-paper-rgb), 0), rgba(var(--city-paper-rgb), .1) 38%, rgba(var(--city-paper-rgb), .42) 70%, rgba(var(--city-paper-rgb), .9));
}

.global-city-media::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 2;
    pointer-events: none;
    background:
        linear-gradient(180deg, rgba(3, 13, 13, .18) 0%, rgba(3, 13, 13, .08) 34%, rgba(3, 13, 13, .18) 78%, rgba(var(--city-paper-rgb), .22) 100%),
        linear-gradient(90deg, rgba(3, 13, 13, .72) 0%, rgba(3, 13, 13, .18) 46%, rgba(3, 13, 13, .08) 100%);
}

.global-city-empty {
    width: 100%;
    height: 100%;
    display: grid;
    place-items: center;
    color: rgba(232, 220, 199, .82);
    font-size: clamp(48px, 8vw, 108px);
    font-weight: 800;
}

.global-city-title {
    position: absolute;
    left: 35px;
    right: 58px;
    bottom: 89px;
    z-index: 5;
    color: #f7eedb;
    text-shadow: 0 5px 16px rgba(0, 0, 0, .58);
}

.global-city-title h3 {
    margin: 0 0 16px;
    font-size: 58px;
    line-height: .96;
    letter-spacing: .08em;
    font-weight: 900;
}

.global-city-title p {
    margin: 0;
    color: rgba(247, 238, 219, .92);
    font-size: 15px;
    line-height: 1.28;
    font-weight: 700;
    letter-spacing: .08em;
}

.global-city-metrics {
    position: absolute;
    left: 20px;
    right: 20px;
    bottom: 5px;
    z-index: 10;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    min-height: 68px;
    border: 1px solid rgba(232, 220, 199, .68);
    border-radius: 14px;
    background: rgba(86, 84, 70, 0);
    box-shadow: inset 0 0 34px rgba(247, 238, 219, .12), 0 18px 38px rgba(0, 0, 0, .2);
    backdrop-filter: blur(2px) saturate(1.08);
}

.global-city-metric {
    min-width: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 11px 10px 10px;
    color: #f7eedb;
    text-align: left;
    text-shadow: 0 2px 12px rgba(0, 0, 0, .42);
}

.global-city-metric+.global-city-metric {
    border-left: 1px solid rgba(232, 220, 199, .34);
}

.global-city-metric img {
    flex: 0 0 auto;
    width: auto;
    height: 37px;
    object-fit: contain;
    filter: drop-shadow(0 2px 12px rgba(0, 0, 0, .42));
}

.global-city-metric-copy {
    min-width: 0;
    display: grid;
    justify-items: start;
}

.global-city-metric b {
    display: block;
    font-size: 14px;
    line-height: 1.2;
    font-weight: 800;
    letter-spacing: .04em;
}

.global-city-metric strong {
    display: block;
    margin-top: 6px;
    font-size: 21px;
    line-height: 1.12;
    font-weight: 800;
    letter-spacing: .02em;
}

.global-city-metric--compact-period strong {
    font-size: 18px;
    line-height: 1.18;
    font-weight: 700;
    letter-spacing: 0;
}

.global-city-body {
    position: relative;
    z-index: 1;
    isolation: isolate;
    margin-top: -8px;
    padding: 28px 20px 22px;
    background: var(--city-paper);
}

.global-city-body::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 0;
    height: 170px;
    pointer-events: none;
    opacity: .3;
    background: url("assets/pages/global-cognition/city-panel-bottom.png") left bottom / 100% auto no-repeat;
}

.global-city-body>* {
    position: relative;
    z-index: 1;
}

.global-city-main {
    display: grid;
    grid-template-columns: minmax(0, 3fr) minmax(0, 2fr);
    gap: 14px;
    align-items: stretch;
}

.global-city-main.text-only {
    grid-template-columns: 1fr;
}

.global-city-desc {
    margin: 0;
    color: rgba(33, 52, 33, .9);
    font-size: 14px;
    line-height: 1.55;
    text-align: justify;
    text-align-last: left;
    text-indent: 2em;
}

.global-city-map-card {
    position: relative;
    --city-map-offset-x: 8px;
    min-height: 0;
    height: 100%;
    padding: 12px 10px 10px;
    overflow: hidden;
    border: 1px solid rgba(176, 139, 110, .28);
    border-radius: 10px;
    background:
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence baseFrequency='.72' numOctaves='2'/%3E%3C/filter%3E%3Crect width='120' height='120' filter='url(%23n)' opacity='.035'/%3E%3C/svg%3E"),
        rgba(232, 220, 199, .7);
    box-shadow: inset 0 0 46px rgba(176, 139, 110, .16);
}

.global-city-map-card::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 3;
    pointer-events: none;
    background:
        linear-gradient(90deg, rgba(232, 220, 199, .88), transparent 18%, transparent 82%, rgba(232, 220, 199, .88)),
        linear-gradient(180deg, rgba(232, 220, 199, .9), transparent 18%, transparent 78%, rgba(232, 220, 199, .92));
}

.global-city-map-heading {
    position: relative;
    z-index: 4;
    display: flex;
    align-items: center;
    gap: 6px;
    color: #213421;
    font-size: 15px;
}

.global-city-info-icon {
    display: block;
    width: 20px;
    height: 20px;
    flex: 0 0 20px;
    object-fit: contain;
}

.global-city-map-pin {
    position: relative;
    display: block;
    width: 18px;
    height: 18px;
    border-radius: 50% 50% 50% 0;
    background: #3f6f4c;
    transform: rotate(-45deg);
    box-shadow: 0 3px 8px rgba(20, 46, 42, .24);
}

.global-city-map-pin::after {
    content: "";
    position: absolute;
    width: 6px;
    height: 6px;
    left: 6px;
    top: 6px;
    border-radius: 50%;
    background: #e8dcc7;
}

.global-city-map-north {
    position: absolute;
    right: 11px;
    top: 12px;
    z-index: 4;
    color: #213421;
    font-size: 11px;
    line-height: 1;
}

.global-city-map-north::after {
    content: "";
    display: block;
    width: 10px;
    height: 26px;
    margin: 4px auto 0;
    clip-path: polygon(50% 0, 88% 100%, 50% 72%, 12% 100%);
    background: linear-gradient(90deg, #213421 0 50%, #8b9d83 50% 100%);
}

.global-city-map-art {
    position: absolute;
    inset: 40px 10px 38px;
    opacity: .92;
}

.global-city-map-plot {
    position: absolute;
    left: 4px;
    right: 4px;
    top: 36px;
    bottom: 34px;
    z-index: 2;
    transform: translateX(var(--city-map-offset-x));
}

.global-city-boundary-map {
    position: absolute;
    inset: 0;
    z-index: 1;
    width: 100%;
    height: 100%;
    overflow: visible;
}

.global-city-boundary-map path {
    fill: rgba(232, 220, 199, .24);
    stroke: rgba(115, 109, 85, .38);
    stroke-width: .45;
    vector-effect: non-scaling-stroke;
}

.global-city-boundary-map path.active {
    fill: rgba(63, 111, 76, .78);
    stroke: rgba(33, 52, 33, .68);
    stroke-width: .7;
}

.global-city-map-empty {
    position: absolute;
    inset: 42px 12px 34px;
    z-index: 1;
    display: grid;
    place-items: center;
    color: rgba(33, 52, 33, .58);
    font-size: 11px;
}

.global-city-map-art::before,
.global-city-map-art::after {
    content: "";
    position: absolute;
    border: 1px solid rgba(176, 139, 110, .3);
    border-radius: 42% 58% 55% 45%;
}

.global-city-map-art::before {
    left: 0;
    top: 32px;
    width: 78%;
    height: 68%;
    transform: rotate(-8deg);
}

.global-city-map-art::after {
    right: 6%;
    top: 8%;
    width: 52%;
    height: 52%;
    transform: rotate(15deg);
}

.global-city-map-area {
    position: absolute;
    right: 24%;
    top: 43%;
    width: 46px;
    height: 38px;
    clip-path: polygon(12% 18%, 42% 4%, 84% 16%, 100% 48%, 73% 88%, 34% 100%, 0 74%);
    background: rgba(96, 108, 56, .8);
}

.global-city-map-anchor {
    position: absolute;
    z-index: 4;
    width: 31px;
    height: 31px;
    display: block;
    transform: translate(-50%, -100%);
}

.global-city-map-anchor .global-city-map-pin {
    position: absolute;
    left: 50%;
    top: 50%;
    display: block;
    width: 22px;
    height: 22px;
    background: #b7792f;
    filter: drop-shadow(0 4px 8px rgba(20, 46, 42, .22));
    transform: translate(-50%, -50%) rotate(-45deg);
}

.global-city-map-anchor .global-city-map-pin::after {
    left: 7px;
    top: 7px;
    width: 8px;
    height: 8px;
    background: #f7eedb;
}

.global-city-map-card p {
    position: absolute;
    left: 10px;
    right: 10px;
    bottom: 10px;
    z-index: 4;
    margin: 0;
    color: rgba(33, 52, 33, .82);
    font-size: 15px;
    line-height: 1.35;
    text-align: center;
}

.global-city-facts {
    display: grid;
    gap: 0;
    margin: 25px 0 0;
    padding-bottom: 20px;
}

.global-city-facts div {
    display: grid;
    grid-template-columns: 104px minmax(0, 1fr);
    gap: 15px;
    align-items: center;
    min-height: 46px;
    border-bottom: 1px solid rgba(176, 139, 110, .32);
}

.global-city-facts div:first-child {
    border-top: 1px solid rgba(176, 139, 110, .32);
}

.global-city-facts dt,
.global-city-facts dd {
    margin: 0;
}

.global-city-facts dt {
    display: flex;
    align-items: center;
    gap: 10px;
    padding-left: 13px;
    color: #214220;
    font-size: 15px;
    font-weight: 800;
}

.global-city-facts dd {
    min-width: 0;
    color: rgba(33, 52, 33, .86);
    font-size: 15px;
    line-height: 1.4;
    text-align: center;
}

@keyframes cityPanelIn {
    from {
        opacity: 0;
        transform: translateY(-10px) scale(.985);
    }

    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

.global-title-lockup {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: flex-start;
    gap: 10px;
    padding: 0;
}

.global-title-lockup h1 {
    display: block;
    margin: 0;
    color: var(--heritage-ink);
    font-family: "Adobe Caslon Pro", "Libre Caslon Text", "Iowan Old Style", "Songti SC", "STSong", serif;
    font-size: 48px;
    font-weight: 900;
    line-height: 1.05;
    letter-spacing: 0;
    text-shadow: none;
    white-space: nowrap;
}

.global-title-lockup>img.global-title-seal {
    position: static;
    width: auto;
    height: 34px;
    margin-top: 6px;
    flex: 0 0 auto;
    filter: drop-shadow(0 3px 8px rgba(114, 69, 24, .2));
}

.global-corridors {
    display: grid;
    gap: 12px;
    min-width: 0;
}

.global-corridors button {
    width: 100%;
    min-width: 0;
    min-height: 0;
    display: grid;
    place-items: center;
    padding: 0;
    border: 0;
    border-radius: 0;
    color: var(--sand);
    background: transparent;
    text-align: left;
    font-weight: 800;
    overflow: visible;
}

.global-corridors button:nth-child(2) {
    background: transparent;
}

.global-corridors button:nth-child(3) {
    background: transparent;
}

.global-corridors button img {
    display: block;
    width: 100%;
    max-width: 100%;
    height: auto;
    object-fit: contain;
    border-radius: 999px;
    transition: filter var(--ease), transform var(--ease);
}

.global-corridors button span {
    width: 22px;
    height: 2px;
    border-radius: 999px;
    background: currentColor;
    box-shadow: 10px 0 18px rgba(232, 220, 199, .44);
}

.global-corridors button.active {
    box-shadow: none;
}

.global-corridors button.active img {
    filter:
        drop-shadow(0 0 0 rgba(255, 238, 192, .95)) drop-shadow(0 0 5px rgba(255, 238, 192, .72));
}

.global-corridors button:hover img {
    transform: translateY(-1px);
}

.global-intro {
    margin: 10px 0 6px;
    padding: 0 2px 14px;
    border-bottom: 1px solid rgba(96, 108, 56, .18);
    color: var(--heritage-muted);
    font-family: "Noto Serif SC", "Songti SC", "Source Han Serif SC", serif;
    font-size: 17px;
    font-weight: 600;
    line-height: 1.62;
    text-indent: 2em;
}

.global-section {
    display: grid;
    gap: 10px;
    padding: 9px 0;
    border-top: 1px solid rgba(96, 108, 56, .16);
}

.global-intro+.global-section {
    border-top: 0;
    padding-top: 2px;
}

.global-section:last-child {
    padding-bottom: 0;
}

.global-period-group,
.global-trade-group,
.global-route-group {
    display: grid;
    gap: 10px;
}

.global-period-group label,
.global-trade-group label,
.global-route-group label,
.global-section>label {
    display: block;
    margin: 0;
    color: var(--heritage-filter-label-color);
    font-family: "Epilogue", "Greycliff CF", Arial, sans-serif;
    font-size: 14px;
    font-weight: 700;
    line-height: 1.15;
}

.global-trade-group label {
    display: flex;
    align-items: center;
}

.global-mode-toggle {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    margin-top: 0;
}

.global-mode-toggle button,
.global-periods button {
    min-height: 40px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    padding: 5px 6px;
    border: 1px solid var(--heritage-chip-border);
    border-radius: 8px;
    color: var(--text-strong);
    background: var(--heritage-chip-background);
    font-family: inherit;
    font-size: 14px;
    font-weight: 700;
    line-height: 1.15;
    box-shadow: none;
}

.global-mode-toggle button.active {
    color: var(--sand);
    border-color: var(--heritage-chip-active-border);
    background: var(--heritage-chip-active-background);
}

.global-periods {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    margin-top: 0;
}

.global-mode-toggle button img,
.global-periods button img {
    width: 20px;
    height: 20px;
    object-fit: contain;
    filter: sepia(.25) saturate(.82) opacity(.88);
}

.global-periods button.active {
    color: var(--sand);
    background: var(--heritage-chip-active-background);
    border-color: var(--heritage-chip-active-border);
}

.global-mode-toggle button.active img,
.global-periods button.active img {
    filter: brightness(0) invert(1) sepia(.18) saturate(1.2) opacity(.95);
}

.trade-toggle-list {
    display: grid;
    grid-auto-rows: 44px;
    height: 220px;
    margin-top: 0;
    border: 1px solid rgba(96, 108, 56, .14);
    border-radius: 8px;
    overflow: hidden;
    background: rgba(232, 220, 199, .22);
}

.trade-toggle {
    min-height: 0;
    height: 44px;
    display: grid;
    grid-template-columns: 34px 1fr auto;
    align-items: center;
    gap: 12px;
    padding: 0 10px;
    border-bottom: 1px solid rgba(96, 108, 56, .13);
}

.trade-toggle:last-child {
    border-bottom: 0;
}

.trade-icon {
    width: 22px;
    height: 22px;
    display: block;
    object-fit: contain;
}

.trade-toggle b {
    color: var(--text-strong);
    font-size: 14px;
    font-weight: 700;
}

.trade-switch {
    position: relative;
    width: 44px;
    height: 24px;
    border: 0;
    border-radius: 999px;
    background: rgba(96, 108, 56, .38);
    box-shadow:
        inset 0 1px 3px rgba(0, 0, 0, .18),
        0 1px 0 rgba(255, 255, 255, .48);
    transition: background var(--ease), box-shadow var(--ease);
}

.trade-switch span {
    position: absolute;
    top: 3px;
    left: 3px;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: #f4ead6;
    box-shadow: 0 2px 5px rgba(80, 55, 26, .28);
    transition: transform var(--ease);
}

.trade-toggle.active .trade-switch span {
    transform: translateX(20px);
}

.trade-toggle.active .trade-switch {
    background: var(--trade-color, var(--heritage-action));
    box-shadow:
        inset 0 1px 3px rgba(39, 35, 24, .24),
        0 0 0 2px color-mix(in srgb, var(--trade-color, var(--heritage-action)) 19%, transparent),
        0 4px 12px color-mix(in srgb, var(--trade-color, var(--heritage-action)) 29%, transparent);
}

.trade-switch:focus-visible {
    outline: 2px solid rgba(17, 62, 58, .66);
    outline-offset: 3px;
}

.panel {
    padding: 18px;
    min-width: 0;
}

.stack {
    display: grid;
    gap: 14px;
}

.toolbar {
    display: flex;
    gap: 10px;
    align-items: center;
    flex-wrap: wrap;
}

.toolbar.dark {
    position: absolute;
    left: 18px;
    top: 18px;
    z-index: 5;
}

.travel-mode-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

.travel-mode-grid button {
    min-height: 46px;
    border: 1px solid rgba(96, 108, 56, .22);
    border-radius: 8px;
    color: var(--text-strong);
    background: rgba(232, 220, 199, .58);
    font-weight: 800;
}

.travel-mode-grid button.active {
    border-color: #c66b3d;
    color: #fff8df;
    background: #c66b3d;
}

.travel-plan {
    padding: 14px;
    border: 1px solid rgba(96, 108, 56, .18);
    border-radius: 8px;
    background: rgba(212, 184, 149, .22);
}

.travel-plan h4 {
    margin: 0 0 8px;
}

.travel-plan ol {
    margin: 0;
    padding-left: 22px;
    color: rgba(46, 52, 34, .84);
    line-height: 1.7;
}

/* Smart travel: a dense Swiss-style operational map workspace. */
.travel-workbench {
    --travel-ink: #172219;
    --travel-muted: #64706a;
    --travel-rule: #d6d9d4;
    --travel-panel: #ffffff;
    --travel-accent: #e4002b;
    height: calc(100vh - 86px);
    min-height: 680px;
    display: grid;
    grid-template-columns: 254px minmax(0, 1fr) 324px;
    grid-template-rows: 76px minmax(0, 1fr) 38px;
    overflow: hidden;
    color: var(--travel-ink);
    background: #f7f7f8;
    font-family: "Helvetica Neue", Arial, "Noto Sans SC", sans-serif;
}

.travel-taskbar {
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: minmax(220px, 1fr) minmax(260px, 360px) 250px auto;
    align-items: stretch;
    border-bottom: 1px solid var(--travel-rule);
    background: var(--travel-panel);
}

.travel-heading,
.travel-task-field,
.travel-mode-switch,
.travel-primary {
    min-width: 0;
    border-left: 1px solid var(--travel-rule);
}

.travel-heading {
    border-left: 0;
    padding: 13px 22px;
    display: flex;
    align-items: baseline;
    gap: 13px;
}

.travel-heading h2 {
    margin: 0;
    color: var(--travel-ink);
    font-size: 24px;
    line-height: 1;
}

.travel-heading span,
.travel-map-title span,
.travel-statusbar {
    color: var(--travel-muted);
    font-size: 12px;
}

.travel-task-field {
    display: grid;
    grid-template-columns: 62px minmax(0, 1fr);
    align-items: center;
    gap: 6px;
    padding: 0 14px;
    color: var(--travel-muted);
    font-size: 13px;
}

.travel-task-field select {
    min-width: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    color: var(--travel-ink);
    font-size: 14px;
    font-weight: 700;
}

.travel-mode-switch {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
}

.travel-mode-switch button,
.travel-result-tabs button {
    border: 0;
    border-radius: 0;
    color: var(--travel-muted);
    background: #fff;
    font-size: 13px;
    font-weight: 700;
}

.travel-mode-switch button + button {
    border-left: 1px solid var(--travel-rule);
}

.travel-mode-switch button.active,
.travel-result-tabs button.active {
    color: var(--travel-accent);
    box-shadow: inset 0 -3px 0 var(--travel-accent);
}

.travel-primary {
    min-width: 112px;
    border-top: 0;
    border-right: 0;
    border-bottom: 0;
    border-radius: 0;
    color: #fff;
    background: var(--travel-accent);
    font-size: 14px;
    font-weight: 800;
}

.travel-control-panel,
.travel-results-panel {
    min-height: 0;
    overflow: auto;
    background: var(--travel-panel);
}

.travel-control-panel {
    grid-column: 1;
    grid-row: 2;
    border-right: 1px solid var(--travel-rule);
}

.travel-control-section,
.travel-ai-section {
    padding: 18px 16px;
    border-bottom: 1px solid var(--travel-rule);
}

.travel-control-section h3,
.travel-ai-section h3,
.travel-plan-overview h3,
.travel-route-summary h3,
.travel-destination-detail h3 {
    margin: 0 0 13px;
    color: var(--travel-ink);
    font-size: 15px;
}

.travel-service-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    border-top: 1px solid var(--travel-rule);
    border-left: 1px solid var(--travel-rule);
}

.travel-service-grid button,
.travel-action-stack button {
    min-height: 42px;
    border: 0;
    border-right: 1px solid var(--travel-rule);
    border-bottom: 1px solid var(--travel-rule);
    border-radius: 0;
    color: var(--travel-ink);
    background: #fff;
    font-size: 13px;
    font-weight: 700;
}

.travel-service-grid button:hover,
.travel-service-grid button.active,
.travel-action-stack button:hover {
    color: var(--travel-accent);
    background: #fff4f5;
}

.travel-action-stack { display: grid; }
.travel-action-stack button { text-align: left; padding: 0 12px; }

.travel-ai-section { background: #f7f7f8; }
.travel-ai-section form { display: grid; gap: 8px; }
.travel-ai-section textarea {
    width: 100%;
    resize: vertical;
    border: 1px solid var(--travel-rule);
    border-radius: 0;
    padding: 10px;
    color: var(--travel-ink);
    background: #fff;
    font: inherit;
    font-size: 13px;
    line-height: 1.55;
}
.travel-ai-section form button {
    min-height: 36px;
    border: 1px solid var(--travel-ink);
    border-radius: 0;
    color: #fff;
    background: var(--travel-ink);
    font-size: 13px;
    font-weight: 700;
}
.travel-ai-reply { margin: 12px 0 0; color: var(--travel-muted); font-size: 13px; line-height: 1.6; }

.travel-map-stage { position: relative; min-width: 0; min-height: 0; background: #edf0ed; }
.travel-amap { position: absolute; inset: 0; }
.travel-map-fallback { height: 100%; display: grid; place-content: center; padding: 24px; color: var(--travel-muted); text-align: center; line-height: 1.7; }
.travel-map-title { position: absolute; left: 18px; top: 16px; z-index: 2; display: grid; gap: 2px; padding: 10px 12px; border-left: 3px solid var(--travel-accent); background: rgba(255,255,255,.94); box-shadow: 0 2px 12px rgba(0,0,0,.09); pointer-events: none; }
.travel-map-title b { font-size: 15px; }
.travel-map-legend { position: absolute; right: 14px; bottom: 18px; z-index: 2; display: flex; gap: 10px; padding: 8px 10px; background: rgba(255,255,255,.94); color: var(--travel-muted); font-size: 11px; pointer-events: none; }
.travel-map-legend span::before { content: ""; display: inline-block; width: 7px; height: 7px; margin-right: 5px; background: #2d7bdc; border-radius: 50%; }
.travel-map-legend .route::before { width: 14px; height: 3px; border-radius: 0; background: var(--travel-accent); vertical-align: middle; }
.travel-map-legend .poi::before { background: #d38a00; }

.travel-results-panel { grid-column: 3; grid-row: 2; border-left: 1px solid var(--travel-rule); }
.travel-result-tabs { display: grid; grid-template-columns: repeat(4, 1fr); height: 52px; border-bottom: 1px solid var(--travel-rule); }
.travel-result-tabs button + button { border-left: 1px solid var(--travel-rule); }
.travel-result-content { padding: 20px; }
.travel-result-content p { margin: 0; color: var(--travel-muted); font-size: 14px; line-height: 1.75; }
.travel-empty { padding: 42px 4px; text-align: center; }
.travel-plan-checklist { display: grid; gap: 0; margin: 20px 0; border-top: 1px solid var(--travel-rule); }
.travel-plan-checklist span { padding: 11px 0; border-bottom: 1px solid var(--travel-rule); font-size: 13px; font-weight: 700; }
.travel-weather-card { display: grid; grid-template-columns: 1fr auto; gap: 4px 12px; padding: 14px 0; border-top: 3px solid var(--travel-accent); }
.travel-weather-card span { color: var(--travel-muted); font-size: 13px; }
.travel-weather-card strong { grid-row: span 2; align-self: center; font-size: 22px; }
.travel-list { display: grid; gap: 0; border-top: 1px solid var(--travel-rule); }
.travel-poi-row { display: grid; grid-template-columns: 90px minmax(0, 1fr); align-items: center; gap: 12px; min-height: 86px; padding: 9px 0; border: 0; border-bottom: 1px solid var(--travel-rule); border-radius: 0; background: #fff; text-align: left; }
.travel-poi-row:hover { color: var(--travel-accent); }
.travel-poi-media { width: 90px; height: 66px; display: grid; place-items: center; overflow: hidden; border: 1px solid rgba(176, 139, 110, .34); border-radius: 6px; background: rgba(139, 157, 131, .16); }
.travel-poi-media img { width: 100%; height: 100%; object-fit: cover; display: block; }
.travel-poi-media.is-empty { color: var(--heritage-muted); background: linear-gradient(135deg, rgba(139, 157, 131, .28), rgba(212, 184, 149, .38)); font-size: 12px; font-weight: 800; text-align: center; }
.travel-poi-media.is-empty > span { padding: 6px; color: inherit; font-size: inherit; line-height: 1.3; }
.travel-poi-copy { min-width: 0; display: grid; gap: 4px; }
.travel-poi-row b { overflow: hidden; color: var(--travel-ink); font-size: 14px; text-overflow: ellipsis; white-space: nowrap; }
.travel-poi-copy > span { overflow: hidden; color: var(--travel-muted); font-size: 12px; line-height: 1.4; text-overflow: ellipsis; white-space: nowrap; }
.travel-poi-row small { color: var(--travel-accent); font-size: 11px; }
.travel-route-summary ol { margin: 16px 0 0; padding-left: 20px; color: var(--travel-muted); font-size: 13px; line-height: 1.7; }
.travel-destination-detail dl { margin: 0 0 16px; border-top: 1px solid var(--travel-rule); }
.travel-destination-detail dl div { display: grid; grid-template-columns: 76px minmax(0, 1fr); gap: 10px; padding: 10px 0; border-bottom: 1px solid var(--travel-rule); font-size: 13px; }
.travel-destination-detail dt { color: var(--travel-muted); }
.travel-destination-detail dd { margin: 0; font-weight: 700; }

.travel-statusbar { grid-column: 1 / -1; grid-row: 3; display: flex; align-items: center; gap: 22px; padding: 0 18px; overflow: hidden; border-top: 1px solid var(--travel-rule); background: #fff; white-space: nowrap; }
.travel-statusbar span:last-child { margin-left: auto; overflow: hidden; text-overflow: ellipsis; }
.travel-statusbar b { color: var(--travel-ink); }

@media (max-width: 980px) {
    .travel-workbench {
        height: auto;
        min-height: calc(100vh - 86px);
        grid-template-columns: minmax(220px, 36%) minmax(0, 1fr);
        grid-template-rows: auto minmax(480px, 62vh) auto auto;
        overflow: visible;
    }
    .travel-taskbar { grid-template-columns: 1fr 1fr; }
    .travel-heading { grid-column: 1 / -1; border-bottom: 1px solid var(--travel-rule); }
    .travel-task-field { border-left: 0; }
    .travel-mode-switch { border-left: 1px solid var(--travel-rule); }
    .travel-primary { grid-column: 1 / -1; min-height: 42px; border-left: 0; }
    .travel-control-panel { grid-row: 2; }
    .travel-map-stage { grid-column: 2; grid-row: 2; }
    .travel-results-panel { grid-column: 1 / -1; grid-row: 3; min-height: 300px; border-top: 1px solid var(--travel-rule); border-left: 0; }
    .travel-statusbar { grid-row: 4; }
}

@media (max-width: 640px) {
    .travel-workbench { display: block; }
    .travel-taskbar { display: grid; }
    .travel-heading { align-items: flex-start; flex-direction: column; gap: 5px; }
    .travel-task-field { min-height: 58px; }
    .travel-mode-switch { min-height: 58px; }
    .travel-control-panel, .travel-results-panel { overflow: visible; }
    .travel-map-stage { height: 440px; }
    .travel-statusbar { min-height: 38px; overflow-x: auto; gap: 16px; }
    .travel-statusbar span:last-child { margin-left: 0; }
}

/* Travel page visual alignment: inherit the global cognition / heritage atlas map-and-paper language. */
.travel-workbench {
    --travel-ink: var(--heritage-ink);
    --travel-copy: var(--heritage-copy);
    --travel-muted: var(--heritage-muted);
    --travel-rule: rgba(176, 139, 110, .42);
    --travel-paper: rgba(232, 220, 199, .92);
    --travel-accent: var(--heritage-action);
    position: relative;
    height: calc(100dvh - 86px);
    min-height: 0;
    display: block;
    overflow: hidden;
    isolation: isolate;
    background: #22351f;
    font-family: "Noto Serif SC", "Songti SC", "Source Han Serif SC", "Adobe Caslon Pro", "Libre Caslon Text", serif;
}

.travel-map-stage {
    position: absolute;
    inset: 0;
    z-index: 0;
    background: #22351f;
}

.travel-map-stage::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    pointer-events: none;
    background:
        linear-gradient(90deg, rgba(7, 27, 31, .30), transparent 30%, transparent 70%, rgba(7, 27, 31, .34)),
        linear-gradient(180deg, rgba(4, 17, 20, .12), transparent 30%, rgba(3, 13, 12, .16));
}

.travel-amap { z-index: 0; }

.travel-taskbar,
.travel-control-panel,
.travel-results-panel,
.travel-statusbar {
    z-index: 3;
    border: 1px solid rgba(212, 184, 149, .78);
    color: var(--travel-copy);
    background:
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence baseFrequency='.86' numOctaves='2'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)' opacity='.04'/%3E%3C/svg%3E"),
        linear-gradient(180deg, rgba(232, 220, 199, .92), rgba(232, 220, 199, .975));
    box-shadow: 0 20px 56px rgba(5, 18, 17, .30);
    backdrop-filter: blur(8px);
}

.travel-taskbar {
    position: absolute;
    left: 18px;
    top: 18px;
    right: 18px;
    height: 70px;
    display: grid;
    grid-template-columns: minmax(200px, .72fr) minmax(460px, 1.55fr) 220px 100px;
    overflow: hidden;
    border-radius: 12px;
}

.travel-heading,
.travel-endpoints,
.travel-mode-switch,
.travel-primary { border-left-color: rgba(176, 139, 110, .34); }

.travel-heading {
    padding: 11px 18px;
    gap: 12px;
    align-items: center;
}

.travel-heading h2 {
    color: var(--heritage-ink);
    font-size: 25px;
    font-weight: 900;
}

.travel-heading span,
.travel-map-title span,
.travel-statusbar { color: var(--heritage-muted); font-family: "Epilogue", "Greycliff CF", Arial, sans-serif; }

.travel-endpoints {
    min-width: 0;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 18px minmax(0, 1fr);
    gap: 8px;
    align-items: center;
    padding: 8px 12px;
    font-family: "Epilogue", "Greycliff CF", Arial, sans-serif;
}
.travel-endpoint { min-width: 0; display: grid; grid-template-columns: 30px minmax(0, 1fr) auto; align-items: center; gap: 5px; }
.travel-endpoint > span { color: var(--heritage-muted); font-size: 12px; font-weight: 800; }
.travel-endpoint input { min-width: 0; height: 36px; padding: 0 7px; border: 1px solid rgba(176, 139, 110, .40); border-radius: 6px; color: var(--heritage-copy); background: rgba(232, 220, 199, .60); font-family: inherit; font-size: 13px; font-weight: 700; }
.travel-endpoint input:focus { outline: 0; border-color: var(--heritage-action); box-shadow: 0 0 0 2px rgba(24, 78, 70, .14); }
.travel-endpoint-actions { display: flex; gap: 3px; }
.travel-endpoint-actions button { height: 36px; padding: 0 7px; border: 1px solid rgba(176, 139, 110, .38); border-radius: 6px; color: var(--heritage-muted); background: rgba(232, 220, 199, .45); font-family: inherit; font-size: 11px; font-weight: 800; }
.travel-endpoint-actions button:hover { color: var(--sand); border-color: var(--heritage-action-border); background: var(--heritage-action); }
.travel-endpoint-arrow { color: var(--terracotta); font-size: 17px; font-weight: 900; text-align: center; }
.travel-mode-switch button,
.travel-result-tabs button { color: var(--heritage-muted); background: transparent; font-family: inherit; }
.travel-mode-switch button + button,
.travel-result-tabs button + button { border-left-color: rgba(176, 139, 110, .32); }
.travel-mode-switch button.active,
.travel-result-tabs button.active { color: var(--heritage-action); box-shadow: inset 0 -3px 0 var(--heritage-action); }

.travel-primary {
    color: var(--sand);
    border: 1px solid var(--heritage-action-border);
    border-radius: 0;
    background: linear-gradient(180deg, var(--heritage-action), var(--heritage-action-deep));
    font-family: inherit;
}

.travel-control-panel,
.travel-results-panel {
    position: absolute;
    top: 106px;
    bottom: 58px;
    height: auto;
    overflow: auto;
    border-radius: 12px;
}

.travel-control-panel { left: 18px; width: 296px; border-right: 1px solid rgba(212, 184, 149, .78); }
.travel-results-panel { right: 18px; width: 370px; border-left: 1px solid rgba(212, 184, 149, .78); }

.travel-control-section,
.travel-ai-section { padding: 18px; border-bottom-color: rgba(96, 108, 56, .18); }
.travel-control-section h3,
.travel-ai-section h3,
.travel-plan-overview h3,
.travel-route-summary h3,
.travel-destination-detail h3 { color: var(--heritage-ink); font-size: 17px; font-weight: 900; }

.travel-service-grid {
    border-color: rgba(176, 139, 110, .32);
    border-radius: 8px;
    overflow: hidden;
    background: rgba(232, 220, 199, .38);
}

.travel-service-tabs { display: flex; gap: 0; margin: 0 0 12px; overflow-x: auto; border-bottom: 1px solid rgba(176, 139, 110, .30); }
.travel-service-tabs button { flex: 0 0 auto; min-height: 32px; padding: 0 8px; border: 0; border-radius: 0; color: var(--heritage-muted); background: transparent; font-family: inherit; font-size: 12px; font-weight: 800; }
.travel-service-tabs button.active { color: var(--heritage-action); box-shadow: inset 0 -2px 0 var(--heritage-action); }
.travel-service-submit { width: 100%; min-height: 38px; margin-top: 12px; border: 1px solid var(--heritage-action-border); border-radius: 7px; color: var(--sand); background: linear-gradient(180deg, var(--heritage-action), var(--heritage-action-deep)); font-family: inherit; font-size: 13px; font-weight: 800; }
.travel-service-submit:disabled { cursor: not-allowed; border-color: rgba(176, 139, 110, .34); color: rgba(76, 86, 45, .62); background: rgba(139, 157, 131, .14); }

.travel-service-grid button,
.travel-action-stack button {
    border-right-color: rgba(176, 139, 110, .28);
    border-bottom-color: rgba(176, 139, 110, .28);
    color: var(--heritage-copy);
    background: rgba(232, 220, 199, .30);
    font-family: inherit;
}

.travel-service-grid button:hover,
.travel-service-grid button.active,
.travel-action-stack button:hover { color: var(--sand); background: linear-gradient(180deg, var(--heritage-action), var(--heritage-action-deep)); }
.travel-ai-section { background: rgba(139, 157, 131, .10); }
.travel-ai-section textarea { border-color: rgba(176, 139, 110, .42); border-radius: 8px; color: var(--heritage-copy); background: rgba(232, 220, 199, .72); font-family: inherit; }
.travel-ai-section form button { border-color: var(--heritage-action-border); border-radius: 8px; background: linear-gradient(180deg, var(--heritage-action), var(--heritage-action-deep)); font-family: inherit; }
.travel-ai-reply { color: var(--heritage-muted); }

.travel-map-title {
    z-index: 2;
    left: 332px;
    top: 108px;
    border-left-color: var(--terracotta);
    color: var(--heritage-copy);
    background: rgba(232, 220, 199, .90);
    box-shadow: 0 12px 26px rgba(5, 18, 17, .22);
}
.travel-map-picker { position: absolute; z-index: 2; left: 332px; top: 174px; min-height: 34px; padding: 0 11px; border: 1px solid rgba(212, 184, 149, .72); border-radius: 7px; color: #f1dfb9; background: rgba(14, 64, 58, .92); box-shadow: 0 10px 22px rgba(5, 18, 17, .20); font-family: inherit; font-size: 13px; font-weight: 800; }
.travel-map-picker:hover { background: var(--heritage-action); }
.travel-map-title b { font-size: 16px; }
.travel-map-legend { z-index: 2; right: 404px; bottom: 64px; border: 1px solid rgba(212, 184, 149, .48); color: var(--heritage-muted); background: rgba(232, 220, 199, .90); box-shadow: 0 10px 24px rgba(5, 18, 17, .16); font-family: "Epilogue", "Greycliff CF", Arial, sans-serif; }
.travel-map-legend span::before { background: var(--heritage-action); }
.travel-map-legend .route::before { background: var(--terracotta); }
.travel-map-legend .poi::before { background: var(--ochre); }

.travel-results-panel { background: linear-gradient(180deg, rgba(232, 220, 199, .96), rgba(232, 220, 199, .985)); }
.travel-result-tabs { grid-template-columns: repeat(3, 1fr); height: 54px; border-bottom-color: rgba(176, 139, 110, .34); }
.travel-result-content { padding: 20px; }
.travel-result-content p { color: var(--heritage-copy); }
.travel-plan-checklist { border-top-color: rgba(96, 108, 56, .2); }
.travel-plan-checklist span { border-bottom-color: rgba(96, 108, 56, .18); color: var(--heritage-copy); }
.travel-weather-card { border-top-color: var(--terracotta); }
.travel-ai-summary { margin: 12px 0 0 !important; padding: 10px 12px; border-left: 3px solid var(--heritage-action); background: rgba(139, 157, 131, .12); }
.travel-quick-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin: 18px 0; }
.travel-quick-actions button { min-height: 38px; border: 1px solid rgba(176, 139, 110, .45); border-radius: 7px; color: var(--heritage-copy); background: rgba(232, 220, 199, .52); font-family: inherit; font-size: 13px; font-weight: 800; }
.travel-quick-actions button:first-child { color: var(--sand); border-color: var(--heritage-action-border); background: linear-gradient(180deg, var(--heritage-action), var(--heritage-action-deep)); }
.travel-weather-card span,.travel-destination-detail dt,.travel-poi-copy > span,.travel-route-summary ol { color: var(--heritage-muted); }
.travel-weather-card strong,.travel-poi-row small { color: var(--terracotta); }
.travel-list,.travel-destination-detail dl { border-top-color: rgba(96, 108, 56, .20); }
.travel-poi-row,.travel-destination-detail dl div { border-bottom-color: rgba(96, 108, 56, .18); background: transparent; }
.travel-poi-row b,.travel-destination-detail dd { color: var(--heritage-copy); }
.travel-poi-row:hover { background: rgba(139, 157, 131, .12); color: var(--heritage-action); }

.travel-statusbar {
    position: absolute;
    left: 18px;
    right: 18px;
    bottom: 14px;
    height: 30px;
    min-height: 30px;
    padding: 0 14px;
    border-radius: 8px;
    background: rgba(232, 220, 199, .91);
    box-shadow: 0 10px 25px rgba(5, 18, 17, .18);
}
.travel-statusbar b { color: var(--heritage-copy); }

@media (max-width: 980px) {
    .travel-workbench { height: auto; min-height: calc(100dvh - 86px); overflow: visible; display: grid; grid-template-columns: minmax(240px, 36%) minmax(0, 1fr); grid-template-rows: auto 560px auto 44px; padding: 12px; gap: 12px; background: var(--sand); }
    .travel-map-stage { position: relative; grid-column: 2; grid-row: 2; inset: auto; min-height: 0; border-radius: 12px; overflow: hidden; }
    .travel-taskbar { position: relative; grid-column: 1 / -1; grid-row: 1; inset: auto; width: auto; height: auto; min-height: 70px; }
    .travel-control-panel,.travel-results-panel { position: relative; inset: auto; width: auto; height: auto; bottom: auto; border-radius: 12px; }
    .travel-control-panel { grid-column: 1; grid-row: 2; }
    .travel-results-panel { grid-column: 1 / -1; grid-row: 3; min-height: 300px; }
    .travel-statusbar { position: relative; grid-column: 1 / -1; grid-row: 4; inset: auto; width: auto; }
    .travel-map-title { left: 14px; top: 14px; }
    .travel-map-picker { left: 14px; top: 78px; }
    .travel-map-legend { right: 14px; bottom: 14px; }
}

@media (max-width: 640px) {
    .travel-taskbar { grid-template-columns: 1fr; }
    .travel-heading { min-height: 58px; border-bottom: 1px solid rgba(176, 139, 110, .34); }
    .travel-endpoints { min-height: 104px; border-bottom: 1px solid rgba(176, 139, 110, .34); }
    .travel-mode-switch { min-height: 46px; }
    .travel-primary { min-height: 44px; }
    .travel-endpoint { grid-template-columns: 26px minmax(0, 1fr) auto; }
}

.field {
    display: grid;
    gap: 7px;
}

.field label {
    color: rgba(96, 108, 56, .82);
    font-family: "Epilogue", "Greycliff CF", Arial, sans-serif;
    font-size: 13px;
}

.field input,
.field select,
.field textarea {
    min-height: 42px;
    width: 100%;
    padding: 10px 12px;
    border: 1px solid var(--border);
    border-radius: 16px;
    color: var(--text-strong);
    background: rgba(232, 220, 199, .74);
}

.field textarea {
    min-height: 98px;
    resize: vertical;
}

.map-card {
    position: relative;
    min-height: 540px;
    overflow: hidden;
    background:
        radial-gradient(circle at 24% 22%, rgba(139, 157, 131, .72), transparent 24rem),
        radial-gradient(circle at 68% 35%, rgba(192, 142, 58, .5), transparent 28rem),
        linear-gradient(145deg, var(--sage), var(--moss));
}

.map-card.compact {
    min-height: 430px;
}

.map-canvas {
    position: absolute;
    inset: 0;
    background:
        repeating-linear-gradient(24deg, rgba(232, 220, 199, .08) 0 1px, transparent 1px 18px),
        repeating-linear-gradient(112deg, rgba(96, 108, 56, .12) 0 1px, transparent 1px 22px);
}

.map-svg {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    z-index: 2;
}

.route-line {
    fill: none;
    stroke-width: 3.4;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.route-line.dim {
    opacity: .26;
}

.node-dot,
.heritage-dot {
    stroke: var(--sand);
    stroke-width: 2;
    cursor: pointer;
}

.node-dot {
    fill: var(--ochre);
}

.heritage-dot {
    fill: var(--terracotta);
}

.dot-active {
    stroke: var(--oat);
    stroke-width: 5;
}

.map-label {
    fill: var(--sand);
    font-size: 13px;
    font-weight: 700;
    paint-order: stroke;
    stroke: rgba(96, 108, 56, .78);
    stroke-width: 4px;
}

.map-side-tools {
    position: absolute;
    right: 18px;
    top: 80px;
    z-index: 5;
    display: grid;
    gap: 10px;
}

.icon-btn {
    min-width: 58px;
    background: rgba(232, 220, 199, .82);
}

.legend {
    position: absolute;
    left: 18px;
    bottom: 18px;
    z-index: 5;
    min-width: 180px;
    padding: 14px;
    color: var(--text-strong);
    background: rgba(232, 220, 199, .82);
    border: 1px solid var(--border);
    border-radius: 20px;
}

.legend div {
    display: flex;
    gap: 8px;
    align-items: center;
    margin-top: 7px;
}

.swatch {
    width: 26px;
    height: 5px;
    border-radius: 999px;
    background: var(--terracotta);
}

.detail-list {
    display: grid;
    gap: 12px;
}

.detail-row {
    display: grid;
    grid-template-columns: 90px 1fr;
    gap: 12px;
    padding-bottom: 10px;
    border-bottom: 1px solid rgba(96, 108, 56, .16);
}

.detail-row b {
    color: var(--text-strong);
}

table {
    width: 100%;
    border-collapse: collapse;
}

th,
td {
    padding: 12px 14px;
    border-bottom: 1px solid rgba(96, 108, 56, .16);
    text-align: left;
    vertical-align: top;
}

th {
    position: sticky;
    top: 0;
    z-index: 1;
    color: var(--sand);
    background: var(--moss);
}

tr.selected td {
    background: rgba(139, 157, 131, .18);
}

.metrics-grid {
    display: grid;
    grid-template-columns: repeat(5, minmax(140px, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}

.metric-card {
    padding: 16px;
    text-align: left;
}

.metric-card span {
    display: block;
    color: rgba(96, 108, 56, .76);
}

.metric-card b {
    display: block;
    margin-top: 8px;
    color: var(--text-strong);
    font-size: 30px;
}

.analysis-card.active {
    border-color: var(--terracotta);
    background-color: rgba(212, 184, 149, .72);
}

.analysis-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
}

.analysis-card {
    min-height: 154px;
    padding: 14px;
    text-align: left;
}

.analysis-card h4 {
    margin: 0 0 8px;
    color: var(--text-strong);
}

.analysis-card p {
    margin: 0;
    line-height: 1.5;
    color: rgba(96, 108, 56, .82);
}

.analysis-card.is-locked {
    opacity: .72;
    cursor: not-allowed;
}

.analysis-workspace {
    color: #465033;
    font-family: "FZKai-Z03", "STKaiti", "KaiTi", "Songti SC", serif;
}

.analysis-workspace {
    height: calc(100dvh - 86px);
    min-height: 0;
    overflow: hidden;
}

.analysis-workspace h3,
.analysis-workspace h4,
.analysis-workspace label,
.analysis-workspace th,
.analysis-workspace .result-box > b {
    color: #354126;
    font-weight: 900;
}

.analysis-workspace select,
.analysis-workspace input,
.analysis-workspace button {
    color: #3f482d;
    font-family: inherit;
    font-weight: 700;
}

.analysis-workspace .analysis-card p,
.analysis-workspace .muted,
.analysis-workspace .service-note,
.analysis-workspace .result-box p {
    color: #596143;
    font-weight: 600;
}

.analysis-workspace td:last-child,
.analysis-workspace .result-box h4,
.analysis-workspace .result-box small {
    color: #3b472b;
    font-weight: 800;
}

.analysis-results-panel {
    display: flex;
    flex-direction: column;
    min-height: 0;
    overflow: hidden;
}

.analysis-results-content {
    display: flex;
    flex: 1 1 auto;
    min-height: 0;
    flex-direction: column;
    overflow: auto;
    overflow-anchor: none;
    padding-right: 2px;
}

.analysis-empty-result {
    display: grid;
    flex: 1 1 420px;
    min-height: 360px;
    place-items: center;
    padding: 32px 20px;
    text-align: center;
}

.analysis-empty-result p {
    max-width: 310px;
    margin: 0;
    color: #4d5938;
    font-size: 17px;
    font-weight: 800;
    line-height: 1.9;
}

.analysis-exit-btn {
    width: 100%;
    min-height: 44px;
    margin-top: auto;
    border: 1px solid rgba(155, 91, 61, .48);
    border-radius: 8px;
    color: #f4ead2 !important;
    background: #9b5b3d;
    font-size: 15px;
    font-weight: 900;
}

.analysis-exit-btn:hover:not(:disabled) {
    background: #824a32;
}

.analysis-exit-btn:disabled {
    color: rgba(70, 80, 51, .46) !important;
    border-color: rgba(96, 108, 56, .2);
    background: rgba(139, 157, 131, .16);
    cursor: not-allowed;
}

.analysis-sidebar {
    display: flex;
    flex-direction: column;
    gap: 18px;
    min-height: 0;
    overflow: auto;
}

.analysis-control-block {
    padding: 12px;
    border: 1px solid rgba(120, 102, 58, .24);
    border-radius: 8px;
    background: rgba(232, 220, 199, .38);
    box-shadow: inset 0 1px 0 rgba(255, 245, 220, .38);
}

.analysis-scope-toggle,
.analysis-period-pills {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.analysis-scope-toggle button,
.analysis-period-pills button {
    min-height: 36px;
    padding: 0 12px;
    border: 1px solid rgba(96, 108, 56, .2);
    border-radius: 6px;
    color: var(--text-strong);
    background: rgba(232, 220, 199, .58);
}

.analysis-scope-toggle button.active,
.analysis-period-pills button.active {
    border-color: var(--terracotta);
    color: #fff5df;
    background: var(--terracotta);
}

.analysis-check-grid {
    display: grid;
    gap: 7px;
}

.analysis-check-item {
    display: flex;
    align-items: center;
    gap: 8px;
    color: #4c5737;
    font-size: 13px;
    font-weight: 800;
}

.analysis-check-item input {
    margin: 0;
    accent-color: #b48635;
}

.analysis-caravan-art {
    position: relative;
    width: 168px;
    min-width: 168px;
    flex: 0 0 96px;
    min-height: 96px;
    align-self: flex-start;
    margin-top: 4px;
    margin-left: -2px;
    overflow: hidden;
    border: 0;
    border-radius: 0;
    background: url("assets/pages/analysis/tea-horse-caravan-panel.webp") left 62% / 180px auto no-repeat;
    box-shadow: none;
    opacity: .46;
    filter: sepia(.22) saturate(.62) contrast(.82);
    mix-blend-mode: multiply;
    -webkit-mask-image: radial-gradient(ellipse 94% 88% at 38% 54%, #000 28%, rgba(0, 0, 0, .72) 56%, transparent 100%);
    mask-image: radial-gradient(ellipse 94% 88% at 38% 54%, #000 28%, rgba(0, 0, 0, .72) 56%, transparent 100%);
}

.analysis-caravan-art::after {
    content: none;
}

.analysis-radius-presets {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
}

.analysis-radius-presets button {
    min-height: 40px;
    border: 1px solid rgba(96, 108, 56, .2);
    border-radius: 6px;
    color: var(--text-strong);
    background: rgba(232, 220, 199, .58);
}

.analysis-radius-presets button.active {
    border-color: var(--terracotta);
    color: #fff5df;
    background: var(--terracotta);
}

.analysis-radius-input {
    position: relative;
    margin-top: 8px;
}

.analysis-radius-input input {
    width: 100%;
    padding-right: 46px;
}

.analysis-radius-input span {
    position: absolute;
    right: 14px;
    top: 50%;
    color: rgba(96, 108, 56, .72);
    font-size: 12px;
    transform: translateY(-50%);
    pointer-events: none;
}

.density-analysis-workspace,
.buffer-analysis-workspace,
.elevation-analysis-workspace {
    grid-template-columns: 320px minmax(0, 1fr) 410px;
}

.density-analysis-workspace.analysis-workspace,
.buffer-analysis-workspace.analysis-workspace,
.elevation-analysis-workspace.analysis-workspace {
    gap: 16px;
    padding: 16px;
}

.elevation-analysis-workspace .analysis-sidebar {
    gap: 10px;
    padding: 18px 14px;
}

.elevation-analysis-workspace .analysis-sidebar > h3,
.elevation-analysis-workspace .analysis-results-panel > h3 { margin-bottom: 4px; }
.elevation-analysis-workspace .analysis-caravan-art { display: none; }
.elevation-analysis-workspace [data-run-analysis] { min-height: 40px; }

.density-analysis-workspace .analysis-sidebar,
.buffer-analysis-workspace .analysis-sidebar {
    gap: 10px;
    padding: 18px 14px;
}

.density-analysis-workspace .analysis-sidebar > h3,
.density-analysis-workspace .analysis-results-panel > h3,
.buffer-analysis-workspace .analysis-sidebar > h3,
.buffer-analysis-workspace .analysis-results-panel > h3 {
    margin-bottom: 4px;
}

.density-analysis-workspace .analysis-control-block,
.buffer-analysis-workspace .analysis-control-block {
    padding: 9px 10px;
}

.density-analysis-workspace .analysis-control-block > label,
.buffer-analysis-workspace .analysis-control-block > label {
    display: block;
    margin-bottom: 7px;
    font-size: 13px;
}

.density-analysis-workspace .analysis-radius-presets {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 6px;
}

.density-analysis-workspace .analysis-radius-presets button {
    min-height: 40px;
    padding: 7px 4px;
}

.density-analysis-workspace .analysis-caravan-art {
    display: none;
}

.density-analysis-workspace [data-run-analysis],
.buffer-analysis-workspace [data-run-analysis] {
    min-height: 40px;
}

.analysis-error {
    padding: 10px 12px;
    border: 1px solid rgba(190, 75, 59, .35);
    border-radius: 10px;
    color: #9b3d31;
    background: rgba(190, 75, 59, .1);
    line-height: 1.5;
}

.analysis-warnings {
    margin-top: 14px;
    padding: 12px;
    border-left: 3px solid #c08e3a;
    color: #6b542d;
    background: rgba(192, 142, 58, .1);
}

.analysis-warnings p { margin: 5px 0 0; line-height: 1.5; }

.analysis-scene-card {
    min-height: 790px;
    background: #183a34;
    isolation: isolate;
}

.density-analysis-workspace .analysis-scene-card,
.buffer-analysis-workspace .analysis-scene-card,
.elevation-analysis-workspace .analysis-scene-card {
    height: 100%;
    min-height: 0;
}

.density-analysis-workspace .analysis-methods-panel,
.buffer-analysis-workspace .analysis-methods-panel,
.elevation-analysis-workspace .analysis-methods-panel {
    padding: 14px;
}

.density-analysis-workspace .analysis-grid,
.buffer-analysis-workspace .analysis-grid,
.elevation-analysis-workspace .analysis-grid {
    gap: 10px;
}

.density-analysis-workspace .analysis-card,
.buffer-analysis-workspace .analysis-card,
.elevation-analysis-workspace .analysis-card {
    min-height: 112px;
    padding: 11px 12px;
}

.density-analysis-workspace .analysis-card h4,
.buffer-analysis-workspace .analysis-card h4,
.elevation-analysis-workspace .analysis-card h4 {
    margin-bottom: 5px;
    font-size: 15px;
}

.density-analysis-workspace .analysis-card p,
.buffer-analysis-workspace .analysis-card p,
.elevation-analysis-workspace .analysis-card p {
    font-size: 12px;
    line-height: 1.38;
}

.density-analysis-workspace .analysis-results-panel,
.buffer-analysis-workspace .analysis-results-panel,
.elevation-analysis-workspace .analysis-results-panel {
    padding: 18px 14px;
}

.density-analysis-workspace .analysis-results-content table td,
.density-analysis-workspace .analysis-results-content table th,
.buffer-analysis-workspace .analysis-results-content table td,
.buffer-analysis-workspace .analysis-results-content table th,
.elevation-analysis-workspace .analysis-results-content table td,
.elevation-analysis-workspace .analysis-results-content table th {
    padding: 9px 10px;
}

.density-analysis-workspace .result-box,
.buffer-analysis-workspace .result-box,
.elevation-analysis-workspace .result-box {
    padding: 12px;
    border-radius: 8px;
}

.density-analysis-workspace .result-box p,
.buffer-analysis-workspace .result-box p,
.elevation-analysis-workspace .result-box p {
    line-height: 1.55;
}

.density-analysis-workspace .analysis-empty-result,
.buffer-analysis-workspace .analysis-empty-result,
.elevation-analysis-workspace .analysis-empty-result {
    flex-basis: 220px;
    min-height: 220px;
    padding: 18px 14px;
}

.analysis-map-heading {
    position: absolute;
    left: 18px;
    top: 18px;
    z-index: 4;
    display: grid;
    gap: 2px;
    padding: 9px 12px;
    border-left: 3px solid #c66b3d;
    color: #183c41;
    background: rgba(247, 247, 248, .92);
    box-shadow: 0 8px 24px rgba(18, 28, 15, .16);
    backdrop-filter: blur(8px);
}

.analysis-map-heading span {
    color: #6b7455;
    font-size: 10px;
    font-weight: 800;
}

.analysis-map-heading strong {
    font-size: 15px;
}

.buffer-result-shell {
    display: grid;
    gap: 12px;
    padding-bottom: 12px;
}

.buffer-result-tabs,
.buffer-segmented {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    border: 1px solid rgba(53, 65, 38, .2);
    border-radius: 6px;
    overflow: hidden;
    background: #f7f7f8;
}

.buffer-result-tabs button,
.buffer-segmented button {
    min-width: 0;
    min-height: 39px;
    padding: 6px 4px;
    border: 0;
    border-right: 1px solid rgba(53, 65, 38, .16);
    border-radius: 0;
    background: transparent;
    color: #566045;
    font-size: 12px;
    line-height: 1.25;
}

.buffer-result-tabs button:last-child,
.buffer-segmented button:last-child { border-right: 0; }

.buffer-result-tabs button span {
    display: inline-grid;
    width: 17px;
    height: 17px;
    margin-right: 3px;
    place-items: center;
    border: 1px solid currentColor;
    border-radius: 50%;
    font-size: 9px;
}

.buffer-result-tabs button.active,
.buffer-segmented button.active {
    color: #fff;
    background: #354126;
}

.buffer-result-section { display: grid; gap: 14px; }

.buffer-result-block {
    padding-top: 16px;
    border-top: 2px solid rgba(96, 108, 56, .3);
}
.buffer-result-section > .buffer-result-block:first-child { padding-top: 10px; border-top: 0; }

.buffer-result-block > header,
.buffer-ai-panel > header,
.buffer-ai-panel > header > div {
    display: flex;
    align-items: center;
    gap: 8px;
}

.buffer-result-block > header { margin-bottom: 9px; }
.buffer-result-block > header > span,
.buffer-ai-panel > header > div > span {
    color: #c66b3d;
    font-family: "Helvetica Neue", Arial, sans-serif;
    font-size: 11px;
    font-weight: 800;
}

.buffer-result-block h5,
.buffer-ai-panel h5 {
    margin: 0;
    color: #354126;
    font-size: 14px;
}

.buffer-result-block header small {
    min-width: 0;
    overflow: hidden;
    margin-left: auto;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: #7b806b;
    font-size: 10px;
}

.buffer-metric-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1px;
    border: 1px solid rgba(53, 65, 38, .16);
    background: rgba(53, 65, 38, .16);
}

.buffer-metric-grid.two { grid-template-columns: repeat(2, minmax(0, 1fr)); }

.buffer-metric {
    min-width: 0;
    min-height: 68px;
    padding: 9px 10px;
    background: #f7f7f8;
}

.buffer-metric span,
.buffer-metric small {
    display: block;
    overflow-wrap: anywhere;
    color: #747b62;
    font-size: 10px;
    font-weight: 700;
}

.buffer-metric strong {
    display: block;
    margin: 4px 0 2px;
    overflow-wrap: anywhere;
    color: #354126;
    font-family: "Helvetica Neue", Arial, sans-serif;
    font-size: 18px;
}

.buffer-breakdown { margin-top: 9px; }
.buffer-segmented { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.buffer-segmented button { min-height: 32px; }

.buffer-breakdown-layout {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: center;
    gap: 14px;
    padding: 14px 2px 3px;
}

.buffer-breakdown-pie-wrap {
    display: grid;
    align-self: stretch;
    place-items: center;
    min-height: 170px;
}

.buffer-interactive-donut {
    position: relative;
    display: grid;
    width: min(170px, 92%);
    aspect-ratio: 1;
    place-items: center;
}

.buffer-interactive-donut svg {
    display: block;
    width: 100%;
    height: 100%;
    overflow: visible;
}

.buffer-donut-track {
    fill: none;
    stroke: rgba(96, 108, 56, .12);
    stroke-width: 34;
}

.buffer-donut-segment {
    cursor: pointer;
    transform-box: fill-box;
    transform-origin: center;
    transition: transform 380ms cubic-bezier(.2, .8, .2, 1), stroke-width 380ms cubic-bezier(.2, .8, .2, 1), opacity 300ms ease, filter 300ms ease;
}

.buffer-interactive-donut.has-active .buffer-donut-segment:not(.is-active) { opacity: .38; }
.buffer-donut-segment.is-active {
    stroke-width: 42;
    transform: scale(1.035);
    filter: drop-shadow(0 4px 5px rgba(53, 65, 38, .2));
}

.buffer-donut-segment:focus { outline: none; }
.buffer-donut-label {
    position: absolute;
    z-index: 2;
    width: 45%;
    opacity: 0;
    color: #163d26;
    font-size: 13px;
    font-weight: 900;
    line-height: 1.35;
    text-align: center;
    transform: scale(.9);
    transition: opacity 250ms ease, transform 380ms cubic-bezier(.2, .8, .2, 1);
}
.buffer-interactive-donut.has-active .buffer-donut-label { opacity: 1; transform: scale(1); }

.buffer-breakdown-chart {
    display: grid;
    gap: 7px;
    min-width: 0;
}

.buffer-breakdown-chart > div {
    display: grid;
    grid-template-columns: minmax(72px, .9fr) minmax(64px, 1.2fr) 22px;
    align-items: center;
    gap: 7px;
    border-radius: 4px;
    cursor: pointer;
    transition: background 300ms ease, transform 300ms ease;
}

.buffer-breakdown-chart > div:hover,
.buffer-breakdown-chart > div:focus,
.buffer-breakdown-chart > div.is-active { background: rgba(96, 108, 56, .08); transform: translateX(3px); outline: none; }

.buffer-breakdown-chart span {
    display: flex;
    align-items: center;
    gap: 6px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 11px;
    font-weight: 800;
}

.buffer-breakdown-chart span i {
    width: 8px;
    height: 8px;
    flex: 0 0 auto;
    border-radius: 2px;
    background: var(--buffer-series-color);
}

.buffer-breakdown-chart > div > em {
    height: 7px;
    overflow: hidden;
    background: rgba(53, 65, 38, .12);
    font-style: normal;
}

.buffer-breakdown-chart > div > em > b { display: block; height: 100%; background: var(--buffer-series-color); }
.buffer-breakdown-chart strong { color: #9b5b3d; font-size: 11px; text-align: right; }
.buffer-breakdown-chart p,
.buffer-list-empty { margin: 5px 0; color: #737a60; font-size: 12px; line-height: 1.5; }

.buffer-ranked-list,
.buffer-route-list,
.buffer-admin-list { display: grid; gap: 6px; }

.buffer-ranked-item,
.buffer-route-item,
.buffer-admin-item {
    width: 100%;
    min-width: 0;
    border: 1px solid rgba(53, 65, 38, .16);
    border-radius: 6px;
    color: #455038;
    background: #f7f7f8;
    text-align: left;
}

.buffer-ranked-item:hover,
.buffer-route-item:hover,
.buffer-admin-item:hover,
.buffer-ranked-item.active,
.buffer-route-item.active,
.buffer-admin-item.active {
    border-color: #c66b3d;
    background: rgba(198, 107, 61, .08);
}

.buffer-ranked-item {
    display: grid;
    grid-template-columns: 28px 52px minmax(0, 1fr) auto;
    gap: 8px;
    align-items: center;
    padding: 9px;
}

.buffer-ranked-media {
    width: 52px;
    height: 42px;
    overflow: hidden;
    display: grid;
    place-items: center;
    border-radius: 4px;
    color: #d8c39d;
    background: #163d26;
    font-size: 10px;
}
.buffer-ranked-media img,
.buffer-route-media img { width: 100%; height: 100%; object-fit: cover; display: block; }

.buffer-rank { color: #9b5b3d; font-family: "Helvetica Neue", Arial, sans-serif; font-size: 11px; }
.buffer-ranked-content { display: grid; min-width: 0; gap: 2px; }
.buffer-ranked-content strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: #2f3b25; font-size: 13px; }
.buffer-ranked-content span,
.buffer-ranked-content small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: #6f765e; font-size: 10px; }
.buffer-ranked-content small { color: #9b5b3d; }
.buffer-ranked-item > b { color: #354126; font-size: 11px; white-space: nowrap; }

.buffer-admin-item { display: grid; gap: 7px; padding: 10px; }
.buffer-route-item {
    display: grid;
    grid-template-columns: 112px minmax(0, 1fr) auto;
    align-items: center;
    gap: 12px;
    min-height: 89px;
    padding: 12px;
}
.buffer-route-item .buffer-route-media {
    width: 112px;
    height: 63px;
    min-height: 0;
    overflow: hidden;
    display: grid;
    place-items: center;
    border-radius: 6px;
    color: #d8c39d;
    background: #163d26;
    font-size: 10px;
}
.buffer-route-main {
    min-width: 0;
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: repeat(3, auto);
    align-content: center;
    gap: 5px;
}
.buffer-route-title,
.buffer-admin-title { display: flex; min-width: 0; align-items: center; gap: 7px; }
.buffer-route-color {
    width: 10px;
    height: 10px;
    flex: 0 0 10px;
    border: 1px solid rgba(23, 62, 56, .42);
    border-radius: 50%;
    background: var(--buffer-route-color);
}
.buffer-route-title strong,
.buffer-admin-title strong { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: #2f3b25; font-size: 13px; }
.buffer-admin-title > b { margin-left: auto; color: #9b5b3d; font-size: 11px; white-space: nowrap; }
.buffer-route-tags { display: flex; flex-wrap: wrap; gap: 4px; }
.buffer-route-tags i,
.buffer-admin-title em {
    padding: 2px 5px;
    border: 1px solid rgba(79, 127, 120, .22);
    border-radius: 3px;
    color: #4f6f68;
    background: rgba(79, 127, 120, .08);
    font-size: 9px;
    font-style: normal;
}

.buffer-admin-stats {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 5px 10px;
    color: #747b62;
    font-size: 10px;
}

.buffer-route-stats {
    display: flex;
    flex-wrap: wrap;
    gap: 4px 10px;
    color: #747b62;
    font-size: 10px;
}

.buffer-route-distance {
    align-self: center;
    color: #9b5b3d;
    font-size: 11px;
    white-space: nowrap;
}

.buffer-route-stats b,
.buffer-admin-stats b { color: #354126; }
.buffer-admin-title > i { width: 10px; height: 10px; flex: 0 0 auto; border-radius: 2px; }
.buffer-admin-overview-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1px;
    border: 1px solid rgba(53, 65, 38, .16);
    background: rgba(53, 65, 38, .16);
}
.buffer-admin-overview-grid .buffer-metric { border: 0; }
.buffer-admin-location { grid-column: 1 / -1; margin: 0; }
.buffer-admin-share {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: center;
    gap: 16px;
    margin-bottom: 10px;
    padding: 8px 0;
}
.buffer-admin-chart-visual {
    display: grid;
    align-self: stretch;
    min-height: 170px;
    place-items: center;
}
.buffer-admin-legend { display: grid; align-content: center; gap: 9px; min-width: 0; }
.buffer-admin-legend-item {
    display: flex;
    align-items: center;
    gap: 8px;
    width: 100%;
    padding: 4px 6px;
    border: 0;
    border-radius: 5px;
    color: #354126;
    background: transparent;
    font-size: 12px;
    font-weight: 800;
    text-align: left;
    transition: background 300ms ease, transform 300ms ease;
}
.buffer-admin-legend-item:hover,
.buffer-admin-legend-item:focus,
.buffer-admin-legend-item.is-active { outline: none; background: rgba(96, 108, 56, .08); transform: translateX(3px); }
.buffer-admin-legend-item i { width: 10px; height: 10px; flex: 0 0 auto; border-radius: 2px; }
.buffer-admin-legend-item span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

.buffer-ai-panel { display: grid; gap: 0; }
.buffer-ai-item ol { display: grid; gap: 9px; padding: 0; list-style: none; counter-reset: buffer-action; }
.buffer-ai-item li { display: grid; grid-template-columns: 24px minmax(0, 1fr); gap: 8px; align-items: start; counter-increment: buffer-action; }
.buffer-ai-item li::before {
    display: grid;
    width: 22px;
    height: 22px;
    place-items: center;
    border: 1px solid rgba(96, 108, 56, .34);
    border-radius: 50%;
    color: #9b5b3d;
    content: counter(buffer-action, decimal-leading-zero);
    font-family: "Noto Serif SC", "Songti SC", serif;
    font-size: 9px;
    font-weight: 900;
    line-height: 1;
}

.analysis-workspace {
    align-items: stretch;
}

.analysis-main {
    display: grid;
    grid-template-rows: minmax(0, 1fr) auto;
    gap: 18px;
    min-width: 0;
    min-height: 0;
}

.analysis-methods-panel {
    overflow: hidden;
}

.analysis-scene-canvas {
    position: absolute;
    inset: 0;
    z-index: 1;
}

.analysis-scene-canvas canvas {
    display: block;
    width: 100%;
    height: 100%;
}

.analysis-fullscreen .analysis-scene-canvas .supermap3d-viewer-navigationContainer {
    top: 28px;
    right: calc(var(--map-render-extra-width, 0px) + 28px);
    bottom: auto;
    z-index: 10;
    width: 148px;
    height: 148px;
    opacity: .76;
    transition: opacity 300ms ease;
}

.analysis-fullscreen.has-analysis-results .analysis-scene-canvas .supermap3d-viewer-navigationContainer {
    right: calc(var(--map-render-extra-width, 0px) + min(504px, calc(100vw - 36px)) + 48px);
}

.analysis-fullscreen .analysis-scene-canvas .supermap3d-viewer-navigationContainer:hover,
.analysis-fullscreen .analysis-scene-canvas .supermap3d-viewer-navigationContainer:focus-within {
    opacity: 1;
}

.analysis-fullscreen .analysis-scene-canvas .sm-compass {
    top: 10px;
    right: 10px;
}

.analysis-fullscreen .analysis-scene-canvas .sm-zoom {
    display: none;
}

.analysis-progress {
    position: absolute;
    left: 50%;
    top: 50%;
    z-index: 6;
    width: min(390px, calc(100% - 48px));
    padding: 16px 18px;
    border: 1px solid rgba(216, 191, 140, .42);
    border-radius: 8px;
    color: #f4ead2;
    background: rgba(17, 52, 48, .9);
    box-shadow: 0 16px 42px rgba(8, 22, 19, .32);
    text-align: center;
    transform: translate(-50%, -50%);
    backdrop-filter: blur(8px);
}

.analysis-progress[hidden] { display: none; }
.analysis-progress strong,
.analysis-progress span { display: block; }
.analysis-progress span { margin-top: 6px; color: rgba(244, 234, 210, .78); font-size: 12px; line-height: 1.5; }

.analysis-scene-toolbar {
    position: absolute;
    right: 18px;
    top: 18px;
    z-index: 4;
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 8px;
}

.scene-chip {
    padding: 7px 10px;
    border: 1px solid rgba(232, 220, 199, .3);
    border-radius: 999px;
    color: #f4ead2;
    background: rgba(24, 58, 52, .78);
    font-size: 11px;
    letter-spacing: .04em;
}

.analysis-field-hint,
.elevation-parameter-summary {
    display: block;
    margin-top: 6px;
    color: #7b754f;
    font-size: 11px;
    line-height: 1.4;
}

.elevation-range-inputs,
.elevation-parameter-row {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 7px;
    margin-top: 7px;
}

.elevation-parameter-block {
    padding: 11px 10px 10px;
    border-color: rgba(120, 102, 58, .27);
    background: rgba(232, 220, 199, .48);
}

.elevation-parameter-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 8px;
    padding-bottom: 7px;
    border-bottom: 1px solid rgba(96, 108, 56, .16);
}

.elevation-parameter-heading b {
    color: #354126;
    font-size: 14px;
    font-weight: 900;
}

.elevation-parameter-heading span {
    color: #7b754f;
    font-size: 11px;
    font-weight: 800;
}

.elevation-range-inputs label,
.elevation-parameter-row label {
    display: grid;
    gap: 4px;
    color: #596143;
    font-size: 12px;
    font-weight: 800;
}

.elevation-range-inputs input,
.elevation-parameter-row input,
.elevation-parameter-row select {
    width: 100%;
    min-width: 0;
    min-height: 40px;
    padding: 8px 10px;
    border: 1px solid rgba(120, 102, 58, .28);
    border-radius: 7px;
    color: #3f482d;
    background: rgba(245, 237, 218, .72);
    box-shadow: inset 0 1px 1px rgba(96, 78, 42, .06);
    font-size: 15px;
    font-weight: 800;
}

.elevation-parameter-row input:focus,
.elevation-parameter-row select:focus {
    border-color: rgba(169, 95, 63, .7);
    outline: 2px solid rgba(169, 95, 63, .16);
    outline-offset: 1px;
}
.elevation-parameter-summary { display: flex; justify-content: space-between; gap: 8px; }

/* Slope analysis keeps the same three-column workbench proportions as the other methods. */
.slope-analysis-workspace {
    grid-template-columns: 320px minmax(0, 1fr) 410px;
}

.slope-analysis-workspace.analysis-workspace {
    gap: 16px;
    padding: 16px;
}

.slope-analysis-workspace .analysis-sidebar,
.slope-analysis-workspace .analysis-results-panel {
    gap: 14px;
    padding: 20px 16px;
}

.slope-analysis-workspace .analysis-sidebar > h3,
.slope-analysis-workspace .analysis-results-panel > h3 { margin-bottom: 5px; font-size: 22px; }
.slope-analysis-workspace .analysis-control-block { padding: 13px 12px; }
.slope-analysis-workspace .analysis-control-block > label { display: block; margin-bottom: 10px; font-size: 15px; }
.slope-analysis-workspace .analysis-control-block select { min-height: 42px; padding: 9px 12px; font-size: 14px; }
.slope-analysis-workspace .analysis-scope-toggle button { min-height: 38px; padding: 0 12px; font-size: 14px; }
.slope-analysis-workspace .analysis-field-hint { margin-top: 8px; font-size: 12.5px; line-height: 1.65; }
.slope-analysis-workspace .analysis-sidebar [data-run-analysis] { min-height: 46px; font-size: 16px; }
.slope-analysis-workspace .analysis-caravan-art { display: none; }
.slope-analysis-workspace .analysis-scene-card { height: 100%; min-height: 0; }
.slope-analysis-workspace .analysis-methods-panel { padding: 14px; }
.slope-analysis-workspace .analysis-grid { gap: 10px; }
.slope-analysis-workspace .analysis-card { min-height: 112px; padding: 11px 12px; }
.slope-analysis-workspace .analysis-card h4 { margin-bottom: 5px; font-size: 15px; }
.slope-analysis-workspace .analysis-card p { font-size: 12px; line-height: 1.38; }
.slope-analysis-workspace .analysis-results-content table td,
.slope-analysis-workspace .analysis-results-content table th { padding: 9px 10px; }
.slope-analysis-workspace .result-box { padding: 12px; border-radius: 8px; }
.slope-analysis-workspace .result-box p { line-height: 1.55; }
.slope-analysis-workspace .analysis-empty-result { flex-basis: 220px; min-height: 220px; padding: 18px 14px; }

@media (max-width: 1500px) and (min-width: 901px) {
    .slope-analysis-workspace { grid-template-columns: 300px minmax(0, 1fr) 370px; }
}

@media (max-width: 900px) {
    .slope-analysis-workspace { grid-template-columns: 1fr; }
    .slope-analysis-workspace .analysis-scene-card { min-height: 500px; }
}
.analysis-breakdown-list {
    display: grid;
    gap: 6px;
}

.analysis-breakdown-list div {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    min-width: 0;
    padding: 8px 10px;
    border: 1px solid rgba(120, 102, 58, .16);
    border-radius: 6px;
    background: rgba(232, 220, 199, .24);
}

.analysis-breakdown-list span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: #4c5737;
    font-size: 12px;
    font-weight: 800;
}

.analysis-breakdown-list b {
    color: #8b6a2b;
    font-size: 13px;
    font-weight: 900;
}

.analysis-breakdown-empty {
    margin: 0;
    color: rgba(89, 97, 67, .72);
    font-size: 12px;
    font-weight: 700;
}

/* Analysis results share the heritage-buffer paper, ink and type system. */
:is(.buffer-result-shell, .density-result-shell, .elevation-result-shell, .slope-result-shell, .viewshed-result-shell) {
    --analysis-result-ink: #163d26;
    --analysis-result-copy: #3f5138;
    --analysis-result-muted: #747b62;
    --analysis-result-accent: #c66b3d;
    --analysis-result-rule: rgba(96, 108, 56, .2);
    --analysis-result-border: rgba(176, 139, 110, .3);
    --analysis-result-card: rgba(232, 220, 199, .5);
    --analysis-result-soft: rgba(212, 184, 149, .2);
    display: grid;
    gap: 0;
    padding-bottom: 12px;
    color: var(--analysis-result-copy);
    font-family: "Noto Serif SC", "Songti SC", "Source Han Serif SC", serif;
    letter-spacing: 0;
}

/* Shared hierarchy for the final judgement section in all five analyses. */
.analysis-advice-panel {
    min-width: 0;
    padding-top: 16px;
    border-top: 2px solid rgba(96, 108, 56, .3);
    border-bottom: 0 !important;
    color: var(--analysis-result-copy, #3f5138);
    font-family: "Noto Serif SC", "Songti SC", "Source Han Serif SC", serif;
}

.density-ai-panel.analysis-advice-panel,
.elevation-ai-section.analysis-advice-panel { border-top: 0; }

:is(
    .buffer-result-block > header,
    .density-section-heading > div,
    .elevation-section-heading > div,
    .viewshed-result-section > header,
    .analysis-advice-heading > div
) > span {
    color: var(--analysis-result-accent, #c66b3d);
    font-family: "Noto Serif SC", "Songti SC", "Source Han Serif SC", serif;
    font-size: 13px;
    font-weight: 900;
    line-height: 1;
}

.analysis-advice-heading {
    margin-bottom: 0 !important;
    padding-bottom: 10px !important;
    border-bottom: 0 !important;
}

.analysis-advice-heading h5 {
    color: var(--analysis-result-ink, #163d26) !important;
    font-size: 17px !important;
    font-weight: 900;
    line-height: 1.3;
}

.analysis-advice-section {
    min-width: 0;
    padding: 14px 0;
    border-top: 1px solid rgba(96, 108, 56, .2);
    border-bottom: 0 !important;
}

.analysis-advice-heading + .analysis-advice-section,
.density-ai-error + .analysis-advice-section,
:is(.elevation-ai-content, .slope-ai-content) > .analysis-advice-section:first-child {
    border-top: 0;
}

.analysis-advice-section > h6,
.analysis-advice-section > header h6 {
    display: flex;
    align-items: center;
    gap: 9px;
    margin: 0;
    color: var(--analysis-result-ink, #163d26);
    font-size: 14px;
    font-weight: 900;
    line-height: 1.45;
}

.analysis-advice-section > h6 { margin-bottom: 9px; }
.analysis-advice-section > header { margin-bottom: 9px; }

.analysis-advice-section > h6::before,
.analysis-advice-section > header h6::before {
    width: 20px;
    height: 2px;
    flex: 0 0 20px;
    content: "";
    background: var(--analysis-result-accent, #c66b3d);
}

.analysis-advice-section p,
.analysis-advice-section ol,
.analysis-advice-section dd,
.analysis-advice-section small {
    color: var(--analysis-result-copy, #3f5138);
    font-family: inherit;
    font-size: 13px;
    font-weight: 600;
    line-height: 1.72;
}

.analysis-advice-section p,
.analysis-advice-section ol { margin-top: 0; margin-bottom: 0; }

:is(.density-result-shell, .elevation-result-shell, .slope-result-shell, .viewshed-result-shell) button {
    font-family: inherit;
}

.density-output-section {
    min-width: 0;
    padding: 16px 0;
    border-bottom: 2px solid rgba(96, 108, 56, .3);
}

.density-section-heading,
.density-section-heading > div {
    display: flex;
    align-items: center;
}

.density-section-heading {
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 12px;
}

.density-section-heading > div { gap: 9px; min-width: 0; }
.density-section-heading > div > span {
    color: var(--analysis-result-accent);
    font-size: 13px;
    font-weight: 900;
    font-variant-numeric: tabular-nums;
}

.density-section-heading h5 {
    margin: 0;
    color: var(--analysis-result-ink);
    font-size: 17px;
    font-weight: 900;
    line-height: 1.25;
}


.density-overview-breakdown { margin-top: 12px; }
.density-overview-chart > div {
    grid-template-columns: minmax(72px, .9fr) minmax(54px, 1fr) minmax(64px, auto);
}
.density-overview-chart strong {
    white-space: nowrap;
    font-variant-numeric: tabular-nums;
}

.density-total-chart {
    min-width: 0;
    padding: 12px 10px 8px;
    border: 1px solid var(--analysis-result-border);
    border-radius: 6px;
    background: rgba(232, 220, 199, .28);
}

.density-overview-curve { display: block; width: 100%; height: 210px; overflow: visible; }
.density-overview-gridlines line { stroke: rgba(96, 108, 56, .18); stroke-width: 1; stroke-dasharray: 3 5; }
.density-overview-gridlines text,
.density-overview-axis text { fill: var(--analysis-result-muted); font-size: 10px; font-weight: 700; font-variant-numeric: tabular-nums; }
.density-overview-selected-band { fill: rgba(198, 107, 61, .09); }
.density-overview-area { fill: url(#densityOverviewAreaGradient); stroke: none; }
.density-overview-line { fill: none; stroke: var(--analysis-result-ink); stroke-width: 2.6; stroke-linecap: round; stroke-linejoin: round; }
.density-overview-hit { fill: transparent; cursor: pointer; pointer-events: all; }
.density-overview-hit:hover { fill: rgba(198, 107, 61, .07); }
.density-overview-point {
    fill: #e8dcc7;
    stroke: var(--analysis-result-accent);
    stroke-width: 1.8;
    cursor: pointer;
    transition: r 240ms ease, fill 240ms ease, stroke-width 240ms ease;
}
.density-overview-point:hover,
.density-overview-point.active { fill: var(--analysis-result-accent); stroke: #e8dcc7; stroke-width: 2.4; }

.density-segment-list {
    display: grid;
    gap: 9px;
}

.density-segment-card {
    min-width: 0;
    overflow: visible;
}

.density-segment-select {
    display: grid;
    grid-template-columns: minmax(70px, .7fr) minmax(105px, 1.1fr) minmax(52px, .6fr);
    align-items: center;
    width: 100%;
    min-height: 46px;
    padding: 9px 11px;
    border: 1px solid var(--analysis-result-rule);
    border-radius: 6px;
    color: var(--analysis-result-copy);
    background: var(--analysis-result-soft);
    cursor: pointer;
    font: inherit;
    text-align: left;
}

.density-segment-select:hover { background: rgba(198, 107, 61, .09); }
.density-segment-select span { display: flex; align-items: center; gap: 7px; font-size: 13px; font-weight: 900; }
.density-segment-select strong { color: var(--analysis-result-ink); font-size: 14px; font-variant-numeric: tabular-nums; text-align: center; }
.density-segment-select em { color: var(--analysis-result-muted); font-size: 12px; font-style: normal; font-weight: 800; text-align: right; }

.density-level-dot { width: 7px; height: 7px; flex: 0 0 auto; border-radius: 50%; background: #8d9f66; }
.density-level-dot.medium { background: #c0a14b; }
.density-level-dot.high { background: #b45f43; }

.density-segment-kpis {
    margin-top: 10px;
}

.density-segment-breakdown { margin-top: 12px; }
.density-segment-breakdown-chart > div { grid-template-columns: minmax(72px, .9fr) minmax(64px, 1.2fr) 28px; }

.density-segment-variation {
    margin-top: 14px;
    padding: 14px 0 12px;
    border-top: 1px solid var(--analysis-result-rule);
}
.density-segment-variation > b { display: block; margin-bottom: 8px; color: var(--analysis-result-ink); font-size: 15px; }
.density-segment-sparkline { display: block; width: 100%; height: 140px; overflow: visible; }
.density-segment-sparkline-grid line { stroke: rgba(96, 108, 56, .18); stroke-width: 1; stroke-dasharray: 3 5; }
.density-segment-sparkline-grid text,
.density-segment-sparkline-axis text { fill: var(--analysis-result-muted); font-size: 10px; font-weight: 700; }
.density-segment-sparkline-area { stroke: none; }
.density-segment-sparkline-line { fill: none; stroke: var(--analysis-result-ink); stroke-width: 2.6; stroke-linecap: round; stroke-linejoin: round; }
.density-segment-sparkline circle { fill: #e8dcc7; stroke: var(--analysis-result-accent); stroke-width: 1.8; transition: r 240ms ease, fill 240ms ease; }
.density-segment-sparkline circle:hover { r: 4; fill: var(--analysis-result-accent); }

.density-segment-heritage-panel {
    margin-top: 12px;
    padding: 11px;
    border: 1px solid rgba(176, 139, 110, .34);
    border-radius: 8px;
    background: rgba(232, 220, 199, .28);
}
.density-segment-heritage-panel > header { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 8px; }
.density-segment-heritage-panel > header b { color: var(--analysis-result-ink); font-size: 15px; }
.density-segment-heritage-panel > header span { color: var(--analysis-result-muted); font-size: 11px; font-weight: 700; }
.density-segment-heritage-list { display: grid; gap: 6px; }
.density-segment-heritage-list .heritage-result-card {
    height: 62px;
    min-height: 62px;
    padding: 6px;
    grid-template-columns: 76px minmax(0, 1fr);
    gap: 9px;
}
.density-segment-heritage-list .heritage-result-media { width: 76px; height: 48px; aspect-ratio: auto; }
.density-segment-heritage-list .heritage-result-copy { grid-template-rows: 22px 18px; gap: 1px; }
.density-segment-heritage-list .heritage-name-marquee { font-size: 15px; line-height: 22px; }
.density-segment-heritage-list .heritage-result-meta { gap: 7px; font-size: 10px; line-height: 18px; }
.density-segment-pagination { margin-top: 9px; }

.density-ai-panel { border-bottom: 0; }
.density-ai-error { margin: 0 0 10px; padding: 10px; border-left: 3px solid #9c3b32; color: #7e332d; background: rgba(156, 59, 50, .07); font-size: 13px; line-height: 1.6; }
.density-ai-group > header { display: block; }
.density-ai-group article { padding: 11px 0; }
.density-ai-group article > strong { display: block; margin-bottom: 8px; color: var(--analysis-result-ink); font-size: 14px; line-height: 1.45; }
.density-ai-group dl { display: grid; gap: 8px; margin: 0; }
.density-ai-group dl > div { display: grid; grid-template-columns: 70px minmax(0, 1fr); gap: 9px; }
.density-ai-group dt { color: var(--analysis-result-ink); font-size: 13px; font-weight: 900; }
.density-ai-group dd { min-width: 0; margin: 0; overflow-wrap: anywhere; color: var(--analysis-result-copy); font-size: 13px; font-weight: 600; line-height: 1.7; }

.analysis-heritage-backdrop {
    position: fixed;
    inset: 0;
    z-index: 120;
    display: grid;
    place-items: center;
    padding: 28px;
    background: rgba(41, 45, 39, .68);
    backdrop-filter: blur(4px) grayscale(.42);
}

.analysis-heritage-dialog {
    width: min(840px, calc(100vw - 32px));
    max-height: calc(100dvh - 32px);
    overflow: auto;
    padding: 22px;
    border: 1px solid rgba(216, 191, 140, .7);
    border-radius: 8px;
    color: #465033;
    background:
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence baseFrequency='.75' numOctaves='2'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)' opacity='.035'/%3E%3C/svg%3E"),
        #e8dcc7;
    box-shadow: 0 28px 80px rgba(15, 22, 18, .42), inset 0 1px 0 rgba(255, 245, 220, .6);
    overscroll-behavior: contain;
}

.analysis-heritage-dialog > header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 16px;
    padding-bottom: 14px;
    border-bottom: 1px solid rgba(96, 108, 56, .2);
}

.analysis-heritage-dialog > header span {
    color: #8c6c2b;
    font-size: 13px;
    font-weight: 900;
}

.analysis-heritage-dialog > header h3 {
    margin: 5px 0 0;
    font-size: 28px;
}

.analysis-heritage-dialog > header button {
    width: 38px;
    height: 38px;
    padding: 8px;
    border: 1px solid rgba(96, 108, 56, .28);
    border-radius: 50%;
    background: rgba(232, 220, 199, .72);
}

.analysis-heritage-dialog > header svg {
    width: 100%;
    height: 100%;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
}

.analysis-heritage-dialog .heritage-detail-card {
    padding: 0;
}

.analysis-heritage-dialog .heritage-detail-map-card {
    height: clamp(220px, 30dvh, 260px) !important;
    min-height: 220px;
    overflow: hidden;
}

.analysis-heritage-dialog .heritage-detail-map-card .global-city-map-plot {
    inset: 34px 12px 52px 12px;
    width: auto;
    height: auto !important;
    aspect-ratio: auto !important;
    overflow: hidden;
    transform: none;
}

.analysis-heritage-dialog .heritage-detail-map-card p {
    left: 16px;
    right: 16px;
    bottom: 12px;
    z-index: 5;
    margin: 0;
    line-height: 1.4;
    overflow: visible;
    white-space: normal;
}

.analysis-heritage-dialog .heritage-detail-desc.is-full-description,
.analysis-heritage-dialog .heritage-detail-card.is-full-description .heritage-detail-desc {
    display: block;
    overflow: visible;
    -webkit-line-clamp: unset;
}

@media (max-height: 760px) {
    .analysis-heritage-backdrop {
        align-items: start;
        padding: 16px;
        overflow-y: auto;
    }

    .analysis-heritage-dialog {
        max-height: none;
        padding: 18px 20px;
    }

    .analysis-heritage-dialog .heritage-detail-map-card {
        height: 220px !important;
    }
}

@media (max-width: 900px) {
    .analysis-scene-card { min-height: 500px; }
    .analysis-scene-toolbar { left: 18px; right: 18px; justify-content: flex-start; top: 74px; }
}

@media (max-width: 1500px) and (min-width: 901px) {
    .analysis-workspace {
        grid-template-columns: 320px minmax(0, 1fr) 410px;
    }
}

@media (min-width: 901px) {
    .workspace.analysis-workspace {
        grid-template-columns: 320px minmax(0, 1fr) 410px;
    }
}

@media (max-width: 900px) {
    .workspace.analysis-workspace {
        width: calc(100vw - 20px);
        max-width: calc(100vw - 20px);
        min-width: 0;
        box-sizing: border-box;
        grid-template-columns: minmax(280px, 88vw) minmax(620px, 150vw) minmax(340px, 92vw);
        grid-template-rows: minmax(0, 1fr);
        align-items: stretch;
        height: calc(100dvh - 86px);
        padding: 10px;
        overflow-x: auto;
        overflow-y: hidden;
        scroll-snap-type: x proximity;
    }
    .workspace.analysis-workspace > * {
        min-height: 0;
        scroll-snap-align: start;
    }
    .workspace.analysis-workspace > aside:last-child {
        grid-column: auto;
    }
    .analysis-scene-card { min-height: 0; }
}

/* AI 城市行程规划台 */
.travel-planner {
    --trip-sage: #8b9d83;
    --trip-clay: #b08b6e;
    --trip-terra: #c66b3d;
    --trip-ochre: #c08e3a;
    --trip-moss: #606c38;
    --trip-sand: #e8dcc7;
    --trip-oat: #d4b895;
    --travel-floating-panel-width: clamp(390px, 25vw, 430px);
    --travel-timeline-panel-width: clamp(429px, 27.5vw, 473px);
    position: relative;
    height: calc(100dvh - 86px);
    min-height: 700px;
    display: block;
    overflow: hidden;
    color: #3f492d;
    background: var(--trip-sand);
    font-family: "Epilogue", "Greycliff CF", Arial, sans-serif;
}

.travel-planner button,
.travel-planner input,
.travel-planner textarea,
.travel-planner select { font: inherit; }

.travel-planner button { cursor: pointer; }

/* 未生成行程：地图先行的 Organic 规划台 */
.travel-planner-empty {
    --travel-floating-panel-width: clamp(390px, 25vw, 430px);
    --travel-label-font: "Epilogue", "Greycliff CF", Arial, sans-serif;
    --travel-control-font: "Noto Serif SC", "Songti SC", "Source Han Serif SC", serif;
    --travel-label-color: rgba(76, 86, 45, .9);
    --travel-control-color: var(--heritage-copy);
    --travel-placeholder-color: rgba(76, 86, 45, .48);
    position: relative;
    display: block;
    padding: 0;
    color: #173e2f;
    background: #35452f;
    background-image: radial-gradient(circle at 48% 12%, rgba(192, 142, 58, .16), transparent 30%), url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.72' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.025'/%3E%3C/svg%3E");
}

.travel-start-panel {
    position: absolute;
    z-index: 5;
    left: 18px;
    top: 18px;
    bottom: 18px;
    width: var(--travel-floating-panel-width);
    min-height: 0;
    overflow-y: auto;
    isolation: isolate;
    padding: 60px 24px 20px;
    border: 1px solid rgba(212, 184, 149, .78);
    border-radius: 5px;
    background:
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence baseFrequency='.86' numOctaves='2'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)' opacity='.04'/%3E%3C/svg%3E"),
        linear-gradient(180deg, rgba(232, 220, 199, .94), rgba(232, 220, 199, .985));
    box-shadow: 0 34px 90px rgba(5, 18, 17, .32);
    backdrop-filter: blur(8px);
}
.travel-start-panel::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    border-radius: inherit;
    background: url("assets/shared/backgrounds/vertical-panel-texture.png") center / 100% 100% no-repeat;
    opacity: .72;
}
.travel-start-panel > * {
    position: relative;
    z-index: 1;
}
.travel-start-title {
    min-height: 72px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 14px;
    padding: 0 0 18px;
    border-bottom: 1px solid rgba(176, 139, 110, .38);
}
.travel-start-title h2 {
    margin: 0;
    color: #173e2f;
    font-family: "Noto Serif SC", "Songti SC", "Source Han Serif SC", serif;
    font-size: 48px;
    font-weight: 900;
    line-height: 1.05;
    letter-spacing: 0;
}
.travel-start-title img { width: auto; height: 34px; margin-top: 6px; object-fit: contain; filter: drop-shadow(0 3px 8px rgba(114, 69, 24, .2)); }
.travel-start-form { display: grid; gap: 15px; padding-top: 18px; }
.travel-form-section,
.travel-time-fields,
.travel-preference-section,
.travel-hotel-field,
.travel-boundary-grid {
    padding-bottom: 15px;
    border-bottom: 1px solid rgba(176, 139, 110, .3);
}
.travel-start-form fieldset { min-width: 0; margin: 0; padding: 0; border: 0; }
.travel-start-form legend,
.travel-start-field > span,
.travel-traveler-field > span,
.travel-section-label {
    margin-bottom: 8px;
    color: var(--travel-label-color);
    font-family: var(--travel-label-font);
    font-size: 14px;
    font-weight: 700;
    line-height: 1.25;
}
.travel-destination-section { display: grid; }
.travel-start-field { display: grid; }
.travel-start-field input,
.travel-start-field select,
.travel-start-field textarea,
.travel-time-fields input { width: 100%; min-width: 0; border: 1px solid rgba(176, 139, 110, .48); border-radius: 8px; outline: 0; color: #173e2f; background: rgba(232, 220, 199, .54); }
.travel-start-field input,
.travel-start-field select { height: 44px; padding: 0 12px; }
.travel-start-field textarea { height: 96px; min-height: 96px; max-height: 96px; padding: 11px 12px 24px; overflow-y: auto; resize: none; line-height: 1.55; }
.travel-start-field textarea {
    color: var(--travel-control-color);
    font-family: var(--travel-control-font);
    font-size: 16px;
    font-weight: 700;
}
.travel-start-field input:focus,
.travel-start-field select:focus,
.travel-start-field textarea:focus,
.travel-time-fields input:focus { border-color: #184e46; box-shadow: 0 0 0 3px rgba(24, 78, 70, .13); }
.travel-search-control { position: relative; min-width: 0; }
.travel-search-control > input {
    width: 100%;
    height: 47px;
    padding: 0 13px;
    border: 1px solid rgba(176, 139, 110, .4);
    border-radius: 8px;
    outline: 0;
    color: var(--travel-control-color);
    background: rgba(232, 220, 199, .66);
    font-family: var(--travel-control-font);
    font-size: 16px;
    font-weight: 700;
}
.travel-search-control > input::placeholder,
.travel-start-field textarea::placeholder { color: var(--travel-placeholder-color); opacity: 1; }
.travel-search-control > input:focus { border-color: #184e46; box-shadow: 0 0 0 3px rgba(24, 78, 70, .13); }
.travel-option-menu,
.travel-select-menu {
    position: absolute;
    left: 0;
    right: 0;
    top: calc(100% + 7px);
    z-index: 50;
    display: none;
    max-height: 260px;
    overflow-y: auto;
    padding: 6px;
    border: 1px solid rgba(176, 139, 110, .44);
    border-radius: 8px;
    background:
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence baseFrequency='.72' numOctaves='2'/%3E%3C/filter%3E%3Crect width='120' height='120' filter='url(%23n)' opacity='.035'/%3E%3C/svg%3E"),
        rgba(232, 220, 199, .98);
    box-shadow: 0 20px 42px rgba(5, 18, 17, .22);
}
.travel-option-menu.visible,
.travel-custom-select.open .travel-select-menu { display: grid; }
.travel-option-menu button,
.travel-select-menu button {
    width: 100%;
    min-height: 38px;
    display: grid;
    gap: 2px;
    padding: 7px 10px;
    border: 0;
    border-radius: 6px;
    color: var(--travel-control-color);
    background: transparent;
    font-family: var(--travel-control-font);
    font-size: 15px;
    font-weight: 700;
    text-align: left;
}
.travel-option-menu button > b { font-weight: inherit; }
.travel-select-menu button:hover,
.travel-select-menu button.active,
.travel-option-menu button:hover { color: #f1dfb9; background: rgba(24, 78, 70, .96); }
.travel-option-menu button span {
    color: rgba(76, 86, 45, .68);
    font-family: var(--travel-label-font);
    font-size: 11px;
    font-weight: 700;
}
.travel-option-menu button:hover span { color: rgba(241, 223, 185, .78); }
.travel-option-menu p {
    margin: 0;
    padding: 10px;
    color: var(--travel-label-color);
    font-family: var(--travel-label-font);
    font-size: 12px;
    font-weight: 700;
}
.travel-custom-select { position: relative; min-width: 0; }
.travel-select-trigger,
.travel-date-trigger {
    width: 100%;
    min-height: 47px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding: 8px 11px;
    border: 1px solid rgba(176, 139, 110, .4);
    border-radius: 8px;
    color: var(--travel-control-color);
    background: rgba(232, 220, 199, .66);
    font-family: var(--travel-control-font);
    font-size: 16px;
    font-weight: 700;
    text-align: left;
}
.travel-select-trigger span,
.travel-date-trigger span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.travel-select-trigger i,
.travel-date-trigger i {
    width: 9px;
    height: 9px;
    flex: 0 0 auto;
    border-right: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
    transform: rotate(45deg) translateY(-2px);
}
.travel-custom-select.open .travel-select-trigger i,
.travel-date-control.open .travel-date-trigger i { transform: rotate(225deg) translate(-2px, -1px); }
.travel-custom-select.disabled .travel-select-trigger { cursor: not-allowed; color: var(--travel-placeholder-color); background: rgba(232, 220, 199, .34); }
.travel-time-fields { display: grid; gap: 10px; }
.travel-time-row {
    display: grid;
    grid-template-columns: 64px minmax(116px, 1fr) 148px;
    align-items: center;
    column-gap: 7px;
}
.travel-time-row > span {
    color: var(--travel-label-color);
    font-family: var(--travel-label-font);
    font-size: 14px;
    font-weight: 700;
}
.travel-date-control { position: relative; min-width: 0; }
.travel-time-selects {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    gap: 5px;
    margin-left: 8px;
}
.travel-time-selects > b { color: var(--travel-control-color); font-family: var(--travel-control-font); font-size: 16px; }
.travel-time-row .travel-date-trigger,
.travel-time-row .travel-select-trigger {
    color: var(--heritage-copy);
    font-family: "Noto Serif SC", "Songti SC", "Source Han Serif SC", serif;
    font-size: 15px;
    font-weight: 700;
}
.travel-time-row .travel-date-trigger i,
.travel-time-row .travel-select-trigger i {
    color: var(--heritage-copy);
}
.travel-time-select .travel-select-trigger { min-height: 47px; padding-inline: 10px; }
.travel-time-select .travel-select-menu { min-width: 70px; max-height: 226px; }
.travel-calendar {
    position: absolute;
    left: 0;
    top: calc(100% + 7px);
    z-index: 60;
    width: 292px;
    padding: 12px;
    border: 1px solid rgba(176, 139, 110, .44);
    border-radius: 8px;
    background:
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence baseFrequency='.72' numOctaves='2'/%3E%3C/filter%3E%3Crect width='120' height='120' filter='url(%23n)' opacity='.035'/%3E%3C/svg%3E"),
        rgba(232, 220, 199, .99);
    box-shadow: 0 20px 42px rgba(5, 18, 17, .22);
}
.travel-calendar header { display: grid; grid-template-columns: 32px 1fr 32px; align-items: center; gap: 8px; margin-bottom: 9px; }
.travel-calendar header strong { color: var(--travel-control-color); font-family: var(--travel-control-font); font-size: 15px; text-align: center; }
.travel-calendar header button { position: relative; width: 32px; height: 32px; padding: 0; border: 1px solid rgba(176, 139, 110, .32); border-radius: 6px; background: rgba(232, 220, 199, .54); }
.travel-calendar header button::before { content: ""; position: absolute; left: 12px; top: 10px; width: 8px; height: 8px; border-left: 2px solid #173e2f; border-bottom: 2px solid #173e2f; transform: rotate(45deg); }
.travel-calendar header button:last-child::before { left: 9px; transform: rotate(225deg); }
.travel-calendar-week,
.travel-calendar-days { display: grid; grid-template-columns: repeat(7, 1fr); gap: 3px; }
.travel-calendar-week span { padding: 4px 0; color: var(--travel-label-color); font-family: var(--travel-label-font); font-size: 10px; font-weight: 700; text-align: center; }
.travel-calendar-days button,
.travel-calendar-empty { min-height: 32px; }
.travel-calendar-days button { padding: 0; border: 0; border-radius: 6px; color: var(--travel-control-color); background: transparent; font-family: var(--travel-control-font); font-size: 13px; font-weight: 700; }
.travel-calendar-days button:hover,
.travel-calendar-days button.active { color: #f1dfb9; background: #184e46; }
.travel-calendar-days button.today { box-shadow: inset 0 0 0 1px rgba(24, 78, 70, .55); }
.travel-calendar-days button:disabled { cursor: not-allowed; color: rgba(76, 86, 45, .3); background: transparent; }
.travel-preference-section { display: grid; gap: 13px; }
.travel-pace-field { display: grid; grid-template-columns: 82px repeat(3, minmax(0, 1fr)); align-items: center; gap: 8px; }
.travel-pace-field .travel-section-label { margin: 0; }
.travel-arrival-mode { display: grid; gap: 10px; }
.travel-arrival-mode .travel-section-label { margin: 0; }
.travel-arrival-mode > div { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.travel-pace-field button,
.travel-arrival-mode button {
    min-height: 42px;
    border: 1px solid rgba(176, 139, 110, .34);
    border-radius: 8px;
    color: var(--heritage-muted);
    background: rgba(232, 220, 199, .5);
    font-family: var(--travel-control-font);
    font-size: 16px;
    font-weight: 700;
}
.travel-pace-field button.active,
.travel-arrival-mode button.active { color: #f1dfb9; border-color: rgba(17, 62, 58, .72); background: #184e46; box-shadow: none; }
.travel-boundary-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.travel-boundary-card { display: grid; align-content: start; gap: 9px; min-width: 0; }
.travel-boundary-card .travel-hub-field { margin-top: 1px; }
.travel-traveler-field { display: grid; grid-template-columns: 1fr 34px 58px 34px; align-items: center; gap: 5px; }
.travel-traveler-field > span { margin: 0; }
.travel-traveler-field button { width: 34px; height: 34px; padding: 0; border: 1px solid rgba(24, 78, 70, .3); border-radius: 50%; color: #184e46; background: rgba(232, 220, 199, .56); font-family: var(--travel-control-font); font-size: 16px; }
.travel-traveler-field b { color: var(--travel-control-color); font-family: var(--travel-control-font); text-align: center; font-size: 15px; font-weight: 700; }
.travel-hotel-field { display: grid; gap: 7px; }
.travel-hotel-heading { color: var(--travel-label-color); font-family: var(--travel-label-font); font-size: 14px; font-weight: 700; }
.travel-hub-field { display: grid; gap: 6px; min-width: 0; }
.travel-hub-field > span { color: var(--travel-label-color); font-family: var(--travel-label-font); font-size: 13px; font-weight: 700; }
.travel-hub-select .travel-select-trigger { min-height: 42px; font-size: 15px; }
.travel-hub-select .travel-select-menu { min-width: 100%; }
.travel-needs-field { position: relative; }
.travel-needs-field small { position: absolute; right: 10px; bottom: 8px; color: rgba(76, 86, 45, .68); font-family: var(--travel-label-font); font-size: 10px; font-weight: 700; }
.travel-form-error { margin: 0; padding: 9px 11px; border-radius: 8px; color: #74452f; background: rgba(198, 107, 61, .14); font-family: var(--travel-label-font); font-size: 12px; font-weight: 700; line-height: 1.5; }
.travel-generate-button { min-height: 48px; border: 1px solid #0e403a; border-radius: 8px; color: var(--trip-sand); background: linear-gradient(180deg, #184e46, #0e403a); font-family: var(--travel-control-font); font-size: 18px; font-weight: 900; letter-spacing: 0; box-shadow: 0 10px 22px rgba(14, 64, 58, .2); }
.travel-generate-button:hover { background: #173e2f; }
.travel-generate-button:disabled { cursor: wait; opacity: .58; }

.travel-start-panel.is-generating { overflow: hidden; }
.travel-start-form.is-leaving {
    pointer-events: none;
    animation: travel-form-dissolve 420ms cubic-bezier(.2, .72, .32, 1) forwards;
}
.travel-generation-flow {
    display: flex;
    height: calc(100% - 91px);
    flex-direction: column;
    padding-top: 20px;
    animation: travel-generation-reveal 520ms cubic-bezier(.18, .78, .32, 1) both;
}
.travel-generation-flow.is-completing { animation: travel-generation-fold 720ms cubic-bezier(.46, 0, .68, .45) both; }
.travel-generation-steps {
    display: grid;
    align-content: start;
    gap: 0;
    margin: 0;
    padding: 0;
    overflow-y: auto;
}
.travel-generation-steps li {
    position: relative;
    min-height: 38px;
    display: grid;
    grid-template-columns: 22px minmax(0, 1fr);
    align-items: center;
    gap: 9px;
    padding: 4px 0;
    color: rgba(76, 86, 45, .62);
    font-family: var(--travel-label-font);
    font-size: 12px;
    font-weight: 700;
    line-height: 1.4;
    animation: travel-generation-step-in 360ms cubic-bezier(.18, .78, .32, 1) both;
}
.travel-generation-steps li + li::before {
    content: "";
    position: absolute;
    left: 10px;
    top: -8px;
    width: 1px;
    height: 16px;
    background: rgba(176, 139, 110, .35);
}
.travel-generation-marker {
    position: relative;
    z-index: 1;
    width: 19px;
    height: 19px;
    box-sizing: border-box;
    border: 1px solid rgba(96, 108, 56, .42);
    border-radius: 50%;
    background: rgba(232, 220, 199, .72);
}
.travel-generation-steps li.is-active { color: var(--travel-control-color); }
.travel-generation-steps li.is-active .travel-generation-marker {
    border: 2px solid rgba(24, 78, 70, .28);
    border-top-color: #184e46;
    border-right-color: #184e46;
    animation: travel-generation-spin 900ms linear infinite;
}
.travel-generation-step-copy { position: relative; min-width: 0; }
.travel-generation-steps li.is-active .travel-generation-step-copy {
    color: #173e2f;
}
.travel-generation-steps li.is-active .travel-generation-step-copy::after {
    content: "";
    position: absolute;
    inset: -2px -4px;
    background: linear-gradient(100deg, transparent 35%, rgba(241, 223, 185, .7) 49%, rgba(241, 223, 185, .18) 61%, transparent 72%);
    transform: translateX(-118%);
    animation: travel-generation-sheen 5s ease-in-out infinite;
    pointer-events: none;
}
.travel-generation-steps li.is-complete { color: rgba(63, 73, 45, .76); }
.travel-generation-steps li.is-complete .travel-generation-marker {
    border-color: #184e46;
    background: #184e46;
}
.travel-generation-steps li.is-complete .travel-generation-marker::after {
    content: "";
    position: absolute;
    left: 5px;
    top: 3px;
    width: 6px;
    height: 9px;
    border-right: 1.5px solid #f1dfb9;
    border-bottom: 1.5px solid #f1dfb9;
    transform: rotate(42deg);
}
@keyframes travel-form-dissolve {
    from { opacity: 1; transform: translateY(0); filter: blur(0); }
    to { opacity: 0; transform: translateY(14px); filter: blur(2px); }
}
@keyframes travel-generation-reveal {
    from { opacity: 0; transform: translateY(12px); }
    to { opacity: 1; transform: translateY(0); }
}
@keyframes travel-generation-fold {
    from { opacity: 1; transform: translateY(0); }
    to { opacity: 0; transform: translateY(-10px); }
}
@keyframes travel-generation-step-in {
    from { opacity: 0; transform: translateY(8px); }
    to { opacity: 1; transform: translateY(0); }
}
@keyframes travel-generation-spin { to { transform: rotate(360deg); } }
@keyframes travel-generation-sheen {
    0%, 72% { transform: translateX(-118%); }
    94%, 100% { transform: translateX(118%); }
}
@media (prefers-reduced-motion: reduce) {
    .travel-start-form.is-leaving,
    .travel-generation-flow,
    .travel-generation-flow.is-completing,
    .travel-generation-steps li,
    .travel-generation-steps li.is-active .travel-generation-marker,
    .travel-generation-steps li.is-active .travel-generation-step-copy::after {
        animation: none;
    }
}

.travel-empty-map-panel { position: absolute; inset: 0; min-width: 0; min-height: 0; overflow: hidden; background: var(--trip-moss); }

.travel-head-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
    margin-top: 18px;
    padding-top: 18px;
    border-top: 1px solid rgba(176, 139, 110, .3);
}
.travel-head-actions button {
    min-height: 47px;
    padding: 0 12px;
    border: 1px solid rgba(176, 139, 110, .4);
    border-radius: 8px;
    color: var(--heritage-muted);
    background: rgba(232, 220, 199, .5);
    font-family: "Noto Serif SC", "Songti SC", "Source Han Serif SC", serif;
    font-size: 16px;
    font-weight: 700;
}
.travel-head-actions button:hover:not(:disabled) {
    color: #f1dfb9;
    border-color: rgba(17, 62, 58, .72);
    background: #184e46;
}
.travel-head-actions button:last-child {
    grid-column: 1 / -1;
    color: #f1dfb9;
    border-color: #0e403a;
    background: linear-gradient(180deg, #184e46, #0e403a);
    box-shadow: 0 10px 22px rgba(14, 64, 58, .2);
}
.travel-head-actions button:disabled {
    cursor: not-allowed;
    color: rgba(76, 86, 45, .38);
    background: rgba(232, 220, 199, .34);
    opacity: 1;
}

.travel-ai-panel,
.travel-timeline-panel { min-height: 0; overflow-y: auto; background: var(--trip-sand); }
.travel-ai-panel,
.travel-timeline-panel {
    position: absolute;
    z-index: 5;
    top: 18px;
    bottom: 18px;
    width: var(--travel-floating-panel-width);
    min-height: 0;
    overflow-y: auto;
    isolation: isolate;
    padding: 24px;
    border: 1px solid rgba(212, 184, 149, .78);
    border-radius: 5px;
    background:
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence baseFrequency='.86' numOctaves='2'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)' opacity='.04'/%3E%3C/svg%3E"),
        linear-gradient(180deg, rgba(232, 220, 199, .94), rgba(232, 220, 199, .985));
    box-shadow: 0 34px 90px rgba(5, 18, 17, .32);
    backdrop-filter: blur(8px);
}
.travel-ai-panel { left: 18px; }
.travel-timeline-panel {
    right: 18px;
    width: var(--travel-timeline-panel-width);
    display: flex;
    flex-direction: column;
    overflow: hidden;
    background: linear-gradient(180deg, rgba(232, 220, 199, .94), rgba(232, 220, 199, .985));
}
.travel-ai-panel::before,
.travel-timeline-panel::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    border-radius: inherit;
    background: url("assets/shared/backgrounds/vertical-panel-texture.png") center / 100% 100% no-repeat;
    opacity: .72;
}
.travel-timeline-panel::before {
    background: url("/assets/pages/heritage-atlas/heritage-card-background.jpg") center bottom / 100% 100% no-repeat;
    opacity: 1;
}
.travel-ai-panel > *,
.travel-timeline-panel > * {
    position: relative;
    z-index: 1;
}
.travel-timeline-head {
    flex: 0 0 auto;
    min-height: 42px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin: -2px -4px 14px;
    padding-bottom: 10px;
    border-bottom: 1px solid rgba(96, 108, 56, .18);
}
.travel-timeline-head h3,
.travel-transport-workspace-title h2 {
    display: flex;
    align-items: baseline;
    margin: 0;
    color: var(--heritage-ink);
    font-family: "Songti SC", "STSong", "Source Han Serif SC", serif;
    font-size: 28px;
    font-weight: 700;
    line-height: 1.15;
    letter-spacing: 0;
}
.travel-timeline-day-number {
    min-width: .72em;
    display: inline-flex;
    justify-content: center;
    font: inherit;
    font-size: 1.02em;
    font-variant-numeric: lining-nums;
    line-height: 1;
    transform: translateY(.02em);
}
.travel-timeline-weather {
    flex: 0 0 auto;
    min-width: 122px;
    max-width: 170px;
    min-height: 0;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 7px;
    margin-left: auto;
    padding: 0;
}
.travel-timeline-weather > img {
    flex: 0 0 32px;
    width: 32px;
    height: 32px;
    display: block;
    object-fit: contain;
}
.travel-timeline-weather-copy {
    min-width: 0;
    display: grid;
    align-content: center;
    gap: 2px;
    text-align: right;
}
.travel-timeline-weather-copy strong,
.travel-timeline-weather-copy span {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.travel-timeline-weather-copy strong {
    color: var(--heritage-ink);
    font-family: "Songti SC", "STSong", "Source Han Serif SC", serif;
    font-size: 15px;
    font-weight: 700;
    line-height: 1.15;
}
.travel-timeline-weather-copy span {
    color: rgba(63, 73, 45, .76);
    font-size: 10px;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    line-height: 1.2;
}
.travel-timeline-panel .travel-timeline {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    overscroll-behavior: contain;
    padding-right: 4px;
}

.travel-ai-panel:has(.travel-default-workspace) {
    --travel-label-font: "Epilogue", "Greycliff CF", Arial, sans-serif;
    --travel-control-font: "Noto Serif SC", "Songti SC", "Source Han Serif SC", serif;
    --travel-label-color: rgba(76, 86, 45, .9);
    --travel-control-color: var(--heritage-copy);
    display: flex;
    flex-direction: column;
    padding: 60px 24px 20px;
}
.travel-generated-title { flex: 0 0 auto; }
.travel-default-workspace {
    display: block;
    padding-top: 18px;
}
.travel-generated-summary {
    color: var(--travel-control-color);
}
.travel-city-cover {
    width: 100%;
    aspect-ratio: 16 / 9;
    margin: 0;
    overflow: hidden;
    border: 1px solid rgba(176, 139, 110, .38);
    border-radius: 5px;
    background: rgba(139, 157, 131, .16);
}
.travel-city-cover img,
.travel-city-cover-empty {
    width: 100%;
    height: 100%;
    display: block;
}
.travel-city-cover img {
    object-fit: cover;
}
.travel-city-cover-empty {
    display: grid;
    place-items: center;
    color: var(--travel-label-color);
    font-family: var(--travel-control-font);
    font-size: 15px;
    font-weight: 700;
}
.travel-city-introduction {
    padding: 18px 4px 20px;
    border-bottom: 1px solid rgba(176, 139, 110, .3);
    text-align: center;
}
.travel-city-introduction h3 {
    margin: 0;
    color: #173e2f;
    font-family: var(--travel-control-font);
    font-size: 24px;
    font-weight: 900;
    line-height: 1.3;
}
.travel-city-introduction p {
    margin: 12px 0 0;
    color: var(--travel-control-color);
    font-family: var(--travel-control-font);
    font-size: 14px;
    font-weight: 700;
    line-height: 1.85;
    text-align: justify;
    text-indent: 2em;
    text-justify: inter-ideograph;
}
.travel-generated-facts {
    display: block;
    margin: 0;
    padding: 0;
}
.travel-generated-fact {
    min-width: 0;
    display: grid;
    grid-template-columns: 76px minmax(0, 1fr);
    align-items: baseline;
    column-gap: 20px;
    padding: 8px 2px;
}
.travel-generated-fact dt {
    margin: 0;
    color: var(--travel-label-color);
    font-family: var(--travel-label-font);
    font-size: 12px;
    font-weight: 700;
    line-height: 1.45;
}
.travel-generated-fact dd {
    margin: 0;
    color: var(--travel-control-color);
    font-family: var(--travel-control-font);
    font-size: 14px;
    font-weight: 700;
    line-height: 1.45;
    overflow-wrap: anywhere;
}
.travel-ai-panel:has(.travel-default-workspace) .travel-head-actions {
    margin-top: auto;
}

.travel-ai-message { margin-bottom: 14px; padding: 14px; border-radius: 20px 20px 20px 5px; background: rgba(139, 157, 131, .22); }
.travel-ai-message span { color: var(--trip-moss); font-size: 11px; font-weight: 900; }
.travel-ai-message p { margin: 6px 0 0; color: #4f5939; font-family: "Noto Serif SC", "Songti SC", serif; font-size: 13px; line-height: 1.7; }
.travel-edit-context {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin: 0 0 14px;
    padding: 12px 13px;
    border: 1px solid rgba(198, 107, 61, .38);
    border-radius: 16px;
    background: rgba(198, 107, 61, .09);
}
.travel-edit-context div { min-width: 0; }
.travel-edit-context span,
.travel-edit-context strong { display: block; }
.travel-edit-context span { color: var(--trip-terra); font-size: 10px; font-weight: 900; }
.travel-edit-context strong {
    margin-top: 4px;
    color: var(--trip-moss);
    font-family: "Noto Serif SC", "Songti SC", serif;
    font-size: 13px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.travel-edit-context button {
    flex: 0 0 auto;
    min-height: 32px;
    padding: 0 10px;
    border: 1px solid rgba(96, 108, 56, .32);
    border-radius: 13px;
    color: #59623f;
    background: rgba(212, 184, 149, .34);
    font-size: 10px;
    font-weight: 800;
}
.travel-ai-composer { display: grid; gap: 8px; }
.travel-ai-composer > label,.travel-scope-row label { color: #6c7355; font-size: 11px; font-weight: 800; }
.travel-ai-composer textarea { width: 100%; min-height: 118px; resize: vertical; padding: 13px; border: 1px solid rgba(176, 139, 110, .55); border-radius: 18px; outline: 0; color: #414b30; background: rgba(212, 184, 149, .32); line-height: 1.6; }
.travel-ai-composer textarea:focus,.travel-map-search input:focus { border-color: var(--trip-terra); box-shadow: 0 0 0 3px rgba(198, 107, 61, .15); }
.travel-scope-row { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.travel-scope-row label { display: grid; gap: 5px; }
.travel-scope-row select { min-width: 0; height: 42px; padding: 0 8px; border: 1px solid rgba(176, 139, 110, .5); border-radius: 15px; color: #414b30; background: var(--trip-sand); }
.travel-scope-row button { align-self: end; min-height: 42px; padding: 0 10px; border: 1px solid var(--trip-moss); border-radius: 15px; color: var(--trip-sand); background: var(--trip-moss); font-size: 12px; font-weight: 900; }

.travel-guardrails { margin: 17px 0; padding: 13px 14px; border: 1px solid rgba(176, 139, 110, .32); border-radius: 18px; background: rgba(212, 184, 149, .22); }
.travel-guardrails h4,.travel-map-search h4 { margin: 0 0 9px; color: var(--trip-moss); font-size: 13px; }
.travel-guardrails p { position: relative; margin: 5px 0; padding-left: 14px; color: #70785b; font-size: 11px; }
.travel-guardrails p::before { content: ""; position: absolute; left: 0; top: .45em; width: 6px; height: 6px; border-radius: 50%; background: var(--trip-ochre); }
.travel-map-search { padding-top: 16px; border-top: 1px solid rgba(96, 108, 56, .2); }
.travel-map-search form { display: grid; grid-template-columns: 1fr auto; gap: 6px; }
.travel-map-search input { min-width: 0; height: 40px; padding: 0 11px; border: 1px solid rgba(176, 139, 110, .48); border-radius: 15px; outline: 0; color: #414b30; background: rgba(212, 184, 149, .25); }
.travel-map-search form button,.travel-map-pick-btn { border: 1px solid var(--trip-clay); border-radius: 15px; color: #4f5939; background: var(--trip-oat); font-size: 11px; font-weight: 900; }
.travel-map-search form button { padding: 0 12px; }
.travel-add-day { display: grid; grid-template-columns: 58px 1fr; align-items: center; gap: 7px; margin-top: 7px; color: #6c7355; font-size: 10px; font-weight: 900; }
.travel-add-day select { min-width: 0; height: 36px; padding: 0 8px; border: 1px solid rgba(176, 139, 110, .45); border-radius: 14px; color: #4f5939; background: rgba(212, 184, 149, .28); font-size: 10px; }
.travel-map-pick-btn { width: 100%; min-height: 38px; margin-top: 7px; }
.travel-search-results { display: grid; gap: 6px; margin-top: 8px; }
.travel-search-results button { display: grid; gap: 3px; padding: 9px 11px; border: 1px solid rgba(176, 139, 110, .35); border-radius: 14px; color: #465033; background: rgba(139, 157, 131, .12); text-align: left; }
.travel-search-results span { color: #777e63; font-size: 10px; }

.travel-map-panel { position: absolute; inset: 0; z-index: 0; min-width: 0; min-height: 0; overflow: hidden; background: var(--trip-sage); }
.travel-day-tabs { position: absolute; z-index: 3; left: 18px; top: 18px; display: flex; gap: 7px; }
.travel-planner:not(.travel-planner-empty) .travel-day-tabs {
    left: 50%;
    transform: translateX(-50%);
}
.travel-day-tabs button { min-width: 76px; padding: 8px 12px; border: 1px solid rgba(232, 220, 199, .64); border-radius: 5px; color: #4a5434; background: url("/assets/pages/heritage-atlas/heritage-card-background.jpg") center bottom / 100% 100% no-repeat; box-shadow: 0 10px 22px rgba(96, 108, 56, .2); }
.travel-day-tabs button span,.travel-day-tabs button b { display: block; }
.travel-day-tabs button span { font-size: 10px; }
.travel-day-tabs button b { margin-top: 2px; font-size: 13px; }
.travel-day-tabs button.active { color: #0e403a; border-color: rgba(176, 139, 110, .86); background: linear-gradient(rgba(212, 184, 149, .3), rgba(212, 184, 149, .3)), url("/assets/pages/heritage-atlas/heritage-card-background.jpg") center bottom / 100% 100% no-repeat; }
.travel-map-meta { position: absolute; z-index: 3; left: 18px; top: 88px; max-width: 310px; display: grid; gap: 3px; padding: 11px 14px; border-radius: 18px; color: #495333; background: rgba(232, 220, 199, .92); box-shadow: 0 12px 24px rgba(96, 108, 56, .22); }
.travel-map-meta b { font-family: "Noto Serif SC", "Songti SC", serif; font-size: 14px; }
.travel-map-meta span { color: #757c5e; font-size: 10px; }
.travel-map-canvas { position: absolute; inset: 0; overflow: hidden; background: var(--trip-sage); }
.travel-amap-canvas .amap-layers { filter: sepia(.08) saturate(.88) contrast(.95) brightness(1.02); }
.travel-amap-canvas::after { content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none; opacity: .035; mix-blend-mode: multiply; background: #eadfca; }
.travel-amap-canvas .amap-logo,
.travel-amap-canvas .amap-copyright { opacity: .58 !important; filter: saturate(.35); }
.travel-amap-canvas .amap-toolbar,
.travel-amap-canvas .amap-scalecontrol { opacity: .72; transition: opacity .3s ease; }
.travel-amap-canvas .amap-toolbar:hover,
.travel-amap-canvas .amap-scalecontrol:hover { opacity: 1; }
.travel-planner .travel-map-legend { position: absolute; z-index: 3; right: 18px; bottom: 16px; display: flex; gap: 12px; padding: 9px 12px; border: 0; border-radius: 16px; color: #60694a; background: rgba(232, 220, 199, .9); font-size: 10px; }
.travel-planner .travel-map-legend span::before { content: ""; display: inline-block; width: 7px; height: 7px; margin-right: 5px; border-radius: 50%; background: var(--trip-terra); }
.travel-planner .travel-map-legend .meal::before { background: var(--trip-ochre); }
.travel-planner .travel-map-legend .route::before { width: 13px; height: 3px; border-radius: 2px; background: #c5522f; vertical-align: middle; }

.travel-timeline { position: relative; display: grid; gap: 8px; padding-left: 3px; }
.travel-timeline::before { content: ""; position: absolute; left: 48px; top: 12px; bottom: 12px; width: 2px; border-radius: 2px; background: rgba(176, 139, 110, .45); }
.travel-stop-card { position: relative; display: grid; grid-template-columns: 46px minmax(0, 1fr); gap: 10px; padding: 11px; border: 1px solid transparent; border-radius: 20px; background: rgba(212, 184, 149, .18); transition: background .35s, border-color .35s, transform .35s; cursor: pointer; }
.travel-stop-card:hover,.travel-stop-card.active { border-color: rgba(198, 107, 61, .48); background: rgba(212, 184, 149, .42); transform: translateX(-3px); }
.travel-time { position: relative; z-index: 1; display: grid; align-content: start; justify-items: start; padding-top: 2px; }
.travel-time::after { content: ""; position: absolute; right: -10px; top: 7px; width: 10px; height: 10px; border: 3px solid var(--trip-sand); border-radius: 50%; background: var(--trip-terra); }
.travel-time b { color: #4d5738; font-size: 12px; }
.travel-time span { color: #858a71; font-size: 9px; }
.travel-stop-copy { min-width: 0; }
.travel-card-kicker { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.travel-card-kicker > span { color: var(--trip-terra); font-size: 10px; font-weight: 900; }
.travel-card-kicker button,.travel-transport-lock { padding: 3px 7px; border: 1px solid rgba(96, 108, 56, .28); border-radius: 12px; color: #6d7456; background: rgba(139, 157, 131, .13); font-size: 9px; font-weight: 800; }
.travel-stop-copy h4 { margin: 4px 0; color: #465032; font-family: "Noto Serif SC", "Songti SC", serif; font-size: 15px; }
.travel-stop-copy > p { display: -webkit-box; margin: 0; overflow: hidden; color: #6c7357; font-family: "Noto Serif SC", "Songti SC", serif; font-size: 11px; line-height: 1.55; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.travel-stop-copy details { margin-top: 8px; }
.travel-stop-copy summary { color: var(--trip-moss); font-size: 10px; font-weight: 900; cursor: pointer; }
.travel-stop-copy dl { display: grid; gap: 6px; margin: 9px 0 0; }
.travel-stop-copy dl div { display: grid; grid-template-columns: 72px minmax(0, 1fr); gap: 7px; }
.travel-stop-copy dt { color: #81866d; font-size: 9px; }
.travel-stop-copy dd { margin: 0; color: #586044; font-family: "Noto Serif SC", "Songti SC", serif; font-size: 10px; line-height: 1.5; }
.travel-transport-card { position: relative; display: grid; grid-template-columns: 28px 48px 1fr auto; align-items: center; gap: 7px; min-height: 38px; margin-left: 42px; padding: 5px 9px; border: 1px dashed rgba(176, 139, 110, .55); border-radius: 16px; color: #70775a; background: rgba(139, 157, 131, .12); text-align: left; font-size: 10px; }
.travel-transport-card:hover,.travel-transport-card.active { color: #4d5638; border-color: var(--trip-terra); background: rgba(198, 107, 61, .12); }
.travel-transport-line { height: 3px; border-radius: 3px; background: var(--trip-terra); }
.travel-transport-mode { color: #4e5839; font-weight: 900; }

.travel-amap-marker {
    --travel-marker-label-shift-y: 0px;
    position: relative;
    width: 28px;
    height: 28px;
    display: block;
    overflow: visible;
    padding: 0;
    border: 0;
    border-radius: 50%;
    color: #f7ead0;
    background: transparent;
    font-family: "Epilogue", "Greycliff CF", Arial, sans-serif;
    cursor: pointer;
}
.travel-amap-marker-index {
    position: relative;
    z-index: 2;
    width: 28px;
    height: 28px;
    display: grid;
    place-items: center;
    border: 1px solid #e8dcc7;
    border-radius: 50%;
    color: #fff4d8;
    background: #c08e3a;
    box-shadow: 0 3px 8px rgba(49, 53, 32, .24);
    font-size: 11px;
    font-weight: 900;
    font-variant-numeric: tabular-nums;
    line-height: 1;
    transition: transform .32s ease, box-shadow .32s ease, border-color .32s ease;
}
.travel-amap-marker-name {
    position: absolute;
    z-index: 1;
    box-sizing: border-box;
    width: max-content;
    max-width: none;
    min-height: 24px;
    display: block;
    overflow: visible;
    padding: 4px 9px;
    border: 1px solid #b08b6e;
    border-radius: 5px;
    color: #3f492d;
    background: #e8dcc7;
    box-shadow: 0 3px 8px rgba(49, 53, 32, .18);
    font-family: "Noto Serif SC", "Songti SC", serif;
    font-size: 12px;
    font-weight: 800;
    line-height: 1.35;
    text-overflow: clip;
    white-space: nowrap;
    pointer-events: none;
    transition: opacity .22s ease, visibility .22s ease, background-color .22s ease;
}
.travel-amap-marker-label-right .travel-amap-marker-name {
    left: 34px;
    top: calc(50% + var(--travel-marker-label-shift-y));
    transform: translateY(-50%);
}
.travel-amap-marker-label-left .travel-amap-marker-name {
    right: 34px;
    top: calc(50% + var(--travel-marker-label-shift-y));
    transform: translateY(-50%);
}
.travel-amap-marker-label-above .travel-amap-marker-name {
    left: 50%;
    bottom: 34px;
    transform: translateX(-50%);
}
.travel-amap-marker-label-below .travel-amap-marker-name {
    left: 50%;
    top: 34px;
    transform: translateX(-50%);
}
.travel-amap-marker-service .travel-amap-marker-index,
.travel-amap-marker-candidate .travel-amap-marker-index { color: #fff4d8; background: #c08e3a; }
.travel-amap-marker.active .travel-amap-marker-index {
    border-color: #f1d39a;
    box-shadow: 0 0 0 3px rgba(198, 107, 61, .14), 0 3px 8px rgba(49, 53, 32, .2);
    transform: scale(1.08);
}
.travel-amap-marker:hover .travel-amap-marker-index { transform: scale(1.06); }
.travel-amap-marker.active:hover .travel-amap-marker-index { transform: scale(1.12); }
.travel-amap-marker.is-label-collapsed .travel-amap-marker-name {
    visibility: hidden;
    opacity: 0;
}
.travel-amap-marker.is-label-collapsed:hover .travel-amap-marker-name,
.travel-amap-marker.is-label-collapsed:focus-visible .travel-amap-marker-name,
.travel-amap-marker.is-label-collapsed.active .travel-amap-marker-name {
    visibility: visible;
    opacity: 1;
    background: #e8dcc7;
}
.travel-amap-marker.is-sequence-hidden {
    opacity: 0;
    transform: translateY(12px) scale(.72);
    pointer-events: none;
}
.travel-amap-marker.is-sequence-visible {
    animation: travel-amap-marker-enter .68s cubic-bezier(.18, .82, .22, 1) both;
}
@keyframes travel-amap-marker-enter {
    from { opacity: 0; transform: translateY(12px) scale(.72); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}
@media (prefers-reduced-motion: reduce) {
    .travel-amap-marker.is-sequence-hidden { opacity: 1; transform: none; }
    .travel-amap-marker.is-sequence-visible { animation: none; }
}
.travel-map-pick-btn.active { color: var(--trip-sand); border-color: var(--trip-terra); background: var(--trip-terra); }

.travel-stop-image { width: 100%; height: 92px; display: block; margin: 8px 0; border-radius: 14px; object-fit: cover; background: rgba(139, 157, 131, .15); }
.travel-stop-image-empty { display: grid; place-items: center; border: 1px dashed rgba(96, 108, 56, .3); color: #7b8169; font-size: 9px; }
.travel-stop-address { margin-bottom: 5px !important; color: #8a795f !important; font-size: 9px !important; -webkit-line-clamp: 1 !important; }
.travel-card-actions { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 9px; }
.travel-card-actions button,.travel-transport-actions button { min-height: 26px; padding: 0 8px; border: 1px solid rgba(96, 108, 56, .28); border-radius: 11px; color: #59623f; background: rgba(232, 220, 199, .7); font-size: 9px; font-weight: 900; }
.travel-card-actions button:disabled { cursor: not-allowed; opacity: .4; }
.travel-transport-card { grid-template-columns: 24px minmax(0, 1fr); align-items: start; min-height: 76px; padding: 9px 10px; cursor: pointer; }
.travel-transport-line { width: 22px; margin-top: 7px; }
.travel-transport-line.mode-taxi { background: repeating-linear-gradient(90deg, var(--trip-terra) 0 7px, transparent 7px 11px); }
.travel-transport-line.mode-transit { background: repeating-linear-gradient(90deg, #5889a5 0 10px, transparent 10px 14px); }
.travel-transport-line.mode-subway { height: 4px; border: 1px solid #73508f; background: repeating-linear-gradient(90deg, #8a63b8 0 8px, #e8dcc7 8px 11px); }
.travel-transport-line.mode-walking { background: repeating-linear-gradient(90deg, var(--trip-ochre) 0 3px, transparent 3px 7px); }
.travel-transport-line.mode-cycling { background: repeating-linear-gradient(90deg, #739d78 0 7px, transparent 7px 10px); }
.travel-transport-copy { min-width: 0; display: grid; gap: 4px; }
.travel-transport-copy > div { display: flex; justify-content: space-between; gap: 8px; }
.travel-transport-copy b { color: #4e5839; font-size: 10px; }
.travel-transport-copy span { color: var(--trip-terra); font-size: 9px; font-weight: 900; white-space: nowrap; }
.travel-transport-copy p { margin: 0; color: #737a5e; font-size: 9px; line-height: 1.45; }
.travel-transport-copy small { color: #858a70; font-size: 8px; line-height: 1.4; }
.travel-transport-actions { grid-column: 2; display: flex; flex-wrap: wrap; gap: 5px; margin-top: 3px; }

/* Compact generated-itinerary timeline */
.travel-timeline { gap: 10px; padding-left: 0; }
.travel-timeline::before { left: 51px; top: 10px; bottom: 10px; background: rgba(176, 139, 110, .34); }
.travel-stop-card {
    grid-template-columns: 50px minmax(0, 1fr);
    gap: 8px;
    padding: 10px;
    border: 1px solid rgba(176, 139, 110, .28);
    border-radius: 8px;
    background: rgba(232, 220, 199, .32);
}
.travel-stop-card:hover,
.travel-stop-card.active {
    border-color: rgba(198, 107, 61, .52);
    background: rgba(212, 184, 149, .34);
    transform: none;
}
.travel-time::after { right: -8px; width: 9px; height: 9px; border-width: 2px; }
.travel-time b { font-size: 12px; }
.travel-time span { font-size: 9px; }
.travel-card-kicker { margin-bottom: 8px; }
.travel-card-kicker > span { font-size: 10px; }
.travel-card-kicker button,
.travel-transport-lock {
    min-height: 25px;
    padding: 0 7px;
    border-radius: 7px;
    font-size: 9px;
}
.travel-stop-overview {
    display: grid;
    grid-template-columns: 96px minmax(0, 1fr);
    align-items: start;
    gap: 10px;
}
.travel-stop-image {
    width: 96px;
    height: 72px;
    margin: 0;
    border-radius: 6px;
}
.travel-stop-image-empty { padding: 6px; font-size: 9px; }
.travel-stop-copy h4 {
    margin: 0;
    font-size: 14px;
    line-height: 1.4;
}
.travel-stop-address {
    margin: 4px 0 0 !important;
    color: rgba(76, 86, 45, .64) !important;
    font-family: "Epilogue", "Greycliff CF", Arial, sans-serif !important;
    font-size: 9px !important;
    line-height: 1.45 !important;
}
.travel-stop-details { margin-top: 6px !important; }
.travel-stop-details > summary {
    color: var(--heritage-muted);
    font-family: "Epilogue", "Greycliff CF", Arial, sans-serif;
    font-size: 10px;
    font-weight: 700;
}
.travel-stop-details dl {
    gap: 5px;
    margin-top: 8px;
    padding: 8px;
    border-left: 2px solid rgba(176, 139, 110, .36);
    background: rgba(232, 220, 199, .34);
}
.travel-stop-details dl div { grid-template-columns: 54px minmax(0, 1fr); gap: 6px; }
.travel-stop-details dt { font-size: 9px; }
.travel-stop-details dd { font-size: 9px; line-height: 1.45; }
.travel-card-actions {
    align-items: center;
    gap: 6px;
    margin-top: 9px;
}
.travel-card-actions > button,
.travel-card-more > summary,
.travel-card-more button,
.travel-transport-actions button {
    min-height: 27px;
    padding: 0 8px;
    border: 1px solid rgba(96, 108, 56, .28);
    border-radius: 7px;
    color: #59623f;
    background: rgba(232, 220, 199, .68);
    font-family: "Epilogue", "Greycliff CF", Arial, sans-serif;
    font-size: 9px;
    font-weight: 800;
}
.travel-card-more { position: relative; margin: 0; }
.travel-card-more > summary {
    display: flex;
    align-items: center;
    list-style: none;
    cursor: pointer;
}
.travel-card-more > summary::-webkit-details-marker { display: none; }
.travel-card-more > div {
    position: absolute;
    z-index: 20;
    top: calc(100% + 5px);
    right: 0;
    width: 104px;
    display: grid;
    gap: 5px;
    padding: 6px;
    border: 1px solid rgba(176, 139, 110, .4);
    border-radius: 8px;
    background: rgba(232, 220, 199, .98);
    box-shadow: 0 12px 24px rgba(5, 18, 17, .18);
}
.travel-card-more button { width: 100%; text-align: left; }
.travel-transport-card {
    display: block;
    position: relative;
    height: auto;
    min-height: 78px !important;
    margin-left: 58px;
    padding: 10px 10px 10px 36px;
    border-radius: 8px;
    background: rgba(232, 220, 199, .28);
    overflow: visible;
}
.travel-transport-line {
    position: absolute;
    left: 10px;
    top: 16px;
    width: 18px;
    margin: 0;
}
.travel-transport-copy {
    display: grid;
    min-width: 0;
    gap: 3px;
    overflow: visible;
}
.travel-transport-copy b {
    display: -webkit-box;
    overflow: hidden;
    font-family: "Noto Serif SC", "Songti SC", serif;
    font-size: 10px;
    line-height: 1.45;
    text-overflow: ellipsis;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    white-space: normal;
}
.travel-transport-copy span {
    display: block;
    color: var(--trip-terra);
    font-size: 9px;
    font-weight: 800;
    line-height: 1.4;
}
.travel-transport-actions {
    position: static;
    grid-column: auto;
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    width: auto;
    margin-top: 8px;
}
.travel-transport-icon-wrap {
    position: absolute;
    left: 10px;
    top: 11px;
    width: 22px;
    height: 22px;
    display: grid;
    place-items: center;
}
.travel-transport-icon {
    display: block;
    width: 20px;
    height: 20px;
    object-fit: contain;
}
.travel-transport-icon-wrap .travel-transport-line {
    position: static;
    width: 18px;
}

/* 行程时间轴：地点卡与交通卡 */
.travel-timeline-panel .travel-timeline {
    gap: 16px;
    padding: 4px 2px 22px 0;
}

.travel-timeline-panel .travel-timeline::before {
    left: 56px;
    top: 14px;
    bottom: 24px;
    width: 1px;
    border-radius: 0;
    background: repeating-linear-gradient(
        180deg,
        rgba(198, 107, 61, .68) 0 4px,
        transparent 4px 8px
    );
}

.travel-timeline-panel .travel-stop-card,
.travel-timeline-panel .travel-transport-card {
    display: grid;
    grid-template-columns: 50px minmax(0, 1fr);
    align-items: start;
    gap: 14px;
    width: 100%;
    height: auto;
    min-height: 0 !important;
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    overflow: visible;
}

.travel-timeline-panel .travel-stop-card:hover,
.travel-timeline-panel .travel-stop-card.active,
.travel-timeline-panel .travel-transport-card:hover,
.travel-timeline-panel .travel-transport-card.active {
    border-color: transparent;
    background: transparent;
    transform: none;
}

.travel-timeline-panel .travel-time {
    padding-top: 16px;
    font-variant-numeric: tabular-nums;
}

.travel-timeline-panel .travel-time::after {
    right: -13px;
    top: 18px;
    width: 10px;
    height: 10px;
    border: 3px solid var(--trip-sand);
    background: var(--trip-terra);
    box-shadow: 0 0 0 1px rgba(198, 107, 61, .35);
}

.travel-timeline-panel .travel-transport-card .travel-time::after {
    border: 2px solid var(--trip-terra);
    background: var(--trip-sand);
    box-shadow: 0 0 0 3px var(--trip-sand);
}

.travel-timeline-panel .travel-time b {
    color: #35452f;
    font-family: "Epilogue", "Greycliff CF", Arial, sans-serif;
    font-size: 14px;
    font-weight: 800;
    letter-spacing: -.02em;
    display: block;
    transform: translate(10px, 8px);
}

.travel-timeline-panel .travel-time span {
    display: none;
}

.travel-timeline-panel .travel-stop-copy,
.travel-timeline-panel .travel-transport-body {
    min-width: 0;
    border: 1px solid rgba(176, 139, 110, .30);
    border-radius: 16px;
    background: rgba(232, 220, 199, .46);
    box-shadow: 0 9px 22px rgba(67, 71, 42, .08);
    transition: border-color .35s ease, background-color .35s ease, box-shadow .35s ease;
}

.travel-timeline-panel .travel-stop-copy {
    padding: 12px;
}

.travel-timeline-panel .travel-stop-card:hover .travel-stop-copy,
.travel-timeline-panel .travel-stop-card.active .travel-stop-copy,
.travel-timeline-panel .travel-transport-card:hover .travel-transport-body,
.travel-timeline-panel .travel-transport-card.active .travel-transport-body {
    border-color: rgba(198, 107, 61, .48);
    background: rgba(212, 184, 149, .32);
    box-shadow: 0 12px 26px rgba(67, 71, 42, .11);
}

.travel-timeline-panel .travel-card-kicker {
    margin: 0 0 10px;
}

.travel-timeline-panel .travel-card-kicker > span {
    min-height: 27px;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 0 9px;
    border-radius: 10px;
    color: var(--trip-terra);
    background: rgba(198, 107, 61, .10);
    font-family: "Noto Serif SC", "Songti SC", "Source Han Serif SC", serif;
    font-size: 11px;
}

.travel-timeline-panel .travel-card-kicker > span svg {
    width: 16px;
    height: 16px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.9;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.travel-timeline-panel .travel-card-kicker button,
.travel-timeline-panel .travel-transport-lock {
    min-height: 28px;
    padding: 0 9px;
    border-radius: 9px;
    color: var(--trip-moss);
    background: rgba(139, 157, 131, .15);
    font-size: 9px;
}

.travel-timeline-panel .travel-stop-overview {
    grid-template-columns: 112px minmax(0, 1fr);
    gap: 12px;
}

.travel-timeline-panel .travel-stop-image {
    width: 112px;
    height: 84px;
    border-radius: 10px;
}

.travel-timeline-panel .travel-stop-copy h4 {
    color: #35452f;
    font-size: 14px;
    line-height: 1.42;
}

.travel-timeline-panel .travel-stop-address {
    margin-top: 5px !important;
    font-size: 9px !important;
    line-height: 1.5 !important;
    -webkit-line-clamp: 2 !important;
}

.travel-timeline-panel .travel-stop-details {
    margin-top: 7px !important;
}

.travel-timeline-panel .travel-stop-details > summary {
    color: var(--trip-moss);
    font-size: 10px;
    font-weight: 800;
}

.travel-timeline-panel .travel-card-actions,
.travel-timeline-panel .travel-transport-actions {
    gap: 7px;
    margin-top: 11px;
}

.travel-timeline-panel .travel-card-actions > button,
.travel-timeline-panel .travel-card-more > summary,
.travel-timeline-panel .travel-card-more button,
.travel-timeline-panel .travel-transport-actions button {
    min-height: 30px;
    padding: 0 9px;
    border-radius: 9px;
    font-size: 9px;
}

.travel-timeline-panel .travel-transport-body {
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr);
    align-items: start;
    gap: 10px;
    min-height: 104px;
    padding: 13px;
    background: rgba(139, 157, 131, .11);
}

.travel-timeline-panel .travel-transport-icon-wrap {
    position: static;
    width: 42px;
    height: 42px;
    border: 1px solid rgba(96, 108, 56, .20);
    border-radius: 50%;
    background: rgba(232, 220, 199, .78);
}

.travel-timeline-panel .travel-transport-icon {
    width: 25px;
    height: 25px;
}

.travel-timeline-panel .travel-transport-icon-wrap .travel-transport-line {
    position: static;
    width: 22px;
    margin: 0;
}

.travel-timeline-panel .travel-transport-copy {
    gap: 5px;
    padding-top: 1px;
}

.travel-timeline-panel .travel-transport-copy b {
    color: #35452f;
    font-size: 11px;
    line-height: 1.5;
    -webkit-line-clamp: 2;
}

.travel-timeline-panel .travel-transport-copy span {
    color: var(--trip-terra);
    font-size: 10px;
    line-height: 1.45;
    white-space: normal;
}

.travel-timeline-panel .travel-transport-actions {
    grid-column: 2;
    display: flex;
    flex-wrap: wrap;
}

/* 稳定布局：时间在卡片外侧，卡片本体始终参与普通文档流 */
.travel-timeline-panel .travel-timeline {
    display: block;
    margin-inline: -12px;
    padding: 12px 2px 22px 0;
}

.travel-timeline-panel .travel-timeline::before {
    display: none;
}

.travel-timeline-panel .travel-stop-card,
.travel-timeline-panel .travel-transport-card {
    position: relative;
    display: block;
    box-sizing: border-box;
    width: calc(100% - 64px);
    height: auto;
    min-height: 0 !important;
    margin: 0 0 16px 64px;
    border: 1px solid rgba(176, 139, 110, .30);
    border-radius: 10px;
    overflow: visible;
    box-shadow: 0 9px 22px rgba(67, 71, 42, .08);
    transition: border-color .35s ease, background-color .35s ease, box-shadow .35s ease;
}

.travel-timeline-panel .travel-stop-card::after,
.travel-timeline-panel .travel-transport-card::after {
    content: "";
    position: absolute;
    z-index: 0;
    top: -16px;
    bottom: -17px;
    left: -14px;
    width: 1px;
    pointer-events: none;
    background: repeating-linear-gradient(
        180deg,
        rgba(198, 107, 61, .68) 0 4px,
        transparent 4px 8px
    );
}

.travel-timeline-panel .travel-timeline > article:first-child::after {
    top: 0;
}

.travel-timeline-panel .travel-stop-card {
    padding: 12px;
    background: rgba(232, 220, 199, .46);
}

.travel-timeline-panel .travel-transport-card {
    padding: 13px 6px;
    background: rgba(139, 157, 131, .11);
}

.travel-timeline-panel .travel-stop-card:hover,
.travel-timeline-panel .travel-stop-card.active,
.travel-timeline-panel .travel-transport-card:hover,
.travel-timeline-panel .travel-transport-card.active {
    border-color: rgba(198, 107, 61, .48);
    background: rgba(212, 184, 149, .32);
    box-shadow: 0 12px 26px rgba(67, 71, 42, .11);
}

.travel-timeline-panel .travel-time {
    position: absolute;
    left: -69px;
    top: -8px;
    width: 50px;
    padding-top: 0;
}

.travel-timeline-panel .travel-time::after {
    top: 8px;
}

.travel-timeline-panel .travel-transport-card .travel-time::after {
    top: 8px;
}

.travel-timeline-panel .travel-stop-copy,
.travel-timeline-panel .travel-transport-body,
.travel-timeline-panel .travel-stop-card:hover .travel-stop-copy,
.travel-timeline-panel .travel-stop-card.active .travel-stop-copy,
.travel-timeline-panel .travel-transport-card:hover .travel-transport-body,
.travel-timeline-panel .travel-transport-card.active .travel-transport-body {
    min-width: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    transform: none;
    transition: none;
}

.travel-timeline-panel .travel-card-kicker > span {
    gap: 7px;
}

.travel-timeline-panel .travel-stop-type-icon {
    width: 18px;
    height: 18px;
    display: block;
    flex: 0 0 auto;
    object-fit: contain;
}

.travel-timeline-panel .travel-card-kicker > span svg {
    display: none;
}

.travel-timeline-panel .travel-transport-body {
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr);
    align-items: start;
    gap: 10px;
    min-height: 0;
}

.travel-timeline-panel .travel-transport-actions {
    grid-column: 2;
}

.travel-timeline-panel .travel-stop-card:last-child,
.travel-timeline-panel .travel-transport-card:last-child {
    margin-bottom: 0;
}

/* 地点卡：紧凑信息条、3:2 主体和可展开的大模型详情 */
.travel-timeline-panel .travel-stop-card {
    padding: 8px;
    border-radius: 5px;
    background: rgba(255, 255, 255, .3);
}

.travel-timeline-panel .travel-stop-card:hover,
.travel-timeline-panel .travel-stop-card.active {
    background: rgba(255, 255, 255, .3);
}

.travel-timeline-panel .travel-stop-card .travel-card-kicker {
    min-height: 22px;
    margin: 0 0 7px;
}

.travel-timeline-panel .travel-stop-card .travel-card-kicker > span {
    min-height: 22px;
    box-sizing: border-box;
    padding: 0 6px;
    border-radius: 5px;
}

.travel-timeline-panel .travel-stop-card .travel-card-kicker > span {
    gap: 5px;
    font-family: "Noto Serif SC", "Songti SC", "Source Han Serif SC", serif;
    font-size: 10px;
    font-weight: 800;
    line-height: 1;
}

.travel-timeline-panel .travel-stop-card .travel-stop-type-icon {
    width: 15px;
    height: 15px;
}

.travel-timeline-panel .travel-stop-card .travel-stop-overview {
    grid-template-columns: 114px minmax(0, 1fr);
    align-items: stretch;
    gap: 10px;
}

.travel-timeline-panel .travel-stop-card .travel-stop-image {
    width: 114px;
    height: 76px;
    aspect-ratio: 3 / 2;
    margin: 0;
    border-radius: 5px;
    object-fit: cover;
}

.travel-timeline-panel .travel-stop-card .travel-stop-image-empty {
    min-height: 76px;
    padding: 5px;
    border-radius: 5px;
}

.travel-timeline-panel .travel-stop-main {
    min-width: 0;
    height: 100%;
    display: grid;
    grid-template-rows: auto auto auto;
    align-content: space-between;
    align-items: start;
    row-gap: 0;
}

.travel-timeline-panel .travel-stop-name,
.travel-timeline-panel .travel-stop-address {
    width: 100%;
    min-width: 0;
    display: block;
    margin: 0 !important;
    overflow: hidden;
    white-space: nowrap;
    -webkit-line-clamp: unset !important;
}

.travel-timeline-panel .travel-stop-name {
    color: var(--heritage-ink);
    font-family: "Songti SC", "STSong", "Source Han Serif SC", serif;
    font-size: 19px;
    font-weight: 900;
    line-height: 1.25;
}

.travel-timeline-panel .travel-stop-address {
    color: rgba(76, 86, 45, .66) !important;
    font-family: "Epilogue", "Greycliff CF", Arial, sans-serif !important;
    font-size: 12px !important;
    line-height: 1.25 !important;
}

.travel-timeline-panel [data-travel-marquee] > span {
    width: max-content;
    min-width: 100%;
    display: block;
    white-space: nowrap;
}

.travel-timeline-panel .travel-stop-card.active [data-travel-marquee].is-overflowing > span {
    animation: travel-stop-marquee var(--travel-marquee-duration, 4s) ease-in-out infinite alternate;
    will-change: transform;
}

@keyframes travel-stop-marquee {
    0%,
    18% {
        transform: translateX(0);
    }
    82%,
    100% {
        transform: translateX(calc(-1 * var(--travel-marquee-distance, 0px)));
    }
}

.travel-timeline-panel .travel-stop-inline-actions {
    min-width: 0;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    align-self: end;
    gap: 4px;
}

.travel-timeline-panel .travel-stop-inline-actions button {
    min-width: 0;
    min-height: 24px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 3px;
    padding: 0 4px;
    border: 1px solid rgba(176, 139, 110, .32);
    border-radius: 5px;
    color: #59623f;
    background: rgba(232, 220, 199, .42);
    font-family: "Noto Serif SC", "Songti SC", "Source Han Serif SC", serif;
    font-size: 10px;
    font-weight: 800;
    line-height: 1;
    cursor: pointer;
}

.travel-timeline-panel .travel-stop-inline-actions button:hover,
.travel-timeline-panel .travel-stop-inline-actions button[aria-expanded="true"] {
    border-color: rgba(176, 139, 110, .48);
    color: var(--trip-terra);
    background: rgba(232, 220, 199, .62);
}

.travel-timeline-panel .travel-stop-inline-actions img {
    width: 12px;
    height: 12px;
    display: block;
    flex: 0 0 auto;
    object-fit: contain;
}

.travel-timeline-panel .travel-stop-detail-panel {
    display: grid;
    grid-template-rows: 0fr;
    margin-top: 0;
    opacity: 0;
    visibility: hidden;
    transition:
        grid-template-rows .38s ease,
        margin-top .38s ease,
        opacity .26s ease,
        visibility 0s linear .38s;
}

.travel-timeline-panel .travel-stop-detail-clip {
    min-height: 0;
    overflow: hidden;
}

.travel-timeline-panel .travel-stop-detail-panel dl {
    display: grid;
    gap: 6px;
    margin: 0;
    padding: 8px;
    border: 1px solid rgba(176, 139, 110, .28);
    border-radius: 5px;
    background: rgba(232, 220, 199, .36);
    transform: translateY(-6px);
    transition: transform .38s ease;
}

.travel-timeline-panel .travel-stop-detail-panel dl > div {
    display: grid;
    grid-template-columns: 54px minmax(0, 1fr);
    gap: 7px;
}

.travel-timeline-panel .travel-stop-detail-panel dt {
    color: var(--trip-terra);
    font-size: 9px;
    font-weight: 800;
}

.travel-timeline-panel .travel-stop-detail-panel dd {
    margin: 0;
    color: #5f674d;
    font-size: 9px;
    line-height: 1.55;
}

.travel-timeline-panel .travel-stop-card.details-open .travel-stop-detail-panel,
.travel-timeline-panel .travel-transport-card.details-open .travel-stop-detail-panel {
    grid-template-rows: 1fr;
    margin-top: 8px;
    opacity: 1;
    visibility: visible;
    transition:
        grid-template-rows .38s ease,
        margin-top .38s ease,
        opacity .3s ease .06s,
        visibility 0s linear 0s;
}

.travel-timeline-panel .travel-stop-card.details-open .travel-stop-detail-panel dl,
.travel-timeline-panel .travel-transport-card.details-open .travel-stop-detail-panel dl {
    transform: translateY(0);
}

.travel-timeline-panel .travel-stop-card :is(
    .travel-card-kicker > span,
    button,
    .travel-stop-image,
    .travel-stop-image-empty,
    .travel-stop-detail-panel dl
) {
    border-radius: 5px;
}

/* 交通卡：交通图标、起终点线路与三枚操作按钮 */
.travel-timeline-panel .travel-transport-card {
    padding: 10px;
    border-radius: 5px;
}

.travel-timeline-panel .travel-transport-card,
.travel-timeline-panel .travel-transport-card:hover,
.travel-timeline-panel .travel-transport-card.active {
    background: rgba(255, 255, 255, .3);
}

.travel-timeline-panel .travel-transport-body {
    display: block;
    min-width: 0;
}

:is(.travel-timeline-panel, .travel-transport-workspace-card) .travel-transport-summary {
    min-width: 0;
    display: grid;
    grid-template-columns: 54px minmax(0, 1fr) auto;
    align-items: start;
    gap: 10px;
}

:is(.travel-timeline-panel, .travel-transport-workspace-card) .travel-transport-icon-wrap {
    position: static;
    width: 54px;
    height: 54px;
    box-sizing: border-box;
    border: 0;
    border-radius: 50%;
    background: rgba(232, 220, 199, .72);
}

:is(.travel-timeline-panel, .travel-transport-workspace-card) .travel-transport-icon {
    width: 54px;
    height: 54px;
    box-sizing: border-box;
    border: 2px solid #708550;
    border-radius: 50%;
}

:is(.travel-timeline-panel, .travel-transport-workspace-card) .travel-transport-icon.mode-taxi {
    border-color: rgb(227, 161, 5);
}

:is(.travel-timeline-panel, .travel-transport-workspace-card) .travel-transport-icon.mode-walking {
    border-color: rgb(112, 133, 80);
}

:is(.travel-timeline-panel, .travel-transport-workspace-card) .travel-transport-icon.mode-cycling {
    border-color: rgb(104, 125, 79);
}

:is(.travel-timeline-panel, .travel-transport-workspace-card) .travel-transport-icon.mode-bus {
    border-color: rgb(88, 136, 130);
}

:is(.travel-timeline-panel, .travel-transport-workspace-card) .travel-transport-icon.mode-subway {
    border-color: rgb(134, 113, 167);
}

:is(.travel-timeline-panel, .travel-transport-workspace-card) .travel-transport-icon-wrap .travel-transport-line {
    position: static;
    width: 28px;
    margin: 0;
}

:is(.travel-timeline-panel, .travel-transport-workspace-card) .travel-transport-route {
    position: relative;
    min-width: 0;
    height: 54px;
    display: grid;
    grid-template-rows: repeat(3, 18px);
}

:is(.travel-timeline-panel, .travel-transport-workspace-card) .travel-transport-route::before {
    content: "";
    position: absolute;
    left: 4px;
    top: 9px;
    width: 1px;
    height: 18px;
    background: rgba(96, 108, 56, .58);
}

:is(.travel-timeline-panel, .travel-transport-workspace-card) .travel-transport-point {
    position: relative;
    min-width: 0;
    display: flex;
    align-items: center;
    padding-left: 14px;
}

:is(.travel-timeline-panel, .travel-transport-workspace-card) .travel-transport-point i {
    position: absolute;
    left: 0;
    top: 50%;
    width: 8px;
    height: 8px;
    box-sizing: border-box;
    border: 2px solid var(--trip-moss);
    border-radius: 50%;
    background: var(--trip-sand);
    transform: translateY(-50%);
}

:is(.travel-timeline-panel, .travel-transport-workspace-card) .travel-transport-point:first-child i {
    background: var(--trip-moss);
}

:is(.travel-timeline-panel, .travel-transport-workspace-card) .travel-transport-point b {
    min-width: 0;
    display: block;
    overflow: hidden;
    color: #35452f;
    font-family: "Noto Serif SC", "Songti SC", "Source Han Serif SC", serif;
    font-size: 10px;
    font-weight: 700;
    line-height: 18px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

:is(.travel-timeline-panel, .travel-transport-workspace-card) .travel-transport-route > span {
    min-width: 0;
    display: block;
    padding-left: 14px;
    overflow: hidden;
    color: var(--trip-terra);
    font-family: "Noto Serif SC", "Songti SC", "Source Han Serif SC", serif;
    font-size: 10px;
    font-weight: 800;
    line-height: 18px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.travel-timeline-panel .travel-transport-actions {
    width: 100%;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    grid-column: auto;
    gap: 4px;
    margin-top: 8px;
}

.travel-timeline-panel .travel-transport-actions button {
    min-width: 0;
    min-height: 26px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    padding: 0 5px;
    border: 1px solid rgba(176, 139, 110, .32);
    border-radius: 5px;
    color: #59623f;
    background: rgba(232, 220, 199, .42);
    font-family: "Noto Serif SC", "Songti SC", "Source Han Serif SC", serif;
    font-size: 9px;
    font-weight: 800;
    line-height: 1;
    cursor: pointer;
}

.travel-timeline-panel .travel-transport-actions button:hover,
.travel-timeline-panel .travel-transport-actions button[aria-expanded="true"] {
    border-color: rgba(176, 139, 110, .48);
    color: var(--trip-terra);
    background: rgba(232, 220, 199, .62);
}

.travel-timeline-panel .travel-transport-actions img {
    width: 12px;
    height: 12px;
    display: block;
    flex: 0 0 auto;
    object-fit: contain;
}

.travel-timeline-panel :is(
    .travel-stop-inline-actions,
    .travel-transport-actions
) button img {
    display: none;
}

.travel-timeline-panel :is(
    .travel-stop-inline-actions,
    .travel-transport-actions
) button::before {
    content: "";
    width: 12px;
    height: 12px;
    display: block;
    flex: 0 0 auto;
    background: currentColor;
    -webkit-mask-position: center;
    mask-position: center;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-size: contain;
    mask-size: contain;
}

.travel-timeline-panel [data-travel-card-action="locate"]::before,
.travel-timeline-panel [data-travel-card-action="locate-segment"]::before {
    -webkit-mask-image: url("/assets/shared/travel-stop/locate.png");
    mask-image: url("/assets/shared/travel-stop/locate.png");
}

.travel-timeline-panel [data-travel-card-action="modify"]::before,
.travel-timeline-panel [data-travel-card-action="modify-segment"]::before {
    -webkit-mask-image: url("/assets/shared/travel-stop/edit.png");
    mask-image: url("/assets/shared/travel-stop/edit.png");
}

.travel-timeline-panel [data-travel-card-action="details"]::before {
    -webkit-mask-image: url("/assets/shared/travel-stop/details.png");
    mask-image: url("/assets/shared/travel-stop/details.png");
}

.travel-timeline-panel :is(
    .travel-stop-inline-actions,
    .travel-transport-actions
) button:is([aria-pressed="true"], [aria-expanded="true"]) {
    color: var(--trip-terra);
    border-color: var(--trip-terra);
    background: rgba(232, 220, 199, .62);
}

.travel-timeline-panel .travel-transport-detail-panel dl,
.travel-timeline-panel .travel-transport-card :is(
    .travel-transport-actions button
) {
    border-radius: 5px;
}

.travel-timeline-panel .travel-transport-detail-panel dl > div {
    grid-template-columns: 58px minmax(0, 1fr);
    align-items: start;
}

.travel-timeline-panel .travel-transport-detail-panel dt {
    padding-top: 1px;
}

:is(.travel-timeline-panel, .travel-transport-preview-card) .travel-transport-step-list {
    display: grid;
    gap: 7px;
    margin: 0;
    padding: 0;
    list-style: none;
}

:is(.travel-timeline-panel, .travel-transport-preview-card) .travel-transport-step-list li {
    position: relative;
    min-width: 0;
    display: grid;
    gap: 2px;
    padding-left: 13px;
}

:is(.travel-timeline-panel, .travel-transport-preview-card) .travel-transport-step-list li::before {
    content: "";
    position: absolute;
    left: 1px;
    top: 5px;
    z-index: 1;
    width: 6px;
    height: 6px;
    box-sizing: border-box;
    border: 1px solid var(--trip-moss);
    border-radius: 50%;
    background: var(--trip-sand);
}

:is(.travel-timeline-panel, .travel-transport-preview-card) .travel-transport-step-list li:not(:last-child)::after {
    content: "";
    position: absolute;
    left: 3.5px;
    top: 11px;
    bottom: -9px;
    width: 1px;
    background: rgba(96, 108, 56, .3);
}

:is(.travel-timeline-panel, .travel-transport-preview-card) .travel-transport-step-list li:is(.mode-transit, .mode-bus, .mode-subway)::before {
    border-color: var(--trip-terra);
    background: var(--trip-terra);
}

:is(.travel-timeline-panel, .travel-transport-preview-card) .travel-transport-step-heading {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 5px;
}

:is(.travel-timeline-panel, .travel-transport-preview-card) .travel-transport-step-heading strong {
    min-width: 0;
    color: #465437;
    font-size: 9px;
    line-height: 1.45;
}

:is(.travel-timeline-panel, .travel-transport-preview-card) .travel-transport-step-heading small {
    flex: 0 0 auto;
    padding: 1px 4px;
    border-radius: 5px;
    color: var(--trip-terra);
    background: rgba(198, 107, 61, .12);
    font-size: 8px;
    font-weight: 800;
    line-height: 1.35;
}

:is(.travel-timeline-panel, .travel-transport-preview-card) .travel-transport-step-list li > span {
    display: block;
    color: #687154;
    font-size: 9px;
    line-height: 1.5;
    overflow-wrap: anywhere;
}

:is(.travel-timeline-panel, .travel-transport-preview-card) .travel-transport-step-list .travel-transport-via-stops {
    color: rgba(76, 86, 45, .7);
    font-size: 8px;
}

@media (prefers-reduced-motion: reduce) {
    .travel-timeline-panel [data-travel-marquee].is-overflowing > span {
        animation: none;
        text-overflow: ellipsis;
        overflow: hidden;
    }
    .travel-timeline-panel .travel-stop-detail-panel,
    .travel-timeline-panel .travel-stop-detail-panel dl {
        transition: none;
    }
}

.travel-diff-list article.replace > span { background: var(--trip-terra); }
.travel-diff-list article small { display: block; margin-top: 4px; color: #8a7357; font-size: 10px; }
.travel-left-workspace {
    min-width: 0;
    padding-top: 16px;
    border-top: 1px solid rgba(176, 139, 110, .3);
    color: #465032;
}
.travel-left-workspace > header { position: sticky; top: -24px; z-index: 2; padding: 8px 0 12px; background: linear-gradient(180deg, rgba(232, 220, 199, .99) 76%, rgba(232, 220, 199, 0)); }
.travel-dining-tabs { display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px; margin-bottom: 14px; padding: 5px; border-radius: 18px; background: rgba(139, 157, 131, .14); }
.travel-dining-tabs button { min-height: 38px; border: 0; border-radius: 14px; color: #697153; background: transparent; font-weight: 850; cursor: pointer; }
.travel-dining-tabs button.active { color: var(--trip-sand); background: var(--trip-moss); box-shadow: 0 7px 18px rgba(96, 108, 56, .2); }
.travel-dining-search label,
.travel-dining-chat-form label { display: block; margin-bottom: 7px; color: #59623f; font-size: 11px; font-weight: 900; }
.travel-dining-search > div { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 7px; }
.travel-dining-search input,
.travel-dining-chat-form textarea { width: 100%; box-sizing: border-box; border: 1px solid rgba(96, 108, 56, .28); border-radius: 15px; color: #465032; background: rgba(232, 220, 199, .56); font: inherit; outline: 0; }
.travel-dining-search input { min-height: 42px; padding: 0 12px; }
.travel-dining-chat-form textarea { min-height: 82px; padding: 11px 12px; resize: vertical; line-height: 1.55; }
.travel-dining-search input:focus,
.travel-dining-chat-form textarea:focus { border-color: var(--trip-terra); box-shadow: 0 0 0 3px rgba(198, 107, 61, .1); }
.travel-dining-search button { min-height: 42px; padding: 0 17px; border: 0; border-radius: 15px; color: var(--trip-sand); background: var(--trip-terra); font-weight: 900; cursor: pointer; }
.travel-dining-search button:disabled { opacity: .6; cursor: wait; }
.travel-dining-message { width: 88%; box-sizing: border-box; padding: 10px 12px; border-radius: 18px 18px 18px 6px; background: rgba(139, 157, 131, .15); }
.travel-dining-message.user { justify-self: end; border-radius: 18px 18px 6px; background: rgba(198, 107, 61, .12); }
.travel-dining-message span { color: var(--trip-terra); font-size: 9px; font-weight: 900; }
.travel-dining-message p { margin: 3px 0 0; color: #556044; font-size: 11px; line-height: 1.55; }
.travel-dining-chat-form { display: grid; }
@keyframes travel-dining-map-pulse { 50% { box-shadow: 0 0 0 5px rgba(198, 107, 61, .12); } }
.travel-dining-error { margin: 10px 0; padding: 10px 12px; border-radius: 13px; color: #8d432d; background: rgba(198, 107, 61, .12); font-size: 11px; line-height: 1.5; }
.travel-dining-loading { margin-top: 12px; padding: 15px; border: 1px dashed rgba(96, 108, 56, .3); border-radius: 5px; color: #747b5f; font-size: 11px; line-height: 1.6; text-align: center; }
.travel-attraction-workspace,
.travel-dining-workspace {
    width: 100%;
    height: 100%;
    min-height: 0;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    padding-top: 0;
    border-top: 0;
}
.travel-ai-panel:has(.travel-attraction-workspace),
.travel-ai-panel:has(.travel-dining-workspace) {
    overflow: hidden;
}
.travel-attraction-workspace .travel-attraction-tabs,
.travel-dining-workspace .travel-attraction-tabs {
    margin-bottom: 14px;
    border-radius: 5px;
}
.travel-attraction-workspace .travel-attraction-action-tabs {
    flex: 0 0 auto;
    margin-top: 12px;
}
.travel-attraction-workspace .travel-attraction-tabs button,
.travel-dining-workspace .travel-attraction-tabs button {
    border-radius: 5px;
    color: var(--heritage-ink);
}
.travel-attraction-workspace .travel-attraction-tabs button.active,
.travel-dining-workspace .travel-attraction-tabs button.active {
    color: var(--trip-sand);
    background: var(--heritage-ink);
}
.travel-attraction-workspace [data-travel-attraction-search-form] input,
.travel-attraction-workspace [data-travel-attraction-search-form] button,
.travel-dining-workspace [data-travel-dining-search-form] input,
.travel-dining-workspace [data-travel-dining-search-form] button {
    border-radius: 5px;
}
.travel-attraction-map-picker {
    width: 100%;
    min-height: 44px;
    flex: 0 0 auto;
    border: 1px solid var(--trip-terra);
    border-radius: 15px;
    color: var(--trip-sand);
    background: var(--trip-terra);
    font-weight: 900;
    cursor: pointer;
}
.travel-attraction-map-picker.active {
    animation: travel-dining-map-pulse 1.8s ease-in-out infinite;
}
.travel-attraction-map-picker:disabled {
    cursor: wait;
    opacity: .6;
}
@media (prefers-reduced-motion: reduce) {
    .travel-attraction-map-picker.active { animation: none; }
}
.travel-attraction-workspace-card {
    width: 100%;
    box-sizing: border-box;
    display: grid;
    gap: 8px;
    padding: 10px;
    border: 1px solid rgba(176, 139, 110, .3);
    border-radius: 5px;
    color: #465032;
    background: rgba(255, 255, 255, .3);
    box-shadow: 0 9px 22px rgba(67, 71, 42, .08);
    text-align: left;
}
.travel-attraction-card-overview {
    min-width: 0;
    display: grid;
    grid-template-columns: 64px minmax(0, 1fr);
    gap: 10px;
    align-items: center;
}
.travel-attraction-card-image {
    width: 64px;
    height: 44px;
    display: block;
    border-radius: 6px;
    object-fit: cover;
    background: rgba(139, 157, 131, .16);
}
.travel-attraction-card-image.empty {
    display: grid;
    place-items: center;
    padding: 6px;
    box-sizing: border-box;
    color: #7b8169;
    border: 1px dashed rgba(96, 108, 56, .3);
    font-size: 9px;
    text-align: center;
}
.travel-attraction-card-main {
    min-width: 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 4px;
}
.travel-attraction-card-main > strong,
.travel-attraction-card-main > span {
    min-width: 0;
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.travel-attraction-card-main > strong {
    color: var(--heritage-ink);
    font-family: "Songti SC", "STSong", "Source Han Serif SC", serif;
    font-size: 19px;
    font-weight: 900;
    line-height: 24px;
}
.travel-attraction-card-main > span {
    color: rgba(76, 86, 45, .66);
    font-family: "Epilogue", "Greycliff CF", Arial, sans-serif;
    font-size: 12px;
    line-height: 16px;
}
.travel-attraction-workspace-card > p {
    margin: 0;
    color: #697153;
    font-size: 9px;
    line-height: 1.5;
}
.travel-attraction-workspace-card.choice {
    cursor: pointer;
    transition: transform .24s ease, border-color .24s ease, background .24s ease, box-shadow .24s ease;
}
.travel-attraction-workspace-card.choice:hover,
.travel-attraction-workspace-card.choice.selected {
    border-color: var(--trip-terra);
    background: rgba(198, 107, 61, .08);
}
.travel-attraction-workspace-card.choice:hover { transform: translateY(-1px); }
.travel-attraction-workspace-card.choice:focus-visible {
    outline: 2px solid var(--trip-terra);
    outline-offset: 2px;
}
.travel-attraction-candidates {
    display: grid;
    gap: 8px;
    margin-top: 12px;
}
.travel-attraction-results-viewport {
    min-height: 0;
    flex: 1 1 auto;
    overflow-y: auto;
    overscroll-behavior: contain;
}
.travel-attraction-ai-chat {
    min-height: 0;
    flex: 1 1 auto;
    display: grid;
    align-content: start;
    gap: 10px;
    overflow-y: auto;
    overscroll-behavior: contain;
    padding: 2px 2px 10px;
}
.travel-attraction-ai-chat .travel-dining-message {
    margin: 0;
}
.travel-attraction-ai-chat .travel-attraction-ai-recommendation {
    width: 100%;
}
.travel-attraction-ai-recommendation .travel-attraction-candidates {
    margin-top: 10px;
}
.travel-attraction-ai-recommendation .travel-attraction-workspace-card {
    background: rgba(232, 220, 199, .55);
}
.travel-attraction-ai-composer {
    flex: 0 0 auto;
    padding-top: 10px;
}
.travel-attraction-ai-composer > div {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 8px;
    align-items: end;
}
.travel-attraction-ai-composer textarea {
    min-height: 58px;
    max-height: 92px;
    resize: none;
}
.travel-attraction-ai-composer > div > button {
    min-height: 42px;
    padding: 0 17px;
    border: 0;
    border-radius: 15px;
    color: var(--trip-sand);
    background: var(--trip-terra);
    font-weight: 900;
    cursor: pointer;
}
.travel-attraction-ai-composer > div > button:disabled {
    cursor: wait;
    opacity: .6;
}
.travel-attraction-candidate-expansion {
    display: grid;
    grid-template-rows: 0fr;
    margin-top: 0;
    padding-top: 0;
    overflow: hidden;
    border-top: 1px solid transparent;
    opacity: 0;
    transition: grid-template-rows .34s ease, margin-top .34s ease, padding-top .34s ease, border-color .34s ease, opacity .22s ease;
}
.travel-attraction-candidate-expansion.is-visible {
    grid-template-rows: 1fr;
    margin-top: 4px;
    padding-top: 10px;
    border-top-color: rgba(176, 139, 110, .35);
    opacity: 1;
}
.travel-attraction-candidate-expansion > * {
    min-height: 0;
    overflow: hidden;
}
.travel-attraction-workspace-card.choice.selected {
    cursor: default;
}
.travel-attraction-workspace-card.choice.selected:hover {
    transform: none;
}
.travel-attraction-duration-select {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    padding: 0;
    color: var(--trip-moss);
    font-size: 11px;
    font-weight: 800;
}
.travel-attraction-duration-editor {
    min-height: 0;
    flex: 1 1 auto;
    padding-top: 2px;
}
.travel-attraction-duration-editor-control {
    padding: 16px 14px;
    border: 1px solid rgba(176, 139, 110, .3);
    border-radius: 5px;
    background: rgba(255, 255, 255, .3);
    box-shadow: 0 9px 22px rgba(67, 71, 42, .08);
}
.travel-attraction-duration-editor-control > p {
    margin: 12px 0 0;
    padding-top: 10px;
    border-top: 1px solid rgba(176, 139, 110, .3);
    color: rgba(76, 86, 45, .7);
    font-size: 11px;
    line-height: 1.5;
}
.travel-attraction-duration-stepper {
    display: grid;
    grid-template-columns: 32px minmax(104px, 124px) 32px;
    gap: 5px;
    align-items: center;
}
.travel-attraction-duration-stepper button,
.travel-attraction-duration-stepper output {
    min-height: 32px;
    box-sizing: border-box;
    border-radius: 5px;
    color: var(--heritage-ink);
    background: rgba(236, 224, 201, .58);
}
.travel-attraction-duration-stepper button {
    display: grid;
    place-items: center;
    padding: 0;
    border: 1px solid rgba(176, 139, 110, .42);
    font: 700 19px/1 Arial, sans-serif;
    cursor: pointer;
}
.travel-attraction-duration-stepper button:hover:not(:disabled) {
    border-color: var(--trip-terra);
    background: rgba(198, 107, 61, .12);
}
.travel-attraction-duration-stepper button:focus-visible {
    outline: 2px solid var(--trip-terra);
    outline-offset: 2px;
}
.travel-attraction-duration-stepper button:disabled {
    cursor: not-allowed;
    opacity: .45;
}
.travel-attraction-duration-stepper output {
    display: grid;
    place-items: center;
    padding: 0 9px;
    border: 1px solid rgba(176, 139, 110, .36);
    font-size: 12px;
    white-space: nowrap;
}
@media (prefers-reduced-motion: reduce) {
    .travel-attraction-candidate-expansion { transition: none; }
}
.travel-attraction-preview-details {
    max-height: 210px;
    overflow-y: auto;
    overscroll-behavior: contain;
    padding: 10px;
    border: 1px solid rgba(176, 139, 110, .28);
    border-radius: 5px;
    background: rgba(232, 220, 199, .36);
}
.travel-attraction-preview-details dl {
    display: grid;
    gap: 7px;
    margin: 0;
}
.travel-attraction-preview-details dl > div {
    display: grid;
    grid-template-columns: 78px minmax(0, 1fr);
    gap: 8px;
}
.travel-attraction-preview-details dt {
    color: var(--trip-terra);
    font-size: 9px;
    font-weight: 800;
}
.travel-attraction-preview-details dd {
    min-width: 0;
    margin: 0;
    color: #5f674d;
    font-size: 9px;
    line-height: 1.55;
    overflow-wrap: anywhere;
}
.travel-attraction-confirm {
    flex: 0 0 auto;
    margin-top: 0;
    padding-top: 12px;
}
.travel-attraction-confirm button {
    width: 100%;
    min-height: 44px;
    border: 1px solid var(--trip-moss);
    border-radius: 18px;
    color: var(--trip-sand);
    background: var(--trip-moss);
    font-family: "Noto Serif SC", "Songti SC", serif;
    font-size: 14px;
    font-weight: 900;
}
.travel-attraction-confirm button:disabled {
    cursor: not-allowed;
    color: rgba(76, 86, 45, .5);
    border-color: rgba(96, 108, 56, .24);
    background: rgba(139, 157, 131, .12);
}
.travel-attraction-add-confirm {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
}
.travel-diff-panel { width: 100%; }
.travel-diff-panel header { display: flex; align-items: start; justify-content: space-between; gap: 18px; }
.travel-diff-panel header span { color: var(--trip-terra); font-size: 11px; font-weight: 900; }
.travel-diff-panel h3 { margin: 5px 0 0; color: var(--trip-moss); font-family: "Noto Serif SC", "Songti SC", serif; font-size: 20px; line-height: 1.35; }
.travel-diff-panel > p { margin: 10px 0 14px; color: #697153; font-family: "Noto Serif SC", "Songti SC", serif; font-size: 12px; line-height: 1.7; }
.travel-diff-panel header button,.travel-diff-panel footer button { min-height: 38px; padding: 0 15px; border: 1px solid rgba(96, 108, 56, .35); border-radius: 17px; color: #59623f; background: rgba(212, 184, 149, .34); font-weight: 800; }
.travel-diff-list { display: grid; gap: 8px; margin: 12px 0 16px; }
.travel-diff-list article { display: grid; grid-template-columns: 42px minmax(0, 1fr); gap: 10px; padding: 12px; border-radius: 16px; background: rgba(139, 157, 131, .14); }
.travel-diff-list article > span { align-self: start; padding: 4px 7px; border-radius: 11px; color: var(--trip-sand); background: var(--trip-ochre); font-size: 10px; font-weight: 900; text-align: center; }
.travel-diff-list article.add > span { background: var(--trip-moss); }
.travel-diff-list b { font-size: 13px; }
.travel-diff-list p { margin: 4px 0 0; color: #747b5f; font-size: 11px; line-height: 1.55; overflow-wrap: anywhere; }
.travel-diff-details { display: grid; gap: 6px; margin: 10px 0 0; padding: 10px; border: 1px solid rgba(96, 108, 56, .18); border-radius: 12px; background: rgba(232, 220, 199, .48); }
.travel-diff-details > div { display: grid; grid-template-columns: 66px minmax(0, 1fr); gap: 8px; align-items: start; }
.travel-diff-details dt { color: #697153; font-size: 10px; font-weight: 900; }
.travel-diff-details dd { min-width: 0; margin: 0; color: #465032; font-size: 11px; line-height: 1.55; overflow-wrap: anywhere; }
.travel-diff-panel footer { position: sticky; bottom: -24px; z-index: 2; display: grid; grid-template-columns: 1fr 1.35fr; gap: 8px; padding: 12px 0 8px; background: linear-gradient(0deg, rgba(232, 220, 199, .99) 76%, rgba(232, 220, 199, 0)); }
.travel-diff-panel footer button:last-child { color: var(--trip-sand); border-color: var(--trip-moss); background: var(--trip-moss); }
.travel-transport-compare-panel {
    width: 100%;
    min-height: 100%;
    display: flex;
    flex-direction: column;
    padding-top: 0;
    border-top: 0;
}
.travel-transport-workspace-title {
    position: relative !important;
    top: auto !important;
    display: block !important;
    margin: 0 0 20px;
    padding: 0 0 15px !important;
    border-bottom: 1px solid rgba(96, 108, 56, .3);
    background: transparent !important;
    text-align: center;
}
.travel-transport-workspace-title h2 {
    justify-content: center;
}
.travel-transport-workspace-title .travel-transport-back {
    position: absolute;
    top: -3px;
    left: 0;
}
.travel-transport-workspace-title .travel-transport-back:hover,
.travel-transport-workspace-title .travel-transport-back:focus-visible {
    transform: translateX(-2px);
}
.travel-transport-workspace-section-title {
    margin: 0 0 10px;
    color: var(--trip-moss);
    font-family: "Noto Serif SC", "Songti SC", serif;
    font-size: 15px;
    line-height: 1.4;
}
.travel-transport-workspace-section-title:not(:first-of-type) { margin-top: 20px; }
.travel-transport-workspace-card {
    width: 100%;
    display: block;
    padding: 10px;
    border: 1px solid rgba(176, 139, 110, .30);
    border-radius: 5px;
    color: #465032;
    background: rgba(255, 255, 255, .3);
    box-shadow: 0 9px 22px rgba(67, 71, 42, .08);
    text-align: left;
}
.travel-transport-workspace-card.current {
    border-color: rgba(176, 139, 110, .30);
}
.travel-transport-workspace-card.choice {
    position: relative;
    cursor: pointer;
    transition: transform .24s ease, border-color .24s ease, background .24s ease, box-shadow .24s ease;
}
.travel-transport-workspace-card.choice.has-badges .travel-transport-summary {
    padding-right: 86px;
}
.travel-transport-choice-badges {
    position: absolute;
    top: 10px;
    right: 10px;
    display: grid;
    justify-items: end;
    gap: 4px;
    pointer-events: none;
}
.travel-transport-choice-badges span {
    padding: 3px 7px;
    border: 1px solid rgba(96, 108, 56, .32);
    border-radius: 10px;
    color: var(--trip-moss);
    background: rgba(232, 220, 199, .88);
    font-family: "Noto Serif SC", "Songti SC", serif;
    font-size: 9px;
    font-weight: 900;
    line-height: 1.25;
    white-space: nowrap;
}
.travel-transport-workspace-card.choice.selected .travel-transport-choice-badges span {
    color: #9b4e30;
    border-color: rgba(198, 107, 61, .4);
    background: rgba(232, 220, 199, .94);
}
.travel-transport-workspace-card.choice[role="button"]:hover {
    border-color: var(--trip-terra);
    background: rgba(255, 255, 255, .42);
    transform: translateY(-1px);
}
.travel-transport-workspace-card.choice[role="button"]:focus-visible {
    outline: 2px solid var(--trip-terra);
    outline-offset: 2px;
}
.travel-transport-workspace-card.choice.selected {
    border-color: var(--trip-terra);
    background: rgba(198, 107, 61, .1);
    box-shadow: 0 0 0 2px rgba(198, 107, 61, .08);
}
.travel-transport-workspace-card.choice.unavailable { cursor: not-allowed; opacity: .58; }
.travel-transport-workspace-card .travel-transport-summary {
    grid-template-columns: 54px minmax(0, 1fr);
}
.travel-transport-workspace-status {
    display: block;
    margin: 7px 0 0 64px;
    color: var(--trip-terra);
    font-size: 9px;
    font-weight: 900;
}
.travel-transport-options {
    display: grid;
    grid-template-columns: 1fr;
    gap: 8px;
}
.travel-transport-compare-error { margin: 0 0 12px; padding: 10px 12px; border-radius: 12px; color: #8d432d; background: rgba(198, 107, 61, .12); font-size: 11px; }
.travel-transport-selection-preview {
    margin-top: 16px;
    padding-top: 16px;
    border-top: 1px solid rgba(176, 139, 110, .35);
}
.travel-transport-selection-preview > h3 {
    margin: 0 0 8px;
    color: var(--trip-moss);
    font-family: "Noto Serif SC", "Songti SC", serif;
    font-size: 14px;
    line-height: 1.45;
}
.travel-transport-preview-shell {
    display: grid;
    gap: 10px;
}
.travel-transport-preview-shell > .travel-transport-summary .travel-transport-route {
    grid-template-rows: repeat(2, 27px);
}
.travel-transport-preview-shell > .travel-transport-summary .travel-transport-route::before {
    top: 13.5px;
    height: 27px;
}
.travel-transport-preview-shell > .travel-transport-summary .travel-transport-point b {
    font-size: 14px;
    line-height: 27px;
}
.travel-transport-preview-card {
    max-height: 286px;
    overflow-y: auto;
    overscroll-behavior: contain;
    padding: 10px;
    border: 1px solid rgba(176, 139, 110, .28);
    border-radius: 5px;
    background: rgba(232, 220, 199, .36);
}
.travel-transport-preview-card:focus-visible {
    outline: 2px solid var(--trip-terra);
    outline-offset: 2px;
}
.travel-transport-preview-card dl {
    display: grid;
    gap: 7px;
    margin: 0;
}
.travel-transport-preview-card dl > div {
    display: grid;
    grid-template-columns: 78px minmax(0, 1fr);
    gap: 8px;
    align-items: start;
}
.travel-transport-preview-card dt {
    padding-top: 1px;
    color: var(--trip-terra);
    font-size: 9px;
    font-weight: 800;
}
.travel-transport-preview-card dd {
    min-width: 0;
    margin: 0;
    color: #5f674d;
    font-size: 9px;
    line-height: 1.55;
}
.travel-transport-preview-navigation {
    padding-top: 7px;
    border-top: 1px solid rgba(176, 139, 110, .22);
}
.travel-transport-confirm {
    position: static;
    margin-top: auto;
    padding: 20px 0 0;
    background: transparent;
}
.travel-transport-confirm button {
    width: 100%;
    min-height: 44px;
    border: 1px solid var(--trip-moss);
    border-radius: 18px;
    color: var(--trip-sand);
    background: var(--trip-moss);
    font-family: "Noto Serif SC", "Songti SC", serif;
    font-size: 14px;
    font-weight: 900;
}
.travel-transport-confirm button:disabled {
    cursor: not-allowed;
    color: rgba(76, 86, 45, .5);
    border-color: rgba(96, 108, 56, .24);
    background: rgba(139, 157, 131, .12);
}

@media (max-width: 1180px) {
    .travel-planner-empty { height: calc(100dvh - 86px); min-height: 700px; overflow: hidden; }
}

.result-box,
.service-note {
    border: 1px solid rgba(96, 108, 56, .24);
    background: rgba(139, 157, 131, .14);
    border-radius: 18px;
    padding: 14px;
    line-height: 1.55;
}

.chart-bars {
    display: grid;
    gap: 11px;
}

.bar-row {
    display: grid;
    grid-template-columns: 95px 1fr 46px;
    gap: 10px;
    align-items: center;
}

.bar-track {
    height: 12px;
    border-radius: 999px;
    background: rgba(96, 108, 56, .14);
    overflow: hidden;
}

.bar-fill {
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, var(--moss), var(--terracotta));
}

.empty {
    padding: 28px;
    text-align: center;
    color: rgba(96, 108, 56, .74);
}

.heritage-atlas {
    height: calc(100vh - 86px);
    min-height: 620px;
    display: grid;
    grid-template-columns: 330px minmax(0, 1fr) 420px;
    gap: 16px;
    padding: 16px;
    overflow: hidden;
    background:
        linear-gradient(180deg, rgba(19, 54, 52, .18), rgba(96, 108, 56, .08)),
        var(--sand);
}

.heritage-filter-panel,
.heritage-results-panel,
.heritage-detail-card {
    border: 1px solid rgba(96, 108, 56, .24);
    border-radius: 8px;
    background:
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence baseFrequency='.75' numOctaves='2'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)' opacity='.035'/%3E%3C/svg%3E"),
        rgba(232, 220, 199, .9);
    box-shadow: 0 18px 46px rgba(67, 71, 42, .12);
}

.heritage-filter-panel,
.heritage-results-panel {
    min-height: 0;
    height: 100%;
    padding: 20px;
    overflow: auto;
}

.heritage-panel-heading,
.heritage-list-head,
.heritage-detail-title {
    display: flex;
    justify-content: space-between;
    gap: 14px;
    align-items: flex-start;
}

.heritage-panel-heading h3,
.heritage-list-head h3,
.heritage-detail-title h3 {
    margin: 0;
    color: var(--text-strong);
    font-size: 27px;
    line-height: 1.15;
}

.heritage-panel-heading p,
.heritage-list-head p,
.heritage-detail-title p {
    margin: 7px 0 0;
    color: rgba(96, 108, 56, .72);
    line-height: 1.55;
}

.heritage-reset,
.heritage-detail-title button,
.heritage-list-head>span {
    flex: none;
    min-height: 34px;
    padding: 7px 12px;
    border: 1px solid rgba(96, 108, 56, .22);
    border-radius: 8px;
    color: var(--text-strong);
    background: rgba(212, 184, 149, .35);
    font-family: "Epilogue", "Greycliff CF", Arial, sans-serif;
    font-size: 13px;
}

.heritage-search,
.heritage-filter-group,
.heritage-filter-grid label {
    display: grid;
    gap: 9px;
}

.heritage-search,
.heritage-filter-group,
.heritage-filter-grid {
    margin-top: 22px;
}

.heritage-search span,
.heritage-filter-group>span,
.heritage-filter-grid span {
    color: var(--heritage-filter-label-color);
    font-family: "Epilogue", "Greycliff CF", Arial, sans-serif;
    font-size: 14px;
    font-weight: 700;
}

.heritage-search input,
.heritage-filter-group select,
.heritage-filter-grid select {
    min-height: 46px;
    width: 100%;
    padding: 10px 13px;
    border: 1px solid rgba(96, 108, 56, .26);
    border-radius: 8px;
    color: var(--text-strong);
    background: rgba(232, 220, 199, .78);
}

.heritage-chip-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
}

.heritage-chip-grid button {
    min-height: 42px;
    padding: 8px 9px;
    border: 1px solid var(--heritage-chip-border);
    border-radius: 8px;
    color: var(--text-strong);
    background: var(--heritage-chip-background);
    font-size: 16px;
}

.heritage-chip-grid button.active {
    color: var(--sand);
    border-color: var(--heritage-chip-active-border);
    background: var(--heritage-chip-active-background);
}

.heritage-filter-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 13px;
}

.heritage-query-summary {
    min-height: 74px;
    margin-top: 22px;
    padding: 15px 16px;
    border: 1px solid rgba(96, 108, 56, .22);
    border-radius: 8px;
    display: flex;
    align-items: baseline;
    gap: 11px;
    background: rgba(139, 157, 131, .16);
}

.heritage-query-summary b {
    color: var(--terracotta);
    font-size: 36px;
    line-height: 1;
}

.heritage-query-summary span {
    color: rgba(76, 86, 45, .8);
    font-weight: 700;
}

.heritage-results-panel {
    display: grid;
    grid-template-rows: auto minmax(230px, .82fr) auto;
    gap: 14px;
}

.heritage-results-panel--detail {
    grid-template-rows: auto minmax(0, 1fr);
    gap: 14px;
    overflow: hidden;
}

.heritage-card-list {
    display: grid;
    gap: 12px;
    overflow: auto;
    padding-right: 4px;
}

.heritage-result-card {
    width: 100%;
    min-height: 110px;
    padding: 10px;
    display: grid;
    grid-template-columns: 112px minmax(0, 1fr);
    gap: 12px;
    border: 1px solid rgba(96, 108, 56, .18);
    border-radius: 8px;
    color: var(--text);
    background: rgba(232, 220, 199, .62);
    text-align: left;
    transition: border-color var(--ease), background-color var(--ease), transform var(--ease);
}

.heritage-result-card:hover,
.heritage-result-card:focus-visible,
.heritage-result-card.active {
    outline: 0;
    transform: translateY(-1px);
    border-color: rgba(198, 107, 61, .55);
    background: rgba(212, 184, 149, .42);
}

.heritage-result-media {
    min-width: 0;
    height: 90px;
    overflow: hidden;
    border-radius: 8px;
    display: grid;
    place-items: center;
    color: rgba(232, 220, 199, .88);
    background:
        linear-gradient(135deg, rgba(26, 69, 60, .94), rgba(96, 108, 56, .84));
}

.heritage-result-media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    filter: saturate(.88) contrast(.96);
}

.heritage-result-media span {
    padding: 8px;
    text-align: center;
    font-weight: 700;
}

.heritage-result-copy {
    min-width: 0;
    display: grid;
    gap: 7px;
    align-content: center;
}

.heritage-result-copy>div {
    display: flex;
    justify-content: space-between;
    gap: 10px;
    align-items: flex-start;
}

.heritage-result-copy h4 {
    min-width: 0;
    margin: 0;
    color: var(--text-strong);
    font-size: 20px;
    line-height: 1.25;
    overflow-wrap: anywhere;
}

.heritage-result-copy span {
    flex: none;
    padding: 4px 8px;
    border-radius: 8px;
    color: var(--text-strong);
    background: rgba(176, 139, 110, .22);
    font-size: 13px;
}

.heritage-result-copy p,
.heritage-result-copy small {
    margin: 0;
    color: rgba(96, 108, 56, .78);
    line-height: 1.45;
}

.heritage-detail-panel {
    min-height: 0;
}

.heritage-detail-card {
    overflow: hidden;
}

.heritage-results-panel--detail .heritage-detail-card {
    min-height: 0;
    overflow: hidden;
}

.heritage-detail-media {
    height: 168px;
    overflow: hidden;
    border-radius: 8px;
    background:
        linear-gradient(135deg, rgba(23, 72, 64, .92), rgba(96, 108, 56, .72)),
        var(--sage);
}

.heritage-detail-media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.heritage-photo-empty {
    height: 100%;
    padding: 18px;
    display: grid;
    place-items: center;
    color: rgba(232, 220, 199, .92);
    text-align: center;
    font-size: 24px;
    font-weight: 800;
}

.heritage-detail-title {
    margin-top: 18px;
}

.heritage-detail-card > .heritage-detail-title:first-child {
    margin-top: 0;
}

.heritage-detail-title h3 {
    font-size: 34px;
    line-height: 1.08;
    font-weight: 950;
}

.heritage-detail-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 9px;
}

.heritage-detail-tag {
    min-height: 34px;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 0 11px;
    border: 1px solid rgba(176, 139, 110, .36);
    border-radius: 9px;
    color: var(--heritage-muted);
    background: rgba(232, 220, 199, .46);
    box-shadow: inset 0 1px 0 rgba(255, 245, 220, .2);
}

.heritage-detail-tag svg {
    width: 18px;
    height: 18px;
    flex: 0 0 auto;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.heritage-detail-tag b {
    font-size: 15px;
    line-height: 1;
    font-weight: 900;
    white-space: nowrap;
}

.heritage-detail-desc {
    margin-top: 12px;
    color: rgba(76, 86, 45, .9);
    line-height: 1.62;
    text-align: justify;
    text-align-last: left;
    text-indent: 2em;
    display: -webkit-box;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 8;
}

.heritage-detail-map-card {
    width: 100%;
    height: clamp(132px, 15vh, 158px);
    margin-top: 18px;
    padding: 10px 12px 9px;
    border-color: rgba(176, 139, 110, .34);
    border-radius: 10px;
}

.heritage-detail-map-card .global-city-map-heading {
    gap: 6px;
    font-size: 15px;
}

.heritage-detail-map-card .global-city-info-icon {
    width: 19px;
    height: 19px;
    flex-basis: 19px;
}

.heritage-detail-map-card .global-city-map-north {
    top: 10px;
    right: 13px;
}

.heritage-detail-map-card .global-city-map-north::after {
    height: 24px;
}

.heritage-detail-map-card .global-city-map-plot {
    left: 8px;
    right: 8px;
    top: 18px;
    bottom: auto;
    aspect-ratio: 3 / 1;
    height: auto;
    overflow: hidden;
    transform: translateX(var(--city-map-offset-x));
}

.heritage-detail-national-map .global-city-boundary-map path {
    fill: rgba(232, 220, 199, .16);
    stroke: rgba(115, 109, 85, .26);
    stroke-width: .34;
}

.heritage-detail-national-map .global-city-boundary-map {
    overflow: hidden;
    mask-image:
        linear-gradient(90deg, transparent 0, #000 7%, #000 93%, transparent 100%),
        linear-gradient(180deg, transparent 0, #000 10%, #000 88%, transparent 100%);
    mask-composite: intersect;
    -webkit-mask-image:
        linear-gradient(90deg, transparent 0, #000 7%, #000 93%, transparent 100%),
        linear-gradient(180deg, transparent 0, #000 10%, #000 88%, transparent 100%);
    -webkit-mask-composite: source-in;
}

.heritage-detail-national-map .global-city-boundary-map path.active {
    fill: rgba(63, 111, 76, .86);
    stroke: rgba(22, 61, 38, .82);
    stroke-width: 1.05;
}

.heritage-detail-national-map .global-city-boundary-map .province-borders path {
    fill: none;
    stroke: rgba(33, 52, 33, .62);
    stroke-width: .95;
}

.heritage-detail-map-card .global-city-map-anchor {
    width: 27px;
    height: 27px;
}

.heritage-detail-map-card .global-city-map-anchor .global-city-map-pin {
    width: 20px;
    height: 20px;
}

.heritage-detail-map-card .global-city-map-anchor .global-city-map-pin::after {
    left: 6px;
    top: 6px;
}

.heritage-detail-map-card p {
    bottom: 8px;
    font-size: 16px;
    font-weight: 800;
}

.heritage-3d-entry {
    width: 100%;
    min-height: 50px;
    margin-top: 16px;
    margin-bottom: 0;
    border: 1px solid rgba(216, 191, 140, .28);
    border-radius: 8px;
    color: var(--sand);
    background: linear-gradient(180deg, rgba(30, 77, 68, .98), rgba(19, 55, 50, .98));
    font-size: 18px;
    font-weight: 800;
}

.heritage-related {
    margin-top: 14px;
    min-height: 0;
    overflow: visible;
}

.heritage-related h4 {
    margin: 0 0 8px;
    color: var(--heritage-ink);
    font-size: 17px;
    line-height: 1;
    font-weight: 900;
}

.heritage-related-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-template-rows: repeat(var(--related-rows), 118px);
    gap: 10px;
    overflow: visible;
}

.heritage-related-card {
    min-width: 0;
    height: 118px;
    padding: 0;
    display: grid;
    grid-template-rows: auto 26px;
    gap: 5px;
    border: 1px solid rgba(176, 139, 110, .28);
    border-radius: 8px;
    color: var(--heritage-copy);
    background: rgba(232, 220, 199, .5);
    cursor: pointer;
    overflow: hidden;
}

.heritage-related-card:hover,
.heritage-related-card:focus-visible {
    border-color: rgba(198, 107, 61, .62);
    background: rgba(212, 184, 149, .42);
    outline: none;
}

.heritage-related-card img {
    width: 100%;
    aspect-ratio: 16 / 9;
    height: auto;
    max-height: 87px;
    object-fit: cover;
    display: block;
}

.heritage-related-card .heritage-name-marquee {
    width: calc(100% - 12px);
    min-width: 0;
    margin: 0 6px;
    color: rgba(76, 86, 45, .9);
    font-size: 12px;
    line-height: 20px;
    font-weight: 800;
    text-align: left;
    white-space: nowrap;
    overflow: hidden;
}

.heritage-related-card .heritage-name-marquee > span {
    display: inline-block;
    min-width: 100%;
}

.heritage-3d-entry:disabled {
    cursor: not-allowed;
    color: rgba(96, 108, 56, .62);
    border-color: rgba(96, 108, 56, .18);
    background: rgba(139, 157, 131, .16);
}

.heritage-atlas {
    position: relative;
    height: calc(100vh - 86px);
    min-height: 680px;
    display: block;
    padding: 0;
    overflow: hidden;
    isolation: isolate;
    background: #22351f;
}

.heritage-webgl {
    position: absolute;
    inset: 0;
    z-index: 0;
}

.heritage-map-marker-layer {
    position: absolute;
    inset: 0;
    z-index: 3;
    overflow: hidden;
    pointer-events: none;
}

.analysis-elevation-indicator {
    position: absolute;
    left: 0;
    top: 0;
    z-index: 5;
    min-width: 62px;
    padding: 6px 10px;
    border: 1px solid rgba(232, 220, 199, .72);
    border-radius: 3px;
    color: #fff5d6;
    background: rgba(23, 62, 56, .94);
    box-shadow: 0 4px 12px rgba(4, 17, 16, .34);
    font: 700 13px/1.25 "Microsoft YaHei", "Noto Sans SC", sans-serif;
    text-align: center;
    text-shadow: 0 1px 2px rgba(4, 17, 16, .85);
    white-space: nowrap;
    pointer-events: none;
    will-change: transform;
}

.analysis-elevation-indicator::after {
    position: absolute;
    left: 50%;
    top: 100%;
    width: 0;
    height: 0;
    border: 7px solid transparent;
    border-top-color: rgba(23, 62, 56, .94);
    content: "";
    transform: translateX(-50%);
}

.analysis-elevation-indicator[hidden] {
    display: none !important;
}

.heritage-map-marker {
    position: absolute;
    left: 0;
    top: 0;
    min-width: 0;
    min-height: 0;
    padding: 6px;
    display: flex;
    align-items: center;
    gap: 6px;
    border: 0;
    color: #f2e1bb;
    background: transparent;
    font: 800 12px/1.2 "Noto Serif SC", "Songti SC", serif;
    text-shadow: 0 2px 4px #061917, 0 0 7px #061917;
    white-space: nowrap;
    pointer-events: auto;
    cursor: pointer;
}

.heritage-map-marker[hidden] {
    display: none !important;
}

.heritage-map-marker.label-hidden:not(.active) span {
    display: none;
}

.heritage-map-marker.force-label-hidden span {
    display: none !important;
}

.heritage-map-marker.label-left {
    flex-direction: row-reverse;
}

.heritage-map-marker.label-hidden:hover span,
.heritage-map-marker.label-hidden:focus-visible span {
    position: absolute;
    left: 22px;
    top: 50%;
    z-index: 2;
    display: block;
    transform: translateY(-50%);
    pointer-events: none;
}

.heritage-map-marker i {
    position: relative;
    z-index: 1;
    width: 10px;
    height: 10px;
    display: block;
    flex: 0 0 auto;
    border: 2px solid #f2e1bb;
    border-radius: 50%;
    background: var(--heritage-marker-color, #c08e3a);
    box-shadow: 0 0 0 4px var(--heritage-marker-halo, rgba(213, 166, 74, .18)), 0 3px 8px rgba(4, 17, 16, .36);
}

.heritage-map-marker:hover,
.heritage-map-marker:focus-visible,
.heritage-map-marker.active {
    outline: 0;
    color: #fff0ca;
}

.heritage-map-marker:hover i,
.heritage-map-marker:focus-visible i,
.heritage-map-marker.active i {
    background: var(--heritage-marker-color, #c66b3d);
    box-shadow: 0 0 0 5px var(--heritage-marker-halo, rgba(213, 166, 74, .24)), 0 4px 10px rgba(4, 17, 16, .42);
}

.global-city-marker {
    gap: 7px;
    padding: 7px;
    font-size: 15px;
    letter-spacing: 0;
}

.global-city-marker i {
    width: 11px;
    height: 11px;
}

.analysis-heritage-result-marker {
    width: 70px;
    padding: 0 0 12px;
    flex-direction: column-reverse;
    gap: 5px;
    filter: drop-shadow(0 8px 8px rgba(5, 22, 18, .32));
}

.analysis-heritage-result-marker.label-left {
    align-items: flex-end;
    flex-direction: column-reverse;
}

.analysis-heritage-result-marker i {
    width: 58px;
    height: 48px;
    padding: 4px;
    overflow: visible;
    border: 2px solid rgba(255, 253, 243, .78);
    border-radius: 4px;
    background: rgba(255, 253, 243, .82);
    box-shadow:
        0 0 0 1px rgba(96, 108, 56, .18),
        0 8px 16px rgba(5, 22, 18, .32);
    transform: perspective(100px) rotateX(3deg) rotateY(-4deg);
}

.analysis-heritage-result-marker i::after {
    content: "";
    position: absolute;
    left: 50%;
    bottom: -10px;
    width: 16px;
    height: 16px;
    border-right: 2px solid rgba(255, 253, 243, .78);
    border-bottom: 2px solid rgba(255, 253, 243, .78);
    border-radius: 0 0 3px 0;
    background: rgba(255, 253, 243, .82);
    box-shadow: none;
    transform: translateX(-50%) rotate(45deg) skew(-5deg, -5deg);
}

.analysis-heritage-result-marker i img {
    position: relative;
    z-index: 1;
    display: block;
    width: 100%;
    height: 100%;
    border-radius: 2px;
    object-fit: cover;
}

.analysis-heritage-result-marker span {
    width: max-content;
    max-width: none;
    overflow: visible;
    padding: 3px 7px;
    border: 1px solid rgba(255, 240, 202, .22);
    border-radius: 4px;
    color: #fff2c8;
    background: rgba(18, 55, 50, .82);
    text-overflow: clip;
    text-shadow: 0 2px 4px rgba(3, 16, 14, .7);
}

.analysis-heritage-result-marker > b {
    position: absolute;
    left: 50%;
    bottom: -5px;
    z-index: 2;
    width: 10px;
    height: 10px;
    border: 2px solid #f2e1bb;
    border-radius: 50%;
    background: #c08e3a;
    box-shadow: 0 0 0 4px rgba(213, 166, 74, .2), 0 3px 8px rgba(4, 17, 16, .4);
    transform: translateX(-50%);
}

.heritage-shade {
    position: absolute;
    inset: 0;
    z-index: 1;
    pointer-events: none;
    background:
        linear-gradient(90deg, rgba(7, 27, 31, .38), rgba(11, 28, 24, .04) 28%, rgba(11, 28, 24, .04) 72%, rgba(7, 27, 31, .42)),
        linear-gradient(180deg, rgba(4, 17, 20, .04), rgba(3, 13, 12, .2));
}

.heritage-filter-panel,
.heritage-results-panel {
    position: absolute;
    z-index: 7;
    top: 18px;
    bottom: 18px;
    height: auto;
    min-height: 0;
    overflow: auto;
    border: 1px solid rgba(212, 184, 149, .78);
    border-radius: 8px;
    color: var(--heritage-copy);
    background:
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence baseFrequency='.86' numOctaves='2'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)' opacity='.04'/%3E%3C/svg%3E"),
        linear-gradient(180deg, rgba(232, 220, 199, .94), rgba(232, 220, 199, .985));
    box-shadow: 0 34px 90px rgba(5, 18, 17, .32);
    backdrop-filter: blur(8px);
}

.heritage-results-panel {
    z-index: 200;
    background:
        url("/assets/pages/heritage-atlas/heritage-card-background.jpg") center / 100% 100% no-repeat,
        linear-gradient(180deg, rgba(232, 220, 199, .94), rgba(232, 220, 199, .985));
}

.heritage-filter-panel {
    left: 18px;
    width: 330px;
    padding: 22px 20px;
}

.heritage-results-panel {
    right: 18px;
    width: 420px;
    padding: 22px 20px;
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
    gap: 14px;
}

.heritage-panel-heading h3,
.heritage-list-head h3 {
    color: var(--heritage-ink);
    font-size: 28px;
}

.heritage-panel-heading p,
.heritage-list-head p {
    color: color-mix(in srgb, var(--heritage-muted) 72%, transparent);
    font-weight: 700;
}

.heritage-search input,
.heritage-filter-group select,
.heritage-filter-grid select {
    border-color: rgba(176, 139, 110, .34);
    border-radius: 8px;
    background: rgba(232, 220, 199, .64);
}

.heritage-chip-grid button {
    border-color: var(--heritage-chip-border);
    border-radius: 8px;
    background: var(--heritage-chip-background);
    font-weight: 700;
}

.heritage-chip-grid button.active {
    border-color: var(--heritage-chip-active-border);
    background: var(--heritage-chip-active-background);
}

.heritage-query-summary {
    border-color: rgba(176, 139, 110, .34);
    border-radius: 8px;
    background: rgba(139, 157, 131, .12);
}

.heritage-filter-panel .service-note {
    border-color: rgba(176, 139, 110, .32);
    border-radius: 8px;
    background: rgba(139, 157, 131, .1);
}

.heritage-card-list {
    min-height: 0;
    overflow: auto;
    display: grid;
    align-content: start;
    gap: 12px;
    padding-right: 4px;
}

.heritage-result-card {
    min-height: 112px;
    border-color: rgba(176, 139, 110, .28);
    border-radius: 8px;
    background: rgba(232, 220, 199, .56);
}

.heritage-result-card:hover,
.heritage-result-card:focus-visible,
.heritage-result-card.active {
    border-color: rgba(198, 107, 61, .58);
    background: rgba(212, 184, 149, .42);
}

.heritage-result-media {
    border-radius: 8px;
}

.heritage-detail-card {
    min-height: 0;
    border: 0;
    border-radius: 0;
    color: var(--heritage-copy);
    padding-right: 4px;
    background: transparent;
    box-shadow: none;
}

.heritage-detail-media {
    height: 154px;
}

.heritage-filter-panel {
    width: clamp(390px, 25vw, 430px);
    padding: 60px 24px 20px;
    border-radius: 5px;
    isolation: isolate;
    overflow: visible;
}

.heritage-filter-panel::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    border-radius: inherit;
    background: url("assets/shared/backgrounds/vertical-panel-texture.png") center / 100% 100% no-repeat;
    opacity: .72;
}

.heritage-filter-panel>* {
    position: relative;
    z-index: 1;
}

.heritage-panel-heading {
    justify-content: center;
    align-items: center;
    margin-bottom: 14px;
}

.heritage-title-lockup {
    display: flex;
    align-items: flex-start;
    justify-content: center;
    gap: 10px;
    width: 100%;
}

.heritage-title-lockup h3,
.heritage-panel-heading h3 {
    margin: 0;
    color: var(--heritage-ink);
    font-size: 48px;
    line-height: 1.05;
    letter-spacing: 0;
    font-weight: 900;
    text-align: center;
}

.heritage-title-lockup img {
    flex: 0 0 auto;
    width: auto;
    height: 34px;
    margin-top: 6px;
    filter: drop-shadow(0 3px 8px rgba(114, 69, 24, .2));
}

.heritage-logic-block {
    padding: 12px 0 0;
    border-top: 1px solid rgba(96, 108, 56, .18);
}

.heritage-logic-block+.heritage-logic-block {
    margin-top: 14px;
}

.heritage-logic-title {
    display: grid;
    place-items: center;
    margin-bottom: 10px;
}

.heritage-logic-title span {
    color: var(--heritage-muted);
    font-family: "Noto Serif SC", "Songti SC", "Source Han Serif SC", serif;
    font-size: 17px;
    font-weight: 900;
    line-height: 1.15;
}

.heritage-search-form {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 46px;
    gap: 10px;
    align-items: end;
}

.heritage-search-form .heritage-search,
.heritage-condition-block .heritage-filter-group {
    margin-top: 0;
}

.heritage-condition-block {
    display: grid;
    gap: 12px;
}

.heritage-search input,
.heritage-select-trigger,
.heritage-chip-grid button {
    min-height: 40px;
    border-radius: 8px;
}

.heritage-search input {
    font-size: 16px;
}

.heritage-search-button,
.heritage-condition-submit {
    min-height: 40px;
    border: 1px solid color-mix(in srgb, var(--heritage-action-border) 72%, transparent);
    border-radius: 8px;
    color: #f1dfb9;
    background: linear-gradient(180deg, color-mix(in srgb, var(--heritage-action) 98%, transparent), color-mix(in srgb, var(--heritage-action-deep) 98%, transparent));
    box-shadow: 0 12px 26px rgba(5, 18, 17, .18);
    transition: transform var(--ease), filter var(--ease);
}

.heritage-search-button {
    display: grid;
    place-items: center;
    width: 46px;
    padding: 0;
}

.heritage-search-button:hover,
.heritage-condition-submit:hover {
    transform: translateY(-1px);
    filter: brightness(1.04);
}

.heritage-search-button img {
    display: block;
    width: 24px;
    height: 24px;
    max-width: 24px;
    max-height: 24px;
    object-fit: contain;
    pointer-events: none;
}

.heritage-chip-grid.four {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.heritage-chip-grid.route {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.heritage-chip-grid button {
    padding: 5px 6px;
    font-size: 14px;
    line-height: 1.15;
}

.heritage-admin-row {
    position: relative;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

.heritage-custom-select {
    position: relative;
    min-width: 0;
}

.heritage-select-trigger {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 8px 12px;
    border: 1px solid rgba(176, 139, 110, .34);
    color: var(--heritage-copy);
    background: rgba(232, 220, 199, .66);
    font-family: "Noto Serif SC", "Songti SC", "Source Han Serif SC", serif;
    font-size: 15px;
    font-weight: 700;
    text-align: left;
}

.heritage-select-trigger span {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.heritage-select-trigger i {
    width: 9px;
    height: 9px;
    flex: 0 0 auto;
    border-right: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
    transform: rotate(45deg) translateY(-2px);
}

.heritage-custom-select.open .heritage-select-trigger i {
    transform: rotate(225deg) translate(-2px, -1px);
}

.heritage-custom-select.disabled .heritage-select-trigger {
    cursor: not-allowed;
    color: rgba(76, 86, 45, .48);
    background: rgba(232, 220, 199, .34);
}

.heritage-select-menu {
    position: absolute;
    left: 0;
    right: 0;
    top: calc(100% + 7px);
    z-index: 30;
    max-height: 260px;
    overflow: auto;
    padding: 6px;
    border: 1px solid rgba(176, 139, 110, .44);
    border-radius: 8px;
    background:
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence baseFrequency='.72' numOctaves='2'/%3E%3C/filter%3E%3Crect width='120' height='120' filter='url(%23n)' opacity='.035'/%3E%3C/svg%3E"),
        rgba(232, 220, 199, .98);
    box-shadow: 0 20px 42px rgba(5, 18, 17, .22);
}

.heritage-select-menu button {
    width: 100%;
    min-height: 34px;
    padding: 7px 10px;
    border: 0;
    border-radius: 6px;
    color: var(--heritage-copy);
    background: transparent;
    font-family: "Noto Serif SC", "Songti SC", "Source Han Serif SC", serif;
    font-size: 15px;
    font-weight: 700;
    text-align: left;
}

.heritage-select-menu button:hover,
.heritage-select-menu button.active {
    color: #f1dfb9;
    background: rgba(24, 78, 70, .96);
}

.heritage-condition-submit {
    width: 100%;
    margin-top: 2px;
    font-size: 18px;
    font-weight: 900;
}

.heritage-condition-block>.heritage-logic-title {
    margin-bottom: 5px;
}

.heritage-condition-block .heritage-select-trigger,
.heritage-condition-block .heritage-chip-grid button,
.heritage-condition-block .heritage-condition-submit {
    min-height: 47px;
    font-size: 16px;
}

@media (max-width: 1180px) {
    .topbar {
        grid-template-columns: max-content minmax(0, 1fr) max-content;
    }

    .topbar .brand-title p {
        display: none;
    }

    .nav {
        gap: 0;
        padding-inline: 10px;
        transform: none;
    }

    .nav button {
        width: 132px;
        min-width: 132px;
        padding-inline: 8px;
        font-size: 18px;
    }

    .workspace,
    .workspace.wide-right {
        grid-template-columns: 260px minmax(0, 1fr);
    }

    .workspace>aside:last-child,
    .workspace.wide-right>aside:last-child {
        grid-column: 1 / -1;
    }

    .heritage-atlas {
        grid-template-columns: 280px minmax(0, 1fr);
    }

    .heritage-results-panel {
        min-height: 0;
        grid-template-columns: 1fr;
        grid-template-rows: auto minmax(0, 1fr);
    }

    .heritage-list-head {
        grid-column: auto;
    }

    .home-lower {
        grid-template-columns: 1fr;
    }

}

@media (min-width: 821px) and (max-width: 1180px) {
    .route-explore-controls {
        left: 16px;
        top: 16px;
        bottom: 16px;
        width: min(360px, calc(100vw - 32px));
        padding: 44px 18px 18px;
    }

    .route-explore-list button {
        padding-top: 15px;
        padding-bottom: 15px;
    }

    .route-narration-panel {
        padding: 11px 12px;
    }

    .route-narration-body strong {
        font-size: 13px;
    }

    .route-guide-backdrop,
    .route-summary-backdrop {
        padding: 20px 16px 20px 394px;
    }

    .route-guide,
    .route-summary {
        width: 100%;
    }

    .route-guide-overview-grid {
        grid-template-columns: 1fr;
    }

    .route-overview-map {
        max-height: 340px;
    }

    .route-dynasty-timeline {
        grid-template-columns: 1fr 1fr;
    }

    .route-dynasty-timeline li:nth-child(2) {
        border-right: 0;
    }

    .route-chapter-preview ol {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .route-flight-title,
    .route-journey-hud {
        left: 394px;
    }

    .route-journey-hud {
        grid-template-columns: 150px 1fr auto;
        gap: 12px;
    }

    .route-flight-stats>div:nth-child(3) {
        display: none;
    }

    .route-flight-narration {
        left: 394px;
        width: min(320px, calc(100vw - 430px));
    }

    .route-flight-loading {
        padding-left: 394px;
    }

    .route-story-card {
        width: 370px;
    }
}

@media (max-width: 820px) {

    .app-shell:has(.route-explore-page) {
        grid-template-rows: auto 1fr;
    }

    .app-shell:has(.route-explore-page) .topbar {
        grid-template-columns: minmax(0, 1fr) auto;
        grid-template-rows: 66px 54px;
        gap: 0 8px;
        padding: 4px 10px;
    }

    .app-shell:has(.route-explore-page) .topbar .brand-mark {
        min-width: 0;
        gap: 8px;
    }

    .app-shell:has(.route-explore-page) .topbar .brand-icon {
        width: 58px;
        height: 50px;
        flex: 0 0 auto;
    }

    .app-shell:has(.route-explore-page) .topbar .brand-title {
        min-width: 0;
    }

    .app-shell:has(.route-explore-page) .topbar .brand-title h1 {
        font-size: 17px;
        line-height: 1.15;
    }

    .app-shell:has(.route-explore-page) .topbar .nav {
        grid-column: 1 / -1;
        grid-row: 2;
        height: 54px;
    }

    .app-shell:has(.route-explore-page) .topbar .top-actions {
        grid-column: 2;
        grid-row: 1;
        gap: 4px;
        white-space: nowrap;
    }

    .app-shell:has(.route-explore-page) .topbar .top-actions button {
        min-height: 36px;
        padding: 6px;
        font-size: 12px;
    }

    .route-explore-page {
        min-height: calc(100dvh - 128px);
        height: calc(100dvh - 128px);
    }

    .route-explore-controls {
        left: 8px;
        right: 8px;
        top: 8px;
        bottom: auto;
        width: auto;
        max-height: 260px;
        gap: 10px;
        padding: 12px;
    }

    .route-explore-heading .global-title-lockup h1 {
        font-size: 28px;
    }

    .route-explore-heading .global-title-lockup>img.global-title-seal {
        height: 24px;
        margin-top: 4px;
    }

    .route-narration-panel {
        grid-template-columns: minmax(0, 1fr);
        gap: 8px 10px;
        padding: 9px 10px;
    }

    .route-narration-panel header,
    .route-narration-body {
        min-width: 0;
    }

    .route-narration-panel header {
        grid-column: 1 / -1;
    }

    .route-narration-body small {
        display: none;
    }

    .route-narration-actions {
        justify-content: flex-end;
    }

    .route-narration-actions button {
        width: 26px;
        height: 26px;
    }

    .route-explore-heading span,
    .route-explore-heading p {
        display: none;
    }

    .route-explore-list {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 5px;
    }

    .route-explore-list button {
        min-height: 72px;
        grid-template-columns: 4px minmax(0, 1fr);
        gap: 7px;
        padding-right: 6px;
    }

    .route-explore-list button strong,
    .route-card-title-row strong {
        font-size: 12px;
        overflow-wrap: anywhere;
    }

    .route-card-theme {
        font-size: 10px;
    }

    .route-card-details,
    .route-card-intro {
        display: none !important;
    }

    .route-mode-story .route-explore-controls:not(.route-explore-controls-flight) {
        display: none;
    }

    .route-mode-exploring .route-explore-controls:not(.route-explore-controls-flight) {
        bottom: auto;
        max-height: none;
    }

    .route-mode-exploring .route-explore-controls.route-explore-controls-flight,
    .route-mode-story .route-explore-controls.route-explore-controls-flight {
        max-height: calc(100% - 16px);
    }

    .route-guide-backdrop,
    .route-summary-backdrop {
        align-items: flex-start;
        padding: 184px 8px 8px;
    }

    .route-guide,
    .route-summary {
        width: 100%;
        max-height: calc(100dvh - 260px);
        padding: 16px;
    }

    .route-guide-overview,
    .route-guide-story {
        height: auto;
        min-height: 0;
    }

    .route-guide-overview-grid,
    .route-summary-body {
        grid-template-columns: 1fr;
        gap: 14px;
    }

    .route-guide-overview-grid {
        padding: 14px 0;
    }

    .route-overview-copy h2,
    .route-story-intro h2 {
        font-size: 22px;
    }

    .route-overview-copy>p {
        display: none;
    }

    .route-overview-node text {
        font-size: 11px;
        stroke-width: 3px;
    }

    .route-overview-city-node text {
        display: none;
    }

    .route-overview-context-node text {
        display: none;
    }

    .route-overview-admin-label {
        font-size: 16px;
    }

    .route-overview-copy dl {
        margin-top: 10px;
    }

    .route-overview-copy dl>div {
        padding: 7px 3px;
    }

    .route-guide-actions {
        flex-wrap: wrap;
    }

    .route-guide-actions>span {
        width: 100%;
    }

    .route-story-intro {
        grid-template-columns: 1fr;
        padding: 14px 0 10px;
    }

    .route-story-intro p {
        font-size: 11px;
        line-height: 1.6;
    }

    .route-dynasty-timeline {
        grid-template-columns: 1fr 1fr;
    }

    .route-dynasty-timeline li:nth-child(2) {
        border-right: 0;
    }

    .route-dynasty-timeline li {
        border-bottom: 1px solid rgba(101, 75, 38, .18);
    }

    .route-chapter-preview ol {
        grid-template-columns: 1fr 1fr;
    }

    .route-chapter-preview li {
        min-height: 54px;
    }

    .route-flight-title {
        left: 12px;
        top: 12px;
        right: 12px;
    }

    .route-elevation-overview {
        display: none;
    }

    .route-flight-loading {
        padding-left: 0;
    }

    .route-flight-title strong {
        font-size: 16px;
    }

    .route-flight-narration {
        left: 12px;
        top: 96px;
        width: min(330px, calc(100vw - 24px));
    }

    .route-journey-hud {
        left: 8px;
        right: 8px;
        bottom: 8px;
        min-height: 142px;
        grid-template-columns: 1fr auto;
        gap: 10px;
        padding: 11px;
    }

    .route-journey-progress {
        grid-column: 1 / -1;
    }

    .route-flight-stats {
        grid-template-columns: 1fr 1fr;
    }

    .route-flight-stats>div {
        padding: 0 7px;
    }

    .route-flight-stats>div:nth-child(3) {
        display: none;
    }

    .route-hud-controls {
        align-self: end;
    }

    .route-hud-controls button {
        width: 36px;
        height: 36px;
    }

    .route-hud-controls .route-next-button {
        width: 36px;
        overflow: hidden;
        color: transparent;
    }

    .route-hud-controls .route-next-button span {
        color: #efddb6;
        font-size: 20px;
    }

    .route-story-card {
        left: 8px;
        right: 8px;
        top: 76px;
        bottom: 158px;
        width: auto;
        padding: 15px;
    }

    .route-story-card>p {
        font-size: 11px;
    }

    .route-summary {
        margin-top: 0;
    }

    .identity-grid,
    .analysis-grid {
        grid-template-columns: 1fr;
    }

    .topbar {
        position: static;
        height: auto;
        grid-template-columns: 1fr;
        gap: 8px;
        padding: 12px;
    }

    .topbar .brand-mark,
    .top-actions {
        padding: 0;
    }

    .top-actions {
        transform: none;
    }

    .nav {
        justify-content: flex-start;
        overflow-x: auto;
        height: 58px;
        padding: 0;
        transform: none;
    }

    .nav button {
        width: 112px;
        min-width: 112px;
        min-height: 54px;
        font-size: 16px;
    }

    .user-avatar {
        width: 42px;
        height: 42px;
    }

    .workspace,
    .workspace.two-col,
    .workspace.wide-right {
        grid-template-columns: 1fr;
        padding: 12px;
    }

    .heritage-atlas {
        min-height: auto;
        grid-template-columns: 1fr;
        padding: 12px;
        height: auto;
        overflow: auto;
    }

    .heritage-filter-panel,
    .heritage-results-panel {
        position: relative;
        left: auto;
        right: auto;
        top: auto;
        bottom: auto;
        width: 100%;
        min-height: auto;
        margin-bottom: 12px;
    }

    .heritage-filter-panel {
        padding: 22px 18px;
    }

    .heritage-results-panel {
        grid-template-columns: 1fr;
        grid-template-rows: auto;
    }

    .heritage-card-list {
        max-height: 420px;
    }

    .heritage-result-card {
        grid-template-columns: 96px minmax(0, 1fr);
    }

    .heritage-chip-grid.four,
    .heritage-chip-grid.route,
    .heritage-admin-row {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .heritage-title-lockup h3,
    .heritage-panel-heading h3 {
        font-size: 38px;
    }

    .heritage-detail-card {
        position: relative;
        right: auto;
        bottom: auto;
        width: 100%;
        max-height: none;
        margin-bottom: 12px;
    }

    .global-page {
        min-height: calc(100vh - 190px);
        overflow: auto;
        padding: 12px;
    }

    .global-webgl,
    .global-shade {
        position: fixed;
    }

    .global-control {
        z-index: 6;
    }

    .global-city-panel {
        position: relative;
        right: auto;
        top: auto;
        width: 100%;
        margin-top: 12px;
        z-index: 7;
    }

    .global-city-hero {
        aspect-ratio: 16 / 9;
        min-height: 0;
    }

    .global-city-close {
        right: 12px;
        top: 12px;
        width: 36px;
        height: 36px;
    }

    .global-city-title {
        left: 28px;
        right: 58px;
        bottom: 112px;
    }

    .global-city-title h3 {
        font-size: 52px;
    }

    .global-city-title p {
        font-size: 19px;
    }

    .global-city-metrics {
        left: 20px;
        right: 20px;
        bottom: 32px;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        min-height: 66px;
    }

    .global-city-metric {
        padding: 10px 8px;
    }

    .global-city-metric img {
        height: 32px;
    }

    .global-city-metric+.global-city-metric {
        border-left: 1px solid rgba(212, 184, 149, .72);
        border-top: 0;
    }

    .global-city-metric strong {
        font-size: 18px;
    }

    .global-city-body {
        padding: 18px 20px 22px;
    }

    .global-city-main {
        grid-template-columns: 1fr;
    }

    .global-city-desc {
        font-size: 14px;
    }

    .global-city-map-card {
        min-height: 220px;
    }

    .global-city-facts div {
        grid-template-columns: 104px minmax(0, 1fr);
        gap: 15px;
        padding: 16px 0;
    }

    .global-city-facts dd {
        font-size: 15px;
    }

    .global-city-facts dt {
        font-size: 15px;
    }

    .global-page .global-webgl .supermap3d-viewer-navigationContainer {
        display: none;
    }

    .route-explore-webgl .supermap3d-viewer-navigationContainer {
        right: calc(12px + var(--map-render-extra-width, 0px));
        bottom: 12px;
        transform: scale(.78);
        transform-origin: right bottom;
    }

    .metrics-grid,
    .filters {
        grid-template-columns: 1fr;
    }

    .hero-stats {
        grid-template-columns: repeat(2, 1fr);
    }

    .scene-hero {
        min-height: 680px;
    }

}

.route-guide-story {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr) auto;
    overflow: hidden;
}

.route-guide-story-scroll {
    min-height: 0;
    display: flex;
    flex-direction: column;
    overflow: auto;
    padding-right: 4px;
}

@media (max-width: 820px) {
    .route-guide.route-guide-story {
        min-height: 0;
        max-height: calc(100dvh - 320px);
    }

    .route-guide-story .route-guide-actions {
        flex-wrap: nowrap;
        padding-top: 12px;
        background: rgba(238, 225, 196, .96);
    }

    .route-guide-story .route-guide-actions .route-btn-secondary,
    .route-guide-story .route-guide-actions .route-btn-primary {
        flex: 1 1 0;
        min-width: 0;
        padding-inline: 10px;
    }
}

/* Dian-Tibetan route editorial story cards */
.route-node-backdrop-editorial {
    padding: 24px;
    background: rgba(5, 14, 12, .78);
    backdrop-filter: grayscale(.28) brightness(.58) blur(1px);
}

.route-node-backdrop-editorial .route-story-card-editorial {
    --node-accent: #47705f;
    --node-accent-soft: #dce8df;
    position: relative;
    inset: auto;
    width: min(1120px, calc(100vw - 72px));
    height: min(730px, calc(100vh - 48px));
    max-height: none;
    display: grid;
    grid-template-rows: 70px 8px minmax(0, 1fr) 62px;
    padding: 0 30px 18px;
    overflow: hidden;
    border: 1px solid rgba(238, 223, 188, .76);
    border-radius: 5px;
    color: #303531;
    background: linear-gradient(90deg, rgba(255, 255, 255, .18), transparent 13%, transparent 87%, rgba(31, 57, 49, .035)), #f4f1e8;
    box-shadow: 0 30px 90px rgba(0, 0, 0, .62), inset 0 0 0 5px rgba(67, 84, 74, .045);
    animation: route-editorial-card-in .36s cubic-bezier(.2, .7, .2, 1) both;
}

.route-story-card-editorial::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 7px;
    background: var(--node-accent);
}

@keyframes route-editorial-card-in {
    from { opacity: 0; transform: translateY(14px) scale(.988); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}

.route-node-backdrop-editorial .route-node-close {
    right: 18px;
    top: 17px;
    width: 34px;
    height: 34px;
    border-color: rgba(48, 53, 49, .22);
    color: #36413a;
    background: rgba(244, 241, 232, .88);
}

.route-editorial-header {
    display: grid;
    grid-template-columns: 220px minmax(260px, 1fr);
    align-items: center;
    gap: 22px;
    padding: 0 46px 0 2px !important;
}

.route-editorial-route {
    display: grid;
    align-self: end;
    gap: 3px;
    padding-bottom: 5px;
    transform: translateY(2px);
}
.route-editorial-route small {
    color: #7a7469 !important;
    font: 700 9px/1.1 "Epilogue", Arial, sans-serif !important;
}
.route-editorial-route .route-editorial-pinyin {
    color: #c66b3d !important;
    font: 800 11px/1 "Epilogue", Arial, sans-serif !important;
    letter-spacing: .16em;
    text-transform: uppercase;
}
.route-editorial-route b {
    color: #173d36;
    font: 800 24px/1.08 "STKaiti", "KaiTi", serif;
}

.route-editorial-progress {
    position: relative;
    display: grid;
    grid-template-columns: repeat(var(--route-node-count, 6), minmax(0, 1fr));
    align-items: center;
    width: min(390px, 100%);
    justify-self: center;
}
.route-editorial-progress::before {
    content: "";
    position: absolute;
    left: calc(50% / var(--route-node-count, 6));
    right: calc(50% / var(--route-node-count, 6));
    top: 50%;
    height: 1px;
    background: rgba(54, 67, 59, .24);
}
.route-editorial-progress i {
    position: relative;
    z-index: 1;
    width: 18px;
    height: 18px;
    display: grid;
    place-items: center;
    justify-self: center;
    border: 1px solid rgba(50, 65, 56, .36);
    border-radius: 50%;
    color: transparent;
    background: #f4f1e8;
    font: normal 700 8px/1 "Epilogue", Arial, sans-serif;
}
.route-editorial-progress i.passed { border-color: var(--node-accent); background: var(--node-accent-soft); }
.route-editorial-progress i.active {
    width: 24px;
    height: 24px;
    border: 2px solid var(--node-accent);
    color: #fff;
    background: var(--node-accent);
    box-shadow: 0 0 0 4px color-mix(in srgb, var(--node-accent-soft) 72%, transparent);
}
.route-editorial-progress i span {
    padding: 0 !important;
    border: 0 !important;
    color: inherit !important;
    font: inherit !important;
}

.route-editorial-node {
    display: grid;
    grid-template-columns: auto auto auto;
    align-items: baseline;
    justify-content: end;
    gap: 5px;
    color: #746d60;
}
.route-editorial-node span,
.route-editorial-node small {
    padding: 0 !important;
    border: 0 !important;
    color: #746d60 !important;
    font: 700 9px/1 "Epilogue", Arial, sans-serif !important;
}
.route-editorial-node b { color: var(--node-accent); font: 800 25px/1 "Epilogue", Arial, sans-serif; }

.route-editorial-rule {
    position: relative;
    height: 8px;
    border-top: 1px solid rgba(48, 53, 49, .24);
}
.route-editorial-rule span {
    position: absolute;
    left: 0;
    top: -2px;
    width: 31%;
    height: 3px;
    background: var(--node-accent);
}

.route-editorial-sheet {
    min-height: 0;
    display: grid;
    grid-template-columns: minmax(0, 1.12fr) minmax(360px, .88fr);
    gap: 32px;
    padding: 18px 2px 14px;
    overflow: hidden;
}
.route-editorial-visual { position: relative; min-width: 0; min-height: 0; overflow: visible; }
.route-editorial-photo-stack {
    position: relative;
    z-index: 2;
    width: 100%;
    height: 100%;
    min-height: 0;
    display: grid;
}
.route-editorial-visual-diptych .route-editorial-photo-stack {
    grid-template-rows: minmax(0, 1.14fr) minmax(120px, .86fr);
    gap: 12px;
}

.route-editorial-figure {
    position: relative;
    min-width: 0;
    min-height: 0;
    margin: 0;
    overflow: hidden;
    border: 1px solid rgba(49, 58, 53, .32);
    border-radius: 1px;
    background: #d7d9d2;
    box-shadow: 5px 6px 0 rgba(68, 73, 67, .07);
}
.route-editorial-figure img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    filter: saturate(.92) contrast(1.02);
}
.route-editorial-figure figcaption {
    position: absolute;
    left: 10px;
    right: 10px;
    bottom: 9px;
    display: grid;
    grid-template-columns: 28px minmax(0, 1fr);
    align-items: center;
    gap: 8px;
    padding: 7px 9px;
    color: #f5f2e9;
    background: rgba(21, 42, 35, .8);
    backdrop-filter: blur(4px);
}
.route-editorial-figure figcaption i { color: #e4be7d; font: normal 800 10px/1 "Epilogue", Arial, sans-serif; }
.route-editorial-figure figcaption span {
    display: -webkit-box;
    overflow: hidden;
    font-size: 10px;
    font-weight: 650;
    line-height: 1.45;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}
.route-editorial-figure > span {
    position: absolute;
    inset: 0;
    display: none;
    place-items: center;
    color: #6b695f;
    font-size: 12px;
}
.route-editorial-figure.image-missing img,
.route-editorial-figure.image-missing figcaption { display: none; }
.route-editorial-figure.image-missing > span { display: grid; }
.route-editorial-visual-diptych .route-editorial-figure-2 { width: 78%; justify-self: end; margin-top: -4px; }

.route-editorial-motif {
    position: absolute;
    z-index: 3;
    right: -28px;
    bottom: -16px;
    width: min(65%, 360px);
    height: auto;
    opacity: .48;
    pointer-events: none;
    mix-blend-mode: multiply;
    animation: route-editorial-motif-in .7s .12s ease-out both;
}
@keyframes route-editorial-motif-in {
    from { transform: translateX(10px); }
    to { transform: translateX(0); }
}
.route-editorial-motif-label {
    position: absolute;
    z-index: 4;
    right: 2px;
    bottom: 1px;
    padding: 3px 6px;
    border: 1px solid color-mix(in srgb, var(--node-accent) 45%, transparent);
    color: var(--node-accent);
    background: rgba(244, 241, 232, .82);
    font-size: 9px;
    font-weight: 800;
}

.route-editorial-copy {
    position: relative;
    z-index: 4;
    min-width: 0;
    min-height: 0;
    display: grid;
    grid-template-rows: auto auto auto minmax(0, 1fr) auto;
    align-content: start;
    padding: 4px 2px 0;
}
.route-editorial-eyebrow {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    color: var(--node-accent);
    font-size: 11px;
    font-weight: 800;
}
.route-editorial-eyebrow i {
    flex: 0 0 auto;
    padding: 4px 8px;
    border: 1px solid color-mix(in srgb, var(--node-accent) 55%, transparent);
    color: var(--node-accent);
    font-style: normal;
    background: color-mix(in srgb, var(--node-accent-soft) 55%, transparent);
}
.route-editorial-copy h2 {
    max-width: 390px;
    margin: 9px 0 8px;
    color: #173d36;
    font: 900 28px/1.25 "STKaiti", "KaiTi", serif;
    letter-spacing: 0;
}
.route-editorial-meta {
    display: flex;
    align-items: center;
    gap: 9px;
    margin-bottom: 11px;
    color: #797266;
    font-size: 10px;
    font-weight: 750;
}
.route-editorial-meta i { width: 22px; height: 1px; background: #a39784; }
.route-editorial-scroll {
    min-height: 0;
    overflow: auto;
    padding: 0 11px 0 0;
}
.route-editorial-scroll p {
    margin: 0 0 9px;
    color: #434b45;
    font-size: 13.5px;
    font-weight: 560;
    line-height: 1.76;
    text-align: justify;
}
.route-editorial-scroll p.lead { color: #303b34; font-size: 14.5px; font-weight: 650; }
.route-editorial-copy blockquote {
    position: relative;
    margin: 11px 0 0;
    padding: 9px 12px 8px 15px;
    border: 0;
    border-left: 3px solid var(--node-accent);
    color: #45534a;
    background: color-mix(in srgb, var(--node-accent-soft) 48%, transparent);
    font: 700 12px/1.62 "STKaiti", "KaiTi", serif;
}

.route-editorial-facts {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0 13px;
    margin: 13px 0 2px;
    border-top: 1px solid rgba(54, 62, 56, .2);
}
.route-editorial-facts > div {
    min-width: 0;
    display: grid;
    grid-template-columns: 25px minmax(0, 1fr);
    gap: 8px;
    padding: 8px 0;
    border-bottom: 1px solid rgba(54, 62, 56, .16);
}
.route-editorial-facts dt { color: var(--node-accent); font: 800 9px/1.4 "Epilogue", Arial, sans-serif; }
.route-editorial-facts dd { min-width: 0; display: grid; gap: 2px; margin: 0; }
.route-editorial-facts dd b { color: #33423a; font-size: 11px; }
.route-editorial-facts dd span { color: #626b64; font-size: 10px; line-height: 1.45; }

.route-node-backdrop-editorial .route-editorial-footer {
    display: grid;
    grid-template-columns: auto 1fr;
    align-items: center;
    gap: 10px;
    margin: 0;
    padding-top: 12px;
    border-top: 1px solid rgba(48, 53, 49, .22);
}
.route-editorial-footer nav { display: flex; gap: 6px; }
.route-node-backdrop-editorial .route-node-page-button {
    width: 70px;
    height: 34px;
    display: grid;
    grid-template-columns: auto auto;
    place-content: center;
    gap: 6px;
    border-radius: 1px;
    color: #625f57;
    background: transparent;
}
.route-node-backdrop-editorial .route-node-page-button i { font: normal 800 9px/1 "Epilogue", Arial, sans-serif; }
.route-node-backdrop-editorial .route-node-page-button span { font-size: 11px; font-weight: 750; }
.route-node-backdrop-editorial .route-node-page-button.active { border-color: var(--node-accent); color: #fff; background: var(--node-accent); }
.route-editorial-arrow {
    width: 34px;
    height: 34px;
    padding: 0;
    border: 1px solid rgba(49, 59, 52, .3);
    border-radius: 50%;
    color: #34453c;
    background: transparent;
    font-size: 18px;
}
.route-editorial-arrow:disabled { opacity: .25; cursor: default; }
.route-editorial-page-count { justify-self: start; color: #817a6d; font: 800 10px/1 "Epilogue", Arial, sans-serif; }
.route-editorial-footer .route-btn-primary { justify-self: end; }
.route-node-backdrop-editorial .route-btn-primary {
    min-width: 116px;
    height: 38px;
    border-color: var(--node-accent);
    background: var(--node-accent);
}

.route-story-lhasa-arrival .route-editorial-visual { isolation: isolate; }
.route-story-lhasa-arrival .route-editorial-photo-stack {
    width: 79%;
    height: 78%;
    align-self: end;
    margin-top: auto;
}
.route-story-lhasa-arrival .route-editorial-motif {
    z-index: 1;
    right: -92%;
    top: -8px;
    bottom: auto;
    width: 142%;
    max-width: none;
    opacity: .54;
}
.route-story-lhasa-arrival .route-editorial-motif-label { right: -4px; top: 7px; bottom: auto; }
.route-story-page-evidence .route-editorial-motif,
.route-story-page-legacy .route-editorial-motif { opacity: .34; }

@media (max-height: 760px) and (min-width: 861px) {
    .route-node-backdrop-editorial .route-story-card-editorial {
        height: calc(100vh - 30px);
        grid-template-rows: 62px 7px minmax(0, 1fr) 56px;
        padding-bottom: 14px;
    }
    .route-editorial-sheet { padding-top: 12px; padding-bottom: 10px; }
    .route-editorial-copy h2 { margin-top: 6px; font-size: 25px; }
    .route-editorial-scroll p { margin-bottom: 7px; font-size: 12.5px; line-height: 1.66; }
    .route-editorial-scroll p.lead { font-size: 13.5px; }
    .route-editorial-copy blockquote { margin-top: 7px; padding-top: 6px; padding-bottom: 6px; }
}

@media (max-width: 860px) {
    .route-node-backdrop-editorial { padding: 0; }
    .route-node-backdrop-editorial .route-story-card-editorial {
        width: 100vw;
        height: 100svh;
        grid-template-rows: 60px 7px minmax(0, 1fr) auto;
        padding: 0 18px 12px;
        border: 0;
        border-radius: 0;
    }
    .route-editorial-header { grid-template-columns: 1fr; padding-right: 40px !important; }
    .route-editorial-route small,
    .route-editorial-progress { display: none; }
    .route-editorial-sheet {
        grid-template-columns: 1fr;
        grid-template-rows: minmax(220px, 42svh) auto;
        gap: 18px;
        overflow: auto;
    }
    .route-editorial-copy { overflow: visible; }
    .route-editorial-scroll { overflow: visible; padding-right: 0; }
    .route-node-backdrop-editorial .route-editorial-footer {
        grid-template-columns: auto minmax(0, 1fr);
        gap: 6px;
    }
    .route-editorial-footer nav { justify-content: center; }
    .route-node-backdrop-editorial .route-node-page-button { width: 34px; grid-template-columns: 1fr; }
    .route-node-backdrop-editorial .route-node-page-button span,
    .route-editorial-page-count { display: none; }
    .route-node-backdrop-editorial .route-btn-primary { min-width: 94px; padding: 0 10px; }
    .route-story-lhasa-arrival .route-editorial-motif { right: -38%; width: 104%; }
}

@media (prefers-reduced-motion: reduce) {
    .route-story-card-editorial,
    .route-editorial-motif { animation: none !important; }
}

/* Keep the editorial layout independent from the legacy compact story-card rules. */
.route-story-card-editorial .route-editorial-figure {
    aspect-ratio: auto;
}

.route-story-card-editorial .route-editorial-visual-single .route-editorial-photo-stack {
    height: 78%;
}

.route-story-card-editorial .route-editorial-visual-single .route-editorial-motif {
    right: 2px;
    bottom: -8px;
    width: min(62%, 350px);
}

.route-story-card-editorial .route-editorial-visual-diptych .route-editorial-motif {
    left: -12px;
    right: auto;
    bottom: -4px;
    width: min(43%, 240px);
}

.route-story-card-editorial .route-editorial-visual-diptych .route-editorial-motif-label {
    left: 2px;
    right: auto;
}

.route-story-card-editorial.route-story-lhasa-arrival .route-editorial-motif {
    right: -92%;
    top: -8px;
    bottom: auto;
    width: 142%;
    opacity: .54;
}

.route-story-card-editorial .route-editorial-figure img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    filter: saturate(.92) contrast(1.02);
}

.route-story-card-editorial .route-editorial-figure figcaption {
    left: 10px;
    right: 10px;
    bottom: 9px;
    padding: 7px 9px;
    color: #f5f2e9;
    background: rgba(21, 42, 35, .8);
}

.route-node-backdrop.route-node-backdrop-editorial .route-story-card.route-story-card-editorial > footer.route-editorial-footer {
    grid-template-columns: auto 1fr;
    gap: 10px;
    margin-top: 0;
}

@media (max-width: 860px) {
    .route-node-backdrop.route-node-backdrop-editorial .route-story-card.route-story-card-editorial > footer.route-editorial-footer {
        grid-template-columns: auto minmax(0, 1fr);
        gap: 6px;
    }
}

/* Sichuan-Tibetan route: stable three-part editorial system. */
.route-story-card-editorial.route-story-corridor-chuanzang {
    width: min(1160px, calc(100vw - 72px));
    height: min(744px, calc(100vh - 48px));
    grid-template-rows: 72px 9px minmax(0, 1fr) 64px;
    padding: 0 32px 18px;
    border-color: rgba(118, 91, 57, .54);
    color: #313832;
    background-color: #f3efe4;
    background-image:
        repeating-linear-gradient(0deg, rgba(92, 73, 49, .018) 0, rgba(92, 73, 49, .018) 1px, transparent 1px, transparent 5px),
        linear-gradient(90deg, rgba(111, 82, 46, .045), transparent 16%, transparent 82%, rgba(54, 78, 65, .04));
    box-shadow: 0 30px 90px rgba(0, 0, 0, .62), inset 0 0 0 1px rgba(255, 255, 255, .54), inset 0 0 0 7px rgba(71, 80, 67, .025);
}

.route-story-card-editorial.route-story-corridor-chuanzang::before {
    width: 8px;
    background: linear-gradient(180deg, var(--node-accent), #9b7449 64%, #9b493c);
}

.route-story-corridor-chuanzang::after {
    content: "";
    position: absolute;
    z-index: 1;
    inset: 12px;
    border: 1px solid rgba(113, 88, 57, .1);
    pointer-events: none;
}

.route-story-corridor-chuanzang .route-editorial-header,
.route-story-corridor-chuanzang .route-editorial-rule,
.route-story-corridor-chuanzang .route-editorial-sheet,
.route-story-corridor-chuanzang .route-editorial-footer {
    position: relative;
    z-index: 3;
}

.route-story-corridor-chuanzang .route-editorial-route small {
    color: #81745f !important;
    letter-spacing: 0;
}

.route-story-corridor-chuanzang .route-editorial-route b,
.route-story-corridor-chuanzang .route-editorial-copy h2 {
    color: #273f35;
}

.route-story-corridor-chuanzang .route-editorial-rule {
    border-top-color: rgba(91, 73, 49, .28);
}

.route-story-corridor-chuanzang .route-editorial-rule::after {
    content: "茶 · 路 · 人";
    position: absolute;
    right: 2px;
    top: -6px;
    padding-left: 10px;
    color: #8b7a61;
    background: #f3efe4;
    font: 700 9px/1 "STKaiti", "KaiTi", serif;
}

.route-story-corridor-chuanzang .route-editorial-sheet {
    gap: 34px;
    padding: 20px 3px 14px;
}

.route-story-corridor-chuanzang .route-editorial-figure {
    border-color: rgba(83, 69, 49, .34);
    border-radius: 2px;
    background: #d9d4c6;
    box-shadow: 6px 7px 0 rgba(83, 69, 49, .07);
}

.route-story-corridor-chuanzang .route-editorial-figure img {
    filter: saturate(.88) contrast(1.035) sepia(.06);
}

.route-story-corridor-chuanzang .route-editorial-figure figcaption {
    left: 12px;
    right: 12px;
    bottom: 11px;
    min-height: 42px;
    background: rgba(31, 50, 42, .84);
}

.route-story-corridor-chuanzang .route-editorial-copy {
    padding-top: 3px;
}

.route-story-corridor-chuanzang .route-editorial-copy h2 {
    max-width: 430px;
    margin: 9px 0 8px;
    font-size: 29px;
    line-height: 1.23;
}

.route-story-corridor-chuanzang .route-editorial-scroll p {
    color: #424a43;
    line-height: 1.74;
}

.route-story-corridor-chuanzang .route-editorial-copy blockquote {
    border-left-color: #9b7449;
    color: #415047;
    background: color-mix(in srgb, var(--node-accent-soft) 54%, #f3efe4);
}

.route-story-corridor-chuanzang > .route-editorial-motif-header {
    position: absolute;
    z-index: 2;
    width: 310px;
    height: 310px;
    object-fit: contain;
    opacity: .12;
    filter: saturate(.72) sepia(.12);
    mix-blend-mode: multiply;
    pointer-events: none;
    animation: route-editorial-motif-in .7s .12s ease-out both;
}

.route-story-corridor-chuanzang.route-story-page-arrival > .route-editorial-motif-header {
    right: 9%;
    top: 78px;
}

.route-story-corridor-chuanzang.route-story-page-evidence > .route-editorial-motif-header {
    left: 3%;
    right: auto;
    top: 96px;
    opacity: .1;
}

.route-story-corridor-chuanzang.route-story-page-legacy > .route-editorial-motif-header {
    right: 2%;
    bottom: 42px;
    top: auto;
    opacity: .14;
}

/* Page 01: place-first scene with a strong primary image and supporting crop. */
.route-story-corridor-chuanzang.route-story-page-arrival .route-editorial-sheet {
    grid-template-columns: minmax(0, 1.18fr) minmax(390px, .82fr);
}

.route-story-corridor-chuanzang.route-story-page-arrival .route-editorial-visual-diptych .route-editorial-photo-stack {
    grid-template-columns: minmax(0, 1.24fr) minmax(150px, .76fr);
    grid-template-rows: 1fr;
    gap: 11px;
}

.route-story-corridor-chuanzang.route-story-page-arrival .route-editorial-visual-diptych .route-editorial-figure-2 {
    width: 100%;
    margin: 38px 0 0;
}

.route-story-corridor-chuanzang.route-story-page-arrival .route-editorial-visual-single .route-editorial-photo-stack {
    height: 100%;
}

/* Page 02: two equally legible records, aligned like an archive spread. */
.route-story-corridor-chuanzang.route-story-page-evidence .route-editorial-sheet {
    grid-template-columns: minmax(0, .98fr) minmax(405px, 1.02fr);
}

.route-story-corridor-chuanzang.route-story-page-evidence .route-editorial-visual-diptych .route-editorial-photo-stack {
    grid-template-columns: 1fr 1fr;
    grid-template-rows: 1fr;
    gap: 10px;
}

.route-story-corridor-chuanzang.route-story-page-evidence .route-editorial-visual-diptych .route-editorial-figure-2 {
    width: 100%;
    margin: 24px 0 0;
}

.route-story-corridor-chuanzang.route-story-page-evidence .route-editorial-visual-single .route-editorial-photo-stack {
    height: 100%;
}

.route-story-corridor-chuanzang.route-story-page-evidence .route-editorial-scroll p {
    margin-bottom: 7px;
    font-size: 13px;
    line-height: 1.64;
}

.route-story-corridor-chuanzang.route-story-page-evidence .route-editorial-scroll p.lead {
    font-size: 14px;
}

.route-story-corridor-chuanzang.route-story-page-evidence .route-editorial-facts {
    margin-top: 7px;
}

.route-story-corridor-chuanzang.route-story-page-evidence .route-editorial-facts > div {
    padding: 5px 0;
}

/* Page 03: contemporary image strip with room for transmission facts. */
.route-story-corridor-chuanzang.route-story-page-legacy .route-editorial-sheet {
    grid-template-columns: minmax(0, .9fr) minmax(420px, 1.1fr);
}

.route-story-corridor-chuanzang.route-story-page-legacy .route-editorial-visual-diptych .route-editorial-photo-stack {
    grid-template-columns: 1fr;
    grid-template-rows: minmax(0, 1.12fr) minmax(112px, .88fr);
    gap: 10px;
}

.route-story-corridor-chuanzang.route-story-page-legacy .route-editorial-visual-diptych .route-editorial-figure-2 {
    width: 82%;
    margin: -2px 0 0;
    justify-self: end;
}

.route-story-corridor-chuanzang.route-story-page-legacy .route-editorial-visual-single .route-editorial-photo-stack {
    height: 84%;
    align-self: center;
}

.route-story-corridor-chuanzang .route-editorial-facts {
    margin-top: 11px;
    border-top-color: rgba(91, 73, 49, .22);
}

.route-story-corridor-chuanzang .route-editorial-facts > div {
    border-bottom-color: rgba(91, 73, 49, .16);
}

@media (max-height: 760px) and (min-width: 861px) {
    .route-story-card-editorial.route-story-corridor-chuanzang {
        height: calc(100vh - 30px);
        grid-template-rows: 62px 8px minmax(0, 1fr) 56px;
        padding-bottom: 14px;
    }
    .route-story-corridor-chuanzang .route-editorial-copy h2 { font-size: 25px; }
    .route-story-corridor-chuanzang > .route-editorial-motif-header { width: 260px; height: 260px; }
}

@media (max-width: 860px) {
    .route-story-card-editorial.route-story-corridor-chuanzang {
        width: 100vw;
        height: 100svh;
        padding: 0 18px 12px;
    }
    .route-story-corridor-chuanzang.route-story-page-arrival .route-editorial-sheet,
    .route-story-corridor-chuanzang.route-story-page-evidence .route-editorial-sheet,
    .route-story-corridor-chuanzang.route-story-page-legacy .route-editorial-sheet {
        grid-template-columns: 1fr;
    }
    .route-story-corridor-chuanzang > .route-editorial-motif-header {
        width: 190px;
        height: 190px;
        right: -20px !important;
        left: auto !important;
    }
}

/* Shared image-aware layouts: preserve each source image's complete composition. */
.route-story-card-editorial .route-editorial-figure img {
    object-fit: contain;
    background:
        linear-gradient(rgba(30, 43, 36, .035), rgba(30, 43, 36, .035)),
        #e6e1d5;
}

.route-story-corridor-dianzang > .route-editorial-motif-header {
    position: absolute;
    z-index: 2;
    width: 300px;
    height: 300px;
    object-fit: contain;
    opacity: .13;
    filter: saturate(.76) sepia(.1);
    mix-blend-mode: multiply;
    -webkit-mask-image: radial-gradient(ellipse at center, #000 48%, rgba(0, 0, 0, .9) 61%, transparent 82%);
    mask-image: radial-gradient(ellipse at center, #000 48%, rgba(0, 0, 0, .9) 61%, transparent 82%);
    pointer-events: none;
    animation: route-editorial-motif-in .7s .12s ease-out both;
}

.route-story-corridor-dianzang.route-story-page-arrival > .route-editorial-motif-header {
    right: 6%;
    top: 76px;
}

.route-story-corridor-dianzang.route-story-page-evidence > .route-editorial-motif-header {
    left: 2%;
    right: auto;
    top: 92px;
    opacity: .1;
}

.route-story-corridor-dianzang.route-story-page-legacy > .route-editorial-motif-header {
    right: 1%;
    top: auto;
    bottom: 42px;
    opacity: .14;
}

.route-story-corridor-dianzang.route-story-node-lhasa > .route-editorial-motif-header {
    width: 370px;
    height: 370px;
    opacity: .18;
}

.route-story-corridor-dianzang.route-story-node-lhasa.route-story-page-evidence > .route-editorial-motif-header {
    left: auto;
    right: 1%;
    top: auto;
    bottom: 34px;
    opacity: .16;
}

@media (min-width: 861px) {
    .route-story-images-1 .route-editorial-sheet {
        grid-template-columns: minmax(0, .9fr) minmax(420px, 1.1fr);
    }

    .route-story-images-1 .route-editorial-photo-stack,
    .route-story-corridor-chuanzang.route-story-images-1 .route-editorial-visual-single .route-editorial-photo-stack {
        width: 88%;
        height: 82%;
        place-self: center;
    }

    .route-story-images-1 .route-editorial-figure {
        width: 100%;
        height: auto;
        aspect-ratio: var(--story-image-ratio, 1.5);
        place-self: center;
    }

    .route-story-images-1.route-story-orient-portrait .route-editorial-photo-stack {
        width: 58%;
        height: 94%;
    }

    .route-story-images-2.route-story-orient-landscape-landscape .route-editorial-photo-stack,
    .route-story-corridor-chuanzang.route-story-images-2.route-story-orient-landscape-landscape .route-editorial-photo-stack {
        grid-template-columns: 1fr;
        grid-template-rows: 1fr 1fr;
        gap: 10px;
    }

    .route-story-images-2.route-story-orient-landscape-landscape .route-editorial-figure-1 {
        width: 84%;
        height: auto;
        aspect-ratio: var(--story-image-ratio, 1.5);
        margin: 0;
        align-self: center;
        justify-self: start;
    }

    .route-story-images-2.route-story-orient-landscape-landscape .route-editorial-figure-2 {
        width: 84%;
        height: auto;
        aspect-ratio: var(--story-image-ratio, 1.5);
        margin: 0;
        align-self: center;
        justify-self: end;
    }

    .route-story-images-2:is(.route-story-orient-landscape-portrait, .route-story-orient-portrait-landscape) .route-editorial-photo-stack,
    .route-story-corridor-chuanzang.route-story-images-2:is(.route-story-orient-landscape-portrait, .route-story-orient-portrait-landscape) .route-editorial-photo-stack {
        grid-template-columns: minmax(150px, .68fr) minmax(0, 1.32fr);
        grid-template-rows: 1fr;
        gap: 12px;
    }

    .route-story-images-2:is(.route-story-orient-landscape-portrait, .route-story-orient-portrait-landscape) .route-editorial-figure-portrait {
        width: 100%;
        height: auto;
        aspect-ratio: var(--story-image-ratio, .75);
        margin: 0;
        align-self: center;
        grid-column: 1;
    }

    .route-story-images-2:is(.route-story-orient-landscape-portrait, .route-story-orient-portrait-landscape) .route-editorial-figure-landscape {
        width: 100%;
        height: auto;
        aspect-ratio: var(--story-image-ratio, 1.5);
        margin: 34px 0 0;
        grid-column: 2;
    }
}

.route-story-corridor-dianzang.route-story-node-shuhe:is(.route-story-page-evidence, .route-story-page-legacy) .route-editorial-scroll p {
    margin-bottom: 7px;
    font-size: 13px;
    line-height: 1.66;
}

.route-story-corridor-dianzang.route-story-node-shuhe:is(.route-story-page-evidence, .route-story-page-legacy) .route-editorial-scroll p.lead {
    font-size: 14px;
}

.route-story-corridor-dianzang.route-story-node-shuhe.route-story-page-legacy .route-editorial-scroll p {
    margin-bottom: 6px;
    font-size: 12.5px;
    line-height: 1.58;
}

.route-story-corridor-dianzang.route-story-node-shuhe.route-story-page-legacy .route-editorial-scroll p.lead {
    font-size: 13.5px;
}

@media (max-width: 860px) {
    .route-story-card-editorial .route-editorial-photo-stack {
        gap: 10px;
    }

    .route-story-corridor-dianzang > .route-editorial-motif-header {
        width: 190px;
        height: 190px;
        right: -20px !important;
        left: auto !important;
    }
}

/* Qinghai-Tibetan route: cultural exchange on a restrained hand-painted folio. */
.route-story-card-editorial.route-story-corridor-qingzang {
    width: min(1180px, calc(100vw - 72px));
    height: min(748px, calc(100vh - 48px));
    grid-template-rows: 72px 9px minmax(0, 1fr) 64px;
    padding: 0 34px 18px;
    border-color: rgba(117, 89, 55, .58);
    color: #303a36;
    background-color: #f2eee2;
    background-image:
        repeating-linear-gradient(0deg, rgba(73, 66, 52, .018) 0, rgba(73, 66, 52, .018) 1px, transparent 1px, transparent 6px),
        linear-gradient(90deg, rgba(151, 94, 51, .045), transparent 14%, transparent 84%, rgba(44, 89, 83, .045));
    box-shadow: 0 30px 90px rgba(0, 0, 0, .64), inset 0 0 0 1px rgba(255, 255, 255, .58), inset 0 0 0 8px rgba(83, 69, 48, .025);
}

.route-story-card-editorial.route-story-corridor-qingzang::before {
    width: 8px;
    background: linear-gradient(180deg, #9b493c, var(--node-accent) 48%, #9a743d);
}

.route-story-card-editorial.route-story-corridor-qingzang::after {
    content: "";
    position: absolute;
    z-index: 1;
    inset: 12px;
    border: 1px solid rgba(106, 79, 48, .1);
    pointer-events: none;
}

.route-story-corridor-qingzang .route-editorial-header,
.route-story-corridor-qingzang .route-editorial-rule,
.route-story-corridor-qingzang .route-editorial-sheet,
.route-story-corridor-qingzang .route-editorial-footer {
    position: relative;
    z-index: 4;
}

.route-story-corridor-qingzang .route-editorial-route small {
    color: #c66b3d !important;
}

.route-story-corridor-qingzang .route-editorial-route b,
.route-story-corridor-qingzang .route-editorial-copy h2 {
    color: #263e37;
}

.route-story-corridor-qingzang .route-editorial-rule {
    border-top-color: rgba(88, 70, 45, .28);
}

.route-story-corridor-qingzang .route-editorial-rule::after {
    content: "使 · 路 · 市 · 融";
    position: absolute;
    right: 3px;
    top: -6px;
    padding-left: 11px;
    color: #8b775c;
    background: #f2eee2;
    font: 700 9px/1 "STKaiti", "KaiTi", serif;
}

.route-story-corridor-qingzang .route-editorial-sheet {
    gap: 38px;
    padding: 20px 4px 14px;
}

.route-story-corridor-qingzang .route-editorial-figure {
    border-color: rgba(89, 70, 45, .34);
    border-radius: 2px;
    background: #ded8ca;
    box-shadow: 6px 7px 0 rgba(82, 66, 46, .065);
}

.route-story-corridor-qingzang .route-editorial-figure img {
    background: #e5dfd1;
    filter: saturate(.88) contrast(1.025) sepia(.035);
}

.route-story-corridor-qingzang .route-editorial-figure figcaption {
    left: 11px;
    right: 11px;
    bottom: 10px;
    background: rgba(31, 51, 44, .86);
}

.route-story-corridor-qingzang .route-editorial-copy {
    padding-top: 2px;
}

.route-story-corridor-qingzang .route-editorial-copy h2 {
    max-width: 510px;
    margin: 9px 0 9px;
    font-size: 29px;
    line-height: 1.25;
}

.route-story-corridor-qingzang .route-editorial-scroll p {
    margin-bottom: 9px;
    color: #3f4944;
    font-size: 13.5px;
    line-height: 1.72;
}

.route-story-corridor-qingzang .route-editorial-scroll p.lead {
    color: #2e3b35;
    font-size: 14.5px;
}

.route-story-corridor-qingzang .route-editorial-copy blockquote {
    border-left-color: #9b7449;
    color: #405048;
    background: color-mix(in srgb, var(--node-accent-soft) 48%, #f2eee2);
}

.route-story-corridor-qingzang > .route-editorial-motif-header {
    position: absolute;
    z-index: 2;
    width: 390px;
    height: 256px;
    object-fit: contain;
    opacity: .17;
    filter: saturate(.78) sepia(.08);
    mix-blend-mode: multiply;
    pointer-events: none;
    animation: route-editorial-motif-in .7s .12s ease-out both;
}

.route-story-corridor-qingzang.route-story-page-arrival > .route-editorial-motif-header {
    right: 4%;
    top: 84px;
}

.route-story-corridor-qingzang.route-story-page-evidence > .route-editorial-motif-header {
    left: 1%;
    right: auto;
    top: 95px;
    opacity: .13;
}

.route-story-corridor-qingzang.route-story-page-legacy > .route-editorial-motif-header {
    right: 1%;
    top: auto;
    bottom: 45px;
    opacity: .18;
}

/* A single photo occupies a measured plate; the copy receives the extra room. */
@media (min-width: 861px) {
    .route-story-corridor-qingzang.route-story-images-1 .route-editorial-sheet-single {
        display: block;
        padding-right: 12px;
        padding-left: 12px;
    }

    .route-story-corridor-qingzang.route-story-images-1 .route-editorial-copy-single {
        width: 100%;
        height: 100%;
        grid-template-rows: auto auto auto minmax(0, 1fr) auto;
    }

    .route-story-corridor-qingzang.route-story-images-1 .route-editorial-flow {
        display: block;
        padding-right: 14px;
    }

    .route-story-corridor-qingzang.route-story-images-1 .route-editorial-flow-visual {
        float: left;
        width: min(46%, 480px);
        min-width: 390px;
        margin: 2px 34px 18px 0;
    }

    .route-story-corridor-qingzang.route-story-images-1 .route-editorial-flow-visual .route-editorial-photo-stack {
        width: 100%;
        height: auto;
    }

    .route-story-corridor-qingzang.route-story-images-1 .route-editorial-flow-visual .route-editorial-figure {
        width: 100%;
        height: auto;
        aspect-ratio: var(--story-image-ratio, 1.5);
    }

    .route-story-corridor-qingzang.route-story-images-1 .route-editorial-flow p {
        margin-bottom: 15px;
        line-height: 1.88;
    }

    /* Arrival is a landscape-first spread with a smaller contextual plate. */
    .route-story-corridor-qingzang.route-story-images-2.route-story-page-arrival .route-editorial-sheet {
        grid-template-columns: minmax(0, 1.08fr) minmax(430px, .92fr);
    }

    .route-story-corridor-qingzang.route-story-images-2.route-story-page-arrival .route-editorial-photo-stack {
        grid-template-columns: minmax(0, 1.28fr) minmax(145px, .72fr);
        grid-template-rows: 1fr;
        gap: 11px;
    }

    .route-story-corridor-qingzang.route-story-images-2.route-story-page-arrival .route-editorial-figure-1 {
        width: 100%;
        height: auto;
        margin: 0;
        align-self: center;
    }

    .route-story-corridor-qingzang.route-story-images-2.route-story-page-arrival .route-editorial-figure-2 {
        width: 100%;
        height: auto;
        margin: 42px 0 0;
        align-self: center;
    }

    /* Evidence pairs a detail with its larger spatial record. */
    .route-story-corridor-qingzang.route-story-page-evidence.route-story-images-2 .route-editorial-sheet {
        grid-template-columns: minmax(0, .98fr) minmax(445px, 1.02fr);
    }

    .route-story-corridor-qingzang.route-story-page-evidence.route-story-images-2:is(.route-story-orient-portrait-landscape, .route-story-orient-landscape-portrait) .route-editorial-photo-stack {
        grid-template-columns: minmax(145px, .68fr) minmax(0, 1.32fr);
        grid-template-rows: 1fr;
        gap: 12px;
    }

    .route-story-corridor-qingzang.route-story-page-evidence.route-story-images-2:is(.route-story-orient-portrait-landscape, .route-story-orient-landscape-portrait) .route-editorial-figure-portrait,
    .route-story-corridor-qingzang.route-story-page-evidence.route-story-images-2:is(.route-story-orient-portrait-landscape, .route-story-orient-landscape-portrait) .route-editorial-figure-landscape {
        width: 100%;
        height: auto;
        margin: 0;
        align-self: center;
    }

    .route-story-corridor-qingzang.route-story-page-evidence.route-story-orient-landscape-square .route-editorial-photo-stack {
        grid-template-columns: 1fr;
        grid-template-rows: minmax(0, 1.15fr) minmax(130px, .85fr);
        gap: 10px;
    }

    .route-story-corridor-qingzang.route-story-page-evidence.route-story-orient-landscape-square .route-editorial-figure-1 {
        width: 100%;
        height: auto;
        margin: 0;
    }

    .route-story-corridor-qingzang.route-story-page-evidence.route-story-orient-landscape-square .route-editorial-figure-2 {
        width: 58%;
        height: auto;
        margin: -2px 0 0;
        justify-self: end;
    }

    /* Today uses two calm horizontal bands, leaving the narrative dominant. */
    .route-story-corridor-qingzang.route-story-page-legacy.route-story-images-2 .route-editorial-sheet {
        grid-template-columns: minmax(0, .9fr) minmax(455px, 1.1fr);
    }

    .route-story-corridor-qingzang.route-story-page-legacy.route-story-images-2 .route-editorial-photo-stack {
        grid-template-columns: 1fr;
        grid-template-rows: 1fr 1fr;
        gap: 10px;
    }

    .route-story-corridor-qingzang.route-story-page-legacy.route-story-images-2 .route-editorial-figure-1 {
        width: 88%;
        height: auto;
        margin: 0;
        align-self: center;
        justify-self: start;
    }

    .route-story-corridor-qingzang.route-story-page-legacy.route-story-images-2 .route-editorial-figure-2 {
        width: 88%;
        height: auto;
        margin: 0;
        align-self: center;
        justify-self: end;
    }
}

@media (max-height: 760px) and (min-width: 861px) {
    .route-story-card-editorial.route-story-corridor-qingzang {
        height: calc(100vh - 30px);
        grid-template-rows: 62px 8px minmax(0, 1fr) 56px;
        padding-bottom: 14px;
    }

    .route-story-corridor-qingzang .route-editorial-copy h2 {
        font-size: 26px;
    }

    .route-story-corridor-qingzang .route-editorial-scroll p {
        margin-bottom: 6px;
        font-size: 12.5px;
        line-height: 1.62;
    }
}

@media (max-width: 860px) {
    .route-story-card-editorial.route-story-corridor-qingzang {
        width: 100vw;
        height: 100svh;
        padding: 0 18px 12px;
    }

    .route-story-corridor-qingzang .route-editorial-sheet {
        grid-template-columns: 1fr;
        grid-template-rows: minmax(210px, 39svh) auto;
        gap: 16px;
    }

    .route-story-corridor-qingzang > .route-editorial-motif-header {
        width: 230px;
        height: 150px;
        right: -28px !important;
        left: auto !important;
        opacity: .1;
    }

    .route-story-corridor-qingzang .route-editorial-copy h2 {
        font-size: 25px;
    }

    .route-story-corridor-qingzang.route-story-images-1 .route-editorial-sheet-single {
        display: block;
    }

    .route-story-corridor-qingzang.route-story-images-1 .route-editorial-flow-visual {
        float: none;
        width: 100%;
        min-width: 0;
        margin: 0 0 16px;
    }
}

/* Qinghai-Tibetan composition pass: three distinct page rhythms. */
.route-story-corridor-qingzang > .route-editorial-motif-header {
    width: 500px;
    height: 500px;
    opacity: .17;
    filter: saturate(.82) sepia(.08) contrast(1.04);
}

.route-story-corridor-qingzang.route-story-page-arrival > .route-editorial-motif-header {
    right: 1%;
    top: auto;
    bottom: 54px;
}

.route-story-corridor-qingzang.route-story-page-evidence > .route-editorial-motif-header {
    right: 0;
    bottom: 52px;
    left: auto;
    top: auto;
    opacity: .15;
}

.route-story-corridor-qingzang.route-story-page-legacy > .route-editorial-motif-header {
    right: auto;
    bottom: 50px;
    left: 1%;
    opacity: .17;
}

/* On one-image folios the cultural drawing inhabits the open lower field. */
.route-story-corridor-qingzang.route-story-images-1 > .route-editorial-motif-header {
    top: auto;
    right: 3%;
    bottom: 62px;
    left: auto;
    width: 520px;
    height: 430px;
    opacity: .18;
}

/* Batang evidence: preserve the full portrait and move 3D into a dedicated page. */
@media (min-width: 861px) {
    .route-story-corridor-chuanzang.route-story-node-batang.route-story-page-evidence .route-editorial-sheet-batang-feature {
        grid-template-columns: minmax(440px, .96fr) minmax(450px, 1.04fr);
        gap: 38px;
        padding-block: 16px 14px;
    }

    .route-story-corridor-chuanzang.route-story-node-batang .route-batang-feature-visual,
    .route-story-corridor-chuanzang.route-story-node-batang .route-batang-feature-visual .route-editorial-photo-stack {
        width: 100%;
        height: 100%;
        place-self: stretch;
    }

    .route-story-corridor-chuanzang.route-story-node-batang .route-batang-feature-visual {
        display: grid;
        grid-template-rows: minmax(150px, .78fr) minmax(230px, 1.22fr);
        gap: 12px;
        overflow: hidden;
    }

    .route-story-corridor-chuanzang.route-story-node-batang .route-batang-feature-visual .route-changdu-model {
        min-height: 0;
    }

    .route-story-corridor-chuanzang.route-story-node-batang .route-batang-feature-visual .route-editorial-figure {
        width: 100%;
        height: 100%;
        place-self: stretch;
    }

    .route-story-corridor-chuanzang.route-story-node-batang .route-batang-feature-visual .route-editorial-figure {
        aspect-ratio: auto;
        background: #e3ded2;
    }

    .route-story-corridor-chuanzang.route-story-node-batang .route-batang-feature-visual .route-editorial-figure img {
        object-fit: contain;
        object-position: center;
    }

    .route-story-corridor-chuanzang.route-story-node-batang .route-editorial-copy-batang-feature {
        height: 100%;
        grid-template-rows: auto auto auto minmax(0, 1fr) auto auto;
    }
}

.route-story-corridor-chuanzang.route-story-node-batang.route-story-page-evidence > .route-editorial-motif-header {
    z-index: 2;
    top: 142px;
    right: 1.5%;
    left: auto;
    width: 430px;
    height: 430px;
    opacity: .085;
}

.route-story-corridor-chuanzang.route-story-node-batang .route-editorial-copy-batang-feature {
    position: relative;
    z-index: 4;
}

.route-model-launch {
    min-width: 0;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 34px;
    align-items: center;
    gap: 12px;
    margin: 8px 0 0;
    padding: 8px 10px 8px 12px;
    border-top: 1px solid rgba(141, 77, 63, .28);
    border-bottom: 1px solid rgba(141, 77, 63, .18);
    color: #31443b;
    background: rgba(234, 219, 215, .34);
    text-decoration: none;
}

.route-model-launch span { min-width: 0; display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 2px 9px; align-items: baseline; }
.route-model-launch small { color: #8d4d3f; font-size: 9px; font-weight: 800; }
.route-model-launch b { overflow: hidden; font-size: 12px; line-height: 1.35; text-overflow: ellipsis; white-space: nowrap; }
.route-model-launch em { grid-column: 1 / -1; color: #7b756c; font-size: 9px; font-style: normal; line-height: 1.35; }
.route-model-launch > i {
    width: 30px;
    height: 30px;
    display: grid;
    place-items: center;
    border: 1px solid rgba(141, 77, 63, .38);
    color: #8d4d3f;
    font: normal 700 18px/1 Arial, sans-serif;
}
.route-model-launch:hover { background: rgba(234, 219, 215, .62); }
.route-model-launch:hover > i { color: #f5f1e8; background: #8d4d3f; }

.route-potala-model-launch {
    grid-template-columns: minmax(0, 1fr) 34px;
    margin-top: 12px;
    border: 1px solid rgba(116, 102, 91, .34);
    background: rgba(232, 230, 225, .58);
}

.route-potala-model-launch > span {
    display: block;
    color: #514a43;
    font-size: 12px;
    font-weight: 800;
    line-height: 1.4;
}

.route-potala-model-launch > i {
    border-color: rgba(116, 102, 91, .4);
    color: #635a52;
}

.route-potala-model-launch:hover { background: rgba(211, 209, 204, .72); }
.route-potala-model-launch:hover > i { background: #635a52; }

.route-story-corridor-chuanzang.route-story-node-batang .route-editorial-copy-batang-feature blockquote {
    margin-top: 8px;
}

@media (max-width: 860px) {
    .route-story-corridor-chuanzang.route-story-node-batang .route-editorial-sheet-batang-feature {
        grid-template-columns: 1fr;
        grid-template-rows: 440px auto;
        overflow: auto;
    }

    .route-story-corridor-chuanzang.route-story-node-batang .route-batang-feature-visual,
    .route-story-corridor-chuanzang.route-story-node-batang .route-batang-feature-visual .route-editorial-photo-stack {
        width: 100%;
        height: 100%;
    }

    .route-story-corridor-chuanzang.route-story-node-batang .route-batang-feature-visual {
        min-height: 520px;
        display: grid;
        grid-template-rows: 210px 298px;
        gap: 12px;
    }

    .route-story-corridor-chuanzang.route-story-node-batang .route-batang-feature-visual .route-changdu-model {
        min-height: 0;
    }

    .route-story-corridor-chuanzang.route-story-node-batang .route-batang-feature-visual .route-editorial-figure {
        width: 100%;
        height: 100%;
    }

    .route-story-corridor-chuanzang.route-story-node-batang .route-batang-feature-visual .route-editorial-figure img {
        object-fit: contain;
    }

    .route-story-corridor-chuanzang.route-story-node-batang .route-editorial-copy-batang-feature {
        min-height: 620px;
        grid-template-rows: auto auto auto auto auto auto;
    }

    .route-story-corridor-chuanzang.route-story-node-batang.route-story-page-evidence > .route-editorial-motif-header {
        top: 650px;
        right: -48px;
        width: 300px;
        height: 300px;
        opacity: .07;
    }
}

/* Changdu arrival: the left visual column pairs the city image with a local GLB viewer. */
@media (min-width: 861px) {
    .route-story-corridor-dianzang.route-story-node-changdu.route-story-page-arrival .route-editorial-sheet-changdu-model {
        grid-template-columns: minmax(0, .9fr) minmax(420px, 1.1fr);
        gap: 34px;
        padding-block: 16px 14px;
    }

    .route-story-corridor-dianzang.route-story-node-changdu .route-changdu-media-stack {
        height: 100%;
        display: grid;
        grid-template-rows: minmax(150px, .78fr) minmax(230px, 1.22fr);
        gap: 12px;
        overflow: hidden;
    }

    .route-story-corridor-dianzang.route-story-node-changdu .route-changdu-media-stack .route-editorial-photo-stack {
        width: 100%;
        height: 100%;
        place-self: stretch;
    }

    .route-story-corridor-dianzang.route-story-node-changdu .route-changdu-media-stack .route-editorial-figure {
        width: 100%;
        height: 100%;
        aspect-ratio: auto;
        place-self: stretch;
    }

    .route-story-corridor-dianzang.route-story-node-changdu .route-editorial-copy-changdu-model {
        height: 100%;
    }

}

.route-changdu-model {
    position: relative;
    min-width: 0;
    min-height: 0;
    overflow: hidden;
    border: 1px solid rgba(69, 89, 82, .28);
    background: #d8ded8;
    box-shadow: 5px 6px 0 rgba(68, 73, 67, .07);
}

.route-changdu-model-viewport,
.route-changdu-model-viewport canvas {
    width: 100%;
    height: 100%;
    display: block;
}

.route-changdu-model-viewport {
    position: absolute;
    inset: 0;
    cursor: grab;
    touch-action: none;
}

.route-changdu-model-viewport:active { cursor: grabbing; }

.route-changdu-model-toolbar {
    position: absolute;
    z-index: 5;
    right: 9px;
    bottom: 9px;
    left: 9px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    pointer-events: none;
}

.route-changdu-model-toolbar span {
    min-width: 0;
    padding: 5px 8px;
    overflow: hidden;
    color: #f5f2e9;
    background: rgba(21, 42, 35, .8);
    font-size: 10px;
    font-weight: 700;
    line-height: 1.2;
    text-overflow: ellipsis;
    white-space: nowrap;
    backdrop-filter: blur(4px);
}

.route-changdu-model-toolbar span[data-state="loading"]::before {
    content: "";
    width: 7px;
    height: 7px;
    display: inline-block;
    margin-right: 6px;
    border: 1px solid rgba(245, 242, 233, .45);
    border-top-color: #f5f2e9;
    border-radius: 50%;
    vertical-align: -1px;
    animation: route-changdu-model-spin .8s linear infinite;
}

.route-changdu-model-toolbar span[data-state="error"] { background: rgba(117, 51, 43, .9); }

.route-changdu-model-toolbar button {
    width: 32px;
    height: 32px;
    flex: 0 0 32px;
    display: grid;
    place-items: center;
    padding: 0;
    border: 1px solid rgba(245, 242, 233, .58);
    border-radius: 2px;
    color: #fff;
    background: rgba(21, 42, 35, .86);
    font: 700 21px/1 Arial, sans-serif;
    cursor: pointer;
    pointer-events: auto;
}

.route-changdu-model-toolbar button:hover { background: #173d36; }

@keyframes route-changdu-model-spin { to { transform: rotate(360deg); } }

@media (max-width: 860px) {
    .route-story-corridor-dianzang.route-story-node-changdu .route-editorial-sheet-changdu-model {
        grid-template-columns: 1fr;
        grid-template-rows: 520px auto;
        overflow: auto;
    }

    .route-story-corridor-dianzang.route-story-node-changdu .route-changdu-media-stack {
        min-height: 520px;
        display: grid;
        grid-template-rows: 210px 298px;
        gap: 12px;
    }

    .route-story-corridor-dianzang.route-story-node-changdu .route-changdu-media-stack .route-editorial-photo-stack,
    .route-story-corridor-dianzang.route-story-node-changdu .route-changdu-media-stack .route-editorial-figure {
        width: 100%;
        height: 100%;
    }

    .route-story-corridor-dianzang.route-story-node-changdu .route-editorial-copy-changdu-model {
        min-height: 460px;
    }

}

@media (min-width: 861px) {
    /* Page 01: overlapping travel album; the secondary image is a real plate, not a thumbnail. */
    .route-story-corridor-qingzang.route-story-page-arrival.route-story-images-2 .route-editorial-photo-stack {
        position: relative;
        display: block;
        width: 100%;
        height: 100%;
    }

    .route-story-corridor-qingzang.route-story-page-arrival.route-story-images-2 .route-editorial-figure {
        position: absolute;
        height: auto;
        aspect-ratio: var(--story-image-ratio, 1.5);
    }

    .route-story-corridor-qingzang.route-story-page-arrival.route-story-images-2 .route-editorial-figure-1 {
        z-index: 1;
        left: 0;
        top: 9%;
        width: 78%;
        margin: 0;
    }

    .route-story-corridor-qingzang.route-story-page-arrival.route-story-images-2 .route-editorial-figure-2 {
        z-index: 2;
        right: 0;
        bottom: 8%;
        width: 64%;
        margin: 0;
        box-shadow: -7px 8px 0 rgba(84, 65, 45, .08);
    }

    .route-story-corridor-qingzang.route-story-node-xian.route-story-page-arrival .route-editorial-figure-2,
    .route-story-corridor-qingzang.route-story-node-lhasa.route-story-page-arrival .route-editorial-figure-2 {
        width: 70%;
    }

    /* Page 02: diagonal archive table, tuned for every landscape/portrait pairing. */
    .route-story-corridor-qingzang.route-story-page-evidence.route-story-images-2 .route-editorial-photo-stack {
        position: relative;
        display: block;
        width: 100%;
        height: 100%;
    }

    .route-story-corridor-qingzang.route-story-page-evidence.route-story-images-2 .route-editorial-figure {
        position: absolute;
        height: auto;
        margin: 0;
        aspect-ratio: var(--story-image-ratio, 1.5);
    }

    .route-story-corridor-qingzang.route-story-page-evidence.route-story-orient-landscape-square .route-editorial-figure-1 {
        z-index: 1;
        left: 0;
        top: 3%;
        width: 94%;
    }

    .route-story-corridor-qingzang.route-story-page-evidence.route-story-orient-landscape-square .route-editorial-figure-2 {
        z-index: 2;
        right: 1%;
        bottom: 0;
        width: 66%;
        box-shadow: -7px 8px 0 rgba(84, 65, 45, .08);
    }

    .route-story-corridor-qingzang.route-story-page-evidence.route-story-images-2.route-story-orient-portrait-landscape .route-editorial-figure-portrait {
        z-index: 2;
        left: 0;
        bottom: 1%;
        width: 49%;
    }

    .route-story-corridor-qingzang.route-story-page-evidence.route-story-images-2.route-story-orient-portrait-landscape .route-editorial-figure-landscape {
        z-index: 1;
        right: 0;
        top: 8%;
        width: 78%;
    }

    .route-story-corridor-qingzang.route-story-page-evidence.route-story-images-2.route-story-orient-landscape-portrait .route-editorial-figure-landscape {
        z-index: 1;
        right: 0;
        top: 4%;
        width: 82%;
    }

    .route-story-corridor-qingzang.route-story-page-evidence.route-story-images-2.route-story-orient-landscape-portrait .route-editorial-figure-portrait {
        z-index: 2;
        left: 0;
        bottom: 0;
        width: 49%;
        box-shadow: 7px -7px 0 rgba(84, 65, 45, .07);
    }

    /* Page 03: reverse the reading direction and let contemporary images occupy the right. */
    .route-story-corridor-qingzang.route-story-page-legacy.route-story-images-2 .route-editorial-sheet {
        grid-template-columns: minmax(455px, 1.08fr) minmax(0, .92fr);
        gap: 42px;
    }

    .route-story-corridor-qingzang.route-story-page-legacy.route-story-images-2 .route-editorial-copy {
        grid-column: 1;
        grid-row: 1;
    }

    .route-story-corridor-qingzang.route-story-page-legacy.route-story-images-2 .route-editorial-visual {
        grid-column: 2;
        grid-row: 1;
    }

    .route-story-corridor-qingzang.route-story-page-legacy.route-story-images-2 .route-editorial-photo-stack {
        position: relative;
        display: block;
        width: 100%;
        height: 100%;
    }

    .route-story-corridor-qingzang.route-story-page-legacy.route-story-images-2 .route-editorial-figure {
        position: absolute;
        height: auto;
        margin: 0;
        aspect-ratio: var(--story-image-ratio, 1.5);
    }

    .route-story-corridor-qingzang.route-story-page-legacy.route-story-images-2 .route-editorial-figure-1 {
        z-index: 1;
        left: 0;
        top: 2%;
        width: 92%;
    }

    .route-story-corridor-qingzang.route-story-page-legacy.route-story-images-2 .route-editorial-figure-2 {
        z-index: 2;
        right: 0;
        bottom: 1%;
        width: 80%;
        box-shadow: -7px -7px 0 rgba(84, 65, 45, .075);
    }
}

@media (max-width: 860px) {
    .route-story-corridor-qingzang > .route-editorial-motif-header {
        width: 240px;
        height: 240px;
    }
}

/* Qingzang cards: keep paired images readable and give the copy a calm reading rhythm. */
@media (min-width: 861px) {
    .route-story-card-editorial.route-story-corridor-qingzang.route-story-images-2 .route-editorial-photo-stack {
        position: relative;
        display: grid;
        grid-template-columns: minmax(0, 1fr);
        grid-template-rows: minmax(0, 1fr) minmax(0, 1fr);
        gap: 14px;
        width: 100%;
        height: 100%;
    }

    .route-story-card-editorial.route-story-corridor-qingzang.route-story-images-2 .route-editorial-figure,
    .route-story-card-editorial.route-story-corridor-qingzang.route-story-images-2 .route-editorial-figure-1,
    .route-story-card-editorial.route-story-corridor-qingzang.route-story-images-2 .route-editorial-figure-2 {
        position: relative;
        inset: auto;
        z-index: auto;
        width: 100%;
        height: 100%;
        margin: 0;
        aspect-ratio: auto;
        align-self: stretch;
        justify-self: stretch;
        box-shadow: 5px 6px 0 rgba(68, 73, 67, .07);
    }

    .route-story-card-editorial.route-story-corridor-qingzang.route-story-images-2 .route-editorial-figure-1 {
        width: 78%;
        justify-self: start;
    }

    .route-story-card-editorial.route-story-corridor-qingzang.route-story-images-2 .route-editorial-figure-2 {
        width: 70%;
        justify-self: end;
    }

    .route-story-card-editorial.route-story-corridor-qingzang.route-story-images-2 .route-editorial-figure img {
        object-fit: cover;
        object-position: center;
        background: transparent;
    }

    .route-story-card-editorial.route-story-corridor-qingzang .route-editorial-copy {
        grid-template-rows: auto auto auto minmax(0, auto) auto;
        align-content: start;
    }

    .route-story-card-editorial.route-story-corridor-qingzang .route-editorial-copy h2 {
        max-width: 100%;
        margin: 10px 0 9px;
        color: #173d36;
        font-family: "STKaiti", "KaiTi", "Microsoft YaHei", sans-serif;
        font-size: 28px;
        font-weight: 700;
        line-height: 1.32;
        letter-spacing: 0;
        overflow-wrap: anywhere;
    }

    .route-story-card-editorial.route-story-corridor-qingzang .route-editorial-meta {
        display: none;
    }

    .route-story-card-editorial.route-story-corridor-qingzang .route-editorial-scroll {
        overflow: auto;
        padding-right: 8px;
    }

    .route-story-card-editorial.route-story-corridor-qingzang .route-editorial-scroll p {
        margin: 0 0 12px;
        color: #3e4741;
        font-family: "Microsoft YaHei", "PingFang SC", sans-serif;
        font-size: 13.5px;
        font-weight: 500;
        line-height: 1.8;
        letter-spacing: 0;
        overflow-wrap: anywhere;
        text-align: left;
    }

    .route-story-card-editorial.route-story-corridor-qingzang .route-editorial-scroll p.lead {
        color: #303b34;
        font-size: 14.5px;
        font-weight: 600;
    }

    .route-story-card-editorial.route-story-corridor-qingzang .route-editorial-copy blockquote {
        margin-top: 3px;
        font-family: "STKaiti", "KaiTi", "Microsoft YaHei", sans-serif;
        line-height: 1.6;
    }

    /* Xian evidence page: preserve the portrait city plan and place the wide painting below the copy. */
    .route-story-card-editorial.route-story-corridor-qingzang.route-story-node-xian.route-story-page-evidence .route-editorial-sheet {
        grid-template-columns: minmax(0, 1fr) minmax(390px, 1fr);
        grid-template-rows: minmax(0, 1fr) auto;
        column-gap: 34px;
        row-gap: 24px;
        overflow: hidden;
    }

    .route-story-card-editorial.route-story-corridor-qingzang.route-story-node-xian.route-story-page-evidence .route-editorial-visual {
        display: contents;
    }

    .route-story-card-editorial.route-story-corridor-qingzang.route-story-node-xian.route-story-page-evidence .route-editorial-photo-stack {
        display: contents;
    }

    .route-story-card-editorial.route-story-corridor-qingzang.route-story-node-xian.route-story-page-evidence .route-editorial-copy {
        grid-column: 2;
        grid-row: 1;
        min-height: 0;
    }

    .route-story-card-editorial.route-story-corridor-qingzang.route-story-node-xian.route-story-page-evidence .route-editorial-figure-2 {
        grid-column: 1;
        grid-row: 1 / span 2;
        width: min(86%, 430px);
        height: auto;
        aspect-ratio: .85;
        align-self: center;
        justify-self: center;
        margin: 12px 0;
    }

    .route-story-card-editorial.route-story-corridor-qingzang.route-story-node-xian.route-story-page-evidence .route-editorial-figure-2 img {
        object-fit: contain;
        background: transparent;
    }

    .route-story-card-editorial.route-story-corridor-qingzang.route-story-node-xian.route-story-page-evidence .route-editorial-figure-1 {
        grid-column: 2;
        grid-row: 2;
        width: 94%;
        height: auto;
        aspect-ratio: 2.681;
        align-self: start;
        justify-self: end;
    }

    .route-story-card-editorial.route-story-corridor-qingzang.route-story-node-xian.route-story-page-evidence .route-editorial-figure-1 img {
        object-fit: cover;
        background: transparent;
    }

    .route-story-card-editorial.route-story-corridor-qingzang.route-story-node-xian.route-story-page-evidence > .route-editorial-motif-header {
        z-index: 1;
        width: 360px;
        height: 300px;
        top: auto;
        right: 3%;
        bottom: 320px;
    }

    /* Xian legacy page: use the lower-left space for a fuller reading column. */
    .route-story-card-editorial.route-story-corridor-qingzang.route-story-node-xian.route-story-page-legacy .route-editorial-copy {
        grid-template-rows: auto auto minmax(0, 1fr) auto;
        align-content: stretch;
    }

    .route-story-card-editorial.route-story-corridor-qingzang.route-story-node-xian.route-story-page-legacy .route-editorial-scroll p {
        margin-bottom: 15px;
        line-height: 1.84;
    }

    .route-story-card-editorial.route-story-corridor-qingzang.route-story-node-xian.route-story-page-legacy .route-editorial-figure-2 {
        width: 84%;
    }

    .route-story-card-editorial.route-story-corridor-qingzang.route-story-node-xian.route-story-page-legacy > .route-editorial-motif-header {
        top: auto;
        bottom: 8px;
        left: 4%;
        width: 430px;
        height: 430px;
    }

    /* Tianshui arrival: let the narrative column carry the card's full height. */
    .route-story-card-editorial.route-story-corridor-qingzang.route-story-node-tianshui.route-story-page-arrival .route-editorial-copy-single {
        grid-template-rows: auto auto minmax(0, 1fr) auto;
        align-content: stretch;
    }

    .route-story-card-editorial.route-story-corridor-qingzang.route-story-node-tianshui.route-story-page-arrival .route-editorial-flow p {
        margin-bottom: 18px;
        line-height: 1.88;
    }

    .route-story-card-editorial.route-story-corridor-qingzang.route-story-node-tianshui.route-story-page-arrival .route-editorial-copy-single blockquote {
        margin-top: 12px;
    }

    .route-story-card-editorial.route-story-corridor-qingzang.route-story-node-tianshui.route-story-page-evidence .route-editorial-copy-single {
        grid-template-rows: auto auto minmax(0, 1fr) auto;
        align-content: stretch;
    }

    .route-story-card-editorial.route-story-corridor-qingzang.route-story-node-tianshui.route-story-page-evidence .route-editorial-flow p {
        margin-bottom: 18px;
        line-height: 1.88;
    }

    .route-story-card-editorial.route-story-corridor-qingzang.route-story-node-tianshui.route-story-page-evidence .route-editorial-copy-single blockquote {
        margin-top: 12px;
    }

    .route-story-card-editorial.route-story-corridor-qingzang.route-story-node-tianshui.route-story-page-legacy .route-editorial-copy {
        grid-template-rows: auto auto minmax(0, 1fr) auto;
        align-content: stretch;
    }

    .route-story-card-editorial.route-story-corridor-qingzang.route-story-node-tianshui.route-story-page-legacy .route-editorial-scroll p {
        margin-bottom: 15px;
        line-height: 1.84;
    }

    .route-story-card-editorial.route-story-corridor-qingzang.route-story-node-tianshui.route-story-page-legacy > .route-editorial-motif-header {
        top: auto;
        bottom: 8px;
        left: 4%;
        width: 430px;
        height: 430px;
    }

    .route-story-card-editorial.route-story-corridor-qingzang.route-story-node-tianshui.route-story-page-legacy .route-editorial-photo-stack {
        grid-template-columns: minmax(0, 1fr);
        grid-template-rows: minmax(0, 1fr) minmax(0, 1fr);
        gap: 14px;
    }

    .route-story-card-editorial.route-story-corridor-qingzang.route-story-node-tianshui.route-story-page-legacy .route-editorial-figure-1,
    .route-story-card-editorial.route-story-corridor-qingzang.route-story-node-tianshui.route-story-page-legacy .route-editorial-figure-2 {
        width: 84%;
        height: 100%;
        margin: 0;
        align-self: stretch;
        justify-self: center;
    }

    .route-story-card-editorial.route-story-corridor-qingzang.route-story-node-lintao.route-story-page-arrival .route-editorial-copy-single {
        grid-template-rows: auto auto minmax(0, 1fr) auto;
        align-content: stretch;
    }

    .route-story-card-editorial.route-story-corridor-qingzang.route-story-node-lintao.route-story-page-arrival .route-editorial-flow-visual {
        width: min(50%, 520px);
        margin-right: 38px;
    }

    .route-story-card-editorial.route-story-corridor-qingzang.route-story-node-lintao.route-story-page-arrival .route-editorial-flow p {
        margin-bottom: 16px;
        line-height: 1.88;
    }

    .route-story-card-editorial.route-story-corridor-qingzang.route-story-node-lintao.route-story-page-arrival .route-editorial-copy-single blockquote {
        margin-top: 12px;
    }
}

/* Qingzang evidence plates: keep the reference spread's staggered, full-size image rhythm. */
@media (min-width: 861px) {
    .route-story-card-editorial.route-story-corridor-qingzang.route-story-page-evidence.route-story-node-lintao .route-editorial-photo-stack,
    .route-story-card-editorial.route-story-corridor-qingzang.route-story-page-evidence.route-story-node-yushu .route-editorial-photo-stack,
    .route-story-card-editorial.route-story-corridor-qingzang.route-story-page-evidence.route-story-node-lhasa .route-editorial-photo-stack {
        position: relative;
        display: block;
        width: 100%;
        height: 100%;
    }

    .route-story-card-editorial.route-story-corridor-qingzang.route-story-page-evidence.route-story-node-lintao .route-editorial-figure,
    .route-story-card-editorial.route-story-corridor-qingzang.route-story-page-evidence.route-story-node-yushu .route-editorial-figure,
    .route-story-card-editorial.route-story-corridor-qingzang.route-story-page-evidence.route-story-node-lhasa .route-editorial-figure {
        position: absolute;
        height: auto;
        margin: 0;
        aspect-ratio: var(--story-image-ratio, 1.5);
    }

    .route-story-card-editorial.route-story-corridor-qingzang.route-story-page-evidence.route-story-node-lintao .route-editorial-figure-1,
    .route-story-card-editorial.route-story-corridor-qingzang.route-story-page-evidence.route-story-node-lhasa .route-editorial-figure-1 {
        z-index: 1;
        left: 0;
        bottom: 4%;
        width: 36%;
    }

    .route-story-card-editorial.route-story-corridor-qingzang.route-story-page-evidence.route-story-node-lintao .route-editorial-figure-2,
    .route-story-card-editorial.route-story-corridor-qingzang.route-story-page-evidence.route-story-node-yushu .route-editorial-figure-1,
    .route-story-card-editorial.route-story-corridor-qingzang.route-story-page-evidence.route-story-node-lhasa .route-editorial-figure-2 {
        z-index: 2;
        right: 0;
        top: 7%;
        width: 88%;
    }

    .route-story-card-editorial.route-story-corridor-qingzang.route-story-page-evidence.route-story-node-yushu .route-editorial-figure-2 {
        z-index: 2;
        left: 0;
        bottom: 4%;
        width: 36%;
        box-shadow: 7px -7px 0 rgba(84, 65, 45, .07);
    }

    .route-story-card-editorial.route-story-corridor-qingzang.route-story-page-evidence.route-story-node-lintao .route-editorial-figure-2,
    .route-story-card-editorial.route-story-corridor-qingzang.route-story-page-evidence.route-story-node-lhasa .route-editorial-figure-2 {
        box-shadow: -7px 8px 0 rgba(84, 65, 45, .08);
    }

    .route-story-card-editorial.route-story-corridor-qingzang.route-story-page-evidence.route-story-node-lintao .route-editorial-figure img,
    .route-story-card-editorial.route-story-corridor-qingzang.route-story-page-evidence.route-story-node-yushu .route-editorial-figure img,
    .route-story-card-editorial.route-story-corridor-qingzang.route-story-page-evidence.route-story-node-lhasa .route-editorial-figure img {
        object-fit: cover;
    }
}

/* Evidence captions should breathe with their real text instead of being clipped to two lines. */
.route-story-card-editorial.route-story-corridor-qingzang.route-story-page-evidence.route-story-node-lintao .route-editorial-figure figcaption,
.route-story-card-editorial.route-story-corridor-qingzang.route-story-page-evidence.route-story-node-yushu .route-editorial-figure figcaption,
.route-story-card-editorial.route-story-corridor-qingzang.route-story-page-evidence.route-story-node-lhasa .route-editorial-figure figcaption {
    align-items: start;
    grid-template-columns: 28px minmax(0, 1fr);
}

.route-story-card-editorial.route-story-corridor-qingzang.route-story-page-evidence.route-story-node-lintao .route-editorial-figure figcaption span,
.route-story-card-editorial.route-story-corridor-qingzang.route-story-page-evidence.route-story-node-yushu .route-editorial-figure figcaption span,
.route-story-card-editorial.route-story-corridor-qingzang.route-story-page-evidence.route-story-node-lhasa .route-editorial-figure figcaption span {
    display: block;
    overflow: visible;
    max-height: none;
    -webkit-line-clamp: unset;
    white-space: normal;
    overflow-wrap: anywhere;
}

@media (max-width: 860px) {
    .route-story-card-editorial.route-story-corridor-qingzang.route-story-page-evidence.route-story-node-lintao .route-editorial-photo-stack,
    .route-story-card-editorial.route-story-corridor-qingzang.route-story-page-evidence.route-story-node-yushu .route-editorial-photo-stack,
    .route-story-card-editorial.route-story-corridor-qingzang.route-story-page-evidence.route-story-node-lhasa .route-editorial-photo-stack {
        display: grid;
        grid-template-columns: minmax(0, 1fr);
        grid-template-rows: minmax(0, 1fr) minmax(0, 1fr);
        gap: 14px;
    }

    .route-story-card-editorial.route-story-corridor-qingzang.route-story-page-evidence.route-story-node-lintao .route-editorial-figure,
    .route-story-card-editorial.route-story-corridor-qingzang.route-story-page-evidence.route-story-node-yushu .route-editorial-figure,
    .route-story-card-editorial.route-story-corridor-qingzang.route-story-page-evidence.route-story-node-lhasa .route-editorial-figure {
        position: relative;
        inset: auto;
        width: 100%;
        height: 100%;
    }

    .route-story-card-editorial.route-story-corridor-qingzang.route-story-page-evidence.route-story-node-lintao .route-editorial-figure-1,
    .route-story-card-editorial.route-story-corridor-qingzang.route-story-page-evidence.route-story-node-yushu .route-editorial-figure-2,
    .route-story-card-editorial.route-story-corridor-qingzang.route-story-page-evidence.route-story-node-lhasa .route-editorial-figure-1 {
        width: 76%;
        justify-self: start;
    }

    .route-story-card-editorial.route-story-corridor-qingzang.route-story-page-evidence.route-story-node-lintao .route-editorial-figure-2,
    .route-story-card-editorial.route-story-corridor-qingzang.route-story-page-evidence.route-story-node-yushu .route-editorial-figure-1,
    .route-story-card-editorial.route-story-corridor-qingzang.route-story-page-evidence.route-story-node-lhasa .route-editorial-figure-2 {
        width: 100%;
        justify-self: end;
    }
}

@media (min-width: 901px) {
    .workspace.analysis-workspace {
        grid-template-columns: 320px minmax(0, 1fr) 410px;
        grid-template-rows: minmax(0, 1fr);
    }
    .workspace.analysis-workspace > aside:last-child {
        grid-column: auto;
        min-height: 0;
    }
}

@media (max-width: 900px) {
    .workspace.analysis-workspace {
        width: calc(100vw - 20px);
        max-width: calc(100vw - 20px);
        min-width: 0;
        box-sizing: border-box;
        grid-template-columns: minmax(280px, 88vw) minmax(620px, 150vw) minmax(340px, 92vw);
        grid-template-rows: minmax(0, 1fr);
        height: calc(100dvh - 86px);
        padding: 10px;
        overflow-x: auto;
        overflow-y: hidden;
        scroll-snap-type: x proximity;
    }
    .workspace.analysis-workspace > * { min-height: 0; scroll-snap-align: start; }
    .workspace.analysis-workspace > aside:last-child { grid-column: auto; }
    .workspace.analysis-workspace .analysis-scene-card { min-height: 0; }
}

@media (min-width: 1501px) {
    .workspace.analysis-workspace.slope-analysis-workspace {
        grid-template-columns: 350px minmax(0, 1fr) 410px;
    }
}

@media (min-width: 901px) and (max-width: 1500px) {
    .workspace.analysis-workspace.slope-analysis-workspace {
        grid-template-columns: 335px minmax(0, 1fr) 380px;
    }
}

.viewshed-analysis-workspace.analysis-workspace {
    grid-template-columns: 350px minmax(0, 1fr) 410px;
}

.viewshed-analysis-workspace .analysis-sidebar,
.viewshed-analysis-workspace .analysis-results-panel {
    overflow-y: auto;
}

.viewshed-analysis-workspace .analysis-scene-card {
    height: 100%;
    min-height: 0;
}

.viewshed-analysis-workspace .analysis-methods-panel {
    padding: 14px;
}

.viewshed-analysis-workspace .analysis-card {
    min-height: 112px;
    padding: 11px 12px;
}

.viewshed-analysis-workspace .analysis-card h4 {
    margin-bottom: 5px;
    font-size: 15px;
}

.viewshed-analysis-workspace .analysis-card p {
    font-size: 12px;
    line-height: 1.38;
}

.viewshed-analysis-workspace .analysis-control-block {
    padding: 12px;
}

.viewshed-analysis-workspace .analysis-control-block > label {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 8px;
    margin-bottom: 8px;
    font-size: 14px;
}

.viewshed-analysis-workspace input[type="number"],
.viewshed-analysis-workspace select {
    width: 100%;
    min-height: 40px;
    padding: 8px 10px;
    border: 1px solid rgba(113, 93, 54, .3);
    border-radius: 6px;
    background: rgba(251, 246, 232, .84);
}

@media (max-width: 1500px) and (min-width: 901px) {
    .viewshed-analysis-workspace.analysis-workspace { grid-template-columns: 335px minmax(0, 1fr) 380px; }
}

/* Viewshed analysis follows the management workbench's paper and ink palette. */
.viewshed-analysis-workspace {
    --viewshed-blue: #3f5546;
    --viewshed-ink: #354126;
    --viewshed-muted: #747b62;
    --viewshed-line: rgba(53, 65, 38, .18);
    --viewshed-soft: rgba(247, 240, 222, .58);
    --viewshed-open: #4f8c79;
    --viewshed-blocked: #a86449;
}

.login-error {
    margin: 10px 0;
    padding: 9px 11px;
    border: 1px solid rgba(198, 107, 61, .36);
    border-radius: 4px;
    color: #8d442d;
    background: rgba(198, 107, 61, .1);
    font-size: 13px;
}
.viewshed-analysis-workspace .analysis-control-block {
    border-color: var(--viewshed-line);
    border-radius: 6px;
    background: rgba(251, 246, 232, .72);
}

.viewshed-analysis-workspace .analysis-control-block > label,
.viewshed-analysis-workspace .analysis-control-block output { color: var(--viewshed-ink); }
.viewshed-analysis-workspace .analysis-control-block output { font: 700 11px/1.2 "Helvetica Neue", Arial, sans-serif; }
.viewshed-analysis-workspace input[type="number"],
.viewshed-analysis-workspace select {
    border-color: rgba(113, 93, 54, .3);
    border-radius: 6px;
    color: var(--viewshed-ink);
    background: rgba(255, 252, 243, .84);
}

.viewshed-analysis-workspace .analysis-scope-toggle,
.viewshed-analysis-workspace .analysis-radius-presets { gap: 4px; }
.viewshed-analysis-workspace .analysis-scope-toggle button,
.viewshed-analysis-workspace .analysis-radius-presets button,
.viewshed-map-action {
    min-width: 0;
    min-height: 34px;
    border-color: rgba(113, 93, 54, .3);
    border-radius: 6px;
    color: #4b493b;
    background: rgba(255, 252, 243, .76);
}
.viewshed-analysis-workspace .analysis-scope-toggle button.active,
.viewshed-analysis-workspace .analysis-radius-presets button.active,
.viewshed-map-action.has-value {
    border-color: var(--viewshed-blue);
    color: #fff;
    background: var(--viewshed-blue);
}
.viewshed-map-action {
    width: 100%;
    margin-top: 8px;
    padding: 8px 10px;
    cursor: crosshair;
}
.viewshed-height-presets { grid-template-columns: repeat(5, minmax(0, 1fr)); }
.viewshed-fov-presets { grid-template-columns: repeat(5, minmax(0, 1fr)); }
.viewshed-height-presets button,
.viewshed-fov-presets button { padding-inline: 3px; font-size: 11px; }

.viewshed-result-shell {
    --viewshed-ink: var(--analysis-result-ink);
    --viewshed-muted: var(--analysis-result-muted);
    --viewshed-line: var(--analysis-result-rule);
    --viewshed-blue: var(--analysis-result-ink);
}

.viewshed-result-section {
    border-top: 2px solid rgba(96, 108, 56, .3);
    background: transparent;
}
.viewshed-result-section:first-child { border-top: 0; }
.viewshed-result-section > header {
    display: flex;
    align-items: center;
    gap: 9px;
    padding: 16px 0 12px;
}
.viewshed-result-section > header > span,
.viewshed-ai-panel > header span {
    width: auto;
    height: auto;
    flex: 0 0 auto;
    color: var(--analysis-result-accent);
    background: transparent;
    font-size: 13px;
    font-weight: 900;
    line-height: 1;
}
.viewshed-result-section h5,
.viewshed-ai-panel h5 { margin: 0; color: var(--analysis-result-ink); font-size: 17px; font-weight: 900; }
.viewshed-result-section header p { margin: 3px 0 0; color: var(--analysis-result-muted); font-size: 13px; }
.viewshed-overview-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1px;
    border: 1px solid var(--analysis-result-rule);
    background: var(--analysis-result-rule);
}
.viewshed-overview-grid > div {
    display: grid;
    gap: 6px;
    min-height: 74px;
    padding: 11px 12px;
    background: var(--analysis-result-card);
}
.viewshed-overview-grid span { color: var(--analysis-result-muted); font-size: 13px; font-weight: 700; }
.viewshed-overview-grid strong { color: var(--analysis-result-ink); font-size: 22px; font-weight: 900; line-height: 1.15; }
.viewshed-overview-grid strong small { color: var(--analysis-result-muted); font-size: 12px; font-weight: 600; }

.viewshed-rose-layout {
    display: grid;
    grid-template-columns: minmax(0, 7fr) minmax(104px, 3fr);
    align-items: center;
    gap: 14px;
    width: min(100%, 680px);
    margin-inline: auto;
}
.viewshed-rose-wrap { min-width: 0; }
.viewshed-rose { display: block; width: 100%; height: auto; overflow: visible; }
.viewshed-rose > circle:not(.origin), .viewshed-rose .axis { fill: none; stroke: rgba(83, 91, 64, .24); stroke-width: 1; }
.viewshed-rose text { fill: var(--analysis-result-muted); font-size: 11px; font-weight: 900; text-anchor: middle; }
.viewshed-rose-ray { cursor: pointer; outline: none; }
.viewshed-rose-ray line { stroke: var(--viewshed-blocked); stroke-width: 2.2; stroke-linecap: square; opacity: .72; }
.viewshed-rose-ray.is-open line { stroke: var(--viewshed-open); }
.viewshed-rose-ray:hover line,
.viewshed-rose-ray.is-selected line { stroke: var(--analysis-result-accent); stroke-width: 5; opacity: 1; }
.viewshed-rose-ray .first-blocked { fill: #fff9e9; stroke: var(--viewshed-blocked); stroke-width: 1.4; }
.viewshed-rose .origin { fill: var(--analysis-result-accent); stroke: #f8edcf; stroke-width: 2; }
.viewshed-rose-legend { display: grid; align-content: center; gap: 13px; min-width: 0; color: var(--analysis-result-muted); font-size: 12px; }
.viewshed-rose-legend span { display: flex; align-items: center; gap: 7px; min-height: 22px; }
.viewshed-rose-legend i { width: 18px; height: 3px; flex: 0 0 18px; background: var(--viewshed-open); }
.viewshed-rose-legend i.blocked { background: var(--viewshed-blocked); }
.viewshed-rose-legend i.first { width: 7px; height: 7px; flex-basis: 7px; border: 1px solid var(--viewshed-blocked); border-radius: 50%; background: #fff9e9; }
.viewshed-sector-groups { gap: 16px; }
.viewshed-sector-card { cursor: pointer; }
.viewshed-sector-card.elevation-key-card dl { grid-template-columns: repeat(2, minmax(0, auto)); }
.viewshed-sector-card .elevation-key-levels > span { border-color: rgba(198, 107, 61, .32); color: var(--analysis-result-accent); background: rgba(198, 107, 61, .08); }
.viewshed-resource-panel { margin-top: 0; }
.viewshed-resource-list { overflow: visible; }
.viewshed-resource-pagination { margin-top: 9px; }

.viewshed-ai-panel { margin-top: 16px; background: transparent; }
.viewshed-ai-panel > header { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.viewshed-ai-panel > header > div { display: flex; align-items: center; gap: 9px; }
.viewshed-ai-group article { padding: 10px 0; }
.viewshed-ai-group article b { color: var(--analysis-result-ink); font-size: 14px; line-height: 1.5; }
.viewshed-ai-group article p { margin-top: 5px; }

@media (max-width: 900px) {
    .viewshed-rose-layout { grid-template-columns: 1fr; }
    .viewshed-rose-legend { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

/* Statistics workspace follows the heritage buffer analysis component system. */
.app-shell:has(.statistics-page) { height: 100dvh; min-height: 0; overflow: hidden; }
.app-shell:has(.statistics-page) > .page { height: calc(100dvh - 86px); min-height: 0; overflow: hidden; }

.statistics-page {
    --statistics-page-inset: 18px;
    --statistics-panel-gap: 18px;
    --statistics-filter-width: clamp(390px, 25vw, 430px);
    --statistics-results-width: min(504px, calc(100vw - 36px));
    position: relative;
    isolation: isolate;
    width: 100%;
    height: calc(100dvh - 86px);
    min-height: 680px;
    padding: 0;
    overflow: hidden;
    color: var(--heritage-copy);
    background: #22351f;
    font-family: "Noto Serif SC", "Songti SC", "Source Han Serif SC", serif;
}

.statistics-page button,
.statistics-page select,
.statistics-page input { font-family: inherit; }
.statistics-map-panel,
.statistics-map-canvas { position: absolute; inset: 0; width: 100%; height: 100%; }
.statistics-map-panel { z-index: 0; overflow: hidden; border: 0; border-radius: 0; background: #22351f; }
.statistics-map-canvas .supermap3d-viewer,
.statistics-map-canvas .supermap3d-viewer-cesiumWidgetContainer,
.statistics-map-canvas .supermap3d-widget,
.statistics-map-canvas canvas { width: 100%; height: 100%; }
.statistics-map-canvas { background: #8b9d83; filter: saturate(.92) contrast(1.04); }
.statistics-map-canvas[data-display-mode="2d"] .supermap3d-viewer-navigationContainer { display: none; }
.statistics-map-panel .global-scene-status { z-index: 4; }

.statistics-map-legend {
    position: absolute;
    right: calc(var(--statistics-page-inset) + var(--statistics-results-width) + var(--statistics-panel-gap));
    bottom: var(--statistics-page-inset);
    z-index: 13;
    display: flex;
    align-items: center;
    gap: 15px;
    min-height: 38px;
    padding: 7px 13px;
    border: 1px solid rgba(96, 108, 56, .3);
    border-radius: 5px;
    color: var(--heritage-copy);
    background: #e8dcc7 url("/assets/pages/heritage-atlas/heritage-card-background-horizontal.jpg") center / 100% 100% no-repeat;
    box-shadow: 0 16px 38px rgba(5, 18, 17, .18), inset 0 1px 0 rgba(255, 255, 255, .26);
    pointer-events: none;
}
.statistics-map-legend span { display: inline-flex; align-items: center; gap: 7px; font-size: 11px; font-weight: 800; white-space: nowrap; }
.statistics-map-legend i { position: relative; display: block; flex: 0 0 auto; }
.statistics-map-legend i.heritage,
.statistics-map-legend i.node { width: 9px; height: 9px; border: 2px solid var(--heritage-ink); border-radius: 50%; }
.statistics-map-legend i.heritage { background: #c08e3a; box-shadow: 0 0 0 3px rgba(192, 142, 58, .22); }
.statistics-map-legend i.node { background: #4f8b80; box-shadow: 0 0 0 3px rgba(79, 139, 128, .24); }
.statistics-map-legend i.route { width: 25px; height: 4px; border-radius: 999px; background: #f7d36b; box-shadow: 0 0 0 1px rgba(16, 43, 40, .5); transform: rotate(-7deg); }

.statistics-filter-panel,
.statistics-results-panel,
.statistics-summary-float {
    position: absolute;
    z-index: 12;
    min-height: 0;
    border: 1px solid rgba(212, 184, 149, .78);
    border-radius: 5px;
    color: var(--heritage-copy);
    box-shadow: 0 34px 90px rgba(5, 18, 17, .32);
    backdrop-filter: blur(8px);
    box-sizing: border-box;
}

.statistics-filter-panel {
    top: var(--statistics-page-inset);
    bottom: var(--statistics-page-inset);
    left: var(--statistics-page-inset);
    display: flex;
    width: var(--statistics-filter-width);
    flex-direction: column;
    gap: 12px;
    padding: 60px 24px 20px;
    overflow: hidden;
    background:
        url("/assets/shared/backgrounds/vertical-panel-texture.png") center / 100% 100% no-repeat,
        linear-gradient(180deg, rgba(232, 220, 199, .96), rgba(232, 220, 199, .985));
}

.statistics-analysis-heading {
    position: relative;
    display: flex;
    min-height: 58px;
    align-items: center;
    justify-content: flex-start;
    margin-bottom: 2px;
    padding-bottom: 14px;
    border-bottom: 1px solid rgba(96, 108, 56, .18);
}
.statistics-title-lockup {
    position: absolute;
    left: 50%;
    display: flex;
    width: max-content;
    max-width: calc(100% - 72px);
    align-items: flex-start;
    justify-content: center;
    gap: 9px;
    transform: translateX(-50%);
}
.statistics-title-lockup h3 {
    margin: 0;
    color: var(--heritage-ink);
    font-size: clamp(25px, 2vw, 31px);
    font-weight: 900;
    line-height: 1.05;
    text-align: center;
    white-space: nowrap;
}
.statistics-title-lockup img { width: auto; height: 26px; margin-top: 3px; filter: drop-shadow(0 3px 8px rgba(114, 69, 24, .2)); }
.statistics-reset-circle {
    display: grid;
    width: 34px;
    height: 34px;
    flex: 0 0 34px;
    place-items: center;
    padding: 7px;
    border: 1px solid rgba(176, 139, 110, .38);
    border-radius: 50%;
    color: var(--heritage-muted);
    background: rgba(232, 220, 199, .56);
    cursor: pointer;
}
.statistics-reset-circle:hover { border-color: rgba(198, 107, 61, .62); color: var(--heritage-action); }
.statistics-reset-circle svg { width: 100%; height: 100%; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }

.statistics-filter-block { display: grid; gap: 12px; padding: 0; border: 0; background: transparent; }
.statistics-filter-block + .statistics-filter-block { padding-top: 12px; border-top: 1px solid rgba(96, 108, 56, .18); }
.statistics-filter-panel .heritage-logic-title { margin-bottom: 1px; }
.statistics-filter-panel .heritage-logic-title span { color: var(--heritage-muted); font-size: 17px; font-weight: 900; }
.statistics-segments {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 6px;
    padding: 5px;
    border-radius: 5px;
    background: rgba(139, 157, 131, .14);
}
.statistics-segments button {
    min-width: 0;
    min-height: 40px;
    padding: 5px 8px;
    border: 0;
    border-radius: 5px;
    color: var(--heritage-ink);
    background: transparent;
    font-family: "Noto Serif SC", "Songti SC", "Source Han Serif SC", serif;
    font-size: 15px;
    font-weight: 900;
    line-height: 1.15;
    cursor: pointer;
    transition: color 220ms ease, background 220ms ease, box-shadow 220ms ease;
}
.statistics-segments button.active {
    color: var(--sand);
    background: var(--heritage-ink);
    box-shadow: 0 7px 18px rgba(96, 108, 56, .2);
}
.statistics-admin-grid { position: relative; z-index: 8; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.statistics-admin-grid > label { display: grid; min-width: 0; gap: 8px; }
.statistics-admin-grid > label > span { color: var(--heritage-filter-label-color); font-family: "Epilogue", "Greycliff CF", Arial, sans-serif; font-size: 14px; font-weight: 800; }
.statistics-admin-select { position: relative; min-width: 0; }
.statistics-admin-select-trigger { display: flex; width: 100%; min-height: 47px; align-items: center; justify-content: space-between; gap: 10px; padding: 8px 12px; border: 1px solid rgba(176, 139, 110, .38); border-radius: 8px; color: var(--heritage-copy); background: rgba(232, 220, 199, .66); font-family: "Noto Serif SC", "Songti SC", "Source Han Serif SC", serif; font-size: 16px; font-weight: 700; text-align: left; cursor: pointer; }
.statistics-admin-select-trigger:hover,
.statistics-admin-select.open .statistics-admin-select-trigger { border-color: rgba(17, 62, 58, .58); background: rgba(212, 184, 149, .48); box-shadow: 0 0 0 2px rgba(17, 62, 58, .08); }
.statistics-admin-select-trigger span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.statistics-admin-select-trigger i { width: 9px; height: 9px; flex: 0 0 auto; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: rotate(45deg) translateY(-2px); transition: transform 180ms ease; }
.statistics-admin-select.open .statistics-admin-select-trigger i { transform: rotate(225deg) translate(-2px, -1px); }
.statistics-admin-select.disabled .statistics-admin-select-trigger { color: rgba(76, 86, 45, .48); background: rgba(232, 220, 199, .34); box-shadow: none; cursor: not-allowed; }
.statistics-admin-select-menu { position: absolute; top: calc(100% + 7px); right: 0; left: 0; z-index: 40; max-height: 248px; padding: 6px; overflow: auto; border: 1px solid rgba(176, 139, 110, .48); border-radius: 8px; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence baseFrequency='.72' numOctaves='2'/%3E%3C/filter%3E%3Crect width='120' height='120' filter='url(%23n)' opacity='.035'/%3E%3C/svg%3E"), rgba(232, 220, 199, .985); box-shadow: 0 20px 42px rgba(5, 18, 17, .24); scrollbar-width: thin; }
.statistics-admin-select-menu button { width: 100%; min-height: 36px; padding: 7px 10px; border: 0; border-radius: 6px; color: var(--heritage-copy); background: transparent; font-family: "Noto Serif SC", "Songti SC", "Source Han Serif SC", serif; font-size: 14px; font-weight: 700; text-align: left; cursor: pointer; }
.statistics-admin-select-menu button:hover,
.statistics-admin-select-menu button.active { color: #f1dfb9; background: rgba(24, 78, 70, .96); }

.statistics-draw-scope { display: grid; gap: 7px; }
.statistics-draw-scope > button { display: flex; min-height: 47px; align-items: center; justify-content: center; gap: 9px; border: 1px dashed rgba(176, 139, 110, .62); border-radius: 8px; color: var(--heritage-muted); background: rgba(232, 220, 199, .48); font-size: 15px; font-weight: 900; cursor: crosshair; }
.statistics-draw-scope > button:hover,
.statistics-draw-scope > button.has-value { border-style: solid; border-color: rgba(17, 62, 58, .72); color: var(--sand); background: linear-gradient(180deg, rgba(24, 78, 70, .98), rgba(14, 64, 58, .98)); }
.statistics-draw-scope svg { width: 24px; height: 24px; fill: none; stroke: currentColor; stroke-width: 1.55; stroke-linecap: round; stroke-linejoin: round; }
.statistics-draw-scope p { margin: 0; color: var(--heritage-muted); font-size: 11px; font-weight: 700; text-align: center; }
.statistics-run-button {
    width: 100%;
    min-height: 47px;
    margin-top: 2px;
    border: 1px solid rgba(17, 62, 58, .72);
    border-radius: 8px;
    color: #f1dfb9;
    background: linear-gradient(180deg, rgba(24, 78, 70, .98), rgba(14, 64, 58, .98));
    box-shadow: 0 12px 26px rgba(5, 18, 17, .18);
    font-size: 17px;
    font-weight: 900;
    cursor: pointer;
}
.statistics-run-button:hover:not(:disabled) { transform: translateY(-1px); filter: brightness(1.04); }
.statistics-run-button:disabled { cursor: wait; opacity: .64; }

.statistics-resource-list-block { display: grid; grid-template-rows: auto minmax(0, 1fr); min-height: 0; flex: 1 1 auto; gap: 9px; padding-top: 12px; border-top: 1px solid rgba(96, 108, 56, .2); }
.statistics-resource-tabs.statistics-segments { gap: 6px; padding: 5px; overflow: visible; border: 0; border-radius: 5px; background: rgba(139, 157, 131, .14); }
.statistics-resource-tabs.statistics-segments button { display: flex; min-width: 0; min-height: 40px; align-items: center; justify-content: center; gap: 7px; padding: 5px 8px; border: 0; border-radius: 5px; color: var(--heritage-ink); background: transparent; }
.statistics-resource-tabs button span { font-size: 15px; font-weight: 900; white-space: nowrap; }
.statistics-resource-tabs button b { display: inline-grid; min-width: 22px; height: 22px; place-items: center; padding: 0 5px; border: 1px solid rgba(96, 108, 56, .24); border-radius: 999px; color: var(--heritage-muted); background: rgba(232, 220, 199, .42); font-family: "Epilogue", "Greycliff CF", Arial, sans-serif; font-size: 9px; }
.statistics-resource-tabs.statistics-segments button.active { color: var(--sand); background: var(--heritage-ink); box-shadow: 0 7px 18px rgba(96, 108, 56, .2); }
.statistics-resource-tabs button.active b { border-color: rgba(241, 223, 185, .35); color: #f1dfb9; background: rgba(241, 223, 185, .1); }
.statistics-resource-browser { display: grid; grid-template-rows: minmax(0, 1fr) auto; min-height: 0; padding: 6px; overflow: hidden; border: 1px solid rgba(176, 139, 110, .34); border-radius: 8px; background: rgba(232, 220, 199, .25); box-shadow: inset 0 1px 0 rgba(241, 223, 185, .24); }
.statistics-resource-cards { display: grid; grid-template-rows: repeat(8, minmax(56px, auto)); min-height: 0; gap: 5px; overflow-x: hidden; overflow-y: auto; scrollbar-width: thin; }
.statistics-resource-card { display: grid; grid-template-columns: 82px minmax(0, 1fr); width: 100%; min-height: 56px; align-items: center; gap: 10px; padding: 5px 6px; overflow: hidden; border: 1px solid rgba(176, 139, 110, .3); border-radius: 6px; color: var(--heritage-copy); background: rgba(232, 220, 199, .52); text-align: left; cursor: pointer; transition: border-color 220ms ease, background-color 220ms ease, box-shadow 220ms ease; }
.statistics-resource-card:hover,
.statistics-resource-card.active { border-color: rgba(96, 108, 56, .58); background: rgba(139, 157, 131, .18); box-shadow: 0 3px 10px rgba(67, 71, 42, .08); }
.statistics-resource-card-media { display: block; width: 82px; aspect-ratio: 16 / 9; overflow: hidden; border-radius: 5px; background: rgba(139, 157, 131, .18); }
.statistics-resource-card img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform 420ms ease, filter 180ms ease; }
.statistics-resource-card:hover img { transform: scale(1.035); filter: saturate(.96) contrast(1); }
.statistics-resource-card-copy { display: grid; min-width: 0; align-content: center; gap: 4px; }
.statistics-resource-card strong { overflow: hidden; color: var(--heritage-ink); font-size: 13px; font-weight: 900; text-overflow: ellipsis; white-space: nowrap; }
.statistics-resource-card small { overflow: hidden; color: var(--heritage-muted); font-family: "Noto Serif SC", "Songti SC", "Source Han Serif SC", serif; font-size: 10px; font-weight: 600; letter-spacing: .01em; text-overflow: ellipsis; white-space: nowrap; }
.statistics-list-status { display: grid; min-height: 120px; place-items: center; padding: 18px; color: var(--heritage-muted); font-size: 12px; font-weight: 800; text-align: center; }
.statistics-list-status.error { color: #9b5b3d; }
.statistics-list-pagination { display: flex; min-height: 42px; align-items: center; justify-content: space-between; gap: 10px; margin-top: 6px; padding: 6px 2px 0; border-top: 1px solid rgba(96, 108, 56, .18); color: var(--heritage-muted); font-size: 11px; font-weight: 800; }
.statistics-list-pagination > div { display: flex; align-items: center; gap: 7px; }
.statistics-list-pagination button { display: grid; width: 30px; height: 30px; place-items: center; padding: 7px; border: 1px solid rgba(176, 139, 110, .36); border-radius: 5px; color: var(--heritage-ink); background: rgba(232, 220, 199, .54); cursor: pointer; }
.statistics-list-pagination button:disabled { opacity: .35; cursor: default; }
.statistics-list-pagination svg { width: 100%; height: 100%; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.statistics-list-pagination b { min-width: 48px; color: var(--heritage-ink); font-family: "Epilogue", "Greycliff CF", Arial, sans-serif; font-size: 10px; text-align: center; }

.statistics-results-panel {
    top: var(--statistics-page-inset);
    right: var(--statistics-page-inset);
    bottom: var(--statistics-page-inset);
    left: auto;
    z-index: 20;
    display: flex;
    width: var(--statistics-results-width);
    flex-direction: column;
    gap: 12px;
    padding: 22px 20px;
    overflow: auto;
    background: #e8dcc7 url("/assets/pages/heritage-atlas/heritage-card-background.jpg") center bottom / 100% 100% no-repeat;
    opacity: 0;
    pointer-events: none;
    transform: translateX(calc(100% + 30px));
}
.statistics-results-panel.is-open { opacity: 1; pointer-events: auto; transform: translateX(0); animation: analysis-results-in 360ms cubic-bezier(.16, 1, .3, 1) both; }
.statistics-results-heading { display: flex; min-height: 48px; align-items: center; justify-content: space-between; gap: 12px; padding: 0 0 12px; border-bottom: 1px solid rgba(96, 108, 56, .2); }
.statistics-results-heading h3 { margin: 0; color: var(--heritage-ink); font-size: 30px; font-weight: 900; line-height: 1.1; }
.statistics-results-panel.is-ai-open .statistics-results-heading h3 { font-size: clamp(21px, 1.55vw, 27px); white-space: nowrap; }
.statistics-results-actions { display: flex; align-items: center; gap: 8px; }
.statistics-ai-trigger { display: inline-flex; min-height: 38px; align-items: center; gap: 7px; padding: 0 11px; border: 1px solid rgba(176, 139, 110, .42); border-radius: 7px; color: var(--heritage-action); background: rgba(232, 220, 199, .58); cursor: pointer; }
.statistics-ai-trigger span { display: inline-grid; width: 22px; height: 22px; place-items: center; border-radius: 50%; color: #f5e7ce; background: #b94e43; font: 900 10px/1 "Epilogue", Arial, sans-serif; }
.statistics-ai-trigger small { font-size: 11px; font-weight: 900; }
.statistics-ai-trigger:hover, .statistics-ai-trigger.active { color: #f5e7ce; background: var(--heritage-ink); }
.statistics-ai-panel { display: grid; min-height: 0; flex: 1; grid-template-rows: minmax(0, 1fr) auto; gap: 12px; }
.statistics-ai-messages { display: flex; min-height: 0; flex-direction: column; overflow-y: auto; padding: 4px 2px; scrollbar-width: none; -ms-overflow-style: none; }
.statistics-ai-messages::-webkit-scrollbar { display: none; width: 0; height: 0; }
.statistics-ai-message { display: flex; width: 100%; margin: 0 0 10px; }
.statistics-ai-message.is-user { justify-content: flex-end; }
.statistics-ai-message.is-assistant { justify-content: flex-start; }
.statistics-ai-message.is-thinking { animation: statistics-ai-bubble-in 360ms cubic-bezier(.16, 1, .3, 1) both; }
.statistics-ai-bubble { width: fit-content; max-width: 95%; min-width: 0; padding: 10px 13px; border: 1px solid rgba(104, 83, 55, .3); border-radius: 0 10px 10px 10px; color: #253e35; background: rgba(255, 250, 237, .72); font-size: 14px; line-height: 1.6; box-shadow: 0 2px 8px rgba(73, 65, 42, .06); }
.statistics-ai-bubble p { margin: 0; }
.statistics-ai-markdown h4,
.statistics-ai-markdown h5,
.statistics-ai-markdown h6 { color: #1d493b; font-weight: 900; }
.statistics-ai-markdown h4 { margin: 0 0 8px; padding-left: 10px; border-left: 3px solid rgba(198, 107, 61, .78); font-size: 18px; line-height: 1.4; }
.statistics-ai-markdown h5 { margin: 13px 0 7px; padding-left: 9px; border-left: 3px solid rgba(176, 139, 110, .68); font-size: 16px; line-height: 1.45; }
.statistics-ai-markdown h6 { margin: 9px 0 5px; font-size: 14px; line-height: 1.5; }
.statistics-ai-markdown p { margin: 0 0 9px; text-indent: 0; }
.statistics-ai-markdown strong { color: #943d34; font-weight: 900; }
.statistics-ai-markdown em { color: #365f4c; font-style: normal; font-weight: 800; }
.statistics-ai-markdown ol { margin: 6px 0 9px; padding-left: 24px; }
.statistics-ai-markdown li { margin: 3px 0; padding-left: 3px; }
.statistics-ai-markdown li::marker { color: #b94e43; font-weight: 900; }
.statistics-ai-markdown > :last-child { margin-bottom: 0; }
.statistics-ai-thinking { display: inline-flex; min-height: 24px; align-items: center; gap: 9px; color: var(--heritage-muted); font-size: 12px; font-weight: 800; }
.statistics-ai-thinking > i { width: 18px; height: 18px; flex: 0 0 auto; border: 2px solid rgba(96, 108, 56, .22); border-top-color: #b94e43; border-radius: 50%; animation: statistics-ai-thinking-spin 720ms linear infinite; }
.statistics-ai-typing-output.is-active::after { display: inline-block; width: 2px; height: 1em; margin-left: 3px; vertical-align: -.12em; background: #b94e43; animation: statistics-ai-caret 620ms steps(1, end) infinite; content: ""; }
.statistics-ai-typing-output.is-active .ai-typing-pending { display: none !important; }
.statistics-ai-message.is-user .statistics-ai-bubble { max-width: 95%; border-radius: 10px 0 10px 10px; background: rgba(185, 78, 67, .1); }
.statistics-ai-references { display: flex; flex-wrap: wrap; gap: 6px 9px; margin-top: 10px; padding-top: 9px; border-top: 1px solid rgba(104, 83, 55, .18); color: #6b5540; font-size: 12px; font-weight: 800; line-height: 1.5; }
.statistics-ai-references b { flex-basis: 100%; color: #7c493b; font-size: 11px; }
.statistics-ai-references a { color: #9b443a; text-decoration: underline; text-underline-offset: 3px; }
.statistics-ai-empty { display: grid; width: 100%; max-width: 440px; align-content: center; gap: 14px; margin: auto; padding: 18px 8px; color: var(--heritage-muted); text-align: left; }
.statistics-ai-empty > strong { color: var(--heritage-ink); font-size: 17px; }
.statistics-ai-suggestions { display: grid; gap: 9px; }
.statistics-ai-suggestions button { width: 100%; padding: 12px 14px; border: 1px solid rgba(176, 139, 110, .32); border-radius: 8px; color: #435543; background: rgba(232, 220, 199, .32); font-family: "Noto Serif SC", "Songti SC", "Source Han Serif SC", serif; font-size: 13px; font-weight: 700; line-height: 1.65; text-align: left; cursor: pointer; transition: border-color 220ms ease, background-color 220ms ease, transform 220ms ease; }
.statistics-ai-suggestions button:hover { border-color: rgba(96, 108, 56, .48); background: rgba(139, 157, 131, .15); transform: translateY(-1px); }
.statistics-ai-error { padding: 9px 10px; border-left: 3px solid #b94e43; color: #8e3d35; background: rgba(185, 78, 67, .1); font-size: 11px; font-weight: 800; }
.statistics-ai-form { position: relative; display: block; padding-top: 10px; border-top: 1px solid rgba(96, 108, 56, .2); }
.statistics-ai-form textarea { display: block; width: 100%; min-height: 56px; max-height: 160px; resize: none; overflow-y: hidden; padding: 13px 56px 13px 14px; border: 1px solid rgba(104, 83, 55, .42); border-radius: 10px; color: #253e35; background: rgba(255, 251, 241, .82); font: 15px/1.65 inherit; outline: none; }
.statistics-ai-form textarea:focus { border-color: #b94e43; box-shadow: 0 0 0 2px rgba(185, 78, 67, .12); }
.statistics-ai-form button { position: absolute; right: 10px; bottom: 10px; display: grid; width: 36px; height: 36px; min-height: 0; place-items: center; padding: 0; border: 0; border-radius: 50%; color: #f8ead0; background: var(--heritage-ink); cursor: pointer; transition: background-color 180ms ease, transform 180ms ease; }
.statistics-ai-form button:hover:not(:disabled) { background: #2d5947; transform: translateY(-1px); }
.statistics-ai-form button svg { width: 19px; height: 19px; fill: none; stroke: currentColor; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.statistics-ai-form button:disabled { opacity: .55; cursor: wait; }
@keyframes statistics-ai-bubble-in { from { opacity: 0; transform: translateY(8px) scale(.985); } to { opacity: 1; transform: translateY(0) scale(1); } }
@keyframes statistics-ai-thinking-spin { to { transform: rotate(360deg); } }
@keyframes statistics-ai-caret { 0%, 48% { opacity: 1; } 49%, 100% { opacity: 0; } }
@media (prefers-reduced-motion: reduce) {
    .statistics-ai-message.is-thinking,
    .statistics-ai-thinking > i,
    .statistics-ai-typing-output.is-active::after { animation: none; }
}
.statistics-results-panel.is-ai-open { overflow: hidden; }
.statistics-export-popover { position: relative; font-family: "Epilogue", "Greycliff CF", Arial, sans-serif; }
.statistics-export-popover > summary { min-width: 72px; padding: 9px 12px; border: 1px solid rgba(176, 139, 110, .38); border-radius: 8px; color: var(--heritage-muted); background: rgba(232, 220, 199, .56); font-size: 12px; font-weight: 800; text-align: center; cursor: pointer; list-style: none; }
.statistics-export-popover > summary::-webkit-details-marker { display: none; }
.statistics-export-menu { position: absolute; top: calc(100% + 7px); right: 0; z-index: 3; display: grid; width: 150px; padding: 6px; border: 1px solid rgba(176, 139, 110, .4); border-radius: 5px; background: #e8dcc7; box-shadow: 0 14px 30px rgba(5, 18, 17, .22); }
.statistics-export-menu button { min-height: 34px; padding: 6px 9px; border: 0; border-radius: 4px; color: var(--heritage-copy); background: transparent; font-size: 12px; font-weight: 800; text-align: left; cursor: pointer; }
.statistics-export-menu button:hover { color: var(--sand); background: var(--heritage-action); }

.statistics-result-shell { display: grid; gap: 12px; min-height: 0; }
.statistics-chart-overview { display: grid; grid-template-columns: 142px minmax(0, 1fr); align-items: center; gap: 18px; padding: 14px 12px; border: 1px solid rgba(176, 139, 110, .3); border-radius: 6px; background: rgba(232, 220, 199, .38); }
.statistics-donut { position: relative; display: grid; width: 132px; height: 132px; place-items: center; border-radius: 50%; box-shadow: inset 0 0 0 1px rgba(96, 108, 56, .12); }
.statistics-donut::after { position: absolute; inset: 25px; border-radius: 50%; background: #e8dcc7; box-shadow: 0 0 0 1px rgba(176, 139, 110, .18); content: ""; }
.statistics-donut > span { position: relative; z-index: 1; display: grid; place-items: center; }
.statistics-donut strong { color: var(--heritage-ink); font-family: "Epilogue", "Greycliff CF", Arial, sans-serif; font-size: 24px; line-height: 1; }
.statistics-donut small { margin-top: 5px; color: var(--heritage-muted); font-size: 10px; font-weight: 800; }
.statistics-donut-legend { display: grid; gap: 11px; }
.statistics-donut-legend > div { display: grid; grid-template-columns: 10px minmax(0, 1fr) auto; align-items: center; gap: 2px 8px; padding-bottom: 7px; border-bottom: 1px solid rgba(176, 139, 110, .2); }
.statistics-donut-legend i { width: 9px; height: 9px; border-radius: 50%; }
.statistics-donut-legend span { color: var(--heritage-muted); font-size: 12px; font-weight: 800; }
.statistics-donut-legend strong { color: var(--heritage-ink); font-family: "Epilogue", "Greycliff CF", Arial, sans-serif; font-size: 15px; }
.statistics-donut-legend > div > small { grid-column: 2 / 4; color: var(--heritage-action); font-family: "Epilogue", "Greycliff CF", Arial, sans-serif; font-size: 9px; font-weight: 800; }
.statistics-result-tabs { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border: 1px solid rgba(176, 139, 110, .34); border-radius: 5px; background: rgba(212, 184, 149, .18); }
.statistics-result-tabs button { min-width: 0; min-height: 48px; padding: 8px 5px; border: 0; border-right: 1px solid rgba(176, 139, 110, .3); color: var(--heritage-muted); background: transparent; font-size: 16px; font-weight: 900; cursor: pointer; }
.statistics-result-tabs button:last-child { border-right: 0; }
.statistics-result-tabs button span { display: inline-grid; width: 25px; height: 25px; margin-right: 6px; place-items: center; border: 2px solid currentColor; border-radius: 50%; font-family: "Epilogue", "Greycliff CF", Arial, sans-serif; font-size: 14px; }
.statistics-result-tabs button.active { color: var(--sand); background: var(--heritage-ink); }
.statistics-insight-strip { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); overflow: hidden; border: 1px solid rgba(176, 139, 110, .3); border-radius: 6px; background: rgba(232, 220, 199, .34); }
.statistics-insight-strip > div { display: grid; min-width: 0; gap: 4px; padding: 10px; border-right: 1px solid rgba(176, 139, 110, .24); }
.statistics-insight-strip > div:last-child { border-right: 0; }
.statistics-insight-strip span { color: var(--heritage-muted); font-family: "Epilogue", "Greycliff CF", Arial, sans-serif; font-size: 9px; font-weight: 800; }
.statistics-insight-strip strong { overflow: hidden; color: var(--heritage-ink); font-size: 13px; font-weight: 900; text-overflow: ellipsis; white-space: nowrap; }
.statistics-insight-strip small { color: var(--heritage-action); font-family: "Epilogue", "Greycliff CF", Arial, sans-serif; font-size: 9px; font-weight: 800; }
.statistics-result-section { padding: 13px 0; border-bottom: 1px solid rgba(96, 108, 56, .2); }
.statistics-result-section > header { display: flex; align-items: baseline; gap: 9px; margin-bottom: 11px; }
.statistics-result-section > header span { color: var(--heritage-action); font-family: "Epilogue", "Greycliff CF", Arial, sans-serif; font-size: 11px; font-weight: 900; }
.statistics-result-section > header h4 { margin: 0; color: var(--heritage-ink); font-size: 17px; font-weight: 900; }
.statistics-result-section > header small { margin-left: auto; color: var(--heritage-muted); font-size: 11px; font-weight: 800; }
.statistics-period-columns { display: grid; grid-template-columns: repeat(var(--statistics-period-count), minmax(0, 1fr)); min-height: 178px; gap: 8px; padding: 12px 10px 10px; border: 1px solid rgba(176, 139, 110, .26); border-radius: 6px; background: rgba(232, 220, 199, .32); }
.statistics-period-columns > div { display: grid; min-width: 0; grid-template-rows: 24px 1fr 25px; justify-items: center; gap: 5px; }
.statistics-period-columns strong { color: var(--heritage-ink); font-family: "Epilogue", "Greycliff CF", Arial, sans-serif; font-size: 10px; font-weight: 900; white-space: nowrap; }
.statistics-period-columns i { position: relative; display: flex; width: min(28px, 70%); height: 100%; min-height: 92px; align-items: flex-end; overflow: hidden; border-radius: 5px 5px 2px 2px; background: rgba(139, 157, 131, .15); }
.statistics-period-columns i b { display: block; width: 100%; border-radius: inherit; background: linear-gradient(180deg, #c08e3a, #606c38); }
.statistics-period-columns span { align-self: center; overflow: hidden; color: var(--heritage-copy); font-size: 10px; font-weight: 800; text-overflow: ellipsis; white-space: nowrap; }
.statistics-donut-breakdown { display: grid; grid-template-columns: 148px minmax(0, 1fr); align-items: center; gap: 14px; min-height: 160px; padding: 10px; border: 1px solid rgba(176, 139, 110, .26); border-radius: 6px; background: rgba(232, 220, 199, .32); }
.statistics-donut-visual { display: grid; min-height: 140px; place-items: center; }
.statistics-donut-visual .buffer-interactive-donut { width: 138px; }
.statistics-donut-visual .buffer-donut-label { font-size: 11px; }
.statistics-donut-rows { display: grid; min-width: 0; gap: 3px; }
.statistics-donut-rows button { display: grid; grid-template-columns: 9px minmax(0, 1fr) auto; min-width: 0; min-height: 27px; align-items: center; gap: 7px; padding: 4px 2px; border: 0; border-bottom: 1px solid rgba(176, 139, 110, .18); color: var(--heritage-copy); background: transparent; text-align: left; cursor: pointer; }
.statistics-donut-rows button:last-child { border-bottom: 0; }
.statistics-donut-rows button:hover,
.statistics-donut-rows button.active { background: rgba(139, 157, 131, .12); }
.statistics-donut-rows i { width: 8px; height: 8px; border-radius: 50%; }
.statistics-donut-rows span { overflow: hidden; font-size: 11px; font-weight: 800; text-overflow: ellipsis; white-space: nowrap; }
.statistics-donut-rows strong { color: var(--heritage-ink); font-family: "Epilogue", "Greycliff CF", Arial, sans-serif; font-size: 11px; }
.statistics-donut-rows small { margin-left: 2px; color: var(--heritage-muted); font-size: 8px; }
.statistics-composition-list { display: grid; gap: 9px; }
.statistics-composition-list > div { display: grid; grid-template-columns: minmax(110px, .9fr) minmax(90px, 1.2fr) 40px; align-items: center; gap: 8px; }
.statistics-composition-list span { overflow: hidden; color: var(--heritage-copy); font-size: 13px; font-weight: 800; text-overflow: ellipsis; white-space: nowrap; }
.statistics-composition-list i { height: 9px; overflow: hidden; border-radius: 2px; background: rgba(139, 157, 131, .2); }
.statistics-composition-list i b { display: block; height: 100%; background: var(--heritage-action); }
.statistics-composition-list em { color: var(--heritage-ink); font-family: "Epilogue", "Greycliff CF", Arial, sans-serif; font-size: 12px; font-style: normal; font-weight: 900; text-align: right; white-space: nowrap; }
.statistics-composition-list em small { margin-left: 2px; color: var(--heritage-muted); font-size: 9px; font-weight: 800; }
.statistics-composition-list.compact { gap: 7px; }
.statistics-composition-list.compact > div { grid-template-columns: minmax(92px, .72fr) minmax(96px, 1.38fr) minmax(84px, auto); }
.statistics-cross-frame { padding: 11px; border: 1px solid rgba(176, 139, 110, .26); border-radius: 6px; background: rgba(232, 220, 199, .32); }
.statistics-cross-matrix { display: grid; width: min(100%, var(--statistics-cross-width)); grid-template-columns: 92px repeat(var(--statistics-cross-columns), minmax(48px, 1fr)); align-items: stretch; justify-content: center; gap: 4px; margin-inline: auto; }
.statistics-cross-matrix > b,
.statistics-cross-corner { display: grid; min-width: 0; min-height: 27px; place-items: center; color: var(--heritage-muted); font-size: 9px; font-weight: 900; text-align: center; }
.statistics-cross-matrix > strong { display: grid; align-self: stretch; overflow: hidden; place-items: center; padding: 0 4px; color: var(--heritage-copy); font-size: 10px; font-weight: 800; text-align: center; text-overflow: ellipsis; white-space: nowrap; }
.statistics-cross-cell { display: grid; min-width: 0; min-height: 31px; place-items: center; border: 1px solid rgba(176, 139, 110, .12); border-radius: 3px; color: var(--heritage-ink); font-family: "Epilogue", "Greycliff CF", Arial, sans-serif; font-size: 9px; font-weight: 900; }
.statistics-cross-legend { display: flex; flex-wrap: wrap; gap: 10px 16px; margin-top: 10px; color: var(--heritage-muted); font-size: 10px; font-weight: 800; }
.statistics-cross-legend span { display: inline-flex; align-items: center; gap: 5px; }
.statistics-cross-legend i { display: inline-block; width: 28px; height: 9px; border: 1px solid rgba(176, 139, 110, .3); border-radius: 2px; background: linear-gradient(90deg, rgba(139,157,131,.08), rgba(198,107,61,.84)); }
.statistics-cross-legend span:first-child i { background: rgba(139,157,131,.08); }
.statistics-cross-legend span:nth-child(2) i { background: rgba(198,107,61,.3); }
.statistics-cross-legend span:nth-child(3) i { background: rgba(198,107,61,.84); }
.statistics-result-empty { margin: 0; padding: 12px; color: var(--heritage-muted); background: rgba(232, 220, 199, .35); font-size: 12px; font-weight: 800; text-align: center; }
.statistics-quality-body { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: center; gap: 16px; padding: 14px 12px; border: 1px solid rgba(176, 139, 110, .26); border-radius: 6px; background: rgba(232, 220, 199, .32); }
.statistics-quality-ring { position: relative; display: grid; width: 144px; height: 144px; margin: 0 auto; place-items: center; border-radius: 50%; background: conic-gradient(#606c38 0deg var(--quality-angle), rgba(139, 157, 131, .18) var(--quality-angle) 360deg); box-shadow: 0 10px 25px rgba(96, 108, 56, .12); }
.statistics-quality-ring::after { position: absolute; inset: 19px; border-radius: 50%; background: #e8dcc7; content: ""; }
.statistics-quality-ring > span { position: relative; z-index: 1; display: grid; place-items: center; }
.statistics-quality-ring strong { color: var(--heritage-ink); font-family: "Epilogue", "Greycliff CF", Arial, sans-serif; font-size: 18px; }
.statistics-quality-ring small { margin-top: 3px; color: var(--heritage-muted); font-size: 9px; font-weight: 800; }
.statistics-quality-fields { display: grid; min-width: 0; grid-template-columns: minmax(0, 1fr); align-content: center; gap: 5px; }
.statistics-quality-fields > div { display: grid; grid-template-columns: 52px minmax(30px, 1fr) 38px; align-items: center; gap: 6px; min-height: 28px; }
.statistics-quality-fields > div:last-child { grid-column: auto; width: auto; justify-self: stretch; }
.statistics-quality-fields span { color: var(--heritage-muted); font-size: 10px; font-weight: 800; white-space: nowrap; }
.statistics-quality-fields i { height: 7px; overflow: hidden; border-radius: 999px; background: rgba(139, 157, 131, .2); }
.statistics-quality-fields i b { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, #8b9d83, #606c38); }
.statistics-quality-fields strong { color: var(--heritage-ink); font-family: "Epilogue", "Greycliff CF", Arial, sans-serif; font-size: 9px; text-align: right; }
.statistics-summary-float {
    top: var(--statistics-page-inset);
    right: calc(var(--statistics-page-inset) + var(--statistics-results-width) + var(--statistics-panel-gap));
    left: calc(var(--statistics-page-inset) + var(--statistics-filter-width) + var(--statistics-panel-gap));
    padding: 8px 12px;
    overflow: hidden;
    border-color: rgba(96, 108, 56, .3);
    border-radius: 5px;
    background: #e8dcc7 url("/assets/pages/heritage-atlas/heritage-card-background-horizontal.jpg") center / 100% 100% no-repeat;
    box-shadow: 0 16px 38px rgba(5, 18, 17, .18), inset 0 1px 0 rgba(255, 255, 255, .26);
}
.statistics-metrics { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); overflow: hidden; }
.statistics-metric {
    --statistics-metric-accent: var(--heritage-ink);
    position: relative;
    display: flex;
    min-width: 0;
    min-height: 84px;
    align-content: center;
    align-items: baseline;
    justify-content: center;
    flex-wrap: wrap;
    gap: 4px 5px;
    padding: 9px 8px 8px;
    background: transparent;
    text-align: center;
}
.statistics-metric:nth-child(2) { --statistics-metric-accent: #a85f3a; }
.statistics-metric:nth-child(3) { --statistics-metric-accent: #af7a24; }
.statistics-metric:nth-child(4) { --statistics-metric-accent: #8c583b; }
.statistics-metric:nth-child(5) { --statistics-metric-accent: #657545; }
.statistics-metric:nth-child(6) { --statistics-metric-accent: #184e46; }
.statistics-metric + .statistics-metric { border-left: 1px solid rgba(176, 139, 110, .26); }
.statistics-metric span {
    flex-basis: 100%;
    color: var(--heritage-copy);
    font-family: "Noto Serif SC", "Songti SC", "Source Han Serif SC", serif;
    font-size: clamp(16px, .92vw, 19px);
    font-weight: 800;
    letter-spacing: .02em;
    white-space: nowrap;
}
.statistics-metric b {
    color: var(--statistics-metric-accent);
    font-family: "Noto Serif SC", "Songti SC", "Source Han Serif SC", serif;
    font-size: clamp(34px, 2vw, 43px);
    font-weight: 1000;
    letter-spacing: -.035em;
    line-height: .96;
    text-shadow: 0 1px 0 rgba(232, 220, 199, .65);
    -webkit-text-stroke: .28px currentColor;
}
.statistics-metric small { color: var(--statistics-metric-accent); font-size: 15px; font-weight: 950; }

.statistics-error-float {
    position: absolute;
    top: 132px;
    right: calc(var(--statistics-page-inset) + var(--statistics-results-width) + var(--statistics-panel-gap));
    left: calc(var(--statistics-page-inset) + var(--statistics-filter-width) + var(--statistics-panel-gap));
    z-index: 8;
    padding: 10px 12px;
    border-left: 3px solid #c66b3d;
    color: #7b432e;
    background: #d4b895;
    font-size: 12px;
}
.statistics-empty { display: grid; min-height: 260px; place-items: center; padding: 20px; color: var(--heritage-muted); font-size: 14px; font-weight: 800; text-align: center; }
.statistics-empty.compact { min-height: 100px; }

@media (max-width: 1500px) and (min-width: 901px) {
    .statistics-page {
        --statistics-page-inset: 12px;
        --statistics-panel-gap: 12px;
        --statistics-filter-width: 360px;
        --statistics-results-width: 420px;
    }
    .statistics-filter-panel { padding-right: 18px; padding-left: 18px; }
    .statistics-summary-float .statistics-metric:nth-child(4),
    .statistics-summary-float .statistics-metric:nth-child(5) { display: none; }
    .statistics-metrics { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

/* Elevation and slope results use the same paper hierarchy as buffer analysis. */
.elevation-draw-block .analysis-scope-toggle button { min-width: 0; }

.elevation-output-section { padding: 16px 0; border-bottom: 2px solid rgba(96, 108, 56, .3); }
.elevation-section-heading { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; margin-bottom: 11px; }
.elevation-section-heading > div { display: flex; align-items: baseline; gap: 9px; min-width: 0; }
.elevation-section-heading > div > span { color: var(--analysis-result-accent); font-size: 13px; font-weight: 900; }
.elevation-section-heading h5 { margin: 0; color: var(--analysis-result-ink); font-size: 17px; font-weight: 900; letter-spacing: 0; }
.elevation-stat-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1px; border: 1px solid var(--analysis-result-rule); background: var(--analysis-result-rule); }
.elevation-band-breakdown .buffer-breakdown-chart > div {
    grid-template-columns: minmax(74px, 90px) 64px 44px;
    justify-content: start;
}
.elevation-band-breakdown .buffer-breakdown-chart > div > em { width: 64px; }
.elevation-band-breakdown .buffer-breakdown-chart strong { justify-self: end; }
.elevation-chart-panel { width: auto; height: auto; margin: 0; padding: 8px 4px 2px; border: 1px solid var(--analysis-result-border); border-radius: 6px; background: var(--analysis-result-card); }
.elevation-chart { display: block; width: 100%; height: auto; min-height: 180px; cursor: crosshair; touch-action: none; }
.elevation-chart-legend { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0; width: 100%; margin: 9px 0 0; color: var(--analysis-result-muted); font-size: 11px; font-weight: 800; }
.elevation-chart-legend span { display: inline-flex; width: 100%; min-width: 0; align-items: center; justify-content: center; gap: 5px; white-space: nowrap; }
.elevation-chart-legend i { width: 14px; height: 7px; border: 1px solid currentColor; border-radius: 2px; }
.elevation-chart-legend .key-high-altitude { color: #606c38; }
.elevation-chart-legend .key-high-altitude i { background: rgba(96, 108, 56, .22); }
.elevation-chart-legend .key-ascent { color: #c66b3d; }
.elevation-chart-legend .key-ascent i { background: rgba(198, 107, 61, .24); }
.elevation-chart-legend .key-descent { color: #4f7f78; }
.elevation-chart-legend .key-descent i { background: rgba(79, 127, 120, .24); }
.elevation-chart-legend .key-anomaly { color: #9b5b3d; }
.elevation-chart-legend .key-anomaly i { background: repeating-linear-gradient(135deg, rgba(155, 91, 61, .3) 0 2px, transparent 2px 4px); }
.elevation-chart-grid line { stroke: rgba(96, 108, 56, .16); }
.elevation-chart-grid text,
.elevation-chart-axis text { fill: var(--analysis-result-muted); font: 11px "Noto Serif SC", "Songti SC", serif; letter-spacing: 0; }
.elevation-chart-line { fill: none; stroke: var(--analysis-result-ink); stroke-width: 2.5; stroke-linecap: round; stroke-linejoin: round; }
.elevation-selected-line { opacity: 0; stroke: var(--analysis-result-accent); stroke-width: 1.25; stroke-dasharray: 4 4; pointer-events: none; transition: opacity 140ms ease; }
.elevation-selected-line.is-visible { opacity: .9; }
.elevation-chart-point { opacity: 0; fill: var(--analysis-result-accent); stroke: #f3e8d2; stroke-width: 2; pointer-events: none; transition: opacity 140ms ease; }
.elevation-chart-point.is-visible { opacity: 1; }
.elevation-hover-readout { opacity: 0; pointer-events: none; transition: opacity 140ms ease; }
.elevation-hover-readout.is-visible { opacity: 1; }
.elevation-hover-readout rect { fill: rgba(22, 61, 38, .94); stroke: rgba(232, 220, 199, .72); stroke-width: 1; }
.elevation-hover-readout text { fill: #e8dcc7; font: 800 10px "Noto Serif SC", "Songti SC", serif; }
.elevation-key-range { fill: #606c38; fill-opacity: .08; stroke: #606c38; stroke-width: 1.25; stroke-opacity: .48; vector-effect: non-scaling-stroke; cursor: pointer; transition: fill-opacity 160ms ease, stroke-opacity 160ms ease, stroke-width 160ms ease; }
.elevation-key-range.key-high-altitude { fill: #606c38; stroke: #606c38; }
.elevation-key-range.key-ascent { fill: #c66b3d; stroke: #c66b3d; fill-opacity: .11; }
.elevation-key-range.key-descent { fill: #4f7f78; stroke: #4f7f78; fill-opacity: .11; }
.elevation-key-range.key-anomaly { fill: #9b5b3d; stroke: #9b5b3d; fill-opacity: .13; stroke-dasharray: 4 3; }
.elevation-key-range:hover,
.elevation-key-range.active { fill-opacity: .23; stroke-opacity: 1; stroke-width: 2; }
.elevation-key-list { display: grid; gap: 14px; }
.elevation-key-group { display: grid; gap: 8px; }
.elevation-key-group-title { display: flex; align-items: center; justify-content: space-between; padding-bottom: 7px; border-bottom: 1px solid var(--analysis-result-rule); }
.elevation-key-group-title b { color: var(--analysis-result-ink); font-size: 14px; }
.elevation-key-group-title span { display: grid; width: 24px; height: 24px; place-items: center; color: #f7edda; background: var(--analysis-result-ink); border-radius: 50%; font-size: 11px; }
.elevation-key-card { display: grid; gap: 9px; width: 100%; min-width: 0; padding: 11px 12px; border: 1px solid var(--analysis-result-border); border-radius: 6px; color: var(--analysis-result-copy); background: var(--analysis-result-card); text-align: left; }
.elevation-key-card:hover,
.elevation-key-card.active { border-color: rgba(198, 107, 61, .7); background: rgba(198, 107, 61, .08); box-shadow: none; }
.elevation-key-card-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-width: 0; }
.elevation-key-card-heading > strong { min-width: 0; color: var(--analysis-result-ink); font-size: 15px; line-height: 1.35; letter-spacing: 0; }
.elevation-key-kind { color: var(--analysis-result-accent); font-size: 12px; font-weight: 900; }
.elevation-key-levels { display: flex; flex: 0 0 auto; flex-wrap: nowrap; justify-content: flex-end; gap: 5px; }
.elevation-key-levels > span { padding: 3px 7px; border: 1px solid rgba(96, 108, 56, .3); border-radius: 999px; color: var(--analysis-result-ink); background: rgba(139, 157, 131, .14); font-size: 11px; font-weight: 800; line-height: 1.2; white-space: nowrap; }
.elevation-key-card dl { display: grid; grid-template-columns: repeat(4, minmax(0, auto)); align-items: baseline; justify-content: space-between; gap: 7px 12px; margin: 0; padding-top: 8px; border-top: 1px solid var(--analysis-result-rule); font-size: 12px; }
.elevation-key-card dl > div { display: flex; align-items: baseline; gap: 5px; min-width: 0; white-space: nowrap; }
.elevation-key-card dt { color: var(--analysis-result-muted); }
.elevation-key-card dd { margin: 0; color: var(--analysis-result-ink); font-weight: 800; }
.elevation-key-card small,
.elevation-key-empty { margin: 0; color: var(--analysis-result-muted); font-size: 13px; line-height: 1.6; overflow-wrap: anywhere; }
.elevation-key-empty { padding: 8px 0; }
.elevation-ai-section { border-bottom: 0; }
.elevation-ai-content { display: grid; gap: 0; }
.elevation-ai-block { display: grid; gap: 8px; }
.elevation-ai-block article { display: grid; grid-template-columns: 28px minmax(0, 1fr); gap: 10px; padding: 11px 0; }
.elevation-ai-block article > span { display: grid; width: 26px; height: 26px; place-items: center; border: 1px solid rgba(96, 108, 56, .34); border-radius: 50%; color: var(--analysis-result-accent); background: transparent; font-size: 11px; font-weight: 900; }
.elevation-ai-block article b { display: block; color: var(--analysis-result-ink); font-size: 14px; line-height: 1.5; }
.elevation-ai-block article p { margin: 4px 0; }
.elevation-ai-block article small { display: block; color: var(--analysis-result-muted); }
.elevation-ai-unavailable { padding: 12px; border: 1px solid var(--analysis-result-border); border-radius: 6px; background: var(--analysis-result-card); }

/* Slope trend analysis reuses the elevation result hierarchy. */
.analysis-fullscreen.slope-analysis-workspace .analysis-results-content { overflow-x: hidden; overscroll-behavior-x: none; touch-action: pan-y; }
.slope-result-shell { width: 100%; max-width: 100%; min-width: 0; overflow-x: hidden; }
.slope-result-shell > * { max-width: 100%; min-width: 0; }
.slope-draw-actions { grid-template-columns: 1.25fr 1fr .72fr; }
.slope-distribution-breakdown { margin-top: 12px; }
.slope-distribution-breakdown .buffer-breakdown-layout { padding-bottom: 3px; }
.slope-distribution-breakdown .buffer-breakdown-chart > div {
    grid-template-columns: 106px 54px 44px;
    justify-content: start;
}
.slope-distribution-breakdown .buffer-breakdown-chart span {
    overflow: visible;
    text-overflow: clip;
}
.slope-distribution-breakdown .buffer-breakdown-chart > div > em { width: 54px; }
.slope-distribution-breakdown .buffer-breakdown-chart strong { justify-self: end; }
.slope-chart-heading { align-items: center; }
.slope-metric-switch { display: grid !important; grid-template-columns: repeat(2, auto); gap: 0 !important; overflow: hidden; border: 1px solid var(--analysis-result-border); border-radius: 5px; }
.slope-metric-switch button { min-width: 54px; min-height: 32px; padding: 5px 9px; border: 0; border-right: 1px solid var(--analysis-result-border); color: var(--analysis-result-copy); background: var(--analysis-result-card); font-size: 13px; font-weight: 800; }
.slope-metric-switch button:last-child { border-right: 0; }
.slope-metric-switch button.active { color: #f7edda; background: var(--analysis-result-ink); }
.slope-chart-panel { width: 100%; max-width: 100%; margin: 0; padding: 8px 4px 2px; overflow: hidden; border: 1px solid var(--analysis-result-border); border-radius: 6px; background: var(--analysis-result-card); }
.slope-chart { display: block; width: 100%; max-width: 100%; min-height: 170px; overflow: hidden; cursor: crosshair; touch-action: none; }
.slope-chart text { fill: var(--analysis-result-muted); font: 11px "Noto Serif SC", "Songti SC", serif; letter-spacing: 0; }
.slope-chart .elevation-hover-readout text { fill: #e8dcc7; font: 800 10px "Noto Serif SC", "Songti SC", serif; }
.slope-chart-grid line { stroke: rgba(96, 108, 56, .18); stroke-width: 1; }
.slope-axis { stroke: rgba(53, 65, 38, .45); stroke-width: 1.15; }
.slope-trend-base { fill: none; stroke: var(--analysis-result-ink); stroke-width: 2.15; stroke-linecap: round; stroke-linejoin: round; opacity: .7; pointer-events: none; }
.slope-trend-gap { fill: none; stroke: var(--analysis-result-accent); stroke-width: 1.4; stroke-linecap: round; stroke-dasharray: 4 4; opacity: .62; pointer-events: none; }
.slope-trend-line { fill: none; stroke-width: 1.85; stroke-linecap: round; stroke-linejoin: round; opacity: .84; pointer-events: none; }
.slope-trend-line.slope-flat { stroke: #8d9f66; }
.slope-trend-line.slope-moderate { stroke: #c0a14b; }
.slope-trend-line.slope-steep { stroke: #c98c52; }
.slope-trend-line.slope-very-steep { stroke: #b45f43; }
.slope-priority-range { fill: var(--analysis-result-accent); opacity: .06; cursor: pointer; transition: opacity 140ms ease; }
.slope-priority-range:hover,
.slope-priority-range.active { opacity: .15; }
.slope-priority-list { display: grid; gap: 7px; }
.slope-priority-card { display: grid; gap: 7px; width: 100%; min-width: 0; padding: 12px; border: 1px solid var(--analysis-result-border); border-radius: 6px; color: var(--analysis-result-copy); background: var(--analysis-result-card); text-align: left; }
.slope-priority-card:hover,
.slope-priority-card.active { border-color: rgba(198, 107, 61, .7); background: rgba(198, 107, 61, .08); box-shadow: none; }
.slope-priority-card > strong { color: var(--analysis-result-ink); font-size: 15px; letter-spacing: 0; }
.slope-priority-metrics { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px 14px; margin: 0; padding-top: 7px; border-top: 1px solid var(--analysis-result-rule); }
.slope-priority-metrics > div { display: flex; align-items: baseline; gap: 5px; min-width: 0; }
.slope-priority-metrics dt { color: var(--analysis-result-muted); font-size: 12px; white-space: nowrap; }
.slope-priority-metrics dd { min-width: 0; margin: 0; color: var(--analysis-result-ink); font-size: 13px; font-weight: 800; overflow-wrap: anywhere; }
.slope-priority-empty { margin-top: 1px; padding: 10px 12px; border: 1px dashed var(--analysis-result-border); border-radius: 6px; background: rgba(232, 220, 199, .18); }
.slope-ai-content { display: grid; gap: 0; }
.slope-ai-summary { background: transparent; }
.slope-ai-summary p { margin: 0 0 3px; }
.slope-ai-summary small { display: block; color: var(--analysis-result-muted); }
.slope-ai-compact-section { display: grid; }
.slope-ai-compact-section > header { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.slope-ai-compact-section > header span { display: grid; min-width: 22px; height: 22px; padding: 0 6px; place-items: center; border-radius: 999px; color: #f7edda; background: var(--analysis-result-ink); font-size: 11px; }
.slope-ai-compact-item { display: grid; grid-template-columns: 44px minmax(0, 1fr) auto; align-items: start; gap: 6px; padding: 9px 0; }
.slope-ai-tags { display: flex; width: 44px; flex-wrap: wrap; align-content: start; gap: 4px; }
.slope-ai-tags i { padding: 2px 6px; border: 1px solid rgba(198, 107, 61, .38); border-radius: 999px; color: var(--analysis-result-accent); background: rgba(198, 107, 61, .06); font-size: 10px; font-style: normal; font-weight: 900; white-space: nowrap; }
.slope-ai-compact-item b { display: block; color: var(--analysis-result-ink); font-size: 13px; }
.slope-ai-compact-item p { margin: 3px 0 0; }
.slope-ai-compact-item small { display: block; margin-top: 3px; color: var(--analysis-result-muted); }
.slope-ai-compact-item > em { padding: 3px 6px; color: var(--analysis-result-ink); background: rgba(139, 157, 131, .13); font-size: 10px; font-style: normal; font-weight: 800; white-space: nowrap; }
.slope-ai-compact-empty { margin: 0; padding: 10px 0; color: var(--analysis-result-muted); }
.slope-ai-limit { margin: 0; color: var(--analysis-result-muted); }

@media (max-width: 900px) {
    .slope-stat-grid { grid-template-columns: 1fr; }
    .slope-chart-heading { align-items: flex-start; }
}

/* Analysis decision workbench: map-first shell with delayed result drawer. */
.analysis-fullscreen.analysis-workspace {
    position: relative;
    display: block;
    width: 100%;
    height: calc(100dvh - 86px);
    min-height: 680px;
    padding: 0;
    overflow: hidden;
    isolation: isolate;
    background: #22351f;
}

.analysis-map-layer,
.analysis-fullscreen .analysis-scene-card {
    position: absolute;
    inset: 0;
}

.analysis-fullscreen .analysis-scene-card {
    width: 100%;
    height: 100%;
    min-height: 0;
    border: 0;
    border-radius: 0;
}

.analysis-fullscreen .analysis-sidebar,
.analysis-fullscreen .analysis-results-drawer {
    position: absolute;
    top: 18px;
    bottom: 18px;
    z-index: 12;
    min-height: 0;
    overflow: auto;
    border: 1px solid rgba(212, 184, 149, .78);
    border-radius: 5px;
    color: var(--heritage-copy);
    background:
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence baseFrequency='.86' numOctaves='2'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)' opacity='.04'/%3E%3C/svg%3E"),
        linear-gradient(180deg, rgba(232, 220, 199, .94), rgba(232, 220, 199, .985));
    box-shadow: 0 34px 90px rgba(5, 18, 17, .32);
    backdrop-filter: blur(8px);
}

.analysis-fullscreen .analysis-sidebar {
    left: 18px;
    width: clamp(390px, 25vw, 430px);
    padding: 60px 24px 20px;
    gap: 12px;
    background:
        url("/assets/shared/backgrounds/vertical-panel-texture.png") center / 100% 100% no-repeat,
        linear-gradient(180deg, rgba(232, 220, 199, .98), rgba(232, 220, 199, .995));
}

.analysis-fullscreen .analysis-sidebar.is-entering {
    animation: analysis-sidebar-in 480ms cubic-bezier(.16, 1, .3, 1) both;
}

.analysis-fullscreen .analysis-panel-heading,
.analysis-fullscreen .analysis-results-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.analysis-fullscreen .analysis-panel-heading {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    min-height: 58px;
    margin-bottom: 2px;
    padding-bottom: 14px;
    border-bottom: 1px solid rgba(96, 108, 56, .18);
}

.analysis-fullscreen .analysis-panel-heading > div,
.analysis-fullscreen .analysis-results-heading h3 { min-width: 0; }

.analysis-fullscreen .analysis-results-heading h3 {
    margin: 0;
    color: var(--heritage-ink);
    font-family: "Noto Serif SC", "Songti SC", "Source Han Serif SC", serif;
    font-size: 28px;
    line-height: 1.1;
    overflow-wrap: anywhere;
}

.analysis-title-lockup {
    position: absolute;
    left: 50%;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    gap: 10px;
    width: max-content;
    max-width: calc(100% - 84px);
    padding: 0;
    box-sizing: border-box;
    transform: translateX(-50%);
}

.analysis-title-lockup h3 {
    margin: 0;
    color: var(--heritage-ink);
    font-family: "Noto Serif SC", "Songti SC", "Source Han Serif SC", serif;
    font-size: clamp(26px, 2.2vw, 32px);
    line-height: 1.05;
    letter-spacing: 0;
    font-weight: 900;
    text-align: center;
}

.analysis-title-lockup img {
    flex: 0 0 auto;
    width: auto;
    height: 26px;
    margin-top: 3px;
    filter: drop-shadow(0 3px 8px rgba(114, 69, 24, .2));
}

.analysis-method-back,
.analysis-results-close,
.analysis-picker-close {
    display: grid;
    place-items: center;
    flex: 0 0 auto;
    border: 1px solid rgba(176, 139, 110, .38);
    color: var(--heritage-muted);
    background: rgba(232, 220, 199, .56);
}

.analysis-method-back {
    position: static;
    width: 34px;
    height: 34px;
    padding: 7px;
    border-radius: 50%;
}

.analysis-method-back:hover,
.analysis-results-close:hover,
.analysis-picker-close:hover {
    border-color: rgba(198, 107, 61, .62);
    color: var(--heritage-action);
}

.analysis-method-back svg {
    width: 100%;
    height: 100%;
    transform: translateX(-1.5px);
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.analysis-fullscreen .analysis-control-block {
    padding: 11px 12px;
    border: 1px solid rgba(176, 139, 110, .32);
    border-radius: 8px;
    background: rgba(232, 220, 199, .42);
    box-shadow: none;
}

.analysis-fullscreen.buffer-analysis-workspace .analysis-buffer-selection,
.analysis-fullscreen.buffer-analysis-workspace .analysis-buffer-distance {
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}

.analysis-fullscreen.buffer-analysis-workspace .analysis-buffer-distance {
    padding-top: 12px;
    border-top: 1px solid rgba(96, 108, 56, .18);
}

.analysis-fullscreen.density-analysis-workspace .analysis-density-route-selection,
.analysis-fullscreen.density-analysis-workspace .analysis-density-impact,
.analysis-fullscreen.density-analysis-workspace .analysis-density-segment {
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}

.analysis-fullscreen.density-analysis-workspace .analysis-density-impact,
.analysis-fullscreen.density-analysis-workspace .analysis-density-segment {
    padding-top: 12px;
    border-top: 1px solid rgba(96, 108, 56, .18);
}

.analysis-fullscreen .analysis-control-block > label {
    display: block;
    margin-bottom: 8px;
    color: var(--heritage-muted);
    font-family: "Epilogue", "Greycliff CF", Arial, sans-serif;
    font-size: 14px;
    font-weight: 800;
}

.analysis-fullscreen .analysis-control-block select,
.analysis-fullscreen .analysis-control-block input[type="number"] {
    min-height: 42px;
    padding: 8px 12px;
    border: 1px solid rgba(176, 139, 110, .34);
    border-radius: 8px;
    color: var(--heritage-copy);
    background: rgba(232, 220, 199, .66);
}

.analysis-fullscreen .analysis-scope-toggle button,
.analysis-fullscreen .analysis-period-pills button,
.analysis-fullscreen .analysis-radius-presets button,
.analysis-fullscreen .elevation-precision-options button,
.analysis-fullscreen .elevation-draw-actions button,
.analysis-fullscreen .elevation-map-range-actions button,
.analysis-fullscreen .viewshed-map-action {
    min-height: 40px;
    padding: 7px 10px;
    border: 1px solid rgba(176, 139, 110, .32);
    border-radius: 8px;
    color: var(--heritage-muted);
    background: rgba(232, 220, 199, .42);
}

.analysis-fullscreen .analysis-scope-toggle button.active,
.analysis-fullscreen .analysis-period-pills button.active,
.analysis-fullscreen .analysis-radius-presets button.active,
.analysis-fullscreen .elevation-precision-options button.active,
.analysis-fullscreen .viewshed-map-action.has-value {
    border-color: rgba(17, 62, 58, .72);
    color: var(--sand);
    background: linear-gradient(180deg, rgba(24, 78, 70, .98), rgba(14, 64, 58, .98));
}

.analysis-fullscreen.elevation-analysis-workspace .elevation-mode-block,
.analysis-fullscreen.elevation-analysis-workspace .elevation-route-block,
.analysis-fullscreen.elevation-analysis-workspace .elevation-range-block,
.analysis-fullscreen.elevation-analysis-workspace .elevation-draw-block,
.analysis-fullscreen.elevation-analysis-workspace .elevation-precision-block,
.analysis-fullscreen.slope-analysis-workspace .slope-mode-block,
.analysis-fullscreen.slope-analysis-workspace .slope-route-block,
.analysis-fullscreen.slope-analysis-workspace .slope-range-block,
.analysis-fullscreen.slope-analysis-workspace .slope-draw-block,
.analysis-fullscreen.slope-analysis-workspace .slope-precision-block,
.analysis-fullscreen.viewshed-analysis-workspace .viewshed-observer-block,
.analysis-fullscreen.viewshed-analysis-workspace .viewshed-search-block,
.analysis-fullscreen.viewshed-analysis-workspace .viewshed-map-point-block,
.analysis-fullscreen.viewshed-analysis-workspace .viewshed-option-block {
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}

.analysis-fullscreen.elevation-analysis-workspace .elevation-route-block,
.analysis-fullscreen.elevation-analysis-workspace .elevation-range-block,
.analysis-fullscreen.elevation-analysis-workspace .elevation-draw-block,
.analysis-fullscreen.elevation-analysis-workspace .elevation-precision-block,
.analysis-fullscreen.slope-analysis-workspace .slope-route-block,
.analysis-fullscreen.slope-analysis-workspace .slope-range-block,
.analysis-fullscreen.slope-analysis-workspace .slope-draw-block,
.analysis-fullscreen.slope-analysis-workspace .slope-precision-block,
.analysis-fullscreen.viewshed-analysis-workspace .viewshed-map-point-block {
    padding-top: 12px;
    border-top: 1px solid rgba(96, 108, 56, .18);
}

.analysis-fullscreen.viewshed-analysis-workspace .viewshed-search-block {
    padding-top: 10px;
    border-top: 0;
}

.analysis-fullscreen.viewshed-analysis-workspace .viewshed-option-block {
    display: grid;
    grid-template-columns: 44px minmax(0, 1fr);
    align-items: center;
    column-gap: 8px;
    padding-top: 0;
    border-top: 0;
}

.analysis-fullscreen.viewshed-analysis-workspace .viewshed-option-block + .viewshed-option-block {
    margin-top: 5px;
}

.analysis-fullscreen.viewshed-analysis-workspace .viewshed-option-block .heritage-logic-title {
    align-self: center;
    margin: 0;
}

.analysis-fullscreen.viewshed-analysis-workspace .viewshed-option-block .heritage-logic-title span {
    font-size: 14px;
    line-height: 1.35;
    text-align: center;
}

.analysis-fullscreen.elevation-analysis-workspace .elevation-draw-block .analysis-scope-toggle,
.analysis-fullscreen.slope-analysis-workspace .slope-draw-block .analysis-scope-toggle {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
}

.analysis-fullscreen.elevation-analysis-workspace .elevation-draw-block .analysis-scope-toggle button,
.analysis-fullscreen.slope-analysis-workspace .slope-draw-block .analysis-scope-toggle button {
    width: 100%;
}

.analysis-fullscreen.elevation-analysis-workspace .elevation-mode-tabs,
.analysis-fullscreen.slope-analysis-workspace .elevation-mode-tabs,
.analysis-fullscreen.viewshed-analysis-workspace .elevation-mode-tabs {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 6px;
    padding: 5px;
    border-radius: 5px;
    background: rgba(139, 157, 131, .14);
}

.analysis-fullscreen.elevation-analysis-workspace .elevation-mode-tabs button,
.analysis-fullscreen.slope-analysis-workspace .elevation-mode-tabs button,
.analysis-fullscreen.viewshed-analysis-workspace .elevation-mode-tabs button {
    min-height: 40px;
    border: 0;
    border-radius: 5px;
    color: var(--heritage-ink);
    background: transparent;
    font-family: "Noto Serif SC", "Songti SC", "Source Han Serif SC", serif;
    font-size: 15px;
    font-weight: 900;
}

.analysis-fullscreen.elevation-analysis-workspace .elevation-mode-tabs button.active,
.analysis-fullscreen.slope-analysis-workspace .elevation-mode-tabs button.active,
.analysis-fullscreen.viewshed-analysis-workspace .elevation-mode-tabs button.active {
    color: var(--sand);
    background: var(--heritage-ink);
    box-shadow: 0 7px 18px rgba(96, 108, 56, .2);
}

.analysis-fullscreen.elevation-analysis-workspace .elevation-draw-actions,
.analysis-fullscreen.slope-analysis-workspace .elevation-draw-actions {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
    margin-top: 10px;
}

.analysis-fullscreen.elevation-analysis-workspace .elevation-draw-actions button,
.analysis-fullscreen.slope-analysis-workspace .elevation-draw-actions button {
    width: 100%;
    min-width: 0;
}

.analysis-fullscreen.elevation-analysis-workspace .elevation-draw-status,
.analysis-fullscreen.slope-analysis-workspace .elevation-draw-status {
    display: none;
    margin: 12px 0 0;
    color: var(--heritage-muted);
    font-family: "Noto Serif SC", "Songti SC", "Source Han Serif SC", serif;
    font-size: 14px;
    font-weight: 800;
    line-height: 1.4;
    text-align: center;
}

.analysis-fullscreen.elevation-analysis-workspace .elevation-draw-status.is-visible,
.analysis-fullscreen.slope-analysis-workspace .elevation-draw-status.is-visible {
    display: block;
}

.analysis-fullscreen.elevation-analysis-workspace .elevation-range-inputs,
.analysis-fullscreen.slope-analysis-workspace .elevation-range-inputs {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
    margin-top: 0;
}

.analysis-fullscreen.elevation-analysis-workspace .elevation-range-control,
.analysis-fullscreen.slope-analysis-workspace .elevation-range-control {
    display: grid;
    gap: 6px;
}

.analysis-fullscreen.elevation-analysis-workspace .elevation-range-control > label,
.analysis-fullscreen.slope-analysis-workspace .elevation-range-control > label {
    color: var(--heritage-muted);
    font-family: "Noto Serif SC", "Songti SC", "Source Han Serif SC", serif;
    font-size: 14px;
    font-weight: 900;
    text-align: center;
}

.elevation-range-field {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 38px;
    align-items: stretch;
    min-width: 0;
    overflow: hidden;
    border: 1px solid rgba(176, 139, 110, .34);
    border-radius: 5px;
    background: rgba(232, 220, 199, .5);
}

.analysis-fullscreen.elevation-analysis-workspace .elevation-range-field input[type="number"],
.analysis-fullscreen.slope-analysis-workspace .elevation-range-field input[type="number"] {
    width: 100%;
    min-width: 0;
    min-height: 40px;
    padding: 7px 9px;
    border: 0;
    border-radius: 0;
    outline: 0;
    color: var(--heritage-ink);
    background: transparent;
    box-shadow: none;
    appearance: textfield;
}

.analysis-fullscreen.elevation-analysis-workspace .elevation-range-field input[type="number"]::-webkit-inner-spin-button,
.analysis-fullscreen.elevation-analysis-workspace .elevation-range-field input[type="number"]::-webkit-outer-spin-button,
.analysis-fullscreen.slope-analysis-workspace .elevation-range-field input[type="number"]::-webkit-inner-spin-button,
.analysis-fullscreen.slope-analysis-workspace .elevation-range-field input[type="number"]::-webkit-outer-spin-button {
    margin: 0;
    appearance: none;
}

.elevation-range-field:focus-within {
    border-color: rgba(17, 62, 58, .64);
    box-shadow: 0 0 0 2px rgba(17, 62, 58, .1);
}

.elevation-range-pick {
    display: grid;
    place-items: center;
    width: 38px;
    min-width: 38px;
    padding: 9px;
    border: 0;
    border-left: 1px solid rgba(176, 139, 110, .34);
    border-radius: 0;
    color: var(--heritage-muted);
    background: rgba(212, 184, 149, .24);
}

.elevation-range-pick:hover,
.elevation-range-pick.is-picking {
    color: var(--sand);
    background: var(--heritage-action-deep);
}

.elevation-range-pick svg {
    width: 18px;
    height: 18px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.analysis-fullscreen.elevation-analysis-workspace .elevation-precision-options,
.analysis-fullscreen.slope-analysis-workspace .elevation-precision-options,
.analysis-fullscreen.viewshed-analysis-workspace .elevation-precision-options {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
}

.analysis-fullscreen.elevation-analysis-workspace .elevation-precision-options button,
.analysis-fullscreen.slope-analysis-workspace .elevation-precision-options button,
.analysis-fullscreen.viewshed-analysis-workspace .elevation-precision-options button {
    display: grid;
    place-items: center;
    width: 100%;
    min-width: 0;
    text-align: center;
}

.analysis-fullscreen.viewshed-analysis-workspace .viewshed-observer-tabs {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.analysis-fullscreen.viewshed-analysis-workspace .analysis-viewshed-observer-results {
    margin-top: 10px;
    padding: 8px;
    border: 1px solid rgba(176, 139, 110, .34);
    border-radius: 5px;
    background: rgba(232, 220, 199, .18);
}

.analysis-fullscreen.viewshed-analysis-workspace .analysis-viewshed-observer-results .heritage-card-list {
    gap: 7px;
}

.analysis-fullscreen.viewshed-analysis-workspace .analysis-viewshed-observer-card {
    grid-template-columns: 82px minmax(0, 1fr);
    gap: 9px;
    min-height: 68px;
    padding: 7px;
    border-radius: 5px;
}

.analysis-fullscreen.viewshed-analysis-workspace .analysis-viewshed-observer-card .heritage-result-media {
    width: 82px;
    min-width: 82px;
    height: 54px;
    border-radius: 4px;
}

.analysis-fullscreen.viewshed-analysis-workspace .analysis-viewshed-observer-card .heritage-result-copy {
    align-content: center;
    gap: 5px;
}

.analysis-fullscreen.viewshed-analysis-workspace .analysis-viewshed-observer-card .heritage-name-marquee {
    font-size: 17px;
}

.analysis-fullscreen.viewshed-analysis-workspace .analysis-viewshed-observer-card .heritage-result-meta {
    gap: 8px;
    font-size: 12px;
}

.analysis-fullscreen.viewshed-analysis-workspace .heritage-result-card.viewshed-node-meta .heritage-result-meta {
    overflow: visible;
    white-space: normal;
    line-height: 17px;
}

.analysis-fullscreen.viewshed-analysis-workspace .heritage-result-card.viewshed-node-meta .heritage-result-meta span {
    flex: 1 1 auto;
    overflow: visible;
    color: rgba(33, 66, 32, .82);
    text-overflow: clip;
    white-space: normal;
}

.analysis-fullscreen.viewshed-analysis-workspace .analysis-viewshed-pagination {
    margin-top: 7px;
    padding-top: 7px;
}

.analysis-fullscreen.viewshed-analysis-workspace .analysis-viewshed-pagination .heritage-page-controls button,
.analysis-fullscreen.viewshed-analysis-workspace .analysis-viewshed-pagination .heritage-page-input {
    box-sizing: border-box;
    height: 32px;
    min-height: 32px;
    border-radius: 6px;
}

.analysis-fullscreen.viewshed-analysis-workspace .analysis-viewshed-pagination .heritage-page-controls button {
    width: 32px;
    flex-basis: 32px;
}

.analysis-fullscreen.viewshed-analysis-workspace .viewshed-option-block .analysis-radius-presets,
.analysis-fullscreen.viewshed-analysis-workspace .viewshed-option-block .elevation-precision-options {
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 8px;
}

.analysis-fullscreen.viewshed-analysis-workspace .viewshed-option-block .elevation-precision-options {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.analysis-fullscreen.viewshed-analysis-workspace .viewshed-option-block .analysis-radius-presets button,
.analysis-fullscreen.viewshed-analysis-workspace .viewshed-option-block .elevation-precision-options button {
    width: 100%;
    min-width: 0;
    font-size: 13px;
}

.analysis-fullscreen.viewshed-analysis-workspace .viewshed-option-block > .viewshed-map-action {
    grid-column: 2;
    margin-top: 6px;
}

.analysis-fullscreen.viewshed-analysis-workspace .viewshed-map-point-block .viewshed-map-action {
    margin-top: 0;
}

.analysis-fullscreen .analysis-run-button {
    width: 100%;
    min-height: 47px;
    margin-top: 2px;
    border: 1px solid rgba(17, 62, 58, .72);
    border-radius: 8px;
    color: #f1dfb9;
    background: linear-gradient(180deg, rgba(24, 78, 70, .98), rgba(14, 64, 58, .98));
    box-shadow: 0 12px 26px rgba(5, 18, 17, .18);
    font-size: 17px;
    font-weight: 900;
    transition: transform var(--ease), filter var(--ease);
}

.analysis-fullscreen .analysis-run-button:hover:not(:disabled) {
    transform: translateY(-1px);
    filter: brightness(1.04);
}

.analysis-fullscreen .analysis-run-button:disabled { cursor: wait; opacity: .64; }

.analysis-fullscreen .analysis-results-drawer {
    right: 18px;
    left: auto;
    width: min(504px, calc(100vw - 36px));
    z-index: 20;
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 22px 20px;
    animation: analysis-results-in 360ms cubic-bezier(.16, 1, .3, 1) both;
}

/* All five analysis result drawers share the heritage-card landscape paper. */
.analysis-fullscreen .analysis-results-drawer {
    background: #e8dcc7 url("/assets/pages/heritage-atlas/heritage-card-background.jpg") center bottom / 100% 100% no-repeat;
}

.analysis-fullscreen .analysis-results-heading {
    min-height: 48px;
    padding: 0 0 12px;
    border-bottom: 1px solid rgba(96, 108, 56, .2);
}

.analysis-fullscreen .analysis-results-actions {
    display: flex;
    flex: 0 0 auto;
    align-items: center;
    gap: 8px;
}

.analysis-fullscreen .analysis-ai-trigger {
    display: grid;
    width: 34px;
    height: 34px;
    flex: 0 0 34px;
    place-items: center;
    padding: 0;
    border: 1px solid rgba(154, 57, 49, .64);
    border-radius: 50%;
    color: #f8ead0;
    background: #b94e43;
    box-shadow: 0 5px 14px rgba(132, 52, 44, .18);
    font: 900 11px/1 "Epilogue", Arial, sans-serif;
    cursor: pointer;
    transition: background-color 220ms ease, transform 220ms ease, box-shadow 220ms ease;
}

.analysis-fullscreen .analysis-ai-trigger:hover,
.analysis-fullscreen .analysis-ai-trigger.active {
    background: #a64238;
    box-shadow: 0 7px 18px rgba(132, 52, 44, .26);
    transform: translateY(-1px);
}

.analysis-fullscreen .analysis-results-heading h3 {
    font-size: 28px;
}

.analysis-fullscreen .analysis-results-content {
    padding: 0 3px 0 0;
}

.analysis-fullscreen .analysis-results-content > .statistics-ai-panel {
    width: 100%;
    min-height: 0;
    flex: 1 1 auto;
    overflow: hidden;
}

.analysis-fullscreen .buffer-result-tabs {
    border-color: rgba(176, 139, 110, .34);
    background: rgba(212, 184, 149, .18);
}

.analysis-fullscreen .buffer-result-tabs button {
    min-height: 48px;
    font-family: "Noto Serif SC", "Songti SC", "Source Han Serif SC", serif;
    font-size: 18px;
    font-weight: 900;
    line-height: 1;
}

.analysis-fullscreen .buffer-result-tabs button span {
    width: 28px;
    height: 28px;
    margin-right: 7px;
    border-width: 2px;
    font-family: inherit;
    font-size: 20px;
    font-weight: 900;
    line-height: 1;
    transform: translateY(-1px);
}

.analysis-fullscreen .buffer-result-block > header {
    margin-bottom: 10px;
}

.analysis-fullscreen .buffer-result-block h5 {
    font-size: 15px;
}

.analysis-fullscreen .buffer-metric,
.statistics-results-panel .statistics-result-metrics .buffer-metric {
    min-height: 72px;
    padding: 10px 12px;
    background: rgba(232, 220, 199, .5);
}

.analysis-fullscreen .buffer-metric span,
.analysis-fullscreen .buffer-metric small,
.statistics-results-panel .statistics-result-metrics .buffer-metric span { font-size: 13px; }
.analysis-fullscreen .buffer-metric strong,
.statistics-results-panel .statistics-result-metrics .buffer-metric strong { font-size: 22px; }
.analysis-fullscreen .buffer-segmented button { min-height: 40px; font-size: 14px; font-weight: 850; }
.analysis-fullscreen .buffer-breakdown-chart span,
.analysis-fullscreen .buffer-breakdown-chart strong { font-size: 13px; }

.analysis-fullscreen .buffer-ranked-item,
.analysis-fullscreen .buffer-route-item,
.analysis-fullscreen .buffer-admin-item {
    border-radius: 6px;
    border-color: rgba(176, 139, 110, .3);
    background: rgba(232, 220, 199, .46);
}

.analysis-fullscreen .buffer-ranked-item:hover,
.analysis-fullscreen .buffer-route-item:hover,
.analysis-fullscreen .buffer-admin-item:hover,
.analysis-fullscreen .buffer-ranked-item.active,
.analysis-fullscreen .buffer-route-item.active,
.analysis-fullscreen .buffer-admin-item.active {
    border-color: rgba(198, 107, 61, .7);
    background: rgba(198, 107, 61, .1);
}

.analysis-fullscreen .buffer-result-block h5 { color: #163d26; font-size: 17px; }
.analysis-fullscreen .buffer-ranked-content strong,
.analysis-fullscreen .buffer-route-title strong,
.analysis-fullscreen .buffer-admin-title strong { color: #163d26; font-size: 15px; }
.analysis-fullscreen .buffer-ranked-content span,
.analysis-fullscreen .buffer-route-tags i,
.analysis-fullscreen .buffer-route-stats,
.analysis-fullscreen .buffer-admin-stats { font-size: 12px; }
.analysis-fullscreen .buffer-rank { font-size: 13px; }
.analysis-fullscreen .buffer-ranked-item > b,
.analysis-fullscreen .buffer-route-distance,
.analysis-fullscreen .buffer-admin-title > b { font-size: 13px; }
.analysis-fullscreen .buffer-admin-legend-item { font-size: 14px; }

.analysis-fullscreen .buffer-segmented {
    border-color: rgba(176, 139, 110, .3);
    background: rgba(212, 184, 149, .18);
}

.analysis-results-close,
.analysis-picker-close {
    width: 34px;
    height: 34px;
    padding: 8px;
    border-radius: 50%;
}

.analysis-results-close svg,
.analysis-picker-close svg {
    width: 100%;
    height: 100%;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
}

.analysis-fullscreen .analysis-results-content { min-height: 0; }

@keyframes analysis-results-in {
    from { opacity: 0; transform: translateX(32px); }
    to { opacity: 1; transform: translateX(0); }
}

@keyframes analysis-sidebar-in {
    0% {
        opacity: 0;
        transform: translate3d(calc(-100% - 36px), 0, 0);
    }

    72% {
        opacity: 1;
        transform: translate3d(7px, 0, 0);
    }

    100% {
        opacity: 1;
        transform: translate3d(0, 0, 0);
    }
}

@media (prefers-reduced-motion: reduce) {
    .analysis-fullscreen .analysis-sidebar.is-entering {
        animation: none;
    }
}

.analysis-method-picker-backdrop {
    position: absolute;
    inset: 0;
    z-index: 50;
    display: grid;
    place-items: center;
    padding: 28px;
    background: rgba(25, 41, 31, .62);
    backdrop-filter: blur(5px);
}

.analysis-method-picker {
    width: min(860px, calc(100vw - 40px));
    max-height: calc(100% - 40px);
    overflow: auto;
    padding: 26px;
    border: 1px solid rgba(212, 184, 149, .82);
    border-radius: 8px;
    background:
        url("/assets/shared/backgrounds/vertical-panel-texture.png") center / 100% 100% no-repeat,
        linear-gradient(180deg, rgba(232, 220, 199, .98), rgba(232, 220, 199, .995));
    box-shadow: 0 30px 90px rgba(5, 18, 17, .42);
}

.analysis-method-picker-heading {
    position: relative;
    display: grid;
    place-items: center;
    min-height: 58px;
    margin-bottom: 18px;
    padding: 0 52px 16px;
    border-bottom: 1px solid rgba(96, 108, 56, .18);
}

.analysis-method-picker-heading h2 {
    margin: 0;
    color: var(--heritage-ink);
    font-family: "Noto Serif SC", "Songti SC", "Source Han Serif SC", serif;
    font-size: 43px;
    line-height: 1.05;
    letter-spacing: 0;
    font-weight: 900;
    text-align: center;
}

.analysis-method-picker-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
}

.analysis-method-choice {
    position: relative;
    display: grid;
    grid-template-columns: 58px minmax(0, 1fr) 28px;
    align-items: center;
    gap: 12px;
    min-height: 88px;
    padding: 14px 18px;
    border: 1px solid rgba(176, 139, 110, .34);
    border-radius: 8px;
    color: var(--heritage-copy);
    background-image:
        linear-gradient(90deg, rgba(232, 220, 199, .94) 0%, rgba(232, 220, 199, .82) 54%, rgba(232, 220, 199, .46) 100%),
        var(--analysis-method-choice-image);
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    text-align: left;
    transition: transform var(--ease), border-color var(--ease), background-color var(--ease);
}

.analysis-method-choice:hover,
.analysis-method-choice:focus-visible,
.analysis-method-choice.active {
    outline: 0;
    border-color: rgba(198, 107, 61, .7);
    background-image:
        linear-gradient(90deg, rgba(212, 184, 149, .88) 0%, rgba(212, 184, 149, .72) 54%, rgba(212, 184, 149, .34) 100%),
        var(--analysis-method-choice-image);
    transform: translateY(-2px);
}

.analysis-method-choice-index {
    align-self: center;
    display: flex;
    align-items: center;
    height: 44px;
    color: var(--terracotta);
    font-family: "Epilogue", "Greycliff CF", Arial, sans-serif;
    font-size: 25px;
    line-height: 44px;
    font-weight: 900;
}

.analysis-method-choice-copy {
    display: grid;
    grid-template-rows: 25px 16px;
    gap: 3px;
    height: 44px;
    min-width: 0;
}

.analysis-method-choice-copy strong {
    color: var(--heritage-ink);
    font-family: "Noto Serif SC", "Songti SC", "Source Han Serif SC", serif;
    font-size: 20px;
    line-height: 25px;
}

.analysis-method-choice-copy span {
    color: var(--heritage-muted);
    font-size: 12px;
    line-height: 16px;
}

.analysis-method-choice-arrow {
    width: 24px;
    height: 24px;
    fill: none;
    stroke: var(--heritage-muted);
    stroke-width: 1.8;
    stroke-linecap: round;
}

.analysis-method-picker-heading .analysis-picker-close {
    position: absolute;
    top: 0;
    right: 0;
    color: var(--heritage-muted);
    border: 1px solid rgba(176, 139, 110, .34);
    background: rgba(232, 220, 199, .46);
}

@media (max-width: 820px) {
    .analysis-fullscreen.analysis-workspace { min-height: calc(100dvh - 86px); height: auto; overflow: auto; }
    .analysis-fullscreen .analysis-scene-card { position: fixed; inset: 86px 0 0; height: auto; }
    .analysis-fullscreen .analysis-sidebar,
    .analysis-fullscreen .analysis-results-drawer { position: relative; top: auto; right: auto; bottom: auto; left: auto; width: calc(100% - 24px); margin: 12px; }
    .analysis-fullscreen .analysis-sidebar { padding: 22px 18px; }
    .analysis-fullscreen .analysis-results-drawer { margin-top: 0; }
    .analysis-map-layer { position: fixed; inset: 86px 0 0; }
    .analysis-method-picker-backdrop { position: fixed; inset: 0; padding: 14px; }
    .analysis-method-picker { width: 100%; padding: 20px 16px; }
    .analysis-method-picker-grid { grid-template-columns: 1fr; }
    .analysis-method-picker-heading h2 { font-size: 38px; }
    .analysis-fullscreen .analysis-scene-canvas .supermap3d-viewer-navigationContainer,
    .analysis-fullscreen.has-analysis-results .analysis-scene-canvas .supermap3d-viewer-navigationContainer {
        top: 14px;
        right: 14px;
        transform: scale(.82);
        transform-origin: top right;
    }
}

/* Management home — the same 48/52 composition as the public landing page. */
@keyframes dashboardSpin { to { transform: rotate(360deg); } }

.dashboard-error {
    position: fixed;
    z-index: 80;
    top: 96px;
    left: 50%;
    max-width: min(760px, calc(100vw - 32px));
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 9px 14px;
    border: 1px solid rgba(176, 139, 110, .56);
    border-radius: 18px;
    color: #5d4334;
    background: #d4b895;
    box-shadow: 0 12px 26px rgba(84, 66, 48, .18);
    font-size: 11px;
    transform: translateX(-50%);
}
.dashboard-error span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dashboard-error button { flex: 0 0 auto; border: 0; color: inherit; background: transparent; font-weight: 900; cursor: pointer; }

.dashboard-map-canvas { position: absolute; inset: 0; width: 100%; height: 100%; }
.dashboard-empty { min-height: 70px; display: grid; place-items: center; color: #777250; font-size: 9px; }

.admin-home-page {
    --admin-moss: #606c38;
    --admin-sage: #8b9d83;
    --admin-clay: #b08b6e;
    --admin-ochre: #c08e3a;
    --admin-oat: #d4b895;
    --admin-sand: #e8dcc7;
    width: 100%;
    height: calc(100dvh - 86px);
    min-height: calc(100dvh - 86px);
    display: grid;
    grid-template-rows: minmax(440px, 48vh) minmax(0, calc(52vh - 86px));
    overflow: hidden;
    color: #39472e;
    background:
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence baseFrequency='.72' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)' opacity='.025'/%3E%3C/svg%3E"),
        var(--admin-sand);
    font-family: "Epilogue", "Greycliff CF", "Noto Sans SC", "PingFang SC", sans-serif;
}
.admin-home-page,
.admin-home-page * { box-sizing: border-box; }
.admin-home-page button { font-family: inherit; }

.admin-home-hero {
    --admin-home-map-control-height: 50px;
    --admin-home-map-control-bottom: 18px;
    --admin-home-map-toolbar-right: 22px;
    --admin-home-map-toolbar-width: 102px;
    --admin-home-map-control-gap: 8px;
    position: relative;
    min-width: 0;
    min-height: 0;
    overflow: hidden;
    color: var(--admin-sand);
    background: #182521;
    isolation: isolate;
}
.admin-home-hero .dashboard-map-canvas { z-index: 1; }
.admin-home-hero .dashboard-map-canvas .supermap3d-viewer-navigationContainer { display: none !important; }
.admin-home-hero .dashboard-map-canvas.is-morphing::after { content: none; }
.admin-home-map-shade {
    position: absolute;
    inset: 0;
    z-index: 3;
    pointer-events: none;
    background:
        linear-gradient(90deg, rgba(38, 50, 31, .88) 0%, rgba(46, 59, 35, .68) 31%, rgba(46, 59, 35, .18) 58%, rgba(46, 59, 35, .06) 100%),
        linear-gradient(0deg, rgba(38, 50, 31, .18), transparent 42%);
}
.admin-home-map-shade::after {
    content: "";
    position: absolute;
    inset: 0;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence baseFrequency='.75' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)' opacity='.025'/%3E%3C/svg%3E");
    mix-blend-mode: multiply;
}

.admin-home-hero-copy {
    z-index: 6;
    font-family: "Adobe Caslon Pro", "Libre Caslon Text", "Iowan Old Style", "Songti SC", Georgia, serif;
}

.admin-home-hero-tools {
    position: absolute;
    z-index: 8;
    top: 18px;
    right: 22px;
    display: flex;
    align-items: center;
    gap: 0;
    padding: 4px;
    border: 1px solid rgba(216, 191, 140, .24);
    border-radius: 25px;
    background: rgba(7, 24, 28, .68);
    box-shadow: 0 12px 34px rgba(0, 0, 0, .22);
    backdrop-filter: blur(10px);
}
.admin-home-sync {
    min-height: 40px;
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 0 16px 0 12px;
    border: 0;
    border-radius: 20px 0 0 20px;
    color: var(--admin-sand);
    background: transparent;
}
.admin-home-sync > i {
    width: 8px;
    height: 8px;
    flex: 0 0 8px;
    border-radius: 50%;
    background: var(--admin-sage);
    box-shadow: 0 0 0 5px rgba(139, 157, 131, .13);
    animation: admin-home-breathe 3.2s ease-in-out infinite;
}
.admin-home-sync.is-error > i { background: var(--admin-clay); }
.admin-home-sync > div { display: grid; gap: 1px; }
.admin-home-sync b { color: var(--admin-sand); font-size: 10px; letter-spacing: .02em; }
.admin-home-sync span { color: rgba(232, 220, 199, .62); font-size: 8px; font-variant-numeric: tabular-nums; }
.admin-home-icon-button {
    width: 40px;
    height: 40px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    border: 0;
    border-left: 1px solid rgba(216, 191, 140, .15);
    border-radius: 0;
    color: var(--admin-sand);
    background: transparent;
    font-size: 10px;
    font-weight: 800;
    cursor: pointer;
    transition: transform 360ms ease, background-color 360ms ease, color 360ms ease;
}
.admin-home-icon-button:last-child { border-radius: 0 20px 20px 0; }
.admin-home-icon-button svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.8; }
.admin-home-icon-button:hover { color: #182521; background: #d8bf8c; }
.admin-home-icon-button:disabled { opacity: .5; cursor: wait; }
.admin-home-icon-button.is-busy svg { animation: dashboardSpin 1s linear infinite; }

.admin-home-map-toolbar {
    position: absolute;
    z-index: 8;
    right: var(--admin-home-map-toolbar-right);
    bottom: var(--admin-home-map-control-bottom);
    width: var(--admin-home-map-toolbar-width);
    height: var(--admin-home-map-control-height);
    display: flex;
    gap: 0;
    padding: 4px;
    color: var(--admin-sand);
    border: 1px solid rgba(216, 191, 140, .24);
    border-radius: 25px;
    background: rgba(7, 24, 28, .68);
    box-shadow: 0 12px 34px rgba(0, 0, 0, .22);
    backdrop-filter: blur(10px);
}
.admin-home-map-toolbar button {
    width: 46px;
    height: 40px;
    display: grid;
    place-items: center;
    padding: 0;
    border: 0;
    border-radius: 20px;
    color: var(--admin-sand);
    background: transparent;
    font-size: 11px;
    font-weight: 900;
    cursor: pointer;
    transition: color 360ms ease, background-color 360ms ease;
}
.admin-home-map-toolbar button + button { border-left: 1px solid rgba(216, 191, 140, .15); }
.admin-home-map-toolbar button.active { color: #182521; background: var(--admin-sand); }
.admin-home-map-legend {
    right: calc(var(--admin-home-map-toolbar-right) + var(--admin-home-map-toolbar-width) + var(--admin-home-map-control-gap));
    bottom: var(--admin-home-map-control-bottom);
    z-index: 8;
    height: var(--admin-home-map-control-height);
    min-height: 0;
    gap: 16px;
    padding: 4px 18px;
    border: 1px solid rgba(216, 191, 140, .24);
    border-radius: 25px;
    color: var(--admin-sand);
    background: rgba(7, 24, 28, .68);
    box-shadow: 0 12px 34px rgba(0, 0, 0, .22);
    backdrop-filter: blur(10px);
}
.admin-home-map-legend i.heritage,
.admin-home-map-legend i.node { border-color: rgba(232, 220, 199, .82); }
.admin-home-map-legend i.route { box-shadow: 0 0 0 1px rgba(232, 220, 199, .62); }
.admin-home-map-legend span {
    height: 40px;
    color: inherit;
    line-height: 40px;
}

.admin-home-lower {
    position: relative;
    z-index: 4;
    min-width: 0;
    min-height: 0;
    display: grid;
    grid-template-columns: minmax(220px, .62fr) minmax(0, 4.9fr);
    grid-template-rows: minmax(0, 1fr);
    gap: 28px;
    padding: 24px 32px 30px;
    background: var(--admin-sand);
    isolation: isolate;
}
.admin-home-lower::after {
    content: "";
    position: absolute;
    z-index: -1;
    right: 0;
    bottom: 0;
    left: 0;
    height: min(34vh, 300px);
    pointer-events: none;
    background: url("assets/pages/home/bottom-mountain-band.png") left bottom / 100% auto no-repeat;
}
.admin-home-insights {
    min-width: 0;
    min-height: 0;
    display: grid;
    grid-template-columns: 1fr;
    grid-template-rows: minmax(0, 1fr);
}
.admin-home-modules { padding: 0; }
.admin-home-panel {
    min-width: 0;
    min-height: 0;
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
    overflow: hidden;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}
.admin-home-panel > header {
    min-width: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}
.admin-home-panel header span { display: block; margin-bottom: 3px; color: #777250; font-size: 9px; font-weight: 800; letter-spacing: .08em; }
.admin-home-panel h3 { margin: 0; color: #3f4d31; font-family: "Adobe Caslon Pro", "Libre Caslon Text", "Songti SC", "STSong", serif; font-size: 18px; }
.admin-home-panel header button {
    padding: 5px 0;
    border: 0;
    color: var(--admin-moss);
    background: transparent;
    font-size: 9px;
    font-weight: 900;
    cursor: pointer;
}
.admin-home-panel header > small { color: #777250; font-size: 8px; }

.admin-home-module-grid {
    min-height: 0;
    display: grid;
    grid-template-rows: repeat(3, minmax(0, 1fr));
    gap: 8px;
    margin-top: 4px;
}
.admin-home-module-grid > button {
    position: relative;
    min-width: 0;
    min-height: 0;
    display: flex;
    align-items: end;
    padding: 0;
    overflow: hidden;
    border: 0;
    border-radius: 5px;
    color: var(--admin-sand);
    text-align: left;
    background: var(--module-image) center / cover;
    box-shadow: 0 9px 22px rgba(69, 67, 45, .12);
    cursor: pointer;
    transition: transform 420ms ease, box-shadow 420ms ease;
    animation: admin-home-module-enter 560ms cubic-bezier(.22, 1, .36, 1) backwards;
    animation-delay: var(--module-delay);
}
.admin-home-module-grid > button::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(34, 44, 29, .01) 20%, rgba(34, 44, 29, .12) 58%, rgba(34, 44, 29, .48) 100%); }
.admin-home-module-grid > button:hover { transform: translateY(-3px); box-shadow: 0 14px 28px rgba(69, 67, 45, .18); }
.admin-home-module-copy { position: relative; z-index: 2; min-width: 0; display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: end; gap: 2px 8px; padding: 11px; }
.admin-home-module-copy b { font-family: "Adobe Caslon Pro", "Libre Caslon Text", "Songti SC", "STSong", serif; font-size: 15px; text-shadow: 0 1px 7px rgba(17, 26, 15, .72); }
.admin-home-module-copy small { grid-column: 1; color: rgba(244, 235, 217, .9); font-size: 8px; line-height: 1.35; text-shadow: 0 1px 6px rgba(17, 26, 15, .78); white-space: normal; }
.admin-home-module-copy em { grid-column: 2; grid-row: 1 / 3; display: flex; align-items: center; gap: 3px; color: var(--admin-oat); font-size: 7px; font-style: normal; font-weight: 800; white-space: nowrap; }
.admin-home-module-copy svg { width: 11px; height: 11px; fill: none; stroke: currentColor; stroke-width: 1.8; }

/* Management overview: continuous data canvas with public-home chapter rules. */
.admin-home-section-heading {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 12px;
}
.admin-home-section-heading h3 {
    flex: 0 0 auto;
    margin: 0;
    color: #3f4d31;
    font-family: "Adobe Caslon Pro", "Libre Caslon Text", "Songti SC", "STSong", serif;
    font-size: 22px;
    font-weight: 700;
    line-height: 1.15;
}
.admin-home-section-heading > i {
    min-width: 18px;
    height: 2px;
    flex: 1 1 auto;
    background: rgba(96, 108, 56, .28);
}
.admin-home-section-heading > button,
.admin-home-section-heading > small {
    flex: 0 0 auto;
    padding: 0;
    border: 0;
    color: #6b714e;
    background: transparent;
    font-size: 10px;
    font-style: normal;
    font-weight: 800;
    white-space: nowrap;
}
.admin-home-section-heading > button { cursor: pointer; }

.admin-home-modules { min-height: 0; }
.admin-home-modules .admin-home-section-heading { margin-bottom: 10px; }
.admin-home-module-grid { gap: 9px; margin-top: 0; }
.admin-home-module-grid > button { border-radius: 5px; }
.admin-home-module-copy { grid-template-columns: minmax(0, 1fr); padding: 14px; }
.admin-home-module-copy b { font-size: 16px; }
.admin-home-module-copy small { max-width: none; font-size: 10px; }
.admin-home-module-copy em { display: none; }

.admin-home-resource-grid {
    min-width: 0;
    min-height: 0;
    display: grid;
    grid-template-columns: minmax(290px, .78fr) minmax(330px, 1fr) minmax(420px, 1.3fr);
}
.admin-home-resource {
    min-width: 0;
    min-height: 0;
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 0 24px;
    overflow: hidden;
    border-left: 1px solid rgba(96, 108, 56, .2);
}
.admin-home-resource:first-child { padding-left: 0; border-left: 0; }
.admin-home-resource:last-child { padding-right: 0; }
.admin-home-resource > .admin-home-section-heading { margin-bottom: 1px; }

.admin-home-key-metrics {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    padding: 8px 0;
    background: rgba(212, 184, 149, .16);
    border-radius: 5px;
}
.admin-home-key-metrics > span { min-width: 0; padding: 2px 10px; border-left: 1px solid rgba(96, 108, 56, .14); border-radius: 3px; transition: color 360ms ease, background-color 360ms ease, transform 360ms ease; }
.admin-home-key-metrics > span:first-child { border-left: 0; }
.admin-home-key-metrics > span:hover { color: #35432b; background: rgba(232, 220, 199, .42); transform: translateY(-2px); }
.admin-home-key-metrics small { display: block; overflow: hidden; color: #777250; font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.admin-home-key-metrics b { color: #425035; font-size: 20px; font-variant-numeric: tabular-nums; }
.admin-home-key-metrics em { margin-left: 3px; color: #747152; font-size: 9px; font-style: normal; }
.admin-home-route-overview .admin-home-key-metrics b { font-size: 18px; }
.admin-home-node-overview .admin-home-key-metrics,
.admin-home-heritage-overview .admin-home-key-metrics { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.admin-home-node-overview .admin-home-key-metrics > span,
.admin-home-heritage-overview .admin-home-key-metrics > span { padding-right: 7px; padding-left: 7px; }
.admin-home-node-overview .admin-home-key-metrics b,
.admin-home-heritage-overview .admin-home-key-metrics b { font-size: 18px; }

.admin-home-chart-block { min-width: 0; min-height: 0; display: grid; grid-template-rows: auto minmax(0, 1fr); gap: 5px; border-radius: 5px; transition: transform 360ms ease; }
.admin-home-chart-block:hover { transform: translateY(-2px); }
.admin-home-chart-block h4 {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 0;
    color: #596244;
    font-family: "Songti SC", "STSong", serif;
    font-size: 12px;
    font-weight: 700;
}
.admin-home-chart-block h4::after { content: ""; height: 1px; flex: 1; background: rgba(96, 108, 56, .14); }

.admin-home-route-trend { min-height: 128px; }
.admin-home-route-support { min-width: 0; min-height: 104px; display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: 10px; margin-top: 26px; padding-top: 8px; border-top: 1px solid rgba(96, 108, 56, .14); }
.admin-home-route-support > .admin-home-chart-block + .admin-home-chart-block { padding-left: 10px; border-left: 1px solid rgba(96, 108, 56, .14); }
.admin-home-route-support > .admin-home-quality { padding-top: 0; border-top: 0; }
.admin-home-line-chart { min-width: 0; min-height: 0; display: grid; grid-template-rows: minmax(76px, 1fr) auto; }
.admin-home-line-chart svg { width: 100%; height: 100%; overflow: visible; transition: transform 380ms ease; }
.admin-home-line-area { fill: rgba(192, 142, 58, .12); }
.admin-home-line-curve { fill: none; stroke: var(--admin-ochre); stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; transition: stroke-width 360ms ease; }
.admin-home-line-chart circle { fill: var(--admin-sand); stroke: var(--admin-ochre); stroke-width: 1.8; transform-box: fill-box; transform-origin: center; transition: transform 360ms ease, fill 360ms ease; }
.admin-home-chart-block:hover .admin-home-line-chart svg { transform: translateY(-2px); }
.admin-home-chart-block:hover .admin-home-line-curve { stroke-width: 2.7; }
.admin-home-chart-block:hover .admin-home-line-chart circle { fill: var(--admin-oat); transform: scale(1.25); }
.admin-home-line-chart > div { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.admin-home-line-chart > div span { min-width: 0; display: grid; justify-items: center; gap: 1px; }
.admin-home-line-chart > div b { color: #586146; font-family: "Songti SC", "STSong", serif; font-size: 10px; font-weight: 900; }
.admin-home-line-chart > div small { color: #6d6d4b; font-size: 8px; font-weight: 800; font-variant-numeric: tabular-nums; white-space: nowrap; }

.admin-home-bars { min-width: 0; display: grid; align-content: center; gap: 6px; }
.admin-home-bars > button { min-width: 0; display: grid; gap: 4px; padding: 2px 0; border: 0; border-radius: 8px; color: inherit; text-align: left; background: transparent; cursor: pointer; transition: background-color 360ms ease, transform 360ms ease; }
.admin-home-bars > button:hover { background: rgba(212, 184, 149, .15); transform: translateX(4px); }
.admin-home-bars > button > span { min-width: 0; display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.admin-home-bars b { overflow: hidden; color: #536043; font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.admin-home-bars small { color: #6e7051; font-size: 9px; font-weight: 800; font-variant-numeric: tabular-nums; }
.admin-home-bars button > i { height: 7px; overflow: hidden; border-radius: 8px; background: rgba(96, 108, 56, .1); }
.admin-home-bars button > i em { display: block; height: 100%; border-radius: inherit; background: var(--bar-color); transition: width 480ms ease, filter 360ms ease; }
.admin-home-bars > button:hover > i em { filter: saturate(1.25) brightness(1.08); }

.admin-home-field-bars { display: grid; grid-template-columns: 1fr; gap: 5px; padding: 0; border: 0; }
.admin-home-field-bars > div { min-width: 0; display: grid; grid-template-columns: 30px minmax(0, 1fr) 34px; align-items: center; gap: 5px; border-radius: 4px; transition: background-color 360ms ease, transform 360ms ease; }
.admin-home-field-bars > div:hover { background: rgba(212, 184, 149, .16); transform: translateX(3px); }
.admin-home-field-bars span,
.admin-home-field-bars b { color: #6d7050; font-size: 9px; }
.admin-home-field-bars b { text-align: right; font-variant-numeric: tabular-nums; }
.admin-home-field-bars i { height: 5px; overflow: hidden; border-radius: 5px; background: rgba(96, 108, 56, .1); }
.admin-home-field-bars em { display: block; height: 100%; border-radius: inherit; background: var(--admin-sage); transition: filter 360ms ease; }
.admin-home-field-bars > div:hover em { filter: saturate(1.3) brightness(1.04); }

.admin-home-quality { padding-top: 6px; border-top: 1px solid rgba(96, 108, 56, .14); }
.admin-home-quality-content { min-width: 0; display: grid; grid-template-columns: 72px minmax(0, 1fr); align-items: center; gap: 9px; }
.admin-home-completeness {
    width: 68px;
    height: 68px;
    display: grid;
    place-content: center;
    justify-items: center;
    border-radius: 50%;
    background: radial-gradient(circle, var(--admin-sand) 59%, transparent 60%), conic-gradient(var(--admin-moss) calc(var(--quality-rate) * 1%), rgba(96, 108, 56, .13) 0);
    transition: filter 380ms ease, transform 380ms ease;
}
.admin-home-quality:hover .admin-home-completeness { filter: saturate(1.2); transform: rotate(-3deg) scale(1.05); }
.admin-home-completeness > div { display: flex; align-items: baseline; }
.admin-home-completeness strong { max-width: 45px; overflow: hidden; color: #425035; font-size: 14px; line-height: 1; font-variant-numeric: tabular-nums; }
.admin-home-completeness small { margin-left: 1px; color: #68704c; font-size: 7px; }
.admin-home-completeness > span { color: #747152; font-size: 8px; }

.admin-home-overview-upper { min-width: 0; display: grid; grid-template-columns: minmax(0, 3fr) minmax(190px, 2fr); align-items: stretch; gap: 14px; padding: 5px 0 8px; border-bottom: 1px solid rgba(96, 108, 56, .14); }
.admin-home-node-overview > .admin-home-overview-upper,
.admin-home-heritage-layout > .admin-home-overview-upper { min-height: 142px; box-sizing: border-box; }
.admin-home-type-panel { align-content: start; }
.admin-home-overview-upper > .admin-home-quality { padding: 0 0 0 13px; border-top: 0; border-left: 1px solid rgba(96, 108, 56, .14); }
.admin-home-type-chart { min-width: 0; display: grid; grid-template-columns: 112px minmax(0, 250px); align-items: center; justify-content: start; gap: 8px; padding: 0; border: 0; }
.admin-home-type-donut { position: relative; display: grid; min-height: 108px; place-items: center; }
.admin-home-type-donut .buffer-interactive-donut { width: 106px; }
.admin-home-type-donut .buffer-donut-track { stroke-width: 30; }
.admin-home-type-donut .buffer-donut-segment { stroke-width: 30; }
.admin-home-type-donut .buffer-donut-segment.is-active { stroke-width: 39; }
.admin-home-type-donut .buffer-donut-label { width: 48%; color: #425035; font-size: 10px; }
.admin-home-donut-default { position: absolute; z-index: 1; display: grid; width: 50px; place-items: center; pointer-events: none; transition: opacity 250ms ease, transform 360ms ease; }
.admin-home-donut-default strong { color: #425035; font-size: 15px; line-height: 1; }
.admin-home-donut-default small { max-width: 46px; margin-top: 3px; overflow: hidden; color: #596244; font-size: 9px; font-weight: 900; line-height: 1.1; text-align: center; white-space: nowrap; }
.admin-home-type-donut .buffer-interactive-donut.has-active + .admin-home-donut-default { opacity: 0; transform: scale(.88); }
.admin-home-type-legend { min-width: 0; display: grid; grid-auto-flow: column; grid-template-columns: repeat(2, minmax(88px, 112px)); grid-template-rows: repeat(5, minmax(19px, auto)); justify-content: start; gap: 1px 5px; }
.admin-home-type-legend button { min-width: 0; display: grid; grid-template-columns: 7px minmax(0, 1fr) auto; align-items: center; gap: 5px; padding: 2px 3px; border: 0; border-radius: 4px; color: inherit; background: transparent; text-align: left; cursor: pointer; transition: background-color 320ms ease, transform 320ms ease; }
.admin-home-type-legend button:hover,
.admin-home-type-legend button.is-active { background: rgba(139, 157, 131, .18); transform: translateX(2px); }
.admin-home-type-legend i { width: 6px; height: 6px; border-radius: 50%; }
.admin-home-type-legend span { overflow: hidden; color: #64694b; font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.admin-home-type-legend b { color: #4f5c40; font-size: 9px; font-variant-numeric: tabular-nums; }

.admin-home-spatial-grid { min-width: 0; min-height: 0; display: grid; flex: 1 1 auto; grid-template-columns: minmax(0, 1.45fr) minmax(165px, .55fr); align-items: stretch; gap: 12px; }
.admin-home-spatial-stat { align-content: start; padding-left: 12px; border-left: 1px solid rgba(96, 108, 56, .14); }
.admin-home-heritage-layout {
    min-width: 0;
    min-height: 0;
    display: grid;
    flex: 1 1 auto;
    grid-template-columns: minmax(0, 1.72fr) minmax(190px, .58fr);
    grid-template-rows: auto minmax(0, 1fr);
    gap: 10px 12px;
}
.admin-home-heritage-layout > .admin-home-overview-upper {
    grid-column: 1;
    grid-row: 1;
    grid-template-columns: minmax(0, 1.2fr) minmax(190px, .8fr);
    gap: 8px;
    padding: 5px 0 8px;
}
.admin-home-heritage-spatial-grid { min-width: 0; min-height: 0; display: grid; grid-column: 1; grid-row: 2; grid-template-columns: minmax(0, 2.3fr) minmax(145px, .9fr); gap: 10px; }
.admin-home-heritage-spatial-grid > .admin-home-national-map { min-width: 0; }
.admin-home-heritage-corridor-stat { align-content: start; }
.admin-home-heritage-layout > .admin-home-heritage-period-stat {
    grid-column: 2;
    grid-row: 1 / 3;
    align-content: stretch;
}
.admin-home-heritage-layout .admin-home-type-legend { grid-template-columns: repeat(2, minmax(70px, 78px)); gap: 0; }
.admin-home-heritage-layout .admin-home-type-legend button { grid-template-columns: 6px auto 22px; justify-content: start; gap: 3px; padding-right: 1px; padding-left: 1px; }
.admin-home-heritage-layout .admin-home-type-legend b { text-align: left; }
.admin-home-heritage-layout .admin-home-overview-upper > .admin-home-quality { padding-left: 8px; }
.admin-home-heritage-period-stat .admin-home-period-bars { align-content: space-between; }
.admin-home-national-map { min-height: 0; }
.admin-home-map-defs { position: absolute; width: 0; height: 0; overflow: hidden; }
.admin-home-map-canvas { position: relative; min-height: 0; overflow: hidden; border: 1px solid rgba(96, 108, 56, .28); border-radius: 5px; background: rgba(232, 220, 199, .7); }
.admin-home-map-canvas svg { display: block; width: 100%; height: 100%; min-height: 112px; }
.admin-home-provinces { fill: none; stroke: #69724f; stroke-width: .9; stroke-linecap: round; stroke-linejoin: round; opacity: .62; vector-effect: non-scaling-stroke; transition: opacity 360ms ease; }
.admin-home-map-canvas:hover .admin-home-provinces { opacity: .78; }
.admin-home-map-points circle { fill: #34584e; stroke: rgba(232, 220, 199, .86); stroke-width: .34; opacity: .9; vector-effect: non-scaling-stroke; transform-box: fill-box; transform-origin: center; transition: opacity 300ms ease, transform 300ms ease, filter 300ms ease; }
.admin-home-map-points.is-heritage circle { fill: #b45f3f; stroke: rgba(232, 220, 199, .82); opacity: .78; }
.admin-home-map-points circle:hover { opacity: 1; transform: scale(3.2); }

.admin-home-period-bars { display: grid; align-content: center; gap: 8px; }
.admin-home-period-bars button { min-width: 0; display: grid; gap: 4px; padding: 2px 0; border: 0; border-radius: 4px; color: inherit; background: transparent; text-align: left; cursor: pointer; transition: background-color 320ms ease, transform 320ms ease; }
.admin-home-period-bars button:hover { background: rgba(139, 157, 131, .15); transform: translateX(3px); }
.admin-home-period-bars span { display: flex; align-items: center; justify-content: space-between; gap: 6px; }
.admin-home-period-bars b { color: #596244; font-size: 10px; }
.admin-home-period-bars small { color: #6e7051; font-size: 9px; font-weight: 800; }
.admin-home-period-bars i { height: 6px; overflow: hidden; border-radius: 4px; background: rgba(96, 108, 56, .1); }
.admin-home-period-bars em { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, var(--admin-ochre), var(--admin-clay)); transition: width 420ms ease, filter 320ms ease; }
.admin-home-period-bars button:hover em { filter: saturate(1.2); }
.admin-home-period-bars.is-dense { gap: 2px; }
.admin-home-period-bars.is-dense button { grid-template-columns: 36px minmax(0, 1fr) 44px; align-items: center; gap: 5px; padding: 1px 0; }
.admin-home-period-bars.is-dense span { display: contents; }
.admin-home-period-bars.is-dense b,
.admin-home-period-bars.is-dense small { font-size: 9px; }
.admin-home-period-bars.is-dense b { grid-column: 1; }
.admin-home-period-bars.is-dense i { grid-column: 2; grid-row: 1; width: 100%; }
.admin-home-period-bars.is-dense small { grid-column: 3; grid-row: 1; text-align: right; white-space: nowrap; }
.admin-home-period-bars.is-dense i { height: 4px; }

@keyframes admin-home-breathe {
    0%, 100% { box-shadow: 0 0 0 5px rgba(139, 157, 131, .1); }
    50% { box-shadow: 0 0 0 8px rgba(139, 157, 131, .035); }
}
@keyframes admin-home-module-enter {
    from { opacity: 0; transform: translateY(12px) scale(.98); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}

@media (max-width: 1500px) {
    .admin-home-hero {
        --admin-home-map-control-bottom: 12px;
        --admin-home-map-toolbar-right: 14px;
    }
    .admin-home-hero-tools { top: 12px; right: 14px; }
    .admin-home-lower { grid-template-columns: minmax(200px, .62fr) minmax(0, 4.9fr); gap: 20px; padding: 18px 18px 22px; }
    .admin-home-insights { grid-template-columns: 1fr; grid-template-rows: minmax(0, 1fr); }
    .admin-home-resource-grid { grid-template-columns: minmax(250px, .78fr) minmax(290px, 1fr) minmax(370px, 1.3fr); }
    .admin-home-resource { padding: 0 18px; }
    .admin-home-overview-upper { grid-template-columns: minmax(0, 3fr) minmax(165px, 2fr); gap: 9px; }
    .admin-home-type-chart { grid-template-columns: 92px minmax(0, 1fr); gap: 5px; }
    .admin-home-type-donut .buffer-interactive-donut { width: 88px; }
    .admin-home-type-legend { grid-template-columns: repeat(2, minmax(60px, 1fr)); gap: 1px 3px; }
    .admin-home-spatial-grid { grid-template-columns: minmax(0, 1.35fr) minmax(145px, .65fr); gap: 9px; }
    .admin-home-heritage-layout { grid-template-columns: minmax(0, 1.65fr) minmax(178px, .62fr); gap: 9px; }
    .admin-home-heritage-layout > .admin-home-overview-upper { grid-template-columns: minmax(0, 1.2fr) minmax(165px, .8fr); gap: 6px; }
    .admin-home-heritage-spatial-grid { grid-template-columns: minmax(0, 2.2fr) minmax(130px, .8fr); gap: 8px; }
}

@media (max-width: 1180px) {
    .admin-home-page { height: auto; overflow: visible; }
    .admin-home-hero { min-height: 520px; }
    .admin-home-sync { display: none; }
    .admin-home-lower { grid-template-columns: 1fr; grid-template-rows: 260px minmax(640px, auto); padding: 18px; }
    .admin-home-insights {
        grid-template-columns: 1fr;
        grid-template-rows: minmax(0, 1fr);
        grid-template-areas: none;
    }
    .admin-home-resource-grid { grid-template-columns: minmax(0, .78fr) minmax(0, 1fr) minmax(0, 1.3fr); }
    .admin-home-modules { min-height: 260px; }
    .admin-home-module-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); grid-template-rows: 1fr; }
}

@media (max-width: 760px) {
    .admin-home-page { display: block; }
    .admin-home-hero {
        --admin-home-map-control-bottom: 14px;
        min-height: 720px;
    }
    .admin-home-map-shade { background: linear-gradient(180deg, rgba(38, 50, 31, .18), rgba(38, 50, 31, .82) 52%, rgba(38, 50, 31, .94)); }
    .admin-home-hero-copy { top: auto; right: 14px; bottom: 70px; left: 14px; width: auto; padding: 24px 20px; transform: none; }
    .admin-home-hero-tools { left: 12px; right: 12px; justify-content: flex-end; }
    .admin-home-map-legend {
        right: calc(var(--admin-home-map-toolbar-right) + var(--admin-home-map-toolbar-width) + var(--admin-home-map-control-gap));
        left: 14px;
        justify-content: center;
        gap: 10px;
        padding-right: 10px;
        padding-left: 10px;
    }
    .admin-home-lower { display: grid; grid-template-columns: 1fr; grid-template-rows: 520px auto; gap: 18px; padding: 16px; }
    .admin-home-insights { display: grid; grid-template-columns: 1fr; grid-template-rows: auto; grid-template-areas: none; }
    .admin-home-resource-grid { grid-template-columns: 1fr; gap: 24px; }
    .admin-home-resource,
    .admin-home-resource:first-child,
    .admin-home-resource:last-child { min-height: 520px; padding: 24px 0 0; border-left: 0; border-top: 1px solid rgba(96, 108, 56, .2); }
    .admin-home-spatial-grid { min-height: 190px; }
    .admin-home-heritage-layout { grid-template-columns: 1fr; grid-template-rows: auto minmax(190px, 1fr) auto; }
    .admin-home-heritage-layout > .admin-home-overview-upper,
    .admin-home-heritage-layout > .admin-home-heritage-spatial-grid,
    .admin-home-heritage-layout > .admin-home-heritage-period-stat { grid-column: 1; }
    .admin-home-heritage-layout > .admin-home-overview-upper { min-height: 0; grid-row: 1; grid-template-columns: minmax(0, 3fr) minmax(190px, 2fr); }
    .admin-home-heritage-layout > .admin-home-heritage-spatial-grid { grid-row: 2; grid-template-columns: minmax(0, 1.45fr) minmax(145px, .55fr); }
    .admin-home-heritage-layout > .admin-home-heritage-period-stat { grid-row: 3; padding: 14px 0 0; border-top: 1px solid rgba(96, 108, 56, .14); border-left: 0; }
    .admin-home-panel,
    .admin-home-modules { grid-column: auto; min-height: 300px; }
    .admin-home-modules { min-height: 520px; }
    .admin-home-module-grid { grid-template-columns: 1fr; grid-template-rows: repeat(3, minmax(0, 1fr)); }
}

@media (prefers-reduced-motion: reduce) {
    .admin-home-sync > i,
    .admin-home-module-grid > button { animation: none; }
    .admin-home-key-metrics > span,
    .admin-home-chart-block,
    .admin-home-bars > button,
    .admin-home-field-bars > div,
    .admin-home-completeness,
    .admin-home-type-legend button,
    .admin-home-donut-default,
    .admin-home-map-points circle,
    .admin-home-period-bars button { transition: none; }
}