:root{
  --gold:#caa24a;
  --bright:#f2d27b;
  --bg:#050403;
  --panel:#120e0a;
  --text:#f4f1ea;
  --muted:rgba(244,241,234,.68);
  --line:rgba(202,162,74,.28);
}

*{box-sizing:border-box}

body{
  margin:0;
  min-height:100vh;
  background:
    linear-gradient(180deg,rgba(0,0,0,.50),rgba(0,0,0,.88)),
    url("../assets/museum_bg.jpg") center/cover no-repeat !important;
  background-attachment:fixed;
  color:var(--text);
  font-family:Arial,sans-serif;
}

.museum-noise{
  position:fixed;
  inset:0;
  pointer-events:none;
  opacity:.14;
  background:none!important;
  background-image:none!important;
  background-size:100% 4px;
  mix-blend-mode:screen;
}

.museum-shell{
  width:min(1180px,92vw);
  margin:0 auto;
  padding:24px 0 48px;
}

.museum-header{
  display:grid;
  grid-template-columns:1fr auto 1fr;
  align-items:center;
  gap:16px;
  margin-bottom:22px;
}

.museum-back,
.museum-pass{
  justify-self:start;
  border:1px solid var(--line);
  border-radius:999px;
  color:var(--text);
  text-decoration:none;
  padding:10px 14px;
  background:rgba(0,0,0,.34);
  font-size:12px;
  letter-spacing:.1em;
  text-transform:uppercase;
}

.museum-pass{
  justify-self:end;
  color:var(--bright);
}

nav a,
.vault-main-nav a,
.museum-main-nav a,
.museum-nav a,
.museum-pill,
.cta{
  border-radius:999px;
  border:1px solid rgba(242,210,123,.35);
  background:rgba(0,0,0,.45);
  color:#f2d27b;
  text-decoration:none;
  padding:10px 14px;
  font-size:12px;
  font-weight:800;
  letter-spacing:.1em;
  text-transform:uppercase;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.05),0 10px 28px rgba(0,0,0,.28);
  transition:background .18s ease,color .18s ease,border-color .18s ease,transform .18s ease;
}

nav a:visited,
.vault-main-nav a:visited,
.museum-main-nav a:visited,
.museum-nav a:visited,
.museum-pill:visited,
.cta:visited{
  color:#f2d27b;
}

nav a:hover,
nav a:focus-visible,
.vault-main-nav a:hover,
.vault-main-nav a:focus-visible,
.museum-main-nav a:hover,
.museum-main-nav a:focus-visible,
.museum-nav a:hover,
.museum-nav a:focus-visible,
.museum-pill:hover,
.museum-pill:focus-visible,
.cta:hover,
.cta:focus-visible{
  background:linear-gradient(180deg,#f2d27b,#caa24a 58%,#8b641e);
  border-color:rgba(242,210,123,.78);
  color:#100c05;
  outline:none;
  transform:translateY(-1px);
}

.museum-kicker,
.room-tier,
.modal-type{
  color:var(--bright);
  font-size:11px;
  letter-spacing:.22em;
  text-transform:uppercase;
}

h1,h2,h3,p{margin:0}

h1{
  color:var(--bright);
  font-size:clamp(28px,4vw,48px);
  letter-spacing:.08em;
  text-align:center;
  text-transform:uppercase;
}

.museum-hero{
  min-height:320px;
  display:grid;
  grid-template-columns:1.1fr .9fr;
  align-items:center;
  gap:24px;
  border:1px solid var(--line);
  border-radius:18px;
  padding:28px;
  margin-bottom:22px;
  background:
    linear-gradient(90deg,rgba(0,0,0,.82),rgba(0,0,0,.18)),
    radial-gradient(circle at 76% 38%,rgba(242,210,123,.22),transparent 34%),
    linear-gradient(145deg,#17120f,#050403);
  box-shadow:0 28px 86px rgba(0,0,0,.62),inset 0 1px 0 rgba(255,255,255,.06);
  overflow:hidden;
}

.hero-copy h2{
  max-width:650px;
  margin:10px 0 12px;
  font-size:clamp(34px,6vw,72px);
  line-height:.95;
  letter-spacing:.02em;
  text-transform:uppercase;
}

.hero-copy p{
  max-width:560px;
  color:var(--muted);
  line-height:1.65;
}

.hero-mark{
  justify-self:center;
  width:min(320px,52vw);
  aspect-ratio:1;
  display:grid;
  place-items:center;
  border:1px solid rgba(242,210,123,.3);
  border-radius:50%;
  color:rgba(242,210,123,.16);
  font-size:110px;
  font-weight:900;
  box-shadow:0 0 88px rgba(202,162,74,.18),inset 0 0 42px rgba(202,162,74,.08);
}

.room-section{
  position:relative;
  margin-top:22px;
  border-top:1px solid var(--line);
  padding-top:18px;
}

.room-head{
  display:flex;
  align-items:end;
  justify-content:space-between;
  gap:14px;
  margin-bottom:14px;
}

.room-head h3{
  margin-top:4px;
  font-size:24px;
  text-transform:uppercase;
}

.room-status{
  border:1px solid var(--line);
  border-radius:999px;
  color:var(--bright);
  padding:8px 12px;
  font-size:12px;
  text-transform:uppercase;
}

.exhibit-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(230px,1fr));
  gap:14px;
}

