/* ============================================================================
   PAGE FAMILY: artist immersive suite (C6) - STRUCTURE tier - from the global
   files, original order. Pages: artist_atlas / artist_chronicle / artist_genome
   / artist_mood_room / artist_spectral_index / artist_timeline (artist_3D_museum
   is self-contained). 215 page-exclusive classes (atlas-*, chr-*, gn-*, moom-*,
   spectral-*, tl-* + their scoped inner tokens). Migrated 2026-07-06.
   PHASE-A FIDELITY: verbatim relocation.
   ========================================================================= */

.atlas-page {
  --ink:#1C1A17; --ink-2:#3D3830; --ink-3:#7A7266;
  --sand:#F5F1E8; --sand-2:#EDE7D9; --sand-3:#DDD5C0;
  --gold:#8B6914; --gold-lt:#C49A2A; --gold-br:#E0BD52;
  --ivory:#FDFAF4;
  --night:#0E0F14; --night-2:#15171F; --night-3:#1D202B;
  --rule:rgba(28,26,23,.12); --rule-strong:rgba(28,26,23,.28);
  --serif:"Cormorant Garamond",Georgia,serif;
  --sans:"DM Sans",-apple-system,BlinkMacSystemFont,sans-serif;
}

.atlas-page .artist-hero {
  background:var(--sand);
  border-bottom:1px solid var(--rule);
}

.atlas-page .artist-hero .hero-inner {
  max-width:1320px;
  margin:0 auto;
  padding:clamp(44px,5vw,72px) clamp(20px,4vw,56px);
  display:grid;
  grid-template-columns:340px 1fr;
  gap:clamp(32px,5vw,72px);
  align-items:center;
}

.atlas-page .portrait-frame {
  position:relative;
  padding:14px;
  background:linear-gradient(135deg,#c8ad7a,#8B6914 20%,#f0d87a 38%,#8B6914 56%,#c8ad7a 74%,#8B6914 92%);
  box-shadow:0 18px 50px rgba(28,26,23,.28);
}

.atlas-page .portrait-frame img {
  width:100%;
  aspect-ratio:4/5;
  object-fit:cover;
  filter:sepia(.12) contrast(1.03);
  display:block;
}

.atlas-page .portrait-cap {
  margin-top:14px;
  text-align:center;
  font-size:10px;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--ink-3);
}

.atlas-page .artist-kicker {
  display:flex;
  align-items:center;
  gap:12px;
  margin-bottom:18px;
}

.atlas-page .artist-kicker::before {
  content:'';
  width:30px;
  height:1px;
  background:var(--gold);
}

.atlas-page .artist-kicker span {
  font-size:9.5px;
  letter-spacing:.22em;
  text-transform:uppercase;
  color:var(--gold);
  font-weight:500;
}

.atlas-page .artist-name {
  font-family:var(--serif);
  font-size:clamp(40px,6vw,82px);
  font-weight:300;
  line-height:.98;
  letter-spacing:-.01em;
  margin-bottom:14px;
}

.atlas-page .artist-name em { font-style:italic; color:var(--gold); }

.atlas-page .artist-meta {
  display:flex;
  flex-wrap:wrap;
  gap:10px 22px;
  margin-bottom:26px;
  font-size:12px;
  letter-spacing:.06em;
  color:var(--ink-3);
}

.atlas-page .artist-meta b { color:var(--ink-2); font-weight:500; }

.atlas-page .artist-bio { max-width:560px; }

.atlas-page .artist-bio p {
  font-size:15.5px;
  line-height:1.75;
  color:var(--ink-2);
  margin-bottom:14px;
}

.atlas-page .artist-stats {
  display:flex;
  gap:34px;
  margin-top:30px;
  border-top:1px solid var(--rule);
  padding-top:24px;
}

.atlas-page .stat-v {
  font-family:var(--serif);
  font-size:30px;
  font-weight:300;
  line-height:1;
}

.atlas-page .stat-l {
  font-size:10px;
  letter-spacing:.13em;
  text-transform:uppercase;
  color:var(--ink-3);
  margin-top:5px;
}

@media(max-width:760px) {
  .atlas-page .artist-hero .hero-inner { grid-template-columns:1fr; }

  .atlas-page .portrait-frame { max-width:300px; margin:0 auto; }

}
.atlas-page .atlas-section {
  background:var(--night);
  color:var(--ivory);
  position:relative;
  overflow:hidden;
  padding:clamp(50px,7vw,90px) 0 clamp(40px,5vw,70px);
}

.atlas-page .atlas-section::before {
  content:'';
  position:absolute;
  inset:0;
  background:
    radial-gradient(ellipse 60% 50% at 50% 42%,rgba(196,154,42,.07),transparent 65%),
    radial-gradient(circle at 50% 50%,transparent 60%,rgba(0,0,0,.5) 100%);
  pointer-events:none;
}

.atlas-page .atlas-head {
  text-align:center;
  max-width:760px;
  margin:0 auto clamp(20px,3vw,34px);
  position:relative;
  z-index:2;
  padding:0 clamp(16px,3vw,40px);
}

.atlas-page .atlas-kicker {
  font-size:9.5px;
  letter-spacing:.26em;
  text-transform:uppercase;
  color:var(--gold-lt);
  margin-bottom:14px;
}

.atlas-page .atlas-title {
  font-family:var(--serif);
  font-size:clamp(30px,4.6vw,58px);
  font-weight:300;
  line-height:1.05;
  margin-bottom:16px;
}

.atlas-page .atlas-title em { font-style:italic; color:var(--gold-lt); }

.atlas-page .atlas-sub {
  font-size:14.5px;
  line-height:1.7;
  color:rgba(253,250,244,.55);
  max-width:600px;
  margin:0 auto;
}

.atlas-page .atlas-stage {
  position:relative;
  z-index:2;
  display:grid;
  grid-template-columns:1fr 250px;
  gap:clamp(20px,3vw,40px);
  align-items:center;
  max-width:1180px;
  margin:0 auto;
  padding:0 clamp(16px,3vw,40px);
}

.atlas-page .atlas-canvas-wrap { position:relative; }

.atlas-page .atlas-svg { width:100%; height:auto; overflow:visible; display:block; }

.atlas-page .atlas-replay {
  position:absolute;
  top:6px; right:6px;
  display:inline-flex;
  align-items:center;
  gap:7px;
  background:rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.15);
  color:rgba(253,250,244,.7);
  font-size:9.5px;
  letter-spacing:.13em;
  text-transform:uppercase;
  padding:8px 13px;
  cursor:pointer;
  transition:.25s;
  z-index:5;
}

.atlas-page .atlas-replay:hover { border-color:var(--gold-lt); color:var(--ivory); }

.atlas-page .atlas-replay svg { width:12px; height:12px; }

.atlas-page .ring-circle { fill:none; stroke:rgba(196,154,42,.16); stroke-width:1; }

.atlas-page .ring-circle.major { stroke:rgba(196,154,42,.26); stroke-dasharray:2 5; }

.atlas-page .ring-label { fill:rgba(253,250,244,.4); font-family:var(--sans); font-size:9px; letter-spacing:.16em; text-transform:uppercase; }

.atlas-page .ring-label-sub { fill:rgba(196,154,42,.55); font-family:var(--sans); font-size:8px; letter-spacing:.1em; }

.atlas-page .spoke { stroke:rgba(196,154,42,.3); stroke-width:1; }

.atlas-page .spoke-label { font-family:var(--serif); font-style:italic; font-size:17px; fill:var(--gold-lt); }

.atlas-page .spoke-count { font-family:var(--sans); font-size:8.5px; letter-spacing:.16em; text-transform:uppercase; fill:rgba(253,250,244,.4); }

.atlas-page .spoke-grp { cursor:pointer; }

.atlas-page .spoke-grp:hover .spoke-label { fill:var(--gold-br); }

.atlas-page .spoke-grp:hover .spoke { stroke:rgba(196,154,42,.6); }

.atlas-page .ctx-line { fill:none; stroke-width:1; opacity:.5; stroke-linecap:round; transition:opacity .4s,stroke-width .3s; }

.atlas-page .ctx-line.hot { opacity:1; stroke-width:2; filter:drop-shadow(0 0 5px currentColor); }

.atlas-page .ctx-line.fade { opacity:.06; }

.atlas-page .node-img { transition:opacity .3s; }

.atlas-page .node-halo { fill:none; stroke:var(--gold-lt); stroke-width:0; opacity:0; transition:opacity .3s,stroke-width .3s; }

.atlas-page .node-ring { fill:none; stroke:rgba(232,210,140,.65); stroke-width:1.4; transition:stroke .3s,stroke-width .3s; }

.atlas-page .atlas-node { cursor:pointer; }

.atlas-page .atlas-node:hover .node-ring,.atlas-page .atlas-node.hot .node-ring { stroke:var(--gold-br); stroke-width:2.4; }

.atlas-page .atlas-node:hover .node-halo,.atlas-page .atlas-node.hot .node-halo { opacity:.9; stroke-width:6; }

.atlas-page .atlas-node.big .node-ring { stroke-width:1.8; }

.atlas-page .node-tip { opacity:0; pointer-events:none; transition:opacity .2s; }

.atlas-page .atlas-node:hover .node-tip { opacity:1; }

.atlas-page .node-tip rect { fill:rgba(10,10,12,.92); stroke:rgba(196,154,42,.4); stroke-width:1; }

.atlas-page .node-tip .tt { fill:var(--ivory); font-family:var(--serif); font-size:13px; }

.atlas-page .node-tip .td { fill:var(--gold-lt); font-family:var(--sans); font-size:9px; letter-spacing:.1em; }

.atlas-page .atlas-node.dim { opacity:.14; }

.atlas-page .spoke-grp.dim { opacity:.16; }

.atlas-page .atlas-node { transition:opacity .5s; }

.atlas-page .center-ring { fill:none; stroke:var(--gold-lt); }

.atlas-page .center-name { font-family:var(--serif); font-style:italic; font-size:15px; fill:var(--ivory); text-anchor:middle; }

.atlas-page .center-sub { font-family:var(--sans); font-size:8px; letter-spacing:.2em; text-transform:uppercase; fill:var(--gold-lt); text-anchor:middle; }

.atlas-page .center-grp { cursor:pointer; }

