/**
 * ChartDeck brand - "Holo Glass" (operator 2026-09-29, from logo option 269 "Three panes, holo light").
 * Included by EVERY page before its own stylesheet (terminal, auth, admin, pricing, server-rendered pages).
 *
 * Font: Sora (variable, weights 400-800, latin subset), self-hosted because the auth pages run under
 * CSP font-src 'self'. Source: Google Fonts (fonts.gstatic.com/s/sora/v17). Licence: SIL OFL 1.1, fonts/OFL.txt.
 *
 * Palette (canonical values; each stylesheet repeats them as literals so a page still renders if this
 * file is late): background #07090D - surface #0F131B - raised #161B26 - glass rgba(255,255,255,.06) +
 * 1px holo edge - lines #1F2533 - text #F2F4F8 - muted #8C95A6 - holo #7FFFD4 > #A9B8FF > #FFA8D2 >
 * #FFD98A > #7FE0FF - primary lilac #A9B8FF - accent aqua #7FFFD4 - gain #3DDC97 - loss #FF6B81 -
 * warning gold #FFD98A. Filled primary buttons carry DARK text #07090D (>= 9.7:1 on every holo stop).
 * The holo gradient is used sparingly: logo, primary CTAs, the active plan / badge, thin accent lines.
 */

@font-face {
  font-family: 'Sora';
  font-style: normal;
  font-weight: 400 800;
  font-display: swap;
  src: url('fonts/sora-latin-var.woff2') format('woff2');
}

:root {
  --cd-bg:       #07090D;
  --cd-surface:  #0F131B;
  --cd-raised:   #161B26;
  --cd-line:     #1F2533;
  --cd-text:     #F2F4F8;
  --cd-muted:    #8C95A6;
  --cd-lilac:    #A9B8FF;
  --cd-aqua:     #7FFFD4;
  --cd-pink:     #FFA8D2;
  --cd-gold:     #FFD98A;
  --cd-cyan:     #7FE0FF;
  --cd-gain:     #3DDC97;
  --cd-loss:     #FF6B81;
  --cd-warn:     #FFD98A;
  --cd-on-holo:  #07090D;
  --cd-holo:     linear-gradient(135deg, #7FFFD4 0%, #A9B8FF 30%, #FFA8D2 55%, #FFD98A 80%, #7FE0FF 100%);
  --cd-holo-h:   linear-gradient(90deg, #7FFFD4 0%, #A9B8FF 30%, #FFA8D2 55%, #FFD98A 80%, #7FE0FF 100%);
  --cd-glass:    rgba(255,255,255,.06);
  --cd-glass-2:  rgba(255,255,255,.09);
  --cd-font:     'Sora', system-ui, -apple-system, 'Segoe UI', sans-serif;
}

html { font-family: var(--cd-font); }
body { font-family: var(--cd-font); }
button, input, select, textarea { font-family: inherit; }

/* Numbers never jitter sideways as digits change (Sora ships a tnum feature). */
table, .num, .price, .amount, [data-num], time { font-variant-numeric: tabular-nums; }

/* Helpers any page may use. */
.cd-holo-text {
  background: var(--cd-holo-h); -webkit-background-clip: text; background-clip: text;
  color: transparent; -webkit-text-fill-color: transparent;
}
/* A 1px holo edge around a glass surface: gradient border via a masked pseudo-element. */
.cd-holo-edge { position: relative; }
.cd-holo-edge::before {
  content: ''; position: absolute; inset: 0; border-radius: inherit; padding: 1px; pointer-events: none;
  background: var(--cd-holo);
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor; mask-composite: exclude;
}