/* style.css — общая тема Generation Endeavour Fund
   v2 — типографика (display / body / mono), единая система движения,
   слоистые тени, доступность (focus-visible, reduced-motion), скелетоны. */
:root{
  /* ── Поверхности ─────────────────────────────────────────────── */
  --bg:#EDEFF3; --surface:#FFFFFF; --ink:#16181D; --muted:#5E6675;
  --line:#E5E7EE; --line-soft:#EEF0F5;
  --accent:#1F232C; --accent-2:#3A3F4B; --accent-soft:#EAECF2;
  --up:#0BA574; --down:#EE4257; --gold:#C9922E;
  --glass:rgba(255,255,255,.72);
  --glass-strong:rgba(255,255,255,.88);

  --radius:16px; --radius-sm:12px; --radius-lg:22px;

  /* ── Тени: мягкая «плавающая» глубина ────────────────────────── */
  --shadow-xs:0 1px 2px rgba(18,21,28,.05);
  --shadow-sm:0 1px 2px rgba(18,21,28,.05), 0 6px 16px -8px rgba(18,21,28,.12);
  --shadow:0 2px 6px rgba(18,21,28,.05), 0 14px 30px -12px rgba(18,21,28,.14), 0 44px 72px -34px rgba(18,21,28,.20);
  --shadow-lg:0 4px 10px rgba(18,21,28,.06), 0 24px 48px -16px rgba(18,21,28,.18), 0 64px 100px -48px rgba(18,21,28,.26);
  --ring:0 0 0 3px var(--accent-soft);

  /* ── Единая система движения ─────────────────────────────────── */
  --ease-out:cubic-bezier(.22,.61,.36,1);
  --ease-spring:cubic-bezier(.34,1.4,.5,1);
  --ease-smooth:cubic-bezier(.65,.05,.36,1);
  --dur-xs:.12s; --dur:.2s; --dur-lg:.34s; --dur-xl:.55s;

  /* ── Типографика ─────────────────────────────────────────────── */
  --font-display:'Bricolage Grotesque','Space Grotesk','Inter',system-ui,sans-serif;
  --font-body:'Plus Jakarta Sans','Inter',system-ui,-apple-system,sans-serif;
  --font-mono:'JetBrains Mono','SF Mono',ui-monospace,'Roboto Mono',monospace;

  --text-2xl:clamp(24px,4.4vw,34px);
  --text-xl:clamp(19px,2.6vw,23px);
  --text-lg:clamp(16px,1.8vw,18px);
  --text-base:15.5px; --text-sm:13.5px; --text-xs:12px; --text-2xs:10.5px;
  --leading:1.58; --leading-tight:1.22;
  --track-tight:-.025em; --track-wide:.06em;
}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%; text-size-adjust:100%; scroll-behavior:smooth}
body{
  margin:0; background:var(--bg); color:var(--ink);
  font-family:var(--font-body); font-size:var(--text-base); line-height:var(--leading);
  -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale;
  font-feature-settings:'kern' 1,'liga' 1;
  text-rendering:optimizeLegibility;
}
h1,h2,h3,.brand{
  font-family:var(--font-display); letter-spacing:var(--track-tight);
  margin:0; line-height:var(--leading-tight); font-weight:700;
  font-optical-sizing:auto;
}
a{color:inherit; text-decoration:none}
::selection{background:rgba(11,165,116,.18); color:var(--ink)}