.atlas-page .star { fill:#fff; }

.atlas-page .atlas-svg .ring-circle { stroke-dashoffset:var(--len,0); transition:stroke-dashoffset 1.1s ease; }

.atlas-page .atlas-svg .spoke { stroke-dasharray:var(--len); stroke-dashoffset:var(--len); transition:stroke-dashoffset .9s ease; }

.atlas-page .atlas-svg .ctx-line { stroke-dasharray:var(--len); stroke-dashoffset:var(--len); transition:stroke-dashoffset 1s ease,opacity .4s,stroke-width .3s; }

.atlas-page .atlas-node { opacity:0; transform:scale(.2); transform-box:view-box; transition:opacity .5s ease,transform .55s cubic-bezier(.34,1.6,.6,1); }

.atlas-page .spoke-label-grp { opacity:0; transition:opacity .6s ease; }

.atlas-page .atlas-svg.play .ring-circle { stroke-dashoffset:0; }

.atlas-page .atlas-svg.play .spoke { stroke-dashoffset:0; }

.atlas-page .atlas-svg.play .ctx-line { stroke-dashoffset:0; }

.atlas-page .atlas-svg.play .atlas-node { opacity:1; transform:scale(1); }

.atlas-page .atlas-svg.play .spoke-label-grp { opacity:1; }

.atlas-page .atlas-node.dim { opacity:.14; }

.atlas-page .atlas-rail { display:flex; flex-direction:column; gap:22px; }

.atlas-page .rail-block-title {
  font-size:9px; letter-spacing:.2em; text-transform:uppercase;
  color:rgba(253,250,244,.4); margin-bottom:12px;
  display:flex; align-items:center; gap:8px;
}

.atlas-page .rail-block-title::after { content:''; flex:1; height:1px; background:rgba(255,255,255,.1); }

.atlas-page .topic-chips,.atlas-page .ctx-chips { display:flex; flex-direction:column; gap:6px; }

.atlas-page .chip {
  display:flex; align-items:center; gap:10px; width:100%;
  text-align:left; background:rgba(255,255,255,.03);
  border:1px solid rgba(255,255,255,.09);
  color:rgba(253,250,244,.78);
  font-size:12px; padding:9px 12px; cursor:pointer; transition:.22s; letter-spacing:.02em;
}

.atlas-page .chip:hover { border-color:rgba(196,154,42,.5); background:rgba(196,154,42,.08); color:var(--ivory); }

.atlas-page .chip.active { border-color:var(--gold-lt); background:rgba(196,154,42,.16); color:var(--ivory); }

.atlas-page .chip-dot { width:9px; height:9px; border-radius:50%; flex-shrink:0; }

.atlas-page .chip-sq { width:14px; height:3px; border-radius:2px; flex-shrink:0; }

.atlas-page .chip-n { margin-left:auto; font-size:9px; letter-spacing:.1em; color:rgba(253,250,244,.4); }

.atlas-page .chip.active .chip-n { color:var(--gold-lt); }

.atlas-page .rail-reset {
  margin-top:2px; display:inline-flex; align-items:center; justify-content:center; gap:8px;
  background:transparent; border:1px solid rgba(255,255,255,.18);
  color:rgba(253,250,244,.6); font-size:10px; letter-spacing:.14em; text-transform:uppercase;
  padding:10px; cursor:pointer; transition:.25s; width:100%;
}

.atlas-page .rail-reset:hover { background:rgba(255,255,255,.06); color:var(--ivory); }

@media(max-width:920px) {
  .atlas-page .atlas-stage { grid-template-columns:1fr; }

  .atlas-page .atlas-rail { flex-direction:row; flex-wrap:wrap; gap:24px; }

  .atlas-page .atlas-rail > div { flex:1; min-width:220px; }

}
.atlas-page .atlas-guide {
  position:relative; z-index:2;
  max-width:900px; margin:clamp(30px,4vw,50px) auto 0;
  display:grid; grid-template-columns:repeat(3,1fr);
  gap:24px; padding:0 clamp(16px,3vw,40px);
}

.atlas-page .guide-item { border-top:1px solid rgba(196,154,42,.3); padding-top:16px; }

.atlas-page .guide-item h4 { font-family:var(--serif); font-size:17px; font-weight:400; color:var(--gold-lt); margin-bottom:7px; }

.atlas-page .guide-item p { font-size:12.5px; line-height:1.6; color:rgba(253,250,244,.55); }

@media(max-width:760px) {
  .atlas-page .atlas-guide { grid-template-columns:1fr; gap:20px; }

}
.chr-page {
  --ink:   #1C1A17;
  --ink-2: #3D3830;
  --ink-3: #7A7266;
  --sand:  #F5F1E8;
  --sand-2:#EDE7D9;
  --sand-3:#DDD5C0;
  --gold:  #8B6914;
  --gold-lt:#C49A2A;
  --gold-br:#E0BD52;
  --ivory: #FDFAF4;
  --night: #0E0F14;
  --night-2:#15171F;
  --night-3:#1D202B;
  --rule:  rgba(28,26,23,.12);
  --serif: "Cormorant Garamond",Georgia,serif;
  --sans:  "DM Sans",-apple-system,BlinkMacSystemFont,sans-serif;
  /* Chapter band fills / labels — read by lifeline JS (getComputedStyle) */
  --chr-ch-fill-0: #F4EFE2;
  --chr-ch-fill-1: #EBE3CE;
  --chr-ch-fill-2: #E2D9BC;
  --chr-ch-fill-3: #D9CFAA;
  --chr-ch-fill-4: #D1C69A;
  --chr-ch-label-0: #6B5010;
  --chr-ch-label-1: #5E4510;
  --chr-ch-label-2: #534010;
  --chr-ch-label-3: #483A0E;
  --chr-ch-label-4: #3E320C;
  font-family: var(--sans);
}

.chr-page .artist-hero {
  background: var(--sand);
  border-bottom: 1px solid var(--rule);
}

.chr-page .artist-hero .hero-inner {
  max-width: 1320px;
  margin: 0 auto;
  padding: clamp(44px,5vw,72px) clamp(20px,4vw,56px);
  display: grid;
  grid-template-columns: 320px 1fr;
  gap: clamp(32px,5vw,72px);
  align-items: center;
}

.chr-page .portrait-frame {
  position: relative;
  padding: 14px;
  background: linear-gradient(135deg,#c8ad7a,#8B6914 20%,#f0d87a 38%,#8B6914 56%,#c8ad7a 74%,#8B6914 92%);
  box-shadow: 0 18px 50px rgba(28,26,23,.28);
}

.chr-page .portrait-frame img {
  width: 100%;
  aspect-ratio: 4/5;
  object-fit: cover;
  filter: sepia(.10) contrast(1.03);
  display: block;
}

.chr-page .portrait-cap {
  margin-top: 14px;
  text-align: center;
  font-size: 10px;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--ink-3);
}

.chr-page .artist-kicker {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 18px;
}

.chr-page .artist-kicker::before {
  content: '';
  width: 30px;
  height: 1px;
  background: var(--gold);
  flex-shrink: 0;
}

.chr-page .artist-kicker span {
  font-size: 9.5px;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: var(--gold);
  font-weight: 500;
}

.chr-page .artist-name {
  font-family: var(--serif);
  font-size: clamp(36px,5.5vw,72px);
  font-weight: 300;
  line-height: .98;
  letter-spacing: -.01em;
  margin-bottom: 14px;
  color: var(--ink);
}

.chr-page .artist-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 22px;
  margin-bottom: 26px;
  font-size: 12px;
  letter-spacing: .06em;
  color: var(--ink-3);
}

.chr-page .artist-meta b { color: var(--ink-2); font-weight: 500; }

.chr-page .artist-bio { max-width: 560px; }

.chr-page .artist-bio p {
  font-size: 15px;
  line-height: 1.75;
  color: var(--ink-2);
  margin-bottom: 14px;
}

.chr-page .artist-stats {
  display: flex;
  gap: 34px;
  margin-top: 30px;
  border-top: 1px solid var(--rule);
  padding-top: 24px;
}

.chr-page .stat-v {
  font-family: var(--serif);
  font-size: 30px;
  font-weight: 300;
  line-height: 1;
  color: var(--ink);
}

.chr-page .stat-l {
  font-size: 10px;
  letter-spacing: .13em;
  text-transform: uppercase;
  color: var(--ink-3);
  margin-top: 5px;
}

.chr-page .chronicle-section {
  background: var(--night);
  color: var(--ivory);
  position: relative;
  overflow: hidden;
  padding: clamp(50px,7vw,90px) 0 0;
}

.chr-page .chronicle-section::before {
  content: '';
  position: absolute;
  inset: 0;
  background:
    radial-gradient(ellipse 70% 40% at 30% 20%, rgba(196,154,42,.06), transparent 65%),
    radial-gradient(circle at 80% 80%, transparent 60%, rgba(0,0,0,.4) 100%);
  pointer-events: none;
}

.chr-page .chr-head {
  text-align: center;
  max-width: 720px;
  margin: 0 auto clamp(28px,4vw,48px);
  position: relative;
  z-index: 2;
  padding: 0 clamp(16px,3vw,40px);
}

.chr-page .chr-kicker {
  font-size: 9.5px;
  letter-spacing: .26em;
  text-transform: uppercase;
  color: var(--gold-lt);
  margin-bottom: 14px;
}

.chr-page .chr-title {
  font-family: var(--serif);
  font-size: clamp(30px,4.6vw,56px);
  font-weight: 300;
  line-height: 1.05;
  margin-bottom: 16px;
  color: var(--ivory);
}

.chr-page .chr-title em { font-style: italic; color: var(--gold-lt); }

.chr-page .chr-sub {
  font-size: 14.5px;
  line-height: 1.75;
  color: rgba(253,250,244,.5);
  max-width: 580px;
  margin: 0 auto;
}

.chr-page .scroll-hint {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  font-size: 11.5px;
  letter-spacing: .10em;
  color: rgba(253,250,244,.4);
  text-transform: uppercase;
  margin-bottom: 22px;
  position: relative;
  z-index: 2;
}

.chr-page .scroll-hint svg path {
  stroke: var(--gold-lt);
}

.chr-page .ribbon-scroll {
  position: relative;
  overflow-x: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
  cursor: grab;
  user-select: none;
  scrollbar-width: thin;
  scrollbar-color: var(--gold) #1D202B;
}

.chr-page .ribbon-scroll:active { cursor: grabbing; }

.chr-page .ribbon-scroll::-webkit-scrollbar { height: 6px; }

.chr-page .ribbon-scroll::-webkit-scrollbar-track { background: #1D202B; }

.chr-page .ribbon-scroll::-webkit-scrollbar-thumb {
  background: var(--gold);
  border-radius: 3px;
}

.chr-page #chr-ribbon {
  position: relative;
  /* width and height are set by JS */
}

.chr-page .chapter-band {
  position: absolute;
  top: 0;
  /* left, width, height set by JS */
}

.chr-page .chapter-band + .chapter-band {
  border-left: 1px solid rgba(139,105,20,.25);
}

.chr-page .ch-year-span {
  position: absolute;
  font-size: 12px;
  font-weight: 500;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: rgba(28,26,23,.78);
  opacity: 1;
  white-space: nowrap;
  /* top set by JS (just below movement band) */
  left: 16px;
}

.chr-page .ch-label {
  position: absolute;
  font-family: var(--serif);
  font-size: 13px;
  font-weight: 500;
  letter-spacing: .06em;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: calc(100% - 24px);
  color: var(--gold);
  /* top set by JS */
  left: 16px;
}

.chr-page .ch-context {
  position: absolute;
  font-size: 11.5px;
  line-height: 1.55;
  color: var(--ink-3);
  /* Narrow column (~¼ band width); JS sets max-width — clamp to 4 lines */
  max-width: min(25%, 160px);
  white-space: normal;
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 4;
  line-clamp: 4;
  word-break: break-word;
  opacity: .88;
  /* top set by JS */
  left: 16px;
}

