/* Independent OnePay-inspired public composition. No product or legal claims changed. */
@media screen {
  :root {
    --site-bg: #f4f7f9; --site-ink: #15232f; --site-muted: #4f6170;
    --site-border: #d8e2e9; --site-surface: #ffffff; --site-raised: #eaf0f4;
    --site-cyan: #006585; --site-magenta: #b50080; --site-orange: #a53c00;
    --site-green: #006e2f; --site-lime: #466600; --site-teal: #006e63;
    --site-positive: #006e2f; --site-danger: #b91434; --site-warning: #a14400;
  }
  :root[data-theme="dark"] {
    --site-bg: #111111; --site-ink: #f9f9f9; --site-muted: #d0d7df;
    --site-border: #303b46; --site-surface: #191e24; --site-raised: #212832;
    --site-brand: #36b6ff; --site-brand-soft: #163348;
    --site-cyan: #16d5f5; --site-magenta: #ff60e4; --site-orange: #ff982f;
    --site-green: #39e879; --site-lime: #b8ed2f; --site-teal: #22dfbc;
    --site-positive: #39e879; --site-danger: #ff607a; --site-warning: #ffae38;
  }
  .site-header { border-bottom-color: var(--site-border); }
  .hero { gap: 48px; }
  .hero h1 > span { color: var(--site-brand); background: none; }
  .product-window { border-radius: 16px; box-shadow: none; }
  .mock-content { padding: 24px; }
  .mock-balance { background: var(--site-raised); padding: 20px; border-radius: 16px; }
  .mock-shortcuts > span { border-radius: 12px; }
  .mock-shortcuts > span:nth-child(1) .icon { color: var(--site-green); }
  .mock-shortcuts > span:nth-child(2) .icon { color: var(--site-magenta); }
  .mock-shortcuts > span:nth-child(3) .icon { color: var(--site-lime); }
  .collection-avatar { background: var(--site-raised); color: var(--site-cyan); }
  .feature-stage,.feature-panel,.feature-option,.trust-grid article,.cta-section,.floating-receipt { border-radius: 16px; }
  .feature-option .feature-icon { background: var(--site-raised); }
  .feature-option[data-panel="loans"] .feature-icon { color: var(--site-magenta); }
  .feature-option[data-panel="raffles"] .feature-icon { color: var(--site-orange); }
  .feature-option[data-panel="collections"] .feature-icon { color: var(--site-green); }
  .feature-option[data-panel="cash"] .feature-icon { color: var(--site-brand); }
  .platform-strip > div:nth-of-type(1) .icon { color: var(--site-magenta); }
  .platform-strip > div:nth-of-type(2) .icon { color: var(--site-orange); }
  .platform-strip > div:nth-of-type(3) .icon { color: var(--site-green); }
  .platform-strip > div:nth-of-type(4) .icon { color: var(--site-lime); }
  .trust-grid article:nth-child(1) .icon { color: var(--site-teal); }
  .trust-grid article:nth-child(2) .icon { color: var(--site-cyan); }
  .trust-grid article:nth-child(3) .icon { color: var(--site-lime); }
  .trust-grid article:nth-child(4) .icon { color: var(--site-orange); }
  .faq-list details { border-color: var(--site-border); }
  .faq-list summary { color: var(--site-ink); }
  .site-footer { border-color: var(--site-border); }
  :focus-visible { outline: 2px solid var(--site-brand); outline-offset: 4px; }
  @media (max-width: 760px) {
    .hero { gap: 28px; }
    .mock-content { padding: 20px; }
    .mock-balance { padding: 16px; }
    .mock-balance strong { font-size: 34px; }
    .mock-balance strong span { font-size: 22px; }
  }
}