:root {
  --fs-paper: #f4f4f1;
  --fs-panel: #fbfbf9;
  --fs-ink: #15181a;
  --fs-ink-soft: #565c5d;
  --fs-ink-faint: #8b908d;
  --fs-line: #dfe0da;
  --fs-pine: #123d2b;
  --fs-pine-deep: #0e3323;
  --fs-pine-ink: #eaf3e9;
  --fs-pine-faint: #8fb4a0;
  --fs-brass: #2e8b57;
  --fs-leaf: #93e24e;
  --fs-display: "Bricolage Grotesque", system-ui, sans-serif;
  --fs-body: "Hanken Grotesk", system-ui, sans-serif;
  --fs-mono: "IBM Plex Mono", ui-monospace, monospace;
}

html,
body {
  background: var(--fs-paper) !important;
  color: var(--fs-ink) !important;
  font-family: var(--fs-body) !important;
}

body > div,
.min-h-screen,
[style*="#0A0A0A"],
[style*="rgb(10, 10, 10)"] {
  background-color: var(--fs-paper) !important;
  color: var(--fs-ink) !important;
}

h1,
h2,
h3,
.font-semibold,
.font-bold,
.font-medium {
  font-family: var(--fs-display) !important;
  letter-spacing: 0 !important;
}

.tracking-widest,
.tracking-wide,
.uppercase {
  font-family: var(--fs-mono) !important;
  letter-spacing: 0.14em !important;
}

.text-white,
.text-white\/80,
.text-white\/70 {
  color: var(--fs-ink) !important;
}

.text-white\/60,
.text-white\/50,
.text-white\/40 {
  color: var(--fs-ink-soft) !important;
}

.text-white\/30,
.text-white\/20 {
  color: var(--fs-ink-faint) !important;
}

.bg-black,
[style*="#111111"],
[style*="#161616"],
[style*="#0D0D0D"],
[style*="#1E1E1E"],
[style*="rgb(17, 17, 17)"],
[style*="rgb(22, 22, 22)"],
[style*="rgb(13, 13, 13)"],
[style*="rgb(30, 30, 30)"] {
  background-color: var(--fs-panel) !important;
  color: var(--fs-ink) !important;
}

[style*="#0D0D0D"],
[style*="rgb(13, 13, 13)"] {
  background-color: var(--fs-pine-deep) !important;
  color: var(--fs-pine-ink) !important;
}

section:has(h2) {
  background-color: var(--fs-paper);
}

section:has(h2) h2 {
  color: var(--fs-ink) !important;
}

section[style*="#0D0D0D"]:has(h2),
section[style*="rgb(13, 13, 13)"]:has(h2) {
  background-color: var(--fs-pine-deep) !important;
}

section[style*="#0D0D0D"]:has(h2) h2,
section[style*="rgb(13, 13, 13)"]:has(h2) h2 {
  color: var(--fs-pine-ink) !important;
}

[style*="#0D0D0D"] .text-white,
[style*="#0D0D0D"] .text-white\/80,
[style*="#0D0D0D"] .text-white\/70,
[style*="rgb(13, 13, 13)"] .text-white,
[style*="rgb(13, 13, 13)"] .text-white\/80,
[style*="rgb(13, 13, 13)"] .text-white\/70 {
  color: var(--fs-pine-ink) !important;
}

[style*="#0D0D0D"] .text-white\/60,
[style*="#0D0D0D"] .text-white\/50,
[style*="#0D0D0D"] .text-white\/40,
[style*="rgb(13, 13, 13)"] .text-white\/60,
[style*="rgb(13, 13, 13)"] .text-white\/50,
[style*="rgb(13, 13, 13)"] .text-white\/40 {
  color: var(--fs-pine-faint) !important;
}

[style*="#0D0D0D"] [style*="#161616"],
[style*="#0D0D0D"] [style*="rgb(22, 22, 22)"],
[style*="rgb(13, 13, 13)"] [style*="#161616"],
[style*="rgb(13, 13, 13)"] [style*="rgb(22, 22, 22)"] {
  background-color: var(--fs-panel) !important;
  border-color: rgba(234, 243, 233, 0.22) !important;
  color: var(--fs-ink) !important;
}

[style*="#0D0D0D"] [style*="#161616"] span,
[style*="#0D0D0D"] [style*="rgb(22, 22, 22)"] span,
[style*="rgb(13, 13, 13)"] [style*="#161616"] span,
[style*="rgb(13, 13, 13)"] [style*="rgb(22, 22, 22)"] span {
  color: var(--fs-ink) !important;
}

section,
footer,
.border-t,
.border-y,
.border-white\/10 {
  border-color: var(--fs-line) !important;
}

[style*="rgba(255,255,255,0.08)"],
[style*="rgba(255,255,255,0.06)"],
[style*="rgba(255, 255, 255, 0.08)"],
[style*="rgba(255, 255, 255, 0.06)"] {
  border-color: var(--fs-line) !important;
}

button,
a[style*="#E91E8C"],
button[style*="#E91E8C"],
a[style*="rgb(233, 30, 140)"],
button[style*="rgb(233, 30, 140)"] {
  background-color: var(--fs-pine) !important;
  border-color: var(--fs-pine) !important;
  color: var(--fs-pine-ink) !important;
}

button:hover,
a[style*="#E91E8C"]:hover {
  background-color: var(--fs-leaf) !important;
  border-color: var(--fs-leaf) !important;
  color: #10331f !important;
}

p[style*="#E91E8C"],
[style*="color: rgb(233, 30, 140)"],
svg[style*="#E91E8C"],
path[stroke="#E91E8C"] {
  color: var(--fs-brass) !important;
  stroke: var(--fs-brass) !important;
}

img {
  border-color: var(--fs-line) !important;
}

.brightness-0.invert {
  filter: grayscale(1) contrast(1.15) !important;
  opacity: 0.48 !important;
}

.shadow-2xl {
  box-shadow: 0 24px 70px rgba(18, 61, 43, 0.14) !important;
}

.backdrop-blur-sm {
  background-color: rgba(18, 61, 43, 0.42) !important;
}

input,
select,
textarea {
  background: var(--fs-paper) !important;
  color: var(--fs-ink) !important;
  border-color: var(--fs-line) !important;
}

[role="dialog"],
.rounded-3xl {
  background-color: var(--fs-panel) !important;
  border-color: var(--fs-line) !important;
}

footer {
  background: var(--fs-pine-deep) !important;
  color: var(--fs-pine-ink) !important;
}

footer p {
  color: var(--fs-pine-faint) !important;
}

footer .text-white\/30,
footer .text-white\/20 {
  color: var(--fs-pine-faint) !important;
}

@media (max-width: 768px) {
  .fixed.bottom-0 {
    background-color: rgba(251, 251, 249, 0.96) !important;
    border-color: var(--fs-line) !important;
  }
}