/* ============================================================
   THE VAULT — a private viewing
   The house's most reserved room. Blackened bronze leaves, a P cut
   into the metal, one lamp on the floor. The answer is struck on a
   plate, never printed on a slip. One curve, var(--ease).
   ============================================================ */

.vd{
  --v-bronze:#161310;
  --v-face:#1c1814;
  --v-ink:#E8DFD0;
  --v-mute:rgba(232,223,208,.42);
  --v-hair:rgba(255,236,210,.08);
  --v-cut:rgba(0,0,0,.55);
  background:#070605;
  color:var(--v-ink);
}
.vd::before{
  content:""; position:absolute; inset:0; z-index:0; pointer-events:none;
  background-image:var(--fibre); background-size:220px 220px; opacity:.38;
}

/* one pool on the floor, compositor only */
.vd-floor{
  position:absolute; left:50%; bottom:0; z-index:1; pointer-events:none;
  width:min(1100px, 160vw); height:42vh; margin-left:calc(min(1100px, 160vw) / -2);
  background:radial-gradient(50% 70% at 50% 0%, rgba(255,214,160,.16), rgba(180,110,50,.05) 42%, transparent 72%);
  opacity:.55; transition:opacity 2.4s var(--ease);
}
.vd.is-entering .vd-floor, .vd.is-corridor .vd-floor{ opacity:.9; }
.vd.is-held .vd-floor{ opacity:.18; }
.vd.is-open .vd-floor{ opacity:1; }

