:root {
  --paper:#f4f0e6;
  --ink:#30453c;
  --muted:#676f62;
  --accent:#985744;
  --line:#d6d0be;
  --serif:"Songti SC","SimSun",serif;
  --sans:"Microsoft YaHei","PingFang SC",sans-serif
}

* {
  box-sizing:border-box
}

html,body {
  margin:0;
  width:100%;
  height:100%;
  overflow:hidden
}

body {
  font-family:var(--sans);
  color:var(--ink);
  background:#181b18;
  -webkit-font-smoothing:antialiased
}

button,input,select {
  font:inherit
}

button {
  cursor:pointer;
  border:0;
  color:inherit
}

button:disabled {
  cursor:wait;
  opacity:.6
}

button:focus-visible,input:focus-visible,select:focus-visible {
  outline:2px solid #98734f;
  outline-offset:4px
}

button,input,select {
  -webkit-tap-highlight-color:transparent
}

button {
  touch-action:manipulation
}

[hidden] {
  display:none!important
}

a-scene {
  position:fixed!important;
  inset:0;
  width:100%;
  height:100%
}

.a-enter-vr,.a-enter-ar,.a-orientation-modal {
  display:none!important
}

button {
  transition:background .2s,color .2s,transform .2s
}

.primary {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:28px;
  background:var(--ink);
  color:var(--paper);
  padding:17px 28px;
  border-radius:3px;
  letter-spacing:2px;
  font-size:14px;
  min-height:48px
}

.primary:hover:not(:disabled) {
  background:#3f5950;
  transform:translateY(-1px)
}

.text-button {
  background:none;
  padding:12px 4px;
  font-size:13px;
  border-bottom:1px solid var(--line)
}

.text-button:hover {
  color:var(--accent)
}

.eyebrow {
  font-size:10px;
  font-weight:500;
  letter-spacing:3px;
  margin:0;
  text-transform:uppercase
}

.brand {
  display:flex;
  gap:13px;
  align-items:center;
  text-align:left;
  font-family:var(--serif);
  font-size:23px;
  letter-spacing:4px;
  background:transparent;
  padding:0
}

.brand small {
  display:block;
  font:8px var(--sans);
  letter-spacing:2px;
  margin-top:8px
}

.seal {
  display:grid;
  place-items:center;
  width:44px;
  height:49px;
  background:var(--accent);
  color:#f9eee0;
  font-size:29px;
  font-family:var(--serif);
  letter-spacing:0;
  border:1px solid #8b4236;
  outline:1px solid #efded0;
  outline-offset:-4px;
  border-radius:2px
}

.welcome-header,.welcome-footer {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px
}

.edition {
  font-size:11px;
  letter-spacing:2px;
  color:#6b7169
}

#welcome {
  position:fixed;
  inset:0;
  z-index:50;
  background:var(--paper);
  padding:clamp(22px,4vw,60px) clamp(26px,5.5vw,110px) 24px;
  overflow:auto;
  display:flex;
  flex-direction:column;
  background-image:radial-gradient(#c3bca722 .7px,transparent .7px);
  background-size:5px 5px
}

.welcome-grid {
  display:grid;
  grid-template-columns:1fr 1.1fr;
  align-items:center;
  gap:7%;
  flex:1;
  min-height:540px;
  max-width:1680px;
  width:100%;
  margin:auto
}

.welcome-copy {
  padding:30px 0 50px
}

.welcome-copy .eyebrow {
  display:flex;
  align-items:center;
  gap:12px;
  font-size:11px;
  letter-spacing:3px
}

.welcome-copy .eyebrow span {
  width:24px;
  height:1px;
  background:var(--accent)
}

h1 {
  font:400 clamp(44px,5.3vw,90px)/1.4 var(--serif);
  letter-spacing:3px;
  margin:28px 0 24px
}

h1 span {
  color:var(--accent)
}

.intro {
  font:14px/2.2 var(--sans);
  color:#717569
}

.welcome-actions {
  display:flex;
  align-items:center;
  gap:28px;
  margin-top:34px
}

.load-status {
  font-size:11px;
  line-height:1.8;
  color:#797c70;
  min-height:20px;
  margin:14px 0 25px
}

.load-status.error {
  color:#9a3025
}

.welcome-meta {
  border-top:1px solid var(--line);
  padding-top:22px;
  display:flex;
  gap:40px;
  max-width:390px
}

.welcome-meta div {
  display:flex;
  flex-direction:column;
  gap:8px
}

.welcome-meta b {
  font:27px Georgia,serif;
  font-weight:400
}

.welcome-meta span {
  font-size:10px;
  color:#85857a;
  letter-spacing:2px
}

.hero-art {
  margin:0;
  position:relative;
  align-self:center;
  padding:25px 0 40px
}

.art-mount {
  height:clamp(370px,62vh,690px);
  position:relative;
  padding:22px;
  background:#e2dccd;
  box-shadow:0 20px 65px #34281715
}

.art-mount:before {
  content:"";
  position:absolute;
  inset:10px;
  border:1px solid #bab2a0;
  pointer-events:none
}

.art-mount img {
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:48% 50%;
  filter:saturate(.82);
  display:block
}

.art-stamp {
  position:absolute;
  right:-20px;
  bottom:42px;
  writing-mode:vertical-rl;
  background:var(--accent);
  color:#f7e7d8;
  font:17px/1.9 var(--serif);
  letter-spacing:5px;
  padding:19px 14px;
  box-shadow:0 8px 20px #543d2520
}

.hero-art figcaption {
  display:flex;
  justify-content:space-between;
  gap:8px;
  margin-top:18px;
  font-size:10px;
  color:#7d7a6e;
  letter-spacing:1px
}

.hero-art figcaption span:first-child {
  color:var(--accent)
}

.welcome-footer {
  padding-top:17px;
  border-top:1px solid var(--line);
  font-size:10px;
  color:#85877c;
  letter-spacing:1px
}

#gallery-hud {
  position:fixed;
  inset:0;
  z-index:10;
  pointer-events:none
}

#gallery-hud button,#gallery-hud input,#gallery-hud .map-card,#observation-ui {
  pointer-events:auto
}

.museum-header {
  position:absolute;
  top:0;
  left:0;
  right:0;
  display:flex;
  align-items:center;
  gap:24px;
  padding:15px 28px;
  background:#f4f0e6;
  border-bottom:1px solid #c9c8b5;
  backdrop-filter:none;
}

.museum-header .brand {
  font-size:20px;
  flex-shrink:0
}

.museum-header .seal {
  width:34px;
  height:38px;
  font-size:24px
}

.museum-header .brand small {
  font-size:7px;
  letter-spacing:2px;
  margin-top:5px
}

.location {
  display:flex;
  gap:8px;
  align-items:center;
  font-size:11px;
  color:#526454;
  border-left:1px solid #bcbfaf;
  padding-left:25px
}

.live-dot {
  width:5px;
  height:5px;
  border-radius:50%;
  background:#708475
}

.toolbar {
  margin-left:auto;
  display:flex;
  gap:7px
}

.toolbar button {
  background:transparent;
  padding:11px 14px;
  border:1px solid #aeb5a44d;
  border-radius:3px;
  font-size:11px;
  letter-spacing:1px;
  min-height:40px
}

.toolbar button:hover {
  background:#e1e3d6
}

.toolbar button[aria-pressed=true] {
  background:var(--ink);
  color:var(--paper)
}

.toolbar button:first-child {
  background:var(--ink);
  color:var(--paper);
  min-width:110px;
  display:flex;
  justify-content:space-between;
  gap:16px
}

.map-card {
  position:absolute;
  top:92px;
  bottom:auto;
  left:25px;
  width:220px;
  background:#f4f0e6;
  border:1px solid #dfd9cb;
  box-shadow:0 4px 16px #1e2e2414;
  border-radius:4px;
  backdrop-filter:none;
}

#map-toggle {
  padding:15px 16px;
  width:100%;
  display:flex;
  justify-content:space-between;
  background:none;
  font-size:11px
}