.exhibit-card{
  border:1px solid var(--line);
  border-radius:14px;
  overflow:hidden;
  background:linear-gradient(180deg,rgba(255,255,255,.04),rgba(255,255,255,0) 20%),linear-gradient(180deg,#16110d,#070604);
  box-shadow:0 18px 48px rgba(0,0,0,.36);
}

.cover{
  min-height:210px;
  display:grid;
  place-items:end start;
  padding:16px;
  background:
    radial-gradient(circle at 62% 26%,rgba(242,210,123,.24),transparent 28%),
    linear-gradient(145deg,#241a0d,#050403);
  color:rgba(242,210,123,.36);
  font-size:44px;
  font-weight:900;
}

.cover.gold{
  background:radial-gradient(circle at 50% 30%,rgba(242,210,123,.34),transparent 32%),linear-gradient(145deg,#3b2a10,#080604);
}

.cover.elite{
  background:radial-gradient(circle at 44% 28%,rgba(255,255,255,.2),transparent 28%),linear-gradient(145deg,#1b1b1b,#080604);
}

.museum-display-block{
  margin-top:28px;
  border-top:1px solid var(--line);
  padding-top:18px;
}

.museum-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(190px,1fr));
  gap:16px;
}

.museum-grid.compact{
  grid-template-columns:repeat(auto-fit,minmax(170px,1fr));
}

.museum-frame-card{
  border:1px solid var(--line);
  border-radius:16px;
  background:linear-gradient(180deg,rgba(255,255,255,.04),rgba(255,255,255,0) 24%),linear-gradient(180deg,#15100c,#070604);
  box-shadow:0 18px 54px rgba(0,0,0,.42),inset 0 1px 0 rgba(255,255,255,.05);
  overflow:hidden;
}

.image-frame{
  position:relative;
  width:100%;
  min-height:230px;
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:10px;
  border:10px solid #1a1208;
  border-radius:14px 14px 0 0;
  padding:14px;
  color:var(--bright);
  background-position:center;
  background-size:cover;
  box-shadow:inset 0 0 0 1px rgba(242,210,123,.42),inset 0 0 48px rgba(0,0,0,.48);
  cursor:pointer;
  text-align:left;
}

.image-frame:disabled{
  cursor:not-allowed;
  filter:saturate(.4);
}

.frame-tag,
.frame-type{
  border:1px solid rgba(242,210,123,.36);
  border-radius:999px;
  padding:7px 10px;
  background:rgba(0,0,0,.54);
  font-size:11px;
  letter-spacing:.12em;
  text-transform:uppercase;
}

.frame-type{
  color:var(--muted);
}

.video-wall{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
  gap:16px;
}

.video-card,
.empty-museum-slot,
.fan-submission-panel{
  border:1px solid var(--line);
  border-radius:16px;
  padding:16px;
  background:linear-gradient(180deg,rgba(255,255,255,.045),rgba(255,255,255,.01)),rgba(0,0,0,.38);
}

.video-card iframe,
.modal-video iframe{
  width:100%;
  aspect-ratio:16/9;
  border:0;
  border-radius:12px;
  background:#050403;
}

.video-placeholder{
  width:100%;
  min-height:180px;
  border:1px solid var(--line);
  border-radius:12px;
  color:var(--bright);
  background:radial-gradient(circle at center,rgba(242,210,123,.14),transparent 42%),#050403;
  cursor:pointer;
  text-transform:uppercase;
  letter-spacing:.12em;
}

.museum-two-col{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:20px;
}

.trophy-shelf,
.history-wall{
  display:grid;
  gap:12px;
}

.trophy-plaque,
.history-item{
  width:100%;
  border:1px solid var(--line);
  border-radius:14px;
  padding:14px;
  color:var(--text);
  background:linear-gradient(145deg,rgba(242,210,123,.12),rgba(0,0,0,.44));
  cursor:pointer;
  text-align:left;
}

.trophy-plaque span,
.history-item span{
  color:var(--bright);
  font-size:11px;
  letter-spacing:.16em;
  text-transform:uppercase;
}

.trophy-plaque b,
.history-item b{
  display:block;
  margin:6px 0;
  text-transform:uppercase;
}

.trophy-plaque small,
.history-item small,
.fan-submission-panel p{
  color:var(--muted);
  line-height:1.45;
}

.is-locked{
  opacity:.52;
  filter:saturate(.55);
}

.fan-submission-panel{
  display:grid;
  grid-template-columns:minmax(220px,.8fr) 1.2fr;
  gap:16px;
  align-items:start;
}

.exhibit-body{
  padding:14px;
}

.exhibit-type{
  color:var(--muted);
  font-size:11px;
  letter-spacing:.14em;
  text-transform:uppercase;
}

.exhibit-title{
  margin:6px 0 12px;
  color:var(--text);
  font-size:18px;
  text-transform:uppercase;
}

.enter-btn{
  width:100%;
  min-height:44px;
  border:0;
  border-radius:999px;
  background:linear-gradient(180deg,#f2d27b,#caa24a 56%,#8b641e);
  color:#100c05;
  cursor:pointer;
  font-weight:900;
  letter-spacing:.1em;
  text-transform:uppercase;
}

.locked .exhibit-card{
  opacity:.48;
  filter:saturate(.55);
}

.locked .enter-btn{
  background:#14100b;
  color:var(--muted);
  border:1px solid var(--line);
  cursor:not-allowed;
}

.exhibit-modal{
  position:fixed;
  inset:0;
  z-index:1000;
  display:grid;
  place-items:center;
  padding:20px;
  background:rgba(0,0,0,.82);
}

.exhibit-modal.hidden{display:none}

.modal-panel{
  position:relative;
  width:min(920px,94vw);
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:0;
  border:1px solid var(--line);
  border-radius:18px;
  overflow:hidden;
  background:linear-gradient(180deg,#17120f,#050403);
  box-shadow:0 30px 120px rgba(0,0,0,.86);
}

.modal-close{
  position:absolute;
  top:12px;
  right:12px;
  z-index:2;
  width:38px;
  height:38px;
  border-radius:50%;
  border:1px solid var(--line);
  background:#070604;
  color:var(--bright);
  cursor:pointer;
  font-size:24px;
}

.modal-art{
  min-height:420px;
  background:radial-gradient(circle at 50% 32%,rgba(242,210,123,.3),transparent 32%),linear-gradient(145deg,#2b200f,#050403);
}

.modal-copy{
  padding:34px;
  display:flex;
  flex-direction:column;
  justify-content:center;
}

.modal-copy h2{
  margin:10px 0 14px;
  color:var(--bright);
  font-size:34px;
  text-transform:uppercase;
}

.modal-copy p{
  color:var(--muted);
  line-height:1.65;
}

.modal-meta{
  margin:-4px 0 14px;
  color:var(--muted);
  font-size:12px;
  letter-spacing:.14em;
  text-transform:uppercase;
}

.modal-video{
  margin-top:18px;
}

.modal-video.hidden{
  display:none;
}

.audio-placeholder{
  margin-top:22px;
  border:1px solid var(--line);
  border-radius:999px;
  padding:12px 14px;
  color:var(--muted);
  text-transform:uppercase;
  letter-spacing:.12em;
  font-size:12px;
}

@media (max-width:760px){
  .museum-header{
    grid-template-columns:1fr;
    text-align:center;
  }

  .museum-back,
  .museum-pass{
    justify-self:center;
  }

  .museum-hero,
  .modal-panel,
  .museum-two-col,
  .fan-submission-panel{
    grid-template-columns:1fr;
  }

  .hero-mark{
    width:min(240px,70vw);
  }

  .modal-art{
    min-height:260px;
  }
}

/* VAULT OVERLAP LAYOUT FIX V1 */
.museum-shell,
.museum-header,
.museum-hero,
.room-head,
.exhibit-grid,
.exhibit-card,
.modal-panel,
.modal-copy{
  min-width:0;
}

.museum-back,
.museum-pass,
.room-status,
.enter-btn,
.audio-placeholder{
  overflow-wrap:anywhere;
  white-space:normal;
  line-height:1.2;
  text-align:center;
}

h1,
.hero-copy h2,
.room-head h3,
.exhibit-title,
.modal-copy h2{
  line-height:1.05;
  overflow-wrap:anywhere;
}

.museum-noise{
  pointer-events:none;
  z-index:1;
}

.museum-shell{
  position:relative;
  z-index:3;
}

.exhibit-grid{
  align-items:stretch;
}

@media (max-width:900px){
  .museum-header,
  .museum-hero,
  .modal-panel{
    grid-template-columns:1fr;
  }

  .museum-back,
  .museum-pass{
    justify-self:center;
  }

  .museum-hero{
    min-height:auto;
  }
}

@media (max-width:520px){
  .museum-shell{
    width:min(94vw,1180px);
    padding:18px 0 36px;
  }

  .museum-header{
    gap:12px;
  }

  .museum-back,
  .museum-pass,
  .enter-btn{
    width:100%;
  }

  .museum-hero{
    padding:20px 16px;
    border-radius:16px;
  }

  .hero-copy h2{
    font-size:clamp(30px,12vw,52px);
  }

  .room-head{
    flex-direction:column;
    align-items:stretch;
  }

  .modal-copy{
    padding:24px 18px;
  }
}

/* VAULT CRITICAL UI + NAV FIX V2 */
button{
  overflow-wrap:anywhere;
  white-space:normal;
  text-align:center;
}

.museum-main-nav,
.buttons{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  justify-content:center;
  align-items:center;
  margin:14px 0 22px;
}

.museum-main-nav a,
.museum-main-nav button,
.buttons a,
.buttons button{
  flex:1 1 190px;
  max-width:270px;
}

@media (max-width:520px){
  .museum-main-nav,
  .buttons{
    flex-direction:column;
    align-items:stretch;
  }

  .museum-main-nav a,
  .museum-main-nav button,
  .buttons a,
  .buttons button{
    flex:1 1 auto;
    max-width:none;
    width:100%;
  }
}

/* VAULT GLOBAL UI DUPLICATE + OVERLAP SWEEP V4 */
body > * {
  position: relative;
  z-index: 5;
}

.access-container {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 999;
}

.access-text {
  position: relative;
  z-index: 10;
  text-align: center;
  max-width: 90%;
}

.access-stamp {
  position: absolute;
  z-index: 1;
  width: 60%;
  max-width: 400px;
  opacity: 0.06;
  pointer-events: none;
}

.clean-buttons,
.vault-main-nav,
.buttons,
.action-row,
.vault-actions,
.album-actions,
.master-buttons,
.controls,
.actions,
.reward-actions,
.vault-link-list {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  justify-content: center;
}

.clean-buttons button,
.clean-buttons a,
.vault-main-nav button,
.vault-main-nav a,
.buttons button,
.buttons a,
.action-row button,
.action-row a,
.vault-actions button,
.vault-actions a,
.album-actions button,
.album-actions a,
.master-buttons button,
.master-buttons a,
.controls button,
.controls a,
.actions button,
.actions a,
.reward-actions button,
.reward-actions a,
.vault-link-list button,
.vault-link-list a {
  flex: 1 1 180px;
  max-width: 260px;
}

button,
a {
  display: inline-block;
  text-align: center;
  overflow-wrap: anywhere;
  white-space: normal;
}

@media (max-width: 520px) {
  .clean-buttons button,
  .clean-buttons a,
  .vault-main-nav button,
  .vault-main-nav a,
  .buttons button,
  .buttons a,
  .action-row button,
  .action-row a,
  .vault-actions button,
  .vault-actions a,
  .album-actions button,
  .album-actions a,
  .master-buttons button,
  .master-buttons a,
  .controls button,
  .controls a,
  .actions button,
  .actions a,
  .reward-actions button,
  .reward-actions a,
  .vault-link-list button,
  .vault-link-list a {
    flex-basis: 100%;
    max-width: 100%;
  }
}

/* VAULT GLOBAL UI SWEEP V4 - EFFECT LAYER STACK FIX */
.cinematic-overlay,
.cinematic-fog-back,
.cinematic-glow,
.cinematic-particles,
.cinematic-fog-front,
.cinematic-vignette,
.noise,
.fog,
.particles {
  z-index: 1;
  pointer-events: none;
}

.vault-page,
.page,
main,
header,
.vault-main-nav,
.access-text {
  position: relative;
  z-index: 5;
}

/* Museum background override - remove legacy page backdrops */
html,
body{
  background:
    linear-gradient(180deg,rgba(0,0,0,.50),rgba(0,0,0,.88)),
    url("../assets/museum_bg.jpg") center/cover no-repeat !important;
  background-attachment:fixed;
}

body::before,
.museum-shell::before,
.museum-hero::before,
.museum-noise{
  background:none!important;
  background-image:none!important;
}