.chr-page #chr-axis-line {
  position: absolute;
  height: 1px;
  background: var(--gold);
  z-index: 3;
  /* top, left, right set by JS */
}

.chr-page #chr-mov-band {
  position: absolute;
  z-index: 2;
  /* top, left, right, height set by JS */
  transition: clip-path .08s linear;
}

.chr-page .axis-tick {
  position: absolute;
  width: 1px;
  background: rgba(196,154,42,.45);
  z-index: 4;
  /* left, top, height set by JS */
}

.chr-page .tick-lbl {
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translateX(-50%);
  margin-top: 5px;
  font-size: 12px;
  font-weight: 500;
  letter-spacing: .08em;
  color: rgba(28,26,23,.78);
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
}

.chr-page .work-pin {
  position: absolute;
  display: flex;
  flex-direction: column;
  align-items: center;
  opacity: 0;
  transition: opacity .5s ease;
  z-index: 5;
  cursor: pointer;
}

.chr-page .work-pin.in {
  opacity: 1;
}

.chr-page .work-pin img,.chr-page .work-placeholder {
  display: block;
  object-fit: cover;
  flex-shrink: 0;
  border: 2px solid rgba(224,189,82,.55);
  border-radius: 3px;
  background: #14110b;
  box-shadow: none;
  transition: border-color .2s ease;
}

.chr-page .work-placeholder { background: rgba(255,255,255,.05); }

.chr-page .work-pin--big img,.chr-page .work-pin--big .work-placeholder {
  border-color: var(--gold-br);
  border-width: 3px;
  box-shadow: none;
}

.chr-page .work-pin:hover { z-index: 30; }

.chr-page .work-pin:hover img,.chr-page .work-pin:hover .work-placeholder {
  border-color: var(--gold-br);
  box-shadow: none;
}

.chr-page .work-connector {
  width: 1px;
  flex-shrink: 0;
  background: linear-gradient(to bottom, rgba(196,154,42,.6), rgba(196,154,42,.05));
}

.chr-page .work-dot {
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: var(--gold-lt);
  flex-shrink: 0;
  margin-top: -2px;
  box-shadow: 0 0 6px rgba(196,154,42,.7);
}

.chr-page .work-pin--big .work-dot {
  width: 8px;
  height: 8px;
  margin-top: -4px;
}

.chr-page .work-thumb-wrap {
  position: relative;
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.chr-page .work-tooltip {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  background: var(--night-2);
  border: 1px solid rgba(196,154,42,.3);
  border-radius: 6px;
  padding: 10px 14px;
  min-width: 148px;
  max-width: 220px;
  font-size: 12px;
  line-height: 1.5;
  pointer-events: none;
  opacity: 0;
  transition: opacity .18s;
  z-index: 20;
  white-space: normal;
  box-shadow: 0 8px 28px rgba(0,0,0,.5);
}

.chr-page .work-tooltip--below {
  top: calc(100% + 10px);
  bottom: auto;
}

.chr-page .work-tooltip:not(.work-tooltip--below) {
  bottom: calc(100% + 10px);
  top: auto;
}

.chr-page .work-tooltip strong {
  display: block;
  font-size: 12.5px;
  margin-bottom: 3px;
  color: var(--gold-br);
  line-height: 1.3;
}

.chr-page .work-tooltip .tip-year {
  display: block;
  font-size: 10.5px;
  color: rgba(253,250,244,.45);
  margin-bottom: 6px;
  letter-spacing: .06em;
}

.chr-page .tip-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  margin-top: 6px;
}

.chr-page .tip-tags span {
  font-size: 10px;
  background: rgba(255,255,255,.08);
  padding: 2px 8px;
  border-radius: 10px;
  color: rgba(253,250,244,.65);
}

.chr-page .work-pin:hover .work-tooltip { opacity: 1; }

.chr-page .chr-legend {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px 28px;
  padding: clamp(16px,2vw,28px) clamp(20px,4vw,56px);
  border-top: 1px solid rgba(255,255,255,.07);
  background: var(--night);
  font-size: 11px;
  color: rgba(253,250,244,.4);
  letter-spacing: .07em;
  position: relative;
  z-index: 2;
}

.chr-page .legend-item {
  display: flex;
  align-items: center;
  gap: 8px;
}

.chr-page .legend-dot {
  width: 10px;
  height: 10px;
  border-radius: 2px;
  flex-shrink: 0;
}

.chr-page .legend-line {
  width: 28px;
  height: 1px;
  background: var(--gold);
  flex-shrink: 0;
}

.chr-page .chr-empty {
  text-align: center;
  padding: clamp(60px,8vw,100px) 20px;
  color: rgba(253,250,244,.4);
  font-family: var(--serif);
  font-size: 20px;
  font-weight: 300;
}

.chr-page .chr-guide {
  display: grid;
  grid-template-columns: repeat(3,1fr);
  gap: 1px;
  background: rgba(255,255,255,.06);
  border-top: 1px solid rgba(255,255,255,.07);
  position: relative;
  z-index: 2;
}

.chr-page .guide-card {
  background: var(--night-2);
  padding: clamp(28px,3vw,44px) clamp(20px,3vw,40px);
}

.chr-page .guide-card h4 {
  font-family: var(--serif);
  font-size: 18px;
  font-weight: 400;
  color: var(--gold-lt);
  margin-bottom: 10px;
}

.chr-page .guide-card p {
  font-size: 13.5px;
  line-height: 1.7;
  color: rgba(253,250,244,.5);
}

@media(max-width:900px) {
  .chr-page .artist-hero .hero-inner { grid-template-columns: 1fr; }

  .chr-page .portrait-frame { max-width: 280px; margin: 0 auto; }

  .chr-page .chr-guide { grid-template-columns: 1fr; }

}
@media(max-width:560px) {
  .chr-page .artist-stats {
    flex-wrap: wrap;
    gap: 20px 28px;
  }

  .chr-page .artist-stats > div { flex: 0 0 calc(50% - 14px); }

}
.genome-wrap {
  --gn-ink:        #1C1A17;
  --gn-ink-2:      #3D3830;
  --gn-ink-3:      #7A7266;
  --gn-sand:       #F5F1E8;
  --gn-sand-2:     #EDE7D9;
  --gn-sand-3:     #DDD5C0;
  --gn-gold:       #8B6914;
  --gn-gold-lt:    #C49A2A;
  --gn-ivory:      #FDFAF4;
  --gn-rule:       rgba(28,26,23,.12);
  --gn-rule-str:   rgba(28,26,23,.28);
  --gn-serif:      "Cormorant Garamond","EB Garamond",Georgia,serif;
  --gn-sans:       "DM Sans",-apple-system,BlinkMacSystemFont,sans-serif;
  --gn-max:        1380px;
  --gn-gap:        clamp(16px,2.5vw,32px);
}

.genome-wrap {
  background: var(--gn-ivory);
  color: var(--gn-ink);
  font-family: var(--gn-sans);
  font-size: 15px;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}

.genome-wrap img { display: block; max-width: 100%; }

.genome-wrap a { color: inherit; text-decoration: none; }

.gn-breadcrumb {
  background: transparent;
  padding-bottom: clamp(20px,3vw,32px);
}

.gn-breadcrumb .breadcrumb-navigation-list {
  margin-top: 0;
}

.gn-shell { max-width: var(--gn-max); margin: 0 auto; padding: 0 clamp(20px,4vw,56px); }

.gn-serif { font-family: var(--gn-serif); }

.gn-scroll-bar {
  position: fixed; top: 0; left: 0; height: 2px; width: 0%;
  background: linear-gradient(90deg, var(--gn-gold) 0%, var(--gn-gold-lt) 100%);
  z-index: 999; transition: width .08s linear;
  box-shadow: 0 0 8px rgba(196,154,42,.5);
  pointer-events: none;
}

.gn-artist-head {
  background: var(--gn-sand);
  border-top: 1px solid var(--gn-rule);
  border-bottom: 1px solid var(--gn-rule);
  padding: clamp(40px,6vw,72px) 0 clamp(36px,5vw,56px);
}

.gn-head-inner {
  display: grid;
  grid-template-columns: 1.4fr 1fr;
  gap: clamp(32px,5vw,72px);
  align-items: center;
}

.gn-kicker { display: flex; align-items: center; gap: 12px; margin-bottom: 22px; }

.gn-kicker span { font-size: 9px; letter-spacing: 0.22em; text-transform: uppercase; color: var(--gn-gold); font-weight: 500; }

.gn-kicker::before { content: ''; width: 28px; height: 1px; background: var(--gn-gold); }

.gn-artist-name {
  font-family: var(--gn-serif);
  font-size: clamp(40px,6vw,84px);
  font-weight: 300; line-height: .98;
  letter-spacing: -0.015em; color: var(--gn-ink);
  margin-bottom: 18px;
}

.gn-artist-name em { font-style: italic; color: var(--gn-gold); }

.gn-artist-name a:hover em { color: var(--gn-ink-2); }

.gn-intro-title a { text-decoration: none; }

.gn-intro-title a:hover em { color: var(--gn-ivory); }

.gn-card-img a { display: block; height: 100%; }

.gn-card-color a:hover { text-decoration: underline; text-underline-offset: 3px; }

.gn-dates {
  font-size: 11px; letter-spacing: 0.2em; text-transform: uppercase;
  color: var(--gn-ink-3); margin-bottom: 24px;
}

.gn-bio { font-size: 15px; line-height: 1.75; color: var(--gn-ink-2); max-width: 540px; margin-bottom: 30px; }

.gn-stats { display: flex; gap: 40px; border-top: 1px solid var(--gn-rule); padding-top: 24px; }

.gn-stat-val { font-family: var(--gn-serif); font-size: 30px; font-weight: 300; color: var(--gn-ink); line-height: 1; margin-bottom: 4px; }

.gn-stat-lab { font-size: 10px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--gn-ink-3); }

