:root {
  --bg: #02040a;
  --bg-2: #050914;
  --panel: rgba(5, 12, 22, .62);
  --panel-solid: #050c16;
  --line: rgba(128, 179, 218, .18);
  --line-soft: rgba(128, 179, 218, .1);
  --text: #edf8fc;
  --muted: #9fb7c1;
  --teal: #4de0d0;
  --cyan: #18a8e8;
  --blue: #0b48a6;
  --violet: #9b6bff;
  --yellow: #efc86b;
  --red: #ef6e7c;
  --green: #45dfa3;
  --shadow: 0 28px 90px rgba(0, 0, 0, .38);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  min-height: 100vh;
  color: var(--text);
  background: #04060d;
  font-family: Arial, "Microsoft YaHei", sans-serif;
  letter-spacing: 0;
}
.neural-canvas {
  position: fixed;
  inset: 0;
  z-index: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  opacity: 1;
}
button, input, textarea, select { font: inherit; }
button { cursor: pointer; }
a { color: inherit; }
.hidden { display: none !important; }

.eyebrow {
  margin: 0 0 10px;
  color: var(--teal);
  font: 800 11px/1.2 Consolas, monospace;
  letter-spacing: 0;
}
.muted { color: var(--muted); line-height: 1.75; }
h1, h2, h3, h4 { margin: 0; letter-spacing: 0; }
h2 { font-size: clamp(30px, 4vw, 54px); line-height: 1.05; }
h3 { font-size: 22px; }

.fixed-nav {
  position: fixed;
  z-index: 60;
  top: 0;
  left: 0;
  right: 0;
  height: 84px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  padding: 0 min(12vw, 190px);
  background: rgba(2, 4, 10, .58);
  border-bottom: 1px solid rgba(128, 179, 218, .12);
  backdrop-filter: blur(20px);
}
.wordmark, .mega-logo {
  display: inline-flex;
  align-items: center;
  gap: 14px;
  text-decoration: none;
  white-space: nowrap;
}
.logo-home { cursor: pointer; }
.wordmark i, .mega-logo i {
  position: relative;
  flex: 0 0 auto;
  width: 48px;
  height: 48px;
  background:
    radial-gradient(circle at 25% 20%, rgba(77, 224, 208, .22), transparent 38%),
    linear-gradient(145deg, rgba(5, 21, 33, .98), rgba(3, 10, 20, .98));
  border: 1px solid rgba(237, 248, 252, .72);
  border-radius: 8px;
  box-shadow: 0 0 28px rgba(77, 224, 208, .18), inset 0 0 0 1px rgba(77, 224, 208, .12);
}
.wordmark i::before, .mega-logo i::before {
  content: "";
  position: absolute;
  left: 9px;
  top: 8px;
  width: 30px;
  height: 31px;
  background: #f2fbff;
  clip-path: polygon(47% 0, 100% 100%, 76% 100%, 47% 43%, 20% 100%, 0 100%);
}
.wordmark i::after, .mega-logo i::after {
  content: "";
  position: absolute;
  left: 20px;
  top: 19px;
  width: 14px;
  height: 12px;
  border-right: 4px solid var(--bg);
  border-bottom: 4px solid var(--bg);
  transform: skewX(-18deg);
}
.wordmark strong, .mega-logo strong {
  color: #f2fbff;
  font: 900 28px/1 Consolas, monospace;
  letter-spacing: 0;
}
.wordmark strong span, .mega-logo strong span, h1 span { color: var(--teal); }
.nav-menu {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 28px;
  min-width: 0;
}
.nav-primary {
  display: inline-flex;
  align-items: center;
  gap: 28px;
}
.nav-link {
  color: #d1e0e6;
  text-decoration: none;
  font-weight: 800;
  font-size: 15px;
  background: transparent;
  border: 0;
  padding: 10px 0;
  white-space: nowrap;
}
.nav-link:hover, .nav-link.active { color: var(--teal); }
.login-link {
  padding: 11px 26px;
  border: 1px solid rgba(255, 255, 255, .14);
  border-radius: 999px;
  background: rgba(255, 255, 255, .08);
}
.nav-pill {
  min-height: 44px;
  padding: 0 28px;
  color: #07131b;
  background: #f3f7fb;
  border: 0;
  border-radius: 999px;
  font-weight: 900;
  white-space: nowrap;
}
.account-pill {
  color: #031616;
  background: var(--teal);
  box-shadow: 0 0 28px rgba(77, 224, 208, .18);
}
.language-picker {
  position: relative;
  display: inline-flex;
}
.language-toggle {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: #d1e0e6;
  background: transparent;
  border: 0;
  border-radius: 0;
}
.language-toggle:hover,
.language-picker.open .language-toggle { color: var(--teal); }
.language-toggle b { color: currentColor; font-weight: 500; opacity: .72; }
.language-menu {
  position: absolute;
  top: calc(100% + 12px);
  right: 0;
  z-index: 90;
  min-width: 168px;
  padding: 12px;
  background: rgba(9, 13, 20, .94);
  border: 1px solid rgba(148,205,226,.12);
  border-radius: 18px;
  box-shadow: 0 24px 72px rgba(0,0,0,.42);
  backdrop-filter: blur(18px);
}
.language-menu button {
  display: block;
  width: 100%;
  min-height: 42px;
  padding: 0 14px;
  color: rgba(237,248,252,.86);
  background: transparent;
  border: 0;
  border-radius: 8px;
  text-align: left;
  font-weight: 900;
}
.language-menu button:hover,
.language-menu button.active {
  color: #fff;
  background: rgba(255,255,255,.12);
}

