/* PseudoGamma landing - tokens mirror the app (src/Web/PseudoGamma.Web/src/styles.css);
   light theme + brand-blue accent are derived from marketbet.com. Contrast pairs verified
   in the design spec (WCAG 2.2 AA). No inline styles anywhere (CSP style-src 'self'). */

:root {
  color-scheme: dark light;
  --pg-bg: #091019;
  --pg-bg-deep: #080f18;
  --pg-surface: #0e1824;
  --pg-surface-2: #101c29;
  --pg-border: #1d2d3e;
  --pg-border-strong: #31465e;
  --pg-input-border: #5b7ba0;
  --pg-text: #e8edf5;
  --pg-text-muted: #9babbc;
  --pg-text-subtle: #8a9bb0;
  --pg-accent: #d9ff62;
  --pg-accent-ink: #0a100c;
  --pg-accent-text: #d9ff62;
  --pg-accent-edge: transparent;
  --pg-blue: #90bee0;
  --pg-danger: #ff9d9d;
  --pg-danger-bg: #201316;
  --pg-danger-border: #693232;
  --pg-success: #d9ff9a;
  --pg-success-bg: #111a0f;
  --pg-success-border: #3d5727;
  --pg-reject: #ff6b7a;
  --pg-focus: #d9ff62;
  --pg-shadow-card: none;
  --pg-glow-a: rgba(217, 255, 98, 0.06);
  --pg-glow-b: rgba(144, 190, 224, 0.05);
  --pg-font: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --pg-radius-sm: 7px;
  --pg-radius: 11px;
  --pg-radius-lg: 14px;
  --pg-container: 1180px;
}

