:root {
  --bg: #111b1a;
  --bg-soft: #182522;
  --panel: #22312b;
  --panel-2: #2a3c34;
  --panel-3: #33473d;
  --text: #f7eedf;
  --text-soft: #e1d6c7;
  --muted: #a9b5aa;
  --line: #3e5548;

  --berry: #e56f86;
  --berry-deep: #bd4e67;
  --berry-soft: #4a2833;

  --leaf: #8fae8b;
  --leaf-bright: #b4c9aa;
  --leaf-deep: #59745f;

  --gold: #e2c27a;
  --cream: #f7eedf;
  --lavender: #b8a7d8;
  --night: #242b46;
  --night-soft: #303653;
  --moss: #728d73;
}

body {
  color: var(--text);
  background:
    radial-gradient(circle at 12% 3%, rgba(143,174,139,.15), transparent 27%),
    radial-gradient(circle at 88% 8%, rgba(184,167,216,.12), transparent 24%),
    radial-gradient(circle at 72% 75%, rgba(229,111,134,.07), transparent 28%),
    linear-gradient(180deg, #16231f 0%, #121c1a 48%, #111823 100%);
}

body::before {
  opacity: .34;
  background-image:
    radial-gradient(circle at 20% 30%, rgba(247,238,223,.10) 0 1px, transparent 1.5px),
    radial-gradient(circle at 70% 60%, rgba(184,167,216,.10) 0 1px, transparent 1.5px),
    radial-gradient(circle at 45% 80%, rgba(226,194,122,.06) 0 1px, transparent 1.5px);
  background-size: 30px 30px, 43px 43px, 61px 61px;
}

.topbar {
  background: rgba(17, 27, 26, .91);
  border-bottom: 1px solid rgba(184,167,216,.15);
  box-shadow: 0 8px 28px rgba(4,8,8,.24);
}

.brand-mark {
  background:
    radial-gradient(circle at 28% 20%, rgba(226,194,122,.12), transparent 42%),
    linear-gradient(145deg, rgba(229,111,134,.28), rgba(184,167,216,.15)),
    #23312c;
  border-color: rgba(229,111,134,.28);
  box-shadow:
    inset 0 0 20px rgba(229,111,134,.07),
    0 0 22px rgba(184,167,216,.06);
}

.search-wrap,
.search-results {
  background: rgba(31,45,40,.94);
  border-color: #40584b;
}

.search-wrap:focus-within {
  border-color: rgba(184,167,216,.62);
  box-shadow: 0 0 0 3px rgba(184,167,216,.10);
}

.search-results a { border-bottom-color: #384c42; }
.search-results a:hover { background: #2c4037; }

kbd,
.code-line {
  background: #171f2d;
  border-color: rgba(184,167,216,.24);
  color: #efe8f7;
}

.top-link,
.button {
  color: #25191c;
  background: linear-gradient(135deg, #e9c77f, #df8798 62%, #c0afd9);
  box-shadow: 0 6px 20px rgba(229,111,134,.16);
}

.sidebar {
  background:
    radial-gradient(circle at 10% 0%, rgba(143,174,139,.10), transparent 25%),
    linear-gradient(180deg, rgba(39,56,48,.96), rgba(27,38,35,.96));
  border-color: #405548;
}

.nav-group-title {
  color: var(--gold);
}

.nav-link {
  color: #c7cec6;
}

.nav-link:hover {
  border-color: rgba(184,167,216,.13);
}

.nav-link.active {
  background: linear-gradient(90deg, rgba(229,111,134,.18), rgba(184,167,216,.10), rgba(143,174,139,.08));
  border-color: rgba(229,111,134,.22);
  box-shadow: inset 3px 0 0 var(--berry);
}

.breadcrumb {
  color: #c9b7df;
}

.hero {
  background:
    radial-gradient(circle at 88% 8%, rgba(184,167,216,.18), transparent 28%),
    radial-gradient(circle at 10% 95%, rgba(143,174,139,.14), transparent 26%),
    radial-gradient(circle at 60% 120%, rgba(229,111,134,.10), transparent 32%),
    linear-gradient(150deg, rgba(43,62,53,.94), rgba(29,39,43,.92) 58%, rgba(35,39,61,.88));
  border-color: rgba(184,167,216,.18);
  box-shadow: 0 16px 42px rgba(5,9,13,.20);
}

.hero::after {
  content: "✦  🍓  ☾  ✦";
  color: rgba(226,194,122,.34);
}

.hero h1,
.section h2,
.section h3,
.catalog-details h3,
.section strong {
  color: var(--cream);
}

.hero p,
.section p {
  color: #ddd4c8;
}

.eyebrow {
  color: #ffd3dc;
  background: linear-gradient(90deg, rgba(189,78,103,.20), rgba(184,167,216,.13));
  border-color: rgba(229,111,134,.28);
}

.section {
  border-top-color: rgba(184,167,216,.10);
}

.highlight {
  background: linear-gradient(transparent 58%, rgba(226,194,122,.14) 58%);
}

.highlight.berry {
  background: linear-gradient(transparent 58%, rgba(229,111,134,.20) 58%);
}

.info-card,
.feature,
.catalog-card,
.bank-item {
  background:
    radial-gradient(circle at 100% 0%, rgba(184,167,216,.07), transparent 31%),
    linear-gradient(150deg, #2a3b33, #202d29 62%, #242a3d);
  border-color: rgba(143,174,139,.17);
}

.feature::after {
  background: rgba(229,111,134,.07);
}

.quote-card {
  background: linear-gradient(90deg, rgba(143,174,139,.18), rgba(43,52,48,.88), rgba(184,167,216,.08));
  border-color: rgba(143,174,139,.20);
  border-left-color: var(--leaf-bright);
}

.notice {
  background: linear-gradient(90deg, rgba(226,194,122,.13), rgba(49,48,53,.90), rgba(184,167,216,.07));
  border-color: rgba(226,194,122,.27);
}

.clean-list li,
.steps li {
  color: #ddd6ca;
}

.clean-list li::before {
  color: var(--berry);
}

.steps li::before {
  background: linear-gradient(145deg, #34493d, #2c3249);
  color: #f0d38e;
  border-color: rgba(184,167,216,.22);
}

.toc-title {
  color: #b9adcb;
}

.toc a {
  color: #aab5ad;
  border-left-color: #3b4d46;
}

.toc a:hover,
.toc a.active {
  color: #ead393;
  border-color: var(--berry);
}

.item-tag {
  color: #f3a8b8;
}

.stat-row span {
  color: #d1d4ca;
  background: rgba(18,24,29,.38);
  border-color: rgba(184,167,216,.09);
}

.recipe-card {
  background: linear-gradient(145deg, #202e29, #20263a);
  border-color: rgba(184,167,216,.18);
}

.recipe-card > div:not(.recipe-plus):not(.recipe-arrow) {
  background: #2e3d36;
}

.bank-item.payout {
  border-color: rgba(226,194,122,.28);
}

.bank-arrow {
  color: #ef8da0;
}

.creator-credit {
  color: #c4c9bf;
  background: rgba(27,31,42,.38);
  border-color: rgba(184,167,216,.10);
}

.creator-credit a {
  color: #efafbd;
}

.sidebar-footer,
.feature span,
.muted-note,
.search-results small {
  color: #aeb8ad;
}