.auth-shell {
  min-height: 100vh;
  position: relative;
  z-index: 3;
  overflow: hidden;
  padding: 84px min(12vw, 190px) 0;
  background: linear-gradient(180deg, rgba(4,6,13,.08) 0%, rgba(4,6,13,.18) 48%, rgba(4,6,13,.34) 100%);
}
.auth-shell::before, .app-shell::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  display: none;
}
.auth-shell::after {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 0;
  display: none;
}
.hero {
  position: relative;
  z-index: 1;
  min-height: calc(100vh - 164px);
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(380px, 430px);
  gap: 58px;
  align-items: center;
}
.landing-hero {
  grid-template-columns: 1fr;
  justify-items: center;
  align-content: center;
  min-height: calc(100vh - 84px);
  padding: 18px 0 56px;
  text-align: center;
  isolation: isolate;
}
.landing-hero::after {
  content: "";
  position: absolute;
  inset: -90px -7vw -80px;
  z-index: 0;
  pointer-events: none;
  display: none;
}
.hero-core-canvas {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 1;
  width: 100vw;
  height: 100vh;
  pointer-events: none;
  opacity: 1;
}
.hero-depth {
  display: none;
}
.depth-ring {
  position: absolute;
  inset: 12%;
  border: 1px solid rgba(77,224,208,.18);
  border-radius: 50%;
  animation: ringSpin 16s linear infinite;
}
.ring-b {
  inset: 20% 4%;
  border-color: rgba(155,107,255,.2);
  transform: rotateX(62deg) rotateZ(18deg);
  animation-duration: 22s;
  animation-direction: reverse;
}
.ring-c {
  inset: 3% 27%;
  border-color: rgba(24,168,232,.16);
  transform: rotateY(62deg) rotateZ(-18deg);
  animation-duration: 19s;
}
.depth-core {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 160px;
  height: 160px;
  border-radius: 50%;
  transform: translate(-50%, -50%);
  background:
    radial-gradient(circle at 36% 28%, rgba(255,255,255,.95) 0 5%, rgba(77,224,208,.88) 18%, rgba(24,168,232,.35) 42%, transparent 70%),
    radial-gradient(circle, rgba(155,107,255,.3), transparent 65%);
  box-shadow: 0 0 82px rgba(77,224,208,.4), 0 0 148px rgba(155,107,255,.24);
  animation: corePulse 3.4s ease-in-out infinite;
}
@keyframes ringSpin {
  to { rotate: 360deg; }
}
@keyframes corePulse {
  0%, 100% { transform: translate(-50%, -50%) scale(.94); opacity: .78; }
  50% { transform: translate(-50%, -50%) scale(1.05); opacity: 1; }
}
.landing-hero .hero-copy {
  position: relative;
  z-index: 2;
  max-width: 840px;
}
.landing-hero .mega-logo {
  justify-content: center;
}
.landing-hero .hero-actions {
  justify-content: center;
}
.landing-hero .intro-copy {
  max-width: 760px;
}
.landing-hero h1 {
  text-shadow: 0 0 50px rgba(77,224,208,.18), 0 0 92px rgba(155,107,255,.14);
}
.landing-hero h1 span {
  color: transparent;
  background: linear-gradient(110deg, var(--teal), #22e0ff 42%, var(--violet));
  -webkit-background-clip: text;
  background-clip: text;
  text-shadow: none;
}
.live-badge {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  margin: 0 auto 28px;
  padding: 8px 18px;
  color: rgba(218,236,244,.78);
  background: rgba(7,20,30,.58);
  border: 1px solid rgba(148,205,226,.2);
  border-radius: 999px;
  box-shadow: 0 0 34px rgba(77,224,208,.08);
}
.live-badge span {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--teal);
  box-shadow: 0 0 15px rgba(77,224,208,.9);
  animation: liveBlink 1.6s steps(1) infinite;
}
.live-badge em {
  font: 900 12px/1.2 Consolas, monospace;
  font-style: normal;
}
@keyframes liveBlink {
  50% { opacity: .25; }
}
.hero-hud {
  position: fixed;
  z-index: 1;
  pointer-events: none;
  color: rgba(126, 167, 207, .42);
  font: 900 11px/1 Consolas, monospace;
  letter-spacing: 0;
  text-shadow: 0 0 18px rgba(77,224,208,.18);
}
.hud-a { left: 11vw; top: 34vh; }
.hud-b { right: 9vw; top: 51vh; }
.hud-c { left: 17vw; bottom: 18vh; }
.scroll-ind {
  margin-top: 50px;
  color: rgba(159,183,193,.74);
  font: 900 11px/1 Consolas, monospace;
  letter-spacing: 0;
  animation: softBob 2.2s ease-in-out infinite;
}
@keyframes softBob {
  0%, 100% { transform: translateY(0); opacity: .55; }
  50% { transform: translateY(8px); opacity: 1; }
}
.agent-orbit {
  display: none;
}
.orbit-ring {
  position: absolute;
  inset: 8%;
  border: 1px solid rgba(77,224,208,.2);
  border-radius: 50%;
  transform: rotate(-10deg);
  box-shadow: 0 0 70px rgba(24,168,232,.16);
}
.ring-two {
  inset: 18% 4%;
  border-color: rgba(24,168,232,.18);
  transform: rotate(12deg);
}
.orbit-core {
  position: absolute;
  left: 50%;
  top: 50%;
  display: grid;
  place-items: center;
  width: 112px;
  height: 112px;
  color: #06131b;
  background: radial-gradient(circle at 35% 25%, #ffffff, var(--teal) 58%, #158a9d 100%);
  border: 1px solid rgba(237,248,252,.66);
  border-radius: 50%;
  transform: translate(-50%, -50%);
  box-shadow: 0 0 70px rgba(77,224,208,.44);
}
.orbit-core span {
  font: 900 34px/1 Consolas, monospace;
}
.orbit-node {
  position: absolute;
  min-width: 76px;
  padding: 9px 12px;
  color: var(--text);
  background: rgba(3,13,23,.78);
  border: 1px solid rgba(77,224,208,.34);
  border-radius: 999px;
  font: 900 11px/1 Consolas, monospace;
  box-shadow: 0 0 28px rgba(77,224,208,.12);
}
.node-a { left: 13%; top: 32%; }
.node-b { right: 12%; top: 28%; }
.node-c { left: 25%; bottom: 16%; }
.node-d { right: 27%; bottom: 18%; }
.hero-copy {
  text-align: center;
  justify-self: center;
  max-width: 980px;
}
.mega-logo {
  margin-bottom: 24px;
  gap: 18px;
}
.mega-logo i { width: 58px; height: 58px; border-radius: 10px; }
.mega-logo i::before { left: 11px; top: 10px; width: 36px; height: 38px; }
.mega-logo i::after { left: 24px; top: 24px; width: 17px; height: 15px; border-right-width: 5px; border-bottom-width: 5px; }
.mega-logo strong { font-size: clamp(30px, 4.2vw, 58px); }
.compact-logo { margin-bottom: 22px; }
.compact-logo strong { font-size: clamp(28px, 4vw, 56px); }
h1 {
  max-width: 880px;
  margin: 0 auto;
  font-size: clamp(42px, 5.4vw, 78px);
  line-height: 1.03;
  text-wrap: balance;
}
.intro-copy {
  max-width: 690px;
  margin: 22px auto 0;
  color: rgba(211,226,232,.82);
  font-size: 16px;
  line-height: 1.78;
}
.hero-actions {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 14px;
  margin-top: 34px;
}
.auth-panel, .panel, .panel-form, .metric, .agent-card, .risk-banner, .risk-strip, .preview-band, .quant-band {
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: 8px;
  box-shadow: 0 16px 48px rgba(0,0,0,.2);
}
.auth-panel {
  position: relative;
  z-index: 1;
  padding: 26px;
  backdrop-filter: blur(18px);
  box-shadow: var(--shadow);
}
.auth-tabs {
  display: grid;
  grid-template-columns: 1fr 1fr;
  padding: 4px;
  margin-bottom: 24px;
  background: rgba(3, 12, 18, .9);
  border: 1px solid var(--line);
  border-radius: 8px;
}
.auth-tab {
  padding: 12px;
  color: var(--muted);
  background: transparent;
  border: 0;
  border-radius: 6px;
  font-weight: 800;
}
.auth-tab.active {
  color: var(--text);
  background: rgba(77,224,208,.18);
}
.auth-form, .panel-form { display: grid; gap: 16px; }
label {
  display: grid;
  gap: 8px;
  color: var(--muted);
  font-size: 12px;
}
input, textarea, select {
  width: 100%;
  color: var(--text);
  background: rgba(3, 13, 18, .78);
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 13px 14px;
  outline: none;
  resize: vertical;
}
textarea[spellcheck="false"] {
  font-family: Consolas, monospace;
  font-size: 12px;
  line-height: 1.55;
}
input:focus, textarea:focus, select:focus {
  border-color: var(--teal);
  box-shadow: 0 0 0 3px rgba(77,224,208,.12);
}
.password-field {
  position: relative;
  display: block;
}
.password-field input {
  padding-right: 50px;
}
.password-toggle {
  position: absolute;
  top: 50%;
  right: 8px;
  width: 36px;
  height: 36px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: rgba(159, 183, 193, .82);
  background: transparent;
  border: 0;
  border-radius: 8px;
  transform: translateY(-50%);
}
.password-toggle:hover,
.password-toggle.visible {
  color: var(--teal);
  background: rgba(77, 224, 208, .08);
}
.eye-icon {
  position: relative;
  width: 19px;
  height: 13px;
  border: 2px solid currentColor;
  border-radius: 50%;
  transform: rotate(-8deg);
}
.eye-icon::before {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  width: 5px;
  height: 5px;
  background: currentColor;
  border-radius: 50%;
  transform: translate(-50%, -50%);
}
.password-toggle::after {
  content: "";
  position: absolute;
  width: 23px;
  height: 2px;
  background: currentColor;
  border-radius: 999px;
  transform: rotate(-42deg);
  opacity: .92;
}
.password-toggle.visible::after {
  opacity: 0;
}
.primary-button, .ghost-button, .text-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  border-radius: 8px;
  text-decoration: none;
  font-weight: 900;
}
.primary-button {
  min-height: 46px;
  padding: 0 22px;
  color: #02101a;
  background: linear-gradient(110deg, #22e0ff, #4de0d0 46%, #8d72ff);
  border: 0;
  box-shadow: 0 0 28px rgba(77,224,208,.2);
}
.ghost-button {
  min-height: 46px;
  padding: 0 22px;
  color: var(--text);
  border: 1px solid var(--line);
  background: rgba(5,15,26,.28);
  backdrop-filter: blur(10px);
}
.text-button {
  color: var(--teal);
  background: transparent;
  border: 0;
}
.auth-helper {
  justify-self: center;
  min-height: 32px;
  padding: 0 8px;
}
.panel-disclaimer {
  margin: 18px 0 0;
  padding-top: 15px;
  border-top: 1px solid var(--line);
  color: var(--muted);
  font-size: 11px;
  line-height: 1.65;
}
.access-band {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(380px, 460px);
  gap: 36px;
  align-items: center;
  margin-top: 18px;
  padding: 42px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background:
    radial-gradient(circle at 18% 20%, rgba(77,224,208,.16), transparent 34%),
    rgba(5,12,22,.38);
  backdrop-filter: blur(12px);
}
.access-copy {
  max-width: 660px;
}
.access-copy h2 {
  margin-bottom: 18px;
}
.home-workspace {
  padding-top: 64px;
}
.home-hero-panel {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(360px, .72fr);
  gap: 34px;
  align-items: center;
  min-height: 640px;
  padding: 52px;
  overflow: hidden;
  border-bottom: 1px solid var(--line);
  background:
    linear-gradient(90deg, rgba(5, 17, 32, .48), rgba(4, 24, 35, .28)),
    repeating-linear-gradient(90deg, rgba(148,205,226,.08) 0 1px, transparent 1px 92px),
    repeating-linear-gradient(0deg, rgba(148,205,226,.06) 0 1px, transparent 1px 68px);
}
.home-hero-panel::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    linear-gradient(120deg, transparent 0 48%, rgba(77,224,208,.1) 48% 49%, transparent 49%),
    radial-gradient(ellipse 58% 42% at 58% 28%, rgba(24,168,232,.26), transparent 60%);
}
.home-hero-copy, .home-console {
  position: relative;
  z-index: 1;
}
.home-hero-copy {
  max-width: 880px;
}
.home-hero-copy .hero-actions {
  justify-content: flex-start;
}
.home-hero-copy .intro-copy {
  margin-left: 0;
  margin-right: 0;
}
.home-console {
  min-width: 0;
  padding: 22px;
  border: 1px solid rgba(148,205,226,.24);
  border-radius: 8px;
  background: rgba(3, 13, 23, .5);
  box-shadow: var(--shadow);
}
.console-top {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  color: var(--muted);
  font: 900 11px/1 Consolas, monospace;
}
.console-top b {
  color: var(--green);
}
.console-grid {
  display: grid;
  grid-template-columns: 110px minmax(0, 1fr);
  gap: 10px 14px;
  margin: 24px 0 18px;
}
.console-grid span {
  color: rgba(159,183,193,.82);
  font: 900 11px/1.2 Consolas, monospace;
}
.console-grid strong {
  color: var(--text);
  font-size: 15px;
}
.home-console svg {
  display: block;
  width: 100%;
}
.pulse-dot {
  fill: var(--teal);
  opacity: .96;
  filter: drop-shadow(0 0 12px rgba(77,224,208,.72));
  animation: pulse 1.8s ease-in-out infinite;
}
.pulse-dot.delay { animation-delay: .7s; }
@keyframes pulse {
  0%, 100% { transform: scale(1); opacity: .72; }
  50% { transform: scale(1.6); opacity: 1; }
}
.home-stats {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: clamp(28px, 5vw, 82px);
  margin: 28px 0 34px;
  overflow: visible;
  border: 0;
  border-radius: 0;
  background: transparent;
}
.home-stats article {
  min-height: auto;
  padding: 6px 0 14px;
  background: transparent;
}
.home-stats strong {
  display: block;
  color: var(--text);
  font: 900 26px/1.1 Consolas, monospace;
}
.home-stats span {
  display: block;
  margin-top: 12px;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.55;
}
.public-stats {
  width: min(1080px, 100%);
  margin: -28px auto 44px;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 28px;
  overflow: visible;
  border: 0;
  border-radius: 0;
  background: transparent;
}
.public-stats article {
  min-height: auto;
  padding: 0 0 18px;
  background: transparent;
  border-bottom: 1px solid rgba(148,205,226,.14);
}
.public-stats strong {
  color: var(--teal);
  font: 900 15px/1.2 Arial, "Microsoft YaHei", sans-serif;
}
.public-stats span {
  color: rgba(159,183,193,.72);
  font-size: 12px;
}
.home-feature-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(28px, 4.5vw, 74px);
  margin: 16px 0 24px;
}
.home-feature-grid article {
  min-height: auto;
  padding: 12px 0 20px;
  border: 0;
  border-radius: 0;
  background: transparent;
}
.home-feature-grid span {
  color: var(--yellow);
  font: 900 12px/1 Consolas, monospace;
}
.home-feature-grid h3 {
  margin: 34px 0 12px;
}
.home-feature-grid p {
  margin: 0;
  color: var(--muted);
  line-height: 1.75;
  font-size: 14px;
}
.home-section {
  margin: clamp(58px, 7vw, 96px) 0 0;
  padding-top: clamp(34px, 5vw, 58px);
  border-top: 1px solid rgba(148,205,226,.13);
}
.home-section-head {
  max-width: 920px;
  margin-bottom: clamp(26px, 4vw, 42px);
}
.home-section-head h2 {
  margin: 10px 0 14px;
  font-size: clamp(30px, 4.2vw, 58px);
  line-height: 1.05;
}
.home-section-head p:not(.eyebrow) {
  margin: 0;
  color: var(--muted);
  font-size: 15px;
  line-height: 1.8;
}
.home-value-grid,
.home-capability-grid,
.flow-steps {
  display: grid;
  gap: 14px;
}
.home-value-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
.home-capability-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.flow-steps {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
.home-value-grid article,
.home-capability-grid article,
.flow-steps article {
  min-width: 0;
  min-height: auto;
  padding: 12px 0 20px;
  border: 0;
  border-radius: 0;
  background: transparent;
}
.home-value-grid span,
.flow-steps b {
  color: var(--yellow);
  font: 900 12px/1 Consolas, monospace;
}
.home-value-grid h3,
.home-capability-grid strong,
.flow-steps strong {
  display: block;
  margin: 26px 0 10px;
  color: var(--text);
  font-size: 18px;
  line-height: 1.25;
}
.home-capability-grid strong {
  margin-top: 0;
  color: var(--teal);
}
.flow-steps strong {
  margin-top: 24px;
}
.home-value-grid p,
.home-capability-grid p,
.flow-steps p {
  margin: 0;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.75;
}
.home-cta-band {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 28px;
  margin: clamp(58px, 7vw, 96px) 0 18px;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
}
.home-cta-band div {
  max-width: 760px;
}
.home-cta-band h2 {
  margin: 8px 0 12px;
  font-size: clamp(28px, 3.5vw, 48px);
  line-height: 1.1;
}
.home-cta-band p:not(.eyebrow) {
  margin: 0;
  color: var(--muted);
  line-height: 1.75;
}
.home-cta-band .primary-button {
  flex: 0 0 auto;
}
.preview-band, .quant-band, .risk-strip {
  position: relative;
  z-index: 2;
  scroll-margin-top: 112px;
}
.preview-band {
  display: grid;
  grid-template-columns: minmax(260px,.7fr) minmax(0,1fr);
  gap: 28px;
  align-items: center;
  margin-top: 18px;
  padding: 28px;
  background:
    radial-gradient(circle at 72% 20%, rgba(77,224,208,.1), transparent 36%),
    rgba(5,12,22,.34);
  backdrop-filter: blur(10px);
}
.preview-copy p:not(.eyebrow), .quant-grid p { color: var(--muted); line-height: 1.8; }
.preview-terminal {
  min-width: 0;
  padding: 18px;
  background: rgba(3, 13, 23, .42);
  border: 1px solid var(--line-soft);
  border-radius: 8px;
}
.terminal-head {
  display: flex;
  justify-content: space-between;
  color: var(--muted);
  font: 800 11px/1 Consolas, monospace;
}
.preview-terminal svg { width: 100%; margin-top: 14px; }
.grid-line { stroke: rgba(148,205,226,.13); stroke-width: 1; }
.area, .chart-area { fill: rgba(77,224,208,.13); }
.line, .chart-line { fill: none; stroke: var(--teal); stroke-width: 4; stroke-linecap: round; }
.public-section {
  position: relative;
  z-index: 2;
  margin-top: clamp(48px, 6vw, 82px);
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  backdrop-filter: none;
}
.public-section-head {
  max-width: 900px;
  margin-bottom: 24px;
}
.public-section-head h2 {
  margin: 8px 0 12px;
  font-size: clamp(30px, 4vw, 54px);
}
.public-section-head p:not(.eyebrow) {
  margin: 0;
  color: var(--muted);
  line-height: 1.8;
}
.public-value-grid,
.public-capability-grid {
  display: grid;
  gap: 14px;
}
.public-value-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
.public-capability-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.public-value-grid article,
.public-capability-grid article {
  min-width: 0;
  min-height: auto;
  padding: 12px 0 20px;
  border: 0;
  border-radius: 0;
  background: transparent;
}
.public-value-grid span {
  color: var(--yellow);
  font: 900 12px/1 Consolas, monospace;
}
.public-value-grid h3,
.public-capability-grid strong {
  display: block;
  margin: 22px 0 10px;
  color: var(--text);
  font-size: 18px;
  line-height: 1.25;
}
.public-capability-grid strong {
  margin-top: 0;
  color: var(--teal);
}
.public-value-grid p,
.public-capability-grid p {
  margin: 0;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.75;
}
.public-proof-band {
  position: relative;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 28px;
  margin-top: clamp(48px, 6vw, 82px);
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  backdrop-filter: none;
}
.public-proof-band div {
  max-width: 780px;
}
.public-proof-band h2 {
  margin: 8px 0 12px;
  font-size: clamp(28px, 3.6vw, 48px);
}
.public-proof-band p:not(.eyebrow) {
  margin: 0;
  color: var(--muted);
  line-height: 1.75;
}
.public-proof-band .primary-button {
  flex: 0 0 auto;
}
.quant-band { margin-top: 18px; padding: 28px; }
.quant-band {
  background:
    radial-gradient(circle at 16% 20%, rgba(155,107,255,.09), transparent 34%),
    rgba(5,12,22,.32);
  backdrop-filter: blur(10px);
}
.section-heading, .toolbar, .panel-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 14px;
  margin-bottom: 18px;
}
.quant-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}
.quant-grid article {
  min-height: 190px;
  padding: 20px;
  background: rgba(3, 13, 23, .38);
  border: 1px solid var(--line-soft);
  border-radius: 8px;
}
.quant-grid span {
  color: var(--teal);
  font: 900 12px/1 Consolas, monospace;
}
.quant-grid h3 { margin: 28px 0 10px; }
.quant-card {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.quant-card h3 { margin-bottom: 0; }
.quant-description {
  white-space: pre-line;
  font-size: 12px;
}
.quant-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  margin-top: auto;
  color: var(--muted);
  font-size: 11px;
}
.quant-meta strong {
  color: var(--teal);
  font: 900 11px/1 Consolas, monospace;
}
.tag-row {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.tag-row span {
  padding: 6px 8px;
  border-radius: 999px;
  background: rgba(77,224,208,.08);
  color: rgba(237,248,252,.82);
  font: 800 10px/1 Consolas, monospace;
}
.quant-download { align-self: flex-start; }
.text-button.disabled {
  opacity: .48;
  pointer-events: none;
  cursor: not-allowed;
}
.market-toolbar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 16px;
  margin-bottom: 24px;
}
body[data-view="market"] .workspace {
  width: min(1920px, 100%);
  padding: 24px clamp(14px, 2.4vw, 42px) 64px;
}
body[data-view="market"] .workspace-hero {
  max-width: none;
  margin-bottom: 14px;
  padding: 0 0 10px;
  border: 0;
  background: transparent;
}
body[data-view="market"] .workspace-hero h2 {
  font-size: clamp(28px, 3.4vw, 54px);
}
body[data-view="market"] .market-toolbar {
  margin-bottom: 14px;
  padding: 10px 0 12px;
  border-top: 1px solid rgba(148,205,226,.18);
  border-bottom: 1px solid rgba(148,205,226,.18);
  background:
    linear-gradient(90deg, rgba(77,224,208,.06), transparent 36%, rgba(239,200,107,.04)),
    rgba(2, 8, 15, .18);
}
.market-switch {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}
.market-chip {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 36px;
  padding: 0 14px;
  color: var(--muted);
  background: transparent;
  border: 1px solid rgba(148,205,226,.18);
  border-radius: 999px;
  font: 900 12px/1 Consolas, monospace;
}
.market-chip:hover,
.market-chip.active {
  color: var(--teal);
  border-color: rgba(77,224,208,.64);
}
.market-tools {
  margin-left: auto;
}
.market-tool {
  min-width: 42px;
  justify-content: center;
}
.market-board {
  position: relative;
  display: grid;
  gap: 0;
  border-top: 1px solid rgba(148,205,226,.16);
  border-bottom: 1px solid rgba(148,205,226,.16);
  background:
    linear-gradient(180deg, rgba(3, 12, 21, .34), rgba(2, 8, 15, .18)),
    repeating-linear-gradient(90deg, rgba(148,205,226,.025) 0 1px, transparent 1px 92px);
}
.market-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 24px;
  padding: 20px 0 14px;
}
.market-head h3 {
  margin-top: 8px;
  font-size: clamp(34px, 4.6vw, 72px);
}
.market-price {
  text-align: right;
}
.market-price strong {
  display: block;
  color: var(--text);
  font: 900 clamp(28px, 4vw, 58px)/1 Consolas, monospace;
}
.market-price span {
  display: block;
  margin-top: 8px;
  font: 900 14px/1 Consolas, monospace;
}
.market-stats {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: clamp(20px, 4vw, 64px);
  padding: 14px 0 18px;
  border-top: 1px solid rgba(148,205,226,.12);
  border-bottom: 1px solid rgba(148,205,226,.12);
}
.market-stats span,
.market-stats b,
.market-stats small {
  display: block;
}
.market-stats b {
  color: var(--teal);
  font: 900 20px/1.1 Consolas, monospace;
}
.market-stats small {
  margin-top: 8px;
  color: var(--muted);
  font-size: 12px;
}
.market-chart {
  min-height: 560px;
  overflow: hidden;
  background:
    linear-gradient(180deg, rgba(2, 7, 13, .32), rgba(2, 7, 13, .1)),
    repeating-linear-gradient(90deg, rgba(148,205,226,.028) 0 1px, transparent 1px 64px),
    repeating-linear-gradient(0deg, rgba(148,205,226,.022) 0 1px, transparent 1px 52px);
}
.market-chart-wrap {
  position: relative;
  min-height: 560px;
  user-select: none;
}
.market-chart-svg {
  display: block;
  width: 100%;
  min-width: 960px;
  min-height: 560px;
  touch-action: none;
}
.market-kline-info {
  position: absolute;
  top: 12px;
  left: 10px;
  right: 90px;
  z-index: 5;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px 15px;
  min-height: 30px;
  color: rgba(159,183,193,.95);
  font: 900 12px/1.35 Consolas, monospace;
  pointer-events: none;
}
.market-kline-info strong {
  color: rgba(237,248,252,.92);
  font: inherit;
}
.market-kline-info span {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.market-kline-info b {
  color: rgba(159,183,193,.86);
  font-weight: 900;
}
.market-kline-info em {
  color: var(--teal);
  font-style: normal;
}
.market-kline-info em.positive { color: var(--green); }
.market-kline-info em.negative { color: var(--red); }
.market-candle line {
  stroke-width: 1.4;
}
.market-candle rect {
  stroke-width: 1;
  rx: 1;
}
.market-candle.up line,
.market-candle.up rect {
  stroke: var(--green);
}
.market-candle.up rect {
  fill: rgba(69,223,163,.72);
}
.market-candle.down line,
.market-candle.down rect {
  stroke: var(--red);
}
.market-candle.down rect {
  fill: rgba(239,110,124,.72);
}
.market-hover-layer {
  fill: transparent;
  cursor: crosshair;
  pointer-events: all;
}
.market-dragging .market-hover-layer,
.market-dragging .market-chart-wrap {
  cursor: grabbing;
}
.market-tooltip {
  position: absolute;
  z-index: 8;
  min-width: 236px;
  padding: 12px 14px;
  color: var(--text);
  background: rgba(4, 10, 18, .9);
  border: 1px solid rgba(77,224,208,.28);
  border-radius: 10px;
  box-shadow: 0 18px 48px rgba(0,0,0,.34);
  backdrop-filter: blur(14px);
  opacity: 0;
  pointer-events: none;
  transform: translate(-50%, -112%);
}
.market-tooltip.show { opacity: 1; }
.market-tooltip strong {
  display: block;
  margin-bottom: 10px;
  color: var(--teal);
  font: 900 13px/1.3 Consolas, monospace;
}
.market-tooltip span {
  display: flex;
  justify-content: space-between;
  gap: 18px;
  margin-top: 7px;
  color: var(--muted);
  font-size: 12px;
}
.market-tooltip b {
  font-weight: 800;
}
.market-tooltip em {
  color: var(--text);
  font: 900 12px/1 Consolas, monospace;
  font-style: normal;
}
.market-tooltip em.positive { color: var(--green); }
.market-tooltip em.negative { color: var(--red); }
.risk-strip {
  margin-top: 18px;
  padding: 18px 20px;
  border-color: rgba(239,200,107,.32);
}
.risk-strip strong { display: block; margin-bottom: 8px; color: var(--yellow); }
.risk-strip p { margin: 0 0 10px; color: var(--muted); line-height: 1.7; }
.risk-strip p:last-of-type { margin-bottom: 0; }
.risk-strip small {
  display: block;
  margin-top: 14px;
  color: rgba(237, 248, 252, .72);
  font-size: 12px;
}
.site-footer {
  position: relative;
  z-index: 3;
  width: 100%;
  margin: 72px 0 0;
  padding: 72px 7vw 38px;
  color: rgba(237, 248, 252, .78);
  background:
    linear-gradient(180deg, rgba(3, 8, 18, 0), rgba(3, 9, 19, .86) 18%, rgba(2, 7, 17, .98) 100%),
    repeating-linear-gradient(90deg, rgba(148,205,226,.055) 0 1px, transparent 1px 92px),
    repeating-linear-gradient(0deg, rgba(148,205,226,.045) 0 1px, transparent 1px 66px);
  border-top: 1px solid rgba(148, 205, 226, .12);
  scroll-margin-top: 112px;
}
.site-footer::before {
  content: "";
  position: absolute;
  left: 7vw;
  right: 7vw;
  top: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(77,224,208,.44), transparent);
}
.footer-columns {
  display: grid;
  grid-template-columns: repeat(3, minmax(180px, 1fr));
  gap: clamp(70px, 8vw, 150px);
  max-width: 1160px;
  margin: 0 auto 54px;
}
.footer-columns div {
  display: grid;
  gap: 18px;
  align-content: start;
}
.footer-columns div:nth-child(2) {
  justify-self: center;
}
.footer-columns div:nth-child(3) {
  justify-self: end;
}
.footer-columns strong {
  color: #eef8fc;
  font-size: 15px;
}
.footer-columns span, .footer-columns button {
  width: fit-content;
  padding: 0;
  border: 0;
  background: transparent;
  color: rgba(157, 181, 190, .86);
  text-align: left;
  font-size: 14px;
  font: inherit;
  cursor: pointer;
  transition: color .18s, transform .18s;
}
.footer-columns button:hover {
  color: var(--teal);
  transform: translateX(3px);
}
.footer-disclaimer {
  max-width: 1160px;
  margin: 0 auto;
  padding-top: 24px;
  border-top: 1px solid rgba(148, 205, 226, .1);
}
.footer-disclaimer p {
  margin: 0 0 4px;
  color: rgba(237, 248, 252, .82);
  line-height: 1.68;
  font-size: 13px;
  text-align: left;
}
.footer-disclaimer small {
  display: block;
  margin-top: 14px;
  color: rgba(237, 248, 252, .78);
  font-size: 13px;
  text-align: center;
}

