:root{
  --paper:#efe9dc;
  --ink:#26231f;
  --muted:#6b6257;
  --line:rgba(71,59,43,.28);
  --accent:#3e493e;
}
*{box-sizing:border-box}
html{background:var(--paper)}
body{
  margin:0;
  color:var(--ink);
  background:var(--paper);
  font-family:Arial,Helvetica,sans-serif;
  line-height:1.55;
}
a{color:inherit;text-underline-offset:.16em}
main{width:min(100%,1100px);margin:0 auto;padding:0 .8rem 2.5rem}
.site-header{
  padding:1rem 0 .8rem;
  border-bottom:1px solid var(--line);
  text-align:center;
}
.site-header h1{
  margin:0;
  font-size:clamp(1.3rem,3.5vw,2.1rem);
  line-height:1.1;
}
.site-header p{margin:.25rem 0 0;color:var(--muted)}
.exhibit-subtitle{
  font-size:.9em;
  position:relative;
  top:-0.18em;
}.nav{
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  align-items:center;
  gap:.42rem;
  margin:.9rem 0;
}
.nav a{
  display:inline-block;
  padding:.42rem .66rem;
  border:1px solid var(--line);
  border-radius:.42rem;
  background:rgba(255,255,255,.5);
  text-decoration:none;
  font-size:.9rem;
}
.nav a[aria-current="page"]{
  background:var(--accent);
  border-color:var(--accent);
  color:#fff;
}
.room-image,.artifact-image{
  display:block;
  width:100%;
  height:auto;
  margin:0 auto;
}
.room-wrap,.artifact-wrap{
  margin:1rem auto;
  background:#ddd6ca;
  box-shadow:0 1px 5px rgba(0,0,0,.14);
}
.room-wrap{max-width:1100px}
.artifact-wrap{max-width:900px}
.artifact-wrap a{display:block}
.map-hint{
  margin:.45rem auto 0;
  text-align:center;
  color:var(--muted);
  font-size:.86rem;
}



.museum-card{
  max-width:860px;
  margin:1.2rem auto 1.5rem;
  background:#eee9df;
  box-shadow:0 2px 5px rgba(0,0,0,.14);
  font-family:Georgia,"Times New Roman",serif;
  overflow:hidden;
}
.museum-card-inner{
  padding:clamp(1.3rem,4vw,2.5rem) clamp(1.25rem,5vw,4rem) 1.15rem;
}
.museum-card h2{
  margin:0 0 .15rem;
  font-size:clamp(1.45rem,3.3vw,2.15rem);
  line-height:1.15;
  font-weight:700;
}
.object-line{
  margin:0 0 1.25rem;
  font-style:italic;
  color:#544c43;
}
.museum-card p{
  margin:0 0 1rem;
  font-size:clamp(1rem,2.15vw,1.18rem);
  line-height:1.62;
}
.card-footer{
  background:#eee9df;
  line-height:0;
}
.card-footer-image{
  display:block;
  width:100%;
  height:auto;
}
.room-intro{
  max-width:820px;
  margin:1rem auto;
  font-family:Georgia,"Times New Roman",serif;
  font-size:1.05rem;
}
footer{
  border-top:1px solid var(--line);
  padding:1rem 0 1.8rem;
  text-align:center;
  color:var(--muted);
  font-size:.86rem;
}
@media(max-width:650px){
  main{padding-inline:.45rem}
  .nav a{font-size:.79rem;padding:.36rem .5rem}
  .museum-card-inner{padding:1.15rem 1.15rem .9rem}
}

.room-map{position:relative}
.room-hotspot{
  position:absolute;
  display:block;
  background:transparent;
  border:0;
}
.room-hotspot:focus-visible{
  outline:3px solid rgba(255,255,255,.92);
  outline-offset:2px;
}
.hotspot-street{left:2.7%;top:7.8%;width:58.8%;height:78.7%}
.hotspot-europa{left:64.7%;top:4.3%;width:31.1%;height:41.5%}
.hotspot-map{left:62.5%;top:48.7%;width:33.5%;height:44.5%}