@media (prefers-color-scheme: light) {
  :root {
    --pg-bg: #f6f8fb;
    --pg-bg-deep: #080f18;
    --pg-surface: #ffffff;
    --pg-surface-2: #eef3f8;
    --pg-border: #d3dce6;
    --pg-border-strong: #9fb0c3;
    --pg-input-border: #758396;
    --pg-text: #0f1722;
    --pg-text-muted: #425466;
    --pg-text-subtle: #5f6f82;
    --pg-accent-text: #4a6b00;
    --pg-accent-edge: #4a6b00;
    --pg-blue: #2f6a9c;
    --pg-danger: #b3261e;
    --pg-danger-bg: #fdecea;
    --pg-danger-border: #e3a29d;
    --pg-success: #1f6b3a;
    --pg-success-bg: #eaf7ee;
    --pg-success-border: #9ccbab;
    --pg-reject: #b3261e;
    --pg-focus: #2f6a9c;
    --pg-shadow-card: 0 1px 2px rgba(15, 23, 34, 0.06), 0 8px 24px rgba(15, 23, 34, 0.06);
    --pg-glow-a: rgba(217, 255, 98, 0.18);
    --pg-glow-b: rgba(144, 190, 224, 0.16);
  }
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
@media (prefers-reduced-motion: no-preference) { html { scroll-behavior: smooth; } }
body {
  margin: 0;
  font-family: var(--pg-font);
  font-size: 1rem;
  line-height: 1.6;
  color: var(--pg-text);
  background: var(--pg-bg);
  background-image:
    radial-gradient(900px 500px at 90% -5%, var(--pg-glow-a), transparent 70%),
    radial-gradient(800px 500px at -5% 105%, var(--pg-glow-b), transparent 70%);
  background-attachment: fixed;
}
img, svg { display: block; max-width: 100%; }
a { color: var(--pg-blue); text-underline-offset: 3px; }
a:hover { text-decoration-thickness: 2px; }
h1, h2, h3 { margin: 0; line-height: 1.15; }
p { margin: 0; }
ul, ol { margin: 0; padding: 0; list-style: none; }
.pg-hidden-visually {
  position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}

:focus-visible {
  outline: 2px solid var(--pg-focus);
  outline-offset: 2px;
  border-radius: 3px;
}

.pg-skip {
  position: absolute; left: 12px; top: -64px; z-index: 100;
  padding: 10px 16px; border-radius: var(--pg-radius-sm);
  background: var(--pg-accent); color: var(--pg-accent-ink); font-weight: 700;
}
.pg-skip:focus { top: 12px; }

.pg-container { width: 100%; max-width: var(--pg-container); margin-inline: auto; padding-inline: 24px; }
@media (max-width: 560px) { .pg-container { padding-inline: 16px; } }

/* ---------- nav ---------- */
.pg-nav {
  position: sticky; top: 0; z-index: 50;
  background: #0a121c;
  border-bottom: 1px solid #1d2d3e;
  color: #e8edf5;
}
.pg-nav a:not(.pg-btn) { color: inherit; }
.pg-nav__inner { display: flex; align-items: center; gap: 24px; min-height: 64px; }
.pg-brand { display: flex; align-items: center; gap: 12px; text-decoration: none; margin-inline-end: auto; }
.pg-brand__mark { width: 38px; height: 38px; flex: none; }
.pg-brand__name { display: block; font-weight: 800; letter-spacing: -0.01em; line-height: 1.1; }
.pg-brand__sub { display: block; font-size: 12px; color: #9babbc; line-height: 1.2; }
.pg-nav__links { display: flex; align-items: center; gap: 22px; }
.pg-nav__links a:not(.pg-btn) { font-size: 14px; font-weight: 500; color: #9babbc; text-decoration: none; padding-block: 12px; }
.pg-nav__links a:not(.pg-btn):hover { color: #e8edf5; }
.pg-nav__toggle {
  display: none; min-width: 44px; min-height: 44px; border-radius: var(--pg-radius-sm);
  border: 1px solid #31465e; background: transparent; color: #e8edf5; font: inherit; font-weight: 700; cursor: pointer;
}
@media (max-width: 900px) {
  .pg-nav__toggle { display: inline-flex; align-items: center; justify-content: center; padding: 0 14px; }
  .pg-nav__links {
    display: none; position: absolute; inset-inline: 0; top: 100%;
    flex-direction: column; align-items: stretch; gap: 0;
    padding: 8px 16px 16px; background: #0a121c; border-bottom: 1px solid #1d2d3e;
  }
  .pg-nav__links.is-open { display: flex; }
  .pg-nav__links a:not(.pg-btn) { min-height: 48px; display: flex; align-items: center; }
  .pg-nav__links .pg-btn { margin-top: 8px; }
}

/* ---------- buttons ---------- */
.pg-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  min-height: 44px; padding: 12px 20px; border-radius: var(--pg-radius-sm);
  font: inherit; font-size: 15px; font-weight: 700; line-height: 1.2; text-decoration: none; cursor: pointer;
  border: 1px solid transparent;
  transition: background-color .15s ease, filter .15s ease;
}
.pg-btn--primary { background: var(--pg-accent); color: var(--pg-accent-ink); border-color: var(--pg-accent-edge); }
.pg-btn--primary:hover { filter: brightness(1.08); }
.pg-btn--primary:active { filter: brightness(0.94); }
.pg-btn--ghost { background: transparent; color: var(--pg-text); border-color: var(--pg-border-strong); }
.pg-btn--ghost:hover { background: var(--pg-surface-2); }
.pg-nav .pg-btn--ghost { color: #e8edf5; border-color: #31465e; }
.pg-nav .pg-btn--ghost:hover { background: #101c29; }
.pg-btn[disabled], .pg-btn[aria-disabled="true"] { opacity: .55; cursor: not-allowed; filter: none; }
.pg-btn--sm { min-height: 44px; padding: 8px 16px; font-size: 14px; }

/* ---------- typography ---------- */
.pg-eyebrow {
  display: inline-block; margin-bottom: 16px;
  font-size: 12px; font-weight: 800; letter-spacing: .15em; text-transform: uppercase; color: var(--pg-accent-text);
}
.pg-h1 { font-size: clamp(2.5rem, 1.6rem + 3.6vw, 4.25rem); font-weight: 600; letter-spacing: -.03em; line-height: 1.08; }
.pg-h2 { font-size: clamp(1.75rem, 1.2rem + 2vw, 2.75rem); font-weight: 600; letter-spacing: -.02em; line-height: 1.15; }
.pg-h3 { font-size: 1.25rem; font-weight: 700; }
.pg-lead { font-size: clamp(1.0625rem, 1rem + .4vw, 1.3125rem); color: var(--pg-text-muted); max-width: 62ch; line-height: 1.6; }
.pg-prose { max-width: 68ch; color: var(--pg-text-muted); }
.pg-prose p + p { margin-top: 16px; }
.pg-small { font-size: 13px; color: var(--pg-text-subtle); }

/* ---------- sections ---------- */
section[id], .pg-anchor { scroll-margin-top: 84px; }
.pg-section { padding-block: clamp(64px, 8vw, 112px); }
.pg-section--band { background: var(--pg-surface-2); border-block: 1px solid var(--pg-border); }
@media (prefers-color-scheme: dark) { .pg-section--band { background: rgba(14, 24, 36, 0.55); } }
.pg-section__head { margin-bottom: 48px; max-width: 760px; }
.pg-section__head .pg-lead { margin-top: 16px; }

.pg-hero { padding-block: clamp(48px, 7vw, 104px) clamp(56px, 7vw, 96px); }
.pg-hero__grid { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: 48px; align-items: center; }
.pg-hero__cta { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 32px; }
.pg-hero .pg-lead { margin-top: 24px; }
.pg-hero__micro { margin-top: 16px; font-size: 13px; color: var(--pg-text-subtle); }
@media (max-width: 900px) { .pg-hero__grid { grid-template-columns: minmax(0, 1fr); gap: 40px; } }

/* ---------- cards ---------- */
.pg-card {
  background: var(--pg-surface); border: 1px solid var(--pg-border); border-radius: var(--pg-radius);
  padding: 24px; box-shadow: var(--pg-shadow-card);
}
.pg-card--panel { border-radius: var(--pg-radius-lg); padding: 24px; }
.pg-card p { color: var(--pg-text-muted); margin-top: 8px; }
.pg-card .pg-h3 { margin-top: 0; }
.pg-grid { display: grid; gap: 24px; }
.pg-grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.pg-grid--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (max-width: 900px) { .pg-grid--3 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 640px) { .pg-grid--3, .pg-grid--2 { grid-template-columns: minmax(0, 1fr); } }
@media (prefers-reduced-motion: no-preference) {
  .pg-card { transition: border-color .2s ease, transform .2s ease; }
  .pg-card:hover { border-color: var(--pg-border-strong); transform: translateY(-2px); }
}

.pg-split { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 48px; align-items: start; }
@media (max-width: 900px) { .pg-split { grid-template-columns: minmax(0, 1fr); gap: 24px; } }

.pg-step__num {
  display: inline-flex; align-items: center; justify-content: center; min-width: 28px; height: 24px; padding-inline: 8px;
  margin-bottom: 12px; border-radius: 999px; border: 1px solid var(--pg-accent-text);
  font-size: 12px; font-weight: 800; color: var(--pg-accent-text);
}
.pg-icon { width: 40px; height: 40px; margin-bottom: 16px; padding: 8px; border-radius: 10px; background: var(--pg-surface-2); color: var(--pg-blue); }

.pg-callout {
  margin-top: 32px; padding: 16px 20px; border-radius: var(--pg-radius);
  border: 1px solid var(--pg-border-strong); border-inline-start: 4px solid var(--pg-accent-text);
  background: var(--pg-surface); font-weight: 600;
}

/* ---------- hero illustration ---------- */
.pg-figure { margin: 0; }
.pg-figure figcaption { margin-top: 12px; font-size: 13px; color: var(--pg-text-subtle); }
.pg-chips { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 16px; }
.pg-chip {
  display: inline-flex; align-items: center; gap: 6px; padding: 4px 12px; border-radius: 999px;
  border: 1px solid var(--pg-border-strong); font-size: 12px; font-weight: 700; color: var(--pg-text-muted);
}
.pg-chip__dot { width: 8px; height: 8px; border-radius: 50%; background: var(--pg-accent-text); }
.pg-chip--ok .pg-chip__dot { box-shadow: 0 0 10px var(--pg-accent); }

/* ---------- lists ---------- */
.pg-checks li { position: relative; padding-inline-start: 28px; color: var(--pg-text-muted); }
.pg-checks li + li { margin-top: 10px; }
.pg-checks li::before {
  content: ""; position: absolute; inset-inline-start: 4px; top: .55em; width: 9px; height: 5px;
  border-inline-start: 2px solid var(--pg-accent-text); border-block-end: 2px solid var(--pg-accent-text); transform: rotate(-45deg);
}

/* ---------- FAQ ---------- */
.pg-faq { max-width: 820px; }
.pg-faq details { border-bottom: 1px solid var(--pg-border); }
.pg-faq summary {
  list-style: none; cursor: pointer; padding: 16px 40px 16px 0; min-height: 44px; position: relative; font-weight: 700;
}
.pg-faq summary::-webkit-details-marker { display: none; }
.pg-faq summary::after {
  content: "+"; position: absolute; inset-inline-end: 8px; top: 50%; transform: translateY(-50%);
  font-size: 22px; font-weight: 400; color: var(--pg-accent-text);
}
.pg-faq details[open] summary::after { content: "\2212"; }
.pg-faq details > p { padding: 0 0 20px; color: var(--pg-text-muted); max-width: 68ch; }

/* ---------- waitlist ---------- */
.pg-waitlist { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 48px; align-items: start; }
@media (max-width: 900px) { .pg-waitlist { grid-template-columns: minmax(0, 1fr); gap: 32px; } }
.pg-waitlist__panel { max-width: 1000px; margin-inline: auto; padding: clamp(24px, 4vw, 48px); }
.pg-form { display: grid; gap: 20px; }
.pg-field { display: grid; gap: 6px; }
.pg-field label, .pg-field .pg-label { font-size: 13px; font-weight: 700; }
.pg-optional { font-weight: 400; color: var(--pg-text-subtle); }
.pg-input, .pg-select {
  width: 100%; min-height: 44px; padding: 10px 12px; border-radius: var(--pg-radius-sm);
  border: 1px solid var(--pg-input-border); background: var(--pg-bg); color: var(--pg-text);
  font: inherit; font-size: 16px;
}
@media (prefers-color-scheme: light) { .pg-input, .pg-select { background: #fff; } }
.pg-input:hover, .pg-select:hover { border-color: var(--pg-text-subtle); }
.pg-input:focus-visible, .pg-select:focus-visible {
  outline: 2px solid var(--pg-focus); outline-offset: 1px; border-color: var(--pg-focus);
  box-shadow: 0 0 0 4px rgba(217, 255, 98, 0.2);
}
.pg-input[aria-invalid="true"], .pg-check input[aria-invalid="true"] { border-color: var(--pg-danger); outline: 1px solid var(--pg-danger); }
.pg-hint { font-size: 13px; color: var(--pg-text-subtle); }
.pg-error { display: none; font-size: 13px; font-weight: 600; color: var(--pg-danger); }
.pg-error.is-visible { display: flex; gap: 6px; align-items: flex-start; }
.pg-error.is-visible::before { content: "!"; flex: none; width: 16px; height: 16px; margin-top: 2px; border-radius: 50%; background: var(--pg-danger); color: var(--pg-bg); text-align: center; line-height: 16px; font-size: 11px; font-weight: 800; }
.pg-check { display: flex; gap: 12px; align-items: flex-start; }
.pg-check input { flex: none; width: 24px; height: 24px; margin: 2px 0 0; accent-color: var(--pg-accent-text); }
.pg-check label { font-size: 14px; font-weight: 400; color: var(--pg-text-muted); cursor: pointer; }
.pg-trap { position: absolute; inset-inline-start: -10000px; width: 1px; height: 1px; overflow: hidden; }

.pg-notice { border-radius: var(--pg-radius); padding: 16px 20px; border: 1px solid; }
.pg-notice--error { background: var(--pg-danger-bg); border-color: var(--pg-danger-border); color: var(--pg-danger); }
.pg-notice--success { background: var(--pg-success-bg); border-color: var(--pg-success-border); color: var(--pg-success); }
.pg-notice h3, .pg-notice p { margin: 0; }
.pg-notice h3 { font-size: 1.1rem; margin-bottom: 4px; }
.pg-notice ul { margin-top: 8px; padding-inline-start: 18px; list-style: disc; }
.pg-notice a { color: inherit; font-weight: 700; }
.pg-notice[hidden] { display: none; }
.pg-notice:focus { outline: 2px solid var(--pg-focus); outline-offset: 2px; }

.pg-spinner {
  width: 16px; height: 16px; border-radius: 50%; border: 2px solid currentColor; border-inline-end-color: transparent;
  display: none;
}
.pg-btn[aria-busy="true"] .pg-spinner { display: inline-block; }
@media (prefers-reduced-motion: no-preference) { .pg-btn[aria-busy="true"] .pg-spinner { animation: pg-spin .8s linear infinite; } }
@keyframes pg-spin { to { transform: rotate(360deg); } }

/* ---------- footer ---------- */
.pg-footer { background: var(--pg-bg-deep); color: #9babbc; padding-block: 56px 40px; border-top: 1px solid #1d2d3e; }
.pg-footer a { color: #90bee0; }
.pg-footer__grid { display: grid; grid-template-columns: 1.4fr 1fr 1.2fr; gap: 32px; }
@media (max-width: 760px) { .pg-footer__grid { grid-template-columns: minmax(0, 1fr); } }
.pg-footer h2 { font-size: 13px; letter-spacing: .12em; text-transform: uppercase; color: #e8edf5; margin-bottom: 12px; }
.pg-footer li + li { margin-top: 4px; }
.pg-footer li a { display: inline-block; padding-block: 8px; }
.pg-footer address { font-style: normal; }
.pg-footer__legal { margin-top: 40px; padding-top: 24px; border-top: 1px solid #1d2d3e; font-size: 13px; color: #8a9bb0; }
.pg-footer__legal p { max-width: 80ch; }
.pg-footer__legal p + p { margin-top: 12px; }

/* ---------- simple pages ---------- */
.pg-page { padding-block: clamp(48px, 7vw, 96px); }
.pg-page h1 { margin-bottom: 24px; }
.pg-page h2 { font-size: 1.4rem; margin-top: 40px; margin-bottom: 8px; }
.pg-page p, .pg-page li { color: var(--pg-text-muted); max-width: 72ch; }
.pg-page ul { list-style: disc; padding-inline-start: 22px; }
.pg-page li + li { margin-top: 6px; }
.pg-page p + p { margin-top: 12px; }
.pg-table { width: 100%; max-width: 72ch; border-collapse: collapse; margin-top: 12px; font-size: 14px; }
.pg-table th, .pg-table td { text-align: start; padding: 10px 12px; border-bottom: 1px solid var(--pg-border); vertical-align: top; color: var(--pg-text-muted); }
.pg-table th { color: var(--pg-text); font-weight: 700; width: 34%; }

noscript .pg-notice { margin-bottom: 16px; }

@media (forced-colors: active) {
  .pg-btn { border: 1px solid ButtonText; }
  .pg-chip__dot { background: CanvasText; }
}
/* ---------- misc layout helpers (no inline styles under CSP) ---------- */
.pg-brand__name--footer { color: #e8edf5; }
.pg-footer__tag { margin-top: 12px; max-width: 34ch; }
.pg-risknote { margin-top: 32px; max-width: 80ch; }
.pg-pillars { margin-top: 48px; }
.pg-steps { margin-top: 32px; }
.pg-figure + .pg-steps { margin-top: 40px; }
.pg-waitlist__list { margin-top: 24px; }
.pg-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 24px; }

/* ---------- review fixes (UX/UI round 1) ---------- */
/* Dark chrome (nav/footer) is dark in both themes: its focus ring must be light. */
.pg-nav :focus-visible, .pg-footer :focus-visible { outline-color: #d9ff62; }

/* Invalid fields keep a full-strength focus ring (cascade-safe). */
.pg-input[aria-invalid="true"], .pg-select[aria-invalid="true"] { border-color: var(--pg-danger); box-shadow: 0 0 0 1px var(--pg-danger); outline: none; }
.pg-input[aria-invalid="true"]:focus-visible, .pg-select[aria-invalid="true"]:focus-visible { outline: 2px solid var(--pg-focus); outline-offset: 1px; }
.pg-check input[aria-invalid="true"] { outline: 2px solid var(--pg-danger); outline-offset: 2px; }
#form-summary { margin-bottom: 20px; }
#form-status { margin-bottom: 8px; }

.pg-btn--ghost, .pg-chip { border-color: var(--pg-input-border); }
.pg-nav .pg-btn--ghost { border-color: #5b7ba0; }

.pg-btn[aria-busy="true"] { opacity: .85; cursor: progress; }

/* Tablet: a lone third card spans the row instead of orphaning. */
@media (max-width: 900px) and (min-width: 641px) { .pg-grid--3 > :last-child:nth-child(odd) { grid-column: 1 / -1; } }

/* Without JS the collapsed-menu button would be dead: only collapse when script is running. */
@media (max-width: 900px) {
  html:not(.js) .pg-nav__toggle { display: none; }
  html:not(.js) .pg-nav__links { display: flex; position: static; flex-wrap: wrap; flex-direction: row; gap: 4px 16px; padding: 0 0 12px; background: transparent; border: 0; }
  html:not(.js) .pg-nav__inner { flex-wrap: wrap; }
}

@media (forced-colors: active) {
  .pg-btn--primary { border: 2px solid Highlight; }
  .pg-btn--ghost { border: 1px solid ButtonText; }
  :focus-visible { outline: 2px solid Highlight; }
  .pg-ladder__a, .pg-ladder__b, .pg-ladder__level, .pg-ladder__anchor { stroke: CanvasText; }
}

/* Hero illustration: two related instruments crossing a ladder of price levels (illustrative only). */
.pg-hero__visual { max-width: 440px; margin-inline: auto; }
@media (max-width: 900px) { .pg-hero__visual { display: none; } }
.pg-ladder { display: block; width: 100%; height: auto; }
.pg-ladder__level { stroke: var(--pg-border-strong); stroke-width: 1; stroke-dasharray: 2 5; }
.pg-ladder__anchor { stroke: var(--pg-input-border); stroke-width: 1.5; }
.pg-ladder__a, .pg-ladder__b { fill: none; stroke-width: 2.5; stroke-linecap: round; stroke-linejoin: round; }
.pg-ladder__a { stroke: var(--pg-accent-text); }
.pg-ladder__b { stroke: var(--pg-blue); }
.pg-ladder__label { fill: var(--pg-text-subtle); font: 600 11px var(--pg-font); }
.pg-ladder__label--a { fill: var(--pg-accent-text); }
.pg-ladder__label--b { fill: var(--pg-blue); }
@media (prefers-color-scheme: light) {
  .pg-ladder__a { stroke: #4a6a00; } .pg-ladder__label--a { fill: #4a6a00; }
  .pg-ladder__b { stroke: #1f5f99; } .pg-ladder__label--b { fill: #1f5f99; }
  .pg-ladder__level { stroke: #9aa8b8; }
}
@media (prefers-reduced-motion: no-preference) {
  .pg-ladder__a, .pg-ladder__b { stroke-dasharray: 700; stroke-dashoffset: 700; animation: pg-draw 1.6s ease-out .2s forwards; }
}
@keyframes pg-draw { to { stroke-dashoffset: 0; } }