:root { --blue:#004a95; --navy:#092c50; --paper:#f9fbfd; --mist:#edf2f8; --ink:#263e56; --muted:#5e7185; --gold:#c9af7c; --line:#cfdae5; }
html { scroll-padding-top:100px; }
body { padding-bottom:80px; }
.section-width { width:min(1200px,calc(100% - 104px)); }
.section-space { padding-block:104px; }
.site-header { background:#fff; }
.header-inner { height:80px; width:min(1320px,calc(100% - 80px)); gap:24px; }
.brand-mark { border-radius:0; height:42px; width:38px; border:1px solid var(--blue); background:transparent; color:var(--blue); }
.brand-name { letter-spacing:3px; font-size:22px; }
.brand-name small { font-size:9px; letter-spacing:2px; }
.main-nav { gap:30px; margin-left:auto; }
.main-nav a { padding-block:28px; color:#465c73; }
.header-music { display:flex; align-items:center; justify-content:center; gap:10px; background:transparent; border:1px solid var(--line); padding:10px 15px; color:var(--blue); font-size:12px; white-space:nowrap; }
.music-bars { display:flex; align-items:center; gap:3px; height:15px; }
.music-bars i { display:block; height:5px; width:2px; background:currentColor; }
.music-bars i:nth-child(2) { height:13px; }.music-bars i:nth-child(3) { height:9px; }
.is-playing .music-bars i { animation:equalize 1s ease-in-out infinite alternate; }.is-playing .music-bars i:nth-child(2) { animation-delay:.3s; }.is-playing .music-bars i:nth-child(3) { animation-delay:.6s; }
@keyframes equalize { from{transform:scaleY(.35)} to{transform:scaleY(1)} }
.exhibition-hero { min-height:660px; height:calc(100svh - 80px); max-height:900px; position:relative; color:white; display:flex; align-items:center; overflow:hidden; background:var(--navy); }
.hero-photo,.hero-shade { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:54% center; }
.hero-shade { background:linear-gradient(90deg,rgba(3,24,48,.85),rgba(3,24,48,.50) 45%,rgba(3,24,48,.08)),linear-gradient(0deg,rgba(3,24,48,.65),transparent 35%); }
.hero-content { position:relative; z-index:1; padding-block:55px 100px; }
.exhibition-label { font-size:11px; letter-spacing:4px; display:flex; align-items:center; gap:14px; color:#e4eaf1; }
.exhibition-label > span { width:35px; height:1px; background:var(--gold); }
.hero-date { font:18px Georgia,serif; color:#e2ceb0; letter-spacing:3px; margin:40px 0 12px; }
.hero-date span { padding-inline:5px; color:#b9c8d6; }.hero-date { font-size:16px; }
.exhibition-hero h1 { font:500 clamp(74px,8vw,118px)/1.25 var(--serif); letter-spacing:.14em; text-shadow:0 2px 15px #00182d35; }
.hero-subtitle { font:24px/1.8 var(--serif); letter-spacing:3px; margin-top:20px; }
.hero-deck { font-size:13px; line-height:2; color:#d0dbe6; margin-top:21px; letter-spacing:.5px; }
.hero-actions { gap:28px; margin-top:30px; }
.hero-enter { border-radius:0; background:#f5f8fc; color:var(--navy); padding-inline:25px; gap:40px; }
.hero-enter:hover { background:var(--gold); }
.hero-listen { color:#e1e8f0; background:transparent; border:0; border-bottom:1px solid #aebbc680; padding:12px 0; font-size:12px; }
.hero-listen > span { font-size:18px; margin-right:8px; }
.hero-listen:hover { color:white; border-color:white; }
.hero-bottom { position:absolute; bottom:28px; left:0; right:0; display:flex; align-items:center; gap:24px; font-size:10px; color:#c9d5df; border-top:1px solid #ffffff45; padding-top:22px; }
.hero-bottom > span:first-child { font:17px var(--serif); letter-spacing:6px; color:#e1c99e; }
.hero-bottom a { margin-left:auto; letter-spacing:1px; }
.hero-photo-credit { font-size:9px; opacity:.8; }
.hero-vertical { position:absolute; right:45px; top:95px; writing-mode:vertical-rl; font:16px var(--serif); letter-spacing:7px; color:#e7edf4; }
.prologue { display:grid; grid-template-columns:1.05fr 1fr .9fr; gap:24px; padding-block:80px; }
.prologue-text { padding:9px 38px 8px 0; }.prologue-text h2 { font-size:28px; line-height:1.6; letter-spacing:.02em; }.prologue-text > p:not(.section-kicker) { font-size:12px; line-height:2; color:var(--muted); margin-top:22px; }.subtle-link { display:inline-block; font-size:10px; color:var(--blue); border-bottom:1px solid var(--line); padding-block:7px; margin-top:13px; }.subtle-link:hover { border-color:var(--blue); }
.chapter-tile { min-height:190px; position:relative; padding:26px; display:flex; flex-direction:column; justify-content:space-between; overflow:hidden; transition:transform .25s; }.chapter-tile:hover { transform:translateY(-4px); }.tile-history { background:linear-gradient(0deg,#051e3cf0,#051e3c40),url('assets/archive-1.jpg') center/cover; color:white; min-height:380px; }.tile-history::after { content:'当代校史展陈 / 浙江大学官网'; position:absolute; right:12px; top:12px; font-size:8px; writing-mode:vertical-rl; letter-spacing:1px; color:#e9e3dd; }.tile-num { font:26px var(--serif); opacity:.65; }.chapter-tile small { font-size:9px; letter-spacing:1px; opacity:.75; }.chapter-tile h3 { font:25px/1.5 var(--serif); letter-spacing:1px; margin-top:8px; }.chapter-tile p { font-size:11px; margin-top:8px; opacity:.8; }.tile-arrow { position:absolute; right:22px; bottom:25px; font-size:22px; }.chapter-stack { display:grid; gap:24px; }.tile-people { background:#e6edf5; color:var(--navy); }.tile-journey { background:#d4dfe9; color:var(--navy); min-height:165px; }.tile-journey h3 { font-size:23px; }
.section-kicker { display:flex; align-items:center; gap:14px; font-size:11px; letter-spacing:2px; margin-bottom:20px; }.chapter-number { font:16px Georgia,serif; letter-spacing:0; border-right:1px solid currentColor; padding-right:14px; opacity:.6; }
h2 { font-size:42px; line-height:1.45; font-weight:500; letter-spacing:.03em; }h2 em { font-style:normal; color:var(--blue); }.section-heading { margin-bottom:48px; }.section-intro { font-size:12px; line-height:2; }
.chronicle { padding-top:45px; border-top:1px solid var(--line); }.chronicle-layout { grid-template-columns:250px minmax(0,1fr); gap:55px; }.event-index-wrap { top:115px; }.event-tab { min-height:66px; gap:16px; }.tab-label { font-size:11px; }.index-heading { letter-spacing:1px; }.reading-hint { padding-left:0; font-size:9px; line-height:1.8; }.event-panel { background:#fff; border:1px solid var(--line); border-top:3px solid var(--blue); border-radius:0; padding:30px 48px 22px; min-height:775px; }.event-year { font-size:115px; color:#174d7f; margin-top:24px; letter-spacing:-5px; }.event-topline { font-size:10px; }.event-panel h3 { font-size:30px; }.event-meta { color:#637a90; }.event-lead { font:18px/1.9 var(--serif); color:var(--navy); }.event-body { line-height:2.1; font-size:13px; }.event-note { background:#f2f5f9; border-color:var(--gold); }.event-note p { font-size:11px; }.event-note > span { color:#736044; }.event-sources { font-size:9px; }.event-keywords { gap:18px; }.event-pagination { margin-top:20px; }.event-related { display:flex; flex-wrap:wrap; align-items:center; gap:10px; border-top:1px solid #e1e7ee; margin-top:22px; padding-top:17px; font-size:10px; }.event-related > span { color:var(--muted); margin-right:5px; }.event-related button { color:var(--blue); border:1px solid #cbd9e7; background:#f9fbfd; padding:7px 10px; font-size:11px; }.event-related button:hover { border-color:var(--blue); }.chronicle-tail { margin:50px 0 0 305px; display:flex; align-items:center; gap:25px; }.chronicle-tail > span { font:50px Georgia,serif; letter-spacing:-2px; color:#bdcbd9; }.chronicle-tail p { font:12px/1.9 var(--serif); color:var(--muted); }.chronicle-tail a { font-size:10px; color:var(--blue); margin-left:auto; white-space:nowrap; }
.people-section { background:#eaf0f6; overflow:hidden; }.people-tools { display:flex; align-items:center; justify-content:space-between; gap:24px; padding-bottom:25px; border-bottom:1px solid #c3d1df; }.people-filters { display:flex; flex-wrap:wrap; gap:8px; }.people-filters button { background:transparent; border:1px solid transparent; color:#536a80; padding:9px 15px; font-size:11px; }.people-filters button[aria-pressed='true'] { color:white; background:var(--navy); }.people-filters button:hover { border-color:#aac0d5; }.people-filters button span { opacity:.55; margin-left:5px; font:10px Georgia,serif; }.people-search { display:flex; align-items:center; gap:8px; border-bottom:1px solid #8ea5ba; padding-block:6px; color:var(--blue); min-width:0; }.people-search > span { font-size:24px; line-height:1; }.people-search input { width:165px; min-width:0; background:transparent; border:0; font:11px var(--sans); color:var(--navy); padding:6px; }.people-search input::placeholder { color:#657b90; }.gallery-topline { display:flex; justify-content:space-between; gap:15px; font-size:10px; color:#647a90; margin-block:23px; }.gallery-topline > span { font-size:9px; }
.splide { position:relative; visibility:visible; }.splide__track { overflow:hidden; position:relative; z-index:0; }.splide__list { display:flex; backface-visibility:hidden; margin:0!important; padding:0!important; list-style:none!important; height:100%; }.splide__slide { flex-shrink:0; position:relative; margin:0; list-style:none!important; box-sizing:border-box; width:calc(33.333% - 16px); margin-right:24px; }.splide__arrows { display:flex; justify-content:flex-end; gap:8px; margin-top:25px; }.splide__arrow { position:static; transform:none; width:42px; height:42px; border-radius:50%; border:1px solid #91a7bc; color:var(--navy); background:transparent; font-size:20px; display:grid; place-items:center; }.splide__arrow:not(:disabled):hover { background:var(--navy); color:white; }.splide__arrow:disabled { opacity:.3; }.splide__sr { position:absolute; width:1px; height:1px; padding:0; overflow:hidden; clip:rect(0,0,0,0); border:0; }.splide:not(.is-initialized) .splide__list { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px; }.splide:not(.is-initialized) .splide__slide { width:auto; margin:0; }.splide:not(.is-initialized) .splide__arrows { display:none; }
.person-card { display:block; text-align:left; border:0; width:100%; padding:0; background:transparent; color:var(--navy); }.person-visual { height:305px; overflow:hidden; position:relative; background:#d5dee7; }.person-visual::after { content:''; position:absolute; inset:0; border:1px solid #12395815; pointer-events:none; }.person-visual img { width:100%; height:100%; object-fit:cover; object-position:center 24%; filter:grayscale(1); transition:transform .5s; }.person-card:hover .person-visual img { transform:scale(1.045); }.portrait-number { position:absolute; top:17px; left:17px; z-index:1; color:#fff; background:#092c50b8; font:12px Georgia,serif; padding:7px 8px; }.portrait-field { position:absolute; left:18px; bottom:16px; color:white; font-size:9px; padding:6px 9px; background:#092c50d9; letter-spacing:1px; }.person-card-copy { padding:23px 2px 20px; border-bottom:1px solid #becddc; }.person-name-row { display:flex; align-items:baseline; justify-content:space-between; gap:15px; }.person-name-row h3 { font:30px var(--serif); letter-spacing:4px; }.person-name-row > span { font:12px Georgia,serif; color:#73869a; }.person-roman { font-size:8px; letter-spacing:2px; color:#73869a; margin-top:7px; }.person-tagline { font:14px/1.7 var(--serif); margin-top:19px; }.person-connection { font-size:10px; color:#60758a; margin-top:9px; line-height:1.9; min-height:38px; }.person-open { display:block; font-size:10px; color:var(--blue); margin-top:19px; }.person-open > span { float:right; font-size:18px; }.gallery-footnote { font-size:9px; color:#687d91; line-height:1.9; margin-top:12px; }.people-empty { text-align:center; padding:70px 20px; color:var(--muted); font-size:14px; border-bottom:1px solid var(--line); }.people-empty button { border:0; background:transparent; color:var(--blue); text-decoration:underline; margin-top:20px; font-size:12px; }.discipline-art { height:100%; position:relative; display:grid; place-items:center; color:#c1d3e3; background:#153c61; overflow:hidden; }.discipline-art svg { position:absolute; width:100%; height:100%; inset:0; }.discipline-art strong { font:64px var(--serif); font-weight:400; letter-spacing:10px; position:relative; color:#f0f4f8; }.discipline-art small { position:absolute; right:15px; top:20px; writing-mode:vertical-rl; font-size:9px; letter-spacing:3px; color:#c2d3e2; }.people-context { margin-top:45px; padding:38px 0 0; border-top:1px solid #bfcedd; display:grid; grid-template-columns:140px 1fr 1.1fr; gap:25px 30px; align-items:start; }.people-context > span { font-size:10px; color:var(--blue); padding-top:7px; }.people-context h3 { font:23px/1.65 var(--serif); }.people-context > p { font-size:11px; line-height:2; color:#5d7288; }.people-context > div { grid-column:2/4; display:flex; gap:24px; }.people-context button { border:0; border-bottom:1px solid #a2b7cc; background:transparent; padding:0 0 8px; color:var(--blue); font-size:11px; }
.journey { background:#092c50; }.journey-chapter { display:flex; justify-content:space-between; align-items:center; border-bottom:1px solid #ffffff25; padding-bottom:38px; margin-bottom:55px; gap:45px; }.journey-chapter > span { font:80px/.9 Georgia,serif; letter-spacing:-3px; color:#d7b67e; }.journey-chapter > div { display:flex; align-items:center; flex:1; gap:30px; font-size:10px; color:#a4b9ce; }.journey-line { flex:1; height:1px; background:#627b93; position:relative; }.journey-line::after { content:'→'; position:absolute; right:0; top:-8px; }.journey h2 { font-size:44px; }.journey .section-kicker { color:#d6bc92; }.journey-intro { font-size:12px; }.route-frame { background:#123656; border-color:#4c6580; border-radius:0; padding:28px 32px 20px; }.route-map { height:240px; }.stop-dot { border-color:#123656; background:#123656; }.route-stop strong { font-size:18px; }.route-note { color:#a7bcd0; }.route-detail { padding-top:30px; }.route-detail-story p { font-size:12px; line-height:2; }.route-controls { margin-top:15px; }.wartime-stories { display:grid; grid-template-columns:.7fr 1.3fr; gap:65px; padding:45px 0; border-bottom:1px solid #ffffff25; }.wartime-number { border-right:1px solid #ffffff25; }.wartime-number strong { font:80px/1 Georgia,serif; color:var(--gold); letter-spacing:-3px; }.wartime-number strong > span { font:13px var(--serif); letter-spacing:1px; margin-left:12px; }.wartime-number p { font-size:10px; color:#a7b9cb; line-height:2; margin-top:17px; }.small-kicker { font-size:10px; color:var(--gold); letter-spacing:1px; }.wartime-stories h3 { font:24px/1.7 var(--serif); color:#edf4f9; margin-top:12px; }.wartime-stories > div > p:not(.small-kicker) { font-size:11px; line-height:2; color:#a7bbcf; margin-top:12px; max-width:500px; }.wartime-people { display:flex; gap:22px; flex-wrap:wrap; margin-top:22px; }.wartime-people button { border:0; padding:0 0 7px; border-bottom:1px solid #8299b0; background:transparent; color:#dfc89e; font-size:11px; }.journey-reflection { margin-top:32px; }.journey-reflection p { font-size:17px; }
.anthem-section { display:grid; grid-template-columns:1fr 1fr; gap:120px; }.anthem-intro { font-size:12px; line-height:2.1; color:var(--muted); max-width:360px; margin-top:23px; }.record-stage { width:330px; height:340px; position:relative; margin:35px 0 15px; display:flex; align-items:flex-start; }.record-disc { border-radius:50%; width:300px; height:300px; display:grid; place-items:center; background:repeating-radial-gradient(circle at center,#122e46 0,#122e46 2px,#284359 3px,#122e46 4px); box-shadow:6px 15px 25px #102d5020; animation:spin 24s linear infinite; animation-play-state:paused; }.record-disc.is-playing { animation-play-state:running; }.record-label { width:130px; height:130px; background:#e2d6bd; border:1px solid #c2af8c; color:#233d57; border-radius:50%; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; }.record-label > span { font-size:10px; letter-spacing:2px; }.record-label strong { font:30px var(--serif); margin-top:9px; letter-spacing:4px; }.record-label small { font-size:7px; margin-top:9px; }.record-play { position:absolute; right:12px; bottom:38px; height:64px; width:64px; border-radius:50%; display:grid; place-items:center; border:5px solid var(--paper); background:var(--blue); color:white; font-size:25px; box-shadow:0 3px 12px #092c5020; }.record-play:hover { background:#1764ad; }.record-caption { position:absolute; bottom:0; left:0; color:#7b8da1; letter-spacing:2px; font-size:8px; }.anthem-tip { color:var(--muted); font-size:10px; line-height:1.9; }.anthem-left > .subtle-link { font-size:9px; }.anthem-lyrics { border-left:1px solid var(--line); padding-left:52px; }.lyrics-topline { display:flex; flex-direction:column; gap:9px; border-bottom:1px solid var(--line); padding-bottom:22px; }.lyrics-topline > span { font:21px var(--serif); color:var(--navy); letter-spacing:3px; }.lyrics-topline small { font-size:9px; color:#6b7d90; }.lyrics-stanza { display:grid; grid-template-columns:26px 1fr; gap:20px; margin-top:28px; }.stanza-num { font:17px/2.1 var(--serif); color:#97a9b9; }.lyrics-stanza p { font:17px/2.15 var(--serif); letter-spacing:1px; color:#314e69; }.lyrics-more { margin-top:24px; }.lyrics-more summary { list-style:none; cursor:pointer; font-size:10px; color:var(--blue); display:flex; align-items:center; justify-content:space-between; border-block:1px solid var(--line); padding-block:15px; }.lyrics-more summary::-webkit-details-marker { display:none; }.lyrics-more[open] summary > span { transform:rotate(45deg); }.lyric-note { padding:18px 20px; border-left:2px solid var(--gold); background:#f0f3f7; margin-top:25px; }.lyric-note > span { font-size:10px; color:#756445; }.lyric-note p { font-size:11px; color:#61758a; line-height:1.95; margin-top:8px; }.lyric-note small { display:block; font-size:8px; color:#788b9e; margin-top:8px; }
@keyframes spin { to{transform:rotate(360deg)} }
.quiz-wrap { background:#eef3f8; border-block:1px solid #dae3ec; }.quiz { gap:100px; grid-template-columns:.8fr 1.2fr; }.quiz-card { border-radius:0; border-top:3px solid var(--blue); padding:32px 38px; box-shadow:0 12px 25px #092c5006; }.quiz-progress { gap:13px; }.quiz-card h3 { font-size:25px; }.quiz-intro > p:last-of-type { font-size:12px; }.quiz-option { border-radius:0; }.quiz-step { width:30px; height:30px; }
.sources { background:var(--paper); }.sources h2 { font-size:34px; }.source-list { gap:30px 70px; }.source-list a { font-size:12px; }.source-list p { font-size:10px; }.source-list li > span { font-size:14px; }.creation-note { margin-top:40px; }.site-footer { border-top:1px solid var(--line); padding-block:32px 38px; }.site-footer p { line-height:2; }.site-footer p span { color:#8c9dae; font-size:9px; }
.person-dialog { padding:0; border:0; width:min(930px,calc(100% - 64px)); max-height:90svh; color:var(--ink); background:#f8fafc; overflow:auto; box-shadow:0 25px 100px #00183055; overscroll-behavior:contain; }.person-dialog::backdrop { background:#03192de0; backdrop-filter:blur(5px); }.dialog-topbar { position:sticky; top:0; z-index:2; padding:17px 28px; display:flex; align-items:center; justify-content:space-between; gap:20px; border-bottom:1px solid #d2dce6; background:#f8fafcf5; font-size:10px; color:#607991; }.dialog-topbar button { border:0; color:var(--blue); background:transparent; padding:7px 0 7px 15px; font-size:11px; }.dialog-heading { background:var(--navy); color:white; display:grid; grid-template-columns:190px minmax(0,1fr); gap:36px; padding:35px 40px; }.dialog-heading .person-visual { height:230px; }.dialog-heading .person-visual img { object-position:center 20%; }.dialog-heading .portrait-field,.dialog-heading .portrait-number { display:none; }.dialog-heading .discipline-art strong { font-size:44px; }.dialog-heading small { color:#b6c8d8; font-size:9px; letter-spacing:2px; }.dialog-heading h2 { font:42px var(--serif); letter-spacing:8px; color:white; margin-top:15px; }.dialog-years { font:17px Georgia,serif; color:#d9bb87; margin-top:13px; }.dialog-field { font-size:11px; color:#c4d3df; margin-top:13px; }.dialog-connection { font:15px/1.8 var(--serif); margin-top:21px; max-width:450px; color:#e1e8ef; }.dialog-body { padding:32px 40px 35px; }.dialog-introduction { font-size:13px; line-height:2.1; color:#466078; }.biography-layout { display:grid; grid-template-columns:1fr 1.1fr; gap:45px; margin-top:36px; }.biography-layout h3 { font:23px var(--serif); color:var(--navy); padding-bottom:15px; border-bottom:1px solid var(--line); }.life-timeline { padding:0; margin:25px 0 0; list-style:none; }.life-timeline li { position:relative; border-left:1px solid #b6c9da; padding:0 0 24px 21px; margin-left:4px; }.life-timeline li::before { content:''; position:absolute; left:-4px; top:6px; width:7px; height:7px; border-radius:50%; background:var(--blue); }.life-timeline strong { color:var(--blue); font:15px Georgia,var(--serif); }.life-timeline p { font-size:11px; line-height:2; color:#5c7287; margin-top:8px; }.contribution-item { margin-top:24px; }.contribution-item h4 { font-size:12px; font-weight:500; color:var(--navy); }.contribution-item h4 > span { color:#9baebe; font:13px Georgia,serif; margin-right:10px; }.contribution-item p { color:#5c7287; font-size:11px; line-height:2; margin-top:9px; }.dialog-links { border-top:1px solid var(--line); padding-top:24px; display:flex; flex-wrap:wrap; align-items:center; gap:10px; margin-top:22px; font-size:10px; color:var(--muted); }.dialog-links button { border:1px solid #c3d3e2; background:white; color:var(--blue); padding:7px 12px; font-size:10px; }.dialog-sources { margin-top:25px; font-size:9px; color:#71859a; line-height:2; display:flex; flex-wrap:wrap; gap:4px 18px; }.dialog-sources > span { width:100%; color:#405e77; }.dialog-sources a { text-decoration:underline; text-underline-offset:3px; }.dialog-source-note { font-size:9px; line-height:1.9; color:#7d90a1; margin-top:8px; }
.music-player { position:fixed; right:26px; bottom:22px; z-index:25; width:290px; border:1px solid #c3d2df; background:#fff; box-shadow:0 6px 25px #092c5018; color:var(--navy); }.player-main { display:flex; align-items:center; gap:14px; padding:12px 15px; }.player-toggle { width:37px; height:37px; display:grid; place-items:center; color:white; background:var(--blue); border:0; border-radius:50%; font-size:20px; flex-shrink:0; }.player-name { display:flex; flex-direction:column; gap:6px; min-width:0; }.player-name strong { font-size:11px; font-weight:500; letter-spacing:1px; }.player-name > span { font-size:9px; color:#6f8397; }.player-expand { border:0; background:transparent; color:#5e7890; margin-left:auto; padding:8px; font-size:17px; line-height:1; }.music-player:not(.is-collapsed) .player-expand { transform:rotate(180deg); }.player-details { padding:0 17px 17px; border-top:1px solid #e5ebf2; }.player-time { display:flex; justify-content:space-between; color:#718497; font:10px Georgia,serif; margin-top:13px; }.player-details input[type='range'] { accent-color:var(--blue); height:16px; cursor:pointer; max-width:100%; }#audio-seek { width:100%; margin:8px 0 11px; }.player-settings { display:flex; align-items:center; gap:10px; font-size:9px; color:#617b91; }.player-settings button { padding:5px 7px; border:1px solid #d1dce6; background:#f2f6fa; color:var(--blue); font-size:9px; }.player-settings button[aria-pressed='false'] { color:#75899d; background:white; }.player-settings label { margin-left:auto; }#audio-volume { width:75px; }
@media(min-width:1600px) { .hero-content { padding-top:60px; }.exhibition-hero { min-height:750px; } }
@media(max-width:1100px) {
 .section-width { width:calc(100% - 64px); }.main-nav { gap:19px; }.main-nav a { font-size:11px; }.header-inner { width:calc(100% - 48px); gap:20px; }.header-music { padding:9px 11px; }.exhibition-hero { min-height:640px; height:calc(85svh - 80px); }.hero-content { padding-block:40px 100px; }.hero-vertical { right:24px; }.prologue { gap:18px; grid-template-columns:1.05fr .95fr .95fr; }.prologue-text { padding-right:12px; }.prologue-text h2 { font-size:24px; }.chapter-tile { padding:22px; }.chapter-tile h3 { font-size:23px; }.chapter-tile p { font-size:10px; }.chronicle-layout { grid-template-columns:230px minmax(0,1fr); gap:30px; }.event-panel { padding-inline:30px; }.chronicle-tail { margin-left:260px; gap:20px; flex-wrap:wrap; }.chronicle-tail a { margin-left:0; }.people-tools { flex-wrap:wrap; gap:18px; }.people-search { margin-left:auto; }.person-visual { height:280px; }.person-name-row h3 { font-size:27px; }.people-context { grid-template-columns:110px 1fr 1.1fr; gap:25px; }.anthem-section { gap:70px; }.anthem-lyrics { padding-left:35px; }.record-stage { width:300px; }.quiz { gap:60px; }
}
@media(max-width:800px) {
 html { scroll-padding-top:130px; }.section-space { padding-block:70px; }.section-width { width:calc(100% - 40px); }.header-inner { flex-wrap:wrap; width:calc(100% - 40px); padding:13px 0 0; height:auto; gap:0; min-height:104px; }.brand-name { font-size:19px; }.brand-mark { width:30px; height:35px; font-size:24px; }.brand-name small { font-size:8px; }.header-music { margin-left:auto; font-size:10px; padding:8px 11px; }.main-nav { order:3; width:100%; justify-content:space-between; margin-top:6px; gap:12px; }.main-nav a { padding-block:15px; font-size:11px; }.main-nav a[aria-current]::after { bottom:5px; }.exhibition-hero { min-height:600px; height:calc(85svh - 110px); max-height:780px; }.exhibition-hero h1 { font-size:82px; }.hero-content { padding-block:40px 100px; }.hero-subtitle { font-size:20px; }.hero-date { margin-top:32px; }.hero-vertical { font-size:13px; right:20px; top:70px; }.hero-bottom { bottom:24px; padding-top:18px; }.hero-photo-credit { font-size:8px; }.hero-bottom > span:first-child { font-size:14px; }.prologue { grid-template-columns:1fr 1fr; padding-block:55px; gap:20px; }.prologue-text { grid-column:1/-1; display:grid; grid-template-columns:1fr 1fr; gap:0 35px; }.prologue-text h2 { grid-column:1; font-size:27px; }.prologue-text > p:not(.section-kicker) { grid-column:2; grid-row:1/3; font-size:12px; align-self:center; margin-top:0; }.prologue-text .subtle-link { grid-column:2; justify-self:start; align-self:start; margin-top:0; }.tile-history { min-height:330px; }.chapter-stack { gap:20px; }.chapter-tile { min-height:155px; }.tile-history { min-height:330px; }.chapter-tile h3 { font-size:24px; }h2 { font-size:34px; }.section-heading { margin-bottom:35px; }.section-kicker { font-size:10px; margin-bottom:17px; }.chronicle { padding-top:35px; }.chronicle-layout { grid-template-columns:minmax(0,1fr); gap:20px; }.event-index-wrap { position:static; }.event-tab { flex-direction:column; align-items:flex-start; min-height:87px; gap:6px; }.event-panel { padding:27px 34px 20px; min-height:0; }.event-year { font-size:104px; }.chronicle-tail { margin-left:0; gap:25px; justify-content:flex-start; }.chronicle-tail a { margin-left:auto; }.person-visual { height:300px; }.people-context { grid-template-columns:1fr 1.1fr; gap:20px 30px; }.people-context > span { grid-column:1/-1; }.people-context h3 { grid-column:1; font-size:22px; }.people-context > p { grid-column:2; }.people-context > div { grid-column:1/-1; }.journey-chapter { gap:25px; padding-bottom:28px; margin-bottom:40px; }.journey-chapter > span { font-size:62px; }.journey-chapter > div { gap:18px; }.journey-chapter p { font-size:9px; }.journey h2 { font-size:34px; }.route-frame { padding:24px; }.wartime-stories { gap:35px; grid-template-columns:.7fr 1.3fr; }.wartime-number strong { font-size:64px; }.wartime-number strong > span { font-size:11px; margin-left:8px; }.wartime-stories h3 { font-size:21px; }.wartime-people { gap:17px; }.journey-reflection p { font-size:15px; }.anthem-section { grid-template-columns:1fr 1fr; gap:35px; }.anthem-lyrics { padding-left:25px; }.lyrics-stanza { gap:10px; grid-template-columns:20px 1fr; }.lyrics-stanza p { font-size:14px; letter-spacing:0; }.anthem-intro { font-size:11px; }.record-stage { width:240px; height:270px; }.record-disc { width:230px; height:230px; }.record-label { width:108px; height:108px; }.record-play { width:56px; height:56px; bottom:36px; right:0; }.record-caption { font-size:7px; letter-spacing:1px; }.anthem-tip { font-size:9px; }.quiz { gap:35px; }.quiz-card { padding:28px; }.quiz-card h3 { font-size:22px; }.quiz-progress { gap:10px; }.quiz-step { width:25px; height:25px; }.person-dialog { width:calc(100% - 40px); }.dialog-heading { padding:30px; gap:26px; grid-template-columns:155px minmax(0,1fr); }.dialog-heading .person-visual { height:205px; }.dialog-heading h2 { font-size:36px; }.dialog-connection { font-size:13px; }.dialog-body { padding:28px 30px; }.biography-layout { gap:30px; }.music-player { right:18px; bottom:16px; width:274px; }
}
@media(max-width:560px) {
 .exhibition-hero { min-height:620px; height:calc(90svh - 110px); }.hero-shade { background:linear-gradient(90deg,#031b32d9,#031b3260),linear-gradient(0deg,#031b32bf,transparent 50%); }.hero-photo { object-position:58% center; }.exhibition-label { font-size:9px; letter-spacing:2px; }.exhibition-label > span { width:24px; }.exhibition-hero h1 { font-size:68px; letter-spacing:.08em; white-space:nowrap; }.hero-date { font-size:14px; margin-top:35px; }.hero-content { padding-top:20px; }.hero-subtitle { font-size:17px; letter-spacing:1px; margin-top:18px; }.hero-deck { font-size:11px; line-height:2.1; margin-top:18px; }.hero-vertical { right:18px; top:40px; font-size:11px; letter-spacing:5px; }.hero-actions { flex-wrap:wrap; gap:18px; align-items:center; margin-top:26px; }.hero-enter { font-size:11px; padding:12px 16px; gap:27px; }.hero-listen { font-size:10px; padding-block:10px; }.hero-listen > span { font-size:15px; margin-right:4px; }.hero-bottom { gap:12px; flex-wrap:wrap; font-size:9px; }.hero-bottom > span:first-child { font-size:13px; letter-spacing:4px; }.hero-photo-credit { order:3; width:100%; font-size:7px; margin-top:2px; }.hero-bottom a { font-size:9px; }.prologue { gap:14px; padding-block:45px; }.prologue-text { display:block; margin-bottom:10px; padding-right:0; }.prologue-text h2 { font-size:29px; }.prologue-text > p:not(.section-kicker) { margin-top:18px; font-size:12px; max-width:390px; }.prologue-text .subtle-link { margin-top:11px; }.chapter-tile { padding:19px 16px; min-height:145px; }.tile-history { min-height:305px; }.chapter-stack { gap:14px; }.chapter-tile h3 { font-size:21px; letter-spacing:0; }.chapter-tile small { font-size:8px; letter-spacing:0; }.chapter-tile p { font-size:9px; line-height:1.8; max-width:110px; }.tile-journey h3 { font-size:20px; }.tile-num { font-size:23px; }.tile-arrow { right:15px; bottom:18px; font-size:18px; }.tile-history::after { font-size:7px; right:9px; top:11px; }.section-space { padding-block:60px; }h2 { font-size:31px; }.section-intro { font-size:11px; margin-top:18px; }.section-heading { margin-bottom:30px; }.section-kicker { font-size:9px; letter-spacing:1.5px; }.chapter-number { font-size:14px; }.chronicle { padding-top:30px; }.event-panel { padding:23px 23px 16px; }.event-year { font-size:92px; }.event-panel h3 { font-size:25px; }.event-lead { font-size:16px; }.event-body { font-size:12px; line-height:2.1; }.event-meta { font-size:9px; }.event-note p { font-size:11px; }.event-sources { font-size:9px; }.chronicle-tail { margin-top:30px; gap:18px; }.chronicle-tail > span { font-size:42px; }.chronicle-tail p { font-size:10px; }.chronicle-tail a { margin-left:0; width:100%; font-size:10px; }.people-tools { gap:16px; padding-bottom:20px; }.people-filters { gap:5px; }.people-filters button { font-size:10px; padding:9px 12px; }.people-search { margin:0; width:100%; }.people-search input { width:100%; font-size:11px; }.gallery-topline { font-size:9px; margin-block:20px; }.gallery-topline > span { font-size:8px; max-width:115px; text-align:right; line-height:1.6; }.person-visual { height:300px; }.person-name-row h3 { font-size:29px; }.person-card-copy { padding-top:21px; }.person-tagline { font-size:14px; }.person-connection { font-size:10px; }.person-open { margin-top:17px; }.splide__arrows { margin-top:20px; }.splide__arrow { width:38px; height:38px; }.gallery-footnote { font-size:8px; }.people-context { margin-top:30px; padding-top:28px; display:block; }.people-context > span { font-size:9px; }.people-context h3 { font-size:23px; margin-top:15px; }.people-context > p { margin-top:18px; font-size:11px; }.people-context > div { display:flex; gap:25px; margin-top:20px; }.splide:not(.is-initialized) .splide__list { grid-template-columns:minmax(0,1fr); }.journey-chapter { gap:18px; padding-bottom:27px; margin-bottom:35px; }.journey-chapter > span { font-size:49px; }.journey-chapter > div { flex-direction:column; align-items:stretch; gap:10px; text-align:center; }.journey-chapter p { font-size:8px; }.journey-line { width:100%; flex:auto; }.journey h2 { font-size:32px; }.journey-intro { margin-top:20px; font-size:11px; }.route-frame { padding:19px 17px; }.route-topline { font-size:9px; }.route-topline > span:last-child { font-size:11px; white-space:nowrap; }.route-detail { grid-template-columns:1fr; gap:18px; }.route-detail-story p { font-size:11px; }.route-note { font-size:8px; }.wartime-stories { grid-template-columns:1fr; gap:28px; padding-block:35px; }.wartime-number { border-right:0; border-bottom:1px solid #ffffff25; padding-bottom:26px; display:flex; align-items:center; gap:24px; }.wartime-number strong { font-size:64px; white-space:nowrap; }.wartime-number strong > span { font-size:11px; }.wartime-number p { margin-top:0; font-size:8px; }.wartime-stories h3 { font-size:23px; }.wartime-stories > div > p:not(.small-kicker) { font-size:11px; }.journey-reflection p { font-size:13px; }.anthem-section { grid-template-columns:minmax(0,1fr); gap:40px; }.anthem-intro { font-size:12px; max-width:380px; }.record-stage { width:300px; height:315px; margin-inline:auto; margin-top:30px; }.record-disc { width:280px; height:280px; }.record-label { width:125px; height:125px; }.record-play { right:0; bottom:35px; width:60px; height:60px; }.record-caption { font-size:8px; letter-spacing:1.5px; }.anthem-tip { font-size:10px; text-align:center; }.anthem-left > .subtle-link { margin-top:15px; font-size:9px; }.anthem-lyrics { border-left:0; padding-left:0; border-top:1px solid var(--line); padding-top:28px; }.lyrics-topline { flex-direction:row; justify-content:space-between; align-items:center; }.lyrics-topline > span { font-size:19px; letter-spacing:1px; }.lyrics-topline small { font-size:8px; }.lyrics-stanza { grid-template-columns:25px 1fr; gap:20px; margin-top:25px; }.lyrics-stanza p { font-size:17px; letter-spacing:1px; }.lyric-note p { font-size:11px; }.quiz { grid-template-columns:minmax(0,1fr); gap:28px; }.quiz-card { padding:25px 23px; }.quiz-progress { gap:14px; }.quiz-step { width:28px; height:28px; }.quiz-intro > p:last-of-type { font-size:12px; }.quiz-card h3 { font-size:23px; }.sources h2 { font-size:28px; }.source-list { gap:24px; }.source-list a { font-size:12px; }.source-list p { font-size:10px; }.creation-note summary { font-size:10px; }.creation-note > div { font-size:10px; }.site-footer { padding-block:28px; }.person-dialog { width:calc(100% - 24px); max-height:93svh; }.dialog-topbar { padding:12px 19px; font-size:9px; }.dialog-heading { padding:25px 21px; grid-template-columns:110px minmax(0,1fr); gap:20px; }.dialog-heading .person-visual { height:155px; }.dialog-heading h2 { font-size:28px; letter-spacing:4px; margin-top:12px; }.dialog-heading small { font-size:7px; letter-spacing:1px; }.dialog-years { font-size:14px; margin-top:9px; }.dialog-field { font-size:9px; margin-top:11px; line-height:1.8; }.dialog-connection { font-size:11px; line-height:1.9; margin-top:13px; }.dialog-heading .discipline-art strong { font-size:32px; letter-spacing:4px; }.dialog-heading .discipline-art small { display:none; }.dialog-body { padding:25px 22px; }.dialog-introduction { font-size:12px; }.biography-layout { grid-template-columns:minmax(0,1fr); gap:25px; margin-top:27px; }.biography-layout h3 { font-size:22px; }.life-timeline p,.contribution-item p { font-size:11px; }.dialog-links { gap:8px; }.dialog-links > span { width:100%; margin-bottom:6px; }.dialog-sources { font-size:8px; }.music-player { right:12px; bottom:12px; width:254px; }.player-main { padding:10px 12px; gap:12px; }.player-toggle { width:34px; height:34px; }.player-name strong { font-size:10px; }.player-name > span { font-size:8px; }.player-details { padding-inline:13px; }.player-expand { padding:7px; }body:has(dialog[open]) .music-player { visibility:hidden; }
}
@media(max-width:360px) { .exhibition-hero h1 { font-size:59px; }.hero-actions { gap:10px; }.hero-enter { gap:16px; }.hero-listen { font-size:9px; }.chapter-tile h3 { font-size:18px; }.chapter-tile { padding:17px 13px; }.person-visual { height:275px; }.record-stage { width:260px; height:285px; }.record-disc { width:250px; height:250px; }.dialog-heading { grid-template-columns:90px minmax(0,1fr); gap:15px; }.dialog-heading .person-visual { height:135px; }.wartime-number { gap:15px; } }
@media(prefers-reduced-motion:reduce) { .record-disc,.is-playing .music-bars i { animation:none; }.chapter-tile,.person-visual img { transition:none; } }
@media print { body { padding:0; }.exhibition-hero { height:auto; min-height:400px; print-color-adjust:exact; }.music-player,.header-music,.record-play,.people-tools,.splide__arrows { display:none; }.prologue { padding-block:25px; }.splide__list { display:grid!important; grid-template-columns:repeat(3,1fr); gap:20px; transform:none!important; }.splide__slide { width:auto!important; }.person-visual { height:170px; }.people-section,.journey,.quiz-wrap { print-color-adjust:exact; }.person-dialog[open] { position:static; max-height:none; width:100%; }.biography-layout { break-inside:avoid; } }
