:root {
  color-scheme: dark;

  --continuum-primary: #0f8a63;
  --continuum-primary-bright: #3fd39a;
  --continuum-primary-strong: #09513f;
  --continuum-primary-soft: rgba(15, 138, 99, 0.12);
  --continuum-primary-line: rgba(63, 211, 154, 0.34);
  --continuum-primary-glow: rgba(63, 211, 154, 0.24);
  --continuum-ink: #fff7eb;
  --continuum-text: #dceee7;
  --continuum-muted: #96b9ad;
  --continuum-faint: #6f8c84;
  --continuum-void: #04090c;
  --continuum-lift: #061411;
  --continuum-panel: rgba(4, 9, 12, 0.74);
  --continuum-panel-strong: rgba(7, 17, 15, 0.88);
  --continuum-line: rgba(196, 255, 231, 0.13);
  --continuum-line-strong: rgba(196, 255, 231, 0.24);
  --continuum-warm: #c9a96f;

  --bg: var(--continuum-void);
  --bg-2: var(--continuum-lift);
  --page: var(--continuum-void);
  --page-2: var(--continuum-lift);
  --panel: var(--continuum-panel);
  --panel-2: rgba(255, 255, 255, 0.055);
  --panel-3: rgba(255, 255, 255, 0.075);
  --surface: var(--continuum-panel);
  --surface-2: rgba(255, 255, 255, 0.055);
  --surface-hi: rgba(255, 255, 255, 0.09);
  --raised: rgba(255, 255, 255, 0.075);
  --ink: var(--continuum-ink);
  --text: var(--continuum-text);
  --muted: var(--continuum-muted);
  --faint: var(--continuum-faint);
  --line: var(--continuum-line);
  --line-strong: var(--continuum-line-strong);
  --line-soft: rgba(196, 255, 231, 0.075);
  --accent: var(--continuum-primary);
  --accent-strong: var(--continuum-primary-bright);
  --accent-tint: var(--continuum-primary-soft);
  --accent-line: var(--continuum-primary-line);
  --teal: var(--continuum-primary);
  --teal-strong: var(--continuum-primary-bright);
  --teal-dim: rgba(15, 138, 99, 0.18);
  --green: var(--continuum-primary-bright);
  --cyan: var(--continuum-primary-bright);
  --blue: var(--continuum-primary);
  --violet: var(--continuum-primary);
  --violet-2: var(--continuum-primary-bright);
  --amber: var(--continuum-warm);
  --gold: var(--continuum-primary);
  --gold-soft: var(--continuum-primary-soft);
  --gold-line: var(--continuum-primary-line);
  --chrome-bg: rgba(4, 9, 12, 0.84);
  --shadow: rgba(0, 0, 0, 0.58);
  --shadow-sm: 0 10px 28px rgba(0, 0, 0, 0.26);
  --elev-1: 0 18px 54px rgba(0, 0, 0, 0.22);
  --elev-2: 0 24px 70px rgba(0, 0, 0, 0.28);
  --elev-3: 0 30px 90px rgba(0, 0, 0, 0.34);
  --glow-accent: 0 0 0 1px rgba(63, 211, 154, 0.22), 0 16px 42px rgba(63, 211, 154, 0.13);
  --glow-green: var(--glow-accent);
  --glow-cyan: var(--glow-accent);
  --glow-violet: var(--glow-accent);
  --ring: 0 0 0 3px rgba(63, 211, 154, 0.18), 0 0 0 1px var(--continuum-primary-bright);
  --pulse-bg: var(--continuum-void);
  --pulse-lift: var(--continuum-lift);
  --pulse-edge: #07362b;
  --pulse-edge-rgb: 7, 54, 43;
  --pulse-accent-rgb: 63, 211, 154;
  --pulse-third-rgb: 17, 111, 82;
  --pulse-purple-rgb: 18, 72, 58;
  --pulse-midnight-rgb: 10, 28, 36;
  --radius: 8px;
  --radius-md: 8px;
  --radius-lg: 8px;
  --font-sans: "Inter", ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-display: "Space Grotesk", var(--font-sans);
}

html {
  color-scheme: dark !important;
  background: var(--continuum-void) !important;
}

