:root {
  --museum-night: #11110f;
  --museum-paper: #f4efe3;
  --museum-ash: #8d877d;
  --museum-rust: #bd4a2c;
  --museum-cold: #b8d9dd;
  --museum-instrument: #54e5ef;
}

body {
  background:
    radial-gradient(circle at 17% 3%, rgba(189, 74, 44, .055), transparent 26rem),
    repeating-linear-gradient(93deg, transparent 0 33px, rgba(23, 20, 15, .012) 34px),
    var(--bg);
}

header.site {
  position: relative;
}

.museum-sound {
  margin-left: auto;
  border: 1px solid var(--line);
  background: transparent;
  color: var(--mut);
  padding: .3rem .55rem;
  font: .68rem/1.2 ui-monospace, SFMono-Regular, Consolas, monospace;
  letter-spacing: .08em;
  text-transform: uppercase;
  cursor: pointer;
}

.museum-sound:hover,
.museum-sound[aria-pressed="true"] {
  border-color: var(--accent);
  color: var(--accent);
}

.museum-doors {
  display: grid;
  gap: 1.15rem;
}

.museum-doors .label {
  position: relative;
  overflow: hidden;
  margin: 0;
  padding: 1.25rem 1.4rem;
  border: 1px solid var(--line);
  border-left-width: 4px;
}

.museum-doors .label:hover,
.museum-doors .label:focus-visible {
  box-shadow: -.45rem .45rem 0 rgba(23, 20, 15, .055);
}

.label--standing {
  border-left-color: var(--ink) !important;
}

.label--fallen {
  border-left-color: var(--museum-rust) !important;
  background: linear-gradient(105deg, rgba(189, 74, 44, .075), transparent 52%);
}

.label--fallen::after {
  content: "";
  position: absolute;
  inset: -2rem 21% -2rem auto;
  width: 1px;
  background: var(--museum-rust);
  opacity: .45;
  transform: rotate(18deg);
}

.label--received {
  border-left-color: var(--museum-cold) !important;
  background: linear-gradient(105deg, rgba(184, 217, 221, .18), transparent 58%);
}

.exhibit-threshold {
  position: relative;
  margin: -1rem 0 2.25rem;
  padding: 1.35rem 1.45rem 1.55rem;
  border: 1px solid var(--line);
  border-left: 4px solid var(--ink);
  overflow: hidden;
}

.threshold-coordinate {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  color: var(--mut);
  font: .7rem/1.3 ui-monospace, SFMono-Regular, Consolas, monospace;
  letter-spacing: .13em;
  text-transform: uppercase;
}

.threshold-status {
  margin: .9rem 0 .25rem;
  color: var(--mut);
  font: .7rem/1.3 ui-monospace, SFMono-Regular, Consolas, monospace;
  letter-spacing: .2em;
  text-transform: uppercase;
}

.exhibit-threshold h1 {
  max-width: 17ch;
  margin: 0;
  font-size: clamp(2rem, 7vw, 4rem);
  letter-spacing: -.035em;
}

.exhibit--fallen .exhibit-threshold {
  border-left-color: var(--museum-rust);
  background: linear-gradient(110deg, rgba(189, 74, 44, .1), transparent 55%);
}

.exhibit--received .exhibit-threshold {
  border-left-color: var(--museum-cold);
  background: linear-gradient(110deg, rgba(184, 217, 221, .2), transparent 60%);
}

.threshold-fracture {
  display: none;
}

.exhibit--fallen .threshold-fracture {
  display: block;
  position: absolute;
  top: -15%;
  right: 17%;
  width: 2px;
  height: 145%;
  background: var(--museum-rust);
  opacity: .42;
  transform: rotate(16deg);
}

.instrument-token {
  display: flex;
  flex-wrap: wrap;
  gap: .45rem;
  align-items: center;
  margin-top: 1rem;
  padding: .42rem .65rem;
  border: 1px solid var(--museum-instrument);
  color: #086d75;
  background: rgba(84, 229, 239, .08);
  font: .72rem/1.2 ui-monospace, SFMono-Regular, Consolas, monospace;
  letter-spacing: .05em;
}

.instrument-token code {
  overflow-wrap: anywhere;
  color: var(--ink);
  font: inherit;
}

@media (max-width: 560px) {
  .museum-sound {
    margin-left: 0;
  }

  .exhibit-threshold {
    margin-top: -.5rem;
    padding: 1.1rem;
  }
}

/* killed_by — the cause of a fall, written on the ten fallen no's since 2026-07-30 and
   displayed nowhere until now. Rust rather than instrument-cyan: this is the wall's own
   record of what killed it, not a handle pointing at an instrument. Prose, not a token,
   because every value is a sentence. */
.killed-by {
  margin-top: 1rem;
  padding: .6rem .75rem;
  border-left: 2px solid var(--museum-rust);
  background: rgba(189, 74, 44, .07);
}

.killed-by span {
  display: block;
  margin-bottom: .3rem;
  color: var(--mut);
  font: .7rem/1.3 ui-monospace, SFMono-Regular, Consolas, monospace;
  letter-spacing: .2em;
  text-transform: uppercase;
}

.killed-by p {
  margin: 0;
  max-width: 62ch;
  color: var(--ink);
  font-size: .95rem;
  line-height: 1.55;
}
