/* ============================================================
   Mefos Pay — Design System v1
   Используется во всех публичных страницах
   ============================================================ */
:root {
  /* Фоны */
  --bg:        #07070a;
  --bg2:       #0a0a10;
  --card:      rgba(18,18,24,.7);
  --card-solid:#101013;
  --card-hover:rgba(24,24,32,.9);

  /* Границы */
  --border:    rgba(255,255,255,.06);
  --border-2:  rgba(255,255,255,.10);
  --border-3:  rgba(255,255,255,.16);

  /* Текст */
  --text:      #f4f4f5;
  --text-2:    #a1a1aa;
  --dim:       #71717a;
  --dim-2:     #52525b;

  /* Акценты */
  --accent:    #6366f1;
  --accent-2:  #a78bfa;
  --accent-hi: #818cf8;
  --accent-bg: rgba(99,102,241,.12);

  /* Семантика */
  --green:     #4ade80;
  --red:       #f87171;
  --amber:     #fbbf24;
  --cyan:      #22d3ee;

  /* Тени */
  --shadow-sm: 0 2px 8px rgba(0,0,0,.3);
  --shadow:    0 8px 32px rgba(0,0,0,.5);
  --shadow-lg: 0 20px 60px rgba(0,0,0,.6);

  /* Радиусы */
  --r-sm: .375rem;
  --r:    .5rem;
  --r-md: .75rem;
  --r-lg: 1rem;
  --r-xl: 1.25rem;

  /* Шрифты */
  --sans: 'Inter', -apple-system, system-ui, sans-serif;
  --mono: 'JetBrains Mono', ui-monospace, 'SF Mono', Menlo, monospace;

  /* Transitions */
  --t: .15s ease;
}

* { box-sizing: border-box; margin: 0; padding: 0; -webkit-font-smoothing: antialiased; }
html, body { background: var(--bg); color: var(--text); font-family: var(--sans); min-height: 100vh; }
body::before {
  content: ''; position: fixed; inset: 0; pointer-events: none; z-index: 0;
  background:
    radial-gradient(ellipse 80% 50% at 20% -10%, rgba(99,102,241,.12), transparent 60%),
    radial-gradient(ellipse 60% 40% at 90% 0%, rgba(167,139,250,.08), transparent 50%),
    radial-gradient(ellipse 40% 30% at 60% 110%, rgba(34,211,238,.05), transparent 60%);
}
body > * { position: relative; z-index: 1; }

a { color: var(--accent-hi); text-decoration: none; transition: color var(--t); }
a:hover { color: var(--accent-2); }

::selection { background: rgba(129,140,248,.3); color: #fff; }
::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: rgba(255,255,255,.08); border-radius: 4px; }
::-webkit-scrollbar-thumb:hover { background: rgba(255,255,255,.15); }

code, kbd, pre { font-family: var(--mono); }
code { background: rgba(255,255,255,.04); padding: .15rem .4rem; border-radius: .3rem; font-size: .85em; }