/* Shared night palette. Load after styles.css; the home experience has its own layer. */
:root {
  --paper: #050a18;
  --ink: #eef4ff;
  --muted: #a8b8d2;
  --blue: #9dbbff;
  --deep: #c4d5ff;
  --cyan: #83deef;
  --line: #263b5a;
  --night-panel: #0c1830;
  --night-panel-high: #132849;
  --night-border: #385175;
  color-scheme: dark;
  background: var(--paper);
  color: var(--ink);
}

body {
  background:
    radial-gradient(ellipse at 88% 8%, #15336542, transparent 42%),
    radial-gradient(ellipse at 4% 92%, #15346522, transparent 44%),
    linear-gradient(160deg, #050a18, #0a142b);
  color: var(--ink);
}

::selection { background: #365993; color: #fff; }
:focus-visible { outline-color: #a4c4ff; }
.skip-link { background: #b8d0ff; color: #071328; box-shadow: 0 8px 30px #0005; }

/* Compact shared navigation. Its existing mobile/dialog behavior stays intact. */
.header { padding-top: 22px; }
.header-bar { min-height: 64px; gap: 24px; }
.brand { color: #f2f6ff; }
.brand-dot { color: #94b7ff; }
.brand img, .agent-core img { filter: brightness(1.7) saturate(.8); }
.nav-glass {
  padding: 5px;
  border-color: #5273a144;
  background: linear-gradient(125deg, #142544c9, #0b172ce6);
  box-shadow: inset 0 1px 0 #b7d1ff0a, 0 9px 30px #0002;
  backdrop-filter: blur(20px) saturate(125%);
}
.nav-glass a { padding: 11px 15px; font-size: 12px; color: #b7c7e0; }
.nav-glass a:hover { background: #24436d66; color: #f2f6ff; }
.nav-glass a[aria-current] {
  background: #243f6b;
  color: #e6eeff;
  box-shadow: inset 0 0 0 1px #7097d23b, 0 4px 18px #0002;
}
.header-cta, .menu-toggle {
  border-color: #496b9a;
  background: #10223a9c;
  color: #dce8ff;
}
.header-cta { padding: 13px 18px; }
.header-cta:hover { background: #1a345a; border-color: #9abaff; color: #fff; }
.menu-lines i { background: #dce8ff; }

.eyebrow, .overline { color: #a4b9d8; }
.blue-text {
  background-image: linear-gradient(110deg, #c8dcff 4%, #93baff 58%, #83deef);
}
.micro, .hero-art-caption { color: #a2b3ce; }
.text-link { color: #e5eeff; }
.text-link:hover { color: #abc8ff; }
.button {
  background: #2554ce;
  color: #fff;
  border-color: #7399ed;
  box-shadow: inset 0 1px 0 #d8e6ff20, 0 8px 28px #0929704d;
}
.button:hover { background: #2b5ed7; color: #fff; box-shadow: 0 12px 32px #17409655; }
.button.white {
  background: #142a4b;
  color: #e5eeff;
  border-color: #617fac;
  box-shadow: inset 0 1px 0 #d8e6ff0d;
}
.button.white:hover { background: #1c385f; color: #fff; border-color: #a4c4ff; }

/* Quiet glass surfaces use a solid dark base even without backdrop-filter. */
.glass {
  background: linear-gradient(135deg, #132743ed, #0b172de8 56%, #101f38ef);
  border-color: #47658e66;
  box-shadow: inset 0 1px 0 #a7caff0d, 0 18px 48px #00000025;
  backdrop-filter: blur(22px) saturate(115%);
}
.float-label {
  background: linear-gradient(130deg, #183354ed, #101f39e8);
  border-color: #526e9690;
  color: #d4e3fb;
  box-shadow: inset 0 1px 0 #d0e0ff0c, 0 8px 26px #0003;
}
.label-orb { border-color: #98bfff; background: #325b99; }

/* Page rails and legal links remain discreet but readable at their small sizes. */
.rail { border-color: #2e4364; }
.rail-count { color: #dce7fa; }
.rail-count span, .rail-direction { color: #a8b8d2; }
.rail-name { color: #e5eeff; }
.rail .arrow { color: #a5c3ff; }
.rail-dots a:before { background: #7f97bd; }
.rail-dots a[aria-current]:before { background: #bad0ff; box-shadow: 0 0 0 4px #9cbcff25; }
.footer-top, .footer-legal, .motion-toggle { color: #a8b8d2; }
.footer-top { font-size: 11px; line-height: 1.8; }
.footer-legal { font-size: 10.5px; }
.motion-toggle { font-size: 11px; }
.motion-toggle:disabled { color: #a8b8d2; cursor: default; }
.footer-legal a:hover, .footer-contact a:hover { color: #d8e6ff; }

/* Agent simulations. */
.demo-top { color: #bfd0eb; }
.demo-tag {
  color: #c6d9fb;
  background: #193151;
  border-color: #47668f;
  font-size: 10px;
}
.scenario-tabs { background: #071326; border-color: #395477; }
.scenario-tab { color: #b7c8e4; font-size: 12px; }
.scenario-tab:hover { background: #142948; color: #edf4ff; }
.scenario-tab[aria-selected=true] {
  background: #284b7e;
  color: #f3f7ff;
  box-shadow: inset 0 0 0 1px #749fdf50, 0 3px 14px #0002;
}
.flow-card { background: #0a172ce8; border-color: #3b567b; }
.flow-overline { color: #acc2e2; font-size: 10px; }
.flow-card h3 { color: #eef4ff; }
.flow-card p { color: #b2c1d9; font-size: 12px; }
.flow-connector:before { background: linear-gradient(#3b547c, #8fb6fa, #3b547c); }
.agent-core {
  background: linear-gradient(140deg, #284a79, #122844);
  border-color: #7fa9ea80;
  box-shadow: inset 0 0 0 1px #aad0ff0f, 0 0 0 7px #8db6ff0b;
}
.core-caption { color: #b7d0ff; font-size: 10px; }
.flow-output { border-color: #668ac0; background: linear-gradient(125deg, #1b3459, #102642); }
.flow-ready { color: #c5d8f6; font-size: 10px; }
.ready-icon { color: #c8deff; border-color: #83a7db; }
.demo-foot { border-color: #355073; color: #b2c2dc; font-size: 10px; }
.demo-foot strong { color: #d1e2ff; }
.demo [data-demo-meta] { font-size: 10px !important; }
.hosting { background: linear-gradient(105deg, #132743ed, #0c1930eb); }
.hosting-symbol { background: #24436a; color: #c1d8ff; }

/* Offers retain their original hierarchy and pricing. */
.offer-main { background: linear-gradient(135deg, #183254, #0e1d36 72%); }
.offer-main:after { border-color: #769edc2b; }
.offer-price { color: #b3ceff; }
.offer-list { color: #c2d0e6; }
.offer-list li:before { color: #a9ccff; }
.offer-main strong, .support-panel strong { color: #edf4ff; }

/* Preserve the portrait; only its frame joins the night palette. */
.portrait-frame { background: #101d31; }
.portrait-frame:after { border-color: #9ab9e82b; }
.initial-frame { background: linear-gradient(145deg, #142a48, #0b172d 62%, #172b46); }
.initial-frame:before {
  border-color: #779bd466;
  background: linear-gradient(130deg, #87b2ff10, #18365420);
  box-shadow: inset 0 0 30px #7cb6ff10, 0 20px 35px #00000020;
}
.initial-frame:after { border-color: #7398d12e; }
.initials { color: #aecaff; }
.team-number { color: #a7bbd8; }
.founder-tag { color: #c9dcff; background: #172f50; border-color: #4d6d98; }

/* Fields, hints and validation are visible on the same surface as the form. */
.contact-email { color: #b1ceff; }
.contact-next {
  max-width: 330px;
  margin-top: 35px;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.8;
}
.field label { color: #e9f1ff; font-size: 12px; }
.field label span { color: #acbdd7; font-size: 10.5px; }
.field input, .field textarea {
  background: #071326;
  color: #eef4ff;
  border-color: #647fa8;
  caret-color: #bed5ff;
}
.field input:hover, .field textarea:hover { background: #0b1930; border-color: #93b2df; }
.field input:focus-visible, .field textarea:focus-visible {
  background: #0b1930;
  border-color: #b3d1ff;
  outline: 2px solid #b3d1ff;
  outline-offset: 3px;
}
.field input::placeholder, .field textarea::placeholder { color: #9bacc7; opacity: 1; }
.field input:autofill { color: #eef4ff; background: #071326; }
.field input:-webkit-autofill {
  -webkit-text-fill-color: #eef4ff;
  caret-color: #bed5ff;
  box-shadow: 0 0 0 1000px #071326 inset;
}
.field-help { color: #a8b8d2; font-size: 10.5px; }
.form-privacy, .form-note { color: #b0bfd8; font-size: 11px; }
.form-privacy a, .form-note a { color: #c5daff; }
.form-error { background: #351923; color: #ffd0d7; border-color: #b16c7a; }

/* Explorer dialog and its backdrop. */
.explore-dialog {
  background: linear-gradient(135deg, #112441f5, #09152bf5);
  color: #eef4ff;
  border-color: #6689ba66;
  box-shadow: 0 26px 100px #0000008c, inset 0 1px 0 #b4d0ff10;
  backdrop-filter: blur(25px) saturate(115%);
}
.explore-dialog::backdrop { background: #020613b8; backdrop-filter: blur(12px); }
.menu-close { color: #e2eeff; background: #193251; border-color: #6986af; }
.menu-close:hover { background: #26466e; border-color: #a3c3ef; }
.menu-grid a { background: #10213b8c; border-color: #425d8490; }
.menu-grid a:hover, .menu-grid a[aria-current] { background: #203e66; border-color: #7799c5; }
.menu-grid .num, .menu-grid .arrow { color: #aecbff; }
.menu-grid small { color: #b0c1db; }
.menu-bottom { color: #b0c1db; border-color: #3e587d; }

/* Long-form information pages and success states. */
.legal-meta { color: #a4b5ce; }
.legal-toc a { background: #10223a; color: #cbdaf2; border-color: #4b658e; }
.legal-toc a:hover { background: #1b3557; border-color: #97b9ef; }
.legal-content p, .legal-content li, .legal-content address { color: #b4c3dc; }
.legal-content strong { color: #eef4ff; }
.legal-content a { color: #bed5ff; }
.legal-content a:hover { color: #e6efff; }
.thanks .thanks-symbol {
  background: linear-gradient(#1b3558, #0e213c);
  color: #c4dcff;
  border-color: #6b8fbf;
}

@media (max-width: 760px) {
  .header { padding-top: 16px; }
  .header-bar { min-height: 60px; gap: 12px; }
  .nav-glass { border-radius: 18px; }
  .nav-glass a { padding: 10px 12px; }
  .footer-top { font-size: 10.5px; }
  .footer-legal { font-size: 10px; }
}

/* Leave the user's system palette in charge in high-contrast mode. */
@media (forced-colors: active) {
  :root { --paper: Canvas; --ink: CanvasText; --muted: CanvasText; --blue: LinkText; --deep: LinkText; --line: ButtonText; }
  body { background: Canvas; color: CanvasText; }
  .brand img, .agent-core img { filter: none; }
  .blue-text { background: none; color: CanvasText; }
  .nav-glass, .glass, .hosting, .offer-main, .flow-card, .flow-output, .initial-frame, .explore-dialog,
  .scenario-tabs, .scenario-tab[aria-selected=true], .menu-grid a, .demo-tag, .founder-tag, .legal-toc a {
    background: Canvas;
    color: CanvasText;
    border-color: ButtonText;
    box-shadow: none;
  }
  .nav-glass a, .legal-content a, .text-link, .contact-email { color: LinkText; }
  .button, .button.white, .header-cta, .menu-toggle, .menu-close, .skip-link {
    background: ButtonFace;
    color: ButtonText;
    border-color: ButtonText;
    box-shadow: none;
  }
  .field input, .field textarea { background: Field; color: FieldText; border-color: ButtonText; }
  .field input:-webkit-autofill { -webkit-text-fill-color: FieldText; box-shadow: none; }
  .field input::placeholder, .field textarea::placeholder { color: GrayText; }
  .form-error { background: Canvas; color: CanvasText; border-color: CanvasText; }
  :focus-visible { outline-color: Highlight; }
}