.app-shell {
  --app-view-bg:
    radial-gradient(circle at 50% 0%, rgba(24, 168, 232, .16), transparent 34%),
    linear-gradient(180deg, rgba(3,7,17,.34) 0%, rgba(2,4,10,.44) 48%, rgba(2,4,10,.58) 100%);
  --app-view-overlay: none;
  min-height: 100vh;
  position: relative;
  z-index: 3;
  padding-top: 92px;
  background: var(--app-view-bg);
}
.app-shell::after {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background: var(--app-view-overlay);
  opacity: .82;
}
body[data-view="strategies"] .app-shell {
  --app-view-bg:
    linear-gradient(135deg, rgba(4, 32, 36, .66), rgba(4, 7, 16, .72) 42%, rgba(24, 15, 42, .52)),
    #04060d;
  --app-view-overlay:
    repeating-linear-gradient(118deg, rgba(77,224,208,.052) 0 1px, transparent 1px 118px),
    repeating-linear-gradient(0deg, rgba(239,200,107,.03) 0 1px, transparent 1px 132px);
}
body[data-view="detail"] .app-shell {
  --app-view-bg:
    linear-gradient(145deg, rgba(22, 16, 48, .62), rgba(4, 8, 18, .7) 48%, rgba(3, 31, 35, .54)),
    #04060d;
  --app-view-overlay:
    repeating-linear-gradient(90deg, rgba(148,205,226,.04) 0 1px, transparent 1px 104px),
    linear-gradient(180deg, rgba(77,224,208,.055), transparent 34%, rgba(239,200,107,.04));
}
body[data-view="quant"] .app-shell {
  --app-view-bg:
    linear-gradient(120deg, rgba(5, 29, 31, .62), rgba(4, 8, 15, .75) 44%, rgba(44, 36, 12, .36)),
    #04060d;
  --app-view-overlay:
    repeating-linear-gradient(45deg, rgba(77,224,208,.04) 0 1px, transparent 1px 96px),
    repeating-linear-gradient(135deg, rgba(239,200,107,.035) 0 1px, transparent 1px 142px);
}
body[data-view="feedback"] .app-shell {
  --app-view-bg:
    linear-gradient(150deg, rgba(5, 24, 28, .6), rgba(4, 8, 18, .72) 46%, rgba(30, 20, 44, .42)),
    #04060d;
  --app-view-overlay:
    repeating-linear-gradient(90deg, rgba(77,224,208,.034) 0 1px, transparent 1px 128px),
    repeating-linear-gradient(0deg, rgba(148,205,226,.032) 0 1px, transparent 1px 92px);
}
body[data-view="profile"] .app-shell {
  --app-view-bg:
    linear-gradient(140deg, rgba(34, 32, 16, .42), rgba(4, 8, 16, .74) 45%, rgba(5, 32, 34, .52)),
    #04060d;
  --app-view-overlay:
    repeating-linear-gradient(120deg, rgba(239,200,107,.036) 0 1px, transparent 1px 110px),
    repeating-linear-gradient(0deg, rgba(77,224,208,.032) 0 1px, transparent 1px 150px);
}
body[data-view="admin"] .app-shell {
  --app-view-bg:
    linear-gradient(135deg, rgba(42, 14, 18, .48), rgba(4, 8, 16, .74) 48%, rgba(35, 28, 12, .38)),
    #04060d;
  --app-view-overlay:
    repeating-linear-gradient(90deg, rgba(239,110,124,.034) 0 1px, transparent 1px 112px),
    repeating-linear-gradient(0deg, rgba(239,200,107,.028) 0 1px, transparent 1px 86px);
}
body[data-view="market"] .app-shell {
  --app-view-bg:
    repeating-linear-gradient(90deg, rgba(148,205,226,.034) 0 1px, transparent 1px 74px),
    repeating-linear-gradient(0deg, rgba(148,205,226,.027) 0 1px, transparent 1px 58px),
    linear-gradient(180deg, rgba(3, 8, 14, .82), rgba(2, 6, 12, .94));
  --app-view-overlay:
    linear-gradient(90deg, rgba(77,224,208,.09), transparent 24%, rgba(239,200,107,.04) 54%, rgba(155,107,255,.065));
}
.app-main {
  position: relative;
  z-index: 1;
  width: min(1720px, 100%);
  margin: 0 auto;
}
.workspace { padding: 42px 7vw 62px; }
.workspace-hero {
  margin-bottom: 22px;
  padding: 34px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: radial-gradient(circle at 55% 20%, rgba(24,168,232,.2), transparent 38%), rgba(7,18,31,.46);
}
.workspace-hero.slim { max-width: 980px; }
.workspace-hero .muted { max-width: 880px; }
.toolbar select { width: auto; min-width: 140px; }
.search { position: relative; flex: 1; max-width: 560px; }
.search span {
  position: absolute;
  left: 13px;
  top: 10px;
  color: var(--muted);
  font-size: 21px;
}
.search input { padding-left: 42px; }
.strategy-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(330px, 1fr));
  column-gap: clamp(38px, 5vw, 86px);
  row-gap: 42px;
}
.agent-card {
  min-height: 268px;
  display: flex;
  flex-direction: column;
  padding: 20px;
  transition: border .2s, transform .2s;
}
.agent-card:hover {
  border-color: rgba(77,224,208,.72);
  transform: translateY(-2px);
}
.card-head {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  align-items: center;
}
.symbol {
  color: var(--teal);
  font: 900 12px/1 Consolas, monospace;
}
.badge {
  display: inline-flex;
  align-items: center;
  min-height: 26px;
  padding: 0 9px;
  border-radius: 999px;
  color: var(--yellow);
  background: rgba(239,200,107,.12);
  font: 900 10px/1 Consolas, monospace;
}
.badge.active { color: var(--teal); background: rgba(77,224,208,.12); }
.badge.paused { color: var(--red); background: rgba(239,110,124,.12); }
.agent-card h3 { margin: 25px 0 10px; font-size: 20px; }
.agent-card p {
  margin: 0;
  color: var(--muted);
  line-height: 1.65;
  font-size: 13px;
}
.mini-metrics {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 8px;
  margin-top: auto;
  padding: 18px 0;
}
.mini-metrics span {
  padding: 10px;
  border: 1px solid var(--line-soft);
  border-radius: 8px;
}
.mini-metrics b, .mini-metrics small { display: block; }
.mini-metrics b { color: var(--text); font: 900 17px/1 Consolas, monospace; }
.mini-metrics small { margin-top: 6px; color: var(--muted); font-size: 10px; }
.empty {
  grid-column: 1 / -1;
  padding: 52px 20px;
  text-align: center;
  background: rgba(9,24,32,.64);
  border: 1px dashed var(--line);
  border-radius: 8px;
}
.compact-empty { padding: 44px 20px; }
.empty p { color: var(--muted); }
.detail-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 20px;
  align-items: flex-start;
  padding: 34px;
  margin-bottom: 16px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: radial-gradient(circle at 55% 20%, rgba(24,168,232,.28), transparent 38%), rgba(7,18,31,.86);
}
.detail-hero h2 {
  margin: 8px 0 10px;
  font-size: clamp(38px, 5vw, 76px);
}
.shortline-detail .detail-hero {
  display: block;
  background: rgba(7,18,31,.86);
}
.shortline-detail .detail-hero h2 {
  font-size: clamp(30px, 4vw, 54px);
}
.metric-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}
.detail-metrics {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin-bottom: 16px;
}
.metric { padding: 20px; }
.metric span, .metric small {
  display: block;
  color: var(--muted);
  font: 900 10px/1.4 Consolas, monospace;
}
.metric strong {
  display: block;
  margin: 12px 0 8px;
  color: var(--teal);
  font: 900 31px/1 Consolas, monospace;
}
.detail-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(280px, .65fr);
  gap: 16px;
  margin-bottom: 16px;
}
.panel, .panel-form { padding: 20px; }
.panel { margin-bottom: 16px; }
.panel-head { margin: 0 0 14px; }
.panel-head span { color: var(--muted); font-size: 12px; }
.equity-chart-wrap {
  position: relative;
  min-height: 360px;
}
.equity-chart {
  display: block;
  width: 100%;
  min-height: 360px;
  overflow: visible;
}
.chart-grid {
  fill: none;
  stroke: rgba(148,205,226,.14);
  stroke-width: 1;
}
.chart-grid.vertical { stroke: rgba(148,205,226,.08); }
.axis-line {
  fill: none;
  stroke: rgba(148,205,226,.28);
  stroke-width: 1;
}
.axis-label {
  fill: rgba(159,183,193,.9);
  font: 800 11px/1 Consolas, monospace;
}
.x-axis-label { text-anchor: middle; }
.y-axis-label { text-anchor: start; }
.chart-hover-layer {
  fill: transparent;
  cursor: crosshair;
  pointer-events: all;
}
.chart-crosshair {
  opacity: 0;
  pointer-events: none;
  stroke: rgba(77,224,208,.55);
  stroke-width: 1;
  stroke-dasharray: 4 5;
}
.chart-hover-dot {
  opacity: 0;
  pointer-events: none;
  fill: var(--teal);
  stroke: #07151e;
  stroke-width: 3;
}
.chart-crosshair.show, .chart-hover-dot.show { opacity: 1; }
.chart-tooltip {
  position: absolute;
  z-index: 4;
  min-width: 156px;
  padding: 10px 12px;
  color: var(--text);
  background: rgba(3, 12, 20, .94);
  border: 1px solid rgba(77,224,208,.44);
  border-radius: 8px;
  box-shadow: 0 14px 34px rgba(0,0,0,.35);
  opacity: 0;
  pointer-events: none;
  transform: translate(-50%, -112%);
}
.chart-tooltip.show { opacity: 1; }
.chart-tooltip strong {
  display: block;
  color: var(--teal);
  font: 900 16px/1.2 Consolas, monospace;
}
.chart-tooltip span {
  display: block;
  margin-top: 6px;
  color: var(--muted);
  font-size: 12px;
}
.protected-panel p { color: var(--muted); line-height: 1.75; }
.trade-table { overflow-x: auto; }
table { width: 100%; border-collapse: collapse; min-width: 780px; }
th, td {
  padding: 13px 10px;
  text-align: left;
  border-bottom: 1px solid var(--line-soft);
  font-size: 12px;
}
th {
  color: var(--muted);
  font: 900 10px/1 Consolas, monospace;
}
.side {
  padding: 5px 8px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 900;
}
.side.long { color: var(--green); background: rgba(69,223,163,.12); }
.side.short { color: var(--red); background: rgba(239,110,124,.12); }
.positive { color: var(--green); }
.negative { color: var(--red); }
.profile-grid {
  display: grid;
  grid-template-columns: minmax(280px, 1.2fr) repeat(3, minmax(160px, 1fr));
  gap: 14px;
}
.profile-card {
  display: grid;
  grid-template-columns: 54px minmax(0, 1fr);
  align-items: center;
  gap: 14px;
}
.avatar {
  display: grid;
  place-items: center;
  width: 54px;
  height: 54px;
  color: var(--teal);
  background: rgba(77,224,208,.12);
  border: 1px solid var(--line);
  border-radius: 50%;
  font-weight: 900;
}
.profile-actions {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  margin-top: 18px;
}
.account-form {
  margin-top: 18px;
}
.risk-banner {
  display: grid;
  grid-template-columns: minmax(180px,.35fr) minmax(0,1fr);
  gap: 18px;
  margin-top: 14px;
  padding: 20px;
  border-color: rgba(239,200,107,.26);
}
.risk-banner p:not(.eyebrow) {
  margin: 0;
  color: var(--muted);
  line-height: 1.75;
  font-size: 13px;
}

