/* === BUNDLE: styles.css === */


:root {
  
  --ink: #1a0f05;
  --ink: oklch(0.19 0.045 52);
  --text: #3d2814;
  --text: oklch(0.32 0.062 55);
  --muted: #7a6650;
  --muted: oklch(0.55 0.048 68);
  --heading: #5c2d0a;
  --heading: oklch(0.38 0.115 48);
  --heading2: #8b4513;
  --heading2: oklch(0.48 0.135 47);
  --sacred-gold: #c4880f;
  --sacred-gold: oklch(0.71 0.165 78);
  --sacred-copper: #a04f0a;
  --sacred-copper: oklch(0.53 0.165 48);
  --sacred-teal: #1a6b6f;
  --sacred-teal: oklch(0.48 0.095 196);
  --plum: #5c2d0a;
  --plum: oklch(0.38 0.115 48);
  --copper: #b8650e;
  --copper: oklch(0.60 0.175 52);
  --gold: #d4a03a;
  --gold: oklch(0.76 0.155 82);
  --teal: #1a6b6f;
  --teal: oklch(0.48 0.095 196);
  --rose: #7a3020;
  --rose: oklch(0.43 0.135 32);
  --peacock: #005f7f;
  --peacock: oklch(0.47 0.115 226);
  --peacock-dark: #004a63;
  --peacock-dark: oklch(0.39 0.105 228);

  
  --heading-strong: #43200a;
  --heading-strong: oklch(0.33 0.105 46);

  
  --accent: #0090b8;
  --accent: oklch(0.66 0.155 218);
  --accent-strong: #00718f;
  --accent-strong: oklch(0.55 0.145 220);
  --accent-soft: rgba(0, 144, 184, 0.14);
  --accent-soft: oklch(0.66 0.155 218 / 0.14);

  --cream: #fffdf6;
  --cream: oklch(0.99 0.018 92);
  --paper: #fffaf0;
  --paper: oklch(0.98 0.028 88);
  --panel: rgba(255, 252, 243, 0.86);
  --panel: oklch(0.99 0.022 88 / 0.86);
  --panel2: rgba(255, 247, 228, 0.94);
  --panel2: oklch(0.97 0.045 86 / 0.94);
  --line: rgba(140, 85, 20, 0.16);
  --line: oklch(0.46 0.09 55 / 0.18);
  --shadow: 0 32px 80px rgba(30, 15, 0, 0.14);
  --soft: 0 16px 40px rgba(30, 15, 0, 0.08);
  --radius: 24px;
  --radius-sm: 14px;
  --speed: 0.5s;
  --ease: cubic-bezier(0.22, 0.85, 0.22, 1);
  
  --ease-spring: cubic-bezier(0.34, 1.56, 0.44, 1);
  --ease-soft: cubic-bezier(0.33, 1, 0.68, 1);
  --ease-out-back: cubic-bezier(0.18, 1.42, 0.4, 1);
  --font-display: 'Cormorant Garamond', Georgia, serif;
  --font-body: 'Jost', system-ui, sans-serif;
}


a:focus-visible, button:focus-visible, [tabindex]:focus-visible,
input:focus-visible, textarea:focus-visible, select:focus-visible,
summary:focus-visible {
  outline: 3px solid var(--accent);
  outline-offset: 3px;
  border-radius: 4px;
}
input:focus, textarea:focus, select:focus { border-color: var(--accent) !important; }


*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  font-family: var(--font-body);
  font-weight: 400;
  color: var(--text);
  
  background:
    radial-gradient(ellipse at 20% 0%,   rgba(255, 193, 66, 0.34), transparent 42%),
    radial-gradient(ellipse at 82% 8%,   rgba(255, 214, 140, 0.28), transparent 38%),
    radial-gradient(ellipse at 50% 100%, rgba(255, 205, 110, 0.16), transparent 45%),
    linear-gradient(160deg, #fffdf7 0%, #fef6e6 28%, #fdefd2 58%, #fff4e0 100%);
  background-color: #fdf3de;
  background-attachment: fixed, fixed, fixed, fixed;
  min-height: 100vh;
  overflow-x: hidden;
  line-height: 1.7;
  font-size: 19px;
}
body::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: -4;
  pointer-events: none;
  background-image:
    linear-gradient(rgba(140, 85, 20, 0.03) 1px, transparent 1px),
    linear-gradient(90deg, rgba(140, 85, 20, 0.03) 1px, transparent 1px);
  background-size: 48px 48px;
  mask-image: linear-gradient(to bottom, black, transparent 80%);
}
a { color: var(--copper); text-decoration: none; transition: color 0.2s; }
a:hover { color: var(--heading); }
img { max-width: 100%; display: block; }
.hidden { display: none !important; }

.skip-link { position: absolute; left: -999px; top: 10px; background: #fff; padding: 10px; z-index: 99; border-radius: 8px; }
.skip-link:focus { left: 10px; }


.page-progress {
  position: fixed; top: 0; left: 0; right: 0; height: 3px; z-index: 100;
  background: transparent;
}
.page-progress span {
  display: block; height: 100%; width: 0%;
  background: linear-gradient(90deg, var(--heading), var(--gold), var(--teal));
  transition: width 0.08s linear;
  border-radius: 0 2px 2px 0;
}


.living-bg {
  display: none; 
  position: fixed; inset: 0; z-index: -3; pointer-events: none; overflow: hidden;
}
.living-bg i {
  position: absolute; width: 6px; height: 6px; border-radius: 50%;
  background: rgba(212, 160, 58, 0.5);
  box-shadow: 0 0 20px rgba(212, 160, 58, 0.4);
  animation: floatDust 16s ease-in-out infinite;
}
.living-bg i:nth-child(1) { left: 6%; top: 15%; animation-delay: -1s; }
.living-bg i:nth-child(2) { left: 15%; top: 70%; animation-delay: -4s; }
.living-bg i:nth-child(3) { left: 28%; top: 35%; animation-delay: -8s; }
.living-bg i:nth-child(4) { left: 40%; top: 80%; animation-delay: -3s; }
.living-bg i:nth-child(5) { left: 52%; top: 15%; animation-delay: -6s; }
.living-bg i:nth-child(6) { left: 65%; top: 58%; animation-delay: -10s; }
.living-bg i:nth-child(7) { left: 75%; top: 25%; animation-delay: -5s; }
.living-bg i:nth-child(8) { left: 85%; top: 72%; animation-delay: -2s; }
.living-bg i:nth-child(9) { left: 92%; top: 40%; animation-delay: -7s; }
.living-bg i:nth-child(10) { left: 10%; top: 50%; background: rgba(26, 107, 111, 0.3); animation-delay: -9s; }
.living-bg i:nth-child(11) { left: 60%; top: 44%; background: rgba(184, 101, 14, 0.35); animation-delay: -12s; }
.living-bg i:nth-child(12) { left: 35%; top: 8%; background: rgba(92, 45, 10, 0.25); animation-delay: -11s; }
@keyframes floatDust {
  0%, 100% { transform: translate3d(0, 0, 0) scale(0.7); opacity: 0.15; }
  50% { transform: translate3d(20px, -60px, 0) scale(1.3); opacity: 0.6; }
}


.legacy-pulse {
  display: none; 
  position: fixed; right: 24px; bottom: 24px; width: 12px; height: 12px;
  border-radius: 50%; z-index: 30; background: var(--gold);
  box-shadow: 0 0 0 0 rgba(212, 160, 58, 0.5);
  animation: pulse 3s infinite;
}
@keyframes pulse {
  70% { box-shadow: 0 0 0 16px rgba(212, 160, 58, 0); }
  100% { box-shadow: 0 0 0 0 rgba(212, 160, 58, 0); }
}


.topbar {
  position: sticky; top: 0; z-index: 60;
  display: flex; align-items: center; justify-content: space-between;
  gap: 16px;
  padding: 12px clamp(16px, 4vw, 56px);
  background: linear-gradient(120deg,
    rgba(255, 250, 240, 0.88) 0%,
    rgba(255, 250, 240, 0.88) 42%,
    rgba(212, 160, 58, 0.32) 50%,
    rgba(255, 250, 240, 0.88) 58%,
    rgba(255, 250, 240, 0.88) 100%);
  background-size: 260% 100%;
  animation: topbarShine 9s ease-in-out infinite;
  backdrop-filter: blur(20px) saturate(1.2);
  border-bottom: 1px solid var(--line);
  transition: box-shadow 0.3s;
}
.topbar.scrolled { box-shadow: 0 4px 30px rgba(30, 15, 0, 0.08); }
@keyframes topbarShine {
  0%, 100% { background-position: 160% 0; }
  50% { background-position: -60% 0; }
}
.brand { display: flex; align-items: center; gap: 10px; text-decoration: none; }
.brand-text { display: grid; line-height: 1.1; }
.brand strong { font-family: var(--font-display); font-size: 25px; color: var(--heading); font-weight: 700; }
.brand em { font-size: 14px; font-style: normal; color: var(--muted); letter-spacing: 0.18em; text-transform: uppercase; font-weight: 500; }
.nav-links { display: flex; align-items: center; gap: 4px; }
.nav-links a {
  padding: 8px 14px; text-decoration: none; border-radius: 999px;
  font-size: 16px; font-weight: 700; color: var(--text);
  text-shadow: 0 0 8px rgba(212, 160, 58, 0.16);
  transition: all 0.2s var(--ease), text-shadow 0.3s var(--ease);
}
.nav-links a:hover, .nav-links a.active {
  background: rgba(212, 160, 58, 0.16); color: var(--heading);
  transform: translateY(-1px);
  text-shadow: 0 0 12px rgba(212, 160, 58, 0.65), 0 0 3px rgba(212, 160, 58, 0.5);
}
.admin-link { border: 1px solid var(--line); }
.nav-exit-btn {
  border: 1px solid var(--line); border-radius: 999px; padding: 8px 14px;
  font-size: 16px; font-weight: 700; background: rgba(255, 255, 255, 0.7);
  color: var(--rose); cursor: pointer; transition: all 0.2s;
}
.nav-exit-btn:hover { background: var(--rose); color: #fff; }
.menu-toggle {
  display: none; border: 1px solid var(--line); border-radius: 12px;
  background: #fff; padding: 10px; cursor: pointer; flex-direction: column; gap: 4px;
  width: 42px; height: 42px; align-items: center; justify-content: center;
}
.menu-toggle span {
  display: block; width: 20px; height: 2px; background: var(--heading);
  border-radius: 2px; transition: all 0.3s;
}



h1, h2, h3 {
  font-family: var(--font-display); color: var(--heading);
  line-height: 1.05; letter-spacing: -0.02em; margin: 0;
}
h1 { font-size: clamp(51px, 8vw, 113px); margin-bottom: 16px; }
h2 { font-size: clamp(39px, 5.5vw, 75px); margin-bottom: 14px; }
.heading-accent { color: var(--heading-strong); font-weight: 700; text-align: center; }
h3 { font-size: clamp(29px, 3.5vw, 51px); margin-bottom: 10px; }
h4 { font-size: 21px; margin: 0 0 10px; color: var(--ink); font-weight: 700; font-family: var(--font-body); }
.eyebrow {
  color: var(--copper); font-size: 15px; font-weight: 900;
  text-transform: uppercase; letter-spacing: 0.22em; margin: 0 0 8px;
  font-family: var(--font-body);
}
.lede, .section-heading p, .screen > p, .hero-layout p, .card p {
  color: var(--muted); font-size: 22px; line-height: 1.75;
}
.lede-italic { font-style: italic; font-family: var(--font-display); font-size: clamp(23px, 2.4vw, 27px); line-height: 1.8; }
.section-quote { font-style: italic; color: var(--text); opacity: 0.85; }
.name-accent { color: var(--heading); font-weight: 600; }


.button-row { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 24px; }
.button-row.center { justify-content: center; }
.btn {
  border: 1px solid var(--line); border-radius: 999px;
  padding: 12px 24px; font-weight: 700; font-size: 17px;
  text-decoration: none; cursor: pointer; font-family: var(--font-body);
  display: inline-flex; align-items: center; justify-content: center;
  transition: all 0.25s var(--ease); position: relative; overflow: hidden;
}
.btn:hover { transform: translateY(-2px); box-shadow: var(--soft); }
.btn:active { transform: translateY(0) scale(0.98); }
.btn.primary {
  background: linear-gradient(135deg, var(--heading), var(--copper));
  color: #fff; border-color: transparent;
}
.btn.primary:hover { box-shadow: 0 12px 36px rgba(92, 45, 10, 0.3); }
.btn.secondary {
  background: linear-gradient(135deg, var(--copper), var(--gold));
  color: #fff; border-color: transparent;
  text-shadow: 0 1px 2px rgba(60, 30, 0, 0.35);
}
.btn.secondary:hover { box-shadow: 0 12px 36px rgba(184, 101, 14, 0.35); }
.btn.ghost { background: var(--peacock); color: #fff; border-color: transparent; }
.btn.ghost:hover { background: var(--peacock-dark); color: #fff; box-shadow: 0 12px 36px rgba(0, 95, 127, 0.3); }
.btn.full { width: 100%; margin-top: 14px; }


.btn, .virtue-btn, .tab, .help-toggle, .tour-actions button, .nav-exit-btn, .filter-chip {
  position: relative; overflow: hidden;
  text-shadow: 0 1px 0 rgba(255, 240, 196, 0.7);
}
.btn::after, .virtue-btn::after, .tab::after, .help-toggle::after,
.tour-actions button::after, .nav-exit-btn::after, .filter-chip::after {
  content: ""; position: absolute; inset: -50% auto -50% -30%;
  width: 30%; background: linear-gradient(90deg, transparent, rgba(212, 160, 58, 0.5), transparent);
  transform: translateX(0) rotate(25deg);
  animation: sweep 5.4s cubic-bezier(0.45, 0, 0.55, 1) infinite;
  will-change: transform;
  pointer-events: none;
}

@keyframes sweep {
  0%, 60% { transform: translateX(0) rotate(25deg); }
  100%    { transform: translateX(533%) rotate(25deg); }
}
.btn:hover, .btn.active, .virtue-btn:hover, .virtue-btn.active,
.tab:hover, .tab.active, .help-toggle:hover, .tour-actions button:hover,
.nav-exit-btn:hover, .filter-chip:hover, .filter-chip.active {
  text-shadow: 0 0 12px rgba(212, 160, 58, 0.6), 0 0 3px rgba(212, 160, 58, 0.45);
}


.screen {
  min-height: 100vh; padding: clamp(60px, 8vw, 100px) clamp(16px, 5vw, 72px);
  scroll-margin-top: var(--topbar-h, 70px);
  position: relative;
}
.section-panel { border-bottom: 1px solid rgba(140, 85, 20, 0.06); }
#guest-tribute.screen { min-height: auto; }


.section-inner {
  max-width: 1200px; margin: 0 auto; width: 100%;
}
.section-inner.subsection-style {
  max-width: 1200px; margin: 0 auto; width: 100%;
}

.section-heading { text-align: center; max-width: 900px; margin: 0 auto 36px; }
.animated-heading h2::after, .animated-heading h3::after {
  content: ""; display: block; width: 0; height: 3px;
  border-radius: 99px; background: linear-gradient(90deg, var(--heading), var(--gold), var(--teal));
  margin: 14px auto 0; transition: width 0.8s var(--ease);
}
.in-view .animated-heading h2::after, .in-view .animated-heading h3::after,
.animated-heading.in-view h2::after, .animated-heading.in-view h3::after { width: 100px; }
.subsection { max-width: 1200px; margin: 80px auto 0; }
.subsection-style .hero-layout,
.subsection-style .timeline,
.subsection-style .virtue-controls,
.subsection-style .parent-grid,
.subsection-style .dossier-shell,
.subsection-style .filter-bar,
.subsection-style .gallery-filters,
.subsection-style .approved-grid,
.subsection-style .gallery-grid,
.subsection-style .tribute-form { max-width: 1200px; margin-left: auto; margin-right: auto; }


.sacred-screen, .thanks-screen {
  display: grid; place-items: center; text-align: center;
  align-content: center; position: relative; overflow: hidden;
}
.sacred-content { position: relative; z-index: 2; }
.shree-emblem-wrap {
  position: relative; display: flex; align-items: center; justify-content: center;
  width: clamp(64px, 9vw, 104px); height: clamp(64px, 9vw, 104px); margin: 0 auto 16px;
}
.shree-emblem {
  display: block; width: 100%; height: 100%; object-fit: contain;
  animation: shreeGlow 3.2s ease-in-out infinite;
}
.shree-emblem-wrap::before, .shree-emblem-wrap::after {
  content: ""; position: absolute; width: 10px; height: 10px; border-radius: 50%;
  background: radial-gradient(circle, rgba(255, 244, 210, 0.95) 0%, rgba(212, 160, 58, 0.45) 45%, transparent 72%);
  pointer-events: none; animation: shreeSparkle 2.6s ease-in-out infinite;
}
.shree-emblem-wrap::before { top: -2px; right: 4px; animation-delay: 0s; }
.shree-emblem-wrap::after { bottom: 2px; left: -4px; width: 7px; height: 7px; animation-delay: 1.3s; }
@keyframes shreeGlow {
  0%, 100% { filter: drop-shadow(0 0 4px rgba(212, 160, 58, 0.35)) drop-shadow(0 0 10px rgba(212, 160, 58, 0.15)); }
  50% { filter: drop-shadow(0 0 16px rgba(212, 160, 58, 0.85)) drop-shadow(0 0 30px rgba(255, 220, 150, 0.45)); }
}
@keyframes shreeSparkle {
  0%, 100% { opacity: 0; transform: scale(0.35); }
  50% { opacity: 1; transform: scale(1); }
}
.split-title { position: relative; z-index: 1; }

.sacred-content h1, .sacred-content h2 {
  font-size: clamp(39px, 5.5vw, 75px);
}

.sacred-content h1::after, .sacred-content h2::after {
  content: ""; display: block; width: 0; height: 3px;
  border-radius: 99px; background: linear-gradient(90deg, var(--heading), var(--gold), var(--teal));
  margin: 14px auto 0; transition: width 0.8s var(--ease);
}
.in-view .sacred-content h1::after, .in-view .sacred-content h2::after { width: 100px; }

.sacred-content .eyebrow {
  font-size: 20px;
  color: var(--muted);
}

.section-heading p.lede-italic {
  font-size: clamp(23px, 2.4vw, 27px);
  color: var(--muted);
}

@media (min-width: 760px) {
  .split-title { white-space: normal; }
}
@media (min-width: 900px) {
  #academic .section-heading { max-width: 100%; }
  #academic .section-heading h3 { white-space: nowrap; }
}

#foundation .section-heading h2, #help .section-heading h2 {
  font-size: clamp(29px, 3.5vw, 51px);
}
@media (min-width: 900px) {
  #foundation .section-heading, #help .section-heading { max-width: 1000px; }
  #foundation .section-heading h2, #help .section-heading h2 { white-space: nowrap; }
}


.concentric-rings {
  position: absolute; inset: 0; display: grid; place-items: center;
  pointer-events: none; z-index: 0;
}
.ring {
  position: absolute; border-radius: 50%;
  border: 1.5px solid transparent; opacity: 0.6;
}
.ring-1 {
  width: min(90vw, 800px); height: min(90vw, 800px);
  border-color: rgba(212, 160, 58, 0.25);
  animation: spinCW 28s linear infinite;
  box-shadow: 0 0 20px rgba(212, 160, 58, 0.08) inset;
}
.ring-2 {
  width: min(72vw, 640px); height: min(72vw, 640px);
  border-color: rgba(26, 107, 111, 0.3);
  animation: spinCCW 22s linear infinite;
  box-shadow: 0 0 16px rgba(26, 107, 111, 0.08) inset;
}
.ring-3 {
  width: min(54vw, 480px); height: min(54vw, 480px);
  border-color: rgba(184, 101, 14, 0.28);
  animation: spinCW 18s linear infinite;
  box-shadow: 0 0 14px rgba(184, 101, 14, 0.06) inset;
}
.ring-4 {
  width: min(36vw, 320px); height: min(36vw, 320px);
  border-color: rgba(212, 160, 58, 0.35);
  animation: spinCCW 14s linear infinite;
  box-shadow: 0 0 12px rgba(212, 160, 58, 0.1) inset;
}
.ring-5 {
  width: min(18vw, 160px); height: min(18vw, 160px);
  border-color: rgba(26, 107, 111, 0.4);
  animation: spinCW 10s linear infinite;
  box-shadow: 0 0 10px rgba(26, 107, 111, 0.12) inset;
}

.ring-1 { border-style: solid; }
.ring-2 { border-style: dashed; border-width: 1px; }
.ring-3 { border-style: solid; border-width: 2px; }
.ring-4 { border-style: dotted; border-width: 1.5px; }
.ring-5 { border-style: solid; border-width: 2px; }

@keyframes spinCW { to { transform: rotate(360deg); } }
@keyframes spinCCW { to { transform: rotate(-360deg); } }


.sparkle-field {
  display: none; 
  position: absolute; inset: 0; pointer-events: none;
}
.sparkle-field i {
  position: absolute; width: 5px; height: 5px; border-radius: 50%;
  animation: sparkleFloat 4s ease-in-out infinite;
}
.sparkle-field i:nth-child(1) { left: 15%; top: 20%; background: rgba(212, 160, 58, 0.8); animation-delay: 0s; }
.sparkle-field i:nth-child(2) { left: 80%; top: 15%; background: rgba(26, 107, 111, 0.8); animation-delay: 0.3s; }
.sparkle-field i:nth-child(3) { left: 45%; top: 10%; background: rgba(184, 101, 14, 0.7); animation-delay: 0.6s; }
.sparkle-field i:nth-child(4) { left: 25%; top: 75%; background: rgba(212, 160, 58, 0.9); animation-delay: 0.9s; }
.sparkle-field i:nth-child(5) { left: 70%; top: 80%; background: rgba(26, 107, 111, 0.7); animation-delay: 1.2s; }
.sparkle-field i:nth-child(6) { left: 55%; top: 85%; background: rgba(184, 101, 14, 0.8); animation-delay: 1.5s; }
.sparkle-field i:nth-child(7) { left: 10%; top: 50%; background: rgba(212, 160, 58, 0.6); animation-delay: 1.8s; width: 4px; height: 4px; }
.sparkle-field i:nth-child(8) { left: 90%; top: 45%; background: rgba(26, 107, 111, 0.6); animation-delay: 2.1s; width: 4px; height: 4px; }
.sparkle-field i:nth-child(9) { left: 35%; top: 30%; background: rgba(255, 215, 0, 0.7); animation-delay: 2.4s; width: 3px; height: 3px; }
.sparkle-field i:nth-child(10) { left: 60%; top: 65%; background: rgba(255, 140, 0, 0.6); animation-delay: 2.7s; width: 3px; height: 3px; }
.sparkle-field i:nth-child(11) { left: 20%; top: 40%; background: rgba(0, 206, 209, 0.5); animation-delay: 3.0s; width: 6px; height: 6px; }
.sparkle-field i:nth-child(12) { left: 75%; top: 35%; background: rgba(255, 165, 0, 0.6); animation-delay: 3.3s; width: 6px; height: 6px; }

@keyframes sparkleFloat {
  0%, 100% { opacity: 0.2; transform: scale(0.5) translateY(0); }
  25% { opacity: 1; transform: scale(1.4) translateY(-8px); box-shadow: 0 0 8px currentColor; }
  50% { opacity: 0.6; transform: scale(0.8) translateY(4px); }
  75% { opacity: 1; transform: scale(1.2) translateY(-4px); box-shadow: 0 0 12px currentColor; }
}


.card, .dossier-shell, .dedication-strip, .preview-state, .tribute-form {
  background: var(--panel);
  border: 1px solid rgba(255, 245, 220, 0.8);
  border-radius: var(--radius);
  box-shadow: var(--soft);
  padding: 28px;
  backdrop-filter: blur(12px);
  position: relative; overflow: hidden;
  transition: transform 0.3s var(--ease), box-shadow 0.3s var(--ease);
}
.card::before {
  content: ""; position: absolute; inset: 0 0 auto; height: 3px;
  background: linear-gradient(90deg, var(--heading), var(--gold), var(--teal));
  opacity: 0.8;
}
.card:hover { transform: translateY(-3px); box-shadow: var(--shadow); }


.foundation-shell {
  display: grid; grid-template-columns: 220px 1fr; gap: 32px;
  align-items: start; background: var(--panel); border: 1px solid rgba(255, 245, 220, 0.8);
  border-radius: var(--radius); box-shadow: var(--soft); padding: 32px;
  position: relative; overflow: hidden;
}
.foundation-shell::before {
  content: ""; position: absolute; inset: 0 0 auto; height: 3px;
  background: linear-gradient(90deg, var(--heading), var(--gold), var(--teal));
}
.foundation-photo {
  width: 100%; border-radius: 18px;
  box-shadow: 0 12px 30px rgba(30, 15, 0, 0.15);
}
.foundation-role { color: var(--copper); font-weight: 700; font-size: 17px; text-transform: uppercase; letter-spacing: 0.1em; }
.foundation-highlights {
  display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; margin-top: 20px;
}
.foundation-highlights span {
  padding: 12px 14px; border-radius: var(--radius-sm);
  background: rgba(26, 107, 111, 0.06); border: 1px solid rgba(26, 107, 111, 0.12);
}
.foundation-highlights b { display: block; color: var(--heading); font-size: 17px; }
.foundation-highlights small { color: var(--muted); font-size: 15px; }


.hero-layout {
  display: grid; grid-template-columns: 1.1fr 0.9fr; gap: 40px;
  align-items: center; max-width: 1200px; margin: 0 auto;
}
.legacy-narrative { font-size: 20px; line-height: 1.8; color: var(--text); }
.portrait-card {
  min-height: 400px; border-radius: 32px;
  background: linear-gradient(150deg, #2a1508 0%, #4a2510 45%, #1a6b6f 100%);
  color: var(--cream); display: grid; place-items: center;
  padding: 32px; box-shadow: 0 34px 80px rgba(30, 15, 0, 0.25);
  position: relative; overflow: hidden;
}
.portrait-card::before {
  content: ""; position: absolute; inset: 20px;
  border: 1px solid rgba(255, 250, 240, 0.2); border-radius: 24px;
}
.portrait-card::after {
  content: ""; position: absolute; width: 200px; height: 200px;
  border-radius: 50%; border: 1px solid rgba(255, 250, 240, 0.12);
  animation: orbital 14s linear infinite;
}
@keyframes orbital { to { transform: rotate(1turn); } }


.portrait-card.portrait-card-fullimg {
  
  padding: 9px;
  min-height: 0;
  border-radius: 12px;
  display: block;
  position: relative;
  overflow: visible;
  background:
    repeating-linear-gradient(90deg, rgba(92,45,10,0.30) 0 2px, transparent 2px 8px),
    linear-gradient(160deg, #5c2d0a, #8b4513 55%, #5c2d0a);
  box-shadow:
    inset 0 0 0 1px rgba(255, 226, 160, 0.55),
    0 0 0 1px rgba(120, 70, 12, 0.55);
}
.portrait-card.portrait-card-fullimg picture {
  
  display: block; position: relative; overflow: hidden;
  border-radius: 7px; background: #24120a;
  box-shadow: inset 0 0 26px rgba(0, 0, 0, 0.55);
}
.temple-img-full {
  position: static; inset: auto;
  display: block; width: 100%; height: 100%;
  aspect-ratio: 3 / 2; object-fit: cover;
  border-radius: 0;
}

.portrait-card.portrait-card-fullimg::before,
.portrait-card.portrait-card-fullimg::after,
.portrait-card.portrait-card-fullimg picture::before,
.portrait-card.portrait-card-fullimg picture::after {
  content: ""; display: block; position: absolute;
  width: 26px; height: 26px; pointer-events: none; z-index: 2;
  border-color: rgba(255, 245, 210, 0.9); border-style: solid; border-width: 0;
}
.portrait-card.portrait-card-fullimg picture::before {
  top: 5px; left: 5px;  border-top-width: 3px; border-left-width: 3px;  border-top-left-radius: 14px;
}
.portrait-card.portrait-card-fullimg picture::after {
  top: 5px; right: 5px; border-top-width: 3px; border-right-width: 3px; border-top-right-radius: 14px;
}
.portrait-card.portrait-card-fullimg::before {
  bottom: 14px; left: 14px;  border-bottom-width: 3px; border-left-width: 3px;  border-bottom-left-radius: 14px;
}
.portrait-card.portrait-card-fullimg::after {
  bottom: 14px; right: 14px; border-bottom-width: 3px; border-right-width: 3px; border-bottom-right-radius: 14px;
  width: 26px; height: 26px; border-radius: 0 0 14px 0;
  animation: none;
}

.temple-img {
  width: min(340px, 80%); border-radius: 22px; opacity: 0.92;
  box-shadow: 0 20px 50px rgba(0, 0, 0, 0.3);
}


.timeline {
  position: relative; display: grid; gap: 16px; counter-reset: story;
  padding-left: 40px;
}
.timeline::before {
  content: ""; position: absolute; left: 14px; top: 0; bottom: 0;
  width: 3px; background: linear-gradient(var(--heading), var(--gold), var(--teal));
  opacity: 0.2; border-radius: 99px;
}
.timeline::after {
  content: ""; position: absolute; left: 14px; top: 0; width: 3px;
  height: var(--timeline-progress, 0%);
  background: linear-gradient(var(--heading), var(--gold), var(--teal));
  box-shadow: 0 0 14px rgba(184, 101, 14, 0.5);
  border-radius: 99px; transition: height 0.4s var(--ease);
}
.timeline-item {
  counter-increment: story; position: relative;
  padding: 20px 24px; background: var(--panel);
  border: 1px solid rgba(255, 245, 220, 0.8);
  border-radius: 20px; box-shadow: var(--soft);
  transition: all 0.3s var(--ease);
}
.tl-marker {
  position: absolute; left: -40px; top: 22px; width: 28px; height: 28px;
  border-radius: 50%; background: linear-gradient(135deg, var(--heading), var(--gold));
  display: grid; place-items: center; box-shadow: 0 0 0 5px rgba(212, 160, 58, 0.15);
}
.tl-marker::after {
  content: counter(story); color: #fff; font-size: 15px; font-weight: 900;
}
.tl-content strong { color: var(--heading); font-size: 21px; font-family: var(--font-display); }
.tl-content p { margin: 6px 0; }
.timeline-item button {
  border: 1px solid var(--line); border-radius: 999px; padding: 8px 16px;
  background: rgba(255, 255, 255, 0.7); color: var(--teal); font-weight: 700;
  cursor: pointer; font-size: 16px; transition: all 0.2s;
}
.timeline-item button:hover {
  background: var(--teal); color: #fff; border-color: transparent;
}
.timeline-item.active, .timeline-item:hover {
  transform: translateX(4px); border-color: rgba(212, 160, 58, 0.3);
  box-shadow: var(--shadow);
}
.story-copy {
  block-size: 0; overflow: hidden; opacity: 0;
  transition: block-size 0.5s var(--ease), opacity 0.4s, margin 0.4s;
  margin-top: 0; color: var(--text); font-size: 18px; line-height: 1.7;
  padding: 18px 26px !important; box-sizing: border-box !important;
  max-width: 100%; overflow-wrap: break-word; word-break: break-word;
}
.timeline-item.story-open .story-copy {
  block-size: auto; opacity: 1; margin-top: 12px;
}
.tl-reflection-strong {
  color: var(--heading);
}
.tl-reflection-strong strong {
  font-weight: 700;
}
.tl-edu-columns {
  display: flex; flex-wrap: wrap; gap: 20px; margin-top: 12px;
}
.tl-edu-col {
  flex: 1 1 200px; min-width: 180px;
}
@media (max-width: 480px) {
  .tl-edu-columns { flex-direction: column; gap: 10px; }
}


.tl-content { display: flex; gap: 20px; align-items: flex-start; }
.tl-main { flex: 1 1 auto; min-width: 0; }
.tl-head {
  display: flex; align-items: baseline; flex-wrap: wrap;
  gap: 6px 12px; margin-bottom: 8px;
}
.tl-quote {
  margin: 8px 0 10px; padding: 4px 0 4px 14px;
  border-left: 3px solid var(--gold);
  font-family: var(--font-display); font-style: italic;
  font-size: 21px; line-height: 1.4; color: var(--heading);
}
.tl-people {
  block-size: 0; overflow: hidden; opacity: 0; margin: 0;
  font-size: 17px; line-height: 1.6; color: var(--muted);
  transition: block-size 0.4s var(--ease), opacity 0.35s, margin 0.35s;
}
.tl-people strong { color: var(--text); font-weight: 700; font-family: var(--font-body); }
.timeline-item.story-open .tl-people {
  block-size: auto; opacity: 1; margin: 0 0 12px;
}
.tl-photo, .tl-photo-cluster, .tl-photo-stack, .tl-photo-grid {
  display: none;
}
.timeline-item.story-open .tl-photo,
.timeline-item.story-open .tl-photo-cluster {
  display: block;
}
.timeline-item.story-open .tl-photo-stack {
  display: flex;
}
.timeline-item.story-open .tl-photo-grid {
  display: grid;
}
.tl-photo {
  flex: 0 0 132px; width: 132px; margin: 0; text-align: center;
}
.tl-photo img {
  width: 132px; height: 132px; object-fit: cover; object-position: center;
  border-radius: 14px; border: 2px solid rgba(212, 160, 58, 0.45);
  background: linear-gradient(135deg, rgba(255,248,232,0.9), rgba(240,220,170,0.5));
  padding: 6px; box-shadow: var(--soft);
}
.tl-photo figcaption {
  margin-top: 6px; font-size: 14px; line-height: 1.35; color: var(--muted);
  font-style: italic;
}
@media (max-width: 720px) {
  .tl-content { flex-direction: column-reverse; }
  .tl-photo { flex: 0 0 auto; width: 100%; }
  .tl-photo img { width: 108px; height: 108px; }
}


.tl-photo-cluster {
  position: relative;
  flex: 0 0 150px;
  width: 150px;
  min-height: 400px;
  margin: 0 auto;
}
.tl-photo-cluster--pair {
  min-height: 270px;
}
.tl-photo-cluster--marriage {
  
  width: 240px; flex: 0 0 240px; min-height: 290px;
}
.tl-photo-cluster--career {
  min-height: 830px;
}
.tl-photo-stack {
  flex: 0 0 260px; width: 260px;
  display: flex; flex-direction: column; gap: 12px;
}
.tl-photo-fill {
  width: 260px; aspect-ratio: 260 / 185; margin: 0; flex: none;
  border-radius: 16px; overflow: hidden; position: relative;
  border: 2px solid rgba(212, 160, 58, 0.5); box-shadow: var(--soft);
}
.tl-photo-fill img {
  display: block; width: 100%; height: 100%; object-fit: cover; object-position: center;
}
.tl-photo-fill figcaption {
  position: absolute; left: 0; right: 0; bottom: 0;
  padding: 6px 12px; font-size: 14px; font-style: italic; color: #fff;
  background: linear-gradient(transparent, rgba(0, 0, 0, 0.55));
}
@media (max-width: 720px) {
  .tl-photo-stack { width: 100%; }
  .tl-photo-fill { width: 100%; height: auto; aspect-ratio: 260 / 185; }
}
.tl-thread {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  z-index: 0;
  pointer-events: none;
}
.tl-thread-line {
  fill: none;
  stroke: var(--gold);
  stroke-width: 2;
  stroke-linecap: round;
  stroke-dasharray: 1 5;
  opacity: 0.85;
  filter: drop-shadow(0 0 2px rgba(212, 160, 58, 0.5));
}
.tl-thread-bead {
  fill: var(--gold);
  filter: drop-shadow(0 0 2px rgba(212, 160, 58, 0.65));
}
.tl-thread-tip {
  position: absolute; left: 50%; transform: translateX(-50%);
  color: var(--gold); font-size: 18px; line-height: 1; z-index: 2;
  text-shadow: 0 0 5px rgba(212, 160, 58, 0.55);
}
.tl-thread-tip--top { top: -16px; }
.tl-photo-item {
  position: absolute;
  left: calc(50% + var(--x));
  top: var(--t);
  margin: 0;
  z-index: 1;
  transform: translateX(-50%) rotate(var(--r));
  transition: transform 0.3s ease, z-index 0.3s ease;
}
.tl-photo-item:hover { transform: translateX(-50%) rotate(0deg) scale(1.1); z-index: 3; }
.tl-photo-item img {
  width: var(--s, 100px); height: var(--s, 100px); object-fit: cover; object-position: center;
  border-radius: 12px; border: 2px solid rgba(212, 160, 58, 0.5);
  background: linear-gradient(135deg, rgba(255,248,232,0.9), rgba(240,220,170,0.5));
  padding: 5px; box-shadow: var(--soft);
}
.tl-photo-item--round img { border-radius: 50%; padding: 4px; }
.tl-photo-item--landscape img { width: var(--w); height: var(--h); border-radius: 14px; }


.tl-content--stacked {
  flex-direction: column;
}
.tl-content--stacked .tl-main {
  flex: 1 1 auto; width: 100%;
}


.tl-photo-grid {
  grid-template-columns: repeat(5, 1fr);
  gap: 10px; width: 100%; margin-top: 16px;
}
.tl-grid-thumb {
  padding: 0; border: 2px solid rgba(212, 160, 58, 0.4); border-radius: 10px;
  overflow: hidden; cursor: zoom-in; background: none; aspect-ratio: 1;
  transition: all 0.2s var(--ease);
}
.tl-grid-thumb:hover {
  border-color: var(--gold); transform: translateY(-3px); box-shadow: var(--soft);
}
.tl-grid-thumb img {
  width: 100%; height: 100%; object-fit: cover; object-position: center; display: block;
}
@media (max-width: 900px) {
  .tl-photo-grid { grid-template-columns: repeat(4, 1fr); }
}
@media (max-width: 720px) {
  .tl-photo-grid { grid-template-columns: repeat(3, 1fr); gap: 8px; }
}
@media (max-width: 480px) {
  .tl-photo-grid { grid-template-columns: repeat(2, 1fr); }
}
.tl-cluster-caption {
  position: absolute; bottom: -22px; left: 0; right: 0;
  text-align: center; font-size: 14px; font-style: italic; color: var(--muted);
}
@media (max-width: 720px) {
  .tl-photo-cluster {
    width: 100%; min-height: auto; margin: 0 0 26px;
    justify-content: center; align-items: flex-end; gap: 14px;
  }
  .timeline-item.story-open .tl-photo-cluster { display: flex; }
  .tl-thread, .tl-thread-tip { display: none; }
  .tl-photo-item { position: static; transform: rotate(var(--r)); }
  .tl-photo-item:hover { transform: rotate(0deg) scale(1.06); }
  .tl-photo-item img { width: 84px !important; height: 84px !important; }
  .tl-cluster-caption { display: none; }
}


.virtue-controls {
  display: flex; flex-wrap: wrap; gap: 10px; justify-content: center; margin-bottom: 24px;
}
.virtue-btn {
  border: 1px solid var(--line); border-radius: 999px; padding: 10px 20px;
  background: rgba(255, 255, 255, 0.7); color: var(--heading);
  font-weight: 700; cursor: pointer; font-size: 17px; font-family: var(--font-body);
  transition: all 0.25s var(--ease);
}
.virtue-btn:hover { background: rgba(212, 160, 58, 0.12); transform: translateY(-2px); }
.virtue-btn.active {
  background: linear-gradient(135deg, var(--heading), var(--copper));
  color: #fff; border-color: transparent;
  box-shadow: 0 8px 24px rgba(92, 45, 10, 0.2);
}
.parent-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 20px; max-width: 1100px; margin: 0 auto; }
.parent-top { display: flex; gap: 14px; align-items: center; margin-bottom: 14px; }
.avatar-frame {
  width: 52px; height: 52px; border-radius: 16px; display: grid; place-items: center;
  background: linear-gradient(145deg, var(--heading), var(--copper));
  color: #fff; font: 700 24px var(--font-display);
  box-shadow: 0 8px 20px rgba(92, 45, 10, 0.2);
}
.virtue-panel {
  min-height: 60px; padding: 16px 0; color: var(--text); font-size: 18px; line-height: 1.7;
  transition: all 0.4s var(--ease);
}
.virtue-panel strong { display: block; color: var(--heading); margin-bottom: 8px; font-size: 19px; }
.virtue-placeholder { color: var(--muted); font-style: italic; }


.dossier-shell {
  max-width: 1100px; margin: 0 auto;
  
  background: none; border: none; box-shadow: none;
  padding: 0; backdrop-filter: none; overflow: visible;
}
.tabs { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; margin-bottom: 18px; }
.tab {
  border: 1px solid var(--line); background: rgba(255, 255, 255, 0.65);
  border-radius: 999px; padding: 9px 16px; font-weight: 700; font-size: 16px;
  color: var(--heading); cursor: pointer; font-family: var(--font-body);
  transition: all 0.2s var(--ease);
}
.tab:hover, .tab.active {
  background: linear-gradient(135deg, var(--heading), var(--copper));
  color: #fff; border-color: transparent; transform: translateY(-1px);
}
.tab-panel { transition: opacity 0.2s, transform 0.2s; }
.tab-panel.switching { opacity: 0; transform: translateY(8px); }
.academic-card .academic-detail { margin-top: 12px; }
.academic-card .academic-detail ul { padding-left: 18px; margin: 8px 0; }
.academic-card .academic-detail li { margin-bottom: 6px; color: var(--text); font-size: 18px; }


.expand-pub-table-btn {
  margin-top: 12px; font-size: 16px !important; padding: 8px 16px !important;
}
.pub-table-container { margin-top: 14px; }
.pub-table-scroll { overflow-x: auto; border-radius: 12px; border: 1px solid var(--line); }
.pub-table {
  width: 100%; border-collapse: collapse; font-size: 16px; min-width: 600px;
}
.pub-table th, .pub-table td {
  padding: 10px 12px; text-align: left; border-bottom: 1px solid var(--line);
  vertical-align: top;
}
.pub-table th {
  background: rgba(92, 45, 10, 0.06); color: var(--heading);
  font-weight: 700; font-size: 15px; text-transform: uppercase; letter-spacing: 0.05em;
  position: sticky; top: 0;
}
.pub-table tr:hover td { background: rgba(212, 160, 58, 0.05); }
.pub-table td { color: var(--text); }


.filter-bar, .gallery-filters {
  display: flex; align-items: center; justify-content: center;
  flex-wrap: wrap; gap: 10px; margin: 0 auto 24px;
}
.filter-chip {
  border: 1px solid transparent; background: var(--peacock);
  border-radius: 999px; padding: 9px 16px; font-weight: 700; font-size: 16px;
  color: #fff; cursor: pointer; font-family: var(--font-body);
  transition: all 0.2s var(--ease);
}
.filter-chip:hover, .filter-chip.active {
  background: var(--peacock-dark); color: #fff;
  border-color: var(--gold);
}
.filter-bar input {
  border: 1px solid var(--line); border-radius: 999px;
  background: rgba(255, 255, 255, 0.8); padding: 10px 16px;
  min-width: 200px; font-family: var(--font-body); font-size: 17px;
  outline: none; transition: border 0.2s, box-shadow 0.2s;
}
.filter-bar input:focus {
  border-color: var(--teal); box-shadow: 0 0 0 4px rgba(26, 107, 111, 0.1);
}
.approved-grid {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px;
}
.approved-grid article, .tribute-placeholder-card {
  background: var(--panel); border: 1px solid rgba(255, 245, 220, 0.8);
  border-radius: 20px; padding: 22px; box-shadow: var(--soft);
  position: relative; overflow: hidden; transition: transform 0.25s var(--ease);
}
.approved-grid article:hover { transform: translateY(-3px); }
.approved-grid article::before {
  content: "\201C"; position: absolute; right: 14px; top: -8px;
  font: 700 80px var(--font-display); color: rgba(212, 160, 58, 0.12);
}


.gallery-grid {
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px;
}
.gallery-card {
  position: relative; overflow: hidden; border-radius: 18px;
  border: 0; cursor: pointer; aspect-ratio: 1;
  background: linear-gradient(145deg, #2a1508, #1a6b6f);
  transition: transform 0.3s var(--ease), box-shadow 0.3s var(--ease);
}
.gallery-card:hover { transform: translateY(-4px) scale(1.02); box-shadow: var(--shadow); }
.gallery-card img {
  width: 100%; height: 100%; object-fit: cover;
  transition: transform 0.4s var(--ease), opacity 0.3s;
  opacity: 0.88;
}
.gallery-card:hover img { transform: scale(1.08); opacity: 1; }
.gallery-card span {
  position: absolute; bottom: 0; left: 0; right: 0; padding: 12px 14px;
  background: linear-gradient(transparent, rgba(0,0,0,0.7));
  color: #fff; font-weight: 700; font-size: 16px;
}


.tribute-form { max-width: 1100px; margin: 0 auto; }
.dedication-strip {
  display: flex; flex-wrap: wrap; align-items: center; gap: 12px;
  margin-bottom: 20px; padding: 20px; background: var(--panel);
  border: 1px solid rgba(255, 245, 220, 0.8); border-radius: var(--radius);
}
.dedication-strip strong { color: var(--heading); font-size: 17px; }
.radio-pill {
  display: flex; gap: 8px; align-items: center; padding: 8px 14px;
  border: 1px solid var(--line); border-radius: 999px;
  background: rgba(255, 255, 255, 0.6); font-weight: 600; font-size: 17px;
  cursor: pointer; transition: all 0.2s;
}
.radio-pill:has(input:checked) {
  background: rgba(212, 160, 58, 0.15); border-color: rgba(212, 160, 58, 0.4);
  box-shadow: 0 0 0 4px rgba(212, 160, 58, 0.06);
}
.radio-pill input { width: 16px; height: 16px; accent-color: var(--copper); }
.tribute-grid { display: grid; grid-template-columns: 1.2fr 0.8fr; gap: 20px; }
label { display: grid; gap: 6px; font-weight: 700; color: var(--heading); font-size: 17px; }
.field-row { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
input, textarea, select {
  width: 100%; border: 1px solid var(--line); border-radius: var(--radius-sm);
  padding: 12px 14px; background: rgba(255, 255, 255, 0.88); font: inherit;
  color: var(--text); outline: none; transition: border 0.2s, box-shadow 0.2s;
}
input:focus, textarea:focus, select:focus {
  border-color: var(--teal); box-shadow: 0 0 0 4px rgba(26, 107, 111, 0.08);
}
textarea { resize: vertical; }
.char-meter { height: 5px; border-radius: 99px; background: rgba(0,0,0,0.06); overflow: hidden; margin-top: 6px; }
.char-meter span { display: block; height: 100%; width: 0%; background: linear-gradient(90deg, var(--teal), var(--copper)); transition: width 0.2s; }
.upload-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-bottom: 14px; }
.upload-tile {
  min-height: 90px; border: 1px dashed rgba(140, 85, 20, 0.25);
  border-radius: 16px; background: rgba(255, 255, 255, 0.55);
  display: grid; place-items: center; text-align: center; cursor: pointer;
  transition: all 0.25s var(--ease); padding: 12px;
}
.upload-tile input { display: none; }
.upload-icon { font-size: 31px; }
.upload-tile em { font-style: normal; color: var(--muted); font-size: 15px; }
.upload-tile:hover, .upload-tile.selected {
  border-color: var(--teal); background: rgba(26, 107, 111, 0.06);
  transform: translateY(-2px);
}
.tracker-state { margin-bottom: 14px; }
.tracker-state[hidden], .tracker-line[hidden] { display: none !important; }
.tracker-line { display: grid; grid-template-columns: 40px 1fr 60px; gap: 10px; align-items: center; margin: 8px 0; }
.tracker-line span { font-weight: 700; color: var(--heading); font-size: 16px; }
.tracker-line em { font-style: normal; color: var(--muted); font-weight: 600; font-size: 15px; }
progress { width: 100%; height: 10px; accent-color: var(--teal); border-radius: 99px; }
.preview-state {
  margin-top: 20px; padding: 24px;
  background: linear-gradient(135deg, rgba(255, 250, 240, 0.9), rgba(255, 245, 220, 0.8));
}
.preview-state blockquote {
  margin: 12px 0; padding: 16px; border-left: 3px solid var(--copper);
  background: rgba(255, 255, 255, 0.6); border-radius: 14px; color: var(--text);
  font-style: italic;
}
.preview-files { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; margin-top: 12px; }
.preview-files span {
  padding: 10px; border-radius: 12px; background: rgba(255, 255, 255, 0.7);
  border: 1px solid var(--line); text-align: center; font-size: 16px; font-weight: 600;
}
.moderation-note { font-size: 16px; color: var(--muted); margin-top: 12px; }
.form-message {
  font-weight: 700; color: var(--teal); min-height: 24px; margin: 14px auto 0;
  max-width: 820px; line-height: 1.55;
}
.form-message:empty { display: none; min-height: 0; margin-top: 0; }
.form-message.is-success {
  display: block;
  position: relative;
  padding: 18px 22px 18px 58px;
  border: 1px solid rgba(78, 123, 45, .32);
  border-radius: 20px;
  color: #31551f;
  background: linear-gradient(180deg, rgba(247, 252, 237, .98), rgba(235, 246, 218, .96));
  box-shadow: 0 16px 38px rgba(67, 96, 36, .12);
}
.form-message.is-success::before {
  content: '\2713';
  position: absolute;
  left: 18px; top: 50%; transform: translateY(-50%);
  width: 28px; height: 28px; border-radius: 50%;
  display: grid; place-items: center;
  color: #fff; background: #5e7d34;
  box-shadow: 0 0 0 5px rgba(94, 125, 52, .12);
  font-size: 17px; font-weight: 900;
}
.form-message.is-error {
  display: block;
  padding: 14px 18px;
  border: 1px solid rgba(145, 72, 46, .28);
  border-radius: 16px;
  color: #7d351f;
  background: rgba(255, 245, 236, .96);
}
@media (max-width: 700px) {
  .form-message.is-success { padding: 16px 16px 16px 52px; border-radius: 16px; }
  .form-message.is-success::before { left: 15px; }
}


.help-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 18px; max-width: 1100px; margin: 0 auto; }
.help-head {
  display: flex; gap: 12px; align-items: center;
}
.card-icon {
  width: 38px; height: 38px; border-radius: 12px; display: grid; place-items: center;
  background: rgba(26, 107, 111, 0.1); color: var(--teal); font-weight: 900; flex-shrink: 0;
}
.help-toggle {
  margin-left: auto; border: 1px solid var(--line); border-radius: 999px;
  padding: 6px 14px; background: rgba(255, 255, 255, 0.7);
  font-weight: 700; font-size: 15px; cursor: pointer; color: var(--heading);
  transition: all 0.2s;
}
.help-toggle:hover { background: var(--heading); color: #fff; border-color: transparent; }
.help-body {
  block-size: 0; overflow: hidden; opacity: 0;
  transition: block-size 0.5s var(--ease), opacity 0.4s, padding 0.4s;
  padding-top: 0;
}
.help-card.is-open .help-body { block-size: auto; opacity: 1; padding-top: 16px; }
.help-body ol { padding-left: 18px; }
.help-body li { margin-bottom: 6px; font-size: 17px; }
details { padding: 10px 0; border-bottom: 1px solid var(--line); }
summary { cursor: pointer; color: var(--heading); font-weight: 700; font-size: 18px; }
details p { font-size: 17px; margin-top: 6px; }
.tour-map { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 14px; }
.tour-map span {
  padding: 6px 10px; border-radius: 999px; background: rgba(212, 160, 58, 0.1);
  border: 1px solid rgba(212, 160, 58, 0.2); font-size: 15px; font-weight: 700;
}
.support-note { margin-top: 12px; padding: 14px; background: rgba(26, 107, 111, 0.06); border-radius: 12px; font-size: 17px; }


.admin-login { max-width: 440px; margin: 0 auto; display: grid; gap: 14px; }
.admin-stats { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; max-width: 900px; margin: 0 auto 20px; }
@media (max-width: 620px) {
  .admin-stats { grid-template-columns: repeat(2, 1fr); }
}
.admin-stats article {
  padding: 16px; border-radius: 18px; background: rgba(255, 255, 255, 0.7);
  border: 1px solid var(--line); text-align: center;
}
.admin-stats strong { display: block; font: 700 30px var(--font-display); color: var(--heading); }
.admin-filter-bar { max-width: 1100px; }
.admin-tributes { display: grid; grid-template-columns: repeat(2, 1fr); gap: 14px; max-width: 1100px; margin: 0 auto; }
.admin-tribute {
  background: var(--panel); border: 1px solid rgba(255, 245, 220, 0.8);
  border-radius: 20px; padding: 20px; transition: transform 0.2s;
}
.admin-tribute:hover { transform: translateY(-2px); }
.admin-tribute .actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; }
.admin-tribute .actions button {
  border: 1px solid var(--line); border-radius: 999px; padding: 6px 12px;
  background: #fff; cursor: pointer; font-weight: 700; font-size: 15px;
  transition: all 0.2s;
}
.admin-tribute .actions button[data-action="approved"] { color: var(--teal); }
.admin-tribute .actions button[data-action="approved"]:hover { background: var(--teal); color: #fff; }
.admin-tribute .actions button[data-action="rejected"] { color: var(--rose); }
.admin-tribute .actions button[data-action="rejected"]:hover { background: var(--rose); color: #fff; }
.admin-tribute .actions button[data-action="delete"]:hover { background: #333; color: #fff; }

.admin-vis { display: block; margin-top: 3px; font-size: 13px; font-weight: 700; }
.admin-vis.is-shown  { color: var(--teal); }
.admin-vis.is-hidden { color: var(--rose); }
.admin-tribute .actions button[data-action="hide"] { color: var(--rose); }
.admin-tribute .actions button[data-action="hide"]:hover { background: var(--rose); color: #fff; }
.admin-tribute .actions button[data-action="show"] { color: var(--teal); }
.admin-tribute .actions button[data-action="show"]:hover { background: var(--teal); color: #fff; }


.modal {
  border: 0; border-radius: 24px; padding: 28px;
  box-shadow: 0 40px 120px rgba(0,0,0,0.35); background: var(--cream);
  max-width: min(700px, 92vw); color: var(--text);
}
.modal::backdrop { background: rgba(20, 10, 0, 0.6); backdrop-filter: blur(10px); }
.modal-close {
  position: absolute; top: 14px; right: 14px; border: 0; border-radius: 50%;
  width: 36px; height: 36px; background: #fff; box-shadow: var(--soft);
  font-size: 25px; cursor: pointer; display: grid; place-items: center;
  transition: all 0.2s;
}
.modal-close:hover { background: var(--heading); color: #fff; }
.gallery-modal img { width: 100%; border-radius: 16px; margin-bottom: 16px; }
.gallery-modal h3 { font-family: var(--font-display); color: var(--heading); }

.timeline-photo-modal {
  max-width: min(1200px, 94vw); padding: 16px; position: relative;
}
.timeline-photo-modal img {
  display: block; width: 100%; max-height: 85vh;
  object-fit: contain; border-radius: 16px; cursor: zoom-out;
}
.tl-photo-item img, .tl-photo-fill img, .tl-photo img, .tl-grid-thumb img {
  cursor: zoom-in;
}
.tl-photo-nav {
  position: absolute; top: 50%; transform: translateY(-50%);
  width: 44px; height: 44px; border-radius: 50%; border: 0;
  background: rgba(255, 255, 255, 0.85); color: var(--heading);
  font-size: 21px; cursor: pointer; box-shadow: var(--soft);
  display: grid; place-items: center; transition: all 0.2s;
  z-index: 2;
}
.tl-photo-nav:hover { background: var(--heading); color: #fff; }
.tl-photo-nav--prev { left: 24px; }
.tl-photo-nav--next { right: 24px; }
.tl-photo-nav[hidden] { display: none; }
.tl-photo-counter {
  text-align: center; margin: 10px 0 0; font-size: 16px; color: var(--muted);
}


.tour-bubble {
  position: fixed; right: 20px; bottom: 50px; max-width: 320px;
  background: #fff; border: 1px solid var(--line); box-shadow: var(--shadow);
  border-radius: 20px; padding: 18px; z-index: 80;
}
.tour-bubble strong { color: var(--heading); font-size: 17px; }
.tour-bubble p { font-size: 17px; color: var(--text); margin: 8px 0; }
.tour-actions { display: flex; gap: 8px; }
.tour-actions button {
  border: 0; border-radius: 999px; padding: 8px 16px; font-weight: 700;
  font-size: 16px; cursor: pointer; transition: all 0.2s;
}
#tourNext { background: var(--heading); color: #fff; }
#tourClose { background: rgba(0,0,0,0.06); color: var(--text); }


.toast {
  position: fixed; left: 50%; bottom: 24px;
  transform: translate(-50%, 20px); opacity: 0;
  background: var(--ink); color: #fff; border-radius: 999px;
  padding: 12px 20px; z-index: 90; box-shadow: var(--shadow);
  font-weight: 600; font-size: 17px;
  transition: opacity 0.3s, transform 0.3s;
}
.toast.show { opacity: 1; transform: translate(-50%, 0); }




.observe, .observe-card {
  opacity: 0; transform: translateY(28px);
  transition: opacity 0.7s var(--ease), transform 0.7s var(--ease);
}
.observe.in-view, .observe-card.in-view { opacity: 1; transform: translateY(0); }


.tour-highlight { outline: 3px solid var(--gold); outline-offset: 8px; border-radius: var(--radius); }


.file-links { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 10px; }
.file-links a {
  padding: 6px 10px; border-radius: 999px; background: rgba(26, 107, 111, 0.08);
  color: var(--teal); font-weight: 700; font-size: 15px;
}


@media (max-width: 980px) {
  .menu-toggle { display: flex; }
  .nav-links {
    position: absolute; top: 100%; left: 14px; right: 14px;
    display: none; flex-direction: column; align-items: stretch;
    padding: 14px; background: rgba(255, 250, 240, 0.97);
    border: 1px solid var(--line); border-radius: 18px; box-shadow: var(--shadow);
  }
  .nav-links.open { display: flex; }
  .hero-layout, .parent-grid, .tribute-grid, .help-grid { grid-template-columns: 1fr; }
  .gallery-grid { grid-template-columns: repeat(2, 1fr); }
  .approved-grid, .admin-tributes { grid-template-columns: repeat(2, 1fr); }
  .foundation-shell { grid-template-columns: 1fr; }
  .foundation-photo { max-width: 200px; margin: 0 auto; }
}
@media (max-width: 620px) {
  .screen { padding: 48px 14px; }
  .brand em { display: none; }
  .button-row { flex-direction: column; }
  .btn { width: 100%; }
  .gallery-grid, .approved-grid, .admin-tributes, .admin-stats,
  .upload-grid, .preview-files, .field-row { grid-template-columns: 1fr; }
  .foundation-highlights { grid-template-columns: 1fr; }
  .dedication-strip { display: grid; }
  .tour-bubble { left: 12px; right: 12px; bottom: 16px; max-width: none; }
  .portrait-card { min-height: 320px; }
}


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


@media print {
  body { background: #fff; }
  .topbar, .living-bg, .page-progress, .button-row, .legacy-pulse,
  .dedication-strip, .tracker-state, .tour-bubble, .toast { display: none !important; }
  .screen, .subsection { min-height: auto; padding: 20px 0; }
}


.mandala-defs { position: absolute; width: 0; height: 0; overflow: hidden; }

.mandala-flow {
  position: fixed;
  inset: 0;
  z-index: -3;
  pointer-events: none;
  overflow: hidden;
  contain: strict;
}


.mandala {
  position: absolute;
  display: block;
  color: #fdf3de;                       
  will-change: transform, opacity;
  transform: translateZ(0);
  backface-visibility: hidden;
}
.mandala svg {
  display: block;
  width: 100%;
  height: 100%;
  overflow: visible;
  position: relative;
  filter: drop-shadow(0 0 7px rgba(226, 182, 74, 0.5));
}


.mandala-glow {
  position: absolute;
  inset: -42%;
  border-radius: 50%;
  pointer-events: none;
  
  background: radial-gradient(circle,
    rgba(255, 214, 120, 0.50) 0%,
    rgba(232, 178, 74, 0.28) 32%,
    rgba(244, 196, 48, 0.10) 58%,
    transparent 74%);
  filter: blur(9px);
  will-change: transform, opacity;
  animation: mandalaGlow cubic-bezier(0.42, 0, 0.58, 1) infinite;
}
@keyframes mandalaGlow {
  0%, 100% { opacity: 0.24; transform: scale(0.84); }
  50%      { opacity: 0.80; transform: scale(1.20); }
}



@keyframes mandalaTint {
  
  0%, 100% { color: #fdf3de; }   
  12.5%    { color: #f6e0ae; }   
  25%      { color: #ffc14a; }   
  37.5%    { color: #d4a03a; }   
  50%      { color: #fff3c4; }   
  62.5%    { color: #d4a03a; }   
  75%      { color: #ffc14a; }   
  87.5%    { color: #f6e0ae; }   
}


@keyframes mandalaSparkle {
  0%, 100% { opacity: var(--o-min); }
  50%      { opacity: var(--o-max); }
}


@keyframes mandalaRise {
  0% { opacity: 0; transform: translate3d(0.00px, -0.00vh, 0) rotate(0.00deg); }
  8% { opacity: 1; }
  8.3333% { transform: translate3d(15.00px, -11.17vh, 0) rotate(9.17deg); }
  16.667% { transform: translate3d(25.98px, -22.33vh, 0) rotate(18.33deg); }
  25% { transform: translate3d(30.00px, -33.50vh, 0) rotate(27.50deg); }
  33.333% { transform: translate3d(25.98px, -44.67vh, 0) rotate(36.67deg); }
  41.667% { transform: translate3d(15.00px, -55.83vh, 0) rotate(45.83deg); }
  50% { transform: translate3d(0.00px, -67.00vh, 0) rotate(55.00deg); }
  58.333% { transform: translate3d(-15.00px, -78.17vh, 0) rotate(64.17deg); }
  66.667% { transform: translate3d(-25.98px, -89.33vh, 0) rotate(73.33deg); }
  75% { transform: translate3d(-30.00px, -100.50vh, 0) rotate(82.50deg); }
  83.333% { transform: translate3d(-25.98px, -111.67vh, 0) rotate(91.67deg); }
  91.667% { transform: translate3d(-15.00px, -122.83vh, 0) rotate(100.83deg); }
  92% { opacity: 1; }
  100% { opacity: 0; transform: translate3d(-0.00px, -134.00vh, 0) rotate(110.00deg); }
}

@keyframes mandalaTurn {
  from { transform: rotate(0deg); }
  to   { transform: rotate(360deg); }
}

@keyframes mandalaDrift {
  0% { opacity: 0; transform: translate3d(0.00vw, 0.00vh, 0) rotate(0.00deg); }
  7% { opacity: 1; }
  8.3333% { transform: translate3d(11.00vw, -0.33vh, 0) rotate(8.00deg); }
  16.667% { transform: translate3d(22.00vw, -1.60vh, 0) rotate(16.00deg); }
  25% { transform: translate3d(33.00vw, -4.50vh, 0) rotate(24.00deg); }
  33.333% { transform: translate3d(44.00vw, -9.27vh, 0) rotate(32.00deg); }
  41.667% { transform: translate3d(55.00vw, -15.67vh, 0) rotate(40.00deg); }
  50% { transform: translate3d(66.00vw, -23.00vh, 0) rotate(48.00deg); }
  58.333% { transform: translate3d(77.00vw, -30.33vh, 0) rotate(56.00deg); }
  66.667% { transform: translate3d(88.00vw, -36.73vh, 0) rotate(64.00deg); }
  75% { transform: translate3d(99.00vw, -41.50vh, 0) rotate(72.00deg); }
  83.333% { transform: translate3d(110.00vw, -44.40vh, 0) rotate(80.00deg); }
  91.667% { transform: translate3d(121.00vw, -45.67vh, 0) rotate(88.00deg); }
  93% { opacity: 1; }
  100% { opacity: 0; transform: translate3d(132.00vw, -46.00vh, 0) rotate(96.00deg); }
}

.mandala--rise  { animation: mandalaRise  linear infinite, mandalaTint cubic-bezier(0.42, 0, 0.58, 1) infinite; }
.mandala--turn  { animation: mandalaTurn  linear infinite, mandalaTint cubic-bezier(0.42, 0, 0.58, 1) infinite; }
.mandala--drift { animation: mandalaDrift linear infinite, mandalaTint cubic-bezier(0.42, 0, 0.58, 1) infinite; }
.mandala > svg  { animation: mandalaSparkle cubic-bezier(0.42, 0, 0.58, 1) infinite; }


@media (prefers-reduced-motion: reduce) {
  .mandala { animation: mandalaTint 40s cubic-bezier(0.42, 0, 0.58, 1) infinite !important; opacity: 1 !important; }
  .mandala > svg { animation: none !important; }
}


@media print {
  .mandala-flow { display: none !important; }
}


#galleryGrid[hidden] { display: none !important; }

.gallery-modes {
  display: flex; justify-content: center; flex-wrap: wrap;
  gap: 10px; margin: 0 auto 22px;
}
.mode-chip {
  padding: 8px 20px; border-radius: 99px; cursor: pointer;
  border: 1px solid var(--line); background: rgba(255, 255, 255, 0.7);
  color: var(--heading); font: inherit; font-size: 16px; font-weight: 600;
  transition: background 0.25s, color 0.25s, border-color 0.25s, box-shadow 0.25s;
}
.mode-chip:hover { background: rgba(255, 255, 255, 0.95); }
.mode-chip.active {
  background: linear-gradient(135deg, var(--heading), var(--copper));
  color: #fff; border-color: transparent;
  box-shadow: 0 10px 26px rgba(92, 45, 10, 0.28);
}
.gallery-prompt {
  text-align: center; color: var(--muted); font-style: italic;
  font-family: var(--font-display); font-size: 21px; margin: 8px 0 0;
}

.gallery-viewer {
  max-width: 860px; margin: 0 auto;
  animation: gvFadeIn 0.45s var(--ease) both;
}
.gallery-viewer[hidden] { display: none !important; }
@keyframes gvFadeIn { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }


.gv-frame {
  position: relative;
  padding: clamp(14px, 2vw, 26px);
  border-radius: 4px;
  background: none;
  box-shadow: none;
}


.gv-mat {
  position: relative; padding: 9px; border-radius: 12px;
  background:
    repeating-linear-gradient(90deg, rgba(92,45,10,0.30) 0 2px, transparent 2px 8px),
    linear-gradient(160deg, #5c2d0a, #8b4513 55%, #5c2d0a);
  box-shadow:
    inset 0 0 0 1px rgba(255, 226, 160, 0.55),
    0 0 0 1px rgba(120, 70, 12, 0.55);
}
.gv-stage {
  position: relative; overflow: hidden; border-radius: 7px;
  background: #24120a; aspect-ratio: 3 / 2;
  box-shadow: inset 0 0 26px rgba(0, 0, 0, 0.55);
}
.gv-img {
  width: 100%; height: 100%; object-fit: contain;
  transition: opacity 0.55s var(--ease), transform 0.55s var(--ease);
}
.gv-img.gv-swap { opacity: 0; transform: scale(1.04); }


.gv-corner {
  position: absolute; width: 26px; height: 26px; pointer-events: none;
  border-color: rgba(255, 245, 210, 0.9); border-style: solid; border-width: 0;
}
.gv-corner--tl { top: 5px; left: 5px; border-top-width: 3px; border-left-width: 3px; border-top-left-radius: 14px; }
.gv-corner--tr { top: 5px; right: 5px; border-top-width: 3px; border-right-width: 3px; border-top-right-radius: 14px; }
.gv-corner--bl { bottom: 5px; left: 5px; border-bottom-width: 3px; border-left-width: 3px; border-bottom-left-radius: 14px; }
.gv-corner--br { bottom: 5px; right: 5px; border-bottom-width: 3px; border-right-width: 3px; border-bottom-right-radius: 14px; }


.gv-nav {
  position: absolute; top: 50%; transform: translateY(-50%);
  width: 46px; height: 46px; border-radius: 50%; cursor: pointer;
  border: 1px solid rgba(255, 226, 160, 0.75);
  background: rgba(36, 18, 10, 0.62); color: #ffeec2;
  font-size: 21px; line-height: 1; display: grid; place-items: center;
  backdrop-filter: blur(6px);
  transition: background 0.25s, color 0.25s, transform 0.25s, opacity 0.25s;
  z-index: 2;
}
.gv-nav:hover { background: var(--gold); color: #3d2814; transform: translateY(-50%) scale(1.08); }
.gv-nav--prev { left: 12px; }
.gv-nav--next { right: 12px; }
.gv-counter {
  position: absolute; right: 14px; bottom: 12px; z-index: 2;
  padding: 4px 12px; border-radius: 99px; font-size: 14px; font-weight: 700;
  letter-spacing: 0.06em; color: #ffeec2;
  background: rgba(36, 18, 10, 0.66); border: 1px solid rgba(255, 226, 160, 0.5);
}

.gv-caption { text-align: center; margin-top: 20px; }
.gv-caption strong {
  display: block; font-family: var(--font-display);
  font-size: 27px; font-weight: 600; color: var(--heading);
}
.gv-caption p { margin: 6px auto 0; max-width: 620px; color: var(--text); font-size: 17px; }
.gv-actions { display: flex; justify-content: center; flex-wrap: wrap; gap: 12px; margin-top: 20px; }


.gallery-viewer.is-playing .gv-stage::after,
.gallery-viewer.is-idling .gv-stage::after {
  content: ""; position: absolute; left: 0; bottom: 0; height: 3px; z-index: 3;
  border-radius: 0 99px 99px 0;
  
  width: 100%; transform-origin: left center; will-change: transform;
}
.gallery-viewer.is-playing .gv-stage::after {
  background: linear-gradient(90deg, var(--gold), #f6e3ac);
  animation: gvProgress 4s linear infinite;
}
.gallery-viewer.is-idling .gv-stage::after {
  height: 2px;
  background: linear-gradient(90deg, oklch(0.72 0.11 66 / 0.5), oklch(0.86 0.10 86 / 0.6));
  animation: gvProgress 19s linear both;
}
@keyframes gvProgress { from { transform: scaleX(0); } to { transform: scaleX(1); } }

@media (max-width: 720px) {
  .gv-frame { padding: 10px; border-radius: 14px; }
  .gv-nav { width: 38px; height: 38px; font-size: 18px; }
  .gv-nav--prev { left: 7px; } .gv-nav--next { right: 7px; }
  .gv-caption strong { font-size: 23px; }
}
@media (prefers-reduced-motion: reduce) {
  .gallery-viewer { animation: none; }
  .gv-img { transition: none; }
  .gallery-viewer.is-playing .gv-stage::after,
  .gallery-viewer.is-idling .gv-stage::after { animation: none; width: 100%; }
}




[data-reveal] { will-change: opacity, transform, filter; }


@keyframes txFadeUp { from { opacity: 0; transform: translateY(22px); } to { opacity: 1; transform: none; } }
.in-view [data-reveal="fade-up"],
[data-reveal="fade-up"].in-view { animation: txFadeUp 0.55s var(--ease) both; }


@keyframes txBlurIn { from { opacity: 0; filter: blur(10px); transform: translateY(10px); }
                      to   { opacity: 1; filter: blur(0);    transform: none; } }
.in-view [data-reveal="blur-in"],
[data-reveal="blur-in"].in-view { animation: txBlurIn 0.7s var(--ease) both; }


@keyframes txWordIn { from { opacity: 0; transform: translateY(16px); } to { opacity: 1; transform: none; } }
[data-reveal="word"] .tx-w { display: inline-block; opacity: 0; }
.in-view [data-reveal="word"] .tx-w,
[data-reveal="word"].in-view .tx-w { animation: txWordIn 0.5s var(--ease) both; }


@keyframes txCharIn { from { opacity: 0; transform: translateY(9px) scale(0.9); } to { opacity: 1; transform: none; } }
[data-reveal="char"] .tx-c { display: inline-block; white-space: pre; opacity: 0; }
.in-view [data-reveal="char"] .tx-c,
[data-reveal="char"].in-view .tx-c { animation: txCharIn 0.32s ease-out both; }


@keyframes txWipe { from { background-size: 0% 100%; } to { background-size: 100% 100%; } }
[data-reveal="wipe"] {
  background-image: linear-gradient(90deg, var(--heading), var(--copper));
  background-repeat: no-repeat;
  background-size: 0% 100%;
  -webkit-background-clip: text;
  background-clip: text;
  color: oklch(0.38 0.115 48 / 0.16);
  color: rgba(92, 45, 10, 0.16);
}
@supports (background-clip: text) or (-webkit-background-clip: text) {
  [data-reveal="wipe"] { color: transparent; -webkit-text-fill-color: transparent; }
  [data-reveal="wipe"]::selection { -webkit-text-fill-color: currentColor; }
}
.in-view [data-reveal="wipe"],
[data-reveal="wipe"].in-view { animation: txWipe 1.5s cubic-bezier(0.4, 0, 0.2, 1) both; }


@supports (animation-timeline: view()) {
  [data-reveal="wipe"][data-scroll-linked] {
    animation: txWipe linear both;
    animation-timeline: view();
    animation-range: cover 20% cover 58%;
  }
}


.in-view .observe-card:nth-child(1),  .observe-card.in-view:nth-child(1),
.stagger-item:nth-child(1)  { transition-delay: 0ms;   animation-delay: 0ms; }
.in-view .observe-card:nth-child(2),  .observe-card.in-view:nth-child(2),
.stagger-item:nth-child(2)  { transition-delay: 70ms;  animation-delay: 70ms; }
.in-view .observe-card:nth-child(3),  .observe-card.in-view:nth-child(3),
.stagger-item:nth-child(3)  { transition-delay: 140ms; animation-delay: 140ms; }
.in-view .observe-card:nth-child(4),  .observe-card.in-view:nth-child(4),
.stagger-item:nth-child(4)  { transition-delay: 210ms; animation-delay: 210ms; }
.in-view .observe-card:nth-child(5),  .observe-card.in-view:nth-child(5),
.stagger-item:nth-child(5)  { transition-delay: 280ms; animation-delay: 280ms; }
.in-view .observe-card:nth-child(6),  .observe-card.in-view:nth-child(6),
.stagger-item:nth-child(6)  { transition-delay: 350ms; animation-delay: 350ms; }
.in-view .observe-card:nth-child(7),  .observe-card.in-view:nth-child(7),
.stagger-item:nth-child(7)  { transition-delay: 400ms; animation-delay: 400ms; }
.in-view .observe-card:nth-child(n+8), .observe-card.in-view:nth-child(n+8),
.stagger-item:nth-child(n+8) { transition-delay: 450ms; animation-delay: 450ms; }


.stagger-item:hover, .stagger-item:active,
.stagger-item:focus-visible { transition-delay: 0ms !important; }




@media (prefers-reduced-motion: reduce) {
  [data-reveal], [data-reveal] .tx-w, [data-reveal] .tx-c {
    animation: none !important; opacity: 1 !important; filter: none !important; transform: none !important;
  }
  [data-reveal="wipe"] { background-size: 100% 100% !important; }
  .observe-card { animation-delay: 0ms !important; }
}


:root { interpolate-size: allow-keywords; }

.story-copy, .tl-people, .help-body {
  transition-behavior: allow-discrete;
}


.tl-photo, .tl-photo-cluster, .tl-photo-stack, .tl-photo-grid {
  opacity: 0;
  transition: opacity 0.45s var(--ease), display 0.45s allow-discrete;
}
.timeline-item.story-open .tl-photo,
.timeline-item.story-open .tl-photo-cluster,
.timeline-item.story-open .tl-photo-stack,
.timeline-item.story-open .tl-photo-grid {
  opacity: 1;
}
@starting-style {
  .timeline-item.story-open .tl-photo,
  .timeline-item.story-open .tl-photo-cluster,
  .timeline-item.story-open .tl-photo-stack,
  .timeline-item.story-open .tl-photo-grid { opacity: 0; }
}


.gallery-viewer {
  transition: opacity 0.4s var(--ease), transform 0.4s var(--ease),
              display 0.4s allow-discrete, overlay 0.4s allow-discrete;
}
@starting-style {
  .gallery-viewer { opacity: 0; transform: translateY(14px); }
}


details::details-content {
  block-size: 0;
  overflow: hidden;
  transition: block-size 0.35s var(--ease), content-visibility 0.35s allow-discrete;
}
details[open]::details-content { block-size: auto; }

@media (prefers-reduced-motion: reduce) {
  .story-copy, .tl-people, .help-body, .gallery-viewer,
  details::details-content { transition: none !important; }
}




#galleryViewerImage {
  view-transition-name: gallery-photo;
  
  filter: none !important;
}

::view-transition-old(gallery-photo) {
  animation: gvOut 0.32s cubic-bezier(0.4, 0, 1, 1) both;
}
::view-transition-new(gallery-photo) {
  animation: gvIn 0.42s cubic-bezier(0, 0, 0.2, 1) both;
}
@keyframes gvOut { from { opacity: 1; transform: scale(1); } to { opacity: 0; transform: scale(0.98); } }
@keyframes gvIn  { from { opacity: 0; transform: scale(1.03); } to { opacity: 1; transform: scale(1); } }


::view-transition-group(root) { animation-duration: 0.3s; }


.img-blur-up {
  filter: blur(14px);
  transform: scale(1.04);
  transition: filter 0.6s var(--ease), transform 0.6s var(--ease), opacity 0.4s;
}
.img-blur-up.img-ready {
  filter: blur(0);
  transform: scale(1);
}

@media (prefers-reduced-motion: reduce) {
  .img-blur-up { filter: none !important; transform: none !important; transition: none !important; }
  ::view-transition-old(gallery-photo),
  ::view-transition-new(gallery-photo) { animation: none !important; }
}


@media (max-width: 980px) {
}


.threshold {
  position: fixed; inset: 0; z-index: 9999;
  display: flex; flex-direction: column;
  align-items: center; justify-content: center;
  text-align: center;
  overflow: hidden;
  
  background:
    radial-gradient(ellipse 46% 38% at 50% 40%,  rgba(255, 176,  74, 0.20), transparent 64%),
    radial-gradient(ellipse 70% 62% at  6%  4%,  rgba(190, 116,  36, 0.34), transparent 62%),
    radial-gradient(ellipse 78% 70% at 96% 98%,  rgba( 34,  12,  50, 0.66), transparent 66%),
    radial-gradient(ellipse 128% 104% at 50% 50%, transparent 40%, rgba(6, 3, 10, 0.74) 100%),
    linear-gradient(116deg,
      #33200e 0%, #3d2413 20%, #45213a 48%, #2b1430 74%, #150b1c 100%);
  background-color: #150b1c;
  
}



.threshold.is-dismissed { animation: thresholdOut 0.7s var(--ease-soft) both; }
.threshold.is-gone { display: none; }


#threshold.is-reopening .diya-lamp,
#threshold.is-reopening .diya-wick,
#threshold.is-reopening .flame,
#threshold.is-reopening .flame-halo,
#threshold.is-reopening .diya-glow,
#threshold.is-reopening .diya-halo,
#threshold.is-reopening .d-rim,
#threshold.is-reopening .d-beads circle,
#threshold.is-reopening .d-petals path,
#threshold.is-reopening .threshold-line,
#threshold.is-reopening .threshold-names,
#threshold.is-reopening .threshold-title,
#threshold.is-reopening .threshold-actions,
#threshold.is-reopening .aw,
#threshold.is-reopening .nw {
  animation-delay: 0s !important;
}


#threshold .threshold-btn,
.farewell .threshold-btn {
  color: #4a2500 !important;
  -webkit-text-fill-color: #4a2500 !important;
  background-color: #f3bd43 !important;
  background-image: linear-gradient(180deg, #fff6d2 0%, #ffe698 16%, #f8cb60 39%, #e9a52a 70%, #c86e08 100%) !important;
  border: 1px solid #8f4d03 !important;
  box-shadow: inset 0 4px 3px rgba(255,255,246,.98), inset 0 -7px 9px rgba(103,43,0,.45), inset 4px 0 6px rgba(255,235,157,.62), inset -4px 0 6px rgba(126,52,0,.24), 0 7px 12px rgba(75,34,0,.38), 0 0 20px rgba(247,184,55,.72) !important;
  text-shadow: none !important;
  filter: none !important;
  animation: none !important;
  transition: transform .18s ease, filter .18s ease !important;
}
#threshold .threshold-btn:hover,
.farewell .threshold-btn:hover {
  color: #4a2500 !important;
  -webkit-text-fill-color: #4a2500 !important;
  background-color: #f3bd43 !important;
  background-image: linear-gradient(180deg, #fff6d2 0%, #ffe698 16%, #f8cb60 39%, #e9a52a 70%, #c86e08 100%) !important;
  box-shadow: inset 0 4px 3px rgba(255,255,246,.98), inset 0 -7px 9px rgba(103,43,0,.45), inset 4px 0 6px rgba(255,235,157,.62), inset -4px 0 6px rgba(126,52,0,.24), 0 7px 12px rgba(75,34,0,.38), 0 0 20px rgba(247,184,55,.72) !important;
  text-shadow: none !important;
  filter: brightness(1.04) !important;
  transform: translateY(-2px) !important;
}
#threshold .threshold-btn:active,
.farewell .threshold-btn:active {
  color: #4a2500 !important;
  -webkit-text-fill-color: #4a2500 !important;
  transform: translateY(1px) scale(.98) !important;
}


#threshold:not(.is-reopening) .diya-lamp {
  animation: lampSettle .42s var(--ease-spring) both !important;
}
#threshold:not(.is-reopening) .diya-wick {
  animation: wickRise .32s var(--ease-spring) .05s both !important;
}
#threshold:not(.is-reopening) .flame {
  animation: flameCatch .48s var(--ease-spring) .06s both,
             flameSway 7.3s ease-in-out .54s infinite,
             flameBreathe 3.9s ease-in-out .54s infinite !important;
}
#threshold:not(.is-reopening) .flame-halo {
  animation: glowSwell .38s var(--ease-soft) .1s both,
             flameHaloBreathe 6.8s ease-in-out .5s infinite !important;
}
#threshold:not(.is-reopening) .diya-glow {
  animation: glowSwell .38s var(--ease-soft) .12s both,
             glowBreathe 5.7s ease-in-out .5s infinite !important;
}
#threshold:not(.is-reopening) .diya-halo {
  animation: glowSwell .42s var(--ease-soft) .16s both,
             haloBreathe 9.1s ease-in-out .58s infinite !important;
}
#threshold:not(.is-reopening) .threshold-line .aw,
#threshold:not(.is-reopening) .threshold-names .nw {
  animation-delay: .18s !important;
}
#threshold:not(.is-reopening) .threshold-title {
  animation: seRise .46s var(--ease-soft) .24s forwards,
             seSweep 9s linear .7s infinite !important;
}
#threshold:not(.is-reopening) .threshold-actions {
  animation: riseIn .42s var(--ease-spring) .32s both,
             capRegalia 6.8s cubic-bezier(.45, 0, .55, 1) .74s infinite !important;
}

@keyframes thresholdOut {
  from { opacity: 1; visibility: visible; transform: scale(1); }
  to   { opacity: 0; visibility: hidden;  transform: scale(1.05); }
}
body.threshold-open { overflow: hidden; }



.threshold-inner, .farewell-inner, .sacred-content { position: relative; z-index: 1; }


.threshold-inner {
  display: block;
  width: 100%;
  max-width: none;
  padding: 26px 16px;
  text-align: center;
}


.diya-scene { position: relative; width: 260px; height: 220px; margin: 0 auto 6px; }

.diya-lamp {
  position: absolute; bottom: 0; left: 50%; width: 220px; height: 116px;
  transform: translateX(-50%);
  animation: lampSettle 1.6s var(--ease-spring) 0.2s both;
}
@keyframes lampSettle {
  from { opacity: 0; transform: translateX(-50%) translateY(34px) scale(0.88); }
  to   { opacity: 1; transform: translateX(-50%) translateY(0) scale(1); }
}

.d-body  { stroke: rgba(232, 193, 98, 0.55); stroke-width: 1.1; }
.d-plate { fill: oklch(0.36 0.09 62); opacity: 0.9; }
.d-spout { fill: oklch(0.68 0.13 76); stroke: oklch(0.86 0.12 88); stroke-width: 1; }
.d-rim {
  fill: none; stroke: url(#rimGrad); stroke-width: 3.2; stroke-linecap: round;
  animation: fadeUpIn 1.5s var(--ease-soft) 1.5s both;
}
@keyframes fadeUpIn { from { opacity: 0; } to { opacity: 1; } }
.d-oil   {  }
@keyframes oilPool    { from { opacity: 0; } to { opacity: 0.85; } }
@keyframes oilShimmer { 0%, 100% { opacity: 0.76; } 50% { opacity: 0.96; } }
.d-beads circle {
  fill: oklch(0.9 0.14 92); opacity: 0;
  animation: beadLight 0.9s var(--ease-spring) both;
}
.d-beads circle:nth-child(1) { animation-delay: 2.5s; }
.d-beads circle:nth-child(2) { animation-delay: 2.64s; }
.d-beads circle:nth-child(3) { animation-delay: 2.78s; }
.d-beads circle:nth-child(4) { animation-delay: 2.92s; }
.d-beads circle:nth-child(5) { animation-delay: 3.06s; }
.d-beads circle:nth-child(6) { animation-delay: 3.2s; }
@keyframes beadLight { from { opacity: 0; transform: scale(0.2); transform-origin: center; }
                       to   { opacity: 1; transform: scale(1); } }
.d-petals path {
  fill: none; stroke: oklch(0.45 0.1 55); stroke-width: 1.3; opacity: 0;
  animation: fadeUpIn 1.3s var(--ease-soft) 2.9s both;
}


.diya-scene .diya-halo  { z-index: 0; }
.diya-scene .diya-glow  { z-index: 0; }
.diya-scene .diya-lamp  { z-index: 1; }
.diya-scene .diya-wick  { z-index: 2; }
.diya-scene .flame      { z-index: 3; }
.diya-scene .ember      { z-index: 3; }

.flame-halo {
  
  position: absolute; left: 50%; bottom: 46px;
  width: 210px; height: 210px; transform: translateX(-50%);
  border-radius: 50%; pointer-events: none; z-index: 2;
  background: radial-gradient(circle,
    rgba(255, 214, 130, 0.50) 0%, rgba(255, 176, 70, 0.26) 30%,
    rgba(255, 150, 50, 0.10) 56%, transparent 74%);
  filter: blur(10px);
  animation: glowSwell 2.2s var(--ease-soft) 1.9s both,
             flameHaloBreathe 6.8s ease-in-out 4.1s infinite;
}
@keyframes flameHaloBreathe {
  0%, 100% { opacity: 0.62; transform: translateX(-50%) scale(0.92); }
  50%      { opacity: 1;    transform: translateX(-50%) scale(1.12); }
}

.diya-wick {
  position: absolute; left: 50%; bottom: 79px; width: 4px; height: 15px;
  transform: translateX(-50%); border-radius: 2px 2px 0 0;
  background: linear-gradient(to top, oklch(0.42 0.05 60), oklch(0.30 0.03 55) 60%, oklch(0.58 0.14 55));
  animation: wickRise 0.9s var(--ease-spring) 1.1s both;
}
@keyframes wickRise { from { opacity: 0; transform: translateX(-50%) scaleY(0.15); }
                      to   { opacity: 1; transform: translateX(-50%) scaleY(1); } }


.flame {
  position: absolute; left: 50%; bottom: 88px; width: 50px; height: 96px;
  transform: translateX(-50%); transform-origin: 50% 100%;
  animation:
    flameCatch 1.8s var(--ease-spring) 1.5s both,
    flameSway 7.3s ease-in-out 3.3s infinite,
    flameBreathe 3.9s ease-in-out 3.3s infinite;
}

@keyframes flameCatch {
  0%   { opacity: 0;    transform: translateX(-50%) scale(0.08, 0.03); }
  14%  { opacity: 0.85; transform: translateX(-50%) scale(0.45, 0.28); }
  38%  { opacity: 1;    transform: translateX(-50%) scale(1.18, 1.36); }
  58%  { transform: translateX(-50%) scale(0.92, 0.88); }
  76%  { transform: translateX(-50%) scale(1.06, 1.08); }
  100% { opacity: 1;    transform: translateX(-50%) scale(1, 1); }
}
@keyframes flameSway {
  0%, 100% { transform: translateX(-50%) rotate(0deg)    skewX(0deg); }
  18%      { transform: translateX(-50%) rotate(-1.8deg) skewX(-1.2deg); }
  37%      { transform: translateX(-50%) rotate(0.9deg)  skewX(0.6deg); }
  55%      { transform: translateX(-50%) rotate(2.1deg)  skewX(1.4deg); }
  74%      { transform: translateX(-50%) rotate(-0.7deg) skewX(-0.5deg); }
}
@keyframes flameBreathe {
  0%, 100% { height: 96px; }
  33%      { height: 104px; }
  67%      { height: 90px; }
}
.flame > span { position: absolute; left: 50%; bottom: 0; transform: translateX(-50%); }

.flame-outer {
  width: 52px; height: 100px; border-radius: 50% 50% 44% 44% / 68% 68% 32% 32%;
  background: radial-gradient(ellipse at 50% 84%,
    oklch(0.74 0.20 46 / 0.80) 0%, oklch(0.68 0.19 38 / 0.38) 52%, transparent 78%);
  filter: blur(4px);
  animation: flickerA 2.11s ease-in-out infinite;
}
.flame-mid {
  width: 31px; height: 70px; border-radius: 50% 50% 46% 46% / 66% 66% 34% 34%;
  background: linear-gradient(to top,
    oklch(0.70 0.20 44) 0%, oklch(0.82 0.19 68) 34%, oklch(0.91 0.16 86) 72%, oklch(0.96 0.11 94) 100%);
  filter: blur(0.7px);
  animation: flickerB 1.73s ease-in-out infinite;
}
.flame-core {
  width: 15px; height: 40px; border-radius: 50% 50% 48% 48% / 64% 64% 36% 36%;
  background: linear-gradient(to top, oklch(0.88 0.12 88), oklch(0.99 0.045 100));
  animation: flickerC 1.31s ease-in-out infinite;
}
.flame-base {
  width: 11px; height: 13px; border-radius: 50%;
  background: radial-gradient(circle, oklch(0.64 0.17 236 / 0.8), oklch(0.6 0.14 240 / 0.25) 55%, transparent 72%);
  animation: flickerD 1.07s ease-in-out infinite;
}

@keyframes flickerA {
  0%, 100% { transform: translateX(-50%) scale(1, 1);       opacity: 0.92; }
  27%      { transform: translateX(-50%) scale(0.96, 1.08); opacity: 1; }
  61%      { transform: translateX(-50%) scale(1.05, 0.94); opacity: 0.88; }
}
@keyframes flickerB {
  0%, 100% { transform: translateX(-50%) scale(1, 1);       opacity: 1; }
  22%      { transform: translateX(-50%) scale(0.94, 1.10); opacity: 0.96; }
  48%      { transform: translateX(-50%) scale(1.06, 0.93); opacity: 1; }
  73%      { transform: translateX(-50%) scale(0.98, 1.05); opacity: 0.98; }
}
@keyframes flickerC {
  0%, 100% { transform: translateX(-50%) scale(1, 1)        translateY(0);    opacity: 1; }
  31%      { transform: translateX(-50%) scale(0.9, 1.14)   translateY(-2px); opacity: 1; }
  66%      { transform: translateX(-50%) scale(1.08, 0.9)   translateY(1px);  opacity: 0.95; }
}
@keyframes flickerD {
  0%, 100% { transform: translateX(-50%) scale(1);    opacity: 0.85; }
  40%      { transform: translateX(-50%) scale(1.16); opacity: 1; }
  70%      { transform: translateX(-50%) scale(0.92); opacity: 0.78; }
}


.ember {
  position: absolute; left: 50%; bottom: 158px; width: 3px; height: 3px;
  border-radius: 50%; background: oklch(0.88 0.15 82); opacity: 0;
  animation: emberRise 4.4s ease-out infinite;
}
.ember.e1 { animation-delay: 7.2s;  --dx: -18px; }
.ember.e2 { animation-delay: 9.1s;  --dx: 14px;  width: 2px; height: 2px; }
.ember.e3 { animation-delay: 11.4s; --dx: -7px; }
@keyframes emberRise {
  0%   { opacity: 0;   transform: translate(-50%, 0) scale(0.5); }
  15%  { opacity: 0.95; }
  100% { opacity: 0;   transform: translate(calc(-50% + var(--dx)), -88px) scale(0.15); }
}

.diya-glow {
  position: absolute; left: 50%; bottom: 62px; width: 320px; height: 320px;
  transform: translateX(-50%); border-radius: 50%; pointer-events: none;
  background: radial-gradient(circle, oklch(0.89 0.15 86 / 0.5) 0%, oklch(0.77 0.16 64 / 0.2) 36%, transparent 68%);
  animation: glowSwell 2.0s var(--ease-soft) 2.0s both, glowBreathe 5.7s ease-in-out 4.0s infinite;
}
.diya-halo {
  position: absolute; left: 50%; bottom: 20px; width: 500px; height: 500px;
  transform: translateX(-50%); border-radius: 50%; pointer-events: none;
  background: radial-gradient(circle, oklch(0.73 0.13 70 / 0.17) 0%, transparent 62%);
  animation: glowSwell 2.4s var(--ease-soft) 2.3s both, haloBreathe 9.1s ease-in-out 4.7s infinite;
}
@keyframes glowSwell   { from { opacity: 0; transform: translateX(-50%) scale(0.35); }
                         to   { opacity: 1; transform: translateX(-50%) scale(1); } }
@keyframes glowBreathe { 0%, 100% { opacity: 0.82; transform: translateX(-50%) scale(1); }
                         50%      { opacity: 1;    transform: translateX(-50%) scale(1.06); } }
@keyframes haloBreathe { 0%, 100% { opacity: 0.85; transform: translateX(-50%) scale(1); }
                         50%      { opacity: 1;    transform: translateX(-50%) scale(1.04); } }


.threshold-line {
  
  margin: 14px 0 0; font-family: var(--font-display); font-style: italic;
  font-size: min(clamp(30px, 2.9vw, 64px), 2.62vw);
  line-height: 1.6;
  
  color: #c98f14;
  text-shadow: 0 0 22px rgba(255, 198, 96, 0.50),
               0 2px 7px rgba(24, 8, 18, 0.92),
               0 1px 2px rgba(18, 5, 12, 0.98);
  white-space: nowrap;
  max-width: none;
  text-align: center;
  text-align-last: center;
  
  animation: none;
  opacity: 1;
}

@media (max-width: 900px) {
  .threshold-line {
    white-space: normal;
    font-size: clamp(26px, 5.2vw, 40px);
    line-height: 1.66;
    
    text-align: center;
    text-align-last: center;
    hyphens: none;
    text-wrap: pretty;
    max-width: 42ch;
  }

  
  .threshold-names {
    font-size: clamp(24px, 6.6vw, 31px);
    max-width: 16ch;          
  }
}
.threshold-title {
  
  margin: 20px 0 0;
  font-family: var(--font-display); font-style: normal; font-weight: 700;
  font-size: clamp(32px, 4vw, 56px);
  line-height: 1.16; letter-spacing: -0.012em;
  -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility; text-wrap: balance;
  color: #ffc95e;
  text-shadow: 0 0 26px rgba(255, 206, 110, 0.55),
               0 2px 9px rgba(40, 12, 30, 0.88),
               0 1px 2px rgba(30, 8, 20, 0.95);
  text-align: center;
  animation: riseIn 1.6s var(--ease-soft) 4.0s both;
}
.threshold-names {
  
  font-family: 'High Tower Text', 'Cormorant Garamond', 'Book Antiqua',
               'Palatino Linotype', Palatino, Georgia, serif;
  font-style: normal;
  font-weight: 700;
  margin: 18px 0 0;
  font-size: min(clamp(29px, 1.6vw, 34px), 1.58vw);
  line-height: 1.3;
  letter-spacing: 0.04em;
  color: #ffd98c;
  text-shadow: 0 0 22px rgba(255, 206, 110, 0.55),
               0 2px 7px rgba(40, 12, 30, 0.88),
               0 1px 2px rgba(30, 8, 20, 0.95);
  text-shadow: 0 0 20px rgba(255, 219, 130, 0.65), 0 0 46px rgba(255, 190, 80, 0.35),
               0 1px 2px rgba(50, 20, 8, 0.5);
  text-align: center;
  text-wrap: balance;      
  max-width: 30ch;
  margin-left: auto; margin-right: auto;
  animation: riseIn 1.4s var(--ease-soft) 3.0s both;
}
@keyframes riseIn { from { opacity: 0; transform: translateY(20px); filter: blur(7px); }
                    to   { opacity: 1; transform: none; filter: blur(0); } }

.threshold-actions {
  
  display: flex; gap: 12px; flex-wrap: wrap; justify-content: center; margin-top: 26px;
  animation: riseIn 1.1s var(--ease-spring) 4.0s both;
}
.threshold-btn {
  font: inherit; font-size: 15px; font-weight: 700;
  letter-spacing: 0.1em; text-transform: uppercase;
  padding: 13px 34px; border-radius: 99px; cursor: pointer;
  transition: transform 0.32s var(--ease-spring), box-shadow 0.32s var(--ease-soft), background 0.28s;
}
.threshold-begin {
  border: 0; color: oklch(0.22 0.05 50);
  background: linear-gradient(135deg, oklch(0.86 0.15 88), oklch(0.74 0.17 60));
  box-shadow: 0 14px 36px oklch(0.62 0.16 66 / 0.45);
}
.threshold-begin:hover  { transform: translateY(-3px) scale(1.04); box-shadow: 0 20px 48px oklch(0.62 0.16 66 / 0.55); }
.threshold-begin:active { transform: translateY(-1px) scale(0.97); }
.threshold-exit {
  background: transparent; color: oklch(0.82 0.05 80 / 0.8);
  border: 1px solid oklch(0.8 0.05 80 / 0.32);
}
.threshold-exit:hover  { color: oklch(0.92 0.08 84); border-color: oklch(0.8 0.09 82 / 0.7);
                         background: oklch(0.8 0.09 82 / 0.1); transform: translateY(-3px) scale(1.03); }
.threshold-exit:active { transform: translateY(-1px) scale(0.97); }




.farewell {
  position: fixed; inset: 0; z-index: 10000;
  display: flex; flex-direction: column;
  align-items: center; justify-content: center;
  text-align: center;
  overflow: hidden;
  
  background:
    radial-gradient(ellipse 46% 38% at 50% 40%,  rgba(255, 176,  74, 0.20), transparent 64%),
    radial-gradient(ellipse 70% 62% at  6%  4%,  rgba(190, 116,  36, 0.34), transparent 62%),
    radial-gradient(ellipse 78% 70% at 96% 98%,  rgba( 34,  12,  50, 0.66), transparent 66%),
    radial-gradient(ellipse 128% 104% at 50% 50%, transparent 40%, rgba(6, 3, 10, 0.74) 100%),
    linear-gradient(116deg,
      #33200e 0%, #3d2413 20%, #45213a 48%, #2b1430 74%, #150b1c 100%);
  background-color: #150b1c;
  animation: farewellIn 0.9s var(--ease-soft) both;
}
.farewell-inner {
  position: relative; z-index: 1;
  width: 100%; max-width: 100%; box-sizing: border-box;
  margin-left: auto; margin-right: auto; text-align: center;
}
.farewell-inner::before {
  content: ''; position: absolute; inset: -6% -5%;
  background: radial-gradient(ellipse at 50% 50%,
    rgba(12, 5, 16, 0.42) 0%, rgba(12, 5, 16, 0.28) 46%, transparent 74%);
  filter: blur(26px); z-index: -1; pointer-events: none;
}

@keyframes farewellIn { from { opacity: 0; } to { opacity: 1; } }
.farewell-inner { display: block; width: 100%; max-width: none; padding: 26px 16px; text-align: center; }


.farewell .diya-glow {
  animation: glowSwell 2s var(--ease-soft) 0.6s both, glowBreathe 5.7s ease-in-out 2.6s infinite;
}
.farewell .diya-halo {
  animation: haloWiden 6s var(--ease-soft) 1.2s both, haloBreathe 9.1s ease-in-out 7.2s infinite;
}
@keyframes haloWiden {
  from { opacity: 0.5; transform: translateX(-50%) scale(0.8); }
  to   { opacity: 1;   transform: translateX(-50%) scale(1.18); }
}

.farewell-line {
  
  font-family: 'High Tower Text', 'Cormorant Garamond', 'Book Antiqua',
               'Palatino Linotype', Palatino, Georgia, serif;
  font-style: normal; font-weight: 700;
  margin: 14px 0 0;
  font-size: clamp(18px, 2.2vw, 31px);
  line-height: 1.3; letter-spacing: 0.03em;
  color: oklch(0.88 0.08 74);
  text-align: center;
  
  animation: none;
  opacity: 1;
}
.farewell-names {
  font-family: 'High Tower Text', 'Cormorant Garamond', 'Book Antiqua',
               'Palatino Linotype', Palatino, Georgia, serif;
  font-style: italic;
  margin: 16px 0 0;
  font-size: clamp(30px, 4.4vw, 60px);
  line-height: 1.2; letter-spacing: 0.02em;
  color: oklch(0.85 0.07 62);
  text-align: center;
  animation: riseIn 1.3s var(--ease-soft) 0.6s both;
}
.farewell-blessing {
  margin: 12px 0 0;
  font-family: var(--font-display); font-style: italic;
  font-size: clamp(13px, 1.7vw, 17px);
  letter-spacing: 0.04em; color: oklch(0.76 0.05 70 / 0.86);
  text-align: center;
  animation: riseIn 1.0s var(--ease-soft) 1.0s both;
}
.farewell-actions {
  display: flex; gap: 12px; flex-wrap: wrap; justify-content: center; margin-top: 28px;
  animation: riseIn 1.0s var(--ease-spring) 1.0s both;
}

@media (max-width: 560px) {
  .diya-scene { width: 200px; height: 178px; transform: scale(0.86); }
  .threshold-btn { padding: 11px 26px; font-size: 14px; }
}


@media (prefers-reduced-motion: reduce) {
  
  .threshold-actions { animation: none !important; }
  .diya-lamp, .diya-wick, .flame, .flame > span, .diya-glow, .diya-halo,
  .d-rim, .d-oil, .d-beads circle, .d-petals path,
  .threshold-line, .threshold-title, .threshold-names, .threshold-actions,
  .farewell-line, .farewell-names, .farewell-blessing, .farewell-actions {
    animation: none !important; opacity: 1 !important; filter: none !important;
  }
  .diya-lamp, .diya-wick, .flame, .diya-glow, .diya-halo { transform: translateX(-50%) !important; }
  .flame > span { transform: translateX(-50%) !important; }
  .flame-outer { filter: blur(4px) !important; }
  .flame-mid { filter: blur(0.7px) !important; }
  .ember { display: none; }
  .farewell { animation-duration: 0.01s !important; }
}


.btn, .virtue-btn, .tab, .help-toggle, .filter-chip, .mode-chip,
.nav-exit-btn, .tour-actions button, .gv-nav, .gallery-card,
.expand-pub-table-btn, .modal-close, .menu-toggle {
  transition:
    transform 0.34s var(--ease-spring),
    box-shadow 0.34s var(--ease-soft),
    background 0.26s var(--ease-soft),
    color 0.26s var(--ease-soft),
    border-color 0.26s var(--ease-soft);
}


.btn:hover, .virtue-btn:hover, .tab:hover, .help-toggle:hover,
.filter-chip:hover, .mode-chip:hover, .nav-exit-btn:hover,
.expand-pub-table-btn:hover {
  transform: translateY(-3px) scale(1.035);
}

.btn:active, .virtue-btn:active, .tab:active, .help-toggle:active,
.filter-chip:active, .mode-chip:active, .nav-exit-btn:active,
.expand-pub-table-btn:active, .gv-nav:active, .modal-close:active {
  transform: translateY(-1px) scale(0.955);
  transition-duration: 0.12s;
}


.filter-chip.active, .mode-chip.active, .tab.active, .virtue-btn.active {
  animation: bubblePop 0.42s var(--ease-spring);
}
@keyframes bubblePop {
  0%   { transform: scale(0.9); }
  60%  { transform: scale(1.06); }
  100% { transform: scale(1); }
}


.gallery-card:hover, .tribute-card:hover, .help-card:hover, .stat-card:hover {
  transform: translateY(-6px) scale(1.02);
}


.nav-links a { position: relative; transition: color 0.24s var(--ease-soft); }
.nav-links a::after {
  content: ""; position: absolute; left: 50%; bottom: -3px;
  width: 0; height: 2px; border-radius: 99px; background: var(--accent);
  transform: translateX(-50%);
  transition: width 0.34s var(--ease-spring);
}
.nav-links a:hover::after, .nav-links a.active::after { width: 72%; }


.gv-nav:hover { transform: translateY(-50%) scale(1.14); }
.gv-nav:active { transform: translateY(-50%) scale(0.94); }


.card, .tribute-card, .help-card, .stat-card, .parent-card, .admin-tribute {
  border-radius: 22px;
}
.btn, .virtue-btn, .tab, .help-toggle, .filter-chip, .mode-chip { border-radius: 99px; }


.in-view [data-reveal="fade-up"], [data-reveal="fade-up"].in-view,
.in-view [data-reveal="blur-in"], [data-reveal="blur-in"].in-view,
.in-view [data-reveal="word"] .tx-w, [data-reveal="word"].in-view .tx-w {
  animation-timing-function: var(--ease-soft);
}

.in-view [data-reveal="char"] .tx-c, [data-reveal="char"].in-view .tx-c {
  animation-timing-function: var(--ease-spring);
}


.observe, .observe-card {
  transition: opacity 0.75s var(--ease-soft), transform 0.75s var(--ease-soft);
}

@media (prefers-reduced-motion: reduce) {
  .btn, .virtue-btn, .tab, .help-toggle, .filter-chip, .mode-chip,
  .nav-exit-btn, .gv-nav, .gallery-card, .expand-pub-table-btn,
  .tribute-card, .help-card, .stat-card {
    transform: none !important; animation: none !important;
  }
  .nav-links a::after { transition: none; }
}


.closed-screen {
  display: grid; place-items: center; align-content: center; gap: 2px;
  min-height: 100vh; padding: 40px; text-align: center;
  font-family: var(--font-display), Georgia, serif;
  background: radial-gradient(ellipse 60% 50% at 50% 44%, oklch(0.28 0.075 58) 0%, oklch(0.14 0.04 48) 50%, oklch(0.08 0.022 44) 100%);
  color: oklch(0.88 0.11 86);
}
.closed-screen h1 { margin: 18px 0 0; font-weight: 600; font-size: clamp(23px, 3.4vw, 34px); }
.closed-names { margin: 6px 0 0; font-size: clamp(17px, 2.2vw, 21px); color: oklch(0.84 0.09 84 / 0.9); }
.closed-note  { margin: 14px 0 0; font-family: var(--font-body), system-ui, sans-serif;
                font-size: 15.5px; letter-spacing: 0.04em; color: oklch(0.72 0.05 78 / 0.8); }

.closed-diya .flame { animation: flameSway 7.3s ease-in-out infinite, flameBreathe 3.9s ease-in-out infinite; opacity: 1; }
.closed-diya .diya-lamp { animation: none; opacity: 1; }
.closed-diya .diya-wick { animation: none; opacity: 1; }
.closed-diya .d-rim, .closed-diya .d-petals path { animation: none; opacity: 1; }
.closed-diya .d-oil { animation: oilShimmer 6.3s ease-in-out infinite; opacity: 0.85; }
.closed-diya .d-beads circle { animation: none; opacity: 1; }
.closed-diya .diya-glow { animation: glowBreathe 5.7s ease-in-out infinite; opacity: 1; }
.closed-diya .diya-halo { animation: haloBreathe 9.1s ease-in-out infinite; opacity: 1; }
@media (prefers-reduced-motion: reduce) {
  .closed-diya .flame, .closed-diya .diya-glow, .closed-diya .diya-halo, .closed-diya .d-oil {
    animation: none !important; opacity: 1 !important;
  }
}


h1.heading-accent,
h2.heading-accent,
h3.heading-accent,
.sacred-content h1.heading-accent,
.sacred-content h2.heading-accent,
.section-heading h2.heading-accent,
.section-heading h3.heading-accent {
  
  font-family: var(--font-display);
  font-style: normal;
  font-weight: 700;                 
  font-variant-ligatures: common-ligatures;
  text-align: center;

  
  font-size: clamp(32px, 4vw, 56px);
  line-height: 1.16;
  letter-spacing: -0.012em;
  margin: 0 0 14px;

  
  color: #43200a;
  color: var(--heading-strong);

  
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
  text-wrap: balance;
  text-shadow: none;
}


.section-heading h2.heading-accent,
.section-heading h3.heading-accent,
.sacred-content h1.heading-accent,
.sacred-content h2.heading-accent {
  max-width: 20ch;
  margin-left: auto;
  margin-right: auto;
}
@media (min-width: 760px) {
  .section-heading h2.heading-accent,
  .section-heading h3.heading-accent,
  .sacred-content h1.heading-accent,
  .sacred-content h2.heading-accent { max-width: 26ch; }
}


.heading-accent[data-reveal],
.heading-accent[data-reveal] .tx-w {
  will-change: auto;
}
.in-view .heading-accent[data-reveal],
.heading-accent[data-reveal].in-view,
.in-view .heading-accent[data-reveal] .tx-w,
.heading-accent[data-reveal].in-view .tx-w {
  animation-fill-mode: both;
  filter: none;
  transform: translateZ(0) translateY(0);
}


.sacred-content h1, .sacred-content h2 { font-size: clamp(32px, 4vw, 56px); }
.split-title { white-space: normal; }


.animated-heading h2.heading-accent::after,
.animated-heading h3.heading-accent::after,
.sacred-content h1.heading-accent::after,
.sacred-content h2.heading-accent::after { margin-top: 12px; height: 3px; }




#foundation .section-heading h2.heading-accent,
#academic .section-heading h3.heading-accent {
  text-align: center;
  margin-left: auto;
  margin-right: auto;
  max-width: 22ch;
  text-wrap: balance;
}


#thanks h2.heading-accent {
  white-space: nowrap;
  max-width: none;
  font-size: min(clamp(32px, 4vw, 56px), 3.46vw);
  text-align: center;
  margin-left: auto;
  margin-right: auto;
}

@media (max-width: 430px) {
  #thanks h2.heading-accent {
    white-space: normal;
    font-size: clamp(23px, 6.4vw, 32px);
    text-wrap: balance;
    max-width: 20ch;
  }
}
.line-break { display: inline; }

@media (max-width: 900px) {
}


.threshold-title {
  white-space: nowrap;
  max-width: none;
  font-size: min(clamp(32px, 4vw, 56px), 6.8vw);
}


.dedication-plain {
  
  opacity: 1;

  
  background: none !important;
  background-image: none !important;
  -webkit-background-clip: border-box !important;
  background-clip: border-box !important;
  -webkit-text-fill-color: currentColor !important;
  text-fill-color: currentColor !important;

  
  display: block;
  width: 100%;
  max-width: none;
  margin-left: 0;
  margin-right: 0;
  text-align: center;
}


@supports (animation-timeline: view()) {
  [data-reveal="wipe"]:not(.in-view):not([data-scroll-linked]) {
    background-size: 100% 100%;
  }
}


#foundation .section-heading h2.heading-accent {
  white-space: nowrap;
  max-width: none;
  font-size: min(clamp(32px, 4vw, 56px), 3.93vw);
  text-align: center;
  margin-left: auto;
  margin-right: auto;
}

@media (max-width: 430px) {
  #foundation .section-heading h2.heading-accent {
    white-space: normal;
    font-size: clamp(24px, 6.6vw, 32px);
    text-wrap: balance;
    max-width: 20ch;
  }
}


#timeline .section-heading h3.heading-accent,
#virtues .section-heading h3.heading-accent,
#academic .section-heading h3.heading-accent {
  white-space: nowrap;
  max-width: none;
  text-align: center;
  margin-left: auto;
  margin-right: auto;
}
#timeline .section-heading h3.heading-accent { font-size: min(clamp(32px, 4vw, 56px), 4.95vw); }
#virtues .section-heading h3.heading-accent { font-size: min(clamp(32px, 4vw, 56px), 3.93vw); }
#academic .section-heading h3.heading-accent { font-size: min(clamp(32px, 4vw, 56px), 3.53vw); }

@media (max-width: 430px) {
  #timeline .section-heading h3.heading-accent,
  #virtues .section-heading h3.heading-accent,
  #academic .section-heading h3.heading-accent {
    white-space: normal;
    text-wrap: balance;
    max-width: 20ch;
    font-size: clamp(23px, 6.4vw, 32px);
  }
}



.threshold, .farewell {
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
}
.threshold-inner, .farewell-inner {
  display: block;
  width: 100%;
  max-width: none;
  text-align: center;
}
.threshold-line, .threshold-title, .threshold-names,
.farewell-line, .farewell-names, .farewell-blessing,
.closed-screen h1, .closed-names, .closed-note {
  display: block;
  width: 100%;
  margin-left: 0;
  margin-right: 0;
  text-align: center;
  text-align-last: center;
}
.threshold-actions, .farewell-actions {
  display: flex;
  width: 100%;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
}
.closed-screen { display: block; text-align: center; padding: 40px 16px; }
.closed-diya { margin: 0 auto; }


.closed-names {
  font-family: 'High Tower Text', 'Cormorant Garamond', 'Book Antiqua',
               'Palatino Linotype', Palatino, Georgia, serif;
  font-style: italic;
  font-size: clamp(26px, 3.8vw, 50px);
}
.closed-screen h1 {
  font-family: 'High Tower Text', 'Cormorant Garamond', 'Book Antiqua',
               'Palatino Linotype', Palatino, Georgia, serif;
  font-size: clamp(17px, 2vw, 27px);
  order: 2;
}




#sacred .lede.dedication-plain {
  display: block;
  width: 100%;
  max-width: none;
  
  white-space: normal;
  text-wrap: balance;
  text-align: center;
  text-align-last: center;
  font-size: min(clamp(23px, 2.4vw, 27px), 1.73vw);
  line-height: 1.7;
}
@media (max-width: 860px) {
  #sacred .lede.dedication-plain {
    white-space: normal;
    font-size: clamp(18px, 2.8vw, 22px);
    text-wrap: pretty;
    max-width: 44ch;
    margin-left: auto;
    margin-right: auto;
  }
}


#legacy .section-heading p.lede-italic,
#legacy p.lede.lede-italic {
  display: block;
  width: 100%;
  max-width: none;
  
  white-space: normal;
  text-wrap: balance;
  text-align: center;
  text-align-last: center;
  font-size: min(clamp(23px, 2.4vw, 27px), 2.05vw);
  margin-left: 0;
  margin-right: 0;
}
@media (max-width: 780px) {
  #legacy .section-heading p.lede-italic,
  #legacy p.lede.lede-italic {
    white-space: normal;
    font-size: clamp(18px, 3vw, 22px);
    text-wrap: balance;
    max-width: 38ch;
    margin-left: auto;
    margin-right: auto;
  }
}


.topbar {
  justify-content: center;
  flex-wrap: wrap;
  text-align: center;
  position: sticky;              
}


.brand {
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
}
.brand-text {
  display: grid;
  justify-items: center;
  text-align: center;
}
.brand strong, .brand em { display: block; text-align: center; }


.nav-links {
  justify-content: center;
  flex-wrap: wrap;
  text-align: center;
}
.nav-links a,
.nav-links .nav-exit-btn,
.nav-links .admin-link {
  text-align: center;
  justify-content: center;
}


@media (max-width: 980px) {
  
  .topbar { position: sticky; justify-content: center; }
  .menu-toggle {
    position: absolute;
    right: clamp(12px, 4vw, 40px);
    top: 50%;
    transform: translateY(-50%);
  }
  .nav-links {
    align-items: center;
    text-align: center;
  }
  .nav-links a,
  .nav-links .nav-exit-btn {
    width: 100%;
    text-align: center;
    justify-content: center;
  }
}


.topbar {
  position: sticky;
  padding-top: 12px;
  padding-bottom: 12px;
  padding-left: clamp(16px, 3vw, 48px);
  padding-right: clamp(16px, 3vw, 48px);
  overflow: visible;
}
@media (max-width: 980px) {
  .menu-toggle { right: clamp(12px, 4vw, 40px); }
}


.help-subsection {
  margin-top: 16px;
  padding-top: 14px;
  
  border-top: 0;
  position: relative;
}

.help-subsection::before {
  content: "";
  position: absolute;
  top: -1px;
  left: 0;
  right: 0;
  width: auto;
  height: 3px;
  border-radius: 0 0 3px 3px;
  background: linear-gradient(90deg, var(--heading), var(--gold), var(--teal));
  opacity: 0.9;
  pointer-events: none;
}
.help-subheading {
  margin: 0 0 6px;
  font-family: var(--font-body);
  font-size: 15px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--heading);
}
.help-subsection p {
  margin: 0;
  font-size: 15px;
  line-height: 1.7;
  color: var(--text);
}




.pub-cite-cell { white-space: nowrap; }
.pub-cite {
  font: inherit; font-size: 12.5px; font-weight: 700;
  padding: 5px 13px; border-radius: 99px; cursor: pointer;
  border: 1px solid var(--line); background: oklch(1 0 0 / 0.6); color: var(--heading);
  transition: transform 0.28s var(--ease-spring), background 0.24s, color 0.24s, border-color 0.24s;
}
.pub-cite:hover {
  background: linear-gradient(135deg, var(--heading), var(--copper));
  color: #fff; border-color: transparent; transform: translateY(-2px) scale(1.05);
}
.pub-cite:active { transform: translateY(0) scale(0.96); }
.pub-title { min-width: 220px; }
.pub-doi {
  display: inline-block; margin-top: 3px; font-size: 12px; font-weight: 700;
  color: var(--accent-strong); text-decoration: none; letter-spacing: 0.02em;
}
.pub-doi:hover { text-decoration: underline; }
.pub-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 14px; }
.pub-export { font-size: 13px; padding: 9px 18px; }


.cite-modal {
  max-width: 620px; width: min(620px, 92vw); padding: 30px 32px 26px;
  border: 0; border-radius: var(--radius); background: var(--cream);
  box-shadow: 0 40px 120px rgba(0,0,0,0.35);
}
.cite-modal::backdrop { background: oklch(0.2 0.04 50 / 0.55); backdrop-filter: blur(4px); }
.cite-kicker {
  margin: 0 0 4px; font-size: 12px; font-weight: 900; letter-spacing: 0.2em;
  text-transform: uppercase; color: var(--copper);
}
.cite-modal h3 {
  margin: 0 0 4px; font-family: var(--font-display); font-weight: 700;
  font-size: clamp(19px, 2.4vw, 25px); line-height: 1.25; color: var(--heading-strong);
  text-align: left;
}
.cite-meta { margin: 0 0 16px; font-size: 13.5px; color: var(--muted); }
.cite-tabs { display: flex; gap: 7px; margin-bottom: 12px; flex-wrap: wrap; }
.cite-tab {
  font: inherit; font-size: 13px; font-weight: 700; padding: 7px 17px;
  border-radius: 99px; cursor: pointer; border: 1px solid var(--line);
  background: oklch(1 0 0 / 0.6); color: var(--heading);
  transition: transform 0.28s var(--ease-spring), background 0.24s, color 0.24s;
}
.cite-tab:hover { transform: translateY(-2px); }
.cite-tab.active {
  background: linear-gradient(135deg, var(--heading), var(--copper));
  color: #fff; border-color: transparent;
}
#citeText {
  width: 100%; font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 13px; line-height: 1.6; padding: 14px 15px; resize: vertical;
  border: 1px solid var(--line); border-radius: 14px;
  background: oklch(1 0 0 / 0.72); color: var(--text);
}
#citeText:focus { outline: 3px solid var(--accent); outline-offset: 2px; }
.cite-actions { display: flex; gap: 10px; margin-top: 14px; flex-wrap: wrap; }
.cite-note { margin: 12px 0 0; font-size: 12.5px; color: var(--muted); }


.capsule-grid {
  display: grid; gap: 18px; max-width: 1000px; margin: 0 auto;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
}
.capsule-empty { text-align: center; color: var(--muted); font-style: italic; grid-column: 1 / -1; }
.capsule-card {
  position: relative; padding: 22px 24px; border-radius: 22px;
  background: var(--panel); border: 1px solid var(--line);
  box-shadow: var(--soft); overflow: hidden;
  transition: transform 0.34s var(--ease-spring), box-shadow 0.34s var(--ease-soft);
}
.capsule-card:hover { transform: translateY(-4px); box-shadow: var(--shadow); }
.capsule-card::before {
  content: ""; position: absolute; inset: 0 0 auto 0; height: 3px;
  background: linear-gradient(90deg, var(--heading), var(--gold), var(--teal));
}
.capsule-head { display: flex; gap: 13px; align-items: flex-start; }
.capsule-head h4 { margin: 0 0 2px; font-size: 18px; color: var(--heading-strong); }
.capsule-for { margin: 0; font-size: 13px; font-style: italic; color: var(--muted); }
.capsule-seal {
  flex: 0 0 40px; width: 40px; height: 40px; border-radius: 50%;
  display: grid; place-items: center; color: #fff;
  background: linear-gradient(135deg, var(--heading), var(--copper));
  box-shadow: 0 6px 16px oklch(0.5 0.13 55 / 0.35);
}
.capsule-seal svg { width: 20px; height: 20px; }
.capsule-card.is-open .capsule-seal {
  background: linear-gradient(135deg, var(--gold), #f6e3ac); color: var(--heading-strong);
}


.capsule-locked {
  margin-top: 16px; padding: 16px; border-radius: 14px; text-align: center;
  background: repeating-linear-gradient(45deg,
    oklch(0.46 0.09 55 / 0.05) 0 8px, transparent 8px 16px);
  border: 1px dashed var(--line);
}
.capsule-opens { margin: 0 0 5px; font-size: 14px; color: var(--muted); }
.capsule-opens strong { color: var(--heading); }
.capsule-count {
  margin: 0; font-family: var(--font-display); font-weight: 700;
  font-size: clamp(19px, 2.4vw, 26px); color: var(--heading-strong);
  font-variant-numeric: tabular-nums;
}

.capsule-card.is-open { background: var(--panel2); }
.capsule-body { margin-top: 15px; }
.capsule-body p {
  margin: 0 0 10px; font-family: var(--font-display); font-size: 17px;
  line-height: 1.75; color: var(--text);
}
.capsule-meta { margin: 14px 0 0; font-size: 12.5px; color: var(--muted); letter-spacing: 0.03em; }
.capsule-note {
  max-width: 620px; margin: 26px auto 0; text-align: center;
  font-size: 13.5px; line-height: 1.7; color: var(--muted);
}

@media (max-width: 620px) {
  .cite-modal { padding: 24px 20px 20px; }
  .capsule-card { padding: 18px 18px; }
}
@media (prefers-reduced-motion: reduce) {
  .capsule-card, .pub-cite, .cite-tab { transition: none !important; transform: none !important; }
}
@media print { .pub-cite-cell, .pub-actions, .cite-modal { display: none !important; } }


.seal-field {
  margin-top: 16px; padding: 16px 18px; border-radius: 16px;
  background: oklch(1 0 0 / 0.5); border: 1px dashed var(--line);
}
.seal-label { display: flex; gap: 12px; align-items: flex-start; cursor: pointer; }
.seal-label strong { display: block; font-size: 15px; color: var(--heading); }
.seal-label em { display: block; font-size: 13px; font-style: normal; color: var(--muted); margin-top: 2px; }
.seal-icon {
  flex: 0 0 34px; width: 34px; height: 34px; border-radius: 50%;
  display: grid; place-items: center; color: #fff;
  background: linear-gradient(135deg, var(--heading), var(--copper));
}
.seal-icon svg { width: 17px; height: 17px; }
.seal-input {
  margin-top: 12px; width: 100%; max-width: 260px;
  padding: 11px 14px; font: inherit; font-size: 15px;
  border: 1px solid var(--line); border-radius: 12px;
  background: oklch(1 0 0 / 0.85); color: var(--text);
}
.seal-input:focus { outline: 3px solid var(--accent); outline-offset: 2px; border-color: var(--accent); }
.seal-help { margin: 10px 0 0; font-size: 13px; line-height: 1.65; color: var(--muted); }
.capsule-quiet { font-style: italic; color: var(--muted); }
.capsule-card .capsule-from-visitor { font-size: 12px; color: var(--copper); }



.threshold-names, .farewell-names {
  font-family: 'High Tower Text', 'Cormorant Garamond', 'Book Antiqua',
               'Palatino Linotype', Palatino, Georgia, serif;
  font-style: normal;
  font-weight: 700;
  width: auto;
  max-width: none;
  margin-left: auto;
  margin-right: auto;
  text-align: center;
  text-wrap: nowrap;
}

@media (max-width: 900px) {
  .threshold-names, .farewell-names {
    text-wrap: balance;
    max-width: 16ch;
  }
}


.threshold-art { position: absolute; inset: 0; pointer-events: none; z-index: 0; }
.threshold-inner::before {
  
  content: ''; position: absolute; inset: -6% -5%;
  background: radial-gradient(ellipse at 50% 50%,
    rgba(12, 5, 16, 0.42) 0%, rgba(12, 5, 16, 0.28) 46%, transparent 74%);
  filter: blur(26px); z-index: -1; pointer-events: none;
}
.threshold-inner {
  position: relative; z-index: 1;
  width: 100%; max-width: 100%; box-sizing: border-box;
  margin-left: auto; margin-right: auto;
  text-align: center;
}

.t-mandala { position: absolute; display: block; opacity: 0;
  animation: tmIn 1.6s var(--ease-soft) 0.2s both; }
.t-mandala .tm-art {
  position: absolute; inset: 15%;          
  display: block; overflow: visible;
  
  color: #b8761f;
  filter: drop-shadow(0 0 7px rgba(184, 118, 31, 0.9))
          drop-shadow(0 0 16px rgba(255, 190, 90, 0.35));
  animation: mandalaTurn 74s linear infinite;
}
@keyframes tmIn { to { opacity: 1; } }

.tm--tr { top: 0; right: 0; width: clamp(215px, 30vw, 500px); height: clamp(215px, 30vw, 500px);
  transform: translate(34%, -34%); }
.tm--bl .tm-art { animation-direction: reverse; }


.tm-under {
  inset: -12% !important;                
  width: auto !important; height: auto !important;
  color: #e8c98a;                    
  opacity: 0.36;
  animation-duration: 108s !important;
  animation-direction: reverse !important;
}
.tm--bl .tm-under { animation-direction: normal !important; color: #e8c98a; }
.tm--bl { bottom: 0; left: 0; width: clamp(215px, 30vw, 500px); height: clamp(215px, 30vw, 500px);
  transform: translate(-34%, 34%); }
.t-mandala .mandala-glow { z-index: -1; }


.t-spark {
  position: absolute; top: 6%; left: 7%;
  width: clamp(58px, 6vw, 104px); height: clamp(58px, 6vw, 104px);
  overflow: visible;
  filter: drop-shadow(0 0 14px rgba(255, 240, 190, 0.85));
  opacity: 0;
  animation: tmIn 1.6s var(--ease-soft) 0.3s both,
             sparkTwinkle 6.5s ease-in-out 3.2s infinite;
}
@keyframes sparkTwinkle {
  0%, 100% { opacity: .95; transform: scale(1) rotate(0deg); }
  50%      { opacity: .55; transform: scale(.86) rotate(18deg); }
}

.t-gem {
  position: absolute; right: 5%; bottom: 7%;
  width: clamp(40px, 4.2vw, 76px); height: clamp(40px, 4.2vw, 76px);
  overflow: visible;
  filter: drop-shadow(0 0 16px rgba(240, 226, 255, 0.8));
  opacity: 0;
  animation: tmIn 1.6s var(--ease-soft) 0.45s both,
             pearlGlow 8.2s ease-in-out 3.6s infinite;
}
@keyframes pearlGlow {
  0%, 100% { opacity: .95; transform: scale(1) rotate(0deg); }
  50%      { opacity: .58; transform: scale(.9) rotate(-14deg); }
}

@media (max-width: 700px) {
  .tm--tr, .tm--bl { width: clamp(165px, 44vw, 235px); height: clamp(165px, 44vw, 235px); }
  .t-spark { width: 48px; height: 48px; }
  .t-gem { width: 28px; height: 28px; }
}
@media (prefers-reduced-motion: reduce) {
  .t-mandala, .t-mandala .tm-art, .t-spark, .t-gem { animation: none !important; opacity: 1; }
}



.farewell-names {
  font-size: min(clamp(20px, 1.05vw, 24px), 1.05vw) !important;
  letter-spacing: 0.05em;
}
@media (max-width: 900px) {
  .farewell-names { font-size: clamp(17px, 4.4vw, 22px) !important; }
}


.rw {
  display: inline-block;
  opacity: 0;
  will-change: transform, opacity, filter;
  animation-duration: 1.15s;
  animation-timing-function: var(--ease-soft);
  animation-fill-mode: both;
}
.rw--1 { animation-name: rwRise; }
.rw--2 { animation-name: rwBlur; }
.rw--3 { animation-name: rwScale; }
.rw--4 { animation-name: rwLeft; }
.rw--5 { animation-name: rwRight; }
.rw--6 { animation-name: rwTurn; }

@keyframes rwRise  { from { opacity: 0; transform: translateY(26px); }
                     to   { opacity: 1; transform: none; } }
@keyframes rwBlur  { from { opacity: 0; filter: blur(11px); transform: translateY(8px); }
                     to   { opacity: 1; filter: blur(0);     transform: none; } }
@keyframes rwScale { from { opacity: 0; transform: scale(0.62); }
                     to   { opacity: 1; transform: none; } }
@keyframes rwLeft  { from { opacity: 0; transform: translateX(-34px); }
                     to   { opacity: 1; transform: none; } }
@keyframes rwRight { from { opacity: 0; transform: translateX(34px); }
                     to   { opacity: 1; transform: none; } }
@keyframes rwTurn  { from { opacity: 0; transform: rotate(-7deg) translateY(20px) scale(0.86); }
                     to   { opacity: 1; transform: none; } }


@media (prefers-reduced-motion: reduce) {
  .rw { animation: none !important; opacity: 1 !important; filter: none !important; transform: none !important; }
}


:root {
  --font-dedication: 'EB Garamond', 'Cormorant Garamond', Georgia, serif;
  --font-names:      'Cinzel', 'Trajan Pro', Georgia, serif;
  --font-hero:       'Playfair Display', 'Georgia', 'Times New Roman', serif;
  --size-screen-head: min(clamp(30px, 2.9vw, 62px), 2.48vw);
}
.threshold-line, .farewell-line {
  font-family: var(--font-dedication) !important;
  font-size: var(--size-screen-head) !important;
}
.threshold-names, .farewell-names {
  font-family: var(--font-names) !important;
  font-weight: 500 !important;
  font-style: normal !important;
  letter-spacing: 0.06em;
}
.threshold-title, .farewell-blessing {
  font-family: var(--font-hero) !important;
  font-weight: 900 !important;
  font-size: var(--size-screen-head) !important;
  letter-spacing: -0.004em;
}

.farewell-names { font-size: min(clamp(20px, 1.05vw, 24px), 1.05vw) !important; }
@media (max-width: 900px) {
  :root { --size-screen-head: clamp(26px, 5.2vw, 40px); }
  .farewell-names { font-size: clamp(15px, 3.6vw, 19px) !important; }
}


.heading-accent,
h1.heading-accent, h2.heading-accent, h3.heading-accent,
.split-title,
.sacred-content h1, .sacred-content h2,
.section-heading h2, .section-heading h3 {
  font-family: var(--font-hero) !important;
  font-weight: 900 !important;
  
  letter-spacing: -0.006em;
}



:root {
  --br-gold:      #e8c162;
  --br-gold-lo:   #b8801f;
  --br-gold-hi:   #fff0b8;
  --br-len:       clamp(26px, 4.2vw, 54px);   
  --br-thick:     3px;                        
  --br-notch:     0.42;                       
  --br-gap:       clamp(6px, 1vw, 12px);      
}

.photo-brackets { position: relative; }
.photo-brackets > .br {
  position: absolute;
  width: var(--br-len);
  height: var(--br-len);
  pointer-events: none;
  z-index: 2;
  color: var(--br-gold);
  filter: drop-shadow(0 0 6px rgba(232, 193, 98, 0.75))
          drop-shadow(0 0 15px rgba(255, 199, 92, 0.38));
  animation: brGlow 6.5s ease-in-out infinite;
}
.photo-brackets > .br svg { display: block; width: 100%; height: 100%; overflow: visible; }

.br--tl { top: calc(var(--br-gap) * -1); left:  calc(var(--br-gap) * -1); }
.br--tr { top: calc(var(--br-gap) * -1); right: calc(var(--br-gap) * -1); transform: scaleX(-1); }
.br--bl { bottom: calc(var(--br-gap) * -1); left:  calc(var(--br-gap) * -1); transform: scaleY(-1); }
.br--br { bottom: calc(var(--br-gap) * -1); right: calc(var(--br-gap) * -1); transform: scale(-1, -1); }


@keyframes brGlow {
  0%, 100% { filter: drop-shadow(0 0 4px  rgba(232, 193, 98, 0.55))
                     drop-shadow(0 0 11px rgba(255, 199, 92, 0.25)); }
  50%      { filter: drop-shadow(0 0 9px  rgba(255, 214, 130, 0.95))
                     drop-shadow(0 0 22px rgba(255, 199, 92, 0.55)); }
}


.photo-brackets img,
.photo-brackets .gv-img,
.photo-brackets > picture img {
  border-radius: 2px;
  box-shadow: 0 10px 30px rgba(30, 15, 0, 0.22),
              0 0 0 1px rgba(120, 78, 20, 0.28);
}


.photo-shot { position: relative; display: inline-block; line-height: 0; max-width: 100%; }
.photo-shot > img { display: block; max-width: 100%; }

.tl-photo-cluster { overflow: visible; }
.timeline-item, .timeline-photo { overflow: visible; }


.gv-frame.photo-brackets { --br-len: clamp(34px, 5vw, 76px); --br-thick: 4px; --br-gap: clamp(8px, 1.2vw, 16px); }

.tl-photo-item .photo-shot { --br-len: 22px; --br-thick: 2px; --br-gap: 3px; }
.foundation-photo-wrap, .photo-shot { display: inline-block; }
.photo-shot:has(> .foundation-photo) { display: block; --br-len: clamp(28px, 4vw, 56px); }

.photo-shot:has(> .temple-img-full) {
  display: block; --br-len: clamp(38px, 5.5vw, 84px); --br-thick: 4px; --br-gap: clamp(9px, 1.3vw, 18px);
}
.photo-shot > .temple-img-full { width: 100%; height: auto; }

.gallery-card .photo-shot { display: block; --br-len: 20px; --br-thick: 2px; --br-gap: 3px; }

@media (prefers-reduced-motion: reduce) {
  .photo-brackets > .br { animation: none !important;
    filter: drop-shadow(0 0 6px rgba(232, 193, 98, 0.7)); }
}


:root { --saffron-deep: #8c1c13; --saffron-lit: #e2624f; }
.heading-accent,
h1.heading-accent, h2.heading-accent, h3.heading-accent,
.split-title,
.sacred-content h1, .sacred-content h2,
.section-heading h2, .section-heading h3 {
  color: var(--saffron-deep) !important;
}
.threshold-title, .farewell-blessing {
  color: var(--saffron-lit) !important;
  text-shadow: 0 0 26px rgba(239, 154, 61, 0.55),
               0 3px 9px rgba(30, 10, 4, 0.9),
               0 1px 3px rgba(20, 6, 2, 0.95) !important;
}


.btn, .btn.primary, .btn.ghost, .filter-chip, .virtue-btn, .tab, .cite-tab,
.help-toggle, .threshold-btn, .nav-exit-btn, .filter-btn, .to-top {
  position: relative;
  overflow: hidden;
  font-family: var(--font-body) !important;
  font-weight: 600;
  letter-spacing: 0.02em;
  
  color: #4a2708 !important;
  
  background:
    linear-gradient(180deg,
      #f7dc93 0%, #e0b348 16%, #c8912c 42%,
      #a97418 60%, #c9942f 82%, #e6c168 100%) !important;
  border: 1px solid #7d5410 !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 246, 214, 0.85),
    inset 0 -1px 0 rgba(90, 56, 6, 0.6),
    inset 0 0 0 1px rgba(255, 232, 170, 0.28),
    0 3px 10px rgba(60, 34, 4, 0.30),
    0 0 12px rgba(232, 176, 74, 0.35);
  border-radius: 999px;
  cursor: pointer;
  text-decoration: none;
  transition: transform 0.25s var(--ease), box-shadow 0.25s var(--ease),
              background 0.25s var(--ease), color 0.25s var(--ease);
  text-shadow: 0 1px 0 rgba(255, 240, 196, 0.75);
}

.btn::after, .filter-chip::after, .virtue-btn::after, .tab::after,
.cite-tab::after, .help-toggle::after, .threshold-btn::after,
.nav-exit-btn::after, .to-top::after {
  content: "";
  position: absolute; inset: -50% auto -50% -30%;
  width: 30%;
  background: linear-gradient(90deg,
    transparent, rgba(255, 248, 214, 0.75), rgba(255, 236, 176, 0.35), transparent);
  transform: translateX(0) rotate(25deg);
  animation: sweep 5.4s cubic-bezier(0.45, 0, 0.55, 1) infinite;
  will-change: transform;
  pointer-events: none;
}

.btn, .filter-chip, .virtue-btn, .tab, .cite-tab, .help-toggle,
.threshold-btn, .nav-exit-btn, .to-top {
  animation: btnGlow 5.6s ease-in-out infinite;
}
@keyframes btnGlow {
  0%, 100% { box-shadow:
      inset 0 1px 0 rgba(255, 246, 214, 0.85),
      inset 0 -1px 0 rgba(90, 56, 6, 0.6),
      inset 0 0 0 1px rgba(255, 232, 170, 0.28),
      0 3px 10px rgba(60, 34, 4, 0.30),
      0 0 10px rgba(232, 176, 74, 0.30); }
  50%      { box-shadow:
      inset 0 1px 0 rgba(255, 250, 226, 0.95),
      inset 0 -1px 0 rgba(90, 56, 6, 0.55),
      inset 0 0 0 1px rgba(255, 240, 190, 0.42),
      0 3px 12px rgba(60, 34, 4, 0.30),
      0 0 24px rgba(255, 202, 96, 0.72); }
}
.btn:hover, .filter-chip:hover, .virtue-btn:hover, .tab:hover, .cite-tab:hover,
.help-toggle:hover, .threshold-btn:hover, .nav-exit-btn:hover, .to-top:hover {
  transform: translateY(-2px);
  filter: brightness(1.08);
  text-shadow: 0 1px 0 rgba(255, 246, 214, 0.9);
}
.btn:active, .filter-chip:active, .virtue-btn:active, .threshold-btn:active,
.to-top:active { transform: translateY(0) scale(0.98); }
.filter-chip.is-active, .tab.is-active, .cite-tab.is-active, .btn.primary {
  background: linear-gradient(180deg,
    #fff0bd 0%, #eec861 18%, #d9a437 44%,
    #b8801f 62%, #d9a437 84%, #f2d689 100%) !important;
}




.to-top-row { display: flex; justify-content: flex-end; margin: clamp(30px, 5vw, 60px) 0 0; }
.to-top {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 10px 22px; font-size: 15px;
}
.to-top .arw { font-size: 15px; line-height: 1; transform: translateY(-1px); }
@media (prefers-reduced-motion: reduce) {
  .btn::after, .filter-chip::after, .to-top::after, .threshold-btn::after { animation: none; }
  .btn, .filter-chip, .virtue-btn, .tab, .cite-tab, .help-toggle,
  .threshold-btn, .nav-exit-btn, .to-top { animation: none !important; }
  .btn:hover, .to-top:hover, .threshold-btn:hover { transform: none; }
}



.portrait-card-fullimg {
  background: #f6ead0 !important;
  min-height: clamp(320px, 34vw, 520px);
  aspect-ratio: 16 / 9;
  box-shadow: 0 22px 60px rgba(30, 15, 0, 0.18);
  overflow: hidden;
}
.portrait-card-fullimg > picture { display: block; line-height: 0; width: 100%; height: 100%; }
.portrait-card-fullimg .photo-shot { display: block; width: 100%; height: 100%; }

.temple-img-full {
  position: static !important;
  inset: auto !important;
  width: 100%;
  height: 100% !important;
  object-fit: cover !important;
  border-radius: 26px !important;
  display: block;
}


[data-story], .mode-chip, #tourNext, #tourClose, #galleryPrev, #galleryNext,
.gallery-nav button, .modal-close, .story-close {
  position: relative;
  overflow: hidden;
  font-family: var(--font-body) !important;
  font-weight: 600;
  letter-spacing: 0.02em;
  color: #4a2708 !important;
  background:
    linear-gradient(180deg,
      #f7dc93 0%, #e0b348 16%, #c8912c 42%,
      #a97418 60%, #c9942f 82%, #e6c168 100%) !important;
  border: 1px solid #7d5410 !important;
  border-radius: 999px;
  padding: 10px 22px;
  cursor: pointer;
  text-decoration: none;
  text-shadow: 0 1px 0 rgba(255, 240, 196, 0.75);
  transition: transform 0.25s var(--ease), filter 0.25s var(--ease);
  animation: btnGlow 5.6s ease-in-out infinite;
}
[data-story]::after, .mode-chip::after, #tourNext::after, #tourClose::after,
.modal-close::after, .story-close::after {
  content: "";
  position: absolute; inset: -50% auto -50% -30%;
  width: 30%;
  background: linear-gradient(90deg,
    transparent, rgba(255, 248, 214, 0.75), rgba(255, 236, 176, 0.35), transparent);
  transform: translateX(0) rotate(25deg);
  animation: sweep 5.4s cubic-bezier(0.45, 0, 0.55, 1) infinite;
  will-change: transform;
  pointer-events: none;
}
[data-story]:hover, .mode-chip:hover, #tourNext:hover, #tourClose:hover,
.modal-close:hover, .story-close:hover {
  transform: translateY(-2px);
  filter: brightness(1.08);
}
[data-story]:active, .mode-chip:active { transform: translateY(0) scale(0.98); }
.mode-chip[aria-pressed="true"] {
  background: linear-gradient(180deg,
    #fff0bd 0%, #eec861 18%, #d9a437 44%,
    #b8801f 62%, #d9a437 84%, #f2d689 100%) !important;
}

.modal-close, .story-close { padding: 0; width: 38px; height: 38px; border-radius: 50%; }
@media (prefers-reduced-motion: reduce) {
  [data-story], .mode-chip, #tourNext, #tourClose, .modal-close, .story-close { animation: none !important; }
  [data-story]::after, .mode-chip::after { animation: none; }
}



.card, .timeline-item, .form-card, .tribute-card, .admin-panel,
.help-card, .virtue-card, .gallery-card, .capsule-card, .empty-state,
.tributes-list > *, .story-copy, .pub-panel {
  border-radius: 32px !important;
  border: 1px solid rgba(212, 160, 58, 0.45) !important;
  box-shadow: 0 22px 60px rgba(30, 15, 0, 0.18) !important;
  background: linear-gradient(180deg, #fffdf6, #f7eeda) !important;
}


.card, .timeline-item, .form-card, .tribute-card, .tribute-placeholder-card,
.tribute-form, .dedication-strip, .admin-panel, .admin-tribute, .help-card,
.virtue-card, .gallery-card, .capsule-card, .capsule-empty, .empty-state,
.tributes-list > *, .pub-panel, .preview-state, .foundation-shell, .dossier-shell {
  border-radius: 32px !important;
  border: 1px solid rgba(212, 160, 58, 0.45) !important;
  box-shadow: 0 22px 60px rgba(30, 15, 0, 0.18) !important;
  background: linear-gradient(180deg, #fffdf6, #f7eeda) !important;
  position: relative;
}
.card::before, .timeline-item::before, .form-card::before, .tribute-card::before,
.tribute-placeholder-card::before, .tribute-form::before, .dedication-strip::before,
.admin-panel::before, .admin-tribute::before, .help-card::before, .virtue-card::before,
.gallery-card::before, .capsule-card::before, .capsule-empty::before, .empty-state::before,
.tributes-list > *::before, .pub-panel::before, .preview-state::before,
.foundation-shell::before, .dossier-shell::before {
  content: ""; position: absolute; top: 0; left: 26px; right: 26px; bottom: auto;
  height: 3px; width: auto; inset-inline: 26px;
  background: linear-gradient(90deg, var(--heading), var(--gold), var(--teal)) !important;
  border-radius: 0 0 3px 3px; opacity: 0.9; pointer-events: none; z-index: 3;
}



.field-row.field-row-3 {
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px; align-items: end;
  background: none !important; border: 0 !important; box-shadow: none !important;
  border-radius: 0 !important; padding: 0; margin-bottom: 18px;
}
.field-row.field-row-3::before { display: none !important; }
.tribute-write .message-field { margin: 0; }
.tribute-write .message-field textarea { min-height: 340px; line-height: 1.65; }
.tribute-write .char-meter { margin-top: 10px; }
.tribute-write > small { display: block; margin-top: 6px; color: var(--muted); }
.tribute-media .seal-field { margin-top: 20px; }
.submit-row {
  display: flex; justify-content: center; margin-top: 26px;
}
.submit-row .btn { min-width: 320px; justify-content: center; text-align: center; }
.tribute-form .preview-state { margin-top: 26px; }
@media (max-width: 900px) {
  .field-row.field-row-3 { grid-template-columns: 1fr; gap: 14px; }
  .submit-row .btn { min-width: 0; width: 100%; }
}


.tribute-grid { align-items: stretch; }
.tribute-write, .tribute-media { display: flex; flex-direction: column; min-width: 0; }
.tribute-write .message-field {
  flex: 1 1 auto; display: grid; grid-template-rows: auto 1fr; min-height: 0;
}
.tribute-write .message-field textarea { height: 100%; min-height: 340px; }
.tribute-media .upload-grid, .tribute-media .tracker-state { flex: 0 0 auto; }
.tribute-media .seal-field { margin-top: auto; }


.hero-layout > * { min-width: 0; }
.portrait-card.portrait-card-fullimg,
.portrait-card-fullimg {
  width: 100%; max-width: 100%;
  min-height: 0 !important;
  height: auto !important;
  aspect-ratio: 16 / 9;
}
.portrait-card-fullimg > picture,
.portrait-card-fullimg .photo-shot,
.portrait-card-fullimg .temple-img-full { max-width: 100%; }


.approved-grid article::before,
.approved-grid > *::before {
  content: "" !important; position: absolute; top: 0; left: 26px; right: 26px;
  bottom: auto; height: 3px; width: auto; font: inherit;
  background: linear-gradient(90deg, var(--heading), var(--gold), var(--teal)) !important;
  border-radius: 0 0 3px 3px; opacity: 0.9; pointer-events: none; z-index: 3;
}
.approved-grid article::after {
  content: "\201C"; position: absolute; right: 14px; top: -8px;
  font: 700 80px var(--font-display); color: rgba(212, 160, 58, 0.12);
  pointer-events: none;
}
.approved-grid > * {
  position: relative;
  border-radius: 32px !important;
  border: 1px solid rgba(212, 160, 58, 0.45) !important;
  box-shadow: 0 22px 60px rgba(30, 15, 0, 0.18) !important;
  background: linear-gradient(180deg, #fffdf6, #f7eeda) !important;
}



.threshold .mandala-glow,
.farewell .mandala-glow,
.t-mandala .mandala-glow {
  display: block !important;
  animation: mandalaGlow cubic-bezier(0.42, 0, 0.58, 1) infinite !important;
  opacity: 1;
}


.threshold-names {
  font-size: min(clamp(32px, 1.6vw, 37px), calc(1.58vw + 3px)) !important;
}
.threshold-title {
  font-size: min(clamp(33px, 2.9vw, 65px), calc(2.48vw + 3px)) !important;
}
.farewell-names {
  font-size: min(clamp(23px, 1.05vw, 27px), calc(1.05vw + 3px)) !important;
}
@media (max-width: 900px) {
  .threshold-names { font-size: clamp(27px, 6.6vw, 34px) !important; }
  .threshold-title { font-size: clamp(29px, 5.2vw, 43px) !important; }
  .farewell-names  { font-size: clamp(18px, 3.6vw, 22px) !important; }
}


.farewell-names {
  font-size: min(clamp(26px, 1.05vw, 30px), calc(1.05vw + 6px)) !important;
}
.farewell-blessing {
  font-size: min(clamp(33px, 2.9vw, 65px), calc(2.48vw + 3px)) !important;
}
@media (max-width: 900px) {
  .farewell-names    { font-size: clamp(21px, 3.6vw, 25px) !important; }
  .farewell-blessing { font-size: clamp(29px, 5.2vw, 43px) !important; }
}


:root {
  --marigold:      #ffc14a;   
  --marigold-lit:  #ffdc95;   
  --marigold-pale: #fff1cd;   
  --lotus:         #3a1a48;   
  --lotus-deep:    #241030;
  --lotus-night:   #140719;
}
.threshold, .farewell {
  background:
    radial-gradient(ellipse 46% 38% at 50% 40%,  rgba(255, 193, 74, 0.22), transparent 64%),
    radial-gradient(ellipse 70% 62% at  6%  4%,  rgba(255, 193, 74, 0.15), transparent 62%),
    radial-gradient(ellipse 78% 70% at 96% 98%,  rgba( 36, 16, 48, 0.74), transparent 66%),
    radial-gradient(ellipse 128% 104% at 50% 50%, transparent 40%, rgba(20, 7, 25, 0.80) 100%),
    linear-gradient(116deg,
      #2b1236 0%, #3a1a48 24%, #4a2159 50%, #2b1236 76%, #140719 100%) !important;
  background-color: var(--lotus-night) !important;
}

.threshold-inner::before, .farewell-inner::before {
  background: radial-gradient(ellipse at 50% 50%,
    rgba(20, 7, 25, 0.46) 0%, rgba(20, 7, 25, 0.30) 46%, transparent 74%) !important;
}

.threshold-line, .farewell-line {
  color: var(--marigold) !important;
  text-shadow: 0 0 22px rgba(255, 193, 74, 0.45),
               0 2px 7px rgba(20, 7, 25, 0.94),
               0 1px 2px rgba(20, 7, 25, 0.98) !important;
}

.threshold-title, .farewell-blessing {
  color: var(--marigold-lit) !important;
  text-shadow: 0 0 26px rgba(255, 193, 74, 0.55),
               0 3px 9px rgba(20, 7, 25, 0.92),
               0 1px 3px rgba(20, 7, 25, 0.98) !important;
}

.threshold-exit {
  background: transparent !important;
  color: var(--marigold-lit) !important;
  border: 1px solid rgba(255, 193, 74, 0.34) !important;
}
.threshold-exit:hover {
  color: var(--marigold-pale) !important;
  border-color: rgba(255, 193, 74, 0.72) !important;
  background: rgba(255, 193, 74, 0.10) !important;
}


@keyframes nameGlow {
  0%, 100% {
    color: var(--marigold-lit);
    text-shadow: 0 0 12px rgba(255, 193, 74, 0.40),
                 0 0 30px rgba(255, 193, 74, 0.18),
                 0 2px 6px rgba(20, 7, 25, 0.92);
  }
  50% {
    color: var(--marigold-pale);
    text-shadow: 0 0 22px rgba(255, 220, 149, 0.90),
                 0 0 58px rgba(255, 193, 74, 0.55),
                 0 0 104px rgba(255, 193, 74, 0.28),
                 0 2px 6px rgba(20, 7, 25, 0.92);
  }
}
.threshold-names {
  color: var(--marigold-lit) !important;
  animation: riseIn 1.4s var(--ease-soft) 3.0s both,
             nameGlow 5.2s ease-in-out 4.4s infinite !important;
}
.farewell-names {
  color: var(--marigold-lit) !important;
  animation: riseIn 1.3s var(--ease-soft) 0.6s both,
             nameGlow 5.2s ease-in-out 4.3s infinite !important;
}
@media (prefers-reduced-motion: reduce) {
  .threshold-names, .farewell-names {
    animation: none !important;
    color: var(--marigold-lit) !important;
    text-shadow: 0 0 18px rgba(255, 193, 74, 0.5), 0 2px 6px rgba(20, 7, 25, 0.92) !important;
  }
}


.threshold-names, .farewell-names {
  font-weight: 900 !important;
  -webkit-text-stroke: 0.7px currentColor;
  paint-order: stroke fill;
}


.nav-links .nav-exit-btn {
  padding: 8px 14px !important;
  border: 0 !important;
  border-radius: 999px !important;
  background: none !important;
  box-shadow: none !important;
  animation: none !important;
  font-family: inherit !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  letter-spacing: normal !important;
  color: var(--text) !important;
  text-shadow: 0 0 8px rgba(212, 160, 58, 0.16) !important;
  cursor: pointer;
  position: relative;
  overflow: visible;
  transition: all 0.2s var(--ease), text-shadow 0.3s var(--ease);
}
.nav-links .nav-exit-btn:hover {
  background: rgba(212, 160, 58, 0.16) !important;
  color: var(--heading) !important;
  transform: translateY(-1px);
  filter: none;
  text-shadow: 0 0 12px rgba(212, 160, 58, 0.65), 0 0 3px rgba(212, 160, 58, 0.5) !important;
}

.nav-links .nav-exit-btn::after {
  content: "" !important;
  position: absolute !important;
  inset: auto auto 4px 50% !important;
  transform: translateX(-50%) !important;
  width: 0 !important; height: 2px !important;
  background: linear-gradient(90deg, var(--heading), var(--gold)) !important;
  animation: none !important;
  border-radius: 2px;
  transition: width 0.24s var(--ease-soft);
}
.nav-links .nav-exit-btn:hover::after { width: 72% !important; }


.threshold-exit, .threshold-exit:hover, .threshold-exit:active {
  border: 1px solid #7d5410 !important;
  color: #4a2708 !important;
  background: linear-gradient(180deg,
    #f7dc93 0%, #e0b348 16%, #c8912c 42%,
    #a97418 60%, #c9942f 82%, #e6c168 100%) !important;
  text-shadow: 0 1px 0 rgba(255, 240, 196, 0.75) !important;
}
.threshold-exit { animation: btnGlow 5.6s ease-in-out infinite !important; }
.threshold-exit:hover { transform: translateY(-2px); filter: brightness(1.08); }
.threshold-exit:active { transform: translateY(0) scale(0.98); }

@media (prefers-reduced-motion: reduce) {
  .threshold-exit { animation: none !important; }
}


:root {
  --ink:       #0a0806;   
  --ink-lift:  #1a1208;   
}
.threshold, .farewell {
  background:
    radial-gradient(ellipse 46% 38% at 50% 40%,  rgba(255, 193, 74, 0.26), transparent 64%),
    radial-gradient(ellipse 70% 62% at  6%  4%,  rgba(255, 193, 74, 0.17), transparent 62%),
    radial-gradient(ellipse 78% 70% at 96% 98%,  rgba(  0,  0,  0, 0.82), transparent 66%),
    radial-gradient(ellipse 128% 104% at 50% 50%, transparent 38%, rgba(0, 0, 0, 0.92) 100%),
    linear-gradient(116deg,
      #14100a 0%, #241a0c 24%, #2e2109 50%, #150f07 76%, #000000 100%) !important;
  background-color: #000000 !important;
}


.threshold-inner::before, .farewell-inner::before {
  background: radial-gradient(ellipse at 50% 50%,
    rgba(0, 0, 0, 0.58) 0%, rgba(0, 0, 0, 0.38) 46%, transparent 74%) !important;
}

.threshold-line, .farewell-line {
  color: var(--marigold) !important;
  text-shadow: 0 0 22px rgba(255, 193, 74, 0.48),
               0 2px 7px rgba(0, 0, 0, 0.96),
               0 1px 2px rgba(0, 0, 0, 1) !important;
}
.threshold-title, .farewell-blessing {
  color: var(--marigold-lit) !important;
  text-shadow: 0 0 26px rgba(255, 193, 74, 0.58),
               0 3px 9px rgba(0, 0, 0, 0.95),
               0 1px 3px rgba(0, 0, 0, 1) !important;
}

.farewell-blessing {
  color: #6b0f0f !important;
  text-shadow: 0 0 18px rgba(107, 15, 15, 0.35),
               0 3px 9px rgba(0, 0, 0, 0.95),
               0 1px 3px rgba(0, 0, 0, 1) !important;
}

.threshold-title {
  color: #6b0f0f !important;
  text-shadow: 0 0 18px rgba(107, 15, 15, 0.35),
               0 3px 9px rgba(0, 0, 0, 0.95),
               0 1px 3px rgba(0, 0, 0, 1) !important;
}
@keyframes nameGlow {
  0%, 100% {
    color: var(--marigold-lit);
    text-shadow: 0 0 12px rgba(255, 193, 74, 0.42),
                 0 0 30px rgba(255, 193, 74, 0.20),
                 0 2px 6px rgba(0, 0, 0, 0.96);
  }
  50% {
    color: var(--marigold-pale);
    text-shadow: 0 0 22px rgba(255, 220, 149, 0.92),
                 0 0 58px rgba(255, 193, 74, 0.58),
                 0 0 104px rgba(255, 193, 74, 0.30),
                 0 2px 6px rgba(0, 0, 0, 0.96);
  }
}
@media (prefers-reduced-motion: reduce) {
  .threshold-names, .farewell-names {
    text-shadow: 0 0 18px rgba(255, 193, 74, 0.55), 0 2px 6px rgba(0, 0, 0, 0.96) !important;
  }
}



.dossier-shell {
  background: none !important;
  border: 0 !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  padding: 0 !important;
  backdrop-filter: none !important;
  overflow: visible !important;
}
.dossier-shell::before, .dossier-shell::after { content: none !important; display: none !important; }



#foundation .section-heading {
  max-width: 100% !important;
  width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
}
#foundation .section-heading h2.heading-accent {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  text-align: center !important;
  margin-left: auto !important;
  margin-right: auto !important;
}



.threshold-actions, .farewell-actions {
  position: relative;
  width: fit-content !important;
  max-width: 100%;
  margin-left: auto !important;
  margin-right: auto !important;
  padding: 12px;
  border-radius: 999px;
  border: 2px solid var(--marigold, #e0b348);
  overflow: hidden;
  isolation: isolate;
}
.threshold-actions::before, .farewell-actions::before {
  content: "";
  position: absolute; inset: 0; z-index: 0;
  background: linear-gradient(90deg, #3d2a08, #6b4a0d, #a97418, #6b4a0d, #3d2a08);
  background-size: 250% 100%;
  animation: capWash 6.8s linear infinite;
  will-change: background-position;
}
.threshold-actions::after, .farewell-actions::after {
  content: "";
  position: absolute; left: 0; right: 0; bottom: 0; height: 100%; z-index: 1;
  background: linear-gradient(180deg,
    rgba(255, 241, 205, 0.40) 0%, rgba(224, 179, 72, 0.47) 6%,
    rgba(224, 179, 72, 0.27) 30%, rgba(143, 100, 20, 0.20) 100%);
  animation: capTide 6.8s cubic-bezier(0.45, 0, 0.55, 1) infinite;
  will-change: transform;
}

.threshold-actions > *, .farewell-actions > * { position: relative; z-index: 2; }
.threshold-actions, .farewell-actions { will-change: transform, box-shadow; }

@keyframes capWash { 0% { background-position: 0 0; } 100% { background-position: 250% 0; } }
@keyframes capTide {
  0%        { transform: translateY(100%); }
  45%, 55%  { transform: translateY(0); }
  100%      { transform: translateY(100%); }
}

@keyframes capRegalia {
  0%, 100% { transform: scale(1);
             box-shadow: 0 0 4px #8f6414, inset 0 0 4px #8f6414;
             border-color: #8f6414; }
  35%      { transform: scale(1.012);
             box-shadow: 0 0 20px #e0b348, inset 0 0 14px rgba(255,241,205,0.42);
             border-color: #fff1cd; }
  70%      { transform: scale(0.998);
             box-shadow: 0 0 10px #fff1cd, inset 0 0 6px #e0b348;
             border-color: #e0b348; }
}

.threshold-actions {
  animation: riseIn 1.1s var(--ease-spring) 4.0s both,
             capRegalia 6.8s cubic-bezier(0.45, 0, 0.55, 1) 5.1s infinite !important;
}
.farewell-actions {
  animation: riseIn 1.0s var(--ease-spring) 1.0s both,
             capRegalia 6.8s cubic-bezier(0.45, 0, 0.55, 1) 2.0s infinite !important;
}



.button-row {
  position: relative;
  width: fit-content !important;
  max-width: 100%;
  justify-content: center !important;
  align-items: center;
  margin-left: auto !important;
  margin-right: auto !important;
  padding: 12px;
  border-radius: 10px;
  border: 2px solid #e0b348;
  animation: rowBeatRim 6.8s cubic-bezier(0.45, 0, 0.55, 1) infinite;
  will-change: box-shadow, border-color;
}

@keyframes rowBeatRim {
  0%, 100% { border-color: #7a5510;
             box-shadow: inset 0 0 0 1px rgba(143,100,20,0.55),
                         inset 0 0 14px 4px rgba(143,100,20,0.28),
                         0 0 5px rgba(143,100,20,0.22); }
  22%      { border-color: #f2d68c;
             box-shadow: inset 0 0 0 4px rgba(224,179,72,0.95),
                         inset 0 0 42px 16px rgba(255,241,205,0.42),
                         0 0 15px rgba(224,179,72,0.42); }
  40%      { border-color: #9a6d16;
             box-shadow: inset 0 0 0 1px rgba(143,100,20,0.65),
                         inset 0 0 16px 5px rgba(143,100,20,0.34),
                         0 0 7px rgba(143,100,20,0.26); }
  64%      { border-color: #fff1cd;
             box-shadow: inset 0 0 0 5px rgba(224,179,72,1),
                         inset 0 0 48px 19px rgba(224,179,72,0.50),
                         0 0 18px rgba(255,241,205,0.46); }
  84%      { border-color: #9a6d16;
             box-shadow: inset 0 0 0 1px rgba(143,100,20,0.65),
                         inset 0 0 16px 5px rgba(143,100,20,0.34),
                         0 0 7px rgba(143,100,20,0.26); }
}

@media (max-width: 620px) {
  .button-row { width: auto !important; padding: 10px; }
  .threshold-actions, .farewell-actions { padding: 10px; }
}

@media (prefers-reduced-motion: reduce) {
  .button-row, .threshold-actions, .farewell-actions,
  .threshold-actions::before, .farewell-actions::before,
  .threshold-actions::after, .farewell-actions::after {
    animation: none !important;
  }
  .threshold-actions::after, .farewell-actions::after { transform: translateY(55%); }
}





.threshold-actions,
.farewell-actions,
.button-row:has(> :nth-child(2)) {
  border-radius: 12px !important;
}

.threshold-actions > .threshold-btn,
.farewell-actions  > .threshold-btn,
.button-row:has(> :nth-child(2)) > .btn,
.button-row:has(> :nth-child(2)) > a,
.button-row:has(> :nth-child(2)) > button {
  border-radius: 7px !important;
}


.button-row:has(> *:only-child),
.submit-row {
  position: relative;
  width: fit-content !important;
  max-width: 100%;
  margin-left: auto !important;
  margin-right: auto !important;
  border: 0 !important;
  border-radius: 999px !important;
  background: #0a0806 !important;
  box-shadow: none !important;
  animation: none !important;
  padding: 12px;
  overflow: visible;
}
.button-row:has(> *:only-child)::before,
.submit-row::before {
  content: "";
  position: absolute; inset: 0; z-index: 0;
  border: 2px solid var(--marigold, #e0b348);
  border-radius: 999px;
  box-shadow: 0 0 12px rgba(224, 179, 72, 0.35),
              inset 0 0 10px rgba(224, 179, 72, 0.18);
  animation: curtainPart 6s cubic-bezier(0.45, 0, 0.55, 1) infinite;
  will-change: clip-path, opacity;
}
.button-row:has(> *:only-child) > *,
.submit-row > * {
  position: relative; z-index: 2;
  border-radius: 999px !important;
}

@keyframes curtainPart {
  0%        { clip-path: inset(0 46% 0 46% round 999px); opacity: 0.45; }
  32%, 68%  { clip-path: inset(0 0 0 0 round 999px);     opacity: 1; }
  100%      { clip-path: inset(0 46% 0 46% round 999px); opacity: 0.45; }
}

@media (max-width: 900px) {
  .submit-row { width: auto !important; padding: 10px; }
}
@media (prefers-reduced-motion: reduce) {
  .button-row:has(> *:only-child)::before,
  .submit-row::before {
    animation: none !important;
    clip-path: inset(0 0 0 0 round 999px);
    opacity: 1;
  }
}



.virtue-controls,
.tabs,
.filter-chips,
.gallery-filters,
.cite-tabs {
  position: relative;
  width: fit-content;
  max-width: 100%;
  justify-content: center;
  align-items: center;
  margin-left: auto;
  margin-right: auto;
  padding: 12px;
  border-radius: 12px;
  border: 2px solid #e0b348;
  animation: rowBeatRim 6.8s cubic-bezier(0.45, 0, 0.55, 1) infinite;
  will-change: box-shadow, border-color;
}

.virtue-controls > .virtue-btn,
.tabs > .tab,
.filter-chips > .filter-chip,
.gallery-filters > .filter-chip,
.cite-tabs > .cite-tab {
  border-radius: 7px !important;
}

.filter-chips {
  display: flex; flex-wrap: wrap; align-items: center; gap: 10px;
}

.filter-bar {
  border: 0 !important;
  padding: 0 !important;
  width: auto !important;
  animation: none !important;
  flex-direction: column;
  gap: 14px;
}
@media (max-width: 620px) {
  .virtue-controls, .tabs, .filter-chips, .gallery-filters, .cite-tabs {
    width: auto;
    padding: 10px;
  }
}
@media (prefers-reduced-motion: reduce) {
  .virtue-controls, .tabs, .filter-chips,
  .gallery-filters, .cite-tabs { animation: none !important; }
}



.dl {
  animation-duration: 2.6s;
  animation-timing-function: var(--ease-soft, cubic-bezier(0.22, 1, 0.36, 1));
  animation-fill-mode: both;
  will-change: opacity, transform, filter;
}
.dl--1  { animation-name: dlFade; }
.dl--2  { animation-name: dlRise; }
.dl--3  { animation-name: dlSettle; }
.dl--4  { animation-name: dlBlur; }
.dl--5  { animation-name: dlBreathe; }
.dl--6  { animation-name: dlFromLeft; }
.dl--7  { animation-name: dlFromRight; }
.dl--8  { animation-name: dlUnveil; }
.dl--9  { animation-name: dlCurtain; }
.dl--10 { animation-name: dlEmber; }
.dl--11 { animation-name: dlTilt; }
.dl--12 { animation-name: dlWiden; }
.dl--13 { animation-name: dlDeepen; }
.dl--14 { animation-name: dlLantern; }

@keyframes dlFade { from { opacity: 0; } to { opacity: 1; } }
@keyframes dlRise {
  from { opacity: 0; transform: translateY(22px); }
  to   { opacity: 1; transform: translateY(0); }
}
@keyframes dlSettle {
  from { opacity: 0; transform: translateY(-16px); }
  to   { opacity: 1; transform: translateY(0); }
}
@keyframes dlBlur {
  from { opacity: 0; filter: blur(10px); }
  to   { opacity: 1; filter: blur(0); }
}
@keyframes dlBreathe {
  from { opacity: 0; transform: scale(0.94); }
  to   { opacity: 1; transform: scale(1); }
}
@keyframes dlFromLeft {
  from { opacity: 0; transform: translateX(-34px); }
  to   { opacity: 1; transform: translateX(0); }
}
@keyframes dlFromRight {
  from { opacity: 0; transform: translateX(34px); }
  to   { opacity: 1; transform: translateX(0); }
}
@keyframes dlUnveil {
  from { opacity: 0; clip-path: inset(0 0 100% 0); }
  to   { opacity: 1; clip-path: inset(0 0 0 0); }
}
@keyframes dlCurtain {
  from { opacity: 0; clip-path: inset(0 50% 0 50%); }
  to   { opacity: 1; clip-path: inset(0 0 0 0); }
}
@keyframes dlEmber {
  0%   { opacity: 0; filter: brightness(2.4) blur(6px); }
  55%  { opacity: 1; filter: brightness(1.35) blur(0); }
  100% { opacity: 1; filter: brightness(1) blur(0); }
}
@keyframes dlTilt {
  from { opacity: 0; transform: perspective(900px) rotateX(14deg) translateY(16px); }
  to   { opacity: 1; transform: perspective(900px) rotateX(0) translateY(0); }
}
@keyframes dlWiden {
  from { opacity: 0; letter-spacing: 0.16em; }
  to   { opacity: 1; letter-spacing: normal; }
}
@keyframes dlDeepen {
  from { opacity: 0; transform: scale(1.07); filter: blur(7px); }
  to   { opacity: 1; transform: scale(1); filter: blur(0); }
}
@keyframes dlLantern {
  0%   { opacity: 0; filter: brightness(0.4); transform: scale(0.97); }
  60%  { opacity: 1; filter: brightness(1.5); transform: scale(1.01); }
  100% { opacity: 1; filter: brightness(1); transform: scale(1); }
}
@media (prefers-reduced-motion: reduce) {
  .dl {
    animation: none !important;
    opacity: 1 !important;
    filter: none !important;
    transform: none !important;
    clip-path: none !important;
  }
}



.to-top-row--anchored {
  position: absolute;
  right: clamp(16px, 5vw, 72px);          
  top: 0;                                  
  margin: 0 !important;
  z-index: 4;
}

.to-top-row--anchored.is-corner { top: auto; bottom: 0; }


.to-top-row--anchored.is-inflow {
  position: static;
  display: flex;
  justify-content: flex-end;
  margin: clamp(22px, 3vw, 44px) 0 0 !important;
  top: auto;
  bottom: auto;
}

@media (max-width: 760px) {
  .to-top-row--anchored { right: clamp(14px, 4vw, 24px); }
}



.gv-actions {
  position: relative;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 10px;
  width: fit-content;
  max-width: 100%;
  margin-left: auto;
  margin-right: auto;
  padding: 12px;
  border-radius: 12px;
  border: 2px solid #e0b348;
  animation: rowBeatRim 6.8s cubic-bezier(0.45, 0, 0.55, 1) infinite;
  will-change: box-shadow, border-color;
}
.gv-actions > .btn { border-radius: 7px !important; }
@media (max-width: 620px) {
  .gv-actions { width: auto; padding: 10px; }
}
@media (prefers-reduced-motion: reduce) {
  .gv-actions { animation: none !important; }
}






#raginiAcademic,
#vijayAcademic,
.tribute-placeholder-card p,
.admin-login input {
  font-style: italic;
}
.message-field textarea::placeholder,
.admin-login input::placeholder {
  font-style: italic;
}


.foundation-highlights small {
  font-style: italic;
}



#foundation p.lede.lede-italic,
#legacy p.lede.lede-italic,
#moments p.lede.lede-italic,
#admin p.lede.lede-italic {
  display: block;
  width: 100%;
  max-width: none;
  white-space: nowrap;
  text-align: center;
  text-align-last: center;
  text-wrap: nowrap;
  margin-left: 0;
  margin-right: 0;
  line-height: 1.7;
}
#foundation p.lede.lede-italic { font-size: min(clamp(23px, 2.4vw, 27px), 1.62vw); }  
#legacy     p.lede.lede-italic { font-size: min(clamp(23px, 2.4vw, 27px), 1.89vw); }  
#moments    p.lede.lede-italic { font-size: min(clamp(23px, 2.4vw, 27px), 2.12vw); }  
#admin      p.lede.lede-italic { font-size: min(clamp(23px, 2.4vw, 27px), 1.68vw); }  

@media (max-width: 900px) {
  #foundation p.lede.lede-italic,
  #legacy p.lede.lede-italic,
  #moments p.lede.lede-italic,
  #admin p.lede.lede-italic {
    white-space: normal;
    text-wrap: balance;
    max-width: 40ch;
    margin-left: auto;
    margin-right: auto;
    font-size: clamp(18px, 3vw, 22px);
  }
}



.help-head p {
  font-style: italic;
}



#legacy .section-heading,
#moments .section-heading,
#admin .section-heading,
#timeline .section-heading,
#virtues .section-heading,
#academic .section-heading {
  max-width: 100%;
  width: 100%;
  margin-left: auto;
  margin-right: auto;
}



#galleryPrev.gv-nav,
#galleryNext.gv-nav {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 46px;
  height: 46px;
  padding: 0;
  border-radius: 50%;
  display: grid;
  place-items: center;
  font-size: 21px;
  line-height: 1;
  z-index: 4;
}
#galleryPrev.gv-nav { left: 12px;  right: auto; }
#galleryNext.gv-nav { right: 12px; left: auto; }

#galleryPrev.gv-nav:hover,
#galleryNext.gv-nav:hover  { transform: translateY(-50%) scale(1.08); }
#galleryPrev.gv-nav:active,
#galleryNext.gv-nav:active { transform: translateY(-50%) scale(0.94); }

#galleryPrev.gv-nav[hidden],
#galleryNext.gv-nav[hidden] { display: none; }

@media (max-width: 720px) {
  #galleryPrev.gv-nav,
  #galleryNext.gv-nav { width: 38px; height: 38px; font-size: 18px; }
  #galleryPrev.gv-nav { left: 7px; }
  #galleryNext.gv-nav { right: 7px; }
}



.admin-filter-bar {
  align-items: center;
  gap: 16px;
}
.admin-filter-bar .admin-group {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 10px;
}

.filter-chips > .btn { border-radius: 7px !important; }
.admin-filter-bar #adminSearch {
  width: 100%;
  max-width: 560px;
  margin: 0 auto;
}

.admin-stats article { min-width: 0; }



.modal .modal-close,
dialog .modal-close {
  position: absolute;
  top: 14px;
  right: 14px;
  z-index: 6;
}

.timeline-photo-modal img,
.gallery-modal img { position: relative; z-index: 1; }
.timeline-photo-modal .tl-photo-nav { z-index: 5; }



body.modal-open { overflow: hidden; overscroll-behavior: none; }

html:has(body.modal-open) { overflow: hidden; }



.heading-accent,
h1.heading-accent, h2.heading-accent, h3.heading-accent,
.split-title,
.sacred-content h1, .sacred-content h2,
.section-heading h2, .section-heading h3,
.threshold-title, .farewell-blessing {
  text-transform: uppercase;
  letter-spacing: 0.015em;
}


#timeline  .section-heading h3.heading-accent { font-size: min(clamp(26px, 3.2vw, 44px), 3.67vw); }
#virtues   .section-heading h3.heading-accent { font-size: min(clamp(26px, 3.2vw, 44px), 2.68vw); }
#academic  .section-heading h3.heading-accent { font-size: min(clamp(26px, 3.2vw, 44px), 2.40vw); }
#thanks    h2.heading-accent                  { font-size: min(clamp(26px, 3.2vw, 44px), 2.36vw); }
@media (min-width: 900px) {
  #foundation .section-heading h2.heading-accent,
  #help .section-heading h2.heading-accent { font-size: clamp(22px, 2.6vw, 38px); }
}


@media (max-width: 430px) {
  #foundation .section-heading h2.heading-accent { font-size: clamp(19px, 5.3vw, 26px); }
}
@media (max-width: 620px) {
  #timeline .section-heading h3.heading-accent,
  #virtues .section-heading h3.heading-accent,
  #academic .section-heading h3.heading-accent,
  #thanks h2.heading-accent { font-size: clamp(19px, 5.1vw, 26px); }
}
@media (max-width: 760px) {
}



.heading-accent,
h1.heading-accent, h2.heading-accent, h3.heading-accent,
.split-title,
.sacred-content h1, .sacred-content h2,
.section-heading h2, .section-heading h3,
.threshold-title, .farewell-blessing {
  text-align: center;
  text-align-last: center;
  margin-left: auto;
  margin-right: auto;
}

.sacred-content {
  margin-left: auto;
  margin-right: auto;
  text-align: center;
}



.heading-accent,
h1.heading-accent, h2.heading-accent, h3.heading-accent,
.split-title,
.section-heading h2, .section-heading h3 {
  font-family: 'Cormorant Unicase', 'Cormorant Garamond', Georgia, serif !important;
  font-weight: 600 !important;
  letter-spacing: 0.02em;
}

.eyebrow {
  font-family: 'Didact Gothic', system-ui, sans-serif;
  font-weight: 400;
  letter-spacing: 0.26em;
}

.lede-italic,
.section-heading p.lede-italic {
  font-family: 'EB Garamond', 'Cormorant Garamond', Georgia, serif;
}


#timeline  .section-heading h3.heading-accent { font-size: min(clamp(28px, 3.6vw, 50px), 4.20vw); }
#virtues   .section-heading h3.heading-accent { font-size: min(clamp(28px, 3.6vw, 50px), 3.10vw); }
#academic  .section-heading h3.heading-accent { font-size: min(clamp(28px, 3.6vw, 50px), 2.78vw); }
#thanks    h2.heading-accent                  { font-size: min(clamp(28px, 3.6vw, 50px), 2.72vw); }
@media (min-width: 900px) {
  #foundation .section-heading h2.heading-accent,
  #help .section-heading h2.heading-accent { font-size: clamp(25px, 3.0vw, 44px); }
}



#sacred .sacred-content h2.heading-accent {
  white-space: nowrap;
  max-width: none;
  text-align: center;
  margin-left: auto;
  margin-right: auto;
}

@media (max-width: 1000px) {
}
@media (max-width: 620px) {
  #sacred .sacred-content h2.heading-accent {
    white-space: normal;
    text-wrap: balance;
    max-width: 20ch;
  }
}





#sacred .sacred-content h2.heading-accent,
#academic .section-heading h3.heading-accent {
  max-width: none !important;
  width: 100%;
  margin-left: auto !important;
  margin-right: auto !important;
  text-align: center !important;
  text-align-last: center !important;
}


#foundation p.lede.lede-italic { font-size: min(clamp(23px, 2.4vw, 27px), 1.34vw); }
#legacy     p.lede.lede-italic { font-size: min(clamp(23px, 2.4vw, 27px), 1.56vw); }
#moments    p.lede.lede-italic { font-size: min(clamp(23px, 2.4vw, 27px), 1.76vw); }
#admin      p.lede.lede-italic { font-size: min(clamp(23px, 2.4vw, 27px), 1.39vw); }
#foundation p.lede.lede-italic,
#legacy     p.lede.lede-italic,
#moments    p.lede.lede-italic,
#admin      p.lede.lede-italic {
  margin-left: auto;
  margin-right: auto;
  text-align: center;
  text-align-last: center;
}



#sacred .sacred-content h1.heading-accent,
#sacred .sacred-content h1.split-title,
#sacred .sacred-content h2.heading-accent {
  white-space: nowrap !important;
  text-wrap: nowrap !important;
  max-width: none !important;
  width: 100%;
  margin-left: auto !important;
  margin-right: auto !important;
  text-align: center !important;
  text-align-last: center !important;
  
  font-size: min(clamp(22px, 3.6vw, 50px), 5.2vw) !important;
}



#academic .section-heading h3.heading-accent {
  font-size: min(clamp(24px, 3.0vw, 38px), 2.85vw) !important;
}
#virtues .section-heading h3.heading-accent {
  font-size: min(clamp(26px, 3.3vw, 42px), 3.15vw) !important;
}
#foundation .section-heading h2.heading-accent {
  font-size: min(clamp(25px, 3.0vw, 42px), 3.05vw);
}


#foundation p.lede.lede-italic {
  font-size: min(clamp(23px, 2.4vw, 27px), 1.73vw) !important;
  white-space: normal !important;
  text-wrap: balance !important;
  max-width: 62ch;
  margin-left: auto !important;
  margin-right: auto !important;
  text-align: center !important;
  text-align-last: center !important;
  line-height: 1.7;
}



#timeline  .section-heading h3.heading-accent,
#virtues   .section-heading h3.heading-accent,
#academic  .section-heading h3.heading-accent,
#foundation .section-heading h2.heading-accent,
#help      .section-heading h2.heading-accent,
#thanks    h2.heading-accent {
  white-space: normal !important;
  text-wrap: balance !important;
  max-width: 100% !important;
  width: auto !important;
  margin-left: auto !important;
  margin-right: auto !important;
  text-align: center !important;
  text-align-last: center !important;
  overflow-wrap: break-word;
}



.threshold-title {
  
  font-family: 'Cormorant Unicase', 'Cormorant Garamond', Georgia, serif !important;
  font-weight: 600 !important;
  color: #ff9933 !important;
  letter-spacing: 0.02em;
  text-shadow: 0 0 26px rgba(255, 153, 51, 0.55),
               0 0 60px rgba(255, 153, 51, 0.28),
               0 3px 9px rgba(0, 0, 0, 0.95),
               0 1px 3px rgba(0, 0, 0, 1) !important;
}



.fw-layer {
  position: absolute; inset: 0; z-index: 0;
  pointer-events: none; overflow: hidden;
}
.fw-layer i {
  position: absolute;
  width: 3px; height: 3px;
  border-radius: 50%;
  background: transparent;
  opacity: 0;
  transform: scale(0.06);
  animation-name: fwBurst;
  animation-timing-function: cubic-bezier(0.16, 0.84, 0.34, 1);
  animation-iteration-count: infinite;
}

.fw-layer i:nth-child(1) {
  left: 65.4%; top: 21.8%;
  animation-duration: 5.75s; animation-delay: 7.97s;
  box-shadow:
    68.5px -9.7px 0 -0.065px #ff9933,
    48.7px 26.2px 0 -0.239px #ff9933,
    43.5px 46.8px 0 1.268px #ff9933,
    10.4px 58.7px 0 0.123px #ff9933,
    -8.7px 67.7px 0 2.021px #ff9933,
    -40.6px 56.3px 0 1.007px #ff9933,
    -51.6px 38.4px 0 0.761px #ff9933,
    -62.4px 20.0px 0 2.369px #ff9933,
    -60.9px -20.0px 0 2.731px #ff9933,
    -43.3px -36.7px 0 2.905px #ff9933,
    -26.5px -64.8px 0 1.674px #ff9933,
    3.6px -62.2px 0 0.225px #ff9933,
    23.5px -53.7px 0 2.326px #ff9933,
    52.0px -43.6px 0 0.703px #ff9933,
    48.6px -24.7px 0 1.529px #ff9933,
    31.7px 10.8px 0 -0.253px #fff1cd,
    13.5px 23.2px 0 0.268px #fff1cd,
    -0.8px 31.8px 0 0.138px #fff1cd,
    -22.9px 21.5px 0 -0.123px #fff1cd,
    -32.5px 3.9px 0 -0.413px #fff1cd,
    -25.2px -26.7px 0 -0.847px #fff1cd,
    -5.8px -32.3px 0 1.123px #fff1cd,
    12.3px -26.9px 0 0.558px #fff1cd,
    31.5px -8.8px 0 -0.456px #fff1cd;
}

.fw-layer i:nth-child(2) {
  left: 43.7%; top: 82.5%;
  animation-duration: 6.44s; animation-delay: 5.86s;
  box-shadow:
    95.7px 11.2px 0 -0.876px #ffd45e,
    84.9px 34.4px 0 1.254px #ffd45e,
    55.6px 89.5px 0 1.225px #ffd45e,
    33.1px 98.6px 0 0.804px #ffd45e,
    -35.7px 88.4px 0 2.630px #ffd45e,
    -55.8px 66.5px 0 1.051px #ffd45e,
    -85.9px 40.1px 0 -0.036px #ffd45e,
    -82.1px -2.9px 0 0.616px #ffd45e,
    -78.1px -54.4px 0 -0.340px #ffd45e,
    -66.7px -78.1px 0 0.573px #ffd45e,
    -19.1px -92.5px 0 0.544px #ffd45e,
    23.7px -79.7px 0 -0.499px #ffd45e,
    58.6px -71.5px 0 -0.702px #ffd45e,
    101.4px -30.6px 0 1.413px #ffd45e,
    40.6px 13.2px 0 1.819px #fffaf0,
    23.6px 53.5px 0 0.239px #fffaf0,
    -15.3px 37.7px 0 2.557px #fffaf0,
    -47.4px 17.4px 0 1.601px #fffaf0,
    -31.4px -16.6px 0 2.499px #fffaf0,
    -22.7px -43.1px 0 1.659px #fffaf0,
    15.1px -42.3px 0 -0.427px #fffaf0,
    38.3px -12.5px 0 0.210px #fffaf0;
}

.fw-layer i:nth-child(3) {
  left: 42.6%; top: 74.9%;
  animation-duration: 9.02s; animation-delay: 7.75s;
  box-shadow:
    47.7px -4.1px 0 1.862px #ff8a6b,
    44.2px 26.1px 0 2.413px #ff8a6b,
    27.3px 43.0px 0 2.615px #ff8a6b,
    -0.5px 47.3px 0 2.543px #ff8a6b,
    -22.2px 49.4px 0 -0.311px #ff8a6b,
    -46.8px 24.2px 0 2.007px #ff8a6b,
    -53.5px -6.4px 0 1.152px #ff8a6b,
    -38.6px -29.1px 0 1.167px #ff8a6b,
    -24.3px -51.4px 0 1.094px #ff8a6b,
    6.8px -49.1px 0 1.891px #ff8a6b,
    26.0px -52.4px 0 -0.644px #ff8a6b,
    48.5px -34.6px 0 0.891px #ff8a6b,
    18.1px 10.5px 0 1.456px #ffe0cf,
    6.6px 20.3px 0 0.877px #ffe0cf,
    -13.1px 23.7px 0 2.572px #ffe0cf,
    -22.8px 13.0px 0 1.109px #ffe0cf,
    -23.4px -5.4px 0 0.906px #ffe0cf,
    -7.0px -27.3px 0 0.297px #ffe0cf,
    11.1px -26.6px 0 0.442px #ffe0cf,
    19.4px -6.6px 0 0.949px #ffe0cf;
}

.fw-layer i:nth-child(4) {
  left: 56.6%; top: 31.9%;
  animation-duration: 5.60s; animation-delay: 4.37s;
  box-shadow:
    59.8px -8.1px 0 2.224px #f7c26a,
    57.9px 38.7px 0 2.876px #f7c26a,
    24.6px 57.4px 0 0.920px #f7c26a,
    -2.3px 63.6px 0 1.630px #f7c26a,
    -58.2px 53.3px 0 -0.181px #f7c26a,
    -60.9px 8.6px 0 0.660px #f7c26a,
    -77.4px -10.6px 0 0.717px #f7c26a,
    -49.5px -55.7px 0 0.819px #f7c26a,
    -13.8px -67.3px 0 2.181px #f7c26a,
    28.6px -61.7px 0 0.529px #f7c26a,
    51.5px -30.6px 0 -0.442px #f7c26a,
    31.7px 18.0px 0 2.514px #fff2dc,
    8.8px 36.1px 0 2.152px #fff2dc,
    -16.2px 25.4px 0 0.935px #fff2dc,
    -42.5px 7.1px 0 -0.891px #fff2dc,
    -23.2px -33.7px 0 1.210px #fff2dc,
    6.9px -35.4px 0 2.311px #fff2dc,
    35.2px -10.3px 0 -0.079px #fff2dc;
}

.fw-layer i:nth-child(5) {
  left: 81.1%; top: 66.6%;
  animation-duration: 9.18s; animation-delay: 2.44s;
  box-shadow:
    117.5px 16.5px 0 1.500px #ffcf7a,
    90.6px 79.9px 0 -0.528px #ffcf7a,
    41.9px 116.0px 0 0.515px #ffcf7a,
    -50.2px 105.8px 0 1.355px #ffcf7a,
    -102.4px 61.1px 0 2.818px #ffcf7a,
    -117.9px 3.8px 0 -0.601px #ffcf7a,
    -94.0px -49.2px 0 -0.224px #ffcf7a,
    -30.6px -90.8px 0 -0.297px #ffcf7a,
    30.2px -111.3px 0 0.964px #ffcf7a,
    85.5px -56.8px 0 0.486px #ffcf7a,
    44.4px 35.5px 0 1.297px #ffeed6,
    -3.1px 57.4px 0 -0.673px #ffeed6,
    -58.3px 36.7px 0 2.659px #ffeed6,
    -56.7px -38.2px 0 -0.543px #ffeed6,
    -9.9px -60.6px 0 -0.920px #ffeed6,
    39.1px -27.1px 0 2.601px #ffeed6;
}

.fw-layer i:nth-child(6) {
  left: 44.5%; top: 28.2%;
  animation-duration: 5.94s; animation-delay: 3.64s;
  box-shadow:
    47.6px -4.9px 0 0.080px #ffab45,
    39.0px 24.6px 0 0.152px #ffab45,
    1.8px 50.2px 0 2.485px #ffab45,
    -28.2px 48.5px 0 -0.166px #ffab45,
    -53.5px 18.1px 0 1.616px #ffab45,
    -49.7px -20.8px 0 -0.818px #ffab45,
    -31.5px -40.0px 0 -0.934px #ffab45,
    11.2px -41.8px 0 0.283px #ffab45,
    38.2px -23.5px 0 1.848px #ffab45,
    17.5px 12.5px 0 2.891px #fff0d0,
    -7.8px 21.2px 0 1.239px #fff0d0,
    -25.6px 0.7px 0 1.065px #fff0d0,
    -8.3px -22.0px 0 0.051px #fff0d0,
    19.5px -13.6px 0 0.471px #fff0d0;
}

.fw-layer i:nth-child(7) {
  left: 48.4%; top: 31.8%;
  animation-duration: 8.69s; animation-delay: 8.64s;
  box-shadow:
    78.9px -5.5px 0 0.775px #ff7a18,
    74.7px 28.3px 0 2.036px #ff7a18,
    69.7px 69.0px 0 1.717px #ff7a18,
    26.3px 98.3px 0 0.254px #ff7a18,
    -24.3px 76.2px 0 1.949px #ff7a18,
    -76.6px 68.8px 0 1.775px #ff7a18,
    -84.5px 57.1px 0 2.456px #ff7a18,
    -91.0px 2.2px 0 2.688px #ff7a18,
    -69.7px -48.7px 0 2.137px #ff7a18,
    -63.4px -80.9px 0 1.645px #ff7a18,
    -13.4px -89.8px 0 2.050px #ff7a18,
    37.6px -92.3px 0 -0.963px #ff7a18,
    53.2px -62.0px 0 1.934px #ff7a18,
    83.1px -35.8px 0 -0.760px #ff7a18,
    36.2px 10.9px 0 0.978px #ffe4c4,
    23.1px 40.4px 0 0.384px #ffe4c4,
    -15.6px 39.3px 0 1.920px #ffe4c4,
    -46.8px 20.9px 0 -0.470px #ffe4c4,
    -48.3px -30.4px 0 1.543px #ffe4c4,
    -19.6px -37.5px 0 1.732px #ffe4c4,
    21.8px -41.0px 0 2.340px #ffe4c4,
    44.5px -22.6px 0 1.905px #ffe4c4;
}

.fw-layer i:nth-child(8) {
  left: 9.9%; top: 6.8%;
  animation-duration: 8.84s; animation-delay: 0.37s;
  box-shadow:
    78.4px 2.4px 0 -0.485px #ffb27a,
    56.6px 39.5px 0 2.862px #ffb27a,
    49.1px 70.4px 0 1.384px #ffb27a,
    -11.8px 82.8px 0 1.746px #ffb27a,
    -23.8px 61.9px 0 3.007px #ffb27a,
    -61.0px 41.9px 0 2.775px #ffb27a,
    -67.2px -2.8px 0 0.631px #ffb27a,
    -57.2px -34.1px 0 2.934px #ffb27a,
    -48.9px -62.5px 0 2.978px #ffb27a,
    1.3px -78.4px 0 1.804px #ffb27a,
    34.7px -66.7px 0 -0.152px #ffb27a,
    58.8px -42.1px 0 1.340px #ffb27a,
    34.3px 17.7px 0 -0.717px #ffe8c4,
    21.8px 37.9px 0 -0.775px #ffe8c4,
    -15.3px 29.1px 0 1.963px #ffe8c4,
    -36.6px 18.8px 0 2.108px #ffe8c4,
    -39.1px -18.6px 0 2.586px #ffe8c4,
    -16.8px -42.5px 0 0.167px #ffe8c4,
    11.6px -30.2px 0 1.688px #ffe8c4,
    27.3px -7.4px 0 -0.094px #ffe8c4;
}

.fw-layer i:nth-child(9) {
  left: 55.5%; top: 31.2%;
  animation-duration: 8.48s; animation-delay: 0.17s;
  box-shadow:
    98.7px 2.2px 0 0.587px #ff9933,
    75.4px 55.5px 0 1.427px #ff9933,
    28.7px 82.6px 0 -0.514px #ff9933,
    -4.7px 103.6px 0 -0.905px #ff9933,
    -50.7px 78.8px 0 1.703px #ff9933,
    -102.3px 21.7px 0 1.080px #ff9933,
    -87.3px -18.8px 0 1.181px #ff9933,
    -72.8px -76.3px 0 2.644px #ff9933,
    -16.6px -87.0px 0 -0.369px #ff9933,
    48.4px -88.8px 0 2.427px #ff9933,
    101.3px -46.3px 0 -0.978px #ff9933,
    43.1px 28.8px 0 0.066px #fff1cd,
    12.9px 43.0px 0 1.138px #fff1cd,
    -39.5px 36.8px 0 2.833px #fff1cd,
    -45.3px 2.1px 0 2.094px #fff1cd,
    -28.6px -33.3px 0 2.123px #fff1cd,
    13.7px -54.3px 0 1.514px #fff1cd,
    44.3px -15.4px 0 1.992px #fff1cd;
}

.fw-layer i:nth-child(10) {
  left: 44.8%; top: 6.2%;
  animation-duration: 8.65s; animation-delay: 2.09s;
  box-shadow:
    51.3px 4.5px 0 -0.630px #ffd45e,
    34.3px 21.2px 0 2.166px #ffd45e,
    14.3px 44.8px 0 1.326px #ffd45e,
    -17.4px 49.6px 0 1.978px #ffd45e,
    -42.3px 27.5px 0 -0.572px #ffd45e,
    -46.6px 7.0px 0 1.587px #ffd45e,
    -30.7px -27.3px 0 0.833px #ffd45e,
    -21.9px -44.5px 0 0.602px #ffd45e,
    17.9px -37.0px 0 2.920px #ffd45e,
    35.0px -23.0px 0 1.022px #ffd45e,
    19.0px 13.2px 0 1.471px #fffaf0,
    2.5px 25.7px 0 -0.398px #fffaf0,
    -19.4px 9.0px 0 0.746px #fffaf0,
    -19.3px -15.7px 0 0.674px #fffaf0,
    0.3px -26.6px 0 2.702px #fffaf0,
    22.4px -9.0px 0 -1.021px #fffaf0;
}

.fw-layer i:nth-child(11) {
  left: 7.3%; top: 59.4%;
  animation-duration: 6.96s; animation-delay: 5.54s;
  box-shadow:
    51.5px 2.9px 0 -0.688px #ff8a6b,
    44.5px 25.6px 0 1.558px #ff8a6b,
    30.0px 43.7px 0 -0.137px #ff8a6b,
    12.4px 45.6px 0 -0.557px #ff8a6b,
    -8.9px 50.1px 0 2.760px #ff8a6b,
    -21.9px 40.4px 0 2.355px #ff8a6b,
    -36.7px 34.1px 0 2.949px #ff8a6b,
    -45.3px 1.9px 0 -1.007px #ff8a6b,
    -42.9px -4.1px 0 0.181px #ff8a6b,
    -36.4px -25.1px 0 0.095px #ff8a6b,
    -14.7px -38.5px 0 -0.731px #ff8a6b,
    -7.1px -41.3px 0 0.196px #ff8a6b,
    18.0px -47.3px 0 -0.050px #ff8a6b,
    24.1px -33.4px 0 1.442px #ff8a6b,
    43.6px -20.2px 0 1.833px #ff8a6b,
    15.3px 8.1px 0 -0.326px #ffe0cf,
    11.5px 15.7px 0 1.283px #ffe0cf,
    -5.6px 22.1px 0 2.268px #ffe0cf,
    -13.7px 14.2px 0 2.963px #ffe0cf,
    -21.9px -1.9px 0 0.500px #ffe0cf,
    -15.2px -15.8px 0 0.413px #ffe0cf,
    -1.1px -26.3px 0 2.442px #ffe0cf,
    14.2px -23.7px 0 0.341px #ffe0cf,
    19.3px -9.2px 0 0.689px #ffe0cf;
}

.fw-layer i:nth-child(12) {
  left: 77.3%; top: 88.3%;
  animation-duration: 8.01s; animation-delay: 1.75s;
  box-shadow:
    90.7px 9.3px 0 -0.862px #f7c26a,
    81.5px 48.1px 0 -0.282px #f7c26a,
    60.6px 88.5px 0 -0.268px #f7c26a,
    -4.7px 87.2px 0 -1.050px #f7c26a,
    -32.7px 87.6px 0 1.485px #f7c26a,
    -86.1px 54.9px 0 2.195px #f7c26a,
    -96.8px -7.0px 0 -0.992px #f7c26a,
    -78.2px -33.7px 0 2.282px #f7c26a,
    -48.5px -73.3px 0 0.370px #f7c26a,
    11.9px -93.9px 0 0.022px #f7c26a,
    57.9px -90.3px 0 2.079px #f7c26a,
    78.4px -54.0px 0 2.239px #f7c26a,
    44.3px 12.4px 0 0.428px #fff2dc,
    16.2px 55.5px 0 -0.659px #fff2dc,
    -11.2px 43.6px 0 1.790px #fff2dc,
    -40.0px 23.4px 0 1.036px #fff2dc,
    -45.2px -27.6px 0 -0.804px #fff2dc,
    -22.9px -46.2px 0 2.789px #fff2dc,
    21.6px -36.6px 0 0.008px #fff2dc,
    42.5px -22.8px 0 0.848px #fff2dc;
}

.fw-layer i:nth-child(13) {
  left: 19.4%; top: 4.9%;
  animation-duration: 7.08s; animation-delay: 6.28s;
  box-shadow:
    84.4px -9.9px 0 -0.210px #ffcf7a,
    64.3px 35.7px 0 1.761px #ffcf7a,
    39.8px 61.8px 0 2.804px #ffcf7a,
    -10.8px 81.7px 0 -0.108px #ffcf7a,
    -50.5px 64.3px 0 1.572px #ffcf7a,
    -68.9px 30.7px 0 2.528px #ffcf7a,
    -84.6px -23.7px 0 2.065px #ffcf7a,
    -45.9px -66.8px 0 3.036px #ffcf7a,
    -22.8px -71.5px 0 0.993px #ffcf7a,
    34.5px -63.2px 0 0.457px #ffcf7a,
    65.5px -40.1px 0 -0.021px #ffcf7a,
    47.9px 13.9px 0 2.673px #ffeed6,
    12.3px 36.6px 0 0.645px #ffeed6,
    -22.2px 30.3px 0 2.847px #ffeed6,
    -38.6px 2.1px 0 1.398px #ffeed6,
    -24.8px -26.3px 0 -1.036px #ffeed6,
    7.7px -45.8px 0 0.790px #ffeed6,
    36.4px -14.2px 0 0.037px #ffeed6;
}

.fw-layer i:nth-child(14) {
  left: 28.1%; top: 34.4%;
  animation-duration: 8.07s; animation-delay: 4.58s;
  box-shadow:
    45.0px -6.3px 0 1.311px #ffab45,
    46.7px 25.0px 0 -0.195px #ffab45,
    11.1px 44.6px 0 0.862px #ffab45,
    -15.3px 53.1px 0 0.399px #ffab45,
    -37.0px 25.1px 0 2.210px #ffab45,
    -45.4px 4.2px 0 1.369px #ffab45,
    -43.1px -23.6px 0 2.384px #ffab45,
    -25.0px -50.6px 0 -0.833px #ffab45,
    14.4px -48.5px 0 0.732px #ffab45,
    45.4px -29.7px 0 2.992px #ffab45,
    18.6px 13.7px 0 -0.789px #fff0d0,
    0.6px 19.9px 0 -0.615px #fff0d0,
    -28.9px 14.2px 0 -0.586px #fff0d0,
    -19.5px -12.7px 0 -0.949px #fff0d0,
    -1.4px -24.5px 0 0.109px #fff0d0,
    19.0px -14.7px 0 3.021px #fff0d0;
}

.fw-layer i:nth-child(15) {
  left: 72.6%; top: 38.6%;
  animation-duration: 8.85s; animation-delay: 7.97s;
  box-shadow:
    98.3px 9.7px 0 1.877px #ff7a18,
    64.4px 50.6px 0 -0.746px #ff7a18,
    22.3px 98.2px 0 -0.384px #ff7a18,
    -28.2px 82.1px 0 -0.007px #ff7a18,
    -65.9px 47.9px 0 1.196px #ff7a18,
    -102.6px -7.5px 0 2.253px #ff7a18,
    -77.3px -56.8px 0 -0.355px #ff7a18,
    -16.5px -81.2px 0 0.326px #ff7a18,
    42.1px -83.8px 0 2.470px #ff7a18,
    59.5px -53.4px 0 2.746px #ff7a18,
    44.3px 20.7px 0 0.312px #ffe4c4,
    3.0px 51.2px 0 0.355px #ffe4c4,
    -36.8px 21.9px 0 2.717px #ffe4c4,
    -48.9px -20.7px 0 3.050px #ffe4c4,
    0.9px -43.7px 0 2.398px #ffe4c4,
    54.0px -21.9px 0 2.297px #ffe4c4;
}
@keyframes fwBurst {
  0%   { transform: scale(0.06) translateY(0);     opacity: 0; }
  5%   { opacity: 1; }
  40%  { transform: scale(0.80) translateY(4px);   opacity: 0.9; }
  70%  { transform: scale(1.04) translateY(14px);  opacity: 0.42; }
  100% { transform: scale(1.18) translateY(30px);  opacity: 0; }
}
@keyframes nameFlare {
  0%, 100% { text-shadow: 0 0 12px rgba(255,193,74,.42), 0 2px 6px rgba(0,0,0,.96); }
  10%      { text-shadow: 0 0 10px #fff6d8, 0 0 30px rgba(255,241,205,.9),
                          0 0 70px rgba(255,153,51,.6), 0 2px 6px rgba(0,0,0,.96); }
  45%      { text-shadow: 0 0 16px rgba(255,220,149,.66), 0 2px 6px rgba(0,0,0,.96); }
}
.farewell-names {
  position: relative;
  animation: riseIn 1.3s var(--ease-soft) 3.0s both,
             nameGlow 5.2s ease-in-out 4.3s infinite,
             nameFlare 6.3s ease-in-out 4.6s infinite !important;
}
@media (prefers-reduced-motion: reduce) {
  .fw-layer { display: none !important; }
  .farewell-names { animation: none !important; }
}



.threshold-names {
  font-family: 'Abril Fatface', 'Cormorant Garamond', Georgia, serif !important;
  font-weight: 400 !important;          
  font-style: normal !important;
  letter-spacing: 0.02em;               
  -webkit-text-stroke: 0 !important;    
  
  font-size: min(clamp(34px, 1.6vw, 39px), calc(1.58vw + 5px)) !important;
}



.parent-role {
  display: grid;
  grid-template-rows: 0fr;
  opacity: 0;
  margin: 0;
  transition: grid-template-rows 0.5s var(--ease-soft),
              opacity 0.4s var(--ease-soft),
              margin 0.5s var(--ease-soft);
}
.parent-role > * { overflow: hidden; }
#virtues.virtue-chosen .parent-role {
  grid-template-rows: 1fr;
  opacity: 1;
  margin-top: 4px;
}
@media (prefers-reduced-motion: reduce) {
  .parent-role { transition: none; }
}





#threshold .threshold-names, .farewell .farewell-names {
  font-family: 'Cinzel', 'Cormorant Unicase', Georgia, serif !important;
  font-weight: 600 !important;
  -webkit-text-stroke: 0 !important;
}
#threshold .threshold-title, .farewell .farewell-title {
  font-family: 'Cormorant Unicase', 'Cormorant Garamond', Georgia, serif !important;
  font-weight: 600 !important;
  -webkit-text-stroke: 0 !important;
}
#threshold .threshold-line, .farewell .farewell-line {
  font-family: 'EB Garamond', 'Cormorant Garamond', Georgia, serif !important;
  font-style: italic !important;
  font-weight: 400 !important;
}



#threshold .threshold-line, .farewell .farewell-line {
  margin: 6px auto 0 !important;
  max-width: min(86vw, 1180px) !important;
  font-size: clamp(19px, 2.05vw, 34px) !important;
  font-weight: 500 !important;
  line-height: 1.5 !important;
  white-space: normal !important;
  text-wrap: balance;
  color: #ddb078 !important;
  text-shadow: 0 2px 9px rgba(24, 8, 18, 0.95), 0 0 22px rgba(201, 154, 94, 0.24) !important;
  animation: none !important;   
}


#threshold .threshold-names, .farewell .farewell-names {
  position: relative;
  margin: 0 auto !important;
  max-width: 92vw !important;
  padding: 0 1.3em !important;
  white-space: nowrap !important;
  font-size: clamp(11px, 2.3vw, 27px) !important;
  letter-spacing: 0.045em !important;
  line-height: 1.3 !important;
  text-wrap: nowrap;
  color: #ffdc95 !important;
  text-shadow: 0 0 22px rgba(255, 196, 110, 0.42),
               0 0 58px rgba(255, 160, 60, 0.22),
               0 2px 8px rgba(24, 8, 18, 0.85) !important;
  animation: nmShimmer 6.6s ease-in-out 3.4s infinite !important;
}
@keyframes nmShimmer {
  0%, 100%  { text-shadow: 0 0 22px rgba(255, 196, 110, 0.42),
                           0 0 58px rgba(255, 160, 60, 0.22),
                           0 2px 8px rgba(24, 8, 18, 0.85); }
  33%       { text-shadow: 0 0 26px rgba(255, 246, 224, 0.68),
                           0 0 64px rgba(255, 210, 150, 0.34),
                           0 2px 8px rgba(24, 8, 18, 0.85); }
  66%       { text-shadow: 0 0 24px rgba(255, 150, 140, 0.5),
                           0 0 60px rgba(226, 90, 70, 0.28),
                           0 2px 8px rgba(24, 8, 18, 0.85); }
}
#threshold .threshold-names::before, #threshold .threshold-names::after,
.farewell .farewell-names::before,   .farewell .farewell-names::after {
  content: '';
  position: absolute; top: 50%; width: 7px; height: 7px;
  background: linear-gradient(135deg, #fff8e2 0%, #ffd98a 55%, #e0913f 100%);
  clip-path: polygon(50% 0%, 63% 37%, 100% 50%, 63% 63%, 50% 100%, 37% 63%, 0% 50%, 37% 37%);
  box-shadow: 0 0 7px rgba(255, 216, 150, 0.9), 0 0 16px rgba(255, 180, 90, 0.5);
  animation: nmStarTwinkle 3.4s ease-in-out infinite;
}
#threshold .threshold-names::before, .farewell .farewell-names::before {
  left: 0; transform: translateY(-50%) rotate(0deg);
}
#threshold .threshold-names::after, .farewell .farewell-names::after {
  right: 0; transform: translateY(-50%) rotate(0deg); animation-delay: 1.6s;
}
@keyframes nmStarTwinkle {
  0%, 100% { opacity: 0.3;  transform: translateY(-50%) scale(0.65) rotate(0deg); }
  50%      { opacity: 1;    transform: translateY(-50%) scale(1.25) rotate(180deg); }
}


#threshold .threshold-title, .farewell .farewell-title {
  margin: 0 auto !important;
  max-width: min(88vw, 1200px);
  
  font-size: clamp(28px, 3.3vw, 62px) !important;
  letter-spacing: 0.075em !important;
  line-height: 1.25 !important;
  text-transform: uppercase !important;
  white-space: normal !important;
  text-wrap: balance;
  text-align: center !important;
  color: #f0b45a !important;
  text-shadow: none !important;
  
  background-image: linear-gradient(100deg, #f0b45a 0%, #f0b45a 38%,
              #fff0cf 50%, #f0b45a 62%, #f0b45a 100%) !important;
  background-size: 280% 100% !important;
  -webkit-background-clip: text !important; background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  opacity: 0;
  animation: seRise 1.3s var(--ease-soft) 3.30s forwards,
             seSweep 9s linear 4.80s infinite !important;
}
@keyframes seRise  { from { opacity: 0; transform: translateY(12px); }
                     to   { opacity: 1; transform: none; } }
@keyframes seSweep { 0%   { background-position: 180% 0; }
                     100% { background-position: -80% 0; } }


#threshold .diya-scene, .farewell .diya-scene { margin-bottom: 4px !important; }
#threshold .threshold-names, .farewell .farewell-names { margin: 16px auto 22px !important; }
#threshold .threshold-title, .farewell .farewell-title { margin-bottom: 28px !important; }


.orn-dr {
  stroke-dasharray: var(--orn-len);
  stroke-dashoffset: var(--orn-len);
  animation: ornDraw 1.6s var(--ease-soft) 1.0s forwards;
}
@keyframes ornDraw { to { stroke-dashoffset: 0; } }


.orn-lotus {
  transform-box: fill-box; transform-origin: center;
  opacity: 0; transform: scale(0.28) rotate(-30deg);
  animation: ornBloom 1.3s var(--ease-soft) forwards;
}
@keyframes ornBloom {
  60%  { opacity: 1; transform: scale(1.12) rotate(6deg); }
  100% { opacity: 1; transform: scale(1) rotate(0); }
}

.orn-bindu {
  transform-box: fill-box; transform-origin: center;
  opacity: 0;
  animation: ornBinduIn 0.45s var(--ease-soft) forwards,
             ornBindu 3.6s var(--ease-soft) 3s infinite;
}
@keyframes ornBinduIn { to { opacity: 1; } }
@keyframes ornBindu { 0%, 100% { opacity: 0.6;  transform: scale(0.85); }
                      50%      { opacity: 1;    transform: scale(1.65); } }


.orn-leaf {
  transform-box: fill-box; transform-origin: 0 0;
  opacity: 0;
  animation: ornLeafIn 0.6s var(--ease-soft) forwards,
             ornLeafSway 4.6s ease-in-out var(--leaf-sway-delay, 3.4s) infinite;
}
@keyframes ornLeafIn   { to { opacity: 0.9; } }
@keyframes ornLeafSway { 0%, 100% { transform: rotate(-3.5deg); }
                         50%      { transform: rotate(3.5deg); } }


.orn-shine {
  stroke-width: 2 !important;
  stroke-dasharray: 40 1300; opacity: 0;
  animation: ornShineIn 0.55s linear 2.6s forwards,
             ornTravel 6.5s linear 2.6s infinite;
}
.orn-shine-2 {
  stroke-width: 1.3 !important;
  stroke-dasharray: 26 1300; opacity: 0;
  animation: ornShineIn 0.55s linear 3.3s forwards,
             ornTravel2 6.5s linear 1.3s infinite;
}
@keyframes ornShineIn { to { opacity: 0.95; } }

@keyframes ornTravel  { from { stroke-dashoffset: 668; } to { stroke-dashoffset: -40; } }
@keyframes ornTravel2 { from { stroke-dashoffset: 654; } to { stroke-dashoffset: -26; } }


#threshold .aw, .farewell .aw {
  display: inline-block; opacity: 0;
  animation: awWord 0.8s var(--ease-soft) forwards;
}
@keyframes awWord { from { opacity: 0; transform: translateY(6px); }
                    to   { opacity: 1; transform: none; } }


#threshold .nw, .farewell .nw {
  display: inline-block; opacity: 0;
  filter: blur(9px); transform: translateY(14px);
  animation: nwSettle 1.5s var(--ease-soft) forwards;
}
@keyframes nwSettle { to { opacity: 1; filter: blur(0); transform: none; } }


#threshold .t-mandala, .farewell .t-mandala {
  opacity: 0.96 !important;
  position: absolute;   
}

#threshold .tm-art.tm-under, .farewell .tm-art.tm-under {
  color: #e0b64a !important;                     
  filter: drop-shadow(0 0 10px rgba(224, 182, 74, 0.95))
          drop-shadow(0 0 26px rgba(255, 214, 120, 0.62)) !important;
  animation: seTurnA 90s linear infinite,
             seTwinkleGold 4.4s ease-in-out infinite;
  animation-direction: normal !important;
}
#threshold .tm-art:not(.tm-under), .farewell .tm-art:not(.tm-under) {
  color: #d6473c !important;                     
  filter: drop-shadow(0 0 11px rgba(214, 71, 60, 1))
          drop-shadow(0 0 28px rgba(255, 120, 98, 0.7)) !important;
  animation: seTurnB 74s linear infinite,
             seTwinkleSaffron 5.6s ease-in-out 1.1s infinite;
  animation-direction: normal !important;
}

.tm--bl .tm-art.tm-under      { animation-duration: 105s; }
.tm--bl .tm-art:not(.tm-under) { animation-duration: 86s; }
@keyframes seTurnA {
  0%   { transform: rotate(0deg)    scale(1); }
  50%  { transform: rotate(180deg)  scale(1.09); }
  100% { transform: rotate(360deg)  scale(1); }
}
@keyframes seTurnB {
  0%   { transform: rotate(0deg)    scale(1); }
  50%  { transform: rotate(-180deg) scale(1.09); }
  100% { transform: rotate(-360deg) scale(1); }
}
@keyframes seTwinkleGold    { 0%, 100% { opacity: 0.68; } 50% { opacity: 1; } }
@keyframes seTwinkleSaffron { 0%, 100% { opacity: 0.8; }  50% { opacity: 1; } }   


.tm-sparks { position: absolute; inset: 0; z-index: 2; pointer-events: none; }
.tm-spark2 {
  position: absolute; width: 7px; height: 7px;
  transform: translate(-50%, -50%);
  background: linear-gradient(135deg, #fff8e2 0%, #ffd98a 55%, #e0913f 100%);
  clip-path: polygon(50% 0%, 63% 37%, 100% 50%, 63% 63%, 50% 100%, 37% 63%, 0% 50%, 37% 37%);
  box-shadow: 0 0 8px rgba(255, 220, 160, 0.95), 0 0 18px rgba(255, 180, 100, 0.55);
  animation: tmSparkTwinkle 3.8s ease-in-out infinite;
}
.tm-spark2:nth-child(3n)   { width: 5px; height: 5px; }
.tm-spark2:nth-child(4n+1) { width: 9px; height: 9px; }
@keyframes tmSparkTwinkle {
  0%, 100% { opacity: 0.2;  transform: translate(-50%, -50%) scale(0.55) rotate(0deg); }
  50%      { opacity: 1;    transform: translate(-50%, -50%) scale(1.3) rotate(180deg); }
}
@media (max-width: 700px) {
  .tm-spark2 { width: 5px; height: 5px; }
  .tm-spark2:nth-child(3n)   { width: 4px; height: 4px; }
  .tm-spark2:nth-child(4n+1) { width: 6px; height: 6px; }
}


.dust { position: absolute; inset: 0; z-index: 1; pointer-events: none; overflow: hidden; }
.dust i {
  position: absolute; width: 3px; height: 3px; border-radius: 50%;
  background: rgba(255, 206, 140, 0.75);
  box-shadow: 0 0 6px 1px rgba(255, 180, 90, 0.5);
  opacity: 0; animation: dustRise linear infinite;
}
.dust i:nth-child(1) { left: 31%; top: 62%; animation-duration: 10.5s; animation-delay: -1.4s; }
.dust i:nth-child(2) { left: 44%; top: 71%; animation-duration: 13.2s; animation-delay: -6.1s; }
.dust i:nth-child(3) { left: 56%; top: 58%; animation-duration:  9.4s; animation-delay: -3.7s; }
.dust i:nth-child(4) { left: 63%; top: 74%; animation-duration: 15.1s; animation-delay: -9.8s; }
.dust i:nth-child(5) { left: 38%; top: 80%; animation-duration: 11.8s; animation-delay: -5.2s; }
.dust i:nth-child(6) { left: 70%; top: 66%; animation-duration: 14.3s; animation-delay: -12.6s; }
@keyframes dustRise {
  0%   { opacity: 0;    transform: translate3d(0, 0, 0) scale(0.6); }
  12%  { opacity: 0.85; }
  70%  { opacity: 0.5; }
  100% { opacity: 0;    transform: translate3d(14px, -190px, 0) scale(1.1); }
}


@media (prefers-reduced-motion: reduce) {
  #threshold .aw, .farewell .aw,
  #threshold .nw, .farewell .nw {
    opacity: 1 !important; filter: none !important;
    transform: none !important; animation: none !important;
  }
  #threshold .threshold-title, .farewell .farewell-title,
  #threshold .threshold-names, .farewell .farewell-names,
  #threshold .threshold-actions, .farewell .farewell-actions {
    opacity: 1 !important; animation: none !important;
  }
  #threshold .threshold-names::before, #threshold .threshold-names::after,
  .farewell .farewell-names::before,   .farewell .farewell-names::after {
    animation: none !important; opacity: 0.8 !important; transform: translateY(-50%) !important;
  }
  .dust i    { animation: none !important; opacity: 0 !important; }
  #threshold .tm-art.tm-under, #threshold .tm-art:not(.tm-under),
  .farewell  .tm-art.tm-under, .farewell  .tm-art:not(.tm-under) { animation: none !important; }
  #threshold .threshold-begin, .farewell .threshold-begin,
  #threshold .threshold-exit,  .farewell .threshold-exit,
  #threshold .threshold-btn,   .farewell .threshold-btn { animation: none !important; }
  .tm-spark2 { animation: none !important; opacity: 0.7 !important; }
}


@media (max-width: 720px) {
  #threshold .threshold-line, .farewell .farewell-line { max-width: 90vw !important; font-size: clamp(16px, 4.4vw, 22px) !important; }
  
  #threshold .threshold-names, .farewell .farewell-names {
    font-size: clamp(8.5px, 2.55vw, 24px) !important;
    letter-spacing: 0.03em !important;
    padding: 0 1.1em !important;
  }
  #threshold .threshold-names::before, #threshold .threshold-names::after,
  .farewell .farewell-names::before,   .farewell .farewell-names::after {
    width: 5px; height: 5px;
  }
  #threshold .threshold-title, .farewell .farewell-title { font-size: clamp(24px, 6.4vw, 34px) !important; }
}


.threshold-inner::before,
.farewell-inner::before {
  content: none !important;
  display: none !important;
  background: none !important;
  filter: none !important;
}


.threshold-welcome {
  margin: 8px 0 0;
  font-family: var(--font-display);
  font-style: italic;
  font-weight: 400;
  letter-spacing: normal;
  text-transform: none;
  font-size: min(clamp(30px, 2.9vw, 64px), 2.62vw);
  line-height: 1.6;
  color: #c98f14;
  text-shadow: 0 0 22px rgba(255, 198, 96, 0.50),
               0 2px 7px rgba(24, 8, 18, 0.92),
               0 1px 2px rgba(18, 5, 12, 0.98);
  white-space: nowrap;
  max-width: none;
  text-align: center;
  text-align-last: center;
  opacity: 1;
}


.threshold-greeting,
#threshold .threshold-line {
  font-family: 'EB Garamond', 'Cormorant Garamond', Georgia, serif !important;
  font-style: italic !important;
  font-weight: 400 !important;
  letter-spacing: normal !important;
  text-transform: none !important;
  font-size: min(clamp(30px, 2.9vw, 64px), 2.50vw) !important;
  line-height: 1.6 !important;
  color: #ffc14a !important;
  text-shadow: 0 0 22px rgba(255, 198, 96, 0.50),
               0 2px 7px rgba(24, 8, 18, 0.92),
               0 1px 2px rgba(18, 5, 12, 0.98) !important;
  text-align: center !important;
  text-align-last: center !important;
  
  white-space: nowrap !important;
  
  max-width: 97vw !important;
}


.tm--tr, .tm--bl {
  width: clamp(180px, 24vw, 400px) !important;
  height: clamp(180px, 24vw, 400px) !important;
}
.tm--tr { transform: translate(38%, -38%) !important; }
.tm--bl { transform: translate(-38%, 38%) !important; }

@media (max-width: 700px) {
  .tm--tr, .tm--bl {
    width: clamp(140px, 36vw, 200px) !important;
    height: clamp(140px, 36vw, 200px) !important;
  }
}


#threshold .threshold-welcome {
  margin: 4px 0 0 !important;
  font-family: 'EB Garamond', 'Cormorant Garamond', Georgia, serif !important;
  font-style: normal !important;
  font-weight: 600 !important;
  letter-spacing: 0.14em !important;
  text-indent: 0.14em !important;           
  
  font-size: clamp(28px, 3.3vw, 62px) !important;
  line-height: 1.15 !important;
  text-align: center !important;
  color: #ffc14a !important;
  text-shadow: 0 0 26px rgba(255, 198, 96, 0.55),
               0 2px 8px rgba(24, 8, 18, 0.92),
               0 1px 2px rgba(18, 5, 12, 0.98) !important;
}


#threshold .t-divider {
  display: block;
  width: min(52vw, 620px);
  max-width: 82%;
  margin: clamp(8px, 1.2vh, 18px) auto;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  pointer-events: none;
  opacity: 0.95;
  flex: 0 0 auto;
}
#threshold .t-divider--1 {
  height: clamp(34px, 6.2vh, 80px);
  background-image: url("data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///ywAAAAAAQABAAACAUwAOw==");
}
#threshold .t-divider--2 {
  height: clamp(22px, 4.2vh, 54px);
  width: min(46vw, 540px);
  background-image: url("data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///ywAAAAAAQABAAACAUwAOw==");
}
#threshold .t-divider--3 {
  height: clamp(20px, 4.0vh, 50px);
  width: min(42vw, 500px);
  background-image: url("data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///ywAAAAAAQABAAACAUwAOw==");
}
@media (max-width: 720px) {
  #threshold .t-divider { width: min(74vw, 420px); max-width: 88%; margin: 7px auto; }
  #threshold .t-divider--1 { height: clamp(26px, 5.0vh, 52px); }
  #threshold .t-divider--2 { width: min(68vw, 380px); height: clamp(18px, 3.4vh, 36px); }
  #threshold .t-divider--3 { width: min(62vw, 350px); height: clamp(17px, 3.2vh, 34px); }
}


@media (max-width: 720px) {
  .threshold-greeting,
  #threshold .threshold-line {
    white-space: normal !important;
    font-size: clamp(16px, 4.4vw, 22px) !important;
    max-width: 90vw !important;
  }
}




#threshold .threshold-welcome  { margin: 2px 0 0 !important; }
#threshold .threshold-greeting { margin: 4px auto 0 !important; }
#threshold .threshold-line     { margin: 4px auto 0 !important; }
#threshold .threshold-names    { margin: 4px auto 0 !important; }
#threshold .threshold-title    { margin: 4px auto 0 !important; }
#threshold .threshold-actions  { margin-top: clamp(10px, 1.4vh, 22px) !important; }


#threshold .t-divider {
  display: block;
  margin: 2px auto !important;
  max-width: 100%;
  height: auto;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 100% 100%;   
  pointer-events: none;
  opacity: 0.95;
  flex: 0 0 auto;
}

#threshold .t-divider--1 {
  font-size: clamp(28px, 3.3vw, 62px);
  width: 5.6em;
  aspect-ratio: 1600 / 313;
  background-image: url("data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///ywAAAAAAQABAAACAUwAOw==");
}

#threshold .t-divider--2 {
  font-size: min(clamp(30px, 2.9vw, 64px), 2.50vw);
  width: 29.8em;
  aspect-ratio: 1600 / 214;
  background-image: url("data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///ywAAAAAAQABAAACAUwAOw==");
}

#threshold .t-divider--3 {
  font-size: clamp(11px, 2.3vw, 27px);
  width: 18.8em;
  aspect-ratio: 1600 / 223;
  background-image: url("data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///ywAAAAAAQABAAACAUwAOw==");
}

#threshold .t-divider--4 {
  font-size: clamp(28px, 3.3vw, 62px);
  width: 14em;
  aspect-ratio: 1600 / 158;
  background-image: url("data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///ywAAAAAAQABAAACAUwAOw==");
}
@media (max-width: 720px) {
  
  #threshold .t-divider--2 { width: 88vw; }
}


@media (max-height: 1100px) {
  #threshold .t-divider--1 { width: 4.37em; }
  #threshold .t-divider--2 { width: 23.24em; }
  #threshold .t-divider--3 { width: 14.66em; }
  #threshold .t-divider--4 { width: 10.92em; }
}
@media (max-height: 800px) {
  #threshold .t-divider--1 { width: 3.36em; }
  #threshold .t-divider--2 { width: 17.88em; }
  #threshold .t-divider--3 { width: 11.28em; }
  #threshold .t-divider--4 { width: 8.40em; }
  #threshold .threshold-actions { margin-top: 8px !important; }
}
@media (max-height: 745px) {
  #threshold .t-divider--1 { width: 2.80em; }
  #threshold .t-divider--2 { width: 14.90em; }
  #threshold .t-divider--3 { width: 9.40em; }
  #threshold .t-divider--4 { width: 7.00em; }
}




#threshold .threshold-welcome {
  font-size: clamp(28px, 3.3vw, 62px) !important;   
}
#threshold .threshold-greeting,
#threshold .threshold-line {
  font-size: clamp(11px, 2.3vw, 27px) !important;   
}
#threshold .threshold-names {
  font-size: min(clamp(30px, 2.9vw, 64px), 2.50vw) !important;  
  max-width: 97vw !important;
  white-space: nowrap !important;
}


#threshold .t-divider {
  display: block;
  margin: 2px auto !important;
  max-width: 100%;
  height: auto;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 100% 100%;
  pointer-events: none;
  opacity: 0.95;
  flex: 0 0 auto;
}
#threshold .t-img-1 { aspect-ratio: 1600 / 313; background-image: url("data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///ywAAAAAAQABAAACAUwAOw=="); }
#threshold .t-img-4 { aspect-ratio: 1600 / 158; background-image: url("data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///ywAAAAAAQABAAACAUwAOw=="); }

#threshold .t-d-welcome { font-size: clamp(28px, 3.3vw, 62px);              width: 5.60em; }
#threshold .t-d-ded     { font-size: clamp(11px, 2.3vw, 27px);              width: 29.80em; }
#threshold .t-d-names   { font-size: min(clamp(30px,2.9vw,64px), 2.50vw);   width: 18.80em; }
#threshold .t-d-title   { font-size: clamp(28px, 3.3vw, 62px);              width: 14.00em; }


@media (max-height: 950px) and (min-width: 1700px) {
  
  #threshold .t-d-welcome { width: 4.76em; }
  #threshold .t-d-ded     { width: 25.33em; }
  #threshold .t-d-names   { width: 15.98em; }
  #threshold .t-d-title   { width: 11.90em; }
}
@media (max-height: 860px) {
  #threshold .t-d-welcome { width: 4.48em; }
  #threshold .t-d-ded     { width: 23.84em; }
  #threshold .t-d-names   { width: 15.04em; }
  #threshold .t-d-title   { width: 11.20em; }
  #threshold .threshold-actions { margin-top: 8px !important; }
}
@media (max-height: 745px) {
  #threshold .t-d-welcome { width: 3.92em; }
  #threshold .t-d-ded     { width: 20.86em; }
  #threshold .t-d-names   { width: 13.16em; }
  #threshold .t-d-title   { width: 9.80em; }
}
@media (max-height: 620px) {
  #threshold .t-d-welcome { width: 3.08em; }
  #threshold .t-d-ded     { width: 16.39em; }
  #threshold .t-d-names   { width: 10.34em; }
  #threshold .t-d-title   { width: 7.70em; }
}


@media (max-width: 720px) {
  #threshold .threshold-greeting,
  #threshold .threshold-line {
    white-space: normal !important;
    font-size: clamp(14px, 3.6vw, 19px) !important;
    max-width: 90vw !important;
  }
  #threshold .threshold-names {
    white-space: normal !important;
    font-size: clamp(16px, 4.4vw, 23px) !important;
    max-width: 90vw !important;
  }
  #threshold .t-d-ded   { width: 86vw; font-size: inherit; }
  #threshold .t-d-names { width: 74vw; font-size: inherit; }
}


#threshold .t-img-5 {
  aspect-ratio: 1600 / 175;
  background-image: url('assets/ornament-divider-5.png');
}
#threshold .threshold-welcome { margin-bottom: 0 !important; }
#threshold .t-d-welcome {
  font-size: clamp(28px, 3.3vw, 62px);
  width: 5.60em;                 
  margin-top: -0.10em !important;
  margin-bottom: 0 !important;
}


#threshold .t-img-arch {
  aspect-ratio: 1600 / 343;
  background-image: url("data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///ywAAAAAAQABAAACAUwAOw==");
}
#threshold .t-img-rule {
  aspect-ratio: 1600 / 151;
  background-image: url("data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///ywAAAAAAQABAAACAUwAOw==");
}
#threshold .t-d-stmt {
  font-size: clamp(11px, 2.3vw, 27px);
  width: 40.11em;
  margin: 0 auto !important;
}
#threshold .threshold-line {
  margin: 0 auto !important;
}
@media (max-width: 720px) {
  
  #threshold .t-d-stmt { width: 90vw; font-size: inherit; }
}


@media (max-height: 950px) and (min-width: 1700px) {
  #threshold .t-d-stmt { width: 36.10em; }
}
@media (max-height: 860px) { #threshold .t-d-stmt { width: 34.09em; } }
@media (max-height: 800px) { #threshold .t-d-stmt { width: 31.29em; } }
@media (max-height: 745px) { #threshold .t-d-stmt { width: 28.88em; } }
@media (max-height: 620px) { #threshold .t-d-stmt { width: 24.07em; } }


#threshold .t-img-nm {
  aspect-ratio: 1600 / 337;
  background-image: url("data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///ywAAAAAAQABAAACAUwAOw==");
}
#threshold .t-img-nm-flip {
  aspect-ratio: 1600 / 337;
  background-image: url("data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///ywAAAAAAQABAAACAUwAOw==");
}
#threshold .t-d-nm {
  font-size: min(clamp(30px, 2.9vw, 64px), 2.50vw);
  width: 18.80em;
  margin: 0 auto !important;
}


#threshold .threshold-line {
  margin: 0 auto !important;
  padding: 0 !important;
  line-height: 1.32 !important;
}
#threshold .threshold-names { margin: 0 auto !important; }

@media (max-width: 720px) {
  #threshold .t-d-nm { width: 78vw; font-size: inherit; }
}

@media (max-height: 860px) { #threshold .t-d-nm { width: 16.92em; } }
@media (max-height: 745px) { #threshold .t-d-nm { width: 15.04em; } }
@media (max-height: 620px) { #threshold .t-d-nm { width: 12.22em; } }

@media (max-height: 950px) and (min-width: 1700px) {
  #threshold .t-d-nm { width: 15.98em; }
}


#threshold .t-d-nm { width: 10.50em; }
@media (max-height: 950px) and (min-width: 1700px) {
  #threshold .t-d-nm { width: 8.93em; }
}
@media (max-height: 860px) { #threshold .t-d-nm { width: 9.45em; } }
@media (max-height: 745px) { #threshold .t-d-nm { width: 8.40em; } }
@media (max-height: 620px) { #threshold .t-d-nm { width: 6.83em; } }
@media (max-width: 720px)  { #threshold .t-d-nm { width: 44vw; font-size: inherit; } }


#threshold .t-img-nm2 {
  aspect-ratio: 1600 / 354;
  background-image: url("data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///ywAAAAAAQABAAACAUwAOw==");
}
#threshold .t-img-nm2-flip {
  aspect-ratio: 1600 / 354;
  background-image: url("data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///ywAAAAAAQABAAACAUwAOw==");
}
#threshold .t-d-nm2 {
  font-size: min(clamp(30px, 2.9vw, 64px), 2.50vw);
  width: 12.00em;
  margin: 0 auto !important;
}
#threshold .threshold-names {
  margin: 0 auto !important;
  padding: 0 !important;
}
@media (max-height: 950px) and (min-width: 1700px) {
  #threshold .t-d-nm2 { width: 10.20em; }
}
@media (max-height: 860px) { #threshold .t-d-nm2 { width: 10.80em; } }
@media (max-height: 745px) { #threshold .t-d-nm2 { width:  9.60em; } }
@media (max-height: 620px) { #threshold .t-d-nm2 { width:  7.80em; } }
@media (max-width: 720px)  { #threshold .t-d-nm2 { width: 50vw; font-size: inherit; } }


#threshold .t-img-nm3 {
  aspect-ratio: 1600 / 278;
  background-image: url("data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///ywAAAAAAQABAAACAUwAOw==");
}
#threshold .t-img-nm3-flip {
  aspect-ratio: 1600 / 278;
  background-image: url("data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///ywAAAAAAQABAAACAUwAOw==");
}
#threshold .t-d-nm3 {
  font-size: min(clamp(30px, 2.9vw, 64px), 2.50vw);
  width: 18.80em;                 
  margin: 0 auto !important;
}
#threshold .threshold-names {
  margin: 0 auto !important;
  padding: 0 !important;
}
@media (max-height: 950px) and (min-width: 1700px) {
  #threshold .t-d-nm3 { width: 15.98em; }
}
@media (max-height: 860px) { #threshold .t-d-nm3 { width: 16.92em; } }
@media (max-height: 745px) { #threshold .t-d-nm3 { width: 15.04em; } }
@media (max-height: 620px) { #threshold .t-d-nm3 { width: 12.22em; } }
@media (max-width: 720px)  { #threshold .t-d-nm3 { width: 78vw; font-size: inherit; } }


#threshold .t-img-nm4 {
  aspect-ratio: 1600 / 138;
  background-image: url("data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///ywAAAAAAQABAAACAUwAOw==");
}
#threshold .t-img-nm4-flip {
  aspect-ratio: 1600 / 138;
  background-image: url("data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///ywAAAAAAQABAAACAUwAOw==");
}
#threshold .t-d-nm4 {
  font-size: min(clamp(30px, 2.9vw, 64px), 2.50vw);
  width: 18.80em;                 
  margin: 0 auto !important;
}
#threshold .threshold-names {
  margin: 0 auto !important;
  padding: 0 !important;
}
@media (max-width: 720px) { #threshold .t-d-nm4 { width: 78vw; font-size: inherit; } }


#threshold .t-img-nm5 {
  aspect-ratio: 1200 / 165;
  background-image: url("data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///ywAAAAAAQABAAACAUwAOw==");
}
#threshold .t-img-nm5-flip {
  aspect-ratio: 1200 / 165;
  background-image: url("data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///ywAAAAAAQABAAACAUwAOw==");
}
#threshold .t-d-nm5 {
  font-size: min(clamp(30px, 2.9vw, 64px), 2.50vw);
  width: 18.80em;                 
  margin: 0 auto !important;
}
#threshold .threshold-names {
  margin: 0 auto !important;
  padding: 0 !important;
}
@media (max-width: 720px) { #threshold .t-d-nm5 { width: 78vw; font-size: inherit; } }


#threshold .t-img-nm6 {
  aspect-ratio: 1200 / 189;
  background-image: url("data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///ywAAAAAAQABAAACAUwAOw==");
}
#threshold .t-img-nm6-flip {
  aspect-ratio: 1200 / 189;
  background-image: url("data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///ywAAAAAAQABAAACAUwAOw==");
}
#threshold .t-d-nm6 {
  font-size: min(clamp(30px, 2.9vw, 64px), 2.50vw);
  width: 18.80em;                 
  margin: 0 auto !important;
}
#threshold .threshold-names {
  margin: 0 auto !important;
  padding: 0 !important;
}
@media (max-width: 720px) { #threshold .t-d-nm6 { width: 78vw; font-size: inherit; } }


#threshold .t-img-nm8 {
  aspect-ratio: 1400 / 177;
  background-image: url("data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///ywAAAAAAQABAAACAUwAOw==");
}
#threshold .t-img-nm8-flip {
  aspect-ratio: 1400 / 177;
  background-image: url("data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///ywAAAAAAQABAAACAUwAOw==");
}
#threshold .t-d-nm8 {
  font-size: min(clamp(30px, 2.9vw, 64px), 2.50vw);
  width: 18.80em;                 
  margin: 0 auto !important;
}
#threshold .threshold-names {
  margin: 0 auto !important;
  padding: 0 !important;
}
@media (max-width: 720px) { #threshold .t-d-nm8 { width: 78vw; font-size: inherit; } }


#threshold .t-img-nm9 {
  aspect-ratio: 1400 / 238;
  background-image: url("data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///ywAAAAAAQABAAACAUwAOw==");
}
#threshold .t-img-nm9-flip {
  aspect-ratio: 1400 / 238;
  background-image: url("data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///ywAAAAAAQABAAACAUwAOw==");
}
#threshold .t-d-nm9 {
  font-size: min(clamp(30px, 2.9vw, 64px), 2.50vw);
  width: 18.80em;                 
  margin: 0 auto !important;
}
#threshold .threshold-names {
  margin: 0 auto !important;
  padding: 0 !important;
}
@media (max-width: 720px) { #threshold .t-d-nm9 { width: 78vw; font-size: inherit; } }


#threshold .t-frame-top,
#threshold .t-frame-bot {
  display: block;
  margin: 0 auto !important;
  max-width: 96vw;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 100% 100%;
  pointer-events: none;
  font-size: min(clamp(30px, 2.9vw, 64px), 2.50vw);
}
#threshold .t-frame-top {
  width: 18.80em;                    
  aspect-ratio: 1400 / 257;
  background-image: url("data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///ywAAAAAAQABAAACAUwAOw==");
}
#threshold .t-frame-bot {
  width: 12.99em;                    
  aspect-ratio: 967 / 186;
  background-image: url("data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///ywAAAAAAQABAAACAUwAOw==");
}
#threshold .threshold-names {
  margin: 0 auto !important;
  padding: 0 !important;
}
@media (max-width: 720px) {
  #threshold .t-frame-top { width: 78vw; font-size: inherit; }
  #threshold .t-frame-bot { width: 54vw; font-size: inherit; }
}


#threshold .t-fr2-top,
#threshold .t-fr2-bot {
  display: block;
  margin: 0 auto !important;
  width: 18.80em;                    
  max-width: 96vw;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 100% 100%;
  pointer-events: none;
  font-size: min(clamp(30px, 2.9vw, 64px), 2.50vw);
}
#threshold .t-fr2-top {
  aspect-ratio: 1400 / 149;
  background-image: url("data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///ywAAAAAAQABAAACAUwAOw==");
}
#threshold .t-fr2-bot {
  aspect-ratio: 1400 / 135;
  background-image: url("data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///ywAAAAAAQABAAACAUwAOw==");
}
#threshold .threshold-names {
  margin: 0 auto !important;
  padding: 0 !important;
}
@media (max-width: 720px) {
  #threshold .t-fr2-top, #threshold .t-fr2-bot { width: 78vw; font-size: inherit; }
}


#threshold .t-fr3-top,
#threshold .t-fr3-bot {
  display: block;
  margin: 0 auto !important;
  width: 31.96em;                 
  max-width: 96vw;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 100% 100%;
  pointer-events: none;
  font-size: min(clamp(30px, 2.9vw, 64px), 2.50vw);
}
#threshold .t-fr3-top {
  aspect-ratio: 1900 / 164;
  background-image: url("data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///ywAAAAAAQABAAACAUwAOw==");
}
#threshold .t-fr3-bot {
  aspect-ratio: 1898 / 111;
  background-image: url("data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///ywAAAAAAQABAAACAUwAOw==");
}
#threshold .threshold-names {
  margin: 0 auto !important;
  padding: 0 !important;
}
@media (max-width: 720px) {
  #threshold .t-fr3-top, #threshold .t-fr3-bot { width: 94vw; font-size: inherit; }
}


#threshold .t-fr4-top,
#threshold .t-fr4-bot {
  display: block;
  margin: 0 auto !important;
  width: 31.96em;
  max-width: 96vw;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 100% 100%;
  pointer-events: none;
  font-size: min(clamp(30px, 2.9vw, 64px), 2.50vw);
  image-rendering: auto;
}
#threshold .t-fr4-top {
  aspect-ratio: 4400 / 380;
  background-image: url("data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///ywAAAAAAQABAAACAUwAOw==");
}
#threshold .t-fr4-bot {
  aspect-ratio: 4394 / 257;
  background-image: url("data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///ywAAAAAAQABAAACAUwAOw==");
}
#threshold .threshold-names {
  margin: 0 auto !important;
  padding: 0 !important;
}
@media (max-width: 720px) {
  #threshold .t-fr4-top, #threshold .t-fr4-bot { width: 94vw; font-size: inherit; }
}


#threshold .t-fr5-top,
#threshold .t-fr5-bot {
  display: block;
  margin: 0 auto !important;
  width: 18.80em;                 
  max-width: 96vw;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 100% 100%;
  pointer-events: none;
  font-size: min(clamp(30px, 2.9vw, 64px), 2.50vw);
}
#threshold .t-fr5-top {
  aspect-ratio: 4400 / 1117;
  background-image: url("data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///ywAAAAAAQABAAACAUwAOw==");
}
#threshold .t-fr5-bot {
  aspect-ratio: 4400 / 1081;
  background-image: url("data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///ywAAAAAAQABAAACAUwAOw==");
}
#threshold .threshold-names {
  margin: 0 auto !important;
  padding: 0 !important;
}
@media (max-width: 720px) {
  #threshold .t-fr5-top, #threshold .t-fr5-bot { width: 92vw; font-size: inherit; }
}

@media (max-height: 950px) and (min-width: 1700px) {
  #threshold .t-fr5-top, #threshold .t-fr5-bot { width: 14.66em; }
}
@media (max-height: 860px) {
  #threshold .t-fr5-top, #threshold .t-fr5-bot { width: 16.92em; }
}
@media (max-height: 745px) {
  #threshold .t-fr5-top, #threshold .t-fr5-bot { width: 15.42em; }
}
@media (max-height: 620px) {
  #threshold .t-fr5-top, #threshold .t-fr5-bot { width: 14.10em; }
}


#threshold .t-fr5-top, #threshold .t-fr5-bot { width: 11.50em; }
@media (max-height: 950px) and (min-width: 1700px) {
  #threshold .t-fr5-top, #threshold .t-fr5-bot { width: 8.97em; }
}
@media (max-height: 860px) {
  #threshold .t-fr5-top, #threshold .t-fr5-bot { width: 10.35em; }
}
@media (max-height: 745px) {
  #threshold .t-fr5-top, #threshold .t-fr5-bot { width: 9.43em; }
}
@media (max-height: 620px) {
  #threshold .t-fr5-top, #threshold .t-fr5-bot { width: 8.62em; }
}
@media (max-width: 720px) {
  #threshold .t-fr5-top, #threshold .t-fr5-bot { width: 56vw; font-size: inherit; }
}


#threshold .t-fr6-top,
#threshold .t-fr6-bot {
  display: block;
  margin: 0 auto !important;
  width: 18.80em;                 
  max-width: 96vw;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 100% 100%;
  pointer-events: none;
  font-size: min(clamp(30px, 2.9vw, 64px), 2.50vw);
}
#threshold .t-fr6-top {
  aspect-ratio: 4400 / 275;
  background-image: url("data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///ywAAAAAAQABAAACAUwAOw==");
}
#threshold .t-fr6-bot {
  aspect-ratio: 4417 / 281;
  background-image: url("data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///ywAAAAAAQABAAACAUwAOw==");
}
#threshold .threshold-names {
  margin: 0 auto !important;
  padding: 0 !important;
}
@media (max-width: 720px) {
  #threshold .t-fr6-top, #threshold .t-fr6-bot { width: 78vw; font-size: inherit; }
}


#threshold .t-title-orn {
  display: block;
  margin: 2px auto 0 !important;
  font-size: clamp(28px, 3.3vw, 62px);   
  
  width: 16.74em;   
  max-width: 92vw;
  aspect-ratio: 4400 / 209;
  background-image: url('assets/ornament-title-ext.png');
  background-repeat: no-repeat;
  background-position: center;
  background-size: 100% 100%;
  pointer-events: none;
}
@media (max-width: 720px) {
  #threshold .t-title-orn { width: 90vw; font-size: inherit; }
}


#threshold .t-fr7-top,
#threshold .t-fr7-bot {
  display: block;
  margin: 0 auto !important;
  width: 33.30em;   
  max-width: 96vw;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 100% 100%;
  pointer-events: none;
  font-size: min(clamp(30px, 2.9vw, 64px), 2.50vw);
}
#threshold .t-fr7-top {
  
  aspect-ratio: 4400 / 148;
  background-image: url('assets/ornament-fr7-top.png');
}
#threshold .t-fr7-bot {
  
  aspect-ratio: 4400 / 140;
  background-image: url('assets/ornament-fr7-bottom.png');
}
#threshold .threshold-names {
  margin: 0 auto !important;
  padding: 0 !important;
}
@media (max-width: 720px) {
  #threshold .t-fr7-top, #threshold .t-fr7-bot { width: 92vw; font-size: inherit; }
}


#threshold .threshold-line {
  font-size: clamp(15px, calc(2.3vw + 4px), 31px) !important;
}
#threshold .threshold-welcome {
  font-size: clamp(25px, calc(3.3vw - 3px), 59px) !important;
}
@media (max-width: 720px) {
  #threshold .threshold-line { font-size: clamp(18px, calc(3.6vw + 4px), 23px) !important; }
}


#threshold .threshold-line {
  font-size: clamp(15px, 2.64vw, 31px) !important;
}
#threshold .threshold-welcome {
  font-size: clamp(25px, 3.06vw, 59px) !important;
}
#threshold .threshold-names {
  color: transparent !important;
  text-shadow: none !important;
  background-image: linear-gradient(100deg, #f0b45a 0%, #f0b45a 38%, #fff0cf 50%, #f0b45a 62%, #f0b45a 100%) !important;
  background-size: 280% 100% !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  opacity: 0;
  animation: seRise 1.3s var(--ease-soft) 3.30s forwards,
             seSweep 9s linear 4.80s infinite !important;
}


@media (prefers-reduced-motion: reduce) {
  #threshold .threshold-names {
    opacity: 1 !important;
    animation: none !important;
    background-position: 50% 0 !important;
  }
}


#threshold .threshold-names .nw {
  display: inline !important;
  opacity: 1 !important;
  filter: none !important;
  transform: none !important;
  animation: none !important;
}


#threshold .threshold-title { margin-bottom: 0 !important; }
#threshold .t-title-orn { margin: -0.22em auto 0 !important; }


#threshold .t-title-orn {
  aspect-ratio: 4400 / 161;
  margin: -0.15em auto 0 !important;
}


#threshold .threshold-welcome {
  font-family: 'Cinzel', 'Cormorant Unicase', Georgia, serif !important;
}


#threshold .threshold-welcome { font-size: clamp(23px, 2.91vw, 57px) !important; }
#threshold .threshold-title   { font-size: clamp(30px, 3.45vw, 64px) !important; }
#threshold .t-title-orn {
  font-size: clamp(30px, 3.45vw, 64px);   
  aspect-ratio: 4400 / 154;
}




.farewell .farewell-line {
  font-family: 'EB Garamond', 'Cormorant Garamond', Georgia, serif !important;
  font-style: italic !important;
  font-weight: 400 !important;
  font-size: clamp(15px, 2.64vw, 31px) !important;
  line-height: 1.32 !important;
  color: #ffc14a !important;
  text-shadow: 0 0 22px rgba(255, 198, 96, 0.50),
               0 2px 7px rgba(24, 8, 18, 0.92),
               0 1px 2px rgba(18, 5, 12, 0.98) !important;
  text-align: center !important;
  margin: 0 auto !important;
  padding: 0 !important;
  max-width: 97vw !important;
}


.farewell .farewell-names {
  font-size: min(clamp(30px, 2.9vw, 64px), 2.50vw) !important;
  margin: 0 auto !important;
  padding: 0 !important;
  max-width: 97vw !important;
  white-space: nowrap !important;
  color: transparent !important;
  text-shadow: none !important;
  background-image: linear-gradient(100deg, #f0b45a 0%, #f0b45a 38%, #fff0cf 50%, #f0b45a 62%, #f0b45a 100%) !important;
  background-size: 280% 100% !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  opacity: 0;
  animation: seRise 1.3s var(--ease-soft) 3.30s forwards,
             seSweep 9s linear 4.80s infinite !important;
}
.farewell .farewell-names .nw {
  display: inline !important;
  opacity: 1 !important;
  filter: none !important;
  transform: none !important;
  animation: none !important;
}


.farewell .farewell-title {
  font-size: clamp(30px, 3.45vw, 64px) !important;
  margin: 0 auto 0 !important;
}


.farewell .t-divider {
  display: block;
  margin: 0 auto !important;
  max-width: 96vw;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 100% 100%;
  pointer-events: none;
}
.farewell .t-fr7-top,
.farewell .t-fr7-bot {
  width: 33.30em;
  font-size: min(clamp(30px, 2.9vw, 64px), 2.50vw);
}
.farewell .t-fr7-top { aspect-ratio: 4400 / 148; background-image: url('assets/ornament-fr7-top.png'); }
.farewell .t-fr7-bot { aspect-ratio: 4400 / 140; background-image: url('assets/ornament-fr7-bottom.png'); }
.farewell .t-title-orn {
  width: 16.74em;
  max-width: 92vw;
  font-size: clamp(30px, 3.45vw, 64px);
  aspect-ratio: 4400 / 154;
  margin: -0.15em auto 0 !important;
  background-image: url('assets/ornament-title-ext.png');
}
@media (max-width: 720px) {
  .farewell .t-fr7-top, .farewell .t-fr7-bot { width: 92vw; font-size: inherit; }
  .farewell .t-title-orn { width: 90vw; font-size: inherit; }
  .farewell .farewell-line, .farewell .farewell-names {
    white-space: normal !important; max-width: 90vw !important;
  }
}
@media (prefers-reduced-motion: reduce) {
  .farewell .farewell-names {
    opacity: 1 !important; animation: none !important; background-position: 50% 0 !important;
  }
}


#threshold .diya-scene, .farewell .diya-scene {
  transform: scale(0.99231);
  transform-origin: center bottom;
}
@media (max-width: 560px) {
  #threshold .diya-scene, .farewell .diya-scene {
    transform: scale(0.85338);          
    transform-origin: center bottom;
  }
}




.farewell .farewell-welcome {
  margin: 2px 0 0 !important;
  font-weight: 400 !important;
  font-style: normal !important;
  letter-spacing: 0.02em !important;
  text-indent: 0 !important;
  text-transform: none !important;
  line-height: 1.15 !important;
  text-align: center !important;
  color: #ffc14a !important;
  text-shadow: 0 0 26px rgba(255, 198, 96, 0.55),
               0 2px 8px rgba(24, 8, 18, 0.92),
               0 1px 2px rgba(18, 5, 12, 0.98) !important;
}
.farewell .t-divider.t-d-welcome {
  display: block;
  margin: -0.10em auto 0 !important;
  width: 5.60em;
  max-width: 92vw;
  font-size: clamp(28px, 3.3vw, 62px);
  aspect-ratio: 1600 / 175;
  background: url('assets/ornament-divider-5.png') center / 100% 100% no-repeat;
  pointer-events: none;
}


#threshold .threshold-welcome,
.farewell .farewell-welcome {
  font-family: 'Tangerine', 'Cinzel', Georgia, cursive, serif !important;
  font-weight: 400 !important;
  font-style: normal !important;
  letter-spacing: 0.02em !important;
  text-indent: 0 !important;
  
  font-size: clamp(44px, 5.5vw, 108px) !important;
}


#threshold .threshold-line,
.farewell .farewell-line {
  font-family: 'Josefin Sans', 'EB Garamond', Georgia, sans-serif !important;
  font-weight: 300 !important;
  font-style: italic !important;
  
  font-size: clamp(13px, 1.70vw, 29px) !important;
  text-shadow: 0 0 20px rgba(255, 198, 96, 0.42),
               0 2px 7px rgba(24, 8, 18, 0.96),
               0 1px 2px rgba(18, 5, 12, 1) !important;
}


.farewell .t-title-orn { width: 14.17em; }




#threshold .threshold-welcome, .farewell .farewell-welcome,
#threshold .threshold-line,    .farewell .farewell-line {
  text-shadow: 0 2px 7px rgba(0, 0, 0, 0.94), 0 1px 2px rgba(0, 0, 0, 0.98) !important;
}
#threshold .threshold-title, .farewell .farewell-title,
#threshold .threshold-names, .farewell .farewell-names {
  text-shadow: none !important;
}


#threshold .tm-art, .farewell .tm-art { filter: none !important; }
#threshold .tm-spark2, .farewell .tm-spark2,
#threshold .dust i,    .farewell .dust i,
#threshold .fw-layer i, .farewell .fw-layer i {
  box-shadow: none !important;
  filter: none !important;
}


#threshold .threshold-names::before, #threshold .threshold-names::after,
.farewell .farewell-names::before,   .farewell .farewell-names::after {
  box-shadow: none !important;
  filter: none !important;
}


#threshold .threshold-btn, .farewell .threshold-btn,
#threshold .threshold-begin, .farewell .threshold-begin,
#threshold .threshold-exit,  .farewell .threshold-exit {
  animation: none !important;
  filter: none !important;
}
#threshold .threshold-begin, .farewell .threshold-begin {
  box-shadow: 0 10px 22px rgba(0, 0, 0, 0.38) !important;
}
#threshold .threshold-begin:hover, .farewell .threshold-begin:hover {
  box-shadow: 0 14px 30px rgba(0, 0, 0, 0.46) !important;
}


#threshold .threshold-welcome,
.farewell  .farewell-welcome {
  width: fit-content;
  max-width: 92vw;
  margin: 2px auto 0 !important;
  position: relative;
}
#threshold .threshold-welcome::after,
.farewell  .farewell-welcome::after {
  content: '';
  display: block;
  width: 100%;                       
  aspect-ratio: 1600 / 175;
  margin-top: -0.04em;
  background: url('assets/ornament-divider-5.png') center / 100% 100% no-repeat;
  pointer-events: none;
}
#threshold .t-d-welcome,
.farewell  .t-d-welcome { display: none !important; }


#threshold .threshold-welcome,
.farewell  .farewell-welcome {
  line-height: 0.85 !important;
}
#threshold .threshold-welcome::after,
.farewell  .farewell-welcome::after {
  margin-top: -0.12em;
}


.farewell .farewell-welcome::after {
  width: calc(100% - 8px);
  margin-inline: auto;
}


#threshold .threshold-names, .farewell .farewell-names,
#threshold .threshold-title, .farewell .farewell-title {
  opacity: 1 !important;
  animation: seRise 0.2s var(--ease-soft) 0s both,
             seSweep 9s linear 0.35s infinite !important;
}


#threshold .threshold-welcome::after,
.farewell  .farewell-welcome::after {
  aspect-ratio: auto;
  height: 0.3111em;
  background-size: 100% 100%;
}


#threshold .threshold-welcome::after,
.farewell  .farewell-welcome::after {
  background-image: url("data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///ywAAAAAAQABAAACAUwAOw==");
}


#threshold .threshold-actions,
.farewell  .farewell-actions {
  opacity: 1 !important;
  animation: riseIn 0.2s var(--ease-spring) 0s both,
             capRegalia 6.8s cubic-bezier(0.45, 0, 0.55, 1) 0.4s infinite !important;
}


@media (prefers-reduced-motion: reduce) {
  #threshold .threshold-actions,
  .farewell  .farewell-actions {
    opacity: 1 !important;
    animation: none !important;
    transform: none !important;
    filter: none !important;
  }
}


#threshold .threshold-welcome::after,
.farewell  .farewell-welcome::after {
  height: auto;
  aspect-ratio: 2400 / 201;
  background-size: 100% 100%;
}

#threshold .threshold-welcome,
.farewell  .farewell-welcome {
  font-family: 'Josefin Sans', 'Cinzel', Georgia, sans-serif !important;
  font-weight: 400 !important;
  font-style: normal !important;
  font-size: clamp(23px, 2.91vw, 57px) !important;
  line-height: 1.05 !important;
  letter-spacing: 0.08em !important;
  text-indent: 0.08em !important;   
}


#threshold .tm-sparks, .farewell .tm-sparks { display: block !important; }

#threshold .tm-spark2, .farewell .tm-spark2 {
  display: block !important;
  position: absolute;
  transform: translate(-50%, -50%);
  background: linear-gradient(135deg, #fff8e2 0%, #ffd98a 55%, #f0b45a 100%);
  box-shadow: 0 0 6px rgba(255, 216, 150, 0.75) !important;
  filter: none !important;
  pointer-events: none;
  animation-name: twinkleMix !important;
  animation-iteration-count: infinite !important;
  animation-timing-function: ease-in-out !important;
}

#threshold .tm-spark2:nth-child(3n),   .farewell .tm-spark2:nth-child(3n),
#threshold .tm-spark2:nth-child(4n+1), .farewell .tm-spark2:nth-child(4n+1) {
  width: auto; height: auto;
}


#threshold .sp-dot,     .farewell .sp-dot     { border-radius: 50%; }
#threshold .sp-diamond, .farewell .sp-diamond { border-radius: 1px;
  transform: translate(-50%, -50%) rotate(45deg); }
#threshold .sp-star,    .farewell .sp-star    { border-radius: 0;
  clip-path: polygon(50% 0%, 61% 35%, 98% 35%, 68% 57%, 79% 91%,
                     50% 70%, 21% 91%, 32% 57%, 2% 35%, 39% 35%); }

@keyframes twinkleMix {
  0%, 100% { opacity: 0.12; transform: translate(-50%, -50%) scale(0.5); }
  50%      { opacity: 1;    transform: translate(-50%, -50%) scale(1.25); }
}

@keyframes twinkleMixDiamond {
  0%, 100% { opacity: 0.12; transform: translate(-50%, -50%) rotate(45deg) scale(0.5); }
  50%      { opacity: 1;    transform: translate(-50%, -50%) rotate(45deg) scale(1.25); }
}
#threshold .sp-diamond, .farewell .sp-diamond { animation-name: twinkleMixDiamond !important; }

@media (prefers-reduced-motion: reduce) {
  #threshold .tm-spark2, .farewell .tm-spark2 {
    animation: none !important;
    opacity: 0.75 !important;
  }
}


#threshold .threshold-welcome,
.farewell  .farewell-welcome {
  color: transparent !important;
  text-shadow: none !important;
  -webkit-text-fill-color: transparent !important;
  background-image:
    linear-gradient(100deg, rgba(255,255,255,0) 36%, rgba(255,246,216,0.92) 50%, rgba(255,255,255,0) 64%),
    radial-gradient(circle at 50% 38%, #fff6d8 0%, #ffd07a 28%, #e8b246 55%, #c8912c 100%) !important;
  background-size: 300% 100%, 100% 100% !important;
  background-repeat: no-repeat, no-repeat !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  animation: wgCombo 5.2s linear infinite !important;
  isolation: isolate;
}
@keyframes wgCombo {
  0%   { background-position: 190% 0, 50% 38%; }
  50%  { background-position:  45% 0, 53% 34%; }
  100% { background-position: -90% 0, 50% 38%; }
}


#threshold .threshold-welcome::before,
.farewell  .farewell-welcome::before {
  content: '';
  position: absolute;
  inset: -34% -14%;
  pointer-events: none;
  background-image:
    radial-gradient(circle, #fff8e6 0 2.2px, rgba(255,232,170,0.55) 3.2px, transparent 4.6px),
    radial-gradient(circle, #ffe6b0 0 1.6px, rgba(255,216,140,0.5) 2.4px, transparent 3.6px);
  background-repeat: no-repeat, no-repeat;
  animation: wgOrbit 7.5s linear infinite, wgOrbitTwinkle 2.9s ease-in-out infinite;
}
@keyframes wgOrbit {
  0%   { background-position:  4% 26%, 96% 74%; }
  25%  { background-position: 32%  4%, 68% 96%; }
  50%  { background-position: 96% 26%, 4%  74%; }
  75%  { background-position: 66% 96%, 34%  4%; }
  100% { background-position:  4% 26%, 96% 74%; }
}
@keyframes wgOrbitTwinkle { 0%,100% { opacity: 0.35; } 50% { opacity: 1; } }

@media (prefers-reduced-motion: reduce) {
  #threshold .threshold-welcome, .farewell .farewell-welcome {
    animation: none !important;
    background-position: 50% 0, 50% 38% !important;
  }
  #threshold .threshold-welcome::before, .farewell .farewell-welcome::before {
    animation: none !important;
    opacity: 0.8;
  }
}


#virtues  .section-heading h3.heading-accent,
#academic .section-heading h3.heading-accent,
#timeline .section-heading h3.heading-accent {
  font-size: clamp(32px, 4vw, 56px) !important;
}


#virtues .section-heading h3.heading-accent {
  font-size: min(clamp(24px, 3.3vw, 40px), 3.00vw) !important;
  white-space: nowrap !important;
  text-wrap: nowrap !important;
  max-width: none !important;
}
#academic .section-heading h3.heading-accent {
  font-size: min(clamp(22px, 3.0vw, 36px), 2.70vw) !important;
  white-space: nowrap !important;
  text-wrap: nowrap !important;
  max-width: none !important;
}


#threshold .corner-tl, .farewell .corner-tl,
#threshold .corner-br, .farewell .corner-br {
  position: absolute;
  
  width: clamp(96px, 12.5vw, 208px);
  aspect-ratio: 1200 / 1223;
  background-size: contain;
  background-repeat: no-repeat;
  z-index: 1;
  pointer-events: none;
  opacity: 0.92;
}
#threshold .corner-tl, .farewell .corner-tl {
  top: clamp(10px, 1.6vw, 26px);
  left: clamp(10px, 1.6vw, 26px);
  background-image: url("data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///ywAAAAAAQABAAACAUwAOw==");
  background-position: top left;
}

#threshold .corner-br, .farewell .corner-br {
  bottom: clamp(10px, 1.6vw, 26px);
  right: clamp(10px, 1.6vw, 26px);
  background-image: url("data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///ywAAAAAAQABAAACAUwAOw==");
  background-position: bottom right;
}
@media (max-width: 720px) {
  #threshold .corner-tl, .farewell .corner-tl,
  #threshold .corner-br, .farewell .corner-br { width: clamp(64px, 19vw, 108px); }
  #threshold .corner-tl, .farewell .corner-tl { top: 8px; left: 8px; }
  #threshold .corner-br, .farewell .corner-br { bottom: 8px; right: 8px; }
}


#threshold .threshold-welcome::after,
.farewell  .farewell-welcome::after {
  background-image: url('assets/ornament-title-ext.png');
  aspect-ratio: 4400 / 154;
  height: auto;
  width: 100%;
  margin-inline: 0;
}


#threshold .threshold-line,
.farewell  .farewell-line {
  font-family: 'Cormorant Garamond', 'EB Garamond', Georgia, serif !important;
  font-style: italic !important;
  font-weight: 400 !important;
  font-size: clamp(19px, 2.60vw, 44px) !important;
}


#threshold .threshold-welcome::after,
.farewell  .farewell-welcome::after {
  background-image: url('assets/ornament-welcome-gold.png');
  aspect-ratio: 2600 / 329;
  height: auto;
  width: 100%;
  margin-inline: 0;
}


#threshold .threshold-welcome::after,
.farewell  .farewell-welcome::after,
#threshold .t-title-orn,
.farewell  .t-title-orn {
  background-image: url('assets/orn-motif.png'), url('assets/orn-line.png');
  background-size: auto 100%, 100% 100%;
  background-position: center center, center center;
  background-repeat: no-repeat, no-repeat;
  aspect-ratio: auto !important;
  height: clamp(16px, 1.98vw, 32px) !important;
}

#threshold .t-title-orn { width: 16.74em; }
.farewell  .t-title-orn { width: 14.17em; }


#threshold .threshold-line,
.farewell  .farewell-line {
  font-size: clamp(17.5px, 2.49vw, 42.5px) !important;
}


#threshold .threshold-line,
.farewell  .farewell-line {
  font-size: clamp(16.5px, 2.42vw, 41.5px) !important;
}


#threshold .threshold-line,
.farewell  .farewell-line {
  font-size: clamp(15.5px, 2.35vw, 40.5px) !important;
}


#threshold .threshold-line,
.farewell  .farewell-line {
  font-size: clamp(14.5px, 2.28vw, 39.5px) !important;
}


#threshold .threshold-line,
.farewell  .farewell-line {
  font-size: clamp(13px, 1.95vw, 34px) !important;
}


#threshold .threshold-inner,
.farewell  .farewell-inner {
  transform: translateY(-2.4vh);
}


#threshold .diya-scene, .farewell .diya-scene {
  transform: scale(0.98462);
  transform-origin: center bottom;
  margin-left: auto;
  margin-right: auto;
}
@media (max-width: 560px) {
  #threshold .diya-scene, .farewell .diya-scene {
    transform: scale(0.84677);        
    transform-origin: center bottom;
  }
}


#threshold .threshold-line,
.farewell  .farewell-line {
  font-size: clamp(14px, 2.106vw, 36.7px) !important;
}


#threshold .threshold-line,
.farewell  .farewell-line {
  font-size: clamp(13.3px, 2.001vw, 34.9px) !important;
}


#threshold, .farewell {
  background:
    radial-gradient(ellipse 52% 42% at 50% 34%, rgba(255, 203, 96, 0.42), transparent 66%),
    radial-gradient(ellipse 70% 60% at 8% 6%,   rgba(255, 170, 60, 0.20), transparent 64%),
    radial-gradient(ellipse 74% 66% at 94% 96%, rgba(120, 52, 8, 0.55),  transparent 66%),
    radial-gradient(ellipse 130% 108% at 50% 50%, transparent 38%, rgba(58, 26, 4, 0.86) 100%),
    linear-gradient(116deg, #7b3f0b 0%, #9c530f 22%, #a85a12 48%, #7d400a 74%, #5a2c06 100%)
    !important;
  background-color: #6d3708 !important;
}


#threshold .corner-tl, .farewell .corner-tl,
#threshold .corner-tr, .farewell .corner-tr,
#threshold .corner-bl, .farewell .corner-bl,
#threshold .corner-br, .farewell .corner-br {
  position: absolute;
  width: clamp(96px, 12.5vw, 208px);
  aspect-ratio: 1200 / 1223;
  background-size: contain;
  background-repeat: no-repeat;
  z-index: 1;
  pointer-events: none;
  opacity: 0.92;
}
#threshold .corner-tr, .farewell .corner-tr {
  top: clamp(10px, 1.6vw, 26px); right: clamp(10px, 1.6vw, 26px);
  background-image: url("data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///ywAAAAAAQABAAACAUwAOw=="); background-position: top right;
}
#threshold .corner-bl, .farewell .corner-bl {
  bottom: clamp(10px, 1.6vw, 26px); left: clamp(10px, 1.6vw, 26px);
  background-image: url("data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///ywAAAAAAQABAAACAUwAOw=="); background-position: bottom left;
}


#threshold .threshold-art,
.farewell  .threshold-art,
.farewell  .farewell-art {
  --cw: clamp(96px, 12.5vw, 208px);
  --ci: clamp(10px, 1.6vw, 26px);
  --edge: calc(var(--ci) + var(--cw) * 0.0720);
  clip-path: inset(var(--edge) var(--edge) var(--edge) var(--edge));
}
@media (max-width: 720px) {
  #threshold .corner-tl, .farewell .corner-tl,
  #threshold .corner-tr, .farewell .corner-tr,
  #threshold .corner-bl, .farewell .corner-bl,
  #threshold .corner-br, .farewell .corner-br { width: clamp(64px, 19vw, 108px); }
  #threshold .corner-tr, .farewell .corner-tr { top: 8px; right: 8px; }
  #threshold .corner-bl, .farewell .corner-bl { bottom: 8px; left: 8px; }
  #threshold .threshold-art, .farewell .threshold-art, .farewell .farewell-art {
    --cw: clamp(64px, 19vw, 108px); --ci: 8px;
  }
}


#threshold, .farewell {
  background:
    radial-gradient(ellipse 54% 44% at 50% 34%, rgba(255, 214, 132, 0.38), transparent 66%),
    radial-gradient(ellipse 72% 62% at 8% 6%,   rgba(255, 186, 84, 0.20), transparent 64%),
    radial-gradient(ellipse 76% 68% at 94% 96%, rgba(126, 62, 8, 0.42), transparent 66%),
    radial-gradient(ellipse 132% 110% at 50% 50%, transparent 42%, rgba(110, 54, 6, 0.58) 100%),
    linear-gradient(116deg, #a9670f 0%, #bc7717 22%, #c8821f 48%, #ad6910 74%, #8e520a 100%)
    !important;
  background-color: #b57113 !important;
}


#threshold .threshold-line,
.farewell  .farewell-line {
  text-shadow:
    0 0 2px rgba(74, 30, 4, 0.85),
    0 1px 1px rgba(74, 30, 4, 0.60),
    0 2px 14px rgba(74, 30, 4, 0.32) !important;
}


#threshold .threshold-welcome, .farewell .farewell-welcome,
#threshold .threshold-names,   .farewell .farewell-names,
#threshold .threshold-title,   .farewell .farewell-title {
  filter:
    drop-shadow(0 0 2px rgba(74, 30, 4, 0.80))
    drop-shadow(0 1px 1px rgba(74, 30, 4, 0.55))
    drop-shadow(0 3px 14px rgba(74, 30, 4, 0.28)) !important;
}


#threshold .t-divider, .farewell .t-divider {
  filter: drop-shadow(0 1px 1px rgba(74, 30, 4, 0.55))
          drop-shadow(0 0 3px rgba(74, 30, 4, 0.45)) !important;
}


#threshold .corner-tl, #threshold .corner-tr,
#threshold .corner-bl, #threshold .corner-br,
.farewell  .corner-tl, .farewell  .corner-tr,
.farewell  .corner-bl, .farewell  .corner-br {
  filter: drop-shadow(0 1px 2px rgba(74, 30, 4, 0.55))
          drop-shadow(0 0 4px rgba(74, 30, 4, 0.40));
  opacity: 1;
}


#threshold .t-mandala .tm-art, .farewell .t-mandala .tm-art {
  filter: drop-shadow(0 0 2px rgba(94, 44, 6, 0.55))
          drop-shadow(0 1px 3px rgba(94, 44, 6, 0.40)) !important;
}


#threshold, .farewell {
  background:
    radial-gradient(ellipse 54% 44% at 50% 34%, rgba(255, 252, 232, 0.85), transparent 64%),
    radial-gradient(ellipse 72% 62% at 8% 6%,   rgba(255, 250, 226, 0.55), transparent 62%),
    radial-gradient(ellipse 76% 68% at 94% 96%, rgba(214, 204, 166, 0.55), transparent 64%),
    radial-gradient(ellipse 132% 112% at 50% 50%, transparent 44%, rgba(198, 188, 150, 0.50) 100%),
    linear-gradient(116deg, #f7f7e2 0%, #f5f5dc 26%, #f2f1d4 52%, #eeecca 78%, #e8e5c0 100%)
    !important;
  background-color: #f5f5dc !important;
}


#threshold .threshold-welcome,
.farewell  .farewell-welcome {
  background-image:
    linear-gradient(100deg, rgba(255,255,255,0) 36%, rgba(255,236,190,0.85) 50%, rgba(255,255,255,0) 64%),
    radial-gradient(circle at 50% 38%, #b8791c 0%, #a5620f 28%, #8a4a10 55%, #6b3a0a 100%) !important;
}


#threshold .threshold-names, .farewell .farewell-names,
#threshold .threshold-title, .farewell .farewell-title {
  background-image: linear-gradient(100deg,
      #8a4a10 0%, #8a4a10 38%, #c8912c 50%, #8a4a10 62%, #8a4a10 100%) !important;
}


#threshold .threshold-line,
.farewell  .farewell-line {
  color: #7d4a10 !important;
}


#threshold .threshold-line,
.farewell  .farewell-line {
  text-shadow: 0 1px 0 rgba(255, 255, 244, 0.75) !important;
}
#threshold .threshold-welcome, .farewell .farewell-welcome,
#threshold .threshold-names,   .farewell .farewell-names,
#threshold .threshold-title,   .farewell .farewell-title {
  filter: drop-shadow(0 1px 0 rgba(255, 255, 244, 0.70))
          drop-shadow(0 2px 10px rgba(120, 96, 40, 0.18)) !important;
}


#threshold .t-divider, .farewell .t-divider {
  filter: brightness(0.52) saturate(1.55)
          drop-shadow(0 1px 0 rgba(255, 255, 244, 0.6)) !important;
}
#threshold .corner-tl, #threshold .corner-tr,
#threshold .corner-bl, #threshold .corner-br,
.farewell  .corner-tl, .farewell  .corner-tr,
.farewell  .corner-bl, .farewell  .corner-br {
  filter: brightness(0.50) saturate(1.6)
          drop-shadow(0 1px 1px rgba(255, 255, 244, 0.5));
  opacity: 0.9;
}
#threshold .t-mandala .tm-art, .farewell .t-mandala .tm-art {
  filter: brightness(0.55) saturate(1.5) opacity(0.85) !important;
}


#threshold .dust i, .farewell .dust i {
  filter: brightness(0.45) saturate(1.6) !important;
}


#threshold .t-divider, .farewell .t-divider,
#threshold .threshold-welcome::after, .farewell .farewell-welcome::after {
  filter:
    saturate(1.18) brightness(1.02)
    drop-shadow(0 1px 1px rgba(122, 78, 18, 0.55))
    drop-shadow(0 0 2px rgba(140, 92, 24, 0.40)) !important;
  opacity: 1 !important;
}




#threshold .threshold-welcome,
.farewell  .farewell-welcome {
  background-image:
    linear-gradient(100deg, rgba(255,255,255,0) 36%, rgba(226,140,48,0.90) 50%, rgba(255,255,255,0) 64%),
    radial-gradient(circle at 50% 38%, #c2620d 0%, #b1560a 28%, #a85207 55%, #8f4406 100%) !important;
}


#threshold .threshold-names, .farewell .farewell-names,
#threshold .threshold-title, .farewell .farewell-title {
  background-image: linear-gradient(100deg,
      #a85207 0%, #a85207 38%, #d2761a 50%, #a85207 62%, #a85207 100%) !important;
}




#mPadma path[stroke-width="1.05"] {
  stroke: #e0b64a;
  stroke-width: 1.25;
}


#mChakra path[stroke-width="0.9"] {
  stroke: #a85207;
  stroke-width: 1.05;
}


#threshold .t-mandala .tm-art, .farewell .t-mandala .tm-art {
  filter:
    drop-shadow(0 1px 1px rgba(122, 78, 18, 0.45))
    drop-shadow(0 0 2px rgba(140, 92, 24, 0.30)) !important;
  opacity: 0.95 !important;
}




body {
  background:
    radial-gradient(ellipse at 20% 0%,   rgba(255, 246, 206, 0.55), transparent 42%),
    radial-gradient(ellipse at 82% 8%,   rgba(250, 244, 210, 0.45), transparent 38%),
    radial-gradient(ellipse at 50% 100%, rgba(226, 220, 180, 0.45), transparent 46%),
    linear-gradient(160deg, #f7f7e4 0%, #f5f5dc 34%, #f2f1d4 68%, #edecc8 100%)
    !important;
  background-color: #f5f5dc !important;
  background-attachment: fixed !important;
}
@media print { body { background: #fff !important; } }


.topbar {
  background:
    linear-gradient(120deg, #e2a63e 0%, #d4922b 38%, #c8821f 72%, #bc7717 100%)
    !important;
  border-bottom: 1px solid rgba(90, 44, 6, 0.28) !important;
  box-shadow: 0 3px 18px rgba(90, 44, 6, 0.18) !important;
}
.topbar.scrolled {
  box-shadow: 0 5px 26px rgba(90, 44, 6, 0.28) !important;
}


.topbar .nav-links a,
.topbar .nav-links .nav-exit-btn,
.topbar .nav-links .admin-link,
.topbar .brand strong {
  color: #2a1806 !important;
  text-shadow: 0 1px 0 rgba(255, 243, 205, 0.35) !important;
}
.topbar .brand em {
  color: rgba(42, 24, 6, 0.78) !important;
}
.topbar .menu-toggle {
  background: rgba(255, 246, 216, 0.28) !important;
  border-color: rgba(90, 44, 6, 0.38) !important;
}
.topbar .menu-toggle span {
  background: #2a1806 !important;
}


.topbar .nav-links a:hover,
.topbar .nav-links a.active,
.topbar .nav-links .nav-exit-btn:hover {
  background: rgba(66, 32, 6, 0.20) !important;
  color: #1f1104 !important;
  text-shadow: 0 1px 0 rgba(255, 243, 205, 0.45) !important;
}


.nav-links {
  background: linear-gradient(160deg, #dfa23b 0%, #cd8a24 60%, #bc7717 100%) !important;
  border-color: rgba(90, 44, 6, 0.32) !important;
}




#mPadma path[stroke-width="1.05"] {
  fill: #e0b64a;
}


#mChakra path[stroke-width="0.9"] {
  fill: #a85207;
}



#mChakra path[stroke-width="0.9"] {
  stroke: #b4231d;
  fill: #b4231d;
}


#mPadma  path[stroke-width="0.85"],
#mChakra path[stroke-width="0.85"] {
  fill: #b4231d;
}


#threshold, .farewell {
  --cw: clamp(96px, 12.5vw, 208px);
  --ci: clamp(10px, 1.6vw, 26px);
  --th: calc(var(--cw) * 1223 / 1200);

}
@media (max-width: 720px) { #threshold, .farewell { --cw: clamp(64px, 19vw, 108px); --ci: 8px; } }



#threshold .corner-tl, #threshold .corner-tr,
#threshold .corner-bl, #threshold .corner-br,
.farewell  .corner-tl, .farewell  .corner-tr,
.farewell  .corner-bl, .farewell  .corner-br {
  filter:
    saturate(1.12)
    drop-shadow(0 1px 1px rgba(122, 78, 18, 0.55))
    drop-shadow(0 0 2px rgba(140, 92, 24, 0.40)) !important;
  opacity: 1 !important;
}


#threshold .diya-lamp, .farewell .diya-lamp {
  animation: lampSettle 0.55s var(--ease-spring) 0s both !important;
}
#threshold .diya-wick, .farewell .diya-wick {
  animation: wickRise 0.45s var(--ease-spring) 0.06s both !important;
}
#threshold .flame, .farewell .flame {
  animation: flameCatch 0.60s var(--ease-spring) 0.12s both,
             flameSway 7.3s ease-in-out 0.5s infinite,
             flameBreathe 3.9s ease-in-out 0.5s infinite !important;
}
#threshold .flame-halo, .farewell .flame-halo {
  animation: glowSwell 0.70s var(--ease-soft) 0.16s both,
             flameHaloBreathe 6.8s ease-in-out 0.7s infinite !important;
}
#threshold .diya-glow, .farewell .diya-glow {
  animation: glowSwell 0.70s var(--ease-soft) 0.18s both,
             glowBreathe 5.7s ease-in-out 0.8s infinite !important;
}
#threshold .diya-halo, .farewell .diya-halo {
  animation: glowSwell 0.80s var(--ease-soft) 0.22s both,
             haloBreathe 9.1s ease-in-out 0.9s infinite !important;
}
#threshold .d-rim, .farewell .d-rim {
  animation: fadeUpIn 0.55s var(--ease-soft) 0.10s both !important;
}


@media (prefers-reduced-motion: reduce) {
  #threshold .diya-lamp, .farewell .diya-lamp,
  #threshold .diya-wick, .farewell .diya-wick,
  #threshold .flame, .farewell .flame,
  #threshold .flame-halo, .farewell .flame-halo,
  #threshold .diya-glow, .farewell .diya-glow,
  #threshold .diya-halo, .farewell .diya-halo,
  #threshold .d-rim, .farewell .d-rim {
    animation: none !important;
    opacity: 1 !important;
  }
}




#threshold .ember, .farewell .ember {
  background: radial-gradient(circle at 50% 50%,
    #fffdf2 0%, #ffe9a6 34%, #f0be4c 72%, rgba(214, 150, 40, 0) 100%) !important;
  box-shadow: 0 0 5px 1px rgba(255, 214, 120, 0.75),
              0 0 0 1px rgba(122, 76, 12, 0.35) !important;
}


#threshold .tm-spark2, .farewell .tm-spark2 {
  background: linear-gradient(135deg, #fffdf2 0%, #ffe9a6 42%, #f2c855 74%, #dda23a 100%) !important;
  box-shadow: 0 0 7px rgba(255, 224, 160, 0.85),
              0 0 2px rgba(122, 76, 12, 0.40) !important;
  filter: none !important;
}



.topbar {
  background: linear-gradient(120deg, #fbf2ce 0%, #f7e9b0 44%, #f2e0a0 100%) !important;
  border-bottom: 1px solid rgba(140, 92, 24, 0.30) !important;
  box-shadow: 0 2px 12px rgba(120, 78, 18, 0.10) !important;
}
.topbar.scrolled { box-shadow: 0 4px 20px rgba(120, 78, 18, 0.18) !important; }

.topbar .nav-links a,
.topbar .nav-links .nav-exit-btn,
.topbar .nav-links .admin-link,
.topbar .brand strong {
  color: #2a1806 !important;
  text-shadow: 0 1px 0 rgba(255, 253, 240, 0.55) !important;
}
.topbar .brand em { color: rgba(58, 36, 10, 0.72) !important; }

.topbar .nav-links a:hover,
.topbar .nav-links a.active,
.topbar .nav-links .nav-exit-btn:hover {
  background: rgba(190, 140, 40, 0.22) !important;
  color: #1f1104 !important;
  text-shadow: 0 1px 0 rgba(255, 253, 240, 0.65) !important;
}

.topbar .menu-toggle {
  background: rgba(255, 255, 255, 0.55) !important;
  border-color: rgba(140, 92, 24, 0.34) !important;
}
.topbar .menu-toggle span { background: #2a1806 !important; }

.nav-links {
  background: linear-gradient(160deg, #fbf2ce 0%, #f7e9b0 58%, #f0dc98 100%) !important;
  border-color: rgba(140, 92, 24, 0.28) !important;
}


#threshold .t-fr7-top, .farewell .t-fr7-top {
  background-image: url("data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///ywAAAAAAQABAAACAUwAOw==") !important;
}
#threshold .t-fr7-bot, .farewell .t-fr7-bot {
  background-image: url("data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///ywAAAAAAQABAAACAUwAOw==") !important;
}


.voice-open[hidden] { display: none !important; }
.voice-open {
  display: inline-flex; align-items: center; gap: 9px;
  margin: 0 0 14px;
  padding: 8px 16px 8px 12px;
  border: 1px solid rgba(140, 85, 20, 0.30);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.55);
  color: var(--heading, #5c2d0a);
  font-family: inherit; font-size: 16px; font-weight: 600;
  cursor: pointer;
  transition: background .24s var(--ease-soft), border-color .24s var(--ease-soft),
              transform .24s var(--ease-spring), box-shadow .24s var(--ease-soft);
}
.voice-open:hover, .voice-open:focus-visible {
  background: linear-gradient(180deg, #f7dc93, #e0b348);
  border-color: rgba(140, 85, 20, 0.48);
  transform: translateY(-1px);
  box-shadow: 0 4px 14px rgba(120, 78, 18, 0.18);
}
.voice-ico {
  width: 24px; height: 24px; border-radius: 50%;
  display: grid; place-items: center; flex: 0 0 auto;
  background: linear-gradient(180deg, #f7dc93, #c8912c);
  color: #4a2708; font-size: 11px; line-height: 1;
  border: 1px solid rgba(140, 85, 20, 0.35);
}

.voice-backdrop {
  position: fixed; inset: 0; z-index: 120;
  display: grid; place-items: center;
  padding: 20px;
  background: rgba(58, 26, 4, 0.52);
  opacity: 0; pointer-events: none;
  transition: opacity .28s var(--ease-soft);
}
.voice-backdrop.open { opacity: 1; pointer-events: auto; }

.voice-dialog {
  width: min(440px, 94vw);
  background: linear-gradient(160deg, #fdf8e8 0%, #f9f0d4 60%, #f5e9c2 100%);
  border: 1px solid rgba(140, 85, 20, 0.30);
  border-radius: 20px;
  padding: 24px 24px 20px;
  box-shadow: 0 20px 60px rgba(58, 26, 4, 0.34);
  transform: translateY(14px) scale(0.985);
  transition: transform .3s var(--ease-spring);
}
.voice-backdrop.open .voice-dialog { transform: none; }

.voice-who { display: flex; align-items: center; gap: 13px; margin-bottom: 14px; }
.voice-av {
  width: 50px; height: 50px; border-radius: 16px; flex: 0 0 auto;
  display: grid; place-items: center;
  background: linear-gradient(145deg, #5c2d0a, #a9670f);
  color: #fff6d8; font-size: 23px; font-weight: 700;
}
.voice-nm { color: #5c2d0a; font-size: 19px; font-weight: 600; line-height: 1.2; }
.voice-rl { font-size: 14px; color: rgba(61, 40, 20, 0.75); }

.voice-quote {
  margin: 0 0 18px; font-style: italic; font-size: 17px; line-height: 1.6;
  color: #4a3018;
  padding-left: 14px; border-left: 2px solid rgba(200, 145, 44, 0.55);
}

.voice-row { display: flex; align-items: center; gap: 12px; }
.voice-btn, .voice-back {
  border-radius: 50%; flex: 0 0 auto;
  border: 1px solid rgba(140, 85, 20, 0.40);
  background: linear-gradient(180deg, #f7dc93, #e0b348 42%, #c8912c);
  color: #4a2708; display: grid; place-items: center; cursor: pointer;
}
.voice-btn { width: 48px; height: 48px; font-size: 16px; }
.voice-back { width: 34px; height: 34px; font-size: 11px; font-weight: 700; }
.voice-btn:hover, .voice-back:hover { filter: brightness(1.06); }

.voice-bar {
  position: relative; flex: 1; height: 7px; border-radius: 99px;
  background: rgba(140, 85, 20, 0.20); cursor: pointer;
}
.voice-fill {
  position: absolute; inset: 0 auto 0 0; width: 0; border-radius: 99px;
  background: linear-gradient(90deg, #c8912c, #e8bd5a);
}
.voice-time {
  font-family: 'Josefin Sans', system-ui, sans-serif;
  font-size: 13px; color: rgba(61, 40, 20, 0.78);
  min-width: 92px; text-align: right; font-variant-numeric: tabular-nums;
}
.voice-msg { margin: 14px 0 0; font-size: 15px; color: #8a3b12; min-height: 0; }
.voice-foot { display: flex; justify-content: flex-end; margin-top: 18px; }
.voice-close {
  border: 1px solid rgba(140, 85, 20, 0.30); background: rgba(255, 255, 255, 0.6);
  border-radius: 999px; padding: 7px 18px; font-family: inherit; font-size: 16px;
  color: #5c2d0a; cursor: pointer;
}
.voice-close:hover { background: linear-gradient(180deg, #f7dc93, #e0b348); }

@media (max-width: 560px) {
  .voice-time { min-width: 78px; font-size: 12px; }
  .voice-dialog { padding: 20px 18px 16px; }
}

@media (prefers-reduced-motion: reduce) {
  .voice-backdrop, .voice-dialog, .voice-open { transition: none !important; }
  .voice-dialog { transform: none !important; }
}


.voice-dialog {
  position: relative;
  overflow: hidden;
}
.voice-dialog::before {
  content: "";
  position: absolute;
  top: 0;
  inset-inline: 26px;
  height: 3px;
  background: linear-gradient(90deg, var(--heading), var(--gold), var(--teal));
  border-radius: 0 0 3px 3px;
  opacity: 0.9;
  pointer-events: none;
  z-index: 3;
}






#threshold .ember.e1, .farewell .ember.e1 { animation-delay: 0.55s !important; }
#threshold .ember.e2, .farewell .ember.e2 { animation-delay: 1.45s !important; }
#threshold .ember.e3, .farewell .ember.e3 { animation-delay: 2.30s !important; }

@media (prefers-reduced-motion: reduce) {
  #threshold .ember, .farewell .ember {
    animation: none !important;
    opacity: 0 !important;
  }
}


#threshold .diya-lamp,  .farewell .diya-lamp,
#threshold .diya-wick,  .farewell .diya-wick,
#threshold .d-rim,      .farewell .d-rim,
#threshold .d-oil,      .farewell .d-oil,
#threshold .d-beads circle, .farewell .d-beads circle,
#threshold .d-petals path,  .farewell .d-petals path,
#threshold .diya-glow,  .farewell .diya-glow,
#threshold .diya-halo,  .farewell .diya-halo {
  animation: none !important;
  opacity: 1 !important;
}

#threshold .ember, .farewell .ember {
  animation: none !important;
  opacity: 0 !important;
}


.mandala-trio {
  position: fixed;
  inset: 0;
  z-index: -3;
  pointer-events: none;
  overflow: hidden;
  contain: strict;
}

.mandala-trio .m-trio {
  position: absolute;
  opacity: 1;
}

.mandala-trio .m-trio--m { width: 132px; height: 132px; top: 14vh;  left: 6vw;  }
.mandala-trio .m-trio--n { width: 208px; height: 208px; top: 52vh;  right: 5vw; }
.mandala-trio .m-trio--o { width: 300px; height: 300px; top: 78vh;  left: 22vw; }


.mandala-trio .m-trio.mandala--turn {
  animation: mandalaTurn 96s linear infinite,
             mandalaTint 40s cubic-bezier(0.42, 0, 0.58, 1) infinite !important;
}
.mandala-trio .m-trio--o.mandala--turn { animation-duration: 150s, 52s !important; }
.mandala-trio .m-trio.mandala--drift {
  animation: mandalaDrift 120s linear infinite,
             mandalaTint 46s cubic-bezier(0.42, 0, 0.58, 1) infinite !important;
}

.mandala-trio .m-trio > svg {
  display: block;
  width: 100%;
  height: 100%;
  overflow: visible;
  filter: drop-shadow(0 0 7px rgba(226, 182, 74, 0.5));
}

@media (max-width: 720px) {
  .mandala-trio .m-trio--m { width: 92px;  height: 92px;  }
  .mandala-trio .m-trio--n { width: 140px; height: 140px; }
  .mandala-trio .m-trio--o { width: 200px; height: 200px; }
}

@media (prefers-reduced-motion: reduce) {
  .mandala-trio .m-trio,
  .mandala-trio .m-trio > svg { animation: none !important; }
}


.moderation-note,
#galleryViewerText {
  font-style: italic;
}


#foundation .foundation-highlights .fh-italic,
#foundation .foundation-highlights .fh-italic b,
#foundation .foundation-highlights .fh-italic small {
  font-style: italic;
}


#threshold .t-fr7-top, .farewell .t-fr7-top { display: none !important; }


#threshold .t-fr7-bot, .farewell .t-fr7-bot {
  background-image: url("data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///ywAAAAAAQABAAACAUwAOw==") !important;
}

#threshold .threshold-welcome::after, .farewell .farewell-welcome::after,
#threshold .t-title-orn, .farewell .t-title-orn {
  background-image: url("data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///ywAAAAAAQABAAACAUwAOw=="), url("data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///ywAAAAAAQABAAACAUwAOw==") !important;
}

#threshold .corner-tl, .farewell .corner-tl { background-image: url("data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///ywAAAAAAQABAAACAUwAOw==") !important; }
#threshold .corner-tr, .farewell .corner-tr { background-image: url("data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///ywAAAAAAQABAAACAUwAOw==") !important; }
#threshold .corner-bl, .farewell .corner-bl { background-image: url("data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///ywAAAAAAQABAAACAUwAOw==") !important; }
#threshold .corner-br, .farewell .corner-br { background-image: url("data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///ywAAAAAAQABAAACAUwAOw==") !important; }

#threshold .t-divider, .farewell .t-divider,
#threshold .threshold-welcome::after, .farewell .farewell-welcome::after {
  filter: saturate(1.18) brightness(1.02)
          drop-shadow(0 1px 1px rgba(122, 78, 18, 0.55))
          drop-shadow(0 0 1.4px rgba(140, 92, 24, 0.40)) !important;
}
#threshold .corner-tl, #threshold .corner-tr,
#threshold .corner-bl, #threshold .corner-br,
.farewell  .corner-tl, .farewell  .corner-tr,
.farewell  .corner-bl, .farewell  .corner-br {
  filter: saturate(1.12)
          drop-shadow(0 1px 1px rgba(122, 78, 18, 0.55))
          drop-shadow(0 0 1.4px rgba(140, 92, 24, 0.40)) !important;
}


#threshold .t-divider, .farewell .t-divider,
#threshold .threshold-welcome::after, .farewell .farewell-welcome::after {
  filter:
    saturate(1.34) contrast(1.10) brightness(1.02)
    drop-shadow(0 1px 0.6px rgba(112, 70, 14, 0.62)) !important;
}


#threshold .corner-tl, #threshold .corner-tr,
#threshold .corner-bl, #threshold .corner-br,
.farewell  .corner-tl, .farewell  .corner-tr,
.farewell  .corner-bl, .farewell  .corner-br {
  filter:
    saturate(1.22) contrast(1.06)
    drop-shadow(0 1px 1px rgba(112, 70, 14, 0.52)) !important;
}


#threshold .t-fr7-top, .farewell .t-fr7-top,
#threshold .t-fr7-bot, .farewell .t-fr7-bot {
  display: block !important;
  width: 33.30em !important;
  max-width: 96vw !important;
  font-size: min(clamp(30px, 2.9vw, 64px), 2.50vw) !important;
  line-height: 0 !important;
  padding: 0 !important;
  background-repeat: no-repeat, no-repeat, no-repeat, no-repeat !important;
  background-position: left center, right center, center center, center center !important;
  background-size: auto 100%, auto 100%, auto 100%, 100% 100% !important;
  aspect-ratio: auto !important;
}

#threshold .t-fr7-top, .farewell .t-fr7-top {
  height: clamp(20px, 2.10vw, 34px) !important;
  margin: 0 auto -3px !important;
  background-image:
    url('assets/na-capL.png'), url('assets/na-capR.png'),
    url('assets/na-mid.png'),  url('assets/na-line.png') !important;
}

#threshold .t-fr7-bot, .farewell .t-fr7-bot {
  height: clamp(34px, 3.60vw, 58px) !important;
  margin: -3px auto 0 !important;
  background-image:
    url('assets/nb-capL.png'), url('assets/nb-capR.png'),
    url('assets/nb-mid.png'),  url('assets/nb-line.png') !important;
}


#threshold .threshold-names, .farewell .farewell-names {
  margin: 0 auto !important;
  padding: 0 !important;
}


#threshold, .farewell {
  --orn-h-top: clamp(20px, 2.10vw, 34px);
  --orn-h-bot: clamp(34px, 3.60vw, 58px);
  --orn-gap: 8px;
}

#threshold .threshold-names, .farewell .farewell-names {
  font-family: 'Playfair Display', 'Cormorant Garamond', Georgia, serif !important;
}

#threshold .t-fr7-top, .farewell .t-fr7-top { height: var(--orn-h-top) !important; }
#threshold .t-fr7-bot, .farewell .t-fr7-bot { height: var(--orn-h-bot) !important; }


#threshold .threshold-names, .farewell .farewell-names {
  text-transform: uppercase !important;
}

#threshold .t-fr7-top, .farewell .t-fr7-top,
#threshold .t-fr7-bot, .farewell .t-fr7-bot {
  width: var(--names-w, 33.30em) !important;
  max-width: 96vw !important;
}


#threshold, .farewell { --orn-gap: 7px; }

#threshold .t-fr7-top, .farewell .t-fr7-top {
  margin: 0 auto var(--orn-gap) !important;
}
#threshold .t-fr7-bot, .farewell .t-fr7-bot {
  margin: var(--orn-gap) auto 0 !important;
}


#threshold .threshold-welcome::after, .farewell .farewell-welcome::after,
#threshold .t-title-orn, .farewell .t-title-orn {
  background-image: url('assets/orn-motif-gold.png'), url('assets/orn-line-gold.png') !important;
}

#threshold .threshold-welcome::after, .farewell .farewell-welcome::after {
  margin-top: -0.26em !important;
}


.temple-img-full {
  padding: 5px !important;
  background: linear-gradient(135deg, rgba(255,248,232,0.9), rgba(240,220,170,0.5)) !important;
  border: 2px solid rgba(212, 160, 58, 0.5) !important;
  border-radius: 12px !important;
  box-shadow: var(--soft) !important;
  cursor: zoom-in;
}

#moments .gallery-card {
  padding: 5px !important;
  background: linear-gradient(135deg, rgba(255,248,232,0.9), rgba(240,220,170,0.5)) !important;
  border: 2px solid rgba(212, 160, 58, 0.5) !important;
  border-radius: 12px !important;
  box-shadow: var(--soft) !important;
  overflow: hidden !important;
  transition: transform 0.3s ease, box-shadow 0.3s ease !important;
}
#moments .gallery-card img {
  border-radius: 8px !important;
  opacity: 1 !important;
  transition: none !important;
  cursor: zoom-in;
}
#moments .gallery-card:hover {
  transform: scale(1.06) !important;
  z-index: 3;
  box-shadow: var(--shadow) !important;
}
#moments .gallery-card:hover img {
  transform: none !important;
  opacity: 1 !important;
}

@media (prefers-reduced-motion: reduce) {
  #moments .gallery-card, #moments .gallery-card:hover {
    transition: none !important;
    transform: none !important;
  }
}


#threshold .corner-tl, .farewell .corner-tl { background-image: url('assets/corner-tl-red.png') !important; }
#threshold .corner-tr, .farewell .corner-tr { background-image: url('assets/corner-tr-red.png') !important; }
#threshold .corner-bl, .farewell .corner-bl { background-image: url('assets/corner-bl-red.png') !important; }
#threshold .corner-br, .farewell .corner-br { background-image: url('assets/corner-br-red.png') !important; }


#threshold .t-fr7-bot, .farewell .t-fr7-bot {
  margin-top: calc(var(--orn-gap) - 1pt) !important;
}


.lede.lede-italic {
  font-size: clamp(calc(23px + 1pt), calc(2.4vw + 1pt), calc(27px + 1pt)) !important;
}


.sec-rule {
  display: block;
  
  width: var(--sec-rule-w, clamp(144px, 21.1vw, 365px));
  max-width: 92vw;
  aspect-ratio: 2917 / 608;
  height: auto;
  margin: 1pt auto 0;
  background-image: url('assets/section-rule.png');
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
  pointer-events: none;
  line-height: 0;
  font-size: 0;
}

@media (max-width: 720px) {
  .sec-rule { width: var(--sec-rule-w, clamp(115px, 38vw, 230px)); }
}

@media print { .sec-rule { display: none; } }


#sacred .sacred-close {
  width: fit-content;
  max-width: 100%;
  margin-inline: auto;
}

#sacred .sec-rule--span {
  width: 100%;
  max-width: 100%;
  height: auto;
  aspect-ratio: 2917 / 608;
  margin: 1pt auto 0;
}


#timeline .story-hint {
  margin: 6px 0 0;
  font-family: var(--font-body);
  font-style: italic;
  font-size: clamp(15px, 1.35vw, 18px);
  line-height: 1.5;
  color: rgba(61, 40, 20, 0.78);
  text-align: center;
}
#timeline .story-hint strong {
  font-style: normal;
  font-weight: 600;
  color: var(--heading, #5c2d0a);
}


.site-footer {
  padding: clamp(18px, 3vw, 34px) clamp(16px, 5vw, 72px) clamp(26px, 4vw, 46px);
  text-align: center;
}

.site-footer .copyright {
  margin: 0;
  font-family: var(--font-body);
  font-size: clamp(14px, 1.15vw, 16px);
  letter-spacing: 0.04em;
  color: rgba(61, 40, 20, 0.70);
}

@media print {
  .site-footer .copyright { color: #3d2814; }
}


.tl-photo-caption[hidden] { display: none !important; }

.tl-photo-caption {
  margin: 12px auto 0;
  max-width: 60ch;
  text-align: center;
  font-family: var(--font-body);
  font-size: clamp(15px, 1.3vw, 18px);
  line-height: 1.55;
  color: #f3e6cc;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.55);
}
.tl-photo-caption strong {
  display: inline-block;
  font-weight: 600;
  color: #ffe9b8;
}


.approved-grid {
  grid-template-columns: repeat(auto-fit, minmax(clamp(280px, 30vw, 380px), 1fr));
  gap: 12px;
  align-items: start;
}

.approved-grid > article {
  padding: clamp(16px, 1.5vw, 22px) clamp(18px, 1.7vw, 26px);
}


.approved-grid > article > p:last-of-type {
  max-width: none;
}

@media (max-width: 980px) {
  .approved-grid { grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); }
}
@media (max-width: 620px) {
  .approved-grid { grid-template-columns: 1fr; gap: 10px; }
}


.tribute-window { position: relative; }

.tribute-window.is-scroll {
  max-height: min(68vh, 720px);
  overflow-y: auto;
  overscroll-behavior: contain;
  border: 1px solid rgba(140, 85, 20, 0.20);
  border-radius: 14px;
  padding: 12px;
  background: rgba(255, 255, 255, 0.24);
  scrollbar-width: thin;
  scrollbar-color: var(--gold) transparent;
}
.tribute-window.is-scroll::-webkit-scrollbar { width: 10px; }
.tribute-window.is-scroll::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, #e0b348, #c8912c);
  border-radius: 99px;
  border: 3px solid transparent;
  background-clip: content-box;
}
.tribute-window.is-scroll .tribute-fade {
  position: sticky;
  bottom: -12px;
  height: 34px;
  margin: -34px -12px -12px;
  pointer-events: none;
  background: linear-gradient(to top, rgba(245, 245, 220, 0.95), transparent);
}
.tribute-fade { display: none; }
.tribute-window.is-scroll .tribute-fade { display: block; }
.tribute-sentinel { height: 1px; }

.approved-grid > article {
  content-visibility: auto;
  contain-intrinsic-size: auto 260px;   
  contain: content;
}


.att-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin-top: 11px;
  padding-top: 10px;
  border-top: 1px dashed rgba(140, 85, 20, 0.20);
}
.att-thumb {
  width: 64px;
  height: 64px;
  border-radius: 9px;
  object-fit: cover;
  padding: 3px;
  background: linear-gradient(135deg, rgba(255,248,232,0.9), rgba(240,220,170,0.5));
  border: 2px solid rgba(212, 160, 58, 0.5);
  cursor: zoom-in;
}
.att-chip {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 5px 12px;
  border: 1px solid rgba(140, 85, 20, 0.20);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.62);
  font-family: inherit;
  font-size: 15px;
  color: var(--heading, #5c2d0a);
  text-decoration: none;
  cursor: pointer;
}
.att-chip:hover, .att-chip:focus-visible {
  background: linear-gradient(180deg, #f7dc93, #e0b348);
}
.att-ic {
  width: 19px; height: 19px;
  border-radius: 5px;
  display: grid; place-items: center;
  font: 600 10px/1 'Josefin Sans', system-ui, sans-serif;
  color: #4a2708;
  background: linear-gradient(180deg, #f7dc93, #c8912c);
}
.att-player {
  display: block;
  width: 100%;
  margin-top: 9px;
  border-radius: 8px;
}
video.att-player { max-height: 240px; background: #201509; }

@media (max-width: 620px) {
  .tribute-window.is-scroll { max-height: 72vh; padding: 10px; }
}
@media (prefers-reduced-motion: reduce) {
  .tribute-window.is-scroll { scroll-behavior: auto; }
}


.word-count {
  display: block;
  margin-top: 6px;
  text-align: right;
  font-family: 'Josefin Sans', system-ui, sans-serif;
  font-size: 13px;
  letter-spacing: 0.06em;
  font-variant-numeric: tabular-nums;
  color: rgba(61, 40, 20, 0.62);
  transition: color .2s var(--ease-soft);
}
.word-count.is-near { color: #a9670f; }
.word-count.is-over { color: #a01912; font-weight: 600; }

@media (prefers-reduced-motion: reduce) { .word-count { transition: none; } }


.tribute-tools {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  margin: 0 0 12px;
}

.view-toggle {
  display: inline-flex;
  border: 1px solid rgba(140, 85, 20, 0.24);
  border-radius: 999px;
  overflow: hidden;
  background: rgba(255, 255, 255, 0.5);
}
.view-btn {
  border: 0;
  background: none;
  padding: 7px 16px;
  font-family: inherit;
  font-size: 15px;
  color: var(--heading, #5c2d0a);
  cursor: pointer;
}
.view-btn.active { background: linear-gradient(180deg, #f7dc93, #e0b348); font-weight: 600; }

.cal-btn, .date-clear {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  border: 1px solid rgba(140, 85, 20, 0.24);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.5);
  padding: 7px 15px;
  font-family: inherit;
  font-size: 15px;
  color: var(--heading, #5c2d0a);
  cursor: pointer;
}
.cal-btn:hover, .date-clear:hover { background: linear-gradient(180deg, #f7dc93, #e0b348); }
.date-clear { background: linear-gradient(180deg, #f7dc93, #e0b348); font-weight: 600; }
.cal-btn[hidden], .date-clear[hidden], .tribute-calendar[hidden] { display: none !important; }


.approved-grid.is-list {
  grid-template-columns: 1fr;
  gap: 14px;
}
.approved-grid.is-list > article { padding: clamp(18px, 1.8vw, 26px) clamp(20px, 2vw, 30px); }
.approved-grid.is-list > article > p:last-of-type { max-width: none; }


.tribute-calendar {
  margin: 0 0 12px;
  padding: 12px 14px;
  border: 1px solid rgba(140, 85, 20, 0.22);
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.42);
  max-width: 330px;
}
.cal-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 8px;
}
.cal-month {
  font-family: 'Josefin Sans', system-ui, sans-serif;
  font-size: 14px;
  letter-spacing: 0.08em;
  color: var(--heading, #5c2d0a);
}
.cal-nav {
  border: 1px solid rgba(140, 85, 20, 0.24);
  background: rgba(255, 255, 255, 0.6);
  border-radius: 50%;
  width: 26px; height: 26px;
  font-size: 12px; line-height: 1;
  color: var(--heading, #5c2d0a);
  cursor: pointer;
}
.cal-nav[disabled] { opacity: 0.32; cursor: default; }

.cal-grid {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 3px;
}
.cal-dow {
  text-align: center;
  font: 400 11px/1.8 'Josefin Sans', system-ui, sans-serif;
  color: rgba(92, 45, 10, 0.55);
}
.cal-day {
  position: relative;
  display: grid;
  place-items: center;
  aspect-ratio: 1;
  border: 0;
  border-radius: 8px;
  background: none;
  font-family: inherit;
  font-size: 14px;
  color: rgba(61, 40, 20, 0.42);
}
.cal-day.has {
  color: var(--heading, #5c2d0a);
  background: rgba(224, 179, 72, 0.20);
  cursor: pointer;
  font-weight: 600;
}
.cal-day.has:hover { background: rgba(224, 179, 72, 0.42); }
.cal-day.has.is-on { background: linear-gradient(180deg, #f7dc93, #c8912c); color: #4a2708; }
.cal-day i {
  position: absolute;
  top: 1px; right: 3px;
  font: 600 9px/1 'Josefin Sans', system-ui, sans-serif;
  font-style: normal;
  color: rgba(92, 45, 10, 0.75);
}
.cal-day.has.is-on i { color: #4a2708; }

@media (max-width: 620px) {
  .tribute-calendar { max-width: 100%; }
}


.admin-tools { margin-top: 4px; }

.aview-btn {
  border: 0;
  background: none;
  padding: 7px 16px;
  font-family: inherit;
  font-size: 15px;
  color: var(--heading, #5c2d0a);
  cursor: pointer;
}
.aview-btn.active { background: linear-gradient(180deg, #f7dc93, #e0b348); font-weight: 600; }


.admin-tributes > article {
  content-visibility: auto;
  contain-intrinsic-size: auto 300px;
  contain: content;
}




.admin-tributes.is-list { grid-template-columns: 1fr; gap: 12px; }
.admin-tributes.is-list > article > p { max-width: none; }


#adminWindow.is-scroll .admin-tributes { max-width: none; }


.admin-tribute .actions .admin-publish {
  font-weight: 700;
  border-color: rgba(140, 85, 20, 0.42);
}
.admin-tribute .actions button[data-action="show"] {
  background: linear-gradient(180deg, #f7dc93, #e0b348);
  color: #4a2708;
}
.admin-tribute .actions button[data-action="show"]:hover { background: var(--teal); color: #fff; }


.admin-tribute:has(.admin-vis.is-hidden) {
  box-shadow: inset 3px 0 0 var(--rose, #b5476b);
}

@media (max-width: 900px) {
  .admin-tributes.is-list { grid-template-columns: 1fr; }
}


.admin-stats {
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  max-width: 1080px;
}

.admin-stats .stat-live {
  border-color: rgba(200, 145, 44, 0.55);
  background:
    linear-gradient(180deg, rgba(255, 248, 232, 0.92), rgba(247, 233, 176, 0.55));
}
.admin-stats .stat-live strong { color: #7a4a08; }


.admin-stats .stat-parent strong { opacity: 0.86; }

.admin-stats-note {
  max-width: 1080px;
  margin: -10px auto 18px;
  text-align: center;
  font-size: 14px;
  font-style: italic;
  opacity: 0.78;
}
.admin-stats-note strong { font-style: normal; }


.filter-btn.is-live.ghost {
  border-color: rgba(200, 145, 44, 0.55);
  color: #7a4a08;
  font-weight: 600;
}

@media (max-width: 620px) {
  .admin-stats { grid-template-columns: repeat(2, 1fr); }
  .admin-stats-note { margin-top: -4px; }
}


.upload-tile { position: relative; }

.upload-clear {
  position: absolute;
  top: 6px;
  right: 6px;
  width: 24px;
  height: 24px;
  display: grid;
  place-items: center;
  padding: 0;
  border: 1px solid rgba(140, 85, 20, 0.30);
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.92);
  color: #7a2e2e;
  font: 700 12px/1 'Josefin Sans', system-ui, sans-serif;
  cursor: pointer;
  opacity: 0.75;
  transition: opacity 0.2s var(--ease), background 0.2s var(--ease), transform 0.2s var(--ease);
}
.upload-clear:hover,
.upload-clear:focus-visible {
  opacity: 1;
  background: #b5476b;
  color: #fff;
  transform: scale(1.08);
}
.upload-clear[hidden] { display: none !important; }


.upload-tile.selected em {
  max-width: calc(100% - 30px);
  overflow-wrap: anywhere;
}

@media (prefers-reduced-motion: reduce) {
  .upload-clear { transition: none; }
  .upload-clear:hover, .upload-clear:focus-visible { transform: none; }
}


.preview-state blockquote {
  max-height: 260px;
  overflow-y: auto;
  overscroll-behavior: contain;
  white-space: pre-wrap;        
  overflow-wrap: anywhere;      
  font-style: normal;           
  scrollbar-width: thin;
  scrollbar-color: var(--gold) transparent;
}
.preview-state blockquote.is-empty {
  font-style: italic;
  color: var(--muted);
}
.preview-state blockquote::-webkit-scrollbar { width: 8px; }
.preview-state blockquote::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, #e0b348, #c8912c);
  border-radius: 99px;
  border: 2px solid transparent;
  background-clip: content-box;
}

.preview-files span.is-on {
  border-color: rgba(200, 145, 44, 0.55);
  background: linear-gradient(180deg, rgba(255, 248, 232, 0.95), rgba(247, 233, 176, 0.6));
  color: #6b3d05;
}

@media (max-width: 620px) {
  .preview-state blockquote { max-height: 220px; }
}


.unserved-note {
  margin: 0 0 18px;
  padding: 12px 16px;
  border: 1px solid rgba(200, 145, 44, 0.55);
  border-left: 4px solid #c8912c;
  border-radius: 12px;
  background: linear-gradient(180deg, rgba(255, 248, 232, 0.95), rgba(247, 233, 176, 0.5));
  color: #6b3d05;
  font-size: 16px;
  line-height: 1.5;
}


.gv-img {
  cursor: zoom-in;
}
.gv-img:focus-visible {
  outline: 3px solid var(--gold, #c8912c);
  outline-offset: 4px;
  border-radius: 6px;
}


.cal-empty {
  margin: 10px 2px 0;
  text-align: center;
  font-size: 14px;
  font-style: italic;
  color: var(--muted);
}




@media (min-width: 1500px) {
  .section-inner,
  .section-inner.subsection-style { max-width: 1360px; }
}


@media (min-width: 1900px) {
  .section-inner,
  .section-inner.subsection-style { max-width: 1560px; }

  body { font-size: 19px; }
  .lede, .eyebrow { font-size: 1.06em; }
  .nav-links a, .nav-links .nav-exit-btn { font-size: 19px; }
  .btn { font-size: 18px; }

  .approved-grid > article > p,
  .admin-tributes > article > p,
  .preview-state blockquote { font-size: 18px; }

  
  .section-heading .lede { max-width: 78ch; margin-left: auto; margin-right: auto; }
}

@media (min-width: 2560px) {
  .section-inner,
  .section-inner.subsection-style { max-width: 1840px; }
  body { font-size: 22px; }
  .nav-links a, .nav-links .nav-exit-btn { font-size: 22px; }
  .btn { font-size: 21px; }
  .approved-grid > article > p,
  .admin-tributes > article > p,
  .preview-state blockquote { font-size: 21px; }
  .tribute-window.is-scroll { max-height: min(68vh, 1100px); }
}


@media (pointer: coarse) {
  .upload-clear {
    width: 38px; height: 38px;
    top: 8px; right: 8px;
    font-size: 15px;
    opacity: 1;                      
  }
  .upload-tile.selected em { max-width: calc(100% - 46px); }

  .view-btn, .aview-btn, .cal-btn, .date-clear { padding: 12px 18px; font-size: 16px; }
  .att-chip { padding: 10px 16px; font-size: 16px; }
  .att-thumb { width: 76px; height: 76px; }

  .cal-day { min-height: 42px; font-size: 16px; }
  .cal-nav { width: 38px; height: 38px; font-size: 15px; }
  .tribute-calendar { padding: 14px; }

  .filter-btn, .filter-chip { min-height: 44px; }
  .admin-tribute .actions button { min-height: 42px; padding-left: 16px; padding-right: 16px; }

  
  .tl-photo-nav, .gv-nav { width: 48px; height: 48px; font-size: 20px; }
}


@media (hover: none) {
  .upload-tile:hover,
  .approved-grid article:hover,
  .admin-tribute:hover,
  .att-chip:hover,
  .upload-clear:hover { transform: none; }
}


@media (max-width: 620px) {
  
  .preview-files { grid-template-columns: 1fr 1fr; }

  
  .tribute-tools { gap: 8px; }
  .view-toggle { flex: 1 1 100%; }
  .view-btn, .aview-btn { flex: 1 1 50%; text-align: center; }
  .cal-btn, .date-clear { flex: 1 1 auto; justify-content: center; }

  
  .tribute-calendar { max-width: 100%; }

  .admin-stats-note { font-size: 13px; }
  .admin-tribute .actions { gap: 6px; }
  .admin-tribute .actions button { flex: 1 1 auto; }
}


@media (max-height: 520px) and (orientation: landscape) {
  .tribute-window.is-scroll { max-height: 62vh; }
  .preview-state blockquote { max-height: 40vh; }
}


:root {
  
  --tribute-card-h: clamp(360px, 44vh, 480px);
  --tribute-card-h-list: clamp(380px, 52vh, 560px);
}

.approved-grid > article:not(.tribute-placeholder-card),
.admin-tributes > article {
  display: flex;
  flex-direction: column;
  height: var(--tribute-card-h);
  contain-intrinsic-size: auto var(--tribute-card-h);   
}


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


.approved-grid > article:not(.tribute-placeholder-card) > h4,
.admin-tributes > article > h4 { margin-bottom: 4px; }
.approved-grid > article:not(.tribute-placeholder-card) > p:not(:last-of-type),
.admin-tributes > article > p:not(:last-of-type) { margin: 2px 0; }


.approved-grid > article:not(.tribute-placeholder-card) > p:last-of-type,
.admin-tributes > article > p:last-of-type {
  flex: 1 1 auto;
  min-height: 0;                 
  overflow-y: auto;
  overscroll-behavior: contain;
  max-width: none;               
  margin-bottom: 4px;
  padding-right: 6px;            
  scrollbar-width: thin;
  scrollbar-color: var(--gold, #c8912c) transparent;
}


.approved-grid > article > p:last-of-type::-webkit-scrollbar,
.admin-tributes > article > p:last-of-type::-webkit-scrollbar { width: 8px; }
.approved-grid > article > p:last-of-type::-webkit-scrollbar-thumb,
.admin-tributes > article > p:last-of-type::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, #e0b348, #c8912c);
  border-radius: 99px;
  border: 2px solid transparent;
  background-clip: content-box;
}
.approved-grid > article > p:last-of-type::-webkit-scrollbar-track,
.admin-tributes > article > p:last-of-type::-webkit-scrollbar-track { background: transparent; }


.approved-grid > article > small,
.admin-tributes > article > small { flex: 0 0 auto; margin-top: auto; }
.approved-grid > article > .att-row,
.admin-tributes > article > .att-row,
.admin-tributes > article > .actions { flex: 0 0 auto; }


.approved-grid.is-list > article:not(.tribute-placeholder-card),
.admin-tributes.is-list > article { height: var(--tribute-card-h-list); }
.approved-grid.is-list > article > p:last-of-type { max-width: none; }


.tribute-placeholder-card { height: auto; }


@media (max-width: 620px) {
  :root {
    --tribute-card-h: clamp(240px, 44vh, 320px);
    --tribute-card-h-list: clamp(260px, 52vh, 380px);
  }
}


@media (max-height: 520px) and (orientation: landscape) {
  :root {
    --tribute-card-h: 66vh;
    --tribute-card-h-list: 72vh;
  }
}


@media (min-width: 621px) and (max-width: 1024px) {
  :root { --tribute-card-h: clamp(280px, 38vh, 380px); }
}


@media (min-width: 1900px) {
  :root {
    --tribute-card-h: clamp(360px, 32vh, 520px);
    --tribute-card-h-list: clamp(420px, 44vh, 640px);
  }
}
@media (min-width: 2560px) {
  :root {
    --tribute-card-h: clamp(440px, 30vh, 620px);
    --tribute-card-h-list: clamp(520px, 42vh, 760px);
  }
}


.tl-photo-cluster--grace {
  width: 240px;
  flex: 0 0 240px;
  min-height: 290px;
}


.nav-plaque {
  --nav-h: 78px;                       
  --cap: calc(var(--nav-h) * 0.9036);  
  --gap: 30px;                         

  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 10px;
  margin: 0 auto;
  width: fit-content;
  max-width: 100%;
  min-height: var(--nav-h);
  padding: 6px calc(var(--cap) + var(--gap));
  box-sizing: border-box;
}


.nav-plaque::before {
  content: '';
  position: absolute;
  top: 0;
  bottom: 0;
  left: var(--cap);
  right: var(--cap);
  pointer-events: none;
  z-index: 0;
  background-image:
    url('assets/nav-plaque-mid.png'),
    radial-gradient(circle, rgba(255,240,200,.95), transparent 60%),
    radial-gradient(circle, rgba(255,235,190,.85), transparent 60%),
    radial-gradient(circle, rgba(255,245,210,.9),  transparent 60%),
    radial-gradient(circle, rgba(255,235,190,.8),  transparent 60%);
  background-repeat: repeat-x, no-repeat, no-repeat, no-repeat, no-repeat;
  background-position: center center, 18% 32%, 42% 68%, 66% 30%, 88% 62%;
  background-size: auto 100%, 3px 3px, 3px 3px, 3px 3px, 3px 3px;
  animation: navSparkle 6.5s ease-in-out infinite;
}


.nav-plaque::after {
  content: '';
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 1;
  background-image: url('assets/nav-plaque-left.png'), url('assets/nav-plaque-right.png');
  background-repeat: no-repeat, no-repeat;
  background-position: left center, right center;
  background-size: var(--cap) 100%, var(--cap) 100%;
}


@keyframes navSparkle {
  0%, 100% { background-size: auto 100%, 0 0, 3px 3px, 0 0, 2px 2px; }
  30%      { background-size: auto 100%, 3px 3px, 0 0, 2px 2px, 0 0; }
  55%      { background-size: auto 100%, 2px 2px, 2px 2px, 3px 3px, 3px 3px; }
  80%      { background-size: auto 100%, 0 0, 3px 3px, 0 0, 3px 3px; }
}


.nav-plaque > * { position: relative; z-index: 2; }


.nav-plaque .brand strong { color: #f3d99a; text-shadow: 0 0 8px rgba(255,205,105,.45); }
.nav-plaque .brand em     { color: #d8b878; }

.nav-plaque .nav-links a,
.nav-plaque .nav-links .nav-exit-btn {
  color: #f6dfa0;
  text-shadow: 0 0 5px rgba(255,206,110,.40), 0 0 12px rgba(255,176,60,.20);
  animation: navGlow 4.2s ease-in-out infinite;
}

.nav-plaque .nav-links a:nth-child(2n) { animation-delay: -1.4s; }
.nav-plaque .nav-links a:nth-child(3n) { animation-delay: -2.6s; }
.nav-plaque .nav-links a:nth-child(5n) { animation-delay: -3.5s; }

@keyframes navGlow {
  0%, 100% { text-shadow: 0 0 5px rgba(255,206,110,.40), 0 0 12px rgba(255,176,60,.20); }
  50%      { text-shadow: 0 0 10px rgba(255,222,140,.85), 0 0 22px rgba(255,180,60,.42); }
}

.nav-plaque .nav-links a:hover,
.nav-plaque .nav-links a.active {
  color: #fff3cf;
  background: rgba(255, 214, 120, 0.14);
  text-shadow: 0 0 8px rgba(255,214,120,.9), 0 0 20px rgba(255,170,50,.5);
}
.nav-plaque .nav-links a::after { background: #e0b348; }


@media (max-width: 1400px) { .nav-plaque { --nav-h: 72px; --gap: 24px; } }
@media (max-width: 1180px) { .nav-plaque { --nav-h: 66px; --gap: 18px; } }


@media (max-width: 980px) {
  .nav-plaque { display: contents; }
}


@media (min-width: 1900px) { .nav-plaque { --nav-h: 92px; --gap: 40px; } }

@media (prefers-reduced-motion: reduce) {
  .nav-plaque .nav-links a,
  .nav-plaque .nav-links .nav-exit-btn { animation: none; }
  .nav-plaque::before { animation: none; }
}
@media print { .nav-plaque::before, .nav-plaque::after { display: none; } }


.nav-plaque .nav-links {
  background: none !important;
  background-image: none !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
  backdrop-filter: none !important;
}

.nav-plaque .nav-links a,
.nav-plaque .nav-links .nav-exit-btn {
  background: none !important;
  background-image: none !important;
  border: 0 !important;
  box-shadow: none !important;
  color: #f6dfa0 !important;
  text-shadow: 0 0 5px rgba(255, 206, 110, .40), 0 0 12px rgba(255, 176, 60, .20) !important;
}

.nav-plaque .nav-links a:hover,
.nav-plaque .nav-links a.active,
.nav-plaque .nav-links .nav-exit-btn:hover {
  color: #fff3cf !important;
  background: rgba(255, 214, 120, 0.14) !important;
  text-shadow: 0 0 8px rgba(255, 214, 120, .9), 0 0 20px rgba(255, 170, 50, .5) !important;
}

.nav-plaque .brand strong {
  color: #f7e3ae !important;
  text-shadow: 0 0 9px rgba(255, 205, 105, .55) !important;
}
.nav-plaque .brand em {
  color: #dcbc80 !important;
  text-shadow: none !important;
}


.nav-plaque .nav-links a::after { background: #e6c169 !important; }


.nav-plaque { overflow: visible !important; }


.nav-plaque .nav-links {
  background: none !important;
  background-image: none !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
  gap: 4px;
}

.nav-plaque .nav-links a,
.nav-plaque .nav-links .nav-exit-btn {
  background: none !important;
  background-image: none !important;
  border: 0 !important;
  box-shadow: none !important;
  color: #f6dfa0 !important;
  text-shadow: 0 0 5px rgba(255, 206, 110, .40), 0 0 12px rgba(255, 176, 60, .20) !important;
}

.nav-plaque .nav-links a:hover,
.nav-plaque .nav-links a.active,
.nav-plaque .nav-links .nav-exit-btn:hover {
  color: #fff3cf !important;
  background: rgba(255, 214, 120, 0.14) !important;
  text-shadow: 0 0 8px rgba(255, 214, 120, .9), 0 0 20px rgba(255, 170, 50, .5) !important;
}

.nav-plaque .brand strong {
  color: #f3d99a !important;
  text-shadow: 0 0 8px rgba(255, 205, 105, .45) !important;
}
.nav-plaque .brand em {
  color: #d9ba7c !important;
  text-shadow: none !important;
}


.nav-plaque .nav-links a::after { background: #e0b348 !important; }


.nav-plaque { overflow: visible; }
.nav-plaque .nav-links { flex-wrap: wrap; justify-content: center; }


.nav-plaque::before {
  background-image:
    url('assets/nav-plaque-mid.png'),
    linear-gradient(100deg, transparent 38%, rgba(255,226,150,.16) 47%,
                    rgba(255,240,190,.30) 50%, rgba(255,226,150,.16) 53%, transparent 62%),
    radial-gradient(circle, rgba(255,244,210,.95), transparent 62%),
    radial-gradient(circle, rgba(255,236,190,.9),  transparent 62%),
    radial-gradient(circle, rgba(255,248,220,.95), transparent 62%),
    radial-gradient(circle, rgba(255,232,180,.85), transparent 62%),
    radial-gradient(circle, rgba(255,246,215,.9),  transparent 62%),
    radial-gradient(circle, rgba(255,234,186,.85), transparent 62%),
    radial-gradient(circle, rgba(255,250,225,.95), transparent 62%),
    radial-gradient(circle, rgba(255,238,196,.9),  transparent 62%);
  background-repeat: repeat-x, no-repeat, no-repeat, no-repeat, no-repeat,
                     no-repeat, no-repeat, no-repeat, no-repeat, no-repeat;
  animation: navShine 11s linear infinite;
}

@keyframes navShine {
  0% {
    background-position: center center, -60% 0,
      14% 30%, 27% 66%, 39% 26%, 52% 70%, 63% 34%, 74% 64%, 85% 28%, 93% 60%;
    background-size: auto 100%, 220% 100%,
      3px 3px, 0 0, 2px 2px, 0 0, 3px 3px, 0 0, 2px 2px, 0 0;
  }
  25% {
    background-position: center center, -10% 0,
      15% 32%, 27% 66%, 40% 24%, 52% 70%, 62% 36%, 74% 64%, 86% 26%, 93% 60%;
    background-size: auto 100%, 220% 100%,
      0 0, 3px 3px, 0 0, 2px 2px, 0 0, 3px 3px, 0 0, 2px 2px;
  }
  50% {
    background-position: center center, 40% 0,
      14% 30%, 28% 64%, 39% 26%, 53% 68%, 63% 34%, 75% 62%, 85% 28%, 94% 58%;
    background-size: auto 100%, 220% 100%,
      2px 2px, 2px 2px, 3px 3px, 0 0, 2px 2px, 2px 2px, 3px 3px, 0 0;
  }
  75% {
    background-position: center center, 95% 0,
      15% 32%, 27% 66%, 40% 24%, 52% 70%, 62% 36%, 74% 64%, 86% 26%, 93% 60%;
    background-size: auto 100%, 220% 100%,
      0 0, 2px 2px, 0 0, 3px 3px, 0 0, 2px 2px, 0 0, 3px 3px;
  }
  100% {
    background-position: center center, 160% 0,
      14% 30%, 27% 66%, 39% 26%, 52% 70%, 63% 34%, 74% 64%, 85% 28%, 93% 60%;
    background-size: auto 100%, 220% 100%,
      3px 3px, 0 0, 2px 2px, 0 0, 3px 3px, 0 0, 2px 2px, 0 0;
  }
}


.nav-plaque::after { animation: navEnds 13s ease-in-out infinite; }
@keyframes navEnds {
  0%, 100% { filter: brightness(1)    drop-shadow(0 0 0 rgba(255,205,110,0)); }
  50%      { filter: brightness(1.16) drop-shadow(0 0 6px rgba(255,205,110,.45)); }
}


.nav-plaque .nav-links a,
.nav-plaque .nav-links .nav-exit-btn {
  transition: color .25s ease, text-shadow .25s ease, transform .25s ease;
}
.nav-plaque .nav-links a:hover,
.nav-plaque .nav-links .nav-exit-btn:hover { transform: translateY(-1px); }


.nav-plaque .nav-links a.active::after {
  box-shadow: 0 0 8px rgba(255, 205, 105, .85);
  animation: navRule 4.2s ease-in-out infinite;
}
@keyframes navRule {
  0%, 100% { box-shadow: 0 0 4px rgba(255,205,105,.45); }
  50%      { box-shadow: 0 0 11px rgba(255,222,140,.95); }
}

@media (prefers-reduced-motion: reduce) {
  .nav-plaque::before,
  .nav-plaque::after,
  .nav-plaque .nav-links a.active::after { animation: none; }
}


@media (max-width: 980px) {
  .nav-plaque {
    display: flex;
    --nav-h: 64px;
    --gap: 16px;
  }

  
  .nav-plaque .nav-links {
    position: fixed;
    top: var(--topbar-h, 76px);
    left: 14px;
    right: 14px;
    width: auto;
    background: rgba(255, 250, 240, 0.98) !important;
    border: 1px solid var(--line) !important;
    border-radius: 18px;
    box-shadow: var(--shadow);
    padding: 14px !important;
    z-index: 70;
  }

  
  .nav-plaque .nav-links a,
  .nav-plaque .nav-links .nav-exit-btn {
    color: #2a1806 !important;
    text-shadow: none !important;
    animation: none !important;
  }
  .nav-plaque .nav-links a:hover,
  .nav-plaque .nav-links a.active,
  .nav-plaque .nav-links .nav-exit-btn:hover {
    color: #1f1104 !important;
    background: rgba(190, 140, 40, 0.22) !important;
    text-shadow: none !important;
  }
}

@media (max-width: 620px) {
  .nav-plaque { --nav-h: 56px; --gap: 10px; }
  .nav-plaque .brand strong { font-size: 20px; }
  .nav-plaque .brand em { font-size: 11px; letter-spacing: .12em; }
}


.btn, .filter-chip, .view-btn, .aview-btn, .cal-btn, .date-clear,
.threshold-btn, .nav-exit-btn, .att-chip, .admin-tribute .actions button,
.button-row, .filter-bar, .filter-chips, .view-toggle, .gallery-filters,
.tribute-tools, .gv-actions, .farewell-actions {
  position: relative;
  isolation: isolate;
}

.btn::before, .filter-chip::before, .view-btn::before, .aview-btn::before,
.cal-btn::before, .date-clear::before, .threshold-btn::before,
.nav-exit-btn::before, .att-chip::before, .admin-tribute .actions button::before,
.button-row::before, .filter-bar::before, .filter-chips::before,
.view-toggle::before, .gallery-filters::before, .tribute-tools::before,
.gv-actions::before, .farewell-actions::before {
  content: '';
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  border-radius: inherit;
  background-image:
    radial-gradient(circle, rgba(255,236,175,.85), rgba(255,214,120,.30) 45%, transparent 70%),
    radial-gradient(circle, rgba(255,244,200,.75), rgba(255,206,105,.26) 45%, transparent 70%),
    radial-gradient(circle, rgba(255,230,160,.80), rgba(250,200,95,.28)  45%, transparent 70%),
    radial-gradient(circle, rgba(255,248,215,.70), rgba(255,220,130,.24) 45%, transparent 70%),
    radial-gradient(circle, rgba(255,238,185,.78), rgba(252,205,100,.26) 45%, transparent 70%),
    radial-gradient(circle, rgba(255,250,225,.72), rgba(255,216,120,.22) 45%, transparent 70%);
  background-repeat: no-repeat;
  background-size: 14px 14px, 9px 9px, 18px 18px, 7px 7px, 12px 12px, 10px 10px;
  background-position: 8% 110%, 26% 118%, 47% 112%, 63% 122%, 79% 108%, 93% 116%;
  animation: goldBubbles 14s linear infinite;
  opacity: .9;
}


@keyframes goldBubbles {
  0% {
    background-position: 8% 110%, 26% 118%, 47% 112%, 63% 122%, 79% 108%, 93% 116%;
    background-size: 14px 14px, 9px 9px, 18px 18px, 7px 7px, 12px 12px, 10px 10px;
  }
  25% {
    background-position: 10% 62%, 24% 88%, 45% 40%, 65% 96%, 77% 70%, 95% 84%;
    background-size: 13px 13px, 10px 10px, 16px 16px, 8px 8px, 11px 11px, 11px 11px;
  }
  50% {
    background-position: 7% 18%, 28% 46%, 49% -12%, 61% 52%, 81% 24%, 91% 44%;
    background-size: 11px 11px, 9px 9px, 13px 13px, 7px 7px, 9px 9px, 9px 9px;
  }
  75% {
    background-position: 9% -14%, 25% 6%, 46% -40%, 64% 12%, 78% -16%, 94% 4%;
    background-size: 8px 8px, 6px 6px, 9px 9px, 5px 5px, 7px 7px, 6px 6px;
  }
  100% {
    background-position: 8% -40%, 26% -34%, 47% -60%, 63% -28%, 79% -44%, 93% -36%;
    background-size: 5px 5px, 4px 4px, 6px 6px, 3px 3px, 4px 4px, 4px 4px;
  }
}


.button-row::before, .filter-bar::before, .filter-chips::before,
.view-toggle::before, .gallery-filters::before, .tribute-tools::before,
.gv-actions::before, .farewell-actions::before {
  animation-duration: 22s;
  opacity: .55;
}


.filter-chip:nth-child(2n)::before, .view-btn:nth-child(2n)::before,
.aview-btn:nth-child(2n)::before, .btn:nth-child(2n)::before { animation-delay: -4.5s; }
.filter-chip:nth-child(3n)::before, .btn:nth-child(3n)::before { animation-delay: -9s; }
.admin-tribute .actions button:nth-child(2n)::before { animation-delay: -6s; }
.admin-tribute .actions button:nth-child(3n)::before { animation-delay: -11s; }

@media (prefers-reduced-motion: reduce) {
  .btn::before, .filter-chip::before, .view-btn::before, .aview-btn::before,
  .cal-btn::before, .date-clear::before, .threshold-btn::before,
  .nav-exit-btn::before, .att-chip::before, .admin-tribute .actions button::before,
  .button-row::before, .filter-bar::before, .filter-chips::before,
  .view-toggle::before, .gallery-filters::before, .tribute-tools::before,
  .gv-actions::before, .farewell-actions::before { animation: none; opacity: .35; }
}
@media print {
  .btn::before, .filter-chip::before, .threshold-btn::before,
  .button-row::before, .filter-bar::before { display: none; }
}


.btn, .filter-chip, .view-btn, .aview-btn, .cal-btn, .date-clear,
.threshold-btn, .att-chip, .admin-tribute .actions button {
  --bh: 46px;                            
  --bcap: calc(var(--bh) * 0.9036);      
  --bgap: 6px;

  position: relative;
  isolation: isolate;
  min-height: var(--bh);
  padding-left: calc(var(--bcap) + var(--bgap)) !important;
  padding-right: calc(var(--bcap) + var(--bgap)) !important;
  background-image: none !important;
  background-color: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  color: #f6dfa0 !important;
  text-shadow: 0 0 5px rgba(255,206,110,.40), 0 0 12px rgba(255,176,60,.20) !important;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}


.btn::before, .filter-chip::before, .view-btn::before, .aview-btn::before,
.cal-btn::before, .date-clear::before, .threshold-btn::before,
.att-chip::before, .admin-tribute .actions button::before {
  content: '';
  position: absolute;
  top: 0; bottom: 0;
  left: var(--bcap); right: var(--bcap);
  z-index: -1;
  pointer-events: none;
  border-radius: 0;
  background-image:
    url('assets/nav-plaque-mid.png'),
    radial-gradient(circle, rgba(255,236,175,.85), rgba(255,214,120,.28) 45%, transparent 70%),
    radial-gradient(circle, rgba(255,246,205,.78), rgba(255,206,105,.24) 45%, transparent 70%),
    radial-gradient(circle, rgba(255,230,160,.80), rgba(250,200,95,.26)  45%, transparent 70%),
    radial-gradient(circle, rgba(255,250,222,.72), rgba(255,220,130,.22) 45%, transparent 70%);
  background-repeat: repeat-x, no-repeat, no-repeat, no-repeat, no-repeat;
  background-size: auto 100%, 9px 9px, 6px 6px, 11px 11px, 5px 5px;
  background-position: center center, 16% 120%, 40% 128%, 66% 116%, 88% 124%;
  animation: btnBubbles 9s linear infinite;
}


.btn::after, .filter-chip::after, .view-btn::after, .aview-btn::after,
.cal-btn::after, .date-clear::after, .threshold-btn::after,
.att-chip::after, .admin-tribute .actions button::after {
  content: '' !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: -1;
  pointer-events: none;
  width: auto !important;
  height: auto !important;
  background: url('assets/nav-plaque-left.png') left center / var(--bcap) 100% no-repeat,
              url('assets/nav-plaque-right.png') right center / var(--bcap) 100% no-repeat !important;
  animation: btnEnds 13s ease-in-out infinite;
  transform: none !important;
  opacity: 1 !important;
}

@keyframes btnBubbles {
  0%   { background-position: center center, 16% 120%, 40% 128%, 66% 116%, 88% 124%;
         background-size: auto 100%, 9px 9px, 6px 6px, 11px 11px, 5px 5px; }
  50%  { background-position: center center, 18% 34%, 38% 46%, 64% 24%, 90% 40%;
         background-size: auto 100%, 7px 7px, 5px 5px, 8px 8px, 4px 4px; }
  100% { background-position: center center, 16% -46%, 40% -34%, 66% -52%, 88% -38%;
         background-size: auto 100%, 4px 4px, 3px 3px, 5px 5px, 2px 2px; }
}
@keyframes btnEnds {
  0%, 100% { filter: brightness(1)    drop-shadow(0 0 0 rgba(255,205,110,0)); }
  50%      { filter: brightness(1.18) drop-shadow(0 0 5px rgba(255,205,110,.45)); }
}


.btn:hover, .filter-chip:hover, .view-btn:hover, .aview-btn:hover,
.cal-btn:hover, .threshold-btn:hover, .att-chip:hover {
  color: #fff3cf !important;
  text-shadow: 0 0 8px rgba(255,214,120,.9), 0 0 20px rgba(255,170,50,.5) !important;
}
.filter-chip.active, .view-btn.active, .aview-btn.active, .btn.primary {
  color: #fff6d8 !important;
  text-shadow: 0 0 10px rgba(255,222,140,.95), 0 0 22px rgba(255,180,60,.5) !important;
}


.filter-chip:nth-child(2n)::before, .view-btn:nth-child(2n)::before,
.btn:nth-child(2n)::before, .admin-tribute .actions button:nth-child(2n)::before { animation-delay: -3s; }
.filter-chip:nth-child(3n)::before, .btn:nth-child(3n)::before,
.admin-tribute .actions button:nth-child(3n)::before { animation-delay: -6s; }


.button-row::before, .filter-bar::before, .filter-chips::before,
.view-toggle::before, .gallery-filters::before, .tribute-tools::before,
.gv-actions::before, .farewell-actions::before { opacity: .42; }


.nav-plaque .brand, .nav-plaque .nav-links { position: relative; isolation: isolate; }

.nav-plaque .brand::before,
.nav-plaque .nav-links::before {
  content: '';
  position: absolute;
  inset: -8px -12px;
  z-index: -1;
  pointer-events: none;
  background-repeat: no-repeat;
  background-image:
    radial-gradient(circle, rgba(255,238,180,.9),  rgba(255,214,120,.30) 45%, transparent 70%),
    radial-gradient(circle, rgba(255,248,215,.8),  rgba(255,206,105,.26) 45%, transparent 70%),
    radial-gradient(circle, rgba(255,232,165,.85), rgba(250,200,95,.28)  45%, transparent 70%),
    radial-gradient(circle, rgba(255,250,225,.75), rgba(255,220,130,.24) 45%, transparent 70%),
    radial-gradient(circle, rgba(255,240,190,.85), rgba(252,205,100,.26) 45%, transparent 70%),
    radial-gradient(circle, rgba(255,244,200,.8),  rgba(255,216,120,.22) 45%, transparent 70%),
    radial-gradient(circle, rgba(255,236,175,.85), rgba(255,210,110,.26) 45%, transparent 70%),
    radial-gradient(circle, rgba(255,252,230,.7),  rgba(255,224,140,.20) 45%, transparent 70%);
  animation: navMotes 17s linear infinite;
}
.nav-plaque .brand::before { animation-duration: 21s; animation-delay: -7s; }

@keyframes navMotes {
  0% {
    background-position: 5% 120%, 17% 132%, 29% 118%, 41% 136%, 56% 122%, 68% 130%, 81% 116%, 94% 134%;
    background-size: 10px 10px, 6px 6px, 13px 13px, 5px 5px, 8px 8px, 11px 11px, 7px 7px, 9px 9px;
  }
  30% {
    background-position: 7% 62%, 15% 84%, 31% 48%, 43% 92%, 54% 66%, 70% 80%, 79% 54%, 96% 88%;
    background-size: 9px 9px, 7px 7px, 11px 11px, 6px 6px, 9px 9px, 9px 9px, 8px 8px, 7px 7px;
  }
  62% {
    background-position: 4% 6%, 18% 30%, 28% -8%, 40% 36%, 57% 12%, 67% 26%, 82% -4%, 93% 32%;
    background-size: 7px 7px, 5px 5px, 8px 8px, 4px 4px, 6px 6px, 7px 7px, 5px 5px, 6px 6px;
  }
  100% {
    background-position: 5% -48%, 17% -32%, 29% -60%, 41% -28%, 56% -44%, 68% -36%, 81% -56%, 94% -30%;
    background-size: 4px 4px, 3px 3px, 5px 5px, 2px 2px, 3px 3px, 4px 4px, 3px 3px, 3px 3px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .btn::before, .btn::after, .filter-chip::before, .filter-chip::after,
  .nav-plaque .brand::before, .nav-plaque .nav-links::before { animation: none; }
}


.btn,
.btn.primary,
.btn.secondary,
.btn.ghost,
.filter-chip,
.view-btn,
.aview-btn,
.cal-btn,
.date-clear,
.threshold-btn,
.att-chip,
.admin-tribute .actions button,
.to-top,
.help-toggle,
[data-story],
.expand-pub-table-btn {
  --bh: 46px;
  --bcap: calc(var(--bh) * 0.9036);
  --bgap: 6px;
  position: relative;
  isolation: isolate;
  min-height: var(--bh);
  padding-left: calc(var(--bcap) + var(--bgap)) !important;
  padding-right: calc(var(--bcap) + var(--bgap)) !important;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  overflow: visible;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  color: #fff0b9 !important;
  font-weight: 700;
  line-height: 1.2;
  text-shadow:
    0 0 5px rgba(255, 237, 184, .82),
    0 0 13px rgba(255, 198, 86, .62),
    0 1px 2px rgba(25, 11, 2, .95) !important;
}


.btn::before,
.btn.primary::before,
.btn.secondary::before,
.btn.ghost::before,
.filter-chip::before,
.view-btn::before,
.aview-btn::before,
.cal-btn::before,
.date-clear::before,
.threshold-btn::before,
.att-chip::before,
.admin-tribute .actions button::before,
.to-top::before,
.help-toggle::before,
[data-story]::before,
.expand-pub-table-btn::before {
  content: '';
  position: absolute;
  top: 0;
  bottom: 0;
  left: var(--bcap);
  right: var(--bcap);
  z-index: -1;
  pointer-events: none;
  border-radius: 0;
  opacity: 1;
  background-image:
    radial-gradient(circle, rgba(255, 250, 220, .98), rgba(255, 214, 112, .50) 43%, transparent 72%),
    radial-gradient(circle, rgba(255, 239, 184, .94), rgba(255, 193, 72, .42) 44%, transparent 72%),
    radial-gradient(circle, rgba(255, 246, 205, .96), rgba(255, 211, 105, .46) 44%, transparent 72%),
    radial-gradient(circle, rgba(255, 231, 162, .92), rgba(246, 177, 54, .40) 44%, transparent 72%),
    url('assets/nav-plaque-mid.png');
  background-repeat: no-repeat, no-repeat, no-repeat, no-repeat, repeat-x;
  background-size: 10px 10px, 7px 7px, 12px 12px, 6px 6px, auto 100%;
  background-position: 15% 122%, 39% 130%, 66% 118%, 88% 126%, center;
  background-blend-mode: screen, screen, screen, screen, normal;
  box-shadow:
    inset 0 1px 0 rgba(255, 235, 180, .30),
    inset 0 -1px 0 rgba(255, 182, 55, .18);
  animation: buttonPlaqueLight 8.4s linear infinite;
}


.btn::after,
.btn.primary::after,
.btn.secondary::after,
.btn.ghost::after,
.filter-chip::after,
.view-btn::after,
.aview-btn::after,
.cal-btn::after,
.date-clear::after,
.threshold-btn::after,
.att-chip::after,
.admin-tribute .actions button::after,
.to-top::after,
.help-toggle::after,
[data-story]::after,
.expand-pub-table-btn::after {
  content: '' !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: -1;
  width: auto !important;
  height: auto !important;
  pointer-events: none;
  opacity: 1 !important;
  transform: none !important;
  background:
    url('assets/nav-plaque-left.png') left center / var(--bcap) 100% no-repeat,
    url('assets/nav-plaque-right.png') right center / var(--bcap) 100% no-repeat !important;
  animation: buttonPlaqueEnds 8.4s ease-in-out infinite !important;
}

@keyframes buttonPlaqueLight {
  0% {
    background-position: 15% 122%, 39% 130%, 66% 118%, 88% 126%, center;
    background-size: 10px 10px, 7px 7px, 12px 12px, 6px 6px, auto 100%;
    filter: brightness(1.12) saturate(1.04);
  }
  48% {
    background-position: 17% 34%, 37% 51%, 64% 24%, 90% 43%, center;
    background-size: 8px 8px, 6px 6px, 9px 9px, 5px 5px, auto 100%;
    filter: brightness(1.27) saturate(1.12);
  }
  100% {
    background-position: 15% -42%, 39% -34%, 66% -54%, 88% -38%, center;
    background-size: 4px 4px, 3px 3px, 5px 5px, 3px 3px, auto 100%;
    filter: brightness(1.12) saturate(1.04);
  }
}

@keyframes buttonPlaqueEnds {
  0%, 100% {
    filter: brightness(1.10) saturate(1.04) drop-shadow(0 0 2px rgba(255, 205, 108, .28));
  }
  50% {
    filter: brightness(1.34) saturate(1.12) drop-shadow(0 0 9px rgba(255, 211, 116, .78));
  }
}


.modal-close::after,
.story-close::after {
  content: none !important;
  display: none !important;
  background: none !important;
  animation: none !important;
}

.btn:hover,
.btn.primary:hover,
.btn.secondary:hover,
.btn.ghost:hover,
.filter-chip:hover,
.view-btn:hover,
.aview-btn:hover,
.cal-btn:hover,
.date-clear:hover,
.threshold-btn:hover,
.att-chip:hover,
.admin-tribute .actions button:hover,
.to-top:hover,
.help-toggle:hover,
[data-story]:hover,
.expand-pub-table-btn:hover {
  color: #fff9e7 !important;
  text-shadow:
    0 0 7px rgba(255, 250, 222, 1),
    0 0 17px rgba(255, 213, 118, .96),
    0 0 28px rgba(255, 166, 38, .60) !important;
}

.filter-chip.active,
.view-btn.active,
.aview-btn.active,
.btn.primary {
  color: #fffbe9 !important;
  text-shadow:
    0 0 8px rgba(255, 253, 232, 1),
    0 0 20px rgba(255, 221, 140, .98),
    0 0 30px rgba(255, 170, 42, .58) !important;
}

.btn:focus-visible,
.filter-chip:focus-visible,
.view-btn:focus-visible,
.aview-btn:focus-visible,
.cal-btn:focus-visible,
.date-clear:focus-visible,
.threshold-btn:focus-visible,
.att-chip:focus-visible,
.admin-tribute .actions button:focus-visible,
.to-top:focus-visible,
.help-toggle:focus-visible,
[data-story]:focus-visible,
.expand-pub-table-btn:focus-visible {
  outline: 3px solid #fff0ae;
  outline-offset: 4px;
}


html body .tribute-tools,
html body .tribute-tools.admin-tools {
  width: fit-content;
  max-width: 100%;
  justify-content: center !important;
  margin: 0 auto 16px !important;
}

html body .virtue-controls {
  width: fit-content !important;
  max-width: 100%;
  clear: both;
  justify-content: center !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

.to-top-row.to-top-row--centered {
  position: static;
  width: 100%;
  display: flex;
  justify-content: center !important;
  align-items: center;
  margin: clamp(6px, .7vw, 10px) auto 0 !important;
}


@media (min-width: 981px) {
  .nav-plaque .nav-links .nav-exit-btn {
    color: #fff0b9 !important;
    font-weight: 800 !important;
    letter-spacing: .035em !important;
    animation: navExitLustre 3.2s ease-in-out infinite !important;
  }

  .nav-plaque .nav-links .nav-exit-btn::before {
    content: '';
    position: absolute;
    inset: -8px -14px;
    z-index: -1;
    pointer-events: none;
    border-radius: 999px;
    opacity: .92;
    background-image:
      radial-gradient(circle, rgba(255, 252, 229, 1), rgba(255, 209, 102, .55) 42%, transparent 70%),
      radial-gradient(circle, rgba(255, 238, 183, .98), rgba(255, 184, 53, .48) 44%, transparent 72%),
      radial-gradient(circle, rgba(255, 249, 216, .98), rgba(255, 216, 121, .50) 43%, transparent 71%),
      radial-gradient(ellipse at center, rgba(255, 204, 96, .20), transparent 68%);
    background-repeat: no-repeat;
    animation: navExitSparks 4.6s linear infinite;
  }

  .nav-plaque .nav-links .nav-exit-btn::after {
    width: 58% !important;
    background: linear-gradient(90deg, transparent, #e9c66d 18%, #fff3bd 50%, #e9c66d 82%, transparent) !important;
    box-shadow: 0 0 8px rgba(255, 213, 113, .72);
    animation: navExitRuleGlow 3.2s ease-in-out infinite !important;
  }

  .nav-plaque .nav-links .nav-exit-btn:hover::after { width: 82% !important; }
}


@media (max-width: 980px) {
  .nav-plaque .nav-links .nav-exit-btn::after {
    content: none !important;
    display: none !important;
    background: none !important;
    animation: none !important;
  }
}

@keyframes navExitLustre {
  0%, 100% {
    text-shadow: 0 0 5px rgba(255, 236, 181, .70), 0 0 13px rgba(255, 183, 55, .40);
    filter: brightness(1.02);
  }
  50% {
    text-shadow: 0 0 8px rgba(255, 252, 228, 1), 0 0 20px rgba(255, 218, 126, .96), 0 0 31px rgba(255, 163, 34, .68);
    filter: brightness(1.18);
  }
}

@keyframes navExitSparks {
  0% {
    background-position: 14% 114%, 52% 124%, 86% 112%, center;
    background-size: 8px 8px, 5px 5px, 7px 7px, 100% 100%;
  }
  52% {
    background-position: 18% 24%, 48% 48%, 82% 16%, center;
    background-size: 6px 6px, 4px 4px, 5px 5px, 100% 100%;
  }
  100% {
    background-position: 14% -30%, 52% -18%, 86% -38%, center;
    background-size: 3px 3px, 2px 2px, 3px 3px, 100% 100%;
  }
}

@keyframes navExitRuleGlow {
  0%, 100% { opacity: .58; box-shadow: 0 0 5px rgba(255, 205, 102, .48); }
  50% { opacity: 1; box-shadow: 0 0 13px rgba(255, 226, 145, .98); }
}

@media (max-width: 620px) {
  html body .tribute-tools,
  html body .tribute-tools.admin-tools {
    width: 100%;
  }

  html body .virtue-controls {
    width: 100% !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .btn::before, .btn::after,
  .filter-chip::before, .filter-chip::after,
  .view-btn::before, .view-btn::after,
  .aview-btn::before, .aview-btn::after,
  .cal-btn::before, .cal-btn::after,
  .date-clear::before, .date-clear::after,
  .threshold-btn::before, .threshold-btn::after,
  .att-chip::before, .att-chip::after,
  .admin-tribute .actions button::before,
  .admin-tribute .actions button::after,
  .to-top::before, .to-top::after,
  .help-toggle::before, .help-toggle::after,
  [data-story]::before, [data-story]::after,
  .expand-pub-table-btn::before, .expand-pub-table-btn::after,
  .nav-plaque .nav-links .nav-exit-btn,
  .nav-plaque .nav-links .nav-exit-btn::before,
  .nav-plaque .nav-links .nav-exit-btn::after {
    animation: none !important;
  }
}


.btn,
.btn.primary,
.btn.secondary,
.btn.ghost,
.threshold-btn,
.filter-chip,
.virtue-btn,
.tab,
.cite-tab,
.view-btn,
.aview-btn,
.cal-btn,
.date-clear,
.mode-chip,
.help-toggle,
[data-story],
.to-top,
.expand-pub-table-btn,
.att-chip,
.pub-cite,
.voice-open,
.voice-close,
#tourNext,
#tourClose,
.tour-actions button,
.admin-tribute .actions button {
  --bh: 46px;
  --bcap: calc(var(--bh) * 0.9036);
  --bgap: 6px;
  position: relative;
  isolation: isolate;
  min-height: var(--bh);
  padding-left: calc(var(--bcap) + var(--bgap)) !important;
  padding-right: calc(var(--bcap) + var(--bgap)) !important;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  overflow: visible !important;
  background: transparent !important;
  background-image: none !important;
  border: 0 !important;
  box-shadow: none !important;
  color: #f6dfa0 !important;
  font-family: var(--font-body) !important;
  font-weight: 700;
  line-height: 1.2;
  text-shadow:
    0 0 6px rgba(255, 218, 126, .68),
    0 0 15px rgba(255, 176, 60, .34),
    0 1px 2px rgba(25, 11, 2, .95) !important;
  animation: navGlow 4.2s ease-in-out infinite !important;
  transition: color .25s ease, text-shadow .25s ease, transform .25s ease !important;
}

.pub-cite { --bh: 34px; --bgap: 3px; font-size: 12.5px; }
#tourNext,
#tourClose,
.tour-actions button,
.voice-close { --bh: 40px; --bgap: 4px; }


.btn::before,
.btn.primary::before,
.btn.secondary::before,
.btn.ghost::before,
.threshold-btn::before,
.filter-chip::before,
.virtue-btn::before,
.tab::before,
.cite-tab::before,
.view-btn::before,
.aview-btn::before,
.cal-btn::before,
.date-clear::before,
.mode-chip::before,
.help-toggle::before,
[data-story]::before,
.to-top::before,
.expand-pub-table-btn::before,
.att-chip::before,
.pub-cite::before,
.voice-open::before,
.voice-close::before,
#tourNext::before,
#tourClose::before,
.tour-actions button::before,
.admin-tribute .actions button::before {
  content: '' !important;
  display: block !important;
  position: absolute !important;
  top: 0 !important;
  bottom: 0 !important;
  left: var(--bcap) !important;
  right: var(--bcap) !important;
  inset-inline: var(--bcap) !important;
  z-index: -1 !important;
  pointer-events: none;
  border: 0 !important;
  border-radius: 0 !important;
  opacity: 1 !important;
  filter: none !important;
  box-shadow: none !important;
  background-color: transparent !important;
  background-image:
    radial-gradient(circle, rgba(255, 252, 230, 1), rgba(255, 216, 118, .62) 45%, transparent 70%),
    radial-gradient(circle, rgba(255, 244, 204, .98), rgba(255, 202, 88, .55) 45%, transparent 70%),
    radial-gradient(circle, rgba(255, 250, 218, 1), rgba(255, 211, 108, .60) 45%, transparent 70%),
    radial-gradient(circle, rgba(255, 238, 190, .96), rgba(249, 190, 66, .52) 45%, transparent 70%),
    radial-gradient(circle, rgba(255, 247, 211, .99), rgba(255, 207, 101, .58) 45%, transparent 70%),
    radial-gradient(circle, rgba(255, 241, 196, .97), rgba(252, 198, 78, .54) 45%, transparent 70%),
    radial-gradient(circle, rgba(255, 253, 232, 1), rgba(255, 219, 126, .62) 45%, transparent 70%),
    radial-gradient(circle, rgba(255, 245, 205, .98), rgba(255, 204, 91, .56) 45%, transparent 70%),
    url('assets/nav-plaque-mid.png') !important;
  background-repeat:
    no-repeat, no-repeat, no-repeat, no-repeat,
    no-repeat, no-repeat, no-repeat, no-repeat, repeat-x !important;
  background-position:
    5% 120%, 17% 132%, 29% 118%, 41% 136%,
    56% 122%, 68% 130%, 81% 116%, 94% 134%, center !important;
  background-size:
    10px 10px, 6px 6px, 13px 13px, 5px 5px,
    8px 8px, 11px 11px, 7px 7px, 9px 9px, auto 100% !important;
  background-blend-mode:
    screen, screen, screen, screen,
    screen, screen, screen, screen, normal !important;
  animation: buttonNavMotes 17s linear infinite !important;
}

.btn::after,
.btn.primary::after,
.btn.secondary::after,
.btn.ghost::after,
.threshold-btn::after,
.filter-chip::after,
.virtue-btn::after,
.tab::after,
.cite-tab::after,
.view-btn::after,
.aview-btn::after,
.cal-btn::after,
.date-clear::after,
.mode-chip::after,
.help-toggle::after,
[data-story]::after,
.to-top::after,
.expand-pub-table-btn::after,
.att-chip::after,
.pub-cite::after,
.voice-open::after,
.voice-close::after,
#tourNext::after,
#tourClose::after,
.tour-actions button::after,
.admin-tribute .actions button::after {
  content: '' !important;
  display: block !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: -1 !important;
  width: auto !important;
  height: auto !important;
  pointer-events: none;
  opacity: 1 !important;
  transform: none !important;
  background:
    url('assets/nav-plaque-left.png') left center / var(--bcap) 100% no-repeat,
    url('assets/nav-plaque-right.png') right center / var(--bcap) 100% no-repeat !important;
  animation: navEnds 13s ease-in-out infinite !important;
}

@keyframes buttonNavMotes {
  0% {
    background-position:
      5% 120%, 17% 132%, 29% 118%, 41% 136%,
      56% 122%, 68% 130%, 81% 116%, 94% 134%, center;
    background-size:
      10px 10px, 6px 6px, 13px 13px, 5px 5px,
      8px 8px, 11px 11px, 7px 7px, 9px 9px, auto 100%;
  }
  30% {
    background-position:
      7% 62%, 15% 84%, 31% 48%, 43% 92%,
      54% 66%, 70% 80%, 79% 54%, 96% 88%, center;
    background-size:
      9px 9px, 7px 7px, 11px 11px, 6px 6px,
      9px 9px, 9px 9px, 8px 8px, 7px 7px, auto 100%;
  }
  62% {
    background-position:
      4% 6%, 18% 30%, 28% -8%, 40% 36%,
      57% 12%, 67% 26%, 82% -4%, 93% 32%, center;
    background-size:
      7px 7px, 5px 5px, 8px 8px, 4px 4px,
      6px 6px, 7px 7px, 5px 5px, 6px 6px, auto 100%;
  }
  100% {
    background-position:
      5% -48%, 17% -32%, 29% -60%, 41% -28%,
      56% -44%, 68% -36%, 81% -56%, 94% -30%, center;
    background-size:
      4px 4px, 3px 3px, 5px 5px, 2px 2px,
      3px 3px, 4px 4px, 3px 3px, 3px 3px, auto 100%;
  }
}

.btn:hover,
.threshold-btn:hover,
.filter-chip:hover,
.virtue-btn:hover,
.tab:hover,
.cite-tab:hover,
.view-btn:hover,
.aview-btn:hover,
.cal-btn:hover,
.date-clear:hover,
.mode-chip:hover,
.help-toggle:hover,
[data-story]:hover,
.to-top:hover,
.expand-pub-table-btn:hover,
.att-chip:hover,
.pub-cite:hover,
.voice-open:hover,
.voice-close:hover,
#tourNext:hover,
#tourClose:hover,
.tour-actions button:hover,
.admin-tribute .actions button:hover {
  color: #fff3cf !important;
  background: transparent !important;
  filter: none !important;
  transform: translateY(-1px) !important;
  text-shadow:
    0 0 9px rgba(255, 226, 153, 1),
    0 0 22px rgba(255, 178, 54, .64),
    0 1px 2px rgba(25, 11, 2, .95) !important;
  animation-play-state: paused !important;
}

.btn:active,
.threshold-btn:active,
.filter-chip:active,
.virtue-btn:active,
.tab:active,
.cite-tab:active,
.view-btn:active,
.aview-btn:active,
.cal-btn:active,
.date-clear:active,
.mode-chip:active,
.help-toggle:active,
[data-story]:active,
.to-top:active,
.expand-pub-table-btn:active,
.att-chip:active,
.pub-cite:active,
.voice-open:active,
.voice-close:active,
#tourNext:active,
#tourClose:active,
.tour-actions button:active,
.admin-tribute .actions button:active {
  transform: translateY(0) scale(.98) !important;
}

.filter-chip.active,
.view-btn.active,
.aview-btn.active,
.virtue-btn.active,
.tab.active,
.cite-tab.active,
.mode-chip.active,
.mode-chip[aria-pressed='true'],
.btn.primary {
  color: #fff3cf !important;
  background: transparent !important;
}

.btn:focus-visible,
.threshold-btn:focus-visible,
.filter-chip:focus-visible,
.virtue-btn:focus-visible,
.tab:focus-visible,
.cite-tab:focus-visible,
.view-btn:focus-visible,
.aview-btn:focus-visible,
.cal-btn:focus-visible,
.date-clear:focus-visible,
.mode-chip:focus-visible,
.help-toggle:focus-visible,
[data-story]:focus-visible,
.to-top:focus-visible,
.expand-pub-table-btn:focus-visible,
.att-chip:focus-visible,
.pub-cite:focus-visible,
.voice-open:focus-visible,
.voice-close:focus-visible,
#tourNext:focus-visible,
#tourClose:focus-visible,
.admin-tribute .actions button:focus-visible {
  outline: 3px solid #f6dfa0 !important;
  outline-offset: 4px;
}


.button-row > :nth-child(2n),
.filter-chips > :nth-child(2n),
.view-toggle > :nth-child(2n),
.gallery-filters > :nth-child(2n),
.virtue-controls > :nth-child(2n),
.tabs > :nth-child(2n),
.cite-tabs > :nth-child(2n),
.tour-actions > :nth-child(2n),
.admin-tribute .actions > :nth-child(2n) {
  animation-delay: -1.4s !important;
}
.button-row > :nth-child(3n),
.filter-chips > :nth-child(3n),
.gallery-filters > :nth-child(3n),
.virtue-controls > :nth-child(3n),
.tabs > :nth-child(3n),
.admin-tribute .actions > :nth-child(3n) {
  animation-delay: -2.6s !important;
}
.button-row > :nth-child(2n)::before,
.filter-chips > :nth-child(2n)::before,
.view-toggle > :nth-child(2n)::before,
.gallery-filters > :nth-child(2n)::before,
.virtue-controls > :nth-child(2n)::before,
.tabs > :nth-child(2n)::before,
.cite-tabs > :nth-child(2n)::before,
.tour-actions > :nth-child(2n)::before,
.admin-tribute .actions > :nth-child(2n)::before {
  animation-delay: -5.6s !important;
}


.modal-close,
.story-close,
.gv-nav,
.tl-photo-nav,
.voice-btn,
.voice-back,
.cal-nav,
.cal-day.has,
.upload-clear,
.menu-toggle {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  background: url('assets/nav-plaque-mid.png') center / auto 100% repeat-x !important;
  border: 1px solid rgba(230, 193, 105, .70) !important;
  color: #f6dfa0 !important;
  text-shadow: 0 0 6px rgba(255, 218, 126, .68) !important;
  box-shadow: 0 0 5px rgba(255, 205, 105, .35) !important;
  animation: navUtilityGlow 4.2s ease-in-out infinite !important;
}

.modal-close::before,
.story-close::before,
.gv-nav::before,
.tl-photo-nav::before,
.voice-btn::before,
.voice-back::before,
.cal-nav::before,
.cal-day.has::before,
.upload-clear::before,
.menu-toggle::before {
  content: '' !important;
  display: block !important;
  position: absolute !important;
  inset: 1px !important;
  z-index: 0 !important;
  pointer-events: none;
  border-radius: inherit;
  background-image:
    radial-gradient(circle, rgba(255, 252, 230, 1), rgba(255, 216, 118, .62) 45%, transparent 70%),
    radial-gradient(circle, rgba(255, 244, 204, .98), rgba(255, 202, 88, .55) 45%, transparent 70%),
    radial-gradient(circle, rgba(255, 250, 218, 1), rgba(255, 211, 108, .60) 45%, transparent 70%),
    radial-gradient(circle, rgba(255, 238, 190, .96), rgba(249, 190, 66, .52) 45%, transparent 70%);
  background-repeat: no-repeat;
  animation: navUtilityMotes 7.5s linear infinite !important;
}

.menu-toggle span {
  position: relative;
  z-index: 1;
  background: #f6dfa0 !important;
  box-shadow: 0 0 4px rgba(255, 218, 126, .72);
}

@keyframes navUtilityMotes {
  0%, 100% {
    background-position: 12% 118%, 38% 126%, 67% 116%, 88% 124%;
    background-size: 6px 6px, 4px 4px, 7px 7px, 4px 4px;
  }
  50% {
    background-position: 16% 18%, 35% 54%, 64% 10%, 91% 44%;
    background-size: 4px 4px, 5px 5px, 4px 4px, 5px 5px;
  }
}

@keyframes navUtilityGlow {
  0%, 100% {
    box-shadow: 0 0 5px rgba(255, 205, 105, .35);
    text-shadow: 0 0 5px rgba(255, 206, 110, .55);
  }
  50% {
    box-shadow: 0 0 13px rgba(255, 222, 140, .82);
    text-shadow: 0 0 11px rgba(255, 226, 153, .95);
  }
}


.gallery-card {
  animation: navTileGlow 4.2s ease-in-out infinite !important;
}
.gallery-card::after {
  content: '';
  position: absolute;
  inset: 0;
  z-index: 3;
  pointer-events: none;
  border-radius: inherit;
  background-image:
    radial-gradient(circle, rgba(255, 252, 230, .98), rgba(255, 216, 118, .52) 45%, transparent 70%),
    radial-gradient(circle, rgba(255, 244, 204, .94), rgba(255, 202, 88, .48) 45%, transparent 70%),
    radial-gradient(circle, rgba(255, 250, 218, .98), rgba(255, 211, 108, .50) 45%, transparent 70%),
    radial-gradient(circle, rgba(255, 238, 190, .92), rgba(249, 190, 66, .46) 45%, transparent 70%);
  background-repeat: no-repeat;
  animation: navTileMotes 17s linear infinite;
}
@keyframes navTileMotes {
  0%   { background-position: 8% 112%, 34% 122%, 65% 116%, 91% 124%; background-size: 10px 10px, 6px 6px, 12px 12px, 7px 7px; }
  50%  { background-position: 11% 22%, 31% 62%, 68% 14%, 88% 54%; background-size: 7px 7px, 8px 8px, 7px 7px, 8px 8px; }
  100% { background-position: 8% -32%, 34% -18%, 65% -40%, 91% -24%; background-size: 4px 4px, 3px 3px, 5px 5px, 3px 3px; }
}
@keyframes navTileGlow {
  0%, 100% { box-shadow: 0 0 4px rgba(255, 205, 105, .18); }
  50%      { box-shadow: 0 0 12px rgba(255, 222, 140, .42); }
}


.nav-plaque .brand::before,
.nav-plaque .nav-links::before {
  opacity: 1 !important;
  background-image:
    radial-gradient(circle, rgba(255, 252, 230, 1), rgba(255, 216, 118, .62) 45%, transparent 70%),
    radial-gradient(circle, rgba(255, 244, 204, .98), rgba(255, 202, 88, .55) 45%, transparent 70%),
    radial-gradient(circle, rgba(255, 250, 218, 1), rgba(255, 211, 108, .60) 45%, transparent 70%),
    radial-gradient(circle, rgba(255, 238, 190, .96), rgba(249, 190, 66, .52) 45%, transparent 70%),
    radial-gradient(circle, rgba(255, 247, 211, .99), rgba(255, 207, 101, .58) 45%, transparent 70%),
    radial-gradient(circle, rgba(255, 241, 196, .97), rgba(252, 198, 78, .54) 45%, transparent 70%),
    radial-gradient(circle, rgba(255, 253, 232, 1), rgba(255, 219, 126, .62) 45%, transparent 70%),
    radial-gradient(circle, rgba(255, 245, 205, .98), rgba(255, 204, 91, .56) 45%, transparent 70%) !important;
  background-repeat: no-repeat !important;
  animation: navMotes 17s linear infinite !important;
}
.nav-plaque .brand::before {
  animation-duration: 21s !important;
  animation-delay: -7s !important;
}
.nav-plaque .nav-links .nav-exit-btn::before {
  filter: brightness(1.28) saturate(1.10) drop-shadow(0 0 4px rgba(255, 220, 132, .62));
}

@keyframes navMotes {
  0% {
    background-position: 5% 120%, 17% 132%, 29% 118%, 41% 136%, 56% 122%, 68% 130%, 81% 116%, 94% 134%;
    background-size: 11px 11px, 7px 7px, 14px 14px, 6px 6px, 9px 9px, 12px 12px, 8px 8px, 10px 10px;
    filter: brightness(1.18) saturate(1.08) drop-shadow(0 0 2px rgba(255, 216, 122, .45));
  }
  30% {
    background-position: 7% 62%, 15% 84%, 31% 48%, 43% 92%, 54% 66%, 70% 80%, 79% 54%, 96% 88%;
    background-size: 10px 10px, 8px 8px, 12px 12px, 7px 7px, 10px 10px, 10px 10px, 9px 9px, 8px 8px;
    filter: brightness(1.55) saturate(1.16) drop-shadow(0 0 5px rgba(255, 226, 145, .80));
  }
  62% {
    background-position: 4% 6%, 18% 30%, 28% -8%, 40% 36%, 57% 12%, 67% 26%, 82% -4%, 93% 32%;
    background-size: 8px 8px, 6px 6px, 9px 9px, 5px 5px, 7px 7px, 8px 8px, 6px 6px, 7px 7px;
    filter: brightness(1.32) saturate(1.12) drop-shadow(0 0 3px rgba(255, 220, 132, .62));
  }
  100% {
    background-position: 5% -48%, 17% -32%, 29% -60%, 41% -28%, 56% -44%, 68% -36%, 81% -56%, 94% -30%;
    background-size: 5px 5px, 4px 4px, 6px 6px, 3px 3px, 4px 4px, 5px 5px, 4px 4px, 4px 4px;
    filter: brightness(1.16) saturate(1.08) drop-shadow(0 0 2px rgba(255, 216, 122, .42));
  }
}

@keyframes navGlow {
  0%, 100% {
    text-shadow: 0 0 6px rgba(255, 218, 126, .68), 0 0 15px rgba(255, 176, 60, .34);
  }
  50% {
    text-shadow: 0 0 12px rgba(255, 235, 177, 1), 0 0 27px rgba(255, 184, 64, .72), 0 0 38px rgba(255, 157, 25, .34);
  }
}

@keyframes navEnds {
  0%, 100% {
    filter: brightness(1.04) saturate(1.04) drop-shadow(0 0 1px rgba(255, 205, 110, .18));
  }
  50% {
    filter: brightness(1.26) saturate(1.12) drop-shadow(0 0 8px rgba(255, 220, 132, .68));
  }
}

@keyframes navRule {
  0%, 100% { box-shadow: 0 0 6px rgba(255, 205, 105, .60); }
  50%      { box-shadow: 0 0 15px rgba(255, 232, 166, 1); }
}

@media (prefers-reduced-motion: reduce) {
  .btn, .threshold-btn, .filter-chip, .virtue-btn, .tab, .cite-tab,
  .view-btn, .aview-btn, .cal-btn, .date-clear, .mode-chip, .help-toggle,
  [data-story], .to-top, .expand-pub-table-btn, .att-chip, .pub-cite,
  .voice-open, .voice-close, #tourNext, #tourClose,
  .tour-actions button, .admin-tribute .actions button,
  .modal-close, .story-close, .gv-nav, .tl-photo-nav, .voice-btn,
  .voice-back, .cal-nav, .cal-day.has, .upload-clear, .menu-toggle,
  .gallery-card,
  .btn::before, .btn::after, .threshold-btn::before, .threshold-btn::after,
  .filter-chip::before, .filter-chip::after, .virtue-btn::before, .virtue-btn::after,
  .tab::before, .tab::after, .cite-tab::before, .cite-tab::after,
  .view-btn::before, .view-btn::after, .aview-btn::before, .aview-btn::after,
  .cal-btn::before, .cal-btn::after, .date-clear::before, .date-clear::after,
  .mode-chip::before, .mode-chip::after, .help-toggle::before, .help-toggle::after,
  [data-story]::before, [data-story]::after, .to-top::before, .to-top::after,
  .expand-pub-table-btn::before, .expand-pub-table-btn::after,
  .att-chip::before, .att-chip::after, .pub-cite::before, .pub-cite::after,
  .voice-open::before, .voice-open::after, .voice-close::before, .voice-close::after,
  #tourNext::before, #tourNext::after, #tourClose::before, #tourClose::after,
  .admin-tribute .actions button::before, .admin-tribute .actions button::after,
  .gallery-card::after, .nav-plaque .brand::before, .nav-plaque .nav-links::before {
    animation: none !important;
  }
}




.btn::before,
.btn.primary::before,
.btn.secondary::before,
.btn.ghost::before,
.threshold-btn::before,
.filter-chip::before,
.virtue-btn::before,
.tab::before,
.cite-tab::before,
.view-btn::before,
.aview-btn::before,
.cal-btn::before,
.date-clear::before,
.mode-chip::before,
.help-toggle::before,
[data-story]::before,
.to-top::before,
.expand-pub-table-btn::before,
.att-chip::before,
.pub-cite::before,
.voice-open::before,
.voice-close::before,
#tourNext::before,
#tourClose::before,
.tour-actions button::before,
.admin-tribute .actions button::before {
  background: url('assets/nav-plaque-mid.png') center / auto 100% repeat-x !important;
  background-blend-mode: normal !important;
  filter: brightness(1.05) saturate(1.03) !important;
  animation: none !important;
}


.modal-close::before,
.story-close::before,
.gv-nav::before,
.tl-photo-nav::before,
.voice-btn::before,
.voice-back::before,
.cal-nav::before,
.cal-day.has::before,
.upload-clear::before,
.menu-toggle::before,
.gallery-card::after,
.nav-plaque .brand::before,
.nav-plaque .nav-links::before,
.nav-plaque .nav-links .nav-exit-btn::before {
  content: none !important;
  display: none !important;
  background: none !important;
  animation: none !important;
}

.has-live-button-bubbles {
  position: relative !important;
  isolation: isolate !important;
}

.has-live-button-bubbles > .live-button-bubbles {
  position: absolute !important;
  inset: 0 !important;
  z-index: 7 !important;
  display: block !important;
  overflow: hidden !important;
  padding: 0 !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: inherit !important;
  background: none !important;
  box-shadow: none !important;
  opacity: 1 !important;
  pointer-events: none !important;
  transform: none !important;
  animation: none !important;
}

.has-live-button-bubbles > .live-button-bubbles > .live-button-bubble {
  position: absolute !important;
  right: auto !important;
  top: auto !important;
  bottom: -5px !important;
  min-width: 0 !important;
  min-height: 0 !important;
  display: block !important;
  padding: 0 !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 50% !important;
  background: radial-gradient(
    circle at 34% 30%,
    #fff1b8 0 15%,
    #f4cf6d 32%,
    #c58e28 60%,
    rgba(194, 137, 34, .12) 73%,
    transparent 75%
  ) !important;
  box-shadow:
    0 0 2px rgba(255, 220, 119, .84),
    0 0 4px rgba(194, 137, 34, .42) !important;
  
  opacity: 0;
  transform: translate3d(0, 8px, 0) scale(.45);
  transition: none !important;
  animation: none !important;
  pointer-events: none !important;
  will-change: transform, opacity;
  mix-blend-mode: screen;
}


.nav-plaque .brand > .live-button-bubbles > .live-button-bubble,
.nav-plaque .nav-links a > .live-button-bubbles > .live-button-bubble {
  filter: brightness(1.24) saturate(1.10) !important;
  box-shadow:
    0 0 3px rgba(255, 236, 165, 1),
    0 0 6px rgba(215, 159, 43, .70) !important;
}


:root {
  --site-pure-gold: #ffd700;
  --site-pure-gold-light: #ffe86a;
  --site-pure-gold-deep: #8a5700;
  --site-pure-gold-ink: #301800;
}


html body .topbar {
  background: var(--site-pure-gold) !important;
  background-color: var(--site-pure-gold) !important;
  background-image: none !important;
  border-bottom-color: rgba(92, 54, 0, .58) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  animation: pureGoldBarAura 5.8s ease-in-out infinite !important;
}

html body .topbar.scrolled {
  background: var(--site-pure-gold) !important;
  box-shadow: 0 5px 24px rgba(98, 57, 0, .35) !important;
}

html body .nav-plaque {
  background: var(--site-pure-gold) !important;
  background-color: var(--site-pure-gold) !important;
  background-image: none !important;
  border: 1px solid rgba(105, 62, 0, .62) !important;
  border-radius: 999px !important;
  box-shadow:
    inset 0 2px 0 rgba(255, 250, 196, .78),
    inset 0 -2px 0 rgba(119, 68, 0, .30),
    0 5px 18px rgba(95, 54, 0, .26),
    0 0 20px rgba(255, 215, 0, .42) !important;
}


html body .nav-plaque::before {
  content: '' !important;
  display: block !important;
  background: var(--site-pure-gold) !important;
  background-color: var(--site-pure-gold) !important;
  background-image: none !important;
  background-blend-mode: normal !important;
  box-shadow:
    inset 0 2px 0 rgba(255, 250, 196, .66),
    inset 0 -2px 0 rgba(119, 68, 0, .24) !important;
  filter: none !important;
  opacity: 1 !important;
  animation: pureGoldSurfaceBreath 5.8s ease-in-out infinite !important;
}


html body .nav-plaque::after {
  content: '' !important;
  display: block !important;
  background-image:
    url('assets/nav-plaque-left.png'),
    url('assets/nav-plaque-right.png') !important;
  background-color: transparent !important;
  background-repeat: no-repeat, no-repeat !important;
  background-position: left center, right center !important;
  background-size: var(--cap) 100%, var(--cap) 100% !important;
  background-blend-mode: normal !important;
  mix-blend-mode: screen !important;
  opacity: 1 !important;
  animation: pureGoldOrnamentBreath 6.4s ease-in-out infinite !important;
}

html body .nav-plaque .nav-links {
  background: transparent !important;
  border-color: transparent !important;
}

html body :is(
  .nav-plaque .brand strong,
  .nav-plaque .brand em,
  .nav-plaque .nav-links a,
  .nav-plaque .nav-links .nav-exit-btn,
  .topbar .nav-links a,
  .topbar .nav-links .nav-exit-btn,
  .topbar .nav-links .admin-link,
  .topbar .brand strong,
  .topbar .brand em
) {
  color: var(--site-pure-gold-ink) !important;
  text-shadow:
    0 1px 0 rgba(255, 250, 205, .82),
    0 0 5px rgba(99, 57, 0, .24) !important;
  animation: pureGoldLabelBreath 4.8s ease-in-out infinite !important;
  animation-play-state: running !important;
}

html body .nav-plaque .nav-links :is(a, .nav-exit-btn):is(:hover, .active),
html body .topbar .nav-links :is(a, .nav-exit-btn):is(:hover, .active) {
  color: #1d0e00 !important;
  background: rgba(255, 255, 255, .30) !important;
  text-shadow:
    0 1px 0 rgba(255, 255, 225, .95),
    0 0 8px rgba(89, 48, 0, .42) !important;
}

html body .nav-plaque .nav-links :is(a, .nav-exit-btn)::after {
  background: var(--site-pure-gold-deep) !important;
}

@media (max-width: 980px) {
  html body .nav-links {
    background: var(--site-pure-gold) !important;
    background-color: var(--site-pure-gold) !important;
    background-image: none !important;
    border-color: rgba(92, 54, 0, .48) !important;
  }
}


html body :is(
  .btn, .threshold-btn, .filter-chip, .filter-btn, .virtue-btn,
  .tab, .cite-tab, .view-btn, .aview-btn, .cal-btn, .date-clear,
  .mode-chip, .help-toggle, [data-story], .to-top,
  .expand-pub-table-btn, .att-chip, .pub-cite, .voice-open,
  .voice-close, #tourNext, #tourClose, .tour-actions button,
  .admin-publish, .admin-tribute .actions button
) {
  --bh: 46px;
  --bcap: calc(var(--bh) * .9036);
  --bgap: 6px;
  position: relative !important;
  isolation: isolate !important;
  overflow: visible !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border: 0 !important;
  border-radius: 999px !important;
  box-shadow: none !important;
  color: var(--site-pure-gold-ink) !important;
  text-shadow:
    0 1px 0 rgba(255, 251, 211, .88),
    0 0 4px rgba(91, 51, 0, .22) !important;
  animation: pureGoldLabelBreath 4.8s ease-in-out infinite !important;
  animation-play-state: running !important;
}

html body :is(
  .btn, .threshold-btn, .filter-chip, .filter-btn, .virtue-btn,
  .tab, .cite-tab, .view-btn, .aview-btn, .cal-btn, .date-clear,
  .mode-chip, .help-toggle, [data-story], .to-top,
  .expand-pub-table-btn, .att-chip, .pub-cite, .voice-open,
  .voice-close, #tourNext, #tourClose, .tour-actions button,
  .admin-publish, .admin-tribute .actions button
)::before {
  content: '' !important;
  display: block !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: -2 !important;
  pointer-events: none !important;
  border: 2px solid var(--site-pure-gold-deep) !important;
  border-radius: 999px !important;
  background: var(--site-pure-gold) !important;
  background-color: var(--site-pure-gold) !important;
  background-image: none !important;
  background-blend-mode: normal !important;
  box-shadow:
    inset 0 2px 0 rgba(255, 251, 208, .80),
    inset 0 -2px 0 rgba(113, 64, 0, .28),
    0 4px 12px rgba(91, 51, 0, .24),
    0 0 12px rgba(255, 215, 0, .40) !important;
  filter: none !important;
  opacity: 1 !important;
  animation: pureGoldSurfaceBreath 5.8s ease-in-out infinite !important;
  animation-play-state: running !important;
}

html body :is(
  .btn, .threshold-btn, .filter-chip, .filter-btn, .virtue-btn,
  .tab, .cite-tab, .view-btn, .aview-btn, .cal-btn, .date-clear,
  .mode-chip, .help-toggle, [data-story], .to-top,
  .expand-pub-table-btn, .att-chip, .pub-cite, .voice-open,
  .voice-close, #tourNext, #tourClose, .tour-actions button,
  .admin-publish, .admin-tribute .actions button
)::after {
  content: '' !important;
  display: block !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: -1 !important;
  width: auto !important;
  height: auto !important;
  pointer-events: none !important;
  border-radius: 999px !important;
  background:
    url('assets/nav-plaque-left.png') left center / var(--bcap) 100% no-repeat,
    url('assets/nav-plaque-right.png') right center / var(--bcap) 100% no-repeat !important;
  background-color: transparent !important;
  background-blend-mode: normal !important;
  mix-blend-mode: screen !important;
  opacity: 1 !important;
  transform: none !important;
  animation: pureGoldOrnamentBreath 6.4s ease-in-out infinite !important;
  animation-play-state: running !important;
}

html body :is(
  .btn, .threshold-btn, .filter-chip, .filter-btn, .virtue-btn,
  .tab, .cite-tab, .view-btn, .aview-btn, .cal-btn, .date-clear,
  .mode-chip, .help-toggle, [data-story], .to-top,
  .expand-pub-table-btn, .att-chip, .pub-cite, .voice-open,
  .voice-close, #tourNext, #tourClose, .tour-actions button,
  .admin-publish, .admin-tribute .actions button
):hover {
  color: #160a00 !important;
  filter: brightness(1.04) !important;
  transform: translateY(-2px) !important;
  text-shadow:
    0 1px 0 rgba(255, 255, 225, 1),
    0 0 7px rgba(91, 48, 0, .36) !important;
  animation-play-state: running !important;
}

html body :is(
  .btn, .threshold-btn, .filter-chip, .filter-btn, .virtue-btn,
  .tab, .cite-tab, .view-btn, .aview-btn, .cal-btn, .date-clear,
  .mode-chip, .help-toggle, [data-story], .to-top,
  .expand-pub-table-btn, .att-chip, .pub-cite, .voice-open,
  .voice-close, #tourNext, #tourClose, .tour-actions button,
  .admin-publish, .admin-tribute .actions button
):active {
  transform: translateY(0) scale(.98) !important;
}

html body :is(
  .filter-chip.active, .view-btn.active, .aview-btn.active,
  .virtue-btn.active, .tab.active, .cite-tab.active,
  .mode-chip.active, .mode-chip[aria-pressed='true'], .btn.primary
) {
  color: #160a00 !important;
}

html body :is(
  .btn, .threshold-btn, .filter-chip, .filter-btn, .virtue-btn,
  .tab, .cite-tab, .view-btn, .aview-btn, .cal-btn, .date-clear,
  .mode-chip, .help-toggle, [data-story], .to-top,
  .expand-pub-table-btn, .att-chip, .pub-cite, .voice-open,
  .voice-close, #tourNext, #tourClose, .tour-actions button,
  .admin-publish, .admin-tribute .actions button
):focus-visible {
  outline: 3px solid #5e3600 !important;
  outline-offset: 4px !important;
}


html body :is(
  .modal-close, .story-close, .gv-nav, .tl-photo-nav,
  .voice-btn, .voice-back, .cal-nav, .cal-day.has,
  .upload-clear, .menu-toggle
) {
  position: relative !important;
  isolation: isolate !important;
  overflow: hidden !important;
  background: var(--site-pure-gold) !important;
  background-color: var(--site-pure-gold) !important;
  background-image: none !important;
  border: 2px solid var(--site-pure-gold-deep) !important;
  color: var(--site-pure-gold-ink) !important;
  text-shadow: 0 1px 0 rgba(255, 252, 215, .92) !important;
  box-shadow:
    inset 0 2px 0 rgba(255, 251, 208, .80),
    inset 0 -2px 0 rgba(113, 64, 0, .28),
    0 3px 10px rgba(91, 51, 0, .28),
    0 0 12px rgba(255, 215, 0, .44) !important;
  animation: pureGoldUtilityAura 4.8s ease-in-out infinite !important;
  animation-play-state: running !important;
}

html body :is(
  .modal-close, .story-close, .gv-nav, .tl-photo-nav,
  .voice-btn, .voice-back, .cal-nav, .cal-day.has,
  .upload-clear, .menu-toggle
)::before,
html body :is(
  .modal-close, .story-close, .gv-nav, .tl-photo-nav,
  .voice-btn, .voice-back, .cal-nav, .cal-day.has,
  .upload-clear, .menu-toggle
)::after {
  content: none !important;
  display: none !important;
  background: none !important;
  animation: none !important;
}

html body :is(
  .modal-close, .story-close, .gv-nav, .tl-photo-nav,
  .voice-btn, .voice-back, .cal-nav, .cal-day.has,
  .upload-clear, .menu-toggle
):hover {
  background: var(--site-pure-gold-light) !important;
  color: #160a00 !important;
  animation-play-state: running !important;
}

html body .menu-toggle span {
  background: var(--site-pure-gold-ink) !important;
  box-shadow: none !important;
}


.has-live-button-bubbles > .live-button-bubbles > .live-button-bubble {
  background: radial-gradient(
    circle at 34% 30%,
    #fffde8 0 16%,
    #fff1a0 31%,
    #bd7600 60%,
    rgba(91, 48, 0, .22) 72%,
    transparent 75%
  ) !important;
  box-shadow:
    0 0 2px rgba(255, 255, 225, .96),
    0 0 5px rgba(105, 58, 0, .58) !important;
  mix-blend-mode: normal !important;
  opacity: 0;
  transform: translate3d(0, 8px, 0) scale(.42);
  animation: didolkarBubbleLift var(--bubble-duration, 4600ms) linear
             var(--bubble-delay, 0ms) infinite both !important;
  animation-play-state: running !important;
}

@keyframes didolkarBubbleLift {
  0% {
    opacity: 0;
    transform: translate3d(0, 8px, 0) scale(.42);
  }
  12% { opacity: .96; }
  72% { opacity: .84; }
  100% {
    opacity: 0;
    transform: translate3d(var(--bubble-drift, 5px), var(--bubble-rise, -70px), 0) scale(1.08);
  }
}

@keyframes pureGoldBarAura {
  0%, 100% {
    box-shadow: 0 3px 16px rgba(100, 58, 0, .22), 0 0 8px rgba(255, 215, 0, .32);
  }
  50% {
    box-shadow: 0 5px 24px rgba(100, 58, 0, .34), 0 0 22px rgba(255, 229, 92, .68);
  }
}

@keyframes pureGoldSurfaceBreath {
  0%, 100% {
    box-shadow:
      inset 0 2px 0 rgba(255, 251, 208, .74),
      inset 0 -2px 0 rgba(113, 64, 0, .26),
      0 3px 10px rgba(91, 51, 0, .20),
      0 0 9px rgba(255, 215, 0, .34);
  }
  50% {
    box-shadow:
      inset 0 2px 0 rgba(255, 255, 232, .96),
      inset 0 -2px 0 rgba(113, 64, 0, .20),
      0 5px 14px rgba(91, 51, 0, .28),
      0 0 22px rgba(255, 235, 116, .76);
  }
}

@keyframes pureGoldOrnamentBreath {
  0%, 100% {
    filter: brightness(1.04) saturate(1.02) drop-shadow(0 0 2px rgba(102, 58, 0, .26));
  }
  50% {
    filter: brightness(1.22) saturate(1.08) drop-shadow(0 0 8px rgba(255, 244, 166, .90));
  }
}

@keyframes pureGoldLabelBreath {
  0%, 100% {
    text-shadow: 0 1px 0 rgba(255, 251, 211, .86), 0 0 3px rgba(91, 51, 0, .20);
  }
  50% {
    text-shadow: 0 1px 0 rgba(255, 255, 230, 1), 0 0 8px rgba(91, 51, 0, .42);
  }
}

@keyframes pureGoldUtilityAura {
  0%, 100% {
    box-shadow:
      inset 0 2px 0 rgba(255, 251, 208, .78),
      inset 0 -2px 0 rgba(113, 64, 0, .27),
      0 3px 9px rgba(91, 51, 0, .24),
      0 0 8px rgba(255, 215, 0, .38);
  }
  50% {
    box-shadow:
      inset 0 2px 0 rgba(255, 255, 232, .96),
      inset 0 -2px 0 rgba(113, 64, 0, .20),
      0 4px 13px rgba(91, 51, 0, .31),
      0 0 18px rgba(255, 238, 125, .82);
  }
}


:root {
  --borderless-gold-face: #ffd700;
  --borderless-gold-hover: #ffe45f;
  --borderless-gold-ink: #301800;
}

html body :is(.topbar, .topbar.scrolled, .nav-plaque, .nav-links) {
  border: 0 !important;
  outline: 0 !important;
  border-image: none !important;
}

html body :is(.topbar, .topbar.scrolled) {
  box-shadow: none !important;
}

html body .nav-plaque {
  background: var(--borderless-gold-face) !important;
  background-color: var(--borderless-gold-face) !important;
  background-image: none !important;
  border-radius: 999px !important;
  box-shadow: none !important;
  padding-inline: clamp(20px, 3vw, 52px) !important;
}


html body .nav-plaque::before {
  background: var(--borderless-gold-face) !important;
  background-color: var(--borderless-gold-face) !important;
  background-image: none !important;
  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
  filter: none !important;
}

html body .nav-plaque::after {
  content: none !important;
  display: none !important;
  background: none !important;
  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
  filter: none !important;
  animation: none !important;
}


html body :is(
  .btn, .threshold-btn, .filter-chip, .filter-btn, .virtue-btn,
  .tab, .cite-tab, .view-btn, .aview-btn, .cal-btn, .date-clear,
  .mode-chip, .help-toggle, [data-story], .to-top,
  .expand-pub-table-btn, .att-chip, .pub-cite, .voice-open,
  .voice-close, #tourNext, #tourClose, .tour-actions button,
  .admin-publish, .admin-tribute .actions button
) {
  background: var(--borderless-gold-face) !important;
  background-color: var(--borderless-gold-face) !important;
  background-image: none !important;
  border: 0 !important;
  outline: 0 !important;
  border-image: none !important;
  border-radius: 999px !important;
  box-shadow: 0 0 12px rgba(255, 215, 0, .38) !important;
  padding-inline: clamp(14px, 1.4vw, 24px) !important;
  color: var(--borderless-gold-ink) !important;
}

html body :is(
  .btn, .threshold-btn, .filter-chip, .filter-btn, .virtue-btn,
  .tab, .cite-tab, .view-btn, .aview-btn, .cal-btn, .date-clear,
  .mode-chip, .help-toggle, [data-story], .to-top,
  .expand-pub-table-btn, .att-chip, .pub-cite, .voice-open,
  .voice-close, #tourNext, #tourClose, .tour-actions button,
  .admin-publish, .admin-tribute .actions button
)::before,
html body :is(
  .btn, .threshold-btn, .filter-chip, .filter-btn, .virtue-btn,
  .tab, .cite-tab, .view-btn, .aview-btn, .cal-btn, .date-clear,
  .mode-chip, .help-toggle, [data-story], .to-top,
  .expand-pub-table-btn, .att-chip, .pub-cite, .voice-open,
  .voice-close, #tourNext, #tourClose, .tour-actions button,
  .admin-publish, .admin-tribute .actions button
)::after {
  content: none !important;
  display: none !important;
  background: none !important;
  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
  filter: none !important;
  animation: none !important;
}

html body :is(
  .btn, .threshold-btn, .filter-chip, .filter-btn, .virtue-btn,
  .tab, .cite-tab, .view-btn, .aview-btn, .cal-btn, .date-clear,
  .mode-chip, .help-toggle, [data-story], .to-top,
  .expand-pub-table-btn, .att-chip, .pub-cite, .voice-open,
  .voice-close, #tourNext, #tourClose, .tour-actions button,
  .admin-publish, .admin-tribute .actions button
):hover {
  background: var(--borderless-gold-hover) !important;
  background-color: var(--borderless-gold-hover) !important;
}


html body :is(
  .button-row, .threshold-actions, .farewell-actions, .submit-row,
  .filter-bar, .filter-chips, .view-toggle, .gallery-filters,
  .tribute-tools, .gv-actions, .tabs, .cite-tabs,
  .virtue-controls, .tour-actions, .admin-tribute .actions
) {
  border: 0 !important;
  outline: 0 !important;
  border-image: none !important;
  box-shadow: none !important;
  background: transparent !important;
}

html body :is(
  .button-row, .threshold-actions, .farewell-actions, .submit-row,
  .filter-bar, .filter-chips, .view-toggle, .gallery-filters,
  .tribute-tools, .gv-actions, .tabs, .cite-tabs,
  .virtue-controls, .tour-actions, .admin-tribute .actions
)::before,
html body :is(
  .button-row, .threshold-actions, .farewell-actions, .submit-row,
  .filter-bar, .filter-chips, .view-toggle, .gallery-filters,
  .tribute-tools, .gv-actions, .tabs, .cite-tabs,
  .virtue-controls, .tour-actions, .admin-tribute .actions
)::after {
  content: none !important;
  display: none !important;
  background: none !important;
  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
  animation: none !important;
}


html body :is(
  .modal-close, .story-close, .gv-nav, .tl-photo-nav,
  .voice-btn, .voice-back, .cal-nav, .cal-day.has,
  .upload-clear, .menu-toggle
) {
  border: 0 !important;
  outline: 0 !important;
  border-image: none !important;
  box-shadow: 0 0 10px rgba(255, 215, 0, .34) !important;
}




html body .nav-plaque .nav-links > :is(a, button.nav-exit-btn) {
  box-sizing: border-box !important;
  min-height: 44px !important;
  padding: 8px 14px !important;
  margin: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  font: 700 16px/1.2 var(--font-body) !important;
  letter-spacing: normal !important;
  white-space: nowrap !important;
  border: 0 !important;
  border-radius: 999px !important;
  appearance: none !important;
}


html body :is(
  button:not(:disabled), a.btn, a.to-top, a.att-chip, a[role="button"],
  .nav-plaque .brand, .nav-plaque .nav-links a
) {
  scale: 1;
  translate: 0 0;
  transform-origin: center !important;
  transition: scale 150ms cubic-bezier(.2,.9,.2,1.25),
              translate 150ms cubic-bezier(.2,.9,.2,1.25),
              filter 150ms ease, box-shadow 150ms ease !important;
  will-change: scale, translate;
}

html body :is(
  button:not(:disabled), a.btn, a.to-top, a.att-chip, a[role="button"],
  .nav-plaque .brand, .nav-plaque .nav-links a
):active {
  scale: .91 !important;
  translate: 0 3px !important;
  filter: brightness(.88) saturate(1.12) !important;
  transition-duration: 65ms !important;
}


html body :is(
  .portrait-card, .portrait-card-fullimg, .tl-photo-item,
  .tl-photo-fill, .tl-photo, .tl-grid-thumb, .gv-frame,
  .timeline-photo-modal
) {
  border-radius: 18px !important;
  border: 2px solid rgba(202, 149, 43, .82) !important;
  background: rgba(255, 252, 235, .94) !important;
  box-shadow: 0 8px 24px rgba(92, 54, 9, .18),
              0 0 0 5px rgba(255, 231, 158, .22) !important;
  animation: unifiedPhotoFrameGlow 6.8s ease-in-out infinite !important;
}

html body :is(
  .portrait-card img, .portrait-card picture, .tl-photo-item img,
  .tl-photo-fill img, .tl-photo img, .tl-grid-thumb img,
  .gv-stage, #timelinePhotoDialogImage
) {
  border-radius: 12px !important;
}

html body :is(.portrait-card img, img.foundation-photo, img.temple-img-full) {
  cursor: zoom-in !important;
}

.timeline-photo-modal {
  width: min(1200px, 94vw) !important;
  max-width: min(1200px, 94vw) !important;
  overflow: hidden !important;
}

.timeline-photo-modal #timelinePhotoDialogImage {
  --photo-zoom: 1;
  transform: scale(var(--photo-zoom)) !important;
  transform-origin: center center !important;
  transition: transform 260ms cubic-bezier(.2,.75,.25,1), opacity 220ms ease !important;
  cursor: zoom-in !important;
}

.photo-zoom-controls {
  position: absolute;
  left: 50%;
  bottom: 54px;
  translate: -50% 0;
  z-index: 8;
  display: flex;
  align-items: center;
  gap: 7px;
  padding: 6px;
  border-radius: 999px;
  background: rgba(255, 250, 224, .9);
  box-shadow: 0 5px 18px rgba(62, 34, 2, .24);
  backdrop-filter: blur(4px);
}

.photo-zoom-btn {
  min-width: 40px;
  height: 40px;
  padding: 0 12px;
  border: 0;
  border-radius: 999px;
  background: var(--borderless-gold-face);
  color: var(--borderless-gold-ink);
  font: 800 18px/1 var(--font-body);
  cursor: pointer;
}

.photo-zoom-reset { min-width: 68px; font-size: 14px; }

@keyframes unifiedPhotoFrameGlow {
  0%, 100% { box-shadow: 0 8px 24px rgba(92,54,9,.18), 0 0 0 5px rgba(255,231,158,.20); }
  50% { box-shadow: 0 10px 30px rgba(92,54,9,.24), 0 0 0 5px rgba(255,215,70,.34), 0 0 22px rgba(255,215,70,.28); }
}

@media (max-width: 720px) {
  html body .nav-plaque .nav-links > :is(a, button.nav-exit-btn) {
    width: 100% !important;
    min-height: 42px !important;
  }
  .photo-zoom-controls { bottom: 46px; }
}

@media (prefers-reduced-motion: reduce) {
  html body :is(
    .portrait-card, .portrait-card-fullimg, .tl-photo-item,
    .tl-photo-fill, .tl-photo, .tl-grid-thumb, .gv-frame,
    .timeline-photo-modal
  ) { animation: none !important; }
}


#sacred .sacred-heading-stack {
  display: grid;
  justify-items: center;
  transform: translateY(0);
}
#sacred .sacred-heading-stack .eyebrow { margin-bottom: clamp(3px, .45vw, 7px); }
#sacred .sacred-heading-stack .split-title { margin-bottom: 0; }
#sacred .sacred-center-shree {
  position: relative;
  z-index: 2;
  display: grid;
  width: clamp(42px, 5vw, 62px);
  height: clamp(42px, 5vw, 62px);
  margin: 0 auto clamp(2px, .35vw, 5px);
  place-items: center;
  transform: none;
  pointer-events: none;
}
#sacred .sacred-center-shree .shree-emblem { width: 100%; height: 100%; }
@media (max-width: 620px) {
  #sacred .sacred-heading-stack { transform: translateY(0); }
}


#sacred.sacred-screen {
  align-content: start;
  padding-top: clamp(4px, .55vw, 10px);
}
#sacred .sacred-content {
  width: 100%;
  margin-inline: auto;
  text-align: center;
}


#sacred .sacred-content { position: static; }
#sacred .sacred-heading-stack {
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 3;
  width: min(96vw, 1180px);
  transform: translate(-50%, -50%);
  text-align: center;
}
@media (max-width: 620px) {
  #sacred .sacred-heading-stack { width: calc(100% - 28px); }
}


#sacred .dedication-plain {
  
  margin-top: clamp(400px, 30vw, 460px) !important;
}
@media (max-width: 620px) {
  #sacred .dedication-plain { margin-top: 260px !important; }
}


#sacred .sacred-heading-stack {
  top: calc(50% - 4px) !important;
  left: 50% !important;
  transform: translate(-50%, -50%) !important;
}

#sacred .dedication-plain {
  position: absolute !important;
  top: calc(50% + 92px) !important;
  left: 50% !important;
  width: min(94vw, 1500px) !important;
  margin: 0 !important;
  transform: translateX(-50%) !important;
  text-align: center !important;
  text-align-last: center !important;
}

#sacred .sacred-close {
  position: absolute !important;
  top: calc(50% + 190px) !important;
  left: 50% !important;
  width: max-content !important;
  max-width: calc(100vw - 28px) !important;
  margin: 0 !important;
  transform: translateX(-50%) !important;
  text-align: center !important;
}

@media (max-width: 760px) {
  #sacred .dedication-plain {
    top: calc(50% + 82px) !important;
    width: calc(100vw - 32px) !important;
  }
  #sacred .sacred-close { top: calc(50% + 205px) !important; }
}


html body .nav-plaque .nav-links > #navExitBtn {
  position: relative !important;
  inset: auto !important;
  display: inline-flex !important;
  order: 99 !important;
  align-self: center !important;
}
@media (max-width: 980px) {
  html body .nav-plaque .nav-links > #navExitBtn {
    width: 100% !important;
    justify-content: center !important;
  }
}


#sacred .sacred-heading-stack,
#sacred .sacred-heading-stack .eyebrow,
#sacred .sacred-heading-stack .heading-accent,
#sacred .dedication-plain,
#sacred .sacred-close {
  text-align: center !important;
  text-align-last: center !important;
}

#sacred .sacred-heading-stack {
  left: 50% !important;
  width: 100vw !important;
  max-width: 100vw !important;
  transform: translate(-50%, -50%) !important;
}

#sacred .sacred-heading-stack .heading-accent,
#sacred .sacred-heading-stack .eyebrow {
  width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
}


.nav-shree-slot {
  display: grid !important;
  place-items: center !important;
  min-height: 78px !important;
  background: #eadfc8 !important;
  text-align: center !important;
}
.nav-shree-slot .sacred-center-shree {
  position: relative !important;
  display: grid !important;
  place-items: center !important;
  width: clamp(58px, 5.6vw, 82px) !important;
  height: clamp(58px, 5.6vw, 82px) !important;
  margin: 0 !important;
  transform: none !important;
}
.nav-shree-slot .shree-emblem {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
}


html body .nav-plaque .nav-links > #navExitBtn::after {
  left: 50% !important;
  right: auto !important;
  bottom: 3px !important;
  transform: translateX(-50%) !important;
  transform-origin: center center !important;
}


html body .nav-plaque .nav-links > a:not(.brand) {
  background: linear-gradient(180deg, #f7f1df 0%, #eee4cf 100%) !important;
  background-color: #f1e8d6 !important;
  border-radius: 999px !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.88),
              0 0 0 1px rgba(198,152,61,.12) !important;
}

html body .nav-plaque .nav-links > a:not(.brand):is(:hover, :focus-visible, .active) {
  background: linear-gradient(180deg, #fff8e7 0%, #f3e5c7 100%) !important;
}


#sacred .sacred-heading-stack { top: calc(50% - 28px) !important; }
#sacred .dedication-plain { top: calc(50% + 68px) !important; }
@media (max-width: 760px) {
  #sacred .dedication-plain { top: calc(50% + 58px) !important; }
}


html body :is(
  button, a.btn, a.to-top, a.att-chip, a[role="button"],
  .nav-plaque .nav-links > a, .nav-plaque .nav-links > .nav-exit-btn,
  .virtue-btn, .tab, .cite-tab, .help-toggle, .filter-chip, .filter-btn,
  .view-btn, .aview-btn, .cal-btn, .date-clear, .mode-chip, [data-story],
  .expand-pub-table-btn, .pub-cite, .voice-open, .voice-close
):hover {
  background: var(--resting-control-background) !important;
  color: var(--resting-control-colour) !important;
  -webkit-text-fill-color: var(--resting-control-colour) !important;
}


html body .nav-plaque .nav-links > a:not(.brand):is(:hover, :focus-visible, .active) {
  background: var(--resting-control-background) !important;
  color: var(--resting-control-colour) !important;
  -webkit-text-fill-color: var(--resting-control-colour) !important;
}


html body .nav-plaque .nav-links > :is(.brand, a[href="#sacred"], #navExitBtn) {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border: 0 !important;
  box-shadow: none !important;
  color: #9b5700 !important;
  -webkit-text-fill-color: #9b5700 !important;
  text-shadow: 0 1px 0 rgba(255,249,214,.96), 0 0 7px rgba(210,139,10,.48) !important;
  filter: drop-shadow(0 1px 0 rgba(255,249,214,.9)) !important;
  animation: navLabelEmphasis 3.4s ease-in-out var(--nav-pulse-delay, 0s) infinite !important;
}

html body .nav-plaque .nav-links > :is(.brand, a[href="#sacred"], #navExitBtn)::before {
  content: none !important;
  display: none !important;
  background: none !important;
  box-shadow: none !important;
  animation: none !important;
}

html body .nav-plaque .nav-links > :is(.brand, a[href="#sacred"], #navExitBtn)::after {
  content: "" !important;
  position: absolute !important;
  z-index: -1 !important;
  left: 15% !important;
  right: 15% !important;
  bottom: 3px !important;
  width: auto !important;
  height: 2px !important;
  border-radius: 999px !important;
  background: linear-gradient(90deg, transparent, #d18a0b 22%, #ffe28a 50%, #d18a0b 78%, transparent) !important;
  box-shadow: 0 0 8px rgba(205,131,0,.62) !important;
  animation: navLabelUnderline 3.4s ease-in-out var(--nav-pulse-delay, 0s) infinite !important;
  transform: none !important;
}

html body .nav-plaque .nav-links > :is(.brand, a[href="#sacred"], #navExitBtn):is(:hover, :focus-visible, .active) {
  background: transparent !important;
  background-color: transparent !important;
}


#sacred .sacred-heading-stack {
  top: clamp(150px, 16vh, 200px) !important;
}
#sacred .dedication-plain {
  top: clamp(270px, 28vh, 330px) !important;
}
#sacred .sacred-close {
  top: clamp(405px, 42vh, 475px) !important;
}
@media (max-width: 760px) {
  #sacred .sacred-heading-stack { top: 118px !important; }
  #sacred .dedication-plain { top: 230px !important; }
  #sacred .sacred-close { top: 370px !important; }
}


#threshold:not(.is-reopening) .diya-lamp { animation: lampSettle .42s var(--ease-spring) both !important; }
#threshold:not(.is-reopening) .diya-wick { animation: wickRise .32s var(--ease-spring) .05s both !important; }
#threshold:not(.is-reopening) .flame {
  animation: flameCatch .48s var(--ease-spring) .06s both, flameSway 7.3s ease-in-out .54s infinite, flameBreathe 3.9s ease-in-out .54s infinite !important;
}
#threshold:not(.is-reopening) .flame-halo { animation: glowSwell .38s var(--ease-soft) .1s both, flameHaloBreathe 6.8s ease-in-out .5s infinite !important; }
#threshold:not(.is-reopening) .diya-glow { animation: glowSwell .38s var(--ease-soft) .12s both, glowBreathe 5.7s ease-in-out .5s infinite !important; }
#threshold:not(.is-reopening) .diya-halo { animation: glowSwell .42s var(--ease-soft) .16s both, haloBreathe 9.1s ease-in-out .58s infinite !important; }
#threshold:not(.is-reopening) .threshold-line .aw,
#threshold:not(.is-reopening) .threshold-names .nw { animation-delay: .18s !important; }
#threshold:not(.is-reopening) .threshold-title { animation: seRise .46s var(--ease-soft) .24s forwards, seSweep 9s linear .7s infinite !important; }
#threshold:not(.is-reopening) .threshold-actions { animation: riseIn .42s var(--ease-spring) .32s both, capRegalia 6.8s cubic-bezier(.45, 0, .55, 1) .74s infinite !important; }


#threshold.is-reopening .diya-lamp,
#threshold.is-reopening .diya-wick,
#threshold.is-reopening .flame,
#threshold.is-reopening .flame-halo,
#threshold.is-reopening .diya-glow,
#threshold.is-reopening .diya-halo,
#threshold.is-reopening .d-rim,
#threshold.is-reopening .d-beads circle,
#threshold.is-reopening .d-petals path,
#threshold.is-reopening .threshold-line,
#threshold.is-reopening .threshold-names,
#threshold.is-reopening .threshold-title,
#threshold.is-reopening .threshold-actions,
#threshold.is-reopening .aw,
#threshold.is-reopening .nw {
  animation-delay: 0s !important;
}


#threshold .threshold-btn,
.farewell .threshold-btn {
  color: #4a2500 !important;
  -webkit-text-fill-color: #4a2500 !important;
  background-color: #f3bd43 !important;
  background-image: linear-gradient(180deg, #fff6d2 0%, #ffe698 16%, #f8cb60 39%, #e9a52a 70%, #c86e08 100%) !important;
  border: 1px solid #8f4d03 !important;
  box-shadow: inset 0 4px 3px rgba(255,255,246,.98), inset 0 -7px 9px rgba(103,43,0,.45), inset 4px 0 6px rgba(255,235,157,.62), inset -4px 0 6px rgba(126,52,0,.24), 0 7px 12px rgba(75,34,0,.38), 0 0 20px rgba(247,184,55,.72) !important;
  text-shadow: none !important;
  filter: none !important;
  animation: none !important;
  transition: transform .18s ease, filter .18s ease !important;
}
#threshold .threshold-btn:hover,
.farewell .threshold-btn:hover {
  color: #4a2500 !important;
  -webkit-text-fill-color: #4a2500 !important;
  background-color: #f3bd43 !important;
  background-image: linear-gradient(180deg, #fff6d2 0%, #ffe698 16%, #f8cb60 39%, #e9a52a 70%, #c86e08 100%) !important;
  box-shadow: inset 0 4px 3px rgba(255,255,246,.98), inset 0 -7px 9px rgba(103,43,0,.45), inset 4px 0 6px rgba(255,235,157,.62), inset -4px 0 6px rgba(126,52,0,.24), 0 7px 12px rgba(75,34,0,.38), 0 0 20px rgba(247,184,55,.72) !important;
  text-shadow: none !important;
  filter: brightness(1.04) !important;
  transform: translateY(-2px) !important;
}
#threshold .threshold-btn:active,
.farewell .threshold-btn:active {
  color: #4a2500 !important;
  -webkit-text-fill-color: #4a2500 !important;
  transform: translateY(1px) scale(.98) !important;
}



.living-memories-inner { max-width: 1180px; }
.lm-intro-ribbon {
  display: flex; justify-content: center; flex-wrap: wrap; gap: 8px 18px;
  margin: -4px auto 26px; max-width: 980px; color: var(--muted);
  font-size: 14px; letter-spacing: 0.02em;
}
.lm-intro-ribbon span {
  position: relative; padding: 7px 13px; border: 1px solid var(--line);
  border-radius: 999px; background: rgba(255,253,246,.56);
  backdrop-filter: blur(6px);
}
.lm-intro-ribbon strong { color: var(--heading); }

.lm-cinema {
  max-width: 980px; margin: 0 auto 30px; padding: clamp(12px, 2vw, 22px);
  border: 1px solid rgba(140,85,20,.20); border-radius: 26px;
  background: linear-gradient(160deg, rgba(255,253,246,.80), rgba(255,244,220,.60));
  box-shadow: 0 24px 60px rgba(61,40,20,.10);
}
.lm-frame {
  position: relative; padding: clamp(10px,1.7vw,18px); border-radius: 18px;
  background:
    repeating-linear-gradient(90deg, rgba(92,45,10,.28) 0 2px, transparent 2px 9px),
    linear-gradient(145deg, #5c2d0a 0%, #b8650e 26%, #d4a03a 50%, #8b4513 74%, #5c2d0a 100%);
  box-shadow: inset 0 0 0 1px rgba(255,232,176,.70), 0 10px 30px rgba(61,40,20,.20);
}
.lm-frame::before {
  content: ""; position: absolute; inset: 6px; border: 1px solid rgba(255,238,196,.55);
  border-radius: 13px; pointer-events: none;
}
.lm-stage {
  position: relative; display: grid; place-items: center; overflow: hidden;
  min-height: clamp(260px, 50vw, 610px); border-radius: 10px;
  background:
    radial-gradient(circle at 50% 40%, rgba(196,136,15,.14), transparent 48%),
    #160d08;
  box-shadow: inset 0 0 42px rgba(0,0,0,.70);
}

.lm-stage::after {
  content: ""; position: absolute; inset: 0; pointer-events: none; z-index: 2;
  opacity: .055; mix-blend-mode: screen;
  background-image:
    repeating-radial-gradient(circle at 30% 20%, rgba(255,255,255,.85) 0 1px, transparent 1px 4px);
}
.lm-video {
  position: relative; z-index: 1; display: block;
  width: 100%; height: 100%; max-height: 610px; min-height: 260px;
  object-fit: contain; object-position: center; background: #100a07;
  transform: scale(var(--lm-video-zoom, 1)); transform-origin: 50% 50%;
  transition: transform .26s var(--ease-soft);
}

.lm-video-console {
  display: grid; grid-template-columns: 1fr 1fr; gap: 10px 18px; align-items: center;
  padding: 16px 10px 4px; max-width: 900px; margin: 0 auto;
}
.lm-playback-controls, .lm-zoom-controls {
  display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 9px;
}
.lm-control-btn {
  min-width: 112px; min-height: 44px; display: inline-flex; align-items: center;
  justify-content: center; gap: 7px;
}
.lm-control-btn span[aria-hidden="true"] { font-size: 15px; line-height: 1; }
.lm-zoom-readout {
  min-width: 68px; min-height: 44px; padding: 8px 12px; border: 1px solid rgba(140,85,20,.28);
  border-radius: 999px; color: var(--heading); background: rgba(255,253,246,.82);
  font: inherit; font-weight: 800; cursor: pointer;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.46);
}
.lm-zoom-readout:hover { border-color: rgba(196,136,15,.55); background: rgba(255,246,222,.96); }
.lm-video-status {
  grid-column: 1 / -1; margin: 0; text-align: center; color: var(--muted);
  font-size: 12px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase;
}
.lm-counter {
  position: absolute; right: 14px; bottom: 12px; z-index: 4;
  padding: 4px 11px; border: 1px solid rgba(255,232,176,.55); border-radius: 99px;
  color: #ffeec2; background: rgba(36,18,10,.66); font-size: 13px; font-weight: 700;
  letter-spacing: .08em;
}
.lm-corner { position: absolute; z-index: 3; width: 28px; height: 28px; pointer-events: none; border-color: rgba(255,244,212,.92); border-style: solid; border-width: 0; }
.lm-corner--tl { top: 5px; left: 5px; border-top-width: 3px; border-left-width: 3px; border-top-left-radius: 13px; }
.lm-corner--tr { top: 5px; right: 5px; border-top-width: 3px; border-right-width: 3px; border-top-right-radius: 13px; }
.lm-corner--bl { bottom: 5px; left: 5px; border-bottom-width: 3px; border-left-width: 3px; border-bottom-left-radius: 13px; }
.lm-corner--br { bottom: 5px; right: 5px; border-bottom-width: 3px; border-right-width: 3px; border-bottom-right-radius: 13px; }

.lm-caption { text-align: center; padding: 20px 14px 2px; }
.lm-kicker { margin: 0 0 2px; color: var(--sacred-copper); font-size: 13px; font-weight: 800; letter-spacing: .13em; text-transform: uppercase; }
.lm-caption h4 { margin: 0; font-family: var(--font-display); color: var(--heading-strong); font-size: clamp(28px,4vw,42px); font-weight: 600; }
.lm-caption > p:not(.lm-kicker) { margin: 4px auto 0; max-width: 680px; color: var(--text); font-size: 17px; }
.lm-actions { display: flex; justify-content: center; flex-wrap: wrap; gap: 10px; margin-top: 17px; }

.lm-reel-heading { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 14px; max-width: 980px; margin: 0 auto 15px; }
.lm-reel-heading span { height: 1px; background: linear-gradient(90deg, transparent, rgba(160,79,10,.45)); }
.lm-reel-heading span:last-child { background: linear-gradient(90deg, rgba(160,79,10,.45), transparent); }
.lm-reel-heading h4 { margin: 0; color: var(--heading); font-family: var(--font-display); font-size: 23px; font-weight: 600; text-align: center; }
.lm-reel-heading h4 small { display: block; margin-top: 3px; color: var(--muted); font-family: var(--font-body); font-size: 11px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }


.lm-reel {
  display: flex; gap: 15px; max-width: 1060px; margin: 0 auto;
  padding: 4px 4px 15px; overflow-x: auto; overflow-y: hidden;
  scroll-snap-type: x mandatory; scroll-padding-inline: 4px; scroll-behavior: smooth;
  overscroll-behavior-inline: contain; -webkit-overflow-scrolling: touch;
  scrollbar-width: thin; scrollbar-color: rgba(160,79,10,.48) rgba(160,79,10,.10);
}
.lm-reel::-webkit-scrollbar { height: 8px; }
.lm-reel::-webkit-scrollbar-track { background: rgba(160,79,10,.08); border-radius: 999px; }
.lm-reel::-webkit-scrollbar-thumb { background: linear-gradient(90deg, rgba(196,136,15,.55), rgba(160,79,10,.68)); border-radius: 999px; }
.lm-memory-card {
  position: relative; overflow: hidden; min-width: 0; padding: 8px; cursor: pointer;
  flex: 0 0 clamp(205px, 24vw, 250px); scroll-snap-align: start; scroll-snap-stop: normal;
  border: 1px solid rgba(140,85,20,.20); border-radius: 17px;
  color: var(--text); text-align: left; font: inherit;
  background: rgba(255,253,246,.72); box-shadow: 0 10px 26px rgba(61,40,20,.07);
  transition: transform .30s var(--ease-spring), border-color .26s var(--ease-soft), box-shadow .30s var(--ease-soft), background .26s var(--ease-soft);
}
.lm-memory-card:hover { transform: translateY(-5px) scale(1.012); border-color: rgba(196,136,15,.55); box-shadow: 0 16px 34px rgba(61,40,20,.13); }
.lm-memory-card:active { transform: translateY(-1px) scale(.985); }
.lm-memory-card.is-active { border-color: rgba(160,79,10,.70); background: linear-gradient(155deg, rgba(255,250,240,.96), rgba(255,234,187,.72)); box-shadow: 0 0 0 2px rgba(196,136,15,.14), 0 16px 36px rgba(61,40,20,.13); }
.lm-thumb {
  position: relative; display: grid; place-items: center; width: 100%; aspect-ratio: 16 / 9;
  overflow: hidden; border-radius: 11px; background: #160d08; box-shadow: inset 0 0 24px rgba(0,0,0,.45);
}
.lm-thumb img { width: 100%; height: 100%; object-fit: contain; object-position: center; display: block; }
.lm-thumb-play {
  position: absolute; left: 10px; bottom: 9px; width: 30px; height: 30px; display: grid; place-items: center;
  border: 1px solid rgba(255,238,198,.72); border-radius: 50%; color: #fff1c8; background: rgba(36,18,10,.68);
  font-size: 12px; padding-left: 2px; backdrop-filter: blur(4px);
}
.lm-duration {
  position: absolute; right: 8px; bottom: 8px; padding: 2px 7px; border-radius: 999px;
  background: rgba(16,10,7,.76); color: #fff3d0; font-size: 11px; font-weight: 800; letter-spacing: .04em;
}
.lm-card-copy { display: flex; min-width: 0; flex-direction: column; padding: 9px 5px 4px; line-height: 1.25; }
.lm-card-copy strong { overflow: hidden; text-overflow: ellipsis; color: var(--heading); font-size: 15px; white-space: nowrap; }
.lm-card-copy small { margin-top: 4px; color: var(--muted); font-size: 12px; }
.lm-footnote { max-width: 820px; margin: 20px auto 0; color: var(--muted); text-align: center; font-size: 14px; font-style: italic; }

@media (max-width: 920px) { .lm-memory-card { flex-basis: clamp(205px, 36vw, 245px); } }
@media (max-width: 620px) {
  .lm-intro-ribbon { gap: 7px; }
  .lm-intro-ribbon span { width: calc(50% - 4px); text-align: center; padding-inline: 7px; }
  .lm-cinema { padding: 8px; border-radius: 19px; }
  .lm-frame { padding: 9px; }
  .lm-stage, .lm-video { min-height: 230px; }
  .lm-video-console { grid-template-columns: 1fr; padding-inline: 2px; }
  .lm-video-status { grid-column: 1; }
  .lm-control-btn { min-width: 102px; }
  .lm-reel { gap: 10px; padding-bottom: 13px; }
  .lm-memory-card { flex: 0 0 min(76vw, 250px); padding: 6px; border-radius: 14px; }
  .lm-card-copy strong { font-size: 13px; }
  .lm-card-copy small { font-size: 11px; }
}
@media (max-width: 390px) { .lm-memory-card { flex-basis: min(82vw, 240px); } .lm-intro-ribbon span { width: 100%; } }
@media (prefers-reduced-motion: reduce) {
  .lm-memory-card, .lm-video { transition: none !important; }
  .lm-memory-card:hover, .lm-memory-card:active { transform: none; }
}


.lm-video-console {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.lm-view-controls {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 9px;
}

body.lm-theatre-open::after {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 9996;
  background: rgba(18, 10, 6, .86);
  backdrop-filter: blur(10px);
}
.lm-cinema.is-theatre {
  position: fixed;
  inset: clamp(12px, 2.4vw, 34px);
  z-index: 9997;
  max-width: none;
  width: auto;
  margin: 0;
  overflow: auto;
  overscroll-behavior: contain;
  background: linear-gradient(160deg, #fff9e8 0%, #f7e9c1 100%);
  box-shadow: 0 34px 100px rgba(0,0,0,.56), 0 0 0 1px rgba(231,186,80,.45);
}
.lm-cinema.is-theatre .lm-stage {
  min-height: min(66vh, 760px);
}
.lm-cinema.is-theatre .lm-video {
  max-height: min(66vh, 760px);
}
.lm-cinema:fullscreen {
  box-sizing: border-box;
  width: 100%;
  height: 100%;
  max-width: none;
  margin: 0;
  padding: clamp(14px, 2vw, 28px);
  overflow: auto;
  border: 0;
  border-radius: 0;
  background: linear-gradient(160deg, #160d08 0%, #090605 100%);
}
.lm-cinema:fullscreen .lm-stage {
  min-height: min(68vh, 820px);
}
.lm-cinema:fullscreen .lm-video {
  max-height: min(68vh, 820px);
}
.lm-cinema:fullscreen .lm-caption h4,
.lm-cinema:fullscreen .lm-kicker,
.lm-cinema:fullscreen .lm-caption > p:not(.lm-kicker),
.lm-cinema:fullscreen .lm-video-status {
  color: #fff1c6;
}
.lm-cinema:fullscreen .lm-video-console,
.lm-cinema:fullscreen .lm-caption {
  max-width: 1080px;
  margin-inline: auto;
}

.photo-control-divider {
  width: 1px;
  height: 28px;
  margin-inline: 2px;
  background: rgba(140,85,20,.28);
}
.photo-view-btn {
  min-width: 92px;
  padding-inline: 14px;
  font-size: 13px;
}
.timeline-photo-modal.is-theatre {
  width: min(1520px, 98vw) !important;
  max-width: min(1520px, 98vw) !important;
  height: min(94vh, 1080px);
  max-height: 94vh;
  padding: 18px 72px 86px !important;
  overflow: hidden !important;
  background: linear-gradient(160deg, #160d08 0%, #090605 100%) !important;
  box-shadow: 0 36px 110px rgba(0,0,0,.66) !important;
}
.timeline-photo-modal.is-theatre::backdrop {
  background: rgba(5,3,2,.88);
  backdrop-filter: blur(12px);
}
.timeline-photo-modal.is-theatre #timelinePhotoDialogImage {
  width: 100%;
  height: calc(94vh - 150px);
  max-height: calc(94vh - 150px);
  object-fit: contain;
}
.timeline-photo-modal.is-theatre .tl-photo-caption,
.timeline-photo-modal.is-theatre .tl-photo-counter {
  color: #fff0bd;
}
.timeline-photo-modal:fullscreen {
  box-sizing: border-box;
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  max-height: none !important;
  margin: 0 !important;
  padding: 18px 72px 88px !important;
  overflow: hidden !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: linear-gradient(160deg, #120b07 0%, #060403 100%) !important;
}
.timeline-photo-modal:fullscreen #timelinePhotoDialogImage {
  width: 100%;
  height: calc(100vh - 150px);
  max-height: calc(100vh - 150px);
  object-fit: contain;
}
.timeline-photo-modal:fullscreen .tl-photo-caption,
.timeline-photo-modal:fullscreen .tl-photo-counter {
  color: #fff0bd;
}
.timeline-photo-modal.is-theatre .photo-zoom-controls,
.timeline-photo-modal:fullscreen .photo-zoom-controls {
  background: rgba(255,248,219,.95);
}

@media (max-width: 880px) {
  .lm-video-console { grid-template-columns: 1fr; }
  .lm-video-status { grid-column: 1; }
  .timeline-photo-modal.is-theatre,
  .timeline-photo-modal:fullscreen {
    padding-inline: 14px !important;
    padding-bottom: 116px !important;
  }
  .timeline-photo-modal.is-theatre #timelinePhotoDialogImage,
  .timeline-photo-modal:fullscreen #timelinePhotoDialogImage {
    height: calc(100vh - 190px);
    max-height: calc(100vh - 190px);
  }
  .photo-zoom-controls {
    max-width: calc(100% - 20px);
    flex-wrap: wrap;
    justify-content: center;
  }
  .photo-control-divider { display: none; }
}



.lm-cinema.is-fullscreen-fallback {
  position: fixed !important;
  inset: 0 !important;
  z-index: 10020 !important;
  box-sizing: border-box !important;
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: clamp(14px, 2vw, 28px) !important;
  overflow: auto !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: linear-gradient(160deg, #160d08 0%, #090605 100%) !important;
}
.lm-cinema.is-fullscreen-fallback .lm-stage { min-height: min(68vh, 820px); }
.lm-cinema.is-fullscreen-fallback .lm-video { max-height: min(68vh, 820px); object-fit: contain !important; }
.lm-cinema.is-fullscreen-fallback .lm-caption h4,
.lm-cinema.is-fullscreen-fallback .lm-kicker,
.lm-cinema.is-fullscreen-fallback .lm-caption > p:not(.lm-kicker),
.lm-cinema.is-fullscreen-fallback .lm-video-status { color: #fff1c6; }
.lm-cinema.is-fullscreen-fallback .lm-video-console,
.lm-cinema.is-fullscreen-fallback .lm-caption { max-width: 1080px; margin-inline: auto; }


body.gallery-theatre-open::after {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 9996;
  background: rgba(10, 6, 4, .88);
  backdrop-filter: blur(10px);
}
.gallery-viewer.is-theatre {
  position: fixed !important;
  inset: clamp(12px, 2.4vw, 34px) !important;
  z-index: 9997 !important;
  box-sizing: border-box !important;
  width: auto !important;
  max-width: none !important;
  margin: 0 !important;
  padding: clamp(12px, 2vw, 24px) !important;
  overflow: auto !important;
  border-radius: 20px !important;
  background: linear-gradient(160deg, #fff9e8 0%, #f7e9c1 100%) !important;
  box-shadow: 0 34px 100px rgba(0,0,0,.56), 0 0 0 1px rgba(231,186,80,.45) !important;
}
.gallery-viewer.is-theatre .gv-frame,
.gallery-viewer:fullscreen .gv-frame,
.gallery-viewer.is-fullscreen-fallback .gv-frame { max-width: 1280px; margin-inline: auto; }
.gallery-viewer.is-theatre .gv-stage { height: min(70vh, 820px); aspect-ratio: auto; }
.gallery-viewer.is-theatre .gv-img { object-fit: contain !important; }
.gallery-viewer:fullscreen,
.gallery-viewer.is-fullscreen-fallback {
  box-sizing: border-box !important;
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: clamp(12px, 2vw, 24px) !important;
  overflow: auto !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: linear-gradient(160deg, #160d08 0%, #090605 100%) !important;
}
.gallery-viewer.is-fullscreen-fallback {
  position: fixed !important;
  inset: 0 !important;
  z-index: 10020 !important;
}
.gallery-viewer:fullscreen .gv-stage,
.gallery-viewer.is-fullscreen-fallback .gv-stage { height: min(74vh, 900px); aspect-ratio: auto; }
.gallery-viewer:fullscreen .gv-img,
.gallery-viewer.is-fullscreen-fallback .gv-img { object-fit: contain !important; }
.gallery-viewer:fullscreen .gv-caption strong,
.gallery-viewer:fullscreen .gv-caption p,
.gallery-viewer.is-fullscreen-fallback .gv-caption strong,
.gallery-viewer.is-fullscreen-fallback .gv-caption p { color: #fff1c6 !important; }
.gallery-viewer:fullscreen .gv-actions,
.gallery-viewer.is-fullscreen-fallback .gv-actions { background: rgba(255,248,219,.94); }


.timeline-photo-modal.is-fullscreen-fallback {
  box-sizing: border-box !important;
  position: fixed !important;
  inset: 0 !important;
  z-index: 10030 !important;
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  max-height: none !important;
  margin: 0 !important;
  padding: 18px 72px 88px !important;
  overflow: hidden !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: linear-gradient(160deg, #120b07 0%, #060403 100%) !important;
}
.timeline-photo-modal.is-fullscreen-fallback #timelinePhotoDialogImage {
  width: 100%;
  height: calc(100vh - 150px);
  max-height: calc(100vh - 150px);
  object-fit: contain !important;
}
.timeline-photo-modal.is-fullscreen-fallback .tl-photo-caption,
.timeline-photo-modal.is-fullscreen-fallback .tl-photo-counter { color: #fff0bd; }
.timeline-photo-modal.is-fullscreen-fallback .photo-zoom-controls { background: rgba(255,248,219,.95); }

@media (max-width: 880px) {
  .gallery-viewer.is-theatre { inset: 8px !important; padding: 8px !important; }
  .gallery-viewer.is-theatre .gv-stage,
  .gallery-viewer:fullscreen .gv-stage,
  .gallery-viewer.is-fullscreen-fallback .gv-stage { height: min(68vh, 720px); }
  .timeline-photo-modal.is-fullscreen-fallback {
    padding-inline: 14px !important;
    padding-bottom: 116px !important;
  }
  .timeline-photo-modal.is-fullscreen-fallback #timelinePhotoDialogImage {
    height: calc(100vh - 190px);
    max-height: calc(100vh - 190px);
  }
}



.observe, .observe-card {
  opacity: 1;
  transform: none;
}
.observe.reveal-pending, .observe-card.reveal-pending {
  opacity: 0;
  transform: translateY(28px);
}
.observe.reveal-pending.in-view, .observe-card.reveal-pending.in-view,
.observe.in-view, .observe-card.in-view {
  opacity: 1;
  transform: translateY(0);
}
@media (prefers-reduced-motion: reduce) {
  .observe.reveal-pending, .observe-card.reveal-pending {
    opacity: 1 !important;
    transform: none !important;
  }
}


#foundation .photo-shot:has(> img.foundation-photo) {
  width: min(220px, 100%) !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  align-self: start !important;
  justify-self: start !important;
}

#foundation img.foundation-photo {
  display: block !important;
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  aspect-ratio: 651 / 768 !important;
  object-fit: contain !important;
  object-position: center !important;
}

@media (max-width: 980px) {
  #foundation .photo-shot:has(> img.foundation-photo) {
    width: min(200px, 100%) !important;
    justify-self: center !important;
    margin-inline: auto !important;
  }
}



.lm-poster-fallback {
  position: absolute;
  inset: 0;
  z-index: 1;
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center;
  display: block;
  background: #100a07;
  pointer-events: none;
}
#livingMemoryVideo.lm-video {
  z-index: 2;
  background: transparent;
  opacity: 0;
}
#livingMemoriesCinema.lm-media-ready #livingMemoryVideo.lm-video { opacity: 1; }
#livingMemoriesCinema.lm-media-ready .lm-poster-fallback { visibility: hidden; }

body.lm-fullscreen-open::after {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 10018;
  background: #090605;
  pointer-events: none;
}


#livingMemoriesCinema.is-theatre,
#livingMemoriesCinema.is-fullscreen-mode {
  position: fixed !important;
  z-index: 10020 !important;
  box-sizing: border-box !important;
  max-width: none !important;
  margin: 0 !important;
  overflow: auto !important;
  overscroll-behavior: contain !important;
  opacity: 1 !important;
  transform: none !important;
  content-visibility: visible !important;
}
#livingMemoriesCinema.is-theatre {
  inset: clamp(10px, 2.2vw, 30px) !important;
  width: auto !important;
  height: auto !important;
}
#livingMemoriesCinema.is-fullscreen-mode {
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  padding: clamp(12px, 1.8vw, 24px) !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: linear-gradient(160deg, #160d08 0%, #090605 100%) !important;
}

#livingMemoriesCinema:is(.is-theatre,.is-fullscreen-mode) .lm-stage {
  min-height: 0 !important;
  height: min(64vh, 760px) !important;
  max-height: min(64vh, 760px) !important;
}
#livingMemoriesCinema:is(.is-theatre,.is-fullscreen-mode) .lm-video,
#livingMemoriesCinema:is(.is-theatre,.is-fullscreen-mode) .lm-poster-fallback {
  min-height: 0 !important;
  width: 100% !important;
  height: 100% !important;
  max-height: 100% !important;
  object-fit: contain !important;
}


#livingMemoriesCinema:is(.is-theatre,.is-fullscreen-mode) .lm-video-console {
  position: sticky;
  bottom: 0;
  z-index: 10025;
  max-width: 1080px;
  margin-inline: auto;
  padding: 12px 10px 10px;
  border-radius: 16px;
  background: rgba(255,248,219,.96);
  box-shadow: 0 -8px 24px rgba(0,0,0,.16);
  backdrop-filter: blur(10px);
}
#livingMemoriesCinema.is-fullscreen-mode .lm-caption,
#livingMemoriesCinema.is-fullscreen-mode .lm-video-console {
  max-width: 1080px;
  margin-inline: auto;
}
#livingMemoriesCinema.is-fullscreen-mode .lm-caption h4,
#livingMemoriesCinema.is-fullscreen-mode .lm-kicker,
#livingMemoriesCinema.is-fullscreen-mode .lm-caption > p:not(.lm-kicker),
#livingMemoriesCinema.is-fullscreen-mode .lm-video-status {
  color: #fff1c6;
}

@media (max-width: 760px) {
  #livingMemoriesCinema:is(.is-theatre,.is-fullscreen-mode) {
    padding: 8px !important;
  }
  #livingMemoriesCinema:is(.is-theatre,.is-fullscreen-mode) .lm-stage {
    height: min(56vh, 620px) !important;
    max-height: min(56vh, 620px) !important;
  }
  #livingMemoriesCinema:is(.is-theatre,.is-fullscreen-mode) .lm-video-console {
    position: sticky;
    bottom: 0;
    padding: 9px 4px 8px;
  }
}



body.lm-theatre-open::after,
body.lm-fullscreen-open::after {
  content: none !important;
  display: none !important;
}
.lm-view-backdrop {
  position: fixed;
  inset: 0;
  z-index: 2147483000;
  display: block;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  background: rgba(9, 6, 5, .92);
  backdrop-filter: blur(10px);
  transition: opacity .18s ease, visibility 0s linear .18s;
}
.lm-view-backdrop.is-open {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transition-delay: 0s;
}
.lm-cinema-placeholder {
  display: block;
  max-width: 980px;
  margin-inline: auto;
  pointer-events: none;
  visibility: hidden;
}
#livingMemoriesCinema.lm-detached-viewer {
  position: fixed !important;
  z-index: 2147483001 !important;
  isolation: isolate !important;
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  transform: none !important;
  filter: none !important;
  contain: none !important;
  content-visibility: visible !important;
  will-change: auto !important;
}
#livingMemoriesCinema.lm-detached-viewer.is-theatre {
  inset: clamp(12px, 2.4vw, 34px) !important;
  width: auto !important;
  height: auto !important;
  max-width: none !important;
  margin: 0 !important;
  padding: clamp(12px, 1.8vw, 22px) !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  border-radius: 26px !important;
  background: linear-gradient(160deg, #fff9e8 0%, #f7e9c1 100%) !important;
  box-shadow: 0 34px 100px rgba(0,0,0,.56), 0 0 0 1px rgba(231,186,80,.45) !important;
}
#livingMemoriesCinema.lm-detached-viewer.is-fullscreen-mode {
  inset: 0 !important;
  width: 100vw !important;
  height: 100vh !important;
  max-width: none !important;
  margin: 0 !important;
  padding: clamp(12px, 1.8vw, 24px) !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: linear-gradient(160deg, #160d08 0%, #090605 100%) !important;
  box-shadow: none !important;
}
#livingMemoriesCinema.lm-detached-viewer:is(.is-theatre,.is-fullscreen-mode) .lm-frame,
#livingMemoriesCinema.lm-detached-viewer:is(.is-theatre,.is-fullscreen-mode) .lm-video-console,
#livingMemoriesCinema.lm-detached-viewer:is(.is-theatre,.is-fullscreen-mode) .lm-caption {
  position: relative;
  z-index: 2;
  visibility: visible !important;
  opacity: 1 !important;
}
#livingMemoriesCinema.lm-detached-viewer:is(.is-theatre,.is-fullscreen-mode) .lm-stage {
  min-height: 260px !important;
  height: min(62vh, 720px) !important;
  max-height: min(62vh, 720px) !important;
  visibility: visible !important;
  opacity: 1 !important;
}
#livingMemoriesCinema.lm-detached-viewer:is(.is-theatre,.is-fullscreen-mode) .lm-poster-fallback,
#livingMemoriesCinema.lm-detached-viewer:is(.is-theatre,.is-fullscreen-mode) #livingMemoryVideo {
  width: 100% !important;
  height: 100% !important;
  min-height: 0 !important;
  max-height: 100% !important;
  object-fit: contain !important;
  object-position: center !important;
}
#livingMemoriesCinema.lm-detached-viewer:is(.is-theatre,.is-fullscreen-mode) .lm-video-console {
  position: relative !important;
  bottom: auto !important;
  max-width: 1080px !important;
  margin-inline: auto !important;
}
#livingMemoriesCinema.lm-detached-viewer.is-fullscreen-mode .lm-caption h4,
#livingMemoriesCinema.lm-detached-viewer.is-fullscreen-mode .lm-kicker,
#livingMemoriesCinema.lm-detached-viewer.is-fullscreen-mode .lm-caption > p:not(.lm-kicker),
#livingMemoriesCinema.lm-detached-viewer.is-fullscreen-mode .lm-video-status {
  color: #fff1c6 !important;
}
@media (max-width: 760px) {
  #livingMemoriesCinema.lm-detached-viewer:is(.is-theatre,.is-fullscreen-mode) {
    padding: 8px !important;
  }
  #livingMemoriesCinema.lm-detached-viewer:is(.is-theatre,.is-fullscreen-mode) .lm-stage {
    height: min(54vh, 560px) !important;
    max-height: min(54vh, 560px) !important;
  }
}



#guest-tribute .section-inner,
#help .section-inner { max-width: 1200px; }

.moderation-assurance {
  max-width: 1100px;
  margin: 0 auto 20px;
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 14px 18px;
  border: 1px solid rgba(183,133,45,.35);
  border-radius: 22px;
  background: linear-gradient(180deg, rgba(255,253,247,.97), rgba(248,239,219,.96));
  box-shadow: 0 12px 28px rgba(77,48,8,.07);
}
.moderation-assurance-icon {
  flex: 0 0 38px; width: 38px; height: 38px;
  display: grid; place-items: center;
  border-radius: 50%;
  background: linear-gradient(180deg,#fff8dd,#efd38e);
  border: 1px solid rgba(183,133,45,.38);
  color: #7e5416; font-weight: 900;
}
.moderation-assurance strong { display:block; color:#442a0f; }
.moderation-assurance p { margin:3px 0 0; color:rgba(73,54,29,.88); line-height:1.5; }

.shared-experience-panel {
  max-width: 1100px;
  margin: 0 auto 24px;
  padding: 22px 22px 16px;
  border-radius: 28px;
  border: 1px solid rgba(212,160,58,.38);
  background: linear-gradient(180deg,rgba(255,253,247,.96),rgba(247,238,218,.96));
  box-shadow: 0 20px 48px rgba(56,34,5,.10);
  overflow: hidden;
}
.shared-experience-head { display:flex; align-items:flex-end; justify-content:space-between; gap:18px; margin-bottom:14px; }
.shared-experience-head h4 { margin:0 0 4px; color:#2e1e0d; font-size:clamp(1.35rem,2vw,1.85rem); }
.shared-experience-head p { margin:0; color:rgba(73,54,29,.85); }
.mini-eyebrow { margin:0 0 7px !important; color:#8b541b !important; text-transform:uppercase; letter-spacing:.16em; font:700 .72rem/1.2 var(--font-sans); }
.experience-nav { display:flex; gap:8px; }
.experience-arrow {
  width:40px; height:40px; border-radius:50%; border:1px solid rgba(183,133,45,.45);
  background:linear-gradient(180deg,#fff9e8,#edcf84); color:#6d470f; font-size:1.15rem;
  box-shadow:0 8px 18px rgba(65,38,4,.09); cursor:pointer;
}
.experience-arrow:hover { transform:translateY(-1px); box-shadow:0 12px 24px rgba(65,38,4,.13); }
.experience-carousel {
  display:flex;
  gap:16px;
  overflow-x:auto;
  overscroll-behavior-inline:contain;
  scroll-snap-type:x mandatory;
  scroll-padding-inline:0;
  padding:4px 2px 14px;
  scrollbar-width:auto;
  scrollbar-color:#c28b2d rgba(236,220,180,.5);
}
.experience-carousel::-webkit-scrollbar { height:10px; }
.experience-carousel::-webkit-scrollbar-track { background:rgba(236,220,180,.48); border-radius:999px; }
.experience-carousel::-webkit-scrollbar-thumb { background:linear-gradient(90deg,#d8ad4e,#a96f18); border-radius:999px; border:2px solid rgba(255,250,236,.85); }
.experience-card {
  flex:0 0 calc((100% - 32px) / 3);
  min-width:0;
  scroll-snap-align:start;
  border-radius:22px;
  border:1px solid rgba(212,160,58,.32);
  background:linear-gradient(180deg,rgba(255,254,250,.98),rgba(249,240,222,.98));
  box-shadow:0 12px 26px rgba(76,48,9,.07);
  padding:18px 16px 15px;
  display:flex; flex-direction:column; align-items:flex-start; gap:9px;
  min-height:270px;
  transition:transform .22s ease, box-shadow .22s ease, border-color .22s ease;
}
.experience-card:hover, .experience-card.is-active { transform:translateY(-3px); border-color:rgba(183,133,45,.58); box-shadow:0 20px 36px rgba(76,48,9,.12); }
.experience-card.is-active { background:linear-gradient(180deg,#fffdf4,#f5e4b9); }
.experience-icon { width:52px; height:52px; border-radius:50%; display:grid; place-items:center; background:radial-gradient(circle at 30% 25%,#fff,#f3dfaa); border:1px solid rgba(183,133,45,.35); color:#99661b; font-size:1.55rem; }
.experience-card h5 { margin:0; color:#30200e; font-size:1.02rem; }
.experience-card p, .experience-card blockquote { margin:0; color:rgba(72,54,31,.92); line-height:1.55; }
.experience-card blockquote { font-family:var(--font-serif); }
.experience-author { font-weight:700; color:#79531d !important; }
.experience-card .btn { margin-top:auto; width:100%; justify-content:center; }
.experience-scroll-hint { display:flex; align-items:center; justify-content:center; gap:10px; color:#8b6a32; font-size:.8rem; margin-top:4px; }
.experience-scroll-hint span { width:70px; height:1px; background:linear-gradient(90deg,transparent,#c99a41,transparent); }

.tribute-form--guided { max-width:1100px; margin:0 auto; padding-top:22px; }
.guided-progress { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:8px; margin-bottom:18px; }
.guided-step { position:relative; display:flex; align-items:center; gap:8px; padding:10px 11px; border-radius:16px; border:1px solid rgba(212,160,58,.24); background:rgba(255,252,244,.72); color:#755a31; }
.guided-step span { width:28px; height:28px; flex:0 0 28px; border-radius:50%; display:grid; place-items:center; background:#f1dfb3; color:#754d13; font-weight:800; }
.guided-step em { font-style:normal; font-size:.78rem; font-weight:700; }
.guided-step.is-current, .guided-step.is-done { border-color:rgba(183,133,45,.52); background:linear-gradient(180deg,#fffdf5,#f4e4bb); color:#4a3012; }
.guided-step.is-done span { background:#bf8b2e; color:white; }


.guided-fieldset { border:1px solid rgba(212,160,58,.38); }
.guided-fieldset legend { padding:0 8px; color:#57360e; font-weight:800; }
.guided-fieldset legend small, .tribute-write label small { color:#8a6a39; font-size:.68rem; font-weight:700; text-transform:uppercase; letter-spacing:.04em; }
.field-step-number { display:inline-grid; place-items:center; width:26px; height:26px; border-radius:50%; background:#edd79d; margin-right:6px; }
.experience-title-field { display:block; margin-bottom:16px; }
.experience-title-field input { width:100%; }
.experience-detail-panel { margin:2px 0 16px; padding:16px; border-radius:20px; border:1px solid rgba(183,133,45,.28); background:linear-gradient(180deg,rgba(255,252,244,.95),rgba(248,238,218,.92)); }
.field-row.field-row-2 { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; }
.detail-tip { padding:12px 14px; border-radius:16px; background:rgba(255,250,236,.8); border:1px solid rgba(212,160,58,.20); }
.detail-tip p { margin:4px 0 0; color:rgba(73,54,29,.84); }
.milestone-builder-head { display:flex; align-items:center; gap:10px; margin-bottom:12px; }
.milestone-builder-head > span { color:#ad7820; font-size:1.4rem; }
.milestone-builder-head p { margin:2px 0 0; color:rgba(73,54,29,.82); }
.media-head { display:flex; justify-content:space-between; align-items:flex-start; gap:12px; margin-bottom:10px; }
.media-head h4 { margin:0 0 3px; }
.media-head p { margin:0; color:rgba(73,54,29,.82); line-height:1.45; }
.optional-chip { border-radius:999px; padding:6px 9px; background:#f5ead1; border:1px solid rgba(183,133,45,.28); color:#76521b; font-size:.72rem; font-weight:800; }
.admin-review-callout { margin-top:15px; padding:14px; border-radius:18px; display:flex; gap:10px; align-items:flex-start; background:#fff9e9; border:1px solid rgba(183,133,45,.28); }
.admin-review-callout > span { font-size:1.4rem; }
.admin-review-callout p { margin:3px 0 0; color:rgba(73,54,29,.85); line-height:1.45; }

.preview-head-row { display:flex; align-items:center; justify-content:space-between; gap:16px; }
.preview-head-row h4 { margin:0; }
.preview-status-chip { border-radius:999px; padding:7px 10px; border:1px solid rgba(183,133,45,.3); background:#f7ecd5; color:#78541b; font-size:.78rem; font-weight:800; }
.preview-status-chip.is-ready { background:#edf4df; border-color:rgba(91,128,43,.35); color:#4f6e24; }
.preview-experience-details { margin:10px 0; padding:10px 12px; border-radius:14px; background:rgba(248,239,219,.72); color:#60451e; line-height:1.55; }
.review-checklist { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:8px; margin-top:12px; }
.review-checklist span { padding:9px 8px; border-radius:12px; text-align:center; background:#f4eee1; border:1px solid rgba(183,133,45,.18); color:#856a42; font-size:.72rem; font-weight:700; }
.review-checklist span::before { content:'○ '; }
.review-checklist span.is-done { background:#edf4df; color:#4d6c24; border-color:rgba(91,128,43,.28); }
.review-checklist span.is-done::before { content:'✓ '; }
.submit-row--guided { flex-direction:column; align-items:center; gap:8px; }
.submit-row--guided #submitGuidance { margin:0; color:#7d6948; font-size:.8rem; }
#tributeSubmitBtn:disabled { opacity:.52; filter:saturate(.55); cursor:not-allowed; transform:none !important; }

.help-quick-strip { max-width:1100px; margin:0 auto 20px; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; }
.help-quick-strip span { padding:13px 14px; border-radius:18px; border:1px solid rgba(212,160,58,.28); background:linear-gradient(180deg,#fffdf6,#f6ead0); }
.help-quick-strip b { display:block; color:#493010; margin-bottom:3px; }
.help-quick-strip small { color:rgba(73,54,29,.82); line-height:1.4; display:block; }
.help-grid--current .help-card { overflow:hidden; }
.help-compact-list { margin:8px 0 14px; padding-left:1.2rem; }
.help-compact-list li { margin:7px 0; line-height:1.5; }
.help-emphasis { padding:10px 12px; border-radius:14px; background:#fff7df; border:1px solid rgba(183,133,45,.25); }


.btn, .filter-chip, .tab, .virtue-btn, .help-toggle, .gallery-card, .upload-tile { transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease; }
.btn:hover, .filter-chip:hover, .tab:hover, .virtue-btn:hover, .help-toggle:hover { transform:translateY(-1px); }
.section-heading .heading-accent { text-wrap:balance; }

@media (max-width:900px) {
  .experience-card { flex-basis:calc((100% - 16px) / 2); }
  .guided-progress { grid-template-columns:1fr 1fr; }
  .review-checklist { grid-template-columns:1fr 1fr; }
  .help-quick-strip { grid-template-columns:1fr 1fr; }
  .field-row.field-row-2 { grid-template-columns:1fr; }
}
@media (max-width:620px) {
  .shared-experience-panel { padding:18px 14px 12px; }
  .shared-experience-head { align-items:flex-start; }
  .experience-card { flex-basis:84%; min-height:245px; }
  .experience-nav { display:none; }
  .guided-progress { grid-template-columns:1fr; }
  .guided-step { padding:8px 10px; }
  .review-checklist { grid-template-columns:1fr; }
  .help-quick-strip { grid-template-columns:1fr; }
  .preview-head-row { align-items:flex-start; flex-direction:column; }
}

.tribute-entry-title { margin:.45rem 0 .3rem; color:#553510; font-size:1.02rem; }
.tribute-entry-meta { margin:.2rem 0 .55rem; padding:.45rem .55rem; border-radius:10px; background:rgba(247,236,210,.65); color:#6c4b1d; font-size:.84rem; }





.eyebrow,
.sacred-content .eyebrow,
.section-heading .eyebrow,
#thanks .eyebrow,


.section-heading .eyebrow,
.sacred-content .eyebrow {
  position: relative;
}
.section-heading .eyebrow::after,
.sacred-content .eyebrow::after {
  content: "";
  display: inline-block;
  width: .34em;
  height: .34em;
  margin-left: .52em;
  border-radius: 50%;
  vertical-align: .14em;
  background: #f0c84b;
  box-shadow: 0 0 9px rgba(240,200,75,.55);
  animation: sectionLabelGoldPulse 2.6s ease-in-out infinite;
}
@keyframes sectionLabelGoldPulse {
  0%,100% { opacity:.42; transform:scale(.78); }
  50% { opacity:1; transform:scale(1.12); }
}


#timeline .timeline {
  width: min(100%, 1100px) !important;
  max-width: 1100px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  box-sizing: border-box;
}
#timeline .timeline-item {
  width: 100%;
  box-sizing: border-box;
  padding: 20px 22px;
}


#timeline .timeline-item:not(.story-open) .story-copy,
#timeline .timeline-item:not(.story-open) .tl-people,
#timeline .timeline-item:not(.story-open) .tl-photo,
#timeline .timeline-item:not(.story-open) .tl-photo-cluster,
#timeline .timeline-item:not(.story-open) .tl-photo-stack,
#timeline .timeline-item:not(.story-open) .tl-photo-grid {
  display: none !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
  opacity: 0 !important;
}
#timeline .timeline-item.story-open .story-copy {
  display: block !important;
  padding: 18px 26px !important;
}
#timeline .timeline-item.story-open .tl-people { display:block !important; }


#living-memories .living-memories-inner {
  max-width: 1460px !important;
}
#living-memories .lm-intro-ribbon {
  max-width: 1180px;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 22px;
}
.lm-experience-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.55fr) minmax(340px, .78fr);
  gap: clamp(22px, 2.4vw, 38px);
  align-items: start;
  max-width: 1400px;
  margin: 0 auto;
}
.lm-primary-column,
.lm-memory-browser { min-width: 0; }
.lm-primary-column .lm-cinema {
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 14px 14px 18px;
  border-radius: 24px;
}
.lm-primary-column .lm-frame {
  padding: 12px;
  border-radius: 17px;
}
.lm-primary-column .lm-stage {
  min-height: clamp(330px, 42vw, 610px);
}
.lm-primary-column .lm-video {
  min-height: clamp(330px, 42vw, 610px);
  max-height: 610px;
}


.lm-primary-column .lm-video-console {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 10px !important;
  max-width: 760px !important;
  margin: 0 auto !important;
  padding: 14px 4px 2px !important;
}
.lm-primary-column .lm-playback-controls,
.lm-primary-column .lm-zoom-controls,
.lm-primary-column .lm-view-controls {
  display: grid !important;
  align-items: center;
  justify-content: stretch;
  gap: 10px;
}
.lm-primary-column .lm-playback-controls { grid-template-columns: repeat(3, minmax(0,1fr)); }
.lm-primary-column .lm-zoom-controls { grid-template-columns: minmax(0,1fr) auto minmax(0,1fr); }
.lm-primary-column .lm-view-controls { grid-template-columns: repeat(2, minmax(0,1fr)); }
.lm-primary-column .lm-control-btn {
  width: 100%;
  min-width: 0 !important;
  min-height: 44px;
  padding-inline: 13px;
  white-space: nowrap;
}
.lm-primary-column .lm-zoom-readout {
  min-width: 82px;
  min-height: 44px;
}
.lm-primary-column .lm-video-status {
  grid-column: 1 !important;
  padding-top: 2px;
}
.lm-primary-column .lm-caption {
  padding: 15px 12px 2px;
}
.lm-primary-column .lm-actions {
  display: grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap: 10px;
  max-width: 520px;
  margin: 16px auto 0;
}
.lm-primary-column .lm-actions .btn { width:100%; justify-content:center; }


.lm-memory-browser {
  position: relative;
  padding: 8px 0 8px 22px;
  border-left: 1px solid rgba(134,78,20,.34);
}
.lm-memory-browser::before {
  content:"";
  display:block;
  width:100%;
  height:5px;
  margin: 0 0 15px;
  border-radius:99px;
  background: linear-gradient(90deg, rgba(111,55,11,.82), #d7ad37 58%, rgba(15,107,98,.72));
  opacity:.7;
}
.lm-memory-browser .lm-reel-heading {
  display: block;
  max-width: none;
  margin: 0 0 12px;
  text-align: left;
}
.lm-memory-browser .lm-reel-heading > span { display:none; }
.lm-memory-browser .lm-reel-heading h4 {
  text-align:left;
  font-size: 24px;
  color: var(--heading-strong);
}
.lm-memory-browser .lm-reel-heading h4 small {
  text-align:left;
  margin-top:4px;
}
.lm-memory-browser .lm-reel {
  display: flex !important;
  flex-direction: column !important;
  gap: 14px;
  width: 100%;
  max-width: none !important;
  height: min(720px, 72vh);
  margin: 0;
  padding: 0 12px 8px 0;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  scroll-snap-type: y proximity;
  scrollbar-width: thin;
  scrollbar-color: rgba(139,91,25,.62) rgba(139,91,25,.10);
}
.lm-memory-browser .lm-reel::-webkit-scrollbar { width: 9px; height:0; }
.lm-memory-browser .lm-reel::-webkit-scrollbar-track { background: rgba(139,91,25,.08); border-radius:99px; }
.lm-memory-browser .lm-reel::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, #c79a28, #8c5c1b);
  border-radius:99px;
  border:2px solid rgba(255,249,229,.72);
}
.lm-memory-browser .lm-memory-card {
  flex: 0 0 auto !important;
  width: 100%;
  min-width: 0 !important;
  display: grid;
  grid-template-columns: minmax(150px, 1.5fr) minmax(120px, .72fr);
  gap: 12px;
  align-items: center;
  padding: 8px;
  border-radius: 15px;
  scroll-snap-align: start;
}
.lm-memory-browser .lm-thumb {
  width: 100%;
  aspect-ratio: 16/9;
  border-radius: 10px;
}
.lm-memory-browser .lm-card-copy {
  padding: 4px 5px 4px 0;
  align-self:center;
}
.lm-memory-browser .lm-card-copy strong {
  white-space: normal;
  overflow: visible;
  text-overflow: clip;
  font-size: 16px;
  line-height:1.22;
}
.lm-memory-browser .lm-card-copy small {
  font-size: 12px;
  line-height:1.3;
}
#living-memories .lm-footnote {
  max-width: 1040px;
  margin-top: 22px;
}


.lm-cinema.is-theatre .lm-video-console,
.lm-cinema.is-fullscreen-mode .lm-video-console,
.lm-cinema.is-fullscreen-fallback .lm-video-console,
.lm-cinema:fullscreen .lm-video-console {
  max-width: 900px !important;
}

@media (max-width: 1080px) {
  .lm-experience-layout { grid-template-columns: 1fr; max-width: 980px; }
  .lm-memory-browser {
    padding: 18px 0 0;
    border-left: 0;
    border-top: 1px solid rgba(134,78,20,.28);
  }
  .lm-memory-browser .lm-reel {
    flex-direction: row !important;
    height: auto;
    max-height: none;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    scroll-snap-type: x mandatory;
    padding: 2px 2px 14px;
  }
  .lm-memory-browser .lm-memory-card {
    flex: 0 0 min(72vw, 330px) !important;
    display: block;
  }
  .lm-memory-browser .lm-card-copy { padding: 9px 5px 4px; }
}
@media (max-width: 650px) {
  #timeline .timeline { padding-left: 34px; }
  .tl-marker { left:-34px; }
  .lm-primary-column .lm-stage,
  .lm-primary-column .lm-video { min-height: 230px; }
  .lm-primary-column .lm-playback-controls,
  .lm-primary-column .lm-view-controls { grid-template-columns: 1fr; }
  .lm-primary-column .lm-zoom-controls { grid-template-columns: 1fr auto 1fr; }
  .lm-primary-column .lm-control-btn { min-height: 42px; font-size: 14px; }
  .lm-primary-column .lm-actions { grid-template-columns: 1fr; }
}
@media (prefers-reduced-motion: reduce) {
  .section-heading .eyebrow::after,
  .sacred-content .eyebrow::after { animation:none !important; opacity:.78; }
}



.guided-step.is-done {
  border-color: rgba(76, 122, 53, .40) !important;
  background: linear-gradient(180deg, #f7fbef, #e7f2d8) !important;
  color: #365d28 !important;
  box-shadow: inset 0 0 0 1px rgba(94,133,61,.08), 0 7px 18px rgba(71,100,46,.07);
}
.guided-step.is-done span {
  background: linear-gradient(180deg, #6f9f4b, #46762f) !important;
  color: #fffef7 !important;
  box-shadow: 0 0 0 3px rgba(92,133,62,.12), 0 5px 13px rgba(54,91,38,.16);
}
.guided-step.is-done em { color:#365d28 !important; }




.preview-state--selected { overflow:hidden; }
.preview-selected-experience {
  display:flex; align-items:center; gap:12px;
  padding:14px 16px; margin:8px 0 12px;
  border:1px solid rgba(202,151,52,.30); border-radius:18px;
  background:linear-gradient(180deg,rgba(255,253,246,.96),rgba(247,238,217,.86));
}
.preview-selected-icon {
  width:38px; height:38px; flex:0 0 38px; display:grid; place-items:center;
  border-radius:50%; color:#9b681d; background:#f4e4b7;
  box-shadow:inset 0 0 0 1px rgba(185,132,42,.25);
}
.preview-selected-experience small { display:block; color:#8a6b39; text-transform:uppercase; letter-spacing:.08em; font-size:.67rem; font-weight:800; }
.preview-selected-experience strong { display:block; margin-top:2px; color:#5d3511; font-size:1.03rem; }
.preview-selection-summary {
  display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; margin:0 0 12px;
}
.preview-selection-summary span {
  display:flex; flex-direction:column; gap:2px; min-width:0;
  padding:10px 12px; border-radius:13px; border:1px solid rgba(190,140,48,.20); background:rgba(255,252,244,.72); color:#59452a;
}
.preview-selection-summary b { color:#7b4d16; font-size:.7rem; text-transform:uppercase; letter-spacing:.05em; }
.preview-state--selected blockquote.is-empty { opacity:.66; }
.admin-review-callout--optional { border-style:dashed !important; }


.tribute-media .tracker-line em { min-width:62px; text-align:right; }


#living-memories .section-heading { margin-bottom:20px; }


.lm-primary-column .lm-playback-controls--top {
  display:grid !important;
  grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  gap:12px !important;
  max-width:520px;
  margin:0 auto 14px !important;
  padding:2px 4px 0;
}
.lm-symbol-btn {
  display:grid !important;
  place-items:center !important;
  min-width:0 !important;
  line-height:1 !important;
  font-family:var(--font-sans) !important;
}
.lm-playback-controls--top .lm-symbol-btn {
  min-height:48px !important;
  font-size:1.28rem !important;
}


.lm-primary-column .lm-video-console--symbols {
  display:block !important;
  max-width:680px !important;
  margin:0 auto !important;
  padding:14px 4px 2px !important;
}
.lm-lower-controls {
  display:grid;
  grid-template-columns:minmax(0,1.2fr) minmax(150px,.8fr);
  gap:12px;
  align-items:center;
}
.lm-lower-controls .lm-zoom-controls {
  display:grid !important;
  grid-template-columns:minmax(0,1fr) auto minmax(0,1fr) !important;
  gap:10px !important;
}
.lm-lower-controls .lm-view-controls {
  display:grid !important;
  grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  gap:10px !important;
}
.lm-lower-controls .lm-symbol-btn {
  min-height:46px !important;
  padding:8px 12px !important;
  font-size:1.36rem !important;
  border-radius:999px !important;
}
.lm-lower-controls .lm-zoom-readout {
  min-width:84px !important;
  font-size:1rem !important;
}
.lm-lower-controls button[aria-pressed="true"] {
  box-shadow:0 0 0 3px rgba(15,107,98,.14), 0 12px 24px rgba(90,55,12,.15) !important;
}
.lm-primary-column .lm-video-status {
  margin:10px 0 0 !important;
  text-align:center !important;
  font-size:.74rem !important;
  letter-spacing:.10em;
}

@media (max-width:760px) {
  .preview-selection-summary { grid-template-columns:1fr; }
  .lm-primary-column .lm-playback-controls--top { max-width:100%; gap:8px !important; }
  .lm-lower-controls { grid-template-columns:1fr; }
  .lm-lower-controls .lm-view-controls { max-width:260px; width:100%; margin:0 auto; }
}


.wisdom-spotlight {
  max-width:1100px;
  margin:0 auto 18px;
  padding:18px 20px;
  display:grid;
  grid-template-columns:auto 1fr auto;
  align-items:center;
  gap:18px;
  border-radius:26px;
  border:1px solid rgba(212,160,58,.38);
  background:linear-gradient(110deg,rgba(255,254,248,.98),rgba(249,239,215,.96));
  box-shadow:0 18px 42px rgba(67,40,6,.09);
  overflow:hidden;
}
.wisdom-spotlight::after {
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(115deg,transparent 18%,rgba(255,221,125,.20) 46%,transparent 68%);
  transform:translateX(-120%);
  animation:wisdomSweep 8s ease-in-out infinite;
}
@keyframes wisdomSweep { 0%,72%{transform:translateX(-120%)} 88%,100%{transform:translateX(120%)} }
.wisdom-spotlight-icon {
  width:62px;height:62px;border-radius:50%;display:grid;place-items:center;
  color:#946219;font:700 2rem/1 var(--font-display);
  background:radial-gradient(circle at 32% 26%,#fffef8,#efd99a);
  border:1px solid rgba(183,133,45,.38);
  box-shadow:0 10px 25px rgba(74,43,5,.10), inset 0 0 0 4px rgba(255,255,255,.35);
  z-index:1;
}
.wisdom-spotlight-copy { min-width:0; z-index:1; }
.wisdom-spotlight-copy h4 { margin:0 0 4px; color:#5b3018; font-size:clamp(1.15rem,1.6vw,1.45rem); }
.wisdom-spotlight-copy blockquote { margin:0; color:#5a482d; font:600 1rem/1.55 var(--font-serif); }
.wisdom-spotlight-copy .experience-author { margin:4px 0 0; }
.wisdom-spotlight .wisdom-cycle-btn { z-index:1; min-width:170px; }


.shared-experience-panel { display:none !important; }

.embedded-experience-picker {
  margin:0 0 18px;
  padding:18px;
  border-radius:24px;
  border:1px solid rgba(212,160,58,.34);
  background:linear-gradient(180deg,rgba(255,253,247,.96),rgba(248,239,219,.93));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.75),0 14px 32px rgba(67,40,6,.07);
}
.embedded-experience-head {
  display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin-bottom:13px;
}
.embedded-experience-head h4 { margin:0 0 3px;color:#4c2913;font-size:clamp(1.18rem,1.55vw,1.42rem); }
.embedded-experience-head p:last-child { margin:0;color:#715b3a;line-height:1.45; }
.embedded-choice-note {
  flex:0 0 auto;border-radius:999px;padding:7px 11px;border:1px solid rgba(183,133,45,.3);
  background:#fff8e7;color:#77501a;font-size:.72rem;font-weight:800;white-space:nowrap;
}
.experience-carousel--embedded {
  display:grid !important;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:12px;
  overflow:visible !important;
  padding:2px !important;
  scrollbar-width:none;
}
.experience-carousel--embedded::-webkit-scrollbar { display:none; }
.experience-carousel--embedded .experience-card {
  width:auto !important;
  min-height:220px;
  flex:none;
  padding:16px 14px 13px;
  border-radius:19px;
}
.experience-carousel--embedded .experience-icon { width:46px;height:46px;font-size:1.3rem; }
.experience-carousel--embedded .experience-card h5 { font-size:.96rem; }
.experience-carousel--embedded .experience-card p { font-size:.87rem; line-height:1.5; }
.experience-carousel--embedded .experience-card.is-active {
  box-shadow:0 0 0 2px rgba(15,107,98,.14),0 18px 34px rgba(76,48,9,.13);
}


.lm-archive-progress {
  display:grid;
  grid-template-columns:1fr auto;
  align-items:center;
  gap:10px;
  width:100%;
  max-width:none;
  margin:0 0 14px;
  padding:3px 2px 2px 0;
}
.lm-memory-browser .lm-archive-progress {
  position:relative;
  z-index:2;
}
.lm-memory-browser .lm-archive-progress-track {
  height:7px;
  background:rgba(145,96,28,.13);
  box-shadow:inset 0 1px 2px rgba(73,43,8,.14),0 0 0 1px rgba(189,137,43,.08);
}
.lm-archive-progress-track {
  position:relative;
  height:6px;
  border-radius:999px;
  background:rgba(145,96,28,.15);
  box-shadow:inset 0 1px 2px rgba(73,43,8,.14);
  overflow:visible;
}
#livingMemoryBrowseProgress {
  position:absolute;left:0;top:0;bottom:0;width:0;
  border-radius:inherit;
  background:linear-gradient(90deg,#b57b1d,#e5bb4a 58%,#2f8d82);
  box-shadow:0 0 10px rgba(219,169,54,.26);
  transition:width .16s linear;
}
#livingMemoryBrowseMarker {
  position:absolute;top:50%;left:0;width:15px;height:15px;border-radius:50%;
  transform:translate(-50%,-50%);
  background:#fff8dc;border:3px solid #b47a1d;
  box-shadow:0 3px 10px rgba(70,40,5,.22),0 0 0 3px rgba(220,180,76,.14);
  transition:left .16s linear;
}
#livingMemoryBrowseLabel {
  min-width:42px;text-align:right;color:#6c4717;font-weight:800;font-size:.75rem;letter-spacing:.05em;
}


.lm-primary-column .lm-video-console--symbols { max-width:100% !important; padding-top:13px !important; }
.lm-lower-controls--view-only { display:flex !important; justify-content:center !important; align-items:center !important; }
.lm-view-controls--centered {
  display:grid !important;
  grid-template-columns:repeat(2,minmax(90px,1fr)) !important;
  gap:12px !important;
  width:min(100%,330px) !important;
  margin:0 auto !important;
}
.lm-view-controls--centered .lm-symbol-btn {
  min-height:48px !important;
  width:100% !important;
  font-size:1.4rem !important;
  padding:8px 14px !important;
  border-radius:999px !important;
}
.lm-primary-column .lm-playback-controls--top { margin-top:2px !important; }


.lm-memory-browser::before { display:none !important; }

@media (max-width:980px) {
  .experience-carousel--embedded { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .experience-carousel--embedded .experience-card { min-height:205px; }
}
@media (max-width:650px) {
  .wisdom-spotlight { grid-template-columns:auto 1fr; padding:16px; }
  .wisdom-spotlight .wisdom-cycle-btn { grid-column:1/-1;width:100%; }
  .embedded-experience-head { align-items:flex-start;flex-direction:column; }
  .experience-carousel--embedded {
    display:flex !important;
    gap:12px;
    overflow-x:auto !important;
    scroll-snap-type:x mandatory;
    padding:2px 2px 12px !important;
    scrollbar-width:thin;
    scrollbar-color:#c28b2d rgba(236,220,180,.5);
  }
  .experience-carousel--embedded .experience-card { flex:0 0 82% !important;scroll-snap-align:start; }
  .lm-archive-progress { padding-inline:2px; }
}
@media (prefers-reduced-motion:reduce) {
  .wisdom-spotlight::after { animation:none !important; }
  #livingMemoryBrowseProgress,#livingMemoryBrowseMarker { transition:none !important; }
}


.lm-memory-browser .lm-archive-progress--memory-list {
  margin-bottom:12px;
}
.lm-memory-browser #livingMemoryBrowseLabel {
  min-width:38px;
  color:#7a531c;
  font-size:.72rem;
}
@media (max-width:1080px) {
  .lm-memory-browser .lm-archive-progress--memory-list {
    padding-right:2px;
    margin-bottom:11px;
  }
}



@media (min-width:1081px) {
  .lm-experience-layout {
    grid-template-columns: minmax(0, 1fr) 400px !important;
    gap: clamp(24px, 2.2vw, 34px) !important;
    max-width: 1420px !important;
  }
  .lm-memory-browser {
    width: 400px;
    max-width: 400px;
    padding-left: 20px;
  }
  .lm-memory-browser .lm-reel-heading--with-position {
    display: flex !important;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
    margin: 0 0 10px !important;
  }
  .lm-memory-browser .lm-reel-heading--with-position h4 {
    flex: 1 1 auto;
    min-width: 0;
  }
  .lm-memory-browser .lm-list-position {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 58px;
    min-height: 28px;
    margin-top: 1px;
    padding: 5px 9px;
    border: 1px solid rgba(183,133,45,.34);
    border-radius: 999px;
    background: rgba(255,249,232,.88);
    color: #714915;
    font: 800 .72rem/1 var(--font-body);
    letter-spacing: .02em;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.78), 0 5px 13px rgba(73,43,8,.06);
    white-space: nowrap;
  }
  .lm-memory-browser .lm-archive-progress--memory-list {
    grid-template-columns: 1fr !important;
    margin: 0 0 12px !important;
    padding: 0 2px 0 0 !important;
  }
  .lm-memory-browser .lm-reel {
    height: 620px !important;
    max-height: 620px !important;
    gap: 12px !important;
    padding: 0 8px 8px 0 !important;
  }
  .lm-memory-browser .lm-memory-card {
    box-sizing: border-box;
    height: 128px !important;
    min-height: 128px !important;
    max-height: 128px !important;
    grid-template-columns: minmax(0, 3fr) minmax(0, 2fr) !important;
    gap: 10px !important;
    padding: 8px !important;
    align-items: stretch !important;
  }
  .lm-memory-browser .lm-thumb {
    width: 100% !important;
    height: 112px !important;
    aspect-ratio: auto !important;
    align-self: stretch;
  }
  .lm-memory-browser .lm-card-copy {
    min-width: 0;
    padding: 5px 4px 5px 0 !important;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-self: stretch !important;
  }
  .lm-memory-browser .lm-card-copy strong {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden !important;
    font-size: 15.5px !important;
    line-height: 1.22 !important;
  }
  .lm-memory-browser .lm-card-copy small {
    margin-top: 5px;
    font-size: 12px !important;
    line-height: 1.25 !important;
  }
}

@media (max-width:1080px) {
  .lm-memory-browser .lm-reel-heading--with-position {
    display: flex !important;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
  }
  .lm-memory-browser .lm-list-position {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 56px;
    padding: 5px 9px;
    border: 1px solid rgba(183,133,45,.3);
    border-radius: 999px;
    background: rgba(255,249,232,.84);
    color: #714915;
    font-weight: 800;
    font-size: .72rem;
    white-space: nowrap;
  }
  .lm-memory-browser .lm-archive-progress--memory-list {
    grid-template-columns: 1fr !important;
  }
}


@media (max-width: 650px) {
  .lm-memory-browser {
    overflow: hidden;
    padding-top: 16px;
  }

  .lm-memory-browser .lm-reel-heading--with-position {
    margin-bottom: 9px !important;
    padding-inline: 2px;
    align-items: center;
  }

  .lm-memory-browser .lm-reel-heading--with-position h4 {
    font-size: clamp(20px, 6vw, 23px) !important;
    line-height: 1.15;
  }

  .lm-memory-browser .lm-list-position {
    min-width: 54px;
    min-height: 27px;
    padding: 5px 8px;
    font-size: .7rem;
  }

  
  .lm-memory-browser .lm-archive-progress--memory-list {
    display: grid !important;
    grid-template-columns: 1fr !important;
    width: 100%;
    margin: 0 0 11px !important;
    padding: 0 4px 0 2px !important;
  }

  .lm-memory-browser .lm-archive-progress-track {
    height: 6px;
  }

  #livingMemoryBrowseMarker {
    width: 14px;
    height: 14px;
  }

  .lm-memory-browser .lm-reel {
    display: flex !important;
    flex-direction: row !important;
    gap: 12px !important;
    width: 100%;
    height: auto !important;
    max-height: none !important;
    margin: 0;
    padding: 2px 12px 14px 2px !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    scroll-snap-type: x mandatory !important;
    scroll-padding-inline: 2px 12px;
    overscroll-behavior-inline: contain;
    -webkit-overflow-scrolling: touch;
  }

  .lm-memory-browser .lm-memory-card {
    flex: 0 0 min(82vw, 420px) !important;
    width: min(82vw, 420px) !important;
    min-width: min(82vw, 420px) !important;
    max-width: min(82vw, 420px) !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 0 !important;
    padding: 7px !important;
    border-radius: 17px !important;
    scroll-snap-align: start !important;
    scroll-snap-stop: always;
  }

  
  .lm-memory-browser .lm-thumb {
    order: 1;
    width: 100% !important;
    height: auto !important;
    aspect-ratio: 16 / 9 !important;
    border-radius: 12px !important;
  }

  .lm-memory-browser .lm-card-copy {
    order: 2;
    width: 100%;
    padding: 10px 7px 7px !important;
    align-self: stretch !important;
  }

  .lm-memory-browser .lm-card-copy strong {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden !important;
    white-space: normal !important;
    font-size: 14px !important;
    line-height: 1.25 !important;
  }

  .lm-memory-browser .lm-card-copy small {
    margin-top: 4px;
    font-size: 11px !important;
    line-height: 1.3 !important;
  }

  
  .lm-memory-browser .lm-reel::after {
    content: "";
    flex: 0 0 3vw;
    min-width: 3vw;
  }
}


@media (max-width: 430px) {
  .lm-memory-browser .lm-memory-card {
    flex-basis: 82vw !important;
    width: 82vw !important;
    min-width: 82vw !important;
    max-width: 82vw !important;
  }
}



#guest-tribute .embedded-experience-picker {
  margin-bottom: 18px !important;
  border-color: rgba(194,139,45,.32);
  background:
    radial-gradient(circle at 8% 0%, rgba(224,177,67,.10), transparent 26%),
    linear-gradient(145deg, rgba(255,254,248,.97), rgba(250,242,222,.91));
  box-shadow: 0 16px 38px rgba(75,47,9,.08), inset 0 1px 0 rgba(255,255,255,.82);
}
#guest-tribute .experience-carousel--embedded .experience-card {
  position: relative;
  isolation: isolate;
}
#guest-tribute .experience-carousel--embedded .experience-card.is-active {
  border-color: rgba(15,107,98,.62) !important;
  box-shadow:
    0 0 0 2px rgba(15,107,98,.11),
    0 16px 32px rgba(74,46,9,.12),
    inset 0 1px 0 rgba(255,255,255,.80) !important;
}
#guest-tribute .experience-carousel--embedded .experience-card.is-active::after {
  content: "✓";
  position: absolute;
  top: 10px;
  right: 10px;
  z-index: 3;
  display: grid;
  place-items: center;
  width: 25px;
  height: 25px;
  border-radius: 50%;
  background: linear-gradient(145deg,#2f8d82,#176b62);
  color: #fffdf2;
  font: 900 14px/1 var(--font-sans);
  box-shadow: 0 5px 13px rgba(15,107,98,.22), 0 0 0 3px rgba(255,250,231,.72);
}
#guest-tribute .dedication-strip {
  margin-top: 0 !important;
}


.lm-memory-browser .lm-archive-progress--memory-list {
  width: calc(100% - 8px) !important;
  margin: 0 8px 4px 0 !important;
  padding: 0 !important;
  position: relative;
  z-index: 4;
}
.lm-memory-browser .lm-archive-progress--memory-list .lm-archive-progress-track {
  height: 6px !important;
  box-shadow: inset 0 1px 2px rgba(73,43,8,.16), 0 2px 8px rgba(132,87,24,.08);
}
@media (min-width:1081px) {
  .lm-memory-browser .lm-reel {
    padding-top: 4px !important;
  }
}
@media (max-width:1080px) {
  .lm-memory-browser .lm-archive-progress--memory-list {
    width: calc(100% - 4px) !important;
    margin-right: 4px !important;
    margin-bottom: 7px !important;
  }
}
@media (prefers-reduced-motion:reduce) {
  #guest-tribute .experience-carousel--embedded .experience-card.is-active::after { box-shadow:none; }
}



#guest-tribute .tribute-form--guided {
  --journey-burgundy: var(--heading, #5c2d0a);
  --journey-gold: var(--gold, #d4a03a);
  --journey-teal: var(--teal, #1a6b6f);
  --journey-paper: rgba(255,253,246,.94);
}
#guest-tribute .guided-progress-shell {
  position:relative;
  margin:0 0 22px;
  padding:14px 16px 16px;
  border:1px solid rgba(196,136,15,.30);
  border-radius:22px;
  background:
    radial-gradient(circle at 8% 0%, rgba(212,160,58,.11), transparent 25%),
    linear-gradient(180deg, rgba(255,253,246,.98), rgba(250,243,226,.92));
  box-shadow:0 12px 28px rgba(58,32,6,.07), inset 0 1px 0 rgba(255,255,255,.85);
  overflow:hidden;
}
#guest-tribute .guided-progress-shell::after {
  content:"";
  position:absolute;
  inset:auto 18px 0;
  height:2px;
  background:linear-gradient(90deg, transparent, rgba(212,160,58,.62), var(--journey-teal), rgba(212,160,58,.62), transparent);
  opacity:.66;
}
#guest-tribute .guided-progress-title {
  display:flex;
  align-items:baseline;
  justify-content:space-between;
  gap:14px;
  margin:0 2px 11px;
}
#guest-tribute .guided-progress-title > span {
  color:var(--journey-burgundy);
  font-family:var(--font-serif);
  font-size:.92rem;
  font-weight:800;
  letter-spacing:.08em;
  text-transform:uppercase;
}
#guest-tribute .guided-progress-title small {
  color:#826741;
  font-size:.72rem;
  font-weight:650;
}
#guest-tribute .guided-progress {
  position:relative;
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:10px;
  margin:0;
  isolation:isolate;
}
#guest-tribute .guided-progress::before {
  content:"";
  position:absolute;
  z-index:-1;
  left:5.5%; right:5.5%; top:50%;
  height:2px;
  transform:translateY(-50%);
  background:linear-gradient(90deg, rgba(212,160,58,.35), rgba(26,107,111,.42), rgba(212,160,58,.35));
}
#guest-tribute .guided-step {
  min-height:54px;
  padding:8px 10px;
  gap:8px;
  border:1px solid rgba(196,136,15,.30);
  border-radius:17px;
  background:rgba(255,253,246,.97);
  color:#6f522e;
  box-shadow:0 5px 14px rgba(56,33,9,.045);
  transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease, background .2s ease;
}
#guest-tribute .guided-step:hover { transform:translateY(-1px); box-shadow:0 9px 19px rgba(56,33,9,.075); }
#guest-tribute .guided-step span,
#guest-tribute .journey-stage-number {
  width:30px;
  height:30px;
  flex:0 0 30px;
  display:inline-grid;
  place-items:center;
  border-radius:50%;
  border:1px solid rgba(170,107,15,.42);
  background:radial-gradient(circle at 33% 25%, #fffaf0 0 22%, #f0cf7c 54%, #d7a335 100%);
  color:#5c3510;
  font-weight:850;
  font-family:var(--font-sans);
  line-height:1;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.9), 0 3px 8px rgba(94,59,10,.12);
}
#guest-tribute .guided-step em {
  color:#6b4b23;
  font-size:.74rem;
  font-style:normal;
  font-weight:800;
  line-height:1.18;
}
#guest-tribute .guided-step.is-current {
  border-color:rgba(26,107,111,.54) !important;
  background:linear-gradient(180deg,#fffef9,#eef7f3) !important;
  box-shadow:inset 0 0 0 1px rgba(26,107,111,.08), 0 8px 19px rgba(26,107,111,.08);
}
#guest-tribute .guided-step.is-current span {
  border-color:rgba(26,107,111,.55);
  box-shadow:0 0 0 3px rgba(26,107,111,.10), 0 3px 8px rgba(94,59,10,.12);
}


#guest-tribute .journey-stage { position:relative; }
#guest-tribute .journey-stage-kicker {
  display:flex;
  align-items:center;
  gap:9px;
  margin:0 0 8px;
  color:var(--journey-burgundy);
  font-size:.77rem;
  font-weight:850;
  letter-spacing:.105em;
  text-transform:uppercase;
}
#guest-tribute .embedded-experience-head .journey-stage-kicker { margin-bottom:9px; }
#guest-tribute .guided-fieldset legend {
  display:inline-flex;
  align-items:center;
  gap:7px;
  color:var(--journey-burgundy);
  letter-spacing:.015em;
}
#guest-tribute .guided-fieldset legend .journey-stage-number { margin-right:1px; }
#guest-tribute .journey-stage--details {
  margin-top:18px;
  padding-top:0;
}
#guest-tribute .journey-stage-heading {
  display:grid;
  grid-template-columns:auto 1fr;
  align-items:center;
  gap:12px 16px;
  margin:0 0 14px;
  padding:13px 15px;
  border:1px solid rgba(196,136,15,.27);
  border-left:4px solid var(--journey-teal);
  border-radius:17px;
  background:linear-gradient(90deg,rgba(255,250,236,.95),rgba(255,253,246,.78));
  box-shadow:0 7px 16px rgba(60,35,8,.045);
}
#guest-tribute .journey-stage-heading .journey-stage-kicker { margin:0; white-space:nowrap; }
#guest-tribute .journey-stage-heading h4 { margin:0; color:var(--journey-burgundy); font-size:.98rem; }
#guest-tribute .journey-stage-heading > div:last-child p { margin:3px 0 0; color:#776044; font-size:.78rem; line-height:1.4; }

#guest-tribute .preview-stage-title .journey-stage-kicker { margin-bottom:5px; }
#guest-tribute .preview-stage-title h4 { margin-left:39px; color:var(--journey-burgundy); }
#guest-tribute .preview-state--selected {
  border-top:3px solid rgba(26,107,111,.72);
  box-shadow:0 14px 28px rgba(60,35,8,.07);
}

#guest-tribute .journey-stage--submit {
  margin-top:18px;
  padding:16px 18px 14px;
  border:1px solid rgba(196,136,15,.28);
  border-radius:20px;
  background:linear-gradient(180deg,rgba(255,253,246,.97),rgba(247,235,204,.78));
  box-shadow:0 12px 24px rgba(58,34,8,.07), inset 0 1px 0 rgba(255,255,255,.82);
}
#guest-tribute .submit-stage-heading {
  width:100%;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:14px;
  flex-wrap:wrap;
}
#guest-tribute .submit-stage-heading .journey-stage-kicker { margin:0; }
#guest-tribute .submit-stage-note { margin:0; color:#7a6344; font-size:.76rem; }
#guest-tribute .journey-stage--submit #tributeSubmitBtn { margin-top:4px; min-width:min(100%,250px); }


#guest-tribute [data-stage-panel].is-done-stage > .journey-stage-heading,
#guest-tribute fieldset[data-stage-panel].is-done-stage,
#guest-tribute .embedded-experience-picker.is-done-stage,
#guest-tribute .preview-state.is-done-stage,
#guest-tribute .journey-stage--submit.is-done-stage {
  border-color:rgba(76,122,53,.34) !important;
}
#guest-tribute [data-stage-panel].is-current-stage .journey-stage-number {
  border-color:rgba(26,107,111,.62);
  box-shadow:0 0 0 4px rgba(26,107,111,.10), 0 3px 8px rgba(94,59,10,.12);
}

@media (max-width:900px) {
  #guest-tribute .guided-progress { gap:7px; }
  #guest-tribute .guided-step { min-height:50px; padding:7px 8px; }
  #guest-tribute .guided-step span { width:27px; height:27px; flex-basis:27px; }
  #guest-tribute .guided-step em { font-size:.68rem; }
  #guest-tribute .guided-progress-title small { display:none; }
}
@media (max-width:720px) {
  #guest-tribute .guided-progress-shell { padding:12px 12px 14px; }
  #guest-tribute .guided-progress {
    display:grid;
    grid-auto-flow:column;
    grid-auto-columns:minmax(158px,43vw);
    grid-template-columns:none;
    overflow-x:auto;
    overscroll-behavior-inline:contain;
    scroll-snap-type:x mandatory;
    scrollbar-width:thin;
    padding:2px 2px 8px;
  }
  #guest-tribute .guided-progress::before { display:none; }
  #guest-tribute .guided-step { scroll-snap-align:start; }
  #guest-tribute .journey-stage-heading { grid-template-columns:1fr; gap:7px; }
  #guest-tribute .journey-stage-heading .journey-stage-kicker { white-space:normal; }
  #guest-tribute .preview-stage-title h4 { margin-left:0; }
  #guest-tribute .submit-stage-heading { align-items:flex-start; flex-direction:column; }
}
@media (max-width:430px) {
  #guest-tribute .guided-progress-title > span { font-size:.82rem; }
  #guest-tribute .guided-progress { grid-auto-columns:minmax(150px,72vw); }
  #guest-tribute .journey-stage-number { width:28px; height:28px; flex-basis:28px; }
  #guest-tribute .journey-stage--submit { padding:14px 12px 12px; }
}



#guest-tribute {
  --journey-stage-inset: 16px;
  --journey-stage-radius: 22px;
  --journey-stage-border: rgba(190, 129, 28, .34);
  --journey-stage-surface: linear-gradient(180deg, rgba(255,253,247,.985), rgba(248,239,218,.92));
}


#guest-tribute .guided-progress {
  align-items: stretch;
}
#guest-tribute .guided-step {
  display:flex;
  align-items:center;
  justify-content:flex-start;
  min-width:0;
  min-height:56px;
  padding:9px 10px !important;
  gap:9px !important;
  text-align:left;
  box-sizing:border-box;
}
#guest-tribute .guided-step span {
  width:30px !important;
  height:30px !important;
  flex:0 0 30px !important;
  font-family:var(--font-sans) !important;
  font-size:.78rem !important;
  font-style:normal !important;
  font-weight:850 !important;
  color:#5c3510 !important;
}
#guest-tribute .guided-step em {
  min-width:0;
  margin:0;
  font-family:var(--font-sans) !important;
  font-size:.72rem !important;
  font-style:normal !important;
  font-weight:800 !important;
  line-height:1.2 !important;
  color:#6b4b23 !important;
  letter-spacing:0 !important;
}


#guest-tribute .tribute-form--guided > [data-stage-panel] {
  width:100% !important;
  max-width:none !important;
  box-sizing:border-box !important;
  margin:0 0 18px !important;
  padding:var(--journey-stage-inset) !important;
  border:1px solid var(--journey-stage-border) !important;
  border-radius:var(--journey-stage-radius) !important;
  background:
    radial-gradient(circle at 8% 0%, rgba(214,160,54,.075), transparent 26%),
    var(--journey-stage-surface) !important;
  box-shadow:
    0 11px 24px rgba(60,35,8,.055),
    inset 0 1px 0 rgba(255,255,255,.86) !important;
  overflow:hidden;
}


#guest-tribute .journey-stage-bar {
  width:100%;
  min-height:44px;
  box-sizing:border-box;
  display:flex;
  align-items:center;
  justify-content:flex-start;
  gap:10px;
  margin:0 0 13px;
  padding:6px 10px;
  border:1px solid rgba(190,129,28,.24);
  border-left:3px solid rgba(26,107,111,.72);
  border-radius:14px;
  background:
    linear-gradient(90deg, rgba(255,249,232,.96), rgba(255,253,247,.82));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.82);
  text-align:left;
}
#guest-tribute .journey-stage-bar .journey-stage-number {
  width:30px !important;
  height:30px !important;
  flex:0 0 30px !important;
  margin:0 !important;
  display:inline-grid !important;
  place-items:center !important;
  font-family:var(--font-sans) !important;
  font-size:.78rem !important;
  font-style:normal !important;
  font-weight:850 !important;
  line-height:1 !important;
  color:#5c3510 !important;
}
#guest-tribute .journey-stage-bar-title {
  margin:0 !important;
  padding:0 !important;
  font-family:var(--font-sans) !important;
  font-size:.78rem !important;
  font-style:normal !important;
  font-weight:850 !important;
  line-height:1.2 !important;
  letter-spacing:.095em !important;
  text-transform:uppercase;
  color:var(--journey-burgundy) !important;
}
#guest-tribute .journey-stage-optional {
  margin-left:auto;
  padding:4px 8px;
  border:1px solid rgba(183,133,45,.28);
  border-radius:999px;
  background:rgba(255,250,237,.82);
  color:#80633b;
  font-family:var(--font-sans);
  font-size:.66rem;
  font-weight:750;
  letter-spacing:.025em;
  text-transform:none;
}


#guest-tribute .embedded-experience-head {
  margin:0 0 13px !important;
  padding:0 2px;
}
#guest-tribute .embedded-experience-head h4 {
  margin:0 0 4px !important;
}
#guest-tribute .embedded-experience-head p {
  margin:0 !important;
}


#guest-tribute .guided-fieldset > legend.sr-only {
  position:absolute !important;
  width:1px !important;
  height:1px !important;
  padding:0 !important;
  margin:-1px !important;
  overflow:hidden !important;
  clip:rect(0,0,0,0) !important;
  white-space:nowrap !important;
  border:0 !important;
}
#guest-tribute .dedication-options {
  width:100%;
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:flex-start;
  gap:10px;
}
#guest-tribute .dedication-strip {
  display:block !important;
}


#guest-tribute .journey-stage--details {
  margin-top:0 !important;
}
#guest-tribute .journey-stage-intro {
  margin:0 2px 14px;
  padding:0;
  text-align:left;
}
#guest-tribute .journey-stage-intro h4 {
  margin:0 0 3px;
  color:var(--journey-burgundy);
  font-size:.98rem;
}
#guest-tribute .journey-stage-intro p {
  margin:0;
  color:#776044;
  font-size:.78rem;
  line-height:1.4;
}


#guest-tribute .preview-state--selected {
  border-top:1px solid var(--journey-stage-border) !important;
}
#guest-tribute .preview-head-row {
  margin:0 2px 10px;
  align-items:center;
}
#guest-tribute .preview-stage-title h4 {
  margin:0 !important;
  color:var(--journey-burgundy);
  font-size:.98rem;
}


#guest-tribute .journey-stage--submit {
  display:flex !important;
  flex-direction:column !important;
  align-items:center !important;
  gap:8px !important;
  text-align:center;
}
#guest-tribute .journey-stage--submit .journey-stage-bar {
  align-self:stretch;
}
#guest-tribute .submit-stage-note {
  width:100%;
  margin:0 0 2px !important;
  color:#7a6344;
  font-size:.76rem;
  text-align:left;
}
#guest-tribute .journey-stage--submit #tributeSubmitBtn {
  margin-top:3px;
  min-width:min(100%,250px);
}


#guest-tribute [data-stage-panel].is-current-stage .journey-stage-bar {
  border-left-color:rgba(26,107,111,.88);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.86),
    0 0 0 2px rgba(26,107,111,.055);
}
#guest-tribute [data-stage-panel].is-done-stage .journey-stage-bar {
  border-left-color:rgba(76,122,53,.76);
}
#guest-tribute [data-stage-panel].is-done-stage .journey-stage-number {
  border-color:rgba(76,122,53,.46) !important;
}


#guest-tribute #charCount {
  display:none !important;
}

@media (max-width:720px) {
  #guest-tribute {
    --journey-stage-inset: 13px;
  }
  #guest-tribute .journey-stage-bar {
    min-height:42px;
    margin-bottom:11px;
    padding:5px 8px;
  }
  #guest-tribute .journey-stage-bar-title {
    font-size:.74rem !important;
    letter-spacing:.075em !important;
  }
  #guest-tribute .dedication-options {
    gap:8px;
  }
  #guest-tribute .preview-head-row {
    align-items:flex-start;
    flex-direction:column;
    gap:8px;
  }
  #guest-tribute .submit-stage-note {
    text-align:left;
  }
}
@media (max-width:430px) {
  #guest-tribute .guided-step span,
  #guest-tribute .journey-stage-bar .journey-stage-number {
    width:28px !important;
    height:28px !important;
    flex-basis:28px !important;
  }
  #guest-tribute .guided-step {
    min-height:52px;
  }
  #guest-tribute .journey-stage-optional {
    padding:3px 6px;
    font-size:.62rem;
  }
}





#guest-tribute .wisdom-spotlight,
#guest-tribute .tribute-form--guided {
  width:min(100%, 1200px) !important;
  max-width:1200px !important;
  margin-left:auto !important;
  margin-right:auto !important;
}


#guest-tribute .guided-step {
  display:grid !important;
  grid-template-columns:30px minmax(0,1fr) !important;
  grid-template-rows:auto auto !important;
  column-gap:9px !important;
  row-gap:3px !important;
  align-content:center !important;
  align-items:center !important;
  min-height:64px !important;
}
#guest-tribute .guided-step > span {
  grid-column:1;
  grid-row:1 / span 2;
  align-self:center;
}
#guest-tribute .guided-step > em {
  grid-column:2;
  grid-row:1;
  align-self:end;
}
#guest-tribute .guided-step-requirement {
  grid-column:2;
  grid-row:2;
  justify-self:start;
  margin:0;
  padding:2px 7px;
  border-radius:999px;
  font-family:var(--font-sans);
  font-size:.57rem;
  font-style:normal;
  font-weight:850;
  line-height:1.25;
  letter-spacing:.045em;
  text-transform:uppercase;
  white-space:nowrap;
}
#guest-tribute .guided-step-requirement.is-mandatory,
#guest-tribute .journey-stage-requirement.is-mandatory {
  color:#6d351e;
  border:1px solid rgba(139,62,34,.27);
  background:linear-gradient(180deg,rgba(255,248,230,.98),rgba(244,218,165,.84));
}
#guest-tribute .guided-step-requirement.is-optional,
#guest-tribute .journey-stage-requirement.is-optional {
  color:#6a6544;
  border:1px solid rgba(43,112,105,.24);
  background:linear-gradient(180deg,rgba(249,253,247,.98),rgba(224,239,226,.84));
}


#guest-tribute .tribute-form--guided > [data-stage-panel]::before {
  content:"" !important;
  position:absolute !important;
  top:0 !important;
  left:26px !important;
  right:26px !important;
  bottom:auto !important;
  width:auto !important;
  height:3px !important;
  border-radius:0 0 3px 3px !important;
  background:linear-gradient(90deg,var(--journey-burgundy),var(--journey-gold),var(--journey-teal)) !important;
  opacity:.92 !important;
  pointer-events:none !important;
  z-index:8 !important;
}


#guest-tribute .journey-stage-requirement {
  margin-left:auto;
  flex:0 0 auto;
  padding:4px 9px;
  border-radius:999px;
  font-family:var(--font-sans);
  font-size:.65rem;
  font-style:normal;
  font-weight:850;
  line-height:1.2;
  letter-spacing:.035em;
  text-transform:uppercase;
  white-space:nowrap;
}
#guest-tribute .journey-stage-optional { display:none !important; }


#guest-tribute [data-stage-panel="1"] .journey-stage-bar,
#guest-tribute [data-stage-panel="4"] .journey-stage-bar,
#guest-tribute [data-stage-panel="5"] .journey-stage-bar {
  background:linear-gradient(90deg,rgba(255,248,230,.97),rgba(255,253,247,.86)) !important;
}
#guest-tribute [data-stage-panel="2"] .journey-stage-bar,
#guest-tribute [data-stage-panel="3"] .journey-stage-bar {
  background:linear-gradient(90deg,rgba(246,252,247,.97),rgba(255,253,247,.86)) !important;
}


#guest-tribute .experience-carousel--embedded[aria-required="true"] {
  outline:none;
}
#guest-tribute .experience-card[aria-checked="true"] {
  border-color:rgba(26,107,111,.64) !important;
  box-shadow:0 0 0 2px rgba(26,107,111,.10),0 18px 34px rgba(76,48,9,.12) !important;
}


#livingMemoryBrowseProgress,
#livingMemoryBrowseMarker {
  transition:none !important;
  animation:none !important;
  will-change:width,left;
}

@media (max-width:900px) {
  #guest-tribute .guided-step {
    grid-template-columns:27px minmax(0,1fr) !important;
    min-height:61px !important;
  }
  #guest-tribute .guided-step-requirement { font-size:.54rem; padding:2px 6px; }
}
@media (max-width:720px) {
  #guest-tribute .wisdom-spotlight,
  #guest-tribute .tribute-form--guided { width:100% !important; }
  #guest-tribute .journey-stage-requirement { font-size:.61rem; padding:3px 7px; }
}
@media (max-width:430px) {
  #guest-tribute .guided-step {
    grid-template-columns:28px minmax(0,1fr) !important;
    min-height:60px !important;
  }
  #guest-tribute .journey-stage-bar {
    gap:8px !important;
  }
  #guest-tribute .journey-stage-requirement {
    font-size:.57rem;
    padding:3px 6px;
  }
}


#thanks .thanks-content {
  width: min(100%, 1120px);
  margin-inline: auto;
  padding-inline: clamp(18px, 4vw, 58px);
}

#thanks .thanks-title-wrap {
  position: relative;
  width: fit-content;
  max-width: 100%;
  margin: 4px auto clamp(22px, 3vw, 34px);
  display: flex;
  align-items: center;
  justify-content: center;
  gap: clamp(10px, 1.4vw, 18px);
  isolation: isolate;
}

#thanks .thanks-title {
  position: relative;
  margin: 0 !important;
  padding: 0 clamp(4px, .5vw, 8px);
  color: #711f2b !important;
  font-family: var(--font-display, var(--font-serif));
  font-size: clamp(34px, 4.25vw, 64px) !important;
  font-weight: 700;
  letter-spacing: .12em;
  line-height: 1.05;
  white-space: nowrap !important;
  text-shadow:
    0 1px 0 rgba(255,255,255,.95),
    0 6px 20px rgba(93,38,30,.10),
    0 0 20px rgba(210,162,29,.08);
  overflow: hidden;
}

#thanks .thanks-title::before {
  content: "";
  position: absolute;
  inset: -16% -10%;
  pointer-events: none;
  background: linear-gradient(105deg, transparent 30%, rgba(255,244,173,0) 42%, rgba(255,235,140,.95) 50%, rgba(255,244,173,0) 58%, transparent 70%);
  transform: translateX(-125%) skewX(-14deg);
  mix-blend-mode: screen;
  animation: thanksTitleSweep 4.8s cubic-bezier(.4,0,.2,1) infinite;
}

#thanks .thanks-title::after {
  content: "";
  display: block;
  width: min(220px, 72%);
  height: 3px;
  margin: 14px auto 0;
  border-radius: 999px;
  background: linear-gradient(90deg, transparent, #8f541c 10%, #d6a935 42%, #efd574 52%, #2f716e 90%, transparent);
  box-shadow: 0 0 14px rgba(214,169,53,.25);
}

#thanks .thanks-title-spark {
  position: relative;
  z-index: 2;
  color: #d7a72f;
  font-size: clamp(13px, 1.25vw, 19px);
  text-shadow: 0 0 7px rgba(244,206,99,.8), 0 0 16px rgba(194,127,30,.38);
  animation: thanksTitleTwinkle 2.4s ease-in-out infinite;
}
#thanks .thanks-title-spark--right { animation-delay: -1.2s; }

#thanks .thanks-message-card {
  position: relative;
  width: min(100%, 920px);
  margin: 0 auto clamp(28px, 4vw, 42px);
  padding: clamp(26px, 4vw, 46px) clamp(22px, 5vw, 62px);
  border: 1px solid rgba(190,133,39,.34);
  border-radius: clamp(24px, 3vw, 36px);
  background:
    radial-gradient(circle at 50% 0%, rgba(255,246,190,.34), transparent 38%),
    linear-gradient(145deg, rgba(255,253,244,.94), rgba(249,239,213,.88));
  box-shadow:
    0 24px 54px rgba(86,55,18,.10),
    inset 0 1px 0 rgba(255,255,255,.92),
    inset 0 0 28px rgba(229,189,87,.07);
  overflow: hidden;
  isolation: isolate;
}

#thanks .thanks-message-card::before {
  content: "";
  position: absolute;
  inset: 7px;
  z-index: -1;
  border-radius: inherit;
  border: 1px solid transparent;
  background:
    linear-gradient(#fffaf0,#fffaf0) padding-box,
    linear-gradient(110deg,#6f242b,#d6a935 30%,#f2d779 50%,#2f716e 72%,#8a4c27) border-box;
  opacity: .46;
  pointer-events: none;
  background-size: 100% 100%, 240% 100%;
  animation: thanksBorderDrift 7s linear infinite;
}

#thanks .thanks-message-card::after {
  content: "";
  position: absolute;
  inset: -50% -25%;
  z-index: -2;
  pointer-events: none;
  background: radial-gradient(ellipse at center, rgba(245,213,121,.18), transparent 56%);
  animation: thanksAuraBreathe 4.6s ease-in-out infinite;
}

#thanks .thanks-message {
  position: relative;
  z-index: 2;
  max-width: 43em;
  margin-inline: auto;
  color: #5f4526;
  text-align: center;
  text-wrap: balance;
  font-family: var(--font-serif);
  font-size: clamp(18px, 1.45vw, 23px);
  line-height: 1.72;
  letter-spacing: .008em;
  text-shadow: 0 1px 0 rgba(255,255,255,.82);
}

#thanks .thanks-message--first {
  margin-top: 0;
  margin-bottom: 0;
  color: #613827;
  font-weight: 600;
}

#thanks .thanks-message--second {
  margin-top: 0;
  margin-bottom: 0;
  color: #6d5432;
  font-style: italic;
}

#thanks .thanks-light-divider {
  width: min(360px, 72%);
  margin: clamp(20px, 2.8vw, 30px) auto;
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: 12px;
}
#thanks .thanks-light-divider > span {
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(191,128,35,.68), rgba(47,113,110,.48));
}
#thanks .thanks-light-divider > span:last-child {
  transform: scaleX(-1);
}
#thanks .thanks-light-divider i {
  width: 31px;
  height: 31px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  border: 1px solid rgba(198,139,41,.42);
  background: radial-gradient(circle at 35% 30%, #fffdf2, #ead294 74%, #c58d31);
  box-shadow: 0 0 0 5px rgba(222,184,81,.08), 0 0 16px rgba(206,154,51,.26);
  color: #7a3a25;
  animation: thanksChakraFloat 4.2s ease-in-out infinite;
}
#thanks .thanks-light-divider svg { width: 18px; height: 18px; fill: currentColor; }

#thanks .thanks-spark {
  position: absolute;
  z-index: 3;
  pointer-events: none;
  color: #d3a132;
  line-height: 1;
  text-shadow: 0 0 7px rgba(255,224,128,.95), 0 0 18px rgba(188,126,29,.46);
  animation: thanksSparkle 3.1s ease-in-out infinite;
}
#thanks .thanks-spark--1 { top: 12%; left: 6%; font-size: 17px; }
#thanks .thanks-spark--2 { top: 23%; right: 8%; font-size: 20px; animation-delay: -.8s; color:#2f716e; }
#thanks .thanks-spark--3 { bottom: 18%; left: 9%; font-size: 18px; animation-delay: -1.6s; }
#thanks .thanks-spark--4 { bottom: 12%; right: 7%; font-size: 14px; animation-delay: -2.3s; }

#thanks .thanks-actions {
  position: relative;
  z-index: 2;
  gap: clamp(12px, 2vw, 20px);
}
#thanks .thanks-actions::before {
  content: "";
  position: absolute;
  left: 50%;
  top: -18px;
  width: min(260px, 70vw);
  height: 1px;
  transform: translateX(-50%);
  background: linear-gradient(90deg, transparent, rgba(199,147,43,.45), transparent);
}

@keyframes thanksTitleSweep {
  0%, 58% { transform: translateX(-125%) skewX(-14deg); opacity: 0; }
  64% { opacity: .8; }
  78% { opacity: .9; }
  88%, 100% { transform: translateX(125%) skewX(-14deg); opacity: 0; }
}
@keyframes thanksTitleTwinkle {
  0%,100% { opacity:.38; transform:scale(.82) rotate(0deg); }
  45% { opacity:1; transform:scale(1.18) rotate(16deg); }
  68% { opacity:.68; transform:scale(.96) rotate(24deg); }
}
@keyframes thanksBorderDrift {
  from { background-position: 0 0, 0 0; }
  to { background-position: 0 0, 240% 0; }
}
@keyframes thanksAuraBreathe {
  0%,100% { opacity:.48; transform:scale(.96); }
  50% { opacity:.88; transform:scale(1.04); }
}
@keyframes thanksChakraFloat {
  0%,100% { transform:translateY(0) rotate(0deg); }
  50% { transform:translateY(-3px) rotate(18deg); }
}
@keyframes thanksSparkle {
  0%,100% { opacity:.18; transform:translateY(2px) scale(.7) rotate(0deg); }
  42% { opacity:1; transform:translateY(-3px) scale(1.18) rotate(22deg); }
  70% { opacity:.52; transform:translateY(-1px) scale(.9) rotate(35deg); }
}

@media (max-width: 700px) {
  #thanks .thanks-content { padding-inline: 14px; }
  #thanks .thanks-title-wrap { gap: 8px; margin-bottom: 20px; }
  #thanks .thanks-title { font-size: clamp(30px, 9vw, 42px) !important; letter-spacing: .09em; }
  #thanks .thanks-title-spark { font-size: 12px; }
  #thanks .thanks-message-card {
    padding: 24px 18px 26px;
    border-radius: 24px;
  }
  #thanks .thanks-message { font-size: clamp(16.5px, 4.6vw, 20px); line-height: 1.65; }
  #thanks .thanks-light-divider { width: min(290px, 86%); gap: 9px; }
  #thanks .thanks-actions { flex-wrap: wrap; }
  #thanks .thanks-actions .btn { min-width: min(220px, 82vw); justify-content: center; }
  #thanks .thanks-spark--1 { left: 3%; }
  #thanks .thanks-spark--2 { right: 4%; }
  #thanks .thanks-spark--3 { left: 4%; }
  #thanks .thanks-spark--4 { right: 3%; }
}

@media (prefers-reduced-motion: reduce) {
  #thanks .thanks-title::before,
  #thanks .thanks-title-spark,
  #thanks .thanks-message-card::before,
  #thanks .thanks-message-card::after,
  #thanks .thanks-light-divider i,
  #thanks .thanks-spark {
    animation: none !important;
  }
}



#thanks {
  --thanks-burgundy:#711f2b;
  --thanks-gold:#d6a935;
  --thanks-pale-gold:#f0d77b;
  --thanks-teal:#2f716e;
}

#thanks .thanks-ambient {
  position:absolute;
  inset:0;
  z-index:1;
  overflow:hidden;
  pointer-events:none;
  contain:paint;
}
#thanks .thanks-aurora {
  position:absolute;
  left:50%;
  top:50%;
  width:min(92vw,1120px);
  aspect-ratio:1.8/1;
  border-radius:50%;
  opacity:.24;
  filter:blur(2px);
  transform:translate(-50%,-50%) rotate(-7deg) scale(.94);
  background:
    radial-gradient(ellipse at 40% 50%, rgba(240,215,123,.34), transparent 55%),
    conic-gradient(from 210deg at 50% 50%, transparent 0 24%, rgba(113,31,43,.10) 31%, rgba(214,169,53,.21) 40%, rgba(47,113,110,.13) 51%, transparent 61% 100%);
  animation:thanksAuroraDrift 10s ease-in-out infinite alternate;
}
#thanks .thanks-aurora--two {
  width:min(72vw,860px);
  opacity:.16;
  transform:translate(-50%,-50%) rotate(12deg) scale(.9);
  animation-duration:13s;
  animation-direction:alternate-reverse;
}

#thanks .thanks-orbit {
  position:absolute;
  left:50%;
  top:50%;
  width:min(76vw,900px);
  aspect-ratio:2.15/1;
  border:1px solid rgba(214,169,53,.13);
  border-radius:50%;
  transform:translate(-50%,-50%) rotate(-8deg);
  box-shadow:0 0 24px rgba(214,169,53,.05), inset 0 0 20px rgba(47,113,110,.03);
  animation:thanksOrbitTurn 28s linear infinite;
}
#thanks .thanks-orbit::before,
#thanks .thanks-orbit::after {
  content:"";
  position:absolute;
  width:7px;
  height:7px;
  border-radius:50%;
  background:radial-gradient(circle,#fff7c8 0 22%,#d6a935 40%,rgba(214,169,53,0) 72%);
  box-shadow:0 0 9px rgba(232,192,76,.75),0 0 18px rgba(232,192,76,.32);
}
#thanks .thanks-orbit::before { left:8%; top:20%; }
#thanks .thanks-orbit::after { right:10%; bottom:17%; background:radial-gradient(circle,#e7fffb 0 22%,#2f716e 42%,rgba(47,113,110,0) 72%); }
#thanks .thanks-orbit--two {
  width:min(62vw,720px);
  border-color:rgba(47,113,110,.10);
  animation-duration:36s;
  animation-direction:reverse;
}

#thanks .thanks-firefly {
  position:absolute;
  width:6px;
  height:6px;
  border-radius:50%;
  opacity:0;
  background:#f5d878;
  box-shadow:0 0 7px rgba(245,216,120,.92),0 0 16px rgba(213,159,45,.36);
  animation:thanksFirefly 6.6s ease-in-out infinite;
}
#thanks .thanks-firefly--1{left:12%;top:27%;animation-delay:-.4s}
#thanks .thanks-firefly--2{left:24%;top:72%;animation-delay:-2.1s;animation-duration:7.4s}
#thanks .thanks-firefly--3{left:39%;top:18%;animation-delay:-3.8s;animation-duration:5.8s}
#thanks .thanks-firefly--4{left:58%;top:80%;animation-delay:-1.3s;background:#7eb9b4;box-shadow:0 0 8px rgba(126,185,180,.85),0 0 18px rgba(47,113,110,.34)}
#thanks .thanks-firefly--5{right:27%;top:22%;animation-delay:-4.7s;animation-duration:7.1s}
#thanks .thanks-firefly--6{right:14%;top:63%;animation-delay:-2.9s}
#thanks .thanks-firefly--7{right:7%;top:35%;animation-delay:-5.4s;animation-duration:8s;background:#7eb9b4;box-shadow:0 0 8px rgba(126,185,180,.85),0 0 18px rgba(47,113,110,.34)}
#thanks .thanks-firefly--8{left:8%;top:56%;animation-delay:-6.1s;animation-duration:7.7s}

#thanks .section-nav-emblem[data-nav-emblem="thanks"] {
  position:relative;
  overflow:visible;
  animation:thanksHeartFloat 4.4s ease-in-out infinite !important;
  filter:drop-shadow(0 0 7px rgba(214,169,53,.32));
}
#thanks .section-nav-emblem[data-nav-emblem="thanks"]::before,
#thanks .section-nav-emblem[data-nav-emblem="thanks"]::after {
  content:"";
  position:absolute;
  inset:-8px;
  border:1px solid rgba(214,169,53,.38);
  border-radius:50%;
  opacity:0;
  animation:thanksEmblemPulse 3.6s ease-out infinite;
  pointer-events:none;
}
#thanks .section-nav-emblem[data-nav-emblem="thanks"]::after {
  animation-delay:1.8s;
  border-color:rgba(47,113,110,.30);
}

#thanks .thanks-title-halo {
  position:absolute;
  left:50%;
  top:50%;
  z-index:-1;
  width:132%;
  height:190%;
  border-radius:50%;
  transform:translate(-50%,-50%) scale(.92);
  background:radial-gradient(ellipse,rgba(242,215,121,.24) 0,rgba(214,169,53,.09) 38%,transparent 72%);
  animation:thanksTitleHalo 4.8s ease-in-out infinite;
  pointer-events:none;
}

#thanks.in-view .thanks-title-wrap {
  animation:thanksTitleArrive .9s cubic-bezier(.2,.72,.2,1) both;
}
#thanks.in-view .thanks-message-card {
  animation:thanksCardArrive 1s .16s cubic-bezier(.2,.72,.2,1) both;
}
#thanks.in-view .thanks-message--first {
  animation:thanksWordsArrive .9s .34s ease-out both;
}
#thanks.in-view .thanks-light-divider {
  animation:thanksDividerArrive .85s .52s ease-out both;
}
#thanks.in-view .thanks-message--second {
  animation:thanksWordsArrive .9s .68s ease-out both;
}
#thanks.in-view .thanks-actions {
  animation:thanksActionsArrive .85s .82s ease-out both;
}

#thanks .thanks-message-card {
  transform-style:preserve-3d;
}
#thanks .thanks-card-glowline {
  position:absolute;
  inset:0;
  z-index:1;
  border-radius:inherit;
  pointer-events:none;
  overflow:hidden;
}
#thanks .thanks-card-glowline::before {
  content:"";
  position:absolute;
  left:-42%;
  top:-2px;
  width:42%;
  height:2px;
  border-radius:999px;
  background:linear-gradient(90deg,transparent,#f2d779 42%,#fff6c8 62%,#2f716e 100%);
  box-shadow:0 0 10px rgba(240,215,121,.64);
  animation:thanksCardComet 5.4s ease-in-out infinite;
}
#thanks .thanks-card-corner {
  position:absolute;
  z-index:1;
  width:42px;
  height:42px;
  opacity:.56;
  pointer-events:none;
}
#thanks .thanks-card-corner::before,
#thanks .thanks-card-corner::after {
  content:"";
  position:absolute;
  background:linear-gradient(90deg,#a96628,#e2bd55,#2f716e);
  border-radius:999px;
  transform-origin:center;
  animation:thanksCornerGlint 3.8s ease-in-out infinite;
}
#thanks .thanks-card-corner::before { width:32px;height:1px; }
#thanks .thanks-card-corner::after { width:1px;height:32px; }
#thanks .thanks-card-corner--tl { left:16px;top:16px; }
#thanks .thanks-card-corner--tl::before,#thanks .thanks-card-corner--tl::after { left:0;top:0; }
#thanks .thanks-card-corner--br { right:16px;bottom:16px; transform:rotate(180deg); }
#thanks .thanks-card-corner--br::before,#thanks .thanks-card-corner--br::after { left:0;top:0; animation-delay:-1.9s; }

#thanks .thanks-light-divider i::before,
#thanks .thanks-light-divider i::after {
  content:"";
  position:absolute;
  inset:-1px;
  border-radius:50%;
  border:1px solid rgba(214,169,53,.34);
  opacity:0;
  animation:thanksChakraRipple 3.5s ease-out infinite;
}
#thanks .thanks-light-divider i { position:relative; }
#thanks .thanks-light-divider i::after { animation-delay:1.75s;border-color:rgba(47,113,110,.30); }

#thanks .thanks-actions .btn {
  position:relative;
  overflow:hidden;
  isolation:isolate;
}
#thanks .thanks-actions .btn::after {
  content:"";
  position:absolute;
  top:-70%;
  bottom:-70%;
  left:-54%;
  width:30%;
  transform:skewX(-19deg);
  background:linear-gradient(90deg,transparent,rgba(255,249,205,.60),transparent);
  opacity:0;
  pointer-events:none;
}
#thanks .thanks-actions .btn:hover::after,
#thanks .thanks-actions .btn:focus-visible::after {
  animation:thanksButtonGleam .72s ease-out;
}

#thanks .thanks-pointer-spark {
  position:absolute;
  z-index:8;
  width:6px;
  height:6px;
  margin:-3px 0 0 -3px;
  border-radius:50%;
  pointer-events:none;
  background:radial-gradient(circle,#fff9d1 0 18%,#e4b64d 36%,rgba(228,182,77,0) 72%);
  box-shadow:0 0 8px rgba(238,203,104,.70);
  animation:thanksPointerSpark .72s ease-out forwards;
}

@keyframes thanksAuroraDrift {
  0%{transform:translate(-50%,-50%) rotate(-8deg) scale(.92);opacity:.15}
  50%{transform:translate(-49%,-51%) rotate(1deg) scale(1.03);opacity:.27}
  100%{transform:translate(-51%,-49%) rotate(8deg) scale(.97);opacity:.19}
}
@keyframes thanksOrbitTurn { to{transform:translate(-50%,-50%) rotate(352deg)} }
@keyframes thanksFirefly {
  0%,100%{opacity:0;transform:translate3d(0,8px,0) scale(.6)}
  22%{opacity:.72}
  48%{opacity:1;transform:translate3d(9px,-10px,0) scale(1.08)}
  74%{opacity:.34;transform:translate3d(-4px,-19px,0) scale(.78)}
}
@keyframes thanksHeartFloat {
  0%,100%{transform:translateY(0) scale(1);filter:drop-shadow(0 0 5px rgba(214,169,53,.25))}
  50%{transform:translateY(-3px) scale(1.035);filter:drop-shadow(0 0 12px rgba(214,169,53,.52))}
}
@keyframes thanksEmblemPulse {
  0%{opacity:.45;transform:scale(.72)}
  70%,100%{opacity:0;transform:scale(1.65)}
}
@keyframes thanksTitleHalo {
  0%,100%{opacity:.42;transform:translate(-50%,-50%) scale(.91)}
  50%{opacity:.86;transform:translate(-50%,-50%) scale(1.06)}
}
@keyframes thanksTitleArrive { from{opacity:0;transform:translateY(12px) scale(.985)} to{opacity:1;transform:none} }
@keyframes thanksCardArrive { from{opacity:0;transform:translateY(18px) scale(.988)} to{opacity:1;transform:none} }
@keyframes thanksWordsArrive { from{opacity:0;transform:translateY(9px);filter:blur(2px)} to{opacity:1;transform:none;filter:none} }
@keyframes thanksDividerArrive { from{opacity:0;transform:scaleX(.55)} to{opacity:1;transform:scaleX(1)} }
@keyframes thanksActionsArrive { from{opacity:0;transform:translateY(8px)} to{opacity:1;transform:none} }
@keyframes thanksCardComet {
  0%,58%{left:-42%;opacity:0}
  66%{opacity:1}
  86%{left:101%;opacity:.92}
  100%{left:101%;opacity:0}
}
@keyframes thanksCornerGlint {
  0%,100%{opacity:.28;filter:brightness(.9)}
  50%{opacity:.92;filter:brightness(1.22)}
}
@keyframes thanksChakraRipple {
  0%{opacity:.42;transform:scale(.78)}
  80%,100%{opacity:0;transform:scale(1.72)}
}
@keyframes thanksButtonGleam {
  0%{left:-54%;opacity:0}
  18%{opacity:.7}
  100%{left:126%;opacity:0}
}
@keyframes thanksPointerSpark {
  0%{opacity:1;transform:translate3d(0,0,0) scale(1)}
  100%{opacity:0;transform:translate3d(var(--spark-x,5px),var(--spark-y,-16px),0) scale(.18)}
}


@media (min-width:701px) and (max-width:1024px) {
  #thanks .thanks-content { width:min(100%,920px); padding-inline:clamp(24px,5vw,48px); }
  #thanks .thanks-title-wrap { margin-bottom:clamp(22px,3vw,30px); }
  #thanks .thanks-title { font-size:clamp(38px,5.8vw,54px) !important; }
  #thanks .thanks-message-card {
    width:min(100%,820px);
    padding:clamp(28px,4vw,38px) clamp(28px,5vw,48px);
    margin-bottom:32px;
  }
  #thanks .thanks-message { font-size:clamp(18px,2.2vw,21px); line-height:1.66; }
  #thanks .thanks-actions { gap:16px; }
  #thanks .thanks-actions .btn { min-width:190px; }
}


@media (max-width:700px) {
  #thanks { min-height:100svh; }
  #thanks .thanks-content { width:100%; padding-inline:clamp(10px,3.8vw,16px); }
  #thanks .section-nav-emblem[data-nav-emblem="thanks"] { margin-bottom:10px; }
  #thanks .thanks-title-wrap { margin-top:0; margin-bottom:18px; gap:7px; }
  #thanks .thanks-title-halo { width:118%;height:160%; }
  #thanks .thanks-title { font-size:clamp(28px,8.5vw,38px) !important; letter-spacing:.085em; }
  #thanks .thanks-title::after { margin-top:10px; height:2px; }
  #thanks .thanks-message-card {
    width:100%;
    padding:clamp(22px,6vw,28px) clamp(15px,4.8vw,20px) clamp(24px,6vw,30px);
    border-radius:clamp(20px,6vw,25px);
    margin-bottom:24px;
  }
  #thanks .thanks-message { font-size:clamp(16px,4.45vw,18.5px); line-height:1.58; letter-spacing:0; }
  #thanks .thanks-light-divider { margin:18px auto;width:min(260px,82%); }
  #thanks .thanks-light-divider i { width:29px;height:29px; }
  #thanks .thanks-actions { width:100%; gap:10px; }
  #thanks .thanks-actions .btn { width:min(280px,86vw); min-width:0; }
  #thanks .thanks-card-corner { width:34px;height:34px; }
  #thanks .thanks-card-corner::before { width:26px; }
  #thanks .thanks-card-corner::after { height:26px; }
  #thanks .thanks-orbit { width:118vw; }
  #thanks .thanks-orbit--two { width:92vw; }
  #thanks .thanks-firefly--2,#thanks .thanks-firefly--5,#thanks .thanks-firefly--7 { display:none; }
}
@media (max-width:380px) {
  #thanks .thanks-title-spark { display:none; }
  #thanks .thanks-title { font-size:clamp(27px,8.6vw,32px) !important;letter-spacing:.07em; }
  #thanks .thanks-message-card { padding-inline:14px; }
  #thanks .thanks-message { font-size:16px;line-height:1.54; }
}

@media (hover:none), (pointer:coarse) {
  #thanks .thanks-actions .btn::after { display:none; }
}

@media (prefers-reduced-motion: reduce) {
  #thanks .thanks-ambient,
  #thanks .section-nav-emblem[data-nav-emblem="thanks"],
  #thanks .section-nav-emblem[data-nav-emblem="thanks"]::before,
  #thanks .section-nav-emblem[data-nav-emblem="thanks"]::after,
  #thanks .thanks-title-halo,
  #thanks.in-view .thanks-title-wrap,
  #thanks.in-view .thanks-message-card,
  #thanks.in-view .thanks-message--first,
  #thanks.in-view .thanks-light-divider,
  #thanks.in-view .thanks-message--second,
  #thanks.in-view .thanks-actions,
  #thanks .thanks-card-glowline::before,
  #thanks .thanks-card-corner::before,
  #thanks .thanks-card-corner::after,
  #thanks .thanks-light-divider i::before,
  #thanks .thanks-light-divider i::after,
  #thanks .thanks-actions .btn::after,
  #thanks .thanks-pointer-spark {
    animation:none !important;
  }
  #thanks .thanks-pointer-spark { display:none !important; }
}




#guest-tribute [data-stage-panel="1"] .journey-stage-bar,
#guest-tribute [data-stage-panel="2"] .journey-stage-bar,
#guest-tribute [data-stage-panel="4"] .journey-stage-bar,
#guest-tribute [data-stage-panel="5"] .journey-stage-bar {
  background:linear-gradient(90deg,rgba(255,248,230,.97),rgba(255,253,247,.86)) !important;
}
#guest-tribute [data-stage-panel="3"] .journey-stage-bar {
  background:linear-gradient(90deg,rgba(246,252,247,.97),rgba(255,253,247,.86)) !important;
}


#guest-tribute .tribute-form--guided > [data-stage-panel]::before {
  content:"" !important;
  position:absolute !important;
  top:0 !important;
  right:26px !important;
  bottom:auto !important;
  left:26px !important;
  width:auto !important;
  height:3px !important;
  border:0 !important;
  border-radius:0 0 3px 3px !important;
  background:linear-gradient(90deg,var(--journey-burgundy),var(--journey-gold),var(--journey-teal)) !important;
  box-shadow:none !important;
  opacity:.92 !important;
  clip-path:none !important;
  animation:none !important;
  transform:none !important;
  will-change:auto !important;
  pointer-events:none !important;
  z-index:8 !important;
}


#guest-tribute .journey-stage--submit::before {
  border:0 !important;
  box-shadow:none !important;
  clip-path:none !important;
  animation:none !important;
}



#guest-tribute .tribute-form--guided > [data-stage-panel]::before {
  content:none !important;
  display:none !important;
}
#guest-tribute .tribute-form--guided > [data-stage-panel] > .journey-stage-crown-line {
  display:block !important;
  position:absolute !important;
  top:0 !important;
  left:26px !important;
  right:26px !important;
  width:auto !important;
  height:3px !important;
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
  border-radius:0 0 3px 3px !important;
  background:linear-gradient(90deg,var(--journey-burgundy),var(--journey-gold),var(--journey-teal)) !important;
  box-shadow:none !important;
  opacity:.92 !important;
  transform:none !important;
  pointer-events:none !important;
  z-index:20 !important;
}
#guest-tribute .journey-stage--submit > .journey-stage-crown-line {
  animation:none !important;
  clip-path:none !important;
}
@media (max-width:720px) {
  #guest-tribute .tribute-form--guided > [data-stage-panel] > .journey-stage-crown-line {
    left:18px !important;
    right:18px !important;
  }
}

/* ======================================================================
   v26 FINAL MOBILE LAYOUT SAFETY
   Keeps the Sacred Dedication content in document flow on phones/tablets
   so text can grow naturally without the action buttons ever overlapping it.
   Also adds conservative overflow/wrapping guards across all sections.
   Desktop layout is intentionally untouched.
   ====================================================================== */
@media (max-width: 760px) {
  /* General mobile safety guards for every website section. */
  html, body { max-width: 100%; overflow-x: clip; }
  main, .screen, .section-panel, .section-inner, .sacred-content,
  .section-heading, .card, .dossier-shell, .tribute-form, .admin-panel,
  .help-card, .thanks-message-card { min-width: 0; max-width: 100%; }

  .screen { padding-left: 16px; padding-right: 16px; }
  .section-heading :is(h1,h2,h3,p),
  .sacred-content :is(h1,h2,h3,p),
  .card :is(h1,h2,h3,h4,p),
  .help-card :is(h1,h2,h3,h4,p) {
    overflow-wrap: anywhere;
    word-break: normal;
  }

  .button-row {
    width: 100%;
    max-width: 100%;
    flex-wrap: wrap;
    align-items: stretch;
  }
  .button-row > :is(.btn, button, a[role="button"]) {
    min-width: 0;
    max-width: 100%;
  }

  /* Sacred Dedication: remove desktop absolute-positioning on mobile.
     This is the key overlap fix: heading -> dedication -> buttons now
     participate in normal flow and therefore can never collide. */
  #sacred.sacred-screen {
    display: grid !important;
    place-items: center !important;
    align-content: center !important;
    min-height: 100svh !important;
    height: auto !important;
    padding: clamp(44px, 8svh, 72px) 16px clamp(52px, 9svh, 82px) !important;
    overflow: hidden !important;
  }

  #sacred .sacred-content {
    position: relative !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    width: min(100%, 680px) !important;
    max-width: 680px !important;
    margin: 0 auto !important;
    gap: 0 !important;
  }

  #sacred .sacred-heading-stack {
    position: relative !important;
    inset: auto !important;
    top: auto !important;
    left: auto !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 auto !important;
    transform: none !important;
  }

  #sacred .sacred-heading-stack .section-nav-emblem {
    margin-bottom: 12px !important;
  }

  #sacred .sacred-heading-stack .eyebrow {
    margin: 0 auto 8px !important;
    font-size: clamp(15px, 4.3vw, 20px) !important;
    line-height: 1.2 !important;
    letter-spacing: .16em !important;
  }

  #sacred .sacred-heading-stack .heading-accent {
    margin: 0 auto !important;
    width: 100% !important;
    font-size: clamp(27px, 8.2vw, 42px) !important;
    line-height: 1.08 !important;
  }

  #sacred .dedication-plain {
    position: relative !important;
    inset: auto !important;
    top: auto !important;
    left: auto !important;
    width: min(100%, 620px) !important;
    max-width: 620px !important;
    margin: clamp(34px, 6.5svh, 58px) auto 0 !important;
    transform: none !important;
    padding: 0 2px !important;
    font-size: clamp(22px, 6.2vw, 31px) !important;
    line-height: 1.43 !important;
    text-align: center !important;
    text-align-last: center !important;
  }
  #sacred .dedication-plain br { display: none !important; }

  #sacred .sacred-close {
    position: relative !important;
    inset: auto !important;
    top: auto !important;
    left: auto !important;
    width: min(100%, 430px) !important;
    max-width: 430px !important;
    margin: clamp(30px, 5.5svh, 48px) auto 0 !important;
    transform: none !important;
    text-align: center !important;
  }

  #sacred .sacred-close .button-row {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 12px !important;
    width: 100% !important;
    margin: 0 auto !important;
  }
  #sacred .sacred-close .btn {
    width: 100% !important;
    min-height: 52px !important;
    padding: 12px 18px !important;
    white-space: normal !important;
    line-height: 1.2 !important;
  }
  #sacred .sacred-close .sec-rule--span {
    display: block !important;
    width: min(74%, 260px) !important;
    margin: 18px auto 0 !important;
  }

  /* Responsive media/form/table guards discovered in the final mobile audit. */
  img, video, canvas, svg { max-width: 100%; }
  input, select, textarea, button { max-width: 100%; }
  .table-wrap, .pub-table-wrap, .academic-table-wrap { max-width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }
}

@media (max-width: 430px) {
  #sacred.sacred-screen { padding-inline: 14px !important; }
  #sacred .dedication-plain {
    margin-top: 30px !important;
    font-size: clamp(21px, 6.4vw, 28px) !important;
    line-height: 1.4 !important;
  }
  #sacred .sacred-close { margin-top: 28px !important; }
}

/* ======================================================================
   v27 FINAL MOBILE WELCOME / THRESHOLD FIT
   Keeps the complete opening composition inside the visible mobile viewport,
   including browser-toolbar constrained heights. The names are deliberately
   two centred lines on phones, matching the disciplined alignment of the
   closing screen without changing the desktop composition.
   ====================================================================== */
#threshold .threshold-name-break { display:none; }
#threshold .threshold-name-separator { display:inline; }

@media (max-width:760px) {
  #threshold {
    box-sizing:border-box !important;
    width:100% !important;
    height:100dvh !important;
    min-height:100dvh !important;
    max-height:100dvh !important;
    padding:max(4px, env(safe-area-inset-top)) 0 max(4px, env(safe-area-inset-bottom)) !important;
    overflow:hidden !important;
  }

  #threshold .threshold-inner {
    box-sizing:border-box !important;
    display:flex !important;
    flex-direction:column !important;
    align-items:center !important;
    justify-content:center !important;
    width:100% !important;
    height:100% !important;
    max-height:100% !important;
    margin:0 auto !important;
    padding:6px 14px !important;
    transform:none !important;
    overflow:visible !important;
  }

  /* The old mobile rule only visually scaled the lamp while its 220px layout
     box remained full-size. Reducing the real box is what frees the missing
     vertical space without cropping the flame or moving the controls. */
  #threshold .diya-scene {
    flex:0 0 168px !important;
    width:220px !important;
    height:168px !important;
    margin:0 auto 1px !important;
    transform:scale(.80) !important;
    transform-origin:center bottom !important;
  }

  #threshold .threshold-welcome {
    flex:0 0 auto !important;
    margin:0 auto !important;
    font-size:clamp(27px,7.5vw,34px) !important;
    line-height:1 !important;
    letter-spacing:.075em !important;
  }
  #threshold .threshold-welcome::after {
    height:clamp(8px,2.5vw,12px) !important;
    margin-top:1px !important;
  }

  #threshold .threshold-line {
    flex:0 0 auto !important;
    width:min(94vw,38ch) !important;
    max-width:94vw !important;
    margin:4px auto 0 !important;
    padding:0 3px !important;
    font-size:clamp(15px,4vw,18px) !important;
    line-height:1.32 !important;
    white-space:normal !important;
    text-wrap:balance !important;
    overflow-wrap:normal !important;
  }
  #threshold .threshold-line br { display:none !important; }

  #threshold .t-fr7-top,
  #threshold .t-fr7-bot {
    flex:0 0 auto !important;
    max-width:90vw !important;
  }
  #threshold .t-fr7-top {
    height:clamp(12px,3.5vw,18px) !important;
    margin:4px auto 1px !important;
  }
  #threshold .t-fr7-bot {
    height:clamp(18px,5vw,26px) !important;
    margin:1px auto 0 !important;
  }

  #threshold .threshold-names {
    flex:0 0 auto !important;
    width:auto !important;
    max-width:94vw !important;
    margin:1px auto !important;
    padding:0 6px !important;
    font-size:clamp(14px,4vw,18px) !important;
    line-height:1.22 !important;
    letter-spacing:.035em !important;
    white-space:nowrap !important;
    text-wrap:nowrap !important;
    text-align:center !important;
    text-align-last:center !important;
  }
  #threshold .threshold-name-separator { display:none !important; }
  #threshold .threshold-name-break { display:block !important; }

  #threshold .threshold-title {
    flex:0 0 auto !important;
    width:min(92vw,18ch) !important;
    max-width:92vw !important;
    margin:3px auto 0 !important;
    font-size:clamp(25px,7vw,31px) !important;
    line-height:1.06 !important;
    letter-spacing:.025em !important;
    text-wrap:balance !important;
  }
  #threshold .t-title-orn {
    flex:0 0 auto !important;
    width:min(86vw,330px) !important;
    height:clamp(10px,3vw,14px) !important;
    margin:2px auto 0 !important;
  }

  #threshold .threshold-actions {
    flex:0 0 auto !important;
    display:flex !important;
    flex-direction:row !important;
    flex-wrap:nowrap !important;
    gap:10px !important;
    width:fit-content !important;
    max-width:94vw !important;
    margin:7px auto 0 !important;
    padding:6px !important;
  }
  #threshold .threshold-btn {
    min-width:0 !important;
    min-height:44px !important;
    padding:10px clamp(21px,6.5vw,29px) !important;
    font-size:clamp(13px,3.7vw,15px) !important;
    line-height:1.1 !important;
    white-space:nowrap !important;
  }
}

/* Short portrait viewports are common once Android/iOS browser chrome is
   visible. This tier compacts only the opening screen, never the website. */
@media (max-width:760px) and (max-height:650px) {
  #threshold .threshold-inner { padding:2px 12px !important; }
  #threshold .diya-scene {
    flex-basis:140px !important;
    width:205px !important;
    height:140px !important;
    transform:scale(.68) !important;
  }
  #threshold .threshold-welcome { font-size:clamp(25px,7vw,30px) !important; }
  #threshold .threshold-welcome::after { height:8px !important; }
  #threshold .threshold-line {
    margin-top:2px !important;
    font-size:clamp(13.8px,3.8vw,16px) !important;
    line-height:1.24 !important;
  }
  #threshold .t-fr7-top { height:10px !important; margin-top:2px !important; }
  #threshold .threshold-names {
    font-size:clamp(13px,3.7vw,16px) !important;
    line-height:1.16 !important;
  }
  #threshold .t-fr7-bot { height:14px !important; }
  #threshold .threshold-title {
    margin-top:2px !important;
    font-size:clamp(23px,6.5vw,28px) !important;
    line-height:1.02 !important;
  }
  #threshold .t-title-orn { height:9px !important; margin-top:1px !important; }
  #threshold .threshold-actions { margin-top:5px !important; padding:5px !important; gap:8px !important; }
  #threshold .threshold-btn { min-height:40px !important; padding:8px 20px !important; font-size:13px !important; }
}

@media (max-width:760px) and (max-height:560px) {
  #threshold .diya-scene {
    flex-basis:122px !important;
    width:195px !important;
    height:122px !important;
    transform:scale(.60) !important;
  }
  #threshold .threshold-welcome { font-size:24px !important; }
  #threshold .threshold-line { font-size:13px !important; line-height:1.18 !important; }
  #threshold .threshold-names { font-size:12.5px !important; line-height:1.12 !important; }
  #threshold .threshold-title { font-size:22px !important; }
  #threshold .threshold-actions { margin-top:4px !important; }
  #threshold .threshold-btn { min-height:38px !important; padding:7px 18px !important; }
}

/* Extremely shallow landscape devices remain usable rather than clipping the
   controls. Normal portrait phones never enter this fallback. */
@media (max-width:760px) and (max-height:460px) {
  #threshold { overflow-y:auto !important; overscroll-behavior:contain; }
  #threshold .threshold-inner {
    height:auto !important;
    min-height:100% !important;
    justify-content:flex-start !important;
    padding-block:6px 12px !important;
  }
}


/* ======================================================================
   FOUNDATIONAL LEGACY — HERITAGE COVERFLOW v29
   Converts only the eight existing highlight tiles into a cinematic,
   depth-rotated deck. The original content, foundation shell, reveal
   classes and all existing site animation systems remain untouched.
   ====================================================================== */
#foundation .foundation-coverflow {
  --cf-burgundy: var(--heading);
  --cf-copper: var(--copper);
  --cf-gold: var(--gold);
  --cf-teal: var(--teal);
  position: relative;
  margin-top: 30px;
  padding: 23px 8px 6px;
  isolation: isolate;
}
#foundation .foundation-coverflow::before {
  content: "";
  position: absolute;
  top: 0;
  left: clamp(16px, 7%, 72px);
  right: clamp(16px, 7%, 72px);
  height: 2px;
  border-radius: 999px;
  background: linear-gradient(90deg,
    transparent 0%, var(--cf-burgundy) 13%, var(--cf-gold) 48%,
    var(--cf-teal) 78%, transparent 100%);
  box-shadow: 0 0 14px rgba(212,160,58,.22);
  opacity: .9;
}
#foundation .foundation-coverflow::after {
  content: "◆";
  position: absolute;
  top: -10px;
  left: 50%;
  transform: translateX(-50%);
  color: var(--cf-gold);
  font-size: 14px;
  line-height: 1;
  text-shadow: 0 0 10px rgba(212,160,58,.38);
}
#foundation .foundation-coverflow-stage {
  position: relative;
  width: 100%;
  min-height: 336px;
  overflow: hidden;
  perspective: 1350px;
  perspective-origin: 50% 47%;
  touch-action: pan-y pinch-zoom;
  user-select: none;
  -webkit-user-select: none;
  outline: none;
}
#foundation .foundation-highlights {
  position: relative;
  display: block;
  width: 100%;
  height: 336px;
  margin: 0;
  transform-style: preserve-3d;
}
#foundation .foundation-highlights > span {
  --cf-x: 0px;
  --cf-z: 0px;
  --cf-ry: 0deg;
  --cf-scale: 1;
  --cf-opacity: 1;
  --cf-order: 20;
  position: absolute;
  top: 50%;
  left: 50%;
  width: min(320px, 78%);
  min-height: 246px;
  margin: 0;
  padding: 30px 27px 27px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 12px;
  border-radius: 22px;
  border: 1px solid rgba(196,136,15,.44);
  background:
    radial-gradient(circle at 84% 14%, rgba(212,160,58,.11), transparent 28%),
    linear-gradient(155deg, rgba(255,253,246,.99), rgba(255,247,228,.98));
  box-shadow:
    0 22px 48px rgba(61,35,9,.13),
    inset 0 1px 0 rgba(255,255,255,.9);
  transform:
    translate(-50%, -50%)
    translateX(var(--cf-x))
    translateZ(var(--cf-z))
    rotateY(var(--cf-ry))
    scale(var(--cf-scale));
  transform-origin: center center;
  transform-style: preserve-3d;
  opacity: var(--cf-opacity);
  z-index: var(--cf-order);
  cursor: pointer;
  overflow: hidden;
  transition:
    transform .62s var(--ease),
    opacity .42s ease,
    border-color .35s ease,
    box-shadow .35s ease,
    filter .35s ease;
  will-change: transform, opacity;
  -webkit-tap-highlight-color: transparent;
}
#foundation .foundation-highlights > span::before {
  content: "";
  position: absolute;
  inset: 0 0 auto;
  height: 3px;
  background: linear-gradient(90deg, var(--cf-burgundy), var(--cf-gold), var(--cf-teal));
  opacity: .6;
}
#foundation .foundation-highlights > span::after {
  content: "✦";
  position: absolute;
  right: 18px;
  bottom: 13px;
  color: rgba(196,136,15,.43);
  font-size: 13px;
  transform: translateZ(18px);
}
#foundation .foundation-highlights > span b {
  position: relative;
  display: block;
  color: var(--heading);
  font-family: var(--font-display);
  font-size: clamp(19px, 1.65vw, 24px);
  line-height: 1.18;
  letter-spacing: .035em;
  text-transform: uppercase;
  text-wrap: balance;
}
#foundation .foundation-highlights > span small {
  position: relative;
  display: block;
  color: var(--muted);
  font-family: var(--font-display);
  font-size: clamp(15px, 1.15vw, 18px);
  line-height: 1.55;
}
#foundation .foundation-highlights > span.is-active {
  border-color: rgba(196,136,15,.82);
  box-shadow:
    0 30px 62px rgba(71,38,8,.18),
    0 0 0 1px rgba(212,160,58,.13),
    inset 0 1px 0 rgba(255,255,255,.95);
  filter: saturate(1.03) brightness(1.015);
  cursor: default;
}
#foundation .foundation-highlights > span.is-active::before {
  opacity: 1;
  box-shadow: 0 0 16px rgba(212,160,58,.24);
}
#foundation .foundation-highlights > span.is-active::after {
  color: var(--cf-gold);
  animation: foundationCardSpark 2.9s ease-in-out infinite;
}
@keyframes foundationCardSpark {
  0%, 100% { opacity: .35; transform: translateZ(18px) scale(.8) rotate(0deg); }
  50% { opacity: .95; transform: translateZ(18px) scale(1.18) rotate(45deg); }
}
@media (hover:hover) and (pointer:fine) {
  #foundation .foundation-highlights > span:not(.is-active):hover {
    filter: brightness(1.04) saturate(1.04);
    border-color: rgba(196,136,15,.64);
  }
}
#foundation .foundation-coverflow-controls {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 12px;
  margin-top: -2px;
  position: relative;
  z-index: 5;
}
#foundation .foundation-coverflow-nav {
  width: 48px;
  height: 48px;
  min-width: 48px;
  padding: 0;
  border-radius: 50%;
  border: 1px solid rgba(155,99,16,.66);
  color: var(--heading);
  background:
    linear-gradient(180deg, rgba(255,252,240,.98), rgba(247,224,168,.92));
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.95),
    0 8px 18px rgba(74,42,9,.11);
  display: grid;
  place-items: center;
  font: 500 28px/1 var(--font-display);
  cursor: pointer;
  transition: transform .22s var(--ease), box-shadow .22s ease, border-color .22s ease;
}
#foundation .foundation-coverflow-nav > .foundation-coverflow-arrow {
  transform: translateY(-1px);
}
@media (hover:hover) and (pointer:fine) {
  #foundation .foundation-coverflow-nav:hover {
    transform: translateY(-2px);
    border-color: var(--cf-gold);
    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.95),
      0 11px 24px rgba(74,42,9,.15),
      0 0 15px rgba(212,160,58,.16);
  }
}
#foundation .foundation-coverflow-status {
  min-width: 76px;
  height: 40px;
  padding: 0 14px;
  border-radius: 999px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  border: 1px solid rgba(196,136,15,.25);
  background: rgba(255,250,240,.72);
  color: var(--muted);
  font-size: 13px;
  letter-spacing: .08em;
  text-transform: uppercase;
}
#foundation .foundation-coverflow-status strong {
  color: var(--heading);
  font-size: 15px;
}
#foundation .foundation-coverflow-dots {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 7px;
  margin-top: 13px;
}
#foundation .foundation-coverflow-dot {
  appearance: none;
  position: relative;
  width: 26px;
  height: 26px;
  min-width: 26px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: transparent;
  cursor: pointer;
}
#foundation .foundation-coverflow-dot::before {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  width: 8px;
  height: 8px;
  transform: translate(-50%, -50%);
  border: 1px solid rgba(155,99,16,.48);
  border-radius: 999px;
  background: rgba(255,250,240,.82);
  transition: width .28s var(--ease), background .28s ease, border-color .28s ease;
}
#foundation .foundation-coverflow-dot[aria-current="true"]::before {
  width: 22px;
  border-color: rgba(196,136,15,.72);
  background: linear-gradient(90deg, var(--cf-burgundy), var(--cf-gold), var(--cf-teal));
}
#foundation .foundation-coverflow-dot > .live-button-bubbles {
  display: none !important;
}
#foundation .foundation-coverflow-hint {
  margin: 9px 0 0;
  text-align: center;
  color: var(--muted);
  font-family: var(--font-display);
  font-style: italic;
  font-size: 14px;
  line-height: 1.4;
  opacity: .78;
}
@media (max-width: 980px) {
  #foundation .foundation-coverflow { margin-top: 26px; padding-inline: 0; }
  #foundation .foundation-coverflow-stage,
  #foundation .foundation-highlights { min-height: 326px; height: 326px; }
  #foundation .foundation-highlights > span {
    width: min(300px, 72vw);
    min-height: 240px;
    padding: 27px 24px 24px;
  }
}
@media (max-width: 620px) {
  #foundation .foundation-coverflow {
    margin-top: 22px;
    padding-top: 20px;
  }
  #foundation .foundation-coverflow::before {
    left: 10px;
    right: 10px;
  }
  #foundation .foundation-coverflow-stage,
  #foundation .foundation-highlights {
    min-height: 304px;
    height: 304px;
  }
  #foundation .foundation-highlights > span {
    width: min(82vw, 286px, calc(100% - 12px));
    min-height: 232px;
    padding: 25px 21px 22px;
    border-radius: 19px;
  }
  #foundation .foundation-highlights > span b {
    font-size: clamp(18px, 5vw, 21px);
  }
  #foundation .foundation-highlights > span small {
    font-size: clamp(14px, 4.1vw, 16px);
  }
  #foundation .foundation-coverflow-nav {
    width: 46px;
    height: 46px;
    min-width: 46px;
  }
  #foundation .foundation-coverflow-status {
    height: 38px;
    min-width: 70px;
    padding-inline: 12px;
  }
  #foundation .foundation-coverflow-hint {
    max-width: 280px;
    margin-inline: auto;
    font-size: 13px;
  }
}
@media (max-width: 360px) {
  #foundation .foundation-coverflow-stage,
  #foundation .foundation-highlights {
    min-height: 292px;
    height: 292px;
  }
  #foundation .foundation-highlights > span {
    width: min(84vw, 272px, calc(100% - 10px));
    min-height: 224px;
    padding: 22px 18px 20px;
  }
}
@media (prefers-reduced-motion: reduce) {
  #foundation .foundation-highlights > span,
  #foundation .foundation-coverflow-nav,
  #foundation .foundation-coverflow-dot {
    transition: none !important;
  }
  #foundation .foundation-highlights > span.is-active::after {
    animation: none !important;
  }
}

/* ======================================================================
   FOUNDATIONAL LEGACY — ORNATE HERITAGE COVERFLOW v30
   Presentation-only refinement of the existing v29 3D coverflow.
   Interaction, card order, swipe/keyboard behavior and reveal animations
   remain unchanged. Uses only the site's existing heritage assets/colors.
   ====================================================================== */
#foundation .foundation-coverflow {
  margin-top: 34px;
  padding: 56px 10px 48px;
}

#foundation .foundation-coverflow::before,
#foundation .foundation-coverflow::after {
  content: "";
  position: absolute;
  left: 50%;
  width: min(680px, 88%);
  height: 44px;
  background: url("assets/ornament-divider-5.png") center / contain no-repeat;
  opacity: .78;
  filter: drop-shadow(0 3px 7px rgba(125, 77, 13, .14));
  pointer-events: none;
  z-index: 3;
}
#foundation .foundation-coverflow::before {
  top: 2px;
  transform: translateX(-50%);
}
#foundation .foundation-coverflow::after {
  top: auto;
  bottom: 0;
  transform: translateX(-50%) rotate(180deg);
}

#foundation .foundation-coverflow-stage {
  min-height: 356px;
  border: 1px solid rgba(177, 118, 20, .30);
  border-radius: 26px;
  background:
    radial-gradient(circle at 50% 45%, rgba(238, 196, 91, .13), transparent 34%),
    radial-gradient(circle at 10% 15%, rgba(111, 24, 35, .035), transparent 28%),
    linear-gradient(180deg, rgba(255, 253, 247, .78), rgba(250, 241, 218, .58));
  box-shadow:
    inset 0 0 0 5px rgba(255, 255, 255, .38),
    inset 0 0 0 6px rgba(198, 145, 35, .08),
    0 18px 42px rgba(72, 42, 9, .06);
}
#foundation .foundation-highlights {
  height: 356px;
}

#foundation .foundation-highlights > span {
  width: min(326px, 78%);
  min-height: 252px;
  padding: 38px 29px 30px;
  gap: 13px;
  border-radius: 11px;
  border: 1px solid rgba(181, 119, 18, .62);
  background:
    radial-gradient(circle at 50% 0%, rgba(239, 196, 83, .16), transparent 32%),
    radial-gradient(circle at 94% 92%, rgba(61, 125, 120, .045), transparent 30%),
    linear-gradient(158deg, rgba(255, 254, 249, .995), rgba(252, 244, 224, .985));
  box-shadow:
    0 24px 52px rgba(64, 36, 8, .14),
    inset 0 0 0 5px rgba(255, 255, 255, .50),
    inset 0 0 0 6px rgba(198, 145, 35, .15),
    inset 0 -18px 30px rgba(171, 111, 16, .025);
}

#foundation .foundation-highlights > span::before {
  content: "";
  position: absolute;
  top: 12px;
  left: 50%;
  right: auto;
  width: 58%;
  height: 18px;
  transform: translateX(-50%) translateZ(16px);
  background: url("assets/orn-motif-gold.png") center / contain no-repeat;
  opacity: .30;
  box-shadow: none;
  pointer-events: none;
}
#foundation .foundation-highlights > span::after {
  content: "✦";
  right: 17px;
  bottom: 12px;
  color: rgba(160, 99, 10, .42);
  font-size: 13px;
  text-shadow: 0 0 8px rgba(224, 174, 61, .14);
}

#foundation .foundation-highlights > span b {
  color: var(--heading);
  font-family: var(--font-display);
  font-size: clamp(18px, 1.58vw, 23px);
  font-weight: 600;
  line-height: 1.2;
  letter-spacing: .075em;
  text-transform: uppercase;
  text-shadow: 0 1px 0 rgba(255, 255, 255, .82);
}
#foundation .foundation-highlights > span b::after {
  content: "";
  display: block;
  width: 52px;
  height: 1px;
  margin: 11px 0 0;
  background: linear-gradient(90deg, var(--cf-burgundy), var(--cf-gold), transparent);
  opacity: .76;
}
#foundation .foundation-highlights > span small {
  color: #765f46;
  font-family: var(--font-display);
  font-size: clamp(15px, 1.08vw, 17px);
  line-height: 1.62;
}
#foundation .foundation-highlights > span.fh-italic small {
  font-style: italic;
}

#foundation .foundation-highlights > span:not(.is-active) {
  filter: sepia(.055) saturate(.93) brightness(.985);
}
#foundation .foundation-highlights > span.is-active {
  border-color: rgba(174, 110, 10, .90);
  box-shadow:
    0 30px 66px rgba(70, 37, 7, .19),
    0 0 0 1px rgba(224, 175, 58, .18),
    inset 0 0 0 5px rgba(255, 255, 255, .66),
    inset 0 0 0 7px rgba(206, 151, 38, .18),
    inset 0 -22px 34px rgba(160, 98, 10, .035);
  filter: saturate(1.04) brightness(1.02);
}
#foundation .foundation-highlights > span.is-active::before {
  opacity: .72;
  filter: drop-shadow(0 2px 5px rgba(175, 112, 14, .12));
}

#foundation .foundation-coverflow-controls {
  gap: 13px;
  margin-top: 12px;
}
#foundation .foundation-coverflow-controls::before,
#foundation .foundation-coverflow-controls::after {
  content: "";
  width: clamp(24px, 5vw, 74px);
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(176, 111, 12, .52));
}
#foundation .foundation-coverflow-controls::after {
  background: linear-gradient(90deg, rgba(176, 111, 12, .52), transparent);
}
#foundation .foundation-coverflow-nav {
  width: 52px;
  height: 52px;
  min-width: 52px;
  border: 1px solid rgba(132, 73, 7, .78);
  color: #6f1823;
  background:
    radial-gradient(circle at 35% 28%, rgba(255, 249, 214, .98), rgba(237, 190, 77, .94) 52%, rgba(181, 111, 19, .95) 100%);
  box-shadow:
    inset 0 0 0 3px rgba(255, 247, 207, .52),
    inset 0 0 0 4px rgba(126, 72, 6, .13),
    0 9px 20px rgba(74, 42, 9, .13);
  font-size: 27px;
}
@media (hover:hover) and (pointer:fine) {
  #foundation .foundation-coverflow-nav:hover {
    border-color: rgba(122, 64, 5, .94);
    box-shadow:
      inset 0 0 0 3px rgba(255, 247, 207, .62),
      inset 0 0 0 4px rgba(126, 72, 6, .16),
      0 12px 26px rgba(74, 42, 9, .18),
      0 0 17px rgba(212, 160, 58, .18);
  }
}
#foundation .foundation-coverflow-status {
  min-width: 82px;
  height: 42px;
  border: 1px solid rgba(158, 96, 10, .48);
  background: linear-gradient(180deg, rgba(255, 253, 244, .94), rgba(247, 228, 184, .78));
  box-shadow:
    inset 0 0 0 3px rgba(255, 255, 255, .52),
    0 5px 14px rgba(83, 48, 8, .06);
  color: #776047;
  font-family: var(--font-display);
  letter-spacing: .10em;
}
#foundation .foundation-coverflow-status strong {
  color: var(--heading);
  font-family: var(--font-display);
}

#foundation .foundation-coverflow-dots {
  gap: 5px;
  margin-top: 15px;
}
#foundation .foundation-coverflow-dot {
  width: 28px;
  height: 28px;
  min-width: 28px;
}
#foundation .foundation-coverflow-dot::before {
  content: "✦";
  width: 17px;
  height: 17px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(153, 91, 7, .38);
  border-radius: 50%;
  background: rgba(255, 251, 238, .88);
  color: rgba(156, 94, 7, .52);
  font-size: 8px;
  line-height: 1;
  transition: width .28s var(--ease), height .28s var(--ease), background .28s ease, border-color .28s ease, color .28s ease, transform .28s var(--ease);
}
#foundation .foundation-coverflow-dot[aria-current="true"]::before {
  width: 25px;
  height: 25px;
  border-color: rgba(130, 67, 6, .66);
  background: radial-gradient(circle at 35% 28%, #fff3bf, #d7a63a 58%, #9b5b0d);
  color: #6f1823;
  box-shadow: inset 0 0 0 2px rgba(255, 247, 210, .56), 0 3px 8px rgba(93, 54, 9, .10);
}
#foundation .foundation-coverflow-hint {
  margin-top: 10px;
  color: #80694e;
  font-size: 14px;
  letter-spacing: .015em;
  opacity: .84;
}

@media (max-width: 980px) {
  #foundation .foundation-coverflow {
    padding-top: 50px;
    padding-bottom: 44px;
  }
  #foundation .foundation-coverflow::before,
  #foundation .foundation-coverflow::after {
    width: min(560px, 90%);
    height: 38px;
  }
  #foundation .foundation-coverflow-stage,
  #foundation .foundation-highlights {
    min-height: 342px;
    height: 342px;
  }
  #foundation .foundation-highlights > span {
    width: min(304px, 72vw);
    min-height: 242px;
    padding: 36px 24px 25px;
  }
}

@media (max-width: 620px) {
  #foundation .foundation-coverflow {
    margin-top: 24px;
    padding: 42px 0 38px;
  }
  #foundation .foundation-coverflow::before,
  #foundation .foundation-coverflow::after {
    width: calc(100% - 18px);
    height: 30px;
    opacity: .67;
  }
  #foundation .foundation-coverflow::before { top: 3px; }
  #foundation .foundation-coverflow-stage,
  #foundation .foundation-highlights {
    min-height: 314px;
    height: 314px;
  }
  #foundation .foundation-coverflow-stage {
    border-radius: 20px;
    border-color: rgba(177, 118, 20, .25);
  }
  #foundation .foundation-highlights > span {
    width: min(82vw, 286px, calc(100% - 12px));
    min-height: 232px;
    padding: 34px 21px 22px;
    border-radius: 10px;
  }
  #foundation .foundation-highlights > span::before {
    top: 11px;
    width: 56%;
    height: 15px;
  }
  #foundation .foundation-highlights > span b {
    font-size: clamp(17px, 4.9vw, 20px);
    letter-spacing: .06em;
  }
  #foundation .foundation-highlights > span small {
    font-size: clamp(14px, 4vw, 16px);
    line-height: 1.55;
  }
  #foundation .foundation-coverflow-controls {
    gap: 9px;
    margin-top: 10px;
  }
  #foundation .foundation-coverflow-controls::before,
  #foundation .foundation-coverflow-controls::after {
    width: 18px;
  }
  #foundation .foundation-coverflow-nav {
    width: 46px;
    height: 46px;
    min-width: 46px;
  }
  #foundation .foundation-coverflow-status {
    min-width: 72px;
    height: 38px;
    padding-inline: 11px;
    font-size: 12px;
  }
  #foundation .foundation-coverflow-dots {
    gap: 2px;
    margin-top: 12px;
  }
  #foundation .foundation-coverflow-dot {
    width: 25px;
    height: 25px;
    min-width: 25px;
  }
  #foundation .foundation-coverflow-dot::before {
    width: 14px;
    height: 14px;
    font-size: 7px;
  }
  #foundation .foundation-coverflow-dot[aria-current="true"]::before {
    width: 22px;
    height: 22px;
  }
  #foundation .foundation-coverflow-hint {
    max-width: 278px;
    font-size: 13px;
  }
}

@media (max-width: 360px) {
  #foundation .foundation-coverflow {
    padding-top: 38px;
    padding-bottom: 36px;
  }
  #foundation .foundation-coverflow-stage,
  #foundation .foundation-highlights {
    min-height: 302px;
    height: 302px;
  }
  #foundation .foundation-highlights > span {
    width: min(84vw, 272px, calc(100% - 10px));
    min-height: 224px;
    padding: 32px 18px 20px;
  }
}

@media (prefers-reduced-motion: reduce) {
  #foundation .foundation-highlights > span,
  #foundation .foundation-coverflow-nav,
  #foundation .foundation-coverflow-dot::before {
    transition: none !important;
  }
}

/* =====================================================================
   V31 — VIRTUES & WISDOM · HERITAGE GUIDED STEPPER
   Five reflections become a compact guided tour with immediate progress,
   Previous / Next navigation, numbered seals, keyboard control and swipe.
   Scoped to #virtues so no other section or control is altered.
   ===================================================================== */
#virtues .virtue-guided-stepper {
  --vg-burgundy: #6e1c2a;
  --vg-burgundy-deep: #4f1420;
  --vg-gold: #d5a63f;
  --vg-gold-soft: #efd38a;
  --vg-teal: #3f7f79;
  --vg-ink: #5a3d29;
  position: relative;
  width: min(100%, 1120px);
  margin: clamp(20px, 2.2vw, 30px) auto 0;
  padding: clamp(22px, 2.6vw, 34px);
  border: 1px solid rgba(193, 145, 47, .46);
  border-radius: clamp(22px, 2.2vw, 30px);
  background:
    radial-gradient(circle at 50% 0%, rgba(238, 204, 119, .16), transparent 35%),
    linear-gradient(145deg, rgba(255, 252, 242, .98), rgba(247, 238, 214, .97));
  box-shadow:
    0 18px 46px rgba(82, 52, 18, .12),
    inset 0 1px 0 rgba(255, 255, 255, .92),
    inset 0 0 0 7px rgba(255, 250, 235, .42);
  overflow: hidden;
  isolation: isolate;
}

#virtues .virtue-guided-stepper::before {
  content: '';
  position: absolute;
  left: clamp(28px, 5vw, 68px);
  right: clamp(28px, 5vw, 68px);
  top: 0;
  height: 4px;
  border-radius: 0 0 999px 999px;
  background: linear-gradient(90deg, var(--vg-burgundy), var(--vg-gold-soft) 52%, var(--vg-teal));
  box-shadow: 0 0 16px rgba(210, 163, 59, .30);
  z-index: 2;
}

#virtues .virtue-guided-stepper::after {
  content: '';
  position: absolute;
  inset: 10px;
  border: 1px solid rgba(209, 168, 82, .15);
  border-radius: inherit;
  pointer-events: none;
  z-index: -1;
}

#virtues .virtue-stepper-ornament {
  width: min(430px, 66%);
  height: clamp(28px, 3vw, 42px);
  margin: -6px auto 12px;
  background: url('assets/ornament-divider-5.png') center / contain no-repeat;
  opacity: .72;
  filter: saturate(.92) contrast(.96);
  pointer-events: none;
  animation: virtueOrnamentBreath 7s ease-in-out infinite;
}

#virtues .virtue-stepper-ornament--bottom {
  margin: 12px auto -8px;
  transform: rotate(180deg);
}

@keyframes virtueOrnamentBreath {
  0%,100% { opacity: .58; filter: saturate(.86) brightness(.98); }
  50% { opacity: .86; filter: saturate(1.02) brightness(1.05); }
}

#virtues .virtue-stepper-progress-shell {
  position: relative;
  margin-bottom: clamp(18px, 2vw, 26px);
}

#virtues .virtue-stepper-progress-track {
  position: relative;
  height: 7px;
  border-radius: 999px;
  overflow: hidden;
  background: rgba(176, 145, 75, .18);
  box-shadow: inset 0 1px 3px rgba(73, 45, 14, .13);
}

#virtues .virtue-stepper-progress-track > span {
  display: block;
  width: 20%;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, var(--vg-burgundy) 0 35%, var(--vg-gold) 65%, var(--vg-teal) 100%);
  box-shadow: 0 0 12px rgba(208, 159, 54, .32);
  transition: width .28s cubic-bezier(.22, 1, .36, 1);
}

#virtues .virtue-stepper-meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  margin-top: 8px;
  color: #8c6324;
  font-family: var(--font-display, Georgia, serif);
  text-transform: uppercase;
  letter-spacing: .09em;
  font-size: clamp(12px, 1.25vw, 14px);
}

#virtues #virtueStepLabel {
  color: var(--vg-burgundy);
  font-weight: 700;
}

#virtues #virtueStepCount {
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
}

#virtues .virtue-stepper-stage {
  position: relative;
  padding: clamp(22px, 2.7vw, 34px);
  border: 1px solid rgba(201, 151, 47, .58);
  border-radius: clamp(18px, 1.8vw, 24px);
  background:
    linear-gradient(180deg, rgba(255,255,255,.80), rgba(255,252,244,.90)),
    radial-gradient(circle at 50% 0%, rgba(235, 201, 119, .12), transparent 48%);
  box-shadow:
    0 13px 34px rgba(83, 54, 20, .10),
    inset 0 1px 0 rgba(255,255,255,.95);
  transition: opacity .18s ease, transform .18s ease, filter .18s ease;
}

#virtues .virtue-stepper-stage::before {
  content: '';
  position: absolute;
  left: 18%;
  right: 18%;
  top: -1px;
  height: 3px;
  border-radius: 999px;
  background: linear-gradient(90deg, transparent, var(--vg-burgundy), var(--vg-gold-soft), var(--vg-teal), transparent);
  opacity: .82;
}

#virtues .virtue-stepper-stage.virtue-step-leave {
  opacity: .45;
  transform: translateY(5px) scale(.997);
  filter: saturate(.92);
}

#virtues .virtue-stepper-stage.virtue-step-enter {
  animation: virtueStageEnter .36s cubic-bezier(.22, 1, .36, 1) both;
}

@keyframes virtueStageEnter {
  from { opacity: .62; transform: translateY(8px); }
  to { opacity: 1; transform: translateY(0); }
}

#virtues .virtue-stepper-stage-heading {
  max-width: 850px;
  margin: 0 auto clamp(20px, 2.2vw, 28px);
  text-align: center;
}

#virtues .virtue-stepper-kicker {
  margin: 0 0 6px;
  color: #b17c24;
  font: 700 11px/1.4 var(--font-body, sans-serif);
  letter-spacing: .20em;
  text-transform: uppercase;
}

#virtues .virtue-stepper-stage-heading h4 {
  margin: 0;
  color: var(--vg-burgundy);
  font-family: var(--font-display, Georgia, serif);
  font-size: clamp(28px, 3.2vw, 42px);
  font-weight: 600;
  letter-spacing: .025em;
  text-shadow: 0 1px 0 #fff, 0 0 15px rgba(211, 164, 64, .10);
}

#virtues .virtue-stepper-stage-heading h4::after {
  content: '';
  display: block;
  width: min(280px, 62%);
  height: 3px;
  margin: 10px auto 12px;
  border-radius: 999px;
  background: linear-gradient(90deg, var(--vg-burgundy), var(--vg-gold), var(--vg-teal));
}

#virtues .virtue-stepper-stage-heading > p:last-child {
  max-width: 760px;
  margin: 0 auto;
  color: #745d42;
  font: italic clamp(15px, 1.55vw, 18px)/1.6 var(--font-serif, Georgia, serif);
}

#virtues .virtue-stepper-parent-grid {
  width: 100%;
  max-width: none;
  gap: clamp(14px, 1.8vw, 20px);
}

#virtues .virtue-guided-stepper .parent-card {
  position: relative;
  min-width: 0;
  padding: clamp(18px, 2vw, 24px);
  border: 1px solid rgba(200, 154, 59, .42) !important;
  border-top: 3px solid var(--vg-gold) !important;
  border-radius: 17px !important;
  background: rgba(255, 254, 249, .86) !important;
  box-shadow: 0 8px 24px rgba(75, 48, 17, .07) !important;
}

#virtues .virtue-guided-stepper .parent-card[data-parent='vijay'] {
  border-top-color: var(--vg-teal) !important;
}

#virtues .virtue-guided-stepper .parent-card::after {
  content: '';
  position: absolute;
  right: 12px;
  bottom: 10px;
  width: 44px;
  height: 44px;
  background: url('assets/orn-motif-gold.png') center / contain no-repeat;
  opacity: .10;
  pointer-events: none;
}

#virtues .virtue-guided-stepper .parent-top {
  align-items: center;
  margin-bottom: 8px;
}

#virtues .virtue-guided-stepper .parent-top h4 {
  margin: 0;
  color: var(--vg-burgundy);
  font-size: clamp(18px, 1.8vw, 22px);
}

#virtues .virtue-guided-stepper .avatar-frame {
  flex: 0 0 auto;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  background: radial-gradient(circle at 35% 28%, #fff3c4, #e0ad43 58%, #9b5c13);
  color: var(--vg-burgundy-deep);
  border: 1px solid rgba(141, 89, 19, .44);
  box-shadow: 0 0 0 5px rgba(220, 177, 82, .09), 0 7px 16px rgba(92, 57, 12, .14);
}

#virtues .virtue-guided-stepper .virtue-panel {
  min-height: 0;
  padding: 12px 0 0;
  color: #654d36;
  font-size: clamp(16px, 1.55vw, 18px);
  line-height: 1.72;
}

#virtues .virtue-guided-stepper .virtue-panel strong {
  color: var(--vg-burgundy);
  font-family: var(--font-display, Georgia, serif);
  font-size: clamp(18px, 1.75vw, 21px);
  letter-spacing: .025em;
}

#virtues .virtue-stepper-actions {
  display: grid;
  grid-template-columns: auto minmax(210px, 1fr) auto;
  align-items: center;
  gap: clamp(12px, 2vw, 22px);
  margin-top: clamp(18px, 2vw, 24px);
}

#virtues .virtue-stepper-nav {
  min-height: 46px;
  padding: 10px 18px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  border: 1px solid rgba(171, 111, 24, .58);
  border-radius: 999px;
  background: linear-gradient(180deg, rgba(255,253,245,.98), rgba(245,232,199,.96));
  color: var(--vg-burgundy);
  font: 700 15px/1.2 var(--font-body, sans-serif);
  box-shadow: inset 0 1px rgba(255,255,255,.95), 0 6px 14px rgba(82, 52, 14, .08);
  cursor: pointer;
  transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease, opacity .2s ease;
}

#virtues .virtue-stepper-nav > span[aria-hidden='true'] {
  font-family: Georgia, serif;
  font-size: 22px;
  line-height: 1;
}

#virtues .virtue-stepper-nav:hover:not(:disabled) {
  transform: translateY(-2px);
  border-color: rgba(200, 147, 42, .86);
  box-shadow: inset 0 1px rgba(255,255,255,.95), 0 10px 20px rgba(82, 52, 14, .12);
}

#virtues .virtue-stepper-nav:disabled {
  opacity: .38;
  cursor: default;
  filter: grayscale(.18);
  box-shadow: none;
}

#virtues .virtue-stepper-dots {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: clamp(7px, 1vw, 11px);
  min-width: 0;
}

#virtues .virtue-step-dot {
  position: relative;
  width: 38px;
  height: 38px;
  flex: 0 0 38px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(172, 115, 25, .52);
  border-radius: 50%;
  background: radial-gradient(circle at 35% 28%, #fff8dd, #ead09b 64%, #c79939);
  color: #6c4318;
  font: 800 13px/1 var(--font-body, sans-serif);
  box-shadow: inset 0 1px rgba(255,255,255,.95), 0 5px 12px rgba(80, 48, 10, .08);
  cursor: pointer;
  transition: transform .2s ease, box-shadow .2s ease, background .2s ease, color .2s ease;
}

#virtues .virtue-step-dot::after {
  content: '';
  position: absolute;
  inset: 4px;
  border: 1px solid rgba(126, 79, 22, .22);
  border-radius: 50%;
  pointer-events: none;
}

#virtues .virtue-step-dot.active {
  transform: translateY(-2px) scale(1.04);
  color: #fff1bd;
  background: radial-gradient(circle at 35% 30%, #9b3b47, var(--vg-burgundy) 58%, var(--vg-burgundy-deep));
  border-color: rgba(212, 164, 60, .9);
  box-shadow: 0 0 0 4px rgba(218, 178, 87, .12), 0 7px 18px rgba(83, 29, 36, .16);
}

#virtues .virtue-step-dot:hover {
  transform: translateY(-2px);
}

#virtues .virtue-stepper-nav:focus-visible,
#virtues .virtue-step-dot:focus-visible,
#virtues .virtue-guided-stepper:focus-visible {
  outline: 3px solid rgba(213, 166, 63, .72);
  outline-offset: 4px;
}

#virtues .virtue-stepper-hint {
  margin: 12px auto 0;
  text-align: center;
  color: #92795b;
  font: italic 13px/1.5 var(--font-serif, Georgia, serif);
}

/* The old one-line heading rule was too rigid for phones. */
@media (max-width: 760px) {
  #virtues .section-heading h3.heading-accent {
    white-space: normal !important;
    text-wrap: balance !important;
    max-width: 100% !important;
    font-size: clamp(26px, 7vw, 38px) !important;
    line-height: 1.12 !important;
  }

  #virtues .virtue-guided-stepper {
    width: 100%;
    padding: 18px 14px;
    border-radius: 22px;
  }

  #virtues .virtue-stepper-ornament {
    width: min(320px, 78%);
    height: 32px;
    margin-bottom: 9px;
  }

  #virtues .virtue-stepper-stage {
    padding: 18px 14px;
    border-radius: 18px;
  }

  #virtues .virtue-stepper-parent-grid {
    grid-template-columns: 1fr !important;
    gap: 14px;
  }

  #virtues .virtue-guided-stepper .parent-card {
    padding: 17px 15px;
  }

  #virtues .virtue-stepper-actions {
    grid-template-columns: 1fr 1fr;
    gap: 10px;
  }

  #virtues .virtue-stepper-nav {
    width: 100%;
    min-width: 0;
    padding-inline: 12px;
  }

  #virtues .virtue-stepper-dots {
    grid-column: 1 / -1;
    grid-row: 2;
    width: 100%;
    gap: 8px;
  }

  #virtues #virtuePrev { grid-column: 1; grid-row: 1; }
  #virtues #virtueNext { grid-column: 2; grid-row: 1; }
}

@media (max-width: 430px) {
  #virtues .virtue-stepper-meta {
    font-size: 11px;
    letter-spacing: .06em;
  }

  #virtues .virtue-stepper-stage-heading h4 {
    font-size: clamp(27px, 8.8vw, 34px);
  }

  #virtues .virtue-stepper-stage-heading > p:last-child {
    font-size: 15px;
  }

  #virtues .virtue-guided-stepper .parent-top {
    align-items: flex-start;
  }

  #virtues .virtue-guided-stepper .avatar-frame {
    width: 42px;
    height: 42px;
    font-size: 19px;
  }

  #virtues .virtue-step-dot {
    width: 34px;
    height: 34px;
    flex-basis: 34px;
    font-size: 12px;
  }

  #virtues .virtue-stepper-hint {
    font-size: 12px;
    padding-inline: 4px;
  }
}

@media (prefers-reduced-motion: reduce) {
  #virtues .virtue-stepper-ornament,
  #virtues .virtue-stepper-stage.virtue-step-enter {
    animation: none !important;
  }
  #virtues .virtue-stepper-progress-track > span,
  #virtues .virtue-stepper-stage,
  #virtues .virtue-stepper-nav,
  #virtues .virtue-step-dot {
    transition: none !important;
  }
}


/* ==========================================================================
   ACADEMIC TRIUMPH — FILMSTRIP AND STAGE (v32)
   Six labelled archive tiles feed one large academic stage. The filmstrip
   scrolls locally on narrow screens so the page itself never overflows.
   ========================================================================== */
#academic .academic-filmstage {
  position: relative;
  max-width: 1160px;
  margin: 0 auto;
  padding: clamp(22px, 3vw, 34px);
  border: 1px solid rgba(196, 136, 15, .28);
  border-radius: 24px;
  background:
    radial-gradient(circle at 50% -20%, rgba(212,160,58,.12), transparent 42%),
    linear-gradient(180deg, rgba(255,253,246,.94), rgba(255,248,232,.88));
  box-shadow: 0 18px 46px rgba(60, 31, 6, .08), inset 0 1px 0 rgba(255,255,255,.92);
  overflow: hidden;
}
#academic .academic-filmstage::before,
#academic .academic-filmstage::after {
  content: "✦";
  position: absolute;
  top: 14px;
  color: rgba(196, 136, 15, .62);
  font: 700 17px/1 Georgia, serif;
  pointer-events: none;
}
#academic .academic-filmstage::before { left: 18px; }
#academic .academic-filmstage::after { right: 18px; }

#academic .academic-filmstage-ornament {
  height: 1px;
  margin: 0 auto 20px;
  width: min(100%, 760px);
  background: linear-gradient(90deg, transparent, rgba(92,45,10,.52), var(--gold), var(--teal), transparent);
  position: relative;
}
#academic .academic-filmstage-ornament::after {
  content: "✦";
  position: absolute;
  left: 50%;
  top: 50%;
  width: 26px;
  height: 26px;
  display: grid;
  place-items: center;
  transform: translate(-50%, -50%);
  border-radius: 50%;
  color: var(--sacred-gold);
  background: #fffaf0;
  border: 1px solid rgba(196,136,15,.42);
  box-shadow: 0 0 0 5px rgba(212,160,58,.05);
  font: 700 13px/1 Georgia, serif;
}
#academic .academic-filmstage-ornament--bottom {
  margin: 22px auto 0;
}

#academic .academic-filmstrip-shell {
  width: 100%;
  overflow: hidden;
  margin: 0 auto 18px;
  padding: 2px;
}
#academic .academic-filmstrip {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 10px;
  width: 100%;
  padding: 0;
  margin: 0;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}
#academic .academic-filmstrip-tab {
  min-width: 0;
  min-height: 96px;
  padding: 13px 10px 11px !important;
  display: flex !important;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 8px;
  border: 1px solid rgba(196,136,15,.18) !important;
  border-radius: 16px !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.93), rgba(255,250,239,.86)) !important;
  color: var(--heading) !important;
  box-shadow: 0 5px 15px rgba(74,38,5,.045) !important;
  text-shadow: none !important;
  font-family: var(--font-display) !important;
  letter-spacing: .035em !important;
  transform: none;
  position: relative;
  overflow: hidden;
  isolation: isolate;
}
#academic .academic-filmstrip-tab::after {
  content: "";
  position: absolute;
  left: 18%;
  right: 18%;
  bottom: 0;
  height: 2px;
  border-radius: 99px;
  background: linear-gradient(90deg, transparent, var(--gold), transparent);
  opacity: .35;
  transition: left .28s var(--ease), right .28s var(--ease), opacity .28s var(--ease);
}
#academic .academic-filmstrip-tab:hover,
#academic .academic-filmstrip-tab:focus-visible {
  border-color: rgba(196,136,15,.5) !important;
  background:
    radial-gradient(circle at 50% 0%, rgba(244,205,111,.18), transparent 52%),
    linear-gradient(180deg, #fffdf7, #fff7e5) !important;
  color: var(--heading-strong) !important;
  box-shadow: 0 8px 20px rgba(74,38,5,.08) !important;
  translate: 0 -2px;
}
#academic .academic-filmstrip-tab.active {
  border: 2px solid rgba(196,136,15,.78) !important;
  background:
    radial-gradient(circle at 50% 18%, rgba(246,222,154,.26), transparent 48%),
    linear-gradient(180deg, #fffdf7, #fff6de) !important;
  color: #6b1f27 !important;
  box-shadow:
    0 10px 24px rgba(91,45,10,.12),
    inset 0 0 0 3px rgba(255,255,255,.74) !important;
  translate: 0 -2px;
}
#academic .academic-filmstrip-tab.active::after {
  left: 8%;
  right: 8%;
  opacity: 1;
  background: linear-gradient(90deg, var(--heading), var(--gold), var(--teal));
}
#academic .academic-filmstrip-icon {
  width: 28px;
  height: 28px;
  display: grid;
  place-items: center;
  color: #a67620;
  transition: color .25s ease, transform .25s var(--ease);
}
#academic .academic-filmstrip-icon svg {
  width: 26px;
  height: 26px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
}
#academic .academic-filmstrip-tab.active .academic-filmstrip-icon {
  color: #8b4513;
  transform: translateY(-1px) scale(1.06);
}
#academic .academic-filmstrip-label {
  display: block;
  text-align: center;
  color: inherit;
  font: 700 clamp(13px, 1.15vw, 15px)/1.2 var(--font-display);
  letter-spacing: .055em;
  text-transform: uppercase;
}

#academic .academic-stage {
  position: relative;
  padding: clamp(22px, 3vw, 32px);
  border: 1px solid rgba(196,136,15,.56);
  border-radius: 20px;
  background:
    radial-gradient(circle at 50% -10%, rgba(212,160,58,.07), transparent 46%),
    rgba(255,255,255,.84);
  box-shadow: 0 14px 36px rgba(60,31,6,.07), inset 0 1px 0 rgba(255,255,255,.96);
  transform-origin: 50% 18%;
}
#academic .academic-stage.academic-stage-enter {
  animation: academicStageReveal .46s var(--ease);
}
@keyframes academicStageReveal {
  0% { opacity: .58; transform: translateY(7px) scale(.994); }
  100% { opacity: 1; transform: translateY(0) scale(1); }
}
#academic .academic-stage-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 18px;
  margin-bottom: 12px;
}
#academic .academic-stage-kicker {
  margin: 0 0 4px;
  color: var(--sacred-gold);
  font: 600 13px/1.2 var(--font-body);
  letter-spacing: .18em;
  text-transform: uppercase;
}
#academic .academic-stage-head h4 {
  margin: 0;
  color: #6b1f27;
  font: 600 clamp(25px, 3vw, 35px)/1.08 var(--font-display);
  letter-spacing: .025em;
}
#academic .academic-stage-head #academicStageNote {
  margin: 8px 0 0;
  color: var(--muted);
  font: italic 18px/1.55 var(--font-display);
}
#academic .academic-stage-count {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 72px;
  min-height: 32px;
  padding: 5px 12px;
  border-radius: 999px;
  border: 1px solid rgba(196,136,15,.36);
  background: linear-gradient(180deg, rgba(255,253,246,.96), rgba(255,245,220,.88));
  color: var(--heading);
  font: 700 12px/1 var(--font-body);
  letter-spacing: .08em;
  text-transform: uppercase;
}
#academic .academic-stage-rule {
  height: 3px;
  width: 100%;
  border-radius: 99px;
  margin: 16px 0 22px;
  background: linear-gradient(90deg, var(--gold) 0 49%, rgba(255,255,255,.55) 49% 51%, var(--teal) 51% 100%);
  opacity: .86;
}
#academic .academic-stage-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap: 16px;
  align-items: stretch;
  max-width: none !important;
}
#academic .academic-card {
  position: relative;
  min-width: 0;
  height: 100%;
  padding: 22px 22px 20px;
  border: 1px solid rgba(196,136,15,.3) !important;
  border-radius: 16px !important;
  background: rgba(255,253,247,.88) !important;
  box-shadow: none !important;
  overflow: hidden;
}
#academic .academic-card--ragini { border-top: 3px solid var(--gold) !important; }
#academic .academic-card--vijay { border-top: 3px solid var(--teal) !important; }
#academic .academic-card h4 {
  margin: 0 0 8px;
  color: #6b1f27;
  font: 700 19px/1.35 var(--font-display);
  letter-spacing: .01em;
}
#academic .academic-card > p {
  margin: 0;
  color: var(--text);
  font: 18px/1.62 var(--font-display);
}
#academic .academic-card .academic-detail {
  margin-top: 14px;
  padding-top: 12px;
  border-top: 1px solid rgba(196,136,15,.14);
}
#academic .academic-card .academic-detail ul {
  margin: 0;
  padding-left: 20px;
}
#academic .academic-card .academic-detail li {
  color: var(--text);
  font-size: 17px;
  line-height: 1.55;
  margin-bottom: 7px;
}
#academic .academic-card .academic-detail li::marker { color: var(--sacred-gold); }

#academic .academic-filmstage-hint {
  max-width: 760px;
  margin: 16px auto 0;
  text-align: center;
  color: var(--muted);
  font: italic 14px/1.5 var(--font-display);
}

@media (max-width: 980px) {
  #academic .academic-filmstrip-shell {
    overflow-x: auto;
    overscroll-behavior-inline: contain;
    scrollbar-width: thin;
    scrollbar-color: rgba(196,136,15,.48) rgba(196,136,15,.08);
    padding: 3px 2px 10px;
  }
  #academic .academic-filmstrip-shell::-webkit-scrollbar { height: 6px; }
  #academic .academic-filmstrip-shell::-webkit-scrollbar-track { background: rgba(196,136,15,.08); border-radius: 99px; }
  #academic .academic-filmstrip-shell::-webkit-scrollbar-thumb { background: rgba(196,136,15,.48); border-radius: 99px; }
  #academic .academic-filmstrip {
    display: flex;
    width: max-content;
    min-width: 100%;
    gap: 10px;
    scroll-snap-type: x proximity;
  }
  #academic .academic-filmstrip-tab {
    flex: 0 0 148px;
    min-height: 92px;
    scroll-snap-align: center;
  }
}
@media (max-width: 700px) {
  #academic .academic-filmstage {
    padding: 18px 14px 20px;
    border-radius: 20px;
  }
  #academic .academic-filmstage-ornament { margin-bottom: 16px; }
  #academic .academic-filmstrip-tab {
    flex-basis: 132px;
    min-height: 86px;
    padding: 10px 8px !important;
  }
  #academic .academic-filmstrip-icon { width: 24px; height: 24px; }
  #academic .academic-filmstrip-icon svg { width: 23px; height: 23px; }
  #academic .academic-filmstrip-label { font-size: 12.5px; }
  #academic .academic-stage {
    padding: 20px 15px;
    border-radius: 17px;
  }
  #academic .academic-stage-head { gap: 10px; }
  #academic .academic-stage-head h4 { font-size: clamp(24px, 8vw, 31px); }
  #academic .academic-stage-head #academicStageNote { font-size: 17px; }
  #academic .academic-stage-count { min-width: 60px; padding-inline: 9px; font-size: 11px; }
  #academic .academic-stage-grid {
    grid-template-columns: 1fr;
    gap: 12px;
  }
  #academic .academic-card { padding: 18px 16px 16px; }
  #academic .academic-card h4 { font-size: 18px; }
  #academic .academic-card > p { font-size: 17px; }
  #academic .academic-card .academic-detail li { font-size: 16px; }
}
@media (max-width: 430px) {
  #academic .academic-stage-head {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: start;
  }
  #academic .academic-stage-head #academicStageNote {
    grid-column: 1 / -1;
  }
  #academic .academic-stage-kicker { font-size: 11px; letter-spacing: .14em; }
  #academic .academic-filmstrip-tab { flex-basis: 124px; }
  #academic .academic-filmstage-hint { font-size: 13px; padding-inline: 4px; }
}
@media (prefers-reduced-motion: reduce) {
  #academic .academic-stage.academic-stage-enter { animation: none !important; }
  #academic .academic-filmstrip-tab,
  #academic .academic-filmstrip-icon { transition: none !important; }
}

/* ========================================================================== 
   ACADEMIC TRIUMPH — HERITAGE FILMSTRIP & STAGE (v33)
   Traditional archival treatment layered over the v32 interaction without
   changing topic navigation, publication controls, keyboard or touch logic.
   ========================================================================== */
#academic .academic-filmstage {
  --academic-wine: #741f2a;
  --academic-wine-deep: #55151d;
  --academic-antique: #b77a1f;
  --academic-gold-soft: #e8c96f;
  --academic-parchment: #fffaf0;
  border: 1px solid rgba(174, 114, 23, .54);
  border-radius: 22px;
  padding: clamp(24px, 3.2vw, 38px);
  background:
    radial-gradient(circle at 50% -8%, rgba(232,201,111,.20), transparent 30%),
    radial-gradient(circle at 8% 48%, rgba(116,31,42,.035), transparent 25%),
    radial-gradient(circle at 92% 48%, rgba(26,107,111,.035), transparent 25%),
    linear-gradient(180deg, rgba(255,253,247,.98), rgba(250,240,216,.94));
  box-shadow:
    0 18px 46px rgba(73, 39, 8, .10),
    inset 0 0 0 4px rgba(255,255,255,.66),
    inset 0 0 0 5px rgba(183,122,31,.10);
}
#academic .academic-filmstage::before,
#academic .academic-filmstage::after {
  content: "◆";
  top: 16px;
  width: 28px;
  height: 28px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  color: var(--academic-wine);
  background: radial-gradient(circle, #fff8df 0 48%, #e8c96f 50% 65%, #9a5c16 67% 72%, transparent 73%);
  font: 700 9px/1 Georgia, serif;
  opacity: .78;
  filter: drop-shadow(0 3px 4px rgba(83,43,7,.14));
}
#academic .academic-filmstage::before { left: 16px; }
#academic .academic-filmstage::after { right: 16px; }

#academic .academic-filmstage-ornament {
  width: min(100%, 860px);
  height: clamp(30px, 3.2vw, 42px);
  margin: 0 auto 18px;
  background: url('assets/ornament-divider-5.png') center / contain no-repeat;
  opacity: .72;
}
#academic .academic-filmstage-ornament::after { display: none; }
#academic .academic-filmstage-ornament--bottom {
  margin: 20px auto 0;
  transform: rotate(180deg);
  opacity: .52;
}

#academic .academic-filmstrip-shell {
  position: relative;
  margin-bottom: 22px;
  padding: 12px 8px 13px;
  border-top: 1px solid rgba(183,122,31,.34);
  border-bottom: 1px solid rgba(183,122,31,.34);
  background:
    linear-gradient(90deg, transparent, rgba(232,201,111,.11) 10% 90%, transparent),
    rgba(255,250,240,.42);
}
#academic .academic-filmstrip-shell::before,
#academic .academic-filmstrip-shell::after {
  content: "";
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  width: min(94%, 930px);
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--academic-wine), var(--academic-gold-soft), var(--teal), transparent);
  opacity: .55;
  pointer-events: none;
}
#academic .academic-filmstrip-shell::before { top: 4px; }
#academic .academic-filmstrip-shell::after { bottom: 4px; }

#academic .academic-filmstrip { gap: 8px; }
#academic .academic-filmstrip-tab {
  min-height: 104px;
  padding: 15px 9px 13px !important;
  border: 1px solid rgba(167,105,21,.40) !important;
  border-radius: 13px !important;
  background:
    radial-gradient(circle at 50% 0%, rgba(244,222,154,.18), transparent 48%),
    linear-gradient(180deg, rgba(255,254,249,.98), rgba(251,242,219,.94)) !important;
  color: #6b2a20 !important;
  box-shadow:
    0 5px 12px rgba(75,38,5,.055),
    inset 0 0 0 3px rgba(255,255,255,.55),
    inset 0 0 0 4px rgba(183,122,31,.055) !important;
}
#academic .academic-filmstrip-tab::before {
  content: "";
  position: absolute;
  inset: 5px;
  border: 1px solid rgba(183,122,31,.16);
  border-radius: 9px;
  pointer-events: none;
  background:
    linear-gradient(135deg, rgba(183,122,31,.32) 0 1px, transparent 1px) top left/12px 12px no-repeat,
    linear-gradient(225deg, rgba(183,122,31,.32) 0 1px, transparent 1px) top right/12px 12px no-repeat,
    linear-gradient(45deg, rgba(183,122,31,.32) 0 1px, transparent 1px) bottom left/12px 12px no-repeat,
    linear-gradient(315deg, rgba(183,122,31,.32) 0 1px, transparent 1px) bottom right/12px 12px no-repeat;
}
#academic .academic-filmstrip-tab::after {
  left: 23%;
  right: 23%;
  bottom: 8px;
  height: 2px;
  background: linear-gradient(90deg, transparent, var(--academic-antique), transparent);
  opacity: .42;
}
#academic .academic-filmstrip-tab:hover,
#academic .academic-filmstrip-tab:focus-visible {
  border-color: rgba(152,87,16,.68) !important;
  background:
    radial-gradient(circle at 50% 0%, rgba(244,222,154,.34), transparent 50%),
    linear-gradient(180deg, #fffdf5, #f8e9c2) !important;
  box-shadow:
    0 9px 20px rgba(76,38,5,.11),
    inset 0 0 0 3px rgba(255,255,255,.68) !important;
  translate: 0 -2px;
}
#academic .academic-filmstrip-tab.active {
  border: 1px solid #8d5218 !important;
  background:
    radial-gradient(circle at 50% 8%, rgba(255,225,137,.18), transparent 45%),
    linear-gradient(180deg, #7b2230 0%, #681b27 54%, #56141d 100%) !important;
  color: #ffe6a0 !important;
  box-shadow:
    0 10px 24px rgba(87,31,26,.22),
    inset 0 0 0 2px #e7bd58,
    inset 0 0 0 5px rgba(255,241,190,.08) !important;
  translate: 0 -3px;
}
#academic .academic-filmstrip-tab.active::before {
  border-color: rgba(244,209,111,.38);
  background:
    linear-gradient(135deg, rgba(244,209,111,.85) 0 1px, transparent 1px) top left/12px 12px no-repeat,
    linear-gradient(225deg, rgba(244,209,111,.85) 0 1px, transparent 1px) top right/12px 12px no-repeat,
    linear-gradient(45deg, rgba(244,209,111,.85) 0 1px, transparent 1px) bottom left/12px 12px no-repeat,
    linear-gradient(315deg, rgba(244,209,111,.85) 0 1px, transparent 1px) bottom right/12px 12px no-repeat;
}
#academic .academic-filmstrip-tab.active::after {
  left: 15%;
  right: 15%;
  bottom: 8px;
  background: linear-gradient(90deg, transparent, #f2d071 25% 75%, transparent);
  box-shadow: 0 0 8px rgba(242,208,113,.24);
}
#academic .academic-filmstrip-icon {
  width: 34px;
  height: 34px;
  color: #aa771e;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(255,249,226,.95) 0 57%, rgba(215,175,82,.20) 59% 72%, transparent 73%);
  filter: drop-shadow(0 2px 2px rgba(73,38,5,.08));
}
#academic .academic-filmstrip-icon svg { width: 24px; height: 24px; }
#academic .academic-filmstrip-tab.active .academic-filmstrip-icon {
  color: #f3cf72;
  background: radial-gradient(circle, rgba(73,20,28,.98) 0 57%, rgba(243,207,114,.22) 59% 72%, transparent 73%);
  transform: translateY(-1px) scale(1.08);
}
#academic .academic-filmstrip-label {
  font-size: clamp(12.5px, 1.08vw, 14.5px);
  letter-spacing: .075em;
}

#academic .academic-stage {
  padding: clamp(34px, 4vw, 46px) clamp(22px, 3vw, 34px) clamp(26px, 3.2vw, 36px);
  border: 1px solid rgba(163,101,17,.62);
  border-radius: 16px;
  background:
    radial-gradient(circle at 50% -8%, rgba(232,201,111,.15), transparent 30%),
    linear-gradient(180deg, rgba(255,254,250,.98), rgba(255,249,235,.94));
  box-shadow:
    0 15px 34px rgba(67,32,4,.08),
    inset 0 0 0 4px rgba(255,255,255,.72),
    inset 0 0 0 5px rgba(183,122,31,.10);
}
#academic .academic-stage::before {
  content: "";
  position: absolute;
  top: 5px;
  left: 50%;
  width: min(210px, 42%);
  height: 34px;
  transform: translateX(-50%);
  background: url('assets/orn-motif-gold.png') center / contain no-repeat;
  opacity: .50;
  pointer-events: none;
}
#academic .academic-stage::after {
  content: "";
  position: absolute;
  inset: 9px;
  border: 1px solid rgba(183,122,31,.14);
  border-radius: 11px;
  pointer-events: none;
}
#academic .academic-stage-head {
  position: relative;
  z-index: 1;
  align-items: center;
  padding: 4px 2px 0;
}
#academic .academic-stage-kicker {
  color: #9b691c;
  letter-spacing: .21em;
}
#academic .academic-stage-head h4 {
  color: var(--academic-wine);
  font-weight: 700;
  letter-spacing: .045em;
}
#academic .academic-stage-head #academicStageNote {
  color: #765b42;
}
#academic .academic-stage-count {
  min-width: 76px;
  min-height: 36px;
  border: 1px solid rgba(144,79,17,.58);
  background:
    radial-gradient(circle at 50% 0%, rgba(255,240,185,.28), transparent 50%),
    linear-gradient(180deg, #fff7dd, #ead095);
  color: #64202a;
  box-shadow: inset 0 0 0 2px rgba(255,255,255,.55), 0 4px 10px rgba(81,40,4,.08);
}
#academic .academic-stage-rule {
  height: 5px;
  margin: 18px 0 24px;
  background:
    linear-gradient(90deg, transparent 0 3%, var(--academic-wine) 14%, var(--academic-gold-soft) 47%, #fff6cf 50%, var(--academic-gold-soft) 53%, var(--teal) 86%, transparent 97%);
  box-shadow: 0 1px 0 rgba(255,255,255,.8);
}
#academic .academic-card {
  padding: 25px 24px 22px;
  border: 1px solid rgba(166,103,17,.43) !important;
  border-radius: 12px !important;
  background:
    radial-gradient(circle at 50% 0%, rgba(237,205,122,.08), transparent 32%),
    linear-gradient(180deg, rgba(255,254,249,.98), rgba(253,246,229,.95)) !important;
  box-shadow:
    0 7px 16px rgba(73,36,4,.055),
    inset 0 0 0 3px rgba(255,255,255,.56) !important;
}
#academic .academic-card::before,
#academic .academic-card::after {
  content: "✦";
  position: absolute;
  top: 8px;
  color: rgba(176,117,27,.44);
  font: 700 9px/1 Georgia, serif;
}
#academic .academic-card::before { left: 10px; }
#academic .academic-card::after { right: 10px; }
#academic .academic-card--ragini { border-top: 4px double #c99a38 !important; }
#academic .academic-card--vijay { border-top: 4px double #397f7e !important; }
#academic .academic-card h4 {
  color: var(--academic-wine);
  font-size: 20px;
  letter-spacing: .025em;
}
#academic .academic-card > p { color: #4f3827; }
#academic .academic-card .academic-detail {
  border-top: 1px solid rgba(176,117,27,.22);
}
#academic .academic-filmstage-hint {
  color: #80694f;
  letter-spacing: .01em;
}

@media (max-width: 980px) {
  #academic .academic-filmstrip-shell {
    padding-top: 12px;
    padding-bottom: 16px;
  }
  #academic .academic-filmstrip-tab {
    flex-basis: 150px;
    min-height: 100px;
  }
}
@media (max-width: 700px) {
  #academic .academic-filmstage {
    padding: 19px 12px 21px;
    border-radius: 18px;
  }
  #academic .academic-filmstage::before,
  #academic .academic-filmstage::after {
    width: 22px;
    height: 22px;
    top: 12px;
  }
  #academic .academic-filmstage-ornament {
    height: 28px;
    margin-bottom: 14px;
  }
  #academic .academic-filmstrip-shell {
    margin-inline: -2px;
    padding-inline: 4px;
  }
  #academic .academic-filmstrip-tab {
    flex-basis: 132px;
    min-height: 92px;
    border-radius: 12px !important;
  }
  #academic .academic-filmstrip-icon { width: 30px; height: 30px; }
  #academic .academic-filmstrip-icon svg { width: 22px; height: 22px; }
  #academic .academic-stage {
    padding: 32px 14px 20px;
    border-radius: 14px;
  }
  #academic .academic-stage::before { width: 145px; height: 26px; }
  #academic .academic-stage::after { inset: 7px; border-radius: 9px; }
  #academic .academic-stage-rule { margin: 15px 0 19px; }
  #academic .academic-card { padding: 21px 16px 17px; }
}
@media (max-width: 430px) {
  #academic .academic-filmstrip-tab { flex-basis: 122px; min-height: 88px; }
  #academic .academic-filmstrip-label { font-size: 12px; letter-spacing: .06em; }
  #academic .academic-stage-head { align-items: start; }
  #academic .academic-stage-count { min-width: 62px; min-height: 32px; }
  #academic .academic-card h4 { font-size: 18px; }
}
@media (prefers-reduced-motion: reduce) {
  #academic .academic-filmstrip-tab.active,
  #academic .academic-filmstrip-tab:hover,
  #academic .academic-filmstrip-tab:focus-visible { translate: none !important; }
}

/* =====================================================================
   V35 — CONTROLS DIRECTLY BELOW HERITAGE TOP ORNAMENTS
   Reorders presentation only. Existing carousel/stepper interaction,
   animation systems, keyboard and touch behavior remain unchanged.
   ===================================================================== */
#foundation .foundation-coverflow-controls {
  margin-top: 2px;
}
#foundation .foundation-coverflow-dots {
  margin-top: 12px;
}
#foundation .foundation-coverflow-hint {
  margin: 8px auto 16px;
}
#foundation .foundation-coverflow-stage {
  margin-top: 0;
}

#virtues .virtue-stepper-actions {
  margin: 2px 0 0;
}
#virtues .virtue-stepper-hint--top {
  margin: 10px auto clamp(16px, 2vw, 22px);
}
#virtues .virtue-stepper-progress-shell {
  margin-top: 0;
}

@media (max-width: 760px) {
  #foundation .foundation-coverflow-controls {
    margin-top: 0;
  }
  #foundation .foundation-coverflow-hint {
    margin: 7px auto 14px;
  }
  #virtues .virtue-stepper-actions {
    margin-top: 0;
  }
  #virtues .virtue-stepper-hint--top {
    margin: 9px auto 15px;
  }
}

/* ======================================================================
   v36 FINAL MOBILE/TABLET LANDSCAPE WELCOME FIT
   The opening screen is the only fixed-height, non-scrolling composition in
   the site. Very shallow landscape phones previously pushed Begin / Exit
   below the visible browser area. This responsive two-column arrangement
   keeps the complete welcome visible without changing portrait or desktop.
   ====================================================================== */
@media (orientation: landscape) and (max-height: 520px) and (max-width: 1100px) {
  #threshold {
    width: 100% !important;
    height: 100dvh !important;
    min-height: 100dvh !important;
    max-height: 100dvh !important;
    overflow: hidden !important;
    padding: max(3px, env(safe-area-inset-top)) max(4px, env(safe-area-inset-right)) max(3px, env(safe-area-inset-bottom)) max(4px, env(safe-area-inset-left)) !important;
  }

  #threshold .threshold-inner {
    box-sizing: border-box !important;
    display: grid !important;
    grid-template-columns: minmax(145px, 34%) minmax(0, 1fr) !important;
    grid-template-rows: repeat(9, auto) !important;
    column-gap: clamp(8px, 2vw, 22px) !important;
    align-content: center !important;
    align-items: center !important;
    justify-items: center !important;
    width: min(100%, 980px) !important;
    height: 100% !important;
    min-height: 0 !important;
    max-height: 100% !important;
    margin: 0 auto !important;
    padding: 4px clamp(10px, 2.4vw, 24px) !important;
    transform: none !important;
    overflow: hidden !important;
  }

  #threshold .diya-scene {
    grid-column: 1 !important;
    grid-row: 1 / -1 !important;
    align-self: center !important;
    justify-self: center !important;
    flex: none !important;
    width: clamp(180px, 27vw, 235px) !important;
    height: clamp(138px, 43vh, 182px) !important;
    margin: 0 !important;
    transform: scale(.68) !important;
    transform-origin: center center !important;
  }

  #threshold .threshold-welcome,
  #threshold .t-d-welcome,
  #threshold .threshold-line,
  #threshold .t-fr7-top,
  #threshold .threshold-names,
  #threshold .t-fr7-bot,
  #threshold .threshold-title,
  #threshold .t-title-orn,
  #threshold .threshold-actions {
    grid-column: 2 !important;
    min-width: 0 !important;
    max-width: 100% !important;
  }

  #threshold .threshold-welcome {
    margin: 0 auto !important;
    font-size: clamp(21px, 4.2vh, 28px) !important;
    line-height: .98 !important;
    letter-spacing: .07em !important;
  }
  #threshold .threshold-welcome::after {
    height: 7px !important;
    margin-top: 0 !important;
  }
  #threshold .t-d-welcome {
    width: min(72%, 250px) !important;
    height: 7px !important;
    margin: 0 auto 1px !important;
  }
  #threshold .threshold-line {
    width: min(100%, 48ch) !important;
    margin: 1px auto !important;
    padding: 0 2px !important;
    font-size: clamp(11.5px, 2.8vh, 14px) !important;
    line-height: 1.14 !important;
    white-space: normal !important;
    text-wrap: balance !important;
  }
  #threshold .threshold-line br { display: none !important; }

  #threshold .t-fr7-top {
    width: min(90%, 430px) !important;
    height: 7px !important;
    margin: 1px auto 0 !important;
  }
  #threshold .threshold-names {
    width: 100% !important;
    margin: 0 auto !important;
    padding: 0 2px !important;
    font-size: clamp(11px, 2.65vh, 13.5px) !important;
    line-height: 1.08 !important;
    letter-spacing: .025em !important;
    white-space: nowrap !important;
    text-align: center !important;
  }
  #threshold .threshold-name-separator { display: none !important; }
  #threshold .threshold-name-break { display: block !important; }
  #threshold .t-fr7-bot {
    width: min(90%, 430px) !important;
    height: 9px !important;
    margin: 0 auto !important;
  }
  #threshold .threshold-title {
    width: min(100%, 24ch) !important;
    margin: 1px auto 0 !important;
    font-size: clamp(18px, 4.2vh, 24px) !important;
    line-height: 1.02 !important;
    letter-spacing: .025em !important;
    text-wrap: balance !important;
  }
  #threshold .t-title-orn {
    width: min(76%, 300px) !important;
    height: 7px !important;
    margin: 0 auto !important;
  }
  #threshold .threshold-actions {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    justify-content: center !important;
    gap: 8px !important;
    width: fit-content !important;
    margin: 3px auto 0 !important;
    padding: 3px !important;
  }
  #threshold .threshold-btn {
    min-width: 88px !important;
    min-height: 34px !important;
    padding: 6px clamp(16px, 3vw, 24px) !important;
    font-size: clamp(12px, 2.8vh, 14px) !important;
    line-height: 1 !important;
  }
}

/* Ultra-shallow browser windows: retain the same two-column hierarchy, but
   tighten only the ornamental spacing. No content is removed. */
@media (orientation: landscape) and (max-height: 350px) and (max-width: 760px) {
  #threshold .threshold-inner {
    grid-template-columns: minmax(128px, 31%) minmax(0, 1fr) !important;
    column-gap: 6px !important;
    padding: 2px 8px !important;
  }
  #threshold .diya-scene {
    width: 174px !important;
    height: 124px !important;
    transform: scale(.58) !important;
  }
  #threshold .threshold-welcome { font-size: 20px !important; }
  #threshold .threshold-line { font-size: 11px !important; line-height: 1.08 !important; }
  #threshold .threshold-names { font-size: 10.5px !important; line-height: 1.02 !important; }
  #threshold .threshold-title { font-size: 17px !important; }
  #threshold .threshold-btn { min-height: 32px !important; padding-block: 5px !important; }
  #threshold .t-d-welcome,
  #threshold .t-fr7-top,
  #threshold .t-fr7-bot,
  #threshold .t-title-orn { height: 5px !important; }
}

/* ======================================================================
   v36 MOBILE/TABLET PAGE-EDGE SAFETY
   Off-stage 3D coverflow cards and decorative mandalas intentionally extend
   beyond their section boxes. Prevent those transforms from creating a
   page-level horizontal pan on large tablets while preserving every local
   horizontal carousel/filmstrip scroller.
   ====================================================================== */
@media (max-width: 1399px) {
  html, body {
    max-width: 100% !important;
    overflow-x: hidden !important;
    overflow-x: clip !important;
  }
}

/* ======================================================================
   v37 — COMPACT VIRTUES AUDIO + NAMED GUIDED TABS + INSTANT COVERFLOW
   The two recorded-message controls now live once outside the explanation
   stage. Virtue navigation is moved into the stage, with named heritage tabs
   and compact spacing. Foundational Legacy controls are centered as one unit.
   ====================================================================== */
#virtues .visually-hidden {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0 0 0 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

/* Foundation: one centered toolbar above the 3D stage. */
#foundation .foundation-coverflow-toolbar {
  width: min(100%, 720px);
  margin: 0 auto clamp(10px, 1.2vw, 14px);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
}
#foundation .foundation-coverflow-toolbar .foundation-coverflow-controls {
  width: min(100%, 360px);
  margin: 0 auto;
  justify-content: center;
}
#foundation .foundation-coverflow-toolbar .foundation-coverflow-dots {
  width: max-content;
  max-width: 100%;
  margin: 10px auto 0;
  justify-content: center;
}
#foundation .foundation-coverflow-toolbar .foundation-coverflow-hint {
  width: min(100%, 520px);
  margin: 7px auto 0;
  text-align: center;
}
#foundation .foundation-highlights > span {
  transition:
    transform .18s cubic-bezier(.22, 1, .36, 1),
    opacity .12s ease,
    border-color .18s ease,
    box-shadow .18s ease,
    filter .18s ease !important;
}
#foundation .foundation-coverflow-dot::before {
  transition: width .16s cubic-bezier(.22, 1, .36, 1), background .16s ease, border-color .16s ease !important;
}

/* Virtue summary belongs to the outer heritage tile, not inside the stage. */
#virtues .virtue-guided-stepper {
  padding-top: clamp(16px, 1.8vw, 24px);
  padding-bottom: clamp(16px, 1.8vw, 24px);
}
#virtues .virtue-stepper-ornament {
  margin-top: -4px;
  margin-bottom: 5px;
}
#virtues .virtue-stepper-stage-heading--outer {
  width: min(100%, 900px);
  max-width: 900px;
  margin: 0 auto 7px;
  padding: 0 clamp(4px, 1vw, 10px);
  text-align: center;
}
#virtues .virtue-stepper-stage-heading--outer > p:last-child {
  max-width: 820px;
  margin: 0 auto;
  color: #745d42;
  font: italic clamp(15px, 1.45vw, 18px)/1.48 var(--font-serif, Georgia, serif);
  text-wrap: balance;
}

/* One shared pair of recordings, outside the changing virtue explanation. */
#virtues .virtue-global-audio {
  width: min(100%, 620px);
  margin: 8px auto 10px;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: center;
  justify-content: center;
  gap: 10px;
}
#virtues .virtue-global-audio .voice-open {
  width: 100%;
  min-width: 0;
  min-height: 44px;
  margin: 0;
  padding-block: 7px !important;
  font-size: clamp(14px, 1.25vw, 16px);
  white-space: normal;
  text-align: center;
}
#virtues .virtue-global-audio .voice-ico {
  width: 25px;
  height: 25px;
  flex: 0 0 25px;
}

/* The navigation/progress tools now sit inside the stage at its top. */
#virtues .virtue-stepper-stage {
  padding: clamp(12px, 1.4vw, 17px) clamp(13px, 1.8vw, 20px) clamp(15px, 1.8vw, 21px);
  transition: opacity .10s ease, transform .10s ease, filter .10s ease;
}
#virtues .virtue-stepper-tools {
  width: 100%;
  margin: 0 auto 11px;
  display: grid;
  gap: 6px;
  align-items: center;
  justify-items: center;
}
#virtues .virtue-stepper-actions {
  width: 100%;
  margin: 0;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: clamp(8px, 1.1vw, 13px);
  align-items: center;
}
#virtues .virtue-stepper-dots {
  width: 100%;
  min-width: 0;
  display: flex;
  justify-content: center;
  gap: clamp(5px, .7vw, 8px);
  overflow-x: auto;
  overflow-y: hidden;
  scrollbar-width: none;
  overscroll-behavior-inline: contain;
  padding: 2px 3px 4px;
  -webkit-overflow-scrolling: touch;
}
#virtues .virtue-stepper-dots::-webkit-scrollbar { display: none; }
#virtues .virtue-step-dot {
  width: auto;
  height: 40px;
  flex: 0 0 auto;
  min-width: 96px;
  padding: 0 13px;
  border-radius: 999px;
  font: 700 clamp(11px, 1vw, 13px)/1 var(--font-body, sans-serif);
  letter-spacing: .035em;
  white-space: nowrap;
  transition: transform .14s ease, box-shadow .14s ease, background .14s ease, color .14s ease;
}
#virtues .virtue-step-dot::after {
  inset: 4px;
  border-radius: 999px;
}
#virtues .virtue-stepper-nav {
  min-height: 42px;
  padding: 8px 14px;
  font-size: 14px;
  transition: transform .14s ease, box-shadow .14s ease, border-color .14s ease, opacity .14s ease;
}
#virtues .virtue-stepper-hint--top {
  margin: 1px auto 0;
  max-width: 760px;
  font-size: 12px;
  line-height: 1.35;
}
#virtues .virtue-stepper-progress-shell {
  width: 100%;
  margin: 1px 0 0;
}
#virtues .virtue-stepper-progress-track { height: 5px; }
#virtues .virtue-stepper-progress-track > span {
  transition: width .14s cubic-bezier(.22, 1, .36, 1);
}
#virtues .virtue-stepper-meta {
  justify-content: flex-end;
  margin-top: 4px;
  font-size: 11px;
}
#virtues .virtue-stepper-parent-grid {
  gap: 11px;
}
#virtues .virtue-guided-stepper .parent-card {
  padding: clamp(14px, 1.5vw, 18px);
}
#virtues .virtue-guided-stepper .parent-top {
  margin-bottom: 4px;
}
#virtues .virtue-guided-stepper .virtue-panel {
  padding-top: 5px;
  line-height: 1.62;
}
#virtues .virtue-stepper-stage.virtue-step-enter {
  animation: virtueStageEnterFast .18s cubic-bezier(.22, 1, .36, 1) both;
}
@keyframes virtueStageEnterFast {
  from { opacity: .72; transform: translateY(4px); }
  to { opacity: 1; transform: translateY(0); }
}
#virtues .virtue-stepper-stage.virtue-step-leave {
  opacity: .70;
  transform: translateY(2px) scale(.999);
}

@media (max-width: 900px) {
  #virtues .virtue-stepper-actions {
    grid-template-columns: 1fr 1fr;
    gap: 8px;
  }
  #virtues #virtuePrev { grid-column: 1; grid-row: 1; }
  #virtues #virtueNext { grid-column: 2; grid-row: 1; }
  #virtues .virtue-stepper-dots {
    grid-column: 1 / -1;
    grid-row: 2;
    justify-content: flex-start;
    padding-inline: 1px;
  }
  #virtues .virtue-step-dot {
    min-width: 108px;
    height: 42px;
  }
}

@media (max-width: 560px) {
  #foundation .foundation-coverflow-toolbar {
    width: 100%;
    margin-bottom: 9px;
  }
  #foundation .foundation-coverflow-toolbar .foundation-coverflow-controls {
    width: min(100%, 280px);
  }
  #foundation .foundation-coverflow-toolbar .foundation-coverflow-dots {
    width: min(100%, 300px);
    flex-wrap: nowrap;
    overflow-x: auto;
    scrollbar-width: none;
    padding: 1px 2px 3px;
  }
  #foundation .foundation-coverflow-toolbar .foundation-coverflow-dots::-webkit-scrollbar { display: none; }

  #virtues .virtue-guided-stepper {
    padding: 15px 11px;
  }
  #virtues .virtue-stepper-ornament {
    margin-bottom: 4px;
  }
  #virtues .virtue-stepper-stage-heading--outer {
    margin-bottom: 6px;
  }
  #virtues .virtue-stepper-stage-heading--outer > p:last-child {
    font-size: 14px;
    line-height: 1.42;
  }
  #virtues .virtue-global-audio {
    grid-template-columns: 1fr;
    width: min(100%, 360px);
    gap: 7px;
    margin: 7px auto 9px;
  }
  #virtues .virtue-global-audio .voice-open {
    min-height: 42px;
    font-size: 14px;
  }
  #virtues .virtue-stepper-stage {
    padding: 11px 10px 14px;
  }
  #virtues .virtue-stepper-nav {
    min-height: 42px;
    padding-inline: 10px;
  }
  #virtues .virtue-step-dot { min-width: 104px; }
  #virtues .virtue-stepper-hint--top {
    font-size: 11.5px;
    padding-inline: 2px;
  }
  #virtues .virtue-stepper-parent-grid {
    gap: 9px;
  }
  #virtues .virtue-guided-stepper .parent-card {
    padding: 13px 12px;
  }
  #virtues .virtue-guided-stepper .avatar-frame {
    width: 40px;
    height: 40px;
  }
  #virtues .virtue-guided-stepper .parent-top h4 {
    font-size: 17px;
  }
  #virtues .virtue-guided-stepper .virtue-panel {
    font-size: 15px;
    line-height: 1.56;
  }
}

@media (prefers-reduced-motion: reduce) {
  #foundation .foundation-highlights > span,
  #foundation .foundation-coverflow-dot::before,
  #virtues .virtue-stepper-stage,
  #virtues .virtue-stepper-progress-track > span,
  #virtues .virtue-step-dot,
  #virtues .virtue-stepper-nav {
    transition: none !important;
    animation: none !important;
  }
}

/* ===== v38 SCROLL-STABILITY SAFETY =====
   Dynamic archive/carousel content changes should never become the browser's
   page-level scroll anchor. This keeps wheel, trackpad and touch scrolling
   stable while cards/tabs update inside these sections. */
#foundation .foundation-coverflow-stage,
#virtues .virtue-stepper-stage,
#academic .academic-stage {
  overflow-anchor: none;
}

/* ======================================================================
   v39 — FINAL INTERACTION + PRESENTATION REFINEMENTS
   Foundation: every visible 3D card is tappable; tap/swipe/arrows remain.
   Virtues: explanation copy reduced by exactly 1.5pt and current virtue
   receives an explicit heritage highlight.
   Guest Tribute: only the two Wisdom headings are centred.
   Sacred Dedication: mirrors the Thank You screen's celestial animation
   vocabulary while preserving the Sacred layout and responsive geometry.
   ====================================================================== */

/* Foundational Legacy — make the whole visible card face an unmistakable tap target. */
#foundation .foundation-highlights > span:not(.is-active) {
  cursor: pointer !important;
  -webkit-tap-highlight-color: rgba(214,169,53,.16);
  touch-action: manipulation;
}
#foundation .foundation-highlights > span:not(.is-active):active {
  filter: brightness(1.035) saturate(1.04);
}

/* Virtues & Wisdom — 1.5pt (2px) reduction from the prior reflection copy. */
#virtues .virtue-guided-stepper .virtue-panel {
  font-size: clamp(14px, 1.38vw, 16px) !important;
}
#virtues .virtue-step-dot[aria-current="step"],
#virtues .virtue-step-dot.active {
  position: relative;
  color: #fff0ba !important;
  border-color: rgba(231,191,88,.98) !important;
  background:
    radial-gradient(circle at 34% 27%, rgba(170,72,83,.98), #711f2b 55%, #4f1420 100%) !important;
  box-shadow:
    inset 0 0 0 2px rgba(255,236,164,.18),
    0 0 0 3px rgba(214,169,53,.14),
    0 8px 20px rgba(94,31,39,.19),
    0 0 16px rgba(214,169,53,.19) !important;
  transform: translateY(-2px) scale(1.035);
}
#virtues .virtue-step-dot[aria-current="step"]::before {
  content: "✦";
  position: absolute;
  top: -8px;
  left: 50%;
  transform: translateX(-50%);
  color: #d8aa3d;
  font: 700 8px/1 Georgia, serif;
  text-shadow: 0 0 7px rgba(239,205,112,.75);
  animation: thanksTitleTwinkle 2.4s ease-in-out infinite;
  pointer-events: none;
}
@media (max-width:560px) {
  #virtues .virtue-guided-stepper .virtue-panel {
    font-size: 13px !important;
    line-height: 1.56;
  }
}

/* Guest Tribute — centre only the requested Wisdom headings. */
#guest-tribute .wisdom-spotlight-copy .mini-eyebrow,
#guest-tribute #wisdomSpotlightHeading {
  width: 100%;
  text-align: center !important;
  text-align-last: center !important;
}

/* Sacred Dedication — Thank You celestial animation parity. */
#sacred.sacred-celestial {
  --thanks-burgundy:#711f2b;
  --thanks-gold:#d6a935;
  --thanks-pale-gold:#f0d77b;
  --thanks-teal:#2f716e;
  position: relative;
  isolation: isolate;
  overflow: hidden;
}
#sacred .sacred-ambient {
  position:absolute;
  inset:0;
  z-index:1;
  overflow:hidden;
  pointer-events:none;
  contain:paint;
}
#sacred .sacred-aurora {
  position:absolute;
  left:50%;
  top:50%;
  width:min(92vw,1120px);
  aspect-ratio:1.8/1;
  border-radius:50%;
  opacity:.24;
  filter:blur(2px);
  transform:translate(-50%,-50%) rotate(-8deg) scale(.92);
  background:
    radial-gradient(ellipse at 42% 45%,rgba(240,215,121,.24),transparent 48%),
    radial-gradient(ellipse at 68% 55%,rgba(47,113,110,.10),transparent 40%);
  animation:thanksAuroraDrift 10s ease-in-out infinite alternate;
}
#sacred .sacred-aurora--two {
  width:min(72vw,900px);
  opacity:.15;
  animation-duration:13s;
  animation-direction:alternate-reverse;
  background:
    radial-gradient(ellipse at 55% 44%,rgba(113,31,43,.10),transparent 48%),
    radial-gradient(ellipse at 35% 60%,rgba(214,169,53,.14),transparent 44%);
}
#sacred .sacred-orbit {
  position:absolute;
  left:50%;
  top:50%;
  width:min(88vw,980px);
  aspect-ratio:1/1;
  border-radius:50%;
  border:1px dashed rgba(214,169,53,.12);
  transform:translate(-50%,-50%) rotate(-8deg);
  opacity:.52;
  animation:thanksOrbitTurn 28s linear infinite;
}
#sacred .sacred-orbit::before,
#sacred .sacred-orbit::after {
  content:"";
  position:absolute;
  width:9px;
  height:9px;
  border-radius:50%;
  background:radial-gradient(circle,#fff7ca 0 22%,#d6a935 42%,rgba(214,169,53,0) 72%);
  box-shadow:0 0 10px rgba(214,169,53,.55);
}
#sacred .sacred-orbit::before { left:8%; top:20%; }
#sacred .sacred-orbit::after { right:10%; bottom:17%; background:radial-gradient(circle,#e7fffb 0 22%,#2f716e 42%,rgba(47,113,110,0) 72%); }
#sacred .sacred-orbit--two {
  width:min(68vw,760px);
  animation-duration:37s;
  animation-direction:reverse;
  border-color:rgba(47,113,110,.11);
}
#sacred .sacred-firefly {
  position:absolute;
  width:5px;
  height:5px;
  border-radius:50%;
  background:#e6b74e;
  box-shadow:0 0 8px rgba(230,183,78,.90),0 0 18px rgba(214,169,53,.36);
  opacity:0;
  animation:thanksFirefly 6.6s ease-in-out infinite;
}
#sacred .sacred-firefly--1{left:12%;top:27%;animation-delay:-.4s}
#sacred .sacred-firefly--2{left:24%;top:72%;animation-delay:-2.1s;animation-duration:7.4s}
#sacred .sacred-firefly--3{left:39%;top:18%;animation-delay:-3.8s;animation-duration:5.8s}
#sacred .sacred-firefly--4{left:58%;top:80%;animation-delay:-1.3s;background:#7eb9b4;box-shadow:0 0 8px rgba(126,185,180,.85),0 0 18px rgba(47,113,110,.34)}
#sacred .sacred-firefly--5{right:27%;top:22%;animation-delay:-4.7s;animation-duration:7.1s}
#sacred .sacred-firefly--6{right:14%;top:63%;animation-delay:-2.9s}
#sacred .sacred-firefly--7{right:7%;top:35%;animation-delay:-5.4s;animation-duration:8s;background:#7eb9b4;box-shadow:0 0 8px rgba(126,185,180,.85),0 0 18px rgba(47,113,110,.34)}
#sacred .sacred-firefly--8{left:8%;top:56%;animation-delay:-6.1s;animation-duration:7.7s}

#sacred .sacred-content,
#sacred .sacred-heading-stack,
#sacred .dedication-plain,
#sacred .sacred-close { z-index: 3; }

#sacred .section-nav-emblem[data-nav-emblem="sacred"] {
  position:relative;
  overflow:visible;
  animation:thanksHeartFloat 4.4s ease-in-out infinite !important;
  filter:drop-shadow(0 0 7px rgba(214,169,53,.32));
}
#sacred .section-nav-emblem[data-nav-emblem="sacred"]::before,
#sacred .section-nav-emblem[data-nav-emblem="sacred"]::after {
  content:"";
  position:absolute;
  inset:-8px;
  border:1px solid rgba(214,169,53,.38);
  border-radius:50%;
  opacity:0;
  animation:thanksEmblemPulse 3.6s ease-out infinite;
  pointer-events:none;
}
#sacred .section-nav-emblem[data-nav-emblem="sacred"]::after {
  animation-delay:1.8s;
  border-color:rgba(47,113,110,.30);
}
#sacred .sacred-title-halo {
  position:absolute;
  left:50%;
  top:52%;
  z-index:-1;
  width:min(82vw,940px);
  height:170%;
  border-radius:50%;
  transform:translate(-50%,-50%) scale(.92);
  background:radial-gradient(ellipse,rgba(242,215,121,.24) 0,rgba(214,169,53,.09) 38%,transparent 72%);
  animation:thanksTitleHalo 4.8s ease-in-out infinite;
  pointer-events:none;
}
#sacred .sacred-title-spark {
  position:absolute;
  z-index:4;
  top:56%;
  color:#d7a72f;
  font-size:clamp(13px,1.25vw,19px);
  text-shadow:0 0 7px rgba(244,206,99,.8),0 0 16px rgba(194,127,30,.38);
  animation:thanksTitleTwinkle 2.4s ease-in-out infinite;
  pointer-events:none;
}
#sacred .sacred-title-spark--left { left:clamp(8%,18vw,24%); }
#sacred .sacred-title-spark--right { right:clamp(8%,18vw,24%); animation-delay:-1.2s; }
#sacred .sacred-celestial-title {
  position:relative;
  overflow:hidden;
}
#sacred .sacred-celestial-title::before {
  content:"";
  position:absolute;
  inset:-16% -10%;
  pointer-events:none;
  background:linear-gradient(105deg,transparent 30%,rgba(255,244,173,0) 42%,rgba(255,235,140,.95) 50%,rgba(255,244,173,0) 58%,transparent 70%);
  transform:translateX(-125%) skewX(-14deg);
  mix-blend-mode:screen;
  animation:thanksTitleSweep 4.8s cubic-bezier(.4,0,.2,1) infinite;
}

#sacred .sacred-celestial-message {
  overflow:hidden;
  isolation:isolate;
  border-radius:22px;
  padding:clamp(10px,1.5vw,16px) clamp(15px,2.5vw,28px) !important;
  background:
    radial-gradient(circle at 50% 0%,rgba(255,246,190,.18),transparent 52%),
    linear-gradient(145deg,rgba(255,253,244,.28),rgba(249,239,213,.18));
  border:1px solid rgba(190,133,39,.18);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.54),0 12px 34px rgba(86,55,18,.04);
}
#sacred .sacred-celestial-message::before {
  content:"";
  position:absolute;
  inset:6px;
  z-index:-1;
  border-radius:inherit;
  border:1px solid transparent;
  background:
    linear-gradient(rgba(255,250,240,.25),rgba(255,250,240,.25)) padding-box,
    linear-gradient(110deg,#6f242b,#d6a935 30%,#f2d779 50%,#2f716e 72%,#8a4c27) border-box;
  opacity:.36;
  pointer-events:none;
  background-size:100% 100%,240% 100%;
  animation:thanksBorderDrift 7s linear infinite;
}
#sacred .sacred-celestial-message::after {
  content:"";
  position:absolute;
  inset:-50% -25%;
  z-index:-2;
  pointer-events:none;
  background:radial-gradient(ellipse at center,rgba(245,213,121,.18),transparent 56%);
  animation:thanksAuraBreathe 4.6s ease-in-out infinite;
}
#sacred .sacred-message-glowline {
  position:absolute;
  inset:0;
  z-index:1;
  border-radius:inherit;
  pointer-events:none;
  overflow:hidden;
}
#sacred .sacred-message-glowline::before {
  content:"";
  position:absolute;
  left:-42%;
  top:-2px;
  width:42%;
  height:2px;
  border-radius:999px;
  background:linear-gradient(90deg,transparent,#f2d779 42%,#fff6c8 62%,#2f716e 100%);
  box-shadow:0 0 10px rgba(240,215,121,.64);
  animation:thanksCardComet 5.4s ease-in-out infinite;
}
#sacred .sacred-message-corner {
  position:absolute;
  z-index:1;
  width:34px;
  height:34px;
  opacity:.56;
  pointer-events:none;
}
#sacred .sacred-message-corner::before,
#sacred .sacred-message-corner::after {
  content:"";
  position:absolute;
  background:linear-gradient(90deg,#a96628,#e2bd55,#2f716e);
  border-radius:999px;
  transform-origin:center;
  animation:thanksCornerGlint 3.8s ease-in-out infinite;
}
#sacred .sacred-message-corner::before { width:26px;height:1px; }
#sacred .sacred-message-corner::after { width:1px;height:26px; }
#sacred .sacred-message-corner--tl { left:10px;top:10px; }
#sacred .sacred-message-corner--br { right:10px;bottom:10px;transform:rotate(180deg); }
#sacred .sacred-message-corner--br::before,
#sacred .sacred-message-corner--br::after { animation-delay:-1.9s; }
#sacred .sacred-message-spark {
  position:absolute;
  z-index:3;
  pointer-events:none;
  color:#d3a132;
  line-height:1;
  text-shadow:0 0 7px rgba(255,224,128,.95),0 0 18px rgba(188,126,29,.46);
  animation:thanksSparkle 3.1s ease-in-out infinite;
}
#sacred .sacred-message-spark--1 { top:12%;left:3%;font-size:13px; }
#sacred .sacred-message-spark--2 { top:23%;right:4%;font-size:16px;animation-delay:-.8s;color:#2f716e; }
#sacred .sacred-message-spark--3 { bottom:18%;left:4%;font-size:14px;animation-delay:-1.6s; }
#sacred .sacred-message-spark--4 { bottom:12%;right:3%;font-size:12px;animation-delay:-2.3s; }

#sacred .sacred-celestial-actions .btn {
  position:relative;
  overflow:hidden;
  isolation:isolate;
}
#sacred .sacred-celestial-actions .btn::after {
  content:"";
  position:absolute;
  top:-70%;
  bottom:-70%;
  left:-54%;
  width:30%;
  transform:skewX(-19deg);
  background:linear-gradient(90deg,transparent,rgba(255,249,205,.60),transparent);
  opacity:0;
  pointer-events:none;
}
#sacred .sacred-celestial-actions .btn:hover::after,
#sacred .sacred-celestial-actions .btn:focus-visible::after {
  animation:thanksButtonGleam .72s ease-out;
}
#sacred .thanks-pointer-spark {
  position:absolute;
  z-index:8;
  width:6px;
  height:6px;
  margin:-3px 0 0 -3px;
  border-radius:50%;
  pointer-events:none;
  background:radial-gradient(circle,#fff9d1 0 18%,#e4b64d 36%,rgba(228,182,77,0) 72%);
  box-shadow:0 0 8px rgba(238,203,104,.70);
  animation:thanksPointerSpark .72s ease-out forwards;
}

#sacred.in-view .sacred-heading-stack { animation:thanksTitleArrive .9s cubic-bezier(.2,.72,.2,1) both; }
#sacred.in-view .sacred-celestial-message { animation:thanksCardArrive 1s .16s cubic-bezier(.2,.72,.2,1) both; }
#sacred.in-view .sacred-celestial-message { animation-name:thanksCardArrive,thanksWordsArrive; animation-duration:1s,.9s; animation-delay:.16s,.34s; animation-timing-function:cubic-bezier(.2,.72,.2,1),ease-out; animation-fill-mode:both; }
#sacred.in-view .sacred-celestial-actions { animation:thanksActionsArrive .85s .82s ease-out both; }

@media (max-width:700px) {
  #sacred .sacred-title-halo { width:112vw;height:145%; }
  #sacred .sacred-title-spark { font-size:11px;top:58%; }
  #sacred .sacred-title-spark--left { left:3%; }
  #sacred .sacred-title-spark--right { right:3%; }
  #sacred .sacred-celestial-message {
    padding:10px 12px !important;
    border-radius:18px;
  }
  #sacred .sacred-orbit { width:118vw; }
  #sacred .sacred-orbit--two { width:92vw; }
  #sacred .sacred-firefly--2,
  #sacred .sacred-firefly--5,
  #sacred .sacred-firefly--7 { display:none; }
}
@media (max-width:380px) {
  #sacred .sacred-title-spark { display:none; }
  #sacred .sacred-celestial-message { padding-inline:10px !important; }
}
@media (hover:none), (pointer:coarse) {
  #sacred .sacred-celestial-actions .btn::after { display:none; }
}
@media (prefers-reduced-motion: reduce) {
  #virtues .virtue-step-dot[aria-current="step"]::before,
  #sacred .sacred-ambient,
  #sacred .section-nav-emblem[data-nav-emblem="sacred"],
  #sacred .section-nav-emblem[data-nav-emblem="sacred"]::before,
  #sacred .section-nav-emblem[data-nav-emblem="sacred"]::after,
  #sacred .sacred-title-halo,
  #sacred .sacred-title-spark,
  #sacred .sacred-celestial-title::before,
  #sacred .sacred-celestial-message::before,
  #sacred .sacred-celestial-message::after,
  #sacred .sacred-message-glowline::before,
  #sacred .sacred-message-corner::before,
  #sacred .sacred-message-corner::after,
  #sacred .sacred-message-spark,
  #sacred.in-view .sacred-heading-stack,
  #sacred.in-view .sacred-celestial-message,
  #sacred.in-view .sacred-celestial-actions,
  #sacred .sacred-celestial-actions .btn::after,
  #sacred .thanks-pointer-spark {
    animation:none !important;
  }
  #sacred .thanks-pointer-spark { display:none !important; }
}

/* ======================================================================
   v40 — FINAL REQUESTED REFINEMENTS
   ====================================================================== */

/* Sacred Dedication: keep the Thank You animation language but remove the
   moving colour wash recorded across the dedication paragraph itself. */
#sacred .sacred-celestial-message {
  background:
    radial-gradient(circle at 50% 0%, rgba(255,246,190,.18), transparent 52%),
    linear-gradient(145deg, rgba(255,253,244,.94), rgba(249,239,213,.90)) !important;
}
#sacred .sacred-celestial-message::after {
  animation: none !important;
  opacity: .28;
}

/* Foundational Legacy: toolbar and deck are mathematically centered within
   the coverflow's outer panel, independent of text width. */
#foundation .foundation-coverflow-toolbar,
#foundation .foundation-coverflow-stage {
  width: min(100%, 1120px);
  margin-left: auto !important;
  margin-right: auto !important;
}
#foundation .foundation-coverflow-toolbar {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
}
#foundation .foundation-coverflow-controls,
#foundation .foundation-coverflow-dots,
#foundation .foundation-coverflow-hint {
  margin-left: auto;
  margin-right: auto;
}
#foundation .foundation-highlights > span {
  transition:
    transform .18s cubic-bezier(.22,1,.36,1),
    opacity .16s ease,
    border-color .18s ease,
    box-shadow .18s ease,
    filter .18s ease !important;
}

/* Virtues & Wisdom: use teal/gold for the selected virtue instead of the
   previous burgundy fill, and reduce inner explanation copy by another 1.5pt. */
#virtues .virtue-step-dot[aria-current="step"],
#virtues .virtue-step-dot.active {
  color: #fff7d6 !important;
  border-color: rgba(224,185,79,.98) !important;
  background:
    radial-gradient(circle at 32% 24%, rgba(83,151,145,.98), #2f716e 58%, #215552 100%) !important;
  box-shadow:
    inset 0 0 0 2px rgba(255,239,171,.18),
    0 0 0 3px rgba(214,169,53,.14),
    0 8px 20px rgba(32,94,91,.20),
    0 0 17px rgba(214,169,53,.20) !important;
}
#virtues .virtue-guided-stepper .virtue-panel {
  font-size: clamp(12px, 1.18vw, 14px) !important;
}
@media (max-width:560px) {
  #virtues .virtue-guided-stepper .virtue-panel { font-size: 11.5px !important; }
}

/* Guest Tribute: center the two requested Wisdom headings relative to the
   complete tile, not merely to the middle text column. */
#guest-tribute .wisdom-spotlight { position: relative; padding-top: 78px; }
#guest-tribute .wisdom-spotlight-copy .mini-eyebrow,
#guest-tribute #wisdomSpotlightHeading {
  position: absolute;
  left: 50%;
  width: min(78%, 900px);
  transform: translateX(-50%);
  text-align: center !important;
  text-align-last: center !important;
  z-index: 3;
}
#guest-tribute .wisdom-spotlight-copy .mini-eyebrow { top: 21px; margin: 0; }
#guest-tribute #wisdomSpotlightHeading { top: 48px; margin: 0; }
@media (max-width:620px) {
  #guest-tribute .wisdom-spotlight { padding-top: 92px; }
  #guest-tribute .wisdom-spotlight-copy .mini-eyebrow,
  #guest-tribute #wisdomSpotlightHeading { width: calc(100% - 34px); }
  #guest-tribute .wisdom-spotlight-copy .mini-eyebrow { top: 18px; }
  #guest-tribute #wisdomSpotlightHeading { top: 46px; }
}

/* Approved Guest Book attachments open in one modal and always return focus
   and scroll position to the originating comment. */
.att-preview {
  appearance: none;
  border: 0;
  padding: 0;
  background: transparent;
  border-radius: 14px;
  cursor: pointer;
  line-height: 0;
}
.att-preview:focus-visible { outline: 3px solid rgba(47,113,110,.45); outline-offset: 3px; }
.tribute-attachment-dialog {
  width: min(94vw, 980px);
  max-height: min(90vh, 820px);
  padding: clamp(22px, 3vw, 34px);
  border: 1px solid rgba(198,146,42,.55);
  border-radius: 24px;
  background: linear-gradient(160deg,#fffdf6,#f8efd9);
  color: var(--text);
}
.tribute-attachment-dialog h3 { text-align:center; color:var(--heading); margin:4px 48px 18px; }
.tribute-attachment-body {
  min-height: 180px;
  display:grid;
  place-items:center;
  overflow:auto;
  border:1px solid rgba(198,146,42,.24);
  border-radius:18px;
  background:rgba(255,255,255,.72);
  padding:12px;
}
.tribute-attachment-media { display:block; max-width:100%; border-radius:12px; }
.tribute-attachment-media--image { max-height:62vh; object-fit:contain; }
.tribute-attachment-media--video { width:min(100%,860px); max-height:60vh; background:#110c08; }
.tribute-attachment-media--audio { width:min(100%,680px); }
.tribute-attachment-media--document { width:100%; height:min(60vh,620px); border:0; background:#fff; }
.tribute-attachment-actions { display:flex; justify-content:center; gap:12px; flex-wrap:wrap; margin-top:16px; }
@media (max-width:620px) {
  .tribute-attachment-dialog { width:96vw; padding:18px 12px 16px; border-radius:18px; }
  .tribute-attachment-dialog h3 { margin-inline:42px; font-size:1.05rem; }
  .tribute-attachment-body { min-height:140px; padding:8px; }
  .tribute-attachment-media--document { height:55vh; }
  .tribute-attachment-actions { flex-direction:column; }
  .tribute-attachment-actions .btn { width:100%; }
}


/* ======================================================================
   v42 — VERIFIED VISIBLE FIXES (latest overrides)
   These selectors intentionally live last in the stylesheet so the requested
   changes are visible even with the website's long historical CSS cascade.
   ====================================================================== */

/* SACRED DEDICATION
   Remove ONLY the broad drifting colour-wash/aurora motion seen in the video.
   Keep the rest of the Thank You animation vocabulary: orbit lights, fireflies,
   title shimmer, halo, sparkles, border/comet accents, entrance and button gleam. */
#sacred .sacred-aurora {
  animation: none !important;
  transform: translate(-50%,-50%) rotate(-8deg) scale(.96) !important;
  opacity: .14 !important;
}
#sacred .sacred-aurora--two {
  animation: none !important;
  opacity: .09 !important;
}
#sacred .sacred-celestial-message::after {
  animation: none !important;
  transform: none !important;
  opacity: .18 !important;
}

/* FOUNDATIONAL LEGACY
   On desktop, the carousel lives inside the text column beside a 220px portrait
   + 32px gap. Expand it back across that 252px so its visual center is the
   center of the OUTER foundation tile. Tablet/mobile are single-column. */
@media (min-width:981px) {
  #foundation .foundation-coverflow {
    width: calc(100% + 252px) !important;
    max-width: none !important;
    margin-left: -252px !important;
    margin-right: 0 !important;
  }
}
@media (max-width:980px) {
  #foundation .foundation-coverflow {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
}
#foundation .foundation-coverflow-toolbar,
#foundation .foundation-coverflow-stage {
  width: min(100%,1120px) !important;
  margin-inline: auto !important;
  text-align: center !important;
}
#foundation .foundation-coverflow-stage {
  touch-action: pan-y !important;
  -webkit-user-select: none;
  user-select: none;
}
#foundation .foundation-highlights > span {
  cursor: pointer !important;
  transition:
    transform .14s cubic-bezier(.22,1,.36,1),
    opacity .12s ease,
    border-color .14s ease,
    box-shadow .14s ease,
    filter .14s ease !important;
}
#foundation .foundation-highlights > span:not(.is-active):active {
  filter: brightness(1.07) saturate(1.08) !important;
}

/* VIRTUES & WISDOM
   Selected virtue: unmistakable deep teal + antique-gold active state.
   Inner explanation text: visibly 1.5pt smaller than the previous 14px desktop
   / 13px mobile treatment while retaining readable line height. */
#virtues .virtue-step-dot[aria-current="step"],
#virtues .virtue-step-dot[aria-selected="true"],
#virtues .virtue-step-dot.active {
  color: #fff4c8 !important;
  border-color: #d9aa3d !important;
  background: linear-gradient(180deg,#3f8580 0%,#2f716e 52%,#205552 100%) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,249,205,.48),
    inset 0 0 0 2px rgba(240,210,126,.14),
    0 0 0 3px rgba(217,170,61,.20),
    0 8px 18px rgba(32,85,82,.25),
    0 0 18px rgba(217,170,61,.28) !important;
  text-shadow: 0 1px 1px rgba(38,44,28,.45) !important;
}
#virtues .virtue-step-dot[aria-current="step"] span,
#virtues .virtue-step-dot[aria-selected="true"] span {
  color: inherit !important;
  font-weight: 800 !important;
}
#virtues .virtue-guided-stepper .virtue-panel {
  font-size: 12px !important; /* 14px minus ~1.5pt (2px) */
  line-height: 1.52 !important;
}
@media (max-width:560px) {
  #virtues .virtue-guided-stepper .virtue-panel {
    font-size: 11px !important; /* 13px minus ~1.5pt */
    line-height: 1.5 !important;
  }
}

/* GUEST TRIBUTE — structural full-width heading centered on the same axis as
   the section heading. Only these two lines are centered; quote/author/button
   keep their practical layout. */
#guest-tribute .wisdom-spotlight {
  display: grid !important;
  grid-template-columns: auto minmax(0,1fr) auto !important;
  align-items: center !important;
  gap: 16px !important;
  padding-top: 22px !important;
}
#guest-tribute .wisdom-spotlight-heading {
  grid-column: 1 / -1 !important;
  width: 100% !important;
  position: static !important;
  transform: none !important;
  margin: 0 auto 2px !important;
  text-align: center !important;
}
#guest-tribute .wisdom-spotlight-heading .mini-eyebrow,
#guest-tribute .wisdom-spotlight-heading #wisdomSpotlightHeading {
  position: static !important;
  transform: none !important;
  width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
  text-align: center !important;
  text-align-last: center !important;
}
#guest-tribute .wisdom-spotlight-heading .mini-eyebrow { margin-bottom: 8px !important; }
#guest-tribute .wisdom-spotlight-heading #wisdomSpotlightHeading { margin-top: 0 !important; margin-bottom: 0 !important; }
@media (max-width:650px) {
  #guest-tribute .wisdom-spotlight {
    grid-template-columns: 1fr !important;
    justify-items: center !important;
    text-align: center;
    gap: 12px !important;
  }
  #guest-tribute .wisdom-spotlight-heading,
  #guest-tribute .wisdom-spotlight-icon,
  #guest-tribute .wisdom-spotlight-copy,
  #guest-tribute .wisdom-cycle-btn { grid-column: 1 !important; }
  #guest-tribute .wisdom-spotlight-copy blockquote,
  #guest-tribute .wisdom-spotlight-copy .experience-author { text-align: center !important; }
  #guest-tribute .wisdom-cycle-btn { width: auto !important; min-width: 180px; }
}

/* GUEST BOOK ATTACHMENT VIEWER — explicit modal presentation and return path. */
.tribute-attachment-dialog::backdrop {
  background: rgba(31,20,12,.66) !important;
  backdrop-filter: blur(4px);
}
.tribute-attachment-dialog[open] { display:block; }
.tribute-attachment-document-note { text-align:center; max-width:560px; line-height:1.6; padding:24px 16px; }
@media (max-width:620px) {
  .tribute-attachment-dialog { max-height: 92vh !important; }
  .tribute-attachment-actions { gap: 9px !important; }
}

/* === BUNDLE: beige-navigation-theme.css === */
:root {
  --site-beige: #e8dcc4;
  --site-beige-hover: #f3ead7;
  --site-beige-ink: #35230f;
  --nav-burgundy: #800020;
  --nav-rule-width: min(1540px, 94vw);
  --marigold-light: #f7c85a;
  --marigold-mid: #edae32;
  --marigold-deep: #b86b08;
}

html body :is(.topbar, .topbar.scrolled) {
  background: var(--nav-burgundy) !important;
  background-color: var(--nav-burgundy) !important;
  background-image: none !important;
}

html body .topbar {
  width: 100%;
  min-height: 168px;
  padding: 74px 16px 36px;
  overflow: visible;
  display: flex;
  align-items: center;
  justify-content: center;
}

html body .nav-plaque,
html body .nav-plaque::before {
  background: var(--site-beige) !important;
  background-color: var(--site-beige) !important;
  background-image: none !important;
  border: 0 !important;
  box-shadow: none !important;
}

html body .nav-plaque::after { content: none !important; display: none !important; }

.nav-thin-ornament {
  position: absolute;
  left: 50%;
  width: 570px;
  height: 78px;
  max-width: calc(100vw - 8px);
  transform: translateX(-50%);
  overflow: hidden;
  pointer-events: none;
  z-index: 4;
}
.nav-thin-ornament img {
  display: block;
  width: 570px;
  height: 156px;
  max-width: none;
  mix-blend-mode: normal;
  image-rendering: auto;
  shape-rendering: geometricPrecision;
  filter: drop-shadow(0 0 2px rgba(255, 226, 123, .5));
}
.nav-thin-ornament--upper { top: 0; }
.nav-thin-ornament--upper img { transform: translateY(0); }
.nav-thin-ornament--lower { top: 132px; }
.nav-thin-ornament--lower img { transform: translateY(-78px); }


html body .topbar::before,
html body .topbar::after {
  content: "" !important;
  position: absolute !important;
  left: 50% !important;
  right: auto !important;
  width: var(--nav-rule-width) !important;
  transform: translateX(-50%) !important;
  height: 2pt !important;
  border: 0 !important;
  background: linear-gradient(to right,
    #d4af37 0,
    #d4af37 calc(50% - 282px),
    transparent calc(50% - 282px),
    transparent calc(50% + 282px),
    #d4af37 calc(50% + 282px),
    #d4af37 100%) !important;
  box-shadow: 0 0 5px rgba(212, 175, 55, .38) !important;
  pointer-events: none !important;
  z-index: 1 !important;
}
html body .topbar::before { top: 69px !important; }
html body .topbar::after { top: 140px !important; }

html body .nav-plaque {
  position: relative;
  z-index: 2;
  width: var(--nav-rule-width) !important;
  max-width: var(--nav-rule-width) !important;
  justify-content: center !important;
  flex-wrap: wrap !important;
  background: transparent !important;
  background-color: transparent !important;
}
html body .nav-plaque .nav-links {
  justify-content: center !important;
  flex-wrap: wrap !important;
}

html body :is(
  button:not(.gallery-card),
  .btn, .threshold-btn, .filter-chip, .filter-btn, .virtue-btn,
  .tab, .cite-tab, .view-btn, .aview-btn, .cal-btn, .date-clear,
  .mode-chip, .help-toggle, [data-story], .to-top,
  .expand-pub-table-btn, .att-chip, .pub-cite, .voice-open,
  .voice-close, #tourNext, #tourClose, .tour-actions button,
  .admin-publish, .admin-tribute .actions button,
  .modal-close, .story-close, .gv-nav, .tl-photo-nav,
  .voice-btn, .voice-back, .cal-nav, .cal-day.has,
  .upload-clear, .menu-toggle, .photo-zoom-btn
) {
  background: var(--site-beige) !important;
  background-color: var(--site-beige) !important;
  background-image: none !important;
  color: var(--site-beige-ink) !important;
}
html body :is(
  button:not(.gallery-card),
  .btn, .threshold-btn, .filter-chip, .filter-btn, .virtue-btn,
  .tab, .cite-tab, .view-btn, .aview-btn, .cal-btn, .date-clear,
  .mode-chip, .help-toggle, [data-story], .to-top,
  .expand-pub-table-btn, .att-chip, .pub-cite, .voice-open,
  .voice-close, #tourNext, #tourClose, .tour-actions button,
  .admin-publish, .admin-tribute .actions button
):hover { background: var(--site-beige-hover) !important; }

html body .nav-plaque .nav-links > :is(a, button.nav-exit-btn) {
  animation: navBeigePulse var(--nav-pulse-duration, 10s) ease-in-out var(--nav-pulse-delay, 0s) infinite !important;
}
@keyframes navBeigePulse {
  0%, 100% { filter: brightness(1); text-shadow: 0 0 2px rgba(185,139,45,.25); }
  48% { filter: brightness(1.08); text-shadow: 0 0 8px rgba(215,164,52,.72); }
}

@media (max-width: 720px) {
  html body .topbar { min-height: 168px; padding: 74px 8px 36px; }
  .nav-thin-ornament {
    width: min(570px, calc(100vw - 8px));
  }
  html body .nav-plaque { width: 92vw !important; max-width: 92vw !important; }
}

html body .nav-plaque,
html body .nav-plaque::before {
  background: transparent !important;
  background-color: transparent !important;
}
html body .nav-plaque :is(.brand, .nav-links a, .nav-exit-btn) {
  color: #fff1bd !important;
}
html body .nav-plaque .nav-links > :is(a, button.nav-exit-btn) {
  background: transparent !important;
  background-color: transparent !important;
  box-shadow: none !important;
}

html body :is(
  button:not(.gallery-card):not(.nav-exit-btn),
  a.btn, a.to-top, a.att-chip, a[role="button"],
  .threshold-btn, .filter-chip, .filter-btn, .virtue-btn,
  .tab, .cite-tab, .view-btn, .aview-btn, .cal-btn, .date-clear,
  .mode-chip, .help-toggle, [data-story], .expand-pub-table-btn,
  .pub-cite, .voice-open, .voice-close, .photo-zoom-btn
) {
  position: relative !important;
  overflow: hidden !important;
  isolation: isolate !important;
  color: #4b2600 !important;
  background: linear-gradient(180deg, #ffe59a 0%, var(--marigold-light) 34%, var(--marigold-mid) 68%, #d88914 100%) !important;
  background-color: var(--marigold-light) !important;
  border: 1px solid #9a5705 !important;
  border-radius: 999px !important;
  box-shadow: inset 0 3px 2px rgba(255,255,230,.92), inset 0 -4px 5px rgba(125,57,0,.38), inset 3px 0 4px rgba(255,228,133,.44), 0 5px 9px rgba(86,40,0,.30), 0 0 12px rgba(247,184,55,.46) !important;
  animation: marigoldEmbossedGlow 4.8s ease-in-out infinite !important;
}
html body :is(
  button:not(.gallery-card):not(.nav-exit-btn),
  a.btn, a.to-top, a.att-chip, a[role="button"],
  .threshold-btn, .filter-chip, .filter-btn, .virtue-btn,
  .tab, .cite-tab, .view-btn, .aview-btn, .cal-btn, .date-clear,
  .mode-chip, .help-toggle, [data-story], .expand-pub-table-btn,
  .pub-cite, .voice-open, .voice-close, .photo-zoom-btn
)::before {
  content: "" !important;
  display: block !important;
  position: absolute !important;
  inset: 2px 4px 48% !important;
  border-radius: 999px 999px 55% 55% !important;
  background: linear-gradient(180deg, rgba(255,255,255,.72), rgba(255,247,207,.16)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.94) !important;
  opacity: .88 !important;
  pointer-events: none !important;
  z-index: 1 !important;
  animation: marigoldGlassSweep 5.6s ease-in-out infinite !important;
}
@keyframes marigoldEmbossedGlow {
  0%, 100% { filter: brightness(1); }
  50% { filter: brightness(1.12) saturate(1.08); }
}
@keyframes marigoldGlassSweep {
  0%, 100% { opacity: .58; transform: translateX(-3%); }
  50% { opacity: .94; transform: translateX(3%); }
}


html body :is(
  button:not(.gallery-card):not(.nav-exit-btn),
  a.btn, a.to-top, a.att-chip, a[role="button"],
  input[type="submit"], input[type="button"], input[type="reset"]
) {
  --button-glow-delay: 0s;
  appearance: none !important;
  position: relative !important;
  overflow: hidden !important;
  isolation: isolate !important;
  color: #4a2500 !important;
  background-color: #f7c85a !important;
  background-image: linear-gradient(180deg, #fff4c7 0%, #ffe08b 18%, #f7c85a 44%, #eca82d 73%, #d47c0d 100%) !important;
  border: 1px solid #965305 !important;
  border-radius: 999px !important;
  box-shadow:
    inset 0 4px 3px rgba(255,255,244,.98),
    inset 0 -6px 8px rgba(112,49,0,.43),
    inset 4px 0 6px rgba(255,235,157,.60),
    inset -4px 0 6px rgba(138,61,0,.25),
    0 7px 11px rgba(75,34,0,.36),
    0 0 18px rgba(247,184,55,.68) !important;
  transform: translateY(0) scale(1) !important;
  transition: transform .18s ease, box-shadow .24s ease, filter .24s ease !important;
  animation: finalMarigoldEmboss 4.6s ease-in-out var(--button-glow-delay) infinite !important;
}
html body :is(
  button:not(.gallery-card):not(.nav-exit-btn),
  a.btn, a.to-top, a.att-chip, a[role="button"]
)::before {
  content: "" !important;
  display: block !important;
  position: absolute !important;
  inset: 2px 5px 47% !important;
  border: 0 !important;
  border-radius: 999px 999px 58% 58% !important;
  background: linear-gradient(180deg, rgba(255,255,255,.94), rgba(255,250,218,.38) 62%, rgba(255,231,135,.06)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,1) !important;
  opacity: .9 !important;
  pointer-events: none !important;
  z-index: 1 !important;
  animation: finalMarigoldGlass 5.4s ease-in-out var(--button-glow-delay) infinite !important;
}
html body :is(
  button:not(.gallery-card):not(.nav-exit-btn),
  a.btn, a.to-top, a.att-chip, a[role="button"]
):hover {
  filter: brightness(1.12) saturate(1.08) !important;
  transform: translateY(-2px) scale(1.025) !important;
  box-shadow: inset 0 5px 4px rgba(255,255,245,.99), inset 0 -6px 8px rgba(112,49,0,.40), 0 10px 16px rgba(75,34,0,.38), 0 0 24px rgba(255,194,62,.82) !important;
}
html body :is(
  button:not(.gallery-card):not(.nav-exit-btn),
  a.btn, a.to-top, a.att-chip, a[role="button"]
):active {
  transform: translateY(3px) scale(.96) !important;
  filter: brightness(.96) !important;
  box-shadow: inset 0 6px 10px rgba(103,43,0,.50), inset 0 -2px 3px rgba(255,241,182,.76), 0 2px 4px rgba(75,34,0,.32) !important;
  transition-duration: .07s !important;
}
html body :is(button, a.btn, a.to-top, a.att-chip):nth-of-type(3n+1) { --button-glow-delay: -1.4s; }
html body :is(button, a.btn, a.to-top, a.att-chip):nth-of-type(3n+2) { --button-glow-delay: -3.1s; }
@keyframes finalMarigoldEmboss {
  0%, 100% { filter: brightness(1) saturate(1); }
  48% { filter: brightness(1.14) saturate(1.10); }
}
@keyframes finalMarigoldGlass {
  0%, 100% { opacity: .62; transform: translateX(-5%) scaleX(.96); }
  50% { opacity: .96; transform: translateX(5%) scaleX(1.02); }
}


html body .nav-plaque .nav-links > :is(a, button.nav-exit-btn) {
  position: relative !important;
  overflow: visible !important;
  font-family: 'Raleway', 'Jost', Arial, sans-serif !important;
  font-weight: 600 !important;
  letter-spacing: .01em !important;
  color: transparent !important;
  -webkit-text-fill-color: transparent !important;
  text-shadow: none !important;
  background-color: transparent !important;
  background-image:
    linear-gradient(100deg, rgba(255,255,255,0) 36%, rgba(226,140,48,.90) 50%, rgba(255,255,255,0) 64%),
    radial-gradient(circle at 50% 38%, #c2620d 0%, #b1560a 28%, #a85207 55%, #8f4406 100%) !important;
  background-size: 300% 100%, 100% 100% !important;
  background-repeat: no-repeat, no-repeat !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  filter: drop-shadow(0 1px 0 rgba(255,255,244,.70)) drop-shadow(0 2px 8px rgba(86,42,5,.22)) !important;
  animation: navWelcomeSweep 5.2s linear var(--nav-pulse-delay, 0s) infinite !important;
}
html body .nav-plaque .nav-links > :is(a, button.nav-exit-btn)::before {
  content: "" !important;
  position: absolute !important;
  inset: -8px -7px !important;
  border: 0 !important;
  pointer-events: none !important;
  background-image:
    radial-gradient(circle, #fff8e6 0 1.8px, rgba(255,232,170,.48) 2.7px, transparent 3.8px),
    radial-gradient(circle, #ffe6b0 0 1.3px, rgba(255,216,140,.45) 2.1px, transparent 3.1px) !important;
  background-repeat: no-repeat, no-repeat !important;
  animation: navWelcomeOrbit 7.5s linear var(--nav-pulse-delay, 0s) infinite, navWelcomeTwinkle 2.9s ease-in-out var(--nav-pulse-delay, 0s) infinite !important;
}
@keyframes navWelcomeSweep {
  0% { background-position: 190% 0, 50% 38%; }
  50% { background-position: 45% 0, 53% 34%; }
  100% { background-position: -90% 0, 50% 38%; }
}
@keyframes navWelcomeOrbit {
  0% { background-position: 4% 26%, 96% 74%; }
  25% { background-position: 32% 4%, 68% 96%; }
  50% { background-position: 96% 26%, 4% 74%; }
  75% { background-position: 66% 96%, 34% 4%; }
  100% { background-position: 4% 26%, 96% 74%; }
}
@keyframes navWelcomeTwinkle { 0%,100% { opacity:.35; } 50% { opacity:1; } }


html body #threshold :is(.threshold-btn, .threshold-begin, .threshold-exit),
html body .farewell :is(.threshold-btn, .threshold-begin, .threshold-exit),
html body #guestbook :is(button, .btn),
html body :is(.admin-lock, .admin-tribute) button {
  color: #4a2500 !important;
  background-color: #f7c85a !important;
  background-image: linear-gradient(180deg, #fff4c7 0%, #ffe08b 18%, #f7c85a 44%, #eca82d 73%, #d47c0d 100%) !important;
  border: 1px solid #965305 !important;
  border-radius: 999px !important;
  box-shadow: inset 0 4px 3px rgba(255,255,244,.98), inset 0 -6px 8px rgba(112,49,0,.43), inset 4px 0 6px rgba(255,235,157,.60), inset -4px 0 6px rgba(138,61,0,.25), 0 7px 11px rgba(75,34,0,.36), 0 0 18px rgba(247,184,55,.68) !important;
  animation: startMarigoldEmboss 4.6s ease-in-out var(--button-glow-delay, 0s) infinite !important;
  filter: none !important;
}
html body #threshold :is(.threshold-btn, .threshold-begin, .threshold-exit)::before,
html body .farewell :is(.threshold-btn, .threshold-begin, .threshold-exit)::before {
  content: "" !important;
  display: block !important;
  position: absolute !important;
  inset: 2px 5px 47% !important;
  border: 0 !important;
  border-radius: 999px 999px 58% 58% !important;
  background: linear-gradient(180deg, rgba(255,255,255,.94), rgba(255,250,218,.38) 62%, rgba(255,231,135,.06)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,1) !important;
  opacity: .9 !important;
  pointer-events: none !important;
  z-index: 1 !important;
  animation: finalMarigoldGlass 5.4s ease-in-out var(--button-glow-delay, 0s) infinite !important;
}
@keyframes startMarigoldEmboss {
  0%,100% { box-shadow: inset 0 4px 3px rgba(255,255,244,.98), inset 0 -6px 8px rgba(112,49,0,.43), inset 4px 0 6px rgba(255,235,157,.60), inset -4px 0 6px rgba(138,61,0,.25), 0 7px 11px rgba(75,34,0,.36), 0 0 14px rgba(247,184,55,.54); }
  50% { box-shadow: inset 0 5px 4px rgba(255,255,248,1), inset 0 -6px 8px rgba(112,49,0,.38), inset 4px 0 7px rgba(255,239,174,.72), inset -4px 0 6px rgba(138,61,0,.20), 0 8px 13px rgba(75,34,0,.38), 0 0 25px rgba(255,198,70,.86); }
}


html body .nav-plaque .nav-links > :is(a, button.nav-exit-btn) {
  font-family: 'Raleway', 'Jost', Arial, sans-serif !important;
  font-weight: 700 !important;
  color: #ffd84f !important;
  -webkit-text-fill-color: #ffd84f !important;
  background: none !important;
  background-image: none !important;
  filter: drop-shadow(0 1px 0 #6f3d00) drop-shadow(0 0 4px rgba(255,216,79,.38)) !important;
  text-shadow: 0 1px 0 rgba(87,43,0,.55) !important;
  animation: menuGoldBreath 4.8s ease-in-out var(--nav-pulse-delay, 0s) infinite !important;
}
html body .nav-plaque .nav-links > :is(a, button.nav-exit-btn)::before {
  content: none !important;
  display: none !important;
  animation: none !important;
}
html body .nav-plaque .nav-links > :is(a, button.nav-exit-btn) > .live-button-bubbles,
html body .nav-plaque .nav-links > :is(a, button.nav-exit-btn) > .live-button-bubbles * {
  display: none !important;
  animation: none !important;
}
@keyframes menuGoldBreath {
  0%,100% { color:#ffd84f; -webkit-text-fill-color:#ffd84f; filter:drop-shadow(0 1px 0 #6f3d00) drop-shadow(0 0 3px rgba(255,216,79,.28)); }
  50% { color:#fff0a0; -webkit-text-fill-color:#fff0a0; filter:drop-shadow(0 1px 0 #6f3d00) drop-shadow(0 0 8px rgba(255,224,103,.70)); }
}


html body .nav-plaque::after {
  content: "" !important;
  display: block !important;
  position: absolute !important;
  inset: 3px 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  pointer-events: none !important;
  z-index: 0 !important;
  opacity: .82 !important;
  background-image:
    radial-gradient(circle, #fff6bc 0 2px, rgba(255,219,83,.58) 2.4px, transparent 4px),
    radial-gradient(circle, #ffd84f 0 1.6px, rgba(255,216,79,.42) 2.2px, transparent 3.7px),
    radial-gradient(circle, #fff0a0 0 1.8px, rgba(255,230,127,.46) 2.3px, transparent 3.8px),
    radial-gradient(circle, #ffc933 0 1.5px, rgba(255,201,51,.40) 2.1px, transparent 3.6px),
    radial-gradient(circle, #ffe575 0 1.8px, rgba(255,229,117,.42) 2.4px, transparent 3.9px) !important;
  background-repeat: no-repeat !important;
  animation: navSurfaceBubbles 13.7s linear infinite, navSurfaceTwinkle 3.6s ease-in-out infinite !important;
}
@keyframes navSurfaceBubbles {
  0% { background-position: 8% 86%, 27% 18%, 49% 74%, 71% 28%, 92% 80%; }
  24% { background-position: 16% 24%, 38% 78%, 58% 20%, 82% 76%, 6% 34%; }
  51% { background-position: 31% 82%, 53% 24%, 76% 72%, 96% 18%, 20% 77%; }
  77% { background-position: 47% 20%, 68% 82%, 89% 30%, 15% 70%, 36% 24%; }
  100% { background-position: 8% 86%, 27% 18%, 49% 74%, 71% 28%, 92% 80%; }
}
@keyframes navSurfaceTwinkle { 0%,100% { opacity:.48; } 50% { opacity:.92; } }


html body :is(
  main button:not(.gallery-card), main a.btn, main a.to-top,
  #threshold button, .farewell button,
  .modal button, .story-modal button, .voice-modal button,
  .admin-lock button, .admin-tribute button
) {
  color: #4a2500 !important;
  background-color: #f3bd43 !important;
  background-image: linear-gradient(180deg, #fff6d2 0%, #ffe698 16%, #f8cb60 39%, #e9a52a 70%, #c86e08 100%) !important;
  border: 1px solid #8f4d03 !important;
  border-radius: 999px !important;
  box-shadow: inset 0 4px 3px rgba(255,255,246,.98), inset 0 -7px 9px rgba(103,43,0,.45), inset 4px 0 6px rgba(255,235,157,.62), inset -4px 0 6px rgba(126,52,0,.24), 0 7px 12px rgba(75,34,0,.38), 0 0 20px rgba(247,184,55,.72) !important;
  animation: startMarigoldEmboss 4.6s ease-in-out var(--button-glow-delay,0s) infinite !important;
}

/* === BUNDLE: final-navigation-buttons.css === */

:root {
  --final-nav-burgundy: #800020;
  --final-nav-gold: #d4af37;
  --final-menu-gold: #ffd84f;
  --final-nav-span: min(1920px, calc(100vw - 96px));
  --marigold-hi: #fff7d7;
  --marigold-light: #ffe89e;
  --marigold-mid: #f6c65a;
  --marigold-low: #de9420;
  --marigold-deep: #b86606;
  --marigold-ink: #472907;
}


html body .nav-thin-ornament,
html body .nav-thin-ornament--upper,
html body .nav-thin-ornament--lower {
  display: none !important;
  content: none !important;
}

html body :is(.topbar, .topbar.scrolled) {
  position: sticky !important;
  top: 0 !important;
  width: 100% !important;
  height: 273px !important;
  min-height: 273px !important;
  padding: 0 !important;
  overflow: visible !important;
  background: var(--final-nav-burgundy) !important;
  border: 0 !important;
  outline: 0 !important;
  box-shadow: 0 5px 24px rgba(69, 0, 18, .28) !important;
  isolation: isolate !important;
}

html body .topbar::before,
html body .topbar::after,
html body .nav-plaque::before,
html body .nav-plaque::after {
  content: none !important;
  display: none !important;
  background: none !important;
  border: 0 !important;
  box-shadow: none !important;
}


html body .nav-border-art {
  position: absolute !important;
  inset: 0 auto auto 50% !important;
  width: var(--final-nav-span) !important;
  height: 273px !important;
  transform: translateX(-50%) !important;
  pointer-events: none !important;
  z-index: 2 !important;
}

html body .nav-border-art img {
  position: absolute !important;
  top: 0 !important;
  left: 50% !important;
  display: block !important;
  width: 405px !important;
  height: 273px !important;
  max-width: 100% !important;
  object-fit: contain !important;
  transform: translateX(-50%) !important;
  image-rendering: auto !important;
  filter: drop-shadow(0 0 2px rgba(255, 226, 117, .48)) !important;
}

html body .nav-border-art::before,
html body .nav-border-art::after {
  content: "" !important;
  position: absolute !important;
  left: 0 !important;
  width: 100% !important;
  height: 2px !important;
  background: linear-gradient(to right,
    var(--final-nav-gold) 0,
    var(--final-nav-gold) calc(50% - 190px),
    transparent calc(50% - 190px),
    transparent calc(50% + 190px),
    var(--final-nav-gold) calc(50% + 190px),
    var(--final-nav-gold) 100%) !important;
  box-shadow: 0 0 4px rgba(255, 219, 91, .34) !important;
}

html body .nav-border-art::before { top: 120px !important; }
html body .nav-border-art::after  { top: 187px !important; }


html body .nav-plaque {
  position: absolute !important;
  top: 122px !important;
  left: 50% !important;
  width: var(--final-nav-span) !important;
  max-width: var(--final-nav-span) !important;
  height: 64px !important;
  min-height: 64px !important;
  margin: 0 !important;
  padding: 0 22px !important;
  transform: translateX(-50%) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 28px !important;
  overflow: visible !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  z-index: 4 !important;
}

html body .nav-plaque .brand {
  flex: 0 0 auto !important;
  color: var(--final-menu-gold) !important;
  -webkit-text-fill-color: var(--final-menu-gold) !important;
  text-shadow: 0 1px 0 #5b2a00, 0 0 6px rgba(255, 216, 79, .42) !important;
}

html body .nav-plaque .nav-links {
  min-width: 0 !important;
  display: flex !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  justify-content: center !important;
  gap: clamp(12px, 1.2vw, 25px) !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

html body .nav-plaque .nav-links > :is(a, button.nav-exit-btn) {
  position: relative !important;
  flex: 0 0 auto !important;
  min-width: max-content !important;
  margin: 0 !important;
  padding: 9px 4px !important;
  overflow: visible !important;
  font-family: "Raleway", "Jost", Arial, sans-serif !important;
  font-size: clamp(13px, .92vw, 18px) !important;
  font-weight: 700 !important;
  line-height: 1.15 !important;
  letter-spacing: .012em !important;
  color: var(--final-menu-gold) !important;
  -webkit-text-fill-color: var(--final-menu-gold) !important;
  background: transparent !important;
  background-image: none !important;
  border: 0 !important;
  border-radius: 999px !important;
  box-shadow: none !important;
  filter: none !important;
  text-shadow: 0 1px 0 #5b2a00, 0 0 5px rgba(255, 216, 79, .38) !important;
  animation: finalMenuGoldGlow var(--nav-pulse-duration, 8.4s) ease-in-out var(--nav-pulse-delay, 0s) infinite !important;
}

html body .nav-plaque .nav-links > :is(a, button.nav-exit-btn)::before {
  content: none !important;
  display: none !important;
}

html body .nav-plaque .nav-links > :is(a, button.nav-exit-btn) > .live-button-bubbles,
html body .nav-plaque .brand > .live-button-bubbles {
  display: none !important;
}

html body .nav-plaque .nav-links > :is(a, button.nav-exit-btn):is(:hover, :focus-visible, .active) {
  color: #fff1a0 !important;
  -webkit-text-fill-color: #fff1a0 !important;
  background: rgba(255, 226, 112, .12) !important;
  text-shadow: 0 1px 0 #532400, 0 0 10px rgba(255, 224, 103, .82) !important;
}

html body .nav-plaque .nav-links > :is(a, button.nav-exit-btn)::after {
  background: var(--final-menu-gold) !important;
  box-shadow: 0 0 5px rgba(255, 216, 79, .58) !important;
}

@keyframes finalMenuGoldGlow {
  0%, 100% { text-shadow: 0 1px 0 #5b2a00, 0 0 3px rgba(255, 216, 79, .28); }
  48%      { text-shadow: 0 1px 0 #5b2a00, 0 0 9px rgba(255, 229, 121, .78); }
}


html body .topbar > .live-button-bubbles {
  position: absolute !important;
  inset: 0 !important;
  z-index: 1 !important;
  display: block !important;
  overflow: hidden !important;
  pointer-events: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: none !important;
  -webkit-mask-image: linear-gradient(to bottom, #000 0 43%, transparent 45% 69%, #000 71% 100%) !important;
  mask-image: linear-gradient(to bottom, #000 0 43%, transparent 45% 69%, #000 71% 100%) !important;
}

html body .topbar > .live-button-bubbles > .live-button-bubble {
  z-index: 1 !important;
  width: min(4px, var(--bubble-size, 4px)) !important;
  height: min(4px, var(--bubble-size, 4px)) !important;
  background: radial-gradient(circle at 34% 28%, #fffde8 0 18%, #ffe682 35%, #d79e27 61%, transparent 76%) !important;
  box-shadow: 0 0 3px rgba(255, 243, 174, .95), 0 0 7px rgba(231, 177, 54, .62) !important;
  mix-blend-mode: screen !important;
}


html body :is(
  button:not(.nav-exit-btn):not(.menu-toggle):not(.gallery-card),
  a.btn, a.to-top, a.att-chip, a[role="button"],
  input[type="submit"], input[type="button"], input[type="reset"]
) {
  appearance: none !important;
  position: relative !important;
  isolation: isolate !important;
  overflow: hidden !important;
  color: var(--marigold-ink) !important;
  -webkit-text-fill-color: var(--marigold-ink) !important;
  background-color: var(--marigold-mid) !important;
  background-image: linear-gradient(180deg,
    var(--marigold-hi) 0%,
    var(--marigold-light) 17%,
    var(--marigold-mid) 43%,
    var(--marigold-low) 73%,
    var(--marigold-deep) 100%) !important;
  border: 1px solid #945008 !important;
  border-radius: 999px !important;
  box-shadow:
    inset 0 4px 3px rgba(255,255,246,.98),
    inset 0 -7px 9px rgba(101,42,0,.46),
    inset 4px 0 7px rgba(255,237,165,.68),
    inset -4px 0 7px rgba(117,47,0,.24),
    0 8px 13px rgba(72,31,0,.38),
    0 0 20px rgba(249,186,55,.72) !important;
  text-shadow: 0 1px 0 rgba(255,248,210,.86) !important;
  filter: none !important;
  transform: translateY(0) scale(1) !important;
  transition: transform .16s ease, filter .22s ease, box-shadow .22s ease !important;
  animation: finalStartButtonGlow 4.8s ease-in-out var(--button-glow-delay, 0s) infinite !important;
}

html body :is(
  button:not(.nav-exit-btn):not(.menu-toggle):not(.gallery-card),
  a.btn, a.to-top, a.att-chip, a[role="button"]
)::before {
  content: "" !important;
  position: absolute !important;
  inset: 2px 5px 48% !important;
  z-index: 0 !important;
  display: block !important;
  pointer-events: none !important;
  border: 0 !important;
  border-radius: 999px 999px 58% 58% !important;
  background: linear-gradient(180deg, rgba(255,255,255,.96), rgba(255,250,218,.42) 64%, rgba(255,231,135,.05)) !important;
  box-shadow: inset 0 1px 0 #fff !important;
  opacity: .92 !important;
  animation: finalStartGlass 5.6s ease-in-out var(--button-glow-delay, 0s) infinite !important;
}

html body :is(
  button:not(.nav-exit-btn):not(.menu-toggle):not(.gallery-card),
  a.btn, a.to-top, a.att-chip, a[role="button"]
)::after {
  content: none !important;
  display: none !important;
}

html body :is(
  button:not(.nav-exit-btn):not(.menu-toggle):not(.gallery-card),
  a.btn, a.to-top, a.att-chip, a[role="button"]
):hover {
  color: #321900 !important;
  -webkit-text-fill-color: #321900 !important;
  filter: brightness(1.10) saturate(1.06) !important;
  transform: translateY(-2px) scale(1.025) !important;
  box-shadow: inset 0 5px 4px rgba(255,255,248,1), inset 0 -7px 9px rgba(101,42,0,.40), 0 11px 17px rgba(72,31,0,.40), 0 0 27px rgba(255,198,70,.88) !important;
}

html body :is(
  button:not(.nav-exit-btn):not(.menu-toggle):not(.gallery-card),
  a.btn, a.to-top, a.att-chip, a[role="button"]
):active {
  transform: translateY(4px) scale(.955) !important;
  filter: brightness(.94) !important;
  box-shadow: inset 0 7px 11px rgba(94,38,0,.54), inset 0 -2px 3px rgba(255,241,182,.78), 0 2px 4px rgba(72,31,0,.30) !important;
  transition-duration: .06s !important;
}

html body :is(.modal-close, .story-close, .gv-nav, .tl-photo-nav, .voice-btn, .voice-back, .cal-nav, .upload-clear) {
  border-radius: 50% !important;
  padding: 0 !important;
}

html body :is(
  button:not(.nav-exit-btn):not(.menu-toggle):not(.gallery-card),
  a.btn, a.to-top, a.att-chip, a[role="button"]
) > .live-button-bubbles {
  z-index: 2 !important;
}

@keyframes finalStartButtonGlow {
  0%,100% {
    box-shadow: inset 0 4px 3px rgba(255,255,246,.98), inset 0 -7px 9px rgba(101,42,0,.46), inset 4px 0 7px rgba(255,237,165,.68), inset -4px 0 7px rgba(117,47,0,.24), 0 8px 13px rgba(72,31,0,.38), 0 0 15px rgba(249,186,55,.56);
  }
  50% {
    box-shadow: inset 0 5px 4px rgba(255,255,250,1), inset 0 -7px 9px rgba(101,42,0,.38), inset 4px 0 8px rgba(255,240,183,.78), inset -4px 0 7px rgba(117,47,0,.19), 0 9px 15px rgba(72,31,0,.40), 0 0 29px rgba(255,204,83,.92);
  }
}

@keyframes finalStartGlass {
  0%,100% { opacity: .68; transform: translateX(-4%) scaleX(.97); }
  50% { opacity: .96; transform: translateX(4%) scaleX(1.02); }
}

@media (max-width: 980px) {
  :root { --final-nav-span: calc(100vw - 24px); }
  html body :is(.topbar, .topbar.scrolled) { height: 190px !important; min-height: 190px !important; }
  html body .nav-border-art { height: 190px !important; overflow: hidden !important; }
  html body .nav-border-art img { width: 282px !important; height: 190px !important; }
  html body .nav-border-art::before { top: 83px !important; }
  html body .nav-border-art::after { top: 130px !important; }
  html body .nav-plaque { top: 85px !important; height: 44px !important; min-height: 44px !important; padding: 0 8px !important; }
  html body .nav-plaque .nav-links {
    top: 52px !important;
    background: var(--final-nav-burgundy) !important;
    border: 1px solid rgba(212,175,55,.60) !important;
  }
}


:root { --final-menu-span: min(1510px, calc(100vw - 48px)); }

html body :is(.topbar, .topbar.scrolled) {
  position: relative !important;
  height: 156px !important;
  min-height: 156px !important;
  padding: 0 !important;
  overflow: visible !important;
  background: #800020 !important;
}

html body .nav-under-border,
html body .nav-border-art,
html body .nav-thin-ornament,
html body .nav-thin-ornament--upper,
html body .nav-thin-ornament--lower { display: none !important; }

html body .topbar::before,
html body .topbar::after,
html body .nav-plaque::before,
html body .nav-plaque::after { content: none !important; display: none !important; }

html body .nav-ornament-frame-final {
  position: absolute !important;
  top: 0 !important;
  left: 50% !important;
  display: block !important;
  width: var(--final-menu-span) !important;
  height: 156px !important;
  transform: translateX(-50%) !important;
  pointer-events: none !important;
  z-index: 2 !important;
}

html body .nav-ornament-frame-final img {
  position: absolute !important;
  top: 0 !important;
  left: 50% !important;
  display: block !important;
  width: 570px !important;
  height: 156px !important;
  max-width: none !important;
  object-fit: contain !important;
  transform: translateX(-50%) !important;
  filter: drop-shadow(0 0 1px rgba(255, 224, 126, .40)) !important;
}

html body .nav-ornament-frame-final::before,
html body .nav-ornament-frame-final::after {
  content: "" !important;
  position: absolute !important;
  left: 0 !important;
  right: 0 !important;
  height: 2px !important;
  background: linear-gradient(90deg,
    #d4af37 0,
    #d4af37 calc(50% - 285px),
    transparent calc(50% - 285px),
    transparent calc(50% + 285px),
    #d4af37 calc(50% + 285px),
    #d4af37 100%) !important;
  box-shadow: 0 0 2px rgba(255, 221, 119, .35) !important;
}
html body .nav-ornament-frame-final::before { top: 68px !important; }
html body .nav-ornament-frame-final::after { top: 111px !important; }

html body .nav-plaque {
  position: absolute !important;
  top: 70px !important;
  left: 50% !important;
  width: var(--final-menu-span) !important;
  max-width: var(--final-menu-span) !important;
  height: 40px !important;
  min-height: 40px !important;
  margin: 0 !important;
  padding: 0 8px !important;
  transform: translateX(-50%) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 18px !important;
  overflow: visible !important;
  background: #eadfc8 !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  z-index: 3 !important;
}

html body .nav-plaque .nav-links {
  display: flex !important;
  flex: 1 1 auto !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 0 !important;
  flex-wrap: nowrap !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

html body .nav-plaque .nav-links > :is(a, button.nav-exit-btn) {
  padding: 4px 10px !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

@media (max-width: 980px) {
  :root { --final-menu-span: calc(100vw - 24px); }
  html body :is(.topbar, .topbar.scrolled) { height: auto !important; min-height: 156px !important; padding: 0 0 70px !important; }
  html body .nav-plaque { position: relative !important; top: 70px !important; left: auto !important; transform: none !important; width: var(--final-menu-span) !important; max-width: var(--final-menu-span) !important; height: auto !important; min-height: 40px !important; margin: 0 auto !important; }
  html body .nav-plaque .brand { display: none !important; }
  html body .nav-plaque .nav-links { flex-wrap: wrap !important; }
}

@media (max-width: 620px) {
  html body .nav-ornament-frame-final img { width: min(570px, 100%) !important; height: auto !important; }
}


:root {
  --nav-burgundy-surface: #800020;
  --nav-menu-beige: #eadfc8;
  --nav-ornament-gold: #c99a2b;
}

html body :is(.topbar, .topbar.scrolled) {
  height: 146px !important;
  min-height: 146px !important;
  padding: 0 !important;
  overflow: visible !important;
  background: var(--nav-burgundy-surface) !important;
  border: 0 !important;
  box-shadow: 0 4px 18px rgba(55, 0, 14, .34) !important;
}

html body .nav-border-art,
html body .nav-thin-ornament,
html body .nav-thin-ornament--upper,
html body .nav-thin-ornament--lower {
  display: none !important;
}

html body .topbar::before,
html body .topbar::after,
html body .nav-plaque::before,
html body .nav-plaque::after {
  content: none !important;
  display: none !important;
  background: none !important;
  border: 0 !important;
  box-shadow: none !important;
}

html body .nav-plaque {
  position: absolute !important;
  top: 16px !important;
  left: 50% !important;
  width: fit-content !important;
  max-width: calc(100vw - 32px) !important;
  height: 56px !important;
  min-height: 56px !important;
  margin: 0 !important;
  padding: 0 26px !important;
  transform: translateX(-50%) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 28px !important;
  overflow: visible !important;
  background: var(--nav-menu-beige) !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  z-index: 4 !important;
}

html body .nav-plaque .brand,
html body .nav-plaque .nav-links > :is(a, button.nav-exit-btn) {
  color: #a16d12 !important;
  -webkit-text-fill-color: #a16d12 !important;
  text-shadow: 0 1px 0 rgba(255, 249, 221, .9), 0 0 4px rgba(161, 109, 18, .18) !important;
}

html body .nav-plaque .nav-links {
  flex-wrap: nowrap !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

html body .nav-plaque .nav-links > :is(a, button.nav-exit-btn) {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

html body .nav-under-border {
  position: absolute !important;
  top: 67px !important;
  left: 50% !important;
  width: min(calc(100% - 32px), 1560px) !important;
  height: 79px !important;
  transform: translateX(-50%) !important;
  pointer-events: none !important;
  z-index: 3 !important;
}

html body .nav-under-border img {
  position: absolute !important;
  top: 0 !important;
  left: 50% !important;
  display: block !important;
  width: 352px !important;
  height: 79px !important;
  max-width: 100% !important;
  object-fit: contain !important;
  transform: translateX(-50%) !important;
  image-rendering: auto !important;
  filter: drop-shadow(0 0 1px rgba(255, 226, 124, .32)) !important;
}

html body .nav-under-border::before,
html body .nav-under-border::after {
  content: "" !important;
  position: absolute !important;
  top: 41px !important;
  height: 1px !important;
  background: var(--nav-ornament-gold) !important;
  box-shadow: 0 0 2px rgba(255, 217, 110, .35) !important;
}

html body .nav-under-border::before {
  left: 0 !important;
  right: calc(50% + 172px) !important;
}

html body .nav-under-border::after {
  left: calc(50% + 172px) !important;
  right: 0 !important;
}

@media (max-width: 980px) {
  html body :is(.topbar, .topbar.scrolled) {
    height: auto !important;
    min-height: 142px !important;
    padding: 12px 0 74px !important;
  }
  html body .nav-plaque {
    position: relative !important;
    top: auto !important;
    left: auto !important;
    transform: none !important;
    width: min(94vw, 760px) !important;
    max-width: 94vw !important;
    height: auto !important;
    min-height: 56px !important;
  }
  html body .nav-under-border {
    top: auto !important;
    bottom: 0 !important;
    width: calc(100vw - 24px) !important;
  }
  html body .nav-plaque .nav-links {
    flex-wrap: wrap !important;
  }
}


:root { --exact-nav-span: min(1510px, calc(100vw - 48px)); }
html body :is(.topbar, .topbar.scrolled) { position:relative !important; height:156px !important; min-height:156px !important; padding:0 !important; overflow:visible !important; background:#800020 !important; }
html body .nav-under-border, html body .nav-border-art, html body .nav-thin-ornament, html body .nav-thin-ornament--upper, html body .nav-thin-ornament--lower { display:none !important; }
html body .nav-ornament-frame-final { position:absolute !important; top:0 !important; left:50% !important; display:block !important; width:var(--exact-nav-span) !important; height:156px !important; transform:translateX(-50%) !important; pointer-events:none !important; z-index:2 !important; }
html body .nav-ornament-frame-final img { position:absolute !important; top:0 !important; left:50% !important; display:block !important; width:570px !important; height:156px !important; max-width:none !important; object-fit:contain !important; transform:translateX(-50%) !important; filter:drop-shadow(0 0 1px rgba(255,224,126,.40)) !important; }
html body .nav-ornament-frame-final::before, html body .nav-ornament-frame-final::after { content:"" !important; position:absolute !important; left:0 !important; right:0 !important; height:2px !important; background:linear-gradient(90deg,#d4af37 0,#d4af37 calc(50% - 285px),transparent calc(50% - 285px),transparent calc(50% + 285px),#d4af37 calc(50% + 285px),#d4af37 100%) !important; box-shadow:0 0 2px rgba(255,221,119,.35) !important; }
html body .nav-ornament-frame-final::before { top:68px !important; }
html body .nav-ornament-frame-final::after { top:111px !important; }
html body .nav-plaque { position:absolute !important; top:70px !important; left:50% !important; width:var(--exact-nav-span) !important; max-width:var(--exact-nav-span) !important; height:40px !important; min-height:40px !important; margin:0 !important; padding:0 8px !important; transform:translateX(-50%) !important; display:flex !important; align-items:center !important; justify-content:center !important; gap:18px !important; overflow:visible !important; background:#eadfc8 !important; border:0 !important; border-radius:0 !important; box-shadow:none !important; z-index:3 !important; }
html body .nav-plaque .nav-links { display:flex !important; flex:1 1 auto !important; align-items:center !important; justify-content:center !important; gap:0 !important; flex-wrap:nowrap !important; background:transparent !important; border:0 !important; box-shadow:none !important; }
html body .nav-plaque .nav-links > :is(a, button.nav-exit-btn) { padding:4px 10px !important; background:transparent !important; border:0 !important; box-shadow:none !important; }
@media (max-width:980px) { :root { --exact-nav-span:calc(100vw - 24px); } html body :is(.topbar,.topbar.scrolled){height:auto !important;min-height:156px !important;padding:0 0 70px !important;} html body .nav-plaque{position:relative !important;top:70px !important;left:auto !important;transform:none !important;width:var(--exact-nav-span) !important;max-width:var(--exact-nav-span) !important;height:auto !important;min-height:40px !important;margin:0 auto !important;} html body .nav-plaque .brand{display:none !important;} html body .nav-plaque .nav-links{flex-wrap:wrap !important;} }
@media (max-width:620px) { html body .nav-ornament-frame-final img { width:min(570px, 100%) !important; height:auto !important; } }


html body .nav-ornament-frame-final,
html body .nav-under-border { display: none !important; }
html body :is(.topbar, .topbar.scrolled) {
  height: 76px !important;
  min-height: 76px !important;
  background: #eadfc8 !important;
  box-shadow: 0 3px 12px rgba(92, 54, 9, .15) !important;
}
html body .nav-plaque {
  top: 18px !important;
  height: 40px !important;
  min-height: 40px !important;
  background: #eadfc8 !important;
}
@media (max-width: 980px) {
  html body :is(.topbar, .topbar.scrolled) { height: auto !important; min-height: 76px !important; padding: 0 0 12px !important; }
  html body .nav-plaque { top: 12px !important; }
}


html body :is(.topbar, .topbar.scrolled) {
  height: 280px !important;
  min-height: 280px !important;
  padding: 0 !important;
  overflow: visible !important;
  background: #eadfc8 !important;
}
html body .nav-supplied-ornament {
  position: absolute !important;
  left: 50% !important;
  display: block !important;
  width: 796px !important;
  height: 114px !important;
  max-width: calc(100vw - 24px) !important;
  transform: translateX(-50%) !important;
  pointer-events: none !important;
  z-index: 2 !important;
}
html body .nav-supplied-ornament img {
  display: block !important;
  width: 796px !important;
  max-width: 100% !important;
  height: 114px !important;
  object-fit: contain !important;
}
html body .nav-supplied-ornament--top { top: 0 !important; }
html body .nav-supplied-ornament--bottom { bottom: 0 !important; transform: translateX(-50%) scaleY(-1) !important; }
html body .nav-plaque {
  top: 114px !important;
  height: 52px !important;
  min-height: 52px !important;
  background: #eadfc8 !important;
  z-index: 3 !important;
}
@media (max-width: 980px) {
  html body :is(.topbar, .topbar.scrolled) { height: auto !important; min-height: 196px !important; padding: 0 0 82px !important; }
  html body .nav-supplied-ornament { width: min(796px, calc(100vw - 24px)) !important; height: auto !important; aspect-ratio: 796 / 114; }
  html body .nav-supplied-ornament img { width: 100% !important; height: auto !important; }
  html body .nav-supplied-ornament--bottom { bottom: 0 !important; }
  html body .nav-plaque { top: 76px !important; }
}


html body :is(.topbar, .topbar.scrolled) {
  height: 222px !important;
  min-height: 222px !important;
  background: #eadfc8 !important;
}
html body .nav-supplied-ornament {
  left: 50% !important;
  width: 796px !important;
  height: 114px !important;
  max-width: calc(100vw - 24px) !important;
  background: transparent !important;
}
html body .nav-supplied-ornament--top { top: 0 !important; }
html body .nav-supplied-ornament--bottom {
  top: 108px !important;
  bottom: auto !important;
  transform: translateX(-50%) scaleY(-1) !important;
}
html body .nav-plaque {
  top: 85px !important;
  height: 52px !important;
  min-height: 52px !important;
  margin: 0 !important;
  background: #eadfc8 !important;
}
@media (max-width: 980px) {
  html body :is(.topbar, .topbar.scrolled) { height: auto !important; min-height: 180px !important; padding: 0 0 72px !important; }
  html body .nav-supplied-ornament--top { top: 0 !important; }
  html body .nav-supplied-ornament--bottom { top: 92px !important; }
  html body .nav-plaque { top: 62px !important; }
}


html body .nav-plaque .nav-links { justify-content: center !important; }
html body .nav-plaque .nav-links > .brand {
  display: inline-flex !important;
  flex: 0 0 auto !important;
  align-items: center !important;
  height: 40px !important;
  margin: 0 6px 0 0 !important;
  padding: 0 10px !important;
  text-decoration: none !important;
}
html body .nav-plaque .nav-links > .brand .brand-text {
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  line-height: 1 !important;
  text-align: left !important;
}
html body .nav-plaque .nav-links > .brand strong {
  font-size: 16px !important;
  line-height: 1 !important;
  color: #a16d12 !important;
}
html body .nav-plaque .nav-links > .brand em {
  margin-top: 3px !important;
  font-size: 9px !important;
  line-height: 1 !important;
  letter-spacing: .16em !important;
  color: #a16d12 !important;
}


html body .nav-supplied-ornament,
html body .nav-ornament-frame-final,
html body .nav-under-border { display: none !important; }
html body :is(.topbar, .topbar.scrolled),
html body .nav-plaque,
html body .nav-plaque .nav-links {
  background: #f5f5dc !important;
  background-color: #f5f5dc !important;
  background-image: none !important;
}
html body :is(.topbar, .topbar.scrolled) {
  height: 76px !important;
  min-height: 76px !important;
  padding: 0 !important;
  border: 0 !important;
  box-shadow: none !important;
}
html body .nav-plaque {
  top: 18px !important;
  height: 40px !important;
  min-height: 40px !important;
}
@media (max-width: 980px) {
  html body :is(.topbar, .topbar.scrolled) { height: auto !important; min-height: 76px !important; padding: 0 0 12px !important; }
  html body .nav-plaque { top: 12px !important; }
}


html body :is(.topbar, .topbar.scrolled),
html body .nav-plaque,
html body .nav-plaque .nav-links {
  background: #eadfc8 !important;
  background-color: #eadfc8 !important;
}


html body .nav-plaque .nav-links > :is(a, button.nav-exit-btn) {
  position: relative !important;
  z-index: 2 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 42px !important;
  padding: 7px 12px !important;
  font-size: clamp(13px, .92vw, 16px) !important;
  font-weight: 800 !important;
  letter-spacing: .045em !important;
  color: #9b5700 !important;
  -webkit-text-fill-color: #9b5700 !important;
  text-shadow: 0 1px 0 rgba(255, 249, 214, .96), 0 0 7px rgba(210, 139, 10, .48) !important;
  filter: drop-shadow(0 1px 0 rgba(255,249,214,.9)) !important;
  animation: navLabelEmphasis 3.4s ease-in-out var(--nav-pulse-delay, 0s) infinite !important;
}
html body .nav-plaque .nav-links > :is(a, button.nav-exit-btn)::after {
  content: "" !important;
  position: absolute !important;
  z-index: -1 !important;
  left: 15% !important;
  right: 15% !important;
  bottom: 3px !important;
  height: 2px !important;
  border-radius: 999px !important;
  background: linear-gradient(90deg, transparent, #d18a0b 22%, #ffe28a 50%, #d18a0b 78%, transparent) !important;
  box-shadow: 0 0 8px rgba(205, 131, 0, .62) !important;
  animation: navLabelUnderline 3.4s ease-in-out var(--nav-pulse-delay, 0s) infinite !important;
}
html body .nav-plaque .nav-links > :is(a, button.nav-exit-btn):is(:hover, :focus-visible, .active) {
  color: #6e3100 !important;
  -webkit-text-fill-color: #6e3100 !important;
  transform: translateY(-2px) scale(1.06) !important;
  text-shadow: 0 1px 0 #fff7d0, 0 0 12px rgba(222, 146, 0, .86) !important;
}
@keyframes navLabelEmphasis {
  0%, 100% { color: #9b5700; -webkit-text-fill-color: #9b5700; text-shadow: 0 1px 0 rgba(255,249,214,.96), 0 0 5px rgba(210,139,10,.35); }
  50% { color: #c47a06; -webkit-text-fill-color: #c47a06; text-shadow: 0 1px 0 #fff9dd, 0 0 12px rgba(225,153,10,.82); }
}
@keyframes navLabelUnderline {
  0%, 100% { opacity: .45; transform: scaleX(.58); }
  50% { opacity: 1; transform: scaleX(1); }
}



/* === BUNDLE: nav-fusion.css === */

:root{
  --nav-wine:#7f1024;
  --nav-wine-deep:#5e0b1a;
  --nav-marigold:#e5ad3d;
  --nav-marigold-soft:#f5d889;
  --nav-cream:#fffaf0;
  --nav-copper:#b66c29;
  --nav-ink:#3d2611;
  --fusion-nav-h:104px;
}
.nav-icon-sprite{position:absolute!important;width:0!important;height:0!important;overflow:hidden!important;pointer-events:none!important}


html body .topbar.heritage-fusion-nav,
html body .topbar.heritage-fusion-nav.scrolled{
  position:sticky!important; top:0!important; z-index:9500!important;
  width:100%!important; height:var(--fusion-nav-h)!important; min-height:var(--fusion-nav-h)!important;
  padding:0!important; margin:0!important; overflow:visible!important;
  display:block!important;
  background:linear-gradient(180deg,var(--nav-wine) 0 46px,var(--nav-cream) 46px 100%)!important;
  border:0!important; border-radius:0!important;
  box-shadow:0 10px 30px rgba(78,35,5,.11)!important;
  animation:none!important;
}
html body .topbar.heritage-fusion-nav::before,
html body .topbar.heritage-fusion-nav::after{display:none!important;content:none!important}

.nav-crown{
  height:46px; display:grid; grid-template-columns:minmax(180px,1fr) minmax(240px,auto) minmax(180px,1fr);
  align-items:center; padding:0 clamp(18px,3vw,48px); position:relative; color:#f8d878;
  background:linear-gradient(90deg,var(--nav-wine-deep),var(--nav-wine) 38%,#8b172d 50%,var(--nav-wine) 62%,var(--nav-wine-deep));
  box-shadow:inset 0 -1px 0 rgba(255,221,143,.22);
}
.nav-crown::after{
  content:"";position:absolute;left:0;right:0;bottom:-2px;height:3px;
  background:linear-gradient(90deg,transparent 0%,var(--nav-marigold) 8%,#ffe4a1 50%,var(--nav-marigold) 92%,transparent 100%);
  opacity:.9;pointer-events:none;
}
html body .heritage-fusion-nav .brand{
  display:inline-flex!important;align-items:center!important;justify-self:start!important;gap:10px!important;
  padding:0!important;margin:0!important;text-decoration:none!important;background:none!important;border:0!important;box-shadow:none!important;
}
html body .heritage-fusion-nav .brand::before,
html body .heritage-fusion-nav .brand::after{display:none!important}
.brand-chakra{width:30px;height:30px;display:grid;place-items:center;border:1px solid rgba(246,205,103,.75);border-radius:50%;color:#f4c85b;box-shadow:0 0 0 3px rgba(255,214,112,.06)}
.brand-chakra svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;animation:fusionChakra 18s linear infinite}
html body .heritage-fusion-nav .brand-text{display:grid!important;line-height:1!important;text-align:left!important}
html body .heritage-fusion-nav .brand strong{font:600 15px/1.05 'Cinzel',serif!important;letter-spacing:.09em!important;color:#f6cf71!important;text-shadow:none!important}
html body .heritage-fusion-nav .brand em{font:600 9px/1.1 'Jost',sans-serif!important;letter-spacing:.15em!important;color:#f0d593!important;text-transform:uppercase!important;display:block!important;margin-top:2px!important}
.nav-legacy-title{text-align:center;display:grid;gap:1px;line-height:1.05}
.nav-legacy-title strong{font:500 14px/1.1 'Cinzel',serif;letter-spacing:.16em;color:#ffe2a1;text-transform:uppercase}
.nav-legacy-title span{font:500 9px/1.2 'Jost',sans-serif;letter-spacing:.16em;color:rgba(255,236,188,.76);text-transform:uppercase}


html body .heritage-fusion-nav .nav-plaque{
  position:relative!important;top:auto!important;left:auto!important;transform:none!important;
  width:100%!important;max-width:none!important;height:58px!important;min-height:58px!important;
  margin:0!important;padding:0 clamp(38px,5vw,76px)!important;
  display:flex!important;align-items:center!important;justify-content:center!important;gap:8px!important;
  overflow:hidden!important;background:linear-gradient(180deg,#fffaf1 0%,#fbf0da 100%)!important;
  border:0!important;border-radius:0!important;box-shadow:none!important;
}
html body .heritage-fusion-nav .nav-plaque::before,
html body .heritage-fusion-nav .nav-plaque::after{display:none!important;content:none!important}
html body .heritage-fusion-nav .nav-links{
  position:relative!important;inset:auto!important;transform:none!important;
  display:flex!important;flex:1 1 auto!important;align-items:center!important;justify-content:flex-start!important;
  gap:4px!important;flex-wrap:nowrap!important;width:auto!important;max-width:100%!important;
  height:100%!important;min-height:0!important;padding:7px 4px!important;margin:0!important;
  overflow-x:auto!important;overflow-y:hidden!important;scroll-behavior:smooth!important;overscroll-behavior-inline:contain!important;
  scrollbar-width:thin!important;scrollbar-color:rgba(182,108,41,.45) rgba(255,246,225,.4)!important;
  background:transparent!important;border:0!important;border-radius:0!important;box-shadow:none!important;
}
html body .heritage-fusion-nav .nav-links::-webkit-scrollbar{height:4px}
html body .heritage-fusion-nav .nav-links::-webkit-scrollbar-track{background:rgba(224,184,103,.12);border-radius:999px}
html body .heritage-fusion-nav .nav-links::-webkit-scrollbar-thumb{background:linear-gradient(90deg,#d39930,#b56627);border-radius:999px}

html body .heritage-fusion-nav .nav-links > :is(a,button.nav-exit-btn){
  position:relative!important;isolation:isolate!important;flex:0 0 auto!important;
  min-height:42px!important;height:42px!important;padding:5px 11px!important;margin:0!important;
  display:inline-flex!important;align-items:center!important;justify-content:center!important;gap:6px!important;
  color:#6a3c13!important;background:transparent!important;border:1px solid transparent!important;border-radius:999px!important;
  box-shadow:none!important;text-decoration:none!important;white-space:nowrap!important;
  font:700 12px/1 'Raleway','Jost',sans-serif!important;letter-spacing:.01em!important;
  transition:transform .22s ease,color .22s ease,background .22s ease,border-color .22s ease,box-shadow .22s ease!important;
  animation:none!important;
}
html body .heritage-fusion-nav .nav-links > :is(a,button.nav-exit-btn)::before{display:none!important;content:none!important}
html body .heritage-fusion-nav .nav-links > :is(a,button.nav-exit-btn)::after{
  content:""!important;position:absolute!important;left:15%!important;right:15%!important;bottom:1px!important;height:2px!important;width:auto!important;
  border-radius:999px!important;background:linear-gradient(90deg,transparent,var(--nav-copper),transparent)!important;opacity:0!important;transform:scaleX(.25)!important;
  transition:opacity .22s ease,transform .22s ease!important;
}
html body .heritage-fusion-nav .nav-links > :is(a,button.nav-exit-btn):hover,
html body .heritage-fusion-nav .nav-links > :is(a,button.nav-exit-btn):focus-visible{
  color:#552906!important;background:rgba(243,210,132,.34)!important;border-color:rgba(187,117,38,.22)!important;transform:translateY(-1px)!important;
}
html body .heritage-fusion-nav .nav-links > a.active{
  color:#fff8e7!important;background:linear-gradient(180deg,#9a1830 0%,#7f1024 100%)!important;
  border-color:rgba(246,198,86,.72)!important;
  box-shadow:0 5px 14px rgba(111,22,38,.20),inset 0 1px 0 rgba(255,228,160,.28)!important;
}
html body .heritage-fusion-nav .nav-links > a.active::after,
html body .heritage-fusion-nav .nav-links > :is(a,button.nav-exit-btn):hover::after{opacity:1!important;transform:scaleX(1)!important}
html body .heritage-fusion-nav .nav-links > a.active::after{background:linear-gradient(90deg,transparent,#ffd76c,transparent)!important}
html body .heritage-fusion-nav .nav-exit-btn{cursor:pointer!important;color:#7b2633!important}


.nav-motion-icon{width:20px;height:20px;display:inline-grid;place-items:center;flex:0 0 20px;color:#a86d20;transform-origin:center}
.nav-motion-icon svg,.section-nav-emblem svg{width:100%;height:100%;fill:none;stroke:currentColor;stroke-width:1.55;stroke-linecap:round;stroke-linejoin:round;overflow:visible}
.heritage-fusion-nav a.active .nav-motion-icon{color:#ffd66b;filter:drop-shadow(0 0 4px rgba(255,203,80,.32))}
.motion-float{animation:fusionFloat 3.8s ease-in-out infinite}
.motion-settle{animation:fusionSettle 4.8s ease-in-out infinite}
.motion-breathe{animation:fusionBreathe 3.6s ease-in-out infinite}
.motion-page{animation:fusionPage 4.4s ease-in-out infinite}
.motion-spin{animation:fusionSpin 12s linear infinite}
.motion-lift{animation:fusionLift 4.2s ease-in-out infinite}
.motion-talk{animation:fusionTalk 3.4s ease-in-out infinite}
.motion-write{animation:fusionWrite 3.8s ease-in-out infinite}
.motion-pulse{animation:fusionPulse 3.4s ease-in-out infinite}
.motion-tilt{animation:fusionTilt 4.6s ease-in-out infinite}
.motion-heart{animation:fusionHeart 3.2s ease-in-out infinite}
.motion-orbit{animation:fusionOrbit 5.2s ease-in-out infinite}
.motion-slide{animation:fusionSlide 3.8s ease-in-out infinite}
@keyframes fusionChakra{to{transform:rotate(360deg)}}
@keyframes fusionFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-2.5px)}}
@keyframes fusionSettle{0%,100%{transform:translateY(0)}40%{transform:translateY(-1.5px)}60%{transform:translateY(1px)}}
@keyframes fusionBreathe{0%,100%{transform:scale(1)}50%{transform:scale(1.08)}}
@keyframes fusionPage{0%,100%{transform:rotate(0)}50%{transform:rotate(-4deg)}}
@keyframes fusionSpin{0%,100%{transform:rotate(0)}50%{transform:rotate(22deg)}}
@keyframes fusionLift{0%,100%{transform:translateY(0)}50%{transform:translateY(-2px) scale(1.03)}}
@keyframes fusionTalk{0%,100%{transform:translateX(0)}35%{transform:translateX(-1px)}65%{transform:translateX(1px)}}
@keyframes fusionWrite{0%,100%{transform:translate(0,0) rotate(0)}50%{transform:translate(1.5px,-1.5px) rotate(-5deg)}}
@keyframes fusionPulse{0%,100%{transform:scale(1)}45%{transform:scale(1.1)}60%{transform:scale(1.02)}}
@keyframes fusionTilt{0%,100%{transform:rotate(0)}50%{transform:rotate(4deg)}}
@keyframes fusionHeart{0%,100%{transform:scale(1)}20%{transform:scale(1.12)}35%{transform:scale(1)}}
@keyframes fusionOrbit{0%,100%{transform:rotate(0) translateY(0)}50%{transform:rotate(8deg) translateY(-1px)}}
@keyframes fusionSlide{0%,100%{transform:translateX(0)}50%{transform:translateX(2px)}}


.nav-rail-arrow{
  position:absolute;top:50%;transform:translateY(-50%);z-index:6;width:28px;height:34px;padding:0!important;margin:0!important;
  display:grid!important;place-items:center!important;border:1px solid rgba(181,108,41,.24)!important;border-radius:999px!important;
  background:rgba(255,250,240,.88)!important;color:#995817!important;box-shadow:0 3px 10px rgba(104,61,13,.08)!important;cursor:pointer!important;
  font:700 17px/1 serif!important;
}
.nav-rail-arrow--prev{left:8px}.nav-rail-arrow--next{right:8px}
.nav-rail-arrow:hover{background:#f7df9d!important;color:#6e3207!important}
.nav-copper-rail{position:absolute;left:0;right:0;bottom:0;height:2px;background:linear-gradient(90deg,transparent 0,#c3782b 8%,#e4a83c 50%,#c3782b 92%,transparent 100%);pointer-events:none}


html body .heritage-fusion-nav .menu-toggle{
  justify-self:end!important;position:relative!important;inset:auto!important;right:auto!important;top:auto!important;transform:none!important;
  width:36px!important;height:36px!important;min-width:36px!important;display:none!important;border:1px solid #e5b84e!important;border-radius:50%!important;
  background:radial-gradient(circle at 35% 30%,#a7253b,#6a0c1b 72%)!important;color:#f8ce68!important;box-shadow:0 0 0 3px rgba(255,214,110,.06)!important;
}
html body .heritage-fusion-nav .menu-toggle span{display:none!important}
html body .heritage-fusion-nav .menu-toggle::before{content:"✥";font:400 20px/1 Georgia,serif;color:#f5c95f;animation:fusionChakra 13s linear infinite}


.section-nav-emblem{
  width:58px;height:58px;margin:0 auto 12px;display:grid;place-items:center;border-radius:50%;
  color:#a3691f;background:radial-gradient(circle at 32% 28%,rgba(255,255,255,.98),rgba(248,225,166,.72));
  border:1px solid rgba(202,145,52,.35);box-shadow:0 10px 24px rgba(98,56,9,.09),inset 0 1px 0 rgba(255,255,255,.9);
}
.section-nav-emblem svg{width:30px;height:30px;stroke-width:1.35}
.sacred-heading-stack>.section-nav-emblem{margin-bottom:8px}
#thanks .section-nav-emblem{margin-bottom:14px}


html body main section[id]{scroll-margin-top:calc(var(--topbar-h,104px) + 12px)!important}

@media (max-width:1180px){
  .nav-legacy-title strong{font-size:12px}.nav-legacy-title span{font-size:8px}
  html body .heritage-fusion-nav .nav-links > :is(a,button.nav-exit-btn){padding-inline:9px!important;font-size:11px!important}
}

@media (max-width:900px){
  :root{--fusion-nav-h:62px}
  html body .topbar.heritage-fusion-nav,html body .topbar.heritage-fusion-nav.scrolled{
    height:var(--fusion-nav-h)!important;min-height:var(--fusion-nav-h)!important;background:var(--nav-wine)!important;overflow:visible!important;
  }
  .nav-crown{height:62px;grid-template-columns:1fr auto;padding:0 14px 0 16px}
  .nav-legacy-title{display:none}
  html body .heritage-fusion-nav .brand strong{font-size:14px!important}
  html body .heritage-fusion-nav .brand em{font-size:8px!important}
  html body .heritage-fusion-nav .menu-toggle{display:grid!important;place-items:center!important}
  html body .heritage-fusion-nav .nav-plaque{
    position:absolute!important;top:62px!important;left:0!important;right:0!important;width:100%!important;height:auto!important;min-height:0!important;
    padding:0!important;background:transparent!important;overflow:visible!important;display:block!important;pointer-events:none!important;
  }
  html body .heritage-fusion-nav .nav-links{
    display:none!important;position:absolute!important;top:0!important;left:10px!important;right:10px!important;width:auto!important;max-width:none!important;height:auto!important;max-height:calc(100vh - 78px)!important;
    padding:12px!important;overflow-y:auto!important;overflow-x:hidden!important;flex-direction:column!important;align-items:stretch!important;gap:5px!important;
    background:linear-gradient(180deg,#fffaf1,#f9edcf)!important;border:1px solid rgba(172,101,35,.34)!important;border-top:3px solid #d58b2b!important;border-radius:0 0 22px 22px!important;
    box-shadow:0 20px 50px rgba(62,24,4,.22)!important;pointer-events:auto!important;
  }
  html body .heritage-fusion-nav .nav-links.open{display:flex!important}
  html body .heritage-fusion-nav .nav-links > :is(a,button.nav-exit-btn){width:100%!important;height:44px!important;justify-content:flex-start!important;padding:7px 14px!important;border-radius:12px!important;font-size:13px!important}
  html body .heritage-fusion-nav .nav-links > a.active{background:linear-gradient(90deg,#7f1024,#9d1b33)!important}
  .nav-rail-arrow{display:none!important}
  .nav-copper-rail{bottom:-1px}
  .section-nav-emblem{width:52px;height:52px}
  .section-nav-emblem svg{width:27px;height:27px}
}

@media (prefers-reduced-motion:reduce){
  .brand-chakra svg,.nav-motion-icon,.section-nav-emblem,.heritage-fusion-nav .menu-toggle::before{animation:none!important}
  html body .heritage-fusion-nav .nav-links{scroll-behavior:auto!important}
}

html body .heritage-fusion-nav .nav-crown,
html body .heritage-fusion-nav .nav-plaque{z-index:3!important}
html body .heritage-fusion-nav .nav-copper-rail{z-index:4!important}



:root{
  --text:#2f1b0c;
  --muted:#5b4630;
  --heading:#512303;
  --heading-strong:#351405;
  --nav-readable:#4d2708;
  --nav-readable-icon:#8a520e;
}


html body .heritage-fusion-nav .nav-rail-arrow{display:none!important}
html body .heritage-fusion-nav .nav-plaque{padding-inline:clamp(14px,2.2vw,36px)!important}


html body .heritage-fusion-nav .nav-links > :is(a,button.nav-exit-btn){
  color:var(--nav-readable)!important;
  font-weight:800!important;
  letter-spacing:.012em!important;
  text-shadow:0 1px 0 rgba(255,255,255,.7)!important;
}
html body .heritage-fusion-nav .nav-motion-icon{
  color:var(--nav-readable-icon)!important;
  filter:drop-shadow(0 1px 0 rgba(255,255,255,.65));
}
html body .heritage-fusion-nav .nav-links > a.active{
  color:#fffbed!important;
  text-shadow:0 1px 1px rgba(58,10,18,.48)!important;
  outline:1px solid rgba(255,220,122,.18)!important;
  outline-offset:-2px!important;
}
html body .heritage-fusion-nav .nav-links > a.active .nav-motion-icon{
  color:#ffe08a!important;
  filter:drop-shadow(0 0 5px rgba(255,203,80,.38))!important;
}
html body .heritage-fusion-nav .brand strong,
.nav-legacy-title strong{
  color:#ffe49a!important;
  text-shadow:0 1px 1px rgba(59,9,17,.66)!important;
}
html body .heritage-fusion-nav .brand em,
.nav-legacy-title span{
  color:#f9dda0!important;
  opacity:1!important;
  text-shadow:0 1px 1px rgba(59,9,17,.52)!important;
}


html body .heritage-fusion-nav .nav-links > a:focus-visible,
html body .heritage-fusion-nav .nav-exit-btn:focus-visible,
html body .heritage-fusion-nav .menu-toggle:focus-visible{
  outline:3px solid #ffd86b!important;
  outline-offset:2px!important;
}


html body .section-panel,
html body .section-inner,
html body .card,
html body .timeline-item,
html body .tribute-form,
html body .preview-state,
html body .help-card,
html body .dossier-shell,
html body .foundation-shell{
  color:var(--text)!important;
  text-rendering:optimizeLegibility;
  -webkit-font-smoothing:antialiased;
}
html body :is(
  .lede,.lede-italic,.section-quote,.legacy-narrative,.foundation-copy p,
  .foundation-highlights small,.tl-quote,.tl-people,.story-copy,.virtue-panel,
  .academic-card p,.academic-card li,.pub-table td,.pub-table th,
  .approved-grid article p,.tribute-form label,.tribute-form small,
  .preview-state p,.preview-state blockquote,.moderation-note,
  .help-card p,.help-card li,.help-emphasis,.help-compact-list li,
  .gv-caption p,.gallery-prompt,.tribute-entry-meta
){
  color:#46301b!important;
  opacity:1!important;
}
html body :is(.heading-accent,h3,h4,.tl-content strong,.name-accent,.eyebrow){
  color:var(--heading-strong)!important;
  opacity:1!important;
}
html body :is(input,textarea,select){
  color:#29180b!important;
  font-weight:500!important;
}
html body :is(input,textarea)::placeholder{
  color:#69513a!important;
  opacity:1!important;
}
html body :is(.btn,.filter-chip,.tab,.virtue-btn,.help-toggle,.view-btn,.cal-btn){
  font-weight:800!important;
}


.section-nav-emblem{
  color:#7c470b!important;
  filter:drop-shadow(0 2px 4px rgba(94,53,8,.10));
}

@media (max-width:900px){
  html body .heritage-fusion-nav .nav-plaque{padding-inline:0!important}
  html body .heritage-fusion-nav .nav-links > :is(a,button.nav-exit-btn){
    font-size:13.5px!important;
    font-weight:800!important;
  }
}



:root{
  --heritage-burgundy:#721c2a;
  --heritage-burgundy-deep:#57131f;
  --heritage-copper:#9f5218;
  --heritage-copper-bright:#b8661d;
  --heritage-teal:#2d6761;
  --heritage-umber:#4b301a;
  --heritage-muted:#715238;
}


html body .heritage-fusion-nav .nav-links{
  justify-content:safe center!important;
  scroll-behavior:auto!important;
  padding-inline:0!important;
}
html body .heritage-fusion-nav .nav-plaque{
  padding-inline:clamp(14px,2vw,34px)!important;
}


html body .heritage-fusion-nav .nav-links > :is(a,button.nav-exit-btn){
  transition:transform .09s ease-out,color .09s ease-out,background .09s ease-out,border-color .09s ease-out,box-shadow .09s ease-out!important;
}
html body .heritage-fusion-nav .nav-links > :is(a,button.nav-exit-btn)::after{
  transition:opacity .08s ease-out,transform .08s ease-out!important;
}
.motion-float{animation-duration:1.05s!important}
.motion-settle{animation-duration:1.15s!important}
.motion-breathe{animation-duration:1.05s!important}
.motion-page{animation-duration:1.10s!important}
.motion-spin{animation-duration:2.1s!important}
.motion-lift{animation-duration:1.10s!important}
.motion-talk{animation-duration:.95s!important}
.motion-write{animation-duration:1.05s!important}
.motion-pulse{animation-duration:.95s!important}
.motion-tilt{animation-duration:1.10s!important}
.motion-heart{animation-duration:.90s!important}
.motion-orbit{animation-duration:1.25s!important}
.motion-slide{animation-duration:.95s!important}
html body .heritage-fusion-nav .nav-links > a:is(:hover,:focus-visible,.active) .nav-motion-icon,
html body .heritage-fusion-nav .nav-exit-btn:is(:hover,:focus-visible) .nav-motion-icon{
  filter:drop-shadow(0 0 6px rgba(221,154,35,.48))!important;
}


html body .heritage-fusion-nav .brand-text{
  position:relative!important;
  overflow:visible!important;
}
html body .heritage-fusion-nav .brand strong{
  color:#ffe18a!important;
  text-shadow:0 0 2px rgba(255,242,188,.95),0 0 7px rgba(255,203,82,.62),0 0 15px rgba(255,177,32,.28)!important;
}
html body .heritage-fusion-nav .brand em{
  color:#f7d87f!important;
  text-shadow:0 0 4px rgba(255,209,93,.45)!important;
}
html body .heritage-fusion-nav .brand-text::before,
html body .heritage-fusion-nav .brand-text::after{
  position:absolute;
  color:#ffe27a;
  line-height:1;
  pointer-events:none;
  text-shadow:0 0 5px #ffd562,0 0 10px rgba(255,196,51,.85);
  animation:brandQuickSpark 1.05s ease-in-out infinite;
}
html body .heritage-fusion-nav .brand-text::before{
  content:'✦';
  right:-13px;
  top:-4px;
  font-size:9px;
}
html body .heritage-fusion-nav .brand-text::after{
  content:'·';
  right:-18px;
  bottom:0;
  font-size:20px;
  animation-delay:-.42s;
}
@keyframes brandQuickSpark{
  0%,100%{opacity:.18;transform:scale(.65) rotate(0deg)}
  42%{opacity:1;transform:scale(1.18) rotate(18deg)}
  62%{opacity:.55;transform:scale(.9) rotate(30deg)}
}


html body :is(
  .split-title,.heading-accent,.section-heading h2,.section-heading h3,
  .foundation-copy h3,.parent-card h4,.academic-card h4,.dossier-shell h4,
  .timeline-item h4,.tl-content strong,.lm-caption h4,.lm-reel-heading h4,
  .gv-caption strong,.help-card h4,.tribute-form h4,.preview-state h4,
  .tribute-interactive-heading h4,.experience-card h5,.tribute-mode-copy h4
){
  color:var(--heritage-burgundy)!important;
  text-shadow:0 1px 0 rgba(255,255,255,.5)!important;
}
html body :is(.eyebrow,.lm-kicker,.mini-eyebrow,.parent-role,.foundation-role){
  color:var(--heritage-copper)!important;
  opacity:1!important;
}
html body :is(
  .lede,.lede-italic,.dedication-plain,.section-quote,.tl-quote,.tl-people,
  .foundation-copy p,.virtue-panel,.academic-card p,.academic-card li,
  .approved-grid article p,.tribute-form label,.tribute-form small,
  .preview-state p,.preview-state blockquote,.moderation-note,.help-card p,
  .help-card li,.gv-caption p,.gallery-prompt,.lm-caption > p:not(.lm-kicker)
){
  color:var(--heritage-umber)!important;
  opacity:1!important;
}
html body :is(.section-heading .lede strong,.name-accent,.detail-tip strong,.media-head h4){
  color:var(--heritage-teal)!important;
}
html body :is(.word-count,.char-meter + small,.lm-video-status,.lm-card-copy small){
  color:var(--heritage-muted)!important;
}


.review-checklist span{
  color:#765a36!important;
  background:rgba(255,251,241,.76)!important;
  border-color:rgba(183,133,45,.22)!important;
}
.review-checklist span.is-done{
  color:#4d6c24!important;
  background:#edf4df!important;
  border-color:rgba(91,128,43,.28)!important;
}


html body #livingMemoriesCinema .lm-video-console{
  display:grid!important;
  grid-template-columns:1fr!important;
  gap:12px!important;
  max-width:900px!important;
  margin:0 auto!important;
  padding:18px 12px 6px!important;
}
html body #livingMemoriesCinema :is(.lm-playback-controls,.lm-zoom-controls,.lm-view-controls){
  width:100%!important;
  margin:0 auto!important;
  align-items:center!important;
  justify-content:center!important;
}
html body #livingMemoriesCinema .lm-playback-controls{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(150px,1fr))!important;
  gap:12px!important;
  max-width:720px!important;
}
html body #livingMemoriesCinema .lm-zoom-controls{
  display:grid!important;
  grid-template-columns:minmax(150px,1fr) 96px minmax(150px,1fr)!important;
  gap:12px!important;
  max-width:720px!important;
}
html body #livingMemoriesCinema .lm-view-controls{
  display:grid!important;
  grid-template-columns:repeat(2,minmax(190px,1fr))!important;
  gap:12px!important;
  max-width:560px!important;
}
html body #livingMemoriesCinema .lm-control-btn,
html body #livingMemoriesCinema .lm-zoom-readout{
  width:100%!important;
  min-width:0!important;
  min-height:46px!important;
  margin:0!important;
}
html body #livingMemoriesCinema .lm-video-status{
  grid-column:1!important;
  margin-top:2px!important;
}
html body #livingMemoriesCinema .lm-actions{
  display:grid!important;
  grid-template-columns:repeat(2,minmax(180px,240px))!important;
  justify-content:center!important;
  gap:12px!important;
  max-width:520px!important;
  margin:18px auto 0!important;
}
html body #livingMemoriesCinema .lm-actions .btn{
  width:100%!important;
  justify-content:center!important;
}

@media (max-width:900px){
  html body .heritage-fusion-nav .nav-links{justify-content:flex-start!important}
  html body #livingMemoriesCinema .lm-playback-controls{grid-template-columns:repeat(3,minmax(100px,1fr))!important}
  html body #livingMemoriesCinema .lm-zoom-controls{grid-template-columns:minmax(110px,1fr) 82px minmax(110px,1fr)!important}
}
@media (max-width:620px){
  html body #livingMemoriesCinema .lm-playback-controls{grid-template-columns:1fr 1fr!important}
  html body #livingMemoriesCinema .lm-playback-controls > :last-child{grid-column:1/-1!important;max-width:240px!important;justify-self:center!important}
  html body #livingMemoriesCinema .lm-zoom-controls{grid-template-columns:1fr 82px 1fr!important;gap:8px!important}
  html body #livingMemoriesCinema .lm-view-controls{grid-template-columns:1fr!important;max-width:360px!important}
  html body #livingMemoriesCinema .lm-actions{grid-template-columns:1fr!important;max-width:320px!important}
}
@media (prefers-reduced-motion:reduce){
  html body .heritage-fusion-nav .brand-text::before,
  html body .heritage-fusion-nav .brand-text::after{animation:none!important;opacity:.7!important}
}


html body .heritage-fusion-nav .nav-crown{
  grid-template-columns:1fr minmax(360px,auto) 1fr!important;
  justify-items:stretch!important;
}


html body .heritage-fusion-nav .nav-legacy-home{
  grid-column:2!important;
  justify-self:center!important;
  align-self:center!important;
  position:relative!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:11px!important;
  min-width:0!important;
  padding:3px 24px!important;
  margin:0!important;
  text-decoration:none!important;
  border:0!important;
  border-radius:999px!important;
  background:transparent!important;
  box-shadow:none!important;
  overflow:visible!important;
  isolation:isolate!important;
}

html body .heritage-fusion-nav .nav-title-copy{
  position:relative!important;
  display:grid!important;
  gap:2px!important;
  line-height:1!important;
  text-align:center!important;
  overflow:visible!important;
}
html body .heritage-fusion-nav .nav-legacy-title strong{
  display:block!important;
  font:600 14px/1.05 'Cinzel',serif!important;
  letter-spacing:.14em!important;
  color:#ffe18a!important;
  text-transform:uppercase!important;
  text-shadow:0 0 2px rgba(255,242,188,.95),0 0 8px rgba(255,203,82,.56),0 1px 1px rgba(59,9,17,.68)!important;
}
html body .heritage-fusion-nav .nav-legacy-title .nav-title-copy>span{
  display:block!important;
  margin-top:2px!important;
  font:600 8.5px/1.05 'Jost','Raleway',sans-serif!important;
  letter-spacing:.17em!important;
  color:#f7d87f!important;
  text-transform:uppercase!important;
  text-shadow:0 0 4px rgba(255,209,93,.42),0 1px 1px rgba(59,9,17,.5)!important;
}


html body .heritage-fusion-nav .nav-title-chakra{
  width:31px!important;
  height:31px!important;
  flex:0 0 31px!important;
  display:grid!important;
  place-items:center!important;
  border:1px solid rgba(246,205,103,.78)!important;
  border-radius:50%!important;
  color:#f4c85b!important;
  background:radial-gradient(circle at 35% 30%,rgba(255,225,142,.10),rgba(86,9,24,.18) 70%)!important;
  box-shadow:0 0 0 3px rgba(255,214,112,.055),0 0 12px rgba(255,195,55,.12)!important;
}
html body .heritage-fusion-nav .nav-title-chakra svg{
  width:20px!important;
  height:20px!important;
  fill:none!important;
  stroke:currentColor!important;
  stroke-width:1.5!important;
  stroke-linecap:round!important;
  stroke-linejoin:round!important;
  animation:fusionChakra 18s linear infinite!important;
  filter:drop-shadow(0 0 3px rgba(255,207,84,.38));
}


html body .heritage-fusion-nav .nav-title-copy::before,
html body .heritage-fusion-nav .nav-title-copy::after{
  position:absolute!important;
  z-index:2!important;
  pointer-events:none!important;
  color:#ffe27a!important;
  line-height:1!important;
  text-shadow:0 0 5px #ffd562,0 0 11px rgba(255,196,51,.82)!important;
  animation:centerLegacySpark 1.05s ease-in-out infinite!important;
}
html body .heritage-fusion-nav .nav-title-copy::before{
  content:'✦'!important;
  right:-15px!important;
  top:-5px!important;
  font-size:9px!important;
}
html body .heritage-fusion-nav .nav-title-copy::after{
  content:'·'!important;
  left:-16px!important;
  bottom:-3px!important;
  font-size:20px!important;
  animation-delay:-.42s!important;
}
@keyframes centerLegacySpark{
  0%,100%{opacity:.18;transform:scale(.65) rotate(0deg)}
  42%{opacity:1;transform:scale(1.18) rotate(18deg)}
  62%{opacity:.55;transform:scale(.9) rotate(30deg)}
}


html body .heritage-fusion-nav .nav-legacy-home::after{
  content:""!important;
  position:absolute!important;
  left:25%!important;
  right:25%!important;
  bottom:0!important;
  height:1px!important;
  border-radius:999px!important;
  background:linear-gradient(90deg,transparent,rgba(255,224,137,.28),#ffe18a,rgba(255,224,137,.28),transparent)!important;
  transform-origin:center!important;
  animation:centerLegacyTrace 3.2s ease-in-out infinite!important;
  pointer-events:none!important;
}
@keyframes centerLegacyTrace{
  0%,100%{opacity:.22;transform:scaleX(.58)}
  50%{opacity:.86;transform:scaleX(1)}
}

html body .heritage-fusion-nav .nav-legacy-home:is(:hover,:focus-visible){
  background:rgba(255,226,144,.045)!important;
}
html body .heritage-fusion-nav .nav-legacy-home:focus-visible{
  outline:2px solid rgba(255,216,107,.9)!important;
  outline-offset:3px!important;
}


@media (max-width:900px){
  html body .heritage-fusion-nav .nav-crown{
    grid-template-columns:44px minmax(0,1fr) 44px!important;
    padding:0 10px!important;
  }
  html body .heritage-fusion-nav .nav-legacy-title{
    grid-column:2!important;
    display:inline-flex!important;
    width:min(100%,420px)!important;
    padding-inline:8px!important;
    gap:8px!important;
  }
  html body .heritage-fusion-nav .nav-title-chakra{
    width:27px!important;height:27px!important;flex-basis:27px!important;
  }
  html body .heritage-fusion-nav .nav-title-chakra svg{width:17px!important;height:17px!important}
  html body .heritage-fusion-nav .nav-legacy-title strong{
    font-size:clamp(9.5px,2.7vw,12px)!important;
    letter-spacing:.105em!important;
    white-space:nowrap!important;
  }
  html body .heritage-fusion-nav .nav-legacy-title .nav-title-copy>span{display:none!important}
  html body .heritage-fusion-nav .menu-toggle{grid-column:3!important;justify-self:end!important}
}
@media (max-width:480px){
  html body .heritage-fusion-nav .nav-title-chakra{width:24px!important;height:24px!important;flex-basis:24px!important}
  html body .heritage-fusion-nav .nav-title-chakra svg{width:15px!important;height:15px!important}
  html body .heritage-fusion-nav .nav-legacy-title strong{font-size:9px!important;letter-spacing:.075em!important}
  html body .heritage-fusion-nav .nav-title-copy::before{right:-9px!important}
  html body .heritage-fusion-nav .nav-title-copy::after{left:-10px!important}
}

@media (prefers-reduced-motion:reduce){
  html body .heritage-fusion-nav .nav-title-chakra svg,
  html body .heritage-fusion-nav .nav-title-copy::before,
  html body .heritage-fusion-nav .nav-title-copy::after,
  html body .heritage-fusion-nav .nav-legacy-home::after{
    animation:none!important;
  }
}

/* ========================================================================== 
   FINAL MOBILE + TABLET NAVIGATION SAFETY PASS (v34)
   Keeps every destination immediately reachable on phones and tablets.
   Desktop navigation remains unchanged above 1100px.
   ========================================================================== */
@media (max-width:1100px){
  :root{--fusion-nav-h:62px}
  html body .topbar.heritage-fusion-nav,
  html body .topbar.heritage-fusion-nav.scrolled{
    height:var(--fusion-nav-h)!important;
    min-height:var(--fusion-nav-h)!important;
    padding:0!important;
    background:var(--nav-wine)!important;
    overflow:visible!important;
  }
  html body .heritage-fusion-nav .nav-crown{
    height:62px!important;
    grid-template-columns:44px minmax(0,1fr) 44px!important;
    padding:0 10px!important;
  }
  html body .heritage-fusion-nav .nav-legacy-title{
    grid-column:2!important;
    display:inline-flex!important;
    width:min(100%,480px)!important;
    max-width:100%!important;
    padding-inline:8px!important;
    gap:8px!important;
    justify-self:center!important;
  }
  html body .heritage-fusion-nav .nav-title-chakra{
    width:27px!important;height:27px!important;flex-basis:27px!important;
  }
  html body .heritage-fusion-nav .nav-title-chakra svg{width:17px!important;height:17px!important}
  html body .heritage-fusion-nav .nav-legacy-title strong{
    font-size:clamp(9.5px,1.7vw,12px)!important;
    letter-spacing:.105em!important;
    white-space:nowrap!important;
  }
  html body .heritage-fusion-nav .nav-legacy-title .nav-title-copy>span{
    display:block!important;
    font-size:7.5px!important;
    letter-spacing:.13em!important;
    white-space:nowrap!important;
  }
  html body .heritage-fusion-nav .menu-toggle{
    display:grid!important;
    place-items:center!important;
    grid-column:3!important;
    justify-self:end!important;
  }
  html body .heritage-fusion-nav .nav-plaque{
    position:absolute!important;
    top:62px!important;
    left:0!important;right:0!important;
    width:100%!important;max-width:100%!important;
    height:0!important;min-height:0!important;
    margin:0!important;padding:0!important;
    background:transparent!important;
    overflow:visible!important;
    display:block!important;
    pointer-events:none!important;
  }
  html body .heritage-fusion-nav .nav-links{
    display:none!important;
    position:absolute!important;
    top:0!important;left:10px!important;right:10px!important;
    width:auto!important;max-width:none!important;
    height:auto!important;
    max-height:calc(100vh - 76px)!important;
    max-height:calc(100svh - 76px)!important;
    padding:12px!important;
    overflow-y:auto!important;overflow-x:hidden!important;
    align-items:stretch!important;
    gap:6px!important;
    background:linear-gradient(180deg,#fffaf1,#f9edcf)!important;
    border:1px solid rgba(172,101,35,.34)!important;
    border-top:3px solid #d58b2b!important;
    border-radius:0 0 22px 22px!important;
    box-shadow:0 20px 50px rgba(62,24,4,.22)!important;
    pointer-events:auto!important;
    overscroll-behavior:contain!important;
    -webkit-overflow-scrolling:touch;
  }
  html body .heritage-fusion-nav .nav-links.open{display:grid!important}
  html body .heritage-fusion-nav .nav-links > :is(a,button.nav-exit-btn){
    width:100%!important;
    min-width:0!important;
    height:46px!important;
    min-height:46px!important;
    justify-content:flex-start!important;
    padding:7px 14px!important;
    border-radius:12px!important;
    font-size:13px!important;
  }
  html body .heritage-fusion-nav .nav-links > a.active{
    background:linear-gradient(90deg,#7f1024,#9d1b33)!important;
  }
  html body .heritage-fusion-nav .nav-rail-arrow{display:none!important}
  html body .heritage-fusion-nav .nav-copper-rail{bottom:-1px!important}
  html body main section[id]{scroll-margin-top:74px!important}
}

@media (min-width:701px) and (max-width:1100px){
  html body .heritage-fusion-nav .nav-links.open{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
}

@media (max-width:700px){
  html body .heritage-fusion-nav .nav-links.open{
    grid-template-columns:1fr!important;
  }
  html body .heritage-fusion-nav .nav-legacy-title .nav-title-copy>span{display:none!important}
}

@media (max-width:480px){
  html body .heritage-fusion-nav .nav-title-chakra{width:24px!important;height:24px!important;flex-basis:24px!important}
  html body .heritage-fusion-nav .nav-title-chakra svg{width:15px!important;height:15px!important}
  html body .heritage-fusion-nav .nav-legacy-title strong{font-size:9px!important;letter-spacing:.075em!important}
}

/* Allow full content height on shallow mobile/tablet landscapes instead of
   clipping a final decorative line or action row to a viewport-sized panel. */
@media (max-width:1100px) and (max-height:820px) and (orientation:landscape){
  html body main > section.screen{
    height:auto!important;
    min-height:100svh!important;
  }
}

@media (max-width:1100px){
  html,body{max-width:100%!important;overflow-x:hidden!important;}
}

@media (max-width:1100px) and (max-height:820px) and (orientation:landscape){
  html body main > #sacred.screen,
}

/* Shallow landscape safeguard: these cinematic screens use positioned
   decorative content above the phone breakpoint, so reserve enough vertical
   canvas to prevent the last line/actions from being clipped on tablets. */
@media (max-width:1100px) and (max-height:820px) and (orientation:landscape){
  html body main > #sacred.screen,
}

/* ========================================================================== 
   v36 LARGE-TABLET / COMPACT-DESKTOP TAB FIT
   Keeps the full ornate tab rail visible on large tablets and 1366-class
   landscape screens without clipping the final destinations. The existing
   hamburger layout remains unchanged at 1100px and below.
   ========================================================================== */
@media (min-width:1101px) and (max-width:1399px){
  html body .heritage-fusion-nav .nav-plaque{
    padding-inline:clamp(16px,2vw,28px)!important;
    gap:4px!important;
  }
  html body .heritage-fusion-nav .nav-links{
    gap:2px!important;
    padding-inline:2px!important;
  }
  html body .heritage-fusion-nav .nav-links > :is(a,button.nav-exit-btn){
    padding-inline:6px!important;
    gap:4px!important;
    font-size:10.5px!important;
  }
  html body .heritage-fusion-nav .nav-motion-icon{
    width:18px!important;
    height:18px!important;
    flex-basis:18px!important;
  }
}

/* === BUNDLE: v42-final-fixes.css === */
/* ======================================================================
   VERIFIED REQUESTED FIXES — final cascade layer
   Loaded LAST by index.html so these corrections cannot be hidden by the
   historical theme/navigation styles that follow styles.css.
   Scope is intentionally limited to Sacred Dedication, Foundational Legacy,
   Virtues & Wisdom, Academic Triumph, Guest Tribute Wisdom tile, and Guest
   Book attachments.
   ====================================================================== */

/* 1) SACRED DEDICATION
   The aurora DOM layers are removed from index.html and the dedication copy
   is plain text directly on the section background — no white card, border,
   pseudo-panel, colour wash, or panel decoration remains.

   Keep only the requested section motion language: orbit movement, fireflies,
   halo breathing, title shimmer, title sparkles, button gleam and entrance
   animations. */
html body #sacred .sacred-aurora,
html body #sacred .sacred-aurora--one,
html body #sacred .sacred-aurora--two {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  animation: none !important;
  background: none !important;
  filter: none !important;
}
html body #sacred .sacred-celestial-message {
  background: transparent !important;
  background-image: none !important;
  border: 0 !important;
  box-shadow: none !important;
}
/* Remove the breathing aura completely. */
html body #sacred .sacred-celestial-message::after {
  content: none !important;
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  animation: none !important;
  background: none !important;
}
/* The former card border pseudo-element is removed as part of text-only mode. */
html body #sacred .sacred-celestial-message::before {
  content: none !important;
  display: none !important;
  border: 0 !important;
  background: none !important;
  animation: none !important;
}
/* Keep the comet/corner/spark motion, but make their colour vocabulary gold
   only so no teal/burgundy sweep can be mistaken for a colour wash. */
html body #sacred .sacred-message-glowline::before {
  background: linear-gradient(90deg, transparent, #d6a935 42%, #fff6c8 64%, #d6a935 100%) !important;
}
html body #sacred .sacred-message-corner::before,
html body #sacred .sacred-message-corner::after {
  background: linear-gradient(90deg, #a96628, #e2bd55, #f0d77b) !important;
}
html body #sacred .sacred-message-spark {
  color: #d6a935 !important;
}

/* 2) FOUNDATIONAL LEGACY
   The coverflow is nested in the text grid column. On desktop that column is
   offset by 220px portrait + 32px gap, so expand exactly 252px to the left to
   center the controls and stage on the OUTER heritage panel rather than the
   text column. Tablet/phone layouts are single-column and need no offset. */
html body #foundation .foundation-copy {
  min-width: 0 !important;
}
html body #foundation .foundation-coverflow {
  box-sizing: border-box !important;
  position: relative !important;
}
@media (min-width: 981px) {
  html body #foundation .foundation-coverflow {
    width: calc(100% + 252px) !important;
    max-width: none !important;
    margin-left: -252px !important;
    margin-right: 0 !important;
  }
}
@media (max-width: 980px) {
  html body #foundation .foundation-shell {
    grid-template-columns: minmax(0, 1fr) !important;
  }
  html body #foundation .foundation-coverflow {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
}
html body #foundation .foundation-coverflow-toolbar,
html body #foundation .foundation-coverflow-stage {
  width: min(100%, 1120px) !important;
  margin-left: auto !important;
  margin-right: auto !important;
  text-align: center !important;
}
html body #foundation .foundation-coverflow-toolbar {
  display: grid !important;
  justify-items: center !important;
  align-items: center !important;
}
html body #foundation .foundation-coverflow-controls,
html body #foundation .foundation-coverflow-dots,
html body #foundation .foundation-coverflow-hint {
  margin-left: auto !important;
  margin-right: auto !important;
}
html body #foundation .foundation-coverflow-stage {
  touch-action: pan-y pinch-zoom !important;
  -webkit-user-select: none !important;
  user-select: none !important;
}
html body #foundation .foundation-highlights > span {
  cursor: pointer !important;
  -webkit-tap-highlight-color: rgba(214,169,53,.16) !important;
  transition:
    transform .14s cubic-bezier(.22,1,.36,1),
    opacity .12s ease,
    border-color .14s ease,
    box-shadow .14s ease,
    filter .14s ease !important;
}
html body #foundation .foundation-highlights > span.is-active {
  cursor: pointer !important;
}
html body #foundation .foundation-highlights > span.is-active:active {
  filter: brightness(1.035) saturate(1.035) !important;
}
html body #foundation .foundation-highlights > span:not(.is-active):active {
  filter: brightness(1.07) saturate(1.08) !important;
}

/* Narrow-phone geometry guard: the portrait's fixed desktop width must never
   force the single-column track wider than the outer heritage panel. */
@media (max-width: 760px) {
  html body #foundation .foundation-shell {
    grid-template-columns: minmax(0,1fr) !important;
    padding-left: clamp(14px, 4.6vw, 18px) !important;
    padding-right: clamp(14px, 4.6vw, 18px) !important;
  }
  html body #foundation .foundation-photo {
    width: min(220px,100%) !important;
    max-width: 100% !important;
    height: auto !important;
    justify-self: center !important;
  }
  html body #foundation .foundation-copy,
  html body #foundation .foundation-coverflow,
  html body #foundation .foundation-coverflow-toolbar,
  html body #foundation .foundation-coverflow-stage {
    min-width: 0 !important;
    max-width: 100% !important;
  }
  html body #foundation .foundation-coverflow-controls {
    width: min(100%, 286px) !important;
  }
  html body #foundation .foundation-coverflow-dots {
    max-width: 100% !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    overscroll-behavior-inline: contain;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
  }
  html body #foundation .foundation-coverflow-dots::-webkit-scrollbar { display: none; }
}

/* 3) VIRTUES & WISDOM
   Unmistakable deep teal + antique-gold current state. Explanation copy is
   about 1.5pt (~2px) smaller than the 16–18px source treatment while staying
   comfortably readable on narrow phones. */
html body #virtues .virtue-step-dot[aria-current="step"],
html body #virtues .virtue-step-dot[aria-selected="true"],
html body #virtues .virtue-step-dot.active {
  position: relative !important;
  color: #fff4c8 !important;
  border-color: #d9aa3d !important;
  background: linear-gradient(180deg,#438c86 0%,#2f716e 52%,#1e514e 100%) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,249,205,.50),
    inset 0 0 0 2px rgba(240,210,126,.16),
    0 0 0 3px rgba(217,170,61,.22),
    0 8px 18px rgba(32,85,82,.26),
    0 0 18px rgba(217,170,61,.30) !important;
  text-shadow: 0 1px 1px rgba(30,48,39,.48) !important;
  transform: translateY(-2px) scale(1.035) !important;
}
html body #virtues .virtue-step-dot[aria-current="step"]::before,
html body #virtues .virtue-step-dot[aria-selected="true"]::before {
  content: "✦" !important;
  position: absolute !important;
  top: -8px !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
  color: #d9aa3d !important;
  font: 700 8px/1 Georgia, serif !important;
  text-shadow: 0 0 7px rgba(239,205,112,.75) !important;
  pointer-events: none !important;
}

/* Ensure the selected state remains visibly teal/gold on desktop and touch
   devices even while :hover/:active rules from historical styles fire. */
html body #virtues .virtue-step-dot[aria-current="step"]:hover,
html body #virtues .virtue-step-dot[aria-selected="true"]:hover,
html body #virtues .virtue-step-dot.active:hover,
html body #virtues .virtue-step-dot[aria-current="step"]:active,
html body #virtues .virtue-step-dot[aria-selected="true"]:active,
html body #virtues .virtue-step-dot.active:active {
  color: #fff4c8 !important;
  border-color: #d9aa3d !important;
  background: linear-gradient(180deg,#438c86 0%,#2f716e 52%,#1e514e 100%) !important;
}
html body #virtues .virtue-step-dot[aria-current="step"] > span,
html body #virtues .virtue-step-dot[aria-selected="true"] > span,
html body #virtues .virtue-step-dot.active > span {
  color: #fff4c8 !important;
  font-weight: 800 !important;
}
html body #virtues .virtue-guided-stepper .virtue-panel {
  /* User-requested additional 1pt reduction from v44.
     1pt = 1.333px at CSS reference resolution, therefore the previous
     12.67–14.67px treatment becomes approximately 11.34–13.34px. */
  font-size: clamp(11.34px, 1.08vw, 13.34px) !important;
  line-height: 1.50 !important;
}
html body #virtues .virtue-guided-stepper .virtue-panel p {
  font-size: inherit !important;
  line-height: inherit !important;
}
@media (max-width: 900px) {
  html body #virtues .virtue-guided-stepper .virtue-panel {
    font-size: clamp(11.34px, 1.7vw, 12.34px) !important;
    line-height: 1.48 !important;
  }
}
@media (max-width: 560px) {
  html body #virtues .virtue-guided-stepper .virtue-panel {
    font-size: 11.34px !important;
    line-height: 1.46 !important;
  }
}

/* 4) GUEST TRIBUTE WINDOW
   Give the two requested Wisdom headings their own full-width grid row so
   their center is the center of the ENTIRE tile, not the center text column. */
html body #guest-tribute .wisdom-spotlight {
  display: grid !important;
  grid-template-columns: auto minmax(0,1fr) auto !important;
  align-items: center !important;
  gap: 16px !important;
  padding-top: 22px !important;
}
html body #guest-tribute .wisdom-spotlight-heading {
  grid-column: 1 / -1 !important;
  width: 100% !important;
  min-width: 0 !important;
  position: static !important;
  transform: none !important;
  margin: 0 auto 2px !important;
  text-align: center !important;
}
html body #guest-tribute .wisdom-spotlight-heading .mini-eyebrow,
html body #guest-tribute .wisdom-spotlight-heading #wisdomSpotlightHeading {
  position: static !important;
  inset: auto !important;
  transform: none !important;
  width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
  text-align: center !important;
  text-align-last: center !important;
}
html body #guest-tribute .wisdom-spotlight-heading .mini-eyebrow {
  margin-top: 0 !important;
  margin-bottom: 8px !important;
}
html body #guest-tribute .wisdom-spotlight-heading #wisdomSpotlightHeading {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}
@media (max-width: 650px) {
  html body #guest-tribute .wisdom-spotlight {
    grid-template-columns: minmax(0,1fr) !important;
    justify-items: center !important;
    text-align: center !important;
    gap: 12px !important;
  }
  html body #guest-tribute .wisdom-spotlight-heading,
  html body #guest-tribute .wisdom-spotlight-icon,
  html body #guest-tribute .wisdom-spotlight-copy,
  html body #guest-tribute .wisdom-cycle-btn { grid-column: 1 !important; }
  html body #guest-tribute .wisdom-spotlight-copy {
    width: 100% !important;
    min-width: 0 !important;
  }
  html body #guest-tribute .wisdom-spotlight-copy blockquote,
  html body #guest-tribute .wisdom-spotlight-copy .experience-author {
    text-align: center !important;
  }
  html body #guest-tribute .wisdom-cycle-btn {
    width: auto !important;
    min-width: min(180px, 100%) !important;
  }
}

/* 5) APPROVED GUEST BOOK ATTACHMENT VIEWER
   Dedicated viewer with proportional media, obvious return/download controls,
   and phone/tablet dimensions that do not overflow the visual viewport. */
html body .att-preview {
  appearance: none !important;
  border: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border-radius: 14px !important;
  cursor: pointer !important;
  line-height: 0 !important;
}
html body .att-preview:focus-visible {
  outline: 3px solid rgba(47,113,110,.45) !important;
  outline-offset: 3px !important;
}
html body .tribute-attachment-dialog {
  box-sizing: border-box !important;
  width: min(94vw, 980px) !important;
  max-width: 980px !important;
  max-height: 90vh !important;
  max-height: 90dvh !important;
  overflow: auto !important;
  overscroll-behavior: contain !important;
  padding: clamp(22px, 3vw, 34px) !important;
  border: 1px solid rgba(198,146,42,.55) !important;
  border-radius: 24px !important;
  background: linear-gradient(160deg,#fffdf6,#f8efd9) !important;
  color: var(--text) !important;
}
html body .tribute-attachment-dialog::backdrop {
  background: rgba(31,20,12,.66) !important;
  backdrop-filter: blur(4px) !important;
}
html body .tribute-attachment-dialog[open] { display: block !important; }
html body .tribute-attachment-dialog h3 {
  text-align: center !important;
  color: var(--heading) !important;
  margin: 4px 48px 18px !important;
}
html body .tribute-attachment-body {
  min-height: 180px !important;
  display: grid !important;
  place-items: center !important;
  overflow: auto !important;
  overscroll-behavior: contain !important;
  border: 1px solid rgba(198,146,42,.24) !important;
  border-radius: 18px !important;
  background: rgba(255,255,255,.72) !important;
  padding: 12px !important;
}
html body .tribute-attachment-media {
  display: block !important;
  max-width: 100% !important;
  border-radius: 12px !important;
}
html body .tribute-attachment-media--image {
  width: auto !important;
  height: auto !important;
  max-height: 62vh !important;
  max-height: 62dvh !important;
  object-fit: contain !important;
}
html body .tribute-attachment-media--video {
  width: min(100%,860px) !important;
  height: auto !important;
  max-height: 60vh !important;
  max-height: 60dvh !important;
  object-fit: contain !important;
  background: #110c08 !important;
}
html body .tribute-attachment-media--audio { width: min(100%,680px) !important; }
html body .tribute-attachment-media--document {
  width: 100% !important;
  height: min(60vh,620px) !important;
  height: min(60dvh,620px) !important;
  border: 0 !important;
  background: #fff !important;
}
html body .tribute-attachment-document-note {
  text-align: center !important;
  max-width: 560px !important;
  line-height: 1.6 !important;
  padding: 24px 16px !important;
}
html body .tribute-attachment-actions {
  display: flex !important;
  justify-content: center !important;
  gap: 12px !important;
  flex-wrap: wrap !important;
  margin-top: 16px !important;
}
html body .tribute-attachment-actions .btn { min-height: 44px !important; }

@media (max-width: 620px) {
  html body .tribute-attachment-dialog {
    width: 96vw !important;
    width: 96dvw !important;
    max-height: 92vh !important;
    max-height: 92dvh !important;
    padding: 18px 12px 16px !important;
    border-radius: 18px !important;
  }
  html body .tribute-attachment-dialog h3 {
    margin-inline: 42px !important;
    font-size: 1.05rem !important;
  }
  html body .tribute-attachment-body {
    min-height: 140px !important;
    padding: 8px !important;
  }
  html body .tribute-attachment-media--document {
    height: 55vh !important;
    height: 55dvh !important;
  }
  html body .tribute-attachment-actions {
    flex-direction: column !important;
    gap: 9px !important;
  }
  html body .tribute-attachment-actions .btn {
    width: 100% !important;
    min-width: 0 !important;
  }
}

/* ======================================================================
   v84 — SACRED / THANK-YOU TRUE-TRANSPARENT TILE PARITY
   ======================================================================
   Both message tiles use one transparent base: no white, parchment, glass
   fill, blur, or inset wash remains. The gold linework, comet, corners,
   sparkles, divider and entrance motion stay live above that clear surface.
   Sacred receives the same existing Thank You tile accents without changing
   any of its Wisdom, audio, button, or ornamental interactions. */

html body #sacred .sacred-wisdom-audio-frame,
html body #thanks .thanks-message-card {
  --shared-tile-line: rgba(190, 133, 39, .34);
  --shared-tile-inner-line: rgba(205, 161, 61, .30);
  position: relative !important;
  isolation: isolate !important;
  overflow: hidden !important;
  border: 1px solid var(--shared-tile-line) !important;
  border-radius: clamp(22px, 2.4vw, 32px) !important;
  background: transparent !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

/* The Thank You inset is retained as animated linework only: it no longer
   paints a pale inner panel. Sacred keeps its working heritage medallions. */
html body #thanks .thanks-message-card::before {
  background: transparent !important;
  border-color: var(--shared-tile-inner-line) !important;
  box-shadow: none !important;
}

/* The moving aura is an effect, not a tile fill. Keeping it fully separate
   preserves the exact existing animation while the tile remains see-through. */
html body #thanks .thanks-message-card::after {
  background: radial-gradient(ellipse at center, rgba(245, 213, 121, .055), transparent 58%) !important;
}

/* Sacred Dedication uses the very same live Thank You accent elements and
   animation names, so both transparent tiles share identical motion/color. */
html body #sacred .sacred-shared-tile-glowline,
html body #sacred .sacred-shared-tile-corner,
html body #sacred .sacred-shared-tile-spark {
  position: absolute !important;
  pointer-events: none !important;
  z-index: 4 !important;
}
html body #sacred .sacred-shared-tile-glowline {
  inset: 0 !important;
  overflow: hidden !important;
  border-radius: inherit !important;
}
html body #sacred .sacred-shared-tile-glowline::before {
  content: "" !important;
  position: absolute !important;
  left: -42% !important;
  top: -2px !important;
  width: 42% !important;
  height: 2px !important;
  border-radius: 999px !important;
  background: linear-gradient(90deg, transparent, #f2d779 42%, #fff6c8 62%, #2f716e 100%) !important;
  box-shadow: 0 0 10px rgba(240, 215, 121, .64) !important;
  animation: thanksCardComet 5.4s ease-in-out infinite !important;
}
html body #sacred .sacred-shared-tile-corner {
  width: 34px !important;
  height: 34px !important;
  opacity: .56 !important;
}
html body #sacred .sacred-shared-tile-corner::before,
html body #sacred .sacred-shared-tile-corner::after {
  content: "" !important;
  position: absolute !important;
  background: linear-gradient(90deg, #a96628, #e2bd55, #2f716e) !important;
  border-radius: 999px !important;
  transform-origin: center !important;
  animation: thanksCornerGlint 3.8s ease-in-out infinite !important;
}
html body #sacred .sacred-shared-tile-corner::before { width: 32px !important; height: 1px !important; }
html body #sacred .sacred-shared-tile-corner::after { width: 1px !important; height: 32px !important; }
html body #sacred .sacred-shared-tile-corner.thanks-card-corner--tl { left: 16px !important; top: 16px !important; }
html body #sacred .sacred-shared-tile-corner.thanks-card-corner--br { right: 16px !important; bottom: 16px !important; transform: rotate(180deg) !important; }
html body #sacred .sacred-shared-tile-corner.thanks-card-corner--br::before,
html body #sacred .sacred-shared-tile-corner.thanks-card-corner--br::after { animation-delay: -1.9s !important; }
html body #sacred .sacred-shared-tile-spark {
  color: #d3a132 !important;
  line-height: 1 !important;
  text-shadow: 0 0 7px rgba(255, 224, 128, .95), 0 0 18px rgba(188, 126, 29, .46) !important;
  animation: thanksSparkle 3.1s ease-in-out infinite !important;
}
html body #sacred .sacred-shared-tile-spark.thanks-spark--1 { top: 12% !important; left: 6% !important; font-size: 17px !important; }
html body #sacred .sacred-shared-tile-spark.thanks-spark--2 { top: 23% !important; right: 8% !important; font-size: 20px !important; animation-delay: -.8s !important; color: #2f716e !important; }
html body #sacred .sacred-shared-tile-spark.thanks-spark--3 { bottom: 18% !important; left: 9% !important; font-size: 18px !important; animation-delay: -1.6s !important; }
html body #sacred .sacred-shared-tile-spark.thanks-spark--4 { bottom: 12% !important; right: 7% !important; font-size: 14px !important; animation-delay: -2.3s !important; }
html body #sacred.in-view .sacred-wisdom-audio-frame {
  animation: thanksCardArrive 1s .16s cubic-bezier(.2, .72, .2, 1) both !important;
}

@media (max-width: 700px) {
  html body #sacred .sacred-wisdom-audio-frame,
  html body #thanks .thanks-message-card {
    width: min(100%, calc(100vw - 28px)) !important;
    border-radius: 22px !important;
  }
  html body #sacred .sacred-shared-tile-corner.thanks-card-corner--tl { left: 12px !important; top: 12px !important; }
  html body #sacred .sacred-shared-tile-corner.thanks-card-corner--br { right: 12px !important; bottom: 12px !important; }
  html body #sacred .sacred-shared-tile-corner::before { width: 26px !important; }
  html body #sacred .sacred-shared-tile-corner::after { height: 26px !important; }
  html body #sacred .sacred-shared-tile-spark.thanks-spark--1 { left: 3% !important; }
  html body #sacred .sacred-shared-tile-spark.thanks-spark--2 { right: 4% !important; }
  html body #sacred .sacred-shared-tile-spark.thanks-spark--3 { left: 4% !important; }
  html body #sacred .sacred-shared-tile-spark.thanks-spark--4 { right: 3% !important; }
}

@media (prefers-reduced-motion: reduce) {
  html body #sacred.in-view .sacred-wisdom-audio-frame,
  html body #sacred .sacred-shared-tile-glowline::before,
  html body #sacred .sacred-shared-tile-corner::before,
  html body #sacred .sacred-shared-tile-corner::after,
  html body #sacred .sacred-shared-tile-spark {
    animation: none !important;
  }
}

@media (max-width: 360px) {
  html body .tribute-attachment-dialog {
    width: calc(100vw - 12px) !important;
    width: calc(100dvw - 12px) !important;
    padding-inline: 9px !important;
  }
  html body .tribute-attachment-dialog h3 {
    margin-inline: 38px !important;
    font-size: 1rem !important;
  }
}


/* Attachment viewer interaction hardening. */
html body.modal-open { overflow: hidden !important; }
html body .tribute-attachment-dialog [data-tribute-attachment-close]:focus-visible,
html body .tribute-attachment-dialog #tributeAttachmentDownload:focus-visible {
  outline: 3px solid rgba(47,113,110,.55) !important;
  outline-offset: 3px !important;
}
@media (max-width: 620px) {
  html body .tribute-attachment-dialog {
    margin: auto !important;
    max-width: 96dvw !important;
  }
  html body .tribute-attachment-media--image,
  html body .tribute-attachment-media--video {
    max-width: 100% !important;
    width: auto !important;
    height: auto !important;
    object-fit: contain !important;
  }
  html body .tribute-attachment-media--video {
    width: 100% !important;
  }
}
/* Older WebKit <dialog> fallback. Native showModal() browsers ignore this. */
html body .tribute-attachment-dialog.tribute-attachment-fallback[open] {
  position: fixed !important;
  left: 50% !important;
  top: 50% !important;
  right: auto !important;
  bottom: auto !important;
  transform: translate(-50%, -50%) !important;
  z-index: 1000 !important;
  box-shadow: 0 0 0 100vmax rgba(31,20,12,.66), 0 40px 120px rgba(0,0,0,.35) !important;
}

/* ======================================================================
   v46 — VIRTUES FILMSTRIP/STAGE + SACRED TEXT-ONLY + ACADEMIC HERITAGE
   Final cascade layer. Interaction logic is preserved; this block changes
   presentation/layout only and keeps the existing animation vocabulary.
   ====================================================================== */

/* ----------------------------------------------------------------------
   SACRED DEDICATION — remove the white message panel completely.
   The dedication is now text directly on the page. Title shimmer, halo,
   orbit/fireflies and the paragraph entrance animation remain untouched.
   ---------------------------------------------------------------------- */
html body #sacred .sacred-celestial-message {
  position: relative !important;
  width: min(100%, 1220px) !important;
  max-width: 1220px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding: 2px clamp(4px, 1vw, 10px) !important;
  overflow: visible !important;
  isolation: auto !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}
html body #sacred .sacred-celestial-message::before,
html body #sacred .sacred-celestial-message::after {
  content: none !important;
  display: none !important;
  border: 0 !important;
  background: none !important;
  box-shadow: none !important;
  animation: none !important;
}
/* These belonged to the former card/panel, so remove them with the panel. */
html body #sacred .sacred-message-glowline,
html body #sacred .sacred-message-corner,
html body #sacred .sacred-message-spark {
  display: none !important;
}
@media (max-width: 700px) {
  html body #sacred .sacred-celestial-message {
    padding: 0 4px !important;
    border-radius: 0 !important;
  }
}

/* ----------------------------------------------------------------------
   VIRTUES & WISDOM — two independent audio plaques + five-tile filmstrip
   above one large stage. Theme follows the site's burgundy, antique-gold,
   parchment and teal heritage palette.
   ---------------------------------------------------------------------- */
html body #virtues .virtue-filmstage-shell {
  --virtue-wine: #741f2a;
  --virtue-wine-deep: #53151d;
  --virtue-gold: #b98022;
  --virtue-gold-soft: #e7c66a;
  --virtue-teal: #2f716e;
  --virtue-paper: #fffaf0;
  width: min(100%, 1180px) !important;
  margin: 0 auto !important;
  padding: clamp(18px, 2.6vw, 30px) !important;
  border: 1px solid rgba(174,114,23,.34) !important;
  border-radius: 24px !important;
  background:
    radial-gradient(circle at 50% -10%, rgba(232,201,111,.14), transparent 33%),
    linear-gradient(180deg, rgba(255,253,247,.88), rgba(250,240,216,.72)) !important;
  box-shadow:
    0 16px 42px rgba(73,39,8,.07),
    inset 0 0 0 4px rgba(255,255,255,.55),
    inset 0 0 0 5px rgba(183,122,31,.06) !important;
}

/* Separate complete audio setups, always distinct from the changing stage. */
html body #virtues .virtue-audio-pair {
  width: min(100%, 1020px) !important;
  margin: 6px auto clamp(18px, 2.2vw, 26px) !important;
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: clamp(12px, 1.7vw, 18px) !important;
}
html body #virtues .virtue-audio-card {
  position: relative !important;
  min-width: 0 !important;
  padding: 14px 15px 13px !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: center !important;
  gap: 12px !important;
  border: 1px solid rgba(174,114,23,.44) !important;
  border-radius: 16px !important;
  background:
    radial-gradient(circle at 50% 0%, rgba(237,205,122,.10), transparent 45%),
    linear-gradient(180deg, rgba(255,254,249,.96), rgba(252,245,227,.92)) !important;
  box-shadow:
    0 7px 18px rgba(73,36,4,.06),
    inset 0 0 0 3px rgba(255,255,255,.55) !important;
  overflow: hidden !important;
}
html body #virtues .virtue-audio-card::before {
  content: "" !important;
  position: absolute !important;
  left: 12px !important;
  right: 12px !important;
  top: 5px !important;
  height: 1px !important;
  background: linear-gradient(90deg, transparent, rgba(185,128,34,.62), transparent) !important;
  pointer-events: none !important;
}
html body #virtues .virtue-audio-card--ragini {
  border-top: 3px double #c99a38 !important;
}
html body #virtues .virtue-audio-card--vijay {
  border-top: 3px double #397f7e !important;
}
html body #virtues .virtue-audio-identity {
  min-width: 0 !important;
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
}
html body #virtues .virtue-audio-avatar {
  width: 42px !important;
  height: 42px !important;
  flex: 0 0 42px !important;
  display: grid !important;
  place-items: center !important;
  border-radius: 50% !important;
  border: 1px solid rgba(157,98,19,.58) !important;
  background: radial-gradient(circle at 38% 28%, #fff1b4, #d9aa45 62%, #a56e1b 100%) !important;
  color: #661d27 !important;
  box-shadow: inset 0 0 0 3px rgba(255,247,211,.48), 0 4px 10px rgba(70,35,3,.10) !important;
  font: 700 19px/1 var(--font-display, Georgia, serif) !important;
}
html body #virtues .virtue-audio-kicker {
  margin: 0 0 2px !important;
  color: #9b691c !important;
  font: 600 10px/1.2 var(--font-body, sans-serif) !important;
  letter-spacing: .16em !important;
  text-transform: uppercase !important;
}
html body #virtues .virtue-audio-identity h4 {
  margin: 0 !important;
  color: var(--virtue-wine) !important;
  font-size: clamp(15px, 1.3vw, 18px) !important;
  line-height: 1.2 !important;
}
html body #virtues .virtue-audio-identity p:last-child {
  margin: 3px 0 0 !important;
  color: #745d42 !important;
  font-size: clamp(11px, .96vw, 13px) !important;
  line-height: 1.3 !important;
}
html body #virtues .virtue-audio-card .voice-open {
  width: auto !important;
  min-width: 142px !important;
  min-height: 42px !important;
  margin: 0 !important;
  padding: 8px 12px !important;
  white-space: nowrap !important;
  font-size: 12.5px !important;
}
html body #virtues .virtue-audio-card .voice-ico {
  width: 23px !important;
  height: 23px !important;
  flex: 0 0 23px !important;
}

/* Main virtue Filmstrip & Stage shell. */
html body #virtues .virtue-filmstage {
  position: relative !important;
  width: 100% !important;
  padding: clamp(19px, 2.8vw, 30px) !important;
  border: 1px solid rgba(174,114,23,.52) !important;
  border-radius: 20px !important;
  background:
    radial-gradient(circle at 50% -9%, rgba(232,201,111,.16), transparent 31%),
    radial-gradient(circle at 7% 46%, rgba(116,31,42,.028), transparent 26%),
    radial-gradient(circle at 93% 46%, rgba(47,113,110,.035), transparent 26%),
    linear-gradient(180deg, rgba(255,253,247,.98), rgba(250,240,216,.92)) !important;
  box-shadow:
    0 14px 36px rgba(73,39,8,.08),
    inset 0 0 0 4px rgba(255,255,255,.58),
    inset 0 0 0 5px rgba(183,122,31,.07) !important;
  overflow: hidden !important;
}
html body #virtues .virtue-filmstage::before,
html body #virtues .virtue-filmstage::after {
  content: "◆" !important;
  position: absolute !important;
  top: 13px !important;
  width: 25px !important;
  height: 25px !important;
  display: grid !important;
  place-items: center !important;
  border-radius: 50% !important;
  color: var(--virtue-wine) !important;
  background: radial-gradient(circle, #fff8df 0 48%, #e8c96f 50% 65%, #9a5c16 67% 72%, transparent 73%) !important;
  font: 700 8px/1 Georgia, serif !important;
  opacity: .74 !important;
  pointer-events: none !important;
}
html body #virtues .virtue-filmstage::before { left: 14px !important; }
html body #virtues .virtue-filmstage::after { right: 14px !important; }
html body #virtues .virtue-filmstage-ornament {
  width: min(100%, 780px) !important;
  height: clamp(26px, 3vw, 38px) !important;
  margin: 0 auto 13px !important;
  background: url('assets/ornament-divider-5.png') center / contain no-repeat !important;
  opacity: .64 !important;
}
html body #virtues .virtue-filmstage-ornament--bottom {
  margin: 15px auto 0 !important;
  transform: rotate(180deg) !important;
  opacity: .46 !important;
}

html body #virtues .virtue-filmstrip-shell {
  position: relative !important;
  width: 100% !important;
  margin: 0 auto 16px !important;
  padding: 10px 6px 11px !important;
  border-top: 1px solid rgba(183,122,31,.34) !important;
  border-bottom: 1px solid rgba(183,122,31,.34) !important;
  background: linear-gradient(90deg, transparent, rgba(232,201,111,.10) 10% 90%, transparent) !important;
}
html body #virtues .virtue-filmstrip-nav {
  width: 100% !important;
  display: grid !important;
  grid-template-columns: auto minmax(0, 1fr) auto !important;
  align-items: center !important;
  gap: clamp(8px, 1vw, 12px) !important;
}
html body #virtues .virtue-stepper-dots.virtue-filmstrip {
  width: 100% !important;
  min-width: 0 !important;
  display: grid !important;
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  gap: 8px !important;
  overflow: visible !important;
  padding: 0 !important;
}
html body #virtues .virtue-filmstrip-tab {
  position: relative !important;
  width: 100% !important;
  min-width: 0 !important;
  min-height: 88px !important;
  height: auto !important;
  padding: 12px 8px 10px !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 7px !important;
  border: 1px solid rgba(167,105,21,.40) !important;
  border-radius: 12px !important;
  background:
    radial-gradient(circle at 50% 0%, rgba(244,222,154,.16), transparent 48%),
    linear-gradient(180deg, rgba(255,254,249,.98), rgba(251,242,219,.94)) !important;
  color: #6b2a20 !important;
  box-shadow:
    0 5px 12px rgba(75,38,5,.05),
    inset 0 0 0 3px rgba(255,255,255,.52),
    inset 0 0 0 4px rgba(183,122,31,.05) !important;
  transform: none !important;
  overflow: hidden !important;
  isolation: isolate !important;
  transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease, background .16s ease, color .16s ease !important;
}
html body #virtues .virtue-filmstrip-tab::after {
  content: "" !important;
  position: absolute !important;
  left: 23% !important;
  right: 23% !important;
  bottom: 7px !important;
  height: 2px !important;
  border: 0 !important;
  border-radius: 99px !important;
  background: linear-gradient(90deg, transparent, var(--virtue-gold), transparent) !important;
  opacity: .40 !important;
}
html body #virtues .virtue-filmstrip-tab:hover,
html body #virtues .virtue-filmstrip-tab:focus-visible {
  border-color: rgba(152,87,16,.68) !important;
  background:
    radial-gradient(circle at 50% 0%, rgba(244,222,154,.30), transparent 50%),
    linear-gradient(180deg, #fffdf5, #f8e9c2) !important;
  box-shadow: 0 9px 20px rgba(76,38,5,.10), inset 0 0 0 3px rgba(255,255,255,.64) !important;
  transform: translateY(-2px) !important;
}
html body #virtues .virtue-filmstrip-tab[aria-selected="true"],
html body #virtues .virtue-filmstrip-tab.active,
html body #virtues .virtue-filmstrip-tab[aria-current="step"] {
  border: 1px solid #8d5218 !important;
  background:
    radial-gradient(circle at 50% 8%, rgba(255,225,137,.18), transparent 45%),
    linear-gradient(180deg, #3f8580 0%, #2f716e 52%, #235957 100%) !important;
  color: #ffecaa !important;
  box-shadow:
    0 10px 24px rgba(35,89,87,.22),
    inset 0 0 0 2px #e7bd58,
    inset 0 0 0 5px rgba(255,241,190,.08) !important;
  transform: translateY(-3px) !important;
}
html body #virtues .virtue-filmstrip-tab[aria-selected="true"]::before,
html body #virtues .virtue-filmstrip-tab.active::before,
html body #virtues .virtue-filmstrip-tab[aria-current="step"]::before {
  content: "✦" !important;
  position: absolute !important;
  top: 5px !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
  color: #f0ce72 !important;
  font: 700 8px/1 Georgia, serif !important;
  text-shadow: 0 0 7px rgba(239,205,112,.72) !important;
  animation: thanksTitleTwinkle 2.4s ease-in-out infinite !important;
  pointer-events: none !important;
}
html body #virtues .virtue-filmstrip-icon {
  width: 31px !important;
  height: 31px !important;
  display: grid !important;
  place-items: center !important;
  color: #aa771e !important;
  border-radius: 50% !important;
  background: radial-gradient(circle, rgba(255,249,226,.95) 0 57%, rgba(215,175,82,.20) 59% 72%, transparent 73%) !important;
  filter: drop-shadow(0 2px 2px rgba(73,38,5,.08)) !important;
  transition: color .18s ease, transform .18s ease !important;
}
html body #virtues .virtue-filmstrip-icon svg {
  width: 22px !important;
  height: 22px !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 1.7 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}
html body #virtues .virtue-filmstrip-tab[aria-selected="true"] .virtue-filmstrip-icon,
html body #virtues .virtue-filmstrip-tab.active .virtue-filmstrip-icon {
  color: #f3cf72 !important;
  background: radial-gradient(circle, rgba(27,73,71,.98) 0 57%, rgba(243,207,114,.22) 59% 72%, transparent 73%) !important;
  transform: translateY(-1px) scale(1.07) !important;
}
html body #virtues .virtue-filmstrip-label {
  display: block !important;
  color: inherit !important;
  text-align: center !important;
  font: 700 clamp(11.5px, .92vw, 13.5px)/1.2 var(--font-display, Georgia, serif) !important;
  letter-spacing: .055em !important;
  text-transform: uppercase !important;
  white-space: normal !important;
}
html body #virtues .virtue-filmstrip-arrow {
  min-width: 92px !important;
  min-height: 44px !important;
  padding: 8px 11px !important;
  border-radius: 999px !important;
}
html body #virtues .virtue-stepper-hint--top {
  max-width: 900px !important;
  margin: 9px auto 0 !important;
  color: #7d684f !important;
  font: italic 12.5px/1.4 var(--font-serif, Georgia, serif) !important;
  text-align: center !important;
}

/* The one large stage. */
html body #virtues .virtue-stage {
  position: relative !important;
  padding: clamp(31px, 3.5vw, 42px) clamp(16px, 2.8vw, 30px) clamp(20px, 2.8vw, 30px) !important;
  border: 1px solid rgba(163,101,17,.62) !important;
  border-radius: 15px !important;
  background:
    radial-gradient(circle at 50% -8%, rgba(232,201,111,.13), transparent 30%),
    linear-gradient(180deg, rgba(255,254,250,.98), rgba(255,249,235,.94)) !important;
  box-shadow:
    0 14px 32px rgba(67,32,4,.07),
    inset 0 0 0 4px rgba(255,255,255,.70),
    inset 0 0 0 5px rgba(183,122,31,.09) !important;
  overflow: hidden !important;
  transform-origin: 50% 18% !important;
}
html body #virtues .virtue-stage::before {
  content: "" !important;
  position: absolute !important;
  top: 5px !important;
  left: 50% !important;
  width: min(190px, 42%) !important;
  height: 30px !important;
  transform: translateX(-50%) !important;
  background: url('assets/orn-motif-gold.png') center / contain no-repeat !important;
  opacity: .48 !important;
  pointer-events: none !important;
}
html body #virtues .virtue-stage::after {
  content: "" !important;
  position: absolute !important;
  inset: 8px !important;
  border: 1px solid rgba(183,122,31,.13) !important;
  border-radius: 10px !important;
  background: none !important;
  pointer-events: none !important;
}
html body #virtues .virtue-stage-head {
  position: relative !important;
  z-index: 1 !important;
  display: flex !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  gap: 16px !important;
  padding: 2px 2px 0 !important;
}
html body #virtues .virtue-stage-heading-copy { min-width: 0 !important; }
html body #virtues .virtue-stage-kicker {
  margin: 0 0 4px !important;
  color: #9b691c !important;
  font: 600 11px/1.2 var(--font-body, sans-serif) !important;
  letter-spacing: .20em !important;
  text-transform: uppercase !important;
}
html body #virtues .virtue-stage-head h4 {
  margin: 0 !important;
  color: var(--virtue-wine) !important;
  font: 700 clamp(23px, 2.6vw, 32px)/1.08 var(--font-display, Georgia, serif) !important;
  letter-spacing: .04em !important;
}
html body #virtues .virtue-stage-head #virtueCurrentIntro {
  max-width: 850px !important;
  margin: 7px 0 0 !important;
  color: #745d42 !important;
  font: italic clamp(14px, 1.25vw, 17px)/1.45 var(--font-serif, Georgia, serif) !important;
}
html body #virtues .virtue-stage-count {
  flex: 0 0 auto !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 68px !important;
  min-height: 33px !important;
  margin: 0 !important;
  padding: 5px 10px !important;
  border: 1px solid rgba(144,79,17,.54) !important;
  border-radius: 999px !important;
  background: linear-gradient(180deg, #fff7dd, #ead095) !important;
  color: #64202a !important;
  box-shadow: inset 0 0 0 2px rgba(255,255,255,.50), 0 4px 10px rgba(81,40,4,.07) !important;
  font-size: 11px !important;
  letter-spacing: .08em !important;
  text-transform: uppercase !important;
}
html body #virtues .virtue-stage .virtue-stepper-progress-shell {
  width: 100% !important;
  margin: 11px 0 0 !important;
  position: relative !important;
  z-index: 1 !important;
}
html body #virtues .virtue-stage .virtue-stepper-progress-track {
  height: 4px !important;
  border-radius: 99px !important;
  background: rgba(183,122,31,.12) !important;
  overflow: hidden !important;
}
html body #virtues .virtue-stage .virtue-stepper-progress-track > span {
  display: block !important;
  height: 100% !important;
  background: linear-gradient(90deg, var(--virtue-wine), var(--virtue-gold-soft), var(--virtue-teal)) !important;
}
html body #virtues .virtue-stage-rule {
  height: 4px !important;
  margin: 12px 0 17px !important;
  background: linear-gradient(90deg, transparent 0 3%, var(--virtue-wine) 14%, var(--virtue-gold-soft) 47%, #fff6cf 50%, var(--virtue-gold-soft) 53%, var(--virtue-teal) 86%, transparent 97%) !important;
  box-shadow: 0 1px 0 rgba(255,255,255,.8) !important;
}
html body #virtues .virtue-stage-grid {
  position: relative !important;
  z-index: 1 !important;
  gap: clamp(11px, 1.5vw, 16px) !important;
}
html body #virtues .virtue-stage .parent-card {
  min-width: 0 !important;
  padding: clamp(14px, 1.6vw, 18px) !important;
  border-radius: 12px !important;
  background:
    radial-gradient(circle at 50% 0%, rgba(237,205,122,.06), transparent 34%),
    linear-gradient(180deg, rgba(255,254,249,.98), rgba(253,246,229,.94)) !important;
  box-shadow: 0 6px 15px rgba(73,36,4,.05), inset 0 0 0 3px rgba(255,255,255,.52) !important;
}
html body #virtues .virtue-stage .parent-card[data-parent="ragini"] { border-top: 4px double #c99a38 !important; }
html body #virtues .virtue-stage .parent-card[data-parent="vijay"] { border-top: 4px double #397f7e !important; }
html body #virtues .virtue-filmstage-hint {
  margin: 11px auto 0 !important;
  max-width: 840px !important;
  color: #80694f !important;
  text-align: center !important;
  font: italic 12px/1.4 var(--font-serif, Georgia, serif) !important;
}

/* Tablet: filmstrip scrolls locally instead of crowding. */
@media (max-width: 980px) {
  html body #virtues .virtue-filmstrip-nav {
    grid-template-columns: auto minmax(0, 1fr) auto !important;
  }
  html body #virtues .virtue-stepper-dots.virtue-filmstrip {
    display: flex !important;
    justify-content: flex-start !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    overscroll-behavior-inline: contain !important;
    scrollbar-width: thin !important;
    padding: 2px 2px 5px !important;
    -webkit-overflow-scrolling: touch !important;
  }
  html body #virtues .virtue-filmstrip-tab {
    flex: 0 0 132px !important;
    width: 132px !important;
    min-height: 88px !important;
  }
}

@media (max-width: 700px) {
  html body #virtues .virtue-filmstage-shell {
    padding: 15px 10px !important;
    border-radius: 18px !important;
  }
  html body #virtues .virtue-audio-pair {
    grid-template-columns: 1fr !important;
    width: min(100%, 430px) !important;
    gap: 9px !important;
    margin-bottom: 16px !important;
  }
  html body #virtues .virtue-audio-card {
    grid-template-columns: minmax(0, 1fr) auto !important;
    padding: 12px 11px !important;
    gap: 8px !important;
  }
  html body #virtues .virtue-audio-avatar {
    width: 38px !important;
    height: 38px !important;
    flex-basis: 38px !important;
    font-size: 17px !important;
  }
  html body #virtues .virtue-audio-card .voice-open {
    min-width: 118px !important;
    min-height: 40px !important;
    padding-inline: 9px !important;
    font-size: 11.5px !important;
  }
  html body #virtues .virtue-filmstage {
    padding: 17px 9px 18px !important;
    border-radius: 16px !important;
  }
  html body #virtues .virtue-filmstage-ornament {
    height: 25px !important;
    margin-bottom: 10px !important;
  }
  html body #virtues .virtue-filmstrip-shell {
    padding: 9px 2px 10px !important;
    margin-bottom: 13px !important;
  }
  html body #virtues .virtue-filmstrip-nav {
    grid-template-columns: 1fr 1fr !important;
    gap: 8px !important;
  }
  html body #virtues #virtuePrev {
    grid-column: 1 !important;
    grid-row: 1 !important;
    justify-self: stretch !important;
  }
  html body #virtues #virtueNext {
    grid-column: 2 !important;
    grid-row: 1 !important;
    justify-self: stretch !important;
  }
  html body #virtues .virtue-stepper-dots.virtue-filmstrip {
    grid-column: 1 / -1 !important;
    grid-row: 2 !important;
    width: 100% !important;
  }
  html body #virtues .virtue-filmstrip-arrow {
    width: 100% !important;
    min-width: 0 !important;
  }
  html body #virtues .virtue-filmstrip-tab {
    flex-basis: 116px !important;
    width: 116px !important;
    min-height: 82px !important;
    padding: 10px 7px 9px !important;
  }
  html body #virtues .virtue-filmstrip-icon {
    width: 28px !important;
    height: 28px !important;
  }
  html body #virtues .virtue-filmstrip-icon svg {
    width: 20px !important;
    height: 20px !important;
  }
  html body #virtues .virtue-stepper-hint--top {
    font-size: 11.5px !important;
    padding-inline: 4px !important;
  }
  html body #virtues .virtue-stage {
    padding: 29px 10px 15px !important;
    border-radius: 13px !important;
  }
  html body #virtues .virtue-stage::before {
    width: 135px !important;
    height: 24px !important;
  }
  html body #virtues .virtue-stage::after {
    inset: 6px !important;
    border-radius: 8px !important;
  }
  html body #virtues .virtue-stage-head {
    gap: 8px !important;
  }
  html body #virtues .virtue-stage-head h4 {
    font-size: clamp(21px, 7vw, 27px) !important;
  }
  html body #virtues .virtue-stage-head #virtueCurrentIntro {
    font-size: 13px !important;
    line-height: 1.4 !important;
  }
  html body #virtues .virtue-stage-count {
    min-width: 58px !important;
    min-height: 30px !important;
    padding-inline: 8px !important;
    font-size: 10px !important;
  }
  html body #virtues .virtue-stage-rule {
    margin: 10px 0 14px !important;
  }
  html body #virtues .virtue-stage-grid {
    grid-template-columns: 1fr !important;
    gap: 10px !important;
  }
}

@media (max-width: 430px) {
  html body #virtues .virtue-audio-card {
    grid-template-columns: 1fr !important;
  }
  html body #virtues .virtue-audio-card .voice-open {
    width: 100% !important;
    min-width: 0 !important;
  }
  html body #virtues .virtue-filmstrip-tab {
    flex-basis: 108px !important;
    width: 108px !important;
    min-height: 78px !important;
  }
  html body #virtues .virtue-filmstrip-label {
    font-size: 10.5px !important;
    letter-spacing: .04em !important;
  }
  html body #virtues .virtue-stage-head {
    align-items: flex-start !important;
  }
  html body #virtues .virtue-stage-count {
    min-width: 54px !important;
  }
}

/* ----------------------------------------------------------------------
   ACADEMIC TRIUMPH — deepen the traditional archival/heritage treatment.
   No interaction, publication, keyboard or mobile logic is changed.
   ---------------------------------------------------------------------- */
html body #academic .academic-filmstage {
  border: 2px double rgba(151,91,18,.56) !important;
  background:
    linear-gradient(135deg, rgba(183,122,31,.11) 0 1px, transparent 1px) 15px 15px/28px 28px no-repeat,
    linear-gradient(225deg, rgba(183,122,31,.11) 0 1px, transparent 1px) calc(100% - 15px) 15px/28px 28px no-repeat,
    linear-gradient(45deg, rgba(183,122,31,.11) 0 1px, transparent 1px) 15px calc(100% - 15px)/28px 28px no-repeat,
    linear-gradient(315deg, rgba(183,122,31,.11) 0 1px, transparent 1px) calc(100% - 15px) calc(100% - 15px)/28px 28px no-repeat,
    radial-gradient(circle at 50% -8%, rgba(232,201,111,.22), transparent 31%),
    radial-gradient(circle at 8% 48%, rgba(116,31,42,.04), transparent 26%),
    radial-gradient(circle at 92% 48%, rgba(47,113,110,.04), transparent 26%),
    linear-gradient(180deg, rgba(255,253,247,.99), rgba(249,238,211,.95)) !important;
  box-shadow:
    0 20px 52px rgba(73,39,8,.11),
    inset 0 0 0 4px rgba(255,255,255,.70),
    inset 0 0 0 6px rgba(183,122,31,.10),
    inset 0 0 42px rgba(183,122,31,.035) !important;
}
html body #academic .academic-filmstrip-shell {
  border-top: 3px double rgba(151,91,18,.36) !important;
  border-bottom: 3px double rgba(151,91,18,.36) !important;
  background:
    radial-gradient(ellipse at center, rgba(232,201,111,.13), transparent 72%),
    linear-gradient(90deg, transparent, rgba(232,201,111,.08) 10% 90%, transparent) !important;
}
html body #academic .academic-filmstrip-tab {
  border-top: 3px double rgba(167,105,21,.48) !important;
  box-shadow:
    0 6px 14px rgba(75,38,5,.06),
    inset 0 0 0 3px rgba(255,255,255,.58),
    inset 0 0 0 5px rgba(183,122,31,.045) !important;
}
html body #academic .academic-filmstrip-tab.active {
  border-top: 3px double #e7bd58 !important;
}
html body #academic .academic-stage {
  border: 2px double rgba(151,91,18,.58) !important;
  background:
    linear-gradient(135deg, rgba(183,122,31,.10) 0 1px, transparent 1px) 14px 14px/24px 24px no-repeat,
    linear-gradient(225deg, rgba(183,122,31,.10) 0 1px, transparent 1px) calc(100% - 14px) 14px/24px 24px no-repeat,
    radial-gradient(circle at 50% -8%, rgba(232,201,111,.17), transparent 31%),
    linear-gradient(180deg, rgba(255,254,250,.99), rgba(255,248,232,.95)) !important;
  box-shadow:
    0 16px 38px rgba(67,32,4,.09),
    inset 0 0 0 4px rgba(255,255,255,.74),
    inset 0 0 0 6px rgba(183,122,31,.095) !important;
}
html body #academic .academic-card {
  border-left: 1px solid rgba(166,103,17,.46) !important;
  border-right: 1px solid rgba(166,103,17,.46) !important;
  border-bottom: 1px solid rgba(166,103,17,.46) !important;
  background:
    repeating-linear-gradient(0deg, rgba(145,91,18,.018) 0 1px, transparent 1px 25px),
    radial-gradient(circle at 50% 0%, rgba(237,205,122,.10), transparent 34%),
    linear-gradient(180deg, rgba(255,254,249,.99), rgba(252,243,221,.96)) !important;
}
html body #academic .academic-stage-rule {
  height: 6px !important;
  background:
    linear-gradient(90deg, transparent 0 2%, #741f2a 12%, #b98022 31%, #f1d77e 48%, #fff6cf 50%, #f1d77e 52%, #2f716e 88%, transparent 98%) !important;
}
@media (max-width: 700px) {
  html body #academic .academic-filmstage,
  html body #academic .academic-stage {
    border-width: 1px !important;
  }
  html body #academic .academic-filmstrip-shell {
    border-top-width: 2px !important;
    border-bottom-width: 2px !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  html body #virtues .virtue-filmstrip-tab,
  html body #virtues .virtue-filmstrip-icon,
  html body #virtues .virtue-filmstrip-tab[aria-selected="true"]::before {
    transition: none !important;
    animation: none !important;
  }
}

/* ======================================================================
   v47 — SACRED CENTERING + VIRTUES/ACADEMIC UI PARITY
   Latest requested pass. Loaded last. No existing JS interaction is removed:
   virtue tile clicks, keyboard arrows/Home/End and stage swipe remain active.
   ====================================================================== */

/* SACRED DEDICATION — center the full statement on the exact same visual
   axis as the section heading. Let the browser balance the text rather than
   forcing an uneven author-authored line break. */
html body #sacred .sacred-heading-stack,
html body #sacred .sacred-celestial-message {
  left: 50% !important;
  width: min(96vw, 1180px) !important;
  max-width: 1180px !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  transform: translateX(-50%) !important;
  text-align: center !important;
  text-align-last: center !important;
}
html body #sacred .sacred-heading-stack {
  transform: translate(-50%, -50%) !important;
}
html body #sacred .sacred-celestial-message {
  box-sizing: border-box !important;
  padding-left: clamp(8px, 1.4vw, 18px) !important;
  padding-right: clamp(8px, 1.4vw, 18px) !important;
  text-wrap: balance !important;
  white-space: normal !important;
}
html body #sacred .sacred-celestial-message br {
  display: none !important;
}

/* VIRTUES — the audio pair remains separate above the filmstrip. Remove the
   extra outer card treatment so the five-topic filmstrip/stage reads as the
   same clean archival component used by Academic Triumph. */
html body #virtues .virtue-filmstage-shell {
  width: min(100%, 1160px) !important;
  max-width: 1160px !important;
  margin: 0 auto !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}
html body #virtues .virtue-stepper-ornament {
  display: none !important;
}
html body #virtues .virtue-audio-pair {
  width: 100% !important;
  max-width: 1160px !important;
  margin: 0 auto clamp(18px, 2.4vw, 26px) !important;
}

/* Exact five-tile analogue of Academic Triumph's six-tile filmstrip. */
html body #virtues .virtue-filmstage {
  --virtue-wine: #741f2a;
  --virtue-wine-deep: #55151d;
  --virtue-antique: #b77a1f;
  --virtue-gold-soft: #e8c96f;
  --virtue-parchment: #fffaf0;
  position: relative !important;
  width: 100% !important;
  max-width: 1160px !important;
  margin: 0 auto !important;
  padding: clamp(24px, 3.2vw, 38px) !important;
  border: 2px double rgba(151,91,18,.56) !important;
  border-radius: 22px !important;
  background:
    linear-gradient(135deg, rgba(183,122,31,.11) 0 1px, transparent 1px) 15px 15px/28px 28px no-repeat,
    linear-gradient(225deg, rgba(183,122,31,.11) 0 1px, transparent 1px) calc(100% - 15px) 15px/28px 28px no-repeat,
    linear-gradient(45deg, rgba(183,122,31,.11) 0 1px, transparent 1px) 15px calc(100% - 15px)/28px 28px no-repeat,
    linear-gradient(315deg, rgba(183,122,31,.11) 0 1px, transparent 1px) calc(100% - 15px) calc(100% - 15px)/28px 28px no-repeat,
    radial-gradient(circle at 50% -8%, rgba(232,201,111,.22), transparent 31%),
    radial-gradient(circle at 8% 48%, rgba(116,31,42,.04), transparent 26%),
    radial-gradient(circle at 92% 48%, rgba(47,113,110,.04), transparent 26%),
    linear-gradient(180deg, rgba(255,253,247,.99), rgba(249,238,211,.95)) !important;
  box-shadow:
    0 20px 52px rgba(73,39,8,.11),
    inset 0 0 0 4px rgba(255,255,255,.70),
    inset 0 0 0 6px rgba(183,122,31,.10),
    inset 0 0 42px rgba(183,122,31,.035) !important;
  overflow: hidden !important;
}
html body #virtues .virtue-filmstage::before,
html body #virtues .virtue-filmstage::after {
  content: "◆" !important;
  top: 16px !important;
  width: 28px !important;
  height: 28px !important;
  display: grid !important;
  place-items: center !important;
  border-radius: 50% !important;
  color: var(--virtue-wine) !important;
  background: radial-gradient(circle, #fff8df 0 48%, #e8c96f 50% 65%, #9a5c16 67% 72%, transparent 73%) !important;
  font: 700 9px/1 Georgia, serif !important;
  opacity: .78 !important;
  filter: drop-shadow(0 3px 4px rgba(83,43,7,.14)) !important;
}
html body #virtues .virtue-filmstage::before { left: 16px !important; }
html body #virtues .virtue-filmstage::after { right: 16px !important; }

html body #virtues .virtue-filmstage-ornament {
  width: min(100%, 860px) !important;
  height: clamp(30px, 3.2vw, 42px) !important;
  margin: 0 auto 18px !important;
  background: url('assets/ornament-divider-5.png') center / contain no-repeat !important;
  opacity: .72 !important;
}
html body #virtues .virtue-filmstage-ornament--bottom {
  margin: 20px auto 0 !important;
  transform: rotate(180deg) !important;
  opacity: .52 !important;
}

html body #virtues .virtue-filmstrip-shell {
  position: relative !important;
  width: 100% !important;
  overflow: hidden !important;
  margin: 0 auto 22px !important;
  padding: 12px 8px 13px !important;
  border-top: 3px double rgba(151,91,18,.36) !important;
  border-bottom: 3px double rgba(151,91,18,.36) !important;
  background:
    radial-gradient(ellipse at center, rgba(232,201,111,.13), transparent 72%),
    linear-gradient(90deg, transparent, rgba(232,201,111,.11) 10% 90%, transparent),
    rgba(255,250,240,.42) !important;
}
html body #virtues .virtue-filmstrip-shell::before,
html body #virtues .virtue-filmstrip-shell::after {
  content: "" !important;
  position: absolute !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
  width: min(94%, 930px) !important;
  height: 1px !important;
  background: linear-gradient(90deg, transparent, var(--virtue-wine), var(--virtue-gold-soft), var(--teal), transparent) !important;
  opacity: .55 !important;
  pointer-events: none !important;
}
html body #virtues .virtue-filmstrip-shell::before { top: 4px !important; }
html body #virtues .virtue-filmstrip-shell::after { bottom: 4px !important; }

html body #virtues .virtue-stepper-dots.virtue-filmstrip {
  display: grid !important;
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  gap: 8px !important;
  width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}
html body #virtues .virtue-filmstrip-tab {
  position: relative !important;
  width: 100% !important;
  min-width: 0 !important;
  min-height: 104px !important;
  padding: 15px 9px 13px !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  border: 1px solid rgba(167,105,21,.40) !important;
  border-top: 3px double rgba(167,105,21,.48) !important;
  border-radius: 13px !important;
  background:
    radial-gradient(circle at 50% 0%, rgba(244,222,154,.18), transparent 48%),
    linear-gradient(180deg, rgba(255,254,249,.98), rgba(251,242,219,.94)) !important;
  color: #6b2a20 !important;
  box-shadow:
    0 6px 14px rgba(75,38,5,.06),
    inset 0 0 0 3px rgba(255,255,255,.58),
    inset 0 0 0 5px rgba(183,122,31,.045) !important;
  text-shadow: none !important;
  font-family: var(--font-display) !important;
  letter-spacing: .035em !important;
  transform: none !important;
  overflow: hidden !important;
  isolation: isolate !important;
  transition: transform .25s var(--ease), border-color .25s ease, box-shadow .25s ease, background .25s ease, color .25s ease !important;
}
html body #virtues .virtue-filmstrip-tab::before {
  content: "" !important;
  position: absolute !important;
  inset: 5px !important;
  border: 1px solid rgba(183,122,31,.16) !important;
  border-radius: 9px !important;
  pointer-events: none !important;
  background:
    linear-gradient(135deg, rgba(183,122,31,.32) 0 1px, transparent 1px) top left/12px 12px no-repeat,
    linear-gradient(225deg, rgba(183,122,31,.32) 0 1px, transparent 1px) top right/12px 12px no-repeat,
    linear-gradient(45deg, rgba(183,122,31,.32) 0 1px, transparent 1px) bottom left/12px 12px no-repeat,
    linear-gradient(315deg, rgba(183,122,31,.32) 0 1px, transparent 1px) bottom right/12px 12px no-repeat !important;
  animation: none !important;
}
html body #virtues .virtue-filmstrip-tab::after {
  content: "" !important;
  position: absolute !important;
  left: 23% !important;
  right: 23% !important;
  bottom: 8px !important;
  height: 2px !important;
  border-radius: 99px !important;
  background: linear-gradient(90deg, transparent, var(--virtue-antique), transparent) !important;
  opacity: .42 !important;
  transition: left .28s var(--ease), right .28s var(--ease), opacity .28s var(--ease) !important;
}
html body #virtues .virtue-filmstrip-tab:hover,
html body #virtues .virtue-filmstrip-tab:focus-visible {
  border-color: rgba(152,87,16,.68) !important;
  background:
    radial-gradient(circle at 50% 0%, rgba(244,222,154,.34), transparent 50%),
    linear-gradient(180deg, #fffdf5, #f8e9c2) !important;
  color: #6b2a20 !important;
  box-shadow:
    0 9px 20px rgba(76,38,5,.11),
    inset 0 0 0 3px rgba(255,255,255,.68) !important;
  transform: translateY(-2px) !important;
}
html body #virtues .virtue-filmstrip-tab[aria-selected="true"],
html body #virtues .virtue-filmstrip-tab.active,
html body #virtues .virtue-filmstrip-tab[aria-current="step"] {
  border: 1px solid #8d5218 !important;
  border-top: 3px double #e7bd58 !important;
  background:
    radial-gradient(circle at 50% 8%, rgba(255,225,137,.18), transparent 45%),
    linear-gradient(180deg, #7b2230 0%, #681b27 54%, #56141d 100%) !important;
  color: #ffe6a0 !important;
  box-shadow:
    0 10px 24px rgba(87,31,26,.22),
    inset 0 0 0 2px #e7bd58,
    inset 0 0 0 5px rgba(255,241,190,.08) !important;
  transform: translateY(-3px) !important;
}
html body #virtues .virtue-filmstrip-tab[aria-selected="true"]::before,
html body #virtues .virtue-filmstrip-tab.active::before,
html body #virtues .virtue-filmstrip-tab[aria-current="step"]::before {
  content: "" !important;
  inset: 5px !important;
  border-color: rgba(244,209,111,.38) !important;
  background:
    linear-gradient(135deg, rgba(244,209,111,.85) 0 1px, transparent 1px) top left/12px 12px no-repeat,
    linear-gradient(225deg, rgba(244,209,111,.85) 0 1px, transparent 1px) top right/12px 12px no-repeat,
    linear-gradient(45deg, rgba(244,209,111,.85) 0 1px, transparent 1px) bottom left/12px 12px no-repeat,
    linear-gradient(315deg, rgba(244,209,111,.85) 0 1px, transparent 1px) bottom right/12px 12px no-repeat !important;
  animation: none !important;
}
html body #virtues .virtue-filmstrip-tab[aria-selected="true"]::after,
html body #virtues .virtue-filmstrip-tab.active::after,
html body #virtues .virtue-filmstrip-tab[aria-current="step"]::after {
  left: 15% !important;
  right: 15% !important;
  background: linear-gradient(90deg, transparent, #f2d071 25% 75%, transparent) !important;
  opacity: 1 !important;
  box-shadow: 0 0 8px rgba(242,208,113,.24) !important;
}
html body #virtues .virtue-filmstrip-icon {
  width: 34px !important;
  height: 34px !important;
  display: grid !important;
  place-items: center !important;
  color: #aa771e !important;
  border-radius: 50% !important;
  background: radial-gradient(circle, rgba(255,249,226,.95) 0 57%, rgba(215,175,82,.20) 59% 72%, transparent 73%) !important;
  filter: drop-shadow(0 2px 2px rgba(73,38,5,.08)) !important;
  transition: color .25s ease, transform .25s var(--ease) !important;
}
html body #virtues .virtue-filmstrip-icon svg {
  width: 24px !important;
  height: 24px !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 1.7 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}
html body #virtues .virtue-filmstrip-tab[aria-selected="true"] .virtue-filmstrip-icon,
html body #virtues .virtue-filmstrip-tab.active .virtue-filmstrip-icon,
html body #virtues .virtue-filmstrip-tab[aria-current="step"] .virtue-filmstrip-icon {
  color: #f3cf72 !important;
  background: radial-gradient(circle, rgba(73,20,28,.98) 0 57%, rgba(243,207,114,.22) 59% 72%, transparent 73%) !important;
  transform: translateY(-1px) scale(1.08) !important;
}
html body #virtues .virtue-filmstrip-label {
  display: block !important;
  text-align: center !important;
  color: inherit !important;
  font: 700 clamp(12.5px, 1.08vw, 14.5px)/1.2 var(--font-display) !important;
  letter-spacing: .075em !important;
  text-transform: uppercase !important;
  white-space: normal !important;
}
/* Previous/Next were removed from the markup; keep a defensive rule so an
   old cached fragment can never resurrect them visually. */
html body #virtues #virtuePrev,
html body #virtues #virtueNext,
html body #virtues .virtue-filmstrip-arrow,
html body #virtues .virtue-filmstrip-nav > .virtue-stepper-nav {
  display: none !important;
}

/* One clean stage — same typography, colors, archive count and spacing as
   Academic Triumph. The original virtue enter/leave animation classes remain. */
html body #virtues .virtue-stage {
  position: relative !important;
  padding: clamp(34px, 4vw, 46px) clamp(22px, 3vw, 34px) clamp(26px, 3.2vw, 36px) !important;
  border: 2px double rgba(151,91,18,.58) !important;
  border-radius: 16px !important;
  background:
    linear-gradient(135deg, rgba(183,122,31,.10) 0 1px, transparent 1px) 14px 14px/24px 24px no-repeat,
    linear-gradient(225deg, rgba(183,122,31,.10) 0 1px, transparent 1px) calc(100% - 14px) 14px/24px 24px no-repeat,
    radial-gradient(circle at 50% -8%, rgba(232,201,111,.17), transparent 31%),
    linear-gradient(180deg, rgba(255,254,250,.99), rgba(255,248,232,.95)) !important;
  box-shadow:
    0 16px 38px rgba(67,32,4,.09),
    inset 0 0 0 4px rgba(255,255,255,.74),
    inset 0 0 0 6px rgba(183,122,31,.095) !important;
  overflow: hidden !important;
  transform-origin: 50% 18% !important;
}
html body #virtues .virtue-stage::before {
  width: min(210px, 42%) !important;
  height: 34px !important;
  top: 5px !important;
  opacity: .50 !important;
}
html body #virtues .virtue-stage::after {
  inset: 9px !important;
  border: 1px solid rgba(183,122,31,.14) !important;
  border-radius: 11px !important;
}
html body #virtues .virtue-stage-head {
  position: relative !important;
  z-index: 1 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 18px !important;
  margin-bottom: 12px !important;
  padding: 4px 2px 0 !important;
}
html body #virtues .virtue-stage-kicker {
  margin: 0 0 4px !important;
  color: #9b691c !important;
  font: 600 13px/1.2 var(--font-body) !important;
  letter-spacing: .21em !important;
  text-transform: uppercase !important;
}
html body #virtues .virtue-stage-head h4 {
  margin: 0 !important;
  color: #741f2a !important;
  font: 700 clamp(25px, 3vw, 35px)/1.08 var(--font-display) !important;
  letter-spacing: .045em !important;
}
html body #virtues .virtue-stage-head #virtueCurrentIntro {
  max-width: 850px !important;
  margin: 8px 0 0 !important;
  color: #765b42 !important;
  font: italic 18px/1.55 var(--font-display) !important;
}
html body #virtues .virtue-stage-count {
  min-width: 76px !important;
  min-height: 36px !important;
  padding: 5px 12px !important;
  border: 1px solid rgba(144,79,17,.58) !important;
  border-radius: 999px !important;
  background:
    radial-gradient(circle at 50% 0%, rgba(255,240,185,.28), transparent 50%),
    linear-gradient(180deg, #fff7dd, #ead095) !important;
  color: #64202a !important;
  box-shadow: inset 0 0 0 2px rgba(255,255,255,.55), 0 4px 10px rgba(81,40,4,.08) !important;
  font: 700 12px/1 var(--font-body) !important;
  letter-spacing: .08em !important;
  text-transform: uppercase !important;
}
/* Academic Triumph has one rule, not a second progress bar. */
html body #virtues .virtue-stage .virtue-stepper-progress-shell {
  display: none !important;
}
html body #virtues .virtue-stage-rule {
  height: 6px !important;
  width: 100% !important;
  border-radius: 99px !important;
  margin: 18px 0 24px !important;
  background: linear-gradient(90deg, transparent 0 2%, #741f2a 12%, #b98022 31%, #f1d77e 48%, #fff6cf 50%, #f1d77e 52%, #2f716e 88%, transparent 98%) !important;
  box-shadow: 0 1px 0 rgba(255,255,255,.8) !important;
  opacity: .86 !important;
}
html body #virtues .virtue-stage-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 16px !important;
  align-items: stretch !important;
}
html body #virtues .virtue-stage .parent-card {
  position: relative !important;
  min-width: 0 !important;
  height: 100% !important;
  padding: 25px 24px 22px !important;
  border: 1px solid rgba(166,103,17,.43) !important;
  border-radius: 12px !important;
  background:
    repeating-linear-gradient(0deg, rgba(145,91,18,.018) 0 1px, transparent 1px 25px),
    radial-gradient(circle at 50% 0%, rgba(237,205,122,.08), transparent 32%),
    linear-gradient(180deg, rgba(255,254,249,.98), rgba(253,246,229,.95)) !important;
  box-shadow:
    0 7px 16px rgba(73,36,4,.055),
    inset 0 0 0 3px rgba(255,255,255,.56) !important;
  overflow: hidden !important;
}
html body #virtues .virtue-stage .parent-card::before,
html body #virtues .virtue-stage .parent-card::after {
  content: "✦" !important;
  position: absolute !important;
  top: 8px !important;
  color: rgba(176,117,27,.44) !important;
  font: 700 9px/1 Georgia, serif !important;
}
html body #virtues .virtue-stage .parent-card::before { left: 10px !important; }
html body #virtues .virtue-stage .parent-card::after { right: 10px !important; }
html body #virtues .virtue-stage .parent-card[data-parent="ragini"] { border-top: 4px double #c99a38 !important; }
html body #virtues .virtue-stage .parent-card[data-parent="vijay"] { border-top: 4px double #397f7e !important; }
html body #virtues .virtue-stage .parent-top {
  margin: 0 0 12px !important;
  align-items: center !important;
  gap: 12px !important;
}
html body #virtues .virtue-stage .parent-top h4 {
  margin: 0 0 4px !important;
  color: #741f2a !important;
  font: 700 20px/1.35 var(--font-display) !important;
  letter-spacing: .025em !important;
}
html body #virtues .virtue-stage .parent-role {
  margin: 0 !important;
  color: #765b42 !important;
  font: 17px/1.45 var(--font-display) !important;
}
html body #virtues .virtue-stage .avatar-frame {
  width: 48px !important;
  height: 48px !important;
  flex-basis: 48px !important;
  font-size: 20px !important;
}
html body #virtues .virtue-guided-stepper .virtue-panel,
html body #virtues .virtue-guided-stepper .virtue-panel p {
  color: #4f3827 !important;
  font: 17px/1.55 var(--font-body) !important;
}
html body #virtues .virtue-guided-stepper .virtue-panel {
  margin-top: 12px !important;
  padding-top: 12px !important;
  border-top: 1px solid rgba(176,117,27,.22) !important;
}
html body #virtues .virtue-guided-stepper .virtue-panel p {
  margin: 0 0 10px !important;
}
html body #virtues .virtue-guided-stepper .virtue-panel p:last-child {
  margin-bottom: 0 !important;
}
html body #virtues .virtue-filmstage-hint {
  max-width: 760px !important;
  margin: 16px auto 0 !important;
  text-align: center !important;
  color: #80694f !important;
  font: italic 14px/1.5 var(--font-display) !important;
  letter-spacing: .01em !important;
}

/* Tablet and phone parity with Academic Triumph: the filmstrip itself scrolls
   sideways locally, never the page. There are no Previous/Next rows. */
@media (max-width: 980px) {
  html body #virtues .virtue-filmstrip-shell {
    overflow-x: auto !important;
    overflow-y: hidden !important;
    overscroll-behavior-inline: contain !important;
    scrollbar-width: thin !important;
    scrollbar-color: rgba(196,136,15,.48) rgba(196,136,15,.08) !important;
    padding-top: 12px !important;
    padding-bottom: 16px !important;
    -webkit-overflow-scrolling: touch !important;
  }
  html body #virtues .virtue-stepper-dots.virtue-filmstrip {
    display: flex !important;
    width: max-content !important;
    min-width: 100% !important;
    gap: 10px !important;
    overflow: visible !important;
    scroll-snap-type: x proximity !important;
  }
  html body #virtues .virtue-filmstrip-tab {
    flex: 0 0 150px !important;
    width: 150px !important;
    min-height: 100px !important;
    scroll-snap-align: center !important;
  }
}
@media (max-width: 700px) {
  html body #sacred .sacred-heading-stack,
  html body #sacred .sacred-celestial-message {
    position: relative !important;
    inset: auto !important;
    left: auto !important;
    width: 100% !important;
    max-width: 100% !important;
    margin-left: auto !important;
    margin-right: auto !important;
    transform: none !important;
    text-align: center !important;
    text-align-last: center !important;
  }
  html body #sacred .sacred-celestial-message {
    padding-left: 2px !important;
    padding-right: 2px !important;
  }

  html body #virtues .virtue-filmstage-shell {
    width: 100% !important;
  }
  html body #virtues .virtue-audio-pair {
    margin-bottom: 16px !important;
  }
  html body #virtues .virtue-filmstage {
    padding: 19px 12px 21px !important;
    border-width: 1px !important;
    border-radius: 18px !important;
  }
  html body #virtues .virtue-filmstage::before,
  html body #virtues .virtue-filmstage::after {
    width: 22px !important;
    height: 22px !important;
    top: 12px !important;
  }
  html body #virtues .virtue-filmstage-ornament {
    height: 28px !important;
    margin-bottom: 14px !important;
  }
  html body #virtues .virtue-filmstrip-shell {
    margin-inline: -2px !important;
    padding-inline: 4px !important;
    border-top-width: 2px !important;
    border-bottom-width: 2px !important;
  }
  html body #virtues .virtue-filmstrip-tab {
    flex-basis: 132px !important;
    width: 132px !important;
    min-height: 92px !important;
    padding: 10px 8px !important;
    border-radius: 12px !important;
  }
  html body #virtues .virtue-filmstrip-icon {
    width: 30px !important;
    height: 30px !important;
  }
  html body #virtues .virtue-filmstrip-icon svg {
    width: 22px !important;
    height: 22px !important;
  }
  html body #virtues .virtue-stage {
    padding: 32px 14px 20px !important;
    border-width: 1px !important;
    border-radius: 14px !important;
  }
  html body #virtues .virtue-stage::before {
    width: 145px !important;
    height: 26px !important;
  }
  html body #virtues .virtue-stage::after {
    inset: 7px !important;
    border-radius: 9px !important;
  }
  html body #virtues .virtue-stage-head {
    gap: 10px !important;
    align-items: flex-start !important;
  }
  html body #virtues .virtue-stage-head h4 {
    font-size: clamp(24px, 8vw, 31px) !important;
  }
  html body #virtues .virtue-stage-head #virtueCurrentIntro {
    font-size: 17px !important;
    line-height: 1.5 !important;
  }
  html body #virtues .virtue-stage-count {
    min-width: 60px !important;
    min-height: 32px !important;
    padding-inline: 9px !important;
    font-size: 11px !important;
  }
  html body #virtues .virtue-stage-rule {
    margin: 15px 0 19px !important;
  }
  html body #virtues .virtue-stage-grid {
    grid-template-columns: 1fr !important;
    gap: 12px !important;
  }
  html body #virtues .virtue-stage .parent-card {
    padding: 21px 16px 17px !important;
  }
  html body #virtues .virtue-stage .parent-top h4 {
    font-size: 18px !important;
  }
  html body #virtues .virtue-stage .parent-role,
  html body #virtues .virtue-guided-stepper .virtue-panel,
  html body #virtues .virtue-guided-stepper .virtue-panel p {
    font-size: 16px !important;
  }
  html body #virtues .virtue-filmstage-hint {
    font-size: 13px !important;
    padding-inline: 4px !important;
  }
}
@media (max-width: 430px) {
  html body #virtues .virtue-filmstrip-tab {
    flex-basis: 122px !important;
    width: 122px !important;
    min-height: 88px !important;
  }
  html body #virtues .virtue-filmstrip-label {
    font-size: 12px !important;
    letter-spacing: .06em !important;
  }
  html body #virtues .virtue-stage-count {
    min-width: 62px !important;
    min-height: 32px !important;
  }
  html body #virtues .virtue-stage .avatar-frame {
    width: 44px !important;
    height: 44px !important;
    flex-basis: 44px !important;
    font-size: 18px !important;
  }
}

/* Sacred mobile-flow rules begin at 760px in the core stylesheet, so repeat
   the centered-axis reset across that full range (not only <=700px). */
@media (max-width: 760px) {
  html body #sacred .sacred-heading-stack,
  html body #sacred .sacred-celestial-message {
    position: relative !important;
    inset: auto !important;
    top: auto !important;
    right: auto !important;
    bottom: auto !important;
    left: auto !important;
    width: 100% !important;
    max-width: 100% !important;
    margin-left: auto !important;
    margin-right: auto !important;
    transform: none !important;
    text-align: center !important;
    text-align-last: center !important;
  }
}

/* Typography parity detail: the identity subtitle occupies the same typographic
   tier as Academic Triumph's introductory card line. */
html body #virtues .virtue-stage .parent-role {
  color: #4f3827 !important;
  font: 18px/1.62 var(--font-display) !important;
}
@media (max-width: 700px) {
  html body #virtues .virtue-stage .parent-role {
    font-size: 17px !important;
  }
  html body #virtues .virtue-guided-stepper .virtue-panel,
  html body #virtues .virtue-guided-stepper .virtue-panel p {
    font-size: 16px !important;
  }
}

/* ======================================================================
   v48 — SHARED OUTER HERITAGE FRAME + SACRED WISDOM RELOCATION
   The Virtues & Wisdom outer frame is the single visual source of truth.
   Academic Triumph, Main Home Page and Their Life Story now use the same
   radius, double border, parchment surface, corner medallions and shadow.
   ====================================================================== */

/* 1) One outer-tile treatment shared by all requested sections. */
html body #virtues .virtue-filmstage,
html body #academic .academic-filmstage,
html body .heritage-outer-parity {
  --parity-wine: #741f2a;
  --parity-wine-deep: #55151d;
  --parity-antique: #b77a1f;
  --parity-gold-soft: #e8c96f;
  --parity-teal: #2f716e;
  position: relative !important;
  box-sizing: border-box !important;
  width: min(100%, 1160px) !important;
  max-width: 1160px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding: clamp(24px, 3.2vw, 38px) !important;
  border: 2px double rgba(151,91,18,.56) !important;
  border-radius: 22px !important;
  background:
    linear-gradient(135deg, rgba(183,122,31,.11) 0 1px, transparent 1px) 15px 15px/28px 28px no-repeat,
    linear-gradient(225deg, rgba(183,122,31,.11) 0 1px, transparent 1px) calc(100% - 15px) 15px/28px 28px no-repeat,
    linear-gradient(45deg, rgba(183,122,31,.11) 0 1px, transparent 1px) 15px calc(100% - 15px)/28px 28px no-repeat,
    linear-gradient(315deg, rgba(183,122,31,.11) 0 1px, transparent 1px) calc(100% - 15px) calc(100% - 15px)/28px 28px no-repeat,
    radial-gradient(circle at 50% -8%, rgba(232,201,111,.22), transparent 31%),
    radial-gradient(circle at 8% 48%, rgba(116,31,42,.04), transparent 26%),
    radial-gradient(circle at 92% 48%, rgba(47,113,110,.04), transparent 26%),
    linear-gradient(180deg, rgba(255,253,247,.99), rgba(249,238,211,.95)) !important;
  box-shadow:
    0 20px 52px rgba(73,39,8,.11),
    inset 0 0 0 4px rgba(255,255,255,.70),
    inset 0 0 0 6px rgba(183,122,31,.10),
    inset 0 0 42px rgba(183,122,31,.035) !important;
}

/* Match the same two circular diamond medallions used by Virtues. */
html body #academic .academic-filmstage::before,
html body #academic .academic-filmstage::after,
html body .heritage-outer-parity::before,
html body .heritage-outer-parity::after {
  content: "◆" !important;
  position: absolute !important;
  top: 16px !important;
  width: 28px !important;
  height: 28px !important;
  display: grid !important;
  place-items: center !important;
  border-radius: 50% !important;
  color: var(--parity-wine) !important;
  background: radial-gradient(circle, #fff8df 0 48%, #e8c96f 50% 65%, #9a5c16 67% 72%, transparent 73%) !important;
  font: 700 9px/1 Georgia, serif !important;
  opacity: .78 !important;
  filter: drop-shadow(0 3px 4px rgba(83,43,7,.14)) !important;
  pointer-events: none !important;
  z-index: 3 !important;
}
html body #academic .academic-filmstage::before,
html body .heritage-outer-parity::before { left: 16px !important; }
html body #academic .academic-filmstage::after,
html body .heritage-outer-parity::after { right: 16px !important; }

/* Main Home and Their Life Story receive the same ornamental top/bottom
   flourish as the Virtues frame without changing their existing internals. */
html body .heritage-outer-ornament {
  width: min(100%, 860px) !important;
  height: clamp(30px, 3.2vw, 42px) !important;
  margin: 0 auto 18px !important;
  background: url('assets/ornament-divider-5.png') center / contain no-repeat !important;
  opacity: .72 !important;
  pointer-events: none !important;
}
html body .heritage-outer-ornament--bottom {
  margin: 20px auto 0 !important;
  transform: rotate(180deg) !important;
  opacity: .52 !important;
}

/* Academic's existing ornaments now use the exact same measurements. */
html body #academic .academic-filmstage-ornament {
  width: min(100%, 860px) !important;
  height: clamp(30px, 3.2vw, 42px) !important;
  margin: 0 auto 18px !important;
  background: url('assets/ornament-divider-5.png') center / contain no-repeat !important;
  opacity: .72 !important;
}
html body #academic .academic-filmstage-ornament--bottom {
  margin: 20px auto 0 !important;
  transform: rotate(180deg) !important;
  opacity: .52 !important;
}

/* Keep the original Main Home two-column UX and Their Life Story timeline
   interaction untouched inside the new shared frame. */
html body #legacy .heritage-outer-parity--home .hero-layout {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
}
html body #timeline .heritage-outer-parity--story .timeline {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
}
/* Story photographs intentionally may project beyond an opened story card;
   do not clip that interaction merely because the outer appearance matches. */
html body #timeline .heritage-outer-parity--story {
  overflow: visible !important;
}

/* 2) SACRED DEDICATION — put heading, dedication, moved Wisdom tile and
   actions into reliable centered document flow. This removes the brittle
   absolute offsets and keeps the full arrangement accurate on phones too. */
html body #sacred.sacred-screen {
  align-content: center !important;
  place-items: center !important;
  min-height: 100vh !important;
  padding-top: clamp(66px, 7vw, 92px) !important;
  padding-bottom: clamp(58px, 7vw, 88px) !important;
}
html body #sacred .sacred-content {
  position: relative !important;
  width: min(100%, 1280px) !important;
  max-width: 1280px !important;
  margin: 0 auto !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: clamp(14px, 1.8vw, 22px) !important;
  text-align: center !important;
}
html body #sacred .sacred-heading-stack,
html body #sacred .sacred-celestial-message,
html body #sacred .sacred-close {
  position: relative !important;
  inset: auto !important;
  top: auto !important;
  left: auto !important;
  right: auto !important;
  bottom: auto !important;
  transform: none !important;
  margin-left: auto !important;
  margin-right: auto !important;
}
html body #sacred .sacred-heading-stack {
  width: min(96vw, 1180px) !important;
  max-width: 1180px !important;
  margin-top: 0 !important;
}
html body #sacred .sacred-celestial-message {
  width: min(96vw, 1180px) !important;
  max-width: 1180px !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  padding-inline: clamp(8px, 1.4vw, 18px) !important;
  text-align: center !important;
  text-align-last: center !important;
  text-wrap: balance !important;
}
html body #sacred .sacred-close {
  width: auto !important;
  max-width: min(100%, 900px) !important;
  margin-top: 0 !important;
}

/* The relocated live Wisdom tile keeps the same quote/rotation IDs, but is
   centered structurally against the Sacred section rather than Guest Tribute. */
html body #sacred .sacred-wisdom-spotlight {
  position: relative !important;
  width: min(96vw, 1100px) !important;
  max-width: 1100px !important;
  margin: clamp(2px, .6vw, 8px) auto 0 !important;
  padding: clamp(16px, 2vw, 22px) clamp(16px, 2.4vw, 26px) !important;
  display: grid !important;
  grid-template-columns: auto minmax(0,1fr) auto !important;
  align-items: center !important;
  gap: clamp(14px, 1.8vw, 20px) !important;
  border-radius: 26px !important;
  border: 1px solid rgba(212,160,58,.38) !important;
  background: linear-gradient(110deg,rgba(255,254,248,.98),rgba(249,239,215,.96)) !important;
  box-shadow: 0 18px 42px rgba(67,40,6,.09) !important;
  overflow: hidden !important;
  text-align: left !important;
}
html body #sacred .sacred-wisdom-spotlight .wisdom-spotlight-heading {
  grid-column: 1 / -1 !important;
  width: 100% !important;
  margin: 0 auto 2px !important;
  text-align: center !important;
}
html body #sacred .sacred-wisdom-spotlight .mini-eyebrow,
html body #sacred .sacred-wisdom-spotlight #wisdomSpotlightHeading {
  position: static !important;
  inset: auto !important;
  width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
  text-align: center !important;
  text-align-last: center !important;
}
html body #sacred .sacred-wisdom-spotlight .mini-eyebrow {
  margin-top: 0 !important;
  margin-bottom: 8px !important;
}
html body #sacred .sacred-wisdom-spotlight #wisdomSpotlightHeading {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}
html body #sacred .sacred-wisdom-spotlight .wisdom-spotlight-copy {
  min-width: 0 !important;
  text-align: left !important;
}

/* 3) Responsive parity. Same frame proportions at tablet/phone widths. */
@media (max-width: 700px) {
  html body #virtues .virtue-filmstage,
  html body #academic .academic-filmstage,
  html body .heritage-outer-parity {
    width: 100% !important;
    padding: 19px 12px 21px !important;
    border-width: 1px !important;
    border-radius: 18px !important;
  }
  html body #academic .academic-filmstage::before,
  html body #academic .academic-filmstage::after,
  html body .heritage-outer-parity::before,
  html body .heritage-outer-parity::after {
    width: 22px !important;
    height: 22px !important;
    top: 12px !important;
  }
  html body #academic .academic-filmstage::before,
  html body .heritage-outer-parity::before { left: 12px !important; }
  html body #academic .academic-filmstage::after,
  html body .heritage-outer-parity::after { right: 12px !important; }
  html body .heritage-outer-ornament,
  html body #academic .academic-filmstage-ornament {
    height: 28px !important;
    margin-bottom: 14px !important;
  }
  html body .heritage-outer-ornament--bottom,
  html body #academic .academic-filmstage-ornament--bottom {
    margin-top: 16px !important;
    margin-bottom: 0 !important;
  }
  html body #legacy .heritage-outer-parity--home .hero-layout {
    gap: 22px !important;
  }
  html body #timeline .heritage-outer-parity--story .timeline {
    padding-left: 38px !important;
  }
  html body #sacred.sacred-screen {
    padding-top: 58px !important;
    padding-bottom: 54px !important;
  }
  html body #sacred .sacred-content {
    gap: 13px !important;
  }
  html body #sacred .sacred-wisdom-spotlight {
    width: calc(100vw - 28px) !important;
    grid-template-columns: minmax(0,1fr) !important;
    justify-items: center !important;
    gap: 12px !important;
    padding: 16px 14px !important;
    text-align: center !important;
  }
  html body #sacred .sacred-wisdom-spotlight .wisdom-spotlight-heading,
  html body #sacred .sacred-wisdom-spotlight .wisdom-spotlight-icon,
  html body #sacred .sacred-wisdom-spotlight .wisdom-spotlight-copy,
  html body #sacred .sacred-wisdom-spotlight .wisdom-cycle-btn {
    grid-column: 1 !important;
  }
  html body #sacred .sacred-wisdom-spotlight .wisdom-spotlight-copy,
  html body #sacred .sacred-wisdom-spotlight blockquote,
  html body #sacred .sacred-wisdom-spotlight .experience-author {
    width: 100% !important;
    text-align: center !important;
  }
  html body #sacred .sacred-wisdom-spotlight .wisdom-cycle-btn {
    width: min(100%, 260px) !important;
    min-width: 0 !important;
  }
}

@media (max-width: 420px) {
  html body #legacy .heritage-outer-parity--home,
  html body #timeline .heritage-outer-parity--story,
  html body #academic .academic-filmstage,
  html body #virtues .virtue-filmstage {
    padding-left: 10px !important;
    padding-right: 10px !important;
  }
  html body #timeline .heritage-outer-parity--story .timeline {
    padding-left: 34px !important;
  }
  html body #sacred .sacred-wisdom-spotlight {
    width: calc(100vw - 20px) !important;
    border-radius: 20px !important;
    padding: 14px 11px !important;
  }
  html body #sacred .sacred-wisdom-spotlight .wisdom-spotlight-icon {
    width: 54px !important;
    height: 54px !important;
  }
}

/* ======================================================================
   v49 — SACRED AUDIO RELOCATION + HELP OUTER PARITY + THANK-YOU GOLD
   Loaded last. This pass only repositions existing live components and
   applies the already-established Virtues outer-frame language.
   ====================================================================== */

/* Sacred Dedication: the dedication sentence and the new Wisdom/audio frame
   share one exact 1160px visual width. The paragraph itself remains plain
   text on the page; the heritage tile begins only below it. */
html body #sacred .sacred-content {
  box-sizing: border-box !important;
  padding-left: clamp(14px, 2vw, 24px) !important;
  padding-right: clamp(14px, 2vw, 24px) !important;
}
html body #sacred .sacred-celestial-message,
html body #sacred .sacred-wisdom-audio-frame {
  width: min(100%, 1160px) !important;
  max-width: 1160px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  box-sizing: border-box !important;
}
html body #sacred .sacred-celestial-message {
  left: auto !important;
  transform: none !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  text-align: center !important;
  text-align-last: center !important;
}

/* The moved Sacred block uses the same outer tile as Virtues & Wisdom. */
html body #sacred .sacred-wisdom-audio-frame {
  display: block !important;
  padding: clamp(24px, 3.2vw, 38px) !important;
  overflow: hidden !important;
}

/* The complete two-person recorded-message setup has been moved intact from
   Virtues & Wisdom. Its data-voice buttons are unchanged, so the existing
   single shared audio dialog keeps working without duplicate players. */
html body #sacred .sacred-audio-pair {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 auto clamp(18px, 2.2vw, 26px) !important;
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: clamp(12px, 1.7vw, 18px) !important;
}
html body #sacred .virtue-audio-card {
  position: relative !important;
  min-width: 0 !important;
  padding: 14px 15px 13px !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: center !important;
  gap: 12px !important;
  border: 1px solid rgba(174,114,23,.44) !important;
  border-radius: 16px !important;
  background:
    radial-gradient(circle at 50% 0%, rgba(237,205,122,.10), transparent 45%),
    linear-gradient(180deg, rgba(255,254,249,.96), rgba(252,245,227,.92)) !important;
  box-shadow:
    0 7px 18px rgba(73,36,4,.06),
    inset 0 0 0 3px rgba(255,255,255,.55) !important;
  overflow: hidden !important;
  text-align: left !important;
}
html body #sacred .virtue-audio-card::before {
  content: "" !important;
  position: absolute !important;
  left: 12px !important;
  right: 12px !important;
  top: 5px !important;
  height: 1px !important;
  background: linear-gradient(90deg, transparent, rgba(185,128,34,.62), transparent) !important;
  pointer-events: none !important;
}
html body #sacred .virtue-audio-card--ragini {
  border-top: 3px double #c99a38 !important;
}
html body #sacred .virtue-audio-card--vijay {
  border-top: 3px double #397f7e !important;
}
html body #sacred .virtue-audio-identity {
  min-width: 0 !important;
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
}
html body #sacred .virtue-audio-avatar {
  width: 42px !important;
  height: 42px !important;
  flex: 0 0 42px !important;
  display: grid !important;
  place-items: center !important;
  border-radius: 50% !important;
  border: 1px solid rgba(157,98,19,.58) !important;
  background: radial-gradient(circle at 38% 28%, #fff1b4, #d9aa45 62%, #a56e1b 100%) !important;
  color: #661d27 !important;
  box-shadow: inset 0 0 0 3px rgba(255,247,211,.48), 0 4px 10px rgba(70,35,3,.10) !important;
  font: 700 19px/1 var(--font-display, Georgia, serif) !important;
}
html body #sacred .virtue-audio-kicker {
  margin: 0 0 2px !important;
  color: #9b691c !important;
  font: 600 10px/1.2 var(--font-body, sans-serif) !important;
  letter-spacing: .16em !important;
  text-transform: uppercase !important;
}
html body #sacred .virtue-audio-identity h4 {
  margin: 0 !important;
  color: #741f2a !important;
  font-size: clamp(15px, 1.3vw, 18px) !important;
  line-height: 1.2 !important;
}
html body #sacred .virtue-audio-identity p:last-child {
  margin: 3px 0 0 !important;
  color: #745d42 !important;
  font-size: clamp(11px, .96vw, 13px) !important;
  line-height: 1.3 !important;
}
html body #sacred .virtue-audio-card .voice-open {
  width: auto !important;
  min-width: 142px !important;
  min-height: 42px !important;
  margin: 0 !important;
  padding: 8px 12px !important;
  white-space: nowrap !important;
  font-size: 12.5px !important;
}
html body #sacred .virtue-audio-card .voice-ico {
  width: 23px !important;
  height: 23px !important;
  flex: 0 0 23px !important;
}

/* Within the shared outer frame, the Wisdom tile becomes the full available
   inner width instead of keeping the older standalone 1100px constraint. */
html body #sacred .sacred-wisdom-audio-frame .sacred-wisdom-spotlight {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 auto !important;
}
html body #sacred .sacred-wisdom-audio-frame .heritage-outer-ornament--top {
  margin-bottom: clamp(16px, 2vw, 22px) !important;
}
html body #sacred .sacred-wisdom-audio-frame .heritage-outer-ornament--bottom {
  margin-top: clamp(18px, 2.2vw, 24px) !important;
}

/* Help, Support & About: exactly the same outer heritage tile language as
   Virtues, while leaving all accordion behaviour and buttons untouched. */
html body #help .heritage-outer-parity--help {
  width: min(100%, 1160px) !important;
  max-width: 1160px !important;
  overflow: visible !important;
}
html body #help .heritage-outer-parity--help .help-quick-strip,
html body #help .heritage-outer-parity--help .help-grid,
html body #help .heritage-outer-parity--help > .button-row {
  width: 100% !important;
  max-width: 100% !important;
}
html body #help .heritage-outer-parity--help .help-quick-strip {
  margin-top: 0 !important;
}
html body #help .heritage-outer-parity--help > .button-row {
  margin-bottom: 0 !important;
}

/* Thank You: gold typography only. Animations, shimmer, halo, fireflies,
   border drift, divider motion and button effects are intentionally unchanged. */
html body #thanks .thanks-title,
html body #thanks .thanks-message,
html body #thanks .thanks-message--first,
html body #thanks .thanks-message--second {
  color: #c39128 !important;
  -webkit-text-fill-color: #c39128 !important;
}
html body #thanks .thanks-title {
  text-shadow:
    0 1px 0 rgba(255,255,255,.92),
    0 5px 18px rgba(137,91,13,.18),
    0 0 20px rgba(218,171,54,.22) !important;
}
/* The Exit-generated farewell also says THANK YOU; keep its live effects and
   use the same gold text so both thank-you experiences are visually coherent. */
html body .farewell .farewell-welcome,
html body .farewell .farewell-line,
html body .farewell .farewell-names,
html body .farewell .farewell-title,
html body .farewell .farewell-blessing {
  color: #c39128 !important;
  -webkit-text-fill-color: #c39128 !important;
}

@media (max-width: 700px) {
  html body #sacred .sacred-content {
    padding-left: 14px !important;
    padding-right: 14px !important;
  }
  html body #sacred .sacred-celestial-message,
  html body #sacred .sacred-wisdom-audio-frame {
    width: 100% !important;
    max-width: 100% !important;
  }
  html body #sacred .sacred-wisdom-audio-frame {
    padding: 19px 12px 21px !important;
    border-width: 1px !important;
    border-radius: 18px !important;
  }
  html body #sacred .sacred-audio-pair {
    grid-template-columns: 1fr !important;
    gap: 9px !important;
    margin-bottom: 16px !important;
  }
  html body #sacred .virtue-audio-card {
    grid-template-columns: minmax(0, 1fr) auto !important;
    padding: 12px 11px !important;
    gap: 8px !important;
  }
  html body #sacred .virtue-audio-avatar {
    width: 38px !important;
    height: 38px !important;
    flex-basis: 38px !important;
    font-size: 17px !important;
  }
  html body #sacred .virtue-audio-card .voice-open {
    min-width: 118px !important;
    min-height: 40px !important;
    padding-inline: 9px !important;
    font-size: 11.5px !important;
  }
  html body #sacred .sacred-wisdom-audio-frame .sacred-wisdom-spotlight {
    width: 100% !important;
    max-width: 100% !important;
  }
  html body #help .heritage-outer-parity--help {
    width: 100% !important;
    padding: 19px 12px 21px !important;
  }
}

@media (max-width: 430px) {
  html body #sacred .sacred-content {
    padding-left: 10px !important;
    padding-right: 10px !important;
  }
  html body #sacred .sacred-wisdom-audio-frame,
  html body #help .heritage-outer-parity--help {
    padding-left: 10px !important;
    padding-right: 10px !important;
  }
  html body #sacred .virtue-audio-card {
    grid-template-columns: 1fr !important;
  }
  html body #sacred .virtue-audio-card .voice-open {
    width: 100% !important;
    min-width: 0 !important;
  }
}

/* ======================================================================
   v50 — MOBILE GUEST-BOOK READABILITY + SACRED ORDER + THANK-YOU PARITY
   Loaded last. This pass keeps all existing behavior and animations, but
   removes the mobile card-height squeeze, places Wisdom before the audio
   pair in Sacred Dedication, and gives both Thank You paragraphs one type
   treatment.
   ====================================================================== */

/* ----------------------------------------------------------------------
   Guest Book — on phones, comments must remain readable even when an
   approved attachment is present. The previous fixed-height card turned
   the actual message into a very small inner scrolling strip. Let the card
   grow naturally and keep the attachment row beneath the text.
   ---------------------------------------------------------------------- */
@media (max-width: 700px) {
  html body #guestbook .approved-grid > article:not(.tribute-placeholder-card),
  html body #guestbook .approved-grid.is-list > article:not(.tribute-placeholder-card) {
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow: hidden !important;
    padding: clamp(17px, 4.8vw, 22px) clamp(16px, 4.6vw, 20px) !important;
  }

  html body #guestbook .approved-grid > article:not(.tribute-placeholder-card) > p:last-of-type,
  html body #guestbook .approved-grid.is-list > article:not(.tribute-placeholder-card) > p:last-of-type {
    flex: 0 0 auto !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow: visible !important;
    overscroll-behavior: auto !important;
    padding-right: 0 !important;
    margin-bottom: 10px !important;
    scrollbar-width: none !important;
  }

  html body #guestbook .approved-grid > article:not(.tribute-placeholder-card) > p:last-of-type::-webkit-scrollbar,
  html body #guestbook .approved-grid.is-list > article:not(.tribute-placeholder-card) > p:last-of-type::-webkit-scrollbar {
    display: none !important;
  }

  html body #guestbook .approved-grid > article > .att-row {
    width: 100% !important;
    margin-top: 10px !important;
    padding-top: 11px !important;
    align-items: center !important;
    gap: 9px !important;
  }

  html body #guestbook .approved-grid > article > small {
    margin-top: 12px !important;
  }

  html body #guestbook .approved-grid > article > h4 {
    font-size: clamp(20px, 5.6vw, 26px) !important;
    line-height: 1.18 !important;
    overflow-wrap: anywhere !important;
  }

  html body #guestbook .approved-grid > article > p,
  html body #guestbook .approved-grid > article > .tribute-entry-title,
  html body #guestbook .approved-grid > article > .tribute-entry-meta {
    font-size: clamp(15px, 4.1vw, 18px) !important;
    line-height: 1.52 !important;
    overflow-wrap: anywhere !important;
  }

  html body #guestbook .att-chip {
    min-height: 44px !important;
    padding: 9px 14px !important;
    font-size: 15px !important;
  }

  html body #guestbook .att-thumb {
    width: 72px !important;
    height: 72px !important;
  }
}

@media (max-width: 390px) {
  html body #guestbook .approved-grid > article:not(.tribute-placeholder-card),
  html body #guestbook .approved-grid.is-list > article:not(.tribute-placeholder-card) {
    padding-left: 14px !important;
    padding-right: 14px !important;
  }
  html body #guestbook .approved-grid > article > h4 {
    font-size: clamp(19px, 5.5vw, 23px) !important;
  }
  html body #guestbook .approved-grid > article > p,
  html body #guestbook .approved-grid > article > .tribute-entry-title,
  html body #guestbook .approved-grid > article > .tribute-entry-meta {
    font-size: 15px !important;
    line-height: 1.5 !important;
  }
}

/* ----------------------------------------------------------------------
   Thank You — both paragraphs now deliberately use the exact same font
   family, size, weight, style, spacing and line-height. Existing entrance,
   shimmer, halo, spark, border and divider animations remain unchanged.
   ---------------------------------------------------------------------- */
html body #thanks .thanks-message--first,
html body #thanks .thanks-message--second {
  font-family: var(--font-serif) !important;
  font-size: clamp(18px, 1.45vw, 23px) !important;
  font-weight: 600 !important;
  font-style: normal !important;
  line-height: 1.72 !important;
  letter-spacing: .008em !important;
}

@media (min-width: 701px) and (max-width: 1024px) {
  html body #thanks .thanks-message--first,
  html body #thanks .thanks-message--second {
    font-size: clamp(18px, 2.2vw, 21px) !important;
    line-height: 1.66 !important;
  }
}

@media (max-width: 700px) {
  html body #thanks .thanks-message--first,
  html body #thanks .thanks-message--second {
    font-size: clamp(16px, 4.45vw, 18.5px) !important;
    line-height: 1.58 !important;
    letter-spacing: 0 !important;
  }
}

@media (max-width: 380px) {
  html body #thanks .thanks-message--first,
  html body #thanks .thanks-message--second {
    font-size: 16px !important;
    line-height: 1.54 !important;
  }
}

/* ----------------------------------------------------------------------
   Sacred Dedication — Wisdom is now the first content inside the heritage
   outer frame. Remove the old inner white tile completely and center its
   heading, quote, attribution and action on the outer parchment itself.
   ---------------------------------------------------------------------- */
html body #sacred .sacred-wisdom-audio-frame {
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
}

html body #sacred .sacred-wisdom-audio-frame .sacred-wisdom-spotlight {
  order: 1 !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 auto !important;
  padding: clamp(8px, 1.4vw, 14px) clamp(6px, 1.2vw, 12px) clamp(14px, 1.8vw, 20px) !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: clamp(10px, 1.3vw, 14px) !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  overflow: visible !important;
  text-align: center !important;
}

html body #sacred .sacred-wisdom-spotlight::before,
html body #sacred .sacred-wisdom-spotlight::after {
  display: none !important;
  content: none !important;
}

html body #sacred .sacred-wisdom-spotlight .wisdom-spotlight-heading,
html body #sacred .sacred-wisdom-spotlight .wisdom-spotlight-copy {
  width: min(100%, 900px) !important;
  max-width: 900px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  text-align: center !important;
  text-align-last: center !important;
}

html body #sacred .sacred-wisdom-spotlight .wisdom-spotlight-heading {
  margin-bottom: 0 !important;
}

html body #sacred .sacred-wisdom-spotlight .wisdom-spotlight-icon {
  margin: 0 auto !important;
}

html body #sacred .sacred-wisdom-spotlight blockquote,
html body #sacred .sacred-wisdom-spotlight .experience-author {
  width: 100% !important;
  max-width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
  text-align: center !important;
  text-align-last: center !important;
}

html body #sacred .sacred-wisdom-spotlight blockquote {
  margin-top: 0 !important;
  margin-bottom: 6px !important;
}

html body #sacred .sacred-wisdom-spotlight .experience-author {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

html body #sacred .sacred-wisdom-spotlight .wisdom-cycle-btn {
  width: auto !important;
  min-width: 210px !important;
  margin: 2px auto 0 !important;
}

/* A restrained heritage divider separates Wisdom above from the two audio
   messages below; it does not create another panel. */
html body #sacred .sacred-audio-separator {
  order: 2 !important;
  width: min(88%, 760px) !important;
  height: 28px !important;
  margin: clamp(12px, 1.8vw, 20px) auto clamp(16px, 2vw, 22px) !important;
  background: url('assets/ornament-divider-5.png') center / contain no-repeat !important;
  opacity: .72 !important;
  pointer-events: none !important;
}

html body #sacred .sacred-audio-pair {
  order: 3 !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

html body #sacred .sacred-wisdom-audio-frame .heritage-outer-ornament--top {
  order: 0 !important;
}

html body #sacred .sacred-wisdom-audio-frame .heritage-outer-ornament--bottom {
  order: 4 !important;
}

/* Requested label: exact word “Message”, bold + italic. */
html body #sacred .virtue-audio-kicker {
  font-weight: 800 !important;
  font-style: italic !important;
  text-transform: none !important;
  letter-spacing: .08em !important;
}

@media (max-width: 700px) {
  html body #sacred .sacred-wisdom-audio-frame {
    padding-top: 16px !important;
  }

  html body #sacred .sacred-wisdom-audio-frame .sacred-wisdom-spotlight {
    width: 100% !important;
    padding: 4px 4px 10px !important;
    gap: 9px !important;
  }

  html body #sacred .sacred-wisdom-spotlight .wisdom-spotlight-heading,
  html body #sacred .sacred-wisdom-spotlight .wisdom-spotlight-copy {
    width: 100% !important;
    max-width: 100% !important;
  }

  html body #sacred .sacred-wisdom-spotlight blockquote {
    font-size: clamp(16px, 4.7vw, 20px) !important;
    line-height: 1.52 !important;
  }

  html body #sacred .sacred-wisdom-spotlight .experience-author {
    font-size: clamp(15px, 4.2vw, 18px) !important;
  }

  html body #sacred .sacred-wisdom-spotlight .wisdom-cycle-btn {
    width: min(100%, 260px) !important;
    min-width: 0 !important;
  }

  html body #sacred .sacred-audio-separator {
    width: min(92%, 420px) !important;
    height: 24px !important;
    margin-top: 10px !important;
    margin-bottom: 13px !important;
  }

  html body #sacred .sacred-audio-pair {
    grid-template-columns: 1fr !important;
    gap: 10px !important;
  }
}

@media (max-width: 520px) {
  html body #sacred .virtue-audio-card {
    grid-template-columns: 1fr !important;
    align-items: stretch !important;
    gap: 11px !important;
  }

  html body #sacred .virtue-audio-card .voice-open {
    width: 100% !important;
    min-width: 0 !important;
  }

  html body #sacred .virtue-audio-identity {
    align-items: center !important;
  }
}

/* ======================================================================
   v54 — COMPACT SACRED TILE + PURE-GOLD SELECTED LABELS
         + GANAPATI REAPPLIED FROM THE UPLOADED CLIP
   This block replaces the obsolete v53 static Ganapati implementation.
   ====================================================================== */

/* Sacred Dedication button parity retained. */
html body #sacred .sacred-wisdom-spotlight .wisdom-cycle-btn,
html body #sacred .sacred-audio-pair .voice-open {
  box-sizing: border-box !important;
  width: 228px !important;
  min-width: 228px !important;
  max-width: 228px !important;
  min-height: 46px !important;
  height: 46px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  font-size: 12.5px !important;
  line-height: 1.2 !important;
  white-space: nowrap !important;
  justify-content: center !important;
  justify-self: center !important;
}

/* Sacred Dedication: preserve the established width, but remove excess
   vertical whitespace so the heritage frame hugs the content. */
html body #sacred .sacred-wisdom-audio-frame {
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  padding: clamp(12px, 1.45vw, 18px) clamp(14px, 1.8vw, 22px) !important;
  gap: 0 !important;
}
html body #sacred .sacred-wisdom-audio-frame .heritage-outer-ornament--top,
html body #sacred .sacred-wisdom-audio-frame .heritage-outer-ornament--bottom {
  height: clamp(24px, 2.6vw, 34px) !important;
  min-height: 0 !important;
  margin-left: auto !important;
  margin-right: auto !important;
}
html body #sacred .sacred-wisdom-audio-frame .heritage-outer-ornament--top {
  margin-top: 0 !important;
  margin-bottom: clamp(4px, .7vw, 8px) !important;
}
html body #sacred .sacred-wisdom-audio-frame .heritage-outer-ornament--bottom {
  margin-top: clamp(6px, .8vw, 10px) !important;
  margin-bottom: 0 !important;
}
html body #sacred .sacred-wisdom-audio-frame .sacred-wisdom-spotlight {
  min-height: 0 !important;
  height: auto !important;
  padding: 2px 6px 6px !important;
  gap: clamp(5px, .65vw, 8px) !important;
}
html body #sacred .sacred-wisdom-spotlight .wisdom-spotlight-heading {
  margin: 0 auto !important;
}
html body #sacred .sacred-wisdom-spotlight .mini-eyebrow {
  margin: 0 0 4px !important;
}
html body #sacred .sacred-wisdom-spotlight #wisdomSpotlightHeading {
  margin: 0 !important;
}
html body #sacred .sacred-wisdom-spotlight .wisdom-spotlight-icon {
  width: clamp(46px, 4.6vw, 58px) !important;
  height: clamp(46px, 4.6vw, 58px) !important;
  min-width: 0 !important;
  min-height: 0 !important;
  margin: 2px auto !important;
}
html body #sacred .sacred-wisdom-spotlight .wisdom-spotlight-copy {
  margin: 0 auto !important;
}
html body #sacred .sacred-wisdom-spotlight blockquote {
  margin: 0 auto 3px !important;
}
html body #sacred .sacred-wisdom-spotlight .experience-author {
  margin: 0 auto !important;
}
html body #sacred .sacred-wisdom-spotlight .wisdom-cycle-btn {
  margin-top: 4px !important;
}
html body #sacred .sacred-audio-separator {
  width: min(72%, 620px) !important;
  height: 19px !important;
  margin: 6px auto 8px !important;
}
html body #sacred .sacred-audio-pair {
  gap: clamp(9px, 1.15vw, 13px) !important;
  margin: 0 auto !important;
}
html body #sacred .virtue-audio-card {
  min-height: 0 !important;
  padding: 10px 12px 9px !important;
}
html body #sacred .virtue-audio-avatar {
  width: 38px !important;
  height: 38px !important;
  flex-basis: 38px !important;
  font-size: 17px !important;
}
html body #sacred .virtue-audio-identity h4 {
  font-size: clamp(14px, 1.18vw, 17px) !important;
}
html body #sacred .virtue-audio-identity p:last-child {
  margin-top: 2px !important;
  font-size: clamp(10.5px, .88vw, 12.5px) !important;
}

/* Selected filmstrip text: pure Gold on both burgundy selected states. */
html body #virtues .virtue-filmstrip-tab[aria-selected="true"] .virtue-filmstrip-label,
html body #virtues .virtue-filmstrip-tab.active .virtue-filmstrip-label,
html body #virtues .virtue-filmstrip-tab[aria-current="step"] .virtue-filmstrip-label,
html body #academic .academic-filmstrip-tab.active .academic-filmstrip-label,
html body #academic .academic-filmstrip-tab[aria-selected="true"] .academic-filmstrip-label {
  color: #FFD700 !important;
  -webkit-text-fill-color: #FFD700 !important;
  font-weight: 800 !important;
  opacity: 1 !important;
  text-shadow:
    0 1px 0 rgba(75,31,6,.96),
    0 0 4px rgba(255,215,0,.78),
    0 0 10px rgba(255,215,0,.34) !important;
  filter: none !important;
}
html body #virtues .virtue-filmstrip-tab[aria-selected="true"],
html body #virtues .virtue-filmstrip-tab.active,
html body #virtues .virtue-filmstrip-tab[aria-current="step"],
html body #academic .academic-filmstrip-tab.active,
html body #academic .academic-filmstrip-tab[aria-selected="true"] {
  color: #FFD700 !important;
  -webkit-text-fill-color: #FFD700 !important;
}

/* Ganapati: transparent looping animation from the uploaded G3.mov source.
   Welcome and final farewell deliberately use the same centered dimensions. */
html body #threshold .ceremonial-ganapati,
html body .farewell .ceremonial-ganapati {
  position: relative !important;
  z-index: 4 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  height: clamp(100px, 13vh, 132px) !important;
  margin: 0 auto clamp(2px, .45vh, 5px) !important;
  overflow: visible !important;
  pointer-events: none !important;
  animation: ceremonialGanapatiIn .68s var(--ease-soft) both !important;
}
html body #threshold .ceremonial-ganapati-video,
html body #threshold .ceremonial-ganapati-fallback,
html body .farewell .ceremonial-ganapati-video,
html body .farewell .ceremonial-ganapati-fallback {
  display: block !important;
  width: auto !important;
  height: 100% !important;
  max-width: min(100%, 132px) !important;
  max-height: 132px !important;
  aspect-ratio: 672 / 832 !important;
  object-fit: contain !important;
  object-position: center center !important;
  margin: 0 auto !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  image-rendering: auto !important;
  filter: drop-shadow(0 7px 13px rgba(126,83,12,.16)) !important;
}
html body #threshold .ceremonial-ganapati-video[hidden],
html body #threshold .ceremonial-ganapati-fallback[hidden],
html body .farewell .ceremonial-ganapati-video[hidden],
html body .farewell .ceremonial-ganapati-fallback[hidden] {
  display: none !important;
}
@keyframes ceremonialGanapatiIn {
  from { opacity: 0; transform: translateY(-5px) scale(.975); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}

/* Reuse the original animated diya scene twice beside each heading. */
html body #threshold .ceremonial-heading-row,
html body .farewell .ceremonial-heading-row {
  --ceremonial-diya-scale: .255;
  position: relative !important;
  z-index: 4 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: clamp(5px, .9vw, 13px) !important;
  width: min(100%, 760px) !important;
  margin: 0 auto !important;
  overflow: visible !important;
}
html body #threshold .ceremonial-heading-row .threshold-welcome,
html body .farewell .ceremonial-heading-row .farewell-welcome {
  flex: 0 1 auto !important;
  margin: 0 !important;
  white-space: nowrap !important;
}
html body #threshold .ceremonial-diya-slot,
html body .farewell .ceremonial-diya-slot {
  position: relative !important;
  flex: 0 0 clamp(55px, 5.6vw, 68px) !important;
  width: clamp(55px, 5.6vw, 68px) !important;
  height: clamp(52px, 5.2vw, 64px) !important;
  overflow: visible !important;
  pointer-events: none !important;
}
html body #threshold .ceremonial-mini-diya,
html body .farewell .ceremonial-mini-diya {
  position: absolute !important;
  left: 50% !important;
  top: 50% !important;
  width: 260px !important;
  height: 220px !important;
  margin: 0 !important;
  transform: translate(-50%, -50%) scale(var(--ceremonial-diya-scale)) !important;
  transform-origin: center center !important;
  overflow: visible !important;
}
html body #threshold > .threshold-inner > .diya-scene,
html body .farewell .farewell-inner > .diya-scene {
  display: none !important;
}

/* The ordinary in-page Thank You section remains free of duplicate Ganapati. */
html body #thanks .thanks-ganesh-wrap,
html body #thanks .thanks-ganesh-video,
html body #thanks .thanks-ganesh-fallback {
  display: none !important;
}

@media (max-width: 1024px) {
  html body #sacred .sacred-wisdom-audio-frame {
    padding: 11px 14px 12px !important;
  }
  html body #threshold .ceremonial-ganapati,
  html body .farewell .ceremonial-ganapati {
    height: clamp(94px, 12vh, 120px) !important;
  }
  html body #threshold .ceremonial-ganapati-video,
  html body #threshold .ceremonial-ganapati-fallback,
  html body .farewell .ceremonial-ganapati-video,
  html body .farewell .ceremonial-ganapati-fallback {
    max-width: 120px !important;
    max-height: 120px !important;
  }
  html body #threshold .ceremonial-heading-row,
  html body .farewell .ceremonial-heading-row {
    --ceremonial-diya-scale: .23;
  }
}

@media (max-width: 700px) {
  html body #sacred .sacred-wisdom-spotlight .wisdom-cycle-btn,
  html body #sacred .sacred-audio-pair .voice-open {
    width: min(228px, 82vw) !important;
    min-width: 0 !important;
    max-width: min(228px, 82vw) !important;
    height: 46px !important;
    min-height: 46px !important;
    font-size: 12.5px !important;
  }
  html body #sacred .sacred-wisdom-audio-frame {
    padding: 9px 9px 10px !important;
  }
  html body #sacred .sacred-wisdom-audio-frame .heritage-outer-ornament--top,
  html body #sacred .sacred-wisdom-audio-frame .heritage-outer-ornament--bottom {
    height: 24px !important;
  }
  html body #sacred .sacred-wisdom-audio-frame .sacred-wisdom-spotlight {
    padding: 0 2px 5px !important;
    gap: 5px !important;
  }
  html body #sacred .sacred-audio-separator {
    height: 16px !important;
    margin: 4px auto 6px !important;
  }
  html body #sacred .sacred-audio-pair {
    grid-template-columns: 1fr !important;
    gap: 7px !important;
  }
  html body #sacred .virtue-audio-card {
    padding: 9px 10px !important;
  }
  html body #threshold .ceremonial-ganapati,
  html body .farewell .ceremonial-ganapati {
    height: clamp(82px, 13vh, 104px) !important;
    margin-bottom: 0 !important;
  }
  html body #threshold .ceremonial-ganapati-video,
  html body #threshold .ceremonial-ganapati-fallback,
  html body .farewell .ceremonial-ganapati-video,
  html body .farewell .ceremonial-ganapati-fallback {
    max-width: 104px !important;
    max-height: 104px !important;
  }
  html body #threshold .ceremonial-heading-row,
  html body .farewell .ceremonial-heading-row {
    --ceremonial-diya-scale: .195;
    gap: clamp(2px, 1.6vw, 7px) !important;
    width: 100% !important;
  }
  html body #threshold .ceremonial-diya-slot,
  html body .farewell .ceremonial-diya-slot {
    flex-basis: clamp(43px, 12vw, 53px) !important;
    width: clamp(43px, 12vw, 53px) !important;
    height: clamp(42px, 11vw, 50px) !important;
  }
}

@media (max-width: 430px) {
  html body #sacred .sacred-wisdom-spotlight .wisdom-cycle-btn,
  html body #sacred .sacred-audio-pair .voice-open {
    width: min(218px, 78vw) !important;
    max-width: min(218px, 78vw) !important;
    height: 44px !important;
    min-height: 44px !important;
    font-size: 12px !important;
  }
  html body #threshold .ceremonial-ganapati,
  html body .farewell .ceremonial-ganapati {
    height: 86px !important;
  }
  html body #threshold .ceremonial-ganapati-video,
  html body #threshold .ceremonial-ganapati-fallback,
  html body .farewell .ceremonial-ganapati-video,
  html body .farewell .ceremonial-ganapati-fallback {
    max-width: 86px !important;
    max-height: 86px !important;
  }
  html body #threshold .ceremonial-heading-row,
  html body .farewell .ceremonial-heading-row {
    --ceremonial-diya-scale: .165;
  }
  html body #threshold .ceremonial-diya-slot,
  html body .farewell .ceremonial-diya-slot {
    flex-basis: 39px !important;
    width: 39px !important;
    height: 39px !important;
  }
}

@media (max-width: 340px) {
  html body #sacred .sacred-wisdom-spotlight .wisdom-cycle-btn,
  html body #sacred .sacred-audio-pair .voice-open {
    width: min(206px, 76vw) !important;
    max-width: min(206px, 76vw) !important;
    height: 42px !important;
    min-height: 42px !important;
    font-size: 11.5px !important;
  }
  html body #threshold .ceremonial-ganapati,
  html body .farewell .ceremonial-ganapati {
    height: 76px !important;
  }
  html body #threshold .ceremonial-ganapati-video,
  html body #threshold .ceremonial-ganapati-fallback,
  html body .farewell .ceremonial-ganapati-video,
  html body .farewell .ceremonial-ganapati-fallback {
    max-width: 76px !important;
    max-height: 76px !important;
  }
  html body #threshold .ceremonial-heading-row,
  html body .farewell .ceremonial-heading-row {
    --ceremonial-diya-scale: .145;
    gap: 1px !important;
  }
  html body #threshold .ceremonial-diya-slot,
  html body .farewell .ceremonial-diya-slot {
    flex-basis: 34px !important;
    width: 34px !important;
    height: 35px !important;
  }
}

/* ======================================================================
   v55 — COMPACT FOUNDATIONAL LEGACY + GUEST TRIBUTE COMBINED JOURNEY
   Uses the uploaded Gradient Wash Cards + Metro Line Map references while
   preserving every existing field, validation rule, upload, preview and
   submission control in the current contribution workflow.
   ====================================================================== */

/* ----------------------------------------------------------------------
   FOUNDATIONAL LEGACY — reduce unused frame space without disturbing the
   coverflow interaction or the portrait's natural proportions.
   ---------------------------------------------------------------------- */
html body #foundation .foundation-shell {
  box-sizing: border-box !important;
  width: min(100%, 1100px) !important;
  max-width: 1100px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  grid-template-columns: 190px minmax(0, 1fr) !important;
  gap: clamp(18px, 2vw, 24px) !important;
  padding: clamp(20px, 2.2vw, 26px) !important;
  border-radius: 20px !important;
}
html body #foundation .foundation-photo {
  width: min(190px, 100%) !important;
}
html body #foundation .foundation-copy > h3 {
  margin-top: 0 !important;
  margin-bottom: 6px !important;
}
html body #foundation .foundation-copy > p {
  margin-top: 7px !important;
  margin-bottom: 7px !important;
  line-height: 1.55 !important;
}
html body #foundation .foundation-coverflow {
  margin-top: 12px !important;
  padding-top: 10px !important;
}
@media (min-width: 981px) {
  html body #foundation .foundation-coverflow {
    /* New portrait width 190px + compact gap 24px. */
    width: calc(100% + 214px) !important;
    margin-left: -214px !important;
  }
}
html body #foundation .foundation-coverflow-toolbar {
  margin-bottom: 3px !important;
}
html body #foundation .foundation-coverflow-hint {
  margin-top: 5px !important;
}
html body #foundation .foundation-coverflow-stage,
html body #foundation .foundation-highlights {
  height: 304px !important;
  min-height: 304px !important;
}
html body #foundation .foundation-highlights > span {
  width: min(306px, 76%) !important;
  min-height: 218px !important;
  padding: 28px 24px 23px !important;
}

@media (max-width: 980px) {
  html body #foundation .foundation-shell {
    grid-template-columns: minmax(0, 1fr) !important;
    width: min(100%, 760px) !important;
    gap: 14px !important;
  }
  html body #foundation .foundation-photo {
    width: min(180px, 52vw) !important;
    justify-self: center !important;
  }
  html body #foundation .foundation-coverflow {
    margin-top: 8px !important;
    padding-top: 8px !important;
  }
  html body #foundation .foundation-coverflow-stage,
  html body #foundation .foundation-highlights {
    height: 288px !important;
    min-height: 288px !important;
  }
  html body #foundation .foundation-highlights > span {
    width: min(294px, 74vw) !important;
    min-height: 214px !important;
    padding: 25px 22px 21px !important;
  }
}

@media (max-width: 620px) {
  html body #foundation .foundation-shell {
    width: 100% !important;
    padding: 14px 12px 15px !important;
    gap: 11px !important;
    border-radius: 16px !important;
  }
  html body #foundation .foundation-photo {
    width: min(160px, 48vw) !important;
  }
  html body #foundation .foundation-copy > p {
    margin-top: 6px !important;
    margin-bottom: 6px !important;
    line-height: 1.48 !important;
  }
  html body #foundation .foundation-coverflow-stage,
  html body #foundation .foundation-highlights {
    height: 268px !important;
    min-height: 268px !important;
  }
  html body #foundation .foundation-highlights > span {
    width: min(82vw, 278px, calc(100% - 8px)) !important;
    min-height: 206px !important;
    padding: 23px 19px 19px !important;
  }
}

/* ----------------------------------------------------------------------
   GUEST TRIBUTE WINDOW — same outer heritage frame as Virtues & Wisdom.
   ---------------------------------------------------------------------- */
html body #guest-tribute .guest-tribute-combined {
  --journey-wine: #741f2a;
  --journey-wine-deep: #55151d;
  --journey-gold: #d7a63c;
  --journey-gold-bright: #f0d77b;
  --journey-teal: #2f716e;
  --journey-green: #4f8063;
  --journey-sage: #cce1cf;
  --journey-ink: #4c3a25;
  width: min(100%, 1160px) !important;
  max-width: 1160px !important;
  margin: 0 auto !important;
  padding: clamp(22px, 3vw, 36px) !important;
  overflow: hidden !important;
}
html body #guest-tribute .guest-tribute-outer-ornament {
  width: min(100%, 860px) !important;
  height: clamp(27px, 3vw, 38px) !important;
  margin-left: auto !important;
  margin-right: auto !important;
}
html body #guest-tribute .guest-tribute-outer-ornament--top {
  margin-bottom: clamp(13px, 1.6vw, 18px) !important;
}
html body #guest-tribute .guest-tribute-outer-ornament--bottom {
  margin-top: clamp(14px, 1.8vw, 21px) !important;
  margin-bottom: 0 !important;
}

/* The whole journey header becomes the clean combined card + metro module. */
html body #guest-tribute .guided-progress-shell {
  position: relative !important;
  margin: 0 0 clamp(18px, 2.4vw, 28px) !important;
  padding: 0 0 clamp(12px, 1.5vw, 18px) !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  overflow: visible !important;
}
html body #guest-tribute .guided-progress-shell::before,
html body #guest-tribute .guided-progress-shell::after {
  display: none !important;
  content: none !important;
}
html body #guest-tribute .guided-progress-title {
  display: flex !important;
  align-items: baseline !important;
  justify-content: space-between !important;
  gap: 16px !important;
  margin: 0 !important;
  padding: 0 0 12px !important;
  border-bottom: 1px solid rgba(183,122,31,.22) !important;
  color: var(--journey-wine) !important;
}
html body #guest-tribute .guided-progress-title > span {
  color: var(--journey-wine) !important;
  font-family: var(--font-display) !important;
  font-size: clamp(17px, 1.55vw, 22px) !important;
  font-weight: 700 !important;
  letter-spacing: .14em !important;
  text-transform: uppercase !important;
}
html body #guest-tribute .guided-progress-title small {
  display: block !important;
  color: #8b6b43 !important;
  font-family: var(--font-display) !important;
  font-size: clamp(12px, 1.05vw, 15px) !important;
  font-style: italic !important;
  line-height: 1.35 !important;
  text-align: right !important;
}

/* Gradient Wash Cards: five large, clean journey chapters. */
html body #guest-tribute .guided-progress {
  display: grid !important;
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  gap: clamp(10px, 1.2vw, 14px) !important;
  margin: clamp(17px, 2vw, 22px) 0 10px !important;
  padding: 0 !important;
  overflow: visible !important;
}
html body #guest-tribute .guided-progress::before,
html body #guest-tribute .guided-progress::after {
  display: none !important;
  content: none !important;
}
html body #guest-tribute .guided-step {
  position: relative !important;
  isolation: isolate !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  justify-content: flex-start !important;
  min-width: 0 !important;
  min-height: 142px !important;
  gap: 12px !important;
  padding: 20px 16px 17px !important;
  border: 1px solid rgba(90,128,99,.16) !important;
  border-radius: 22px !important;
  overflow: hidden !important;
  background:
    radial-gradient(circle at 12% 8%, rgba(255,255,255,.52), transparent 30%),
    linear-gradient(135deg, rgba(202,227,208,.96), rgba(171,211,187,.88)) !important;
  color: #294735 !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.68),
    0 9px 22px rgba(57,86,63,.08) !important;
  transform: none !important;
  transition:
    transform .24s cubic-bezier(.22,1,.36,1),
    box-shadow .24s ease,
    border-color .24s ease,
    filter .24s ease !important;
}
html body #guest-tribute .guided-step::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: -1 !important;
  background: linear-gradient(115deg, transparent 0 34%, rgba(255,255,255,.20) 45%, transparent 57%) !important;
  transform: translateX(-120%) !important;
  transition: transform .62s ease !important;
}
html body #guest-tribute .guided-step:hover {
  transform: translateY(-3px) !important;
  border-color: rgba(183,122,31,.34) !important;
  box-shadow: 0 14px 30px rgba(67,44,12,.12) !important;
}
html body #guest-tribute .guided-step:hover::before {
  transform: translateX(120%) !important;
}
html body #guest-tribute .guided-step > span {
  position: absolute !important;
  right: -4px !important;
  bottom: -28px !important;
  width: auto !important;
  height: auto !important;
  flex: none !important;
  display: block !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: none !important;
  color: rgba(255,255,255,.50) !important;
  font-family: Georgia, serif !important;
  font-size: clamp(76px, 7.4vw, 108px) !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  letter-spacing: -.06em !important;
  opacity: .72 !important;
  pointer-events: none !important;
}
html body #guest-tribute .guided-step > em {
  position: relative !important;
  z-index: 2 !important;
  max-width: 92% !important;
  color: #2f3d2f !important;
  font-family: var(--font-display) !important;
  font-size: clamp(14px, 1.18vw, 17px) !important;
  font-weight: 700 !important;
  font-style: normal !important;
  line-height: 1.25 !important;
}
html body #guest-tribute .guided-step-requirement {
  position: relative !important;
  z-index: 2 !important;
  display: inline-flex !important;
  align-items: center !important;
  min-height: 24px !important;
  margin: auto 0 0 !important;
  padding: 4px 10px !important;
  border: 0 !important;
  border-radius: 999px !important;
  font-size: 10px !important;
  font-weight: 700 !important;
  letter-spacing: .09em !important;
  text-transform: uppercase !important;
}
html body #guest-tribute .guided-step-requirement.is-mandatory {
  color: #fff4d6 !important;
  background: var(--journey-wine) !important;
}
html body #guest-tribute .guided-step-requirement.is-optional {
  color: #8b6934 !important;
  background: rgba(255,247,214,.90) !important;
  box-shadow: inset 0 0 0 1px rgba(183,122,31,.20) !important;
}
html body #guest-tribute .guided-step.is-done {
  border-color: rgba(47,113,110,.38) !important;
  background:
    radial-gradient(circle at 12% 8%, rgba(255,255,255,.42), transparent 30%),
    linear-gradient(135deg, rgba(130,186,157,.96), rgba(74,128,102,.88)) !important;
  color: #fff9df !important;
}
html body #guest-tribute .guided-step.is-done > em {
  color: #fff9df !important;
  text-shadow: 0 1px 0 rgba(28,69,50,.32) !important;
}
html body #guest-tribute .guided-step.is-current,
html body #guest-tribute .guided-step:nth-child(5) {
  border-color: rgba(116,31,42,.72) !important;
  background:
    radial-gradient(circle at 92% 90%, rgba(225,177,73,.23), transparent 34%),
    linear-gradient(145deg, #7b2530 0%, #651c27 62%, #45131b 100%) !important;
  color: #fff1c0 !important;
  box-shadow:
    0 16px 34px rgba(82,25,33,.20),
    inset 0 1px 0 rgba(255,239,187,.18) !important;
}
html body #guest-tribute .guided-step.is-current > em,
html body #guest-tribute .guided-step:nth-child(5) > em {
  color: #fff1c0 !important;
  text-shadow: 0 1px 0 rgba(61,17,22,.56) !important;
}
html body #guest-tribute .guided-step.is-current > span,
html body #guest-tribute .guided-step:nth-child(5) > span {
  color: rgba(239,199,102,.22) !important;
}
html body #guest-tribute .guided-step.is-current .guided-step-requirement.is-mandatory,
html body #guest-tribute .guided-step:nth-child(5) .guided-step-requirement.is-mandatory {
  color: #7b2430 !important;
  background: #fff0b7 !important;
}

/* Metro Line Map: visually mirrors the exact same five stages below. */
html body #guest-tribute .guided-metro-scroll {
  position: relative !important;
  width: 100% !important;
  overflow: hidden !important;
}
html body #guest-tribute .guided-metro-map {
  position: relative !important;
  display: grid !important;
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  align-items: start !important;
  gap: 0 !important;
  width: 100% !important;
  min-width: 0 !important;
  padding: 15px 4px 0 !important;
}
html body #guest-tribute .guided-metro-map::before {
  content: "" !important;
  position: absolute !important;
  left: 9.5% !important;
  right: 9.5% !important;
  top: 27px !important;
  height: 8px !important;
  border-radius: 999px !important;
  background: linear-gradient(90deg,
    #4f8063 0 75%,
    #6b2630 75% 100%) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.42),
    0 2px 5px rgba(63,40,10,.08) !important;
}
html body #guest-tribute .guided-metro-station {
  position: relative !important;
  z-index: 2 !important;
  display: grid !important;
  justify-items: center !important;
  align-content: start !important;
  gap: 5px !important;
  min-width: 0 !important;
  padding: 0 6px !important;
  color: #806547 !important;
  text-align: center !important;
}
html body #guest-tribute .guided-metro-node {
  display: block !important;
  width: 14px !important;
  height: 36px !important;
  border-radius: 999px !important;
  border: 2px solid #4f8063 !important;
  background: #4f8063 !important;
  box-shadow:
    0 0 0 4px rgba(255,252,240,.70),
    0 2px 7px rgba(57,84,63,.14) !important;
}
html body #guest-tribute .guided-metro-station em {
  max-width: 150px !important;
  color: #7e6243 !important;
  font-family: var(--font-display) !important;
  font-size: clamp(11px, .92vw, 14px) !important;
  font-style: normal !important;
  line-height: 1.25 !important;
}
html body #guest-tribute .guided-metro-station small {
  display: inline-flex !important;
  align-items: center !important;
  min-height: 21px !important;
  padding: 3px 9px !important;
  border-radius: 999px !important;
  color: #fff1d2 !important;
  background: var(--journey-wine) !important;
  font-size: 9px !important;
  font-weight: 700 !important;
  letter-spacing: .08em !important;
  text-transform: uppercase !important;
}
html body #guest-tribute .guided-metro-station:nth-child(3) small {
  color: #8d7040 !important;
  background: #fff6d6 !important;
  box-shadow: inset 0 0 0 1px rgba(183,122,31,.20) !important;
}
html body #guest-tribute .guided-metro-station.is-done .guided-metro-node {
  background: var(--journey-teal) !important;
  border-color: var(--journey-teal) !important;
}
html body #guest-tribute .guided-metro-station.is-current .guided-metro-node,
html body #guest-tribute .guided-metro-station:nth-child(5) .guided-metro-node {
  border-color: var(--journey-wine) !important;
  background: var(--journey-wine) !important;
  box-shadow:
    0 0 0 5px rgba(116,31,42,.11),
    0 0 0 8px rgba(255,249,225,.80),
    0 2px 8px rgba(93,30,37,.18) !important;
  animation: guestMetroPulse 1.8s ease-in-out infinite !important;
}
html body #guest-tribute .guided-metro-station.is-current em,
html body #guest-tribute .guided-metro-station:nth-child(5) em {
  color: var(--journey-wine) !important;
  font-weight: 700 !important;
}
@keyframes guestMetroPulse {
  0%,100% { transform: scale(1); filter: brightness(1); }
  50% { transform: scale(1.08); filter: brightness(1.08); }
}

/* ----------------------------------------------------------------------
   Existing stage content: retain every field and option but simplify the
   chrome so the five stages read as one coherent modern-heritage workflow.
   ---------------------------------------------------------------------- */
html body #guest-tribute .tribute-form--guided > [data-stage-panel] {
  position: relative !important;
  box-sizing: border-box !important;
  width: 100% !important;
  margin: 0 0 15px !important;
  padding: clamp(15px, 1.8vw, 20px) !important;
  border: 1px solid rgba(183,122,31,.25) !important;
  border-radius: 18px !important;
  background:
    linear-gradient(180deg, rgba(255,254,249,.93), rgba(250,243,225,.78)) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.76),
    0 9px 20px rgba(76,48,10,.045) !important;
  overflow: hidden !important;
}
html body #guest-tribute .tribute-form--guided > [data-stage-panel]::before,
html body #guest-tribute .journey-stage-crown-line {
  display: none !important;
  content: none !important;
}
html body #guest-tribute .journey-stage-bar {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 9px !important;
  min-height: 0 !important;
  margin: 0 0 14px !important;
  padding: 0 0 10px !important;
  border: 0 !important;
  border-bottom: 1px solid rgba(183,122,31,.20) !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}
html body #guest-tribute .journey-stage-bar .journey-stage-number {
  display: grid !important;
  place-items: center !important;
  width: 31px !important;
  height: 31px !important;
  flex: 0 0 31px !important;
  border-radius: 10px !important;
  color: #fff3c8 !important;
  background: linear-gradient(145deg, var(--journey-wine), var(--journey-wine-deep)) !important;
  box-shadow: 0 5px 11px rgba(93,30,37,.14) !important;
  font-size: 12px !important;
  font-weight: 800 !important;
}
html body #guest-tribute .journey-stage-bar-title {
  color: var(--journey-wine) !important;
  font-family: var(--font-display) !important;
  font-size: clamp(14px, 1.2vw, 17px) !important;
  font-weight: 700 !important;
  letter-spacing: .08em !important;
  text-transform: uppercase !important;
}
html body #guest-tribute .journey-stage-requirement {
  margin-left: auto !important;
}
html body #guest-tribute [data-stage-panel].is-done-stage {
  border-color: rgba(47,113,110,.28) !important;
}
html body #guest-tribute [data-stage-panel].is-current-stage {
  border-color: rgba(116,31,42,.35) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.76),
    0 11px 26px rgba(93,30,37,.07) !important;
}
html body #guest-tribute [data-stage-panel].is-current-stage .journey-stage-bar .journey-stage-number {
  color: #5d1721 !important;
  background: linear-gradient(180deg, #fff4c2, #e4b34c) !important;
}

/* Experience choices borrow the same wash-card language, but stay fully
   interactive radio cards with their existing buttons. */
html body #guest-tribute .experience-carousel--embedded {
  gap: 12px !important;
}
html body #guest-tribute .experience-carousel--embedded .experience-card {
  border: 1px solid rgba(69,123,94,.18) !important;
  border-radius: 18px !important;
  background:
    radial-gradient(circle at 10% 10%, rgba(255,255,255,.55), transparent 28%),
    linear-gradient(145deg, rgba(227,239,225,.94), rgba(204,226,208,.84)) !important;
  box-shadow: 0 8px 18px rgba(61,84,58,.055) !important;
}
html body #guest-tribute .experience-carousel--embedded .experience-card.is-active {
  border-color: rgba(183,122,31,.70) !important;
  background:
    radial-gradient(circle at 90% 12%, rgba(240,215,123,.18), transparent 30%),
    linear-gradient(145deg, #7b2530, #55151d) !important;
  color: #fff3c7 !important;
  box-shadow: 0 15px 30px rgba(91,27,35,.16) !important;
}
html body #guest-tribute .experience-carousel--embedded .experience-card.is-active h5,
html body #guest-tribute .experience-carousel--embedded .experience-card.is-active p,
html body #guest-tribute .experience-carousel--embedded .experience-card.is-active .experience-icon {
  color: #fff1bd !important;
}
html body #guest-tribute .experience-carousel--embedded .experience-card.is-active .experience-select {
  color: #5f1923 !important;
  border-color: #e4b64f !important;
  background: linear-gradient(180deg, #fff1af, #dfad42) !important;
}

html body #guest-tribute .dedication-options {
  gap: 10px !important;
}
html body #guest-tribute .radio-pill {
  border-radius: 14px !important;
  transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease !important;
}
html body #guest-tribute .radio-pill:hover {
  transform: translateY(-1px) !important;
}
html body #guest-tribute .radio-pill:has(input:checked) {
  border-color: rgba(183,122,31,.66) !important;
  background: linear-gradient(180deg, #fff8db, #efd58f) !important;
  box-shadow: 0 8px 18px rgba(119,75,15,.09) !important;
}

html body #guest-tribute .preview-state--selected,
html body #guest-tribute .journey-stage--submit {
  background:
    radial-gradient(circle at 50% 0%, rgba(232,201,111,.16), transparent 30%),
    linear-gradient(180deg, rgba(255,254,249,.96), rgba(249,239,214,.88)) !important;
}
html body #guest-tribute .journey-stage--submit {
  text-align: center !important;
}
html body #guest-tribute .journey-stage--submit .journey-stage-bar {
  text-align: left !important;
}

/* Mobile/tablet: keep the page itself fixed-width while the two journey
   visualisations become deliberate horizontal filmstrips. */
@media (max-width: 820px) {
  html body #guest-tribute .guest-tribute-combined {
    width: 100% !important;
    padding: 18px 13px 20px !important;
    border-radius: 18px !important;
  }
  html body #guest-tribute .guided-progress-title {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 4px !important;
  }
  html body #guest-tribute .guided-progress-title small {
    text-align: left !important;
  }
  html body #guest-tribute .guided-progress {
    display: flex !important;
    gap: 10px !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    scroll-snap-type: x mandatory !important;
    overscroll-behavior-inline: contain !important;
    -webkit-overflow-scrolling: touch !important;
    scrollbar-width: none !important;
    padding: 2px 2px 8px !important;
  }
  html body #guest-tribute .guided-progress::-webkit-scrollbar { display: none !important; }
  html body #guest-tribute .guided-step {
    flex: 0 0 min(210px, 72vw) !important;
    min-height: 128px !important;
    scroll-snap-align: start !important;
  }
  html body #guest-tribute .guided-metro-scroll {
    overflow-x: auto !important;
    overflow-y: hidden !important;
    overscroll-behavior-inline: contain !important;
    -webkit-overflow-scrolling: touch !important;
    scrollbar-width: none !important;
  }
  html body #guest-tribute .guided-metro-scroll::-webkit-scrollbar { display: none !important; }
  html body #guest-tribute .guided-metro-map {
    width: 760px !important;
    min-width: 760px !important;
    padding-inline: 10px !important;
  }
  html body #guest-tribute .tribute-form--guided > [data-stage-panel] {
    padding: 14px 12px !important;
    border-radius: 15px !important;
  }
}

@media (max-width: 560px) {
  html body #guest-tribute .guest-tribute-combined {
    padding: 15px 9px 17px !important;
  }
  html body #guest-tribute .guest-tribute-outer-ornament {
    height: 24px !important;
  }
  html body #guest-tribute .guided-progress-title > span {
    font-size: 15px !important;
  }
  html body #guest-tribute .guided-progress-title small {
    font-size: 11.5px !important;
  }
  html body #guest-tribute .guided-step {
    flex-basis: min(194px, 78vw) !important;
    min-height: 118px !important;
    padding: 16px 13px 14px !important;
    border-radius: 17px !important;
  }
  html body #guest-tribute .guided-step > span {
    font-size: 78px !important;
  }
  html body #guest-tribute .guided-step > em {
    font-size: 13px !important;
  }
  html body #guest-tribute .guided-metro-map {
    width: 690px !important;
    min-width: 690px !important;
  }
  html body #guest-tribute .journey-stage-bar {
    align-items: flex-start !important;
    flex-wrap: wrap !important;
  }
  html body #guest-tribute .journey-stage-requirement {
    margin-left: 40px !important;
  }
  html body #guest-tribute .journey-stage-bar-title {
    flex: 1 1 calc(100% - 44px) !important;
    font-size: 13px !important;
  }
  html body #guest-tribute .experience-carousel--embedded .experience-card {
    border-radius: 16px !important;
  }
}


/* ======================================================================
   v56 — Guest Tribute small-phone polish.
   Keeps the Gradient Wash cards + Metro Line Map synchronized with the
   existing form while making the full workflow calmer on 480px-and-below.
   ====================================================================== */
@media (max-width: 480px) {
  html body #guest-tribute .section-inner {
    padding-left: 8px !important;
    padding-right: 8px !important;
  }
  html body #guest-tribute .guest-tribute-combined {
    width: 100% !important;
    max-width: none !important;
    padding: 12px 7px 14px !important;
    border-radius: 16px !important;
    overflow: hidden !important;
  }
  html body #guest-tribute .guest-tribute-outer-ornament {
    width: min(88%, 290px) !important;
    height: 20px !important;
  }
  html body #guest-tribute .guest-tribute-outer-ornament--top {
    margin-bottom: 9px !important;
  }
  html body #guest-tribute .guest-tribute-outer-ornament--bottom {
    margin-top: 10px !important;
  }

  html body #guest-tribute .guided-progress-shell {
    margin-bottom: 14px !important;
    padding-bottom: 9px !important;
  }
  html body #guest-tribute .guided-progress-title {
    gap: 3px !important;
    padding: 0 3px 9px !important;
    text-align: center !important;
  }
  html body #guest-tribute .guided-progress-title > span {
    font-size: 14px !important;
    letter-spacing: .105em !important;
    line-height: 1.2 !important;
  }
  html body #guest-tribute .guided-progress-title small {
    max-width: 300px !important;
    margin: 0 auto !important;
    font-size: 11px !important;
    line-height: 1.32 !important;
    text-align: center !important;
  }

  html body #guest-tribute .guided-progress {
    gap: 8px !important;
    margin: 11px -1px 7px !important;
    padding: 2px 8px 7px !important;
    scroll-padding-inline: 8px !important;
    scroll-snap-type: x mandatory !important;
  }
  html body #guest-tribute .guided-step {
    flex: 0 0 min(176px, 68vw) !important;
    min-height: 106px !important;
    gap: 8px !important;
    padding: 13px 11px 11px !important;
    border-radius: 15px !important;
    scroll-snap-align: center !important;
    scroll-snap-stop: always !important;
  }
  html body #guest-tribute .guided-step > span {
    right: -1px !important;
    bottom: -21px !important;
    font-size: 68px !important;
  }
  html body #guest-tribute .guided-step > em {
    max-width: 94% !important;
    font-size: 12.5px !important;
    line-height: 1.18 !important;
  }
  html body #guest-tribute .guided-step-requirement {
    min-height: 21px !important;
    padding: 3px 8px !important;
    font-size: 9px !important;
    letter-spacing: .075em !important;
  }

  html body #guest-tribute .guided-metro-scroll {
    margin: 2px 0 0 !important;
    padding: 0 8px 5px !important;
    scroll-padding-inline: 8px !important;
    scroll-snap-type: x proximity !important;
  }
  html body #guest-tribute .guided-metro-map {
    width: 560px !important;
    min-width: 560px !important;
    padding: 12px 7px 0 !important;
    grid-template-columns: repeat(5, 112px) !important;
  }
  html body #guest-tribute .guided-metro-map::before {
    left: 56px !important;
    right: 56px !important;
  }
  html body #guest-tribute .guided-metro-station {
    min-width: 0 !important;
    padding-inline: 4px !important;
    scroll-snap-align: center !important;
  }
  html body #guest-tribute .guided-metro-node {
    width: 15px !important;
    height: 15px !important;
  }
  html body #guest-tribute .guided-metro-station em {
    margin-top: 8px !important;
    font-size: 10.5px !important;
    line-height: 1.15 !important;
  }
  html body #guest-tribute .guided-metro-station small {
    margin-top: 5px !important;
    padding: 3px 6px !important;
    font-size: 8px !important;
    letter-spacing: .05em !important;
  }

  html body #guest-tribute .tribute-form--guided > [data-stage-panel] {
    margin-bottom: 10px !important;
    padding: 11px 9px !important;
    border-radius: 14px !important;
  }
  html body #guest-tribute .journey-stage-bar {
    display: grid !important;
    grid-template-columns: 29px minmax(0,1fr) !important;
    gap: 5px 8px !important;
    margin-bottom: 10px !important;
    padding-bottom: 8px !important;
  }
  html body #guest-tribute .journey-stage-bar .journey-stage-number {
    width: 29px !important;
    height: 29px !important;
    flex-basis: 29px !important;
    grid-row: 1 / span 2 !important;
    align-self: start !important;
  }
  html body #guest-tribute .journey-stage-bar-title {
    grid-column: 2 !important;
    flex: none !important;
    min-width: 0 !important;
    font-size: 12.5px !important;
    line-height: 1.18 !important;
    letter-spacing: .065em !important;
  }
  html body #guest-tribute .journey-stage-requirement {
    grid-column: 2 !important;
    margin: 0 !important;
    justify-self: start !important;
    font-size: 9px !important;
  }

  html body #guest-tribute .embedded-experience-head,
  html body #guest-tribute .journey-stage-intro,
  html body #guest-tribute .media-head,
  html body #guest-tribute .preview-head-row {
    display: grid !important;
    grid-template-columns: minmax(0,1fr) !important;
    gap: 6px !important;
  }
  html body #guest-tribute .embedded-experience-head h4,
  html body #guest-tribute .journey-stage-intro h4,
  html body #guest-tribute .media-head h4,
  html body #guest-tribute .preview-stage-title h4 {
    font-size: 16px !important;
    line-height: 1.22 !important;
  }
  html body #guest-tribute .embedded-experience-head p,
  html body #guest-tribute .journey-stage-intro p,
  html body #guest-tribute .media-head p {
    font-size: 12px !important;
    line-height: 1.42 !important;
  }
  html body #guest-tribute .embedded-choice-note,
  html body #guest-tribute .optional-chip,
  html body #guest-tribute .preview-status-chip {
    justify-self: start !important;
    max-width: 100% !important;
    white-space: normal !important;
  }

  html body #guest-tribute .experience-carousel--embedded {
    display: grid !important;
    grid-template-columns: minmax(0,1fr) !important;
    gap: 8px !important;
    overflow: visible !important;
  }
  html body #guest-tribute .experience-carousel--embedded .experience-card {
    min-width: 0 !important;
    padding: 13px 11px !important;
    border-radius: 14px !important;
  }
  html body #guest-tribute .experience-carousel--embedded .experience-card h5 {
    font-size: 15px !important;
  }
  html body #guest-tribute .experience-carousel--embedded .experience-card p {
    font-size: 12px !important;
    line-height: 1.4 !important;
  }
  html body #guest-tribute .experience-carousel--embedded .experience-select {
    width: 100% !important;
    min-height: 42px !important;
  }

  html body #guest-tribute .dedication-options,
  html body #guest-tribute .field-row,
  html body #guest-tribute .field-row-2,
  html body #guest-tribute .field-row-3,
  html body #guest-tribute .tribute-grid {
    display: grid !important;
    grid-template-columns: minmax(0,1fr) !important;
    gap: 8px !important;
  }
  html body #guest-tribute .radio-pill {
    width: 100% !important;
    min-width: 0 !important;
    min-height: 44px !important;
    border-radius: 12px !important;
  }

  html body #guest-tribute input[type="text"],
  html body #guest-tribute input[type="date"],
  html body #guest-tribute input[type="search"],
  html body #guest-tribute select,
  html body #guest-tribute textarea {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    font-size: 16px !important; /* prevents iOS focus zoom */
  }
  html body #guest-tribute textarea#tributeMessage {
    min-height: 170px !important;
    resize: vertical !important;
  }
  html body #guest-tribute .experience-detail-panel,
  html body #guest-tribute .milestone-builder {
    padding: 10px !important;
    border-radius: 12px !important;
  }

  html body #guest-tribute .upload-grid {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0,1fr)) !important;
    gap: 8px !important;
  }
  html body #guest-tribute .upload-tile {
    min-width: 0 !important;
    min-height: 96px !important;
    padding: 10px 6px !important;
  }
  html body #guest-tribute .upload-tile em {
    font-size: 11px !important;
  }
  html body #guest-tribute .tracker-state {
    gap: 6px !important;
  }
  html body #guest-tribute .tracker-line {
    display: grid !important;
    grid-template-columns: 30px minmax(0,1fr) auto !important;
    gap: 6px !important;
    align-items: center !important;
  }
  html body #guest-tribute .tracker-line span,
  html body #guest-tribute .tracker-line em {
    font-size: 9.5px !important;
  }
  html body #guest-tribute .admin-review-callout {
    grid-template-columns: 27px minmax(0,1fr) !important;
    gap: 8px !important;
    padding: 10px !important;
  }

  html body #guest-tribute .preview-files {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0,1fr)) !important;
    gap: 7px !important;
  }
  html body #guest-tribute .preview-files > span {
    min-width: 0 !important;
    padding: 8px 5px !important;
    font-size: 10.5px !important;
  }
  html body #guest-tribute #previewMessage,
  html body #guest-tribute .moderation-note,
  html body #guest-tribute .submit-stage-note,
  html body #guest-tribute #submitGuidance {
    overflow-wrap: anywhere !important;
  }
  html body #guest-tribute .journey-stage--submit .btn,
  html body #guest-tribute #tributeSubmitBtn {
    width: 100% !important;
    min-height: 46px !important;
    white-space: normal !important;
  }
}

@media (max-width: 350px) {
  html body #guest-tribute .section-inner {
    padding-left: 5px !important;
    padding-right: 5px !important;
  }
  html body #guest-tribute .guest-tribute-combined {
    padding: 10px 5px 12px !important;
    border-radius: 14px !important;
  }
  html body #guest-tribute .guided-step {
    flex-basis: min(164px, 70vw) !important;
    min-height: 101px !important;
    padding: 12px 9px 10px !important;
  }
  html body #guest-tribute .guided-metro-map {
    width: 520px !important;
    min-width: 520px !important;
    grid-template-columns: repeat(5, 104px) !important;
  }
  html body #guest-tribute .guided-metro-map::before {
    left: 52px !important;
    right: 52px !important;
  }
  html body #guest-tribute .tribute-form--guided > [data-stage-panel] {
    padding: 10px 7px !important;
  }
  html body #guest-tribute .upload-grid {
    gap: 6px !important;
  }
  html body #guest-tribute .upload-tile {
    min-height: 90px !important;
  }
}


/* ======================================================================
   v57 — SACRED TYPOGRAPHY, INSTANT FOUNDATION INPUT, FAREWELL COLOUR,
   AND GANAPATI STARTUP HARDENING
   ====================================================================== */

/* Sacred Dedication: "A Thought to Carry Forward" is exactly the same
   computed size as the parent role line (Mother • Scholar • Guide). */
html body #sacred .sacred-wisdom-audio-frame {
  --sacred-role-size: clamp(10.5px, .88vw, 12.5px);
}
html body #sacred .sacred-wisdom-spotlight #wisdomSpotlightHeading,
html body #sacred .virtue-audio-identity p:last-child {
  font-size: var(--sacred-role-size) !important;
}
html body #sacred .sacred-wisdom-spotlight #wisdomSpotlightHeading {
  line-height: 1.25 !important;
}
html body #sacred #experienceWisdomQuote {
  color: #DC143C !important;
  -webkit-text-fill-color: #DC143C !important;
  text-shadow: 0 1px 0 rgba(255,255,255,.72), 0 0 8px rgba(220,20,60,.08) !important;
}

/* Foundational Legacy: make the visible deck react almost immediately.
   The JS also avoids getComputedStyle() on every tapped candidate, which
   removes a forced style calculation from the hot tap path. */
html body #foundation .foundation-highlights > span {
  transition:
    transform .075s cubic-bezier(.22,1,.36,1),
    opacity .060s linear,
    border-color .080s ease,
    box-shadow .080s ease,
    filter .080s ease !important;
  will-change: transform, opacity !important;
  backface-visibility: hidden !important;
  -webkit-backface-visibility: hidden !important;
}
html body #foundation .foundation-coverflow-dot::before {
  transition: width .070s cubic-bezier(.22,1,.36,1), background .070s ease, border-color .070s ease !important;
}
html body #foundation .foundation-coverflow-prev,
html body #foundation .foundation-coverflow-next {
  touch-action: manipulation !important;
}

/* Final farewell only: crimson heading and parent names while preserving
   all existing shimmer/arrival animation classes and timing. */
html body .farewell .farewell-welcome {
  color: transparent !important;
  -webkit-text-fill-color: transparent !important;
  background-image:
    linear-gradient(100deg, rgba(255,255,255,0) 36%, rgba(255,222,226,.96) 50%, rgba(255,255,255,0) 64%),
    radial-gradient(circle at 50% 38%, #ff667b 0%, #DC143C 42%, #a90d2c 100%) !important;
  background-size: 300% 100%, 100% 100% !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
}
html body .farewell .farewell-names {
  color: transparent !important;
  -webkit-text-fill-color: transparent !important;
  background-image: linear-gradient(100deg, #DC143C 0%, #DC143C 38%, #ffb7c1 50%, #DC143C 62%, #a90d2c 100%) !important;
  background-size: 280% 100% !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
}

@media (max-width: 700px) {
  html body #sacred .sacred-wisdom-audio-frame {
    --sacred-role-size: clamp(10.5px, 3.1vw, 12px);
  }
}
@media (max-width: 430px) {
  html body #sacred .sacred-wisdom-audio-frame {
    --sacred-role-size: 10.5px;
  }
}


/* ======================================================================
   v58 — TRANSPARENT GANAPATI, EXACT WELCOME-COLOUR PARITY,
   HOME MANDIR BALANCE, AND INSTANT FAREWELL
   ====================================================================== */

/* The Ganapati is now a true-alpha animated WebP. There is no video surface
   behind it, so neither Welcome nor Farewell can expose a black rectangle. */
html body #threshold .ceremonial-ganapati-image,
html body .farewell .ceremonial-ganapati-image {
  display: block !important;
  width: auto !important;
  height: 100% !important;
  max-width: min(100%, 132px) !important;
  max-height: 132px !important;
  aspect-ratio: 214 / 264 !important;
  object-fit: contain !important;
  object-position: center center !important;
  margin: 0 auto !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  image-rendering: auto !important;
  filter: drop-shadow(0 7px 13px rgba(126,83,12,.16)) !important;
}

/* Exact visual colour parity with the first-screen WELCOME treatment. */
html body .farewell .farewell-welcome {
  color: transparent !important;
  -webkit-text-fill-color: transparent !important;
  background-image:
    linear-gradient(100deg, rgba(255,255,255,0) 36%, rgba(226,140,48,.90) 50%, rgba(255,255,255,0) 64%),
    radial-gradient(circle at 50% 38%, #c2620d 0%, #b1560a 28%, #a85207 55%, #8f4406 100%) !important;
  background-size: 300% 100%, 100% 100% !important;
  background-repeat: no-repeat, no-repeat !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  animation: wgCombo 5.2s linear infinite !important;
}

/* Exact parity with the parent names shown on the opening Welcome screen. */
html body .farewell .farewell-names {
  color: transparent !important;
  -webkit-text-fill-color: transparent !important;
  background-image: linear-gradient(100deg,
      #a85207 0%, #a85207 38%, #d2761a 50%, #a85207 62%, #a85207 100%) !important;
  background-size: 280% 100% !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  animation: seRise .2s var(--ease-soft) 0s both,
             seSweep 9s linear .35s infinite !important;
}

/* Every rotating Sacred thought uses the exact WELCOME colour system. */
html body #sacred #experienceWisdomQuote {
  color: transparent !important;
  -webkit-text-fill-color: transparent !important;
  background-image:
    linear-gradient(100deg, rgba(255,255,255,0) 36%, rgba(226,140,48,.90) 50%, rgba(255,255,255,0) 64%),
    radial-gradient(circle at 50% 38%, #c2620d 0%, #b1560a 28%, #a85207 55%, #8f4406 100%) !important;
  background-size: 300% 100%, 100% 100% !important;
  background-repeat: no-repeat, no-repeat !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  text-shadow: none !important;
}

/* Main Home Page names use the same WELCOME colour, not a separate accent. */
html body #legacy .name-accent {
  color: transparent !important;
  -webkit-text-fill-color: transparent !important;
  background-image:
    linear-gradient(100deg, rgba(255,255,255,0) 36%, rgba(226,140,48,.90) 50%, rgba(255,255,255,0) 64%),
    radial-gradient(circle at 50% 38%, #c2620d 0%, #b1560a 28%, #a85207 55%, #8f4406 100%) !important;
  background-size: 300% 100%, 100% 100% !important;
  background-repeat: no-repeat, no-repeat !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
}

/* Desktop/tablet: enlarge the Mandir evenly upward and downward from its
   current centre until its frame tracks the adjacent Home copy height.
   object-fit:contain preserves the photograph's natural proportions. */
@media (min-width: 901px) {
  html body #legacy .heritage-outer-parity--home .hero-layout {
    align-items: stretch !important;
  }
  html body #legacy .heritage-outer-parity--home .hero-copy {
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
  }
  html body #legacy .portrait-card.portrait-card-fullimg {
    height: 100% !important;
    min-height: 0 !important;
    align-self: stretch !important;
    display: flex !important;
  }
  html body #legacy .portrait-card.portrait-card-fullimg picture {
    flex: 1 1 auto !important;
    width: 100% !important;
    height: 100% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
  }
  html body #legacy .portrait-card.portrait-card-fullimg .temple-img-full {
    width: 100% !important;
    height: 100% !important;
    max-height: none !important;
    aspect-ratio: auto !important;
    object-fit: contain !important;
    object-position: center center !important;
  }
}

/* Mobile returns the Mandir to natural-height flow and keeps it proportional. */
@media (max-width: 900px) {
  html body #legacy .portrait-card.portrait-card-fullimg,
  html body #legacy .portrait-card.portrait-card-fullimg picture {
    height: auto !important;
  }
  html body #legacy .portrait-card.portrait-card-fullimg .temple-img-full {
    width: 100% !important;
    height: auto !important;
    aspect-ratio: 1408 / 768 !important;
    object-fit: contain !important;
  }
}

@media (max-width: 1024px) {
  html body #threshold .ceremonial-ganapati-image,
  html body .farewell .ceremonial-ganapati-image {
    max-width: min(100%, 118px) !important;
    max-height: 118px !important;
  }
}
@media (max-width: 700px) {
  html body #threshold .ceremonial-ganapati-image,
  html body .farewell .ceremonial-ganapati-image {
    max-width: min(100%, 102px) !important;
    max-height: 102px !important;
  }
}
@media (max-width: 430px) {
  html body #threshold .ceremonial-ganapati-image,
  html body .farewell .ceremonial-ganapati-image {
    max-width: min(100%, 90px) !important;
    max-height: 90px !important;
  }
}

/* ======================================================================
   v59 — FOUNDATIONAL LEGACY OVERLAP + ULTRA-FAST GESTURE RESPONSE
   ====================================================================== */

/* The compact v55 pass had reduced the coverflow top padding while the
   44px heritage ornament still occupied that same space. Reserve a distinct
   ornament lane so the Previous / counter / Next controls never overlap it. */
html body #foundation .foundation-coverflow {
  padding-top: 42px !important;
}
html body #foundation .foundation-coverflow::before {
  top: 1px !important;
  width: min(620px, 82%) !important;
  height: 30px !important;
  opacity: .70 !important;
  z-index: 1 !important;
}
html body #foundation .foundation-coverflow-toolbar {
  position: relative !important;
  z-index: 5 !important;
  margin-top: 0 !important;
  margin-bottom: 7px !important;
}
html body #foundation .foundation-coverflow-controls {
  position: relative !important;
  z-index: 6 !important;
  margin-top: 0 !important;
}
html body #foundation .foundation-coverflow-dots {
  margin-top: 8px !important;
}
html body #foundation .foundation-coverflow-hint {
  margin-top: 5px !important;
  margin-bottom: 8px !important;
}

/* Immediate visual response. 48ms is long enough to remain smooth on 60/90/
   120Hz screens but short enough to feel effectively instantaneous. */
html body #foundation .foundation-highlights > span {
  transition:
    transform .048s cubic-bezier(.20,.88,.28,1),
    opacity .042s linear,
    border-color .055s ease,
    box-shadow .055s ease,
    filter .055s ease !important;
  will-change: transform, opacity !important;
  contain: layout style paint !important;
  -webkit-tap-highlight-color: transparent !important;
}
html body #foundation .foundation-highlights {
  transform: translateZ(0) !important;
  backface-visibility: hidden !important;
  -webkit-backface-visibility: hidden !important;
}
html body #foundation .foundation-coverflow-stage {
  touch-action: pan-y pinch-zoom !important;
  overscroll-behavior-x: contain !important;
}
html body #foundation .foundation-coverflow-dot::before {
  transition:
    width .045s cubic-bezier(.20,.88,.28,1),
    height .045s cubic-bezier(.20,.88,.28,1),
    transform .045s cubic-bezier(.20,.88,.28,1),
    background .05s ease,
    border-color .05s ease,
    color .05s ease !important;
}
html body #foundation .foundation-coverflow-nav {
  touch-action: manipulation !important;
}

@media (max-width: 980px) {
  html body #foundation .foundation-coverflow {
    padding-top: 36px !important;
  }
  html body #foundation .foundation-coverflow::before {
    width: min(520px, 84%) !important;
    height: 26px !important;
  }
}

@media (max-width: 620px) {
  html body #foundation .foundation-coverflow {
    padding-top: 31px !important;
  }
  html body #foundation .foundation-coverflow::before {
    width: min(360px, 86%) !important;
    height: 22px !important;
  }
  html body #foundation .foundation-coverflow-toolbar {
    margin-bottom: 5px !important;
  }
  html body #foundation .foundation-coverflow-dots {
    margin-top: 6px !important;
  }
  html body #foundation .foundation-coverflow-hint {
    margin-top: 4px !important;
    margin-bottom: 6px !important;
  }
}


/* ======================================================================
   v60 — MOMENTS PRESERVED: FRAME-EDGE PHOTO NAVIGATION
   ====================================================================== */

/* Keep the live Previous/Next controls on the actual photograph frame rather
   than inside the dark image stage. This makes them unmistakable on portrait,
   landscape and letterboxed photographs while retaining the same gallery state. */
html body #moments .gv-frame {
  position: relative !important;
  overflow: visible !important;
}

html body #moments .gv-frame > .gv-nav.gv-nav--frame {
  position: absolute !important;
  top: 50% !important;
  z-index: 20 !important;
  width: clamp(46px, 3.4vw, 54px) !important;
  height: clamp(46px, 3.4vw, 54px) !important;
  min-width: 46px !important;
  min-height: 46px !important;
  margin: 0 !important;
  padding: 0 !important;
  display: grid !important;
  place-items: center !important;
  border-radius: 50% !important;
  opacity: .98 !important;
  visibility: visible !important;
  pointer-events: auto !important;
  touch-action: manipulation !important;
  -webkit-tap-highlight-color: transparent !important;
  transform: translateY(-50%) !important;
  font-size: clamp(21px, 1.8vw, 27px) !important;
  line-height: 1 !important;
  box-shadow:
    inset 0 2px 0 rgba(255, 252, 220, .92),
    inset 0 -3px 5px rgba(105, 55, 0, .26),
    0 8px 20px rgba(75, 39, 0, .30),
    0 0 18px rgba(255, 215, 0, .38) !important;
}

html body #moments .gv-frame > #galleryPrev.gv-nav--frame {
  left: clamp(4px, 1.25vw, 16px) !important;
  right: auto !important;
}

html body #moments .gv-frame > #galleryNext.gv-nav--frame {
  right: clamp(4px, 1.25vw, 16px) !important;
  left: auto !important;
}

html body #moments .gv-frame > .gv-nav.gv-nav--frame:hover {
  transform: translateY(-50%) scale(1.08) !important;
}

html body #moments .gv-frame > .gv-nav.gv-nav--frame:active {
  transform: translateY(-50%) scale(.94) !important;
  transition-duration: .045s !important;
}

html body #moments .gv-frame > .gv-nav.gv-nav--frame:focus-visible {
  outline: 3px solid rgba(104, 45, 34, .92) !important;
  outline-offset: 3px !important;
}

/* Preserve native hidden semantics if a filtered collection ever contains
   only one photograph. */
html body #moments .gv-frame > .gv-nav.gv-nav--frame[hidden] {
  display: none !important;
}

@media (max-width: 720px) {
  html body #moments .gv-frame > .gv-nav.gv-nav--frame {
    width: 44px !important;
    height: 44px !important;
    min-width: 44px !important;
    min-height: 44px !important;
    font-size: 20px !important;
  }
  html body #moments .gv-frame > #galleryPrev.gv-nav--frame {
    left: 2px !important;
  }
  html body #moments .gv-frame > #galleryNext.gv-nav--frame {
    right: 2px !important;
  }
}

@media (max-width: 380px) {
  html body #moments .gv-frame {
    padding-left: 7px !important;
    padding-right: 7px !important;
  }
  html body #moments .gv-frame > .gv-nav.gv-nav--frame {
    width: 40px !important;
    height: 40px !important;
    min-width: 40px !important;
    min-height: 40px !important;
    font-size: 18px !important;
  }
}

/* ======================================================================
   v61 — MOMENTS PRESERVED: ARROWS BESIDE THE PHOTO FRAME
   ====================================================================== */

/* The navigation buttons are siblings of the photograph frame now.  The
   frame remains the same visual object; the arrows live in their own side
   columns so they never cover the photograph, mat, border or corner art. */
html body #moments .gallery-viewer {
  width: 100% !important;
  max-width: 1000px !important;
}

html body #moments .gv-frame-shell {
  display: grid !important;
  grid-template-columns: auto minmax(0, 1fr) auto !important;
  align-items: center !important;
  column-gap: clamp(10px, 1.35vw, 18px) !important;
  width: 100% !important;
  max-width: 1000px !important;
  margin-inline: auto !important;
  box-sizing: border-box !important;
}

html body #moments .gv-frame-shell > .gv-frame {
  grid-column: 2 !important;
  width: 100% !important;
  max-width: 860px !important;
  min-width: 0 !important;
  margin: 0 auto !important;
  overflow: visible !important;
}

html body #moments .gv-frame-shell > .gv-nav.gv-nav--outside {
  position: relative !important;
  inset: auto !important;
  top: auto !important;
  left: auto !important;
  right: auto !important;
  z-index: 20 !important;
  width: clamp(46px, 3.4vw, 54px) !important;
  height: clamp(46px, 3.4vw, 54px) !important;
  min-width: 46px !important;
  min-height: 46px !important;
  margin: 0 !important;
  padding: 0 !important;
  display: grid !important;
  place-items: center !important;
  justify-self: center !important;
  border-radius: 50% !important;
  opacity: .98 !important;
  visibility: visible !important;
  pointer-events: auto !important;
  touch-action: manipulation !important;
  -webkit-tap-highlight-color: transparent !important;
  transform: none !important;
  font-size: clamp(21px, 1.8vw, 27px) !important;
  line-height: 1 !important;
  box-shadow:
    inset 0 2px 0 rgba(255, 252, 220, .92),
    inset 0 -3px 5px rgba(105, 55, 0, .26),
    0 8px 20px rgba(75, 39, 0, .30),
    0 0 18px rgba(255, 215, 0, .38) !important;
}

html body #moments .gv-frame-shell > #galleryPrev.gv-nav--outside {
  grid-column: 1 !important;
}
html body #moments .gv-frame-shell > #galleryNext.gv-nav--outside {
  grid-column: 3 !important;
}

html body #moments .gv-frame-shell > .gv-nav.gv-nav--outside:hover {
  transform: scale(1.08) !important;
}
html body #moments .gv-frame-shell > .gv-nav.gv-nav--outside:active {
  transform: scale(.94) !important;
  transition-duration: .045s !important;
}
html body #moments .gv-frame-shell > .gv-nav.gv-nav--outside:focus-visible {
  outline: 3px solid rgba(104, 45, 34, .92) !important;
  outline-offset: 3px !important;
}
html body #moments .gv-frame-shell > .gv-nav.gv-nav--outside[hidden] {
  display: none !important;
}

/* Preserve the same 'arrows beside the frame' relationship in theatre and
   full-screen modes. The frame can grow, while the arrow columns remain
   outside it. */
html body #moments .gallery-viewer.is-theatre .gv-frame-shell,
html body #moments .gallery-viewer:fullscreen .gv-frame-shell,
html body #moments .gallery-viewer.is-fullscreen-fallback .gv-frame-shell {
  max-width: 1410px !important;
}
html body #moments .gallery-viewer.is-theatre .gv-frame-shell > .gv-frame,
html body #moments .gallery-viewer:fullscreen .gv-frame-shell > .gv-frame,
html body #moments .gallery-viewer.is-fullscreen-fallback .gv-frame-shell > .gv-frame {
  max-width: 1280px !important;
}

@media (max-width: 720px) {
  html body #moments .gallery-viewer {
    max-width: 100% !important;
  }
  html body #moments .gv-frame-shell {
    grid-template-columns: 42px minmax(0, 1fr) 42px !important;
    column-gap: 6px !important;
    max-width: 100% !important;
  }
  html body #moments .gv-frame-shell > .gv-nav.gv-nav--outside {
    width: 42px !important;
    height: 42px !important;
    min-width: 42px !important;
    min-height: 42px !important;
    font-size: 19px !important;
  }
  html body #moments .gv-frame-shell > .gv-frame {
    padding: 9px !important;
  }
}

@media (max-width: 480px) {
  html body #moments .gv-frame-shell {
    grid-template-columns: 36px minmax(0, 1fr) 36px !important;
    column-gap: 5px !important;
  }
  html body #moments .gv-frame-shell > .gv-nav.gv-nav--outside {
    width: 36px !important;
    height: 36px !important;
    min-width: 36px !important;
    min-height: 36px !important;
    font-size: 17px !important;
  }
  html body #moments .gv-frame-shell > .gv-frame {
    padding: 7px !important;
  }
}

@media (max-width: 350px) {
  html body #moments .gv-frame-shell {
    grid-template-columns: 32px minmax(0, 1fr) 32px !important;
    column-gap: 4px !important;
  }
  html body #moments .gv-frame-shell > .gv-nav.gv-nav--outside {
    width: 32px !important;
    height: 32px !important;
    min-width: 32px !important;
    min-height: 32px !important;
    font-size: 15px !important;
  }
}

/* ======================================================================
   v65 — READABILITY PASS: VIRTUES, ACADEMIC, GUEST TRIBUTE + LARGER GANAPATI
   ====================================================================== */

/* Shared readability target: these three heritage workspaces are content-rich,
   so body copy remains comfortably readable without forcing desktop-sized type
   onto narrow phones. */
html body #virtues .virtue-filmstrip-label,
html body #academic .academic-filmstrip-label {
  font-size: clamp(14.5px, 1.12vw, 16px) !important;
  line-height: 1.2 !important;
  letter-spacing: .055em !important;
}

/* Virtues & Wisdom — larger stage copy, names, roles and guidance. */
html body #virtues .virtue-stage-kicker {
  font-size: clamp(13.5px, 1vw, 15px) !important;
}
html body #virtues .virtue-stage-head h4 {
  font-size: clamp(28px, 3vw, 38px) !important;
}
html body #virtues .virtue-stage-head #virtueCurrentIntro {
  font-size: clamp(18.5px, 1.45vw, 21px) !important;
  line-height: 1.55 !important;
}
html body #virtues .virtue-stage .parent-top h4 {
  font-size: clamp(21px, 1.6vw, 24px) !important;
  line-height: 1.3 !important;
}
html body #virtues .virtue-stage .parent-role {
  font-size: clamp(17.5px, 1.35vw, 20px) !important;
  line-height: 1.42 !important;
}
html body #virtues .virtue-guided-stepper .virtue-panel,
html body #virtues .virtue-guided-stepper .virtue-panel p {
  font-size: clamp(18px, 1.28vw, 20px) !important;
  line-height: 1.62 !important;
}
html body #virtues .virtue-filmstage-hint {
  font-size: clamp(15px, 1.05vw, 17px) !important;
  line-height: 1.55 !important;
}

/* Academic Triumph — keep visual parity with Virtues while increasing reading comfort. */
html body #academic .academic-stage-kicker {
  font-size: clamp(13.5px, 1vw, 15px) !important;
}
html body #academic .academic-stage-head h4 {
  font-size: clamp(28px, 3vw, 38px) !important;
  line-height: 1.08 !important;
}
html body #academic .academic-stage-head #academicStageNote {
  font-size: clamp(18px, 1.4vw, 21px) !important;
  line-height: 1.55 !important;
}
html body #academic .academic-card h4 {
  font-size: clamp(21px, 1.55vw, 24px) !important;
  line-height: 1.3 !important;
}
html body #academic .academic-card > p,
html body #academic .academic-card .academic-detail,
html body #academic .academic-card .academic-detail p,
html body #academic .academic-card .academic-detail li {
  font-size: clamp(18px, 1.25vw, 20px) !important;
  line-height: 1.6 !important;
}
html body #academic .academic-filmstage-hint {
  font-size: clamp(15px, 1.05vw, 17px) !important;
  line-height: 1.55 !important;
}

/* Guest Tribute Window — increase every user-facing instructional/form text
   inside the outer heritage tile, while preserving the compact journey map. */
html body #guest-tribute .guest-tribute-combined {
  font-size: clamp(16px, 1.18vw, 18px) !important;
}
html body #guest-tribute .guided-progress-title > span {
  font-size: clamp(16px, 1.2vw, 18px) !important;
  line-height: 1.25 !important;
}
html body #guest-tribute .guided-progress-title small {
  font-size: clamp(14px, 1vw, 16px) !important;
  line-height: 1.45 !important;
}
html body #guest-tribute .guided-step > em {
  font-size: clamp(14px, 1.05vw, 16px) !important;
  line-height: 1.25 !important;
}
html body #guest-tribute .guided-step-requirement,
html body #guest-tribute .journey-stage-requirement {
  font-size: clamp(10.5px, .82vw, 12px) !important;
  line-height: 1.15 !important;
}
html body #guest-tribute .guided-metro-station em {
  font-size: clamp(12px, .9vw, 14px) !important;
  line-height: 1.22 !important;
}
html body #guest-tribute .guided-metro-station small {
  font-size: clamp(9.5px, .72vw, 11px) !important;
}
html body #guest-tribute .journey-stage-bar-title {
  font-size: clamp(15.5px, 1.15vw, 18px) !important;
  line-height: 1.25 !important;
}
html body #guest-tribute .embedded-experience-head h4,
html body #guest-tribute .journey-stage-intro h4,
html body #guest-tribute .media-head h4,
html body #guest-tribute .preview-stage-title h4 {
  font-size: clamp(19px, 1.55vw, 23px) !important;
  line-height: 1.25 !important;
}
html body #guest-tribute .embedded-experience-head p,
html body #guest-tribute .journey-stage-intro p,
html body #guest-tribute .media-head p,
html body #guest-tribute .experience-carousel--embedded .experience-card p,
html body #guest-tribute .moderation-note,
html body #guest-tribute .submit-stage-note,
html body #guest-tribute #submitGuidance,
html body #guest-tribute #previewMessage {
  font-size: clamp(15.5px, 1.12vw, 17.5px) !important;
  line-height: 1.55 !important;
}
html body #guest-tribute .experience-carousel--embedded .experience-card h5 {
  font-size: clamp(17px, 1.3vw, 20px) !important;
  line-height: 1.28 !important;
}
html body #guest-tribute label,
html body #guest-tribute legend,
html body #guest-tribute .radio-pill,
html body #guest-tribute .embedded-choice-note,
html body #guest-tribute .optional-chip,
html body #guest-tribute .preview-status-chip {
  font-size: clamp(15px, 1.05vw, 17px) !important;
  line-height: 1.35 !important;
}
html body #guest-tribute input[type="text"],
html body #guest-tribute input[type="date"],
html body #guest-tribute input[type="search"],
html body #guest-tribute select,
html body #guest-tribute textarea {
  font-size: clamp(16px, 1.08vw, 18px) !important;
  line-height: 1.45 !important;
}
html body #guest-tribute .upload-tile em,
html body #guest-tribute .preview-files > span {
  font-size: clamp(13px, .95vw, 15px) !important;
  line-height: 1.35 !important;
}
html body #guest-tribute .tracker-line span,
html body #guest-tribute .tracker-line em {
  font-size: clamp(11.5px, .82vw, 13.5px) !important;
  line-height: 1.3 !important;
}

/* Larger Ganapati on both opening and farewell screens, exactly matched. */
html body #threshold .ceremonial-ganapati,
html body .farewell .ceremonial-ganapati {
  height: clamp(128px, 16vh, 172px) !important;
}
html body #threshold .ceremonial-ganapati-image,
html body .farewell .ceremonial-ganapati-image {
  max-width: min(100%, 172px) !important;
  max-height: 172px !important;
  aspect-ratio: 320 / 427 !important;
}

@media (max-width: 1024px) {
  html body #virtues .virtue-guided-stepper .virtue-panel,
  html body #virtues .virtue-guided-stepper .virtue-panel p,
  html body #academic .academic-card > p,
  html body #academic .academic-card .academic-detail,
  html body #academic .academic-card .academic-detail p,
  html body #academic .academic-card .academic-detail li {
    font-size: clamp(17.5px, 1.85vw, 19px) !important;
  }
  html body #threshold .ceremonial-ganapati,
  html body .farewell .ceremonial-ganapati {
    height: clamp(122px, 14vh, 150px) !important;
  }
  html body #threshold .ceremonial-ganapati-image,
  html body .farewell .ceremonial-ganapati-image {
    max-width: min(100%, 150px) !important;
    max-height: 150px !important;
  }
}

@media (max-width: 700px) {
  html body #virtues .virtue-filmstrip-label,
  html body #academic .academic-filmstrip-label {
    font-size: 14.5px !important;
  }
  html body #virtues .virtue-stage-head #virtueCurrentIntro,
  html body #academic .academic-stage-head #academicStageNote {
    font-size: 17px !important;
  }
  html body #virtues .virtue-stage .parent-top h4,
  html body #academic .academic-card h4 {
    font-size: 20px !important;
  }
  html body #virtues .virtue-stage .parent-role {
    font-size: 17px !important;
  }
  html body #virtues .virtue-guided-stepper .virtue-panel,
  html body #virtues .virtue-guided-stepper .virtue-panel p,
  html body #academic .academic-card > p,
  html body #academic .academic-card .academic-detail,
  html body #academic .academic-card .academic-detail p,
  html body #academic .academic-card .academic-detail li {
    font-size: 16.5px !important;
    line-height: 1.58 !important;
  }
  html body #guest-tribute .guided-progress-title > span { font-size: 15.5px !important; }
  html body #guest-tribute .guided-progress-title small { font-size: 13.5px !important; }
  html body #guest-tribute .guided-step > em { font-size: 13.5px !important; }
  html body #guest-tribute .journey-stage-bar-title { font-size: 15.5px !important; }
  html body #guest-tribute .embedded-experience-head h4,
  html body #guest-tribute .journey-stage-intro h4,
  html body #guest-tribute .media-head h4,
  html body #guest-tribute .preview-stage-title h4 { font-size: 18px !important; }
  html body #guest-tribute .embedded-experience-head p,
  html body #guest-tribute .journey-stage-intro p,
  html body #guest-tribute .media-head p,
  html body #guest-tribute .experience-carousel--embedded .experience-card p,
  html body #guest-tribute .moderation-note,
  html body #guest-tribute .submit-stage-note,
  html body #guest-tribute #submitGuidance,
  html body #guest-tribute #previewMessage { font-size: 15.5px !important; }
  html body #guest-tribute .experience-carousel--embedded .experience-card h5 { font-size: 17px !important; }
  html body #guest-tribute label,
  html body #guest-tribute legend,
  html body #guest-tribute .radio-pill { font-size: 15px !important; }
  html body #guest-tribute input[type="text"],
  html body #guest-tribute input[type="date"],
  html body #guest-tribute input[type="search"],
  html body #guest-tribute select,
  html body #guest-tribute textarea { font-size: 16px !important; }
  html body #threshold .ceremonial-ganapati,
  html body .farewell .ceremonial-ganapati {
    height: clamp(112px, 13vh, 132px) !important;
  }
  html body #threshold .ceremonial-ganapati-image,
  html body .farewell .ceremonial-ganapati-image {
    max-width: min(100%, 132px) !important;
    max-height: 132px !important;
  }
}

@media (max-width: 430px) {
  html body #virtues .virtue-guided-stepper .virtue-panel,
  html body #virtues .virtue-guided-stepper .virtue-panel p,
  html body #academic .academic-card > p,
  html body #academic .academic-card .academic-detail,
  html body #academic .academic-card .academic-detail p,
  html body #academic .academic-card .academic-detail li {
    font-size: 16px !important;
    line-height: 1.56 !important;
  }
  html body #guest-tribute .guided-step > em { font-size: 13px !important; }
  html body #guest-tribute .guided-step-requirement,
  html body #guest-tribute .journey-stage-requirement { font-size: 10px !important; }
  html body #guest-tribute .guided-metro-station em { font-size: 11.5px !important; }
  html body #guest-tribute .guided-metro-station small { font-size: 9px !important; }
  html body #guest-tribute .upload-tile em,
  html body #guest-tribute .preview-files > span { font-size: 12.5px !important; }
  html body #guest-tribute .tracker-line span,
  html body #guest-tribute .tracker-line em { font-size: 11px !important; }
  html body #threshold .ceremonial-ganapati,
  html body .farewell .ceremonial-ganapati {
    height: 112px !important;
  }
  html body #threshold .ceremonial-ganapati-image,
  html body .farewell .ceremonial-ganapati-image {
    max-width: min(100%, 112px) !important;
    max-height: 112px !important;
  }
}

/* v65 completeness: buttons and publication table text inside the same tiles. */
html body #academic .expand-pub-table-btn,
html body #academic .pub-cite,
html body #guest-tribute .btn,
html body #guest-tribute button:not(.modal-close) {
  font-size: clamp(15px, 1.02vw, 17px) !important;
  line-height: 1.25 !important;
}
html body #academic .pub-table,
html body #academic .pub-table th,
html body #academic .pub-table td {
  font-size: clamp(15.5px, 1.05vw, 17px) !important;
  line-height: 1.45 !important;
}
@media (max-width: 700px) {
  html body #academic .expand-pub-table-btn,
  html body #academic .pub-cite,
  html body #guest-tribute .btn,
  html body #guest-tribute button:not(.modal-close) {
    font-size: 15px !important;
  }
  html body #academic .pub-table,
  html body #academic .pub-table th,
  html body #academic .pub-table td {
    font-size: 15px !important;
  }
}

/* ======================================================================
   v66 — NAVIGATION LABEL READABILITY ONLY
   Increase only menu text size; preserve all existing geometry, icons,
   animation, hover/active effects and responsive navigation behaviour.
   ====================================================================== */
@media (min-width: 1400px) {
  html body .heritage-fusion-nav .nav-links > :is(a, button.nav-exit-btn),
  html body .nav-plaque .nav-links > :is(a, button.nav-exit-btn) {
    font-size: clamp(13.5px, .72vw, 14.5px) !important;
  }
}

@media (min-width: 1101px) and (max-width: 1399px) {
  html body .heritage-fusion-nav .nav-links > :is(a, button.nav-exit-btn),
  html body .nav-plaque .nav-links > :is(a, button.nav-exit-btn) {
    font-size: 11.5px !important;
  }
}

@media (max-width: 1100px) {
  html body .heritage-fusion-nav .nav-links > :is(a, button.nav-exit-btn),
  html body .nav-plaque .nav-links > :is(a, button.nav-exit-btn) {
    font-size: 14.25px !important;
  }
}

@media (max-width: 480px) {
  html body .heritage-fusion-nav .nav-links > :is(a, button.nav-exit-btn),
  html body .nav-plaque .nav-links > :is(a, button.nav-exit-btn) {
    font-size: 14px !important;
  }
}

/* ======================================================================
   v68 — FAST COVERFLOW/FILMSTAGES + FOUR-STAGE GUEST CONTRIBUTION JOURNEY
   ====================================================================== */

/* Foundational Legacy: the state changes immediately in JS; keep the visual
   interpolation extremely short and GPU-friendly so the deck feels instant
   without snapping harshly. */
html body #foundation .foundation-highlights > span {
  transition:
    transform 55ms cubic-bezier(.18,.92,.28,1),
    opacity 46ms linear,
    border-color 50ms ease,
    box-shadow 50ms ease,
    filter 50ms ease !important;
  will-change: transform, opacity !important;
  transform-style: preserve-3d !important;
  -webkit-tap-highlight-color: transparent !important;
}
html body #foundation .foundation-coverflow-dot::before {
  transition: width 30ms ease, height 30ms ease, transform 30ms ease,
              background 32ms ease, border-color 32ms ease, color 32ms ease !important;
}
html body #foundation .foundation-coverflow-nav,
html body #foundation .foundation-coverflow-dot,
html body #foundation .foundation-highlights > span {
  touch-action: manipulation !important;
}

/* Instructions now live ABOVE each filmstrip, exactly where a visitor needs
   them before interacting. */
html body #virtues .virtue-filmstrip-instruction,
html body #academic .academic-filmstrip-instruction {
  width: 100% !important;
  margin: 2px auto 12px !important;
  color: #765c3c !important;
  font-family: var(--font-display) !important;
  font-size: clamp(15px, 1.05vw, 17px) !important;
  font-style: italic !important;
  line-height: 1.5 !important;
  text-align: center !important;
}

/* Virtues + Academic: content is replaced synchronously; these properties
   keep pointer gestures native vertically while allowing the fast horizontal
   swipe path in app.js. */
html body #virtues #virtueStepStage,
html body #academic #tabPanel {
  touch-action: pan-y pinch-zoom !important;
  overscroll-behavior-x: contain !important;
  will-change: opacity, transform !important;
  -webkit-tap-highlight-color: transparent !important;
}
html body #virtues .virtue-filmstrip-tab,
html body #academic .academic-filmstrip-tab {
  touch-action: manipulation !important;
  -webkit-tap-highlight-color: transparent !important;
}
/* Old long stage classes must never introduce an extra visible wait. */
html body #virtues .virtue-step-enter,
html body #virtues .virtue-step-leave,
html body #academic .academic-stage-enter {
  animation-duration: 80ms !important;
  transition-duration: 80ms !important;
}

/* ----------------------------------------------------------------------
   Guest Tribute Window — four-stage Embroidery Hoops + Quarter Ring.
   The existing Virtues-style outer heritage frame is intentionally untouched.
   ---------------------------------------------------------------------- */
html body #guest-tribute .guest-journey-v68 {
  --journey-green: #3f7f58;
  --journey-gold: #c49a3b;
  --journey-wine: #741728;
  margin-bottom: clamp(18px, 2.2vw, 26px) !important;
}
html body #guest-tribute .guest-journey-v68 .guided-progress-title {
  margin-bottom: clamp(18px, 2vw, 24px) !important;
}

/* Four small embroidery hoops. */
html body #guest-tribute .journey-hoop-row {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  align-items: start !important;
  gap: clamp(16px, 2vw, 28px) !important;
  margin: 0 0 clamp(26px, 3vw, 36px) !important;
  padding: 0 clamp(4px, 1vw, 12px) !important;
}
html body #guest-tribute .journey-hoop {
  min-width: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  text-align: center !important;
  gap: 9px !important;
  color: #5b452b !important;
}
html body #guest-tribute .journey-hoop-circle {
  position: relative !important;
  width: clamp(78px, 7.5vw, 104px) !important;
  aspect-ratio: 1 !important;
  display: grid !important;
  place-items: center !important;
  border-radius: 50% !important;
  border: clamp(7px, .65vw, 10px) solid var(--journey-gold) !important;
  background:
    radial-gradient(circle at 50% 42%, #fffdf6 0 60%, #f3e8c8 61% 100%) !important;
  box-shadow:
    inset 0 0 0 3px rgba(255,255,255,.88),
    inset 0 0 0 5px rgba(190,149,58,.22),
    0 8px 18px rgba(92,65,23,.09) !important;
  transition: border-color 120ms ease, transform 120ms ease, box-shadow 120ms ease, background 120ms ease !important;
}
html body #guest-tribute .journey-hoop-circle::before {
  content: "" !important;
  position: absolute !important;
  inset: -5px !important;
  border: 1px solid rgba(147,105,39,.32) !important;
  border-radius: 50% !important;
  pointer-events: none !important;
}
html body #guest-tribute .journey-hoop-circle b {
  color: #8d6427 !important;
  font-family: var(--font-display) !important;
  font-size: clamp(23px, 2vw, 30px) !important;
  font-weight: 500 !important;
  line-height: 1 !important;
}
html body #guest-tribute .journey-hoop > em {
  color: #5c4128 !important;
  font-family: var(--font-display) !important;
  font-size: clamp(15px, 1.25vw, 18px) !important;
  font-style: normal !important;
  font-weight: 600 !important;
  line-height: 1.25 !important;
}
html body #guest-tribute .journey-hoop .guided-step-requirement {
  margin-top: 1px !important;
}
html body #guest-tribute .journey-hoop.is-done .journey-hoop-circle {
  border-color: var(--journey-green) !important;
  background: radial-gradient(circle at 50% 42%, #fffdf6 0 59%, #e0eddf 60% 100%) !important;
  box-shadow: inset 0 0 0 3px rgba(255,255,255,.9), inset 0 0 0 5px rgba(63,127,88,.16), 0 8px 18px rgba(50,101,69,.12) !important;
}
html body #guest-tribute .journey-hoop.is-done .journey-hoop-circle b {
  color: var(--journey-green) !important;
  font-weight: 700 !important;
}
html body #guest-tribute .journey-hoop.is-current .journey-hoop-circle {
  border-color: var(--journey-wine) !important;
  transform: translateY(-2px) scale(1.025) !important;
  box-shadow: inset 0 0 0 3px rgba(255,255,255,.9), inset 0 0 0 5px rgba(196,154,59,.22), 0 0 0 5px rgba(116,23,40,.08), 0 10px 22px rgba(86,28,35,.14) !important;
}
html body #guest-tribute .journey-hoop.is-current > em { color: var(--journey-wine) !important; }

/* Quarter-ring + stage list. Each 90-degree quadrant is independently driven
   by --journey-q1...q4 from the same form state as the small hoops. */
html body #guest-tribute .journey-quarter-layout {
  display: grid !important;
  grid-template-columns: minmax(210px, 330px) minmax(0, 1fr) !important;
  align-items: center !important;
  gap: clamp(24px, 4vw, 56px) !important;
  width: min(100%, 930px) !important;
  margin: 0 auto !important;
  padding: clamp(18px, 2.4vw, 28px) !important;
  border: 1px solid rgba(189,150,70,.28) !important;
  border-radius: 20px !important;
  background: linear-gradient(145deg, rgba(255,253,244,.78), rgba(248,241,216,.58)) !important;
}
html body #guest-tribute .journey-quarter-ring {
  position: relative !important;
  width: min(100%, 290px) !important;
  aspect-ratio: 1 !important;
  justify-self: center !important;
  border-radius: 50% !important;
  background: conic-gradient(
    var(--journey-q1) 0deg 89deg,
    rgba(255,253,244,.92) 89deg 91deg,
    var(--journey-q2) 91deg 179deg,
    rgba(255,253,244,.92) 179deg 181deg,
    var(--journey-q3) 181deg 269deg,
    rgba(255,253,244,.92) 269deg 271deg,
    var(--journey-q4) 271deg 359deg,
    rgba(255,253,244,.92) 359deg 360deg
  ) !important;
  box-shadow: 0 12px 28px rgba(89,64,25,.08) !important;
  transition: background 140ms ease !important;
}
html body #guest-tribute .journey-quarter-ring::before {
  content: "" !important;
  position: absolute !important;
  inset: 20% !important;
  border-radius: 50% !important;
  background: #fffdf4 !important;
  box-shadow: inset 0 0 0 2px rgba(190,153,73,.22) !important;
}
html body #guest-tribute .journey-quarter-core {
  position: absolute !important;
  inset: 20% !important;
  z-index: 1 !important;
  display: grid !important;
  place-content: center !important;
  text-align: center !important;
}
html body #guest-tribute .journey-quarter-core strong {
  color: var(--journey-wine) !important;
  font-family: var(--font-display) !important;
  font-size: clamp(34px, 4vw, 52px) !important;
  font-weight: 700 !important;
  line-height: 1 !important;
}
html body #guest-tribute .journey-quarter-core span {
  margin-top: 8px !important;
  color: #9b7539 !important;
  font-family: var(--font-display) !important;
  font-size: 12px !important;
  letter-spacing: .18em !important;
  text-transform: uppercase !important;
}
html body #guest-tribute .journey-quarter-list {
  min-width: 0 !important;
  display: grid !important;
  gap: 8px !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}
html body #guest-tribute .journey-quarter-list li {
  min-width: 0 !important;
  display: grid !important;
  grid-template-columns: 34px minmax(0, 1fr) !important;
  align-items: center !important;
  gap: 12px !important;
  padding: 11px 14px !important;
  border-radius: 12px !important;
  color: #5f482d !important;
  transition: background 110ms ease, color 110ms ease, transform 110ms ease !important;
}
html body #guest-tribute .journey-quarter-list li > span {
  color: #9b7438 !important;
  font: 600 15px/1 var(--font-display) !important;
}
html body #guest-tribute .journey-quarter-list li > em {
  min-width: 0 !important;
  font-family: var(--font-display) !important;
  font-size: clamp(15.5px, 1.35vw, 19px) !important;
  font-style: normal !important;
  line-height: 1.25 !important;
}
html body #guest-tribute .journey-quarter-list li.is-done {
  color: #315f42 !important;
  background: rgba(63,127,88,.08) !important;
}
html body #guest-tribute .journey-quarter-list li.is-done > span { color: var(--journey-green) !important; }
html body #guest-tribute .journey-quarter-list li.is-current {
  color: var(--journey-wine) !important;
  background: linear-gradient(90deg, rgba(243,221,159,.78), rgba(255,250,229,.46)) !important;
  transform: translateX(2px) !important;
}

/* Four actual form stages now mirror the journey order. */
html body #guest-tribute [data-stage-panel] {
  scroll-margin-top: 90px !important;
}
html body #guest-tribute .journey-details-advance {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 12px !important;
  flex-wrap: wrap !important;
  margin-top: 18px !important;
  padding-top: 16px !important;
  border-top: 1px solid rgba(185,145,64,.20) !important;
}
html body #guest-tribute .journey-details-advance small {
  max-width: 520px !important;
  color: #7b6447 !important;
  font-size: clamp(13px, 1vw, 15px) !important;
  line-height: 1.45 !important;
}
html body #guest-tribute .journey-submit-inline {
  margin-top: 20px !important;
  padding-top: 18px !important;
  border-top: 1px solid rgba(185,145,64,.24) !important;
}
html body #guest-tribute .journey-submit-inline .btn {
  min-height: 46px !important;
}

@media (max-width: 760px) {
  html body #virtues .virtue-filmstrip-instruction,
  html body #academic .academic-filmstrip-instruction {
    margin-bottom: 9px !important;
    padding-inline: 4px !important;
    font-size: 15px !important;
  }
  html body #guest-tribute .journey-hoop-row {
    grid-template-columns: repeat(4, minmax(132px, 1fr)) !important;
    overflow-x: auto !important;
    overscroll-behavior-x: contain !important;
    scroll-snap-type: x proximity !important;
    scrollbar-width: none !important;
    padding: 2px 4px 8px !important;
    margin-bottom: 18px !important;
  }
  html body #guest-tribute .journey-hoop-row::-webkit-scrollbar { display: none !important; }
  html body #guest-tribute .journey-hoop { scroll-snap-align: center !important; }
  html body #guest-tribute .journey-hoop-circle { width: 76px !important; }
  html body #guest-tribute .journey-quarter-layout {
    grid-template-columns: 1fr !important;
    gap: 18px !important;
    padding: 16px !important;
  }
  html body #guest-tribute .journey-quarter-ring { width: min(74vw, 250px) !important; }
  html body #guest-tribute .journey-quarter-list { width: 100% !important; }
}

@media (max-width: 480px) {
  html body #guest-tribute .guided-progress-title {
    align-items: flex-start !important;
    flex-direction: column !important;
    gap: 5px !important;
  }
  html body #guest-tribute .guided-progress-title small { text-align: left !important; }
  html body #guest-tribute .journey-hoop-row {
    grid-template-columns: repeat(4, 126px) !important;
    gap: 10px !important;
  }
  html body #guest-tribute .journey-hoop-circle { width: 68px !important; border-width: 6px !important; }
  html body #guest-tribute .journey-hoop > em { font-size: 14px !important; }
  html body #guest-tribute .journey-quarter-layout { padding: 13px 10px !important; border-radius: 16px !important; }
  html body #guest-tribute .journey-quarter-ring { width: min(76vw, 220px) !important; }
  html body #guest-tribute .journey-quarter-list li { padding: 10px 9px !important; grid-template-columns: 28px minmax(0,1fr) !important; gap: 8px !important; }
  html body #guest-tribute .journey-quarter-list li > em { font-size: 15px !important; }
  html body #guest-tribute .journey-details-advance { align-items: stretch !important; flex-direction: column !important; }
  html body #guest-tribute .journey-details-advance .btn { width: 100% !important; }
  html body #guest-tribute .journey-submit-inline .btn { width: 100% !important; }
}

/* ======================================================================
   v69 — INSTANT INTERACTION HOT PATHS + THANK-YOU / FOUNDATION POLISH
   ====================================================================== */

/* Foundation uses the exact shared outer heritage frame already used by the
   Main Home Page. The old Foundation shell becomes a transparent internal
   layout so there is only one visible outer tile. */
html body #foundation .heritage-outer-parity--foundation {
  width: min(100%, 1160px) !important;
  max-width: 1160px !important;
  overflow: visible !important;
}
html body #foundation .foundation-shell.foundation-shell--inner {
  display: grid !important;
  grid-template-columns: 190px minmax(0, 1fr) !important;
  align-items: start !important;
  gap: clamp(18px, 2vw, 24px) !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  overflow: visible !important;
}
html body #foundation .foundation-shell.foundation-shell--inner::before,
html body #foundation .foundation-shell.foundation-shell--inner::after {
  display: none !important;
  content: none !important;
}
html body #foundation .heritage-outer-parity--foundation .heritage-outer-ornament--top {
  margin-bottom: clamp(14px, 1.8vw, 20px) !important;
}
html body #foundation .heritage-outer-parity--foundation .heritage-outer-ornament--bottom {
  margin-top: clamp(14px, 1.8vw, 20px) !important;
}

/* Foundation interaction: compositor-only movement. Expensive filter and
   box-shadow interpolation is deliberately removed from the hot path. */
html body #foundation .foundation-coverflow-stage,
html body #foundation .foundation-highlights {
  -webkit-transform: translateZ(0) !important;
  transform: translateZ(0) !important;
}
html body #foundation .foundation-highlights > span {
  transition: transform 34ms cubic-bezier(.16,.92,.22,1), opacity 28ms linear !important;
  will-change: transform, opacity !important;
  backface-visibility: hidden !important;
  -webkit-backface-visibility: hidden !important;
  filter: none !important;
}
html body #foundation .foundation-highlights > span.is-active,
html body #foundation .foundation-highlights > span:active,
html body #foundation .foundation-highlights > span:not(.is-active):hover {
  filter: none !important;
}
html body #foundation .foundation-coverflow-dot::before {
  transition: transform 24ms ease, width 24ms ease, height 24ms ease,
              background 24ms ease, border-color 24ms ease !important;
}
html body #foundation .foundation-coverflow-nav {
  transition-duration: 35ms !important;
}

/* Virtues and Academic: immediate selected-tab response. Only a tiny visual
   interpolation remains, while content itself is already mounted in the DOM. */
html body #virtues .virtue-filmstrip-tab,
html body #academic .academic-filmstrip-tab {
  transition: transform 34ms cubic-bezier(.16,.92,.22,1),
              border-color 34ms linear, background 34ms linear,
              color 34ms linear, box-shadow 34ms linear !important;
}
html body #virtues .virtue-filmstrip-tab::after,
html body #virtues .virtue-filmstrip-icon,
html body #academic .academic-filmstrip-tab::after,
html body #academic .academic-filmstrip-icon {
  transition-duration: 34ms !important;
}
html body #virtues #virtueStepStage,
html body #academic #tabPanel {
  contain: layout style !important;
  will-change: opacity, transform !important;
}
html body #virtues .virtue-panel-view[hidden],
html body #academic .academic-topic-view[hidden] {
  display: none !important;
}
html body #virtues .virtue-panel-view,
html body #academic .academic-topic-view {
  animation: none !important;
  transition: none !important;
}
html body #virtues .virtue-step-enter,
html body #virtues .virtue-step-leave,
html body #academic .academic-stage-enter {
  animation: none !important;
  transition: none !important;
}

/* Guest Tribute: the two journey action buttons align left. All explanatory
   copy immediately surrounding Submit was removed from the markup. */
html body #guest-tribute .journey-details-advance,
html body #guest-tribute .journey-submit-inline {
  display: flex !important;
  align-items: flex-start !important;
  justify-content: flex-start !important;
  text-align: left !important;
  width: 100% !important;
}
html body #guest-tribute .journey-details-advance #detailsContinueBtn,
html body #guest-tribute .journey-submit-inline #tributeSubmitBtn {
  margin-left: 0 !important;
  margin-right: auto !important;
  width: auto !important;
  min-width: clamp(210px, 26vw, 310px) !important;
}

/* Thank You: scale the full typographic hierarchy to the same easy-reading
   level used by Admin Moderation while preserving every existing animation. */
html body #thanks .thanks-title {
  font-size: clamp(44px, 5vw, 68px) !important;
  line-height: 1.05 !important;
}
html body #thanks .thanks-exit-note {
  width: min(100%, 920px) !important;
  margin: 0 auto clamp(18px, 2.4vw, 28px) !important;
  color: #6d5432 !important;
  font-family: var(--font-display) !important;
  font-size: clamp(19px, 1.7vw, 25px) !important;
  font-style: italic !important;
  line-height: 1.55 !important;
  text-align: center !important;
  text-wrap: balance !important;
}
html body #thanks .thanks-message {
  font-size: clamp(19px, 1.55vw, 24px) !important;
  line-height: 1.65 !important;
}
html body #thanks .thanks-actions .btn {
  font-size: clamp(16px, 1.05vw, 18px) !important;
  min-height: 46px !important;
}

@media (max-width: 980px) {
  html body #foundation .foundation-shell.foundation-shell--inner {
    grid-template-columns: minmax(0,1fr) !important;
    gap: 14px !important;
  }
}
@media (max-width: 620px) {
  html body #foundation .foundation-shell.foundation-shell--inner {
    gap: 10px !important;
  }
  html body #guest-tribute .journey-details-advance #detailsContinueBtn,
  html body #guest-tribute .journey-submit-inline #tributeSubmitBtn {
    width: 100% !important;
    min-width: 0 !important;
  }
  html body #thanks .thanks-title {
    font-size: clamp(34px, 10vw, 46px) !important;
  }
  html body #thanks .thanks-exit-note {
    font-size: clamp(17px, 4.8vw, 20px) !important;
    line-height: 1.55 !important;
    margin-bottom: 18px !important;
  }
  html body #thanks .thanks-message {
    font-size: clamp(17px, 4.7vw, 20px) !important;
  }
  html body #thanks .thanks-actions .btn {
    font-size: 16px !important;
  }
}

/* ======================================================================
   v71 — FOUNDATION ALIGNMENT + ULTRA-FAST HOT PATHS + GUEST/THANKS POLISH
   ====================================================================== */

/* Foundational Legacy heading statement now shares the exact width axis of
   the white heritage tile below. It wraps naturally instead of using the
   older viewport-dependent single-line rule. */
html body #foundation .section-heading p.lede.lede-italic {
  display: block !important;
  width: min(100%, 1160px) !important;
  max-width: 1160px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: clamp(8px, 1vw, 14px) !important;
  padding-right: clamp(8px, 1vw, 14px) !important;
  white-space: normal !important;
  text-wrap: balance !important;
  text-align: center !important;
  text-align-last: center !important;
  box-sizing: border-box !important;
}

/* Keep the shared Main-Home-style outer frame, but remove the second
   traditional ornament pair belonging only to the inner Coverflow. This
   eliminates the duplicated ornament visible above/below the cards. */
html body #foundation .foundation-coverflow::before,
html body #foundation .foundation-coverflow::after {
  content: none !important;
  display: none !important;
  background: none !important;
}
html body #foundation .foundation-coverflow {
  padding-top: clamp(14px, 1.6vw, 20px) !important;
  padding-bottom: clamp(10px, 1.3vw, 16px) !important;
  margin-top: clamp(12px, 1.5vw, 18px) !important;
}

/* Hot path: only compositor-friendly transform/opacity interpolate. Static
   borders/shadows switch instantly, which removes the delayed visual tail. */
html body #foundation .foundation-highlights > span {
  transition: transform 42ms cubic-bezier(.2,.92,.26,1), opacity 32ms linear !important;
  transition-delay: 0ms !important;
  will-change: transform, opacity !important;
  contain: layout paint style !important;
  backface-visibility: hidden !important;
  -webkit-backface-visibility: hidden !important;
  -webkit-tap-highlight-color: transparent !important;
}
html body #foundation .foundation-coverflow-dot::before,
html body #foundation .foundation-coverflow-nav {
  transition-duration: 24ms !important;
  transition-delay: 0ms !important;
}

/* Virtue/Academic selection is intentionally immediate. Only the selected
   tile gets a tiny 24ms transform polish; text panels themselves never fade,
   wait or transition after a click/tap/swipe. */
html body #virtues .virtue-filmstrip-tab,
html body #academic .academic-filmstrip-tab {
  transition: transform 24ms cubic-bezier(.2,.92,.26,1) !important;
  transition-delay: 0ms !important;
}
html body #virtues .virtue-filmstrip-tab::after,
html body #virtues .virtue-filmstrip-icon,
html body #academic .academic-filmstrip-tab::after,
html body #academic .academic-filmstrip-icon {
  transition-duration: 20ms !important;
  transition-delay: 0ms !important;
}
html body #virtues #virtueStepStage,
html body #academic #tabPanel,
html body #virtues .virtue-panel-view,
html body #academic .academic-topic-view {
  animation: none !important;
  transition: none !important;
}

/* Guest Tribute — align the two Step-3 headings on one baseline and remove
   the Optional chip/prefix from Attach Memories while preserving the actual
   optional behavior. */
html body #guest-tribute .journey-stage--details .tribute-grid {
  align-items: start !important;
}
html body #guest-tribute .journey-stage--details .tribute-write,
html body #guest-tribute .journey-stage--details .tribute-media {
  align-self: start !important;
}
html body #guest-tribute .journey-stage--details .journey-stage-intro,
html body #guest-tribute .journey-stage--details .media-head {
  min-height: clamp(78px, 7vw, 96px) !important;
  margin-top: 0 !important;
  margin-bottom: clamp(12px, 1.4vw, 18px) !important;
  align-content: start !important;
}
html body #guest-tribute .journey-stage--details .journey-stage-intro h4,
html body #guest-tribute .journey-stage--details .media-head h4 {
  margin-top: 0 !important;
  line-height: 1.16 !important;
}
html body #guest-tribute .journey-stage--details .media-head .optional-chip {
  display: none !important;
}

/* The large quarter ring now lives directly below the optional-attachments
   callout, centered on the full Step-3 width. The redundant stage legend is
   gone from markup. */
html body #guest-tribute .journey-quarter-layout--below-attachments {
  display: grid !important;
  grid-template-columns: 1fr !important;
  place-items: center !important;
  width: min(100%, 560px) !important;
  margin: clamp(18px, 2.2vw, 28px) auto clamp(16px, 2vw, 24px) !important;
  padding: clamp(14px, 2vw, 20px) !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}
html body #guest-tribute .journey-quarter-layout--below-attachments .journey-quarter-ring {
  width: min(72vw, 290px) !important;
  margin: 0 auto !important;
}
html body #guest-tribute .journey-quarter-list {
  display: none !important;
}

/* Thank You text sits directly on the section background: remove only the
   white card surface/border/shadow. Explicit sparkles, divider, halo and
   ambient animations remain unchanged. */
html body #thanks .thanks-message-card {
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  overflow: visible !important;
  padding-left: clamp(8px, 2vw, 20px) !important;
  padding-right: clamp(8px, 2vw, 20px) !important;
}
html body #thanks .thanks-message-card::before,
html body #thanks .thanks-message-card::after {
  content: none !important;
  display: none !important;
}

/* Exact font-size parity with the Admin Moderation introductory lede. */
html body #thanks .thanks-exit-note {
  font-size: min(clamp(23px, 2.4vw, 27px), 1.39vw) !important;
  line-height: 1.7 !important;
}

/* Farewell gratitude line uses the same warm-gold text color as the opening
   Welcome dedication line. Word-arrival spans inherit this value. */
html body .farewell .farewell-line,
html body .farewell .farewell-line .aw {
  color: #ffc14a !important;
  -webkit-text-fill-color: #ffc14a !important;
}

@media (max-width: 900px) {
  html body #foundation .section-heading p.lede.lede-italic {
    width: min(100%, 1160px) !important;
    max-width: 1160px !important;
    font-size: clamp(18px, 3vw, 22px) !important;
  }
  html body #thanks .thanks-exit-note {
    font-size: clamp(18px, 3vw, 22px) !important;
  }
}

@media (max-width: 700px) {
  html body #guest-tribute .journey-stage--details .journey-stage-intro,
  html body #guest-tribute .journey-stage--details .media-head {
    min-height: 0 !important;
  }
  html body #guest-tribute .journey-quarter-layout--below-attachments {
    width: 100% !important;
    padding-inline: 0 !important;
  }
  html body #guest-tribute .journey-quarter-layout--below-attachments .journey-quarter-ring {
    width: min(70vw, 240px) !important;
  }
}

@media (max-width: 380px) {
  html body #guest-tribute .journey-quarter-layout--below-attachments .journey-quarter-ring {
    width: min(68vw, 210px) !important;
  }
}

/* ======================================================================
   v72 — GUEST BOOK ALIGNMENT, COMPACT JOURNEY PROGRESS, LIVING MEMORIES
   HEADING RULE, AND DARK-RED THANK-YOU TYPOGRAPHY
   ====================================================================== */

/* Guest Book: Grid / One by one stay on the left; date control sits at the
   opposite edge. The controls keep their existing button animations. */
html body #guestbook .tribute-tools {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  width: 100% !important;
  max-width: 1200px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  gap: clamp(8px, 1vw, 14px) !important;
}
html body #guestbook .tribute-tools .view-toggle {
  margin-left: 0 !important;
  margin-right: auto !important;
  justify-content: flex-start !important;
}
html body #guestbook .tribute-tools #calendarToggle {
  margin-left: auto !important;
  margin-right: 0 !important;
}
html body #guestbook .tribute-tools #dateClear {
  margin-left: 0 !important;
  margin-right: 0 !important;
}

/* Guest Tribute Step 3: OPTIONAL sits directly over the four attachment
   icons and uses the exact small-label typography used by Your Message. */
html body #guest-tribute .media-optional-label {
  display: block !important;
  width: 100% !important;
  margin: 2px auto 8px !important;
  color: #8a6a39 !important;
  font-size: .68rem !important;
  font-weight: 700 !important;
  line-height: 1.2 !important;
  text-transform: uppercase !important;
  letter-spacing: .04em !important;
  text-align: center !important;
}

/* The large ring's old Step-3 location is replaced by a simple Step-4 point. */
html body #guest-tribute .journey-next-step-marker {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 12px !important;
  width: min(100%, 520px) !important;
  margin: clamp(16px, 2vw, 24px) auto clamp(14px, 1.7vw, 20px) !important;
  padding: 8px 12px !important;
  color: #741728 !important;
  text-align: center !important;
}
html body #guest-tribute .journey-next-step-number {
  display: grid !important;
  place-items: center !important;
  flex: 0 0 auto !important;
  width: 42px !important;
  height: 42px !important;
  border: 2px solid #c49a3b !important;
  border-radius: 50% !important;
  background: #fff9e8 !important;
  color: #741728 !important;
  font-family: var(--font-serif) !important;
  font-size: 21px !important;
  font-weight: 700 !important;
  box-shadow: inset 0 0 0 4px rgba(196,154,59,.10) !important;
}
html body #guest-tribute .journey-next-step-marker strong {
  font-family: var(--font-serif) !important;
  font-size: clamp(16px, 1.25vw, 19px) !important;
  font-weight: 600 !important;
  line-height: 1.25 !important;
}

/* Contribution Journey now belongs immediately above the final submit row.
   Keep it visually compact so the action remains the focal point. */
html body #guest-tribute #certificatePreview .guest-journey-v68 {
  width: 100% !important;
  margin: clamp(18px, 2vw, 24px) 0 clamp(12px, 1.4vw, 16px) !important;
  padding: clamp(12px, 1.5vw, 17px) !important;
  border-radius: 16px !important;
}
html body #guest-tribute #certificatePreview .guided-progress-title {
  margin-bottom: 10px !important;
}
html body #guest-tribute #certificatePreview .journey-hoop-row {
  gap: clamp(8px, 1vw, 12px) !important;
}
html body #guest-tribute #certificatePreview .journey-hoop-circle {
  width: clamp(46px, 4.3vw, 58px) !important;
  height: clamp(46px, 4.3vw, 58px) !important;
}
html body #guest-tribute #certificatePreview .journey-hoop em {
  font-size: clamp(12px, .95vw, 14px) !important;
}

/* Submit is left, miniature four-quarter progress ring is right. */
html body #guest-tribute .journey-submit-inline {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 14px !important;
  width: 100% !important;
}
html body #guest-tribute .journey-submit-inline #tributeSubmitBtn {
  flex: 0 1 auto !important;
  margin: 0 auto 0 0 !important;
}
html body #guest-tribute .journey-quarter-ring--submit-mini {
  flex: 0 0 auto !important;
  width: 68px !important;
  height: 68px !important;
  margin: 0 0 0 auto !important;
  min-width: 68px !important;
  border-width: 0 !important;
  box-shadow: 0 4px 12px rgba(87,55,15,.10) !important;
}
html body #guest-tribute .journey-quarter-ring--submit-mini::before {
  inset: 11px !important;
}
html body #guest-tribute .journey-quarter-ring--submit-mini .journey-quarter-core {
  width: 42px !important;
  height: 42px !important;
  min-width: 42px !important;
  min-height: 42px !important;
}
html body #guest-tribute .journey-quarter-ring--submit-mini .journey-quarter-core strong {
  font-size: 11px !important;
  line-height: 1 !important;
}
html body #guest-tribute .journey-quarter-ring--submit-mini .journey-quarter-core span {
  font-size: 6px !important;
  letter-spacing: .08em !important;
}

/* Living Memories: same burgundy-gold-teal rule used beneath animated
   section headings, followed immediately by the explanatory sentence. */
html body #living-memories .lm-heading-gradient {
  display: block !important;
  width: 0 !important;
  height: 3px !important;
  margin: 14px auto 0 !important;
  border-radius: 99px !important;
  background: linear-gradient(90deg, var(--heading), var(--gold), var(--teal)) !important;
  transition: width .8s var(--ease) !important;
}
html body #living-memories.in-view .lm-heading-gradient,
html body #living-memories .section-heading.in-view .lm-heading-gradient {
  width: 100px !important;
}
html body #living-memories .lm-footnote--intro {
  width: min(100%, 1040px) !important;
  max-width: 1040px !important;
  margin: clamp(14px, 1.5vw, 18px) auto 0 !important;
  color: var(--muted) !important;
  text-align: center !important;
  font-size: clamp(14px, 1.05vw, 16px) !important;
  line-height: 1.6 !important;
  font-style: italic !important;
  text-wrap: balance !important;
}

/* Thank You page body copy and final-farewell gratitude are dark red. */
html body #thanks .thanks-message,
html body #thanks .thanks-message--first,
html body #thanks .thanks-message--second,
html body #thanks .thanks-message .aw {
  color: #741f2a !important;
  -webkit-text-fill-color: #741f2a !important;
}
html body .farewell .farewell-line,
html body .farewell .farewell-line .aw {
  color: #741f2a !important;
  -webkit-text-fill-color: #741f2a !important;
}

/* Exact font-size parity with the Admin Moderation introductory lede. */
html body #thanks .thanks-exit-note {
  font-size: min(clamp(23px, 2.4vw, 27px), 1.39vw) !important;
  line-height: 1.7 !important;
}

@media (max-width: 900px) {
  html body #thanks .thanks-exit-note {
    font-size: clamp(18px, 3vw, 22px) !important;
    line-height: 1.7 !important;
  }
}

@media (max-width: 700px) {
  html body #guestbook .tribute-tools {
    flex-wrap: wrap !important;
  }
  html body #guestbook .tribute-tools .view-toggle {
    flex: 1 1 auto !important;
    min-width: 0 !important;
  }
  html body #guestbook .tribute-tools #calendarToggle {
    flex: 0 0 auto !important;
  }
  html body #guest-tribute .journey-next-step-marker {
    justify-content: flex-start !important;
    text-align: left !important;
  }
  html body #guest-tribute #certificatePreview .journey-hoop-row {
    overflow-x: auto !important;
    scroll-snap-type: x proximity !important;
    padding-bottom: 4px !important;
  }
  html body #guest-tribute #certificatePreview .journey-hoop {
    min-width: 118px !important;
    scroll-snap-align: center !important;
  }
  html body #guest-tribute .journey-submit-inline {
    align-items: center !important;
  }
  html body #guest-tribute .journey-quarter-ring--submit-mini {
    width: 58px !important;
    height: 58px !important;
    min-width: 58px !important;
  }
  html body #guest-tribute .journey-quarter-ring--submit-mini::before { inset: 9px !important; }
  html body #guest-tribute .journey-quarter-ring--submit-mini .journey-quarter-core {
    width: 36px !important;
    height: 36px !important;
    min-width: 36px !important;
    min-height: 36px !important;
  }
}

@media (max-width: 430px) {
  html body #guestbook .tribute-tools .view-toggle {
    width: 100% !important;
    flex-basis: 100% !important;
  }
  html body #guestbook .tribute-tools #calendarToggle {
    margin-left: auto !important;
  }
  html body #guest-tribute .journey-submit-inline #tributeSubmitBtn {
    width: calc(100% - 72px) !important;
    min-width: 0 !important;
  }
  html body #living-memories .lm-footnote--intro {
    font-size: 14px !important;
    line-height: 1.55 !important;
  }
}
/* v72 miniature ring final geometry and Guest Book button ordering. */
html body #guest-tribute .journey-quarter-ring--submit-mini .journey-quarter-core {
  inset: 13px !important;
  width: auto !important;
  height: auto !important;
  min-width: 0 !important;
  min-height: 0 !important;
}
html body #guestbook .tribute-tools .view-toggle { order: 1 !important; }
html body #guestbook .tribute-tools #dateClear { order: 2 !important; }
html body #guestbook .tribute-tools #calendarToggle { order: 3 !important; }
@media (max-width: 700px) {
  html body #guest-tribute .journey-quarter-ring--submit-mini .journey-quarter-core { inset: 11px !important; }
}


/* ======================================================================
   v74 — Guest Tribute approved ornamental four-stage composition
   One traditional inner frame inside the existing white heritage tile.
   All four real form stages and the Contribution Journey live inside it.
   ====================================================================== */

/* Keep the existing white heritage tile as the outer surface, but allow the
   four-column composition enough breathing room on large laptop/desktop
   screens. The nested border below is intentionally not capsule-shaped. */
html body #guest-tribute .guest-tribute-combined {
  width: min(96vw, 1480px) !important;
  max-width: 1480px !important;
  padding: clamp(14px, 1.7vw, 24px) !important;
  overflow: visible !important;
}
html body #guest-tribute .guest-tribute-combined > .guest-tribute-ornamental-inner {
  position: relative !important;
  width: 100% !important;
  margin: 0 !important;
  padding: clamp(24px, 2.4vw, 34px) clamp(18px, 2.2vw, 30px) clamp(22px, 2.2vw, 30px) !important;
  border: 1px solid rgba(177, 119, 30, .52) !important;
  border-radius: 12px !important;
  background:
    linear-gradient(90deg, rgba(183,122,31,.10), transparent 13%, transparent 87%, rgba(183,122,31,.10)),
    radial-gradient(circle at 50% 0%, rgba(232,201,111,.15), transparent 32%),
    rgba(255,253,246,.56) !important;
  box-shadow:
    inset 0 0 0 4px rgba(255,255,255,.52),
    inset 0 0 0 6px rgba(190,149,65,.08) !important;
  overflow: hidden !important;
}
html body #guest-tribute .guest-tribute-ornamental-inner::before,
html body #guest-tribute .guest-tribute-ornamental-inner::after {
  content: "" !important;
  position: absolute !important;
  top: 13px !important;
  width: 42px !important;
  height: 42px !important;
  border-top: 2px solid rgba(183,122,31,.58) !important;
  pointer-events: none !important;
  opacity: .72 !important;
}
html body #guest-tribute .guest-tribute-ornamental-inner::before {
  left: 13px !important;
  border-left: 2px solid rgba(183,122,31,.58) !important;
}
html body #guest-tribute .guest-tribute-ornamental-inner::after {
  right: 13px !important;
  border-right: 2px solid rgba(183,122,31,.58) !important;
}
html body #guest-tribute .guest-ornamental-border-cap {
  position: absolute !important;
  left: 50% !important;
  z-index: 1 !important;
  width: min(42%, 470px) !important;
  height: 30px !important;
  transform: translateX(-50%) !important;
  background: url('assets/ornament-divider-5.png') center / contain no-repeat !important;
  opacity: .58 !important;
  pointer-events: none !important;
}
html body #guest-tribute .guest-ornamental-border-cap--top { top: -2px !important; }
html body #guest-tribute .guest-ornamental-border-cap--bottom {
  bottom: -3px !important;
  transform: translateX(-50%) rotate(180deg) !important;
  opacity: .46 !important;
}

/* Heading now belongs to the same inner ornamental composition. */
html body #guest-tribute .guest-tribute-heading-row {
  position: relative !important;
  z-index: 2 !important;
  display: grid !important;
  grid-template-columns: minmax(0,1fr) auto !important;
  align-items: start !important;
  gap: clamp(16px, 2vw, 28px) !important;
  margin: 0 0 clamp(18px, 2vw, 26px) !important;
  padding: 0 clamp(4px, .5vw, 8px) clamp(13px, 1.4vw, 18px) !important;
  border-bottom: 1px solid rgba(183,122,31,.18) !important;
}
html body #guest-tribute .guest-tribute-inner-heading {
  max-width: 920px !important;
  margin: 0 !important;
  padding: 0 !important;
  text-align: left !important;
}
html body #guest-tribute .guest-tribute-inner-heading .section-nav-emblem {
  margin-left: 0 !important;
  margin-right: auto !important;
}
html body #guest-tribute .guest-tribute-inner-heading .eyebrow,
html body #guest-tribute .guest-tribute-inner-heading .heading-accent,
html body #guest-tribute .guest-tribute-inner-heading .lede {
  text-align: left !important;
}
html body #guest-tribute .guest-meaningful-badge {
  align-self: start !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 36px !important;
  padding: 8px 16px !important;
  border: 1px solid rgba(183,122,31,.34) !important;
  border-radius: 999px !important;
  color: #6b4a23 !important;
  background: linear-gradient(180deg, rgba(255,253,246,.95), rgba(248,239,207,.83)) !important;
  box-shadow: 0 4px 12px rgba(93,57,12,.08) !important;
  font: 700 clamp(10px,.82vw,12px)/1.1 var(--font-display) !important;
  letter-spacing: .06em !important;
  text-transform: uppercase !important;
  white-space: nowrap !important;
}

/* Approved four-stage layout. All four panels are peers inside the same
   traditional border, with Stage 3 slightly wider for form + attachments. */
html body #guest-tribute .guest-four-stage-grid {
  position: relative !important;
  z-index: 2 !important;
  display: grid !important;
  grid-template-columns: minmax(190px,.95fr) minmax(215px,1fr) minmax(430px,1.68fr) minmax(205px,.95fr) !important;
  align-items: stretch !important;
  gap: clamp(11px, 1.1vw, 16px) !important;
  width: 100% !important;
  margin: 0 !important;
}
html body #guest-tribute .guest-four-stage-grid > [data-stage-panel] {
  position: relative !important;
  display: flex !important;
  flex-direction: column !important;
  min-width: 0 !important;
  width: 100% !important;
  height: 100% !important;
  margin: 0 !important;
  padding: clamp(15px, 1.4vw, 20px) !important;
  border: 1px solid rgba(183,122,31,.29) !important;
  border-radius: 13px !important;
  background:
    radial-gradient(circle at 50% 0%, rgba(232,201,111,.10), transparent 30%),
    linear-gradient(180deg, rgba(255,254,249,.96), rgba(250,244,227,.84)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.82), 0 7px 17px rgba(84,54,16,.045) !important;
  overflow: hidden !important;
  transition: border-color 120ms ease, box-shadow 120ms ease, background 120ms ease !important;
}
html body #guest-tribute .guest-four-stage-grid > [data-stage-panel].is-current-stage {
  border-color: rgba(116,31,42,.48) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.86), 0 8px 18px rgba(93,30,37,.075) !important;
}
html body #guest-tribute .guest-four-stage-grid > [data-stage-panel].is-done-stage {
  border-color: rgba(63,127,88,.38) !important;
}
html body #guest-tribute .guest-four-stage-grid > [data-stage-panel]::before,
html body #guest-tribute .guest-four-stage-grid .journey-stage-crown-line { display: none !important; }

/* Stage headers: round numeric medallions. Both the in-card number and the
   lower journey number share the same live current/done animation language. */
html body #guest-tribute .guest-four-stage-grid .journey-stage-bar {
  display: grid !important;
  grid-template-columns: auto minmax(0,1fr) auto !important;
  align-items: center !important;
  gap: 9px !important;
  margin: 0 0 13px !important;
  padding: 0 0 10px !important;
  border: 0 !important;
  border-bottom: 1px solid rgba(183,122,31,.18) !important;
  background: transparent !important;
}
html body #guest-tribute .guest-four-stage-grid .journey-stage-number {
  display: grid !important;
  place-items: center !important;
  width: 36px !important;
  height: 36px !important;
  border: 4px solid var(--journey-gold,#d7a63c) !important;
  border-radius: 50% !important;
  color: #5d3919 !important;
  background: #fffdf4 !important;
  box-shadow: inset 0 0 0 2px rgba(255,255,255,.9), 0 3px 8px rgba(99,67,16,.08) !important;
  font-size: 14px !important;
  font-weight: 800 !important;
  transition: transform 100ms ease, border-color 100ms ease, color 100ms ease, box-shadow 100ms ease !important;
}
html body #guest-tribute .guest-four-stage-grid [data-stage-panel].is-current-stage .journey-stage-number {
  border-color: var(--journey-wine,#741f2a) !important;
  color: var(--journey-wine,#741f2a) !important;
  animation: guestJourneyCurrentPulse 1.55s ease-in-out infinite !important;
}
html body #guest-tribute .guest-four-stage-grid [data-stage-panel].is-done-stage .journey-stage-number {
  border-color: var(--journey-green,#4f8063) !important;
  color: var(--journey-green,#4f8063) !important;
  background: #f8fff8 !important;
}
html body #guest-tribute .guest-four-stage-grid .journey-stage-bar-title {
  min-width: 0 !important;
  color: var(--journey-wine,#741f2a) !important;
  font: 700 clamp(13px,1.02vw,16px)/1.18 var(--font-display) !important;
  letter-spacing: .035em !important;
  text-transform: none !important;
}
html body #guest-tribute .guest-four-stage-grid .journey-stage-requirement {
  margin: 0 !important;
  padding: 4px 7px !important;
  font-size: 8.5px !important;
  line-height: 1 !important;
}

/* Stage 1: vertically-spaced dedication choices, as in the approved visual. */
html body #guest-tribute .guest-four-stage-grid .dedication-options {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 10px !important;
  margin-top: 12px !important;
}
html body #guest-tribute .guest-four-stage-grid .radio-pill {
  min-height: 48px !important;
  border-radius: 9px !important;
}

/* Stage 2: compact, readable experience rows rather than a wide carousel. */
html body #guest-tribute .guest-four-stage-grid .embedded-experience-head {
  display: block !important;
  margin-bottom: 10px !important;
}
html body #guest-tribute .guest-four-stage-grid .embedded-choice-note {
  display: none !important;
}
html body #guest-tribute .guest-four-stage-grid .experience-carousel--embedded {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 9px !important;
  overflow: visible !important;
  padding: 0 !important;
}
html body #guest-tribute .guest-four-stage-grid .experience-carousel--embedded .experience-card {
  display: grid !important;
  grid-template-columns: auto minmax(0,1fr) !important;
  grid-template-rows: auto auto auto !important;
  gap: 3px 9px !important;
  min-height: 0 !important;
  padding: 10px !important;
  border-radius: 9px !important;
}
html body #guest-tribute .guest-four-stage-grid .experience-carousel--embedded .experience-icon {
  grid-row: 1 / 3 !important;
  width: 30px !important;
  height: 30px !important;
  align-self: start !important;
  font-size: 15px !important;
}
html body #guest-tribute .guest-four-stage-grid .experience-carousel--embedded .experience-card h5 {
  margin: 0 !important;
  font-size: 13px !important;
  line-height: 1.18 !important;
}
html body #guest-tribute .guest-four-stage-grid .experience-carousel--embedded .experience-card p {
  margin: 0 !important;
  font-size: 10.5px !important;
  line-height: 1.35 !important;
}
html body #guest-tribute .guest-four-stage-grid .experience-carousel--embedded .experience-select {
  grid-column: 1 / -1 !important;
  width: 100% !important;
  min-height: 34px !important;
  margin-top: 4px !important;
  padding: 7px 10px !important;
  font-size: 10.5px !important;
}

/* Stage 3: the written-details and attachment halves stay level. Attach
   Memories is vertically balanced so its top and bottom breathing room match. */
html body #guest-tribute .guest-four-stage-grid .journey-stage--details .tribute-grid {
  display: grid !important;
  grid-template-columns: minmax(0,1.08fr) minmax(220px,.92fr) !important;
  align-items: stretch !important;
  gap: clamp(12px,1.15vw,17px) !important;
  flex: 1 1 auto !important;
}
html body #guest-tribute .guest-four-stage-grid .tribute-write,
html body #guest-tribute .guest-four-stage-grid .tribute-media {
  min-width: 0 !important;
  height: 100% !important;
}
html body #guest-tribute .guest-four-stage-grid .tribute-media {
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  gap: 9px !important;
  padding: clamp(8px,.8vw,12px) 0 !important;
}
html body #guest-tribute .guest-four-stage-grid .media-head {
  margin: 0 !important;
  text-align: center !important;
}
html body #guest-tribute .guest-four-stage-grid .media-head h4 {
  color: #235c5a !important;
  font-size: clamp(15px,1.15vw,18px) !important;
}
html body #guest-tribute .guest-four-stage-grid .media-head p {
  font-size: 10.5px !important;
  line-height: 1.35 !important;
}
html body #guest-tribute .guest-four-stage-grid .media-optional-label {
  margin: -2px auto 0 !important;
  font-size: 9px !important;
}
html body #guest-tribute .guest-four-stage-grid .upload-grid {
  grid-template-columns: repeat(2,minmax(0,1fr)) !important;
  gap: 7px !important;
}
html body #guest-tribute .guest-four-stage-grid .upload-tile {
  min-height: 66px !important;
  padding: 7px 5px !important;
}
html body #guest-tribute .guest-four-stage-grid .admin-review-callout--optional {
  margin-top: 2px !important;
}
html body #guest-tribute .guest-four-stage-grid .field-row-3 {
  grid-template-columns: repeat(3,minmax(0,1fr)) !important;
  gap: 7px !important;
}
html body #guest-tribute .guest-four-stage-grid input,
html body #guest-tribute .guest-four-stage-grid select,
html body #guest-tribute .guest-four-stage-grid textarea {
  font-size: 12px !important;
}
html body #guest-tribute .guest-four-stage-grid .message-field textarea {
  min-height: 110px !important;
  height: clamp(110px,11vw,150px) !important;
}
html body #guest-tribute .message-word-limit {
  display: block !important;
  margin-top: 6px !important;
  color: #71593a !important;
  font-size: 10.5px !important;
  line-height: 1.3 !important;
  font-weight: 500 !important;
}
html body #guest-tribute .guest-four-stage-grid .word-count {
  margin-top: 2px !important;
  font-size: 10px !important;
}
html body #guest-tribute .guest-four-stage-grid .journey-details-advance {
  margin-top: auto !important;
  padding-top: 10px !important;
  text-align: left !important;
}
html body #guest-tribute .guest-four-stage-grid #detailsContinueBtn {
  min-height: 38px !important;
  padding: 8px 16px !important;
  font-size: 11px !important;
}

/* Stage 4: concise preview and one clean submission action. */
html body #guest-tribute .guest-four-stage-grid #certificatePreview {
  justify-content: flex-start !important;
}
html body #guest-tribute .guest-four-stage-grid .preview-head-row {
  display: block !important;
}
html body #guest-tribute .guest-four-stage-grid .preview-status-chip {
  display: block !important;
  width: fit-content !important;
  margin: 7px 0 0 !important;
  font-size: 9px !important;
}
html body #guest-tribute .guest-four-stage-grid .preview-selected-experience,
html body #guest-tribute .guest-four-stage-grid .preview-selection-summary,
html body #guest-tribute .guest-four-stage-grid .preview-experience-details,
html body #guest-tribute .guest-four-stage-grid #previewMessage {
  font-size: 11px !important;
  line-height: 1.38 !important;
}
html body #guest-tribute .guest-four-stage-grid #previewMessage {
  min-height: 76px !important;
  max-height: 135px !important;
  margin: 10px 0 !important;
}
html body #guest-tribute .guest-four-stage-grid .preview-files {
  grid-template-columns: repeat(2,minmax(0,1fr)) !important;
  gap: 6px !important;
}
html body #guest-tribute .guest-four-stage-grid .guest-submit-row-clean {
  margin-top: auto !important;
  padding-top: 14px !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}
html body #guest-tribute .guest-four-stage-grid .guest-submit-row-clean::before { display: none !important; }
html body #guest-tribute .guest-four-stage-grid #tributeSubmitBtn {
  width: 100% !important;
  min-width: 0 !important;
  min-height: 44px !important;
  margin: 0 !important;
}

/* Contribution Journey now lives at the bottom of the SAME ornamental frame.
   No capsule shell or rounded outline surrounds it. */
html body #guest-tribute .guest-contribution-journey {
  position: relative !important;
  z-index: 2 !important;
  width: 100% !important;
  margin: clamp(19px,2vw,27px) 0 0 !important;
  padding: clamp(15px,1.7vw,22px) clamp(4px,.4vw,7px) 4px !important;
  border: 0 !important;
  border-top: 1px solid rgba(183,122,31,.25) !important;
  border-radius: 0 !important;
  outline: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}
html body #guest-tribute .guest-contribution-journey::before,
html body #guest-tribute .guest-contribution-journey::after {
  content: "" !important;
  position: absolute !important;
  top: -8px !important;
  width: calc(50% - 170px) !important;
  height: 15px !important;
  background: linear-gradient(90deg, transparent, rgba(183,122,31,.52)) center / 100% 1px no-repeat !important;
  pointer-events: none !important;
}
html body #guest-tribute .guest-contribution-journey::before { left: 0 !important; }
html body #guest-tribute .guest-contribution-journey::after { right: 0 !important; transform: scaleX(-1) !important; }
html body #guest-tribute .guest-journey-heading {
  width: fit-content !important;
  margin: -27px auto 13px !important;
  padding: 0 18px !important;
  color: var(--journey-wine,#741f2a) !important;
  background: #fffaf0 !important;
  font: 700 clamp(14px,1.25vw,18px)/1.15 var(--font-display) !important;
  letter-spacing: .17em !important;
  text-transform: uppercase !important;
}
html body #guest-tribute .guest-journey-progress-row {
  display: grid !important;
  grid-template-columns: minmax(0,1fr) auto !important;
  align-items: center !important;
  gap: clamp(18px,2.4vw,34px) !important;
}
html body #guest-tribute .journey-hoop-row--ornamental {
  display: grid !important;
  grid-template-columns: repeat(4,minmax(0,1fr)) !important;
  align-items: start !important;
  justify-items: center !important;
  gap: clamp(10px,1.45vw,22px) !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
}
html body #guest-tribute .journey-hoop-row--ornamental .journey-hoop {
  width: 100% !important;
  min-width: 0 !important;
  gap: 6px !important;
}
html body #guest-tribute .journey-hoop-row--ornamental .journey-hoop-circle {
  width: clamp(54px,4.5vw,68px) !important;
  height: clamp(54px,4.5vw,68px) !important;
  border-width: 6px !important;
  transition: transform 100ms ease, border-color 100ms ease, box-shadow 100ms ease, background 100ms ease !important;
}
html body #guest-tribute .journey-hoop-row--ornamental .journey-hoop-circle b {
  font-size: clamp(17px,1.45vw,22px) !important;
  transition: transform 100ms ease, color 100ms ease !important;
}
html body #guest-tribute .journey-hoop-row--ornamental .journey-hoop > em {
  max-width: 170px !important;
  font-size: clamp(11px,.9vw,13.5px) !important;
  line-height: 1.2 !important;
  text-wrap: balance !important;
}
html body #guest-tribute .journey-hoop-row--ornamental .guided-step-requirement {
  font-size: 8.5px !important;
}
html body #guest-tribute .journey-hoop.is-current .journey-hoop-circle {
  animation: guestJourneyCurrentPulse 1.55s ease-in-out infinite !important;
}
html body #guest-tribute .journey-hoop.is-done .journey-hoop-circle b {
  animation: guestJourneyDonePop 260ms cubic-bezier(.2,.75,.25,1.2) both !important;
}
@keyframes guestJourneyCurrentPulse {
  0%,100% { transform: translateY(0) scale(1); filter: brightness(1); }
  50% { transform: translateY(-2px) scale(1.035); filter: brightness(1.05); }
}
@keyframes guestJourneyDonePop {
  0% { transform: scale(.72); opacity:.45; }
  70% { transform: scale(1.16); opacity:1; }
  100% { transform: scale(1); opacity:1; }
}
html body #guest-tribute .journey-quarter-ring--ornamental {
  width: clamp(106px,8.2vw,132px) !important;
  min-width: clamp(106px,8.2vw,132px) !important;
  margin: 0 !important;
  flex: 0 0 auto !important;
  box-shadow: 0 9px 20px rgba(89,64,25,.11) !important;
  transition: transform 120ms ease, filter 120ms ease !important;
}
html body #guest-tribute .journey-quarter-ring--ornamental::before { inset: 22% !important; }
html body #guest-tribute .journey-quarter-ring--ornamental .journey-quarter-core { inset: 22% !important; }
html body #guest-tribute .journey-quarter-ring--ornamental .journey-quarter-core strong {
  font-size: clamp(19px,1.8vw,27px) !important;
}
html body #guest-tribute .journey-quarter-ring--ornamental .journey-quarter-core span {
  margin-top: 3px !important;
  font-size: 8px !important;
}
html body #guest-tribute .journey-quarter-ring--ornamental.is-progress-pulse {
  animation: guestQuarterProgressPulse 280ms cubic-bezier(.2,.75,.25,1.2) both !important;
}
@keyframes guestQuarterProgressPulse {
  0% { transform: scale(.93); filter: brightness(.96); }
  60% { transform: scale(1.045); filter: brightness(1.08); }
  100% { transform: scale(1); filter: brightness(1); }
}
html body #guest-tribute .journey-quarter-ring--ornamental.is-progress-pulse .journey-quarter-core strong {
  animation: guestJourneyDonePop 260ms cubic-bezier(.2,.75,.25,1.2) both !important;
}

/* Remove legacy/capsule progress shells from the approved layout. */
html body #guest-tribute .journey-points-slot,
html body #guest-tribute .journey-final-progress,
html body #guest-tribute .journey-next-step-marker,
html body #guest-tribute .guided-progress-shell:not(.guest-contribution-journey) {
  border: 0 !important;
  outline: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

/* Tablet: two-by-two stage composition, still fully inside the same border. */
@media (max-width: 1180px) {
  html body #guest-tribute .guest-tribute-combined {
    width: min(97vw, 1080px) !important;
  }
  html body #guest-tribute .guest-four-stage-grid {
    grid-template-columns: repeat(2,minmax(0,1fr)) !important;
  }
  html body #guest-tribute .guest-four-stage-grid .journey-stage--details {
    grid-column: 1 / -1 !important;
  }
  html body #guest-tribute .guest-four-stage-grid #certificatePreview {
    grid-column: 1 / -1 !important;
  }
  html body #guest-tribute .guest-four-stage-grid .experience-carousel--embedded {
    grid-template-columns: repeat(2,minmax(0,1fr)) !important;
  }
}

/* Phone: one stage per row; no page-level horizontal scrolling. */
@media (max-width: 720px) {
  html body #guest-tribute .guest-tribute-combined {
    width: 100% !important;
    padding: 10px !important;
    border-radius: 18px !important;
  }
  html body #guest-tribute .guest-tribute-combined > .guest-tribute-ornamental-inner {
    padding: 24px 10px 20px !important;
    border-radius: 9px !important;
  }
  html body #guest-tribute .guest-tribute-heading-row {
    grid-template-columns: 1fr !important;
    gap: 10px !important;
  }
  html body #guest-tribute .guest-meaningful-badge {
    justify-self: start !important;
  }
  html body #guest-tribute .guest-four-stage-grid {
    grid-template-columns: 1fr !important;
    gap: 12px !important;
  }
  html body #guest-tribute .guest-four-stage-grid .journey-stage--details,
  html body #guest-tribute .guest-four-stage-grid #certificatePreview { grid-column: auto !important; }
  html body #guest-tribute .guest-four-stage-grid .journey-stage--details .tribute-grid {
    grid-template-columns: 1fr !important;
  }
  html body #guest-tribute .guest-four-stage-grid .tribute-media {
    justify-content: flex-start !important;
    padding-top: 8px !important;
  }
  html body #guest-tribute .guest-four-stage-grid .field-row-3,
  html body #guest-tribute .guest-four-stage-grid .field-row-2 {
    grid-template-columns: 1fr !important;
  }
  html body #guest-tribute .guest-four-stage-grid input,
  html body #guest-tribute .guest-four-stage-grid select,
  html body #guest-tribute .guest-four-stage-grid textarea {
    font-size: 16px !important;
  }
  html body #guest-tribute .guest-four-stage-grid .experience-carousel--embedded {
    grid-template-columns: 1fr !important;
  }
  html body #guest-tribute .guest-journey-progress-row {
    grid-template-columns: 1fr !important;
    gap: 16px !important;
  }
  html body #guest-tribute .journey-hoop-row--ornamental {
    grid-template-columns: repeat(4,minmax(0,1fr)) !important;
    gap: 5px !important;
  }
  html body #guest-tribute .journey-hoop-row--ornamental .journey-hoop-circle {
    width: clamp(40px,12vw,50px) !important;
    height: clamp(40px,12vw,50px) !important;
    border-width: 4px !important;
  }
  html body #guest-tribute .journey-hoop-row--ornamental .journey-hoop-circle b {
    font-size: 15px !important;
  }
  html body #guest-tribute .journey-hoop-row--ornamental .journey-hoop > em {
    font-size: clamp(9px,2.75vw,11px) !important;
  }
  html body #guest-tribute .journey-hoop-row--ornamental .guided-step-requirement {
    font-size: 7.5px !important;
    padding: 3px 4px !important;
  }
  html body #guest-tribute .journey-quarter-ring--ornamental {
    justify-self: center !important;
    width: 92px !important;
    min-width: 92px !important;
  }
  html body #guest-tribute .guest-contribution-journey::before,
  html body #guest-tribute .guest-contribution-journey::after {
    width: calc(50% - 118px) !important;
  }
  html body #guest-tribute .guest-journey-heading {
    margin-top: -25px !important;
    padding-inline: 10px !important;
    font-size: 12px !important;
    letter-spacing: .11em !important;
  }
}

@media (max-width: 390px) {
  html body #guest-tribute .guest-four-stage-grid > [data-stage-panel] {
    padding: 13px 10px !important;
  }
  html body #guest-tribute .guest-four-stage-grid .journey-stage-bar {
    grid-template-columns: auto minmax(0,1fr) !important;
  }
  html body #guest-tribute .guest-four-stage-grid .journey-stage-requirement {
    grid-column: 2 !important;
    justify-self: start !important;
  }
  html body #guest-tribute .journey-hoop-row--ornamental .journey-hoop > em {
    font-size: 8.5px !important;
  }
  html body #guest-tribute .journey-hoop-row--ornamental .guided-step-requirement {
    font-size: 6.8px !important;
  }
}

/* ======================================================================
   v75 — Guest Tribute approved VERTICAL heritage composition
   Visual-only layout replacement. Existing form IDs, JS state, uploads,
   preview, validation and progress animations remain intact.
   ====================================================================== */

/* Keep the established white outer heritage tile, but make the contribution
   experience a calm centered vertical column rather than a wide dashboard. */
html body #guest-tribute .guest-tribute-combined {
  width: min(94vw, 1040px) !important;
  max-width: 1040px !important;
  margin-inline: auto !important;
  padding: clamp(12px, 1.7vw, 22px) !important;
  overflow: visible !important;
}
html body #guest-tribute .guest-tribute-combined > .guest-tribute-ornamental-inner {
  width: min(100%, 920px) !important;
  max-width: 920px !important;
  margin-inline: auto !important;
  padding: clamp(20px, 2.6vw, 34px) clamp(14px, 2.4vw, 28px) clamp(22px, 2.7vw, 34px) !important;
  border: 1px solid rgba(183,122,31,.48) !important;
  border-radius: 18px !important;
  background:
    radial-gradient(circle at 50% 0%, rgba(232,201,111,.12), transparent 27%),
    linear-gradient(180deg, rgba(255,254,249,.90), rgba(252,247,231,.78)) !important;
  box-shadow:
    inset 0 0 0 4px rgba(255,255,255,.58),
    inset 0 0 0 6px rgba(190,149,65,.07),
    0 10px 26px rgba(84,54,16,.045) !important;
  overflow: hidden !important;
}

/* The vertical reference uses clean corner framing rather than the older
   floating central top/bottom ornaments. */
html body #guest-tribute .guest-ornamental-border-cap {
  display: none !important;
}
html body #guest-tribute .guest-tribute-ornamental-inner::before,
html body #guest-tribute .guest-tribute-ornamental-inner::after {
  top: 12px !important;
  width: 34px !important;
  height: 34px !important;
  opacity: .64 !important;
}

/* Header: icon + title at the left, contribution badge at the right, matching
   the approved reference while staying within the live website theme. */
html body #guest-tribute .guest-tribute-heading-row {
  grid-template-columns: minmax(0,1fr) auto !important;
  align-items: start !important;
  gap: 14px !important;
  margin: 0 0 clamp(14px, 2vw, 20px) !important;
  padding: 0 4px clamp(12px, 1.5vw, 16px) !important;
  border-bottom: 1px solid rgba(183,122,31,.18) !important;
}
html body #guest-tribute .guest-tribute-inner-heading {
  display: grid !important;
  grid-template-columns: auto minmax(0,1fr) !important;
  grid-template-areas:
    "icon eyebrow"
    "icon lede" !important;
  align-items: start !important;
  column-gap: 12px !important;
  row-gap: 4px !important;
  max-width: none !important;
  text-align: left !important;
}
html body #guest-tribute .guest-tribute-inner-heading .section-nav-emblem {
  grid-area: icon !important;
  width: 42px !important;
  height: 42px !important;
  margin: 0 !important;
  align-self: start !important;
}
html body #guest-tribute .guest-tribute-inner-heading .eyebrow {
  grid-area: eyebrow !important;
  margin: 1px 0 0 !important;
  color: #741f2a !important;
  font: 700 clamp(17px, 2vw, 24px)/1.15 var(--font-display) !important;
  letter-spacing: .16em !important;
  text-transform: uppercase !important;
}
html body #guest-tribute .guest-tribute-inner-heading .heading-accent {
  display: none !important;
}
html body #guest-tribute .guest-tribute-inner-heading .lede {
  grid-area: lede !important;
  margin: 0 !important;
  max-width: 720px !important;
  color: #5c4730 !important;
  font-size: clamp(13px, 1.25vw, 16px) !important;
  line-height: 1.45 !important;
}
html body #guest-tribute .guest-meaningful-badge {
  align-self: start !important;
  margin-top: 0 !important;
}

/* Core change: four full-width stages stacked vertically and centered. */
html body #guest-tribute .guest-four-stage-grid {
  display: grid !important;
  grid-template-columns: 1fr !important;
  align-items: stretch !important;
  gap: clamp(12px, 1.6vw, 17px) !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 auto !important;
}
html body #guest-tribute .guest-four-stage-grid > [data-stage-panel] {
  grid-column: 1 !important;
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: clamp(14px, 2vw, 20px) !important;
  border-radius: 13px !important;
  overflow: visible !important;
}
html body #guest-tribute .guest-four-stage-grid .journey-stage-bar {
  grid-template-columns: auto minmax(0,1fr) auto !important;
  gap: 10px !important;
  margin-bottom: 10px !important;
  padding-bottom: 9px !important;
}
html body #guest-tribute .guest-four-stage-grid .journey-stage-number {
  width: 42px !important;
  height: 42px !important;
  font-size: 16px !important;
}
html body #guest-tribute .guest-four-stage-grid .journey-stage-bar-title {
  font-size: clamp(16px, 1.8vw, 21px) !important;
}

/* Stage 1 — wide, comfortable dedication choices. */
html body #guest-tribute .guest-four-stage-grid .dedication-options {
  gap: 9px !important;
  margin-top: 8px !important;
}
html body #guest-tribute .guest-four-stage-grid .radio-pill {
  width: 100% !important;
  min-height: 46px !important;
}

/* Stage 2 — two columns on larger screens, one on phones. */
html body #guest-tribute .guest-four-stage-grid .experience-carousel--embedded {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0,1fr)) !important;
  gap: 10px !important;
  overflow: visible !important;
}
html body #guest-tribute .guest-four-stage-grid .experience-card {
  min-height: 0 !important;
}

/* Stage 3 — fields first, Attach Memories beneath them as a centered,
   vertically balanced subsection with equal breathing room above and below. */
html body #guest-tribute .guest-four-stage-grid .journey-stage--details .tribute-grid {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: clamp(16px, 2vw, 22px) !important;
  align-items: stretch !important;
}
html body #guest-tribute .guest-four-stage-grid .tribute-write {
  width: 100% !important;
  min-width: 0 !important;
}
html body #guest-tribute .guest-four-stage-grid .tribute-media {
  width: min(100%, 760px) !important;
  min-width: 0 !important;
  margin: 0 auto !important;
  padding: clamp(16px, 2vw, 22px) clamp(12px, 2vw, 20px) !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  align-items: stretch !important;
  gap: 10px !important;
  border: 1px solid rgba(183,122,31,.22) !important;
  border-radius: 12px !important;
  background: rgba(255,253,246,.54) !important;
  min-height: clamp(240px, 27vw, 310px) !important;
}
html body #guest-tribute .guest-four-stage-grid .tribute-media .media-head {
  text-align: center !important;
  margin: 0 auto !important;
}
html body #guest-tribute .guest-four-stage-grid .tribute-media .media-head h4,
html body #guest-tribute .guest-four-stage-grid .tribute-media .media-head p {
  text-align: center !important;
}
html body #guest-tribute .guest-four-stage-grid .media-optional-label {
  text-align: center !important;
  align-self: center !important;
}
html body #guest-tribute .guest-four-stage-grid .upload-grid {
  width: 100% !important;
  max-width: 690px !important;
  margin-inline: auto !important;
  grid-template-columns: repeat(4,minmax(0,1fr)) !important;
  gap: 9px !important;
}
html body #guest-tribute .guest-four-stage-grid .admin-review-callout--optional {
  width: min(100%, 690px) !important;
  margin: 2px auto 0 !important;
  text-align: center !important;
  justify-content: center !important;
}
html body #guest-tribute .guest-four-stage-grid .admin-review-callout--optional > div {
  text-align: center !important;
}
html body #guest-tribute .journey-details-advance {
  display: flex !important;
  justify-content: center !important;
  margin-top: 13px !important;
}

/* Stage 4 — preview remains complete, but the final action is centered exactly
   like the approved visual. */
html body #guest-tribute #certificatePreview .preview-head-row,
html body #guest-tribute #certificatePreview .preview-selected-experience,
html body #guest-tribute #certificatePreview .preview-selection-summary,
html body #guest-tribute #certificatePreview .preview-experience-details,
html body #guest-tribute #certificatePreview blockquote,
html body #guest-tribute #certificatePreview .preview-files {
  width: 100% !important;
}
html body #guest-tribute #certificatePreview .guest-submit-row-clean {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  width: 100% !important;
  margin: 14px 0 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}
html body #guest-tribute #certificatePreview #tributeSubmitBtn {
  min-width: min(100%, 300px) !important;
}

/* Contribution Journey stays inside the same white tile and vertical frame,
   centered directly beneath Stage 4. */
html body #guest-tribute .guest-contribution-journey {
  width: 100% !important;
  max-width: 100% !important;
  margin: clamp(18px, 2vw, 24px) auto 0 !important;
  padding: clamp(14px, 1.8vw, 20px) 2px 2px !important;
  border: 0 !important;
  border-top: 1px solid rgba(183,122,31,.25) !important;
  border-radius: 0 !important;
  outline: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}
html body #guest-tribute .guest-journey-progress-row {
  grid-template-columns: minmax(0,1fr) auto !important;
  align-items: center !important;
  gap: clamp(16px, 2.4vw, 28px) !important;
}
html body #guest-tribute .journey-hoop-row--ornamental {
  grid-template-columns: repeat(4,minmax(0,1fr)) !important;
  gap: clamp(8px,1.4vw,18px) !important;
}
html body #guest-tribute .journey-quarter-ring--ornamental {
  width: clamp(102px, 12vw, 130px) !important;
  min-width: clamp(102px, 12vw, 130px) !important;
}

/* Tablet remains vertical — only the inner controls reflow. */
@media (max-width: 900px) {
  html body #guest-tribute .guest-tribute-combined {
    width: min(96vw, 820px) !important;
  }
  html body #guest-tribute .guest-tribute-combined > .guest-tribute-ornamental-inner {
    width: 100% !important;
  }
  html body #guest-tribute .guest-four-stage-grid .field-row-3 {
    grid-template-columns: 1fr 1fr !important;
  }
  html body #guest-tribute .guest-four-stage-grid .field-row-3 > :last-child {
    grid-column: 1 / -1 !important;
  }
  html body #guest-tribute .guest-four-stage-grid .upload-grid {
    grid-template-columns: repeat(2,minmax(0,1fr)) !important;
  }
}

/* Phones: a true single-column reading flow, centered and without horizontal
   page overflow. All inputs retain iOS-safe 16px text sizing. */
@media (max-width: 700px) {
  html body #guest-tribute .guest-tribute-combined {
    width: 100% !important;
    max-width: 100% !important;
    padding: 8px !important;
  }
  html body #guest-tribute .guest-tribute-combined > .guest-tribute-ornamental-inner {
    padding: 20px 9px 18px !important;
    border-radius: 12px !important;
  }
  html body #guest-tribute .guest-tribute-heading-row {
    grid-template-columns: 1fr !important;
    gap: 9px !important;
  }
  html body #guest-tribute .guest-meaningful-badge {
    justify-self: start !important;
  }
  html body #guest-tribute .guest-four-stage-grid {
    gap: 11px !important;
  }
  html body #guest-tribute .guest-four-stage-grid > [data-stage-panel] {
    padding: 13px 10px !important;
  }
  html body #guest-tribute .guest-four-stage-grid .journey-stage-bar {
    grid-template-columns: auto minmax(0,1fr) !important;
  }
  html body #guest-tribute .guest-four-stage-grid .journey-stage-requirement {
    grid-column: 2 !important;
    justify-self: start !important;
  }
  html body #guest-tribute .guest-four-stage-grid .experience-carousel--embedded,
  html body #guest-tribute .guest-four-stage-grid .field-row-3,
  html body #guest-tribute .guest-four-stage-grid .field-row-2 {
    grid-template-columns: 1fr !important;
  }
  html body #guest-tribute .guest-four-stage-grid .field-row-3 > :last-child {
    grid-column: auto !important;
  }
  html body #guest-tribute .guest-four-stage-grid input,
  html body #guest-tribute .guest-four-stage-grid select,
  html body #guest-tribute .guest-four-stage-grid textarea {
    font-size: 16px !important;
  }
  html body #guest-tribute .guest-four-stage-grid .tribute-media {
    width: 100% !important;
    min-height: 0 !important;
    padding: 15px 10px !important;
  }
  html body #guest-tribute .guest-four-stage-grid .upload-grid {
    grid-template-columns: repeat(2,minmax(0,1fr)) !important;
  }
  html body #guest-tribute .guest-journey-progress-row {
    grid-template-columns: 1fr !important;
    gap: 14px !important;
  }
  html body #guest-tribute .journey-hoop-row--ornamental {
    grid-template-columns: repeat(4,minmax(0,1fr)) !important;
    gap: 4px !important;
  }
  html body #guest-tribute .journey-hoop-row--ornamental .journey-hoop-circle {
    width: clamp(40px, 12vw, 50px) !important;
    height: clamp(40px, 12vw, 50px) !important;
    border-width: 4px !important;
  }
  html body #guest-tribute .journey-quarter-ring--ornamental {
    justify-self: center !important;
    width: 94px !important;
    min-width: 94px !important;
  }
  html body #guest-tribute #certificatePreview #tributeSubmitBtn,
  html body #guest-tribute #detailsContinueBtn {
    width: min(100%, 320px) !important;
  }
}

@media (max-width: 390px) {
  html body #guest-tribute .guest-tribute-inner-heading {
    grid-template-columns: 36px minmax(0,1fr) !important;
    column-gap: 9px !important;
  }
  html body #guest-tribute .guest-tribute-inner-heading .section-nav-emblem {
    width: 36px !important;
    height: 36px !important;
  }
  html body #guest-tribute .guest-tribute-inner-heading .eyebrow {
    font-size: 15px !important;
    letter-spacing: .11em !important;
  }
  html body #guest-tribute .guest-four-stage-grid .journey-stage-number {
    width: 38px !important;
    height: 38px !important;
  }
  html body #guest-tribute .journey-hoop-row--ornamental .journey-hoop > em {
    font-size: 8.5px !important;
  }
  html body #guest-tribute .journey-hoop-row--ornamental .guided-step-requirement {
    font-size: 6.8px !important;
  }
}

/* v75 final vertical-reference parity corrections. */
html body #guest-tribute .guest-four-stage-grid .tribute-write,
html body #guest-tribute .guest-four-stage-grid .tribute-media {
  height: auto !important;
}
html body #guest-tribute .guest-four-stage-grid .experience-carousel--embedded,
html body #guest-tribute .guest-four-stage-grid .field-row-3,
html body #guest-tribute .guest-four-stage-grid .field-row-2 {
  grid-template-columns: 1fr !important;
}
html body #guest-tribute .guest-four-stage-grid .field-row-3 > :last-child {
  grid-column: auto !important;
}
html body #guest-tribute .guest-four-stage-grid .journey-stage-requirement {
  display: none !important;
}
html body #guest-tribute .journey-stage-copy {
  margin: -1px 0 12px !important;
  color: #5c4730 !important;
  font: 400 clamp(13px, 1.15vw, 15.5px)/1.45 var(--font-body) !important;
}
html body #guest-tribute .journey-details-advance {
  display: none !important;
}
html body #guest-tribute .guest-four-stage-grid .tribute-media {
  height: auto !important;
  min-height: 250px !important;
}
@media (max-width: 700px) {
  html body #guest-tribute .guest-four-stage-grid .tribute-media {
    min-height: 0 !important;
  }
}

/* ======================================================================
   v76 — Guest Tribute Stage 3 Attach Memories vertical balance
   Keep the media subsection content-sized and give it exactly equal
   responsive breathing room above and below on every viewport.
   ====================================================================== */
html body #guest-tribute .guest-four-stage-grid .journey-stage--details .tribute-media {
  min-height: 0 !important;
  height: auto !important;
  padding-top: clamp(18px, 2.15vw, 24px) !important;
  padding-bottom: clamp(18px, 2.15vw, 24px) !important;
  padding-left: clamp(12px, 2vw, 20px) !important;
  padding-right: clamp(12px, 2vw, 20px) !important;
  justify-content: center !important;
  align-content: center !important;
  gap: clamp(9px, 1.1vw, 11px) !important;
}
html body #guest-tribute .guest-four-stage-grid .journey-stage--details .tribute-media > :first-child {
  margin-top: 0 !important;
}
html body #guest-tribute .guest-four-stage-grid .journey-stage--details .tribute-media > :last-child {
  margin-bottom: 0 !important;
}
@media (max-width: 700px) {
  html body #guest-tribute .guest-four-stage-grid .journey-stage--details .tribute-media {
    padding-top: 16px !important;
    padding-bottom: 16px !important;
    padding-left: 10px !important;
    padding-right: 10px !important;
    gap: 9px !important;
  }
}
@media (max-width: 390px) {
  html body #guest-tribute .guest-four-stage-grid .journey-stage--details .tribute-media {
    padding-top: 14px !important;
    padding-bottom: 14px !important;
  }
}

/* ======================================================================
   v77 — Guest Tribute readability, proportional controls and true optional Step 3
   ====================================================================== */
/* Keep the introductory statement on a single elegant line whenever the
   viewport has enough room. On phones it may wrap rather than overflow. */
html body #guest-tribute .guest-tribute-inner-heading .lede {
  width: 100% !important;
  max-width: none !important;
  margin-top: 7px !important;
  color: #654c32 !important;
  font: italic 500 clamp(16px, 1.35vw, 19px)/1.45 var(--font-serif, Georgia, serif) !important;
  text-align: left !important;
}
@media (min-width: 901px) {
  html body #guest-tribute .guest-tribute-inner-heading .lede {
    white-space: nowrap !important;
  }
}

/* Stage 1 explanatory sentence aligns with the stage title and options. */
html body #guest-tribute [data-stage-panel="1"] .journey-stage-copy {
  width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  text-align: left !important;
  justify-self: start !important;
}

/* Equal, centered action labels without changing the established button art. */
html body #guest-tribute .experience-card .experience-select,
html body #guest-tribute #tributeSubmitBtn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
  min-height: clamp(42px, 3.5vw, 48px) !important;
  height: auto !important;
  padding: 9px clamp(16px, 2vw, 24px) !important;
  font-size: clamp(13px, 1.05vw, 15px) !important;
  line-height: 1.15 !important;
  white-space: normal !important;
}
html body #guest-tribute .experience-card .experience-select {
  width: 100% !important;
}
html body #guest-tribute #tributeSubmitBtn {
  width: min(100%, 300px) !important;
  min-width: 0 !important;
}

/* Step 3 is optional: no legacy continue control or status language should
   reserve space or imply that optional details are mandatory. */
html body #guest-tribute .journey-details-advance,
html body #guest-tribute #detailsContinueBtn {
  display: none !important;
}

@media (max-width: 700px) {
  html body #guest-tribute .guest-tribute-inner-heading .lede {
    white-space: normal !important;
    font-size: clamp(15.5px, 4.25vw, 17px) !important;
    line-height: 1.48 !important;
  }
  html body #guest-tribute .experience-card .experience-select,
  html body #guest-tribute #tributeSubmitBtn {
    min-height: 44px !important;
    font-size: 14px !important;
  }
}

/* Guest Book viewing controls: proportionate, readable, centered labels while
   preserving the established left/right toolbar alignment. */
html body #guestbook .tribute-tools .view-btn,
html body #guestbook .tribute-tools #calendarToggle {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
  min-height: 44px !important;
  height: auto !important;
  padding: 9px clamp(14px, 1.5vw, 20px) !important;
  font-size: clamp(13px, 1vw, 15px) !important;
  line-height: 1.15 !important;
  white-space: nowrap !important;
}
html body #guestbook .tribute-tools .view-btn {
  min-width: clamp(104px, 8.5vw, 126px) !important;
}
html body #guestbook .tribute-tools #calendarToggle {
  min-width: clamp(142px, 11vw, 166px) !important;
}
@media (max-width: 430px) {
  html body #guestbook .tribute-tools .view-btn,
  html body #guestbook .tribute-tools #calendarToggle {
    min-height: 42px !important;
    font-size: 13.5px !important;
    padding-inline: 12px !important;
  }
  html body #guestbook .tribute-tools .view-btn {
    min-width: 0 !important;
    flex: 1 1 0 !important;
  }
  html body #guestbook .tribute-tools #calendarToggle {
    min-width: 138px !important;
  }
}

/* ======================================================================
   v78 — Guest field italics, compact buttons, outer-tile ornaments,
   and Living Memories lede parity
   ====================================================================== */

/* Only the requested Stage 3 control text is italicized; labels remain roman. */
html body #guest-tribute input[name="name"],
html body #guest-tribute select[name="type"],
html body #guest-tribute select[name="contributorCategory"],
html body #guest-tribute #experienceTitle {
  font-style: italic !important;
  font-family: var(--font-display, Georgia, serif) !important;
}
html body #guest-tribute input[name="name"]::placeholder,
html body #guest-tribute #experienceTitle::placeholder {
  font-style: italic !important;
  font-family: var(--font-display, Georgia, serif) !important;
  opacity: .82 !important;
}
html body #guest-tribute select[name="type"] option,
html body #guest-tribute select[name="contributorCategory"] option {
  font-style: italic !important;
}

/* Compact Guest Tribute action buttons: equal height, centered labels,
   content-focused widths instead of full-card elongation. */
html body #guest-tribute .experience-card .experience-select {
  width: clamp(118px, 10vw, 148px) !important;
  min-width: 118px !important;
  max-width: 148px !important;
  min-height: 44px !important;
  margin: 10px auto 0 !important;
  padding: 9px 16px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
  white-space: nowrap !important;
}
html body #guest-tribute #tributeSubmitBtn {
  width: auto !important;
  min-width: clamp(205px, 18vw, 244px) !important;
  max-width: 260px !important;
  min-height: 46px !important;
  padding: 10px clamp(18px, 2vw, 26px) !important;
  margin-inline: auto !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
  white-space: nowrap !important;
}

/* Guest Book toolbar buttons: compact, equal-height, centered, without
   unnecessary left/right elongation. */
html body #guestbook .tribute-tools .view-btn,
html body #guestbook .tribute-tools #calendarToggle,
html body #guestbook .filter-chips .filter-chip {
  min-height: 42px !important;
  height: 42px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
  line-height: 1 !important;
  white-space: nowrap !important;
}
html body #guestbook .tribute-tools .view-btn {
  width: 108px !important;
  min-width: 108px !important;
  padding-inline: 12px !important;
}
html body #guestbook .tribute-tools #calendarToggle {
  width: 142px !important;
  min-width: 142px !important;
  padding-inline: 12px !important;
}
html body #guestbook .filter-chips .filter-chip {
  width: auto !important;
  min-width: 72px !important;
  padding-inline: 14px !important;
}

/* Traditional centered ornaments belong to the OUTER Guest Tribute tile. */
html body #guest-tribute .guest-tribute-combined {
  position: relative !important;
  padding-top: clamp(30px, 3.2vw, 44px) !important;
  padding-bottom: clamp(30px, 3.2vw, 44px) !important;
}
html body #guest-tribute .guest-outer-tile-ornament {
  position: absolute !important;
  left: 50% !important;
  z-index: 5 !important;
  width: min(46%, 520px) !important;
  height: clamp(24px, 2.5vw, 34px) !important;
  transform: translateX(-50%) !important;
  background: url('assets/ornament-divider-5.png') center / contain no-repeat !important;
  opacity: .72 !important;
  pointer-events: none !important;
}
html body #guest-tribute .guest-outer-tile-ornament--top {
  top: 5px !important;
}
html body #guest-tribute .guest-outer-tile-ornament--bottom {
  bottom: 5px !important;
  transform: translateX(-50%) rotate(180deg) !important;
  opacity: .62 !important;
}

/* Exact typography parity with the Guest Book legacy lede. */
html body #living-memories .lm-footnote--intro {
  font-style: italic !important;
  font-family: var(--font-display, Georgia, serif) !important;
  font-size: clamp(23px, 2.4vw, 27px) !important;
  line-height: 1.8 !important;
  font-weight: 400 !important;
  text-align: center !important;
  color: var(--muted) !important;
  width: min(100%, 1040px) !important;
  max-width: 1040px !important;
  margin: clamp(14px, 1.5vw, 18px) auto 0 !important;
  text-wrap: balance !important;
}

@media (max-width: 700px) {
  html body #guest-tribute .experience-card .experience-select {
    width: 132px !important;
    min-width: 132px !important;
    max-width: 132px !important;
    min-height: 44px !important;
    font-size: 14px !important;
  }
  html body #guest-tribute #tributeSubmitBtn {
    width: auto !important;
    min-width: 210px !important;
    max-width: calc(100% - 24px) !important;
    white-space: normal !important;
  }
  html body #guestbook .tribute-tools .view-btn {
    width: 104px !important;
    min-width: 104px !important;
    flex: 0 0 104px !important;
  }
  html body #guestbook .tribute-tools #calendarToggle {
    width: 138px !important;
    min-width: 138px !important;
  }
  html body #guest-tribute .guest-outer-tile-ornament {
    width: min(62%, 360px) !important;
    height: 26px !important;
  }
  html body #living-memories .lm-footnote--intro {
    font-size: clamp(20px, 5vw, 23px) !important;
    line-height: 1.7 !important;
  }
}

@media (max-width: 430px) {
  html body #guestbook .tribute-tools .view-toggle {
    gap: 8px !important;
  }
  html body #guestbook .tribute-tools .view-btn {
    width: auto !important;
    min-width: 96px !important;
    flex: 0 0 auto !important;
    padding-inline: 11px !important;
  }
  html body #guestbook .tribute-tools #calendarToggle {
    width: auto !important;
    min-width: 130px !important;
    padding-inline: 11px !important;
  }
  html body #guest-tribute .guest-outer-tile-ornament {
    width: 72% !important;
    max-width: 300px !important;
    height: 24px !important;
  }
  html body #guest-tribute .guest-tribute-combined {
    padding-top: 32px !important;
    padding-bottom: 32px !important;
  }
  html body #living-memories .lm-footnote--intro {
    font-size: 20px !important;
    line-height: 1.65 !important;
  }
}

/* ======================================================================
   v79 — Stage 3 Attach Memories internal vertical rhythm
   Balance the heading, upload controls, progress rows and attachment note
   with one consistent row gap and equal top/bottom breathing room.
   ====================================================================== */
html body #guest-tribute .guest-four-stage-grid .journey-stage--details .tribute-media {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  align-content: start !important;
  justify-content: stretch !important;
  row-gap: clamp(12px, 1.25vw, 16px) !important;
  padding-top: clamp(20px, 2vw, 24px) !important;
  padding-bottom: clamp(20px, 2vw, 24px) !important;
  padding-left: clamp(12px, 2vw, 20px) !important;
  padding-right: clamp(12px, 2vw, 20px) !important;
  min-height: 0 !important;
  height: auto !important;
}
html body #guest-tribute .guest-four-stage-grid .journey-stage--details .tribute-media .media-head {
  display: grid !important;
  gap: 4px !important;
  width: 100% !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  align-content: start !important;
}
html body #guest-tribute .guest-four-stage-grid .journey-stage--details .tribute-media .media-head h4,
html body #guest-tribute .guest-four-stage-grid .journey-stage--details .tribute-media .media-head p {
  margin: 0 !important;
}
html body #guest-tribute .guest-four-stage-grid .journey-stage--details .tribute-media .media-optional-label {
  margin: 0 !important;
  padding: 0 !important;
}
html body #guest-tribute .guest-four-stage-grid .journey-stage--details .tribute-media .upload-grid {
  width: min(100%, 690px) !important;
  margin: 0 auto !important;
}
html body #guest-tribute .guest-four-stage-grid .journey-stage--details .tribute-media .tracker-state {
  width: min(100%, 690px) !important;
  margin: 0 auto !important;
  display: grid !important;
  row-gap: 6px !important;
}
html body #guest-tribute .guest-four-stage-grid .journey-stage--details .tribute-media .admin-review-callout--optional {
  width: min(100%, 690px) !important;
  margin: 0 auto !important;
}

@media (max-width: 700px) {
  html body #guest-tribute .guest-four-stage-grid .journey-stage--details .tribute-media {
    row-gap: 11px !important;
    padding-top: 18px !important;
    padding-bottom: 18px !important;
    padding-left: 10px !important;
    padding-right: 10px !important;
  }
}
@media (max-width: 390px) {
  html body #guest-tribute .guest-four-stage-grid .journey-stage--details .tribute-media {
    row-gap: 10px !important;
    padding-top: 16px !important;
    padding-bottom: 16px !important;
  }
}

/* ======================================================================
   v80 — THANK YOU RHYTHM + GUEST TRIBUTE HEADER VISIBILITY
   ====================================================================== */
/* Thank You: use the exact same responsive font-size formula as the
   Admin Moderation introductory lede, and keep only a small measured gap
   before the first thank-you statement. */
html body #thanks .thanks-exit-note {
  font-family: var(--font-display) !important;
  font-style: italic !important;
  font-size: min(clamp(23px, 2.4vw, 27px), 1.39vw) !important;
  line-height: 1.7 !important;
  width: min(100%, 1160px) !important;
  margin: 0 auto clamp(7px, .75vw, 11px) !important;
  text-align: center !important;
  text-align-last: center !important;
  text-wrap: balance !important;
}
html body #thanks .thanks-message-card {
  margin-top: 0 !important;
  padding-top: clamp(4px, .55vw, 8px) !important;
}

/* Guest Tribute header: let the introduction use the full inner-tile width,
   reduce it only enough to remain fully visible, and place the Meaningful
   Contribution badge centered immediately underneath it. */
html body #guest-tribute .guest-tribute-heading-row {
  display: grid !important;
  grid-template-columns: 1fr !important;
  align-items: start !important;
  justify-items: stretch !important;
  gap: clamp(8px, .9vw, 12px) !important;
}
html body #guest-tribute .guest-tribute-inner-heading {
  width: 100% !important;
  max-width: none !important;
}
html body #guest-tribute .guest-tribute-inner-heading .lede {
  width: 100% !important;
  max-width: none !important;
  font: italic 500 clamp(14px, 1.05vw, 16.5px)/1.46 var(--font-serif, Georgia, serif) !important;
  white-space: normal !important;
  overflow: visible !important;
  text-overflow: clip !important;
}
html body #guest-tribute .guest-meaningful-badge {
  justify-self: center !important;
  align-self: center !important;
  margin: 0 auto !important;
  text-align: center !important;
}

@media (min-width: 901px) {
  html body #guest-tribute .guest-tribute-inner-heading .lede {
    white-space: nowrap !important;
  }
}
@media (max-width: 900px) {
  html body #thanks .thanks-exit-note {
    font-size: clamp(18px, 3vw, 22px) !important;
    line-height: 1.7 !important;
    margin-bottom: 9px !important;
  }
  html body #thanks .thanks-message-card {
    padding-top: 5px !important;
  }
  html body #guest-tribute .guest-tribute-inner-heading .lede {
    font-size: clamp(14px, 2.25vw, 16px) !important;
    line-height: 1.5 !important;
    white-space: normal !important;
  }
}
@media (max-width: 700px) {
  html body #thanks .thanks-exit-note {
    margin-bottom: 7px !important;
  }
  html body #thanks .thanks-message-card {
    padding-top: 3px !important;
  }
  html body #guest-tribute .guest-tribute-heading-row {
    gap: 8px !important;
  }
  html body #guest-tribute .guest-meaningful-badge {
    justify-self: center !important;
  }
}

/* ======================================================================
   v81 — INTERACTION HOT PATH + THANK-YOU 95% TRANSPARENT GLASS TILE
   ====================================================================== */
/* Foundational Legacy: keep the 3D motion, but complete the visible move in
   roughly two compositor frames. No colour/filter/shadow interpolation is
   allowed on the hot path. */
html body #foundation .foundation-highlights > span {
  transition-property: transform, opacity !important;
  transition-duration: 26ms, 20ms !important;
  transition-timing-function: cubic-bezier(.12,.94,.18,1), linear !important;
  transition-delay: 0ms !important;
  will-change: transform, opacity !important;
  transform-origin: 50% 50% !important;
}
html body #foundation .foundation-coverflow-dot::before,
html body #foundation .foundation-coverflow-nav {
  transition-duration: 18ms !important;
  transition-delay: 0ms !important;
}

/* Virtues + Academic: the selected colour state is immediate; only the tiny
   lift motion interpolates, eliminating the long colour-change tail. */
html body #virtues .virtue-filmstrip-tab,
html body #academic .academic-filmstrip-tab {
  transition-property: transform !important;
  transition-duration: 18ms !important;
  transition-timing-function: cubic-bezier(.12,.94,.18,1) !important;
  transition-delay: 0ms !important;
  will-change: transform !important;
}
html body #virtues .virtue-filmstrip-tab::after,
html body #virtues .virtue-filmstrip-icon,
html body #academic .academic-filmstrip-tab::after,
html body #academic .academic-filmstrip-icon {
  transition-duration: 16ms !important;
  transition-delay: 0ms !important;
}
html body #virtues #virtueStepStage,
html body #academic #tabPanel,
html body #virtues .virtue-panel-view,
html body #academic .academic-topic-view {
  animation: none !important;
  transition: none !important;
}

/* Thank You: reintroduce the traditional message tile as a true 95%
   transparent glass surface (only ~5% visible fill). Existing comet, corner,
   sparkle, divider and entrance effects remain on the same DOM elements. */
html body #thanks .thanks-message-card {
  position: relative !important;
  width: min(100%, 980px) !important;
  margin: 0 auto clamp(18px, 2.1vw, 28px) !important;
  padding: clamp(24px, 3.2vw, 38px) clamp(20px, 4vw, 48px) !important;
  border: 1px solid rgba(190,133,39,.34) !important;
  border-radius: clamp(22px, 2.4vw, 32px) !important;
  background:
    radial-gradient(circle at 50% 0%, rgba(255,246,190,.055), transparent 42%),
    linear-gradient(145deg, rgba(255,253,244,.050), rgba(249,239,213,.032)) !important;
  box-shadow:
    0 16px 38px rgba(86,55,18,.07),
    inset 0 1px 0 rgba(255,255,255,.34),
    inset 0 0 30px rgba(229,189,87,.025) !important;
  -webkit-backdrop-filter: blur(12px) saturate(1.06) !important;
  backdrop-filter: blur(12px) saturate(1.06) !important;
  overflow: hidden !important;
  isolation: isolate !important;
}
html body #thanks .thanks-message-card::before {
  content: "" !important;
  display: block !important;
  position: absolute !important;
  inset: 7px !important;
  z-index: -1 !important;
  pointer-events: none !important;
  border: 1px solid rgba(205,161,61,.30) !important;
  border-radius: calc(clamp(22px, 2.4vw, 32px) - 7px) !important;
  background: transparent !important;
  opacity: .82 !important;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.12) !important;
}
html body #thanks .thanks-message-card::after {
  content: "" !important;
  display: block !important;
  position: absolute !important;
  inset: -45% -22% !important;
  z-index: -2 !important;
  pointer-events: none !important;
  background: radial-gradient(ellipse at center, rgba(245,213,121,.055), transparent 58%) !important;
  animation: thanksAuraBreathe 4.6s ease-in-out infinite !important;
}

@media (max-width: 700px) {
  html body #thanks .thanks-message-card {
    width: min(100%, calc(100vw - 28px)) !important;
    padding: 20px 15px !important;
    border-radius: 22px !important;
    -webkit-backdrop-filter: blur(9px) saturate(1.04) !important;
    backdrop-filter: blur(9px) saturate(1.04) !important;
  }
  html body #thanks .thanks-message-card::before {
    inset: 5px !important;
    border-radius: 17px !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  html body #foundation .foundation-highlights > span,
  html body #virtues .virtue-filmstrip-tab,
  html body #academic .academic-filmstrip-tab {
    transition-duration: 0ms !important;
  }
}

/* ======================================================================
   v82 — instant active states, faster Coverflow, Living Memories span
   ====================================================================== */
/* Foundational Legacy: finish the deck move inside a single perceptual beat.
   Keep only compositor properties on the transition path and prevent old
   filter rules from forcing a costly repaint during each selection. */
html body #foundation .foundation-highlights > span {
  transition-property: transform, opacity !important;
  transition-duration: 14ms, 10ms !important;
  transition-timing-function: cubic-bezier(.08,.96,.16,1), linear !important;
  transition-delay: 0ms !important;
  filter: none !important;
  backface-visibility: hidden !important;
  -webkit-backface-visibility: hidden !important;
  contain: layout paint style !important;
}
html body #foundation .foundation-highlights > span.is-active,
html body #foundation .foundation-highlights > span:not(.is-active),
html body #foundation .foundation-highlights > span:not(.is-active):hover {
  filter: none !important;
}
html body #foundation .foundation-coverflow-nav,
html body #foundation .foundation-coverflow-dot::before {
  transition-duration: 10ms !important;
  transition-delay: 0ms !important;
}

/* Virtues + Academic: selected burgundy/gold paint is immediate. Only the
   tiny physical lift remains animated, so pointerdown cannot leave the old
   colour visible while a historical hover transition finishes. */
html body #virtues .virtue-filmstrip-tab,
html body #academic .academic-filmstrip-tab {
  transition-property: transform !important;
  transition-duration: 10ms !important;
  transition-timing-function: cubic-bezier(.08,.96,.16,1) !important;
  transition-delay: 0ms !important;
}
html body #virtues .virtue-filmstrip-icon,
html body #academic .academic-filmstrip-icon {
  transition-property: transform !important;
  transition-duration: 10ms !important;
  transition-delay: 0ms !important;
}
html body #virtues .virtue-filmstrip-tab::after,
html body #academic .academic-filmstrip-tab::after {
  transition: none !important;
}
html body #virtues .virtue-filmstrip-tab[aria-selected="true"],
html body #virtues .virtue-filmstrip-tab.active,
html body #virtues .virtue-filmstrip-tab[aria-current="step"] {
  background:
    radial-gradient(circle at 50% 8%, rgba(255,225,137,.18), transparent 45%),
    linear-gradient(180deg, #7b2230 0%, #681b27 54%, #56141d 100%) !important;
}
html body #academic .academic-filmstrip-tab.active,
html body #academic .academic-filmstrip-tab[aria-selected="true"] {
  background:
    radial-gradient(circle at 50% 8%, rgba(255,225,137,.18), transparent 45%),
    linear-gradient(180deg, #7b2230 0%, #681b27 54%, #56141d 100%) !important;
}

/* Living Memories: the explanatory line uses the exact horizontal span of
   the cinema + Choose a Memory browser on wide screens. */
html body #living-memories .section-heading {
  width: min(100%, 1420px) !important;
  max-width: 1420px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}
html body #living-memories .lm-footnote--intro {
  width: 100% !important;
  max-width: 1420px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}
@media (max-width: 1080px) {
  html body #living-memories .section-heading,
  html body #living-memories .lm-footnote--intro {
    width: min(100%, 980px) !important;
    max-width: 980px !important;
  }
}

/* Exact size parity: these two sentences share the very same declaration,
   including the mobile breakpoints, rather than merely similar values. */
html body #admin p.lede.lede-italic,
html body #thanks .thanks-exit-note {
  font-size: min(clamp(23px, 2.4vw, 27px), 1.39vw) !important;
  line-height: 1.7 !important;
}
@media (max-width: 900px) {
  html body #admin p.lede.lede-italic,
  html body #thanks .thanks-exit-note {
    font-size: clamp(18px, 3vw, 22px) !important;
    line-height: 1.7 !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  html body #foundation .foundation-highlights > span,
  html body #virtues .virtue-filmstrip-tab,
  html body #academic .academic-filmstrip-tab,
  html body #virtues .virtue-filmstrip-icon,
  html body #academic .academic-filmstrip-icon {
    transition-duration: 0ms !important;
  }
}


/* ======================================================================
   v83 — Guest Tribute email field, preview/public email presentation,
   and Help/Support business contact responsiveness.
   ====================================================================== */
html body #guest-tribute .guest-email-field {
  display: flex !important;
  flex-direction: column !important;
  gap: 6px !important;
  width: 100% !important;
  margin: 0 0 clamp(12px, 1.2vw, 18px) !important;
  min-width: 0 !important;
}
html body #guest-tribute .guest-email-field input {
  width: 100% !important;
  min-width: 0 !important;
  min-height: 48px !important;
}
html body #guest-tribute .guest-email-note {
  display: block !important;
  margin-top: 2px !important;
  color: var(--muted, #755f42) !important;
  font-size: clamp(12px, .82vw, 14px) !important;
  line-height: 1.4 !important;
  font-style: italic !important;
}
html body #guest-tribute .preview-selection-summary .preview-email {
  grid-column: 1 / -1 !important;
}
html body #guest-tribute .preview-selection-summary .preview-email,
html body #guest-tribute .preview-selection-summary .preview-email * {
  overflow-wrap: anywhere !important;
  word-break: break-word !important;
}
html body #guestbook .approved-grid > article > .tribute-entry-email {
  width: 100% !important;
  margin: 10px 0 0 !important;
  text-align: right !important;
  font-size: clamp(13px, .95vw, 16px) !important;
  line-height: 1.35 !important;
  overflow-wrap: anywhere !important;
  word-break: break-word !important;
}
html body #guestbook .approved-grid > article > .tribute-entry-email a {
  color: var(--burgundy, #741c29) !important;
  text-decoration: none !important;
  border-bottom: 1px solid rgba(116, 28, 41, .24) !important;
}
html body #guestbook .approved-grid > article > .tribute-entry-email a:hover,
html body #guestbook .approved-grid > article > .tribute-entry-email a:focus-visible {
  border-bottom-color: currentColor !important;
}
html body #help .help-body a[href^="mailto:"],
html body #help .help-body a[href^="tel:"] {
  overflow-wrap: anywhere !important;
  word-break: break-word !important;
}
@media (max-width: 620px) {
  html body #guest-tribute .guest-email-field { margin-bottom: 12px !important; }
  html body #guest-tribute .guest-email-field input {
    min-height: 46px !important;
    font-size: 16px !important;
  }
  html body #guestbook .approved-grid > article > .tribute-entry-email {
    font-size: 14px !important;
    margin-top: 8px !important;
  }
}

/* ======================================================================
   v85 — THANK YOU USES THE SACRED DEDICATION TILE, EXACTLY
   ====================================================================== */
/* These two selectors intentionally share the same complete heritage-tile
   paint. Thank You no longer supplies a separate glass/card background. */
html body #sacred .sacred-wisdom-audio-frame,
html body #thanks .thanks-message-card.sacred-tile-parity {
  --parity-wine: #741f2a;
  --parity-wine-deep: #55151d;
  --parity-antique: #b77a1f;
  --parity-gold-soft: #e8c96f;
  --parity-teal: #2f716e;
  position: relative !important;
  box-sizing: border-box !important;
  width: min(100%, 1160px) !important;
  max-width: 1160px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  border: 2px double rgba(151,91,18,.56) !important;
  border-radius: 22px !important;
  background:
    linear-gradient(135deg, rgba(183,122,31,.11) 0 1px, transparent 1px) 15px 15px/28px 28px no-repeat,
    linear-gradient(225deg, rgba(183,122,31,.11) 0 1px, transparent 1px) calc(100% - 15px) 15px/28px 28px no-repeat,
    linear-gradient(45deg, rgba(183,122,31,.11) 0 1px, transparent 1px) 15px calc(100% - 15px)/28px 28px no-repeat,
    linear-gradient(315deg, rgba(183,122,31,.11) 0 1px, transparent 1px) calc(100% - 15px) calc(100% - 15px)/28px 28px no-repeat,
    radial-gradient(circle at 50% -8%, rgba(232,201,111,.22), transparent 31%),
    radial-gradient(circle at 8% 48%, rgba(116,31,42,.04), transparent 26%),
    radial-gradient(circle at 92% 48%, rgba(47,113,110,.04), transparent 26%),
    linear-gradient(180deg, rgba(255,253,247,.99), rgba(249,238,211,.95)) !important;
  box-shadow:
    0 20px 52px rgba(73,39,8,.11),
    inset 0 0 0 4px rgba(255,255,255,.70),
    inset 0 0 0 6px rgba(183,122,31,.10),
    inset 0 0 42px rgba(183,122,31,.035) !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  isolation: isolate !important;
  overflow: hidden !important;
}

/* The former Thank You inner border and aura are replaced by the exact two
   Sacred heritage medallions. This removes its old tile background entirely. */
html body #sacred .sacred-wisdom-audio-frame::before,
html body #sacred .sacred-wisdom-audio-frame::after,
html body #thanks .thanks-message-card.sacred-tile-parity::before,
html body #thanks .thanks-message-card.sacred-tile-parity::after {
  content: "◆" !important;
  position: absolute !important;
  top: 16px !important;
  width: 28px !important;
  height: 28px !important;
  display: grid !important;
  place-items: center !important;
  border: 0 !important;
  border-radius: 50% !important;
  color: var(--parity-wine) !important;
  background: radial-gradient(circle, #fff8df 0 48%, #e8c96f 50% 65%, #9a5c16 67% 72%, transparent 73%) !important;
  font: 700 9px/1 Georgia, serif !important;
  opacity: .78 !important;
  filter: drop-shadow(0 3px 4px rgba(83,43,7,.14)) !important;
  pointer-events: none !important;
  z-index: 5 !important;
  animation: none !important;
}
html body #sacred .sacred-wisdom-audio-frame::before,
html body #thanks .thanks-message-card.sacred-tile-parity::before { left: 16px !important; right: auto !important; }
html body #sacred .sacred-wisdom-audio-frame::after,
html body #thanks .thanks-message-card.sacred-tile-parity::after { right: 16px !important; left: auto !important; }

/* Thank You now contains the same top/bottom heritage ornaments that are
   already present inside Sacred Dedication's tile. */
html body #thanks .thanks-message-card.sacred-tile-parity {
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
}
html body #thanks .thanks-message-card.sacred-tile-parity .heritage-outer-ornament--top {
  order: 0 !important;
  width: min(100%, 860px) !important;
  height: clamp(24px, 2.6vw, 34px) !important;
  margin: 0 auto clamp(4px, .7vw, 8px) !important;
}
html body #thanks .thanks-message-card.sacred-tile-parity .thanks-message--first { order: 1 !important; }
html body #thanks .thanks-message-card.sacred-tile-parity .thanks-light-divider { order: 2 !important; }
html body #thanks .thanks-message-card.sacred-tile-parity .thanks-message--second { order: 3 !important; }
html body #thanks .thanks-message-card.sacred-tile-parity .heritage-outer-ornament--bottom {
  order: 4 !important;
  width: min(100%, 860px) !important;
  height: clamp(24px, 2.6vw, 34px) !important;
  margin: clamp(6px, .8vw, 10px) auto 0 !important;
}

/* Both tiles use the same existing comet, corner-glint, sparkle and entrance
   effects; this rule gives Thank You Sacred's same entrance timing. */
html body #thanks.in-view .thanks-message-card.sacred-tile-parity,
html body #sacred.in-view .sacred-wisdom-audio-frame {
  animation: thanksCardArrive 1s .16s cubic-bezier(.2, .72, .2, 1) both !important;
}

@media (max-width: 700px) {
  html body #sacred .sacred-wisdom-audio-frame,
  html body #thanks .thanks-message-card.sacred-tile-parity {
    width: min(100%, calc(100vw - 28px)) !important;
    border-radius: 22px !important;
  }
  html body #thanks .thanks-message-card.sacred-tile-parity .heritage-outer-ornament--top,
  html body #thanks .thanks-message-card.sacred-tile-parity .heritage-outer-ornament--bottom {
    height: 24px !important;
  }
}
@media (prefers-reduced-motion: reduce) {
  html body #thanks.in-view .thanks-message-card.sacred-tile-parity,
  html body #sacred.in-view .sacred-wisdom-audio-frame { animation: none !important; }
}

/* ======================================================================
   v86 — 96% TRANSPARENT HERITAGE TILES + TYPOGRAPHIC PARITY
   ====================================================================== */
/* One declaration governs both requested sentences, including the phone
   breakpoint, so their computed font size is always exactly identical. */
html body #help .section-heading p.lede.lede-italic,
html body #thanks .thanks-exit-note {
  font-size: clamp(23px, 2.4vw, 27px) !important;
  line-height: 1.7 !important;
}

/* Shared 96%-transparent base: the colourful heritage marks remain above the
   clear surface, while the solid parchment layer is only 4% opaque. */
html body #sacred .sacred-wisdom-audio-frame,
html body #thanks .thanks-message-card.sacred-tile-parity {
  border-color: rgba(191, 133, 30, .76) !important;
  background:
    linear-gradient(135deg, rgba(232, 188, 80, .36) 0 1px, transparent 1px) 15px 15px/28px 28px no-repeat,
    linear-gradient(225deg, rgba(232, 188, 80, .36) 0 1px, transparent 1px) calc(100% - 15px) 15px/28px 28px no-repeat,
    linear-gradient(45deg, rgba(232, 188, 80, .36) 0 1px, transparent 1px) 15px calc(100% - 15px)/28px 28px no-repeat,
    linear-gradient(315deg, rgba(232, 188, 80, .36) 0 1px, transparent 1px) calc(100% - 15px) calc(100% - 15px)/28px 28px no-repeat,
    radial-gradient(circle at 50% -8%, rgba(245, 208, 104, .30), transparent 31%),
    radial-gradient(circle at 8% 48%, rgba(135, 38, 52, .12), transparent 26%),
    radial-gradient(circle at 92% 48%, rgba(47, 113, 110, .14), transparent 26%),
    linear-gradient(180deg, rgba(255, 253, 247, .04), rgba(249, 238, 211, .04)) !important;
  box-shadow:
    0 16px 38px rgba(73,39,8,.10),
    inset 0 0 0 1px rgba(255,255,255,.32),
    inset 0 0 26px rgba(232,188,80,.10),
    0 0 0 1px rgba(47,113,110,.08) !important;
  animation:
    thanksCardArrive 1s .16s cubic-bezier(.2, .72, .2, 1) both,
    heritageTileGlow 7.2s 1.15s ease-in-out infinite !important;
}

/* A quiet breathing halo gives both tiles the same refined, living glow
   without moving their copy or interfering with buttons/audio controls. */
@keyframes heritageTileGlow {
  0%, 100% {
    border-color: rgba(191, 133, 30, .62);
    box-shadow: 0 16px 38px rgba(73,39,8,.08), inset 0 0 0 1px rgba(255,255,255,.26), inset 0 0 22px rgba(232,188,80,.07), 0 0 0 1px rgba(47,113,110,.06);
  }
  50% {
    border-color: rgba(232, 188, 80, .88);
    box-shadow: 0 18px 42px rgba(73,39,8,.11), inset 0 0 0 1px rgba(255,250,219,.42), inset 0 0 34px rgba(232,188,80,.17), 0 0 24px rgba(47,113,110,.16);
  }
}

@media (max-width: 900px) {
  html body #help .section-heading p.lede.lede-italic,
  html body #thanks .thanks-exit-note {
    font-size: clamp(18px, 3vw, 22px) !important;
    line-height: 1.7 !important;
  }
}
@media (prefers-reduced-motion: reduce) {
  html body #sacred .sacred-wisdom-audio-frame,
  html body #thanks .thanks-message-card.sacred-tile-parity {
    animation: none !important;
  }
}

/* ======================================================================
   v89 — LIVING MEMORIES: SACRED 96% TRANSPARENT HERITAGE COVERFLOW
   The player remains the existing single-video experience; this layer only
   supplies the requested shared Sacred Dedication surface and presentation.
   ====================================================================== */
html body #living-memories .lm-heritage-tile {
  border-color: rgba(191, 133, 30, .76) !important;
  background:
    linear-gradient(135deg, rgba(232, 188, 80, .36) 0 1px, transparent 1px) 15px 15px/28px 28px no-repeat,
    linear-gradient(225deg, rgba(232, 188, 80, .36) 0 1px, transparent 1px) calc(100% - 15px) 15px/28px 28px no-repeat,
    linear-gradient(45deg, rgba(232, 188, 80, .36) 0 1px, transparent 1px) 15px calc(100% - 15px)/28px 28px no-repeat,
    linear-gradient(315deg, rgba(232, 188, 80, .36) 0 1px, transparent 1px) calc(100% - 15px) calc(100% - 15px)/28px 28px no-repeat,
    radial-gradient(circle at 50% -8%, rgba(245, 208, 104, .30), transparent 31%),
    radial-gradient(circle at 8% 48%, rgba(135, 38, 52, .12), transparent 26%),
    radial-gradient(circle at 92% 48%, rgba(47, 113, 110, .14), transparent 26%),
    linear-gradient(180deg, rgba(255, 253, 247, .04), rgba(249, 238, 211, .04)) !important;
  box-shadow:
    0 16px 38px rgba(73,39,8,.10),
    inset 0 0 0 1px rgba(255,255,255,.32),
    inset 0 0 26px rgba(232,188,80,.10),
    0 0 0 1px rgba(47,113,110,.08) !important;
  isolation: isolate !important;
  overflow: hidden !important;
  animation:
    thanksCardArrive 1s .16s cubic-bezier(.2, .72, .2, 1) both,
    heritageTileGlow 7.2s 1.15s ease-in-out infinite !important;
}
html body #living-memories .lm-heritage-tile .lm-experience-layout,
html body #living-memories .lm-heritage-tile .heritage-outer-ornament {
  position: relative;
  z-index: 2;
}
html body #living-memories .lm-heritage-tile .heritage-outer-ornament--top {
  margin-bottom: clamp(10px, 1.4vw, 18px) !important;
}
html body #living-memories .lm-heritage-glowline,
html body #living-memories .lm-heritage-corner,
html body #living-memories .lm-heritage-spark {
  position: absolute !important;
  z-index: 4 !important;
  pointer-events: none !important;
}
html body #living-memories .lm-heritage-glowline {
  inset: 0 !important;
  overflow: hidden !important;
  border-radius: inherit !important;
}
html body #living-memories .lm-heritage-glowline::before {
  content: "";
  position: absolute;
  left: -42%;
  top: -2px;
  width: 42%;
  height: 2px;
  border-radius: 999px;
  background: linear-gradient(90deg, transparent, #f2d779 42%, #fff6c8 62%, #2f716e 100%);
  box-shadow: 0 0 10px rgba(240, 215, 121, .64);
  animation: thanksCardComet 5.4s ease-in-out infinite;
}
html body #living-memories .lm-heritage-corner {
  width: 34px;
  height: 34px;
  opacity: .56;
}
html body #living-memories .lm-heritage-corner::before,
html body #living-memories .lm-heritage-corner::after {
  content: "";
  position: absolute;
  background: linear-gradient(90deg, #a96628, #e2bd55, #2f716e);
  border-radius: 999px;
  transform-origin: center;
  animation: thanksCornerGlint 3.8s ease-in-out infinite;
}
html body #living-memories .lm-heritage-corner::before { width: 32px; height: 1px; }
html body #living-memories .lm-heritage-corner::after { width: 1px; height: 32px; }
html body #living-memories .lm-heritage-corner--tl { left: 16px; top: 16px; }
html body #living-memories .lm-heritage-corner--br { right: 16px; bottom: 16px; transform: rotate(180deg); }
html body #living-memories .lm-heritage-corner--br::before,
html body #living-memories .lm-heritage-corner--br::after { animation-delay: -1.9s; }
html body #living-memories .lm-heritage-spark {
  color: #d3a132;
  line-height: 1;
  text-shadow: 0 0 7px rgba(255, 224, 128, .95), 0 0 18px rgba(188, 126, 29, .46);
  animation: thanksSparkle 3.1s ease-in-out infinite;
}
html body #living-memories .lm-heritage-spark--1 { top: 12%; left: 6%; font-size: 17px; }
html body #living-memories .lm-heritage-spark--2 { top: 23%; right: 8%; font-size: 20px; color: #2f716e; animation-delay: -.8s; }
html body #living-memories .lm-heritage-spark--3 { bottom: 18%; left: 9%; font-size: 18px; animation-delay: -1.6s; }
html body #living-memories .lm-heritage-spark--4 { bottom: 12%; right: 7%; font-size: 14px; animation-delay: -2.3s; }

/* Coverflow styling is intentionally limited to the chooser. The existing
   filmstrip remains keyboard reachable and continues to drive the same player. */
html body #living-memories .lm-memory-browser {
  border-left-color: rgba(183, 133, 45, .42) !important;
}
html body #living-memories .lm-memory-browser::before {
  background: linear-gradient(90deg, rgba(116,31,42,.76), #e2bd55 55%, rgba(47,113,110,.76)) !important;
  box-shadow: 0 2px 10px rgba(214,169,53,.15);
}
html body #living-memories .lm-memory-browser .lm-reel-heading--with-position {
  display: grid !important;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: start;
  gap: 10px;
}
html body #living-memories .lm-coverflow-count {
  display: grid !important;
  place-items: center;
  width: 39px;
  height: 39px;
  margin-top: 1px;
  border: 1px solid rgba(154, 92, 22, .82);
  border-radius: 50%;
  color: #704616;
  background: radial-gradient(circle at 34% 27%, #fff5c5 0 12%, #e9ca70 44%, #bb8430 100%);
  box-shadow: inset 0 1px 0 rgba(255,255,238,.82), 0 5px 12px rgba(81,48,8,.13);
  font: 700 1.02rem/1 Georgia, serif;
}
html body #living-memories .lm-memory-browser .lm-reel-heading h4 {
  color: #741f2a !important;
  font-family: Georgia, serif;
  letter-spacing: -.01em;
}
html body #living-memories .lm-memory-browser .lm-reel-heading h4 small {
  color: #7a6745 !important;
  font-family: Georgia, serif;
  font-size: .88rem !important;
  line-height: 1.35;
}
html body #living-memories .lm-memory-browser .lm-list-position {
  color: #7d622c !important;
  border-color: rgba(183, 133, 45, .50) !important;
  background: rgba(255, 250, 232, .34) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.42), 0 5px 13px rgba(73,43,8,.06) !important;
}
html body #living-memories .lm-memory-browser .lm-reel {
  perspective: 1050px;
  scrollbar-color: rgba(154,92,22,.76) rgba(139,91,25,.10);
}
html body #living-memories .lm-memory-browser .lm-memory-card {
  position: relative;
  transform: perspective(900px) rotateY(-4deg) translateX(-4px) scale(.975) !important;
  transform-origin: center right;
  transform-style: preserve-3d;
  border-color: rgba(164, 113, 36, .46) !important;
  background: linear-gradient(135deg, rgba(255,253,245,.30), rgba(244,218,158,.15)) !important;
  box-shadow: 0 9px 20px rgba(73,39,8,.08), inset 0 1px 0 rgba(255,255,255,.38) !important;
  transition: transform .36s cubic-bezier(.2,.72,.2,1), border-color .3s ease, box-shadow .3s ease, background .3s ease, filter .3s ease !important;
}
html body #living-memories .lm-memory-browser .lm-memory-card:nth-child(even) {
  transform: perspective(900px) rotateY(4deg) translateX(4px) scale(.975) !important;
  transform-origin: center left;
}
html body #living-memories .lm-memory-browser .lm-memory-card::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  pointer-events: none;
  background: linear-gradient(115deg, transparent 28%, rgba(255,245,191,.28) 49%, transparent 66%);
  opacity: .24;
  transform: translateX(-120%);
  transition: transform .7s ease, opacity .3s ease;
}
html body #living-memories .lm-memory-browser .lm-memory-card:hover,
html body #living-memories .lm-memory-browser .lm-memory-card:focus-visible {
  transform: perspective(900px) rotateY(-2deg) translateY(-4px) scale(1) !important;
  border-color: rgba(183, 122, 31, .82) !important;
  box-shadow: 0 15px 28px rgba(73,39,8,.14), 0 0 0 1px rgba(232,201,111,.22) !important;
}
html body #living-memories .lm-memory-browser .lm-memory-card:nth-child(even):hover,
html body #living-memories .lm-memory-browser .lm-memory-card:nth-child(even):focus-visible {
  transform: perspective(900px) rotateY(2deg) translateY(-4px) scale(1) !important;
}
html body #living-memories .lm-memory-browser .lm-memory-card:hover::after,
html body #living-memories .lm-memory-browser .lm-memory-card:focus-visible::after {
  opacity: .72;
  transform: translateX(120%);
}
html body #living-memories .lm-memory-browser .lm-memory-card.is-active,
html body #living-memories .lm-memory-browser .lm-memory-card.is-active:hover,
html body #living-memories .lm-memory-browser .lm-memory-card.is-active:focus-visible {
  transform: perspective(900px) rotateY(0) translateY(-1px) scale(1.018) !important;
  transform-origin: center;
  border-color: rgba(183, 122, 31, .90) !important;
  background: radial-gradient(circle at 25% 0, rgba(245,208,104,.32), transparent 46%), linear-gradient(135deg, rgba(255,253,245,.45), rgba(160,94,30,.17)) !important;
  box-shadow: 0 0 0 2px rgba(232,201,111,.24), 0 17px 34px rgba(73,39,8,.16), inset 0 1px 0 rgba(255,255,255,.50) !important;
  filter: saturate(1.1);
  z-index: 2;
}
html body #living-memories .lm-memory-browser .lm-memory-card.is-active .lm-thumb {
  box-shadow: 0 0 0 1px rgba(255,244,188,.50), 0 8px 18px rgba(116,31,42,.16);
}
html body #living-memories .lm-memory-browser .lm-memory-card.is-active::after {
  animation: lmCoverflowGleam 5.8s 1.1s ease-in-out infinite;
  opacity: .64;
}
@keyframes lmCoverflowGleam {
  0%, 56% { transform: translateX(-120%); }
  72%, 82% { transform: translateX(120%); }
  100% { transform: translateX(120%); }
}

@media (max-width: 1080px) {
  html body #living-memories .lm-memory-browser {
    border-left: 0 !important;
    border-top-color: rgba(183, 133, 45, .42) !important;
  }
  html body #living-memories .lm-memory-browser .lm-memory-card,
  html body #living-memories .lm-memory-browser .lm-memory-card:nth-child(even) {
    transform: perspective(900px) rotateY(-3deg) translateX(-2px) scale(.98) !important;
    transform-origin: center right;
  }
  html body #living-memories .lm-memory-browser .lm-memory-card.is-active {
    transform: perspective(900px) rotateY(0) translateY(-1px) scale(1.015) !important;
  }
}
@media (max-width: 650px) {
  html body #living-memories .lm-heritage-tile {
    width: min(100%, calc(100vw - 28px)) !important;
    padding: 22px 14px !important;
  }
  html body #living-memories .lm-heritage-tile .heritage-outer-ornament {
    height: 24px !important;
  }
  html body #living-memories .lm-heritage-corner--tl { left: 12px; top: 12px; }
  html body #living-memories .lm-heritage-corner--br { right: 12px; bottom: 12px; }
  html body #living-memories .lm-heritage-corner::before { width: 26px; }
  html body #living-memories .lm-heritage-corner::after { height: 26px; }
  html body #living-memories .lm-heritage-spark--1 { left: 3%; }
  html body #living-memories .lm-heritage-spark--2 { right: 4%; }
  html body #living-memories .lm-heritage-spark--3 { left: 4%; }
  html body #living-memories .lm-heritage-spark--4 { right: 3%; }
  html body #living-memories .lm-memory-browser .lm-reel-heading--with-position {
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 7px;
  }
  html body #living-memories .lm-coverflow-count {
    width: 32px;
    height: 32px;
    font-size: .88rem;
  }
  html body #living-memories .lm-memory-browser .lm-reel-heading h4 small {
    font-size: .74rem !important;
  }
  html body #living-memories .lm-memory-browser .lm-memory-card,
  html body #living-memories .lm-memory-browser .lm-memory-card:nth-child(even),
  html body #living-memories .lm-memory-browser .lm-memory-card:hover,
  html body #living-memories .lm-memory-browser .lm-memory-card:focus-visible {
    transform: none !important;
  }
  html body #living-memories .lm-memory-browser .lm-memory-card.is-active {
    transform: translateY(-2px) scale(1.005) !important;
  }
}
@media (prefers-reduced-motion: reduce) {
  html body #living-memories .lm-heritage-tile,
  html body #living-memories .lm-heritage-glowline::before,
  html body #living-memories .lm-heritage-corner::before,
  html body #living-memories .lm-heritage-corner::after,
  html body #living-memories .lm-heritage-spark,
  html body #living-memories .lm-memory-browser .lm-memory-card.is-active::after {
    animation: none !important;
  }
  html body #living-memories .lm-memory-browser .lm-memory-card {
    transition: none !important;
  }
}

/* ======================================================================
   v90 — LIVING MEMORIES VIEWER FIT
   Theatre and Full Screen keep the existing portal/player logic, but use a
   viewport-fitting grid so the selected video receives every available pixel
   after its controls.  `contain` preserves each original portrait/landscape
   aspect ratio and never crops a family film.
   ====================================================================== */
#livingMemoriesCinema.lm-detached-viewer:is(.is-theatre, .is-fullscreen-mode) {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  grid-template-rows: auto minmax(180px, 1fr) auto auto !important;
  align-content: stretch !important;
  align-items: stretch !important;
  gap: clamp(6px, 1vh, 12px) !important;
  min-height: 0 !important;
}
#livingMemoriesCinema.lm-detached-viewer.is-theatre {
  height: calc(100vh - clamp(24px, 4.8vw, 68px)) !important;
  height: calc(100dvh - clamp(24px, 4.8vw, 68px)) !important;
}
#livingMemoriesCinema.lm-detached-viewer.is-fullscreen-mode {
  height: 100vh !important;
  height: 100dvh !important;
}
#livingMemoriesCinema.lm-detached-viewer:is(.is-theatre, .is-fullscreen-mode) .lm-playback-controls {
  grid-row: 1 !important;
  width: min(100%, 760px) !important;
  margin: 0 auto !important;
}
#livingMemoriesCinema.lm-detached-viewer:is(.is-theatre, .is-fullscreen-mode) .lm-frame {
  grid-row: 2 !important;
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: none !important;
  min-height: 0 !important;
  height: 100% !important;
  margin: 0 auto !important;
  padding: clamp(8px, 1.25vw, 16px) !important;
}
#livingMemoriesCinema.lm-detached-viewer:is(.is-theatre, .is-fullscreen-mode) .lm-stage {
  min-height: 0 !important;
  width: 100% !important;
  height: 100% !important;
  max-height: none !important;
  aspect-ratio: auto !important;
}
#livingMemoriesCinema.lm-detached-viewer:is(.is-theatre, .is-fullscreen-mode) .lm-video,
#livingMemoriesCinema.lm-detached-viewer:is(.is-theatre, .is-fullscreen-mode) .lm-poster-fallback {
  display: block !important;
  min-width: 0 !important;
  min-height: 0 !important;
  width: 100% !important;
  height: 100% !important;
  max-width: 100% !important;
  max-height: 100% !important;
  object-fit: contain !important;
  object-position: center center !important;
}
#livingMemoriesCinema.lm-detached-viewer:is(.is-theatre, .is-fullscreen-mode) .lm-video-console {
  grid-row: 3 !important;
  width: min(100%, 840px) !important;
  max-width: 840px !important;
  margin: 0 auto !important;
  padding: 6px 4px 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}
#livingMemoriesCinema.lm-detached-viewer:is(.is-theatre, .is-fullscreen-mode) .lm-caption {
  grid-row: 4 !important;
  width: min(100%, 980px) !important;
  margin: 0 auto !important;
  padding: 0 8px 4px !important;
}
#livingMemoriesCinema.lm-detached-viewer.is-theatre .lm-caption,
#livingMemoriesCinema.lm-detached-viewer.is-theatre .lm-video-status {
  color: var(--text, #4b3620) !important;
}
#livingMemoriesCinema.lm-detached-viewer.is-fullscreen-mode .lm-caption h4,
#livingMemoriesCinema.lm-detached-viewer.is-fullscreen-mode .lm-kicker,
#livingMemoriesCinema.lm-detached-viewer.is-fullscreen-mode .lm-caption > p:not(.lm-kicker),
#livingMemoriesCinema.lm-detached-viewer.is-fullscreen-mode .lm-video-status {
  color: #fff1c6 !important;
}

@media (max-width: 760px), (max-height: 620px) {
  #livingMemoriesCinema.lm-detached-viewer:is(.is-theatre, .is-fullscreen-mode) {
    grid-template-rows: auto minmax(160px, 1fr) auto auto !important;
    gap: 6px !important;
    padding: 8px !important;
  }
  #livingMemoriesCinema.lm-detached-viewer.is-theatre {
    height: calc(100vh - 16px) !important;
    height: calc(100dvh - 16px) !important;
  }
  #livingMemoriesCinema.lm-detached-viewer:is(.is-theatre, .is-fullscreen-mode) .lm-frame {
    padding: 7px !important;
  }
  #livingMemoriesCinema.lm-detached-viewer:is(.is-theatre, .is-fullscreen-mode) .lm-caption {
    padding: 0 4px 2px !important;
  }
  #livingMemoriesCinema.lm-detached-viewer:is(.is-theatre, .is-fullscreen-mode) .lm-caption h4 {
    font-size: clamp(22px, 6vw, 30px) !important;
  }
  #livingMemoriesCinema.lm-detached-viewer:is(.is-theatre, .is-fullscreen-mode) .lm-caption > p:not(.lm-kicker) {
    font-size: 14px !important;
    line-height: 1.35 !important;
  }
  #livingMemoriesCinema.lm-detached-viewer:is(.is-theatre, .is-fullscreen-mode) .lm-actions {
    margin-top: 8px !important;
  }
}

/* ======================================================================
   v91 — DISTINCT THEATRE AND NATIVE FULL SCREEN PRESENTATIONS
   Theatre is intentionally a wide 16:9 cinematic stage inside the browser.
   Full Screen uses the native top layer when the device permits it; its media
   area then fits the actual device viewport rather than Theatre's widescreen
   box. Both keep the original media fully visible with no distortion.
   ====================================================================== */
#livingMemoriesCinema.lm-detached-viewer.is-theatre {
  display: block !important;
  height: auto !important;
  max-height: none !important;
  overflow-y: auto !important;
}
#livingMemoriesCinema.lm-detached-viewer.is-theatre .lm-playback-controls {
  width: min(100%, 760px) !important;
  margin: 0 auto clamp(8px, 1.2vh, 14px) !important;
}
#livingMemoriesCinema.lm-detached-viewer.is-theatre .lm-frame {
  box-sizing: border-box !important;
  width: min(100%, 117.333vh) !important;
  width: min(100%, 117.333dvh) !important;
  max-width: none !important;
  height: auto !important;
  min-height: 0 !important;
  margin: 0 auto !important;
  padding: clamp(8px, 1.25vw, 16px) !important;
  aspect-ratio: auto !important;
}
#livingMemoriesCinema.lm-detached-viewer.is-theatre .lm-stage {
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  aspect-ratio: 16 / 9 !important;
}
#livingMemoriesCinema.lm-detached-viewer.is-theatre .lm-video,
#livingMemoriesCinema.lm-detached-viewer.is-theatre .lm-poster-fallback {
  width: 100% !important;
  height: 100% !important;
  min-width: 0 !important;
  min-height: 0 !important;
  max-width: 100% !important;
  max-height: 100% !important;
  object-fit: contain !important;
  object-position: center center !important;
}
#livingMemoriesCinema.lm-detached-viewer.is-theatre .lm-video-console,
#livingMemoriesCinema.lm-detached-viewer.is-theatre .lm-caption {
  width: min(100%, 980px) !important;
  margin-inline: auto !important;
}

#livingMemoriesCinema.lm-detached-viewer.is-fullscreen-mode:fullscreen {
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  max-height: none !important;
  background: linear-gradient(160deg, #160d08 0%, #090605 100%) !important;
}
#livingMemoriesCinema.lm-detached-viewer.is-fullscreen-mode::backdrop {
  background: #090605 !important;
}

@media (max-width: 760px), (max-height: 620px) {
  #livingMemoriesCinema.lm-detached-viewer.is-theatre .lm-frame {
    width: min(100%, 103.111vh) !important;
    width: min(100%, 103.111dvh) !important;
    height: auto !important;
    padding: 7px !important;
  }
}

/* ======================================================================
   v92 — NATIVE VIDEO FULL SCREEN REPAIR
   Keep the selected poster available beneath the video in the fallback view.
   A video that has not yet reached its first rendered frame therefore never
   becomes a blank black panel while the browser is entering full screen.
   ====================================================================== */
#livingMemoriesCinema.lm-detached-viewer.is-fullscreen-mode .lm-poster-fallback {
  visibility: visible !important;
  opacity: 1 !important;
}
#livingMemoriesCinema.lm-detached-viewer.is-fullscreen-mode #livingMemoryVideo {
  visibility: visible !important;
  background: transparent !important;
}
#livingMemoriesCinema.lm-detached-viewer.is-fullscreen-mode #livingMemoryVideo:fullscreen,
#livingMemoriesCinema.lm-detached-viewer.is-fullscreen-mode #livingMemoryVideo:-webkit-full-screen {
  width: 100vw !important;
  height: 100vh !important;
  max-width: 100vw !important;
  max-height: 100vh !important;
  min-width: 0 !important;
  min-height: 0 !important;
  opacity: 1 !important;
  object-fit: contain !important;
  object-position: center center !important;
  background: #090605 !important;
}

/* ======================================================================
   v94 — LOW-MEMORY TV RENDERING BUDGET
   Modern browsers skip painting/layout work for distant sections. On a
   recognised TV/low-memory browser, JS also pauses only those distant
   sections; all animations resume well before the section is visible.
   ====================================================================== */
@supports (content-visibility: auto) {
  main > .section-panel {
    content-visibility: auto;
    contain-intrinsic-size: auto 980px;
  }
  main > .section-panel.sacred-screen {
    contain-intrinsic-size: auto 760px;
  }
}

html.tv-memory-optimised .section-panel.performance-suspended *,
html.site-tab-hidden .section-panel * {
  animation-play-state: paused !important;
  will-change: auto !important;
}

/* Keep the heritage background visible, but remove its expensive blurred
   compositor layer on constrained TVs. The movement returns unchanged when
   its section approaches the viewport. */
html.tv-memory-optimised .section-panel.performance-suspended .mandala,
html.tv-memory-optimised .section-panel.performance-suspended .mandala::before,
html.tv-memory-optimised .section-panel.performance-suspended .mandala::after {
  filter: none !important;
}

/* A full-page blurred toolbar forces an extra composited surface on several
   TV engines. Its existing colour, border and navigation behaviour remain. */
html.tv-memory-optimised .topbar {
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

html.tv-memory-optimised .mandala-flow .mandala-glow {
  filter: none !important;
}

/* ======================================================================
   v96 — INSTANT INTERACTION FAST PATH
   These three controls change state on pointer-down in JavaScript. Keep the
   visual acknowledgement intentionally short and compositor-only so slower
   televisions and mobile browsers never wait for expensive filter/shadow
   interpolation before the next card is usable.
   ====================================================================== */
#foundation .foundation-coverflow-stage,
#foundation .foundation-highlights > span,
#foundation .foundation-coverflow-nav,
#foundation .foundation-coverflow-dot,
#virtues .virtue-step-dot,
#virtues .virtue-stepper-nav,
#academic .academic-filmstrip-tab,
#academic .academic-stage {
  touch-action: manipulation !important;
  -webkit-tap-highlight-color: transparent;
}

#foundation .foundation-highlights > span {
  transition: transform 75ms cubic-bezier(.2,.8,.2,1), opacity 60ms linear !important;
  will-change: auto;
}
#foundation .foundation-highlights > span,
#foundation .foundation-highlights > span.is-active,
#foundation .foundation-highlights > span:not(.is-active) {
  filter: none !important;
}
#foundation .foundation-highlights > span.is-active::after {
  animation-duration: 5.8s !important;
}

#virtues .virtue-stepper-stage,
#academic .academic-stage {
  transition: opacity 70ms linear, transform 70ms ease-out !important;
  filter: none !important;
}
#virtues .virtue-step-dot,
#virtues .virtue-stepper-nav,
#virtues .virtue-stepper-progress-track > span {
  transition: transform 70ms ease-out, opacity 70ms linear, background-color 70ms linear, border-color 70ms linear, width 70ms linear !important;
}

#academic .academic-filmstrip-tab,
#academic .academic-filmstrip-tab::after,
#academic .academic-filmstrip-icon {
  transition: transform 70ms ease-out, translate 70ms ease-out, opacity 70ms linear, color 70ms linear, border-color 70ms linear, background-color 70ms linear !important;
}
#academic .academic-filmstrip-tab,
#academic .academic-filmstrip-tab.active {
  box-shadow: none !important;
}

html.tv-memory-optimised #foundation .foundation-highlights > span,
html.tv-memory-optimised #virtues .virtue-stepper-stage,
html.tv-memory-optimised #academic .academic-stage,
html.tv-memory-optimised #academic .academic-filmstrip-tab {
  transition-duration: 0ms !important;
}

/* v98 — INSTANT TV/MOBILE SELECTION RESPONSE
   These are selection surfaces, not decorative entrances. Removing their
   transition wait makes the newly chosen Foundation card, Virtue, or Academic
   topic render in the same frame as the input event on every device. */
#foundation .foundation-highlights > span,
#foundation .foundation-highlights > span::before,
#foundation .foundation-highlights > span::after,
#foundation .foundation-coverflow-dot::before,
#virtues .virtue-stepper-stage,
#virtues .virtue-step-dot,
#virtues .virtue-step-dot::before,
#virtues .virtue-stepper-progress-track > span,
#academic .academic-stage,
#academic .academic-filmstrip-tab,
#academic .academic-filmstrip-tab::before,
#academic .academic-filmstrip-tab::after,
#academic .academic-filmstrip-icon {
  transition: none !important;
  animation: none !important;
}

/* ======================================================================
   v99 — ALWAYS-ON FAST INTERACTION BUDGET
   The supplied recordings show the controls competing with global decorative
   work. Keep every section, card, label and control, but reserve rendering
   time for interaction by freezing non-functional ambient motion. */
html.fast-site-mode .live-button-bubbles {
  animation: none !important;
  filter: none !important;
  will-change: auto !important;
}
html.fast-site-mode .live-button-bubbles { display: none !important; }

html.fast-site-mode #foundation .foundation-coverflow-stage *,
html.fast-site-mode #virtues .virtue-guided-stepper *,
html.fast-site-mode #academic .academic-filmstage * {
  animation: none !important;
  filter: none !important;
  will-change: auto !important;
}

/* Paint containment prevents changing one selected card from invalidating the
   rest of the long page. It does not change layout, keyboard, swipe or media. */
html.fast-site-mode #foundation .foundation-coverflow-stage,
html.fast-site-mode #virtues .virtue-stepper-stage,
html.fast-site-mode #academic .academic-stage {
  contain: paint !important;
}

/* ======================================================================
   v101 — OFF-SCREEN SECTION LIFECYCLE
   A parked section keeps its real measured footprint, avoiding scroll jumps.
   Modern browsers can skip off-screen paint/layout work and the lifecycle
   restores the tile before it reaches the reading area. The visual design,
   keyboard access and all controls return unchanged on re-entry.
   ====================================================================== */
@supports (content-visibility: auto) {
  html.fast-site-mode main > .section-panel.section-is-idle {
    content-visibility: auto;
    contain-intrinsic-size: auto 980px;
  }
  html.fast-site-mode main > .section-panel.sacred-screen.section-is-idle {
    contain-intrinsic-size: auto 760px;
  }
}

/* Parking does not alter the page geometry, focus order of the active area,
   or any visitor-entered value. It only removes off-screen animation work
   from the compositor until the observer activates that section again. */
html.fast-site-mode .section-panel.section-is-idle * {
  animation-play-state: paused !important;
  will-change: auto !important;
}

/* v119 — INPUT-PRIORITY WINDOW
   A selection press pauses only the continuously moving background for a
   fraction of a second. The full mandala set stays visible and immediately
   resumes, while the selected Foundation, Virtue or Academic state gets the
   next compositor frame on low-RAM TVs and phones. */
html.selection-priority #mandalaFlow .mandala,
html.selection-priority #mandalaFlow .mandala > svg,
html.selection-priority #mandalaFlow .mandala-glow,
html.selection-priority .mandala-trio .mandala,
html.selection-priority .mandala-trio .mandala > svg,
html.selection-priority .living-bg i {
  animation-play-state: paused !important;
}

/* v120 — Three light, smooth replacements for the oversized rotating
   background mandala. They retain M, N and O as distinct heritage forms,
   but use gentle compositor-only travel and no oversized fixed rotation. */
.mandala-trio .m-trio--one,
.mandala-trio .m-trio--two,
.mandala-trio .m-trio--three {
  animation: none !important;
  will-change: transform;
}
.mandala-trio .m-trio--one {
  width: clamp(76px, 8vw, 132px);
  height: clamp(76px, 8vw, 132px);
  top: 13vh;
  left: 5vw;
  animation: mandalaTrioOne 42s ease-in-out infinite,
             mandalaTint 38s ease-in-out infinite !important;
}
.mandala-trio .m-trio--two {
  width: clamp(112px, 12vw, 188px);
  height: clamp(112px, 12vw, 188px);
  top: 50vh;
  right: 5vw;
  animation: mandalaTrioTwo 54s ease-in-out infinite,
             mandalaTint 46s ease-in-out -9s infinite !important;
}
.mandala-trio .m-trio--three {
  width: clamp(92px, 10vw, 156px);
  height: clamp(92px, 10vw, 156px);
  top: 79vh;
  left: 19vw;
  animation: mandalaTrioThree 48s ease-in-out infinite,
             mandalaTint 42s ease-in-out -17s infinite !important;
}
@keyframes mandalaTrioOne {
  0%, 100% { transform: translate3d(0, 0, 0) rotate(0deg); }
  50% { transform: translate3d(5vw, 3vh, 0) rotate(105deg); }
}
@keyframes mandalaTrioTwo {
  0%, 100% { transform: translate3d(0, 0, 0) rotate(0deg); }
  50% { transform: translate3d(-4vw, 5vh, 0) rotate(-125deg); }
}
@keyframes mandalaTrioThree {
  0%, 100% { transform: translate3d(0, 0, 0) rotate(0deg); }
  50% { transform: translate3d(4vw, -4vh, 0) rotate(92deg); }
}
html.fast-site-mode #mandalaFlow .mandala-glow {
  filter: none !important;
}
@media (max-width: 620px) {
  .mandala-trio .m-trio--one { left: 3vw; top: 16vh; }
  .mandala-trio .m-trio--two { right: 3vw; top: 54vh; }
  .mandala-trio .m-trio--three { left: 13vw; top: 82vh; }
}

/* ======================================================================
   v118 — COMPLETE MANDALA RESTORATION
   The ambient designs are heritage artwork, not disposable loading effects.
   Keep the whole collection behind the site content, including the three
   placed forms, while retaining the existing reduced-motion and hidden-tab
   safeguards. A positive layer fixes the previous negative stacking context
   that could place them behind the page background on TV/mobile browsers.
   ====================================================================== */
.mandala-flow,
.mandala-trio {
  z-index: 0 !important;
}
main {
  position: relative;
  z-index: 1;
}

/* v121 — MANDALA ARTWORK, WITHOUT HALO
   Mandala colour, linework, placement and motion remain untouched.  The
   previous glow came from two independent layers: the radial halo element and
   a drop-shadow filter on the SVG itself.  Both are disabled here, after all
   earlier theme overrides, so this works on every page and device. */
.mandala-glow,
#mandalaFlow .mandala-glow,
.mandala-flow .mandala-glow,
.mandala-trio .mandala-glow,
.threshold .mandala-glow,
.farewell .mandala-glow,
.t-mandala .mandala-glow {
  display: none !important;
  animation: none !important;
  filter: none !important;
  background: transparent !important;
  opacity: 0 !important;
}

.mandala svg,
.mandala-flow .mandala svg,
.mandala-trio .m-trio > svg,
.threshold .t-mandala svg,
.farewell .t-mandala svg {
  /* v122: no longer !important, so the compositor colour filter defined at the
     end of this file can apply. No drop-shadow is reintroduced anywhere. */
  filter: none;
}

/* ======================================================================
   v103 — ADMIN MODERATION STATUS CONTROLS
   These five filters are independent of the changing submission list. They
   remain present after every upload, refresh, empty result or status change,
   with a responsive layout that does not collapse or conceal a button.
   ====================================================================== */
body.admin-portal-body #adminPanel:not(.hidden) .admin-status-controls {
  display: grid !important;
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  width: min(100%, 960px) !important;
  margin-inline: auto !important;
  gap: 10px !important;
  visibility: visible !important;
  opacity: 1 !important;
  overflow: visible !important;
}
body.admin-portal-body #adminPanel:not(.hidden) .admin-status-controls > .filter-btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 0 !important;
  min-height: 48px !important;
  padding: 10px 14px !important;
  visibility: visible !important;
  opacity: 1 !important;
  pointer-events: auto !important;
  position: relative !important;
  z-index: 1 !important;
  color: #301800 !important;
  font-weight: 800 !important;
  line-height: 1.2 !important;
  white-space: normal !important;
}
body.admin-portal-body #adminPanel:not(.hidden) .admin-status-controls > .filter-btn.secondary {
  background: #ffe45f !important;
  box-shadow: 0 0 0 3px rgba(116, 31, 42, .72), 0 0 16px rgba(255, 215, 0, .58) !important;
}
body.admin-portal-body #adminPanel:not(.hidden) .admin-status-controls > .filter-btn:focus-visible {
  outline: 3px solid #741f2a !important;
  outline-offset: 3px !important;
}
@media (max-width: 720px) {
  body.admin-portal-body #adminPanel:not(.hidden) .admin-status-controls {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    width: 100% !important;
  }
  body.admin-portal-body #adminPanel:not(.hidden) .admin-status-controls > .filter-btn:last-child {
    grid-column: 1 / -1 !important;
  }
}

/* ======================================================================
   v104 — ADMIN STATUS RAIL + SCROLLABLE REVIEW WINDOWS
   The status selector has its own horizontal scrolling rail, so none of
   the five moderation sections can be clipped by the surrounding toolbar.
   Each selected section keeps a dedicated scrollable review window.
   ====================================================================== */
body.admin-portal-body #adminPanel:not(.hidden) .admin-status-navigator {
  display: block !important;
  width: min(100%, 1080px) !important;
  margin: 18px auto 12px !important;
  min-width: 0 !important;
  visibility: visible !important;
  opacity: 1 !important;
  position: relative !important;
  z-index: 3 !important;
}
body.admin-portal-body #adminPanel:not(.hidden) .admin-status-navigator-label {
  margin: 0 0 8px !important;
  color: #5b1d27 !important;
  font-family: Georgia, 'Times New Roman', serif !important;
  font-size: 1.05rem !important;
  font-weight: 700 !important;
  letter-spacing: .04em !important;
  text-align: left !important;
}
body.admin-portal-body #adminPanel:not(.hidden) .admin-status-rail {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  overscroll-behavior-inline: contain !important;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
  scrollbar-color: #a46c17 rgba(247, 229, 179, .55);
  border: 1px solid rgba(126, 67, 21, .30) !important;
  border-radius: 16px !important;
  background: rgba(255, 252, 237, .78) !important;
  box-shadow: inset 0 1px rgba(255, 255, 255, .92) !important;
}
body.admin-portal-body #adminPanel:not(.hidden) .admin-status-rail::-webkit-scrollbar { height: 10px; }
body.admin-portal-body #adminPanel:not(.hidden) .admin-status-rail::-webkit-scrollbar-thumb {
  background: linear-gradient(90deg, #d6a130, #8f5512) !important;
  border: 2px solid rgba(255, 249, 224, .88) !important;
  border-radius: 999px !important;
}
body.admin-portal-body #adminPanel:not(.hidden) .admin-status-controls {
  display: flex !important;
  flex-wrap: nowrap !important;
  align-items: stretch !important;
  gap: 10px !important;
  width: max-content !important;
  min-width: 100% !important;
  margin: 0 !important;
  padding: 10px !important;
  overflow: visible !important;
  background: transparent !important;
}
body.admin-portal-body #adminPanel:not(.hidden) .admin-status-controls > .filter-btn {
  display: inline-flex !important;
  flex: 1 0 164px !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 164px !important;
  min-height: 52px !important;
  margin: 0 !important;
  padding: 12px 18px !important;
  position: relative !important;
  isolation: isolate !important;
  overflow: visible !important;
  transform: none !important;
  visibility: visible !important;
  opacity: 1 !important;
  pointer-events: auto !important;
  color: #3f1909 !important;
  background: linear-gradient(180deg, #fff8df 0%, #f6dfa0 54%, #dfa73d 100%) !important;
  border: 1px solid #8f5714 !important;
  border-radius: 12px !important;
  box-shadow: inset 0 1px rgba(255,255,255,.95), 0 2px 5px rgba(86,41,7,.18) !important;
  font-family: Georgia, 'Times New Roman', serif !important;
  font-size: 1rem !important;
  font-weight: 700 !important;
  line-height: 1.15 !important;
  text-align: center !important;
  text-shadow: 0 1px rgba(255,255,255,.52) !important;
  white-space: nowrap !important;
}
body.admin-portal-body #adminPanel:not(.hidden) .admin-status-controls > .filter-btn::before,
body.admin-portal-body #adminPanel:not(.hidden) .admin-status-controls > .filter-btn::after {
  content: none !important;
  display: none !important;
}
body.admin-portal-body #adminPanel:not(.hidden) .admin-status-controls > .filter-btn.secondary,
body.admin-portal-body #adminPanel:not(.hidden) .admin-status-controls > .filter-btn[aria-selected="true"] {
  color: #fff9df !important;
  background: linear-gradient(180deg, #7b2430 0%, #5d1421 100%) !important;
  border-color: #4a0d18 !important;
  box-shadow: inset 0 1px rgba(255,238,180,.42), 0 0 0 3px rgba(230,182,62,.74), 0 5px 12px rgba(80,22,25,.30) !important;
  text-shadow: 0 1px 1px rgba(48,8,14,.72) !important;
}
body.admin-portal-body #adminPanel:not(.hidden) .admin-status-controls > .filter-btn:hover {
  filter: brightness(1.04) !important;
  translate: 0 -1px !important;
}
body.admin-portal-body #adminPanel:not(.hidden) .admin-status-controls > .filter-btn:focus-visible,
body.admin-portal-body #adminPanel:not(.hidden) .admin-status-rail:focus-visible {
  outline: 3px solid #741f2a !important;
  outline-offset: 3px !important;
}
body.admin-portal-body #adminPanel:not(.hidden) .admin-status-window.tribute-window.is-scroll {
  display: block !important;
  width: min(100%, 1080px) !important;
  min-height: 220px !important;
  max-height: min(68svh, 760px) !important;
  margin: 16px auto 0 !important;
  padding: 12px !important;
  overflow-y: scroll !important;
  overflow-x: hidden !important;
  overscroll-behavior: contain !important;
  scrollbar-gutter: stable both-edges;
  border: 1px solid rgba(126, 67, 21, .32) !important;
  border-radius: 16px !important;
  background: rgba(255, 252, 239, .72) !important;
  scrollbar-width: thin;
  scrollbar-color: #a46c17 rgba(247, 229, 179, .55);
}
body.admin-portal-body #adminPanel:not(.hidden) .admin-status-window.tribute-window.is-scroll::-webkit-scrollbar { width: 12px; }
body.admin-portal-body #adminPanel:not(.hidden) .admin-status-window.tribute-window.is-scroll::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, #d6a130, #8f5512) !important;
  border: 3px solid rgba(255, 249, 224, .88) !important;
  border-radius: 999px !important;
}
body.admin-portal-body #adminPanel:not(.hidden) .admin-status-window-title {
  position: sticky !important;
  top: -12px !important;
  z-index: 4 !important;
  margin: -12px -12px 12px !important;
  padding: 12px 14px 10px !important;
  color: #5b1d27 !important;
  background: linear-gradient(180deg, rgba(255,253,242,.98), rgba(255,250,232,.92)) !important;
  border-bottom: 1px solid rgba(166,108,23,.28) !important;
  font-family: Georgia, 'Times New Roman', serif !important;
  font-size: clamp(1.05rem, 2.2vw, 1.22rem) !important;
  line-height: 1.2 !important;
}
body.admin-portal-body #adminPanel:not(.hidden) .admin-status-window .admin-tributes { min-width: 0 !important; }
@media (max-width: 720px) {
  body.admin-portal-body #adminPanel:not(.hidden) .admin-status-navigator { margin-top: 14px !important; }
  body.admin-portal-body #adminPanel:not(.hidden) .admin-status-navigator-label { padding-inline: 2px !important; }
  body.admin-portal-body #adminPanel:not(.hidden) .admin-status-controls { min-width: max-content !important; }
  body.admin-portal-body #adminPanel:not(.hidden) .admin-status-controls > .filter-btn { flex-basis: 146px !important; min-width: 146px !important; }
  body.admin-portal-body #adminPanel:not(.hidden) .admin-status-window.tribute-window.is-scroll { min-height: 190px !important; max-height: 64svh !important; padding: 10px !important; }
  body.admin-portal-body #adminPanel:not(.hidden) .admin-status-window-title { top: -10px !important; margin: -10px -10px 10px !important; }
}

/* ======================================================================
   v102 — GUEST BOOK + GUEST TRIBUTE READING SCALE
   The Guest Book header remains a centred, ceremonial introduction. Its
   italic line and the Guest Tribute Window introduction intentionally share
   the exact same face, size, weight, spacing and line-height. The guided
   contribution flow receives a larger practical type scale for visitors who
   need to read labels, instructions, fields and controls comfortably.
   ====================================================================== */

/* Keep the supplied Guest Book heading composition centred at every width. */
html body #guestbook .section-heading,
html body #guestbook .section-heading > * {
  text-align: center !important;
  text-align-last: center !important;
}
html body #guestbook .section-heading .section-nav-emblem {
  margin-inline: auto !important;
}

/* One exact treatment for the two corresponding introductory statements. */
html body #guestbook .section-heading .lede-italic,
html body #guest-tribute .guest-tribute-inner-heading .lede.lede-italic {
  width: min(100%, 58ch) !important;
  max-width: 58ch !important;
  margin-inline: auto !important;
  color: var(--muted, #755f42) !important;
  font-family: var(--font-display) !important;
  font-size: clamp(21px, 1.8vw, 26px) !important;
  font-weight: 400 !important;
  font-style: italic !important;
  line-height: 1.58 !important;
  letter-spacing: .01em !important;
  text-align: center !important;
  text-align-last: center !important;
}

/* Step titles and explanatory copy. */
html body #guest-tribute .journey-stage-bar-title {
  font-size: clamp(17px, 1.24vw, 20px) !important;
  line-height: 1.28 !important;
}
html body #guest-tribute .journey-stage-number {
  width: 34px !important;
  height: 34px !important;
  flex-basis: 34px !important;
  font-size: 16px !important;
}
html body #guest-tribute .journey-stage-copy,
html body #guest-tribute .embedded-experience-head p,
html body #guest-tribute .journey-stage-intro p,
html body #guest-tribute .detail-tip p,
html body #guest-tribute .milestone-builder-head p,
html body #guest-tribute .media-head p,
html body #guest-tribute .admin-review-callout p {
  font-size: clamp(16px, 1.1vw, 18px) !important;
  line-height: 1.55 !important;
}
html body #guest-tribute .embedded-experience-head h4,
html body #guest-tribute .journey-stage-intro h4,
html body #guest-tribute .detail-tip strong,
html body #guest-tribute .milestone-builder-head strong,
html body #guest-tribute .media-head h4,
html body #guest-tribute .preview-stage-title h4 {
  font-size: clamp(20px, 1.45vw, 24px) !important;
  line-height: 1.28 !important;
}
html body #guest-tribute .embedded-choice-note,
html body #guest-tribute .journey-stage-requirement,
html body #guest-tribute .guided-step-requirement,
html body #guest-tribute .media-optional-label,
html body #guest-tribute .message-word-limit {
  font-size: clamp(12px, .82vw, 14px) !important;
  line-height: 1.35 !important;
}

/* Experience choice cards: clear title, explanation, and action. */
html body #guest-tribute .experience-carousel--embedded .experience-card {
  min-height: 0 !important;
  padding: clamp(17px, 1.6vw, 23px) !important;
}
html body #guest-tribute .experience-carousel--embedded .experience-card h5 {
  font-size: clamp(18px, 1.3vw, 21px) !important;
  line-height: 1.28 !important;
}
html body #guest-tribute .experience-carousel--embedded .experience-card p {
  font-size: clamp(16px, 1.02vw, 18px) !important;
  line-height: 1.5 !important;
}
html body #guest-tribute .experience-carousel--embedded .experience-select,
html body #guest-tribute #tributeSubmitBtn {
  min-height: 50px !important;
  padding: 11px 24px !important;
  font-size: clamp(17px, 1.14vw, 19px) !important;
  line-height: 1.2 !important;
}

/* Writing labels, field values and placeholder directions. */
html body #guest-tribute .tribute-write label {
  font-size: clamp(16px, 1.08vw, 18px) !important;
  line-height: 1.42 !important;
}
html body #guest-tribute .tribute-write label > small {
  font-size: clamp(12px, .78vw, 14px) !important;
  line-height: 1.3 !important;
}
html body #guest-tribute .tribute-write input,
html body #guest-tribute .tribute-write select,
html body #guest-tribute .tribute-write textarea {
  min-height: 50px !important;
  font-size: clamp(16px, 1.04vw, 18px) !important;
  line-height: 1.48 !important;
}
html body #guest-tribute .tribute-write textarea {
  min-height: 168px !important;
}
html body #guest-tribute .tribute-write input::placeholder,
html body #guest-tribute .tribute-write textarea::placeholder {
  opacity: .86 !important;
}
html body #guest-tribute .guest-email-note,
html body #guest-tribute .word-count {
  font-size: clamp(14px, .94vw, 16px) !important;
  line-height: 1.48 !important;
}

/* Attachment choices and the review panel remain equally legible. */
html body #guest-tribute .upload-tile em,
html body #guest-tribute .tracker-line,
html body #guest-tribute .admin-review-callout strong,
html body #guest-tribute .preview-selected-experience strong,
html body #guest-tribute .preview-files span {
  font-size: clamp(16px, 1.02vw, 18px) !important;
  line-height: 1.38 !important;
}
html body #guest-tribute .preview-selected-experience small,
html body #guest-tribute .preview-selection-summary b,
html body #guest-tribute .preview-status-chip {
  font-size: clamp(12px, .82vw, 14px) !important;
  line-height: 1.35 !important;
}
html body #guest-tribute .preview-selection-summary span,
html body #guest-tribute .preview-experience-details,
html body #guest-tribute #previewMessage {
  font-size: clamp(16px, 1.04vw, 18px) !important;
  line-height: 1.55 !important;
}
html body #guest-tribute .journey-hoop em {
  font-size: clamp(13px, .9vw, 15px) !important;
  line-height: 1.35 !important;
}

@media (max-width: 700px) {
  html body #guestbook .section-heading .lede-italic,
  html body #guest-tribute .guest-tribute-inner-heading .lede.lede-italic {
    font-size: clamp(19px, 5.25vw, 23px) !important;
    line-height: 1.52 !important;
  }
  html body #guest-tribute .journey-stage-bar-title {
    font-size: 17px !important;
  }
  html body #guest-tribute .journey-stage-copy,
  html body #guest-tribute .embedded-experience-head p,
  html body #guest-tribute .journey-stage-intro p,
  html body #guest-tribute .detail-tip p,
  html body #guest-tribute .milestone-builder-head p,
  html body #guest-tribute .media-head p,
  html body #guest-tribute .admin-review-callout p,
  html body #guest-tribute .experience-carousel--embedded .experience-card p {
    font-size: 16px !important;
  }
  html body #guest-tribute .embedded-experience-head h4,
  html body #guest-tribute .journey-stage-intro h4,
  html body #guest-tribute .detail-tip strong,
  html body #guest-tribute .milestone-builder-head strong,
  html body #guest-tribute .media-head h4,
  html body #guest-tribute .preview-stage-title h4,
  html body #guest-tribute .experience-carousel--embedded .experience-card h5 {
    font-size: 20px !important;
  }
  html body #guest-tribute .tribute-write label,
  html body #guest-tribute .tribute-write input,
  html body #guest-tribute .tribute-write select,
  html body #guest-tribute .tribute-write textarea,
  html body #guest-tribute .experience-carousel--embedded .experience-select,
  html body #guest-tribute #tributeSubmitBtn,
  html body #guest-tribute .upload-tile em,
  html body #guest-tribute .tracker-line,
  html body #guest-tribute .admin-review-callout strong,
  html body #guest-tribute .preview-selected-experience strong,
  html body #guest-tribute .preview-files span,
  html body #guest-tribute .preview-selection-summary span,
  html body #guest-tribute .preview-experience-details,
  html body #guest-tribute #previewMessage {
    font-size: 16px !important;
  }
  html body #guest-tribute .tribute-write input,
  html body #guest-tribute .tribute-write select {
    min-height: 50px !important;
  }
  html body #guest-tribute .tribute-write textarea {
    min-height: 154px !important;
  }
}

/* ======================================================================
   v100 — GUEST TRIBUTE CENTRING + GUEST BOOK READING SIZE
   The ornamental Guest Tribute Window header follows the supplied centred
   reference.  The submission stages below deliberately retain their
   practical, left-aligned form layout.  Public Guest Book entries and the
   surrounding instructions use a comfortable, proportional reading scale.
   ====================================================================== */

/* Centre the ornamental Guest Tribute Window header as one composition. */
html body #guest-tribute .guest-tribute-heading-row {
  grid-template-columns: minmax(0, 1fr) !important;
  justify-items: center !important;
  text-align: center !important;
  gap: 12px !important;
  padding-inline: clamp(12px, 2.4vw, 28px) !important;
}
html body #guest-tribute .guest-tribute-inner-heading {
  grid-template-columns: minmax(0, 1fr) !important;
  grid-template-areas:
    "icon"
    "eyebrow"
    "lede" !important;
  justify-items: center !important;
  width: min(100%, 980px) !important;
  text-align: center !important;
}
html body #guest-tribute .guest-tribute-inner-heading .section-nav-emblem {
  justify-self: center !important;
  margin-inline: auto !important;
}
html body #guest-tribute .guest-tribute-inner-heading .eyebrow,
html body #guest-tribute .guest-tribute-inner-heading .heading-accent,
html body #guest-tribute .guest-tribute-inner-heading .lede {
  width: 100% !important;
  max-width: 880px !important;
  margin-inline: auto !important;
  text-align: center !important;
  text-align-last: center !important;
}
html body #guest-tribute .guest-tribute-inner-heading .lede {
  font-size: clamp(17px, 1.45vw, 21px) !important;
  line-height: 1.55 !important;
}
html body #guest-tribute .guest-meaningful-badge {
  justify-self: center !important;
  align-self: center !important;
  margin: 0 auto !important;
}

/* Guest Book: retain the existing hierarchy but make every public entry,
   italic instruction, search/filter control and date/detail label readable
   at normal viewing distance. */
html body #guestbook .section-heading .eyebrow {
  font-size: clamp(16px, 1.2vw, 19px) !important;
}
html body #guestbook .section-heading .heading-accent {
  font-size: clamp(28px, 2.45vw, 38px) !important;
  line-height: 1.18 !important;
}
html body #guestbook .section-heading .lede-italic {
  max-width: 58ch !important;
  font-size: clamp(19px, 1.65vw, 24px) !important;
  line-height: 1.58 !important;
}
html body #guestbook .filter-chip,
html body #guestbook #tributeSearch,
html body #guestbook .view-btn,
html body #guestbook .cal-btn,
html body #guestbook .date-clear {
  font-size: clamp(16px, 1.1vw, 18px) !important;
  line-height: 1.25 !important;
}
html body #guestbook #tributeSearch {
  min-height: 46px !important;
}
html body #guestbook .approved-grid > article:not(.tribute-placeholder-card),
html body #guestbook .approved-grid.is-list > article:not(.tribute-placeholder-card) {
  --tribute-card-h: clamp(430px, 50vh, 580px);
  --tribute-card-h-list: clamp(500px, 58vh, 700px);
}
html body #guestbook .approved-grid > article > h4 {
  font-size: clamp(22px, 1.72vw, 28px) !important;
  line-height: 1.22 !important;
  margin-bottom: 8px !important;
}
html body #guestbook .approved-grid > article > p,
html body #guestbook .approved-grid > article > .tribute-entry-title,
html body #guestbook .approved-grid > article > .tribute-entry-meta {
  font-size: clamp(17px, 1.26vw, 20px) !important;
  line-height: 1.58 !important;
}
html body #guestbook .approved-grid > article > .tribute-entry-title {
  margin-block: 8px 4px !important;
  font-weight: 700 !important;
}
html body #guestbook .approved-grid > article > .tribute-entry-meta {
  color: var(--muted, #755f42) !important;
}
html body #guestbook .approved-grid > article > small,
html body #guestbook .approved-grid > article > .tribute-entry-email {
  font-size: clamp(15px, 1.03vw, 17px) !important;
  line-height: 1.45 !important;
}
html body #guestbook .tribute-placeholder-card h4 {
  font-size: clamp(22px, 1.7vw, 27px) !important;
}
html body #guestbook .tribute-placeholder-card p {
  font-size: clamp(17px, 1.22vw, 20px) !important;
  line-height: 1.58 !important;
}
html body #guestbook .att-chip {
  min-height: 44px !important;
  font-size: clamp(16px, 1.05vw, 18px) !important;
}

@media (max-width: 700px) {
  html body #guest-tribute .guest-tribute-heading-row {
    padding-inline: 8px !important;
  }
  html body #guest-tribute .guest-tribute-inner-heading .lede {
    font-size: clamp(17px, 4.65vw, 20px) !important;
    line-height: 1.5 !important;
  }
  html body #guestbook .section-heading .heading-accent {
    font-size: clamp(27px, 8vw, 34px) !important;
  }
  html body #guestbook .section-heading .lede-italic {
    font-size: clamp(18px, 5.35vw, 22px) !important;
    line-height: 1.52 !important;
  }
  html body #guestbook .filter-chip,
  html body #guestbook #tributeSearch,
  html body #guestbook .view-btn,
  html body #guestbook .cal-btn,
  html body #guestbook .date-clear {
    font-size: 16px !important;
  }
  html body #guestbook .approved-grid > article > h4 {
    font-size: clamp(22px, 6vw, 26px) !important;
  }
  html body #guestbook .approved-grid > article > p,
  html body #guestbook .approved-grid > article > .tribute-entry-title,
  html body #guestbook .approved-grid > article > .tribute-entry-meta {
    font-size: clamp(17px, 4.75vw, 19px) !important;
    line-height: 1.58 !important;
  }
  html body #guestbook .approved-grid > article > small,
  html body #guestbook .approved-grid > article > .tribute-entry-email {
    font-size: clamp(15px, 4.15vw, 17px) !important;
  }
}

/* ======================================================================
   v107 — ACCURATE ATTACHMENT UPLOAD STATUS + ADMIN CARD ACCESSIBILITY
   Every upload category remains readable; only chosen categories advance.
   Every moderation card is independently scrollable and keeps its permitted
   action buttons visible above the card's lower edge.
   ====================================================================== */
html body #guest-tribute .tracker-state {
  display: grid !important;
  gap: 8px !important;
  width: min(100%, 690px) !important;
  margin: 0 auto !important;
}
html body #guest-tribute .tracker-line {
  display: grid !important;
  grid-template-columns: 42px minmax(110px, 1fr) minmax(168px, max-content) !important;
  gap: 9px !important;
  align-items: center !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 8px 10px !important;
  border: 1px solid rgba(183, 122, 31, .20) !important;
  border-radius: 10px !important;
  background: rgba(255, 253, 245, .72) !important;
}
html body #guest-tribute .tracker-line progress { min-width: 0 !important; }
html body #guest-tribute .tracker-line em {
  min-width: 0 !important;
  color: #6c512b !important;
  font-size: clamp(12px, 1.1vw, 14px) !important;
  font-style: normal !important;
  font-weight: 700 !important;
  line-height: 1.25 !important;
  overflow-wrap: anywhere !important;
}
body.admin-portal-body #adminPanel:not(.hidden) #adminWindow .admin-tribute {
  display: flex !important;
  flex-direction: column !important;
  height: auto !important;
  min-height: 220px !important;
  max-height: min(66svh, 680px) !important;
  overflow-x: hidden !important;
  overflow-y: scroll !important;
  overscroll-behavior: contain !important;
  scrollbar-gutter: stable both-edges;
  scrollbar-width: thin;
  scrollbar-color: #a46c17 rgba(247, 229, 179, .55);
  padding: clamp(16px, 1.7vw, 22px) !important;
}
body.admin-portal-body #adminPanel:not(.hidden) #adminWindow .admin-tribute::-webkit-scrollbar { width: 10px; }
body.admin-portal-body #adminPanel:not(.hidden) #adminWindow .admin-tribute::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, #d6a130, #8f5512) !important;
  border: 2px solid rgba(255, 249, 224, .88) !important;
  border-radius: 999px !important;
}
body.admin-portal-body #adminPanel:not(.hidden) #adminWindow .admin-tribute > p:last-of-type {
  flex: 0 0 auto !important;
  max-height: none !important;
  overflow: visible !important;
  padding-right: 0 !important;
}
body.admin-portal-body #adminPanel:not(.hidden) #adminWindow .admin-attachment-block {
  display: grid !important;
  gap: 8px !important;
  margin-top: 12px !important;
  padding: 10px !important;
  border: 1px solid rgba(183, 122, 31, .24) !important;
  border-radius: 12px !important;
  background: rgba(255, 250, 234, .76) !important;
}
body.admin-portal-body #adminPanel:not(.hidden) #adminWindow .admin-attachment-block > strong {
  color: #5b1d27 !important;
  font-family: Georgia, 'Times New Roman', serif !important;
  font-size: 1rem !important;
}
body.admin-portal-body #adminPanel:not(.hidden) #adminWindow .admin-attachment-block .att-row {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
  min-width: 0 !important;
}
body.admin-portal-body #adminPanel:not(.hidden) #adminWindow .admin-tribute .actions {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 9px !important;
  position: sticky !important;
  bottom: 0 !important;
  z-index: 5 !important;
  margin: 14px -2px -2px !important;
  padding: 12px 2px 2px !important;
  overflow: visible !important;
  visibility: visible !important;
  opacity: 1 !important;
  background: linear-gradient(to bottom, rgba(255,253,244,0), rgba(255,253,244,.94) 34%, rgba(255,253,244,.98)) !important;
}
body.admin-portal-body #adminPanel:not(.hidden) #adminWindow .admin-tribute .actions > button {
  display: inline-flex !important;
  flex: 1 1 152px !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 46px !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 10px 14px !important;
  position: relative !important;
  isolation: isolate !important;
  overflow: visible !important;
  transform: none !important;
  visibility: visible !important;
  opacity: 1 !important;
  pointer-events: auto !important;
  color: #3f1909 !important;
  background: linear-gradient(180deg, #fff8df, #f6dfa0 54%, #dfa73d) !important;
  border: 1px solid #8f5714 !important;
  border-radius: 12px !important;
  box-shadow: inset 0 1px rgba(255,255,255,.95), 0 2px 5px rgba(86,41,7,.18) !important;
  font-family: Georgia, 'Times New Roman', serif !important;
  font-size: .98rem !important;
  font-weight: 700 !important;
  line-height: 1.2 !important;
  text-align: center !important;
  white-space: normal !important;
}
body.admin-portal-body #adminPanel:not(.hidden) #adminWindow .admin-tribute .actions > button::before,
body.admin-portal-body #adminPanel:not(.hidden) #adminWindow .admin-tribute .actions > button::after {
  content: none !important;
  display: none !important;
}
body.admin-portal-body #adminPanel:not(.hidden) #adminWindow .admin-tribute .actions > button[data-action="approved"],
body.admin-portal-body #adminPanel:not(.hidden) #adminWindow .admin-tribute .actions > button[data-action="show"] {
  color: #fff9df !important;
  background: linear-gradient(180deg, #176d64, #0d4e49) !important;
  border-color: #073d39 !important;
}
body.admin-portal-body #adminPanel:not(.hidden) #adminWindow .admin-tribute .actions > button[data-action="rejected"],
body.admin-portal-body #adminPanel:not(.hidden) #adminWindow .admin-tribute .actions > button[data-action="hide"] {
  color: #fff9df !important;
  background: linear-gradient(180deg, #7b2430, #5d1421) !important;
  border-color: #4a0d18 !important;
}
body.admin-portal-body #adminPanel:not(.hidden) #adminWindow .admin-tribute .actions > button[data-action="delete"] {
  color: #fff9df !important;
  background: linear-gradient(180deg, #5e453d, #342019) !important;
  border-color: #24140f !important;
}
body.admin-portal-body #adminPanel:not(.hidden) #adminWindow .admin-tribute .actions > button:focus-visible {
  outline: 3px solid #741f2a !important;
  outline-offset: 3px !important;
}
@media (max-width: 700px) {
  html body #guest-tribute .tracker-line {
    grid-template-columns: 36px minmax(76px, 1fr) !important;
    gap: 7px !important;
    padding: 8px !important;
  }
  html body #guest-tribute .tracker-line em {
    grid-column: 1 / -1 !important;
    font-size: 12px !important;
  }
  body.admin-portal-body #adminPanel:not(.hidden) #adminWindow .admin-tribute {
    min-height: 190px !important;
    max-height: 62svh !important;
    padding: 14px !important;
  }
  body.admin-portal-body #adminPanel:not(.hidden) #adminWindow .admin-tribute .actions > button {
    flex-basis: 100% !important;
    min-height: 48px !important;
  }
}

/* v108 — TV-safe Guest Book video playback feedback.  The viewer retains
   the existing proportions and controls while reserving a readable place for
   a genuine device-decoding error, including on small phones. */
html body .tribute-attachment-playback-note {
  width: min(100%, 760px) !important;
  margin: 12px auto 0 !important;
  padding: 10px 12px !important;
  border: 1px solid rgba(122, 36, 48, .32) !important;
  border-radius: 10px !important;
  background: rgba(255, 246, 228, .94) !important;
  color: #5d1421 !important;
  font-size: clamp(14px, 1.1vw, 16px) !important;
  font-weight: 650 !important;
  line-height: 1.45 !important;
  text-align: center !important;
}
@media (max-width: 620px) {
  html body .tribute-attachment-media--video {
    max-height: 56dvh !important;
  }
  html body .tribute-attachment-playback-note {
    font-size: 14px !important;
  }
}

/* v109 — Guest Tribute processing screen. The fixed layer prevents duplicate
   taps and section navigation only while the server is recording a tribute. */
html body.tribute-submitting { overflow: hidden !important; }
html body .tribute-processing-overlay[hidden] { display: none !important; }
html body .tribute-processing-overlay {
  position: fixed !important;
  z-index: 2147483000 !important;
  inset: 0 !important;
  display: grid !important;
  place-items: center !important;
  box-sizing: border-box !important;
  min-height: 100vh !important;
  min-height: 100dvh !important;
  padding: max(18px, env(safe-area-inset-top)) max(16px, env(safe-area-inset-right)) max(18px, env(safe-area-inset-bottom)) max(16px, env(safe-area-inset-left)) !important;
  background: rgba(35, 23, 12, .74) !important;
  cursor: wait !important;
}
html body .tribute-processing-card {
  width: min(92vw, 540px) !important;
  max-width: 540px !important;
  box-sizing: border-box !important;
  overflow: hidden !important;
  padding: clamp(24px, 4vw, 38px) clamp(20px, 5vw, 46px) !important;
  border: 1px solid rgba(230, 190, 83, .8) !important;
  border-radius: 28px !important;
  background:
    radial-gradient(circle at 50% 2%, rgba(255, 246, 191, .92), transparent 36%),
    linear-gradient(155deg, #fffdf5 0%, #f7e9c7 55%, #ead19a 100%) !important;
  box-shadow: 0 26px 80px rgba(0, 0, 0, .48), inset 0 1px rgba(255,255,255,.96) !important;
  color: #4b2c12 !important;
  text-align: center !important;
}
html body .tribute-processing-card:focus { outline: none !important; }
html body .tribute-processing-card .eyebrow { margin: 10px 0 5px !important; }
html body .tribute-processing-card h2 {
  margin: 0 !important;
  color: #6a2029 !important;
  font-family: Georgia, 'Times New Roman', serif !important;
  font-size: clamp(25px, 4.6vw, 34px) !important;
  line-height: 1.15 !important;
}
html body .tribute-processing-message {
  margin: 16px auto 8px !important;
  max-width: 440px !important;
  color: #563b20 !important;
  font-size: clamp(16px, 2.4vw, 19px) !important;
  font-weight: 700 !important;
  line-height: 1.45 !important;
}
html body .tribute-processing-hint {
  margin: 14px auto 0 !important;
  max-width: 420px !important;
  color: #765b32 !important;
  font-family: Georgia, 'Times New Roman', serif !important;
  font-size: clamp(14px, 2vw, 16px) !important;
  font-style: italic !important;
  line-height: 1.45 !important;
}
html body .tribute-processing-meter {
  position: relative !important;
  width: 100% !important;
  height: 12px !important;
  overflow: hidden !important;
  margin: 20px auto 0 !important;
  border: 1px solid rgba(133, 82, 14, .3) !important;
  border-radius: 999px !important;
  background: rgba(125, 78, 15, .12) !important;
  box-shadow: inset 0 1px 2px rgba(82,45,8,.16) !important;
}
html body .tribute-processing-meter > span {
  display: block !important;
  height: 100% !important;
  width: 18% !important;
  border-radius: inherit !important;
  background: linear-gradient(90deg, #7d2d21, #d49125 48%, #176d64) !important;
  box-shadow: 0 0 13px rgba(222, 170, 47, .8) !important;
  transition: width .18s ease !important;
}
html body .tribute-processing-meter.is-indeterminate > span {
  width: 32% !important;
  animation: tributeProcessingSweep 1.15s ease-in-out infinite !important;
}
html body .tribute-processing-orbit {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  gap: 12px !important;
  height: 42px !important;
}
html body .tribute-processing-lamp {
  display: grid !important;
  place-items: center !important;
  width: 30px !important;
  height: 30px !important;
  border-radius: 50% !important;
  color: #fff3ae !important;
  background: radial-gradient(circle, #fffde4 0 15%, #f1c84a 35%, #a45f13 72%) !important;
  box-shadow: 0 0 0 4px rgba(255,238,171,.35), 0 0 18px rgba(232,172,43,.74) !important;
  animation: tributeProcessingLantern 1.25s ease-in-out infinite !important;
}
html body .tribute-processing-lamp:nth-child(2) { animation-delay: .16s !important; }
html body .tribute-processing-lamp:nth-child(3) { animation-delay: .32s !important; }
@keyframes tributeProcessingSweep {
  0% { transform: translateX(-115%); }
  55% { transform: translateX(205%); }
  100% { transform: translateX(205%); }
}
@keyframes tributeProcessingLantern {
  0%, 100% { transform: translateY(0) rotate(0deg); filter: brightness(1); }
  50% { transform: translateY(-9px) rotate(10deg); filter: brightness(1.18); }
}
@media (prefers-reduced-motion: reduce) {
  html body .tribute-processing-meter.is-indeterminate > span,
  html body .tribute-processing-lamp { animation: none !important; }
}
@media (max-width: 480px) {
  html body .tribute-processing-overlay { padding-inline: 10px !important; }
  html body .tribute-processing-card { width: min(96vw, 540px) !important; border-radius: 21px !important; }
  html body .tribute-processing-message { font-size: 16px !important; }
}

/* v111 — scalable Guest Book and moderation navigation.
   Four public comments remain naturally visible without an inner scrollbar.
   Larger collections use a small, bounded reading page (60 cards) with a
   real scroll window and direct first/previous/next/last navigation. This
   keeps ten-thousand-comment archives responsive on televisions and phones. */
html body .tribute-pager[hidden] { display: none !important; }
html body .tribute-pager {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-wrap: wrap !important;
  gap: 9px !important;
  width: min(100%, 1080px) !important;
  box-sizing: border-box !important;
  margin: 14px auto 0 !important;
  padding: 11px 13px !important;
  border: 1px solid rgba(150, 96, 20, .26) !important;
  border-radius: 14px !important;
  background: rgba(255, 252, 239, .64) !important;
  box-shadow: inset 0 1px rgba(255,255,255,.78) !important;
}
html body .tribute-pager .btn {
  min-height: 42px !important;
  padding: 8px 13px !important;
  font-size: clamp(14px, 1.5vw, 16px) !important;
  white-space: nowrap !important;
}
html body .tribute-pager .btn:disabled {
  opacity: .48 !important;
  cursor: not-allowed !important;
  filter: grayscale(.16) !important;
}
html body .tribute-pager-jump {
  display: inline-flex !important;
  align-items: center !important;
  gap: 7px !important;
  min-height: 42px !important;
  color: #593017 !important;
  font-family: Georgia, 'Times New Roman', serif !important;
  font-size: clamp(14px, 1.45vw, 16px) !important;
  font-weight: 700 !important;
  white-space: nowrap !important;
}
html body .tribute-pager-jump input {
  width: 5.4em !important;
  min-height: 40px !important;
  box-sizing: border-box !important;
  padding: 6px 8px !important;
  border: 1px solid rgba(132, 75, 15, .38) !important;
  border-radius: 9px !important;
  background: #fffdf6 !important;
  color: #3f220f !important;
  font: inherit !important;
  text-align: center !important;
}
html body .tribute-pager-jump input:focus-visible,
html body .tribute-pager .btn:focus-visible {
  outline: 3px solid #176d64 !important;
  outline-offset: 2px !important;
}
html body .tribute-pager-status {
  flex: 1 0 100% !important;
  margin: 1px 0 0 !important;
  color: #6b4b2d !important;
  font-size: clamp(13px, 1.35vw, 15px) !important;
  font-weight: 650 !important;
  line-height: 1.4 !important;
  text-align: center !important;
}
/* The public window becomes scrollable only from its fifth tribute onward. */
html body #tributeWindow.is-scroll {
  scroll-behavior: auto !important;
  scrollbar-gutter: stable both-edges;
}
/* Individual admin cards already have independent overflow; this reserves a
   visible outer rail for the active moderation page as well. */
html body #adminWindow.is-scroll {
  scroll-behavior: auto !important;
  scrollbar-gutter: stable both-edges;
}
@media (max-width: 620px) {
  html body .tribute-pager {
    gap: 7px !important;
    margin-top: 11px !important;
    padding: 10px !important;
  }
  html body .tribute-pager .btn {
    flex: 1 1 calc(33.333% - 8px) !important;
    min-width: 0 !important;
    min-height: 46px !important;
    padding-inline: 8px !important;
  }
  html body .tribute-pager-jump {
    flex: 1 1 100% !important;
    justify-content: center !important;
    min-height: 44px !important;
  }
  html body .tribute-pager-status { font-size: 14px !important; }
}
@media (max-width: 380px) {
  html body .tribute-pager .btn { flex-basis: calc(50% - 6px) !important; }
}
@media (prefers-reduced-motion: reduce) {
  html body #tributeWindow.is-scroll,
  html body #adminWindow.is-scroll { scroll-behavior: auto !important; }
}

/* v112 — unified half-transparent heritage glass. Sacred Dedication and
   Thank You deliberately retain their separate 96% transparent treatment. */
html body #virtues .virtue-filmstage,
html body #academic .academic-filmstage,
html body #foundation .heritage-outer-parity--foundation,
html body #legacy .heritage-outer-parity--home,
html body #timeline .heritage-outer-parity--story,
html body #guest-tribute .guest-tribute-combined,
html body #living-memories .lm-heritage-tile,
html body #help .heritage-outer-parity--help {
  background:
    linear-gradient(135deg, rgba(183,122,31,.18) 0 1px, transparent 1px) 15px 15px/28px 28px no-repeat,
    linear-gradient(225deg, rgba(183,122,31,.18) 0 1px, transparent 1px) calc(100% - 15px) 15px/28px 28px no-repeat,
    linear-gradient(45deg, rgba(183,122,31,.18) 0 1px, transparent 1px) 15px calc(100% - 15px)/28px 28px no-repeat,
    linear-gradient(315deg, rgba(183,122,31,.18) 0 1px, transparent 1px) calc(100% - 15px) calc(100% - 15px)/28px 28px no-repeat,
    radial-gradient(circle at 50% -8%, rgba(245,208,104,.20), transparent 31%),
    radial-gradient(circle at 8% 48%, rgba(135,38,52,.07), transparent 26%),
    radial-gradient(circle at 92% 48%, rgba(47,113,110,.08), transparent 26%),
    linear-gradient(180deg, rgba(255,253,247,.50), rgba(249,238,211,.50)) !important;
  animation:
    thanksCardArrive 1s .16s cubic-bezier(.2,.72,.2,1) both,
    heritageTileGlow 7.2s 1.15s ease-in-out infinite !important;
}

/* The upper decorative gradient line in the Virtues filmstrip was the only
   requested line to remove; the lower rule and all remaining ornaments stay. */
html body #virtues .virtue-filmstrip-shell::before {
  content: none !important;
  display: none !important;
}
@media (prefers-reduced-motion: reduce) {
  html body #virtues .virtue-filmstage,
  html body #academic .academic-filmstage,
  html body #foundation .heritage-outer-parity--foundation,
  html body #legacy .heritage-outer-parity--home,
  html body #timeline .heritage-outer-parity--story,
  html body #guest-tribute .guest-tribute-combined,
  html body #living-memories .lm-heritage-tile,
  html body #help .heritage-outer-parity--help { animation: none !important; }
}

/* v114 — the reported line is the top ornamental strip inside the Virtues
   outer tile, not the filmstrip rule. Remove only that strip; keep the tile
   border, its two corner medallions, lower ornament and all interactions. */
html body #virtues .virtue-filmstage-ornament--top {
  display: none !important;
  background: none !important;
}

/* v115 — this is the actual burgundy/gold/teal inset line shown in the
   screenshot. It belongs to the outer guided-stepper pseudo-element. */
html body #virtues .virtue-guided-stepper::before {
  content: none !important;
  display: none !important;
  background: none !important;
  box-shadow: none !important;
}

/* v116 — a single, evenly spread pearl-light sweep for every half-transparent
   heritage tile. It is a background-position animation only: no blur, filter,
   extra DOM, or moving layout work is introduced on TVs and phones. */
html body #virtues .virtue-filmstage,
html body #academic .academic-filmstage,
html body #foundation .heritage-outer-parity--foundation,
html body #legacy .heritage-outer-parity--home,
html body #timeline .heritage-outer-parity--story,
html body #guest-tribute .guest-tribute-combined,
html body #living-memories .lm-heritage-tile,
html body #help .heritage-outer-parity--help {
  background:
    linear-gradient(105deg, transparent 0 22%, rgba(255,255,255,.018) 34%, rgba(255,255,255,.16) 50%, rgba(255,250,219,.07) 58%, transparent 76%) -62% 0 / 46% 100% no-repeat,
    linear-gradient(135deg, rgba(183,122,31,.18) 0 1px, transparent 1px) 15px 15px/28px 28px no-repeat,
    linear-gradient(225deg, rgba(183,122,31,.18) 0 1px, transparent 1px) calc(100% - 15px) 15px/28px 28px no-repeat,
    linear-gradient(45deg, rgba(183,122,31,.18) 0 1px, transparent 1px) 15px calc(100% - 15px)/28px 28px no-repeat,
    linear-gradient(315deg, rgba(183,122,31,.18) 0 1px, transparent 1px) calc(100% - 15px) calc(100% - 15px)/28px 28px no-repeat,
    radial-gradient(circle at 50% -8%, rgba(245,208,104,.20), transparent 31%),
    radial-gradient(circle at 8% 48%, rgba(135,38,52,.07), transparent 26%),
    radial-gradient(circle at 92% 48%, rgba(47,113,110,.08), transparent 26%),
    linear-gradient(180deg, rgba(255,253,247,.50), rgba(249,238,211,.50)) !important;
  animation:
    thanksCardArrive 1s .16s cubic-bezier(.2,.72,.2,1) both,
    heritageTileGlow 7.2s 1.15s ease-in-out infinite,
    heritagePearlShimmer 11s 2.2s ease-in-out infinite !important;
}
@keyframes heritagePearlShimmer {
  0%, 46%, 100% {
    background-position: -62% 0, 15px 15px, calc(100% - 15px) 15px, 15px calc(100% - 15px), calc(100% - 15px) calc(100% - 15px), center top, left center, right center, center center;
  }
  68% {
    background-position: 162% 0, 15px 15px, calc(100% - 15px) 15px, 15px calc(100% - 15px), calc(100% - 15px) calc(100% - 15px), center top, left center, right center, center center;
  }
}
@media (prefers-reduced-motion: reduce) {
  html body #virtues .virtue-filmstage,
  html body #academic .academic-filmstage,
  html body #foundation .heritage-outer-parity--foundation,
  html body #legacy .heritage-outer-parity--home,
  html body #timeline .heritage-outer-parity--story,
  html body #guest-tribute .guest-tribute-combined,
  html body #living-memories .lm-heritage-tile,
  html body #help .heritage-outer-parity--help {
    animation: none !important;
  }
}


/* ======================================================================
   v122 — MANDALA MOTION: SMOOTHER, AND FASTER
   Three changes, in order of how much they matter.

   1. The colour journey no longer animates `color`. Animating the stroke
      colour of eighteen intricate SVGs forced the browser to re-rasterise
      every one of them on every frame, which is what made the drift look
      stepped. The identical palette is now produced by a saturate/brightness
      filter over a fixed gold, which the compositor can run on the GPU
      without touching the artwork. Measured colours match the old stops to
      within about one value out of 255.

   2. The rise and drift paths are rebuilt from their underlying curves at
      twenty-five stops instead of twelve, so the sway is a true sine rather
      than a polygon, and the fades in and out are eased rather than linear.

   3. Every duration is shortened: the flow travels roughly twice as fast,
      the placed trio about 1.8x, and the colour and shimmer cycles keep pace.

   The halo removed in v121 stays removed — nothing here restores a
   drop-shadow, and .mandala-glow is still display:none.
   ====================================================================== */

@keyframes mandalaRise {
  0% { opacity: 0; transform: translate3d(0px, -0vh, 0) rotate(0deg); }
  1.6% { opacity: 0.1; }
  3.2% { opacity: 0.3; }
  4.1667% { transform: translate3d(7.76px, -5.58vh, 0) rotate(4.58deg); }
  5.2% { opacity: 0.58; }
  7.6% { opacity: 0.85; }
  8.3333% { transform: translate3d(15px, -11.17vh, 0) rotate(9.17deg); }
  9.6% { opacity: 1; }
  12.5% { transform: translate3d(21.21px, -16.75vh, 0) rotate(13.75deg); }
  16.6667% { transform: translate3d(25.98px, -22.33vh, 0) rotate(18.33deg); }
  20.8333% { transform: translate3d(28.98px, -27.92vh, 0) rotate(22.92deg); }
  25% { transform: translate3d(30px, -33.5vh, 0) rotate(27.5deg); }
  29.1667% { transform: translate3d(28.98px, -39.08vh, 0) rotate(32.08deg); }
  33.3333% { transform: translate3d(25.98px, -44.67vh, 0) rotate(36.67deg); }
  37.5% { transform: translate3d(21.21px, -50.25vh, 0) rotate(41.25deg); }
  41.6667% { transform: translate3d(15px, -55.83vh, 0) rotate(45.83deg); }
  45.8333% { transform: translate3d(7.76px, -61.42vh, 0) rotate(50.42deg); }
  50% { transform: translate3d(0px, -67vh, 0) rotate(55deg); }
  54.1667% { transform: translate3d(-7.76px, -72.58vh, 0) rotate(59.58deg); }
  58.3333% { transform: translate3d(-15px, -78.17vh, 0) rotate(64.17deg); }
  62.5% { transform: translate3d(-21.21px, -83.75vh, 0) rotate(68.75deg); }
  66.6667% { transform: translate3d(-25.98px, -89.33vh, 0) rotate(73.33deg); }
  70.8333% { transform: translate3d(-28.98px, -94.92vh, 0) rotate(77.92deg); }
  75% { transform: translate3d(-30px, -100.5vh, 0) rotate(82.5deg); }
  79.1667% { transform: translate3d(-28.98px, -106.08vh, 0) rotate(87.08deg); }
  83.3333% { transform: translate3d(-25.98px, -111.67vh, 0) rotate(91.67deg); }
  87.5% { transform: translate3d(-21.21px, -117.25vh, 0) rotate(96.25deg); }
  90.4% { opacity: 1; }
  91.6667% { transform: translate3d(-15px, -122.83vh, 0) rotate(100.83deg); }
  92.4% { opacity: 0.85; }
  94.8% { opacity: 0.58; }
  95.8333% { transform: translate3d(-7.76px, -128.42vh, 0) rotate(105.42deg); }
  96.8% { opacity: 0.3; }
  98.4% { opacity: 0.1; }
  100% { opacity: 0; transform: translate3d(-0px, -134vh, 0) rotate(110deg); }
}

@keyframes mandalaDrift {
  0% { opacity: 0; transform: translate3d(0vw, -0vh, 0) rotate(0deg); }
  1.6% { opacity: 0.1; }
  3.2% { opacity: 0.3; }
  4.1667% { transform: translate3d(5.5vw, -0.2vh, 0) rotate(4deg); }
  5.2% { opacity: 0.58; }
  7.6% { opacity: 0.85; }
  8.3333% { transform: translate3d(11vw, -0.78vh, 0) rotate(8deg); }
  9.6% { opacity: 1; }
  12.5% { transform: translate3d(16.5vw, -1.75vh, 0) rotate(12deg); }
  16.6667% { transform: translate3d(22vw, -3.08vh, 0) rotate(16deg); }
  20.8333% { transform: translate3d(27.5vw, -4.75vh, 0) rotate(20deg); }
  25% { transform: translate3d(33vw, -6.74vh, 0) rotate(24deg); }
  29.1667% { transform: translate3d(38.5vw, -9vh, 0) rotate(28deg); }
  33.3333% { transform: translate3d(44vw, -11.5vh, 0) rotate(32deg); }
  37.5% { transform: translate3d(49.5vw, -14.2vh, 0) rotate(36deg); }
  41.6667% { transform: translate3d(55vw, -17.05vh, 0) rotate(40deg); }
  45.8333% { transform: translate3d(60.5vw, -20vh, 0) rotate(44deg); }
  50% { transform: translate3d(66vw, -23vh, 0) rotate(48deg); }
  54.1667% { transform: translate3d(71.5vw, -26vh, 0) rotate(52deg); }
  58.3333% { transform: translate3d(77vw, -28.95vh, 0) rotate(56deg); }
  62.5% { transform: translate3d(82.5vw, -31.8vh, 0) rotate(60deg); }
  66.6667% { transform: translate3d(88vw, -34.5vh, 0) rotate(64deg); }
  70.8333% { transform: translate3d(93.5vw, -37vh, 0) rotate(68deg); }
  75% { transform: translate3d(99vw, -39.26vh, 0) rotate(72deg); }
  79.1667% { transform: translate3d(104.5vw, -41.25vh, 0) rotate(76deg); }
  83.3333% { transform: translate3d(110vw, -42.92vh, 0) rotate(80deg); }
  87.5% { transform: translate3d(115.5vw, -44.25vh, 0) rotate(84deg); }
  90.4% { opacity: 1; }
  91.6667% { transform: translate3d(121vw, -45.22vh, 0) rotate(88deg); }
  92.4% { opacity: 0.85; }
  94.8% { opacity: 0.58; }
  95.8333% { transform: translate3d(126.5vw, -45.8vh, 0) rotate(92deg); }
  96.8% { opacity: 0.3; }
  98.4% { opacity: 0.1; }
  100% { opacity: 0; transform: translate3d(132vw, -46vh, 0) rotate(96deg); }
}

/* The colour journey, as a compositor filter instead of a repaint.
   Base colour is #ffc14a; each stop reproduces one of the original tints. */
@keyframes mandalaInk {
  0%, 100% { filter: saturate(0.14) brightness(1.23); }   /* was #fdf3de */
  12.5%     { filter: saturate(0.35) brightness(1.13); }   /* was #f6e0ae */
  25%       { filter: saturate(1)    brightness(1);    }   /* was #ffc14a */
  37.5%     { filter: saturate(1.03) brightness(0.83); }   /* was #d4a03a */
  50%       { filter: saturate(0.32) brightness(1.24); }   /* was #fff3c4 */
  62.5%     { filter: saturate(1.03) brightness(0.83); }
  75%       { filter: saturate(1)    brightness(1);    }
  87.5%     { filter: saturate(0.35) brightness(1.13); }
}

/* Fixed ink; the journey now happens in the filter above. */
html #mandalaFlow .mandala,
html .mandala-trio .m-trio { color: #ffc14a; }

/* Travel only on the wrapper — one transform-driven animation, nothing that
   repaints. Durations and delays continue to come from the script, so every
   mandala keeps its own size, speed and phase. */
html #mandalaFlow .mandala--rise  { animation-name: mandalaRise;  animation-timing-function: linear; animation-iteration-count: infinite; }
html #mandalaFlow .mandala--turn  { animation-name: mandalaTurn;  animation-timing-function: linear; animation-iteration-count: infinite; }
html #mandalaFlow .mandala--drift { animation-name: mandalaDrift; animation-timing-function: linear; animation-iteration-count: infinite; }

html #mandalaFlow .mandala > svg {
  filter: saturate(1) brightness(1);
  will-change: opacity, filter;
  transform: translateZ(0);
  backface-visibility: hidden;
  animation-name: mandalaSparkle, mandalaInk;
  animation-timing-function: cubic-bezier(0.42, 0, 0.58, 1), linear;
  animation-iteration-count: infinite, infinite;
}

/* The three placed forms: same treatment, and about 1.8x quicker. */
html .mandala-trio .m-trio--one   { animation: mandalaTrioOne   24s ease-in-out infinite !important; }
html .mandala-trio .m-trio--two   { animation: mandalaTrioTwo   30s ease-in-out infinite !important; }
html .mandala-trio .m-trio--three { animation: mandalaTrioThree  27s ease-in-out infinite !important; }
html .mandala-trio .m-trio.mandala--turn  { animation: mandalaTurn  52s linear infinite !important; }
html .mandala-trio .m-trio.mandala--drift { animation: mandalaDrift 66s linear infinite !important; }

html .mandala-trio .m-trio > svg {
  filter: saturate(1) brightness(1);
  will-change: filter;
  transform: translateZ(0);
  backface-visibility: hidden;
  animation: mandalaInk 21s linear infinite;
}
html .mandala-trio .m-trio--two > svg   { animation-duration: 26s; animation-delay: -9s; }
html .mandala-trio .m-trio--three > svg { animation-duration: 23s; animation-delay: -17s; }

@media (prefers-reduced-motion: reduce) {
  html #mandalaFlow .mandala,
  html #mandalaFlow .mandala > svg,
  html .mandala-trio .m-trio,
  html .mandala-trio .m-trio > svg { animation: none !important; }
  html #mandalaFlow .mandala > svg,
  html .mandala-trio .m-trio > svg { filter: saturate(0.62) brightness(1.09) !important; }
  html #mandalaFlow .mandala { opacity: 1 !important; }
}