/* Shared museum system: the same shell, grid and rhythm in every room. */
:root{--bg:#151613;--surface:#20211c;--ink:#eee7d8;--muted:#b8b3a4;--accent:#c6a679;--line:#c6a67940;--pad:clamp(24px,5.5vw,80px);--room-title:clamp(48px,6.1vw,88px);--room-gap:clamp(40px,6vw,80px)}
body{transition:background-color .35s,color .35s}
body[data-mode="wall"],body[data-mode="graduates"],body[data-mode="about"]{--bg:#ded9cc;--surface:#f0ebe0;--ink:#252821;--muted:#626456;--accent:#865638;--line:#696b5540;color-scheme:light;background:var(--bg);color:var(--ink)}
.header,body[data-mode="wall"] .header{height:88px;background:#151613;color:#eee7d8;border-bottom:1px solid #c6a67935;padding:0 var(--pad);position:sticky;top:0;z-index:20;gap:30px}
.brand{font-size:22px;white-space:nowrap}.brand small{color:#b8b3a4;font-size:8px;letter-spacing:.24em}
.primary-nav{gap:28px;align-items:center;letter-spacing:.02em;font-size:12px}.primary-nav a,.primary-nav button{color:#b8b3a4;min-height:44px}.primary-nav .active,body[data-mode="wall"] .primary-nav .active{color:#e5c89e;border-color:#c6a679}
.eyebrow,.timeline-intro .eyebrow{font:10px/1.6 'Segoe UI',Arial,sans-serif;letter-spacing:.18em;color:var(--muted)}
.collection-view,.director-exhibition,.timeline-view,.about-view{max-width:1440px;margin:auto;padding-left:var(--pad);padding-right:var(--pad)}
.collection-view,.director-exhibition,.about-view{padding-top:60px;padding-bottom:70px}
.view-heading,.director-heading{margin:0 0 50px}
.view-heading h1,.director-heading h1,.timeline-intro h1{font:400 var(--room-title)/1.03 var(--serif);letter-spacing:-.045em;margin:25px 0}
.view-heading h1 em,.director-heading h1 em,.timeline-intro h1 em{color:var(--accent);font-weight:400}
.view-heading>.album-note,.section-deck,.director-heading>p:last-child,.timeline-deck{font:16px/1.85 'Segoe UI',Arial,sans-serif;color:var(--muted);margin-top:24px}
.timeline-intro{padding:60px 0 32px;min-height:580px;gap:40px 6%}.timeline-intro-copy{min-width:0}.timeline-intro h1{font-size:clamp(48px,5.5vw,80px)}
.timeline-hero-photo{background:var(--surface);padding:12px 12px 0;transform:rotate(1.2deg);box-shadow:0 18px 40px #25282120}.timeline-hero-photo>span{color:var(--muted)}.timeline-hero-photo b{color:var(--ink)}
.timeline-intro-bottom,.timeline-tools,.decade-section,.timeline-ending{border-color:var(--line)}.timeline-intro-bottom p,.timeline-intro-bottom small,.timeline-deck,.timeline-status,.time-card-label,.decade-marker p,.timeline-ending p{color:var(--muted)}
.timeline-start,.story-open,.text-link{font:12px/1.5 'Segoe UI',Arial,sans-serif;letter-spacing:.02em;border-bottom:1px solid var(--line);min-height:44px;color:var(--ink)}.text-link:hover,.story-open:hover{color:var(--accent);border-color:var(--accent)}
.timeline-categories button{border-radius:0;padding:9px 14px}.timeline-categories button[aria-pressed="true"]{background:var(--ink);color:var(--surface)}.timeline-search input{font-family:inherit;color:var(--ink);border-color:var(--line)}
.timeline-decades button{font:14px 'Segoe UI',Arial,sans-serif}.timeline-decades button[aria-pressed="true"]{color:var(--accent);border-color:var(--accent)}
.flip-front,.flip-back{background:var(--surface);border-radius:0}.flip-inner{transition:transform .65s cubic-bezier(.2,.7,.2,1)}.flip-front{padding:10px}.back-title{font-size:26px}.back-summary,.flip-hint,.back-kicker{color:var(--muted)}.time-card h3{font-size:28px}.flip-back{padding:25px}
.director-room{margin:45px 0;grid-template-columns:minmax(260px,390px) 1fr;gap:var(--room-gap)}.director-register>.eyebrow{margin-bottom:24px}.director-name{padding:24px 0}.director-name strong{font-size:36px}.director-wall{border:10px solid #292a23;box-shadow:0 20px 60px #0004}.director-wall>img{filter:sepia(.08) brightness(.94)}.director-wall figcaption{bottom:-42px}.director-next{display:none}
.graduate-story{grid-template-columns:260px 1fr;gap:var(--room-gap);padding:44px 0}.graduate-photo{padding:10px;background:var(--surface);box-shadow:0 14px 30px #25282115}.graduate-portrait{box-shadow:none}.portrait-caption{font-size:9px;margin:14px 3px 5px;letter-spacing:.12em}.graduate-copy h2{font:40px/1.12 var(--serif);letter-spacing:-.025em}.graduate-copy h3{font:23px/1.4 var(--serif);color:var(--accent)}.graduate-copy .source-links{gap:15px}.graduate-copy .button{border:0;border-bottom:1px solid var(--line);padding:8px 0;font-size:11px;color:var(--muted);margin-right:15px}.graduate-lead{max-width:620px}
.museum-passage{max-width:1280px;margin:0 auto;padding:50px 0 60px;border-top:1px solid var(--line);display:flex;justify-content:space-between;align-items:end;gap:30px}.museum-passage a{font:clamp(32px,4vw,54px)/1.2 var(--serif);display:block;margin-top:18px;letter-spacing:-.03em}.museum-passage a:hover{color:var(--accent)}.museum-passage>p{font:20px/1.5 var(--serif);color:var(--muted)}
.museum-footer{max-width:1280px;margin:0 auto;padding:28px 0 40px;align-items:start}.museum-footer nav{display:flex;gap:20px;flex-wrap:wrap;font-size:11px}.museum-footer>a{white-space:nowrap}.museum-footer span{font-size:10px}.immersive-home footer{display:none}
.memory-hero{background:#151613;height:calc(100svh - 153px);min-height:680px}.hero-vignette{background:radial-gradient(ellipse at 50% 46%,#151613e8 0%,#15161380 30%,transparent 65%),linear-gradient(0deg,#151613,transparent 30%)}.memory-copy{padding-top:120px}.memory-copy h1{font-size:clamp(86px,8.5vw,128px)}.memory-copy>.eyebrow{font-size:10px;letter-spacing:.25em}.memory-copy .hero-description{font:16px/1.85 'Segoe UI',Arial,sans-serif;letter-spacing:0}.gold-rule{margin:24px auto 16px}.memory-hero .enter-link{letter-spacing:.02em}
.museum-chapters{max-width:1440px;padding-top:75px;padding-bottom:70px}.chapter-door h3{font-size:34px}.chapter-door .text-link{border-bottom:0}
.about-columns{display:grid;grid-template-columns:1fr 1.6fr;border-top:1px solid var(--line);padding:45px 0;gap:var(--room-gap)}.about-columns h2{font:40px var(--serif)}.about-columns p{font-size:16px;line-height:1.9;margin-bottom:25px;color:var(--muted)}
dialog,body[data-mode="wall"] dialog{background:var(--surface);border-color:var(--line);color:var(--ink)}dialog h2{font-size:42px;letter-spacing:-.03em}dialog .eyebrow{padding-right:30px}.menu-links a{border-bottom:1px solid var(--line);padding:12px 0;font:28px var(--serif);min-height:44px}.dialog-close{color:var(--ink)}
#main{animation:room-arrive .45s ease-out}@keyframes room-arrive{from{opacity:.3;transform:translateY(8px)}to{opacity:1;transform:none}}
@media(max-width:1440px){.museum-passage,.museum-footer{margin-left:var(--pad);margin-right:var(--pad)}}
@media(max-width:900px){.header{height:76px}.primary-nav{gap:16px;font-size:11px}.director-name strong{font-size:30px}.graduate-story{grid-template-columns:230px 1fr}.graduate-copy h2{font-size:34px}.museum-footer nav{max-width:240px}.memory-copy{padding-top:140px}}
@media(max-width:750px){.primary-nav{display:none}.header-tools{display:flex}.header{height:76px}.mobile-menu{color:#eee7d8}.collection-view,.director-exhibition,.about-view{padding-top:40px;padding-bottom:50px}.view-heading h1,.director-heading h1,.timeline-intro h1{font-size:48px;line-height:1.07;margin:22px 0}.view-heading,.director-heading{margin-bottom:36px}.view-heading>.album-note,.section-deck,.director-heading>p:last-child,.timeline-deck{font-size:14px;line-height:1.8}.timeline-intro{padding-top:40px;gap:32px}.director-room{grid-template-columns:1fr;margin-top:36px;gap:65px}.director-wall{max-width:380px;width:100%}.director-name strong{font-size:30px}.graduate-story{grid-template-columns:1fr;gap:28px}.graduate-photo{width:240px;max-width:85%}.graduate-copy h2{font-size:34px}.museum-passage{padding:36px 0 40px}.museum-passage>p{display:none}.museum-footer{flex-direction:column;gap:24px}.museum-footer nav{max-width:none;gap:14px 24px}.memory-hero{min-height:650px;height:calc(100svh - 76px)}.memory-copy{padding-top:145px}.memory-copy h1{font-size:88px}.memory-copy>.eyebrow{font-size:9px}.hero-edge>span{font-size:8px}.hero-edge button span{font-size:9px}.timeline-hero-photo{width:96%}.timeline-intro-bottom>span{font-size:27px}.flip-back{padding:24px}.back-title{font-size:27px}.back-summary{font-size:13px}.about-columns{grid-template-columns:1fr;gap:28px}.about-columns h2{font-size:34px}dialog h2{font-size:32px}.timeline-tools{scroll-margin-top:88px}}
@media(prefers-reduced-motion:reduce){body,#main{animation:none;transition:none}}
.director-room{align-items:start}
@media(max-width:750px){body[data-mode="wall"] .header{height:76px}}

/* A single masthead on desktop, with the same five rooms in the mobile dialog. */
.header .brand{flex-shrink:0}
.header .primary-nav{gap:clamp(4px,1vw,16px);font-size:14px;letter-spacing:0}
.header .primary-nav a{
  display:flex;align-items:center;min-height:44px;padding:9px clamp(8px,1vw,15px);
  border:1px solid transparent;line-height:1.25;text-align:center;color:#d6cebf
}
.header .primary-nav a:hover{color:#f5e8ce;background:#ffffff09}
.header .primary-nav a[aria-current="page"]{
  color:#f6dfb6;background:#c6a67915;border-color:#c6a67950;border-bottom-color:#d4af73
}
.header :is(a,button):focus-visible,.navigation-dialog a:focus-visible{
  outline:2px solid #e0bc81;outline-offset:3px
}
.header .mobile-menu{
  display:inline-flex;align-items:center;justify-content:center;gap:9px;width:auto;
  padding:0 11px;border:1px solid #c6a67960;color:#f2e2c9;font-size:14px
}
dialog.navigation-dialog,body[data-mode="wall"] dialog.navigation-dialog{
  width:min(92vw,530px);background:#191816;color:#eee7d8;border-color:#c6a67960
}
.navigation-dialog .eyebrow{color:#c6a679}
.navigation-dialog .menu-links{gap:0}
.navigation-dialog .menu-links a{
  display:grid;grid-template-columns:24px minmax(0,1fr) 22px;gap:12px;align-items:center;
  min-height:52px;padding:8px 9px;border-top:1px solid #c6a67940
}
.navigation-dialog .menu-links a span{color:#c6a679;font:italic 14px var(--serif)}
.navigation-dialog .menu-links a strong{font-weight:500}
.navigation-dialog .menu-links a:hover,.navigation-dialog [aria-current="page"]{
  background:#c6a67919;color:#f6dfb6
}
.navigation-dialog [aria-current="page"]{box-shadow:inset 2px 0 #d4af73}

/* Alternate full-width photographic spreads with compact archive records. */
.timeline-tools{scroll-margin-top:98px}
.timeline-period{display:none}
.timeline-status{align-items:center;font-size:13px}
.timeline-status button{font-size:13px;padding-inline:12px}
.decade-section{
  grid-template-columns:minmax(145px,19%) minmax(0,1fr);gap:clamp(24px,3.2vw,56px);
  padding:42px 0 72px;border-top:2px solid var(--line)
}
.decade-marker{top:108px;padding-top:9px}
.decade-marker .eyebrow{color:var(--accent)}
.decade-marker h2{font-size:clamp(52px,6vw,92px);margin:18px 0 15px}
.decade-marker h2 small{font-size:23px}
.decade-cards{grid-template-columns:repeat(2,minmax(0,1fr));gap:34px clamp(18px,3vw,46px)}
.time-card{max-width:none;border-top:1px solid var(--line);padding-top:10px}
.time-card-label{font-size:12px;margin-bottom:10px;align-items:baseline}
.time-card-label span:first-child{font-weight:650;color:var(--accent);font-variant-numeric:tabular-nums}
.time-card h3{font:400 clamp(24px,2.2vw,34px)/1.12 var(--serif);margin:19px 0 6px}
.time-card .story-open{font-size:13px}
.time-card .flip-card{min-height:270px;max-height:460px}
.time-card-portrait .flip-card{aspect-ratio:1/1}
.time-card-document .flip-card{aspect-ratio:1/1.04}
.time-card-scene .flip-card{aspect-ratio:1.24}
.time-card .flip-hint{font-size:11px}
.time-card .flip-back{overflow:auto}
.time-card-feature{
  grid-column:1/-1;display:grid;grid-template-columns:minmax(0,1.65fr) minmax(0,1fr);
  grid-template-areas:"photo copy";align-items:center;gap:clamp(20px,3vw,48px);
  background:#211e18;color:#f3ead9;border:1px solid #775c3960;padding:clamp(16px,2.2vw,32px)
}
.decade-section:nth-child(even) .time-card-feature{
  grid-template-columns:minmax(0,1fr) minmax(0,1.65fr);grid-template-areas:"copy photo"
}
.feature-photo{grid-area:photo;display:block;width:100%;padding:0;text-align:left;background:#ede8dc;color:#2b251c}
.feature-photo>.archive-image{display:block;width:100%;aspect-ratio:1.56;background:#d8d0bf}
.feature-photo>span{min-height:44px;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:7px 13px;font-size:13px}
.feature-photo>span b{font-size:19px;font-weight:400}
.feature-photo:hover>span{background:#deceb0}
.feature-copy{grid-area:copy}
.feature-copy .time-card-label,.feature-copy .time-card-label span:first-child{color:#dfbb83}
.feature-copy h3{font-size:clamp(29px,3.4vw,50px);margin:12px 0}
.feature-copy p{font-size:14px;line-height:1.65;color:#e1d6c2}
@media(prefers-reduced-motion:no-preference){
  .time-card.has-entered{animation:archive-entrance .36s ease-out both}
}
@keyframes archive-entrance{from{opacity:.72;transform:translateY(8px)}to{opacity:1;transform:none}}

@media(max-width:750px){
  .timeline-tools{scroll-margin-top:86px;margin-top:18px;padding-top:14px}
  .timeline-categories{gap:6px}
  .timeline-categories button{font-size:13px;border-color:var(--line);padding-inline:10px}
  .timeline-search input,.timeline-period select{font-size:16px}
  .timeline-decades{display:none}
  .timeline-period{
    display:flex;align-items:center;justify-content:space-between;gap:12px;
    margin-top:13px;font-size:13px;color:var(--muted)
  }
  .timeline-period select{
    max-width:75%;min-height:44px;padding:5px 10px;color:var(--ink);
    border:1px solid var(--line);background:var(--surface);font-family:inherit
  }
  .timeline-status{padding-top:4px}
  .decade-section{grid-template-columns:minmax(0,1fr);gap:16px;padding:22px 0 44px}
  .decade-marker{padding:0}
  .decade-marker h2{font-size:54px;margin:9px 0 4px}
  .decade-marker h2 small{font-size:21px}
  .time-card-feature,.decade-section:nth-child(even) .time-card-feature{
    grid-template-columns:minmax(0,1fr);grid-template-areas:"copy" "photo";gap:15px
  }
  .feature-copy h3{font-size:32px}
}
@media(max-width:480px){
  .decade-cards{grid-template-columns:minmax(0,1fr);gap:24px}
  .time-card .flip-card{max-height:370px}
  .time-card-portrait:not(.time-card-feature){width:min(100%,310px);justify-self:center}
}
body[data-mode] .navigation-dialog .dialog-close{color:#f2e2c9}
body[data-mode] .navigation-dialog :is(a,button):focus-visible{outline-color:#e0bc81}