/* ============================================================
   evolve.family design system
   Shared across all pages. Remaps each page's legacy tokens
   onto the Geist / near-black / lime system so existing markup
   restyles without being rewritten.
   ============================================================ */

:root {
  /* core palette - dark (default) */
  --ef-bg:#09090b; --ef-bg2:#0e0e11;
  --ef-card:#131316; --ef-card2:#18181c;
  --ef-line:rgba(255,255,255,.07); --ef-line2:rgba(255,255,255,.14);
  --ef-ink:#fafafa; --ef-ink2:#a1a1aa; --ef-ink3:#6b6b74;
  --ef-acc:#c8ff4d; --ef-accfill:#c8ff4d; --ef-accink:#0a0a0b;
  --ef-neg:#ff6b6b;
  --ef-btn:#fafafa; --ef-btnink:#09090b;
  --ef-glow:rgba(200,255,77,.14);
  --ef-font:'Geist',system-ui,-apple-system,'Segoe UI',sans-serif;
  --ef-mono:'Geist Mono',ui-monospace,SFMono-Regular,monospace;
  --ef-r:20px; --ef-r-lg:24px; --ef-r-sm:14px;

  /* ---- legacy token remap ---- */
  --bg:var(--ef-bg);
  --bg-elev:var(--ef-card);
  --surface:var(--ef-card);
  --surface-hover:var(--ef-card2);
  --border:var(--ef-line);
  --border-strong:var(--ef-line2);
  --hairline:var(--ef-line);
  --text:var(--ef-ink);
  --text-muted:var(--ef-ink2);
  --text-dim:var(--ef-ink3);
  --blood:var(--ef-acc);
  --blood-bright:var(--ef-acc);
  --blood-deep:var(--ef-acc);
  --blood-dim:rgba(200,255,77,.18);
  --blood-glow:rgba(200,255,77,.10);
  --blood-glow-strong:var(--ef-glow);
  --accent:var(--ef-acc);
  --accent-hover:var(--ef-acc);
  --accent-soft:rgba(200,255,77,.14);
  --accent-line:var(--ef-line2);
  --agent-color:var(--ef-acc);
  --green:var(--ef-acc);
  --red:var(--ef-neg);
  --font-display:var(--ef-font);
  --font-body:var(--ef-font);
  --font-mono:var(--ef-mono);
  --radius:var(--ef-r); --radius-sm:var(--ef-r-sm); --radius-pill:999px;
  --shadow-soft:0 20px 60px -30px rgba(0,0,0,.7);
  --shadow-card:0 40px 100px -40px rgba(0,0,0,.6);
  --label-tracking:.02em; --display-tracking:-.04em;
}

html,body{
  background:var(--ef-bg)!important;
  color:var(--ef-ink);
  font-family:var(--ef-font);
  letter-spacing:-.01em;
  -webkit-font-smoothing:antialiased;
}
body::before{display:none!important}           /* legacy film grain */
.bg-layer,.grain,.vignette{display:none!important}

/* ---- typography ---- */
h1,h2,h3,h4,.hero-title,.page-title,.section-title{
  font-family:var(--ef-font)!important;
  font-weight:600!important;
  letter-spacing:-.04em!important;
  color:var(--ef-ink);
  text-transform:none!important;
}
h1{line-height:1}
.mono,code,pre,kbd{font-family:var(--ef-mono)!important}

/* ---- nav ---- */
nav,.nav,.site-nav,.topbar{
  background:var(--ef-bg)!important;
  border-bottom:1px solid var(--ef-line)!important;
  backdrop-filter:none!important;-webkit-backdrop-filter:none!important;
}
.nav-logo,.logo,.brand{
  font-family:var(--ef-font)!important;font-weight:600!important;
  font-size:18px!important;letter-spacing:-.04em!important;
  color:var(--ef-ink)!important;text-transform:none!important;
}
.nav-links a,.nav a,nav a{
  font-family:var(--ef-font)!important;font-size:14px!important;
  letter-spacing:-.01em!important;text-transform:none!important;
  color:var(--ef-ink2);
}
.nav-links a:hover,nav a:hover{color:var(--ef-ink)}

/* ---- surfaces ---- */
.card,.panel,.tile,.box,.agent-card,.stat-card,.module,
[class*="-card"],[class*="-panel"]{
  background:var(--ef-card);
  border:1px solid var(--ef-line);
  border-radius:var(--ef-r);
}

/* ---- buttons ---- */
button,.btn,.button,[class*="-btn"],a.cta,.cta{
  font-family:var(--ef-font)!important;
  font-weight:500!important;
  letter-spacing:-.01em!important;
  text-transform:none!important;
  border-radius:999px!important;
}
.btn-primary,.primary,button.primary,.cta-primary{
  background:var(--ef-btn)!important;color:var(--ef-btnink)!important;
  border:1px solid var(--ef-btn)!important;
}
.btn-secondary,.secondary,.ghost,.btn-ghost{
  background:transparent!important;color:var(--ef-ink)!important;
  border:1px solid var(--ef-line2)!important;
}

/* ---- inputs ---- */
input,textarea,select{
  font-family:var(--ef-font);
  background:var(--ef-card2);
  border:1px solid var(--ef-line2);
  border-radius:var(--ef-r-sm);
  color:var(--ef-ink);
}
input::placeholder,textarea::placeholder{color:var(--ef-ink3)}