/* Тонкий скроллбар */
*{scrollbar-width:thin; scrollbar-color:#CDD2DD transparent}
::-webkit-scrollbar{width:8px; height:8px}
::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-thumb{background:#CDD2DD; border-radius:99px; border:2px solid transparent; background-clip:padding-box}
::-webkit-scrollbar-thumb:hover{background:#B4BBCA; background-clip:padding-box}

.brand{display:inline-flex; align-items:center; gap:9px; font-weight:700; font-size:20px}
.brand .lock{
  width:26px; height:26px; display:grid; place-items:center;
  background:var(--accent-soft); border-radius:8px; color:var(--accent);
}

/* ── Кнопки ────────────────────────────────────────────────────── */
.btn{
  position:relative; overflow:hidden;
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  font-weight:600; font-size:var(--text-base); padding:12px 20px; border-radius:12px;
  border:1px solid transparent; cursor:pointer; font-family:inherit;
  transition:transform var(--dur) var(--ease-spring), box-shadow var(--dur) var(--ease-out),
             background var(--dur) var(--ease-out), filter var(--dur) var(--ease-out);
}
.btn:focus-visible{outline:none; box-shadow:var(--ring)}
.btn:active:not(:disabled){transform:scale(.97)}
.btn:disabled{opacity:.6; cursor:not-allowed; transform:none!important}
.btn-primary{
  background:linear-gradient(135deg,#3A3F4B,#181B21); color:#fff;
  box-shadow:0 10px 24px -8px rgba(18,21,28,.5), inset 0 1px 0 rgba(255,255,255,.14);
}
.btn-primary:hover:not(:disabled){transform:translateY(-2px); box-shadow:0 16px 32px -10px rgba(18,21,28,.55), inset 0 1px 0 rgba(255,255,255,.14)}
.btn-ghost{background:var(--surface); color:var(--ink); border-color:var(--line)}
.btn-ghost:hover:not(:disabled){transform:translateY(-1px); box-shadow:var(--shadow-sm)}

/* Волна нажатия (создаётся скриптом) */
.ripple{
  position:absolute; border-radius:50%; transform:scale(0); pointer-events:none;
  background:currentColor; opacity:.2; animation:rippleOut .6s var(--ease-out) forwards;
}
@keyframes rippleOut{to{transform:scale(2.8); opacity:0}}

/* ── Поля ──────────────────────────────────────────────────────── */
.field{margin-bottom:16px}
.field label{display:block; font-size:var(--text-sm); font-weight:600; color:var(--muted); margin-bottom:7px}
.field input{
  width:100%; padding:12px 14px; border:1px solid var(--line); border-radius:11px; font:inherit;
  background:var(--surface); color:var(--ink);
  transition:border var(--dur) var(--ease-out), box-shadow var(--dur) var(--ease-out);
}
.field input::placeholder{color:#9CA3AF}
.field input:focus{outline:none; border-color:var(--accent); box-shadow:var(--ring)}

.alert{padding:11px 14px; border-radius:10px; font-size:var(--text-sm); margin-bottom:16px; line-height:1.45}
.alert-err{background:#FEF2F2; color:#9B1C1C; border:1px solid #FECACA}
.risk-note{font-size:var(--text-xs); color:var(--muted); line-height:1.55}

/* ── Числа: моноширинные, табличные ────────────────────────────── */
.tabnum,.chg,.deal b,.acct .v{
  font-family:var(--font-mono); font-variant-numeric:tabular-nums;
  font-feature-settings:'tnum' 1,'zero' 1; letter-spacing:-.02em;
}

/* ── Иконки активов ────────────────────────────────────────────── */
.aic{
  width:34px; height:34px; border-radius:11px; display:grid; place-items:center;
  flex-shrink:0; position:relative; overflow:hidden;
  box-shadow:0 2px 8px rgba(20,22,28,.1), inset 0 1px 0 rgba(255,255,255,.35);
  transition:transform var(--dur) var(--ease-spring);
}
.aic .cat-dot{
  position:absolute; bottom:2px; right:2px; width:7px; height:7px;
  border-radius:50%; border:1.5px solid #fff; z-index:3;
}
.aic-logo{background:#fff!important; box-shadow:inset 0 0 0 1px rgba(20,22,28,.08), 0 2px 8px rgba(20,22,28,.1)!important}
.aic-logo img{width:62%; height:62%; object-fit:contain; position:relative; z-index:1}
.aic.coin{border-radius:50%; box-shadow:0 3px 10px rgba(20,22,28,.18), inset 0 1px 0 rgba(255,255,255,.28)}
.aic-tile{color:#fff}
.aic-tile svg,.aic svg{max-width:62%;max-height:62%;display:block;position:relative;z-index:1}
.aic-lbl{position:relative;z-index:0;line-height:1;transition:opacity .15s ease}
.aic img.aic-real,.aic img.aic-img{
  position:absolute;inset:0;margin:auto;max-width:100%;max-height:100%;width:auto;height:auto;
  object-fit:contain;z-index:2;border-radius:inherit;pointer-events:none;
}
.aic-fx{
  display:grid!important; grid-template-columns:1fr 1fr; padding:0!important;
  background:none!important; gap:0; box-shadow:0 2px 8px rgba(20,22,28,.12)!important;
}
.aic-fx .fi{
  width:100%!important; height:100%!important; border-radius:0!important;
  background-size:cover!important; line-height:normal;
}
.aic-fx .fi:first-child{border-radius:11px 0 0 11px}
.aic-fx .fi:last-child{border-radius:0 11px 11px 0}

/* ── Скелетоны загрузки ────────────────────────────────────────── */
.skel{
  position:relative; overflow:hidden; border-radius:10px;
  background:linear-gradient(90deg,var(--line-soft) 0%,#F7F8FB 50%,var(--line-soft) 100%);
  background-size:200% 100%; animation:skelSweep 1.3s linear infinite;
}
@keyframes skelSweep{to{background-position:-200% 0}}

/* ── Уважение к системным настройкам движения ──────────────────── */
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{
    animation-duration:.001ms!important; animation-iteration-count:1!important;
    transition-duration:.001ms!important; scroll-behavior:auto!important;
  }
}