body,
body.os,
.cockpit-root,
.workspace {
  color: var(--text) !important;
  background:
    radial-gradient(920px 660px at 0% -4%, rgba(var(--pulse-edge-rgb), 0.15), transparent 68%),
    radial-gradient(760px 520px at 100% 6%, rgba(var(--pulse-third-rgb), 0.14), transparent 72%),
    radial-gradient(920px 650px at 92% 26%, rgba(var(--pulse-accent-rgb), 0.11), transparent 78%),
    radial-gradient(840px 640px at 8% 78%, rgba(var(--pulse-midnight-rgb), 0.18), transparent 78%),
    radial-gradient(720px 520px at 100% 100%, rgba(var(--pulse-accent-rgb), 0.08), transparent 72%),
    radial-gradient(560px 420px at 52% 112%, rgba(var(--pulse-third-rgb), 0.06), transparent 74%),
    linear-gradient(180deg, var(--continuum-void) 0%, var(--continuum-lift) 50%, #071812 74%, var(--continuum-void) 100%) !important;
  background-size: 132% 132%, 142% 142%, 142% 142%, 150% 150%, 152% 152%, 136% 136%, 100% 100% !important;
  background-position: 0% 0%, 100% 6%, 92% 26%, 8% 78%, 100% 100%, 52% 112%, 0 0 !important;
  background-attachment: fixed !important;
  letter-spacing: 0 !important;
  animation: continuumNightPulse 12.4s ease-in-out infinite !important;
}

body::before {
  content: "" !important;
  position: fixed !important;
  inset: 0 !important;
  z-index: 0 !important;
  display: block !important;
  pointer-events: none !important;
  background-image:
    radial-gradient(circle at 16% 22%, rgba(255, 255, 255, 0.68) 0 1px, transparent 1.5px),
    radial-gradient(circle at 42% 12%, rgba(255, 255, 255, 0.48) 0 1px, transparent 1.5px),
    radial-gradient(circle at 74% 18%, rgba(255, 255, 255, 0.52) 0 1px, transparent 1.5px),
    radial-gradient(circle at 88% 58%, rgba(255, 255, 255, 0.34) 0 1px, transparent 1.5px),
    radial-gradient(circle at 62% 72%, rgba(175, 255, 219, 0.38) 0 1px, transparent 1.5px) !important;
  background-size: 240px 180px, 320px 220px, 280px 210px, 360px 260px, 300px 240px !important;
  opacity: 0.42 !important;
  animation: continuumStarDrift 22s linear infinite !important;
}

body::after {
  content: "" !important;
  position: fixed !important;
  inset: -6% -12% !important;
  z-index: 0 !important;
  display: block !important;
  pointer-events: none !important;
  background:
    linear-gradient(112deg, transparent 0 24%, rgba(63, 211, 154, 0.17) 36%, rgba(15, 138, 99, 0.10) 48%, transparent 62%),
    linear-gradient(72deg, transparent 0 36%, rgba(var(--pulse-midnight-rgb), 0.20) 46%, rgba(63, 211, 154, 0.10) 59%, transparent 74%),
    linear-gradient(132deg, transparent 0 24%, rgba(17, 111, 82, 0.21) 42%, rgba(63, 211, 154, 0.10) 56%, transparent 72%),
    linear-gradient(26deg, transparent 0 52%, rgba(159, 245, 209, 0.14) 64%, transparent 80%),
    linear-gradient(160deg, transparent 0 18%, rgba(63, 211, 154, 0.09) 34%, transparent 52%) !important;
  filter: blur(22px) !important;
  opacity: 0.84 !important;
  transform: translate3d(0, 0, 0) skewY(-5deg) !important;
  animation: continuumAuroraPulse 12s ease-in-out infinite !important;
}

body > header,
body > main,
body > section,
body > footer,
body > div,
body > nav {
  position: relative;
  z-index: 1;
}

body,
button,
input,
select,
textarea {
  font-family: var(--font-sans) !important;
}

::selection {
  background: rgba(63, 211, 154, 0.28);
  color: var(--ink);
}

a {
  color: var(--continuum-primary-bright);
}

h1,
h2,
h3,
h4,
.hero,
.hero-line,
.brand-name,
.brand-title,
.nav-brand-title,
.reader-title,
.metric-value,
.hero-wordmark,
.big-number,
.offer-price {
  color: var(--ink) !important;
  letter-spacing: 0 !important;
}

h1,
h2,
h3,
.brand-name,
.hero-wordmark {
  font-family: var(--font-display) !important;
}

p,
li,
.lede,
.lead,
.hero-copy,
.hero-sub,
.hero-proof-line,
.section-intro,
.section-copy,
.row-desc,
.plane-desc,
.panel-kicker,
.source-note {
  color: var(--text) !important;
}

.muted,
.faint,
.brand-meta,
.nav-brand-sub,
.meta,
.eyebrow,
.section-kicker,
.kicker,
.rail-section-label,
.panel-label,
.window-meta,
.badge,
.hint,
small {
  color: var(--muted) !important;
  letter-spacing: 0 !important;
}

.eyebrow,
.section-kicker,
.kicker,
.panel-label,
.rail-section-label,
.offer-step,
.hero-kicker,
.hero-eyebrow,
.cf-console-label,
.cf-flow-label {
  color: var(--continuum-primary-bright) !important;
  font-family: var(--font-display) !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase;
}

.eyebrow::before,
.hero-eyebrow::before,
.status-dot,
.log-dot,
.record-pill,
.badge.good {
  background: var(--continuum-primary-bright) !important;
  box-shadow: 0 0 18px rgba(63, 211, 154, 0.62) !important;
}

.topbar,
.site-header,
header,
.menu-bar,
.atlas-nav,
.tool-rail,
.inspector,
.bottom-dock,
.taskbar,
.nav-shell {
  border-color: var(--line) !important;
  background: rgba(4, 9, 12, 0.84) !important;
  -webkit-backdrop-filter: blur(18px) saturate(1.08);
  backdrop-filter: blur(18px) saturate(1.08);
  box-shadow: 0 18px 52px rgba(0, 0, 0, 0.18) !important;
}

.brand,
.nav a,
.nav-links a,
.menus button,
.menu-list a,
.menu-list button,
.rail-btn,
.nav-link,
.nav-back,
.nav-cockpit {
  color: var(--muted) !important;
  text-decoration: none;
}

.brand:hover,
.nav a:hover,
.nav-links a:hover,
.menus button:hover,
.menu-list a:hover,
.menu-list button:hover,
.rail-btn:hover,
.rail-btn[aria-current="page"],
.nav-link:hover,
.nav-link.active,
.nav-cockpit:hover,
.nav-back:hover {
  color: var(--ink) !important;
  background: rgba(63, 211, 154, 0.08) !important;
  border-color: var(--continuum-primary-line) !important;
}

.button,
.cf-button,
button,
.link-button,
.primary-link,
.btn,
.btn-cta,
.nav .primary-link,
.nav-links .button,
.rail-btn,
select,
input,
textarea {
  border-radius: 8px !important;
  border-color: var(--line) !important;
  box-shadow: none !important;
}

.button,
.cf-button,
button,
.link-button,
.btn,
.btn-cta,
.primary-link {
  background: rgba(255, 255, 255, 0.055) !important;
  color: var(--ink) !important;
}

.button.primary,
.cf-button.primary,
.btn.primary,
.nav .primary-link,
.nav-links .button,
.btn-cta,
button[type="submit"],
.hero-actions .primary,
.hero-actions .btn.primary {
  border-color: rgba(63, 211, 154, 0.55) !important;
  background: linear-gradient(135deg, var(--continuum-primary-bright) 0%, var(--continuum-primary) 100%) !important;
  color: #04130e !important;
  box-shadow: 0 16px 38px rgba(63, 211, 154, 0.16) !important;
}

.button:hover,
.cf-button:hover,
button:hover,
.link-button:hover,
.btn:hover,
.btn-cta:hover {
  transform: translateY(-1px);
}

.panel,
.card,
.launch-card,
.hero-card,
.row-card,
.plane-card,
.obj-card,
.kernel-card,
.rule,
.proof-item,
.metric,
.stat,
.tile,
.window,
.form-panel,
.output-panel,
.reader-card,
.claim,
.callout,
.notice,
.managed,
.upgrade,
.records-table,
.memory-item,
.workflow-animation,
.workflow-board,
.truth-panel,
.truth-card,
.chart-card,
.bar-row,
.field-box,
.handoff-card,
.work-card,
.schedule-card,
.health-card,
.hub-panel,
.display-panel,
.context-card,
.record-mock,
.pricing-card,
.option-card,
.tool-choice {
  border-color: var(--line) !important;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.075), rgba(255, 255, 255, 0.04)),
    rgba(4, 9, 12, 0.54) !important;
  color: var(--text) !important;
  box-shadow: var(--elev-1) !important;
}

