:root {
    --ink: #172a31;
    --ink2: #344b52;
    --muted: #728288;
    --line: #dce4e1;
    --paper: #f4f7f5;
    --white: #fff;
    --navy: #0b2028;
    --navy2: #12323a;
    --teal: #83bdb5;
    --teal2: #2d6865;
    --copper: #c58d69;
    --mono: "DM Mono", monospace;
    --sans: "DM Sans", sans-serif;
    --display: "Manrope", sans-serif;
    --ease: cubic-bezier(0.2, 0.75, 0.25, 1);
    --max: 1360px;
    --gutter: clamp(20px, 5vw, 78px);
}
* {
    box-sizing: border-box;
}
html {
    scroll-behavior: smooth;
    scroll-padding-top: 100px;
}
body {
    margin: 0;
    background: var(--paper);
    color: var(--ink);
    font-family: var(--sans);
    -webkit-font-smoothing: antialiased;
    overflow-x: hidden;
}
body.lock {
    overflow: hidden;
}
a {
    color: inherit;
    text-decoration: none;
}
button,
input,
select,
textarea {
    font: inherit;
}
button {
    cursor: pointer;
}
::selection {
    background: #c3ded8;
    color: var(--ink);
}
#particleLayer {
    position: fixed;
    inset: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    z-index: 850;
    mix-blend-mode: screen;
    opacity: 0.9;
}
.scroll-progress {
    position: fixed;
    z-index: 1100;
    top: 0;
    left: 0;
    width: 0;
    height: 2px;
    background: linear-gradient(90deg, var(--teal), var(--copper));
    box-shadow: 0 0 14px #80c3bd66;
}
.topline {
    min-height: 30px;
    padding: 0 var(--gutter);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    background: #06171e;
    color: #a9b9bb;
    font: 9px var(--mono);
    letter-spacing: 0.045em;
}
.topline-right {
    display: flex;
    gap: 20px;
    align-items: center;
}
.topline a {
    transition: color 0.2s;
}
.topline a:hover {
    color: #fff;
}
.masthead {
    height: 82px;
    position: sticky;
    top: 0;
    z-index: 500;
    background: rgba(249, 251, 249, 0.95);
    backdrop-filter: blur(18px);
    border-bottom: 1px solid #dfe6e3;
    transition: box-shadow 0.3s;
}
.masthead.scrolled {
    box-shadow: 0 10px 30px #10283213;
}
.nav-wrap {
    max-width: var(--max);
    height: 100%;
    margin: auto;
    padding: 0 var(--gutter);
    display: flex;
    align-items: center;
    gap: 28px;
}
.brand {
    display: flex;
    align-items: center;
    gap: 12px;
    min-width: 270px;
}
.brand-mark {
    position: relative;
    width: 42px;
    height: 42px;
    border: 1px solid #567571;
    display: grid;
    place-items: center;
    overflow: hidden;
    color: var(--ink);
    font: 700 10px var(--mono);
    letter-spacing: -0.06em;
}
.brand-mark:before,
.brand-mark:after {
    content: "";
    position: absolute;
    width: 56px;
    height: 17px;
    border: 1px solid #80aaa5;
    border-radius: 50%;
    transform: rotate(-35deg);
}
.brand-mark:after {
    width: 49px;
    height: 25px;
    border-color: var(--copper);
    transform: rotate(36deg);
}
.brand-mark span {
    position: relative;
    z-index: 1;
}
.brand-copy strong {
    display: block;
    font: 700 10px/1.25 var(--display);
    letter-spacing: 0.025em;
}
.brand-copy small {
    display: block;
    margin-top: 4px;
    color: #75848a;
    font: 8px var(--mono);
    letter-spacing: 0.08em;
    text-transform: uppercase;
}
.main-nav {
    display: flex;
    align-items: center;
    gap: clamp(12px, 1.55vw, 24px);
    margin-left: auto;
}
.nav-link,
.nav-trigger {
    position: relative;
    border: 0;
    background: none;
    padding: 13px 0;
    color: #52636a;
    font-size: 10px;
    font-weight: 700;
    white-space: nowrap;
    transition: color 0.2s;
}
.nav-link:after,
.nav-trigger:after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 5px;
    width: 0;
    height: 1px;
    background: var(--teal2);
    transition: width 0.28s;
}
.nav-link:hover,
.nav-trigger:hover,
.nav-trigger[aria-expanded="true"] {
    color: var(--ink);
}
.nav-link:hover:after,
.nav-trigger:hover:after,
.nav-trigger[aria-expanded="true"]:after {
    width: 100%;
}
.nav-trigger:after {
    display: none;
}
.nav-trigger .chev {
    display: inline-block;
    margin-left: 4px;
    color: #82918f;
    transition: transform 0.25s;
}
.nav-trigger[aria-expanded="true"] .chev {
    transform: rotate(180deg);
}
.nav-actions {
    display: flex;
    align-items: center;
    gap: 8px;
}
.icon-button {
    width: 36px;
    height: 36px;
    display: grid;
    place-items: center;
    border: 1px solid #d9e2de;
    background: transparent;
    color: var(--ink);
    transition: all 0.24s;
}
.icon-button:hover {
    background: var(--navy);
    border-color: var(--navy);
    color: #fff;
    transform: translateY(-2px);
}
.submit-button {
    height: 37px;
    display: inline-flex;
    align-items: center;
    gap: 9px;
    padding: 0 13px;
    background: var(--navy);
    border: 1px solid var(--navy);
    color: #fff;
    font-size: 9px;
    font-weight: 700;
    white-space: nowrap;
    transition: all 0.24s;
}
.submit-button:hover {
    background: #20545a;
    border-color: #20545a;
    transform: translateY(-2px);
}
.menu-toggle {
    display: none;
}
.mega-wrap {
    position: absolute;
    left: 0;
    right: 0;
    top: 100%;
    padding: 0 var(--gutter);
    pointer-events: none;
}
.mega {
    max-width: var(--max);
    margin: 0 auto;
    background: #fbfcfb;
    border: 1px solid var(--line);
    box-shadow: 0 20px 50px #0c20281d;
    padding: 25px 30px 28px;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 26px;
    opacity: 0;
    visibility: hidden;
    transform: translateY(-9px);
    transition: all 0.25s var(--ease);
    pointer-events: auto;
}
.mega.open {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}
.mega-col {
    min-width: 0;
}
.mega-title {
    display: flex;
    align-items: center;
    gap: 9px;
    padding-bottom: 12px;
    border-bottom: 1px solid var(--line);
    color: #748389;
    font: 9px var(--mono);
    letter-spacing: 0.1em;
    text-transform: uppercase;
}
.mega-title i {
    width: 6px;
    height: 6px;
    background: var(--copper);
    border-radius: 50%;
}
.mega-list {
    display: grid;
    gap: 2px;
    padding-top: 10px;
}
.mega-list a {
    display: flex;
    justify-content: space-between;
    gap: 8px;
    padding: 8px 0;
    color: #31474e;
    font-size: 11px;
    transition:
        color 0.18s,
        padding 0.18s;
}
.mega-list a:after {
    content: "↗";
    color: #91a19e;
    opacity: 0;
    transform: translateX(-4px);
    transition: all 0.18s;
}
.mega-list a:hover {
    padding-left: 5px;
    color: #1f6864;
}
.mega-list a:hover:after {
    opacity: 1;
    transform: translateX(0);
}
/* mobile drawer */
.drawer-backdrop {
    position: fixed;
    inset: 0;
    z-index: 700;
    background: #06171dc9;
    opacity: 0;
    visibility: hidden;
    transition: all 0.25s;
}
.drawer-backdrop.open {
    opacity: 1;
    visibility: visible;
}
.drawer {
    position: absolute;
    right: 0;
    top: 0;
    bottom: 0;
    width: min(470px, 92vw);
    overflow: auto;
    background: #f7faf8;
    padding: 22px 24px 32px;
    transform: translateX(30px);
    transition: transform 0.3s;
}
.drawer-backdrop.open .drawer {
    transform: translateX(0);
}
.drawer-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-bottom: 18px;
    border-bottom: 1px solid var(--line);
}
.drawer-group {
    padding: 18px 0;
    border-bottom: 1px solid var(--line);
}
.drawer-group h4 {
    margin: 0 0 10px;
    color: #7b8b8e;
    font: 9px var(--mono);
    letter-spacing: 0.1em;
    text-transform: uppercase;
}
.drawer-links {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 7px 16px;
}
.drawer-links a {
    padding: 7px 0;
    color: #2e464d;
    font-size: 11px;
}
.drawer-links a:hover {
    color: #236b66;
}
.drawer-foot {
    display: flex;
    gap: 9px;
    margin-top: 20px;
}
#app {
    min-height: 65vh;
}
.page-transition {
    animation: pageIn 0.58s var(--ease) both;
}
@keyframes pageIn {
    from {
        opacity: 0;
        transform: translateY(15px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}
/* home hero */
.hero {
    position: relative;
    min-height: 640px;
    height: min(760px, calc(100svh - 112px));
    isolation: isolate;
    overflow: hidden;
    background: var(--navy);
    color: #f4f8f6;
    display: flex;
    align-items: center;
}
.hero canvas {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    z-index: -2;
}
.hero:before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    pointer-events: none;
    background:
        linear-gradient(
            90deg,
            #0b2028 0%,
            rgba(11, 32, 40, 0.95) 31%,
            rgba(11, 32, 40, 0.58) 66%,
            rgba(11, 32, 40, 0.22) 100%
        ),
        linear-gradient(0deg, #0b202866, transparent 50%);
}
.hero:after {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    z-index: -1;
    opacity: 0.09;
    background-image: radial-gradient(#c9e1dd 0.55px, transparent 0.55px);
    background-size: 5px 5px;
    mask-image: linear-gradient(90deg, transparent 4%, #000 100%);
}
.hero-inner {
    width: 100%;
    max-width: var(--max);
    margin: auto;
    padding: 80px var(--gutter) 95px;
    display: grid;
    grid-template-columns: minmax(0, 1.13fr) minmax(290px, 0.7fr);
    align-items: end;
    gap: 7vw;
}
.hero-copy {
    max-width: 800px;
}
.hero-label {
    display: flex;
    align-items: center;
    gap: 11px;
    color: #a7c9c5;
    font: 9px var(--mono);
    letter-spacing: 0.13em;
    text-transform: uppercase;
}
.hero-label:before {
    content: "";
    width: 23px;
    height: 1px;
    background: var(--copper);
}
.hero h1 {
    margin: 25px 0 0;
    max-width: 790px;
    font: 500 clamp(42px, 5.5vw, 77px)/1.08 var(--display);
    letter-spacing: -0.065em;
}
.hero h1 span {
    display: block;
    color: #b9d6d2;
    font-family: Georgia, serif;
    font-weight: 400;
    font-style: italic;
    letter-spacing: -0.055em;
}
.hero-rule {
    width: 76px;
    height: 1px;
    margin: 30px 0 22px;
    background: linear-gradient(90deg, var(--copper), transparent);
}
.hero-cta {
    display: inline-flex;
    align-items: center;
    gap: 18px;
    color: #eef5f3;
    font-size: 11px;
    font-weight: 700;
    transition:
        gap 0.25s,
        color 0.25s;
}
.hero-cta:hover {
    gap: 26px;
    color: #a8d6d0;
}
.hero-cta small {
    color: #a4b3b7;
    font: 9px var(--mono);
    letter-spacing: 0.08em;
}
.hero-issue {
    justify-self: end;
    width: min(100%, 330px);
    position: relative;
    padding: 25px 26px 23px;
    border: 1px solid #d7ebe535;
    background: linear-gradient(140deg, #ffffff12, #ffffff04);
    backdrop-filter: blur(13px);
    box-shadow: 0 25px 75px #0003;
    transform: translateZ(0);
    transition:
        transform 0.35s var(--ease),
        border-color 0.25s;
}
.hero-issue:hover {
    border-color: #9bc9c477;
}
.hero-issue-top {
    display: flex;
    justify-content: space-between;
    color: #b3c2c4;
    font: 9px var(--mono);
    letter-spacing: 0.1em;
    text-transform: uppercase;
}
.hero-issue-volume {
    margin: 22px 0 0;
    font: 500 78px/0.95 var(--display);
    letter-spacing: -0.09em;
    color: #f4f7f6;
}
.hero-issue-volume small {
    font: 400 12px var(--mono);
    letter-spacing: 0.04em;
    color: #98b4b2;
    margin-left: 9px;
}
.hero-issue-date {
    margin-top: 9px;
    color: #bbcacb;
    font-size: 12px;
}
.hero-issue-line {
    height: 1px;
    margin: 22px 0 15px;
    background: #dcebe52c;
}
.hero-issue-bottom {
    display: flex;
    justify-content: space-between;
    gap: 14px;
    color: #9cafb1;
    font: 9px var(--mono);
}
.hero-issue-bottom a {
    color: #b6d8d4;
}
.hero-footnote {
    position: absolute;
    bottom: 25px;
    left: var(--gutter);
    color: #90a4a5;
    font: 8px var(--mono);
    letter-spacing: 0.12em;
    text-transform: uppercase;
}
.hero-coordinate {
    position: absolute;
    bottom: 25px;
    right: var(--gutter);
    color: #8da1a3;
    font: 8px var(--mono);
    letter-spacing: 0.1em;
    opacity: 0.7;
}
.facts {
    background: #fff;
    border-bottom: 1px solid var(--line);
}
.facts-inner {
    max-width: var(--max);
    margin: auto;
    padding: 22px var(--gutter);
    display: grid;
    grid-template-columns: repeat(4, 1fr);
}
.fact {
    padding: 2px 22px;
    border-right: 1px solid var(--line);
}
.fact:first-child {
    padding-left: 0;
}
.fact:last-child {
    border: 0;
}
.fact span {
    display: block;
    color: #7e8b90;
    font: 8px var(--mono);
    letter-spacing: 0.12em;
    text-transform: uppercase;
}
.fact strong {
    display: block;
    margin-top: 7px;
    color: #23363e;
    font: 600 14px var(--display);
}
.section {
    padding: 94px var(--gutter);
}
.section-inner {
    max-width: var(--max);
    margin: auto;
}
.section-heading {
    display: flex;
    justify-content: space-between;
    align-items: end;
    gap: 30px;
    margin-bottom: 35px;
}
.section-label {
    display: block;
    margin-bottom: 11px;
    color: #74858b;
    font: 9px var(--mono);
    letter-spacing: 0.12em;
    text-transform: uppercase;
}
.section-title {
    margin: 0;
    color: var(--ink);
    font: 600 clamp(29px, 3.2vw, 45px)/1.13 var(--display);
    letter-spacing: -0.055em;
}
.section-aside {
    color: #718087;
    font: 9px var(--mono);
    white-space: nowrap;
}
.current-section {
    background: #eff3f1;
}
.current-layout {
    display: grid;
    grid-template-columns: 0.8fr 1.2fr;
    gap: clamp(45px, 8vw, 118px);
    align-items: center;
}
.cover-stage {
    min-height: 390px;
    display: grid;
    place-items: center;
    position: relative;
    perspective: 1000px;
    overflow: hidden;
    background: radial-gradient(
        ellipse at 50% 54%,
        #dce7e3 0,
        #edf1ef 44%,
        #f0f3f2 72%
    );
}
.cover-stage:before,
.cover-stage:after {
    content: "";
    position: absolute;
    width: 410px;
    height: 410px;
    border: 1px solid #a8beb822;
    border-radius: 50%;
    box-shadow:
        0 0 0 26px #8ba7a314,
        0 0 0 57px #8ba7a30d;
    animation: orbit 24s linear infinite;
}
.cover-stage:after {
    width: 300px;
    height: 300px;
    animation-direction: reverse;
    animation-duration: 31s;
}
@keyframes orbit {
    to {
        transform: rotate(360deg);
    }
}
.journal-cover {
    position: relative;
    z-index: 1;
    width: 230px;
    min-height: 315px;
    padding: 22px 19px 17px;
    background: linear-gradient(150deg, #16313a, #0c2028 70%);
    color: #edf4f1;
    box-shadow: 18px 22px 36px #142c333b;
    transform: rotateY(-9deg) rotateX(2deg);
    transition: transform 0.55s var(--ease);
    overflow: hidden;
}
.cover-stage:hover .journal-cover {
    transform: rotateY(3deg) rotateX(0) translateY(-8px);
}
.journal-cover:before {
    content: "";
    position: absolute;
    inset: 0;
    opacity: 0.5;
    background: repeating-radial-gradient(
        ellipse at 76% 62%,
        transparent 0 13px,
        #9ac4bb70 14px 15px,
        transparent 16px 26px
    );
    transform: rotate(-16deg) scale(1.4);
}
.cover-copy,
.cover-foot {
    position: relative;
    z-index: 1;
}
.cover-publisher {
    font: 6px/1.55 var(--mono);
    color: #a8c2bd;
    letter-spacing: 0.06em;
}
.cover-title {
    margin-top: 44px;
    font: 600 19px/1.13 var(--display);
    letter-spacing: -0.045em;
}
.cover-volume {
    margin-top: 13px;
    color: #b3cdc6;
    font: 7px var(--mono);
    letter-spacing: 0.09em;
}
.cover-foot {
    position: absolute;
    bottom: 17px;
    left: 19px;
    right: 19px;
    display: flex;
    align-items: end;
    justify-content: space-between;
    color: #a8c1bc;
    font: 6px/1.5 var(--mono);
}
.cover-foot strong {
    font: 500 27px var(--display);
    color: #ecf3ef;
}
.current-info h3 {
    margin: 0 0 24px;
    font: 600 clamp(25px, 3vw, 37px)/1.16 var(--display);
    letter-spacing: -0.05em;
}
.issue-data {
    border-top: 1px solid #d5dfdc;
}
.issue-data-row {
    display: grid;
    grid-template-columns: 155px 1fr;
    gap: 20px;
    padding: 14px 0;
    border-bottom: 1px solid #d5dfdc;
}
.issue-data-row span {
    color: #7d8b8f;
    font: 8px var(--mono);
    letter-spacing: 0.08em;
    text-transform: uppercase;
}
.issue-data-row strong {
    color: #354b50;
    font-size: 11px;
    font-weight: 600;
    line-height: 1.55;
}
.issue-actions {
    display: flex;
    align-items: center;
    gap: 24px;
    margin-top: 25px;
}
.primary-link {
    display: inline-flex;
    align-items: center;
    gap: 14px;
    padding: 13px 16px;
    background: var(--navy);
    border: 1px solid var(--navy);
    color: #fff;
    font-size: 10px;
    font-weight: 700;
    transition: all 0.24s;
}
.primary-link:hover {
    background: #20545a;
    transform: translateY(-2px);
}
.text-link {
    color: #3a6662;
    font-size: 10px;
    font-weight: 700;
}
.text-link:hover {
    color: #1a393b;
}
.research-section {
    background: #fff;
}
.research-tools {
    display: flex;
    gap: 9px;
    align-items: center;
}
.search-field {
    height: 42px;
    min-width: 250px;
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 0 13px;
    border: 1px solid #d8e1dd;
    background: #fbfcfb;
}
.search-field input {
    width: 100%;
    min-width: 0;
    border: 0;
    outline: 0;
    background: transparent;
    color: var(--ink);
    font-size: 10px;
}
.filter-select {
    height: 42px;
    padding: 0 12px;
    border: 1px solid #d8e1dd;
    background: #fbfcfb;
    color: #54666b;
    font-size: 10px;
}
.filter-row {
    display: flex;
    gap: 7px;
    flex-wrap: wrap;
    margin-bottom: 23px;
}
.filter-chip {
    padding: 9px 12px;
    border: 1px solid #d5dfdc;
    background: transparent;
    color: #627479;
    font-size: 9px;
    transition: all 0.2s;
}
.filter-chip:hover,
.filter-chip.active {
    background: var(--navy);
    border-color: var(--navy);
    color: #fff;
}
.result-line {
    padding: 11px 0;
    border-bottom: 1px solid var(--line);
    color: #839095;
    font: 8px var(--mono);
    letter-spacing: 0.08em;
    text-transform: uppercase;
}
.article-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    column-gap: clamp(25px, 5vw, 70px);
}
.article-card {
    position: relative;
    display: grid;
    grid-template-columns: 40px minmax(0, 1fr) 42px;
    gap: 15px;
    padding: 24px 0;
    border-bottom: 1px solid #e3e9e6;
    transition:
        transform 0.28s var(--ease),
        padding 0.28s,
        border-color 0.28s;
    transform-style: preserve-3d;
}
.article-card:hover {
    padding-left: 7px;
    border-color: #9bbcb5;
    transform: translateY(-3px);
}
.article-number {
    padding-top: 3px;
    color: #91a19f;
    font: 9px var(--mono);
}
.article-meta {
    color: #7b898d;
    font: 8px var(--mono);
    letter-spacing: 0.09em;
    text-transform: uppercase;
}
.article-content h3 {
    margin: 9px 0 9px;
    color: #233940;
    font: 600 15px/1.38 var(--display);
    letter-spacing: -0.025em;
}
.article-authors {
    color: #718086;
    font-size: 9px;
    line-height: 1.65;
}
.article-end {
    display: flex;
    align-items: center;
    justify-content: end;
}
.article-open {
    width: 34px;
    height: 34px;
    display: grid;
    place-items: center;
    border: 1px solid #dce5e1;
    background: transparent;
    color: #607a77;
    transition: all 0.22s;
}
.article-open:hover {
    background: var(--navy);
    border-color: var(--navy);
    color: white;
    transform: rotate(45deg);
}
.empty-state {
    padding: 45px 0;
    color: #7a898c;
    font-size: 12px;
    text-align: center;
    grid-column: 1/-1;
}
.archive-section {
    background: #edf2f0;
}
.archive-explorer {
    display: grid;
    grid-template-columns: 270px 1fr;
    gap: clamp(28px, 5vw, 70px);
    align-items: start;
}
.archive-periods {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 7px;
}
.period-btn {
    padding: 12px 13px;
    border: 1px solid #d4dfdb;
    background: #f8faf8;
    color: #586d70;
    text-align: left;
    font: 9px var(--mono);
    transition: all 0.2s;
}
.period-btn span {
    display: block;
    margin-top: 4px;
    color: #8c9998;
    font-size: 7px;
}
.period-btn:hover,
.period-btn.active {
    background: var(--navy);
    border-color: var(--navy);
    color: #fff;
}
.period-btn.active span,
.period-btn:hover span {
    color: #acc7c2;
}
.archive-panel {
    background: #fff;
    border: 1px solid #dce4e1;
    padding: 25px 28px;
    min-height: 330px;
}
.archive-panel-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;
    padding-bottom: 17px;
    border-bottom: 1px solid #e1e7e5;
    color: #738388;
    font: 8px var(--mono);
    letter-spacing: 0.1em;
    text-transform: uppercase;
}
.year-grid {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 8px;
    padding: 20px 0 24px;
}
.year-btn {
    min-height: 42px;
    border: 1px solid #dfe7e3;
    background: #fbfcfb;
    color: #617276;
    font: 10px var(--mono);
    transition: all 0.2s;
}
.year-btn:hover,
.year-btn.active {
    background: #18343b;
    color: #fff;
    border-color: #18343b;
    transform: translateY(-2px);
    box-shadow: 0 6px 14px #1028321a;
}
.year-btn.no-record {
    color: #a4aeab;
    background: #f6f8f6;
}
.year-btn.no-record:after {
    content: "·";
    display: block;
    color: #c58d69;
    font-size: 13px;
    line-height: 7px;
}
.archive-selection {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 20px;
    padding-top: 17px;
    border-top: 1px solid #e3e9e6;
}
.archive-selection strong {
    display: block;
    color: #263e43;
    font: 600 19px var(--display);
}
.archive-selection small {
    display: block;
    margin-top: 4px;
    color: #7e8d8d;
    font: 8px var(--mono);
    letter-spacing: 0.07em;
}
.archive-selection .text-link {
    padding: 11px 13px;
    border: 1px solid #d4dfdb;
}
.archive-note {
    margin: 15px 0 0;
    color: #829092;
    font-size: 9px;
    line-height: 1.6;
}
.archive-foot {
    display: flex;
    justify-content: flex-end;
    margin-top: 17px;
}
.archive-foot a {
    color: #3d6664;
    font-size: 10px;
    font-weight: 700;
}
.home-bottom {
    background: #fff;
}
.home-bottom-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: clamp(35px, 7vw, 100px);
}
.link-list {
    border-top: 1px solid var(--line);
}
.line-link {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    padding: 15px 0;
    border-bottom: 1px solid var(--line);
    font-size: 11px;
    font-weight: 600;
    color: #385058;
    transition:
        padding 0.2s,
        color 0.2s;
}
.line-link span {
    color: #78908c;
}
.line-link:hover {
    padding-left: 7px;
    color: #1c716a;
}
/* all inner routes */
.page-top {
    position: relative;
    overflow: hidden;
    background: var(--navy);
    color: #f3f7f5;
    padding: 58px var(--gutter) 53px;
    isolation: isolate;
}
.page-top:before {
    content: "";
    position: absolute;
    z-index: -1;
    inset: -25%;
    opacity: 0.38;
    background: repeating-radial-gradient(
        ellipse at 78% 70%,
        transparent 0 19px,
        #78aaa244 20px 21px,
        transparent 22px 38px
    );
    transform: rotate(-11deg);
    animation: contourDrift 38s linear infinite;
}
.page-top:after {
    content: "";
    position: absolute;
    z-index: -1;
    right: 10%;
    top: -90px;
    width: 370px;
    height: 370px;
    border: 1px solid #87bdb52b;
    border-radius: 50%;
    box-shadow:
        0 0 0 25px #87bdb514,
        0 0 0 55px #87bdb50b;
    animation: orbit 32s linear infinite;
}
.page-top-inner {
    max-width: var(--max);
    margin: auto;
}
.breadcrumbs {
    display: flex;
    gap: 9px;
    align-items: center;
    color: #97adad;
    font: 8px var(--mono);
    letter-spacing: 0.09em;
    text-transform: uppercase;
}
.breadcrumbs a:hover {
    color: #fff;
}
.breadcrumbs span {
    color: #c48c69;
}
.page-kicker {
    margin: 26px 0 10px;
    color: #9dc6bd;
    font: 9px var(--mono);
    letter-spacing: 0.12em;
    text-transform: uppercase;
}
.page-title {
    position: relative;
    z-index: 1;
    max-width: 850px;
    margin: 0;
    font: 600 clamp(34px, 4.3vw, 57px)/1.1 var(--display);
    letter-spacing: -0.06em;
}
.page-subtitle {
    max-width: 720px;
    margin: 15px 0 0;
    color: #b4c4c2;
    font-size: 12px;
    line-height: 1.8;
}
.page-body {
    max-width: var(--max);
    margin: auto;
    padding: 58px var(--gutter) 100px;
}
.page-layout {
    display: grid;
    grid-template-columns: 245px minmax(0, 1fr);
    gap: clamp(30px, 5vw, 75px);
    align-items: start;
}
.side-nav {
    position: sticky;
    top: 112px;
    border-top: 1px solid var(--line);
}
.side-nav-label {
    padding: 14px 0 11px;
    color: #8a9697;
    font: 8px var(--mono);
    letter-spacing: 0.1em;
    text-transform: uppercase;
}
.side-nav a {
    display: flex;
    justify-content: space-between;
    gap: 8px;
    padding: 11px 0;
    border-top: 1px solid #e3e9e6;
    color: #546a6f;
    font-size: 10px;
    transition: all 0.2s;
}
.side-nav a:after {
    content: "↗";
    color: #9aa8a4;
}
.side-nav a:hover,
.side-nav a.active {
    color: #1a6561;
    padding-left: 5px;
}
.content-column {
    min-width: 0;
}
.content-heading {
    margin: 0 0 20px;
    font: 600 27px/1.2 var(--display);
    letter-spacing: -0.045em;
}
.content-lead {
    max-width: 830px;
    color: #53666b;
    font-size: 13px;
    line-height: 1.9;
}
.content-prose {
    color: #596c71;
    font-size: 12px;
    line-height: 1.9;
}
.content-prose h3 {
    margin: 28px 0 9px;
    color: #263f46;
    font: 600 16px var(--display);
}
.content-prose p {
    margin: 0 0 15px;
}
.content-prose ul,
.content-prose ol {
    padding-left: 20px;
}
.content-prose li {
    padding: 4px 0;
}
.info-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    margin: 24px 0;
}
.info-card {
    padding: 19px 20px;
    border: 1px solid var(--line);
    background: #fff;
    transition:
        transform 0.25s,
        border-color 0.25s,
        box-shadow 0.25s;
}
.info-card:hover {
    transform: translateY(-4px);
    border-color: #9ebcb4;
    box-shadow: 0 12px 27px #17343a0d;
}
.info-card .eyebrow {
    color: #859390;
    font: 8px var(--mono);
    letter-spacing: 0.1em;
    text-transform: uppercase;
}
.info-card h3 {
    margin: 10px 0 8px;
    color: #2e464d;
    font: 600 15px var(--display);
}
.info-card p {
    margin: 0;
    color: #748388;
    font-size: 10px;
    line-height: 1.7;
}
.index-list {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
    margin-top: 25px;
}
.index-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    min-height: 62px;
    padding: 14px 15px;
    border: 1px solid var(--line);
    background: #fff;
    color: #314a50;
    font-size: 11px;
    font-weight: 600;
}
.index-item span {
    color: #88a19b;
    font: 8px var(--mono);
}
.document-list {
    border-top: 1px solid var(--line);
    margin-top: 24px;
}
.document-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    padding: 17px 0;
    border-bottom: 1px solid var(--line);
}
.document-row strong {
    display: block;
    color: #314a50;
    font-size: 11px;
}
.document-row small {
    display: block;
    margin-top: 5px;
    color: #82908f;
    font-size: 9px;
}
.document-row a {
    flex: none;
    padding: 9px 12px;
    border: 1px solid #d2ded9;
    color: #406c67;
    font-size: 9px;
    font-weight: 700;
}
.document-row a:hover {
    background: var(--navy);
    border-color: var(--navy);
    color: #fff;
}
.people-list {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
    margin-top: 23px;
}
.person {
    padding: 18px 19px;
    background: #fff;
    border: 1px solid var(--line);
}
.person strong {
    display: block;
    color: #2a4349;
    font: 600 13px var(--display);
}
.person small {
    display: block;
    margin-top: 6px;
    color: #7a898d;
    font-size: 9px;
    line-height: 1.6;
}
.person .role {
    display: inline-block;
    margin-bottom: 10px;
    color: #8a9996;
    font: 8px var(--mono);
    letter-spacing: 0.09em;
    text-transform: uppercase;
}
.stage-list {
    counter-reset: stages;
    display: grid;
    gap: 0;
    margin: 28px 0;
    border-top: 1px solid var(--line);
}
.stage {
    position: relative;
    display: grid;
    grid-template-columns: 54px 1fr;
    gap: 15px;
    padding: 21px 0;
    border-bottom: 1px solid var(--line);
    counter-increment: stages;
}
.stage:before {
    content: counter(stages, decimal-leading-zero);
    color: #8ea29e;
    font: 10px var(--mono);
    padding-top: 3px;
}
.stage h3 {
    margin: 0 0 6px;
    color: #2a4349;
    font: 600 14px var(--display);
}
.stage p {
    margin: 0;
    color: #738388;
    font-size: 10px;
    line-height: 1.75;
}
/* search/forms */
.form-panel {
    padding: 25px 27px;
    background: #fff;
    border: 1px solid var(--line);
}
.form-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
}
.field {
    display: grid;
    gap: 7px;
}
.field.full {
    grid-column: 1/-1;
}
.field label {
    color: #667a7e;
    font: 8px var(--mono);
    letter-spacing: 0.09em;
    text-transform: uppercase;
}
.field input,
.field select,
.field textarea {
    width: 100%;
    min-height: 43px;
    padding: 11px 12px;
    border: 1px solid #d9e2de;
    background: #fbfcfb;
    color: #30474d;
    outline: 0;
    font-size: 11px;
    transition:
        border-color 0.2s,
        box-shadow 0.2s;
}
.field textarea {
    min-height: 95px;
    resize: vertical;
}
.field input:focus,
.field select:focus,
.field textarea:focus {
    border-color: #6eaaa0;
    box-shadow: 0 0 0 3px #8fc3b51e;
}
.form-actions {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-top: 18px;
}
.secondary-button {
    height: 40px;
    padding: 0 14px;
    border: 1px solid #d4dfda;
    background: transparent;
    color: #456267;
    font-size: 10px;
    font-weight: 600;
}
.form-note {
    margin-top: 14px;
    color: #879493;
    font-size: 9px;
    line-height: 1.7;
}
.search-results {
    margin-top: 26px;
}
.map-panel {
    position: relative;
    min-height: 410px;
    overflow: hidden;
    border: 1px solid #d5dfdc;
    background: linear-gradient(145deg, #e6efeb, #f8faf8);
}
.map-panel svg {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
}
.map-help {
    position: absolute;
    left: 20px;
    bottom: 18px;
    max-width: 330px;
    padding: 12px 14px;
    background: #ffffffdc;
    border: 1px solid #d4dfda;
    color: #52696c;
    font-size: 9px;
    line-height: 1.6;
    backdrop-filter: blur(8px);
}
.map-marker {
    position: absolute;
    width: 14px;
    height: 14px;
    border: 2px solid #fff;
    border-radius: 50%;
    background: #c58d69;
    box-shadow: 0 0 0 5px #c58d6930;
    transform: translate(-50%, -50%);
    pointer-events: none;
}
.map-coordinates {
    margin-top: 14px;
    color: #7e8c8c;
    font: 9px var(--mono);
}
/* article modal / toast / footer */
.modal-backdrop {
    position: fixed;
    z-index: 950;
    inset: 0;
    padding: 24px;
    display: grid;
    place-items: center;
    background: #07171dd9;
    backdrop-filter: blur(9px);
    opacity: 0;
    visibility: hidden;
    transition: all 0.3s;
}
.modal-backdrop.open {
    opacity: 1;
    visibility: visible;
}
.article-modal {
    position: relative;
    width: min(760px, 100%);
    max-height: min(86vh, 900px);
    overflow: auto;
    padding: 43px 48px;
    background: #f9fbfa;
    color: var(--ink);
    transform: translateY(20px) scale(0.985);
    transition: transform 0.35s var(--ease);
}
.modal-backdrop.open .article-modal {
    transform: translateY(0) scale(1);
}
.modal-close {
    position: absolute;
    top: 19px;
    right: 19px;
    width: 34px;
    height: 34px;
    border: 1px solid #dce4e1;
    background: transparent;
    color: #53656a;
}
.modal-kicker,
.modal-label {
    color: #78888b;
    font: 9px var(--mono);
    letter-spacing: 0.1em;
    text-transform: uppercase;
}
.article-modal h2 {
    margin: 17px 0 13px;
    font: 600 clamp(23px, 3vw, 33px)/1.24 var(--display);
    letter-spacing: -0.04em;
}
.modal-authors {
    color: #68797d;
    font-size: 11px;
    line-height: 1.7;
}
.modal-divider {
    height: 1px;
    margin: 24px 0;
    background: #dce4e1;
}
.modal-abstract {
    margin-top: 10px;
    color: #45585e;
    font-size: 12px;
    line-height: 1.8;
}
.modal-tags {
    display: flex;
    gap: 7px;
    flex-wrap: wrap;
    margin-top: 11px;
}
.modal-tags span {
    padding: 6px 9px;
    background: #edf2ef;
    color: #546f6d;
    font-size: 9px;
}
.modal-meta {
    display: flex;
    gap: 18px;
    flex-wrap: wrap;
    margin-top: 20px;
    color: #718286;
    font: 9px var(--mono);
}
.modal-actions {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-top: 29px;
}
.copy-button {
    height: 42px;
    padding: 0 15px;
    border: 1px solid #d3dedb;
    background: transparent;
    color: #42605f;
    font-size: 10px;
    font-weight: 700;
}
.copy-button:hover {
    background: #edf3f1;
}
.toast {
    position: fixed;
    z-index: 1000;
    left: 50%;
    bottom: 28px;
    padding: 12px 17px;
    background: #17343b;
    color: #fff;
    font: 10px var(--mono);
    opacity: 0;
    transform: translate(-50%, 12px);
    pointer-events: none;
    transition: all 0.25s;
}
.toast.show {
    opacity: 1;
    transform: translate(-50%, 0);
}
.back-top {
    position: fixed;
    z-index: 200;
    right: 23px;
    bottom: 23px;
    width: 40px;
    height: 40px;
    display: grid;
    place-items: center;
    border: 1px solid #aebfbb;
    background: #f7faf9;
    color: #29484b;
    opacity: 0;
    visibility: hidden;
    transform: translateY(9px);
    transition: all 0.25s;
}
.back-top.visible {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}
.footer {
    background: #091920;
    color: #edf3f1;
    padding: 45px var(--gutter) 20px;
}
.footer-inner {
    max-width: var(--max);
    margin: auto;
}
.footer-main {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 40px;
    padding-bottom: 32px;
    border-bottom: 1px solid #ffffff20;
}
.footer-brand {
    display: flex;
    align-items: center;
    gap: 12px;
}
.footer-brand .brand-mark {
    border-color: #9bb5b2;
    color: #fff;
}
.footer-brand .brand-mark:after {
    border-color: var(--copper);
}
.footer-brand .brand-copy strong {
    color: #f0f5f3;
}
.footer-brand .brand-copy small {
    color: #93a6a6;
}
.footer-links {
    display: grid;
    grid-template-columns: repeat(4, auto);
    gap: 12px 23px;
    color: #b1c0bf;
    font-size: 9px;
}
.footer-links a:hover {
    color: #fff;
}
.footer-bottom {
    display: flex;
    justify-content: space-between;
    gap: 18px;
    padding-top: 17px;
    color: #809496;
    font: 8px var(--mono);
}
.reveal {
    opacity: 0;
    transform: translateY(18px);
    transition:
        opacity 0.7s var(--ease),
        transform 0.7s var(--ease);
}
.reveal.in-view {
    opacity: 1;
    transform: translateY(0);
}
@media (max-width: 1150px) {
    .brand {
        min-width: 225px;
    }
    .main-nav {
        gap: 12px;
    }
    .nav-link,
    .nav-trigger {
        font-size: 9px;
    }
    .submit-button {
        display: none;
    }
    .mega {
        grid-template-columns: repeat(3, 1fr);
    }
}
@media (max-width: 900px) {
    .main-nav {
        display: none;
    }
    .menu-toggle {
        display: grid;
    }
    .nav-wrap {
        gap: 14px;
    }
    .nav-actions {
        margin-left: auto;
    }
    .archive-explorer {
        grid-template-columns: 1fr;
    }
    .archive-periods {
        grid-template-columns: repeat(4, 1fr);
    }
    .page-layout {
        grid-template-columns: 200px 1fr;
        gap: 30px;
    }
    .index-list {
        grid-template-columns: repeat(2, 1fr);
    }
}
@media (max-width: 700px) {
    .topline {
        font-size: 7px;
    }
    .topline-left {
        max-width: 67%;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }
    .topline-right {
        gap: 8px;
    }
    .masthead {
        height: 70px;
    }
    .brand {
        min-width: 0;
    }
    .brand-mark {
        width: 37px;
        height: 37px;
    }
    .brand-copy strong {
        font-size: 9px;
    }
    .brand-copy small {
        font-size: 7px;
    }
    .nav-wrap {
        gap: 8px;
    }
    .hero {
        height: auto;
        min-height: 690px;
    }
    .hero-inner {
        display: flex;
        flex-direction: column;
        align-items: stretch;
        justify-content: center;
        gap: 38px;
        padding-top: 75px;
        padding-bottom: 95px;
    }
    .hero h1 {
        font-size: clamp(43px, 10vw, 66px);
    }
    .hero-issue {
        width: min(100%, 340px);
        padding: 20px 22px;
    }
    .hero-issue-volume {
        font-size: 65px;
    }
    .hero-coordinate {
        display: none;
    }
    .facts-inner {
        grid-template-columns: repeat(2, 1fr);
        row-gap: 16px;
    }
    .fact {
        padding: 4px 12px;
        border-right: 0;
    }
    .fact:nth-child(odd) {
        padding-left: 0;
        border-right: 1px solid var(--line);
    }
    .fact:nth-child(even) {
        padding-left: 20px;
    }
    .fact:nth-child(n + 3) {
        padding-top: 15px;
        border-top: 1px solid var(--line);
    }
    .section {
        padding: 70px var(--gutter);
    }
    .section-heading {
        display: block;
        margin-bottom: 25px;
    }
    .section-aside {
        display: block;
        margin-top: 10px;
    }
    .current-layout {
        grid-template-columns: 1fr;
        gap: 30px;
    }
    .cover-stage {
        min-height: 345px;
    }
    .journal-cover {
        width: 210px;
        min-height: 292px;
    }
    .current-info h3 {
        font-size: 29px;
    }
    .issue-data-row {
        grid-template-columns: 112px 1fr;
    }
    .research-tools {
        margin-top: 20px;
        display: flex;
        flex-direction: column;
        align-items: stretch;
    }
    .search-field {
        width: 100%;
        min-width: 0;
    }
    .filter-select {
        width: 100%;
    }
    .article-grid {
        grid-template-columns: 1fr;
    }
    .article-card {
        grid-template-columns: 30px minmax(0, 1fr) 35px;
        gap: 11px;
        padding: 20px 0;
    }
    .article-content h3 {
        font-size: 14px;
    }
    .article-authors {
        font-size: 9px;
    }
    .archive-periods {
        grid-template-columns: repeat(2, 1fr);
    }
    .archive-panel {
        padding: 19px 16px;
    }
    .year-grid {
        grid-template-columns: repeat(5, minmax(0, 1fr));
        gap: 6px;
    }
    .year-btn {
        min-height: 38px;
        font-size: 9px;
    }
    .archive-selection {
        grid-template-columns: 1fr;
        align-items: start;
    }
    .archive-selection .text-link {
        justify-self: start;
    }
    .home-bottom-grid {
        grid-template-columns: 1fr;
        gap: 35px;
    }
    .page-top {
        padding: 42px var(--gutter) 39px;
    }
    .page-layout {
        grid-template-columns: 1fr;
        gap: 25px;
    }
    .side-nav {
        position: relative;
        top: auto;
        display: flex;
        gap: 8px;
        overflow: auto;
        border: 0;
        padding-bottom: 4px;
    }
    .side-nav-label {
        display: none;
    }
    .side-nav a {
        flex: none;
        padding: 9px 11px;
        border: 1px solid var(--line);
        background: #fff;
        font-size: 9px;
        white-space: nowrap;
    }
    .side-nav a:after {
        display: none;
    }
    .page-body {
        padding-top: 38px;
    }
    .info-grid,
    .people-list {
        grid-template-columns: 1fr;
    }
    .index-list {
        grid-template-columns: 1fr 1fr;
    }
    .form-panel {
        padding: 19px;
    }
    .form-grid {
        grid-template-columns: 1fr;
    }
    .field.full {
        grid-column: auto;
    }
    .document-row {
        align-items: flex-start;
    }
    .document-row a {
        font-size: 8px;
        padding: 8px;
    }
    .footer-main {
        flex-direction: column;
    }
    .footer-links {
        grid-template-columns: repeat(2, auto);
    }
    .footer-bottom {
        flex-direction: column;
        gap: 8px;
    }
    .article-modal {
        padding: 36px 24px 28px;
    }
    .drawer-links {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 420px) {
    .brand-copy strong {
        max-width: 155px;
    }
    .hero {
        min-height: 660px;
    }
    .hero h1 {
        font-size: 41px;
    }
    .hero-issue {
        max-width: 100%;
    }
    .fact strong {
        font-size: 12px;
    }
    .index-list {
        grid-template-columns: 1fr;
    }
    .drawer-links {
        grid-template-columns: 1fr;
    }
}
@media (prefers-reduced-motion: reduce) {
    *,
    *:before,
    *:after {
        scroll-behavior: auto !important;
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }
    .reveal {
        opacity: 1;
        transform: none;
    }
    #particleLayer {
        display: none;
    }
}

/* ---------------------------------------------------------------
   Laravel build refinements · accessible navigation & richer motion
   --------------------------------------------------------------- */
:root {
    --ease-soft: cubic-bezier(0.22, 0.68, 0.25, 1);
    --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
}
#particleLayer {
    z-index: 6;
    mix-blend-mode: normal;
    opacity: 0.62;
}
.scroll-progress {
    z-index: 1200;
}
.topline {
    font-size: 10px;
}
.brand-copy strong {
    font-size: 11px;
}
.brand-copy small {
    font-size: 9px;
}
.main-nav {
    gap: clamp(13px, 1.35vw, 21px);
}
.nav-link,
.nav-trigger {
    font-size: 12px;
    padding: 16px 0;
}
.nav-actions .icon-button {
    width: 40px;
    height: 40px;
}
.submit-button {
    font-size: 11px;
    padding-inline: 15px;
}
.mega-wrap {
    z-index: 540;
    top: calc(100% - 1px);
    pointer-events: none;
}
.mega-wrap.active {
    pointer-events: auto;
}
.mega {
    position: relative;
    border-top: 2px solid #8eb9ae;
    box-shadow: 0 24px 60px #091b2130;
    transform: translateY(-7px);
    transition:
        opacity 0.28s var(--ease-soft),
        transform 0.36s var(--ease-out),
        visibility 0.28s;
}
.mega.open {
    transform: translateY(0);
}
.mega-title {
    font-size: 10px;
}
.mega-list a {
    font-size: 13px;
    line-height: 1.45;
    padding: 9px 0;
}
.drawer-head strong {
    font-size: 16px;
}
.drawer-group h4 {
    font-size: 10px;
}
.drawer-links a {
    font-size: 13px;
    line-height: 1.45;
    padding: 8px 0;
}