.gn-portrait {
  position: relative;
  padding: clamp(8px,1.4vw,16px);
  background: linear-gradient(135deg,#c8ad7a 0%,#8B6914 18%,#f0d87a 36%,#8B6914 54%,#c8ad7a 72%,#8B6914 90%);
  box-shadow: 0 0 0 1px rgba(200,173,122,.35),0 16px 50px rgba(0,0,0,.25);
  transition: transform .6s cubic-bezier(.22,.61,.36,1),box-shadow .6s;
  overflow: hidden;
}

.gn-portrait:hover { transform: translateY(-6px) scale(1.012); box-shadow: 0 0 0 1px rgba(200,173,122,.5),0 28px 70px rgba(0,0,0,.34); }

.gn-portrait-shine {
  position: relative;
  overflow: hidden;
}

.gn-portrait-shine::after {
  content:''; position:absolute; inset:0; pointer-events:none;
  background: linear-gradient(115deg,transparent 30%,rgba(255,255,255,.28) 48%,transparent 62%);
  transform: translateX(-120%); transition: transform .9s ease;
}

.gn-portrait:hover .gn-portrait-shine::after { transform: translateX(120%); }

.gn-portrait img { width:100%; height:auto; display:block; filter:contrast(1.04) saturate(1.04); transition: filter .6s; }

.gn-portrait:hover img { filter:contrast(1.07) saturate(1.1); }

.gn-spectrum-section {
  background: #0e0c09; color: var(--gn-ivory);
  padding: clamp(48px,6vw,80px) 0 clamp(60px,7vw,96px);
  position: relative; overflow: hidden;
}

.gn-spectrum-section::before {
  content:''; position:absolute; inset:0;
  background: radial-gradient(ellipse 60% 60% at 50% 0%,rgba(139,105,20,.18),transparent 65%);
}

.gn-intro-head { text-align:center; max-width:720px; margin:0 auto clamp(40px,5vw,60px); position:relative; z-index:2; }

.gn-intro-kicker { font-size:9.5px; letter-spacing:0.24em; text-transform:uppercase; color:var(--gn-gold-lt); margin-bottom:16px; }

.gn-intro-title {
  font-family: var(--gn-serif);
  font-size: clamp(30px,4.6vw,58px);
  font-weight:300; line-height:1.05; letter-spacing:-0.01em;
  margin-bottom:20px;
}

.gn-intro-title em { font-style:italic; color:var(--gn-gold-lt); }

.gn-intro-desc { font-size:14.5px; line-height:1.75; color:rgba(253,250,244,.62); max-width:600px; margin:0 auto; }

.gn-spectrum-wrap { position:relative; z-index:2; }

.gn-spectrum-strip {
  display:flex;
  height: clamp(180px,28vw,300px);
  width:100%;
  overflow:hidden;
  cursor:crosshair;
}

.gn-spectrum-strip.lit .gn-band { transform:translateY(0); }

.gn-band-tip {
  position:absolute; bottom:10px; left:50%;
  transform:translateX(-50%) translateY(6px);
  white-space:nowrap; font-size:9px; letter-spacing:0.1em;
  text-transform:uppercase; color:#fff;
  background:rgba(10,8,5,.78); padding:3px 8px;
  opacity:0; pointer-events:none;
  transition:opacity .15s ease-out, transform .15s ease-out;
  backdrop-filter:blur(4px);
}

.gn-band.hovered .gn-band-tip { opacity:1; transform:translateX(-50%) translateY(0); }

.gn-axis {
  display:flex; justify-content:space-between;
  margin-top:14px; font-size:9.5px; letter-spacing:0.16em;
  text-transform:uppercase; color:rgba(253,250,244,.4);
}

.gn-axis-note { text-align:center; margin-top:18px; font-size:12px; color:rgba(253,250,244,.45); font-style:italic; font-family:var(--gn-serif); }

.gn-explode {
  position:relative; z-index:2;
  margin-top:36px;
  background:rgba(255,255,255,.035);
  border:1px solid rgba(200,173,122,.22);
  display:grid; grid-template-columns:220px 1fr;
  min-height:0; max-height:0; overflow:hidden;
  opacity:0; transition:max-height .5s ease,opacity .4s ease,margin .4s;
}

.gn-explode.open { max-height:420px; opacity:1; }

.gn-explode-thumb { background:#000; overflow:hidden; }

.gn-explode-thumb img { width:100%; height:100%; object-fit:cover; min-height:220px; }

.gn-explode-body { padding:clamp(24px,3vw,40px); display:flex; flex-direction:column; }

.gn-explode-eyebrow { font-size:9.5px; letter-spacing:0.2em; text-transform:uppercase; color:var(--gn-gold-lt); margin-bottom:10px; }

.gn-explode-title { font-family:var(--gn-serif); font-size:clamp(22px,2.6vw,32px); font-weight:400; line-height:1.15; margin-bottom:6px; }

.gn-explode-meta { font-size:12px; color:rgba(253,250,244,.5); letter-spacing:0.04em; margin-bottom:24px; }

.gn-swatches { display:flex; gap:0; flex-wrap:wrap; }

.gn-swatch {
  flex:1 1 0; min-width:120px;
  opacity:0; transform:translateY(16px);
  transition:opacity .5s,transform .5s;
}

.gn-explode.open .gn-swatch { opacity:1; transform:translateY(0); }

.gn-explode.open .gn-swatch:nth-child(1) { transition-delay:.08s; }

.gn-explode.open .gn-swatch:nth-child(2) { transition-delay:.16s; }

.gn-explode.open .gn-swatch:nth-child(3) { transition-delay:.24s; }

.gn-explode.open .gn-swatch:nth-child(4) { transition-delay:.32s; }

.gn-swatch-chip { height:84px; border:1px solid rgba(255,255,255,.12); }

.gn-swatch-label { font-size:11px; letter-spacing:0.06em; color:#fff; margin-top:10px; }

.gn-wheel-section { background:var(--gn-ivory); padding:clamp(60px,8vw,96px) 0; }

.gn-sec-head {
  display:flex; align-items:flex-end; justify-content:space-between;
  margin-bottom:clamp(36px,5vw,56px); gap:24px; flex-wrap:wrap;
}

.gn-sec-kicker { font-size:9.5px; letter-spacing:0.2em; text-transform:uppercase; color:var(--gn-gold); font-weight:500; margin-bottom:10px; }

.gn-sec-title {
  font-family:var(--gn-serif); font-size:clamp(28px,3.8vw,48px);
  font-weight:300; line-height:1.1; letter-spacing:-0.01em; color:var(--gn-ink);
}

.gn-sec-title em { font-style:italic; color:var(--gn-gold); }

.gn-sec-desc { font-size:14px; color:var(--gn-ink-3); max-width:480px; line-height:1.6; margin-top:12px; }

.gn-wheel-layout { display:grid; grid-template-columns:1fr 320px; gap:clamp(32px,5vw,64px); align-items:center; }

.gn-wheel-stage { position:relative; aspect-ratio:1; max-width:600px; width:100%; margin:0 auto; }

.gn-wheel-svg { width:100%; height:100%; overflow:visible; }

.gn-ring { fill:none; stroke:var(--gn-rule); stroke-width:1; }

.gn-spoke { stroke:var(--gn-rule); stroke-width:1; }

.gn-cap { font-family:var(--gn-sans); font-size:9px; letter-spacing:0.14em; text-transform:uppercase; fill:var(--gn-ink-3); }

.gn-ax-lab { font-family:var(--gn-serif); font-size:12px; fill:var(--gn-ink-3); font-style:italic; }

.gn-wheel-stage.in .gn-dot { opacity:1; }

.gn-dot-tip {
  position:absolute; z-index:10; pointer-events:none;
  white-space:nowrap; font-size:10px; letter-spacing:0.08em;
  text-transform:uppercase; color:#fff;
  background:rgba(10,8,5,.88); padding:4px 10px;
  border:1px solid rgba(255,255,255,.12);
  opacity:0;
  transform:translate(-50%, calc(-100% - 6px));
  transition:opacity .15s ease-out, transform .15s ease-out;
  backdrop-filter:blur(4px);
}

.gn-dot-tip.visible {
  opacity:1;
  transform:translate(-50%, calc(-100% - 10px));
}

.gn-wheel-preview {
  background:var(--gn-sand); border:1px solid var(--gn-rule);
  padding:0; overflow:hidden; min-height:380px; display:flex; flex-direction:column;
  box-shadow: 0 12px 42px rgba(28,26,23,.14), 0 2px 10px rgba(28,26,23,.08);
}

.gn-wheel-preview-img { background:#0e0c09; aspect-ratio:4/5; overflow:hidden; position:relative; }

.gn-wheel-preview-img img { width:100%; height:100%; object-fit:cover; transition:opacity .35s; }

.gn-wheel-empty {
  position:absolute; inset:0; display:flex; align-items:center; justify-content:center;
  text-align:center; padding:28px; color:rgba(253,250,244,.45);
  font-family:var(--gn-serif); font-style:italic; font-size:15px; line-height:1.5;
}

.gn-wheel-preview-body { padding:20px 22px 24px; }

.gn-wp-title { font-family:var(--gn-serif); font-size:20px; font-weight:400; line-height:1.2; color:var(--gn-ink); margin-bottom:4px; }

.gn-wp-meta { font-size:11.5px; color:var(--gn-ink-3); letter-spacing:0.04em; margin-bottom:14px; }

.gn-wp-hsl { display:flex; gap:18px; border-top:1px solid var(--gn-rule); padding-top:14px; }

.gn-wp-hsl div span { display:block; }

.gn-wp-val { font-family:var(--gn-serif); font-size:18px; color:var(--gn-gold); line-height:1; }

.gn-wp-lab { font-size:9px; letter-spacing:0.12em; text-transform:uppercase; color:var(--gn-ink-3); margin-top:4px; }

.gn-facts-section { background:var(--gn-sand-2); padding:clamp(56px,7vw,88px) 0; border-top:1px solid var(--gn-rule); }

.gn-facts-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:clamp(14px,2vw,24px); }

.gn-fact-card {
  background:var(--gn-ivory); border:1px solid var(--gn-rule); padding:28px 24px;
  position:relative; transition:transform .4s cubic-bezier(.22,.61,.36,1),box-shadow .4s,border-color .4s;
}

.gn-fact-card::before { content:''; position:absolute; left:0; top:0; width:0; height:2px; background:var(--gn-gold); transition:width .45s cubic-bezier(.22,.61,.36,1); }

.gn-fact-card:hover { transform:translateY(-6px); box-shadow:0 14px 38px rgba(28,26,23,.12); border-color:var(--gn-rule-str); }

.gn-fact-card:hover::before { width:100%; }

.gn-fact-swatch { width:38px; height:38px; border:1px solid var(--gn-rule); margin-bottom:18px; transition:transform .4s cubic-bezier(.34,1.56,.64,1); }

.gn-fact-card:hover .gn-fact-swatch { transform:scale(1.18) rotate(-4deg); }

.gn-fact-val { font-family:var(--gn-serif); font-size:38px; font-weight:300; color:var(--gn-ink); line-height:1; margin-bottom:6px; }

.gn-fact-val small { font-size:18px; color:var(--gn-gold); }

.gn-fact-lab { font-size:10px; letter-spacing:0.14em; text-transform:uppercase; color:var(--gn-ink-3); margin-bottom:10px; }

.gn-fact-desc { font-size:12.5px; line-height:1.55; color:var(--gn-ink-2); }

.gn-gallery-section { background:var(--gn-ivory); padding:clamp(60px,8vw,96px) 0; }

.gn-gallery-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:clamp(16px,2.2vw,28px); perspective:1200px; }

.gn-card {
  background:#fff; border:1px solid var(--gn-rule); overflow:hidden; display:flex; flex-direction:column;
  transition:box-shadow .4s,transform .35s cubic-bezier(.22,.61,.36,1),border-color .4s;
  transform-style:preserve-3d;
}

.gn-card:hover { box-shadow:0 18px 46px rgba(28,26,23,.16); border-color:var(--gn-rule-str); }

.gn-card-img { background:#0e0c09; overflow:hidden; position:relative; aspect-ratio:4/5; }

.gn-card-img img { width:100%; height:100%; object-fit:cover; transition:transform .7s cubic-bezier(.22,.61,.36,1),filter .5s; filter:saturate(.92); }

.gn-card:hover .gn-card-img img { transform:scale(1.06); filter:saturate(1.05); }

.gn-palette-row { display:flex; height:6px; transition:height .35s ease; }

.gn-card:hover .gn-palette-row { height:12px; }

.gn-palette-row span { flex:1; transition:flex .35s ease; }

.gn-palette-row span:hover { flex:2.4; }

.gn-card-info { padding:18px 18px 22px; display:flex; flex-direction:column; flex:1; }

.gn-card-title { font-family:var(--gn-serif); font-size:18px; font-weight:400; line-height:1.2; color:var(--gn-ink); margin-bottom:4px; transition:color .3s; }

.gn-card:hover .gn-card-title { color:var(--gn-gold); }

.gn-card-year { font-size:11px; letter-spacing:0.1em; text-transform:uppercase; color:var(--gn-ink-3); margin-bottom:14px; }

.gn-card-color { font-size:10.5px; color:var(--gn-gold); letter-spacing:0.06em; margin-top:auto; display:flex; align-items:center; gap:8px; }

.gn-card-color i { width:12px; height:12px; border:1px solid var(--gn-rule); display:inline-block; flex-shrink:0; }

.gn-rev { opacity:0; transform:translateY(28px); transition:opacity .8s ease,transform .8s cubic-bezier(.22,.61,.36,1); }

.gn-rev.in { opacity:1; transform:none; }

.gn-rev-l { opacity:0; transform:translateX(-36px); transition:opacity .8s ease,transform .9s cubic-bezier(.22,.61,.36,1); }

.gn-rev-l.in { opacity:1; transform:none; }

.gn-rev-r { opacity:0; transform:translateX(36px);  transition:opacity .8s ease,transform .9s cubic-bezier(.22,.61,.36,1); }

.gn-rev-r.in { opacity:1; transform:none; }

.gn-rev-sc { opacity:0; transform:scale(.94); transition:opacity .8s ease,transform .9s cubic-bezier(.22,.61,.36,1); }

.gn-rev-sc.in { opacity:1; transform:none; }

.gn-stagger > * { opacity:0; transform:translateY(26px); transition:opacity .65s ease,transform .7s cubic-bezier(.22,.61,.36,1); }

.gn-stagger.in > * { opacity:1; transform:none; }

.gn-stagger.in > *:nth-child(1) { transition-delay:.05s }

.gn-stagger.in > *:nth-child(2) { transition-delay:.12s }

.gn-stagger.in > *:nth-child(3) { transition-delay:.19s }

.gn-stagger.in > *:nth-child(4) { transition-delay:.26s }

.gn-stagger.in > *:nth-child(5) { transition-delay:.33s }

.gn-stagger.in > *:nth-child(6) { transition-delay:.40s }

.gn-stagger.in > *:nth-child(7) { transition-delay:.47s }

.gn-stagger.in > *:nth-child(8) { transition-delay:.54s }

@media (max-width:1080px) {
  .gn-head-inner { grid-template-columns:1fr; }

  .gn-portrait { max-width:380px; }

  .gn-wheel-layout { grid-template-columns:1fr; }

  .gn-wheel-preview { max-width:420px; margin:0 auto; }

  .gn-facts-grid { grid-template-columns:repeat(2,1fr); }

  .gn-gallery-grid { grid-template-columns:repeat(2,1fr); }

}
@media (max-width:640px) {
  .gn-explode { grid-template-columns:1fr; }

  .gn-swatch { min-width:50%; }

  .gn-facts-grid { grid-template-columns:1fr 1fr; }

  .gn-gallery-grid { grid-template-columns:1fr; }

  .gn-stats { gap:24px; }

}
@media (prefers-reduced-motion: reduce) {
  .gn-rev,.gn-rev-l,.gn-rev-r,.gn-rev-sc,.gn-stagger > * { transition:none; opacity:1; transform:none; }

}
.moom-room {
  --canvas:#171717;
  --paper:#ebebeb;
  --gesso:#f0f0f0;
  --shadow:#242424;

  --ink:#221b14;
  --ink-soft:#4a3f30;
  --ink-mute:#6e6150;
  --ink-faint:#9a8c77;
  --ink-vapor:#c7bba6;

  --gold:#c79a4e;
  --umber:#7a5a3a;
  --sanguine:#b06a4f;
  --verdigris:#6f8a78;
  --azure:#5d7fa3;

  --rule:rgba(199,154,78,.34);
  --rule-soft:rgba(199,154,78,.18);

  --max-w:1380px;
  --gutter:clamp(20px,4vw,64px);

  /* ---- MOOD ENGINE defaults: "All" room ---- */
  --room-bg:#171717;
  --room-glow-a:rgba(162,162,162,.10);
  --room-glow-b:rgba(124,124,124,.06);
  --light-warm:rgba(162,162,162,.05);
  --tone-accent:#c79a4e;
  --contrast:1;
  --pace:1.4s;
  --drift:14s;
  --vignette:.55;
  --halo:24px;

  /* ---- Layout ---- */
  font-family:'Manrope',-apple-system,sans-serif;
  color:var(--ink-vapor);
  background:var(--room-bg);
  overflow-x:hidden;
  line-height:1.5;
  -webkit-font-smoothing:antialiased;
  transition:background var(--pace) ease;
  position:relative;
  padding-bottom:230px;
  min-height:60vh;
}

.moom-room::before {
  content:"";position:fixed;inset:0;z-index:0;pointer-events:none;
  background-image:
    radial-gradient(60% 50% at 22% 16%, var(--room-glow-a) 0, transparent 62%),
    radial-gradient(55% 60% at 84% 80%, var(--room-glow-b) 0, transparent 60%),
    radial-gradient(40% 40% at 50% 50%, var(--light-warm) 0, transparent 70%);
  transition:background-image var(--pace) ease, opacity var(--pace) ease;
  animation:moomBreath calc(var(--drift) * .9) ease-in-out infinite alternate;
}

.moom-room::after {
  content:"";position:fixed;inset:0;z-index:0;pointer-events:none;
  background:radial-gradient(120% 120% at 50% 42%, transparent 38%,
             rgba(0,0,0,calc(var(--vignette) * .9)) 100%);
  transition:background var(--pace) ease;
}

.moom-wrap { position:relative; z-index:2 }

.moom-breadcrumb {
  position:relative;
  z-index:3;
  padding-top:12px;
  padding-bottom:4px;
}

.moom-breadcrumb .breadcrumb-navigation-list { margin-top:0 }

.moom-breadcrumb .breadcrumb-navigation-list li,.moom-breadcrumb .breadcrumb-navigation-list a {
  color:var(--ink-vapor);
}

.moom-breadcrumb .breadcrumb-navigation-list a:hover {
  color:var(--gold);
  opacity:1;
}

.moom-breadcrumb .breadcrumb-current-page-item {
  color:var(--ink-faint);
  opacity:1;
}

.moom-hero { padding:clamp(48px,8vw,104px) 0 clamp(36px,5vw,64px); position:relative }

.moom-eyebrow {
  font-size:10px;font-weight:600;letter-spacing:.28em;text-transform:uppercase;
  color:var(--gold);display:flex;align-items:center;gap:14px;margin-bottom:30px
}

.moom-eyebrow::before { content:"";width:46px;height:.5px;background:var(--gold) }

.moom-hero h1 {
  font-family:'Italiana',serif;font-weight:400;color:var(--paper);
  font-size:clamp(56px,9vw,138px);line-height:.9;letter-spacing:-.01em
}

.moom-hero h1 em {
  font-family:'Cormorant Garamond',serif;font-style:italic;
  font-size:.62em;color:var(--gold);display:inline-block
}

.moom-hero .lede {
  font-family:'Cormorant Garamond',serif;font-size:clamp(18px,2vw,22px);
  color:var(--ink-vapor);max-width:560px;margin-top:30px;line-height:1.7
}

.moom-hero .lede em { color:var(--gold);font-style:italic }

.moom-hero-meta {
  display:flex;flex-wrap:wrap;gap:38px;margin-top:46px;
  padding-top:30px;border-top:.5px solid var(--rule)
}

.moom-hero-meta .m .v { font-family:'Italiana',serif;font-size:34px;color:var(--paper);line-height:1 }

.moom-hero-meta .m .l {
  font-size:9px;letter-spacing:.2em;text-transform:uppercase;
  color:var(--ink-faint);margin-top:8px;font-weight:600
}

.moom-readout {
  display:inline-flex;align-items:center;gap:10px;margin-top:34px;
  font-family:'DM Mono',monospace;font-size:10px;letter-spacing:.16em;text-transform:uppercase;
  color:var(--ink-vapor);border:.5px solid var(--rule);padding:8px 14px;border-radius:30px;
  background:rgba(0,0,0,.2)
}

.moom-readout .swatch {
  width:11px;height:11px;border-radius:50%;background:var(--tone-accent);
  box-shadow:0 0 14px var(--tone-accent);transition:background var(--pace),box-shadow var(--pace)
}

.moom-readout b { color:var(--gold);font-weight:500 }

.moom-sec { padding:clamp(40px,6vw,92px) 0; position:relative }

.moom-sec-head {
  display:flex;align-items:flex-end;justify-content:space-between;
  gap:30px;margin-bottom:46px;flex-wrap:wrap
}

.moom-sec-head .kick {
  font-size:10px;font-weight:600;letter-spacing:.28em;text-transform:uppercase;
  color:var(--gold);margin-bottom:16px;display:flex;align-items:center;gap:12px
}

.moom-sec-head .kick::before { content:"";width:34px;height:.5px;background:var(--gold) }

.moom-sec-head h2 {
  font-family:'Italiana',serif;font-weight:400;color:var(--paper);
  font-size:clamp(34px,4.6vw,62px);line-height:1;letter-spacing:-.005em
}

.moom-sec-head h2 em { font-family:'Cormorant Garamond',serif;font-style:italic;color:var(--gold);font-size:.82em }

.moom-sec-head p {
  font-family:'Cormorant Garamond',serif;font-size:17px;color:var(--ink-vapor);
  max-width:420px;line-height:1.7
}

.moom-gallery {
  display:grid;
  gap:clamp(18px,2.5vw,28px);
  grid-template-columns:repeat(auto-fill,minmax(min(180px,100%),1fr));
}

@media(min-width:960px) {
  .moom-gallery { grid-template-columns:repeat(6,1fr) }

}
.moom-plate {
  position:absolute;top:0;left:0;z-index:3;
  background:var(--ink);color:var(--paper);
  font-family:'DM Mono',monospace;font-size:9px;letter-spacing:.14em;text-transform:uppercase;
  padding:5px 9px;border-bottom-right-radius:3px
}

.moom-seal {
  position:absolute;z-index:3;width:50px;height:50px;border-radius:50%;
  background:var(--tone-accent);color:#1b140c;
  display:grid;place-items:center;text-align:center;
  font-family:'Italiana',serif;font-size:14px;line-height:1;letter-spacing:.02em;
  transform:rotate(-8deg);right:14px;top:14px;
  box-shadow:0 6px 16px rgba(0,0,0,.4);transition:background var(--pace)
}

.moom-mat { padding:clamp(10px,1.2vw,16px);background:var(--gesso) }

.moom-frame {
  background:var(--shadow);outline:.5px solid var(--rule-soft);outline-offset:-1px;
  display:flex;align-items:center;justify-content:center;overflow:hidden;
  min-height:180px;max-height:55vh
}

.moom-frame img {
  width:100%;height:auto;max-height:55vh;object-fit:contain;display:block;
  transition:transform 1s ease, filter var(--pace) ease
}

.moom-work:hover .moom-frame img { transform:scale(1.02) }

.moom-body {
  padding:clamp(14px,1.4vw,20px);background:var(--gesso);border-top:.5px solid var(--rule-soft)
}

.moom-body .moom-artist-label {
  font-size:10px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-mute)
}

.moom-body .moom-title {
  font-family:'Cormorant Garamond',serif;font-style:italic;font-size:clamp(16px,1.3vw,19px);
  color:var(--ink);margin-top:5px;line-height:1.25
}

.moom-body .moom-title span { color:var(--ink-faint);font-style:normal;font-size:.8em }

.moom-tone-tags { display:flex;flex-wrap:wrap;gap:6px;margin:12px 0 4px }

.moom-tag {
  font-family:'DM Mono',monospace;font-size:9px;letter-spacing:.1em;text-transform:uppercase;
  color:var(--ink-soft);border:.5px solid var(--rule);padding:3px 7px;border-radius:30px;background:var(--paper)
}

.moom-tag.tone { color:#1b140c;background:var(--tone-accent);border-color:transparent;transition:background var(--pace) }

.moom-placement {
  display:flex;align-items:center;gap:9px;margin-top:12px;padding-top:12px;
  border-top:.5px solid var(--rule-soft);
  font-family:'Cormorant Garamond',serif;font-style:italic;font-size:13px;color:var(--ink-mute)
}

.moom-placement svg { width:14px;height:14px;stroke:var(--umber);fill:none;stroke-width:1.3;flex-shrink:0 }

.moom-placement a {
  display:contents;color:inherit;text-decoration:none;
}

.moom-placement a:hover span { color:var(--gold);text-decoration:underline;text-underline-offset:2px }

.moom-manifesto .stats .l {
  font-size:9px;font-weight:600;letter-spacing:.18em;text-transform:uppercase;
  color:var(--ink-faint);margin-top:6px
}

.moom-bio { display:grid;grid-template-columns:280px 1fr;gap:56px;align-items:start }

.moom-portrait {
  background:var(--gesso);padding:14px;border:.5px solid var(--rule);border-radius:3px;
  box-shadow:0 30px 60px -24px rgba(0,0,0,.7)
}

.moom-portrait img {
  width:100%;height:auto;display:block;outline:.5px solid var(--rule-soft);outline-offset:-1px
}

.moom-portrait .cap {
  font-family:'Cormorant Garamond',serif;font-style:italic;font-size:13px;
  color:var(--ink-mute);text-align:center;margin-top:12px
}

.moom-bio h3 {
  font-family:'Italiana',serif;font-weight:400;color:var(--paper);
  font-size:clamp(36px,4.5vw,64px);line-height:.96
}

.moom-bio h3 em {
  font-family:'Cormorant Garamond',serif;font-style:italic;
  font-size:.5em;color:var(--gold);display:block;margin-top:4px
}

.moom-vitals {
  display:flex;gap:26px;flex-wrap:wrap;margin:22px 0;padding:16px 0;
  border-top:.5px solid var(--rule);border-bottom:.5px solid var(--rule);
  font-family:'DM Mono',monospace;font-size:10px;letter-spacing:.1em;
  text-transform:uppercase;color:var(--ink-faint)
}

.moom-bio p {
  font-family:'Cormorant Garamond',serif;font-size:18px;line-height:1.75;
  color:var(--ink-vapor);margin-bottom:16px;max-width:62ch
}

.moom-bio p em { color:var(--gold);font-style:italic }

.moom-dock {
  position:fixed;left:0;right:0;bottom:0;z-index:60;
  background:linear-gradient(0deg, rgba(9,9,9,.97) 64%, rgba(9,9,9,0));
  padding:46px var(--gutter,32px) 34px;
  backdrop-filter:blur(4px);
}

.moom-dock-inner {
	/* max-width:1380px removed: dead at HEAD - the later .container rules always won by order (RULE 4, C6 verify) */margin:0 auto }

.moom-dock-label {
  text-align:center;font-size:11px;font-weight:600;letter-spacing:.3em;
  text-transform:uppercase;color:var(--ink-faint);margin-bottom:24px
}

.moom-dock-label em {
  font-family:'Cormorant Garamond',serif;font-style:italic;
  text-transform:none;letter-spacing:0;font-size:20px;color:var(--gold)
}

.moom-moods { display:flex;justify-content:center;gap:14px;flex-wrap:wrap }

.moom-dotc { width:11px;height:11px;border-radius:50%;margin-bottom:3px }

@media(max-width:1100px) {
  .moom-bio { grid-template-columns:1fr;gap:32px }

  .moom-portrait { max-width:280px }

}
@media(max-width:760px) {
  .moom-room { padding-bottom:200px }

  .moom-gallery { grid-template-columns:repeat(2,1fr) }

  .moom-hero { padding-top:clamp(40px,10vw,72px) }

  .moom-hero h1 { font-size:clamp(46px,13vw,80px) }

  .moom-hero-meta { gap:20px 28px }

  .moom-sec-head { margin-bottom:34px }

  .moom-dock { padding:30px var(--gutter,20px) 24px }

  .moom-dock-label { margin-bottom:16px;font-size:10px }

  .moom-moods {
    flex-wrap:nowrap;overflow-x:auto;justify-content:flex-start;
    gap:10px;padding-bottom:8px;scroll-snap-type:x proximity;
    -webkit-overflow-scrolling:touch;
    mask-image:linear-gradient(90deg,transparent,#000 18px,#000 calc(100% - 18px),transparent)
  }

  .moom-moods::-webkit-scrollbar { height:0 }

}
@media(max-width:480px) {
  .moom-room { padding-bottom:184px }

  .moom-gallery { grid-template-columns:1fr }

  .moom-hero h1 { font-size:clamp(40px,14vw,60px);line-height:.94 }

  .moom-seal { width:42px;height:42px;font-size:7px;right:10px;top:10px }

  .moom-body .moom-title { font-size:17px }

}
@media(prefers-reduced-motion:reduce) {
  .moom-room::before { animation:none }

}
.tl-page {
  --tl-canvas:#1b1611;
  --tl-paper:#f3ead9;
  --tl-gesso:#f7efe0;
  --tl-shadow:#2a221a;
  --tl-ink:#221b14;
  --tl-ink-soft:#4a3f30;
  --tl-ink-mute:#6e6150;
  --tl-ink-faint:#9a8c77;
  --tl-ink-vapor:#c7bba6;
  --tl-gold:#c79a4e;
  --tl-gold-lt:#e0bd78;
  --tl-rule:rgba(199,154,78,.34);
  --tl-rule-soft:rgba(199,154,78,.18);
  font-family:'Manrope',-apple-system,sans-serif;
  color:var(--tl-ink-vapor);
  background:var(--tl-canvas);
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
  line-height:1.5;
}

.tl-progress-wrap {
  position:sticky;
  top:0;
  z-index:30;
  height:3px;
  background:rgba(255,255,255,.05);
}

.tl-progress-bar {
  height:100%;
  width:0;
  background:linear-gradient(90deg,var(--tl-gold),var(--tl-gold-lt));
  transition:width .1s linear;
  box-shadow:0 0 12px rgba(199,154,78,.45);
}

.tl-shell {
  overflow-x:auto;
  overflow-y:hidden;
  -webkit-overflow-scrolling:touch;
  cursor:grab;
  user-select:none;
  scrollbar-width:thin;
  scrollbar-color:var(--tl-gold) #12100d;
  background:var(--tl-canvas);
  min-height:min(78vh,820px);
}

.tl-shell:active { cursor:grabbing; }

.tl-shell::-webkit-scrollbar { height:7px; }

.tl-shell::-webkit-scrollbar-track { background:#12100d; }

.tl-shell::-webkit-scrollbar-thumb {
  background:var(--tl-gold);
  border-radius:4px;
}

.tl-track {
  display:flex;
  flex-direction:row;
  align-items:flex-start;
  gap:0;
  padding:clamp(36px,5vw,64px) clamp(20px,3vw,48px) clamp(56px,7vw,96px);
  min-height:min(72vh,760px);
}

.tl-period-head {
  position:sticky;
  top:18px;
  z-index:6;
  margin-bottom:clamp(22px,3vw,36px);
  min-width:clamp(160px,14vw,220px);
  max-width:260px;
}

.tl-period-band {
  height:2px;
  background:linear-gradient(90deg,var(--tl-gold),transparent);
  margin-bottom:14px;
  opacity:.85;
}

.tl-period-node {
  width:11px;
  height:11px;
  border-radius:50%;
  background:var(--tl-gold);
  box-shadow:0 0 0 4px rgba(199,154,78,.18),0 0 14px rgba(199,154,78,.35);
  margin-bottom:16px;
}

.tl-period-chip {
  font-family:'DM Mono',ui-monospace,monospace;
  font-size:9.5px;
  letter-spacing:.2em;
  text-transform:uppercase;
  color:var(--tl-ink-faint);
  margin-bottom:8px;
}

.tl-period-chip .yr { color:var(--tl-gold-lt); margin-left:.35em; }

.tl-period-name {
  font-family:'Italiana',serif;
  font-weight:400;
  font-size:clamp(22px,2.4vw,34px);
  line-height:1.05;
  color:var(--tl-paper);
  margin:0;
  letter-spacing:-.01em;
}

.tl-year-tag {
  position:absolute;
  top:10px;
  right:10px;
  z-index:4;
  font-family:'DM Mono',ui-monospace,monospace;
  font-size:9px;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--tl-paper);
  background:rgba(34,27,20,.82);
  border:1px solid var(--tl-rule-soft);
  padding:4px 8px;
  border-radius:2px;
}

.tl-work-inner {
  border:1px solid var(--tl-rule);
  border-radius:3px;
  background:var(--tl-gesso);
  box-shadow:0 28px 56px -26px rgba(0,0,0,.75);
  overflow:hidden;
  transform:perspective(900px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg));
  transition:transform .18s ease-out,box-shadow .35s ease;
  will-change:transform;
}

.tl-work:hover .tl-work-inner {
  box-shadow:0 36px 70px -24px rgba(0,0,0,.82),0 0 24px -6px rgba(199,154,78,.25);
}

.tl-plate {
  display:block;
  font-family:'DM Mono',ui-monospace,monospace;
  font-size:9px;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:var(--tl-ink-mute);
  padding:12px 14px 0;
}

.tl-mat { padding:10px 12px 0; background:var(--tl-gesso); }

.tl-img-wrap {
  background:var(--tl-shadow);
  outline:1px solid var(--tl-rule-soft);
  outline-offset:-1px;
  overflow:hidden;
  aspect-ratio:4/5;
  display:flex;
  align-items:center;
  justify-content:center;
}

.tl-img-wrap img {
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  filter:saturate(.94);
  transition:transform .65s cubic-bezier(.22,.61,.36,1),filter .4s;
}

.tl-work:hover .tl-img-wrap img {
  transform:scale(1.03);
  filter:saturate(1.02);
}

.tl-body {
  padding:14px 16px 18px;
  background:var(--tl-gesso);
  border-top:1px solid var(--tl-rule-soft);
}

.tl-artist {
  font-size:10px;
  font-weight:600;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--tl-ink-mute);
  margin:0 0 6px;
}

.tl-wt {
  font-family:'Cormorant Garamond',serif;
  font-style:italic;
  font-size:clamp(15px,1.2vw,18px);
  line-height:1.3;
  color:var(--tl-ink);
  margin:0;
}

.tl-rule {
  height:1px;
  background:var(--tl-rule-soft);
  margin:12px 0 10px;
}

.tl-prov {
  font-family:'Cormorant Garamond',serif;
  font-size:13px;
  line-height:1.55;
  color:var(--tl-ink-soft);
  margin:0;
  display:-webkit-box;
  -webkit-line-clamp:3;
  -webkit-box-orient:vertical;
  overflow:hidden;
}

.tl-terminus .t-num {
  font-family:'DM Mono',ui-monospace,monospace;
  font-size:9.5px;
  letter-spacing:.28em;
  text-transform:uppercase;
  color:var(--tl-gold);
  margin-bottom:18px;
}

@media (max-width:820px) {
  .tl-shell {
    overflow-x:visible;
    overflow-y:visible;
    cursor:default;
    min-height:0;
  }

  .tl-track {
    flex-direction:column;
    min-height:0;
    padding:28px 18px 48px;
  }

  .tl-period-head {
    position:static;
    max-width:none;
  }

}
.spectral-page {
  --field:#0c1113;
  --field-2:#0a0e10;
  --grid-minor:rgba(120,150,160,0.055);
  --grid-major:rgba(150,180,190,0.13);
  --axis:rgba(190,215,220,0.32);
  --gold:#c9a24b;
  --gold-soft:#d9bd78;
  --gold-glow:rgba(201,162,75,0.55);
  --cyan:#7fb8c2;
  --cyan-soft:#a9d4db;
  --ink:#e8eef0;
  --ink-dim:#8fa1a6;
  --ink-faint:#566569;
  --panel:rgba(16,23,26,0.82);
  --panel-line:rgba(140,170,178,0.18);
  --metal:linear-gradient(145deg,#d8dde0,#7b868a 45%,#c2c9cc 70%,#5c656a);
  --chip-bg:rgba(255,255,255,0.07);
}

.spectral-page {
  --field:#0c1113;
  --field-2:#0a0e10;
}

.spectral-badge {
  display:inline-block;
  margin-top:.6rem;
  padding:.25rem .75rem;
  background:rgba(201,162,75,.2);
  border:1px solid rgba(201,162,75,.5);
  border-radius:3px;
  font-size:.82rem;
  letter-spacing:.1em;
  text-transform:uppercase;
  font-family:"Space Mono",monospace;
  color:#d9bd78;
}

.spectral-lab {
  background:var(--field-2);
  color:var(--ink);
  font-family:"Cormorant Garamond",serif;
  -webkit-font-smoothing:antialiased;
  padding:0 0 80px;
}

.lab-intro {
  text-align:center;
  padding:48px 24px 28px;
}

.lab-eyebrow {
  font-family:"Space Mono",monospace;
  font-size:11px;
  letter-spacing:.42em;
  text-transform:uppercase;
  color:var(--cyan);
  opacity:.85;
  margin-bottom:16px;
}

.lab-eyebrow::before,.lab-eyebrow::after {content:"·";margin:0 .7em;color:var(--gold)}

.lab-headline {
  font-family:"Playfair Display",serif;
  font-weight:600;
  font-size:clamp(22px,3.5vw,38px);
  letter-spacing:.01em;
  line-height:1.1;
  color:var(--ink);
}

.lab-sub {
  margin-top:12px;
  font-size:clamp(15px,1.8vw,18px);
  color:var(--ink-dim);
  font-style:italic;
  max-width:620px;
  margin-left:auto;
  margin-right:auto;
  line-height:1.45;
}

.readout-strip {
  margin-top:18px;
  display:flex;
  gap:22px;
  justify-content:center;
  flex-wrap:wrap;
  font-family:"Space Mono",monospace;
  font-size:11px;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--ink-faint);
}

.readout-strip b {color:var(--gold-soft);font-weight:700}

.lab-shell {
  display:flex;
  gap:0;
  max-width:1320px;
  margin:0 auto;
  padding:8px 24px 0;
  align-items:flex-start;
}

.spectral-rail {
  flex:0 0 232px;
  position:sticky;
  top:20px;
  background:var(--panel);
  border:1px solid var(--panel-line);
  border-radius:4px;
  backdrop-filter:blur(6px);
  padding:18px 16px 20px;
  box-shadow:0 0 0 1px rgba(0,0,0,.4),0 20px 50px -20px rgba(0,0,0,.8);
}

.rail-head {
  font-family:"Space Mono",monospace;
  font-size:10px;
  letter-spacing:.3em;
  text-transform:uppercase;
  color:var(--cyan);
  border-bottom:1px solid var(--panel-line);
  padding-bottom:10px;
  margin-bottom:6px;
  display:flex;
  justify-content:space-between;
  align-items:center;
}

.rail-head .dot {
  width:7px;height:7px;border-radius:50%;
  background:var(--gold);
  box-shadow:0 0 8px var(--gold-glow);
  animation:pulse 2.6s infinite;
}

.rail-group {margin-top:18px}

.rail-group h4 {
  font-family:"Space Mono",monospace;
  font-size:10px;letter-spacing:.24em;
  text-transform:uppercase;color:var(--ink-faint);
  margin-bottom:10px;font-weight:400;
}

.chips {display:flex;flex-wrap:wrap;gap:7px}

.chip {
  font-family:"Space Mono",monospace;
  font-size:10.5px;letter-spacing:.08em;
  text-transform:uppercase;color:var(--ink-dim);
  border:1px solid var(--panel-line);
  background:rgba(255,255,255,.012);
  padding:6px 10px;border-radius:3px;
  cursor:pointer;transition:all .25s ease;user-select:none;
}

.chip:hover {border-color:var(--cyan);color:var(--cyan-soft)}

.chip.active {
  background:rgba(201,162,75,.14);border-color:var(--gold);color:var(--gold-soft);
  box-shadow:0 0 12px -2px var(--gold-glow);
}

.rail-readout {
  margin-top:22px;padding-top:14px;
  border-top:1px solid var(--panel-line);
  font-family:"Space Mono",monospace;
  font-size:11px;letter-spacing:.1em;color:var(--ink-faint);
}

.rail-readout b {color:var(--gold-soft);font-weight:700}

.rail-reset {
  margin-top:14px;width:100%;
  font-family:"Space Mono",monospace;
  font-size:10px;letter-spacing:.2em;
  text-transform:uppercase;color:var(--ink-faint);
  background:none;border:1px dashed var(--panel-line);
  padding:8px;border-radius:3px;
  cursor:pointer;transition:all .25s;
}

.rail-reset:hover {color:var(--cyan-soft);border-color:var(--cyan)}

.plot-wrap {flex:1 1 auto;min-width:0;padding-left:26px}

.plot-frame {
  position:relative;width:100%;aspect-ratio:1/0.92;
  background:
    radial-gradient(ellipse 70% 60% at 50% 48%,rgba(40,58,64,.35),transparent 70%),
    radial-gradient(circle at 50% 50%,var(--field),var(--field-2) 78%);
  border:1px solid var(--panel-line);border-radius:4px;overflow:hidden;
  box-shadow:inset 0 0 120px -20px rgba(0,0,0,.85),0 24px 60px -28px rgba(0,0,0,.9);
}

.plot-frame::after {
  content:"";position:absolute;inset:0;pointer-events:none;
  background:repeating-linear-gradient(0deg,rgba(255,255,255,.014) 0 1px,transparent 1px 3px);
  mix-blend-mode:overlay;
}

.plot-frame::before {
  content:"";position:absolute;inset:0;pointer-events:none;z-index:3;
  box-shadow:inset 0 0 160px 40px rgba(0,0,0,.55);
}

svg.plot {position:absolute;inset:0;width:100%;height:100%;display:block}

.axis-label {
  position:absolute;font-family:"Space Mono",monospace;font-size:11px;
  letter-spacing:.28em;text-transform:uppercase;color:var(--gold-soft);
  opacity:.9;z-index:4;pointer-events:none;
}

.axis-x-left {left:14px;bottom:8px}

.axis-x-right {right:14px;bottom:8px}

.axis-y-top {top:10px;left:50%;transform:translateX(-50%)}

.axis-y-bot {bottom:30px;left:14px;writing-mode:vertical-rl;transform:rotate(180deg)}

.axis-title {
  position:absolute;font-family:"Space Mono",monospace;font-size:9.5px;
  letter-spacing:.34em;text-transform:uppercase;color:var(--cyan);opacity:.7;z-index:4;
}

.axis-title.x {bottom:8px;left:50%;transform:translateX(-50%)}

.axis-title.y {top:50%;left:6px;writing-mode:vertical-rl;transform:translateY(-50%) rotate(180deg)}

.spec {
  position:fixed;z-index:200;width:234px;pointer-events:none;
  background:rgba(12,18,21,0.97);
  border:1.5px solid rgba(201,162,75,0.7);
  border-radius:4px;
  box-shadow:0 0 0 1px rgba(0,0,0,.7),
             0 0 18px -4px rgba(201,162,75,0.45),
             0 22px 50px -10px rgba(0,0,0,.95);
  opacity:0;transform:translateY(6px);transition:opacity .18s,transform .18s;
  overflow:hidden;
}

.spec.on {opacity:1;transform:translateY(0)}

.spec .tag {
  font-family:"Space Mono",monospace;font-size:8.5px;letter-spacing:.3em;
  text-transform:uppercase;color:#0c1113;background:var(--gold);
  padding:3px 8px;display:inline-block;font-weight:700;
}

.spec .body {padding:12px 14px 14px}

.spec .title {
  font-family:"Playfair Display",serif;font-size:16px;
  color:#b8c8cc;
  line-height:1.2;margin-bottom:3px;
}

.spec .date {font-family:"Space Mono",monospace;font-size:10px;color:var(--ink-faint);letter-spacing:.12em;margin-bottom:12px}

.spec .metrics {display:flex;gap:14px;margin-bottom:10px}

.spec .metric {flex:1}

.spec .metric .k {font-family:"Space Mono",monospace;font-size:8px;letter-spacing:.22em;text-transform:uppercase;color:var(--cyan);margin-bottom:2px}

.spec .metric .v {font-family:"Space Mono",monospace;font-size:18px;color:var(--gold-soft);font-weight:700;line-height:1}

.spec .metric .vl {font-size:9px;color:var(--ink-dim);font-family:"Cormorant Garamond",serif;font-style:italic;letter-spacing:.02em;margin-top:2px}

.spec .rows-section {
  border-top:1px solid rgba(140,170,178,0.15);
  padding-top:9px;
  margin-top:4px;
}

.spec .row {
  font-family:"Space Mono",monospace;font-size:9px;letter-spacing:.06em;
  color:var(--cyan);margin-bottom:5px;
}

.spec .row span {
  display:block;
  color:var(--ink-dim);
  font-size:9px;letter-spacing:.03em;
  padding:2px 0 0 2px;
  line-height:1.4;
}

.spec .bar {height:2px;background:linear-gradient(90deg,var(--gold),rgba(201,162,75,0));margin-top:10px;opacity:.7}

.spectral-footnote {
  text-align:center;max-width:720px;margin:48px auto 0;padding:0 24px;
  color:var(--ink-dim);font-style:italic;font-size:17px;line-height:1.55;
}

.spectral-footnote .em {color:var(--gold-soft);font-style:normal}

.spectral-empty {
  text-align:center;padding:80px 24px;color:var(--ink-dim);
  font-style:italic;font-size:18px;
}

@media(max-width:860px) {
  .lab-shell {flex-direction:column;padding:8px 14px 0}

  .spectral-rail {position:static;width:100%;flex-basis:auto}

  .plot-wrap {padding-left:0;margin-top:20px;width:100%}

}
.artist-hero-banner::after {
  background: var(--artist-hero-bg) center center / cover no-repeat;
}

.genome-wrap .genome-empty-state {
    text-align: center;
    padding: 80px 24px;
    font-family: var(--genome-serif, 'Cormorant Garamond', serif);
    font-size: 22px;
    color: var(--genome-muted, #7A7266);
    font-style: italic;
}


/* ============================================================================
   RULE-4 RE-ASSERTION (2026-07-06): the mood-room dock carries BOTH
   `.moom-dock-inner` and Bootstrap `.container`; the kept `.container`
   auto-centering used to beat the moved `.moom-dock-inner` margins by order.
   ========================================================================= */
.moom-dock-inner.container {
	margin-left: auto;
	margin-right: auto;
}

/* -- C6 second pass (2026-07-06): rules for JS-INJECTED immersive classes
   (gn-band/gn-dot/moom-work/moom-manifesto/moom-btn/tl-period/... build at
   runtime, so the template census missed them) -- */

.gn-portrait-cap {
  position:absolute; bottom:-28px; left:50%; transform:translateX(-50%);
  white-space:nowrap; font-size:9.5px; letter-spacing:0.18em;
  text-transform:uppercase; color:var(--gn-ink-3);
}

.gn-band {
  flex:1 1 auto; height:100%; position:relative;
  transform:translateY(105%);
  /* Collapse: ease-in — starts slow, accelerates to finish (2 s set by JS) */
  transition:transform .9s cubic-bezier(.22,.61,.36,1),
             flex-grow 2s cubic-bezier(.42,0,1,1),
             filter 2s cubic-bezier(.42,0,1,1),
             brightness 2s cubic-bezier(.42,0,1,1);
}

.gn-band.hovered { filter:brightness(1.18); flex-grow:4; z-index:3; }

.gn-band.active { flex-grow:6; z-index:4; box-shadow:0 0 0 2px var(--gn-gold-lt) inset; }

.gn-dot {
  cursor:pointer;
  transition:r .25s,stroke-width .25s,opacity .3s;
  stroke:rgba(255,255,255,.6); stroke-width:1;
  opacity:0;
}

.gn-dot:hover { stroke:var(--gn-ink); stroke-width:2; }

.moom-work {
  position:relative;border:.5px solid var(--rule);border-radius:3px;
  background:var(--gesso);
  box-shadow:0 36px 70px -28px rgba(0,0,0,.7), 0 0 var(--halo) -6px var(--tone-accent);
  transition:transform .7s cubic-bezier(.2,.7,.2,1),
             box-shadow var(--pace) ease,
             opacity .9s ease, filter var(--pace) ease;
  animation:moomFloat var(--drift) ease-in-out infinite alternate;
  will-change:transform;
}

.moom-work:nth-child(6n+1) { animation-delay:-2s }

.moom-work:nth-child(6n+2) { animation-delay:-5s;  animation-duration:calc(var(--drift) + 3s) }

.moom-work:nth-child(6n+3) { animation-delay:-8s;  animation-duration:calc(var(--drift) - 2s) }

.moom-work:nth-child(6n+4) { animation-delay:-11s; animation-duration:calc(var(--drift) + 1s) }

.moom-work:nth-child(6n+5) { animation-delay:-14s; animation-duration:calc(var(--drift) + 2s) }

.moom-work:nth-child(6n+6) { animation-delay:-17s; animation-duration:calc(var(--drift) - 1s) }

.moom-work:hover {
  transform:translateY(-14px) scale(1.012);
  box-shadow:0 50px 90px -30px rgba(0,0,0,.8), 0 0 calc(var(--halo) + 24px) -4px var(--tone-accent)
}

.moom-work.dim {
  opacity:.16;filter:grayscale(.55) brightness(.7);
  animation-play-state:paused;pointer-events:none
}

.moom-manifesto {
  border-top:.5px solid var(--rule);border-bottom:.5px solid var(--rule);
  padding:clamp(46px,6vw,86px) 0;
  display:grid;grid-template-columns:auto 1fr auto;gap:60px;align-items:center
}

.moom-manifesto .side {
  writing-mode:vertical-rl;transform:rotate(180deg);
  font-size:10px;font-weight:600;letter-spacing:.3em;text-transform:uppercase;color:var(--gold)
}

.moom-manifesto .quote {
  font-family:'Italiana',serif;font-size:clamp(22px,3vw,42px);line-height:1.25;color:var(--paper)
}

.moom-manifesto .quote em {
  font-family:'Cormorant Garamond',serif;font-style:italic;color:var(--azure)
}

.moom-manifesto .stats {
  display:flex;flex-direction:column;gap:24px;border-left:.5px solid var(--rule);padding-left:48px
}

.moom-manifesto .stats .v { font-family:'Italiana',serif;font-size:34px;color:var(--paper);line-height:1 }

.moom-btn {
  cursor:pointer;font:inherit;color:var(--ink-vapor);
  background:rgba(255,255,255,.03);border:.5px solid var(--rule);
  padding:18px 30px 16px;border-radius:38px;
  display:flex;flex-direction:column;align-items:center;gap:5px;
  transition:all .4s ease;min-width:140px;
}

.moom-btn .name { font-size:13px;font-weight:600;letter-spacing:.16em;text-transform:uppercase }

.moom-btn .it { font-family:'Cormorant Garamond',serif;font-style:italic;font-size:15px;color:var(--ink-faint) }

.moom-btn:hover { border-color:var(--ink-vapor);transform:translateY(-3px) }

.moom-btn.on {
  background:var(--gesso);color:var(--ink);border-color:transparent;
  box-shadow:0 0 30px -4px var(--tone-accent)
}

.moom-btn.on .it { color:var(--ink-mute) }

@media(max-width:1100px) {
  .moom-manifesto { grid-template-columns:1fr;gap:34px }

  .moom-manifesto .side { writing-mode:horizontal-tb;transform:none }

  .moom-manifesto .stats {
    flex-direction:row;flex-wrap:wrap;border-left:none;padding-left:0;
    border-top:.5px solid var(--rule);padding-top:24px;gap:32px
  }

}
@media(max-width:760px) {
  .moom-btn { flex-shrink:0;scroll-snap-align:center;min-width:122px;padding:14px 22px 12px }

}
@media(prefers-reduced-motion:reduce) {
  .moom-work { animation:none }

}
.tl-period {
  flex:0 0 auto;
  display:flex;
  flex-direction:column;
  padding-right:clamp(36px,4.5vw,68px);
  margin-right:clamp(8px,1.2vw,16px);
  border-right:1px solid var(--tl-rule-soft);
  opacity:0;
  transform:translateY(28px);
  transition:opacity .75s ease,transform .8s cubic-bezier(.22,.61,.36,1);
}

.tl-period.in { opacity:1; transform:none; }

.tl-period:last-of-type { border-right:none; }

.tl-works-row {
  display:flex;
  flex-direction:row;
  align-items:flex-start;
  gap:clamp(16px,2vw,28px);
  opacity:0;
  transform:translateX(18px);
  transition:opacity .65s ease,transform .7s cubic-bezier(.22,.61,.36,1);
}

.tl-works-row.in { opacity:1; transform:none; }

.tl-work {
  flex:0 0 clamp(210px,17vw,270px);
  position:relative;
  opacity:0;
  transform:translateY(22px);
}

.tl-work.in {
  animation:tlCardIn .8s cubic-bezier(.22,.61,.36,1) forwards;
}

.tl-terminus {
  flex:0 0 auto;
  align-self:center;
  min-width:min(88vw,360px);
  max-width:420px;
  padding:clamp(40px,6vw,72px) clamp(28px,4vw,48px);
  margin-left:clamp(24px,3vw,48px);
  border-left:1px solid var(--tl-rule-soft);
  opacity:0;
  transform:translateY(24px);
  transition:opacity .9s ease,transform .9s cubic-bezier(.22,.61,.36,1);
}

.tl-terminus.in { opacity:1; transform:none; }

.tl-terminus h2 {
  font-family:'Italiana',serif;
  font-weight:400;
  font-size:clamp(26px,3.2vw,42px);
  line-height:1.15;
  color:var(--tl-paper);
  margin:0 0 20px;
}

.tl-terminus h2 .w {
  display:inline-block;
  opacity:0;
  transform:translateY(10px);
  transition:opacity .45s ease,transform .45s ease;
}

.tl-terminus.in h2 .w {
  opacity:1;
  transform:none;
}

.tl-terminus p {
  font-family:'Cormorant Garamond',serif;
  font-size:17px;
  line-height:1.65;
  color:var(--tl-ink-vapor);
  margin:0;
}

.tl-terminus p em { color:var(--tl-gold-lt); font-style:italic; }

@media (max-width:820px) {
  .tl-period {
    border-right:none;
    border-bottom:1px solid var(--tl-rule-soft);
    padding-right:0;
    padding-bottom:36px;
    margin-right:0;
    margin-bottom:12px;
  }

  .tl-works-row {
    flex-direction:column;
    transform:translateY(18px);
  }

  .tl-works-row.in { transform:none; }

  .tl-work {
    flex:1 1 auto;
    width:100%;
    max-width:420px;
  }

  .tl-terminus {
    margin-left:0;
    border-left:none;
    border-top:1px solid var(--tl-rule-soft);
    padding-top:40px;
    max-width:none;
  }

}
@media (prefers-reduced-motion:reduce) {
  .tl-period,.tl-works-row,.tl-work,.tl-terminus,.tl-terminus h2 .w {
    transition:none;
    animation:none;
    opacity:1;
    transform:none;
  }

}