#map-toggle small {
  font-size:7px;
  letter-spacing:1.5px;
  color:#97998e;
  margin-left:8px
}

#mini-map {
  display:block;
  width:100%;
  height:auto
}

.map-legend {
  display:flex;
  justify-content:space-between;
  padding:10px 15px 14px;
  font-size:9px;
  color:#7c8076
}

.map-legend i {
  display:inline-block;
  width:5px;
  height:5px;
  border-radius:50%;
  background:var(--accent);
  margin-right:5px
}

#zone-nav {
  position:absolute;
  left:50%;
  bottom:25px;
  transform:translateX(-50%);
  display:flex;
  align-items:center;
  padding:7px;
  background:#f4f0e6;
  box-shadow:0 4px 16px #1e2e2420;
  border:1px solid #dfd9cb;
  border-radius:5px;
  backdrop-filter:none;
}

#zone-nav button {
  background:none;
  padding:12px 17px;
  font-size:12px;
  white-space:nowrap
}

#zone-nav button small {
  font:10px Georgia,serif;
  color:#8c978c;
  margin-right:10px
}

#zone-nav button[aria-current=true] {
  background:var(--ink);
  color:var(--paper);
  border-radius:2px
}

#zone-nav button[aria-current=true] small {
  color:#aab8a8
}

#navigation-hint {
  position:absolute;
  bottom:100px;
  left:50%;
  transform:translateX(-50%);
  display:flex;
  align-items:center;
  gap:5px;
  color:#f1ecdf;
  text-shadow:0 1px 5px #000;
  background:#1b29247a;
  padding:9px 12px;
  border-radius:4px;
  font-size:10px;
  white-space:nowrap
}

kbd {
  font:10px var(--sans);
  padding:3px 4px;
  border:1px solid #b3b9a580;
  border-radius:3px
}

#navigation-hint span {
  margin-left:6px
}

#dismiss-hint {
  background:none;
  color:#eee;
  font-size:17px;
  margin-left:10px
}

.observation-actions {
  display:flex;
  gap:18px;
  align-items:center
}

#observation-ui {
  position:absolute;
  right:26px;
  bottom:25px;
  width:360px;
  padding:25px;
  background:#f4f0e6;
  border:1px solid #dfd9cb;
  box-shadow:0 10px 40px #0002;
  border-radius:5px
}

#observation-ui .eyebrow {
  color:var(--accent);
  font-size:10px;
  letter-spacing:2px
}

#observation-ui h2 {
  font:24px/1.5 var(--serif);
  margin:13px 0 8px
}

#obs-subtitle {
  font-size:11px;
  line-height:1.8;
  color:var(--muted);
  margin:0 0 22px
}

#observation-ui .primary {
  padding:12px 17px;
  font-size:12px;
  min-height:40px
}

.sequence {
  display:flex;
  align-items:center;
  justify-content:space-between;
  margin-top:20px;
  padding-top:13px;
  border-top:1px solid var(--line)
}

.sequence button,.sequence span {
  font-size:10px
}

.sequence button {
  background:transparent;
  padding:6px
}

.sequence span {
  color:#92968a
}

body.observing #zone-nav,body.observing #navigation-hint {
  display:none
}

#hover-tooltip {
  position:fixed;
  z-index:15;
  transform:translate(14px,20px);
  pointer-events:none;
  max-width:240px;
  background:#f3efe5ef;
  color:var(--ink);
  font-size:12px;
  padding:10px 14px;
  border:1px solid #d9d5c8;
  border-radius:3px;
  box-shadow:0 4px 20px #0002
}

#transition-veil {
  position:fixed;
  inset:0;
  background:#e9e5da;
  z-index:25;
  pointer-events:none;
  opacity:0;
  transition:opacity .18s
}

#transition-veil.active {
  opacity:1
}

#toast {
  position:fixed;
  bottom:155px;
  left:50%;
  transform:translate(-50%,8px);
  opacity:0;
  pointer-events:none;
  z-index:100;
  max-width:90vw;
  border:1px solid #8b9d89;
  background:#273c37f5;
  color:#f3efe5;
  padding:12px 22px;
  font-size:12px;
  line-height:1.8;
  transition:opacity .2s,transform .2s;
  border-radius:4px
}

#toast.show {
  opacity:1;
  transform:translate(-50%,0)
}

.modal {
  position:fixed;
  inset:0;
  z-index:60;
  display:flex;
  align-items:center;
  justify-content:center;
  background:#182c26e6;
  backdrop-filter:none;
  padding:32px
}

.catalog-sheet,.detail-sheet,.film-sheet {
  background:var(--paper);
  border:1px solid #d3cebf;
  border-radius:5px;
  box-shadow:0 24px 90px #0003
}

.catalog-sheet {
  width:min(920px,100%);
  height:min(820px,90dvh);
  display:flex;
  flex-direction:column;
  padding:35px 40px
}

.sheet-header {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px
}

.sheet-header .eyebrow {
  color:#8c9383
}

.sheet-header h2 {
  font:32px/1.3 var(--serif);
  margin:12px 0 0;
  letter-spacing:2px
}

.icon-button {
  background:transparent;
  display:grid;
  place-items:center;
  font:30px/1 var(--sans);
  width:44px;
  height:44px;
  border:1px solid var(--line);
  border-radius:50%;
  flex-shrink:0
}

.icon-button:hover {
  background:#dedccd
}

.sheet-intro {
  font-size:12px;
  color:#687061;
  margin:16px 0 22px
}

.catalog-tools {
  display:flex;
  gap:10px
}

.search-box {
  display:flex;
  align-items:center;
  gap:12px;
  flex:1;
  min-width:0;
  background:#e8e7dc;
  border:1px solid #d6d7c8;
  padding:0 15px;
  border-radius:3px
}

.search-box span {
  font-size:22px
}

.search-box input {
  background:none;
  border:0;
  padding:13px 0;
  font-size:13px;
  width:100%;
  min-width:0;
  color:var(--ink)
}

.catalog-tools select {
  max-width:145px;
  background:transparent;
  border:1px solid var(--line);
  color:var(--ink);
  font-size:12px;
  border-radius:3px;
  padding:0 10px
}

.result-count {
  font-size:10px;
  color:#636f5f;
  letter-spacing:1px;
  margin:16px 0
}

#catalog-list {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:15px;
  align-content:start;
  overflow-y:auto;
  padding:2px 5px 20px 2px;
  overscroll-behavior:contain
}

.catalog-card {
  display:flex;
  align-items:center;
  gap:17px;
  background:#f8f5ee;
  border:1px solid #dfdcd0;
  border-radius:3px;
  text-align:left;
  padding:13px;
  min-width:0
}

.catalog-card:hover {
  border-color:#7c8e7d;
  background:#e9ecdf
}

.catalog-card img,.catalog-card .catalog-glyph {
  width:80px;
  height:90px;
  object-fit:contain;
  padding:6px;
  background:#e6e1d3;
  flex-shrink:0
}

.catalog-glyph {
  display:grid;
  place-items:center;
  font:30px var(--serif);
  color:#9d7d64
}

.catalog-card .card-copy {
  min-width:0
}

.catalog-card small {
  display:block;
  color:#9b5847;
  font-size:9px;
  margin-bottom:9px
}

.catalog-card strong {
  display:block;
  font:16px/1.55 var(--serif);
  font-weight:400
}

.catalog-card .card-action {
  display:block;
  font-size:9px;
  color:#5e725e;
  margin-top:10px
}

.empty-state {
  grid-column:1/-1;
  text-align:center;
  padding:50px 15px;
  font-size:13px;
  color:#7d877b
}

.detail-sheet {
  position:relative;
  width:min(1400px,100%);
  height:min(820px,88dvh);
  display:grid;
  grid-template-columns:1.5fr 1fr;
  overflow:hidden
}

.detail-close {
  position:absolute;
  right:18px;
  top:18px;
  z-index:2;
  background:var(--paper)
}