/* Keep the site content integrated with the animated background instead of boxed panels. */
.auth-panel,
.access-band,
.home-hero-panel,
.home-console,
.preview-band,
.preview-terminal,
.quant-band,
.quant-grid article,
.panel,
.panel-form,
.metric,
.agent-card,
.risk-banner,
.risk-strip,
.detail-hero,
.empty,
.mini-metrics span,
.auth-tabs {
  background: transparent;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  backdrop-filter: none;
}
.home-hero-panel {
  padding-inline: 0;
  border-bottom: 0;
}
.home-hero-panel::before,
.preview-terminal::before {
  display: none;
}
.access-band,
.preview-band,
.quant-band {
  padding-inline: 0;
}
.agent-card,
.quant-grid article,
.metric,
.panel,
.panel-form,
.risk-banner,
.detail-hero {
  padding-left: 0;
  padding-right: 0;
}
.agent-card:hover {
  transform: none;
}
.empty {
  padding-inline: 0;
}
.auth-tabs {
  padding: 0;
}
.auth-tab.active {
  background: transparent;
  color: var(--teal);
}
.form-row {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
}
.performance-form { margin-top: 18px; }
.check-row {
  display: flex;
  align-items: center;
  gap: 10px;
}
.check-row input {
  width: 18px;
  height: 18px;
  accent-color: var(--teal);
}
.narrow { max-width: 760px; }
.toast {
  position: fixed;
  z-index: 80;
  right: 18px;
  bottom: 18px;
  max-width: 360px;
  padding: 12px 14px;
  color: var(--text);
  background: #102b34;
  border: 1px solid var(--teal);
  border-radius: 8px;
  opacity: 0;
  pointer-events: none;
  transform: translateY(8px);
  transition: .2s;
}
.toast.show { opacity: 1; transform: translateY(0); }