/* Article rows: slow background wash and a fine geological accent line. */
.article-grid {
    row-gap: 0;
}
.article-card {
    isolation: isolate;
    overflow: hidden;
    margin: 0 -13px;
    padding: 25px 13px;
    border-bottom: 1px solid #e0e8e4;
    border-radius: 2px;
    transition:
        background-color 0.68s var(--ease-soft),
        border-color 0.68s var(--ease-soft),
        transform 0.58s var(--ease-out),
        padding 0.58s var(--ease-out),
        box-shadow 0.68s var(--ease-soft);
}
.article-card:before {
    content: "";
    position: absolute;
    z-index: -1;
    inset: 0;
    background: linear-gradient(105deg, #e8f1ed 0%, #f4f7f5 54%, #eef4f1 100%);
    opacity: 0;
    transform: translateX(-10px);
    transition:
        opacity 0.72s var(--ease-soft),
        transform 0.72s var(--ease-soft);
}
.article-card:after {
    content: "";
    position: absolute;
    left: 0;
    top: 15%;
    bottom: 15%;
    width: 2px;
    background: linear-gradient(
        180deg,
        transparent,
        #7ca99f 28%,
        #c18d68 72%,
        transparent
    );
    transform: scaleY(0.2);
    transform-origin: center;
    opacity: 0;
    transition:
        transform 0.6s var(--ease-out),
        opacity 0.45s ease;
}
.article-card:hover,
.article-card:focus-within {
    padding-left: 13px;
    background-color: #edf4f0;
    border-color: #b5cbc3;
    transform: translateY(-2px);
    box-shadow: 0 10px 24px #153a3510;
}
.article-card:hover:before,
.article-card:focus-within:before {
    opacity: 1;
    transform: translateX(0);
}
.article-card:hover:after,
.article-card:focus-within:after {
    opacity: 1;
    transform: scaleY(1);
}
.article-card .article-number,
.article-card .article-meta,
.article-card .article-content h3,
.article-card .article-authors,
.article-card .article-open {
    transition:
        color 0.58s var(--ease-soft),
        border-color 0.58s var(--ease-soft),
        background-color 0.58s var(--ease-soft),
        transform 0.58s var(--ease-out);
}
.article-card:hover .article-number {
    color: #3e7770;
}
.article-card:hover .article-meta {
    color: #557c73;
}
.article-card:hover .article-content h3 {
    color: #17494a;
}
.article-card:hover .article-authors {
    color: #516b6c;
}
.article-card:hover .article-open {
    border-color: #a9c4bb;
    background: #f9fcfa;
    color: #235e58;
    transform: translateX(-2px);
}
.article-number {
    font-size: 10px;
}
.article-meta {
    font-size: 9.5px;
}
.article-content h3 {
    font-size: 16.5px;
    line-height: 1.42;
}
.article-authors {
    font-size: 10.5px;
    line-height: 1.7;
}
.article-open {
    width: 38px;
    height: 38px;
}

/* Slightly larger text across the information architecture. */
.section-label,
.page-kicker {
    font-size: 10px;
}
.section-aside {
    font-size: 10px;
}
.fact span {
    font-size: 9px;
}
.fact strong {
    font-size: 15px;
}
.hero-label {
    font-size: 10px;
}
.hero-cta {
    font-size: 12px;
}
.hero-cta small {
    font-size: 10px;
}
.hero-footnote,
.hero-coordinate {
    font-size: 9px;
}
.page-subtitle {
    font-size: 14px;
    line-height: 1.8;
}
.breadcrumbs {
    font-size: 9px;
}
.page-body {
    padding-top: 64px;
}
.side-nav-label {
    font-size: 9px;
}
.side-nav a {
    font-size: 12px;
    padding: 12px 0;
}
.content-heading {
    font-size: 30px;
}
.content-lead {
    font-size: 14px;
}
.content-prose {
    font-size: 13.5px;
    line-height: 1.9;
}
.content-prose h3 {
    font-size: 18px;
}
.info-card .eyebrow {
    font-size: 9px;
}
.info-card h3 {
    font-size: 17px;
}
.info-card p {
    font-size: 12px;
}
.index-item {
    font-size: 12px;
}
.index-item span {
    font-size: 9px;
}
.document-row strong {
    font-size: 13px;
}
.document-row small {
    font-size: 10px;
}
.document-row a {
    font-size: 10px;
}
.search-field input,
.filter-select {
    font-size: 12px;
}
.filter-chip {
    font-size: 11px;
    padding: 10px 13px;
}
.result-line {
    font-size: 9px;
}
.issue-data-row span {
    font-size: 9px;
}
.issue-data-row strong {
    font-size: 12px;
}
.footer-links {
    font-size: 11px;
}
.footer-bottom {
    font-size: 9px;
}
.modal-kicker,
.modal-label {
    font-size: 10px;
}
.modal-authors {
    font-size: 12px;
}
.modal-abstract {
    font-size: 13px;
}
.modal-tags span {
    font-size: 10px;
}
.modal-meta {
    font-size: 10px;
}
.copy-button {
    font-size: 11px;
}

/* Surface highlights follow the pointer without drawing a cursor ring. */
.cover-stage,
.archive-panel,
.info-card,
.hero-issue {
    position: relative;
    isolation: isolate;
}
.cover-stage:after,
.archive-panel:after,
.info-card:after,
.hero-issue:after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    pointer-events: none;
    opacity: 0;
    background: radial-gradient(
        260px circle at var(--spot-x, 50%) var(--spot-y, 50%),
        rgba(129, 181, 168, 0.16),
        transparent 72%
    );
    transition: opacity 0.4s ease;
}
.cover-stage:hover:after,
.archive-panel:hover:after,
.info-card:hover:after,
.hero-issue:hover:after {
    opacity: 1;
}
.magnetic-active {
    transform: translate(var(--mag-x, 0), var(--mag-y, 0)) translateY(-2px);
}