.detail-visual {
  display:flex;
  flex-direction:column;
  background:#dfdcd1;
  overflow:hidden;
  min-width:0
}

#image-viewport {
  position:relative;
  flex:1;
  min-height:0;
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
  touch-action:none;
  cursor:grab;
  padding:24px
}

#image-viewport:active {
  cursor:grabbing
}

#detail-image {
  display:block;
  max-width:100%;
  max-height:100%;
  object-fit:contain;
  user-select:none;
  will-change:transform;
  transform-origin:center;
  box-shadow:0 8px 25px #0002
}

#image-placeholder {
  text-align:center;
  font:30px/1.8 var(--serif);
  color:#868975
}

#image-placeholder small {
  font:12px/2 var(--sans)
}

#zoom-controls {
  display:flex;
  align-items:center;
  justify-content:center;
  padding:13px;
  gap:7px;
  border-top:1px solid #cac7ba;
  background:#eae7dd
}

#zoom-controls button {
  background:#f8f5ee;
  border:1px solid #cecfc0;
  border-radius:3px;
  font-size:15px;
  min-width:38px;
  min-height:36px
}

#zoom-controls span {
  font-size:10px;
  color:#868b7f;
  margin-left:9px
}

.detail-copy {
  padding:64px 38px 32px;
  overflow-y:auto;
  overscroll-behavior:contain
}

.detail-copy .eyebrow {
  color:var(--accent);
  font-size:10px;
  line-height:2
}

.detail-copy h2 {
  font:30px/1.5 var(--serif);
  margin:18px 0 10px
}

.detail-copy #detail-subtitle {
  font-size:12px;
  color:#919181;
  line-height:1.8
}

.fine-rule {
  display:block;
  height:1px;
  width:50px;
  background:var(--accent);
  margin:30px 0
}

#detail-description {
  font:15px/2.2 var(--serif);
  letter-spacing:.5px;
  white-space:pre-wrap;
  margin-bottom:20px
}

.detail-note {
  font-size:10px;
  color:#8e9385;
  line-height:2;
  border-top:1px solid var(--line);
  margin-top:26px;
  padding-top:18px
}

.detail-copy .primary {
  margin-top:10px;
  width:100%
}

.film-sheet {
  width:min(980px,100%);
  max-height:92dvh;
  overflow:auto;
  padding:26px
}

.film-sheet video {
  display:block;
  width:100%;
  max-height:65vh;
  background:#18261f;
  margin-top:22px
}

.film-sheet>p {
  font-size:11px;
  color:#8c9383
}

.no-script {
  position:fixed;
  inset:0;
  z-index:100;
  background:var(--paper);
  display:grid;
  place-items:center
}

#joystick-zone {
  position:fixed;
  bottom:130px;
  left:25px;
  width:110px;
  height:110px;
  z-index:12;
  touch-action:none;
  display:none
}

body.started:not(.blocked) #joystick-zone.available {
  display:block
}

.joystick-ring {
  position:absolute;
  inset:0;
  border:1px solid #f3efe57a;
  border-radius:50%;
  background:#f3efe524;
  backdrop-filter:none;
}

.joystick-knob {
  position:absolute;
  top:calc(50% - 22px);
  left:calc(50% - 22px);
  width:44px;
  height:44px;
  border:1px solid #f3efe5c0;
  background:#f3efe593;
  border-radius:50%;
  transform:translate(var(--stick-x,0px),var(--stick-y,0px))
}

body.blocked #joystick-zone {
  display:none!important
}


/* Quiet, opaque museum chrome: no background blur or continuously animated decoration. */
.museum-header .brand {letter-spacing:3px}
.toolbar button {border-color:transparent;border-radius:2px}
.toolbar button:hover {border-color:#c9cbb9;background:#e5e8dc}
.toolbar button:first-child {background:#30453c;border-color:#30453c}
#map-toggle {border-bottom:1px solid #ded9c9;letter-spacing:1px}
#map-toggle[aria-expanded=false] {border-bottom:0}
.map-legend {color:#626d5e}
#zone-nav button {border-radius:2px;letter-spacing:2px}
#zone-nav button:not([aria-current=true]):hover {background:#e0e5d8}
#observation-ui {border-top:3px solid #bca477}
.sequence button {min-height:36px;color:#425746}
#navigation-hint {background:#26392feb;text-shadow:none}
.catalog-sheet {border-top:3px solid #bca477}
.catalog-card {border-bottom:2px solid #d6d0bd}
.catalog-card small {letter-spacing:1px;color:#88563f}
.catalog-card:hover .card-action {color:#30453c}
.detail-copy h2 {letter-spacing:1px}
.detail-copy .eyebrow {color:#80684c}
.art-mount {box-shadow:0 14px 40px #34281712}
.art-mount img {filter:none}

@media(min-width:1900px) {
  .welcome-grid {
    max-width:1800px
  }
  .museum-header {
    padding:27px 42px
  }
  .toolbar button {
    font-size:14px
  }
  .map-card {
    width:280px
  }
  #zone-nav button {
    font-size:15px;
    padding:16px 24px
  }
}

@media(max-width:1100px) {
  .welcome-grid {
    gap:5%;
    min-height:500px
  }
  #welcome {
    padding:28px 35px 20px
  }
  .welcome-meta {
    gap:25px
  }
  .museum-header {
    gap:14px;
    padding:15px 20px
  }
  .location {
    padding-left:14px
  }
  .toolbar button {
    padding:10px;
    font-size:10px
  }
  .map-card {
    width:195px;
    top:92px;
    bottom:auto;
    left:16px
  }
  #observation-ui {
    right:16px;
    width:315px
  }
  .detail-copy {
    padding:60px 25px 25px
  }
  .detail-copy h2 {
    font-size:25px
  }
}

@media(max-width:760px) {
  #welcome {
    padding:22px;
    display:block
  }
  .welcome-header .brand {
    font-size:21px
  }
  .edition {
    font-size:8px;
    max-width:72px;
    line-height:2
  }
  .welcome-grid {
    display:flex;
    flex-direction:column;
    gap:0;
    min-height:0;
    margin:28px auto 0;
    align-items:stretch
  }
  .welcome-copy {
    padding:10px 0 25px
  }
  h1 {
    font-size:48px;
    line-height:1.3;
    margin:24px 0 20px
  }
  .intro {
    font-size:12px
  }
  .welcome-actions {
    margin-top:23px;
    gap:20px
  }
  .welcome-meta {
    display:none
  }
  .hero-art {
    width:100%;
    padding:0 0 24px
  }
  .art-mount {
    height:280px;
    padding:14px
  }
  .art-stamp {
    right:-8px;
    bottom:25px;
    font-size:13px;
    padding:14px 10px
  }
  .welcome-footer {
    font-size:9px;
    line-height:1.9
  }
  .welcome-footer span:last-child {
    max-width:150px;
    text-align:right
  }
  .hero-art figcaption {
    font-size:8px
  }
  .museum-header {
    flex-wrap:wrap;
    padding:12px 14px;
    gap:10px
  }
  .museum-header .brand {
    font-size:17px
  }
  .museum-header .brand small {
    font-size:6px
  }
  .museum-header .seal {
    width:30px;
    height:33px;
    font-size:22px
  }
  .location {
    border:0;
    margin-left:auto;
    padding:0;
    font-size:10px
  }
  .toolbar {
    width:100%;
    margin:0;
    gap:6px
  }
  .toolbar button {
    flex:1;
    font-size:10px;
    min-height:36px;
    padding:7px
  }
  .toolbar button:first-child {
    min-width:100px
  }
  .map-card {
    width:174px;
    top:132px;
    bottom:auto;
    left:14px
  }
  .map-card #map-toggle {
    padding:11px 12px
  }
  .map-card small {
    display:none
  }
  #zone-nav {
    bottom:max(16px,env(safe-area-inset-bottom));
    width:calc(100% - 28px);
    justify-content:space-between;
    padding:5px
  }
  #zone-nav button {
    padding:13px 10px;
    font-size:11px;
    flex:1
  }
  #zone-nav button small {
    margin-right:6px;
    font-size:9px
  }
  #navigation-hint {
    display:none
  }
  .modal {
    padding:12px
  }
  .catalog-sheet {
    padding:24px 18px;
    height:92dvh
  }
  .sheet-header h2 {
    font-size:27px
  }
  #catalog-list {
    grid-template-columns:1fr
  }
  .catalog-card img,.catalog-card .catalog-glyph {
    width:65px;
    height:73px
  }
  .catalog-tools select {
    max-width:108px;
    padding:0 5px;
    font-size:10px
  }
  .detail-sheet {
    height:94dvh;
    grid-template-columns:1fr;
    grid-template-rows:minmax(210px,45%) 1fr
  }
  .detail-copy {
    padding:25px 24px;
    overflow-y:auto
  }
  .detail-copy h2 {
    font-size:24px
  }
  .detail-close {
    right:12px;
    top:12px;
    width:37px;
    height:37px
  }
  .detail-copy .fine-rule {
    margin:20px 0
  }
  #zoom-controls {
    padding:8px
  }
  #zoom-controls span {
    font-size:8px
  }
  #image-viewport {
    padding:15px
  }
  #observation-ui {
    left:14px;
    right:14px;
    bottom:max(16px,env(safe-area-inset-bottom));
    width:auto;
    padding:18px
  }
  #observation-ui h2 {
    font-size:22px;
    margin:8px 0
  }
  #obs-subtitle {
    margin-bottom:13px
  }
  .sequence {
    margin-top:14px;
    padding-top:8px
  }
  body.observing .map-card {
    display:none
  }
  .film-sheet {
    padding:18px
  }
  .film-sheet .sheet-header h2 {
    font-size:21px
  }
  #toast {
    bottom:85px;
    font-size:11px;
    width:max-content;
    text-align:center
  }
  #joystick-zone {
    bottom:100px;
    left:20px
  }
  body.touch #map-card {
    left:14px;
    right:auto;
    top:132px;
    bottom:auto
  }
  body.touch #map-card #map-body {
    max-height:180px
  }
  body.touch #map-card {
    width:150px
  }
}