@media (max-width: 1120px) {
  .fixed-nav { padding-inline: 28px; }
  .hero { grid-template-columns: 1fr; min-height: auto; }
  .hero-copy { text-align: left; justify-self: stretch; }
  .hero-actions { justify-content: flex-start; }
  .landing-hero .hero-copy { text-align: center; justify-self: center; }
  .landing-hero .hero-actions { justify-content: center; }
  .access-band { grid-template-columns: 1fr; }
  .home-hero-panel { grid-template-columns: 1fr; }
  .preview-band, .detail-layout { grid-template-columns: 1fr; }
  .home-stats, .home-feature-grid, .home-value-grid, .home-capability-grid, .flow-steps, .public-value-grid, .public-capability-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .profile-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 820px) {
  .fixed-nav {
    height: 82px;
    gap: 14px;
    padding-inline: 18px;
  }
  .wordmark strong { font-size: 21px; }
  .wordmark i { width: 40px; height: 40px; border-radius: 7px; }
  .wordmark i::before { left: 8px; top: 7px; width: 25px; height: 26px; }
  .wordmark i::after { left: 17px; top: 17px; width: 12px; height: 10px; border-right-width: 3px; border-bottom-width: 3px; }
  .nav-menu {
    gap: 14px;
    overflow-x: auto;
    scrollbar-width: none;
  }
  .language-picker { flex: 0 0 auto; }
  .language-toggle {
    min-width: 46px;
    min-height: 42px;
    touch-action: manipulation;
  }
  .language-menu {
    position: fixed;
    top: 72px;
    right: 14px;
    z-index: 160;
    width: min(220px, calc(100vw - 28px));
    max-height: calc(100vh - 92px);
    overflow-y: auto;
  }
  .nav-primary { gap: 14px; }
  .nav-menu::-webkit-scrollbar { display: none; }
  .nav-link { font-size: 13px; }
  .login-link, .nav-pill { padding-inline: 16px; }
  .auth-shell { padding: 108px 18px 42px; }
  .app-shell { padding-top: 82px; }
  .workspace { padding: 28px 18px 42px; }
  .landing-hero { padding: 34px 0 52px; }
  .landing-hero h1,
  .home-hero-copy h1 { font-size: clamp(40px, 9.8vw, 50px); line-height: 1.02; }
  .landing-hero .mega-logo strong { font-size: 30px; }
  .agent-orbit { width: 108vw; opacity: .42; }
  .orbit-node { display: none; }
  .orbit-core { width: 84px; height: 84px; }
  .orbit-core span { font-size: 26px; }
  .access-band { padding: 24px; }
  .home-workspace { padding-top: 28px; }
  .home-hero-panel { min-height: auto; padding: 28px; }
  .workspace-hero { padding: 22px; }
  h1 { font-size: 52px; }
  .mega-logo strong { font-size: 32px; }
  .mega-logo i { width: 48px; height: 48px; border-radius: 8px; }
  .mega-logo i::before { left: 9px; top: 8px; width: 30px; height: 31px; }
  .mega-logo i::after { left: 20px; top: 19px; width: 14px; height: 12px; border-right-width: 4px; border-bottom-width: 4px; }
  .quant-grid, .metric-grid, .detail-metrics, .profile-grid, .risk-banner, .home-feature-grid, .home-value-grid, .home-capability-grid, .flow-steps, .public-value-grid, .public-capability-grid, .market-stats { grid-template-columns: 1fr; }
  .home-cta-band {
    align-items: stretch;
    flex-direction: column;
  }
  .home-cta-band .primary-button {
    width: 100%;
  }
  .public-proof-band {
    align-items: stretch;
    flex-direction: column;
  }
  .public-proof-band .primary-button {
    width: 100%;
  }
  .home-stats {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: clamp(8px, 2.6vw, 18px);
    overflow: visible;
    padding-bottom: 0;
    text-align: center;
  }
  .home-stats article {
    min-width: 0;
    padding-inline: 2px;
  }
  .market-head { display: grid; }
  .market-price { text-align: left; }
  body[data-view="market"] .workspace { padding-inline: 14px; }
  .market-tools { margin-left: 0; }
  .market-chart,
  .market-chart-wrap { min-height: 500px; }
  .market-chart-svg {
    min-width: 980px;
    min-height: 500px;
  }
  .market-kline-info {
    right: 10px;
    gap: 8px 12px;
    font-size: 11px;
  }
  .footer-columns {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: clamp(12px, 4vw, 30px);
    overflow: visible;
    padding-bottom: 0;
    margin-bottom: 36px;
    max-width: 100%;
  }
  .footer-columns div {
    min-width: 0;
    justify-items: center;
    text-align: center;
    gap: 14px;
  }
  .footer-columns div:nth-child(2),
  .footer-columns div:nth-child(3) { justify-self: stretch; }
  .footer-columns span, .footer-columns button {
    width: auto;
    text-align: center;
  }
  .form-row { grid-template-columns: 1fr; }
  .section-heading, .toolbar, .hero-actions {
    align-items: stretch;
    flex-direction: column;
  }
  .auth-panel { padding: 18px; }
  .strategy-grid { grid-template-columns: 1fr; }
}