/* Motion language used across both home and internal pages. */
.page-top:before {
    animation:
        contourDrift 32s linear infinite,
        contourBreath 9s ease-in-out infinite alternate;
}
.page-top:after {
    animation:
        orbit 29s linear infinite,
        ringPulse 7s ease-in-out infinite;
}
@keyframes contourBreath {
    from {
        opacity: 0.24;
        filter: blur(0);
    }
    to {
        opacity: 0.46;
        filter: blur(1px);
    }
}
@keyframes ringPulse {
    0%,
    100% {
        box-shadow:
            0 0 0 25px #87bdb514,
            0 0 0 55px #87bdb50b;
        transform: scale(0.96);
    }
    50% {
        box-shadow:
            0 0 0 32px #87bdb51a,
            0 0 0 70px #87bdb50c;
        transform: scale(1.04);
    }
}
.hero-issue {
    animation: issueFloat 8s ease-in-out infinite;
}
@keyframes issueFloat {
    0%,
    100% {
        translate: 0 0;
    }
    50% {
        translate: 0 -7px;
    }
}
.cover-stage:before {
    animation:
        orbit 26s linear infinite,
        orbitPulse 10s ease-in-out infinite;
}
@keyframes orbitPulse {
    0%,
    100% {
        opacity: 0.56;
    }
    50% {
        opacity: 1;
    }
}
.section-heading .section-title {
    position: relative;
}
.section-heading .section-title:after {
    content: "";
    display: block;
    width: 44px;
    height: 1px;
    margin-top: 13px;
    background: linear-gradient(90deg, var(--copper), transparent);
    transform: scaleX(0.35);
    transform-origin: left;
    transition: transform 0.8s var(--ease-out);
}
.section-heading:has(.section-title.in-view) .section-title:after,
.section-heading:hover .section-title:after {
    transform: scaleX(1);
}
.reveal {
    transition-delay: var(--reveal-delay, 0ms);
    will-change: transform, opacity;
}
.line-link {
    position: relative;
    overflow: hidden;
    font-size: 12px;
    transition:
        padding 0.42s var(--ease-out),
        color 0.32s;
}
.line-link:after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 1px;
    background: linear-gradient(90deg, var(--teal2), var(--copper));
    transform: scaleX(0);
    transform-origin: left;
    transition: transform 0.55s var(--ease-out);
}
.line-link:hover:after {
    transform: scaleX(1);
}
.filter-chip,
.period-btn,
.year-btn,
.primary-link,
.text-link,
.document-row a,
.index-item {
    transition-timing-function: var(--ease-soft);
}
.search-field:focus-within {
    border-color: #83aaa0;
    box-shadow: 0 0 0 3px #84b5a51a;
    transition:
        box-shadow 0.3s,
        border-color 0.3s;
}
button:focus-visible,
a:focus-visible,
input:focus-visible,
select:focus-visible {
    outline: 2px solid #4c9084;
    outline-offset: 3px;
}