@media(max-height:550px) and (orientation:landscape) {
  #welcome {
    padding:18px 30px
  }
  .welcome-grid {
    min-height:0;
    display:grid;
    grid-template-columns:1fr 1fr
  }
  .welcome-copy {
    padding:12px 0
  }
  h1 {
    font-size:38px;
    margin:12px 0
  }
  .intro {
    font-size:11px
  }
  .welcome-actions {
    margin-top:15px
  }
  .welcome-meta,.welcome-footer {
    display:none
  }
  .hero-art .art-mount {
    height:290px
  }
  .load-status {
    margin:8px 0
  }
  .map-card {
    width:160px;
    top:118px;
    bottom:auto
  }
  .museum-header {
    padding:10px 20px
  }
  .detail-sheet {
    height:92dvh;
    grid-template-columns:1.2fr 1fr;
    grid-template-rows:1fr
  }
  .detail-copy {
    padding:45px 20px 20px
  }
}

@media(prefers-reduced-motion:reduce) {
  *,*:before,*:after {
    transition:none!important;
    animation:none!important;
    scroll-behavior:auto!important
  }
}

@media (pointer:coarse) {
  .toolbar button,#map-toggle {min-height:44px}
}

/* One Chinese typographic system: Song-style headings, readable sans-serif body. */
.brand small,.map-card small,.eyebrow,.edition {letter-spacing:1.5px}
.reading-guide{margin:26px 0 20px;border-top:1px solid var(--line);padding-top:18px}
.reading-guide h3{font:20px/1.6 var(--serif);font-weight:400;margin:0 0 12px}
.reading-guide ol{padding-left:1.45em;margin:0;font-size:14px;line-height:1.9;color:var(--ink)}
.reading-guide li+li{margin-top:9px}
.provenance{border-top:1px solid var(--line);padding-top:14px;font-size:11px!important;line-height:1.8!important;color:var(--muted)}

/* Research citations remain readable offline; only explicit links leave the gallery. */
#detail-source-list{padding-left:1.2em}#detail-source-list li{margin:.7em 0}#detail-source-list a{color:inherit;text-decoration-color:#ac9470;text-underline-offset:.22em;overflow-wrap:anywhere}#detail-sources small{color:var(--muted,#786b58);line-height:1.7}