/* CAM lobby elevator directory */
.lobby-page{
  background:#130d08;
  overflow-x:hidden;
}
.lobby-main{
  width:100%;
  max-width:none;
  margin:0;
  padding:0;
}
.lobby-viewport{
  width:100%;
  background:#130d08;
}
.lobby-stage{
  position:relative;
  width:100%;
  max-width:900px;
  margin:0 auto;
}
.lobby-image{
  display:block;
  width:100%;
  height:auto;
}
.directory-panel{
  position:absolute;
  left:25.8%;
  top:19.7%;
  width:48.4%;
  height:47%;
  padding:2.2% 2.5% 2.4%;
  color:#f0dfb5;
  font-family:Georgia,"Times New Roman",serif;
  display:flex;
  flex-direction:column;
  overflow:hidden;
  text-shadow:0 1px 1px #000;
}
.directory-header{
  flex:0 0 auto;
  text-align:center;
  padding-bottom:.55em;
  border-bottom:1px solid rgba(230,196,119,.45);
}
.directory-header h1{
  margin:0;
  font-size:clamp(.83rem,1.9vw,1.55rem);
  line-height:1.05;
  letter-spacing:.05em;
  text-transform:uppercase;
  font-weight:600;
}
.directory-header p{
  margin:.24em 0 0;
  color:#c9b98f;
  font-size:clamp(.56rem,1vw,.82rem);
  font-style:italic;
}
.kiosk-body{
  min-height:0;
  flex:1 1 auto;
  display:grid;
  grid-template-columns:minmax(0,56fr) minmax(0,44fr);
  gap:3.5%;
  padding-top:2.3%;
}
.directory-list{
  min-width:0;
  min-height:0;
  overflow-y:auto;
  overscroll-behavior:contain;
  scrollbar-width:thin;
  scrollbar-color:rgba(223,190,112,.55) rgba(0,0,0,.25);
  padding-right:4%;
  border-right:1px solid rgba(230,196,119,.36);
}
.directory-entry{
  appearance:none;
  width:100%;
  display:block;
  margin:0 0:.34em;
  padding:.34em .22em .38em;
  border:1px solid transparent;
  border-radius:0;
  background:transparent;
  color:inherit;
  font:inherit;
  line-height:1.05;
  text-align:left;
  text-decoration:none;
  cursor:pointer;
  text-shadow:inherit;
}
.directory-entry span{
  display:block;
  font-size:clamp(.61rem,1.25vw,1rem);
  letter-spacing:.018em;
}
.directory-entry small{
  display:block;
  margin-top:.18em;
  font-family:Arial,Helvetica,sans-serif;
  font-size:clamp(.42rem,.69vw,.57rem);
  line-height:1;
  letter-spacing:.1em;
  text-transform:uppercase;
}
.directory-entry.open{color:#fff0bd}
.directory-entry.open small{color:#e9c86e}
.directory-entry.preparing{color:#b8ad95}
.directory-entry.preparing small{color:#7f7665}
.directory-entry:hover,
.directory-entry:focus-visible,
.directory-entry.selected{
  background:rgba(154,105,27,.2);
  border-color:rgba(234,198,113,.62);
  outline:none;
}
.feature-panel{
  min-width:0;
  min-height:0;
  display:flex;
  flex-direction:column;
  align-items:center;
  text-align:center;
  overflow:hidden;
}
.feature-image-wrap{
  width:100%;
  flex:1 1 auto;
  min-height:0;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:2%;
  border:1px solid rgba(230,196,119,.4);
  background:rgba(0,0,0,.28);
}
.feature-image{
  display:block;
  width:100%;
  height:100%;
  object-fit:contain;
}
.feature-panel h2{
  margin:.48em 0 .12em;
  font-size:clamp(.67rem,1.35vw,1.05rem);
  line-height:1.06;
  color:#fff0bd;
}
.feature-status{
  margin:0;
  color:#e9c86e;
  font-family:Arial,Helvetica,sans-serif;
  font-size:clamp(.43rem,.72vw,.59rem);
  letter-spacing:.12em;
  text-transform:uppercase;
}
.feature-description{
  margin:.48em 0 .58em;
  color:#c9b98f;
  font-size:clamp(.48rem,.82vw,.67rem);
  line-height:1.22;
}
.feature-go{
  flex:0 0 auto;
  display:block;
  width:100%;
  padding:.48em .35em;
  border:1px solid rgba(255,224,146,.78);
  background:rgba(154,105,27,.32);
  color:#fff0bd;
  font-family:Arial,Helvetica,sans-serif;
  font-size:clamp(.5rem,.84vw,.68rem);
  font-weight:700;
  letter-spacing:.12em;
  text-transform:uppercase;
  text-decoration:none;
}
.feature-go:hover,
.feature-go:focus-visible{
  background:rgba(214,167,73,.38);
  outline:1px solid rgba(255,228,156,.8);
  outline-offset:2px;
}
.feature-go.disabled{
  color:#817867;
  border-color:rgba(156,143,113,.35);
  background:rgba(55,48,38,.28);
  cursor:default;
}
@media(max-width:520px){
  .directory-panel{
    left:24.9%;
    width:50.2%;
    padding-inline:2.2%;
  }
  .kiosk-body{
    grid-template-columns:minmax(0,58fr) minmax(0,42fr);
    gap:2.6%;
  }
  .directory-list{padding-right:3%}
  .feature-description{display:none}
  .feature-panel h2{margin-top:.36em}
}
@media(min-width:901px){
  .lobby-stage{box-shadow:0 0 32px rgba(0,0,0,.7)}
}