@media (max-width: 1100px) {
    .main-nav {
        display: none;
    }
    .menu-toggle {
        display: grid;
    }
    .submit-button {
        display: none;
    }
    .nav-actions {
        margin-left: auto;
    }
    .mega-wrap {
        display: none;
    }
}
@media (max-width: 900px) {
    .page-body {
        padding-top: 48px;
    }
    .article-card {
        padding: 22px 12px;
    }
    .article-content h3 {
        font-size: 16px;
    }
    .article-authors {
        font-size: 10px;
    }
}
@media (max-width: 700px) {
    .topline {
        font-size: 8px;
    }
    .brand-copy strong {
        font-size: 9.5px;
    }
    .brand-copy small {
        font-size: 8px;
    }
    .hero-label {
        font-size: 9px;
    }
    .section-label,
    .page-kicker {
        font-size: 9px;
    }
    .section-aside {
        font-size: 9px;
    }
    .fact span {
        font-size: 8.5px;
    }
    .fact strong {
        font-size: 14px;
    }
    .page-subtitle {
        font-size: 13px;
    }
    .side-nav a {
        font-size: 11px;
    }
    .content-heading {
        font-size: 27px;
    }
    .content-prose {
        font-size: 13px;
    }
    .info-card h3 {
        font-size: 16px;
    }
    .info-card p {
        font-size: 11.5px;
    }
    .article-content h3 {
        font-size: 15.5px;
    }
    .article-authors {
        font-size: 10px;
    }
    .article-meta {
        font-size: 9px;
    }
    .footer-links {
        font-size: 10px;
    }
    .footer-bottom {
        font-size: 8px;
    }
    .article-card {
        margin: 0 -7px;
        padding: 20px 8px;
    }
    .article-card:hover,
    .article-card:focus-within {
        padding-left: 8px;
    }
}
@media (prefers-reduced-motion: reduce) {
    #particleLayer {
        display: none;
    }
    .hero-issue {
        animation: none;
    }
    .page-top:before,
    .page-top:after,
    .cover-stage:before,
    .cover-stage:after {
        animation: none;
    }
    .article-card:before,
    .article-card:after {
        transition: none;
    }
}

/* v5 · Homepage journal profile, interactive research geography, layered mega menus */
.mega-wrap {
    display: grid;
    grid-template-areas: "panels";
    align-items: start;
    isolation: isolate;
    left: 0;
    right: 0;
    top: calc(100% - 1px);
    padding: 0 var(--gutter);
    pointer-events: none;
    z-index: 540;
}
.mega-wrap.active {
    pointer-events: auto;
}
.mega {
    grid-area: panels;
    position: relative;
    left: auto;
    right: auto;
    top: auto;
    width: 100%;
    max-width: var(--max);
    margin: 0 auto;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    z-index: 0;
    transform: translateY(-9px) scale(0.992);
    transition:
        opacity 0.26s var(--ease-soft),
        transform 0.38s var(--ease-out),
        visibility 0.26s;
}
.mega.open {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    z-index: 2;
    transform: translateY(0) scale(1);
}
.mega-wrap:before {
    content: "";
    grid-area: panels;
    align-self: stretch;
    pointer-events: none;
}