/* Compact orientation, without extra floating panels or visual effects. */
.wayfinding-hint{margin:0;padding:8px 12px 2px;font:11px/1.75 "SimSun",serif;color:#67573e;border-top:1px solid #d5c8b0}
#zone-nav button{padding:12px 13px;letter-spacing:1px}#zone-nav button small{font:9px "SimSun",serif;margin-right:5px}
@media(max-width:640px){#zone-nav button{padding:12px 5px;font-size:11px}#zone-nav button small{display:block;font-size:8px;margin:0 0 4px}.wayfinding-hint{font-size:10px;padding:6px 9px 2px}body.touch #map-card #map-body{max-height:240px;overflow:auto}}

/* A quiet, optional game-like guide: one route, one current action. */
#tour-card{position:absolute;right:24px;top:92px;width:285px;background:#f4efdfed;border:1px solid #c6b38e;border-top:3px solid #a07c45;padding:15px 18px;color:#463d2d;pointer-events:auto;box-shadow:0 4px 20px #23190f15}
.tour-top{display:flex;align-items:center;justify-content:space-between;font-size:11px;letter-spacing:2px;color:#786847}.tour-top button{font-size:20px;background:none;border:0;padding:0 7px}
#tour-card h2{font:21px/1.5 var(--serif);margin:8px 0}#tour-card p{font-size:12px;line-height:1.8;margin:8px 0}#tour-instruction{color:#85602c}#tour-card progress{width:100%;height:3px;accent-color:#9d7941;display:block;margin-top:13px}
.tour-actions{display:flex;flex-wrap:wrap;gap:8px}.tour-actions button{background:#3c5043;color:#f3ebd7;border:0;padding:10px 12px;font-size:12px}.tour-actions #tour-next{background:transparent;color:#675439;border:1px solid #c8b797}
#tour-card summary{font-size:11px;cursor:pointer;padding:12px 0 0}#tour-stations{max-height:205px;overflow:auto;padding-left:22px;margin:8px 0;font-size:12px}#tour-stations button{border:0;background:none;text-align:left;color:inherit;font:inherit;padding:6px 0}#tour-stations .current{color:#986a2e;font-weight:bold}
#tour-card.folded .tour-body{display:none}#tour-beacon{position:fixed;transform:translate(-50%,-50%);pointer-events:auto;border:1px solid #eed4a0;border-radius:25px;background:#3f3927db;color:#fff0c7;font-size:12px;padding:9px 13px;box-shadow:0 0 0 7px #edc57b25;animation:guide-breathe 2.6s ease-in-out infinite}#tour-beacon span{display:inline-block;width:7px;height:7px;background:#f7db9e;border-radius:50%;margin-right:7px}
.gentle-cue{animation:guide-breathe 2.8s ease-in-out 5}.obs-look-hint{font-size:12px!important;color:#7a6a51}body.observing #tour-card,body.observing #tour-beacon{display:none!important}body.touring #navigation-hint{display:none}
@keyframes guide-breathe{0%,100%{box-shadow:0 0 0 0 #ba914000}50%{box-shadow:0 0 0 5px #b58b4238}}
@media(max-width:640px){#tour-card{top:132px;right:12px;width:min(265px,calc(100vw - 24px));padding:10px 13px;max-height:40dvh;overflow:auto}#tour-card h2{font-size:17px;margin:4px 0}#tour-card p{font-size:11px}#tour-card .tour-body{max-height:24dvh;overflow:auto}.toolbar{gap:2px;display:grid;grid-template-columns:1.1fr 1.05fr 1fr 1.15fr .8fr}.toolbar button{min-width:0;padding:9px 2px;font-size:11px;letter-spacing:0;white-space:nowrap}.toolbar button:first-child{min-width:0;justify-content:center;gap:0}#guide-btn span{display:none}#tour-stations{max-height:135px}#tour-beacon{font-size:11px}}
@media(prefers-reduced-motion:reduce){.gentle-cue,#tour-beacon{animation:none}}

/* Fixed orientation column: map at upper left, tour at upper right. Narrow screens stack only their headers. */
@media(max-width:760px){#map-card,body.touch #map-card{top:128px;left:14px;right:auto;bottom:auto;width:150px}#tour-card{top:128px;right:14px;width:calc(100vw - 192px);max-width:265px}#tour-card .tour-top{letter-spacing:0;font-size:10px}#tour-card h2{font-size:16px}#tour-card .tour-actions button{padding:9px 7px}}
@media(max-width:420px){#map-card,body.touch #map-card{width:130px}#tour-card{width:calc(100vw - 174px);padding:10px;max-height:48dvh}#tour-card .tour-body{max-height:35dvh}#map-toggle{font-size:10px}#tour-card .tour-top button{padding:0 4px}}
@media(max-height:550px) and (orientation:landscape){#map-card,body.touch #map-card{top:116px;bottom:auto;left:14px;right:auto;width:150px}#tour-card{top:116px;max-height:calc(100dvh - 195px);overflow:auto}#map-body{max-height:calc(100dvh - 244px);overflow:auto}}

@media(min-width:1900px){#map-card,#tour-card{top:116px}}

@media(max-height:550px) and (orientation:landscape){body.touch #map-card #map-body,.map-card #map-body{max-height:calc(100dvh - 274px);overflow:auto}#tour-card{max-height:calc(100dvh - 210px)}}

/* On short touch screens reserve a separate lower-left bay for movement. */
@media(max-height:550px) and (orientation:landscape){body.touch #joystick-zone{left:14px;bottom:12px;width:88px;height:88px}body.touch #map-card #map-body{max-height:calc(100dvh - 286px)}body.touch #map-toggle small{display:none}body.touch #zone-nav{left:calc(50% + 58px);width:calc(100% - 144px);max-width:620px;bottom:14px}}

/* Complete, text-only itinerary. The scene keeps the same meshes and textures. */
#tour-card{width:260px;padding:11px 13px;overflow:visible;max-height:none}
#tour-card .tour-top{letter-spacing:1px}
#tour-menu{display:block;width:100%;margin-top:10px;min-height:38px;border:1px solid #bbab8b;background:#ede5d3;color:#59482e;font:12px var(--sans);cursor:pointer}
#tour-menu:hover,#tour-menu[aria-expanded="true"]{background:#ded0b2}
#tour-card .tour-actions{margin-top:8px}
.tour-next-icon{display:none}
#tour-directory{position:absolute;top:calc(100% + 8px);right:0;width:100%;background:#f4efdf;border:1px solid #b9a784;box-shadow:0 10px 26px #23190f22;display:flex;flex-direction:column;max-height:calc(100dvh - 440px);min-height:160px;z-index:6;overflow:hidden;text-align:left}
.tour-directory-head{display:flex;justify-content:space-between;align-items:center;padding:12px 14px 5px;flex:none}
.tour-directory-head b{font:17px var(--serif);color:#493e2c}.tour-directory-head small{display:block;font-size:11px;margin-top:4px;color:#80715a}
#tour-close{width:40px;height:40px;border:0;background:none;color:#75634b;font-size:24px;cursor:pointer}
#tour-card .tour-directory-hint{margin:0;padding:0 14px 9px;font-size:11px;color:#7c6d55;flex:none;border-bottom:1px solid #d7c9b0}
#tour-stations{max-height:none;min-height:0;flex:1;overflow:auto;overscroll-behavior:contain;touch-action:pan-y;padding:4px 10px 10px;margin:0;scrollbar-width:thin;scrollbar-color:#b4a07c transparent}
#tour-stations .tour-group{border-bottom:1px solid #d8ccb7}
#tour-stations summary{display:flex;align-items:center;gap:6px;cursor:pointer;min-height:44px;padding:9px 4px;font:14px var(--serif);list-style:none;letter-spacing:0}
#tour-stations summary::-webkit-details-marker{display:none}#tour-stations summary::before{content:'›';font:18px var(--sans);width:12px;color:#8c754d}#tour-stations details[open]>summary::before{transform:rotate(90deg)}
#tour-stations summary span{flex:1}#tour-stations summary small{font:10px var(--sans);color:#827358;white-space:nowrap}
.tour-group-items{list-style:none;padding:0;margin:0 0 8px}
#tour-stations button{display:flex;align-items:center;gap:8px;width:100%;min-height:44px;border:0;border-left:2px solid transparent;border-radius:2px;background:none;padding:9px 6px;text-align:left;font:12px/1.5 var(--sans);color:#625541;cursor:pointer}
#tour-stations button:hover{background:#eae0c9}#tour-stations button.current{background:#e8dcc2;border-left-color:#947138;color:#493b23;font-weight:600}
.tour-number{font-size:10px;color:#9a8463;font-variant-numeric:tabular-nums;min-width:19px}.tour-label{flex:1;overflow-wrap:anywhere}.tour-status{width:12px;color:#74815d;font-size:12px}
#tour-stations button.tour-passage{font-size:11px;color:#8c7c62}#tour-stations button:focus-visible,#tour-menu:focus-visible,#tour-next:focus-visible,#tour-close:focus-visible{outline:2px solid #8b6b3e;outline-offset:-2px}
#tour-card.folded .tour-actions{display:none}
/* Small/touch displays keep only the current work, direction and two touch targets. */
#tour-card.compact{display:grid;grid-template-columns:minmax(0,1fr) 44px 38px;grid-template-rows:15px 23px 17px;column-gap:5px;padding:8px 9px 9px;align-items:center;max-height:none;overflow:visible}
#tour-card.compact .tour-top{grid-column:1;grid-row:1;font-size:10px;line-height:15px;letter-spacing:0;min-width:0;white-space:nowrap}
#tour-card.compact #tour-fold,#tour-card.compact .tour-body,#tour-card.compact #tour-view{display:none}
#tour-card.compact h2{grid-column:1;grid-row:2;font-size:15px;line-height:23px;margin:0;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;min-width:0}
#tour-card.compact #tour-instruction{grid-column:1;grid-row:3;font-size:10px;line-height:17px;margin:0;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;min-width:0}
#tour-card.compact .tour-actions{display:contents}
#tour-card.compact #tour-next{grid-column:3;grid-row:1 / 4;align-self:stretch;min-width:0;min-height:44px;margin:0;padding:0;border:0;border-left:1px solid #d2c3a6;color:#75603c;background:none}
#tour-card.compact #tour-next-label{display:none}#tour-card.compact .tour-next-icon{display:inline;font:24px var(--serif)}
#tour-card.compact #tour-menu{grid-column:2;grid-row:1 / 4;min-height:44px;margin:0;align-self:stretch;width:44px;border:0;background:#e9dec6;font-size:12px}
#tour-card.compact progress{position:absolute;bottom:0;left:0;margin:0;height:2px}
#tour-card.compact #tour-directory{max-height:calc(100dvh - 320px);min-height:0;width:max(100%,260px)}
#tour-card.compact .tour-directory-head{padding:8px 12px 3px}#tour-card.compact .tour-directory-head b{font-size:15px}
@media(max-width:760px){#tour-card{width:calc(100vw - 192px);max-width:260px}#tour-card.compact{grid-template-columns:minmax(0,1fr) 40px 30px;column-gap:3px;padding:8px 7px 9px}#tour-card.compact #tour-menu{width:40px}#tour-card.compact #tour-next{font-size:18px}#tour-card.compact #tour-directory{width:min(260px,calc(100vw - 28px))}}
@media(max-width:420px){#tour-card{width:calc(100vw - 174px)}#tour-card.compact .tour-top{font-size:9px}#tour-card.compact h2{font-size:14px}#tour-card.compact #tour-instruction{font-size:9px}}
@media(max-height:550px) and (orientation:landscape){
 #tour-card.compact{top:76px;right:max(14px,env(safe-area-inset-right));width:260px;max-width:calc(100vw - 194px);grid-template-columns:minmax(0,1fr) 44px 38px}
 #tour-card.compact #tour-menu{width:44px}#tour-card.compact #tour-directory{max-height:calc(100dvh - 242px);width:100%}
 #tour-card.compact .tour-directory-head{padding:3px 10px 0}#tour-card.compact .tour-directory-head small{display:none}#tour-card.compact .tour-directory-hint{padding:0 10px 5px}
 #map-card,body.touch #map-card{top:76px}
}
@media(min-width:1900px){#tour-directory{max-height:calc(100dvh - 464px)}}
/* Expanded directory temporarily replaces the compact strip, reclaiming space for the actual list. */
#tour-card.compact #tour-directory{top:-3px;max-height:calc(100dvh - 244px)}
@media(max-height:550px) and (orientation:landscape){#tour-card.compact #tour-directory{max-height:calc(100dvh - 158px)}}
@media(max-width:700px) and (max-height:550px) and (orientation:landscape){
 .museum-header{flex-wrap:nowrap;gap:8px;padding:8px 14px}.museum-header .brand{font-size:14px;letter-spacing:1px;gap:6px}.museum-header .brand small,.museum-header .location{display:none}.museum-header .seal{width:24px;height:29px;font-size:20px}
 .museum-header .toolbar{width:auto;flex:1;display:grid;grid-template-columns:repeat(5,1fr);gap:2px;margin:0}.museum-header .toolbar button{min-width:0;min-height:44px;padding:5px 1px;font-size:10px;letter-spacing:0;white-space:nowrap}.museum-header #guide-btn span{display:none}
}
/* A directory is a temporary reading panel, not a second card piled beneath the guide. */
#tour-directory{top:-3px;max-height:calc(100dvh - 205px)}
#tour-card.menu-open > :not(#tour-directory){visibility:hidden}
@media(min-width:1900px){#tour-directory{max-height:calc(100dvh - 230px)}}
@media(max-width:700px) and (max-height:550px) and (orientation:landscape){
 #tour-card.compact{top:68px;width:260px;grid-template-rows:12px 18px 13px;padding:4px 7px;column-gap:3px}
 #tour-card.compact .tour-top{font-size:9px;line-height:12px}#tour-card.compact h2{font-size:14px;line-height:18px}#tour-card.compact #tour-instruction{font-size:9px;line-height:13px}
 #tour-card.compact #tour-directory{max-height:calc(100dvh - 148px)}#map-card,body.touch #map-card{top:68px}
}

/* Narrow navigation strip; only its on-demand text directory expands vertically. */
@media(max-height:550px) and (orientation:landscape){
 #tour-card.compact{grid-template-rows:12px 20px 14px;padding:4px 7px;column-gap:3px;grid-template-columns:minmax(0,1fr) 40px 32px}
 #tour-card.compact .tour-top{font-size:9px;line-height:12px}#tour-card.compact h2{font-size:14px;line-height:20px}#tour-card.compact #tour-instruction{font-size:10px;line-height:14px}#tour-card.compact #tour-menu{width:40px}
 #tour-card.compact #tour-directory{width:260px}
}

/* Navigation refinements: text and focus feedback only, no perpetual effects. */
#tour-current{display:block;width:100%;min-width:0;padding:0;border:0;background:none;text-align:left;font:inherit;line-height:inherit;color:inherit;cursor:pointer;overflow:hidden;text-overflow:ellipsis;white-space:inherit}
#tour-current:hover{color:#8b642f;text-decoration:underline;text-underline-offset:4px}#tour-current:focus-visible{outline:2px solid #987547;outline-offset:2px}
#tour-current.at-exhibit{color:#596548}#tour-card #tour-upcoming{margin:7px 0 0;font-size:10px;line-height:1.5;color:#8a795c}
#tour-card.compact #tour-upcoming,#tour-card.folded #tour-upcoming{display:none}
#tour-next:disabled,#tour-current:disabled{cursor:wait;opacity:.55}

/* Two distinct navigation actions, fitted inside the existing narrow strip. */
#tour-card .tour-short{display:none}
#tour-card .tour-actions{gap:6px}
#tour-card #tour-view{flex-basis:100%}
#tour-card #tour-next,#tour-card #tour-next-exhibit{flex:1;white-space:nowrap;padding:9px 7px}
#tour-next-exhibit:focus-visible{outline:2px solid #8b6b3e;outline-offset:-2px}
#tour-next-exhibit:disabled{opacity:.42;cursor:default}
#tour-card.compact{grid-template-columns:minmax(0,1fr) 34px 44px 44px;column-gap:3px}
#tour-card.compact .tour-top{overflow:hidden}
#tour-card.compact #tour-count{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#tour-card.compact #tour-menu{width:34px;font-size:11px}
#tour-card.compact #tour-next,#tour-card.compact #tour-next-exhibit{grid-row:1 / 4;align-self:stretch;min-width:0;min-height:44px;margin:0;padding:0;font-size:11px;border:0;border-radius:3px}
#tour-card.compact #tour-next{grid-column:3;background:#e9dec6;color:#675439}
#tour-card.compact #tour-next-exhibit{grid-column:4;background:#3c5043;color:#f3ebd7}
#tour-card.compact .tour-full{display:none}
#tour-card.compact .tour-short{display:inline}

/* Museum close-looking: one dark image stage and a quiet, independent reading column. */
#detail-dialog{padding:24px;background:#111a17f5}
#detail-dialog .detail-sheet{width:min(1660px,100%);height:calc(100dvh - 48px);max-height:1100px;grid-template-columns:minmax(0,1fr) 340px;grid-template-rows:64px minmax(0,1fr);border:1px solid #665f4d;border-radius:2px;overflow:hidden;box-shadow:none;background:#19231f}
.detail-topbar{grid-column:1/-1;display:flex;align-items:center;gap:16px;padding:0 20px;background:#1c2822;color:#e8ddc7;border-bottom:1px solid #796b4b;min-width:0}
.detail-heading{display:flex;align-items:center;gap:12px;flex:1;min-width:0}.detail-heading>div{min-width:0}.detail-heading small{display:block;color:#baa885;letter-spacing:3px;font-size:9px}.detail-heading p{margin:3px 0 0;font:18px/1.4 var(--serif);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.detail-seal{display:grid;place-items:center;border:1px solid #a78058;width:28px;height:32px;flex-shrink:0;font:22px var(--serif);color:#c4a275}
.detail-sequence{display:flex;align-items:center;gap:9px}.detail-sequence button{width:38px;min-height:40px;background:none;color:#e0cfaf;font-size:18px}.detail-sequence span{font-size:11px;color:#bcaf95;white-space:nowrap;font-variant-numeric:tabular-nums}
#detail-focus-toggle{min-height:40px;padding:0 13px;font-size:12px;white-space:nowrap;color:#e0cfaf;border:1px solid #75664b;background:none}
#detail-focus-toggle[aria-pressed=true]{background:#e5d7ba;color:#2c382d}
#detail-dialog .detail-close{position:static;background:none;color:#e0cfaf;border:0;border-radius:0;width:40px;height:40px;min-height:40px;font-size:28px}
#detail-dialog .detail-visual{grid-row:2;grid-column:1;min-height:0;background:radial-gradient(ellipse at 50% 40%,#303a2d,#19221d 80%)}
#detail-dialog #image-viewport{padding:34px;min-height:0;outline-offset:-4px}
#detail-dialog #detail-image{box-shadow:0 3px 15px #0005;max-width:100%;max-height:100%}
#detail-image.zoom-glide{transition:transform .42s cubic-bezier(.22,.65,.28,1)}
#detail-dialog #zoom-controls{flex-shrink:0;min-height:49px;padding:5px 12px;gap:5px;border-top:1px solid #ffffff13;background:#19231f;color:#cfc0a3}
#detail-dialog #zoom-controls button{background:transparent;border:1px solid #7a705b;color:#dfd3bb;min-width:36px;min-height:34px;font-size:13px}
#detail-dialog #zoom-controls span{color:#adab96;font-size:10px}
#detail-focuses{flex-shrink:0;padding:10px 18px 12px;border-top:1px solid #ffffff13;background:#19231f;color:#d4c5a7}
.focus-strip{display:flex;align-items:center;gap:12px;min-width:0}.focus-label{font:12px var(--serif);letter-spacing:2px;white-space:nowrap;color:#a48e65}
#detail-focus-list{display:flex;gap:4px;overflow-x:auto;scrollbar-width:thin;min-width:0}
#detail-focus-list button{background:none;white-space:nowrap;min-height:34px;padding:5px 10px;font-size:11px;border:1px solid transparent;border-radius:2px;color:#c6b99f}
#detail-focus-list button[aria-pressed=true]{border-color:#b8a079;background:#e3d5b8;color:#26362b}
#detail-focus-note{margin:7px 0 0;font:12px/1.7 var(--serif);color:#afa994;min-height:20px}
#detail-dialog .detail-copy{grid-column:2;grid-row:2;min-height:0;padding:32px 28px;background:#f1ebde;border-left:1px solid #8d7a57;scrollbar-width:thin;scrollbar-color:#b6a581 transparent}
#detail-dialog .detail-copy h2{font:30px/1.6 var(--serif);margin:12px 0 9px;letter-spacing:2px;color:#303d30}
#detail-dialog .fine-rule{width:40px;margin:23px 0;background:#9d654c}
#detail-dialog #detail-description{font:15px/2.1 var(--serif);letter-spacing:.5px;color:#435041}
#detail-dialog .detail-note{font:12px/1.8 var(--serif);color:#85775d}
#detail-dialog .reading-guide{border-top:1px solid #d4c8b0;padding-top:16px}
#detail-dialog .reading-guide h3{font:18px var(--serif);color:#776143}
#detail-dialog .detail-copy .primary{background:#34493b;border-radius:1px;padding:14px;font-size:12px;letter-spacing:1px}
#detail-dialog.art-only .detail-sheet{grid-template-columns:minmax(0,1fr)}
#detail-dialog.art-only .detail-copy{display:none}
#detail-dialog.art-only #image-viewport{padding:28px 48px}
/* Let the exhibit breathe during its in-space near view. */
body.observing #map-card{visibility:hidden;pointer-events:none}
#observation-ui{background:#f1ebdef7;border-radius:1px;box-shadow:none;border-top:2px solid #a9956d}
#toast{border-radius:2px;padding:8px 15px;font-size:11px;max-width:min(440px,80vw)}
/* A collection wall rather than a list of identical software cards. */
.catalog-sheet{width:min(1080px,100%);border-radius:2px;box-shadow:none;background:#f1ebde}
#catalog-list{grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;padding:2px 6px 20px 2px}
.catalog-card{display:flex;flex-direction:column;align-items:stretch;gap:0;background:transparent;border:0;border-bottom:1px solid #cdbf9f;padding:0 0 15px;border-radius:0}
.catalog-card img,.catalog-card .catalog-glyph{display:block;width:100%;height:155px;object-fit:contain;padding:13px;background:#ded7c8;border:1px solid #d3c9b2}
.catalog-card .catalog-glyph{display:grid;place-items:center;font:48px var(--serif);color:#9e8762}
.catalog-card .card-copy{padding:14px 5px 0}.catalog-card small{font-size:10px;color:#8e7150;letter-spacing:1px}.catalog-card strong{font:19px/1.6 var(--serif);margin-top:5px}.catalog-card .card-action{font-size:10px;margin-top:10px}
.catalog-card:hover{background:#e5decd;border-color:#9e8660}.catalog-card:focus-visible{outline-offset:1px}
@media(min-width:1900px){#detail-dialog .detail-sheet{grid-template-columns:minmax(0,1fr) 410px;grid-template-rows:74px minmax(0,1fr)}#detail-dialog .detail-copy{padding:40px}#detail-dialog #detail-description{font-size:17px}.detail-heading p{font-size:22px}}
@media(max-width:760px){
 #detail-dialog{padding:8px}#detail-dialog .detail-sheet{height:calc(100dvh - 16px);max-height:none;grid-template-columns:1fr;grid-template-rows:56px minmax(0,52%) minmax(0,1fr)}
 .detail-topbar{gap:5px;padding:0 8px}.detail-seal{display:none}.detail-heading small{font-size:8px;letter-spacing:1px}.detail-heading p{font-size:14px}.detail-sequence{gap:2px}.detail-sequence button{width:30px;min-height:40px}.detail-sequence span{font-size:10px}
 #detail-focus-toggle{padding:0 8px;font-size:11px}.detail-topbar .detail-close{width:32px!important}
 #detail-dialog .detail-copy{grid-column:1;grid-row:3;padding:20px 23px;border-left:0;border-top:1px solid #ad9978}
 #detail-dialog .detail-copy h2{font-size:24px}#detail-dialog #detail-description{font-size:14px}
 #detail-dialog #image-viewport{padding:18px}#detail-dialog #zoom-controls{min-height:42px;padding:3px 8px}
 #detail-dialog #zoom-controls span{font-size:9px}#detail-focuses{padding:5px 9px 8px}.focus-strip{gap:4px}.focus-label{display:none}
 #detail-focus-list button{min-height:34px;padding:4px 7px;font-size:10px}#detail-focus-note{font-size:11px;line-height:1.6;margin-top:3px}
 #detail-dialog.art-only .detail-sheet{grid-template-rows:56px minmax(0,1fr)}#detail-dialog.art-only #image-viewport{padding:18px}
 #catalog-list{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.catalog-card img,.catalog-card .catalog-glyph{height:125px;padding:9px}.catalog-card strong{font-size:16px}.catalog-card .card-copy{padding:11px 3px 0}
}
@media(max-height:550px) and (orientation:landscape){
 #detail-dialog{padding:7px}#detail-dialog .detail-sheet{height:calc(100dvh - 14px);grid-template-columns:minmax(0,1fr) 32%;grid-template-rows:45px minmax(0,1fr)}
 .detail-topbar{padding:0 10px;gap:8px}.detail-heading small{display:none}.detail-heading p{margin:0;font-size:15px}.detail-seal{display:none}.detail-sequence button,#detail-focus-toggle{min-height:36px}
 #detail-dialog .detail-copy{grid-column:2;grid-row:2;padding:17px 15px;border-top:0;border-left:1px solid #ad9978}#detail-dialog .detail-copy h2{font-size:22px}#detail-dialog #detail-description{font-size:13px}
 #detail-dialog #image-viewport{padding:13px}#detail-dialog #zoom-controls{min-height:36px;padding:2px 8px}#detail-dialog #zoom-controls button{min-height:30px;font-size:11px;min-width:32px}
 #detail-dialog #zoom-controls span{display:none}#detail-focuses{padding:3px 8px 5px}.focus-label{display:none}#detail-focus-list button{min-height:30px;font-size:10px;padding:3px 6px}#detail-focus-note{font-size:10px;line-height:1.5;min-height:15px;margin-top:2px}
 #detail-dialog.art-only .detail-sheet{grid-template-columns:minmax(0,1fr);grid-template-rows:45px minmax(0,1fr)}#detail-dialog.art-only #image-viewport{padding:14px}
 .catalog-sheet{padding:15px 22px;height:calc(100dvh - 28px)}.catalog-sheet .sheet-intro{display:none}.catalog-sheet .sheet-header h2{font-size:24px;margin:3px 0}.catalog-sheet .sheet-header .eyebrow{margin:0}.catalog-tools{margin-top:10px}.result-count{margin:8px 0}
 #catalog-list{grid-template-columns:repeat(3,minmax(0,1fr))}.catalog-card img,.catalog-card .catalog-glyph{height:115px}
}
@media(prefers-reduced-motion:reduce){#detail-image.zoom-glide{transition:none}}

/* Text-based exhibits use their own editorial marks, not repeated image placeholders. */
.catalog-card .catalog-glyph{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;background:linear-gradient(135deg,#ded7c8,#e9e1d1);color:#88704b}
.catalog-glyph>span{font:38px/1.1 var(--serif);border:1px solid #b09c7b;padding:8px 11px}
.catalog-card .catalog-glyph>small{font:10px/1.3 var(--serif);letter-spacing:3px;margin:0;color:#806f54}
@media(max-width:760px),(max-height:550px){.catalog-glyph>span{font-size:28px;padding:5px 8px}.catalog-card .catalog-glyph{gap:7px}}

/* Floating walking control; right-hand canvas gestures orbit the view. */
body.touch #joystick-zone.available{display:none;pointer-events:none;width:88px;height:88px;bottom:auto;z-index:11}
body.touch.started:not(.blocked) #joystick-zone.available.active{display:block}
body.touch #observation-ui{left:auto;right:max(12px,env(safe-area-inset-right));bottom:max(12px,env(safe-area-inset-bottom));width:min(48vw,315px);padding:14px;max-height:65dvh;overflow:auto}
body.touch #observation-ui h2{font-size:20px;margin:5px 0}
body.touch #observation-ui .obs-look-hint{font-size:11px}
body.touch #observation-ui .observation-actions{flex-wrap:wrap;gap:6px}
@media(orientation:portrait){body.touch #observation-ui{width:54vw;padding:11px}body.touch #observation-ui h2{font-size:17px}}

body.touch #joystick-zone.available:not(.active){display:none!important}

/* Gaze-discovered marginalia: one lightweight paper note, never a full-screen modal. */
#discovery{position:fixed;z-index:16;max-width:calc(100vw - 24px);color:#40382e;pointer-events:auto}
#discovery[hidden],#discovery-paper[hidden]{display:none!important}
#discovery-cue{display:grid;grid-template-columns:38px 1fr;gap:2px 9px;align-items:center;min-height:58px;max-width:270px;text-align:left;padding:9px 14px 9px 9px;border:1px solid #bca782;border-radius:5px 18px 18px 18px;background:#f7f0dfee;color:#514334;box-shadow:0 3px 12px #251d1824;cursor:pointer}
.discovery-symbol{grid-row:span 2;width:38px;height:38px;border:1px solid #ad6a53;border-radius:50%;background:#a0443010;display:grid;place-items:center;animation:discovery-breathe 3.6s ease-in-out infinite}
.discovery-symbol svg{width:30px;height:30px;fill:none;stroke:#984835;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.discovery-label{font:15px/1.45 var(--serif)}#discovery-cue small{font:10px/1.4 var(--serif);letter-spacing:1px;color:#85745b}
#discovery-paper{width:310px;max-width:calc(100vw - 24px);max-height:calc(100dvh - 160px);overflow:auto;padding:17px 20px;background:#f6efdf;border:1px solid #bca782;border-top:3px solid #984835;box-shadow:0 8px 22px #251d1829;margin-top:7px;overscroll-behavior:contain;touch-action:pan-y}
#discovery-paper header,#discovery-paper footer{display:flex;align-items:center;justify-content:space-between;gap:10px}
.discovery-era{font-size:10px;letter-spacing:1px;color:#8b654a}#discovery-close{border:0;background:none;color:#675642;min-width:36px;min-height:36px;font-size:23px;cursor:pointer}
#discovery-paper h2{font:22px/1.5 var(--serif);margin:4px 0 10px}.discovery-body{font:14px/1.9 var(--serif);margin:0}.discovery-task{font:12px/1.8 var(--serif);padding:10px 0;border-top:1px dashed #c4b494;color:#885139;margin:12px 0 0}
#discovery-paper a{color:#86765f;font-size:10px;line-height:1.5;text-underline-offset:3px;max-width:170px}#discovery-done{white-space:nowrap;background:none;border:1px solid #b9a280;color:#79523e;border-radius:3px;font-size:11px;padding:8px;min-height:36px;cursor:pointer}
#discovery button:focus-visible{outline:2px solid #984835;outline-offset:3px}
@keyframes discovery-breathe{50%{transform:translateY(-3px);background:#a0443020}}
@media(max-height:550px){#discovery-cue{min-height:45px;padding:5px 10px;grid-template-columns:30px 1fr}.discovery-symbol{width:30px;height:30px}.discovery-symbol svg{width:24px;height:24px}.discovery-label{font-size:13px}#discovery-paper{width:285px;padding:10px 14px;max-height:calc(100dvh - 145px)}#discovery-paper h2{font-size:18px;margin:0 0 6px}.discovery-body{font-size:12px;line-height:1.7}.discovery-task{font-size:11px;margin-top:7px;padding:7px 0}#discovery-paper header{min-height:28px}}
@media(prefers-reduced-motion:reduce){.discovery-symbol{animation:none}}
#discovery.expanded #discovery-cue{display:none}
#discovery.expanded #discovery-paper{margin-top:0}
@media(max-height:550px){#discovery.expanded #discovery-paper{max-height:calc(100dvh - 175px)}}
/* Three distinct voices share a single spatial anchor and the same visibility budget. */
#discovery[data-mode="verse"] #discovery-cue{background:linear-gradient(90deg,#342b22dd,#342b2280);border:0;border-left:2px solid #c9ab7c;border-radius:0;color:#fff5df;box-shadow:none;padding:12px 18px}
#discovery[data-mode="verse"] .discovery-label{font:19px/1.8 var(--serif);letter-spacing:2px}#discovery[data-mode="verse"] #discovery-cue small{color:#ead4ae}
#discovery[data-mode="verse"] .discovery-symbol{display:none}#discovery[data-mode="verse"] #discovery-cue{grid-template-columns:1fr}
#discovery[data-mode="verse"] #discovery-paper{background:#302b25ef;color:#f5ebd7;border-color:#ba9b6c}
#discovery[data-mode="verse"] .discovery-body{white-space:pre-line;font-size:18px;line-height:2.1;letter-spacing:1px}
#discovery[data-mode="verse"] .discovery-era,#discovery[data-mode="verse"] .discovery-task,#discovery[data-mode="verse"] #discovery-close,#discovery[data-mode="verse"] #discovery-done{color:#e0c89f}
#discovery[data-mode="dialogue"] #discovery-paper{border-radius:3px 18px 3px 18px;border-top:1px solid #bca782;border-left:4px solid #a05240;background:linear-gradient(115deg,#f8f2e5,#eee1ccee)}
#discovery[data-mode="dialogue"] .discovery-body{min-height:110px;font-size:16px;line-height:2}
.discovery-letter{animation:discovery-ink .28s both}@keyframes discovery-ink{from{opacity:0}to{opacity:1}}
.discovery-interaction{display:flex;flex-wrap:wrap;gap:7px;margin-top:10px}.discovery-interaction:empty{display:none}
.discovery-interaction button,#discovery-next{border:1px solid #b29b78;background:#f5ead6;color:#78503d;padding:8px 11px;border-radius:3px;min-height:36px;font:12px var(--serif);cursor:pointer}
.discovery-interaction button[aria-pressed="true"]{background:#79513e;color:#fff1da}#discovery-next{display:block;margin:10px 0 0 auto}#discovery-next[hidden]{display:none}
@media(max-height:550px){#discovery[data-mode="dialogue"] .discovery-body{font-size:13px;min-height:70px}#discovery[data-mode="verse"] .discovery-body{font-size:15px;line-height:1.8}#discovery[data-mode="verse"] .discovery-label{font-size:15px}}
@media(prefers-reduced-motion:reduce){.discovery-letter{animation:none}}
.discovery-sampler{flex-basis:100%;background:#e8dfca;border:1px solid #bdad90;border-radius:5px}.discovery-sampler svg{display:block;width:100%;height:80px}