.continuum-hero,
.hero,
.reader-head,
main.shell,
.band,
.statement-band,
.cta-band,
.section,
.page,
main,
.os,
.workspace {
  background: transparent !important;
}

.hero-bg,
.continuum-hero::before,
.band::before,
.statement-band::before,
.cta-band::before {
  display: none !important;
}

.statement-band,
.cta-band {
  border-color: var(--line) !important;
}

.hero-logo-picture {
  width: min(100%, 720px) !important;
}

.brand img,
.brand-logo,
.brand-mark,
.brand-wordmark,
.hero-logo,
.system-identity img {
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  object-fit: contain !important;
}

.brand-logo {
  width: min(220px, 52vw) !important;
  height: auto !important;
  max-height: 54px !important;
}

.hero-logo {
  width: min(100%, 760px) !important;
  height: auto !important;
  max-height: 220px !important;
  opacity: 1 !important;
  filter: drop-shadow(0 0 22px rgba(63, 211, 154, 0.18)) !important;
}

.hero > .hero-logo {
  opacity: 0.13 !important;
}

.continuum-hero .hero-logo,
.system-identity img {
  opacity: 1 !important;
}

.route,
.workflow-routes path {
  stroke: var(--continuum-primary-bright) !important;
}

.worker,
.work-packet,
.memory-worker,
.node,
.row-icon,
.plane-label,
.obj-name,
.rec-name,
.accent,
.hero-card-title,
.big-number,
.bar-value,
.record-pill,
.price {
  color: var(--continuum-primary-bright) !important;
  border-color: var(--continuum-primary-line) !important;
}

