/* ============================================================================
   COINEE.io — design tokens (redesign 2026-09, etapa 1a)
   ----------------------------------------------------------------------------
   JEDINY zdroj barev, pisma, radiusu, rozestupu a focusu. Zdroj hodnot:
   Coinee-finalni-design-a-predani.md (tabulka "Vizualni system") + prototyp
   source/coinee-final-design.html. JEN TMAVY REZIM (rozhodnuti Jiriho 18. 9. 2026),
   svetle protejsky z prototypu se zamerne neprebiraji.

   Dve sady:
   1) --cn-*      novy vizualni system. Pouzivaji ho stranky etapy 1a
                  (index, login, register, forgot-password, reset-password)
                  pres coinee-ui.css / landing-v4.css / auth-v2.css.
   2) --legacy-*  hodnoty DOSAVADNIHO vzhledu. Cte z nich styles.css (:root),
                  takze stranky mimo etapu 1a vypadaji presne jako driv.
                  Etapa 1b je bude postupne prepinat na --cn-*; do te doby
                  se hodnoty --legacy-* NEMENI.
   ============================================================================ */

:root {
  /* ---- plochy ---- */
  --cn-bg: #0B0E12;          /* zakladni plocha stranky */
  --cn-panel: #11161D;       /* panel, karta, pole formulare */
  --cn-raised: #19212B;      /* zvysena plocha, aktivni polozka, stavovy box */
  --cn-line: #27303A;        /* jemny oddelovac a ramecek */
  --cn-grid: #202A34;        /* mrizka grafu, nejjemnejsi linka */
  --cn-field-line: #64707F;  /* okraj pole formulare: 3,6 : 1 k panelu (prototyp ma #27303A = 1,5 : 1, to je pod 3 : 1 pro ovladaci prvky) */
  --cn-field-line-hover: #7C8898; /* okraj pole pod mysi */
  --cn-shot-bg: #0F131A;     /* podklad pod snimkem grafu (barva pozadi TradingView) */

  /* ---- text ---- */
  --cn-text: #F0F3F6;        /* bezny text (kontrast k --cn-bg 17,4 : 1, k panelu 16,3 : 1) */
  --cn-muted: #9AA7B7;       /* sekundarni text (7,9 : 1 k bg, 7,4 : 1 k panelu, 6,6 : 1 k raised) */

  /* ---- identita ---- */
  --cn-gold: #F3C64E;        /* hlavni akce a dulezity aktivni prvek */
  --cn-gold-strong: #F7D373; /* hover hlavni akce */
  --cn-on-gold: #171B21;     /* text na zlatem tlacitku (10,7 : 1) */

  /* ---- stav (barva vzdy doprovazi slovni stav, nikdy ho nenahrazuje) ---- */
  --cn-green: #56D6B0;
  --cn-red: #F0818F;
  --cn-blue: #80B2EF;
  --cn-red-bg: rgba(240, 129, 143, 0.10);
  --cn-green-bg: rgba(86, 214, 176, 0.10);
  --cn-gold-bg: rgba(243, 198, 78, 0.10);

  /* ---- typografie ---- */
  --cn-font: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
  --cn-font-logo: Oswald, "Arial Narrow", Arial, sans-serif; /* jen logo = soucasny asset webu */
  --cn-fs-min: 11px;         /* minimum */
  --cn-fs-small: 12px;       /* sekundarni text */
  --cn-fs-body: 14px;        /* bezny text */
  --cn-fs-lead: 15px;        /* perex */
  --cn-fs-h3: 15px;
  --cn-fs-h2: 23px;
  --cn-fs-h1: clamp(30px, 4.7vw, 54px);
  --cn-lh: 1.5;
  --cn-lh-text: 1.7;

  /* ---- radiusy ---- */
  --cn-r-sm: 5px;
  --cn-r-md: 7px;
  --cn-r-lg: 9px;
  --cn-r-xl: 13px;

  /* ---- rozestupy (krok 4 px) ---- */
  --cn-s-1: 4px;
  --cn-s-2: 8px;
  --cn-s-3: 12px;
  --cn-s-4: 16px;
  --cn-s-5: 20px;
  --cn-s-6: 24px;
  --cn-s-8: 32px;
  --cn-s-10: 40px;
  --cn-s-14: 56px;

  /* ---- ovladani ---- */
  --cn-control-h: 40px;      /* vyska tlacitka / pole */
  --cn-touch: 44px;          /* cil na dotykove obrazovce */
  --cn-focus-ring: 2px solid var(--cn-gold);
  --cn-focus-offset: 3px;

  /* ---- layout ---- */
  --cn-maxw: 1180px;         /* sirka obsahu landingu */
  --cn-maxw-form: 470px;     /* sirka pristupovych formularu */
  --cn-gutter: 32px;
  --cn-gutter-sm: 16px;

  /* ==========================================================================
     LEGACY — dosavadni vzhled (styles.css z nich cte; NEMENIT bez etapy 1b)
     ========================================================================== */
  --legacy-bg-page: #050505;
  --legacy-glow-teal: #0a3a30;
  --legacy-glow-gold: #2d2a00;
  --legacy-text-primary: #FFFFFF;
  --legacy-text-muted: #8a99a8;
  --legacy-accent: #F5C518;
  --legacy-accent-hover: #ffd84a;
  --legacy-cta-gradient: linear-gradient(135deg, #D4AF37, #C8A000);
  --legacy-cta-text: #0a0a0a;
  --legacy-card-bg: rgba(26, 37, 53, 0.85);
  --legacy-card-bg-solid: #1a2535;
  --legacy-field-bg: #0f1a28;
  --legacy-field-border: #2a3a4a;
  --legacy-field-border-focus: #F5C518;
  --legacy-nav-bg: rgba(10, 10, 10, 0.8);
  --legacy-font-display: 'Oswald', sans-serif;
  --legacy-font-body: 'Inter', sans-serif;
  --legacy-transition: 0.3s ease;
}