.about-journal-section {
    background: #f1f5f2;
    position: relative;
    overflow: hidden;
}
.about-journal-section:before {
    content: "";
    position: absolute;
    right: -180px;
    top: -210px;
    width: 650px;
    height: 650px;
    border: 1px solid #9bb8ac55;
    border-radius: 50%;
    box-shadow:
        0 0 0 32px #9bb8ac0c,
        0 0 0 70px #9bb8ac09,
        0 0 0 115px #9bb8ac07;
    pointer-events: none;
    animation: aboutOrbit 42s linear infinite;
}
.about-journal-section:after {
    content: "";
    position: absolute;
    inset: 0;
    opacity: 0.23;
    pointer-events: none;
    background-image: radial-gradient(#89a69a 0.65px, transparent 0.65px);
    background-size: 20px 20px;
    mask-image: linear-gradient(120deg, transparent 15%, #000 90%);
}
@keyframes aboutOrbit {
    to {
        transform: rotate(360deg);
    }
}
.about-journal-section .section-inner {
    position: relative;
    z-index: 1;
}
.about-journal-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: clamp(34px, 5vw, 76px);
    align-items: start;
}
.about-journal-main {
    padding: 12px 0 0;
}
.about-intro {
    max-width: 790px;
    margin: 0 0 38px;
    color: #314a4e;
    font: 400 clamp(18px, 2vw, 25px)/1.65 var(--display);
    letter-spacing: -0.025em;
}
.about-intro em {
    color: #1d6862;
    font-style: normal;
}
.about-subhead {
    margin-bottom: 15px;
    color: #71817e;
    font: 10px var(--mono);
    letter-spacing: 0.13em;
    text-transform: uppercase;
}
.about-disciplines {
    padding: 0 0 31px;
    border-bottom: 1px solid #d5e0da;
}
.discipline-cloud {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}
.discipline-chip {
    padding: 8px 11px;
    border: 1px solid #cfdbd5;
    background: #f8faf8;
    color: #506862;
    font-size: 11px;
    line-height: 1.25;
    transition:
        background 0.4s var(--ease-soft),
        border-color 0.4s,
        color 0.4s,
        transform 0.5s var(--ease-out),
        box-shadow 0.4s;
}
.discipline-chip:hover {
    background: #e0eee7;
    border-color: #8eafa1;
    color: #225e57;
    transform: translateY(-3px);
    box-shadow: 0 7px 18px #244a3b10;
}
.about-history {
    padding-top: 29px;
}
.about-history .content-prose p {
    text-align: justify;
}
.language-timeline {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0;
    border: 1px solid #d5e0da;
    background: #f8faf8;
}
.language-period {
    position: relative;
    min-height: 91px;
    padding: 17px 15px;
    border-right: 1px solid #d5e0da;
    transition: background 0.45s var(--ease-soft);
}
.language-period:last-child {
    border-right: 0;
}
.language-period:before {
    content: "";
    position: absolute;
    left: 15px;
    right: 15px;
    top: 0;
    height: 2px;
    background: #9fb7ac;
    transform: scaleX(0.25);
    transform-origin: left;
    transition: transform 0.55s var(--ease-out);
}
.language-period:hover,
.language-period.active {
    background: #edf4ef;
}
.language-period:hover:before,
.language-period.active:before {
    transform: scaleX(1);
    background: linear-gradient(90deg, #2d766b, #c18e6c);
}
.language-period strong {
    display: block;
    margin-bottom: 8px;
    color: #29484b;
    font: 11px var(--mono);
}
.language-period span {
    color: #758580;
    font-size: 10px;
    line-height: 1.5;
}
.about-journal-aside {
    position: relative;
    padding: 23px 25px 21px;
    background: #10282f;
    color: #e8f0eb;
    box-shadow: 0 24px 50px #14382d16;
    overflow: hidden;
}
.about-journal-aside:before {
    content: "";
    position: absolute;
    right: -90px;
    top: -120px;
    width: 260px;
    height: 260px;
    border: 1px solid #9fc6b533;
    border-radius: 50%;
    box-shadow:
        0 0 0 25px #9fc6b50c,
        0 0 0 55px #9fc6b507;
    animation: aboutOrbit 34s linear infinite;
}
.about-metrics {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    border-left: 1px solid #ffffff18;
    border-top: 1px solid #ffffff18;
}
.about-metric {
    min-height: 110px;
    padding: 15px 16px;
    border-right: 1px solid #ffffff18;
    border-bottom: 1px solid #ffffff18;
}
.about-metric span,
.about-metric small {
    display: block;
    color: #9bb0ab;
    font: 9px var(--mono);
    letter-spacing: 0.04em;
}
.about-metric strong {
    display: block;
    margin: 9px 0 4px;
    color: #f1f5f2;
    font: 500 clamp(24px, 3vw, 34px)/1 var(--display);
    letter-spacing: -0.05em;
}
.about-metric small {
    color: #89a39b;
    font-size: 8px;
}
.about-policy-list {
    position: relative;
    z-index: 1;
    padding-top: 19px;
}
.about-policy-list > div {
    display: grid;
    grid-template-columns: 30px 1fr;
    gap: 10px;
    padding: 10px 0;
    border-bottom: 1px solid #ffffff17;
}
.policy-mark {
    color: #c49a77;
    font: 9px var(--mono);
    padding-top: 2px;
}
.about-policy-list p {
    margin: 0;
}
.about-policy-list strong {
    display: block;
    margin-bottom: 4px;
    color: #e5eee8;
    font-size: 12px;
    font-weight: 650;
}
.about-policy-list small {
    display: block;
    color: #a6b8b1;
    font-size: 10px;
    line-height: 1.6;
}
.about-links {
    position: relative;
    z-index: 1;
    display: flex;
    flex-wrap: wrap;
    gap: 8px 17px;
    padding-top: 17px;
}
.about-links a {
    color: #bad0c8;
    font-size: 10px;
    transition:
        color 0.25s,
        transform 0.25s;
}
.about-links a:hover {
    color: #fff;
    transform: translateY(-2px);
}

.research-map-section {
    background: #e8efeb;
    position: relative;
    overflow: hidden;
}
.research-map-intro {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 20px;
    margin: -9px 0 23px;
}
.research-map-intro p {
    max-width: 610px;
    margin: 0;
    color: #667a78;
    font-size: 13px;
    line-height: 1.75;
}
.map-count {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 7px 13px;
    border-left: 1px solid #b8cbc2;
}
.map-count strong {
    color: #245e58;
    font: 500 30px/1 var(--display);
}
.map-count span {
    color: #7c8d87;
    font: 8px/1.55 var(--mono);
    letter-spacing: 0.09em;
}
.research-map-shell {
    background: #102a31;
    box-shadow: 0 25px 55px #183a3319;
    overflow: hidden;
}
.research-map-topline {
    height: 43px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0 20px;
    border-bottom: 1px solid #ffffff20;
    color: #9fb7b1;
    font: 9px var(--mono);
    letter-spacing: 0.09em;
}
.research-map-topline > span:first-child {
    display: flex;
    align-items: center;
    gap: 9px;
}
.research-map-topline i {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: #9cc8b7;
    box-shadow: 0 0 0 4px #9cc8b71c;
    animation: pinBlink 2.3s ease-in-out infinite;
}
.research-map-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 310px;
    min-height: 450px;
}
.research-map-canvas-wrap {
    position: relative;
    min-width: 0;
    min-height: 450px;
    background: #dfe9e4;
    overflow: hidden;
}
.research-fields-map {
    position: absolute;
    inset: 0;
    z-index: 1;
    background: #e4ece7;
}
.research-map-fallback {
    position: absolute;
    inset: 0;
    z-index: 0;
    display: none;
    overflow: hidden;
    background: linear-gradient(145deg, #e4eee8, #dbe7e0);
}
.research-map-fallback.visible {
    display: block;
    z-index: 2;
}
.research-map-fallback svg {
    width: 100%;
    height: 100%;
    position: absolute;
    inset: 0;
}
.fallback-map-pins {
    position: absolute;
    inset: 0;
}
.fallback-pin {
    position: absolute;
    width: 19px;
    height: 19px;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: #2c766b55;
    transform: translate(-50%, -50%);
    cursor: pointer;
    transition:
        transform 0.3s,
        background 0.3s;
}
.fallback-pin i {
    position: absolute;
    inset: 5px;
    border: 2px solid #fff;
    border-radius: 50%;
    background: #b77f5b;
    box-shadow: 0 1px 4px #18362d44;
}
.fallback-pin:before {
    content: "";
    position: absolute;
    inset: -5px;
    border: 1px solid #3d8476;
    border-radius: 50%;
    animation: pinWave 2.6s ease-out infinite;
}
.fallback-pin:hover,
.fallback-pin.selected {
    transform: translate(-50%, -50%) scale(1.28);
    background: #2c766b88;
    z-index: 2;
}
.fallback-map-note {
    position: absolute;
    left: 17px;
    bottom: 15px;
    color: #627e75;
    font: 8px var(--mono);
    letter-spacing: 0.1em;
    pointer-events: none;
}
.research-map-aside {
    position: relative;
    display: flex;
    flex-direction: column;
    padding: 28px 24px 20px;
    background: #102a31;
    color: #edf4ef;
    border-left: 1px solid #ffffff1c;
    overflow: hidden;
}
.research-map-aside:before {
    content: "";
    position: absolute;
    right: -95px;
    bottom: -125px;
    width: 255px;
    height: 255px;
    border: 1px solid #a4c8b533;
    border-radius: 50%;
    box-shadow:
        0 0 0 28px #a4c8b50c,
        0 0 0 60px #a4c8b507;
    animation: aboutOrbit 45s linear infinite;
}
.map-aside-kicker {
    position: relative;
    z-index: 1;
    color: #96b1a8;
    font: 8px var(--mono);
    letter-spacing: 0.12em;
}
.map-aside-index {
    position: relative;
    z-index: 1;
    margin: 17px 0;
    color: #d6a582;
    font: 10px var(--mono);
}
.map-aside-rule {
    position: relative;
    z-index: 1;
    width: 39px;
    height: 1px;
    margin-bottom: 20px;
    background: linear-gradient(90deg, #c4906e, transparent);
}
.map-aside-field {
    position: relative;
    z-index: 1;
    color: #9dc0b3;
    font: 8px/1.6 var(--mono);
    letter-spacing: 0.08em;
}
.research-map-aside h3 {
    position: relative;
    z-index: 1;
    margin: 11px 0 12px;
    color: #f0f4f0;
    font: 500 20px/1.35 var(--display);
    letter-spacing: -0.025em;
    transition:
        opacity 0.25s,
        transform 0.25s;
}
.map-aside-place {
    position: relative;
    z-index: 1;
    margin: 0 0 13px;
    color: #c9d9d1;
    font-size: 11px;
}
.map-aside-authors {
    position: relative;
    z-index: 1;
    margin: 0;
    color: #91a9a2;
    font-size: 9px;
    line-height: 1.7;
}
.map-aside-action {
    position: relative;
    z-index: 1;
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    margin-top: 23px;
    padding: 12px 0;
    border: 0;
    border-top: 1px solid #ffffff26;
    border-bottom: 1px solid #ffffff26;
    background: transparent;
    color: #d9e8e0;
    text-align: left;
    font-size: 10px;
    cursor: pointer;
    transition:
        padding 0.35s,
        color 0.3s;
}
.map-aside-action:hover {
    padding-left: 7px;
    color: #fff;
}
.map-aside-action span {
    color: #d0a17f;
}
.map-aside-controls {
    position: relative;
    z-index: 1;
    display: flex;
    gap: 8px;
    margin-top: auto;
    padding-top: 24px;
}
.map-aside-controls button {
    width: 35px;
    height: 35px;
    border: 1px solid #ffffff37;
    background: #ffffff08;
    color: #d5e3dd;
    font-size: 16px;
    cursor: pointer;
    transition:
        background 0.3s,
        border-color 0.3s,
        transform 0.3s;
}
.map-aside-controls button:hover {
    background: #ffffff18;
    border-color: #9fc6b4;
    transform: translateY(-2px);
}
.research-map-legend {
    display: flex;
    align-items: center;
    gap: 19px;
    flex-wrap: wrap;
    padding: 13px 18px;
    background: #0d2329;
    border-top: 1px solid #ffffff1c;
    color: #9db2ad;
    font: 8px var(--mono);
    letter-spacing: 0.04em;
}
.research-map-legend > span {
    display: flex;
    align-items: center;
    gap: 7px;
}
.legend-dot {
    display: inline-block;
    width: 7px;
    height: 7px;
    border-radius: 50%;
}
.legend-dot.teal {
    background: #92c2b3;
}
.legend-dot.copper {
    background: #d09c79;
}
.research-map-legend .map-precision-note {
    margin-left: auto;
    color: #829a94;
    letter-spacing: 0;
    text-transform: none;
}
.research-marker-wrap {
    background: transparent;
    border: 0;
}
.research-marker {
    position: relative;
    display: block;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background: #377b6d45;
    box-shadow: 0 0 0 1px #3f897c55;
    transition: transform 0.3s;
}
.research-marker i {
    position: absolute;
    inset: 6px;
    border: 2px solid #fff;
    border-radius: 50%;
    background: #bd8763;
    box-shadow: 0 1px 5px #183b344d;
}
.research-marker:before,
.research-marker:after {
    content: "";
    position: absolute;
    inset: -4px;
    border: 1px solid #398373;
    border-radius: 50%;
    animation: pinWave 2.7s ease-out infinite;
}
.research-marker:after {
    animation-delay: 1.35s;
}
.research-marker-wrap:hover .research-marker,
.research-marker-wrap.selected .research-marker {
    transform: scale(1.32);
}
@keyframes pinWave {
    0% {
        transform: scale(0.62);
        opacity: 0.75;
    }
    100% {
        transform: scale(2.2);
        opacity: 0;
    }
}
@keyframes pinBlink {
    0%,
    100% {
        opacity: 0.65;
    }
    50% {
        opacity: 1;
        box-shadow: 0 0 0 7px #9cc8b71c;
    }
}
.leaflet-container {
    font-family: inherit !important;
    outline: 0;
    background: #e2ebe5 !important;
}
.leaflet-control-zoom a {
    color: #244b49 !important;
    border-color: #d0ddd5 !important;
}
.leaflet-control-attribution {
    font-size: 8px !important;
    color: #60756e !important;
}
.leaflet-control-attribution a {
    color: #426f67 !important;
}
.leaflet-popup-content-wrapper,
.leaflet-popup-tip {
    background: #102a31;
    color: #eef4ef;
}
.leaflet-popup-content {
    font-size: 11px;
    line-height: 1.55;
}
.leaflet-tile {
    filter: saturate(0.75) contrast(0.97);
}

/* Additional editorial motion: staggered metadata, section reveal, animated highlights. */
.about-metric,
.about-policy-list > div {
    opacity: 0;
    transform: translateY(12px);
    transition:
        opacity 0.65s var(--ease-out),
        transform 0.65s var(--ease-out);
}
.about-journal-section.in-view .about-metric,
.about-journal-section.in-view .about-policy-list > div {
    opacity: 1;
    transform: translateY(0);
}
.about-journal-section.in-view .about-metric:nth-child(2),
.about-journal-section.in-view .about-policy-list > div:nth-child(2) {
    transition-delay: 80ms;
}
.about-journal-section.in-view .about-metric:nth-child(3),
.about-journal-section.in-view .about-policy-list > div:nth-child(3) {
    transition-delay: 140ms;
}
.about-journal-section.in-view .about-metric:nth-child(4),
.about-journal-section.in-view .about-policy-list > div:nth-child(4) {
    transition-delay: 200ms;
}
.research-map-shell {
    transform: translateY(18px);
    opacity: 0;
    transition:
        opacity 0.9s var(--ease-out),
        transform 0.9s var(--ease-out);
}
.research-map-section.in-view .research-map-shell {
    transform: translateY(0);
    opacity: 1;
}
.research-map-section .section-title {
    max-width: 700px;
}
.research-map-intro p {
    animation: mapTextIn 0.8s 0.15s both;
}
@keyframes mapTextIn {
    from {
        opacity: 0;
        transform: translateY(9px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@media (max-width: 1000px) {
    .about-journal-layout {
        grid-template-columns: 1fr;
    }
    .about-journal-aside {
        max-width: none;
    }
    .research-map-layout {
        grid-template-columns: minmax(0, 1fr) 270px;
    }
}
@media (max-width: 760px) {
    .mega-wrap {
        display: none;
    }
    .about-journal-layout {
        gap: 28px;
    }
    .about-intro {
        font-size: 19px;
    }
    .about-journal-aside {
        padding: 20px 18px;
    }
    .research-map-intro {
        align-items: flex-start;
        flex-direction: column;
    }
    .map-count {
        padding-left: 0;
    }
    .research-map-layout {
        grid-template-columns: 1fr;
    }
    .research-map-canvas-wrap {
        min-height: 360px;
    }
    .research-map-aside {
        min-height: 300px;
        border-left: 0;
        border-top: 1px solid #ffffff1c;
        padding: 22px 20px;
    }
    .research-map-aside h3 {
        max-width: 580px;
    }
    .map-aside-controls {
        margin-top: 18px;
    }
    .research-map-legend .map-precision-note {
        margin-left: 0;
        width: 100%;
    }
    .research-map-topline {
        font-size: 8px;
        padding: 0 12px;
    }
}
@media (max-width: 480px) {
    .language-timeline {
        grid-template-columns: 1fr;
    }
    .language-period {
        min-height: auto;
        border-right: 0;
        border-bottom: 1px solid #d5e0da;
    }
    .language-period:last-child {
        border-bottom: 0;
    }
    .about-metrics {
        grid-template-columns: 1fr 1fr;
    }
    .about-metric {
        min-height: 97px;
        padding: 12px;
    }
    .research-map-canvas-wrap {
        min-height: 320px;
    }
    .research-map-topline > span:last-child {
        display: none;
    }
    .research-map-legend {
        gap: 10px;
    }
    .research-map-aside h3 {
        font-size: 18px;
    }
}
@media (prefers-reduced-motion: reduce) {
    .about-journal-section:before,
    .about-journal-aside:before,
    .research-map-aside:before,
    .research-marker:before,
    .research-marker:after,
    .fallback-pin:before,
    .research-map-topline i {
        animation: none !important;
    }
    .about-metric,
    .about-policy-list > div,
    .research-map-shell {
        opacity: 1;
        transform: none;
    }
}

/* v6 · Main-site wording, homepage keyword discovery and editorial archive sizing */
.nav-keyword-search {
    height: 38px;
    width: clamp(150px, 15vw, 220px);
    display: flex;
    align-items: center;
    border: 1px solid #d6e0dc;
    background: #fbfcfb;
    transition:
        border-color 0.3s,
        box-shadow 0.3s;
}
.nav-keyword-search:focus-within {
    border-color: #83aaa0;
    box-shadow: 0 0 0 3px #84b5a51a;
}
.nav-keyword-search input {
    width: 100%;
    min-width: 0;
    height: 100%;
    padding: 0 10px;
    border: 0;
    outline: 0;
    background: transparent;
    color: var(--ink);
    font-size: 11px;
}
.nav-keyword-search input::placeholder {
    color: #869391;
}
.nav-keyword-search button {
    width: 37px;
    height: 100%;
    border: 0;
    border-left: 1px solid #e0e7e4;
    background: transparent;
    color: #45645f;
    font-size: 21px;
    transition:
        background 0.25s,
        color 0.25s;
}
.nav-keyword-search button:hover {
    background: #15343a;
    color: white;
}
.nav-account {
    color: #617277;
    font-size: 10px;
    font-weight: 650;
    white-space: nowrap;
    transition: color 0.2s;
}
.nav-account:hover {
    color: #1f6864;
}
.nav-actions {
    gap: 10px;
}
.main-nav {
    gap: clamp(10px, 1.1vw, 17px);
}
.nav-link,
.nav-trigger {
    font-size: 11px;
}
.mega.official-mega {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 27px;
    padding: 23px 27px 25px;
}
.official-mega .mega-list {
    padding-top: 0;
    gap: 1px;
}
.official-mega .mega-list a {
    font-size: 13px;
    line-height: 1.5;
    padding: 9px 0;
    border-bottom: 1px solid #edf1ef;
}
.official-mega .mega-list a:last-child {
    border-bottom: 0;
}
@media (max-width: 1250px) {
    .nav-account {
        display: none;
    }
    .nav-keyword-search {
        width: 175px;
    }
    .main-nav {
        gap: 10px;
    }
    .nav-link,
    .nav-trigger {
        font-size: 10px;
    }
}
@media (max-width: 1100px) {
    .main-nav {
        display: none;
    }
    .nav-keyword-search {
        display: none;
    }
    .menu-toggle {
        display: grid;
    }
    .nav-actions {
        margin-left: auto;
    }
    .submit-button {
        display: none;
    }
}
@media (max-width: 760px) {
    .mega-wrap {
        display: none;
    }
    .official-mega {
        display: none;
    }
}

/* The About section reproduces the complete wording and headings shown on the MTA portal. */
.about-full-layout {
    grid-template-columns: minmax(0, 1fr) 285px;
    align-items: start;
    gap: clamp(28px, 4vw, 58px);
}
.about-full-copy {
    width: 100%;
    max-width: none;
    color: #3f555a;
}
.about-full-copy p {
    text-align: justify;
}
.about-full-copy h3 {
    margin: 25px 0 11px;
    color: #18343b;
    font: 650 16px/1.35 var(--display);
    letter-spacing: -0.015em;
}
.about-full-copy h3:first-child {
    margin-top: 0;
}
.about-full-copy p {
    margin: 0 0 15px;
    color: #506469;
    font-size: 14px;
    line-height: 1.9;
}
.about-official-facts {
    position: sticky;
    top: 112px;
    max-width: none;
}
.about-official-facts .about-metric span {
    font-size: 10px;
}
.about-official-facts .about-metric strong {
    font-size: clamp(18px, 2vw, 25px);
}
.about-official-facts .about-metric small {
    font-size: 10px;
}
.about-official-facts .about-links {
    display: grid;
    gap: 11px;
}
.about-official-facts .about-links a {
    font-size: 12px;
}

/* Homepage research discovery: filters and keyword query remain independent of Advanced Search. */
.home-articles-section{
    background:#fff;
    position:relative;
    overflow:hidden;
}

.home-articles-section:before{
    content:"";
    position:absolute;
    left:-180px;
    top:-210px;
    width:650px;
    height:650px;
    border:1px solid #9bb8ac55;
    border-radius:50%;
    box-shadow:
        0 0 0 32px #9bb8ac0c,
        0 0 0 70px #9bb8ac09,
        0 0 0 115px #9bb8ac07;
    pointer-events:none;
    animation:aboutOrbit 42s linear infinite;
}

.home-articles-section > .section-inner{
    position:relative;
    z-index:1;
}
.home-article-tools {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    margin: 0 0 19px;
}
.home-keyword-form {
    display: flex;
    align-items: center;
    gap: 9px;
    flex: 1;
    max-width: 720px;
}
.home-keyword-form .search-field {
    flex: 1;
    min-width: 180px;
}
.home-keyword-form .primary-link {
    height: 42px;
    white-space: nowrap;
}
.home-advanced-search {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    padding: 12px 15px;
    border: 1px solid #ccd9d3;
    color: #315d58;
    font-size: 12px;
    font-weight: 700;
    transition:
        background 0.3s,
        border-color 0.3s,
        transform 0.3s;
}
.home-advanced-search:hover {
    background: #edf4f0;
    border-color: #9cb9ae;
    transform: translateY(-2px);
}
.home-advanced-search span {
    color: #bd8763;
}
.home-filter-row {
    margin: 0 0 11px;
}
.home-filter-row .filter-chip {
    font-size: 11px;
    padding: 10px 14px;
}
.home-articles-section .article-grid {
    margin-top: 0;
}

/* One article per row on every listing page (homepage, results and issue contents). */
.article-grid {
    display: flex !important;
    flex-direction: column !important;
    gap: 0 !important;
    width: 100%;
}
.article-grid > .article-card {
    width: 100%;
    flex: none;
}
.article-grid > .empty-state {
    width: 100%;
    grid-column: auto;
}

/* Archive typography: year and period selectors are easier to scan. */
.archive-periods .period-btn {
    font-size: 12px;
    padding: 14px 15px;
    line-height: 1.35;
}
.archive-periods .period-btn span {
    font-size: 10px;
}
.archive-panel-head {
    font-size: 10px;
}
.year-grid {
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 9px;
}
.year-btn {
    min-height: 48px;
    font-size: 13px;
    font-weight: 600;
}
.archive-selection strong {
    font-size: 23px;
}
.archive-selection small {
    font-size: 10px;
}
.archive-note {
    font-size: 11px;
    line-height: 1.75;
}
@media (max-width: 1100px) {
    .about-full-layout {
        grid-template-columns: 1fr;
    }
    .about-official-facts {
        position: relative;
        top: auto;
    }
    .about-official-facts .about-metrics {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
}
@media (max-width: 760px) {
    .home-article-tools {
        align-items: stretch;
        flex-direction: column;
    }
    .home-keyword-form {
        max-width: none;
        flex-direction: column;
        align-items: stretch;
    }
    .home-keyword-form .search-field {
        width: 100%;
    }
    .home-keyword-form .primary-link {
        justify-content: center;
    }
    .home-advanced-search {
        justify-content: space-between;
    }
    .about-full-copy p {
        font-size: 13px;
        line-height: 1.85;
    }
    .about-full-copy h3 {
        font-size: 15px;
    }
    .about-official-facts .about-metrics {
        grid-template-columns: 1fr 1fr;
    }
    .archive-periods .period-btn {
        font-size: 11px;
        padding: 12px;
    }
    .archive-periods .period-btn span {
        font-size: 9px;
    }
    .year-grid {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
    .year-btn {
        min-height: 44px;
        font-size: 12px;
    }
}

/* v7 · Replace the redundant latest-issue promo with the journal's official About entry. */
.hero-about-card {
    width: min(100%, 390px);
    padding: 27px 28px 24px;
    background: linear-gradient(140deg, #ffffff16, #ffffff06);
}
.hero-about-card .hero-issue-top {
    align-items: center;
    font-size: 10px;
    letter-spacing: 0.11em;
}
.hero-about-copy {
    margin: 28px 0 0;
    color: #edf4f1;
    font: 400 clamp(15px, 1.35vw, 19px)/1.65 var(--display);
    letter-spacing: -0.012em;
}
.hero-about-card .hero-issue-bottom {
    align-items: center;
    font-size: 9px;
    line-height: 1.6;
}
.hero-about-card .hero-issue-bottom a {
    font-weight: 700;
    white-space: nowrap;
}
@media (max-width: 700px) {
    .hero-about-card {
        width: min(100%, 390px);
        padding: 22px 22px 20px;
    }
    .hero-about-copy {
        margin-top: 21px;
        font-size: 16px;
    }
}

/* v8 · Issue detail pages, roomy advanced search and archive-by-ID navigation. */
.hero-latest-issue {
    width: min(100%, 405px);
    padding: 26px 29px 24px;
    background: linear-gradient(
        145deg,
        rgba(255, 255, 255, 0.12),
        rgba(255, 255, 255, 0.035)
    );
    border: 1px solid rgba(190, 220, 208, 0.28);
    box-shadow: 0 28px 70px rgba(0, 0, 0, 0.18);
}
.hero-latest-issue .hero-issue-top {
    font-size: 10px;
    letter-spacing: 0.12em;
    color: #b9d3ca;
}
.hero-latest-volume {
    margin: 23px 0 -3px;
    color: #e5f0e9;
    font: 500 clamp(64px, 7vw, 92px)/0.9 var(--display);
    letter-spacing: -0.08em;
}
.hero-latest-issue h2 {
    margin: 12px 0 0;
    color: #fff;
    font: 600 22px/1.2 var(--display);
    letter-spacing: -0.04em;
}
.hero-latest-date {
    margin: 7px 0 0;
    color: #a9c3bb;
    font-size: 14px;
}
.hero-latest-meta {
    display: flex;
    gap: 22px;
    margin: 15px 0 2px;
    color: #8fb4a8;
    font: 9px var(--mono);
    letter-spacing: 0.1em;
}
.hero-latest-issue .hero-issue-bottom {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 14px;
    margin-top: 16px;
    font-size: 10px;
}
.hero-latest-issue .hero-issue-bottom a {
    color: #d4e7df;
    white-space: nowrap;
}
.hero-latest-issue .hero-issue-bottom .hero-last-issue-link {
    padding: 10px 12px;
    background: #d6e6df;
    color: #17363b;
    font-weight: 700;
}
.hero-latest-issue .hero-issue-bottom .hero-last-issue-link:hover {
    background: #fff;
    transform: translateY(-2px);
}
.page-layout-wide {
    grid-template-columns: minmax(0, 1fr) !important;
}
.page-layout-wide .content-column {
    width: 100%;
    max-width: none;
    min-width: 0;
}
.page-layout-wide .content-heading {
    font-size: clamp(27px, 3vw, 36px);
}
.advanced-search-intro {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin: 0 0 25px;
    padding-bottom: 22px;
    border-bottom: 1px solid #dce5e1;
}
.advanced-search-intro .section-label {
    font-size: 10px;
}
.advanced-search-intro .content-heading {
    margin: 0;
}
.advanced-search-intro p {
    max-width: 920px;
    margin: 0;
    color: #687b7e;
    font-size: 15px;
    line-height: 1.7;
}
.advanced-search-panel {
    width: 100%;
    max-width: none;
    padding: clamp(25px, 3.4vw, 44px);
    background: linear-gradient(135deg, #fff, #f9fbf9);
    box-shadow: 0 18px 45px rgba(20, 54, 56, 0.055);
}
.advanced-search-panel .form-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 24px 22px;
}
.advanced-search-panel .field {
    gap: 9px;
}
.advanced-search-panel .field label {
    font-size: 10px;
}
.advanced-search-panel .field input,
.advanced-search-panel .field select {
    min-height: 52px;
    padding: 13px 15px;
    font-size: 14px;
}
.advanced-search-panel .field.full {
    grid-column: 1/-1;
}
.advanced-search-panel .form-actions {
    gap: 13px;
    margin-top: 26px;
}
.advanced-search-panel .form-note {
    font-size: 11px;
}
.search-results .article-card {
    padding-top: 25px;
    padding-bottom: 25px;
}
.issue-page-overview {
    display: grid;
    grid-template-columns: minmax(230px, 310px) minmax(0, 1fr);
    gap: clamp(30px, 5vw, 68px);
    align-items: center;
    padding: clamp(25px, 4vw, 48px);
    background: linear-gradient(120deg, #f1f5f2, #fbfcfa);
    border: 1px solid #dce5e0;
}
.issue-page-cover .cover-stage {
    min-height: 360px;
    margin: 0;
}
.issue-page-cover .journal-cover {
    width: min(230px, 80%);
    min-height: 320px;
}
.issue-page-info {
    padding: 10px 0;
}
.issue-page-kicker {
    color: #63857c;
    font: 10px var(--mono);
    letter-spacing: 0.12em;
    text-transform: uppercase;
}
.issue-page-info h2 {
    margin: 19px 0 0;
    color: #203c42;
    font: 600 clamp(36px, 5vw, 58px)/1 var(--display);
    letter-spacing: -0.065em;
}
.issue-page-date {
    margin: 9px 0 17px;
    color: #718589;
    font-size: 18px;
}
.issue-page-description {
    max-width: 610px;
    color: #53696c;
    font-size: 15px;
    line-height: 1.7;
}
.issue-page-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
    margin: 20px 0 25px;
}
.issue-page-meta span {
    padding: 9px 11px;
    background: #fff;
    border: 1px solid #dce5e0;
    color: #5d7372;
    font-size: 11px;
}
.issue-page-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 11px;
    align-items: center;
}
.issue-page-actions .secondary-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    min-height: 42px;
}
.issue-page-contents {
    margin-top: 56px;
}
.issue-page-contents-heading {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 15px;
    padding-bottom: 18px;
    border-bottom: 1px solid #dce5e1;
}
.issue-page-contents-heading .content-heading {
    margin: 7px 0 0;
}
.issue-page-contents-heading > span {
    color: #80918e;
    font: 10px var(--mono);
    letter-spacing: 0.1em;
}
.issue-api-empty,
.issue-not-found {
    padding: 34px;
    background: #f6f8f6;
    border: 1px solid #dfe7e2;
    color: #52696b;
}
.issue-api-empty strong {
    display: block;
    color: #29494c;
    font-size: 16px;
}
.issue-api-empty p,
.issue-not-found p {
    max-width: 800px;
    font-size: 14px;
    line-height: 1.8;
}
.issue-api-empty .primary-link {
    display: inline-flex;
    margin-top: 10px;
}
.archive-issue-results {
    margin-top: 24px;
    padding: 24px;
    background: #fff;
    border: 1px solid #dce5e1;
}
.archive-issue-list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 11px;
}
.archive-issue-row {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 7px;
    min-height: 125px;
    padding: 19px 20px;
    background: #f8faf8;
    border: 1px solid #e0e8e3;
    color: #314a4c;
    text-decoration: none;
    transition:
        background 0.45s var(--ease-soft),
        border-color 0.45s,
        transform 0.45s,
        box-shadow 0.45s;
}
.archive-issue-row:hover {
    background: #eaf2ed;
    border-color: #a9c6ba;
    transform: translateY(-3px);
    box-shadow: 0 12px 25px rgba(25, 64, 57, 0.07);
}
.archive-issue-volume {
    color: #769089;
    font: 10px var(--mono);
    letter-spacing: 0.1em;
    text-transform: uppercase;
}
.archive-issue-row strong {
    color: #294248;
    font: 600 18px/1.3 var(--display);
}
.archive-issue-row small {
    display: flex;
    justify-content: space-between;
    gap: 15px;
    color: #849390;
    font-size: 10px;
}
.archive-issue-row small i {
    color: #4f8175;
    font-style: normal;
    font-weight: 700;
}
.archive-issues-empty {
    padding: 22px 5px;
    color: #617578;
}
.archive-issues-empty strong {
    color: #2d4a4d;
    font: 600 19px var(--display);
}
.archive-issues-empty p {
    max-width: 750px;
    font-size: 13px;
    line-height: 1.75;
}
.archive-issues-empty a {
    color: #477a70;
    font-size: 12px;
    font-weight: 700;
}
@media (max-width: 900px) {
    .issue-page-overview {
        grid-template-columns: 230px minmax(0, 1fr);
        gap: 27px;
    }
    .advanced-search-panel .form-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}
@media (max-width: 700px) {
    .hero-latest-issue {
        width: 100%;
        padding: 22px;
    }
    .hero-latest-volume {
        font-size: 70px;
    }
    .hero-latest-issue .hero-issue-bottom {
        align-items: flex-start;
        flex-direction: column;
    }
    .issue-page-overview {
        grid-template-columns: 1fr;
        padding: 23px;
    }
    .issue-page-cover .cover-stage {
        min-height: 330px;
    }
    .issue-page-cover .journal-cover {
        width: 205px;
        min-height: 290px;
    }
    .issue-page-info h2 {
        font-size: 42px;
    }
    .issue-page-contents {
        margin-top: 38px;
    }
    .issue-page-contents-heading {
        align-items: flex-start;
        flex-direction: column;
    }
    .archive-issue-results {
        padding: 14px;
    }
    .archive-issue-list {
        grid-template-columns: 1fr;
    }
    .advanced-search-panel {
        padding: 20px;
    }
    .advanced-search-panel .form-grid {
        grid-template-columns: 1fr;
        gap: 17px;
    }
    .advanced-search-panel .field.full {
        grid-column: auto;
    }
    .advanced-search-intro p {
        font-size: 13px;
    }
}

/* v9: issue route feedback and full-width archive detail polish */
.issue-loading,
.issue-api-error {
    width: 100%;
    min-height: 220px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 12px;
    padding: 42px 24px;
    background: linear-gradient(135deg, #f8faf8, #eef4f0);
    border: 1px solid #dce7e1;
    text-align: center;
    color: #59716f;
}
.issue-loading strong,
.issue-api-error strong {
    color: #29494c;
    font: 600 20px/1.25 var(--display);
}
.issue-loading p,
.issue-api-error p {
    max-width: 620px;
    margin: 0;
    color: #718382;
    font-size: 13px;
    line-height: 1.75;
}
.loading-orbit {
    width: 38px;
    height: 38px;
    border: 1px solid #bfd2ca;
    border-top-color: #3f7b70;
    border-right-color: #3f7b70;
    border-radius: 50%;
    animation: loadingOrbit 1.15s linear infinite;
}
@keyframes loadingOrbit {
    to {
        transform: rotate(360deg);
    }
}
.issue-api-error .secondary-button {
    margin-top: 6px;
    cursor: pointer;
}
.issue-page-contents-heading .content-heading {
    font-size: clamp(28px, 3.1vw, 39px);
}
.archive-issue-results {
    width: 100%;
}
@media (prefers-reduced-motion: reduce) {
    .loading-orbit {
        animation: none;
    }
}

/* Laravel Blade integration helpers */
.article-card[hidden] {
    display: none !important;
}
.issue-filter-row {
    margin: 0 0 24px;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}
.filter-chip span {
    opacity: 0.7;
    font-size: 0.9em;
}
.search-results .article-card {
    width: 100%;
}

/* Blade delivery refinements: database-backed listing, full-width forms and archive. */
.article-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 0;
}
.article-card {
    width: 100%;
}
.hero-issue-volume {
    margin: 22px 0 0;
    font: 500 78px/0.95 var(--display);
    letter-spacing: -0.09em;
    color: #f4f7f6;
}
.hero-issue-volume small {
    font: 400 12px var(--mono);
    letter-spacing: 0.04em;
    color: #98b4b2;
    margin-left: 9px;
}
.home-article-tools {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    margin: 0 0 22px;
    flex-wrap: wrap;
}
.home-keyword-form {
    display: flex;
    align-items: center;
    gap: 10px;
    flex: 1;
    min-width: min(100%, 420px);
}
.home-keyword-form .search-field {
    flex: 1;
    min-width: 160px;
}
.home-keyword-form input,
.advanced-search-form input,
.advanced-search-form select {
    width: 100%;
    min-height: 46px;
    padding: 11px 13px;
    border: 1px solid var(--line);
    background: #fff;
    color: var(--ink);
    font-size: 14px;
    outline: none;
}
.home-keyword-form .primary-link,
.form-actions .primary-link {
    min-height: 46px;
    padding: 0 18px;
    border: 0;
    background: var(--navy);
    color: #fff;
    font-size: 12px;
}
.home-advanced-search {
    color: var(--teal2);
    font-size: 13px;
    font-weight: 700;
}
.filter-row {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 22px 0;
}
.filter-chip {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 9px 13px;
    border: 1px solid #d2ded8;
    background: #fff;
    color: #49615b;
    font-size: 12px;
    border-radius: 2px;
}
.filter-chip.active,
.filter-chip:hover {
    background: #e4eee8;
    border-color: #91b0a4;
    color: #205b53;
}
.result-line {
    padding: 12px 0;
    border-bottom: 1px solid var(--line);
    color: #74858b;
    font: 10px var(--mono);
    letter-spacing: 0.04em;
}
.page-top {
    position: relative;
    overflow: hidden;
    padding: 76px var(--gutter) 65px;
    background: #10282f;
    color: #edf4f0;
}
.page-top:before {
    content: "";
    position: absolute;
    right: -120px;
    top: -240px;
    width: 580px;
    height: 580px;
    border: 1px solid #a1c6b52a;
    border-radius: 50%;
    box-shadow:
        0 0 0 35px #9bc8b50c,
        0 0 0 75px #9bc8b508;
    animation: aboutOrbit 38s linear infinite;
}
.page-top .section-inner {
    position: relative;
    z-index: 1;
}
.page-top .breadcrumbs {
    color: #a4b8b1;
    font: 10px var(--mono);
    margin-bottom: 28px;
}
.page-top .breadcrumbs a {
    color: #d3e1db;
}
.page-kicker {
    display: block;
    color: #a5c5ba;
    font: 10px var(--mono);
    letter-spacing: 0.12em;
    text-transform: uppercase;
}
.content-heading {
    margin: 12px 0;
    color: #f4f7f5;
    font: 500 clamp(32px, 4vw, 54px)/1.12 var(--display);
    letter-spacing: -0.045em;
}
.page-subtitle {
    max-width: 790px;
    color: #c0ceca;
    font-size: 15px;
    line-height: 1.75;
}
.page-top .text-link {
    display: inline-block;
    margin-top: 10px;
    color: #c2ded3;
}
.journal-content-section {
    background: #f6f8f6;
}
.search-page-inner {
    max-width: 1120px !important;
}
.advanced-search-form {
    width: 100%;
    padding: clamp(20px, 3vw, 36px);
    background: #fff;
    border: 1px solid var(--line);
    box-shadow: 0 18px 55px #142d2410;
}
.search-form-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
}
.form-field {
    display: grid;
    gap: 8px;
    color: #61736e;
    font-size: 12px;
    font-weight: 700;
}
.form-field span {
    font: 10px var(--mono);
    letter-spacing: 0.07em;
    text-transform: uppercase;
}
.form-field-wide {
    grid-column: 1/-1;
}
.form-actions {
    display: flex;
    align-items: center;
    gap: 18px;
    margin-top: 22px;
}
.archive-page-explorer {
    display: grid;
    grid-template-columns: minmax(250px, 0.8fr) minmax(0, 1.2fr);
    gap: 20px;
    margin-bottom: 56px;
}
.archive-periods {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
}
.period-btn {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
    padding: 13px 15px;
    border: 1px solid var(--line);
    background: #fff;
    color: #304b48;
    text-align: left;
    font-size: 15px;
}
.period-btn span {
    color: #8a9a94;
    font: 10px var(--mono);
}
.period-btn.active,
.period-btn:hover {
    background: #e4eee8;
    border-color: #91b0a4;
}
.archive-panel {
    padding: 24px;
    background: #fff;
    border: 1px solid var(--line);
}
.archive-panel-head {
    display: flex;
    justify-content: space-between;
    margin-bottom: 18px;
    color: #536962;
    font: 11px var(--mono);
    text-transform: uppercase;
}
.archive-selection {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
}
.archive-selection label {
    font-size: 13px;
    color: #61736e;
}
.archive-selection select {
    min-width: 130px;
    min-height: 42px;
}
.archive-issue-list {
    border-top: 1px solid var(--line);
    margin: 0 0 28px;
}
.archive-issue-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 20px;
    padding: 22px 16px;
    border-bottom: 1px solid var(--line);
    background: transparent;
    transition:
        background 0.5s,
        border-color 0.5s,
        transform 0.4s;
}
.archive-issue-row:hover {
    background: #e8f1ed;
    border-color: #a8c0b5;
    transform: translateX(4px);
}
.archive-issue-row strong {
    display: block;
    font-size: 18px;
    color: #23433f;
}
.about-journal-section .about-journal-main p {
    color: #455b57;
    font-size: 14px;
    line-height: 1.85;
    margin: 0 0 17px;
}
.about-journal-main h3 {
    margin: 26px 0 12px;
    color: #294943;
    font-size: 16px;
}
.about-journal-main h3:first-child {
    margin-top: 0;
}
.about-journal-layout {
    grid-template-columns: minmax(0, 1fr);
}
.research-map-fallback {
    position: relative;
    width: 100%;
    height: 100%;
    min-height: 380px;
}
.research-map-fallback svg {
    display: block;
    width: 100%;
    height: 100%;
    min-height: 380px;
}
.map-article-point {
    position: absolute;
    display: block;
    width: 18px;
    height: 18px;
    transform: translate(-50%, -50%);
    z-index: 2;
}
.map-article-point span {
    position: absolute;
    inset: 5px;
    border-radius: 50%;
    background: #bd8e69;
    box-shadow:
        0 0 0 4px #fff9,
        0 0 0 8px #7eae9b30;
    animation: mapPinPulse 2.8s ease-out infinite;
}
.map-article-point:hover span {
    background: #1d6862;
    transform: scale(1.35);
}
@keyframes mapPinPulse {
    0% {
        box-shadow:
            0 0 0 3px #fff9,
            0 0 0 6px #7eae9b35;
    }
    70% {
        box-shadow:
            0 0 0 4px #fff9,
            0 0 0 14px #7eae9b00;
    }
    100% {
        box-shadow:
            0 0 0 3px #fff9,
            0 0 0 6px #7eae9b00;
    }
}
.research-map-layout {
    display: grid;
    grid-template-columns: minmax(0, 1.5fr) minmax(230px, 0.5fr);
    gap: 24px;
}
.research-map-selected {
    padding: 24px;
    background: #10282f;
    color: #eaf2ed;
}
.research-map-selected h3 {
    font-size: 19px;
}
.research-map-selected p {
    font-size: 13px;
    line-height: 1.75;
    color: #bbcdc5;
}
.content-page-inner {
    max-width: 980px !important;
}
.content-prose {
    font-size: 15px;
    line-height: 1.9;
    color: #425953;
}
.content-prose h3 {
    margin: 30px 0 10px;
    color: #284a44;
    font-size: 21px;
}
.content-prose p {
    margin: 0 0 18px;
}
.footer {
    background: #071b22;
    color: #c4d2cd;
    padding: 55px var(--gutter) 20px;
}
.footer-inner {
    max-width: var(--max);
    margin: auto;
}
.footer-main {
    display: grid;
    grid-template-columns: minmax(220px, 0.7fr) minmax(0, 1.3fr);
    gap: 50px;
}
.footer-brand {
    display: flex;
    gap: 13px;
    align-items: center;
    align-self: start;
}
.footer-brand .brand-mark {
    color: #d7e6df;
    border-color: #738f88;
}
.footer-brand .brand-copy strong {
    color: #e8f0eb;
    font-size: 11px;
}
.footer-brand .brand-copy small {
    color: #9cb0a8;
}
.footer-links {
    display: flex;
    flex-wrap: wrap;
    gap: 12px 20px;
    font-size: 11px;
    color: #b4c4bd;
}
.footer-links a:hover {
    color: #fff;
}
.footer-bottom {
    display: flex;
    justify-content: space-between;
    gap: 18px;
    margin-top: 38px;
    padding-top: 17px;
    border-top: 1px solid #ffffff20;
    color: #829b93;
    font: 9px var(--mono);
}
.modal-backdrop[hidden] {
    display: none;
}
.modal-backdrop.open {
    display: grid;
}
.article-modal {
    max-height: 88vh;
    overflow: auto;
}
.toast {
    position: fixed;
    bottom: 26px;
    left: 50%;
    z-index: 9999;
    transform: translate(-50%, 18px);
    opacity: 0;
    pointer-events: none;
    padding: 12px 18px;
    background: #10282f;
    color: #f3f7f4;
    font-size: 12px;
    transition:
        opacity 0.25s,
        transform 0.25s;
}
.toast.show {
    opacity: 1;
    transform: translate(-50%, 0);
}
@media (max-width: 900px) {
    .search-form-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .archive-page-explorer {
        grid-template-columns: 1fr;
    }
    .research-map-layout {
        grid-template-columns: 1fr;
    }
    .about-journal-layout {
        grid-template-columns: 1fr;
    }
    .footer-main {
        grid-template-columns: 1fr;
    }
}
@media (max-width: 600px) {
    .search-form-grid {
        grid-template-columns: 1fr;
    }
    .form-field-wide {
        grid-column: auto;
    }
    .archive-periods {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .home-keyword-form {
        min-width: 100%;
    }
    .home-article-tools {
        align-items: stretch;
    }
    .footer-bottom {
        flex-direction: column;
    }
    .page-top {
        padding-top: 54px;
    }
    .archive-selection {
        align-items: stretch;
    }
    .archive-selection select {
        flex: 1;
    }
}

/* Static HTML demo helpers: behaviour only; all visible copy lives in HTML. */
[hidden] {
    display: none !important;
}
.archive-issue-results {
    margin-top: 24px;
    padding: 24px;
    background: #fff;
    border: 1px solid #dce5e1;
}
.archive-issue-list {
    display: grid;
    grid-template-columns: 1fr;
    gap: 0;
}
.archive-issue-row {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    min-height: 0;
    padding: 21px 18px;
    border-bottom: 1px solid #dce5e1;
    background: transparent;
}
.archive-issue-row strong {
    font-size: 18px;
}
.empty-state {
    padding: 24px 0;
    color: #6e8180;
}
@media (max-width: 700px) {
    .archive-issue-results {
        padding: 15px;
    }
    .archive-issue-row {
        padding: 18px 10px;
    }
}

/* v12 restoration: journal facts strip, rich research map and step-by-step archive */
.facts {
    background: #fff;
    border-bottom: 1px solid var(--line);
}
.facts-inner {
    max-width: var(--max);
    margin: auto;
    padding: 23px var(--gutter);
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
}
.fact {
    padding: 3px 22px;
    border-right: 1px solid var(--line);
}
.fact:first-child {
    padding-left: 0;
}
.fact:last-child {
    border: 0;
}
.fact span {
    display: block;
    color: #7e8b90;
    font: 9px var(--mono);
    letter-spacing: 0.12em;
    text-transform: uppercase;
}
.fact strong {
    display: block;
    margin-top: 7px;
    color: #23363e;
    font: 600 15px var(--display);
}
.archive-stepper {
    position: relative;
    max-width: 1060px;
    margin: 0 auto;
    background: #fff;
    border: 1px solid #dce5e1;
    box-shadow: 0 22px 55px rgba(15, 43, 35, 0.055);
    overflow: hidden;
}
.archive-stepper-topline {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 16px 22px;
    background: #f6f9f7;
    border-bottom: 1px solid #e1e8e4;
    color: #788a83;
    font: 10px var(--mono);
    letter-spacing: 0.1em;
}
.archive-step-panel {
    padding: clamp(22px, 3.5vw, 38px);
}
.archive-step-panel[hidden] {
    display: none !important;
}
.archive-step-heading {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    gap: 24px;
    margin-bottom: 25px;
}
.archive-step-heading h3 {
    margin: 8px 0 6px;
    color: #243e43;
    font: 600 clamp(22px, 3vw, 30px)/1.15 var(--display);
    letter-spacing: -0.04em;
}
.archive-step-heading p {
    margin: 0;
    color: #758783;
    font-size: 13px;
    line-height: 1.6;
}
.archive-step-count {
    flex: none;
    color: #8b9a95;
    font: 9px var(--mono);
    letter-spacing: 0.1em;
}
.archive-period-grid {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 10px;
}
.archive-period-card {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    min-height: 105px;
    padding: 17px 18px;
    border: 1px solid #d7e2dc;
    background: #fbfcfb;
    color: #304b48;
    text-align: left;
    transition:
        background 0.45s var(--ease),
        border-color 0.45s,
        transform 0.45s,
        box-shadow 0.45s;
    overflow: hidden;
}
.archive-period-card strong {
    font: 600 16px var(--display);
}
.archive-period-card span {
    margin-top: 7px;
    color: #8b9a95;
    font: 10px var(--mono);
}
.archive-period-card i {
    position: absolute;
    right: 15px;
    top: 13px;
    color: #bd906e;
    font-style: normal;
    opacity: 0.65;
    transition:
        transform 0.3s,
        opacity 0.3s;
}
.archive-period-card:hover {
    background: #eaf2ed;
    border-color: #a6c2b5;
    transform: translateY(-3px);
    box-shadow: 0 12px 25px rgba(25, 64, 57, 0.07);
}
.archive-period-card:hover i {
    transform: translate(3px, -3px);
    opacity: 1;
}
.archive-step-nav {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 15px;
    margin: -4px 0 24px;
    padding-bottom: 14px;
    border-bottom: 1px solid #e3eae6;
}
.archive-back-button {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 8px 0;
    border: 0;
    background: transparent;
    color: #376b62;
    font-size: 12px;
    font-weight: 700;
    transition:
        gap 0.25s,
        color 0.25s;
}
.archive-back-button:hover {
    gap: 13px;
    color: #173d3a;
}
.archive-back-secondary {
    color: #87958f;
    font-weight: 500;
}
.archive-step-crumb {
    color: #8b9a95;
    font: 9px var(--mono);
    letter-spacing: 0.12em;
}
.archive-year-grid {
    display: grid;
    grid-template-columns: repeat(7, minmax(0, 1fr));
    gap: 9px;
}
.archive-year-card {
    min-height: 52px;
    border: 1px solid #dce6e1;
    background: #fbfcfb;
    color: #435e58;
    font: 600 14px var(--mono);
    transition:
        background 0.35s,
        border-color 0.35s,
        color 0.35s,
        transform 0.35s;
}
.archive-year-card:hover {
    background: #e6f0eb;
    border-color: #9eb9ac;
    transform: translateY(-2px);
}
.archive-issue-list {
    display: flex;
    flex-direction: column;
    border-top: 1px solid #dce5e1;
}
.archive-issue-row {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    gap: 20px;
    min-height: 86px;
    padding: 18px 18px;
    border-bottom: 1px solid #dce5e1;
    background: #fff;
    transition:
        background 0.45s var(--ease),
        padding 0.4s,
        border-color 0.4s;
}
.archive-issue-row:hover {
    background: #eaf2ed;
    border-color: #a8c0b5;
    padding-left: 24px;
    transform: none;
    box-shadow: none;
}
.archive-issue-row strong {
    display: block;
    margin: 4px 0;
    color: #294248;
    font: 600 17px var(--display);
}
.archive-issue-row small {
    color: #879690;
    font-size: 11px;
}
.archive-issue-arrow {
    color: #bd906e;
    font-size: 18px;
    transition: transform 0.3s;
}
.archive-issue-row:hover .archive-issue-arrow {
    transform: translate(3px, -3px);
}
.archive-no-issues {
    padding: 26px 20px;
    background: #f6f9f7;
    border: 1px dashed #cfdbd5;
    color: #647872;
}
.archive-no-issues strong {
    display: block;
    color: #2f4a44;
    font: 600 17px var(--display);
}
.archive-no-issues p {
    font-size: 13px;
    line-height: 1.7;
}
.archive-no-issues a {
    color: #3b756b;
    font-size: 12px;
    font-weight: 700;
}
.research-map-layout {
    grid-template-columns: minmax(0, 1fr) 320px;
    gap: 0;
    min-height: 470px;
}
.research-map-canvas-wrap {
    min-height: 470px;
}
.research-fields-map {
    position: absolute;
    inset: 0;
    overflow: hidden;
    background: #e4ece7;
}
.research-map-fallback {
    display: block !important;
    position: absolute;
    inset: 0;
    overflow: hidden;
    background: linear-gradient(145deg, #e4eee8, #dbe7e0);
}
.research-map-fallback svg {
    display: block;
    width: 100%;
    height: 100%;
    min-height: 470px;
    position: absolute;
    inset: 0;
}
.fallback-map-pins {
    position: absolute;
    inset: 0;
}
.fallback-pin {
    position: absolute;
    width: 19px;
    height: 19px;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: #2c766b55;
    transform: translate(-50%, -50%);
    cursor: pointer;
    transition:
        transform 0.3s,
        background 0.3s;
    z-index: 2;
}
.fallback-pin i {
    position: absolute;
    inset: 5px;
    border: 2px solid #fff;
    border-radius: 50%;
    background: #b77f5b;
    box-shadow: 0 1px 4px #18362d44;
}
.fallback-pin:before {
    content: "";
    position: absolute;
    inset: -5px;
    border: 1px solid #3d8476;
    border-radius: 50%;
    animation: pinWave 2.6s ease-out infinite;
}
.fallback-pin:nth-child(2n):before {
    animation-delay: 0.7s;
}
.fallback-pin:nth-child(3n):before {
    animation-delay: 1.25s;
}
.fallback-pin:hover,
.fallback-pin.selected {
    transform: translate(-50%, -50%) scale(1.28);
    background: #2c766b88;
    z-index: 3;
}
.fallback-pin.selected i {
    background: #286f66;
}
.fallback-map-note {
    position: absolute;
    left: 17px;
    bottom: 15px;
    color: #627e75;
    font: 8px var(--mono);
    letter-spacing: 0.1em;
    pointer-events: none;
}
.research-map-aside {
    position: relative;
    display: flex;
    flex-direction: column;
    padding: 28px 24px 20px;
    background: #102a31;
    color: #edf4ef;
    border-left: 1px solid #ffffff1c;
    overflow: hidden;
}
.research-map-aside:before {
    content: "";
    position: absolute;
    right: -95px;
    bottom: -125px;
    width: 255px;
    height: 255px;
    border: 1px solid #a4c8b533;
    border-radius: 50%;
    box-shadow:
        0 0 0 28px #a4c8b50c,
        0 0 0 60px #a4c8b507;
    animation: aboutOrbit 45s linear infinite;
}
.map-aside-kicker {
    position: relative;
    z-index: 1;
    color: #96b1a8;
    font: 8px var(--mono);
    letter-spacing: 0.12em;
}
.map-aside-index {
    position: relative;
    z-index: 1;
    margin: 17px 0;
    color: #d6a582;
    font: 10px var(--mono);
}
.map-aside-rule {
    position: relative;
    z-index: 1;
    width: 39px;
    height: 1px;
    margin-bottom: 20px;
    background: linear-gradient(90deg, #c4906e, transparent);
}
.map-aside-field {
    position: relative;
    z-index: 1;
    color: #9dc0b3;
    font: 8px/1.6 var(--mono);
    letter-spacing: 0.08em;
}
.research-map-aside h3 {
    position: relative;
    z-index: 1;
    margin: 11px 0 12px;
    color: #f0f4f0;
    font: 500 20px/1.35 var(--display);
    letter-spacing: -0.025em;
    transition:
        opacity 0.25s,
        transform 0.25s;
}
.map-aside-place {
    position: relative;
    z-index: 1;
    margin: 0 0 13px;
    color: #c9d9d1;
    font-size: 11px;
}
.map-aside-authors {
    position: relative;
    z-index: 1;
    margin: 0;
    color: #91a9a2;
    font-size: 9px;
    line-height: 1.7;
}
.map-aside-action {
    position: relative;
    z-index: 1;
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    margin-top: 23px;
    padding: 12px 0;
    border: 0;
    border-top: 1px solid #ffffff26;
    border-bottom: 1px solid #ffffff26;
    background: transparent;
    color: #d9e8e0;
    text-align: left;
    font-size: 10px;
    cursor: pointer;
    transition:
        padding 0.35s,
        color 0.3s;
}
.map-aside-action:hover {
    padding-left: 7px;
    color: #fff;
}
.map-aside-action span {
    color: #d0a17f;
}
.map-aside-controls {
    position: relative;
    z-index: 1;
    display: flex;
    gap: 8px;
    margin-top: auto;
    padding-top: 24px;
}
.map-aside-controls button {
    width: 35px;
    height: 35px;
    border: 1px solid #ffffff37;
    background: #ffffff08;
    color: #d5e3dd;
    font-size: 16px;
    cursor: pointer;
    transition:
        background 0.3s,
        border-color 0.3s,
        transform 0.3s;
}
.map-aside-controls button:hover {
    background: #ffffff18;
    border-color: #9fc6b4;
    transform: translateY(-2px);
}
.research-map-legend {
    display: flex;
    align-items: center;
    gap: 19px;
    flex-wrap: wrap;
    padding: 13px 18px;
    background: #0d2329;
    border-top: 1px solid #ffffff1c;
    color: #9db2ad;
    font: 8px var(--mono);
    letter-spacing: 0.04em;
}
.research-map-legend > span {
    display: flex;
    align-items: center;
    gap: 7px;
}
.legend-dot {
    display: inline-block;
    width: 7px;
    height: 7px;
    border-radius: 50%;
}
.legend-dot.teal {
    background: #92c2b3;
}
.legend-dot.copper {
    background: #d09c79;
}
.research-map-legend .map-precision-note {
    margin-left: auto;
    color: #829a94;
    letter-spacing: 0;
    text-transform: none;
}
@media (max-width: 1000px) {
    .research-map-layout {
        grid-template-columns: minmax(0, 1fr) 285px;
    }
    .archive-period-grid {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
    .archive-year-grid {
        grid-template-columns: repeat(6, minmax(0, 1fr));
    }
}
@media (max-width: 760px) {
    .facts-inner {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        row-gap: 16px;
    }
    .fact {
        padding: 4px 14px;
        border-right: 0;
    }
    .fact:nth-child(odd) {
        padding-left: 0;
        border-right: 1px solid var(--line);
    }
    .fact:nth-child(even) {
        padding-left: 20px;
    }
    .fact:nth-child(n + 3) {
        padding-top: 15px;
        border-top: 1px solid var(--line);
    }
    .archive-period-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .archive-year-grid {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
    .archive-step-heading {
        align-items: flex-start;
    }
    .archive-step-count {
        padding-top: 5px;
    }
    .research-map-layout {
        grid-template-columns: 1fr;
    }
    .research-map-canvas-wrap {
        min-height: 360px;
    }
    .research-map-fallback svg {
        min-height: 360px;
    }
    .research-map-aside {
        min-height: 300px;
        border-left: 0;
        border-top: 1px solid #ffffff1c;
        padding: 22px 20px;
    }
}
@media (max-width: 440px) {
    .archive-stepper-topline {
        padding: 14px 16px;
    }
    .archive-step-panel {
        padding: 20px 16px;
    }
    .archive-year-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
    .archive-period-card {
        min-height: 88px;
        padding: 13px;
    }
    .archive-period-card strong {
        font-size: 14px;
    }
    .research-map-canvas-wrap {
        min-height: 300px;
    }
    .research-map-fallback svg {
        min-height: 300px;
    }
    .research-map-legend {
        gap: 10px;
    }
    .research-map-legend .map-precision-note {
        margin-left: 0;
        width: 100%;
    }
    .research-map-aside h3 {
        font-size: 18px;
    }
}

/* v13 refinements: compact live keyword results, stable map, viewport-fixed article dialog */
.nav-keyword-form {
    position: relative;
    z-index: 720;
    width: clamp(175px, 17vw, 235px);
    flex: 0 0 clamp(175px, 17vw, 235px);
    margin: 0;
}
.nav-keyword-form > .search-field {
    width: 100%;
    min-width: 0;
    height: 38px;
    padding: 0 10px;
    gap: 8px;
}
.nav-keyword-form > .search-field input {
    font-size: 11px;
}
.quick-search-panel {
    position: absolute;
    z-index: 1200;
    top: calc(100% + 9px);
    right: 0;
    width: min(430px, calc(100vw - 28px));
    max-height: 350px;
    overflow: auto;
    background: #fff;
    border: 1px solid #d7e2dd;
    box-shadow: 0 18px 48px #10283226;
    padding: 7px;
}
.quick-search-panel[hidden] {
    display: none !important;
}
.quick-search-item {
    display: grid;
    width: 100%;
    gap: 4px;
    padding: 12px 13px;
    border: 0;
    border-bottom: 1px solid #e8eeeb;
    background: #fff;
    text-align: left;
    transition:
        background 0.35s,
        padding 0.3s;
}
.quick-search-item:last-child {
    border-bottom: 0;
}
.quick-search-item:hover,
.quick-search-item:focus-visible {
    padding-left: 17px;
    background: #edf4f0;
    outline: 0;
}
.quick-search-item-field {
    color: #66857c;
    font: 8px var(--mono);
    letter-spacing: 0.07em;
    text-transform: uppercase;
}
.quick-search-item-title {
    color: #2b4349;
    font: 600 12px/1.45 var(--display);
}
.quick-search-item-authors {
    color: #7c898b;
    font-size: 9px;
    line-height: 1.45;
}
.quick-search-empty {
    margin: 0;
    padding: 18px 13px;
    color: #718084;
    font-size: 11px;
}
.quick-search-advanced {
    display: flex;
    justify-content: flex-end;
    padding: 11px 13px;
    border-top: 1px solid #e4ebe7;
    color: #2f6860;
    font-size: 10px;
    font-weight: 700;
}
.quick-search-advanced:hover {
    color: #173c3a;
}
.quick-search-catalog {
    display: none !important;
}
@media (max-width: 1100px) {
    .nav-keyword-form {
        display: none;
    }
}

/* Keep the map module at a constant height regardless of the selected article title. */
.research-map-section .research-map-layout {
    height: 470px;
    min-height: 470px;
    max-height: 470px;
    grid-template-columns: minmax(0, 1fr) 310px;
    align-items: stretch;
}
.research-map-section .research-map-canvas-wrap {
    height: 470px;
    min-height: 470px;
    max-height: 470px;
}
.research-map-section .research-fields-map,
.research-map-section .research-map-fallback {
    height: 100%;
    min-height: 0;
}
.research-map-section .research-map-fallback svg {
    height: 100%;
    min-height: 0;
}
.research-map-section .research-map-aside {
    height: 470px;
    min-height: 470px;
    max-height: 470px;
}
.research-map-section .research-map-aside h3 {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 4;
    overflow: hidden;
    min-height: 108px;
    max-height: 108px;
    line-height: 1.35;
}
.research-map-section .map-aside-authors {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    overflow: hidden;
    min-height: 44px;
}
@media (max-width: 760px) {
    .research-map-section .research-map-layout {
        height: auto;
        min-height: 0;
        max-height: none;
        grid-template-columns: 1fr;
    }
    .research-map-section .research-map-canvas-wrap {
        height: 360px;
        min-height: 360px;
        max-height: 360px;
    }
    .research-map-section .research-map-aside {
        height: 310px;
        min-height: 310px;
        max-height: 310px;
    }
    .research-map-section .research-map-aside h3 {
        min-height: 73px;
        max-height: 73px;
        -webkit-line-clamp: 3;
        font-size: 18px;
    }
}
@media (max-width: 440px) {
    .research-map-section .research-map-canvas-wrap {
        height: 300px;
        min-height: 300px;
        max-height: 300px;
    }
}

/* Modal backdrops are moved to body by JS, so fixed positioning is viewport-relative. */
.modal-backdrop[hidden] {
    display: none !important;
}
.modal-backdrop {
    position: fixed !important;
    inset: 0 !important;
    width: 100vw;
    height: 100vh;
    height: 100dvh;
    min-height: 100vh;
    min-height: 100dvh;
    z-index: 2000;
    display: grid;
    place-items: center;
    overflow-y: auto;
    overscroll-behavior: contain;
    padding: clamp(12px, 3vh, 28px) 16px;
}
.article-modal {
    width: min(760px, 100%);
    max-height: calc(100dvh - 48px);
    margin: auto;
    overscroll-behavior: contain;
    scrollbar-gutter: stable;
}
.modal-backdrop.open .article-modal {
    transform: translateY(0) scale(1);
}
@media (max-width: 600px) {
    .modal-backdrop {
        padding: 10px;
    }
    .article-modal {
        max-height: calc(100dvh - 20px);
        padding: 34px 20px 24px;
    }
}

/* Final requested refinements: hero issue tilt, search field checkboxes, submit menu. */
.hero-issue {
    transform: perspective(1050px) rotateX(var(--hero-rotate-x, 0deg))
        rotateY(var(--hero-rotate-y, 0deg)) translateZ(0);
    transform-style: preserve-3d;
    will-change: transform;
}
.hero-issue.is-pointer-active {
    transition:
        transform 0.12s ease-out,
        border-color 0.25s;
}
@media (prefers-reduced-motion: reduce) {
    .hero-issue {
        transform: none !important;
        will-change: auto;
    }
}
.submit-menu-wrap {
    position: relative;
    display: inline-flex;
    align-items: center;
}
.submit-menu-trigger {
    font-family: inherit;
    cursor: pointer;
}
.submit-menu[hidden] {
    display: none !important;
}
.submit-menu {
    position: absolute;
    z-index: 950;
    top: calc(100% + 9px);
    right: 0;
    min-width: 166px;
    padding: 6px;
    background: #fff;
    border: 1px solid #d9e4de;
    box-shadow: 0 18px 42px rgba(13, 35, 39, 0.2);
}
.submit-menu a {
    display: flex;
    align-items: center;
    min-height: 42px;
    padding: 10px 13px;
    color: #294843;
    font-size: 12px;
    font-weight: 650;
    text-decoration: none;
    transition:
        background 0.25s,
        padding 0.25s,
        color 0.25s;
}
.submit-menu a + a {
    border-top: 1px solid #e8eeea;
}
.submit-menu a:hover,
.submit-menu a:focus-visible {
    padding-left: 18px;
    background: #edf4f0;
    color: #173e3b;
    outline: 0;
}
.search-in-field {
    min-width: 0;
    margin: 0;
    padding: 0;
    border: 0;
}
.search-in-field legend {
    margin: 0 0 9px;
    padding: 0;
    color: #61736e;
    font: 10px var(--mono);
    letter-spacing: 0.07em;
    text-transform: uppercase;
}
.search-in-options {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}
.search-in-option {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    min-height: 48px;
    padding: 10px 16px;
    border: 1px solid #d8e2dd;
    background: #fff;
    color: #405b55;
    cursor: pointer;
    transition:
        background 0.28s,
        border-color 0.28s,
        transform 0.28s,
        box-shadow 0.28s;
}
.search-in-option:hover {
    transform: translateY(-2px);
    border-color: #9bb8aa;
}
.search-in-option input {
    flex: none;
    width: 16px !important;
    height: 16px;
    min-height: 16px !important;
    margin: 0;
    padding: 0;
    accent-color: #285e55;
}
.search-in-option span {
    font: 600 12px var(--display);
    letter-spacing: 0;
    text-transform: none;
}
.search-in-option input:checked + span {
    color: #1c6157;
}
.search-in-option:has(input:checked) {
    background: #edf4f0;
    border-color: #91b3a5;
    box-shadow: inset 0 0 0 1px #91b3a526;
}
.issue-article-tools {
    justify-content: flex-end;
}
@media (max-width: 1150px) {
    .submit-menu-wrap {
        display: none;
    }
}
@media (max-width: 700px) {
    .search-in-options {
        display: grid;
        grid-template-columns: 1fr;
        gap: 8px;
    }
    .search-in-option {
        width: 100%;
    }
}
/* Hidden mobile drawer must not intercept pointer events over the hero card. */
.drawer-backdrop:not(.open) {
    pointer-events: none;
}
.drawer-backdrop.open {
    pointer-events: auto;
}

/* v15: Leaflet basemap host and supplied Volume 180 journal scan. */
.leaflet-map-canvas {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
    background: #e4ece7;
}
.research-fields-map.leaflet-ready .research-map-fallback {
    display: none !important;
}
.leaflet-container {
    width: 100%;
    height: 100%;
    font-family: var(--body);
    background: #e4ece7;
    z-index: 1;
}
.leaflet-control-zoom a {
    color: #234b49 !important;
    border-color: #d5e1db !important;
}
.leaflet-control-attribution {
    font-size: 9px !important;
    color: #5f7470 !important;
}
.leaflet-research-marker-host {
    background: transparent;
    border: 0;
}
.leaflet-research-marker {
    position: relative;
    display: grid;
    place-items: center;
    width: 26px;
    height: 26px;
    border: 1px solid #2c766b88;
    border-radius: 50%;
    background: #2c766b33;
    transition:
        background 0.25s,
        transform 0.25s;
}
.leaflet-research-marker i {
    display: block;
    width: 11px;
    height: 11px;
    border: 2px solid #fff;
    border-radius: 50%;
    background: #bd8e69;
    box-shadow: 0 1px 5px #142c3350;
}
.leaflet-research-marker:before {
    content: "";
    position: absolute;
    inset: 1px;
    border: 1px solid #3d8476;
    border-radius: 50%;
    animation: leafletMarkerPulse 2.5s ease-out infinite;
}
.leaflet-research-marker.is-selected {
    transform: scale(1.17);
    background: #2c766b66;
    border-color: #1d665d;
}
.leaflet-research-marker.is-selected i {
    background: #1d665d;
}
@keyframes leafletMarkerPulse {
    0% {
        transform: scale(0.8);
        opacity: 0.9;
    }
    75% {
        transform: scale(1.55);
        opacity: 0;
    }
    100% {
        transform: scale(1.55);
        opacity: 0;
    }
}
.issue-page-cover .cover-stage-image {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 360px;
    padding: 16px;
    background: radial-gradient(
        ellipse at 50% 52%,
        #e2e9e5 0,
        #edf1ef 60%,
        #f5f7f5 100%
    );
}
.issue-page-cover .journal-cover-image {
    position: relative;
    z-index: 1;
    display: block;
    width: auto;
    height: auto;
    max-width: min(100%, 285px);
    max-height: 385px;
    object-fit: contain;
    object-position: center;
    background: #fff;
    border: 1px solid #d5ddd8;
    box-shadow: 14px 18px 30px #142c3326;
    transform: perspective(1100px) rotateY(-4deg);
    transition:
        transform 0.5s var(--ease),
        box-shadow 0.5s;
}
.issue-page-cover .cover-stage-image:hover .journal-cover-image {
    transform: perspective(1100px) rotateY(0) translateY(-5px);
    box-shadow: 18px 24px 38px #142c3330;
}
@media (max-width: 700px) {
    .issue-page-cover .cover-stage-image {
        min-height: 330px;
    }
    .issue-page-cover .journal-cover-image {
        max-height: 345px;
        max-width: min(100%, 255px);
        transform: none;
    }
}

/* POPUP ARKA PLAN */
.announcement-popup {
    display: none;
    position: fixed;
    inset: 0;
    z-index: 2147483647;
    background: rgba(12, 25, 22, .72);
    backdrop-filter: blur(5px);
    align-items: center;
    justify-content: center;
    padding: 24px;
    box-sizing: border-box;
}

.announcement-popup.active {
    display: flex;
}

/* POPUP PENCERESİ */
.announcement-popup-content {
    position: relative;
    width: min(680px, 100%);
    max-height: min(80vh, 760px);
    overflow-y: auto;
    padding: 54px 58px 48px;
    background: #fff;
    border: 1px solid rgba(35, 85, 67, .12);
    border-radius: 5px;
    box-shadow: 0 25px 90px rgba(0, 0, 0, .25);
    box-sizing: border-box;
    animation: announcementPopupIn .3s ease both;
}

/* ÜST DETAY */
.announcement-popup-content::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 5px;
    background: #527e68;
}

/* KAPATMA */
.announcement-popup-close {
    position: absolute;
    top: 18px;
    right: 22px;
    width: 36px;
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #e4eae6;
    border-radius: 50%;
    background: #f7f9f7;
    color: #40594b;
    font-size: 25px;
    line-height: 1;
    cursor: pointer;
    transition: .2s ease;
}

.announcement-popup-close:hover {
    background: #527e68;
    color: #fff;
    border-color: #527e68;
}

/* DUYURU BAŞLIĞI */
.announcement-popup-content h2,
.announcement-popup-content h3 {
    color: #263d32;
    font-family: inherit;
    font-size: clamp(23px, 3vw, 30px);
    font-weight: 600;
    line-height: 1.3;
    margin: 0 0 24px;
}

/* DUYURU METNİ */
.announcement-popup-content p {
    color: #53635a;
    font-size: 15px;
    line-height: 1.9;
    text-align: justify;
    margin: 0 0 16px;
}

.announcement-popup-content ul,
.announcement-popup-content ol {
    padding-left: 22px;
    color: #53635a;
    line-height: 1.8;
}

.announcement-popup-content a {
    color: #527e68;
    text-decoration: underline;
    text-underline-offset: 3px;
}

/* KARTIN ESKİ TASARIMINI ETKİSİZLEŞTİR */
.announcement-popup-content .announcement-card {
    width: 100%;
    max-width: none;
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}

/* AÇILIŞ ANİMASYONU */
@keyframes announcementPopupIn {
    from {
        opacity: 0;
        transform: translateY(15px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* MOBİL */
@media (max-width: 600px) {
    .announcement-popup {
        padding: 14px;
    }

    .announcement-popup-content {
        padding: 48px 24px 28px;
        max-height: 88vh;
    }

    .announcement-popup-content p {
        font-size: 14px;
        text-align: left;
    }
}

.popup-announcement-item {
    width: 100%;
}

.popup-announcement-label {
    display: flex;
    align-items: center;
    gap: 9px;
    margin-bottom: 18px;
    color: #648574;
    font-size: 20px;
    font-weight: 700;
    letter-spacing: 2px;
}

.popup-announcement-dot {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #648574;
}

.popup-announcement-title {
    margin: 0 0 12px;
    padding-bottom: 0;
    border-bottom: none;
    color: #263b31;
    font-size: 23px;
    font-weight: 600;
    line-height: 1.3;
}

.popup-announcement-text {
    color: #53635a;
    font-size: 15px;
    line-height: 1.9;
    overflow-wrap: anywhere;
}

.popup-announcement-text p {
    margin: 0 0 16px;
    text-align: justify;
}

.popup-announcement-text img {
    max-width: 100%;
    height: auto;
    border-radius: 5px;
}

.popup-announcement-text a {
    color: #527e68;
    text-decoration: underline;
    text-underline-offset: 3px;
}

.popup-announcement-text ul,
.popup-announcement-text ol {
    padding-left: 24px;
    margin-bottom: 18px;
}

/* Keep the mobile drawer above sticky headers and fixed page controls. */
.drawer-backdrop {
    z-index: 2147483646;
}

/* The home map title must not change the height of the information panel. */
.research-map-section .research-map-aside #title {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 4;
    min-height: 84px;
    max-height: 84px;
    overflow: hidden;
    overflow-wrap: anywhere;
}

/* Keep Leaflet popups within the visible viewport on narrow screens. */
.leaflet-popup-content-wrapper {
    max-width: calc(100vw - 28px);
    box-sizing: border-box;
}
.leaflet-popup-content {
    max-width: calc(100vw - 72px) !important;
    overflow-wrap: anywhere;
    word-break: normal;
}

@media (max-width: 760px) {
    .research-map-section .research-map-aside #title {
        -webkit-line-clamp: 3;
        min-height: 63px;
        max-height: 63px;
    }

    .leaflet-popup-content {
        max-height: min(38vh, 180px);
        overflow-x: hidden;
        overflow-y: auto;
    }
}