.memory-worker,
.worker-dot,
.hero-flowcards::after {
  box-shadow: 0 0 22px rgba(63, 211, 154, 0.32) !important;
}

.bar-fill,
.cf-flowmeter::before,
.progress,
.meter-fill {
  background: linear-gradient(90deg, var(--continuum-primary-bright), var(--continuum-primary)) !important;
}

input,
textarea,
select,
pre {
  background: rgba(0, 0, 0, 0.22) !important;
  color: var(--ink) !important;
  border-color: var(--line) !important;
}

input::placeholder,
textarea::placeholder {
  color: rgba(220, 238, 231, 0.48) !important;
}

pre,
code,
.mono {
  color: var(--ink) !important;
}

footer,
.footer,
.site-footer {
  color: var(--muted) !important;
  border-color: var(--line) !important;
  background: rgba(4, 9, 12, 0.56) !important;
}

.evan-scroll-guide,
.evan-helper-panel,
.evan-greeting {
  --cf-guide-teal: var(--continuum-primary-bright);
  --cf-guide-blue: var(--continuum-primary);
  --cf-guide-purple: var(--continuum-primary-strong);
}

.evan-avatar img,
.evan-avatar-webgl {
  filter: drop-shadow(0 0 12px rgba(63, 211, 154, 0.7)) drop-shadow(0 20px 34px rgba(0, 0, 0, 0.34)) !important;
}

@keyframes continuumNightPulse {
  0%,
  100% {
    background-position: 0% 0%, 100% 6%, 92% 26%, 8% 78%, 100% 100%, 52% 112%, 0 0;
  }

  43% {
    background-position: 3% 2%, 96% 12%, 86% 31%, 12% 74%, 96% 96%, 56% 108%, 0 0;
  }

  71% {
    background-position: 1% 4%, 98% 7%, 96% 22%, 6% 82%, 100% 94%, 48% 116%, 0 0;
  }
}

@keyframes continuumAuroraPulse {
  0%,
  100% {
    opacity: 0.58;
    transform: translate3d(0, 0, 0) skewY(-5deg);
  }

  50% {
    opacity: 0.9;
    transform: translate3d(1.5%, -1%, 0) skewY(-4deg);
  }
}

@keyframes continuumStarDrift {
  from {
    background-position: 0 0, 0 0, 0 0, 0 0, 0 0;
  }

  to {
    background-position: 240px 180px, -320px 220px, 280px -210px, -360px -260px, 180px -240px;
  }
}

@media (max-width: 760px) {
  .topbar,
  header,
  .menu-bar {
    background: rgba(4, 9, 12, 0.94) !important;
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
  }

  .hero-logo {
    max-height: 156px !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  body,
  body::before,
  body::after,
  .route,
  .memory-worker::after,
  .work-packet {
    animation: none !important;
  }
}