.vd-glow{
  background:
    radial-gradient(ellipse 18% 58% at 50% 48%, rgba(255,214,160,.07) 0%, transparent 70%),
    radial-gradient(ellipse 4% 30% at 50% 48%, rgba(255,236,210,.1) 0%, transparent 50%);
}
.vd.is-entering .vd-glow, .vd.is-corridor .vd-glow{
  background:
    radial-gradient(ellipse 34% 56% at 50% 46%, rgba(255,214,160,.14) 0%, transparent 70%),
    radial-gradient(120% 70% at 50% 118%, #070605 0%, transparent 46%);
}

/* leaves you can believe: bronze, grain, a panel struck in */
.vd-leaf{
  background:
    linear-gradient(180deg, rgba(255,236,210,.07) 0%, transparent 16%, transparent 76%, rgba(0,0,0,.5) 100%),
    linear-gradient(90deg, #14110e 0%, #2a221c 48%, #3a2e24 100%);
}
.vd-l{
  box-shadow:
    inset -1px 0 0 rgba(255,220,170,.18),
    inset 1px 0 0 rgba(255,255,255,.03),
    inset 40px 0 80px -28px rgba(0,0,0,.85);
}
.vd-r{
  background:
    linear-gradient(180deg, rgba(255,236,210,.07) 0%, transparent 16%, transparent 76%, rgba(0,0,0,.5) 100%),
    linear-gradient(270deg, #14110e 0%, #2a221c 48%, #3a2e24 100%);
  box-shadow:
    inset 1px 0 0 rgba(255,220,170,.18),
    inset -1px 0 0 rgba(255,255,255,.03),
    inset -40px 0 80px -28px rgba(0,0,0,.85);
}
.vd-leaf::before{
  content:""; position:absolute; inset:0; pointer-events:none; z-index:1;
  background:
    repeating-linear-gradient(90deg, rgba(255,236,210,.012) 0 1px, transparent 1px 3px, rgba(0,0,0,.05) 3px 4px, transparent 4px 9px),
    var(--fibre);
  background-size:auto, 160px 160px;
  opacity:.7;
}
.vd-leaf::after{
  content:""; position:absolute; top:7%; bottom:7%; left:16%; right:16%; z-index:1; pointer-events:none;
  box-shadow:
    inset 0 1px 0 rgba(0,0,0,.7),
    inset 1px 0 0 rgba(0,0,0,.45),
    inset 0 -1px 0 rgba(255,236,210,.05),
    inset -1px 0 0 rgba(255,236,210,.03);
}
.vd-plate{ opacity:.35; }

.vd-slit{
  width:2px;
  background:linear-gradient(180deg,
    rgba(255,230,190,0) 0%,
    rgba(255,220,170,.35) 12%,
    #F3E2C0 48%,
    #E8C98A 56%,
    rgba(255,220,170,.35) 88%,
    rgba(255,230,190,0) 100%);
  box-shadow:
    0 0 8px 1px rgba(255,214,160,.28),
    0 0 28px 4px rgba(180,110,50,.12);
  animation:none;
}
.vd.is-land .vd-slit{ animation:none; }
.vd.is-entering .vd-slit, .vd.is-corridor .vd-slit{
  width:clamp(18px, 3vw, 36px);
  box-shadow:
    0 0 12px 2px rgba(255,214,160,.28),
    0 0 40px 8px rgba(180,110,50,.12);
}
.vd-edge{
  background:linear-gradient(180deg, transparent 8%, rgba(255,220,170,.22) 50%, transparent 92%);
  box-shadow:none; opacity:.7;
}

/* the P: cut into the meeting of the leaves. It stays on the metal;
   when the leaves part it is not left hanging in the light. */
.vd-seal{
  position:absolute; left:50%; top:44%; z-index:5; pointer-events:none;
  width:min(118px, 16vw); aspect-ratio:1;
  margin:calc(min(118px, 16vw) / -2) 0 0 calc(min(118px, 16vw) / -2);
  border-radius:50%;
  background:
    radial-gradient(circle at 38% 30%, rgba(255,236,210,.05), transparent 46%),
    linear-gradient(165deg, #2a221c 0%, #1a1612 55%, #14110e 100%);
  box-shadow:
    inset 0 0 0 1px rgba(0,0,0,.55),
    inset 0 3px 8px rgba(0,0,0,.45);
  opacity:1; transition:opacity .9s var(--ease), transform 1.8s var(--ease);
}
.vd:not(.is-land) .vd-seal{ opacity:0; }
.vd-seal-p{
  position:absolute; inset:0; display:flex; align-items:center; justify-content:center;
  font-family:var(--display); font-weight:400; font-size:clamp(42px, 6.4vw, 58px);
  line-height:1; letter-spacing:-.04em;
  color:#0A0806;
  text-shadow:
    0 1px 0 rgba(255,236,210,.16),
    0 -1px 0 rgba(0,0,0,.7);
}
.vd-lip{
  height:clamp(10px, 1.4vh, 16px);
  background:linear-gradient(180deg, #1a1612 0%, #070605 100%);
  box-shadow:0 -1px 0 rgba(255,220,170,.08);
}

/* ENTER: a word, not a plate */
.vd-enter{
  border-bottom-color:rgba(232,223,208,.28);
  color:rgba(232,223,208,.55);
  filter:none; text-shadow:none; transform:none;
}
.vd-enter::before, .vd-enter::after{ content:none !important; }
.vd-enter:hover, .vd-enter:focus-visible{
  color:var(--v-ink); transform:none; filter:none; text-shadow:none;
  border-bottom-color:rgba(232,223,208,.7);
}

/* field: a line cut in the floor, not a tray */
.vd-field{
  border-bottom-color:rgba(232,223,208,.28);
  filter:none; transform:none;
}
.vd.is-pen .vd-field, .vd.has-ink .vd-field{ filter:none; transform:none; }
.vd-go{ color:rgba(232,223,208,.5); text-shadow:none; }
.vd.has-ink .vd-go, .vd-go:hover, .vd-go:focus-visible{ color:var(--v-ink); text-shadow:none; }

.vd.is-answered .vd-slit, .vd.is-held .vd-slit{
  width:2px !important;
  opacity:.35;
  box-shadow:0 0 8px 1px rgba(255,214,160,.12);
}

/* the answer: a struck bronze plate — never a receipt */
.vd-slip{
  padding:28px 26px 24px;
  color:var(--v-ink);
  background:
    linear-gradient(180deg, rgba(255,236,210,.05) 0%, transparent 22%),
    linear-gradient(165deg, #2a221c 0%, #161310 100%);
  box-shadow:
    inset 0 0 0 1px rgba(255,236,210,.1),
    inset 0 1px 0 rgba(255,236,210,.06),
    0 0 0 1px rgba(0,0,0,.45);
  -webkit-mask-image:none; mask-image:none;
  transform:translateY(8px); opacity:0;
  transition:transform 1.2s var(--ease), opacity 1.2s var(--ease);
}
.vd.is-answered .vd-slip{ transform:none; opacity:1; }
.vd-slip-h{ color:rgba(232,223,208,.38); }
.vd-slip-no{
  font-family:var(--display); font-style:italic;
  color:var(--v-ink); letter-spacing:-.02em;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.vd-slip-k{ border-top-color:rgba(255,236,210,.1); color:rgba(232,223,208,.42); }
.vd-slip-line{ color:rgba(232,223,208,.78); }
.vd-rows dt{ color:rgba(232,223,208,.38); }
.vd-rows dd{ color:var(--v-ink); }
.vd-rows > div{ border-top-color:rgba(255,236,210,.08); }
.vd-slip-go a{ color:var(--v-ink); border-bottom-color:rgba(232,223,208,.32); }
.vd-slip-go a:hover, .vd-slip-go a:focus-visible{ color:var(--v-ink); border-bottom-color:var(--v-ink); }
.vd-slip-proof{ color:rgba(232,223,208,.28); }

.vd-held{ color:rgba(232,223,208,.4); }

/* the reserved collection: a dark room, not a blur panel */
.vd-col{
  background:transparent; backdrop-filter:none;
  border-top-color:rgba(255,236,210,.08);
  color:var(--v-ink);
}
.vd-col-k{ color:rgba(232,223,208,.36); }
.vd-col-t{ color:var(--v-ink); font-family:var(--display); }
.vd-col-line{ color:rgba(232,223,208,.5); }

/* once the night salon is up, the door and the plate stay behind it */
.vd.is-open .vd-stage{ opacity:.18; pointer-events:none; }
.vd.is-open .vd-hud{ opacity:0 !important; visibility:hidden !important; pointer-events:none !important; }

/* ---------- night salon: Ledger's first counter, Instruments' sheets, after hours ---------- */
.vn{
  position:relative; isolation:isolate;
  min-height:100vh; min-height:100svh;
  margin:0;
  padding:calc(var(--nav-h) + clamp(8px, 1.8vh, 22px)) 0 clamp(120px, 18vh, 200px);
  background:#070605; color:var(--v-ink);
}
.vn-lamp{
  position:fixed; left:0; top:0; z-index:0; pointer-events:none;
  width:140vmax; height:110vmax; margin:-55vmax 0 0 -70vmax;
  background:radial-gradient(closest-side, rgba(255,214,160,.16) 0%, rgba(180,110,50,.07) 38%, rgba(255,214,160,0) 72%);
  transform:translate3d(30vw, 18vh, 0);
  will-change:transform;
}
.vn.is-view .vn-lamp{ opacity:0; }
.vn-grain{
  position:fixed; inset:0; z-index:0; pointer-events:none;
  background-image:var(--fibre); background-size:200px 200px; opacity:.28;
}
.vn-wrap{ position:relative; z-index:1; max-width:1240px; margin:0 auto; padding:0 var(--margin, var(--gutter)); }

.vn-title > .sr, .vn-cap-name > .sr, .vn-view-name > .sr{
  position:absolute !important; left:0; top:0;
  width:1px !important; height:1px !important; margin:-1px !important; padding:0 !important;
  overflow:hidden !important; border:0 !important; white-space:nowrap !important;
  clip:rect(0, 0, 0, 0) !important; clip-path:inset(50%) !important;
  color:transparent !important; font-size:0 !important; line-height:0 !important;
}

.vn-mast{ margin:0 0 clamp(48px, 8.5vh, 104px); }
.vn-title{
  position:relative; margin:0; font-weight:400;
  font-size:clamp(56px, 11vw, 120px); line-height:.9; letter-spacing:-.03em;
  color:var(--v-ink);
}
.vn-wd{ display:inline-block; overflow:hidden; vertical-align:top; max-width:100%;
  padding:.06em 0 .16em; margin:-.06em 0 -.16em; }
.vn-ch{ display:inline-block; transform:translate3d(0, 112%, 0); }
.vn-title .vn-ch{
  transition:transform 1.15s var(--ease) calc(var(--c, 0) * 70ms + 80ms);
}
.vn-cap-name .vn-ch{
  transition:transform 1.05s var(--ease) calc(var(--i, 0) * 80ms + 440ms + var(--c, 0) * 70ms);
}
.vn-view-name .vn-ch{
  transition:transform 1.05s var(--ease) calc(.26s + var(--c, 0) * 17ms);
}
.vn.is-live .vn-ch, .vn-view.is-open .vn-ch{ transform:none; }

.vn-mast-row{
  display:flex; justify-content:space-between; align-items:baseline; gap:24px;
  margin-top:16px;
  opacity:0; transition:opacity 1s var(--ease) .35s;
}
.vn.is-live .vn-mast-row{ opacity:1; }
.vn-k{ margin:0; font-family:var(--mono); font-size:9.5px; line-height:1.6;
  letter-spacing:.26em; text-transform:uppercase; color:rgba(232,223,208,.38); }
.vn-n{ color:var(--v-ink); font-variant-numeric:tabular-nums; }

.vn-grid{
  list-style:none; margin:0; padding:0;
  display:grid; grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:clamp(52px, 8.5vh, 104px) clamp(20px, 2.6vw, 44px);
}
@media (max-width:1023px){ .vn-grid{ grid-template-columns:repeat(2, minmax(0, 1fr)); } }
@media (max-width:519px){ .vn-grid{ grid-template-columns:minmax(0, 1fr); gap:60px; } }
.vn-cell{ margin:0; padding:0; min-width:0; }

.vn-piece{
  position:relative; isolation:isolate;
  display:block; width:100%; margin:0; padding:0; border:0; background:none;
  color:inherit; font:inherit; text-align:left; cursor:pointer;
  -webkit-appearance:none; appearance:none; -webkit-tap-highlight-color:transparent;
  opacity:0; transform:translate3d(0, 22px, 0);
  transition:
    opacity 1s var(--ease) calc(var(--i, 0) * 80ms + 200ms),
    transform 1.2s var(--ease) calc(var(--i, 0) * 80ms + 200ms);
}
.vn.is-live .vn-piece{ opacity:1; transform:none; }
.vn-piece:focus{ outline:none; }
.vn-piece:focus-visible .vn-face{ outline:1px solid rgba(232,223,208,.4); outline-offset:7px; }

.vn-face{
  --sx:.70; --sy:.58; --e:.06em;
  position:relative; display:block; overflow:hidden;
  width:100%; aspect-ratio:4 / 5;
  container-type:inline-size;
  background:
    radial-gradient(ellipse 70% 50% at calc(50% + var(--sx) * 12%) calc(36% + var(--sy) * 10%), rgba(255,236,210,.08), transparent 62%),
    linear-gradient(165deg, #2a221c 0%, #12100d 100%);
  box-shadow:
    inset 0 0 0 1px rgba(255,236,210,.08),
    0 26px 46px -36px rgba(0,0,0,.55);
  transition:transform .9s var(--ease);
}
.vn-piece::before{
  content:""; position:absolute; left:0; top:0; z-index:-1; width:100%; aspect-ratio:4 / 5;
  box-shadow:0 40px 64px -40px rgba(0,0,0,.7);
  opacity:0; pointer-events:none;
  transition:opacity .9s var(--ease), transform .9s var(--ease);
}
@media (hover:hover){
  .vn-piece:hover .vn-face, .vn-piece:hover::before{ transform:translate3d(0, -4px, 0); }
  .vn-piece:hover::before{ opacity:1; }
}
.vn-piece.is-lifted .vn-face, .vn-piece.is-lifted::before{ visibility:hidden; }

/* Instruments' tag, struck into bronze */
.vn-tag{
  --e:.06em;
  position:absolute; left:50%; top:47%; z-index:1;
  box-sizing:border-box; width:66%; aspect-ratio:1.9 / 1;
  transform:translate(-50%, -50%);
  display:flex; align-items:center; gap:.86em;
  padding:0 1.1em 0 1.4em;
  border-radius:2.33em;
  font-family:var(--mono); font-weight:500; font-size:4.6cqw; line-height:1.12;
  letter-spacing:.04em; text-transform:uppercase; white-space:nowrap;
  color:#E8DFD0;
  background:
    linear-gradient(165deg, #3a3028 0%, #1c1814 100%);
  box-shadow:
    inset 0 0 0 1px rgba(255,236,210,.2),
    inset calc(var(--sx) * var(--e) * 1.3) calc(var(--sy) * var(--e) * 1.3) 0 rgba(0,0,0,.55),
    inset calc(var(--sx) * var(--e) * 3) calc(var(--sy) * var(--e) * 3) calc(var(--e) * 2.6) rgba(0,0,0,.28),
    inset calc(var(--sx) * var(--e) * -1.5) calc(var(--sy) * var(--e) * -1.5) 0 rgba(255,236,210,.28),
    0 18px 28px -20px rgba(0,0,0,.7);
}
.vn-tag-t{ display:flex; flex-direction:column; min-width:0; }
.vn-tag-l, .vn-tag-n{
  display:block;
  text-shadow:
    calc(var(--sx) * var(--e) * -1) calc(var(--sy) * var(--e) * -1) 0 rgba(255,236,210,.28),
    calc(var(--sx) * var(--e) * 1.2) calc(var(--sy) * var(--e) * 1.2) calc(var(--e) * .3) rgba(0,0,0,.85);
}
.vn-tag-n{ margin-top:.28em; color:rgba(232,223,208,.7); }
.vn-tag-dot{
  flex:none; display:block; width:.66em; height:.66em; border-radius:50%;
  background:#070605;
  box-shadow:
    inset 0 0 0 1px rgba(0,0,0,.55),
    calc(var(--sx) * var(--e) * -1) calc(var(--sy) * var(--e) * -1) 0 rgba(255,236,210,.2),
    calc(var(--sx) * var(--e) * 1.2) calc(var(--sy) * var(--e) * 1.2) calc(var(--e) * .3) rgba(0,0,0,.7);
}

.vn-cap{ display:block; padding:22px 1px 0; }
.vn-cap-top{ display:flex; align-items:baseline; justify-content:space-between; gap:18px; min-width:0; }
.vn-cap-name{
  position:relative; display:block; min-width:0; flex:1 1 auto;
  font-weight:400; font-size:clamp(22px, 1.8vw, 28px); line-height:1.08; letter-spacing:-.01em;
}
.vn-cap-name::after{
  content:""; position:absolute; left:0; right:0; bottom:-5px; height:1px; background:currentColor;
  transform:scaleX(0); transform-origin:0 50%; transition:transform .8s var(--ease);
}
@media (hover:hover){ .vn-piece:hover .vn-cap-name::after{ transform:scaleX(1); } }
.vn-piece:focus-visible .vn-cap-name::after{ transform:scaleX(1); }
.vn-cap-no{ flex:none; white-space:nowrap; font-size:9.5px; letter-spacing:.2em; color:rgba(232,223,208,.4); }
.vn-cap-use{
  display:block; margin:10px 0 0; max-width:34ch;
  font-size:14px; line-height:1.55; color:rgba(232,223,208,.55);
}

.vn-empty{ max-width:28em; color:rgba(232,223,208,.48); }

/* Ledger's held overlay + Instruments' sheet page, after hours */
html.is-overlaid body[data-page="vault"]{ overflow:hidden; }
.vn-view{
  position:fixed; inset:0; z-index:70; color:var(--v-ink);
}
.vn-view[hidden]{ display:none; }
.vn-view-ground{
  position:absolute; inset:0;
  background-color:#070605;
  background-image:
    var(--fibre),
    radial-gradient(ellipse 72vmax 58vmax at 28% 20%, rgba(255,214,160,.1), rgba(255,214,160,0) 72%);
  background-size:200px 200px, auto;
  opacity:0; transition:opacity .62s var(--ease);
}
.vn-view.is-open .vn-view-ground{ opacity:1; }
.vn-view-grid{
  position:relative; box-sizing:border-box;
  display:grid; grid-template-columns:minmax(0, 1.1fr) minmax(280px, .9fr);
  align-items:center; gap:clamp(28px, 5vw, 96px);
  max-width:1440px; min-height:100vh; min-height:100svh; margin:0 auto;
  padding:calc(var(--nav-h) + 16px) var(--margin, var(--gutter)) 48px;
  overflow-x:hidden; overflow-y:auto; overscroll-behavior:contain;
}
.vn-view-plate{ min-width:0; }
.vn-view-plate .vn-face{
  width:min(100%, calc((100svh - var(--nav-h) - 80px) * .8));
  margin:0 auto;
  box-shadow:inset 0 0 0 1px rgba(255,236,210,.1), 0 56px 96px -64px rgba(0,0,0,.8);
}
.vn-view-facts{ position:relative; max-width:31rem; padding-top:72px; min-width:0; }
.vn-view-bar{
  position:absolute; left:0; right:0; top:0;
  display:flex; align-items:baseline; gap:22px; margin:0;
  font-family:var(--mono); font-size:9.5px; letter-spacing:.24em; text-transform:uppercase;
  color:rgba(232,223,208,.42);
}
.vn-view-count{ margin:0 auto 0 0; font-variant-numeric:tabular-nums; }
.vn-q{
  position:relative; margin:0; padding:6px 0; border:0; background:none;
  color:rgba(232,223,208,.55); font:inherit; letter-spacing:inherit; text-transform:inherit;
  cursor:pointer; -webkit-tap-highlight-color:transparent;
  transition:color .4s var(--ease);
}
.vn-q::after{
  content:""; position:absolute; left:0; right:0; bottom:2px; height:1px; background:currentColor;
  transform:scaleX(0); transform-origin:0 50%; transition:transform .55s var(--ease);
}
.vn-q:hover, .vn-q:focus-visible{ color:var(--v-ink); outline:none; }
.vn-q:hover::after, .vn-q:focus-visible::after{ transform:scaleX(1); }
.vn-q[hidden]{ display:none; }
.vn-view-meta{
  margin:0 0 18px; font-family:var(--mono); font-size:9.5px;
  letter-spacing:.24em; text-transform:uppercase; color:rgba(232,223,208,.42);
}
.vn-view-name{
  position:relative; margin:0;
  font-weight:400; font-size:clamp(36px, 4.4vw, 64px); line-height:.92; letter-spacing:-.03em;
}
.vn-view-use{
  margin:22px 0 0; max-width:34ch;
  font-size:clamp(16px, 1.15vw, 18px); line-height:1.62; color:rgba(232,223,208,.62);
}
.vn-view-use[hidden]{ display:none; }
.vn-spec{ margin:clamp(28px, 4.6vh, 42px) 0 0; }
.vn-spec-row{
  position:relative;
  display:grid; grid-template-columns:minmax(6.5em, 8.5em) minmax(0, 1fr); gap:18px; align-items:baseline;
  padding:15px 0 14px;
}
.vn-spec-row::before, .vn-spec-row:last-child::after{
  content:""; position:absolute; left:0; right:0; height:1px; background:rgba(255,236,210,.1);
  transform:scaleX(0); transform-origin:0 50%;
  transition:transform 1.1s var(--ease) calc(.38s + var(--r, 0) * 70ms);
}
.vn-spec-row::before{ top:0; }
.vn-spec-row:last-child::after{ bottom:0; transition-delay:calc(.45s + var(--r, 0) * 70ms); }
.vn-view.is-open .vn-spec-row::before,
.vn-view.is-open .vn-spec-row:last-child::after{ transform:none; }
.vn-spec-row > *{ opacity:0; transition:opacity .8s var(--ease) calc(.52s + var(--r, 0) * 70ms); }
.vn-view.is-open .vn-spec-row > *{ opacity:1; }
.vn-spec-k{
  font-size:9.5px; line-height:1.6; letter-spacing:.24em; text-transform:uppercase;
  color:rgba(232,223,208,.38);
}
.vn-spec-v{ font-family:var(--serif); font-size:15px; line-height:1.5; color:rgba(232,223,208,.78); }
.vn-story{ margin:clamp(22px, 3vh, 36px) 0 0; }
.vn-story-p{
  margin:0 0 1em; max-width:34ch;
  font-size:15px; line-height:1.55; color:rgba(232,223,208,.7);
}
@media (max-width:820px){
  .vn-view-grid{ grid-template-columns:1fr; padding-top:calc(var(--nav-h) + 48px); }
  .vn-view-facts{ padding-top:28px; }
}

@media (prefers-reduced-motion:reduce){
  .vn-piece, .vn-piece::before, .vn-wd, .vn-ch, .vn-mast-row, .vn-face, .vn-spec-row, .vn-spec-row > *{ transition-duration:.01s !important; }
  .vn-lamp{ display:none; }
  .vn-ch{ transform:none; }
}

.vd-hud{ opacity:0 !important; visibility:hidden !important; pointer-events:none !important; }

/* ---------- night salon: Ledger's first counter, Instruments' sheets, after hours ---------- */
.vn{
  position:relative; isolation:isolate;
  min-height:100vh; min-height:100svh;
  margin:0; padding:clamp(48px, 8vh, 88px) 0 clamp(120px, 18vh, 200px);
  background:#070605; color:var(--v-ink);
  border-top:1px solid rgba(255,236,210,.06);
}
.vn-lamp{
  position:fixed; left:0; top:0; z-index:0; pointer-events:none;
  width:140vmax; height:110vmax; margin:-55vmax 0 0 -70vmax;
  background:radial-gradient(closest-side, rgba(255,214,160,.14) 0%, rgba(180,110,50,.06) 38%, rgba(255,214,160,0) 72%);
  transform:translate3d(30vw, 18vh, 0);
  will-change:transform;
}
.vn-grain{
  position:absolute; inset:0; z-index:0; pointer-events:none;
  background-image:var(--fibre); background-size:200px 200px; opacity:.28;
}
.vn-wrap{ position:relative; z-index:1; max-width:1240px; margin:0 auto; padding:0 var(--margin, var(--gutter)); }

.vn-mast{ margin:0 0 clamp(48px, 8vh, 96px); }
.vn-title{
  margin:0; font-weight:400; font-size:clamp(56px, 11vw, 120px); line-height:.9; letter-spacing:-.03em;
}
.vn-wd{ display:inline-block; opacity:0; transform:translate3d(0, .18em, 0);
  transition:opacity 1s var(--ease) calc(var(--i, 0) * 90ms + 80ms), transform 1.1s var(--ease) calc(var(--i, 0) * 90ms + 80ms); }
.vn.is-live .vn-wd{ opacity:1; transform:none; }
.vn-mast-row{
  display:flex; justify-content:space-between; align-items:baseline; gap:24px;
  margin-top:16px;
  opacity:0; transition:opacity 1s var(--ease) .35s;
}
.vn.is-live .vn-mast-row{ opacity:1; }
.vn-k{ margin:0; font-size:9.5px; letter-spacing:.26em; text-transform:uppercase; color:rgba(232,223,208,.38); }
.vn-n{ color:var(--v-ink); font-variant-numeric:tabular-nums; }

.vn-grid{
  list-style:none; margin:0; padding:0;
  display:grid; grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:clamp(52px, 8.5vh, 104px) clamp(20px, 2.6vw, 44px);
}
@media (max-width:1023px){ .vn-grid{ grid-template-columns:repeat(2, minmax(0, 1fr)); } }
@media (max-width:519px){ .vn-grid{ grid-template-columns:minmax(0, 1fr); gap:60px; } }
.vn-cell{ margin:0; padding:0; min-width:0; }

.vn-piece{
  position:relative; isolation:isolate;
  display:block; width:100%; margin:0; padding:0; border:0; background:none;
  color:inherit; font:inherit; text-align:left; cursor:pointer;
  -webkit-appearance:none; appearance:none; -webkit-tap-highlight-color:transparent;
  opacity:0; transform:translate3d(0, 22px, 0);
  transition:
    opacity 1s var(--ease) calc(var(--i, 0) * 80ms + 200ms),
    transform 1.2s var(--ease) calc(var(--i, 0) * 80ms + 200ms);
}
.vn.is-live .vn-piece{ opacity:1; transform:none; }
.vn-piece:focus{ outline:none; }
.vn-piece:focus-visible .vn-face{ outline:1px solid rgba(232,223,208,.4); outline-offset:7px; }

.vn-face{
  --sx:.70; --sy:.58; --e:.06em;
  position:relative; display:block; overflow:hidden;
  width:100%; aspect-ratio:4 / 5;
  background:
    radial-gradient(ellipse 70% 50% at calc(50% + var(--sx) * 12%) calc(36% + var(--sy) * 10%), rgba(255,236,210,.08), transparent 62%),
    linear-gradient(165deg, #2a221c 0%, #12100d 100%);
  box-shadow:
    inset 0 0 0 1px rgba(255,236,210,.08),
    inset calc(var(--sx) * var(--e) * 1.3) calc(var(--sy) * var(--e) * 1.3) 0 rgba(0,0,0,.35),
    inset calc(var(--sx) * var(--e) * -1.4) calc(var(--sy) * var(--e) * -1.4) 0 rgba(255,236,210,.12);
  transition:transform .9s var(--ease);
}
.vn-piece::before{
  content:""; position:absolute; left:0; top:0; z-index:-1; width:100%; aspect-ratio:4 / 5;
  box-shadow:0 40px 64px -40px rgba(0,0,0,.7);
  opacity:0; pointer-events:none;
  transition:opacity .9s var(--ease), transform .9s var(--ease);
}
@media (hover:hover){
  .vn-piece:hover .vn-face, .vn-piece:hover::before{ transform:translate3d(0, -4px, 0); }
  .vn-piece:hover::before{ opacity:1; }
}
.vn-piece.is-lifted .vn-face, .vn-piece.is-lifted::before{ visibility:hidden; }

.vn-cap{ display:block; margin-top:14px; }
.vn-cap-top{ display:flex; justify-content:space-between; align-items:baseline; gap:12px; }
.vn-cap-name{ font-size:clamp(18px, 2.2vw, 24px); font-weight:400; }
.vn-cap-no{ font-size:var(--fs-mono-s); letter-spacing:var(--tr-mono); color:rgba(232,223,208,.4); }

.vn-empty{ max-width:28em; color:rgba(232,223,208,.48); }

.vn-view{
  position:fixed; inset:0; z-index:20;
  display:flex; align-items:center; justify-content:center;
  padding:calc(var(--nav-h) + 24px) var(--gutter) 48px;
  background:rgba(7,6,5,.72);
}
.vn-view[hidden]{ display:none; }
.vn-view-in{ width:min(420px, 86vw); text-align:center; }
.vn-view-face{
  width:100%; aspect-ratio:4 / 5; margin:0 auto;
  background:
    radial-gradient(ellipse 60% 48% at 42% 32%, rgba(255,236,210,.1), transparent 64%),
    linear-gradient(165deg, #2a221c 0%, #0e0c0a 100%);
  box-shadow:inset 0 0 0 1px rgba(255,236,210,.1), 0 40px 80px -36px rgba(0,0,0,.8);
}
.vn-view-no{ margin:22px 0 0; letter-spacing:.22em; color:rgba(232,223,208,.5); }
.vn-view-line{ margin:8px 0 0; font-family:var(--display); font-style:italic; color:var(--v-ink); }
.vn-back{
  margin:28px 0 0; padding:6px 0 5px; border:0; border-bottom:1px solid rgba(232,223,208,.28);
  background:none; color:rgba(232,223,208,.55); cursor:pointer; letter-spacing:var(--tr-mono);
}
.vn-back:hover, .vn-back:focus-visible{ color:var(--v-ink); border-bottom-color:rgba(232,223,208,.7); outline:none; }

@media (prefers-reduced-motion:reduce){
  .vn-piece, .vn-piece::before, .vn-wd, .vn-mast-row, .vn-face{ transition-duration:.01s !important; }
  .vn-lamp{ display:none; }
}

.vd-hud{
  background:linear-gradient(180deg, transparent 58%, rgba(7,6,5,.45) 80%, rgba(7,6,5,.88) 100%);
}

@media (max-width:759px){
  .vd-seal{ width:min(96px, 28vw); margin:calc(min(96px, 28vw) / -2) 0 0 calc(min(96px, 28vw) / -2); }
  .vd-slip-no{ font-size:clamp(26px, 8vw, 36px); }
  .vd-hud{ background:linear-gradient(180deg, transparent 40%, rgba(7,6,5,.7) 72%, #070605 100%); }
}

@media (prefers-reduced-motion:reduce){
  .vd-seal, .vd-floor, .vd-slip{ transition-duration:.01s !important; }
}