/* KNGX — every box, button and input across the app styled like the log in card (landing page).
   Scoped to html.kx-dark (dark mode with the particle field) so light mode keeps its own look. */
html.kx-dark {
  /* like the log in page: no solid box, the outline is glowing dots and the dots show through */
  --kx-card-bg: transparent;
  --kx-card-line: rgba(127,243,221,.7);
  --kx-card-glow: 0 0 16px rgba(0,201,167,.22);
}
/* boxes */
html.kx-dark .card, html.kx-dark .amazon-status-card, html.kx-dark .stat-tile, html.kx-dark .product-card,
html.kx-dark .kx-pcard, html.kx-dark .kx-todo, html.kx-dark .kx-last, html.kx-dark .kx-market > div,
html.kx-dark .kx-market-verdict, html.kx-dark .kx-research-brief, html.kx-dark .kx-pv-listing, html.kx-dark .kx-pv-money,
html.kx-dark .kx-pv-tiles > div, html.kx-dark .kx-pv-chart, html.kx-dark .kx-pv-vs, html.kx-dark .kx-pv-details,
html.kx-dark .kx-chat-compose,
html.kx-dark .kx-chat-retry,
html.kx-dark .kx-comp-note,
html.kx-dark .kx-compare-advice,
html.kx-dark .kx-compare-dock,
html.kx-dark .kx-holo,
html.kx-dark .kx-more-menu,
html.kx-dark .kx-morning-go,
html.kx-dark .kx-offline,
html.kx-dark .kx-order,
html.kx-dark .kx-pin,
html.kx-dark .kx-product-hero,
html.kx-dark .kx-replay-head,
html.kx-dark .kx-search-advanced,
html.kx-dark .kx-seg,
html.kx-dark .kx-ticker,
html.kx-dark .kx-tip,
html.kx-dark .kx-tipday,
html.kx-dark .kx-understood,
html.kx-dark .kxr-allgood,
html.kx-dark .kxr-best,
html.kx-dark .prod-head,
html.kx-dark .prod-profit,
html.kx-dark .prod-toolbar,
html.kx-dark .kx-find-bar,
html.kx-dark .kx-sheet-row,
html.kx-dark .kx-comp-row,
html.kx-dark .kx-sup-row,
html.kx-dark .kx-momentum,
html.kx-dark .kx-hero,
html.kx-dark .kx-today-panel,
html.kx-dark .kx-chat-panel, html.kx-dark .modal, html.kx-dark .kx-bsheet-panel, html.kx-dark .kx-udrop {
  background: var(--kx-card-bg) !important;
  border: 1.6px dotted var(--kx-card-line) !important;
  border-radius: 22px !important;
  box-shadow: var(--kx-card-glow) !important;
  -webkit-backdrop-filter: none !important; backdrop-filter: none !important;
}
html.kx-dark .kx-pcard, html.kx-dark .kx-pv-tiles > div, html.kx-dark .kx-market > div, html.kx-dark .stat-tile { border-radius: 18px !important; }
/* the moving neon edge from the log in card, on the main cards */
html.kx-dark .card { position: relative; isolation: isolate; }
html.kx-dark .card::before { display: none !important; }
/* fonts: Outfit for titles + buttons (like the log in card), JetBrains Mono for big numbers */
html.kx-dark .page-title, html.kx-dark .card-title, html.kx-dark h1, html.kx-dark h2, html.kx-dark h3, html.kx-dark h4,
html.kx-dark .btn, html.kx-dark .bottom-nav-link, html.kx-dark .kx-bsheet-panel a, html.kx-dark .kx-bsheet-panel button { font-family: Outfit, system-ui, sans-serif !important; }
html.kx-dark .stat-value, html.kx-dark .kx-pv-tiles b, html.kx-dark .kx-market b { font-family: 'JetBrains Mono', ui-monospace, monospace; }
/* buttons */
html.kx-dark .btn { border-radius: 14px !important; font-weight: 700 !important; }
html.kx-dark .btn-primary { background: linear-gradient(135deg, #00c9a7, #22d3ee) !important; color: #04201a !important; border: 0 !important; box-shadow: 0 10px 28px rgba(0,201,167,.35) !important; }
html.kx-dark .btn-secondary, html.kx-dark .btn-ghost { background: transparent !important; border: 1.6px dotted var(--kx-card-line) !important; color: #eafff9 !important; }
/* inputs */
html.kx-dark .form-input, html.kx-dark .kx-pv-calc input, html.kx-dark .kx-chat-form textarea {
  border-radius: 12px !important; border: 1.6px dotted var(--kx-card-line) !important; background: transparent !important; color: #eafff9 !important; }
html.kx-dark .form-input:focus, html.kx-dark .kx-pv-calc input:focus { border-color: #00c9a7 !important; box-shadow: 0 0 0 4px rgba(0,201,167,.18) !important; outline: none; }

html.kx-dark .card::after, html.kx-dark .kx-hero::before, html.kx-dark .kx-hero::after, html.kx-dark .kx-today-panel::before { display: none !important; }