:root {
  --pink: #041713;
  --pink-soft: #08231d;
  --nav-dark: rgba(3, 18, 15, .88);
  --mauve: #061c18;
  --mauve-dark: #09231d;
  --mauve-darker: #041713;
  --purple: #22d3a6;
  --purple-dark: #16b88f;
  --purple-deep: #78f0cf;
  --accent: #22d3a6;
  --bg: #03110e;
  --surface: #09221c;
  --surface2: #061a16;
  --ink: #effcf8;
  --ink-soft: #bad8cf;
  --ink-soft2: #7fa79b;
  --line: rgba(75, 222, 183, .16);
  --line-strong: rgba(34, 211, 166, .38);
  --green: #f4b860;
  --red-badge: #f4b860;
  --black: #03110e;
  --card-shadow: 0 18px 50px rgba(0, 8, 6, .42);
}

body {
  background:
    radial-gradient(950px 620px at 88% -8%, rgba(34, 211, 166, .18), transparent 62%),
    radial-gradient(720px 520px at -5% 35%, rgba(244, 184, 96, .08), transparent 62%),
    linear-gradient(rgba(75, 222, 183, .03) 1px, transparent 1px),
    linear-gradient(90deg, rgba(75, 222, 183, .03) 1px, transparent 1px),
    #03110e !important;
  background-size: auto, auto, 56px 56px, 56px 56px, auto !important;
  background-attachment: fixed !important;
}

nav {
  background: rgba(3, 18, 15, .88) !important;
  border-bottom-color: rgba(34, 211, 166, .18) !important;
}

.brand-mark {
  border-radius: 11px 4px 11px 4px !important;
  background: linear-gradient(145deg, #22d3a6 0%, #0c8f72 58%, #f4b860 100%) !important;
  box-shadow: 0 8px 24px rgba(34, 211, 166, .22);
  transform: rotate(-3deg);
}

.brand-mark svg { transform: rotate(3deg); }

.hero h1 {
  background: linear-gradient(92deg, #ffffff 0%, #78f0cf 52%, #f4b860 100%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  color: transparent !important;
}

.signup-btn,
.register-btn {
  border-radius: 12px !important;
  background: linear-gradient(100deg, #22d3a6 0%, #7ae6c8 70%, #f4b860 115%) !important;
  color: #03110e !important;
  box-shadow: 0 10px 30px rgba(34, 211, 166, .2) !important;
}

.access-card,
.foot-form,
.chart-card,
.perf-card,
.calc-card,
.market-card,
.who-card,
.review-card,
.card,
.showcase-card,
.algo-visual {
  border-color: rgba(34, 211, 166, .2) !important;
  border-radius: 18px !important;
}

.access-card,
.foot-form {
  background: linear-gradient(155deg, rgba(34, 211, 166, .08), transparent 42%), #09221c !important;
}

.eyebrow,
.flow-eyebrow,
.flow-sub-eyebrow {
  color: #56e4be !important;
  letter-spacing: .1em;
}

.badge,
.chip-plain,
.dach-row > span {
  border-color: rgba(34, 211, 166, .25) !important;
  background: rgba(34, 211, 166, .07) !important;
}

.final-card {
  background: linear-gradient(135deg, #09231d 0%, #0c4b3c 58%, #8b6530 125%) !important;
  border-color: rgba(244, 184, 96, .34) !important;
}

.bar-fill,
.tp-logo,
.avatar-init {
  background: linear-gradient(100deg, #22d3a6, #f4b860) !important;
}

.lang-list {
  background: #09221c !important;
  border-color: rgba(34, 211, 166, .3) !important;
}

input[type="text"],
input[type="email"],
input[type="tel"] {
  background: #051713 !important;
  border-color: rgba(89, 153, 136, .42) !important;
}

.hero-visual,
.algo-banner {
  border-radius: 20px !important;
  border-color: rgba(244, 184, 96, .22) !important;
}

@media (max-width: 600px) {
  .access-card,
  .foot-form,
  .card { border-radius: 15px !important; }
}