@media (max-width: 560px) {
  .language-toggle { padding-inline: 12px; }
  .nav-menu { gap: 11px; }
  .nav-pill, .login-link { min-height: 38px; padding-inline: 13px; }
  .hero { gap: 30px; }
  .intro-copy { font-size: 16px; }
  h1 { font-size: 44px; }
  .landing-hero h1,
  .home-hero-copy h1 { font-size: clamp(34px, 10.6vw, 40px); line-height: 1.04; }
  .landing-hero .mega-logo { gap: 10px; }
  .landing-hero .mega-logo strong { font-size: 25px; }
  .landing-hero .mega-logo i { width: 42px; height: 42px; border-radius: 8px; }
  .landing-hero .mega-logo i::before { left: 8px; top: 7px; width: 26px; height: 28px; }
  .landing-hero .mega-logo i::after { left: 18px; top: 18px; width: 12px; height: 10px; border-right-width: 3px; border-bottom-width: 3px; }
  .landing-hero .intro-copy { font-size: 14px; line-height: 1.65; }
  .home-stats {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 8px;
  }
  .home-stats article { min-width: 0; }
  .home-stats strong { font-size: clamp(18px, 5.2vw, 22px); }
  .home-stats span { font-size: 10.5px; margin-top: 8px; }
  .footer-columns {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
  }
  .footer-columns div { min-width: 0; gap: 12px; }
  .footer-columns strong { font-size: 13px; }
  .footer-columns span, .footer-columns button { font-size: 12px; }
  .detail-hero { grid-template-columns: 1fr; padding: 22px; }
  .mini-metrics { grid-template-columns: 1fr; }
}