/* ---- numerics ---- */
.stat-v,.stat-value,.value,.num,.pnl,[class*="-value"]{
  font-variant-numeric:tabular-nums;
  letter-spacing:-.03em;
}
.positive,.pos,.up,.green{color:var(--ef-acc)!important}
.negative,.neg,.down,.red{color:var(--ef-neg)!important}

/* ---- misc ---- */
hr,.divider,.rule{border-color:var(--ef-line)!important;background:var(--ef-line)!important}
::selection{background:rgba(200,255,77,.25);color:var(--ef-ink)}
::-webkit-scrollbar{width:10px;height:10px}
::-webkit-scrollbar-track{background:var(--ef-bg)}
::-webkit-scrollbar-thumb{background:var(--ef-line2);border-radius:999px}

/* ============================================================
   Refinements: lime is an accent, not a headline color.
   Legacy pages colored headline spans with --blood, which now
   maps to lime; pull those back to ink.
   ============================================================ */
h1 span,h2 span,h3 span,
h1 strong,h2 strong,
.page-title span,.section-title span,
.hero-title span{color:var(--ef-ink)!important}

/* keep the accent for genuine accents only */
.accent,.is-accent,.dot,.pulse,.live-dot{color:var(--ef-acc)!important}

/* legacy wordmarks read "EVOLVE" in caps - restore the lockup */
.nav-logo,.logo,.brand{
  font-size:18px!important;font-weight:600!important;
  letter-spacing:-.04em!important;text-transform:lowercase!important;
}

/* card fills: legacy pages used near-transparent tinted surfaces */
.agent-card,.stat-card,.card,.panel,.tile,
[class*="-card"],[class*="-panel"],[class*="-tile"],
.dna-block,.activity-feed,.feed,.table,.list-box{
  background:var(--ef-card)!important;
  border:1px solid var(--ef-line)!important;
  border-radius:var(--ef-r)!important;
}

/* links inside prose */
a{color:var(--ef-ink)}
a:hover{color:var(--ef-ink);opacity:.8}
.content a,p a,li a{color:var(--ef-acc);text-decoration:none}

/* section rules */
h2,h3{border-bottom-color:var(--ef-line)!important}

/* wordmark lockup: "evolve" in ink, ".family" muted */
.nav-logo .logo-dot,.logo .logo-dot{color:var(--ef-ink3)!important}

/* ============================================================
   Contrast + remaining legacy display styles
   ============================================================ */

/* Any lime-filled control needs dark ink - legacy rules set white text
   on what used to be a dark red fill. */
[style*="c8ff4d"],
.connect-btn,.connect-wallet,.wallet-connect,
.btn-accent,.accent-btn,.cta-accent{
  color:var(--ef-accink)!important;
}
.connect-btn,.connect-wallet,.wallet-connect{
  background:var(--ef-accfill)!important;
  border:1px solid var(--ef-accfill)!important;
  font-weight:600!important;
}

/* legacy display titles still rendering as serif caps */
.lab-title,.page-hero h1,.hero h1,.title-xl,.display{
  font-family:var(--ef-font)!important;
  text-transform:none!important;
  letter-spacing:-.05em!important;
  font-weight:600!important;
}

/* uppercase micro-labels keep their tracking but use the mono face */
.label,.eyebrow,.kicker,.section-label,[class*="-label"]{
  font-family:var(--ef-mono)!important;
  letter-spacing:.02em!important;
  font-size:12px!important;
  color:var(--ef-ink3)!important;
}

/* footers */
footer,.site-footer,.footer{
  background:var(--ef-bg)!important;
  border-top:1px solid var(--ef-line)!important;
  color:var(--ef-ink3);
}

/* preview name: legacy italic serif placeholder */
.preview-agent-name,.agent-name-preview{
  font-family:var(--ef-font)!important;
  font-style:normal!important;
  font-weight:600!important;
  letter-spacing:-.03em!important;
}
.preview-agent-name.empty{color:var(--ef-ink3)!important}

/* sub-label under a page title */
.lab-sub,.page-sub{font-family:var(--ef-font)!important;text-transform:none!important;
  letter-spacing:-.01em!important;font-size:17px!important;color:var(--ef-ink2)!important}

/* ============================================================
   Display titles: the legacy system used wide-tracked caps
   (letter-spacing .12em). The new one uses tight lowercase.
   Micro-labels keep their uppercase tracking - only the large
   display type changes.
   ============================================================ */
.page-title,.lab-title,.hero-title,.title-xl,
h1.page-title,h1.section-title{
  letter-spacing:-.05em!important;
  font-weight:600!important;
  text-transform:lowercase!important;
  line-height:1!important;
}
/* headline sub-lede */
.page-lede,.page-sub,.page-subtitle,.section-lede{
  font-family:var(--ef-font)!important;
  text-transform:none!important;letter-spacing:-.01em!important;
  color:var(--ef-ink2)!important;
}
/* the eyebrow above a page title stays mono/uppercase but muted */
.page-eyebrow{color:var(--ef-ink3)!important;font-family:var(--ef-mono)!important;
  font-size:12px!important;letter-spacing:.02em!important}
