:root {
  --color-brand-youtube: red;
  --color-brand-twitter-x: #1da1f2;
  --color-brand-instagram-1: #fdf497;
  --color-brand-instagram-2: #fd5949;
  --color-brand-instagram-3: #d6249f;
  --color-brand-instagram-4: #285aeb;
  --color-brand-tik-tok: #25f4ee;
  --color-brand-tik-tok-glow: #ee1d52;
  --color-brand-facebook: #1877f2;
  --color-tier-kindred: #8a8280;
  --color-tier-kindred-rgb: 138, 130, 128;
  --color-tier-kindred-soft: #3d3a38;
  --color-tier-keepers: #40916c;
  --color-tier-keepers-rgb: 64, 145, 108;
  --color-tier-keepers-soft: #1e3a2f;
  --color-tier-sages: #f5c800;
  --color-tier-sages-rgb: 245, 200, 0;
  --color-tier-sages-soft: #3d3820;
  --color-bone: #f8f4eb;
  --color-cloud: #fdfcfa;
  --color-stone: #d4cfc4;
  --color-dusk: #5c5248;
  --color-night: #1f1b18;
  --color-mud: #1a0f0a;
  --color-smoke: #9a938a;
  --color-smoke-rgb: 154, 147, 138;
  --color-ember: #d9480f;
  --color-ember-rgb: 217, 72, 15;
  --color-ember-glow: #f97316;
  --color-ember-soft: #fff3eb;
  --color-forest: #1b7a4d;
  --color-forest-rgb: 27, 122, 77;
  --color-sage: #e8f3ed;
  --color-blood: #8b0000;
  --color-blood-soft: #f8e0e0;
  --color-water: #2a6f97;
  --color-water-soft: #e0eef4;
  --color-heart: #9e4a4a;
  --color-heart-soft: #f3e8e8;
  --color-background: var(--color-bone);
  --color-surface: #f0e9d8;
  --color-border: #c8b9a8;
  --color-text: var(--color-night);
  --color-text-secondary: var(--color-dusk);
  --color-text-muted: #7a6f63;
  --color-primary: var(--color-forest);
  --color-primary-rgb: var(--color-forest-rgb);
  --color-primary-light: #2d9e6d;
  --color-primary-dark: #1b4332;
  --color-primary-soft: var(--color-sage);
  --color-accent: var(--color-ember);
  --color-accent-rgb: var(--color-ember-rgb);
  --color-accent-light: #f16a2d;
  --color-accent-dark: #a33a0c;
  --color-accent-soft: var(--color-ember-soft);
  --color-success: var(--color-forest);
  --color-success-soft: var(--color-sage);
  --color-error: var(--color-blood);
  --color-error-soft: var(--color-blood-soft);
  --color-info: var(--color-water);
  --color-info-soft: var(--color-water-soft);
  --color-highlight-bg: var(--color-ember-glow);
  --color-highlight-text: var(--color-mud);
  --overlay-dark: rgba(31, 27, 24, 0.55);
  --overlay-light: hsla(0, 0%, 100%, 0.85);
  --shadow-card: 0 6px 20px rgba(31, 27, 24, 0.14);
  --shadow-card-hover: 0 16px 40px rgba(31, 27, 24, 0.22);
  --shimmer-gradient-sages: linear-gradient(
    120deg,
    var(--color-tier-sages) 30%,
    #ffffffdd 45%,
    #fff 50%,
    #ffffffdd 55%,
    var(--color-tier-sages) 70%
  );
  --font-family-heading: 'Cinzel', Georgia, serif;
  --font-family-subheading: 'CormorantGaramond', Georgia, serif;
  --font-family-body: 'Lora', Georgia, serif;
  --font-family-system:
    -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Helvetica Neue',
    Arial, sans-serif;
  --spacing-xs: 0.25rem;
  --spacing-sm: 0.5rem;
  --spacing-md: 1rem;
  --spacing-lg: 1.5rem;
  --spacing-xl: 2rem;
  --spacing-xxl: 3rem;
  --spacing-top-bar: 3.5rem;
  --spacing-section-vert-padding: 4rem;
  --border-radius-sm: 4px;
  --border-radius-md: 8px;
  --border-radius-lg: 12px;
  --border-radius-xl: 16px;
  --border-radius-xxl: 20px;
  --border-radius-xxxl: 25px;
  --border-radius-pill: 50px;
  --border-radius-round: 50%;
  --border-radius-none: 0;
  --transition-slow: 0.4s ease;
  --transition-normal: 0.3s ease;
  --transition-fast: 0.15s ease;
}
[data-theme='dark'] {
  --color-bone: #f5f0e6;
  --color-cloud: #fdfcfa;
  --color-night-bg: #1a1714;
  --color-charcoal: #2c2825;
  --color-ash: #3d3835;
  --color-smoke: #9a938a;
  --color-smoke-rgb: 154, 147, 138;
  --color-mud: #100a07;
  --color-ember: #e85d04;
  --color-ember-rgb: 232, 93, 4;
  --color-ember-glow: #f97316;
  --color-ember-dim: #3d2a1f;
  --color-fern: #40916c;
  --color-fern-rgb: 64, 145, 108;
  --color-forest-dim: #1e3a2f;
  --color-ember-red: #dc2626;
  --color-blood-dim: #3d1f1f;
  --color-stream: #61a5c2;
  --color-water-dim: #1f2d3d;
  --color-heart: #b85c5c;
  --color-heart-soft: #3d2525;
  --color-background: var(--color-night-bg);
  --color-surface: var(--color-charcoal);
  --color-border: var(--color-ash);
  --color-text: var(--color-bone);
  --color-text-secondary: var(--color-smoke);
  --color-text-muted: var(--color-smoke);
  --color-primary: var(--color-fern);
  --color-primary-rgb: var(--color-fern-rgb);
  --color-primary-light: #52b788;
  --color-primary-dark: #2d6a4f;
  --color-primary-soft: var(--color-forest-dim);
  --color-accent: var(--color-ember);
  --color-accent-rgb: var(--color-ember-rgb);
  --color-accent-light: var(--color-ember-glow);
  --color-accent-dark: #c1440e;
  --color-accent-soft: var(--color-ember-dim);
  --color-success: var(--color-fern);
  --color-success-soft: var(--color-forest-dim);
  --color-error: var(--color-ember-red);
  --color-error-soft: var(--color-blood-dim);
  --color-info: var(--color-stream);
  --color-info-soft: var(--color-water-dim);
  --color-highlight-bg: var(--color-ember-glow);
  --color-highlight-text: var(--color-mud);
  --overlay-dark: rgba(0, 0, 0, 0.65);
  --overlay-light: hsla(0, 0%, 100%, 0.08);
  --shadow-card: 0 2px 10px rgba(0, 0, 0, 0.35);
  --shadow-card-hover: 0 8px 25px rgba(0, 0, 0, 0.45);
}
@media (prefers-color-scheme: dark), (prefers-color-scheme: light) {
  :root:not([data-theme]) {
    --color-bone: #f5f0e6;
    --color-cloud: #fdfcfa;
    --color-night-bg: #1a1714;
    --color-charcoal: #2c2825;
    --color-ash: #3d3835;
    --color-smoke: #9a938a;
    --color-mud: #100a07;
    --color-ember: #e85d04;
    --color-ember-rgb: 232, 93, 4;
    --color-ember-glow: #f97316;
    --color-ember-dim: #3d2a1f;
    --color-fern: #40916c;
    --color-fern-rgb: 64, 145, 108;
    --color-forest-dim: #1e3a2f;
    --color-ember-red: #dc2626;
    --color-blood-dim: #3d1f1f;
    --color-stream: #61a5c2;
    --color-water-dim: #1f2d3d;
    --color-heart: #b85c5c;
    --color-heart-soft: #3d2525;
    --color-background: var(--color-night-bg);
    --color-surface: var(--color-charcoal);
    --color-border: var(--color-ash);
    --color-text: var(--color-bone);
    --color-text-secondary: var(--color-smoke);
    --color-text-muted: var(--color-smoke);
    --color-primary: var(--color-fern);
    --color-primary-rgb: var(--color-fern-rgb);
    --color-primary-light: #52b788;
    --color-primary-dark: #2d6a4f;
    --color-primary-soft: var(--color-forest-dim);
    --color-accent: var(--color-ember);
    --color-accent-rgb: var(--color-ember-rgb);
    --color-accent-light: var(--color-ember-glow);
    --color-accent-dark: #c1440e;
    --color-accent-soft: var(--color-ember-dim);
    --color-success: var(--color-fern);
    --color-success-soft: var(--color-forest-dim);
    --color-error: var(--color-ember-red);
    --color-error-soft: var(--color-blood-dim);
    --color-info: var(--color-stream);
    --color-info-soft: var(--color-water-dim);
    --overlay-dark: rgba(0, 0, 0, 0.65);
    --overlay-light: hsla(0, 0%, 100%, 0.08);
    --shadow-card: 0 2px 10px rgba(0, 0, 0, 0.35);
    --shadow-card-hover: 0 8px 25px rgba(0, 0, 0, 0.45);
  }
}
*,
:after,
:before {
  box-sizing: border-box;
  -webkit-tap-highlight-color: transparent;
}
.fab,
.fad,
.fal,
.far,
.fas {
  font-style: normal;
  font-variant: normal;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
html {
  height: 100%;
  scroll-behavior: smooth;
}
body {
  background-color: var(--color-background);
  color: var(--color-text);
  font-family: var(--font-family-body);
  font-size: clamp(1rem, 0.95rem + 0.3vw, 1.125rem);
  line-height: 1.5;
  margin: 0;
  padding: 0;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  min-height: 100%;
  transition:
    background-color 0.3s ease,
    color var(--transition-normal);
}
.page:not(.home-page) {
  padding-top: var(--spacing-top-bar);
}
.btn.shimmer-sages-base-5s:is(:hover, .btn--active),
.shimmer-sages-base-5s {
  animation: shimmer-5s-repeatable 5s ease-in-out var(--shimmer-delay, 5s)
    var(--shimmer-iteration, infinite);
  background: var(--shimmer-gradient-sages);
  background-size: 300% 100%;
  position: relative;
}
.btn.shimmer-sages-base-10s:is(:hover, .btn--active),
.patron-name-shimmer-sages-base-10s:hover,
.shimmer-sages-base-10s {
  animation: shimmer-10s-repeatable 10s ease-in-out var(--shimmer-delay, 5s)
    var(--shimmer-iteration, infinite);
  background: var(--shimmer-gradient-sages);
  background-size: 300% 100%;
  position: relative;
}
.btn.shimmer-sages-base-20s:is(:hover, .btn--active),
.focus-tab.btn.shimmer-sages-base-20s:is(:hover, .btn--active),
.shimmer-sages-base-20s {
  animation: shimmer-20s-repeatable 20s ease-in-out var(--shimmer-delay, 5s)
    var(--shimmer-iteration, infinite);
  background: var(--shimmer-gradient-sages);
  background-size: 300% 100%;
  position: relative;
}
.shimmer-sages-base-10s i,
.shimmer-sages-base-20s i,
.shimmer-sages-base-5s i {
  color: var(--color-night);
}
.text-shimmer-5s-repeatable {
  animation: shimmer-5s-repeatable 5s ease-in-out 1.3s 1 forwards;
  background-clip: text;
  -webkit-background-clip: text;
  background-size: 300% 100%;
  color: transparent;
}
.text-shimmer-5s-repeatable.tier--sages {
  background-image: var(--shimmer-gradient-sages);
}
.no-shimmer {
  background: none !important;
  -webkit-background-clip: initial !important;
  background-clip: initial !important;
  color: initial !important;
}
::selection {
  background-color: var(--color-highlight-bg);
  color: var(--color-highlight-text);
}
::-moz-selection {
  background-color: var(--color-highlight-bg);
  color: var(--color-highlight-text);
}
:focus {
  outline: none;
}
:focus-visible {
  border-radius: var(--border-radius-sm);
  outline: 2px solid var(--color-primary);
  outline-offset: 2px;
}
::-webkit-scrollbar {
  width: 8px;
}
::-webkit-scrollbar-corner {
  background: var(--color-background);
}
::-webkit-scrollbar-thumb {
  background: rgba(var(--color-primary-rgb), 0.5);
  border-radius: var(--border-radius-pill);
}
h1,
h2,
h3,
h4,
h5,
h6 {
  color: var(--color-text);
  font-family: var(--font-family-heading);
  letter-spacing: 0.02em;
  line-height: 1.2;
  margin: 0;
  outline: none;
}
h1:focus-visible,
h2:focus-visible,
h3:focus-visible,
h4:focus-visible,
h5:focus-visible,
h6:focus-visible {
  outline: none;
}
h1 {
  font-size: clamp(2rem, 4vw, 3.5rem);
  font-weight: 700;
  letter-spacing: 0.05em;
}
h1,
h2 {
  text-transform: uppercase;
}
h2 {
  font-size: clamp(1.75rem, 3.5vw, 2.75rem);
  letter-spacing: 0.04em;
}
h2,
h3 {
  font-weight: 600;
}
h3 {
  font-size: clamp(1.5rem, 3vw, 2.25rem);
}
h4 {
  font-size: clamp(1.25rem, 2.5vw, 1.75rem);
}
h4,
h5 {
  font-weight: 500;
}
h5 {
  font-size: 1.25rem;
}
h6 {
  font-size: 1rem;
  font-weight: 500;
}
.subheading {
  font-family: var(--font-family-subheading);
  font-size: 1.25rem;
  font-style: italic;
  font-weight: 400;
  letter-spacing: 0.01em;
}
p {
  line-height: 1.7;
  margin: 0 0 var(--spacing-md);
}
span.text-line {
  display: block;
}
a {
  color: var(--color-accent);
  text-decoration: none;
  transition: var(--transition-fast);
}
a:hover {
  color: var(--color-accent-light);
}
button {
  background: none;
  border: none;
  cursor: pointer;
}
button,
input,
select,
textarea {
  font-family: var(--font-family-body);
  font-size: inherit;
}
input,
select,
textarea {
  color: inherit;
}
input:focus {
  border-color: var(--color-primary);
  box-shadow: 0 0 8px 2px rgba(var(--color-primary-rgb), 0.4);
  outline: none;
}
img {
  display: block;
  height: auto;
  max-width: 100%;
}
ol,
ul {
  margin: 0;
  padding: 0;
}
li {
  list-style: none;
}
.container {
  margin: 0 auto;
  max-width: 1200px;
  padding: 0 var(--spacing-xl);
}
.glowing-ember-card {
  background: linear-gradient(
    135deg,
    var(--color-surface) 0,
    var(--color-mud) 100%
  );
  border: 1px solid var(--color-border);
  border-radius: var(--border-radius-xxl);
  box-shadow: 0 8px 32px rgba(var(--color-accent-rgb), 0.15);
  margin: 0 auto;
  padding: var(--spacing-xxl) var(--spacing-xxl);
  text-align: center;
  transition: all var(--transition-normal);
}
.glowing-ember-card-sm {
  max-width: 560px;
}
.glowing-ember-card:hover {
  box-shadow: 0 20px 48px rgba(var(--color-accent-rgb), 0.25);
  transform: translateY(-8px);
}
.visually-hidden {
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  width: 1px;
  clip: rect(0, 0, 0, 0);
  border: 0;
  white-space: nowrap;
}
@keyframes fadeIn {
  0% {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes fadeOut {
  0% {
    opacity: 1;
  }
  to {
    opacity: 0;
  }
}
@keyframes slideUp {
  0% {
    opacity: 0;
    transform: translateY(40px) scale(0.96);
  }
  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}
@keyframes slideDown {
  0% {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
  to {
    opacity: 0;
    transform: translateY(30px) scale(0.97);
  }
}
@keyframes slideIn {
  0% {
    opacity: 0;
    transform: translateY(-10px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
@keyframes shimmer {
  0% {
    background-position: 100% 0;
  }
  to {
    background-position: -50% 0;
  }
}
@keyframes shimmer-5s-repeatable {
  0% {
    background-position: 100% 0;
  }
  20% {
    background-position: -50% 0;
  }
  to {
    background-position: -50% 0;
  }
}
@keyframes shimmer-10s-repeatable {
  0% {
    background-position: 100% 0;
  }
  10% {
    background-position: -50% 0;
  }
  to {
    background-position: -50% 0;
  }
}
@keyframes shimmer-20s-repeatable {
  0% {
    background-position: 100% 0;
  }
  5% {
    background-position: -50% 0;
  }
  to {
    background-position: -50% 0;
  }
}
@keyframes pulse {
  0% {
    opacity: 0.5;
    transform: scale(0.85);
  }
  70% {
    opacity: 0;
    transform: scale(1.2);
  }
  to {
    opacity: 0;
  }
}
@media (prefers-reduced-motion: reduce) {
  *,
  :after,
  :before {
    animation-duration: 0 !important;
    animation-iteration-count: 1 !important;
    scroll-behavior: auto !important;
    transition-duration: 0 !important;
  }
}
@media (prefers-contrast: high) {
  :root {
    --shadow-card: 0 2px 10px rgba(0, 0, 0, 0.3);
    --shadow-card-hover: 0 8px 25px rgba(0, 0, 0, 0.5);
  }
  a {
    text-decoration: underline;
  }
  button {
    border: 2px solid;
  }
}
@media (prefers-reduced-transparency: reduce) {
  :not(.whisper):not(.whisper-ember):not(.audio-controls-reveal-group):not(
      .scattered-rune
    ):not(.expandable-crypto-wrapper.collapsed) {
    opacity: 1 !important;
  }
}
@media print {
  body {
    padding-top: 0;
  }
  .hamburger,
  .nav-overlay,
  .navigation {
    display: none !important;
  }
  a {
    text-decoration: underline;
  }
  .container {
    max-width: none;
    padding: 0;
  }
}
.page-header {
  margin: var(--spacing-xl) auto;
  position: relative;
  text-align: center;
  z-index: 10;
}
.page-title {
  color: var(--color-primary);
  font-size: clamp(2.5rem, 6vw, 4rem);
  font-weight: 700;
  margin: 0 0 var(--spacing-md);
}
.page-subtitle {
  font-family: var(--font-family-subheading);
  font-size: 1.4rem;
  font-style: italic;
}
.page-description,
.page-subtitle {
  color: var(--color-text-secondary);
  line-height: 1.6;
  margin: 0 auto var(--spacing-lg);
  max-width: 600px;
}
.page-description {
  font-size: 1.2rem;
}
section {
  background: var(--color-background);
  padding: var(--spacing-section-vert-padding) 0;
}
.page-header + section {
  padding: 0 0 var(--spacing-section-vert-padding);
}
.section-header {
  margin-bottom: var(--spacing-xl);
  text-align: center;
}
.section-title {
  color: var(--color-text);
  font-size: clamp(2rem, 5vw, 2rem);
  font-weight: 600;
  margin: 0 0 var(--spacing-lg);
  text-align: center;
}
.section-title:after {
  background: linear-gradient(
    to right,
    transparent,
    var(--color-ember),
    transparent
  );
  content: '';
  display: block;
  height: 3px;
  margin: 0.75rem auto 0;
  width: 5rem;
}
.section-subtitle {
  font-family: var(--font-family-subheading);
  font-size: 1.4rem;
  font-style: italic;
  margin: 0 auto var(--spacing-lg);
  max-width: 65ch;
}
.section-description,
.section-subtitle {
  color: var(--color-text-secondary);
  line-height: 1.6;
}
.section-description {
  font-size: 1.2rem;
  margin: 0 auto 4rem;
  max-width: 800px;
  text-align: center;
}
.header-audio {
  align-items: center;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
.header-audio .section-title {
  margin-bottom: var(--spacing-sm);
}
.haiku {
  display: inline-block;
}
.haiku-line {
  display: block;
  text-align: start;
  white-space: nowrap;
}
.haiku--wind .haiku-line {
  animation: haiku-wind-in 0.9s ease-out forwards;
  opacity: 0;
}
.haiku--wind .haiku-line-1 {
  animation-delay: 0s;
}
.haiku--wind .haiku-line-2 {
  animation-delay: 0.15s;
}
.haiku--wind .haiku-line-3 {
  animation-delay: 0.3s;
}
@keyframes haiku-wind-in {
  0% {
    opacity: 0;
    transform: translate(-0.75rem);
  }
  to {
    opacity: 1;
    transform: translate(var(--haiku-offset, 0));
  }
}
.haiku--wind .haiku-line-2 {
  --haiku-offset: 2rem;
}
.haiku--wind .haiku-line-3 {
  --haiku-offset: 4rem;
}
.haiku--fade .haiku-line {
  animation: haiku-fade-in 0.8s ease forwards;
  opacity: 0;
}
.haiku--fade .haiku-line-1 {
  animation-delay: 0s;
}
.haiku--fade .haiku-line-2 {
  animation-delay: 0.2s;
}
.haiku--fade .haiku-line-3 {
  animation-delay: 0.4s;
}
@keyframes haiku-fade-in {
  0% {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@media (prefers-reduced-motion: reduce) {
  .haiku-line {
    animation: none !important;
    opacity: 1 !important;
  }
  .haiku--wind .haiku-line {
    transform: translate(var(--haiku-offset, 0));
  }
}
@media (max-width: 768px) {
  .page-header {
    margin: var(--spacing-lg) auto;
  }
  .page-title {
    font-size: clamp(2rem, 8vw, 3rem);
  }
  .page-subtitle {
    font-size: 1.4rem;
  }
  .page-header + section {
    padding: var(--spacing-md) 0 var(--spacing-xxl);
  }
  section {
    padding: var(--spacing-xxl) 0;
  }
  .container {
    padding: 0 var(--spacing-md);
  }
  .section-description {
    margin: 0 auto var(--spacing-xl);
  }
}
